@alfadocs/ui-kit-debug 0.1.9 → 0.2.1

package/dist/_chunks/{audio-visualiser-CeMPCZkd.js → audio-visualiser-ByDEFLNm.js}

@@ -23,8 +23,16 @@ const K = H(
     defaultVariants: { size: "md" }
   }
 ), O = U(
-  ({ stream: m, size: T = "md", barCount: t = 32, deviceName: A, label: V, className: k, ...q }, B) => {
-    const { t: M } = J(), d = i([]), c = i(null), f = i(null), l = i(null), h = i(null), v = i(null), [R, j] = _(!1);
+  ({
+    stream: p,
+    size: T = "md",
+    barCount: t = 32,
+    deviceName: A,
+    label: V,
+    className: k,
+    ...q
+  }, B) => {
+    const { t: M } = J(), o = i([]), c = i(null), f = i(null), l = i(null), h = i(null), v = i(null), [R, j] = _(!1);
     b(() => {
       var n;
       if (typeof window > "u") return;
@@ -32,12 +40,12 @@ const K = H(
       j(e.matches);
       const r = () => j(e.matches);
       return (n = e.addEventListener) == null || n.call(e, "change", r), () => {
-        var o;
-        return (o = e.removeEventListener) == null ? void 0 : o.call(e, "change", r);
+        var d;
+        return (d = e.removeEventListener) == null ? void 0 : d.call(e, "change", r);
       };
     }, []), b(() => {
-      if (!m) {
-        d.current.forEach((s) => {
+      if (!p) {
+        o.current.forEach((s) => {
           s == null || s.style.setProperty("--bar-height", "10%");
         });
         return;
@@ -46,8 +54,8 @@ const K = H(
       if (!e) return;
       const r = new e(), n = r.createAnalyser();
       n.fftSize = 256;
-      const o = r.createMediaStreamSource(m);
-      o.connect(n), f.current = r, l.current = n, h.current = o, v.current = new Uint8Array(n.frequencyBinCount);
+      const d = r.createMediaStreamSource(p);
+      d.connect(n), f.current = r, l.current = n, h.current = d, v.current = new Uint8Array(n.frequencyBinCount);
       let z = 0;
       const x = (s) => {
         var E;
@@ -62,12 +70,12 @@ const K = H(
           a
         );
         const y = Math.max(1, Math.floor(a.length / t));
-        for (let p = 0; p < t; p += 1) {
+        for (let m = 0; m < t; m += 1) {
           let L = 0;
           for (let w = 0; w < y; w += 1)
-            L += a[p * y + w] ?? 0;
+            L += a[m * y + w] ?? 0;
           const D = L / y, I = Math.max(8, Math.min(100, D / 255 * 100));
-          (E = d.current[p]) == null || E.style.setProperty("--bar-height", `${I}%`);
+          (E = o.current[m]) == null || E.style.setProperty("--bar-height", `${I}%`);
         }
         c.current = requestAnimationFrame(x);
       };
@@ -85,19 +93,17 @@ const K = H(
         (u = f.current) == null || u.close().catch(() => {
         }), f.current = null, l.current = null, h.current = null, v.current = null;
       };
-    }, [m, t, R]);
-    const N = $(
-      () => Array.from({ length: t }),
-      [t]
-    );
+    }, [p, t, R]);
+    const N = $(() => Array.from({ length: t }), [t]);
     b(() => {
-      d.current.length > t && (d.current.length = t);
+      o.current.length > t && (o.current.length = t);
     }, [t]);
     const P = V ?? M("ui.chat.audio.visualiserLabel"), g = A ? M("ui.chat.audio.device", { name: A }) : null, F = G();
     return /* @__PURE__ */ C(
       "div",
       {
         ref: B,
+        role: "img",
         "aria-label": P,
         "aria-describedby": g ? F : void 0,
         "data-component": "audio-visualiser",
@@ -108,7 +114,7 @@ const K = H(
             "div",
             {
               ref: (n) => {
-                d.current[r] = n;
+                o.current[r] = n;
               },
               "aria-hidden": "true",
               className: [
@@ -136,4 +142,4 @@ O.displayName = "AudioVisualiser";
 export {
   O as A
 };
-//# sourceMappingURL=audio-visualiser-CeMPCZkd.js.map
+//# sourceMappingURL=audio-visualiser-ByDEFLNm.js.map

package/dist/_chunks/audio-visualiser-ByDEFLNm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"audio-visualiser-ByDEFLNm.js","sources":["../../src/components/audio-visualiser/audio-visualiser.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useEffect,\n  useId,\n  useMemo,\n  useRef,\n  useState,\n  type HTMLAttributes,\n} from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { useTranslation } from 'react-i18next';\n\nconst rootVariants = cva(\n  [\n    'ds:relative ds:inline-flex ds:items-end ds:justify-center',\n    // 2px gap is a visual-tuning value (sub-token): the bars need a pixel\n    // comma between them that would look like padding at --spacing-xs (4px).\n    'ds:gap-[2px]',\n    'ds:rounded-[var(--radius-sm)]',\n    'ds:bg-transparent',\n    'ds:forced-colors:border ds:forced-colors:border-[CanvasText]',\n  ].join(' '),\n  {\n    variants: {\n      size: {\n        sm: 'ds:h-6 ds:min-w-[120px] ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)] ds:pt-[var(--spacing-xs)] ds:pb-[var(--spacing-xs)]',\n        md: 'ds:h-10 ds:min-w-[160px] ds:ps-[var(--spacing-sm)] ds:pe-[var(--spacing-sm)] ds:pt-[var(--spacing-xs)] ds:pb-[var(--spacing-xs)]',\n        lg: 'ds:h-14 ds:min-w-[220px] ds:ps-[var(--spacing-md)] ds:pe-[var(--spacing-md)] ds:pt-[var(--spacing-sm)] ds:pb-[var(--spacing-sm)]',\n      },\n    },\n    defaultVariants: { size: 'md' },\n  },\n);\n\nexport interface AudioVisualiserProps\n  extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof rootVariants> {\n  /** Live microphone stream. When null, bars render at their idle height. */\n  stream: MediaStream | null;\n  /** Number of frequency bars. Defaults to 32. */\n  barCount?: number;\n  /** Optional device label. When provided, announced via aria-label. */\n  deviceName?: string;\n  /** Accessible label override. Defaults to ui.chat.audio.visualiserLabel. */\n  label?: string;\n}\n\nexport const AudioVisualiser = forwardRef<HTMLDivElement, AudioVisualiserProps>(\n  (\n    {\n      stream,\n      size = 'md',\n      barCount = 32,\n      deviceName,\n      label,\n      className,\n      ...rest\n    },\n    ref,\n  ) => {\n    const { t } = useTranslation();\n    const barRefs = useRef<Array<HTMLDivElement | null>>([]);\n    const rafRef = useRef<number | null>(null);\n    const audioCtxRef = useRef<AudioContext | null>(null);\n    const analyserRef = useRef<AnalyserNode | null>(null);\n    const sourceRef = useRef<MediaStreamAudioSourceNode | null>(null);\n    const freqArrayRef = useRef<Uint8Array | null>(null);\n    const [reducedMotion, setReducedMotion] = useState(false);\n\n    useEffect(() => {\n      if (typeof window === 'undefined') return;\n      const mq = window.matchMedia('(prefers-reduced-motion: reduce)');\n      setReducedMotion(mq.matches);\n      const handler = () => setReducedMotion(mq.matches);\n      mq.addEventListener?.('change', handler);\n      return () => mq.removeEventListener?.('change', handler);\n    }, []);\n\n    useEffect(() => {\n      if (!stream) {\n        // Paint idle bars.\n        barRefs.current.forEach((el) => {\n          el?.style.setProperty('--bar-height', '10%');\n        });\n        return;\n      }\n\n      const AC =\n        window.AudioContext ||\n        (window as unknown as { webkitAudioContext?: typeof AudioContext })\n          .webkitAudioContext;\n      if (!AC) return;\n\n      const audioCtx = new AC();\n      const analyser = audioCtx.createAnalyser();\n      analyser.fftSize = 256;\n      const source = audioCtx.createMediaStreamSource(stream);\n      source.connect(analyser);\n\n      audioCtxRef.current = audioCtx;\n      analyserRef.current = analyser;\n      sourceRef.current = source;\n      freqArrayRef.current = new Uint8Array(analyser.frequencyBinCount);\n\n      let lastDraw = 0;\n      const draw = (ts: number) => {\n        if (reducedMotion && ts - lastDraw < 250) {\n          rafRef.current = requestAnimationFrame(draw);\n          return;\n        }\n        lastDraw = ts;\n        const data = freqArrayRef.current;\n        const currentAnalyser = analyserRef.current;\n        if (!data || !currentAnalyser) return;\n        // Cast: TS 5.7+ ships Uint8Array<ArrayBufferLike> whereas the DOM\n        // AnalyserNode API signature narrows to Uint8Array<ArrayBuffer>.\n        currentAnalyser.getByteFrequencyData(\n          data as unknown as Parameters<\n            AnalyserNode['getByteFrequencyData']\n          >[0],\n        );\n        const binsPerBar = Math.max(1, Math.floor(data.length / barCount));\n        for (let i = 0; i < barCount; i += 1) {\n          let sum = 0;\n          for (let j = 0; j < binsPerBar; j += 1) {\n            sum += data[i * binsPerBar + j] ?? 0;\n          }\n          const avg = sum / binsPerBar;\n          // Map 0..255 to 8..100% height.\n          const pct = Math.max(8, Math.min(100, (avg / 255) * 100));\n          barRefs.current[i]?.style.setProperty('--bar-height', `${pct}%`);\n        }\n        rafRef.current = requestAnimationFrame(draw);\n      };\n\n      rafRef.current = requestAnimationFrame(draw);\n\n      return () => {\n        if (rafRef.current !== null) cancelAnimationFrame(rafRef.current);\n        rafRef.current = null;\n        try {\n          sourceRef.current?.disconnect();\n        } catch {\n          /* ignore */\n        }\n        try {\n          analyserRef.current?.disconnect();\n        } catch {\n          /* ignore */\n        }\n        audioCtxRef.current?.close().catch(() => {});\n        audioCtxRef.current = null;\n        analyserRef.current = null;\n        sourceRef.current = null;\n        freqArrayRef.current = null;\n      };\n    }, [stream, barCount, reducedMotion]);\n\n    const bars = useMemo(() => Array.from({ length: barCount }), [barCount]);\n\n    // Trim barRefs when barCount shrinks so stale nulls don't accumulate\n    // across long sessions that cycle through different bar counts.\n    useEffect(() => {\n      if (barRefs.current.length > barCount) {\n        barRefs.current.length = barCount;\n      }\n    }, [barCount]);\n\n    const resolvedLabel = label ?? t('ui.chat.audio.visualiserLabel');\n    const deviceText = deviceName\n      ? t('ui.chat.audio.device', { name: deviceName })\n      : null;\n    const deviceId = useId();\n\n    return (\n      <div\n        ref={ref}\n        // role=\"img\" lets axe accept aria-label on the bar group — without\n        // a valid role, axe's aria-prohibited-attr rule rejects aria-label\n        // on a bare <div>. The bars are decorative; the label is the\n        // accessible name for the whole visualisation.\n        role=\"img\"\n        aria-label={resolvedLabel}\n        aria-describedby={deviceText ? deviceId : undefined}\n        data-component=\"audio-visualiser\"\n        className={rootVariants({ size, className })}\n        {...rest}\n      >\n        {bars.map((_, i) => (\n          <div\n            key={i}\n            ref={(el) => {\n              barRefs.current[i] = el;\n            }}\n            aria-hidden=\"true\"\n            className={[\n              'ds:inline-block ds:w-[3px] ds:min-w-[3px]',\n              'ds:bg-[color:var(--primary)]',\n              'ds:forced-colors:bg-[CanvasText]',\n              'ds:rounded-[1px]',\n              'ds:transition-[height] ds:duration-[var(--duration-fast)] ds:motion-reduce:transition-none',\n              // Height is runtime-computed — applied via --bar-height CSS var\n              // set on the element (inline style is limited to --bar-height; the\n              // element never receives a position/size class via style).\n              'ds:[block-size:var(--bar-height,10%)]',\n            ].join(' ')}\n            // eslint-disable-next-line react/forbid-dom-props -- runtime-computed dimension via --bar-height CSS variable\n            style={{ ['--bar-height' as string]: '10%' }}\n          />\n        ))}\n        {deviceText ? (\n          <span id={deviceId} className=\"ds:sr-only\">\n            {deviceText}\n          </span>\n        ) : null}\n      </div>\n    );\n  },\n);\n\nAudioVisualiser.displayName = 'AudioVisualiser';\n"],"names":["rootVariants","cva","AudioVisualiser","forwardRef","stream","size","barCount","deviceName","label","className","rest","ref","t","useTranslation","barRefs","useRef","rafRef","audioCtxRef","analyserRef","sourceRef","freqArrayRef","reducedMotion","setReducedMotion","useState","useEffect","mq","handler","_a","el","AC","audioCtx","analyser","source","lastDraw","draw","ts","data","currentAnalyser","binsPerBar","i","sum","j","avg","pct","_b","_c","bars","useMemo","resolvedLabel","deviceText","deviceId","useId","jsxs","_","jsx"],"mappings":"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"}

package/dist/_chunks/autocomplete-D4oUZbsP.js

@@ -0,0 +1,466 @@
+import { jsx as o, jsxs as D } from "react/jsx-runtime";
+import { forwardRef as Ye, useId as Ze, useState as I, useRef as c, useCallback as T, useEffect as N, useMemo as S } from "react";
+import { _ as m } from "./index-4xgbg-sn.js";
+import * as A from "@radix-ui/react-popover";
+import { c as F } from "./index-D2ZczOXr.js";
+import { useTranslation as et } from "react-i18next";
+import { S as me } from "./spinner-DLaYfLPl.js";
+import { u as tt } from "./form-field-context-B3APVHKx.js";
+import { u as st } from "./use-debounced-callback-BisrB-Fq.js";
+import { g as nt } from "./group-options-BvKhQ3xb.js";
+import { I as ot, a as X, b as J, c as at } from "./input-surface-u4QB0lxe.js";
+import { u as rt } from "./registry-C9nwlNyL.js";
+const it = {
+  id: "autocomplete",
+  capabilities: ["filter", "pick", "open", "close"],
+  state: {
+    value: {
+      type: "string | null",
+      description: "Currently-selected option value, or null when nothing is committed.",
+      read: (s) => s.getValue()
+    },
+    query: {
+      type: "string",
+      description: "Current free-text query in the input.",
+      read: (s) => s.getQuery()
+    },
+    isOpen: {
+      type: "boolean",
+      description: "True when the suggestion list is visible.",
+      read: (s) => s.getIsOpen()
+    }
+  },
+  actions: {
+    set_value: {
+      safety: "read",
+      argsType: "{ value: string | null }",
+      description: "Set the committed value programmatically.",
+      invoke: (s, l) => {
+        s.setValue(l.value);
+      }
+    },
+    apply_filter: {
+      safety: "read",
+      argsType: "{ query: string }",
+      description: "Set the input query, which filters the suggestion list.",
+      invoke: (s, l) => {
+        s.setQuery(l.query);
+      }
+    },
+    clear: {
+      safety: "read",
+      description: "Clear the value and the query.",
+      invoke: (s) => {
+        s.clear();
+      }
+    },
+    open: {
+      safety: "read",
+      description: "Open the suggestion list.",
+      invoke: (s) => {
+        s.open();
+      }
+    },
+    close: {
+      safety: "read",
+      description: "Close the suggestion list.",
+      invoke: (s) => {
+        s.close();
+      }
+    }
+  },
+  domHooks: {
+    root: { attr: "data-component", value: "autocomplete" },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop."
+    },
+    item: {
+      attr: "data-option-id",
+      description: "Each suggestion emits its value as data-option-id."
+    }
+  }
+}, dt = F(
+  ["ds:flex ds:w-full ds:items-center", at].join(" "),
+  {
+    variants: {
+      size: {
+        sm: `${X.sm} ${J.sm}`,
+        md: `${X.md} ${J.md}`,
+        lg: `${X.lg} ${J.lg}`
+      },
+      tone: ot
+    },
+    defaultVariants: { size: "md", tone: "default" }
+  }
+), lt = F(
+  [
+    "ds:flex-1 ds:min-w-0 ds:bg-transparent ds:text-foreground",
+    "ds:placeholder:text-muted-foreground",
+    "ds:outline-none ds:focus:outline-none ds:focus-visible:outline-none",
+    "ds:disabled:cursor-not-allowed",
+    "ds:read-only:cursor-default"
+  ].join(" "),
+  {
+    variants: {
+      hasStart: { true: "ds:ps-2", false: "ds:ps-3" },
+      hasEnd: { true: "ds:pe-2", false: "ds:pe-3" }
+    },
+    defaultVariants: { hasStart: !1, hasEnd: !1 }
+  }
+), ut = F(
+  [
+    "ds:z-[var(--z-dropdown)] ds:overflow-hidden",
+    "ds:rounded-[var(--radius-sm)] ds:border ds:border-border ds:bg-background",
+    "ds:shadow-[var(--shadow-md)]",
+    "ds:w-[var(--radix-popover-trigger-width)]",
+    "ds:animate-in ds:fade-in ds:zoom-in-95",
+    "ds:data-[state=closed]:animate-out ds:data-[state=closed]:fade-out",
+    "ds:data-[state=closed]:zoom-out-95",
+    "ds:motion-reduce:animate-none"
+  ].join(" ")
+), ge = F(
+  [
+    "ds:relative ds:flex ds:items-center ds:gap-[var(--spacing-sm)]",
+    "ds:ps-3 ds:pe-3 ds:py-2 ds:text-[length:var(--font-size-sm)] ds:text-foreground",
+    "ds:rounded-[var(--radius-sm)] ds:select-none ds:cursor-pointer",
+    "ds:data-[disabled=true]:pointer-events-none ds:data-[disabled=true]:opacity-50",
+    "ds:data-[selected=true]:bg-primary ds:data-[selected=true]:text-primary-foreground",
+    "ds:hover:bg-muted ds:data-[selected=true]:hover:bg-primary"
+  ].join(" ")
+), he = [
+  "ds:[&_[cmdk-group-heading]]:ps-3",
+  "ds:[&_[cmdk-group-heading]]:pe-3",
+  "ds:[&_[cmdk-group-heading]]:py-1.5",
+  "ds:[&_[cmdk-group-heading]]:type-eyebrow",
+  "ds:[&_[cmdk-group-heading]]:text-muted-foreground"
+].join(" "), W = "ds:inline-flex ds:items-center ds:shrink-0 ds:text-muted-foreground ds:[&_svg]:size-4";
+function Y(s, l, B) {
+  return `${s}-${l}-${B}`;
+}
+function ve(s, l) {
+  return `${s}:${l}`;
+}
+const ct = Ye(
+  function({
+    loadOptions: l,
+    debounceMs: B = 250,
+    value: Z,
+    defaultValue: be,
+    onChange: R,
+    onSelect: u,
+    recents: v,
+    onRecentSelect: M,
+    snapOnBlur: ye = !1,
+    size: we = "md",
+    tone: ke = "default",
+    startAdornment: P,
+    endAdornment: z,
+    placeholder: ee,
+    disabled: xe,
+    readOnly: b,
+    required: Ce,
+    name: Ve,
+    id: j,
+    className: Ie,
+    "aria-label": te
+  }, k) {
+    const { t: x, i18n: Ne } = et(), C = tt(), Re = Ze(), g = j ?? C.id ?? Re, se = `${g}-listbox`, Ee = `${g}-live`, h = !!(C.disabled || xe), _e = !!(C.required || Ce), ne = C.invalid, $e = ne ? "error" : ke ?? "default", De = C.describedBy || void 0, U = Z !== void 0, [Te, Ae] = I(
+      be ?? ""
+    ), r = U ? Z : Te, [i, d] = I(!1), [y, oe] = I([]), [V, q] = I(!1), [p, Fe] = I(""), E = c(!1), H = c(null), O = c(r), ae = c(/* @__PURE__ */ new Map()), re = c(/* @__PURE__ */ new Map()), Q = c(null), G = c(null), Be = T(
+      (e) => {
+        Q.current = e, typeof k == "function" ? k(e) : k && (k.current = e);
+      },
+      [k]
+    ), ie = Ne.language;
+    N(() => {
+      const e = /* @__PURE__ */ new Map();
+      for (const t of y) e.set(t.value, t);
+      ae.current = e;
+    }, [y]), N(() => {
+      const e = /* @__PURE__ */ new Map();
+      if (v) for (const t of v) e.set(t.value, t);
+      re.current = e;
+    }, [v]);
+    const Me = T(
+      (e) => {
+        var n;
+        if (h || b || E.current) return;
+        (n = H.current) == null || n.abort();
+        const t = new AbortController();
+        H.current = t, O.current = e, q(!0), l(e, { signal: t.signal, locale: ie }).then((a) => {
+          t.signal.aborted || O.current === e && (oe(a), q(!1));
+        }).catch((a) => {
+          t.signal.aborted || a && typeof a == "object" && "name" in a && a.name === "AbortError" || O.current === e && (oe([]), q(!1));
+        });
+      },
+      [h, b, l, ie]
+    ), w = st(Me, B);
+    N(() => () => {
+      var e;
+      w.cancel(), (e = H.current) == null || e.abort();
+    }, [w]);
+    const f = T(
+      (e) => {
+        U || Ae(e), R == null || R(e);
+      },
+      [U, R]
+    ), de = T(
+      (e) => {
+        const [t, n] = e.split(":");
+        if (!n || t !== "recent" && t !== "option") return null;
+        const fe = (t === "recent" ? re.current : ae.current).get(n);
+        return fe ? { kind: t, option: fe } : null;
+      },
+      []
+    ), Pe = (e) => {
+      f(e), !(h || b) && (i || d(!0), !E.current && w(e));
+    }, ze = (e) => {
+      E.current = !0;
+    }, je = (e) => {
+      E.current = !1;
+      const t = e.currentTarget.value;
+      w(t);
+    }, Ue = (e) => {
+      h || b || (d(!0), r && w(r));
+    }, qe = (e) => {
+      const t = e.relatedTarget;
+      if (!(t && G.current && G.current.contains(t))) {
+        if (ye && p) {
+          const n = de(p);
+          n && (f(n.option.label), u == null || u(n.option));
+        }
+        d(!1);
+      }
+    }, He = (e) => {
+      if (!e.nativeEvent.isComposing) {
+        if (e.key === "Escape") {
+          i && (e.preventDefault(), e.stopPropagation(), d(!1));
+          return;
+        }
+        if (e.key === "ArrowDown" && !i) {
+          e.preventDefault(), d(!0), r && w(r);
+          return;
+        }
+        if (e.key === "Tab" && i && p) {
+          const t = de(p);
+          t && (f(t.option.label), u == null || u(t.option), d(!1));
+        }
+      }
+    }, le = (e, t) => {
+      var n;
+      f(t.label), e === "recent" ? M == null || M(t) : u == null || u(t), d(!1), (n = Q.current) == null || n.focus();
+    }, L = (e) => {
+      e.preventDefault();
+    }, _ = !!(v && v.length > 0) && r.length === 0, Oe = S(
+      () => nt(y),
+      [y]
+    ), Qe = !!P, Ge = !!z || V, Le = dt({
+      size: we,
+      tone: $e,
+      className: Ie
+    }), Ke = S(() => {
+      if (!p) return;
+      const [e, t] = p.split(":");
+      if (!(!t || e !== "recent" && e !== "option"))
+        return Y(g, e, t);
+    }, [p, g]), $ = y.length > 0, ue = !_ && !$ && !V && r.length > 0, ce = V && !$, Se = _ || $ || ue || ce, K = c(r);
+    N(() => {
+      K.current = r;
+    }, [r]);
+    const pe = c(i);
+    N(() => {
+      pe.current = i;
+    }, [i]);
+    const Xe = S(
+      () => ({
+        getValue: () => K.current || null,
+        getQuery: () => K.current,
+        getIsOpen: () => pe.current,
+        setValue: (e) => {
+          f(e ?? "");
+        },
+        setQuery: (e) => {
+          f(e);
+        },
+        clear: () => {
+          f("");
+        },
+        open: () => {
+          d(!0);
+        },
+        close: () => {
+          d(!1);
+        }
+      }),
+      [f]
+    );
+    rt(it, Xe, j);
+    const Je = y.length, We = V ? x("ui.common.loading", "Loading…") : i && r.length > 0 ? x("ui.inputs.autocomplete.results", {
+      count: Je,
+      defaultValue: "{{count}} results"
+    }) : "";
+    return /* @__PURE__ */ o(
+      m,
+      {
+        shouldFilter: !1,
+        value: p,
+        onValueChange: Fe,
+        label: te ?? ee,
+        className: "ds:w-full",
+        children: /* @__PURE__ */ D(
+          A.Root,
+          {
+            open: i && !h && !b && Se,
+            children: [
+              /* @__PURE__ */ o(A.Anchor, { asChild: !0, children: /* @__PURE__ */ D(
+                "div",
+                {
+                  className: Le,
+                  "data-component": "autocomplete",
+                  "data-component-id": j,
+                  "data-disabled": h || void 0,
+                  children: [
+                    P ? /* @__PURE__ */ o("span", { "aria-hidden": "true", className: `${W} ds:ps-3`, children: P }) : null,
+                    /* @__PURE__ */ o(
+                      m.Input,
+                      {
+                        ref: Be,
+                        id: g,
+                        name: Ve,
+                        placeholder: ee,
+                        value: r,
+                        onValueChange: Pe,
+                        onFocus: Ue,
+                        onBlur: qe,
+                        onKeyDown: He,
+                        onCompositionStart: ze,
+                        onCompositionEnd: je,
+                        disabled: h,
+                        readOnly: b,
+                        required: _e,
+                        role: "combobox",
+                        "aria-autocomplete": "both",
+                        "aria-expanded": i,
+                        "aria-controls": i ? se : void 0,
+                        "aria-activedescendant": Ke,
+                        "aria-describedby": De,
+                        "aria-invalid": ne || void 0,
+                        "aria-label": te,
+                        autoComplete: "off",
+                        className: lt({ hasStart: Qe, hasEnd: Ge })
+                      }
+                    ),
+                    V ? /* @__PURE__ */ o("span", { className: `${W} ds:pe-3`, "aria-hidden": "true", children: /* @__PURE__ */ o(me, { size: "sm" }) }) : z ? /* @__PURE__ */ o("span", { "aria-hidden": "true", className: `${W} ds:pe-3`, children: z }) : null,
+                    /* @__PURE__ */ o(
+                      "span",
+                      {
+                        id: Ee,
+                        role: "status",
+                        "aria-live": "polite",
+                        "aria-atomic": "true",
+                        className: "ds:sr-only",
+                        children: We
+                      }
+                    )
+                  ]
+                }
+              ) }),
+              /* @__PURE__ */ o(A.Portal, { forceMount: !0, children: /* @__PURE__ */ o(
+                A.Content,
+                {
+                  ref: G,
+                  forceMount: !0,
+                  hidden: !i,
+                  side: "bottom",
+                  align: "start",
+                  sideOffset: 4,
+                  onOpenAutoFocus: (e) => e.preventDefault(),
+                  onCloseAutoFocus: (e) => e.preventDefault(),
+                  onPointerDownOutside: (e) => {
+                    var n;
+                    const t = e.target;
+                    if (t && ((n = Q.current) != null && n.contains(t))) {
+                      e.preventDefault();
+                      return;
+                    }
+                    d(!1);
+                  },
+                  onEscapeKeyDown: () => d(!1),
+                  onMouseDown: L,
+                  className: ut(),
+                  children: /* @__PURE__ */ D(
+                    m.List,
+                    {
+                      id: se,
+                      className: "ds:max-h-[min(24rem,var(--radix-popover-content-available-height))] ds:overflow-auto ds:p-1",
+                      children: [
+                        _ ? /* @__PURE__ */ o(
+                          m.Group,
+                          {
+                            heading: x("ui.inputs.autocomplete.recent", "Recent"),
+                            className: he,
+                            children: (v ?? []).map((e) => /* @__PURE__ */ o(
+                              m.Item,
+                              {
+                                id: Y(g, "recent", e.value),
+                                value: ve("recent", e.value),
+                                disabled: e.disabled,
+                                onSelect: () => le("recent", e),
+                                onMouseDown: L,
+                                className: ge(),
+                                children: e.label
+                              },
+                              `recent-${e.value}`
+                            ))
+                          }
+                        ) : null,
+                        ue ? /* @__PURE__ */ o("div", { className: "ds:ps-3 ds:pe-3 ds:py-2 type-body-sm ds:text-muted-foreground", children: x("ui.inputs.autocomplete.noResults", "No results") }) : null,
+                        ce ? /* @__PURE__ */ D("div", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-sm)] ds:ps-3 ds:pe-3 ds:py-2 type-body-sm ds:text-muted-foreground", children: [
+                          /* @__PURE__ */ o(me, { size: "sm" }),
+                          /* @__PURE__ */ o("span", { children: x("ui.common.loading", "Loading…") })
+                        ] }) : null,
+                        !_ && $ ? Oe.map((e, t) => {
+                          const n = e.items.map((a) => /* @__PURE__ */ o(
+                            m.Item,
+                            {
+                              id: Y(g, "option", a.value),
+                              value: ve("option", a.value),
+                              disabled: a.disabled,
+                              onSelect: () => le("option", a),
+                              onMouseDown: L,
+                              className: ge(),
+                              children: a.label
+                            },
+                            `option-${a.value}`
+                          ));
+                          return e.group ? /* @__PURE__ */ o(
+                            m.Group,
+                            {
+                              heading: e.group,
+                              className: he,
+                              children: n
+                            },
+                            `group-${e.group}`
+                          ) : /* @__PURE__ */ o(m.Group, { children: n }, `group-${t}`);
+                        }) : null
+                      ]
+                    }
+                  )
+                }
+              ) })
+            ]
+          }
+        )
+      }
+    );
+  }
+), pt = ct;
+pt.displayName = "Autocomplete";
+export {
+  pt as A,
+  it as a,
+  dt as b
+};
+//# sourceMappingURL=autocomplete-D4oUZbsP.js.map