@nutui/nutui-react 2.0.24 → 2.1.0-beta.1

package/dist/nutui.react.es.js

@@ -6,7 +6,7 @@ var __publicField = (obj, key, value) => {
 };
 var _a;
 /*!
-* @nutui/nutui-react v2.0.24 Fri Nov 10 2023 14:51:56 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.1.0 Fri Nov 17 2023 14:49:44 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */
@@ -746,7 +746,7 @@ const e$3 = (a2) => /* @__PURE__ */ Oe(hr, { ...a2, name: a2.name || "ArrowDown2
   }
 ) });
 e$3.defaultProps = Pe;
-const t$c = (a2) => /* @__PURE__ */ Oe(hr, { ...a2, name: a2.name || "ArrowUp2", viewBox: "0 0 2472 1024", children: /* @__PURE__ */ Oe(
+const t$b = (a2) => /* @__PURE__ */ Oe(hr, { ...a2, name: a2.name || "ArrowUp2", viewBox: "0 0 2472 1024", children: /* @__PURE__ */ Oe(
   "path",
   {
     d: "M623.406 815.479A129.722 129.722 0 1 1 487.068 594.95C691.9 468.083 896.73 341.993 1101.691 215.125a194.583 194.583 0 0 1 204.442 0l614.494 379.567a129.722 129.722 0 1 1-136.338 220.657l-580.506-358.292-580.377 358.422",
@@ -754,7 +754,7 @@ const t$c = (a2) => /* @__PURE__ */ Oe(hr, { ...a2, name: a2.name || "ArrowUp2",
     fillOpacity: "0.9"
   }
 ) });
-t$c.defaultProps = Pe;
+t$b.defaultProps = Pe;
 const o$5 = (a2) => /* @__PURE__ */ pr(hr, { ...a2, name: a2.name || "CheckChecked", viewBox: "0 0 1032 1024", children: [
   /* @__PURE__ */ Oe(
     "path",
@@ -784,7 +784,7 @@ const l$3 = (a2) => /* @__PURE__ */ Oe(hr, { ...a2, name: a2.name || "CheckDisab
   }
 ) });
 l$3.defaultProps = Pe;
-const t$b = (a2) => /* @__PURE__ */ Oe(hr, { ...a2, name: a2.name || "CheckNormal", viewBox: "0 0 1024 1024", children: /* @__PURE__ */ Oe(
+const t$a = (a2) => /* @__PURE__ */ Oe(hr, { ...a2, name: a2.name || "CheckNormal", viewBox: "0 0 1024 1024", children: /* @__PURE__ */ Oe(
   "path",
   {
     d: "M512 1024c-136.533 0-264.533-54.044-361.244-150.756C54.044 776.534 0 648.534 0 512c0-136.533 54.044-264.533 150.756-361.244C247.466 54.044 375.466 0 512 0c136.533 0 264.533 54.044 361.244 150.756C969.956 247.466 1024 375.466 1024 512s-54.044 264.533-150.756 361.244C776.534 969.956 648.534 1024 512 1024zm0-938.667c-113.778 0-221.867 45.511-301.511 125.156S85.333 398.222 85.333 512s45.511 221.867 125.156 301.511S398.222 938.667 512 938.667s221.867-45.511 301.511-125.156S938.667 625.778 938.667 512 893.156 290.133 813.51 210.489 625.778 85.333 512 85.333z",
@@ -792,7 +792,7 @@ const t$b = (a2) => /* @__PURE__ */ Oe(hr, { ...a2, name: a2.name || "CheckNorma
     fillOpacity: "0.9"
   }
 ) });
-t$b.defaultProps = Pe;
+t$a.defaultProps = Pe;
 const o$4 = (a2) => /* @__PURE__ */ Oe(hr, { ...a2, name: a2.name || "Check", viewBox: "0 0 1024 1024", children: /* @__PURE__ */ Oe(
   "path",
   {
@@ -811,7 +811,7 @@ const o$3 = (e2) => /* @__PURE__ */ Oe(hr, { ...e2, name: e2.name || "Checked",
   }
 ) });
 o$3.defaultProps = Pe;
-const r$5 = (t2) => /* @__PURE__ */ Oe(hr, { ...t2, name: t2.name || "Checklist", viewBox: "0 0 1024 1024", children: /* @__PURE__ */ Oe(
+const r$4 = (t2) => /* @__PURE__ */ Oe(hr, { ...t2, name: t2.name || "Checklist", viewBox: "0 0 1024 1024", children: /* @__PURE__ */ Oe(
   "path",
   {
     d: "M159.289 500.622c62.578 0 125.155 17.067 221.867 102.4 8.533 5.69 19.91 5.69 25.6 0 48.355-54.044 238.933-261.689 455.11-329.955 0 0 28.445-5.69 42.667 19.91 8.534 17.067 19.911 34.134-5.689 54.045-22.755 17.067-264.533 179.2-440.888 440.89l-2.845 2.844c-11.378 8.533-68.267 51.2-119.467-14.223-56.888-71.11-85.333-139.377-196.266-196.266-2.845 0-2.845-2.845-5.69-5.69-11.377-11.377-54.044-73.955 25.6-73.955z",
@@ -819,17 +819,8 @@ const r$5 = (t2) => /* @__PURE__ */ Oe(hr, { ...t2, name: t2.name || "Checklist"
     fillOpacity: "0.9"
   }
 ) });
-r$5.defaultProps = Pe;
-const r$4 = (c6) => /* @__PURE__ */ Oe(hr, { ...c6, name: c6.name || "CircleClose", viewBox: "0 0 1024 1024", children: /* @__PURE__ */ Oe(
-  "path",
-  {
-    d: "M511.492 73.063a438.425 438.425 0 0 1 310.545 748.953 439.16 439.16 0 1 1-621.09-621.073A435.695 435.695 0 0 1 511.492 73.046m0-73.063C267.49.018 57.468 172.408 9.87 411.717-37.713 651.042 90.39 890.658 315.823 984.03c225.45 93.355 485.444 14.472 621.005-188.416 135.543-202.906 108.885-473.293-63.659-645.82A509.645 509.645 0 0 0 511.492.002zm-175.7 635.495 299.673-299.674c12.049-12.049 24.115-12.049 36.164 0l15.496 15.497c12.05 12.066 12.05 24.115 0 36.18L387.47 687.122c-12.066 12.05-24.115 12.05-36.181 0l-15.497-15.496c-12.049-12.066-12.049-24.115 0-36.182zm0-284.177 15.496-15.497c12.066-12.049 24.115-12.049 36.18 0l299.64 299.674c12.05 12.049 12.05 24.098 0 36.164l-15.496 15.496c-12.05 12.05-24.115 12.05-36.182 0L335.808 387.465c-12.049-12.05-12.049-24.098 0-36.164z",
-    fill: "currentColor",
-    fillOpacity: "0.9"
-  }
-) });
 r$4.defaultProps = Pe;
-const t$a = (a2) => /* @__PURE__ */ Oe(hr, { ...a2, name: a2.name || "Close", viewBox: "0 0 1026 1024", children: /* @__PURE__ */ Oe(
+const t$9 = (a2) => /* @__PURE__ */ Oe(hr, { ...a2, name: a2.name || "Close", viewBox: "0 0 1026 1024", children: /* @__PURE__ */ Oe(
   "path",
   {
     d: "M981.577 1024c-11.703 0-23.406-2.926-32.183-11.703L13.166 76.07c-14.629-17.555-14.629-46.812 0-64.366 17.554-14.629 46.811-14.629 64.365 0L1013.76 947.93c17.554 17.555 17.554 43.886 0 61.44-8.777 11.703-20.48 14.629-32.183 14.629zm-936.228 0c-11.703 0-23.406-2.926-32.183-11.703-17.555-17.554-17.555-43.886 0-61.44L949.394 14.63c17.555-17.555 43.886-17.555 61.44 0 17.555 17.554 17.555 43.885 0 61.44L74.606 1012.297C68.754 1021.074 57.05 1024 45.349 1024z",
@@ -837,8 +828,8 @@ const t$a = (a2) => /* @__PURE__ */ Oe(hr, { ...a2, name: a2.name || "Close", vi
     fillOpacity: "0.9"
   }
 ) });
-t$a.defaultProps = Pe;
-const t$9 = (c6) => /* @__PURE__ */ Oe(hr, { ...c6, name: c6.name || "Del", viewBox: "0 0 1024 1024", children: /* @__PURE__ */ Oe(
+t$9.defaultProps = Pe;
+const t$8 = (c6) => /* @__PURE__ */ Oe(hr, { ...c6, name: c6.name || "Del", viewBox: "0 0 1024 1024", children: /* @__PURE__ */ Oe(
   "path",
   {
     d: "M668.444 1024H355.556c-142.223 0-256-113.778-256-256V170.667h824.888V768c0 142.222-113.777 256-256 256zM184.89 256v512c0 93.867 76.8 170.667 170.667 170.667h312.888c93.867 0 170.667-76.8 170.667-170.667V256H184.89zm753.778 0H85.333c-22.755 0-42.666-19.911-42.666-42.667s19.91-42.666 42.666-42.666h853.334c22.755 0 42.666 19.91 42.666 42.666S961.423 256 938.667 256zM625.777 85.333H398.223c-22.755 0-42.666-19.91-42.666-42.666S375.466 0 398.222 0h227.556c22.755 0 42.666 19.911 42.666 42.667s-19.91 42.666-42.666 42.666z",
@@ -846,7 +837,7 @@ const t$9 = (c6) => /* @__PURE__ */ Oe(hr, { ...c6, name: c6.name || "Del", view
     fillOpacity: "0.9"
   }
 ) });
-t$9.defaultProps = Pe;
+t$8.defaultProps = Pe;
 const e$2 = (r2) => /* @__PURE__ */ Oe(hr, { ...r2, name: r2.name || "DownArrow", viewBox: "0 0 1024 1024", children: /* @__PURE__ */ Oe(
   "path",
   {
@@ -856,7 +847,7 @@ const e$2 = (r2) => /* @__PURE__ */ Oe(hr, { ...r2, name: r2.name || "DownArrow"
   }
 ) });
 e$2.defaultProps = Pe;
-const t$8 = (l2) => /* @__PURE__ */ Oe(hr, { ...l2, name: l2.name || "Failure", viewBox: "0 0 1024 1024", children: /* @__PURE__ */ Oe(
+const t$7 = (l2) => /* @__PURE__ */ Oe(hr, { ...l2, name: l2.name || "Failure", viewBox: "0 0 1024 1024", children: /* @__PURE__ */ Oe(
   "path",
   {
     d: "M512 1024C229.831 1024 0 794.169 0 512S229.831 0 512 0s512 229.831 512 512-229.831 512-512 512zm0-955.733C266.24 68.267 68.267 266.24 68.267 512S266.24 955.733 512 955.733 955.733 757.76 955.733 512 757.76 68.267 512 68.267zm111.502 282.169c13.654-13.654 34.134-13.654 47.787 0 11.378 11.377 13.653 31.857 2.275 45.51l-2.275 2.276-111.502 111.502 111.502 111.503c13.653 13.653 13.653 34.133 0 47.786-13.653 13.654-34.133 13.654-47.787 0L512 557.511 400.498 669.013c-11.378 11.378-31.858 13.654-45.511 2.276l-2.276-2.276c-11.378-11.377-13.653-31.857-2.275-45.51l2.275-2.276 111.502-111.503-111.502-111.502c-13.653-13.653-13.653-34.133 0-47.786s34.133-13.654 47.787 0L512 461.938l111.502-111.502z",
@@ -864,7 +855,7 @@ const t$8 = (l2) => /* @__PURE__ */ Oe(hr, { ...l2, name: l2.name || "Failure",
     fillOpacity: "0.9"
   }
 ) });
-t$8.defaultProps = Pe;
+t$7.defaultProps = Pe;
 const e$1 = (l2) => /* @__PURE__ */ pr(hr, { ...l2, name: l2.name || "ImageError", viewBox: "0 0 1024 1024", children: [
   /* @__PURE__ */ Oe(
     "path",
@@ -905,15 +896,6 @@ const e = (c6) => /* @__PURE__ */ pr(hr, { ...c6, name: c6.name || "Image", view
   )
 ] });
 e.defaultProps = Pe;
-const t$7 = (s) => /* @__PURE__ */ Oe(hr, { ...s, name: s.name || "Issue", viewBox: "0 0 1024 1024", children: /* @__PURE__ */ Oe(
-  "path",
-  {
-    d: "M512 1024C229.831 1024 0 794.169 0 512S229.831 0 512 0s512 229.831 512 512-229.831 512-512 512zm0-955.733C266.24 68.267 68.267 266.24 68.267 512S266.24 955.733 512 955.733 955.733 757.76 955.733 512 757.76 68.267 512 68.267zm31.858 377.742c18.204 0 34.133 15.929 34.133 34.133 0 2.276 0 15.93-2.275 18.205l-34.134 195.697h29.582c18.205 0 34.134 15.93 34.134 34.134s-15.93 34.133-34.134 34.133h-91.022c-18.204 0-34.133-15.929-34.133-34.133v-20.48L480.142 512H450.56c-18.204 0-34.133-15.929-34.133-34.133s15.929-34.134 34.133-34.134h93.298zm-34.134-207.076c38.685 0 68.267 29.583 68.267 68.267s-29.582 68.267-68.267 68.267-68.266-29.583-68.266-68.267 29.582-68.267 68.266-68.267z",
-    fill: "currentColor",
-    fillOpacity: "0.9"
-  }
-) });
-t$7.defaultProps = Pe;
 const t$6 = (a2) => /* @__PURE__ */ Oe(hr, { ...a2, name: a2.name || "JoySmile", viewBox: "0 0 3072 1024", children: /* @__PURE__ */ Oe(
   "path",
   {
@@ -1099,7 +1081,7 @@ const ComponentDefaults = {
   className: "",
   style: {}
 };
-const prefixCls$1 = "nut-button";
+const prefixCls$2 = "nut-button";
 const defaultProps$1u = {
   ...ComponentDefaults,
   color: "",
@@ -1165,17 +1147,17 @@ const Button = React__default.forwardRef(
         ref,
         type: nativeType,
         className: classNames(
-          prefixCls$1,
-          className,
-          props.type ? `${prefixCls$1}--${type4}` : null,
-          props.fill ? `${prefixCls$1}--${fill}` : null,
+          prefixCls$2,
+          props.type ? `${prefixCls$2}--${type4}` : null,
+          props.fill ? `${prefixCls$2}--${fill}` : null,
           {
-            [`${prefixCls$1}--${size}`]: size,
-            [`${prefixCls$1}--${shape}`]: shape,
-            [`${prefixCls$1}--block`]: block,
-            [`${prefixCls$1}--disabled`]: disabled,
-            [`${prefixCls$1}--loading`]: loading
-          }
+            [`${prefixCls$2}--${size}`]: size,
+            [`${prefixCls$2}--${shape}`]: shape,
+            [`${prefixCls$2}--block`]: block,
+            [`${prefixCls$2}--disabled`]: disabled,
+            [`${prefixCls$2}--loading`]: loading
+          },
+          className
         ),
         style: { ...getStyle(), ...style },
         onClick: (e2) => handleClick2(e2)
@@ -1192,16 +1174,16 @@ const defaultProps$1t = {
   description: "",
   divider: true
 };
-const classPrefix$q = "nut-cell-group";
+const classPrefix$r = "nut-cell-group";
 const CellGroup = (props) => {
   const { children, className, style, title, description, divider, ...rest } = {
     ...defaultProps$1t,
     ...props
   };
-  return /* @__PURE__ */ React__default.createElement("div", { className: classNames(classPrefix$q, className), ...rest }, title ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix$q}__title` }, title) : null, description ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix$q}__description` }, description) : null, /* @__PURE__ */ React__default.createElement(
+  return /* @__PURE__ */ React__default.createElement("div", { className: classNames(classPrefix$r, className), ...rest }, title ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix$r}__title` }, title) : null, description ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix$r}__description` }, description) : null, /* @__PURE__ */ React__default.createElement(
     "div",
     {
-      className: `${classPrefix$q}__wrap ${divider ? `${classPrefix$q}__wrap--divider` : ""}`
+      className: `${classPrefix$r}__wrap ${divider ? `${classPrefix$r}__wrap--divider` : ""}`
     },
     /* @__PURE__ */ React__default.createElement(CellGroupContext.Provider, { value: { divider } }, children)
   ));
@@ -1218,7 +1200,7 @@ const defaultProps$1s = {
   onClick: (event) => {
   }
 };
-const classPrefix$p = "nut-cell";
+const classPrefix$q = "nut-cell";
 const Cell = (props) => {
   const ctx2 = useContext(CellGroupContext);
   const {
@@ -1250,20 +1232,20 @@ const Cell = (props) => {
   return /* @__PURE__ */ React__default.createElement(
     "div",
     {
-      className: classNames(classPrefix$p, className),
+      className: classNames(classPrefix$q, className),
       onClick: (event) => handleClick2(event),
       style: baseStyle,
       ...rest
     },
-    children || /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, title || description ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix$p}__left` }, title ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix$p}__title` }, title) : null, description ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix$p}__description` }, description) : null) : null, extra ? /* @__PURE__ */ React__default.createElement(
+    children || /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, title || description ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix$q}__left` }, title ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix$q}__title` }, title) : null, description ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix$q}__description` }, description) : null) : null, extra ? /* @__PURE__ */ React__default.createElement(
       "div",
       {
-        className: `${classPrefix$p}__extra`,
+        className: `${classPrefix$q}__extra`,
         style: styles
       },
       extra
     ) : null),
-    (ctx2 == null ? void 0 : ctx2.divider) ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix$p}__divider` }) : null
+    (ctx2 == null ? void 0 : ctx2.divider) ? /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix$q}__divider` }) : null
   );
 };
 Cell.defaultProps = defaultProps$1s;
@@ -2232,7 +2214,7 @@ const zhCN = {
   },
   infiniteloading: {
     pullRefreshText: "松开刷新",
-    loadText: "加载中……",
+    loadText: "加载中",
     loadMoreText: "哎呀，这里是底部了啦"
   },
   pagination: {
@@ -2335,8 +2317,8 @@ const zhCN = {
   },
   pullToRefresh: {
     pullingText: "下拉刷新",
-    canReleaseText: "松开刷新",
-    refreshingText: "加载中...",
+    canReleaseText: "松手刷新",
+    refreshingText: "刷新中",
     completeText: "刷新成功"
   },
   tour: {
@@ -2348,7 +2330,7 @@ const zhCN = {
     errorCanvasTips: "当前环境不支持Canvas"
   }
 };
-const classPrefix$o = "nut-configprovider";
+const classPrefix$p = "nut-configprovider";
 const defaultConfigRef = {
   current: {
     locale: zhCN
@@ -2389,7 +2371,7 @@ const ConfigProvider = (props) => {
   return /* @__PURE__ */ React__default.createElement(ConfigContext.Provider, { value: mergedConfig }, /* @__PURE__ */ React__default.createElement(
     "div",
     {
-      className: classNames(classPrefix$o, className),
+      className: classNames(classPrefix$p, className),
       style: {
         ...cssVarStyle,
         ...style
@@ -2413,7 +2395,7 @@ const defaultProps$1r = {
   loading: true,
   lazy: false
 };
-const classPrefix$n = "nut-image";
+const classPrefix$o = "nut-image";
 const Image$1 = (props) => {
   const {
     className,
@@ -2538,7 +2520,7 @@ const Image$1 = (props) => {
   return /* @__PURE__ */ React__default.createElement(
     "div",
     {
-      className: classNames(classPrefix$n, className),
+      className: classNames(classPrefix$o, className),
       style: containerStyle,
       onClick: (e2) => {
         imageClick(e2);
@@ -4503,7 +4485,7 @@ const Overlay = (props) => {
     }
   }, [visible]);
   useLockScroll(nodeRef, !!props.lockScroll && innerVisible);
-  const classes = classNames(className, classPrefix2);
+  const classes = classNames(classPrefix2, className);
   const styles = {
     ...style
   };
@@ -4592,21 +4574,21 @@ const defaultProps$1p = {
   contentPosition: "center",
   direction: "horizontal"
 };
-const classPrefix$m = `nut-divider`;
+const classPrefix$n = `nut-divider`;
 const Divider = (props) => {
   const { children, contentPosition, style, className, direction, ...rest } = {
     ...defaultProps$1p,
     ...props
   };
   const classes = direction === "horizontal" ? classNames({
-    [`${classPrefix$m}`]: true,
-    [`${classPrefix$m}__center`]: children,
-    [`${classPrefix$m}__left`]: contentPosition === "left",
-    [`${classPrefix$m}__right`]: contentPosition === "right",
-    [`${classPrefix$m}__hairline`]: true
+    [`${classPrefix$n}`]: true,
+    [`${classPrefix$n}__center`]: children,
+    [`${classPrefix$n}__left`]: contentPosition === "left",
+    [`${classPrefix$n}__right`]: contentPosition === "right",
+    [`${classPrefix$n}__hairline`]: true
   }) : classNames({
-    [`${classPrefix$m}`]: true,
-    [`${classPrefix$m}__vertical`]: direction === "vertical"
+    [`${classPrefix$n}`]: true,
+    [`${classPrefix$n}__vertical`]: direction === "vertical"
   });
   return /* @__PURE__ */ React__default.createElement("div", { className: `${classes} ${className || ""}`, style, ...rest }, children);
 };
@@ -4728,9 +4710,13 @@ const Grid = (props) => {
   const childrenDom = React__default.Children.toArray(children);
   const classPrefix2 = "nut-grid";
   const rootClass = () => {
-    return classNames(className, classPrefix2, {
-      [`${classPrefix2}__border`]: !gap
-    });
+    return classNames(
+      classPrefix2,
+      {
+        [`${classPrefix2}__border`]: !gap
+      },
+      className
+    );
   };
   const rootStyle = () => {
     let styleSelf = {};
@@ -4764,7 +4750,7 @@ const Layout = (props) => {
 };
 Layout.defaultProps = defaultProps$1m;
 Layout.displayName = "NutLayout";
-const classPrefix$l = "nut-row";
+const classPrefix$m = "nut-row";
 const defaultProps$1l = {
   ...ComponentDefaults,
   type: "",
@@ -4799,7 +4785,7 @@ const Row = (props) => {
     ${getClass("justify", justify)}
     ${getClass("align", align)}
     ${getClass("flex", wrap)}
-    ${classPrefix$l}
+    ${classPrefix$m}
    `;
   };
   const parentRow = {
@@ -4819,7 +4805,7 @@ const Row = (props) => {
 };
 Row.defaultProps = defaultProps$1l;
 Row.displayName = "NutRow";
-const prefixCls = "nut-space";
+const prefixCls$1 = "nut-space";
 const defaultProps$1k = {
   direction: "horizontal"
 };
@@ -4829,15 +4815,15 @@ const Space = (props) => {
     ...props
   };
   const cls = classNames(
-    className,
-    prefixCls,
-    wrap && `${prefixCls}-wrap`,
-    direction && `${prefixCls}-${direction}`,
-    align && `${prefixCls}-align-${align}`,
-    justify && `${prefixCls}-justify-${justify}`
+    prefixCls$1,
+    wrap && `${prefixCls$1}-wrap`,
+    direction && `${prefixCls$1}-${direction}`,
+    align && `${prefixCls$1}-align-${align}`,
+    justify && `${prefixCls$1}-justify-${justify}`,
+    className
   );
   return /* @__PURE__ */ React__default.createElement("div", { className: cls, style }, React__default.Children.map(children, (child) => {
-    return child !== null && child !== void 0 && /* @__PURE__ */ React__default.createElement("div", { className: `${prefixCls}-item` }, child);
+    return child !== null && child !== void 0 && /* @__PURE__ */ React__default.createElement("div", { className: `${prefixCls$1}-item` }, child);
   }));
 };
 Space.defaultProps = defaultProps$1k;
@@ -4900,7 +4886,7 @@ const defaultProps$1j = {
   threshold: 0,
   zIndex: 900
 };
-const classPrefix$k = "nut-sticky";
+const classPrefix$l = "nut-sticky";
 const Sticky = (props) => {
   const {
     position,
@@ -5022,7 +5008,7 @@ const Sticky = (props) => {
     {
       ref: rootRef,
       style: { ...style, ...rootStyle },
-      className: classNames(classPrefix$k, className),
+      className: classNames(classPrefix$l, className),
       ...rest
     },
     /* @__PURE__ */ React__default.createElement("div", { className: "nut-sticky--box", ref: stickyRef, style: stickyStyle }, children)
@@ -5030,6 +5016,18 @@ const Sticky = (props) => {
 };
 Sticky.defaultProps = defaultProps$1j;
 Sticky.displayName = "NutSticky";
+const classPrefix$k = "nut-safe-area";
+const SafeArea = (props) => {
+  return /* @__PURE__ */ React__default.createElement(
+    "div",
+    {
+      className: classNames(
+        classPrefix$k,
+        `${classPrefix$k}-position-${props.position}`
+      )
+    }
+  );
+};
 const defaultProps$1i = {
   ...ComponentDefaults,
   target: "",
@@ -5135,9 +5133,13 @@ const BackTop = (props) => {
   return /* @__PURE__ */ React__default.createElement(
     "div",
     {
-      className: classNames(classPrefix2, className, {
-        show: backTop
-      }),
+      className: classNames(
+        classPrefix2,
+        {
+          show: backTop
+        },
+        className
+      ),
       style: styles,
       onClick: (e2) => {
         goTop(e2);
@@ -10501,12 +10503,12 @@ const FixedNav = (props) => {
   };
   const classPrefix2 = "nut-fixednav";
   const classes = classNames(
+    classPrefix2,
     {
       active: visible
     },
     type4,
-    className,
-    classPrefix2
+    className
   );
   const handleClick2 = (item, event) => {
     onSelect(item, event);
@@ -10748,7 +10750,7 @@ const Popup = (props) => {
   };
   const renderIcon = () => {
     if (closeable) {
-      return /* @__PURE__ */ React__default.createElement("div", { className: closeClasses, onClick: onHandleClickCloseIcon }, React__default.isValidElement(closeIcon) ? closeIcon : /* @__PURE__ */ React__default.createElement(t$a, { width: 12, height: 12 }));
+      return /* @__PURE__ */ React__default.createElement("div", { className: closeClasses, onClick: onHandleClickCloseIcon }, React__default.isValidElement(closeIcon) ? closeIcon : /* @__PURE__ */ React__default.createElement(t$9, { width: 12, height: 12 }));
     }
     return null;
   };
@@ -10849,7 +10851,7 @@ const SideNavBar = (props) => {
       position,
       onClose
     },
-    /* @__PURE__ */ React__default.createElement("div", { className: classNames(className, classPrefix2), ...rest }, /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__content` }, /* @__PURE__ */ React__default.createElement(
+    /* @__PURE__ */ React__default.createElement("div", { className: classNames(classPrefix2, className), ...rest }, /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__content` }, /* @__PURE__ */ React__default.createElement(
       "div",
       {
         className: `${classPrefix2}__list sidenavbar-show`,
@@ -11045,9 +11047,13 @@ const TabbarItem = (props) => {
     ...props
   };
   const classPrefix2 = "nut-tabbar-item";
-  const tabbarItemClass = classNames(className, classPrefix2, {
-    [`${classPrefix2}-active`]: active
-  });
+  const tabbarItemClass = classNames(
+    classPrefix2,
+    {
+      [`${classPrefix2}-active`]: active
+    },
+    className
+  );
   const boxPrefix = `${classPrefix2}__icon-box`;
   const titleClass = classNames(boxPrefix, `${boxPrefix}-nav`, {
     [`${boxPrefix}-large`]: !icon
@@ -11110,9 +11116,13 @@ const Tabbar = (props) => {
   return /* @__PURE__ */ React__default.createElement(
     "div",
     {
-      className: classNames(classPrefix2, className, {
-        [`${classPrefix2}__fixed`]: fixed
-      }),
+      className: classNames(
+        classPrefix2,
+        {
+          [`${classPrefix2}__fixed`]: fixed
+        },
+        className
+      ),
       style
     },
     /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__wrap` }, React__default.Children.map(children, (child, idx) => {
@@ -11147,10 +11157,10 @@ const TabPane = (props) => {
   };
   const classPrefix2 = "nut-tabpane";
   const classes = classNames(
+    classPrefix2,
     {
       active: !disabled && props.active
     },
-    classPrefix2,
     autoHeightClassName,
     className
   );
@@ -11763,7 +11773,7 @@ const InternalCascader = (props, ref) => {
           return activeIcon;
         }
         return /* @__PURE__ */ React__default.createElement(
-          r$5,
+          r$4,
           {
             className: `${checked ? `${classPrefix2}__icon-check` : ""}`
           }
@@ -12853,8 +12863,8 @@ const CalendarItem = React__default.forwardRef((props, ref) => {
       [`${classPrefix2}-title`]: !popup,
       [`${classPrefix2}-nofooter`]: !!autoBackfill
     },
-    className,
-    classPrefix2
+    classPrefix2,
+    className
   );
   const headerClasses = classNames({
     [`${classPrefix2}-header`]: true,
@@ -13046,6 +13056,7 @@ const Calendar = React__default.forwardRef((props, ref) => {
   return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, popup ? /* @__PURE__ */ React__default.createElement(
     Popup,
     {
+      className: "nut-calendar-popup",
       visible,
       position: "bottom",
       round: true,
@@ -13053,7 +13064,7 @@ const Calendar = React__default.forwardRef((props, ref) => {
       destroyOnClose: true,
       onOverlayClick: closePopup,
       onCloseIconClick: closePopup,
-      style: { height: "85vh" }
+      style: { height: "83%" }
     },
     renderItem()
   ) : renderItem());
@@ -13169,10 +13180,12 @@ const defaultProps$10 = {
   type: "single",
   firstDayOfWeek: 0
 };
+const prefixCls = "nut-calendarcard";
 const CalendarCard = React__default.forwardRef((props, ref) => {
   const { locale } = useConfig();
   const {
     style,
+    className,
     type: type4,
     value,
     defaultValue,
@@ -13424,7 +13437,7 @@ const CalendarCard = React__default.forwardRef((props, ref) => {
   };
   const monthTitle = locale.calendaritem.monthTitle;
   const renderHeader = () => {
-    return /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-header" }, /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-header-left" }, /* @__PURE__ */ React__default.createElement("div", { className: "double-left", onClick: () => jump(-12) }, /* @__PURE__ */ React__default.createElement(DoubleLeft, null)), /* @__PURE__ */ React__default.createElement("div", { className: "left", onClick: () => jump(-1) }, /* @__PURE__ */ React__default.createElement(Left, null))), /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-header-title" }, monthTitle(month.year, month.month)), /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-header-right" }, /* @__PURE__ */ React__default.createElement("div", { className: "right", onClick: () => jump(1) }, /* @__PURE__ */ React__default.createElement(Right, null)), /* @__PURE__ */ React__default.createElement("div", { className: "double-right", onClick: () => jump(12) }, /* @__PURE__ */ React__default.createElement(DoubleRight, null))));
+    return /* @__PURE__ */ React__default.createElement("div", { className: `${prefixCls}-header` }, /* @__PURE__ */ React__default.createElement("div", { className: `${prefixCls}-header-left` }, /* @__PURE__ */ React__default.createElement("div", { className: "double-left", onClick: () => jump(-12) }, /* @__PURE__ */ React__default.createElement(DoubleLeft, null)), /* @__PURE__ */ React__default.createElement("div", { className: "left", onClick: () => jump(-1) }, /* @__PURE__ */ React__default.createElement(Left, null))), /* @__PURE__ */ React__default.createElement("div", { className: `${prefixCls}-header-title` }, monthTitle(month.year, month.month)), /* @__PURE__ */ React__default.createElement("div", { className: `${prefixCls}-header-right` }, /* @__PURE__ */ React__default.createElement("div", { className: "right", onClick: () => jump(1) }, /* @__PURE__ */ React__default.createElement(Right, null)), /* @__PURE__ */ React__default.createElement("div", { className: "double-right", onClick: () => jump(12) }, /* @__PURE__ */ React__default.createElement(DoubleRight, null))));
   };
   const [weekHeader] = useState(() => {
     const weekdays = locale.calendaritem.weekdays.map((day, index) => {
@@ -13439,34 +13452,34 @@ const CalendarCard = React__default.forwardRef((props, ref) => {
     ];
   });
   const renderContent = () => {
-    return /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-content" }, /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-days" }, weekHeader.map((day) => {
+    return /* @__PURE__ */ React__default.createElement("div", { className: `${prefixCls}-content` }, /* @__PURE__ */ React__default.createElement("div", { className: `${prefixCls}-days` }, weekHeader.map((day) => {
       return /* @__PURE__ */ React__default.createElement(
         "div",
         {
-          className: classNames("nut-calendarcard-day", "header", {
+          className: classNames(`${prefixCls}-day`, "header", {
             weekend: day.key === 0 || day.key === 6
           }),
           key: day.key
         },
         day.name
       );
-    })), /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-days" }, days.map((day) => /* @__PURE__ */ React__default.createElement(
+    })), /* @__PURE__ */ React__default.createElement("div", { className: `${prefixCls}-days` }, days.map((day) => /* @__PURE__ */ React__default.createElement(
       "div",
       {
         className: classNames(
-          "nut-calendarcard-day",
+          `${prefixCls}-day`,
           day.type,
           getClasses(day)
         ),
         key: `${day.year}-${day.month}-${day.date}`,
         onClick: () => handleDayClick(day)
       },
-      /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-day-top" }, renderDayTop ? renderDayTop(day) : ""),
-      /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-day-inner" }, renderDay ? renderDay(day) : day.date),
-      /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard-day-bottom" }, renderDayBottom ? renderDayBottom(day) : "")
+      /* @__PURE__ */ React__default.createElement("div", { className: `${prefixCls}-day-top` }, renderDayTop ? renderDayTop(day) : ""),
+      /* @__PURE__ */ React__default.createElement("div", { className: `${prefixCls}-day-inner` }, renderDay ? renderDay(day) : day.date),
+      /* @__PURE__ */ React__default.createElement("div", { className: `${prefixCls}-day-bottom` }, renderDayBottom ? renderDayBottom(day) : "")
     ))));
   };
-  return days.length > 0 ? /* @__PURE__ */ React__default.createElement("div", { className: "nut-calendarcard", style }, renderHeader(), renderContent()) : null;
+  return days.length > 0 ? /* @__PURE__ */ React__default.createElement("div", { className: classNames(prefixCls, className), style }, renderHeader(), renderContent()) : null;
 });
 CalendarCard.defaultProps = defaultProps$10;
 CalendarCard.displayName = "NutCalendarCard";
@@ -13562,9 +13575,13 @@ const CheckboxGroup = React__default.forwardRef(
       /* @__PURE__ */ React__default.createElement(
         "div",
         {
-          className: classNames(classPrefix$i, className, {
-            [`nut-checkboxgroup--${props.direction}`]: props.direction
-          }),
+          className: classNames(
+            classPrefix$i,
+            {
+              [`nut-checkboxgroup--${props.direction}`]: props.direction
+            },
+            className
+          ),
           ...rest
         },
         (options2 == null ? void 0 : options2.length) ? renderOptions() : children
@@ -13637,7 +13654,7 @@ const Checkbox = (props) => {
   }
   const renderIcon = () => {
     if (!innerChecked) {
-      return React__default.isValidElement(icon) ? icon : /* @__PURE__ */ React__default.createElement(t$b, { className: color() });
+      return React__default.isValidElement(icon) ? icon : /* @__PURE__ */ React__default.createElement(t$a, { className: color() });
     }
     if (innerIndeterminate) {
       return React__default.isValidElement(indeterminateIcon) ? indeterminateIcon : /* @__PURE__ */ React__default.createElement(l$3, { className: color() });
@@ -13680,9 +13697,13 @@ const Checkbox = (props) => {
   return /* @__PURE__ */ React__default.createElement(
     "div",
     {
-      className: classNames(classPrefix$h, className, {
-        [`${classPrefix$h}--reverse`]: labelPosition === "left"
-      }),
+      className: classNames(
+        classPrefix$h,
+        {
+          [`${classPrefix$h}--reverse`]: labelPosition === "left"
+        },
+        className
+      ),
       ...rest,
       onClick: handleClick2
     },
@@ -14187,7 +14208,8 @@ const InternalPicker = (props, ref) => {
           keyIndex: index
         }
       );
-    })))
+    }))),
+    /* @__PURE__ */ React__default.createElement(SafeArea, { position: "bottom" })
   ));
 };
 const Picker = React__default.forwardRef(InternalPicker);
@@ -15800,8 +15822,8 @@ const Form = React__default.forwardRef(
       {
         className: classNames(
           classPrefix2,
-          className,
-          PositionInfo[labelPosition]
+          PositionInfo[labelPosition],
+          className
         ),
         style,
         onSubmit: (e2) => {
@@ -16620,10 +16642,13 @@ const MenuItem = forwardRef((props, ref) => {
     /* @__PURE__ */ React__default.createElement(
       "div",
       {
-        className: classNames(className, {
-          "nut-menu-item__wrap": direction === "down",
-          "nut-menu-item__wrap-up": direction !== "down"
-        }),
+        className: classNames(
+          {
+            "nut-menu-item__wrap": direction === "down",
+            "nut-menu-item__wrap-up": direction !== "down"
+          },
+          className
+        ),
         style: {
           ...style,
           ...isShow()
@@ -16784,10 +16809,14 @@ const Menu = (props) => {
         return /* @__PURE__ */ React__default.createElement(
           "div",
           {
-            className: classNames("nut-menu__item ", className, {
-              active: showMenuItem[index],
-              disabled
-            }),
+            className: classNames(
+              "nut-menu__item ",
+              {
+                active: showMenuItem[index],
+                disabled
+              },
+              className
+            ),
             style: { color: showMenuItem[index] ? activeColor : "" },
             key: index,
             onClick: (e2) => {
@@ -16806,7 +16835,7 @@ const Menu = (props) => {
               })
             },
             /* @__PURE__ */ React__default.createElement("div", { className: "nut-menu__title-text" }, finallyTitle()),
-            icon || (direction === "up" ? /* @__PURE__ */ React__default.createElement(t$c, { className: "nut-menu__title-icon" }) : /* @__PURE__ */ React__default.createElement(e$3, { className: "nut-menu__title-icon" }))
+            icon || (direction === "up" ? /* @__PURE__ */ React__default.createElement(t$b, { className: "nut-menu__title-icon" }) : /* @__PURE__ */ React__default.createElement(e$3, { className: "nut-menu__title-icon" }))
           )
         );
       }
@@ -17053,9 +17082,13 @@ const RadioGroup = React__default.forwardRef(
       /* @__PURE__ */ React__default.createElement(
         "div",
         {
-          className: classNames(classPrefix$f, className, {
-            [`${classPrefix$f}--${props.direction}`]: props.direction
-          }),
+          className: classNames(
+            classPrefix$f,
+            {
+              [`${classPrefix$f}--${props.direction}`]: props.direction
+            },
+            className
+          ),
           ...rest
         },
         (options2 == null ? void 0 : options2.length) ? renderOptionsChildren() : children
@@ -17159,16 +17192,12 @@ const Radio = (props) => {
     return React__default.isValidElement(icon2) ? React__default.cloneElement(icon2, {
       ...icon2.props,
       className: classNames(color())
-    }) : /* @__PURE__ */ React__default.createElement(t$b, { className: classNames(color()) });
+    }) : /* @__PURE__ */ React__default.createElement(t$a, { className: classNames(color()) });
   };
-  const reverse = labelPosition === "left";
   const renderRadioItem = () => {
     if (shape === "button") {
       return renderButton();
     }
-    if (reverse) {
-      return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, renderLabel(), renderIcon());
-    }
     return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, renderIcon(), renderLabel());
   };
   const handleClick2 = (e2) => {
@@ -17179,7 +17208,13 @@ const Radio = (props) => {
   return /* @__PURE__ */ React__default.createElement(
     "div",
     {
-      className: `${classPrefix2} ${className} ${reverse ? `${classPrefix2}--reverse` : ""}`,
+      className: classNames(
+        classPrefix2,
+        {
+          [`${classPrefix2}--reverse`]: labelPosition === "left"
+        },
+        className
+      ),
       style,
       onClick: handleClick2,
       ...rest
@@ -17252,9 +17287,13 @@ const Range = (props) => {
     [`${classPrefix2}-disabled`]: disabled,
     [`${classPrefix2}-vertical`]: vertical
   });
-  const containerClasses = classNames(`${classPrefix2}-container`, className, {
-    [`${classPrefix2}-container-vertical`]: vertical
-  });
+  const containerClasses = classNames(
+    `${classPrefix2}-container`,
+    {
+      [`${classPrefix2}-container-vertical`]: vertical
+    },
+    className
+  );
   const markClassName = useCallback(
     (mark) => {
       const classPrefix22 = "nut-range-mark";
@@ -17553,10 +17592,14 @@ const Rate = (props) => {
   return /* @__PURE__ */ React__default.createElement(
     "div",
     {
-      className: classNames(classPrefix2, className, {
-        disabled,
-        readonly: readOnly
-      }),
+      className: classNames(
+        classPrefix2,
+        {
+          disabled,
+          readonly: readOnly
+        },
+        className
+      ),
       style
     },
     countArray.map((n) => {
@@ -17711,7 +17754,7 @@ const SearchBar = (props) => {
         className: `${classPrefix2}__clear ${rightIn ? "pos-right" : ""}`,
         onClick: (e2) => clearaVal(e2)
       },
-      /* @__PURE__ */ React__default.createElement(r$4, { color: "#555", width: 12, height: 12 })
+      /* @__PURE__ */ React__default.createElement(t$7, { color: "#555", width: 12, height: 12 })
     );
   };
   const clearaVal = (event) => {
@@ -17830,7 +17873,7 @@ const ShortPassword = (props) => {
       onCloseIconClick: onClose,
       ...rest
     },
-    /* @__PURE__ */ React__default.createElement("div", { className: classNames(className, classPrefix2), style }, /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__title` }, title || locale.shortpassword.title), /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__description` }, description || locale.shortpassword.description), /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__input`, onClick: onFocus }, /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__input-site` }), /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__input-fake` }, [...new Array(comLen).keys()].map((item, index) => {
+    /* @__PURE__ */ React__default.createElement("div", { className: classNames(classPrefix2, className), style }, /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__title` }, title || locale.shortpassword.title), /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__description` }, description || locale.shortpassword.description), /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__input`, onClick: onFocus }, /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__input-site` }), /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__input-fake` }, [...new Array(comLen).keys()].map((item, index) => {
       return /* @__PURE__ */ React__default.createElement("div", { className: `${classPrefix2}__input-fake__li`, key: index }, inputValue.length > index && /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, plain ? inputValue[index] : /* @__PURE__ */ React__default.createElement(
         "div",
         {
@@ -18105,9 +18148,13 @@ const TextArea = (props) => {
   return /* @__PURE__ */ React__default.createElement(
     "div",
     {
-      className: classNames(classPrefix2, className, {
-        [`${classPrefix2}__disabled`]: disabled
-      })
+      className: classNames(
+        classPrefix2,
+        {
+          [`${classPrefix2}__disabled`]: disabled
+        },
+        className
+      )
     },
     /* @__PURE__ */ React__default.createElement(
       "textarea",
@@ -18362,7 +18409,7 @@ const Preview = ({
 }) => {
   const renderIcon = (item) => {
     if (item.status === ERROR) {
-      return item.failIcon || /* @__PURE__ */ React__default.createElement(t$8, { color: "#fff" });
+      return item.failIcon || /* @__PURE__ */ React__default.createElement(t$7, { color: "#fff" });
     }
     return item.loadingIcon || /* @__PURE__ */ React__default.createElement(o$2, { className: "nut-icon-loading", color: "#fff" });
   };
@@ -18375,7 +18422,7 @@ const Preview = ({
         key: item.uid
       },
       previewType === "picture" && deletable && /* @__PURE__ */ React__default.createElement(
-        t$8,
+        t$7,
         {
           color: "rgba(0,0,0,0.6)",
           className: "close",
@@ -18417,7 +18464,7 @@ const Preview = ({
         /* @__PURE__ */ React__default.createElement(t$5, null),
         /* @__PURE__ */ React__default.createElement("span", null, " ", item.name)
       ), deletable && /* @__PURE__ */ React__default.createElement(
-        t$9,
+        t$8,
         {
           color: "#808080",
           className: "nut-uploader__preview-img__file__del",
@@ -19358,7 +19405,7 @@ const InfiniteLoading = (props) => {
   const refreshMaxH = useRef(0);
   const y = useRef(0);
   const distance = useRef(0);
-  const classes = classNames(className, classPrefix$d);
+  const classes = classNames(classPrefix$d, className);
   useEffect(() => {
     if (target && document.getElementById(target)) {
       scrollEl.current = document.getElementById(target);
@@ -19369,7 +19416,7 @@ const InfiniteLoading = (props) => {
     return () => {
       scrollEl.current.removeEventListener("scroll", handleScroll, capture);
     };
-  }, [hasMore, isInfiniting]);
+  }, [hasMore, isInfiniting, onLoadMore]);
   useEffect(() => {
     const element = scroller.current;
     element.addEventListener("touchmove", touchMove, { passive: false });
@@ -19508,8 +19555,8 @@ const Loading = (props) => {
     {
       className: classNames(
         classPrefix2,
-        className,
-        direction === "vertical" ? `${classPrefix2}-vertical` : ""
+        direction === "vertical" ? `${classPrefix2}-vertical` : "",
+        className
       ),
       style
     },
@@ -19863,7 +19910,7 @@ const NoticeBar = (props) => {
     },
     children,
     content
-  )), closeable || rightIcon ? /* @__PURE__ */ React__default.createElement("div", { className: "right-icon", onClick: onClickIcon }, rightIcon || /* @__PURE__ */ React__default.createElement(t$a, { width: 12, height: 12 })) : null) : null, showNoticeBar && scrollList.current.length > 0 && isVertical ? /* @__PURE__ */ React__default.createElement(
+  )), closeable || rightIcon ? /* @__PURE__ */ React__default.createElement("div", { className: "right-icon", onClick: onClickIcon }, rightIcon || /* @__PURE__ */ React__default.createElement(t$9, { width: 12, height: 12 })) : null) : null, showNoticeBar && scrollList.current.length > 0 && isVertical ? /* @__PURE__ */ React__default.createElement(
     "div",
     {
       className: "nut-noticebar-vertical",
@@ -19910,7 +19957,7 @@ const NoticeBar = (props) => {
           handleClickIcon(e2);
         }
       },
-      rightIcon || (closeable ? /* @__PURE__ */ React__default.createElement(t$a, { width: 12, height: 12 }) : null)
+      rightIcon || (closeable ? /* @__PURE__ */ React__default.createElement(t$9, { width: 12, height: 12 }) : null)
     )
   ) : null);
 };
@@ -20589,7 +20636,7 @@ const Avatar = (props) => {
     width: sizeValue.indexOf(size) > -1 ? "" : `${size}px`,
     height: sizeValue.indexOf(size) > -1 ? "" : `${size}px`,
     backgroundColor: `${background}`,
-    color: `${color}`,
+    color,
     marginLeft: avatarIndex !== 1 && ((_c = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _c.gap) ? `${(_d = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _d.gap}px` : "",
     zIndex: ((_e = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _e.level) === "right" ? `${Math.abs(maxSum - avatarIndex)}` : "",
     ...style
@@ -20683,7 +20730,7 @@ const Skeleton = (props) => {
     ...props
   };
   const classPrefix2 = "nut-skeleton";
-  const classes = classNames(className, classPrefix2);
+  const classes = classNames(classPrefix2, className);
   const avatarClass = classNames({
     avatar: true,
     [`avatar--${avatarShape}`]: avatarShape
@@ -20960,10 +21007,10 @@ class Notification extends React.PureComponent {
           iconNode = /* @__PURE__ */ React.createElement(o$2, { className: "nut-icon-loading" });
           break;
         case "fail":
-          iconNode = /* @__PURE__ */ React.createElement(t$8, null);
+          iconNode = /* @__PURE__ */ React.createElement(t$7, null);
           break;
         case "warn":
-          iconNode = /* @__PURE__ */ React.createElement(t$7, null);
+          iconNode = /* @__PURE__ */ React.createElement(t$2, null);
           break;
       }
       return /* @__PURE__ */ React.createElement("p", { className: `${classPrefix$8}__icon-wrapper` }, iconNode);
@@ -21046,7 +21093,7 @@ Notification.newInstance = (properties, callback) => {
   render(/* @__PURE__ */ React.createElement(Notification, { ...properties, ref }), element);
 };
 let messageInstance = null;
-const options = {
+let options = {
   ...ComponentDefaults,
   id: "",
   duration: 2,
@@ -21102,18 +21149,7 @@ function show(option) {
   });
 }
 function config(config2) {
-  if (config2.duration !== void 0) {
-    options.duration = config2.duration;
-  }
-  if (config2.position !== void 0) {
-    options.position = config2.position;
-  }
-  if (config2.closeOnOverlayClick !== void 0) {
-    options.closeOnOverlayClick = config2.closeOnOverlayClick;
-  }
-  if (config2.lockScroll !== void 0) {
-    options.lockScroll = config2.lockScroll;
-  }
+  options = { ...options, ...config2 };
 }
 const Toast = {
   show,
@@ -21536,7 +21572,7 @@ const CircleProgress = (props) => {
     ...defaultProps$o,
     ...props
   };
-  const classes = classNames(className, classPrefix$6);
+  const classes = classNames(classPrefix$6, className);
   const refRandomId = Math.random().toString(36).slice(-8);
   const styles = {
     height: `${Number(radius) * 2}px`,
@@ -22249,7 +22285,7 @@ const Video = (props) => {
     ...props
   };
   const rootRef = useRef(null);
-  const classes = classNames(className, classPrefix$4);
+  const classes = classNames(classPrefix$4, className);
   useEffect(() => {
     init();
   }, []);
@@ -22804,6 +22840,8 @@ const defaultProps$f = {
 };
 const ImagePreview = (props) => {
   const {
+    className,
+    style,
     images,
     videos,
     visible,
@@ -22961,7 +22999,8 @@ const ImagePreview = (props) => {
     /* @__PURE__ */ React__default.createElement(
       "div",
       {
-        className: classPrefix2,
+        className: classNames(classPrefix2, className),
+        style,
         ref,
         onClick: closeOnImg,
         onTouchStart
@@ -23182,7 +23221,7 @@ const Price = (props) => {
   return /* @__PURE__ */ React__default.createElement(
     "div",
     {
-      className: `${classPrefix2} ${className} ${line ? `${classPrefix2}--line` : ""}`,
+      className: `${classPrefix2} ${line ? `${classPrefix2}--line` : ""} ${className}`,
       style,
       ...rest
     },
@@ -23240,11 +23279,11 @@ const Step = (props) => {
   };
   const classPrefix2 = `nut-step`;
   const classes = classNames(
+    classPrefix2,
     {
       [`${classPrefix2}-${getCurrentStatus()}`]: true
     },
-    className,
-    classPrefix2
+    className
   );
   const renderIconClass = () => {
     if (icon) {
@@ -23281,12 +23320,12 @@ const Steps = (props) => {
   };
   const classPrefix2 = `nut-steps`;
   const classes = classNames(
+    classPrefix2,
     {
       [`${classPrefix2}-${direction}`]: true,
       [`${classPrefix2}-dot`]: !!props.dot
     },
-    className,
-    classPrefix2
+    className
   );
   return /* @__PURE__ */ React__default.createElement(DataContext.Provider, { value: parentSteps }, React__default.createElement(
     "div",
@@ -23493,7 +23532,7 @@ const Tag = (props) => {
       },
       closeIcon
     ) : /* @__PURE__ */ React__default.createElement(
-      t$a,
+      t$9,
       {
         width: 12,
         height: 12,
@@ -23569,7 +23608,7 @@ const Tour = (props) => {
     width: 0,
     height: 0
   });
-  const classes = classNames(className, classPrefix$2);
+  const classes = classNames(classPrefix$2, className);
   useEffect(() => {
     if (visible) {
       getRootPosition();
@@ -23646,7 +23685,7 @@ const Tour = (props) => {
         arrowOffset: item.arrowOffset || 0
       },
       /* @__PURE__ */ React__default.createElement(React__default.Fragment, null),
-      /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children || /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, type4 === "step" && /* @__PURE__ */ React__default.createElement("div", { className: "nut-tour-content" }, title && /* @__PURE__ */ React__default.createElement("div", { className: "nut-tour-content-top" }, /* @__PURE__ */ React__default.createElement("div", { onClick: (e2) => maskClose(e2) }, /* @__PURE__ */ React__default.createElement(t$a, { className: "nut-tour-content-top-close" }))), /* @__PURE__ */ React__default.createElement("div", { className: "nut-tour-content-inner" }, item.content), /* @__PURE__ */ React__default.createElement("div", { className: "nut-tour-content-bottom" }, /* @__PURE__ */ React__default.createElement("div", { className: "nut-tour-content-bottom-init" }, active + 1, "/", list.length), /* @__PURE__ */ React__default.createElement("div", { className: "nut-tour-content-bottom-operate" }, active !== 0 && showPrev && /* @__PURE__ */ React__default.createElement(
+      /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, children || /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, type4 === "step" && /* @__PURE__ */ React__default.createElement("div", { className: "nut-tour-content" }, title && /* @__PURE__ */ React__default.createElement("div", { className: "nut-tour-content-top" }, /* @__PURE__ */ React__default.createElement("div", { onClick: (e2) => maskClose(e2) }, /* @__PURE__ */ React__default.createElement(t$9, { className: "nut-tour-content-top-close" }))), /* @__PURE__ */ React__default.createElement("div", { className: "nut-tour-content-inner" }, item.content), /* @__PURE__ */ React__default.createElement("div", { className: "nut-tour-content-bottom" }, /* @__PURE__ */ React__default.createElement("div", { className: "nut-tour-content-bottom-init" }, active + 1, "/", list.length), /* @__PURE__ */ React__default.createElement("div", { className: "nut-tour-content-bottom-operate" }, active !== 0 && showPrev && /* @__PURE__ */ React__default.createElement(
         "div",
         {
           className: "nut-tour-content-bottom-operate-btn",
@@ -23923,7 +23962,7 @@ const VirtualList = (props) => {
   return /* @__PURE__ */ React__default.createElement(
     "div",
     {
-      className: className ? `${className} nut-virtualList-box` : "nut-virtualList-box",
+      className: classNames("nut-virtualList-box", className),
       ...rest,
       style: {
         [sizeKey]: containerHeight ? `${offSetSize}px` : ""
@@ -23933,7 +23972,10 @@ const VirtualList = (props) => {
       "div",
       {
         ref: scrollRef,
-        className: horizontal ? "nut-horizontal-box" : "nut-vertical-box",
+        className: classNames({
+          "nut-horizontal-box": horizontal,
+          "nut-vertical-box": !horizontal
+        }),
         style: {
           position: "relative",
           [sizeKey]: `${listTotalSize}px`
@@ -23942,7 +23984,10 @@ const VirtualList = (props) => {
       /* @__PURE__ */ React__default.createElement(
         "ul",
         {
-          className: horizontal ? "nut-virtuallist-items nut-horizontal-items" : "nut-virtuallist-items nut-vertical-items",
+          className: classNames("nut-virtuallist-items", {
+            "nut-horizontal-items": horizontal,
+            "nut-vertical-items": !horizontal
+          }),
           ref: itemsRef,
           style: {
             transform: horizontal ? `translate3d(${options2.startOffset}px,0,0)` : `translate3d(0,${options2.startOffset}px,0)`
@@ -24498,8 +24543,8 @@ const defaultProps = {
   space: 10,
   toolbar: [
     /* @__PURE__ */ React__default.createElement(Button, { type: "danger", key: "cancel" }, "取消"),
-    /* @__PURE__ */ React__default.createElement(Button, { type: "info", key: "reset" }, "重置"),
-    /* @__PURE__ */ React__default.createElement(Button, { type: "warning", key: "rotate" }, "旋转"),
+    /* @__PURE__ */ React__default.createElement(Button, { key: "reset" }, "重置"),
+    /* @__PURE__ */ React__default.createElement(Button, { key: "rotate" }, "旋转"),
     /* @__PURE__ */ React__default.createElement(Button, { type: "success", key: "confirm" }, "确认")
   ],
   toolbarPosition: "bottom",
@@ -24918,6 +24963,7 @@ export {
   Range,
   Rate,
   Row,
+  SafeArea,
   SearchBar,
   ShortPassword,
   SideNavBar,