bmi-next 1.0.25 → 1.0.27

package/dist/assets/index.css

@@ -1 +1 @@
-._container_1y71m_1{display:flex;flex-direction:column;gap:5px;width:100%}._textareaContainer_1y71m_8{box-sizing:border-box;display:flex;align-items:flex-start;padding-inline:16px;border-radius:16px;border:solid 1px rgba(3,12,36,.2);gap:16px;padding-bottom:4px;background-color:#fff}._textareaContainer_1y71m_8:has(textarea:invalid){border:solid 1px #f64c71;transition:all .3s ease}._textareaContainer_1y71m_8:has(textarea:focus:not(:invalid)),._textareaContainer_1y71m_8:hover:has(textarea:valid){border:solid 1px #45c2d6;box-shadow:3px 3px #45c2d6;transition:all .3s ease}._textarea_1y71m_8{width:100%;font-size:19px;border:none;font-family:Poppins Regular;box-sizing:border-box;resize:none;min-height:140px;max-height:550px;padding-top:12px;padding-bottom:12px;line-height:24px;overflow-y:auto;field-sizing:content}._textarea_1y71m_8:focus{outline:none}._prefix_1y71m_52{opacity:.6;font-size:19px;font-family:Palaquin BMI}._textarea_1y71m_8:invalid{color:#f64c71}._textarea_1y71m_8:disabled{background-color:#fff}._labelContainer_1y71m_66{display:flex;justify-content:space-between;align-items:center}._labelContainer_1y71m_66>label{margin-left:9px;font-family:Poppins Medium;font-size:14px;line-height:16.8px}._invalidLabel_1y71m_79{color:var(--rojo)}
+._container_nqpxl_1{display:flex;flex-direction:column;gap:5px;width:100%}._textareaContainer_nqpxl_8{box-sizing:border-box;display:flex;align-items:flex-start;padding-inline:16px;border-radius:16px;border:solid 1px rgba(3,12,36,.2);gap:16px;padding-bottom:4px;background-color:#fff}._textareaContainer_nqpxl_8:has(textarea:invalid){border:solid 1px #f64c71;transition:all .3s ease}._textareaContainer_nqpxl_8:has(textarea:focus:not(:invalid)),._textareaContainer_nqpxl_8:hover:has(textarea:valid){border:solid 1px #45c2d6;box-shadow:3px 3px #45c2d6;transition:all .3s ease}._textarea_nqpxl_8{width:100%;font-size:16px;border:none;font-family:Poppins Regular;box-sizing:border-box;resize:none;min-height:140px;max-height:550px;padding-top:12px;padding-bottom:12px;line-height:24px;overflow-y:auto;field-sizing:content}._textarea_nqpxl_8:focus{outline:none}._prefix_nqpxl_52{opacity:.6;font-size:19px;font-family:Palaquin BMI}._textarea_nqpxl_8:invalid{color:#f64c71}._textarea_nqpxl_8:disabled{background-color:#fff}._labelContainer_nqpxl_66{display:flex;justify-content:space-between;align-items:center}._labelContainer_nqpxl_66>label{margin-left:9px;font-family:Poppins Medium;font-size:14px;line-height:16.8px}._invalidLabel_nqpxl_79{color:var(--rojo)}

package/dist/assets/index8.css

@@ -1 +1 @@
-._container_a555r_1{display:flex;flex-direction:column;gap:5px;width:100%}._container_a555r_1:has(input:disabled){opacity:.4}._labelContainer_a555r_12{display:flex;justify-content:space-between;align-items:center}._labelContainer_a555r_12>label{margin-left:9px;font-family:Poppins Medium;font-size:14px;line-height:16.8px}._invalidLabel_a555r_25{color:var(--rojo)}._visibilityContainer_a555r_29{display:flex;align-items:center;gap:3px;cursor:pointer;color:var(--azul-digital);font-family:Poppins Medium;font-size:14px;line-height:16.8px}._inputContainer_a555r_40{height:52px;box-sizing:border-box;display:flex;align-items:center;padding-inline:16px;border-radius:16px;border:1px solid var(--negro-20);gap:5px;background-color:#fff}._inputContainer_a555r_40>svg{overflow:visible}._invalid_a555r_25{border:solid 1px var(--rojo);transition:all .3s ease}._invalid_a555r_25:has(input:focus){border:solid 1px var(--rojo);box-shadow:3px 3px 0 0 var(--rojo);transition:all .3s ease}._inputContainer_a555r_40:not(._invalid_a555r_25):has(input:focus){border:solid 1px var(--turquesa);box-shadow:3px 3px 0 0 var(--turquesa);transition:all .3s ease}._input_a555r_40{height:100%;width:100%;font-family:Poppins Regular;font-size:16px;line-height:19.2px;border:none;box-sizing:border-box}._input_a555r_40:focus{outline:none}._prefix_a555r_98{font-family:Poppins Regular;font-size:16px;line-height:19.2px;color:var(--negro-40)}._invalid_a555r_25 ._input_a555r_40{color:var(--rojo)}._input_a555r_40:disabled{background-color:#fff}
+._container_1l4wa_1{display:flex;flex-direction:column;gap:5px;width:100%}._container_1l4wa_1:has(input:disabled){opacity:.4}._labelContainer_1l4wa_12{display:flex;justify-content:space-between;align-items:center}._labelContainer_1l4wa_12>label{margin-left:9px;font-family:Poppins Medium;font-size:14px;line-height:16.8px}._invalidLabel_1l4wa_25{color:var(--rojo)}._visibilityContainer_1l4wa_29{display:flex;align-items:center;gap:3px;cursor:pointer;color:var(--azul-digital);font-family:Poppins Medium;font-size:14px;line-height:16.8px}._inputContainer_1l4wa_40{height:52px;box-sizing:border-box;display:flex;align-items:center;padding-inline:16px;border-radius:16px;border:1px solid var(--negro-20);gap:5px;background-color:#fff}._inputContainer_1l4wa_40>svg{overflow:visible}._invalid_1l4wa_25{border:solid 1px var(--rojo);transition:all .3s ease}._invalid_1l4wa_25:has(input:focus){border:solid 1px var(--rojo);box-shadow:3px 3px 0 0 var(--rojo);transition:all .3s ease}._inputContainer_1l4wa_40:not(._invalid_1l4wa_25):has(input:focus){border:solid 1px var(--turquesa);box-shadow:3px 3px 0 0 var(--turquesa);transition:all .3s ease;margin-right:3px}._input_1l4wa_40{height:100%;width:100%;font-family:Poppins Regular;font-size:16px;line-height:19.2px;border:none;box-sizing:border-box}._input_1l4wa_40:focus{outline:none}._prefix_1l4wa_99{font-family:Poppins Regular;font-size:16px;line-height:19.2px;color:var(--negro-40)}._invalid_1l4wa_25 ._input_1l4wa_40{color:var(--rojo)}._input_1l4wa_40:disabled{background-color:#fff}

package/dist/components/Button/index.js

@@ -1,5 +1,5 @@
 import { jsx as e, jsxs as d, Fragment as p } from "react/jsx-runtime";
-import "../../index-Cp_B-Y3h.js";
+import "../../index-BTmWXehE.js";
 import { Icon as l } from "../../icons/icons.js";
 import "react";
 import { Spinner as h } from "../Spinner/index.js";

package/dist/components/Drawer/DrawerPortalBase/index.js

@@ -1,6 +1,6 @@
 import { jsxs as u, Fragment as f, jsx as r } from "react/jsx-runtime";
 import { useRef as w } from "react";
-import { r as g } from "../../../index-Cp_B-Y3h.js";
+import { r as g } from "../../../index-BTmWXehE.js";
 import { Icon as p } from "../../../icons/icons.js";
 import '../../../assets/index6.css';const y = "_overlay_1b37u_1", D = "_closing_1b37u_12", Y = "_bottomDrawer_1b37u_36", L = "_drawerHeader_1b37u_76", B = "_drawerIndicator_1b37u_89", I = "_drawerContent_1b37u_100", N = "_closeButton_1b37u_116", t = {
   overlay: y,

package/dist/components/Drawer/index.js

@@ -1,17 +1,17 @@
 import { jsx as f } from "react/jsx-runtime";
 import { useState as r, useEffect as a } from "react";
-import { DrawerPortalBase as m } from "./DrawerPortalBase/index.js";
-function g({ isOpen: o, onClose: s, title: l, children: n }) {
-  const [i, e] = r(!1), [d, t] = r(0);
-  return a(() => (o ? document.body.style.overflow = "hidden" : document.body.style.overflow = "", () => {
+import { DrawerPortalBase as u } from "./DrawerPortalBase/index.js";
+function g({ isOpen: e, onClose: s, title: l, children: n }) {
+  const [i, o] = r(!1), [d, t] = r(0);
+  return a(() => (e ? document.body.style.overflow = "hidden" : document.body.style.overflow = "", () => {
     document.body.style.overflow = "";
-  }), [o]), /* @__PURE__ */ f(
-    m,
+  }), [e]), /* @__PURE__ */ f(
+    u,
     {
-      isOpen: o,
+      isOpen: e,
       handleClose: () => {
-        e(!0), setTimeout(() => {
-          s(), e(!1), t(0);
+        o(!0), setTimeout(() => {
+          s(), o(!1), t(0);
         }, 350);
       },
       dragPosition: d,

package/dist/components/Input/index.js

@@ -1,20 +1,20 @@
-import { jsxs as e, jsx as i } from "react/jsx-runtime";
-import { Icon as l } from "../../icons/icons.js";
+import { jsxs as l, jsx as i } from "react/jsx-runtime";
+import { Icon as e } from "../../icons/icons.js";
 import { FieldError as m } from "../FieldError/index.js";
 import { useState as b } from "react";
-import '../../assets/index8.css';const C = "_container_a555r_1", h = "_labelContainer_a555r_12", u = "_invalidLabel_a555r_25", y = "_visibilityContainer_a555r_29", N = "_inputContainer_a555r_40", x = "_invalid_a555r_25", f = "_input_a555r_40", L = "_prefix_a555r_98", n = {
+import '../../assets/index8.css';const C = "_container_1l4wa_1", h = "_labelContainer_1l4wa_12", u = "_invalidLabel_1l4wa_25", w = "_visibilityContainer_1l4wa_29", y = "_inputContainer_1l4wa_40", N = "_invalid_1l4wa_25", x = "_input_1l4wa_40", f = "_prefix_1l4wa_99", n = {
   container: C,
   labelContainer: h,
   invalidLabel: u,
-  visibilityContainer: y,
-  inputContainer: N,
-  invalid: x,
-  input: f,
-  prefix: L
+  visibilityContainer: w,
+  inputContainer: y,
+  invalid: N,
+  input: x,
+  prefix: f
 }, I = ({
-  label: r,
-  iconBefore: s,
-  iconAfter: o,
+  label: s,
+  iconBefore: o,
+  iconAfter: r,
   error: a,
   prefix: c,
   suffix: _,
@@ -23,10 +23,10 @@ import '../../assets/index8.css';const C = "_container_a555r_1", h = "_labelCont
   ...d
 }) => {
   const [t, v] = b(!1);
-  return /* @__PURE__ */ e("div", { className: n.container, children: [
-    /* @__PURE__ */ e("div", { className: n.labelContainer, children: [
-      r && /* @__PURE__ */ i("label", { className: a ? n.invalidLabel : "", children: r }),
-      p && /* @__PURE__ */ e(
+  return /* @__PURE__ */ l("div", { className: n.container, children: [
+    /* @__PURE__ */ l("div", { className: n.labelContainer, children: [
+      s && /* @__PURE__ */ i("label", { className: a ? n.invalidLabel : "", children: s }),
+      p && /* @__PURE__ */ l(
         "div",
         {
           className: n.visibilityContainer,
@@ -34,7 +34,7 @@ import '../../assets/index8.css';const C = "_container_a555r_1", h = "_labelCont
           children: [
             /* @__PURE__ */ i("span", { children: t ? "Ocultar" : "Mostrar" }),
             /* @__PURE__ */ i(
-              l,
+              e,
               {
                 name: t ? "HideEye" : "ShowEye",
                 width: 20,
@@ -46,12 +46,12 @@ import '../../assets/index8.css';const C = "_container_a555r_1", h = "_labelCont
         }
       )
     ] }),
-    /* @__PURE__ */ e(
+    /* @__PURE__ */ l(
       "div",
       {
         className: `${n.inputContainer} ${a ? n.invalid : ""}`,
         children: [
-          s && /* @__PURE__ */ i(l, { ...s }),
+          o && /* @__PURE__ */ i(e, { ...o }),
           c && /* @__PURE__ */ i("span", { className: n.prefix, children: c }),
           /* @__PURE__ */ i(
             "input",
@@ -62,7 +62,7 @@ import '../../assets/index8.css';const C = "_container_a555r_1", h = "_labelCont
             }
           ),
           _ && /* @__PURE__ */ i("span", { children: _ }),
-          o && /* @__PURE__ */ i(l, { ...o })
+          r && /* @__PURE__ */ i(e, { ...r })
         ]
       }
     ),

package/dist/components/Navbar/index.js

@@ -1,5 +1,5 @@
 import { jsxs as o, jsx as n } from "react/jsx-runtime";
-import "../../index-Cp_B-Y3h.js";
+import "../../index-BTmWXehE.js";
 import { Icon as i } from "../../icons/icons.js";
 import "react";
 import '../../assets/index4.css';const m = "_containerNavbar_1m98h_1", b = "_navbar_1m98h_12", v = "_backButton_1m98h_22", u = "_progressContainer_1m98h_30", t = {

package/dist/components/Select/DrawerPortal/index.js

@@ -1,33 +1,33 @@
-import { jsxs as o, Fragment as D, jsx as r } from "react/jsx-runtime";
-import { useRef as h, Fragment as A } from "react";
-import { r as I } from "../../../index-Cp_B-Y3h.js";
+import { jsxs as o, Fragment as D, jsx as t } from "react/jsx-runtime";
+import { useRef as v, Fragment as I } from "react";
+import { r as A } from "../../../index-BTmWXehE.js";
 import { Icon as j } from "../../../icons/icons.js";
 import { Image as H } from "../../images/index.js";
-import '../../../assets/index3.css';const B = "_overlay_f1ngj_1", Y = "_closing_f1ngj_11", L = "_bottomDrawer_f1ngj_35", S = "_drawerHeader_f1ngj_73", C = "_drawerIndicator_f1ngj_87", R = "_drawerContent_f1ngj_98", X = "_optionCountry_f1ngj_106", $ = "_optionNormal_f1ngj_107", b = "_options_f1ngj_125", x = "_closeButton_f1ngj_137", M = "_separator_f1ngj_150", t = {
+import '../../../assets/index3.css';const B = "_overlay_f1ngj_1", Y = "_closing_f1ngj_11", x = "_bottomDrawer_f1ngj_35", L = "_drawerHeader_f1ngj_73", S = "_drawerIndicator_f1ngj_87", C = "_drawerContent_f1ngj_98", b = "_optionCountry_f1ngj_106", R = "_optionNormal_f1ngj_107", X = "_options_f1ngj_125", $ = "_closeButton_f1ngj_137", M = "_separator_f1ngj_150", r = {
   overlay: B,
   closing: Y,
-  bottomDrawer: L,
-  drawerHeader: S,
-  drawerIndicator: C,
-  drawerContent: R,
-  optionCountry: X,
-  optionNormal: $,
-  options: b,
-  closeButton: x,
+  bottomDrawer: x,
+  drawerHeader: L,
+  drawerIndicator: S,
+  drawerContent: C,
+  optionCountry: b,
+  optionNormal: R,
+  options: X,
+  closeButton: $,
   separator: M
-}, P = ({
+}, W = ({
   isOpen: E,
   handleClose: s,
-  dragPosition: p,
+  dragPosition: f,
   setDragPosition: m,
   isClosing: u,
-  title: f,
+  title: p,
   options: _,
   handleOptionClick: y,
   countries: w,
   zIndex: l
 }) => {
-  const N = l ? 50 : 70, d = h(0), i = h(0);
+  const N = l ? 50 : 70, d = v(0), i = v(0);
   if (!E) return null;
   const g = (e) => {
     const n = "touches" in e ? e.touches[0].clientY : e.clientY;
@@ -35,58 +35,72 @@ import '../../../assets/index3.css';const B = "_overlay_f1ngj_1", Y = "_closing_
   }, c = () => {
     document.removeEventListener("mousemove", a), document.removeEventListener("touchmove", a), document.removeEventListener("mouseup", c), document.removeEventListener("touchend", c), i.current - d.current > 100 ? s() : m(0);
   }, a = (e) => {
-    const n = "touches" in e ? e.touches[0].clientY : e.clientY, v = n - d.current;
-    i.current = n, v > 0 && m(v);
+    const n = "touches" in e ? e.touches[0].clientY : e.clientY, h = n - d.current;
+    i.current = n, h > 0 && m(h);
   };
-  return I.createPortal(
+  return A.createPortal(
     /* @__PURE__ */ o(D, { children: [
-      /* @__PURE__ */ r(
+      /* @__PURE__ */ t(
         "div",
         {
           style: { zIndex: 2e3 + (l || 0) },
-          className: `${t.overlay} ${u ? t.closing : ""}`,
+          className: `${r.overlay} ${u ? r.closing : ""}`,
           onClick: s
         }
       ),
       /* @__PURE__ */ o(
         "div",
         {
-          className: `${t.bottomDrawer} ${u ? t.closing : ""}`,
+          className: `${r.bottomDrawer} ${u ? r.closing : ""}`,
           style: {
-            transform: `translateY(${p ?? 0}px)`,
+            transform: `translateY(${f ?? 0}px)`,
             zIndex: 2001 + (l || 0)
           },
           children: [
             /* @__PURE__ */ o(
               "header",
               {
-                className: t.drawerHeader,
+                className: r.drawerHeader,
                 onMouseDown: g,
                 onTouchStart: g,
                 children: [
-                  /* @__PURE__ */ r("div", { className: t.drawerIndicator }),
-                  /* @__PURE__ */ r("div", { className: t.closeButton, onClick: s, children: /* @__PURE__ */ r(j, { name: "Close", fill: "rgb(0 0 0/40%)" }) }),
-                  /* @__PURE__ */ r("p", { children: f })
+                  /* @__PURE__ */ t("div", { className: r.drawerIndicator }),
+                  /* @__PURE__ */ t("div", { className: r.closeButton, onClick: s, children: /* @__PURE__ */ t(j, { name: "Close", fill: "rgb(0 0 0/40%)" }) }),
+                  /* @__PURE__ */ t("p", { children: p })
                 ]
               }
             ),
-            /* @__PURE__ */ r(
+            /* @__PURE__ */ t(
               "div",
               {
-                className: t.drawerContent,
+                className: r.drawerContent,
                 style: { maxHeight: `${N}vh` },
-                children: /* @__PURE__ */ r("div", { className: t.options, children: _.map(
-                  (e, n) => e.hidden ? null : /* @__PURE__ */ o(A, { children: [
+                children: /* @__PURE__ */ t("div", { className: r.options, children: _.map(
+                  (e, n) => e.hidden ? null : /* @__PURE__ */ o(I, { children: [
                     /* @__PURE__ */ o(
                       "div",
                       {
-                        className: `${w ? t.optionCountry : t.optionNormal}`,
+                        className: `${w ? r.optionCountry : r.optionNormal}`,
                         onClick: () => y(e),
                         children: [
-                          e.image && /* @__PURE__ */ r(H, { width: 30, height: 30, src: e.image.src }),
+                          e.image && /* @__PURE__ */ t(H, { width: 30, height: 30, src: e.image.src }),
                           /* @__PURE__ */ o("div", { style: { display: "flex", flexDirection: "column" }, children: [
-                            /* @__PURE__ */ r("p", { style: { margin: 0 }, children: e.label }),
-                            e.description && /* @__PURE__ */ r(
+                            /* @__PURE__ */ o(
+                              "div",
+                              {
+                                style: {
+                                  display: "flex",
+                                  alignItems: "center",
+                                  gap: "10px"
+                                },
+                                children: [
+                                  e.countryFlag && /* @__PURE__ */ t("span", { children: e.countryFlag }),
+                                  /* @__PURE__ */ t("span", { children: e.label }),
+                                  e.countryPrefix && /* @__PURE__ */ t("span", { style: { color: "rgb(0 0 0/60%)" }, children: e.countryPrefix })
+                                ]
+                              }
+                            ),
+                            e.description && /* @__PURE__ */ t(
                               "p",
                               {
                                 className: "small2Regular",
@@ -99,7 +113,7 @@ import '../../../assets/index3.css';const B = "_overlay_f1ngj_1", Y = "_closing_
                       },
                       e.value
                     ),
-                    n < _.length - 1 && /* @__PURE__ */ r("div", { className: t.separator })
+                    n < _.length - 1 && /* @__PURE__ */ t("div", { className: r.separator })
                   ] }, n)
                 ) })
               }
@@ -112,5 +126,5 @@ import '../../../assets/index3.css';const B = "_overlay_f1ngj_1", Y = "_closing_
   );
 };
 export {
-  P as DrawerPortal
+  W as DrawerPortal
 };

package/dist/components/Select/index.d.ts

@@ -25,6 +25,8 @@ export interface Option {
     hidden?: boolean;
     /** Descripción opcional para mostrar junto a la opción */
     description?: string;
+    countryFlag?: string;
+    countryPrefix?: string;
 }
 /**
  * Props del componente Select.

package/dist/components/Select/index.js

@@ -1,75 +1,76 @@
-import { jsxs as o, Fragment as N, jsx as l } from "react/jsx-runtime";
-import { Icon as O } from "../../icons/icons.js";
-import { useState as c, useRef as y, useEffect as P } from "react";
-import { Image as R } from "../images/index.js";
-import { DrawerPortal as j } from "./DrawerPortal/index.js";
-import '../../assets/index2.css';const k = "_selectDrawer_1o9yc_1", A = "_label_1o9yc_9", F = "_selected_1o9yc_16", i = {
-  selectDrawer: k,
-  label: A,
-  selected: F
+import { jsxs as a, Fragment as R, jsx as l } from "react/jsx-runtime";
+import { Icon as E } from "../../icons/icons.js";
+import { useState as c, useRef as g, useEffect as F } from "react";
+import { Image as N } from "../images/index.js";
+import { DrawerPortal as O } from "./DrawerPortal/index.js";
+import '../../assets/index2.css';const j = "_selectDrawer_1o9yc_1", k = "_label_1o9yc_9", S = "_selected_1o9yc_16", i = {
+  selectDrawer: j,
+  label: k,
+  selected: S
 };
 function B({
-  options: a,
-  selected: t,
+  options: o,
+  selected: r,
   setSelected: u,
-  title: b,
-  countries: g,
-  onChange: d,
+  title: w,
+  countries: b,
+  onChange: f,
   zIndex: p,
-  label: f,
+  label: d,
   ..._
 }) {
-  const [s, m] = c(!1), [D, v] = c(!1), C = y(null), [I, h] = c(0), r = y(null);
-  P(() => (s ? document.body.style.overflow = "hidden" : document.body.style.overflow = "", () => {
+  const [t, m] = c(!1), [D, v] = c(!1), x = g(null), [C, h] = c(0), n = g(null);
+  F(() => (t ? document.body.style.overflow = "hidden" : document.body.style.overflow = "", () => {
     document.body.style.overflow = "";
-  }), [s]);
-  const w = () => {
+  }), [t]);
+  const y = () => {
     v(!0), setTimeout(() => {
       m(!1), v(!1), h(0);
     }, 350);
-  }, x = (e) => {
-    if (u(e), r.current) {
-      r.current.value = e.value;
-      const n = new Event("change", { bubbles: !0 });
-      r.current.dispatchEvent(n);
+  }, P = (e) => {
+    if (u(e), n.current) {
+      n.current.value = e.value;
+      const s = new Event("change", { bubbles: !0 });
+      n.current.dispatchEvent(s);
     }
-    w();
+    y();
   };
-  return /* @__PURE__ */ o(N, { children: [
+  return /* @__PURE__ */ a(R, { children: [
     /* @__PURE__ */ l(
       "select",
       {
-        ref: r,
-        value: t.value,
+        ref: n,
+        value: r.value,
         onChange: (e) => {
-          const n = a.find((E) => E.value === e.target.value);
-          n && u(n), d && d(e);
+          const s = o.find((I) => I.value === e.target.value);
+          s && u(s), f && f(e);
         },
         style: { display: "none" },
         ..._,
-        children: a.map((e) => /* @__PURE__ */ l("option", { value: e.value, children: e.label }, e.value))
+        children: o.map((e) => /* @__PURE__ */ l("option", { value: e.value, children: e.label }, e.value))
       }
     ),
-    /* @__PURE__ */ o("div", { ref: C, className: i.selectDrawer, children: [
-      f && /* @__PURE__ */ l("label", { className: i.label, children: f }),
-      /* @__PURE__ */ o("div", { className: i.selected, onClick: () => m(!s), children: [
-        t.image && /* @__PURE__ */ l(R, { src: t.image.src, width: 30, height: 30 }),
-        /* @__PURE__ */ l("span", { children: t.label }),
-        /* @__PURE__ */ l("div", { style: { marginLeft: "auto" }, children: /* @__PURE__ */ l(O, { name: "ArrowDown" }) })
+    /* @__PURE__ */ a("div", { ref: x, className: i.selectDrawer, children: [
+      d && /* @__PURE__ */ l("label", { className: i.label, children: d }),
+      /* @__PURE__ */ a("div", { className: i.selected, onClick: () => m(!t), children: [
+        r.countryFlag && /* @__PURE__ */ l("div", { style: { marginRight: "auto", fontSize: "22px" }, children: r.countryFlag }),
+        r.image && /* @__PURE__ */ l(N, { src: r.image.src, width: 30, height: 30 }),
+        /* @__PURE__ */ l("span", { children: r.countryPrefix ? r.countryPrefix : r.label }),
+        /* @__PURE__ */ l("div", { style: { marginLeft: "auto" }, children: /* @__PURE__ */ l(E, { name: "ArrowDown" }) })
       ] })
     ] }),
     /* @__PURE__ */ l(
-      j,
+      O,
       {
-        isOpen: s,
-        handleClose: w,
-        dragPosition: I,
+        isOpen: t,
+        handleClose: y,
+        dragPosition: C,
         setDragPosition: h,
         isClosing: D,
-        title: b,
-        options: a,
-        handleOptionClick: x,
-        countries: g,
+        title: w,
+        options: o,
+        handleOptionClick: P,
+        countries: b,
         zIndex: p
       }
     )

package/dist/components/TextArea/index.js

@@ -1,37 +1,37 @@
-import { jsxs as m, jsx as e } from "react/jsx-runtime";
-import { Icon as y } from "../../icons/icons.js";
+import { jsxs as c, jsx as e } from "react/jsx-runtime";
+import { Icon as f } from "../../icons/icons.js";
 import { FieldError as h } from "../FieldError/index.js";
-import { useRef as p } from "react";
-import '../../assets/index.css';const b = "_container_1y71m_1", v = "_textareaContainer_1y71m_8", C = "_textarea_1y71m_8", N = "_prefix_1y71m_52", L = "_labelContainer_1y71m_66", u = "_invalidLabel_1y71m_79", a = {
-  container: b,
-  textareaContainer: v,
-  textarea: C,
-  prefix: N,
-  labelContainer: L,
-  invalidLabel: u
-}, $ = ({
+import { useRef as b } from "react";
+import '../../assets/index.css';const v = "_container_nqpxl_1", C = "_textareaContainer_nqpxl_8", q = "_textarea_nqpxl_8", y = "_prefix_nqpxl_52", N = "_labelContainer_nqpxl_66", L = "_invalidLabel_nqpxl_79", a = {
+  container: v,
+  textareaContainer: C,
+  textarea: q,
+  prefix: y,
+  labelContainer: N,
+  invalidLabel: L
+}, T = ({
   icon: t,
   error: n,
-  prefix: l,
+  prefix: i,
   className: r,
-  onChange: i,
+  onChange: l,
   label: s,
   ...o
 }) => {
-  var c;
-  const d = p(null), x = `${a.textarea} ${r || ""}`, _ = (f) => {
-    i == null || i(f);
+  var x;
+  const d = b(null), _ = `${a.textarea} ${r || ""}`, p = (m) => {
+    l == null || l(m);
   };
-  return /* @__PURE__ */ m(
+  return /* @__PURE__ */ c(
     "div",
     {
       className: a.container,
-      style: ((c = o.style) == null ? void 0 : c.display) === "none" ? { display: "none" } : {},
+      style: ((x = o.style) == null ? void 0 : x.display) === "none" ? { display: "none" } : {},
       children: [
         /* @__PURE__ */ e("div", { className: a.labelContainer, children: s && /* @__PURE__ */ e("label", { className: n ? a.invalidLabel : "", children: s }) }),
-        /* @__PURE__ */ m("div", { className: a.textareaContainer, children: [
+        /* @__PURE__ */ c("div", { className: a.textareaContainer, children: [
           t && /* @__PURE__ */ e("div", { style: { marginTop: "9px" }, children: /* @__PURE__ */ e(
-            y,
+            f,
             {
               name: t.name,
               fill: t.fill,
@@ -39,19 +39,19 @@ import '../../assets/index.css';const b = "_container_1y71m_1", v = "_textareaCo
               height: t.height
             }
           ) }),
-          l && /* @__PURE__ */ e(
+          i && /* @__PURE__ */ e(
             "span",
             {
               className: a.prefix,
-              children: l
+              children: i
             }
           ),
           /* @__PURE__ */ e(
             "textarea",
             {
               ref: d,
-              className: x,
-              onChange: _,
+              className: _,
+              onChange: p,
               ...o
             }
           )
@@ -62,5 +62,5 @@ import '../../assets/index.css';const b = "_container_1y71m_1", v = "_textareaCo
   );
 };
 export {
-  $ as TextArea
+  T as TextArea
 };