prometeo-design-system 4.3.5 → 4.3.6

package/dist/Toast.es.js

@@ -1,37 +1,37 @@
 import { j as t } from "./jsx-runtime-GkKLlHH4.js";
-import { c as l } from "./cn-B6yFEsav.js";
-import P, { useRef as b, useEffect as I } from "react";
-import { toast as h } from "sonner";
-import { Info as w } from "./Icons/Info.es.js";
-import { Error as v } from "./Icons/Error.es.js";
-import { Cancel as y } from "./Icons/Cancel.es.js";
-import { CheckCircle as j } from "./Icons/CheckCircle.es.js";
-import C from "./Button.es.js";
-import { Close as E } from "./Icons/Close.es.js";
-const p = {
+import { c as p } from "./cn-B6yFEsav.js";
+import P, { useRef as C, useEffect as E } from "react";
+import { toast as w } from "sonner";
+import { Info as k } from "./Icons/Info.es.js";
+import { Error as N } from "./Icons/Error.es.js";
+import { Cancel as T } from "./Icons/Cancel.es.js";
+import { CheckCircle as M } from "./Icons/CheckCircle.es.js";
+import I from "./Button.es.js";
+import { Close as R } from "./Icons/Close.es.js";
+const y = {
   dark: {
     success: {
       container: "border-b-[2px] border-success-default-default",
       iconClass: "text-success-medium-default",
-      icon: j,
+      icon: M,
       loading: "bg-success-default-default"
     },
     error: {
       container: "border-b-[2px] border-error-default-default",
       iconClass: "text-error-medium-default",
-      icon: y,
+      icon: T,
       loading: "bg-error-default-default"
     },
     warning: {
       container: "border-b-[2px] border-warning-default-default",
       iconClass: "text-warning-medium-default",
-      icon: v,
+      icon: N,
       loading: "bg-warning-default-default"
     },
     info: {
       container: " border-b-[2px] border-primary-default-default",
       iconClass: "text-primary-default-default",
-      icon: w,
+      icon: k,
       loading: "bg-primary-default-default"
     }
   },
@@ -39,29 +39,29 @@ const p = {
     success: {
       container: "",
       iconClass: "text-success-default-pressed",
-      icon: j,
+      icon: M,
       loading: "bg-success-default-pressed"
     },
     error: {
       container: "",
       iconClass: "text-error-medium-pressed",
-      icon: y,
+      icon: T,
       loading: "bg-error-medium-pressed"
     },
     warning: {
       container: "",
       iconClass: "text-warning-medium-pressed",
-      icon: v,
+      icon: N,
       loading: "bg-warning-medium-pressed"
     },
     info: {
       container: "",
       iconClass: "text-primary-default-pressed",
-      icon: w,
+      icon: k,
       loading: "bg-primary-default-pressed"
     }
   }
-}, x = {
+}, v = {
   dark: {
     container: "bg-neutral-default-default",
     title: "text-neutral-strong-default",
@@ -74,20 +74,20 @@ const p = {
     description: "text-neutral-medium-focused",
     shadow: "0px 0px 2px 0px rgba(0, 0, 0, 0.35),8px 8px 20px 0px rgba(0, 0, 0, 0.3),0px 0px 15px 0px rgba(0, 0, 0, 0.2),0px 0px 20px 0px rgba(21, 21, 21, 0.3) inset,6px 0px 100px 0px rgba(0, 0, 0, 0.05) inset"
   }
-}, T = (d) => {
-  const { title: r, description: n, button: a, id: i, icon: s, variant: o = "info", colorMode: e = "dark", showClose: m = !1, loading: c = !1, loadingTimeout: g = 2500, finishLoader: u = !1 } = d;
+}, j = (d) => {
+  const { title: n, description: l, button: s, id: c, icon: a, variant: o = "info", colorMode: e = "dark", showClose: m = !1, loading: u = !1, loadingTimeout: g = 2500, finishLoader: f = !1 } = d;
   return /* @__PURE__ */ t.jsxs(
     "div",
     {
       style: {
-        boxShadow: x[e].shadow
+        boxShadow: v[e].shadow
       },
-      className: l(
+      className: p(
         "flex p-3 pb-4 md:w-[485px] md:max-w-[485px] md:min-w-[485px] md:h-[68px] md:max-h-[68px] rounded-lg gap-2",
         "w-[345px] max-w-[345px] min-w-[345px] h-[68px] max-h-[68px] relative",
-        x[e].container,
-        p[e][o].container,
-        c && "border-b-0"
+        v[e].container,
+        y[e][o].container,
+        u && "border-b-0"
       ),
       children: [
         /* @__PURE__ */ t.jsxs(
@@ -95,67 +95,67 @@ const p = {
           {
             className: "flex items-center justify-start gap-2 max-h-[38px] h-[38px] overflow-hidden flex-1 ",
             children: [
-              /* @__PURE__ */ t.jsx("div", { className: "f", style: { color: "inherit" }, children: P.createElement(s || p[e][o].icon, { size: 24, className: p[e][o].iconClass }) }),
+              /* @__PURE__ */ t.jsx("div", { className: "f", style: { color: "inherit" }, children: P.createElement(a || y[e][o].icon, { size: 24, className: y[e][o].iconClass }) }),
               /* @__PURE__ */ t.jsxs("div", { className: "flex-1 flex flex-col gap-1", children: [
-                /* @__PURE__ */ t.jsx("p", { className: l("select-none prometeo-fonts-label-medium md:prometeo-fonts-label-xlarge", x[e].title), children: r }),
-                n && /* @__PURE__ */ t.jsx("p", { className: l("select-none prometeo-fonts-body-xsmall md:prometeo-fonts-body-small text-nowrap overflow-ellipsis ", x[e].description), children: n })
+                /* @__PURE__ */ t.jsx("p", { className: p("select-none prometeo-fonts-label-medium md:prometeo-fonts-label-xlarge", v[e].title), children: n }),
+                l && /* @__PURE__ */ t.jsx("p", { className: p("select-none prometeo-fonts-body-xsmall md:prometeo-fonts-body-small text-nowrap overflow-ellipsis ", v[e].description), children: l })
               ] })
             ]
           }
         ),
-        c && /* @__PURE__ */ t.jsx(z, { color: o, timeOut: g, finished: u, colorMode: e }),
-        a?.label && /* @__PURE__ */ t.jsx("div", { className: "shrink-0", children: /* @__PURE__ */ t.jsx(
-          C,
+        u && /* @__PURE__ */ t.jsx(L, { color: o, timeOut: g, finished: f, colorMode: e }),
+        s?.label && /* @__PURE__ */ t.jsx("div", { className: "shrink-0", children: /* @__PURE__ */ t.jsx(
+          I,
           {
-            label: a?.label,
+            label: s?.label,
             onClick: () => {
-              a?.onClick(), h.dismiss(i);
+              s?.onClick(), w.dismiss(c);
             },
             size: "small",
             color: "secondary"
           }
         ) }),
         m && /* @__PURE__ */ t.jsx("div", { className: "shrink-0", children: /* @__PURE__ */ t.jsx(
-          C,
+          I,
           {
             onClick: () => {
-              h.dismiss(i);
+              w.dismiss(c);
             },
             label: "",
             size: "small",
             color: "secondary",
-            icon: /* @__PURE__ */ t.jsx(E, { className: l(e === "light" ? "text-neutral-medium-focused " : "") }),
+            icon: /* @__PURE__ */ t.jsx(R, { className: p(e === "light" ? "text-neutral-medium-focused " : "") }),
             variant: "text",
             animate: !1,
-            className: l(e === "light" ? "hover:bg-neutral-default-hover-light focus:bg-inherit active:bg-neutral-weak-hover " : "")
+            className: p(e === "light" ? "hover:bg-neutral-default-hover-light focus:bg-inherit active:bg-neutral-weak-hover " : "")
           }
         ) })
       ]
     }
   );
-}, z = ({ className: d, color: r, timeOut: n, finished: a, colorMode: i }) => {
-  const s = b(0), o = b(Date.now()), e = b(null);
-  I(() => {
-    if (a) {
-      s.current = 1, e.current && (e.current.style.width = "100%");
+}, L = ({ className: d, color: n, timeOut: l, finished: s, colorMode: c }) => {
+  const a = C(0), o = C(Date.now()), e = C(null);
+  E(() => {
+    if (s) {
+      a.current = 1, e.current && (e.current.style.width = "100%");
       return;
     }
-    o.current = Date.now(), s.current = 0;
-    const c = setInterval(() => {
-      const g = Date.now() - o.current, u = Math.min(g / n, 1), N = u * 0.95, k = Math.sin(u * Math.PI * 2) * 0.15 + 0.05, M = Math.random() < k;
-      let f;
-      if (M)
-        f = s.current;
+    o.current = Date.now(), a.current = 0;
+    const u = setInterval(() => {
+      const g = Date.now() - o.current, f = Math.min(g / l, 1), b = f * 0.95, h = Math.sin(f * Math.PI * 2) * 0.15 + 0.05, r = Math.random() < h;
+      let i;
+      if (r)
+        i = a.current;
       else {
-        const R = (Math.random() - 0.5) * 0.25;
-        f = Math.max(s.current, Math.min(0.95, N + R));
+        const x = (Math.random() - 0.5) * 0.25;
+        i = Math.max(a.current, Math.min(0.95, b + x));
       }
-      s.current = f, e.current && (e.current.style.width = `${f * 100}%`), (u >= 1 || a) && clearInterval(c);
+      a.current = i, e.current && (e.current.style.width = `${i * 100}%`), (f >= 1 || s) && clearInterval(u);
     }, 50);
-    return () => clearInterval(c);
-  }, [n, a]);
-  const m = p[i][r].loading;
-  return /* @__PURE__ */ t.jsx("div", { className: l(
+    return () => clearInterval(u);
+  }, [l, s]);
+  const m = y[c][n].loading;
+  return /* @__PURE__ */ t.jsx("div", { className: p(
     "absolute bottom-0 translate-y-0 left-0 w-full h-2 overflow-hidden rounded-b-xl",
     'after:content-[""] after:w-[calc(100%-0px)] after:absolute after:bottom-0 after:left-1/2 after:bg-neutral-default-default after:h-2 after:-translate-x-1/2 after:-translate-y-[2px] after:rounded-b-full after:overflow-hidden',
     d
@@ -163,32 +163,108 @@ const p = {
     "div",
     {
       ref: e,
-      className: l("h-full transition-all duration-300 ease-out", m),
+      className: p("h-full transition-all duration-300 ease-out", m),
       style: { width: "0%" }
     }
   ) });
 };
-function G(d, r) {
-  const { duration: n = 2500, showClose: a = !1, colorMode: i = "dark", position: s } = r || {};
-  return h.custom((o) => /* @__PURE__ */ t.jsx(
-    T,
+function F(d, n) {
+  const { duration: l = 2500, showClose: s = !1, colorMode: c = "dark", position: a } = n || {};
+  return w.custom((o) => /* @__PURE__ */ t.jsx(
+    j,
     {
       id: o,
-      variant: r?.variant || "success",
+      variant: n?.variant || "success",
       title: d,
-      description: r?.description,
-      icon: r?.icon,
-      button: r?.button,
-      showClose: a,
-      colorMode: i
+      description: n?.description,
+      icon: n?.icon,
+      button: n?.button,
+      showClose: s,
+      colorMode: c
     }
   ), {
-    duration: n,
-    position: s,
+    duration: l,
+    position: a,
     unstyled: !0
   });
 }
+const G = (d, n = {}) => {
+  const {
+    loading: l,
+    success: s,
+    error: c,
+    colorMode: a = "dark",
+    position: o,
+    timeOut: e = 5e3
+  } = n, m = { title: "Cargando...", variant: "info", ...l }, u = { variant: "success", showClose: !0, ...s }, g = { variant: "error", showClose: !0, ...c };
+  let f, b = !1;
+  const h = (r) => {
+    w.custom((i) => /* @__PURE__ */ t.jsx(
+      j,
+      {
+        id: i,
+        ...r,
+        colorMode: a
+      }
+    ), {
+      id: f,
+      // Usar el mismo id para reemplazar
+      duration: r.duration || 1 / 0,
+      position: o,
+      unstyled: !0
+    });
+  };
+  return f = w.custom((r) => /* @__PURE__ */ t.jsx(
+    j,
+    {
+      id: r,
+      loadingTimeout: e,
+      loading: !0,
+      ...m,
+      colorMode: a
+    }
+  ), {
+    duration: 1 / 0,
+    position: o,
+    unstyled: !0
+  }), d.then((r) => {
+    if (b) return;
+    b = !0, console.log(r, "-----promise result", typeof r);
+    const i = u.title || (typeof r == "string" ? r : "Operación completada con éxito!"), x = { ...u, title: i };
+    return h({
+      ...m,
+      loadingTimeout: e,
+      loading: !0,
+      finishLoader: !0,
+      variant: "info",
+      duration: 1e3
+    }), setTimeout(() => {
+      h({
+        ...x,
+        duration: x.duration || 2500
+      });
+    }, 500), r;
+  }).catch((r) => {
+    if (b) return;
+    b = !0;
+    const i = g.title || (typeof r == "string" ? r : r.message || "Error!"), x = { ...g, title: i };
+    h({
+      ...m,
+      loadingTimeout: e,
+      loading: !0,
+      finishLoader: !0,
+      variant: "info",
+      duration: 1e3
+    }), setTimeout(() => {
+      h({
+        ...x,
+        duration: x.duration || 2500
+      });
+    }, 500);
+  }), d;
+};
 export {
-  T as default,
-  G as toastpyrion
+  j as default,
+  G as toastPyrionPromise,
+  F as toastpyrion
 };

package/dist/exports/Toast.d.ts

@@ -1,3 +1,3 @@
 export { default } from '../components/Toaster/Toaster';
 export type { PyrionToastProps } from '../components/Toaster/Toaster';
-export { toastpyrion } from '../components/Toaster/Toaster';
+export { toastpyrion, toastPyrionPromise } from '../components/Toaster/Toaster';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "prometeo-design-system",
   "private": false,
-  "version": "4.3.5",
+  "version": "4.3.6",
   "type": "module",
   "description": "design kit system",
   "main": "dist/prometeo-design-system.umd.js",