@tuya-miniapp/smart-ui 1.0.1 → 1.1.0-beta-1

package/README.md

@@ -1,3 +1,5 @@
+English | [简体中文](./README-zh_CN.md)
+
 # @tuya-miniapp/smart-ui
 
 ## Introduction

package/dist/action-sheet/index.js

@@ -39,6 +39,10 @@ SmartComponent({
             type: Boolean,
             value: true,
         },
+        safeAreaInsetBottomMin: {
+            type: Number,
+            value: 16,
+        },
         rootPortal: {
             type: Boolean,
             value: false,

package/dist/action-sheet/index.wxml

@@ -8,6 +8,7 @@
   overlay="{{ overlay }}"
   custom-class="smart-action-sheet custom-class"
   safe-area-inset-bottom="{{ safeAreaInsetBottom }}"
+  safe-area-inset-bottom-min="{{ safeAreaInsetBottomMin }}"
   close-on-click-overlay="{{ closeOnClickOverlay }}"
   root-portal="{{ rootPortal }}"
   bind:close="onClickOverlay"

package/dist/calendar/index.js

@@ -137,6 +137,7 @@ SmartComponent({
         });
     },
     mounted() {
+        this.isMounted = true;
         if (this.data.show || !this.data.poppable) {
             this.initRect();
             this.scrollIntoView();
@@ -148,6 +149,8 @@ SmartComponent({
             this.scrollIntoView();
         },
         initRect() {
+            if (!this.isMounted)
+                return;
             if (this.contentObserver != null) {
                 this.contentObserver.disconnect();
             }
@@ -203,6 +206,8 @@ SmartComponent({
             return this.limitDateRange(defaultDate);
         },
         scrollIntoView() {
+            if (!this.isMounted)
+                return;
             requestAnimationFrame(() => {
                 const { currentDate, type, show, poppable, minDate, maxDate } = this.data;
                 if (!currentDate)

package/dist/dialog/dialog.js

@@ -42,9 +42,13 @@ const Dialog = (options) => {
         delete options.context;
         delete options.selector;
         if (dialog) {
+            const optionsWithInputValue = Object.assign({}, options);
+            if (typeof options.value === 'string') {
+                optionsWithInputValue.inputValue = options.value;
+            }
             dialog.setData(Object.assign({ callback: (action, instance) => {
                     action === 'confirm' ? resolve(instance) : reject(instance);
-                } }, options));
+                } }, optionsWithInputValue));
             wx.nextTick(() => {
                 dialog.setData({ show: true });
             });

package/dist/notify/index.js

@@ -25,6 +25,14 @@ SmartComponent({
             type: Boolean,
             value: false,
         },
+        useSlot: {
+            type: Boolean,
+            value: false,
+        },
+        transition: {
+            type: String,
+            value: 'slide-down',
+        },
         top: null,
     },
     data: {

package/dist/notify/index.wxml

@@ -2,7 +2,7 @@
 <wxs src="./index.wxs" module="computed" />
 
 <smart-transition
-  name="slide-down"
+  name="{{ transition }}"
   show="{{ show }}"
   custom-class="smart-notify__container"
   custom-style="{{ computed.rootStyle({ zIndex, top }) }}"
@@ -16,6 +16,7 @@
       wx:if="{{ safeAreaInsetTop }}"
       style="height: {{ statusBarHeight }}px"
     />
-    <text>{{ message }}</text>
+    <slot wx:if="{{ useSlot }}" />
+    <text wx:else>{{ message }}</text>
   </view>
 </smart-transition>

package/dist/notify/notify.d.ts

@@ -1,5 +1,6 @@
 interface NotifyOptions {
     type?: 'primary' | 'success' | 'danger' | 'warning';
+    transition?: 'fade' | 'fade-up' | 'fade-down' | 'fade-left' | 'fade-right' | 'slide-up' | 'slide-down' | 'slide-left' | 'slide-right';
     color?: string;
     zIndex?: number;
     top?: number;

package/dist/popup/index.css

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

package/dist/popup/index.js

@@ -1,6 +1,8 @@
 import closeIcon from '@tuya-miniapp/icons/dist/svg/Xmark';
 import { SmartComponent } from '../common/component';
 import { transition } from '../mixins/transition';
+import { getSystemInfoSync } from '../common/utils';
+const { safeArea, screenHeight, statusBarHeight } = getSystemInfoSync() || {};
 SmartComponent({
     classes: [
         'enter-class',
@@ -50,6 +52,10 @@ SmartComponent({
             type: Boolean,
             value: true,
         },
+        safeAreaInsetBottomMin: {
+            type: Number,
+            value: 0,
+        },
         safeAreaInsetTop: {
             type: Boolean,
             value: false,
@@ -69,6 +75,15 @@ SmartComponent({
     },
     data: {
         closeIcon,
+        bottomSafeHeight: 0,
+    },
+    mounted() {
+        if (!this.data.safeAreaInsetBottom)
+            return;
+        const bottomSafeHeight = screenHeight - (safeArea === null || safeArea === void 0 ? void 0 : safeArea.height) - statusBarHeight;
+        this.setData({
+            bottomSafeHeight: Math.max(bottomSafeHeight, this.data.safeAreaInsetBottomMin),
+        });
     },
     created() {
         this.observeClass();

package/dist/popup/index.wxs

@@ -4,6 +4,7 @@ var style = require('../wxs/style.wxs');
 function popupStyle(data) {
   return style([
     {
+      'margin-bottom': data.bottomSafeHeight + 'px',
       'z-index': data.zIndex,
       '-webkit-transition-duration': data.currentDuration + 'ms',
       'transition-duration': data.currentDuration + 'ms',

package/dist/popup/index.wxss

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

package/dist/popup/popup.wxml

@@ -2,8 +2,8 @@
 <wxs src="./index.wxs" module="computed" />
 <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 }) }}"
+  class="custom-class {{ classes }} {{ utils.bem('popup', [position, { round, safeTop: safeAreaInsetTop, safeTabBar: safeAreaTabBar }]) }}"
+  style="{{ computed.popupStyle({ zIndex, currentDuration, display, customStyle, bottomSafeHeight }) }}"
   bind:transitionend="onTransitionEnd"
   catch:touchmove="{{ lockScroll ? 'noop' : ''}}"
 >

package/dist/switch/index.js

@@ -8,6 +8,10 @@ SmartComponent({
         disabled: Boolean,
         activeColor: String,
         inactiveColor: String,
+        stopClickPropagation: {
+            type: Boolean,
+            value: false,
+        },
         size: {
             type: String,
             value: '30',

package/dist/switch/index.wxml

@@ -1,16 +1,34 @@
 <wxs src="../wxs/utils.wxs" module="utils" />
 <wxs src="./index.wxs" module="computed" />
 
-<view
-  class="{{ utils.bem('switch', { on: checked === activeValue, disabled }) }} custom-class"
-  style="{{ computed.rootStyle({ size, checked, activeColor, inactiveColor, activeValue }) }}"
-  bind:tap="onClick"
->
-  <view class="smart-switch__node node-class">
-    <smart-loading
-      wx:if="{{ loading }}"
-      color="{{ computed.loadingColor({ checked, activeColor, inactiveColor, activeValue }) }}"
-      custom-class="smart-switch__loading"
-    />
+<block wx:if="{{stopClickPropagation}}">
+  <view
+    class="{{ utils.bem('switch', { on: checked === activeValue, disabled }) }} custom-class"
+    style="{{ computed.rootStyle({ size, checked, activeColor, inactiveColor, activeValue }) }}"
+    catch:tap="onClick"
+  >
+    <view class="smart-switch__node node-class">
+      <smart-loading
+        wx:if="{{ loading }}"
+        color="{{ computed.loadingColor({ checked, activeColor, inactiveColor, activeValue }) }}"
+        custom-class="smart-switch__loading"
+      />
+    </view>
   </view>
-</view>
+</block>
+<block wx:else>
+  <view
+    class="{{ utils.bem('switch', { on: checked === activeValue, disabled }) }} custom-class"
+    style="{{ computed.rootStyle({ size, checked, activeColor, inactiveColor, activeValue }) }}"
+    bind:tap="onClick"
+  >
+    <view class="smart-switch__node node-class">
+      <smart-loading
+        wx:if="{{ loading }}"
+        color="{{ computed.loadingColor({ checked, activeColor, inactiveColor, activeValue }) }}"
+        custom-class="smart-switch__loading"
+      />
+    </view>
+  </view>
+</block>
+

package/lib/action-sheet/index.js

@@ -44,6 +44,10 @@ var button_1 = require("../mixins/button");
             type: Boolean,
             value: true,
         },
+        safeAreaInsetBottomMin: {
+            type: Number,
+            value: 16,
+        },
         rootPortal: {
             type: Boolean,
             value: false,

package/lib/action-sheet/index.wxml

@@ -8,6 +8,7 @@
   overlay="{{ overlay }}"
   custom-class="smart-action-sheet custom-class"
   safe-area-inset-bottom="{{ safeAreaInsetBottom }}"
+  safe-area-inset-bottom-min="{{ safeAreaInsetBottomMin }}"
   close-on-click-overlay="{{ closeOnClickOverlay }}"
   root-portal="{{ rootPortal }}"
   bind:close="onClickOverlay"

package/lib/calendar/index.js

@@ -153,6 +153,7 @@ var getTime = function (date) {
         });
     },
     mounted: function () {
+        this.isMounted = true;
         if (this.data.show || !this.data.poppable) {
             this.initRect();
             this.scrollIntoView();
@@ -165,6 +166,8 @@ var getTime = function (date) {
         },
         initRect: function () {
             var _this = this;
+            if (!this.isMounted)
+                return;
             if (this.contentObserver != null) {
                 this.contentObserver.disconnect();
             }
@@ -225,6 +228,8 @@ var getTime = function (date) {
         },
         scrollIntoView: function () {
             var _this = this;
+            if (!this.isMounted)
+                return;
             (0, utils_2.requestAnimationFrame)(function () {
                 var _a = _this.data, currentDate = _a.currentDate, type = _a.type, show = _a.show, poppable = _a.poppable, minDate = _a.minDate, maxDate = _a.maxDate;
                 if (!currentDate)

package/lib/dialog/dialog.js

@@ -55,9 +55,13 @@ var Dialog = function (options) {
         delete options.context;
         delete options.selector;
         if (dialog) {
+            var optionsWithInputValue = __assign({}, options);
+            if (typeof options.value === 'string') {
+                optionsWithInputValue.inputValue = options.value;
+            }
             dialog.setData(__assign({ callback: function (action, instance) {
                     action === 'confirm' ? resolve(instance) : reject(instance);
-                } }, options));
+                } }, optionsWithInputValue));
             wx.nextTick(function () {
                 dialog.setData({ show: true });
             });

package/lib/notify/index.js

@@ -27,6 +27,14 @@ var utils_1 = require("../common/utils");
             type: Boolean,
             value: false,
         },
+        useSlot: {
+            type: Boolean,
+            value: false,
+        },
+        transition: {
+            type: String,
+            value: 'slide-down',
+        },
         top: null,
     },
     data: {

package/lib/notify/index.wxml

@@ -2,7 +2,7 @@
 <wxs src="./index.wxs" module="computed" />
 
 <smart-transition
-  name="slide-down"
+  name="{{ transition }}"
   show="{{ show }}"
   custom-class="smart-notify__container"
   custom-style="{{ computed.rootStyle({ zIndex, top }) }}"
@@ -16,6 +16,7 @@
       wx:if="{{ safeAreaInsetTop }}"
       style="height: {{ statusBarHeight }}px"
     />
-    <text>{{ message }}</text>
+    <slot wx:if="{{ useSlot }}" />
+    <text wx:else>{{ message }}</text>
   </view>
 </smart-transition>

package/lib/notify/notify.d.ts

@@ -1,5 +1,6 @@
 interface NotifyOptions {
     type?: 'primary' | 'success' | 'danger' | 'warning';
+    transition?: 'fade' | 'fade-up' | 'fade-down' | 'fade-left' | 'fade-right' | 'slide-up' | 'slide-down' | 'slide-left' | 'slide-right';
     color?: string;
     zIndex?: number;
     top?: number;

package/lib/popup/index.css

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

package/lib/popup/index.js

@@ -6,6 +6,8 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var Xmark_1 = __importDefault(require("@tuya-miniapp/icons/dist/svg/Xmark"));
 var component_1 = require("../common/component");
 var transition_1 = require("../mixins/transition");
+var utils_1 = require("../common/utils");
+var _a = (0, utils_1.getSystemInfoSync)() || {}, safeArea = _a.safeArea, screenHeight = _a.screenHeight, statusBarHeight = _a.statusBarHeight;
 (0, component_1.SmartComponent)({
     classes: [
         'enter-class',
@@ -55,6 +57,10 @@ var transition_1 = require("../mixins/transition");
             type: Boolean,
             value: true,
         },
+        safeAreaInsetBottomMin: {
+            type: Number,
+            value: 0,
+        },
         safeAreaInsetTop: {
             type: Boolean,
             value: false,
@@ -74,6 +80,15 @@ var transition_1 = require("../mixins/transition");
     },
     data: {
         closeIcon: Xmark_1.default,
+        bottomSafeHeight: 0,
+    },
+    mounted: function () {
+        if (!this.data.safeAreaInsetBottom)
+            return;
+        var bottomSafeHeight = screenHeight - (safeArea === null || safeArea === void 0 ? void 0 : safeArea.height) - statusBarHeight;
+        this.setData({
+            bottomSafeHeight: Math.max(bottomSafeHeight, this.data.safeAreaInsetBottomMin),
+        });
     },
     created: function () {
         this.observeClass();

package/lib/popup/index.wxs

@@ -4,6 +4,7 @@ var style = require('../wxs/style.wxs');
 function popupStyle(data) {
   return style([
     {
+      'margin-bottom': data.bottomSafeHeight + 'px',
       'z-index': data.zIndex,
       '-webkit-transition-duration': data.currentDuration + 'ms',
       'transition-duration': data.currentDuration + 'ms',

package/lib/popup/index.wxss

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

package/lib/popup/popup.wxml

@@ -2,8 +2,8 @@
 <wxs src="./index.wxs" module="computed" />
 <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 }) }}"
+  class="custom-class {{ classes }} {{ utils.bem('popup', [position, { round, safeTop: safeAreaInsetTop, safeTabBar: safeAreaTabBar }]) }}"
+  style="{{ computed.popupStyle({ zIndex, currentDuration, display, customStyle, bottomSafeHeight }) }}"
   bind:transitionend="onTransitionEnd"
   catch:touchmove="{{ lockScroll ? 'noop' : ''}}"
 >

package/lib/switch/index.js

@@ -10,6 +10,10 @@ var component_1 = require("../common/component");
         disabled: Boolean,
         activeColor: String,
         inactiveColor: String,
+        stopClickPropagation: {
+            type: Boolean,
+            value: false,
+        },
         size: {
             type: String,
             value: '30',

package/lib/switch/index.wxml

@@ -1,16 +1,34 @@
 <wxs src="../wxs/utils.wxs" module="utils" />
 <wxs src="./index.wxs" module="computed" />
 
-<view
-  class="{{ utils.bem('switch', { on: checked === activeValue, disabled }) }} custom-class"
-  style="{{ computed.rootStyle({ size, checked, activeColor, inactiveColor, activeValue }) }}"
-  bind:tap="onClick"
->
-  <view class="smart-switch__node node-class">
-    <smart-loading
-      wx:if="{{ loading }}"
-      color="{{ computed.loadingColor({ checked, activeColor, inactiveColor, activeValue }) }}"
-      custom-class="smart-switch__loading"
-    />
+<block wx:if="{{stopClickPropagation}}">
+  <view
+    class="{{ utils.bem('switch', { on: checked === activeValue, disabled }) }} custom-class"
+    style="{{ computed.rootStyle({ size, checked, activeColor, inactiveColor, activeValue }) }}"
+    catch:tap="onClick"
+  >
+    <view class="smart-switch__node node-class">
+      <smart-loading
+        wx:if="{{ loading }}"
+        color="{{ computed.loadingColor({ checked, activeColor, inactiveColor, activeValue }) }}"
+        custom-class="smart-switch__loading"
+      />
+    </view>
   </view>
-</view>
+</block>
+<block wx:else>
+  <view
+    class="{{ utils.bem('switch', { on: checked === activeValue, disabled }) }} custom-class"
+    style="{{ computed.rootStyle({ size, checked, activeColor, inactiveColor, activeValue }) }}"
+    bind:tap="onClick"
+  >
+    <view class="smart-switch__node node-class">
+      <smart-loading
+        wx:if="{{ loading }}"
+        color="{{ computed.loadingColor({ checked, activeColor, inactiveColor, activeValue }) }}"
+        custom-class="smart-switch__loading"
+      />
+    </view>
+  </view>
+</block>
+

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tuya-miniapp/smart-ui",
-  "version": "1.0.1",
+  "version": "1.1.0-beta-1",
   "author": "MiniApp Team",
   "license": "MIT",
   "miniprogram": "lib",
@@ -38,6 +38,8 @@
     "@babel/preset-typescript": "^7.16.0",
     "@types/fs-extra": "^11.0.4",
     "@types/jest": "^27.0.2",
+    "@vant/eslint-config": "^4.0.0",
+    "@vant/stylelint-config": "^1.4.2",
     "fs-extra": "^11.2.0",
     "gulp": "^4.0.2",
     "gulp-insert": "^0.5.0",