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

package/dist/nutui.react.umd.js

@@ -9,7 +9,7 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 /*!
-* @nutui/nutui-react v2.0.0-alpha.3 Fri Apr 28 2023 15:57:49 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v2.0.0-alpha.5 Wed May 10 2023 14:17:23 GMT+0800 (China Standard Time)
 * (c) 2023 @jdf2e.
 * Released under the MIT License.
 */
@@ -1032,7 +1032,7 @@ var __publicField = (obj, key, value) => {
     set exports(h) {
       D = h;
     }
-  }, k$5 = {};
+  }, k$6 = {};
   /**
    * @license React
    * react-jsx-runtime.production.min.js
@@ -1045,7 +1045,7 @@ var __publicField = (obj, key, value) => {
   var Re;
   function ur() {
     if (Re)
-      return k$5;
+      return k$6;
     Re = 1;
     var h = React, S = Symbol.for("react.element"), M = Symbol.for("react.fragment"), R = Object.prototype.hasOwnProperty, A = h.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner, I = { key: true, ref: true, __self: true, __source: true };
     function w(m, l2, T) {
@@ -1058,7 +1058,7 @@ var __publicField = (obj, key, value) => {
           g[d] === void 0 && (g[d] = l2[d]);
       return { $$typeof: S, type: m, key: _, ref: $, props: g, _owner: A.current };
     }
-    return k$5.Fragment = M, k$5.jsx = w, k$5.jsxs = w, k$5;
+    return k$6.Fragment = M, k$6.jsx = w, k$6.jsxs = w, k$6;
   }
   var F = {};
   /**
@@ -1661,7 +1661,7 @@ Check the top-level render call using <` + t + ">.");
     process.env.NODE_ENV === "production" ? h.exports = ur() : h.exports = sr();
   })(ir);
   const lr = D.Fragment, cr = D.jsx, vr = D.jsxs;
-  const a$u = {
+  const a$v = {
     className: "",
     style: void 0,
     name: "ArrowDown2",
@@ -1670,7 +1670,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, y$8 = (h) => {
-    const { className: r, style: d, name: e, color: p, width: m, height: w, onClick: n } = { ...a$u, ...h }, f = (t) => {
+    const { className: r, style: d, name: e, color: p, width: m, height: w, onClick: n } = { ...a$v, ...h }, f = (t) => {
       n && n(t);
     }, c = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", g = () => {
       const t = "nut-icon";
@@ -1707,8 +1707,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  y$8.defaultProps = a$u;
-  const a$t = {
+  y$8.defaultProps = a$v;
+  const a$u = {
     className: "",
     style: void 0,
     name: "ArrowUp2",
@@ -1717,7 +1717,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, x$g = (h) => {
-    const { className: o, style: p, name: e, color: d, width: m, height: f, onClick: n } = { ...a$t, ...h }, g = (t) => {
+    const { className: o, style: p, name: e, color: d, width: m, height: f, onClick: n } = { ...a$u, ...h }, g = (t) => {
       n && n(t);
     }, i = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", w = () => {
       const t = "nut-icon";
@@ -1754,8 +1754,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  x$g.defaultProps = a$t;
-  const a$s = {
+  x$g.defaultProps = a$u;
+  const a$t = {
     className: "",
     style: void 0,
     name: "CheckChecked",
@@ -1764,7 +1764,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, y$7 = (h) => {
-    const { className: r, style: d, name: e, color: p, width: m, height: f, onClick: o } = { ...a$s, ...h }, C = (t) => {
+    const { className: r, style: d, name: e, color: p, width: m, height: f, onClick: o } = { ...a$t, ...h }, C = (t) => {
       o && o(t);
     }, i = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", k2 = () => {
       const t = "nut-icon";
@@ -1812,8 +1812,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  y$7.defaultProps = a$s;
-  const a$r = {
+  y$7.defaultProps = a$t;
+  const a$s = {
     className: "",
     style: void 0,
     name: "CheckDisabled",
@@ -1822,7 +1822,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, x$f = (h) => {
-    const { className: i, style: d, name: e, color: m, width: p, height: f, onClick: o } = { ...a$r, ...h }, g = (t) => {
+    const { className: i, style: d, name: e, color: m, width: p, height: f, onClick: o } = { ...a$s, ...h }, g = (t) => {
       o && o(t);
     }, r = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", C = () => {
       const t = "nut-icon";
@@ -1859,8 +1859,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  x$f.defaultProps = a$r;
-  const a$q = {
+  x$f.defaultProps = a$s;
+  const a$r = {
     className: "",
     style: void 0,
     name: "CheckNormal",
@@ -1869,7 +1869,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, N = (h) => {
-    const { className: o, style: m, name: e, color: d, width: p, height: C, onClick: r } = { ...a$q, ...h }, f = (t) => {
+    const { className: o, style: m, name: e, color: d, width: p, height: C, onClick: r } = { ...a$r, ...h }, f = (t) => {
       r && r(t);
     }, n = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", g = () => {
       const t = "nut-icon";
@@ -1906,8 +1906,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  N.defaultProps = a$q;
-  const a$p = {
+  N.defaultProps = a$r;
+  const a$q = {
     className: "",
     style: void 0,
     name: "Check",
@@ -1916,7 +1916,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, x$e = (h) => {
-    const { className: o, style: d, name: e, color: p, width: m, height: f, onClick: r } = { ...a$p, ...h }, g = (t) => {
+    const { className: o, style: d, name: e, color: p, width: m, height: f, onClick: r } = { ...a$q, ...h }, g = (t) => {
       r && r(t);
     }, n = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", C = () => {
       const t = "nut-icon";
@@ -1953,8 +1953,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  x$e.defaultProps = a$p;
-  const a$o = {
+  x$e.defaultProps = a$q;
+  const a$p = {
     className: "",
     style: void 0,
     name: "Checked",
@@ -1963,7 +1963,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, x$d = (h) => {
-    const { className: o, style: d, name: e, color: m, width: p, height: C, onClick: r } = { ...a$o, ...h }, f = (t) => {
+    const { className: o, style: d, name: e, color: m, width: p, height: C, onClick: r } = { ...a$p, ...h }, f = (t) => {
       r && r(t);
     }, n = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", g = () => {
       const t = "nut-icon";
@@ -2000,8 +2000,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  x$d.defaultProps = a$o;
-  const a$n = {
+  x$d.defaultProps = a$p;
+  const a$o = {
     className: "",
     style: void 0,
     name: "Checklist",
@@ -2010,7 +2010,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, x$c = (h) => {
-    const { className: i, style: d, name: e, color: p, width: m, height: f, onClick: o } = { ...a$n, ...h }, g = (t) => {
+    const { className: i, style: d, name: e, color: p, width: m, height: f, onClick: o } = { ...a$o, ...h }, g = (t) => {
       o && o(t);
     }, r = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", k2 = () => {
       const t = "nut-icon";
@@ -2047,8 +2047,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  x$c.defaultProps = a$n;
-  const a$m = {
+  x$c.defaultProps = a$o;
+  const a$n = {
     className: "",
     style: void 0,
     name: "CircleClose",
@@ -2057,7 +2057,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, x$b = (h) => {
-    const { className: l2, style: m, name: e, color: d, width: p, height: C, onClick: o } = { ...a$m, ...h }, f = (t) => {
+    const { className: l2, style: m, name: e, color: d, width: p, height: C, onClick: o } = { ...a$n, ...h }, f = (t) => {
       o && o(t);
     }, r = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", g = () => {
       const t = "nut-icon";
@@ -2094,8 +2094,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  x$b.defaultProps = a$m;
-  const a$l = {
+  x$b.defaultProps = a$n;
+  const a$m = {
     className: "",
     style: void 0,
     name: "Close",
@@ -2104,7 +2104,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, x$a = (h) => {
-    const { className: o, style: d, name: e, color: m, width: p, height: f, onClick: r } = { ...a$l, ...h }, g = (t) => {
+    const { className: o, style: d, name: e, color: m, width: p, height: f, onClick: r } = { ...a$m, ...h }, g = (t) => {
       r && r(t);
     }, n = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", C = () => {
       const t = "nut-icon";
@@ -2141,8 +2141,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  x$a.defaultProps = a$l;
-  const a$k = {
+  x$a.defaultProps = a$m;
+  const a$l = {
     className: "",
     style: void 0,
     name: "Del",
@@ -2151,7 +2151,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, y$6 = (h) => {
-    const { className: o, style: d, name: e, color: m, width: p, height: f, onClick: r } = { ...a$k, ...h }, g = (t) => {
+    const { className: o, style: d, name: e, color: m, width: p, height: f, onClick: r } = { ...a$l, ...h }, g = (t) => {
       r && r(t);
     }, n = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", u = () => {
       const t = "nut-icon";
@@ -2188,8 +2188,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  y$6.defaultProps = a$k;
-  const a$j = {
+  y$6.defaultProps = a$l;
+  const a$k = {
     className: "",
     style: void 0,
     name: "DownArrow",
@@ -2198,7 +2198,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, x$9 = (h) => {
-    const { className: r, style: d, name: e, color: p, width: m, height: w, onClick: n } = { ...a$j, ...h }, f = (t) => {
+    const { className: r, style: d, name: e, color: p, width: m, height: w, onClick: n } = { ...a$k, ...h }, f = (t) => {
       n && n(t);
     }, c = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", g = () => {
       const t = "nut-icon";
@@ -2235,8 +2235,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  x$9.defaultProps = a$j;
-  const a$i = {
+  x$9.defaultProps = a$k;
+  const a$j = {
     className: "",
     style: void 0,
     name: "Failure",
@@ -2245,7 +2245,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, x$8 = (h) => {
-    const { className: r, style: d, name: e, color: m, width: p, height: f, onClick: l2 } = { ...a$i, ...h }, u = (t) => {
+    const { className: r, style: d, name: e, color: m, width: p, height: f, onClick: l2 } = { ...a$j, ...h }, u = (t) => {
       l2 && l2(t);
     }, i = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", g = () => {
       const t = "nut-icon";
@@ -2282,8 +2282,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  x$8.defaultProps = a$i;
-  const a$h = {
+  x$8.defaultProps = a$j;
+  const a$i = {
     className: "",
     style: void 0,
     name: "ImageError",
@@ -2291,8 +2291,8 @@ Check the top-level render call using <` + t + ">.");
     height: "",
     onClick: () => {
     }
-  }, k$4 = (h) => {
-    const { className: s, style: d, name: e, color: m, width: p, height: f, onClick: o } = { ...a$h, ...h }, g = (t) => {
+  }, k$5 = (h) => {
+    const { className: s, style: d, name: e, color: m, width: p, height: f, onClick: o } = { ...a$i, ...h }, g = (t) => {
       o && o(t);
     }, c = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", u = () => {
       const t = "nut-icon";
@@ -2340,8 +2340,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  k$4.defaultProps = a$h;
-  const a$g = {
+  k$5.defaultProps = a$i;
+  const a$h = {
     className: "",
     style: void 0,
     name: "Image",
@@ -2349,8 +2349,8 @@ Check the top-level render call using <` + t + ">.");
     height: "",
     onClick: () => {
     }
-  }, k$3 = (h) => {
-    const { className: l2, style: d, name: c, color: m, width: p, height: f, onClick: r } = { ...a$g, ...h }, g = (t) => {
+  }, k$4 = (h) => {
+    const { className: l2, style: d, name: c, color: m, width: p, height: f, onClick: r } = { ...a$h, ...h }, g = (t) => {
       r && r(t);
     }, o = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", u = () => {
       const t = "nut-icon";
@@ -2398,8 +2398,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  k$3.defaultProps = a$g;
-  const a$f = {
+  k$4.defaultProps = a$h;
+  const a$g = {
     className: "",
     style: void 0,
     name: "JoySmile",
@@ -2408,7 +2408,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, x$7 = (h) => {
-    const { className: i, style: d, name: e, color: m, width: p, height: f, onClick: r } = { ...a$f, ...h }, g = (t) => {
+    const { className: i, style: d, name: e, color: m, width: p, height: f, onClick: r } = { ...a$g, ...h }, g = (t) => {
       r && r(t);
     }, c = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", u = () => {
       const t = "nut-icon";
@@ -2445,8 +2445,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  x$7.defaultProps = a$f;
-  const a$e = {
+  x$7.defaultProps = a$g;
+  const a$f = {
     className: "",
     style: void 0,
     name: "Left",
@@ -2455,7 +2455,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, y$5 = (h) => {
-    const { className: r, style: d, name: e, color: p, width: m, height: f, onClick: n } = { ...a$e, ...h }, g = (t) => {
+    const { className: r, style: d, name: e, color: p, width: m, height: f, onClick: n } = { ...a$f, ...h }, g = (t) => {
       n && n(t);
     }, i = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", u = () => {
       const t = "nut-icon";
@@ -2492,8 +2492,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  y$5.defaultProps = a$e;
-  const a$d = {
+  y$5.defaultProps = a$f;
+  const a$e = {
     className: "",
     style: void 0,
     name: "Link",
@@ -2502,7 +2502,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, x$6 = (h) => {
-    const { className: s, style: d, name: c, color: m, width: p, height: f, onClick: n } = { ...a$d, ...h }, g = (t) => {
+    const { className: s, style: d, name: c, color: m, width: p, height: f, onClick: n } = { ...a$e, ...h }, g = (t) => {
       n && n(t);
     }, i = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", k2 = () => {
       const t = "nut-icon";
@@ -2539,8 +2539,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  x$6.defaultProps = a$d;
-  const a$c = {
+  x$6.defaultProps = a$e;
+  const a$d = {
     className: "",
     style: void 0,
     name: "Loading",
@@ -2548,8 +2548,8 @@ Check the top-level render call using <` + t + ">.");
     height: "",
     onClick: () => {
     }
-  }, k$2 = (h) => {
-    const { className: l2, style: m, name: t, color: d, width: p, height: g, onClick: o } = { ...a$c, ...h }, f = (c) => {
+  }, k$3 = (h) => {
+    const { className: l2, style: m, name: t, color: d, width: p, height: g, onClick: o } = { ...a$d, ...h }, f = (c) => {
       o && o(c);
     }, n = (c) => c === "" ? "" : isNaN(Number(c)) ? String(c) : c + "px", z = () => {
       const c = "nut-icon";
@@ -2586,8 +2586,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  k$2.defaultProps = a$c;
-  const a$b = {
+  k$3.defaultProps = a$d;
+  const a$c = {
     className: "",
     style: void 0,
     name: "Location2",
@@ -2596,7 +2596,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, x$5 = (h) => {
-    const { className: o, style: m, name: s, color: d, width: p, height: f, onClick: n } = { ...a$b, ...h }, g = (t) => {
+    const { className: o, style: m, name: s, color: d, width: p, height: f, onClick: n } = { ...a$c, ...h }, g = (t) => {
       n && n(t);
     }, i = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", C = () => {
       const t = "nut-icon";
@@ -2633,8 +2633,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  x$5.defaultProps = a$b;
-  const a$a = {
+  x$5.defaultProps = a$c;
+  const a$b = {
     className: "",
     style: void 0,
     name: "MaskClose",
@@ -2643,7 +2643,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, x$4 = (h) => {
-    const { className: c, style: d, name: s, color: m, width: p, height: f, onClick: l2 } = { ...a$a, ...h }, g = (t) => {
+    const { className: c, style: d, name: s, color: m, width: p, height: f, onClick: l2 } = { ...a$b, ...h }, g = (t) => {
       l2 && l2(t);
     }, r = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", C = () => {
       const t = "nut-icon";
@@ -2680,8 +2680,8 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  x$4.defaultProps = a$a;
-  const a$9 = {
+  x$4.defaultProps = a$b;
+  const a$a = {
     className: "",
     style: void 0,
     name: "Minus",
@@ -2690,7 +2690,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: () => {
     }
   }, y$4 = (h) => {
-    const { className: i, style: d, name: s, color: p, width: m, height: f, onClick: o } = { ...a$9, ...h }, u = (t) => {
+    const { className: i, style: d, name: s, color: p, width: m, height: f, onClick: o } = { ...a$a, ...h }, u = (t) => {
       o && o(t);
     }, r = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", g = () => {
       const t = "nut-icon";
@@ -2727,7 +2727,54 @@ Check the top-level render call using <` + t + ">.");
       }
     ) });
   };
-  y$4.defaultProps = a$9;
+  y$4.defaultProps = a$a;
+  const a$9 = {
+    className: "",
+    style: void 0,
+    name: "My",
+    width: "",
+    height: "",
+    onClick: () => {
+    }
+  }, k$2 = (h) => {
+    const { className: o, style: d, name: s, color: m, width: p, height: f, onClick: r } = { ...a$9, ...h }, g = (t) => {
+      r && r(t);
+    }, n = (t) => t === "" ? "" : isNaN(Number(t)) ? String(t) : t + "px", u = () => {
+      const t = "nut-icon";
+      return classNames({
+        [`${o}`]: o,
+        [t]: true,
+        [t + "-" + s]: s
+      });
+    }, e = {}, i = n(p || ""), l2 = n(f || "");
+    i && (e.width = i), l2 && (e.height = l2);
+    const y2 = () => ({
+      ...d,
+      ...e
+    });
+    return /* @__PURE__ */ cr(lr, { children: /* @__PURE__ */ cr(
+      "svg",
+      {
+        className: u(),
+        style: y2(),
+        onClick: g,
+        xmlns: "http://www.w3.org/2000/svg",
+        color: m,
+        viewBox: "0 0 1024 1024",
+        "aria-labelledby": s,
+        role: "presentation",
+        children: /* @__PURE__ */ cr(
+          "path",
+          {
+            d: "M512 813.949c-225.805 0-406.974-183.795-406.974-406.975S286.195 0 512 0s406.974 181.17 406.974 406.974S735.18 813.95 512 813.95zm0-735.18c-181.17 0-328.205 147.036-328.205 328.205S330.83 735.18 512 735.18s328.205-147.035 328.205-328.205S693.17 78.77 512 78.77zm202.174 939.98c-21.005 0-39.384-18.38-39.384-39.385 0-89.272-73.518-162.79-162.79-162.79-89.272 0-162.79 73.518-162.79 162.79 0 21.005-18.38 39.385-39.384 39.385s-39.385-18.38-39.385-39.385c0-133.908 107.651-241.559 241.559-241.559s241.559 107.651 241.559 241.56c0 21.004-15.754 39.384-39.385 39.384zM512 525.129c-39.385 0-78.77-13.129-105.026-36.76-15.753-13.128-18.38-39.384-2.625-55.138 13.128-15.754 39.384-18.38 55.138-2.626 23.63 21.005 81.395 21.005 105.026 0 15.754-13.128 42.01-13.128 55.138 5.251 13.128 15.754 13.128 42.01-5.251 55.139C590.77 512 551.385 525.128 512 525.128z",
+            fill: "currentColor",
+            fillOpacity: "0.9"
+          }
+        )
+      }
+    ) });
+  };
+  k$2.defaultProps = a$9;
   const a$8 = {
     className: "",
     style: void 0,
@@ -3283,7 +3330,7 @@ Check the top-level render call using <` + t + ">.");
             style: { ...getStyle(), ...style },
             onClick: (e) => handleClick2(e),
             children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "nut-button__warp", children: [
-              loading ? /* @__PURE__ */ jsxRuntimeExports.jsx(k$2, { className: "nut-icon-loading" }) : null,
+              loading ? /* @__PURE__ */ jsxRuntimeExports.jsx(k$3, { className: "nut-icon-loading" }) : null,
               !loading && icon ? icon : null,
               children && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: icon || loading ? "nut-button-text" : "", children })
             ] })
@@ -3303,7 +3350,7 @@ Check the top-level render call using <` + t + ">.");
     onClick: (event) => {
     }
   };
-  const classPrefix$9 = "nut-cell";
+  const classPrefix$g = "nut-cell";
   const Cell = (props) => {
     const {
       children,
@@ -3334,24 +3381,24 @@ Check the top-level render call using <` + t + ">.");
     return /* @__PURE__ */ jsxRuntimeExports.jsx(
       "div",
       {
-        className: classNames(classPrefix$9, className),
+        className: classNames(classPrefix$g, className),
         onClick: (event) => handleClick2(event),
         style: baseStyle,
         ...rest,
         children: children || /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-          title || description ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `${classPrefix$9}__left`, children: [
-            title ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$9}__title`, children: title }) : null,
-            description ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$9}__description`, children: description }) : null
+          title || description ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `${classPrefix$g}__left`, children: [
+            title ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$g}__title`, children: title }) : null,
+            description ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$g}__description`, children: description }) : null
           ] }) : null,
           extra ? /* @__PURE__ */ jsxRuntimeExports.jsx(
             "div",
             {
-              className: `${classPrefix$9}__extra`,
+              className: `${classPrefix$g}__extra`,
               style: styles,
               children: extra
             }
           ) : null,
-          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$9}__divider` })
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$g}__divider` })
         ] })
       }
     );
@@ -3361,18 +3408,25 @@ Check the top-level render call using <` + t + ">.");
   const defaultProps$1p = {
     ...ComponentDefaults,
     title: "",
-    description: ""
+    description: "",
+    divider: true
   };
-  const classPrefix$8 = "nut-cell-group";
+  const classPrefix$f = "nut-cell-group";
   const CellGroup = (props) => {
-    const { children, className, style, title, description, ...rest } = {
+    const { children, className, style, title, description, divider, ...rest } = {
       ...defaultProps$1p,
       ...props
     };
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: classNames(classPrefix$8, className), ...rest, children: [
-      title ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$8}__title`, children: title }) : null,
-      description ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$8}__description`, children: description }) : null,
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$8}__wrap`, children })
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: classNames(classPrefix$f, className), ...rest, children: [
+      title ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$f}__title`, children: title }) : null,
+      description ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$f}__description`, children: description }) : null,
+      /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "div",
+        {
+          className: `${classPrefix$f}__wrap ${divider ? `${classPrefix$f}__wrap--divider` : ""}`,
+          children
+        }
+      )
     ] });
   };
   CellGroup.defaultProps = defaultProps$1p;
@@ -3847,7 +3901,7 @@ Check the top-level render call using <` + t + ">.");
     loading: true,
     lazy: false
   };
-  const classPrefix$7 = "nut-image";
+  const classPrefix$e = "nut-image";
   const Image$1 = (props) => {
     const {
       className,
@@ -3942,7 +3996,7 @@ Check the top-level render call using <` + t + ">.");
       if (!isError)
         return null;
       if (typeof error === "boolean" && error === true && !innerLoading) {
-        return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-img-error", children: /* @__PURE__ */ jsxRuntimeExports.jsx(k$4, {}) });
+        return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-img-error", children: /* @__PURE__ */ jsxRuntimeExports.jsx(k$5, {}) });
       }
       if (React.isValidElement(error) && !innerLoading) {
         return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-img-error", children: error });
@@ -3953,7 +4007,7 @@ Check the top-level render call using <` + t + ">.");
       if (!loading)
         return null;
       if (typeof loading === "boolean" && loading === true && innerLoading) {
-        return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-img-loading", children: /* @__PURE__ */ jsxRuntimeExports.jsx(k$3, {}) });
+        return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-img-loading", children: /* @__PURE__ */ jsxRuntimeExports.jsx(k$4, {}) });
       }
       if (React.isValidElement(loading) && innerLoading) {
         return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-img-loading", children: loading });
@@ -3963,7 +4017,7 @@ Check the top-level render call using <` + t + ">.");
     return /* @__PURE__ */ jsxRuntimeExports.jsxs(
       "div",
       {
-        className: classNames(classPrefix$7, className),
+        className: classNames(classPrefix$e, className),
         style: containerStyle,
         onClick: (e) => {
           imageClick(e);
@@ -4131,21 +4185,21 @@ Check the top-level render call using <` + t + ">.");
     contentPosition: "center",
     direction: "horizontal"
   };
-  const classPrefix$6 = `nut-divider`;
+  const classPrefix$d = `nut-divider`;
   const Divider = (props) => {
     const { children, contentPosition, style, className, direction, ...rest } = {
       ...defaultProps$1l,
       ...props
     };
     const classes = direction === "horizontal" ? classNames({
-      [`${classPrefix$6}`]: true,
-      [`${classPrefix$6}__center`]: children,
-      [`${classPrefix$6}__left`]: contentPosition === "left",
-      [`${classPrefix$6}__right`]: contentPosition === "right",
-      [`${classPrefix$6}__hairline`]: true
+      [`${classPrefix$d}`]: true,
+      [`${classPrefix$d}__center`]: children,
+      [`${classPrefix$d}__left`]: contentPosition === "left",
+      [`${classPrefix$d}__right`]: contentPosition === "right",
+      [`${classPrefix$d}__hairline`]: true
     }) : classNames({
-      [`${classPrefix$6}`]: true,
-      [`${classPrefix$6}__vertical`]: direction === "vertical"
+      [`${classPrefix$d}`]: true,
+      [`${classPrefix$d}__vertical`]: direction === "vertical"
     });
     return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classes} ${className || ""}`, style, ...rest, children });
   };
@@ -4306,7 +4360,7 @@ Check the top-level render call using <` + t + ">.");
   };
   Layout.defaultProps = defaultProps$1i;
   Layout.displayName = "NutLayout";
-  const classPrefix$5 = "nut-row";
+  const classPrefix$c = "nut-row";
   const defaultProps$1h = {
     ...ComponentDefaults,
     type: "",
@@ -4341,7 +4395,7 @@ Check the top-level render call using <` + t + ">.");
     ${getClass("justify", justify)}
     ${getClass("align", align)}
     ${getClass("flex", wrap)}
-    ${classPrefix$5}
+    ${classPrefix$c}
    `;
     };
     const parentRow = {
@@ -4440,7 +4494,7 @@ Check the top-level render call using <` + t + ">.");
     threshold: 0,
     zIndex: 2e3
   };
-  const classPrefix$4 = "nut-sticky";
+  const classPrefix$b = "nut-sticky";
   const Sticky = (props) => {
     const {
       position,
@@ -4562,7 +4616,7 @@ Check the top-level render call using <` + t + ">.");
       {
         ref: rootRef,
         style: { ...style, ...rootStyle },
-        className: classNames(classPrefix$4, className),
+        className: classNames(classPrefix$b, className),
         ...rest,
         children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-sticky--box", ref: stickyRef, style: stickyStyle, children })
       }
@@ -12239,280 +12293,189 @@ Please add \`${key}Action\` when creating your handler.`);
       /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-subsidenavbar__content", children })
     ] });
   };
-  var classnameExports = {};
-  var classname = {
-    get exports() {
-      return classnameExports;
-    },
-    set exports(v) {
-      classnameExports = v;
-    }
-  };
-  var classname_production_min = {};
-  var hasRequiredClassname_production_min;
-  function requireClassname_production_min() {
-    if (hasRequiredClassname_production_min)
-      return classname_production_min;
-    hasRequiredClassname_production_min = 1;
-    function r(r2) {
-      function t2(t3, i, a2, o) {
-        var f = i ? e + t3 + r2.e + i : e + t3, v = f;
-        if (a2) {
-          var s = " " + v + r2.m;
-          for (var u in a2)
-            if (a2.hasOwnProperty(u)) {
-              var p = a2[u];
-              true === p ? v += s + u : p && (v += s + u + n + p);
-            }
-        }
-        if (void 0 !== o)
-          for (var y2 = 0, c = (o = Array.isArray(o) ? o : [o]).length; y2 < c; y2++) {
-            var l2 = o[y2];
-            if (l2 && "string" == typeof l2.valueOf())
-              for (var g = l2.valueOf().split(" "), d = 0; d < g.length; d++) {
-                var h = g[d];
-                h !== f && (v += " " + h);
-              }
-          }
-        return v;
-      }
-      var e = r2.n || "", n = r2.v || r2.m;
-      return function(r3, e2) {
-        return function(n2, i, a2) {
-          return "string" == typeof n2 ? "string" == typeof i || Array.isArray(i) ? t2(r3, n2, void 0, i) : t2(r3, n2, i, a2) : t2(r3, e2, n2, i);
-        };
-      };
+  function usePropsValue({
+    value,
+    defaultValue,
+    finalValue,
+    onChange = (value2) => {
     }
-    Object.defineProperty(classname_production_min, "__esModule", { value: true });
-    var t = r({ e: "-", m: "_" });
-    classname_production_min.cn = t, classname_production_min.withNaming = r;
-    return classname_production_min;
-  }
-  var classname_development = {};
-  var hasRequiredClassname_development;
-  function requireClassname_development() {
-    if (hasRequiredClassname_development)
-      return classname_development;
-    hasRequiredClassname_development = 1;
-    Object.defineProperty(classname_development, "__esModule", { value: true });
-    function withNaming(preset) {
-      var nameSpace = preset.n || "";
-      var modValueDelimiter = preset.v || preset.m;
-      function stringify(b, e, m, mix) {
-        var entityName = e ? nameSpace + b + preset.e + e : nameSpace + b;
-        var className = entityName;
-        if (m) {
-          var modPrefix = " " + className + preset.m;
-          for (var k2 in m) {
-            if (m.hasOwnProperty(k2)) {
-              var modVal = m[k2];
-              if (modVal === true) {
-                className += modPrefix + k2;
-              } else if (modVal) {
-                className += modPrefix + k2 + modValueDelimiter + modVal;
-              }
-            }
-          }
-        }
-        if (mix !== void 0) {
-          mix = Array.isArray(mix) ? mix : [mix];
-          for (var i = 0, len = mix.length; i < len; i++) {
-            var value = mix[i];
-            if (!value || typeof value.valueOf() !== "string")
-              continue;
-            var mixes = value.valueOf().split(" ");
-            for (var j = 0; j < mixes.length; j++) {
-              var val = mixes[j];
-              if (val !== entityName) {
-                className += " " + val;
-              }
-            }
-          }
-        }
-        return className;
-      }
-      return function cnGenerator(b, e) {
-        return function(elemOrMods, elemModsOrBlockMix, elemMix) {
-          if (typeof elemOrMods === "string") {
-            if (typeof elemModsOrBlockMix === "string" || Array.isArray(elemModsOrBlockMix)) {
-              return stringify(b, elemOrMods, void 0, elemModsOrBlockMix);
-            }
-            return stringify(b, elemOrMods, elemModsOrBlockMix, elemMix);
-          }
-          return stringify(b, e, elemOrMods, elemModsOrBlockMix);
-        };
-      };
+  }) {
+    const [uncontrolled, setUncontrolled] = React.useState(
+      defaultValue !== void 0 ? defaultValue : finalValue
+    );
+    const handleUncontrolledChange = (val) => {
+      setUncontrolled(val);
+      onChange == null ? void 0 : onChange(val);
+    };
+    if (value !== void 0) {
+      return [value, onChange];
     }
-    var cn2 = withNaming({
-      e: "-",
-      m: "_"
-    });
-    classname_development.cn = cn2;
-    classname_development.withNaming = withNaming;
-    return classname_development;
+    return [uncontrolled, handleUncontrolledChange];
   }
-  (function(module2) {
-    if (process.env.NODE_ENV === "production") {
-      module2.exports = requireClassname_production_min();
-    } else {
-      module2.exports = requireClassname_development();
-    }
-  })(classname);
-  const cn = classnameExports.withNaming({ n: "nut-", e: "__", m: "--", v: "-" });
   const defaultProps$18 = {
-    visible: 0,
-    bottom: false,
-    size: 20,
-    unactiveColor: "",
-    activeColor: "",
-    safeAreaInsetBottom: false,
-    className: "",
-    style: {},
-    onSwitch: (child, activeVisible) => {
-    }
+    ...ComponentDefaults,
+    value: "",
+    dot: false,
+    max: 99,
+    top: "0",
+    right: "5",
+    color: ""
   };
-  const Tabbar = (props) => {
-    const {
-      children,
-      visible,
-      activeVisible,
-      bottom,
-      size,
-      activeColor,
-      unactiveColor,
-      safeAreaInsetBottom,
-      className,
-      style,
-      onSwitch
-    } = {
-      ...defaultProps$18,
+  const Badge = (props) => {
+    const { className, style, value, max, children, dot, top, right, color } = {
+      ...defaultProps$18,
       ...props
     };
-    const b = cn("tabbar");
-    const [selectIndex, setSelectIndex] = React.useState(activeVisible || visible);
-    const handleClick2 = (idx) => {
-      if (!("activeVisible" in props)) {
-        setSelectIndex(idx);
+    const classPrefix2 = "nut-badge";
+    const classes = classNames(classPrefix2, className);
+    const contentClasses = classNames(
+      { [`${classPrefix2}__dot`]: dot },
+      `${classPrefix2}__content`,
+      `${classPrefix2}__sup`
+    );
+    function content() {
+      if (dot || typeof value === "object")
+        return null;
+      if (typeof value === "number" && typeof max === "number") {
+        return max < value ? `${max}+` : value;
       }
+      return value;
+    }
+    const getStyle = () => {
+      const style2 = {};
+      style2.top = `${Number(top) || parseFloat(top) || 0}px`;
+      style2.right = `${Number(right) || parseFloat(right) || 0}px`;
+      style2.background = color;
+      return style2;
     };
-    React.useEffect(() => {
-      if (activeVisible !== void 0) {
-        setSelectIndex(activeVisible);
-      }
-    }, [activeVisible]);
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(
-      "div",
-      {
-        className: [
-          `${b()}`,
-          bottom ? `${b("bottom")}` : "",
-          safeAreaInsetBottom ? `${b("bottom")} ${b("safebottom")}` : "",
-          className
-        ].join(" "),
-        style,
-        children: React.Children.map(children, (child, idx) => {
-          if (!React.isValidElement(child)) {
-            return null;
-          }
-          const childProps = {
-            ...child.props,
-            active: idx === selectIndex,
-            index: idx,
-            unactiveColor,
-            activeColor,
-            size,
-            handleClick: () => {
-              handleClick2(idx);
-              onSwitch(child, idx);
-            }
-          };
-          return React.cloneElement(child, childProps);
-        })
-      }
-    );
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: classes, style, children: [
+      typeof value === "object" && value && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix2}__icon`, children: value }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children }),
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: contentClasses, style: getStyle(), children: content() })
+    ] });
   };
-  Tabbar.defaultProps = defaultProps$18;
-  Tabbar.displayName = "NutTabbar";
+  Badge.defaultProps = defaultProps$18;
+  Badge.displayName = "NutBadge";
   const defaultProps$17 = {
     ...ComponentDefaults,
-    dot: false,
-    className: "",
-    tabTitle: "",
+    title: "",
     icon: null,
-    href: "",
-    num: "",
     active: false,
-    activeColor: "",
-    unactiveColor: "",
     index: 0,
     handleClick: (idx) => {
     }
   };
   const TabbarItem = (props) => {
     const {
-      dot,
       className,
       style,
-      tabTitle,
+      title,
       icon,
-      href,
-      num,
       active,
       activeColor,
-      unactiveColor,
+      inactiveColor,
       index,
-      handleClick: handleClick2
+      handleClick: handleClick2,
+      ...rest
     } = {
       ...defaultProps$17,
       ...props
     };
-    const b = cn("tabbar-item");
-    const bIcon = cn("tabbar-item__icon-box");
-    React.useEffect(() => {
-      if (active && href) {
-        window.location.href = href;
-      }
-    }, [active, href]);
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    const classPrefix2 = "nut-tabbar-item";
+    const tabbarItemClass = classNames(className, classPrefix2, {
+      [`${classPrefix2}-active`]: active
+    });
+    const boxPrefix = `${classPrefix2}__icon-box`;
+    const titleClass = classNames(boxPrefix, `${boxPrefix}-nav`, {
+      [`${boxPrefix}-large`]: !icon
+    });
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(
       "div",
       {
-        className: `${b({ active })} ${className}`,
+        className: tabbarItemClass,
         style: {
-          ...style,
-          color: active ? activeColor : unactiveColor
-        },
-        onClick: () => {
-          handleClick2(index);
+          color: active ? activeColor : inactiveColor,
+          ...style
         },
+        onClick: () => handleClick2(index),
+        children: icon ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { ...rest, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: boxPrefix, children: icon }) }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: titleClass, children: title })
+        ] }) : /* @__PURE__ */ jsxRuntimeExports.jsx(Badge, { ...rest, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: titleClass, children: title }) })
+      }
+    );
+  };
+  const defaultProps$16 = {
+    ...ComponentDefaults,
+    defaultValue: 0,
+    fixed: false,
+    inactiveColor: "",
+    activeColor: "",
+    safeArea: false,
+    onSwitch: (value) => {
+    }
+  };
+  const Tabbar = (props) => {
+    const {
+      children,
+      defaultValue,
+      value,
+      fixed,
+      activeColor,
+      inactiveColor,
+      safeArea,
+      className,
+      style,
+      onSwitch
+    } = {
+      ...defaultProps$16,
+      ...props
+    };
+    const classPrefix2 = "nut-tabbar";
+    const [selectIndex, setSelectIndex] = usePropsValue({
+      value,
+      defaultValue,
+      finalValue: 0,
+      onChange: onSwitch
+    });
+    return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+      "div",
+      {
+        className: classNames(classPrefix2, className, {
+          [`${classPrefix2}__fixed`]: fixed
+        }),
+        style,
         children: [
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: `${bIcon()}`, children: [
-            !dot ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-              num && num <= 99 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${bIcon("tips", [bIcon("num")])}`, children: num }),
-              num && num >= 100 && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${bIcon("tips", [bIcon("nums")])}`, children: "99+" })
-            ] }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${bIcon("tips", [bIcon("dot")])}` }),
-            icon || null
-          ] }),
-          tabTitle && /* @__PURE__ */ jsxRuntimeExports.jsx(
-            "div",
-            {
-              className: bIcon({ "nav-word": true }, [
-                bIcon({ "big-word": !icon })
-              ]),
-              children: tabTitle
+          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix2}__wrap`, children: React.Children.map(children, (child, idx) => {
+            if (!React.isValidElement(child)) {
+              return null;
             }
-          )
+            const childProps = {
+              ...child.props,
+              active: idx === selectIndex,
+              index: idx,
+              inactiveColor,
+              activeColor,
+              handleClick: setSelectIndex
+            };
+            return React.cloneElement(child, childProps);
+          }) }),
+          (fixed || safeArea) && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix2}__safe-area` })
         ]
       }
     );
   };
-  const defaultProps$16 = {
+  Tabbar.defaultProps = defaultProps$16;
+  Tabbar.displayName = "NutTabbar";
+  Tabbar.Item = TabbarItem;
+  const defaultProps$15 = {
     title: "",
     value: "",
     disabled: false
   };
   const TabPane = (props) => {
     const { children, autoHeightClassName, className, disabled } = {
-      ...defaultProps$16,
+      ...defaultProps$15,
       ...props
     };
     const classPrefix2 = "nut-tabpane";
@@ -12539,26 +12502,7 @@ Please add \`${key}Action\` when creating your handler.`);
     }
   }
   const requestAniFrame$1 = requestAniFrame();
-  function usePropsValue({
-    value,
-    defaultValue,
-    finalValue,
-    onChange = (value2) => {
-    }
-  }) {
-    const [uncontrolled, setUncontrolled] = React.useState(
-      defaultValue !== void 0 ? defaultValue : finalValue
-    );
-    const handleUncontrolledChange = (val) => {
-      setUncontrolled(val);
-      onChange == null ? void 0 : onChange(val);
-    };
-    if (value !== void 0) {
-      return [value, onChange];
-    }
-    return [uncontrolled, handleUncontrolledChange];
-  }
-  const defaultProps$15 = {
+  const defaultProps$14 = {
     ...ComponentDefaults,
     tabStyle: {},
     activeColor: "",
@@ -12567,7 +12511,7 @@ Please add \`${key}Action\` when creating your handler.`);
     duration: 300,
     autoHeight: false
   };
-  const classPrefix$3 = "nut-tabs";
+  const classPrefix$a = "nut-tabs";
   const Tabs = (props) => {
     const {
       activeColor,
@@ -12584,7 +12528,7 @@ Please add \`${key}Action\` when creating your handler.`);
       autoHeight,
       ...rest
     } = {
-      ...defaultProps$15,
+      ...defaultProps$14,
       ...props
     };
     const [value, setValue] = usePropsValue({
@@ -12646,14 +12590,14 @@ Please add \`${key}Action\` when creating your handler.`);
     };
     const titles = React.useRef(getTitles());
     const classes = classNames(
-      classPrefix$3,
-      `${classPrefix$3}--${direction}`,
+      classPrefix$a,
+      `${classPrefix$a}--${direction}`,
       className
     );
-    const classesTitle = classNames(`${classPrefix$3}__titles`, {
-      [`${classPrefix$3}__titles--${activeType}`]: activeType,
-      [`${classPrefix$3}__titles--scrollable`]: true,
-      [`${classPrefix$3}__titles--${align}`]: align
+    const classesTitle = classNames(`${classPrefix$a}__titles`, {
+      [`${classPrefix$a}__titles--${activeType}`]: activeType,
+      [`${classPrefix$a}__titles--scrollable`]: true,
+      [`${classPrefix$a}__titles--${align}`]: align
     });
     const tabsActiveStyle = {
       color: activeType === "smile" ? activeColor : "",
@@ -12682,7 +12626,7 @@ Please add \`${key}Action\` when creating your handler.`);
             onClick: (e) => {
               tabChange(item);
             },
-            className: classNames(`${classPrefix$3}__titles-item`, {
+            className: classNames(`${classPrefix$a}__titles-item`, {
               [`nut-tabs__titles-item--active`]: !item.disabled && String(item.value) === String(value),
               [`nut-tabs__titles-item--disabled`]: item.disabled,
               [`nut-tabs__titles-item--${align}`]: align
@@ -12692,14 +12636,14 @@ Please add \`${key}Action\` when creating your handler.`);
               activeType === "line" && /* @__PURE__ */ jsxRuntimeExports.jsx(
                 "div",
                 {
-                  className: `${classPrefix$3}__titles-item__line`,
+                  className: `${classPrefix$a}__titles-item__line`,
                   style: tabsActiveStyle
                 }
               ),
               activeType === "smile" && /* @__PURE__ */ jsxRuntimeExports.jsx(
                 "div",
                 {
-                  className: `${classPrefix$3}__titles-item__smile`,
+                  className: `${classPrefix$a}__titles-item__smile`,
                   style: tabsActiveStyle,
                   children: /* @__PURE__ */ jsxRuntimeExports.jsx(x$7, { color: activeColor, width: 40, height: 20 })
                 }
@@ -12711,7 +12655,7 @@ Please add \`${key}Action\` when creating your handler.`);
                     {
                       ellipsis: true
                     },
-                    `${classPrefix$3}__titles-item__text`
+                    `${classPrefix$a}__titles-item__text`
                   ),
                   children: item.title
                 }
@@ -12721,7 +12665,7 @@ Please add \`${key}Action\` when creating your handler.`);
           item.value
         );
       }) }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$3}__content__wrap`, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$3}__content`, style: contentStyle, children: React.Children.map(children, (child, idx) => {
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$a}__content__wrap`, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$a}__content`, style: contentStyle, children: React.Children.map(children, (child, idx) => {
         if (!React.isValidElement(child)) {
           return null;
         }
@@ -12739,10 +12683,130 @@ Please add \`${key}Action\` when creating your handler.`);
       }) }) })
     ] });
   };
-  Tabs.defaultProps = defaultProps$15;
+  Tabs.defaultProps = defaultProps$14;
   Tabs.displayName = "NutTabs";
   Tabs.TabPane = TabPane;
-  const defaultProps$14 = {
+  var classnameExports = {};
+  var classname = {
+    get exports() {
+      return classnameExports;
+    },
+    set exports(v) {
+      classnameExports = v;
+    }
+  };
+  var classname_production_min = {};
+  var hasRequiredClassname_production_min;
+  function requireClassname_production_min() {
+    if (hasRequiredClassname_production_min)
+      return classname_production_min;
+    hasRequiredClassname_production_min = 1;
+    function r(r2) {
+      function t2(t3, i, a2, o) {
+        var f = i ? e + t3 + r2.e + i : e + t3, v = f;
+        if (a2) {
+          var s = " " + v + r2.m;
+          for (var u in a2)
+            if (a2.hasOwnProperty(u)) {
+              var p = a2[u];
+              true === p ? v += s + u : p && (v += s + u + n + p);
+            }
+        }
+        if (void 0 !== o)
+          for (var y2 = 0, c = (o = Array.isArray(o) ? o : [o]).length; y2 < c; y2++) {
+            var l2 = o[y2];
+            if (l2 && "string" == typeof l2.valueOf())
+              for (var g = l2.valueOf().split(" "), d = 0; d < g.length; d++) {
+                var h = g[d];
+                h !== f && (v += " " + h);
+              }
+          }
+        return v;
+      }
+      var e = r2.n || "", n = r2.v || r2.m;
+      return function(r3, e2) {
+        return function(n2, i, a2) {
+          return "string" == typeof n2 ? "string" == typeof i || Array.isArray(i) ? t2(r3, n2, void 0, i) : t2(r3, n2, i, a2) : t2(r3, e2, n2, i);
+        };
+      };
+    }
+    Object.defineProperty(classname_production_min, "__esModule", { value: true });
+    var t = r({ e: "-", m: "_" });
+    classname_production_min.cn = t, classname_production_min.withNaming = r;
+    return classname_production_min;
+  }
+  var classname_development = {};
+  var hasRequiredClassname_development;
+  function requireClassname_development() {
+    if (hasRequiredClassname_development)
+      return classname_development;
+    hasRequiredClassname_development = 1;
+    Object.defineProperty(classname_development, "__esModule", { value: true });
+    function withNaming(preset) {
+      var nameSpace = preset.n || "";
+      var modValueDelimiter = preset.v || preset.m;
+      function stringify(b, e, m, mix) {
+        var entityName = e ? nameSpace + b + preset.e + e : nameSpace + b;
+        var className = entityName;
+        if (m) {
+          var modPrefix = " " + className + preset.m;
+          for (var k2 in m) {
+            if (m.hasOwnProperty(k2)) {
+              var modVal = m[k2];
+              if (modVal === true) {
+                className += modPrefix + k2;
+              } else if (modVal) {
+                className += modPrefix + k2 + modValueDelimiter + modVal;
+              }
+            }
+          }
+        }
+        if (mix !== void 0) {
+          mix = Array.isArray(mix) ? mix : [mix];
+          for (var i = 0, len = mix.length; i < len; i++) {
+            var value = mix[i];
+            if (!value || typeof value.valueOf() !== "string")
+              continue;
+            var mixes = value.valueOf().split(" ");
+            for (var j = 0; j < mixes.length; j++) {
+              var val = mixes[j];
+              if (val !== entityName) {
+                className += " " + val;
+              }
+            }
+          }
+        }
+        return className;
+      }
+      return function cnGenerator(b, e) {
+        return function(elemOrMods, elemModsOrBlockMix, elemMix) {
+          if (typeof elemOrMods === "string") {
+            if (typeof elemModsOrBlockMix === "string" || Array.isArray(elemModsOrBlockMix)) {
+              return stringify(b, elemOrMods, void 0, elemModsOrBlockMix);
+            }
+            return stringify(b, elemOrMods, elemModsOrBlockMix, elemMix);
+          }
+          return stringify(b, e, elemOrMods, elemModsOrBlockMix);
+        };
+      };
+    }
+    var cn2 = withNaming({
+      e: "-",
+      m: "_"
+    });
+    classname_development.cn = cn2;
+    classname_development.withNaming = withNaming;
+    return classname_development;
+  }
+  (function(module2) {
+    if (process.env.NODE_ENV === "production") {
+      module2.exports = requireClassname_production_min();
+    } else {
+      module2.exports = requireClassname_development();
+    }
+  })(classname);
+  const cn = classnameExports.withNaming({ n: "nut-", e: "__", m: "--", v: "-" });
+  const defaultProps$13 = {
     type: "custom",
     existAddress: [],
     defaultIcon: null,
@@ -12764,7 +12828,7 @@ Please add \`${key}Action\` when creating your handler.`);
       onClose,
       onSwitchModule,
       ...rest
-    } = { ...defaultProps$14, ...props };
+    } = { ...defaultProps$13, ...props };
     const b = cn("address");
     const selectedExist = (item) => {
       const copyExistAdd = existAddress;
@@ -12806,7 +12870,7 @@ Please add \`${key}Action\` when creating your handler.`);
       isShowCustomAddress && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: b("choose-other"), onClick: onSwitch, children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: b("choose-other-btn"), children: customAndExistTitle || locale.address.chooseAnotherAddress }) })
     ] });
   };
-  const defaultProps$13 = {
+  const defaultProps$12 = {
     modelValue: [],
     type: "custom",
     province: [],
@@ -12831,7 +12895,7 @@ Please add \`${key}Action\` when creating your handler.`);
       onClose,
       ...rest
     } = {
-      ...defaultProps$13,
+      ...defaultProps$12,
       ...props
     };
     const b = cn("address");
@@ -13000,28 +13064,28 @@ Please add \`${key}Action\` when creating your handler.`);
       nextAreaList(item);
     };
     React.useEffect(() => {
-      const { province: province2 } = { ...defaultProps$13, ...props };
+      const { province: province2 } = { ...defaultProps$12, ...props };
       setRegionList({
         ...regionList,
         province: isCustom2() ? transformData(province2) : province2
       });
     }, [province]);
     React.useEffect(() => {
-      const { city: city2 } = { ...defaultProps$13, ...props };
+      const { city: city2 } = { ...defaultProps$12, ...props };
       setRegionList({
         ...regionList,
         city: isCustom2() ? transformData(city2) : city2
       });
     }, [city]);
     React.useEffect(() => {
-      const { country: country2 } = { ...defaultProps$13, ...props };
+      const { country: country2 } = { ...defaultProps$12, ...props };
       setRegionList({
         ...regionList,
         country: isCustom2() ? transformData(country2) : country2
       });
     }, [country]);
     React.useEffect(() => {
-      const { town: town2 } = { ...defaultProps$13, ...props };
+      const { town: town2 } = { ...defaultProps$12, ...props };
       setRegionList({
         ...regionList,
         town: isCustom2() ? transformData(town2) : town2
@@ -13096,7 +13160,7 @@ Please add \`${key}Action\` when creating your handler.`);
       ) })
     ] });
   };
-  const defaultProps$12 = {
+  const defaultProps$11 = {
     ...ComponentDefaults,
     modelValue: false,
     modelSelect: [],
@@ -13147,7 +13211,7 @@ Please add \`${key}Action\` when creating your handler.`);
       className,
       ...rest
     } = {
-      ...defaultProps$12,
+      ...defaultProps$11,
       ...props
     };
     const b = cn("address");
@@ -13305,7 +13369,7 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     ) });
   };
-  Address.defaultProps = defaultProps$12;
+  Address.defaultProps = defaultProps$11;
   Address.displayName = "NutAddress";
   const Utils = {
     /**
@@ -13425,7 +13489,7 @@ Please add \`${key}Action\` when creating your handler.`);
       return false;
     }
   };
-  const defaultProps$11 = {
+  const defaultProps$10 = {
     type: "one",
     isAutoBackFill: false,
     poppable: true,
@@ -13477,7 +13541,7 @@ Please add \`${key}Action\` when creating your handler.`);
       onUpdate,
       onSelected,
       onYearMonthChange
-    } = { ...defaultProps$11, ...props };
+    } = { ...defaultProps$10, ...props };
     const weeks = locale.calendaritem.weekdays;
     const [yearMonthTitle, setYearMonthTitle] = React.useState("");
     const [monthsData, setMonthsData] = React.useState([]);
@@ -14073,9 +14137,9 @@ Please add \`${key}Action\` when creating your handler.`);
       poppable && !isAutoBackFill ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-calendar-footer", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "calendar-confirm-btn", onClick: confirm2, children: confirmText || locale.confirm }) }) : ""
     ] }) });
   });
-  CalendarItem.defaultProps = defaultProps$11;
+  CalendarItem.defaultProps = defaultProps$10;
   CalendarItem.displayName = "NutCalendarItem";
-  const defaultProps$10 = {
+  const defaultProps$$ = {
     type: "one",
     isAutoBackFill: false,
     poppable: true,
@@ -14130,7 +14194,7 @@ Please add \`${key}Action\` when creating your handler.`);
       onChoose,
       onSelected,
       onYearMonthChange
-    } = { ...defaultProps$10, ...props };
+    } = { ...defaultProps$$, ...props };
     const calendarRef = React.useRef(null);
     const close = () => {
       onClose && onClose();
@@ -14200,9 +14264,9 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     ) : renderItem() });
   });
-  Calendar.defaultProps = defaultProps$10;
+  Calendar.defaultProps = defaultProps$$;
   Calendar.displayName = "NutCalendar";
-  const defaultProps$$ = {
+  const defaultProps$_ = {
     data: {
       text: "",
       value: "",
@@ -14219,7 +14283,7 @@ Please add \`${key}Action\` when creating your handler.`);
   };
   const InternalCascaderItem = (props, ref) => {
     const { data, checked, checkedIcon, chooseItem, activeColor } = {
-      ...defaultProps$$,
+      ...defaultProps$_,
       ...props
     };
     const b = cn("cascader-item");
@@ -14252,13 +14316,13 @@ Please add \`${key}Action\` when creating your handler.`);
         },
         children: [
           /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: classesTitle, children: data.text }),
-          data.loading ? /* @__PURE__ */ jsxRuntimeExports.jsx(k$2, { color: "#969799", className: "nut-cascader-item__icon-loading" }) : renderIcon()
+          data.loading ? /* @__PURE__ */ jsxRuntimeExports.jsx(k$3, { color: "#969799", className: "nut-cascader-item__icon-loading" }) : renderIcon()
         ]
       }
     );
   };
   const CascaderItem = React.forwardRef(InternalCascaderItem);
-  CascaderItem.defaultProps = defaultProps$$;
+  CascaderItem.defaultProps = defaultProps$_;
   CascaderItem.displayName = "NutCascaderItem";
   const formatTree = (tree, parent, config2) => tree.map((node) => {
     const {
@@ -14396,7 +14460,7 @@ Please add \`${key}Action\` when creating your handler.`);
     }
   }
   const Tree$1 = Tree;
-  const defaultProps$_ = {
+  const defaultProps$Z = {
     className: "",
     style: {},
     activeColor: "",
@@ -14447,7 +14511,7 @@ Please add \`${key}Action\` when creating your handler.`);
       onClose,
       onChange,
       onPathChange
-    } = { ...defaultProps$_, ...props };
+    } = { ...defaultProps$Z, ...props };
     const [tabvalue, setTabvalue] = React.useState("c1");
     const [optionsData, setOptionsData] = React.useState([]);
     const isLazy = () => state.configs.lazy && Boolean(state.configs.lazyLoad);
@@ -14722,23 +14786,22 @@ Please add \`${key}Action\` when creating your handler.`);
     ) : renderItem() });
   };
   const Cascader = React.forwardRef(InternalCascader);
-  Cascader.defaultProps = defaultProps$_;
+  Cascader.defaultProps = defaultProps$Z;
   Cascader.displayName = "NutCascader";
   const CheckboxGroupContext = React.createContext(null);
   const Context = CheckboxGroupContext;
-  const defaultProps$Z = {
-    disabled: false,
+  const defaultProps$Y = {
     max: void 0,
-    textPosition: "right",
+    labelPosition: "right",
     direction: "vertical",
     onChange: (value) => {
     },
     options: []
   };
+  const classPrefix$9 = "nut-checkboxgroup";
   const CheckboxGroup = React.forwardRef(
     (props, ref) => {
-      const { children } = { ...defaultProps$Z, ...props };
-      const b = cn("checkboxgroup");
+      const { children } = { ...defaultProps$Y, ...props };
       const {
         className,
         disabled,
@@ -14746,29 +14809,29 @@ Please add \`${key}Action\` when creating your handler.`);
         value,
         defaultValue,
         max,
-        textPosition,
+        labelPosition,
         direction,
         options: options2,
         ...rest
       } = props;
       React.useImperativeHandle(ref, () => ({
-        toggleAll(state) {
+        toggle(state) {
           if (state === false) {
             setValue([]);
           } else {
             const childrenLabel = [];
             React.Children.map(children, (child) => {
               const childProps = child.props;
-              childrenLabel.push(childProps.label || child.children);
+              childrenLabel.push(childProps.value);
             });
             setValue(childrenLabel);
           }
         },
-        toggleReverse() {
+        reverse() {
           const childrenLabel = [];
           React.Children.map(children, (child) => {
             const childProps = child.props;
-            childrenLabel.push(childProps.label || child.children);
+            childrenLabel.push(childProps.value);
           });
           const reverse = childrenLabel.filter(
             (c) => (_value == null ? void 0 : _value.findIndex((v) => v === c)) === -1
@@ -14787,8 +14850,9 @@ Please add \`${key}Action\` when creating your handler.`);
           return /* @__PURE__ */ jsxRuntimeExports.jsx(
             Checkbox,
             {
-              children: label,
-              label: value2,
+              label,
+              disabled: disabled2,
+              value: value2,
               ...rest2
             },
             value2 == null ? void 0 : value2.toString()
@@ -14799,25 +14863,26 @@ Please add \`${key}Action\` when creating your handler.`);
         Context.Provider,
         {
           value: {
-            textPosition: textPosition || "left",
+            labelPosition: labelPosition || "right",
             disabled,
             max,
-            checkedValue: _value,
+            value: _value,
             check: (value2) => {
               const combined = [..._value, value2];
               setValue(combined);
-              onChange && onChange(combined);
             },
             uncheck: (value2) => {
               const reduced = _value.filter((item) => item !== value2);
               setValue(reduced);
-              onChange && onChange(reduced);
             }
           },
           children: /* @__PURE__ */ jsxRuntimeExports.jsx(
             "div",
             {
-              className: `${b()} nut-checkboxgroup--${props.direction} ${className || ""}`,
+              className: classNames(classPrefix$9, {
+                [`nut-checkboxgroup--${props.direction}`]: props.direction,
+                className
+              }),
               ...rest,
               children: (options2 == null ? void 0 : options2.length) ? renderOptions() : children
             }
@@ -14826,112 +14891,117 @@ Please add \`${key}Action\` when creating your handler.`);
       );
     }
   );
-  CheckboxGroup.defaultProps = defaultProps$Z;
+  CheckboxGroup.defaultProps = defaultProps$Y;
   CheckboxGroup.displayName = "NutCheckboxGroup";
-  const defaultProps$Y = {
+  const defaultProps$X = {
     ...ComponentDefaults,
     disabled: false,
-    textPosition: "right",
-    iconSize: 18,
-    icon: "check-normal",
-    checkedIcon: "checked",
-    iconClassPrefix: "nut-icon",
-    iconFontClassName: "nutui-iconfont",
-    indeterminateIcon: "check-disabled",
-    onChange: (state) => {
+    labelPosition: "right",
+    icon: null,
+    activeIcon: null,
+    indeterminateIcon: null,
+    onChange: (value) => {
     }
   };
+  const classPrefix$8 = "nut-checkbox";
   const Checkbox = (props) => {
     const { children } = {
-      ...defaultProps$Y,
+      ...defaultProps$X,
       ...props
     };
-    const b = cn("checkbox");
     const {
       icon,
-      iconSize,
       label,
       className,
-      checkedIcon,
+      activeIcon,
       checked,
+      value,
       defaultChecked,
       disabled,
       onChange,
       indeterminate,
-      iconClassPrefix,
-      iconFontClassName,
       indeterminateIcon,
       ...others
     } = props;
-    let { textPosition, ...rest } = others;
+    let { labelPosition, ...rest } = others;
     const ctx2 = React.useContext(Context);
-    let [_checked, setChecked] = usePropsValue({
+    let [innerChecked, setChecked] = usePropsValue({
       value: props.checked,
       defaultValue: props.defaultChecked,
       finalValue: defaultChecked,
       onChange
     });
     let [innerDisabled, setDisabled] = React.useState(disabled);
-    const [_indeterminate, setIndeterminate] = React.useState(indeterminate);
+    const [innerIndeterminate, setIndeterminate] = React.useState(indeterminate);
     React.useEffect(() => {
-      !ctx2 && setChecked(checked);
       setDisabled(disabled);
+    }, [disabled]);
+    React.useEffect(() => {
       setIndeterminate(indeterminate);
-    }, [disabled, indeterminate]);
+    }, [indeterminate]);
     if (ctx2) {
-      if (ctx2.textPosition !== void 0) {
-        textPosition = ctx2.textPosition;
+      if (ctx2.labelPosition !== void 0) {
+        labelPosition = ctx2.labelPosition;
       }
-      innerDisabled = ctx2.disabled;
-      _checked = ctx2.checkedValue.includes(label);
+      innerDisabled = ctx2.disabled !== void 0 ? ctx2.disabled : innerDisabled;
+      innerChecked = ctx2.value.includes(value);
       setChecked = (checked2) => {
         if (ctx2.disabled)
           return;
         if (checked2)
-          ctx2.check(label);
+          ctx2.check(value);
         if (!checked2)
-          ctx2.uncheck(label);
+          ctx2.uncheck(value);
       };
     }
     const renderIcon = () => {
-      if (!_checked) {
-        return React.isValidElement(icon) ? icon : /* @__PURE__ */ jsxRuntimeExports.jsx(N, { width: iconSize, height: iconSize, className: color() });
+      if (!innerChecked) {
+        return React.isValidElement(icon) ? icon : /* @__PURE__ */ jsxRuntimeExports.jsx(N, { className: color() });
       }
-      if (_indeterminate) {
-        return React.isValidElement(indeterminateIcon) ? indeterminateIcon : /* @__PURE__ */ jsxRuntimeExports.jsx(x$f, { width: iconSize, height: iconSize, className: color() });
+      if (innerIndeterminate) {
+        return React.isValidElement(indeterminateIcon) ? indeterminateIcon : /* @__PURE__ */ jsxRuntimeExports.jsx(x$f, { className: color() });
       }
-      return React.isValidElement(checkedIcon) ? checkedIcon : /* @__PURE__ */ jsxRuntimeExports.jsx(x$d, { width: iconSize, height: iconSize, className: color() });
+      return React.isValidElement(activeIcon) ? activeIcon : /* @__PURE__ */ jsxRuntimeExports.jsx(x$d, { className: color() });
     };
     const color = () => {
       if (innerDisabled) {
-        return "nut-checkbox__icon--disable";
+        return `${classPrefix$8}__icon--disable`;
       }
-      if (_checked) {
-        if (_indeterminate) {
-          return "nut-checkbox__icon--indeterminate";
+      if (innerChecked) {
+        if (innerIndeterminate) {
+          return `${classPrefix$8}__icon--indeterminate`;
         }
-        return "nut-checkbox__icon";
+        return `${classPrefix$8}__icon`;
       }
-      return "nut-checkbox__icon--unchecked";
+      return `${classPrefix$8}__icon--unchecked`;
     };
     const renderLabel = () => {
-      return /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `${b("label", { disabled: innerDisabled })} `, children: children || label });
+      return /* @__PURE__ */ jsxRuntimeExports.jsx(
+        "span",
+        {
+          className: classNames(`${classPrefix$8}__label `, {
+            [`${classPrefix$8}__label--disabled`]: innerDisabled
+          }),
+          children: children || label
+        }
+      );
     };
     const handleClick2 = () => {
       if (disabled)
         return;
-      const latestChecked = !_checked;
+      const latestChecked = !innerChecked;
       if (ctx2 && ctx2.max !== void 0) {
-        if (latestChecked && ctx2.checkedValue.length >= ctx2.max)
+        if (latestChecked && ctx2.value.length >= ctx2.max)
           return;
       }
-      onChange && onChange(latestChecked, label || children);
       setChecked(latestChecked);
     };
     return /* @__PURE__ */ jsxRuntimeExports.jsxs(
       "div",
       {
-        className: `${b({ reverse: textPosition === "left" })} ${className || ""}`,
+        className: classNames(classPrefix$8, className, {
+          [`${classPrefix$8}--reverse`]: labelPosition === "left"
+        }),
         ...rest,
         onClick: handleClick2,
         children: [
@@ -14941,7 +15011,7 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     );
   };
-  Checkbox.defaultProps = defaultProps$Y;
+  Checkbox.defaultProps = defaultProps$X;
   Checkbox.displayName = "NutCheckBox";
   Checkbox.Group = CheckboxGroup;
   const MIN_DISTANCE = 10;
@@ -15448,7 +15518,7 @@ Please add \`${key}Action\` when creating your handler.`);
   const Picker = React.forwardRef(InternalPicker);
   const Picker$1 = Picker;
   const currentYear = (/* @__PURE__ */ new Date()).getFullYear();
-  const defaultProps$X = {
+  const defaultProps$W = {
     modelValue: null,
     visible: false,
     title: "",
@@ -15479,7 +15549,7 @@ Please add \`${key}Action\` when creating your handler.`);
       style,
       ...rest
     } = {
-      ...defaultProps$X,
+      ...defaultProps$W,
       ...props
     };
     const { locale } = useConfig();
@@ -15756,7 +15826,7 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     );
   };
-  DatePicker.defaultProps = defaultProps$X;
+  DatePicker.defaultProps = defaultProps$W;
   DatePicker.displayName = "NutDatePicker";
   const FormItemContext = React.createContext({});
   function _extends() {
@@ -16947,7 +17017,7 @@ Please add \`${key}Action\` when creating your handler.`);
     }
     return [formRef.current];
   };
-  const defaultProps$W = {
+  const defaultProps$V = {
     ...ComponentDefaults,
     name: "",
     label: "",
@@ -17009,7 +17079,7 @@ Please add \`${key}Action\` when creating your handler.`);
           showErrorLine,
           showErrorMessage
         } = {
-          ...defaultProps$W,
+          ...defaultProps$V,
           ...this.props
         };
         const item = ((_a2 = this.context.errList) == null ? void 0 : _a2.length) > 0 && ((_b = this.context.errList) == null ? void 0 : _b.filter((item2) => {
@@ -17076,9 +17146,9 @@ Please add \`${key}Action\` when creating your handler.`);
       return this.renderLayout(returnChildNode);
     }
   }
-  __publicField(FormItem, "defaultProps", defaultProps$W);
+  __publicField(FormItem, "defaultProps", defaultProps$V);
   __publicField(FormItem, "contextType", FormItemContext);
-  const defaultProps$V = {
+  const defaultProps$U = {
     ...ComponentDefaults,
     className: "",
     style: void 0,
@@ -17106,7 +17176,7 @@ Please add \`${key}Action\` when creating your handler.`);
       form,
       ...rest
     } = {
-      ...defaultProps$V,
+      ...defaultProps$U,
       ...props
     };
     let formInstance = {};
@@ -17138,7 +17208,7 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     );
   };
-  Form.defaultProps = defaultProps$V;
+  Form.defaultProps = defaultProps$U;
   Form.displayName = "NutForm";
   Form.Item = FormItem;
   Form.useForm = useForm;
@@ -17163,359 +17233,192 @@ Please add \`${key}Action\` when creating your handler.`);
     } else {
       value = value.replace(/-/, "");
     }
-    const regExp = allowDot ? /[^-0-9.]/g : /[^-0-9]/g;
-    return value.replace(regExp, "");
-  }
-  const defaultProps$U = {
-    ...ComponentDefaults,
-    type: "text",
-    name: "",
-    defaultValue: "",
-    placeholder: "",
-    label: "",
-    labelClass: "",
-    labelWidth: "80",
-    labelAlign: "left",
-    colon: false,
-    inputAlign: "left",
-    center: false,
-    required: false,
-    disabled: false,
-    readonly: false,
-    error: false,
-    maxlength: "9999",
-    leftIcon: null,
-    rightIcon: null,
-    clearable: false,
-    clearIcon: null,
-    clearSize: "14",
-    border: true,
-    formatTrigger: "onChange",
-    rules: [],
-    rows: null,
-    errorMessage: "",
-    errorMessageAlign: "",
-    showWordLimit: false,
-    autofocus: false,
-    slotButton: null,
-    slotInput: null
-  };
-  const Input = React.forwardRef((props, ref) => {
-    const { locale } = useConfig();
-    const {
-      children,
-      type: type2,
-      name,
-      defaultValue,
-      placeholder,
-      label,
-      labelClass,
-      labelWidth,
-      labelAlign,
-      colon,
-      inputAlign,
-      center,
-      required: required2,
-      disabled,
-      readonly,
-      error,
-      maxlength,
-      leftIcon,
-      rightIcon,
-      clearable,
-      clearIcon,
-      clearSize,
-      border,
-      formatTrigger,
-      rules: rules2,
-      errorMessage,
-      errorMessageAlign,
-      showWordLimit,
-      autofocus,
-      style,
-      className,
-      rows,
-      slotButton,
-      slotInput,
-      onChange,
-      onBlur,
-      onFocus,
-      onClear,
-      formatter,
-      keypress,
-      onClickInput,
-      onClickLeftIcon,
-      onClickRightIcon,
-      onClick,
-      ...rest
-    } = {
-      ...defaultProps$U,
-      ...props
-    };
-    const inputPlaceholder = placeholder || locale.placeholder;
-    const [inputValue, SetInputValue] = React.useState("");
-    const [active, SetActive] = React.useState(false);
-    const [classes, setClasses] = React.useState("");
-    const getModelValue = () => String(inputValue ?? "");
-    const inputRef = React.useRef(null);
-    React.useEffect(() => {
-      setClasses(inputClass);
-      SetInputValue(defaultValue);
-    }, [defaultValue]);
-    React.useEffect(() => {
-      if (inputValue) {
-        updateValue(getModelValue());
-        resetValidation();
-      }
-    }, [inputValue]);
-    React.useImperativeHandle(ref, () => {
-      return inputRef.current;
-    });
-    const inputClass = React.useCallback(() => {
-      const prefixCls2 = "nut-input";
-      return [
-        prefixCls2,
-        `${center ? "center" : ""}`,
-        `${disabled ? `${prefixCls2}-disabled` : ""}`,
-        `${required2 ? `${prefixCls2}-required` : ""}`,
-        `${error ? `${prefixCls2}-error` : ""}`,
-        `${border ? `${prefixCls2}-border` : ""}`,
-        `${slotButton || rightIcon ? `${prefixCls2}-right-mark` : ""}`
-      ].filter(Boolean).join(" ");
-    }, [disabled, required2, error, border, slotButton, rightIcon, center]);
-    React.useEffect(() => {
-      setClasses(inputClass);
-    }, [disabled, required2, error, border, slotButton, rightIcon, center]);
-    const updateValue = (value, trigger = "onChange", event) => {
-      var _a2;
-      let val = value;
-      if (type2 === "digit" || type2 === "tel") {
-        val = formatNumber(val, false, false);
-      }
-      if (type2 === "number") {
-        val = formatNumber(val, true, true);
-      }
-      if (type2 === "tel" && !formatter) {
-        const regTel = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;
-        const regNumber = /[^-0-9]/g;
-        val = !regTel.test(val) && val.length > 11 ? val.substring(0, 11) : val.replace(regNumber, "");
-      }
-      if (formatter && trigger === formatTrigger) {
-        val = formatter(val);
-      }
-      if (((_a2 = inputRef == null ? void 0 : inputRef.current) == null ? void 0 : _a2.value) !== val) {
-        inputRef.current.value = val;
-      }
-      SetInputValue(val);
-    };
-    const handleFocus = (event) => {
-      const val = event.target.value;
-      SetActive(true);
-      onFocus && onFocus(val, event);
-    };
-    const handleInput = (event) => {
-      let val = event.target.value;
-      if (maxlength && val.length > Number(maxlength)) {
-        val = val.slice(0, Number(maxlength));
-      }
-      updateValue(val, "onChange");
-      onChange && onChange(val, event);
-    };
-    const handleBlur = (event) => {
-      setTimeout(() => {
-        SetActive(false);
-      }, 200);
-      let val = event.target.value;
-      if (maxlength && val.length > Number(maxlength)) {
-        val = val.slice(0, Number(maxlength));
-      }
-      updateValue(val, "onBlur");
-      onBlur && onBlur(val, event);
-    };
-    const handleClickInput = (event) => {
-      onClickInput && onClickInput(event);
-    };
-    const handleClickLeftIcon = (event) => {
-      onClickLeftIcon && onClickLeftIcon(event);
-    };
-    const handleClickRightIcon = (event) => {
-      onClickRightIcon && onClickRightIcon(event);
-    };
-    const resetValidation = () => {
-    };
-    const inputType = (type22) => {
-      if (type22 === "number") {
-        return "text";
-      }
-      if (type22 === "digit") {
-        return "tel";
-      }
-      return type22;
-    };
-    const handleClear = (event) => {
-      updateValue("");
-      onClear && onClear("", event);
-    };
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(
-      "div",
-      {
-        className: `${classes}  ${className || ""}`,
+    const regExp = allowDot ? /[^-0-9.]/g : /[^-0-9]/g;
+    return value.replace(regExp, "");
+  }
+  const defaultProps$T = {
+    ...ComponentDefaults,
+    type: "text",
+    name: "",
+    placeholder: "",
+    confirmType: "done",
+    align: "left",
+    required: false,
+    disabled: false,
+    readOnly: false,
+    maxLength: 9999,
+    clearable: false,
+    clearIcon: null,
+    formatTrigger: "onChange",
+    autoFocus: false
+  };
+  const Input = React.forwardRef(
+    (props, ref) => {
+      const { locale } = useConfig();
+      const {
+        type: type2,
+        name,
+        placeholder,
+        align,
+        disabled,
+        readOnly,
+        maxLength,
+        clearable,
+        clearIcon,
+        formatTrigger,
+        autoFocus,
         style,
-        ...rest,
-        onClick: (e) => {
-          onClick && onClick(e);
-        },
-        children: slotInput ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-          label ? /* @__PURE__ */ jsxRuntimeExports.jsx(
-            "div",
-            {
-              className: `nut-input-label ${labelClass}`,
-              style: { width: `${labelWidth}px`, textAlign: labelAlign },
-              children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "label-string", children: [
-                label,
-                colon ? ":" : ""
-              ] })
-            }
-          ) : null,
-          /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-input-value", children: /* @__PURE__ */ jsxRuntimeExports.jsx(
-            "div",
-            {
-              className: "nut-input-inner",
-              onClick: (e) => {
-                handleClickInput(e);
-              },
-              children: slotInput
-            }
-          ) })
-        ] }) : /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-          React.isValidElement(leftIcon) ? /* @__PURE__ */ jsxRuntimeExports.jsx(
-            "div",
-            {
-              className: "nut-input-left-icon",
-              onClick: (e) => {
-                handleClickLeftIcon(e);
-              },
-              children: leftIcon
-            }
-          ) : null,
-          label ? /* @__PURE__ */ jsxRuntimeExports.jsx(
-            "div",
-            {
-              className: `nut-input-label ${labelClass}`,
-              style: { width: `${labelWidth}px`, textAlign: labelAlign },
-              children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "label-string", children: [
-                label,
-                colon ? ":" : ""
-              ] })
-            }
-          ) : null,
-          /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "nut-input-value", children: [
-            /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "nut-input-main-con", children: [
-              /* @__PURE__ */ jsxRuntimeExports.jsxs(
-                "div",
-                {
-                  className: "nut-input-inner",
-                  onClick: (e) => {
-                    handleClickInput(e);
-                  },
-                  children: [
-                    type2 === "textarea" ? /* @__PURE__ */ jsxRuntimeExports.jsx(
-                      "textarea",
-                      {
-                        name,
-                        className: "input-text",
-                        ref: inputRef,
-                        style: {
-                          textAlign: inputAlign,
-                          height: `${Number(rows) * 24}px`
-                        },
-                        maxLength: maxlength,
-                        placeholder: inputPlaceholder,
-                        disabled,
-                        readOnly: readonly,
-                        value: inputValue,
-                        autoFocus: autofocus,
-                        onBlur: (e) => {
-                          handleBlur(e);
-                        },
-                        onFocus: (e) => {
-                          handleFocus(e);
-                        },
-                        onInput: (e) => {
-                          handleInput(e);
-                        }
-                      }
-                    ) : /* @__PURE__ */ jsxRuntimeExports.jsx(
-                      "input",
-                      {
-                        name,
-                        className: "input-text",
-                        ref: inputRef,
-                        style: { textAlign: inputAlign },
-                        type: inputType(type2),
-                        maxLength: maxlength,
-                        placeholder: inputPlaceholder,
-                        disabled,
-                        readOnly: readonly,
-                        value: inputValue,
-                        autoFocus: autofocus,
-                        onBlur: (e) => {
-                          handleBlur(e);
-                        },
-                        onFocus: (e) => {
-                          handleFocus(e);
-                        },
-                        onInput: (e) => {
-                          handleInput(e);
-                        }
-                      }
-                    ),
-                    clearable && !readonly && active && inputValue.length > 0 ? /* @__PURE__ */ jsxRuntimeExports.jsx(
-                      "span",
-                      {
-                        className: "nut-input-clear-wrap",
-                        onClick: (e) => handleClear(e),
-                        children: clearIcon || /* @__PURE__ */ jsxRuntimeExports.jsx(x$4, { className: "nut-input-clear" })
-                      }
-                    ) : null
-                  ]
-                }
-              ),
-              React.isValidElement(rightIcon) ? /* @__PURE__ */ jsxRuntimeExports.jsx(
-                "div",
-                {
-                  className: "nut-input-right-icon",
-                  onClick: (e) => {
-                    handleClickRightIcon(e);
-                  },
-                  children: rightIcon
+        className,
+        onChange,
+        onFocus,
+        onClear,
+        formatter,
+        onClick,
+        confirmType,
+        defaultValue,
+        value: _value,
+        ...rest
+      } = {
+        ...defaultProps$T,
+        ...props
+      };
+      const [value, setValue] = usePropsValue({
+        value: props.value,
+        defaultValue: props.defaultValue,
+        finalValue: "",
+        onChange
+      });
+      const inputRef = React.useRef(null);
+      const composingRef = React.useRef(false);
+      const [active, setActive] = React.useState(false);
+      React.useImperativeHandle(ref, () => {
+        return {
+          clear: () => {
+            setValue("");
+          },
+          focus: () => {
+            var _a2;
+            (_a2 = inputRef.current) == null ? void 0 : _a2.focus();
+          },
+          blur: () => {
+            var _a2;
+            (_a2 = inputRef.current) == null ? void 0 : _a2.blur();
+          },
+          get nativeElement() {
+            return inputRef.current;
+          }
+        };
+      });
+      const inputClass = React.useCallback(() => {
+        const classPrefix2 = "nut-input";
+        return [classPrefix2, `${disabled ? `${classPrefix2}-disabled` : ""}`].filter(Boolean).join(" ");
+      }, [disabled]);
+      const updateValue = (value2, trigger = "onChange") => {
+        let val = value2;
+        if (type2 === "number") {
+          val = formatNumber(val, false, true);
+        }
+        if (type2 === "digit") {
+          val = formatNumber(val, true, true);
+        }
+        if (formatter && trigger === formatTrigger) {
+          val = formatter(val);
+        }
+        setValue(val);
+        const eventHandler = props[trigger];
+        if (eventHandler && typeof eventHandler === "function") {
+          eventHandler(val);
+        }
+      };
+      const handleFocus = (event) => {
+        const val = event.target.value;
+        onFocus && onFocus(val);
+        setActive(true);
+      };
+      const handleInput = (value2) => {
+        updateValue(value2, "onChange");
+      };
+      const handleBlur = (event) => {
+        const val = event.target.value;
+        updateValue(val, "onBlur");
+        setActive(false);
+      };
+      const inputType = (type22) => {
+        if (type22 === "digit") {
+          return "text";
+        }
+        if (type22 === "number") {
+          return "tel";
+        }
+        return type22;
+      };
+      return /* @__PURE__ */ jsxRuntimeExports.jsxs(
+        "div",
+        {
+          className: `${inputClass()}  ${className || ""}`,
+          style,
+          onClick: (e) => {
+            onClick && onClick(e);
+          },
+          children: [
+            /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "input",
+              {
+                ...rest,
+                name,
+                className: "nut-input-native",
+                ref: inputRef,
+                style: { textAlign: align },
+                type: inputType(type2),
+                maxLength,
+                placeholder: placeholder || locale.placeholder,
+                disabled,
+                readOnly,
+                value,
+                autoFocus,
+                enterKeyHint: confirmType,
+                onBlur: (e) => {
+                  handleBlur(e);
+                },
+                onFocus: (e) => {
+                  handleFocus(e);
+                },
+                onChange: (e) => {
+                  handleInput(e.currentTarget.value);
+                },
+                onCompositionStart: (e) => {
+                  var _a2;
+                  composingRef.current = true;
+                  (_a2 = props.onCompositionStart) == null ? void 0 : _a2.call(props, e);
+                },
+                onCompositionEnd: (e) => {
+                  var _a2;
+                  composingRef.current = false;
+                  (_a2 = props.onCompositionEnd) == null ? void 0 : _a2.call(props, e);
                 }
-              ) : null,
-              slotButton ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-input-button", children: slotButton }) : null,
-              showWordLimit && maxlength ? /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "nut-input-word-limit", children: [
-                /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "nut-input-word-num", children: inputValue ? inputValue.length : 0 }),
-                "/",
-                maxlength
-              ] }) : null
-            ] }),
-            errorMessage ? /* @__PURE__ */ jsxRuntimeExports.jsx(
-              "div",
+              }
+            ),
+            clearable && !readOnly && active && value.length > 0 ? /* @__PURE__ */ jsxRuntimeExports.jsx(
+              "span",
               {
-                className: "nut-input-error-message",
-                style: {
-                  textAlign: errorMessageAlign
+                style: { display: "flex", alignItems: "center" },
+                onClick: () => {
+                  if (!disabled) {
+                    setValue("");
+                    onClear && onClear("");
+                  }
                 },
-                children: errorMessage
+                children: clearIcon || /* @__PURE__ */ jsxRuntimeExports.jsx(x$4, { className: "nut-input-clear" })
               }
-            ) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", {})
-          ] })
-        ] })
-      }
-    );
-  });
-  Input.defaultProps = defaultProps$U;
+            ) : null
+          ]
+        }
+      );
+    }
+  );
+  Input.defaultProps = defaultProps$T;
   Input.displayName = "NutInput";
-  const defaultProps$T = {
+  const defaultProps$S = {
     ...ComponentDefaults,
     disabled: false,
     min: 1,
@@ -17527,7 +17430,7 @@ Please add \`${key}Action\` when creating your handler.`);
     digits: 0,
     async: false
   };
-  const classPrefix$2 = `nut-inputnumber`;
+  const classPrefix$7 = `nut-inputnumber`;
   const InputNumber = (props) => {
     const {
       children,
@@ -17552,7 +17455,7 @@ Please add \`${key}Action\` when creating your handler.`);
       onChange,
       ...restProps
     } = {
-      ...defaultProps$T,
+      ...defaultProps$S,
       ...props
     };
     const inputRef = React.useRef("");
@@ -17570,8 +17473,8 @@ Please add \`${key}Action\` when creating your handler.`);
     }, []);
     const classes = classNames(
       {
-        [`${classPrefix$2}`]: true,
-        [`${classPrefix$2}--disabled`]: disabled
+        [`${classPrefix$7}`]: true,
+        [`${classPrefix$7}--disabled`]: disabled
       },
       className
     );
@@ -17753,9 +17656,9 @@ Please add \`${key}Action\` when creating your handler.`);
       /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-input-add", children: /* @__PURE__ */ jsxRuntimeExports.jsx(y$3, { className: iconAddClasses, onClick: (e) => addNumber(e) }) })
     ] });
   };
-  InputNumber.defaultProps = defaultProps$T;
+  InputNumber.defaultProps = defaultProps$S;
   InputNumber.displayName = "NutInputNumber";
-  const defaultProps$S = {
+  const defaultProps$R = {
     ...ComponentDefaults,
     activeColor: "",
     closeOnOverlayClick: true,
@@ -17774,7 +17677,7 @@ Please add \`${key}Action\` when creating your handler.`);
       activeColor,
       ...rest
     } = {
-      ...defaultProps$S,
+      ...defaultProps$R,
       ...props
     };
     const menuRef = React.useRef(null);
@@ -17898,9 +17801,9 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     );
   };
-  Menu.defaultProps = defaultProps$S;
+  Menu.defaultProps = defaultProps$R;
   Menu.displayName = "NutMenu";
-  const defaultProps$R = {
+  const defaultProps$Q = {
     ...ComponentDefaults,
     columns: 1,
     direction: "down",
@@ -17930,7 +17833,7 @@ Please add \`${key}Action\` when creating your handler.`);
       parent,
       index
     } = {
-      ...defaultProps$R,
+      ...defaultProps$Q,
       ...props
     };
     const [_showPopup, setShowPopup] = React.useState(show);
@@ -18084,9 +17987,9 @@ Please add \`${key}Action\` when creating your handler.`);
       )
     ] });
   });
-  MenuItem.defaultProps = defaultProps$R;
+  MenuItem.defaultProps = defaultProps$Q;
   MenuItem.displayName = "NutMenuItem";
-  const defaultProps$Q = {
+  const defaultProps$P = {
     confirmText: "",
     title: "",
     visible: false,
@@ -18318,14 +18221,14 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     ) });
   };
-  NumberKeyboard.defaultProps = defaultProps$Q;
+  NumberKeyboard.defaultProps = defaultProps$P;
   NumberKeyboard.displayName = "NutNumberKeyboard";
   const radioContext = {
     onChange: (val) => {
     }
   };
   const RadioContext = React.createContext(radioContext);
-  const defaultProps$P = {
+  const defaultProps$O = {
     value: null,
     textPosition: "right",
     onChange: (value) => {
@@ -18335,7 +18238,7 @@ Please add \`${key}Action\` when creating your handler.`);
   };
   const RadioGroup = React.forwardRef(
     (props, ref) => {
-      const { children } = { ...defaultProps$P, ...props };
+      const { children } = { ...defaultProps$O, ...props };
       cn("RadioGroup");
       const {
         className,
@@ -18412,9 +18315,9 @@ Please add \`${key}Action\` when creating your handler.`);
       );
     }
   );
-  RadioGroup.defaultProps = defaultProps$P;
+  RadioGroup.defaultProps = defaultProps$O;
   RadioGroup.displayName = "NutRadioGroup";
-  const defaultProps$O = {
+  const defaultProps$N = {
     ...ComponentDefaults,
     className: "",
     style: {},
@@ -18431,7 +18334,7 @@ Please add \`${key}Action\` when creating your handler.`);
   };
   const Radio = (props) => {
     const { children } = {
-      ...defaultProps$O,
+      ...defaultProps$N,
       ...props
     };
     const {
@@ -18531,7 +18434,7 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     );
   };
-  Radio.defaultProps = defaultProps$O;
+  Radio.defaultProps = defaultProps$N;
   Radio.displayName = "NutRadio";
   Radio.RadioGroup = RadioGroup;
   const fullClone = {
@@ -18780,7 +18683,7 @@ Please add \`${key}Action\` when creating your handler.`);
     },
     loading(msg, option = {}) {
       errorMsg$1(msg);
-      return notice$1({ msg, icon: /* @__PURE__ */ jsxRuntimeExports.jsx(k$2, {}), type: "loading", ...option });
+      return notice$1({ msg, icon: /* @__PURE__ */ jsxRuntimeExports.jsx(k$3, {}), type: "loading", ...option });
     },
     warn(msg, option = {}) {
       errorMsg$1(msg);
@@ -18797,7 +18700,7 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     }
   };
-  const defaultProps$N = {
+  const defaultProps$M = {
     range: false,
     hiddenRange: false,
     hiddenTag: false,
@@ -18833,8 +18736,8 @@ Please add \`${key}Action\` when creating your handler.`);
       minDesc,
       maxDesc,
       curValueDesc
-    } = { ...defaultProps$N, ...props };
-    let { min, max, step } = { ...defaultProps$N, ...props };
+    } = { ...defaultProps$M, ...props };
+    let { min, max, step } = { ...defaultProps$M, ...props };
     min = Number(min);
     max = Number(max);
     step = Number(step);
@@ -19173,9 +19076,9 @@ Please add \`${key}Action\` when creating your handler.`);
       !hiddenRange ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "max", children: maxDesc || +max }) : null
     ] });
   };
-  Range.defaultProps = defaultProps$N;
+  Range.defaultProps = defaultProps$M;
   Range.displayName = "NutRange";
-  const defaultProps$M = {
+  const defaultProps$L = {
     ...ComponentDefaults,
     count: 5,
     min: 0,
@@ -19200,7 +19103,7 @@ Please add \`${key}Action\` when creating your handler.`);
       allowHalf,
       onChange
     } = {
-      ...defaultProps$M,
+      ...defaultProps$L,
       ...props
     };
     const classPrefix2 = "nut-rate";
@@ -19285,9 +19188,9 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     );
   };
-  Rate.defaultProps = defaultProps$M;
+  Rate.defaultProps = defaultProps$L;
   Rate.displayName = "NutRate";
-  const defaultProps$L = {
+  const defaultProps$K = {
     ...ComponentDefaults,
     placeholder: "",
     shape: "square",
@@ -19335,7 +19238,7 @@ Please add \`${key}Action\` when creating your handler.`);
       onClickRightinIcon,
       onClickRightoutIcon
     } = {
-      ...defaultProps$L,
+      ...defaultProps$K,
       ...props
     };
     const alignClass = `${align}`;
@@ -19518,9 +19421,9 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     );
   };
-  SearchBar.defaultProps = defaultProps$L;
+  SearchBar.defaultProps = defaultProps$K;
   SearchBar.displayName = "NutSearchBar";
-  const defaultProps$K = {
+  const defaultProps$J = {
     ...ComponentDefaults,
     title: "",
     description: "",
@@ -19684,9 +19587,9 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     ) });
   };
-  ShortPassword.defaultProps = defaultProps$K;
+  ShortPassword.defaultProps = defaultProps$J;
   ShortPassword.displayName = "NutShortPassword";
-  const defaultProps$J = {
+  const defaultProps$I = {
     type: "png",
     lineWidth: 2,
     strokeStyle: "#000",
@@ -19707,7 +19610,7 @@ Please add \`${key}Action\` when creating your handler.`);
       onClear,
       ...rest
     } = {
-      ...defaultProps$J,
+      ...defaultProps$I,
       ...props
     };
     const b = cn("signature");
@@ -19821,9 +19724,9 @@ Please add \`${key}Action\` when creating your handler.`);
       )
     ] });
   };
-  Signature.defaultProps = defaultProps$J;
+  Signature.defaultProps = defaultProps$I;
   Signature.displayName = "NutSignature";
-  const defaultProps$I = {
+  const defaultProps$H = {
     ...ComponentDefaults,
     disabled: false,
     activeText: "",
@@ -19840,7 +19743,7 @@ Please add \`${key}Action\` when creating your handler.`);
       style,
       onChange
     } = {
-      ...defaultProps$I,
+      ...defaultProps$H,
       ...props
     };
     const classPrefix2 = "nut-switch";
@@ -19862,9 +19765,9 @@ Please add \`${key}Action\` when creating your handler.`);
       activeText && /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: value ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix2}__label open`, children: activeText }) : /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix2}__label close`, children: inactiveText }) })
     ] }) });
   };
-  Switch.defaultProps = defaultProps$I;
+  Switch.defaultProps = defaultProps$H;
   Switch.displayName = "NutSwitch";
-  const defaultProps$H = {
+  const defaultProps$G = {
     defaultValue: "",
     textAlign: "left",
     limitshow: false,
@@ -19892,7 +19795,7 @@ Please add \`${key}Action\` when creating your handler.`);
       onChange,
       onBlur,
       onFocus
-    } = { ...defaultProps$H, ...props };
+    } = { ...defaultProps$G, ...props };
     const textareaBem = cn("textarea");
     const [inputValue, SetInputValue] = React.useState("");
     const textareaRef = React.useRef(null);
@@ -20007,9 +19910,9 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     );
   };
-  TextArea.defaultProps = defaultProps$H;
+  TextArea.defaultProps = defaultProps$G;
   TextArea.displayName = "NutTextArea";
-  const defaultProps$G = {
+  const defaultProps$F = {
     ...ComponentDefaults,
     percent: 0,
     showText: false,
@@ -20028,7 +19931,7 @@ Please add \`${key}Action\` when creating your handler.`);
       children,
       ...rest
     } = {
-      ...defaultProps$G,
+      ...defaultProps$F,
       ...props
     };
     const classPrefix2 = "nut-progress";
@@ -20065,7 +19968,7 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     ) }) }) });
   };
-  Progress.defaultProps = defaultProps$G;
+  Progress.defaultProps = defaultProps$F;
   Progress.displayName = "NutProgress";
   class UploadOptions {
     constructor() {
@@ -20162,7 +20065,7 @@ Please add \`${key}Action\` when creating your handler.`);
       done();
     }
   };
-  const defaultProps$F = {
+  const defaultProps$E = {
     ...ComponentDefaults,
     url: "",
     maxCount: 1,
@@ -20244,7 +20147,7 @@ Please add \`${key}Action\` when creating your handler.`);
       beforeXhrUpload,
       beforeDelete,
       ...restProps
-    } = { ...defaultProps$F, ...props };
+    } = { ...defaultProps$E, ...props };
     const [fileList, setFileList] = React.useState(defaultValue || []);
     const [uploadQueue, setUploadQueue] = React.useState([]);
     React.useEffect(() => {
@@ -20502,7 +20405,7 @@ Please add \`${key}Action\` when creating your handler.`);
                 ),
                 item.status === "ready" ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-uploader__preview__progress", children: /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-uploader__preview__progress__msg", children: item.message }) }) : item.status !== "success" && /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "nut-uploader__preview__progress", children: [
                   item.failIcon !== " " && item.loadingIcon !== " " && (item.status === "error" ? item.failIcon || /* @__PURE__ */ jsxRuntimeExports.jsx(x$8, { color: "#fff" }) : item.loadingIcon || /* @__PURE__ */ jsxRuntimeExports.jsx(
-                    k$2,
+                    k$3,
                     {
                       className: "nut-icon-loading",
                       color: "#fff"
@@ -20615,9 +20518,9 @@ Please add \`${key}Action\` when creating your handler.`);
     ] });
   };
   const Uploader = React.forwardRef(InternalUploader);
-  Uploader.defaultProps = defaultProps$F;
+  Uploader.defaultProps = defaultProps$E;
   Uploader.displayName = "NutUploader";
-  const defaultProps$E = {
+  const defaultProps$D = {
     cancelText: "",
     optionTag: "name",
     optionSubTag: "subname",
@@ -20651,7 +20554,7 @@ Please add \`${key}Action\` when creating your handler.`);
       className,
       style,
       ...rest
-    } = { ...defaultProps$E, ...props };
+    } = { ...defaultProps$D, ...props };
     const b = cn("actionsheet");
     const isHighlight = (item) => {
       return props.chooseTagValue && props.chooseTagValue === item[props.optionTag || "name"] ? props.color : "$dark1";
@@ -20696,52 +20599,8 @@ Please add \`${key}Action\` when creating your handler.`);
       }
     );
   };
-  ActionSheet.defaultProps = defaultProps$E;
+  ActionSheet.defaultProps = defaultProps$D;
   ActionSheet.displayName = "NutActionSheet";
-  const defaultProps$D = {
-    ...ComponentDefaults,
-    value: "",
-    dot: false,
-    max: 99,
-    top: "0",
-    right: "5",
-    color: ""
-  };
-  const Badge = (props) => {
-    const { className, style, value, max, children, dot, top, right, color } = {
-      ...defaultProps$D,
-      ...props
-    };
-    const classPrefix2 = "nut-badge";
-    const classes = classNames(classPrefix2, className);
-    const contentClasses = classNames(
-      { [`${classPrefix2}__dot`]: dot },
-      `${classPrefix2}__content`,
-      `${classPrefix2}__sup`
-    );
-    function content() {
-      if (dot || typeof value === "object")
-        return null;
-      if (typeof value === "number" && typeof max === "number") {
-        return max < value ? `${max}+` : value;
-      }
-      return value;
-    }
-    const getStyle = () => {
-      const style2 = {};
-      style2.top = `${Number(top) || parseFloat(top) || 0}px`;
-      style2.right = `${Number(right) || parseFloat(right) || 0}px`;
-      style2.background = color;
-      return style2;
-    };
-    return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: classes, style, children: [
-      typeof value === "object" && value && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix2}__icon`, children: value }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { children }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: contentClasses, style: getStyle(), children: content() })
-    ] });
-  };
-  Badge.defaultProps = defaultProps$D;
-  Badge.displayName = "NutBadge";
   function ConfirmDialog(props) {
     return /* @__PURE__ */ jsxRuntimeExports.jsx(Dialog, { ...props, children: props.content });
   }
@@ -21114,25 +20973,29 @@ Please add \`${key}Action\` when creating your handler.`);
     network: "https://static-ftcms.jd.com/p/files/61a9e31de7dcdbcc0ce62734.png"
   };
   const defaultProps$A = {
+    ...ComponentDefaults,
     description: "",
-    image: "empty",
     imageSize: "",
-    className: ""
+    status: "empty"
   };
+  const classPrefix$6 = `nut-empty`;
   const Empty = (props) => {
     const { locale } = useConfig();
-    const { image, imageSize, description, children, className, ...rest } = {
+    const {
+      image,
+      imageSize,
+      description,
+      children,
+      className,
+      status,
+      ...rest
+    } = {
       ...defaultProps$A,
       ...props
     };
     const [imgStyle, setImgStyle] = React.useState({});
-    const b = cn("empty");
-    let imageNode = image;
-    if (typeof image === "string") {
-      const isHttpUrl = image.startsWith("https://") || image.startsWith("http://") || image.startsWith("//");
-      const imageUrl = isHttpUrl ? image : defaultStatus[image];
-      imageNode = /* @__PURE__ */ jsxRuntimeExports.jsx("img", { className: "img", src: imageUrl, alt: "empty" });
-    }
+    const imageUrl = image || defaultStatus[status];
+    const imageNode = typeof imageUrl === "string" ? /* @__PURE__ */ jsxRuntimeExports.jsx("img", { className: "img", src: imageUrl, alt: "empty" }) : imageUrl;
     React.useEffect(() => {
       setImgStyle(() => {
         if (!imageSize) {
@@ -21150,9 +21013,9 @@ Please add \`${key}Action\` when creating your handler.`);
         };
       });
     }, [imageSize]);
-    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${b()} ${className}`, ...rest, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: b("image"), style: imgStyle, children: imageNode }),
-      typeof description === "string" ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: b("description"), children: description || locale.noData }) : { description },
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$6} ${className}`, ...rest, children: /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$6}__image`, style: imgStyle, children: imageNode }),
+      typeof description === "string" ? /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: `${classPrefix$6}__description`, children: description || locale.noData }) : description,
       children
     ] }) });
   };
@@ -22341,29 +22204,30 @@ Please add \`${key}Action\` when creating your handler.`);
   const defaultProps$v = {
     ...ComponentDefaults,
     size: "",
+    shape: "round",
     icon: "",
-    bgColor: "#eee",
+    background: "#eee",
     color: "#666",
-    prefixCls: "nut-avatar",
-    url: "",
+    fit: "cover",
+    src: "",
     alt: ""
   };
+  const classPrefix$5 = `nut-avatar`;
   const Avatar = (props) => {
     var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
     const {
       children,
-      prefixCls: prefixCls2,
       size,
       shape,
-      bgColor,
+      background,
       color,
-      url,
+      src,
       alt,
       icon,
+      fit,
       className,
       style,
-      activeAvatar,
-      onActiveAvatar,
+      onClick,
       onError,
       ...rest
     } = {
@@ -22375,24 +22239,23 @@ Please add \`${key}Action\` when creating your handler.`);
     const [avatarIndex, setAvatarIndex] = React.useState(1);
     const avatarRef = React.useRef(null);
     const parent = React.useContext(AvatarContext);
-    const b = cn("avatar");
+    const sizeValue = ["large", "normal", "small"];
     const classes = classNames({
-      [`nut-avatar-${size || ((_a2 = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _a2.size) || "normal"}`]: true,
-      [`nut-avatar-${shape || ((_b = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _b.shape) || "round"}`]: true
+      [`nut-avatar-${((_a2 = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _a2.size) || size || "normal"}`]: true,
+      [`nut-avatar-${((_b = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _b.shape) || shape}`]: true
     });
-    const cls = classNames(b(""), classes, className);
-    const sizeValue = ["large", "normal", "small"];
+    const cls = classNames(classPrefix$5, classes, className);
     const styles = {
       width: sizeValue.indexOf(size) > -1 ? "" : `${size}px`,
       height: sizeValue.indexOf(size) > -1 ? "" : `${size}px`,
-      backgroundColor: `${bgColor}`,
+      backgroundColor: `${background}`,
       color: `${color}`,
-      marginLeft: avatarIndex !== 1 && ((_c = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _c.span) ? `${(_d = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _d.span}px` : "",
-      zIndex: ((_e = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _e.zIndex) === "right" ? `${Math.abs(maxSum - avatarIndex)}` : "",
+      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
     };
     const maxStyles = {
-      backgroundColor: `${(_f = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _f.maxBgColor}`,
+      backgroundColor: `${(_f = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _f.maxBackground}`,
       color: `${(_g = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _g.maxColor}`
     };
     React.useEffect(() => {
@@ -22410,23 +22273,22 @@ Please add \`${key}Action\` when creating your handler.`);
         }
       }
       const index = Number((_b2 = (_a3 = avatarRef == null ? void 0 : avatarRef.current) == null ? void 0 : _a3.dataset) == null ? void 0 : _b2.index);
-      const maxCount = (_c2 = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _c2.maxCount;
+      const maxCount = (_c2 = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _c2.max;
       setMaxSum(children2.length);
       setAvatarIndex(index);
       if (index === children2.length && index !== maxCount && children2.length > maxCount) {
         setShowMax(true);
       }
     };
-    const errorEvent = (e) => {
+    const errorEvent = () => {
       if (props.onError) {
-        props.onError(e);
+        props.onError();
       }
     };
     const clickAvatar = (e) => {
-      activeAvatar && activeAvatar(e);
-      onActiveAvatar && onActiveAvatar(e);
+      onClick && onClick(e);
     };
-    return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: (showMax || !((_h = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _h.maxCount) || avatarIndex <= ((_i = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _i.maxCount)) && /* @__PURE__ */ jsxRuntimeExports.jsxs(
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(jsxRuntimeExports.Fragment, { children: (showMax || !((_h = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _h.max) || avatarIndex <= ((_i = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _i.max)) && /* @__PURE__ */ jsxRuntimeExports.jsxs(
       "div",
       {
         className: cls,
@@ -22435,13 +22297,14 @@ Please add \`${key}Action\` when creating your handler.`);
         onClick: clickAvatar,
         ref: avatarRef,
         children: [
-          (!((_j = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _j.maxCount) || avatarIndex <= ((_k = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _k.maxCount)) && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
-            url && /* @__PURE__ */ jsxRuntimeExports.jsx(
-              "img",
+          (!((_j = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _j.max) || avatarIndex <= ((_k = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _k.max)) && /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
+            src && /* @__PURE__ */ jsxRuntimeExports.jsx(
+              Image$1,
               {
                 className: "avatar-img",
-                src: url,
+                src,
                 alt,
+                style: { objectFit: fit },
                 onError: errorEvent
               }
             ),
@@ -22449,9 +22312,10 @@ Please add \`${key}Action\` when creating your handler.`);
               ...icon.props,
               className: `${icon.props.className || ""} icon`
             }) : null,
-            children && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text", children })
+            children && /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: "text", children }),
+            !src && !icon && !children && /* @__PURE__ */ jsxRuntimeExports.jsx(k$2, { className: "icon" })
           ] }),
-          showMax && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text", children: ((_l = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _l.maxContent) ? (_m = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _m.maxContent : `+ ${avatarIndex - ((_n = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _n.maxCount)}` })
+          showMax && /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "text", children: ((_l = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _l.maxContent) ? (_m = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _m.maxContent : `+ ${avatarIndex - ((_n = parent == null ? void 0 : parent.propAvatarGroup) == null ? void 0 : _n.max)}` })
         ]
       }
     ) });
@@ -22521,7 +22385,7 @@ Please add \`${key}Action\` when creating your handler.`);
           Avatar,
           {
             className: avatarClass,
-            bgColor: "rgb(239, 239, 239)",
+            background: "rgb(239, 239, 239)",
             shape: avatarShape,
             style: getStyle()
           }
@@ -22554,9 +22418,7 @@ Please add \`${key}Action\` when creating your handler.`);
     }
   }
   const defaultProps$t = {
-    name: "",
-    leftWidth: 0,
-    rightWidth: 0
+    name: ""
   };
   const Swipe = React.forwardRef((props, instanceRef) => {
     const swipeBem = cn("swipe");
@@ -22578,14 +22440,8 @@ Please add \`${key}Action\` when creating your handler.`);
       transform: `translate3d(${state.offset}px, 0, 0)`,
       transitionDuration: state.dragging ? "0s" : ".6s"
     };
-    const leftWidth = React.useMemo(
-      () => props.leftWidth ? props.leftWidth : actionWidth.left,
-      [props.leftWidth, actionWidth.left]
-    );
-    const rightWidth = React.useMemo(
-      () => props.rightWidth ? props.rightWidth : actionWidth.right,
-      [props.rightWidth, actionWidth.right]
-    );
+    const leftWidth = actionWidth.left;
+    const rightWidth = actionWidth.right;
     const onTouchStart = (event) => {
       if (!props.disabled) {
         startOffset.current = state.offset;
@@ -22749,7 +22605,7 @@ Please add \`${key}Action\` when creating your handler.`);
     onClick: (event) => {
     }
   };
-  const classPrefix$1 = `nut-animate`;
+  const classPrefix$4 = `nut-animate`;
   const Animate = (props) => {
     const { className, type: type2, action, loop: loop2, onClick, children, ...rest } = {
       ...defaultProps$s,
@@ -22758,7 +22614,7 @@ Please add \`${key}Action\` when creating your handler.`);
     const [clicked, setClicked] = React.useState(false);
     const classes = classNames({
       "nut-ani-container": true,
-      [`${classPrefix$1}-${type2}`]: action === "initial" || clicked ? type2 : false,
+      [`${classPrefix$4}-${type2}`]: action === "initial" || clicked ? type2 : false,
       loop: loop2
     });
     const cls = classNames(classes, className);
@@ -23130,22 +22986,20 @@ Please add \`${key}Action\` when creating your handler.`);
   Audio.defaultProps = defaultProps$p;
   Audio.displayName = "NutAudio";
   const defaultProps$o = {
+    ...ComponentDefaults,
     maxContent: "",
-    maxCount: "",
-    maxBgColor: "#eee",
+    max: "",
+    maxBackground: "#eee",
     maxColor: "#666",
-    size: "",
-    shape: "",
-    span: "-8",
-    zIndex: "left"
+    gap: "-8",
+    level: "left"
   };
+  const classPrefix$3 = `nut-avatar-group`;
   const AvatarGroup = (props) => {
-    useConfig();
     const propAvatarGroup = { ...defaultProps$o, ...props };
     const { className, style, children } = propAvatarGroup;
     const avatarGroupRef = React.useRef(null);
-    const b = cn("avatar-group");
-    const cls = classNames(b(""), className);
+    const cls = classNames(classPrefix$3, className);
     const parentAvatar = {
       propAvatarGroup,
       avatarGroupRef
@@ -23155,24 +23009,26 @@ Please add \`${key}Action\` when creating your handler.`);
   AvatarGroup.defaultProps = defaultProps$o;
   AvatarGroup.displayName = "NutAvatarGroup";
   const defaultProps$n = {
+    ...ComponentDefaults,
     strokeWidth: 5,
     radius: 50,
     strokeLinecap: "round",
-    circleColor: "",
-    pathColor: "",
+    color: "#fa2c19",
+    background: "#e5e9f2",
     clockwise: true
   };
+  const classPrefix$2 = `nut-circleprogress`;
   const CircleProgress = (props) => {
     var _a2;
     const {
       children,
-      progress,
+      percent,
       className,
       radius,
-      pathColor,
       clockwise,
-      circleColor,
       strokeWidth,
+      color,
+      background,
       style,
       strokeLinecap,
       ...restProps
@@ -23180,8 +23036,7 @@ Please add \`${key}Action\` when creating your handler.`);
       ...defaultProps$n,
       ...props
     };
-    const b = cn("circleprogress");
-    const classes = classNames(className, b(""));
+    const classes = classNames(className, classPrefix$2);
     const refRandomId = Math.random().toString(36).slice(-8);
     const styles = {
       height: `${Number(radius) * 2}px`,
@@ -23189,13 +23044,13 @@ Please add \`${key}Action\` when creating your handler.`);
       ...style
     };
     const pathStyle = {
-      stroke: pathColor
+      stroke: background
     };
     const hoverStyle = () => {
       const perimeter = 283;
-      const offset = perimeter * Number(progress) / 100;
+      const offset = perimeter * Number(percent) / 100;
       return {
-        stroke: isObject(circleColor) ? `url(#${refRandomId})` : circleColor,
+        stroke: isObject(color) ? `url(#${refRandomId})` : color,
         strokeDasharray: `${offset}px ${perimeter}px`
       };
     };
@@ -23203,16 +23058,13 @@ Please add \`${key}Action\` when creating your handler.`);
       const isWise = clockwise ? 1 : 0;
       return `M 50 50 m -45 0 a 45 45 0 1 ${isWise} 90 0  a 45 45 0 1 ${isWise} -90 0`;
     };
-    const hoverColor = () => {
-      return isObject(circleColor) ? `url(#${refRandomId})` : circleColor;
-    };
     const stop2 = () => {
-      if (!isObject(circleColor)) {
+      if (!isObject(props.color)) {
         return;
       }
-      const color = circleColor;
-      const colorArr = Object.keys(color).sort(
-        (a2, b2) => parseFloat(a2) - parseFloat(b2)
+      const color2 = props.color;
+      const colorArr = Object.keys(color2).sort(
+        (a2, b) => parseFloat(a2) - parseFloat(b)
       );
       const stopArr = [];
       colorArr.map((item) => {
@@ -23221,7 +23073,7 @@ Please add \`${key}Action\` when creating your handler.`);
           value: ""
         };
         obj.key = item;
-        obj.value = color[item];
+        obj.value = color2[item];
         stopArr.push(obj);
       });
       return stopArr;
@@ -23235,8 +23087,8 @@ Please add \`${key}Action\` when creating your handler.`);
           "path",
           {
             className: "nut-circleprogress-path",
-            style: pathStyle,
             d: path(),
+            style: pathStyle,
             fill: "none",
             strokeWidth
           }
@@ -23248,17 +23100,13 @@ Please add \`${key}Action\` when creating your handler.`);
             style: hoverStyle(),
             d: path(),
             fill: "none",
-            stroke: hoverColor(),
             strokeLinecap,
             transform: "rotate(90,50,50)",
             strokeWidth
           }
         )
       ] }),
-      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-circleprogress-text", children: children || /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
-        progress,
-        "%"
-      ] }) })
+      /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-circleprogress-text", children })
     ] });
   };
   CircleProgress.defaultProps = defaultProps$n;
@@ -23659,6 +23507,7 @@ Please add \`${key}Action\` when creating your handler.`);
   CountDown.defaultProps = defaultProps$k;
   CountDown.displayName = "NutCountDown";
   const defaultProps$j = {
+    ...ComponentDefaults,
     content: "",
     direction: "end",
     rows: 1,
@@ -23667,12 +23516,13 @@ Please add \`${key}Action\` when creating your handler.`);
     symbol: "...",
     lineHeight: "20"
   };
+  const classPrefix$1 = `nut-ellipsis`;
   const Ellipsis = (props) => {
     var _a2, _b;
-    useConfig();
     const {
       children,
       content,
+      className,
       direction,
       rows,
       expandText,
@@ -23680,7 +23530,8 @@ Please add \`${key}Action\` when creating your handler.`);
       symbol,
       lineHeight,
       onClick,
-      onChange
+      onChange,
+      ...rest
     } = { ...defaultProps$j, ...props };
     let container = null;
     let maxHeight = 0;
@@ -23688,10 +23539,8 @@ Please add \`${key}Action\` when creating your handler.`);
     const [expanded, setExpanded] = React.useState(false);
     const ellipsis = React.useRef();
     const root2 = React.useRef(null);
+    const classes = classNames(classPrefix$1, className);
     React.useLayoutEffect(() => {
-      createContainer();
-    }, []);
-    React.useEffect(() => {
       if (content) {
         createContainer();
       }
@@ -23809,7 +23658,7 @@ Please add \`${key}Action\` when creating your handler.`);
     const handleClick2 = () => {
       onClick && onClick();
     };
-    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: "nut-ellipsis", onClick: handleClick2, ref: root2, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
+    return /* @__PURE__ */ jsxRuntimeExports.jsx("div", { className: classes, onClick: handleClick2, ref: root2, ...rest, children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { children: [
       !exceeded ? content : null,
       exceeded && !expanded ? /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
         (_a2 = ellipsis.current) == null ? void 0 : _a2.leading,