@nutui/nutui-react-taro 3.0.1 → 3.0.2

package/dist/es/packages/picker/style/style.css

@@ -383,6 +383,76 @@
   right: 0;
 }
 
+.nut-pickerview {
+  --nutui-picker-item-height: 36px;
+  position: relative;
+  display: flex;
+  width: 100%;
+  height: calc(var(--nutui-picker-item-height, 36px) * 7);
+  overflow: hidden;
+}
+.nut-pickerview-mask, .nut-pickerview-indicator {
+  position: absolute;
+  left: 0;
+  right: 0;
+  z-index: 3;
+  pointer-events: none;
+}
+.nut-pickerview-mask {
+  top: 0;
+  bottom: 0;
+  background-image: var(--picker-mask-background, linear-gradient(180deg, var(--nutui-white-12), var(--nutui-white-7)), linear-gradient(0deg, var(--nutui-white-12), var(--nutui-white-7)));
+  background-position: top, bottom;
+  background-size: 100% calc((var(--nutui-picker-item-height, 36px) * 7 - var(--nutui-picker-item-height, 36px)) / 2);
+  background-repeat: no-repeat;
+  transform: translateZ(0);
+}
+.nut-pickerview-indicator {
+  top: calc((var(--nutui-picker-item-height, 36px) * 7 - var(--nutui-picker-item-height, 36px)) / 2);
+  height: var(--nutui-picker-item-height, 36px);
+  border: var(--nutui-picker-item-active-line-border, 1px solid var(--nutui-color-border, rgba(0, 0, 0, 0.06)));
+  border-left: 0;
+  border-right: 0;
+  box-sizing: border-box;
+}
+.nut-pickerview-list {
+  position: relative;
+  flex: 1;
+  height: calc(var(--nutui-picker-item-height, 36px) * 7);
+  overflow: hidden;
+  touch-action: none;
+}
+.nut-pickerview-roller {
+  position: absolute;
+  top: calc((var(--nutui-picker-item-height, 36px) * 7 - var(--nutui-picker-item-height, 36px)) / 2);
+  width: 100%;
+  height: var(--nutui-picker-item-height, 36px);
+  z-index: 1;
+  transform-style: preserve-3d;
+}
+.nut-pickerview-roller-item {
+  position: absolute;
+  top: 0;
+  backface-visibility: hidden;
+  -moz-backface-visibility: hidden;
+  -webkit-backface-visibility: hidden;
+}
+.nut-pickerview-roller-item-hidden {
+  visibility: hidden;
+  opacity: 0;
+}
+.nut-pickerview-roller-item, .nut-pickerview-roller-item-tiled {
+  width: 100%;
+  height: var(--nutui-picker-item-height, 36px);
+  line-height: var(--nutui-picker-item-height, 36px);
+  color: var(--nutui-picker-item-text-color, var(--nutui-color-title, #1a1a1a));
+  font-size: var(--nutui-picker-item-text-font-size, var(--nutui-font-size-base, 14px));
+  text-align: center;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
 .nut-picker {
   background-color: var(--nutui-color-background-overlay, #ffffff);
   width: 100%;

package/dist/es/packages/signature/signature.js

@@ -4,7 +4,7 @@ import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_
 import { _ as _sliced_to_array } from "@swc/helpers/_/_sliced_to_array";
 import React, { useEffect, useImperativeHandle, useRef, useState } from "react";
 import { getEnv, nextTick, createSelectorQuery, canvasToTempFilePath } from "@tarojs/taro";
-import { View } from "@tarojs/components";
+import { Canvas, View } from "@tarojs/components";
 import { ComponentDefaults } from "../../utils/typings";
 var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
     canvasId: 'spcanvas',
@@ -153,7 +153,7 @@ var InternalSignature = function(props, ref) {
         onTouchStart: startEventHandler,
         onTouchMove: moveEventHandler,
         onTouchEnd: endEventHandler
-    }) : /*#__PURE__*/ React.createElement("canvas", {
+    }) : /*#__PURE__*/ React.createElement(Canvas, {
         id: canvasId,
         ref: canvasRef,
         "canvas-id": canvasId,

package/dist/es/packages/swipe/style/style.css

@@ -22,12 +22,12 @@
 .nut-swipe-left, .nut-swipe-right {
   position: absolute;
   top: 0;
-  display: flex;
-  flex-direction: row;
 }
 .nut-swipe-left {
   left: 0;
+  transform: translate(-100%, 0px);
 }
 .nut-swipe-right {
-  left: 100%;
+  right: 0px;
+  transform: translate(100%, 0px);
 }

package/dist/es/packages/swipe/style/style.harmony.css

@@ -22,12 +22,12 @@
 .nut-swipe-left, .nut-swipe-right {
   position: absolute;
   top: 0;
-  display: flex;
-  flex-direction: row;
 }
 .nut-swipe-left {
   left: 0;
+  transform: translate(-100%, 0px);
 }
 .nut-swipe-right {
-  left: 100%;
+  right: 0px;
+  transform: translate(100%, 0px);
 }

package/dist/es/packages/swipe/style/swipe.scss

@@ -20,15 +20,19 @@
   &-right {
     position: absolute;
     top: 0;
-    display: flex;
-    flex-direction: row;
+    //display: flex;
+    //flex-direction: row;
+    //flex-shrink: 0;
   }
 
   &-left {
     left: 0;
+    transform: translate(-100%, 0px);
   }
 
   &-right {
-    left: 100%;
+    //left: 100%;
+    right: 0px;
+    transform: translate(100%, 0px);
   }
 }

package/dist/es/packages/swipe/swipe.js

@@ -6,12 +6,13 @@ import { _ as _ts_generator } from "@swc/helpers/_/_ts_generator";
 import React, { forwardRef, useEffect, useImperativeHandle, useRef, useState } from "react";
 import classNames from "classnames";
 import { View } from "@tarojs/components";
+import { useReady } from "@tarojs/taro";
 import { useTouch } from "../../hooks/use-touch";
 import { getRectByTaro } from "../../utils/get-rect-by-taro";
 import { ComponentDefaults } from "../../utils/typings";
 import { harmony } from "../../utils/platform-taro";
-import pxTransform from "../../utils/px-transform";
 import { useRefState } from "../../hooks/use-ref-state";
+import useUuid from "../../hooks/use-uuid";
 function preventDefault(event, isStopPropagation) {
     if (typeof event.cancelable !== 'boolean' || event.cancelable) {
         event.preventDefault();
@@ -26,8 +27,11 @@ var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
 export var Swipe = /*#__PURE__*/ forwardRef(function(props, instanceRef) {
     var classPrefix = 'nut-swipe';
     var touch = useTouch();
+    var uid = useUuid();
+    var leftId = "swipe-left-".concat(uid);
+    var rightId = "swipe-right-".concat(uid);
     // 获取元素的时候要在页面 onReady 后，需要参考小程序的事件周期
-    useEffect(function() {
+    useReady(function() {
         var getWidth = /*#__PURE__*/ function() {
             var _ref = _async_to_generator(function() {
                 var leftRect, rightRect;
@@ -40,7 +44,7 @@ export var Swipe = /*#__PURE__*/ forwardRef(function(props, instanceRef) {
                             ];
                             return [
                                 4,
-                                getRectByTaro(leftWrapper.current)
+                                getRectByTaro(leftWrapper.current, leftId)
                             ];
                         case 1:
                             leftRect = _state.sent();
@@ -57,11 +61,10 @@ export var Swipe = /*#__PURE__*/ forwardRef(function(props, instanceRef) {
                             ];
                             return [
                                 4,
-                                getRectByTaro(rightWrapper.current)
+                                getRectByTaro(rightWrapper.current, rightId)
                             ];
                         case 3:
                             rightRect = _state.sent();
-                            console.log('actionWidth.current.left', rightRect.width);
                             rightRect && setActionWidth(function(v) {
                                 return _object_spread_props(_object_spread({}, v), {
                                     right: rightRect.width
@@ -82,7 +85,7 @@ export var Swipe = /*#__PURE__*/ forwardRef(function(props, instanceRef) {
         setTimeout(function() {
             return getWidth();
         });
-    }, []);
+    });
     var _$_object_spread = _object_spread({}, defaultProps, props), children = _$_object_spread.children, className = _$_object_spread.className, style = _$_object_spread.style;
     var root = useRef();
     var opened = useRef(false);
@@ -110,7 +113,7 @@ export var Swipe = /*#__PURE__*/ forwardRef(function(props, instanceRef) {
         }
     };
     var wrapperStyle = {
-        transform: "translate(".concat(state.offset, "px, 0)"),
+        transform: "translate(".concat(state.offset).concat(!harmony() ? 'px' : '', ", 0)"),
         transitionDuration: state.dragging ? '0s' : '.6s'
     };
     var onTouchStart = /*#__PURE__*/ function() {
@@ -119,14 +122,13 @@ export var Swipe = /*#__PURE__*/ forwardRef(function(props, instanceRef) {
             return _ts_generator(this, function(_state) {
                 switch(_state.label){
                     case 0:
-                        console.log('ontouchstart');
                         if (!leftWrapper.current) return [
                             3,
                             2
                         ];
                         return [
                             4,
-                            getRectByTaro(leftWrapper.current)
+                            getRectByTaro(leftWrapper.current, leftId)
                         ];
                     case 1:
                         leftRect = _state.sent();
@@ -143,7 +145,7 @@ export var Swipe = /*#__PURE__*/ forwardRef(function(props, instanceRef) {
                         ];
                         return [
                             4,
-                            getRectByTaro(rightWrapper.current)
+                            getRectByTaro(rightWrapper.current, rightId)
                         ];
                     case 3:
                         rightRect = _state.sent();
@@ -186,7 +188,7 @@ export var Swipe = /*#__PURE__*/ forwardRef(function(props, instanceRef) {
             if (isEdge) {
                 preventDefault(event, true);
             }
-            newState.offset = rangeCalculation((harmony() ? parseFloat(pxTransform(touch.deltaX.current)) : touch.deltaX.current) + startOffset.current, -actionWidth.current.right || 0, actionWidth.current.left || 0);
+            newState.offset = rangeCalculation(touch.deltaX.current + startOffset.current, -actionWidth.current.right || 0, actionWidth.current.left || 0);
             setState(newState);
         }
     };
@@ -253,13 +255,10 @@ export var Swipe = /*#__PURE__*/ forwardRef(function(props, instanceRef) {
     var rightWrapper = useRef(null);
     var renderActionContent = function(side) {
         if (props["".concat(side, "Action")]) {
-            console.log('actionWidth xxx', actionWidth.current.left);
             return /*#__PURE__*/ React.createElement(View, {
                 ref: side === 'left' ? leftWrapper : rightWrapper,
                 className: "".concat(classPrefix, "-").concat(side),
-                style: _object_spread({}, side === 'left' ? {
-                    left: Number("".concat(-actionWidth.current.left))
-                } : {}),
+                id: side === 'left' ? leftId : rightId,
                 onClick: function(e) {
                     return handleOperate(e, side);
                 }

package/dist/es/utils/get-rect-by-taro.d.ts

@@ -9,4 +9,4 @@ export interface Rect {
     height: number;
 }
 export declare function makeRect(width: number, height: number): Rect;
-export declare const getRectByTaro: (element: any) => Promise<Rect>;
+export declare const getRectByTaro: (element: any, harmonyId?: string) => Promise<Rect>;

package/dist/es/utils/get-rect-by-taro.js

@@ -15,7 +15,10 @@ export function makeRect(width, height) {
 }
 export var getRectByTaro = /*#__PURE__*/ function() {
     var _ref = _async_to_generator(function(element) {
+        var harmonyId;
+        var _arguments = arguments;
         return _ts_generator(this, function(_state) {
+            harmonyId = _arguments.length > 1 && _arguments[1] !== void 0 ? _arguments[1] : '';
             if (element) {
                 if (inBrowser) {
                     return [
@@ -27,7 +30,7 @@ export var getRectByTaro = /*#__PURE__*/ function() {
                 return [
                     2,
                     new Promise(function(resolve, reject) {
-                        createSelectorQuery().select("#".concat(element.uid)).boundingClientRect().exec(function(param) {
+                        createSelectorQuery().select("#".concat(harmonyId || element.uid)).boundingClientRect().exec(function(param) {
                             var _param = _sliced_to_array(param, 1), rects = _param[0];
                             resolve(rects);
                         });

package/dist/es/utils/get-system-info.js

@@ -1,19 +1,19 @@
-import Taro from "@tarojs/taro";
+import { canIUse, getAppBaseInfo as taroGetAppBaseInfo, getDeviceInfo as taroGetDeviceInfo, getSystemInfoSync, getWindowInfo as taroGetWindowInfo } from "@tarojs/taro";
 /**
  * 获取设备基础信息，兼容新旧 API
  * @returns {IDeviceInfo} 设备基础信息
  */ export var getDeviceInfo = function() {
-    return Taro.canIUse('getDeviceInfo') ? Taro.getDeviceInfo() : Taro.getSystemInfoSync();
+    return canIUse('getDeviceInfo') ? taroGetDeviceInfo() : getSystemInfoSync();
 };
 /**
  * 获取窗口信息，兼容新旧 API
  * @returns {Taro.getWindowInfo.Result} 窗口信息
  */ export var getWindowInfo = function() {
-    return Taro.canIUse('getWindowInfo') ? Taro.getWindowInfo() : Taro.getSystemInfoSync();
+    return canIUse('getWindowInfo') ? taroGetWindowInfo() : getSystemInfoSync();
 };
 /**
  * 获取应用基础信息，兼容新旧 API
  * @returns {Taro.getAppBaseInfo.Result} 应用基础信息
  */ export var getAppBaseInfo = function() {
-    return Taro.canIUse('getAppBaseInfo') ? Taro.getAppBaseInfo() : Taro.getSystemInfoSync();
+    return canIUse('getAppBaseInfo') ? taroGetAppBaseInfo() : getSystemInfoSync();
 };

package/dist/es/utils/merge.d.ts

@@ -0,0 +1,14 @@
+export default main;
+export declare function main(clone: boolean, ...items: any[]): any;
+export declare function main(...items: any[]): any;
+export declare namespace main {
+    var clone: typeof import("./merge").clone;
+    var isPlainObject: typeof import("./merge").isPlainObject;
+    var recursive: typeof import("./merge").recursive;
+}
+export declare function merge(clone: boolean, ...items: any[]): any;
+export declare function merge(...items: any[]): any;
+export declare function recursive(clone: boolean, ...items: any[]): any;
+export declare function recursive(...items: any[]): any;
+export declare function clone<T>(input: T): T;
+export declare function isPlainObject(input: unknown): input is NonNullable<any>;

package/dist/es/utils/merge.js

@@ -0,0 +1,68 @@
+import { _ as _to_consumable_array } from "@swc/helpers/_/_to_consumable_array";
+import { _ as _type_of } from "@swc/helpers/_/_type_of";
+export default main;
+export function main() {
+    for(var _len = arguments.length, items = new Array(_len), _key = 0; _key < _len; _key++){
+        items[_key] = arguments[_key];
+    }
+    return merge.apply(void 0, _to_consumable_array(items));
+}
+main.clone = clone;
+main.isPlainObject = isPlainObject;
+main.recursive = recursive;
+export function merge() {
+    for(var _len = arguments.length, items = new Array(_len), _key = 0; _key < _len; _key++){
+        items[_key] = arguments[_key];
+    }
+    return _merge(items[0] === true, false, items);
+}
+export function recursive() {
+    for(var _len = arguments.length, items = new Array(_len), _key = 0; _key < _len; _key++){
+        items[_key] = arguments[_key];
+    }
+    return _merge(items[0] === true, true, items);
+}
+export function clone(input) {
+    if (Array.isArray(input)) {
+        var output = [];
+        for(var index = 0; index < input.length; ++index)output.push(clone(input[index]));
+        return output;
+    }
+    if (isPlainObject(input)) {
+        var output1 = {};
+        // eslint-disable-next-line guard-for-in
+        for(var index1 in input)output1[index1] = clone(input[index1]);
+        return output1;
+    }
+    return input;
+}
+export function isPlainObject(input) {
+    if (input === null || (typeof input === "undefined" ? "undefined" : _type_of(input)) !== 'object') return false;
+    if (Object.getPrototypeOf(input) === null) return true;
+    var ref = input;
+    while(Object.getPrototypeOf(ref) !== null)ref = Object.getPrototypeOf(ref);
+    return Object.getPrototypeOf(input) === ref;
+}
+function _recursiveMerge(base, extend) {
+    if (!isPlainObject(base) || !isPlainObject(extend)) return extend;
+    for(var key in extend){
+        if (key === '__proto__' || key === 'constructor' || key === 'prototype') continue;
+        base[key] = isPlainObject(base[key]) && isPlainObject(extend[key]) ? _recursiveMerge(base[key], extend[key]) : extend[key];
+    }
+    return base;
+}
+function _merge(isClone, isRecursive, items) {
+    var result;
+    if (isClone || !isPlainObject(result = items.shift())) result = {};
+    for(var index = 0; index < items.length; ++index){
+        var item = items[index];
+        // eslint-disable-next-line no-continue
+        if (!isPlainObject(item)) continue;
+        for(var key in item){
+            if (key === '__proto__' || key === 'constructor' || key === 'prototype') continue;
+            var value = isClone ? clone(item[key]) : item[key];
+            result[key] = isRecursive ? _recursiveMerge(result[key], value) : value;
+        }
+    }
+    return result;
+}

package/dist/es/utils/platform-taro.js

@@ -1,18 +1,18 @@
-import Taro from "@tarojs/taro";
+import { getEnv } from "@tarojs/taro";
 export var harmony = function() {
     return [
         'harmony',
         'harmonyhybrid',
         'jdharmony'
-    ].includes(Taro.getEnv().toLowerCase());
+    ].includes(getEnv().toLowerCase());
 };
 export var web = function() {
     return [
         'web'
-    ].includes(Taro.getEnv().toLowerCase());
+    ].includes(getEnv().toLowerCase());
 };
 export var miniprogram = function() {
     return [
         'mini'
-    ].includes(Taro.getEnv().toLowerCase());
+    ].includes(getEnv().toLowerCase());
 };

package/dist/es/utils/to-array.d.ts

@@ -0,0 +1 @@
+export declare function toArray<T>(value?: T | T[] | null): T[];

package/dist/es/utils/to-array.js

@@ -0,0 +1,8 @@
+export function toArray(value) {
+    if (value === undefined || value === null) {
+        return [];
+    }
+    return Array.isArray(value) ? value : [
+        value
+    ];
+}