@nutui/nutui-react 2.0.0-alpha.5 → 2.0.0-alpha.7

package/dist/nutui.react.umd.js

@@ -9,7 +9,7 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 /*!
-* @nutui/nutui-react v2.0.0-alpha.5 Wed May 10 2023 14:17:23 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.0.0-alpha.7 Fri May 12 2023 15:35:24 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */
@@ -3251,7 +3251,7 @@ Check the top-level render call using <` + t + ">.");
     style: {}
   };
   const prefixCls = "nut-button";
-  const defaultProps$1r = {
+  const defaultProps$1s = {
     ...ComponentDefaults,
     color: "",
     type: "default",
@@ -3283,7 +3283,7 @@ Check the top-level render call using <` + t + ">.");
         style,
         ...rest
       } = {
-        ...defaultProps$1r,
+        ...defaultProps$1s,
         ...props
       };
       const getStyle = React.useCallback(() => {
@@ -3340,7 +3340,7 @@ Check the top-level render call using <` + t + ">.");
     }
   );
   Button.displayName = "NutButton";
-  const defaultProps$1q = {
+  const defaultProps$1r = {
     ...ComponentDefaults,
     title: null,
     description: null,
@@ -3364,7 +3364,7 @@ Check the top-level render call using <` + t + ">.");
       style,
       ...rest
     } = {
-      ...defaultProps$1q,
+      ...defaultProps$1r,
       ...props
     };
     const handleClick2 = (event) => {
@@ -3403,9 +3403,9 @@ Check the top-level render call using <` + t + ">.");
       }
     );
   };
-  Cell.defaultProps = defaultProps$1q;
+  Cell.defaultProps = defaultProps$1r;
   Cell.displayName = "NutCell";
-  const defaultProps$1p = {
+  const defaultProps$1q = {
     ...ComponentDefaults,
     title: "",
     description: "",
@@ -3414,7 +3414,7 @@ Check the top-level render call using <` + t + ">.");
   const classPrefix$f = "nut-cell-group";
   const CellGroup = (props) => {
     const { children, className, style, title, description, divider, ...rest } = {
-      ...defaultProps$1p,
+      ...defaultProps$1q,
       ...props
     };
     return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: classNames(classPrefix$f, className), ...rest, children: [
@@ -3429,7 +3429,7 @@ Check the top-level render call using <` + t + ">.");
       )
     ] });
   };
-  CellGroup.defaultProps = defaultProps$1p;
+  CellGroup.defaultProps = defaultProps$1q;
   CellGroup.displayName = "NutCellGroup";
   var INFINITY = 1 / 0;
   var symbolTag = "[object Symbol]";
@@ -3844,7 +3844,7 @@ Check the top-level render call using <` + t + ">.");
       errorCanvasTips: "当前环境不支持Canvas"
     }
   };
-  const defaultProps$1o = {
+  const defaultProps$1p = {
     locale: zhCN
   };
   const defaultConfigRef = {
@@ -3867,7 +3867,7 @@ Check the top-level render call using <` + t + ">.");
     return cssVars;
   }
   const ConfigProvider = (props) => {
-    const { children, ...config2 } = { ...defaultProps$1o, ...props };
+    const { children, ...config2 } = { ...defaultProps$1p, ...props };
     const parentConfig = useConfig();
     const theme = config2.theme || {};
     const style = React.useMemo(
@@ -3885,12 +3885,12 @@ Check the top-level render call using <` + t + ">.");
       }
     );
   };
-  ConfigProvider.defaultProps = defaultProps$1o;
+  ConfigProvider.defaultProps = defaultProps$1p;
   ConfigProvider.displayName = "NutConfigProvider";
   const pxCheck = (value) => {
     return Number.isNaN(Number(value)) ? String(value) : `${value}px`;
   };
-  const defaultProps$1n = {
+  const defaultProps$1o = {
     ...ComponentDefaults,
     fit: "fill",
     position: "center",
@@ -3919,21 +3919,19 @@ Check the top-level render call using <` + t + ">.");
       onClick,
       onLoad,
       onError
-    } = { ...defaultProps$1n, ...props };
+    } = { ...defaultProps$1o, ...props };
     const [innerLoading, setInnerLoading] = React.useState(true);
     const [isError, setIsError] = React.useState(false);
-    const [_src, setSrc] = React.useState("");
     const imgRef = React.useRef(null);
     React.useEffect(() => {
       if (imgRef.current && imgRef.current.complete && imgRef.current.naturalHeight !== 0) {
         setInnerLoading(false);
       } else if (src) {
-        setSrc(src);
-        setIsError(false);
         setInnerLoading(true);
       }
     }, [src]);
     const handleLoad = () => {
+      setIsError(false);
       setInnerLoading(false);
       onLoad && onLoad();
     };
@@ -4029,7 +4027,7 @@ Check the top-level render call using <` + t + ">.");
               ref: imgRef,
               className: "nut-img lazyload",
               style: imgStyle,
-              "data-src": _src,
+              "data-src": src,
               alt,
               loading: "lazy",
               onLoad: handleLoad,
@@ -4041,7 +4039,7 @@ Check the top-level render call using <` + t + ">.");
               ref: imgRef,
               className: "nut-img",
               style: imgStyle,
-              src: _src,
+              src,
               alt,
               onLoad: handleLoad,
               onError: handleError
@@ -4053,7 +4051,7 @@ Check the top-level render call using <` + t + ">.");
       }
     );
   };
-  Image$1.defaultProps = defaultProps$1n;
+  Image$1.defaultProps = defaultProps$1o;
   Image$1.displayName = "NutImage";
   const defaultOverlayProps = {
     ...ComponentDefaults,
@@ -4138,7 +4136,7 @@ Check the top-level render call using <` + t + ">.");
   Overlay.defaultProps = defaultOverlayProps;
   Overlay.displayName = "NutOverlay";
   const DataContext$2 = React.createContext({});
-  const defaultProps$1m = {
+  const defaultProps$1n = {
     ...ComponentDefaults,
     span: "24",
     offset: "0",
@@ -4146,7 +4144,7 @@ Check the top-level render call using <` + t + ">.");
   };
   const Col = (props) => {
     const { className, style, span, offset, children, onClick } = {
-      ...defaultProps$1m,
+      ...defaultProps$1n,
       ...props
     };
     const [colName, setColName] = React.useState("");
@@ -4178,9 +4176,9 @@ Check the top-level render call using <` + t + ">.");
       }
     );
   };
-  Col.defaultProps = defaultProps$1m;
+  Col.defaultProps = defaultProps$1n;
   Col.displayName = "NutCol";
-  const defaultProps$1l = {
+  const defaultProps$1m = {
     ...ComponentDefaults,
     contentPosition: "center",
     direction: "horizontal"
@@ -4188,7 +4186,7 @@ Check the top-level render call using <` + t + ">.");
   const classPrefix$d = `nut-divider`;
   const Divider = (props) => {
     const { children, contentPosition, style, className, direction, ...rest } = {
-      ...defaultProps$1l,
+      ...defaultProps$1m,
       ...props
     };
     const classes = direction === "horizontal" ? classNames({
@@ -4203,14 +4201,14 @@ Check the top-level render call using <` + t + ">.");
     });
     return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classes} ${className || ""}`, style, ...rest, children });
   };
-  Divider.defaultProps = defaultProps$1l;
+  Divider.defaultProps = defaultProps$1m;
   Divider.displayName = "NutDivider";
   const gridContext = {
     onClick: (item, index) => {
     }
   };
   const GridContext = React.createContext(gridContext);
-  const defaultProps$1k = {
+  const defaultProps$1l = {
     text: "",
     columns: 4,
     gap: 0,
@@ -4236,7 +4234,7 @@ Check the top-level render call using <` + t + ">.");
       onClick,
       ...rest
     } = {
-      ...defaultProps$1k,
+      ...defaultProps$1l,
       ...props
     };
     const classPrefix2 = "nut-grid-item";
@@ -4297,9 +4295,9 @@ Check the top-level render call using <` + t + ">.");
       }
     );
   };
-  GridItem.defaultProps = defaultProps$1k;
+  GridItem.defaultProps = defaultProps$1l;
   GridItem.displayName = "NutGridItem";
-  const defaultProps$1j = {
+  const defaultProps$1k = {
     columns: 4,
     gap: 0,
     center: true,
@@ -4320,7 +4318,7 @@ Check the top-level render call using <` + t + ">.");
       className,
       onClick,
       ...rest
-    } = { ...defaultProps$1j, ...props };
+    } = { ...defaultProps$1k, ...props };
     const childrenDom = React.Children.toArray(children);
     const classPrefix2 = "nut-grid";
     const rootClass = () => {
@@ -4350,18 +4348,18 @@ Check the top-level render call using <` + t + ">.");
       });
     }) }) });
   };
-  Grid.defaultProps = defaultProps$1j;
+  Grid.defaultProps = defaultProps$1k;
   Grid.displayName = "NutGrid";
   Grid.Item = GridItem;
-  const defaultProps$1i = {};
+  const defaultProps$1j = {};
   const Layout = (props) => {
-    ({ ...defaultProps$1i, ...props });
+    ({ ...defaultProps$1j, ...props });
     return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-layout", children: "Layout" });
   };
-  Layout.defaultProps = defaultProps$1i;
+  Layout.defaultProps = defaultProps$1j;
   Layout.displayName = "NutLayout";
   const classPrefix$c = "nut-row";
-  const defaultProps$1h = {
+  const defaultProps$1i = {
     ...ComponentDefaults,
     type: "",
     justify: "start",
@@ -4381,7 +4379,7 @@ Check the top-level render call using <` + t + ">.");
       gutter,
       onClick
     } = {
-      ...defaultProps$1h,
+      ...defaultProps$1i,
       ...props
     };
     const getClass = (prefix2, type22) => {
@@ -4413,7 +4411,7 @@ Check the top-level render call using <` + t + ">.");
       children
     ) });
   };
-  Row.defaultProps = defaultProps$1h;
+  Row.defaultProps = defaultProps$1i;
   Row.displayName = "NutRow";
   const canUseDom = !!(typeof window !== "undefined" && typeof document !== "undefined" && window.document && window.document.createElement);
   const defaultRoot = canUseDom ? window : void 0;
@@ -4488,7 +4486,7 @@ Check the top-level render call using <` + t + ">.");
       stop2.current = true;
     };
   }
-  const defaultProps$1g = {
+  const defaultProps$1h = {
     ...ComponentDefaults,
     position: "top",
     threshold: 0,
@@ -4506,7 +4504,7 @@ Check the top-level render call using <` + t + ">.");
       threshold,
       onChange,
       ...rest
-    } = { ...defaultProps$1g, ...props };
+    } = { ...defaultProps$1h, ...props };
     const stickyRef = React.useRef(null);
     const rootRef = React.useRef(null);
     const [isFixed, setIsFixed] = React.useState(false);
@@ -4622,9 +4620,9 @@ Check the top-level render call using <` + t + ">.");
       }
     );
   };
-  Sticky.defaultProps = defaultProps$1g;
+  Sticky.defaultProps = defaultProps$1h;
   Sticky.displayName = "NutSticky";
-  const defaultProps$1f = {
+  const defaultProps$1g = {
     ...ComponentDefaults,
     target: "",
     threshold: 200,
@@ -4642,7 +4640,7 @@ Check the top-level render call using <` + t + ">.");
       style,
       onClick
     } = {
-      ...defaultProps$1f,
+      ...defaultProps$1g,
       ...props
     };
     const classPrefix2 = "nut-backtop";
@@ -4740,7 +4738,7 @@ Check the top-level render call using <` + t + ">.");
       }
     );
   };
-  BackTop.defaultProps = defaultProps$1f;
+  BackTop.defaultProps = defaultProps$1g;
   BackTop.displayName = "NutBackTop";
   function clamp$1(v, min, max) {
     return Math.max(min, Math.min(v, max));
@@ -9858,7 +9856,7 @@ Please add \`${key}Action\` when creating your handler.`);
   });
   const animated = host.animated;
   const elevatorContext = React.createContext({});
-  const defaultProps$1e = {
+  const defaultProps$1f = {
     ...ComponentDefaults,
     height: "200px",
     floorKey: "title",
@@ -9882,7 +9880,7 @@ Please add \`${key}Action\` when creating your handler.`);
       children,
       ...rest
     } = {
-      ...defaultProps$1e,
+      ...defaultProps$1f,
       ...props
     };
     const classPrefix2 = "nut-elevator";
@@ -10065,10 +10063,10 @@ Please add \`${key}Action\` when creating your handler.`);
       ) })
     ] });
   };
-  Elevator.defaultProps = defaultProps$1e;
+  Elevator.defaultProps = defaultProps$1f;
   Elevator.displayName = "NutElevator";
   Elevator.Context = elevatorContext;
-  const defaultProps$1d = {
+  const defaultProps$1e = {
     ...ComponentDefaults,
     activeText: "",
     inactiveText: "",
@@ -10096,7 +10094,7 @@ Please add \`${key}Action\` when creating your handler.`);
       content,
       ...rest
     } = {
-      ...defaultProps$1d,
+      ...defaultProps$1e,
       ...props
     };
     const classPrefix2 = "nut-fixednav";
@@ -10155,9 +10153,9 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     );
   };
-  FixedNav.defaultProps = defaultProps$1d;
+  FixedNav.defaultProps = defaultProps$1e;
   FixedNav.displayName = "NutFixedNav";
-  const defaultProps$1c = {
+  const defaultProps$1d = {
     ...ComponentDefaults,
     left: "",
     right: "",
@@ -10180,7 +10178,7 @@ Please add \`${key}Action\` when creating your handler.`);
       zIndex,
       onClickBack
     } = {
-      ...defaultProps$1c,
+      ...defaultProps$1d,
       ...props
     };
     const classPrefix2 = "nut-navbar";
@@ -10224,7 +10222,7 @@ Please add \`${key}Action\` when creating your handler.`);
     const cls = classNames(classPrefix2, classes, className);
     return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: fixed && placeholder ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix2}--placeholder`, children: renderWrapper() }) : renderWrapper() });
   };
-  NavBar.defaultProps = defaultProps$1c;
+  NavBar.defaultProps = defaultProps$1d;
   NavBar.displayName = "NutNavBar";
   function _extends$1() {
     _extends$1 = Object.assign ? Object.assign.bind() : function(target) {
@@ -11967,7 +11965,7 @@ Please add \`${key}Action\` when creating your handler.`);
     onExited: propTypesExports.func
   }) : {};
   const CSSTransition$1 = CSSTransition;
-  const defaultProps$1b = {
+  const defaultProps$1c = {
     ...ComponentDefaults,
     position: "center",
     transition: "",
@@ -12146,7 +12144,7 @@ Please add \`${key}Action\` when creating your handler.`);
     }, [position, transition]);
     return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: renderToContainer(portal, renderNode()) });
   };
-  Popup.defaultProps = defaultProps$1b;
+  Popup.defaultProps = defaultProps$1c;
   Popup.displayName = "NutPopup";
   const handleClick = (e) => {
     e.stopPropagation();
@@ -12162,7 +12160,7 @@ Please add \`${key}Action\` when creating your handler.`);
     }
   };
   const OffsetContext = React.createContext(20);
-  const defaultProps$1a = {
+  const defaultProps$1b = {
     showhead: false,
     position: "left",
     width: "80%"
@@ -12179,7 +12177,7 @@ Please add \`${key}Action\` when creating your handler.`);
       onClose,
       ...rest
     } = {
-      ...defaultProps$1a,
+      ...defaultProps$1b,
       ...props
     };
     const offset = props.offset ? Number(props.offset) : 20;
@@ -12215,7 +12213,7 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     );
   };
-  SideNavBar.defaultProps = defaultProps$1a;
+  SideNavBar.defaultProps = defaultProps$1b;
   SideNavBar.displayName = "NutSideNavBar";
   const SideNavBarItem = (props) => {
     const { title, key, children, onClick, ...rest } = props;
@@ -12233,12 +12231,12 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     );
   };
-  const defaultProps$19 = {
+  const defaultProps$1a = {
     open: true
   };
   const SubSideNavBar = (props) => {
     const { title, key, children, onClick, open, ...rest } = {
-      ...defaultProps$19,
+      ...defaultProps$1a,
       ...props
     };
     const offset = React.useContext(OffsetContext);
@@ -12312,7 +12310,7 @@ Please add \`${key}Action\` when creating your handler.`);
     }
     return [uncontrolled, handleUncontrolledChange];
   }
-  const defaultProps$18 = {
+  const defaultProps$19 = {
     ...ComponentDefaults,
     value: "",
     dot: false,
@@ -12323,7 +12321,7 @@ Please add \`${key}Action\` when creating your handler.`);
   };
   const Badge = (props) => {
     const { className, style, value, max, children, dot, top, right, color } = {
-      ...defaultProps$18,
+      ...defaultProps$19,
       ...props
     };
     const classPrefix2 = "nut-badge";
@@ -12354,9 +12352,9 @@ Please add \`${key}Action\` when creating your handler.`);
       /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: contentClasses, style: getStyle(), children: content() })
     ] });
   };
-  Badge.defaultProps = defaultProps$18;
+  Badge.defaultProps = defaultProps$19;
   Badge.displayName = "NutBadge";
-  const defaultProps$17 = {
+  const defaultProps$18 = {
     ...ComponentDefaults,
     title: "",
     icon: null,
@@ -12378,7 +12376,7 @@ Please add \`${key}Action\` when creating your handler.`);
       handleClick: handleClick2,
       ...rest
     } = {
-      ...defaultProps$17,
+      ...defaultProps$18,
       ...props
     };
     const classPrefix2 = "nut-tabbar-item";
@@ -12405,7 +12403,7 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     );
   };
-  const defaultProps$16 = {
+  const defaultProps$17 = {
     ...ComponentDefaults,
     defaultValue: 0,
     fixed: false,
@@ -12428,7 +12426,7 @@ Please add \`${key}Action\` when creating your handler.`);
       style,
       onSwitch
     } = {
-      ...defaultProps$16,
+      ...defaultProps$17,
       ...props
     };
     const classPrefix2 = "nut-tabbar";
@@ -12465,17 +12463,17 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     );
   };
-  Tabbar.defaultProps = defaultProps$16;
+  Tabbar.defaultProps = defaultProps$17;
   Tabbar.displayName = "NutTabbar";
   Tabbar.Item = TabbarItem;
-  const defaultProps$15 = {
+  const defaultProps$16 = {
     title: "",
     value: "",
     disabled: false
   };
   const TabPane = (props) => {
     const { children, autoHeightClassName, className, disabled } = {
-      ...defaultProps$15,
+      ...defaultProps$16,
       ...props
     };
     const classPrefix2 = "nut-tabpane";
@@ -12502,7 +12500,7 @@ Please add \`${key}Action\` when creating your handler.`);
     }
   }
   const requestAniFrame$1 = requestAniFrame();
-  const defaultProps$14 = {
+  const defaultProps$15 = {
     ...ComponentDefaults,
     tabStyle: {},
     activeColor: "",
@@ -12528,7 +12526,7 @@ Please add \`${key}Action\` when creating your handler.`);
       autoHeight,
       ...rest
     } = {
-      ...defaultProps$14,
+      ...defaultProps$15,
       ...props
     };
     const [value, setValue] = usePropsValue({
@@ -12589,6 +12587,18 @@ Please add \`${key}Action\` when creating your handler.`);
       return titles2;
     };
     const titles = React.useRef(getTitles());
+    React.useEffect(() => {
+      titles.current = getTitles();
+      let current = "";
+      titles.current.forEach((title2) => {
+        if (title2.value === value) {
+          current = value;
+        }
+      });
+      if (current !== "") {
+        setValue(current);
+      }
+    }, [children]);
     const classes = classNames(
       classPrefix$a,
       `${classPrefix$a}--${direction}`,
@@ -12683,7 +12693,7 @@ Please add \`${key}Action\` when creating your handler.`);
       }) }) })
     ] });
   };
-  Tabs.defaultProps = defaultProps$14;
+  Tabs.defaultProps = defaultProps$15;
   Tabs.displayName = "NutTabs";
   Tabs.TabPane = TabPane;
   var classnameExports = {};
@@ -12806,7 +12816,7 @@ Please add \`${key}Action\` when creating your handler.`);
     }
   })(classname);
   const cn = classnameExports.withNaming({ n: "nut-", e: "__", m: "--", v: "-" });
-  const defaultProps$13 = {
+  const defaultProps$14 = {
     type: "custom",
     existAddress: [],
     defaultIcon: null,
@@ -12828,7 +12838,7 @@ Please add \`${key}Action\` when creating your handler.`);
       onClose,
       onSwitchModule,
       ...rest
-    } = { ...defaultProps$13, ...props };
+    } = { ...defaultProps$14, ...props };
     const b = cn("address");
     const selectedExist = (item) => {
       const copyExistAdd = existAddress;
@@ -12870,7 +12880,7 @@ Please add \`${key}Action\` when creating your handler.`);
       isShowCustomAddress && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: b("choose-other"), onClick: onSwitch, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: b("choose-other-btn"), children: customAndExistTitle || locale.address.chooseAnotherAddress }) })
     ] });
   };
-  const defaultProps$12 = {
+  const defaultProps$13 = {
     modelValue: [],
     type: "custom",
     province: [],
@@ -12895,7 +12905,7 @@ Please add \`${key}Action\` when creating your handler.`);
       onClose,
       ...rest
     } = {
-      ...defaultProps$12,
+      ...defaultProps$13,
       ...props
     };
     const b = cn("address");
@@ -13064,28 +13074,28 @@ Please add \`${key}Action\` when creating your handler.`);
       nextAreaList(item);
     };
     React.useEffect(() => {
-      const { province: province2 } = { ...defaultProps$12, ...props };
+      const { province: province2 } = { ...defaultProps$13, ...props };
       setRegionList({
         ...regionList,
         province: isCustom2() ? transformData(province2) : province2
       });
     }, [province]);
     React.useEffect(() => {
-      const { city: city2 } = { ...defaultProps$12, ...props };
+      const { city: city2 } = { ...defaultProps$13, ...props };
       setRegionList({
         ...regionList,
         city: isCustom2() ? transformData(city2) : city2
       });
     }, [city]);
     React.useEffect(() => {
-      const { country: country2 } = { ...defaultProps$12, ...props };
+      const { country: country2 } = { ...defaultProps$13, ...props };
       setRegionList({
         ...regionList,
         country: isCustom2() ? transformData(country2) : country2
       });
     }, [country]);
     React.useEffect(() => {
-      const { town: town2 } = { ...defaultProps$12, ...props };
+      const { town: town2 } = { ...defaultProps$13, ...props };
       setRegionList({
         ...regionList,
         town: isCustom2() ? transformData(town2) : town2
@@ -13160,7 +13170,7 @@ Please add \`${key}Action\` when creating your handler.`);
       ) })
     ] });
   };
-  const defaultProps$11 = {
+  const defaultProps$12 = {
     ...ComponentDefaults,
     modelValue: false,
     modelSelect: [],
@@ -13211,7 +13221,7 @@ Please add \`${key}Action\` when creating your handler.`);
       className,
       ...rest
     } = {
-      ...defaultProps$11,
+      ...defaultProps$12,
       ...props
     };
     const b = cn("address");
@@ -13369,7 +13379,7 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     ) });
   };
-  Address.defaultProps = defaultProps$11;
+  Address.defaultProps = defaultProps$12;
   Address.displayName = "NutAddress";
   const Utils = {
     /**
@@ -13489,7 +13499,7 @@ Please add \`${key}Action\` when creating your handler.`);
       return false;
     }
   };
-  const defaultProps$10 = {
+  const defaultProps$11 = {
     type: "one",
     isAutoBackFill: false,
     poppable: true,
@@ -13541,7 +13551,7 @@ Please add \`${key}Action\` when creating your handler.`);
       onUpdate,
       onSelected,
       onYearMonthChange
-    } = { ...defaultProps$10, ...props };
+    } = { ...defaultProps$11, ...props };
     const weeks = locale.calendaritem.weekdays;
     const [yearMonthTitle, setYearMonthTitle] = React.useState("");
     const [monthsData, setMonthsData] = React.useState([]);
@@ -14137,9 +14147,9 @@ Please add \`${key}Action\` when creating your handler.`);
       poppable && !isAutoBackFill ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-calendar-footer", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "calendar-confirm-btn", onClick: confirm2, children: confirmText || locale.confirm }) }) : ""
     ] }) });
   });
-  CalendarItem.defaultProps = defaultProps$10;
+  CalendarItem.defaultProps = defaultProps$11;
   CalendarItem.displayName = "NutCalendarItem";
-  const defaultProps$$ = {
+  const defaultProps$10 = {
     type: "one",
     isAutoBackFill: false,
     poppable: true,
@@ -14194,7 +14204,7 @@ Please add \`${key}Action\` when creating your handler.`);
       onChoose,
       onSelected,
       onYearMonthChange
-    } = { ...defaultProps$$, ...props };
+    } = { ...defaultProps$10, ...props };
     const calendarRef = React.useRef(null);
     const close = () => {
       onClose && onClose();
@@ -14264,9 +14274,9 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     ) : renderItem() });
   });
-  Calendar.defaultProps = defaultProps$$;
+  Calendar.defaultProps = defaultProps$10;
   Calendar.displayName = "NutCalendar";
-  const defaultProps$_ = {
+  const defaultProps$$ = {
     data: {
       text: "",
       value: "",
@@ -14277,32 +14287,37 @@ Please add \`${key}Action\` when creating your handler.`);
     },
     activeColor: "",
     checked: false,
-    checkedIcon: "checklist",
+    activeIcon: "checklist",
     chooseItem: () => {
     }
   };
   const InternalCascaderItem = (props, ref) => {
-    const { data, checked, checkedIcon, chooseItem, activeColor } = {
-      ...defaultProps$_,
+    const { data, checked, activeIcon, chooseItem, activeColor } = {
+      ...defaultProps$$,
       ...props
     };
-    const b = cn("cascader-item");
+    const classPrefix2 = "nut-cascader-item";
     const classes = classNames(
       {
         active: checked,
         disabled: data.disabled
       },
-      b("")
+      classPrefix2
     );
     const classesTitle = classNames({
-      [`${b("")}__title`]: true
+      [`${classPrefix2}__title`]: true
     });
     const renderIcon = () => {
       if (checked) {
-        if (React.isValidElement(checkedIcon)) {
-          return checkedIcon;
+        if (React.isValidElement(activeIcon)) {
+          return activeIcon;
         }
-        return /* @__PURE__ */ jsxRuntimeExports.jsx(x$c, { className: `${checked ? b("icon-check") : ""}` });
+        return /* @__PURE__ */ jsxRuntimeExports.jsx(
+          x$c,
+          {
+            className: `${checked ? `${classPrefix2}__icon-check` : ""}`
+          }
+        );
       }
       return null;
     };
@@ -14322,7 +14337,7 @@ Please add \`${key}Action\` when creating your handler.`);
     );
   };
   const CascaderItem = React.forwardRef(InternalCascaderItem);
-  CascaderItem.defaultProps = defaultProps$_;
+  CascaderItem.defaultProps = defaultProps$$;
   CascaderItem.displayName = "NutCascaderItem";
   const formatTree = (tree, parent, config2) => tree.map((node) => {
     const {
@@ -14460,26 +14475,22 @@ Please add \`${key}Action\` when creating your handler.`);
     }
   }
   const Tree$1 = Tree;
-  const defaultProps$Z = {
-    className: "",
-    style: {},
+  const defaultProps$_ = {
+    ...ComponentDefaults,
     activeColor: "",
-    checkedIcon: "checklist",
-    tabsColor: "",
-    poppable: true,
+    activeIcon: "checklist",
+    popup: true,
     visible: false,
     options: [],
     value: [],
     title: "",
-    textKey: "text",
-    valueKey: "value",
-    childrenKey: "children",
-    convertConfig: {},
+    optionKey: { textKey: "text", valueKey: "value", childrenKey: "children" },
+    format: {},
     closeable: false,
     closeIconPosition: "top-right",
     closeIcon: "close",
     lazy: false,
-    lazyLoad: () => {
+    onLoad: () => {
     },
     onClose: () => {
     },
@@ -14493,28 +14504,25 @@ Please add \`${key}Action\` when creating your handler.`);
     const {
       className,
       style,
-      tabsColor,
-      poppable,
+      popup,
       visible,
       options: options2,
       value,
       title,
-      textKey,
-      valueKey,
-      childrenKey,
-      convertConfig: convertConfig2,
+      optionKey: optionKey2,
+      format: format2,
       closeable,
       closeIconPosition,
       closeIcon,
       lazy,
-      lazyLoad,
+      onLoad,
       onClose,
       onChange,
       onPathChange
-    } = { ...defaultProps$Z, ...props };
+    } = { ...defaultProps$_, ...props };
     const [tabvalue, setTabvalue] = React.useState("c1");
     const [optionsData, setOptionsData] = React.useState([]);
-    const isLazy = () => state.configs.lazy && Boolean(state.configs.lazyLoad);
+    const isLazy = () => state.configs.lazy && Boolean(state.configs.onLoad);
     const [state] = React.useState({
       optionsData: [],
       panes: [
@@ -14532,44 +14540,38 @@ Please add \`${key}Action\` when creating your handler.`);
       currentProcessNode: [],
       configs: {
         lazy,
-        lazyLoad,
-        valueKey,
-        textKey,
-        childrenKey,
-        convertConfig: convertConfig2
+        onLoad,
+        optionKey: optionKey2,
+        format: format2
       },
       lazyLoadMap: /* @__PURE__ */ new Map()
     });
-    const b = cn("cascader");
-    const classes = classNames(b(""));
+    const classPrefix2 = classNames(`nut-cascader`);
     const classesPane = classNames({
-      [`${b("")}-pane`]: true
+      [`${classPrefix2}-pane`]: true
     });
     React.useEffect(() => {
       initData();
-    }, []);
+    }, [options2]);
     React.useEffect(() => {
       if (value !== state.innerValue) {
         state.innerValue = value;
       }
     }, [value]);
-    React.useEffect(() => {
-      initData();
-    }, [options2]);
     const initData = async () => {
       state.lazyLoadMap.clear();
-      if (convertConfig2 && Object.keys(convertConfig2).length > 0) {
+      if (format2 && Object.keys(format2).length > 0) {
         state.optionsData = convertListToOptions(
           options2,
-          convertConfig2
+          format2
         );
       } else {
         state.optionsData = options2;
       }
       state.tree = new Tree$1(state.optionsData, {
-        value: state.configs.valueKey,
-        text: state.configs.textKey,
-        children: state.configs.childrenKey
+        value: state.configs.optionKey.valueKey,
+        text: state.configs.optionKey.textKey,
+        children: state.configs.optionKey.childrenKey
       });
       if (isLazy() && !state.tree.nodes.length) {
         await invokeLazyLoad({
@@ -14635,7 +14637,7 @@ Please add \`${key}Action\` when creating your handler.`);
       if (!node) {
         return;
       }
-      if (!state.configs.lazyLoad) {
+      if (!state.configs.onLoad) {
         node.leaf = true;
         return;
       }
@@ -14648,7 +14650,7 @@ Please add \`${key}Action\` when creating your handler.`);
       if (!lazyLoadPromise) {
         lazyLoadPromise = new Promise((resolve) => {
           var _a2, _b;
-          (_b = (_a2 = state.configs).lazyLoad) == null ? void 0 : _b.call(_a2, node, resolve);
+          (_b = (_a2 = state.configs).onLoad) == null ? void 0 : _b.call(_a2, node, resolve);
         });
         state.lazyLoadMap.set(node, lazyLoadPromise);
       }
@@ -14695,8 +14697,8 @@ Please add \`${key}Action\` when creating your handler.`);
           selectedNode: null,
           paneKey: `c${state.tabsCursor + 1}`
         });
-        setTabvalue(`c${state.tabsCursor + 1}`);
         setOptionsData(state.panes);
+        setTabvalue(`c${state.tabsCursor + 1}`);
         if (!type2) {
           const pathNodes = state.panes.map((item) => item.selectedNode);
           const optionParams = pathNodes.map((item) => item == null ? void 0 : item.value);
@@ -14716,8 +14718,8 @@ Please add \`${key}Action\` when creating your handler.`);
       setOptionsData(state.panes);
     };
     const renderItem = () => {
-      return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `${classes} ${className}`, style, children: [
-        poppable && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: b("title"), children: title }),
+      return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `${classPrefix2} ${className}`, style, children: [
+        popup && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-cascader__title", children: title }),
         /* @__PURE__ */ jsxRuntimeExports.jsx(
           Tabs,
           {
@@ -14732,27 +14734,21 @@ Please add \`${key}Action\` when creating your handler.`);
                       setTabvalue(pane.paneKey);
                       state.tabsCursor = index;
                     },
-                    className: `nut-tabs__titles-item ${tabvalue === pane.paneKey ? "active" : ""}`,
+                    className: `nut-tabs__titles-item ${tabvalue === pane.paneKey ? "nut-tabs__titles-item--active" : ""}`,
                     children: [
                       /* @__PURE__ */ jsxRuntimeExports.jsxs("span", { className: "nut-tabs__titles-item__text", children: [
                         !state.initLoading && state.panes.length && ((_a2 = pane == null ? void 0 : pane.selectedNode) == null ? void 0 : _a2.text),
                         !state.initLoading && state.panes.length && !((_b = pane == null ? void 0 : pane.selectedNode) == null ? void 0 : _b.text) && "请选择",
                         !(!state.initLoading && state.panes.length) && "Loading..."
                       ] }),
-                      /* @__PURE__ */ jsxRuntimeExports.jsx(
-                        "span",
-                        {
-                          className: "nut-tabs__titles-item__line",
-                          style: { background: tabsColor }
-                        }
-                      )
+                      /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "nut-tabs__titles-item__line" })
                     ]
                   },
                   pane.paneKey
                 );
               });
             },
-            children: !state.initLoading && state.panes.length ? optionsData.map((pane) => /* @__PURE__ */ jsxRuntimeExports.jsx(TabPane, { value: pane.paneKey, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: classesPane, children: pane.nodes && pane.nodes.map((node, index) => {
+            children: !state.initLoading && state.panes.length ? optionsData.map((pane) => /* @__PURE__ */ jsxRuntimeExports.jsx(Tabs.TabPane, { value: pane.paneKey, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: classesPane, children: pane.nodes && pane.nodes.map((node, index) => {
               var _a2;
               return /* @__PURE__ */ jsxRuntimeExports.jsx(
                 CascaderItem,
@@ -14764,15 +14760,14 @@ Please add \`${key}Action\` when creating your handler.`);
                 },
                 index
               );
-            }) }) }, pane.paneKey)) : /* @__PURE__ */ jsxRuntimeExports.jsx(TabPane, { children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: classesPane }) })
+            }) }) }, pane.paneKey)) : /* @__PURE__ */ jsxRuntimeExports.jsx(Tabs.TabPane, { children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: classesPane }) })
           }
         )
       ] });
     };
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: poppable ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: popup ? /* @__PURE__ */ jsxRuntimeExports.jsx(
       Popup,
       {
-        className: "cascadar-popup",
         visible,
         position: "bottom",
         round: true,
@@ -14786,11 +14781,11 @@ Please add \`${key}Action\` when creating your handler.`);
     ) : renderItem() });
   };
   const Cascader = React.forwardRef(InternalCascader);
-  Cascader.defaultProps = defaultProps$Z;
+  Cascader.defaultProps = defaultProps$_;
   Cascader.displayName = "NutCascader";
   const CheckboxGroupContext = React.createContext(null);
   const Context = CheckboxGroupContext;
-  const defaultProps$Y = {
+  const defaultProps$Z = {
     max: void 0,
     labelPosition: "right",
     direction: "vertical",
@@ -14801,7 +14796,7 @@ Please add \`${key}Action\` when creating your handler.`);
   const classPrefix$9 = "nut-checkboxgroup";
   const CheckboxGroup = React.forwardRef(
     (props, ref) => {
-      const { children } = { ...defaultProps$Y, ...props };
+      const { children } = { ...defaultProps$Z, ...props };
       const {
         className,
         disabled,
@@ -14891,9 +14886,9 @@ Please add \`${key}Action\` when creating your handler.`);
       );
     }
   );
-  CheckboxGroup.defaultProps = defaultProps$Y;
+  CheckboxGroup.defaultProps = defaultProps$Z;
   CheckboxGroup.displayName = "NutCheckboxGroup";
-  const defaultProps$X = {
+  const defaultProps$Y = {
     ...ComponentDefaults,
     disabled: false,
     labelPosition: "right",
@@ -14906,7 +14901,7 @@ Please add \`${key}Action\` when creating your handler.`);
   const classPrefix$8 = "nut-checkbox";
   const Checkbox = (props) => {
     const { children } = {
-      ...defaultProps$X,
+      ...defaultProps$Y,
       ...props
     };
     const {
@@ -15011,7 +15006,7 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     );
   };
-  Checkbox.defaultProps = defaultProps$X;
+  Checkbox.defaultProps = defaultProps$Y;
   Checkbox.displayName = "NutCheckBox";
   Checkbox.Group = CheckboxGroup;
   const MIN_DISTANCE = 10;
@@ -15079,13 +15074,13 @@ Please add \`${key}Action\` when creating your handler.`);
       isHorizontal
     };
   }
-  const InternalPickerSlot = (props, ref) => {
+  const InternalPickerPanel = (props, ref) => {
     const {
       keyIndex = 0,
       defaultValue,
-      listData = [],
+      options: options2 = [],
       threeDimensional = true,
-      swipeDuration = 1e3,
+      duration = 1e3,
       chooseItem
     } = props;
     const touch = useTouch();
@@ -15099,9 +15094,8 @@ Please add \`${key}Action\` when creating your handler.`);
     const rotation = 20;
     const moving = React.useRef(false);
     let timer;
-    React.useRef(null);
     const rollerRef = React.useRef(null);
-    const pickerSlotRef = React.useRef(null);
+    const PickerPanelRef = React.useRef(null);
     const [startTime, setStartTime] = React.useState(0);
     const [startY, setStartY] = React.useState(0);
     const transformY = React.useRef(0);
@@ -15127,8 +15121,8 @@ Please add \`${key}Action\` when creating your handler.`);
         if (updateMove > 0) {
           updateMove = 0;
         }
-        if (updateMove < -(listData.length - 1) * lineSpacing) {
-          updateMove = -(listData.length - 1) * lineSpacing;
+        if (updateMove < -(options2.length - 1) * lineSpacing) {
+          updateMove = -(options2.length - 1) * lineSpacing;
         }
         const endMove = Math.round(updateMove / lineSpacing) * lineSpacing;
         const deg = `${(Math.abs(Math.round(endMove / lineSpacing)) + 1) * rotation}deg`;
@@ -15137,7 +15131,7 @@ Please add \`${key}Action\` when creating your handler.`);
       } else {
         let deg = 0;
         const currentDeg = (-updateMove / lineSpacing + 1) * rotation;
-        const maxDeg = (listData.length + 1) * rotation;
+        const maxDeg = (options2.length + 1) * rotation;
         const minDeg = 0;
         deg = Math.min(Math.max(currentDeg, minDeg), maxDeg);
         if (minDeg < deg && deg < maxDeg) {
@@ -15147,7 +15141,7 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     };
     const setChooseValue = (move) => {
-      chooseItem && chooseItem(listData == null ? void 0 : listData[Math.round(-move / lineSpacing)], keyIndex);
+      chooseItem && chooseItem(options2 == null ? void 0 : options2[Math.round(-move / lineSpacing)], keyIndex);
     };
     const touchStart = (event) => {
       touch.start(event);
@@ -15171,7 +15165,7 @@ Please add \`${key}Action\` when creating your handler.`);
       const moveTime = Date.now() - startTime;
       if (moveTime <= INERTIA_TIME && Math.abs(move) > INERTIA_DISTANCE) {
         const distance = momentum(move, moveTime);
-        setMove(distance, "end", +swipeDuration);
+        setMove(distance, "end", +duration);
       } else {
         setMove(move, "end");
       }
@@ -15179,9 +15173,9 @@ Please add \`${key}Action\` when creating your handler.`);
         touch.reset();
       }, 0);
     };
-    const momentum = (distance, duration) => {
+    const momentum = (distance, duration2) => {
       let nDistance = distance;
-      const speed = Math.abs(nDistance / duration);
+      const speed = Math.abs(nDistance / duration2);
       nDistance = speed / 3e-3 * (nDistance < 0 ? -1 : 1);
       return nDistance;
     };
@@ -15189,7 +15183,7 @@ Please add \`${key}Action\` when creating your handler.`);
       const value = val || defaultValue;
       let index = -1;
       if (value) {
-        listData.some((item, idx) => {
+        options2.some((item, idx) => {
           if (item.value === value) {
             index = idx;
             return true;
@@ -15197,7 +15191,7 @@ Please add \`${key}Action\` when creating your handler.`);
           return false;
         });
       } else {
-        listData.forEach((item, i) => {
+        options2.forEach((item, i) => {
           if (item.value === defaultValue) {
             index = i;
           }
@@ -15240,7 +15234,7 @@ Please add \`${key}Action\` when creating your handler.`);
       return () => {
         clearTimeout(timer);
       };
-    }, [listData]);
+    }, [options2]);
     React.useImperativeHandle(ref, () => ({
       stopMomentum,
       moving: moving.current
@@ -15249,7 +15243,7 @@ Please add \`${key}Action\` when creating your handler.`);
       "div",
       {
         className: "nut-picker-list",
-        ref: pickerSlotRef,
+        ref: PickerPanelRef,
         onTouchStart: touchStart,
         onTouchMove: touchMove,
         onTouchEnd: touchEnd,
@@ -15262,7 +15256,7 @@ Please add \`${key}Action\` when creating your handler.`);
               style: threeDimensional ? touchRollerStyle() : touchTileStyle(),
               onTransitionEnd: stopMomentum,
               children: [
-                threeDimensional && listData.map((item, index) => {
+                threeDimensional && options2.map((item, index) => {
                   return /* @__PURE__ */ jsxRuntimeExports.jsx(
                     "div",
                     {
@@ -15275,7 +15269,7 @@ Please add \`${key}Action\` when creating your handler.`);
                     item.value ? item.value : index
                   );
                 }),
-                !threeDimensional && listData.map((item, index) => {
+                !threeDimensional && options2.map((item, index) => {
                   return /* @__PURE__ */ jsxRuntimeExports.jsx(
                     "div",
                     {
@@ -15294,8 +15288,8 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     );
   };
-  const PickerSlot = React.forwardRef(InternalPickerSlot);
-  const PickerSlot$1 = PickerSlot;
+  const PickerPanel = React.forwardRef(InternalPickerPanel);
+  const PickerPanel$1 = PickerPanel;
   function useRefs() {
     const refs = React.useRef([]);
     const setRefs = React.useCallback(
@@ -15310,180 +15304,202 @@ Please add \`${key}Action\` when creating your handler.`);
     }, []);
     return [refs.current, setRefs, reset];
   }
+  const defaultProps$X = {
+    ...ComponentDefaults,
+    visible: false,
+    title: "",
+    options: [],
+    value: [],
+    defaultValue: [],
+    threeDimensional: true,
+    duration: 1e3
+  };
   const InternalPicker = (props, ref) => {
     const { locale } = useConfig();
     const {
       visible,
       title,
-      listData = [],
-      defaultValueData,
-      onConfirm,
-      onClose,
-      onCloseUpdate,
-      onChange,
+      options: options2 = [],
+      defaultValue = [],
       className,
       style,
       threeDimensional,
-      swipeDuration,
+      duration,
+      onConfirm,
+      onClose,
+      afterClose,
+      onChange,
       ...rest
-    } = props;
-    const [chooseValueData, setchooseValueData] = React.useState([]);
-    const [columnIndex, setcolumnIndex] = React.useState(0);
+    } = { ...defaultProps$X, ...props };
+    const classPrefix2 = "nut-picker";
+    const classes = classNames(classPrefix2, className);
+    const [selectedValue, setSelectedValue] = usePropsValue({
+      value: props.value,
+      defaultValue: [...defaultValue],
+      finalValue: [...defaultValue],
+      onChange: (val) => {
+        var _a2;
+        (_a2 = props.onConfirm) == null ? void 0 : _a2.call(props, setSelectedOptions(), val);
+      }
+    });
+    const [columnIndex, setColumnIndex] = React.useState(0);
     const pickerRef = React.useRef(null);
     const [refs, setRefs] = useRefs();
     const [columnsList, setColumnsList] = React.useState([]);
-    const b = 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 columnOptions = {
+        text: "",
+        value: "",
+        children: columns
+      };
+      let columnIndex2 = 0;
+      while (columnOptions && columnOptions.children) {
+        const options22 = columnOptions.children;
+        const value = values[columnIndex2];
+        let index = options22.findIndex(
+          (columnItem) => columnItem.value === value
+        );
+        if (index === -1)
+          index = 0;
+        columnOptions = columnOptions.children[index];
+        columnIndex2++;
+        formatted.push(options22);
       }
-    }, [defaultValueData]);
-    React.useEffect(() => {
-      onChange && onChange(columnIndex, chooseValueData, selectedOptions());
-      if (isConfirmEvent.current) {
-        isConfirmEvent.current = false;
-        onConfirm && onConfirm(chooseValueData, selectedOptions());
+      return formatted;
+    };
+    const columnsType = () => {
+      const firstColumn = options2[0];
+      if (firstColumn) {
+        if (Array.isArray(firstColumn)) {
+          return "multiple";
+        }
+        if ("children" in firstColumn) {
+          return "cascade";
+        }
       }
-    }, [chooseValueData]);
-    React.useEffect(() => {
-      init();
-    }, [listData]);
-    const closeActionSheet = () => {
-      onClose && onClose(chooseValueData, selectedOptions());
-      onCloseUpdate && onCloseUpdate(chooseValueData, selectedOptions(), pickerRef);
+      return "single";
     };
-    const confirm2 = () => {
-      let movings = false;
-      refs.forEach((_ref) => {
-        if (_ref.moving)
-          movings = true;
-        _ref.stopMomentum();
+    const normalListData = () => {
+      const type2 = columnsType();
+      switch (type2) {
+        case "multiple":
+          return options2;
+        case "cascade":
+          return formatCascade(options2, selectedValue);
+        default:
+          return [options2];
+      }
+    };
+    const init = () => {
+      const normalData = normalListData();
+      setColumnsList(normalData);
+      const data = [];
+      normalData.length > 0 && normalData.map((item) => {
+        item[0] && data.push(item[0].value);
+        return item;
       });
-      if (movings) {
-        isConfirmEvent.current = true;
-      } else {
-        onConfirm && onConfirm(chooseValueData, selectedOptions());
+      if (!defaultValue.length && selectedValue.length === 0) {
+        setSelectedValue([...data]);
       }
-      onClose && onClose(chooseValueData, selectedOptions());
-      setTimeout(() => {
-        isConfirmEvent.current = false;
-      }, 0);
     };
-    const selectedOptions = () => {
-      const optins = [];
-      columnsList.map((column, index) => {
-        let currOptions = [];
-        currOptions = column.filter(
-          (item) => item.value === chooseValueData[index]
+    React.useEffect(() => {
+      if (!visible) {
+        return;
+      }
+      init();
+    }, [options2, visible]);
+    const setSelectedOptions = () => {
+      const options22 = [];
+      let currOptions = [];
+      columnsList.forEach((columnOptions, index) => {
+        currOptions = columnOptions.filter(
+          (item) => item.value === selectedValue[index]
         );
         if (currOptions[0]) {
-          optins.push(currOptions[0]);
+          options22.push(currOptions[0]);
         } else {
-          column[0] && optins.push(column[0]);
+          columnOptions[0] && options22.push(columnOptions[0]);
         }
-        return column;
       });
-      return optins;
+      return options22;
     };
-    const chooseItem = (option, columnIndex2) => {
-      if (option && Object.keys(option).length) {
-        if (chooseValueData[columnIndex2] !== option.value) {
+    React.useEffect(() => {
+      if (!visible) {
+        return;
+      }
+      onChange && onChange(setSelectedOptions(), selectedValue, columnIndex);
+      if (isConfirmEvent.current) {
+        isConfirmEvent.current = false;
+        onConfirm && onConfirm(setSelectedOptions(), selectedValue);
+      }
+    }, [selectedValue, columnsList, visible]);
+    const chooseItem = (columnOptions, columnIndex2) => {
+      var _a2, _b;
+      if (columnOptions && Object.keys(columnOptions).length) {
+        if (selectedValue[columnIndex2] !== columnOptions.value) {
           if (columnsType() === "cascade") {
-            chooseValueData[columnIndex2] = option.value ? option.value : "";
-            setchooseValueData([...chooseValueData]);
-            let index = columnIndex2;
-            let cursor = option;
-            while (cursor && cursor.children && cursor.children[0]) {
-              chooseValueData[index + 1] = cursor.children[0].value;
-              setchooseValueData([...chooseValueData]);
-              index++;
-              const cc = cursor.children[0];
-              cursor = cc;
+            selectedValue[columnIndex2] = columnOptions.value || "";
+            setSelectedValue([...selectedValue]);
+            while ((_a2 = columnOptions == null ? void 0 : columnOptions.children) == null ? void 0 : _a2[0]) {
+              selectedValue[columnIndex2 + 1] = columnOptions.children[0].value;
+              setSelectedValue([...selectedValue]);
+              columnIndex2++;
+              columnOptions = columnOptions.children[0];
             }
-            if (cursor && cursor.children) {
-              chooseValueData[index + 1] = "";
-              setchooseValueData([...chooseValueData]);
+            if ((_b = columnOptions == null ? void 0 : columnOptions.children) == null ? void 0 : _b.length) {
+              selectedValue[columnIndex2 + 1] = "";
+              setSelectedValue([...selectedValue]);
             }
             setColumnsList(normalListData());
           } else {
-            setchooseValueData((data) => {
+            setSelectedValue((data) => {
               const cdata = [...data];
               cdata[columnIndex2] = Object.prototype.hasOwnProperty.call(
-                option,
+                columnOptions,
                 "value"
-              ) ? option.value : "";
+              ) ? columnOptions.value : "";
               return cdata;
             });
           }
-          setcolumnIndex(columnIndex2);
+          setColumnIndex(columnIndex2);
         }
       }
     };
-    const normalListData = () => {
-      const type2 = columnsType();
-      switch (type2) {
-        case "multiple":
-          return listData;
-        case "cascade":
-          return formatCascade(listData, chooseValueData);
-        default:
-          return [listData];
-      }
-    };
-    const columnsType = () => {
-      const firstColumn = listData[0];
-      if (firstColumn) {
-        if (Array.isArray(firstColumn)) {
-          return "multiple";
-        }
-        if ("children" in firstColumn) {
-          return "cascade";
-        }
-      }
-      return "single";
-    };
-    const formatCascade = (columns, defaultValues) => {
-      const formatted = [];
-      let cursor = {
-        text: "",
-        value: "",
-        children: columns
-      };
-      let columnIndex2 = 0;
-      while (cursor && cursor.children) {
-        const options2 = cursor.children;
-        const value = defaultValues[columnIndex2];
-        let index = options2.findIndex(
-          (columnItem) => columnItem.value === value
-        );
-        if (index === -1)
-          index = 0;
-        cursor = cursor.children[index];
-        columnIndex2++;
-        formatted.push(options2);
-      }
-      return formatted;
-    };
-    const init = () => {
-      const data = [];
-      const normalData = normalListData();
-      setColumnsList(normalData);
-      normalData.length > 0 && normalData.map((item) => {
-        item[0] && data.push(item[0].value);
-        return item;
+    const confirm2 = () => {
+      let movings = false;
+      refs.forEach((ref2) => {
+        if (ref2.moving)
+          movings = true;
+        ref2.stopMomentum();
       });
-      if (!defaultValueData && chooseValueData.length === 0) {
-        setchooseValueData([...data]);
+      if (movings) {
+        isConfirmEvent.current = true;
+      } else {
+        onConfirm && onConfirm(setSelectedOptions(), selectedValue);
+        closePicker();
       }
+      setTimeout(() => {
+        isConfirmEvent.current = false;
+      }, 0);
+    };
+    const closePicker = () => {
+      onClose && onClose(setSelectedOptions(), selectedValue);
+      afterClose && afterClose(setSelectedOptions(), selectedValue, pickerRef);
     };
-    const renderToolbar = () => {
-      return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: b("control"), children: [
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: b("cancel-btn"), onClick: () => closeActionSheet(), children: locale.cancel }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: b("title"), children: title || "" }),
-        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: b("confirm-btn"), onClick: confirm2, children: locale.confirm })
+    const renderTitleBar = () => {
+      return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `${classPrefix2}__control`, children: [
+        /* @__PURE__ */ jsxRuntimeExports.jsx(
+          "span",
+          {
+            className: `${classPrefix2}__cancel-btn`,
+            onClick: () => closePicker(),
+            children: locale.cancel
+          }
+        ),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix2}__title`, children: title || "" }),
+        /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `${classPrefix2}__confirm-btn`, onClick: confirm2, children: locale.confirm })
       ] });
     };
     return /* @__PURE__ */ jsxRuntimeExports.jsx(
@@ -15492,20 +15508,20 @@ Please add \`${key}Action\` when creating your handler.`);
         visible,
         position: "bottom",
         onClose: () => {
-          closeActionSheet();
+          closePicker();
         },
-        children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `${b()} ${className || ""}`, style, ...rest, children: [
-          renderToolbar(),
-          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: b("panel"), ref: pickerRef, children: columnsList == null ? void 0 : columnsList.map((item, index) => {
+        children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: classes, style, ...rest, children: [
+          renderTitleBar(),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix2}__panel`, ref: pickerRef, children: columnsList == null ? void 0 : columnsList.map((item, index) => {
             return /* @__PURE__ */ jsxRuntimeExports.jsx(
-              PickerSlot$1,
+              PickerPanel$1,
               {
                 ref: setRefs(index),
-                defaultValue: chooseValueData == null ? void 0 : chooseValueData[index],
-                listData: item,
+                defaultValue: selectedValue == null ? void 0 : selectedValue[index],
+                options: item,
                 threeDimensional,
                 chooseItem: (value, index2) => chooseItem(value, index2),
-                swipeDuration,
+                duration,
                 keyIndex: index
               },
               index
@@ -15556,7 +15572,7 @@ Please add \`${key}Action\` when creating your handler.`);
     const [show, setShow] = React.useState(false);
     const [currentDate, setCurrentDate] = React.useState(modelValue);
     const [defaultValue, setDefaultValue] = React.useState([]);
-    const [listData, setListData] = React.useState([]);
+    const [options2, setListData] = React.useState([]);
     const pickerRef = React.useRef(null);
     const isDate = (val) => {
       return Object.prototype.toString.call(val) === "[object Date]" && !Number.isNaN(val.getTime());
@@ -15674,7 +15690,7 @@ Please add \`${key}Action\` when creating your handler.`);
       }
       return result;
     };
-    const updateChooseValueCustmer = (index, selectedValue, cacheValueData) => {
+    const updateChooseValueCustmer = (cacheValueData, selectedValue, index) => {
       if (["date", "datetime", "datehour", "month-day", "year-month"].includes(
         type2.toLocaleLowerCase()
       )) {
@@ -15713,7 +15729,7 @@ Please add \`${key}Action\` when creating your handler.`);
         const isEqual2 = (currentDate == null ? void 0 : currentDate.getTime()) === (date2 == null ? void 0 : date2.getTime());
         date2 && isDate(date2) && !isEqual2 && setCurrentDate(formatValue(date2));
       }
-      props.onChange && props.onChange(index, selectedValue, cacheValueData);
+      props.onChange && props.onChange(cacheValueData, selectedValue, index);
     };
     const padZero = (num, targetLength = 2) => {
       let str = `${num}`;
@@ -15809,16 +15825,16 @@ Please add \`${key}Action\` when creating your handler.`);
         className: `nut-datepicker ${className || ""}`,
         style,
         ...rest,
-        children: listData.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(
+        children: options2.length > 0 && /* @__PURE__ */ jsxRuntimeExports.jsx(
           Picker$1,
           {
             title,
             visible: show,
-            listData,
+            options: options2,
             onClose: onCloseDatePicker,
-            defaultValueData: defaultValue,
-            onConfirm: (values, options2) => onConfirmDatePicker && onConfirmDatePicker(values, options2),
-            onChange: (index, value, list) => updateChooseValueCustmer(index, value, list),
+            defaultValue,
+            onConfirm: (options22, values) => onConfirmDatePicker && onConfirmDatePicker(options22, values),
+            onChange: (list, value, index) => updateChooseValueCustmer(list, value, index),
             threeDimensional,
             ref: pickerRef
           }
@@ -19768,144 +19784,120 @@ Please add \`${key}Action\` when creating your handler.`);
   Switch.defaultProps = defaultProps$H;
   Switch.displayName = "NutSwitch";
   const defaultProps$G = {
+    ...ComponentDefaults,
     defaultValue: "",
-    textAlign: "left",
-    limitshow: false,
-    maxlength: "",
-    rows: "",
+    showCount: false,
+    rows: 2,
+    maxLength: 140,
     placeholder: "",
-    readonly: false,
+    readOnly: false,
     disabled: false,
-    autosize: false
+    autoSize: false
   };
   const TextArea = (props) => {
     const { locale } = useConfig();
     const {
       className,
+      value,
       defaultValue,
-      textAlign,
-      limitshow,
-      maxlength,
+      showCount,
+      maxLength,
       rows,
       placeholder,
-      readonly,
+      readOnly,
       disabled,
-      autosize,
+      autoSize,
       style,
       onChange,
       onBlur,
-      onFocus
+      onFocus,
+      ...rest
     } = { ...defaultProps$G, ...props };
-    const textareaBem = cn("textarea");
-    const [inputValue, SetInputValue] = React.useState("");
+    const classPrefix2 = "nut-textarea";
     const textareaRef = React.useRef(null);
-    const compositingRef = React.useRef(false);
-    React.useEffect(() => {
-      let initValue = defaultValue;
-      if (initValue && maxlength && [...initValue].length > Number(maxlength)) {
-        initValue = initValue.substring(0, Number(maxlength));
+    const compositionRef = React.useRef(false);
+    const format2 = (value2) => {
+      if (maxLength !== void 0 && value2.length > maxLength) {
+        return value2.substring(0, maxLength);
       }
-      SetInputValue(initValue);
-      if (autosize) {
-        setTimeout(() => {
-          setContentHeight();
-        });
-      }
-    }, [defaultValue, autosize]);
+      return value2;
+    };
+    const [inputValue, setInputValue] = usePropsValue({
+      value,
+      defaultValue,
+      finalValue: format2(defaultValue),
+      onChange
+    });
     React.useEffect(() => {
-      if (inputValue) {
-        if (autosize) {
-          setContentHeight();
-        }
+      if (autoSize) {
+        setContentHeight();
       }
-    }, [inputValue]);
+    }, [autoSize, defaultValue, inputValue]);
     const setContentHeight = () => {
       const textarea = textareaRef.current;
       if (textarea) {
         textarea.style.height = "auto";
-        let height = textarea == null ? void 0 : textarea.scrollHeight;
-        if (typeof autosize === "object") {
-          const { maxHeight, minHeight } = autosize;
-          if (maxHeight !== void 0) {
-            height = Math.min(height, maxHeight);
-          }
-          if (minHeight !== void 0) {
-            height = Math.max(height, minHeight);
-          }
-        }
+        const height = textarea == null ? void 0 : textarea.scrollHeight;
         if (height) {
           textarea.style.height = `${height}px`;
         }
       }
     };
-    const textChange = (event) => {
+    const handleChange = (event) => {
       const text = event.target;
-      if (maxlength && [...text.value].length > Number(maxlength) && !compositingRef.current) {
-        text.value = text.value.substring(0, Number(maxlength));
-      }
-      SetInputValue(text.value);
-      onChange && onChange(text.value, event);
+      const value2 = compositionRef.current ? text.value : format2(text.value);
+      setInputValue(value2);
     };
-    const textFocus = (event) => {
+    const handleFocus = (event) => {
       if (disabled)
         return;
-      if (readonly)
+      if (readOnly)
         return;
       onFocus && onFocus(event);
     };
-    const textBlur = (event) => {
+    const handleBlur = (event) => {
       if (disabled)
         return;
-      if (readonly)
+      if (readOnly)
         return;
-      const text = event.target;
-      onChange && onChange(text.value, event);
       onBlur && onBlur(event);
     };
-    const startComposing = () => {
-      compositingRef.current = true;
-    };
-    const endComposing = () => {
-      compositingRef.current = false;
-    };
     return /* @__PURE__ */ jsxRuntimeExports.jsxs(
       "div",
       {
-        className: `${textareaBem()} ${disabled ? textareaBem("disabled") : ""} ${className || ""}`,
+        className: classNames(classPrefix2, className, {
+          [`${classPrefix2}__disabled`]: disabled
+        }),
         children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx(
             "textarea",
             {
               ref: textareaRef,
-              className: textareaBem("textarea"),
-              style: {
-                textAlign,
-                ...style
-              },
+              className: `${classPrefix2}__textarea`,
+              style,
               disabled,
-              readOnly: readonly,
+              readOnly,
               value: inputValue,
-              onChange: (e) => {
-                textChange(e);
-              },
-              onBlur: (e) => {
-                textBlur(e);
+              onChange: (e) => handleChange(e),
+              onBlur: (e) => handleBlur(e),
+              onFocus: (e) => handleFocus(e),
+              onCompositionEnd: () => {
+                compositionRef.current = false;
               },
-              onFocus: (e) => {
-                textFocus(e);
+              onCompositionStart: () => {
+                compositionRef.current = true;
               },
-              onCompositionEnd: (e) => endComposing(),
-              onCompositionStart: (e) => startComposing(),
               rows,
-              maxLength: maxlength < 0 ? 0 : maxlength,
-              placeholder: placeholder || locale.placeholder
+              maxLength: maxLength === -1 ? void 0 : maxLength,
+              placeholder: placeholder || locale.placeholder,
+              ...rest
             }
           ),
-          limitshow ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: textareaBem("limit"), children: [
-            [...inputValue].length,
+          showCount && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `${classPrefix2}__limit`, children: [
+            inputValue.length,
             "/",
-            maxlength < 0 ? 0 : maxlength
-          ] }) : null
+            maxLength < 0 ? 0 : maxLength
+          ] })
         ]
       }
     );
@@ -25088,13 +25080,11 @@ Please add \`${key}Action\` when creating your handler.`);
   Steps.displayName = "NutSteps";
   const defaultProps$8 = {
     ...ComponentDefaults,
-    className: "",
-    style: {},
     columns: [],
     data: [],
     bordered: true,
     striped: false,
-    noData: "无数据",
+    noData: "",
     sorterIcon: null,
     showHeader: true
   };
@@ -25111,9 +25101,9 @@ Please add \`${key}Action\` when creating your handler.`);
       summary,
       striped,
       noData,
-      onSorter,
       sorterIcon,
       showHeader,
+      onSort,
       ...rest
     } = {
       ...defaultProps$8,
@@ -25125,12 +25115,13 @@ Please add \`${key}Action\` when creating your handler.`);
         setCurData(data);
       }
     }, [data]);
-    const b = cn("table");
-    const classes = classNames({});
-    const cls = classNames(b(), classes, className);
+    const classPrefix2 = "nut-table";
+    const headerClassPrefix = `${classPrefix2}__main__head__tr`;
+    const bodyClassPrefix = `${classPrefix2}__main__body__tr`;
+    const cls = classNames(classPrefix2, className);
     const handleSorterClick = (item) => {
       if (item.sorter) {
-        onSorter && onSorter(item, curData);
+        onSort && onSort(item, curData);
         if (typeof item.sorter === "function") {
           setCurData(curData.sort(item.sorter));
         } else {
@@ -25140,8 +25131,8 @@ Please add \`${key}Action\` when creating your handler.`);
     };
     const cellClasses = (item) => {
       return {
-        "nut-table__main__head__tr--border": props.bordered,
-        [`nut-table__main__head__tr--align${item.align ? item.align : ""}`]: true
+        [`${headerClassPrefix}--border`]: props.bordered,
+        [`${headerClassPrefix}--align${item.align ? item.align : ""}`]: true
       };
     };
     const getColumnItem = (value) => {
@@ -25152,10 +25143,7 @@ Please add \`${key}Action\` when creating your handler.`);
         return /* @__PURE__ */ jsxRuntimeExports.jsxs(
           "span",
           {
-            className: classNames(
-              "nut-table__main__head__tr__th",
-              cellClasses(item)
-            ),
+            className: classNames(`${headerClassPrefix}__th`, cellClasses(item)),
             onClick: () => handleSorterClick(item),
             children: [
               item.title,
@@ -25178,7 +25166,7 @@ Please add \`${key}Action\` when creating your handler.`);
           "span",
           {
             className: classNames(
-              "nut-table__main__body__tr__td",
+              `${bodyClassPrefix}__td`,
               cellClasses(getColumnItem(value))
             ),
             children: typeof item[value] === "function" || typeof render2 === "function" ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children: render2 ? render2(item) : item[value](item) }) : item[value]
@@ -25189,24 +25177,23 @@ Please add \`${key}Action\` when creating your handler.`);
     };
     const renderBoyTrs = () => {
       return curData.map((item, index) => {
-        return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-table__main__body__tr", children: renderBodyTds(item) }, index);
+        return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: bodyClassPrefix, children: renderBodyTds(item) }, index);
       });
     };
     return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: cls, style, ...rest, children: [
       /* @__PURE__ */ jsxRuntimeExports.jsxs(
         "div",
         {
-          className: classNames("nut-table__main", {
-            "nut-table__main--striped": striped
+          className: classNames(`${classPrefix2}__main`, {
+            [`${classPrefix2}__main--striped`]: striped
           }),
           children: [
-            showHeader && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-table__main__head", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-table__main__head__tr", children: renderHeadCells() }) }),
-            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-table__main__body", children: renderBoyTrs() })
+            showHeader && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix2}__main__head`, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: headerClassPrefix, children: renderHeadCells() }) }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix2}__main__body`, children: renderBoyTrs() })
           ]
         }
       ),
-      summary && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-table__summary", children: /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "nut-table__summary__text", children: summary }) }),
-      curData.length === 0 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-table__nodata", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-table__nodata", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-table__nodata__text", children: noData }) }) })
+      (summary || curData.length === 0) && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix2}__summary`, children: summary || noData })
     ] });
   };
   Table.defaultProps = defaultProps$8;