@pibit.ai/cure-design-system 0.6.1 → 0.6.3

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

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