prometeo-design-system 4.2.5 → 4.3.1

package/dist/Select.es.js

@@ -1,10 +1,10 @@
 import { j as a } from "./jsx-runtime-GkKLlHH4.js";
 import { c as d } from "./cn-B6yFEsav.js";
-import Se, { memo as J, useState as Ne, useRef as ae, useMemo as te, useCallback as _, useEffect as he, useImperativeHandle as Qe } from "react";
+import we, { memo as J, useState as Ne, useRef as ae, useMemo as te, useCallback as _, useEffect as he, useImperativeHandle as Qe } from "react";
 import Xe from "./Spinner.es.js";
 import { createPortal as Ye } from "react-dom";
 import { u as Ze } from "./useDragScroll-CHN9OMwn.js";
-import { u as et } from "./useLabelBackground-D5SzHhl_.js";
+import { u as et } from "./useLabelBackground-BDIHUdND.js";
 import { H as tt } from "./HelperComponent-ljsn0xD6.js";
 import { Close as nt } from "./Icons/Close.es.js";
 import rt from "./CheckBox.es.js";
@@ -127,7 +127,7 @@ function ct(e) {
     }
   ), je = ae(null), pe = ae(/* @__PURE__ */ new Set()), {
     id: G,
-    name: S,
+    name: w,
     label: ge,
     height: be,
     options: Q,
@@ -242,7 +242,7 @@ function ct(e) {
         if (!m) return;
         const z = l.has(m.id), A = o ?? "toggle";
         let T;
-        A === "select" || A === "toggle" && !z ? T = m : T = void 0, e.onChange?.(T, S);
+        A === "select" || A === "toggle" && !z ? T = m : T = void 0, e.onChange?.(T, w);
         return;
       }
       const i = e.value || [], f = [];
@@ -253,18 +253,18 @@ function ct(e) {
       const D = new Set(f.map((m) => m.id)), M = new Set(c.map((m) => m.id)), I = c.every(
         (m) => D.has(m.id)
       ), fe = o ?? "toggle", me = fe === "select" || fe === "toggle" && !I;
-      let we;
+      let Se;
       if (!me)
-        we = f.filter((m) => !M.has(m.id));
+        Se = f.filter((m) => !M.has(m.id));
       else {
         const m = new Map(
           f.map((z) => [z.id, z])
         );
         c.forEach((z) => {
           m.set(z.id, z);
-        }), we = Array.from(m.values());
+        }), Se = Array.from(m.values());
       }
-      e.onChange?.(we, S);
+      e.onChange?.(Se, w);
     },
     [
       e.multiple,
@@ -273,14 +273,14 @@ function ct(e) {
       Ce,
       l,
       L,
-      S
+      w
     ]
   ), C = _(() => {
     h((t) => !t);
   }, []);
   B.current = (t) => {
     if (!e.multiple)
-      e.onChange?.(t, S);
+      e.onChange?.(t, w);
     else {
       const o = e.value || [], c = [], i = o.includes(t.value);
       o.forEach((D) => {
@@ -290,37 +290,37 @@ function ct(e) {
         M && c.push(M);
       });
       const f = i ? c.filter((D) => D.value !== t.value) : [...c, t];
-      e.onChange?.(f, S);
+      e.onChange?.(f, w);
     }
   };
-  const w = _(
+  const S = _(
     (t, o = !1) => {
-      q?.(t, S), B.current?.(t), o && (h(!1), ke?.());
+      q?.(t, w), B.current?.(t), o && (h(!1), ke?.());
     },
-    [q, ke, S]
+    [q, ke, w]
   ), x = (t) => {
     if (t.preventDefault(), t.stopPropagation(), t.target.blur(), ye?.(), e.multiple) {
       const o = e.onChange;
-      o?.([], S);
+      o?.([], w);
     } else {
       const o = e.onChange;
-      o?.(void 0, S);
+      o?.(void 0, w);
     }
   }, O = _(
     (t) => {
-      e.multiple || e.onChange?.(void 0, S);
+      e.multiple || e.onChange?.(void 0, w);
       const o = R.find(
         (i) => k(i, N) === t
       );
       if (!o) return;
       const c = L(o);
-      q?.(c, S), B.current?.(c), Oe?.(o);
+      q?.(c, w), B.current?.(c), Oe?.(o);
     },
     [
       q,
       Oe,
       R,
-      S,
+      w,
       e.multiple,
       e.onChange,
       L,
@@ -366,13 +366,13 @@ function ct(e) {
         h(!1);
       },
       toggle: () => h((t) => !t),
-      handleOptionSelect: w,
+      handleOptionSelect: S,
       subscribeOpenChange: (t) => (pe.current.add(t), () => {
         pe.current.delete(t);
       }),
       searchInputRef: P
     }),
-    [n, w]
+    [n, S]
   );
   const ee = (t) => {
     t.preventDefault(), t.stopPropagation(), t.target.matches(":focus-visible") && !Me && !n && (h(!0), setTimeout(() => {
@@ -433,7 +433,7 @@ function ct(e) {
                   "div",
                   {
                     className: d(
-                      "flex-1 overflow-x-auto overflow-y-hidden px-1 prometeo-scrollbar-none! "
+                      "flex-1 overflow-x-auto overflow-y-hidden px-1 prometeo-scrollbar-none "
                     ),
                     ref: Pe,
                     onPointerUp: V.onPointerUp,
@@ -442,7 +442,7 @@ function ct(e) {
                     onPointerLeave: V.onPointerLeave,
                     onPointerCancel: V.onPointerCancel,
                     onClickCapture: V.onClickCapture,
-                    children: De ? Se.createElement(
+                    children: De ? we.createElement(
                       J(
                         De,
                         (t, o) => t.disabled === o.disabled && t.multiple === o.multiple
@@ -540,7 +540,7 @@ function ct(e) {
             dropdownRef: p,
             selectButtonRef: W,
             helperComponentRef: je,
-            onOptionClick: w,
+            onOptionClick: S,
             onCloseDropdown: () => h(!1),
             searchValue: _e,
             setSearchValue: b,
@@ -589,7 +589,7 @@ function ft({
   labelVariant: je,
   emptyMessage: pe,
   renderOption: G,
-  renderOptionContext: S,
+  renderOptionContext: w,
   renderOptionGroupHeader: ge,
   onOptionClick: be,
   onSearchClear: Q,
@@ -646,8 +646,8 @@ function ft({
   }, ue = () => {
     if (!p.current || !b.current) return ie;
     const r = b.current.getBoundingClientRect(), l = window.innerHeight - (window.innerHeight - r.top), s = window.innerHeight - r.bottom, u = s >= le, C = l >= le;
-    let w = "down", x;
-    return u ? (w = "down", x = le) : C ? (w = "up", x = le) : s > l ? (w = "down", x = s - 16) : (w = "up", x = l - 16), { direction: w, height: x };
+    let S = "down", x;
+    return u ? (S = "down", x = le) : C ? (S = "up", x = le) : s > l ? (S = "down", x = s - 16) : (S = "up", x = l - 16), { direction: S, height: x };
   }, $e = (r) => {
     if (!(!p.current || !b.current)) {
       if (p.current.style.transition = "max-height 0.2s ease,opacity 0.2s ease", !r) {
@@ -695,18 +695,18 @@ function ft({
     }
     const s = [];
     let u = null, C = [];
-    const w = () => {
+    const S = () => {
       u && C.length > 0 && s.push(u, ...C), u = null, C = [];
     };
     return r.forEach((x) => {
       if (typeof x != "object" || x === null) return;
       if ((x || {})?.isGroupHeader) {
-        w(), u = x;
+        S(), u = x;
         return;
       }
       const O = Fe(x.label, l);
       u ? O && C.push(x) : O && s.push(x);
-    }), w(), s;
+    }), S(), s;
   }, _e = (r) => {
     const l = Ge(y, r);
     if (U(l), j) {
@@ -769,7 +769,7 @@ function ft({
       F.current?.focus(), se();
     }, 10);
   }, Ce = Array.from({ length: 5 }).map(
-    (r, l) => G ? Se.createElement(
+    (r, l) => G ? we.createElement(
       J(G, (s, u) => s.isSelected === u.isSelected && s.option === u.option && s.disabled === u.disabled && s.multiple === u.multiple && s.renderContext === u.renderContext),
       {
         key: `skeleton-option-${l}`,
@@ -780,7 +780,7 @@ function ft({
         },
         disabled: !1,
         isLoading: !0,
-        renderContext: S
+        renderContext: w
       }
     ) : /* @__PURE__ */ a.jsx(
       Ke,
@@ -807,13 +807,13 @@ function ft({
         N ? "absolute z-50 " : "fixed z-100 top-0 left-0",
         ie.direction === "up" ? "h-auto" : " h-max",
         ze,
-        "w-full max-w-[max(100%,20vw)] min-w-[min(100%,20vw)]"
+        "min-w-max"
       ),
       children: /* @__PURE__ */ a.jsxs(
         "div",
         {
           className: d(
-            "flex flex-col",
+            "flex flex-col ",
             xe ? "p-0" : "p-2 pt-0 gap-2"
           ),
           style: {
@@ -842,10 +842,10 @@ function ft({
                 ...H
               }
             ),
-            /* @__PURE__ */ a.jsx("div", { className: " overflow-y-auto flex-1 max-h-max  ", children: oe.length === 0 ? X ? /* @__PURE__ */ a.jsx("div", { className: "flex flex-col gap-1 overflow-hidden w-full", children: De || Ce }) : /* @__PURE__ */ a.jsx("p", { className: "px-3 py-2 text-neutral-medium-default max-w-full text-pretty wrap-break-word ", children: B ? `No se encontraron resultados para "${B}"` : pe }) : (() => {
+            /* @__PURE__ */ a.jsx("div", { className: " overflow-y-auto flex-1 max-h-max ", children: oe.length === 0 ? X ? /* @__PURE__ */ a.jsx("div", { className: "flex flex-col gap-1 overflow-hidden w-full", children: De || Ce }) : /* @__PURE__ */ a.jsx("div", { className: "px-3 py-2 text-neutral-medium-default", children: B ? `No se encontraron resultados para "${B}"` : pe }) : (() => {
               let r = !0;
               return oe.map((l) => {
-                const s = l, u = !!(s || {}).isGroupHeader, C = G && !u ? k(l, W) : s.id, w = re.has(C), x = (i) => !G || u ? i : {
+                const s = l, u = !!(s || {}).isGroupHeader, C = G && !u ? k(l, W) : s.id, S = re.has(C), x = (i) => !G || u ? i : {
                   id: C,
                   label: String(k(i, P)),
                   value: k(i, W)
@@ -871,7 +871,7 @@ function ft({
                         onKeyDown: (M) => R(M, f),
                         className: d(
                           !D && !v && "focus-visible:bg-neutral-medium-hover outline-none hover:bg-neutral-medium-hover",
-                          w && "bg-neutral-medium-selected",
+                          S && "bg-neutral-medium-selected",
                           v && "cursor-default pointer-events-none"
                         ),
                         children: i
@@ -887,14 +887,14 @@ function ft({
                     q && Le(f, m);
                   }, me = (m) => {
                     !I || I.length === 0 || ye && ye(I, m);
-                  }, we = I.filter(
+                  }, Se = I.filter(
                     (m) => re.has(k(m, W))
                   ).map((m) => String(k(m, W)));
                   if (ge) {
                     const m = J(
                       ge,
                       (A, T) => A.label === T.label && A.group === T.group && A.groupOptions === T.groupOptions && A.disabled === T.disabled && A.multiple === T.multiple && A.expanded === T.expanded && A.renderContext === T.renderContext
-                    ), z = Se.createElement(m, {
+                    ), z = we.createElement(m, {
                       group: M,
                       label: i,
                       groupOptions: I,
@@ -903,8 +903,8 @@ function ft({
                       expanded: D,
                       toggleGroup: fe,
                       selectGroup: me,
-                      renderContext: S,
-                      groupSelectedIds: we
+                      renderContext: w,
+                      groupSelectedIds: Se
                     });
                     return ee(z, s);
                   }
@@ -931,7 +931,7 @@ function ft({
                     s
                   );
                 }
-                const de = G ? Se.createElement(
+                const de = G ? we.createElement(
                   J(
                     G,
                     (i, f) => i.isSelected === f.isSelected && i.option === f.option && i.disabled === f.disabled && i.multiple === f.multiple && i.renderContext === f.renderContext
@@ -939,12 +939,12 @@ function ft({
                   {
                     key: C,
                     option: l,
-                    isSelected: w,
+                    isSelected: S,
                     multiple: g,
                     onSelect: O,
                     disabled: v,
                     isLoading: X,
-                    renderContext: S
+                    renderContext: w
                   }
                 ) : /* @__PURE__ */ a.jsx(
                   Ke,
@@ -952,7 +952,7 @@ function ft({
                     disabled: v,
                     multiple: g,
                     isLoading: X,
-                    isSelected: w,
+                    isSelected: S,
                     onSelect: Z,
                     option: l
                   },
@@ -964,7 +964,7 @@ function ft({
                 if (!q)
                   return t;
                 const o = !r, c = t;
-                return Se.cloneElement(c, {
+                return we.cloneElement(c, {
                   className: d(
                     c.props.className,
                     "overflow-hidden transition-[max-height] duration-300 ease-out",
@@ -1039,7 +1039,7 @@ const Je = J(
     multiple: g,
     className: v,
     disabled: b
-  }) => e?.length === 0 ? n ? /* @__PURE__ */ a.jsx("span", { className: "text-neutral-medium-default line-clamp-1", children: n }) : null : y === "chips" && g ? /* @__PURE__ */ a.jsx("div", { className: d("flex items-center gap-1 ", v), children: e.map((H) => /* @__PURE__ */ a.jsx(
+  }) => e?.length === 0 ? n ? /* @__PURE__ */ a.jsx("span", { className: "text-neutral-medium-default opacity-50 line-clamp-1", children: n }) : null : y === "chips" && g ? /* @__PURE__ */ a.jsx("div", { className: d("flex items-center gap-1 ", v), children: e.map((H) => /* @__PURE__ */ a.jsx(
     it,
     {
       tabIndex: -1,

package/dist/SelectSearch.es.js

@@ -1,117 +1,117 @@
 import { j as Y } from "./jsx-runtime-GkKLlHH4.js";
 import { g as i } from "./utils-X4-h3cum.js";
-import { useState as A, useRef as E, useEffect as b, useMemo as ee, useCallback as ne } from "react";
+import { useState as A, useRef as E, useEffect as b, useMemo as ee, useCallback as te } from "react";
 import Z from "./Select.es.js";
 function re(e) {
   const {
-    options: C,
+    options: p,
     fetcher: d,
     asyncMode: _ = "fetch_in_open",
     disabled: w = !1,
     debounceDelay: P = 500,
     minCharacters: T = 3,
     optionLabel: h,
-    optionValue: c,
+    optionValue: s,
     controlledValue: f,
     isOpen: F,
-    inputRef: p,
+    inputRef: y,
     name: I
-  } = e || {}, M = C ? C.filter((n) => n != null) : [], [V, g] = A(M || []), [D, k] = A(M || []), [s, N] = A(""), [W, v] = A(!1), [J, U] = A(!1), l = E(null), O = E(null), m = E(!1), S = E(d), L = e?.multiple === !0 || !1, j = E(L ? [] : void 0), [a, y] = A(L ? [] : void 0);
+  } = e || {}, M = p ? p.filter((t) => t != null) : [], [V, g] = A(M || []), [D, k] = A(M || []), [c, N] = A(""), [W, C] = A(!1), [J, U] = A(!1), l = E(null), O = E(null), m = E(!1), L = E(d), S = e?.multiple === !0 || !1, j = E(S ? [] : void 0), [a, v] = A(S ? [] : void 0);
   b(() => {
-    S.current = d;
+    L.current = d;
   }, [d]), b(() => {
-    if (L) {
-      const n = z(f, "value");
-      y(n);
+    if (S) {
+      const t = z(f, "value");
+      v(t);
     } else
-      f != null ? y(f) : y(void 0);
+      f != null ? v(f) : v(void 0);
   }, [f]), b(() => {
     j.current = f !== void 0 ? f : a;
   }, [f, a]), b(() => {
     if (e?.options) {
-      const n = e.options.filter((t) => t != null);
-      g(n), k(n);
+      const t = e.options.filter((n) => n != null);
+      g(t), k(t);
     }
   }, [e?.options]);
-  const B = ee(() => (n, t) => new Promise((o, r) => {
-    l.current && clearTimeout(l.current), l.current = setTimeout(() => n(s).then(o).catch(r), t);
-  }), [s]), te = (n) => {
-    const t = f !== void 0, o = (r) => c ? i(r, c) : i(r, "id");
+  const B = ee(() => (t, n) => new Promise((o, r) => {
+    l.current && clearTimeout(l.current), l.current = setTimeout(() => t(c).then(o).catch(r), n);
+  }), [c]), ne = (t) => {
+    const n = f !== void 0, o = (r) => s ? i(r, s) : i(r, "id");
     if (e?.multiple === !0) {
       const r = j.current || [];
       let u;
-      r.some((x) => o(x) === o(n)) ? u = r.filter((x) => o(x) !== o(n)) : u = [...r, n], t ? (j.current = u, e?.onChange?.(u, I)) : (j.current = u, y(u), e?.onChange?.(u, I));
+      r.some((x) => o(x) === o(t)) ? u = r.filter((x) => o(x) !== o(t)) : u = [...r, t], n ? (j.current = u, e?.onChange?.(u, I)) : (j.current = u, v(u), e?.onChange?.(u, I));
     } else
-      t ? (j.current = n, e?.onChange?.(n, I)) : (j.current = n, y(n), e?.onChange?.(n, I));
-  }, q = (n) => (e?.onFetchingStart?.(), S.current?.(n) || Promise.resolve([])), z = (n, t) => Array.isArray(n) ? (n.some((o) => typeof o != "object" || o === null) && console.debug(`El valor del ${t || "resultado del fetcher"} contiene elementos no válidos (null,undefined, no-object)`, n), n?.filter((o) => o != null) || []) : (console.debug(`El valor del ${t || "resultado del fetcher"} no es un Array (tipo de dato obtenido: ${typeof n})`), []), $ = ne((n, t) => n.length === 0 ? t : c ? t.filter((o) => !n.some((r) => i(r, c) === i(o, c))) : t.filter((o) => !n.some((r) => i(r, "id") === i(o, "id"))), [c]);
+      n ? (j.current = t, e?.onChange?.(t, I)) : (j.current = t, v(t), e?.onChange?.(t, I));
+  }, q = (t) => (e?.onFetchingStart?.(), L.current?.(t) || Promise.resolve([])), z = (t, n) => Array.isArray(t) ? (t.some((o) => typeof o != "object" || o === null) && console.debug(`El valor del ${n || "resultado del fetcher"} contiene elementos no válidos (null,undefined, no-object)`, t), t?.filter((o) => o != null) || []) : (console.debug(`El valor del ${n || "resultado del fetcher"} no es un Array (tipo de dato obtenido: ${typeof t})`), []), $ = te((t, n) => t.length === 0 ? n : s ? n.filter((o) => !t.some((r) => i(r, s) === i(o, s))) : n.filter((o) => !t.some((r) => i(r, "id") === i(o, "id"))), [s]);
   b(() => {
-    const n = e?.subscribeOpenChange;
-    if (!n) return;
-    const t = n((o) => {
+    const t = e?.subscribeOpenChange;
+    if (!t) return;
+    const n = t((o) => {
       U(o);
     });
     return () => {
-      t && t();
+      n && n();
     };
   }, [e?.subscribeOpenChange]);
   const G = F !== void 0 ? F : J;
   b(() => {
-    if (!w && S.current && _ === "fetch_on_type") {
-      if (!s || s === "" || s.length < T) {
-        l.current && clearTimeout(l.current), v(!1);
+    if (!w && L.current && _ === "fetch_on_type") {
+      if (!c || c === "" || c.length < T) {
+        l.current && clearTimeout(l.current), C(!1);
         return;
       }
-      const n = B(q, P);
-      v(!0), n.then((t) => {
-        const o = z(t);
+      const t = B(q, P);
+      C(!0), t.then((n) => {
+        const o = z(n);
         g(o);
       }).finally(() => {
-        v(!1), e?.onFetchingEnd?.();
+        C(!1), e?.onFetchingEnd?.();
       });
     }
-  }, [_, s, w, P, B, T]), b(() => {
+  }, [_, c, w, P, B, T]), b(() => {
     if (!w)
       if (G) {
         if (e?.onOpen?.(), _ === "fetch_in_open") {
-          if (!S.current)
+          if (!L.current)
             return;
-          v(!0), q().then((n) => {
-            const t = z(n);
+          C(!0), q().then((t) => {
+            const n = z(t);
             g(() => {
-              const o = t.filter((r) => {
-                if (c)
-                  return i(r, c) !== void 0;
+              const o = n.filter((r) => {
+                if (s)
+                  return i(r, s) !== void 0;
               });
-              return L && a.length > 0 ? [...$(a, o), ...a] : o;
+              return S && a.length > 0 ? [...$(a, o), ...a] : o;
             });
           }).finally(() => {
-            v(!1), e?.onFetchingEnd?.();
+            C(!1), e?.onFetchingEnd?.();
           });
         }
       } else
         e?.onClose?.();
   }, [G, _, w]);
-  const H = (n, t) => n?.filter((o) => {
+  const H = (t, n) => t?.filter((o) => {
     if (h)
-      return i(o, h)?.toLowerCase().includes(t.toLowerCase());
+      return i(o, h)?.toLowerCase().includes(n.toLowerCase());
     {
       const r = o;
       switch (typeof r) {
         case "string":
-          return r?.toLowerCase().includes(t.toLowerCase());
+          return r?.toLowerCase().includes(n.toLowerCase());
         case "number":
-          return r.toString().includes(t);
+          return r.toString().includes(n);
         case "object":
-          return Object.values(r).some((R) => R.toString()?.toLowerCase().includes(t.toLowerCase()));
+          return Object.values(r).some((R) => R.toString()?.toLowerCase().includes(n.toLowerCase()));
         default:
           return !1;
       }
     }
-  }) || [], oe = (n) => n?.sort((t, o) => {
+  }) || [], oe = (t) => t?.sort((n, o) => {
     if (h)
-      return i(t, h) < i(o, h) ? -1 : 1;
+      return i(n, h) < i(o, h) ? -1 : 1;
     {
-      const u = ["label", "name", "value"].find((K) => typeof t == "object" && Object.keys(t).includes(K)), R = t, x = o;
+      const u = ["label", "name", "value"].find((K) => typeof n == "object" && Object.keys(n).includes(K)), R = n, x = o;
       switch (typeof R) {
         case "string":
           return R < x ? -1 : 1;
@@ -119,7 +119,7 @@ function re(e) {
           return R < x ? -1 : 1;
         case "object":
           if (u) {
-            const K = i(t, u), le = i(o, u);
+            const K = i(n, u), le = i(o, u);
             return K < le ? -1 : 1;
           } else
             return 1;
@@ -127,21 +127,21 @@ function re(e) {
           return 1;
       }
     }
-  }) || [], Q = (n) => {
-    const t = typeof p == "function" ? p() : p;
-    n.target === t?.current && (O.current && clearTimeout(O.current), m.current || (m.current = !0, e?.onTypeStart?.()), O.current = setTimeout(() => {
+  }) || [], Q = (t) => {
+    const n = typeof y == "function" ? y() : y;
+    t.target === n?.current && (O.current && clearTimeout(O.current), m.current || (m.current = !0, e?.onTypeStart?.()), O.current = setTimeout(() => {
       m.current = !1;
     }, P));
   };
   b(() => {
-    if (s === "")
+    if (c === "")
       k(oe(V));
-    else if (L) {
-      const n = $(a, V);
-      k([...H(n, s), ...a]);
+    else if (S) {
+      const t = $(a, V);
+      k([...H(t, c), ...a]);
     } else {
-      const n = $([a], V);
-      k([...H(n, s), a]);
+      const t = $([a], V);
+      k([...H(t, c), a]);
     }
   }, [V]), b(() => (document.addEventListener("keydown", Q), () => {
     document.removeEventListener("keydown", Q);
@@ -150,31 +150,31 @@ function re(e) {
     N("");
   };
   return {
-    inputValue: s,
+    inputValue: c,
     setInputValue: N,
     cleanInputValue: X,
     cleanOptions: () => {
-      if (L)
+      if (S)
         g(a);
       else {
-        const n = a;
-        g(n ? [n] : []);
+        const t = a;
+        g(t ? [t] : []);
       }
       X();
     },
     clearValue: () => {
-      y(L ? [] : void 0);
+      v(S ? [] : void 0);
     },
     filteredOptions: D,
     isLoading: W,
     value: a,
-    setValue: y,
-    onOptionClick: te
+    setValue: v,
+    onOptionClick: ne
   };
 }
 const he = (e) => {
-  const C = E(null), { asyncMode: d = "fetch_in_open" } = e, _ = (l, O, m) => {
-    const S = {
+  const p = E(null), { asyncMode: d = "fetch_in_open" } = e, _ = (l, O, m) => {
+    const L = {
       options: l.options,
       fetcher: l.fetcher,
       asyncMode: O,
@@ -194,36 +194,36 @@ const he = (e) => {
       name: l.name
     };
     return l.multiple ? {
-      ...S,
+      ...L,
       multiple: !0,
       controlledValue: l.value,
       onChange: l.onChange
     } : {
-      ...S,
+      ...L,
       multiple: !1,
       controlledValue: l.value,
       onChange: l.onChange
     };
-  }, { inputValue: w, setInputValue: P, filteredOptions: T, isLoading: h, value: c, onOptionClick: f, cleanInputValue: F, cleanOptions: p, clearValue: I } = re(_(e, d, C));
+  }, { inputValue: w, setInputValue: P, filteredOptions: T, isLoading: h, value: s, onOptionClick: f, cleanInputValue: F, cleanOptions: y, clearValue: I } = re(_(e, d, p));
   b(() => {
-    !e.controls || !C.current || (e.controls.current = {
-      ...C.current,
+    !e.controls || !p.current || (e.controls.current = {
+      ...p.current,
       cleanOptions: () => {
-        p();
+        y();
       }
     });
-  }, [e.controls, p]);
-  const M = ne(
+  }, [e.controls, y]);
+  const M = te(
     () => d === "fetch_on_type" ? h : !1,
     [d, h]
-  ), V = ee(() => e.multiple ? c.map((l) => i(l, e.optionValue)) : c ? i(c, e.optionValue) : void 0, [c, e.optionValue, e.multiple]), g = (l) => {
+  ), V = ee(() => e.multiple ? s.map((l) => i(l, e.optionValue)) : s ? i(s, e.optionValue) : void 0, [s, e.optionValue, e.multiple]), g = (l) => {
     const O = T.find((m) => i(m, e.optionValue) === l.id);
     O && f(O);
-  }, { displayMode: D = e.multiple ? "chips" : "compact", dropdownOptions: k, overflow: s = "scroll", onChange: N, onClear: W, ...v } = e.selectComponentProps || {}, J = {
+  }, { displayMode: D = e.multiple ? "chips" : "compact", dropdownOptions: k, overflow: c = "scroll", onChange: N, onClear: W, ...C } = e.selectComponentProps || {}, J = {
     controledSearchValue: w,
     onSearchValueChange: d === "fetch_on_type" ? P : void 0,
     onSearchClear: d === "fetch_on_type" ? () => {
-      F(), p();
+      F(), y();
     } : void 0,
     inputSearchPlaceholder: e.inputSearchPlaceholder,
     isLoading: M(),
@@ -238,8 +238,8 @@ const he = (e) => {
       disabled: e.disabled,
       className: e.className,
       name: e.name,
-      overflow: s,
-      ...v,
+      overflow: c,
+      ...C,
       onClear: e?.selectComponentProps?.onClear && U,
       multiple: !0,
       value: V,
@@ -248,10 +248,9 @@ const he = (e) => {
       optionValue: e.optionValue,
       optionLabel: e.optionLabel,
       renderOption: e.renderOption,
-      renderSelection: e.renderSelection,
       onOptionClick: g,
       displayMode: D,
-      controls: C,
+      controls: p,
       emptyMessage: "Use el buscador para obtener las opciones disponibles",
       dropdownOptions: J,
       isLoading: d === "fetch_in_open" ? h : !1
@@ -260,10 +259,10 @@ const he = (e) => {
     Z,
     {
       disabled: e.disabled,
-      ...v,
+      ...C,
       onClear: U,
       className: e.className,
-      overflow: s,
+      overflow: c,
       name: e.name,
       multiple: !1,
       value: V,
@@ -272,10 +271,9 @@ const he = (e) => {
       optionValue: e.optionValue,
       optionLabel: e.optionLabel,
       renderOption: e.renderOption,
-      renderSelection: e.renderSelection,
       onOptionClick: g,
       displayMode: "compact",
-      controls: C,
+      controls: p,
       emptyMessage: "Use el buscador para obtener las opciones disponibles",
       dropdownOptions: J,
       isLoading: d === "fetch_in_open" ? h : !1