stp-ui-kit 0.0.53 → 0.0.55

package/dist/stp-ui-kit.es.js

@@ -473,17 +473,17 @@ var no = { exports: {} };
       }, h.format = function(d) {
         var b = this, i = this.$locale();
         if (!this.isValid()) return i.invalidDate || D;
-        var $ = d || "YYYY-MM-DDTHH:mm:ssZ", S = E.z(this), N = this.$H, T = this.$m, x = this.$M, A = i.weekdays, G = i.months, P = i.meridiem, H = function(U, ie, de, Oe) {
-          return U && (U[ie] || U(b, $)) || de[ie].slice(0, Oe);
+        var $ = d || "YYYY-MM-DDTHH:mm:ssZ", S = E.z(this), N = this.$H, T = this.$m, x = this.$M, A = i.weekdays, G = i.months, P = i.meridiem, H = function(U, ie, ue, Oe) {
+          return U && (U[ie] || U(b, $)) || ue[ie].slice(0, Oe);
         }, re = function(U) {
           return E.s(N % 12 || 12, U, "0");
-        }, ee = P || function(U, ie, de) {
+        }, ee = P || function(U, ie, ue) {
           var Oe = U < 12 ? "AM" : "PM";
-          return de ? Oe.toLowerCase() : Oe;
+          return ue ? Oe.toLowerCase() : Oe;
         };
         return $.replace(B, function(U, ie) {
-          return ie || function(de) {
-            switch (de) {
+          return ie || function(ue) {
+            switch (ue) {
               case "YY":
                 return String(b.$y).slice(-2);
               case "YYYY":
@@ -1684,23 +1684,23 @@ class sr {
     }, this.getActiveToasts = () => this.toasts.filter((t) => !this.dismissedToasts.has(t.id)), this.subscribers = [], this.toasts = [], this.dismissedToasts = /* @__PURE__ */ new Set();
   }
 }
-const ce = new sr(), rr = (e, t) => {
+const de = new sr(), rr = (e, t) => {
   const o = (t == null ? void 0 : t.id) || xt++;
-  return ce.addToast({
+  return de.addToast({
     title: e,
     ...t,
     id: o
   }), o;
-}, ar = (e) => e && typeof e == "object" && "ok" in e && typeof e.ok == "boolean" && "status" in e && typeof e.status == "number", ir = rr, lr = () => ce.toasts, cr = () => ce.getActiveToasts(), He = Object.assign(ir, {
-  success: ce.success,
-  info: ce.info,
-  warning: ce.warning,
-  error: ce.error,
-  custom: ce.custom,
-  message: ce.message,
-  promise: ce.promise,
-  dismiss: ce.dismiss,
-  loading: ce.loading
+}, ar = (e) => e && typeof e == "object" && "ok" in e && typeof e.ok == "boolean" && "status" in e && typeof e.status == "number", ir = rr, lr = () => de.toasts, cr = () => de.getActiveToasts(), He = Object.assign(ir, {
+  success: de.success,
+  info: de.info,
+  warning: de.warning,
+  error: de.error,
+  custom: de.custom,
+  message: de.message,
+  promise: de.promise,
+  dismiss: de.dismiss,
+  loading: de.loading
 }, {
   getHistory: lr,
   getToasts: cr
@@ -1719,7 +1719,7 @@ function br(e) {
 }
 const _r = (e) => {
   var t, o, n, a, r, l, f, m, u;
-  const { invert: g, toast: s, unstyled: R, interacting: M, setHeights: k, visibleToasts: D, heights: _, index: B, toasts: Z, expanded: V, removeToast: J, defaultRichColors: Y, closeButton: W, style: L, cancelButtonStyle: y, actionButtonStyle: F, className: q = "", descriptionClassName: E = "", duration: K, position: se, gap: C, expandByDefault: h, classNames: d, icons: b, closeButtonAriaLabel: i = "Close toast" } = e, [$, S] = p.useState(null), [N, T] = p.useState(null), [x, A] = p.useState(!1), [G, P] = p.useState(!1), [H, re] = p.useState(!1), [ee, U] = p.useState(!1), [ie, de] = p.useState(!1), [Oe, dt] = p.useState(0), [_o, Tt] = p.useState(0), Ue = p.useRef(s.duration || K || Ht), Et = p.useRef(null), xe = p.useRef(null), yo = B === 0, vo = B + 1 <= D, ue = s.type, Be = s.dismissible !== !1, wo = s.className || "", xo = s.descriptionClassName || "", Ze = p.useMemo(() => _.findIndex((j) => j.toastId === s.id) || 0, [
+  const { invert: g, toast: s, unstyled: R, interacting: M, setHeights: k, visibleToasts: D, heights: _, index: B, toasts: Z, expanded: V, removeToast: J, defaultRichColors: Y, closeButton: W, style: L, cancelButtonStyle: y, actionButtonStyle: F, className: q = "", descriptionClassName: E = "", duration: K, position: se, gap: C, expandByDefault: h, classNames: d, icons: b, closeButtonAriaLabel: i = "Close toast" } = e, [$, S] = p.useState(null), [N, T] = p.useState(null), [x, A] = p.useState(!1), [G, P] = p.useState(!1), [H, re] = p.useState(!1), [ee, U] = p.useState(!1), [ie, ue] = p.useState(!1), [Oe, dt] = p.useState(0), [_o, Tt] = p.useState(0), Ue = p.useRef(s.duration || K || Ht), Et = p.useRef(null), xe = p.useRef(null), yo = B === 0, vo = B + 1 <= D, me = s.type, Be = s.dismissible !== !1, wo = s.className || "", xo = s.descriptionClassName || "", Ze = p.useMemo(() => _.findIndex((j) => j.toastId === s.id) || 0, [
     _,
     s.id
   ]), ko = p.useMemo(() => {
@@ -1734,7 +1734,7 @@ const _r = (e) => {
   ]), ut = p.useRef(0), Re = p.useRef(0), Dt = p.useRef(0), Le = p.useRef(null), [$o, No] = se.split("-"), jt = p.useMemo(() => _.reduce((j, te, ne) => ne >= Ze ? j : j + te.height, 0), [
     _,
     Ze
-  ]), zt = nr(), Co = s.invert || g, mt = ue === "loading";
+  ]), zt = nr(), Co = s.invert || g, mt = me === "loading";
   Re.current = p.useMemo(() => Ze * C + jt, [
     Ze,
     jt
@@ -1755,7 +1755,7 @@ const _r = (e) => {
           position: s.position
         },
         ...ne
-      ]), () => k((ne) => ne.filter((me) => me.toastId !== s.id));
+      ]), () => k((ne) => ne.filter((fe) => fe.toastId !== s.id));
     }
   }, [
     k,
@@ -1765,7 +1765,7 @@ const _r = (e) => {
     const j = xe.current, te = j.style.height;
     j.style.height = "auto";
     const ne = j.getBoundingClientRect().height;
-    j.style.height = te, Tt(ne), k((me) => me.find((oe) => oe.toastId === s.id) ? me.map((oe) => oe.toastId === s.id ? {
+    j.style.height = te, Tt(ne), k((fe) => fe.find((oe) => oe.toastId === s.id) ? fe.map((oe) => oe.toastId === s.id ? {
       ...oe,
       height: ne
     } : oe) : [
@@ -1774,7 +1774,7 @@ const _r = (e) => {
         height: ne,
         position: s.position
       },
-      ...me
+      ...fe
     ]);
   }, [
     x,
@@ -1797,12 +1797,12 @@ const _r = (e) => {
     Re
   ]);
   p.useEffect(() => {
-    if (s.promise && ue === "loading" || s.duration === 1 / 0 || s.type === "loading") return;
+    if (s.promise && me === "loading" || s.duration === 1 / 0 || s.type === "loading") return;
     let j;
     return V || M || zt ? (() => {
       if (Dt.current < ut.current) {
-        const me = (/* @__PURE__ */ new Date()).getTime() - ut.current;
-        Ue.current = Ue.current - me;
+        const fe = (/* @__PURE__ */ new Date()).getTime() - ut.current;
+        Ue.current = Ue.current - fe;
       }
       Dt.current = (/* @__PURE__ */ new Date()).getTime();
     })() : (() => {
@@ -1814,7 +1814,7 @@ const _r = (e) => {
     V,
     M,
     s,
-    ue,
+    me,
     zt,
     Ce
   ]), p.useEffect(() => {
@@ -1829,20 +1829,20 @@ const _r = (e) => {
       var te;
       return /* @__PURE__ */ p.createElement("div", {
         className: ye(d == null ? void 0 : d.loader, s == null || (te = s.classNames) == null ? void 0 : te.loader, "sonner-loader"),
-        "data-visible": ue === "loading"
+        "data-visible": me === "loading"
       }, b.loading);
     }
     return /* @__PURE__ */ p.createElement(Zs, {
       className: ye(d == null ? void 0 : d.loader, s == null || (j = s.classNames) == null ? void 0 : j.loader),
-      visible: ue === "loading"
+      visible: me === "loading"
     });
   }
-  const So = s.icon || (b == null ? void 0 : b[ue]) || Xs(ue);
+  const So = s.icon || (b == null ? void 0 : b[me]) || Xs(me);
   var Ot, Bt;
   return /* @__PURE__ */ p.createElement("li", {
     tabIndex: 0,
     ref: xe,
-    className: ye(q, wo, d == null ? void 0 : d.toast, s == null || (t = s.classNames) == null ? void 0 : t.toast, d == null ? void 0 : d.default, d == null ? void 0 : d[ue], s == null || (o = s.classNames) == null ? void 0 : o[ue]),
+    className: ye(q, wo, d == null ? void 0 : d.toast, s == null || (t = s.classNames) == null ? void 0 : t.toast, d == null ? void 0 : d.default, d == null ? void 0 : d[me], s == null || (o = s.classNames) == null ? void 0 : o[me]),
     "data-sonner-toast": "",
     "data-rich-colors": (Ot = s.richColors) != null ? Ot : Y,
     "data-styled": !(s.jsx || s.unstyled || R),
@@ -1857,7 +1857,7 @@ const _r = (e) => {
     "data-front": yo,
     "data-swiping": H,
     "data-dismissible": Be,
-    "data-type": ue,
+    "data-type": me,
     "data-invert": Co,
     "data-swipe-out": ee,
     "data-swipe-direction": N,
@@ -1884,18 +1884,18 @@ const _r = (e) => {
       var j, te, ne;
       if (ee || !Be) return;
       Le.current = null;
-      const me = Number(((j = xe.current) == null ? void 0 : j.style.getPropertyValue("--swipe-amount-x").replace("px", "")) || 0), Je = Number(((te = xe.current) == null ? void 0 : te.style.getPropertyValue("--swipe-amount-y").replace("px", "")) || 0), oe = (/* @__PURE__ */ new Date()).getTime() - ((ne = Et.current) == null ? void 0 : ne.getTime()), pe = $ === "x" ? me : Je, Qe = Math.abs(pe) / oe;
+      const fe = Number(((j = xe.current) == null ? void 0 : j.style.getPropertyValue("--swipe-amount-x").replace("px", "")) || 0), Je = Number(((te = xe.current) == null ? void 0 : te.style.getPropertyValue("--swipe-amount-y").replace("px", "")) || 0), oe = (/* @__PURE__ */ new Date()).getTime() - ((ne = Et.current) == null ? void 0 : ne.getTime()), pe = $ === "x" ? fe : Je, Qe = Math.abs(pe) / oe;
       if (Math.abs(pe) >= hr || Qe > 0.11) {
-        dt(Re.current), s.onDismiss == null || s.onDismiss.call(s, s), T($ === "x" ? me > 0 ? "right" : "left" : Je > 0 ? "down" : "up"), Ce(), U(!0);
+        dt(Re.current), s.onDismiss == null || s.onDismiss.call(s, s), T($ === "x" ? fe > 0 ? "right" : "left" : Je > 0 ? "down" : "up"), Ce(), U(!0);
         return;
       } else {
         var ge, be;
         (ge = xe.current) == null || ge.style.setProperty("--swipe-amount-x", "0px"), (be = xe.current) == null || be.style.setProperty("--swipe-amount-y", "0px");
       }
-      de(!1), re(!1), S(null);
+      ue(!1), re(!1), S(null);
     },
     onPointerMove: (j) => {
-      var te, ne, me;
+      var te, ne, fe;
       if (!Le.current || !Be || ((te = window.getSelection()) == null ? void 0 : te.toString().length) > 0) return;
       const oe = j.clientY - Le.current.y, pe = j.clientX - Le.current.x;
       var Qe;
@@ -1921,9 +1921,9 @@ const _r = (e) => {
           const Te = pe * Rt(pe);
           be.x = Math.abs(Te) < Math.abs(pe) ? Te : pe;
         }
-      (Math.abs(be.x) > 0 || Math.abs(be.y) > 0) && de(!0), (ne = xe.current) == null || ne.style.setProperty("--swipe-amount-x", `${be.x}px`), (me = xe.current) == null || me.style.setProperty("--swipe-amount-y", `${be.y}px`);
+      (Math.abs(be.x) > 0 || Math.abs(be.y) > 0) && ue(!0), (ne = xe.current) == null || ne.style.setProperty("--swipe-amount-x", `${be.x}px`), (fe = xe.current) == null || fe.style.setProperty("--swipe-amount-y", `${be.y}px`);
     }
-  }, ko && !s.jsx && ue !== "loading" ? /* @__PURE__ */ p.createElement("button", {
+  }, ko && !s.jsx && me !== "loading" ? /* @__PURE__ */ p.createElement("button", {
     "aria-label": i,
     "data-disabled": mt,
     "data-close-button": !0,
@@ -1932,7 +1932,7 @@ const _r = (e) => {
       Ce(), s.onDismiss == null || s.onDismiss.call(s, s);
     },
     className: ye(d == null ? void 0 : d.closeButton, s == null || (n = s.classNames) == null ? void 0 : n.closeButton)
-  }, (Bt = b == null ? void 0 : b.close) != null ? Bt : or) : null, (ue || s.icon || s.promise) && s.icon !== null && ((b == null ? void 0 : b[ue]) !== null || s.icon) ? /* @__PURE__ */ p.createElement("div", {
+  }, (Bt = b == null ? void 0 : b.close) != null ? Bt : or) : null, (me || s.icon || s.promise) && s.icon !== null && ((b == null ? void 0 : b[me]) !== null || s.icon) ? /* @__PURE__ */ p.createElement("div", {
     "data-icon": "",
     className: ye(d == null ? void 0 : d.icon, s == null || (a = s.classNames) == null ? void 0 : a.icon)
   }, s.promise || s.type === "loading" && !s.icon ? s.icon || Mo() : null, s.type !== "loading" ? So : null) : null, /* @__PURE__ */ p.createElement("div", {
@@ -2006,10 +2006,10 @@ const vr = /* @__PURE__ */ p.forwardRef(function(t, o) {
   ]), [y, F] = p.useState([]), [q, E] = p.useState(!1), [K, se] = p.useState(!1), [C, h] = p.useState(s !== "system" ? s : typeof window < "u" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light"), d = p.useRef(null), b = r.join("+").replace(/Key/g, "").replace(/Digit/g, ""), i = p.useRef(null), $ = p.useRef(!1), S = p.useCallback((N) => {
     W((T) => {
       var x;
-      return (x = T.find((A) => A.id === N.id)) != null && x.delete || ce.dismiss(N.id), T.filter(({ id: A }) => A !== N.id);
+      return (x = T.find((A) => A.id === N.id)) != null && x.delete || de.dismiss(N.id), T.filter(({ id: A }) => A !== N.id);
     });
   }, []);
-  return p.useEffect(() => ce.subscribe((N) => {
+  return p.useEffect(() => de.subscribe((N) => {
     if (N.dismiss) {
       requestAnimationFrame(() => {
         W((T) => T.map((x) => x.id === N.id ? {
@@ -2233,14 +2233,14 @@ const vr = /* @__PURE__ */ p.forwardRef(function(t, o) {
   show(e, t = "default") {
     return t === "error" ? this.error(e) : t === "warning" ? this.warning(e) : this.default(e);
   }
-}, Sr = "_modalLayout_59gb3_29", Ir = "_modalContainer_59gb3_40", Tr = "_fullHeight_59gb3_52", Er = "_slideUp_59gb3_1", Ar = "_header_59gb3_75", Dr = "_title_59gb3_84", jr = "_close_59gb3_89", zr = "_content_59gb3_99", Or = "_section_59gb3_102", Br = "_footer_59gb3_110", Rr = "_primaryButton_59gb3_140", Lr = "_critical_59gb3_153", Pr = "_warning_59gb3_157", fe = {
-  "shadow-0": "_shadow-0_59gb3_1",
-  "shadow-100": "_shadow-100_59gb3_5",
-  "shadow-200": "_shadow-200_59gb3_9",
-  "shadow-300": "_shadow-300_59gb3_13",
-  "shadow-400": "_shadow-400_59gb3_17",
-  "shadow-500": "_shadow-500_59gb3_21",
-  "shadow-600": "_shadow-600_59gb3_25",
+}, Sr = "_modalLayout_g4kr0_29", Ir = "_modalContainer_g4kr0_40", Tr = "_fullHeight_g4kr0_52", Er = "_slideUp_g4kr0_1", Ar = "_header_g4kr0_78", Dr = "_title_g4kr0_87", jr = "_close_g4kr0_92", zr = "_content_g4kr0_102", Or = "_section_g4kr0_108", Br = "_footer_g4kr0_116", Rr = "_primaryButton_g4kr0_146", Lr = "_critical_g4kr0_159", Pr = "_warning_g4kr0_163", ce = {
+  "shadow-0": "_shadow-0_g4kr0_1",
+  "shadow-100": "_shadow-100_g4kr0_5",
+  "shadow-200": "_shadow-200_g4kr0_9",
+  "shadow-300": "_shadow-300_g4kr0_13",
+  "shadow-400": "_shadow-400_g4kr0_17",
+  "shadow-500": "_shadow-500_g4kr0_21",
+  "shadow-600": "_shadow-600_g4kr0_25",
   modalLayout: Sr,
   modalContainer: Ir,
   fullHeight: Tr,
@@ -2251,9 +2251,9 @@ const vr = /* @__PURE__ */ p.forwardRef(function(t, o) {
   content: zr,
   section: Or,
   footer: Br,
-  "tone-critical": "_tone-critical_59gb3_136",
+  "tone-critical": "_tone-critical_g4kr0_142",
   primaryButton: Rr,
-  "tone-warning": "_tone-warning_59gb3_144",
+  "tone-warning": "_tone-warning_g4kr0_150",
   critical: Lr,
   warning: Pr
 }, Hr = ({
@@ -2267,30 +2267,30 @@ const vr = /* @__PURE__ */ p.forwardRef(function(t, o) {
   fullHeight: f = !1
 }) => {
   if (!e) return null;
-  const m = fe[`tone-${r}`] || "";
+  const m = ce[`tone-${r}`] || "";
   return jo(
     /* @__PURE__ */ c(
       "div",
       {
-        className: fe.modalLayout,
+        className: ce.modalLayout,
         onClick: t,
         children: /* @__PURE__ */ z(
           "div",
           {
             className: I(
-              fe.modalContainer,
+              ce.modalContainer,
               m,
-              f && fe.fullHeight
+              f && ce.fullHeight
             ),
             onClick: (u) => u.stopPropagation(),
             role: "dialog",
             "aria-modal": "true",
             "aria-labelledby": "modal-title",
             children: [
-              /* @__PURE__ */ z("div", { className: fe.header, children: [
-                /* @__PURE__ */ z("div", { className: fe.title, children: [
-                  r === "critical" && /* @__PURE__ */ c(eo, { className: fe.critical }),
-                  r === "warning" && /* @__PURE__ */ c(to, { className: fe.warning }),
+              /* @__PURE__ */ z("div", { className: ce.header, children: [
+                /* @__PURE__ */ z("div", { className: ce.title, children: [
+                  r === "critical" && /* @__PURE__ */ c(eo, { className: ce.critical }),
+                  r === "warning" && /* @__PURE__ */ c(to, { className: ce.warning }),
                   /* @__PURE__ */ c(ae, { variant: "heading-sm", children: o })
                 ] }),
                 /* @__PURE__ */ c(
@@ -2304,12 +2304,21 @@ const vr = /* @__PURE__ */ p.forwardRef(function(t, o) {
                   }
                 )
               ] }),
-              /* @__PURE__ */ c("div", { className: fe.content, children: l }),
-              /* @__PURE__ */ z("div", { className: fe.footer, children: [
+              /* @__PURE__ */ c(
+                "div",
+                {
+                  className: I(
+                    ce.content,
+                    f && ce.fullHeight
+                  ),
+                  children: l
+                }
+              ),
+              /* @__PURE__ */ z("div", { className: ce.footer, children: [
                 a.map((u, g) => /* @__PURE__ */ c(
                   it,
                   {
-                    className: fe.secondaryButton,
+                    className: ce.secondaryButton,
                     ...u,
                     children: u.children
                   },
@@ -2320,7 +2329,7 @@ const vr = /* @__PURE__ */ p.forwardRef(function(t, o) {
                   {
                     type: "button",
                     state: "primary",
-                    className: fe.primaryButton,
+                    className: ce.primaryButton,
                     ...n,
                     children: n.children
                   }
@@ -2333,7 +2342,7 @@ const vr = /* @__PURE__ */ p.forwardRef(function(t, o) {
     ),
     document.body
   );
-}, Vr = ({ children: e }) => /* @__PURE__ */ c("section", { className: fe.section, children: e }), kt = Hr;
+}, Vr = ({ children: e }) => /* @__PURE__ */ c("section", { className: ce.section, children: e }), kt = Hr;
 kt.Section = Vr;
 function pt(e) {
   const t = document.createElement("div");
@@ -2855,7 +2864,7 @@ const Q = (e) => {
     k,
     w,
     v
-  ], ee = () => ["none", O, w, v], U = () => ["none", O, w, v], ie = () => [O, w, v], de = () => [Ve, "full", ...y()];
+  ], ee = () => ["none", O, w, v], U = () => ["none", O, w, v], ie = () => [O, w, v], ue = () => [Ve, "full", ...y()];
   return {
     cacheSize: 500,
     theme: {
@@ -4905,28 +4914,28 @@ const Q = (e) => {
        * @see https://tailwindcss.com/docs/translate
        */
       translate: [{
-        translate: de()
+        translate: ue()
       }],
       /**
        * Translate X
        * @see https://tailwindcss.com/docs/translate
        */
       "translate-x": [{
-        "translate-x": de()
+        "translate-x": ue()
       }],
       /**
        * Translate Y
        * @see https://tailwindcss.com/docs/translate
        */
       "translate-y": [{
-        "translate-y": de()
+        "translate-y": ue()
       }],
       /**
        * Translate Z
        * @see https://tailwindcss.com/docs/translate
        */
       "translate-z": [{
-        "translate-z": de()
+        "translate-z": ue()
       }],
       /**
        * Translate None