welcome-ui 8.1.1 → 8.2.0-alpha.0

package/dist/Select.mjs

@@ -1,21 +1,22 @@
 "use client";
-import m, { useMemo as ze, useState as B, useEffect as he, Fragment as Le } from "react";
-import { D as pe } from "./downshift.esm-D0ns_SQs.mjs";
-import { g as Ze } from "./_commonjsHelpers-CXJ7dpIk.mjs";
-import { c as Qe } from "./create-event-rXDe5aCQ.mjs";
-import { d as Xe, F as qe } from "./field-styles-CfVLcVQp.mjs";
-import C, { system as Oe, th as v, css as W } from "@xstyled/styled-components";
+import { j as p } from "./jsx-runtime-B7I4PJ0H.mjs";
+import { D as he } from "./downshift.esm-B7Jil1wW.mjs";
+import { g as ze } from "./_commonjsHelpers-CXJ7dpIk.mjs";
+import Le, { useMemo as Ze, useState as B, useEffect as pe, Fragment as Qe } from "react";
+import { ClearButton as Xe } from "./ClearButton.mjs";
+import { StyledIcon as qe } from "./Icon.mjs";
+import { D as Ge } from "./index-DAZ1SYdj.mjs";
+import { shouldForwardProp as te, forwardRef as Je } from "./System.mjs";
+import { c as et } from "./create-event-rXDe5aCQ.mjs";
+import { d as tt, F as nt } from "./field-styles-CfVLcVQp.mjs";
+import { StyledTag as rt, Tag as ot } from "./Tag.mjs";
+import b, { system as Ce, th as E, css as _ } from "@xstyled/styled-components";
+import { Box as st } from "./Box.mjs";
+import { IconWrapper as it } from "./Field.mjs";
 import { o as G } from "./overflow-ellipsis-DGV5Kgt-.mjs";
-import { StyledIcon as Ge } from "./Icon.mjs";
-import { IconWrapper as Je } from "./Field.mjs";
-import { StyledTag as et, Tag as tt } from "./Tag.mjs";
-import { shouldForwardProp as te, forwardRef as nt } from "./System.mjs";
-import { Box as rt } from "./Box.mjs";
-import { ClearButton as ot } from "./ClearButton.mjs";
-import { D as at } from "./index-BNGGwOCo.mjs";
-var _ = { exports: {} }, ge;
-function it() {
-  if (ge) return _.exports;
+var F = { exports: {} }, ge;
+function lt() {
+  if (ge) return F.exports;
   ge = 1;
   var e = {
     À: "A",
@@ -478,18 +479,18 @@ function it() {
     ё: "е",
     Ё: "Е"
   }, t = Object.keys(e).join("|"), n = new RegExp(t, "g"), r = new RegExp(t, "");
-  function o(l) {
-    return e[l];
+  function o(a) {
+    return e[a];
   }
-  var a = function(l) {
-    return l.replace(n, o);
-  }, u = function(l) {
-    return !!l.match(r);
+  var s = function(a) {
+    return a.replace(n, o);
+  }, u = function(a) {
+    return !!a.match(r);
   };
-  return _.exports = a, _.exports.has = u, _.exports.remove = a, _.exports;
+  return F.exports = s, F.exports.has = u, F.exports.remove = s, F.exports;
 }
-var st = it();
-const lt = /* @__PURE__ */ Ze(st);
+var at = lt();
+const ct = /* @__PURE__ */ ze(at);
 /**
  * @name match-sorter
  * @license MIT license.
@@ -505,62 +506,62 @@ const I = {
   ACRONYM: 2,
   MATCHES: 1,
   NO_MATCH: 0
-}, ct = (e, t) => String(e.rankedValue).localeCompare(String(t.rankedValue));
+}, ut = (e, t) => String(e.rankedValue).localeCompare(String(t.rankedValue));
 function J(e, t, n) {
   n === void 0 && (n = {});
   const {
     keys: r,
     threshold: o = I.MATCHES,
-    baseSort: a = ct,
-    sorter: u = (f) => f.sort((d, i) => mt(d, i, a))
-  } = n, l = e.reduce(c, []);
-  return u(l).map((f) => {
+    baseSort: s = ut,
+    sorter: u = (f) => f.sort((d, i) => ht(d, i, s))
+  } = n, a = e.reduce(c, []);
+  return u(a).map((f) => {
     let {
       item: d
     } = f;
     return d;
   });
   function c(f, d, i) {
-    const h = ut(d, r, t, n), {
-      rank: x,
-      keyThreshold: E = o
-    } = h;
-    return x >= E && f.push({
-      ...h,
+    const m = dt(d, r, t, n), {
+      rank: O,
+      keyThreshold: x = o
+    } = m;
+    return O >= x && f.push({
+      ...m,
       item: d,
       index: i
     }), f;
   }
 }
 J.rankings = I;
-function ut(e, t, n, r) {
+function dt(e, t, n, r) {
   if (!t) {
-    const a = e;
+    const s = e;
     return {
       // ends up being duplicate of 'item' in matches but consistent
-      rankedValue: a,
-      rank: Ie(a, n, r),
+      rankedValue: s,
+      rank: Ie(s, n, r),
       keyIndex: -1,
       keyThreshold: r.threshold
     };
   }
-  return gt(e, t).reduce((a, u, l) => {
+  return It(e, t).reduce((s, u, a) => {
     let {
       rank: c,
       rankedValue: f,
       keyIndex: d,
       keyThreshold: i
-    } = a, {
-      itemValue: h,
-      attributes: x
-    } = u, E = Ie(h, n, r), $ = f;
+    } = s, {
+      itemValue: m,
+      attributes: O
+    } = u, x = Ie(m, n, r), U = f;
     const {
-      minRanking: H,
-      maxRanking: N,
+      minRanking: $,
+      maxRanking: H,
       threshold: K
-    } = x;
-    return E < H && E >= I.MATCHES ? E = H : E > N && (E = N), E > c && (c = E, d = l, i = K, $ = h), {
-      rankedValue: $,
+    } = O;
+    return x < $ && x >= I.MATCHES ? x = $ : x > H && (x = H), x > c && (c = x, d = a, i = K, U = m), {
+      rankedValue: U,
       rank: c,
       keyIndex: d,
       keyThreshold: i
@@ -573,25 +574,25 @@ function ut(e, t, n, r) {
   });
 }
 function Ie(e, t, n) {
-  return e = Ae(e, n), t = Ae(t, n), t.length > e.length ? I.NO_MATCH : e === t ? I.CASE_SENSITIVE_EQUAL : (e = e.toLowerCase(), t = t.toLowerCase(), e === t ? I.EQUAL : e.startsWith(t) ? I.STARTS_WITH : e.includes(` ${t}`) ? I.WORD_STARTS_WITH : e.includes(t) ? I.CONTAINS : t.length === 1 ? I.NO_MATCH : dt(e).includes(t) ? I.ACRONYM : ft(e, t));
+  return e = Ae(e, n), t = Ae(t, n), t.length > e.length ? I.NO_MATCH : e === t ? I.CASE_SENSITIVE_EQUAL : (e = e.toLowerCase(), t = t.toLowerCase(), e === t ? I.EQUAL : e.startsWith(t) ? I.STARTS_WITH : e.includes(` ${t}`) ? I.WORD_STARTS_WITH : e.includes(t) ? I.CONTAINS : t.length === 1 ? I.NO_MATCH : ft(e).includes(t) ? I.ACRONYM : mt(e, t));
 }
-function dt(e) {
+function ft(e) {
   let t = "";
   return e.split(" ").forEach((r) => {
-    r.split("-").forEach((a) => {
-      t += a.substr(0, 1);
+    r.split("-").forEach((s) => {
+      t += s.substr(0, 1);
     });
   }), t;
 }
-function ft(e, t) {
+function mt(e, t) {
   let n = 0, r = 0;
   function o(c, f, d) {
-    for (let i = d, h = f.length; i < h; i++)
+    for (let i = d, m = f.length; i < m; i++)
       if (f[i] === c)
         return n += 1, i + 1;
     return -1;
   }
-  function a(c) {
+  function s(c) {
     const f = 1 / c, d = n / t.length;
     return I.MATCHES + d * f;
   }
@@ -604,26 +605,26 @@ function ft(e, t) {
     if (r = o(d, e, r), !(r > -1))
       return I.NO_MATCH;
   }
-  const l = r - u;
-  return a(l);
+  const a = r - u;
+  return s(a);
 }
-function mt(e, t, n) {
+function ht(e, t, n) {
   const {
-    rank: a,
+    rank: s,
     keyIndex: u
   } = e, {
-    rank: l,
+    rank: a,
     keyIndex: c
   } = t;
-  return a === l ? u === c ? n(e, t) : u < c ? -1 : 1 : a > l ? -1 : 1;
+  return s === a ? u === c ? n(e, t) : u < c ? -1 : 1 : s > a ? -1 : 1;
 }
 function Ae(e, t) {
   let {
     keepDiacritics: n
   } = t;
-  return e = `${e}`, n || (e = lt(e)), e;
+  return e = `${e}`, n || (e = ct(e)), e;
 }
-function ht(e, t) {
+function pt(e, t) {
   typeof t == "object" && (t = t.key);
   let n;
   if (typeof t == "function")
@@ -634,109 +635,74 @@ function ht(e, t) {
     n = e[t];
   else {
     if (t.includes("."))
-      return pt(t, e);
+      return gt(t, e);
     n = null;
   }
   return n == null ? [] : Array.isArray(n) ? n : [String(n)];
 }
-function pt(e, t) {
+function gt(e, t) {
   const n = e.split(".");
   let r = [t];
-  for (let o = 0, a = n.length; o < a; o++) {
+  for (let o = 0, s = n.length; o < s; o++) {
     const u = n[o];
-    let l = [];
+    let a = [];
     for (let c = 0, f = r.length; c < f; c++) {
       const d = r[c];
       if (d != null)
         if (Object.hasOwnProperty.call(d, u)) {
           const i = d[u];
-          i != null && l.push(i);
-        } else u === "*" && (l = l.concat(d));
+          i != null && a.push(i);
+        } else u === "*" && (a = a.concat(d));
     }
-    r = l;
+    r = a;
   }
   return Array.isArray(r[0]) ? [].concat(...r) : r;
 }
-function gt(e, t) {
+function It(e, t) {
   const n = [];
   for (let r = 0, o = t.length; r < o; r++) {
-    const a = t[r], u = It(a), l = ht(e, a);
-    for (let c = 0, f = l.length; c < f; c++)
+    const s = t[r], u = At(s), a = pt(e, s);
+    for (let c = 0, f = a.length; c < f; c++)
       n.push({
-        itemValue: l[c],
+        itemValue: a[c],
         attributes: u
       });
   }
   return n;
 }
-const Ee = {
+const xe = {
   maxRanking: 1 / 0,
   minRanking: -1 / 0
 };
-function It(e) {
-  return typeof e == "string" ? Ee : {
-    ...Ee,
+function At(e) {
+  return typeof e == "string" ? xe : {
+    ...xe,
     ...e
   };
 }
-const ne = "", xe = (e) => {
-  if (typeof e == "number")
-    return String(e);
-  if (typeof e == "string") {
-    const t = e.match(/[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g);
-    return t && t.map((n) => n.toLowerCase()).join("-");
-  }
-}, ye = (e) => e ? e.label : ne, At = (e) => e.reduce(
-  (t, n) => n.label && t.length > n.label.length ? t : n.label,
-  ne
-), Et = (e, t, n) => {
-  const r = t.find((o) => e.value === o.value);
-  return r && n ? t.filter((o) => e.value !== o.value) : r ? t : [...t, e];
-}, X = (e, t) => !!t.find((n) => n.value === e), ee = (e, t = []) => t.find(
-  (r) => r.label === (e.label || e) || r.value === (e.value || e)
-) || { value: xe(e), label: e }, yt = (e, t, n = !1) => {
-  const r = n ? t.flatMap((o) => o.options) : t;
-  return !e && e !== 0 ? [] : Array.isArray(e) ? e.map((o) => ee(o, r)) : [ee(e, r)];
-}, vt = (e, t) => !!t.find((n) => n.value === e.value), bt = (e, t) => vt(e, t) ? e.value : e.label, ve = (e, t) => {
-  if (e)
-    return e.map((n) => bt(n, t));
-}, Ct = (e, t) => {
-  if (e)
-    return e.filter(
-      (n) => !t.find((r) => r.value === n.value)
-    );
-}, Ot = ({
-  inputValue: e,
-  isMultiple: t,
-  isSearchable: n,
-  options: r,
-  renderItem: o
-}) => {
-  const a = ee(e, r);
-  return t ? e : a.label ? n ? a.label : o(a) : ne;
-}, ke = C(Je)``, Se = C(rt).withConfig({ shouldForwardProp: te })(
-  ({ disabled: e }) => W`
+const Oe = b(it)``, ke = b(st).withConfig({ shouldForwardProp: te })(
+  ({ disabled: e }) => _`
     position: relative;
-    ${Oe}
-    ${ke} {
-      color: ${e ? v("defaultFields.select.disabled.color") : "initial"};
+    ${Ce}
+    ${Oe} {
+      color: ${e ? E("defaultFields.select.disabled.color") : "initial"};
     }
   `
-), xt = C.div`
+), xt = b.div`
   position: relative;
-`, be = C.divBox.withConfig({ shouldForwardProp: te })(
-  ({ iconPlacement: e, isClearable: t, size: n, transparent: r, variant: o }) => W`
+`, ye = b.divBox.withConfig({ shouldForwardProp: te })(
+  ({ iconPlacement: e, isClearable: t, size: n, transparent: r, variant: o }) => _`
     position: relative;
-    ${Xe({
+    ${tt({
+    iconPlacement: e,
+    isClearable: t,
     size: n,
-    variant: o,
     transparent: r,
-    isClearable: t,
-    iconPlacement: e
+    variant: o
   })};
     ${G};
     cursor: pointer;
-    ${Oe}
+    ${Ce}
     line-height: 1em;
 
     br {
@@ -760,16 +726,16 @@ const ne = "", xe = (e) => {
         left: 0;
         ${G};
         padding: inherit;
-        ${v("defaultFields.placeholder")}
+        ${E("defaultFields.placeholder")}
       }
       &::before {
         height: auto;
       }
     }
   `
-), kt = C.ul`
-  ${v("defaultFields.select.default")};
-  ${v("cards.default")};
+), yt = b.ul`
+  ${E("defaultFields.select.default")};
+  ${E("cards.default")};
   position: absolute;
   z-index: 2;
   right: 0;
@@ -784,22 +750,22 @@ const ne = "", xe = (e) => {
   &:hover > * {
     cursor: pointer;
   }
-`, q = C.li(
-  ({ allowUnselectFromList: e, isDisabled: t, isHighlighted: n, isMultiple: r, isSelected: o }) => W`
+`, X = b.li(
+  ({ allowUnselectFromList: e, isDisabled: t, isHighlighted: n, isMultiple: r, isSelected: o }) => _`
     color: beige-70;
-    ${n && v("defaultFields.select.highlighted")};
-    ${o && !r && v("defaultFields.select.selected")};
-    ${o && r && !e && v("defaultFields.select.existing")};
-    ${t && v("defaultFields.select.disabled")};
+    ${n && E("defaultFields.select.highlighted")};
+    ${o && !r && E("defaultFields.select.selected")};
+    ${o && r && !e && E("defaultFields.select.existing")};
+    ${t && E("defaultFields.select.disabled")};
     ${G};
     padding: md;
     list-style: none;
     text-decoration: none;
     font-size: sm;
-    transition: background ${v.transition("medium")};
+    transition: background ${E.transition("medium")};
   `
-), St = C.divBox(
-  ({ size: e }) => W`
+), Et = b.divBox(
+  ({ size: e }) => _`
     position: absolute;
     padding: 0;
     top: 0;
@@ -808,8 +774,8 @@ const ne = "", xe = (e) => {
     display: flex;
     gap: xs;
   `
-), Ce = C.button.withConfig({ shouldForwardProp: te })(
-  ({ isOpen: e }) => W`
+), Ee = b.button.withConfig({ shouldForwardProp: te })(
+  ({ isOpen: e }) => _`
     position: relative;
     height: 100%;
     padding: 0;
@@ -822,7 +788,7 @@ const ne = "", xe = (e) => {
     align-items: center;
     justify-content: center;
 
-    ${Ge} {
+    ${qe} {
       transform: ${e ? "rotate3d(0, 0, 1, 180deg)" : "rotate3d(0)"};
       transition: medium;
     }
@@ -832,14 +798,14 @@ const ne = "", xe = (e) => {
     }
 
     &:disabled {
-      color: ${v("defaultFields.select.disabled.color")};
+      color: ${E("defaultFields.select.disabled.color")};
     }
   `
-), wt = C.divBox`
+), vt = b.divBox`
   margin-top: lg;
 
   ${/* sc-selector */
-et}:not(:last-child) {
+rt}:not(:last-child) {
     margin-right: sm;
     margin-bottom: sm;
   }
@@ -848,222 +814,274 @@ et}:not(:last-child) {
     display: none;
   }
 `;
-function Tt(e, t) {
-  return /* @__PURE__ */ m.createElement(wt, { role: "list" }, e.map((n) => /* @__PURE__ */ m.createElement(tt, { key: n.value, onRemove: () => t(n.value.toString()), role: "listitem" }, n.label)));
+function bt(e, t) {
+  return /* @__PURE__ */ p.jsx(vt, { role: "list", children: e.map((n) => /* @__PURE__ */ p.jsx(ot, { onRemove: () => t(n.value.toString()), role: "listitem", children: n.label }, n.value)) });
 }
-const Vt = pe.default || pe, Yt = nt(
+const ne = "", Se = (e) => {
+  if (typeof e == "number")
+    return String(e);
+  if (typeof e == "string") {
+    const t = e.match(/[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g);
+    return t && t.map((n) => n.toLowerCase()).join("-");
+  }
+}, ve = (e) => e ? e.label : ne, Ct = (e) => e.reduce(
+  (t, n) => n.label && t.length > n.label.length ? t : n.label,
+  ne
+), Ot = (e, t, n) => {
+  const r = t.find((o) => e.value === o.value);
+  return r && n ? t.filter((o) => e.value !== o.value) : r ? t : [...t, e];
+}, q = (e, t) => !!t.find((n) => n.value === e), ee = (e, t = []) => t.find(
+  (r) => r.label === (e.label || e) || r.value === (e.value || e)
+) || { label: e, value: Se(e) }, kt = (e, t, n = !1) => {
+  const r = n ? t.flatMap((o) => o.options) : t;
+  return !e && e !== 0 ? [] : Array.isArray(e) ? e.map((o) => ee(o, r)) : [ee(e, r)];
+}, St = (e, t) => !!t.find((n) => n.value === e.value), wt = (e, t) => St(e, t) ? e.value : e.label, be = (e, t) => {
+  if (e)
+    return e.map((n) => wt(n, t));
+}, jt = (e, t) => {
+  if (e)
+    return e.filter(
+      (n) => !t.find((r) => r.value === n.value)
+    );
+}, Tt = ({
+  inputValue: e,
+  isMultiple: t,
+  isSearchable: n,
+  options: r,
+  renderItem: o
+}) => {
+  const s = ee(e, r);
+  return t ? e : s.label ? n ? s.label : o(s) : ne;
+}, Vt = he.default || he, Lt = Je(
   ({
     allowUnselectFromList: e,
     autoComplete: t = "off",
     autoFocus: n,
     dataTestId: r,
     disableCloseOnSelect: o,
-    disabled: a,
+    disabled: s,
     groupsEnabled: u,
-    icon: l,
+    icon: a,
     id: c,
     isClearable: f,
     isCreatable: d,
     isMultiple: i,
-    isSearchable: h,
-    name: x,
-    onBlur: E,
-    onChange: $,
-    onClick: H,
-    onCreate: N,
+    isSearchable: m,
+    name: O,
+    onBlur: x,
+    onChange: U,
+    onClick: $,
+    onCreate: H,
     onFocus: K,
     options: A = [],
     placeholder: re = "Choose from…",
     renderCreateItem: we = (w) => `Create "${w}"`,
-    renderGroupHeader: Te,
-    renderItem: Y = ye,
-    renderMultiple: Ve = Tt,
-    size: M = "md",
-    transparent: Re,
+    renderGroupHeader: je,
+    renderItem: Y = ve,
+    renderMultiple: Te = bt,
+    size: W = "md",
+    transparent: Ve,
     value: oe,
-    variant: Ue,
-    ...ae
-  }, D) => {
-    const w = ze(
-      () => yt(oe, A, u),
+    variant: Re,
+    ...se
+  }, N) => {
+    const w = Ze(
+      () => kt(oe, A, u),
       [oe, A, u]
-    ), z = !i && w[0] || null, L = z ? z.label : "", [k, Z] = B(w), [b, F] = B(L), [j, P] = B(A), [S, T] = B(!1);
-    h = d || h, he(() => {
-      var s;
-      n && ((s = D == null ? void 0 : D.current) == null || s.focus(), h && T(!0));
-    }, [h, n, D]), he(() => {
-      Z(w), F(L), P(A);
+    ), z = !i && w[0] || null, L = z ? z.label : "", [k, Z] = B(w), [v, D] = B(L), [M, P] = B(A), [S, j] = B(!1);
+    m = d || m, pe(() => {
+      var l;
+      n && ((l = N == null ? void 0 : N.current) == null || l.focus(), m && j(!0));
+    }, [m, n, N]), pe(() => {
+      Z(w), D(L), P(A);
     }, [L, A, w]);
-    const $e = (s) => {
-      if (h && s !== b) {
-        let p = [];
-        u ? p = J(A, s, {
+    const Ue = (l) => {
+      if (m && l !== v) {
+        let h = [];
+        u ? h = J(A, l, {
           // should match on group.label OR group.options.label
-          keys: [(g) => g.label, (g) => g.options.map((V) => V.label)]
-        }) : p = J(A, s, { keys: ["label"] }), F(s), P(p);
+          keys: [(g) => g.label, (g) => g.options.map((T) => T.label)]
+        }) : h = J(A, l, { keys: ["label"] }), D(l), P(h);
       }
-    }, He = () => {
-      h && !S && T(!0);
-    }, ie = (s) => {
-      let p = [];
-      u ? p = ve(
-        s,
-        A.flatMap((R) => R.options)
-      ) : p = ve(s, A);
-      const g = i ? p : p[0], V = Qe({ name: x, value: i ? s : s[0] });
-      if ($ && $(g, V), d) {
-        const R = Ct(s, A);
-        R.length && N && N(R[0].label, V);
+    }, $e = () => {
+      m && !S && j(!0);
+    }, ie = (l) => {
+      let h = [];
+      u ? h = be(
+        l,
+        A.flatMap((V) => V.options)
+      ) : h = be(l, A);
+      const g = i ? h : h[0], T = et({ name: O, value: i ? l : l[0] });
+      if (U && U(g, T), d) {
+        const V = jt(l, A);
+        V.length && H && H(V[0].label, T);
       }
-    }, Ne = (s) => {
-      let p, g;
-      !s || s != null && s.disabled ? (p = i ? k : [], g = !0) : (p = i ? Et(s, k, e) : [s], g = i), g && F(""), P(A), Z(p), ie(p), o || T(!1);
-    }, De = (s) => {
-      const p = k.filter((g) => g.value !== s);
-      Z(p), ie(p);
-    }, Fe = (s) => {
-      i && s.selectedItem ? F("") : h && s.selectedItem && F(s.selectedItem.label), P(A), T(!1);
-    }, _e = At(A), se = Ot({
-      inputValue: b,
+    }, He = (l) => {
+      let h, g;
+      !l || l != null && l.disabled ? (h = i ? k : [], g = !0) : (h = i ? Ot(l, k, e) : [l], g = i), g && D(""), P(A), Z(h), ie(h), o || j(!1);
+    }, Ne = (l) => {
+      const h = k.filter((g) => g.value !== l);
+      Z(h), ie(h);
+    }, De = (l) => {
+      i && l.selectedItem ? D("") : m && l.selectedItem && D(l.selectedItem.label), P(A), j(!1);
+    }, Fe = Ct(A), le = Tt({
+      inputValue: v,
       isMultiple: i,
-      isSearchable: h,
+      isSearchable: m,
       options: A,
       renderItem: Y
     });
-    return /* @__PURE__ */ m.createElement(
+    return /* @__PURE__ */ p.jsx(
       Vt,
       {
         id: c,
-        inputValue: h ? se : "",
+        inputValue: m ? le : "",
         isOpen: S,
-        itemToString: ye,
-        onInputValueChange: $e,
-        onOuterClick: Fe,
-        onSelect: Ne,
-        selectedItem: z
-      },
-      ({
-        clearSelection: s,
-        getInputProps: p,
-        getItemProps: g,
-        getMenuProps: V,
-        getRootProps: R,
-        getToggleButtonProps: We,
-        highlightedIndex: Q
-      }) => {
-        const le = !!(d && b && !X(b, k)), Me = S && (j.length || le), je = f && b, Pe = /* @__PURE__ */ m.createElement(Ce, { as: "div" }, /* @__PURE__ */ m.createElement(
-          ot,
-          {
-            onClick: s
-          }
-        )), Be = /* @__PURE__ */ m.createElement(
-          Ce,
-          {
-            "data-testid": r && `${r}-arrow-icon`,
-            disabled: a,
-            isOpen: S,
-            size: M,
-            tabIndex: -1,
-            ...We({
-              onClick: () => T(!S)
-            })
-          },
-          /* @__PURE__ */ m.createElement(at, { size: "sm" })
-        ), Ke = (U) => {
-          H && H(U), T(!S);
-        }, Ye = R(ae), ce = p({
-          autoComplete: t,
-          autoFocus: n,
-          "data-spacer": _e || re,
-          "data-testid": r,
-          disabled: a,
-          iconPlacement: l ? "both" : "right",
-          id: c,
-          name: x,
-          onBlur: E,
-          onClick: a ? void 0 : Ke,
-          onFocus: K,
-          onKeyDown: He,
-          placeholder: re,
-          ref: D,
-          size: M,
-          tabIndex: 0,
-          variant: S ? "focused" : Ue,
-          isClearable: f,
-          transparent: Re,
-          ...ae
-          // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        }), ue = qe[M];
-        return /* @__PURE__ */ m.createElement(Se, { ...Ye, disabled: a }, /* @__PURE__ */ m.createElement(xt, null, h ? /* @__PURE__ */ m.createElement(be, { as: "input", type: "text", ...ce }) : /* @__PURE__ */ m.createElement(be, { ...ce }, se), l && /* @__PURE__ */ m.createElement(ke, { iconPlacement: "left", size: ue }, m.cloneElement(l, { ...l.props, size: ue })), /* @__PURE__ */ m.createElement(St, { size: M }, je && Pe, Be)), Me && /* @__PURE__ */ m.createElement(kt, { ...V() }, j.reduce(
-          (U, y, de) => {
-            if (u && "options" in y)
-              U.itemsToRender.push(
-                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                // @ts-ignore
-                /* @__PURE__ */ m.createElement(Le, { key: y.label }, Te(y), y.options && y.options.map((O) => {
-                  const fe = U.itemIndex++, me = X(O.value, k);
-                  return /* @__PURE__ */ m.createElement(
-                    q,
-                    {
-                      allowUnselectFromList: e,
-                      isDisabled: O.disabled,
-                      isHighlighted: Q === fe,
-                      isMultiple: i,
-                      key: O.value,
-                      ...g({
-                        index: fe,
-                        isSelected: me,
-                        item: O
-                      })
-                    },
-                    Y(O, me)
-                  );
-                }))
-              );
-            else if ("value" in y) {
-              const O = X(y.value, k);
-              U.itemsToRender.push(
-                /* @__PURE__ */ m.createElement(
-                  q,
-                  {
-                    allowUnselectFromList: e,
-                    isDisabled: y.disabled,
-                    isHighlighted: Q === de,
-                    isMultiple: i,
-                    key: y.value,
-                    ...g({
-                      index: de,
-                      isSelected: O,
-                      item: y
-                    })
-                  },
-                  Y(y, O)
-                )
-              );
+        itemToString: ve,
+        onInputValueChange: Ue,
+        onOuterClick: De,
+        onSelect: He,
+        selectedItem: z,
+        children: ({
+          clearSelection: l,
+          getInputProps: h,
+          getItemProps: g,
+          getMenuProps: T,
+          getRootProps: V,
+          getToggleButtonProps: _e,
+          highlightedIndex: Q
+        }) => {
+          const ae = !!(d && v && !q(v, k)), We = S && (M.length || ae), Me = f && v, Pe = /* @__PURE__ */ p.jsx(Ee, { as: "div", children: /* @__PURE__ */ p.jsx(
+            Xe,
+            {
+              onClick: l
+            }
+          ) }), Be = /* @__PURE__ */ p.jsx(
+            Ee,
+            {
+              "data-testid": r ? `${r}-arrow-icon` : null,
+              disabled: s,
+              isOpen: S,
+              size: W,
+              tabIndex: -1,
+              ..._e({
+                onClick: () => j(!S)
+              }),
+              children: /* @__PURE__ */ p.jsx(Ge, { size: "sm" })
             }
-            return U;
-          },
-          { itemsToRender: [], itemIndex: 0 }
-        ).itemsToRender, le && b.length && /* @__PURE__ */ m.createElement(
-          q,
-          {
-            isHighlighted: Q === j.length,
-            key: "add",
-            ...g({
-              index: j.length,
-              item: {
-                value: xe(b),
-                label: b
-              }
-            })
-          },
-          we(b)
-        )), i && Ve(k, De));
+          ), Ke = (R) => {
+            $ && $(R), j(!S);
+          }, Ye = V(se), ce = h({
+            autoComplete: t,
+            autoFocus: n,
+            "data-spacer": Fe || re,
+            "data-testid": r,
+            disabled: s,
+            iconPlacement: a ? "both" : "right",
+            id: c,
+            isClearable: f,
+            name: O,
+            onBlur: x,
+            onClick: s ? void 0 : Ke,
+            onFocus: K,
+            onKeyDown: $e,
+            placeholder: re,
+            ref: N,
+            size: W,
+            tabIndex: 0,
+            transparent: Ve,
+            variant: S ? "focused" : Re,
+            ...se
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+          }), ue = nt[W];
+          return /* @__PURE__ */ p.jsxs(ke, { ...Ye, disabled: s, children: [
+            /* @__PURE__ */ p.jsxs(xt, { children: [
+              m ? /* @__PURE__ */ p.jsx(ye, { as: "input", type: "text", ...ce }) : /* @__PURE__ */ p.jsx(ye, { ...ce, children: le }),
+              a ? /* @__PURE__ */ p.jsx(Oe, { iconPlacement: "left", size: ue, children: Le.cloneElement(a, { ...a.props, size: ue }) }) : null,
+              /* @__PURE__ */ p.jsxs(Et, { size: W, children: [
+                Me ? Pe : null,
+                Be
+              ] })
+            ] }),
+            We ? /* @__PURE__ */ p.jsxs(yt, { ...T(), children: [
+              M.reduce(
+                (R, y, de) => {
+                  if (u && "options" in y)
+                    R.itemsToRender.push(
+                      // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+                      // @ts-ignore
+                      /* @__PURE__ */ p.jsxs(Qe, { children: [
+                        je(y),
+                        y.options ? y.options.map((C) => {
+                          const fe = R.itemIndex++, me = q(C.value, k);
+                          return /* @__PURE__ */ p.jsx(
+                            X,
+                            {
+                              allowUnselectFromList: e,
+                              isDisabled: C.disabled,
+                              isHighlighted: Q === fe,
+                              isMultiple: i,
+                              ...g({
+                                index: fe,
+                                isSelected: me,
+                                item: C
+                              }),
+                              children: Y(C, me)
+                            },
+                            C.value
+                          );
+                        }) : null
+                      ] }, y.label)
+                    );
+                  else if ("value" in y) {
+                    const C = q(y.value, k);
+                    R.itemsToRender.push(
+                      /* @__PURE__ */ p.jsx(
+                        X,
+                        {
+                          allowUnselectFromList: e,
+                          isDisabled: y.disabled,
+                          isHighlighted: Q === de,
+                          isMultiple: i,
+                          ...g({
+                            index: de,
+                            isSelected: C,
+                            item: y
+                          }),
+                          children: Y(y, C)
+                        },
+                        y.value
+                      )
+                    );
+                  }
+                  return R;
+                },
+                { itemIndex: 0, itemsToRender: [] }
+              ).itemsToRender,
+              ae && v.length ? /* @__PURE__ */ p.jsx(
+                X,
+                {
+                  isHighlighted: Q === M.length,
+                  ...g({
+                    index: M.length,
+                    item: {
+                      label: v,
+                      value: Se(v)
+                    }
+                  }),
+                  children: we(v)
+                },
+                "add"
+              ) : null
+            ] }) : null,
+            i ? Te(k, Ne) : null
+          ] });
+        }
       }
     );
   }
-), zt = Se;
+), Zt = ke;
 export {
-  Yt as Select,
-  zt as StyledSelect
+  Lt as Select,
+  Zt as StyledSelect
 };