@alfadocs/ui-kit 0.1.8 → 0.1.10

package/dist/_chunks/search-bar-fcGqDFW3.js

@@ -1,397 +0,0 @@
-import { jsx as s, jsxs as D, Fragment as G } from "react/jsx-runtime";
-import { forwardRef as U, useState as V, useEffect as O, useRef as W, useId as J, useMemo as X, useCallback as _ } from "react";
-import { c as P } from "./index-D2ZczOXr.js";
-import { useTranslation as E } from "react-i18next";
-import * as j from "@radix-ui/react-popover";
-import { S as Y } from "./search-input-BVMCONyN.js";
-import { S as Z } from "./search-BonnQsHv.js";
-import { n as L } from "./normalize-diacritics-BNGbFNlJ.js";
-import { u as ee } from "./use-debounced-callback-BisrB-Fq.js";
-function se() {
-  if (typeof navigator > "u") return !1;
-  const r = navigator.userAgentData, a = (r == null ? void 0 : r.platform) ?? navigator.platform ?? "";
-  return /mac/i.test(a);
-}
-const ae = P(
-  [
-    "ds:inline-flex ds:items-center ds:gap-[var(--spacing-sm)]",
-    "ds:rounded-[var(--radius-md)]",
-    "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)]",
-    // Same visual language as <SearchInput> so the launcher truly looks
-    // like an input. --muted-foreground over --background meets AA 4.5:1
-    // in every theme; --muted is a mid-tone not suitable as a surface.
-    "ds:bg-[var(--background)] ds:border ds:border-[color:var(--border)]",
-    "ds:text-[color:var(--muted-foreground)]",
-    // Opaque hover — mix 20% muted into --background so the launcher stays a
-    // solid surface even when placed over a brand-tinted parent (e.g. the
-    // Header's `brand` variant).
-    "ds:hover:bg-[color-mix(in_srgb,var(--muted)_20%,var(--background))]",
-    "ds:transition-colors ds:motion-reduce:transition-none",
-    "ds:focus-visible:outline-[length:var(--focus-ring-width)]",
-    "ds:focus-visible:outline-solid",
-    "ds:focus-visible:outline-[color:var(--ring)]",
-    "ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
-    "ds:forced-colors:focus-visible:outline-[CanvasText]",
-    "ds:min-h-[var(--min-target-size)]",
-    "ds:disabled:opacity-50 ds:disabled:cursor-not-allowed"
-  ].join(" "),
-  {
-    variants: {
-      size: {
-        sm: "ds:text-[length:var(--font-size-sm)]",
-        md: "ds:text-[length:var(--font-size-base)]",
-        lg: "ds:text-[length:var(--font-size-lg)]"
-      },
-      density: {
-        default: "",
-        compact: "ds:min-h-0 ds:h-8"
-      }
-    },
-    defaultVariants: {
-      size: "md",
-      density: "default"
-    }
-  }
-), re = P(
-  [
-    "ds:inline-flex ds:flex-col",
-    "ds:w-full"
-  ].join(" "),
-  {
-    variants: {
-      size: {
-        sm: "",
-        md: "",
-        lg: ""
-      },
-      density: {
-        default: "",
-        compact: ""
-      }
-    },
-    defaultVariants: {
-      size: "md",
-      density: "default"
-    }
-  }
-), B = P(
-  [
-    "ds:hidden ds:md:inline-flex ds:items-center ds:gap-[calc(var(--spacing-xs)/2)]",
-    "ds:ms-auto",
-    "ds:rounded-[var(--radius-sm)]",
-    "ds:border ds:border-[color:var(--border)]",
-    "ds:bg-[var(--background)]",
-    "ds:ps-[calc(var(--spacing-xs)/1.2)] ds:pe-[calc(var(--spacing-xs)/1.2)]",
-    "ds:py-[calc(var(--spacing-xs)/2)]",
-    // Use full --foreground (not --muted-foreground) so axe's contrast
-    // check clears 4.5:1 even against the 1px --border edge region.
-    "ds:text-[length:var(--font-size-xs)] ds:text-[color:var(--foreground)]",
-    "ds:font-[family-name:var(--font-mono)]"
-  ].join(" ")
-), te = P(
-  [
-    "ds:z-[var(--z-dropdown)]",
-    "ds:rounded-[var(--radius-md)]",
-    "ds:border ds:border-[color:var(--border)]",
-    "ds:bg-[var(--popover)] ds:text-[color:var(--popover-foreground)]",
-    "ds:shadow-[var(--shadow-lg)]",
-    "ds:p-[var(--spacing-xs)]",
-    // Motion gates — reduced-motion honoured via .theme-accessible's 0ms
-    // animation-duration token.
-    "ds:data-[state=open]:animate-in ds:data-[state=closed]:animate-out",
-    "ds:data-[state=open]:fade-in ds:data-[state=closed]:fade-out",
-    "ds:motion-reduce:animate-none"
-  ].join(" ")
-);
-function ge(r, a) {
-  const o = L(r.trim());
-  return o === "" ? a : a.map((n) => ({
-    ...n,
-    items: n.items.filter(
-      (p) => L(p.label).includes(o)
-    )
-  })).filter((n) => n.items.length > 0);
-}
-const ne = U(
-  (r, a) => {
-    const {
-      mode: o = "launcher",
-      size: n = "md",
-      density: p = "default",
-      topLevel: y = !1,
-      placeholder: d,
-      shortcutHint: h = !0,
-      className: v,
-      onOpenCommandPalette: t,
-      value: g,
-      defaultValue: z,
-      onQueryChange: k,
-      results: i,
-      onSelect: b,
-      debounceMs: C,
-      ...l
-    } = r, { t: c } = E(), [R, I] = V(!1);
-    O(() => {
-      I(se());
-    }, []);
-    const S = R ? "⌘K" : "Ctrl+K", u = "Meta+K Control+K", m = y ? { role: "search" } : { role: void 0 };
-    if (o === "launcher") {
-      const N = d ?? c("search.placeholder", "Search…");
-      return /* @__PURE__ */ s("div", { ref: a, ...m, "data-component": "search-bar", className: v, children: /* @__PURE__ */ D(
-        "button",
-        {
-          type: "button",
-          onClick: t,
-          "aria-haspopup": "dialog",
-          "aria-label": c("search.open", "Open search"),
-          "aria-keyshortcuts": u,
-          className: ae({ size: n, density: p }),
-          ...l,
-          children: [
-            /* @__PURE__ */ s(
-              Z,
-              {
-                "aria-hidden": !0,
-                className: "ds:size-4 ds:shrink-0",
-                focusable: "false"
-              }
-            ),
-            /* @__PURE__ */ s("span", { "aria-hidden": "true", className: "ds:truncate ds:text-start", children: N }),
-            h ? /* @__PURE__ */ s("kbd", { className: B(), children: S }) : null
-          ]
-        }
-      ) });
-    }
-    return /* @__PURE__ */ s(
-      oe,
-      {
-        forwardedRef: a,
-        size: n,
-        density: p,
-        landmarkProps: m,
-        placeholder: d,
-        shortcutHint: h,
-        shortcutLabel: S,
-        ariaKeyshortcuts: u,
-        className: v,
-        ...r
-      }
-    );
-  }
-);
-ne.displayName = "SearchBar";
-function oe(r) {
-  const {
-    forwardedRef: a,
-    size: o,
-    density: n,
-    landmarkProps: p,
-    placeholder: y,
-    shortcutHint: d,
-    shortcutLabel: h,
-    ariaKeyshortcuts: v,
-    className: t,
-    value: g,
-    defaultValue: z,
-    onQueryChange: k,
-    results: i,
-    onSelect: b,
-    debounceMs: C = 150
-  } = r, { t: l } = E(), c = g !== void 0, [R, I] = V(z ?? ""), S = c ? g ?? "" : R, [u, m] = V(!1), [x, N] = V(0), H = W(null), M = J(), $ = ee((e) => {
-    k == null || k(e);
-  }, C), f = X(() => i ? i.flatMap((e) => e.items) : [], [i]);
-  O(() => {
-    x > f.length - 1 && N(0);
-  }, [f.length, x]);
-  const q = _(
-    (e) => {
-      c || I(e), $(e), m(e.trim().length > 0);
-    },
-    [$, c]
-  ), A = _(
-    (e) => {
-      b == null || b(e), m(!1), c || I("");
-    },
-    [b, c]
-  ), F = _(
-    (e) => {
-      if (!(e.nativeEvent.isComposing || e.keyCode === 229)) {
-        if (!u && e.key === "ArrowDown" && f.length > 0) {
-          e.preventDefault(), m(!0);
-          return;
-        }
-        if (u)
-          if (e.key === "ArrowDown")
-            e.preventDefault(), N((w) => (w + 1) % Math.max(f.length, 1));
-          else if (e.key === "ArrowUp")
-            e.preventDefault(), N(
-              (w) => (w - 1 + Math.max(f.length, 1)) % Math.max(f.length, 1)
-            );
-          else if (e.key === "Enter") {
-            const w = f[x];
-            w && (e.preventDefault(), A(w));
-          } else e.key === "Escape" && (e.preventDefault(), m(!1));
-      }
-    },
-    [u, f, x, A]
-  ), Q = y ?? l("search.placeholder", "Search…"), K = f.length > 0, T = u && K ? `${M}-option-${x}` : void 0;
-  return /* @__PURE__ */ s(j.Root, { open: u && K, onOpenChange: m, children: /* @__PURE__ */ D(
-    "div",
-    {
-      ref: a,
-      ...p,
-      "data-component": "search-bar",
-      className: [re({ size: o, density: n }), t].filter(Boolean).join(" "),
-      children: [
-        /* @__PURE__ */ s(j.Anchor, { asChild: !0, children: /* @__PURE__ */ D(
-          "div",
-          {
-            className: "ds:relative ds:flex ds:items-center",
-            onKeyDown: F,
-            children: [
-              /* @__PURE__ */ s(
-                Y,
-                {
-                  ref: H,
-                  size: o,
-                  value: S,
-                  onInput: q,
-                  placeholder: Q,
-                  "aria-label": l("search.label", "Search"),
-                  "aria-keyshortcuts": v,
-                  role: "combobox",
-                  "aria-expanded": u && K,
-                  "aria-controls": M,
-                  "aria-activedescendant": T
-                }
-              ),
-              d ? /* @__PURE__ */ s(
-                "kbd",
-                {
-                  className: [
-                    B(),
-                    "ds:absolute ds:end-[var(--spacing-sm)] ds:top-1/2 ds:-translate-y-1/2",
-                    "ds:pointer-events-none"
-                  ].join(" "),
-                  children: h
-                }
-              ) : null
-            ]
-          }
-        ) }),
-        /* @__PURE__ */ s(j.Portal, { children: /* @__PURE__ */ s(
-          j.Content,
-          {
-            side: "bottom",
-            align: "start",
-            sideOffset: 4,
-            "aria-label": l("search.resultsLabel", "Search results"),
-            onOpenAutoFocus: (e) => e.preventDefault(),
-            className: [
-              te(),
-              "ds:w-[var(--radix-popover-trigger-width)]"
-            ].join(" "),
-            children: /* @__PURE__ */ s(
-              "div",
-              {
-                id: M,
-                role: "listbox",
-                "aria-label": l("search.resultsLabel", "Search results"),
-                className: "ds:flex ds:flex-col ds:gap-[calc(var(--spacing-xs)/2)]",
-                children: i && i.length > 0 ? de(
-                  i,
-                  x,
-                  M,
-                  A,
-                  N
-                ) : /* @__PURE__ */ s(
-                  "div",
-                  {
-                    role: "presentation",
-                    className: "ds:p-[var(--spacing-sm)] type-body-sm ds:text-[color:var(--foreground)]",
-                    children: l("search.noResults", "No results for “{{query}}”", {
-                      query: S
-                    })
-                  }
-                )
-              }
-            )
-          }
-        ) })
-      ]
-    }
-  ) });
-}
-function de(r, a, o, n, p) {
-  let y = 0;
-  return r.map((d, h) => {
-    const v = d.heading ? `${o}-group-${h}-heading` : void 0;
-    return /* @__PURE__ */ D(
-      "div",
-      {
-        role: d.heading ? "group" : "presentation",
-        "aria-labelledby": v,
-        children: [
-          d.heading ? /* @__PURE__ */ s(
-            "div",
-            {
-              id: v,
-              "aria-hidden": "true",
-              className: "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:pt-[var(--spacing-xs)] ds:pb-[var(--spacing-xs)] type-eyebrow ds:text-[color:var(--foreground)]",
-              children: d.heading
-            }
-          ) : null,
-          d.items.map((t) => {
-            const g = y;
-            y += 1;
-            const z = g === a, k = `${o}-option-${g}`, i = ie(t.href), b = [
-              "ds:flex ds:items-center ds:gap-[var(--spacing-sm)]",
-              "ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)]",
-              "ds:pt-[var(--spacing-xs)] ds:pb-[var(--spacing-xs)]",
-              "ds:rounded-[var(--radius-sm)]",
-              "ds:cursor-pointer",
-              "ds:no-underline ds:text-[color:var(--foreground)]",
-              "ds:min-h-[var(--min-target-size)]",
-              z ? "ds:bg-[var(--muted)]/40" : ""
-            ].join(" "), C = /* @__PURE__ */ D(G, { children: [
-              t.icon ? /* @__PURE__ */ s(
-                "span",
-                {
-                  "aria-hidden": "true",
-                  className: "ds:inline-flex ds:size-4 ds:shrink-0 ds:items-center ds:justify-center",
-                  children: t.icon
-                }
-              ) : null,
-              /* @__PURE__ */ s("span", { className: "ds:flex-1 ds:text-[length:var(--font-size-sm)]", children: t.label }),
-              t.meta ? /* @__PURE__ */ s("span", { className: "ds:ms-auto type-meta ds:text-[color:var(--foreground)]", children: t.meta }) : null
-            ] }), l = {
-              id: k,
-              role: "option",
-              "aria-selected": z,
-              // onMouseDown rather than onClick so we trigger before the
-              // input loses focus to the pointer-down on the popover.
-              onMouseDown: (c) => {
-                c.preventDefault(), n(t);
-              },
-              onMouseEnter: () => p(g),
-              className: b
-            };
-            return i ? /* @__PURE__ */ s("a", { href: i, ...l, children: C }, t.id) : /* @__PURE__ */ s("div", { ...l, children: C }, t.id);
-          })
-        ]
-      },
-      `g-${h}`
-    );
-  });
-}
-function ie(r) {
-  if (!r) return;
-  const a = r.trim();
-  if (a !== "" && (/^(https?:|mailto:|tel:)/i.test(a) || /^(\/|\.\/|\.\.\/)/.test(a)))
-    return a;
-}
-export {
-  ne as S,
-  ge as f
-};
-//# sourceMappingURL=search-bar-fcGqDFW3.js.map

package/dist/_chunks/search-input-BVMCONyN.js

@@ -1,197 +0,0 @@
-import { jsx as t, jsxs as ne } from "react/jsx-runtime";
-import { forwardRef as ie, useState as A, useRef as B, useCallback as m, useLayoutEffect as ae, useEffect as oe } from "react";
-import { c as b } from "./index-D2ZczOXr.js";
-import { useTranslation as de } from "react-i18next";
-import { T as le } from "./text-input-CRHvl5zk.js";
-import { S as ce } from "./spinner-GCcv67vh.js";
-import { u as ue } from "./form-field-context-94LwgYTQ.js";
-import { u as fe } from "./use-debounced-callback-BisrB-Fq.js";
-import { S as F } from "./search-BonnQsHv.js";
-import { X as me } from "./x-CCcI3eJp.js";
-const be = b("ds:relative ds:w-full"), pe = b(
-  [
-    "ds:absolute ds:inset-y-0 ds:end-0 ds:pe-3",
-    "ds:inline-flex ds:items-center ds:justify-center ds:pointer-events-auto",
-    "ds:text-muted-foreground ds:hover:text-foreground",
-    "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
-    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
-    "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
-    "ds:rounded-[var(--radius-sm)]",
-    "ds:forced-colors:focus-visible:outline-[CanvasText]"
-  ].join(" ")
-), ve = b(
-  [
-    "ds:inline-flex ds:items-center ds:justify-center ds:shrink-0",
-    "ds:size-[var(--min-target-size)] ds:rounded-[var(--radius-sm)]",
-    "ds:bg-background ds:border ds:border-border ds:text-muted-foreground",
-    "ds:transition-colors ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none",
-    "ds:hover:text-foreground ds:hover:bg-muted",
-    "ds:focus-visible:outline-[length:var(--focus-ring-width)] ds:focus-visible:outline-solid",
-    "ds:focus-visible:outline-ring ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
-    "ds:disabled:cursor-not-allowed ds:disabled:opacity-50",
-    "ds:forced-colors:focus-visible:outline-[CanvasText]"
-  ].join(" ")
-), he = b(
-  [
-    "ds:inline-flex ds:items-center",
-    "ds:transition-[width] ds:duration-[var(--animation-duration)] ds:motion-reduce:transition-none"
-  ].join(" ")
-);
-function xe(i) {
-  if (!i) return !1;
-  const o = i.tagName;
-  return !!(o === "INPUT" || o === "TEXTAREA" || o === "SELECT" || i.isContentEditable);
-}
-const ge = ie(
-  ({
-    value: i,
-    defaultValue: o,
-    onChange: n,
-    onInput: r,
-    debounceMs: K = 200,
-    isLoading: c = !1,
-    variant: d = "inline",
-    size: L = "md",
-    globalShortcut: p,
-    placeholder: P,
-    disabled: X,
-    className: N,
-    name: O,
-    id: U,
-    form: W,
-    autoComplete: q = "off",
-    autoFocus: G,
-    role: H,
-    ...u
-  }, l) => {
-    const { t: v } = de(), T = ue(), V = U ?? T.id, h = !!(T.disabled || X), x = i !== void 0, [J, M] = A(
-      String(o ?? "")
-    ), j = x ? String(i) : J, g = j.length > 0, a = B(null), Q = m(
-      (e) => {
-        a.current = e, typeof l == "function" ? l(e) : l && (l.current = e);
-      },
-      [l]
-    ), [y, E] = A(
-      d === "inline" || g
-    ), f = B(!1);
-    ae(() => {
-      f.current && a.current && (a.current.focus(), f.current = !1);
-    });
-    const w = fe(
-      (e) => {
-        n == null || n(e);
-      },
-      K
-    ), S = m(
-      (e) => {
-        w.cancel(), n == null || n(e);
-      },
-      [w, n]
-    ), k = m(
-      (e) => {
-        x || M(e);
-      },
-      [x]
-    ), Y = (e) => {
-      const s = e.target.value;
-      k(s), s === "" ? S("") : w(s);
-    }, Z = (e) => {
-      const s = e.currentTarget.value;
-      r == null || r(s);
-    }, _ = (e) => {
-      var s;
-      e.key === "Escape" && (e.nativeEvent.isComposing || g && (e.preventDefault(), e.stopPropagation(), k(""), r == null || r(""), S(""), (s = a.current) == null || s.focus()));
-    }, $ = () => {
-      var e;
-      k(""), r == null || r(""), S(""), (e = a.current) == null || e.focus();
-    }, I = (e) => {
-      d === "expandable" && e.currentTarget.value === "" && E(!1);
-    }, C = m(() => {
-      var e;
-      d === "expandable" && !y ? (f.current = !0, E(!0)) : (e = a.current) == null || e.focus();
-    }, [d, y]);
-    oe(() => {
-      if (!p) return;
-      const e = (s) => {
-        s.key === p && (s.isComposing || s.defaultPrevented || xe(document.activeElement) || (s.preventDefault(), C()));
-      };
-      return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
-    }, [p, C]);
-    const ee = v("ui.inputs.search.clear", "Clear search"), D = v("ui.inputs.search.loading", "Searching…"), se = v("ui.inputs.search.placeholder", "Search…"), z = P ?? se;
-    if (d === "expandable" && !y)
-      return /* @__PURE__ */ t("div", { "data-component": "search-input", className: he({ className: N }), children: /* @__PURE__ */ t(
-        "button",
-        {
-          type: "button",
-          "aria-label": z,
-          "aria-expanded": !1,
-          "aria-controls": V,
-          disabled: h,
-          onClick: () => {
-            f.current = !0, E(!0);
-          },
-          className: ve(),
-          children: /* @__PURE__ */ t(F, { "aria-hidden": "true", className: "ds:size-4" })
-        }
-      ) });
-    const te = H === "combobox" ? {
-      role: "combobox",
-      "aria-expanded": u["aria-expanded"],
-      "aria-controls": u["aria-controls"],
-      "aria-activedescendant": u["aria-activedescendant"]
-    } : void 0, R = g && !c && !h, re = c ? /* @__PURE__ */ t(ce, { size: "sm", label: D }) : R ? /* @__PURE__ */ t("span", { className: "ds:inline-block ds:size-4", "aria-hidden": "true" }) : void 0;
-    return /* @__PURE__ */ ne("div", { "data-component": "search-input", className: be({ className: N }), children: [
-      /* @__PURE__ */ t(
-        le,
-        {
-          ref: Q,
-          id: V,
-          type: "search",
-          size: L,
-          value: j,
-          disabled: h,
-          placeholder: z,
-          name: O,
-          form: W,
-          autoComplete: q,
-          autoFocus: G,
-          startAdornment: /* @__PURE__ */ t(F, {}),
-          endAdornment: re,
-          clearable: !1,
-          onChange: Y,
-          onInput: Z,
-          onKeyDown: _,
-          onBlur: I,
-          "aria-label": u["aria-label"],
-          "aria-busy": c || void 0,
-          ...te
-        }
-      ),
-      R ? /* @__PURE__ */ t(
-        "button",
-        {
-          type: "button",
-          "aria-label": ee,
-          onClick: $,
-          className: pe(),
-          children: /* @__PURE__ */ t(me, { "aria-hidden": "true", className: "ds:size-4" })
-        }
-      ) : null,
-      /* @__PURE__ */ t(
-        "span",
-        {
-          role: "status",
-          "aria-live": "polite",
-          "aria-atomic": "true",
-          className: "ds:sr-only",
-          children: c ? D : ""
-        }
-      )
-    ] });
-  }
-);
-ge.displayName = "SearchInput";
-export {
-  ge as S
-};
-//# sourceMappingURL=search-input-BVMCONyN.js.map