bmi-next-brokers 2.8.6 → 2.8.7

package/dist/assets/StaticToast.css

@@ -0,0 +1 @@
+._toast_2sram_2{position:relative;width:100%;min-width:0;max-width:420px;border-radius:12px;align-items:center;border-left:4px solid;overflow:hidden;cursor:default;display:flex;flex-direction:column;gap:.75em;box-sizing:border-box}._topRow_2sram_19{display:flex;align-items:center;gap:.75rem;width:100%}._bottomRow_2sram_26{display:flex;justify-content:center;width:100%}._iconContainer_2sram_33{flex-shrink:0;width:24px;margin-left:5px;height:24px;display:flex;align-items:center;justify-content:center;margin-top:.125rem}._content_2sram_45{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;flex:1;min-width:0;gap:2px;overflow:visible;word-break:break-word}._small2Bold_2sram_58{font-size:12px;font-weight:600;line-height:1.3}._small5Regular_2sram_64{font-size:11px;font-weight:400;line-height:1.4}._bodyBold_2sram_70{font-size:14px;font-weight:600;line-height:1.3}._small2Medium_2sram_76{font-size:12px;font-weight:500;line-height:1.4}._title6Bold_2sram_82{font-size:16px;font-weight:600;line-height:1.3}._bodyMedium_2sram_88{font-size:14px;font-weight:500;line-height:1.4}._actionButton_2sram_95{flex-shrink:0;background:transparent!important}._toast_2sram_2 ._actionButton_2sram_95{border:1px solid var(--Badge-Toasts-Stroke, #2054a5)!important;color:var(--Badge-Toasts-Stroke, #2054a5)!important;background-color:transparent!important}._type_brand_2sram_106 ._actionButton_2sram_95,._type_info_2sram_111 ._actionButton_2sram_95{border:1px solid #2054a5!important;color:#2054a5!important}._type_new_2sram_116 ._actionButton_2sram_95{border:1px solid #0f93a8!important;color:#0f93a8!important}._type_pending_2sram_121 ._actionButton_2sram_95{border:1px solid #ca8a04!important;color:#ca8a04!important}._type_positive_2sram_126 ._actionButton_2sram_95{border:1px solid #65a30d!important;color:#65a30d!important}._type_warning_2sram_131 ._actionButton_2sram_95{border:1px solid #ea580c!important;color:#ea580c!important}._type_negative_2sram_136 ._actionButton_2sram_95{border:1px solid #dc2626!important;color:#dc2626!important}._toast_2sram_2 ._actionButton_2sram_95:hover:not(:disabled){border-width:1px!important;background-color:transparent!important}._closeButton_2sram_147{flex-shrink:0;background:none;border:none;cursor:pointer;padding:0 0 0 7px;display:flex;align-items:center;justify-content:center;transition:all .2s ease;margin-right:.5rem}._closeButton_2sram_147:active{transform:scale(.95)}._progressBar_2sram_166{position:absolute;bottom:0;left:0;height:3px;background:currentColor;opacity:.6;animation:_progressBarShrink_2sram_1 linear;transform-origin:left}._entering_2sram_178{animation:_staticToastIn_2sram_1 .3s cubic-bezier(.16,1,.3,1) forwards}._exiting_2sram_182{animation:_staticToastOut_2sram_1 .3s cubic-bezier(.4,0,1,1) forwards}@keyframes _staticToastIn_2sram_1{0%{opacity:0;transform:translateY(-6px) scale(.98);filter:blur(3px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}@keyframes _staticToastOut_2sram_1{0%{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}to{opacity:0;transform:translateY(-6px) scale(.98);filter:blur(3px)}}@keyframes _progressBarShrink_2sram_1{0%{transform:scaleX(1)}to{transform:scaleX(0)}}._toast_2sram_2:hover ._progressBar_2sram_166{animation-play-state:paused}@media (prefers-reduced-motion: reduce){._toast_2sram_2,._entering_2sram_178,._exiting_2sram_182,._progressBar_2sram_166{animation:none!important}}._content_2sram_45:only-child,._content_2sram_45:not(:has(._body_2sram_70)){justify-content:center}

package/dist/components/StaticToast/StaticToast.d.ts

@@ -0,0 +1,27 @@
+import { IconName } from '../../icons/Icon';
+export type StaticToastType = "brand" | "info" | "new" | "pending" | "positive" | "warning" | "negative";
+export type StaticToastSize = "small" | "medium" | "large";
+export interface StaticToastProps {
+    type?: StaticToastType;
+    title?: string;
+    body?: string;
+    size?: StaticToastSize;
+    icon?: IconName;
+    /** Controla la visibilidad del toast. Por defecto visible. */
+    isVisible?: boolean;
+    /** Muestra el botón de cierre (X). Por defecto true. */
+    closable?: boolean;
+    onClose?: () => void;
+    /** Cierra automáticamente tras `duration` ms. Por defecto false en el StaticToast. */
+    autoClose?: boolean;
+    /** Duración del autoClose en ms y de la barra de progreso. */
+    duration?: number;
+    className?: string;
+    /** Estilos inline para integrarlo como un div normal (ancho, márgenes, etc.). */
+    style?: React.CSSProperties;
+    action?: {
+        label: string;
+        function: () => void;
+    };
+}
+export declare const StaticToast: ({ type, title, body, size, icon, isVisible, closable, onClose, autoClose, duration, className, style, action, }: StaticToastProps) => import("react/jsx-runtime").JSX.Element | null;

package/dist/components/StaticToast/StaticToast.js

@@ -0,0 +1,228 @@
+import { jsxs as B, jsx as t } from "react/jsx-runtime";
+import { useState as R, useEffect as x } from "react";
+import { Icon as w } from "../../icons/Icon.js";
+import { Button as D } from "../Button/Button.js";
+import '../../assets/StaticToast.css';const j = "_toast_2sram_2", O = "_topRow_2sram_19", P = "_bottomRow_2sram_26", $ = "_iconContainer_2sram_33", H = "_content_2sram_45", L = "_small2Bold_2sram_58", W = "_small5Regular_2sram_64", q = "_bodyBold_2sram_70", G = "_small2Medium_2sram_76", J = "_title6Bold_2sram_82", K = "_bodyMedium_2sram_88", Q = "_actionButton_2sram_95", U = "_type_brand_2sram_106", X = "_type_info_2sram_111", Y = "_type_new_2sram_116", Z = "_type_pending_2sram_121", S = "_type_positive_2sram_126", V = "_type_warning_2sram_131", z = "_type_negative_2sram_136", oo = "_closeButton_2sram_147", ro = "_progressBar_2sram_166", to = "_progressBarShrink_2sram_1", eo = "_entering_2sram_178", ao = "_staticToastIn_2sram_1", so = "_exiting_2sram_182", no = "_staticToastOut_2sram_1", lo = "_body_2sram_70", r = {
+  toast: j,
+  topRow: O,
+  bottomRow: P,
+  iconContainer: $,
+  content: H,
+  small2Bold: L,
+  small5Regular: W,
+  bodyBold: q,
+  small2Medium: G,
+  title6Bold: J,
+  bodyMedium: K,
+  actionButton: Q,
+  type_brand: U,
+  type_info: X,
+  type_new: Y,
+  type_pending: Z,
+  type_positive: S,
+  type_warning: V,
+  type_negative: z,
+  closeButton: oo,
+  progressBar: ro,
+  progressBarShrink: to,
+  entering: eo,
+  staticToastIn: ao,
+  exiting: so,
+  staticToastOut: no,
+  body: lo
+}, po = ({
+  type: i = "info",
+  title: y,
+  body: v,
+  size: s = "small",
+  icon: E,
+  isVisible: m = !0,
+  closable: A = !0,
+  onClose: g,
+  autoClose: u = !1,
+  duration: d = 5e3,
+  className: N,
+  style: M,
+  action: p
+}) => {
+  const [c, f] = R(m), [_, C] = R(!1);
+  x(() => {
+    m ? (C(!1), f(!0)) : c && b();
+  }, [m]), x(() => {
+    if (u && c && !_ && d > 0) {
+      const l = setTimeout(() => {
+        b();
+      }, d);
+      return () => clearTimeout(l);
+    }
+  }, [c, d, u, _]);
+  const b = () => {
+    C(!0), setTimeout(() => {
+      f(!1), g == null || g();
+    }, 300);
+  }, e = {
+    small: "10px 8px",
+    medium: "14px 10px",
+    large: "14px 12px"
+  }, a = {
+    small: "18px",
+    medium: "20px",
+    large: "24px"
+  }, T = {
+    small: { title: "small2Bold", body: "small5Regular" },
+    medium: { title: "bodyBold", body: "small2Medium" },
+    large: { title: "title6Bold", body: "bodyMedium" }
+  }, h = (l, o) => {
+    switch (l) {
+      case "brand":
+        return {
+          borderColor: "var(--Badge-Toasts-Stroke, #2054A5)",
+          background: "var(--Badge-Toasts-Fill, #FFF)",
+          padding: e[o],
+          borderRadius: a[o]
+        };
+      case "info":
+        return {
+          borderColor: "var(--Badge-Toasts-Stroke, #2054A5)",
+          background: "var(--Badge-Toasts-Fill, #E0E9F8)",
+          padding: e[o],
+          borderRadius: a[o]
+        };
+      case "new":
+        return {
+          borderColor: "var(--Badge-Toasts-Stroke, #0F93A8)",
+          background: "var(--Badge-Toasts-Fill, #D6F4F8)",
+          padding: e[o],
+          borderRadius: a[o]
+        };
+      case "pending":
+        return {
+          borderColor: "var(--Badge-Toasts-Stroke, #CA8A04)",
+          background: "var(--Badge-Toasts-Fill, #FEF9C3)",
+          padding: e[o],
+          borderRadius: a[o]
+        };
+      case "positive":
+        return {
+          borderColor: "var(--Badge-Toasts-Stroke, #65A30D)",
+          background: "var(--Badge-Toasts-Fill, #ECFCCB)",
+          padding: e[o],
+          borderRadius: a[o]
+        };
+      case "warning":
+        return {
+          borderColor: "var(--Badge-Toasts-Stroke, #EA580C)",
+          background: "var(--Badge-Toasts-Fill, #FFEDD5)",
+          padding: e[o],
+          borderRadius: a[o]
+        };
+      case "negative":
+        return {
+          borderColor: "var(--Badge-Toasts-Stroke, #DC2626)",
+          background: "var(--Badge-Toasts-Fill, #FEE2E2)",
+          padding: e[o],
+          borderRadius: a[o]
+        };
+      default:
+        return {
+          borderColor: "var(--Badge-Toasts-Stroke, #2054A5)",
+          background: "var(--Badge-Toasts-Fill, #E0E9F8)",
+          padding: e[o],
+          borderRadius: a[o]
+        };
+    }
+  }, k = (l, o) => {
+    const F = h(l, o).borderColor.match(/#([0-9A-Fa-f]{6})/);
+    return F ? F[0] : null;
+  };
+  if (!c) return null;
+  const I = [
+    r.toast,
+    r[`type_${i}`],
+    _ ? r.exiting : r.entering,
+    N
+  ].filter(Boolean).join(" "), n = h(i, s);
+  return /* @__PURE__ */ B(
+    "div",
+    {
+      className: I,
+      style: {
+        border: "1px solid " + n.borderColor,
+        background: n.background,
+        padding: n.padding,
+        borderRadius: n.borderRadius,
+        ...M
+      },
+      role: "alert",
+      "aria-live": "polite",
+      children: [
+        /* @__PURE__ */ B("div", { className: r.topRow, children: [
+          /* @__PURE__ */ t("div", { className: r.iconContainer, children: /* @__PURE__ */ t(
+            w,
+            {
+              name: E || "Info",
+              fill: k(i, s) || "#2054A5",
+              width: 25,
+              height: 25
+            }
+          ) }),
+          /* @__PURE__ */ B("div", { className: r.content, children: [
+            y && /* @__PURE__ */ t("div", { className: r[T[s].title], children: y }),
+            v && /* @__PURE__ */ t(
+              "div",
+              {
+                className: r[T[s].body],
+                style: { color: n.borderColor },
+                children: v
+              }
+            )
+          ] }),
+          A && /* @__PURE__ */ t(
+            "button",
+            {
+              className: r.closeButton,
+              style: {
+                borderLeft: "1px solid " + n.borderColor
+              },
+              onClick: b,
+              "aria-label": "Cerrar notificación",
+              children: /* @__PURE__ */ t(
+                w,
+                {
+                  name: "CancelIcon",
+                  fill: k(i, s) || "#2054A5",
+                  width: 20,
+                  height: 20
+                }
+              )
+            }
+          )
+        ] }),
+        p && /* @__PURE__ */ t("div", { className: r.bottomRow, children: /* @__PURE__ */ t(
+          D,
+          {
+            onClick: p.function,
+            variant: "outline",
+            size: s,
+            className: r.actionButton,
+            fullWidth: !0,
+            children: p.label
+          }
+        ) }),
+        u && d > 0 && /* @__PURE__ */ t(
+          "div",
+          {
+            className: r.progressBar,
+            style: {
+              animationDuration: `${d}ms`,
+              animationPlayState: _ ? "paused" : "running"
+            }
+          }
+        )
+      ]
+    }
+  );
+};
+export {
+  po as StaticToast
+};

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

@@ -0,0 +1,2 @@
+export { StaticToast } from './StaticToast';
+export type { StaticToastProps, StaticToastType, StaticToastSize, } from './StaticToast';

package/dist/components/StaticToast/index.js

@@ -0,0 +1,4 @@
+import { StaticToast as a } from "./StaticToast.js";
+export {
+  a as StaticToast
+};

package/dist/main.d.ts

@@ -17,6 +17,7 @@ export { Stepper } from './components/stepper';
 export { Tab } from './components/tab';
 export { TabGroup } from './components/tab/tabGroup';
 export { Toast } from './components/Toast';
+export { StaticToast } from './components/StaticToast';
 export { Modal } from './components/modal';
 export { Tooltip } from './components/tooltip';
 export { useScrollLock } from './hooks/useScrollLock';
@@ -42,5 +43,6 @@ export type { SelectProps, SelectSize, SelectOption, } from './components/Select
 export type { SpinnerProps, SpinnerColor } from './components/Spinner';
 export type { Step } from './components/stepper';
 export type { ToastProps, ToastType, ToastPosition } from './components/Toast';
+export type { StaticToastProps, StaticToastType, StaticToastSize, } from './components/StaticToast';
 export type { ModalProps } from './components/modal';
 export type { SearchableInputGroupProps, SearchableInputGroupField, } from './components/SearchableInputGroup';

package/dist/main.js

@@ -5,8 +5,8 @@ import { ButtonGroup as a } from "./components/ButtonGroup/ButtonGroup.js";
 import { Dialog as u } from "./components/Dialog/Dialog.js";
 import { FileUpload as c } from "./components/FileUpload/FileUpload.js";
 import { CompactFileUpload as s } from "./components/FileUpload/CompactFileUpload.js";
-import { Input as d } from "./components/Input/Input.js";
-import { Checkbox as S } from "./components/Input/Checkbox/Checkbox.js";
+import { Input as S } from "./components/Input/Input.js";
+import { Checkbox as d } from "./components/Input/Checkbox/Checkbox.js";
 import { RadioButton as b } from "./components/Input/RadioButton/RadioButton.js";
 import { Navbar as h } from "./components/navbar/index.js";
 import { ProgressBar as F } from "./components/progressBar/index.js";
@@ -17,48 +17,50 @@ import { Stepper as E } from "./components/stepper/index.js";
 import { Tab as L } from "./components/tab/index.js";
 import { TabGroup as N } from "./components/tab/tabGroup/index.js";
 import { Toast as R } from "./components/Toast/Toast.js";
-import { Modal as q } from "./components/modal/index.js";
-import { Tooltip as z } from "./components/tooltip/index.js";
-import { useScrollLock as J } from "./hooks/useScrollLock.js";
-import { ScrollContainer as Q } from "./components/scrollContainer/index.js";
-import { FieldError as W } from "./components/fieldError/index.js";
-import { HelperText as Y } from "./components/helperText/index.js";
-import { Drawer as _ } from "./components/drawer/index.js";
-import { Sheet as oo } from "./components/sheet/index.js";
-import { useClose as eo } from "./hooks/useClose.js";
-import { useCloseOnBack as po } from "./hooks/useCloseOnBack.js";
-import { useBTC as mo } from "./hooks/btcContext/useBtcContext.js";
-import { BTCProvider as ao } from "./hooks/btcContext/btcProvider.js";
+import { StaticToast as q } from "./components/StaticToast/StaticToast.js";
+import { Modal as z } from "./components/modal/index.js";
+import { Tooltip as J } from "./components/tooltip/index.js";
+import { useScrollLock as Q } from "./hooks/useScrollLock.js";
+import { ScrollContainer as W } from "./components/scrollContainer/index.js";
+import { FieldError as Y } from "./components/fieldError/index.js";
+import { HelperText as _ } from "./components/helperText/index.js";
+import { Drawer as oo } from "./components/drawer/index.js";
+import { Sheet as eo } from "./components/sheet/index.js";
+import { useClose as po } from "./hooks/useClose.js";
+import { useCloseOnBack as mo } from "./hooks/useCloseOnBack.js";
+import { useBTC as ao } from "./hooks/btcContext/useBtcContext.js";
+import { BTCProvider as uo } from "./hooks/btcContext/btcProvider.js";
 import './assets/main.css';export {
-  ao as BTCProvider,
+  uo as BTCProvider,
   p as Badge,
   m as Button,
   a as ButtonGroup,
-  S as Checkbox,
+  d as Checkbox,
   s as CompactFileUpload,
   u as Dialog,
-  _ as Drawer,
-  W as FieldError,
+  oo as Drawer,
+  Y as FieldError,
   c as FileUpload,
-  Y as HelperText,
+  _ as HelperText,
   e as Icon,
-  d as Input,
-  q as Modal,
+  S as Input,
+  z as Modal,
   h as Navbar,
   F as ProgressBar,
   b as RadioButton,
-  Q as ScrollContainer,
+  W as ScrollContainer,
   D as SearchableInputGroup,
   I as Select,
-  oo as Sheet,
+  eo as Sheet,
   U as Spinner,
+  q as StaticToast,
   E as Stepper,
   L as Tab,
   N as TabGroup,
   R as Toast,
-  z as Tooltip,
-  mo as useBTC,
-  eo as useClose,
-  po as useCloseOnBack,
-  J as useScrollLock
+  J as Tooltip,
+  ao as useBTC,
+  po as useClose,
+  mo as useCloseOnBack,
+  Q as useScrollLock
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "bmi-next-brokers",
   "description": "Componentes de UI para proyecto BMI Next Brokers",
-  "version": "2.8.6",
+  "version": "2.8.7",
   "author": "BMI Ahorro España",
   "contributors": [
     "José Ramón Jiménez <jrjimenez@bmicos.com>",