@nutui/nutui-react-taro 1.4.13 → 1.4.14

package/dist/nutui.react.umd.js

@@ -8,7 +8,7 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 /*!
-* @nutui/nutui-react-taro v1.4.13 Wed Mar 29 2023 16:05:15 GMT+0800 (China Standard Time)
+* @nutui/nutui-react-taro v1.4.14 Thu Apr 06 2023 15:50:10 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */
@@ -3298,6 +3298,7 @@ var __publicField = (obj, key, value) => {
       direction,
       iconClassPrefix,
       iconFontClassName,
+      className,
       onClick,
       ...rest
     } = {
@@ -3305,6 +3306,7 @@ var __publicField = (obj, key, value) => {
       ...props
     };
     const b2 = cn("grid-item");
+    const classes = classNames(b2(), className);
     const context = React.useContext(GridContext);
     const pxCheck2 = (value) => {
       return Number.isNaN(Number(value)) ? String(value) : `${value}px`;
@@ -3360,16 +3362,25 @@ var __publicField = (obj, key, value) => {
         index
       );
     };
-    return /* @__PURE__ */ React.createElement("div", { className: b2(), style: rootStyle(), ...rest, onClick: handleClick }, /* @__PURE__ */ React.createElement("div", { className: contentClass() }, icon && isIconName() ? /* @__PURE__ */ React.createElement(
-      Icon$1,
+    return /* @__PURE__ */ React.createElement(
+      "div",
       {
-        classPrefix: iconClassPrefix,
-        fontClassName: iconFontClassName,
-        name: icon,
-        size: iconSize || parentIconSize,
-        color: iconColor || parentIconColor
-      }
-    ) : /* @__PURE__ */ React.createElement(React.Fragment, null, icon), text && /* @__PURE__ */ React.createElement("div", { className: "nut-grid-item__text", style: { fontSize, color } }, text), children && /* @__PURE__ */ React.createElement(React.Fragment, null, children)));
+        className: classes,
+        style: rootStyle(),
+        ...rest,
+        onClick: handleClick
+      },
+      /* @__PURE__ */ React.createElement("div", { className: contentClass() }, icon && isIconName() ? /* @__PURE__ */ React.createElement(
+        Icon$1,
+        {
+          classPrefix: iconClassPrefix,
+          fontClassName: iconFontClassName,
+          name: icon,
+          size: iconSize || parentIconSize,
+          color: iconColor || parentIconColor
+        }
+      ) : /* @__PURE__ */ React.createElement(React.Fragment, null, icon), text && /* @__PURE__ */ React.createElement("div", { className: "nut-grid-item__text", style: { fontSize, color } }, text), children && /* @__PURE__ */ React.createElement(React.Fragment, null, children))
+    );
   };
   GridItem.defaultProps = defaultProps$1l;
   GridItem.displayName = "NutGridItem";
@@ -4887,7 +4898,7 @@ var __publicField = (obj, key, value) => {
         const childProps = child == null ? void 0 : child.props;
         if ((childProps == null ? void 0 : childProps.title) || (childProps == null ? void 0 : childProps.paneKey)) {
           title.title = childProps == null ? void 0 : childProps.title;
-          title.paneKey = (childProps == null ? void 0 : childProps.paneKey) || idx;
+          title.paneKey = getPaneKey(childProps == null ? void 0 : childProps.paneKey, idx);
           title.disabled = childProps == null ? void 0 : childProps.disabled;
           title.index = idx;
           if (title.paneKey === value) {
@@ -4921,6 +4932,9 @@ var __publicField = (obj, key, value) => {
       transform: direction === "horizontal" ? `translate3d(-${index * 100}%, 0, 0)` : `translate3d( 0,-${index * 100}%, 0)`,
       transitionDuration: `${animatedTime}ms`
     };
+    const getPaneKey = (paneKey, index2) => {
+      return typeof paneKey === "string" ? paneKey : String(paneKey || index2);
+    };
     const tabChange = (item, index2) => {
       onClick && onClick(item);
       if (item.disabled) {
@@ -4990,7 +5004,7 @@ var __publicField = (obj, key, value) => {
         ...child.props,
         activeKey: value
       };
-      if (String(value) !== String(((_a = child.props) == null ? void 0 : _a.paneKey) || idx) && autoHeight) {
+      if (String(value) !== getPaneKey((_a = child.props) == null ? void 0 : _a.paneKey, idx) && autoHeight) {
         childProps = {
           ...childProps,
           autoHeightClassName: "inactive"
@@ -5015,7 +5029,7 @@ var __publicField = (obj, key, value) => {
      * @return {String}
      */
     getWhatDay(year, month, day) {
-      const date = /* @__PURE__ */ new Date(`${year}/${month}/${day}`);
+      const date = new Date(`${year}/${month}/${day}`);
       const index = date.getDay();
       const dayNames = [
         "星期日",
@@ -5033,7 +5047,7 @@ var __publicField = (obj, key, value) => {
      * @return {Number}
      */
     getMonthPreDay(year, month) {
-      const date = /* @__PURE__ */ new Date(`${year}/${month}/01`);
+      const date = new Date(`${year}/${month}/01`);
       let day = date.getDay();
       if (day == 0) {
         day = 7;
@@ -5090,7 +5104,7 @@ var __publicField = (obj, key, value) => {
      */
     getDay(i) {
       i = i || 0;
-      let date = /* @__PURE__ */ new Date();
+      let date = new Date();
       const diff = i * (1e3 * 60 * 60 * 24);
       date = new Date(date.getTime() + diff);
       return this.date2Str(date);
@@ -5282,7 +5296,7 @@ var __publicField = (obj, key, value) => {
     };
     const isCurrDay = (month, day) => {
       const date = `${month.curData[0]}-${month.curData[1]}-${day}`;
-      return Utils.isEqual(date, Utils.date2Str(/* @__PURE__ */ new Date()));
+      return Utils.isEqual(date, Utils.date2Str(new Date()));
     };
     const confirm = () => {
       const { type: type2 } = props;
@@ -5618,8 +5632,8 @@ var __publicField = (obj, key, value) => {
           }
         });
       } else {
-        const currentYear2 = (/* @__PURE__ */ new Date()).getFullYear();
-        const currentMonth = (/* @__PURE__ */ new Date()).getMonth() + 1;
+        const currentYear2 = new Date().getFullYear();
+        const currentMonth = new Date().getMonth() + 1;
         const currentYearMonthIndex = state.monthsData.findIndex((item) => {
           return +item.curData[0] === currentYear2 && +item.curData[1] === currentMonth;
         });
@@ -6740,7 +6754,7 @@ var __publicField = (obj, key, value) => {
     const rotation = 20;
     const moving = React.useRef(false);
     let timer;
-    const listbox = React.useRef(null);
+    const listRef = React.useRef(null);
     const rollerRef = React.useRef(null);
     const pickerSlotRef = React.useRef(null);
     const [startTime, setStartTime] = React.useState(0);
@@ -6863,7 +6877,7 @@ var __publicField = (obj, key, value) => {
       }
     };
     const getReference = async () => {
-      const refe = await getRectByTaro(listbox == null ? void 0 : listbox.current);
+      const refe = await getRectByTaro(listRef == null ? void 0 : listRef.current);
       lineSpacing.current = refe.height ? refe.height : 36;
       modifyStatus(true);
     };
@@ -6946,7 +6960,7 @@ var __publicField = (obj, key, value) => {
         })
       ),
       /* @__PURE__ */ React.createElement("div", { className: "nut-picker-mask" }),
-      /* @__PURE__ */ React.createElement("div", { className: "nut-picker-indicator", ref: listbox })
+      /* @__PURE__ */ React.createElement("div", { className: "nut-picker-indicator", ref: listRef })
     );
   };
   const PickerSlot = React.forwardRef(InternalPickerSlot);
@@ -6989,44 +7003,65 @@ var __publicField = (obj, key, value) => {
     const [columnsList, setColumnsList] = React.useState([]);
     const b2 = cn("picker");
     const isConfirmEvent = React.useRef(false);
-    React.useEffect(() => {
-      if (defaultValueData && defaultValueData.length !== 0 && defaultValueData.toString() !== chooseValueData.toString()) {
-        const data = [...defaultValueData];
-        setchooseValueData(data);
-        setColumnsList(normalListData());
+    const formatCascade = (columns, values) => {
+      const formatted = [];
+      let cursor = {
+        text: "",
+        value: "",
+        children: columns
+      };
+      let columnIndex2 = 0;
+      while (cursor && cursor.children) {
+        const options = cursor.children;
+        const value = values[columnIndex2];
+        let index = options.findIndex(
+          (columnItem) => columnItem.value === value
+        );
+        if (index === -1)
+          index = 0;
+        cursor = cursor.children[index];
+        columnIndex2++;
+        formatted.push(options);
       }
-    }, [defaultValueData]);
-    React.useEffect(() => {
-      onChange && onChange(columnIndex, chooseValueData, selectedOptions());
-      if (isConfirmEvent.current) {
-        isConfirmEvent.current = false;
-        onConfirm && onConfirm(chooseValueData, selectedOptions());
+      return formatted;
+    };
+    const columnsType = () => {
+      const firstColumn = listData[0];
+      if (firstColumn) {
+        if (Array.isArray(firstColumn)) {
+          return "multiple";
+        }
+        if ("children" in firstColumn) {
+          return "cascade";
+        }
       }
-    }, [chooseValueData]);
+      return "single";
+    };
+    const normalListData = () => {
+      const type = columnsType();
+      switch (type) {
+        case "multiple":
+          return listData;
+        case "cascade":
+          return formatCascade(listData, chooseValueData);
+        default:
+          return [listData];
+      }
+    };
+    const init = () => {
+      const normalData = normalListData();
+      setColumnsList(normalData);
+    };
     React.useEffect(() => {
       init();
     }, [listData]);
-    const closeActionSheet = () => {
-      onClose && onClose(chooseValueData, selectedOptions());
-      onCloseUpdate && onCloseUpdate(chooseValueData, selectedOptions(), pickerRef);
-    };
-    const confirm = () => {
-      let movings = false;
-      refs.forEach((_ref) => {
-        if (_ref.moving)
-          movings = true;
-        _ref.stopMomentum();
-      });
-      if (movings) {
-        isConfirmEvent.current = true;
-      } else {
-        onConfirm && onConfirm(chooseValueData, selectedOptions());
+    React.useEffect(() => {
+      if (defaultValueData && defaultValueData.length !== 0 && defaultValueData.toString() !== chooseValueData.toString() && !currentValue2.length) {
+        const data = [...defaultValueData];
+        setchooseValueData(data);
+        setColumnsList(normalListData());
       }
-      onClose && onClose(chooseValueData, selectedOptions());
-      setTimeout(() => {
-        isConfirmEvent.current = false;
-      }, 0);
-    };
+    }, [defaultValueData]);
     const selectedOptions = () => {
       const optins = [];
       columnsList.map((column, index) => {
@@ -7043,6 +7078,18 @@ var __publicField = (obj, key, value) => {
       });
       return optins;
     };
+    React.useEffect(() => {
+      Taro.getEnv() !== "WEB" && setCurrentValue(defaultValuesConvert());
+      onChange && onChange(columnIndex, chooseValueData, selectedOptions());
+      if (isConfirmEvent.current) {
+        isConfirmEvent.current = false;
+        onConfirm && onConfirm(chooseValueData, selectedOptions());
+      }
+    }, [chooseValueData]);
+    const closeActionSheet = () => {
+      onClose && onClose(chooseValueData, selectedOptions());
+      onCloseUpdate && onCloseUpdate(chooseValueData, selectedOptions(), pickerRef);
+    };
     const chooseItem = (option, columnIndex2) => {
       if (option && Object.keys(option).length) {
         if (chooseValueData[columnIndex2] !== option.value) {
@@ -7055,8 +7102,7 @@ var __publicField = (obj, key, value) => {
               chooseValueData[index + 1] = cursor.children[0].value;
               setchooseValueData([...chooseValueData]);
               index++;
-              const cc = cursor.children[0];
-              cursor = cc;
+              cursor = cursor.children[0];
             }
             if (cursor && cursor.children) {
               chooseValueData[index + 1] = "";
@@ -7077,65 +7123,68 @@ var __publicField = (obj, key, value) => {
         }
       }
     };
-    const normalListData = () => {
-      const type = columnsType();
-      switch (type) {
-        case "multiple":
-          return listData;
-        case "cascade":
-          return formatCascade(listData, chooseValueData);
-        default:
-          return [listData];
+    const confirm = () => {
+      let movings = false;
+      refs.forEach((_ref) => {
+        if (_ref.moving)
+          movings = true;
+        _ref.stopMomentum();
+      });
+      if (movings) {
+        isConfirmEvent.current = true;
+      } else {
+        onConfirm && onConfirm(chooseValueData, selectedOptions());
       }
+      onClose && onClose(chooseValueData, selectedOptions());
+      setTimeout(() => {
+        isConfirmEvent.current = false;
+      }, 0);
     };
-    const columnsType = () => {
-      const firstColumn = listData[0];
-      if (firstColumn) {
-        if (Array.isArray(firstColumn)) {
-          return "multiple";
-        }
-        if ("children" in firstColumn) {
-          return "cascade";
-        }
-      }
-      return "single";
+    const renderToolbar = () => {
+      return /* @__PURE__ */ React.createElement("div", { className: b2("control") }, /* @__PURE__ */ React.createElement("span", { className: b2("cancel-btn"), onClick: () => closeActionSheet() }, locale.cancel), /* @__PURE__ */ React.createElement("div", { className: b2("title") }, title || ""), /* @__PURE__ */ React.createElement("span", { className: b2("confirm-btn"), onClick: confirm }, locale.confirm));
     };
-    const formatCascade = (columns, defaultValues) => {
-      const formatted = [];
-      let cursor = {
-        text: "",
-        value: "",
-        children: columns
-      };
-      let columnIndex2 = 0;
-      while (cursor && cursor.children) {
-        const options = cursor.children;
-        const value = defaultValues[columnIndex2];
-        let index = options.findIndex(
-          (columnItem) => columnItem.value === value
-        );
-        if (index === -1)
-          index = 0;
-        cursor = cursor.children[index];
-        columnIndex2++;
-        formatted.push(options);
+    const [currentValue2, setCurrentValue] = React.useState([]);
+    const [pickingStatus, setPickingStatus] = React.useState(false);
+    const defaultValuesConvert = () => {
+      const defaultIndexs = [];
+      if (chooseValueData.length > 0) {
+        chooseValueData.forEach((value, index) => {
+          for (let i = 0; i < columnsList[index].length; i++) {
+            if (columnsList[index][i].value === value) {
+              defaultIndexs.push(i);
+              break;
+            }
+          }
+        });
+      } else if (columnsList && columnsList.length > 0) {
+        columnsList.forEach((item) => {
+          defaultIndexs.push(0);
+          item.length > 0 && chooseValueData.push(item[0].value);
+        });
       }
-      return formatted;
+      return defaultIndexs;
     };
-    const init = () => {
-      const data = [];
-      const normalData = normalListData();
-      setColumnsList(normalData);
-      normalData.length > 0 && normalData.map((item) => {
-        item[0] && data.push(item[0].value);
-        return item;
-      });
-      if (!defaultValueData && chooseValueData.length === 0) {
-        setchooseValueData([...data]);
-      }
+    const pickerStart = () => {
+      setPickingStatus(true);
     };
-    const renderToolbar = () => {
-      return /* @__PURE__ */ React.createElement("div", { className: b2("control") }, /* @__PURE__ */ React.createElement("span", { className: b2("cancel-btn"), onClick: () => closeActionSheet() }, locale.cancel), /* @__PURE__ */ React.createElement("div", { className: b2("title") }, title || ""), /* @__PURE__ */ React.createElement("span", { className: b2("confirm-btn"), onClick: confirm }, locale.confirm));
+    const pickerEnd = () => {
+      setPickingStatus(false);
+    };
+    const pickerChange = (data) => {
+      const prevDefaultValue = currentValue2;
+      let changeIndex = 0;
+      console.log("chage", data);
+      const list = data.detail.value;
+      for (let i = 0, len = list.length; i < len; i++) {
+        if (prevDefaultValue[i] !== list[i]) {
+          changeIndex = i;
+          break;
+        }
+      }
+      chooseItem(
+        columnsList[changeIndex][data.detail.value[changeIndex]],
+        changeIndex
+      );
     };
     return /* @__PURE__ */ React.createElement(
       Popup,
@@ -7155,7 +7204,7 @@ var __publicField = (obj, key, value) => {
           catchMove: true
         },
         renderToolbar(),
-        /* @__PURE__ */ React.createElement("div", { className: b2("panel"), ref: pickerRef }, columnsList == null ? void 0 : columnsList.map((item, index) => {
+        /* @__PURE__ */ React.createElement("div", { className: b2("panel"), ref: pickerRef }, Taro.getEnv() === "WEB" ? columnsList == null ? void 0 : columnsList.map((item, index) => {
           return /* @__PURE__ */ React.createElement(
             PickerSlot$1,
             {
@@ -7170,7 +7219,30 @@ var __publicField = (obj, key, value) => {
               itemShow: isVisible
             }
           );
-        }))
+        }) : /* @__PURE__ */ React.createElement(
+          components.PickerView,
+          {
+            ref: pickerRef,
+            value: currentValue2,
+            immediateChange: true,
+            onPickStart: pickerStart,
+            onChange: pickerChange,
+            onPickEnd: pickerEnd,
+            className: "picker-view-panel"
+          },
+          columnsList == null ? void 0 : columnsList.map((column, index) => {
+            return /* @__PURE__ */ React.createElement(components.PickerViewColumn, { key: `col${index}` }, column.map((item, index2) => {
+              return /* @__PURE__ */ React.createElement(
+                components.View,
+                {
+                  key: item.value || index2,
+                  className: "nut-picker-roller-item-title"
+                },
+                /* @__PURE__ */ React.createElement(React.Fragment, null, item.text || item)
+              );
+            }));
+          })
+        ))
       )
     );
   };
@@ -7188,7 +7260,7 @@ var __publicField = (obj, key, value) => {
   const useConfig = () => {
     return React.useContext(ConfigContext) ?? getDefaultConfig();
   };
-  const currentYear = (/* @__PURE__ */ new Date()).getFullYear();
+  const currentYear = new Date().getFullYear();
   const defaultProps$_ = {
     modelValue: null,
     visible: false,
@@ -7475,11 +7547,12 @@ var __publicField = (obj, key, value) => {
       }
     }, [currentDate]);
     return /* @__PURE__ */ React.createElement(
-      "div",
+      components.View,
       {
         className: `nut-datepicker ${className || ""}`,
         style,
-        ...rest
+        ...rest,
+        catchMove: true
       },
       listData.length > 0 && /* @__PURE__ */ React.createElement(
         Picker$1,
@@ -7969,7 +8042,7 @@ var __publicField = (obj, key, value) => {
       if (maxlength && val.length > Number(maxlength)) {
         val = val.slice(0, Number(maxlength));
       }
-      updateValue(getModelValue(), "onBlur");
+      updateValue(val, "onBlur");
       onBlur && onBlur(val, event);
     };
     const handleClickInput = (event) => {
@@ -9979,6 +10052,7 @@ var __publicField = (obj, key, value) => {
           onCompositionEnd: (e) => endComposing(),
           onCompositionStart: (e) => startComposing(),
           rows,
+          maxLength: maxlength < 0 ? 0 : maxlength,
           placeholder: placeholder || locale.placeholder
         }
       ),
@@ -10277,7 +10351,7 @@ var __publicField = (obj, key, value) => {
     constructor() {
       __publicField(this, "status", "ready");
       __publicField(this, "message", "准备中..");
-      __publicField(this, "uid", (/* @__PURE__ */ new Date()).getTime().toString());
+      __publicField(this, "uid", new Date().getTime().toString());
       __publicField(this, "name");
       __publicField(this, "url");
       __publicField(this, "type");
@@ -18356,7 +18430,7 @@ This message will only show in development mode. It won't appear in production.
       const touches = event.touches;
       const events = touches[0];
       const events2 = touches[1];
-      const curTouchTime = (/* @__PURE__ */ new Date()).getTime();
+      const curTouchTime = new Date().getTime();
       if (curTouchTime - lastTouchEndTime < 300) {
         const store12 = store;
         if (store12.scale > 1) {
@@ -18410,7 +18484,7 @@ This message will only show in development mode. It won't appear in production.
       }
     };
     const onTouchEnd = () => {
-      setLastTouchEndTime((/* @__PURE__ */ new Date()).getTime());
+      setLastTouchEndTime(new Date().getTime());
       const store1 = store;
       store1.moveable = false;
       if (store1.scale < 1.1 && store1.scale > 1 || store1.scale < 1) {
@@ -20845,7 +20919,7 @@ This message will only show in development mode. It won't appear in production.
     const barrageListSet = React.useRef(barrageList);
     const barrageBody = React.useRef(null);
     const barrageContainer = React.useRef(null);
-    const timeId = React.useRef((/* @__PURE__ */ new Date()).getTime());
+    const timeId = React.useRef(new Date().getTime());
     const timer = React.useRef(0);
     React.useRef(0);
     const b2 = cn("barrage");