@spear-ai/spectral 1.8.9 → 1.9.0

package/dist/Combobox.js

@@ -0,0 +1,175 @@
+"use client";
+import "./styles/main.css";
+import { jsxs as c, jsx as o } from "react/jsx-runtime";
+import { _ as I, C as $, a as H, b as J } from "./ComboboxBase-CxNxYtdT.js";
+import "./Icons/AnalyzeIcon.js";
+import "./Icons/AnnotationsIcon.js";
+import "./Icons/ApprovedIcon.js";
+import "./Icons/ArrowDownIcon.js";
+import "./Icons/ArrowUpIcon.js";
+import "./Icons/BoxToolIcon.js";
+import "./Icons/CalendarIcon.js";
+import "./Icons/CheckCircleIcon.js";
+import "./Icons/CheckSquareIcon.js";
+import "./Icons/CheckmarkIcon.js";
+import { ChevronDownIcon as Q } from "./Icons/ChevronDownIcon.js";
+import "./Icons/ChevronUpIcon.js";
+import "./Icons/ClockIcon.js";
+import "./Icons/CloseCircleIcon.js";
+import "./Icons/CloseIcon.js";
+import "./Icons/DashboardIcon.js";
+import "./Icons/DatabaseIcon.js";
+import "./Icons/DeleteIcon.js";
+import "./Icons/DurationIcon.js";
+import "./Icons/EditIcon.js";
+import "./Icons/EmailIcon.js";
+import "./Icons/EraserIcon.js";
+import "./Icons/ErrorIcon.js";
+import "./Icons/EyeClosedIcon.js";
+import "./Icons/EyeClosedIcon2.js";
+import "./Icons/EyeOpenIcon.js";
+import "./Icons/FileDownloadIcon.js";
+import "./Icons/GoToFirstIcon.js";
+import "./Icons/GoToLastIcon.js";
+import "./Icons/HarmonicCursorsIcon.js";
+import "./Icons/InfoIcon.js";
+import "./Icons/KeyboardIcon.js";
+import "./Icons/LabelIcon.js";
+import "./Icons/LassoIcon.js";
+import "./Icons/LineToolIcon.js";
+import "./Icons/LiveViewIcon.js";
+import { LoaderIcon as U } from "./Icons/LoaderIcon.js";
+import "./Icons/LocationIcon.js";
+import "./Icons/LogoutIcon.js";
+import "./Icons/MeasureIcon.js";
+import "./Icons/MessagesIcon.js";
+import "./Icons/MetadataIcon.js";
+import "./Icons/MinusIcon.js";
+import "./Icons/OntologyIcon.js";
+import "./Icons/PanelIconClose.js";
+import "./Icons/PanelIconOpen.js";
+import "./Icons/PlayIcon.js";
+import "./Icons/PlusIcon.js";
+import "./Icons/PolygonIcon.js";
+import "./Icons/ResetIcon.js";
+import "./Icons/ReviewedIcon.js";
+import "./Icons/ScissorsIcon.js";
+import "./Icons/SearchIcon.js";
+import "./Icons/SettingsIcon.js";
+import "./Icons/SortAscendingIcon.js";
+import "./Icons/SortAtoZIcon.js";
+import "./Icons/SortDescendingIcon.js";
+import "./Icons/SortZtoAIcon.js";
+import "./Icons/StackIcon.js";
+import "./Icons/StarIcon.js";
+import "./Icons/TrashIcon.js";
+import "./Icons/UndoIcon.js";
+import "./Icons/User2Icon.js";
+import "./Icons/UserIcon.js";
+import "./Icons/WarningIcon.js";
+import "./Icons/ZoomAllIcon.js";
+import "./Icons/ZoomXIcon.js";
+import "./Icons/ZoomYIcon.js";
+import { Label as W } from "./Label.js";
+import { InputGroup as X, InputGroupAddon as Y } from "./primitives/input-group.js";
+import { useFormFieldId as Z, useFormFieldState as oo, getAriaProps as to, getFormFieldCSSProperties as ro, getStateClasses as eo, ErrorMessage as io, LoadingState as no, EmptyState as mo, getErrorMessageId as ao } from "./utils/formFieldUtils.js";
+import { cn as n } from "./utils/twUtils.js";
+import { useRef as N, useState as y, useCallback as so } from "react";
+const po = ({
+  className: S,
+  disabled: F,
+  emptyMessage: g = "No options found.",
+  errorMessage: x,
+  id: D,
+  label: e,
+  labelClassName: E,
+  loadingMessage: k = "Loading…",
+  name: u,
+  onValueChange: z,
+  options: b = [],
+  placeholder: L = "Search…",
+  ref: A,
+  required: O,
+  state: m = "default",
+  value: a = "",
+  "aria-describedby": P,
+  "aria-label": f
+}) => {
+  process.env.NODE_ENV !== "production" && !e && !f && console.warn("Combobox: provide either `label` or `aria-label` for an accessible name.");
+  const v = N(null), C = N(null), s = Z(D, u), p = `${s}-listbox`, w = ao(s), { isDisabled: r, isLoading: l, isInvalid: R } = oo(F, m), V = to(m, P, O, w), [d, i] = y(!1), [_, h] = y(""), j = b.find((t) => t.value === a), B = (t) => {
+    z?.(t === a ? "" : t), h(""), i(!1);
+  }, G = (t) => {
+    t.key === "Escape" && i(!1);
+  }, K = so(() => {
+    requestAnimationFrame(() => {
+      C.current?.contains(document.activeElement) || (i(!1), h(""));
+    });
+  }, []), M = () => {
+    r || l || (v.current?.focus(), i(!0));
+  }, T = () => l ? /* @__PURE__ */ o("div", { id: p, role: "listbox", children: /* @__PURE__ */ o(no, { message: k }) }) : b.length === 0 ? /* @__PURE__ */ o("div", { id: p, role: "listbox", children: /* @__PURE__ */ o(mo, { message: g }) }) : /* @__PURE__ */ c($, { id: p, children: [
+    /* @__PURE__ */ o(H, { children: g }),
+    b.map((t) => /* @__PURE__ */ o(J, { "data-checked": a === t.value || void 0, disabled: t.disabled, onMouseDown: (q) => q.preventDefault(), onSelect: () => B(t.value), value: t.label, children: t.label }, t.value))
+  ] });
+  return /* @__PURE__ */ c("div", { className: "w-full", ref: A, children: [
+    u && /* @__PURE__ */ o("input", { type: "hidden", name: u, value: a, disabled: r }),
+    e && /* @__PURE__ */ o(W, { className: n("text-text-primary mb-2 block", E, r && "text-text-secondary"), "data-testid": "spectral-combobox-label", htmlFor: s, children: e }),
+    /* @__PURE__ */ c(I, { ref: C, label: f ?? e, onKeyDown: G, className: n("relative w-full", S), children: [
+      /* @__PURE__ */ c(
+        X,
+        {
+          "data-slot": "combobox-content",
+          "data-state": m,
+          "data-testid": "spectral-combobox-trigger",
+          className: n(
+            "border-input-border bg-input-bg h-12 cursor-pointer border-2",
+            "hover:border-input-border--hover transition duration-200",
+            "focus-within:border-input-border--focus focus-within:outline-none",
+            "ring-0!",
+            eo(m),
+            d && "border-input-border--focus",
+            r && "pointer-events-none"
+          ),
+          onClick: M,
+          style: ro(),
+          children: [
+            /* @__PURE__ */ o(
+              I.Input,
+              {
+                ref: v,
+                autoComplete: "off",
+                "data-slot": "input-group-control",
+                "aria-controls": p,
+                "aria-expanded": d,
+                "aria-label": f ?? e,
+                className: "placeholder:text-input-text-placeholder min-w-0 flex-1 border-0 bg-transparent px-3 py-1 text-base outline-hidden focus-visible:ring-0 focus-visible:outline-none",
+                disabled: r,
+                id: s,
+                onBlur: K,
+                onFocus: () => !r && !l && i(!0),
+                onValueChange: h,
+                placeholder: j?.label ?? L,
+                role: "combobox",
+                value: _,
+                ...V
+              }
+            ),
+            /* @__PURE__ */ o(Y, { align: "inline-end", children: l ? /* @__PURE__ */ o(U, { className: "text-muted-foreground size-5 motion-safe:animate-spin" }) : /* @__PURE__ */ o(Q, { className: n("text-muted-foreground size-5 shrink-0 transition-transform duration-200", d && "rotate-180") }) })
+          ]
+        }
+      ),
+      /* @__PURE__ */ o(
+        "div",
+        {
+          className: n("border-input-border bg-input-bg absolute top-full left-0 z-50 mt-1 w-full rounded-lg border p-1 shadow-md", "motion-safe:animate-in motion-safe:fade-in-0 motion-safe:zoom-in-95 motion-safe:slide-in-from-top-2", !d && "hidden"),
+          "data-testid": "spectral-combobox-content",
+          children: T()
+        }
+      )
+    ] }),
+    R && x && /* @__PURE__ */ o(io, { dataTestId: "spectral-combobox-error-message", id: w, message: x })
+  ] });
+};
+po.displayName = "Combobox";
+export {
+  po as Combobox
+};

package/dist/ComboboxBase-CxNxYtdT.js

@@ -0,0 +1,408 @@
+import "./styles/main.css";
+import { jsx as S, jsxs as he } from "react/jsx-runtime";
+import "./Icons/AnalyzeIcon.js";
+import "./Icons/AnnotationsIcon.js";
+import "./Icons/ApprovedIcon.js";
+import "./Icons/ArrowDownIcon.js";
+import "./Icons/ArrowUpIcon.js";
+import "./Icons/BoxToolIcon.js";
+import "./Icons/CalendarIcon.js";
+import "./Icons/CheckCircleIcon.js";
+import "./Icons/CheckSquareIcon.js";
+import { CheckmarkIcon as Ce } from "./Icons/CheckmarkIcon.js";
+import "./Icons/ChevronDownIcon.js";
+import "./Icons/ChevronUpIcon.js";
+import "./Icons/ClockIcon.js";
+import "./Icons/CloseCircleIcon.js";
+import "./Icons/CloseIcon.js";
+import "./Icons/DashboardIcon.js";
+import "./Icons/DatabaseIcon.js";
+import "./Icons/DeleteIcon.js";
+import "./Icons/DurationIcon.js";
+import "./Icons/EditIcon.js";
+import "./Icons/EmailIcon.js";
+import "./Icons/EraserIcon.js";
+import "./Icons/ErrorIcon.js";
+import "./Icons/EyeClosedIcon.js";
+import "./Icons/EyeClosedIcon2.js";
+import "./Icons/EyeOpenIcon.js";
+import "./Icons/FileDownloadIcon.js";
+import "./Icons/GoToFirstIcon.js";
+import "./Icons/GoToLastIcon.js";
+import "./Icons/HarmonicCursorsIcon.js";
+import "./Icons/InfoIcon.js";
+import "./Icons/KeyboardIcon.js";
+import "./Icons/LabelIcon.js";
+import "./Icons/LassoIcon.js";
+import "./Icons/LineToolIcon.js";
+import "./Icons/LiveViewIcon.js";
+import "./Icons/LoaderIcon.js";
+import "./Icons/LocationIcon.js";
+import "./Icons/LogoutIcon.js";
+import "./Icons/MeasureIcon.js";
+import "./Icons/MessagesIcon.js";
+import "./Icons/MetadataIcon.js";
+import "./Icons/MinusIcon.js";
+import "./Icons/OntologyIcon.js";
+import "./Icons/PanelIconClose.js";
+import "./Icons/PanelIconOpen.js";
+import "./Icons/PlayIcon.js";
+import "./Icons/PlusIcon.js";
+import "./Icons/PolygonIcon.js";
+import "./Icons/ResetIcon.js";
+import "./Icons/ReviewedIcon.js";
+import "./Icons/ScissorsIcon.js";
+import { SearchIcon as Se } from "./Icons/SearchIcon.js";
+import "./Icons/SettingsIcon.js";
+import "./Icons/SortAscendingIcon.js";
+import "./Icons/SortAtoZIcon.js";
+import "./Icons/SortDescendingIcon.js";
+import "./Icons/SortZtoAIcon.js";
+import "./Icons/StackIcon.js";
+import "./Icons/StarIcon.js";
+import "./Icons/TrashIcon.js";
+import "./Icons/UndoIcon.js";
+import "./Icons/User2Icon.js";
+import "./Icons/UserIcon.js";
+import "./Icons/WarningIcon.js";
+import "./Icons/ZoomAllIcon.js";
+import "./Icons/ZoomXIcon.js";
+import "./Icons/ZoomYIcon.js";
+import { InputGroup as Re, InputGroupAddon as Ae } from "./primitives/input-group.js";
+import { cn as V } from "./utils/twUtils.js";
+import { R as Me, P as $e, O as De, a as Ne } from "./index-pBCLb6Gr.js";
+import * as l from "react";
+import { P as A, h as q } from "./index-Dc0No4pV.js";
+import { u as P } from "./index-CwSyIPrv.js";
+var pe = 1, Fe = 0.9, Ke = 0.8, Pe = 0.17, ee = 0.1, te = 0.999, je = 0.9999, Le = 0.99, qe = /[\\\/_+.#"@\[\(\{&]/, Ve = /[\\\/_+.#"@\[\(\{&]/g, Oe = /[\s-]/, ge = /[\s-]/g;
+function ne(e, n, r, m, a, c, d) {
+  if (c === n.length) return a === e.length ? pe : Le;
+  var p = `${a},${c}`;
+  if (d[p] !== void 0) return d[p];
+  for (var b = m.charAt(c), i = r.indexOf(b, a), v = 0, h, I, x, C; i >= 0; ) h = ne(e, n, r, m, i + 1, c + 1, d), h > v && (i === a ? h *= pe : qe.test(e.charAt(i - 1)) ? (h *= Ke, x = e.slice(a, i - 1).match(Ve), x && a > 0 && (h *= Math.pow(te, x.length))) : Oe.test(e.charAt(i - 1)) ? (h *= Fe, C = e.slice(a, i - 1).match(ge), C && a > 0 && (h *= Math.pow(te, C.length))) : (h *= Pe, a > 0 && (h *= Math.pow(te, i - a))), e.charAt(i) !== n.charAt(c) && (h *= je)), (h < ee && r.charAt(i - 1) === m.charAt(c + 1) || m.charAt(c + 1) === m.charAt(c) && r.charAt(i - 1) !== m.charAt(c)) && (I = ne(e, n, r, m, i + 1, c + 2, d), I * ee > h && (h = I * ee)), h > v && (v = h), i = r.indexOf(b, i + 1);
+  return d[p] = v, v;
+}
+function fe(e) {
+  return e.toLowerCase().replace(ge, " ");
+}
+function ze(e, n, r) {
+  return e = r && r.length > 0 ? `${e + " " + r.join(" ")}` : e, ne(e, n, fe(e), fe(n), 0, 0, {});
+}
+var L = '[cmdk-group=""]', re = '[cmdk-group-items=""]', Be = '[cmdk-group-heading=""]', be = '[cmdk-item=""]', ve = `${be}:not([aria-disabled="true"])`, le = "cmdk-item-select", F = "data-value", Ge = (e, n, r) => ze(e, n, r), ye = l.createContext(void 0), O = () => l.useContext(ye), we = l.createContext(void 0), oe = () => l.useContext(we), xe = l.createContext(void 0), ke = l.forwardRef((e, n) => {
+  let r = K(() => {
+    var t, u;
+    return { search: "", value: (u = (t = e.value) != null ? t : e.defaultValue) != null ? u : "", selectedItemId: void 0, filtered: { count: 0, items: /* @__PURE__ */ new Map(), groups: /* @__PURE__ */ new Set() } };
+  }), m = K(() => /* @__PURE__ */ new Set()), a = K(() => /* @__PURE__ */ new Map()), c = K(() => /* @__PURE__ */ new Map()), d = K(() => /* @__PURE__ */ new Set()), p = Ee(e), { label: b, children: i, value: v, onValueChange: h, filter: I, shouldFilter: x, loop: C, disablePointerSelection: H = !1, vimBindings: M = !0, ...B } = e, T = P(), ae = P(), W = P(), $ = l.useRef(null), y = et();
+  D(() => {
+    if (v !== void 0) {
+      let t = v.trim();
+      r.current.value = t, k.emit();
+    }
+  }, [v]), D(() => {
+    y(6, ue);
+  }, []);
+  let k = l.useMemo(() => ({ subscribe: (t) => (d.current.add(t), () => d.current.delete(t)), snapshot: () => r.current, setState: (t, u, s) => {
+    var o, f, g, E;
+    if (!Object.is(r.current[t], u)) {
+      if (r.current[t] = u, t === "search") Q(), X(), y(1, Y);
+      else if (t === "value") {
+        if (document.activeElement.hasAttribute("cmdk-input") || document.activeElement.hasAttribute("cmdk-root")) {
+          let w = document.getElementById(W);
+          w ? w.focus() : (o = document.getElementById(T)) == null || o.focus();
+        }
+        if (y(7, () => {
+          var w;
+          r.current.selectedItemId = (w = N()) == null ? void 0 : w.id, k.emit();
+        }), s || y(5, ue), ((f = p.current) == null ? void 0 : f.value) !== void 0) {
+          let w = u ?? "";
+          (E = (g = p.current).onValueChange) == null || E.call(g, w);
+          return;
+        }
+      }
+      k.emit();
+    }
+  }, emit: () => {
+    d.current.forEach((t) => t());
+  } }), []), J = l.useMemo(() => ({ value: (t, u, s) => {
+    var o;
+    u !== ((o = c.current.get(t)) == null ? void 0 : o.value) && (c.current.set(t, { value: u, keywords: s }), r.current.filtered.items.set(t, ie(u, s)), y(2, () => {
+      X(), k.emit();
+    }));
+  }, item: (t, u) => (m.current.add(t), u && (a.current.has(u) ? a.current.get(u).add(t) : a.current.set(u, /* @__PURE__ */ new Set([t]))), y(3, () => {
+    Q(), X(), r.current.value || Y(), k.emit();
+  }), () => {
+    c.current.delete(t), m.current.delete(t), r.current.filtered.items.delete(t);
+    let s = N();
+    y(4, () => {
+      Q(), s?.getAttribute("id") === t && Y(), k.emit();
+    });
+  }), group: (t) => (a.current.has(t) || a.current.set(t, /* @__PURE__ */ new Set()), () => {
+    c.current.delete(t), a.current.delete(t);
+  }), filter: () => p.current.shouldFilter, label: b || e["aria-label"], getDisablePointerSelection: () => p.current.disablePointerSelection, listId: T, inputId: W, labelId: ae, listInnerRef: $ }), []);
+  function ie(t, u) {
+    var s, o;
+    let f = (o = (s = p.current) == null ? void 0 : s.filter) != null ? o : Ge;
+    return t ? f(t, r.current.search, u) : 0;
+  }
+  function X() {
+    if (!r.current.search || p.current.shouldFilter === !1) return;
+    let t = r.current.filtered.items, u = [];
+    r.current.filtered.groups.forEach((o) => {
+      let f = a.current.get(o), g = 0;
+      f.forEach((E) => {
+        let w = t.get(E);
+        g = Math.max(w, g);
+      }), u.push([o, g]);
+    });
+    let s = $.current;
+    j().sort((o, f) => {
+      var g, E;
+      let w = o.getAttribute("id"), G = f.getAttribute("id");
+      return ((g = t.get(G)) != null ? g : 0) - ((E = t.get(w)) != null ? E : 0);
+    }).forEach((o) => {
+      let f = o.closest(re);
+      f ? f.appendChild(o.parentElement === f ? o : o.closest(`${re} > *`)) : s.appendChild(o.parentElement === s ? o : o.closest(`${re} > *`));
+    }), u.sort((o, f) => f[1] - o[1]).forEach((o) => {
+      var f;
+      let g = (f = $.current) == null ? void 0 : f.querySelector(`${L}[${F}="${encodeURIComponent(o[0])}"]`);
+      g?.parentElement.appendChild(g);
+    });
+  }
+  function Y() {
+    let t = j().find((s) => s.getAttribute("aria-disabled") !== "true"), u = t?.getAttribute(F);
+    k.setState("value", u || void 0);
+  }
+  function Q() {
+    var t, u, s, o;
+    if (!r.current.search || p.current.shouldFilter === !1) {
+      r.current.filtered.count = m.current.size;
+      return;
+    }
+    r.current.filtered.groups = /* @__PURE__ */ new Set();
+    let f = 0;
+    for (let g of m.current) {
+      let E = (u = (t = c.current.get(g)) == null ? void 0 : t.value) != null ? u : "", w = (o = (s = c.current.get(g)) == null ? void 0 : s.keywords) != null ? o : [], G = ie(E, w);
+      r.current.filtered.items.set(g, G), G > 0 && f++;
+    }
+    for (let [g, E] of a.current) for (let w of E) if (r.current.filtered.items.get(w) > 0) {
+      r.current.filtered.groups.add(g);
+      break;
+    }
+    r.current.filtered.count = f;
+  }
+  function ue() {
+    var t, u, s;
+    let o = N();
+    o && (((t = o.parentElement) == null ? void 0 : t.firstChild) === o && ((s = (u = o.closest(L)) == null ? void 0 : u.querySelector(Be)) == null || s.scrollIntoView({ block: "nearest" })), o.scrollIntoView({ block: "nearest" }));
+  }
+  function N() {
+    var t;
+    return (t = $.current) == null ? void 0 : t.querySelector(`${be}[aria-selected="true"]`);
+  }
+  function j() {
+    var t;
+    return Array.from(((t = $.current) == null ? void 0 : t.querySelectorAll(ve)) || []);
+  }
+  function Z(t) {
+    let u = j()[t];
+    u && k.setState("value", u.getAttribute(F));
+  }
+  function _(t) {
+    var u;
+    let s = N(), o = j(), f = o.findIndex((E) => E === s), g = o[f + t];
+    (u = p.current) != null && u.loop && (g = f + t < 0 ? o[o.length - 1] : f + t === o.length ? o[0] : o[f + t]), g && k.setState("value", g.getAttribute(F));
+  }
+  function ce(t) {
+    let u = N(), s = u?.closest(L), o;
+    for (; s && !o; ) s = t > 0 ? Ze(s, L) : _e(s, L), o = s?.querySelector(ve);
+    o ? k.setState("value", o.getAttribute(F)) : _(t);
+  }
+  let de = () => Z(j().length - 1), se = (t) => {
+    t.preventDefault(), t.metaKey ? de() : t.altKey ? ce(1) : _(1);
+  }, me = (t) => {
+    t.preventDefault(), t.metaKey ? Z(0) : t.altKey ? ce(-1) : _(-1);
+  };
+  return l.createElement(A.div, { ref: n, tabIndex: -1, ...B, "cmdk-root": "", onKeyDown: (t) => {
+    var u;
+    (u = B.onKeyDown) == null || u.call(B, t);
+    let s = t.nativeEvent.isComposing || t.keyCode === 229;
+    if (!(t.defaultPrevented || s)) switch (t.key) {
+      case "n":
+      case "j": {
+        M && t.ctrlKey && se(t);
+        break;
+      }
+      case "ArrowDown": {
+        se(t);
+        break;
+      }
+      case "p":
+      case "k": {
+        M && t.ctrlKey && me(t);
+        break;
+      }
+      case "ArrowUp": {
+        me(t);
+        break;
+      }
+      case "Home": {
+        t.preventDefault(), Z(0);
+        break;
+      }
+      case "End": {
+        t.preventDefault(), de();
+        break;
+      }
+      case "Enter": {
+        t.preventDefault();
+        let o = N();
+        if (o) {
+          let f = new Event(le);
+          o.dispatchEvent(f);
+        }
+      }
+    }
+  } }, l.createElement("label", { "cmdk-label": "", htmlFor: J.inputId, id: J.labelId, style: rt }, b), U(e, (t) => l.createElement(we.Provider, { value: k }, l.createElement(ye.Provider, { value: J }, t))));
+}), Ue = l.forwardRef((e, n) => {
+  var r, m;
+  let a = P(), c = l.useRef(null), d = l.useContext(xe), p = O(), b = Ee(e), i = (m = (r = b.current) == null ? void 0 : r.forceMount) != null ? m : d?.forceMount;
+  D(() => {
+    if (!i) return p.item(a, d?.id);
+  }, [i]);
+  let v = Ie(a, c, [e.value, e.children, c], e.keywords), h = oe(), I = R((y) => y.value && y.value === v.current), x = R((y) => i || p.filter() === !1 ? !0 : y.search ? y.filtered.items.get(a) > 0 : !0);
+  l.useEffect(() => {
+    let y = c.current;
+    if (!(!y || e.disabled)) return y.addEventListener(le, C), () => y.removeEventListener(le, C);
+  }, [x, e.onSelect, e.disabled]);
+  function C() {
+    var y, k;
+    H(), (k = (y = b.current).onSelect) == null || k.call(y, v.current);
+  }
+  function H() {
+    h.setState("value", v.current, !0);
+  }
+  if (!x) return null;
+  let { disabled: M, value: B, onSelect: T, forceMount: ae, keywords: W, ...$ } = e;
+  return l.createElement(A.div, { ref: q(c, n), ...$, id: a, "cmdk-item": "", role: "option", "aria-disabled": !!M, "aria-selected": !!I, "data-disabled": !!M, "data-selected": !!I, onPointerMove: M || p.getDisablePointerSelection() ? void 0 : H, onClick: M ? void 0 : C }, e.children);
+}), He = l.forwardRef((e, n) => {
+  let { heading: r, children: m, forceMount: a, ...c } = e, d = P(), p = l.useRef(null), b = l.useRef(null), i = P(), v = O(), h = R((x) => a || v.filter() === !1 ? !0 : x.search ? x.filtered.groups.has(d) : !0);
+  D(() => v.group(d), []), Ie(d, p, [e.value, e.heading, b]);
+  let I = l.useMemo(() => ({ id: d, forceMount: a }), [a]);
+  return l.createElement(A.div, { ref: q(p, n), ...c, "cmdk-group": "", role: "presentation", hidden: h ? void 0 : !0 }, r && l.createElement("div", { ref: b, "cmdk-group-heading": "", "aria-hidden": !0, id: i }, r), U(e, (x) => l.createElement("div", { "cmdk-group-items": "", role: "group", "aria-labelledby": r ? i : void 0 }, l.createElement(xe.Provider, { value: I }, x))));
+}), Te = l.forwardRef((e, n) => {
+  let { alwaysRender: r, ...m } = e, a = l.useRef(null), c = R((d) => !d.search);
+  return !r && !c ? null : l.createElement(A.div, { ref: q(a, n), ...m, "cmdk-separator": "", role: "separator" });
+}), We = l.forwardRef((e, n) => {
+  let { onValueChange: r, ...m } = e, a = e.value != null, c = oe(), d = R((i) => i.search), p = R((i) => i.selectedItemId), b = O();
+  return l.useEffect(() => {
+    e.value != null && c.setState("search", e.value);
+  }, [e.value]), l.createElement(A.input, { ref: n, ...m, "cmdk-input": "", autoComplete: "off", autoCorrect: "off", spellCheck: !1, "aria-autocomplete": "list", role: "combobox", "aria-expanded": !0, "aria-controls": b.listId, "aria-labelledby": b.labelId, "aria-activedescendant": p, id: b.inputId, type: "text", value: a ? e.value : d, onChange: (i) => {
+    a || c.setState("search", i.target.value), r?.(i.target.value);
+  } });
+}), Je = l.forwardRef((e, n) => {
+  let { children: r, label: m = "Suggestions", ...a } = e, c = l.useRef(null), d = l.useRef(null), p = R((i) => i.selectedItemId), b = O();
+  return l.useEffect(() => {
+    if (d.current && c.current) {
+      let i = d.current, v = c.current, h, I = new ResizeObserver(() => {
+        h = requestAnimationFrame(() => {
+          let x = i.offsetHeight;
+          v.style.setProperty("--cmdk-list-height", x.toFixed(1) + "px");
+        });
+      });
+      return I.observe(i), () => {
+        cancelAnimationFrame(h), I.unobserve(i);
+      };
+    }
+  }, []), l.createElement(A.div, { ref: q(c, n), ...a, "cmdk-list": "", role: "listbox", tabIndex: -1, "aria-activedescendant": p, "aria-label": m, id: b.listId }, U(e, (i) => l.createElement("div", { ref: q(d, b.listInnerRef), "cmdk-list-sizer": "" }, i)));
+}), Xe = l.forwardRef((e, n) => {
+  let { open: r, onOpenChange: m, overlayClassName: a, contentClassName: c, container: d, ...p } = e;
+  return l.createElement(Me, { open: r, onOpenChange: m }, l.createElement($e, { container: d }, l.createElement(De, { "cmdk-overlay": "", className: a }), l.createElement(Ne, { "aria-label": e.label, "cmdk-dialog": "", className: c }, l.createElement(ke, { ref: n, ...p }))));
+}), Ye = l.forwardRef((e, n) => R((r) => r.filtered.count === 0) ? l.createElement(A.div, { ref: n, ...e, "cmdk-empty": "", role: "presentation" }) : null), Qe = l.forwardRef((e, n) => {
+  let { progress: r, children: m, label: a = "Loading...", ...c } = e;
+  return l.createElement(A.div, { ref: n, ...c, "cmdk-loading": "", role: "progressbar", "aria-valuenow": r, "aria-valuemin": 0, "aria-valuemax": 100, "aria-label": a }, U(e, (d) => l.createElement("div", { "aria-hidden": !0 }, d)));
+}), z = Object.assign(ke, { List: Je, Item: Ue, Input: We, Group: He, Separator: Te, Dialog: Xe, Empty: Ye, Loading: Qe });
+function Ze(e, n) {
+  let r = e.nextElementSibling;
+  for (; r; ) {
+    if (r.matches(n)) return r;
+    r = r.nextElementSibling;
+  }
+}
+function _e(e, n) {
+  let r = e.previousElementSibling;
+  for (; r; ) {
+    if (r.matches(n)) return r;
+    r = r.previousElementSibling;
+  }
+}
+function Ee(e) {
+  let n = l.useRef(e);
+  return D(() => {
+    n.current = e;
+  }), n;
+}
+var D = typeof window > "u" ? l.useEffect : l.useLayoutEffect;
+function K(e) {
+  let n = l.useRef();
+  return n.current === void 0 && (n.current = e()), n;
+}
+function R(e) {
+  let n = oe(), r = () => e(n.snapshot());
+  return l.useSyncExternalStore(n.subscribe, r, r);
+}
+function Ie(e, n, r, m = []) {
+  let a = l.useRef(), c = O();
+  return D(() => {
+    var d;
+    let p = (() => {
+      var i;
+      for (let v of r) {
+        if (typeof v == "string") return v.trim();
+        if (typeof v == "object" && "current" in v) return v.current ? (i = v.current.textContent) == null ? void 0 : i.trim() : a.current;
+      }
+    })(), b = m.map((i) => i.trim());
+    c.value(e, p, b), (d = n.current) == null || d.setAttribute(F, p), a.current = p;
+  }), a;
+}
+var et = () => {
+  let [e, n] = l.useState(), r = K(() => /* @__PURE__ */ new Map());
+  return D(() => {
+    r.current.forEach((m) => m()), r.current = /* @__PURE__ */ new Map();
+  }, [e]), (m, a) => {
+    r.current.set(m, a), n({});
+  };
+};
+function tt(e) {
+  let n = e.type;
+  return typeof n == "function" ? n(e.props) : "render" in n ? n.render(e.props) : e;
+}
+function U({ asChild: e, children: n }, r) {
+  return e && l.isValidElement(n) ? l.cloneElement(tt(n), { ref: n.ref }, r(n.props.children)) : r(n);
+}
+var rt = { position: "absolute", width: "1px", height: "1px", padding: "0", margin: "-1px", overflow: "hidden", clip: "rect(0, 0, 0, 0)", whiteSpace: "nowrap", borderWidth: "0" };
+const Er = ({ className: e, ...n }) => /* @__PURE__ */ S(z, { "data-slot": "command", className: V("bg-popover text-popover-foreground flex size-full flex-col overflow-hidden rounded-xl! p-1", e), ...n }), Ir = ({ className: e, ...n }) => /* @__PURE__ */ S("div", { "data-slot": "command-input-wrapper", className: "p-1 pb-0", children: /* @__PURE__ */ he(Re, { className: "border-input/30 bg-input/30 h-8! rounded-lg! shadow-none! *:data-[slot=input-group-addon]:pl-2!", children: [
+  /* @__PURE__ */ S(z.Input, { "data-slot": "command-input", className: V("w-full text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50", e), ...n }),
+  /* @__PURE__ */ S(Ae, { children: /* @__PURE__ */ S(Se, { className: "size-4 shrink-0 opacity-50" }) })
+] }) }), Cr = ({ className: e, ...n }) => /* @__PURE__ */ S(z.List, { "data-slot": "command-list", className: V("no-scrollbar max-h-72 scroll-py-1 overflow-x-hidden overflow-y-auto outline-none", e), ...n }), Sr = ({ className: e, ...n }) => /* @__PURE__ */ S(z.Empty, { "data-slot": "command-empty", className: V("py-6 text-center text-sm", e), ...n }), Rr = ({ className: e, children: n, ...r }) => /* @__PURE__ */ he(
+  z.Item,
+  {
+    "data-slot": "command-item",
+    className: V(
+      "group/command-item data-selected:bg-muted data-selected:text-foreground data-selected:*:[svg]:text-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none in-data-[slot=dialog-content]:rounded-lg! data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
+      e
+    ),
+    ...r,
+    children: [
+      n,
+      /* @__PURE__ */ S(Ce, { className: "ml-auto opacity-0 group-has-data-[slot=command-shortcut]/command-item:hidden group-data-[checked=true]/command-item:opacity-100" })
+    ]
+  }
+);
+export {
+  Cr as C,
+  z as _,
+  Sr as a,
+  Rr as b,
+  Er as c,
+  Ir as d
+};

package/dist/ControlGroup/ControlGroupSelect.d.ts

@@ -0,0 +1,33 @@
+import { ControlGroupProps } from './ControlGroup';
+import { Select } from '../primitives/select';
+import { FormFieldState } from '../utils/formFieldUtils';
+import { ComponentProps } from 'react';
+export interface SelectOptionType {
+    label: string;
+    value: string;
+}
+/** `inline`: `inputPlaceholder` / `selectPlaceholder` show inside the fields. `above`: same strings render as labels above each control (no inner placeholders). */
+export type ControlGroupSelectCaptionLayout = 'above' | 'inline';
+export interface ControlGroupSelectProps extends ComponentProps<typeof Select>, Pick<ControlGroupProps, 'orientation'> {
+    /** Accessible name for the group wrapper (use when there is no visible group heading). */
+    ariaLabel?: string;
+    amountStep?: number;
+    captionLayout?: ControlGroupSelectCaptionLayout;
+    className?: string;
+    dataTestId?: string;
+    disabled?: boolean;
+    errorMessage?: string | string[] | Record<string, unknown> | null;
+    maxAmount?: number;
+    minAmount?: number;
+    inputPlaceholder?: string;
+    /** When `captionLayout` is `inline`, overrides the input's accessible name (defaults to `inputPlaceholder` when set). */
+    inputAriaLabel?: string;
+    selectPlaceholder?: string;
+    /** When `captionLayout` is `inline` and `selectPlaceholder` is empty, sets the select trigger's accessible name. */
+    selectAriaLabel?: string;
+    selectOptions: SelectOptionType[];
+    state?: FormFieldState;
+    type?: 'number' | 'text';
+}
+export declare const ControlGroupSelect: ({ amountStep, ariaLabel, captionLayout, className, dataTestId, disabled, errorMessage, inputAriaLabel, inputPlaceholder, maxAmount, minAmount, orientation, selectAriaLabel, selectOptions, selectPlaceholder, state, type, ...selectProps }: ControlGroupSelectProps) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ControlGroupSelect.d.ts.map