@choc-ui/chakra-autocomplete 5.8.0 → 6.0.0

package/dist/index.es.js

@@ -1,731 +1,876 @@
-import { jsx as p, jsxs as K, Fragment as it } from "react/jsx-runtime";
-import * as fe from "react";
-import ee, { useMemo as ue, useRef as te, useState as Le, useEffect as D, useImperativeHandle as ut, memo as at } from "react";
-import { useDisclosure as ct, useControllableState as ft, useUpdateEffect as pt, forwardRef as B, Popover as dt, chakra as gt, useMergeRefs as Pe, Flex as pe, Box as Xe, Divider as Qe, InputGroup as mt, Input as vt, InputRightElement as ht, Spinner as Ze, useMultiStyleConfig as yt, Wrap as bt, WrapItem as qe, PopoverAnchor as Ct, PopoverContent as St, Center as xt, Tag as At, TagLabel as It, TagCloseButton as wt } from "@chakra-ui/react";
-const [Ot, W] = Et();
-function Et() {
-  const e = fe.createContext(void 0);
+import { jsx as a, jsxs as Z, Fragment as ft } from "react/jsx-runtime";
+import * as L from "react";
+import I, { useMemo as oe, useRef as se, useState as Fe, useEffect as j, forwardRef as K, useImperativeHandle as pt, memo as dt } from "react";
+import { useDisclosure as mt, useControllableState as gt, IconButton as ht, Portal as vt, Popover as N, chakra as yt, Flex as he, Box as Te, Separator as Xe, Group as bt, InputElement as Je, Spinner as nt, PopoverAnchor as Ct, Input as wt, Center as St, Tag as J } from "@chakra-ui/react";
+const [xt, $] = Ot();
+function Ot() {
+  const e = L.createContext(void 0);
   e.displayName = "AutoCompleteContext";
   function t() {
     var o;
-    const n = fe.useContext(e), r = "useAutoCompleteContext: `context` is undefined. Seems you forgot to wrap all autoomplete components within `<AutoComplete />`";
+    const n = L.useContext(e), r = "useAutoCompleteContext: `context` is undefined. Seems you forgot to wrap all autoomplete components within `<AutoComplete />`";
     if (!n) {
-      const l = new Error(r);
-      throw l.name = "ContextError", (o = Error.captureStackTrace) == null || o.call(Error, l, t), l;
+      const s = new Error(r);
+      throw s.name = "ContextError", (o = Error.captureStackTrace) == null || o.call(Error, s, t), s;
     }
     return n;
   }
   return [e.Provider, t, e];
 }
-function Ft(e) {
+function At(e) {
   return e == null ? void 0 : e[0];
 }
-function Ne(e) {
+function De(e) {
   return e != null && e.length ? e[e.length - 1] : void 0;
 }
-function et(e, t, n = 1, r = !0) {
+function rt(e, t, n = 1, r = !0) {
   if (t === 0) return -1;
   let o = e + n;
   return e === -1 && (o = n > 0 ? 0 : t - 1), r ? o = (o % t + t) % t : o = Math.max(0, Math.min(o, t - 1)), o;
 }
-function Lt(e, t, n = !0) {
-  return et(e, t, -1, n);
+function Et(e, t, n = !0) {
+  return rt(e, t, -1, n);
 }
-function Nt(e, t, n = !0) {
-  const r = et(e, t.length, 1, n);
+function Pt(e, t, n = !0) {
+  const r = rt(e, t.length, 1, n);
   return t[r];
 }
-function Pt(e, t, n = !0) {
-  const r = Lt(e, t.length, n);
+function It(e, t, n = !0) {
+  const r = Et(e, t.length, n);
   return t[r];
 }
-function De(e) {
+function _e(e) {
   return Array.isArray(e);
 }
-function Dt(e) {
-  return De(e) && e.length === 0;
+function Nt(e) {
+  return _e(e) && e.length === 0;
 }
-function Re(e) {
-  return e !== null && typeof e == "object" && !De(e);
+function Ge(e) {
+  return e !== null && typeof e == "object" && !_e(e);
 }
 function Rt(e) {
-  return Re(e) && Object.keys(e).length === 0;
+  return Ge(e) && Object.keys(e).length === 0;
 }
-function Te(e) {
-  return De(e) ? Dt(e) : Re(e) ? Rt(e) : e == null || e === "";
+function Me(e) {
+  return _e(e) ? Nt(e) : Ge(e) ? Rt(e) : e == null || e === "";
 }
-function ce(e) {
+function de(e) {
   return typeof e > "u";
 }
-function tt(e) {
+function ot(e) {
   return typeof e < "u";
 }
-function Tt(e, t) {
+function jt(e, t) {
   const n = {};
   return t.forEach((r) => {
     r in e && (n[r] = e[r]);
   }), n;
 }
-function Me(e, t) {
+function ve(e, t) {
   const n = { ...e };
   return t.forEach((r) => {
     delete n[r];
   }), n;
 }
-function Mt(e) {
+function Lt(e) {
   return typeof e == "function";
 }
-function m(e, ...t) {
-  return Mt(e) ? e(...t) : e;
-}
-var de = function(e, t) {
-  for (var n, r = fe.Children.toArray(e), o = 0, l = r; o < l.length; o++) {
-    var i = l[o];
-    if (t(i))
-      return i;
-    if (!((n = i.props) === null || n === void 0) && n.children) {
-      var u = de(i.props.children, t);
-      if (u)
-        return u;
+function h(e, ...t) {
+  return Lt(e) ? e(...t) : e;
+}
+function Ft(e, t) {
+  if (e != null) {
+    if (typeof e == "function") {
+      e(t);
+      return;
+    }
+    try {
+      e.current = t;
+    } catch {
+      throw new Error(`Cannot assign value '${t}' to ref '${e}'`);
     }
   }
-}, ae = function(e, t) {
+}
+function Dt(...e) {
+  return (t) => {
+    e.forEach((n) => {
+      Ft(n, t);
+    });
+  };
+}
+function We(...e) {
+  return oe(() => Dt(...e), e);
+}
+var ye = function(e, t) {
+  for (var n, r = L.Children.toArray(e), o = 0, s = r; o < s.length; o++) {
+    var u = s[o];
+    if (t(u))
+      return u;
+    if (!((n = u.props) === null || n === void 0) && n.children) {
+      var l = ye(u.props.children, t);
+      if (l)
+        return l;
+    }
+  }
+}, pe = function(e, t) {
   for (var n = 0, r = t.length, o = e.length; n < r; n++, o++)
     e[o] = t[n];
   return e;
-}, nt = function(e, t) {
-  for (var n, r = fe.Children.toArray(e), o = [], l = 0, i = r; l < i.length; l++) {
-    var u = i[l];
-    t(u) && (o = ae(ae([], o), [u])), !((n = u.props) === null || n === void 0) && n.children && (o = ae(ae([], o), nt(u.props.children, t)));
+}, st = function(e, t) {
+  for (var n, r = L.Children.toArray(e), o = [], s = 0, u = r; s < u.length; s++) {
+    var l = u[s];
+    t(l) && (o = pe(pe([], o), [l])), !((n = l.props) === null || n === void 0) && n.children && (o = pe(pe([], o), st(l.props.children, t)));
   }
   return o;
 };
-function $e(e, t, n = 2) {
-  function r(c, O) {
-    c = " ".repeat(O - 1) + c.toLowerCase() + " ".repeat(O - 1);
-    let C = new Array(c.length - O + 1);
-    for (let I = 0; I < C.length; I++)
-      C[I] = c.slice(I, I + O);
-    return C;
+function Ze(e, t, n = 2) {
+  function r(d, C) {
+    d = " ".repeat(C - 1) + d.toLowerCase() + " ".repeat(C - 1);
+    let A = new Array(d.length - C + 1);
+    for (let x = 0; x < A.length; x++)
+      A[x] = d.slice(x, x + C);
+    return A;
   }
   if (!(e != null && e.length) || !(t != null && t.length))
     return 0;
-  let o = e.length < t.length ? e : t, l = e.length < t.length ? t : e, i = r(o, n), u = r(l, n), v = new Set(i), h = u.length, b = 0;
-  for (let c of u)
-    v.delete(c) && b++;
-  return b / h;
+  let o = e.length < t.length ? e : t, s = e.length < t.length ? t : e, u = r(o, n), l = r(s, n), f = new Set(u), v = l.length, y = 0;
+  for (let d of l)
+    f.delete(d) && y++;
+  return y / v;
 }
-const _e = (e) => {
+const ke = (e) => {
   var t;
   return (t = typeof e == "string" || typeof e == "number" ? e : e[Object.keys(e)[0]]) == null ? void 0 : t.toString();
-}, _t = (e, t) => typeof e != "string" || Te(t) ? e : e.toString().replace(
-  new RegExp(kt(t), "gi"),
+}, Tt = (e, t) => typeof e != "string" || Me(t) ? e : e.toString().replace(
+  new RegExp(Wt(t), "gi"),
   (r) => `<mark>${r}</mark>`
-), Gt = (e) => nt(
+), _t = (e) => st(
   e,
   (n) => {
     var r;
     return ((r = n == null ? void 0 : n.type) == null ? void 0 : r.displayName) === "AutoCompleteItem";
   }
 ).map((n) => {
-  const r = Tt(n.props, ["value", "label", "fixed", "disabled"]), { getValue: o = _e } = n.props, l = o(r.value);
-  return { ...tt(r.label) ? r : { ...r, label: l }, value: l, originalValue: r.value };
-}), Wt = () => ({
+  const r = jt(n.props, ["value", "label", "fixed", "disabled"]), { getValue: o = ke } = n.props, s = o(r.value);
+  return { ...ot(r.label) ? r : { ...r, label: s }, value: s, originalValue: r.value };
+}), Gt = () => ({
   bg: "whiteAlpha.100",
   _light: {
     bg: "gray.200"
   }
-}), jt = (e, t, n) => (t == null ? void 0 : t.toLowerCase().indexOf(e == null ? void 0 : e.toLowerCase())) >= 0 || (n == null ? void 0 : n.toLowerCase().indexOf(e == null ? void 0 : e.toLowerCase())) >= 0 || $e(e, t) >= 0.5 || $e(e, n) >= 0.5;
-function kt(e) {
+}), Mt = (e, t, n) => (t == null ? void 0 : t.toLowerCase().indexOf(e == null ? void 0 : e.toLowerCase())) >= 0 || (n == null ? void 0 : n.toLowerCase().indexOf(e == null ? void 0 : e.toLowerCase())) >= 0 || Ze(e, t) >= 0.5 || Ze(e, n) >= 0.5;
+function Wt(e) {
   return e.replace(/[-\/\\^$*+?.()|[\]{}]/g, "\\$&");
 }
-const zt = (e, t) => de(
+const kt = (e, t) => ye(
   e,
   (r) => {
     var o;
     return ((o = r == null ? void 0 : r.type) == null ? void 0 : o.displayName) === "AutoCompleteItem" && r.props.value === (t == null ? void 0 : t.value);
   }
-), Bt = (e, t) => de(
+), zt = (e, t) => ye(
   e,
   (r) => {
     var o;
     return ((o = r == null ? void 0 : r.type) == null ? void 0 : o.displayName) === "AutoCompleteItem" && r.props.value === (t == null ? void 0 : t.value);
   }
-), Ht = (e, t) => tt(
-  de(e, (n) => {
-    var o, l;
-    const r = m(
-      ((o = n.props) == null ? void 0 : o.getValue) || _e,
-      ((l = n.props) == null ? void 0 : l.value) || {}
+), Bt = (e, t) => ot(
+  ye(e, (n) => {
+    var o, s;
+    const r = h(
+      ((o = n.props) == null ? void 0 : o.getValue) || ke,
+      ((s = n.props) == null ? void 0 : s.value) || {}
     );
-    return t.some((i) => i.value === r);
+    return t.some((u) => u.value === r);
   })
-), Ut = (e, t) => {
-  const n = {}, r = {}, { field: o } = e;
-  return o && Object.keys(o).forEach((l) => {
-    if (l.startsWith("--input") === !1)
-      n[l] = o[l];
-    else {
-      let i = o[l];
-      const v = l.replace("--input-", "").replace(/-([a-z])/g, function(h) {
-        return h[1].toUpperCase();
-      });
-      i.indexOf(".") !== -1 && (i = i.substring(i.indexOf(".") + 1)), r[v] = i;
-    }
-  }), {
-    ...t && {
-      ...n,
-      ...r,
-      _focusWithin: e.field._focus,
-      pos: "relative",
-      minH: 9,
-      // px: 3,
-      py: 1.5,
-      spacing: 3
-    },
-    cursor: "text",
-    h: "fit-content"
-    // w: "full",
-  };
-};
-function Vt(e) {
-  var He;
+);
+function $t(e) {
+  var Qe;
   let {
     prefocusFirstItem: t = !0,
     closeOnBlur: n = !0,
     creatable: r,
     emphasize: o,
-    emptyState: l = !0,
-    defaultEmptyStateProps: i = {},
-    freeSolo: u,
-    isReadOnly: v,
-    listAllValuesOnFocus: h,
-    maxSuggestions: b,
-    multiple: c,
-    closeOnSelect: O = !c,
-    defaultValue: C,
-    defaultValues: I = C ? [C] : [],
-    onReady: H,
-    defaultIsOpen: j,
-    disableFilter: ne,
-    isLoading: ge = !1,
-    placement: oe = "bottom",
-    restoreOnBlurIfEmpty: Y = !u,
-    shouldRenderSuggestions: me = () => !0,
-    submitKeys: ve = [],
-    suggestWhenEmpty: re,
-    value: k,
-    values: J = k ? typeof k == "string" ? [k] : [...k] : void 0
+    emptyState: s = !0,
+    defaultEmptyStateProps: u = {},
+    freeSolo: l,
+    isReadOnly: f,
+    listAllValuesOnFocus: v,
+    maxSuggestions: y,
+    multiple: d,
+    closeOnSelect: C = !d,
+    defaultValue: A,
+    defaultValues: x = A ? [A] : [],
+    onReady: T,
+    defaultIsOpen: be,
+    disableFilter: ie,
+    isLoading: Ce = !1,
+    placement: q = "bottom",
+    restoreOnBlurIfEmpty: le = !l,
+    shouldRenderSuggestions: we = () => !0,
+    submitKeys: ue = [],
+    suggestWhenEmpty: Se,
+    value: H,
+    values: xe = H ? typeof H == "string" ? [H] : [...H] : void 0
   } = e;
-  u = u || (c ? !0 : e.freeSolo);
-  const { isOpen: w, onClose: _, onOpen: U } = ct({ defaultIsOpen: j }), he = ue(
-    () => m(e.children, {
-      isOpen: w,
-      onClose: _,
-      onOpen: U
+  l = l || (d ? !0 : e.freeSolo);
+  const { open: O, onClose: z, onOpen: Q } = mt({ open: be }), Oe = oe(
+    () => h(e.children, {
+      isOpen: O,
+      onClose: z,
+      onOpen: Q
     }),
-    [e.children, w]
-  ), E = ue(() => Gt(he), [he]), N = te(null), Ge = te(null), X = te(null), V = te(null), [We, se] = Le(!1);
-  let le = "";
-  c ? le = "" : ce(I) ? ce(J) || (le = J[0]) : le = I[0];
-  const [R, Z] = Le(le ?? ""), ye = ue(
-    () => ne ? E : E.filter(
-      (s) => s.fixed || m(
-        e.filter || jt,
-        R,
-        s.value,
-        s.label
-      ) || We
+    [e.children, O]
+  ), E = oe(() => _t(Oe), [Oe]), F = se(null), ze = se(null), ee = se(null), U = se(null), [Be, ae] = Fe(!1);
+  let ce = "";
+  d ? ce = "" : de(x) ? de(xe) || (ce = xe[0]) : ce = x[0];
+  const [_, te] = Fe(ce ?? ""), Ae = oe(
+    () => ie ? E : E.filter(
+      (i) => i.fixed || h(
+        e.filter || Mt,
+        _,
+        i.value,
+        i.label
+      ) || Be
     ).filter(
-      (s, a) => b ? s.fixed || a < b : !0
+      (i, c) => y ? i.fixed || c < y : !0
     ),
-    [R, E, We, b, ne]
-  ), je = r ? [{ value: R, noFilter: !0, creatable: !0 }] : [], y = ue(() => [...ye, ...je], [ye, je]), [T, be] = ft({
-    defaultValue: I.map((s) => s == null ? void 0 : s.toString()),
-    value: J,
-    onChange: (s) => {
-      const a = y.find((F) => F.value === s[0]);
-      if (!a) return;
-      const d = s.map(
-        (F) => y.find((L) => L.value === F)
+    [_, E, Be, y, ie]
+  ), $e = r ? [{ value: _, noFilter: !0, creatable: !0 }] : [], b = oe(() => [...Ae, ...$e], [Ae, $e]), [G, Ee] = gt({
+    defaultValue: x.map((i) => i == null ? void 0 : i.toString()),
+    value: xe,
+    onChange: (i) => {
+      const c = b.find((P) => P.value === i[0]);
+      if (!c) return;
+      const m = i.map(
+        (P) => b.find((R) => R.value === P)
       );
-      m(
+      h(
         e.onChange,
-        c ? s : s[0],
-        c ? d : a
+        d ? i : i[0],
+        d ? m : c
       );
     }
   });
-  D(() => {
-    y.length === 0 && !l && w && _();
-  }, [y.length, l, w]);
-  const [Q, G] = Le(
-    t ? (He = E[0]) == null ? void 0 : He.value : null
-  ), st = e.maxSelections || T.length + 1, Ce = y.findIndex((s) => s.value === Q), Se = Nt(
-    Ce,
-    y,
+  j(() => {
+    b.length === 0 && !s && O && z();
+  }, [b.length, s, O]);
+  const [Y, M] = Fe(
+    t ? (Qe = E[0]) == null ? void 0 : Qe.value : null
+  ), at = e.maxSelections || G.length + 1, Pe = b.findIndex((i) => i.value === Y), Ie = Pt(
+    Pe,
+    b,
     !!e.rollNavigation
-  ), xe = Pt(
-    Ce,
-    y,
+  ), Ne = It(
+    Pe,
+    b,
     !!e.rollNavigation
-  ), P = Ft(y), Ae = Ne(y), ke = !y.some(
-    (s) => s.value === Q
+  ), D = At(b), Re = De(b), He = !b.some(
+    (i) => i.value === Y
   );
-  D(() => {
-    var s;
-    ke && G(t ? (s = E[0]) == null ? void 0 : s.value : null);
-  }, [ke]), pt(() => {
-    t && G(P == null ? void 0 : P.value);
-  }, [R, P == null ? void 0 : P.value]), D(() => {
-    var s;
-    !w && t && G((s = E[0]) == null ? void 0 : s.value);
-  }, [w]), D(() => {
-    w && h && se(!0);
-  }, [w, h, se]), D(() => {
-    const s = E.find((a) => a.value === Q);
-    m(e.onOptionFocus, {
-      item: s,
-      focusMethod: V.current,
-      isNewInput: s == null ? void 0 : s.creatable
+  j(() => {
+    var i;
+    He && M(t ? (i = E[0]) == null ? void 0 : i.value : null);
+  }, [He]), j(() => {
+    t && M(D == null ? void 0 : D.value);
+  }, [t, M, _, D == null ? void 0 : D.value]), j(() => {
+    var i;
+    !O && t && M((i = E[0]) == null ? void 0 : i.value);
+  }, [O]), j(() => {
+    O && v && ae(!0);
+  }, [O, v, ae]), j(() => {
+    const i = E.find((c) => c.value === Y);
+    h(e.onOptionFocus, {
+      item: i,
+      focusMethod: U.current,
+      isNewInput: i == null ? void 0 : i.creatable
     });
-  }, [Q, e.onOptionFocus]);
-  const Ie = (s) => {
-    var F, L;
-    const a = y.find((x) => x.value === s), d = (a == null ? void 0 : a.label) || (a == null ? void 0 : a.value);
-    Z(() => c ? "" : d ?? ""), !T.includes(s) && T.length < st && be((x) => c ? [...x, s] : [s]), c && ((F = N.current) == null || F.focus()), e.focusInputOnSelect && ((L = N.current) == null || L.focus()), m(e.onSelectOption, {
-      item: a,
-      selectMethod: V.current,
-      isNewInput: a == null ? void 0 : a.creatable
-    }), a != null && a.creatable && m(e.onCreateOption, {
-      item: Me(a, ["noFilter"]),
-      selectMethod: V.current
-    }), O && _();
-  }, ze = (s, a) => {
-    var L;
-    be((x) => {
-      const $ = E.find((M) => M.value === s);
-      return $ ? (m(e.onTagRemoved, s, $, x), x.filter((M) => M !== s)) : x;
+  }, [Y, e.onOptionFocus]);
+  const je = (i) => {
+    var P, R;
+    const c = b.find((S) => S.value === i), m = (c == null ? void 0 : c.label) || (c == null ? void 0 : c.value);
+    te(() => d ? "" : m ?? ""), !G.includes(i) && G.length < at && Ee((S) => d ? [...S, i] : [i]), d && ((P = F.current) == null || P.focus()), e.focusInputOnSelect && ((R = F.current) == null || R.focus()), h(e.onSelectOption, {
+      item: c,
+      selectMethod: U.current,
+      isNewInput: c == null ? void 0 : c.creatable
+    }), c != null && c.creatable && h(e.onCreateOption, {
+      item: ve(c, ["noFilter"]),
+      selectMethod: U.current
+    }), C && z();
+  }, Ve = (i, c) => {
+    var R;
+    Ee((S) => {
+      const X = E.find((W) => W.value === i);
+      return X ? (h(e.onTagRemoved, i, X, S), S.filter((W) => W !== i)) : S;
     });
-    const d = E.find((x) => x.value === s), F = (d == null ? void 0 : d.label) || (d == null ? void 0 : d.value);
-    R === F && Z(""), a && ((L = N.current) == null || L.focus());
-  }, lt = (s) => {
-    var a;
-    be([]), s && ((a = N.current) == null || a.focus());
-  }, Be = c ? T.map((s) => {
-    var a;
+    const m = E.find((S) => S.value === i), P = (m == null ? void 0 : m.label) || (m == null ? void 0 : m.value);
+    _ === P && te(""), c && ((R = F.current) == null || R.focus());
+  }, ct = (i) => {
+    var c;
+    Ee([]), i && ((c = F.current) == null || c.focus());
+  }, Ke = d ? G.map((i) => {
+    var c;
     return {
-      label: ((a = E.find((d) => d.value === (s == null ? void 0 : s.toString()))) == null ? void 0 : a.label) || s,
-      onRemove: () => ze(s)
+      label: ((c = E.find((m) => m.value === (i == null ? void 0 : i.toString()))) == null ? void 0 : c.label) || i,
+      onRemove: () => Ve(i)
     };
   }) : [];
-  return D(() => {
-    m(H, { tags: Be });
-  }, [T]), {
+  return j(() => {
+    h(T, { tags: Ke });
+  }, [G]), {
     autoCompleteProps: e,
-    children: he,
-    filteredList: y,
-    filteredResults: ye,
-    focusedValue: Q,
-    defaultEmptyStateProps: i,
-    getEmptyStateProps: (s) => {
-      if (y.every((d) => d.noFilter) && l && !r)
-        return typeof l == "boolean" ? s : m(l, { query: R });
+    children: Oe,
+    filteredList: b,
+    filteredResults: Ae,
+    focusedValue: Y,
+    defaultEmptyStateProps: u,
+    getEmptyStateProps: (i) => {
+      if (b.every((m) => m.noFilter) && s && !r)
+        return typeof s == "boolean" ? i : h(s, { query: _ });
     },
-    getGroupProps: (s) => {
-      const a = Ht(s.children, y);
+    getGroupProps: (i) => {
+      const c = Bt(i.children, b);
       return {
         divider: {
-          hasFirstChild: zt(s.children, P),
-          hasLastChild: Bt(
-            s.children,
-            Ne(y.filter((d) => ce(d == null ? void 0 : d.noFilter)))
+          hasFirstChild: kt(i.children, D),
+          hasLastChild: zt(
+            i.children,
+            De(b.filter((m) => de(m == null ? void 0 : m.noFilter)))
           )
         },
         group: {
-          display: a ? "initial" : "none"
+          display: c ? "initial" : "none"
         }
       };
     },
-    getInputProps: (s, a) => {
-      const { onBlur: d, onChange: F, onFocus: L, onKeyDown: x, variant: $, ...M } = s;
+    getInputProps: (i, c) => {
+      const { onBlur: m, onChange: P, onFocus: R, onKeyDown: S, variant: X, ...W } = i;
       return {
         wrapper: {
-          ref: Ge,
+          ref: ze,
           onClick: () => {
-            var f;
-            (f = N == null ? void 0 : N.current) == null || f.focus();
+            var p;
+            (p = F == null ? void 0 : F.current) == null || p.focus();
           },
-          ...Ut(a, c),
-          ...M
+          //...getMultipleWrapStyles(themeInput, multiple),
+          ...W
         },
         input: {
-          isReadOnly: v,
-          onFocus: (f) => {
-            m(L, f), e.openOnFocus && !v && U(), e.selectOnFocus && f.target.select(), h && se(!0);
+          isReadOnly: f,
+          onFocus: (p) => {
+            h(R, p), e.openOnFocus && !f && Q(), e.selectOnFocus && p.target.select(), v && ae(!0);
           },
-          onBlur: (f) => {
-            var z, ie;
-            m(d, f);
-            const S = f.relatedTarget === (X == null ? void 0 : X.current) || ((z = X.current) == null ? void 0 : z.contains(f.relatedTarget)), g = (ie = Ge.current) == null ? void 0 : ie.contains(
-              f.relatedTarget
+          onBlur: (p) => {
+            var V, fe;
+            h(m, p);
+            const w = p.relatedTarget === (ee == null ? void 0 : ee.current) || ((V = ee.current) == null ? void 0 : V.contains(p.relatedTarget)), g = (fe = ze.current) == null ? void 0 : fe.contains(
+              p.relatedTarget
             );
-            if (!S && !g && (n && _(), !T.includes(f.target.value) && Y)) {
-              const we = Ne(T), A = E.find(
-                (Ee) => Ee.value === we
-              ), Oe = (A == null ? void 0 : A.label) || (A == null ? void 0 : A.value) || "";
-              Z(Oe);
+            if (!w && !g && (n && z(), !G.includes(p.target.value) && le)) {
+              const k = De(G), B = E.find(
+                (ne) => ne.value === k
+              ), Le = (B == null ? void 0 : B.label) || (B == null ? void 0 : B.value) || "";
+              te(Le);
             }
           },
-          onChange: (f) => {
-            const S = f.target.value;
-            m(F, f), Z(S);
-            const g = Te(S);
-            m(me, S) && (!g || re) ? U() : _(), se(!1);
+          onChange: (p) => {
+            const w = p.target.value;
+            h(P, p), te(w);
+            const g = Me(w);
+            h(we, w) && (!g || Se) ? Q() : z(), ae(!1);
           },
-          onKeyDown: (f) => {
-            var z;
-            m(x, f), V.current = "keyboard";
-            const { key: S } = f, g = y[Ce];
-            if (["Enter", ...ve].includes(S)) {
-              g && !(g != null && g.disabled) && w ? Ie(g == null ? void 0 : g.value) : (z = N.current) == null || z.focus(), f.preventDefault();
+          onKeyDown: (p) => {
+            var V;
+            h(S, p), U.current = "keyboard";
+            const { key: w } = p, g = b[Pe];
+            if (["Enter", ...ue].includes(w)) {
+              g && !(g != null && g.disabled) && O ? je(g == null ? void 0 : g.value) : (V = F.current) == null || V.focus(), p.preventDefault();
               return;
             }
-            if (S === "ArrowDown") {
-              w ? G(Se == null ? void 0 : Se.value) : U(), f.preventDefault();
+            if (w === "ArrowDown") {
+              O ? M(Ie == null ? void 0 : Ie.value) : Q(), p.preventDefault();
               return;
             }
-            if (S === "ArrowUp") {
-              w ? G(xe == null ? void 0 : xe.value) : U(), f.preventDefault();
+            if (w === "ArrowUp") {
+              O ? M(Ne == null ? void 0 : Ne.value) : Q(), p.preventDefault();
               return;
             }
-            if (S === "Tab") {
-              w && g && !(g != null && g.disabled) ? Ie(g == null ? void 0 : g.value) : _();
+            if (w === "Tab") {
+              O && g && !(g != null && g.disabled) ? je(g == null ? void 0 : g.value) : z();
               return;
             }
-            if (S === "Home") {
-              G(P == null ? void 0 : P.value), f.preventDefault();
+            if (w === "Home") {
+              M(D == null ? void 0 : D.value), p.preventDefault();
               return;
             }
-            if (S === "End") {
-              G(Ae == null ? void 0 : Ae.value), f.preventDefault();
+            if (w === "End") {
+              M(Re == null ? void 0 : Re.value), p.preventDefault();
               return;
             }
-            S === "Escape" && (_(), f.preventDefault());
+            w === "Escape" && (z(), p.preventDefault());
           },
-          value: R,
-          variant: c ? "unstyled" : $,
-          ...M
+          value: _,
+          //variant: multiple ? "unstyled" : variant,
+          variant: X,
+          ...W
         }
       };
     },
-    getItemProps: (s, a) => {
+    getItemProps: (i, c) => {
       var Ue;
       const {
-        _fixed: d,
-        _focus: F,
-        children: L,
-        disabled: x,
-        label: $,
-        value: M,
-        fixed: f,
-        getValue: S = _e,
+        _fixed: m,
+        _focus: P,
+        children: R,
+        disabled: S,
+        label: X,
+        value: W,
+        fixed: p,
+        getValue: w = ke,
         onClick: g,
-        onMouseOver: z,
-        sx: ie,
-        ...we
-      } = s, A = a ? M : (Ue = S(M)) == null ? void 0 : Ue.toString(), Oe = A === Q, Ee = y.findIndex((q) => q.value === A) >= 0, Fe = L || $ || A;
+        onMouseOver: V,
+        //sx,
+        ...fe
+      } = i, k = c ? W : (Ue = w(W)) == null ? void 0 : Ue.toString(), B = k === Y, Le = b.findIndex((re) => re.value === k) >= 0, ne = R || X || k;
       return {
         item: {
-          ...typeof Fe != "string" || !o ? { children: Fe } : {
+          ...typeof ne != "string" || !o ? { children: ne } : {
             dangerouslySetInnerHTML: {
-              __html: _t(Fe, R)
+              __html: Tt(ne, _)
             }
           },
-          "aria-selected": T.includes(A),
-          "aria-disabled": x,
+          "aria-selected": G.includes(k),
+          "aria-disabled": S,
           _disabled: { opacity: 0.4, cursor: "not-allowed", userSelect: "none" },
-          onClick: (q) => {
-            var Ve;
-            m(g, q), x ? (Ve = N.current) == null || Ve.focus() : Ie(A);
+          onMouseDown: (re) => {
+            var Ye;
+            h(g, re), S ? (Ye = F.current) == null || Ye.focus() : je(k);
           },
-          onMouseOver: (q) => {
-            m(z, q), G(A), V.current = "mouse";
+          onMouseOver: (re) => {
+            h(V, re), M(k), U.current = "mouse";
           },
           sx: {
-            ...ie,
+            //...sx,
             mark: {
               color: "inherit",
               bg: "transparent",
-              ...Re(o) ? o : {
+              ...Ge(o) ? o : {
                 fontWeight: o ? "extrabold" : "inherit"
               }
             }
           },
-          ...Oe && (F || Wt()),
-          ...f && d,
-          ...we
+          ...B && (P || Gt()),
+          ...p && m,
+          ...fe
         },
         root: {
-          isValidSuggestion: Ee,
-          value: A
+          isValidSuggestion: Le,
+          value: k
         }
       };
     },
-    inputRef: N,
-    interactionRef: V,
-    isLoading: ge,
-    isOpen: w,
+    inputRef: F,
+    interactionRef: U,
+    isLoading: Ce,
+    isOpen: O,
     itemList: E,
-    listRef: X,
-    onClose: _,
-    onOpen: U,
-    placement: oe,
-    query: R,
-    removeItem: ze,
-    resetItems: lt,
-    setQuery: Z,
-    tags: Be,
-    value: k,
-    values: T
+    listRef: ee,
+    onClose: z,
+    onOpen: Q,
+    placement: q,
+    query: _,
+    removeItem: Ve,
+    resetItems: ct,
+    setQuery: te,
+    tags: Ke,
+    value: H,
+    values: G
+  };
+}
+var it = {
+  color: void 0,
+  size: void 0,
+  className: void 0,
+  style: void 0,
+  attr: void 0
+}, qe = I.createContext && /* @__PURE__ */ I.createContext(it), Ht = ["attr", "size", "title"];
+function Vt(e, t) {
+  if (e == null) return {};
+  var n = Kt(e, t), r, o;
+  if (Object.getOwnPropertySymbols) {
+    var s = Object.getOwnPropertySymbols(e);
+    for (o = 0; o < s.length; o++)
+      r = s[o], !(t.indexOf(r) >= 0) && Object.prototype.propertyIsEnumerable.call(e, r) && (n[r] = e[r]);
+  }
+  return n;
+}
+function Kt(e, t) {
+  if (e == null) return {};
+  var n = {};
+  for (var r in e)
+    if (Object.prototype.hasOwnProperty.call(e, r)) {
+      if (t.indexOf(r) >= 0) continue;
+      n[r] = e[r];
+    }
+  return n;
+}
+function me() {
+  return me = Object.assign ? Object.assign.bind() : function(e) {
+    for (var t = 1; t < arguments.length; t++) {
+      var n = arguments[t];
+      for (var r in n)
+        Object.prototype.hasOwnProperty.call(n, r) && (e[r] = n[r]);
+    }
+    return e;
+  }, me.apply(this, arguments);
+}
+function et(e, t) {
+  var n = Object.keys(e);
+  if (Object.getOwnPropertySymbols) {
+    var r = Object.getOwnPropertySymbols(e);
+    t && (r = r.filter(function(o) {
+      return Object.getOwnPropertyDescriptor(e, o).enumerable;
+    })), n.push.apply(n, r);
+  }
+  return n;
+}
+function ge(e) {
+  for (var t = 1; t < arguments.length; t++) {
+    var n = arguments[t] != null ? arguments[t] : {};
+    t % 2 ? et(Object(n), !0).forEach(function(r) {
+      Qt(e, r, n[r]);
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(n)) : et(Object(n)).forEach(function(r) {
+      Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(n, r));
+    });
+  }
+  return e;
+}
+function Qt(e, t, n) {
+  return t = Ut(t), t in e ? Object.defineProperty(e, t, { value: n, enumerable: !0, configurable: !0, writable: !0 }) : e[t] = n, e;
+}
+function Ut(e) {
+  var t = Yt(e, "string");
+  return typeof t == "symbol" ? t : t + "";
+}
+function Yt(e, t) {
+  if (typeof e != "object" || !e) return e;
+  var n = e[Symbol.toPrimitive];
+  if (n !== void 0) {
+    var r = n.call(e, t || "default");
+    if (typeof r != "object") return r;
+    throw new TypeError("@@toPrimitive must return a primitive value.");
+  }
+  return (t === "string" ? String : Number)(e);
+}
+function lt(e) {
+  return e && e.map((t, n) => /* @__PURE__ */ I.createElement(t.tag, ge({
+    key: n
+  }, t.attr), lt(t.child)));
+}
+function Xt(e) {
+  return (t) => /* @__PURE__ */ I.createElement(Jt, me({
+    attr: ge({}, e.attr)
+  }, t), lt(e.child));
+}
+function Jt(e) {
+  var t = (n) => {
+    var {
+      attr: r,
+      size: o,
+      title: s
+    } = e, u = Vt(e, Ht), l = o || n.size || "1em", f;
+    return n.className && (f = n.className), e.className && (f = (f ? f + " " : "") + e.className), /* @__PURE__ */ I.createElement("svg", me({
+      stroke: "currentColor",
+      fill: "currentColor",
+      strokeWidth: "0"
+    }, n.attr, r, u, {
+      className: f,
+      style: ge(ge({
+        color: e.color || n.color
+      }, n.style), e.style),
+      height: l,
+      width: l,
+      xmlns: "http://www.w3.org/2000/svg"
+    }), s && /* @__PURE__ */ I.createElement("title", null, s), e.children);
   };
+  return qe !== void 0 ? /* @__PURE__ */ I.createElement(qe.Consumer, null, (n) => t(n)) : t(it);
+}
+function Zt(e) {
+  return Xt({ tag: "svg", attr: { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }, child: [{ tag: "path", attr: { d: "M18 6 6 18" }, child: [] }, { tag: "path", attr: { d: "m6 6 12 12" }, child: [] }] })(e);
 }
-const Qt = B(
+const qt = L.forwardRef(function(t, n) {
+  return /* @__PURE__ */ a(ht, { variant: "ghost", "aria-label": "Close", ref: n, ...t, children: t.children ?? /* @__PURE__ */ a(Zt, {}) });
+}), en = L.forwardRef(function(t, n) {
+  const { portalled: r = !0, portalRef: o, ...s } = t;
+  return /* @__PURE__ */ a(vt, { disabled: !r, container: o, children: /* @__PURE__ */ a(N.Positioner, { children: /* @__PURE__ */ a(N.Content, { ref: n, ...s }) }) });
+});
+L.forwardRef(function(t, n) {
+  return /* @__PURE__ */ a(N.Arrow, { ...t, ref: n, children: /* @__PURE__ */ a(N.ArrowTip, {}) });
+});
+L.forwardRef(function(t, n) {
+  return /* @__PURE__ */ a(
+    N.CloseTrigger,
+    {
+      position: "absolute",
+      top: "1",
+      insetEnd: "1",
+      ...t,
+      asChild: !0,
+      ref: n,
+      children: /* @__PURE__ */ a(qt, { size: "sm" })
+    }
+  );
+});
+N.Title;
+N.Description;
+N.Footer;
+N.Header;
+const tn = N.Root, nn = N.Body;
+N.Trigger;
+const rn = K(
   (e, t) => {
-    const n = Vt(e), {
+    const n = $t(e), {
       children: r,
       isOpen: o,
-      onClose: l,
-      onOpen: i,
-      placement: u,
-      resetItems: v,
-      removeItem: h
+      onClose: s,
+      onOpen: u,
+      placement: l,
+      resetItems: f,
+      removeItem: v
     } = n;
-    ut(t, () => ({
-      resetItems: v,
-      removeItem: h
+    pt(t, () => ({
+      resetItems: f,
+      removeItem: v
     }));
-    const { matchWidth: b = !0 } = n.autoCompleteProps;
-    return /* @__PURE__ */ p(Ot, { value: n, children: /* @__PURE__ */ p(
-      dt,
+    const { matchWidth: y = !0 } = n.autoCompleteProps;
+    return /* @__PURE__ */ a(xt, { value: n, children: /* @__PURE__ */ a(
+      tn,
       {
-        isLazy: !0,
-        isOpen: o,
-        onClose: l,
-        onOpen: i,
+        open: o,
         autoFocus: !1,
-        placement: u,
-        closeOnBlur: !0,
-        matchWidth: b,
-        children: /* @__PURE__ */ p(gt.div, { w: "full", ref: t, children: r })
+        positioning: { placement: l, sameWidth: y },
+        present: o,
+        children: /* @__PURE__ */ a(yt.div, { w: "full", ref: t, children: r })
       }
     ) });
   }
 );
-Qt.displayName = "AutoComplete";
-const $t = B(
+rn.displayName = "AutoComplete";
+const on = K(
   (e, t) => {
     const {
       focusedValue: n,
       getItemProps: r,
       interactionRef: o
-    } = W(), l = te(), i = Pe(t, l), u = r(e), { isValidSuggestion: v, value: h } = u.root, b = n === h;
-    D(() => {
-      var H;
-      b && o.current === "keyboard" && ((H = l == null ? void 0 : l.current) == null || H.scrollIntoView({
+    } = $(), s = se(), u = We(t, s), l = r(e), { isValidSuggestion: f, value: v } = l.root, y = n === v;
+    j(() => {
+      var T;
+      y && o.current === "keyboard" && ((T = s == null ? void 0 : s.current) == null || T.scrollIntoView({
         behavior: "smooth",
         block: "nearest"
       }));
-    }, [b, o]), D(() => {
-      typeof h != "string" && console.warn("wow"), typeof h != "string" && ce(e.getValue) && console.error(
+    }, [y, o]), j(() => {
+      typeof v != "string" && console.warn("wow"), typeof v != "string" && de(e.getValue) && console.error(
         "You must define the `getValue` prop, when an Item's value is not a string"
       );
     }, []);
-    const { children: c, dangerouslySetInnerHTML: O, ...C } = u.item, I = Me(C, ["groupId"]);
-    return v ? /* @__PURE__ */ p(pe, { ref: i, ...ot, ...I, children: c || /* @__PURE__ */ p("span", { dangerouslySetInnerHTML: O }) }) : null;
+    const { children: d, dangerouslySetInnerHTML: C, ...A } = l.item, x = ve(A, ["groupId"]);
+    return f ? /* @__PURE__ */ a(he, { ref: u, ...ut, ...x, children: d || /* @__PURE__ */ a("span", { dangerouslySetInnerHTML: C }) }) : null;
   }
 );
-$t.displayName = "AutoCompleteItem";
-const ot = {
+on.displayName = "AutoCompleteItem";
+const ut = {
   mx: "2",
   px: "2",
   py: "2",
   rounded: "md",
   cursor: "pointer"
 };
-function Kt(e) {
+function sn(e) {
   const { alwaysDisplay: t, children: n, ...r } = e, {
     autoCompleteProps: o,
-    getItemProps: l,
-    query: i,
-    filteredResults: u
-  } = W(), { children: v, ...h } = l(
+    getItemProps: s,
+    query: u,
+    filteredResults: l
+  } = $(), { children: f, ...v } = s(
     {
       ...e,
-      value: i,
-      children: m(n, {
-        value: i
+      value: u,
+      children: h(n, {
+        value: u
       })
     },
     !0
-  ).item, b = u.some((C) => C.value === i), c = Te(i) ? t : !0;
-  return o.creatable && c && !b ? /* @__PURE__ */ p(pe, { ...ot, ...h, ...r, children: v || `Add ${i}` }) : null;
+  ).item, y = l.some((A) => A.value === u), d = Me(u) ? t : !0;
+  return o.creatable && d && !y ? /* @__PURE__ */ a(he, { ...ut, ...v, ...r, children: f || `Add ${u}` }) : null;
 }
-Kt.displayName = "AutoCompleteCreatable";
-const Yt = B(
+sn.displayName = "AutoCompleteCreatable";
+const ln = K(
   (e, t) => {
-    const { children: n, showDivider: r, ...o } = e, l = Me(o, ["groupSibling"]), { getGroupProps: i } = W(), { group: u } = i(e), v = Zt(e);
-    return /* @__PURE__ */ K(Xe, { ref: t, ...u, ...l, children: [
-      /* @__PURE__ */ p(Qe, { ...v.top }),
+    const { children: n, showDivider: r, ...o } = e, s = ve(o, ["groupSibling"]), { getGroupProps: u } = $(), { group: l } = u(e), f = cn(e);
+    return /* @__PURE__ */ Z(Te, { ref: t, ...l, ...s, children: [
+      /* @__PURE__ */ a(Xe, { ...f.top }),
       n,
-      /* @__PURE__ */ p(Qe, { ...v.bottom })
+      /* @__PURE__ */ a(Xe, { ...f.bottom })
     ] });
   }
-), Jt = B(
-  (e, t) => /* @__PURE__ */ p(pe, { ...Xt, ...e, ref: t })
+), un = K(
+  (e, t) => /* @__PURE__ */ a(he, { ...an, ...e, ref: t })
 );
-Yt.displayName = "AutoCompleteGroup";
-Jt.displayName = "AutoCompleteGroupTitle";
-const Xt = {
+ln.displayName = "AutoCompleteGroup";
+un.displayName = "AutoCompleteGroupTitle";
+const an = {
   ml: 5,
   my: 1,
   fontSize: "xs",
   letterSpacing: "wider",
   fontWeight: "extrabold",
   textTransform: "uppercase"
-}, Zt = (e) => {
-  const { getGroupProps: t } = W(), n = e.groupSibling, {
+}, cn = (e) => {
+  const { getGroupProps: t } = $(), n = e.groupSibling, {
     divider: { hasFirstChild: r, hasLastChild: o }
-  } = t(e), l = {
+  } = t(e), s = {
     my: 2,
     borderColor: e.dividerColor
-  }, i = {
-    ...l,
+  }, u = {
+    ...s,
     mb: 4,
     display: !e.showDivider || r ? "none" : ""
-  }, u = {
-    ...l,
+  }, l = {
+    ...s,
     display: !e.showDivider || o || n ? "none" : ""
   };
-  return { top: i, bottom: u };
-}, Ke = B((e, t) => {
-  const { isLoading: n } = W(), { loadingIcon: r, ...o } = e;
-  return /* @__PURE__ */ K(mt, { children: [
-    /* @__PURE__ */ p(vt, { ...o, ref: t }),
-    n && /* @__PURE__ */ p(ht, { children: r || /* @__PURE__ */ p(Ze, {}) })
-  ] });
-}), rt = B(
+  return { top: u, bottom: l };
+}, fn = L.forwardRef(
+  function(t, n) {
+    const {
+      startElement: r,
+      startElementProps: o,
+      endElement: s,
+      endElementProps: u,
+      children: l,
+      startOffset: f = "6px",
+      endOffset: v = "6px",
+      ...y
+    } = t;
+    return /* @__PURE__ */ Z(bt, { ref: n, ...y, children: [
+      r && /* @__PURE__ */ a(Je, { pointerEvents: "none", ...o, children: r }),
+      L.cloneElement(l, {
+        ...r && {
+          ps: `calc(var(--input-height) - ${f})`
+        },
+        ...s && { pe: `calc(var(--input-height) - ${v})` },
+        ...l.props
+      }),
+      s && /* @__PURE__ */ a(Je, { placement: "end", ...u, children: s })
+    ] });
+  }
+), pn = K((e, t) => {
+  const { isLoading: n } = $(), { loadingIcon: r, ...o } = e, s = ve(o, ["children", "wrapStyles", "hidePlaceholder"]), u = /* @__PURE__ */ a(wt, { ...s, ref: t });
+  return n ? /* @__PURE__ */ a(fn, { endElement: r || /* @__PURE__ */ a(nt, {}), children: u }) : u;
+}), dn = K(
   (e, t) => {
     const {
       autoCompleteProps: n,
       inputRef: r,
       getInputProps: o,
-      tags: l,
-      setQuery: i,
-      value: u,
-      itemList: v
-    } = W(), {
-      children: h,
-      isInvalid: b,
-      hidePlaceholder: c,
-      ...O
-    } = e, { value: C } = O;
-    D(() => {
-      if (u !== void 0 && (typeof u == "string" || u instanceof String)) {
-        const re = v.find((J) => J.value === u), k = re === void 0 ? u : re.label;
-        i(k);
+      tags: s,
+      setQuery: u,
+      value: l,
+      itemList: f
+    } = $(), {
+      children: v,
+      hidePlaceholder: y,
+      ...d
+    } = e, { value: C } = d;
+    j(() => {
+      if (l !== void 0 && (typeof l == "string" || l instanceof String)) {
+        const ue = f.find((H) => H.value === l), Se = ue === void 0 ? l : ue.label;
+        u(Se);
       }
-    }, [u]), D(() => {
-      C !== void 0 && (typeof C == "string" || C instanceof String) && i(C);
+    }, [l]), j(() => {
+      C !== void 0 && (typeof C == "string" || C instanceof String) && u(C);
     }, [C]);
-    const I = yt("Input", e);
-    let { wrapper: H, input: j } = o(O, I);
-    const { ref: ne, ...ge } = H, oe = Pe(t, r), Y = m(h, { tags: l });
-    c && (j = {
-      ...j,
-      placeholder: Array.isArray(Y) && Y.length ? void 0 : j.placeholder
+    const A = {};
+    let { wrapper: x, input: T } = o(d, A);
+    const { ref: be, ...ie } = x, Ce = We(t, r), q = h(v, { tags: s });
+    y && (T = {
+      ...T,
+      placeholder: Array.isArray(q) && q.length ? void 0 : T.placeholder
     });
-    const me = /* @__PURE__ */ p(
-      Ke,
+    const le = /* @__PURE__ */ a(
+      pn,
       {
-        isInvalid: b,
-        ...j,
-        ref: oe
+        ...T,
+        ref: Ce
       }
-    ), ve = /* @__PURE__ */ K(bt, { "aria-invalid": b, ...ge, ref: ne, children: [
-      Y,
-      /* @__PURE__ */ p(
-        qe,
-        {
-          as: Ke,
-          ...j,
-          ref: oe
-        }
-      )
+    ), we = /* @__PURE__ */ Z(Te, { ...ie, ref: be, children: [
+      q,
+      le
     ] });
-    return /* @__PURE__ */ p(Ct, { children: n.multiple ? ve : me });
+    return /* @__PURE__ */ a(Ct, { children: n.multiple ? we : le });
   }
 );
-rt.displayName = "Input";
-rt.id = "Input";
-const qt = (e) => {
-  const { getEmptyStateProps: t, defaultEmptyStateProps: n } = W(), r = t(
-    /* @__PURE__ */ p(pe, { ...en, ...n, children: "No options found!" })
+dn.displayName = "Input";
+const mn = (e) => {
+  const { getEmptyStateProps: t, defaultEmptyStateProps: n } = $(), r = t(
+    /* @__PURE__ */ a(he, { ...gn, ...n, children: "No options found!" })
   );
-  return /* @__PURE__ */ p(Xe, { ...e, children: r });
-}, en = {
+  return /* @__PURE__ */ a(Te, { ...e, children: r });
+}, gn = {
   fontSize: "sm",
   align: "center",
   justify: "center",
   fontWeight: "bold",
   fontStyle: "italic"
-}, Ye = [
+}, tt = [
   "AutoCompleteGroup",
   "AutoCompleteItem",
   "AutoCompleteCreatable"
-], tn = (e) => {
-  const t = ee.Children.map(e, (o, l) => {
-    var i;
-    if (((i = o == null ? void 0 : o.type) == null ? void 0 : i.displayName) === "AutoCompleteGroup") {
-      const u = ee.Children.toArray(e)[l + 1];
-      return ee.cloneElement(o, {
-        groupSibling: u ? u.type.displayName === "AutoCompleteGroup" : !1
+], hn = (e) => {
+  const t = I.Children.map(e, (o, s) => {
+    var u;
+    if (((u = o == null ? void 0 : o.type) == null ? void 0 : u.displayName) === "AutoCompleteGroup") {
+      const l = I.Children.toArray(e)[s + 1];
+      return I.cloneElement(o, {
+        groupSibling: l ? l.type.displayName === "AutoCompleteGroup" : !1
       });
     }
     return o;
-  }), n = ee.Children.toArray(t).filter(
+  }), n = I.Children.toArray(t).filter(
     (o) => {
-      var l;
-      return !Ye.includes(
-        (l = o == null ? void 0 : o.type) == null ? void 0 : l.displayName
+      var s;
+      return !tt.includes(
+        (s = o == null ? void 0 : o.type) == null ? void 0 : s.displayName
       );
     }
   );
-  return [ee.Children.toArray(t).filter(
+  return [I.Children.toArray(t).filter(
     (o) => {
-      var l;
-      return Ye.includes(
-        (l = o == null ? void 0 : o.type) == null ? void 0 : l.displayName
+      var s;
+      return tt.includes(
+        (s = o == null ? void 0 : o.type) == null ? void 0 : s.displayName
       );
     }
   ), n];
-}, nn = B(
+}, vn = K(
   (e, t) => {
-    const { children: n, loadingState: r, ...o } = e, { listRef: l, isLoading: i } = W(), u = Pe(t, l), [v, h] = tn(n);
-    return /* @__PURE__ */ K(St, { ref: u, w: "inherit", ...on, ...o, children: [
-      i && /* @__PURE__ */ p(xt, { children: r || /* @__PURE__ */ p(Ze, { size: "md" }) }),
-      !i && /* @__PURE__ */ K(it, { children: [
-        v,
-        /* @__PURE__ */ p(qt, {}),
-        h
+    const { children: n, loadingState: r, ...o } = e, { listRef: s, isLoading: u } = $(), l = We(t, s), [f, v] = hn(n);
+    return /* @__PURE__ */ a(en, { width: "auto", children: /* @__PURE__ */ Z(nn, { ref: l, w: "inherit", ...yn, ...o, children: [
+      u && /* @__PURE__ */ a(St, { children: r || /* @__PURE__ */ a(nt, { size: "md" }) }),
+      !u && /* @__PURE__ */ Z(ft, { children: [
+        f,
+        /* @__PURE__ */ a(mn, {}),
+        v
       ] })
-    ] });
+    ] }) });
   }
 );
-nn.displayName = "AutoCompleteList";
-const on = {
-  py: "4",
-  opacity: "0",
+vn.displayName = "AutoCompleteList";
+const yn = {
+  // py: "4",
+  //opacity: "0",
+  px: "0px",
   bg: "#232934",
   rounded: "md",
   maxH: "350px",
@@ -739,46 +884,55 @@ const on = {
   _focus: {
     boxShadow: "none"
   }
-}, pn = at((e) => {
+}, bn = L.forwardRef(
+  function(t, n) {
+    const {
+      startElement: r,
+      endElement: o,
+      onClose: s,
+      closable: u = !!s,
+      children: l,
+      ...f
+    } = t;
+    return /* @__PURE__ */ Z(J.Root, { ref: n, ...f, children: [
+      r && /* @__PURE__ */ a(J.StartElement, { children: r }),
+      /* @__PURE__ */ a(J.Label, { children: l }),
+      o && /* @__PURE__ */ a(J.EndElement, { children: o }),
+      u && /* @__PURE__ */ a(J.EndElement, { children: /* @__PURE__ */ a(J.CloseTrigger, { onClick: s }) })
+    ] });
+  }
+), In = dt((e) => {
   const { label: t, onRemove: n, disabled: r, ...o } = e;
-  return /* @__PURE__ */ p(qe, { children: /* @__PURE__ */ K(
-    At,
+  return /* @__PURE__ */ a(
+    bn,
     {
       borderRadius: "md",
       fontWeight: "normal",
-      ...r && Je,
+      closable: !0,
+      onClose: () => !r && h(n),
+      ...r && Cn,
       ...o,
-      children: [
-        /* @__PURE__ */ p(It, { children: t }),
-        /* @__PURE__ */ p(
-          wt,
-          {
-            onClick: () => !r && m(n),
-            cursor: "pointer",
-            ...r && Je
-          }
-        )
-      ]
+      children: t
     }
-  ) });
-}), Je = {
+  );
+}), Cn = {
   cursor: "text",
   userSelect: "none",
   opacity: 0.4,
   _focus: { boxShadow: "none" }
 };
 export {
-  Qt as AutoComplete,
-  Kt as AutoCompleteCreatable,
-  Yt as AutoCompleteGroup,
-  Jt as AutoCompleteGroupTitle,
-  rt as AutoCompleteInput,
-  $t as AutoCompleteItem,
-  nn as AutoCompleteList,
-  Ot as AutoCompleteProvider,
-  pn as AutoCompleteTag,
-  ot as baseItemStyles,
-  Et as createContext,
-  Vt as useAutoComplete,
-  W as useAutoCompleteContext
+  rn as AutoComplete,
+  sn as AutoCompleteCreatable,
+  ln as AutoCompleteGroup,
+  un as AutoCompleteGroupTitle,
+  dn as AutoCompleteInput,
+  on as AutoCompleteItem,
+  vn as AutoCompleteList,
+  xt as AutoCompleteProvider,
+  In as AutoCompleteTag,
+  ut as baseItemStyles,
+  Ot as createContext,
+  $t as useAutoComplete,
+  $ as useAutoCompleteContext
 };