@tuya-miniapp/smart-ui 1.3.0-beta-1 → 1.3.1-beta-1

package/dist/notice-bar/index.js

@@ -1,5 +1,7 @@
 import { SmartComponent } from '../common/component';
 import { getRect, requestAnimationFrame } from '../common/utils';
+import Xmark from '@tuya-miniapp/icons/dist/svg/Xmark';
+import Right from '@tuya-miniapp/icons/dist/svg/Right';
 SmartComponent({
     props: {
         text: {
@@ -7,22 +9,60 @@ SmartComponent({
             value: '',
             observer: 'init',
         },
+        btnText: {
+            type: String,
+            value: '',
+            observer: 'init',
+        },
+        btnTextColor: {
+            type: String,
+            value: '',
+            observer: 'init',
+        },
         mode: {
             type: String,
             value: '',
         },
+        type: {
+            type: String,
+            value: 'info'
+        },
         url: {
             type: String,
             value: '',
         },
         openType: {
             type: String,
-            value: 'navigate',
+            value: 'navigateTo',
+        },
+        rightIconColor: {
+            type: String,
+            value: 'var(--notice-bar-right-icon-color)',
+        },
+        leftIconColor: {
+            type: String,
+            value: '',
         },
         delay: {
             type: Number,
             value: 1,
         },
+        customStyle: {
+            type: String,
+            value: '',
+        },
+        customHoverClass: {
+            type: String,
+            value: '',
+        },
+        rightIconStyle: {
+            type: String,
+            value: '',
+        },
+        leftIconStyle: {
+            type: String,
+            value: '',
+        },
         speed: {
             type: Number,
             value: 60,
@@ -34,11 +74,12 @@ SmartComponent({
             value: '',
         },
         color: String,
-        backgroundColor: String,
         background: String,
         wrapable: Boolean,
     },
     data: {
+        Xmark,
+        Right,
         show: true,
     },
     created() {
@@ -113,7 +154,19 @@ SmartComponent({
                 this.$emit('close', event.detail);
             }
         },
+        onClickBtnText(event) {
+            this.$emit('btnClick', event);
+        },
         onClick(event) {
+            const { url, mode, openType } = this.data;
+            if (mode === 'link' && url) {
+                if (openType === 'redirectTo') {
+                    wx.redirectTo({ url });
+                }
+                else if (openType === 'navigateTo') {
+                    wx.navigateTo({ url });
+                }
+            }
             this.$emit('click', event);
         },
     },

package/dist/notice-bar/index.wxml

@@ -3,20 +3,36 @@
 
 <view
   wx:if="{{ show }}"
-  class="custom-class {{ utils.bem('notice-bar', { withicon: mode, wrapable }) }}"
-  style="{{ computed.rootStyle({ color, backgroundColor, background }) }}"
+  class="custom-class {{ utils.bem('notice-bar', { 
+    wrapable,
+    warning: type === 'warning',
+    error: type === 'error'
+  }) }}"
+  hover-class="{{ mode === 'link' ? 'smart-notice-bar--hover' : ''}} {{ customHoverClass }}"
+  style="{{ computed.rootStyle([{ color, background }, customStyle]) }}"
   bind:tap="onClick"
 >
   <smart-icon
     wx:if="{{ leftIcon }}"
     name="{{ leftIcon }}"
     class="smart-notice-bar__left-icon"
+    style="{{ computed.rootStyle(leftIconStyle) }}"
+    color="{{ leftIconColor || (type === 'info' ? 'var(--notice-bar-info-color)' : type === 'warning' ? 'var(--notice-bar-warning-color)' : type === 'error' ? 'var(--notice-bar-error-color)' : '') }}"
   />
   <slot wx:else name="left-icon" />
 
   <view class="smart-notice-bar__wrap">
     <view class="smart-notice-bar__content {{ scrollable === false && !wrapable ? 'smart-ellipsis' : '' }}" animation="{{ animationData }}">
       {{ text }}
+      <view 
+        wx:if="{{ btnText }}" 
+        class="smart-notice-bar__content__btn" 
+        hover-class="smart-notice-bar--hover"
+        catch:tap="onClickBtnText"
+        style="{{ btnTextColor ? 'color: ' + btnTextColor : ''}}"
+      >
+        {{ btnText }}
+      </view>
       <slot wx:if="{{ !text }}"></slot>
     </view>
   </view>
@@ -24,15 +40,17 @@
   <smart-icon
     wx:if="{{ mode === 'closeable' }}"
     class="smart-notice-bar__right-icon"
-    name="cross"
+    name="{{ Xmark }}"
+    style="{{ computed.rootStyle(rightIconStyle) }}"
+    color=" {{ rightIconColor }} "
     catch:tap="onClickIcon"
   />
-  <navigator
-    wx:elif="{{ mode === 'link' }}"
-    url="{{ url }}"
-    open-type="{{ openType }}"
-  >
-    <smart-icon class="smart-notice-bar__right-icon" name="arrow" />
-  </navigator>
+  <smart-icon 
+    wx:elif="{{ mode === 'link' }}" 
+    color=" {{ rightIconColor }} " 
+    class="smart-notice-bar__right-icon" 
+    name="{{ Right }}" 
+    style="{{ computed.rootStyle(rightIconStyle) }}"
+  />
   <slot wx:else name="right-icon" />
 </view>

package/dist/notice-bar/index.wxs

@@ -3,11 +3,7 @@ var style = require('../wxs/style.wxs');
 var addUnit = require('../wxs/add-unit.wxs');
 
 function rootStyle(data) {
-  return style({
-    color: data.color,
-    'background-color': data.backgroundColor,
-    background: data.background,
-  });
+  return style(data);
 }
 
 module.exports = {

package/dist/notice-bar/index.wxss

@@ -1 +1 @@
-@import '../common/index.wxss';.smart-notice-bar{align-items:center;background-color:var(--notice-bar-background-color,#fffbe8);color:var(--notice-bar-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));display:flex;font-size:var(--notice-bar-font-size,14px);height:var(--notice-bar-height,40px);line-height:var(--notice-bar-line-height,24px);padding:var(--notice-bar-padding,0 16px)}.smart-notice-bar--withicon{padding-right:40px;position:relative}.smart-notice-bar--wrapable{height:auto;padding:var(--notice-bar-wrapable-padding,8px 16px)}.smart-notice-bar--wrapable .smart-notice-bar__wrap{height:auto}.smart-notice-bar--wrapable .smart-notice-bar__content{position:relative;white-space:normal}.smart-notice-bar__left-icon{align-items:center;display:flex;margin-right:4px;vertical-align:middle}.smart-notice-bar__left-icon,.smart-notice-bar__right-icon{font-size:var(--notice-bar-icon-size,16px);min-width:var(--notice-bar-icon-min-width,22px)}.smart-notice-bar__right-icon{position:absolute;right:15px;top:10px}.smart-notice-bar__wrap{flex:1;height:var(--notice-bar-line-height,24px);overflow:hidden;position:relative}.smart-notice-bar__content{position:absolute;white-space:nowrap}.smart-notice-bar__content.smart-ellipsis{max-width:100%}
+@import '../common/index.wxss';.smart-notice-bar{--notice-bar-info-color:#1989fa;--notice-bar-warning-color:#ffa000;--notice-bar-error-color:#f04c4c;--notice-bar-right-icon-color:rgba(0,0,0,.2);align-items:center;background-color:var(--notice-bar-background-color,rgba(25,137,250,.1));color:var(--notice-bar-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));display:flex;font-size:var(--notice-bar-font-size,12px);height:var(--notice-bar-height,40px);line-height:var(--notice-bar-line-height,14px);padding:var(--notice-bar-padding,0 16px)}.smart-notice-bar--warning{background-color:var(--notice-bar-background-warning-color,rgba(255,160,0,.1))}.smart-notice-bar--error{background-color:var(--notice-bar-background-error-color,rgba(240,76,76,.1))}.smart-notice-bar--hover{opacity:.6}.smart-notice-bar--wrapable{height:auto;padding:var(--notice-bar-wrapable-padding,8px 16px)}.smart-notice-bar--wrapable .smart-notice-bar__wrap{height:auto}.smart-notice-bar--wrapable .smart-notice-bar__content{position:relative;white-space:normal}.smart-notice-bar__left-icon{align-items:center;display:flex;font-size:var(--notice-bar-icon-size,16px);margin-right:var(--notice-bar-left-icon-margin-right,8px);vertical-align:middle}.smart-notice-bar__right-icon{font-size:var(--notice-bar-icon-size,16px);margin-left:var(--notice-bar-right-icon-margin-left,8px)}.smart-notice-bar__wrap{flex:1;height:var(--notice-bar-line-height,14px);overflow:hidden;position:relative}.smart-notice-bar__content{position:absolute;white-space:nowrap}.smart-notice-bar__content.smart-ellipsis{max-width:100%}.smart-notice-bar__content__btn{color:#1989fa;display:inline-block}

package/dist/picker-column/index.js

@@ -174,7 +174,14 @@ SmartComponent({
                             animate: true,
                             duration: DEFAULT_DURATION,
                         }).then(() => {
-                            userAction && (this.fireChange = true);
+                            if (!userAction)
+                                return;
+                            if ([0, data.optionsV.length - 1].includes(index)) {
+                                this.$emit('change', index);
+                                return;
+                            }
+                            ;
+                            this.fireChange = true;
                         });
                     });
                 }

package/dist/radio/index.css

@@ -1 +1 @@
-@import '../common/index.css';.smart-radio{align-items:center;display:flex;overflow:hidden;-webkit-user-select:none;user-select:none}.smart-radio__icon-wrap{flex:none}.smart-radio--horizontal{margin-right:var(--padding-sm,12px)}.smart-radio__icon{align-items:center;border:1px solid var(--radio-border-color,#c8c9cc);box-sizing:border-box;color:transparent;display:flex;font-size:var(--radio-size,20px);height:1em;justify-content:center;text-align:center;transition-duration:var(--radio-transition-duration,.2s);transition-property:color,border-color,background-color;width:1em}.smart-radio__icon--round{border-radius:100%}.smart-radio__icon--checked{background-color:var(--radio-checked-icon-color,var(--app-M4,#1989fa));border-color:var(--radio-checked-icon-color,var(--app-M4,#1989fa));color:#fff}.smart-radio__icon--disabled{background-color:var(--radio-disabled-background-color,var(--app-B6-N6,rgba(0,0,0,.2)));border-color:var(--radio-disabled-icon-color,var(--app-B6-N5,rgba(0,0,0,.3)))}.smart-radio__icon--disabled.smart-radio__icon--checked{color:var(--radio-disabled-icon-color,var(--app-B6-N5,rgba(0,0,0,.3)))}.smart-radio__label{word-wrap:break-word;color:var(--radio-label-color,var(--app-B6-N1,#000));line-height:var(--radio-size,20px);padding-left:var(--radio-label-margin,10px)}.smart-radio__label--left{float:left;margin:0 var(--radio-label-margin,10px) 0 0}.smart-radio__label--disabled{color:var(--radio-disabled-label-color,var(--app-B6-N5,rgba(0,0,0,.3)))}.smart-radio__label:empty{margin:0}
+@import '../common/index.css';.smart-radio{align-items:center;display:flex;overflow:hidden;-webkit-user-select:none;user-select:none}.smart-radio__icon-wrap{display:flex;flex:none}.smart-radio--horizontal{margin-right:var(--padding-sm,12px)}.smart-radio__icon{align-items:center;border:2px solid var(--radio-border-color,var(--app-B6-N6,rgba(0,0,0,.2)));border-radius:var(--radio-border-radius,4px);box-sizing:border-box;color:transparent;display:flex;font-size:var(--radio-size,24px);height:1em;justify-content:center;text-align:center;transition-duration:var(--radio-transition-duration,.2s);transition-property:color,border,background-color;width:1em}.smart-radio__icon--round{border-radius:100%}.smart-radio__icon--checked{background-color:var(--radio-checked-icon-color,var(--app-M4,#1989fa));border-color:var(--radio-checked-icon-color,var(--app-M4,#1989fa));color:#fff}.smart-radio__icon--disabled{opacity:.3}.smart-radio__label{word-wrap:break-word;color:var(--radio-label-color,var(--app-B6-N1,#000));font-size:var(--radio-label-size,12px);padding-left:var(--radio-label-margin,10px)}.smart-radio__label--left{float:left;margin:0 var(--radio-label-margin,10px) 0 0}.smart-radio__label--disabled{color:var(--radio-disabled-label-color,var(--app-B6-N5,rgba(0,0,0,.3)))}.smart-radio__label:empty{margin:0}

package/dist/radio/index.js

@@ -25,7 +25,7 @@ SmartComponent({
         },
         iconSize: {
             type: null,
-            value: 20,
+            value: 24,
         },
     },
     data: {

package/dist/radio/index.wxml

@@ -14,7 +14,8 @@
     <smart-icon
       wx:else
       name="{{ icon }}"
-      color="{{ value ? '#fff' : 'none'}}"
+      size="1em"
+      color="{{ value === name ? '#fff' : 'none'}}"
       class="{{ utils.bem('radio__icon', [shape, { disabled: disabled || parentDisabled, checked: value === name }]) }}"
       style="{{ computed.iconStyle({ iconSize, checkedColor, disabled, parentDisabled, value, name }) }}"
       custom-class="icon-class"

package/dist/radio/index.wxss

@@ -1 +1 @@
-@import '../common/index.wxss';.smart-radio{align-items:center;display:flex;overflow:hidden;-webkit-user-select:none;user-select:none}.smart-radio__icon-wrap{flex:none}.smart-radio--horizontal{margin-right:var(--padding-sm,12px)}.smart-radio__icon{align-items:center;border:1px solid var(--radio-border-color,#c8c9cc);box-sizing:border-box;color:transparent;display:flex;font-size:var(--radio-size,20px);height:1em;justify-content:center;text-align:center;transition-duration:var(--radio-transition-duration,.2s);transition-property:color,border-color,background-color;width:1em}.smart-radio__icon--round{border-radius:100%}.smart-radio__icon--checked{background-color:var(--radio-checked-icon-color,var(--app-M4,#1989fa));border-color:var(--radio-checked-icon-color,var(--app-M4,#1989fa));color:#fff}.smart-radio__icon--disabled{background-color:var(--radio-disabled-background-color,var(--app-B6-N6,rgba(0,0,0,.2)));border-color:var(--radio-disabled-icon-color,var(--app-B6-N5,rgba(0,0,0,.3)))}.smart-radio__icon--disabled.smart-radio__icon--checked{color:var(--radio-disabled-icon-color,var(--app-B6-N5,rgba(0,0,0,.3)))}.smart-radio__label{word-wrap:break-word;color:var(--radio-label-color,var(--app-B6-N1,#000));line-height:var(--radio-size,20px);padding-left:var(--radio-label-margin,10px)}.smart-radio__label--left{float:left;margin:0 var(--radio-label-margin,10px) 0 0}.smart-radio__label--disabled{color:var(--radio-disabled-label-color,var(--app-B6-N5,rgba(0,0,0,.3)))}.smart-radio__label:empty{margin:0}
+@import '../common/index.wxss';.smart-radio{align-items:center;display:flex;overflow:hidden;-webkit-user-select:none;user-select:none}.smart-radio__icon-wrap{display:flex;flex:none}.smart-radio--horizontal{margin-right:var(--padding-sm,12px)}.smart-radio__icon{align-items:center;border:2px solid var(--radio-border-color,var(--app-B6-N6,rgba(0,0,0,.2)));border-radius:var(--radio-border-radius,4px);box-sizing:border-box;color:transparent;display:flex;font-size:var(--radio-size,24px);height:1em;justify-content:center;text-align:center;transition-duration:var(--radio-transition-duration,.2s);transition-property:color,border,background-color;width:1em}.smart-radio__icon--round{border-radius:100%}.smart-radio__icon--checked{background-color:var(--radio-checked-icon-color,var(--app-M4,#1989fa));border-color:var(--radio-checked-icon-color,var(--app-M4,#1989fa));color:#fff}.smart-radio__icon--disabled{opacity:.3}.smart-radio__label{word-wrap:break-word;color:var(--radio-label-color,var(--app-B6-N1,#000));font-size:var(--radio-label-size,12px);padding-left:var(--radio-label-margin,10px)}.smart-radio__label--left{float:left;margin:0 var(--radio-label-margin,10px) 0 0}.smart-radio__label--disabled{color:var(--radio-disabled-label-color,var(--app-B6-N5,rgba(0,0,0,.3)))}.smart-radio__label:empty{margin:0}

package/dist/search/index.css

@@ -1 +1 @@
-@import '../common/index.css';.smart-search{align-items:center;box-sizing:border-box;display:flex;padding:var(--search-padding,10px 12px)}.smart-search__content{background-color:var(--search-background-color,#f7f8fa);border-radius:2px;display:flex;flex:1;padding-left:var(--padding-sm,12px)}.smart-search__content--round{border-radius:999px}.smart-search__label{color:var(--search-label-color,#323233);font-size:var(--search-label-font-size,14px);line-height:var(--search-input-height,34px);padding:var(--search-label-padding,0 5px)}.smart-search__field{flex:1}.smart-search__field__left-icon{color:var(--search-left-icon-color,#969799)}.smart-search--withaction{padding-right:0}.smart-search__action{color:var(--search-action-text-color,#323233);font-size:var(--search-action-font-size,14px);line-height:var(--search-input-height,34px)}.smart-search__action--hover{background-color:#f2f3f5}.smart-search__action-button{padding:var(--search-action-padding,0 8px)}
+@import '../common/index.css';.smart-search{align-items:center;background-color:var(--search-background-color,var(--app-B3,#fff));box-sizing:border-box;display:flex;padding:var(--search-padding,12px 16px)}.smart-search__content{align-items:center;background-color:var(--search-body-background-color,var(--app-B4-N9,rgba(0,0,0,.05)));display:flex;flex:1;flex-direction:row;padding:12px 16px}.smart-search__content--round{border-radius:999px}.smart-search__label{color:var(--search-label-color,var(--app-B4-N1,#000));font-size:var(--search-label-font-size,14px);line-height:var(--search-input-height,24px);padding:var(--search-label-padding,0 5px)}.smart-search__field{flex:1}.smart-search__field__left-icon{--icon-color:var(--search-left-icon-color,var(--app-B4-N4,rgba(0,0,0,.4)));margin-left:2px}.smart-search__input{font-size:var(--search-value-font-size,14px)}.smart-search--withaction{padding-right:0}.smart-search__action{color:var(--search-action-text-color,var(--app-B4-N3,rgba(0,0,0,.5)));font-size:var(--search-action-font-size,14px);line-height:var(--search-input-height,24px)}.smart-search__action--hover{background-color:var(--app-B4-N9,rgba(0,0,0,.05));opacity:.4}.smart-search__action-button{padding:var(--search-action-padding,0 16px 0 12px)}.smart-search__hover{background-color:var(--app-B4-N9,rgba(0,0,0,.05));opacity:.4}.smart-search__submit{align-items:center;color:var(--search-submit-color,var(--app-M1,#3678e3));display:flex;flex-direction:row;font-size:var(--search-submit-font-size,14px)}.smart-search__submit:before{background-color:var(--search-submit-color,var(--app-M1,#3678e3));content:"";display:block;height:12px;margin-right:12px;width:1px}

package/dist/search/index.js

@@ -1,5 +1,7 @@
 import { SmartComponent } from '../common/component';
 import { canIUseModel } from '../common/version';
+import SearchIcon from '@tuya-miniapp/icons/dist/svg/Search';
+import CloseIcon from '@tuya-miniapp/icons/dist/svg/Close';
 SmartComponent({
     field: true,
     classes: ['field-class', 'input-class', 'cancel-class'],
@@ -20,18 +22,20 @@ SmartComponent({
         useRightIconSlot: Boolean,
         leftIcon: {
             type: String,
-            value: 'search',
+            value: SearchIcon,
         },
         rightIcon: String,
         placeholder: String,
         placeholderStyle: String,
-        actionText: {
+        searchText: {
             type: String,
-            value: '取消',
+            value: 'Search',
         },
-        background: {
+        showSearchButton: Boolean,
+        background: String,
+        actionText: {
             type: String,
-            value: '#ffffff',
+            value: 'Cancel',
         },
         maxlength: {
             type: Number,
@@ -51,7 +55,7 @@ SmartComponent({
         },
         clearIcon: {
             type: String,
-            value: 'clear',
+            value: CloseIcon,
         },
         cursorSpacing: {
             type: Number,
@@ -60,9 +64,7 @@ SmartComponent({
     },
     methods: {
         onChange(event) {
-            if (canIUseModel()) {
-                this.setData({ value: event.detail });
-            }
+            this.setData({ value: event.detail });
             this.$emit('change', event.detail);
         },
         onCancel() {
@@ -80,6 +82,9 @@ SmartComponent({
         onSearch(event) {
             this.$emit('search', event.detail);
         },
+        goSearch() {
+            this.$emit('search', this.data.value);
+        },
         onFocus(event) {
             this.$emit('focus', event.detail);
         },

package/dist/search/index.json

@@ -1,6 +1,7 @@
 {
   "component": true,
   "usingComponents": {
-    "smart-field": "../field/index"
+    "smart-field": "../field/index",
+    "smart-icon": "../icon/index"
   }
 }

package/dist/search/index.wxml

@@ -3,14 +3,14 @@
 <view
   class="{{ utils.bem('search', { withaction: showAction || useActionSlot }) }} custom-class"
   style="background: {{ background }}"
->
+>  
+
   <view class="{{ utils.bem('search__content', [shape]) }}">
     <view class="smart-search__label" wx:if="{{ label }}">{{ label }}</view>
     <slot wx:else name="label" />
 
     <smart-field
       type="search"
-      left-icon="{{ !useLeftIconSlot ? leftIcon : '' }}"
       right-icon="{{ !useRightIconSlot ? rightIcon : '' }}"
       focus="{{ focus }}"
       error="{{ error }}"
@@ -25,11 +25,11 @@
       clear-icon="{{ clearIcon }}"
       maxlength="{{ maxlength }}"
       input-align="{{ inputAlign }}"
-      input-class="input-class"
+      input-class="smart-search__input input-class"
       placeholder="{{ placeholder }}"
       placeholder-style="{{ placeholderStyle }}"
       cursor-spacing="{{ cursorSpacing }}"
-      custom-style="padding: 5px 10px 5px 0; background-color: transparent;"
+      custom-style="padding: 0; background-color: transparent;"
       bind:blur="onBlur"
       bind:focus="onFocus"
       bind:change="onChange"
@@ -37,8 +37,11 @@
       bind:clear="onClear"
       bind:click-input="onClickInput"
     >
+      <smart-icon wx:if="{{ !useLeftIconSlot && leftIcon }}" size="18" name="{{ leftIcon }}" custom-class="smart-search__field__left-icon" slot="left-icon" />
       <slot wx:if="{{ useLeftIconSlot }}" name="left-icon" slot="left-icon" />
       <slot wx:if="{{ useRightIconSlot }}" name="right-icon" slot="right-icon" />
+      <view wx:if="{{ showSearchButton && searchText }}" hover-class="smart-search__hover" bind:tap="goSearch" class="smart-search__submit" slot="button" >{{ searchText }}</view>
+      <slot name="search-button" slot="button" />
     </smart-field>
   </view>
 

package/dist/search/index.wxss

@@ -1 +1 @@
-@import '../common/index.wxss';.smart-search{align-items:center;box-sizing:border-box;display:flex;padding:var(--search-padding,10px 12px)}.smart-search__content{background-color:var(--search-background-color,#f7f8fa);border-radius:2px;display:flex;flex:1;padding-left:var(--padding-sm,12px)}.smart-search__content--round{border-radius:999px}.smart-search__label{color:var(--search-label-color,#323233);font-size:var(--search-label-font-size,14px);line-height:var(--search-input-height,34px);padding:var(--search-label-padding,0 5px)}.smart-search__field{flex:1}.smart-search__field__left-icon{color:var(--search-left-icon-color,#969799)}.smart-search--withaction{padding-right:0}.smart-search__action{color:var(--search-action-text-color,#323233);font-size:var(--search-action-font-size,14px);line-height:var(--search-input-height,34px)}.smart-search__action--hover{background-color:#f2f3f5}.smart-search__action-button{padding:var(--search-action-padding,0 8px)}
+@import '../common/index.wxss';.smart-search{align-items:center;background-color:var(--search-background-color,var(--app-B3,#fff));box-sizing:border-box;display:flex;padding:var(--search-padding,12px 16px)}.smart-search__content{align-items:center;background-color:var(--search-body-background-color,var(--app-B4-N9,rgba(0,0,0,.05)));display:flex;flex:1;flex-direction:row;padding:12px 16px}.smart-search__content--round{border-radius:999px}.smart-search__label{color:var(--search-label-color,var(--app-B4-N1,#000));font-size:var(--search-label-font-size,14px);line-height:var(--search-input-height,24px);padding:var(--search-label-padding,0 5px)}.smart-search__field{flex:1}.smart-search__field__left-icon{--icon-color:var(--search-left-icon-color,var(--app-B4-N4,rgba(0,0,0,.4)));margin-left:2px}.smart-search__input{font-size:var(--search-value-font-size,14px)}.smart-search--withaction{padding-right:0}.smart-search__action{color:var(--search-action-text-color,var(--app-B4-N3,rgba(0,0,0,.5)));font-size:var(--search-action-font-size,14px);line-height:var(--search-input-height,24px)}.smart-search__action--hover{background-color:var(--app-B4-N9,rgba(0,0,0,.05));opacity:.4}.smart-search__action-button{padding:var(--search-action-padding,0 16px 0 12px)}.smart-search__hover{background-color:var(--app-B4-N9,rgba(0,0,0,.05));opacity:.4}.smart-search__submit{align-items:center;color:var(--search-submit-color,var(--app-M1,#3678e3));display:flex;flex-direction:row;font-size:var(--search-submit-font-size,14px)}.smart-search__submit:before{background-color:var(--search-submit-color,var(--app-M1,#3678e3));content:"";display:block;height:12px;margin-right:12px;width:1px}

package/dist/switch/index.css

@@ -1 +1 @@
-@import '../common/index.css';.smart-switch{background-color:var(--switch-background-color,var(--app-B4-N6,rgba(0,0,0,.2)));border:var(--switch-border,1px solid rgba(0,0,0,.1));border-radius:var(--switch-node-size,1em);box-sizing:initial;display:inline-block;height:var(--switch-height,1em);position:relative;transition:background-color var(--switch-transition-duration,.3s);width:var(--switch-width,1.667em)}.smart-switch__node{background-color:var(--switch-node-background-color,#fff);border-radius:100%;box-shadow:var(--switch-node-box-shadow,0 3px 1px 0 rgba(0,0,0,.05),0 2px 2px 0 rgba(0,0,0,.1),0 3px 3px 0 rgba(0,0,0,.05));height:var(--switch-node-size,1em);left:0;position:absolute;top:0;transition:var(--switch-transition-duration,.3s) cubic-bezier(.3,1.05,.4,1.05);width:var(--switch-node-size,1em);z-index:var(--switch-node-z-index,1)}.smart-switch__loading{height:50%;left:25%;position:absolute!important;top:25%;width:50%}.smart-switch--on{background-color:var(--switch-on-background-color,#1989fa)}.smart-switch--on .smart-switch__node{transform:translateX(calc(var(--switch-width, 1.667em) - var(--switch-node-size, 1em)))}.smart-switch--disabled{opacity:var(--switch-disabled-opacity,.4)}
+@import '../common/index.css';.smart-switch{background-color:var(--switch-background-color,var(--app-B4-N6,rgba(0,0,0,.2)));border:var(--switch-border,1px solid rgba(0,0,0,.1));border-radius:var(--switch-node-size,1em);box-sizing:initial;display:inline-block;height:var(--switch-height,1em);position:relative;transition:background-color var(--switch-transition-duration,.3s);width:var(--switch-width,1.667em)}.smart-switch__node{background-color:var(--switch-node-background-color,#fff);border-radius:100%;box-shadow:var(--switch-node-box-shadow,0 3px 1px 0 rgba(0,0,0,.05),0 2px 2px 0 rgba(0,0,0,.1),0 3px 3px 0 rgba(0,0,0,.05));height:var(--switch-node-size,1em);left:0;position:absolute;top:0;transition:var(--switch-transition-duration,.3s) cubic-bezier(.3,1.05,.4,1.05);width:var(--switch-node-size,1em);z-index:var(--switch-node-z-index,1)}.smart-switch__loading{left:50%;position:absolute!important;top:50%;transform:translate(-50%,-50%)}.smart-switch--on{background-color:var(--switch-on-background-color,#1989fa)}.smart-switch--on .smart-switch__node{transform:translateX(calc(var(--switch-width, 1.667em) - var(--switch-node-size, 1em)))}.smart-switch--disabled{opacity:var(--switch-disabled-opacity,.4)}

package/dist/switch/index.wxml

@@ -27,6 +27,7 @@
         wx:if="{{ loading }}"
         color="{{ computed.loadingColor({ checked, activeColor, inactiveColor, activeValue }) }}"
         custom-class="smart-switch__loading"
+        size="{{size}}"
       />
     </view>
   </view>

package/dist/switch/index.wxss

@@ -1 +1 @@
-@import '../common/index.wxss';.smart-switch{background-color:var(--switch-background-color,var(--app-B4-N6,rgba(0,0,0,.2)));border:var(--switch-border,1px solid rgba(0,0,0,.1));border-radius:var(--switch-node-size,1em);box-sizing:initial;display:inline-block;height:var(--switch-height,1em);position:relative;transition:background-color var(--switch-transition-duration,.3s);width:var(--switch-width,1.667em)}.smart-switch__node{background-color:var(--switch-node-background-color,#fff);border-radius:100%;box-shadow:var(--switch-node-box-shadow,0 3px 1px 0 rgba(0,0,0,.05),0 2px 2px 0 rgba(0,0,0,.1),0 3px 3px 0 rgba(0,0,0,.05));height:var(--switch-node-size,1em);left:0;position:absolute;top:0;transition:var(--switch-transition-duration,.3s) cubic-bezier(.3,1.05,.4,1.05);width:var(--switch-node-size,1em);z-index:var(--switch-node-z-index,1)}.smart-switch__loading{height:50%;left:25%;position:absolute!important;top:25%;width:50%}.smart-switch--on{background-color:var(--switch-on-background-color,#1989fa)}.smart-switch--on .smart-switch__node{transform:translateX(calc(var(--switch-width, 1.667em) - var(--switch-node-size, 1em)))}.smart-switch--disabled{opacity:var(--switch-disabled-opacity,.4)}
+@import '../common/index.wxss';.smart-switch{background-color:var(--switch-background-color,var(--app-B4-N6,rgba(0,0,0,.2)));border:var(--switch-border,1px solid rgba(0,0,0,.1));border-radius:var(--switch-node-size,1em);box-sizing:initial;display:inline-block;height:var(--switch-height,1em);position:relative;transition:background-color var(--switch-transition-duration,.3s);width:var(--switch-width,1.667em)}.smart-switch__node{background-color:var(--switch-node-background-color,#fff);border-radius:100%;box-shadow:var(--switch-node-box-shadow,0 3px 1px 0 rgba(0,0,0,.05),0 2px 2px 0 rgba(0,0,0,.1),0 3px 3px 0 rgba(0,0,0,.05));height:var(--switch-node-size,1em);left:0;position:absolute;top:0;transition:var(--switch-transition-duration,.3s) cubic-bezier(.3,1.05,.4,1.05);width:var(--switch-node-size,1em);z-index:var(--switch-node-z-index,1)}.smart-switch__loading{left:50%;position:absolute!important;top:50%;transform:translate(-50%,-50%)}.smart-switch--on{background-color:var(--switch-on-background-color,#1989fa)}.smart-switch--on .smart-switch__node{transform:translateX(calc(var(--switch-width, 1.667em) - var(--switch-node-size, 1em)))}.smart-switch--disabled{opacity:var(--switch-disabled-opacity,.4)}

package/dist/tabs/index.css

@@ -1 +1 @@
-@import '../common/index.css';:root{--tabs-card-background-color:rgba(0,0,0,.08)}:root[theme=dark]{--tabs-card-background-color:hsla(0,0%,100%,.12)}.smart-tabs{-webkit-tap-highlight-color:transparent;position:relative}.smart-tabs__wrap{display:flex;overflow:hidden}.smart-tabs__wrap--scrollable .smart-tab{flex:0 0 22%}.smart-tabs__wrap--scrollable .smart-tab--complete{flex:1 0 auto!important;padding:0 12px}.smart-tabs__wrap--scrollable .smart-tabs__nav--complete{padding-left:8px;padding-right:8px}.smart-tabs__scroll{background-color:var(--tabs-background-color,var(--app-B3,#fff));overflow:auto}.smart-tabs__scroll--line{box-sizing:initial;height:calc(100% + 15px)}.smart-tabs__scroll--card{border-radius:var(--tabs-card-border-radius,8px);box-sizing:border-box;margin:0 var(--padding-md,16px);width:calc(100% - var(--padding-md, 16px)*2)}.smart-tabs__scroll::-webkit-scrollbar{display:none}.smart-tabs__nav{display:flex;position:relative;-webkit-user-select:none;user-select:none}.smart-tabs__nav--card{background-color:var(--tabs-card-background-color);border-radius:var(--tabs-card-border-radius,8px);box-sizing:border-box;height:var(--tabs-card-height,30px);padding:2px}.smart-tabs__nav--card .smart-tab{border-radius:6px;color:var(--tabs-card-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));line-height:calc(var(--tabs-card-height, 30px) - 2px)}.smart-tabs__nav--card .smart-tab:last-child{border-right:none}.smart-tabs__nav--card .smart-tab.smart-tab--active{background-color:var(--tabs-card-active-background-color,var(--app-B3,#fff));color:var(--tabs-card-text-active-color,var(--app-B6-N1,#000))}.smart-tabs__nav--card .smart-tab--disabled{color:var(--tab-disabled-text-color,var(--app-B6-N7,rgba(0,0,0,.1)))}.smart-tabs__line{background-color:var(--tabs-bottom-bar-color,var(--app-M4,#1989fa));border-radius:var(--tabs-bottom-bar-height,3px);bottom:0;height:var(--tabs-bottom-bar-height,3px);left:0;opacity:0;position:absolute;z-index:1}.smart-tabs__track{height:100%;position:relative;width:100%}.smart-tabs__track--animated{display:flex;transition-property:left}.smart-tabs__content{overflow:hidden}.smart-tabs--line{height:var(--tabs-line-height,32px)}.smart-tabs--card{height:var(--tabs-card-height,30px)}.smart-tab{box-sizing:border-box;color:var(--tabs-card-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));cursor:pointer;flex:1;font-size:var(--tab-font-size,13px);line-height:var(--tabs-line-height,32px);min-width:0;padding:0 5px;position:relative;text-align:center}.smart-tab--active{color:var(--tabs-card-text-active-color,var(--app-B6-N1,#000));font-weight:var(--font-weight-bold,500)}.smart-tab--disabled{color:var(--tab-disabled-text-color,var(--app-B6-N7,rgba(0,0,0,.1)))}.smart-tab__title__info{position:relative!important;top:-1px!important;transform:translateX(0)!important}
+@import '../common/index.css';:root{--tabs-card-background-color:rgba(0,0,0,.08)}:root[theme=dark]{--tabs-card-background-color:hsla(0,0%,100%,.12)}.smart-tabs{-webkit-tap-highlight-color:transparent;position:relative}.smart-tabs__wrap{display:flex;overflow:hidden}.smart-tabs__wrap--scrollable .smart-tab{flex:0 0 22%}.smart-tabs__wrap--scrollable .smart-tab--complete{flex:1 0 auto!important;padding:0 12px}.smart-tabs__wrap--scrollable .smart-tabs__nav--complete{padding-left:8px;padding-right:8px}.smart-tabs__scroll{background-color:var(--tabs-background-color,var(--app-B3,#fff));overflow:auto}.smart-tabs__scroll--line{box-sizing:initial;height:calc(100% + 15px)}.smart-tabs__scroll--card{border-radius:var(--tabs-card-border-radius,8px);box-sizing:border-box;margin:0 var(--padding-md,16px);width:calc(100% - var(--padding-md, 16px)*2)}.smart-tabs__scroll::-webkit-scrollbar{display:none}.smart-tabs__nav{display:flex;position:relative;-webkit-user-select:none;user-select:none}.smart-tabs__nav--card{background-color:var(--tabs-card-background-color);border-radius:var(--tabs-card-border-radius,8px);box-sizing:border-box;height:var(--tabs-card-height,32px);padding:2px}.smart-tabs__nav--card .smart-tab{color:var(--tabs-card-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));line-height:calc(var(--tabs-card-height, 32px) - 2px)}.smart-tabs__nav--card .smart-tab:last-child{border-right:none}.smart-tabs__nav--card .smart-tab.smart-tab--active{color:var(--tabs-card-text-active-color,var(--app-B6-N1,#000))}.smart-tabs__nav--card .smart-tab--disabled{color:var(--tab-disabled-text-color,var(--app-B6-N7,rgba(0,0,0,.1)))}.smart-tabs__line{background-color:var(--tabs-bottom-bar-color,var(--app-M4,#1989fa));border-radius:var(--tabs-bottom-bar-height,3px);bottom:0;height:var(--tabs-bottom-bar-height,3px);left:0;opacity:0;position:absolute;z-index:1}.smart-tabs__card{background-color:var(--tabs-card-active-background-color,var(--app-B3,#fff));border-radius:6px;left:0;opacity:0;position:absolute;top:0;z-index:0}.smart-tabs__track{height:100%;position:relative;width:100%}.smart-tabs__track--animated{display:flex;transition-property:left}.smart-tabs__content{overflow:hidden}.smart-tabs--line{height:var(--tabs-line-height,32px)}.smart-tabs--card{height:var(--tabs-card-height,32px)}.smart-tab{box-sizing:border-box;color:var(--tabs-card-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));cursor:pointer;flex:1;font-size:var(--tab-font-size,13px);line-height:var(--tabs-line-height,32px);min-width:0;padding:0 5px;position:relative;text-align:center}.smart-tab--active{color:var(--tabs-card-text-active-color,var(--app-B6-N1,#000));font-weight:var(--font-weight-bold,500)}.smart-tab--disabled{color:var(--tab-disabled-text-color,var(--app-B6-N7,rgba(0,0,0,.1)))}.smart-tab__title__info{position:relative!important;top:-1px!important;transform:translateX(0)!important}

package/dist/tabs/index.js

@@ -185,10 +185,7 @@ SmartComponent({
             }
         },
         resize() {
-            if (this.data.type !== 'line') {
-                return;
-            }
-            const { currentIndex, ellipsis, skipTransition } = this.data;
+            const { currentIndex, ellipsis, skipTransition, type } = this.data;
             Promise.all([
                 getAllRect(this, '.smart-tab'),
                 getRect(this, '.smart-tabs__line'),
@@ -197,12 +194,18 @@ SmartComponent({
                 if (rect == null) {
                     return;
                 }
+                const { width: cardWidth, height: cardHeight } = rects[currentIndex];
                 let lineOffsetLeft = rects
                     .slice(0, currentIndex)
                     .reduce((prev, curr) => prev + curr.width, 0);
-                lineOffsetLeft +=
-                    (rect.width - lineRect.width) / 2 + (ellipsis ? 0 : 8);
-                this.setData({ lineOffsetLeft, inited: true });
+                if (type === 'line') {
+                    lineOffsetLeft +=
+                        (rect.width - lineRect.width) / 2 + (ellipsis ? 0 : 8);
+                }
+                else if (type === 'card') {
+                    lineOffsetLeft += 2;
+                }
+                this.setData({ lineOffsetLeft, inited: true, cardWidth, cardHeight });
                 this.swiping = true;
                 if (skipTransition) {
                     // waiting transition end

package/dist/tabs/index.wxml

@@ -21,6 +21,7 @@
       >
         <view class="{{ utils.bem('tabs__nav', [type, { complete: !ellipsis }]) }} nav-class" style="{{ computed.navStyle(color, type) }}">
           <view wx:if="{{ type === 'line' }}" class="smart-tabs__line" style="{{ computed.lineStyle({ color, lineOffsetLeft, lineHeight, skipTransition, duration, lineWidth, inited }) }}" />
+          <view wx:if="{{ type === 'card' }}" class="smart-tabs__card" style="{{ computed.cardStyle({ color, lineOffsetLeft, cardHeight, skipTransition, duration, cardWidth, inited }) }}" />
           <view
             wx:for="{{ tabs }}"
             wx:key="index"

package/dist/tabs/index.wxs

@@ -74,10 +74,27 @@ function lineStyle(data) {
   });
 }
 
+function cardStyle(data) {
+  return style({
+    width: utils.addUnit(data.cardWidth),
+    opacity: data.inited ? 1 : 0,
+    transform: 'translateX(' + data.lineOffsetLeft + 'px)',
+    '-webkit-transform': 'translate(' + data.lineOffsetLeft + 'px, 2px)',
+    'background-color': data.color,
+    height: utils.addUnit(data.cardHeight),
+    'transition-duration': !data.skipTransition ? data.duration + 's' : null,
+    '-webkit-transition-duration': !data.skipTransition
+      ? data.duration + 's'
+      : null,
+  });
+}
+
+
 module.exports = {
   tabClass: tabClass,
   tabStyle: tabStyle,
   trackStyle: trackStyle,
   lineStyle: lineStyle,
   navStyle: navStyle,
+  cardStyle: cardStyle,
 };

package/dist/tabs/index.wxss

@@ -1 +1 @@
-@import '../common/index.wxss';:root{--tabs-card-background-color:rgba(0,0,0,.08)}:root[theme=dark]{--tabs-card-background-color:hsla(0,0%,100%,.12)}.smart-tabs{-webkit-tap-highlight-color:transparent;position:relative}.smart-tabs__wrap{display:flex;overflow:hidden}.smart-tabs__wrap--scrollable .smart-tab{flex:0 0 22%}.smart-tabs__wrap--scrollable .smart-tab--complete{flex:1 0 auto!important;padding:0 12px}.smart-tabs__wrap--scrollable .smart-tabs__nav--complete{padding-left:8px;padding-right:8px}.smart-tabs__scroll{background-color:var(--tabs-background-color,var(--app-B3,#fff));overflow:auto}.smart-tabs__scroll--line{box-sizing:initial;height:calc(100% + 15px)}.smart-tabs__scroll--card{border-radius:var(--tabs-card-border-radius,8px);box-sizing:border-box;margin:0 var(--padding-md,16px);width:calc(100% - var(--padding-md, 16px)*2)}.smart-tabs__scroll::-webkit-scrollbar{display:none}.smart-tabs__nav{display:flex;position:relative;-webkit-user-select:none;user-select:none}.smart-tabs__nav--card{background-color:var(--tabs-card-background-color);border-radius:var(--tabs-card-border-radius,8px);box-sizing:border-box;height:var(--tabs-card-height,30px);padding:2px}.smart-tabs__nav--card .smart-tab{border-radius:6px;color:var(--tabs-card-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));line-height:calc(var(--tabs-card-height, 30px) - 2px)}.smart-tabs__nav--card .smart-tab:last-child{border-right:none}.smart-tabs__nav--card .smart-tab.smart-tab--active{background-color:var(--tabs-card-active-background-color,var(--app-B3,#fff));color:var(--tabs-card-text-active-color,var(--app-B6-N1,#000))}.smart-tabs__nav--card .smart-tab--disabled{color:var(--tab-disabled-text-color,var(--app-B6-N7,rgba(0,0,0,.1)))}.smart-tabs__line{background-color:var(--tabs-bottom-bar-color,var(--app-M4,#1989fa));border-radius:var(--tabs-bottom-bar-height,3px);bottom:0;height:var(--tabs-bottom-bar-height,3px);left:0;opacity:0;position:absolute;z-index:1}.smart-tabs__track{height:100%;position:relative;width:100%}.smart-tabs__track--animated{display:flex;transition-property:left}.smart-tabs__content{overflow:hidden}.smart-tabs--line{height:var(--tabs-line-height,32px)}.smart-tabs--card{height:var(--tabs-card-height,30px)}.smart-tab{box-sizing:border-box;color:var(--tabs-card-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));cursor:pointer;flex:1;font-size:var(--tab-font-size,13px);line-height:var(--tabs-line-height,32px);min-width:0;padding:0 5px;position:relative;text-align:center}.smart-tab--active{color:var(--tabs-card-text-active-color,var(--app-B6-N1,#000));font-weight:var(--font-weight-bold,500)}.smart-tab--disabled{color:var(--tab-disabled-text-color,var(--app-B6-N7,rgba(0,0,0,.1)))}.smart-tab__title__info{position:relative!important;top:-1px!important;transform:translateX(0)!important}
+@import '../common/index.wxss';:root{--tabs-card-background-color:rgba(0,0,0,.08)}:root[theme=dark]{--tabs-card-background-color:hsla(0,0%,100%,.12)}.smart-tabs{-webkit-tap-highlight-color:transparent;position:relative}.smart-tabs__wrap{display:flex;overflow:hidden}.smart-tabs__wrap--scrollable .smart-tab{flex:0 0 22%}.smart-tabs__wrap--scrollable .smart-tab--complete{flex:1 0 auto!important;padding:0 12px}.smart-tabs__wrap--scrollable .smart-tabs__nav--complete{padding-left:8px;padding-right:8px}.smart-tabs__scroll{background-color:var(--tabs-background-color,var(--app-B3,#fff));overflow:auto}.smart-tabs__scroll--line{box-sizing:initial;height:calc(100% + 15px)}.smart-tabs__scroll--card{border-radius:var(--tabs-card-border-radius,8px);box-sizing:border-box;margin:0 var(--padding-md,16px);width:calc(100% - var(--padding-md, 16px)*2)}.smart-tabs__scroll::-webkit-scrollbar{display:none}.smart-tabs__nav{display:flex;position:relative;-webkit-user-select:none;user-select:none}.smart-tabs__nav--card{background-color:var(--tabs-card-background-color);border-radius:var(--tabs-card-border-radius,8px);box-sizing:border-box;height:var(--tabs-card-height,32px);padding:2px}.smart-tabs__nav--card .smart-tab{color:var(--tabs-card-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));line-height:calc(var(--tabs-card-height, 32px) - 2px)}.smart-tabs__nav--card .smart-tab:last-child{border-right:none}.smart-tabs__nav--card .smart-tab.smart-tab--active{color:var(--tabs-card-text-active-color,var(--app-B6-N1,#000))}.smart-tabs__nav--card .smart-tab--disabled{color:var(--tab-disabled-text-color,var(--app-B6-N7,rgba(0,0,0,.1)))}.smart-tabs__line{background-color:var(--tabs-bottom-bar-color,var(--app-M4,#1989fa));border-radius:var(--tabs-bottom-bar-height,3px);bottom:0;height:var(--tabs-bottom-bar-height,3px);left:0;opacity:0;position:absolute;z-index:1}.smart-tabs__card{background-color:var(--tabs-card-active-background-color,var(--app-B3,#fff));border-radius:6px;left:0;opacity:0;position:absolute;top:0;z-index:0}.smart-tabs__track{height:100%;position:relative;width:100%}.smart-tabs__track--animated{display:flex;transition-property:left}.smart-tabs__content{overflow:hidden}.smart-tabs--line{height:var(--tabs-line-height,32px)}.smart-tabs--card{height:var(--tabs-card-height,32px)}.smart-tab{box-sizing:border-box;color:var(--tabs-card-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));cursor:pointer;flex:1;font-size:var(--tab-font-size,13px);line-height:var(--tabs-line-height,32px);min-width:0;padding:0 5px;position:relative;text-align:center}.smart-tab--active{color:var(--tabs-card-text-active-color,var(--app-B6-N1,#000));font-weight:var(--font-weight-bold,500)}.smart-tab--disabled{color:var(--tab-disabled-text-color,var(--app-B6-N7,rgba(0,0,0,.1)))}.smart-tab__title__info{position:relative!important;top:-1px!important;transform:translateX(0)!important}

package/dist/tag/index.css

@@ -1 +1 @@
-@import '../common/index.css';.smart-tag{align-items:center;border-radius:var(--tag-border-radius,2px);color:var(--tag-text-color,#fff);display:inline-flex;font-size:var(--tag-font-size,12px);line-height:var(--tag-line-height,16px);padding:var(--tag-padding,0 4px);position:relative}.smart-tag--default{background-color:var(--tag-default-color,#969799)}.smart-tag--default.smart-tag--plain{color:var(--tag-default-color,#969799)}.smart-tag--danger{background-color:var(--tag-danger-color,#ee0a24)}.smart-tag--danger.smart-tag--plain{color:var(--tag-danger-color,#ee0a24)}.smart-tag--primary{background-color:var(--tag-primary-color,#1989fa)}.smart-tag--primary.smart-tag--plain{color:var(--tag-primary-color,#1989fa)}.smart-tag--success{background-color:var(--tag-success-color,#07c160)}.smart-tag--success.smart-tag--plain{color:var(--tag-success-color,#07c160)}.smart-tag--warning{background-color:var(--tag-warning-color,#ff976a)}.smart-tag--warning.smart-tag--plain{color:var(--tag-warning-color,#ff976a)}.smart-tag--plain{background-color:var(--tag-plain-background-color,#fff)}.smart-tag--plain:before{border:1px solid;border-radius:inherit;bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}.smart-tag--medium{padding:var(--tag-medium-padding,2px 6px)}.smart-tag--large{border-radius:var(--tag-large-border-radius,4px);font-size:var(--tag-large-font-size,14px);padding:var(--tag-large-padding,4px 8px)}.smart-tag--mark{border-radius:0 var(--tag-round-border-radius,var(--tag-round-border-radius,999px)) var(--tag-round-border-radius,var(--tag-round-border-radius,999px)) 0}.smart-tag--mark:after{content:"";display:block;width:2px}.smart-tag--round{border-radius:var(--tag-round-border-radius,999px)}.smart-tag__close{margin-left:2px;min-width:1em}
+@import '../common/index.css';.smart-tag{align-items:center;border-radius:var(--tag-border-radius,4px);color:var(--tag-text-color,#fff);display:inline-flex;font-size:var(--tag-font-size,12px);line-height:var(--tag-line-height,17px);padding:var(--tag-padding,2px 8px);position:relative}.smart-tag--default{background-color:var(--tag-default-color,#969799)}.smart-tag--default.smart-tag--plain{color:var(--tag-default-color,#969799)}.smart-tag--danger{background-color:var(--tag-danger-color,#ee0a24)}.smart-tag--danger.smart-tag--plain{color:var(--tag-danger-color,#ee0a24)}.smart-tag--primary{background-color:var(--tag-primary-color,#1989fa)}.smart-tag--primary.smart-tag--plain{color:var(--tag-primary-color,#1989fa)}.smart-tag--success{background-color:var(--tag-success-color,#07c160)}.smart-tag--success.smart-tag--plain{color:var(--tag-success-color,#07c160)}.smart-tag--warning{background-color:var(--tag-warning-color,#ff976a)}.smart-tag--warning.smart-tag--plain{color:var(--tag-warning-color,#ff976a)}.smart-tag--plain{background-color:var(--tag-plain-background-color,#fff)}.smart-tag--plain:before{border:1px solid;border-radius:inherit;bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}.smart-tag--medium{font-size:var(--tag-medium-font-size,14px);line-height:var(--tag-medium-line-height,20px)}.smart-tag--large{font-size:var(--tag-large-font-size,16px);line-height:var(--tag-large-line-height,22px)}.smart-tag--mark{border-radius:0 var(--tag-round-border-radius,var(--tag-round-border-radius,999px)) var(--tag-round-border-radius,var(--tag-round-border-radius,999px)) 0}.smart-tag--mark:after{content:"";display:block;width:2px}.smart-tag--round{border-radius:var(--tag-round-border-radius,999px)}.smart-tag__close{margin-left:2px;min-width:1em}

package/dist/tag/index.wxss

@@ -1 +1 @@
-@import '../common/index.wxss';.smart-tag{align-items:center;border-radius:var(--tag-border-radius,2px);color:var(--tag-text-color,#fff);display:inline-flex;font-size:var(--tag-font-size,12px);line-height:var(--tag-line-height,16px);padding:var(--tag-padding,0 4px);position:relative}.smart-tag--default{background-color:var(--tag-default-color,#969799)}.smart-tag--default.smart-tag--plain{color:var(--tag-default-color,#969799)}.smart-tag--danger{background-color:var(--tag-danger-color,#ee0a24)}.smart-tag--danger.smart-tag--plain{color:var(--tag-danger-color,#ee0a24)}.smart-tag--primary{background-color:var(--tag-primary-color,#1989fa)}.smart-tag--primary.smart-tag--plain{color:var(--tag-primary-color,#1989fa)}.smart-tag--success{background-color:var(--tag-success-color,#07c160)}.smart-tag--success.smart-tag--plain{color:var(--tag-success-color,#07c160)}.smart-tag--warning{background-color:var(--tag-warning-color,#ff976a)}.smart-tag--warning.smart-tag--plain{color:var(--tag-warning-color,#ff976a)}.smart-tag--plain{background-color:var(--tag-plain-background-color,#fff)}.smart-tag--plain:before{border:1px solid;border-radius:inherit;bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}.smart-tag--medium{padding:var(--tag-medium-padding,2px 6px)}.smart-tag--large{border-radius:var(--tag-large-border-radius,4px);font-size:var(--tag-large-font-size,14px);padding:var(--tag-large-padding,4px 8px)}.smart-tag--mark{border-radius:0 var(--tag-round-border-radius,var(--tag-round-border-radius,999px)) var(--tag-round-border-radius,var(--tag-round-border-radius,999px)) 0}.smart-tag--mark:after{content:"";display:block;width:2px}.smart-tag--round{border-radius:var(--tag-round-border-radius,999px)}.smart-tag__close{margin-left:2px;min-width:1em}
+@import '../common/index.wxss';.smart-tag{align-items:center;border-radius:var(--tag-border-radius,4px);color:var(--tag-text-color,#fff);display:inline-flex;font-size:var(--tag-font-size,12px);line-height:var(--tag-line-height,17px);padding:var(--tag-padding,2px 8px);position:relative}.smart-tag--default{background-color:var(--tag-default-color,#969799)}.smart-tag--default.smart-tag--plain{color:var(--tag-default-color,#969799)}.smart-tag--danger{background-color:var(--tag-danger-color,#ee0a24)}.smart-tag--danger.smart-tag--plain{color:var(--tag-danger-color,#ee0a24)}.smart-tag--primary{background-color:var(--tag-primary-color,#1989fa)}.smart-tag--primary.smart-tag--plain{color:var(--tag-primary-color,#1989fa)}.smart-tag--success{background-color:var(--tag-success-color,#07c160)}.smart-tag--success.smart-tag--plain{color:var(--tag-success-color,#07c160)}.smart-tag--warning{background-color:var(--tag-warning-color,#ff976a)}.smart-tag--warning.smart-tag--plain{color:var(--tag-warning-color,#ff976a)}.smart-tag--plain{background-color:var(--tag-plain-background-color,#fff)}.smart-tag--plain:before{border:1px solid;border-radius:inherit;bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}.smart-tag--medium{font-size:var(--tag-medium-font-size,14px);line-height:var(--tag-medium-line-height,20px)}.smart-tag--large{font-size:var(--tag-large-font-size,16px);line-height:var(--tag-large-line-height,22px)}.smart-tag--mark{border-radius:0 var(--tag-round-border-radius,var(--tag-round-border-radius,999px)) var(--tag-round-border-radius,var(--tag-round-border-radius,999px)) 0}.smart-tag--mark:after{content:"";display:block;width:2px}.smart-tag--round{border-radius:var(--tag-round-border-radius,999px)}.smart-tag__close{margin-left:2px;min-width:1em}

package/dist/toast/icons.d.ts

@@ -0,0 +1,3 @@
+export declare const Success: "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20standalone%3D%22no%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg%20class%3D%22icon%22%20width%3D%22200px%22%20height%3D%22200.00px%22%20viewBox%3D%220%200%201024%201024%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M639.232%20815.232a315.306667%20315.306667%200%200%201-127.061333%2025.898667%20314.922667%20314.922667%200%200%201-127.232-25.898667%20337.92%20337.92%200%200%201-104.832-71.338667%20337.834667%20337.834667%200%200%201-71.338667-104.832%20314.88%20314.88%200%200%201-25.898667-127.232%20317.013333%20317.013333%200%200%201%2025.728-127.061333%20335.445333%20335.445333%200%200%201%2071.338667-105.173333%20333.653333%20333.653333%200%200%201%20105.002667-71.168c39.68-17.066667%2081.92-25.6%20126.890666-25.6%2044.928%200%2087.296%208.533333%20127.061334%2025.6%2039.722667%2017.066667%2074.752%2040.789333%20105.002666%2071.168a339.2%20339.2%200%200%201%2071.338667%20105.173333c17.28%2039.765333%2025.898667%2082.133333%2025.898667%20127.061333a316.714667%20316.714667%200%200%201-25.728%20127.232%20337.322667%20337.322667%200%200%201-176.213334%20176.213334z%20m-178.901333-149.930667a32.128%2032.128%200%200%200%2016.256%204.053334c11.733333%200%2021.12-5.546667%2028.16-16.597334l150.058666-235.434666c2.261333-3.413333%204.266667-6.954667%205.930667-10.666667a26.453333%2026.453333%200%200%200%202.56-11.050667%2023.466667%2023.466667%200%200%200-8.96-19.114666%2031.146667%2031.146667%200%200%200-20.181333-7.296c-9.728%200-17.877333%205.290667-24.405334%2015.914666l-134.485333%20215.808-63.701333-81.28a35.413333%2035.413333%200%200%200-11.690667-10.88%2028.16%2028.16%200%200%200-13.056-3.029333%2026.325333%2026.325333%200%200%200-19.84%208.32%2028.032%2028.032%200%200%200-7.936%2020.138667c0%207.466667%202.816%2014.677333%208.448%2021.674666l79.274667%2097.28c4.309333%205.376%208.832%209.472%2013.568%2012.16z%22%2F%3E%3C%2Fsvg%3E";
+export declare const Alarm: "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20standalone%3D%22no%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg%20class%3D%22icon%22%20width%3D%22200px%22%20height%3D%22200.00px%22%20viewBox%3D%220%200%201024%201024%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M512%2053.248c129.707%203.413%20237.739%2048.299%20324.096%20134.656S967.339%20382.293%20970.752%20512c-3.413%20129.707-48.299%20237.739-134.656%20324.096S641.707%20967.339%20512%20970.752c-129.707-3.413-237.739-48.299-324.096-134.656S56.661%20641.707%2053.248%20512c3.413-129.707%2048.299-237.739%20134.656-324.096S382.293%2056.661%20512%2053.248z%20m0%20196.608c-17.749%200-32.427%206.485-44.032%2019.456-11.605%2012.971-16.725%2028.331-15.36%2046.08l23.552%20262.144c1.365%209.557%205.291%2017.237%2011.776%2023.04%206.485%205.803%2014.507%208.704%2024.064%208.704s17.579-2.901%2024.064-8.704c6.485-5.803%2010.411-13.483%2011.776-23.04l23.552-262.144c1.365-17.749-3.755-33.109-15.36-46.08-11.605-12.971-26.283-19.456-44.032-19.456z%20m0%20524.288c15.019-0.683%2027.477-5.803%2037.376-15.36%209.899-9.557%2014.848-21.845%2014.848-36.864%200-15.019-4.949-27.477-14.848-37.376-9.899-9.899-22.357-14.848-37.376-14.848-15.019%200-27.477%204.949-37.376%2014.848-9.899%209.899-14.848%2022.357-14.848%2037.376%200%2015.019%204.949%2027.307%2014.848%2036.864%209.899%209.557%2022.357%2014.677%2037.376%2015.36z%22%2F%3E%3C%2Fsvg%3E";
+export declare const Error: "data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20standalone%3D%22no%22%3F%3E%3C!DOCTYPE%20svg%20PUBLIC%20%22-%2F%2FW3C%2F%2FDTD%20SVG%201.1%2F%2FEN%22%20%22http%3A%2F%2Fwww.w3.org%2FGraphics%2FSVG%2F1.1%2FDTD%2Fsvg11.dtd%22%3E%3Csvg%20class%3D%22icon%22%20width%3D%22200px%22%20height%3D%22200.00px%22%20viewBox%3D%220%200%201024%201024%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M134.997333%20512a377.002667%20377.002667%200%201%201%20754.005334%200%20377.002667%20377.002667%200%200%201-754.005334%200zM512%2051.2C257.493333%2051.2%2051.2%20257.493333%2051.2%20512c0%20254.464%20206.293333%20460.8%20460.8%20460.8%20254.506667%200%20460.8-206.336%20460.8-460.8%200-254.506667-206.293333-460.8-460.8-460.8z%20m177.749333%20638.506667a41.898667%2041.898667%200%200%201-59.264%200L512%20571.221333l-118.485333%20118.485334a41.898667%2041.898667%200%200%201-59.221334-59.221334L452.778667%20512%20334.293333%20393.514667a41.898667%2041.898667%200%200%201%2059.221334-59.264L512%20452.736l118.485333-118.485333a41.898667%2041.898667%200%201%201%2059.264%2059.264L571.264%20512l118.485333%20118.485333a41.898667%2041.898667%200%200%201%200%2059.221334z%22%2F%3E%3C%2Fsvg%3E";

package/dist/toast/icons.js

@@ -0,0 +1,6 @@
+import Warning from '@tuya-miniapp/icons/dist/svg/Warning';
+import CheckmarkCircle from '@tuya-miniapp/icons/dist/svg/CheckmarkCircle';
+import Cancel from '@tuya-miniapp/icons/dist/svg/Cancel';
+export const Success = CheckmarkCircle;
+export const Alarm = Warning;
+export const Error = Cancel;

package/dist/toast/index.js

@@ -1,5 +1,4 @@
-import Checkmark from '@tuya-miniapp/icons/dist/svg/Checkmark';
-import Smark from '@tuya-miniapp/icons/dist/svg/Xmark';
+import { Success, Alarm, Error } from './icons';
 import { SmartComponent } from '../common/component';
 SmartComponent({
     props: {
@@ -11,6 +10,7 @@ SmartComponent({
             type: Number,
             value: 1000,
         },
+        //
         type: {
             type: String,
             value: 'text',
@@ -23,10 +23,14 @@ SmartComponent({
             type: String,
             value: 'middle',
         },
+        width: {
+            type: Number,
+        },
     },
     data: {
-        success: Checkmark,
-        error: Smark,
+        success: Success,
+        error: Error,
+        warn: Alarm,
     },
     methods: {
         // for prevent touchmove

package/dist/toast/index.wxml

@@ -12,6 +12,7 @@
   <view
     class="smart-toast smart-toast--{{ (type === 'text' || type === 'html') ? 'text' : 'icon' }} smart-toast--{{ position }}"
     catch:touchmove="noop"
+    style="width: {{ width !== '100%' ? (width + 'px') : '100%' }}"
   >
     <!-- text only -->
     <text wx:if="{{ type === 'text' }}">{{ message }}</text>
@@ -21,13 +22,8 @@
 
     <!-- with icon -->
     <block wx:else>
-      <smart-loading
-        wx:if="{{ type === 'loading' }}"
-        color="white"
-        type="{{ loadingType }}"
-        custom-class="smart-toast__loading"
-      />
-      <smart-icon  color="white" wx:else class="smart-toast__icon" name="{{ type === 'success' ? success : error }}" />
+      <smart-loading wx:if="{{ type === 'loading' }}" size="60" color="white" type="{{loadingType}}" />
+      <smart-icon wx:else color="white" class="smart-toast__icon" name="{{ type === 'success' ? success : type === 'fail' ? error : type === 'warn' ? warn : success }}" />
       <text wx:if="{{ message }}" class="smart-toast__text">{{ message }}</text>
     </block>