@nutui/nutui-react 3.0.0 → 3.0.2

package/dist/nutui.react.umd.js

@@ -1182,7 +1182,7 @@ Check the top-level render call using <` + t + ">.");
     style: {}
   };
   var prefixCls$2 = "nut-button";
-  var defaultProps$1B = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1A = _object_spread_props(_object_spread({}, ComponentDefaults), {
     color: "",
     type: "default",
     size: "normal",
@@ -1198,7 +1198,7 @@ Check the top-level render call using <` + t + ">.");
     }
   });
   var Button = /* @__PURE__ */ React.forwardRef(function(props, ref) {
-    var _ref = _object_spread({}, defaultProps$1B, props), color = _ref.color, shape = _ref.shape, fill = _ref.fill, loading = _ref.loading, disabled = _ref.disabled, type2 = _ref.type, size = _ref.size, block = _ref.block, icon = _ref.icon, rightIcon = _ref.rightIcon, children = _ref.children, className = _ref.className, style = _ref.style, nativeType = _ref.nativeType, onClick = _ref.onClick, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$1A, props), color = _ref.color, shape = _ref.shape, fill = _ref.fill, loading = _ref.loading, disabled = _ref.disabled, type2 = _ref.type, size = _ref.size, block = _ref.block, icon = _ref.icon, rightIcon = _ref.rightIcon, children = _ref.children, className = _ref.className, style = _ref.style, nativeType = _ref.nativeType, onClick = _ref.onClick, rest = _object_without_properties(_ref, [
       "color",
       "shape",
       "fill",
@@ -1234,7 +1234,7 @@ Check the top-level render call using <` + t + ">.");
       color,
       props.fill
     ]);
-    var handleClick2 = React.useCallback(function(e2) {
+    var handleClick = React.useCallback(function(e2) {
       if (!loading && !disabled && onClick) {
         onClick(e2);
       }
@@ -1250,7 +1250,7 @@ Check the top-level render call using <` + t + ">.");
       type: nativeType,
       className: buttonClassNames,
       style: _object_spread({}, getStyle, style),
-      onClick: handleClick2
+      onClick: handleClick
     }), /* @__PURE__ */ React.createElement("div", {
       className: "nut-button-wrap"
     }, loading && /* @__PURE__ */ React.createElement(s, {
@@ -1261,14 +1261,14 @@ Check the top-level render call using <` + t + ">.");
   });
   Button.displayName = "NutButton";
   var CellGroupContext = React.createContext(null);
-  var defaultProps$1A = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1z = _object_spread_props(_object_spread({}, ComponentDefaults), {
     title: "",
     description: "",
     divider: true
   });
   var classPrefix$v = "nut-cell-group";
   var CellGroup = function(props) {
-    var _ref = _object_spread({}, defaultProps$1A, props), children = _ref.children, className = _ref.className, title = _ref.title, description = _ref.description, divider = _ref.divider, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$1z, props), children = _ref.children, className = _ref.className, title = _ref.title, description = _ref.description, divider = _ref.divider, rest = _object_without_properties(_ref, [
       "children",
       "className",
       "title",
@@ -1900,7 +1900,7 @@ Check the top-level render call using <` + t + ">.");
     }, children));
   };
   ConfigProvider.displayName = "NutConfigProvider";
-  var defaultProps$1z = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1y = _object_spread_props(_object_spread({}, ComponentDefaults), {
     title: null,
     description: null,
     extra: null,
@@ -1914,7 +1914,7 @@ Check the top-level render call using <` + t + ">.");
   var classPrefix$t = "nut-cell";
   var Cell = function(props) {
     var ctx2 = React.useContext(CellGroupContext);
-    var _ref = _object_spread({}, defaultProps$1z, props), children = _ref.children, clickable = _ref.clickable, onClick = _ref.onClick, title = _ref.title, description = _ref.description, extra = _ref.extra, radius = _ref.radius, align = _ref.align, isLast = _ref.isLast, className = _ref.className, style = _ref.style, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$1y, props), children = _ref.children, clickable = _ref.clickable, onClick = _ref.onClick, title = _ref.title, description = _ref.description, extra = _ref.extra, radius = _ref.radius, align = _ref.align, isLast = _ref.isLast, className = _ref.className, style = _ref.style, rest = _object_without_properties(_ref, [
       "children",
       "clickable",
       "onClick",
@@ -1928,7 +1928,7 @@ Check the top-level render call using <` + t + ">.");
       "style"
     ]);
     var rtl = useRtl();
-    var handleClick2 = function(event) {
+    var handleClick = function(event) {
       onClick(event);
     };
     var baseStyle = _object_spread_props(_object_spread({}, style), {
@@ -1943,7 +1943,7 @@ Check the top-level render call using <` + t + ">.");
         _define_property({}, "".concat(classPrefix$t, "-group-item"), ctx2 === null || ctx2 === void 0 ? void 0 : ctx2.group)
       ], clickable ? "".concat(classPrefix$t, "-clickable") : "")),
       onClick: function(event) {
-        return handleClick2(event);
+        return handleClick(event);
       },
       style: baseStyle
     }, rest), children || /* @__PURE__ */ React.createElement(React.Fragment, null, title || description ? /* @__PURE__ */ React.createElement("div", {
@@ -2010,7 +2010,7 @@ Check the top-level render call using <` + t + ">.");
   function _sliced_to_array(arr, i2) {
     return _array_with_holes(arr) || _iterable_to_array_limit(arr, i2) || _unsupported_iterable_to_array(arr, i2) || _non_iterable_rest();
   }
-  var defaultProps$1y = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1x = _object_spread_props(_object_spread({}, ComponentDefaults), {
     fit: "fill",
     position: "center",
     alt: "",
@@ -2022,7 +2022,7 @@ Check the top-level render call using <` + t + ">.");
   });
   var classPrefix$s = "nut-image";
   var Image$1 = function(props) {
-    var _$_object_spread = _object_spread({}, defaultProps$1y, props), className = _$_object_spread.className, style = _$_object_spread.style, src = _$_object_spread.src, fit = _$_object_spread.fit, position2 = _$_object_spread.position, alt = _$_object_spread.alt, width2 = _$_object_spread.width, height2 = _$_object_spread.height, radius = _$_object_spread.radius, error = _$_object_spread.error, loading = _$_object_spread.loading, lazy = _$_object_spread.lazy, draggable = _$_object_spread.draggable, onClick = _$_object_spread.onClick, onLoad = _$_object_spread.onLoad, onError = _$_object_spread.onError;
+    var _$_object_spread = _object_spread({}, defaultProps$1x, props), className = _$_object_spread.className, style = _$_object_spread.style, src = _$_object_spread.src, fit = _$_object_spread.fit, position2 = _$_object_spread.position, alt = _$_object_spread.alt, width2 = _$_object_spread.width, height2 = _$_object_spread.height, radius = _$_object_spread.radius, error = _$_object_spread.error, loading = _$_object_spread.loading, lazy = _$_object_spread.lazy, draggable = _$_object_spread.draggable, onClick = _$_object_spread.onClick, onLoad = _$_object_spread.onLoad, onError = _$_object_spread.onError;
     var _useState = _sliced_to_array(React.useState(false), 2), innerLoading = _useState[0], setInnerLoading = _useState[1];
     var _useState1 = _sliced_to_array(React.useState(false), 2), isError = _useState1[0], setIsError = _useState1[1];
     var _useState2 = _sliced_to_array(React.useState(false), 2), complete = _useState2[0], setComplete = _useState2[1];
@@ -4125,7 +4125,7 @@ Check the top-level render call using <` + t + ">.");
     var styles = _object_spread_props(_object_spread({}, style), {
       zIndex
     });
-    var handleClick2 = function(e2) {
+    var handleClick = function(e2) {
       if (closeOnOverlayClick) {
         onClick && onClick(e2);
       }
@@ -4143,17 +4143,17 @@ Check the top-level render call using <` + t + ">.");
       className: classes,
       style: styles
     }, rest), {
-      onClick: handleClick2
+      onClick: handleClick
     }), children));
   };
   Overlay.displayName = "NutOverlay";
-  var defaultProps$1x = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1w = _object_spread_props(_object_spread({}, ComponentDefaults), {
     contentPosition: "center",
     direction: "horizontal"
   });
   var classPrefix$r = "nut-divider";
   var Divider = function(props) {
-    var _ref = _object_spread({}, defaultProps$1x, props), children = _ref.children, contentPosition = _ref.contentPosition, style = _ref.style, className = _ref.className, direction = _ref.direction, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$1w, props), children = _ref.children, contentPosition = _ref.contentPosition, style = _ref.style, className = _ref.className, direction = _ref.direction, rest = _object_without_properties(_ref, [
       "children",
       "contentPosition",
       "style",
@@ -4191,7 +4191,7 @@ Check the top-level render call using <` + t + ">.");
   var pxCheck = function(value2) {
     return parseFloat(value2.toString());
   };
-  var defaultProps$1w = {
+  var defaultProps$1v = {
     text: "",
     columns: 4,
     gap: 9,
@@ -4201,7 +4201,7 @@ Check the top-level render call using <` + t + ">.");
     direction: "vertical"
   };
   var GridItem = function(props) {
-    var _ref = _object_spread({}, defaultProps$1w, props), children = _ref.children, style = _ref.style, columns = _ref.columns, index2 = _ref.index, gap = _ref.gap, square = _ref.square, text2 = _ref.text, center = _ref.center, reverse = _ref.reverse, direction = _ref.direction, className = _ref.className, onClick = _ref.onClick, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$1v, props), children = _ref.children, style = _ref.style, columns = _ref.columns, index2 = _ref.index, gap = _ref.gap, square = _ref.square, text2 = _ref.text, center = _ref.center, reverse = _ref.reverse, direction = _ref.direction, className = _ref.className, onClick = _ref.onClick, rest = _object_without_properties(_ref, [
       "children",
       "style",
       "columns",
@@ -4246,7 +4246,7 @@ Check the top-level render call using <` + t + ">.");
       var _obj;
       return classNames("".concat(classPrefix2, "-text"), (_obj = {}, _define_property(_obj, "".concat(classPrefix2, "-text-reverse"), reverse && direction !== "horizontal"), _define_property(_obj, "".concat(classPrefix2, "-text-horizontal"), direction === "horizontal"), _define_property(_obj, "".concat(classPrefix2, "-text-horizontal-reverse"), reverse && direction === "horizontal"), _obj));
     };
-    var handleClick2 = function(e2) {
+    var handleClick = function(e2) {
       onClick && onClick(e2);
       context2.onClick && context2.onClick({
         text: text2,
@@ -4263,7 +4263,7 @@ Check the top-level render call using <` + t + ">.");
       className: classes,
       style: rootStyle()
     }, rest), {
-      onClick: handleClick2
+      onClick: handleClick
     }), /* @__PURE__ */ React.createElement("div", {
       className: contentClass()
     }, children && /* @__PURE__ */ React.createElement(React.Fragment, null, children), text2 && /* @__PURE__ */ React.createElement("div", {
@@ -4271,7 +4271,7 @@ Check the top-level render call using <` + t + ">.");
     }, text2)));
   };
   GridItem.displayName = "NutGridItem";
-  var defaultProps$1v = {
+  var defaultProps$1u = {
     columns: 4,
     gap: 9,
     center: true,
@@ -4280,7 +4280,7 @@ Check the top-level render call using <` + t + ">.");
     direction: "vertical"
   };
   var Grid = function(props) {
-    var _ref = _object_spread({}, defaultProps$1v, props), children = _ref.children, columns = _ref.columns, gap = _ref.gap, center = _ref.center, square = _ref.square, reverse = _ref.reverse, direction = _ref.direction, style = _ref.style, className = _ref.className, onClick = _ref.onClick, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$1u, props), children = _ref.children, columns = _ref.columns, gap = _ref.gap, center = _ref.center, square = _ref.square, reverse = _ref.reverse, direction = _ref.direction, style = _ref.style, className = _ref.className, onClick = _ref.onClick, rest = _object_without_properties(_ref, [
       "children",
       "columns",
       "gap",
@@ -4332,7 +4332,7 @@ Check the top-level render call using <` + t + ">.");
   };
   Layout.displayName = "NutLayout";
   var DataContext$1 = React.createContext({});
-  var defaultProps$1u = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1t = _object_spread_props(_object_spread({}, ComponentDefaults), {
     span: "24",
     offset: "0",
     gutter: "0",
@@ -4340,7 +4340,7 @@ Check the top-level render call using <` + t + ">.");
     isLast: false
   });
   var Col = function(props) {
-    var _$_object_spread = _object_spread({}, defaultProps$1u, props), className = _$_object_spread.className, style = _$_object_spread.style, span = _$_object_spread.span, offset = _$_object_spread.offset, children = _$_object_spread.children, isFirst = _$_object_spread.isFirst, isLast = _$_object_spread.isLast, onClick = _$_object_spread.onClick;
+    var _$_object_spread = _object_spread({}, defaultProps$1t, props), className = _$_object_spread.className, style = _$_object_spread.style, span = _$_object_spread.span, offset = _$_object_spread.offset, children = _$_object_spread.children, isFirst = _$_object_spread.isFirst, isLast = _$_object_spread.isLast, onClick = _$_object_spread.onClick;
     var _useState = _sliced_to_array(React.useState(""), 2), colName = _useState[0], setColName = _useState[1];
     var _useState1 = _sliced_to_array(React.useState({}), 2), colStyle = _useState1[0], setColStyle = _useState1[1];
     var gutter = React.useContext(DataContext$1).gutter;
@@ -4376,7 +4376,7 @@ Check the top-level render call using <` + t + ">.");
   };
   Col.displayName = "NutCol";
   var classPrefix$q = "nut-row";
-  var defaultProps$1t = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1s = _object_spread_props(_object_spread({}, ComponentDefaults), {
     type: "",
     justify: "start",
     align: "flex-start",
@@ -4384,7 +4384,7 @@ Check the top-level render call using <` + t + ">.");
     gutter: "0"
   });
   var Row = function(props) {
-    var _$_object_spread = _object_spread({}, defaultProps$1t, props), className = _$_object_spread.className, style = _$_object_spread.style, children = _$_object_spread.children, type2 = _$_object_spread.type, justify = _$_object_spread.justify, align = _$_object_spread.align, wrap = _$_object_spread.wrap, gutter = _$_object_spread.gutter, onClick = _$_object_spread.onClick;
+    var _$_object_spread = _object_spread({}, defaultProps$1s, props), className = _$_object_spread.className, style = _$_object_spread.style, children = _$_object_spread.children, type2 = _$_object_spread.type, justify = _$_object_spread.justify, align = _$_object_spread.align, wrap = _$_object_spread.wrap, gutter = _$_object_spread.gutter, onClick = _$_object_spread.onClick;
     var getClass = function(prefix2, type3) {
       var classType = type3 ? "nut-row-".concat(prefix2, "-").concat(type3) : "";
       if (prefix2) return classType;
@@ -4414,12 +4414,19 @@ Check the top-level render call using <` + t + ">.");
     })));
   };
   Row.displayName = "NutRow";
+  var classPrefix$p = "nut-safe-area";
+  var SafeArea = function(props) {
+    return /* @__PURE__ */ React.createElement("div", {
+      className: classNames(classPrefix$p, "".concat(classPrefix$p, "-position-").concat(props.position))
+    });
+  };
+  SafeArea.displayName = "NutSafeArea";
   var prefixCls$1 = "nut-space";
-  var defaultProps$1s = {
+  var defaultProps$1r = {
     direction: "horizontal"
   };
   var Space = function(props) {
-    var _$_object_spread = _object_spread({}, defaultProps$1s, props), className = _$_object_spread.className, style = _$_object_spread.style, children = _$_object_spread.children, wrap = _$_object_spread.wrap, align = _$_object_spread.align, direction = _$_object_spread.direction, justify = _$_object_spread.justify;
+    var _$_object_spread = _object_spread({}, defaultProps$1r, props), className = _$_object_spread.className, style = _$_object_spread.style, children = _$_object_spread.children, wrap = _$_object_spread.wrap, align = _$_object_spread.align, direction = _$_object_spread.direction, justify = _$_object_spread.justify;
     var _obj;
     var cls = classNames(prefixCls$1, (_obj = {}, _define_property(_obj, "".concat(prefixCls$1, "-").concat(direction), direction), _define_property(_obj, "".concat(prefixCls$1, "-").concat(direction, "-wrap"), wrap), _define_property(_obj, "".concat(prefixCls$1, "-align-").concat(align), align), _define_property(_obj, "".concat(prefixCls$1, "-justify-").concat(justify), justify), _define_property(_obj, "".concat(className), className), _obj));
     var _obj1;
@@ -4454,6 +4461,7 @@ Check the top-level render call using <` + t + ">.");
       };
     }
     if (element && element.getBoundingClientRect) {
+      console.log(element, element.getBoundingClientRect());
       return element.getBoundingClientRect();
     }
     return {
@@ -4465,7 +4473,7 @@ Check the top-level render call using <` + t + ">.");
       height: 0
     };
   };
-  function useWatch(dep, callback) {
+  function useWatch$1(dep, callback) {
     var config2 = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : {
       immediate: false
     };
@@ -4495,14 +4503,14 @@ Check the top-level render call using <` + t + ">.");
       stop2.current = true;
     };
   }
-  var defaultProps$1r = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1q = _object_spread_props(_object_spread({}, ComponentDefaults), {
     position: "top",
     threshold: 0,
     zIndex: 900
   });
-  var classPrefix$p = "nut-sticky";
+  var classPrefix$o = "nut-sticky";
   var Sticky = function(props) {
-    var _ref = _object_spread({}, defaultProps$1r, props), position2 = _ref.position, zIndex = _ref.zIndex, children = _ref.children, container = _ref.container, style = _ref.style, className = _ref.className, threshold = _ref.threshold, onChange = _ref.onChange, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$1q, props), position2 = _ref.position, zIndex = _ref.zIndex, children = _ref.children, container = _ref.container, style = _ref.style, className = _ref.className, threshold = _ref.threshold, onChange = _ref.onChange, rest = _object_without_properties(_ref, [
       "position",
       "zIndex",
       "children",
@@ -4613,7 +4621,7 @@ Check the top-level render call using <` + t + ">.");
       threshold,
       container
     ]);
-    useWatch(isFixed, function() {
+    useWatch$1(isFixed, function() {
       onChange && onChange(isFixed);
     });
     React.useEffect(function() {
@@ -4629,7 +4637,7 @@ Check the top-level render call using <` + t + ">.");
     return /* @__PURE__ */ React.createElement("div", _object_spread({
       ref: rootRef,
       style: _object_spread({}, style, rootStyle),
-      className: classNames(classPrefix$p, className)
+      className: classNames(classPrefix$o, className)
     }, rest), /* @__PURE__ */ React.createElement("div", {
       className: "nut-sticky-box",
       ref: stickyRef,
@@ -4637,13 +4645,6 @@ Check the top-level render call using <` + t + ">.");
     }, children));
   };
   Sticky.displayName = "NutSticky";
-  var classPrefix$o = "nut-safe-area";
-  var SafeArea = function(props) {
-    return /* @__PURE__ */ React.createElement("div", {
-      className: classNames(classPrefix$o, "".concat(classPrefix$o, "-position-").concat(props.position))
-    });
-  };
-  SafeArea.displayName = "NutSafeArea";
   function _instanceof(left, right) {
     if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) {
       return !!right[Symbol.hasInstance](left);
@@ -4655,15 +4656,15 @@ Check the top-level render call using <` + t + ">.");
       className: "nut-icon"
     }) : icon;
   };
-  var defaultProps$1q = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1p = _object_spread_props(_object_spread({}, ComponentDefaults), {
     icon: null,
     onClick: function(event) {
     }
   });
   var classPrefix$n = "nut-hoverbutton-item";
   var HoverButtonItem = function(props) {
-    var _$_object_spread = _object_spread({}, defaultProps$1q, props), className = _$_object_spread.className, children = _$_object_spread.children, style = _$_object_spread.style, icon = _$_object_spread.icon, onClick = _$_object_spread.onClick;
-    var handleClick2 = function(event) {
+    var _$_object_spread = _object_spread({}, defaultProps$1p, props), className = _$_object_spread.className, children = _$_object_spread.children, style = _$_object_spread.style, icon = _$_object_spread.icon, onClick = _$_object_spread.onClick;
+    var handleClick = function(event) {
       if (onClick) {
         onClick(event);
       }
@@ -4686,15 +4687,15 @@ Check the top-level render call using <` + t + ">.");
         className
       ], _define_property({}, "".concat(classPrefix$n, "-container-icontext"), icon && children)),
       style,
-      onClick: handleClick2
+      onClick: handleClick
     }, renderBody());
   };
   HoverButtonItem.displayName = "NutHoverButtonItem";
   var UI_BOTTOM_DISTANCE = 60;
-  var defaultProps$1p = _object_spread({}, ComponentDefaults);
+  var defaultProps$1o = _object_spread({}, ComponentDefaults);
   var classPrefix$m = "nut-hoverbutton";
   var HoverButton = function(props) {
-    var _$_object_spread = _object_spread({}, defaultProps$1p, props), children = _$_object_spread.children, zIndex = _$_object_spread.zIndex, tabbarHeight = _$_object_spread.tabbarHeight, className = _$_object_spread.className, style = _$_object_spread.style, icon = _$_object_spread.icon, onClick = _$_object_spread.onClick;
+    var _$_object_spread = _object_spread({}, defaultProps$1o, props), children = _$_object_spread.children, zIndex = _$_object_spread.zIndex, tabbarHeight = _$_object_spread.tabbarHeight, className = _$_object_spread.className, style = _$_object_spread.style, icon = _$_object_spread.icon, onClick = _$_object_spread.onClick;
     var rtl = useRtl();
     var baseStyle = _object_spread({}, style);
     if (tabbarHeight) {
@@ -4721,14 +4722,14 @@ Check the top-level render call using <` + t + ">.");
   };
   HoverButton.displayName = "NutHoverButton";
   HoverButton.Item = HoverButtonItem;
-  var defaultProps$1o = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1n = _object_spread_props(_object_spread({}, ComponentDefaults), {
     target: "",
     threshold: 200,
     zIndex: 900,
     duration: 1e3
   });
   var BackTop = function(props) {
-    var _$_object_spread = _object_spread({}, defaultProps$1o, props), children = _$_object_spread.children, target = _$_object_spread.target, threshold = _$_object_spread.threshold, zIndex = _$_object_spread.zIndex, className = _$_object_spread.className, duration = _$_object_spread.duration, icon = _$_object_spread.icon, style = _$_object_spread.style, onClick = _$_object_spread.onClick;
+    var _$_object_spread = _object_spread({}, defaultProps$1n, props), children = _$_object_spread.children, target = _$_object_spread.target, threshold = _$_object_spread.threshold, zIndex = _$_object_spread.zIndex, className = _$_object_spread.className, duration = _$_object_spread.duration, icon = _$_object_spread.icon, style = _$_object_spread.style, onClick = _$_object_spread.onClick;
     var classPrefix2 = "nut-backtop";
     var _useState = _sliced_to_array(React.useState(false), 2), backTop = _useState[0], setBackTop = _useState[1];
     var _useState1 = _sliced_to_array(React.useState(0), 2), scrollTop = _useState1[0], setScrollTop = _useState1[1];
@@ -6833,7 +6834,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       }
     }
   }
-  const toArray = (a) => is.und(a) ? [] : is.arr(a) ? a : [a];
+  const toArray$1 = (a) => is.und(a) ? [] : is.arr(a) ? a : [a];
   function flush(queue, iterator) {
     if (queue.size) {
       const items = Array.from(queue);
@@ -7841,7 +7842,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   function callProp(value2, ...args) {
     return is.fun(value2) ? value2(...args) : value2;
   }
-  const matchProp = (value2, key2) => value2 === true || !!(key2 && value2 && (is.fun(value2) ? value2(key2) : toArray(value2).includes(key2)));
+  const matchProp = (value2, key2) => value2 === true || !!(key2 && value2 && (is.fun(value2) ? value2(key2) : toArray$1(value2).includes(key2)));
   const resolveProp = (prop, key2) => is.obj(prop) ? key2 && prop[key2] : prop;
   const getDefaultProp = (props, key2) => props.default === true ? props[key2] : props.default ? props.default[key2] : void 0;
   const noopTransform = (value2) => value2;
@@ -8383,7 +8384,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       } = anim;
       const payload = getPayload(anim.to);
       if (!payload && hasFluidValue(anim.to)) {
-        toValues = toArray(getFluidValue(anim.to));
+        toValues = toArray$1(getFluidValue(anim.to));
       }
       anim.values.forEach((node2, i2) => {
         if (node2.done) return;
@@ -8736,7 +8737,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       if (!hasAsyncTo) {
         if (started || hasFluidValue(prevTo)) {
           anim.values = node.getPayload();
-          anim.toValues = hasFluidValue(to2) ? null : goalType == AnimatedString ? [1] : toArray(goal);
+          anim.toValues = hasFluidValue(to2) ? null : goalType == AnimatedString ? [1] : toArray$1(goal);
         }
         if (anim.immediate != immediate) {
           anim.immediate = immediate;
@@ -9009,7 +9010,7 @@ Please add \`${key2}Action\` when creating your handler.`);
         queue
       } = this;
       if (props) {
-        queue = toArray(props).map(createUpdate);
+        queue = toArray$1(props).map(createUpdate);
       } else {
         this.queue = [];
       }
@@ -9025,7 +9026,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       }
       if (keys) {
         const springs = this.springs;
-        each(toArray(keys), (key2) => springs[key2].stop(!!arg));
+        each(toArray$1(keys), (key2) => springs[key2].stop(!!arg));
       } else {
         stopAsync(this._state, this._lastAsyncId);
         this.each((spring) => spring.stop(!!arg));
@@ -9039,7 +9040,7 @@ Please add \`${key2}Action\` when creating your handler.`);
         });
       } else {
         const springs = this.springs;
-        each(toArray(keys), (key2) => springs[key2].pause());
+        each(toArray$1(keys), (key2) => springs[key2].pause());
       }
       return this;
     }
@@ -9050,7 +9051,7 @@ Please add \`${key2}Action\` when creating your handler.`);
         });
       } else {
         const springs = this.springs;
-        each(toArray(keys), (key2) => springs[key2].resume());
+        each(toArray$1(keys), (key2) => springs[key2].resume());
       }
       return this;
     }
@@ -9201,7 +9202,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   function getSprings(ctrl, props) {
     const springs = _extends$1({}, ctrl.springs);
     if (props) {
-      each(toArray(props), (props2) => {
+      each(toArray$1(props), (props2) => {
         if (is.und(props2.keys)) {
           props2 = createUpdate(props2);
         }
@@ -9473,7 +9474,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       }
     }
     _get() {
-      const inputs = is.arr(this.source) ? this.source.map(getFluidValue) : toArray(getFluidValue(this.source));
+      const inputs = is.arr(this.source) ? this.source.map(getFluidValue) : toArray$1(getFluidValue(this.source));
       return this.calc(...inputs);
     }
     _start() {
@@ -9492,7 +9493,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     }
     _attach() {
       let priority2 = 1;
-      each(toArray(this.source), (source) => {
+      each(toArray$1(this.source), (source) => {
         if (hasFluidValue(source)) {
           addFluidObserver(source, this);
         }
@@ -9507,7 +9508,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       this._start();
     }
     _detach() {
-      each(toArray(this.source), (source) => {
+      each(toArray$1(this.source), (source) => {
         if (hasFluidValue(source)) {
           removeFluidObserver(source, this);
         }
@@ -9526,7 +9527,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       } else if (event.type == "idle") {
         this._active.delete(event.parent);
       } else if (event.type == "priority") {
-        this.priority = toArray(this.source).reduce((highest, parent2) => Math.max(highest, (isFrameValue(parent2) ? parent2.priority : 0) + 1), 0);
+        this.priority = toArray$1(this.source).reduce((highest, parent2) => Math.max(highest, (isFrameValue(parent2) ? parent2.priority : 0) + 1), 0);
       }
     }
   }
@@ -9688,7 +9689,7 @@ Please add \`${key2}Action\` when creating your handler.`);
           delete style[key2];
           if (is.und(value2)) return;
           const unit = pxTransforms.test(key2) ? "px" : degTransforms.test(key2) ? "deg" : "";
-          inputs.push(toArray(value2));
+          inputs.push(toArray$1(value2));
           transforms.push(key2 === "rotate3d" ? ([x2, y2, z2, deg]) => [`rotate3d(${x2},${y2},${z2},${addUnit(deg, unit)})`, isValueIdentity(deg, 0)] : (input) => [`${key2}(${input.map((v) => addUnit(v, unit)).join(",")})`, isValueIdentity(input, key2.startsWith("scale") ? 1 : 0)]);
         }
       });
@@ -9749,7 +9750,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   });
   const animated = host.animated;
   var elevatorContext = /* @__PURE__ */ React.createContext({});
-  var defaultProps$1n = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1m = _object_spread_props(_object_spread({}, ComponentDefaults), {
     height: "200px",
     floorKey: "title",
     list: [],
@@ -9759,7 +9760,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     showKeys: true
   });
   var Elevator = function(props) {
-    var _ref = _object_spread({}, defaultProps$1n, props), height2 = _ref.height, floorKey = _ref.floorKey, list = _ref.list, sticky = _ref.sticky, spaceHeight = _ref.spaceHeight;
+    var _ref = _object_spread({}, defaultProps$1m, props), height2 = _ref.height, floorKey = _ref.floorKey, list = _ref.list, sticky = _ref.sticky, spaceHeight = _ref.spaceHeight;
     _ref.titleHeight;
     var showKeys = _ref.showKeys, className = _ref.className, style = _ref.style, onItemClick = _ref.onItemClick, onIndexClick = _ref.onIndexClick, children = _ref.children, rest = _object_without_properties(_ref, [
       "height",
@@ -9955,7 +9956,62 @@ Please add \`${key2}Action\` when creating your handler.`);
   };
   Elevator.displayName = "NutElevator";
   Elevator.Context = elevatorContext;
-  var defaultProps$1m = _object_spread_props(_object_spread({}, defaultOverlayProps), {
+  function _type_of(obj) {
+    "@swc/helpers - typeof";
+    return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
+  }
+  var defaultProps$1l = _object_spread_props(_object_spread({}, ComponentDefaults), {
+    value: "",
+    dot: false,
+    max: 99,
+    top: 0,
+    right: 0,
+    fill: "solid",
+    size: "large"
+  });
+  var Badge = function(props) {
+    var isIcon = function isIcon2() {
+      if ((typeof value2 === "undefined" ? "undefined" : _type_of(value2)) === "object" && value2) return value2;
+    };
+    var isNumber = function isNumber2() {
+      if (typeof value2 === "number" && value2) return value2;
+    };
+    var isString = function isString2() {
+      if (typeof value2 === "string" && value2) return value2;
+    };
+    var _this;
+    var rtl = useRtl();
+    var _$_object_spread = _object_spread({}, defaultProps$1l, props), className = _$_object_spread.className, style = _$_object_spread.style, value2 = _$_object_spread.value, max = _$_object_spread.max, children = _$_object_spread.children, dot = _$_object_spread.dot, top = _$_object_spread.top, right = _$_object_spread.right, fill = _$_object_spread.fill, size = _$_object_spread.size;
+    var classPrefix2 = "nut-badge";
+    var classes = classNames(classPrefix2, className);
+    var getContent = function() {
+      if (dot || value2 === 0) return null;
+      if (typeof value2 === "number") {
+        return max < value2 ? "".concat(max, "+") : "".concat(value2);
+      }
+      return value2;
+    };
+    var _obj;
+    var contentClasses = classNames((_obj = {}, _define_property(_obj, "".concat(classPrefix2, "-sup"), isNumber() || isString() || dot), _define_property(_obj, "".concat(classPrefix2, "-number"), isNumber()), _define_property(_obj, "".concat(classPrefix2, "-one"), typeof getContent() === "string" && ((_this = "".concat(getContent())) === null || _this === void 0 ? void 0 : _this.length) === 1), _define_property(_obj, "".concat(classPrefix2, "-dot"), dot), _define_property(_obj, "".concat(classPrefix2, "-dot-").concat(size), dot), _define_property(_obj, "".concat(classPrefix2, "-").concat(fill), fill === "outline"), _define_property(_obj, "".concat(classPrefix2, "-content"), children), _obj));
+    var getPositionStyle = function() {
+      return _define_property({
+        top: "".concat(Number(top) || 0, "px")
+      }, rtl ? "left" : "right", "".concat(Number(right) || 0, "px"));
+    };
+    var _obj1;
+    return /* @__PURE__ */ React.createElement("div", {
+      className: classes,
+      style
+    }, isIcon() && /* @__PURE__ */ React.createElement("div", {
+      className: classNames("".concat(classPrefix2, "-content"), (_obj1 = {}, _define_property(_obj1, "".concat(classPrefix2, "-icon"), true), _define_property(_obj1, "".concat(classPrefix2, "-icon-rtl"), rtl), _obj1)),
+      style: getPositionStyle()
+    }, value2), children, !isIcon() && (getContent() || dot) && /* @__PURE__ */ React.createElement("div", {
+      className: contentClasses,
+      style: getPositionStyle()
+    }, getContent()));
+  };
+  Badge.displayName = "NutBadge";
+  var defaultProps$1k = _object_spread_props(_object_spread({}, defaultOverlayProps), {
     activeText: "",
     inactiveText: "",
     type: "right",
@@ -9973,7 +10029,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   });
   var FixedNav = function(props) {
     var locale = useConfig().locale;
-    var _ref = _object_spread({}, defaultProps$1m, props), overlay = _ref.overlay, visible = _ref.visible, list = _ref.list, activeText = _ref.activeText, inactiveText = _ref.inactiveText, position2 = _ref.position, type2 = _ref.type, children = _ref.children, style = _ref.style, className = _ref.className, content2 = _ref.content, zIndex = _ref.zIndex, onChange = _ref.onChange, onSelect = _ref.onSelect, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$1k, props), overlay = _ref.overlay, visible = _ref.visible, list = _ref.list, activeText = _ref.activeText, inactiveText = _ref.inactiveText, position2 = _ref.position, type2 = _ref.type, children = _ref.children, style = _ref.style, className = _ref.className, content2 = _ref.content, zIndex = _ref.zIndex, onChange = _ref.onChange, onSelect = _ref.onSelect, rest = _object_without_properties(_ref, [
       "overlay",
       "visible",
       "list",
@@ -9993,6 +10049,20 @@ Please add \`${key2}Action\` when creating your handler.`);
     var classes = classNames(classPrefix2, {
       active: visible
     }, type2, className);
+    var renderListItem = function(item, index2) {
+      return /* @__PURE__ */ React.createElement("div", {
+        className: "".concat(classPrefix2, "-list-item"),
+        onClick: function(event) {
+          return onSelect(item, event);
+        },
+        key: item.id || index2
+      }, /* @__PURE__ */ React.isValidElement(item.icon) ? item.icon : /* @__PURE__ */ React.createElement("img", {
+        src: item.icon,
+        alt: ""
+      }), /* @__PURE__ */ React.createElement("div", {
+        className: "".concat(classPrefix2, "-list-text")
+      }, item.text));
+    };
     return /* @__PURE__ */ React.createElement("div", _object_spread({
       className: classes,
       style: _object_spread({}, position2, style)
@@ -10007,20 +10077,11 @@ Please add \`${key2}Action\` when creating your handler.`);
     }, children || /* @__PURE__ */ React.createElement("div", {
       className: "".concat(classPrefix2, "-list")
     }, list.map(function(item, index2) {
-      return /* @__PURE__ */ React.createElement("div", {
-        className: "".concat(classPrefix2, "-list-item"),
-        onClick: function(event) {
-          return onSelect(item, event);
-        },
-        key: item.id || index2
-      }, /* @__PURE__ */ React.isValidElement(item.icon) ? item.icon : /* @__PURE__ */ React.createElement("img", {
-        src: item.icon,
-        alt: ""
-      }), /* @__PURE__ */ React.createElement("div", {
-        className: "".concat(classPrefix2, "-list-text")
-      }, item.text), item.num && /* @__PURE__ */ React.createElement("div", {
-        className: "b"
-      }, item.num));
+      return /* @__PURE__ */ React.createElement(React.Fragment, null, item.num ? /* @__PURE__ */ React.createElement(Badge, {
+        value: item.num,
+        top: 8,
+        right: 6
+      }, renderListItem(item, index2)) : /* @__PURE__ */ React.createElement(React.Fragment, null, renderListItem(item, index2)));
     }))), /* @__PURE__ */ React.createElement("div", {
       className: "".concat(classPrefix2, "-btn"),
       onClick: function() {
@@ -10033,7 +10094,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     }, visible ? activeText || locale.fixednav.activeText : inactiveText || locale.fixednav.inactiveText))));
   };
   FixedNav.displayName = "NutFixedNav";
-  var defaultProps$1l = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1j = _object_spread_props(_object_spread({}, ComponentDefaults), {
     left: "",
     right: "",
     back: "",
@@ -10043,7 +10104,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     zIndex: 10
   });
   var NavBar = function(props) {
-    var _$_object_spread = _object_spread({}, defaultProps$1l, props), right = _$_object_spread.right, left = _$_object_spread.left, title = _$_object_spread.title, className = _$_object_spread.className, style = _$_object_spread.style, back = _$_object_spread.back, fixed = _$_object_spread.fixed, safeAreaInsetTop = _$_object_spread.safeAreaInsetTop, placeholder = _$_object_spread.placeholder, zIndex = _$_object_spread.zIndex, onBackClick = _$_object_spread.onBackClick;
+    var _$_object_spread = _object_spread({}, defaultProps$1j, props), right = _$_object_spread.right, left = _$_object_spread.left, title = _$_object_spread.title, className = _$_object_spread.className, style = _$_object_spread.style, back = _$_object_spread.back, fixed = _$_object_spread.fixed, safeAreaInsetTop = _$_object_spread.safeAreaInsetTop, placeholder = _$_object_spread.placeholder, zIndex = _$_object_spread.zIndex, onBackClick = _$_object_spread.onBackClick;
     var classPrefix2 = "nut-navbar";
     var rtl = useRtl();
     var children = Array.isArray(props.children) ? props.children : [
@@ -10093,217 +10154,6 @@ Please add \`${key2}Action\` when creating your handler.`);
     }, renderWrapper()) : renderWrapper());
   };
   NavBar.displayName = "NutNavBar";
-  var defaultProps$1k = _object_spread_props(_object_spread({}, defaultOverlayProps), {
-    position: "center",
-    transition: "",
-    overlayStyle: {},
-    overlayClassName: "",
-    closeable: false,
-    closeIconPosition: "top-right",
-    closeIcon: "close",
-    destroyOnClose: false,
-    portal: null,
-    overlay: true,
-    round: false,
-    onOpen: function() {
-    },
-    onClose: function() {
-    },
-    onOverlayClick: function() {
-      return true;
-    },
-    onCloseIconClick: function() {
-      return true;
-    }
-  });
-  var _zIndex = 1100;
-  var Popup = function(props) {
-    var _$_object_spread = _object_spread({}, defaultProps$1k, props), children = _$_object_spread.children, visible = _$_object_spread.visible, overlay = _$_object_spread.overlay, closeOnOverlayClick = _$_object_spread.closeOnOverlayClick, overlayStyle = _$_object_spread.overlayStyle, overlayClassName = _$_object_spread.overlayClassName, zIndex = _$_object_spread.zIndex, lockScroll = _$_object_spread.lockScroll, duration = _$_object_spread.duration, closeable = _$_object_spread.closeable, closeIconPosition = _$_object_spread.closeIconPosition, closeIcon = _$_object_spread.closeIcon, left = _$_object_spread.left, title = _$_object_spread.title, description = _$_object_spread.description, style = _$_object_spread.style, transition = _$_object_spread.transition, round = _$_object_spread.round, position2 = _$_object_spread.position, className = _$_object_spread.className, destroyOnClose = _$_object_spread.destroyOnClose, portal = _$_object_spread.portal, onOpen = _$_object_spread.onOpen, onClose = _$_object_spread.onClose, onOverlayClick = _$_object_spread.onOverlayClick, onCloseIconClick = _$_object_spread.onCloseIconClick, afterShow = _$_object_spread.afterShow, afterClose = _$_object_spread.afterClose, onClick = _$_object_spread.onClick;
-    var nodeRef = React.useRef(null);
-    var innerIndex = zIndex || _zIndex;
-    var _useState = _sliced_to_array(React.useState(innerIndex), 2), index2 = _useState[0], setIndex = _useState[1];
-    var _useState1 = _sliced_to_array(React.useState(visible), 2), innerVisible = _useState1[0], setInnerVisible = _useState1[1];
-    var _useState2 = _sliced_to_array(React.useState(true), 2), showChildren = _useState2[0], setShowChildren = _useState2[1];
-    var _useState3 = _sliced_to_array(React.useState(""), 2), transitionName = _useState3[0], setTransitionName = _useState3[1];
-    useLockScroll(nodeRef, innerVisible && lockScroll);
-    var classPrefix2 = "nut-popup";
-    var overlayStyles = _object_spread({}, overlayStyle);
-    var popStyles = _object_spread_props(_object_spread({}, style), {
-      zIndex: index2
-    });
-    var _obj;
-    var popClassName = classNames(classPrefix2, (_obj = {}, _define_property(_obj, "".concat(classPrefix2, "-round"), round || position2 === "bottom"), _define_property(_obj, "".concat(classPrefix2, "-").concat(position2), true), _obj), className);
-    var open = function() {
-      if (!innerVisible) {
-        setInnerVisible(true);
-        setIndex(++innerIndex);
-      }
-      if (destroyOnClose) {
-        setShowChildren(true);
-      }
-      onOpen && onOpen();
-    };
-    var close = function() {
-      if (innerVisible) {
-        setInnerVisible(false);
-        if (destroyOnClose) {
-          setTimeout(function() {
-            setShowChildren(false);
-          }, Number(duration));
-        }
-        onClose && onClose();
-      }
-    };
-    var handleOverlayClick = function(e2) {
-      e2.stopPropagation();
-      if (closeOnOverlayClick && onOverlayClick(e2)) {
-        close();
-      }
-    };
-    var handleCloseIconClick = function(e2) {
-      onCloseIconClick(e2) && close();
-    };
-    var renderCloseIcon = function() {
-      var closeClasses = classNames("".concat(classPrefix2, "-title-right"), "".concat(classPrefix2, "-title-right-").concat(closeIconPosition));
-      return /* @__PURE__ */ React.createElement(React.Fragment, null, closeable && /* @__PURE__ */ React.createElement("div", {
-        className: closeClasses,
-        onClick: handleCloseIconClick
-      }, /* @__PURE__ */ React.isValidElement(closeIcon) ? closeIcon : /* @__PURE__ */ React.createElement(n$6, null)));
-    };
-    var renderTitle = function() {
-      if (left || title || description) {
-        return /* @__PURE__ */ React.createElement("div", {
-          className: "".concat(classPrefix2, "-title")
-        }, position2 === "bottom" && /* @__PURE__ */ React.createElement(React.Fragment, null, left && /* @__PURE__ */ React.createElement("div", {
-          className: "".concat(classPrefix2, "-title-left")
-        }, left), (title || description) && /* @__PURE__ */ React.createElement("div", {
-          className: "".concat(classPrefix2, "-title-wrapper")
-        }, title && /* @__PURE__ */ React.createElement("div", {
-          className: "".concat(classPrefix2, "-title-title")
-        }, title), description && /* @__PURE__ */ React.createElement("div", {
-          className: "".concat(classPrefix2, "-title-description ").concat(title ? "".concat(classPrefix2, "-title-description-gap") : "")
-        }, description))), renderCloseIcon());
-      }
-      if (closeable) {
-        return renderCloseIcon();
-      }
-    };
-    var renderPop = function() {
-      return /* @__PURE__ */ React.createElement(CSSTransition, {
-        nodeRef,
-        classNames: transitionName,
-        mountOnEnter: true,
-        unmountOnExit: destroyOnClose,
-        timeout: duration,
-        in: innerVisible,
-        onEntered: afterShow,
-        onExited: afterClose
-      }, /* @__PURE__ */ React.createElement("div", {
-        ref: nodeRef,
-        style: popStyles,
-        className: popClassName,
-        onClick
-      }, renderTitle(), showChildren && children));
-    };
-    var renderNode = function() {
-      return /* @__PURE__ */ React.createElement(React.Fragment, null, overlay && /* @__PURE__ */ React.createElement(Overlay, {
-        zIndex: index2,
-        style: overlayStyles,
-        className: overlayClassName,
-        visible: innerVisible,
-        closeOnOverlayClick,
-        lockScroll,
-        duration,
-        onClick: handleOverlayClick
-      }), renderPop());
-    };
-    React.useEffect(function() {
-      visible ? open() : close();
-    }, [
-      visible
-    ]);
-    React.useEffect(function() {
-      setTransitionName(transition || "".concat(classPrefix2, "-slide-").concat(position2));
-    }, [
-      position2,
-      transition
-    ]);
-    var resolveContainer = function(getContainer) {
-      return (typeof getContainer === "function" ? getContainer() : getContainer) || document.body;
-    };
-    var renderToContainer = function(getContainer, node) {
-      if (getContainer) {
-        var container = resolveContainer(getContainer);
-        return /* @__PURE__ */ ReactDOM.createPortal(node, container);
-      }
-      return node;
-    };
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, renderToContainer(portal, renderNode()));
-  };
-  Popup.displayName = "NutPopup";
-  var handleClick = function(e2) {
-    e2.stopPropagation();
-    var isIcon = e2.target.className.includes("arrow-icon");
-    var isTitle = e2.target.className.includes("-title") || isIcon;
-    var currentClass = e2.currentTarget.className;
-    var isShow = currentClass.includes("sidenavbar-show");
-    var arrowIcon = e2.currentTarget.querySelector(".arrow-icon");
-    var iconClass = arrowIcon.className;
-    if (isTitle) {
-      e2.currentTarget.className = isShow ? currentClass.replace("sidenavbar-show", "sidenavbar-hide") : currentClass.replace("sidenavbar-hide", "sidenavbar-show");
-      arrowIcon.className = isShow ? iconClass.replace("arrow-down", "arrow-up") : iconClass.replace("arrow-up", "arrow-down");
-    }
-  };
-  var OffsetContext = React.createContext(20);
-  var defaultProps$1j = _object_spread_props(_object_spread({}, ComponentDefaults), {
-    position: "left",
-    width: "80%"
-  });
-  var SideNavBar = function(props) {
-    React.useEffect(function() {
-      console.warn("Warning: SideNavBar is deprecated and will be removed in future versions. Please use NewComponent SideBar instead.");
-    }, []);
-    var classPrefix2 = "nut-sidenavbar";
-    var _ref = _object_spread({}, defaultProps$1j, props), title = _ref.title, visible = _ref.visible, width2 = _ref.width, position2 = _ref.position, children = _ref.children, className = _ref.className, onClose = _ref.onClose, indent = _ref.indent, rest = _object_without_properties(_ref, [
-      "title",
-      "visible",
-      "width",
-      "position",
-      "children",
-      "className",
-      "onClose",
-      "indent"
-    ]);
-    var innerIndent = indent ? Number(indent) : 20;
-    return /* @__PURE__ */ React.createElement(Popup, {
-      visible,
-      style: {
-        width: width2,
-        height: "100%"
-      },
-      position: position2,
-      onClose
-    }, /* @__PURE__ */ React.createElement("div", _object_spread({
-      className: classNames(classPrefix2, className)
-    }, rest), /* @__PURE__ */ React.createElement("div", {
-      className: "".concat(classPrefix2, "-content")
-    }, /* @__PURE__ */ React.createElement("div", {
-      className: "".concat(classPrefix2, "-list sidenavbar-show"),
-      onClick: handleClick
-    }, /* @__PURE__ */ React.createElement("div", {
-      className: "".concat(classPrefix2, "-title ").concat(classPrefix2, "-border-bt"),
-      style: {
-        paddingLeft: "".concat(innerIndent, "px")
-      }
-    }, title, " ", /* @__PURE__ */ React.createElement("i", {
-      className: "arrow-icon arrow-down"
-    })), /* @__PURE__ */ React.createElement(OffsetContext.Provider, {
-      value: innerIndent
-    }, /* @__PURE__ */ React.createElement("div", {
-      className: "".concat(classPrefix2, "-content")
-    }, children))))));
-  };
-  SideNavBar.displayName = "NutSideNavBar";
   function mergeProps() {
     for (var _len = arguments.length, items = new Array(_len), _key = 0; _key < _len; _key++) {
       items[_key] = arguments[_key];
@@ -10512,157 +10362,8 @@ Please add \`${key2}Action\` when creating your handler.`);
   };
   SideBar.displayName = "NutSideBar";
   SideBar.Item = SideBarItem;
-  var SideNavBarItem = function(props) {
-    var classPrefix2 = "nut-subsidenavbar";
-    var title = props.title, value2 = props.value;
-    props.children;
-    var onClick = props.onClick, rest = _object_without_properties(props, [
-      "title",
-      "value",
-      "children",
-      "onClick"
-    ]);
-    var clickFn = function(e2) {
-      e2.stopPropagation();
-      onClick && onClick({
-        title,
-        value: value2
-      });
-    };
-    return /* @__PURE__ */ React.createElement("div", _object_spread({
-      className: "".concat(classPrefix2, "-item ").concat(classPrefix2, "-border-bt"),
-      onClick: clickFn
-    }, rest), title);
-  };
-  var defaultProps$1g = {
-    open: true
-  };
-  var SubSideNavBar = function(props) {
-    var classPrefix2 = "nut-subsidenavbar";
-    var _ref = _object_spread({}, defaultProps$1g, props), title = _ref.title, value2 = _ref.value, children = _ref.children, onClick = _ref.onClick, open = _ref.open, rest = _object_without_properties(_ref, [
-      "title",
-      "value",
-      "children",
-      "onClick",
-      "open"
-    ]);
-    var offset = React.useContext(OffsetContext);
-    var listRef = React.useRef(null);
-    var setListLevel = React.useCallback(function(nodeList) {
-      var level = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 1;
-      var titleClass = nodeList[0].className;
-      if (titleClass.includes("".concat(classPrefix2, "-title"))) {
-        var left = offset * (level + 1);
-        nodeList[0].style.paddingLeft = "".concat(left, "px");
-      }
-      var childNodes = nodeList[1] && nodeList[1].children && Array.from(nodeList[1].children).filter(function(item) {
-        return item.nodeType !== 3 && item.nodeType !== 8;
-      });
-      childNodes.forEach(function(item) {
-        var itemClass = item.className;
-        if (itemClass.includes("".concat(classPrefix2, "-item"))) {
-          var left2 = offset * (level + 2);
-          item.style.paddingLeft = "".concat(left2, "px");
-        }
-        if (itemClass.includes("".concat(classPrefix2, "-list"))) {
-          var level1 = item.getAttribute("level") ? Number(item.getAttribute("level")) : 1;
-          level1 += 1;
-          item.setAttribute("level", level1.toString());
-          item.children && setListLevel(item.children, level1);
-        }
-      });
-    }, [
-      offset
-    ]);
-    var clickFn = function(e2) {
-      handleClick(e2);
-      var currentClass = e2.currentTarget.className;
-      var isShow = currentClass.includes("sidenavbar-show");
-      onClick && onClick({
-        title,
-        value: value2,
-        isShow
-      });
-    };
-    React.useEffect(function() {
-      var _listRef_current, _listRef_current1;
-      var childNodes = (_listRef_current = listRef.current) === null || _listRef_current === void 0 ? void 0 : _listRef_current.children;
-      (_listRef_current1 = listRef.current) === null || _listRef_current1 === void 0 ? void 0 : _listRef_current1.setAttribute("level", "1");
-      childNodes && setListLevel(childNodes);
-    }, [
-      setListLevel
-    ]);
-    var divClass = open ? "".concat(classPrefix2, "-list sidenavbar-show") : "".concat(classPrefix2, "-list sidenavbar-hide");
-    var iconClass = open ? "arrow-icon arrow-down" : "arrow-icon arrow-up";
-    return /* @__PURE__ */ React.createElement("div", _object_spread({
-      className: divClass,
-      ref: listRef,
-      onClick: clickFn
-    }, rest), /* @__PURE__ */ React.createElement("div", {
-      className: "".concat(classPrefix2, "-title ").concat(classPrefix2, "-border-bt")
-    }, title, " ", /* @__PURE__ */ React.createElement("i", {
-      className: iconClass
-    })), /* @__PURE__ */ React.createElement("div", {
-      className: "".concat(classPrefix2, "-content")
-    }, children));
-  };
-  function _type_of(obj) {
-    "@swc/helpers - typeof";
-    return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj;
-  }
-  var defaultProps$1f = _object_spread_props(_object_spread({}, ComponentDefaults), {
-    value: "",
-    dot: false,
-    max: 99,
-    top: 0,
-    right: 0,
-    fill: "solid",
-    size: "large"
-  });
-  var Badge = function(props) {
-    var isIcon = function isIcon2() {
-      if ((typeof value2 === "undefined" ? "undefined" : _type_of(value2)) === "object" && value2) return value2;
-    };
-    var isNumber = function isNumber2() {
-      if (typeof value2 === "number" && value2) return value2;
-    };
-    var isString = function isString2() {
-      if (typeof value2 === "string" && value2) return value2;
-    };
-    var _this;
-    var rtl = useRtl();
-    var _$_object_spread = _object_spread({}, defaultProps$1f, props), className = _$_object_spread.className, style = _$_object_spread.style, value2 = _$_object_spread.value, max = _$_object_spread.max, children = _$_object_spread.children, dot = _$_object_spread.dot, top = _$_object_spread.top, right = _$_object_spread.right, fill = _$_object_spread.fill, size = _$_object_spread.size;
-    var classPrefix2 = "nut-badge";
-    var classes = classNames(classPrefix2, className);
-    var getContent = function() {
-      if (dot || value2 === 0) return null;
-      if (typeof value2 === "number") {
-        return max < value2 ? "".concat(max, "+") : "".concat(value2);
-      }
-      return value2;
-    };
-    var _obj;
-    var contentClasses = classNames((_obj = {}, _define_property(_obj, "".concat(classPrefix2, "-sup"), isNumber() || isString() || dot), _define_property(_obj, "".concat(classPrefix2, "-number"), isNumber()), _define_property(_obj, "".concat(classPrefix2, "-one"), typeof getContent() === "string" && ((_this = "".concat(getContent())) === null || _this === void 0 ? void 0 : _this.length) === 1), _define_property(_obj, "".concat(classPrefix2, "-dot"), dot), _define_property(_obj, "".concat(classPrefix2, "-dot-").concat(size), dot), _define_property(_obj, "".concat(classPrefix2, "-").concat(fill), fill === "outline"), _define_property(_obj, "".concat(classPrefix2, "-content"), children), _obj));
-    var getPositionStyle = function() {
-      return _define_property({
-        top: "".concat(Number(top) || 0, "px")
-      }, rtl ? "left" : "right", "".concat(Number(right) || 0, "px"));
-    };
-    var _obj1;
-    return /* @__PURE__ */ React.createElement("div", {
-      className: classes,
-      style
-    }, isIcon() && /* @__PURE__ */ React.createElement("div", {
-      className: classNames("".concat(classPrefix2, "-content"), (_obj1 = {}, _define_property(_obj1, "".concat(classPrefix2, "-icon"), true), _define_property(_obj1, "".concat(classPrefix2, "-icon-rtl"), rtl), _obj1)),
-      style: getPositionStyle()
-    }, value2), children, !isIcon() && (getContent() || dot) && /* @__PURE__ */ React.createElement("div", {
-      className: contentClasses,
-      style: getPositionStyle()
-    }, getContent()));
-  };
-  Badge.displayName = "NutBadge";
   const TabbarContext = React.createContext(null);
-  var defaultProps$1e = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1g = _object_spread_props(_object_spread({}, ComponentDefaults), {
     title: "",
     icon: null,
     value: "",
@@ -10673,7 +10374,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   });
   var TabbarItem = function(props) {
     var ctx2 = React.useContext(TabbarContext);
-    var _ref = _object_spread({}, defaultProps$1e, props), className = _ref.className, style = _ref.style, title = _ref.title, icon = _ref.icon, value2 = _ref.value, dot = _ref.dot, max = _ref.max, top = _ref.top, right = _ref.right, index2 = _ref.index, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$1g, props), className = _ref.className, style = _ref.style, title = _ref.title, icon = _ref.icon, value2 = _ref.value, dot = _ref.dot, max = _ref.max, top = _ref.top, right = _ref.right, index2 = _ref.index, rest = _object_without_properties(_ref, [
       "className",
       "style",
       "title",
@@ -10715,7 +10416,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       className: boxPrefix
     }, icon)), renderTitleText()) : /* @__PURE__ */ React.createElement(Badge, badgeProps, renderTitleText()));
   };
-  var defaultProps$1d = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1f = _object_spread_props(_object_spread({}, ComponentDefaults), {
     defaultValue: 0,
     fixed: false,
     inactiveColor: "",
@@ -10725,7 +10426,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     }
   });
   var Tabbar = function(props) {
-    var _$_object_spread = _object_spread({}, defaultProps$1d, props), children = _$_object_spread.children, defaultValue = _$_object_spread.defaultValue, value2 = _$_object_spread.value, fixed = _$_object_spread.fixed, activeColor = _$_object_spread.activeColor, inactiveColor = _$_object_spread.inactiveColor, safeArea = _$_object_spread.safeArea, className = _$_object_spread.className, style = _$_object_spread.style, onSwitch = _$_object_spread.onSwitch;
+    var _$_object_spread = _object_spread({}, defaultProps$1f, props), children = _$_object_spread.children, defaultValue = _$_object_spread.defaultValue, value2 = _$_object_spread.value, fixed = _$_object_spread.fixed, activeColor = _$_object_spread.activeColor, inactiveColor = _$_object_spread.inactiveColor, safeArea = _$_object_spread.safeArea, className = _$_object_spread.className, style = _$_object_spread.style, onSwitch = _$_object_spread.onSwitch;
     var classPrefix2 = "nut-tabbar";
     var _usePropsValue = _sliced_to_array(usePropsValue({
       value: value2,
@@ -10756,13 +10457,13 @@ Please add \`${key2}Action\` when creating your handler.`);
   };
   Tabbar.displayName = "NutTabbar";
   Tabbar.Item = TabbarItem;
-  var defaultProps$1c = {
+  var defaultProps$1e = {
     title: "",
     value: "",
     disabled: false
   };
   var TabPane = function(props) {
-    var _$_object_spread = _object_spread({}, defaultProps$1c, props), children = _$_object_spread.children, autoHeightClassName = _$_object_spread.autoHeightClassName, className = _$_object_spread.className, disabled = _$_object_spread.disabled;
+    var _$_object_spread = _object_spread({}, defaultProps$1e, props), children = _$_object_spread.children, autoHeightClassName = _$_object_spread.autoHeightClassName, className = _$_object_spread.className, disabled = _$_object_spread.disabled;
     var classPrefix2 = "nut-tabpane";
     var classes = classNames(classPrefix2, {
       active: !disabled && props.active
@@ -10771,7 +10472,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       className: classes
     }, !disabled && children);
   };
-  var defaultProps$1b = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1d = _object_spread_props(_object_spread({}, ComponentDefaults), {
     tabStyle: {},
     activeColor: "",
     direction: "horizontal",
@@ -10782,7 +10483,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   var classPrefix$k = "nut-tabs";
   var Tabs = function(props) {
     var rtl = useRtl();
-    var _ref = _object_spread({}, defaultProps$1b, props), activeColor = _ref.activeColor, tabStyle = _ref.tabStyle, direction = _ref.direction, activeType = _ref.activeType, duration = _ref.duration, align = _ref.align, title = _ref.title, children = _ref.children, onClick = _ref.onClick, onChange = _ref.onChange, className = _ref.className, autoHeight = _ref.autoHeight, outerValue = _ref.value, outerDefaultValue = _ref.defaultValue, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$1d, props), activeColor = _ref.activeColor, tabStyle = _ref.tabStyle, direction = _ref.direction, activeType = _ref.activeType, duration = _ref.duration, align = _ref.align, title = _ref.title, children = _ref.children, onClick = _ref.onClick, onChange = _ref.onChange, className = _ref.className, autoHeight = _ref.autoHeight, outerValue = _ref.value, outerDefaultValue = _ref.defaultValue, rest = _object_without_properties(_ref, [
       "activeColor",
       "tabStyle",
       "direction",
@@ -10947,6 +10648,154 @@ Please add \`${key2}Action\` when creating your handler.`);
   };
   Tabs.displayName = "NutTabs";
   Tabs.TabPane = TabPane;
+  var defaultProps$1c = _object_spread_props(_object_spread({}, defaultOverlayProps), {
+    position: "center",
+    transition: "",
+    overlayStyle: {},
+    overlayClassName: "",
+    closeable: false,
+    closeIconPosition: "top-right",
+    closeIcon: "close",
+    destroyOnClose: false,
+    portal: null,
+    overlay: true,
+    round: false,
+    onOpen: function() {
+    },
+    onClose: function() {
+    },
+    onOverlayClick: function() {
+      return true;
+    },
+    onCloseIconClick: function() {
+      return true;
+    }
+  });
+  var _zIndex = 1100;
+  var Popup = function(props) {
+    var _$_object_spread = _object_spread({}, defaultProps$1c, props), children = _$_object_spread.children, visible = _$_object_spread.visible, overlay = _$_object_spread.overlay, closeOnOverlayClick = _$_object_spread.closeOnOverlayClick, overlayStyle = _$_object_spread.overlayStyle, overlayClassName = _$_object_spread.overlayClassName, zIndex = _$_object_spread.zIndex, lockScroll = _$_object_spread.lockScroll, duration = _$_object_spread.duration, closeable = _$_object_spread.closeable, closeIconPosition = _$_object_spread.closeIconPosition, closeIcon = _$_object_spread.closeIcon, left = _$_object_spread.left, title = _$_object_spread.title, description = _$_object_spread.description, style = _$_object_spread.style, transition = _$_object_spread.transition, round = _$_object_spread.round, position2 = _$_object_spread.position, className = _$_object_spread.className, destroyOnClose = _$_object_spread.destroyOnClose, portal = _$_object_spread.portal, onOpen = _$_object_spread.onOpen, onClose = _$_object_spread.onClose, onOverlayClick = _$_object_spread.onOverlayClick, onCloseIconClick = _$_object_spread.onCloseIconClick, afterShow = _$_object_spread.afterShow, afterClose = _$_object_spread.afterClose, onClick = _$_object_spread.onClick;
+    var nodeRef = React.useRef(null);
+    var innerIndex = zIndex || _zIndex;
+    var _useState = _sliced_to_array(React.useState(innerIndex), 2), index2 = _useState[0], setIndex = _useState[1];
+    var _useState1 = _sliced_to_array(React.useState(visible), 2), innerVisible = _useState1[0], setInnerVisible = _useState1[1];
+    var _useState2 = _sliced_to_array(React.useState(true), 2), showChildren = _useState2[0], setShowChildren = _useState2[1];
+    var _useState3 = _sliced_to_array(React.useState(""), 2), transitionName = _useState3[0], setTransitionName = _useState3[1];
+    useLockScroll(nodeRef, innerVisible && lockScroll);
+    var classPrefix2 = "nut-popup";
+    var overlayStyles = _object_spread({}, overlayStyle);
+    var popStyles = _object_spread_props(_object_spread({}, style), {
+      zIndex: index2
+    });
+    var _obj;
+    var popClassName = classNames(classPrefix2, (_obj = {}, _define_property(_obj, "".concat(classPrefix2, "-round"), round || position2 === "bottom"), _define_property(_obj, "".concat(classPrefix2, "-").concat(position2), true), _obj), className);
+    var open = function() {
+      if (!innerVisible) {
+        setInnerVisible(true);
+        setIndex(++innerIndex);
+      }
+      if (destroyOnClose) {
+        setShowChildren(true);
+      }
+      onOpen && onOpen();
+    };
+    var close = function() {
+      if (innerVisible) {
+        setInnerVisible(false);
+        if (destroyOnClose) {
+          setTimeout(function() {
+            setShowChildren(false);
+          }, Number(duration));
+        }
+        onClose && onClose();
+      }
+    };
+    var handleOverlayClick = function(e2) {
+      e2.stopPropagation();
+      if (closeOnOverlayClick && onOverlayClick(e2)) {
+        close();
+      }
+    };
+    var handleCloseIconClick = function(e2) {
+      onCloseIconClick(e2) && close();
+    };
+    var renderCloseIcon = function() {
+      var closeClasses = classNames("".concat(classPrefix2, "-title-right"), "".concat(classPrefix2, "-title-right-").concat(closeIconPosition));
+      return /* @__PURE__ */ React.createElement(React.Fragment, null, closeable && /* @__PURE__ */ React.createElement("div", {
+        className: closeClasses,
+        onClick: handleCloseIconClick
+      }, /* @__PURE__ */ React.isValidElement(closeIcon) ? closeIcon : /* @__PURE__ */ React.createElement(n$6, null)));
+    };
+    var renderTitle = function() {
+      if (left || title || description) {
+        return /* @__PURE__ */ React.createElement("div", {
+          className: "".concat(classPrefix2, "-title")
+        }, position2 === "bottom" && /* @__PURE__ */ React.createElement(React.Fragment, null, left && /* @__PURE__ */ React.createElement("div", {
+          className: "".concat(classPrefix2, "-title-left")
+        }, left), (title || description) && /* @__PURE__ */ React.createElement("div", {
+          className: "".concat(classPrefix2, "-title-wrapper")
+        }, title && /* @__PURE__ */ React.createElement("div", {
+          className: "".concat(classPrefix2, "-title-title")
+        }, title), description && /* @__PURE__ */ React.createElement("div", {
+          className: "".concat(classPrefix2, "-title-description ").concat(title ? "".concat(classPrefix2, "-title-description-gap") : "")
+        }, description))), renderCloseIcon());
+      }
+      if (closeable) {
+        return renderCloseIcon();
+      }
+    };
+    var renderPop = function() {
+      return /* @__PURE__ */ React.createElement(CSSTransition, {
+        nodeRef,
+        classNames: transitionName,
+        mountOnEnter: true,
+        unmountOnExit: destroyOnClose,
+        timeout: duration,
+        in: innerVisible,
+        onEntered: afterShow,
+        onExited: afterClose
+      }, /* @__PURE__ */ React.createElement("div", {
+        ref: nodeRef,
+        style: popStyles,
+        className: popClassName,
+        onClick
+      }, renderTitle(), showChildren && children));
+    };
+    var renderNode = function() {
+      return /* @__PURE__ */ React.createElement(React.Fragment, null, overlay && /* @__PURE__ */ React.createElement(Overlay, {
+        zIndex: index2,
+        style: overlayStyles,
+        className: overlayClassName,
+        visible: innerVisible,
+        closeOnOverlayClick,
+        lockScroll,
+        duration,
+        onClick: handleOverlayClick
+      }), renderPop());
+    };
+    React.useEffect(function() {
+      visible ? open() : close();
+    }, [
+      visible
+    ]);
+    React.useEffect(function() {
+      setTransitionName(transition || "".concat(classPrefix2, "-slide-").concat(position2));
+    }, [
+      position2,
+      transition
+    ]);
+    var resolveContainer = function(getContainer) {
+      return (typeof getContainer === "function" ? getContainer() : getContainer) || document.body;
+    };
+    var renderToContainer = function(getContainer, node) {
+      if (getContainer) {
+        var container = resolveContainer(getContainer);
+        return /* @__PURE__ */ ReactDOM.createPortal(node, container);
+      }
+      return node;
+    };
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, renderToContainer(portal, renderNode()));
+  };
+  Popup.displayName = "NutPopup";
   function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key2, arg) {
     try {
       var info = gen[key2](arg);
@@ -11042,17 +10891,6 @@ Please add \`${key2}Action\` when creating your handler.`);
       return { value: op[0] ? op[1] : void 0, done: true };
     }
   }
-  function __values(o) {
-    var s2 = typeof Symbol === "function" && Symbol.iterator, m2 = s2 && o[s2], i2 = 0;
-    if (m2) return m2.call(o);
-    if (o && typeof o.length === "number") return {
-      next: function() {
-        if (o && i2 >= o.length) o = void 0;
-        return { value: o && o[i2++], done: !o };
-      }
-    };
-    throw new TypeError(s2 ? "Object is not iterable." : "Symbol.iterator is not defined.");
-  }
   typeof SuppressedError === "function" ? SuppressedError : function(error, suppressed, message) {
     var e2 = new Error(message);
     return e2.name = "SuppressedError", e2.error = error, e2.suppressed = suppressed, e2;
@@ -11231,7 +11069,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     ]);
     return Tree2;
   }();
-  var defaultProps$1a = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1b = _object_spread_props(_object_spread({}, ComponentDefaults), {
     activeColor: "",
     activeIcon: "checklist",
     popup: true,
@@ -11257,7 +11095,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   });
   var InternalCascader = function(props, ref) {
     var locale = useConfig().locale;
-    var _$_object_spread = _object_spread({}, defaultProps$1a, props), className = _$_object_spread.className, style = _$_object_spread.style, activeColor = _$_object_spread.activeColor, activeIcon = _$_object_spread.activeIcon, popup = _$_object_spread.popup, _object_spread_popupProps = _$_object_spread.popupProps, popupProps = _object_spread_popupProps === void 0 ? {} : _object_spread_popupProps, visible = _$_object_spread.visible, options2 = _$_object_spread.options, value2 = _$_object_spread.value, defaultValue = _$_object_spread.defaultValue, optionKey = _$_object_spread.optionKey, format2 = _$_object_spread.format, closeable = _$_object_spread.closeable, closeIconPosition = _$_object_spread.closeIconPosition, closeIcon = _$_object_spread.closeIcon, lazy = _$_object_spread.lazy, title = _$_object_spread.title, left = _$_object_spread.left, onLoad = _$_object_spread.onLoad, onClose = _$_object_spread.onClose, onChange = _$_object_spread.onChange, onPathChange = _$_object_spread.onPathChange;
+    var _$_object_spread = _object_spread({}, defaultProps$1b, props), className = _$_object_spread.className, style = _$_object_spread.style, activeColor = _$_object_spread.activeColor, activeIcon = _$_object_spread.activeIcon, popup = _$_object_spread.popup, _object_spread_popupProps = _$_object_spread.popupProps, popupProps = _object_spread_popupProps === void 0 ? {} : _object_spread_popupProps, visible = _$_object_spread.visible, options2 = _$_object_spread.options, value2 = _$_object_spread.value, defaultValue = _$_object_spread.defaultValue, optionKey = _$_object_spread.optionKey, format2 = _$_object_spread.format, closeable = _$_object_spread.closeable, closeIconPosition = _$_object_spread.closeIconPosition, closeIcon = _$_object_spread.closeIcon, lazy = _$_object_spread.lazy, title = _$_object_spread.title, left = _$_object_spread.left, onLoad = _$_object_spread.onLoad, onClose = _$_object_spread.onClose, onChange = _$_object_spread.onChange, onPathChange = _$_object_spread.onPathChange;
     var _useState = _sliced_to_array(React.useState("c1"), 2), tabvalue = _useState[0], setTabvalue = _useState[1];
     var _useState1 = _sliced_to_array(React.useState([]), 2), optionsData = _useState1[0], setOptionsData = _useState1[1];
     var isLazy = function() {
@@ -11712,7 +11550,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   };
   var Cascader = /* @__PURE__ */ React.forwardRef(InternalCascader);
   Cascader.displayName = "NutCascader";
-  var defaultProps$19 = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1a = _object_spread_props(_object_spread({}, ComponentDefaults), {
     visible: false,
     type: "custom",
     options: [],
@@ -11725,7 +11563,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     height: "200px"
   });
   var CustomRender = function(props) {
-    var _ref = _object_spread({}, defaultProps$19, props);
+    var _ref = _object_spread({}, defaultProps$1a, props);
     _ref.children;
     var visible = _ref.visible, type2 = _ref.type;
     _ref.height;
@@ -11763,7 +11601,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       onPathChange
     }, rest)));
   };
-  var defaultProps$18 = {
+  var defaultProps$19 = {
     type: "custom",
     existList: [],
     defaultIcon: null,
@@ -11772,7 +11610,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   };
   var ExistRender = function(props) {
     var locale = useConfig().locale;
-    var _ref = _object_spread({}, defaultProps$18, props);
+    var _ref = _object_spread({}, defaultProps$19, props);
     _ref.children;
     var type2 = _ref.type, existList = _ref.existList, selectIcon = _ref.selectIcon, defaultIcon = _ref.defaultIcon, custom = _ref.custom, onSelect = _ref.onSelect, onSwitch = _ref.onSwitch;
     _object_without_properties(_ref, [
@@ -11821,7 +11659,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       className: "".concat(classPrefix2, "-footer-btn")
     }, custom)));
   };
-  var defaultProps$17 = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$18 = _object_spread_props(_object_spread({}, ComponentDefaults), {
     defaultValue: [],
     type: "custom",
     options: [],
@@ -11841,7 +11679,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   });
   var InternalAddress = function(props, ref) {
     var locale = useConfig().locale;
-    var _ref = _object_spread({}, defaultProps$17, props), style = _ref.style, className = _ref.className, visible = _ref.visible, defaultVisible = _ref.defaultVisible, defaultValue = _ref.defaultValue;
+    var _ref = _object_spread({}, defaultProps$18, props), style = _ref.style, className = _ref.className, visible = _ref.visible, defaultVisible = _ref.defaultVisible, defaultValue = _ref.defaultValue;
     _ref.children;
     var type2 = _ref.type, options2 = _ref.options, optionKey = _ref.optionKey, format2 = _ref.format, height2 = _ref.height, title = _ref.title, existList = _ref.existList, custom = _ref.custom, selectIcon = _ref.selectIcon, defaultIcon = _ref.defaultIcon, closeIcon = _ref.closeIcon, backIcon = _ref.backIcon, onChange = _ref.onChange, onExistSelect = _ref.onExistSelect, onClose = _ref.onClose, onSwitch = _ref.onSwitch;
     _object_without_properties(_ref, [
@@ -12225,7 +12063,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   var isStartAndEnd = function(days) {
     return days.length >= 2 && Utils.isEqual(days[0], days[1]);
   };
-  var defaultProps$16 = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$17 = _object_spread_props(_object_spread({}, ComponentDefaults), {
     type: "single",
     autoBackfill: false,
     popup: true,
@@ -12258,7 +12096,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   });
   var CalendarItem = /* @__PURE__ */ React.forwardRef(function(props, ref) {
     var locale = useConfig().locale;
-    var _$_object_spread = _object_spread({}, defaultProps$16, props), style = _$_object_spread.style, className = _$_object_spread.className, children = _$_object_spread.children, popup = _$_object_spread.popup, type2 = _$_object_spread.type, autoBackfill = _$_object_spread.autoBackfill, title = _$_object_spread.title, defaultValue = _$_object_spread.defaultValue, startDate = _$_object_spread.startDate, endDate = _$_object_spread.endDate, showToday = _$_object_spread.showToday, startText = _$_object_spread.startText, endText = _$_object_spread.endText, confirmText = _$_object_spread.confirmText, showTitle = _$_object_spread.showTitle, showSubTitle = _$_object_spread.showSubTitle, scrollAnimation = _$_object_spread.scrollAnimation, firstDayOfWeek = _$_object_spread.firstDayOfWeek, disableDate = _$_object_spread.disableDate, renderHeaderButtons = _$_object_spread.renderHeaderButtons, renderBottomButton = _$_object_spread.renderBottomButton, renderDay = _$_object_spread.renderDay, renderDayTop = _$_object_spread.renderDayTop, renderDayBottom = _$_object_spread.renderDayBottom, value2 = _$_object_spread.value, onConfirm = _$_object_spread.onConfirm, onUpdate = _$_object_spread.onUpdate, onDayClick = _$_object_spread.onDayClick, onPageChange = _$_object_spread.onPageChange;
+    var _$_object_spread = _object_spread({}, defaultProps$17, props), style = _$_object_spread.style, className = _$_object_spread.className, children = _$_object_spread.children, popup = _$_object_spread.popup, type2 = _$_object_spread.type, autoBackfill = _$_object_spread.autoBackfill, title = _$_object_spread.title, defaultValue = _$_object_spread.defaultValue, startDate = _$_object_spread.startDate, endDate = _$_object_spread.endDate, showToday = _$_object_spread.showToday, startText = _$_object_spread.startText, endText = _$_object_spread.endText, confirmText = _$_object_spread.confirmText, showTitle = _$_object_spread.showTitle, showSubTitle = _$_object_spread.showSubTitle, scrollAnimation = _$_object_spread.scrollAnimation, firstDayOfWeek = _$_object_spread.firstDayOfWeek, disableDate = _$_object_spread.disableDate, renderHeaderButtons = _$_object_spread.renderHeaderButtons, renderBottomButton = _$_object_spread.renderBottomButton, renderDay = _$_object_spread.renderDay, renderDayTop = _$_object_spread.renderDayTop, renderDayBottom = _$_object_spread.renderDayBottom, value2 = _$_object_spread.value, onConfirm = _$_object_spread.onConfirm, onUpdate = _$_object_spread.onUpdate, onDayClick = _$_object_spread.onDayClick, onPageChange = _$_object_spread.onPageChange;
     var weekdays = locale.calendaritem.weekdays;
     var weeks = _to_consumable_array(weekdays.slice(firstDayOfWeek, 7)).concat(_to_consumable_array(weekdays.slice(0, firstDayOfWeek)));
     var monthTitle = locale.calendaritem.monthTitle;
@@ -12818,7 +12656,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     }, renderHeader(), renderContent(), popup && !autoBackfill ? renderFooter() : "");
   });
   CalendarItem.displayName = "NutCalendarItem";
-  var defaultProps$15 = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$16 = _object_spread_props(_object_spread({}, ComponentDefaults), {
     type: "single",
     autoBackfill: false,
     popup: true,
@@ -12853,7 +12691,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   });
   var Calendar = /* @__PURE__ */ React.forwardRef(function(props, ref) {
     var locale = useConfig().locale;
-    var _$_object_spread = _object_spread({}, defaultProps$15, props), style = _$_object_spread.style, className = _$_object_spread.className, children = _$_object_spread.children, popup = _$_object_spread.popup, visible = _$_object_spread.visible, type2 = _$_object_spread.type, autoBackfill = _$_object_spread.autoBackfill, title = _$_object_spread.title, defaultValue = _$_object_spread.defaultValue, startDate = _$_object_spread.startDate, endDate = _$_object_spread.endDate, showToday = _$_object_spread.showToday, startText = _$_object_spread.startText, endText = _$_object_spread.endText, confirmText = _$_object_spread.confirmText, showTitle = _$_object_spread.showTitle, showSubTitle = _$_object_spread.showSubTitle, scrollAnimation = _$_object_spread.scrollAnimation, firstDayOfWeek = _$_object_spread.firstDayOfWeek, closeIcon = _$_object_spread.closeIcon, disableDate = _$_object_spread.disableDate, renderHeaderButtons = _$_object_spread.renderHeaderButtons, renderBottomButton = _$_object_spread.renderBottomButton, renderDay = _$_object_spread.renderDay, renderDayTop = _$_object_spread.renderDayTop, renderDayBottom = _$_object_spread.renderDayBottom, onClose = _$_object_spread.onClose, onConfirm = _$_object_spread.onConfirm, onDayClick = _$_object_spread.onDayClick, onPageChange = _$_object_spread.onPageChange;
+    var _$_object_spread = _object_spread({}, defaultProps$16, props), style = _$_object_spread.style, className = _$_object_spread.className, children = _$_object_spread.children, popup = _$_object_spread.popup, visible = _$_object_spread.visible, type2 = _$_object_spread.type, autoBackfill = _$_object_spread.autoBackfill, title = _$_object_spread.title, defaultValue = _$_object_spread.defaultValue, startDate = _$_object_spread.startDate, endDate = _$_object_spread.endDate, showToday = _$_object_spread.showToday, startText = _$_object_spread.startText, endText = _$_object_spread.endText, confirmText = _$_object_spread.confirmText, showTitle = _$_object_spread.showTitle, showSubTitle = _$_object_spread.showSubTitle, scrollAnimation = _$_object_spread.scrollAnimation, firstDayOfWeek = _$_object_spread.firstDayOfWeek, closeIcon = _$_object_spread.closeIcon, disableDate = _$_object_spread.disableDate, renderHeaderButtons = _$_object_spread.renderHeaderButtons, renderBottomButton = _$_object_spread.renderBottomButton, renderDay = _$_object_spread.renderDay, renderDayTop = _$_object_spread.renderDayTop, renderDayBottom = _$_object_spread.renderDayBottom, onClose = _$_object_spread.onClose, onConfirm = _$_object_spread.onConfirm, onDayClick = _$_object_spread.onDayClick, onPageChange = _$_object_spread.onPageChange;
     var calendarRef = React.useRef(null);
     var close = function() {
       onClose && onClose();
@@ -13020,14 +12858,14 @@ Please add \`${key2}Action\` when creating your handler.`);
       convertDateToDay(new Date(current.getTime() + 24 * 60 * 60 * 1e3 * (6 - count)))
     ];
   };
-  var defaultProps$14 = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$15 = _object_spread_props(_object_spread({}, ComponentDefaults), {
     type: "single",
     firstDayOfWeek: 0
   });
   var prefixCls = "nut-calendarcard";
   var CalendarCard = /* @__PURE__ */ React.forwardRef(function(props, ref) {
     var locale = useConfig().locale;
-    var _$_object_spread = _object_spread({}, defaultProps$14, props), style = _$_object_spread.style, className = _$_object_spread.className, type2 = _$_object_spread.type, value2 = _$_object_spread.value, defaultValue = _$_object_spread.defaultValue, firstDayOfWeek = _$_object_spread.firstDayOfWeek, startDate = _$_object_spread.startDate, endDate = _$_object_spread.endDate, disableDay = _$_object_spread.disableDay, renderDay = _$_object_spread.renderDay, renderDayTop = _$_object_spread.renderDayTop, renderDayBottom = _$_object_spread.renderDayBottom, onDayClick = _$_object_spread.onDayClick, onPageChange = _$_object_spread.onPageChange, onChange = _$_object_spread.onChange;
+    var _$_object_spread = _object_spread({}, defaultProps$15, props), style = _$_object_spread.style, className = _$_object_spread.className, type2 = _$_object_spread.type, value2 = _$_object_spread.value, defaultValue = _$_object_spread.defaultValue, firstDayOfWeek = _$_object_spread.firstDayOfWeek, startDate = _$_object_spread.startDate, endDate = _$_object_spread.endDate, disableDay = _$_object_spread.disableDay, renderDay = _$_object_spread.renderDay, renderDayTop = _$_object_spread.renderDayTop, renderDayBottom = _$_object_spread.renderDayBottom, onDayClick = _$_object_spread.onDayClick, onPageChange = _$_object_spread.onPageChange, onChange = _$_object_spread.onChange;
     var _useState = _sliced_to_array(React.useState(function() {
       var date2 = new Date(Date.now());
       var val2 = value2 || defaultValue;
@@ -13405,7 +13243,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   });
   CalendarCard.displayName = "NutCalendarCard";
   var CheckboxGroupContext = React.createContext(null);
-  var defaultProps$13 = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$14 = _object_spread_props(_object_spread({}, ComponentDefaults), {
     disabled: false,
     shape: "round",
     labelPosition: "right",
@@ -13417,7 +13255,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   });
   var classPrefix$j = "nut-checkbox";
   var Checkbox = function(props) {
-    var children = _object_spread({}, defaultProps$13, props).children;
+    var children = _object_spread({}, defaultProps$14, props).children;
     var icon = props.icon, label = props.label, className = props.className, activeIcon = props.activeIcon, checked = props.checked, value2 = props.value, defaultChecked = props.defaultChecked, shape = props.shape, disabled = props.disabled, onChange = props.onChange, indeterminate = props.indeterminate, indeterminateIcon = props.indeterminateIcon, others = _object_without_properties(props, [
       "icon",
       "label",
@@ -13522,7 +13360,7 @@ Please add \`${key2}Action\` when creating your handler.`);
         className: classNames("".concat(classPrefix$j, "-label "), _define_property({}, "".concat(classPrefix$j, "-label-disabled"), innerDisabled))
       }, children || label);
     };
-    var handleClick2 = function() {
+    var handleClick = function() {
       if (disabled) return;
       var latestChecked = !innerChecked;
       setChecked(latestChecked);
@@ -13551,11 +13389,11 @@ Please add \`${key2}Action\` when creating your handler.`);
     return /* @__PURE__ */ React.createElement("div", _object_spread_props(_object_spread({
       className: classNames(classPrefix$j, (_obj = {}, _define_property(_obj, "".concat(classPrefix$j, "-reverse"), labelPosition === "left"), _define_property(_obj, "nut-checkbox-list-item", ctx2 === null || ctx2 === void 0 ? void 0 : ctx2.list), _obj), className)
     }, rest), {
-      onClick: handleClick2
+      onClick: handleClick
     }), renderCheckboxItem());
   };
   Checkbox.displayName = "NutCheckBox";
-  var defaultProps$12 = {
+  var defaultProps$13 = {
     max: void 0,
     min: void 0,
     list: false,
@@ -13569,7 +13407,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   };
   var classPrefix$i = "nut-checkboxgroup";
   var CheckboxGroup = /* @__PURE__ */ React.forwardRef(function(props, ref) {
-    var _ref = _object_spread({}, defaultProps$12, props), children = _ref.children, className = _ref.className, disabled = _ref.disabled, list = _ref.list, value2 = _ref.value, defaultValue = _ref.defaultValue, max = _ref.max, min = _ref.min, labelPosition = _ref.labelPosition, direction = _ref.direction, options2 = _ref.options, onChange = _ref.onChange, onLimit = _ref.onLimit, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$13, props), children = _ref.children, className = _ref.className, disabled = _ref.disabled, list = _ref.list, value2 = _ref.value, defaultValue = _ref.defaultValue, max = _ref.max, min = _ref.min, labelPosition = _ref.labelPosition, direction = _ref.direction, options2 = _ref.options, onChange = _ref.onChange, onLimit = _ref.onLimit, rest = _object_without_properties(_ref, [
       "children",
       "className",
       "disabled",
@@ -13888,7 +13726,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     })));
   };
   var PickerRoller = /* @__PURE__ */ React.forwardRef(InternalPickerRoller);
-  var defaultProps$11 = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$12 = _object_spread_props(_object_spread({}, ComponentDefaults), {
     options: [],
     defaultValue: [],
     value: void 0,
@@ -13897,7 +13735,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     }
   });
   var InternalPickerView = function(props, ref) {
-    var _$_object_spread = _object_spread({}, defaultProps$11, props), options2 = _$_object_spread.options, _object_spread_defaultValue = _$_object_spread.defaultValue, defaultValue = _object_spread_defaultValue === void 0 ? [] : _object_spread_defaultValue, value2 = _$_object_spread.value, duration = _$_object_spread.duration, threeDimensional = _$_object_spread.threeDimensional, renderLabel = _$_object_spread.renderLabel, className = _$_object_spread.className, style = _$_object_spread.style, onChange = _$_object_spread.onChange;
+    var _$_object_spread = _object_spread({}, defaultProps$12, props), options2 = _$_object_spread.options, _object_spread_defaultValue = _$_object_spread.defaultValue, defaultValue = _object_spread_defaultValue === void 0 ? [] : _object_spread_defaultValue, value2 = _$_object_spread.value, duration = _$_object_spread.duration, threeDimensional = _$_object_spread.threeDimensional, renderLabel = _$_object_spread.renderLabel, className = _$_object_spread.className, style = _$_object_spread.style, onChange = _$_object_spread.onChange;
     var classPrefix2 = "nut-pickerview";
     var cls = classNames(classPrefix2, className);
     var _usePropsValue = _sliced_to_array(usePropsValue({
@@ -14072,7 +13910,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       reset
     ];
   }
-  var defaultProps$10 = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$11 = _object_spread_props(_object_spread({}, ComponentDefaults), {
     title: "",
     options: [],
     value: void 0,
@@ -14081,7 +13919,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   });
   var InternalPicker$1 = function(props, ref) {
     var locale = useConfig().locale;
-    var _ref = _object_spread({}, defaultProps$10, props), children = _ref.children;
+    var _ref = _object_spread({}, defaultProps$11, props), children = _ref.children;
     _ref.visible;
     var title = _ref.title, _ref_options = _ref.options, options2 = _ref_options === void 0 ? [] : _ref_options, closeOnOverlayClick = _ref.closeOnOverlayClick, _ref_popupProps = _ref.popupProps, popupProps = _ref_popupProps === void 0 ? {} : _ref_popupProps, _ref_defaultValue = _ref.defaultValue, defaultValue = _ref_defaultValue === void 0 ? [] : _ref_defaultValue, className = _ref.className, style = _ref.style, threeDimensional = _ref.threeDimensional, duration = _ref.duration;
     _ref.onConfirm;
@@ -14439,19 +14277,19 @@ Please add \`${key2}Action\` when creating your handler.`);
       handleDateComparison(date1, selectedOptions, index2);
     }
   };
-  var currentYear = (/* @__PURE__ */ new Date()).getFullYear();
-  var defaultProps$$ = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var currentYear$1 = (/* @__PURE__ */ new Date()).getFullYear();
+  var defaultProps$10 = _object_spread_props(_object_spread({}, ComponentDefaults), {
     visible: false,
     title: "",
     type: "date",
     showChinese: false,
     threeDimensional: true,
     minuteStep: 1,
-    startDate: new Date(currentYear - 10, 0, 1),
-    endDate: new Date(currentYear + 10, 11, 31)
+    startDate: new Date(currentYear$1 - 10, 0, 1),
+    endDate: new Date(currentYear$1 + 10, 11, 31)
   });
   var InternalPicker = function(props, ref) {
-    var _ref = _object_spread({}, defaultProps$$, props), startDate = _ref.startDate, endDate = _ref.endDate, type2 = _ref.type, showChinese = _ref.showChinese, minuteStep = _ref.minuteStep;
+    var _ref = _object_spread({}, defaultProps$10, props), startDate = _ref.startDate, endDate = _ref.endDate, type2 = _ref.type, showChinese = _ref.showChinese, minuteStep = _ref.minuteStep;
     _ref.visible;
     var title = _ref.title, defaultValue = _ref.defaultValue, _ref_pickerProps = _ref.pickerProps, pickerProps = _ref_pickerProps === void 0 ? {} : _ref_pickerProps, formatter = _ref.formatter, onClose = _ref.onClose, onCancel = _ref.onCancel, onConfirm = _ref.onConfirm, filter = _ref.filter, onChange = _ref.onChange, threeDimensional = _ref.threeDimensional, className = _ref.className, style = _ref.style, children = _ref.children, rest = _object_without_properties(_ref, [
       "startDate",
@@ -14484,6 +14322,8 @@ Please add \`${key2}Action\` when creating your handler.`);
       minute: lang.min,
       seconds: lang.seconds
     };
+    var classPrefix2 = "nut-datepicker";
+    var cls = classNames(classPrefix2, className);
     var _useState = _sliced_to_array(React.useState([]), 2), pickerValue = _useState[0], setPickerValue = _useState[1];
     var _useState1 = _sliced_to_array(React.useState([]), 2), pickerOptions = _useState1[0], setPickerOptions = _useState1[1];
     var _usePropsValue = _sliced_to_array(usePropsValue({
@@ -14509,10 +14349,9 @@ Please add \`${key2}Action\` when creating your handler.`);
       return actions;
     });
     var handleDateComparison = function(newDate, selectedOptions, index2) {
-      var _this;
-      var isEqual2 = ((_this = new Date(innerDate)) === null || _this === void 0 ? void 0 : _this.getTime()) === (newDate === null || newDate === void 0 ? void 0 : newDate.getTime());
       if (newDate && isDate(newDate)) {
-        if (!isEqual2) {
+        var _this;
+        if (!isEqual$1((_this = new Date(selectedDate)) === null || _this === void 0 ? void 0 : _this.getTime(), newDate === null || newDate === void 0 ? void 0 : newDate.getTime())) {
           setInnerDate(formatValue(newDate, startDate, endDate));
         }
         onChange === null || onChange === void 0 ? void 0 : onChange(selectedOptions, [
@@ -14525,8 +14364,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     var handleConfirmDateComparison = function(newDate) {
       if (newDate && isDate(newDate)) {
         var _this;
-        var isEqual2 = ((_this = new Date(selectedDate)) === null || _this === void 0 ? void 0 : _this.getTime()) === (newDate === null || newDate === void 0 ? void 0 : newDate.getTime());
-        if (!isEqual2) {
+        if (!isEqual$1((_this = new Date(selectedDate)) === null || _this === void 0 ? void 0 : _this.getTime(), newDate === null || newDate === void 0 ? void 0 : newDate.getTime())) {
           setSelectedDate(formatValue(newDate, startDate, endDate));
         }
       }
@@ -14576,7 +14414,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       endDate
     ]);
     return /* @__PURE__ */ React.createElement(React.Fragment, null, typeof children === "function" && children(selectedDate), /* @__PURE__ */ React.createElement("div", _object_spread({
-      className: "nut-datepicker ".concat(className),
+      className: cls,
       style
     }, rest), pickerOptions.length && /* @__PURE__ */ React.createElement(Picker, _object_spread_props(_object_spread({}, pickerProps), {
       title,
@@ -14594,6 +14432,98 @@ Please add \`${key2}Action\` when creating your handler.`);
     }))));
   };
   var DatePicker = /* @__PURE__ */ React.forwardRef(InternalPicker);
+  var currentYear = (/* @__PURE__ */ new Date()).getFullYear();
+  var defaultProps$$ = _object_spread_props(_object_spread({}, ComponentDefaults), {
+    type: "date",
+    showChinese: false,
+    threeDimensional: true,
+    minuteStep: 1,
+    startDate: new Date(currentYear - 10, 0, 1),
+    endDate: new Date(currentYear + 10, 11, 31)
+  });
+  var DatePickerView = function(props) {
+    var _$_object_spread = _object_spread({}, defaultProps$$, props), startDate = _$_object_spread.startDate, endDate = _$_object_spread.endDate, type2 = _$_object_spread.type, showChinese = _$_object_spread.showChinese, minuteStep = _$_object_spread.minuteStep, defaultValue = _$_object_spread.defaultValue, formatter = _$_object_spread.formatter, filter = _$_object_spread.filter, onChange = _$_object_spread.onChange, threeDimensional = _$_object_spread.threeDimensional, className = _$_object_spread.className, style = _$_object_spread.style;
+    var classPrefix2 = "nut-datepickerview";
+    var cls = classNames(classPrefix2, className);
+    var locale = useConfig().locale;
+    var lang = locale.datepicker;
+    var zhCNType = {
+      day: lang.day,
+      year: lang.year,
+      month: lang.month,
+      hour: lang.hour,
+      minute: lang.min,
+      seconds: lang.seconds
+    };
+    var _useState = _sliced_to_array(React.useState([]), 2), pickerValue = _useState[0], setPickerValue = _useState[1];
+    var _useState1 = _sliced_to_array(React.useState([]), 2), pickerOptions = _useState1[0], setPickerOptions = _useState1[1];
+    var _usePropsValue = _sliced_to_array(usePropsValue({
+      value: props.value && formatValue(props.value, startDate, endDate),
+      defaultValue: defaultValue && formatValue(defaultValue, startDate, endDate),
+      finalValue: 0
+    }), 2), selectedDate = _usePropsValue[0], setSelectedDate = _usePropsValue[1];
+    var handleDateComparison = function(newDate, selectedOptions, index2) {
+      if (newDate && isDate(newDate)) {
+        var _this;
+        if (!isEqual$1((_this = new Date(selectedDate)) === null || _this === void 0 ? void 0 : _this.getTime(), newDate === null || newDate === void 0 ? void 0 : newDate.getTime())) {
+          setSelectedDate(formatValue(newDate, startDate, endDate));
+          onChange === null || onChange === void 0 ? void 0 : onChange(selectedOptions, [
+            String(newDate.getFullYear()),
+            padZero(newDate.getMonth() + 1),
+            padZero(newDate.getDate())
+          ], index2);
+        }
+      }
+    };
+    var handleChange = function(selectedOptions, selectedValue, index2) {
+      handlePickerValueChange(selectedOptions, selectedValue, index2, type2, defaultValue || startDate || endDate, handleDateComparison);
+    };
+    var generatePickerColumns = function() {
+      var dateRanges = generateDatePickerRanges(type2, selectedDate, startDate, endDate);
+      var columns = dateRanges.map(function(rangeConfig, columnIndex) {
+        var columnType = rangeConfig.type, range2 = rangeConfig.range;
+        var selectedValue = getDatePartValue(columnType, selectedDate);
+        var pickerColumn = generatePickerColumnWithCallback(range2[0], range2[1], selectedValue, columnType, minuteStep, function(selectedIndex, options2) {
+          var _options_selectedIndex;
+          pickerValue[columnIndex] = (_options_selectedIndex = options2[selectedIndex]) === null || _options_selectedIndex === void 0 ? void 0 : _options_selectedIndex.value;
+          setPickerValue(_to_consumable_array(pickerValue));
+        }, showChinese, zhCNType, formatter);
+        if (filter === null || filter === void 0 ? void 0 : filter(columnType, pickerColumn)) {
+          return filter(columnType, pickerColumn);
+        }
+        return pickerColumn;
+      });
+      return columns || [];
+    };
+    React.useEffect(function() {
+      var _this, _this1;
+      if (!isEqual$1((_this = new Date(selectedDate)) === null || _this === void 0 ? void 0 : _this.getTime(), (_this1 = new Date(selectedDate)) === null || _this1 === void 0 ? void 0 : _this1.getTime())) {
+        setSelectedDate(selectedDate);
+      }
+    }, [
+      selectedDate
+    ]);
+    React.useEffect(function() {
+      setPickerOptions(generatePickerColumns());
+    }, [
+      selectedDate,
+      startDate,
+      endDate
+    ]);
+    return /* @__PURE__ */ React.createElement("div", {
+      className: cls,
+      style
+    }, pickerOptions.length && /* @__PURE__ */ React.createElement(PickerView, {
+      value: pickerValue,
+      options: pickerOptions,
+      onChange: function(param) {
+        var selectedOptions = param.selectedOptions, value2 = param.value, index2 = param.index;
+        handleChange(selectedOptions, value2, index2);
+      },
+      threeDimensional
+    }));
+  };
+  DatePickerView.displayName = "NutDatePickerView";
   var Context = React.createContext({});
   function _extends() {
     _extends = Object.assign ? Object.assign.bind() : function(target) {
@@ -15377,7 +15307,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       pattern: {
         mismatch: "%s value %s does not match pattern %s"
       },
-      clone: function clone() {
+      clone: function clone2() {
         var cloned = JSON.parse(JSON.stringify(this));
         cloned.clone = this.clone;
         return cloned;
@@ -15641,299 +15571,391 @@ Please add \`${key2}Action\` when creating your handler.`);
   Schema.warning = warning;
   Schema.messages = messages;
   Schema.validators = validators;
+  function merge() {
+    for (var _len = arguments.length, items = new Array(_len), _key = 0; _key < _len; _key++) {
+      items[_key] = arguments[_key];
+    }
+    return _merge(items[0] === true, false, items);
+  }
+  function recursive() {
+    for (var _len = arguments.length, items = new Array(_len), _key = 0; _key < _len; _key++) {
+      items[_key] = arguments[_key];
+    }
+    return _merge(items[0] === true, true, items);
+  }
+  function clone(input) {
+    if (Array.isArray(input)) {
+      var output = [];
+      for (var index2 = 0; index2 < input.length; ++index2) output.push(clone(input[index2]));
+      return output;
+    }
+    if (isPlainObject(input)) {
+      var output1 = {};
+      for (var index1 in input) output1[index1] = clone(input[index1]);
+      return output1;
+    }
+    return input;
+  }
+  function isPlainObject(input) {
+    if (input === null || (typeof input === "undefined" ? "undefined" : _type_of(input)) !== "object") return false;
+    if (Object.getPrototypeOf(input) === null) return true;
+    var ref = input;
+    while (Object.getPrototypeOf(ref) !== null) ref = Object.getPrototypeOf(ref);
+    return Object.getPrototypeOf(input) === ref;
+  }
+  function _recursiveMerge(base, extend) {
+    if (!isPlainObject(base) || !isPlainObject(extend)) return extend;
+    for (var key2 in extend) {
+      if (key2 === "__proto__" || key2 === "constructor" || key2 === "prototype") continue;
+      base[key2] = isPlainObject(base[key2]) && isPlainObject(extend[key2]) ? _recursiveMerge(base[key2], extend[key2]) : extend[key2];
+    }
+    return base;
+  }
+  function _merge(isClone, isRecursive, items) {
+    var result;
+    if (isClone || !isPlainObject(result = items.shift())) result = {};
+    for (var index2 = 0; index2 < items.length; ++index2) {
+      var item = items[index2];
+      if (!isPlainObject(item)) continue;
+      for (var key2 in item) {
+        if (key2 === "__proto__" || key2 === "constructor" || key2 === "prototype") continue;
+        var value2 = isClone ? clone(item[key2]) : item[key2];
+        result[key2] = isRecursive ? _recursiveMerge(result[key2], value2) : value2;
+      }
+    }
+    return result;
+  }
   var SECRET = "NUT_FORM_INTERNAL";
-  var FormStore = function FormStore2() {
-    var _this = this;
-    var _this1 = this;
-    _class_call_check(this, FormStore2);
-    var _this2 = this;
-    _define_property(this, "initialValues", {});
-    _define_property(this, "updateList", []);
-    _define_property(this, "store", {});
-    _define_property(this, "fieldEntities", []);
-    _define_property(this, "callbacks", {});
-    _define_property(this, "errors", {});
-    _define_property(this, "registerField", function(field) {
-      _this.fieldEntities.push(field);
-      return function() {
-        _this.fieldEntities = _this.fieldEntities.filter(function(item) {
-          return item !== field;
+  var FormStore = /* @__PURE__ */ function() {
+    function FormStore2() {
+      var _this = this;
+      var _this1 = this;
+      _class_call_check(this, FormStore2);
+      var _this2 = this;
+      _define_property(this, "initialValues", {});
+      _define_property(this, "updateList", []);
+      _define_property(this, "store", {});
+      _define_property(this, "fieldEntities", []);
+      _define_property(this, "callbacks", {});
+      _define_property(this, "errors", {});
+      _define_property(this, "registerField", function(field) {
+        _this.fieldEntities.push(field);
+        return function() {
+          _this.fieldEntities = _this.fieldEntities.filter(function(item) {
+            return item !== field;
+          });
+        };
+      });
+      _define_property(this, "getFieldValue", function(name2) {
+        var _this_store;
+        return (_this_store = _this.store) === null || _this_store === void 0 ? void 0 : _this_store[name2];
+      });
+      _define_property(this, "getFieldsValue", function(nameList) {
+        if (typeof nameList === "boolean") {
+          return JSON.parse(JSON.stringify(_this.store));
+        }
+        var fieldsValue = {};
+        nameList.forEach(function(field) {
+          fieldsValue[field] = _this.getFieldValue(field);
         });
-        if (_this.store) {
-          delete _this.store[field.props.name];
+        return fieldsValue;
+      });
+      _define_property(this, "setInitialValues", function(initialValues, init) {
+        _this.initialValues = initialValues || {};
+        if (init) {
+          var nextStore = merge(initialValues, _this.store);
+          _this.updateStore(nextStore);
+          _this.notifyWatch();
         }
-      };
-    });
-    _define_property(this, "getFieldValue", function(name2) {
-      var _this_store;
-      return (_this_store = _this.store) === null || _this_store === void 0 ? void 0 : _this_store[name2];
-    });
-    _define_property(this, "getFieldsValue", function(nameList) {
-      if (typeof nameList === "boolean") {
-        return JSON.parse(JSON.stringify(_this.store));
-      }
-      var fieldsValue = {};
-      nameList.forEach(function(field) {
-        fieldsValue[field] = _this.getFieldValue(field);
       });
-      return fieldsValue;
-    });
-    _define_property(this, "setInitialValues", function(values, init) {
-      if (init) {
-        _this.initialValues = values;
-        _this.store = values;
-      }
-    });
-    _define_property(this, "setFieldsValue", function(newStore) {
-      var needValidate = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : true;
-      _this1.store = _object_spread({}, _this1.store, newStore);
-      _this1.fieldEntities.forEach(function(entity) {
-        var name2 = entity.props.name;
-        Object.keys(newStore).forEach(function(key2) {
-          if (key2 === name2) {
-            entity.onStoreChange("update");
+      _define_property(this, "setFieldsValue", function(newStore) {
+        var nextStore = recursive(true, _this.store, newStore);
+        _this.updateStore(nextStore);
+        _this.fieldEntities.forEach(function(entity) {
+          var name2 = entity.props.name;
+          Object.keys(newStore).forEach(function(key2) {
+            if (key2 === name2) {
+              entity.onStoreChange("update");
+            }
+          });
+        });
+        _this.updateList.forEach(function(item) {
+          var shouldUpdate = item.condition;
+          if (typeof item.condition === "function") {
+            shouldUpdate = item.condition();
+          }
+          if (shouldUpdate) {
+            item.entity.onStoreChange("update");
           }
         });
+        _this.notifyWatch();
       });
-      _this1.updateList.forEach(function(item) {
-        var shouldUpdate = item.condition;
-        if (typeof item.condition === "function") {
-          shouldUpdate = item.condition();
-        }
-        if (shouldUpdate) {
-          item.entity.onStoreChange("update");
-        }
+      _define_property(this, "setFieldValue", function(name2, value2) {
+        var store = _define_property({}, name2, value2);
+        _this.setFieldsValue(store);
+        _this.notifyWatch([
+          name2
+        ]);
       });
-      needValidate && _this1.validateFields();
-    });
-    _define_property(this, "setCallback", function(callback) {
-      _this.callbacks = _object_spread({}, _this.callbacks, callback);
-    });
-    _define_property(this, "validateFields", /* @__PURE__ */ function() {
-      var _ref = _async_to_generator(function(nameList) {
-        var filterEntitys, errs, _iteratorNormalCompletion, _didIteratorError, _iteratorError, _loop, _iterator, _step, err;
+      _define_property(this, "setCallback", function(callback) {
+        _this.callbacks = _object_spread({}, _this.callbacks, callback);
+      });
+      _define_property(this, "validateEntities", /* @__PURE__ */ function() {
+        var _ref = _async_to_generator(function(entity, errs) {
+          var _entity_props, name2, _entity_props_rules, rules2, descriptor, validator, _this_store, param, errors, _errs;
+          return __generator(this, function(_state) {
+            switch (_state.label) {
+              case 0:
+                _entity_props = entity.props, name2 = _entity_props.name, _entity_props_rules = _entity_props.rules, rules2 = _entity_props_rules === void 0 ? [] : _entity_props_rules;
+                if (!name2) {
+                  console.warn("Form field missing name property");
+                  return [
+                    2
+                  ];
+                }
+                descriptor = {};
+                if (rules2.length) {
+                  if (rules2.length > 1) {
+                    descriptor[name2] = [];
+                    rules2.forEach(function(v) {
+                      descriptor[name2].push(v);
+                    });
+                  } else {
+                    descriptor[name2] = rules2[0];
+                  }
+                }
+                validator = new Schema(descriptor);
+                _state.label = 1;
+              case 1:
+                _state.trys.push([
+                  1,
+                  3,
+                  4,
+                  5
+                ]);
+                return [
+                  4,
+                  validator.validate(_define_property({}, name2, (_this_store = _this2.store) === null || _this_store === void 0 ? void 0 : _this_store[name2]))
+                ];
+              case 2:
+                _state.sent();
+                return [
+                  3,
+                  5
+                ];
+              case 3:
+                param = _state.sent();
+                errors = param.errors;
+                if (errors) {
+                  (_errs = errs).push.apply(_errs, _to_consumable_array(errors));
+                  _this2.errors[name2] = errors;
+                }
+                return [
+                  3,
+                  5
+                ];
+              case 4:
+                if (!errs || errs.length === 0) {
+                  _this2.errors[name2] = [];
+                }
+                return [
+                  7
+                ];
+              case 5:
+                entity.onStoreChange("validate");
+                return [
+                  2
+                ];
+            }
+          });
+        });
+        return function(entity, errs) {
+          return _ref.apply(this, arguments);
+        };
+      }());
+      _define_property(this, "validateFields", /* @__PURE__ */ function() {
+        var _ref = _async_to_generator(function(nameList) {
+          var filterEntities, errs;
+          return __generator(this, function(_state) {
+            switch (_state.label) {
+              case 0:
+                filterEntities = [];
+                if (!nameList || nameList.length === 0) {
+                  filterEntities = _this2.fieldEntities;
+                } else {
+                  filterEntities = _this2.fieldEntities.filter(function(param) {
+                    var name2 = param.props.name;
+                    return nameList.includes(name2);
+                  });
+                }
+                errs = [];
+                return [
+                  4,
+                  Promise.all(filterEntities.map(/* @__PURE__ */ function() {
+                    var _ref2 = _async_to_generator(function(entity) {
+                      return __generator(this, function(_state2) {
+                        switch (_state2.label) {
+                          case 0:
+                            return [
+                              4,
+                              _this2.validateEntities(entity, errs)
+                            ];
+                          case 1:
+                            _state2.sent();
+                            return [
+                              2
+                            ];
+                        }
+                      });
+                    });
+                    return function(entity) {
+                      return _ref2.apply(this, arguments);
+                    };
+                  }()))
+                ];
+              case 1:
+                _state.sent();
+                return [
+                  2,
+                  errs
+                ];
+            }
+          });
+        });
+        return function(nameList) {
+          return _ref.apply(this, arguments);
+        };
+      }());
+      _define_property(this, "submit", /* @__PURE__ */ _async_to_generator(function() {
+        var errors, _this_callbacks_onFinish, _this_callbacks, _this_callbacks_onFinishFailed, _this_callbacks1;
         return __generator(this, function(_state) {
           switch (_state.label) {
             case 0:
-              filterEntitys = [];
-              errs = [];
-              _this2.errors.length = 0;
-              if (!nameList || nameList.length === 0) {
-                filterEntitys = _this2.fieldEntities;
-              } else {
-                filterEntitys = _this2.fieldEntities.filter(function(param) {
-                  var name2 = param.props.name;
-                  return nameList.includes(name2);
-                });
-              }
-              _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = void 0;
-              _state.label = 1;
-            case 1:
-              _state.trys.push([
-                1,
-                6,
-                7,
-                8
-              ]);
-              _loop = function() {
-                var entity, _entity_props, name2, _entity_props_rules, rules2, descriptor, validator, _this_store, param, errors, _errs;
-                return __generator(this, function(_state2) {
-                  switch (_state2.label) {
-                    case 0:
-                      entity = _step.value;
-                      _entity_props = entity.props, name2 = _entity_props.name, _entity_props_rules = _entity_props.rules, rules2 = _entity_props_rules === void 0 ? [] : _entity_props_rules;
-                      descriptor = {};
-                      if (rules2.length) {
-                        if (rules2.length > 1) {
-                          descriptor[name2] = [];
-                          rules2.forEach(function(v) {
-                            descriptor[name2].push(v);
-                          });
-                        } else {
-                          descriptor[name2] = rules2[0];
-                        }
-                      }
-                      validator = new Schema(descriptor);
-                      _state2.label = 1;
-                    case 1:
-                      _state2.trys.push([
-                        1,
-                        3,
-                        4,
-                        5
-                      ]);
-                      return [
-                        4,
-                        validator.validate(_define_property({}, name2, (_this_store = _this2.store) === null || _this_store === void 0 ? void 0 : _this_store[name2]))
-                      ];
-                    case 2:
-                      _state2.sent();
-                      return [
-                        3,
-                        5
-                      ];
-                    case 3:
-                      param = _state2.sent();
-                      errors = param.errors;
-                      if (errors) {
-                        (_errs = errs).push.apply(_errs, _to_consumable_array(errors));
-                        _this2.errors[name2] = errors;
-                      }
-                      return [
-                        3,
-                        5
-                      ];
-                    case 4:
-                      if (!errs || errs.length === 0) {
-                        _this2.errors[name2] = [];
-                      }
-                      return [
-                        7
-                      ];
-                    case 5:
-                      entity.onStoreChange("validate");
-                      return [
-                        2
-                      ];
-                  }
-                });
-              };
-              _iterator = filterEntitys[Symbol.iterator]();
-              _state.label = 2;
-            case 2:
-              if (!!(_iteratorNormalCompletion = (_step = _iterator.next()).done)) return [
-                3,
-                5
-              ];
-              return [
-                5,
-                __values(_loop())
-              ];
-            case 3:
-              _state.sent();
-              _state.label = 4;
-            case 4:
-              _iteratorNormalCompletion = true;
-              return [
-                3,
-                2
-              ];
-            case 5:
               return [
-                3,
-                8
-              ];
-            case 6:
-              err = _state.sent();
-              _didIteratorError = true;
-              _iteratorError = err;
-              return [
-                3,
-                8
+                4,
+                _this2.validateFields()
               ];
-            case 7:
-              try {
-                if (!_iteratorNormalCompletion && _iterator.return != null) {
-                  _iterator.return();
-                }
-              } finally {
-                if (_didIteratorError) {
-                  throw _iteratorError;
-                }
+            case 1:
+              errors = _state.sent();
+              if (errors.length === 0) {
+                (_this_callbacks_onFinish = (_this_callbacks = _this2.callbacks).onFinish) === null || _this_callbacks_onFinish === void 0 ? void 0 : _this_callbacks_onFinish.call(_this_callbacks, _this2.store);
+              } else if (errors.length > 0) {
+                (_this_callbacks_onFinishFailed = (_this_callbacks1 = _this2.callbacks).onFinishFailed) === null || _this_callbacks_onFinishFailed === void 0 ? void 0 : _this_callbacks_onFinishFailed.call(_this_callbacks1, _this2.store, errors);
               }
               return [
-                7
-              ];
-            case 8:
-              return [
-                2,
-                errs
+                2
               ];
           }
         });
-      });
-      return function(nameList) {
-        return _ref.apply(this, arguments);
-      };
-    }());
-    _define_property(this, "submit", /* @__PURE__ */ _async_to_generator(function() {
-      var errors, _this_callbacks_onFinish, _this_callbacks, _this_callbacks_onFinishFailed, _this_callbacks1;
-      return __generator(this, function(_state) {
-        switch (_state.label) {
-          case 0:
-            return [
-              4,
-              _this2.validateFields()
-            ];
-          case 1:
-            errors = _state.sent();
-            if (errors.length === 0) {
-              (_this_callbacks_onFinish = (_this_callbacks = _this2.callbacks).onFinish) === null || _this_callbacks_onFinish === void 0 ? void 0 : _this_callbacks_onFinish.call(_this_callbacks, _this2.store);
-            } else if (errors.length > 0) {
-              (_this_callbacks_onFinishFailed = (_this_callbacks1 = _this2.callbacks).onFinishFailed) === null || _this_callbacks_onFinishFailed === void 0 ? void 0 : _this_callbacks_onFinishFailed.call(_this_callbacks1, _this2.store, errors);
-            }
-            return [
-              2
-            ];
+      }));
+      _define_property(this, "resetFields", function(namePaths) {
+        if (namePaths && namePaths.length) {
+          namePaths.forEach(function(path) {
+            _this.errors[path] = null;
+            _this.fieldEntities.forEach(function(entity) {
+              var name2 = entity.props.name;
+              if (name2 === path) {
+                if (path in _this.initialValues) {
+                  _this.updateStore(_define_property({}, path, _this.initialValues[path]));
+                } else {
+                  delete _this.store[path];
+                }
+                entity.onStoreChange("reset");
+              }
+            });
+          });
+        } else {
+          var nextStore = merge({}, _this.initialValues);
+          _this.updateStore(nextStore);
+          _this.fieldEntities.forEach(function(entity) {
+            entity.onStoreChange("reset");
+          });
         }
       });
-    }));
-    _define_property(this, "resetFields", function() {
-      _this.errors.length = 0;
-      _this.store = _this.initialValues;
-      _this.fieldEntities.forEach(function(entity) {
-        entity.onStoreChange("reset");
+      _define_property(this, "registerUpdate", function(field, shouldUpdate) {
+        _this.updateList.push({
+          entity: field,
+          condition: shouldUpdate
+        });
+        return function() {
+          _this.updateList = _this.updateList.filter(function(i2) {
+            return i2.entity !== field;
+          });
+        };
       });
-    });
-    _define_property(this, "registerUpdate", function(field, shouldUpdate) {
-      _this.updateList.push({
-        entity: field,
-        condition: shouldUpdate
+      _define_property(this, "dispatch", function(param) {
+        var name2 = param.name;
+        _this.validateFields([
+          name2
+        ]);
       });
-      return function() {
-        _this.updateList = _this.updateList.filter(function(i2) {
-          return i2.entity !== field;
-        });
-      };
-    });
-    _define_property(this, "dispatch", function(param) {
-      var name2 = param.name;
-      _this.validateFields([
-        name2
-      ]);
-    });
-    _define_property(this, "getInternal", function(key2) {
-      if (key2 === SECRET) {
+      _define_property(this, "getInternal", function(key2) {
+        if (key2 === SECRET) {
+          return {
+            registerField: _this.registerField,
+            setCallback: _this.setCallback,
+            setInitialValues: _this.setInitialValues,
+            dispatch: _this.dispatch,
+            store: _this.store,
+            fieldEntities: _this.fieldEntities,
+            registerUpdate: _this.registerUpdate,
+            registerWatch: _this.registerWatch
+          };
+        }
+      });
+      _define_property(this, "getForm", function() {
         return {
-          registerField: _this.registerField,
-          setCallback: _this.setCallback,
-          setInitialValues: _this.setInitialValues,
-          dispatch: _this.dispatch,
-          store: _this.store,
-          fieldEntities: _this.fieldEntities,
-          registerUpdate: _this.registerUpdate
+          getFieldValue: _this.getFieldValue,
+          getFieldsValue: _this.getFieldsValue,
+          setFieldsValue: _this.setFieldsValue,
+          setFieldValue: _this.setFieldValue,
+          resetFields: _this.resetFields,
+          validateFields: _this.validateFields,
+          submit: _this.submit,
+          errors: _this.errors,
+          getInternal: _this.getInternal
         };
-      }
-    });
-    _define_property(this, "getForm", function() {
-      return {
-        getFieldValue: _this.getFieldValue,
-        getFieldsValue: _this.getFieldsValue,
-        setFieldsValue: _this.setFieldsValue,
-        resetFields: _this.resetFields,
-        validateFields: _this.validateFields,
-        submit: _this.submit,
-        errors: _this.errors,
-        getInternal: _this.getInternal
+      });
+      _define_property(this, "watchList", []);
+      _define_property(this, "registerWatch", function(callback) {
+        _this.watchList.push(callback);
+        return function() {
+          _this.watchList = _this.watchList.filter(function(fn) {
+            return fn !== callback;
+          });
+        };
+      });
+      _define_property(this, "notifyWatch", function() {
+        var namePath = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : [];
+        if (_this1.watchList.length) {
+          var allValues;
+          if (!namePath || namePath.length === 0) {
+            allValues = _this1.getFieldsValue(true);
+          } else {
+            allValues = _this1.getFieldsValue(namePath);
+          }
+          _this1.watchList.forEach(function(callback) {
+            callback(allValues, namePath);
+          });
+        }
+      });
+      this.callbacks = {
+        onFinish: function() {
+        },
+        onFinishFailed: function() {
+        }
       };
-    });
-    this.callbacks = {
-      onFinish: function() {
-      },
-      onFinishFailed: function() {
+    }
+    _create_class(FormStore2, [
+      {
+        key: "updateStore",
+        value: function updateStore(nextStore) {
+          this.store = nextStore;
+        }
       }
-    };
-  };
+    ]);
+    return FormStore2;
+  }();
   var useForm = function(form) {
     var formRef = React.useRef();
     if (!formRef.current) {
@@ -15948,10 +15970,32 @@ Please add \`${key2}Action\` when creating your handler.`);
       formRef.current
     ];
   };
+  var useWatch = function(path, form) {
+    var formInstance = form.getInternal(SECRET);
+    var _useState = _sliced_to_array(React.useState(), 2), value2 = _useState[0], setValue = _useState[1];
+    React.useEffect(function() {
+      var unsubscribe = formInstance.registerWatch(function(data2, namePath) {
+        var value3 = data2[path];
+        setValue(value3);
+      });
+      var initialValue = form.getFieldsValue(true);
+      if (value2 !== initialValue[path]) {
+        setValue(initialValue[path]);
+      }
+      return function() {
+        return unsubscribe();
+      };
+    }, [
+      form
+    ]);
+    return value2;
+  };
   var defaultProps$_ = _object_spread_props(_object_spread({}, ComponentDefaults), {
     labelPosition: "right",
     starPosition: "left",
+    disabled: false,
     divider: false,
+    validateTrigger: "onChange",
     onFinish: function(values) {
     },
     onFinishFailed: function(values, errorFields) {
@@ -15964,7 +16008,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   };
   var Form = /* @__PURE__ */ React.forwardRef(function(props, ref) {
     var classPrefix2 = "nut-form";
-    var _$_object_spread = _object_spread({}, defaultProps$_, props), className = _$_object_spread.className, style = _$_object_spread.style, footer = _$_object_spread.footer, children = _$_object_spread.children, initialValues = _$_object_spread.initialValues, divider = _$_object_spread.divider, onFinish = _$_object_spread.onFinish, onFinishFailed = _$_object_spread.onFinishFailed, labelPosition = _$_object_spread.labelPosition, starPosition = _$_object_spread.starPosition, form = _$_object_spread.form;
+    var _$_object_spread = _object_spread({}, defaultProps$_, props), className = _$_object_spread.className, style = _$_object_spread.style, footer = _$_object_spread.footer, children = _$_object_spread.children, initialValues = _$_object_spread.initialValues, divider = _$_object_spread.divider, disabled = _$_object_spread.disabled, onFinish = _$_object_spread.onFinish, onFinishFailed = _$_object_spread.onFinishFailed, validateTrigger = _$_object_spread.validateTrigger, labelPosition = _$_object_spread.labelPosition, starPosition = _$_object_spread.starPosition, form = _$_object_spread.form;
     var formInstance;
     if (form !== void 0) {
       formInstance = form;
@@ -16003,7 +16047,12 @@ Please add \`${key2}Action\` when creating your handler.`);
     }, /* @__PURE__ */ React.createElement(Cell.Group, {
       divider
     }, /* @__PURE__ */ React.createElement(Context.Provider, {
-      value: formInstance
+      value: {
+        formInstance,
+        labelPosition,
+        disabled,
+        validateTrigger
+      }
     }, children), footer ? /* @__PURE__ */ React.createElement(Cell, {
       className: "".concat(classPrefix2, "-footer")
     }, footer) : null));
@@ -16063,6 +16112,14 @@ Please add \`${key2}Action\` when creating your handler.`);
       }
     ).$$typeof === component.type.$$typeof;
   }
+  function toArray(value2) {
+    if (value2 === void 0 || value2 === null) {
+      return [];
+    }
+    return Array.isArray(value2) ? value2 : [
+      value2
+    ];
+  }
   var defaultProps$Z = _object_spread_props(_object_spread({}, ComponentDefaults), {
     required: false,
     name: "",
@@ -16074,7 +16131,6 @@ Please add \`${key2}Action\` when creating your handler.`);
       }
     ],
     errorMessageAlign: "left",
-    validateTrigger: "onChange",
     shouldUpdate: false,
     noStyle: false
   });
@@ -16088,15 +16144,19 @@ Please add \`${key2}Action\` when creating your handler.`);
       ]), _define_property(_this, "cancelRegister", void 0), _define_property(_this, "componentRef", void 0), _define_property(_this, "eventOff", void 0), // children添加value属性和onChange事件
       _define_property(_this, "getControlled", function(children) {
         var _children_props;
-        var _this_context = _this.context, setFieldsValue = _this_context.setFieldsValue, getFieldValue = _this_context.getFieldValue;
-        var dispatch = _this.context.getInternal(SECRET).dispatch;
+        var _this_context_formInstance = _this.context.formInstance, setFieldsValue = _this_context_formInstance.setFieldsValue, getFieldValue = _this_context_formInstance.getFieldValue;
+        var dispatch = _this.context.formInstance.getInternal(SECRET).dispatch;
         var _this_props = _this.props, _this_props_name = _this_props.name, name2 = _this_props_name === void 0 ? "" : _this_props_name;
         if (children === null || children === void 0 ? void 0 : (_children_props = children.props) === null || _children_props === void 0 ? void 0 : _children_props.defaultValue) {
-          console.warn("通过 initialValue 设置初始值");
+          if (process.env.NODE_ENV !== "production") {
+            console.warn("[NutUI] FormItem:", "请通过 initialValue 设置初始值，而不是 defaultValue");
+          }
         }
         var fieldValue = getFieldValue(name2);
         var _obj;
-        var controlled = _object_spread_props(_object_spread({}, children.props), (_obj = {}, _define_property(_obj, _this.props.valuePropName || "value", fieldValue !== void 0 ? fieldValue : _this.props.initialValue), _define_property(_obj, _this.props.trigger || "onChange", function() {
+        var controlled = _object_spread_props(_object_spread({}, children.props), (_obj = {
+          className: children.props.className
+        }, _define_property(_obj, _this.props.valuePropName || "value", fieldValue !== void 0 ? fieldValue : _this.props.initialValue), _define_property(_obj, _this.props.trigger || "onChange", function() {
           for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
             args[_key] = arguments[_key];
           }
@@ -16109,33 +16169,27 @@ Please add \`${key2}Action\` when creating your handler.`);
             var _this_props2;
             next = (_this_props2 = _this.props).getValueFromEvent.apply(_this_props2, _to_consumable_array(args));
           }
-          setFieldsValue(_define_property({}, name2, next), false);
+          setFieldsValue(_define_property({}, name2, next));
         }), _obj));
         var validateTrigger = _this.props.validateTrigger;
-        var validateTriggers = [
-          _this.props.trigger || "onChange"
-        ];
-        if (validateTrigger) {
-          validateTriggers = typeof validateTrigger === "string" ? [
-            validateTrigger
-          ] : _to_consumable_array(validateTrigger);
-          validateTriggers.forEach(function(trigger) {
-            var originTrigger = controlled[trigger];
-            controlled[trigger] = function() {
-              for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-                args[_key] = arguments[_key];
-              }
-              if (originTrigger) {
-                originTrigger.apply(void 0, _to_consumable_array(args));
-              }
-              if (_this.props.rules && _this.props.rules.length) {
-                dispatch({
-                  name: _this.props.name
-                });
-              }
-            };
-          });
-        }
+        var mergedValidateTrigger = validateTrigger || _this.context.validateTrigger;
+        var validateTriggers = toArray(mergedValidateTrigger);
+        validateTriggers.forEach(function(trigger) {
+          var originTrigger = controlled[trigger];
+          controlled[trigger] = function() {
+            for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+              args[_key] = arguments[_key];
+            }
+            if (originTrigger) {
+              originTrigger.apply(void 0, _to_consumable_array(args));
+            }
+            if (_this.props.rules && _this.props.rules.length) {
+              dispatch({
+                name: _this.props.name
+              });
+            }
+          };
+        });
         if (isForwardRefComponent(children)) {
           controlled.ref = function(componentInstance) {
             var originRef = children.ref;
@@ -16160,7 +16214,7 @@ Please add \`${key2}Action\` when creating your handler.`);
         });
       }), _define_property(_this, "onStoreChange", function(type2) {
         if (type2 === "reset") {
-          _this.context.errors[_this.props.name] = [];
+          _this.context.formInstance.errors[_this.props.name] = [];
           _this.refresh();
         } else {
           _this.forceUpdate();
@@ -16170,23 +16224,25 @@ Please add \`${key2}Action\` when creating your handler.`);
         var requiredInRules = rules2 === null || rules2 === void 0 ? void 0 : rules2.some(function(rule) {
           return rule.required;
         });
-        var item = name2 ? _this.context.errors[name2] : [];
-        var starPosition = _this.context.starPosition;
-        var renderStar = (required2 || requiredInRules) && /* @__PURE__ */ React.createElement("i", {
-          className: "required"
-        });
-        var renderLabel = /* @__PURE__ */ React.createElement(React.Fragment, null, starPosition === "left" ? renderStar : null, label, starPosition === "right" ? renderStar : null);
+        var item = name2 ? _this.context.formInstance.errors[name2] : [];
+        var starPosition = _this.context.formInstance.starPosition;
+        var renderStar = (required2 || requiredInRules) && /* @__PURE__ */ React.createElement("div", {
+          className: "nut-form-item-label-required required"
+        }, "*");
+        var renderLabel = /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("span", {
+          className: "nut-form-item-labeltxt"
+        }, starPosition === "left" ? renderStar : null, label), starPosition === "right" ? renderStar : null);
         return /* @__PURE__ */ React.createElement(Cell, {
-          className: "nut-form-item ".concat(className),
+          className: "".concat(_this.getClassNameWithDirection("nut-form-item"), " ").concat(className),
           style,
           align,
           onClick: function(e2) {
             return _this.props.onClick && _this.props.onClick(e2, _this.componentRef);
           }
         }, label ? /* @__PURE__ */ React.createElement("div", {
-          className: "nut-cell-title nut-form-item-label"
+          className: "nut-cell-title ".concat(_this.getClassNameWithDirection("nut-form-item-label"))
         }, renderLabel) : null, /* @__PURE__ */ React.createElement("div", {
-          className: "nut-cell-value nut-form-item-body"
+          className: "nut-cell-value ".concat(_this.getClassNameWithDirection("nut-form-item-body"))
         }, /* @__PURE__ */ React.createElement("div", {
           className: "nut-form-item-body-slots"
         }, childNode), item && item.length > 0 && /* @__PURE__ */ React.createElement("div", {
@@ -16206,11 +16262,11 @@ Please add \`${key2}Action\` when creating your handler.`);
       {
         key: "componentDidMount",
         value: function componentDidMount() {
-          var _this_context_getInternal = this.context.getInternal(SECRET), _this_context_getInternal_store = _this_context_getInternal.store, store = _this_context_getInternal_store === void 0 ? {} : _this_context_getInternal_store, setInitialValues = _this_context_getInternal.setInitialValues;
+          var _this_context_formInstance_getInternal = this.context.formInstance.getInternal(SECRET), _this_context_formInstance_getInternal_store = _this_context_formInstance_getInternal.store, store = _this_context_formInstance_getInternal_store === void 0 ? {} : _this_context_formInstance_getInternal_store, setInitialValues = _this_context_formInstance_getInternal.setInitialValues;
           if (this.props.initialValue && this.props.name && !Object.keys(store).includes(this.props.name)) {
             setInitialValues(_object_spread_props(_object_spread({}, store), _define_property({}, this.props.name, this.props.initialValue)), true);
           }
-          var _this_context_getInternal1 = this.context.getInternal(SECRET), registerField = _this_context_getInternal1.registerField, registerUpdate = _this_context_getInternal1.registerUpdate;
+          var _this_context_formInstance_getInternal1 = this.context.formInstance.getInternal(SECRET), registerField = _this_context_formInstance_getInternal1.registerField, registerUpdate = _this_context_formInstance_getInternal1.registerUpdate;
           this.cancelRegister = registerField(this);
           this.eventOff = registerUpdate(this, this.props.shouldUpdate);
         }
@@ -16226,6 +16282,15 @@ Please add \`${key2}Action\` when creating your handler.`);
           }
         }
       },
+      {
+        key: "getClassNameWithDirection",
+        value: function getClassNameWithDirection(className) {
+          if (className && this.context.labelPosition) {
+            return "".concat(className, " ").concat(className, "-").concat(this.context.labelPosition);
+          }
+          return className;
+        }
+      },
       {
         key: "render",
         value: function render2() {
@@ -16235,11 +16300,13 @@ Please add \`${key2}Action\` when creating your handler.`);
           if (!this.props.shouldUpdate) {
             returnChildNode = /* @__PURE__ */ React.cloneElement(child, this.getControlled(child));
           } else {
-            returnChildNode = child(this.context);
+            returnChildNode = child(this.context.formInstance);
           }
           return /* @__PURE__ */ React.createElement(React.Fragment, {
             key: this.state.resetCount
-          }, this.props.noStyle ? returnChildNode : this.renderLayout(returnChildNode));
+          }, /* @__PURE__ */ React.createElement("div", {
+            className: this.context.disabled ? "nut-form-item-disabled" : ""
+          }, this.props.noStyle ? returnChildNode : this.renderLayout(returnChildNode)));
         }
       }
     ]);
@@ -16250,6 +16317,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   var InnerForm = Form;
   InnerForm.Item = FormItem;
   InnerForm.useForm = useForm;
+  InnerForm.useWatch = useWatch;
   function trimExtraChar(value2, char, regExp) {
     var index2 = value2.indexOf(char);
     if (index2 === -1) {
@@ -16750,7 +16818,7 @@ Please add \`${key2}Action\` when creating your handler.`);
         parent2.updateTitle(text2, index2);
       }
     };
-    var handleClick2 = function(item) {
+    var handleClick = function(item) {
       parent2.toggleMenuItem(index2);
       setTitle(item.text);
       setValue(item.value);
@@ -16845,7 +16913,7 @@ Please add \`${key2}Action\` when creating your handler.`);
           flexBasis: "".concat(100 / columns, "%")
         },
         onClick: function() {
-          handleClick2(item);
+          handleClick(item);
         }
       }, item.value === innerValue ? /* @__PURE__ */ React.createElement("i", {
         className: "nut-menu-container-item-icon"
@@ -17308,7 +17376,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     var renderRadioItem = function() {
       return renderByShape(context2 && context2.shape ? context2.shape : shape);
     };
-    var handleClick2 = function(e2) {
+    var handleClick = function(e2) {
       if (disabled || checkedStatement) return;
       setCheckedStatement(!checkedStatement);
     };
@@ -17316,7 +17384,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     return /* @__PURE__ */ React.createElement("div", _object_spread({
       className: cls,
       style,
-      onClick: handleClick2
+      onClick: handleClick
     }, rest), renderRadioItem());
   };
   Radio.displayName = "NutRadio";
@@ -18195,7 +18263,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     var locale = useConfig().locale;
     var _ref = _object_spread({}, defaultProps$O, props), title = _ref.title, description = _ref.description, tips = _ref.tips, outerVisible = _ref.visible, value2 = _ref.value, error = _ref.error, hideFooter = _ref.hideFooter, length2 = _ref.length, plain = _ref.plain, style = _ref.style, className = _ref.className;
     _ref.closeable;
-    var autoFocus = _ref.autoFocus, onFocus = _ref.onFocus, onChange = _ref.onChange, onConfirm = _ref.onConfirm, onTips = _ref.onTips, onCancel = _ref.onCancel, onClose = _ref.onClose, onComplete = _ref.onComplete;
+    var autoFocus = _ref.autoFocus, round = _ref.round, onFocus = _ref.onFocus, onChange = _ref.onChange, onConfirm = _ref.onConfirm, onTips = _ref.onTips, onCancel = _ref.onCancel, onClose = _ref.onClose, onComplete = _ref.onComplete;
     _ref.onOverlayClick;
     _ref.onCloseIconClick;
     var rest = _object_without_properties(_ref, [
@@ -18212,6 +18280,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       "className",
       "closeable",
       "autoFocus",
+      "round",
       "onFocus",
       "onChange",
       "onConfirm",
@@ -18275,15 +18344,12 @@ Please add \`${key2}Action\` when creating your handler.`);
       onConfirm && onConfirm(inputValue);
     };
     return /* @__PURE__ */ React.createElement(Popup, _object_spread({
-      style: {
-        padding: "32px 24px 28px 24px",
-        borderRadius: "12px",
-        textAlign: "center"
-      },
+      className: "".concat(classPrefix2, "-popup"),
       visible,
       closeable: true,
       onOverlayClick: handleClose,
-      onCloseIconClick: handleClose
+      onCloseIconClick: handleClose,
+      round
     }, rest), /* @__PURE__ */ React.createElement("div", {
       className: classNames(classPrefix2, className),
       style
@@ -19475,13 +19541,13 @@ Please add \`${key2}Action\` when creating your handler.`);
         className: classNames("".concat(classPrefix2, "-footer"), _define_property({}, footerDirection, footerDirection))
       }, footer);
     };
-    var handleClick2 = function(e2) {
+    var handleClick = function(e2) {
       onClick && onClick(e2);
     };
     return /* @__PURE__ */ React.createElement("div", {
       className: classNames("".concat(classPrefix2, "-outer"), className),
       style,
-      onClick: handleClick2
+      onClick: handleClick
     }, close, header, /* @__PURE__ */ React.createElement("div", {
       className: classPrefix2,
       style: {
@@ -19539,6 +19605,9 @@ Please add \`${key2}Action\` when creating your handler.`);
       unmountOnExit: true,
       appear: true
     }, /* @__PURE__ */ React.createElement(Content, _object_spread_props(_object_spread({}, restProps), {
+      style: {
+        zIndex
+      },
       visible
     }))));
   };
@@ -19911,59 +19980,6 @@ Please add \`${key2}Action\` when creating your handler.`);
   };
   Empty.displayName = "NutEmpty";
   var defaultProps$E = _object_spread_props(_object_spread({}, ComponentDefaults), {
-    title: null,
-    description: null,
-    icon: "",
-    status: "info",
-    actions: []
-  });
-  var ResultPage = function(props) {
-    var _$_object_spread = _object_spread({}, defaultProps$E, props), className = _$_object_spread.className, style = _$_object_spread.style, title = _$_object_spread.title, description = _$_object_spread.description, icon = _$_object_spread.icon, status = _$_object_spread.status, actions = _$_object_spread.actions, children = _$_object_spread.children;
-    var classPrefix2 = "nut-resultpage";
-    var cls = classNames(classPrefix2, className);
-    var defaultStatus2 = {
-      success: /* @__PURE__ */ React.createElement(m$1, {
-        color: "#00D900"
-      }),
-      error: /* @__PURE__ */ React.createElement(n$4, {
-        color: "#FF0F23"
-      }),
-      warning: /* @__PURE__ */ React.createElement(c, {
-        color: "#FFBF00"
-      }),
-      info: /* @__PURE__ */ React.createElement(p$2, {
-        color: "#0073FF"
-      }),
-      waiting: /* @__PURE__ */ React.createElement(n$a, {
-        color: "#0073FF"
-      })
-    };
-    return /* @__PURE__ */ React.createElement("div", {
-      className: cls,
-      style
-    }, /* @__PURE__ */ React.createElement("div", {
-      className: "".concat(classPrefix2, "-icon")
-    }, icon || defaultStatus2[status]), typeof title === "string" && title ? /* @__PURE__ */ React.createElement("div", {
-      className: "".concat(classPrefix2, "-title")
-    }, title) : title, typeof description === "string" && description ? /* @__PURE__ */ React.createElement("div", {
-      className: "".concat(classPrefix2, "-description")
-    }, description) : description, actions.length ? /* @__PURE__ */ React.createElement("div", {
-      className: "".concat(classPrefix2, "-actions")
-    }, actions.map(function(action, index2) {
-      action.text;
-      var rest = _object_without_properties(action, [
-        "text"
-      ]);
-      return /* @__PURE__ */ React.createElement("div", {
-        className: "".concat(classPrefix2, "-action"),
-        key: index2
-      }, /* @__PURE__ */ React.createElement(Button, _object_spread_props(_object_spread({}, rest), {
-        size: "large"
-      }), action === null || action === void 0 ? void 0 : action.text));
-    })) : null, children);
-  };
-  ResultPage.displayName = "NutResultPage";
-  var defaultProps$D = _object_spread_props(_object_spread({}, ComponentDefaults), {
     type: "default",
     hasMore: true,
     threshold: 200,
@@ -19983,7 +19999,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       return null;
     };
     var locale = useConfig().locale;
-    var _ref = _object_spread({}, defaultProps$D, props), children = _ref.children, type2 = _ref.type, hasMore = _ref.hasMore, threshold = _ref.threshold, target = _ref.target, capture = _ref.capture, pullRefresh = _ref.pullRefresh, pullingText = _ref.pullingText, loadingText = _ref.loadingText, loadMoreText = _ref.loadMoreText, className = _ref.className, onRefresh = _ref.onRefresh, onLoadMore = _ref.onLoadMore, onScroll = _ref.onScroll, restProps = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$E, props), children = _ref.children, type2 = _ref.type, hasMore = _ref.hasMore, threshold = _ref.threshold, target = _ref.target, capture = _ref.capture, pullRefresh = _ref.pullRefresh, pullingText = _ref.pullingText, loadingText = _ref.loadingText, loadMoreText = _ref.loadMoreText, className = _ref.className, onRefresh = _ref.onRefresh, onLoadMore = _ref.onLoadMore, onScroll = _ref.onScroll, restProps = _object_without_properties(_ref, [
       "children",
       "type",
       "hasMore",
@@ -23473,7 +23489,7 @@ Please add \`${key2}Action\` when creating your handler.`);
           shapePath._length = 0;
           shapePath.c = false;
         }
-        function clone(shape) {
+        function clone2(shape) {
           var cloned = factory.newElement();
           var i2;
           var len = shape._length === void 0 ? shape.v.length : shape._length;
@@ -23485,7 +23501,7 @@ Please add \`${key2}Action\` when creating your handler.`);
           return cloned;
         }
         var factory = poolFactory(4, create, release);
-        factory.clone = clone;
+        factory.clone = clone2;
         return factory;
       }();
       function ShapeCollection() {
@@ -24203,7 +24219,7 @@ Please add \`${key2}Action\` when creating your handler.`);
           }
           return true;
         }
-        function clone(matr) {
+        function clone2(matr) {
           var i2;
           for (i2 = 0; i2 < 16; i2 += 1) {
             matr.props[i2] = this.props[i2];
@@ -24355,7 +24371,7 @@ Please add \`${key2}Action\` when creating your handler.`);
           this.applyToPointStringified = applyToPointStringified;
           this.toCSS = toCSS;
           this.to2dCSS = to2dCSS;
-          this.clone = clone;
+          this.clone = clone2;
           this.cloneFromProps = cloneFromProps;
           this.equals = equals;
           this.inversePoints = inversePoints;
@@ -36989,7 +37005,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     circular: d$3,
     spinner: s
   };
-  var defaultProps$C = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$D = _object_spread_props(_object_spread({}, ComponentDefaults), {
     // 对比一下,个人感觉还是Loading1比较好看一些,所以用它作为了默认的loading图标
     type: "circular",
     direction: "horizontal",
@@ -37000,7 +37016,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     autoplay: true
   };
   var Loading = /* @__PURE__ */ React.forwardRef(function(props, ref) {
-    var _ref = _object_spread({}, defaultProps$C, props), className = _ref.className, style = _ref.style, children = _ref.children, direction = _ref.direction, icon = _ref.icon, lottieProps = _ref.lottieProps, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$D, props), className = _ref.className, style = _ref.style, children = _ref.children, direction = _ref.direction, icon = _ref.icon, lottieProps = _ref.lottieProps, rest = _object_without_properties(_ref, [
       "className",
       "style",
       "children",
@@ -37043,7 +37059,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     }, children) : null);
   });
   Loading.displayName = "NutLoading";
-  var defaultProps$B = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$C = _object_spread_props(_object_spread({}, ComponentDefaults), {
     align: "left",
     direction: "horizontal",
     list: [],
@@ -37064,7 +37080,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   });
   var NoticeBar = function(props) {
     var rtl = useRtl();
-    var _$_object_spread = _object_spread({}, defaultProps$B, props), children = _$_object_spread.children, className = _$_object_spread.className, style = _$_object_spread.style, align = _$_object_spread.align, direction = _$_object_spread.direction, list = _$_object_spread.list, duration = _$_object_spread.duration, height2 = _$_object_spread.height, content2 = _$_object_spread.content, closeable = _$_object_spread.closeable, wrap = _$_object_spread.wrap, leftIcon = _$_object_spread.leftIcon, rightIcon = _$_object_spread.rightIcon, right = _$_object_spread.right, delay = _$_object_spread.delay, scrollable = _$_object_spread.scrollable, speed = _$_object_spread.speed, close = _$_object_spread.close, click = _$_object_spread.click, onClose = _$_object_spread.onClose, onClick = _$_object_spread.onClick, onItemClick = _$_object_spread.onItemClick;
+    var _$_object_spread = _object_spread({}, defaultProps$C, props), children = _$_object_spread.children, className = _$_object_spread.className, style = _$_object_spread.style, align = _$_object_spread.align, direction = _$_object_spread.direction, list = _$_object_spread.list, duration = _$_object_spread.duration, height2 = _$_object_spread.height, content2 = _$_object_spread.content, closeable = _$_object_spread.closeable, wrap = _$_object_spread.wrap, leftIcon = _$_object_spread.leftIcon, rightIcon = _$_object_spread.rightIcon, right = _$_object_spread.right, delay = _$_object_spread.delay, scrollable = _$_object_spread.scrollable, speed = _$_object_spread.speed, close = _$_object_spread.close, click = _$_object_spread.click, onClose = _$_object_spread.onClose, onClick = _$_object_spread.onClick, onItemClick = _$_object_spread.onItemClick;
     var classPrefix2 = "nut-noticebar";
     var wrapRef = React.useRef(null);
     var contentRef = React.useRef(null);
@@ -37165,7 +37181,7 @@ Please add \`${key2}Action\` when creating your handler.`);
         }
       }, 0);
     };
-    var handleClick2 = function(event) {
+    var handleClick = function(event) {
       click && click(event);
       onClick && onClick(event);
     };
@@ -37374,7 +37390,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     }, showNoticeBar && direction === "horizontal" ? /* @__PURE__ */ React.createElement("div", {
       className: noticebarClass,
       style: barStyle,
-      onClick: handleClick2
+      onClick: handleClick
     }, leftIcon ? /* @__PURE__ */ React.createElement("div", {
       className: "nut-noticebar-box-left-icon"
     }, leftIcon) : null, /* @__PURE__ */ React.createElement("div", {
@@ -37397,7 +37413,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       className: "nut-noticebar-vertical",
       style: barStyle,
       ref: container,
-      onClick: handleClick2
+      onClick: handleClick
     }, leftIcon ? /* @__PURE__ */ React.createElement("div", {
       className: "nut-noticebar-box-left-icon"
     }, leftIcon) : null, children ? /* @__PURE__ */ React.createElement("div", {
@@ -37641,7 +37657,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       }
     }
   };
-  var defaultProps$A = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$B = _object_spread_props(_object_spread({}, ComponentDefaults), {
     list: [],
     theme: "light",
     location: "bottom",
@@ -37666,7 +37682,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   var classPrefix$b = "nut-popover";
   var Popover = function(props) {
     var rtl = useRtl();
-    var _ref = _object_spread({}, defaultProps$A, props), children = _ref.children, list = _ref.list, theme = _ref.theme, location = _ref.location, visible = _ref.visible, offset = _ref.offset, arrowOffset = _ref.arrowOffset, targetId = _ref.targetId, overlay = _ref.overlay, closeOnOutsideClick = _ref.closeOnOutsideClick, closeOnActionClick = _ref.closeOnActionClick, className = _ref.className, showArrow = _ref.showArrow, style = _ref.style, onClick = _ref.onClick, onOpen = _ref.onOpen, onClose = _ref.onClose, onSelect = _ref.onSelect, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$B, props), children = _ref.children, list = _ref.list, theme = _ref.theme, location = _ref.location, visible = _ref.visible, offset = _ref.offset, arrowOffset = _ref.arrowOffset, targetId = _ref.targetId, overlay = _ref.overlay, closeOnOutsideClick = _ref.closeOnOutsideClick, closeOnActionClick = _ref.closeOnActionClick, className = _ref.className, showArrow = _ref.showArrow, style = _ref.style, onClick = _ref.onClick, onOpen = _ref.onOpen, onClose = _ref.onClose, onSelect = _ref.onSelect, rest = _object_without_properties(_ref, [
       "children",
       "list",
       "theme",
@@ -37939,7 +37955,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       return setTimeout(resolve, time2);
     });
   };
-  var defaultProps$z = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$A = _object_spread_props(_object_spread({}, ComponentDefaults), {
     type: "default",
     pullingText: "",
     canReleaseText: "",
@@ -37958,7 +37974,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     };
     var classPrefix2 = "nut-pulltorefresh";
     var locale = useConfig().locale;
-    var props = _object_spread({}, defaultProps$z, p2, {
+    var props = _object_spread({}, defaultProps$A, p2, {
       pullingText: p2.pullingText || locale.pullToRefresh.pullingText,
       canReleaseText: p2.canReleaseText || locale.pullToRefresh.canReleaseText,
       refreshingText: p2.refreshingText || locale.pullToRefresh.refreshingText,
@@ -38193,6 +38209,59 @@ Please add \`${key2}Action\` when creating your handler.`);
     }, props.children));
   };
   PullToRefresh.displayName = "NutPullToRefresh";
+  var defaultProps$z = _object_spread_props(_object_spread({}, ComponentDefaults), {
+    title: null,
+    description: null,
+    icon: "",
+    status: "info",
+    actions: []
+  });
+  var ResultPage = function(props) {
+    var _$_object_spread = _object_spread({}, defaultProps$z, props), className = _$_object_spread.className, style = _$_object_spread.style, title = _$_object_spread.title, description = _$_object_spread.description, icon = _$_object_spread.icon, status = _$_object_spread.status, actions = _$_object_spread.actions, children = _$_object_spread.children;
+    var classPrefix2 = "nut-resultpage";
+    var cls = classNames(classPrefix2, className);
+    var defaultStatus2 = {
+      success: /* @__PURE__ */ React.createElement(m$1, {
+        color: "#00D900"
+      }),
+      error: /* @__PURE__ */ React.createElement(n$4, {
+        color: "#FF0F23"
+      }),
+      warning: /* @__PURE__ */ React.createElement(c, {
+        color: "#FFBF00"
+      }),
+      info: /* @__PURE__ */ React.createElement(p$2, {
+        color: "#0073FF"
+      }),
+      waiting: /* @__PURE__ */ React.createElement(n$a, {
+        color: "#0073FF"
+      })
+    };
+    return /* @__PURE__ */ React.createElement("div", {
+      className: cls,
+      style
+    }, /* @__PURE__ */ React.createElement("div", {
+      className: "".concat(classPrefix2, "-icon")
+    }, icon || defaultStatus2[status]), typeof title === "string" && title ? /* @__PURE__ */ React.createElement("div", {
+      className: "".concat(classPrefix2, "-title")
+    }, title) : title, typeof description === "string" && description ? /* @__PURE__ */ React.createElement("div", {
+      className: "".concat(classPrefix2, "-description")
+    }, description) : description, actions.length ? /* @__PURE__ */ React.createElement("div", {
+      className: "".concat(classPrefix2, "-actions")
+    }, actions.map(function(action, index2) {
+      action.text;
+      var rest = _object_without_properties(action, [
+        "text"
+      ]);
+      return /* @__PURE__ */ React.createElement("div", {
+        className: "".concat(classPrefix2, "-action"),
+        key: index2
+      }, /* @__PURE__ */ React.createElement(Button, _object_spread_props(_object_spread({}, rest), {
+        size: "large"
+      }), action === null || action === void 0 ? void 0 : action.text));
+    })) : null, children);
+  };
+  ResultPage.displayName = "NutResultPage";
   var AvatarContext = React.createContext({});
   var defaultProps$y = _object_spread_props(_object_spread({}, ComponentDefaults), {
     maxContent: "",
@@ -38862,7 +38931,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     var classes = classNames((_obj = {
       "nut-ani-container": true
     }, _define_property(_obj, "".concat(classPrefix$7, "-").concat(type2), action === "initial" || clicked), _define_property(_obj, "loop", loop2), _obj), className);
-    var handleClick2 = function(event) {
+    var handleClick = function(event) {
       setClicked(true);
       if (!loop2) {
         setTimeout(function() {
@@ -38875,7 +38944,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       className: "nut-animate"
     }, /* @__PURE__ */ React.createElement("div", _object_spread({
       className: classes,
-      onClick: handleClick2
+      onClick: handleClick
     }, rest), children));
   };
   Animate.displayName = "NutAnimate";
@@ -39391,7 +39460,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       expanded,
       rotate
     ]);
-    var handleClick2 = function() {
+    var handleClick = function() {
       if (!disabled) {
         context2.updateValue(name2);
       }
@@ -39442,7 +39511,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       className: classNames("".concat(classPrefix2, "-header"), {
         disabled
       }),
-      onClick: handleClick2
+      onClick: handleClick
     }, /* @__PURE__ */ React.createElement("div", {
       className: "".concat(classPrefix2, "-title")
     }, title), /* @__PURE__ */ React.createElement("div", {
@@ -39921,12 +39990,12 @@ Please add \`${key2}Action\` when creating your handler.`);
         onChange && onChange("collapse");
       }
     };
-    var handleClick2 = function() {
+    var handleClick = function() {
       onClick && onClick();
     };
     return /* @__PURE__ */ React.createElement("div", _object_spread({
       className: classes,
-      onClick: handleClick2,
+      onClick: handleClick,
       ref: root2
     }, rest), !exceeded ? content2 : null, exceeded && !expanded ? /* @__PURE__ */ React.createElement("span", null, (_ellipsis_current = ellipsis.current) === null || _ellipsis_current === void 0 ? void 0 : _ellipsis_current.leading, expandText ? /* @__PURE__ */ React.createElement("span", {
       className: "nut-ellipsis-text",
@@ -40811,63 +40880,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     }, pageCount)));
   };
   Pagination.displayName = "NutPagination";
-  var defaultProps$e = {
-    options: [],
-    onChange: function(value2) {
-    }
-  };
-  var Segmented = function(props) {
-    var classPrefix2 = "nut-segmented";
-    var itemClassPrefix = "nut-segmented-item";
-    var mergedProps = mergeProps(defaultProps$e, props);
-    var options2 = mergedProps.options;
-    mergedProps.onChange;
-    var _usePropsValue = _sliced_to_array(usePropsValue({
-      value: mergedProps.value,
-      defaultValue: mergedProps.defaultValue,
-      finalValue: 0,
-      onChange: mergedProps.onChange
-    }), 2), value2 = _usePropsValue[0], setValue = _usePropsValue[1];
-    var renderItems = React.useCallback(function(options3, value3) {
-      return options3.map(function(option, index2) {
-        var optionType = typeof option === "undefined" ? "undefined" : _type_of(option);
-        switch (optionType) {
-          case "object":
-            var opt = option;
-            var _obj;
-            return /* @__PURE__ */ React.createElement("div", {
-              className: classNames(itemClassPrefix, (_obj = {}, _define_property(_obj, "".concat(itemClassPrefix, "-active"), opt.value === value3), _define_property(_obj, "".concat(opt.className), !!opt.className), _obj)),
-              key: opt.value,
-              onClick: function() {
-                if (opt.disabled) return;
-                setValue(opt.value);
-              }
-            }, opt.icon ? /* @__PURE__ */ React.createElement("span", {
-              className: "nut-segmented-icon"
-            }, opt.icon) : null, opt.label);
-          default: {
-            if (typeof option !== "string" && typeof option !== "number") {
-              console.warn("Unsupported option type:", optionType);
-            }
-            return /* @__PURE__ */ React.createElement("div", {
-              className: classNames(itemClassPrefix, _define_property({}, "".concat(itemClassPrefix, "-active"), index2 === value3)),
-              key: option.toString(),
-              onClick: function() {
-                setValue(index2);
-              }
-            }, option);
-          }
-        }
-      });
-    }, [
-      value2
-    ]);
-    return /* @__PURE__ */ React.createElement("div", {
-      className: classNames(classPrefix2),
-      style: mergedProps.style
-    }, renderItems(options2, value2));
-  };
-  var defaultProps$d = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$e = _object_spread_props(_object_spread({}, ComponentDefaults), {
     color: "primary",
     price: 0,
     symbol: "&yen;",
@@ -40878,7 +40891,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     line: false
   });
   var Price = function(props) {
-    var _ref = _object_spread({}, defaultProps$d, props), color = _ref.color, price = _ref.price, symbol = _ref.symbol, digits = _ref.digits, thousands = _ref.thousands, position2 = _ref.position, size = _ref.size, line = _ref.line, className = _ref.className, style = _ref.style, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$e, props), color = _ref.color, price = _ref.price, symbol = _ref.symbol, digits = _ref.digits, thousands = _ref.thousands, position2 = _ref.position, size = _ref.size, line = _ref.line, className = _ref.className, style = _ref.style, rest = _object_without_properties(_ref, [
       "color",
       "price",
       "symbol",
@@ -40947,6 +40960,62 @@ Please add \`${key2}Action\` when creating your handler.`);
     }, formatDecimal(price))) : null, symbol && position2 === "after" ? renderSymbol() : null);
   };
   Price.displayName = "NutPrice";
+  var defaultProps$d = {
+    options: [],
+    onChange: function(value2) {
+    }
+  };
+  var Segmented = function(props) {
+    var classPrefix2 = "nut-segmented";
+    var itemClassPrefix = "nut-segmented-item";
+    var mergedProps = mergeProps(defaultProps$d, props);
+    var options2 = mergedProps.options;
+    mergedProps.onChange;
+    var _usePropsValue = _sliced_to_array(usePropsValue({
+      value: mergedProps.value,
+      defaultValue: mergedProps.defaultValue,
+      finalValue: 0,
+      onChange: mergedProps.onChange
+    }), 2), value2 = _usePropsValue[0], setValue = _usePropsValue[1];
+    var renderItems = React.useCallback(function(options3, value3) {
+      return options3.map(function(option, index2) {
+        var optionType = typeof option === "undefined" ? "undefined" : _type_of(option);
+        switch (optionType) {
+          case "object":
+            var opt = option;
+            var _obj;
+            return /* @__PURE__ */ React.createElement("div", {
+              className: classNames(itemClassPrefix, (_obj = {}, _define_property(_obj, "".concat(itemClassPrefix, "-active"), opt.value === value3), _define_property(_obj, "".concat(opt.className), !!opt.className), _obj)),
+              key: opt.value,
+              onClick: function() {
+                if (opt.disabled) return;
+                setValue(opt.value);
+              }
+            }, opt.icon ? /* @__PURE__ */ React.createElement("span", {
+              className: "nut-segmented-icon"
+            }, opt.icon) : null, opt.label);
+          default: {
+            if (typeof option !== "string" && typeof option !== "number") {
+              console.warn("Unsupported option type:", optionType);
+            }
+            return /* @__PURE__ */ React.createElement("div", {
+              className: classNames(itemClassPrefix, _define_property({}, "".concat(itemClassPrefix, "-active"), index2 === value3)),
+              key: option.toString(),
+              onClick: function() {
+                setValue(index2);
+              }
+            }, option);
+          }
+        }
+      });
+    }, [
+      value2
+    ]);
+    return /* @__PURE__ */ React.createElement("div", {
+      className: classNames(classPrefix2),
+      style: mergedProps.style
+    }, renderItems(options2, value2));
+  };
   var DataContext = React.createContext({});
   var defaultProps$c = _object_spread_props(_object_spread({}, ComponentDefaults), {
     title: "",
@@ -41278,7 +41347,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     var classPrefix2 = "nut-tag";
     var _obj;
     var classes = classNames((_obj = {}, _define_property(_obj, classPrefix2, true), _define_property(_obj, "".concat(classPrefix2, "-").concat(type2), type2), _define_property(_obj, "".concat(classPrefix2, "-plain"), plain), _define_property(_obj, "".concat(classPrefix2, "-round"), round), _define_property(_obj, "".concat(classPrefix2, "-mark"), mark), _define_property(_obj, "".concat(classPrefix2, "-close"), closeable), _define_property(_obj, "".concat(className), className), _obj));
-    var handleClick2 = function(e2) {
+    var handleClick = function(e2) {
       onClick && onClick(e2);
     };
     var getStyle = function() {
@@ -41304,7 +41373,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       className: classes,
       style: _object_spread({}, style, getStyle()),
       onClick: function(e2) {
-        return handleClick2(e2);
+        return handleClick(e2);
       }
     }, children && /* @__PURE__ */ React.createElement("span", {
       className: textClasses,
@@ -41326,7 +41395,7 @@ Please add \`${key2}Action\` when creating your handler.`);
       className: classes,
       style: _object_spread({}, style, getStyle()),
       onClick: function(e2) {
-        return handleClick2(e2);
+        return handleClick(e2);
       }
     }, children && /* @__PURE__ */ React.createElement("span", {
       className: textClasses,
@@ -41808,6 +41877,446 @@ Please add \`${key2}Action\` when creating your handler.`);
   };
   VirtualList.displayName = "NutVirtualList";
   var defaultProps$6 = _object_spread_props(_object_spread({}, ComponentDefaults), {
+    maxZoom: 3,
+    space: 10,
+    toolbar: [
+      /* @__PURE__ */ React.createElement(Button, {
+        type: "danger",
+        key: "cancel"
+      }, "Cancel"),
+      /* @__PURE__ */ React.createElement(Button, {
+        key: "reset"
+      }, "Reset"),
+      /* @__PURE__ */ React.createElement(Button, {
+        key: "rotate"
+      }, "Rotate"),
+      /* @__PURE__ */ React.createElement(Button, {
+        type: "success",
+        key: "confirm"
+      }, "Confirm")
+    ],
+    toolbarPosition: "bottom",
+    editText: "Edit",
+    shape: "square"
+  });
+  var classPrefix$1 = "nut-avatar-cropper";
+  var AvatarCropper = function(props) {
+    var locale = useConfig().locale;
+    defaultProps$6.toolbar = [
+      /* @__PURE__ */ React.createElement(Button, {
+        type: "danger",
+        key: "cancel"
+      }, locale.cancel),
+      /* @__PURE__ */ React.createElement(Button, {
+        key: "reset"
+      }, locale.reset),
+      /* @__PURE__ */ React.createElement(Button, {
+        key: "rotate"
+      }, locale.avatarCropper.rotate),
+      /* @__PURE__ */ React.createElement(Button, {
+        type: "success",
+        key: "confirm"
+      }, locale.confirm)
+    ];
+    var _ref = _object_spread({}, defaultProps$6, props), children = _ref.children, maxZoom = _ref.maxZoom, space = _ref.space, toolbar = _ref.toolbar, toolbarPosition = _ref.toolbarPosition, editText = _ref.editText, shape = _ref.shape, className = _ref.className, style = _ref.style, onConfirm = _ref.onConfirm, onCancel = _ref.onCancel, rest = _object_without_properties(_ref, [
+      "children",
+      "maxZoom",
+      "space",
+      "toolbar",
+      "toolbarPosition",
+      "editText",
+      "shape",
+      "className",
+      "style",
+      "onConfirm",
+      "onCancel"
+    ]);
+    var cls = classNames(classPrefix$1, className, shape === "round" && "round");
+    var toolbarPositionCls = classNames("".concat(classPrefix$1, "-popup-toolbar"), toolbarPosition);
+    var inputImageRef = React.useRef(null);
+    var cropperPopupRef = React.useRef(null);
+    var canvasRef = React.useRef(null);
+    var _useState = _sliced_to_array(React.useState(false), 2), visible = _useState[0], setVisible = _useState[1];
+    var _useState1 = _sliced_to_array(React.useState(false), 2), moving = _useState1[0], setMoving = _useState1[1];
+    var _useState2 = _sliced_to_array(React.useState(false), 2), zooming = _useState2[0], setZooming = _useState2[1];
+    var _useState3 = _sliced_to_array(React.useState({
+      defScale: 1,
+      scale: 1,
+      angle: 0,
+      moveX: 0,
+      moveY: 0,
+      displayWidth: 0,
+      displayHeight: 0
+    }), 2), state = _useState3[0], setState = _useState3[1];
+    var defDrawImage = {
+      img: new Image(),
+      sx: 0,
+      sy: 0,
+      swidth: 0,
+      sheight: 0,
+      x: 0,
+      y: 0,
+      width: 0,
+      height: 0
+    };
+    var _useState4 = _sliced_to_array(React.useState(_object_spread({}, defDrawImage)), 2), drawImage = _useState4[0], setDrawImg = _useState4[1];
+    var devicePixelRatio = window.devicePixelRatio || 1;
+    var touch = useTouch();
+    var highlightStyle = React.useMemo(function() {
+      var width2 = "".concat(drawImage.swidth / devicePixelRatio, "px");
+      var height2 = width2;
+      return {
+        width: width2,
+        height: height2,
+        borderRadius: shape === "round" ? "50%" : ""
+      };
+    }, [
+      devicePixelRatio,
+      drawImage.swidth
+    ]);
+    var isAngle = React.useMemo(function() {
+      return state.angle === 90 || state.angle === 270;
+    }, [
+      state.angle
+    ]);
+    var maxMoveX = React.useMemo(function() {
+      var swidth = drawImage.swidth, height2 = drawImage.height;
+      if (isAngle) {
+        return Math.max(0, (height2 * state.scale - swidth) / 2);
+      }
+      return Math.max(0, (state.displayWidth * state.scale - swidth) / 2);
+    }, [
+      state.scale,
+      state.displayWidth,
+      drawImage,
+      isAngle
+    ]);
+    var maxMoveY = React.useMemo(function() {
+      var swidth = drawImage.swidth, height2 = drawImage.height;
+      if (isAngle) {
+        return Math.max(0, (state.displayWidth * state.scale - swidth) / 2);
+      }
+      return Math.max(0, (height2 * state.scale - swidth) / 2);
+    }, [
+      state.scale,
+      state.displayWidth,
+      drawImage,
+      isAngle
+    ]);
+    var fileToDataURL = function(file) {
+      return new Promise(function(resolve) {
+        var reader = new FileReader();
+        reader.onloadend = function(e2) {
+          return resolve(e2.target.result);
+        };
+        reader.readAsDataURL(file);
+      });
+    };
+    var dataURLToImage = function(dataURL) {
+      return new Promise(function(resolve) {
+        var img = new Image();
+        img.onload = function() {
+          return resolve(img);
+        };
+        img.src = dataURL;
+      });
+    };
+    var draw = React.useCallback(function() {
+      var img = drawImage.img, width2 = drawImage.width, height2 = drawImage.height, x = drawImage.x, y = drawImage.y, swidth = drawImage.swidth;
+      var moveX = state.moveX, moveY = state.moveY, scale2 = state.scale, angle = state.angle, displayWidth = state.displayWidth, displayHeight = state.displayHeight;
+      var canvas = canvasRef.current;
+      if (!canvas) return;
+      var ctx2 = canvas.getContext("2d");
+      canvas.width = displayWidth;
+      canvas.height = displayHeight;
+      ctx2.clearRect(0, 0, canvas.width, canvas.height);
+      ctx2.fillStyle = "#666";
+      ctx2.fillRect(0, 0, canvas.width, canvas.height);
+      ctx2.fillStyle = "#000";
+      ctx2.fillRect(space * devicePixelRatio, (canvas.height - swidth) / 2, swidth, swidth);
+      ctx2.translate(canvas.width / 2 + moveX, canvas.height / 2 + moveY);
+      ctx2.rotate(Math.PI / 180 * angle);
+      ctx2.scale(scale2, scale2);
+      ctx2.drawImage(img, x, y, width2, height2);
+    }, [
+      drawImage,
+      state,
+      devicePixelRatio,
+      space
+    ]);
+    React.useEffect(function() {
+      if (Math.abs(state.moveX) > maxMoveX) {
+        setState(_object_spread_props(_object_spread({}, state), {
+          moveX: maxMoveX
+        }));
+      }
+      if (Math.abs(state.moveY) > maxMoveY) {
+        setState(_object_spread_props(_object_spread({}, state), {
+          moveY: maxMoveY
+        }));
+      }
+      draw();
+    }, [
+      state,
+      maxMoveX,
+      maxMoveY,
+      draw
+    ]);
+    var setDrawImgs = function(image) {
+      var rect = getRect(cropperPopupRef.current);
+      if (!rect) return;
+      var clientWidth = rect.width, clientHeight = rect.height;
+      var canvasWidth = state.displayWidth = clientWidth * devicePixelRatio;
+      var canvasHeight = state.displayHeight = clientHeight * devicePixelRatio;
+      var copyDrawImg = _object_spread({}, defDrawImage);
+      var imgWidth = image.width, imgHeight = image.height;
+      copyDrawImg.img = image;
+      var isPortrait = imgHeight > imgWidth;
+      var rate = isPortrait ? imgWidth / imgHeight : imgHeight / imgWidth;
+      copyDrawImg.width = canvasWidth;
+      copyDrawImg.height = isPortrait ? canvasWidth / rate : canvasWidth * rate;
+      copyDrawImg.x = -copyDrawImg.width / 2;
+      copyDrawImg.y = -copyDrawImg.height / 2;
+      copyDrawImg.swidth = canvasWidth - space * 2 * devicePixelRatio;
+      copyDrawImg.sheight = isPortrait ? copyDrawImg.swidth / rate : copyDrawImg.swidth * rate;
+      copyDrawImg.sx = space * devicePixelRatio;
+      copyDrawImg.sy = (canvasHeight - copyDrawImg.swidth) / 2;
+      setDrawImg(copyDrawImg);
+      var scale2 = copyDrawImg.swidth / (isPortrait ? copyDrawImg.width : copyDrawImg.height);
+      setState(_object_spread_props(_object_spread({}, state), {
+        defScale: scale2
+      }));
+      resetScale(scale2);
+    };
+    var inputImageChange = /* @__PURE__ */ function() {
+      var _ref2 = _async_to_generator(function(event) {
+        var $el, files, base64, image;
+        return __generator(this, function(_state) {
+          switch (_state.label) {
+            case 0:
+              setVisible(true);
+              $el = event.target;
+              files = $el.files;
+              if (!(files === null || files === void 0 ? void 0 : files.length)) return [
+                2
+              ];
+              return [
+                4,
+                fileToDataURL(files[0])
+              ];
+            case 1:
+              base64 = _state.sent();
+              return [
+                4,
+                dataURLToImage(base64)
+              ];
+            case 2:
+              image = _state.sent();
+              setDrawImgs(image);
+              return [
+                2
+              ];
+          }
+        });
+      });
+      return function inputImageChange2(event) {
+        return _ref2.apply(this, arguments);
+      };
+    }();
+    var resetScale = function(scale2) {
+      setState(_object_spread_props(_object_spread({}, state), {
+        moveX: 0,
+        moveY: 0,
+        angle: 0,
+        scale: scale2 || state.defScale,
+        defScale: scale2 || state.defScale
+      }));
+    };
+    var setScale = function(scale2) {
+      scale2 = clamp(scale2, 0.3, +maxZoom + 1);
+      if (scale2 !== state.scale) {
+        setState(_object_spread_props(_object_spread({}, state), {
+          scale: scale2
+        }));
+      }
+    };
+    var getDistance = function(touches) {
+      return Math.sqrt(Math.pow(touches[0].clientX - touches[1].clientX, 2) + Math.pow(touches[0].clientY - touches[1].clientY, 2));
+    };
+    var _useState5 = _sliced_to_array(React.useState({
+      startMoveX: 0,
+      startMoveY: 0,
+      startScale: 0,
+      startDistance: 0
+    }), 2), startMove = _useState5[0], setStartMove = _useState5[1];
+    var startMoveX = startMove.startMoveX, startMoveY = startMove.startMoveY, startScale = startMove.startScale, startDistance = startMove.startDistance;
+    var onTouchStart = function(event) {
+      var touches = event.touches;
+      var offsetX = touch.offsetX;
+      touch.start(event);
+      var fingerNum = touches === null || touches === void 0 ? void 0 : touches.length;
+      setStartMove(_object_spread_props(_object_spread({}, startMove), {
+        startMoveX: state.moveX,
+        startMoveY: state.moveY
+      }));
+      setMoving(fingerNum === 1);
+      setZooming(fingerNum === 2 && !offsetX.current);
+      if (fingerNum === 2 && !offsetX.current) {
+        setStartMove(_object_spread_props(_object_spread({}, startMove), {
+          startScale: state.scale,
+          startDistance: getDistance(event.touches)
+        }));
+      }
+    };
+    var onTouchMove = function(event) {
+      var touches = event.touches;
+      touch.move(event);
+      if (moving || zooming) {
+        preventDefault$1(event, true);
+      }
+      if (moving) {
+        var deltaX = touch.deltaX, deltaY = touch.deltaY;
+        var moveX = deltaX.current * state.scale + startMoveX;
+        var moveY = deltaY.current * state.scale + startMoveY;
+        setState(_object_spread_props(_object_spread({}, state), {
+          moveX: clamp(moveX, -maxMoveX, maxMoveX),
+          moveY: clamp(moveY, -maxMoveY, maxMoveY)
+        }));
+      }
+      if (zooming && touches.length === 2) {
+        var distance = getDistance(touches);
+        var scale2 = startScale * distance / startDistance;
+        setScale(scale2);
+      }
+    };
+    var onTouchEnd = function(event) {
+      var stopPropagation = false;
+      if (moving || zooming) {
+        stopPropagation = !(moving && startMoveX === state.moveX && startMoveY === state.moveY);
+        if (!event.touches.length) {
+          if (zooming) {
+            setState(_object_spread_props(_object_spread({}, state), {
+              moveX: clamp(state.moveX, -maxMoveX, maxMoveX),
+              moveY: clamp(state.moveY, -maxMoveY, maxMoveY)
+            }));
+            setZooming(false);
+          }
+          setMoving(false);
+          setStartMove(_object_spread_props(_object_spread({}, startMove), {
+            startMoveX: 0,
+            startMoveY: 0,
+            startScale: state.defScale
+          }));
+          if (state.scale < state.defScale) {
+            resetScale();
+          }
+          if (state.scale > maxZoom) {
+            setState(_object_spread_props(_object_spread({}, state), {
+              scale: +maxZoom
+            }));
+          }
+        }
+      }
+      preventDefault$1(event, stopPropagation);
+      touch.reset();
+    };
+    var reset = function() {
+      setState(_object_spread_props(_object_spread({}, state), {
+        angle: 0
+      }));
+    };
+    var rotate = function() {
+      if (state.angle === 270) {
+        setState(_object_spread_props(_object_spread({}, state), {
+          angle: 0
+        }));
+        return;
+      }
+      setState(_object_spread_props(_object_spread({}, state), {
+        angle: state.angle + 90
+      }));
+    };
+    var cancel = function() {
+      var isEmit = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true;
+      setVisible(false);
+      resetScale();
+      inputImageRef.current && (inputImageRef.current.value = "");
+      isEmit && onCancel && onCancel();
+    };
+    var confirm2 = function() {
+      var canvas = canvasRef.current;
+      var sx = drawImage.sx, sy = drawImage.sy, swidth = drawImage.swidth;
+      var width2 = swidth;
+      var height2 = swidth;
+      var croppedCanvas = document.createElement("canvas");
+      var croppedCtx = croppedCanvas.getContext("2d");
+      croppedCanvas.width = width2;
+      croppedCanvas.height = height2;
+      canvas && croppedCtx.drawImage(canvas, sx, sy, width2, height2, 0, 0, width2, height2);
+      var imageDataURL = croppedCanvas.toDataURL("image/png");
+      onConfirm && onConfirm(imageDataURL);
+      cancel(false);
+    };
+    var ToolBar = function() {
+      var actions = [
+        cancel,
+        reset,
+        rotate,
+        confirm2
+      ];
+      return /* @__PURE__ */ React.createElement("div", {
+        className: "".concat(classPrefix$1, "-popup-toolbar-flex")
+      }, actions.map(function(action, index2) {
+        return /* @__PURE__ */ React.createElement("div", {
+          key: index2,
+          className: "".concat(classPrefix$1, "-popup-toolbar-item"),
+          onClick: function(_e) {
+            return action();
+          }
+        }, toolbar[index2]);
+      }));
+    };
+    var CropperPopup = function() {
+      return /* @__PURE__ */ React.createElement("div", {
+        ref: cropperPopupRef,
+        className: "".concat(classPrefix$1, "-popup"),
+        style: {
+          display: visible ? "block" : "none"
+        }
+      }, /* @__PURE__ */ React.createElement("canvas", {
+        ref: canvasRef,
+        className: "".concat(classPrefix$1, "-popup-canvas")
+      }), /* @__PURE__ */ React.createElement("div", {
+        className: "".concat(classPrefix$1, "-popup-highlight"),
+        onTouchStart,
+        onTouchMove,
+        onTouchEnd
+      }, /* @__PURE__ */ React.createElement("div", {
+        className: "highlight",
+        style: highlightStyle
+      })), /* @__PURE__ */ React.createElement("div", {
+        className: toolbarPositionCls
+      }, /* @__PURE__ */ React.createElement(ToolBar, null)));
+    };
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", _object_spread_props(_object_spread({
+      className: cls
+    }, rest), {
+      style
+    }), children, /* @__PURE__ */ React.createElement("input", {
+      ref: inputImageRef,
+      type: "file",
+      accept: "image/*",
+      className: "".concat(classPrefix$1, "-input"),
+      onChange: function(e2) {
+        return inputImageChange(e2);
+      },
+      "aria-label": locale.avatarCropper.selectImage
+    }), /* @__PURE__ */ React.createElement("div", {
+      className: "nut-avatar-cropper-edit-text"
+    }, editText)), CropperPopup());
+  };
+  AvatarCropper.displayName = "NutAvatarCropper";
+  var defaultProps$5 = _object_spread_props(_object_spread({}, ComponentDefaults), {
     list: [],
     interval: 500,
     loop: true,
@@ -41815,9 +42324,9 @@ Please add \`${key2}Action\` when creating your handler.`);
     rows: 3,
     gapY: 10
   });
-  var classPrefix$1 = "nut-barrage";
+  var classPrefix = "nut-barrage";
   var InternalBarrage = function(props, ref) {
-    var _ref = _object_spread({}, defaultProps$6, props), className = _ref.className, interval = _ref.interval, loop2 = _ref.loop, list = _ref.list, duration = _ref.duration, rows = _ref.rows, gapY = _ref.gapY, restProps = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$5, props), className = _ref.className, interval = _ref.interval, loop2 = _ref.loop, list = _ref.list, duration = _ref.duration, rows = _ref.rows, gapY = _ref.gapY, restProps = _object_without_properties(_ref, [
       "className",
       "interval",
       "loop",
@@ -41833,7 +42342,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     var index2 = React.useRef(0);
     var times = React.useRef([]);
     var historyIndex = React.useRef(-1);
-    var classes = classNames(classPrefix$1, className);
+    var classes = classNames(classPrefix, className);
     React.useImperativeHandle(ref, function() {
       return {
         add: function(word) {
@@ -41912,7 +42421,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   };
   var Barrage = /* @__PURE__ */ React.forwardRef(InternalBarrage);
   Barrage.displayName = "NutBarrage";
-  var defaultProps$5 = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$4 = _object_spread_props(_object_spread({}, ComponentDefaults), {
     src: "",
     title: "",
     price: "",
@@ -41926,7 +42435,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     extra: ""
   });
   var Card = function(props) {
-    var _ref = _object_spread({}, defaultProps$5, props), className = _ref.className, style = _ref.style, src = _ref.src, title = _ref.title, price = _ref.price, vipPrice = _ref.vipPrice, shopDescription = _ref.shopDescription, delivery = _ref.delivery, shopName = _ref.shopName, tag = _ref.tag, priceTag = _ref.priceTag, description = _ref.description, extra = _ref.extra, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$4, props), className = _ref.className, style = _ref.style, src = _ref.src, title = _ref.title, price = _ref.price, vipPrice = _ref.vipPrice, shopDescription = _ref.shopDescription, delivery = _ref.delivery, shopName = _ref.shopName, tag = _ref.tag, priceTag = _ref.priceTag, description = _ref.description, extra = _ref.extra, rest = _object_without_properties(_ref, [
       "className",
       "style",
       "src",
@@ -41976,7 +42485,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     }, shopName), extra)));
   };
   Card.displayName = "NutCard";
-  var defaultProps$4 = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$3 = _object_spread_props(_object_spread({}, ComponentDefaults), {
     activeDate: "",
     activeTime: [],
     options: [],
@@ -41989,7 +42498,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     }
   });
   var TimeDetail = function(props) {
-    var _$_object_spread = _object_spread({}, defaultProps$4, props), options2 = _$_object_spread.options, optionKey = _$_object_spread.optionKey, className = _$_object_spread.className, activeDate = _$_object_spread.activeDate, activeTime = _$_object_spread.activeTime, onSelect = _$_object_spread.onSelect;
+    var _$_object_spread = _object_spread({}, defaultProps$3, props), options2 = _$_object_spread.options, optionKey = _$_object_spread.optionKey, className = _$_object_spread.className, activeDate = _$_object_spread.activeDate, activeTime = _$_object_spread.activeTime, onSelect = _$_object_spread.onSelect;
     var classPrefix2 = "nut-timedetail";
     var timeList = React.useMemo(function() {
       return (options2 === null || options2 === void 0 ? void 0 : options2.find(function(item) {
@@ -42031,7 +42540,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     }));
   };
   TimeDetail.displayName = "NutTimeDetail";
-  var defaultProps$3 = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$2 = _object_spread_props(_object_spread({}, ComponentDefaults), {
     visible: false,
     multiple: false,
     defaultValue: [],
@@ -42044,7 +42553,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   });
   var TimeSelect = function(props) {
     var locale = useConfig().locale;
-    var _ref = _object_spread({}, defaultProps$3, props), visible = _ref.visible, className = _ref.className, style = _ref.style, title = _ref.title, defaultValue = _ref.defaultValue, options2 = _ref.options, optionKey = _ref.optionKey, multiple = _ref.multiple, onSelect = _ref.onSelect, onDateChange = _ref.onDateChange, onTimeChange = _ref.onTimeChange, rest = _object_without_properties(_ref, [
+    var _ref = _object_spread({}, defaultProps$2, props), visible = _ref.visible, className = _ref.className, style = _ref.style, title = _ref.title, defaultValue = _ref.defaultValue, options2 = _ref.options, optionKey = _ref.optionKey, multiple = _ref.multiple, onSelect = _ref.onSelect, onDateChange = _ref.onDateChange, onTimeChange = _ref.onTimeChange, rest = _object_without_properties(_ref, [
       "visible",
       "className",
       "style",
@@ -42155,7 +42664,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     }))));
   };
   TimeSelect.displayName = "NutTimeSelect";
-  var defaultProps$2 = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps$1 = _object_spread_props(_object_spread({}, ComponentDefaults), {
     value: 0,
     digits: 2,
     symbol: false,
@@ -42169,7 +42678,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     dropIcon: null
   });
   var TrendArrow = function(props) {
-    var _ref = _object_spread({}, defaultProps$2, props), value2 = _ref.value, digits = _ref.digits, symbol = _ref.symbol, zero = _ref.zero, left = _ref.left, sync2 = _ref.sync, color = _ref.color, riseColor = _ref.riseColor, dropColor = _ref.dropColor, riseIcon = _ref.riseIcon, dropIcon = _ref.dropIcon, className = _ref.className, style = _ref.style;
+    var _ref = _object_spread({}, defaultProps$1, props), value2 = _ref.value, digits = _ref.digits, symbol = _ref.symbol, zero = _ref.zero, left = _ref.left, sync2 = _ref.sync, color = _ref.color, riseColor = _ref.riseColor, dropColor = _ref.dropColor, riseIcon = _ref.riseIcon, dropIcon = _ref.dropIcon, className = _ref.className, style = _ref.style;
     _ref.children;
     var rest = _object_without_properties(_ref, [
       "value",
@@ -42241,7 +42750,7 @@ Please add \`${key2}Action\` when creating your handler.`);
     }))), left && renderContent(!left));
   };
   TrendArrow.displayName = "NutTrendArrow";
-  var defaultProps$1 = _object_spread_props(_object_spread({}, ComponentDefaults), {
+  var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
     content: "",
     fullPage: true,
     zIndex: 2e3,
@@ -42262,7 +42771,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   });
   var WaterMark = function(props) {
     var locale = useConfig().locale;
-    var _$_object_spread = _object_spread({}, defaultProps$1, props), content2 = _$_object_spread.content, fullPage = _$_object_spread.fullPage, zIndex = _$_object_spread.zIndex, className = _$_object_spread.className, gapX = _$_object_spread.gapX, gapY = _$_object_spread.gapY, startX = _$_object_spread.startX, startY = _$_object_spread.startY, width2 = _$_object_spread.width, height2 = _$_object_spread.height, image = _$_object_spread.image, imageWidth = _$_object_spread.imageWidth, imageHeight = _$_object_spread.imageHeight, rotate = _$_object_spread.rotate, color = _$_object_spread.color, fontStyle = _$_object_spread.fontStyle, fontFamily = _$_object_spread.fontFamily, fontWeight = _$_object_spread.fontWeight, fontSize = _$_object_spread.fontSize, style = _$_object_spread.style;
+    var _$_object_spread = _object_spread({}, defaultProps, props), content2 = _$_object_spread.content, fullPage = _$_object_spread.fullPage, zIndex = _$_object_spread.zIndex, className = _$_object_spread.className, gapX = _$_object_spread.gapX, gapY = _$_object_spread.gapY, startX = _$_object_spread.startX, startY = _$_object_spread.startY, width2 = _$_object_spread.width, height2 = _$_object_spread.height, image = _$_object_spread.image, imageWidth = _$_object_spread.imageWidth, imageHeight = _$_object_spread.imageHeight, rotate = _$_object_spread.rotate, color = _$_object_spread.color, fontStyle = _$_object_spread.fontStyle, fontFamily = _$_object_spread.fontFamily, fontWeight = _$_object_spread.fontWeight, fontSize = _$_object_spread.fontSize, style = _$_object_spread.style;
     var _useState = _sliced_to_array(React.useState(""), 2), base64Url = _useState[0], setBase64Url = _useState[1];
     var classPrefix2 = "nut-watermark";
     var classes = classNames(classPrefix2, _define_property({}, "".concat(classPrefix2, "-full-page"), fullPage));
@@ -42319,446 +42828,6 @@ Please add \`${key2}Action\` when creating your handler.`);
     });
   };
   WaterMark.displayName = "NutWaterMark";
-  var defaultProps = _object_spread_props(_object_spread({}, ComponentDefaults), {
-    maxZoom: 3,
-    space: 10,
-    toolbar: [
-      /* @__PURE__ */ React.createElement(Button, {
-        type: "danger",
-        key: "cancel"
-      }, "Cancel"),
-      /* @__PURE__ */ React.createElement(Button, {
-        key: "reset"
-      }, "Reset"),
-      /* @__PURE__ */ React.createElement(Button, {
-        key: "rotate"
-      }, "Rotate"),
-      /* @__PURE__ */ React.createElement(Button, {
-        type: "success",
-        key: "confirm"
-      }, "Confirm")
-    ],
-    toolbarPosition: "bottom",
-    editText: "Edit",
-    shape: "square"
-  });
-  var classPrefix = "nut-avatar-cropper";
-  var AvatarCropper = function(props) {
-    var locale = useConfig().locale;
-    defaultProps.toolbar = [
-      /* @__PURE__ */ React.createElement(Button, {
-        type: "danger",
-        key: "cancel"
-      }, locale.cancel),
-      /* @__PURE__ */ React.createElement(Button, {
-        key: "reset"
-      }, locale.reset),
-      /* @__PURE__ */ React.createElement(Button, {
-        key: "rotate"
-      }, locale.avatarCropper.rotate),
-      /* @__PURE__ */ React.createElement(Button, {
-        type: "success",
-        key: "confirm"
-      }, locale.confirm)
-    ];
-    var _ref = _object_spread({}, defaultProps, props), children = _ref.children, maxZoom = _ref.maxZoom, space = _ref.space, toolbar = _ref.toolbar, toolbarPosition = _ref.toolbarPosition, editText = _ref.editText, shape = _ref.shape, className = _ref.className, style = _ref.style, onConfirm = _ref.onConfirm, onCancel = _ref.onCancel, rest = _object_without_properties(_ref, [
-      "children",
-      "maxZoom",
-      "space",
-      "toolbar",
-      "toolbarPosition",
-      "editText",
-      "shape",
-      "className",
-      "style",
-      "onConfirm",
-      "onCancel"
-    ]);
-    var cls = classNames(classPrefix, className, shape === "round" && "round");
-    var toolbarPositionCls = classNames("".concat(classPrefix, "-popup-toolbar"), toolbarPosition);
-    var inputImageRef = React.useRef(null);
-    var cropperPopupRef = React.useRef(null);
-    var canvasRef = React.useRef(null);
-    var _useState = _sliced_to_array(React.useState(false), 2), visible = _useState[0], setVisible = _useState[1];
-    var _useState1 = _sliced_to_array(React.useState(false), 2), moving = _useState1[0], setMoving = _useState1[1];
-    var _useState2 = _sliced_to_array(React.useState(false), 2), zooming = _useState2[0], setZooming = _useState2[1];
-    var _useState3 = _sliced_to_array(React.useState({
-      defScale: 1,
-      scale: 1,
-      angle: 0,
-      moveX: 0,
-      moveY: 0,
-      displayWidth: 0,
-      displayHeight: 0
-    }), 2), state = _useState3[0], setState = _useState3[1];
-    var defDrawImage = {
-      img: new Image(),
-      sx: 0,
-      sy: 0,
-      swidth: 0,
-      sheight: 0,
-      x: 0,
-      y: 0,
-      width: 0,
-      height: 0
-    };
-    var _useState4 = _sliced_to_array(React.useState(_object_spread({}, defDrawImage)), 2), drawImage = _useState4[0], setDrawImg = _useState4[1];
-    var devicePixelRatio = window.devicePixelRatio || 1;
-    var touch = useTouch();
-    var highlightStyle = React.useMemo(function() {
-      var width2 = "".concat(drawImage.swidth / devicePixelRatio, "px");
-      var height2 = width2;
-      return {
-        width: width2,
-        height: height2,
-        borderRadius: shape === "round" ? "50%" : ""
-      };
-    }, [
-      devicePixelRatio,
-      drawImage.swidth
-    ]);
-    var isAngle = React.useMemo(function() {
-      return state.angle === 90 || state.angle === 270;
-    }, [
-      state.angle
-    ]);
-    var maxMoveX = React.useMemo(function() {
-      var swidth = drawImage.swidth, height2 = drawImage.height;
-      if (isAngle) {
-        return Math.max(0, (height2 * state.scale - swidth) / 2);
-      }
-      return Math.max(0, (state.displayWidth * state.scale - swidth) / 2);
-    }, [
-      state.scale,
-      state.displayWidth,
-      drawImage,
-      isAngle
-    ]);
-    var maxMoveY = React.useMemo(function() {
-      var swidth = drawImage.swidth, height2 = drawImage.height;
-      if (isAngle) {
-        return Math.max(0, (state.displayWidth * state.scale - swidth) / 2);
-      }
-      return Math.max(0, (height2 * state.scale - swidth) / 2);
-    }, [
-      state.scale,
-      state.displayWidth,
-      drawImage,
-      isAngle
-    ]);
-    var fileToDataURL = function(file) {
-      return new Promise(function(resolve) {
-        var reader = new FileReader();
-        reader.onloadend = function(e2) {
-          return resolve(e2.target.result);
-        };
-        reader.readAsDataURL(file);
-      });
-    };
-    var dataURLToImage = function(dataURL) {
-      return new Promise(function(resolve) {
-        var img = new Image();
-        img.onload = function() {
-          return resolve(img);
-        };
-        img.src = dataURL;
-      });
-    };
-    var draw = React.useCallback(function() {
-      var img = drawImage.img, width2 = drawImage.width, height2 = drawImage.height, x = drawImage.x, y = drawImage.y, swidth = drawImage.swidth;
-      var moveX = state.moveX, moveY = state.moveY, scale2 = state.scale, angle = state.angle, displayWidth = state.displayWidth, displayHeight = state.displayHeight;
-      var canvas = canvasRef.current;
-      if (!canvas) return;
-      var ctx2 = canvas.getContext("2d");
-      canvas.width = displayWidth;
-      canvas.height = displayHeight;
-      ctx2.clearRect(0, 0, canvas.width, canvas.height);
-      ctx2.fillStyle = "#666";
-      ctx2.fillRect(0, 0, canvas.width, canvas.height);
-      ctx2.fillStyle = "#000";
-      ctx2.fillRect(space * devicePixelRatio, (canvas.height - swidth) / 2, swidth, swidth);
-      ctx2.translate(canvas.width / 2 + moveX, canvas.height / 2 + moveY);
-      ctx2.rotate(Math.PI / 180 * angle);
-      ctx2.scale(scale2, scale2);
-      ctx2.drawImage(img, x, y, width2, height2);
-    }, [
-      drawImage,
-      state,
-      devicePixelRatio,
-      space
-    ]);
-    React.useEffect(function() {
-      if (Math.abs(state.moveX) > maxMoveX) {
-        setState(_object_spread_props(_object_spread({}, state), {
-          moveX: maxMoveX
-        }));
-      }
-      if (Math.abs(state.moveY) > maxMoveY) {
-        setState(_object_spread_props(_object_spread({}, state), {
-          moveY: maxMoveY
-        }));
-      }
-      draw();
-    }, [
-      state,
-      maxMoveX,
-      maxMoveY,
-      draw
-    ]);
-    var setDrawImgs = function(image) {
-      var rect = getRect(cropperPopupRef.current);
-      if (!rect) return;
-      var clientWidth = rect.width, clientHeight = rect.height;
-      var canvasWidth = state.displayWidth = clientWidth * devicePixelRatio;
-      var canvasHeight = state.displayHeight = clientHeight * devicePixelRatio;
-      var copyDrawImg = _object_spread({}, defDrawImage);
-      var imgWidth = image.width, imgHeight = image.height;
-      copyDrawImg.img = image;
-      var isPortrait = imgHeight > imgWidth;
-      var rate = isPortrait ? imgWidth / imgHeight : imgHeight / imgWidth;
-      copyDrawImg.width = canvasWidth;
-      copyDrawImg.height = isPortrait ? canvasWidth / rate : canvasWidth * rate;
-      copyDrawImg.x = -copyDrawImg.width / 2;
-      copyDrawImg.y = -copyDrawImg.height / 2;
-      copyDrawImg.swidth = canvasWidth - space * 2 * devicePixelRatio;
-      copyDrawImg.sheight = isPortrait ? copyDrawImg.swidth / rate : copyDrawImg.swidth * rate;
-      copyDrawImg.sx = space * devicePixelRatio;
-      copyDrawImg.sy = (canvasHeight - copyDrawImg.swidth) / 2;
-      setDrawImg(copyDrawImg);
-      var scale2 = copyDrawImg.swidth / (isPortrait ? copyDrawImg.width : copyDrawImg.height);
-      setState(_object_spread_props(_object_spread({}, state), {
-        defScale: scale2
-      }));
-      resetScale(scale2);
-    };
-    var inputImageChange = /* @__PURE__ */ function() {
-      var _ref2 = _async_to_generator(function(event) {
-        var $el, files, base64, image;
-        return __generator(this, function(_state) {
-          switch (_state.label) {
-            case 0:
-              setVisible(true);
-              $el = event.target;
-              files = $el.files;
-              if (!(files === null || files === void 0 ? void 0 : files.length)) return [
-                2
-              ];
-              return [
-                4,
-                fileToDataURL(files[0])
-              ];
-            case 1:
-              base64 = _state.sent();
-              return [
-                4,
-                dataURLToImage(base64)
-              ];
-            case 2:
-              image = _state.sent();
-              setDrawImgs(image);
-              return [
-                2
-              ];
-          }
-        });
-      });
-      return function inputImageChange2(event) {
-        return _ref2.apply(this, arguments);
-      };
-    }();
-    var resetScale = function(scale2) {
-      setState(_object_spread_props(_object_spread({}, state), {
-        moveX: 0,
-        moveY: 0,
-        angle: 0,
-        scale: scale2 || state.defScale,
-        defScale: scale2 || state.defScale
-      }));
-    };
-    var setScale = function(scale2) {
-      scale2 = clamp(scale2, 0.3, +maxZoom + 1);
-      if (scale2 !== state.scale) {
-        setState(_object_spread_props(_object_spread({}, state), {
-          scale: scale2
-        }));
-      }
-    };
-    var getDistance = function(touches) {
-      return Math.sqrt(Math.pow(touches[0].clientX - touches[1].clientX, 2) + Math.pow(touches[0].clientY - touches[1].clientY, 2));
-    };
-    var _useState5 = _sliced_to_array(React.useState({
-      startMoveX: 0,
-      startMoveY: 0,
-      startScale: 0,
-      startDistance: 0
-    }), 2), startMove = _useState5[0], setStartMove = _useState5[1];
-    var startMoveX = startMove.startMoveX, startMoveY = startMove.startMoveY, startScale = startMove.startScale, startDistance = startMove.startDistance;
-    var onTouchStart = function(event) {
-      var touches = event.touches;
-      var offsetX = touch.offsetX;
-      touch.start(event);
-      var fingerNum = touches === null || touches === void 0 ? void 0 : touches.length;
-      setStartMove(_object_spread_props(_object_spread({}, startMove), {
-        startMoveX: state.moveX,
-        startMoveY: state.moveY
-      }));
-      setMoving(fingerNum === 1);
-      setZooming(fingerNum === 2 && !offsetX.current);
-      if (fingerNum === 2 && !offsetX.current) {
-        setStartMove(_object_spread_props(_object_spread({}, startMove), {
-          startScale: state.scale,
-          startDistance: getDistance(event.touches)
-        }));
-      }
-    };
-    var onTouchMove = function(event) {
-      var touches = event.touches;
-      touch.move(event);
-      if (moving || zooming) {
-        preventDefault$1(event, true);
-      }
-      if (moving) {
-        var deltaX = touch.deltaX, deltaY = touch.deltaY;
-        var moveX = deltaX.current * state.scale + startMoveX;
-        var moveY = deltaY.current * state.scale + startMoveY;
-        setState(_object_spread_props(_object_spread({}, state), {
-          moveX: clamp(moveX, -maxMoveX, maxMoveX),
-          moveY: clamp(moveY, -maxMoveY, maxMoveY)
-        }));
-      }
-      if (zooming && touches.length === 2) {
-        var distance = getDistance(touches);
-        var scale2 = startScale * distance / startDistance;
-        setScale(scale2);
-      }
-    };
-    var onTouchEnd = function(event) {
-      var stopPropagation = false;
-      if (moving || zooming) {
-        stopPropagation = !(moving && startMoveX === state.moveX && startMoveY === state.moveY);
-        if (!event.touches.length) {
-          if (zooming) {
-            setState(_object_spread_props(_object_spread({}, state), {
-              moveX: clamp(state.moveX, -maxMoveX, maxMoveX),
-              moveY: clamp(state.moveY, -maxMoveY, maxMoveY)
-            }));
-            setZooming(false);
-          }
-          setMoving(false);
-          setStartMove(_object_spread_props(_object_spread({}, startMove), {
-            startMoveX: 0,
-            startMoveY: 0,
-            startScale: state.defScale
-          }));
-          if (state.scale < state.defScale) {
-            resetScale();
-          }
-          if (state.scale > maxZoom) {
-            setState(_object_spread_props(_object_spread({}, state), {
-              scale: +maxZoom
-            }));
-          }
-        }
-      }
-      preventDefault$1(event, stopPropagation);
-      touch.reset();
-    };
-    var reset = function() {
-      setState(_object_spread_props(_object_spread({}, state), {
-        angle: 0
-      }));
-    };
-    var rotate = function() {
-      if (state.angle === 270) {
-        setState(_object_spread_props(_object_spread({}, state), {
-          angle: 0
-        }));
-        return;
-      }
-      setState(_object_spread_props(_object_spread({}, state), {
-        angle: state.angle + 90
-      }));
-    };
-    var cancel = function() {
-      var isEmit = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : true;
-      setVisible(false);
-      resetScale();
-      inputImageRef.current && (inputImageRef.current.value = "");
-      isEmit && onCancel && onCancel();
-    };
-    var confirm2 = function() {
-      var canvas = canvasRef.current;
-      var sx = drawImage.sx, sy = drawImage.sy, swidth = drawImage.swidth;
-      var width2 = swidth;
-      var height2 = swidth;
-      var croppedCanvas = document.createElement("canvas");
-      var croppedCtx = croppedCanvas.getContext("2d");
-      croppedCanvas.width = width2;
-      croppedCanvas.height = height2;
-      canvas && croppedCtx.drawImage(canvas, sx, sy, width2, height2, 0, 0, width2, height2);
-      var imageDataURL = croppedCanvas.toDataURL("image/png");
-      onConfirm && onConfirm(imageDataURL);
-      cancel(false);
-    };
-    var ToolBar = function() {
-      var actions = [
-        cancel,
-        reset,
-        rotate,
-        confirm2
-      ];
-      return /* @__PURE__ */ React.createElement("div", {
-        className: "".concat(classPrefix, "-popup-toolbar-flex")
-      }, actions.map(function(action, index2) {
-        return /* @__PURE__ */ React.createElement("div", {
-          key: index2,
-          className: "".concat(classPrefix, "-popup-toolbar-item"),
-          onClick: function(_e) {
-            return action();
-          }
-        }, toolbar[index2]);
-      }));
-    };
-    var CropperPopup = function() {
-      return /* @__PURE__ */ React.createElement("div", {
-        ref: cropperPopupRef,
-        className: "".concat(classPrefix, "-popup"),
-        style: {
-          display: visible ? "block" : "none"
-        }
-      }, /* @__PURE__ */ React.createElement("canvas", {
-        ref: canvasRef,
-        className: "".concat(classPrefix, "-popup-canvas")
-      }), /* @__PURE__ */ React.createElement("div", {
-        className: "".concat(classPrefix, "-popup-highlight"),
-        onTouchStart,
-        onTouchMove,
-        onTouchEnd
-      }, /* @__PURE__ */ React.createElement("div", {
-        className: "highlight",
-        style: highlightStyle
-      })), /* @__PURE__ */ React.createElement("div", {
-        className: toolbarPositionCls
-      }, /* @__PURE__ */ React.createElement(ToolBar, null)));
-    };
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("div", _object_spread_props(_object_spread({
-      className: cls
-    }, rest), {
-      style
-    }), children, /* @__PURE__ */ React.createElement("input", {
-      ref: inputImageRef,
-      type: "file",
-      accept: "image/*",
-      className: "".concat(classPrefix, "-input"),
-      onChange: function(e2) {
-        return inputImageChange(e2);
-      },
-      "aria-label": locale.avatarCropper.selectImage
-    }), /* @__PURE__ */ React.createElement("div", {
-      className: "nut-avatar-cropper-edit-text"
-    }, editText)), CropperPopup());
-  };
-  AvatarCropper.displayName = "NutAvatarCropper";
   exports.ActionSheet = ActionSheet;
   exports.Address = Address;
   exports.Animate = Animate;
@@ -42787,6 +42856,7 @@ Please add \`${key2}Action\` when creating your handler.`);
   exports.ConfigProvider = ConfigProvider;
   exports.CountDown = CountDown;
   exports.DatePicker = DatePicker;
+  exports.DatePickerView = DatePickerView;
   exports.Dialog = Dialog;
   exports.Divider = Divider;
   exports.Drag = Drag;
@@ -42835,15 +42905,12 @@ Please add \`${key2}Action\` when creating your handler.`);
   exports.Segmented = Segmented;
   exports.ShortPassword = ShortPassword;
   exports.SideBar = SideBar;
-  exports.SideNavBar = SideNavBar;
-  exports.SideNavBarItem = SideNavBarItem;
   exports.Signature = Signature;
   exports.Skeleton = Skeleton;
   exports.Space = Space;
   exports.Step = Step;
   exports.Steps = Steps;
   exports.Sticky = Sticky;
-  exports.SubSideNavBar = SubSideNavBar;
   exports.Swipe = Swipe;
   exports.Swiper = InnerSwiper;
   exports.SwiperItem = SwiperItem;