prometeo-design-system 4.1.1 → 4.1.2

package/dist/PyrionLayout.es.js

@@ -1,7 +1,7 @@
 import { j as e } from "./jsx-runtime-GkKLlHH4.js";
 import { u as We, g as ft } from "./useDevice-vwn4GLwK.js";
 import { g as xe } from "./utils-X4-h3cum.js";
-import Ue, { memo as T, forwardRef as Ne, useState as Z, useEffect as X, useContext as $e, createContext as Oe, useRef as I, useCallback as x, Children as mt, isValidElement as ge, useMemo as ue, useImperativeHandle as Le, use as pt } from "react";
+import Ue, { memo as T, forwardRef as Ne, useState as Z, useEffect as X, useContext as $e, createContext as Le, useRef as I, useCallback as x, Children as mt, isValidElement as ge, useMemo as ue, useImperativeHandle as Oe, use as pt } from "react";
 import { createPortal as ze } from "react-dom";
 import { useLocation as ht, useNavigate as bt } from "react-router";
 import { B as xt, T as gt } from "./badge-CbqYNrl4.js";
@@ -49,7 +49,7 @@ const Ye = T(Ne(({ children: t, className: r, context: s, modal: l = !1, closeOn
       w && m
     ] })
   ] });
-})), Xe = Oe(null), Je = Oe(null), kt = () => {
+})), Xe = Le(null), Je = Le(null), kt = () => {
   const t = $e(Xe);
   if (!t) throw new Error("useDrawerState must be used within NavigationDrawer");
   return t;
@@ -84,31 +84,31 @@ const Ye = T(Ne(({ children: t, className: r, context: s, modal: l = !1, closeOn
   }, []), P = x(
     (o, { notify: p = !0 } = {}) => {
       const g = h.current !== o;
-      h.current = o, Dt(o), F(o), p && g && u.current.forEach((O) => O(o));
+      h.current = o, Dt(o), F(o), p && g && u.current.forEach((L) => L(o));
     },
     [F]
   ), R = x(
     (o, { notify: p = !0 } = {}) => {
       const g = b.current !== o;
       if (b.current = o, D(o), p && g) {
-        const O = !o;
-        N.current.forEach((B) => B(O));
+        const L = !o;
+        N.current.forEach((B) => B(L));
       }
     },
     [D]
   ), k = x(
     (o, { notify: p = !0 } = {}) => {
-      const g = w.current, O = g !== o;
+      const g = w.current, L = g !== o;
       w.current = o, window.matchMedia("(min-width: 768px)").matches || P(o !== "drawer", { notify: p });
       const B = g === "sidebar", _ = o === "sidebar";
-      p && O && B !== _ && N.current.forEach((Q) => Q(_)), R(o !== "sidebar", { notify: p }), P(o !== "drawer", { notify: p });
+      p && L && B !== _ && N.current.forEach((Q) => Q(_)), R(o !== "sidebar", { notify: p }), P(o !== "drawer", { notify: p });
     },
     [P, R]
   ), j = x((o) => {
     const p = n.current;
     if (!p || window.matchMedia("(min-width: 768px)").matches) return;
     y.current = !0;
-    const g = m.current?.offsetLeft ?? 0, O = d.current?.offsetLeft ?? g, B = o === "drawer" ? 0 : o === "sidebar" ? O : g;
+    const g = m.current?.offsetLeft ?? 0, L = d.current?.offsetLeft ?? g, B = o === "drawer" ? 0 : o === "sidebar" ? L : g;
     f.current = B, p.scrollTo({ left: B, behavior: "smooth" });
     const _ = () => {
       y.current = !1, f.current = null, p.removeEventListener("scrollend", _);
@@ -122,8 +122,8 @@ const Ye = T(Ne(({ children: t, className: r, context: s, modal: l = !1, closeOn
     const g = [
       { panel: "drawer", offset: 0 },
       { panel: "outlet", offset: p.offsetLeft }
-    ], O = d.current;
-    O && g.push({ panel: "sidebar", offset: O.offsetLeft });
+    ], L = d.current;
+    L && g.push({ panel: "sidebar", offset: L.offsetLeft });
     const B = o.scrollLeft;
     let _ = g[0], Q = Math.abs(B - _.offset);
     for (let $ = 1; $ < g.length; $++) {
@@ -139,8 +139,8 @@ const Ye = T(Ne(({ children: t, className: r, context: s, modal: l = !1, closeOn
     const o = n.current, p = m.current;
     if (!o || !p) return;
     if (window.matchMedia("(min-width: 768px)").matches) {
-      const O = He();
-      P(O, { notify: !1 }), R(!0, { notify: !1 });
+      const L = He();
+      P(L, { notify: !1 }), R(!0, { notify: !1 });
       return;
     }
     requestAnimationFrame(() => {
@@ -149,9 +149,9 @@ const Ye = T(Ne(({ children: t, className: r, context: s, modal: l = !1, closeOn
   }, [k, P, R]), X(() => {
     const o = n.current;
     if (!o || !m.current) return;
-    let g = !1, O = 0, B = 0;
+    let g = !1, L = 0, B = 0;
     const _ = (S) => {
-      O = S.touches[0].clientX, B = S.touches[0].clientY;
+      L = S.touches[0].clientX, B = S.touches[0].clientY;
     }, Q = (S, U) => {
       const a = window.getComputedStyle(S), v = U === "x" ? a.overflowX : a.overflowY;
       return /(auto|scroll|overlay)/.test(v) ? U === "x" ? S.scrollWidth > S.clientWidth : S.scrollHeight > S.clientHeight : !1;
@@ -165,8 +165,8 @@ const Ye = T(Ne(({ children: t, className: r, context: s, modal: l = !1, closeOn
       return null;
     }, le = (S, U, a) => a === 0 ? !1 : U === "x" ? a < 0 ? S.scrollLeft + S.clientWidth < S.scrollWidth : S.scrollLeft > 0 : a < 0 ? S.scrollTop + S.clientHeight < S.scrollHeight : S.scrollTop > 0, he = (S) => {
       if (!(S.target instanceof HTMLElement)) return;
-      const U = S.touches[0].clientX - O, a = S.touches[0].clientY - B, v = Math.abs(U) > Math.abs(a) ? "x" : "y", L = v === "x" ? U : a, C = $(S.target, v);
-      if (C && le(C, v, L))
+      const U = S.touches[0].clientX - L, a = S.touches[0].clientY - B, v = Math.abs(U) > Math.abs(a) ? "x" : "y", O = v === "x" ? U : a, C = $(S.target, v);
+      if (C && le(C, v, O))
         return;
       const z = o.classList.contains("disabled-dragopen"), de = o.classList.contains("disabled-dragopen-sidebar"), Fe = () => S.cancelable ? (S.preventDefault(), !0) : !1;
       if (v === "x") {
@@ -249,10 +249,10 @@ const Ye = T(Ne(({ children: t, className: r, context: s, modal: l = !1, closeOn
       if (!p) return;
       const g = p.scrollLeft;
       if (o) {
-        const O = p.style.scrollBehavior;
+        const L = p.style.scrollBehavior;
         p.style.scrollBehavior = "auto", p.classList.remove("disabled-dragopen"), requestAnimationFrame(() => {
           p.scrollLeft = g, requestAnimationFrame(() => {
-            p.style.scrollBehavior = O;
+            p.style.scrollBehavior = L;
           });
         });
       } else
@@ -262,10 +262,10 @@ const Ye = T(Ne(({ children: t, className: r, context: s, modal: l = !1, closeOn
       const p = n.current;
       if (p)
         if (o) {
-          const g = p.scrollLeft, O = p.style.scrollBehavior;
+          const g = p.scrollLeft, L = p.style.scrollBehavior;
           p.style.scrollBehavior = "auto", p.classList.remove("disabled-dragopen-sidebar"), requestAnimationFrame(() => {
             p.scrollLeft = g, requestAnimationFrame(() => {
-              p.style.scrollBehavior = O;
+              p.style.scrollBehavior = L;
             });
           });
         } else
@@ -383,7 +383,7 @@ const ke = T(Ne(({ children: t, className: r, context: s }, l) => {
   Sidebar: Ye
 });
 q.displayName = "NavigationDrawer";
-const Ot = "hover:bg-neutral-medium-hover", Lt = Te("", {
+const Lt = "hover:bg-neutral-medium-hover", Ot = Te("", {
   variants: {
     isSelected: {
       true: "bg-neutral-medium-selected ",
@@ -490,8 +490,8 @@ const Ot = "hover:bg-neutral-medium-hover", Lt = Te("", {
     "group navitem",
     "h-12 flex-1 flex items-center p-3 rounded-lg justify-between w-full",
     "transition-all duration-300",
-    Ot,
-    Lt({ isSelected: n, disabled: u }),
+    Lt,
+    Ot({ isSelected: n, disabled: u }),
     i
   );
   if (h === "a") {
@@ -608,7 +608,7 @@ const Rt = Ne((t, r) => {
     toggleDrawerCollapse: N,
     subscribeToCollapse: f
   };
-  Le(r, () => j, [j, s, y, N]);
+  Oe(r, () => j, [j, s, y, N]);
   const K = m, Y = x(() => {
     const M = y?.() ?? !1;
     if (u && u.length > 0 && M) {
@@ -959,7 +959,7 @@ const Ht = ({ onCloseClick: t, onMarkAllAsRead: r, notificationsListControls: s
   }, []), b = x((u) => {
     i(u), n.current.forEach((N) => N(u, u.length));
   }, []);
-  Le(s, () => ({
+  Oe(s, () => ({
     addNewNotification: c,
     subscribeToUpdates: m,
     setNotifications: b,
@@ -1003,7 +1003,7 @@ const Ht = ({ onCloseClick: t, onMarkAllAsRead: r, notificationsListControls: s
   }
 ), Wt = ({ closeSidebar: t, options: r, helpSection: s, initialSection: l, notificationsListControls: i }, n) => {
   const [c, m] = Z(l ?? "notifications");
-  Le(n, () => ({
+  Oe(n, () => ({
     setActiveSection: m
   }));
   const d = () => {
@@ -1122,10 +1122,10 @@ const qt = ({ navigationControlsRef: t }) => {
 Ae.displayName = "PyrionNavigationDrawer.LayoutBase";
 const dt = T(({ children: t }) => /* @__PURE__ */ e.jsx(q.Outlet, { children: t }));
 dt.displayName = "PyrionNavigationDrawer.IsolatedOutlet";
-const ut = Oe(null), br = () => {
+const ut = Le(null), br = () => {
   const t = pt(ut);
   if (!t)
-    throw new Error("usePyrionNavigation debe usarse dentro de PyrionNavigationDrawer");
+    throw new Error("usePyrionLayout debe usarse dentro de PyrionLayout");
   return t;
 }, xr = ({ children: t, helpSection: r, state: s, links: l, onLinkClick: i, onNavigate: n, onLogoutClick: c, actions: m, activeActionId: d, onActionClick: h, tabsProps: b, currentSystemId: w, onSessionClick: u, onSystemLogoClick: N, onProfileClick: y, ...f }) => {
   const D = Object.assign({
@@ -1155,11 +1155,11 @@ const ut = Oe(null), br = () => {
       desktop: ce
     }
   }, Me = x((a) => {
-    const v = R ? "mobile" : "desktop", L = s.enabled_systems.find((C) => C.name === a)?.url;
-    pe.system[v](L), b?.onTabClick?.(a);
+    const v = R ? "mobile" : "desktop", O = s.enabled_systems.find((C) => C.name === a)?.url;
+    pe.system[v](O), b?.onTabClick?.(a);
   }, [R, s.enabled_systems, b?.onTabClick]), ae = x((a) => {
-    const v = R ? "mobile" : "desktop", L = s.company.products?.find((C) => C.name === a)?.domain;
-    pe.product[v](L), b?.onTabClick?.(a);
+    const v = R ? "mobile" : "desktop", O = s.company.products?.find((C) => C.name === a)?.domain;
+    pe.product[v](O), b?.onTabClick?.(a);
   }, [R, s.company.products, b?.onTabClick]), Be = x((a, v) => {
     if (v) {
       v(a), b?.onTabClick?.(a);
@@ -1168,12 +1168,12 @@ const ut = Oe(null), br = () => {
       b?.onTabClick?.(a);
   }, [b?.onTabClick]), Ce = x(() => {
     const a = {};
-    s.enabled_systems.forEach((L) => {
-      a[L.url] = L.name;
+    s.enabled_systems.forEach((O) => {
+      a[O.url] = O.name;
     });
     const v = window.location.origin;
-    for (const [L, C] of Object.entries(a))
-      if (v === L)
+    for (const [O, C] of Object.entries(a))
+      if (v === O)
         return C;
     return "";
   }, [s.enabled_systems]), je = b?.currentTabName || Ce(), G = ue(
@@ -1182,7 +1182,7 @@ const ut = Oe(null), br = () => {
   ), oe = (a) => a == null ? null : typeof a == "string" || typeof a == "number" || typeof a == "boolean" ? String(a) : ge(a) ? a : typeof a == "object" ? JSON.stringify(a) : null, o = x((a, v) => {
     if (!a) return null;
     if (Array.isArray(a)) {
-      const L = a?.[0] ? xe(v, a[0]) : null, C = a?.[1] ? xe(v, a[1]) : null, z = oe(L), de = oe(C);
+      const O = a?.[0] ? xe(v, a[0]) : null, C = a?.[1] ? xe(v, a[1]) : null, z = oe(O), de = oe(C);
       return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
         /* @__PURE__ */ e.jsx("p", { className: "prometeo-fonts-body-small text-neutral-default-default line-clamp-1 whitespace-break-spaces min-w-1/2", children: z }),
         de && /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-1 flex-1 grow shrink-0 min-w-[40%]  overflow-hidden", children: [
@@ -1192,15 +1192,15 @@ const ut = Oe(null), br = () => {
       ] });
     }
     if (typeof a == "string") {
-      const L = xe(v, a);
-      return oe(L);
+      const O = xe(v, a);
+      return oe(O);
     }
     return typeof a == "function" ? oe(a(v)) : null;
   }, []), p = x(
     (a) => {
       const v = D?.userCardOptions?.secondarySlot;
       if (!v) return null;
-      const L = s.enabled_systems?.find((z) => z._id === w), C = { company: s.company, user: s.user, system: L, metadata: a };
+      const O = s.enabled_systems?.find((z) => z._id === w), C = { company: s.company, user: s.user, system: O, metadata: a };
       return o(v, C);
     },
     [w, D?.userCardOptions?.secondarySlot, o, s.company, s.enabled_systems, s.user]
@@ -1208,11 +1208,11 @@ const ut = Oe(null), br = () => {
     (a) => {
       const v = D?.sessionCardOptions?.secondarySlot || D?.userCardOptions?.secondarySlot;
       if (!v) return null;
-      const L = s.enabled_systems?.find((z) => z._id === w), C = { company: s.company, user: a.auth_id, metadata: a?.metadata, system: L };
+      const O = s.enabled_systems?.find((z) => z._id === w), C = { company: s.company, user: a.auth_id, metadata: a?.metadata, system: O };
       return o(v, C);
     },
     [w, D?.sessionCardOptions?.secondarySlot, D?.userCardOptions?.secondarySlot, o, s.company]
-  ), O = ue(() => {
+  ), L = ue(() => {
     const a = [];
     return j.current.openNotifications = () => {
       Y.current = "notifications", j.current.openSidebar?.(), K.current?.setActiveSection("notifications");
@@ -1236,8 +1236,8 @@ const ut = Oe(null), br = () => {
       onClick: D.configurationActionOptions?.onClick
     }), a;
   }, [D, r, h, M]), B = ue(
-    () => [...O, ...m || []],
-    [O, m]
+    () => [...L, ...m || []],
+    [L, m]
   ), _ = ue(() => {
     const a = s.enabled_systems.map((C) => ({
       name: C.name,
@@ -1247,12 +1247,12 @@ const ut = Oe(null), br = () => {
     })) || [], v = b?.customTabs?.map((C) => ({
       ...C,
       onClick: () => Be(C.name, C?.onClick)
-    })) || [], L = s.company.products?.map((C) => ({
+    })) || [], O = s.company.products?.map((C) => ({
       name: C.name,
       thumbnail: C.thumbnail,
       onClick: ae
     })) || [];
-    return [...a, ...v, ...L];
+    return [...a, ...v, ...O];
   }, [s.enabled_systems, s.company.products, b?.customTabs]), Q = x((a) => {
     k.current?.addNewNotification ? k.current.addNewNotification(a) : console.warn("Notifications controls not ready yet");
   }, []), $ = x((a) => k.current?.subscribeToUpdates ? k.current.subscribeToUpdates(a) : (console.warn("Notifications controls not ready yet"), () => {
@@ -1262,9 +1262,9 @@ const ut = Oe(null), br = () => {
     k.current?.removeAllNotifications ? k.current.removeAllNotifications() : console.warn("Notifications controls not ready yet");
   }, []), be = x((a) => {
     k.current?.setNotifications ? k.current.setNotifications(a) : console.warn("Notifications controls not ready yet");
-  }, []), S = x((a, v, L) => {
+  }, []), S = x((a, v, O) => {
     const C = /* @__PURE__ */ e.jsxs("div", { className: A(" bg-black/60 z-200 inset-0 h-full w-full grid place-items-center text-neutral-default-default", v ? "fixed" : "sticky"), children: [
-      !L && /* @__PURE__ */ e.jsx(fe, { label: "", icon: /* @__PURE__ */ e.jsx(Ie, {}), onClick: () => W(!1), variant: "text", className: "absolute top-0 right-0", size: "small", color: "secondary" }),
+      !O && /* @__PURE__ */ e.jsx(fe, { label: "", icon: /* @__PURE__ */ e.jsx(Ie, {}), onClick: () => W(!1), variant: "text", className: "absolute top-0 right-0", size: "small", color: "secondary" }),
       typeof a == "function" ? a() : a
     ] });
     let z;

package/dist/components/PyrionNavigationDrawer/PLFooter.d.ts

@@ -1,8 +1,8 @@
 import { ReactNode } from 'react';
 import { TicketCardHandlerProps } from '../TicketCard';
-import { AuthSession, PyrionLayoutOptions, PyrionNavigationDrawerProps } from './PyrionLayout';
+import { AuthSession, PyrionLayoutOptions, PyrionLayoutProps } from './PyrionLayout';
 export interface DrawerFooterProps<TAppMetadata> {
-    state: PyrionNavigationDrawerProps<TAppMetadata>['state'];
+    state: PyrionLayoutProps<TAppMetadata>['state'];
     currentAppSessions: AuthSession<TAppMetadata>[];
     resolveUserSecondarySlot: (metadata?: TAppMetadata) => ReactNode | string | null;
     resolveSessionSecondarySlot: (session: AuthSession<TAppMetadata>) => ReactNode | string | null;

package/dist/components/PyrionNavigationDrawer/PLayoutBase.d.ts

@@ -5,14 +5,14 @@ import { TabSwitchElement } from '../TabSwitch/TabSwitch';
 import { TicketCardHandlerProps } from '../TicketCard';
 import { NotificationsListControlsHandler } from './PLNotificationsList';
 import { PLSidebarContentHandle } from './PLSidebarContent';
-import { AuthSession, PyrionNavigationControls, PyrionLayoutOptions, PyrionNavigationDrawerProps } from './PyrionLayout';
+import { AuthSession, PyrionNavigationControls, PyrionLayoutOptions, PyrionLayoutProps } from './PyrionLayout';
 export type TLayoutBaseProps<TAppMetadata = unknown, TNotificationMetadata = unknown> = {
     links?: PyrionLayoutLinkItemProps[];
     handleNavigation: (path: string) => void;
     allActions: PyrionLayoutActionItemProps[];
     activeActionId?: string;
     onActionClick?: (id: string, payload?: any) => void;
-    state: PyrionNavigationDrawerProps<TAppMetadata, TNotificationMetadata>['state'];
+    state: PyrionLayoutProps<TAppMetadata, TNotificationMetadata>['state'];
     currentAppSessions: AuthSession<TAppMetadata>[];
     resolveUserSecondarySlot: (metadata?: TAppMetadata) => ReactNode | string | null;
     resolveSessionSecondarySlot: (session: AuthSession<TAppMetadata>) => ReactNode | string | null;

package/dist/components/PyrionNavigationDrawer/PyrionLayout.d.ts

@@ -96,7 +96,7 @@ export interface PyrionLayoutOptions<TAppMetadata> {
         sidebar?: boolean;
     };
 }
-export interface PyrionNavigationDrawerProps<TAppMetadata, TNotificationMetadata = unknown> {
+export interface PyrionLayoutProps<TAppMetadata, TNotificationMetadata = unknown> {
     links?: PyrionLayoutLinkItemProps[];
     actions?: PyrionLayoutActionItemProps[];
     tabsProps?: PyrionLayoutTabsProps;
@@ -141,6 +141,6 @@ export type PyrionNavigationControls<TNotificationMetadata = unknown> = {
     removeAllNotifications?: () => void;
     removeNotification?: (id: string | string[]) => void;
 };
-export declare const usePyrionNavigation: <TNotificationMetadata = unknown>() => PyrionNavigationControls<TNotificationMetadata>;
-declare const PyrionNavigationDrawer: <TAppMetadata = unknown, TNotificationMetadata = unknown>({ children, helpSection, state, links: navlinks, onLinkClick, onNavigate, onLogoutClick, actions, activeActionId, onActionClick, tabsProps, currentSystemId, onSessionClick, onSystemLogoClick, onProfileClick, ...props }: PyrionNavigationDrawerProps<TAppMetadata, TNotificationMetadata>) => import("react/jsx-runtime").JSX.Element;
-export default PyrionNavigationDrawer;
+export declare const usePyrionLayout: <TNotificationMetadata = unknown>() => PyrionNavigationControls<TNotificationMetadata>;
+declare const PyrionLayout: <TAppMetadata = unknown, TNotificationMetadata = unknown>({ children, helpSection, state, links: navlinks, onLinkClick, onNavigate, onLogoutClick, actions, activeActionId, onActionClick, tabsProps, currentSystemId, onSessionClick, onSystemLogoClick, onProfileClick, ...props }: PyrionLayoutProps<TAppMetadata, TNotificationMetadata>) => import("react/jsx-runtime").JSX.Element;
+export default PyrionLayout;

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

@@ -1,4 +1,6 @@
-import { default as PyrionNavigationDrawer, PyrionNavigationDrawerProps, PyrionLayoutOptions, PyrionLayoutTabsProps, AuthSession } from './PyrionLayout';
+import { default as PyrionLayout, PyrionLayoutProps, PyrionLayoutOptions, PyrionLayoutTabsProps, AuthSession } from './PyrionLayout';
+import { PyrionLayoutLinkItemProps } from '../NavigationDrawer/NavigationDrawerLinkItem';
+import { PyrionLayoutActionItemProps } from '../NavigationDrawer/NavigationDrawerActionItem';
 import { NotificationCardProps } from '../NotificationCard';
-export { type PyrionNavigationDrawerProps, type PyrionLayoutOptions as PyrionNavigationDrawerOptions, type PyrionLayoutTabsProps as NavigationDrawerTabsProps, type AuthSession, type NotificationCardProps };
-export default PyrionNavigationDrawer;
+export { type PyrionLayoutProps, type PyrionLayoutOptions, type PyrionLayoutTabsProps, type AuthSession, type NotificationCardProps, type PyrionLayoutLinkItemProps, type PyrionLayoutActionItemProps };
+export default PyrionLayout;

package/dist/exports/PyrionLayout.d.ts

@@ -1,2 +1,2 @@
 export { default } from '../components/PyrionNavigationDrawer';
-export { type PyrionNavigationDrawerProps, type PyrionNavigationDrawerOptions, type NavigationDrawerTabsProps, type AuthSession, type NotificationCardProps } from '../components/PyrionNavigationDrawer';
+export { type PyrionLayoutProps, type PyrionLayoutOptions, type PyrionLayoutTabsProps, type AuthSession, type NotificationCardProps } from '../components/PyrionNavigationDrawer';

package/dist/exports/usePyrionNavigation.d.ts

@@ -1 +1 @@
-export { usePyrionNavigation as default } from '../components/PyrionNavigationDrawer/PyrionLayout';
+export { usePyrionLayout as default } from '../components/PyrionNavigationDrawer/PyrionLayout';

package/package.json

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