prometeo-design-system 1.9.7 → 1.9.8

package/dist/prometeo-design-system.es.js

@@ -1,58 +1,58 @@
-import { default as Ue } from "./Avatar.es.js";
-import { default as Ge } from "./Button.es.js";
-import { C as Ze, a as Je } from "./CardProfile-BZajBGbO.js";
-import { default as Qe } from "./CheckBox.es.js";
-import { default as et } from "./CheckboxFormik.es.js";
-import { default as at, useDialogControl as ot } from "./DialogModal.es.js";
-import { default as nt, useDrawerDesktop as it } from "./DrawerDesktop.es.js";
-import { default as lt, useDrawerMobile as ct } from "./DrawerMobile.es.js";
-import { default as dt } from "./Header.es.js";
-import { default as mt } from "./Input.es.js";
-import { default as xt } from "./InputFormik.es.js";
-import { InputMultiple as bt } from "./InputMultiple.es.js";
+import { default as Ve } from "./Avatar.es.js";
+import { default as Xe } from "./Button.es.js";
+import { C as Je, a as Ke } from "./CardProfile-BiYr6kY9.js";
+import { default as Ye } from "./CheckBox.es.js";
+import { default as tt } from "./CheckboxFormik.es.js";
+import { default as rt, useDialogControl as ot } from "./DialogModal.es.js";
+import { default as it, useDrawerDesktop as st } from "./DrawerDesktop.es.js";
+import { default as ct, useDrawerMobile as ut } from "./DrawerMobile.es.js";
+import { default as ft } from "./Header.es.js";
+import { default as pt } from "./Input.es.js";
+import { default as ht } from "./InputFormik.es.js";
+import { InputMultiple as gt } from "./InputMultiple.es.js";
 import { default as yt } from "./Logo.es.js";
-import { Menu as wt } from "./Menu.es.js";
-import { default as Nt } from "./Pagination.es.js";
-import { ProfilePictureUpload as St } from "./ProfilePictureUpload.es.js";
-import { default as It } from "./ProgressBar.es.js";
+import { Menu as jt } from "./Menu.es.js";
+import { default as Ct } from "./Pagination.es.js";
+import { ProfilePictureUpload as kt } from "./ProfilePictureUpload.es.js";
+import { default as Rt } from "./ProgressBar.es.js";
 import { default as Bt } from "./Select.es.js";
 import { default as Lt } from "./SelectFormik.es.js";
-import { default as Tt } from "./Spinner.es.js";
-import { Steps as At } from "./Steps.es.js";
+import { default as Ot } from "./Spinner.es.js";
+import { Steps as Et } from "./Steps.es.js";
 import { default as Dt } from "./SwipeContainer.es.js";
-import { Switch as zt } from "./Switch.es.js";
-import { Table as _t, TableBody as Mt, TableCaption as $t, TableCell as Ft, TableFooter as Ut, TableHead as Vt, TableHeader as Gt, TableRow as Xt } from "./Table.es.js";
-import { default as Jt } from "./TabLinks.es.js";
-import { default as Qt } from "./TextArea.es.js";
-import { default as ea } from "./Tooltip.es.js";
-import { Skeleton as aa } from "./Skeleton.es.js";
+import { Switch as Ht } from "./Switch.es.js";
+import { Table as Mt, TableBody as $t, TableCaption as Ft, TableCell as Ut, TableFooter as Vt, TableHead as Gt, TableHeader as Xt, TableRow as Zt } from "./Table.es.js";
+import { default as Kt } from "./TabLinks.es.js";
+import { default as Yt } from "./TextArea.es.js";
+import { default as ta } from "./Tooltip.es.js";
+import { Skeleton as ra } from "./Skeleton.es.js";
 import { j as a } from "./jsx-runtime-ByW6EXIE.js";
 import { c as u } from "./cn-B6yFEsav.js";
-import _, { useState as I, useMemo as z, useEffect as E, useRef as S, useLayoutEffect as Y, createContext as ee, useContext as te, forwardRef as M, useCallback as ae } from "react";
+import _, { useState as k, useMemo as z, useEffect as B, useRef as N, useLayoutEffect as Y, createContext as ee, useContext as te, forwardRef as M, useCallback as ae } from "react";
 import { motion as g, AnimatePresence as $ } from "framer-motion";
 import { u as F } from "./LayoutGeneric-jDE96L2N.js";
-import { L as ra, S as na } from "./LayoutGeneric-jDE96L2N.js";
+import { L as na, S as ia } from "./LayoutGeneric-jDE96L2N.js";
 import { useGSAP as U } from "@gsap/react";
 import h from "gsap";
 import { Icons as R } from "./Icons.es.js";
-import { default as sa } from "./OtpInput.es.js";
-import { useDropzone as oe } from "react-dropzone";
-import { useIsMobile as ca } from "./useDevice.es.js";
-import { DropZone as da } from "./DropZone.es.js";
+import { default as la } from "./OtpInput.es.js";
+import { useDropzone as re } from "react-dropzone";
+import { useIsMobile as ua } from "./useDevice.es.js";
+import { DropZone as fa } from "./DropZone.es.js";
 const We = (t) => {
-  const [e, n] = I({}), { size: o = "medium", color: r = "default", options: i, value: l, name: c, onChange: x, icon: m, allowExpand: s = !1, disabled: p = !1 } = t, f = Math.max(i.findIndex((d) => d.value === l), 0), b = i.length, k = 9, W = 26, w = {
+  const [e, o] = k({}), { size: r = "medium", color: n = "default", options: i, value: s, name: d, onChange: l, icon: f, allowExpand: c = !1, disabled: x = !1 } = t, p = Math.max(i.findIndex((m) => m.value === s), 0), b = i.length, I = 9, W = 26, w = {
     small: 120,
     medium: 120,
     large: 120
-  }, y = {
+  }, v = {
     small: 94,
     medium: 94,
     large: 94
-  }, D = 16, X = {
+  }, q = 16, X = {
     small: { container: "p-2" },
     medium: { container: "p-4 h-[48px] rounded-lg" },
     large: { container: "p-6" }
-  }, N = {
+  }, C = {
     default: {
       switch: "bg-primary-medium-default text-neutral-weak-default ",
       container: "border-neutral-default-default",
@@ -83,39 +83,39 @@ const We = (t) => {
       icon: "text-neutral-strong-disabled",
       option: "text-neutral-strong-disabled"
     }
-  }, q = i.find((d) => d.value === l) ?? i[0], L = q.label.length * k + D * 2 + W, O = () => z(() => Object.values(e).reduce((v, j) => v + j, 0) + W, [e]), T = {
-    small: s ? O() : (b - 1) * y.small + w.small,
-    medium: s ? O() : (b - 1) * y.medium + w.medium,
-    large: s ? O() : (b - 1) * y.large + w.large
+  }, D = i.find((m) => m.value === s) ?? i[0], L = D.label.length * I + q * 2 + W, A = () => z(() => Object.values(e).reduce((y, j) => y + j, 0) + W, [e]), O = {
+    small: c ? A() : (b - 1) * v.small + w.small,
+    medium: c ? A() : (b - 1) * v.medium + w.medium,
+    large: c ? A() : (b - 1) * v.large + w.large
   };
-  E(() => {
-    if (!s) return;
-    let d = {};
-    i.forEach((v, j) => {
-      d[j] = v.label.length * k + D * 2;
-    }), n(d);
+  B(() => {
+    if (!c) return;
+    let m = {};
+    i.forEach((y, j) => {
+      m[j] = y.label.length * I + q * 2;
+    }), o(m);
   }, []);
-  const Z = z(() => s ? Object.values(e).reduce((d, v, j) => j < f ? d + v : d, 0) : Math.max(f * y[o] - 2, 0), [f]), J = () => {
-    if (p) return;
-    const d = f === i.length - 1 ? i[0] : i[f + 1];
-    x?.(c, d.value);
-  }, C = p ? "disabled" : r;
+  const Z = z(() => c ? Object.values(e).reduce((m, y, j) => j < p ? m + y : m, 0) : Math.max(p * v[r] - 2, 0), [p]), J = () => {
+    if (x) return;
+    const m = p === i.length - 1 ? i[0] : i[p + 1];
+    l?.(d, m.value);
+  }, S = x ? "disabled" : n;
   return /* @__PURE__ */ a.jsxs(
     "button",
     {
-      name: c,
+      name: d,
       type: "button",
       id: "segmented-button-container",
       style: {
-        width: T[o],
-        minWidth: T[o],
-        maxWidth: T[o]
+        width: O[r],
+        minWidth: O[r],
+        maxWidth: O[r]
       },
       className: u(
-        X[o].container,
-        N[C].container,
+        X[r].container,
+        C[S].container,
         "border-[1px]",
-        !p && "cursor-pointer",
+        !x && "cursor-pointer",
         "relative"
       ),
       children: [
@@ -125,9 +125,9 @@ const We = (t) => {
             id: "segmented-button-switcher",
             animate: {
               left: `${Z}px`,
-              width: s ? L : w[o],
-              minWidth: s ? L : w[o],
-              maxWidth: s ? L : w[o]
+              width: c ? L : w[r],
+              minWidth: c ? L : w[r],
+              maxWidth: c ? L : w[r]
             },
             transition: {
               type: "spring",
@@ -137,15 +137,15 @@ const We = (t) => {
             className: u(
               "absolute top-0 left-0 h-full rounded-[6px] z-30",
               "flex items-center justify-center gap-[2px] p-4",
-              N[C].switch
+              C[S].switch
             ),
             onClick: () => {
-              !p && J();
+              !x && J();
             },
             children: [
-              m && _.cloneElement(m, { className: u(
+              f && _.cloneElement(f, { className: u(
                 "w-6 h-6 text-neutral-weak-default min-w-6 min-h-6",
-                N[C].icon
+                C[S].icon
               ) }),
               /* @__PURE__ */ a.jsx(
                 "p",
@@ -153,9 +153,9 @@ const We = (t) => {
                   className: u(
                     "prometeo-fonts-label-large ",
                     " overflow-hidden overflow-ellipsis text-nowrap ",
-                    N[C].switch
+                    C[S].switch
                   ),
-                  children: q.label
+                  children: D.label
                 }
               )
             ]
@@ -169,14 +169,14 @@ const We = (t) => {
               "absolute top-0 left-0 w-full h-full overflow-hidden",
               "flex justify-center"
             ),
-            children: i?.map((d, v) => {
-              const j = d.value === (l || i[0].value), K = s ? e[v] + W : w[o], Q = s ? e[v] : y[o], P = j ? K : Q;
+            children: i?.map((m, y) => {
+              const j = m.value === (s || i[0].value), K = c ? e[y] + W : w[r], Q = c ? e[y] : v[r], P = j ? K : Q;
               return /* @__PURE__ */ a.jsx(
                 g.span,
                 {
                   id: "segmented-button-option",
                   onClick: () => {
-                    !p && x?.(c, d.value);
+                    !x && l?.(d, m.value);
                   },
                   animate: {
                     width: P,
@@ -192,26 +192,26 @@ const We = (t) => {
                     "flex items-center justify-center px-3 py-[6px]",
                     "prometeo-fonts-label-large text-neutral-medium-default",
                     " overflow-hidden ",
-                    !p && "cursor-pointer"
+                    !x && "cursor-pointer"
                   ),
-                  "aria-label": d.label,
+                  "aria-label": m.label,
                   children: /* @__PURE__ */ a.jsx(
                     "p",
                     {
                       style: {
-                        width: s ? "max-content" : y[o],
-                        minWidth: s ? "max-content" : y[o],
-                        maxWidth: s ? "max-content" : y[o]
+                        width: c ? "max-content" : v[r],
+                        minWidth: c ? "max-content" : v[r],
+                        maxWidth: c ? "max-content" : v[r]
                       },
                       className: u(
                         "px-3 place-content-center overflow-hidden text-ellipsis text-wrap prometeo-fonts-label-large  h-full",
-                        N[C].option
+                        C[S].option
                       ),
-                      children: d.label
+                      children: m.label
                     }
                   )
                 },
-                d.value
+                m.value
               );
             })
           }
@@ -219,14 +219,14 @@ const We = (t) => {
       ]
     }
   );
-}, re = (t, e) => {
+}, oe = (t, e) => {
   U(
     () => {
       if (!t.current) return;
-      const n = t.current, o = document.querySelector('[data-main-content="true"]');
+      const o = t.current, r = document.querySelector('[data-main-content="true"]');
       if (e) {
         h.fromTo(
-          n,
+          o,
           {
             width: "0rem",
             opacity: 0
@@ -237,14 +237,14 @@ const We = (t) => {
             duration: 0.4,
             ease: "power2.out"
           }
-        ), o && h.to(o, {
-          marginLeft: n.offsetWidth + "px",
+        ), r && h.to(r, {
+          marginLeft: o.offsetWidth + "px",
           duration: 0.4,
           ease: "power2.out"
         });
-        const r = n.querySelectorAll(".secondary-bar-content > *");
-        r.length > 0 && h.fromTo(
-          r,
+        const n = o.querySelectorAll(".secondary-bar-content > *");
+        n.length > 0 && h.fromTo(
+          n,
           {
             y: 20,
             opacity: 0
@@ -259,12 +259,12 @@ const We = (t) => {
           }
         );
       } else
-        h.to(n, {
+        h.to(o, {
           width: "0rem",
           opacity: 0,
           duration: 0.3,
           ease: "power2.in"
-        }), o && h.to(o, {
+        }), r && h.to(r, {
           marginLeft: "0px",
           duration: 0.3,
           ease: "power2.in"
@@ -275,46 +275,46 @@ const We = (t) => {
 }, H = ({
   children: t,
   isOpen: e = !1,
-  className: n = "",
-  width: o = "w-96",
-  action: r,
+  className: o = "",
+  width: r = "w-96",
+  action: n,
   primarySidebarCollapsed: i,
-  onClose: l
+  onClose: s
 }) => {
-  const c = S(null), [x, m] = I({ left: 0, width: 0 }), { primarySidebarRef: s } = F();
+  const d = N(null), [l, f] = k({ left: 0, width: 0 }), { primarySidebarRef: c } = F();
   return Y(() => {
-    if (s?.current) {
-      const p = s.current.getBoundingClientRect();
-      m({
-        left: p.width,
-        width: p.width
+    if (c?.current) {
+      const x = c.current.getBoundingClientRect();
+      f({
+        left: x.width,
+        width: x.width
       });
     }
-  }, [s, e, i]), re(c, e), /* @__PURE__ */ a.jsx(a.Fragment, { children: e && /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
+  }, [c, e, i]), oe(d, e), /* @__PURE__ */ a.jsx(a.Fragment, { children: e && /* @__PURE__ */ a.jsxs(a.Fragment, { children: [
     /* @__PURE__ */ a.jsx(
       "div",
       {
         className: "fixed inset-0 bg-black/95 z-20",
         style: {
-          left: x.left
+          left: l.left
         },
-        onClick: l
+        onClick: s
       }
     ),
     /* @__PURE__ */ a.jsx(
       "div",
       {
-        ref: c,
+        ref: d,
         className: u(
           "h-screen bg-neutral-default-default border-r-1 border-neutral-strong-default flex flex-col secondary-bar flex-shrink-0",
           "absolute top-0 z-30",
-          o,
-          n
+          r,
+          o
         ),
         style: {
-          left: x.left
+          left: l.left
         },
-        "data-action": r,
+        "data-action": n,
         children: /* @__PURE__ */ a.jsx("div", { className: "secondary-bar-content", children: t })
       }
     )
@@ -327,7 +327,7 @@ const We = (t) => {
   Spacer: le
 }), V = ee(
   void 0
-), Oe = () => {
+), Ae = () => {
   const t = te(V);
   if (!t)
     throw new Error("useSidebar must be used within a Sidebar.Root");
@@ -335,36 +335,36 @@ const We = (t) => {
 }, ce = ({
   children: t
 }) => {
-  const [e, n] = I(!1), [o, r] = I(!1), i = S(null), l = () => {
-    n(!1), r(!1);
-  }, c = () => {
-    n(!0), r(!1);
-  }, f = {
+  const [e, o] = k(!1), [r, n] = k(!1), i = N(null), s = () => {
+    o(!1), n(!1);
+  }, d = () => {
+    o(!0), n(!1);
+  }, p = {
     isCollapsed: e,
-    setIsCollapsed: n,
+    setIsCollapsed: o,
     navbarRef: i,
     toggleCollapse: () => {
-      e ? l() : c();
+      e ? s() : d();
     },
-    activeSecondaryBar: o ? "notifications" : null,
+    activeSecondaryBar: r ? "notifications" : null,
     openSecondaryBar: () => {
-      r(!0);
+      n(!0);
     },
     closeSecondaryBar: () => {
-      r(!1);
+      n(!1);
     },
     toggleSecondaryBar: () => {
-      r((b) => !b);
+      n((b) => !b);
     }
   };
-  return /* @__PURE__ */ a.jsx(V.Provider, { value: f, children: t });
-}, B = (t, e, n, o) => e && (Array.isArray(e) ? e.length > 0 : e) ? t.to(e, n, o) : t, ue = (t, e, n) => {
+  return /* @__PURE__ */ a.jsx(V.Provider, { value: p, children: t });
+}, T = (t, e, o, r) => e && (Array.isArray(e) ? e.length > 0 : e) ? t.to(e, o, r) : t, ue = (t, e, o) => {
   U(
     () => {
       if (!t.current) return;
-      const o = h.timeline({
+      const r = h.timeline({
         defaults: { duration: 0.7, ease: "power1.out" }
-      }), r = {
+      }), n = {
         navbar: t.current,
         navLabels: h.utils.toArray(".nav-label"),
         navIconWrappers: h.utils.toArray(".nav-icon-wrapper"),
@@ -400,9 +400,9 @@ const We = (t) => {
         secondaryBarContent: h.utils.toArray(".secondary-bar *"),
         badgeInLink: h.utils.toArray(".badge-in-link")
       };
-      e ? de(o, r) : fe(o, r), r.secondaryBar && me(r.secondaryBar);
+      e ? de(r, n) : fe(r, n), n.secondaryBar && me(n.secondaryBar);
     },
-    { scope: t, dependencies: [e, n] }
+    { scope: t, dependencies: [e, o] }
   );
 }, de = (t, e) => {
   t.to(e.navbar, {
@@ -463,7 +463,7 @@ const We = (t) => {
       marginLeft: 0
     },
     0
-  ).to(e.navIcons, { scale: 0.95, ease: "elastic.out(1, 0.3)" }, 0), B(
+  ).to(e.navIcons, { scale: 0.95, ease: "elastic.out(1, 0.3)" }, 0), T(
     t,
     e.buttonCrevron,
     {
@@ -476,7 +476,7 @@ const We = (t) => {
       }
     },
     0
-  ), B(
+  ), T(
     t,
     e.buttonContentChevron,
     {
@@ -553,7 +553,7 @@ const We = (t) => {
       justifyContent: "flex-start"
     },
     -1
-  ), B(
+  ), T(
     t,
     e.buttonCrevron,
     {
@@ -566,7 +566,7 @@ const We = (t) => {
       }
     },
     0
-  ), B(
+  ), T(
     t,
     e.buttonContentChevron,
     {
@@ -678,28 +678,88 @@ const We = (t) => {
     duration: 0.3,
     ease: "power2.in"
   });
-}, pe = M(
-  ({ children: t, isCollapsed: e = !1, className: n = "" }, o) => {
-    const r = S(null), { registerPrimarySidebar: i } = F(), l = ae((c) => {
-      r.current = c, typeof o == "function" ? o(c) : o && (o.current = c);
-    }, [o]);
-    return E(() => {
-      r.current && i(r);
-    }, [i]), ue(r, e, !1), /* @__PURE__ */ a.jsx(
-      "div",
-      {
-        ref: l,
-        className: `bg-neutral-default-default hidden overflow-hidden h-screen md:flex flex-col border-r border-neutral-strong-default transition-all duration-300 relative z-50 flex-shrink-0
-          ${e ? "w-16" : "w-64"} ${n}`,
-        children: t
-      }
-    );
+}, pe = (t) => {
+  const [e, o] = k(t?.currentTabName || t.tabs[0].name), r = N(null), { tabs: n = [], className: i, activeColor: s = "var(--neutral-900)" } = t;
+  B(() => {
+    r.current?.style.setProperty("--tab-bg", s);
+  }, [s]);
+  const d = n.find((l) => l.name === (t?.currentTabName || e));
+  return /* @__PURE__ */ a.jsx(
+    "div",
+    {
+      className: u(
+        "flex flex-col gap-2",
+        "bg-neutral-strong-default",
+        "h-full w-14 max-w-14 pl-[6px] py-6",
+        " border-r-[1px] border-neutral-default-default",
+        i
+      ),
+      children: n.map(
+        (l, f) => {
+          const c = l.name === d?.name, x = typeof l.thumbnail == "string" ? /* @__PURE__ */ a.jsx("img", { src: l.thumbnail, alt: l.label, className: "aspect-square object-contain" }) : l.thumbnail, p = () => {
+            l.disabled || (o(l.name), l.onClick && l.onClick(l.name));
+          };
+          return /* @__PURE__ */ a.jsx(
+            "div",
+            {
+              className: u(
+                "bg-[var(--tab-bg)]",
+                "h-12 w-[50px] z-20",
+                "flex items-center pl-[6px] ",
+                "rounded-l-[8px]",
+                "tabswitch-element relative",
+                c && "active"
+              ),
+              onClick: p,
+              ref: r,
+              children: /* @__PURE__ */ a.jsx("div", { className: u(
+                "size-8 rounded-[4px]",
+                "grid place-items-center",
+                "tab-thumbnail-icon",
+                "bg-transparent text-neutral-default-default",
+                l?.className
+              ), children: x })
+            },
+            f
+          );
+        }
+      )
+    }
+  );
+}, xe = M(
+  ({ children: t, isCollapsed: e = !1, className: o = "", tabs: r = [], currentTabName: n }, i) => {
+    const s = N(null), { registerPrimarySidebar: d } = F(), l = ae((f) => {
+      s.current = f, typeof i == "function" ? i(f) : i && (i.current = f);
+    }, [i]);
+    return B(() => {
+      s.current && d(s);
+    }, [d]), ue(s, e, !1), /* @__PURE__ */ a.jsxs("div", { className: u(
+      "flex"
+    ), children: [
+      r.length > 0 && /* @__PURE__ */ a.jsx(
+        pe,
+        {
+          tabs: r,
+          activeColor: "var(--neutral-900)",
+          currentTabName: n
+        }
+      ),
+      /* @__PURE__ */ a.jsx(
+        "div",
+        {
+          ref: l,
+          className: `bg-neutral-default-default hidden overflow-hidden h-screen md:flex flex-col border-r border-neutral-strong-default transition-all duration-300 relative z-50 flex-shrink-0
+          ${e ? "w-16" : "w-64"} ${o}`,
+          children: t
+        }
+      )
+    ] });
   }
-), A = M(
-  (t, e) => /* @__PURE__ */ a.jsx(ce, { children: /* @__PURE__ */ a.jsx(pe, { ...t, ref: e }) })
+), E = M(
+  (t, e) => /* @__PURE__ */ a.jsx(ce, { children: /* @__PURE__ */ a.jsx(xe, { ...t, ref: e }) })
 );
-A.displayName = "SidebarRoot";
-const xe = ({ isCollapsed: t, onToggleCollapse: e }) => /* @__PURE__ */ a.jsx("div", { className: u("flex  mt-5 mb-4 justify-end mr-5 container-icon-collapsade", t && ""), children: /* @__PURE__ */ a.jsx(
+E.displayName = "SidebarRoot";
+const he = ({ isCollapsed: t, onToggleCollapse: e }) => /* @__PURE__ */ a.jsx("div", { className: u("flex  mt-5 mb-4 justify-end mr-5 container-icon-collapsade", t && ""), children: /* @__PURE__ */ a.jsx(
   "button",
   {
     onClick: e,
@@ -708,8 +768,8 @@ const xe = ({ isCollapsed: t, onToggleCollapse: e }) => /* @__PURE__ */ a.jsx("d
     className: "cursor-pointer text-neutral-default-default hover:text-primary-default transition-colors duration-300",
     children: t ? /* @__PURE__ */ a.jsx(R.CloseNavBarDesktop, { size: 24, className: "rotate-180 transition-transform duration-300" }) : /* @__PURE__ */ a.jsx(R.CloseNavBarDesktop, { size: 24, className: "rotate-0 transition-transform duration-300" })
   }
-) }), he = ({ children: t, className: e }) => /* @__PURE__ */ a.jsx("div", { className: `${e} sidebar-header`, children: t }), be = ({ className: t }) => /* @__PURE__ */ a.jsx("div", { className: u("px-3 flex justify-center items-center w-full mb-4", t), children: /* @__PURE__ */ a.jsx("div", { className: "border-b border-neutral-strong-default border-1 w-full" }) }), ge = ({ children: t, className: e }) => /* @__PURE__ */ a.jsx("div", { className: e, children: t }), ye = ({ className: t, size: e = "auto" }) => {
-  const n = () => {
+) }), be = ({ children: t, className: e }) => /* @__PURE__ */ a.jsx("div", { className: `${e} sidebar-header`, children: t }), ge = ({ className: t }) => /* @__PURE__ */ a.jsx("div", { className: u("px-3 flex justify-center items-center w-full mb-4", t), children: /* @__PURE__ */ a.jsx("div", { className: "border-b border-neutral-strong-default border-1 w-full" }) }), ve = ({ children: t, className: e }) => /* @__PURE__ */ a.jsx("div", { className: e, children: t }), ye = ({ className: t, size: e = "auto" }) => {
+  const o = () => {
     switch (e) {
       case "auto":
         return "flex-grow";
@@ -721,41 +781,41 @@ const xe = ({ isCollapsed: t, onToggleCollapse: e }) => /* @__PURE__ */ a.jsx("d
         return "h-8 w-8";
     }
   };
-  return /* @__PURE__ */ a.jsx("div", { className: u(n(), t) });
-}, ve = ({ children: t, className: e }) => /* @__PURE__ */ a.jsx("div", { className: e, children: t }), Te = Object.assign(A, {
-  Root: A,
-  CollapseButton: xe,
-  Header: he,
-  Divider: be,
-  Content: ge,
+  return /* @__PURE__ */ a.jsx("div", { className: u(o(), t) });
+}, we = ({ children: t, className: e }) => /* @__PURE__ */ a.jsx("div", { className: e, children: t }), Oe = Object.assign(E, {
+  Root: E,
+  CollapseButton: he,
+  Header: be,
+  Divider: ge,
+  Content: ve,
   Spacer: ye,
-  Footer: ve
+  Footer: we
 }), Pe = ({
   children: t,
   icon: e,
-  label: n,
-  href: o,
-  onClick: r,
+  label: o,
+  href: r,
+  onClick: n,
   isActive: i = !1,
-  className: l
+  className: s
 }) => {
-  const c = o ? "a" : "button";
+  const d = r ? "a" : "button";
   return /* @__PURE__ */ a.jsxs(
-    c,
+    d,
     {
-      href: o,
-      onClick: r,
+      href: r,
+      onClick: n,
       className: u(
         "nav-link-item",
         "flex items-center w-full px-3 py-2 text-left",
         "hover:bg-neutral-medium-default transition-colors rounded-lg",
         "focus:outline-none focus:ring-2 focus:ring-primary-default-default",
         i && "bg-neutral-medium-default",
-        l
+        s
       ),
       children: [
         e && /* @__PURE__ */ a.jsx("div", { className: "nav-icon-wrapper mr-3 flex-shrink-0", children: /* @__PURE__ */ a.jsx("div", { className: "nav-icon flex items-center justify-center w-5 h-5", children: e }) }),
-        n && /* @__PURE__ */ a.jsx("span", { className: "nav-label text-sm text-neutral-strong-default", children: n }),
+        o && /* @__PURE__ */ a.jsx("span", { className: "nav-label text-sm text-neutral-strong-default", children: o }),
         t
       ]
     }
@@ -763,18 +823,18 @@ const xe = ({ isCollapsed: t, onToggleCollapse: e }) => /* @__PURE__ */ a.jsx("d
 }, G = ({
   count: t,
   maxCount: e = 9,
-  className: n = "",
-  size: o = "medium",
-  variant: r = "primary",
+  className: o = "",
+  size: r = "medium",
+  variant: n = "primary",
   showZero: i = !1
 }) => {
-  const l = t, c = l > e ? `+${e}` : l;
-  if (l === 0 && !i) return null;
-  const x = {
+  const s = t, d = s > e ? `+${e}` : s;
+  if (s === 0 && !i) return null;
+  const l = {
     small: "w-4.5 h-4.5 text-xs ",
     medium: "w-5 h-5 text-xs",
     large: "w-6 h-6 text-sm"
-  }, m = {
+  }, f = {
     primary: "bg-primary-default-default text-neutral-strong-default",
     secondary: "bg-neutral-medium-default text-neutral-strong-default",
     success: "bg-green-500 text-white",
@@ -783,24 +843,24 @@ const xe = ({ isCollapsed: t, onToggleCollapse: e }) => /* @__PURE__ */ a.jsx("d
   };
   return /* @__PURE__ */ a.jsx("div", { className: u(
     "rounded-full flex items-center justify-center font-medium ",
-    x[o],
-    m[r],
-    n
-  ), children: /* @__PURE__ */ a.jsx("span", { children: c }) });
-}, Ae = ({
+    l[r],
+    f[n],
+    o
+  ), children: /* @__PURE__ */ a.jsx("span", { children: d }) });
+}, Ee = ({
   linkActions: t,
   onClick: e,
-  activeAction: n
-}) => /* @__PURE__ */ a.jsx("nav", { className: "flex flex-col gap-1", children: t?.map((o, r) => {
-  const { isView: i = !1, actionName: l, title: c, icon: x, count: m, viewAccess: s } = o || {}, p = (typeof i == "function" ? i() : i !== !1) && (!s || s()), f = n === l;
-  return p && /* @__PURE__ */ a.jsx(
+  activeAction: o
+}) => /* @__PURE__ */ a.jsx("nav", { className: "flex flex-col gap-1", children: t?.map((r, n) => {
+  const { isView: i = !1, actionName: s, title: d, icon: l, count: f, viewAccess: c } = r || {}, x = (typeof i == "function" ? i() : i !== !1) && (!c || c()), p = o === s;
+  return x && /* @__PURE__ */ a.jsx(
     g.div,
     {
       initial: { opacity: 0 },
       animate: { opacity: 1 },
       transition: {
         duration: 0.4,
-        delay: r * 0.03,
+        delay: n * 0.03,
         ease: "easeOut"
       },
       className: "relative flex justify-center w-full items-center px-3",
@@ -808,16 +868,16 @@ const xe = ({ isCollapsed: t, onToggleCollapse: e }) => /* @__PURE__ */ a.jsx("d
         "button",
         {
           onClick: () => {
-            e?.(l);
+            e?.(s);
           },
           className: u(
             "nav-link-item flex rounded-lg cursor-pointer relative overflow-hidden  h-10 ",
             "transition-all duration-300 ease-out w-full",
             "group hover:bg-neutral-medium-selected",
-            f ? "text-primary-default-default bg-neutral-medium-selected" : "text-neutral-default-default"
+            p ? "text-primary-default-default bg-neutral-medium-selected" : "text-neutral-default-default"
           ),
           children: [
-            /* @__PURE__ */ a.jsx($, { mode: "wait", children: f && /* @__PURE__ */ a.jsx(
+            /* @__PURE__ */ a.jsx($, { mode: "wait", children: p && /* @__PURE__ */ a.jsx(
               g.div,
               {
                 layoutId: "nav-active-bg",
@@ -850,24 +910,24 @@ const xe = ({ isCollapsed: t, onToggleCollapse: e }) => /* @__PURE__ */ a.jsx("d
                       {
                         className: "nav-icon-wrapper flex items-center justify-center flex-shrink-0",
                         animate: {
-                          scale: f ? 1.05 : 1
+                          scale: p ? 1.05 : 1
                         },
                         transition: {
                           duration: 0.25,
                           ease: "easeOut"
                         },
-                        children: typeof x == "function" ? x({
+                        children: typeof l == "function" ? l({
                           size: 24,
                           className: u(
                             "nav-icon transition-colors duration-250 ease-out",
-                            f ? "text-primary-default-default" : "text-neutral-default-default group-hover:text-white-prometeo"
+                            p ? "text-primary-default-default" : "text-neutral-default-default group-hover:text-white-prometeo"
                           )
                         }) : null
                       }
                     ),
-                    /* @__PURE__ */ a.jsx("span", { className: "nav-label whitespace-nowrap text-sm font-semibold ", children: c })
+                    /* @__PURE__ */ a.jsx("span", { className: "nav-label whitespace-nowrap text-sm font-semibold ", children: d })
                   ] }),
-                  /* @__PURE__ */ a.jsx("div", { className: "badge-in-link", children: m && m >= 1 ? /* @__PURE__ */ a.jsx(G, { count: m, maxCount: 9, className: "" }) : "" })
+                  /* @__PURE__ */ a.jsx("div", { className: "badge-in-link", children: f && f >= 1 ? /* @__PURE__ */ a.jsx(G, { count: f, maxCount: 9, className: "" }) : "" })
                 ]
               }
             )
@@ -875,24 +935,24 @@ const xe = ({ isCollapsed: t, onToggleCollapse: e }) => /* @__PURE__ */ a.jsx("d
         }
       )
     },
-    r
+    n
   );
-}) }), Ee = ({
+}) }), qe = ({
   links: t,
   isLinkActive: e,
-  onLinkClick: n
-}) => /* @__PURE__ */ a.jsx("nav", { className: "flex flex-col gap-1", children: t?.map((o, r) => {
-  const { isView: i = !1, viewAccess: l, path: c, title: x, icon: m, count: s, relatedPaths: p } = o, f = (typeof i == "function" ? i() : i !== !1) && (!l || l()), b = e(c) || (p?.some(
-    (k) => e(k)
+  onLinkClick: o
+}) => /* @__PURE__ */ a.jsx("nav", { className: "flex flex-col gap-1", children: t?.map((r, n) => {
+  const { isView: i = !1, viewAccess: s, path: d, title: l, icon: f, count: c, relatedPaths: x } = r, p = (typeof i == "function" ? i() : i !== !1) && (!s || s()), b = e(d) || (x?.some(
+    (I) => e(I)
   ) ?? !1);
-  return f && /* @__PURE__ */ a.jsx(
+  return p && /* @__PURE__ */ a.jsx(
     g.div,
     {
       initial: { opacity: 0 },
       animate: { opacity: 1 },
       transition: {
         duration: 0.4,
-        delay: r * 0.03,
+        delay: n * 0.03,
         ease: "easeOut"
       },
       className: "relative flex justify-center w-full items-center px-3",
@@ -900,7 +960,7 @@ const xe = ({ isCollapsed: t, onToggleCollapse: e }) => /* @__PURE__ */ a.jsx("d
         "button",
         {
           onClick: () => {
-            n?.(c);
+            o?.(d);
           },
           className: u(
             "nav-link-item flex rounded-lg cursor-pointer relative overflow-hidden  h-10 ",
@@ -948,7 +1008,7 @@ const xe = ({ isCollapsed: t, onToggleCollapse: e }) => /* @__PURE__ */ a.jsx("d
                           duration: 0.25,
                           ease: "easeOut"
                         },
-                        children: typeof m == "function" ? m({
+                        children: typeof f == "function" ? f({
                           size: 24,
                           className: u(
                             "nav-icon transition-colors duration-250 ease-out",
@@ -957,9 +1017,9 @@ const xe = ({ isCollapsed: t, onToggleCollapse: e }) => /* @__PURE__ */ a.jsx("d
                         }) : null
                       }
                     ),
-                    /* @__PURE__ */ a.jsx("span", { className: "nav-label whitespace-nowrap text-sm font-semibold ", children: x })
+                    /* @__PURE__ */ a.jsx("span", { className: "nav-label whitespace-nowrap text-sm font-semibold ", children: l })
                   ] }),
-                  /* @__PURE__ */ a.jsx("div", { className: "badge-in-link", children: s && s ? /* @__PURE__ */ a.jsx(G, { count: s, maxCount: 9, className: "" }) : "" })
+                  /* @__PURE__ */ a.jsx("div", { className: "badge-in-link", children: c && c ? /* @__PURE__ */ a.jsx(G, { count: c, maxCount: 9, className: "" }) : "" })
                 ]
               }
             )
@@ -967,20 +1027,20 @@ const xe = ({ isCollapsed: t, onToggleCollapse: e }) => /* @__PURE__ */ a.jsx("d
         }
       )
     },
-    r
+    n
   );
 }) }), De = ({
   isActiveModalNotification: t,
   setIsActiveModalNotification: e
 }) => ({ handleNotificationClick: () => {
   e(!0);
-}, isActiveModalNotification: t }), qe = (t) => {
-  const e = S(null);
+}, isActiveModalNotification: t }), ze = (t) => {
+  const e = N(null);
   return {
     isCollapsed: t,
     navbarRef: e
   };
-}, ze = ({
+}, He = ({
   isCollapsed: t,
   onToggle: e
 }) => /* @__PURE__ */ a.jsx("div", { className: "", children: /* @__PURE__ */ a.jsx(
@@ -992,7 +1052,7 @@ const xe = ({ isCollapsed: t, onToggleCollapse: e }) => /* @__PURE__ */ a.jsx("d
     className: "cursor-pointer text-neutral-default-default hover:text-primary-default transition-colors duration-300",
     children: t ? /* @__PURE__ */ a.jsx(R.CloseNavBarDesktop, { size: 34, className: "rotate-180 transition-transform duration-300" }) : /* @__PURE__ */ a.jsx(R.CloseNavBarDesktop, { size: 34, className: "rotate-0 transition-transform duration-300" })
   }
-) }), He = ({ logoUrl: t, companyName: e }) => /* @__PURE__ */ a.jsx("div", { className: "w-full flex justify-center items-center p-2 h-20", children: /* @__PURE__ */ a.jsx(
+) }), _e = ({ logoUrl: t, companyName: e }) => /* @__PURE__ */ a.jsx("div", { className: "w-full flex justify-center items-center p-2 h-20", children: /* @__PURE__ */ a.jsx(
   "img",
   {
     src: t,
@@ -1000,105 +1060,105 @@ const xe = ({ isCollapsed: t, onToggleCollapse: e }) => /* @__PURE__ */ a.jsx("d
     alt: e ?? ""
   }
 ) });
-function _e({
+function Me({
   onFilesAccepted: t,
   onFilesRejected: e,
-  ...n
+  ...o
 }) {
-  const o = _.useCallback(
-    (i, l) => {
-      i.length > 0 && t?.(i), l.length > 0 && e?.(l);
+  const r = _.useCallback(
+    (i, s) => {
+      i.length > 0 && t?.(i), s.length > 0 && e?.(s);
     },
     [t, e]
-  ), r = oe({
-    onDrop: o,
-    ...n
+  ), n = re({
+    onDrop: r,
+    ...o
   });
   return {
-    ...r,
-    hasErrors: r.fileRejections.length > 0
+    ...n,
+    hasErrors: n.fileRejections.length > 0
   };
 }
-const Me = (t, e = !0) => {
-  const n = S(null);
-  return E(() => {
+const $e = (t, e = !0) => {
+  const o = N(null);
+  return B(() => {
     if (!e) return;
-    const o = (r) => {
-      n.current && !n.current.contains(r.target) && t();
+    const r = (n) => {
+      o.current && !o.current.contains(n.target) && t();
     };
-    return document.addEventListener("mousedown", o, {
+    return document.addEventListener("mousedown", r, {
       capture: !0
-    }), document.addEventListener("touchstart", o, {
+    }), document.addEventListener("touchstart", r, {
       capture: !0
     }), () => {
-      document.removeEventListener("mousedown", o, {
+      document.removeEventListener("mousedown", r, {
         capture: !0
-      }), document.removeEventListener("touchstart", o, {
+      }), document.removeEventListener("touchstart", r, {
         capture: !0
       });
     };
-  }, [t, e]), n;
+  }, [t, e]), o;
 };
 export {
-  Ue as Avatar,
+  Ve as Avatar,
   G as Badge,
-  Ge as Button,
-  Ze as CardProfile,
-  Je as ChangueAccount,
-  Qe as CheckBox,
-  et as CheckboxFormik,
-  He as CompanyLogo,
-  at as DialogModal,
-  nt as DrawerDesktop,
-  lt as DrawerMobile,
-  da as DropZone,
-  dt as Header,
+  Xe as Button,
+  Je as CardProfile,
+  Ke as ChangueAccount,
+  Ye as CheckBox,
+  tt as CheckboxFormik,
+  _e as CompanyLogo,
+  rt as DialogModal,
+  it as DrawerDesktop,
+  ct as DrawerMobile,
+  fa as DropZone,
+  ft as Header,
   R as Icons,
-  mt as Input,
-  xt as InputFormik,
-  bt as InputMultiple,
-  ra as LayoutGeneric,
+  pt as Input,
+  ht as InputFormik,
+  gt as InputMultiple,
+  na as LayoutGeneric,
   yt as Logo,
-  wt as Menu,
-  Ae as NavBarActions,
-  ze as NavbarCollapseButton,
-  Ee as NavbarLinks,
+  jt as Menu,
+  Ee as NavBarActions,
+  He as NavbarCollapseButton,
+  qe as NavbarLinks,
   Pe as NavigationLink,
-  sa as OtpInput,
-  Nt as Pagination,
-  St as ProfilePictureUpload,
-  It as ProgressBar,
+  la as OtpInput,
+  Ct as Pagination,
+  kt as ProfilePictureUpload,
+  Rt as ProgressBar,
   Le as SecondaryBar,
   We as SegmentedButton,
   Bt as Select,
   Lt as SelectFormik,
-  Te as Sidebar,
+  Oe as Sidebar,
   ce as SidebarProvider,
-  na as SidebarRefProvider,
-  aa as Skeleton,
-  Tt as Spinner,
-  At as Steps,
+  ia as SidebarRefProvider,
+  ra as Skeleton,
+  Ot as Spinner,
+  Et as Steps,
   Dt as SwipeContainer,
-  zt as Switch,
-  Jt as TabLinks,
-  _t as Table,
-  Mt as TableBody,
-  $t as TableCaption,
-  Ft as TableCell,
-  Ut as TableFooter,
-  Vt as TableHead,
-  Gt as TableHeader,
-  Xt as TableRow,
-  Qt as TextArea,
-  ea as Tooltip,
+  Ht as Switch,
+  Kt as TabLinks,
+  Mt as Table,
+  $t as TableBody,
+  Ft as TableCaption,
+  Ut as TableCell,
+  Vt as TableFooter,
+  Gt as TableHead,
+  Xt as TableHeader,
+  Zt as TableRow,
+  Yt as TextArea,
+  ta as Tooltip,
   De as useActionsNavbar,
-  Me as useClickOutside,
+  $e as useClickOutside,
   ot as useDialogControl,
-  it as useDrawerDesktop,
-  ct as useDrawerMobile,
-  _e as useFileDropzone,
-  ca as useIsMobile,
-  qe as useNavbarCollapse,
-  Oe as useSidebar,
+  st as useDrawerDesktop,
+  ut as useDrawerMobile,
+  Me as useFileDropzone,
+  ua as useIsMobile,
+  ze as useNavbarCollapse,
+  Ae as useSidebar,
   F as useSidebarContext
 };