prometeo-design-system 2.7.6 → 2.7.8

package/dist/{Input-60IT1aGF.js → Input-D6as6xD-.js}

@@ -1,11 +1,11 @@
 import { j as r } from "./jsx-runtime-DKDX3adD.js";
-import { Icons as z } from "./Icons.es.js";
 import { c as t } from "./cn-B6yFEsav.js";
-import { useRef as q, useLayoutEffect as V, memo as F, forwardRef as ee, useState as te } from "react";
-import re from "./Spinner.es.js";
-import { H as oe } from "./HelperComponent-U6mPwuDH.js";
-import le from "./Button.es.js";
-const se = (o) => {
+import { useRef as _, useLayoutEffect as q, memo as V, forwardRef as F, useState as ee } from "react";
+import te from "./Spinner.es.js";
+import { H as re } from "./HelperComponent-BeNlTMqI.js";
+import oe from "./Button.es.js";
+import { EyeVisibility as le, EyeVisibilityOff as se, Close as ae } from "./Icons.es.js";
+const ne = (o) => {
   let e = o;
   for (; e && e !== document.body; ) {
     const n = window.getComputedStyle(e).backgroundColor;
@@ -16,11 +16,11 @@ const se = (o) => {
   const l = window.getComputedStyle(document.body).backgroundColor;
   return l && l !== "transparent" && l !== "rgba(0, 0, 0, 0)" ? l : "rgb(255, 255, 255)";
 };
-function ae() {
-  const o = q(null);
-  return V(() => {
+function ue() {
+  const o = _(null);
+  return q(() => {
     if (!o.current || !o.current.parentElement) return;
-    const e = se(o.current.parentElement);
+    const e = ne(o.current.parentElement);
     o.current.style.backgroundColor = e;
   }, []), {
     ref: o
@@ -60,12 +60,12 @@ const b = {
     label: t("text-success", "peer-focus:text-success-light"),
     icon: t("text-success-light", "peer-focus:text-success-light")
   }
-}, S = ee(
+}, S = F(
   ({
     label: o,
     icon: e,
     iconPosition: l = "left",
-    onChange: C,
+    onChange: z,
     value: n,
     name: g,
     width: m = "100%",
@@ -78,19 +78,19 @@ const b = {
     isFetching: f,
     errorComponent: h,
     helperComponent: w,
-    placeholder: $,
-    required: N = !1,
-    onFocus: k,
-    onBlur: B,
-    onKeyDown: L,
-    onKeyUp: R,
-    className: P,
-    style: D,
-    readOnly: A = !1,
-    onClear: v,
-    ...E
-  }, M) => {
-    const [y, O] = te(!1), { ref: T } = ae();
+    placeholder: I,
+    required: C = !1,
+    onFocus: $,
+    onBlur: k,
+    onKeyDown: B,
+    onKeyUp: L,
+    className: R,
+    style: P,
+    readOnly: D = !1,
+    onClear: N,
+    ...v
+  }, A) => {
+    const [y, M] = ee(!1), { ref: O } = ue();
     let p = H;
     u && (p = "customHeight");
     const d = {
@@ -122,11 +122,11 @@ const b = {
         label: "text-sm peer-focus:text-sm peer-placeholder-shown:text-xs ",
         icon: "w-6 h-6 right-3"
       }
-    }, G = () => {
-      O(!y);
+    }, T = () => {
+      M(!y);
     }, j = {};
     m && m !== "100%" && (j.width = m), u && (j.height = u);
-    const I = c === "error" && h, J = !I && w, K = s === "password", Q = () => a === "static" ? "-top-1 -translate-y-full left-0 pl-3" : e ? `${i ? "peer-placeholder-shown:top-[calc(50%-12px)]" : "peer-placeholder-shown:top-1/2"} -translate-y-1/2 peer-focus:top-0 peer-focus:left-3 peer-focus:px-1 peer-focus:ml-0 peer-focus:mr-0 ${l === "left" ? "peer-placeholder-shown:ml-6" : "peer-placeholder-shown:mr-6"}` : `${i ? "peer-placeholder-shown:top-[calc(50%-12px)]" : "peer-placeholder-shown:top-1/2"} -translate-y-1/2 peer-focus:top-0 peer-focus:left-3 peer-focus:px-1`, U = () => u ? d.customHeight.label : d[p].label, W = () => u ? { height: u } : {}, X = () => a === "default" ? o : $ || o || "", Y = () => K ? e ? l === "left" ? "pl-10 pr-10" : "pr-16" : "pr-10" : e ? l === "left" ? "pl-10 pr-3" : "pr-10 pl-3" : "", Z = a === "default" && "transition-all duration-200 ease-in-out", i = h || w;
+    const E = c === "error" && h, G = !E && w, J = s === "password", K = () => a === "static" ? "-top-1 -translate-y-full left-0 pl-3" : e ? `${i ? "peer-placeholder-shown:top-[calc(50%-12px)]" : "peer-placeholder-shown:top-1/2"} -translate-y-1/2 peer-focus:top-0 peer-focus:left-3 peer-focus:px-1 peer-focus:ml-0 peer-focus:mr-0 ${l === "left" ? "peer-placeholder-shown:ml-6" : "peer-placeholder-shown:mr-6"}` : `${i ? "peer-placeholder-shown:top-[calc(50%-12px)]" : "peer-placeholder-shown:top-1/2"} -translate-y-1/2 peer-focus:top-0 peer-focus:left-3 peer-focus:px-1`, Q = () => u ? d.customHeight.label : d[p].label, U = () => u ? { height: u } : {}, W = () => a === "default" ? o : I || o || "", X = () => J ? e ? l === "left" ? "pl-10 pr-10" : "pr-16" : "pr-10" : e ? l === "left" ? "pl-10 pr-3" : "pr-10 pl-3" : "", Y = a === "default" && "transition-all duration-200 ease-in-out", i = h || w;
     return /* @__PURE__ */ r.jsxs(
       "div",
       {
@@ -136,18 +136,18 @@ const b = {
           !m && "w-full",
           "bg-inherit",
           a === "static" && "mt-2",
-          P
+          R
         ),
-        style: { ...D, ...j },
+        style: { ...P, ...j },
         children: [
           /* @__PURE__ */ r.jsx(
             "input",
             {
               id: g,
               name: g,
-              ref: M,
+              ref: A,
               value: n,
-              placeholder: X(),
+              placeholder: W(),
               type: s === "password" && y ? "text" : s,
               className: t(
                 "peer w-full border rounded-lg bg-transparent appearance-none transition-all duration-200 ease-in-out",
@@ -159,33 +159,33 @@ const b = {
                 e && "pr-10",
                 x && "bg-transparent opacity-60 border-neutral-strong-default text-neutral-medium-disabled",
                 b[c].container,
-                Y()
+                X()
               ),
-              style: W(),
-              onChange: C,
-              onFocus: k,
-              onBlur: B,
+              style: U(),
+              onChange: z,
+              onFocus: $,
+              onBlur: k,
               disabled: x,
-              required: N,
-              onKeyDown: L,
-              onKeyUp: R,
-              defaultValue: E.defaultValue,
-              readOnly: A,
-              ...E
+              required: C,
+              onKeyDown: B,
+              onKeyUp: L,
+              defaultValue: v.defaultValue,
+              readOnly: D,
+              ...v
             }
           ),
           /* @__PURE__ */ r.jsx(
             "label",
             {
-              ref: T,
+              ref: O,
               htmlFor: g,
               className: t(
                 "absolute left-3 pointer-events-none px-1 z-10",
-                Z,
-                U(),
-                b[c].label,
+                Y,
                 Q(),
-                N && "after:content-['*'] after:text-error-default after:ml-1",
+                b[c].label,
+                K(),
+                C && "after:content-['*'] after:text-error-default after:ml-1",
                 x && "text-neutral-medium-disabled prometeo-fonts-label-large"
               ),
               children: o
@@ -203,17 +203,17 @@ const b = {
                 s === "password" && !f ? "cursor-pointer" : "pointer-events-none",
                 l === "right" ? "right-3" : "left-3"
               ),
-              onClick: s === "password" && !f ? G : void 0,
-              onMouseDown: (_) => s === "password" && !f && _.preventDefault(),
+              onClick: s === "password" && !f ? T : void 0,
+              onMouseDown: (Z) => s === "password" && !f && Z.preventDefault(),
               children: /* @__PURE__ */ r.jsxs("div", { children: [
-                f && s !== "password" && /* @__PURE__ */ r.jsx("div", { children: /* @__PURE__ */ r.jsx(re, { size: 24, color: "#7c86ff", loading: !0, variant: "clip" }) }),
-                s === "password" && (y ? /* @__PURE__ */ r.jsx(z.EyeVisibility, { size: 24, className: "" }) : /* @__PURE__ */ r.jsx(z.EyeVisibilityOff, { size: 24, className: "" })),
+                f && s !== "password" && /* @__PURE__ */ r.jsx("div", { children: /* @__PURE__ */ r.jsx(te, { size: 24, color: "#7c86ff", loading: !0, variant: "clip" }) }),
+                s === "password" && (y ? /* @__PURE__ */ r.jsx(le, { size: 24, className: "" }) : /* @__PURE__ */ r.jsx(se, { size: 24, className: "" })),
                 e
               ] })
             }
           ),
-          v && /* @__PURE__ */ r.jsx(
-            le,
+          N && /* @__PURE__ */ r.jsx(
+            oe,
             {
               type: "button",
               color: "secondary",
@@ -227,14 +227,14 @@ const b = {
               ),
               label: "",
               disabled: x,
-              onClick: v,
+              onClick: N,
               variant: "text",
               animateIcon: !1,
-              icon: /* @__PURE__ */ r.jsx(z.Close, { size: 20, className: "" })
+              icon: /* @__PURE__ */ r.jsx(ae, { size: 20, className: "" })
             }
           ),
-          i && /* @__PURE__ */ r.jsx("div", { className: "min-h-6", children: (I || J) && /* @__PURE__ */ r.jsx(
-            oe,
+          i && /* @__PURE__ */ r.jsx("div", { className: "min-h-6", children: (E || G) && /* @__PURE__ */ r.jsx(
+            re,
             {
               className: "absolute ",
               variant: c,
@@ -247,8 +247,8 @@ const b = {
   }
 );
 S.displayName = "Input";
-const me = F(S);
+const be = V(S);
 export {
-  me as I,
-  ae as u
+  be as I,
+  ue as u
 };

package/dist/Input.es.js

@@ -1,4 +1,4 @@
-import { I as f } from "./Input-60IT1aGF.js";
+import { I as f } from "./Input-D6as6xD-.js";
 export {
   f as default
 };

package/dist/InputFormik.es.js

@@ -1,38 +1,38 @@
 import { j as e } from "./jsx-runtime-DKDX3adD.js";
+import { EyeVisibility as O, EyeVisibilityOff as q } from "./Icons.es.js";
 import { c as s } from "./cn-B6yFEsav.js";
-import { FastField as q, ErrorMessage as G } from "formik";
-import { memo as H, useState as I, useRef as J, useCallback as y, useLayoutEffect as Q } from "react";
-import { Icons as N } from "./Icons.es.js";
-const W = ({
+import { FastField as G, ErrorMessage as H } from "formik";
+import { memo as J, useState as N, useRef as Q, useCallback as y, useLayoutEffect as W } from "react";
+const X = ({
   icon: t,
   iconPosition: r = "left",
   label: d,
   className: B,
-  containerClassName: R,
+  containerClassName: I,
   id: w,
   type: j = "text",
   labelVariant: n = "default",
   placeholder: p,
   disabled: b = !1,
   field: l,
-  innerRef: $,
-  form: z,
+  innerRef: R,
+  form: $,
   ...a
 }) => {
-  const [o, v] = I(!1), [C, K] = I(!1), i = J(null), F = z.getFieldMeta(l.name), k = F.touched && F.error, E = l.value && l.value.toString().length > 0, x = j === "password", M = x ? C ? "text" : "password" : j, P = () => n === "static" ? p || d : p || "", A = () => x ? t ? r === "left" ? "pl-10 pr-10" : "pr-16" : "pr-10" : t ? r === "left" ? "pl-10" : "pr-10" : "", D = y(() => {
+  const [o, v] = N(!1), [C, z] = N(!1), i = Q(null), F = $.getFieldMeta(l.name), k = F.touched && F.error, E = l.value && l.value.toString().length > 0, x = j === "password", K = x ? C ? "text" : "password" : j, M = () => n === "static" ? p || d : p || "", P = () => x ? t ? r === "left" ? "pl-10 pr-10" : "pr-16" : "pr-10" : t ? r === "left" ? "pl-10" : "pr-10" : "", A = y(() => {
     v(!0), a.onFocus?.();
-  }, [a]), T = y(
+  }, [a]), D = y(
     (c) => {
       v(!1), a.onBlur?.(), l.onBlur(c);
     },
     [l, a]
-  ), U = y(() => {
-    K((c) => !c);
+  ), T = y(() => {
+    z((c) => !c);
   }, []);
-  Q(() => {
+  W(() => {
     if (i.current) {
-      const L = ((O) => {
-        let u = O;
+      const V = ((L) => {
+        let u = L;
         for (; u && u !== document.body; ) {
           const f = window.getComputedStyle(u).backgroundColor;
           if (f && f !== "transparent" && f !== "rgba(0, 0, 0, 0)")
@@ -44,7 +44,7 @@ const W = ({
       })(
         i.current.parentElement
       );
-      i.current.style.backgroundColor = L;
+      i.current.style.backgroundColor = V;
     }
   }, []);
   const g = {
@@ -78,7 +78,7 @@ const W = ({
       icon: {},
       placeholder: {}
     }
-  }, V = {
+  }, U = {
     none: {
       label: "left-2 "
     },
@@ -104,7 +104,7 @@ const W = ({
       className: s(
         "relative w-full bg-inherit",
         n === "static" && "mt-5",
-        R
+        I
       ),
       children: [
         /* @__PURE__ */ e.jsxs("div", { className: "relative bg-inherit", children: [
@@ -113,25 +113,25 @@ const W = ({
             {
               disabled: b,
               id: w || l.name,
-              type: M,
+              type: K,
               name: l.name,
               value: l.value || "",
-              placeholder: P(),
+              placeholder: M(),
               onChange: l.onChange,
-              onFocus: D,
+              onFocus: A,
               onEmptied: a.onEmptied,
               onKeyDown: a.onKeyDown,
               onKeyUp: a.onKeyUp,
-              onBlur: T,
+              onBlur: D,
               className: s(
-                "w-full px-3 h-12 text-left border-[1px] rounded-lg transition-all duration-200 ease-in-out text-neutral-default-default",
+                "w-full px-3 h-12 text-left border rounded-lg transition-all duration-200 ease-in-out text-neutral-default-default",
                 "bg-transparent focus:outline-none",
                 S[n].input,
                 g[h].input,
-                A(),
+                P(),
                 B
               ),
-              ref: $
+              ref: R
             }
           ),
           /* @__PURE__ */ e.jsx(
@@ -142,7 +142,7 @@ const W = ({
               className: s(
                 "absolute transition-all duration-200 font-bold text-sm ease-in-out pointer-events-none bg-inherit px-1 z-10",
                 "prometeo-fonts-label-large text-sm",
-                V[t ? r : "none"].label,
+                U[t ? r : "none"].label,
                 S[n].label,
                 g[h].label
               ),
@@ -164,7 +164,7 @@ const W = ({
             "button",
             {
               type: "button",
-              onClick: U,
+              onClick: T,
               className: s(
                 "absolute top-1/2 -translate-y-1/2 p-1 text-neutral-medium-default hover:text-neutral-strong-default",
                 "transition-colors duration-200 focus:outline-none focus:text-primary-default-default",
@@ -173,13 +173,13 @@ const W = ({
               tabIndex: -1,
               disabled: b,
               children: C ? /* @__PURE__ */ e.jsx(
-                N.EyeVisibility,
+                O,
                 {
                   size: 24,
                   className: "text-neutral-default-default"
                 }
               ) : /* @__PURE__ */ e.jsx(
-                N.EyeVisibilityOff,
+                q,
                 {
                   size: 24,
                   className: "text-neutral-default-default"
@@ -189,7 +189,7 @@ const W = ({
           )
         ] }),
         k && /* @__PURE__ */ e.jsx(
-          G,
+          H,
           {
             name: l.name,
             component: "span",
@@ -199,8 +199,8 @@ const W = ({
       ]
     }
   );
-}, X = H(W), ae = (t) => /* @__PURE__ */ e.jsx(q, { name: t.name, children: ({ field: r, form: d }) => /* @__PURE__ */ e.jsx(
-  X,
+}, Y = J(X), re = (t) => /* @__PURE__ */ e.jsx(G, { name: t.name, children: ({ field: r, form: d }) => /* @__PURE__ */ e.jsx(
+  Y,
   {
     ...t,
     field: r,
@@ -209,5 +209,5 @@ const W = ({
   }
 ) });
 export {
-  ae as default
+  re as default
 };

package/dist/InputFormikV2.es.js

@@ -1,7 +1,7 @@
 import { j as i } from "./jsx-runtime-DKDX3adD.js";
 import { FastField as m, getIn as n } from "formik";
 import { memo as s } from "react";
-import { I as d } from "./Input-60IT1aGF.js";
+import { I as d } from "./Input-D6as6xD-.js";
 const f = ({
   field: a,
   form: r,

package/dist/InputMultiple.es.js

@@ -1,13 +1,13 @@
 import { j as r } from "./jsx-runtime-DKDX3adD.js";
-import { Icons as C } from "./Icons.es.js";
+import { Close as Z, Info as T, Error as ee } from "./Icons.es.js";
 import { c as d } from "./cn-B6yFEsav.js";
-import S, { useRef as M, useState as x, useCallback as T, useEffect as ee } from "react";
-const te = ({ label: D, name: K, onChange: f, value: l, icon: V, valueSeparator: w = ",", variant: y = "default", placeholder: U, itemClassName: $, itemIcon: F, helperText: j, errorText: N, disabled: a, onClick: z, className: B, readonly: h, onValueDelete: O, ...q }) => {
-  const o = M(null), E = M(null), [u, n] = x(""), [P, i] = x(0), [A, c] = x(!0), [v, R] = x(!1), [m, p] = x(!1), [k, I] = x(null), g = (e) => {
+import M, { useRef as _, useState as x, useCallback as te, useEffect as re } from "react";
+const se = ({ label: S, name: D, onChange: f, value: l, icon: C, valueSeparator: w = ",", variant: I = "default", placeholder: K, itemClassName: U, itemIcon: V, helperText: j, errorText: N, disabled: a, onClick: F, className: $, readonly: h, onValueDelete: B, ...O }) => {
+  const o = _(null), E = _(null), [u, n] = x(""), [z, i] = x(0), [q, c] = x(!0), [v, P] = x(!1), [m, p] = x(!1), [k, y] = x(null), g = (e) => {
     if (h || !e) return;
     const t = e.selectionStart ?? u.length;
     i(t);
-  }, G = (e) => {
+  }, A = (e) => {
     if (h) return;
     if (e.target.value[e.target.value.length - 1] === w && u.length > 0) {
       const s = u.trim();
@@ -25,17 +25,17 @@ const te = ({ label: D, name: K, onChange: f, value: l, icon: V, valueSeparator:
       n(e.target.value), c(!1);
     }
     g(e.target);
-  }, b = T(() => {
+  }, b = te(() => {
     const e = u.trim();
     if (e.length === 0) {
-      p(!1), n(""), c(!0), i(0), I(null);
+      p(!1), n(""), c(!0), i(0), y(null);
       return;
     }
-    p(!1), k !== null && f(W(l.map((t, s) => s === k ? e : t))), n(""), c(!0), i(0), I(null);
-  }, [k, u, f, l]), H = (e) => {
+    p(!1), k !== null && f(Q(l.map((t, s) => s === k ? e : t))), n(""), c(!0), i(0), y(null);
+  }, [k, u, f, l]), G = (e) => {
     if (!h) {
       if (e.key === "Backspace" && u.length === 0) {
-        if (A) {
+        if (q) {
           const t = l[l.length - 1];
           t && (f(l.filter((s) => s !== t)), n(t), i(t.length));
         } else
@@ -50,27 +50,27 @@ const te = ({ label: D, name: K, onChange: f, value: l, icon: V, valueSeparator:
         }
         t.length > 0 && !l.includes(t) && t !== w && (f([...l, t]), n(""), c(!0), i(0));
       }
-      e.key === "Escape" && m && (p(!1), n(""), c(!0), i(0), I(null)), g(e.currentTarget);
+      e.key === "Escape" && m && (p(!1), n(""), c(!0), i(0), y(null)), g(e.currentTarget);
     }
-  }, J = (e) => {
+  }, H = (e) => {
     const t = l.filter((s) => s !== e);
-    f(t), O?.(e);
+    f(t), B?.(e);
+  }, J = (e) => {
+    h || (L(e), p(!0), n(e), i(e.length), y(l.length - 1), o.current?.focus());
   }, L = (e) => {
-    h || (Q(e), p(!0), n(e), i(e.length), I(l.length - 1), o.current?.focus());
-  }, Q = (e) => {
     const t = l.filter((s) => s !== e);
     f([...t, e]);
-  }, W = (e) => e.filter((t, s, Z) => Z.indexOf(t) === s);
-  ee(() => {
+  }, Q = (e) => e.filter((t, s, Y) => Y.indexOf(t) === s);
+  re(() => {
     o.current && (o.current.onfocus = () => {
-      R(!0);
+      P(!0);
     }, o.current.onblur = () => {
-      R(!1), m && b();
+      P(!1), m && b();
     }), E.current && (E.current.onblur = () => {
       m && b();
     });
   }, [m, b]);
-  const X = {
+  const W = {
     isFocused: {
       error: "border-error-default-focused ring-error-default-focused",
       success: "border-success-default-focused ring-success-default-focused",
@@ -89,7 +89,7 @@ const te = ({ label: D, name: K, onChange: f, value: l, icon: V, valueSeparator:
       warning: "border-warning-default-disabled",
       default: "border-neutral-default-disabled"
     }
-  }, Y = {
+  }, X = {
     default: {
       default: "text-neutral-default-default",
       isFocused: "text-neutral-default-focused",
@@ -110,27 +110,27 @@ const te = ({ label: D, name: K, onChange: f, value: l, icon: V, valueSeparator:
       isFocused: "text-warning-default-focused",
       disabled: "text-warning-default-disabled"
     }
-  }, _ = a ? "disabled" : v ? "isFocused" : "default";
+  }, R = a ? "disabled" : v ? "isFocused" : "default";
   return /* @__PURE__ */ r.jsxs("div", { className: d(
     "relative w-full",
-    B
+    $
   ), children: [
     /* @__PURE__ */ r.jsx("p", { className: d(
       "mb-1 px-3",
       "prometeo-fonts-label-large",
-      Y?.[y || "default"]?.[_]
-    ), children: D }),
+      X?.[I || "default"]?.[R]
+    ), children: S }),
     /* @__PURE__ */ r.jsxs("div", { className: "relative", children: [
       /* @__PURE__ */ r.jsx(
         "input",
         {
           ref: o,
           value: u,
-          onKeyUp: H,
-          onChange: G,
+          onKeyUp: G,
+          onChange: A,
           onClick: (e) => g(e.currentTarget),
           onSelect: (e) => g(e.currentTarget),
-          name: K,
+          name: D,
           disabled: a,
           className: d(
             "absolute inset-0 w-full h-full",
@@ -143,7 +143,7 @@ const te = ({ label: D, name: K, onChange: f, value: l, icon: V, valueSeparator:
           autoCapitalize: "off",
           spellCheck: "false",
           inputMode: "text",
-          ...q
+          ...O
         }
       ),
       /* @__PURE__ */ r.jsxs(
@@ -151,42 +151,42 @@ const te = ({ label: D, name: K, onChange: f, value: l, icon: V, valueSeparator:
         {
           ref: E,
           className: d(
-            "border-1 border-neutral-default-default rounded-md p-3",
+            "border border-neutral-default-default rounded-md p-3",
             "flex flex-wrap gap-1 min-h-[58px]",
             "transition-all duration-300 ease-in-out",
             "cursor-text",
-            X[_][y],
+            W[R][I],
             v ? "ring-[1px]" : "",
             // 'hover:border-primary-default-hover',
             a && "hover:border-neutral-default-disabled"
           ),
           onMouseDown: (e) => {
-            e.stopPropagation(), z?.(e), o.current?.focus();
+            e.stopPropagation(), F?.(e), o.current?.focus();
             const t = u.length;
             o.current && (o.current.selectionStart = t, o.current.selectionEnd = t), i(t);
           },
           onClick: (e) => {
-            e.stopPropagation(), o.current?.focus(), z?.(e);
+            e.stopPropagation(), o.current?.focus(), F?.(e);
           },
           children: [
-            V && /* @__PURE__ */ r.jsx("div", { className: d(
+            C && /* @__PURE__ */ r.jsx("div", { className: d(
               "flex items-center text-neutral-default-default",
               a && "text-neutral-default-disabled"
-            ), children: V }),
+            ), children: C }),
             l.map((e, t) => /* @__PURE__ */ r.jsxs(
               "div",
               {
                 className: d(
-                  "h-8 max-h-8 rounded-lg bg-primary-light-default border-[1px] border-neutral-default-default",
+                  "h-8 max-h-8 rounded-lg bg-primary-light-default border border-neutral-default-default",
                   "flex items-center gap-2 px-2",
                   "prometeo-fonts-label-medium z-20",
                   t === l.length - 1 && m ? "opacity-0 hidden  overflow-hidden" : "",
                   a && "border-neutral-default-disabled text-neutral-default-disabled",
-                  $
+                  U
                 ),
                 children: [
-                  F && /* @__PURE__ */ r.jsx("div", { className: "flex items-center", children: S.createElement(
-                    F,
+                  V && /* @__PURE__ */ r.jsx("div", { className: "flex items-center", children: M.createElement(
+                    V,
                     {
                       size: 16,
                       className: d(
@@ -199,7 +199,7 @@ const te = ({ label: D, name: K, onChange: f, value: l, icon: V, valueSeparator:
                     "span",
                     {
                       onClick: (s) => {
-                        s.stopPropagation(), !a && L(e);
+                        s.stopPropagation(), !a && J(e);
                       },
                       className: d(
                         "cursor-pointer hover:text-neutral-default-hover",
@@ -212,14 +212,14 @@ const te = ({ label: D, name: K, onChange: f, value: l, icon: V, valueSeparator:
                     "div",
                     {
                       onClick: (s) => {
-                        s.stopPropagation(), !a && J(e);
+                        s.stopPropagation(), !a && H(e);
                       },
                       className: d(
                         "cursor-pointer hover:scale-105 transition-all duration-200 ",
                         a && " cursor-default hover:scale-100 "
                       ),
                       children: /* @__PURE__ */ r.jsx(
-                        C.Close,
+                        Z,
                         {
                           size: 16,
                           className: d(
@@ -235,28 +235,28 @@ const te = ({ label: D, name: K, onChange: f, value: l, icon: V, valueSeparator:
               e
             )),
             v && !h && /* @__PURE__ */ r.jsxs("div", { className: "flex items-center min-w-[2px]", children: [
-              /* @__PURE__ */ r.jsx("span", { className: "text-neutral-default-default whitespace-pre-wrap break-words", children: u.slice(0, P) }),
-              /* @__PURE__ */ r.jsx("span", { className: "animate-[cursor-intermitent_1s_ease-in-out_infinite] bg-neutral-default-pressed w-[2px] h-5 inline-block align-middle mx-[1px] z-20" }),
-              /* @__PURE__ */ r.jsx("span", { className: "text-neutral-default-default whitespace-pre-wrap break-words", children: u.slice(P) })
+              /* @__PURE__ */ r.jsx("span", { className: "text-neutral-default-default whitespace-pre-wrap wrap-break-word", children: u.slice(0, z) }),
+              /* @__PURE__ */ r.jsx("span", { className: "animate-[cursor-intermitent_1s_ease-in-out_infinite] bg-neutral-default-pressed w-[2px] h-5 inline-block align-middle mx-px z-20" }),
+              /* @__PURE__ */ r.jsx("span", { className: "text-neutral-default-default whitespace-pre-wrap wrap-break-word", children: u.slice(z) })
             ] }),
             l.length === 0 && !v && /* @__PURE__ */ r.jsx("span", { className: d(
               "text-neutral-medium-default self-center",
               a && "text-neutral-default-disabled"
-            ), children: U || `Escribe los valores separados por ${w}` })
+            ), children: K || `Escribe los valores separados por ${w}` })
           ]
         }
       )
     ] }),
-    j && y !== "error" && !a && (typeof j == "string" ? /* @__PURE__ */ r.jsxs("div", { className: "prometeo-fonts-body-small text-neutral-medium-default ml-3 mt-1 flex items-center gap-1", children: [
-      /* @__PURE__ */ r.jsx(C.Info, { size: 16, className: "text-neutral-medium-default" }),
+    j && I !== "error" && !a && (typeof j == "string" ? /* @__PURE__ */ r.jsxs("div", { className: "prometeo-fonts-body-small text-neutral-medium-default ml-3 mt-1 flex items-center gap-1", children: [
+      /* @__PURE__ */ r.jsx(T, { size: 16, className: "text-neutral-medium-default" }),
       j
     ] }) : /* @__PURE__ */ r.jsx("div", { className: "ml-3", children: j })),
     N && typeof N == "string" && !a ? /* @__PURE__ */ r.jsxs("div", { className: "prometeo-fonts-body-small text-error-default-default ml-3 mt-1 flex items-center gap-1", children: [
-      /* @__PURE__ */ r.jsx(C.Error, { size: 16, className: "text-error-default-default" }),
+      /* @__PURE__ */ r.jsx(ee, { size: 16, className: "text-error-default-default" }),
       N
     ] }) : N
   ] });
-}, ne = S.memo(te);
+}, de = M.memo(se);
 export {
-  ne as InputMultiple
+  de as InputMultiple
 };