bmi-next 1.0.62 → 1.0.64

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

@@ -1,89 +1,90 @@
-import { jsxs as o, Fragment as f, jsx as t } from "react/jsx-runtime";
-import { useRef as w, Fragment as I } from "react";
-import { r as A } from "../../../index-BVBERE6H.js";
-import { Icon as H } from "../../../icons/icons.js";
-import { Image as x } from "../../images/index.js";
-import '../../../assets/index4.css';const B = "_overlay_a96ws_1", Y = "_closing_a96ws_11", L = "_bottomDrawer_a96ws_35", S = "_drawerHeader_a96ws_73", C = "_drawerIndicator_a96ws_88", b = "_drawerContent_a96ws_99", R = "_optionCountry_a96ws_107", X = "_optionNormal_a96ws_108", $ = "_options_a96ws_126", M = "_closeButton_a96ws_138", F = "_separator_a96ws_152", r = {
+import { jsxs as o, Fragment as I, jsx as r } from "react/jsx-runtime";
+import { useRef as w, Fragment as A } from "react";
+import { r as x } from "../../../index-BVBERE6H.js";
+import { Icon as E } from "../../../icons/icons.js";
+import { Image as H } from "../../images/index.js";
+import '../../../assets/index4.css';const B = "_overlay_a96ws_1", Y = "_closing_a96ws_11", L = "_bottomDrawer_a96ws_35", S = "_drawerHeader_a96ws_73", C = "_drawerIndicator_a96ws_88", R = "_drawerContent_a96ws_99", b = "_optionCountry_a96ws_107", X = "_optionNormal_a96ws_108", $ = "_options_a96ws_126", M = "_closeButton_a96ws_138", F = "_separator_a96ws_152", t = {
   overlay: B,
   closing: Y,
   bottomDrawer: L,
   drawerHeader: S,
   drawerIndicator: C,
-  drawerContent: b,
-  optionCountry: R,
+  drawerContent: R,
+  optionCountry: b,
   optionNormal: X,
   options: $,
   closeButton: M,
   separator: F
 }, W = ({
-  isOpen: E,
-  handleClose: c,
-  dragPosition: p,
+  isOpen: g,
+  handleClose: s,
+  dragPosition: y,
   setDragPosition: m,
   isClosing: u,
-  title: y,
+  title: p,
   options: _,
-  handleOptionClick: g,
-  countries: N,
+  handleOptionClick: N,
+  countries: D,
   zIndex: l
 }) => {
-  const D = l ? 50 : 70, d = w(0), i = w(0);
-  if (!E) return null;
+  const f = l ? 50 : 70, d = w(0), i = w(0);
+  if (!g) return null;
   const h = (e) => {
     const n = "touches" in e ? e.touches[0].clientY : e.clientY;
-    d.current = n, i.current = n, document.addEventListener("mousemove", s), document.addEventListener("touchmove", s), document.addEventListener("mouseup", a), document.addEventListener("touchend", a);
+    d.current = n, i.current = n, document.addEventListener("mousemove", c), document.addEventListener("touchmove", c), document.addEventListener("mouseup", a), document.addEventListener("touchend", a);
   }, a = () => {
-    document.removeEventListener("mousemove", s), document.removeEventListener("touchmove", s), document.removeEventListener("mouseup", a), document.removeEventListener("touchend", a), i.current - d.current > 100 ? c() : m(0);
-  }, s = (e) => {
+    document.removeEventListener("mousemove", c), document.removeEventListener("touchmove", c), document.removeEventListener("mouseup", a), document.removeEventListener("touchend", a), i.current - d.current > 100 ? s() : m(0);
+  }, c = (e) => {
     const n = "touches" in e ? e.touches[0].clientY : e.clientY, v = n - d.current;
     i.current = n, v > 0 && m(v);
   };
-  return A.createPortal(
-    /* @__PURE__ */ o(f, { children: [
-      /* @__PURE__ */ t(
+  return x.createPortal(
+    /* @__PURE__ */ o(I, { children: [
+      /* @__PURE__ */ r(
         "div",
         {
           style: { zIndex: 2e3 + (l || 0) },
-          className: `${r.overlay} ${u ? r.closing : ""}`,
-          onClick: c
+          className: `${t.overlay} ${u ? t.closing : ""}`,
+          onClick: s
         }
       ),
       /* @__PURE__ */ o(
         "div",
         {
-          className: `${r.bottomDrawer} ${u ? r.closing : ""}`,
+          className: `${t.bottomDrawer} ${u ? t.closing : ""}`,
           style: {
-            transform: `translateY(${p ?? 0}px)`,
+            transform: `translateY(${y ?? 0}px)`,
             zIndex: 2001 + (l || 0)
           },
           children: [
             /* @__PURE__ */ o(
               "header",
               {
-                className: r.drawerHeader,
+                className: t.drawerHeader,
                 onMouseDown: h,
                 onTouchStart: h,
                 children: [
-                  /* @__PURE__ */ t("div", { className: r.drawerIndicator }),
-                  /* @__PURE__ */ t("div", { className: r.closeButton, onClick: c, children: /* @__PURE__ */ t(H, { name: "Close", fill: "rgb(0 0 0/40%)" }) }),
-                  /* @__PURE__ */ t("p", { children: y })
+                  /* @__PURE__ */ r("div", { className: t.drawerIndicator }),
+                  /* @__PURE__ */ r("div", { className: t.closeButton, onClick: s, children: /* @__PURE__ */ r(E, { name: "Close", fill: "rgb(0 0 0/40%)" }) }),
+                  /* @__PURE__ */ r("p", { children: p })
                 ]
               }
             ),
-            /* @__PURE__ */ t(
+            /* @__PURE__ */ r(
               "div",
               {
-                className: r.drawerContent,
-                style: { maxHeight: `${D}vh` },
-                children: /* @__PURE__ */ t("div", { className: r.options, children: _.map(
-                  (e, n) => e.hidden ? null : /* @__PURE__ */ o(I, { children: [
+                className: t.drawerContent,
+                style: { maxHeight: `${f}vh` },
+                children: /* @__PURE__ */ r("div", { className: t.options, children: _.map(
+                  (e, n) => e.hidden ? null : /* @__PURE__ */ o(A, { children: [
                     /* @__PURE__ */ o(
                       "div",
                       {
-                        className: `${N ? r.optionCountry : r.optionNormal}`,
-                        onClick: () => g(e),
+                        className: `${D ? t.optionCountry : t.optionNormal}`,
+                        onClick: () => N(e),
                         children: [
-                          e.image && /* @__PURE__ */ t(x, { width: 30, height: 30, src: e.image.src }),
+                          e.image && /* @__PURE__ */ r(H, { width: 30, height: 30, src: e.image.src }),
+                          e.icon && /* @__PURE__ */ r("div", { style: { marginRight: "8px" }, children: /* @__PURE__ */ r(E, { ...e.icon }) }),
                           /* @__PURE__ */ o("div", { style: { display: "flex", flexDirection: "column" }, children: [
                             /* @__PURE__ */ o(
                               "div",
@@ -94,13 +95,13 @@ import '../../../assets/index4.css';const B = "_overlay_a96ws_1", Y = "_closing_
                                   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.countryFlag && /* @__PURE__ */ r("span", { children: e.countryFlag }),
+                                  /* @__PURE__ */ r("span", { children: e.label }),
+                                  e.countryPrefix && /* @__PURE__ */ r("span", { style: { color: "rgb(0 0 0/60%)" }, children: e.countryPrefix })
                                 ]
                               }
                             ),
-                            e.description && /* @__PURE__ */ t(
+                            e.description && /* @__PURE__ */ r(
                               "p",
                               {
                                 className: "small2Regular",
@@ -113,7 +114,7 @@ import '../../../assets/index4.css';const B = "_overlay_a96ws_1", Y = "_closing_
                       },
                       e.value
                     ),
-                    n < _.length - 1 && /* @__PURE__ */ t("div", { className: r.separator })
+                    n < _.length - 1 && /* @__PURE__ */ r("div", { className: t.separator })
                   ] }, n)
                 ) })
               }

package/dist/components/Select/index.js

@@ -1,9 +1,9 @@
-import { jsxs as t, jsx as n, Fragment as E } from "react/jsx-runtime";
-import { Icon as D } from "../../icons/icons.js";
+import { jsxs as t, jsx as n, Fragment as L } from "react/jsx-runtime";
+import { Icon as u } from "../../icons/icons.js";
 import { useState as y, useRef as p, useEffect as C } from "react";
-import { Image as g } from "../images/index.js";
-import { DrawerPortal as R } from "./DrawerPortal/index.js";
-import '../../assets/index3.css';const I = "_selectDrawer_8m10f_1", z = "_label_8m10f_9", j = "_selected_8m10f_16", A = "_desktopSelectContainer_8m10f_41", T = "_desktopSelect_8m10f_41", q = "_desktopDropdown_8m10f_75", B = "_desktopOption_8m10f_89", a = {
+import { Image as w } from "../images/index.js";
+import { DrawerPortal as E } from "./DrawerPortal/index.js";
+import '../../assets/index3.css';const I = "_selectDrawer_8m10f_1", z = "_label_8m10f_9", j = "_selected_8m10f_16", A = "_desktopSelectContainer_8m10f_41", T = "_desktopSelect_8m10f_41", q = "_desktopDropdown_8m10f_75", B = "_desktopOption_8m10f_89", i = {
   selectDrawer: I,
   label: z,
   selected: j,
@@ -13,78 +13,80 @@ import '../../assets/index3.css';const I = "_selectDrawer_8m10f_1", z = "_label_
   desktopOption: B
 };
 function Q({
-  options: i,
+  options: a,
   selected: r,
-  setSelected: m,
+  setSelected: h,
   title: S,
   countries: N,
-  onChange: u,
+  onChange: f,
   zIndex: O,
-  label: f,
-  desktop: s = !1,
-  ...w
+  label: m,
+  desktop: c = !1,
+  ..._
 }) {
-  const [c, o] = y(!1), [P, _] = y(!1), F = p(null), [L, k] = y(0), d = p(null), h = p(null);
-  C(() => (c && !s ? document.body.style.overflow = "hidden" : document.body.style.overflow = "", () => {
+  const [s, o] = y(!1), [P, x] = y(!1), R = p(null), [F, k] = y(0), d = p(null), v = p(null);
+  C(() => (s && !c ? document.body.style.overflow = "hidden" : document.body.style.overflow = "", () => {
     document.body.style.overflow = "";
-  }), [c, s]), C(() => {
+  }), [s, c]), C(() => {
     const e = (l) => {
-      s && h.current && !h.current.contains(l.target) && o(!1);
+      c && v.current && !v.current.contains(l.target) && o(!1);
     };
     return document.addEventListener("mousedown", e), () => {
       document.removeEventListener("mousedown", e);
     };
-  }, [s]);
+  }, [c]);
   const b = () => {
-    if (s) {
+    if (c) {
       o(!1);
       return;
     }
-    _(!0), setTimeout(() => {
-      o(!1), _(!1), k(0);
+    x(!0), setTimeout(() => {
+      o(!1), x(!1), k(0);
     }, 350);
-  }, x = (e) => {
-    if (m(e), d.current) {
+  }, D = (e) => {
+    if (h(e), d.current) {
       d.current.value = e.value;
       const l = new Event("change", { bubbles: !0 });
       d.current.dispatchEvent(l);
     }
     b();
   };
-  return s ? /* @__PURE__ */ t("div", { className: a.selectDrawer, children: [
-    f && /* @__PURE__ */ n("label", { className: a.label, children: f }),
-    /* @__PURE__ */ t("div", { className: a.desktopSelectContainer, ref: h, children: [
+  return c ? /* @__PURE__ */ t("div", { className: i.selectDrawer, children: [
+    m && /* @__PURE__ */ n("label", { className: i.label, children: m }),
+    /* @__PURE__ */ t("div", { className: i.desktopSelectContainer, ref: v, children: [
       /* @__PURE__ */ n(
         "select",
         {
           ref: d,
           value: r.value,
           onChange: (e) => {
-            const l = i.find((v) => v.value === e.target.value);
-            l && m(l), u && u(e);
+            const l = a.find((g) => g.value === e.target.value);
+            l && h(l), f && f(e);
           },
           style: { display: "none" },
-          ...w,
-          children: i.map((e) => e.hidden ? null : /* @__PURE__ */ n("option", { value: e.value, children: e.label }, e.value))
+          ..._,
+          children: a.map((e) => e.hidden ? null : /* @__PURE__ */ n("option", { value: e.value, children: e.label }, e.value))
         }
       ),
-      /* @__PURE__ */ t("div", { className: a.desktopSelect, onClick: () => o(!c), children: [
+      /* @__PURE__ */ t("div", { className: i.desktopSelect, onClick: () => o(!s), children: [
         r.countryFlag && /* @__PURE__ */ n("div", { style: { fontSize: "22px" }, children: r.countryFlag }),
-        r.image && /* @__PURE__ */ n(g, { src: r.image.src, width: 30, height: 30 }),
+        r.image && /* @__PURE__ */ n(w, { src: r.image.src, width: 30, height: 30 }),
+        r.icon && /* @__PURE__ */ n("div", { style: { marginRight: "8px" }, children: /* @__PURE__ */ n(u, { ...r.icon }) }),
         /* @__PURE__ */ t("span", { children: [
           r.label,
           r.countryPrefix && /* @__PURE__ */ n("span", { style: { marginLeft: "4px", opacity: 0.5 }, children: r.countryPrefix })
         ] }),
-        /* @__PURE__ */ n("div", { style: { marginLeft: "auto" }, children: /* @__PURE__ */ n(D, { name: "ArrowDown" }) })
+        /* @__PURE__ */ n("div", { style: { marginLeft: "auto" }, children: /* @__PURE__ */ n(u, { name: "ArrowDown" }) })
       ] }),
-      c && /* @__PURE__ */ n("div", { className: a.desktopDropdown, children: i.filter((e) => !e.hidden).map((e) => /* @__PURE__ */ t(
+      s && /* @__PURE__ */ n("div", { className: i.desktopDropdown, children: a.filter((e) => !e.hidden).map((e) => /* @__PURE__ */ t(
         "div",
         {
-          className: a.desktopOption,
-          onClick: () => x(e),
+          className: i.desktopOption,
+          onClick: () => D(e),
           children: [
             e.countryFlag && /* @__PURE__ */ n("div", { style: { fontSize: "22px" }, children: e.countryFlag }),
-            e.image && /* @__PURE__ */ n(g, { src: e.image.src, width: 30, height: 30 }),
+            e.image && /* @__PURE__ */ n(w, { src: e.image.src, width: 30, height: 30 }),
+            e.icon && /* @__PURE__ */ n("div", { style: { marginRight: "8px" }, children: /* @__PURE__ */ n(u, { ...e.icon }) }),
             /* @__PURE__ */ t("span", { children: [
               e.label,
               e.countryPrefix && /* @__PURE__ */ n("span", { style: { marginLeft: "4px", opacity: 0.5 }, children: e.countryPrefix })
@@ -94,41 +96,42 @@ function Q({
         e.value
       )) })
     ] })
-  ] }) : /* @__PURE__ */ t(E, { children: [
+  ] }) : /* @__PURE__ */ t(L, { children: [
     /* @__PURE__ */ n(
       "select",
       {
         ref: d,
         value: r.value,
         onChange: (e) => {
-          const l = i.find((v) => v.value === e.target.value);
-          l && m(l), u && u(e);
+          const l = a.find((g) => g.value === e.target.value);
+          l && h(l), f && f(e);
         },
         style: { display: "none" },
-        ...w,
-        children: i.map((e) => /* @__PURE__ */ n("option", { value: e.value, children: e.label }, e.value))
+        ..._,
+        children: a.map((e) => /* @__PURE__ */ n("option", { value: e.value, children: e.label }, e.value))
       }
     ),
-    /* @__PURE__ */ t("div", { ref: F, className: a.selectDrawer, children: [
-      f && /* @__PURE__ */ n("label", { className: a.label, children: f }),
-      /* @__PURE__ */ t("div", { className: a.selected, onClick: () => o(!c), children: [
+    /* @__PURE__ */ t("div", { ref: R, className: i.selectDrawer, children: [
+      m && /* @__PURE__ */ n("label", { className: i.label, children: m }),
+      /* @__PURE__ */ t("div", { className: i.selected, onClick: () => o(!s), children: [
         r.countryFlag && /* @__PURE__ */ n("div", { style: { marginRight: "auto", fontSize: "22px" }, children: r.countryFlag }),
-        r.image && /* @__PURE__ */ n(g, { src: r.image.src, width: 30, height: 30 }),
+        r.image && /* @__PURE__ */ n(w, { src: r.image.src, width: 30, height: 30 }),
+        r.icon && /* @__PURE__ */ n("div", { style: { marginRight: "8px" }, children: /* @__PURE__ */ n(u, { ...r.icon }) }),
         /* @__PURE__ */ n("span", { children: r.countryPrefix ? r.countryPrefix : r.label }),
-        /* @__PURE__ */ n("div", { style: { marginLeft: "auto" }, children: /* @__PURE__ */ n(D, { name: "ArrowDown" }) })
+        /* @__PURE__ */ n("div", { style: { marginLeft: "auto" }, children: /* @__PURE__ */ n(u, { name: "ArrowDown" }) })
       ] })
     ] }),
     /* @__PURE__ */ n(
-      R,
+      E,
       {
-        isOpen: c,
+        isOpen: s,
         handleClose: b,
-        dragPosition: L,
+        dragPosition: F,
         setDragPosition: k,
         isClosing: P,
         title: S,
-        options: i,
-        handleOptionClick: x,
+        options: a,
+        handleOptionClick: D,
         countries: N,
         zIndex: O
       }

package/dist/icons/icons.d.ts

@@ -1,4 +1,4 @@
-export type IconName = "Exclamation" | "Email" | "Password" | "ShowEye" | "HideEye" | "ArrowDown" | "Search" | "Masculino" | "Femenino" | "Height" | "Weight" | "Smoke" | "SmokeOff" | "Upload" | "Telefono" | "EmailFill" | "Whatsapp" | "Close" | "Lock" | "Envelope" | "CollapseMenu" | "ExpandMenu" | "Notification" | "Users" | "Pagos" | "Impagos" | "Configuracion" | "LockPassword" | "Logout" | "AddCard" | "Add" | "Help" | "Unsubscribe" | "CheckCircle" | "Disable" | "Edit" | "Delete" | "Save" | "Eye" | "Mail" | "Resend" | "Reset" | "SwapVertical" | "Clip" | "Send" | "Trash" | "ReInit" | "CircleDolar" | "Sort" | "Pencil" | "Check" | "LogoBMI+" | "ArrowLeft" | "ArrowRight" | "AddDocument" | "Family" | "User" | "Carnet" | "Savings" | "History" | "Docs" | "Filters" | "DownloadDoc" | "Biometric" | "Aetna" | "BMI" | "CircleDenied" | "ArrowForwardBtn" | "Share" | "Gallery" | "Camera" | "Sthetoscope" | "Shield" | "LogoBMIHorizontal" | "LogoBMIVertical" | "Profesional" | "BusquedaCiudad" | "Medico" | "Laboratorio" | "CercaDeMi" | "CuadroMedico" | "Celular" | "Headset" | "Internet" | "Calendar" | "Autorizaciones" | "Warning" | "Person" | "StepInProgress" | "StepPending" | "StepDone" | "IconoVida" | "IconoSalud";
+export type IconName = "Exclamation" | "Email" | "Password" | "ShowEye" | "HideEye" | "ArrowDown" | "Search" | "Masculino" | "Femenino" | "Height" | "Weight" | "Smoke" | "SmokeOff" | "Upload" | "Telefono" | "EmailFill" | "Whatsapp" | "Close" | "Lock" | "Envelope" | "CollapseMenu" | "ExpandMenu" | "Notification" | "Users" | "Pagos" | "Impagos" | "Configuracion" | "LockPassword" | "Logout" | "AddCard" | "Add" | "Help" | "Unsubscribe" | "CheckCircle" | "Disable" | "Edit" | "Delete" | "Save" | "Eye" | "Mail" | "Resend" | "Reset" | "SwapVertical" | "Clip" | "Send" | "Trash" | "ReInit" | "CircleDolar" | "Sort" | "Pencil" | "Check" | "LogoBMI+" | "ArrowLeft" | "ArrowRight" | "AddDocument" | "Family" | "User" | "Carnet" | "Savings" | "History" | "Docs" | "Filters" | "DownloadDoc" | "Biometric" | "Aetna" | "BMI" | "CircleDenied" | "ArrowForwardBtn" | "Share" | "Gallery" | "Camera" | "Sthetoscope" | "Shield" | "LogoBMIHorizontal" | "LogoBMIVertical" | "Profesional" | "BusquedaCiudad" | "Medico" | "Laboratorio" | "CercaDeMi" | "CuadroMedico" | "Celular" | "Headset" | "Internet" | "Calendar" | "Autorizaciones" | "Warning" | "Person" | "StepInProgress" | "StepPending" | "StepDone" | "IconoVida" | "IconoSalud" | "USD" | "GT" | "EUR" | "DO" | "CR" | "CO";
 interface IconProps {
     width?: number;
     height?: number;
@@ -101,4 +101,10 @@ export declare const StepInProgress: React.FC<IconProps>;
 export declare const StepPending: React.FC<IconProps>;
 export declare const IconoVida: React.FC<IconProps>;
 export declare const IconoSalud: React.FC<IconProps>;
+export declare const USD: React.FC<IconProps>;
+export declare const GT: React.FC<IconProps>;
+export declare const EUR: React.FC<IconProps>;
+export declare const DO: React.FC<IconProps>;
+export declare const CR: React.FC<IconProps>;
+export declare const CO: React.FC<IconProps>;
 export {};