@craftzbay/ui 0.10.0 → 0.11.0

package/dist-lib/components/ui/Combobox.js

@@ -1,164 +1,195 @@
 "use client";
-import { jsxs as r, jsx as e } from "react/jsx-runtime";
-import { forwardRef as O, useState as i, useMemo as R, useEffect as ee, useCallback as te } from "react";
+import { jsxs as o, jsx as r } from "react/jsx-runtime";
+import { forwardRef as de, useState as s, useCallback as D, useMemo as M, useRef as ie, useEffect as Q } from "react";
 import * as p from "@radix-ui/react-popover";
-import { Command as d } from "cmdk";
-import { X as re, ChevronsUpDown as oe, Loader2 as ae, Check as se } from "../../icons/index.js";
-import { cn as c } from "../../lib/utils.js";
-import { useStrings as le } from "../../hooks/use-strings.js";
-import { useFieldIds as ne } from "../../hooks/use-field-ids.js";
-import { IconButton as ie } from "./IconButton.js";
-const de = O(function({
-  value: o,
-  onChange: x,
-  options: C,
-  loadOptions: a,
-  selectedLabel: g,
-  label: I,
-  helperText: h,
-  error: v,
-  placeholder: H,
-  searchPlaceholder: L,
-  emptyText: q,
-  clearable: P = !0,
-  disabled: z,
-  size: u = "md",
-  id: D,
-  className: M
-}, Q) {
-  const m = le(), T = H ?? m.combobox.placeholder, U = L ?? m.combobox.searchPlaceholder, V = q ?? m.combobox.empty, N = !!v, { fieldId: y, helperId: X, errorId: $, describedBy: A } = ne(D, {
-    hasHelper: !!h,
-    hasError: N
-  }), k = `${y}-list`, [f, S] = i(!1), [w, G] = i(""), [B, J] = i([]), [E, j] = i(!1), [l, F] = i(null), b = R(() => a ? B : C ?? [], [a, B, C]);
-  ee(() => {
-    if (!a || !f) return;
+import { Command as f } from "cmdk";
+import { X as ce, ChevronsUpDown as ue, Loader2 as me, Check as fe } from "../../icons/index.js";
+import { cn as b } from "../../lib/utils.js";
+import { useStrings as be } from "../../hooks/use-strings.js";
+import { useFieldIds as xe } from "../../hooks/use-field-ids.js";
+import { IconButton as pe } from "./IconButton.js";
+const ge = de(function({
+  value: a,
+  onChange: g,
+  options: k,
+  loadOptions: l,
+  selectedLabel: h,
+  label: n,
+  helperText: v,
+  error: y,
+  placeholder: U,
+  searchPlaceholder: V,
+  emptyText: X,
+  loadErrorText: A,
+  clearable: z = !0,
+  disabled: L,
+  size: x = "md",
+  id: R,
+  className: G
+}, J) {
+  const d = be(), N = U ?? d.combobox.placeholder, K = V ?? d.combobox.searchPlaceholder, W = X ?? d.combobox.empty, Y = A ?? d.combobox.loadError, w = !!y, { fieldId: c, helperId: Z, errorId: _, describedBy: O } = xe(R, {
+    hasHelper: !!v,
+    hasError: w
+  }), [ee, re] = s(void 0), te = D((e) => re(e == null ? void 0 : e.id), []), [u, B] = s(!1), [C, oe] = s(""), [S, j] = s([]), [I, F] = s(!1), [T, $] = s(!1), [m, H] = s(null), E = M(
+    () => l ? S : k ?? [],
+    [l, S, k]
+  ), q = ie(l);
+  Q(() => {
+    q.current = l;
+  }), Q(() => {
+    const e = q.current;
+    if (!e || !u) return;
     let t = !1;
-    return j(!0), a(w).then((n) => {
-      t || J(n);
+    return F(!0), $(!1), e(C).then((P) => {
+      t || j(P);
+    }).catch(() => {
+      t || (j([]), $(!0));
     }).finally(() => {
-      t || j(!1);
+      t || F(!1);
     }), () => {
       t = !0;
     };
-  }, [w, f, a]);
-  const s = R(() => {
-    if (o == null) return null;
-    const t = b.find((n) => n.value === o);
-    return t || ((l == null ? void 0 : l.value) === o ? l : g !== void 0 ? { value: o, label: g } : null);
-  }, [b, o, l, g]), K = u === "sm" ? "h-8" : u === "lg" ? "h-10" : "h-9", W = u === "sm" ? "px-2.5" : u === "lg" ? "px-3.5" : "px-3", Y = P ? "pr-14" : "pr-9", Z = te(() => {
-    F(null), x(null);
-  }, [x]);
-  return /* @__PURE__ */ r("div", { ref: Q, className: c("flex flex-col gap-1.5", M), children: [
-    I && /* @__PURE__ */ e("label", { htmlFor: y, className: "text-foreground text-sm font-medium", children: I }),
-    /* @__PURE__ */ r(p.Root, { open: f, onOpenChange: S, children: [
-      /* @__PURE__ */ r("div", { className: "relative w-full", children: [
-        /* @__PURE__ */ e(p.Trigger, { asChild: !0, children: /* @__PURE__ */ e(
+  }, [C, u, !!l]);
+  const i = M(() => {
+    if (a == null) return null;
+    const e = E.find((t) => t.value === a);
+    return e || ((m == null ? void 0 : m.value) === a ? m : h !== void 0 ? { value: a, label: h } : null);
+  }, [E, a, m, h]), ae = x === "sm" ? "h-8" : x === "lg" ? "h-10" : "h-9", se = x === "sm" ? "px-2.5" : x === "lg" ? "px-3.5" : "px-3", le = z ? "pr-14" : "pr-9", ne = D(() => {
+    H(null), g(null);
+  }, [g]);
+  return /* @__PURE__ */ o("div", { ref: J, className: b("flex flex-col gap-1.5", G), children: [
+    n && /* @__PURE__ */ r(
+      "label",
+      {
+        id: `${c}-label`,
+        htmlFor: c,
+        className: "text-foreground text-sm font-medium",
+        children: n
+      }
+    ),
+    /* @__PURE__ */ o(p.Root, { open: u, onOpenChange: B, children: [
+      /* @__PURE__ */ o("div", { className: "relative w-full", children: [
+        /* @__PURE__ */ r(p.Trigger, { asChild: !0, children: /* @__PURE__ */ r(
           "button",
           {
-            id: y,
+            id: c,
             type: "button",
             role: "combobox",
-            "aria-expanded": f,
+            "aria-expanded": u,
             "aria-haspopup": "listbox",
-            "aria-controls": k,
-            "aria-invalid": N || void 0,
-            "aria-describedby": A,
-            disabled: z,
-            className: c(
+            "aria-controls": u ? ee : void 0,
+            "aria-labelledby": n ? `${c}-label` : void 0,
+            "aria-label": n || R ? void 0 : N,
+            "aria-invalid": w || void 0,
+            "aria-describedby": O,
+            disabled: L,
+            className: b(
               "bg-card text-foreground inline-flex w-full items-center justify-between gap-2 rounded-md border text-sm",
               "transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out)]",
               "focus-visible:ring-offset-background outline-none focus-visible:ring-2 focus-visible:ring-offset-2",
               "disabled:cursor-not-allowed disabled:opacity-50",
-              K,
-              W,
-              Y,
-              N ? "border-danger focus-visible:border-danger focus-visible:ring-danger" : "border-border focus-visible:border-accent focus-visible:ring-ring"
+              ae,
+              se,
+              le,
+              w ? "border-danger focus-visible:border-danger focus-visible:ring-danger" : "border-border-input focus-visible:border-accent focus-visible:ring-ring"
             ),
-            children: /* @__PURE__ */ e(
+            children: /* @__PURE__ */ r(
               "span",
               {
-                className: c("truncate", !s && "text-foreground-subtle"),
-                title: s ? s.label : void 0,
-                children: s ? s.label : T
+                className: b("truncate", !i && "text-foreground-subtle"),
+                title: i ? i.label : void 0,
+                children: i ? i.label : N
               }
             )
           }
         ) }),
-        /* @__PURE__ */ r("span", { className: "pointer-events-none absolute inset-y-0 right-0 flex items-center gap-0.5 pr-2", children: [
-          P && s && !z && /* @__PURE__ */ e(
-            ie,
+        /* @__PURE__ */ o("span", { className: "pointer-events-none absolute inset-y-0 right-0 flex items-center gap-0.5 pr-2", children: [
+          z && i && !L && /* @__PURE__ */ r(
+            pe,
             {
               size: "sm",
               variant: "ghost",
-              "aria-label": m.combobox.clear,
-              icon: /* @__PURE__ */ e(re, {}),
-              onClick: Z,
+              "aria-label": d.combobox.clear,
+              icon: /* @__PURE__ */ r(ce, {}),
+              onClick: ne,
               className: "text-foreground-subtle hover:text-foreground pointer-events-auto size-6"
             }
           ),
-          /* @__PURE__ */ e(oe, { className: "text-foreground-subtle size-4", "aria-hidden": !0 })
+          /* @__PURE__ */ r(ue, { className: "text-foreground-subtle size-4", "aria-hidden": !0 })
         ] })
       ] }),
-      /* @__PURE__ */ e(p.Portal, { children: /* @__PURE__ */ e(
+      /* @__PURE__ */ r(p.Portal, { children: /* @__PURE__ */ r(
         p.Content,
         {
+          "aria-labelledby": n ? `${c}-label` : void 0,
+          "aria-label": n ? void 0 : N,
           align: "start",
           sideOffset: 4,
-          className: c(
+          className: b(
             "border-border bg-popover text-popover-foreground z-[var(--z-popover)] w-[var(--radix-popover-trigger-width)] overflow-hidden rounded-lg border shadow-md",
             "data-[state=open]:animate-in data-[state=closed]:animate-out",
             "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
             "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95"
           ),
-          children: /* @__PURE__ */ r(d, { shouldFilter: !a, className: "flex h-full w-full flex-col", children: [
-            /* @__PURE__ */ r("div", { className: "border-border flex items-center border-b px-3", children: [
-              /* @__PURE__ */ e(
-                d.Input,
+          children: /* @__PURE__ */ o(f, { shouldFilter: !l, className: "flex h-full w-full flex-col", children: [
+            /* @__PURE__ */ o("div", { className: "border-border flex items-center border-b px-3", children: [
+              /* @__PURE__ */ r(
+                f.Input,
                 {
-                  value: w,
-                  onValueChange: G,
-                  placeholder: U,
-                  className: "placeholder:text-foreground-subtle flex h-9 w-full bg-transparent py-2 text-sm outline-none"
+                  value: C,
+                  onValueChange: oe,
+                  placeholder: K,
+                  className: "placeholder:text-foreground-subtle flex h-9 w-full bg-transparent py-2 text-lg outline-none md:text-sm"
                 }
               ),
-              E && /* @__PURE__ */ e(ae, { className: "text-foreground-subtle size-4 animate-spin", "aria-hidden": !0 })
+              I && /* @__PURE__ */ r(me, { className: "text-foreground-subtle size-4 animate-spin", "aria-hidden": !0 })
             ] }),
-            /* @__PURE__ */ r(d.List, { id: k, className: "max-h-64 overflow-y-auto p-1", children: [
-              b.map((t) => {
-                const n = t.value === o;
-                return /* @__PURE__ */ r(
-                  d.Item,
-                  {
-                    value: t.value,
-                    disabled: t.disabled,
-                    onSelect: (_) => {
-                      F(t), x(_), S(!1);
-                    },
-                    className: c(
-                      "text-foreground flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm",
-                      "data-[selected=true]:bg-background-muted",
-                      "data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50"
-                    ),
-                    children: [
-                      /* @__PURE__ */ e("span", { className: "flex-1", children: t.label }),
-                      t.description && /* @__PURE__ */ e("span", { className: "text-foreground-subtle text-xs", children: t.description }),
-                      n && /* @__PURE__ */ e(se, { className: "text-accent size-4", "aria-hidden": !0 })
-                    ]
-                  },
-                  t.value
-                );
-              }),
-              !E && b.length === 0 && /* @__PURE__ */ e(d.Empty, { className: "text-foreground-subtle px-2 py-6 text-center text-sm", children: V })
-            ] })
+            /* @__PURE__ */ o(
+              f.List,
+              {
+                ref: te,
+                label: d.command.suggestions,
+                className: "max-h-64 overflow-y-auto p-1",
+                children: [
+                  E.map((e) => {
+                    const t = e.value === a;
+                    return /* @__PURE__ */ o(
+                      f.Item,
+                      {
+                        value: e.value,
+                        keywords: e.description ? [e.label, e.description] : [e.label],
+                        disabled: e.disabled,
+                        onSelect: (P) => {
+                          H(e), g(P), B(!1);
+                        },
+                        className: b(
+                          "text-foreground flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm",
+                          "data-[selected=true]:bg-background-muted",
+                          "data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50"
+                        ),
+                        children: [
+                          /* @__PURE__ */ r("span", { className: "flex-1", children: e.label }),
+                          e.description && /* @__PURE__ */ r("span", { className: "text-foreground-subtle text-xs", children: e.description }),
+                          t && /* @__PURE__ */ r(fe, { className: "text-accent size-4", "aria-hidden": !0 })
+                        ]
+                      },
+                      e.value
+                    );
+                  }),
+                  T && !I && /* @__PURE__ */ r("div", { className: "text-danger-text px-2 py-6 text-center text-sm", children: Y }),
+                  !I && !T && /* @__PURE__ */ r(f.Empty, { className: "text-foreground-subtle px-2 py-6 text-center text-sm", children: W })
+                ]
+              }
+            )
           ] })
         }
       ) })
     ] }),
-    v ? /* @__PURE__ */ e("p", { id: $, role: "alert", className: "text-danger-text text-xs", children: v }) : h ? /* @__PURE__ */ e("p", { id: X, className: "text-foreground-subtle text-xs", children: h }) : null
+    y ? /* @__PURE__ */ r("p", { id: _, className: "text-danger-text text-xs", children: y }) : v ? /* @__PURE__ */ r("p", { id: Z, className: "text-foreground-subtle text-xs", children: v }) : null
   ] });
 });
-de.displayName = "Combobox";
+ge.displayName = "Combobox";
 export {
-  de as Combobox
+  ge as Combobox
 };
 //# sourceMappingURL=Combobox.js.map

package/dist-lib/components/ui/Combobox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.js","sources":["../../../src/components/ui/Combobox.tsx"],"sourcesContent":["'use client';\n\nimport { forwardRef, useCallback, useEffect, useMemo, useState, type ReactNode } from 'react';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport { Command as CommandPrimitive } from 'cmdk';\nimport { Check, ChevronsUpDown, Loader2, X } from '@/icons';\nimport { cn } from '@/lib/utils';\nimport { useStrings } from '@/hooks/use-strings';\nimport { useFieldIds } from '@/hooks/use-field-ids';\nimport { IconButton } from './IconButton';\n\nexport interface ComboboxOption {\n  value: string;\n  label: string;\n  description?: string;\n  disabled?: boolean;\n}\n\nexport interface ComboboxProps {\n  /** Currently selected value (controlled). */\n  value: string | null;\n  /** Called when a value is picked or cleared. */\n  onChange: (value: string | null) => void;\n  /** Static options. Ignored if `loadOptions` is provided. */\n  options?: ComboboxOption[];\n  /**\n   * Async loader called with the current query each time it changes.\n   * Use for server-side search.\n   */\n  loadOptions?: (query: string) => Promise<ComboboxOption[]>;\n  /**\n   * Label to show for a preset `value` in `loadOptions` mode before the\n   * first search has resolved (the component has no option list yet).\n   */\n  selectedLabel?: string;\n  /** Visible label above the field. */\n  label?: ReactNode;\n  /** Hint below the field. Hidden when `error` is set. */\n  helperText?: ReactNode;\n  /** Validation error. */\n  error?: ReactNode;\n  /** Placeholder shown when no value is selected. */\n  placeholder?: string;\n  /** Search placeholder inside the popover. */\n  searchPlaceholder?: string;\n  /** Empty state copy when nothing matches. */\n  emptyText?: string;\n  /** Allow clearing the selection with an inline ×. */\n  clearable?: boolean;\n  /** Disable the entire field. */\n  disabled?: boolean;\n  /** Field size, matches Input. */\n  size?: 'sm' | 'md' | 'lg';\n  /** Consumer-supplied id for the trigger (label association). */\n  id?: string;\n  className?: string;\n}\n\n/**\n * Single-select with typeahead. Use `options` for client-side filtering or\n * `loadOptions` for server-side search.\n *\n * @example Client-side\n *   <Combobox label=\"Country\" options={countries} value={c} onChange={setC} />\n *\n * @example Server-side\n *   <Combobox label=\"Assignee\"\n *             value={user}\n *             onChange={setUser}\n *             loadOptions={async (q) => api.searchUsers(q)} />\n *\n * @do Use Combobox over Select for >12 options or when the user is expected\n *      to know what they want.\n * @dont Re-query on every keystroke without debouncing — pass a debounced\n *       `loadOptions` to avoid hammering the server.\n */\nexport const Combobox = forwardRef<HTMLDivElement, ComboboxProps>(function Combobox(\n  {\n    value,\n    onChange,\n    options,\n    loadOptions,\n    selectedLabel,\n    label,\n    helperText,\n    error,\n    placeholder: placeholderProp,\n    searchPlaceholder: searchPlaceholderProp,\n    emptyText: emptyTextProp,\n    clearable = true,\n    disabled,\n    size = 'md',\n    id,\n    className,\n  },\n  ref,\n) {\n  const strings = useStrings();\n  const placeholder = placeholderProp ?? strings.combobox.placeholder;\n  const searchPlaceholder = searchPlaceholderProp ?? strings.combobox.searchPlaceholder;\n  const emptyText = emptyTextProp ?? strings.combobox.empty;\n  const isError = Boolean(error);\n  const { fieldId, helperId, errorId, describedBy } = useFieldIds(id, {\n    hasHelper: Boolean(helperText),\n    hasError: isError,\n  });\n  const listId = `${fieldId}-list`;\n\n  const [open, setOpen] = useState(false);\n  const [query, setQuery] = useState('');\n  const [loaded, setLoaded] = useState<ComboboxOption[]>([]);\n  const [loading, setLoading] = useState(false);\n  // In async mode the option list only exists after the first search, so the\n  // chosen option is remembered here to keep its label on the trigger.\n  const [selectedOption, setSelectedOption] = useState<ComboboxOption | null>(null);\n\n  // Resolve options: static or async-loaded.\n  const items = useMemo(() => (loadOptions ? loaded : (options ?? [])), [loadOptions, loaded, options]);\n\n  useEffect(() => {\n    if (!loadOptions || !open) return;\n    let cancelled = false;\n    setLoading(true);\n    loadOptions(query)\n      .then((res) => {\n        if (!cancelled) setLoaded(res);\n      })\n      .finally(() => {\n        if (!cancelled) setLoading(false);\n      });\n    return () => {\n      cancelled = true;\n    };\n  }, [query, open, loadOptions]);\n\n  const selected = useMemo<ComboboxOption | null>(() => {\n    if (value === null || value === undefined) return null;\n    const fromItems = items.find((o) => o.value === value);\n    if (fromItems) return fromItems;\n    if (selectedOption?.value === value) return selectedOption;\n    if (selectedLabel !== undefined) return { value, label: selectedLabel };\n    return null;\n  }, [items, value, selectedOption, selectedLabel]);\n\n  const triggerHeight = size === 'sm' ? 'h-8' : size === 'lg' ? 'h-10' : 'h-9';\n  const triggerPadding = size === 'sm' ? 'px-2.5' : size === 'lg' ? 'px-3.5' : 'px-3';\n  // Leave room on the right for the clear button + chevron.\n  const triggerPaddingRight = clearable ? 'pr-14' : 'pr-9';\n\n  const handleClear = useCallback(() => {\n    setSelectedOption(null);\n    onChange(null);\n  }, [onChange]);\n\n  return (\n    <div ref={ref} className={cn('flex flex-col gap-1.5', className)}>\n      {label && (\n        <label htmlFor={fieldId} className=\"text-foreground text-sm font-medium\">\n          {label}\n        </label>\n      )}\n\n      <PopoverPrimitive.Root open={open} onOpenChange={setOpen}>\n        <div className=\"relative w-full\">\n          <PopoverPrimitive.Trigger asChild>\n            <button\n              id={fieldId}\n              type=\"button\"\n              role=\"combobox\"\n              aria-expanded={open}\n              aria-haspopup=\"listbox\"\n              aria-controls={listId}\n              aria-invalid={isError || undefined}\n              aria-describedby={describedBy}\n              disabled={disabled}\n              className={cn(\n                'bg-card text-foreground inline-flex w-full items-center justify-between gap-2 rounded-md border text-sm',\n                'transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out)]',\n                'focus-visible:ring-offset-background outline-none focus-visible:ring-2 focus-visible:ring-offset-2',\n                'disabled:cursor-not-allowed disabled:opacity-50',\n                triggerHeight,\n                triggerPadding,\n                triggerPaddingRight,\n                isError\n                  ? 'border-danger focus-visible:border-danger focus-visible:ring-danger'\n                  : 'border-border focus-visible:border-accent focus-visible:ring-ring',\n              )}\n            >\n              <span\n                className={cn('truncate', !selected && 'text-foreground-subtle')}\n                title={selected ? selected.label : undefined}\n              >\n                {selected ? selected.label : placeholder}\n              </span>\n            </button>\n          </PopoverPrimitive.Trigger>\n\n          {/* Controls sit outside the trigger: a button inside a button is invalid HTML. */}\n          <span className=\"pointer-events-none absolute inset-y-0 right-0 flex items-center gap-0.5 pr-2\">\n            {clearable && selected && !disabled && (\n              <IconButton\n                size=\"sm\"\n                variant=\"ghost\"\n                aria-label={strings.combobox.clear}\n                icon={<X />}\n                onClick={handleClear}\n                className=\"text-foreground-subtle hover:text-foreground pointer-events-auto size-6\"\n              />\n            )}\n            <ChevronsUpDown className=\"text-foreground-subtle size-4\" aria-hidden />\n          </span>\n        </div>\n\n        <PopoverPrimitive.Portal>\n          <PopoverPrimitive.Content\n            align=\"start\"\n            sideOffset={4}\n            className={cn(\n              'border-border bg-popover text-popover-foreground z-[var(--z-popover)] w-[var(--radix-popover-trigger-width)] overflow-hidden rounded-lg border shadow-md',\n              'data-[state=open]:animate-in data-[state=closed]:animate-out',\n              'data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n              'data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',\n            )}\n          >\n            <CommandPrimitive shouldFilter={!loadOptions} className=\"flex h-full w-full flex-col\">\n              <div className=\"border-border flex items-center border-b px-3\">\n                <CommandPrimitive.Input\n                  value={query}\n                  onValueChange={setQuery}\n                  placeholder={searchPlaceholder}\n                  className=\"placeholder:text-foreground-subtle flex h-9 w-full bg-transparent py-2 text-sm outline-none\"\n                />\n                {loading && (\n                  <Loader2 className=\"text-foreground-subtle size-4 animate-spin\" aria-hidden />\n                )}\n              </div>\n              <CommandPrimitive.List id={listId} className=\"max-h-64 overflow-y-auto p-1\">\n                {items.map((opt) => {\n                  const isSelected = opt.value === value;\n                  return (\n                    <CommandPrimitive.Item\n                      key={opt.value}\n                      value={opt.value}\n                      disabled={opt.disabled}\n                      onSelect={(v) => {\n                        setSelectedOption(opt);\n                        onChange(v);\n                        setOpen(false);\n                      }}\n                      className={cn(\n                        'text-foreground flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm',\n                        'data-[selected=true]:bg-background-muted',\n                        'data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50',\n                      )}\n                    >\n                      <span className=\"flex-1\">{opt.label}</span>\n                      {opt.description && (\n                        <span className=\"text-foreground-subtle text-xs\">{opt.description}</span>\n                      )}\n                      {isSelected && <Check className=\"text-accent size-4\" aria-hidden />}\n                    </CommandPrimitive.Item>\n                  );\n                })}\n                {!loading && items.length === 0 && (\n                  <CommandPrimitive.Empty className=\"text-foreground-subtle px-2 py-6 text-center text-sm\">\n                    {emptyText}\n                  </CommandPrimitive.Empty>\n                )}\n              </CommandPrimitive.List>\n            </CommandPrimitive>\n          </PopoverPrimitive.Content>\n        </PopoverPrimitive.Portal>\n      </PopoverPrimitive.Root>\n\n      {error ? (\n        <p id={errorId} role=\"alert\" className=\"text-danger-text text-xs\">\n          {error}\n        </p>\n      ) : helperText ? (\n        <p id={helperId} className=\"text-foreground-subtle text-xs\">\n          {helperText}\n        </p>\n      ) : null}\n    </div>\n  );\n});\n\nCombobox.displayName = 'Combobox';\n"],"names":["Combobox","forwardRef","value","onChange","options","loadOptions","selectedLabel","label","helperText","error","placeholderProp","searchPlaceholderProp","emptyTextProp","clearable","disabled","size","id","className","ref","strings","useStrings","placeholder","searchPlaceholder","emptyText","isError","fieldId","helperId","errorId","describedBy","useFieldIds","listId","open","setOpen","useState","query","setQuery","loaded","setLoaded","loading","setLoading","selectedOption","setSelectedOption","items","useMemo","useEffect","cancelled","res","selected","fromItems","o","triggerHeight","triggerPadding","triggerPaddingRight","handleClear","useCallback","cn","PopoverPrimitive","jsxs","jsx","IconButton","X","ChevronsUpDown","CommandPrimitive","Loader2","opt","isSelected","v","Check"],"mappings":"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"}
+{"version":3,"file":"Combobox.js","sources":["../../../src/components/ui/Combobox.tsx"],"sourcesContent":["'use client';\n\nimport {\n  forwardRef,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n  type ReactNode,\n} from 'react';\nimport * as PopoverPrimitive from '@radix-ui/react-popover';\nimport { Command as CommandPrimitive } from 'cmdk';\nimport { Check, ChevronsUpDown, Loader2, X } from '@/icons';\nimport { cn } from '@/lib/utils';\nimport { useStrings } from '@/hooks/use-strings';\nimport { useFieldIds } from '@/hooks/use-field-ids';\nimport { IconButton } from './IconButton';\n\nexport interface ComboboxOption {\n  value: string;\n  label: string;\n  description?: string;\n  disabled?: boolean;\n}\n\nexport interface ComboboxProps {\n  /** Currently selected value (controlled). */\n  value: string | null;\n  /** Called when a value is picked or cleared. */\n  onChange: (value: string | null) => void;\n  /** Static options. Ignored if `loadOptions` is provided. */\n  options?: ComboboxOption[];\n  /**\n   * Async loader called with the current query each time it changes.\n   * Use for server-side search.\n   */\n  loadOptions?: (query: string) => Promise<ComboboxOption[]>;\n  /**\n   * Label to show for a preset `value` in `loadOptions` mode before the\n   * first search has resolved (the component has no option list yet).\n   */\n  selectedLabel?: string;\n  /** Visible label above the field. */\n  label?: ReactNode;\n  /** Hint below the field. Hidden when `error` is set. */\n  helperText?: ReactNode;\n  /** Validation error. */\n  error?: ReactNode;\n  /** Placeholder shown when no value is selected. */\n  placeholder?: string;\n  /** Search placeholder inside the popover. */\n  searchPlaceholder?: string;\n  /** Empty state copy when nothing matches. */\n  emptyText?: string;\n  /** Message shown when `loadOptions` rejects. */\n  loadErrorText?: string;\n  /** Allow clearing the selection with an inline ×. */\n  clearable?: boolean;\n  /** Disable the entire field. */\n  disabled?: boolean;\n  /** Field size, matches Input. */\n  size?: 'sm' | 'md' | 'lg';\n  /** Consumer-supplied id for the trigger (label association). */\n  id?: string;\n  className?: string;\n}\n\n/**\n * Single-select with typeahead. Use `options` for client-side filtering or\n * `loadOptions` for server-side search.\n *\n * @example Client-side\n *   <Combobox label=\"Country\" options={countries} value={c} onChange={setC} />\n *\n * @example Server-side\n *   <Combobox label=\"Assignee\"\n *             value={user}\n *             onChange={setUser}\n *             loadOptions={async (q) => api.searchUsers(q)} />\n *\n * @do Use Combobox over Select for >12 options or when the user is expected\n *      to know what they want.\n * @dont Re-query on every keystroke without debouncing — pass a debounced\n *       `loadOptions` to avoid hammering the server.\n */\nexport const Combobox = forwardRef<HTMLDivElement, ComboboxProps>(function Combobox(\n  {\n    value,\n    onChange,\n    options,\n    loadOptions,\n    selectedLabel,\n    label,\n    helperText,\n    error,\n    placeholder: placeholderProp,\n    searchPlaceholder: searchPlaceholderProp,\n    emptyText: emptyTextProp,\n    loadErrorText: loadErrorTextProp,\n    clearable = true,\n    disabled,\n    size = 'md',\n    id,\n    className,\n  },\n  ref,\n) {\n  const strings = useStrings();\n  const placeholder = placeholderProp ?? strings.combobox.placeholder;\n  const searchPlaceholder = searchPlaceholderProp ?? strings.combobox.searchPlaceholder;\n  const emptyText = emptyTextProp ?? strings.combobox.empty;\n  const loadErrorText = loadErrorTextProp ?? strings.combobox.loadError;\n  const isError = Boolean(error);\n  const { fieldId, helperId, errorId, describedBy } = useFieldIds(id, {\n    hasHelper: Boolean(helperText),\n    hasError: isError,\n  });\n  // cmdk assigns its own id to the list, so read it back from the node once\n  // the portal mounts; aria-controls is only set while the listbox exists.\n  const [listId, setListId] = useState<string | undefined>(undefined);\n  const listRef = useCallback((el: HTMLDivElement | null) => setListId(el?.id), []);\n\n  const [open, setOpen] = useState(false);\n  const [query, setQuery] = useState('');\n  const [loaded, setLoaded] = useState<ComboboxOption[]>([]);\n  const [loading, setLoading] = useState(false);\n  const [loadError, setLoadError] = useState(false);\n  // In async mode the option list only exists after the first search, so the\n  // chosen option is remembered here to keep its label on the trigger.\n  const [selectedOption, setSelectedOption] = useState<ComboboxOption | null>(null);\n\n  // Resolve options: static or async-loaded.\n  const items = useMemo(\n    () => (loadOptions ? loaded : (options ?? [])),\n    [loadOptions, loaded, options],\n  );\n\n  // Latest loader in a ref so an inline `loadOptions={async q => …}` does not\n  // retrigger the fetch on every parent render — only query / open do.\n  const loadRef = useRef(loadOptions);\n  useEffect(() => {\n    loadRef.current = loadOptions;\n  });\n  const hasLoader = Boolean(loadOptions);\n  useEffect(() => {\n    const load = loadRef.current;\n    if (!load || !open) return;\n    let cancelled = false;\n    setLoading(true);\n    setLoadError(false);\n    load(query)\n      .then((res) => {\n        if (!cancelled) setLoaded(res);\n      })\n      .catch(() => {\n        if (!cancelled) {\n          setLoaded([]);\n          setLoadError(true);\n        }\n      })\n      .finally(() => {\n        if (!cancelled) setLoading(false);\n      });\n    return () => {\n      cancelled = true;\n    };\n  }, [query, open, hasLoader]);\n\n  const selected = useMemo<ComboboxOption | null>(() => {\n    if (value === null || value === undefined) return null;\n    const fromItems = items.find((o) => o.value === value);\n    if (fromItems) return fromItems;\n    if (selectedOption?.value === value) return selectedOption;\n    if (selectedLabel !== undefined) return { value, label: selectedLabel };\n    return null;\n  }, [items, value, selectedOption, selectedLabel]);\n\n  const triggerHeight = size === 'sm' ? 'h-8' : size === 'lg' ? 'h-10' : 'h-9';\n  const triggerPadding = size === 'sm' ? 'px-2.5' : size === 'lg' ? 'px-3.5' : 'px-3';\n  // Leave room on the right for the clear button + chevron.\n  const triggerPaddingRight = clearable ? 'pr-14' : 'pr-9';\n\n  const handleClear = useCallback(() => {\n    setSelectedOption(null);\n    onChange(null);\n  }, [onChange]);\n\n  return (\n    <div ref={ref} className={cn('flex flex-col gap-1.5', className)}>\n      {label && (\n        <label\n          id={`${fieldId}-label`}\n          htmlFor={fieldId}\n          className=\"text-foreground text-sm font-medium\"\n        >\n          {label}\n        </label>\n      )}\n\n      <PopoverPrimitive.Root open={open} onOpenChange={setOpen}>\n        <div className=\"relative w-full\">\n          <PopoverPrimitive.Trigger asChild>\n            <button\n              id={fieldId}\n              type=\"button\"\n              role=\"combobox\"\n              aria-expanded={open}\n              aria-haspopup=\"listbox\"\n              aria-controls={open ? listId : undefined}\n              // role=combobox takes no name from content, so the placeholder\n              // must be exposed explicitly. A consumer `id` implies an external\n              // <label htmlFor>, which aria-label would override.\n              aria-labelledby={label ? `${fieldId}-label` : undefined}\n              aria-label={label || id ? undefined : placeholder}\n              aria-invalid={isError || undefined}\n              aria-describedby={describedBy}\n              disabled={disabled}\n              className={cn(\n                'bg-card text-foreground inline-flex w-full items-center justify-between gap-2 rounded-md border text-sm',\n                'transition-colors duration-[var(--duration-fast)] ease-[var(--ease-out)]',\n                'focus-visible:ring-offset-background outline-none focus-visible:ring-2 focus-visible:ring-offset-2',\n                'disabled:cursor-not-allowed disabled:opacity-50',\n                triggerHeight,\n                triggerPadding,\n                triggerPaddingRight,\n                isError\n                  ? 'border-danger focus-visible:border-danger focus-visible:ring-danger'\n                  : 'border-border-input focus-visible:border-accent focus-visible:ring-ring',\n              )}\n            >\n              <span\n                className={cn('truncate', !selected && 'text-foreground-subtle')}\n                title={selected ? selected.label : undefined}\n              >\n                {selected ? selected.label : placeholder}\n              </span>\n            </button>\n          </PopoverPrimitive.Trigger>\n\n          {/* Controls sit outside the trigger: a button inside a button is invalid HTML. */}\n          <span className=\"pointer-events-none absolute inset-y-0 right-0 flex items-center gap-0.5 pr-2\">\n            {clearable && selected && !disabled && (\n              <IconButton\n                size=\"sm\"\n                variant=\"ghost\"\n                aria-label={strings.combobox.clear}\n                icon={<X />}\n                onClick={handleClear}\n                className=\"text-foreground-subtle hover:text-foreground pointer-events-auto size-6\"\n              />\n            )}\n            <ChevronsUpDown className=\"text-foreground-subtle size-4\" aria-hidden />\n          </span>\n        </div>\n\n        <PopoverPrimitive.Portal>\n          <PopoverPrimitive.Content\n            // Radix gives the popover role=\"dialog\"; name it after the field.\n            aria-labelledby={label ? `${fieldId}-label` : undefined}\n            aria-label={label ? undefined : placeholder}\n            align=\"start\"\n            sideOffset={4}\n            className={cn(\n              'border-border bg-popover text-popover-foreground z-[var(--z-popover)] w-[var(--radix-popover-trigger-width)] overflow-hidden rounded-lg border shadow-md',\n              'data-[state=open]:animate-in data-[state=closed]:animate-out',\n              'data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n              'data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',\n            )}\n          >\n            <CommandPrimitive shouldFilter={!loadOptions} className=\"flex h-full w-full flex-col\">\n              <div className=\"border-border flex items-center border-b px-3\">\n                <CommandPrimitive.Input\n                  value={query}\n                  onValueChange={setQuery}\n                  placeholder={searchPlaceholder}\n                  className=\"placeholder:text-foreground-subtle flex h-9 w-full bg-transparent py-2 text-lg outline-none md:text-sm\"\n                />\n                {loading && (\n                  <Loader2 className=\"text-foreground-subtle size-4 animate-spin\" aria-hidden />\n                )}\n              </div>\n              <CommandPrimitive.List\n                ref={listRef}\n                label={strings.command.suggestions}\n                className=\"max-h-64 overflow-y-auto p-1\"\n              >\n                {items.map((opt) => {\n                  const isSelected = opt.value === value;\n                  return (\n                    <CommandPrimitive.Item\n                      key={opt.value}\n                      value={opt.value}\n                      // cmdk matches on value + keywords; users type the label, not the id.\n                      keywords={opt.description ? [opt.label, opt.description] : [opt.label]}\n                      disabled={opt.disabled}\n                      onSelect={(v) => {\n                        setSelectedOption(opt);\n                        onChange(v);\n                        setOpen(false);\n                      }}\n                      className={cn(\n                        'text-foreground flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm',\n                        'data-[selected=true]:bg-background-muted',\n                        'data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50',\n                      )}\n                    >\n                      <span className=\"flex-1\">{opt.label}</span>\n                      {opt.description && (\n                        <span className=\"text-foreground-subtle text-xs\">{opt.description}</span>\n                      )}\n                      {isSelected && <Check className=\"text-accent size-4\" aria-hidden />}\n                    </CommandPrimitive.Item>\n                  );\n                })}\n                {loadError && !loading && (\n                  <div className=\"text-danger-text px-2 py-6 text-center text-sm\">\n                    {loadErrorText}\n                  </div>\n                )}\n                {/* cmdk only shows Empty when no item matches the query, so it can always be mounted. */}\n                {!loading && !loadError && (\n                  <CommandPrimitive.Empty className=\"text-foreground-subtle px-2 py-6 text-center text-sm\">\n                    {emptyText}\n                  </CommandPrimitive.Empty>\n                )}\n              </CommandPrimitive.List>\n            </CommandPrimitive>\n          </PopoverPrimitive.Content>\n        </PopoverPrimitive.Portal>\n      </PopoverPrimitive.Root>\n\n      {error ? (\n        <p id={errorId} className=\"text-danger-text text-xs\">\n          {error}\n        </p>\n      ) : helperText ? (\n        <p id={helperId} className=\"text-foreground-subtle text-xs\">\n          {helperText}\n        </p>\n      ) : null}\n    </div>\n  );\n});\n\nCombobox.displayName = 'Combobox';\n"],"names":["Combobox","forwardRef","value","onChange","options","loadOptions","selectedLabel","label","helperText","error","placeholderProp","searchPlaceholderProp","emptyTextProp","loadErrorTextProp","clearable","disabled","size","id","className","ref","strings","useStrings","placeholder","searchPlaceholder","emptyText","loadErrorText","isError","fieldId","helperId","errorId","describedBy","useFieldIds","listId","setListId","useState","listRef","useCallback","el","open","setOpen","query","setQuery","loaded","setLoaded","loading","setLoading","loadError","setLoadError","selectedOption","setSelectedOption","items","useMemo","loadRef","useRef","useEffect","load","cancelled","res","selected","fromItems","o","triggerHeight","triggerPadding","triggerPaddingRight","handleClear","cn","jsx","PopoverPrimitive","jsxs","IconButton","X","ChevronsUpDown","CommandPrimitive","Loader2","opt","isSelected","v","Check"],"mappings":"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"}

package/dist-lib/components/ui/CommandPalette.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import { Dispatch, ReactNode, SetStateAction } from 'react';
 export declare const Command: import('react').ForwardRefExoticComponent<Omit<{
     children?: React.ReactNode;
 } & Pick<Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import('react').HTMLAttributes<HTMLDivElement>> & {
@@ -71,10 +71,13 @@ export declare const CommandItem: import('react').ForwardRefExoticComponent<Omit
     keywords?: string[];
     forceMount?: boolean;
 } & import('react').RefAttributes<HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
-export declare function CommandShortcut({ children, className }: {
+export declare function CommandShortcut({ children, className, }: {
     children: ReactNode;
     className?: string;
 }): import("react/jsx-runtime").JSX.Element;
+export declare namespace CommandShortcut {
+    var displayName: string;
+}
 export interface CommandDialogProps {
     open: boolean;
     onOpenChange: (open: boolean) => void;
@@ -106,4 +109,4 @@ export declare function CommandDialog({ open, onOpenChange, children, title }: C
  * @dont Hide essential actions behind the palette only — keep at least one
  *       button entry in the UI.
  */
-export declare function useCommandPaletteShortcut(setOpen: (open: boolean) => void): void;
+export declare function useCommandPaletteShortcut(setOpen: Dispatch<SetStateAction<boolean>>): void;