prometeo-design-system 4.7.2 → 4.7.4

package/dist/Chip.es.js

@@ -37,7 +37,7 @@ const m = {
             e || (s.stopPropagation(), s.preventDefault(), a && n?.(a));
           },
           className: r(
-            "shrink-0 p-0.5 transition-all duration-200 hover:text-neutral-default-hover cursor-pointer z-50 text-neutral-default-default hover:scale-105",
+            "shrink-0 p-0.5 transition-all duration-200 hover:text-neutral-default-hover cursor-pointer z-10 text-neutral-default-default hover:scale-105",
             e && "cursor-default hover:scale-100"
           ),
           type: "button",

package/dist/DialogModal.es.js

@@ -140,7 +140,7 @@ x.displayName = "DialogContent";
 const g = y(({ children: t, className: n, debugMode: o }) => /* @__PURE__ */ e.jsx("h1", { className: m("prometeo-fonts-headline-small text-neutral-strong-default w-max", o && 'bg-red-400/40 relative after:content-["TITLE"] after:absolute after:top-0 after:-translate-y-5 after:left-0 after:w-max after:h-full after:text-red-500 after:prometeo-fonts-label-large', n), children: t }));
 g.displayName = "DialogTitle";
 const p = y(({ children: t, className: n, title: o, debugMode: s }) => /* @__PURE__ */ e.jsxs("div", { className: m(
-  "p-4",
+  "px-6 pt-8 pb-4",
   s && "border-2 border-dashed border-red-600 bg-red-200/40! relative after:content-['HEADER'] after:absolute after:top-1 after:left-1/2 after:w-max after:h-full after:text-red-500",
   n
 ), children: [

package/dist/PyrionLayout.es.js

@@ -2,7 +2,7 @@ import { j as e } from "./jsx-runtime-GkKLlHH4.js";
 import { u as Ke, g as gt } from "./useDevice-vwn4GLwK.js";
 import { c as T } from "./cn-B6yFEsav.js";
 import { g as ye } from "./utils-X4-h3cum.js";
-import He, { forwardRef as he, useState as G, useRef as O, useEffect as ne, memo as R, useContext as Ye, createContext as Ee, useCallback as x, Children as vt, isValidElement as Se, useMemo as me, useImperativeHandle as _e, useLayoutEffect as wt, use as Nt } from "react";
+import He, { forwardRef as he, useState as G, useRef as I, useEffect as ne, memo as R, useContext as Ye, createContext as Ee, useCallback as x, Children as vt, isValidElement as Se, useMemo as me, useImperativeHandle as _e, useLayoutEffect as wt, use as Nt } from "react";
 import { createPortal as Ve } from "react-dom";
 import { useLocation as yt, useNavigate as St } from "react-router";
 import { CloseNavBarDesktop as Ct } from "./Icons/CloseNavBarDesktop.es.js";
@@ -23,7 +23,7 @@ import { Close as Me } from "./Icons/Close.es.js";
 import { Help as Qe } from "./Icons/Help.es.js";
 import { Settings as Ot } from "./Icons/Settings.es.js";
 const It = he((t, r) => {
-  const [s, o] = G(t?.currentTabName || t.tabs[0].name), c = O(null), { tabs: l = [], className: u, activeColor: i = "var(--neutral-900)", currentSystemId: m } = t;
+  const [s, a] = G(t?.currentTabName || t.tabs[0].name), c = I(null), { tabs: l = [], className: u, activeColor: i = "var(--neutral-900)", currentSystemId: m } = t;
   ne(() => {
     c.current?.style.setProperty("--tab-bg", i);
   }, [i]);
@@ -43,7 +43,7 @@ const It = he((t, r) => {
       children: l.map(
         (d) => {
           const w = d.name === p?.name, h = typeof d.thumbnail == "string" ? /* @__PURE__ */ e.jsx("img", { src: d.thumbnail, alt: d.description, className: "aspect-square object-contain rounded", draggable: !1 }) : d.thumbnail, C = () => {
-            d.disabled || (o(d.name), d.onClick && d.onClick(d.name));
+            d.disabled || (a(d.name), d.onClick && d.onClick(d.name));
           };
           return /* @__PURE__ */ e.jsx(
             "div",
@@ -72,7 +72,7 @@ const It = he((t, r) => {
       )
     }
   );
-}), Ze = R(he(({ children: t, className: r, context: s, modal: o = !1, closeOnOverlayClick: c = !1, unmountChildrenOnClose: l = !0 }, u) => {
+}), Ze = R(he(({ children: t, className: r, context: s, modal: a = !1, closeOnOverlayClick: c = !1, unmountChildrenOnClose: l = !0 }, u) => {
   const i = xe(t, s), m = typeof window < "u" && window.matchMedia("(min-width: 768px)").matches, { isSidebarOpen: p } = Et(), { closeSidebar: d } = ce(), [w, h] = G(() => l ? p : !0), [C, A] = G(!1);
   return ne(() => {
     l && s?.subscribeToSidebarOpen((N) => {
@@ -85,8 +85,8 @@ const It = he((t, r) => {
       C && (h(!1), A(!1));
     };
     return N.addEventListener("transitionend", y), () => N.removeEventListener("transitionend", y);
-  }, [C]), /* @__PURE__ */ e.jsxs("div", { ref: u, className: T("sidebar", m ? "collapsed" : "expanded", "h-full overflow-auto", r), "aria-modal": o || void 0, children: [
-    o && m && /* @__PURE__ */ e.jsx(
+  }, [C]), /* @__PURE__ */ e.jsxs("div", { ref: u, className: T("sidebar", m ? "collapsed" : "expanded", "h-full overflow-auto", r), "aria-modal": a || void 0, children: [
+    a && m && /* @__PURE__ */ e.jsx(
       "div",
       {
         className: T("navigation-drawer-sidebar-overlay"),
@@ -124,7 +124,7 @@ const It = he((t, r) => {
     } catch {
     }
 }, Pt = (t) => {
-  const { children: r, classNameDrawer: s, classNameSidebar: o, disableDragOpen: c, modal: l = !0, closeOnOutsideClick: u = !0 } = t, i = O(null), m = O(null), p = t.outletRef ?? O(null), d = O(null), w = O(We()), h = O(!1), C = O("drawer"), A = O(/* @__PURE__ */ new Set()), N = O(/* @__PURE__ */ new Set()), y = O(!1), D = O(null), W = x((n) => {
+  const { children: r, classNameDrawer: s, classNameSidebar: a, disableDragOpen: c, modal: l = !0, closeOnOutsideClick: u = !0 } = t, i = I(null), m = I(null), p = t.outletRef ?? I(null), d = I(null), w = I(We()), h = I(!1), C = I("drawer"), A = I(/* @__PURE__ */ new Set()), N = I(/* @__PURE__ */ new Set()), y = I(!1), D = I(null), W = x((n) => {
     const f = m.current;
     f && (f.classList.toggle("collapsed", n), f.classList.toggle("expanded", !n));
   }, []), q = x((n) => {
@@ -136,31 +136,31 @@ const It = he((t, r) => {
   }, []), j = x(
     (n, { notify: f = !0 } = {}) => {
       const g = w.current !== n;
-      w.current = n, _t(n), W(n), f && g && A.current.forEach((I) => I(n));
+      w.current = n, _t(n), W(n), f && g && A.current.forEach((E) => E(n));
     },
     [W]
   ), U = x(
     (n, { notify: f = !0 } = {}) => {
       const g = h.current !== n;
       if (h.current = n, q(n), f && g) {
-        const I = !n;
-        N.current.forEach((H) => H(I));
+        const E = !n;
+        N.current.forEach((H) => H(E));
       }
     },
     [q]
   ), S = x(
     (n, { notify: f = !0 } = {}) => {
-      const g = C.current, I = g !== n;
+      const g = C.current, E = g !== n;
       C.current = n, window.matchMedia("(min-width: 768px)").matches || j(n !== "drawer", { notify: f });
       const H = g === "sidebar", F = n === "sidebar";
-      f && I && H !== F && N.current.forEach((re) => re(F)), U(n !== "sidebar", { notify: f }), j(n !== "drawer", { notify: f });
+      f && E && H !== F && N.current.forEach((re) => re(F)), U(n !== "sidebar", { notify: f }), j(n !== "drawer", { notify: f });
     },
     [j, U]
   ), $ = x((n) => {
     const f = i.current;
     if (!f || window.matchMedia("(min-width: 768px)").matches) return;
     y.current = !0;
-    const g = p.current?.offsetLeft ?? 0, I = d.current?.offsetLeft ?? g, H = n === "drawer" ? 0 : n === "sidebar" ? I : g;
+    const g = p.current?.offsetLeft ?? 0, E = d.current?.offsetLeft ?? g, H = n === "drawer" ? 0 : n === "sidebar" ? E : g;
     D.current = H, f.scrollTo({ left: H, behavior: "smooth" });
     const F = () => {
       y.current = !1, D.current = null, f.removeEventListener("scrollend", F);
@@ -174,13 +174,13 @@ const It = he((t, r) => {
     const g = [
       { panel: "drawer", offset: 0 },
       { panel: "outlet", offset: f.offsetLeft }
-    ], I = d.current;
-    I && g.push({ panel: "sidebar", offset: I.offsetLeft });
+    ], E = d.current;
+    E && g.push({ panel: "sidebar", offset: E.offsetLeft });
     const H = n.scrollLeft;
     let F = g[0], re = Math.abs(H - F.offset);
-    for (let oe = 1; oe < g.length; oe++) {
-      const fe = Math.abs(H - g[oe].offset);
-      fe < re && (F = g[oe], re = fe);
+    for (let ae = 1; ae < g.length; ae++) {
+      const fe = Math.abs(H - g[ae].offset);
+      fe < re && (F = g[ae], re = fe);
     }
     S(F.panel);
   }, [S]);
@@ -191,8 +191,8 @@ const It = he((t, r) => {
     const n = i.current, f = p.current;
     if (!n || !f) return;
     if (window.matchMedia("(min-width: 768px)").matches) {
-      const I = We();
-      j(I, { notify: !1 }), U(!0, { notify: !1 });
+      const E = We();
+      j(E, { notify: !1 }), U(!0, { notify: !1 });
       return;
     }
     requestAnimationFrame(() => {
@@ -201,13 +201,13 @@ const It = he((t, r) => {
   }, [S, j, U]), ne(() => {
     const n = i.current;
     if (!n || !p.current) return;
-    let g = !1, I = 0, H = 0;
+    let g = !1, E = 0, H = 0;
     const F = (L) => {
-      I = L.touches[0].clientX, H = L.touches[0].clientY;
+      E = L.touches[0].clientX, H = L.touches[0].clientY;
     }, re = (L, K) => {
       const V = window.getComputedStyle(L), le = K === "x" ? V.overflowX : V.overflowY;
       return /(auto|scroll|overlay)/.test(le) ? K === "x" ? L.scrollWidth > L.clientWidth : L.scrollHeight > L.clientHeight : !1;
-    }, oe = (L, K) => {
+    }, ae = (L, K) => {
       let V = L;
       for (; V && V !== n; ) {
         if (re(V, K))
@@ -217,8 +217,8 @@ const It = he((t, r) => {
       return null;
     }, fe = (L, K, V) => V === 0 ? !1 : K === "x" ? V < 0 ? L.scrollLeft + L.clientWidth < L.scrollWidth : L.scrollLeft > 0 : V < 0 ? L.scrollTop + L.clientHeight < L.scrollHeight : L.scrollTop > 0, we = (L) => {
       if (!(L.target instanceof HTMLElement)) return;
-      const K = L.touches[0].clientX - I, V = L.touches[0].clientY - H, le = Math.abs(K) > Math.abs(V) ? "x" : "y", a = le === "x" ? K : V, v = oe(L.target, le);
-      if (v && fe(v, le, a))
+      const K = L.touches[0].clientX - E, V = L.touches[0].clientY - H, le = Math.abs(K) > Math.abs(V) ? "x" : "y", o = le === "x" ? K : V, v = ae(L.target, le);
+      if (v && fe(v, le, o))
         return;
       const P = n.classList.contains("disabled-dragopen"), k = n.classList.contains("disabled-dragopen-sidebar"), J = () => L.cancelable ? (L.preventDefault(), !0) : !1;
       if (le === "x") {
@@ -260,14 +260,14 @@ const It = he((t, r) => {
     }
     const g = f ? "outlet" : "drawer";
     S(g), $(g);
-  }, [$, S, j]), X = O(null);
+  }, [$, S, j]), X = I(null);
   X.current || (X.current = {
     toggleCollapse: () => Y(),
     getIsCollapsed: () => {
       if (!window.matchMedia("(min-width: 768px)").matches) {
         const f = i.current, g = p.current;
         if (f && g) {
-          const I = f.scrollLeft, H = g.offsetLeft, F = Math.abs(I - H) < Math.abs(I - 0);
+          const E = f.scrollLeft, H = g.offsetLeft, F = Math.abs(E - H) < Math.abs(E - 0);
           return F !== w.current && (w.current = F, W(F)), F;
         }
       }
@@ -310,10 +310,10 @@ const It = he((t, r) => {
       if (!f) return;
       const g = f.scrollLeft;
       if (n) {
-        const I = f.style.scrollBehavior;
+        const E = f.style.scrollBehavior;
         f.style.scrollBehavior = "auto", f.classList.remove("disabled-dragopen"), requestAnimationFrame(() => {
           f.scrollLeft = g, requestAnimationFrame(() => {
-            f.style.scrollBehavior = I;
+            f.style.scrollBehavior = E;
           });
         });
       } else
@@ -323,20 +323,20 @@ const It = he((t, r) => {
       const f = i.current;
       if (f)
         if (n) {
-          const g = f.scrollLeft, I = f.style.scrollBehavior;
+          const g = f.scrollLeft, E = f.style.scrollBehavior;
           f.style.scrollBehavior = "auto", f.classList.remove("disabled-dragopen-sidebar"), requestAnimationFrame(() => {
             f.scrollLeft = g, requestAnimationFrame(() => {
-              f.style.scrollBehavior = I;
+              f.style.scrollBehavior = E;
             });
           });
         } else
           f.classList.add("disabled-dragopen-sidebar");
     }
   });
-  const E = X.current, _ = typeof r == "function" ? r(E) : r, b = vt.toArray(_);
+  const O = X.current, _ = typeof r == "function" ? r(O) : r, b = vt.toArray(_);
   let M = null, B = null, z = null;
   const Z = [];
-  let ae = null, ee = null;
+  let oe = null, ee = null;
   b.forEach((n) => {
     if (!Se(n)) {
       Z.push(n);
@@ -354,8 +354,8 @@ const It = he((t, r) => {
       z = n;
       return;
     }
-    if (n.type === Oe && !ae) {
-      ae = n;
+    if (n.type === Oe && !oe) {
+      oe = n;
       return;
     }
     if (n.type === Ze && !ee) {
@@ -364,11 +364,11 @@ const It = he((t, r) => {
     }
     Z.push(n);
   });
-  const ge = !!B, ve = B ?? (Z.length ? /* @__PURE__ */ e.jsx(je, { children: Z }) : null), Le = ge ? Z : [], de = ae ?? (!!ae ? /* @__PURE__ */ e.jsx(Oe, { children: _, context: E, modal: l, closeOnOutsideClick: u }) : null), De = z ?? (!!z ? /* @__PURE__ */ e.jsx(ke, { children: z }) : null), Ae = !!ee, te = ee, ue = me(() => ({
+  const ge = !!B, ve = B ?? (Z.length ? /* @__PURE__ */ e.jsx(je, { children: Z }) : null), Le = ge ? Z : [], de = oe ?? (!!oe ? /* @__PURE__ */ e.jsx(Oe, { children: _, context: O, modal: l, closeOnOutsideClick: u }) : null), De = z ?? (!!z ? /* @__PURE__ */ e.jsx(ke, { children: z }) : null), Ae = !!ee, te = ee, ue = me(() => ({
     isCollapsed: w.current,
     isSidebarOpen: !h.current
   }), [w.current, h.current]);
-  return /* @__PURE__ */ e.jsx(et.Provider, { value: ue, children: /* @__PURE__ */ e.jsx(tt.Provider, { value: E, children: /* @__PURE__ */ e.jsxs("div", { id: "navigation-drawer-container", ref: i, className: T(
+  return /* @__PURE__ */ e.jsx(et.Provider, { value: ue, children: /* @__PURE__ */ e.jsx(tt.Provider, { value: O, children: /* @__PURE__ */ e.jsxs("div", { id: "navigation-drawer-container", ref: i, className: T(
     "w-full h-full max-h-dvh overflow-y-hidden",
     Ae ? "navigation-drawer-with-sidebar" : "navigation-drawer",
     c?.drawer ? "disabled-dragopen" : "",
@@ -401,7 +401,7 @@ const It = he((t, r) => {
     de && Se(de) ? He.cloneElement(de, { ref: p, modal: l, closeOnOutsideClick: u }) : de,
     te && Se(te) ? He.cloneElement(te, {
       ref: d,
-      className: T("sidebar", te.props?.className, o)
+      className: T("sidebar", te.props?.className, a)
     }) : te
   ] }) }) });
 }, qe = R(Pt), st = R(({ onToggleCollapse: t }) => /* @__PURE__ */ e.jsx(
@@ -415,28 +415,28 @@ const It = he((t, r) => {
 ), (t, r) => t.onToggleCollapse === r.onToggleCollapse);
 st.displayName = "NavigationDrawerCollapseButton";
 const Re = R(({ children: t, className: r, context: s }) => {
-  const o = xe(t, s);
-  return /* @__PURE__ */ e.jsx("div", { className: T("flex items-center justify-between", r), children: o });
+  const a = xe(t, s);
+  return /* @__PURE__ */ e.jsx("div", { className: T("flex items-center justify-between", r), children: a });
 });
 Re.displayName = "NavigationDrawerHeader";
-const je = R(({ children: t, className: r, context: s, ...o }) => {
+const je = R(({ children: t, className: r, context: s, ...a }) => {
   const c = xe(t, s);
-  return /* @__PURE__ */ e.jsx("div", { ...o, className: T("w-full flex-1 drawer-content select-none", r), children: c });
+  return /* @__PURE__ */ e.jsx("div", { ...a, className: T("w-full flex-1 drawer-content select-none", r), children: c });
 });
 je.displayName = "NavigationDrawerContent";
 const ke = R(({ children: t, className: r, context: s }) => {
-  const o = xe(t, s);
-  return /* @__PURE__ */ e.jsx("div", { className: T("flex items-center justify-between", r), children: o });
+  const a = xe(t, s);
+  return /* @__PURE__ */ e.jsx("div", { className: T("flex items-center justify-between", r), children: a });
 });
 ke.displayName = "NavigationDrawerFooter";
 const nt = R(({ className: t }) => /* @__PURE__ */ e.jsx("div", { className: T("w-full border-t border-neutral-strong-default ", t) }));
 nt.displayName = "NavigationDrawerSpacer";
-const Oe = R(he(({ children: t, className: r, context: s, modal: o, closeOnOutsideClick: c }, l) => {
+const Oe = R(he(({ children: t, className: r, context: s, modal: a, closeOnOutsideClick: c }, l) => {
   const u = xe(t, s), i = ce(), m = () => {
     c && (i.toggleCollapse(), i.closeSidebar());
   };
   return /* @__PURE__ */ e.jsx(e.Fragment, { children: /* @__PURE__ */ e.jsxs("div", { id: "navigation-drawer-outlet", ref: l, className: T("flex-1 overflow-auto relative h-full max-h-dvh", r), children: [
-    o && /* @__PURE__ */ e.jsx("div", { className: "navigation-drawer-backdrop select-none", onClick: m }),
+    a && /* @__PURE__ */ e.jsx("div", { className: "navigation-drawer-backdrop select-none", onClick: m }),
     u
   ] }) });
 }), (t, r) => t.children === r.children && t.className === r.className), se = Object.assign(qe, {
@@ -509,7 +509,7 @@ const Mt = "hover:bg-neutral-medium-hover", Rt = Pe("", {
   const {
     title: r,
     icon: s,
-    count: o,
+    count: a,
     className: c,
     isSelected: l = !1,
     hasSublinks: u,
@@ -528,7 +528,7 @@ const Mt = "hover:bg-neutral-medium-hover", Rt = Pe("", {
       /* @__PURE__ */ e.jsx("label", { className: Bt({ disabled: h, isSelected: l }), children: r })
     ] }),
     /* @__PURE__ */ e.jsxs("div", { className: "flex gap-1 items-center", children: [
-      o && o ? /* @__PURE__ */ e.jsx(Xe, { count: o, maxCount: 9, className: "badge", disabled: h }) : "",
+      a && a ? /* @__PURE__ */ e.jsx(Xe, { count: a, maxCount: 9, className: "badge", disabled: h }) : "",
       u && /* @__PURE__ */ e.jsx(
         "div",
         {
@@ -584,14 +584,14 @@ const Mt = "hover:bg-neutral-medium-hover", Rt = Pe("", {
 }, Be = R(Ft);
 Be.displayName = "NavigationDrawerItemBase";
 const zt = (t) => {
-  const { title: r, icon: s, count: o, className: c, isActive: l, onClick: u, isView: i = !0, disabled: m, tooltipText: p } = t;
+  const { title: r, icon: s, count: a, className: c, isActive: l, onClick: u, isView: i = !0, disabled: m, tooltipText: p } = t;
   return i ? /* @__PURE__ */ e.jsx(
     Be,
     {
       as: "button",
       title: r,
       icon: s,
-      count: o,
+      count: a,
       className: c,
       isSelected: l,
       onClick: u,
@@ -599,9 +599,9 @@ const zt = (t) => {
       tooltipText: p
     }
   ) : null;
-}, at = R(zt);
-at.displayName = "NavigationDrawerActionItem";
-const Ut = ({ actions: t, activeActionId: r, onActionClick: s, className: o }) => /* @__PURE__ */ e.jsx(be, { className: T("flex flex-col gap-2 w-full ", o), scrollbarProps: { hide: !0 }, persistScroll: "navigation-actions", indicators: {
+}, ot = R(zt);
+ot.displayName = "NavigationDrawerActionItem";
+const Ut = ({ actions: t, activeActionId: r, onActionClick: s, className: a }) => /* @__PURE__ */ e.jsx(be, { className: T("flex flex-col gap-2 w-full ", a), scrollbarProps: { hide: !0 }, persistScroll: "navigation-actions", indicators: {
   top: { type: "shadow", behavior: "scroll-on-hover", show: !0 },
   bottom: { type: "shadow", behavior: "scroll-on-hover", show: !0 }
 }, children: t?.map((c) => {
@@ -609,7 +609,7 @@ const Ut = ({ actions: t, activeActionId: r, onActionClick: s, className: o }) =
     s?.(l, m), u?.();
   };
   return i ? /* @__PURE__ */ e.jsx(
-    at,
+    ot,
     {
       ...p,
       id: l,
@@ -618,19 +618,19 @@ const Ut = ({ actions: t, activeActionId: r, onActionClick: s, className: o }) =
     },
     l
   ) : null;
-}) }), ot = R(Ut);
-ot.displayName = "NavigationDrawerActions";
+}) }), at = R(Ut);
+at.displayName = "NavigationDrawerActions";
 const Ht = (t) => {
-  const { className: r, title: s, path: o, onClick: c, isSelected: l, parentPath: u } = t, i = x(() => {
-    c?.(o);
-  }, [o]), m = x(() => {
-    if (o.startsWith("./")) {
+  const { className: r, title: s, path: a, onClick: c, isSelected: l, parentPath: u } = t, i = x(() => {
+    c?.(a);
+  }, [a]), m = x(() => {
+    if (a.startsWith("./")) {
       if (!u) return;
-      const p = u + o.slice(2);
+      const p = u + a.slice(2);
       window.open(p, "_blank");
     } else
-      window.open(o, "_blank");
-  }, [o]);
+      window.open(a, "_blank");
+  }, [a]);
   return /* @__PURE__ */ e.jsx(
     "a",
     {
@@ -654,14 +654,14 @@ const Ht = (t) => {
 }, lt = R(Ht);
 lt.displayName = "NavItemSecondary";
 const Vt = he((t, r) => {
-  const [s, o] = G(!0), c = O(null), { path: l, title: u, icon: i, count: m, className: p, isSelected: d = !1, onClick: w, sublinks: h, toggleCollapse: C, getIsCollapsed: A, subscribeToCollapse: N, isView: y = !0, disabled: D, tooltipText: W } = t;
+  const [s, a] = G(!0), c = I(null), { path: l, title: u, icon: i, count: m, className: p, isSelected: d = !1, onClick: w, sublinks: h, toggleCollapse: C, getIsCollapsed: A, subscribeToCollapse: N, isView: y = !0, disabled: D, tooltipText: W } = t;
   ne(() => N ? N((_) => {
-    _ && o(!0);
+    _ && a(!0);
   }) : void 0, [N]);
   const q = x(() => {
-    o((E) => !E);
-  }, []), j = x((E) => {
-    o(E);
+    a((O) => !O);
+  }, []), j = x((O) => {
+    a(O);
   }, []), U = {
     toggle: q,
     setIsCollapsed: j,
@@ -676,8 +676,8 @@ const Vt = he((t, r) => {
   };
   _e(r, () => U, [U, s, A, C]);
   const S = i, $ = x(() => {
-    const E = A?.() ?? !1;
-    if (h && h.length > 0 && E) {
+    const O = A?.() ?? !1;
+    if (h && h.length > 0 && O) {
       j(!1), C?.();
       return;
     }
@@ -688,7 +688,7 @@ const Vt = he((t, r) => {
     if (!h || D) return null;
     if (t.subLinksRender && h)
       return t.subLinksRender(h, U);
-    const E = x((_) => {
+    const O = x((_) => {
       if (_.startsWith("./")) {
         const b = l + _.slice(2);
         w?.(b);
@@ -700,9 +700,9 @@ const Vt = he((t, r) => {
       if (!_) return;
       const b = _.scrollHeight;
       _.style.setProperty("--sublinks-max-height", `${b}px`);
-    }, []), /* @__PURE__ */ e.jsx("div", { ref: c, className: `sublinks flex flex-col gap-1 ml-8 ${s ? "collapsed" : "expanded"}`, children: h.map((_) => /* @__PURE__ */ e.jsx(lt, { ..._, onClick: E, parentPath: l }, `${_.title}-${_.path}`)) });
-  }, X = (E) => {
-    E.stopPropagation(), E.preventDefault(), q();
+    }, []), /* @__PURE__ */ e.jsx("div", { ref: c, className: `sublinks flex flex-col gap-1 ml-8 ${s ? "collapsed" : "expanded"}`, children: h.map((_) => /* @__PURE__ */ e.jsx(lt, { ..._, onClick: O, parentPath: l }, `${_.title}-${_.path}`)) });
+  }, X = (O) => {
+    O.stopPropagation(), O.preventDefault(), q();
   };
   return y ? /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-2 ", children: [
     /* @__PURE__ */ e.jsx(
@@ -727,7 +727,7 @@ const Vt = he((t, r) => {
   ] }) : null;
 }), it = R(Vt);
 it.displayName = "NavigationDrawerLinkItem";
-const Wt = ({ navlinks: t, handleNavigation: r, className: s, getIsCollapsed: o, toggleCollapse: c, subscribeToCollapse: l }) => {
+const Wt = ({ navlinks: t, handleNavigation: r, className: s, getIsCollapsed: a, toggleCollapse: c, subscribeToCollapse: l }) => {
   const { pathname: u } = yt();
   return /* @__PURE__ */ e.jsx(be, { className: T("flex flex-col gap-2 w-full ", s), scrollbarProps: { hide: !0 }, persistScroll: "navigation-links", indicators: {
     top: { type: "shadow", behavior: "scroll-on-hover", show: !0 },
@@ -741,7 +741,7 @@ const Wt = ({ navlinks: t, handleNavigation: r, className: s, getIsCollapsed: o,
         isSelected: p,
         onClick: r,
         toggleCollapse: c,
-        getIsCollapsed: o,
+        getIsCollapsed: a,
         subscribeToCollapse: l,
         disabled: i.disabled,
         isView: i.isView
@@ -751,7 +751,7 @@ const Wt = ({ navlinks: t, handleNavigation: r, className: s, getIsCollapsed: o,
   }) });
 }, ct = R(Wt);
 ct.displayName = "NavigationDrawerNavlinks";
-const dt = R(({ navlinks: t, handleNavigation: r, allActions: s, activeActionId: o, onActionClick: c }) => {
+const dt = R(({ navlinks: t, handleNavigation: r, allActions: s, activeActionId: a, onActionClick: c }) => {
   const { getIsCollapsed: l, toggleCollapse: u, subscribeToCollapse: i } = ce();
   return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
     /* @__PURE__ */ e.jsx(se.Spacer, { className: "pb-3" }),
@@ -768,10 +768,10 @@ const dt = R(({ navlinks: t, handleNavigation: r, allActions: s, activeActionId:
         }
       ),
       /* @__PURE__ */ e.jsx(
-        ot,
+        at,
         {
           actions: s,
-          activeActionId: o,
+          activeActionId: a,
           onActionClick: c,
           className: "max-h-[30dvh]"
         }
@@ -781,7 +781,7 @@ const dt = R(({ navlinks: t, handleNavigation: r, allActions: s, activeActionId:
 }, (t, r) => t.navlinks === r.navlinks && t.handleNavigation === r.handleNavigation && t.allActions === r.allActions && t.activeActionId === r.activeActionId && t.onActionClick === r.onActionClick);
 dt.displayName = "PyrionNavigationDrawer.Content";
 const qt = (t) => {
-  const { sessions: r, onSessionClick: s, secondarySlot: o, subImageUrlAccessor: c } = t;
+  const { sessions: r, onSessionClick: s, secondarySlot: a, subImageUrlAccessor: c } = t;
   if (!r || r.length === 0)
     return null;
   const l = (m) => {
@@ -795,7 +795,7 @@ const qt = (t) => {
     const d = ye({ metadata: p }, c);
     if (d != null)
       return typeof d == "string" ? d : String(d);
-  }, i = x((m) => typeof o == "function" ? o(m) : o, [o]);
+  }, i = x((m) => typeof a == "function" ? a(m) : a, [a]);
   return /* @__PURE__ */ e.jsx("div", { className: "w-full h-full flex flex-col gap-2", children: r?.map((m) => {
     const { auth_id: p } = m;
     return /* @__PURE__ */ e.jsx(ie, { className: " shrink-0 h-max", children: /* @__PURE__ */ e.jsx(ie.Content, { onClick: () => l(m), className: "p-0 group-data-[expanded=true]/ticketcard:border-none", children: /* @__PURE__ */ e.jsx(
@@ -815,7 +815,7 @@ const qt = (t) => {
   state: t,
   currentAppSessions: r,
   resolveUserSecondarySlot: s,
-  resolveSessionSecondarySlot: o,
+  resolveSessionSecondarySlot: a,
   onSessionClick: c,
   onLogoutClick: l,
   onProfileClick: u,
@@ -852,7 +852,7 @@ const qt = (t) => {
             {
               sessions: r,
               onSessionClick: c,
-              secondarySlot: o,
+              secondarySlot: a,
               subImageUrlAccessor: i?.sessionCardOptions?.subImageUrlAccessor,
               currentSystemId: m
             }
@@ -879,8 +879,8 @@ const qt = (t) => {
     ] })
   ] });
 }, ut = R($t, (t, r) => {
-  const s = Object.keys(t), o = Object.keys(r);
-  if (s.length !== o.length)
+  const s = Object.keys(t), a = Object.keys(r);
+  if (s.length !== a.length)
     return !1;
   for (const c of s) {
     if (!Object.prototype.hasOwnProperty.call(r, c))
@@ -897,23 +897,23 @@ const Kt = ({ tabs: t, content: r, controls: s }) => /* @__PURE__ */ e.jsxs(ie,
   /* @__PURE__ */ e.jsxs(ie.Options, { children: [
     /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col p-2 pl-4 gap-2", children: [
       /* @__PURE__ */ e.jsx("p", { className: " prometeo-fonts-label-medium text-neutral-medium-default", children: "Cambiar módulo" }),
-      /* @__PURE__ */ e.jsx(be, { className: "max-h-52", scrollbarProps: { hide: !0 }, children: t?.map((o) => {
-        const c = typeof o.thumbnail == "string" ? /* @__PURE__ */ e.jsx(
+      /* @__PURE__ */ e.jsx(be, { className: "max-h-52", scrollbarProps: { hide: !0 }, children: t?.map((a) => {
+        const c = typeof a.thumbnail == "string" ? /* @__PURE__ */ e.jsx(
           "img",
           {
-            src: o.thumbnail,
-            alt: o.description,
+            src: a.thumbnail,
+            alt: a.description,
             className: "size-8 aspect-square rounded",
             draggable: !1
           }
-        ) : o.thumbnail, l = () => {
-          o.disabled || o.onClick && o.onClick(o.name);
+        ) : a.thumbnail, l = () => {
+          a.disabled || a.onClick && a.onClick(a.name);
         };
         return /* @__PURE__ */ e.jsxs("div", { onClick: l, className: "flex gap-2 p-2 rounded-lg h-12", children: [
           c,
           /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col items-center h-full justify-center  ", children: [
-            /* @__PURE__ */ e.jsx("p", { className: "prometeo-fonts-label-large text-neutral-default-default line-clamp-1", children: o.name }),
-            o.description && /* @__PURE__ */ e.jsx("p", { className: "prometeo-fonts-body-small text-neutral-medium-default line-clamp-1", children: o.description })
+            /* @__PURE__ */ e.jsx("p", { className: "prometeo-fonts-label-large text-neutral-default-default line-clamp-1", children: a.name }),
+            a.description && /* @__PURE__ */ e.jsx("p", { className: "prometeo-fonts-body-small text-neutral-medium-default line-clamp-1", children: a.description })
           ] })
         ] });
       }) })
@@ -921,7 +921,7 @@ const Kt = ({ tabs: t, content: r, controls: s }) => /* @__PURE__ */ e.jsxs(ie,
     /* @__PURE__ */ e.jsx("div", {})
   ] })
 ] }), Ie = R(({ enabled_systems: t, onClick: r, currentSystemId: s }) => {
-  const o = x(() => {
+  const a = x(() => {
     if (t) {
       if (s) {
         const i = t.find((m) => m._id === s);
@@ -936,7 +936,7 @@ const Kt = ({ tabs: t, content: r, controls: s }) => /* @__PURE__ */ e.jsxs(ie,
     /* @__PURE__ */ e.jsx(
       "img",
       {
-        src: o().coverImage,
+        src: a().coverImage,
         alt: "System Logo",
         className: T("w-full h-12 rounded object-contain system-cover-image ", c && "cursor-pointer"),
         draggable: !1,
@@ -946,7 +946,7 @@ const Kt = ({ tabs: t, content: r, controls: s }) => /* @__PURE__ */ e.jsxs(ie,
     /* @__PURE__ */ e.jsx(
       "img",
       {
-        src: o().thumbnail,
+        src: a().thumbnail,
         alt: "System Logo",
         className: T("w-12 h-12 rounded object-cover system-thumbnail ", c && "cursor-pointer"),
         draggable: !1,
@@ -956,7 +956,7 @@ const Kt = ({ tabs: t, content: r, controls: s }) => /* @__PURE__ */ e.jsxs(ie,
   ] });
 }, (t, r) => t.enabled_systems === r.enabled_systems && t.onClick === r.onClick && t.currentSystemId === r.currentSystemId);
 Ie.displayName = "PyrionNavigationDrawer.SystemLogo";
-const ft = R(({ onSystemLogoClick: t, state: r, currentSystemId: s, tabs: o, mobileAppSwitcherControls: c }) => {
+const ft = R(({ onSystemLogoClick: t, state: r, currentSystemId: s, tabs: a, mobileAppSwitcherControls: c }) => {
   const { getIsCollapsed: l } = ce(), u = Ke(), i = x(() => {
     if (t) {
       const m = l();
@@ -967,7 +967,7 @@ const ft = R(({ onSystemLogoClick: t, state: r, currentSystemId: s, tabs: o, mob
     Kt,
     {
       controls: c,
-      tabs: o,
+      tabs: a,
       content: /* @__PURE__ */ e.jsx(
         Ie,
         {
@@ -996,8 +996,8 @@ const $e = ({ type: t }) => {
     /* @__PURE__ */ e.jsx(Ce, { shape: "rounded", className: "w-full h-12 min-h-12" })
   ] }),
   /* @__PURE__ */ e.jsx(Ce, { shape: "rounded", className: "w-20 h-3" })
-] }), Xt = ({ onCloseClick: t, onMarkAllAsRead: r, notificationsListControls: s, scrollableControls: o }) => {
-  const [c, l] = G([]), [u, i] = G("NO_LEIDAS"), [m, p] = G({ isLoading: !1, type: "load_more" }), [d, w] = G({ hasError: !1 }), h = O(/* @__PURE__ */ new Set()), C = O(null), A = O(null), N = x((b, M = "top") => {
+] }), Xt = ({ onCloseClick: t, onMarkAllAsRead: r, notificationsListControls: s, scrollableControls: a }) => {
+  const [c, l] = G([]), [u, i] = G("NO_LEIDAS"), [m, p] = G({ isLoading: !1, type: "load_more" }), [d, w] = G({ hasError: !1 }), h = I(/* @__PURE__ */ new Set()), C = I(null), A = I(null), N = x((b, M = "top") => {
     l((B) => {
       const z = Array.isArray(b) ? M === "bottom" ? [...B, ...b] : [...b, ...B] : M === "bottom" ? [...B, b] : [b, ...B];
       return queueMicrotask(() => {
@@ -1044,8 +1044,8 @@ const $e = ({ type: t }) => {
       A.current.style.setProperty("height", `calc(100vh - ${b}px - 20px)`);
     }
   }, [C?.current]);
-  const Q = c.filter((b) => !b.read).length, { isLoading: Y, type: X } = m, { hasError: E, children: _ } = d;
-  return /* @__PURE__ */ e.jsx(
+  const Q = c.filter((b) => !b.read).length, { isLoading: Y, type: X } = m, { hasError: O, children: _ } = d;
+  return console.log("hasError", O), console.log("listenersRef", Array.from(h.current)), /* @__PURE__ */ e.jsx(
     "section",
     {
       className: "w-full md:w-[479px] bg-neutral-default-default flex flex-col border-l-0 md:border-l border-neutral-strong-default min-h-full  h-full max-h-full overflow-hidden",
@@ -1068,7 +1068,7 @@ const $e = ({ type: t }) => {
                 { id: "ALL", title: "Todas" },
                 { id: "NO_LEIDAS", title: "Sin leer" }
               ],
-              renderTab: (b, M, B, z, Z, ae, ee, ge) => /* @__PURE__ */ e.jsxs("div", { className: "relative", children: [
+              renderTab: (b, M, B, z, Z, oe, ee, ge) => /* @__PURE__ */ e.jsxs("div", { className: "relative", children: [
                 /* @__PURE__ */ e.jsx(
                   Tt,
                   {
@@ -1079,7 +1079,7 @@ const $e = ({ type: t }) => {
                     onIconClick: z,
                     onIconHover: Z,
                     iconTooltipProps: ee,
-                    iconTooltipTitle: ae,
+                    iconTooltipTitle: oe,
                     iconSize: ge
                   }
                 ),
@@ -1087,9 +1087,9 @@ const $e = ({ type: t }) => {
               ] })
             }
           ),
-          r && $ && u === "NO_LEIDAS" && !E && /* @__PURE__ */ e.jsx("div", { className: "flex justify-end px-4", children: /* @__PURE__ */ e.jsx(pe, { disabled: Y, onClick: r, label: "Marcar todas como leidas", variant: "text", animate: !1, animateIcon: !1, size: "small" }) })
+          r && $ && u === "NO_LEIDAS" && !O && /* @__PURE__ */ e.jsx("div", { className: "flex justify-end px-4", children: /* @__PURE__ */ e.jsx(pe, { disabled: Y, onClick: r, label: "Marcar todas como leidas", variant: "text", animate: !1, animateIcon: !1, size: "small" }) })
         ] }),
-        E ? /* @__PURE__ */ e.jsx("div", { className: "w-full h-full grid place-items-center", children: typeof _ == "function" ? _() : _ }) : /* @__PURE__ */ e.jsx("div", { ref: A, className: "", children: /* @__PURE__ */ e.jsxs(
+        /* @__PURE__ */ e.jsx("div", { ref: A, className: "", children: /* @__PURE__ */ e.jsxs(
           be,
           {
             className: "px-4 md:px-2 py-0 md:py-0 flex flex-col gap-3 h-full",
@@ -1097,7 +1097,7 @@ const $e = ({ type: t }) => {
             scrollbarProps: { hide: !0, size: "small" },
             axis: "y",
             disableMouseScroll: !1,
-            controls: o,
+            controls: a,
             scrollTopButton: {
               target: "2000px"
             },
@@ -1106,8 +1106,11 @@ const $e = ({ type: t }) => {
               isLoading: Y
             },
             children: [
-              Y && X === "skeletons" ? /* @__PURE__ */ e.jsx($e, { type: X }) : $ ? c?.filter((b) => u === "NO_LEIDAS" ? !b.read : b)?.map((b, M) => /* @__PURE__ */ e.jsx(Dt, { ...b, className: " border-b border-neutral-strong-default rounded-b-none last:border-b-0" }, M)) : /* @__PURE__ */ e.jsx("p", { className: "flex-1 grid place-items-center prometeo-fonts-headline-xsmall text-neutral-default-default text-center py-8 text-balance", children: "No tienes notificaciones nuevas por el momento" }),
-              Y && X === "load_more" && /* @__PURE__ */ e.jsx($e, { type: X })
+              O && /* @__PURE__ */ e.jsx("div", { className: "w-full h-full grid place-items-center", children: typeof _ == "function" ? _() : _ }),
+              !O && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+                Y && X === "skeletons" ? /* @__PURE__ */ e.jsx($e, { type: X }) : $ ? c?.filter((b) => u === "NO_LEIDAS" ? !b.read : b)?.map((b, M) => /* @__PURE__ */ e.jsx(Dt, { ...b, className: " border-b border-neutral-strong-default rounded-b-none last:border-b-0" }, M)) : /* @__PURE__ */ e.jsx("p", { className: "flex-1 grid place-items-center prometeo-fonts-headline-xsmall text-neutral-default-default text-center py-8 text-balance", children: "No tienes notificaciones nuevas por el momento" }),
+                Y && X === "load_more" && /* @__PURE__ */ e.jsx($e, { type: X })
+              ] })
             ]
           }
         ) })
@@ -1129,8 +1132,8 @@ const $e = ({ type: t }) => {
       /* @__PURE__ */ e.jsx("div", { className: "flex flex-col gap-3 pb-8 pt-4 px-4 ", children: r })
     ]
   }
-), Gt = ({ closeSidebar: t, options: r, helpSection: s, initialSection: o, notificationsListControls: c, scrollableControls: l }, u) => {
-  const [i, m] = G(o ?? "notifications");
+), Gt = ({ closeSidebar: t, options: r, helpSection: s, initialSection: a, notificationsListControls: c, scrollableControls: l }, u) => {
+  const [i, m] = G(a ?? "notifications");
   _e(u, () => ({
     setActiveSection: m
   }));
@@ -1155,7 +1158,7 @@ const Qt = ({
   options: t,
   helpSection: r,
   sidebarContentRef: s,
-  initialSectionRef: o,
+  initialSectionRef: a,
   notificationsListControls: c,
   scrollableControls: l
 }) => {
@@ -1167,7 +1170,7 @@ const Qt = ({
       closeSidebar: u,
       options: t,
       helpSection: r,
-      initialSection: o.current,
+      initialSection: a.current,
       notificationsListControls: c,
       scrollableControls: l
     }
@@ -1178,7 +1181,7 @@ const Zt = ({ navigationControlsRef: t }) => {
   const r = ce();
   return t.current.toggleCollapse = r.toggleCollapse, t.current.getIsCollapsed = r.getIsCollapsed, t.current.subscribeToCollapse = r.subscribeToCollapse, t.current.openSidebar = r.openSidebar, t.current.closeSidebar = r.closeSidebar, t.current.toggleSidebar = r.toggleSidebar, t.current.getIsSidebarOpen = r.getIsSidebarOpen, t.current.subscribeToSidebarOpen = r.subscribeToSidebarOpen, t.current.setDrawerDragEnabled = r.setDrawerDragEnabled, t.current.setSidebarDragEnabled = r.setSidebarDragEnabled, null;
 }, er = (t) => {
-  const { children: r, currentAppSessions: s, resolveUserSecondarySlot: o, resolveSessionSecondarySlot: c, handleNavigation: l, allActions: u, tabs: i, navigationControlsRef: m, sidebarContentRef: p, initialSectionRef: d, userOptionsControls: w, mobileAppSwitcherControls: h, notificationsListControls: C, scrollableControls: A, outletRef: N, ...y } = t;
+  const { children: r, currentAppSessions: s, resolveUserSecondarySlot: a, resolveSessionSecondarySlot: c, handleNavigation: l, allActions: u, tabs: i, navigationControlsRef: m, sidebarContentRef: p, initialSectionRef: d, userOptionsControls: w, mobileAppSwitcherControls: h, notificationsListControls: C, scrollableControls: A, outletRef: N, ...y } = t;
   return /* @__PURE__ */ e.jsxs(se, { disableDragOpen: y.options?.disableDragOpen, outletRef: N, children: [
     /* @__PURE__ */ e.jsx(Zt, { navigationControlsRef: m }),
     /* @__PURE__ */ e.jsx(se.Header, { className: "flex flex-col relative w-full select-none", children: /* @__PURE__ */ e.jsx(
@@ -1206,7 +1209,7 @@ const Zt = ({ navigationControlsRef: t }) => {
       {
         state: y.state,
         currentAppSessions: s,
-        resolveUserSecondarySlot: o,
+        resolveUserSecondarySlot: a,
         resolveSessionSecondarySlot: c,
         onSessionClick: y.onSessionClick,
         onLogoutClick: y.onLogoutClick,
@@ -1239,13 +1242,13 @@ const Zt = ({ navigationControlsRef: t }) => {
     )
   ] });
 }, ht = R(er, (t, r) => {
-  const { children: s, ...o } = t, { children: c, ...l } = r, u = Object.keys(o), i = Object.keys(l);
+  const { children: s, ...a } = t, { children: c, ...l } = r, u = Object.keys(a), i = Object.keys(l);
   if (u.length !== i.length)
     return !1;
   for (const m of u) {
     if (!Object.prototype.hasOwnProperty.call(l, m))
       return !1;
-    const p = o[m], d = l[m];
+    const p = a[m], d = l[m];
     if (p !== d)
       return !1;
   }
@@ -1259,62 +1262,62 @@ const xt = Ee(null), jr = () => {
   if (!t)
     throw new Error("usePyrionLayout debe usarse dentro de PyrionLayout");
   return t;
-}, kr = ({ children: t, helpSection: r, state: s, links: o, onLinkClick: c, onNavigate: l, onLogoutClick: u, actions: i, activeActionId: m, onActionClick: p, tabsProps: d, currentSystemId: w, onSessionClick: h, onSystemLogoClick: C, onProfileClick: A, ...N }) => {
+}, kr = ({ children: t, helpSection: r, state: s, links: a, onLinkClick: c, onNavigate: l, onLogoutClick: u, actions: i, activeActionId: m, onActionClick: p, tabsProps: d, currentSystemId: w, onSessionClick: h, onSystemLogoClick: C, onProfileClick: A, ...N }) => {
   const D = Object.assign({
     closeDrawerOnNavigate: !0,
     disableDragOpen: {
       sidebar: !0,
       drawer: !1
     }
-  }, N.options), W = St(), q = Ke(), j = O(null), U = O(null), S = O({}), $ = O(null), Q = O("notifications"), Y = O(null), X = O(null), E = O(null), [_, b] = G(0), [M, B] = G(!1), [z, Z] = G(null), ae = x((a) => {
+  }, N.options), W = St(), q = Ke(), j = I(null), U = I(null), S = I({}), $ = I(null), Q = I("notifications"), Y = I(null), X = I(null), O = I(null), [_, b] = G(0), [M, B] = G(!1), [z, Z] = G(null), oe = x((o) => {
     if (B(!1), c) {
-      c(a);
+      c(o);
       return;
     }
     const v = window.location.pathname;
-    W(a), D.closeDrawerOnNavigate && gt() && !S.current?.getIsCollapsed?.() && S.current?.toggleCollapse?.(), l && l(v, a);
-  }, [c, l, W]), ee = (a) => {
-    a && window.open(a, "_blank");
+    W(o), D.closeDrawerOnNavigate && gt() && !S.current?.getIsCollapsed?.() && S.current?.toggleCollapse?.(), l && l(v, o);
+  }, [c, l, W]), ee = (o) => {
+    o && window.open(o, "_blank");
   }, ve = {
     system: {
       mobile: ee,
-      desktop: (a) => {
-        typeof window < "u" && a && (window.location.href = a);
+      desktop: (o) => {
+        typeof window < "u" && o && (window.location.href = o);
       }
     },
     product: {
       mobile: ee,
       desktop: ee
     }
-  }, Le = x((a) => {
-    const v = q ? "mobile" : "desktop", P = s.enabled_systems.find((k) => k.name === a)?.url;
-    ve.system[v](P), d?.onTabClick?.(a);
-  }, [q, s.enabled_systems, d?.onTabClick]), Fe = x((a) => {
-    const v = q ? "mobile" : "desktop", P = s.company.products?.find((k) => k.name === a)?.domain;
-    ve.product[v](P), d?.onTabClick?.(a);
-  }, [q, s.company.products, d?.onTabClick]), de = x((a, v) => {
+  }, Le = x((o) => {
+    const v = q ? "mobile" : "desktop", P = s.enabled_systems.find((k) => k.name === o)?.url;
+    ve.system[v](P), d?.onTabClick?.(o);
+  }, [q, s.enabled_systems, d?.onTabClick]), Fe = x((o) => {
+    const v = q ? "mobile" : "desktop", P = s.company.products?.find((k) => k.name === o)?.domain;
+    ve.product[v](P), d?.onTabClick?.(o);
+  }, [q, s.company.products, d?.onTabClick]), de = x((o, v) => {
     if (v) {
-      v(a), d?.onTabClick?.(a);
+      v(o), d?.onTabClick?.(o);
       return;
     } else
-      d?.onTabClick?.(a);
+      d?.onTabClick?.(o);
   }, [d?.onTabClick]), ze = x(() => {
-    const a = {};
+    const o = {};
     s.enabled_systems.forEach((P) => {
-      a[P.url] = P.name;
+      o[P.url] = P.name;
     });
     const v = window.location.origin;
-    for (const [P, k] of Object.entries(a))
+    for (const [P, k] of Object.entries(o))
       if (v === P)
         return k;
     return "";
   }, [s.enabled_systems]), De = d?.currentTabName || ze(), Ae = me(
     () => s.sessions || [],
     [s.sessions]
-  ), te = (a) => a == null ? null : typeof a == "string" || typeof a == "number" || typeof a == "boolean" ? String(a) : Se(a) ? a : typeof a == "object" ? JSON.stringify(a) : null, ue = x((a, v) => {
-    if (!a) return null;
-    if (Array.isArray(a)) {
-      const P = a?.[0] ? ye(v, a[0]) : null, k = a?.[1] ? ye(v, a[1]) : null, J = te(P), Ue = te(k);
+  ), te = (o) => o == null ? null : typeof o == "string" || typeof o == "number" || typeof o == "boolean" ? String(o) : Se(o) ? o : typeof o == "object" ? JSON.stringify(o) : null, ue = x((o, v) => {
+    if (!o) return null;
+    if (Array.isArray(o)) {
+      const P = o?.[0] ? ye(v, o[0]) : null, k = o?.[1] ? ye(v, o[1]) : null, J = te(P), Ue = te(k);
       return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
         /* @__PURE__ */ e.jsx("p", { className: "prometeo-fonts-body-small text-neutral-default-default line-clamp-1 min-w-[40%] text-nowrap wrap-break-word overflow-hidden text-ellipsis", children: J }),
         Ue && /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-1 flex-1 grow shrink-0 min-w-max max-w-2/3 overflow-visible ", children: [
@@ -1323,55 +1326,55 @@ const xt = Ee(null), jr = () => {
         ] })
       ] });
     }
-    if (typeof a == "string") {
-      const P = ye(v, a);
+    if (typeof o == "string") {
+      const P = ye(v, o);
       return te(P);
     }
-    return typeof a == "function" ? te(a(v)) : null;
+    return typeof o == "function" ? te(o(v)) : null;
   }, []), n = x(
-    (a) => {
+    (o) => {
       const v = D?.userCardOptions?.secondarySlot;
       if (!v) return null;
-      const P = s.enabled_systems?.find((J) => J._id === w), k = { company: s.company, user: s.user, system: P, metadata: a };
+      const P = s.enabled_systems?.find((J) => J._id === w), k = { company: s.company, user: s.user, system: P, metadata: o };
       return ue(v, k);
     },
     [w, D?.userCardOptions?.secondarySlot, ue, s.company, s.enabled_systems, s.user]
   ), f = x(
-    (a) => {
+    (o) => {
       const v = D?.sessionCardOptions?.secondarySlot || D?.userCardOptions?.secondarySlot;
       if (!v) return null;
-      const P = s.enabled_systems?.find((J) => J._id === w), k = { company: s.company, user: a.auth_id, metadata: a?.metadata, system: P };
+      const P = s.enabled_systems?.find((J) => J._id === w), k = { company: s.company, user: o.auth_id, metadata: o?.metadata, system: P };
       return ue(v, k);
     },
     [w, D?.sessionCardOptions?.secondarySlot, D?.userCardOptions?.secondarySlot, ue, s.company]
   ), g = me(() => {
-    const a = [];
+    const o = [];
     return S.current.openNotifications = () => {
       Q.current = "notifications", S.current.openSidebar?.(), $.current?.setActiveSection("notifications");
     }, S.current.openHelp = () => {
       Q.current = "help", S.current.openSidebar?.(), $.current?.setActiveSection("help");
-    }, !D?.notificationsDrawerOptions?.hideActionButton && !D?.notificationsDrawerOptions?.hide && a.push({
+    }, !D?.notificationsDrawerOptions?.hideActionButton && !D?.notificationsDrawerOptions?.hide && o.push({
       id: "notifications",
       title: "Notificaciones",
       icon: Ge,
       onClick: S.current.openNotifications,
       count: _
-    }), !D?.helpSectionDrawerOptions?.hideActionButton && r && !D?.helpSectionDrawerOptions?.hide && a.push({
+    }), !D?.helpSectionDrawerOptions?.hideActionButton && r && !D?.helpSectionDrawerOptions?.hide && o.push({
       id: "help",
       title: "Ayuda",
       icon: Qe,
       onClick: S.current.openHelp
-    }), D?.configurationActionOptions?.onClick && !D?.configurationActionOptions?.hideActionButton && a.push({
+    }), D?.configurationActionOptions?.onClick && !D?.configurationActionOptions?.hideActionButton && o.push({
       id: "configuration",
       title: "Configuracion",
       icon: Ot,
       onClick: D.configurationActionOptions?.onClick
-    }), a;
-  }, [D, r, p, _]), I = me(
+    }), o;
+  }, [D, r, p, _]), E = me(
     () => [...g, ...i || []],
     [g, i]
   ), H = me(() => {
-    const a = s.enabled_systems.map((k) => ({
+    const o = s.enabled_systems.map((k) => ({
       name: k.name,
       thumbnail: k.thumbnail,
       onClick: Le,
@@ -1384,33 +1387,33 @@ const xt = Ee(null), jr = () => {
       thumbnail: k.thumbnail,
       onClick: Fe
     })) || [];
-    return [...a, ...v, ...P];
-  }, [s.enabled_systems, s.company.products, d?.customTabs]), F = x((a, v) => {
-    j.current?.addNewNotification ? j.current.addNewNotification(a, v) : console.warn("Notifications controls not ready yet");
-  }, []), re = x((a) => j.current?.subscribeToUpdates ? j.current.subscribeToUpdates(a) : (console.warn("Notifications controls not ready yet"), () => {
-  }), []), oe = x((a) => {
-    j.current?.removeNotification ? j.current.removeNotification(a) : console.warn("Notifications controls not ready yet");
+    return [...o, ...v, ...P];
+  }, [s.enabled_systems, s.company.products, d?.customTabs]), F = x((o, v) => {
+    j.current?.addNewNotification ? j.current.addNewNotification(o, v) : console.warn("Notifications controls not ready yet");
+  }, []), re = x((o) => j.current?.subscribeToUpdates ? j.current.subscribeToUpdates(o) : (console.warn("Notifications controls not ready yet"), () => {
+  }), []), ae = x((o) => {
+    j.current?.removeNotification ? j.current.removeNotification(o) : console.warn("Notifications controls not ready yet");
   }, []), fe = x(() => {
     j.current?.removeAllNotifications ? j.current.removeAllNotifications() : console.warn("Notifications controls not ready yet");
-  }, []), we = x((a) => {
-    j.current?.setNotifications ? j.current.setNotifications(a) : console.warn("Notifications controls not ready yet");
-  }, []), Ne = x((a, v) => U.current?.subscribeToScrollTarget ? U.current.subscribeToScrollTarget(a, v) : (console.warn("Scrollable controls not ready yet"), () => {
-  }), []), L = x((a, v = "load_more") => {
-    j.current?.setLoading ? j.current.setLoading(a, v) : console.warn("Notifications controls not ready yet");
-  }, []), K = x((a, v) => {
-    j.current?.setError ? j.current.setError(a, v) : console.warn("Notifications controls not ready yet");
-  }, []), V = x((a, v, P) => {
+  }, []), we = x((o) => {
+    j.current?.setNotifications ? j.current.setNotifications(o) : console.warn("Notifications controls not ready yet");
+  }, []), Ne = x((o, v) => U.current?.subscribeToScrollTarget ? U.current.subscribeToScrollTarget(o, v) : (console.warn("Scrollable controls not ready yet"), () => {
+  }), []), L = x((o, v = "load_more") => {
+    j.current?.setLoading ? j.current.setLoading(o, v) : console.warn("Notifications controls not ready yet");
+  }, []), K = x((o, v) => {
+    j.current?.setError ? j.current.setError(o, v) : console.warn("Notifications controls not ready yet");
+  }, []), V = x((o, v, P) => {
     const k = /* @__PURE__ */ e.jsxs("div", { className: T(" bg-black/60 z-200 inset-0 h-full w-full grid place-items-center text-neutral-default-default", v ? "fixed" : "sticky"), children: [
       !P && /* @__PURE__ */ e.jsx(pe, { label: "", icon: /* @__PURE__ */ e.jsx(Me, {}), onClick: () => B(!1), variant: "text", className: "absolute top-0 right-0", size: "small", color: "secondary" }),
-      typeof a == "function" ? a() : a
+      typeof o == "function" ? o() : o
     ] });
     let J;
-    return v ? J = Ve(k, document.body, `modal-error-${Date.now()}`) : E.current && (J = Ve(k, E.current, `modal-error-${Date.now()}`)), Z(J), B(!0), k;
-  }, [E]), le = x(() => {
+    return v ? J = Ve(k, document.body, `modal-error-${Date.now()}`) : O.current && (J = Ve(k, O.current, `modal-error-${Date.now()}`)), Z(J), B(!0), k;
+  }, [O]), le = x(() => {
     B(!1);
   }, []);
-  return S.current.addNewNotification = F, S.current.subscribeToNotificationsUpdates = re, S.current.removeNotification = oe, S.current.removeAllNotifications = fe, S.current.setNotifications = we, S.current.setNotificationsError = K, S.current.setNotificationsLoading = L, S.current.subscribeToNotificationsScroll = Ne, S.current.showErrorModal = V, S.current.closeErrorModal = le, ne(() => {
-    re((a, v) => {
+  return S.current.addNewNotification = F, S.current.subscribeToNotificationsUpdates = re, S.current.removeNotification = ae, S.current.removeAllNotifications = fe, S.current.setNotifications = we, S.current.setNotificationsError = K, S.current.setNotificationsLoading = L, S.current.subscribeToNotificationsScroll = Ne, S.current.showErrorModal = V, S.current.closeErrorModal = le, ne(() => {
+    re((o, v) => {
       b(v);
     });
   }, [re]), /* @__PURE__ */ e.jsxs(xt.Provider, { value: S.current, children: [
@@ -1429,9 +1432,9 @@ const xt = Ee(null), jr = () => {
       /* @__PURE__ */ e.jsx(
         ht,
         {
-          links: o,
-          handleNavigation: ae,
-          allActions: I,
+          links: a,
+          handleNavigation: oe,
+          allActions: E,
           activeActionId: m,
           onActionClick: p,
           state: s,
@@ -1452,7 +1455,7 @@ const xt = Ee(null), jr = () => {
           navigationControlsRef: S,
           notificationsListControls: j,
           scrollableControls: U,
-          outletRef: E,
+          outletRef: O,
           onProfileClick: A,
           children: t
         }

package/package.json

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