@versaur/react 1.0.17 → 1.0.18

package/dist/forms.js

@@ -1,98 +1,98 @@
-import { jsx as o, jsxs as I } from "react/jsx-runtime";
-import { labelStyles as Ee, helperTextStyles as je, errorTextStyles as Te, textInputStyles as T, textAreaStyles as ee, selectStyles as te, radioStyles as U, checkboxStyles as H, radioGroupStyles as ne, checkboxGroupStyles as oe, chipInputStyles as Y, comboboxInputStyles as C, selectableInputStyles as F, currencyInputStyles as L } from "@versaur/core/forms";
-import { forwardRef as f, useId as D, createContext as P, useContext as Q, useState as j, useEffect as M, useCallback as K, useRef as Le, useMemo as ae } from "react";
-import { u as g, I as Z, c as Fe, F as Pe } from "./helpers-D23F5WBX.js";
-import { c as x } from "./cx-B9vmfsc1.js";
-import { SearchIcon as Qe, MailIcon as Me, LockIcon as Ve, ChevronDownIcon as ze, CheckIcon as Ue } from "@versaur/icons";
-import { D as se } from "./drawer-BjNHPqBr.js";
-const k = f(
-  ({ required: e = !1, disabled: i = !1, children: n, className: c, ...a }, s) => {
+import { jsx as s, jsxs as I } from "react/jsx-runtime";
+import { labelStyles as Te, helperTextStyles as Fe, errorTextStyles as Pe, textInputStyles as T, textAreaStyles as te, selectStyles as ne, radioStyles as U, checkboxStyles as H, radioGroupStyles as oe, checkboxGroupStyles as se, chipInputStyles as Z, comboboxInputStyles as C, selectableInputStyles as P, currencyInputStyles as F } from "@versaur/core/forms";
+import { forwardRef as f, useId as $, createContext as M, useContext as V, useState as L, useEffect as Q, useCallback as K, useRef as Me, useMemo as q } from "react";
+import { u as g, I as ee, c as Ve, F as Qe } from "./helpers-D23F5WBX.js";
+import { c as y } from "./cx-B9vmfsc1.js";
+import { SearchIcon as ze, MailIcon as Ue, LockIcon as He, ChevronDownIcon as Ke, CheckIcon as _e } from "@versaur/icons";
+import { D as ae } from "./drawer-BjNHPqBr.js";
+const A = f(
+  ({ required: e = !1, disabled: a = !1, children: n, className: c, ...i }, o) => {
     const t = g({
-      disabled: i,
+      disabled: a,
       required: e
     });
-    return /* @__PURE__ */ o("label", { ref: s, className: x(Ee.label, c), ...t, ...a, children: n });
+    return /* @__PURE__ */ s("label", { ref: o, className: y(Te.label, c), ...t, ...i, children: n });
   }
 );
-k.displayName = "Label";
-const R = f(({ children: e, className: i, ...n }, c) => /* @__PURE__ */ o("p", { ref: c, className: x(je.helper, i), ...n, children: e }));
+A.displayName = "Label";
+const R = f(({ children: e, className: a, ...n }, c) => /* @__PURE__ */ s("p", { ref: c, className: y(Fe.helper, a), ...n, children: e }));
 R.displayName = "HelperText";
-const A = f(({ children: e, className: i, ...n }, c) => /* @__PURE__ */ o("p", { ref: c, className: x(Te.error, i), role: "alert", "aria-live": "polite", ...n, children: e }));
-A.displayName = "ErrorText";
+const G = f(({ children: e, className: a, ...n }, c) => /* @__PURE__ */ s("p", { ref: c, className: y(Pe.error, a), role: "alert", "aria-live": "polite", ...n, children: e }));
+G.displayName = "ErrorText";
 const _ = f(
   ({
     label: e,
-    helper: i,
+    helper: a,
     error: n,
     required: c = !1,
-    disabled: a = !1,
-    readOnly: s = !1,
+    disabled: i = !1,
+    readOnly: o = !1,
     leftIcon: t,
     rightIcon: r,
     id: l,
     className: d,
-    ...u
-  }, p) => {
-    const b = D(), m = l || b, h = i ? `${m}-helper` : void 0, v = n ? `${m}-error` : void 0, y = [h, v].filter(Boolean).join(" "), N = g({
-      disabled: a,
+    ...p
+  }, u) => {
+    const b = $(), h = l || b, m = a ? `${h}-helper` : void 0, x = n ? `${h}-error` : void 0, v = [m, x].filter(Boolean).join(" "), N = g({
+      disabled: i,
       hasLeftIcon: !!t,
       hasRightIcon: !!r,
       invalid: !!n,
-      readOnly: s
+      readOnly: o
     });
-    return /* @__PURE__ */ I("div", { className: x(T.field, d), children: [
-      e && /* @__PURE__ */ o(k, { htmlFor: m, required: c, disabled: a, children: e }),
+    return /* @__PURE__ */ I("div", { className: y(T.field, d), children: [
+      e && /* @__PURE__ */ s(A, { htmlFor: h, required: c, disabled: i, children: e }),
       /* @__PURE__ */ I("div", { className: T.wrapper, ...N, children: [
-        t && /* @__PURE__ */ o("span", { className: T["left-icon"], children: t }),
-        /* @__PURE__ */ o(
+        t && /* @__PURE__ */ s("span", { className: T["left-icon"], children: t }),
+        /* @__PURE__ */ s(
           "input",
           {
-            ref: p,
-            id: m,
+            ref: u,
+            id: h,
             type: "text",
             className: T.input,
-            disabled: a,
-            readOnly: s,
+            disabled: i,
+            readOnly: o,
             required: c,
             "aria-invalid": n ? "true" : void 0,
-            "aria-disabled": a ? "true" : void 0,
-            "aria-describedby": y || void 0,
-            ...u
+            "aria-disabled": i ? "true" : void 0,
+            "aria-describedby": v || void 0,
+            ...p
           }
         ),
-        r && /* @__PURE__ */ o("span", { className: T["right-icon"], children: r })
+        r && /* @__PURE__ */ s("span", { className: T["right-icon"], children: r })
       ] }),
-      n && /* @__PURE__ */ o(A, { id: v, children: n }),
-      !n && i && /* @__PURE__ */ o(R, { id: h, children: i })
+      n && /* @__PURE__ */ s(G, { id: x, children: n }),
+      !n && a && /* @__PURE__ */ s(R, { id: m, children: a })
     ] });
   }
 );
 _.displayName = "TextInput";
-const He = f(({ leftIcon: e, ...i }, n) => /* @__PURE__ */ o(_, { ref: n, inputMode: "search", leftIcon: e ?? /* @__PURE__ */ o(Z, { as: Qe }), ...i }));
-He.displayName = "SearchInput";
-const Ke = f(({ leftIcon: e, ...i }, n) => /* @__PURE__ */ o(_, { ref: n, type: "email", inputMode: "email", leftIcon: e ?? /* @__PURE__ */ o(Z, { as: Me }), ...i }));
-Ke.displayName = "EmailInput";
-const _e = f(({ leftIcon: e, ...i }, n) => /* @__PURE__ */ o(_, { ref: n, type: "password", leftIcon: e ?? /* @__PURE__ */ o(Z, { as: Ve }), ...i }));
-_e.displayName = "PasswordInput";
-const Je = f(
+const Je = f(({ leftIcon: e, ...a }, n) => /* @__PURE__ */ s(_, { ref: n, inputMode: "search", leftIcon: e ?? /* @__PURE__ */ s(ee, { as: ze }), ...a }));
+Je.displayName = "SearchInput";
+const We = f(({ leftIcon: e, ...a }, n) => /* @__PURE__ */ s(_, { ref: n, type: "email", inputMode: "email", leftIcon: e ?? /* @__PURE__ */ s(ee, { as: Ue }), ...a }));
+We.displayName = "EmailInput";
+const Xe = f(({ leftIcon: e, ...a }, n) => /* @__PURE__ */ s(_, { ref: n, type: "password", leftIcon: e ?? /* @__PURE__ */ s(ee, { as: He }), ...a }));
+Xe.displayName = "PasswordInput";
+const Ye = f(
   ({
     label: e,
-    helper: i,
+    helper: a,
     error: n,
     required: c = !1,
-    disabled: a = !1,
-    readOnly: s = !1,
+    disabled: i = !1,
+    readOnly: o = !1,
     resizable: t = !0,
     minRows: r = 3,
     maxRows: l,
     id: d,
-    className: u,
-    ...p
+    className: p,
+    ...u
   }, b) => {
-    const m = D(), h = d || m, v = i ? `${h}-helper` : void 0, y = n ? `${h}-error` : void 0, N = [v, y].filter(Boolean).join(" "), w = g({
-      disabled: a,
+    const h = $(), m = d || h, x = a ? `${m}-helper` : void 0, v = n ? `${m}-error` : void 0, N = [x, v].filter(Boolean).join(" "), S = g({
+      disabled: i,
       invalid: !!n,
-      readOnly: s,
+      readOnly: o,
       resizable: t ? "true" : "false",
       minRows: "true",
       ...l && { maxRows: "true" }
@@ -100,77 +100,77 @@ const Je = f(
       "--_min-rows-count": r,
       ...l && { "--_max-rows-count": l }
     };
-    return /* @__PURE__ */ I("div", { className: x(ee.field, u), children: [
-      e && /* @__PURE__ */ o(k, { htmlFor: h, required: c, disabled: a, children: e }),
-      /* @__PURE__ */ o(
+    return /* @__PURE__ */ I("div", { className: y(te.field, p), children: [
+      e && /* @__PURE__ */ s(A, { htmlFor: m, required: c, disabled: i, children: e }),
+      /* @__PURE__ */ s(
         "textarea",
         {
           ref: b,
-          id: h,
-          className: ee.textarea,
-          disabled: a,
-          readOnly: s,
+          id: m,
+          className: te.textarea,
+          disabled: i,
+          readOnly: o,
           required: c,
           style: B,
           "aria-invalid": n ? "true" : void 0,
-          "aria-disabled": a ? "true" : void 0,
+          "aria-disabled": i ? "true" : void 0,
           "aria-describedby": N || void 0,
-          ...w,
-          ...p
+          ...S,
+          ...u
         }
       ),
-      n && /* @__PURE__ */ o(A, { id: y, children: n }),
-      !n && i && /* @__PURE__ */ o(R, { id: v, children: i })
+      n && /* @__PURE__ */ s(G, { id: v, children: n }),
+      !n && a && /* @__PURE__ */ s(R, { id: x, children: a })
     ] });
   }
 );
-Je.displayName = "TextArea";
-const ie = f(({ children: e, ...i }, n) => /* @__PURE__ */ o("option", { ref: n, ...i, children: e }));
+Ye.displayName = "TextArea";
+const ie = f(({ children: e, ...a }, n) => /* @__PURE__ */ s("option", { ref: n, ...a, children: e }));
 ie.displayName = "Select.Option";
 const ce = f(
-  ({ label: e, children: i, ...n }, c) => /* @__PURE__ */ o("optgroup", { ref: c, label: e, ...n, children: i })
+  ({ label: e, children: a, ...n }, c) => /* @__PURE__ */ s("optgroup", { ref: c, label: e, ...n, children: a })
 );
 ce.displayName = "Select.OptionGroup";
 const re = f(
   ({
     label: e,
-    helper: i,
+    helper: a,
     error: n,
     required: c = !1,
-    disabled: a = !1,
-    placeholder: s,
+    disabled: i = !1,
+    placeholder: o,
     children: t,
     id: r,
     className: l,
     ...d
-  }, u) => {
-    const p = D(), b = r || p, m = i ? `${b}-helper` : void 0, h = n ? `${b}-error` : void 0, v = [m, h].filter(Boolean).join(" "), y = g({
-      disabled: a,
+  }, p) => {
+    const u = $(), b = r || u, h = a ? `${b}-helper` : void 0, m = n ? `${b}-error` : void 0, x = [h, m].filter(Boolean).join(" "), v = g({
+      disabled: i,
       invalid: !!n
     });
-    return /* @__PURE__ */ I("div", { className: x(te.field, l), children: [
-      e && /* @__PURE__ */ o(k, { htmlFor: b, required: c, disabled: a, children: e }),
+    return /* @__PURE__ */ I("div", { className: y(ne.field, l), children: [
+      e && /* @__PURE__ */ s(A, { htmlFor: b, required: c, disabled: i, children: e }),
       /* @__PURE__ */ I(
         "select",
         {
-          ref: u,
+          ref: p,
           id: b,
-          className: te.select,
-          disabled: a,
+          className: ne.select,
+          disabled: i,
           required: c,
           "aria-invalid": n ? "true" : void 0,
-          "aria-disabled": a ? "true" : void 0,
-          "aria-describedby": v || void 0,
-          ...y,
+          "aria-disabled": i ? "true" : void 0,
+          "aria-describedby": x || void 0,
+          ...v,
           ...d,
           children: [
-            s && /* @__PURE__ */ o("option", { value: "", disabled: !0, children: s }),
+            o && /* @__PURE__ */ s("option", { value: "", disabled: !0, children: o }),
             t
           ]
         }
       ),
-      n && /* @__PURE__ */ o(A, { id: h, children: n }),
-      !n && i && /* @__PURE__ */ o(R, { id: m, children: i })
+      n && /* @__PURE__ */ s(G, { id: m, children: n }),
+      !n && a && /* @__PURE__ */ s(R, { id: h, children: a })
     ] });
   }
 );
@@ -179,46 +179,46 @@ const le = re;
 le.Option = ie;
 le.OptionGroup = ce;
 const de = f(
-  ({ disabled: e = !1, children: i, className: n, ...c }, a) => {
-    const s = g({
+  ({ disabled: e = !1, children: a, className: n, ...c }, i) => {
+    const o = g({
       disabled: e
     });
-    return /* @__PURE__ */ I("label", { className: x(U.radio, n), ...s, children: [
-      /* @__PURE__ */ o("input", { ref: a, type: "radio", className: U.input, disabled: e, ...c }),
-      /* @__PURE__ */ o("span", { className: U.indicator }),
-      i && /* @__PURE__ */ o("span", { className: U.label, children: i })
+    return /* @__PURE__ */ I("label", { className: y(U.radio, n), ...o, children: [
+      /* @__PURE__ */ s("input", { ref: i, type: "radio", className: U.input, disabled: e, ...c }),
+      /* @__PURE__ */ s("span", { className: U.indicator }),
+      a && /* @__PURE__ */ s("span", { className: U.label, children: a })
     ] });
   }
 );
 de.displayName = "Radio";
 const pe = f(
-  ({ disabled: e = !1, required: i = !1, children: n, className: c, ...a }, s) => {
+  ({ disabled: e = !1, required: a = !1, children: n, className: c, ...i }, o) => {
     const t = g({
       disabled: e,
-      required: i
+      required: a
     });
-    return /* @__PURE__ */ I("label", { className: x(H.checkbox, c), ...t, children: [
-      /* @__PURE__ */ o(
+    return /* @__PURE__ */ I("label", { className: y(H.checkbox, c), ...t, children: [
+      /* @__PURE__ */ s(
         "input",
         {
-          ref: s,
+          ref: o,
           type: "checkbox",
           className: H.input,
           disabled: e,
-          required: i,
-          "aria-required": i || void 0,
-          ...a
+          required: a,
+          "aria-required": a || void 0,
+          ...i
         }
       ),
-      /* @__PURE__ */ o("span", { className: H.indicator }),
-      n && /* @__PURE__ */ o("span", { className: H.label, "data-required": i || void 0, children: n })
+      /* @__PURE__ */ s("span", { className: H.indicator }),
+      n && /* @__PURE__ */ s("span", { className: H.label, "data-required": a || void 0, children: n })
     ] });
   }
 );
 pe.displayName = "Checkbox";
-const ue = P(void 0);
-function We() {
-  const e = Q(ue);
+const ue = M(void 0);
+function Ze() {
+  const e = V(ue);
   if (!e)
     throw new Error("RadioGroup.Option must be used within RadioGroup");
   return e;
@@ -226,68 +226,68 @@ function We() {
 const he = f(
   ({
     value: e,
-    onChange: i,
+    onChange: a,
     name: n,
     label: c,
-    helper: a,
-    error: s,
+    helper: i,
+    error: o,
     required: t = !1,
     disabled: r = !1,
     direction: l = "column",
     children: d,
-    className: u,
-    ...p
+    className: p,
+    ...u
   }, b) => {
-    const m = D(), h = p.id || m, v = a ? `${h}-helper` : void 0, y = s ? `${h}-error` : void 0, N = [v, y].filter(Boolean).join(" "), w = (S) => {
-      !r && i && i(S);
+    const h = $(), m = u.id || h, x = i ? `${m}-helper` : void 0, v = o ? `${m}-error` : void 0, N = [x, v].filter(Boolean).join(" "), S = (w) => {
+      !r && a && a(w);
     }, B = g({
       disabled: r
     });
-    return /* @__PURE__ */ I("div", { ref: b, className: x(ne.field, u), ...B, ...p, children: [
-      c && /* @__PURE__ */ o(k, { required: t, disabled: r, children: c }),
-      /* @__PURE__ */ o(ue.Provider, { value: { disabled: r, name: n, onChange: w, value: e }, children: /* @__PURE__ */ o(
+    return /* @__PURE__ */ I("div", { ref: b, className: y(oe.field, p), ...B, ...u, children: [
+      c && /* @__PURE__ */ s(A, { required: t, disabled: r, children: c }),
+      /* @__PURE__ */ s(ue.Provider, { value: { disabled: r, name: n, onChange: S, value: e }, children: /* @__PURE__ */ s(
         "div",
         {
-          className: ne.options,
+          className: oe.options,
           "data-direction": l,
           role: "radiogroup",
           "aria-describedby": N || void 0,
-          "aria-invalid": s ? "true" : void 0,
+          "aria-invalid": o ? "true" : void 0,
           children: d
         }
       ) }),
-      s && /* @__PURE__ */ o(A, { id: y, children: s }),
-      !s && a && /* @__PURE__ */ o(R, { id: v, children: a })
+      o && /* @__PURE__ */ s(G, { id: v, children: o }),
+      !o && i && /* @__PURE__ */ s(R, { id: x, children: i })
     ] });
   }
 );
 he.displayName = "RadioGroup";
 const me = f(
-  ({ value: e, children: i, disabled: n, ...c }, a) => {
-    const s = We(), t = s.value === e, r = s.disabled || n, l = () => {
-      r || s.onChange(e);
+  ({ value: e, children: a, disabled: n, ...c }, i) => {
+    const o = Ze(), t = o.value === e, r = o.disabled || n, l = () => {
+      r || o.onChange(e);
     };
-    return /* @__PURE__ */ o(
+    return /* @__PURE__ */ s(
       de,
       {
-        ref: a,
-        name: s.name,
+        ref: i,
+        name: o.name,
         value: e,
         checked: t,
         disabled: r,
         onChange: l,
         ...c,
-        children: i
+        children: a
       }
     );
   }
 );
 me.displayName = "RadioGroup.Option";
-const dt = Object.assign(he, {
+const ht = Object.assign(he, {
   Option: me
-}), be = P(void 0);
-function Xe() {
-  const e = Q(be);
+}), be = M(void 0);
+function qe() {
+  const e = V(be);
   if (!e)
     throw new Error("CheckboxGroup.Option must be used within CheckboxGroup");
   return e;
@@ -295,144 +295,144 @@ function Xe() {
 const fe = f(
   ({
     value: e,
-    onChange: i,
+    onChange: a,
     name: n,
     label: c,
-    helper: a,
-    error: s,
+    helper: i,
+    error: o,
     required: t = !1,
     disabled: r = !1,
     direction: l = "column",
     children: d,
-    className: u,
-    ...p
+    className: p,
+    ...u
   }, b) => {
-    const m = D(), h = p.id || m, v = a ? `${h}-helper` : void 0, y = s ? `${h}-error` : void 0, N = [v, y].filter(Boolean).join(" "), w = (S) => {
-      !r && i && i(S);
+    const h = $(), m = u.id || h, x = i ? `${m}-helper` : void 0, v = o ? `${m}-error` : void 0, N = [x, v].filter(Boolean).join(" "), S = (w) => {
+      !r && a && a(w);
     }, B = g({
       disabled: r
     });
-    return /* @__PURE__ */ I("div", { ref: b, className: x(oe.field, u), ...B, ...p, children: [
-      c && /* @__PURE__ */ o(k, { required: t, disabled: r, children: c }),
-      /* @__PURE__ */ o(be.Provider, { value: { disabled: r, name: n, onChange: w, value: e }, children: /* @__PURE__ */ o(
+    return /* @__PURE__ */ I("div", { ref: b, className: y(se.field, p), ...B, ...u, children: [
+      c && /* @__PURE__ */ s(A, { required: t, disabled: r, children: c }),
+      /* @__PURE__ */ s(be.Provider, { value: { disabled: r, name: n, onChange: S, value: e }, children: /* @__PURE__ */ s(
         "div",
         {
-          className: oe.options,
+          className: se.options,
           "data-direction": l,
           role: "group",
           "aria-describedby": N || void 0,
-          "aria-invalid": s ? "true" : void 0,
+          "aria-invalid": o ? "true" : void 0,
           children: d
         }
       ) }),
-      s && /* @__PURE__ */ o(A, { id: y, children: s }),
-      !s && a && /* @__PURE__ */ o(R, { id: v, children: a })
+      o && /* @__PURE__ */ s(G, { id: v, children: o }),
+      !o && i && /* @__PURE__ */ s(R, { id: x, children: i })
     ] });
   }
 );
 fe.displayName = "CheckboxGroup";
-const ve = f(
-  ({ value: e, children: i, disabled: n, ...c }, a) => {
-    const s = Xe(), t = s.value.includes(e), r = s.disabled || n, l = () => {
+const xe = f(
+  ({ value: e, children: a, disabled: n, ...c }, i) => {
+    const o = qe(), t = o.value.includes(e), r = o.disabled || n, l = () => {
       if (!r) {
-        const d = t ? s.value.filter((u) => u !== e) : [...s.value, e];
-        s.onChange(d);
+        const d = t ? o.value.filter((p) => p !== e) : [...o.value, e];
+        o.onChange(d);
       }
     };
-    return /* @__PURE__ */ o(
+    return /* @__PURE__ */ s(
       pe,
       {
-        ref: a,
-        name: s.name,
+        ref: i,
+        name: o.name,
         value: e,
         checked: t,
         disabled: r,
         onChange: l,
         ...c,
-        children: i
+        children: a
       }
     );
   }
 );
-ve.displayName = "CheckboxGroup.Option";
-const pt = Object.assign(fe, {
-  Option: ve
-}), ye = P(void 0);
-function Ye() {
-  const e = Q(ye);
+xe.displayName = "CheckboxGroup.Option";
+const mt = Object.assign(fe, {
+  Option: xe
+}), ve = M(void 0);
+function et() {
+  const e = V(ve);
   if (!e)
     throw new Error("ChipInput.Option must be used within ChipInput");
   return e;
 }
-const xe = f(
+const ye = f(
   ({
     value: e,
-    onChange: i,
+    onChange: a,
     multiple: n = !1,
     name: c,
-    label: a,
-    helper: s,
+    label: i,
+    helper: o,
     error: t,
     required: r = !1,
     disabled: l = !1,
     gap: d = "2",
-    wrap: u = !0,
-    children: p,
+    wrap: p = !0,
+    children: u,
     className: b,
-    ...m
-  }, h) => {
-    const v = D(), y = m.id || v, N = s ? `${y}-helper` : void 0, w = t ? `${y}-error` : void 0, B = [N, w].filter(Boolean).join(" "), S = (E) => {
-      l || i(E);
-    }, $ = g({
+    ...h
+  }, m) => {
+    const x = $(), v = h.id || x, N = o ? `${v}-helper` : void 0, S = t ? `${v}-error` : void 0, B = [N, S].filter(Boolean).join(" "), w = (D) => {
+      l || a(D);
+    }, E = g({
       invalid: !!t
-    }), G = n ? "group" : "radiogroup";
-    return /* @__PURE__ */ I("div", { ref: h, className: x(Y.field, b), ...$, ...m, children: [
-      a && /* @__PURE__ */ o(k, { required: r, disabled: l, children: a }),
-      /* @__PURE__ */ o(
-        ye.Provider,
+    }), k = n ? "group" : "radiogroup";
+    return /* @__PURE__ */ I("div", { ref: m, className: y(Z.field, b), ...E, ...h, children: [
+      i && /* @__PURE__ */ s(A, { required: r, disabled: l, children: i }),
+      /* @__PURE__ */ s(
+        ve.Provider,
         {
           value: {
             disabled: l,
             multiple: n,
             name: c,
-            onChange: S,
+            onChange: w,
             value: e
           },
-          children: /* @__PURE__ */ o(
+          children: /* @__PURE__ */ s(
             "div",
             {
-              className: Y.options,
+              className: Z.options,
               "data-gap": d,
-              "data-wrap": u,
-              role: G,
+              "data-wrap": p,
+              role: k,
               "aria-describedby": B || void 0,
               "aria-invalid": t ? "true" : void 0,
-              children: p
+              children: u
             }
           )
         }
       ),
-      t && /* @__PURE__ */ o(A, { id: w, children: t }),
-      !t && s && /* @__PURE__ */ o(R, { id: N, children: s })
+      t && /* @__PURE__ */ s(G, { id: S, children: t }),
+      !t && o && /* @__PURE__ */ s(R, { id: N, children: o })
     ] });
   }
 );
-xe.displayName = "ChipInput";
+ye.displayName = "ChipInput";
 const Ie = f(
-  ({ value: e, children: i, disabled: n, iconLeft: c, iconRight: a, ...s }, t) => {
-    const r = Ye(), l = r.disabled || n, d = !!(c || a);
-    let u = !1;
-    r.multiple ? u = Array.isArray(r.value) && r.value.includes(e) : u = r.value === e;
-    const p = () => {
+  ({ value: e, children: a, disabled: n, iconLeft: c, iconRight: i, ...o }, t) => {
+    const r = et(), l = r.disabled || n, d = !!(c || i);
+    let p = !1;
+    r.multiple ? p = Array.isArray(r.value) && r.value.includes(e) : p = r.value === e;
+    const u = () => {
       if (!l)
         if (r.multiple) {
-          const m = Array.isArray(r.value) ? r.value : [], h = u ? m.filter((v) => v !== e) : [...m, e];
-          r.onChange(h);
+          const h = Array.isArray(r.value) ? r.value : [], m = p ? h.filter((x) => x !== e) : [...h, e];
+          r.onChange(m);
         } else
           r.onChange(e);
     }, b = g({
       disabled: l,
-      selected: u,
+      selected: p,
       ...d && { "has-icon": !0 }
     });
     return /* @__PURE__ */ I(
@@ -440,161 +440,135 @@ const Ie = f(
       {
         ref: t,
         type: "button",
-        className: Y.option,
-        onClick: p,
+        className: Z.option,
+        onClick: u,
         disabled: l,
-        "aria-pressed": u,
+        "aria-pressed": p,
         ...b,
-        ...s,
+        ...o,
         children: [
           c,
-          i,
-          a
+          a,
+          i
         ]
       }
     );
   }
 );
 Ie.displayName = "ChipInput.Option";
-const ut = Object.assign(xe, {
+const bt = Object.assign(ye, {
   Option: Ie
-}), Ce = P(void 0);
-function V() {
-  const e = Q(Ce);
+}), Ce = M(void 0);
+function j() {
+  const e = V(Ce);
   if (!e)
     throw new Error("ComboboxInput subcomponents must be used within ComboboxInput");
   return e;
 }
 const ge = f(
-  ({ children: e, className: i, ...n }, c) => {
-    const a = V();
-    return /* @__PURE__ */ o(se, { open: a.isOpen, onOpenChange: (s) => !s && a.closeListbox(), placement: "right", children: /* @__PURE__ */ o(se.Body, { children: /* @__PURE__ */ I("div", { className: C["drawer-container"], children: [
-      /* @__PURE__ */ o("div", { className: C["drawer-input-wrapper"], children: /* @__PURE__ */ o(
-        "input",
-        {
-          type: "text",
-          className: C["drawer-input"],
-          placeholder: "Search options...",
-          value: a.searchQuery || "",
-          onChange: (s) => {
-            var t;
-            return (t = a.setSearchQuery) == null ? void 0 : t.call(a, s.currentTarget.value);
-          },
-          "aria-label": "Search options"
-        }
-      ) }),
-      /* @__PURE__ */ o(
+  ({ search: e, children: a, className: n, ...c }, i) => {
+    const o = j();
+    return /* @__PURE__ */ s(ae, { open: o.isOpen, onOpenChange: (t) => !t && o.closeListbox(), placement: "right", children: /* @__PURE__ */ s(ae.Body, { children: /* @__PURE__ */ I("div", { className: C["drawer-container"], children: [
+      /* @__PURE__ */ s("div", { className: C["drawer-input-wrapper"], children: e }),
+      /* @__PURE__ */ s(
         "ul",
         {
-          ref: c,
+          ref: i,
           role: "listbox",
           "aria-multiselectable": "true",
-          className: x(C["drawer-listbox"], i),
-          ...n,
-          children: e
+          className: y(C["drawer-listbox"], n),
+          ...c,
+          children: a
         }
       )
     ] }) }) });
   }
 );
 ge.displayName = "ComboboxInput.Drawer";
-function Ze(e) {
-  const [i, n] = j(e), [c, a] = j(!1), [s, t] = j(() => /* @__PURE__ */ new Map());
-  M(() => {
+function tt(e) {
+  const [a, n] = L(e), [c, i] = L(!1), [o, t] = L(() => /* @__PURE__ */ new Map());
+  Q(() => {
     n(e);
   }, [e]);
   const r = K(() => {
-    a((p) => !p);
+    i((u) => !u);
   }, []), l = K(() => {
-    a(!1);
-  }, []), d = K((p, b) => {
-    t((m) => {
-      const h = new Map(m);
-      return h.set(p, b), h;
+    i(!1);
+  }, []), d = K((u, b) => {
+    t((h) => {
+      const m = new Map(h);
+      return m.set(u, b), m;
     });
-  }, []), u = K((p) => {
+  }, []), p = K((u) => {
     t((b) => {
-      const m = new Map(b);
-      return m.delete(p), m;
+      const h = new Map(b);
+      return h.delete(u), h;
     });
   }, []);
   return {
-    internalValue: i,
+    internalValue: a,
     setInternalValue: n,
     isOpen: c,
     toggleOpen: r,
     closeListbox: l,
-    optionRegistry: s,
+    optionRegistry: o,
     registerOption: d,
-    unregisterOption: u
+    unregisterOption: p
   };
 }
-function qe(e, i) {
-  const [n, c] = j("bottom"), a = Le(null);
-  return M(() => {
-    if (i !== "popup" || !e) return;
-    const s = a.current;
-    if (!s) return;
-    s.matches(":popover-open") || s.showPopover(), requestAnimationFrame(() => {
-      const r = s.previousElementSibling;
+function nt(e, a) {
+  const [n, c] = L("bottom"), i = Me(null);
+  return Q(() => {
+    if (a !== "popup" || !e) return;
+    const o = i.current;
+    if (!o) return;
+    o.matches(":popover-open") || o.showPopover(), requestAnimationFrame(() => {
+      const r = o.previousElementSibling;
       if (!r) return;
-      const l = r.getBoundingClientRect(), d = s.getBoundingClientRect(), u = {
+      const l = r.getBoundingClientRect(), d = o.getBoundingClientRect(), p = {
         width: d.width,
         height: d.height
-      }, p = Fe(
+      }, u = Ve(
         l,
-        u,
+        p,
         100,
         ["top", "bottom"]
       );
-      c(p);
+      c(u);
     });
-  }, [e, i]), { internalRef: a, placement: n };
+  }, [e, a]), { internalRef: i, placement: n };
 }
 const Ne = f(
-  ({ children: e, className: i, ...n }, c) => {
-    const a = V(), { internalRef: s, placement: t } = qe(a.isOpen, a.variant);
-    M(() => {
-      const l = s.current;
-      if (!l) return;
-      const d = () => {
-        l.matches(":popover-open") || a.closeListbox();
+  ({ search: e, children: a, className: n, ...c }, i) => {
+    const o = j(), { internalRef: t, placement: r } = nt(o.isOpen, o.variant);
+    Q(() => {
+      const d = t.current;
+      if (!d) return;
+      const p = () => {
+        d.matches(":popover-open") || o.closeListbox();
       };
-      return l.addEventListener("toggle", d), () => l.removeEventListener("toggle", d);
-    }, [a, s]);
-    const r = g({ placement: t });
-    return /* @__PURE__ */ o(
+      return d.addEventListener("toggle", p), () => d.removeEventListener("toggle", p);
+    }, [o, t]);
+    const l = g({ placement: r });
+    return /* @__PURE__ */ I(
       "ul",
       {
-        ref: (l) => {
-          s.current = l, typeof c == "function" ? c(l) : c && (c.current = l);
+        ref: (d) => {
+          t.current = d, typeof i == "function" ? i(d) : i && (i.current = d);
         },
         role: "listbox",
         "aria-multiselectable": "true",
-        className: x(C.listbox, i),
+        className: y(C.listbox, n),
         popover: "auto",
-        ...r,
+        ...l,
         style: {
-          positionAnchor: a.anchorName
+          positionAnchor: o.anchorName
         },
-        ...n,
-        children: /* @__PURE__ */ I("div", { className: C["listbox-inner"], children: [
-          /* @__PURE__ */ o("div", { className: C["drawer-input-wrapper"], children: /* @__PURE__ */ o(
-            "input",
-            {
-              type: "text",
-              className: C["drawer-input"],
-              placeholder: "Search options...",
-              value: a.searchQuery || "",
-              onChange: (l) => {
-                var d;
-                return (d = a.setSearchQuery) == null ? void 0 : d.call(a, l.currentTarget.value);
-              },
-              "aria-label": "Search options"
-            }
-          ) }),
-          e
-        ] })
+        ...c,
+        children: [
+          /* @__PURE__ */ s("div", { className: C["listbox-search"], children: /* @__PURE__ */ s("div", { className: C["drawer-input-wrapper"], children: e }) }),
+          /* @__PURE__ */ s("div", { className: C["listbox-inner"], children: a })
+        ]
       }
     );
   }
@@ -603,95 +577,98 @@ Ne.displayName = "ComboboxInput.Listbox";
 const Se = f(
   ({
     value: e,
-    onChange: i,
+    onChange: a,
     variant: n = "popup",
     disabled: c = !1,
-    invalid: a = !1,
-    label: s,
+    invalid: i = !1,
+    label: o,
     helper: t,
     error: r,
     required: l = !1,
-    children: d,
+    multiple: d = !1,
+    children: p,
     className: u,
-    ...p
-  }, b) => {
-    const m = D(), h = p.id || m, v = `${h}-button`, y = t ? `${h}-helper` : void 0, N = r ? `${h}-error` : void 0, w = [y, N].filter(Boolean).join(" "), B = `--combobox-anchor-${h.replace(/[^a-z0-9-]/gi, "")}`, {
-      internalValue: S,
-      setInternalValue: $,
-      isOpen: G,
-      toggleOpen: E,
-      closeListbox: z,
-      optionRegistry: J,
-      registerOption: W,
-      unregisterOption: X
-    } = Ze(e), [O, Ge] = j("");
-    M(() => {
-      $(e);
-    }, [e, $]);
-    const De = (q) => {
-      c || ($(q), i(q));
-    }, $e = g({
-      invalid: !!(r || a),
+    ...b
+  }, h) => {
+    const m = $(), x = b.id || m, v = `${x}-button`, N = t ? `${x}-helper` : void 0, S = r ? `${x}-error` : void 0, B = [N, S].filter(Boolean).join(" "), w = `--combobox-anchor-${x.replace(/[^a-z0-9-]/gi, "")}`, E = q(() => d ? Array.isArray(e) ? e : [] : e === null ? [] : [e], [e, d]), {
+      internalValue: k,
+      setInternalValue: D,
+      isOpen: z,
+      toggleOpen: J,
+      closeListbox: W,
+      optionRegistry: X,
+      registerOption: O,
+      unregisterOption: De
+    } = tt(E), [$e, Ee] = L("");
+    Q(() => {
+      D(E);
+    }, [E, D]);
+    const Le = (Y) => {
+      c || (D(Y), a(d ? Y : Y[0] ?? null));
+    }, je = g({
+      invalid: !!(r || i),
       disabled: c
     });
-    return /* @__PURE__ */ I("div", { ref: b, className: x(C.field, u), ...$e, ...p, children: [
-      s && /* @__PURE__ */ o(k, { required: l, disabled: c, htmlFor: v, children: s }),
-      /* @__PURE__ */ o(
+    return /* @__PURE__ */ I("div", { ref: h, className: y(C.field, u), ...je, ...b, children: [
+      o && /* @__PURE__ */ s(A, { required: l, disabled: c, htmlFor: v, children: o }),
+      /* @__PURE__ */ s(
         Ce.Provider,
         {
           value: {
-            value: S,
-            onChange: De,
-            isOpen: G,
-            toggleOpen: E,
-            closeListbox: z,
+            value: k,
+            onChange: Le,
+            isOpen: z,
+            toggleOpen: J,
+            closeListbox: W,
             variant: n,
-            anchorName: B,
+            anchorName: w,
             buttonId: v,
-            optionRegistry: J,
-            registerOption: W,
-            unregisterOption: X,
+            optionRegistry: X,
+            registerOption: O,
+            unregisterOption: De,
             disabled: c,
-            searchQuery: O,
-            setSearchQuery: Ge
+            multiple: d,
+            searchQuery: $e,
+            setSearchQuery: Ee
           },
-          children: /* @__PURE__ */ o("div", { className: C.root, "aria-describedby": w || void 0, children: d })
+          children: /* @__PURE__ */ s("div", { className: C.root, "aria-describedby": B || void 0, children: p })
         }
       ),
-      r && /* @__PURE__ */ o(A, { id: N, children: r }),
-      !r && t && S.length === 0 && /* @__PURE__ */ o(R, { id: y, children: t })
+      r && /* @__PURE__ */ s(G, { id: S, children: r }),
+      !r && t && k.length === 0 && /* @__PURE__ */ s(R, { id: N, children: t })
     ] });
   }
 );
 Se.displayName = "ComboboxInput";
 const we = f(
-  ({ children: e, className: i, iconLeft: n, iconRight: c, ...a }, s) => {
-    const t = V(), r = t.value.length === 0, l = g({
+  ({ children: e, className: a, iconLeft: n, iconRight: c, ...i }, o) => {
+    const t = j(), r = t.value.length === 0, l = g({
       open: t.isOpen,
       disabled: t.disabled,
       "has-left-icon": !!n,
       "has-right-icon": !0
     }), d = {
       anchorName: t.anchorName
-    }, u = e || (r ? "Select" : `${t.value.length} selected`);
+    }, p = e || // oxlint-disable-next-line no-nested-ternary
+    (r ? "Select" : t.multiple ? `${t.value.length} selected` : t.optionRegistry.get(t.value[0]) ?? t.value[0]);
     return /* @__PURE__ */ I(
       "button",
       {
-        ref: s,
+        ref: o,
         id: t.buttonId,
         type: "button",
-        className: x(C.button, i),
+        className: y(C.button, a),
         onClick: () => !t.disabled && t.toggleOpen(),
         disabled: t.disabled,
         "aria-expanded": t.isOpen,
         "aria-haspopup": "listbox",
         style: d,
         ...l,
-        ...a,
+        ...i,
         children: [
-          n && /* @__PURE__ */ o("span", { className: C["left-icon"], children: n }),
-          /* @__PURE__ */ o("span", { className: C["button-content"], ...r && { "data-placeholder": "" }, children: u }),
-          c ? /* @__PURE__ */ o("span", { className: C["right-icon"], children: c }) : /* @__PURE__ */ o("span", { className: C["right-icon"], "data-chevron": !0, children: /* @__PURE__ */ o(ze, {}) })
+          n && /* @__PURE__ */ s("span", { className: C["left-icon"], children: n }),
+          /* @__PURE__ */ s("span", { className: C["button-content"], ...r && { "data-placeholder": "" }, children: p }),
+          c ? /* @__PURE__ */ s("span", { className: C["right-icon"], children: c }) : /* @__PURE__ */ s("span", { className: C["right-icon"], "data-chevron": !0, children: /* @__PURE__ */ s(Ke, {}) })
         ]
       }
     );
@@ -699,31 +676,34 @@ const we = f(
 );
 we.displayName = "ComboboxInput.Button";
 const Oe = f(
-  ({ value: e, children: i, disabled: n = !1, className: c, ...a }, s) => {
-    const t = V(), r = t.disabled || n, l = t.value.includes(e), d = typeof i == "string" ? i : String(e), u = !t.searchQuery || d.toLowerCase().includes(t.searchQuery.toLowerCase()) || e.toLowerCase().includes(t.searchQuery.toLowerCase());
-    M(() => (t.registerOption(e, d), () => t.unregisterOption(e)), [e, d, t.registerOption, t.unregisterOption]);
-    const p = () => {
-      if (r) return;
-      const h = l ? t.value.filter((v) => v !== e) : [...t.value, e];
-      t.onChange(h);
-    }, b = (h) => {
-      (h.key === "Enter" || h.key === " ") && (h.preventDefault(), p());
-    }, m = g({ active: l, disabled: r });
-    return u ? /* @__PURE__ */ I(
+  ({ value: e, children: a, disabled: n = !1, className: c, ...i }, o) => {
+    const t = j(), r = t.disabled || n, l = t.value.includes(e), d = typeof a == "string" ? a : String(e), p = !t.searchQuery || d.toLowerCase().includes(t.searchQuery.toLowerCase()) || e.toLowerCase().includes(t.searchQuery.toLowerCase());
+    Q(() => (t.registerOption(e, d), () => t.unregisterOption(e)), [e, d, t.registerOption, t.unregisterOption]);
+    const u = () => {
+      if (!r)
+        if (t.multiple) {
+          const m = l ? t.value.filter((x) => x !== e) : [...t.value, e];
+          t.onChange(m);
+        } else
+          t.onChange(l ? [] : [e]), t.closeListbox();
+    }, b = (m) => {
+      (m.key === "Enter" || m.key === " ") && (m.preventDefault(), u());
+    }, h = g({ active: l, disabled: r });
+    return p ? /* @__PURE__ */ I(
       "li",
       {
-        ref: s,
+        ref: o,
         role: "option",
-        className: x(C.option, c),
-        onClick: p,
+        className: y(C.option, c),
+        onClick: u,
         onKeyDown: b,
         "aria-selected": l,
         tabIndex: r ? -1 : 0,
-        ...m,
-        ...a,
+        ...h,
+        ...i,
         children: [
-          /* @__PURE__ */ o("span", { className: C["option-check"], children: /* @__PURE__ */ o(Ue, { width: "1em", height: "1em" }) }),
-          /* @__PURE__ */ o("span", { children: i })
+          /* @__PURE__ */ s("span", { className: C["option-check"], children: /* @__PURE__ */ s(_e, { width: "1em", height: "1em" }) }),
+          /* @__PURE__ */ s("span", { children: a })
         ]
       }
     ) : null;
@@ -731,36 +711,52 @@ const Oe = f(
 );
 Oe.displayName = "ComboboxInput.Option";
 const Be = f(
-  ({ className: e, ...i }, n) => {
-    const c = V();
+  ({ className: e, ...a }, n) => {
+    const c = j();
     if (c.value.length === 0) return null;
-    const a = (s) => {
-      c.onChange(c.value.filter((t) => t !== s));
+    const i = (o) => {
+      c.onChange(c.value.filter((t) => t !== o));
     };
-    return /* @__PURE__ */ o("div", { ref: n, className: x(C.chips, e), role: "group", ...i, children: c.value.map((s) => {
-      const t = c.optionRegistry.get(s) ?? s;
-      return /* @__PURE__ */ o(
-        Pe,
-        {
-          disabled: c.disabled,
-          onClick: () => a(s),
-          children: t
-        },
-        s
-      );
+    return /* @__PURE__ */ s("div", { ref: n, className: y(C.chips, e), role: "group", ...a, children: c.value.map((o) => {
+      const t = c.optionRegistry.get(o) ?? o;
+      return /* @__PURE__ */ s(Qe, { disabled: c.disabled, onClick: () => i(o), children: t }, o);
     }) });
   }
 );
 Be.displayName = "ComboboxInput.SelectionChips";
-const ht = Object.assign(Se, {
+const ke = f(
+  ({ name: e, value: a, onChange: n, placeholder: c = "Search options...", ...i }, o) => {
+    const t = j(), r = (l) => {
+      var d;
+      n(l), (d = t.setSearchQuery) == null || d.call(t, l.currentTarget.value);
+    };
+    return /* @__PURE__ */ s(
+      "input",
+      {
+        ref: o,
+        type: "text",
+        name: e,
+        className: C["drawer-input"],
+        placeholder: c,
+        value: a,
+        onChange: r,
+        "aria-label": "Search options",
+        ...i
+      }
+    );
+  }
+);
+ke.displayName = "ComboboxInput.ListboxSearch";
+const ft = Object.assign(Se, {
   Button: we,
   Listbox: Ne,
   Drawer: ge,
   Option: Oe,
-  SelectionChips: Be
-}), ke = P(void 0);
-function et() {
-  const e = Q(ke);
+  SelectionChips: Be,
+  ListboxSearch: ke
+}), Ae = M(void 0);
+function ot() {
+  const e = V(Ae);
   if (!e)
     throw new Error("SelectableInput.Option must be used within SelectableInput");
   return e;
@@ -768,50 +764,50 @@ function et() {
 const Re = f(
   ({
     value: e,
-    onChange: i,
+    onChange: a,
     multiple: n = !1,
     name: c,
-    disabled: a = !1,
-    placement: s = "top",
+    disabled: i = !1,
+    placement: o = "top",
     children: t,
     className: r,
     ...l
   }, d) => {
-    const u = (m) => {
-      a || i(m);
-    }, p = g({
-      disabled: a
+    const p = (h) => {
+      i || a(h);
+    }, u = g({
+      disabled: i
     }), b = n ? "group" : "radiogroup";
-    return /* @__PURE__ */ o("div", { ref: d, className: x(F.field, r), ...p, ...l, children: /* @__PURE__ */ o(
-      ke.Provider,
+    return /* @__PURE__ */ s("div", { ref: d, className: y(P.field, r), ...u, ...l, children: /* @__PURE__ */ s(
+      Ae.Provider,
       {
         value: {
-          disabled: a,
+          disabled: i,
           multiple: n,
           name: c,
-          onChange: u,
+          onChange: p,
           value: e,
-          placement: s
+          placement: o
         },
-        children: /* @__PURE__ */ o("div", { role: b, children: t })
+        children: /* @__PURE__ */ s("div", { role: b, children: t })
       }
     ) });
   }
 );
 Re.displayName = "SelectableInput";
-const Ae = f(
-  ({ value: e, children: i, disabled: n, className: c, ...a }, s) => {
-    const t = et(), r = t.disabled || n;
+const Ge = f(
+  ({ value: e, children: a, disabled: n, className: c, ...i }, o) => {
+    const t = ot(), r = t.disabled || n;
     let l = !1;
     t.multiple ? l = Array.isArray(t.value) && t.value.includes(e) : l = t.value === e;
     const d = () => {
       if (!r)
         if (t.multiple) {
-          const p = Array.isArray(t.value) ? t.value : [], b = l ? p.filter((m) => m !== e) : [...p, e];
+          const u = Array.isArray(t.value) ? t.value : [], b = l ? u.filter((h) => h !== e) : [...u, e];
           t.onChange(b);
         } else
           t.onChange(e);
-    }, u = g({
+    }, p = g({
       disabled: r,
       selected: l,
       placement: t.placement
@@ -819,16 +815,16 @@ const Ae = f(
     return /* @__PURE__ */ I(
       "label",
       {
-        ref: s,
-        className: x(F.option, c),
-        ...u,
-        ...a,
+        ref: o,
+        className: y(P.option, c),
+        ...p,
+        ...i,
         children: [
-          /* @__PURE__ */ o(
+          /* @__PURE__ */ s(
             "input",
             {
               type: "checkbox",
-              className: F.input,
+              className: P.input,
               name: t.name,
               value: e,
               checked: l,
@@ -837,118 +833,118 @@ const Ae = f(
               "aria-disabled": r
             }
           ),
-          /* @__PURE__ */ o("span", { className: F.indicator }),
-          /* @__PURE__ */ o("div", { className: F.content, children: i })
+          /* @__PURE__ */ s("span", { className: P.indicator }),
+          /* @__PURE__ */ s("div", { className: P.content, children: a })
         ]
       }
     );
   }
 );
-Ae.displayName = "SelectableInput.Option";
-const mt = Object.assign(Re, {
-  Option: Ae
+Ge.displayName = "SelectableInput.Option";
+const xt = Object.assign(Re, {
+  Option: Ge
 });
-function tt() {
+function st() {
   try {
-    return Intl.supportedValuesOf("currency").map((i) => ({
-      code: i,
-      label: i
+    return Intl.supportedValuesOf("currency").map((a) => ({
+      code: a,
+      label: a
     }));
   } catch {
     return [{ code: "USD", label: "USD" }];
   }
 }
-const nt = f(
+const at = f(
   ({
     label: e,
-    helper: i,
+    helper: a,
     error: n,
     required: c = !1,
-    disabled: a = !1,
-    readOnly: s = !1,
+    disabled: i = !1,
+    readOnly: o = !1,
     name: t,
     amountValue: r = "",
     onAmountChange: l,
     currencyValue: d = "USD",
-    onCurrencyChange: u,
-    currencies: p,
+    onCurrencyChange: p,
+    currencies: u,
     currencyName: b,
-    id: m,
-    className: h,
-    ...v
-  }, y) => {
-    const N = ae(() => tt(), []), w = ae(() => p ? p.map((O) => ({
+    id: h,
+    className: m,
+    ...x
+  }, v) => {
+    const N = q(() => st(), []), S = q(() => u ? u.map((O) => ({
       code: O,
       label: O
-    })) : N, [p, N]), [B, S] = j(!1), $ = D(), G = m || $, E = i ? `${G}-helper` : void 0, z = n ? `${G}-error` : void 0, J = [E, z].filter(Boolean).join(" "), W = b || (t ? `${t}-currency` : void 0), X = g({
-      disabled: a,
+    })) : N, [u, N]), [B, w] = L(!1), E = $(), k = h || E, D = a ? `${k}-helper` : void 0, z = n ? `${k}-error` : void 0, J = [D, z].filter(Boolean).join(" "), W = b || (t ? `${t}-currency` : void 0), X = g({
+      disabled: i,
       invalid: !!n,
-      readOnly: s,
+      readOnly: o,
       focused: B
     });
-    return /* @__PURE__ */ I("div", { className: x(L.field, h), children: [
-      e && /* @__PURE__ */ o(k, { htmlFor: G, required: c, disabled: a, children: e }),
-      /* @__PURE__ */ I("div", { className: L.wrapper, ...X, children: [
-        /* @__PURE__ */ o(
+    return /* @__PURE__ */ I("div", { className: y(F.field, m), children: [
+      e && /* @__PURE__ */ s(A, { htmlFor: k, required: c, disabled: i, children: e }),
+      /* @__PURE__ */ I("div", { className: F.wrapper, ...X, children: [
+        /* @__PURE__ */ s(
           "select",
           {
-            className: L["currency-select"],
+            className: F["currency-select"],
             name: W,
             value: d,
-            onChange: (O) => u == null ? void 0 : u(O.target.value),
-            onFocus: () => S(!0),
-            onBlur: () => S(!1),
-            disabled: a,
-            "aria-disabled": a ? "true" : void 0,
-            children: w.map((O) => /* @__PURE__ */ o("option", { value: O.code, children: O.label }, O.code))
+            onChange: (O) => p == null ? void 0 : p(O.target.value),
+            onFocus: () => w(!0),
+            onBlur: () => w(!1),
+            disabled: i,
+            "aria-disabled": i ? "true" : void 0,
+            children: S.map((O) => /* @__PURE__ */ s("option", { value: O.code, children: O.label }, O.code))
           }
         ),
-        /* @__PURE__ */ o("span", { className: L.divider, "aria-hidden": !0 }),
-        /* @__PURE__ */ o(
+        /* @__PURE__ */ s("span", { className: F.divider, "aria-hidden": !0 }),
+        /* @__PURE__ */ s(
           "input",
           {
-            ref: y,
-            id: G,
+            ref: v,
+            id: k,
             type: "text",
             inputMode: "decimal",
-            className: L["amount-input"],
+            className: F["amount-input"],
             name: t,
             value: r,
             onChange: (O) => l == null ? void 0 : l(O.target.value),
-            onFocus: () => S(!0),
-            onBlur: () => S(!1),
-            disabled: a,
-            readOnly: s,
+            onFocus: () => w(!0),
+            onBlur: () => w(!1),
+            disabled: i,
+            readOnly: o,
             required: c,
             "aria-invalid": n ? "true" : void 0,
-            "aria-disabled": a ? "true" : void 0,
+            "aria-disabled": i ? "true" : void 0,
             "aria-describedby": J || void 0,
-            ...v
+            ...x
           }
         )
       ] }),
-      n && /* @__PURE__ */ o(A, { id: z, children: n }),
-      !n && i && /* @__PURE__ */ o(R, { id: E, children: i })
+      n && /* @__PURE__ */ s(G, { id: z, children: n }),
+      !n && a && /* @__PURE__ */ s(R, { id: D, children: a })
     ] });
   }
 );
-nt.displayName = "CurrencyInput";
+at.displayName = "CurrencyInput";
 export {
   pe as Checkbox,
-  pt as CheckboxGroup,
-  ut as ChipInput,
-  ht as ComboboxInput,
-  nt as CurrencyInput,
-  Ke as EmailInput,
-  A as ErrorText,
+  mt as CheckboxGroup,
+  bt as ChipInput,
+  ft as ComboboxInput,
+  at as CurrencyInput,
+  We as EmailInput,
+  G as ErrorText,
   R as HelperText,
-  k as Label,
-  _e as PasswordInput,
+  A as Label,
+  Xe as PasswordInput,
   de as Radio,
-  dt as RadioGroup,
-  He as SearchInput,
+  ht as RadioGroup,
+  Je as SearchInput,
   le as Select,
-  mt as SelectableInput,
-  Je as TextArea,
+  xt as SelectableInput,
+  Ye as TextArea,
   _ as TextInput
 };