@nutui/nutui-react-taro 3.0.3 → 3.0.5

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

@@ -5,6 +5,8 @@
 .nut-badge {
   position: relative;
   display: inline-flex;
+  vertical-align: middle;
+  box-sizing: content-box;
   width: auto;
 }
 .nut-badge-icon {
@@ -37,13 +39,12 @@
 }
 .nut-badge-sup {
   display: inline-flex;
-  justify-content: center;
-  height: var(--nutui-badge-height, 14px);
+  text-align: center;
   min-width: var(--nutui-badge-min-width, 6px);
   padding: var(--nutui-badge-padding, 1px 4px);
   box-sizing: border-box;
   color: var(--nutui-badge-color, #ffffff);
-  font-size: var(--nutui-badge-font-size, var(--nutui-font-size-xxs, 10px));
+  font-size: var(--nutui-badge-font-size, var(--nutui-font-size-xxxs, 9px));
   line-height: 12px;
   white-space: nowrap;
   font-weight: normal;
@@ -53,12 +54,6 @@
 }
 .nut-badge-number {
   font-family: "JD";
-  /* #ifdef harmony */
-  line-height: 12px;
-  /* #endif */
-  /* #ifndef harmony */
-  line-height: 13px;
-  /* #endif */
 }
 .nut-badge-one {
   height: var(--nutui-badge-height, 14px);

package/dist/nutui.react.umd.js

@@ -4541,7 +4541,7 @@
     var classPrefix2 = "nut-fixednav";
     var classes = classNames(classPrefix2, {
       active: visible
-    }, type2, className);
+    }, "".concat(classPrefix2, "-").concat(type2), className);
     var renderListItem = function(item, index2) {
       return /* @__PURE__ */ React.createElement(components.View, {
         className: "".concat(classPrefix2, "-list-item"),
@@ -4549,9 +4549,9 @@
           return onSelect(item, event);
         },
         key: item.id || index2
-      }, /* @__PURE__ */ React.isValidElement(item.icon) ? item.icon : /* @__PURE__ */ React.createElement("img", {
+      }, /* @__PURE__ */ React.isValidElement(item.icon) ? item.icon : /* @__PURE__ */ React.createElement(components.Image, {
         src: item.icon,
-        alt: ""
+        className: "".concat(classPrefix2, "-list-image")
       }), /* @__PURE__ */ React.createElement(components.View, {
         className: "".concat(classPrefix2, "-list-text")
       }, item.text));
@@ -4830,7 +4830,7 @@
       });
       index2 = index2 < 0 ? 0 : index2;
       return {
-        transform: "translate3d( 0,-".concat(index2 * 100, "%, 0)"),
+        transform: "translateY(-".concat(index2 * 100, "%)"),
         transitionDuration: "".concat(contentDuration, "ms")
       };
     };
@@ -4863,7 +4863,6 @@
       className: "".concat(classPrefix$l, "-list"),
       ref: navRef
     }, titles.current.map(function(item, index2) {
-      var _obj;
       return /* @__PURE__ */ React.createElement(components.View, {
         ref: function(ref) {
           return titleItemsRef.current.push(ref);
@@ -4872,10 +4871,10 @@
         onClick: function(e) {
           tabChange(item);
         },
-        className: classNames("".concat(classPrefix$l, "-titles-item"), (_obj = {}, _define_property(_obj, "".concat(classPrefix$l, "-titles-item-active"), !item.disabled && String(item.value) === String(value2)), _define_property(_obj, "".concat(classPrefix$l, "-titles-item-disabled"), item.disabled), _obj)),
+        className: classNames("".concat(classPrefix$l, "-titles-item"), _define_property({}, "".concat(classPrefix$l, "-titles-item-active"), !item.disabled && String(item.value) === String(value2))),
         key: item.value
       }, /* @__PURE__ */ React.createElement(components.View, {
-        className: classNames("".concat(classPrefix$l, "-ellipsis"), "".concat(classPrefix$l, "-titles-item-text"))
+        className: classNames("".concat(classPrefix$l, "-ellipsis"), "".concat(classPrefix$l, "-titles-item-text"), _define_property({}, "".concat(classPrefix$l, "-titles-item-disabled"), item.disabled))
       }, item.title));
     }))), /* @__PURE__ */ React.createElement(components.View, {
       className: "".concat(classPrefix$l, "-content-wrap")
@@ -7857,12 +7856,14 @@
     var _props_keyIndex = props.keyIndex, keyIndex = _props_keyIndex === void 0 ? 0 : _props_keyIndex, _props_options = props.options, options = _props_options === void 0 ? [] : _props_options, _props_threeDimensional = props.threeDimensional, threeDimensional = _props_threeDimensional === void 0 ? true : _props_threeDimensional, _props_duration = props.duration, duration = _props_duration === void 0 ? 1e3 : _props_duration, onSelect = props.onSelect, _props_renderLabel = props.renderLabel, renderLabel = _props_renderLabel === void 0 ? function(item) {
       return item.label;
     } : _props_renderLabel;
+    var classPrefix2 = "nut-pickerview-roller";
+    var uuid = useUuid();
     var DEFAULT_DURATION = 200;
     var INERTIA_TIME = 300;
     var INERTIA_DISTANCE = 15;
     var ROTATION = 20;
     var touch = useTouch();
-    var _useState = _sliced_to_array(React.useState(1), 2), currentIndex = _useState[0], setCurrentIndex = _useState[1];
+    var _useState = _sliced_to_array(React.useState(0), 2), currentIndex = _useState[0], setCurrentIndex = _useState[1];
     var lineSpacing = React.useRef(36);
     var _useState1 = _sliced_to_array(React.useState(0), 2), touchTime = _useState1[0], setTouchTime = _useState1[1];
     var _useState2 = _sliced_to_array(React.useState("0deg"), 2), touchDeg = _useState2[0], setTouchDeg = _useState2[1];
@@ -7873,6 +7874,7 @@
     var _useState4 = _sliced_to_array(React.useState(0), 2), startY = _useState4[0], setStartY = _useState4[1];
     var transformY = React.useRef(0);
     var _useState5 = _sliced_to_array(React.useState(0), 2), scrollDistance = _useState5[0], setScrollDistance = _useState5[1];
+    var _useState6 = _sliced_to_array(React.useState(web()), 2), isGetLineSpacing = _useState6[0], setGetStatus = _useState6[1];
     var _useStyles = useStyles(touchTime, touchDeg, scrollDistance, lineSpacing), touchRollerStyle = _useStyles.touchRollerStyle, touchTiledStyle = _useStyles.touchTiledStyle, rollerStyle = _useStyles.rollerStyle;
     var isItemHidden = function(index2) {
       return index2 >= currentIndex + 8 || index2 <= currentIndex - 8;
@@ -7896,7 +7898,7 @@
         var deg1 = Math.min(Math.max(currentDeg, 0), (options.length + 1) * ROTATION);
         if (deg1 >= 0 && deg1 < (options.length + 1) * ROTATION) {
           applyTransform("", "".concat(deg1, "deg"), void 0, updatedMove);
-          setCurrentIndex(Math.abs(Math.round(updatedMove / lineSpacing.current)) + 1);
+          deg1 > 0 && setCurrentIndex(Math.abs(Math.round(updatedMove / lineSpacing.current)) + 1);
         }
       }
     };
@@ -7937,7 +7939,7 @@
       var index2 = options.findIndex(function(item) {
         return item.value === selectedValue;
       });
-      setCurrentIndex(index2 === -1 ? 1 : index2 + 1);
+      setCurrentIndex(index2 === -1 ? 0 : index2 + 1);
       var move = index2 * lineSpacing.current;
       handleMove(-move);
     };
@@ -7946,15 +7948,68 @@
       setTouchTime(0);
       selectValue(scrollDistance);
     };
+    var getReactHeight = /* @__PURE__ */ function() {
+      var _ref = _async_to_generator(function() {
+        var placeholder, placeholderHeight, error;
+        return __generator(this, function(_state) {
+          switch (_state.label) {
+            case 0:
+              _state.trys.push([
+                0,
+                2,
+                ,
+                3
+              ]);
+              return [
+                4,
+                getRectByTaro(rollerRef.current)
+              ];
+            case 1:
+              placeholder = _state.sent();
+              placeholderHeight = placeholder.height || 0;
+              return [
+                2,
+                placeholderHeight
+              ];
+            case 2:
+              error = _state.sent();
+              console.error("获取高度失败:", error);
+              return [
+                2,
+                0
+              ];
+            case 3:
+              return [
+                2
+              ];
+          }
+        });
+      });
+      return function getReactHeight2() {
+        return _ref.apply(this, arguments);
+      };
+    }();
     React.useEffect(function() {
       var element = pickerRollerRef.current;
+      var currentLineSpacing;
       if (element && web()) {
         var computedStyle = getComputedStyle(element);
-        var currentLineSpacing = computedStyle.getPropertyValue("--nutui-picker-item-height");
-        !!currentLineSpacing && (lineSpacing.current = parseFloat(currentLineSpacing));
+        currentLineSpacing = computedStyle.getPropertyValue("--nutui-picker-item-height");
+        if (currentLineSpacing) {
+          lineSpacing.current = parseFloat(currentLineSpacing);
+        }
+      } else {
+        getReactHeight().then(function(height2) {
+          currentLineSpacing = height2;
+          if (currentLineSpacing) {
+            lineSpacing.current = currentLineSpacing;
+            setGetStatus(true);
+          }
+        });
       }
     }, [
-      pickerRollerRef.current
+      pickerRollerRef.current,
+      rollerRef.current
     ]);
     React.useEffect(function() {
       isMoving.current = false;
@@ -7996,21 +8051,23 @@
       className: "nut-pickerview-list",
       ref: pickerRollerRef
     }, /* @__PURE__ */ React.createElement(components.View, {
-      className: "nut-pickerview-roller",
+      className: classPrefix2,
+      id: "".concat(classPrefix2, "-").concat(uuid),
       ref: rollerRef,
       style: threeDimensional ? touchRollerStyle() : touchTiledStyle(),
       onTransitionEnd: stopMomentumScroll
     }, threeDimensional && options.map(function(item, index2) {
       var _item_value;
-      return /* @__PURE__ */ React.createElement(components.View, {
-        className: "nut-pickerview-roller-item ".concat(isItemHidden(index2 + 1) && "nut-pickerview-roller-item-hidden"),
+      var _obj;
+      return /* @__PURE__ */ React.createElement(React.Fragment, null, isGetLineSpacing ? /* @__PURE__ */ React.createElement(components.View, {
+        className: classNames("".concat(classPrefix2, "-item"), (_obj = {}, _define_property(_obj, "".concat(classPrefix2, "-item-hidden"), isItemHidden(index2 + 1)), _define_property(_obj, "".concat(classPrefix2, "-item-active"), index2 + 1 === currentIndex), _obj)),
         style: rollerStyle(index2),
         key: (_item_value = item.value) !== null && _item_value !== void 0 ? _item_value : index2
-      }, renderLabel(item));
+      }, renderLabel(item)) : null);
     }), !threeDimensional && options.map(function(item, index2) {
       var _item_value;
       return /* @__PURE__ */ React.createElement(components.View, {
-        className: "nut-pickerview-roller-item-tiled",
+        className: classNames("".concat(classPrefix2, "-item-tiled"), _define_property({}, "".concat(classPrefix2, "-item-active"), index2 + 1 === currentIndex)),
         key: (_item_value = item.value) !== null && _item_value !== void 0 ? _item_value : index2
       }, renderLabel(item));
     })));
@@ -11085,7 +11142,7 @@
       onClick: handleReduce
     }, /* @__PURE__ */ React.createElement(IconSVG$e, {
       size: 10,
-      className: classNames("".concat(classPrefix$h, "-icon ").concat(classPrefix$h, "-icon-minus"), _define_property({}, "".concat(classPrefix$h, "-icon-disabled"), shadowValue === min || disabled))
+      className: classNames("".concat(classPrefix$h, "-icon ").concat(classPrefix$h, "-icon-minus"), _define_property({}, "".concat(classPrefix$h, "-icon-disabled"), Number(shadowValue) <= Number(min) || disabled))
     })), /* @__PURE__ */ React.createElement("input", {
       className: classNames("".concat(classPrefix$h, "-input"), _define_property({}, "".concat(classPrefix$h, "-input-disabled"), disabled)),
       type: type2,
@@ -11102,7 +11159,7 @@
       onClick: handlePlus
     }, /* @__PURE__ */ React.createElement(IconSVG$a, {
       size: 10,
-      className: classNames("".concat(classPrefix$h, "-icon ").concat(classPrefix$h, "-icon-plus"), _define_property({}, "".concat(classPrefix$h, "-icon-disabled"), shadowValue === max || disabled))
+      className: classNames("".concat(classPrefix$h, "-icon ").concat(classPrefix$h, "-icon-plus"), _define_property({}, "".concat(classPrefix$h, "-icon-disabled"), Number(shadowValue) >= Number(max) || disabled))
     })));
   };
   InputNumber.displayName = "NutInputNumber";
@@ -38478,7 +38535,7 @@
     closeIcon: false,
     closeIconPosition: "top-right",
     showMenuByLongpress: false,
-    onChange: function(value2) {
+    onChange: function() {
     },
     onClose: function() {
     }
@@ -38491,71 +38548,50 @@
       value: value2,
       defaultValue,
       finalValue: defaultValue,
-      onChange: function(val2) {
-        onChange === null || onChange === void 0 ? void 0 : onChange(val2);
-      }
+      onChange
     }), 2), innerNo = _usePropsValue[0], setInnerNo = _usePropsValue[1];
     var _useState = _sliced_to_array(React.useState(visible), 2), showPop = _useState[0], setShowPop = _useState[1];
     var _useState1 = _sliced_to_array(React.useState(0), 2), active2 = _useState1[0], setActive = _useState1[1];
-    var _useState2 = _sliced_to_array(React.useState((images === null || images === void 0 ? void 0 : images.length) || 0 + ((videos === null || videos === void 0 ? void 0 : videos.length) || 0)), 2), maxNo = _useState2[0], setMaxNo = _useState2[1];
+    var _useState2 = _sliced_to_array(React.useState(images.length + videos.length), 2), maxNo = _useState2[0], setMaxNo = _useState2[1];
     var _useState3 = _sliced_to_array(React.useState({
       scale: 1,
-      moveable: false
+      moveable: false,
+      oriDistance: 0,
+      originScale: 1
     }), 2), store = _useState3[0], setStore = _useState3[1];
-    var _useState4 = _sliced_to_array(React.useState(0), 2), lastTouchEndTime = _useState4[0], setLastTouchEndTime = _useState4[1];
+    var lastTouchEndTime = React.useRef(0);
     var onTouchStart = function(event) {
       var touches = event.touches;
       var events = touches[0];
       var events2 = touches[1];
-      var curTouchTime = (/* @__PURE__ */ new Date()).getTime();
-      if (curTouchTime - lastTouchEndTime < 300) {
+      var curTouchTime = Date.now();
+      if (curTouchTime - lastTouchEndTime.current < 100) {
         var store1 = store;
-        if (store1.scale > 1) {
-          store1.scale = 1;
-        } else if (store1.scale === 1) {
-          store1.scale = 2;
-        }
+        store1.scale = store1.scale === 1 ? 2 : 1;
         scaleNow();
       }
       var store11 = store;
       store11.moveable = true;
       if (events2) {
-        store11.oriDistance = getDistance({
-          x: events.pageX,
-          y: events.pageY
-        }, {
-          x: events2.pageX,
-          y: events2.pageY
-        });
+        store11.oriDistance = getDistance(events, events2);
       }
-      store11.originScale = store11.scale || 1;
+      store11.originScale = store11.scale;
     };
     var onTouchMove = function(event) {
+      if (!store.moveable) return;
       var touches = event.touches;
       var events = touches[0];
       var events2 = touches[1];
-      if (!store.moveable) {
-        return;
-      }
       var store1 = store;
       if (events2) {
-        var curDistance = getDistance({
-          x: events.pageX,
-          y: events.pageY
-        }, {
-          x: events2.pageX,
-          y: events2.pageY
-        });
+        var curDistance = getDistance(events, events2);
         var curScale = curDistance / store1.oriDistance;
-        store1.scale = store1.originScale * curScale;
-        if (store1.scale > 3) {
-          store1.scale = 3;
-        }
+        store1.scale = Math.min(store1.originScale * curScale, 3);
         scaleNow();
       }
     };
     var onTouchEnd = function() {
-      setLastTouchEndTime((/* @__PURE__ */ new Date()).getTime());
+      lastTouchEndTime.current = Date.now();
       var store1 = store;
       store1.moveable = false;
       if (store1.scale < 1.1 && store1.scale > 1 || store1.scale < 1) {
@@ -38570,6 +38606,11 @@
       document.addEventListener("touchmove", onTouchMove);
       document.addEventListener("touchend", onTouchEnd);
       document.addEventListener("touchcancel", onTouchEnd);
+      return function() {
+        document.removeEventListener("touchcancel", onTouchEnd);
+        document.removeEventListener("touchmove", onTouchMove);
+        document.removeEventListener("touchend", onTouchEnd);
+      };
     };
     React.useEffect(function() {
       setShowPop(visible);
@@ -38587,7 +38628,7 @@
       innerNo
     ]);
     React.useEffect(function() {
-      setMaxNo((images === null || images === void 0 ? void 0 : images.length) || 0 + ((videos === null || videos === void 0 ? void 0 : videos.length) || 0));
+      setMaxNo(images.length + videos.length);
     }, [
       images,
       videos
@@ -38598,7 +38639,7 @@
       }
     };
     var getDistance = function(first, second) {
-      return Math.hypot(Math.abs(second.x - first.x), Math.abs(second.y - first.y));
+      return Math.hypot(Math.abs(second.pageX - first.pageX), Math.abs(second.pageY - first.pageY));
     };
     var slideChangeEnd = function(page) {
       setActive(page + 1);
@@ -38609,29 +38650,27 @@
       setShowPop(false);
       setActive(innerNo);
       scaleNow();
-      onClose && onClose();
+      onClose === null || onClose === void 0 ? void 0 : onClose();
       setStore(_object_spread_props(_object_spread({}, store), {
         scale: 1
       }));
     };
     var closeOnImg = function(e) {
       e.stopPropagation();
-      if (closeOnContentClick) {
-        onCloseInner(e);
-      }
+      if (closeOnContentClick) onCloseInner(e);
     };
     return /* @__PURE__ */ React.createElement(Popup, {
       visible: showPop,
       className: "".concat(classPrefix2, "-pop"),
-      style: {
-        width: "100%"
-      },
       onClick: onCloseInner
     }, /* @__PURE__ */ React.createElement(components.View, {
       className: classNames(classPrefix2, className),
       style,
       ref,
-      onTouchStart
+      onTouchStart,
+      onTouchMove,
+      onTouchEnd,
+      onTouchCancel: onTouchEnd
     }, /* @__PURE__ */ React.createElement(InnerSwiper, {
       autoPlay,
       className: "".concat(classPrefix2, "-swiper"),
@@ -38649,58 +38688,47 @@
       },
       defaultValue: innerNo && (innerNo > maxNo ? maxNo - 1 : innerNo - 1),
       indicator
-    }, (videos !== null && videos !== void 0 ? videos : []).map(function(item) {
+    }, _to_consumable_array(videos.map(function(item) {
       return {
         type: "video",
         data: item
       };
-    }).concat((images !== null && images !== void 0 ? images : []).map(function(item) {
+    })).concat(_to_consumable_array(images.map(function(item) {
       return {
         type: "image",
         data: item
       };
-    })).sort(function(a, b) {
+    }))).sort(function(a, b) {
       var _a_data, _b_data;
       var _a_data_index, _b_data_index;
       return ((_a_data_index = (_a_data = a.data) === null || _a_data === void 0 ? void 0 : _a_data.index) !== null && _a_data_index !== void 0 ? _a_data_index : 0) - ((_b_data_index = (_b_data = b.data) === null || _b_data === void 0 ? void 0 : _b_data.index) !== null && _b_data_index !== void 0 ? _b_data_index : 0);
     }).map(function(item, index2) {
-      if (item.type === "video") {
-        var _item_data = item.data, source = _item_data.source, options = _item_data.options;
-        return /* @__PURE__ */ React.createElement(SwiperItem, {
-          key: index2,
-          className: "nut-imagepreview-swiper-item"
-        }, /* @__PURE__ */ React.createElement(components.Video, {
-          src: source.src,
-          onClick: closeOnImg,
-          controls: options.controls,
-          autoplay: false,
-          loop: false,
-          muted: options.muted
-        }));
-      }
-      if (item.type === "image") {
-        var src = item.data.src;
-        return /* @__PURE__ */ React.createElement(SwiperItem, {
-          key: index2,
-          className: "nut-imagepreview-swiper-item"
-        }, /* @__PURE__ */ React.createElement(Image$1, _object_spread({
-          src,
-          mode: "widthFix",
-          onClick: closeOnImg,
-          style: {
-            width: "100%"
-          }
-        }, Taro.getEnv() !== "WEB" && {
-          showMenuByLongpress
-        })));
-      }
-      return null;
-    }))), pagination ? /* @__PURE__ */ React.createElement(components.View, {
+      return /* @__PURE__ */ React.createElement(SwiperItem, {
+        key: index2,
+        className: "nut-imagepreview-swiper-item"
+      }, item.type === "video" ? /* @__PURE__ */ React.createElement(components.Video, {
+        src: item.data.source.src,
+        onClick: closeOnImg,
+        controls: item.data.options.controls,
+        autoplay: false,
+        loop: false,
+        muted: item.data.options.muted
+      }) : /* @__PURE__ */ React.createElement(Image$1, _object_spread({
+        src: item.data.src,
+        mode: "widthFix",
+        onClick: closeOnImg,
+        style: {
+          width: "100%"
+        }
+      }, Taro.getEnv() !== "WEB" && {
+        showMenuByLongpress
+      })));
+    }))), pagination && /* @__PURE__ */ React.createElement(components.View, {
       className: "".concat(classPrefix2, "-index")
-    }, active2, "/", (images ? images.length : 0) + (videos ? videos.length : 0)) : null, closeIcon !== false ? /* @__PURE__ */ React.createElement(components.View, {
+    }, active2, "/", maxNo), closeIcon !== false && /* @__PURE__ */ React.createElement(components.View, {
       className: "".concat(classPrefix2, "-close ").concat(closeIconPosition),
       onClick: onCloseInner
-    }, closeIcon === true ? /* @__PURE__ */ React.createElement(IconSVG$p, null) : closeIcon) : null);
+    }, closeIcon === true ? /* @__PURE__ */ React.createElement(IconSVG$p, null) : closeIcon));
   };
   ImagePreview.displayName = "NutImagePreview";
   var defaultPaginationOptions = {