@alfadocs/ui-kit 0.17.1 → 0.17.2

package/dist/_chunks/{combobox-D5tWe0t_.js → combobox-Da9eq00i.js}

@@ -1,35 +1,36 @@
-import { jsx as o, jsxs as I } from "react/jsx-runtime";
-import { forwardRef as $e, useContext as ke, useState as G, useMemo as M, useRef as v, useLayoutEffect as Oe, useEffect as E, useCallback as Ve } from "react";
-import * as F from "@radix-ui/react-popover";
-import { R as qe, _ as u, P as Be } from "./index-4xgbg-sn.js";
-import { c as D } from "./index-D2ZczOXr.js";
-import { useTranslation as Ue } from "react-i18next";
-import { u as He, F as Ge } from "./form-field-context-B3APVHKx.js";
-import { c as Me } from "./compose-refs-C0k0tdqF.js";
-import { n as L } from "./normalize-diacritics-BNGbFNlJ.js";
-import { g as Le } from "./group-options-BvKhQ3xb.js";
-import { I as Qe, a as Q, d as K, c as Ke } from "./input-surface-xyERuLU_.js";
-import { u as Xe } from "./registry-C9nwlNyL.js";
-import { X as We } from "./x-CCcI3eJp.js";
-import { C as Je } from "./check-DPdL_Sm7.js";
-const Ye = {
+import { jsx as o, jsxs as N } from "react/jsx-runtime";
+import { forwardRef as je, useContext as Ae, useMemo as U, useState as oe, useRef as g, useLayoutEffect as Te, useEffect as I, useCallback as $e } from "react";
+import * as _ from "@radix-ui/react-popover";
+import { R as ke, _ as c, P as Oe } from "./index-4xgbg-sn.js";
+import { c as E } from "./index-D2ZczOXr.js";
+import { useTranslation as qe } from "react-i18next";
+import { u as Be, F as Ue } from "./form-field-context-B3APVHKx.js";
+import { c as He } from "./compose-refs-C0k0tdqF.js";
+import { n as H } from "./normalize-diacritics-BNGbFNlJ.js";
+import { g as Ge } from "./group-options-BvKhQ3xb.js";
+import { u as Me } from "./use-controllable-state-BiY4xTzM.js";
+import { I as Le, a as G, d as M, c as Qe } from "./input-surface-xyERuLU_.js";
+import { u as Ke } from "./registry-C9nwlNyL.js";
+import { X as Xe } from "./x-CCcI3eJp.js";
+import { C as We } from "./check-DPdL_Sm7.js";
+const Je = {
   id: "combobox",
   capabilities: ["select_single", "pick", "filter", "open", "close"],
   state: {
     value: {
       type: "string | null",
       description: "Currently-selected option value, or null when nothing is selected.",
-      read: (s) => s.getValue()
+      read: (t) => t.getValue()
     },
     query: {
       type: "string",
       description: "Current filter query in the combobox input.",
-      read: (s) => s.getQuery()
+      read: (t) => t.getQuery()
     },
     isOpen: {
       type: "boolean",
       description: "True when the option list is visible.",
-      read: (s) => s.getIsOpen()
+      read: (t) => t.getIsOpen()
     }
   },
   actions: {
@@ -37,37 +38,37 @@ const Ye = {
       safety: "read",
       argsType: "{ value: string | null }",
       description: "Set the selected value programmatically.",
-      invoke: (s, r) => {
-        s.setValue(r.value);
+      invoke: (t, r) => {
+        t.setValue(r.value);
       }
     },
     apply_filter: {
       safety: "read",
       argsType: "{ query: string }",
       description: "Set the filter query for the option list.",
-      invoke: (s, r) => {
-        s.setQuery(r.query);
+      invoke: (t, r) => {
+        t.setQuery(r.query);
       }
     },
     clear_selection: {
       safety: "read",
       description: "Clear the current selection.",
-      invoke: (s) => {
-        s.clear();
+      invoke: (t) => {
+        t.clear();
       }
     },
     open: {
       safety: "read",
       description: "Open the option list.",
-      invoke: (s) => {
-        s.open();
+      invoke: (t) => {
+        t.open();
       }
     },
     close: {
       safety: "read",
       description: "Close the option list.",
-      invoke: (s) => {
-        s.close();
+      invoke: (t) => {
+        t.close();
       }
     }
   },
@@ -83,7 +84,7 @@ const Ye = {
       description: "Each option emits its value as data-option-id."
     }
   }
-}, Ze = D(
+}, Ye = E(
   [
     "ds:peer ds:w-full ds:bg-transparent ds:text-foreground ds:placeholder:text-muted-foreground",
     "ds:outline-none ds:border-0",
@@ -101,26 +102,26 @@ const Ye = {
       size: "md"
     }
   }
-), et = D(
+), Ze = E(
   [
     "ds:group ds:relative ds:inline-flex ds:items-center ds:gap-[var(--spacing-sm)] ds:w-full",
-    Ke
+    Qe
   ].join(" "),
   {
     variants: {
       size: {
-        sm: `${Q.sm} ${K.sm}`,
-        md: `${Q.md} ${K.md}`,
-        lg: `${Q.lg} ${K.lg}`
+        sm: `${G.sm} ${M.sm}`,
+        md: `${G.md} ${M.md}`,
+        lg: `${G.lg} ${M.lg}`
       },
-      tone: Qe
+      tone: Le
     },
     defaultVariants: {
       size: "md",
       tone: "default"
     }
   }
-), tt = D(
+), et = E(
   [
     "ds:z-[var(--z-popover)] ds:overflow-hidden ds:w-[var(--radix-popover-trigger-width)]",
     "ds:rounded-[var(--radius-md)] ds:border ds:border-border ds:bg-background ds:text-foreground",
@@ -132,7 +133,7 @@ const Ye = {
     "ds:data-[side=top]:slide-in-from-bottom-2",
     "ds:motion-reduce:animate-none"
   ].join(" ")
-), ae = D(
+), ne = E(
   [
     "ds:relative ds:flex ds:cursor-pointer ds:items-center ds:gap-[var(--spacing-sm)]",
     "ds:rounded-[var(--radius-sm)]",
@@ -154,35 +155,35 @@ const Ye = {
       size: "md"
     }
   }
-), st = [
+), tt = [
   "ds:ps-3 ds:pe-3 ds:py-1.5",
   "type-eyebrow ds:text-muted-foreground"
-].join(" "), ot = "ds:max-h-[18rem] ds:overflow-y-auto ds:p-[var(--spacing-xs)]", nt = "ds:ps-3 ds:pe-3 ds:py-2 type-body-sm ds:text-muted-foreground", rt = {
+].join(" "), st = "ds:max-h-[18rem] ds:overflow-y-auto ds:p-[var(--spacing-xs)]", ot = "ds:ps-3 ds:pe-3 ds:py-2 type-body-sm ds:text-muted-foreground", nt = {
   sm: "ds:size-3.5",
   md: "ds:size-4",
   lg: "ds:size-5"
 };
-function at({
-  search: s,
+function rt({
+  search: t,
   label: r,
-  iconClass: y,
-  size: P,
-  onSelect: j
+  iconClass: F,
+  size: V,
+  onSelect: D
 }) {
-  return Be((A) => A.filtered.count) > 0 ? null : /* @__PURE__ */ I(
-    u.Item,
+  return Oe((P) => P.filtered.count) > 0 ? null : /* @__PURE__ */ N(
+    c.Item,
     {
-      value: `__combobox-create__${s}`,
+      value: `__combobox-create__${t}`,
       keywords: [],
       forceMount: !0,
-      onSelect: () => j(s),
-      className: ae({ size: P }),
+      onSelect: () => D(t),
+      className: ne({ size: V }),
       children: [
         /* @__PURE__ */ o(
           "span",
           {
             "aria-hidden": "true",
-            className: `ds:inline-flex ds:items-center ds:justify-center ${y}`
+            className: `ds:inline-flex ds:items-center ds:justify-center ${F}`
           }
         ),
         /* @__PURE__ */ o("span", { className: "ds:flex-1 ds:truncate", children: r })
@@ -190,169 +191,171 @@ function at({
     }
   );
 }
-const ie = $e(
+const re = je(
   function({
     options: r,
-    value: y,
-    defaultValue: P,
-    onValueChange: j,
-    placeholder: X,
-    clearable: A = !1,
-    disabled: de,
-    readOnly: le,
-    required: ce,
-    name: ue,
-    id: T,
-    size: x = "md",
-    tone: me = "default",
-    filter: $,
-    allowCreate: fe = !1,
-    onCreate: k,
-    open: W,
-    onOpenChange: m,
-    emptyMessage: pe,
-    className: be,
-    "aria-label": J
-  }, he) {
-    const { t: C } = Ue(), h = He(), N = ke(Ge) !== null, [ge, O] = G(
-      y ?? P ?? ""
-    ), z = y !== void 0, f = z ? y : ge, V = M(
-      () => r.find((e) => e.value === f),
-      [r, f]
-    ), S = (V == null ? void 0 : V.label) ?? "", [p, i] = G(S), [ve, Y] = G(!1), R = W !== void 0, d = R ? W : ve, w = v(!1), _ = v(null), Z = v(null);
-    Oe(() => {
+    value: F,
+    defaultValue: V,
+    onValueChange: D,
+    placeholder: L,
+    clearable: P = !1,
+    disabled: ae,
+    readOnly: ie,
+    required: de,
+    name: le,
+    id: j,
+    size: v = "md",
+    tone: ce = "default",
+    filter: A,
+    allowCreate: ue = !1,
+    onCreate: T,
+    open: Q,
+    onOpenChange: u,
+    emptyMessage: me,
+    className: fe,
+    "aria-label": K
+  }, pe) {
+    const { t: x } = qe(), b = Be(), y = Ae(Ue) !== null, [be, z] = Me({
+      value: F,
+      defaultValue: V ?? "",
+      onChange: D
+    }), m = be ?? "", $ = U(
+      () => r.find((e) => e.value === m),
+      [r, m]
+    ), C = ($ == null ? void 0 : $.label) ?? "", [f, i] = oe(C), [he, X] = oe(!1), S = Q !== void 0, d = S ? Q : he, R = g(!1), w = g(null), W = g(null);
+    Te(() => {
       var e;
-      (e = _.current) == null || e.setAttribute("aria-expanded", String(d));
-    }), E(() => {
-      d || i(S);
-    }, [S, d]);
-    const ye = T ?? (N ? h.id : void 0), q = (N ? h.disabled : !1) || !!de, g = !!le, xe = (N ? h.required : !1) || !!ce, ee = N ? h.invalid : !1, Ce = ee ? "error" : me, Ne = N && h.describedBy ? h.describedBy : void 0, te = X ?? C("inputs.combobox.placeholder", "Search…"), ze = M(
-      () => (e, t, n) => {
-        if (w.current) return 1;
-        const b = L(e), a = L(t), H = n == null ? void 0 : n.map(L);
-        return $ ? $(b, a) : qe(
-          b,
+      (e = w.current) == null || e.setAttribute("aria-expanded", String(d));
+    }), I(() => {
+      d || i(C);
+    }, [C, d]);
+    const ge = j ?? (y ? b.id : void 0), k = (y ? b.disabled : !1) || !!ae, h = !!ie, ve = (y ? b.required : !1) || !!de, J = y ? b.invalid : !1, xe = J ? "error" : ce, ye = y && b.describedBy ? b.describedBy : void 0, Y = L ?? x("inputs.combobox.placeholder", "Search…"), Ce = U(
+      () => (e, s, n) => {
+        if (R.current) return 1;
+        const p = H(e), a = H(s), B = n == null ? void 0 : n.map(H);
+        return A ? A(p, a) : ke(
+          p,
           a,
-          H
+          B
         );
       },
-      [$]
-    ), l = j, se = (e) => {
-      z || O(e), l == null || l(e);
-    }, c = (e) => {
-      R || Y(e), m == null || m(e);
+      [A]
+    ), Z = (e) => {
+      z(e);
+    }, l = (e) => {
+      S || X(e), u == null || u(e);
+    }, Ne = (e) => {
+      const s = r.find((n) => n.value === e);
+      Z(e), i((s == null ? void 0 : s.label) ?? ""), l(!1);
+    }, ze = (e) => {
+      T == null || T(e), l(!1);
     }, Se = (e) => {
-      const t = r.find((n) => n.value === e);
-      se(e), i((t == null ? void 0 : t.label) ?? ""), c(!1);
-    }, Ie = (e) => {
-      k == null || k(e), c(!1);
-    }, Re = (e) => {
-      g || (i(e), !d && e.length > 0 && !w.current && c(!0));
+      h || (i(e), !d && e.length > 0 && !R.current && l(!0));
+    }, Re = () => {
+      !k && !h && l(!0);
     }, we = () => {
-      !q && !g && c(!0);
-    }, _e = () => {
-      w.current = !0;
-    }, Ee = () => {
-      var t;
-      if (w.current = !1, g) return;
-      const e = ((t = _.current) == null ? void 0 : t.value) ?? "";
-      i(e), e.length > 0 && c(!0);
+      R.current = !0;
+    }, Ie = () => {
+      var s;
+      if (R.current = !1, h) return;
+      const e = ((s = w.current) == null ? void 0 : s.value) ?? "";
+      i(e), e.length > 0 && l(!0);
+    }, _e = (e) => {
+      e.nativeEvent.isComposing || e.key === "Escape" && d && (e.preventDefault(), l(!1), i(C));
+    }, Ee = (e) => {
+      var s;
+      e.preventDefault(), e.stopPropagation(), Z(""), i(""), l(!0), (s = w.current) == null || s.focus();
     }, Fe = (e) => {
-      e.nativeEvent.isComposing || e.key === "Escape" && d && (e.preventDefault(), c(!1), i(S));
-    }, De = (e) => {
-      var t;
-      e.preventDefault(), e.stopPropagation(), se(""), i(""), c(!0), (t = _.current) == null || t.focus();
-    }, Pe = (e) => {
-      g && e || (c(e), e || i(S));
-    }, oe = v(f);
-    E(() => {
-      oe.current = f;
+      h && e || (l(e), e || i(C));
+    }, ee = g(m);
+    I(() => {
+      ee.current = m;
+    }, [m]);
+    const te = g(f);
+    I(() => {
+      te.current = f;
     }, [f]);
-    const ne = v(p);
-    E(() => {
-      ne.current = p;
-    }, [p]);
-    const re = v(d);
-    E(() => {
-      re.current = d;
+    const se = g(d);
+    I(() => {
+      se.current = d;
     }, [d]);
-    const B = Ve(
+    const O = $e(
       (e) => {
-        R || Y(e), m == null || m(e);
+        S || X(e), u == null || u(e);
       },
-      [R, m]
-    ), je = M(
+      [S, u]
+    ), Ve = U(
       () => ({
-        getValue: () => oe.current || null,
-        getQuery: () => ne.current,
-        getIsOpen: () => re.current,
+        getValue: () => ee.current || null,
+        getQuery: () => te.current,
+        getIsOpen: () => se.current,
         setValue: (e) => {
-          const t = e ?? "";
-          z || O(t), l == null || l(t);
-          const n = r.find((b) => b.value === t);
+          const s = e ?? "";
+          z(s);
+          const n = r.find((p) => p.value === s);
           i((n == null ? void 0 : n.label) ?? "");
         },
         setQuery: (e) => {
           i(e);
         },
         clear: () => {
-          z || O(""), l == null || l(""), i("");
+          z(""), i("");
         },
-        open: () => B(!0),
-        close: () => B(!1)
+        open: () => O(!0),
+        close: () => O(!1)
       }),
-      [l, z, r, B]
+      [z, r, O]
     );
-    Xe(Ye, je, T);
-    const Ae = A && !!f && !q && !g, Te = Le(r), U = rt[x];
-    return /* @__PURE__ */ o(F.Root, { open: d, onOpenChange: Pe, children: /* @__PURE__ */ I(
-      u,
+    Ke(Je, Ve, j);
+    const De = P && !!m && !k && !h, Pe = Ge(r), q = nt[v];
+    return /* @__PURE__ */ o(_.Root, { open: d, onOpenChange: Fe, children: /* @__PURE__ */ N(
+      c,
       {
-        filter: ze,
+        filter: Ce,
         shouldFilter: !0,
         loop: !0,
-        label: J ?? te,
+        label: K ?? Y,
         className: "ds:w-full",
         children: [
-          /* @__PURE__ */ o(F.Anchor, { asChild: !0, children: /* @__PURE__ */ I(
+          /* @__PURE__ */ o(_.Anchor, { asChild: !0, children: /* @__PURE__ */ N(
             "div",
             {
-              ref: Z,
-              className: et({
-                size: x,
-                tone: Ce,
-                className: be
+              ref: W,
+              className: Ze({
+                size: v,
+                tone: xe,
+                className: fe
               }),
               "data-component": "combobox",
-              "data-component-id": T,
+              "data-component-id": j,
               children: [
                 /* @__PURE__ */ o(
-                  u.Input,
+                  c.Input,
                   {
-                    ref: Me(he, _),
-                    value: p,
-                    onValueChange: Re,
-                    id: ye,
-                    name: ue,
-                    placeholder: te,
-                    disabled: q,
-                    readOnly: g,
-                    required: xe,
-                    "aria-describedby": Ne,
-                    "aria-invalid": ee || void 0,
-                    onFocus: we,
-                    onKeyDown: Fe,
-                    onCompositionStart: _e,
-                    onCompositionEnd: Ee,
-                    className: Ze({ size: x })
+                    ref: He(pe, w),
+                    value: f,
+                    onValueChange: Se,
+                    id: ge,
+                    name: le,
+                    placeholder: Y,
+                    disabled: k,
+                    readOnly: h,
+                    required: ve,
+                    "aria-describedby": ye,
+                    "aria-invalid": J || void 0,
+                    onFocus: Re,
+                    onKeyDown: _e,
+                    onCompositionStart: we,
+                    onCompositionEnd: Ie,
+                    className: Ye({ size: v })
                   }
                 ),
-                Ae ? /* @__PURE__ */ o(
+                De ? /* @__PURE__ */ o(
                   "button",
                   {
                     type: "button",
-                    "aria-label": C("inputs.combobox.clear", "Clear selection"),
-                    onClick: De,
+                    "aria-label": x("inputs.combobox.clear", "Clear selection"),
+                    onClick: Ee,
                     onPointerDown: (e) => e.stopPropagation(),
                     className: [
                       "ds:inline-flex ds:items-center ds:justify-center ds:rounded-[var(--radius-sm)]",
@@ -362,48 +365,48 @@ const ie = $e(
                       "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
                       "ds:size-4"
                     ].join(" "),
-                    children: /* @__PURE__ */ o(We, { "aria-hidden": "true", className: "ds:size-3.5" })
+                    children: /* @__PURE__ */ o(Xe, { "aria-hidden": "true", className: "ds:size-3.5" })
                   }
                 ) : null
               ]
             }
           ) }),
-          /* @__PURE__ */ o(F.Portal, { forceMount: !0, children: /* @__PURE__ */ o(
-            F.Content,
+          /* @__PURE__ */ o(_.Portal, { forceMount: !0, children: /* @__PURE__ */ o(
+            _.Content,
             {
               forceMount: !0,
               hidden: !d,
-              "aria-label": J ?? C("inputs.combobox.popupLabel", "Options"),
+              "aria-label": K ?? x("inputs.combobox.popupLabel", "Options"),
               onOpenAutoFocus: (e) => e.preventDefault(),
               onCloseAutoFocus: (e) => e.preventDefault(),
               onInteractOutside: (e) => {
                 var n;
-                const t = e.target;
-                t && ((n = Z.current) != null && n.contains(t)) && e.preventDefault();
+                const s = e.target;
+                s && ((n = W.current) != null && n.contains(s)) && e.preventDefault();
               },
               sideOffset: 4,
               align: "start",
-              className: tt(),
-              children: /* @__PURE__ */ I(u.List, { className: ot, children: [
-                /* @__PURE__ */ o(u.Empty, { className: nt, children: pe ?? C("inputs.combobox.empty", "No results found") }),
-                Te.map(({ group: e, items: t }, n) => {
-                  const b = t.map((a) => {
-                    const H = a.value === f;
-                    return /* @__PURE__ */ I(
-                      u.Item,
+              className: et(),
+              children: /* @__PURE__ */ N(c.List, { className: st, children: [
+                /* @__PURE__ */ o(c.Empty, { className: ot, children: me ?? x("inputs.combobox.empty", "No results found") }),
+                Pe.map(({ group: e, items: s }, n) => {
+                  const p = s.map((a) => {
+                    const B = a.value === m;
+                    return /* @__PURE__ */ N(
+                      c.Item,
                       {
                         value: a.value,
                         keywords: [a.label],
                         disabled: a.disabled,
-                        onSelect: Se,
-                        className: ae({ size: x }),
+                        onSelect: Ne,
+                        className: ne({ size: v }),
                         children: [
                           /* @__PURE__ */ o(
                             "span",
                             {
                               "aria-hidden": "true",
-                              className: `ds:inline-flex ds:items-center ds:justify-center ${U}`,
-                              children: H ? /* @__PURE__ */ o(Je, { className: U }) : null
+                              className: `ds:inline-flex ds:items-center ds:justify-center ${q}`,
+                              children: B ? /* @__PURE__ */ o(We, { className: q }) : null
                             }
                           ),
                           /* @__PURE__ */ o("span", { className: "ds:flex-1 ds:truncate", children: a.label }),
@@ -414,24 +417,24 @@ const ie = $e(
                     );
                   });
                   return e ? /* @__PURE__ */ o(
-                    u.Group,
+                    c.Group,
                     {
-                      heading: /* @__PURE__ */ o("span", { className: st, children: e }),
-                      children: b
+                      heading: /* @__PURE__ */ o("span", { className: tt, children: e }),
+                      children: p
                     },
                     `group-${e}`
-                  ) : /* @__PURE__ */ o(u.Group, { children: b }, `group-${n}`);
+                  ) : /* @__PURE__ */ o(c.Group, { children: p }, `group-${n}`);
                 }),
-                fe && p.length > 0 ? /* @__PURE__ */ o(
-                  at,
+                ue && f.length > 0 ? /* @__PURE__ */ o(
+                  rt,
                   {
-                    search: p,
-                    label: C("inputs.combobox.create", 'Create "{{value}}"', {
-                      value: p
+                    search: f,
+                    label: x("inputs.combobox.create", 'Create "{{value}}"', {
+                      value: f
                     }),
-                    iconClass: U,
-                    size: x,
-                    onSelect: Ie
+                    iconClass: q,
+                    size: v,
+                    onSelect: ze
                   }
                 ) : null
               ] })
@@ -442,14 +445,14 @@ const ie = $e(
     ) });
   }
 );
-ie.displayName = "Combobox";
-const xt = ie;
+re.displayName = "Combobox";
+const yt = re;
 export {
-  xt as C,
-  tt as a,
-  Ze as b,
-  Ye as c,
-  ae as d,
-  et as e
+  yt as C,
+  et as a,
+  Ye as b,
+  Je as c,
+  ne as d,
+  Ze as e
 };
-//# sourceMappingURL=combobox-D5tWe0t_.js.map
+//# sourceMappingURL=combobox-Da9eq00i.js.map