@alfadocs/ui-kit 0.1.9 → 0.2.0

package/dist/_chunks/{search-input-Xw3cdWXW.js → search-input-CdJIEjFo.js}

@@ -2,9 +2,9 @@ import { jsx as t, jsxs as ne } from "react/jsx-runtime";
 import { forwardRef as ie, useState as F, useRef as K, useLayoutEffect as oe, useCallback as V, useImperativeHandle as de, useEffect as le } from "react";
 import { c as x } from "./index-D2ZczOXr.js";
 import { useTranslation as ce } from "react-i18next";
-import { T as ue } from "./text-input-BX39e6T6.js";
-import { S as fe } from "./spinner-GCcv67vh.js";
-import { u as me } from "./form-field-context-94LwgYTQ.js";
+import { T as ue } from "./text-input-DZwt9L8H.js";
+import { S as fe } from "./spinner-DLaYfLPl.js";
+import { u as me } from "./form-field-context-B3APVHKx.js";
 import { u as be } from "./use-debounced-callback-BisrB-Fq.js";
 import { S as L } from "./search-BonnQsHv.js";
 import { X as ve } from "./x-CCcI3eJp.js";
@@ -72,12 +72,9 @@ const Ee = ie(
     oe(() => {
       h.current && a.current && (a.current.focus(), h.current = !1);
     });
-    const j = be(
-      (e) => {
-        n == null || n(e);
-      },
-      O
-    ), i = V(
+    const j = be((e) => {
+      n == null || n(e);
+    }, O), i = V(
       (e) => {
         j.cancel(), n == null || n(e);
       },
@@ -105,42 +102,38 @@ const Ee = ie(
       var e;
       u === "expandable" && !N ? (h.current = !0, T(!0)) : (e = a.current) == null || e.focus();
     }, [u, N]);
-    de(
-      J,
-      () => {
-        const e = a.current;
-        if (!e) return null;
-        const s = {
-          getQuery: () => f,
-          setQuery: (l) => {
-            const m = String(l ?? "");
-            d(m), r == null || r(m), i(m);
-          },
-          clear: () => {
-            var l;
-            d(""), r == null || r(""), i(""), (l = a.current) == null || l.focus();
-          },
-          submit: () => {
-            i(f);
-          },
-          // Named `agentFocus` to avoid clashing with the native, read-only
-          // `HTMLElement.focus` slot. The adapter wires `actions.focus` to
-          // `agentFocus` so the expandable-aware path is preserved.
-          agentFocus: () => {
-            p();
-          }
-        };
-        for (const [l, m] of Object.entries(s))
-          Object.defineProperty(e, l, {
-            value: m,
-            configurable: !0,
-            writable: !0,
-            enumerable: !1
-          });
-        return e;
-      },
-      [f, d, r, i, p]
-    ), le(() => {
+    de(J, () => {
+      const e = a.current;
+      if (!e) return null;
+      const s = {
+        getQuery: () => f,
+        setQuery: (l) => {
+          const m = String(l ?? "");
+          d(m), r == null || r(m), i(m);
+        },
+        clear: () => {
+          var l;
+          d(""), r == null || r(""), i(""), (l = a.current) == null || l.focus();
+        },
+        submit: () => {
+          i(f);
+        },
+        // Named `agentFocus` to avoid clashing with the native, read-only
+        // `HTMLElement.focus` slot. The adapter wires `actions.focus` to
+        // `agentFocus` so the expandable-aware path is preserved.
+        agentFocus: () => {
+          p();
+        }
+      };
+      for (const [l, m] of Object.entries(s))
+        Object.defineProperty(e, l, {
+          value: m,
+          configurable: !0,
+          writable: !0,
+          enumerable: !1
+        });
+      return e;
+    }, [f, d, r, i, p]), le(() => {
       if (!g) return;
       const e = (s) => {
         s.key === g && (s.isComposing || s.defaultPrevented || ye(document.activeElement) || (s.preventDefault(), p()));
@@ -149,79 +142,95 @@ const Ee = ie(
     }, [g, p]);
     const re = E("ui.inputs.search.clear", "Clear search"), A = E("ui.inputs.search.loading", "Searching…"), se = E("ui.inputs.search.placeholder", "Search…"), B = Q ?? se;
     if (u === "expandable" && !N)
-      return /* @__PURE__ */ t("div", { "data-component": "search-input", "data-component-id": y, className: ge({ className: C }), children: /* @__PURE__ */ t(
-        "button",
+      return /* @__PURE__ */ t(
+        "div",
         {
-          type: "button",
-          "aria-label": B,
-          "aria-expanded": !1,
-          "aria-controls": z,
-          disabled: w,
-          onClick: () => {
-            h.current = !0, T(!0);
-          },
-          className: xe(),
-          children: /* @__PURE__ */ t(L, { "aria-hidden": "true", className: "ds:size-4" })
+          "data-component": "search-input",
+          "data-component-id": y,
+          className: ge({ className: C }),
+          children: /* @__PURE__ */ t(
+            "button",
+            {
+              type: "button",
+              "aria-label": B,
+              "aria-expanded": !1,
+              "aria-controls": z,
+              disabled: w,
+              onClick: () => {
+                h.current = !0, T(!0);
+              },
+              className: xe(),
+              children: /* @__PURE__ */ t(L, { "aria-hidden": "true", className: "ds:size-4" })
+            }
+          )
         }
-      ) });
+      );
     const te = G === "combobox" ? {
       role: "combobox",
       "aria-expanded": v["aria-expanded"],
       "aria-controls": v["aria-controls"],
       "aria-activedescendant": v["aria-activedescendant"]
     } : void 0, R = k && !b && !w, ae = b ? /* @__PURE__ */ t(fe, { size: "sm", label: A }) : R ? /* @__PURE__ */ t("span", { className: "ds:inline-block ds:size-4", "aria-hidden": "true" }) : void 0;
-    return /* @__PURE__ */ ne("div", { "data-component": "search-input", "data-component-id": y, className: he({ className: C }), children: [
-      /* @__PURE__ */ t(
-        ue,
-        {
-          ref: a,
-          id: z,
-          type: "search",
-          size: P,
-          value: f,
-          disabled: w,
-          placeholder: B,
-          name: H,
-          form: U,
-          autoComplete: W,
-          autoFocus: q,
-          startAdornment: /* @__PURE__ */ t(L, {}),
-          endAdornment: ae,
-          clearable: !1,
-          onChange: Z,
-          onInput: _,
-          onKeyDown: $,
-          onBlur: ee,
-          "aria-label": v["aria-label"],
-          "aria-busy": b || void 0,
-          ...te
-        }
-      ),
-      R ? /* @__PURE__ */ t(
-        "button",
-        {
-          type: "button",
-          "aria-label": re,
-          onClick: I,
-          className: pe(),
-          children: /* @__PURE__ */ t(ve, { "aria-hidden": "true", className: "ds:size-4" })
-        }
-      ) : null,
-      /* @__PURE__ */ t(
-        "span",
-        {
-          role: "status",
-          "aria-live": "polite",
-          "aria-atomic": "true",
-          className: "ds:sr-only",
-          children: b ? A : ""
-        }
-      )
-    ] });
+    return /* @__PURE__ */ ne(
+      "div",
+      {
+        "data-component": "search-input",
+        "data-component-id": y,
+        className: he({ className: C }),
+        children: [
+          /* @__PURE__ */ t(
+            ue,
+            {
+              ref: a,
+              id: z,
+              type: "search",
+              size: P,
+              value: f,
+              disabled: w,
+              placeholder: B,
+              name: H,
+              form: U,
+              autoComplete: W,
+              autoFocus: q,
+              startAdornment: /* @__PURE__ */ t(L, {}),
+              endAdornment: ae,
+              clearable: !1,
+              onChange: Z,
+              onInput: _,
+              onKeyDown: $,
+              onBlur: ee,
+              "aria-label": v["aria-label"],
+              "aria-busy": b || void 0,
+              ...te
+            }
+          ),
+          R ? /* @__PURE__ */ t(
+            "button",
+            {
+              type: "button",
+              "aria-label": re,
+              onClick: I,
+              className: pe(),
+              children: /* @__PURE__ */ t(ve, { "aria-hidden": "true", className: "ds:size-4" })
+            }
+          ) : null,
+          /* @__PURE__ */ t(
+            "span",
+            {
+              role: "status",
+              "aria-live": "polite",
+              "aria-atomic": "true",
+              className: "ds:sr-only",
+              children: b ? A : ""
+            }
+          )
+        ]
+      }
+    );
   }
 );
 Ee.displayName = "SearchInput";
 export {
   Ee as S
 };
-//# sourceMappingURL=search-input-Xw3cdWXW.js.map
+//# sourceMappingURL=search-input-CdJIEjFo.js.map

package/dist/_chunks/{select-DY1Cb2Tg.js → select-y6bXV1f1.js}

@@ -1,13 +1,13 @@
-import { jsx as t, jsxs as m } from "react/jsx-runtime";
-import { forwardRef as a, useContext as me, useState as F, useRef as K, useMemo as fe } from "react";
+import { jsx as t, jsxs as f } from "react/jsx-runtime";
+import { forwardRef as a, useContext as me, useState as P, useRef as G, useMemo as fe } from "react";
 import * as o from "@radix-ui/react-select";
 import { c as w } from "./index-D2ZczOXr.js";
 import { useTranslation as ge } from "react-i18next";
-import { u as he, F as ve } from "./form-field-context-94LwgYTQ.js";
+import { u as he, F as ve } from "./form-field-context-B3APVHKx.js";
 import { g as be } from "./group-options-BvKhQ3xb.js";
 import { u as ye } from "./use-direction-D6rvvG9G.js";
 import { C as Se } from "./chevron-up-zOEDrmBB.js";
-import { C as P } from "./chevron-down-BX_NP2Yh.js";
+import { C as q } from "./chevron-down-BX_NP2Yh.js";
 import { C as xe } from "./check-DPdL_Sm7.js";
 import { u as Ne } from "./registry-C9nwlNyL.js";
 import { X as Ce } from "./x-CCcI3eJp.js";
@@ -79,7 +79,7 @@ const ze = {
       description: "Stable opaque option value emitted on each rendered option."
     }
   }
-}, G = w(
+}, L = w(
   [
     "ds:group ds:inline-flex ds:items-center ds:justify-between ds:gap-[var(--spacing-sm)] ds:w-full",
     "ds:rounded-[var(--radius-sm)] ds:border ds:border-border ds:bg-background",
@@ -159,22 +159,22 @@ function Te(...e) {
       n && (typeof n == "function" ? n(s) : n.current = s);
   };
 }
-const L = (e) => /* @__PURE__ */ t(o.Root, { ...e });
-L.displayName = "Select.Root";
-const q = a(
+const $ = (e) => /* @__PURE__ */ t(o.Root, { ...e });
+$.displayName = "Select.Root";
+const A = a(
   ({ size: e, tone: s, className: n, children: r, ...l }, c) => /* @__PURE__ */ t(
     o.Trigger,
     {
       ref: c,
-      className: G({ size: e, tone: s, className: n }),
+      className: L({ size: e, tone: s, className: n }),
       ...l,
       children: r
     }
   )
 );
-q.displayName = "Select.Trigger";
-const $ = a((e, s) => /* @__PURE__ */ t(o.Value, { ref: s, ...e }));
-$.displayName = "Select.Value";
+A.displayName = "Select.Trigger";
+const H = a((e, s) => /* @__PURE__ */ t(o.Value, { ref: s, ...e }));
+H.displayName = "Select.Value";
 const I = a(
   ({
     className: e,
@@ -183,10 +183,10 @@ const I = a(
     sideOffset: r = 4,
     container: l,
     ...c
-  }, f) => /* @__PURE__ */ t(o.Portal, { container: l ?? void 0, children: /* @__PURE__ */ m(
+  }, g) => /* @__PURE__ */ t(o.Portal, { container: l ?? void 0, children: /* @__PURE__ */ f(
     o.Content,
     {
-      ref: f,
+      ref: g,
       position: n,
       sideOffset: r,
       className: we({ className: e }),
@@ -194,7 +194,7 @@ const I = a(
       children: [
         /* @__PURE__ */ t(o.ScrollUpButton, { className: "ds:flex ds:items-center ds:justify-center ds:h-6 ds:bg-background ds:cursor-default", children: /* @__PURE__ */ t(Se, { "aria-hidden": "true", className: "ds:size-4" }) }),
         s,
-        /* @__PURE__ */ t(o.ScrollDownButton, { className: "ds:flex ds:items-center ds:justify-center ds:h-6 ds:bg-background ds:cursor-default", children: /* @__PURE__ */ t(P, { "aria-hidden": "true", className: "ds:size-4" }) })
+        /* @__PURE__ */ t(o.ScrollDownButton, { className: "ds:flex ds:items-center ds:justify-center ds:h-6 ds:bg-background ds:cursor-default", children: /* @__PURE__ */ t(q, { "aria-hidden": "true", className: "ds:size-4" }) })
       ]
     }
   ) })
@@ -210,8 +210,8 @@ const j = a(({ className: e, ...s }, n) => /* @__PURE__ */ t(
 ));
 j.displayName = "Select.Viewport";
 const V = a(({ size: e = "md", className: s, children: n, ...r }, l) => {
-  const c = ke[e ?? "md"], f = Ve[e ?? "md"];
-  return /* @__PURE__ */ m(
+  const c = ke[e ?? "md"], g = Ve[e ?? "md"];
+  return /* @__PURE__ */ f(
     o.Item,
     {
       ref: l,
@@ -223,7 +223,7 @@ const V = a(({ size: e = "md", className: s, children: n, ...r }, l) => {
           {
             className: `ds:absolute ${c} ds:inline-flex ds:items-center ds:justify-center`,
             "aria-hidden": "true",
-            children: /* @__PURE__ */ t(o.ItemIndicator, { children: /* @__PURE__ */ t(xe, { className: f }) })
+            children: /* @__PURE__ */ t(o.ItemIndicator, { children: /* @__PURE__ */ t(xe, { className: g }) })
           }
         ),
         /* @__PURE__ */ t(o.ItemText, { children: n })
@@ -232,10 +232,10 @@ const V = a(({ size: e = "md", className: s, children: n, ...r }, l) => {
   );
 });
 V.displayName = "Select.Item";
-const A = a((e, s) => /* @__PURE__ */ t(o.ItemText, { ref: s, ...e }));
-A.displayName = "Select.ItemText";
-const H = a((e, s) => /* @__PURE__ */ t(o.Group, { ref: s, ...e }));
-H.displayName = "Select.Group";
+const M = a((e, s) => /* @__PURE__ */ t(o.ItemText, { ref: s, ...e }));
+M.displayName = "Select.ItemText";
+const U = a((e, s) => /* @__PURE__ */ t(o.Group, { ref: s, ...e }));
+U.displayName = "Select.Group";
 const k = a(({ className: e, ...s }, n) => /* @__PURE__ */ t(
   o.Label,
   {
@@ -245,7 +245,7 @@ const k = a(({ className: e, ...s }, n) => /* @__PURE__ */ t(
   }
 ));
 k.displayName = "Select.Label";
-const M = a(({ className: e, ...s }, n) => /* @__PURE__ */ t(
+const W = a(({ className: e, ...s }, n) => /* @__PURE__ */ t(
   o.Separator,
   {
     ref: n,
@@ -253,83 +253,84 @@ const M = a(({ className: e, ...s }, n) => /* @__PURE__ */ t(
     ...s
   }
 ));
-M.displayName = "Select.Separator";
-const U = a(function({
+W.displayName = "Select.Separator";
+const _ = a(function({
   options: s,
   value: n,
   defaultValue: r,
   onValueChange: l,
   placeholder: c,
-  clearable: f = !1,
-  disabled: W,
-  required: _,
-  name: E,
+  clearable: g = !1,
+  disabled: E,
+  required: X,
+  name: J,
   id: S,
   size: T = "md",
-  tone: X = "default",
-  className: J,
-  "aria-label": Q
-}, Y) {
-  const { t: x } = ge(), u = he(), g = me(ve) !== null, [Z, b] = F(
+  tone: Q = "default",
+  className: Y,
+  "aria-label": R
+}, Z) {
+  const { t: x } = ge(), u = he(), p = me(ve) !== null, [ee, b] = P(
     n ?? r ?? ""
-  ), p = n !== void 0, h = p ? n : Z, [N, C] = F(!1), R = K(h);
-  R.current = h;
-  const ee = S ?? (g ? u.id : void 0), B = (g ? u.disabled : !1) || !!W, te = (g ? u.required : !1) || !!_, O = g ? u.invalid : !1, se = O ? "error" : X, oe = g && u.describedBy ? u.describedBy : void 0, z = K(null), ne = Te(Y, z), ie = ye(z), d = l, de = (i) => {
-    p || b(i), d == null || d(i);
-  }, ae = (i) => {
+  ), m = n !== void 0, h = m ? n : ee, [N, C] = P(!1), B = G(h);
+  B.current = h;
+  const te = S ?? (p ? u.id : void 0), O = (p ? u.disabled : !1) || !!E, se = (p ? u.required : !1) || !!X, D = p ? u.invalid : !1, oe = D ? "error" : Q, ne = p && u.describedBy ? u.describedBy : void 0, z = G(null), ie = Te(Z, z), de = ye(z), d = l, ae = (i) => {
+    m || b(i), d == null || d(i);
+  }, re = (i) => {
     var y;
-    i.preventDefault(), i.stopPropagation(), p || b(""), d == null || d(""), (y = z.current) == null || y.focus();
-  }, re = c ?? x("ui.inputs.select.placeholder", "Select…"), le = f && !!h && !B, ce = be(s), ue = fe(
+    i.preventDefault(), i.stopPropagation(), m || b(""), d == null || d(""), (y = z.current) == null || y.focus();
+  }, F = c ?? x("ui.inputs.select.placeholder", "Select…"), le = g && !!h && !O, ce = be(s), ue = fe(
     () => ({
-      getValue: () => R.current,
+      getValue: () => B.current,
       setValue: (i) => {
-        p || b(i), d == null || d(i);
+        m || b(i), d == null || d(i);
       },
       clear: () => {
-        p || b(""), d == null || d("");
+        m || b(""), d == null || d("");
       },
       open: () => C(!0),
       close: () => C(!1),
       isOpen: () => N
     }),
-    [d, p, N]
+    [d, m, N]
   );
-  return Ne(ze, ue, S), /* @__PURE__ */ m(
+  return Ne(ze, ue, S), /* @__PURE__ */ f(
     o.Root,
     {
       value: h === "" ? void 0 : h,
-      onValueChange: de,
+      onValueChange: ae,
       open: N,
       onOpenChange: C,
-      disabled: B,
-      required: te,
-      name: E,
-      dir: ie,
+      disabled: O,
+      required: se,
+      name: J,
+      dir: de,
       children: [
-        /* @__PURE__ */ m(
+        /* @__PURE__ */ f(
           o.Trigger,
           {
-            ref: ne,
-            id: ee,
-            "aria-label": Q,
-            "aria-describedby": oe,
-            "aria-invalid": O || void 0,
+            ref: ie,
+            id: te,
+            "aria-label": R ?? (p ? void 0 : F),
+            "aria-labelledby": !R && p ? `${u.id}-label` : void 0,
+            "aria-describedby": ne,
+            "aria-invalid": D || void 0,
             "data-component": "select",
             "data-component-id": S,
-            className: G({
+            className: L({
               size: T,
-              tone: se,
-              className: J
+              tone: oe,
+              className: Y
             }),
             children: [
-              /* @__PURE__ */ t(o.Value, { placeholder: re }),
-              /* @__PURE__ */ m("span", { className: "ds:ms-auto ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]", children: [
+              /* @__PURE__ */ t(o.Value, { placeholder: F }),
+              /* @__PURE__ */ f("span", { className: "ds:ms-auto ds:inline-flex ds:items-center ds:gap-[var(--spacing-xs)]", children: [
                 le ? /* @__PURE__ */ t(
                   "button",
                   {
                     type: "button",
                     "aria-label": x("ui.inputs.select.clear", "Clear selection"),
-                    onClick: ae,
+                    onClick: re,
                     onPointerDown: (i) => i.stopPropagation(),
                     onKeyDown: (i) => {
                       (i.key === "Enter" || i.key === " ") && i.stopPropagation();
@@ -346,7 +347,7 @@ const U = a(function({
                   }
                 ) : null,
                 /* @__PURE__ */ t(o.Icon, { asChild: !0, children: /* @__PURE__ */ t(
-                  P,
+                  q,
                   {
                     "aria-hidden": "true",
                     className: [
@@ -361,7 +362,7 @@ const U = a(function({
           }
         ),
         /* @__PURE__ */ t(I, { children: /* @__PURE__ */ t(j, { children: s.length === 0 ? /* @__PURE__ */ t("div", { className: "ds:ps-8 ds:pe-3 ds:py-2 type-body-sm ds:text-muted-foreground", children: x("ui.inputs.select.noOptions", "No options") }) : ce.map(({ group: i, items: y }, pe) => {
-          const D = y.map((v) => /* @__PURE__ */ t(
+          const K = y.map((v) => /* @__PURE__ */ t(
             V,
             {
               value: v.value,
@@ -372,39 +373,39 @@ const U = a(function({
             },
             v.value
           ));
-          return i ? /* @__PURE__ */ m(o.Group, { children: [
+          return i ? /* @__PURE__ */ f(o.Group, { children: [
             /* @__PURE__ */ t(k, { children: i }),
-            D
-          ] }, `group-${i}`) : /* @__PURE__ */ t(o.Group, { children: D }, `group-${pe}`);
+            K
+          ] }, `group-${i}`) : /* @__PURE__ */ t(o.Group, { children: K }, `group-${pe}`);
         }) }) })
       ]
     }
   );
 });
-U.displayName = "Select";
-const Re = Object.assign(U, {
-  Root: L,
-  Trigger: q,
-  Value: $,
+_.displayName = "Select";
+const Re = Object.assign(_, {
+  Root: $,
+  Trigger: A,
+  Value: H,
   Content: I,
   Viewport: j,
   Item: V,
-  ItemText: A,
-  Group: H,
+  ItemText: M,
+  Group: U,
   Label: k,
-  Separator: M
+  Separator: W
 }), Me = Re;
 export {
   Me as S,
   I as a,
-  H as b,
+  U as b,
   V as c,
-  A as d,
+  M as d,
   k as e,
-  L as f,
-  M as g,
-  q as h,
-  $ as i,
+  $ as f,
+  W as g,
+  A as h,
+  H as i,
   j
 };
-//# sourceMappingURL=select-DY1Cb2Tg.js.map
+//# sourceMappingURL=select-y6bXV1f1.js.map

package/dist/_chunks/{separator-B4wXDLNC.js → separator-CYU_bGFn.js}

@@ -2,10 +2,7 @@ import { jsx as e } from "react/jsx-runtime";
 import { forwardRef as n } from "react";
 import { c as l } from "./index-D2ZczOXr.js";
 const d = l(
-  [
-    "ds:shrink-0",
-    "ds:forced-colors:bg-[CanvasText]"
-  ].join(" "),
+  ["ds:shrink-0", "ds:forced-colors:bg-[CanvasText]"].join(" "),
   {
     variants: {
       orientation: {
@@ -56,4 +53,4 @@ c.displayName = "Separator";
 export {
   c as S
 };
-//# sourceMappingURL=separator-B4wXDLNC.js.map
+//# sourceMappingURL=separator-CYU_bGFn.js.map