@react-form-builder/components-rsuite 2.0.0 → 2.2.0

package/dist/index.js

@@ -1,5 +1,5 @@
-import { number as J, oneOf as I, color as U, readOnly as le, string as s, boolean as a, event as i, array as y, toLabeledValues as X, define as h, date as q, node as x, containerStyles as oA, useComponentData as aA, isString as se, time as RA, timeFormat as AA, someOf as ie, ComponentStore as GA, nodeArray as de, useBuilderContext as bA, BiDi as T, loadResource as hA, unloadResource as mA, createView as ce } from "@react-form-builder/core";
-import { jsx as r, jsxs as v, Fragment as L } from "@emotion/react/jsx-runtime";
+import { number as J, oneOf as u, color as U, readOnly as le, string as s, boolean as a, event as i, array as y, toLabeledValues as X, define as h, date as q, node as x, containerStyles as oA, useComponentData as aA, isString as se, time as RA, timeFormat as AA, someOf as ie, ComponentStore as GA, nodeArray as de, useBuilderContext as bA, BiDi as T, loadResource as hA, unloadResource as mA, createView as ce } from "@react-form-builder/core";
+import { jsx as r, jsxs as S, Fragment as L } from "@emotion/react/jsx-runtime";
 import { createElement as fe } from "@emotion/react";
 import { Table as he, Checkbox as wA, Input as _, Breadcrumb as EA, Button as eA, Calendar as MA, Panel as ue, Form as K, DatePicker as HA, Loader as JA, InputPicker as yA, Grid as ve, Row as Ie, Col as cA, InputGroup as PA, Header as Se, Content as ke, Footer as pe, Sidebar as Re, CustomProvider as Ee, Nav as tA, Message as Me, Progress as DA, RadioGroup as Pe, Radio as je, TagPicker as xe, Toggle as Ce, Whisper as Ge, Tooltip as be, Uploader as me, Steps as LA, ButtonToolbar as we } from "rsuite";
 import C from "@emotion/styled";
@@ -10,7 +10,7 @@ import { Visible as Le, EyeClose as Ne, Search as ze } from "@rsuite/icons";
 import { arEG as Qe, deDE as Ze, enUS as zA, itIT as We, frFR as Oe, esES as ge, zhCN as Ye, daDK as Ue, enGB as Te, esAR as Fe, fiFI as Xe, huHU as Ke, kkKZ as Be, koKR as Ve, nlNL as qe, ptBR as _e, svSE as $e, trTR as At, zhTW as et, jaJP as tt } from "rsuite/esm/locales/index.js";
 import { NumericFormat as nt, PatternFormat as rt } from "react-number-format";
 import ot from "signature_pad";
-const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA = I(
+const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA = u(
   "bottomStart",
   "bottomEnd",
   "topStart",
@@ -19,7 +19,7 @@ const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA
   "rightStart",
   "leftEnd",
   "rightEnd"
-), B = I(
+), B = u(
   "xs",
   "sm",
   "md",
@@ -30,9 +30,9 @@ const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA
   "Medium",
   "Large"
 ).default("md"), lt = U.named("Background"), vA = {
-  textAlign: I("start", "center", "end").default("start").radio().hinted("Text alignment"),
+  textAlign: u("start", "center", "end").default("start").radio().hinted("Text alignment"),
   fontSize: F.default(14).hinted("Font size"),
-  fontWeight: I("lighter", "normal", "bold").default("normal"),
+  fontWeight: u("lighter", "normal", "bold").default("normal"),
   color: U
 }, D = le.hinted("Read only component").default(!1), IA = {
   placeholder: s.hinted("Input placeholder"),
@@ -40,9 +40,9 @@ const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA
   disabled: a.hinted("Disabled component").default(!1),
   readOnly: D,
   onChange: i
-}, QA = I("h1", "h2", "h3", "h4", "h5", "h6").default("h4").hinted("Header level"), ZA = {
+}, QA = u("h1", "h2", "h3", "h4", "h5", "h6").default("h4").hinted("Header level"), ZA = {
   activeKey: s.hinted("Active key, corresponding to one of items value").default("Item1"),
-  appearance: I("default", "tabs", "subtle").default("default").hinted("A navigation can have different appearances"),
+  appearance: u("default", "tabs", "subtle").default("default").hinted("A navigation can have different appearances"),
   items: y.default(X(["Item1", "Item2", "Item3"])),
   justified: a.hinted("Justified navigation").default(!1),
   onSelect: i,
@@ -68,7 +68,7 @@ const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA
   onCreate: i,
   onChange: i,
   onSearch: i
-}, st = I("start", "center", "end").default("start").radio(), WA = I("red", "orange", "yellow", "green", "cyan", "blue", "violet"), { Cell: it } = he, OA = C(it)`
+}, st = u("start", "center", "end").default("start").radio(), WA = u("red", "orange", "yellow", "green", "cyan", "blue", "violet"), { Cell: it } = he, OA = C(it)`
   padding: 0;
 
   & .rs-table-cell-content {
@@ -80,23 +80,23 @@ const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA
     top: 6px;
   }
 `, ct = ({ rowData: A, dataKey: e, rowIndex: t, onChange: n, ...o }) => {
-  const l = (d, c) => {
-    A[e] = c, n == null || n(c, e, t);
+  const l = (c, d) => {
+    A[e] = d, n == null || n(d, e, t);
   };
   return /* @__PURE__ */ r(OA, { ...o, children: /* @__PURE__ */ r(dt, { inline: !0, checked: A[e] ?? !1, onChange: l }) });
 }, Z = ({ rowData: A, dataKey: e, rowIndex: t, onChange: n, ...o }) => {
-  const l = A[e] ?? "", d = m((c) => {
-    A[e] = c, n == null || n(c, e, t);
+  const l = A[e] ?? "", c = m((d) => {
+    A[e] = d, n == null || n(d, e, t);
   }, [e, n, A, t]);
-  return /* @__PURE__ */ r(OA, { ...o, children: /* @__PURE__ */ r(_, { value: l, onChange: d, size: "sm" }) });
+  return /* @__PURE__ */ r(OA, { ...o, children: /* @__PURE__ */ r(_, { value: l, onChange: c, size: "sm" }) });
 }, ft = (A) => A.map((e) => ({ title: e, href: e })), ht = [
   { name: "title", input: Z },
   { name: "href", title: "Url", input: Z },
   { name: "active", input: ct }
 ], ut = ({ items: A, onItemClick: e, ...t }) => /* @__PURE__ */ r(EA, { ...t, style: { display: "flex" }, children: A == null ? void 0 : A.map(
   (n) => {
-    const { title: o = "", ...l } = n, d = () => e == null ? void 0 : e(n);
-    return /* @__PURE__ */ fe(EA.Item, { ...l, onClick: d, key: o }, o);
+    const { title: o = "", ...l } = n, c = () => e == null ? void 0 : e(n);
+    return /* @__PURE__ */ fe(EA.Item, { ...l, onClick: c, key: o }, o);
   }
 ) }), vt = h(ut, "RsBreadcrumb").name("Breadcrumb").props({
   separator: s.default("/"),
@@ -105,10 +105,10 @@ const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA
   onItemClick: i,
   onExpand: i
 }).css({
-  justifyContent: I("left", "center", "right").default("left").radio().named("Alignment")
+  justifyContent: u("left", "center", "right").default("left").radio().named("Alignment")
 }), It = h(eA, "RsButton").name("Button").props({
   active: a.hinted("A button can show it is currently the active user selection").default(!1),
-  appearance: I("default", "primary", "link", "subtle", "ghost").default("default").hinted("A button can have different appearances"),
+  appearance: u("default", "primary", "link", "subtle", "ghost").default("default").hinted("A button can have different appearances"),
   children: s.required.named("Content").default("Button"),
   color: WA,
   disabled: a.hinted("A button can show it is currently unable to be interacted with").default(!1),
@@ -135,7 +135,7 @@ const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA
   backgroundColor: lt,
   textAlign: pt,
   color: Rt
-}), Mt = ({ header: A, title: e, headerSize: t, ...n }) => /* @__PURE__ */ r(ue, { header: /* @__PURE__ */ v(L, { children: [
+}), Mt = ({ header: A, title: e, headerSize: t, ...n }) => /* @__PURE__ */ r(ue, { header: /* @__PURE__ */ S(L, { children: [
   !!e && /* @__PURE__ */ r(gA, { headerSize: t, content: e }),
   A
 ] }), ...n }), Pt = h(Mt, "RsCard").name("Card").props({
@@ -209,14 +209,14 @@ const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA
   }
   return A;
 }, Nt = ({ label: A, value: e, className: t, format: n, defaultValue: o, ...l }) => {
-  const d = Q(() => YA(n), [n]), c = W(l, "onClean"), f = Q(() => Lt(e), [e]);
-  return /* @__PURE__ */ v(N, { className: t, children: [
+  const c = Q(() => YA(n), [n]), d = W(l, "onClean"), f = Q(() => Lt(e), [e]);
+  return /* @__PURE__ */ S(N, { className: t, children: [
     /* @__PURE__ */ r(K.ControlLabel, { children: A }),
-    /* @__PURE__ */ r(HA, { ...l, value: f ?? o ?? null, format: d, onClean: c })
+    /* @__PURE__ */ r(HA, { ...l, value: f ?? o ?? null, format: c, onClean: d })
   ] });
 }, zt = h(Nt, "RsDatePicker").name("DatePicker").props({
   label: s.default("Date"),
-  appearance: I("default", "subtle").hinted("Set picker appearance"),
+  appearance: u("default", "subtle").hinted("Set picker appearance"),
   calendarDefaultDate: q.hinted("Calendar panel default presentation date and time"),
   cleanable: a.hinted("Whether the selected value can be cleared").default(!1),
   defaultOpen: a.hinted("Default value of open property").default(!1),
@@ -258,7 +258,7 @@ const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA
   size: B.hinted("A picker size"),
   value: q.valued.hinted("Value (Controlled)")
 }), SA = ({ data: A, onLoadData: e, value: t, preload: n, ...o }) => {
-  const [l, d] = g(""), [c, f] = g(A ?? []), [S, E] = g(!1), M = (R) => R.value === t;
+  const [l, c] = g(""), [d, f] = g(A ?? []), [v, E] = g(!1), M = (R) => R.value === t;
   Y(() => {
     n && (e == null || e("", p, 0));
   }, [n, e]), Y(() => {
@@ -271,21 +271,21 @@ const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA
     l && (e && E(!0), e == null || e(l, p, 0));
   }, [l]);
   const p = (R) => {
-    let k = c;
-    t && R.some(M) && (k = c.filter((z) => !M(z))), f([...k, ...R]), E(!1);
+    let k = d;
+    t && R.some(M) && (k = d.filter((z) => !M(z))), f([...k, ...R]), E(!1);
   };
-  return { data: c, value: t, loading: S, listProps: {
+  return { data: d, value: t, loading: v, listProps: {
     onItemsRendered: ({ visibleStopIndex: R }) => {
-      e && R >= c.length - 1 && (E(!0), e(l, p, c.length));
+      e && R >= d.length - 1 && (E(!0), e(l, p, d.length));
     }
   }, onSearch: (R) => {
     var k;
-    e && f([]), d(R), (k = o.onSearch) == null || k.call(o, R);
+    e && f([]), c(R), (k = o.onSearch) == null || k.call(o, R);
   }, onOpen: () => {
     var R;
     (R = o.onOpen) == null || R.call(o), !t && !n && (e == null || e("", p, 0));
   }, onCreate: (R, k) => {
-    f([k, ...c]), d("");
+    f([k, ...d]), c("");
   }, virtualized: !!e };
 }, TA = C(JA)`
   && {
@@ -297,12 +297,12 @@ const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA
     width: 100%;
     padding-block: 10px;
   }
-`, Qt = ({ data: A, label: e, onLoadData: t, onSearch: n, onOpen: o, value: l = "", className: d, preload: c, ...f }) => {
-  const { loading: S, ...E } = SA({ data: A, onLoadData: t, onSearch: n, onOpen: o, value: l, preload: c }), M = W(f, "onClean"), p = m((b) => /* @__PURE__ */ v(L, { children: [
+`, Qt = ({ data: A, label: e, onLoadData: t, onSearch: n, onOpen: o, value: l = "", className: c, preload: d, ...f }) => {
+  const { loading: v, ...E } = SA({ data: A, onLoadData: t, onSearch: n, onOpen: o, value: l, preload: d }), M = W(f, "onClean"), p = m((b) => /* @__PURE__ */ S(L, { children: [
     b,
-    S && /* @__PURE__ */ r(TA, {})
-  ] }), [S]);
-  return /* @__PURE__ */ v(N, { className: d, children: [
+    v && /* @__PURE__ */ r(TA, {})
+  ] }), [v]);
+  return /* @__PURE__ */ S(N, { className: c, children: [
     /* @__PURE__ */ r(K.ControlLabel, { children: e }),
     /* @__PURE__ */ r(
       yA,
@@ -319,7 +319,7 @@ const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA
   preload: a.default(!1),
   label: s.default("Select"),
   data: y.default(X(["a", "b", "c"]))
-}), Wt = (A) => /* @__PURE__ */ r(L, { children: "Dropzone" }), Ot = h(Wt, "RsDropzone").name("Dropzone"), gt = ({ error: A, children: e, placement: t, className: n }) => /* @__PURE__ */ v(Yt, { className: NA(n, A ? "rs-form-control-wrapper" : void 0), children: [
+}), Wt = (A) => /* @__PURE__ */ r(L, { children: "Dropzone" }), Ot = h(Wt, "RsDropzone").name("Dropzone"), gt = ({ error: A, children: e, placement: t, className: n }) => /* @__PURE__ */ S(Yt, { className: NA(n, A ? "rs-form-control-wrapper" : void 0), children: [
   e,
   /* @__PURE__ */ r(K.ErrorMessage, { show: !!A, placement: t ?? "bottomStart", children: A })
 ] }), Yt = C.div`
@@ -330,7 +330,7 @@ const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA
 `, Ut = h(gt, "RsErrorMessage").name("Error message").props({
   placement: lA.default("bottomStart"),
   className: s
-}), Tt = (A) => /* @__PURE__ */ r(ve, { children: /* @__PURE__ */ v(Ie, { children: [
+}), Tt = (A) => /* @__PURE__ */ r(ve, { children: /* @__PURE__ */ S(Ie, { children: [
   [].map(() => /* @__PURE__ */ r(cA, {})),
   /* @__PURE__ */ r(cA, { xs: 12, children: A.child1 }),
   /* @__PURE__ */ r(cA, { xs: 12, children: A.child2 })
@@ -344,20 +344,21 @@ const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA
   src: s.required.default(jA).hinted("Image source"),
   alt: s.named("Description").default("Image").hinted("Image description")
 }).css({
-  objectPosition: I("top", "bottom", "left", "right", "center").default("left"),
-  objectFit: I("contain", "cover", "fill", "none", "scale-down").default("scale-down")
-}).preview(/* @__PURE__ */ r("img", { src: jA, width: "200px", height: "auto", alt: "Image" })), An = ({ style: A, className: e, label: t, passwordMask: n, value: o, ...l }) => {
-  const [d, c] = g(!1), f = n ? /* @__PURE__ */ v(PA, { inside: !0, children: [
-    /* @__PURE__ */ r(_, { type: d ? "text" : "password", value: o ?? "", ...l }),
-    /* @__PURE__ */ r(PA.Button, { onClick: () => c(!d), children: d ? /* @__PURE__ */ r(Le, {}) : /* @__PURE__ */ r(Ne, {}) })
-  ] }) : /* @__PURE__ */ r(_, { value: o ?? "", ...l });
-  return /* @__PURE__ */ v(N, { style: A, className: e, children: [
+  objectPosition: u("top", "bottom", "left", "right", "center").default("left"),
+  objectFit: u("contain", "cover", "fill", "none", "scale-down").default("scale-down")
+}).preview(/* @__PURE__ */ r("img", { src: jA, width: "200px", height: "auto", alt: "Image" })), An = ({ style: A, className: e, label: t, passwordMask: n, type: o, value: l, ...c }) => {
+  const [d, f] = g(!1), v = n ? /* @__PURE__ */ S(PA, { inside: !0, children: [
+    /* @__PURE__ */ r(_, { type: d ? "text" : "password", value: l ?? "", ...c }),
+    /* @__PURE__ */ r(PA.Button, { onClick: () => f(!d), children: d ? /* @__PURE__ */ r(Le, {}) : /* @__PURE__ */ r(Ne, {}) })
+  ] }) : /* @__PURE__ */ r(_, { type: o, value: l ?? "", ...c });
+  return /* @__PURE__ */ S(N, { style: A, className: e, children: [
     /* @__PURE__ */ r($, { children: t }),
-    f
+    v
   ] });
 }, en = h(An, "RsInput").name("Input").props({
   label: s.default("Input").hinted("Input label"),
   ...IA,
+  type: u("text", "password", "email", "number", "search", "tel", "url", "time").default("text"),
   value: s.valued,
   passwordMask: a.default(!1)
 }), tn = ({ text: A, ...e }) => /* @__PURE__ */ r("label", { ...e, children: A }), nn = h(tn, "RsLabel").name("Label").props({
@@ -375,11 +376,11 @@ const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA
   collapsible: a.hinted("Sidebar can be collapsed").default(!1),
   width: s.hinted("Width")
 }), sn = ({ text: A, download: e, downloadFilename: t, content: n, children: o, ...l }) => /* @__PURE__ */ r("a", { ...l, download: t ?? e, children: n === "text" ? A : o }), dn = h(sn, "RsLink").name("Link").props({
-  content: I("text", "custom").default("text").radio(),
+  content: u("text", "custom").default("text").radio(),
   text: s.default("Link"),
   href: s,
   children: x.hinted("Component children"),
-  target: I("_self", "_blank", "_parent", "_top", "_unfencedTop").default("_blank"),
+  target: u("_self", "_blank", "_parent", "_top", "_unfencedTop").default("_blank"),
   download: a.default(!1),
   downloadFilename: s,
   onClick: i
@@ -408,9 +409,9 @@ const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA
   "ja-JP": tt
 }, fn = zA, zr = ({ language: A, children: e }) => /* @__PURE__ */ r(Ee, { rtl: A.bidi === "rtl", locale: cn[A.fullCode] ?? fn, children: e }), hn = (A) => A.map((e) => ({ title: e, href: e })), un = ({ onSelect: A, items: e, ...t }) => {
   const n = aA();
-  return e != null && e.length ? /* @__PURE__ */ r(tA, { onSelect: (l, d) => {
-    n.userDefinedProps ?? (n.userDefinedProps = {}), n.userDefinedProps.activeKey = l, A == null || A(l, d);
-  }, ...t, children: e.map(({ title: l, href: d }, c) => /* @__PURE__ */ r(tA.Item, { href: d, eventKey: l, active: l === t.activeKey, children: l }, c)) }) : null;
+  return e != null && e.length ? /* @__PURE__ */ r(tA, { onSelect: (l, c) => {
+    n.userDefinedProps ?? (n.userDefinedProps = {}), n.userDefinedProps.activeKey = l, A == null || A(l, c);
+  }, ...t, children: e.map(({ title: l, href: c }, d) => /* @__PURE__ */ r(tA.Item, { href: c, eventKey: l, active: l === t.activeKey, children: l }, d)) }) : null;
 }, vn = [
   { name: "title", input: Z },
   { name: "href", title: "Url", input: Z }
@@ -426,7 +427,7 @@ const F = J.withEditorProps({ min: 0 }), at = J.withEditorProps({ min: 1 }), lA
   children: x,
   closable: a.default(!1),
   header: x,
-  type: I("info", "success", "warning", "error").default("info")
+  type: u("info", "success", "warning", "error").default("info")
 }), FA = ({ onChange: A, ...e }) => /* @__PURE__ */ r(_, { onChange: (n, o) => A == null ? void 0 : A(o, n), ...e });
 function En(A) {
   let { decimalSeparator: e = "." } = A, { thousandSeparator: t } = A;
@@ -437,16 +438,16 @@ function En(A) {
      `), t = void 0, e = "."), t && se(t) && (t.indexOf("-") >= 0 ? (console.warn("Thousand separator can't contain '-' character"), t = void 0) : t.match(/\d/g) && (console.warn("Thousand separator should not contain numeric character"), t = void 0)), e.match(/\d/g) && (console.warn("Decimal separator should not contain numeric character"), e = "."), { decimalSeparator: e, thousandSeparator: t };
 }
 const Mn = ({ style: A, className: e, label: t, onChange: n, value: o, ...l }) => {
-  const { decimalSeparator: d, thousandSeparator: c } = En(l);
-  return /* @__PURE__ */ v(N, { style: A, className: e, children: [
+  const { decimalSeparator: c, thousandSeparator: d } = En(l);
+  return /* @__PURE__ */ S(N, { style: A, className: e, children: [
     /* @__PURE__ */ r($, { children: t }),
     /* @__PURE__ */ r(
       nt,
       {
         customInput: FA,
         ...l,
-        decimalSeparator: d,
-        thousandSeparator: c,
+        decimalSeparator: c,
+        thousandSeparator: d,
         onValueChange: (f) => n == null ? void 0 : n(f.value),
         value: o ?? ""
       }
@@ -464,19 +465,19 @@ const Mn = ({ style: A, className: e, label: t, onChange: n, value: o, ...l }) =
   fixedDecimalScale: a.default(!1),
   prefix: s,
   suffix: s,
-  thousandsGroupStyle: I("thousand", "lakh", "wan", "none").default("none"),
+  thousandsGroupStyle: u("thousand", "lakh", "wan", "none").default("none"),
   thousandSeparator: s
-}), jn = ({ style: A, className: e, label: t, format: n, onChange: o, value: l, ...d }) => {
-  let { mask: c } = d;
-  return c && (c === "string" ? c : c.toString()).match(/\d/g) && (console.warn(`Mask ${c} should not contain numeric character, mask value will be ignored`), c = void 0), /* @__PURE__ */ v(N, { style: A, className: e, children: [
+}), jn = ({ style: A, className: e, label: t, format: n, onChange: o, value: l, ...c }) => {
+  let { mask: d } = c;
+  return d && (d === "string" ? d : d.toString()).match(/\d/g) && (console.warn(`Mask ${d} should not contain numeric character, mask value will be ignored`), d = void 0), /* @__PURE__ */ S(N, { style: A, className: e, children: [
     /* @__PURE__ */ r($, { children: t }),
     /* @__PURE__ */ r(
       rt,
       {
         customInput: FA,
         format: n ?? "",
-        ...d,
-        mask: c,
+        ...c,
+        mask: d,
         onValueChange: (f) => o == null ? void 0 : o(f.formattedValue),
         value: l ?? ""
       }
@@ -494,26 +495,26 @@ const Mn = ({ style: A, className: e, label: t, onChange: n, value: o, ...l }) =
   classPrefix: s.default("progress").hinted("The prefix of the component CSS class"),
   percent: J.default(50).withEditorProps({ min: 0, max: 100 }).hinted("Percent of progress").valued,
   showInfo: a.default(!0).hinted("Show text"),
-  status: I("success", "fail", "active").default("active").hinted("Progress status"),
+  status: u("success", "fail", "active").default("active").hinted("Progress status"),
   strokeColor: U.hinted("Line color"),
   strokeWidth: J.hinted("Line width")
 }, Cn = h(DA.Circle, "RsProgressCircle").name("Progress circle").props({
   ...XA,
   gapDegree: J.withEditorProps({ min: 0, max: 360 }).hinted("The gap degree of half circle, 0 ~ 360"),
-  gapPosition: I("right", "top", "bottom", "left").default("top").hinted("Circular progress bar Notch position"),
-  strokeLinecap: I("round", "square", "butt").default("round").hinted("The end of different types of open paths"),
+  gapPosition: u("right", "top", "bottom", "left").default("top").hinted("Circular progress bar Notch position"),
+  strokeLinecap: u("round", "square", "butt").default("round").hinted("The end of different types of open paths"),
   strokeWidth: J.default(6).hinted("Line width"),
   trailColor: U.hinted("Trail color"),
   trailWidth: J.default(6).hinted("Trail width")
 }), Gn = h(DA.Line, "RsProgressLine").name("Progress line").props({
   ...XA,
   vertical: a.default(!1).hinted("The progress bar is displayed vertically")
-}), bn = ({ items: A, label: e, value: t, className: n, ...o }) => /* @__PURE__ */ v("div", { className: n, children: [
+}), bn = ({ items: A, label: e, value: t, className: n, ...o }) => /* @__PURE__ */ S("div", { className: n, children: [
   /* @__PURE__ */ r("label", { children: e }),
-  /* @__PURE__ */ r(Pe, { ...o, value: t ?? "", children: A.map(({ value: l, label: d }, c) => /* @__PURE__ */ r(je, { value: l, children: d ?? l }, c)) })
+  /* @__PURE__ */ r(Pe, { ...o, value: t ?? "", children: A.map(({ value: l, label: c }, d) => /* @__PURE__ */ r(je, { value: l, children: c ?? l }, d)) })
 ] }), mn = h(bn, "RsRadioGroup").name("Radio group").props({
   name: s.default("RadioGroup").hinted("Radio group name"),
-  appearance: I("default", "picker").labeled("Default", "Picker").default("default"),
+  appearance: u("default", "picker").labeled("Default", "Picker").default("default"),
   label: s.default("Radio"),
   disabled: a.hinted("The disable of component").default(!1),
   readOnly: D,
@@ -521,16 +522,16 @@ const Mn = ({ style: A, className: e, label: t, onChange: n, value: o, ...l }) =
   onChange: i,
   items: y.default(X(["a", "b", "c"])),
   value: s.valued.hinted("Radio group value")
-}), wn = () => null, Hn = ({ data: A, label: e, onLoadData: t, onSearch: n, value: o = "", className: l, preload: d, ...c }) => {
-  const { loading: f, onOpen: S, ...E } = SA({ data: A, onLoadData: t, onSearch: n, value: o, preload: d }), M = (j) => {
+}), wn = () => null, Hn = ({ data: A, label: e, onLoadData: t, onSearch: n, value: o = "", className: l, preload: c, ...d }) => {
+  const { loading: f, onOpen: v, ...E } = SA({ data: A, onLoadData: t, onSearch: n, value: o, preload: c }), M = (j) => {
     var P;
     return (P = E.data) != null && P.length ? j : null;
-  }, p = W(c, "onClean"), b = f ? JA : ze;
-  return /* @__PURE__ */ v(N, { className: l, children: [
+  }, p = W(d, "onClean"), b = f ? JA : ze;
+  return /* @__PURE__ */ S(N, { className: l, children: [
     /* @__PURE__ */ r(K.ControlLabel, { children: e }),
-    /* @__PURE__ */ v(Jn, { children: [
-      /* @__PURE__ */ r(yn, { ...c, ...E, onClean: p, renderMenu: M, caretAs: wn }),
-      !(c.cleanable && o) && /* @__PURE__ */ r(b, { className: "search-icon" })
+    /* @__PURE__ */ S(Jn, { children: [
+      /* @__PURE__ */ r(yn, { ...d, ...E, onClean: p, renderMenu: M, caretAs: wn }),
+      !(d.cleanable && o) && /* @__PURE__ */ r(b, { className: "search-icon" })
     ] })
   ] });
 }, Jn = C.div`
@@ -574,11 +575,11 @@ const Mn = ({ style: A, className: e, label: t, onChange: n, value: o, ...l }) =
     width: n = 300,
     height: o = 150,
     className: l,
-    onChange: d,
-    backgroundColor: c,
+    onChange: c,
+    backgroundColor: d,
     readOnly: f,
-    ...S
-  } = A, E = V(t), M = V(S), p = V(null), b = V(), j = m(() => {
+    ...v
+  } = A, E = V(t), M = V(v), p = V(null), b = V(), j = m(() => {
     var k;
     return (k = b.current) == null ? void 0 : k.clear();
   }, []), [P, w] = g();
@@ -590,8 +591,8 @@ const Mn = ({ style: A, className: e, label: t, onChange: n, value: o, ...l }) =
       const O = { ratio: Math.max(window.devicePixelRatio ?? 1, 1), width: n, height: o };
       k.fromDataURL(E.current, O).catch(console.error);
     }
-    return k.addEventListener("endStroke", () => d == null ? void 0 : d(k.toDataURL())), k.on(), w(k), b.current = k, () => k.off();
-  }, [d, n, o]), Y(() => {
+    return k.addEventListener("endStroke", () => c == null ? void 0 : c(k.toDataURL())), k.on(), w(k), b.current = k, () => k.off();
+  }, [c, n, o]), Y(() => {
     if (f) {
       P == null || P.off();
       return;
@@ -599,22 +600,22 @@ const Mn = ({ style: A, className: e, label: t, onChange: n, value: o, ...l }) =
     return P == null || P.on(), () => P == null ? void 0 : P.off();
   }, [f, P]);
   const R = Q(
-    () => ({ borderRadius: 6, backgroundColor: c }),
-    [c]
+    () => ({ borderRadius: 6, backgroundColor: d }),
+    [d]
   );
   return /* @__PURE__ */ r("canvas", { ref: p, className: l, width: n, height: o, style: R });
-}), zn = ({ value: A, style: e, className: t, label: n, clearButtonText: o, readOnly: l, ...d }) => {
-  const c = V(null), f = Q(
-    () => ({ width: d.width, marginTop: 6 }),
-    [d.width]
-  ), S = W(d, "onChange"), E = m(() => {
+}), zn = ({ value: A, style: e, className: t, label: n, clearButtonText: o, readOnly: l, ...c }) => {
+  const d = V(null), f = Q(
+    () => ({ width: c.width, marginTop: 6 }),
+    [c.width]
+  ), v = W(c, "onChange"), E = m(() => {
     var M;
-    (M = c.current) == null || M.clear(), S(void 0);
-  }, [S]);
-  return /* @__PURE__ */ v(N, { style: e, className: t, children: [
-    /* @__PURE__ */ v(KA, { children: [
+    (M = d.current) == null || M.clear(), v(void 0);
+  }, [v]);
+  return /* @__PURE__ */ S(N, { style: e, className: t, children: [
+    /* @__PURE__ */ S(KA, { children: [
       n && /* @__PURE__ */ r($, { children: n }),
-      /* @__PURE__ */ r(Nn, { ...d, readOnly: l, value: A, ref: c, onChange: S })
+      /* @__PURE__ */ r(Nn, { ...c, readOnly: l, value: A, ref: d, onChange: v })
     ] }),
     !l && /* @__PURE__ */ r(eA, { onClick: E, disabled: !A, appearance: "primary", style: f, children: o })
   ] });
@@ -639,11 +640,11 @@ const Mn = ({ style: A, className: e, label: t, onChange: n, value: o, ...l }) =
   const l = aA();
   if (!(n != null && n.length))
     return null;
-  const d = (f, S) => {
-    l.userDefinedProps ?? (l.userDefinedProps = {}), l.userDefinedProps.activeKey = f, e == null || e(f, S);
-  }, c = o.activeKey ?? (n == null ? void 0 : n[0].value);
-  return /* @__PURE__ */ v(L, { children: [
-    t === !0 && /* @__PURE__ */ r(gn, { onSelect: d, ...o, children: n.map((f, S) => /* @__PURE__ */ r(tA.Item, { eventKey: f.value, active: f.value === c, children: f.label }, S)) }),
+  const c = (f, v) => {
+    l.userDefinedProps ?? (l.userDefinedProps = {}), l.userDefinedProps.activeKey = f, e == null || e(f, v);
+  }, d = o.activeKey ?? (n == null ? void 0 : n[0].value);
+  return /* @__PURE__ */ S(L, { children: [
+    t === !0 && /* @__PURE__ */ r(gn, { onSelect: c, ...o, children: n.map((f, v) => /* @__PURE__ */ r(tA.Item, { eventKey: f.value, active: f.value === d, children: f.label }, v)) }),
     /* @__PURE__ */ r("div", { children: A })
   ] });
 }, gn = C(tA)`
@@ -658,20 +659,20 @@ const Mn = ({ style: A, className: e, label: t, onChange: n, value: o, ...l }) =
     var e;
     return `return parentProps.activeKey === '${((e = A.activeKey) == null ? void 0 : e.value) ?? A.activeKey}'`;
   }).calculable(!1).hinted("A child component of the tab")
-}), Un = ({ data: A, label: e, onLoadData: t, onSearch: n, onOpen: o, value: l = [], className: d, ...c }) => {
-  const { loading: f, ...S } = SA({ data: A, onLoadData: t, onSearch: n, onOpen: o, value: l }), E = W(c, "onClean"), M = m((j) => /* @__PURE__ */ v(L, { children: [
+}), Un = ({ data: A, label: e, onLoadData: t, onSearch: n, onOpen: o, value: l = [], className: c, ...d }) => {
+  const { loading: f, ...v } = SA({ data: A, onLoadData: t, onSearch: n, onOpen: o, value: l }), E = W(d, "onClean"), M = m((j) => /* @__PURE__ */ S(L, { children: [
     j,
     f && /* @__PURE__ */ r(TA, {})
   ] }), [f]), p = function(j) {
     return j && j.value && j.label;
   }, b = Array.isArray(A) ? A.filter(p) : X(A || []).filter(p);
-  return /* @__PURE__ */ v(N, { className: d, children: [
+  return /* @__PURE__ */ S(N, { className: c, children: [
     /* @__PURE__ */ r(K.ControlLabel, { children: e }),
     /* @__PURE__ */ r(
       xe,
       {
-        ...c,
-        ...S,
+        ...d,
+        ...v,
         data: b,
         onClean: E,
         renderMenu: M
@@ -683,7 +684,7 @@ const Mn = ({ style: A, className: e, label: t, onChange: n, value: o, ...l }) =
   value: y.valued.ofString,
   label: nA.label.default("Select"),
   data: y.default(X(["a", "b", "c"]))
-}), Fn = ({ style: A, className: e, label: t, ...n }) => /* @__PURE__ */ v(N, { style: A, className: e, children: [
+}), Fn = ({ style: A, className: e, label: t, ...n }) => /* @__PURE__ */ S(N, { style: A, className: e, children: [
   /* @__PURE__ */ r($, { children: t }),
   /* @__PURE__ */ r(_, { as: "textarea", ...n })
 ] }), Xn = h(Fn, "RsTextArea").name("Text area").props({
@@ -702,28 +703,28 @@ const Mn = ({ style: A, className: e, label: t, onChange: n, value: o, ...l }) =
     return isNaN(t.getTime()) ? (console.error("Invalid time string:", A), null) : t;
   }
   return A;
-}, Bn = ({ open: A, label: e, value: t, className: n, format: o, defaultValue: l, onChange: d, ...c }) => {
-  const f = Q(() => YA(o), [o]), S = W(c, "onClean"), E = Q(() => xA(t, AA), [t]), M = Q(() => xA(l, AA), [l]), p = Q(() => A === !0 ? !0 : void 0, [A]), b = m((j, P) => {
+}, Bn = ({ open: A, label: e, value: t, className: n, format: o, defaultValue: l, onChange: c, ...d }) => {
+  const f = Q(() => YA(o), [o]), v = W(d, "onClean"), E = Q(() => xA(t, AA), [t]), M = Q(() => xA(l, AA), [l]), p = Q(() => A === !0 ? !0 : void 0, [A]), b = m((j, P) => {
     if (j === null) {
-      d == null || d(null, P);
+      c == null || c(null, P);
       return;
     }
     if (Kn(j)) {
       const w = uA(j, AA);
-      d == null || d(w, P);
+      c == null || c(w, P);
     }
-  }, [d]);
-  return /* @__PURE__ */ v(N, { className: n, children: [
+  }, [c]);
+  return /* @__PURE__ */ S(N, { className: n, children: [
     /* @__PURE__ */ r(K.ControlLabel, { children: e }),
     /* @__PURE__ */ r(
       HA,
       {
-        ...c,
+        ...d,
         onChange: b,
         value: E ?? M ?? null,
         open: p,
         format: f ?? AA,
-        onClean: S,
+        onClean: v,
         preventOverflow: !0
       }
     )
@@ -763,14 +764,14 @@ const Mn = ({ style: A, className: e, label: t, onChange: n, value: o, ...l }) =
   unCheckedChildren: s.named("Unchecked text"),
   disabled: a.hinted("Whether disabled").default(!1),
   readOnly: D,
-  size: I("sm", "md", "lg").labeled("Small", "Medium", "Large").default("md"),
+  size: u("sm", "md", "lg").labeled("Small", "Medium", "Large").default("md"),
   color: WA,
   loading: a.default(!1),
   onChange: i
 }), _n = ({ text: A, placement: e, trigger: t, children: n }) => n ? /* @__PURE__ */ r(Ge, { placement: e, trigger: t, speaker: /* @__PURE__ */ r(be, { children: A }), children: /* @__PURE__ */ r("div", { style: { width: "100%", height: "100%" }, children: n }) }) : null, $n = h(_n, "RsTooltip").name("Tooltip").props({
   text: s.required.default("Tooltip message...").hinted("Tooltip text"),
   children: x,
-  placement: I(
+  placement: u(
     "top",
     "bottom",
     "right",
@@ -810,7 +811,7 @@ const Mn = ({ style: A, className: e, label: t, onChange: n, value: o, ...l }) =
   disabledFileItem: a.default(!1),
   draggable: a.default(!1),
   fileListVisible: a.default(!0),
-  listType: I("text", "picture-text", "picture"),
+  listType: u("text", "picture-text", "picture"),
   method: s,
   multiple: a.default(!1),
   name: s,
@@ -826,7 +827,7 @@ const Mn = ({ style: A, className: e, label: t, onChange: n, value: o, ...l }) =
   timeout: F,
   withCredentials: a.default(!1),
   fileList: y.withEditorProps({ columns: nr }).valued
-}), or = () => /* @__PURE__ */ v("svg", { width: "18", height: "18", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+}), or = () => /* @__PURE__ */ S("svg", { width: "18", height: "18", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
   /* @__PURE__ */ r(
     "path",
     {
@@ -856,9 +857,9 @@ const Mn = ({ style: A, className: e, label: t, onChange: n, value: o, ...l }) =
   return e.props.label = { value: `Step ${A}` }, e;
 }, dr = {
   onAdd: (A, e, t) => {
-    var d, c, f;
-    const n = VA(A + 1), o = t.createComponentData(n), l = (d = e.store.props).activeIndex ?? (d.activeIndex = {});
-    if (l.value = A, (c = e.children) != null && c.length) {
+    var c, d, f;
+    const n = VA(A + 1), o = t.createComponentData(n), l = (c = e.store.props).activeIndex ?? (c.activeIndex = {});
+    if (l.value = A, (d = e.children) != null && d.length) {
       (f = e.children[A - 1]) == null || f.insertAfterMe(o);
       return;
     }
@@ -877,12 +878,12 @@ const Mn = ({ style: A, className: e, label: t, onChange: n, value: o, ...l }) =
         label: (l = o.label) == null ? void 0 : l.value
       };
     })) ?? [], onChange: (o) => {
-      o.forEach(({ label: l }, d) => {
+      o.forEach(({ label: l }, c) => {
         var f;
-        if (!((f = A.children) != null && f[d]))
+        if (!((f = A.children) != null && f[c]))
           return;
-        const { props: c } = A.children[d];
-        c.label = { value: l };
+        const { props: d } = A.children[c];
+        d.label = { value: l };
       });
     } };
   }
@@ -923,7 +924,7 @@ const Mn = ({ style: A, className: e, label: t, onChange: n, value: o, ...l }) =
   &.active:hover .rs-steps-item-icon-wrapper {
     opacity: 0.8;
   }
-`, hr = () => /* @__PURE__ */ v("svg", { width: "18", height: "18", viewBox: "0 0 18 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+`, hr = () => /* @__PURE__ */ S("svg", { width: "18", height: "18", viewBox: "0 0 18 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
   /* @__PURE__ */ r(
     "path",
     {
@@ -985,10 +986,10 @@ const ur = {
   onNext: n,
   onPrev: o,
   onFinish: l,
-  showSteps: d,
-  showStepsLabels: c,
+  showSteps: c,
+  showStepsLabels: d,
   verticalSteps: f,
-  stepsNavigation: S,
+  stepsNavigation: v,
   prevButtonLabel: E,
   nextButtonLabel: M,
   finishButtonLabel: p,
@@ -1001,13 +1002,13 @@ const ur = {
   Y(() => {
     w < e && R(e);
   }, [w, e]);
-  const z = aA(), O = ((pA = z.store.children) == null ? void 0 : pA.map(({ props: u }) => {
+  const z = aA(), O = ((pA = z.store.children) == null ? void 0 : pA.map(({ props: I }) => {
     var G;
     return {
-      label: (G = u.label) == null ? void 0 : G.value
+      label: (G = I.label) == null ? void 0 : G.value
     };
-  })) ?? [], H = m((u) => {
-    w < u && R(u), t == null || t(u);
+  })) ?? [], H = m((I) => {
+    w < I && R(I), t == null || t(I);
   }, [w, t]), $A = m(() => {
     if (j) {
       z.validate().then(() => {
@@ -1017,26 +1018,26 @@ const ur = {
     }
     l == null || l();
   }, [z, l, j]), Ae = m(() => {
-    let u = e ?? 0;
-    u < O.length && (u = u + 1);
+    let I = e ?? 0;
+    I < O.length && (I = I + 1);
     const G = z.children[e];
     if (b) {
       G == null || G.validate().then(() => {
-        G != null && G.hasErrors || (H == null || H(u), n == null || n());
+        G != null && G.hasErrors || (H == null || H(I), n == null || n());
       });
       return;
     }
-    H == null || H(u), n == null || n();
+    H == null || H(I), n == null || n();
   }, [e, z.children, O.length, n, H, b]), ee = m(() => {
-    let u = e ?? 0;
-    u > 0 && (u = u - 1), H == null || H(u), o == null || o();
-  }, [e, o, H]), sA = m((u) => k || S === "any" || S === "onlyVisited" && u <= w, [w, k, S]), te = m((u) => u <= w ? "process" : "wait", [w]), ne = m((u) => {
-    sA(u) && H(u);
+    let I = e ?? 0;
+    I > 0 && (I = I - 1), H == null || H(I), o == null || o();
+  }, [e, o, H]), sA = m((I) => k || v === "any" || v === "onlyVisited" && I <= w, [w, k, v]), te = m((I) => I <= w ? "process" : "wait", [w]), ne = m((I) => {
+    sA(I) && H(I);
   }, [H, sA]), kA = e <= 0, iA = e >= O.length - 1, re = iA && p === M, oe = Q(() => ({
     display: "flex",
     flexDirection: f ? "row" : "column",
     gap: 10
-  }), [f]), dA = Array.isArray(A) ? A[e] ?? A[0] : null, ae = /* @__PURE__ */ v(we, { style: vr, className: "buttons", children: [
+  }), [f]), dA = Array.isArray(A) ? A[e] ?? A[0] : null, ae = /* @__PURE__ */ S(we, { style: vr, className: "buttons", children: [
     !kA && /* @__PURE__ */ r(eA, { onClick: ee, disabled: kA, children: E }),
     /* @__PURE__ */ r(
       eA,
@@ -1048,13 +1049,13 @@ const ur = {
       }
     )
   ] });
-  return /* @__PURE__ */ v(KA, { style: ur, ...P, children: [
-    /* @__PURE__ */ v("div", { style: oe, children: [
-      d && !!dA && /* @__PURE__ */ r(LA, { current: e, vertical: f, className: "steps", children: O.map(
-        ({ label: u }, G) => /* @__PURE__ */ r(
+  return /* @__PURE__ */ S(KA, { style: ur, ...P, children: [
+    /* @__PURE__ */ S("div", { style: oe, children: [
+      c && !!dA && /* @__PURE__ */ r(LA, { current: e, vertical: f, className: "steps", children: O.map(
+        ({ label: I }, G) => /* @__PURE__ */ r(
           fr,
           {
-            title: c && u,
+            title: d && I,
             onClick: () => ne(G),
             status: te(G),
             className: NA({ available: sA(G), active: G === e })
@@ -1079,7 +1080,7 @@ const ur = {
       };
     }
   }),
-  stepsNavigation: I("disable", "onlyVisited", "any").labeled("Disable", "Only visited", "Any").default("onlyVisited"),
+  stepsNavigation: u("disable", "onlyVisited", "any").labeled("Disable", "Only visited", "Any").default("onlyVisited"),
   steps: y.default([]).withEditorProps(dr),
   children: de,
   prevButtonLabel: s.default("Previous"),