build: compile 1.10.14

dist/dropdown-item/index.js

@@ -30,12 +30,17 @@ VantComponent({
             type: Boolean,
             value: false,
         },
+        rootPortal: {
+            type: Boolean,
+            value: false,
+        },
     },
     data: {
         transition: true,
         showPopup: false,
         showWrapper: false,
         displayTitle: '',
+        safeAreaTabBar: false,
     },
     methods: {
         rerender() {
@@ -46,13 +51,14 @@ VantComponent({
         },
         updateDataFromParent() {
             if (this.parent) {
-                const { overlay, duration, activeColor, closeOnClickOverlay, direction, } = this.parent.data;
+                const { overlay, duration, activeColor, closeOnClickOverlay, direction, safeAreaTabBar, } = this.parent.data;
                 this.setData({
                     overlay,
                     duration,
                     activeColor,
                     closeOnClickOverlay,
                     direction,
+                    safeAreaTabBar,
                 });
             }
         },

dist/dropdown-item/index.wxml

@@ -12,7 +12,9 @@
     overlay="{{ overlay }}"
     position="{{ direction === 'down' ? 'top' : 'bottom' }}"
     duration="{{ transition ? duration : 0 }}"
+    safe-area-tab-bar="{{ safeAreaTabBar }}"
     close-on-click-overlay="{{ closeOnClickOverlay }}"
+    rootPortal="{{ rootPortal }}"
     bind:enter="onOpen"
     bind:leave="onClose"
     bind:close="toggle"

dist/dropdown-menu/index.js

@@ -32,6 +32,10 @@ VantComponent({
             value: 'down',
             observer: 'updateChildrenData',
         },
+        safeAreaTabBar: {
+            type: Boolean,
+            value: false,
+        },
         closeOnClickOverlay: {
             type: Boolean,
             value: true,

dist/icon/index.wxs

@@ -13,6 +13,10 @@ function rootClass(data) {
     classes.push(data.classPrefix);
   }
 
+  if (data.classPrefix !== 'van-icon') {
+    classes.push('van-icon')
+  }
+
   if (isImage(data.name)) {
     classes.push('van-icon--image');
   } else if (data.classPrefix != null) {

dist/overlay/index.js

@@ -15,6 +15,10 @@ VantComponent({
             type: Boolean,
             value: true,
         },
+        rootPortal: {
+            type: Boolean,
+            value: false,
+        },
     },
     methods: {
         onClick() {

dist/overlay/index.wxml

@@ -1,21 +1,7 @@
-<van-transition
+<import src="./overlay.wxml" />
-  wx:if="{{ lockScroll }}"
+
-  show="{{ show }}"
+<root-portal wx:if="{{ rootPortal }}">
-  custom-class="van-overlay custom-class"
+  <include src="./overlay.wxml" />
-  custom-style="z-index: {{ zIndex }}; {{ customStyle }}"
+</root-portal>
-  duration="{{ duration }}"
+
-  bind:tap="onClick"
+<include wx:else src="./overlay.wxml" />
-  catch:touchmove="noop"
->
-  <slot></slot>
-</van-transition>
-<van-transition
-  wx:else
-  show="{{ show }}"
-  custom-class="van-overlay custom-class"
-  custom-style="z-index: {{ zIndex }}; {{ customStyle }}"
-  duration="{{ duration }}"
-  bind:tap="onClick"
->
-  <slot></slot>
-</van-transition>

dist/overlay/overlay.wxml

@@ -0,0 +1,10 @@
+<van-transition
+  show="{{ show }}"
+  custom-class="van-overlay custom-class"
+  custom-style="z-index: {{ zIndex }}; {{ customStyle }}"
+  duration="{{ duration }}"
+  bind:tap="onClick"
+  catch:touchmove="{{ lockScroll ? 'noop' : ''}}"
+>
+  <slot></slot>
+</van-transition>

dist/popup/index.js

@@ -61,6 +61,10 @@ VantComponent({
             type: Boolean,
             value: true,
         },
+        rootPortal: {
+            type: Boolean,
+            value: false,
+        },
     },
     created() {
         this.observeClass();

dist/popup/index.wxml

@@ -1,6 +1,8 @@
 <wxs src="../wxs/utils.wxs" module="utils" />
 <wxs src="./index.wxs" module="computed" />
 
+<import src="./popup.wxml" />
+
 <van-overlay
   wx:if="{{ overlay }}"
   show="{{ show }}"
@@ -9,18 +11,11 @@
   duration="{{ duration }}"
   bind:click="onClickOverlay"
   lock-scroll="{{ lockScroll }}"
+  root-portal="{{ rootPortal }}"
 />
-<view
+
-  wx:if="{{ inited }}"
+<root-portal wx:if="{{ rootPortal }}">
-  class="custom-class {{ classes }} {{ utils.bem('popup', [position, { round, safe: safeAreaInsetBottom, safeTop: safeAreaInsetTop, safeTabBar: safeAreaTabBar }]) }}"
+  <include src="./popup.wxml" />
-  style="{{ computed.popupStyle({ zIndex, currentDuration, display, customStyle }) }}"
+</root-portal>
-  bind:transitionend="onTransitionEnd"
+
->
+ <include wx:else src="./popup.wxml" />
-  <slot />
-  <van-icon
-    wx:if="{{ closeable }}"
-    name="{{ closeIcon }}"
-    class="close-icon-class van-popup__close-icon van-popup__close-icon--{{ closeIconPosition }}"
-    bind:tap="onClickCloseIcon"
-  />
-</view>

dist/popup/index.wxss

@@ -1 +1 @@
-@import '../common/index.wxss';.van-popup{-webkit-overflow-scrolling:touch;animation:ease both;background-color:var(--popup-background-color,#fff);box-sizing:border-box;max-height:100%;overflow-y:auto;position:fixed;transition-timing-function:ease}.van-popup--center{left:50%;top:50%;transform:translate3d(-50%,-50%,0)}.van-popup--center.van-popup--round{border-radius:var(--popup-round-border-radius,16px)}.van-popup--top{left:0;top:0;width:100%}.van-popup--top.van-popup--round{border-radius:0 0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px))}.van-popup--right{right:0;top:50%;transform:translate3d(0,-50%,0)}.van-popup--right.van-popup--round{border-radius:var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0 0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px))}.van-popup--bottom{bottom:0;left:0;width:100%}.van-popup--bottom.van-popup--round{border-radius:var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0 0}.van-popup--left{left:0;top:50%;transform:translate3d(0,-50%,0)}.van-popup--left.van-popup--round{border-radius:0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0}.van-popup--bottom.van-popup--safe{padding-bottom:env(safe-area-inset-bottom)}.van-popup--bottom.van-popup--safeTabBar{bottom:var(--tabbar-height,50px)}.van-popup--safeTop{padding-top:env(safe-area-inset-top)}.van-popup__close-icon{color:var(--popup-close-icon-color,#969799);font-size:var(--popup-close-icon-size,18px);position:absolute;z-index:var(--popup-close-icon-z-index,1)}.van-popup__close-icon--top-left{left:var(--popup-close-icon-margin,16px);top:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--top-right{right:var(--popup-close-icon-margin,16px);top:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--bottom-left{bottom:var(--popup-close-icon-margin,16px);left:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--bottom-right{bottom:var(--popup-close-icon-margin,16px);right:var(--popup-close-icon-margin,16px)}.van-popup__close-icon:active{opacity:.6}.van-scale-enter-active,.van-scale-leave-active{transition-property:opacity,transform}.van-scale-enter,.van-scale-leave-to{opacity:0;transform:translate3d(-50%,-50%,0) scale(.7)}.van-fade-enter-active,.van-fade-leave-active{transition-property:opacity}.van-fade-enter,.van-fade-leave-to{opacity:0}.van-center-enter-active,.van-center-leave-active{transition-property:opacity}.van-center-enter,.van-center-leave-to{opacity:0}.van-bottom-enter-active,.van-bottom-leave-active,.van-left-enter-active,.van-left-leave-active,.van-right-enter-active,.van-right-leave-active,.van-top-enter-active,.van-top-leave-active{transition-property:transform}.van-bottom-enter,.van-bottom-leave-to{transform:translate3d(0,100%,0)}.van-top-enter,.van-top-leave-to{transform:translate3d(0,-100%,0)}.van-left-enter,.van-left-leave-to{transform:translate3d(-100%,-50%,0)}.van-right-enter,.van-right-leave-to{transform:translate3d(100%,-50%,0)}
+@import '../common/index.wxss';.van-popup{-webkit-overflow-scrolling:touch;animation:ease both;background-color:var(--popup-background-color,#fff);box-sizing:border-box;max-height:100%;overflow-y:auto;position:fixed;transition-timing-function:ease}.van-popup--center{left:50%;top:50%;transform:translate3d(-50%,-50%,0)}.van-popup--center.van-popup--round{border-radius:var(--popup-round-border-radius,16px)}.van-popup--top{left:0;top:0;width:100%}.van-popup--top.van-popup--round{border-radius:0 0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px))}.van-popup--right{right:0;top:50%;transform:translate3d(0,-50%,0)}.van-popup--right.van-popup--round{border-radius:var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0 0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px))}.van-popup--bottom{bottom:0;left:0;width:100%}.van-popup--bottom.van-popup--round{border-radius:var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0 0}.van-popup--left{left:0;top:50%;transform:translate3d(0,-50%,0)}.van-popup--left.van-popup--round{border-radius:0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0}.van-popup--bottom.van-popup--safe{padding-bottom:env(safe-area-inset-bottom)}.van-popup--bottom.van-popup--safeTabBar,.van-popup--top.van-popup--safeTabBar{bottom:var(--tabbar-height,50px)}.van-popup--safeTop{padding-top:env(safe-area-inset-top)}.van-popup__close-icon{color:var(--popup-close-icon-color,#969799);font-size:var(--popup-close-icon-size,18px);position:absolute;z-index:var(--popup-close-icon-z-index,1)}.van-popup__close-icon--top-left{left:var(--popup-close-icon-margin,16px);top:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--top-right{right:var(--popup-close-icon-margin,16px);top:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--bottom-left{bottom:var(--popup-close-icon-margin,16px);left:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--bottom-right{bottom:var(--popup-close-icon-margin,16px);right:var(--popup-close-icon-margin,16px)}.van-popup__close-icon:active{opacity:.6}.van-scale-enter-active,.van-scale-leave-active{transition-property:opacity,transform}.van-scale-enter,.van-scale-leave-to{opacity:0;transform:translate3d(-50%,-50%,0) scale(.7)}.van-fade-enter-active,.van-fade-leave-active{transition-property:opacity}.van-fade-enter,.van-fade-leave-to{opacity:0}.van-center-enter-active,.van-center-leave-active{transition-property:opacity}.van-center-enter,.van-center-leave-to{opacity:0}.van-bottom-enter-active,.van-bottom-leave-active,.van-left-enter-active,.van-left-leave-active,.van-right-enter-active,.van-right-leave-active,.van-top-enter-active,.van-top-leave-active{transition-property:transform}.van-bottom-enter,.van-bottom-leave-to{transform:translate3d(0,100%,0)}.van-top-enter,.van-top-leave-to{transform:translate3d(0,-100%,0)}.van-left-enter,.van-left-leave-to{transform:translate3d(-100%,-50%,0)}.van-right-enter,.van-right-leave-to{transform:translate3d(100%,-50%,0)}

dist/popup/popup.wxml

@@ -0,0 +1,14 @@
+<view
+  wx:if="{{ inited }}"
+  class="custom-class {{ classes }} {{ utils.bem('popup', [position, { round, safe: safeAreaInsetBottom, safeTop: safeAreaInsetTop, safeTabBar: safeAreaTabBar }]) }}"
+  style="{{ computed.popupStyle({ zIndex, currentDuration, display, customStyle }) }}"
+  bind:transitionend="onTransitionEnd"
+>
+  <slot />
+  <van-icon
+    wx:if="{{ closeable }}"
+    name="{{ closeIcon }}"
+    class="close-icon-class van-popup__close-icon van-popup__close-icon--{{ closeIconPosition }}"
+    bind:tap="onClickCloseIcon"
+  />
+</view>

lib/dropdown-item/index.js

@@ -32,12 +32,17 @@ var component_1 = require("../common/component");
             type: Boolean,
             value: false,
         },
+        rootPortal: {
+            type: Boolean,
+            value: false,
+        },
     },
     data: {
         transition: true,
         showPopup: false,
         showWrapper: false,
         displayTitle: '',
+        safeAreaTabBar: false,
     },
     methods: {
         rerender: function () {
@@ -49,13 +54,14 @@ var component_1 = require("../common/component");
         },
         updateDataFromParent: function () {
             if (this.parent) {
-                var _a = this.parent.data, overlay = _a.overlay, duration = _a.duration, activeColor = _a.activeColor, closeOnClickOverlay = _a.closeOnClickOverlay, direction = _a.direction;
+                var _a = this.parent.data, overlay = _a.overlay, duration = _a.duration, activeColor = _a.activeColor, closeOnClickOverlay = _a.closeOnClickOverlay, direction = _a.direction, safeAreaTabBar = _a.safeAreaTabBar;
                 this.setData({
                     overlay: overlay,
                     duration: duration,
                     activeColor: activeColor,
                     closeOnClickOverlay: closeOnClickOverlay,
                     direction: direction,
+                    safeAreaTabBar: safeAreaTabBar,
                 });
             }
         },

lib/dropdown-item/index.wxml

@@ -12,7 +12,9 @@
     overlay="{{ overlay }}"
     position="{{ direction === 'down' ? 'top' : 'bottom' }}"
     duration="{{ transition ? duration : 0 }}"
+    safe-area-tab-bar="{{ safeAreaTabBar }}"
     close-on-click-overlay="{{ closeOnClickOverlay }}"
+    rootPortal="{{ rootPortal }}"
     bind:enter="onOpen"
     bind:leave="onClose"
     bind:close="toggle"

lib/dropdown-menu/index.js

@@ -34,6 +34,10 @@ var ARRAY = [];
             value: 'down',
             observer: 'updateChildrenData',
         },
+        safeAreaTabBar: {
+            type: Boolean,
+            value: false,
+        },
         closeOnClickOverlay: {
             type: Boolean,
             value: true,

lib/icon/index.wxs

@@ -13,6 +13,10 @@ function rootClass(data) {
     classes.push(data.classPrefix);
   }
 
+  if (data.classPrefix !== 'van-icon') {
+    classes.push('van-icon')
+  }
+
   if (isImage(data.name)) {
     classes.push('van-icon--image');
   } else if (data.classPrefix != null) {

lib/overlay/index.js

@@ -17,6 +17,10 @@ var component_1 = require("../common/component");
             type: Boolean,
             value: true,
         },
+        rootPortal: {
+            type: Boolean,
+            value: false,
+        },
     },
     methods: {
         onClick: function () {

lib/overlay/index.wxml

@@ -1,21 +1,7 @@
-<van-transition
+<import src="./overlay.wxml" />
-  wx:if="{{ lockScroll }}"
+
-  show="{{ show }}"
+<root-portal wx:if="{{ rootPortal }}">
-  custom-class="van-overlay custom-class"
+  <include src="./overlay.wxml" />
-  custom-style="z-index: {{ zIndex }}; {{ customStyle }}"
+</root-portal>
-  duration="{{ duration }}"
+
-  bind:tap="onClick"
+<include wx:else src="./overlay.wxml" />
-  catch:touchmove="noop"
->
-  <slot></slot>
-</van-transition>
-<van-transition
-  wx:else
-  show="{{ show }}"
-  custom-class="van-overlay custom-class"
-  custom-style="z-index: {{ zIndex }}; {{ customStyle }}"
-  duration="{{ duration }}"
-  bind:tap="onClick"
->
-  <slot></slot>
-</van-transition>

lib/overlay/overlay.wxml

@@ -0,0 +1,10 @@
+<van-transition
+  show="{{ show }}"
+  custom-class="van-overlay custom-class"
+  custom-style="z-index: {{ zIndex }}; {{ customStyle }}"
+  duration="{{ duration }}"
+  bind:tap="onClick"
+  catch:touchmove="{{ lockScroll ? 'noop' : ''}}"
+>
+  <slot></slot>
+</van-transition>

lib/popup/index.js

@@ -63,6 +63,10 @@ var transition_1 = require("../mixins/transition");
             type: Boolean,
             value: true,
         },
+        rootPortal: {
+            type: Boolean,
+            value: false,
+        },
     },
     created: function () {
         this.observeClass();

lib/popup/index.wxml

@@ -1,6 +1,8 @@
 <wxs src="../wxs/utils.wxs" module="utils" />
 <wxs src="./index.wxs" module="computed" />
 
+<import src="./popup.wxml" />
+
 <van-overlay
   wx:if="{{ overlay }}"
   show="{{ show }}"
@@ -9,18 +11,11 @@
   duration="{{ duration }}"
   bind:click="onClickOverlay"
   lock-scroll="{{ lockScroll }}"
+  root-portal="{{ rootPortal }}"
 />
-<view
+
-  wx:if="{{ inited }}"
+<root-portal wx:if="{{ rootPortal }}">
-  class="custom-class {{ classes }} {{ utils.bem('popup', [position, { round, safe: safeAreaInsetBottom, safeTop: safeAreaInsetTop, safeTabBar: safeAreaTabBar }]) }}"
+  <include src="./popup.wxml" />
-  style="{{ computed.popupStyle({ zIndex, currentDuration, display, customStyle }) }}"
+</root-portal>
-  bind:transitionend="onTransitionEnd"
+
->
+ <include wx:else src="./popup.wxml" />
-  <slot />
-  <van-icon
-    wx:if="{{ closeable }}"
-    name="{{ closeIcon }}"
-    class="close-icon-class van-popup__close-icon van-popup__close-icon--{{ closeIconPosition }}"
-    bind:tap="onClickCloseIcon"
-  />
-</view>

lib/popup/index.wxss

@@ -1 +1 @@
-@import '../common/index.wxss';.van-popup{-webkit-overflow-scrolling:touch;animation:ease both;background-color:var(--popup-background-color,#fff);box-sizing:border-box;max-height:100%;overflow-y:auto;position:fixed;transition-timing-function:ease}.van-popup--center{left:50%;top:50%;transform:translate3d(-50%,-50%,0)}.van-popup--center.van-popup--round{border-radius:var(--popup-round-border-radius,16px)}.van-popup--top{left:0;top:0;width:100%}.van-popup--top.van-popup--round{border-radius:0 0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px))}.van-popup--right{right:0;top:50%;transform:translate3d(0,-50%,0)}.van-popup--right.van-popup--round{border-radius:var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0 0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px))}.van-popup--bottom{bottom:0;left:0;width:100%}.van-popup--bottom.van-popup--round{border-radius:var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0 0}.van-popup--left{left:0;top:50%;transform:translate3d(0,-50%,0)}.van-popup--left.van-popup--round{border-radius:0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0}.van-popup--bottom.van-popup--safe{padding-bottom:env(safe-area-inset-bottom)}.van-popup--bottom.van-popup--safeTabBar{bottom:var(--tabbar-height,50px)}.van-popup--safeTop{padding-top:env(safe-area-inset-top)}.van-popup__close-icon{color:var(--popup-close-icon-color,#969799);font-size:var(--popup-close-icon-size,18px);position:absolute;z-index:var(--popup-close-icon-z-index,1)}.van-popup__close-icon--top-left{left:var(--popup-close-icon-margin,16px);top:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--top-right{right:var(--popup-close-icon-margin,16px);top:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--bottom-left{bottom:var(--popup-close-icon-margin,16px);left:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--bottom-right{bottom:var(--popup-close-icon-margin,16px);right:var(--popup-close-icon-margin,16px)}.van-popup__close-icon:active{opacity:.6}.van-scale-enter-active,.van-scale-leave-active{transition-property:opacity,transform}.van-scale-enter,.van-scale-leave-to{opacity:0;transform:translate3d(-50%,-50%,0) scale(.7)}.van-fade-enter-active,.van-fade-leave-active{transition-property:opacity}.van-fade-enter,.van-fade-leave-to{opacity:0}.van-center-enter-active,.van-center-leave-active{transition-property:opacity}.van-center-enter,.van-center-leave-to{opacity:0}.van-bottom-enter-active,.van-bottom-leave-active,.van-left-enter-active,.van-left-leave-active,.van-right-enter-active,.van-right-leave-active,.van-top-enter-active,.van-top-leave-active{transition-property:transform}.van-bottom-enter,.van-bottom-leave-to{transform:translate3d(0,100%,0)}.van-top-enter,.van-top-leave-to{transform:translate3d(0,-100%,0)}.van-left-enter,.van-left-leave-to{transform:translate3d(-100%,-50%,0)}.van-right-enter,.van-right-leave-to{transform:translate3d(100%,-50%,0)}
+@import '../common/index.wxss';.van-popup{-webkit-overflow-scrolling:touch;animation:ease both;background-color:var(--popup-background-color,#fff);box-sizing:border-box;max-height:100%;overflow-y:auto;position:fixed;transition-timing-function:ease}.van-popup--center{left:50%;top:50%;transform:translate3d(-50%,-50%,0)}.van-popup--center.van-popup--round{border-radius:var(--popup-round-border-radius,16px)}.van-popup--top{left:0;top:0;width:100%}.van-popup--top.van-popup--round{border-radius:0 0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px))}.van-popup--right{right:0;top:50%;transform:translate3d(0,-50%,0)}.van-popup--right.van-popup--round{border-radius:var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0 0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px))}.van-popup--bottom{bottom:0;left:0;width:100%}.van-popup--bottom.van-popup--round{border-radius:var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0 0}.van-popup--left{left:0;top:50%;transform:translate3d(0,-50%,0)}.van-popup--left.van-popup--round{border-radius:0 var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) var(--popup-round-border-radius,var(--popup-round-border-radius,16px)) 0}.van-popup--bottom.van-popup--safe{padding-bottom:env(safe-area-inset-bottom)}.van-popup--bottom.van-popup--safeTabBar,.van-popup--top.van-popup--safeTabBar{bottom:var(--tabbar-height,50px)}.van-popup--safeTop{padding-top:env(safe-area-inset-top)}.van-popup__close-icon{color:var(--popup-close-icon-color,#969799);font-size:var(--popup-close-icon-size,18px);position:absolute;z-index:var(--popup-close-icon-z-index,1)}.van-popup__close-icon--top-left{left:var(--popup-close-icon-margin,16px);top:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--top-right{right:var(--popup-close-icon-margin,16px);top:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--bottom-left{bottom:var(--popup-close-icon-margin,16px);left:var(--popup-close-icon-margin,16px)}.van-popup__close-icon--bottom-right{bottom:var(--popup-close-icon-margin,16px);right:var(--popup-close-icon-margin,16px)}.van-popup__close-icon:active{opacity:.6}.van-scale-enter-active,.van-scale-leave-active{transition-property:opacity,transform}.van-scale-enter,.van-scale-leave-to{opacity:0;transform:translate3d(-50%,-50%,0) scale(.7)}.van-fade-enter-active,.van-fade-leave-active{transition-property:opacity}.van-fade-enter,.van-fade-leave-to{opacity:0}.van-center-enter-active,.van-center-leave-active{transition-property:opacity}.van-center-enter,.van-center-leave-to{opacity:0}.van-bottom-enter-active,.van-bottom-leave-active,.van-left-enter-active,.van-left-leave-active,.van-right-enter-active,.van-right-leave-active,.van-top-enter-active,.van-top-leave-active{transition-property:transform}.van-bottom-enter,.van-bottom-leave-to{transform:translate3d(0,100%,0)}.van-top-enter,.van-top-leave-to{transform:translate3d(0,-100%,0)}.van-left-enter,.van-left-leave-to{transform:translate3d(-100%,-50%,0)}.van-right-enter,.van-right-leave-to{transform:translate3d(100%,-50%,0)}

lib/popup/popup.wxml

@@ -0,0 +1,14 @@
+<view
+  wx:if="{{ inited }}"
+  class="custom-class {{ classes }} {{ utils.bem('popup', [position, { round, safe: safeAreaInsetBottom, safeTop: safeAreaInsetTop, safeTabBar: safeAreaTabBar }]) }}"
+  style="{{ computed.popupStyle({ zIndex, currentDuration, display, customStyle }) }}"
+  bind:transitionend="onTransitionEnd"
+>
+  <slot />
+  <van-icon
+    wx:if="{{ closeable }}"
+    name="{{ closeIcon }}"
+    class="close-icon-class van-popup__close-icon van-popup__close-icon--{{ closeIconPosition }}"
+    bind:tap="onClickCloseIcon"
+  />
+</view>