@tuya-miniapp/smart-ui 2.6.4-beta-8 → 2.6.4-beta-9

package/dist/picker-column/index.wxss

@@ -1 +1 @@
-@import '../common/index.wxss';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-picker-column{color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bold,500);text-align:center}.smart-picker-column,.smart-picker-column__offset{position:relative;width:100%}.smart-picker-column__visual{position:absolute;top:0;width:100%}.smart-picker-column__item--selected{color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-weight:var(--picker-option-selected-font-weight-bold,var(--font-weight-bold,700))}.smart-picker-column__item--disabled{opacity:var(--picker-option-disabled-opacity,.3);pointer-events:none}.smart-picker-column__mask{background:transparent;display:flex;flex-direction:column;height:100%;position:absolute;top:0;width:100%;z-index:10}.smart-picker-column__mask__item{flex:1}.smart-picker-column__unit{align-items:center;display:flex;justify-content:center;position:absolute;top:50%;transform:translateY(-50%);width:100%}.smart-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);left:100%;margin-left:var(--picker-option-unit-mid-size,4px);position:absolute;text-align:left;top:50%;transform:translateY(-50%);white-space:nowrap}.smart-picker-column__max-text{color:transparent;font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bold,500);position:relative}.smart-picker-column--disabled{opacity:var(--picker-option-disabled-opacity,.3)}.smart-picker-column__item_0 .smart-picker-column__item__text:after{content:var(--picker-item-content_0,"")}.smart-picker-column__item_1 .smart-picker-column__item__text:after{content:var(--picker-item-content_1,"")}.smart-picker-column__item_2 .smart-picker-column__item__text:after{content:var(--picker-item-content_2,"")}.smart-picker-column__item_3 .smart-picker-column__item__text:after{content:var(--picker-item-content_3,"")}.smart-picker-column__item_4 .smart-picker-column__item__text:after{content:var(--picker-item-content_4,"")}.smart-picker-column__item_5 .smart-picker-column__item__text:after{content:var(--picker-item-content_5,"")}.smart-picker-column__item_6 .smart-picker-column__item__text:after{content:var(--picker-item-content_6,"")}.smart-picker-column__item_7 .smart-picker-column__item__text:after{content:var(--picker-item-content_7,"")}.smart-picker-column__item_8 .smart-picker-column__item__text:after{content:var(--picker-item-content_8,"")}.smart-picker-column__item_9 .smart-picker-column__item__text:after{content:var(--picker-item-content_9,"")}.smart-picker-column__item_10 .smart-picker-column__item__text:after{content:var(--picker-item-content_10,"")}.smart-picker-column__item_11 .smart-picker-column__item__text:after{content:var(--picker-item-content_11,"")}.smart-picker-column__item_12 .smart-picker-column__item__text:after{content:var(--picker-item-content_12,"")}.smart-picker-column__item_13 .smart-picker-column__item__text:after{content:var(--picker-item-content_13,"")}.smart-picker-column__item_14 .smart-picker-column__item__text:after{content:var(--picker-item-content_14,"")}.smart-picker-column__item_15 .smart-picker-column__item__text:after{content:var(--picker-item-content_15,"")}.smart-picker-column__item_16 .smart-picker-column__item__text:after{content:var(--picker-item-content_16,"")}.smart-picker-column__item_17 .smart-picker-column__item__text:after{content:var(--picker-item-content_17,"")}.smart-picker-column__item_18 .smart-picker-column__item__text:after{content:var(--picker-item-content_18,"")}.smart-picker-column__item_19 .smart-picker-column__item__text:after{content:var(--picker-item-content_19,"")}.smart-picker-column__item_20 .smart-picker-column__item__text:after{content:var(--picker-item-content_20,"")}
+@import '../common/index.wxss';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-picker-column{backface-visibility:hidden;-webkit-backface-visibility:hidden;color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bold,500);perspective:900px;position:relative;text-align:center;transform:translateZ(0);width:100%;will-change:transform}.smart-picker-column__offset{cursor:-webkit-grab;cursor:grab;height:100%;overflow:visible;position:relative;touch-action:none;transform:rotateX(-108deg);transform-origin:center center;transform-style:preserve-3d;width:100%}.smart-picker-column__visual{position:absolute;top:0;width:100%}.smart-picker-column__item{align-items:center;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;justify-content:center;left:50%;position:absolute;top:50%;transform-origin:center center;width:100%}.smart-picker-column__item--selected{color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-weight:var(--picker-option-selected-font-weight-bold,var(--font-weight-bold,700))}.smart-picker-column__item--disabled{opacity:var(--picker-option-disabled-opacity,.3);pointer-events:none}.smart-picker-column__mask{background:transparent;display:flex;flex-direction:column;height:100%;position:absolute;top:0;width:100%;z-index:10}.smart-picker-column__mask__item{flex:1}.smart-picker-column__unit{align-items:center;display:flex;justify-content:center;position:absolute;top:50%;transform:translateY(-50%);width:100%}.smart-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);left:100%;margin-left:var(--picker-option-unit-mid-size,4px);position:absolute;text-align:left;top:50%;transform:translateY(-50%);white-space:nowrap}.smart-picker-column__max-text{color:transparent;font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bold,500);position:relative}.smart-picker-column--disabled{opacity:var(--picker-option-disabled-opacity,.3);pointer-events:none}.smart-picker-column__item_0:after{content:var(--picker-item-content_0,"")}.smart-picker-column__item_1:after{content:var(--picker-item-content_1,"")}.smart-picker-column__item_2:after{content:var(--picker-item-content_2,"")}.smart-picker-column__item_3:after{content:var(--picker-item-content_3,"")}.smart-picker-column__item_4:after{content:var(--picker-item-content_4,"")}.smart-picker-column__item_5:after{content:var(--picker-item-content_5,"")}.smart-picker-column__item_6:after{content:var(--picker-item-content_6,"")}.smart-picker-column__item_7:after{content:var(--picker-item-content_7,"")}.smart-picker-column__item_8:after{content:var(--picker-item-content_8,"")}.smart-picker-column__item_9:after{content:var(--picker-item-content_9,"")}.smart-picker-column__item_10:after{content:var(--picker-item-content_10,"")}.smart-picker-column__item_11:after{content:var(--picker-item-content_11,"")}.smart-picker-column__item_12:after{content:var(--picker-item-content_12,"")}.smart-picker-column__item_13:after{content:var(--picker-item-content_13,"")}.smart-picker-column__item_14:after{content:var(--picker-item-content_14,"")}.smart-picker-column__item_15:after{content:var(--picker-item-content_15,"")}.smart-picker-column__item_16:after{content:var(--picker-item-content_16,"")}.smart-picker-column__item_17:after{content:var(--picker-item-content_17,"")}.smart-picker-column__item_18:after{content:var(--picker-item-content_18,"")}.smart-picker-column__item_19:after{content:var(--picker-item-content_19,"")}.smart-picker-column__item_20:after{content:var(--picker-item-content_20,"")}.smart-picker-column__item_21:after{content:var(--picker-item-content_21,"")}.smart-picker-column__item_22:after{content:var(--picker-item-content_22,"")}.smart-picker-column__item_23:after{content:var(--picker-item-content_23,"")}.smart-picker-column__item_24:after{content:var(--picker-item-content_24,"")}.smart-picker-column__item_25:after{content:var(--picker-item-content_25,"")}.smart-picker-column__item_26:after{content:var(--picker-item-content_26,"")}.smart-picker-column__item_27:after{content:var(--picker-item-content_27,"")}.smart-picker-column__item_28:after{content:var(--picker-item-content_28,"")}.smart-picker-column__item_29:after{content:var(--picker-item-content_29,"")}.smart-picker-column__item_30:after{content:var(--picker-item-content_30,"")}.smart-picker-column__item_31:after{content:var(--picker-item-content_31,"")}.smart-picker-column__item_32:after{content:var(--picker-item-content_32,"")}.smart-picker-column__item_33:after{content:var(--picker-item-content_33,"")}.smart-picker-column__item_34:after{content:var(--picker-item-content_34,"")}

package/dist/wxs/utils.wxs

@@ -3,8 +3,49 @@ var bem = require('./bem.wxs');
 var memoize = require('./memoize.wxs');
 var addUnit = require('./add-unit.wxs');
 
+function queryComponent (ownerInstance, selector) {
+  var instance = ownerInstance && ownerInstance.selectComponent(selector);
+  return instance;
+};
+
+function isObj(x) {
+  var type = typeof x;
+  return x !== null && (type === 'object' || type === 'function');
+}
+
+function range(num, min, max) {
+  return Math.min(Math.max(num, min), max);
+}
+
+// 创建指定长度并填充默认值的数组
+function createArray(length, defaultValue) {
+  var arr = [];
+  for (var i = 0; i < length; i++) {
+    arr[i] = defaultValue;
+  }
+  return arr;
+}
+
+// 填充数组的所有元素为指定值
+function fillArray(arr, value) {
+  for (var i = 0; i < arr.length; i++) {
+    arr[i] = value;
+  }
+  return arr;
+}
+
+function isArray(array) {
+  return array && typeof array === 'object' && typeof array.length === 'number';
+}
+
 module.exports = {
   bem: memoize(bem),
   memoize: memoize,
-  addUnit: addUnit
+  addUnit: addUnit,
+  queryComponent: queryComponent,
+  isObj: isObj,
+  range: range,
+  createArray: createArray,
+  fillArray: fillArray,
+  isArray: isArray
 };

package/lib/common/utils.d.ts

@@ -22,4 +22,3 @@ export declare function replacePlaceholders(template: any, values: any): any;
 export declare const getSafeAreaInsetMin: () => number;
 export declare function getSafeBottomOffset(): number;
 export declare const getDateString: (date: Date) => string | undefined;
-export declare function generateRangeArray(start: number, end: number): number[];

package/lib/common/utils.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.generateRangeArray = exports.getDateString = exports.getSafeBottomOffset = exports.getSafeAreaInsetMin = exports.replacePlaceholders = exports.isWxWork = exports.isPC = exports.getCurrentPage = exports.clamp = exports.addNumber = exports.toPromise = exports.groupSetData = exports.getAllRect = exports.getRect = exports.pickExclude = exports.requestAnimationFrame = exports.addUnit = exports.nextTick = exports.range = exports.getSystemInfoSync = exports.isDef = void 0;
+exports.getDateString = exports.getSafeBottomOffset = exports.getSafeAreaInsetMin = exports.replacePlaceholders = exports.isWxWork = exports.isPC = exports.getCurrentPage = exports.clamp = exports.addNumber = exports.toPromise = exports.groupSetData = exports.getAllRect = exports.getRect = exports.pickExclude = exports.requestAnimationFrame = exports.addUnit = exports.nextTick = exports.range = exports.getSystemInfoSync = exports.isDef = void 0;
 var validator_1 = require("./validator");
 var version_1 = require("./version");
 var validator_2 = require("./validator");
@@ -138,11 +138,3 @@ var getDateString = function (date) {
     return formattedDate;
 };
 exports.getDateString = getDateString;
-function generateRangeArray(start, end) {
-    var resultArray = [];
-    for (var i = start; i < end; i++) {
-        resultArray.push(i);
-    }
-    return resultArray;
-}
-exports.generateRangeArray = generateRangeArray;

package/lib/datetime-picker/index.js

@@ -231,7 +231,8 @@ var defaultFormatter = function (type, value) {
                     unit: locale === null || locale === void 0 ? void 0 : locale[column.type],
                     style: columnStyles === null || columnStyles === void 0 ? void 0 : columnStyles[column.type],
                     fontStyle: fontStyles === null || fontStyles === void 0 ? void 0 : fontStyles[column.type],
-                    activeIndex: activeIndex,
+                    activeIndex: activeIndex === -1 ? 0 : activeIndex,
+                    loop: !['12HourClock', 'year'].includes(column.type),
                 };
             });
             return this.setData({ columns: results });
@@ -426,8 +427,7 @@ var defaultFormatter = function (type, value) {
             }
             else {
                 var originColumns_2 = this.getOriginColumns();
-                var indexes_1 = picker.getIndexes();
-                var values = indexes_1.map(function (value, index) { return originColumns_2[index].values[value]; });
+                var values = indexes.map(function (value, index) { return originColumns_2[index].values[value]; });
                 var year = getTrueValue(values[0]);
                 var month = getTrueValue(values[1]);
                 var maxDate = getMonthEndDay(year, month);

package/lib/image/index.js

@@ -41,7 +41,7 @@ var Loading_1 = __importDefault(require("@tuya-miniapp/icons/dist/svg/Loading"))
         },
         showLoading: {
             type: Boolean,
-            value: true,
+            value: false,
         },
         tintColor: {
             type: String,

package/lib/picker/index.css

@@ -1 +1 @@
-@import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-picker{-webkit-text-size-adjust:100%;background-color:var(--picker-background-color,var(--app-B4,#fff));overflow:hidden;position:relative;-webkit-user-select:none;user-select:none}.smart-picker__toolbar{display:flex;height:var(--picker-toolbar-height,44px);justify-content:space-between;line-height:var(--picker-toolbar-height,44px)}.smart-picker__cancel,.smart-picker__confirm{font-size:var(--picker-action-font-size,14px);padding:var(--picker-action-padding,0 16px)}.smart-picker__cancel--hover,.smart-picker__confirm--hover{opacity:.7}.smart-picker__confirm{color:var(--picker-confirm-action-color,#576b95)}.smart-picker__cancel{color:var(--picker-cancel-action-color,#969799)}.smart-picker__title{font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bolder,700);max-width:50%;text-align:center}.smart-picker__columns{display:flex;justify-content:center;-webkit-mask-image:linear-gradient(0deg,transparent,#000 50%,transparent);mask-image:linear-gradient(0deg,transparent,#000 50%,transparent);-webkit-mask-position:top,bottom;mask-position:top,bottom;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;overflow:hidden;padding:0 var(--picker-padding,16px);position:relative}.smart-picker__column{flex:1 1;width:0}.smart-picker__loading{align-items:center;background-color:var(--picker-loading-mask-color,var(--app-B4,#fff));bottom:0;display:flex;justify-content:center;left:0;opacity:.9;position:absolute;right:0;top:0;z-index:4}.smart-picker__frame{left:var(--picker-padding,16px);pointer-events:none;position:absolute;right:var(--picker-padding,16px);top:50%;transform:translateY(-50%);z-index:1}
+@import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-picker{-webkit-text-size-adjust:100%;background-color:var(--picker-background-color,var(--app-B4,#fff));overflow:hidden;position:relative;-webkit-user-select:none;user-select:none}.smart-picker__toolbar{display:flex;height:var(--picker-toolbar-height,44px);justify-content:space-between;line-height:var(--picker-toolbar-height,44px)}.smart-picker__cancel,.smart-picker__confirm{font-size:var(--picker-action-font-size,14px);padding:var(--picker-action-padding,0 16px)}.smart-picker__cancel--hover,.smart-picker__confirm--hover{opacity:.7}.smart-picker__confirm{color:var(--picker-confirm-action-color,#576b95)}.smart-picker__cancel{color:var(--picker-cancel-action-color,#969799)}.smart-picker__title{font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bolder,700);max-width:50%;text-align:center}.smart-picker__columns{align-items:center;display:flex;justify-content:center;-webkit-mask-image:linear-gradient(0deg,transparent,#000 50%,transparent);mask-image:linear-gradient(0deg,transparent,#000 50%,transparent);-webkit-mask-position:top,bottom;mask-position:top,bottom;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;overflow:hidden;padding:0 var(--picker-padding,16px);position:relative}.smart-picker__column{flex:1 1;width:0}.smart-picker__loading{align-items:center;background-color:var(--picker-loading-mask-color,var(--app-B4,#fff));bottom:0;display:flex;justify-content:center;left:0;opacity:.9;position:absolute;right:0;top:0;z-index:4}.smart-picker__frame{left:var(--picker-padding,16px);pointer-events:none;position:absolute;right:var(--picker-padding,16px);top:50%;transform:translateY(-50%);z-index:1}

package/lib/picker/index.js

@@ -21,12 +21,14 @@ var shared_1 = require("./shared");
         }, toolbarPosition: {
             type: String,
             value: 'top',
+        }, fullHeight: {
+            type: Boolean,
+            value: false,
         }, defaultIndex: {
             type: Number,
             value: 0,
         }, activeIndex: {
-            type: Number,
-            value: -1,
+            type: null,
         }, unit: {
             type: String,
             value: '',
@@ -50,6 +52,11 @@ var shared_1 = require("./shared");
             get: function () { return _this.selectAllComponents('.smart-picker__column') || []; },
         });
     },
+    mounted: function () {
+        if (![3, 5, 7, 9].includes(this.data.visibleItemCount)) {
+            console.error('visibleItemCount 的值必须为 3, 5, 7, 9');
+        }
+    },
     methods: {
         noop: function () { },
         setColumns: function () {
@@ -111,7 +118,7 @@ var shared_1 = require("./shared");
         },
         // get column option index by column index
         getColumnIndex: function (columnIndex) {
-            return (this.getColumn(columnIndex) || {}).data.currentIndex;
+            return (this.getColumn(columnIndex) || {}).data.activeIndex;
         },
         // set column option index by column index
         setColumnIndex: function (columnIndex, optionIndex) {
@@ -154,7 +161,9 @@ var shared_1 = require("./shared");
         },
         // get indexes of all columns
         getIndexes: function () {
-            return this.children.map(function (child) { return child.data.currentIndex; });
+            return this.children.map(function (child) {
+                return child.data.activeIndex === null ? child.data.defaultIndex : child.data.activeIndex;
+            });
         },
         // set indexes of all columns
         setIndexes: function (indexes) {

package/lib/picker/index.wxml

@@ -9,7 +9,7 @@
 
   <view
     class="smart-picker__columns"
-    style="{{ computed.columnsStyle({ itemHeight, visibleItemCount }) }}"
+    style="{{ computed.columnsStyle({ itemHeight, visibleItemCount, fullHeight }) }}"
     catch:touchmove="noop"
   >
     <picker-column
@@ -22,14 +22,15 @@
       value-key="{{ valueKey }}"
       style="order: {{ item.order }}; {{ computed.style(item.style) }}"
       active-style="{{ activeStyle }}"
-      font-style="{{computed.style(item.fontStyle)}}"
+      font-style="{{fontStyle ? fontStyle + ';' + computed.style(item.fontStyle): computed.style(item.fontStyle)}}"
       options="{{ item.values }}"
       disabled="{{ item.disabled || false }}"
       unit="{{ item.unit || unit }}"
       changeAnimation="{{ changeAnimation }}"
       default-index="{{ item.defaultIndex || defaultIndex }}"
-      active-index="{{ item.activeIndex || activeIndex }}"
+      active-index="{{ item.activeIndex === null ? activeIndex : item.activeIndex }}"
       item-height="{{ itemHeight }}"
+      loop="{{ loop || item.loop || false }}"
       visible-item-count="{{ visibleItemCount }}"
       active-class="active-class"
       bind:change="onChange"

package/lib/picker/index.wxs

@@ -5,7 +5,7 @@ var array = require('../wxs/array.wxs');
 
 function columnsStyle(data) {
   return style({
-    height: addUnit(data.itemHeight * data.visibleItemCount),
+    height: addUnit(data.itemHeight * data.visibleItemCount * (data.fullHeight ? 1 : 0.9)),
   });
 }
 

package/lib/picker/index.wxss

@@ -1 +1 @@
-@import '../common/index.wxss';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-picker{-webkit-text-size-adjust:100%;background-color:var(--picker-background-color,var(--app-B4,#fff));overflow:hidden;position:relative;-webkit-user-select:none;user-select:none}.smart-picker__toolbar{display:flex;height:var(--picker-toolbar-height,44px);justify-content:space-between;line-height:var(--picker-toolbar-height,44px)}.smart-picker__cancel,.smart-picker__confirm{font-size:var(--picker-action-font-size,14px);padding:var(--picker-action-padding,0 16px)}.smart-picker__cancel--hover,.smart-picker__confirm--hover{opacity:.7}.smart-picker__confirm{color:var(--picker-confirm-action-color,#576b95)}.smart-picker__cancel{color:var(--picker-cancel-action-color,#969799)}.smart-picker__title{font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bolder,700);max-width:50%;text-align:center}.smart-picker__columns{display:flex;justify-content:center;-webkit-mask-image:linear-gradient(0deg,transparent,#000 50%,transparent);mask-image:linear-gradient(0deg,transparent,#000 50%,transparent);-webkit-mask-position:top,bottom;mask-position:top,bottom;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;overflow:hidden;padding:0 var(--picker-padding,16px);position:relative}.smart-picker__column{flex:1 1;width:0}.smart-picker__loading{align-items:center;background-color:var(--picker-loading-mask-color,var(--app-B4,#fff));bottom:0;display:flex;justify-content:center;left:0;opacity:.9;position:absolute;right:0;top:0;z-index:4}.smart-picker__frame{left:var(--picker-padding,16px);pointer-events:none;position:absolute;right:var(--picker-padding,16px);top:50%;transform:translateY(-50%);z-index:1}
+@import '../common/index.wxss';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-picker{-webkit-text-size-adjust:100%;background-color:var(--picker-background-color,var(--app-B4,#fff));overflow:hidden;position:relative;-webkit-user-select:none;user-select:none}.smart-picker__toolbar{display:flex;height:var(--picker-toolbar-height,44px);justify-content:space-between;line-height:var(--picker-toolbar-height,44px)}.smart-picker__cancel,.smart-picker__confirm{font-size:var(--picker-action-font-size,14px);padding:var(--picker-action-padding,0 16px)}.smart-picker__cancel--hover,.smart-picker__confirm--hover{opacity:.7}.smart-picker__confirm{color:var(--picker-confirm-action-color,#576b95)}.smart-picker__cancel{color:var(--picker-cancel-action-color,#969799)}.smart-picker__title{font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bolder,700);max-width:50%;text-align:center}.smart-picker__columns{align-items:center;display:flex;justify-content:center;-webkit-mask-image:linear-gradient(0deg,transparent,#000 50%,transparent);mask-image:linear-gradient(0deg,transparent,#000 50%,transparent);-webkit-mask-position:top,bottom;mask-position:top,bottom;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;overflow:hidden;padding:0 var(--picker-padding,16px);position:relative}.smart-picker__column{flex:1 1;width:0}.smart-picker__loading{align-items:center;background-color:var(--picker-loading-mask-color,var(--app-B4,#fff));bottom:0;display:flex;justify-content:center;left:0;opacity:.9;position:absolute;right:0;top:0;z-index:4}.smart-picker__frame{left:var(--picker-padding,16px);pointer-events:none;position:absolute;right:var(--picker-padding,16px);top:50%;transform:translateY(-50%);z-index:1}

package/lib/picker/shared.d.ts

@@ -10,6 +10,9 @@ export declare const pickerProps: {
         type: StringConstructor;
         value: string;
     };
+    /**
+     * 可见的选项个数 3 5 7 9
+     */
     visibleItemCount: {
         type: NumberConstructor;
         value: number;
@@ -30,4 +33,12 @@ export declare const pickerProps: {
         type: StringConstructor;
         value: string;
     };
+    fontStyle: {
+        type: StringConstructor;
+        value: string;
+    };
+    loop: {
+        type: BooleanConstructor;
+        value: boolean;
+    };
 };

package/lib/picker/shared.js

@@ -13,6 +13,9 @@ exports.pickerProps = {
         type: String,
         value: 'Confirm',
     },
+    /**
+     * 可见的选项个数 3 5 7 9
+     */
     visibleItemCount: {
         type: Number,
         value: 5,
@@ -33,4 +36,12 @@ exports.pickerProps = {
         type: String,
         value: '',
     },
+    fontStyle: {
+        type: String,
+        value: '',
+    },
+    loop: {
+        type: Boolean,
+        value: false,
+    },
 };

package/lib/picker-column/index.css

@@ -1 +1 @@
-@import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-picker-column{color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bold,500);text-align:center}.smart-picker-column,.smart-picker-column__offset{position:relative;width:100%}.smart-picker-column__visual{position:absolute;top:0;width:100%}.smart-picker-column__item--selected{color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-weight:var(--picker-option-selected-font-weight-bold,var(--font-weight-bold,700))}.smart-picker-column__item--disabled{opacity:var(--picker-option-disabled-opacity,.3);pointer-events:none}.smart-picker-column__mask{background:transparent;display:flex;flex-direction:column;height:100%;position:absolute;top:0;width:100%;z-index:10}.smart-picker-column__mask__item{flex:1}.smart-picker-column__unit{align-items:center;display:flex;justify-content:center;position:absolute;top:50%;transform:translateY(-50%);width:100%}.smart-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);left:100%;margin-left:var(--picker-option-unit-mid-size,4px);position:absolute;text-align:left;top:50%;transform:translateY(-50%);white-space:nowrap}.smart-picker-column__max-text{color:transparent;font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bold,500);position:relative}.smart-picker-column--disabled{opacity:var(--picker-option-disabled-opacity,.3)}.smart-picker-column__item_0 .smart-picker-column__item__text:after{content:var(--picker-item-content_0,"")}.smart-picker-column__item_1 .smart-picker-column__item__text:after{content:var(--picker-item-content_1,"")}.smart-picker-column__item_2 .smart-picker-column__item__text:after{content:var(--picker-item-content_2,"")}.smart-picker-column__item_3 .smart-picker-column__item__text:after{content:var(--picker-item-content_3,"")}.smart-picker-column__item_4 .smart-picker-column__item__text:after{content:var(--picker-item-content_4,"")}.smart-picker-column__item_5 .smart-picker-column__item__text:after{content:var(--picker-item-content_5,"")}.smart-picker-column__item_6 .smart-picker-column__item__text:after{content:var(--picker-item-content_6,"")}.smart-picker-column__item_7 .smart-picker-column__item__text:after{content:var(--picker-item-content_7,"")}.smart-picker-column__item_8 .smart-picker-column__item__text:after{content:var(--picker-item-content_8,"")}.smart-picker-column__item_9 .smart-picker-column__item__text:after{content:var(--picker-item-content_9,"")}.smart-picker-column__item_10 .smart-picker-column__item__text:after{content:var(--picker-item-content_10,"")}.smart-picker-column__item_11 .smart-picker-column__item__text:after{content:var(--picker-item-content_11,"")}.smart-picker-column__item_12 .smart-picker-column__item__text:after{content:var(--picker-item-content_12,"")}.smart-picker-column__item_13 .smart-picker-column__item__text:after{content:var(--picker-item-content_13,"")}.smart-picker-column__item_14 .smart-picker-column__item__text:after{content:var(--picker-item-content_14,"")}.smart-picker-column__item_15 .smart-picker-column__item__text:after{content:var(--picker-item-content_15,"")}.smart-picker-column__item_16 .smart-picker-column__item__text:after{content:var(--picker-item-content_16,"")}.smart-picker-column__item_17 .smart-picker-column__item__text:after{content:var(--picker-item-content_17,"")}.smart-picker-column__item_18 .smart-picker-column__item__text:after{content:var(--picker-item-content_18,"")}.smart-picker-column__item_19 .smart-picker-column__item__text:after{content:var(--picker-item-content_19,"")}.smart-picker-column__item_20 .smart-picker-column__item__text:after{content:var(--picker-item-content_20,"")}
+@import '../common/index.css';:root{--smart-ui-overlay:rgba(0,0,0,.4);--smart-ui-dialog-background:#fff;--smart-ui-border-image:linear-gradient(90deg,transparent,rgba(0,0,0,.3),transparent)}:root[theme=dark]{--smart-ui-overlay:rgba(0,0,0,.7);--smart-ui-dialog-background:#333;--smart-ui-border-image:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.3),hsla(0,0%,100%,0))}.smart-picker-column{backface-visibility:hidden;-webkit-backface-visibility:hidden;color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bold,500);perspective:900px;position:relative;text-align:center;transform:translateZ(0);width:100%;will-change:transform}.smart-picker-column__offset{cursor:-webkit-grab;cursor:grab;height:100%;overflow:visible;position:relative;touch-action:none;transform:rotateX(-108deg);transform-origin:center center;transform-style:preserve-3d;width:100%}.smart-picker-column__visual{position:absolute;top:0;width:100%}.smart-picker-column__item{align-items:center;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;justify-content:center;left:50%;position:absolute;top:50%;transform-origin:center center;width:100%}.smart-picker-column__item--selected{color:var(--picker-option-selected-text-color,var(--app-B6-N1,#000));font-weight:var(--picker-option-selected-font-weight-bold,var(--font-weight-bold,700))}.smart-picker-column__item--disabled{opacity:var(--picker-option-disabled-opacity,.3);pointer-events:none}.smart-picker-column__mask{background:transparent;display:flex;flex-direction:column;height:100%;position:absolute;top:0;width:100%;z-index:10}.smart-picker-column__mask__item{flex:1}.smart-picker-column__unit{align-items:center;display:flex;justify-content:center;position:absolute;top:50%;transform:translateY(-50%);width:100%}.smart-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);left:100%;margin-left:var(--picker-option-unit-mid-size,4px);position:absolute;text-align:left;top:50%;transform:translateY(-50%);white-space:nowrap}.smart-picker-column__max-text{color:transparent;font-size:var(--picker-option-font-size,16px);font-weight:var(--font-weight-bold,500);position:relative}.smart-picker-column--disabled{opacity:var(--picker-option-disabled-opacity,.3);pointer-events:none}.smart-picker-column__item_0:after{content:var(--picker-item-content_0,"")}.smart-picker-column__item_1:after{content:var(--picker-item-content_1,"")}.smart-picker-column__item_2:after{content:var(--picker-item-content_2,"")}.smart-picker-column__item_3:after{content:var(--picker-item-content_3,"")}.smart-picker-column__item_4:after{content:var(--picker-item-content_4,"")}.smart-picker-column__item_5:after{content:var(--picker-item-content_5,"")}.smart-picker-column__item_6:after{content:var(--picker-item-content_6,"")}.smart-picker-column__item_7:after{content:var(--picker-item-content_7,"")}.smart-picker-column__item_8:after{content:var(--picker-item-content_8,"")}.smart-picker-column__item_9:after{content:var(--picker-item-content_9,"")}.smart-picker-column__item_10:after{content:var(--picker-item-content_10,"")}.smart-picker-column__item_11:after{content:var(--picker-item-content_11,"")}.smart-picker-column__item_12:after{content:var(--picker-item-content_12,"")}.smart-picker-column__item_13:after{content:var(--picker-item-content_13,"")}.smart-picker-column__item_14:after{content:var(--picker-item-content_14,"")}.smart-picker-column__item_15:after{content:var(--picker-item-content_15,"")}.smart-picker-column__item_16:after{content:var(--picker-item-content_16,"")}.smart-picker-column__item_17:after{content:var(--picker-item-content_17,"")}.smart-picker-column__item_18:after{content:var(--picker-item-content_18,"")}.smart-picker-column__item_19:after{content:var(--picker-item-content_19,"")}.smart-picker-column__item_20:after{content:var(--picker-item-content_20,"")}.smart-picker-column__item_21:after{content:var(--picker-item-content_21,"")}.smart-picker-column__item_22:after{content:var(--picker-item-content_22,"")}.smart-picker-column__item_23:after{content:var(--picker-item-content_23,"")}.smart-picker-column__item_24:after{content:var(--picker-item-content_24,"")}.smart-picker-column__item_25:after{content:var(--picker-item-content_25,"")}.smart-picker-column__item_26:after{content:var(--picker-item-content_26,"")}.smart-picker-column__item_27:after{content:var(--picker-item-content_27,"")}.smart-picker-column__item_28:after{content:var(--picker-item-content_28,"")}.smart-picker-column__item_29:after{content:var(--picker-item-content_29,"")}.smart-picker-column__item_30:after{content:var(--picker-item-content_30,"")}.smart-picker-column__item_31:after{content:var(--picker-item-content_31,"")}.smart-picker-column__item_32:after{content:var(--picker-item-content_32,"")}.smart-picker-column__item_33:after{content:var(--picker-item-content_33,"")}.smart-picker-column__item_34:after{content:var(--picker-item-content_34,"")}