@nutui/nutui-react-taro 1.4.1 → 1.4.2

package/dist/nutui.react.umd.js

@@ -1,6 +1,6 @@
 /*!
-* @nutui/nutui-react-taro v1.4.1-beta.0 Wed Dec 28 2022 17:08:56 GMT+0800 (中国标准时间)
-* (c) 2022 @jdf2e.
+* @nutui/nutui-react-taro v1.4.2-beta.0 Wed Jan 04 2023 15:06:14 GMT+0800 (China Standard Time)
+* (c) 2023 @jdf2e.
 * Released under the MIT License.
 */
 (function(global2, factory) {
@@ -122,7 +122,7 @@
     const isImage = name ? name.indexOf("/") !== -1 : false;
     const type = isImage ? "img" : tag;
     const b2 = cn("icon");
-    const handleClick2 = (e2) => {
+    const handleClick = (e2) => {
       if (onClick) {
         onClick(e2);
       }
@@ -144,7 +144,7 @@
           ...style
         },
         ...rest,
-        onClick: handleClick2,
+        onClick: handleClick,
         ...hasSrc()
       },
       children
@@ -246,7 +246,7 @@
       classes,
       getStyle
     ]);
-    const handleClick2 = (e2) => {
+    const handleClick = (e2) => {
       if (!loading && !disabled && onClick) {
         onClick(e2);
       }
@@ -255,7 +255,7 @@
       className: `${btnName} ${className}`,
       style: { ...btnStyle, ...style },
       ...rest,
-      onClick: (e2) => handleClick2(e2)
+      onClick: (e2) => handleClick(e2)
     }, /* @__PURE__ */ React__default["default"].createElement("div", {
       className: "nut-button__warp",
       style: getStyle()
@@ -323,7 +323,7 @@
       ...props
     };
     const b2 = cn("cell");
-    const handleClick2 = (event) => {
+    const handleClick = (event) => {
       onClick(event);
       const link = to2 || url;
       if (link) {
@@ -342,7 +342,7 @@
         { clickable: !!(isLink || to2), center, large: size === "large" },
         [className]
       )} `,
-      onClick: (event) => handleClick2(event),
+      onClick: (event) => handleClick(event),
       style: baseStyle,
       ...rest
     }, children || /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, icon || iconSlot ? /* @__PURE__ */ React__default["default"].createElement("div", {
@@ -505,7 +505,7 @@
         document.body.classList.remove("nut-overflow-hidden");
       }
     };
-    const handleClick2 = (e2) => {
+    const handleClick = (e2) => {
       if (closeOnClickOverlay) {
         props.onClick && props.onClick(e2);
         renderRef.current = false;
@@ -519,7 +519,7 @@
       className: classes,
       style: styles,
       ...rest,
-      onClick: handleClick2
+      onClick: handleClick
     }, children));
   };
   Overlay.defaultProps = defaultOverlayProps;
@@ -7170,7 +7170,7 @@
     const isIconName = () => {
       return typeof icon === "string";
     };
-    const handleClick2 = (e2) => {
+    const handleClick = (e2) => {
       onClick && onClick(e2);
       context.onClick && context.onClick(
         {
@@ -7196,7 +7196,7 @@
       className: b2(),
       style: rootStyle(),
       ...rest,
-      onClick: handleClick2
+      onClick: handleClick
     }, /* @__PURE__ */ React__default["default"].createElement("div", {
       className: contentClass()
     }, icon && isIconName() ? /* @__PURE__ */ React__default["default"].createElement(Icon$1, {
@@ -7461,7 +7461,7 @@
     };
     const b2 = cn("tabbar");
     const [selectIndex, setSelectIndex] = React.useState(visible);
-    const handleClick2 = (idx) => {
+    const handleClick = (idx) => {
       setSelectIndex(idx);
     };
     return /* @__PURE__ */ React__default["default"].createElement("div", {
@@ -7484,7 +7484,7 @@
         activeColor,
         size,
         handleClick: () => {
-          handleClick2(idx);
+          handleClick(idx);
           tabSwitch(child, idx);
           onSwitch(child, idx);
         }
@@ -7526,7 +7526,7 @@
       activeColor,
       unactiveColor,
       index,
-      handleClick: handleClick2,
+      handleClick,
       iconClassPrefix,
       iconFontClassName
     } = {
@@ -7553,7 +7553,7 @@
         color: active ? activeColor : unactiveColor
       },
       onClick: () => {
-        handleClick2(index);
+        handleClick(index);
       }
     }, /* @__PURE__ */ React__default["default"].createElement("div", {
       className: `${bIcon()}`
@@ -8190,19 +8190,6 @@
   };
   Indicator.defaultProps = defaultProps$19;
   Indicator.displayName = "NutIndicator";
-  const handleClick = (e2) => {
-    e2.stopPropagation();
-    const isIcon = e2.target.className.includes("arrow-icon");
-    const isTitle = e2.target.className.includes("__title") || isIcon;
-    const currentClass = e2.currentTarget.className;
-    const isShow = currentClass.includes("nutShow");
-    const arrowIcon = e2.currentTarget.querySelector(".arrow-icon");
-    const iconClass = arrowIcon.className;
-    if (isTitle) {
-      e2.currentTarget.className = isShow ? currentClass.replace("nutShow", "nutHide") : currentClass.replace("nutHide", "nutShow");
-      arrowIcon.className = isShow ? iconClass.replace("arrow-down", "arrow-up") : iconClass.replace("arrow-up", "arrow-down");
-    }
-  };
   const OffsetContext = React.createContext(20);
   const defaultProps$18 = {
     showhead: false,
@@ -8226,6 +8213,10 @@
       ...props
     };
     const offset = props.offset ? Number(props.offset) : 20;
+    const [sidenavbarShow, setSidenavbarShow] = React.useState(true);
+    const handleClick = () => {
+      setSidenavbarShow(!sidenavbarShow);
+    };
     return /* @__PURE__ */ React__default["default"].createElement(Popup, {
       visible,
       style: { width, height: "100%" },
@@ -8237,13 +8228,13 @@
     }, /* @__PURE__ */ React__default["default"].createElement("div", {
       className: "nut-sidenavbar__content"
     }, /* @__PURE__ */ React__default["default"].createElement("div", {
-      className: "nut-sidenavbar__list nutShow",
+      className: `nut-sidenavbar__list ${sidenavbarShow ? "nutShow" : "nutHide"}`,
       onClick: handleClick
     }, /* @__PURE__ */ React__default["default"].createElement("div", {
       className: "nut-sidenavbar__title border-bt ",
       style: { paddingLeft: `${offset}px` }
-    }, title, " ", /* @__PURE__ */ React__default["default"].createElement("i", {
-      className: "arrow-icon arrow-down"
+    }, title, /* @__PURE__ */ React__default["default"].createElement("i", {
+      className: `arrow-icon ${sidenavbarShow ? "arrow-up" : "arrow-down"}`
     })), /* @__PURE__ */ React__default["default"].createElement(OffsetContext.Provider, {
       value: offset
     }, /* @__PURE__ */ React__default["default"].createElement("div", {
@@ -8260,8 +8251,8 @@
       ...defaultProps$17,
       ...props
     };
+    const [subShow, setSubShow] = React.useState(open);
     const offset = React.useContext(OffsetContext);
-    console.log("offset>>>>>>>", offset);
     const listRef = React.useRef(null);
     const setListLevel = React.useCallback(
       (nodeList, level = 1) => {
@@ -8290,9 +8281,9 @@
       [offset]
     );
     const clickFn = (e2) => {
-      handleClick(e2);
-      const currentClass = e2.currentTarget.className;
-      const isShow = currentClass.includes("nutShow");
+      e2.stopPropagation();
+      setSubShow(!subShow);
+      const isShow = !subShow;
       onClick && onClick({ title, ikey, isShow });
     };
     React.useEffect(() => {
@@ -8301,8 +8292,8 @@
       (_b = listRef.current) == null ? void 0 : _b.setAttribute("level", "1");
       childNodes && setListLevel(childNodes);
     }, [setListLevel]);
-    const divClass = open ? "nut-subsidenavbar__list  nutShow" : "nut-subsidenavbar__list  nutHide";
-    const iconClass = open ? "arrow-icon arrow-down" : "arrow-icon arrow-up";
+    const divClass = subShow ? "nut-subsidenavbar__list  nutShow" : "nut-subsidenavbar__list  nutHide";
+    const iconClass = subShow ? "arrow-icon arrow-down" : "arrow-icon arrow-up";
     return /* @__PURE__ */ React__default["default"].createElement("div", {
       className: divClass,
       ref: listRef,
@@ -8507,7 +8498,7 @@
         parent.updateTitle(text, orderKey);
       }
     };
-    const handleClick2 = (item) => {
+    const handleClick = (item) => {
       parent.toggleItemShow(orderKey);
       setTitle(item.text);
       setValue(item.value);
@@ -8586,7 +8577,7 @@
           flexBasis: `${100 / columns}%`
         },
         onClick: () => {
-          handleClick2(item);
+          handleClick(item);
         }
       }, item.value === _value ? /* @__PURE__ */ React__default["default"].createElement(Icon$1, {
         classPrefix: iconClassPrefix,
@@ -8707,7 +8698,7 @@
     const isImage = name ? name.indexOf("/") !== -1 : false;
     const type = isImage ? "img" : tag;
     const b2 = cn("icon");
-    const handleClick2 = (e2) => {
+    const handleClick = (e2) => {
       if (onClick) {
         onClick(e2);
       }
@@ -8729,7 +8720,7 @@
           ...style
         },
         ...rest,
-        onClick: handleClick2,
+        onClick: handleClick,
         ...hasSrc()
       },
       children
@@ -10087,7 +10078,7 @@
         className: `${b2("label", { disabled: innerDisabled })} `
       }, children || label);
     };
-    const handleClick2 = () => {
+    const handleClick = () => {
       if (!disabled) {
         const latest = !innerChecked;
         if (max !== void 0 && latest && getParentVals().length >= max)
@@ -10099,7 +10090,7 @@
     return /* @__PURE__ */ React__default["default"].createElement("div", {
       className: `${b2({ reverse: textPosition === "left" })} ${className || ""}`,
       ...rest,
-      onClick: handleClick2
+      onClick: handleClick
     }, renderIcon(), renderLabel());
   };
   Checkbox.defaultProps = defaultProps$_;
@@ -10149,7 +10140,6 @@
       setScrollDistance(translateY);
     };
     const setMove = (move, type, time) => {
-      console.log("move");
       let updateMove = move + transformY.current;
       if (type === "end") {
         if (updateMove > 0) {
@@ -10251,7 +10241,6 @@
     };
     const getReference = async () => {
       const refe = await getRectByTaro(listbox == null ? void 0 : listbox.current);
-      console.log(refe);
       lineSpacing.current = refe.height ? refe.height : 36;
       modifyStatus(true);
     };
@@ -11141,14 +11130,6 @@
       onClickLeftIcon,
       onClickRightIcon,
       onClick,
-      change,
-      blur,
-      focus,
-      clear,
-      clickInput,
-      clickLeftIcon,
-      clickRightIcon,
-      click,
       iconClassPrefix,
       iconFontClassName,
       ...rest
@@ -11163,7 +11144,9 @@
     const getModelValue = () => String(inputValue != null ? inputValue : "");
     const inputRef = React.useRef(null);
     React.useLayoutEffect(() => {
-      updateValue(getModelValue(), formatTrigger);
+      if (defaultValue) {
+        updateValue(getModelValue(), formatTrigger);
+      }
     });
     React.useEffect(() => {
       setClasses(inputClass);
@@ -11189,8 +11172,11 @@
         `${border ? `${prefixCls}-border` : ""}`,
         `${slotButton || rightIcon ? `${prefixCls}-right-mark` : ""}`
       ].filter(Boolean).join(" ");
-    }, [disabled, required, error, border]);
-    const updateValue = (value, trigger = "onChange") => {
+    }, [disabled, required, error, border, slotButton, rightIcon, center]);
+    React.useEffect(() => {
+      setClasses(inputClass);
+    }, [disabled, required, error, border, slotButton, rightIcon, center]);
+    const updateValue = (value, trigger = "onChange", event) => {
       var _a;
       let val = value;
       if (type === "digit" || type === "tel") {
@@ -11211,21 +11197,19 @@
         inputRef.current.value = val;
       }
       SetInputValue(val);
+      onChange && onChange(val, event);
     };
     const handleFocus = (event) => {
       const val = event.target.value;
       SetActive(true);
       onFocus && onFocus(val, event);
-      focus && focus(val, event);
     };
     const handleInput = (event) => {
       let val = event.target.value;
       if (maxlength && val.length > Number(maxlength)) {
         val = val.slice(0, Number(maxlength));
       }
-      updateValue(val);
-      onChange && onChange(val, event);
-      change && change(val, event);
+      updateValue(val, "onChange", event);
     };
     const handleBlur = (event) => {
       setTimeout(() => {
@@ -11237,19 +11221,15 @@
       }
       updateValue(getModelValue(), "onBlur");
       onBlur && onBlur(val, event);
-      blur && blur(val, event);
     };
     const handleClickInput = (event) => {
       onClickInput && onClickInput(event);
-      clickInput && clickInput(event);
     };
     const handleClickLeftIcon = (event) => {
       onClickLeftIcon && onClickLeftIcon(event);
-      clickLeftIcon && clickLeftIcon(event);
     };
     const handleClickRightIcon = (event) => {
       onClickRightIcon && onClickRightIcon(event);
-      clickRightIcon && clickRightIcon(event);
     };
     const resetValidation = () => {
     };
@@ -11265,14 +11245,12 @@
     const handleClear = (event) => {
       updateValue("");
       onClear && onClear("", event);
-      clear && clear("", event);
     };
     return /* @__PURE__ */ React__default["default"].createElement("div", {
       className: `${classes}  ${className || ""}`,
       style,
       onClick: (e2) => {
         onClick && onClick(e2);
-        click && click(e2);
       }
     }, slotInput ? /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, label ? /* @__PURE__ */ React__default["default"].createElement("div", {
       className: `nut-input-label ${labelClass}`,
@@ -11550,7 +11528,7 @@
       }
       return [renderIcon(), renderLabel()];
     };
-    const handleClick2 = (e2) => {
+    const handleClick = (e2) => {
       if (disabledStatement || checkedStatement)
         return;
       setCheckedStatement(!checkedStatement);
@@ -11560,7 +11538,7 @@
     const reverseState = textPosition === "left";
     return /* @__PURE__ */ React__default["default"].createElement("div", {
       className: `nut-radio ${className}`,
-      onClick: handleClick2,
+      onClick: handleClick,
       ...rest
     }, renderRadioItem());
   };
@@ -13950,12 +13928,12 @@
         })
       }, footer);
     }
-    const handleClick2 = () => {
+    const handleClick = () => {
       onClickSelf && onClickSelf();
     };
     return /* @__PURE__ */ React__default["default"].createElement("div", {
       className: "nut-dialog__outer",
-      onClick: handleClick2
+      onClick: handleClick
     }, /* @__PURE__ */ React__default["default"].createElement("div", {
       className: "nut-dialog",
       style: { display: visible ? "flex" : "none" }
@@ -13981,7 +13959,7 @@
       onClosed,
       onCancel
     } = props;
-    const handleClick2 = (e2) => {
+    const handleClick = (e2) => {
       if (closeOnClickOverlay && visible && e2.target === e2.currentTarget) {
         onClosed == null ? void 0 : onClosed();
         onCancel == null ? void 0 : onCancel();
@@ -14003,7 +13981,7 @@
       appear: true
     }, /* @__PURE__ */ React__default["default"].createElement(Mask, null)) : null, /* @__PURE__ */ React__default["default"].createElement("div", {
       className: classNames("nut-dialog__wrap", className),
-      onClick: handleClick2,
+      onClick: handleClick,
       style: wrapStyle
     }, /* @__PURE__ */ React__default["default"].createElement(Content, {
       ...props,
@@ -19559,7 +19537,7 @@
         }
       }, 0);
     };
-    const handleClick2 = (event) => {
+    const handleClick = (event) => {
       click && click(event);
       onClick && onClick(event);
     };
@@ -19669,7 +19647,7 @@
     }, showNoticeBar && direction === "across" ? /* @__PURE__ */ React__default["default"].createElement("div", {
       className: noticebarClass,
       style: barStyle,
-      onClick: handleClick2
+      onClick: handleClick
     }, iconShow() ? /* @__PURE__ */ React__default["default"].createElement("div", {
       className: "left-icon",
       style: { backgroundImage: `url(${iconBg() || ""})` }
@@ -19698,7 +19676,7 @@
     })) : null) : null, showNoticeBar && scrollList.current.length > 0 && direction === "vertical" ? /* @__PURE__ */ React__default["default"].createElement("div", {
       className: "nut-noticebar-vertical",
       style: barStyle,
-      onClick: handleClick2
+      onClick: handleClick
     }, children ? /* @__PURE__ */ React__default["default"].createElement("div", {
       className: "horseLamp_list",
       style: horseLampStyle
@@ -20695,7 +20673,7 @@
     ${mark ? `${prefixCls2}--mark` : ""}
     ${closeable ? `${prefixCls2}--close` : ""}`;
     };
-    const handleClick2 = (e2) => {
+    const handleClick = (e2) => {
       if (props.onClick) {
         props.onClick(e2);
       }
@@ -20718,7 +20696,7 @@
     return /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, closeable ? isTagShow && /* @__PURE__ */ React__default["default"].createElement("div", {
       className: `${btnName} ${className}`,
       style: { ...style, ...getStyle() },
-      onClick: (e2) => handleClick2(e2)
+      onClick: (e2) => handleClick(e2)
     }, children && /* @__PURE__ */ React__default["default"].createElement("span", {
       className: "text"
     }, children), /* @__PURE__ */ React__default["default"].createElement(Icon$1, {
@@ -20736,7 +20714,7 @@
     })) : /* @__PURE__ */ React__default["default"].createElement("div", {
       className: `${btnName} ${className}`,
       style: { ...style, ...getStyle() },
-      onClick: (e2) => handleClick2(e2)
+      onClick: (e2) => handleClick(e2)
     }, children && /* @__PURE__ */ React__default["default"].createElement("span", {
       className: "text"
     }, children)));
@@ -20865,7 +20843,7 @@
       const prefixCls = "popover-arrow";
       return `${prefixCls} ${prefixCls}-${filter()} ${location ? `${prefixCls}--${location}` : ""}`;
     };
-    const handleClick2 = (e2) => {
+    const handleClick = (e2) => {
       if (props.onClick) {
         props.onClick(e2);
       }
@@ -20882,7 +20860,7 @@
     }, /* @__PURE__ */ React__default["default"].createElement(Trigger, {
       forwardedRef: goodItem
     }, /* @__PURE__ */ React__default["default"].createElement("div", {
-      onClick: (e2) => handleClick2(e2)
+      onClick: (e2) => handleClick(e2)
     }, Array.isArray(children) ? children[0] : children, visible ? /* @__PURE__ */ React__default["default"].createElement("div", {
       className: `${popoverContent}`,
       style: getStyle()
@@ -20905,7 +20883,7 @@
       }, item.name));
     })) : null))), visible ? /* @__PURE__ */ React__default["default"].createElement(Overlay, {
       visible,
-      onClick: (e2) => handleClick2(e2),
+      onClick: (e2) => handleClick(e2),
       style: { background: "transparent" }
     }) : "");
   };
@@ -22522,7 +22500,7 @@
       ...rest
     } = { ...defaultProps$c, ...props };
     const b2 = cn("trendarrow");
-    const handleClick2 = () => {
+    const handleClick = () => {
     };
     const rateTrend = React.useRef(rate > 0);
     const myFixed = (num, digit = 2) => {
@@ -22568,7 +22546,7 @@
     return /* @__PURE__ */ React__default["default"].createElement("div", {
       className: `${b2()} ${className}`,
       ...rest,
-      onClick: handleClick2
+      onClick: handleClick
     }, !arrowLeft && renderContent(!arrowLeft), children || /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, Number(rate) !== 0 && /* @__PURE__ */ React__default["default"].createElement(Icon$1, {
       size: calcIconProps.size,
       name: calcIconProps.name,
@@ -22715,7 +22693,7 @@
       loop: loop2
     });
     const cls = classNames(classes, className);
-    const handleClick2 = (event) => {
+    const handleClick = (event) => {
       setClicked(true);
       if (!loop2) {
         setTimeout(() => {
@@ -22728,7 +22706,7 @@
       className: "nut-animate"
     }, /* @__PURE__ */ React__default["default"].createElement("div", {
       className: cls,
-      onClick: handleClick2,
+      onClick: handleClick,
       ...rest
     }, children));
   };
@@ -22940,12 +22918,12 @@
         onChange && onChange("collapse");
       }
     };
-    const handleClick2 = () => {
+    const handleClick = () => {
       onClick && onClick();
     };
     return /* @__PURE__ */ React__default["default"].createElement(React__default["default"].Fragment, null, /* @__PURE__ */ React__default["default"].createElement("div", {
       className: "nut-ellipsis",
-      onClick: handleClick2,
+      onClick: handleClick,
       ref: root,
       id: `root${refRandomId}`
     }, /* @__PURE__ */ React__default["default"].createElement("div", null, !exceeded ? /* @__PURE__ */ React__default["default"].createElement("div", {

package/dist/packages/input/input.scss

@@ -54,18 +54,18 @@ textarea {
     border: 0;
     text-decoration: none;
   }
-  &-label {
-    width: 80px;
-    overflow: hidden;
-    text-align: left;
-    display: flex;
-    .label-string {
-      overflow: hidden;
-      white-space: nowrap;
-      text-overflow: ellipsis;
-      color: $gray1;
-    }
-  }
+  //   &-label {
+  //     width: 80px;
+  //     overflow: hidden;
+  //     text-align: left;
+  //     display: flex;
+  //     .label-string {
+  //       overflow: hidden;
+  //       white-space: nowrap;
+  //       text-overflow: ellipsis;
+  //       color: $gray1;
+  //     }
+  //   }
   &__clear {
     width: 16px;
     height: 16px;