@tuya-miniapp/smart-ui 0.0.1-beta-3 → 0.0.1-beta-5

package/dist/picker-column/index.css

@@ -1 +1 @@
-@import '../common/index.css';.van-picker-column{color:var(--picker-option-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));font-size:var(--picker-option-font-size,16px);position:relative;text-align:center}.van-picker-column__item{padding:0 5px}.van-picker-column__item--selected{color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-weight:var(--font-weight-bold,500)}.van-picker-column__item--disabled{opacity:var(--picker-option-disabled-opacity,.3)}.van-picker-column__unit{color:var(--picker-option-unit-text-color,var(--app-B6-N4,rgba(0,0,0,.4)));font-size:var(--picker-option-unit-font-size,12px);left:50%;position:absolute;top:50%;transform:translate(100%,-50%)}.van-picker-column__max-text{font-weight:var(--font-weight-bold,500);opacity:0}
+@import '../common/index.css';.van-picker-column{color:var(--picker-option-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));font-size:var(--picker-option-font-size,16px);position:relative;text-align:center}.van-picker-column__item{padding:0 5px}.van-picker-column__item--selected{color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-weight:var(--font-weight-bold,500)}.van-picker-column__item--disabled{opacity:var(--picker-option-disabled-opacity,.3)}.van-picker-column__unit{align-items:center;display:flex;justify-content:center;position:absolute;top:50%;transform:translateY(-50%);width:100%}.van-picker-column__unit_text{color:var(--picker-option-unit-text-color,var(--app-B6-N4,rgba(0,0,0,.4)));font-size:var(--picker-option-unit-font-size,12px)}.van-picker-column__unit_hidden{opacity:0}.van-picker-column__max-text{font-weight:var(--font-weight-bold,500);opacity:0}

package/dist/picker-column/index.js

@@ -128,7 +128,11 @@ VantComponent({
                 const optionsV = options.slice(renderStart, renderEnd);
                 return this.set({ optionsV, renderStart, renderNum });
             }
-            return this.set({ optionsV: options });
+            return this.set({
+                optionsV: options,
+                renderStart: 0,
+                renderNum: options.length,
+            });
         },
         adjustIndex(index) {
             const { data } = this;

package/dist/picker-column/index.wxml

@@ -8,10 +8,8 @@
   catch:touchmove="onTouchMove"
   bind:touchend="onTouchEnd"
   bind:touchcancel="onTouchEnd"
-  maxtext="{{ maxText }}"
-  change:maxtext="{{ computed.unitStyle }}"
 >
-  <view style="{{ computed.wrapperStyle({ offset, itemHeight, visibleItemCount, animate, duration, renderStart }) }}"
+  <view style="{{ computed.wrapperStyle({ offset, itemHeight, visibleItemCount, animate, duration, renderStart, unit }) }}"
   bind:transitionend="onTransitionEnd"
   id="options">
     <view
@@ -24,9 +22,10 @@
       bindtap="onClickItem"
     >{{ computed.optionText(option, valueKey) }}</view>
   </view>
-  <view wx:if="{{unit}}" >
+  <view wx:if="{{unit}}" class="van-picker-column__unit" style="height: {{ itemHeight }}px">
+    <view class="van-picker-column__unit_text van-picker-column__unit_hidden" >{{unit}}</view>
     <text class="van-picker-column__max-text">{{ maxText }}</text>
-    <view class="van-picker-column__unit" >{{unit}}</view>
+    <view class="van-picker-column__unit_text" >{{unit}}</view>
   </view>
   
 </view>

package/dist/picker-column/index.wxs

@@ -17,19 +17,6 @@ function rootStyle(data) {
   });
 }
 
-function unitStyle(value, oldValue, ownerInstance) {
-  var maxTextDom = ownerInstance.selectComponent('.van-picker-column__max-text');
-  var optionsDom = ownerInstance.selectComponent('#options');
-  var unitDom = ownerInstance.selectComponent('.van-picker-column__unit');
-  if (unitDom && maxTextDom) {
-    var maxWidth = maxTextDom.getBoundingClientRect().width;
-    optionsDom.setStyle({ 'text-indent': '-8rpx' });
-    unitDom.setStyle({
-      transform: 'translate(' + maxWidth / 2 + 'px,-50%)',
-    });
-  }
-}
-
 function wrapperStyle(data) {
   var offset =
     data.offset + (data.itemHeight * (data.visibleItemCount - 1)) / 2;
@@ -40,12 +27,14 @@ function wrapperStyle(data) {
   offset = addUnit(offset);
   if (data.animate) {
     return style({
+      'text-indent': data.unit ? '-8rpx' : '0',
       transition: 'transform ' + data.duration + 'ms',
       'line-height': addUnit(data.itemHeight),
       transform: 'translate3d(0, ' + offset + ', 0)',
     });
   }
   return style({
+    'text-indent': data.unit ? '-8rpx' : '0',
     'line-height': addUnit(data.itemHeight),
     transform: 'translate3d(0, ' + offset + ', 0)',
   });
@@ -55,5 +44,4 @@ module.exports = {
   optionText: optionText,
   rootStyle: rootStyle,
   wrapperStyle: wrapperStyle,
-  unitStyle: unitStyle,
 };

package/dist/picker-column/index.wxss

@@ -1 +1 @@
-@import '../common/index.wxss';.van-picker-column{color:var(--picker-option-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));font-size:var(--picker-option-font-size,16px);position:relative;text-align:center}.van-picker-column__item{padding:0 5px}.van-picker-column__item--selected{color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-weight:var(--font-weight-bold,500)}.van-picker-column__item--disabled{opacity:var(--picker-option-disabled-opacity,.3)}.van-picker-column__unit{color:var(--picker-option-unit-text-color,var(--app-B6-N4,rgba(0,0,0,.4)));font-size:var(--picker-option-unit-font-size,12px);left:50%;position:absolute;top:50%;transform:translate(100%,-50%)}.van-picker-column__max-text{font-weight:var(--font-weight-bold,500);opacity:0}
+@import '../common/index.wxss';.van-picker-column{color:var(--picker-option-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));font-size:var(--picker-option-font-size,16px);position:relative;text-align:center}.van-picker-column__item{padding:0 5px}.van-picker-column__item--selected{color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-weight:var(--font-weight-bold,500)}.van-picker-column__item--disabled{opacity:var(--picker-option-disabled-opacity,.3)}.van-picker-column__unit{align-items:center;display:flex;justify-content:center;position:absolute;top:50%;transform:translateY(-50%);width:100%}.van-picker-column__unit_text{color:var(--picker-option-unit-text-color,var(--app-B6-N4,rgba(0,0,0,.4)));font-size:var(--picker-option-unit-font-size,12px)}.van-picker-column__unit_hidden{opacity:0}.van-picker-column__max-text{font-weight:var(--font-weight-bold,500);opacity:0}

package/dist/radio/index.js

@@ -1,3 +1,4 @@
+import CheckMarkIcon from '@tuya-miniapp/icons/dist/svg/Checkmark';
 import { canIUseModel } from '../common/version';
 import { VantComponent } from '../common/component';
 import { useParent } from '../common/relation';
@@ -30,6 +31,7 @@ VantComponent({
     data: {
         direction: '',
         parentDisabled: false,
+        icon: CheckMarkIcon,
     },
     methods: {
         updateFromParent() {

package/dist/radio/index.wxml

@@ -13,7 +13,8 @@
     <slot wx:if="{{ useIconSlot }}" name="icon" />
     <van-icon
       wx:else
-      name="success"
+      name="{{ icon }}"
+      color="{{ value ? '#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/stepper/index.wxml

@@ -6,7 +6,7 @@
     wx:if="{{ showMinus }}"
     data-type="minus"
     style="{{ computed.buttonStyle({ buttonSize }) }}"
-    class="minus-class {{ utils.bem('stepper__minus', { disabled: disabled || disableMinus || currentValue <= min }) }}"
+    class="minus-class {{ utils.bem('stepper__minus', { disabled: disabled || disableMinus || currentValue <= +min }) }}"
     hover-class="van-stepper__minus--hover"
     hover-stay-time="70"
     bind:tap="onTap"
@@ -31,7 +31,7 @@
     wx:if="{{ showPlus }}"
     data-type="plus"
     style="{{ computed.buttonStyle({ buttonSize }) }}"
-    class="plus-class {{ utils.bem('stepper__plus', { disabled: disabled || disablePlus || currentValue >= max }) }}"
+    class="plus-class {{ utils.bem('stepper__plus', { disabled: disabled || disablePlus || currentValue >= +max }) }}"
     hover-class="van-stepper__plus--hover"
     hover-stay-time="70"
     bind:tap="onTap"

package/lib/picker-column/index.css

@@ -1 +1 @@
-@import '../common/index.css';.van-picker-column{color:var(--picker-option-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));font-size:var(--picker-option-font-size,16px);position:relative;text-align:center}.van-picker-column__item{padding:0 5px}.van-picker-column__item--selected{color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-weight:var(--font-weight-bold,500)}.van-picker-column__item--disabled{opacity:var(--picker-option-disabled-opacity,.3)}.van-picker-column__unit{color:var(--picker-option-unit-text-color,var(--app-B6-N4,rgba(0,0,0,.4)));font-size:var(--picker-option-unit-font-size,12px);left:50%;position:absolute;top:50%;transform:translate(100%,-50%)}.van-picker-column__max-text{font-weight:var(--font-weight-bold,500);opacity:0}
+@import '../common/index.css';.van-picker-column{color:var(--picker-option-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));font-size:var(--picker-option-font-size,16px);position:relative;text-align:center}.van-picker-column__item{padding:0 5px}.van-picker-column__item--selected{color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-weight:var(--font-weight-bold,500)}.van-picker-column__item--disabled{opacity:var(--picker-option-disabled-opacity,.3)}.van-picker-column__unit{align-items:center;display:flex;justify-content:center;position:absolute;top:50%;transform:translateY(-50%);width:100%}.van-picker-column__unit_text{color:var(--picker-option-unit-text-color,var(--app-B6-N4,rgba(0,0,0,.4)));font-size:var(--picker-option-unit-font-size,12px)}.van-picker-column__unit_hidden{opacity:0}.van-picker-column__max-text{font-weight:var(--font-weight-bold,500);opacity:0}

package/lib/picker-column/index.js

@@ -130,7 +130,11 @@ var DEFAULT_DURATION = 200;
                 var optionsV = options.slice(renderStart, renderEnd);
                 return this.set({ optionsV: optionsV, renderStart: renderStart, renderNum: renderNum });
             }
-            return this.set({ optionsV: options });
+            return this.set({
+                optionsV: options,
+                renderStart: 0,
+                renderNum: options.length,
+            });
         },
         adjustIndex: function (index) {
             var data = this.data;

package/lib/picker-column/index.wxml

@@ -8,10 +8,8 @@
   catch:touchmove="onTouchMove"
   bind:touchend="onTouchEnd"
   bind:touchcancel="onTouchEnd"
-  maxtext="{{ maxText }}"
-  change:maxtext="{{ computed.unitStyle }}"
 >
-  <view style="{{ computed.wrapperStyle({ offset, itemHeight, visibleItemCount, animate, duration, renderStart }) }}"
+  <view style="{{ computed.wrapperStyle({ offset, itemHeight, visibleItemCount, animate, duration, renderStart, unit }) }}"
   bind:transitionend="onTransitionEnd"
   id="options">
     <view
@@ -24,9 +22,10 @@
       bindtap="onClickItem"
     >{{ computed.optionText(option, valueKey) }}</view>
   </view>
-  <view wx:if="{{unit}}" >
+  <view wx:if="{{unit}}" class="van-picker-column__unit" style="height: {{ itemHeight }}px">
+    <view class="van-picker-column__unit_text van-picker-column__unit_hidden" >{{unit}}</view>
     <text class="van-picker-column__max-text">{{ maxText }}</text>
-    <view class="van-picker-column__unit" >{{unit}}</view>
+    <view class="van-picker-column__unit_text" >{{unit}}</view>
   </view>
   
 </view>

package/lib/picker-column/index.wxs

@@ -17,19 +17,6 @@ function rootStyle(data) {
   });
 }
 
-function unitStyle(value, oldValue, ownerInstance) {
-  var maxTextDom = ownerInstance.selectComponent('.van-picker-column__max-text');
-  var optionsDom = ownerInstance.selectComponent('#options');
-  var unitDom = ownerInstance.selectComponent('.van-picker-column__unit');
-  if (unitDom && maxTextDom) {
-    var maxWidth = maxTextDom.getBoundingClientRect().width;
-    optionsDom.setStyle({ 'text-indent': '-8rpx' });
-    unitDom.setStyle({
-      transform: 'translate(' + maxWidth / 2 + 'px,-50%)',
-    });
-  }
-}
-
 function wrapperStyle(data) {
   var offset =
     data.offset + (data.itemHeight * (data.visibleItemCount - 1)) / 2;
@@ -40,12 +27,14 @@ function wrapperStyle(data) {
   offset = addUnit(offset);
   if (data.animate) {
     return style({
+      'text-indent': data.unit ? '-8rpx' : '0',
       transition: 'transform ' + data.duration + 'ms',
       'line-height': addUnit(data.itemHeight),
       transform: 'translate3d(0, ' + offset + ', 0)',
     });
   }
   return style({
+    'text-indent': data.unit ? '-8rpx' : '0',
     'line-height': addUnit(data.itemHeight),
     transform: 'translate3d(0, ' + offset + ', 0)',
   });
@@ -55,5 +44,4 @@ module.exports = {
   optionText: optionText,
   rootStyle: rootStyle,
   wrapperStyle: wrapperStyle,
-  unitStyle: unitStyle,
 };

package/lib/picker-column/index.wxss

@@ -1 +1 @@
-@import '../common/index.wxss';.van-picker-column{color:var(--picker-option-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));font-size:var(--picker-option-font-size,16px);position:relative;text-align:center}.van-picker-column__item{padding:0 5px}.van-picker-column__item--selected{color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-weight:var(--font-weight-bold,500)}.van-picker-column__item--disabled{opacity:var(--picker-option-disabled-opacity,.3)}.van-picker-column__unit{color:var(--picker-option-unit-text-color,var(--app-B6-N4,rgba(0,0,0,.4)));font-size:var(--picker-option-unit-font-size,12px);left:50%;position:absolute;top:50%;transform:translate(100%,-50%)}.van-picker-column__max-text{font-weight:var(--font-weight-bold,500);opacity:0}
+@import '../common/index.wxss';.van-picker-column{color:var(--picker-option-text-color,var(--app-B6-N3,rgba(0,0,0,.5)));font-size:var(--picker-option-font-size,16px);position:relative;text-align:center}.van-picker-column__item{padding:0 5px}.van-picker-column__item--selected{color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-weight:var(--font-weight-bold,500)}.van-picker-column__item--disabled{opacity:var(--picker-option-disabled-opacity,.3)}.van-picker-column__unit{align-items:center;display:flex;justify-content:center;position:absolute;top:50%;transform:translateY(-50%);width:100%}.van-picker-column__unit_text{color:var(--picker-option-unit-text-color,var(--app-B6-N4,rgba(0,0,0,.4)));font-size:var(--picker-option-unit-font-size,12px)}.van-picker-column__unit_hidden{opacity:0}.van-picker-column__max-text{font-weight:var(--font-weight-bold,500);opacity:0}

package/lib/radio/index.js

@@ -1,5 +1,9 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
+var Checkmark_1 = __importDefault(require("@tuya-miniapp/icons/dist/svg/Checkmark"));
 var version_1 = require("../common/version");
 var component_1 = require("../common/component");
 var relation_1 = require("../common/relation");
@@ -32,6 +36,7 @@ var relation_1 = require("../common/relation");
     data: {
         direction: '',
         parentDisabled: false,
+        icon: Checkmark_1.default,
     },
     methods: {
         updateFromParent: function () {

package/lib/radio/index.wxml

@@ -13,7 +13,8 @@
     <slot wx:if="{{ useIconSlot }}" name="icon" />
     <van-icon
       wx:else
-      name="success"
+      name="{{ icon }}"
+      color="{{ value ? '#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/lib/stepper/index.wxml

@@ -6,7 +6,7 @@
     wx:if="{{ showMinus }}"
     data-type="minus"
     style="{{ computed.buttonStyle({ buttonSize }) }}"
-    class="minus-class {{ utils.bem('stepper__minus', { disabled: disabled || disableMinus || currentValue <= min }) }}"
+    class="minus-class {{ utils.bem('stepper__minus', { disabled: disabled || disableMinus || currentValue <= +min }) }}"
     hover-class="van-stepper__minus--hover"
     hover-stay-time="70"
     bind:tap="onTap"
@@ -31,7 +31,7 @@
     wx:if="{{ showPlus }}"
     data-type="plus"
     style="{{ computed.buttonStyle({ buttonSize }) }}"
-    class="plus-class {{ utils.bem('stepper__plus', { disabled: disabled || disablePlus || currentValue >= max }) }}"
+    class="plus-class {{ utils.bem('stepper__plus', { disabled: disabled || disablePlus || currentValue >= +max }) }}"
     hover-class="van-stepper__plus--hover"
     hover-stay-time="70"
     bind:tap="onTap"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tuya-miniapp/smart-ui",
-  "version": "0.0.1-beta-3",
+  "version": "0.0.1-beta-5",
   "author": "MiniApp Team",
   "license": "MIT",
   "miniprogram": "lib",