@pibit.ai/cure-design-system 0.6.4 → 0.6.6

package/dist/primitives/select/multi-select.js

@@ -1,33 +1,33 @@
-import { jsx as l, jsxs as P, Fragment as ge } from "react/jsx-runtime";
-import { useId as me, useCallback as K, useMemo as C, useRef as G, useState as ue, createContext as we, useContext as H, useLayoutEffect as ye } from "react";
+import { jsx as s, jsxs as M, Fragment as me } from "react/jsx-runtime";
+import { useId as ge, useCallback as L, useMemo as B, useRef as G, useState as ue, createContext as we, useContext as H, useLayoutEffect as ye } from "react";
 import { useFilter as be, useInteractOutside as xe, FocusScope as ve, useFocusManager as De } from "react-aria";
-import { Minus as ke, ChevronDown as Ne, SearchMd as Te } from "@untitledui/icons";
-import { ComboBox as Se, ListBox as Re, ComboBoxStateContext as Y, ButtonContext as B, Group as Fe, Input as Me } from "react-aria-components";
+import { ChevronDown as Ne, SearchMd as ke } from "@untitledui/icons";
+import { ComboBox as Te, ListBox as Se, ComboBoxStateContext as Z, ButtonContext as ee, Group as Re, Input as Fe } from "react-aria-components";
 import { useListData as Ae } from "../../node_modules/react-stately/dist/private/data/useListData.js";
-import { Avatar as Ee } from "../avatar/avatar.js";
-import { HintText as Pe } from "../input/hint-text.js";
-import { Label as Ke } from "../input/label.js";
-import { Popover as Le } from "./popover.js";
-import { sizes as ze } from "./select-shared.js";
-import { TagCloseX as Oe } from "../tags/base-components/tag-close-x.js";
-import { SelectItem as qe } from "./select-item.js";
+import { Avatar as Me } from "../avatar/avatar.js";
+import { HintText as Ee } from "../input/hint-text.js";
+import { Label as Pe } from "../input/label.js";
+import { Popover as Ke } from "./popover.js";
+import { sizes as Le } from "./select-shared.js";
+import { TagCloseX as ze } from "../tags/base-components/tag-close-x.js";
+import { SelectItem as Oe } from "./select-item.js";
 import { cx as k } from "../../utils/cn.js";
-import { getPlatformShortcutLabel as _e } from "../../utils/keyboard-shortcut.js";
-import { useResizeObserver as fe } from "../../hooks/use-resize-observer.js";
-import { SelectCheckbox as We } from "./select-checkbox.js";
-import { multiSelectItemMatchesFilter as oe, shouldClearMultiSelectFilterOnSelection as ae, getMultiSelectSelectAllLabel as je } from "./multi-select-utils.js";
+import { getPlatformShortcutLabel as qe } from "../../utils/keyboard-shortcut.js";
+import { useResizeObserver as de } from "../../hooks/use-resize-observer.js";
+import { SelectCheckbox as _e } from "./select-checkbox.js";
+import { multiSelectItemMatchesFilter as oe, getMultiSelectSelectAllLabel as We, shouldClearMultiSelectFilterOnSelection as je } from "./multi-select-utils.js";
 const Ve = {
   sm: "py-1.5 px-2 min-h-8 h-auto",
   md: "py-1.5 px-3 min-h-9 h-auto",
   lg: "py-2.5 px-3.5 min-h-11 h-auto"
 };
-function He(...s) {
-  return (b) => {
-    for (const f of s)
-      f != null && (typeof f == "function" ? f(b) : f.current = b);
+function Ge(...c) {
+  return (y) => {
+    for (const d of c)
+      d != null && (typeof d == "function" ? d(y) : d.current = y);
   };
 }
-const I = {
+const te = {
   sm: "text-xs",
   md: "text-sm",
   lg: "text-md"
@@ -36,94 +36,94 @@ const I = {
   md: "text-sm",
   lg: "text-sm"
 };
-function $e(s) {
-  return document.getElementById(s);
+function He(c) {
+  return document.getElementById(c);
 }
-function Ge({
-  triggerRef: s,
-  popoverRef: b
+function $e({
+  triggerRef: c,
+  popoverRef: y
 }) {
-  const f = H(Y);
+  const d = H(Z);
   return xe({
-    ref: b,
-    isDisabled: !(f != null && f.isOpen),
-    onInteractOutside: (p) => {
-      var i;
-      (i = s.current) != null && i.contains(p.target) || f == null || f.close();
+    ref: y,
+    isDisabled: !(d != null && d.isOpen),
+    onInteractOutside: (m) => {
+      var l;
+      (l = c.current) != null && l.contains(m.target) || d == null || d.close();
     }
   }), null;
 }
-function de(s) {
-  const b = s.target;
-  b instanceof Element && b.closest("input, textarea, [contenteditable='true']") || s.preventDefault();
+function re(c) {
+  const y = c.target;
+  y instanceof Element && y.closest("input, textarea, [contenteditable='true']") || c.preventDefault();
 }
 const Ue = ({
-  value: s,
-  placeholder: b,
-  listboxId: f,
-  onChange: p
+  value: c,
+  placeholder: y,
+  listboxId: d,
+  onChange: m
 }) => {
-  const i = H(Y), w = (e) => {
-    e.stopPropagation(), i == null || i.open();
-  }, S = (e) => {
-    e.stopPropagation(), de(e);
-  }, d = (e) => {
+  const l = H(Z), b = (e) => {
+    e.stopPropagation(), l == null || l.open();
+  }, T = (e) => {
+    e.stopPropagation(), re(e);
+  }, p = (e) => {
     e.stopPropagation();
-  }, o = (e) => {
+  }, a = (e) => {
     var r;
-    const a = $e(f), y = a ? Array.from(a.querySelectorAll('[role="option"]')) : [];
+    const o = He(d), g = o ? Array.from(o.querySelectorAll('[role="option"]')) : [];
     switch (e.key) {
       case "ArrowDown":
-        e.preventDefault(), y.length > 0 && ((a == null ? void 0 : a.querySelector(
+        e.preventDefault(), g.length > 0 && ((o == null ? void 0 : o.querySelector(
           '[role="option"][data-focused="true"]'
-        )) ?? y[0]).focus();
+        )) ?? g[0]).focus();
         return;
       case "ArrowUp":
-        e.preventDefault(), y.length > 0 && y[y.length - 1].focus();
+        e.preventDefault(), g.length > 0 && g[g.length - 1].focus();
         return;
       case "Enter":
         if (((r = document.activeElement) == null ? void 0 : r.getAttribute("role")) === "option")
           return;
-        y.length > 0 && (e.preventDefault(), ((a == null ? void 0 : a.querySelector(
+        g.length > 0 && (e.preventDefault(), ((o == null ? void 0 : o.querySelector(
           '[role="option"][data-focused="true"]'
-        )) ?? y[0]).click());
+        )) ?? g[0]).click());
         return;
       case "Escape":
-        e.preventDefault(), i == null || i.close();
+        e.preventDefault(), l == null || l.close();
         return;
       default:
         (e.key.length === 1 || e.key === "Backspace" || e.key === "Delete" || e.key === "ArrowLeft" || e.key === "ArrowRight" || e.key === "Home" || e.key === "End" || e.key === "Tab") && e.stopPropagation();
     }
   };
-  return /* @__PURE__ */ l(
+  return /* @__PURE__ */ s(
     "div",
     {
       "data-nested-select-overlay": !0,
       className: "sticky top-0 z-10 border-b border-tertiary bg-primary p-1.5",
-      onMouseDown: S,
-      onPointerDown: d,
+      onMouseDown: T,
+      onPointerDown: p,
       onClick: (e) => e.stopPropagation(),
-      children: /* @__PURE__ */ P(
+      children: /* @__PURE__ */ M(
         "div",
         {
           className: "flex h-8 items-center gap-2 rounded-lg bg-secondary px-2",
-          onMouseDown: S,
+          onMouseDown: T,
           children: [
-            /* @__PURE__ */ l(Te, { "aria-hidden": !0, className: "size-4 shrink-0 text-fg-quaternary" }),
-            /* @__PURE__ */ l(
+            /* @__PURE__ */ s(ke, { "aria-hidden": !0, className: "size-4 shrink-0 text-fg-quaternary" }),
+            /* @__PURE__ */ s(
               "input",
               {
                 type: "text",
                 role: "combobox",
                 "aria-autocomplete": "list",
-                "aria-expanded": (i == null ? void 0 : i.isOpen) ?? !1,
-                "aria-controls": f,
-                value: s,
-                onChange: p,
-                onMouseDown: w,
-                onKeyDown: o,
-                onFocus: () => i == null ? void 0 : i.open(),
-                placeholder: b,
+                "aria-expanded": (l == null ? void 0 : l.isOpen) ?? !1,
+                "aria-controls": d,
+                value: c,
+                onChange: m,
+                onMouseDown: b,
+                onKeyDown: a,
+                onFocus: () => l == null ? void 0 : l.open(),
+                placeholder: y,
                 className: "w-full bg-transparent text-xs text-primary outline-none placeholder:text-placeholder_subtle",
                 autoFocus: !1
               }
@@ -133,7 +133,7 @@ const Ue = ({
       )
     }
   );
-}, pe = we({
+}, fe = we({
   size: "sm",
   selectedKeys: [],
   selectedItems: {},
@@ -145,324 +145,321 @@ const Ue = ({
   chipClassName: void 0,
   searchable: !1
 }), Xe = ({
-  items: s,
-  children: b,
-  size: f = "sm",
-  selectedItems: p,
-  onItemCleared: i,
-  onItemInserted: w,
-  onBulkSelectionChange: S,
-  shortcut: d,
-  placeholder: o = "Search",
+  items: c,
+  children: y,
+  size: d = "sm",
+  selectedItems: m,
+  onItemCleared: l,
+  onItemInserted: b,
+  onBulkSelectionChange: T,
+  shortcut: p,
+  placeholder: a = "Search",
   showAvatar: e = !0,
-  readOnly: a = !1,
-  chipClassName: y,
+  readOnly: o = !1,
+  chipClassName: g,
   searchable: r = !1,
-  searchPlaceholder: M = "Search...",
-  showSelectAll: N = !1,
+  searchPlaceholder: S = "Search...",
+  showSelectAll: R = !1,
   endAdornment: $,
-  description: W,
+  description: j,
   onOpenChange: u,
   // Omit these props to avoid conflicts with the `Select` component
   name: h,
-  className: A,
-  ...g
+  className: F,
+  ...f
 }) => {
-  var se;
-  const z = me(), { contains: j } = be({ sensitivity: "base" }), R = (se = p == null ? void 0 : p.items) != null && se.length ? p.items.map((t) => t.id) : [], x = K(
-    (t) => R.some((c) => String(c) === String(t)),
-    [R]
-  ), U = K(
-    (t, c) => {
-      const v = oe(
-        t,
-        c,
-        j
+  var ae;
+  const _ = ge(), { contains: V } = be({ sensitivity: "base" }), E = (ae = m == null ? void 0 : m.items) != null && ae.length ? m.items.map((n) => n.id) : [], v = L(
+    (n) => E.some((i) => String(i) === String(n)),
+    [E]
+  ), X = L(
+    (n, i) => {
+      const A = oe(
+        n,
+        i,
+        V
       );
-      return (N || !x(t.id)) && v;
+      return (R || !v(n.id)) && A;
     },
-    [j, x, N]
-  ), m = Ae({
-    initialItems: s,
-    filter: U
-  }), L = !!(r && m.filterText.trim()), T = C(() => s != null && s.length ? L ? s.filter(
-    (t) => oe(t, m.filterText, j)
-  ) : s : [], [s, L, m.filterText, j]), O = C(() => {
-    if (T.length === 0) return "unselected";
-    const t = T.filter(
-      (c) => x(c.id)
+    [V, v, R]
+  ), w = Ae({
+    initialItems: c,
+    filter: X
+  }), z = !!(r && w.filterText.trim()), D = B(() => c != null && c.length ? z ? c.filter(
+    (n) => oe(n, w.filterText, V)
+  ) : c : [], [c, z, w.filterText, V]), P = B(() => {
+    if (D.length === 0) return "unselected";
+    const n = D.filter(
+      (i) => v(i.id)
     ).length;
-    return t === 0 ? "unselected" : t === T.length ? "selected" : "indeterminate";
-  }, [T, x]), n = K(() => {
-    const t = O !== "selected", c = T.map((D) => D.id), v = new Set(c.map(String)), E = t ? [.../* @__PURE__ */ new Set([...R, ...c])] : R.filter((D) => !v.has(String(D))), V = T.filter((D) => !x(D.id)), le = T.filter((D) => x(D.id)).map((D) => D.id);
-    if (t && V.length > 0 ? p.append(...V) : !t && le.length > 0 && p.remove(...le), S) {
-      S(E);
+    return n === 0 ? "unselected" : n === D.length ? "selected" : "indeterminate";
+  }, [D, v]), t = G(!1), N = L(() => {
+    t.current = !0, setTimeout(() => {
+      t.current = !1;
+    }, 0);
+  }, []), J = L(() => {
+    N();
+    const n = P !== "selected", i = D.map((x) => x.id), A = new Set(i.map(String)), K = n ? [.../* @__PURE__ */ new Set([...E, ...i])] : E.filter((x) => !A.has(String(x))), W = D.filter((x) => !v(x.id)), U = D.filter((x) => v(x.id)).map((x) => x.id);
+    if (n && W.length > 0 ? m.append(...W) : !n && U.length > 0 && m.remove(...U), T) {
+      T(K);
       return;
     }
-    if (t) {
-      for (const D of T)
-        x(D.id) || w == null || w(D.id);
+    if (n) {
+      for (const x of D)
+        v(x.id) || b == null || b(x.id);
       return;
     }
-    for (const D of T)
-      x(D.id) && (i == null || i(D.id));
+    for (const x of D)
+      v(x.id) && (l == null || l(x.id));
   }, [
-    O,
+    N,
+    P,
+    D,
+    E,
+    m,
+    v,
     T,
-    R,
-    p,
-    x,
-    S,
-    w,
-    i
-  ]), F = K(
-    (t) => {
-      const c = t.values().next().value;
-      c && (p.remove(c), i == null || i(c));
+    b,
+    l
+  ]), Q = L(
+    (n) => {
+      const i = n.values().next().value;
+      i && (m.remove(i), l == null || l(i));
     },
-    [p, i]
-  ), q = G(null), X = (t) => {
-    if (t == null)
+    [m, l]
+  ), O = G(null), Y = (n) => {
+    if (n == null || t.current)
       return;
-    const c = String(t);
-    if (q.current === c)
+    const i = String(n);
+    if (O.current === i)
       return;
-    q.current = c, setTimeout(() => {
-      q.current === c && (q.current = null);
+    O.current = i, setTimeout(() => {
+      O.current === i && (O.current = null);
     }, 0);
-    const v = m.getItem(t) ?? (s == null ? void 0 : s.find((E) => String(E.id) === String(t)));
-    if (v) {
-      if (x(t)) {
-        const E = R.find((V) => String(V) === c) ?? t;
-        p.remove(E), i == null || i(E);
+    const A = w.getItem(n) ?? (c == null ? void 0 : c.find((K) => String(K.id) === String(n)));
+    if (A) {
+      if (v(n)) {
+        const K = E.find((W) => String(W) === i) ?? n;
+        m.remove(K), l == null || l(K);
       } else
-        p.append(v), w == null || w(t);
-      ae(r) && m.setFilterText("");
+        m.append(A), b == null || b(n);
+      je(r) && w.setFilterText("");
     }
-  }, J = K(
-    (t) => {
-      if (!N || t === "all" || q.current !== null)
-        return;
-      const c = Array.from(t);
-      for (const v of R)
-        c.some((E) => String(E) === String(v)) || (p.remove(v), i == null || i(v));
-      for (const v of c)
-        if (!x(v)) {
-          const E = m.getItem(v) ?? (s == null ? void 0 : s.find((V) => String(V.id) === String(v)));
-          E && (p.append(E), w == null || w(v));
-        }
-      ae(r) && m.setFilterText("");
+  }, pe = L(
+    (n) => {
+      n || (O.current = null, t.current = !1, r && w.setFilterText("")), u == null || u(n);
     },
-    [
-      N,
-      R,
-      p,
-      x,
-      m,
-      s,
-      i,
-      w,
-      r
-    ]
-  ), Q = K(
-    (t) => {
-      !t && r && m.setFilterText(""), u == null || u(t);
-    },
-    [m, u, r]
-  ), ee = (t) => {
-    a || m.setFilterText(t);
-  }, _ = G(null), te = G(null), [he, re] = ue(0), Z = K(() => {
-    var c;
-    if (!_.current) return;
-    let t = (c = _.current) == null ? void 0 : c.getBoundingClientRect();
-    re(t.width);
-  }, [_, re]);
-  fe({
-    ref: _,
-    onResize: Z,
+    [w, u, r]
+  ), ne = (n) => {
+    o || w.setFilterText(n);
+  }, q = G(null), C = G(null), [he, ie] = ue(0), I = L(() => {
+    var i;
+    if (!q.current) return;
+    let n = (i = q.current) == null ? void 0 : i.getBoundingClientRect();
+    ie(n.width);
+  }, [q, ie]);
+  de({
+    ref: q,
+    onResize: I,
     box: "border-box"
   });
-  const ne = N && !!(s != null && s.length) && (!L || T.length > 0), ie = je(L);
-  return /* @__PURE__ */ l(
-    pe.Provider,
+  const se = R && !!(c != null && c.length) && (!z || D.length > 0), le = We(z);
+  return /* @__PURE__ */ s(
+    fe.Provider,
     {
       value: {
-        size: f,
-        selectedKeys: R,
-        selectedItems: p,
-        onInputChange: ee,
-        onRemove: F,
+        size: d,
+        selectedKeys: E,
+        selectedItems: m,
+        onInputChange: ne,
+        onRemove: Q,
         showAvatar: e,
-        chipClassName: y,
+        chipClassName: g,
         searchable: r
       },
-      children: /* @__PURE__ */ l(
-        Se,
+      children: /* @__PURE__ */ s(
+        Te,
         {
           allowsEmptyCollection: !0,
           allowsCustomValue: !1,
-          menuTrigger: r || a ? "manual" : "focus",
-          items: m.items,
-          onInputChange: r ? void 0 : ee,
-          inputValue: r ? "" : m.filterText,
+          menuTrigger: r || o ? "manual" : "focus",
+          items: w.items,
+          onInputChange: r ? void 0 : ne,
+          inputValue: r ? "" : w.filterText,
           selectedKey: null,
-          onSelectionChange: X,
-          onOpenChange: Q,
-          ...g,
-          children: (t) => /* @__PURE__ */ P("div", { className: "flex flex-col gap-1.5", children: [
-            /* @__PURE__ */ l(
-              Ge,
+          onSelectionChange: Y,
+          onOpenChange: pe,
+          ...f,
+          children: (n) => /* @__PURE__ */ M("div", { className: "flex flex-col gap-1.5", children: [
+            /* @__PURE__ */ s(
+              $e,
               {
-                triggerRef: _,
-                popoverRef: te
+                triggerRef: q,
+                popoverRef: C
               }
             ),
-            g.label && /* @__PURE__ */ l(
-              Ke,
+            f.label && /* @__PURE__ */ s(
+              Pe,
               {
-                isRequired: t.isRequired,
-                tooltip: g.tooltip,
-                className: ce[f],
-                children: g.label
+                isRequired: n.isRequired,
+                tooltip: f.tooltip,
+                className: ce[d],
+                children: f.label
               }
             ),
-            W && /* @__PURE__ */ l(
+            j && /* @__PURE__ */ s(
               "p",
               {
                 className: k(
                   "text-tertiary",
-                  ce[f],
+                  ce[d],
                   "-mt-0.5 leading-[18px]"
                 ),
-                children: W
+                children: j
               }
             ),
-            /* @__PURE__ */ l(
+            /* @__PURE__ */ s(
               Qe,
               {
-                size: f,
-                shortcut: d,
-                ref: _,
-                placeholder: o,
-                readOnly: a,
-                isInvalid: t.isInvalid,
+                size: d,
+                shortcut: p,
+                ref: q,
+                placeholder: a,
+                readOnly: o,
+                isInvalid: n.isInvalid,
                 endAdornment: $,
-                onFocus: Z,
-                onPointerEnter: Z
+                onFocus: I,
+                onPointerEnter: I
               }
             ),
-            (r || ne || m.items.length > 0) && /* @__PURE__ */ P(
-              Le,
+            (r || se || w.items.length > 0) && /* @__PURE__ */ s(
+              Ke,
               {
                 size: "md",
-                ref: te,
-                triggerRef: _,
-                className: k("flex flex-col", g == null ? void 0 : g.popoverClassName),
+                ref: C,
+                triggerRef: q,
+                className: k("flex flex-col", f == null ? void 0 : f.popoverClassName),
                 style: { width: Math.max(he, 40) },
-                onMouseDown: (c) => {
-                  c.stopPropagation(), de(c);
+                onMouseDown: (i) => {
+                  i.stopPropagation(), re(i);
                 },
-                onPointerDown: (c) => c.stopPropagation(),
-                children: [
-                  r && /* @__PURE__ */ l(
-                    Ue,
-                    {
-                      listboxId: z,
-                      value: m.filterText,
-                      placeholder: M,
-                      onChange: (c) => m.setFilterText(c.target.value)
-                    }
-                  ),
-                  ne && /* @__PURE__ */ P(
-                    "div",
-                    {
-                      className: k(
-                        "flex shrink-0 items-center gap-2 border-b border-secondary px-3 py-2.5",
-                        "cursor-pointer hover:bg-secondary_subtle transition-colors",
-                        g.isDisabled && "cursor-not-allowed opacity-50"
+                onPointerDown: (i) => i.stopPropagation(),
+                children: /* @__PURE__ */ M(
+                  "div",
+                  {
+                    className: "flex min-h-0 w-full flex-1 flex-col",
+                    onMouseDownCapture: (i) => {
+                      var W, U;
+                      if (re(i), !i.defaultPrevented)
+                        return;
+                      const A = (W = q.current) == null ? void 0 : W.querySelector("input"), K = document.activeElement;
+                      A && K !== A && !((U = C.current) != null && U.contains(K)) && A.focus({ preventScroll: !0 });
+                    },
+                    children: [
+                      r && /* @__PURE__ */ s(
+                        Ue,
+                        {
+                          listboxId: _,
+                          value: w.filterText,
+                          placeholder: S,
+                          onChange: (i) => w.setFilterText(i.target.value)
+                        }
+                      ),
+                      se && /* @__PURE__ */ M(
+                        "div",
+                        {
+                          role: "checkbox",
+                          tabIndex: f.isDisabled ? -1 : 0,
+                          "aria-disabled": f.isDisabled || void 0,
+                          "aria-checked": P === "indeterminate" ? "mixed" : P === "selected",
+                          "aria-label": le,
+                          className: k(
+                            "flex shrink-0 items-center gap-2 border-b border-secondary px-3 py-2.5",
+                            "cursor-pointer hover:bg-secondary_subtle transition-colors",
+                            f.isDisabled && "cursor-not-allowed opacity-50"
+                          ),
+                          onPointerDown: f.isDisabled ? void 0 : (i) => {
+                            i.stopPropagation(), N();
+                          },
+                          onClick: f.isDisabled ? void 0 : J,
+                          onKeyDown: f.isDisabled ? void 0 : (i) => {
+                            (i.key === " " || i.key === "Enter") && (i.preventDefault(), J());
+                          },
+                          children: [
+                            /* @__PURE__ */ s(
+                              _e,
+                              {
+                                size: d === "lg" ? "md" : "sm",
+                                checked: P === "indeterminate" ? "indeterminate" : P === "selected",
+                                disabled: f.isDisabled,
+                                tabIndex: -1,
+                                "aria-hidden": !0,
+                                className: "pointer-events-none"
+                              }
+                            ),
+                            /* @__PURE__ */ s(
+                              "span",
+                              {
+                                className: k(
+                                  "font-medium text-primary",
+                                  te[d]
+                                ),
+                                children: le
+                              }
+                            )
+                          ]
+                        }
                       ),
-                      onClick: g.isDisabled ? void 0 : n,
-                      children: [
-                        O === "indeterminate" ? /* @__PURE__ */ l(
-                          "span",
+                      /* @__PURE__ */ M("div", { className: "flex-1 overflow-y-auto", children: [
+                        w.items.length === 0 && r && z && /* @__PURE__ */ s("div", { className: "flex items-center justify-center py-6", children: /* @__PURE__ */ s("p", { className: k("text-tertiary", te[d]), children: "No results" }) }),
+                        /* @__PURE__ */ s(
+                          Se,
                           {
+                            id: _,
+                            selectionMode: "multiple",
+                            selectedKeys: R ? new Set(E) : void 0,
                             className: k(
-                              "flex size-4 shrink-0 items-center justify-center rounded ring-1 ring-inset",
-                              "bg-brand-solid ring-bg-brand-solid text-fg-white"
+                              "size-full outline-hidden",
+                              w.items.length === 0 && "hidden"
                             ),
-                            "aria-hidden": !0,
-                            children: /* @__PURE__ */ l(ke, { className: "size-3 stroke-[2.5]" })
-                          }
-                        ) : /* @__PURE__ */ l(
-                          We,
-                          {
-                            size: f === "lg" ? "md" : "sm",
-                            checked: O === "selected",
-                            onCheckedChange: n,
-                            onClick: (c) => c.stopPropagation(),
-                            disabled: g.isDisabled,
-                            "aria-label": ie
-                          }
-                        ),
-                        /* @__PURE__ */ l(
-                          "span",
-                          {
-                            className: k("font-medium text-primary", I[f]),
-                            children: ie
+                            children: y
                           }
                         )
-                      ]
-                    }
-                  ),
-                  /* @__PURE__ */ P("div", { className: "flex-1 overflow-y-auto", children: [
-                    m.items.length === 0 && r && L && /* @__PURE__ */ l("div", { className: "flex items-center justify-center py-6", children: /* @__PURE__ */ l("p", { className: k("text-tertiary", I[f]), children: "No results" }) }),
-                    /* @__PURE__ */ l(
-                      Re,
-                      {
-                        id: z,
-                        selectionMode: "multiple",
-                        selectedKeys: N ? new Set(R) : void 0,
-                        onSelectionChange: N ? J : void 0,
-                        className: k(
-                          "size-full outline-hidden",
-                          m.items.length === 0 && "hidden"
-                        ),
-                        children: b
-                      }
-                    )
-                  ] })
-                ]
+                      ] })
+                    ]
+                  }
+                )
               }
             ),
-            g.hint && /* @__PURE__ */ l(Pe, { isInvalid: t.isInvalid, children: g.hint })
+            f.hint && /* @__PURE__ */ s(Ee, { isInvalid: n.isInvalid, children: f.hint })
           ] })
         }
       )
     }
   );
 }, Je = ({
-  isDisabled: s,
-  shortcut: b,
-  shortcutClassName: f,
-  placeholder: p,
-  readOnly: i = !1,
-  isFocusWithin: w,
-  inputRef: S
+  isDisabled: c,
+  shortcut: y,
+  shortcutClassName: d,
+  placeholder: m,
+  readOnly: l = !1,
+  isFocusWithin: b,
+  inputRef: T
 }) => {
-  var U, m, L, T, O;
-  const d = De(), o = H(pe), e = H(Y), a = w || !!(e != null && e.isOpen), y = G(null), [r, M] = ue(!1), N = (U = o == null ? void 0 : o.selectedItems) == null ? void 0 : U.items, $ = (N == null ? void 0 : N.map((n) => n.id).join("\0")) ?? "", W = (e == null ? void 0 : e.inputValue) ?? "", u = K(() => {
-    const n = y.current;
-    if (!n || a) {
-      M(!1);
+  var X, w, z, D, P;
+  const p = De(), a = H(fe), e = H(Z), o = b || !!(e != null && e.isOpen), g = G(null), [r, S] = ue(!1), R = (X = a == null ? void 0 : a.selectedItems) == null ? void 0 : X.items, $ = (R == null ? void 0 : R.map((t) => t.id).join("\0")) ?? "", j = (e == null ? void 0 : e.inputValue) ?? "", u = L(() => {
+    const t = g.current;
+    if (!t || o) {
+      S(!1);
       return;
     }
-    const F = n.scrollWidth > n.clientWidth + 0.5;
-    M(
-      F && n.scrollLeft + n.clientWidth < n.scrollWidth - 1
+    const N = t.scrollWidth > t.clientWidth + 0.5;
+    S(
+      N && t.scrollLeft + t.clientWidth < t.scrollWidth - 1
     );
-  }, [a]);
-  fe({
-    ref: y,
+  }, [o]);
+  de({
+    ref: g,
     onResize: u,
     box: "border-box"
   }), ye(() => {
@@ -470,150 +467,150 @@ const Ue = ({
   }, [
     u,
     $,
-    a,
-    W
+    o,
+    j
   ]);
-  const h = (n) => {
-    var F;
-    n.preventDefault(), (F = S.current) == null || F.focus({ preventScroll: !0 });
-  }, A = (n) => {
-    if (!(!(n.currentTarget.selectionStart === 0 && n.currentTarget.selectionEnd === 0) && n.currentTarget.value !== ""))
-      switch (n.key) {
+  const h = (t) => {
+    var N;
+    t.preventDefault(), (N = T.current) == null || N.focus({ preventScroll: !0 });
+  }, F = (t) => {
+    if (!(!(t.currentTarget.selectionStart === 0 && t.currentTarget.selectionEnd === 0) && t.currentTarget.value !== ""))
+      switch (t.key) {
         case "Backspace":
         case "ArrowLeft":
-          d == null || d.focusPrevious({ wrap: !1, tabbable: !1 });
+          p == null || p.focusPrevious({ wrap: !1, tabbable: !1 });
           break;
         case "ArrowRight":
-          d == null || d.focusNext({ wrap: !1, tabbable: !1 });
+          p == null || p.focusNext({ wrap: !1, tabbable: !1 });
           break;
       }
-  }, g = o == null ? void 0 : o.searchable, z = (n) => {
-    n.stopPropagation(), e && !e.isOpen && e.open();
-  }, j = () => {
-    g && e && !e.isOpen && e.open();
-  }, R = (n, F) => {
-    var X, J, Q;
-    if (n.key === "Tab")
+  }, f = a == null ? void 0 : a.searchable, _ = (t) => {
+    t.stopPropagation(), e && !e.isOpen && e.open();
+  }, V = () => {
+    f && e && !e.isOpen && e.open();
+  }, E = (t, N) => {
+    var Q, O, Y;
+    if (t.key === "Tab")
       return;
-    n.preventDefault();
-    const q = ((Q = (J = (X = o == null ? void 0 : o.selectedItems) == null ? void 0 : X.items) == null ? void 0 : J[0]) == null ? void 0 : Q.id) === F;
-    switch (n.key) {
+    t.preventDefault();
+    const J = ((Y = (O = (Q = a == null ? void 0 : a.selectedItems) == null ? void 0 : Q.items) == null ? void 0 : O[0]) == null ? void 0 : Y.id) === N;
+    switch (t.key) {
       case " ":
       case "Enter":
       case "Backspace":
-        q ? d == null || d.focusNext({ wrap: !1, tabbable: !1 }) : d == null || d.focusPrevious({ wrap: !1, tabbable: !1 }), o.onRemove(/* @__PURE__ */ new Set([F]));
+        J ? p == null || p.focusNext({ wrap: !1, tabbable: !1 }) : p == null || p.focusPrevious({ wrap: !1, tabbable: !1 }), a.onRemove(/* @__PURE__ */ new Set([N]));
         break;
       case "ArrowLeft":
-        d == null || d.focusPrevious({ wrap: !1, tabbable: !1 });
+        p == null || p.focusPrevious({ wrap: !1, tabbable: !1 });
         break;
       case "ArrowRight":
-        d == null || d.focusNext({ wrap: !1, tabbable: !1 });
+        p == null || p.focusNext({ wrap: !1, tabbable: !1 });
         break;
       case "Escape":
         e == null || e.close();
         break;
     }
-  }, x = ((L = (m = o == null ? void 0 : o.selectedItems) == null ? void 0 : m.items) == null ? void 0 : L.length) === 0;
-  return /* @__PURE__ */ P("div", { className: "relative min-w-0 w-full flex-1", children: [
-    /* @__PURE__ */ P(
+  }, v = ((z = (w = a == null ? void 0 : a.selectedItems) == null ? void 0 : w.items) == null ? void 0 : z.length) === 0;
+  return /* @__PURE__ */ M("div", { className: "relative min-w-0 w-full flex-1", children: [
+    /* @__PURE__ */ M(
       "div",
       {
-        ref: y,
-        onScroll: a ? void 0 : u,
+        ref: g,
+        onScroll: o ? void 0 : u,
         className: k(
           "flex w-full min-w-0 gap-1.5",
-          a ? k(
+          o ? k(
             "flex-wrap items-start overflow-y-auto scrollbar-hide"
             //   multiSelectExpandedMaxHeight[controlSize],
           ) : "flex-nowrap items-center overflow-x-auto overflow-y-hidden scrollbar-hide"
         ),
         children: [
-          /* @__PURE__ */ l(B.Provider, { value: null, children: !x && ((O = (T = o == null ? void 0 : o.selectedItems) == null ? void 0 : T.items) == null ? void 0 : O.map((n) => /* @__PURE__ */ P(
+          /* @__PURE__ */ s(ee.Provider, { value: null, children: !v && ((P = (D = a == null ? void 0 : a.selectedItems) == null ? void 0 : D.items) == null ? void 0 : P.map((t) => /* @__PURE__ */ M(
             "span",
             {
               "data-multiselect-chip": !0,
               className: k(
                 "flex items-center rounded-md bg-primary py-0.5 pr-1 pl-1.25 ring-1 ring-[var(--color-gray-100)] ring-inset",
-                !a && "shrink-0",
-                o == null ? void 0 : o.chipClassName
+                !o && "shrink-0",
+                a == null ? void 0 : a.chipClassName
               ),
               children: [
-                /* @__PURE__ */ P(
+                /* @__PURE__ */ M(
                   "span",
                   {
                     className: "flex min-w-0 items-center",
                     onMouseDown: h,
                     children: [
-                      (o == null ? void 0 : o.showAvatar) && /* @__PURE__ */ l(
-                        Ee,
+                      (a == null ? void 0 : a.showAvatar) && /* @__PURE__ */ s(
+                        Me,
                         {
                           size: "xxs",
-                          alt: n == null ? void 0 : n.label,
-                          src: n == null ? void 0 : n.avatarUrl,
-                          initials: n == null ? void 0 : n.initials
+                          alt: t == null ? void 0 : t.label,
+                          src: t == null ? void 0 : t.avatarUrl,
+                          initials: t == null ? void 0 : t.initials
                         }
                       ),
-                      /* @__PURE__ */ l("p", { className: "ml-1.25 truncate text-xs font-medium whitespace-nowrap text-secondary select-none", children: n == null ? void 0 : n.label })
+                      /* @__PURE__ */ s("p", { className: "ml-1.25 truncate text-xs font-medium whitespace-nowrap text-secondary select-none", children: t == null ? void 0 : t.label })
                     ]
                   }
                 ),
-                /* @__PURE__ */ l(
-                  Oe,
+                /* @__PURE__ */ s(
+                  ze,
                   {
                     size: "md",
-                    isDisabled: s,
-                    preventFocusOnPress: !a,
+                    isDisabled: c,
+                    preventFocusOnPress: !o,
                     className: "ml-0.75",
-                    onKeyDown: (F) => R(F, n.id),
-                    onPress: () => o.onRemove(/* @__PURE__ */ new Set([n.id]))
+                    onKeyDown: (N) => E(N, t.id),
+                    onPress: () => a.onRemove(/* @__PURE__ */ new Set([t.id]))
                   }
                 )
               ]
             },
-            n.id
+            t.id
           ))) }),
-          /* @__PURE__ */ P(
+          /* @__PURE__ */ M(
             "div",
             {
               className: k(
                 "relative flex flex-1 flex-row items-center",
-                a ? "min-w-[20%]" : "min-w-0",
-                !x && "ml-0.5",
-                b && "min-w-[30%]"
+                o ? "min-w-[20%]" : "min-w-0",
+                !v && "ml-0.5",
+                y && "min-w-[30%]"
               ),
               children: [
-                /* @__PURE__ */ l(
-                  Me,
+                /* @__PURE__ */ s(
+                  Fe,
                   {
-                    ref: S,
-                    placeholder: x ? p : void 0,
-                    onKeyDown: A,
-                    onMouseDown: z,
-                    onFocus: j,
-                    readOnly: i || g,
+                    ref: T,
+                    placeholder: v ? m : void 0,
+                    onKeyDown: F,
+                    onMouseDown: _,
+                    onFocus: V,
+                    readOnly: l || f,
                     className: k(
                       "w-full min-w-0 flex-[1_0_0] appearance-none bg-transparent text-ellipsis text-primary caret-alpha-black/90 outline-none placeholder:text-placeholder_subtle focus:outline-hidden disabled:cursor-not-allowed disabled:text-disabled disabled:placeholder:text-disabled",
-                      i && "cursor-default",
-                      I[(o == null ? void 0 : o.size) || "sm"]
+                      l && "cursor-default",
+                      te[(a == null ? void 0 : a.size) || "sm"]
                     )
                   }
                 ),
-                b && /* @__PURE__ */ l(
+                y && /* @__PURE__ */ s(
                   "div",
                   {
                     "aria-hidden": "true",
                     className: k(
                       "absolute inset-y-0.5 right-0.5 z-10 flex items-center rounded-r-[inherit] bg-linear-to-r from-transparent to-bg-primary to-40% pl-8",
-                      f
+                      d
                     ),
-                    children: /* @__PURE__ */ l(
+                    children: /* @__PURE__ */ s(
                       "span",
                       {
                         className: k(
                           "pointer-events-none rounded px-1 py-px text-xs font-medium text-quaternary ring-1 ring-secondary select-none ring-inset",
-                          s && "bg-transparent text-disabled"
+                          c && "bg-transparent text-disabled"
                         ),
-                        children: _e(["meta"], "K")
+                        children: qe(["meta"], "K")
                       }
                     )
                   }
@@ -624,7 +621,7 @@ const Ue = ({
         ]
       }
     ),
-    !a && r && /* @__PURE__ */ l(
+    !o && r && /* @__PURE__ */ s(
       "div",
       {
         "aria-hidden": !0,
@@ -633,82 +630,82 @@ const Ue = ({
     )
   ] });
 }, Qe = ({
-  size: s,
-  shortcut: b,
-  placeholder: f,
-  shortcutClassName: p,
-  placeholderIcon: i = null,
-  readOnly: w = !1,
-  isDisabled: S,
-  isInvalid: d,
-  ref: o,
+  size: c,
+  shortcut: y,
+  placeholder: d,
+  shortcutClassName: m,
+  placeholderIcon: l = null,
+  readOnly: b = !1,
+  isDisabled: T,
+  isInvalid: p,
+  ref: a,
   endAdornment: e,
-  ...a
+  ...o
 }) => {
-  const y = G(null), r = H(Y), M = H(B), N = M && typeof M == "object" && "ref" in M ? M.ref : void 0, $ = C(
-    () => He(o ?? void 0, N ?? void 0),
-    [o, N]
-  ), W = K(
+  const g = G(null), r = H(Z), S = H(ee), R = S && typeof S == "object" && "ref" in S ? S.ref : void 0, $ = B(
+    () => Ge(a ?? void 0, R ?? void 0),
+    [a, R]
+  ), j = L(
     (u) => {
-      var A, g;
-      if (S)
+      var F, f;
+      if (T)
         return;
       const h = u.target;
       if (h instanceof Element && !h.closest("button")) {
-        if (w) {
+        if (b) {
           if (h.closest("input") || h.closest("[data-multiselect-chip]"))
             return;
-          u.preventDefault(), r != null && r.isOpen ? (r.close(), (A = y.current) == null || A.blur()) : r == null || r.open();
+          u.preventDefault(), r != null && r.isOpen ? (r.close(), (F = g.current) == null || F.blur()) : r == null || r.open();
           return;
         }
-        h.closest("input") || (u.preventDefault(), (g = y.current) == null || g.focus({ preventScroll: !0 }));
+        h.closest("input") || (u.preventDefault(), (f = g.current) == null || f.focus({ preventScroll: !0 }));
       }
     },
-    [S, w, r]
+    [T, b, r]
   );
-  return /* @__PURE__ */ l(
-    Fe,
+  return /* @__PURE__ */ s(
+    Re,
     {
-      ...a,
+      ...o,
       ref: $,
       onMouseDown: (u) => {
         var h;
-        u.stopPropagation(), (h = a.onMouseDown) == null || h.call(a, u);
+        u.stopPropagation(), (h = o.onMouseDown) == null || h.call(o, u);
       },
       onPointerDown: (u) => {
         var h;
-        u.stopPropagation(), (h = a.onPointerDown) == null || h.call(a, u);
+        u.stopPropagation(), (h = o.onPointerDown) == null || h.call(o, u);
       },
       onMouseDownCapture: (u) => {
         var h;
-        (h = a.onMouseDownCapture) == null || h.call(a, u), W(u);
+        (h = o.onMouseDownCapture) == null || h.call(o, u), j(u);
       },
       className: ({ isFocusWithin: u, isDisabled: h }) => {
-        const A = u || !!(r != null && r.isOpen);
+        const F = u || !!(r != null && r.isOpen);
         return k(
           "relative flex w-full gap-2 rounded-md bg-primary ring-1 outline-hidden duration-100 ease-linear ring-inset",
-          d ? "ring-error" : u ? "ring-brand" : "ring-[var(--color-border-secondary)]",
+          p ? "ring-error" : u ? "ring-brand" : "ring-[var(--color-border-secondary)]",
           h && "cursor-not-allowed bg-disabled_subtle",
-          A ? "items-start" : "items-center",
-          A ? Ve[s] : ze[s].root
+          F ? "items-start" : "items-center",
+          F ? Ve[c] : Le[c].root
         );
       },
-      children: ({ isDisabled: u, isFocusWithin: h }) => /* @__PURE__ */ P(ge, { children: [
-        i && /* @__PURE__ */ l(i, { className: "pointer-events-none size-5 shrink-0 text-fg-quaternary" }),
-        /* @__PURE__ */ l(ve, { contain: !1, autoFocus: !1, restoreFocus: !1, children: /* @__PURE__ */ l("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ l(
+      children: ({ isDisabled: u, isFocusWithin: h }) => /* @__PURE__ */ M(me, { children: [
+        l && /* @__PURE__ */ s(l, { className: "pointer-events-none size-5 shrink-0 text-fg-quaternary" }),
+        /* @__PURE__ */ s(ve, { contain: !1, autoFocus: !1, restoreFocus: !1, children: /* @__PURE__ */ s("div", { className: "min-w-0 flex-1", children: /* @__PURE__ */ s(
           Je,
           {
-            inputRef: y,
+            inputRef: g,
             isDisabled: u,
             isFocusWithin: h,
-            shortcut: b,
-            shortcutClassName: p,
-            placeholder: f,
-            readOnly: w
+            shortcut: y,
+            shortcutClassName: m,
+            placeholder: d,
+            readOnly: b
           }
         ) }) }),
-        e ? /* @__PURE__ */ l(B.Provider, { value: null, children: /* @__PURE__ */ l("div", { className: "flex shrink-0 items-center self-center", children: e }) }) : null,
-        /* @__PURE__ */ l(
+        e ? /* @__PURE__ */ s(ee.Provider, { value: null, children: /* @__PURE__ */ s("div", { className: "flex shrink-0 items-center self-center", children: e }) }) : null,
+        /* @__PURE__ */ s(
           "button",
           {
             type: "button",
@@ -716,15 +713,15 @@ const Ue = ({
             disabled: u,
             "aria-label": r != null && r.isOpen ? "Close options" : "Open options",
             className: "shrink-0 self-center rounded p-0.5 text-fg-quaternary hover:text-fg-secondary disabled:cursor-not-allowed disabled:opacity-50",
-            onMouseDown: (A) => {
-              var g, z;
-              A.preventDefault(), A.stopPropagation(), r != null && r.isOpen ? (r.close(), (g = y.current) == null || g.blur()) : (r == null || r.open(), (z = y.current) == null || z.focus({ preventScroll: !0 }));
+            onMouseDown: (F) => {
+              var f, _;
+              F.preventDefault(), F.stopPropagation(), r != null && r.isOpen ? (r.close(), (f = g.current) == null || f.blur()) : (r == null || r.open(), (_ = g.current) == null || _.focus({ preventScroll: !0 }));
             },
-            children: /* @__PURE__ */ l(
+            children: /* @__PURE__ */ s(
               Ne,
               {
                 "aria-hidden": "true",
-                className: s === "lg" ? "size-5" : "size-4"
+                className: c === "lg" ? "size-5" : "size-4"
               }
             )
           }
@@ -733,7 +730,7 @@ const Ue = ({
     }
   );
 }, Ye = Xe;
-Ye.Item = qe;
+Ye.Item = Oe;
 export {
   Ye as MultiSelect,
   Xe as MultiSelectBase,