prometeo-design-system 3.1.3 → 3.1.4

package/dist/Scrollable.es.js

@@ -0,0 +1,260 @@
+import { j as h } from "./jsx-runtime-GkKLlHH4.js";
+import { useIsMobile as et } from "./useDevice.es.js";
+import { g as rt } from "./useLabelBackground-BDIHUdND.js";
+import { c as m } from "./cn-B6yFEsav.js";
+import { c as C } from "./index-BOQuZ0gG.js";
+import U, { useRef as i, useEffect as V } from "react";
+import { CrevronLeft as ot } from "./Icons/CrevronLeft.es.js";
+const _ = C(
+  "",
+  {
+    variants: {
+      axis: {
+        x: " overflow-x-auto overflow-y-hidden",
+        y: " overflow-y-auto overflow-x-hidden",
+        both: " overflow-auto"
+      }
+    }
+  }
+), $ = C("", {
+  variants: {
+    position: {
+      top: "",
+      bottom: "",
+      left: "",
+      right: ""
+    },
+    type: {
+      icon: " absolute z-100 rounded-full hover:scale-125 transition-all duration-300 ease-in-out shadow-xs rounded-full shadow-white/10 text-neutral-default-pressed",
+      shadow: "absolute z-100 transition-all duration-400 ease-in-out"
+    }
+  },
+  compoundVariants: [
+    { type: "icon", position: "top", className: "rotate-90 top-0 left-1/2 -translate-x-1/2 -translate-y-1/2" },
+    { type: "icon", position: "bottom", className: "rotate-270 bottom-0 left-1/2 -translate-x-1/2 translate-y-1/2" },
+    { type: "icon", position: "left", className: "top-1/2 -translate-y-1/2 -translate-x-1/2" },
+    { type: "icon", position: "right", className: "rotate-180 right-0 top-1/2 -translate-y-1/2 translate-x-1/2" },
+    { type: "shadow", position: "top", className: "top-0 left-0 w-full h-14" },
+    { type: "shadow", position: "bottom", className: "bottom-0 left-0 w-full h-14 rotate-180" },
+    { type: "shadow", position: "left", className: "left-0 top-0 h-full w-5" },
+    { type: "shadow", position: "right", className: "right-0 top-0 h-full w-5 rotate-180" }
+  ]
+}), st = C("", {
+  variants: {
+    hide: {
+      true: " prometeo-scrollbar-none",
+      false: ""
+    },
+    size: {
+      small: "prometeo-scrollbar-thin",
+      medium: ""
+    }
+  }
+}), ht = (I) => {
+  const { defaultBehavior: y = "scroll-on-click" } = I, F = et(), P = {
+    top: { show: !0, type: "shadow", behavior: y },
+    bottom: { show: !0, type: "shadow", behavior: y },
+    left: { show: !0, type: "icon", behavior: y },
+    right: { show: !0, type: "icon", behavior: y }
+  }, G = {
+    hide: !1,
+    size: "medium"
+  }, {
+    debugMode: J = !1,
+    className: j,
+    axis: k = "both",
+    children: K,
+    indicators: v = P,
+    scrollbarProps: R = G,
+    disableMouseScroll: z = !1
+  } = I, s = i({}), l = i(null), d = i(null), b = i(null), a = i(null), u = i(5), f = i({}), w = i(null), p = i(!1), Q = (e) => {
+    if (!l.current) return 0;
+    const { scrollTop: t, scrollLeft: r, scrollHeight: o, clientHeight: n, scrollWidth: c, clientWidth: g } = l.current;
+    switch (e) {
+      case "top":
+        return Math.max(0, t);
+      case "bottom":
+        return Math.max(0, o - (t + n));
+      case "left":
+        return Math.max(0, r);
+      case "right":
+        return Math.max(0, c - (r + g));
+      default:
+        return 0;
+    }
+  }, x = (e, t = 100, r = !0) => {
+    if (!l.current) return;
+    const o = Q(e), n = Math.min(Math.abs(t), o);
+    if (n === 0) return;
+    const c = e === "top" || e === "left" ? -n : n, g = {
+      top: { top: c, left: 0 },
+      bottom: { top: c, left: 0 },
+      left: { top: 0, left: c },
+      right: { top: 0, left: c }
+    };
+    l.current.scrollBy({ ...g[e], behavior: r ? "smooth" : "auto" });
+  }, X = (e) => {
+    if (!l.current) return;
+    const t = l.current, r = {
+      top: { top: 0, left: t.scrollLeft },
+      bottom: { top: t.scrollHeight, left: t.scrollLeft },
+      left: { top: t.scrollTop, left: 0 },
+      right: { top: t.scrollTop, left: t.scrollWidth }
+    };
+    t.scrollTo({ ...r[e], behavior: "smooth" });
+  }, Y = (e, t) => {
+    const r = s.current[e];
+    if (r) {
+      if (r.style.cursor = "pointer", t === "icon") {
+        const o = r.querySelector("svg");
+        o && (o.style.transition = "all 0.3s ease-in-out", o.style.transform = "scale(1.3)", o.style.backgroundColor = "rgba(255, 255, 255, 0.2)", o.style.borderRadius = "100%");
+      } else if (t === "shadow") {
+        const o = r.querySelector("span");
+        o && (e === "top" || e === "bottom" ? o.style.height = "90px" : o.style.width = "40px");
+      }
+    }
+  }, L = (e) => {
+    const t = s.current[e];
+    if (!t) return;
+    t.style.cursor = "";
+    const r = t.querySelector("svg");
+    r && (r.style.transform = "", r.style.backgroundColor = "", r.style.borderRadius = "");
+    const o = t.querySelector("span");
+    o && (o.style.height = "", o.style.width = "");
+  }, A = (e, t) => {
+    if (t === "scroll-on-click" && p.current) {
+      p.current = !1;
+      return;
+    }
+    if (f.current[e]) {
+      a.current && (clearTimeout(a.current), a.current = null), d.current && (clearInterval(d.current), d.current = null), L(e), f.current[e] = !1, X(e);
+      return;
+    }
+    if (t === "scroll-on-click") {
+      if (!l.current) return;
+      const { clientHeight: r, clientWidth: o } = l.current, n = e === "top" || e === "bottom" ? r * 0.8 : o * 0.8;
+      x(e, n);
+    }
+  }, D = (e, t) => {
+    a.current && (clearTimeout(a.current), a.current = null), p.current = !0, u.current = 3;
+    let r = 0;
+    w.current = e, f.current[e] = !1, x(e, u.current, !1), d.current = setInterval(() => {
+      r += 16;
+      const o = r / 1e3;
+      if (o >= 2 && !f.current[e] && (f.current[e] = !0, Y(e, t)), o <= 2)
+        u.current = 5 + o * 0.4;
+      else {
+        const n = o - 2;
+        u.current += Math.pow(n, 1.1) * 2;
+      }
+      u.current = Math.min(u.current, 100), x(e, u.current, !1);
+    }, 16);
+  }, B = (e) => {
+    b.current && (clearTimeout(b.current), b.current = null), d.current && (clearInterval(d.current), d.current = null), u.current = 5;
+    const t = e || w.current;
+    t ? f.current[t] ? (a.current && clearTimeout(a.current), a.current = setTimeout(() => {
+      L(t), f.current[t] = !1, p.current = !1;
+    }, 1e3)) : (L(t), f.current[t] = !1, p.current = !1) : p.current = !1, w.current = null;
+  }, W = (e, t, r) => {
+    F || t === "scroll-on-hover" && (b.current = setTimeout(() => {
+      D(e, r);
+    }, 200));
+  }, H = (e, t) => {
+    t === "scroll-on-hover" && B(e);
+  }, O = (e, t, r) => {
+    t === "scroll-on-click" && (p.current = !1, b.current = setTimeout(() => {
+      D(e, r);
+    }, 200));
+  }, q = (e, t) => {
+    t === "scroll-on-click" && B(e);
+  }, M = () => {
+    if (!l.current) return;
+    const e = l.current, { scrollTop: t, scrollLeft: r, scrollHeight: o, scrollWidth: n, clientHeight: c, clientWidth: g } = e, E = t <= 10, T = t + c >= o - 10, N = r <= 10, S = r + g >= n - 10;
+    s.current.top?.classList.toggle("opacity-0", E), s.current.top?.classList.toggle("pointer-events-none", E), s.current.top?.classList.toggle("pointer-events-auto", !E), s.current.bottom?.classList.toggle("opacity-0", T), s.current.bottom?.classList.toggle("pointer-events-none", T), s.current.bottom?.classList.toggle("pointer-events-auto", !T), s.current.left?.classList.toggle("opacity-0", N), s.current.left?.classList.toggle("pointer-events-none", N), s.current.left?.classList.toggle("pointer-events-auto", !N), s.current.right?.classList.toggle("opacity-0", S), s.current.right?.classList.toggle("pointer-events-none", S), s.current.right?.classList.toggle("pointer-events-auto", !S);
+  };
+  V(() => {
+    if (!l.current) return;
+    const e = l.current;
+    M(), e.addEventListener("scroll", M);
+    const t = (r) => {
+      z && r.preventDefault();
+    };
+    return e.addEventListener("wheel", t, { passive: !1 }), () => {
+      e.removeEventListener("scroll", M), e.removeEventListener("wheel", t);
+    };
+  }, [z]), V(() => {
+    if (!l.current) return;
+    const e = rt(l.current);
+    Object.entries(v).forEach(([t, r]) => {
+      if (r?.show && r.type === "shadow") {
+        const n = s.current[t]?.querySelector("span");
+        if (n) {
+          n.dataset.bgColor = e;
+          const c = t === "left" || t === "right" ? "to right" : "to bottom";
+          n.style.background = `linear-gradient(${c}, ${e} 40%, transparent)`, n.style.background = `linear-gradient(${c}, ${e} 40%, transparent)`;
+        }
+      }
+    });
+  }, [v]);
+  const Z = U.Children.toArray(K), tt = Object.values(v).some((e) => e?.show && e?.type === "icon");
+  return /* @__PURE__ */ h.jsxs("div", { className: m("relative p-0", j, _({ axis: k }), "scrolleable", tt ? "overflow-visible" : "overflow-hidden!"), children: [
+    /* @__PURE__ */ h.jsx(
+      "div",
+      {
+        ref: l,
+        className: m(
+          J && "border border-red-900 border-dashed",
+          j,
+          "py-2  relative w-full h-full min-h-full",
+          _({ axis: k }),
+          st({ hide: R?.hide, size: R?.size }),
+          ""
+        ),
+        children: Z?.map((e) => U.cloneElement(e, { className: m(e?.props?.className, "shrink-0! pointer-events-auto") }))
+      }
+    ),
+    /* @__PURE__ */ h.jsx("div", { className: "h-full w-full z-10 absolute inset-0 pointer-events-none overflow-hidden rounded-[inherit]", children: Object.entries(v).map(([e, t]) => {
+      if (!t?.show || t.type !== "shadow") return null;
+      const r = e;
+      return /* @__PURE__ */ h.jsx(
+        "span",
+        {
+          ref: (o) => {
+            s.current[e] = o;
+          },
+          className: m("cursor-default transition-all duration-500 ease-in-out z-100"),
+          onClick: () => A(r, t.behavior),
+          onMouseEnter: () => W(r, t.behavior, t.type),
+          onMouseLeave: () => H(r, t.behavior),
+          onMouseDown: () => O(r, t.behavior, t.type),
+          onMouseUp: () => q(r, t.behavior),
+          children: /* @__PURE__ */ h.jsx("span", { className: m($({ position: r, type: "shadow" }), t.className) })
+        },
+        e
+      );
+    }) }),
+    /* @__PURE__ */ h.jsx("div", { className: "h-full w-full z-20 absolute inset-0 pointer-events-none", children: Object.entries(v).map(([e, t]) => {
+      if (!t?.show || t.type !== "icon") return null;
+      const r = e;
+      return /* @__PURE__ */ h.jsx(
+        "span",
+        {
+          ref: (o) => {
+            s.current[e] = o;
+          },
+          className: "pointer-events-auto cursor-default transition-all duration-300 opacity-0",
+          onClick: () => A(r, t.behavior),
+          onMouseEnter: () => W(r, t.behavior, t.type),
+          onMouseLeave: () => H(r, t.behavior),
+          onMouseDown: () => O(r, t.behavior, t.type),
+          onMouseUp: () => q(r, t.behavior),
+          children: /* @__PURE__ */ h.jsx(ot, { size: 20, className: m($({ position: r, type: "icon" }), t.className) })
+        },
+        e
+      );
+    }) })
+  ] });
+};
+export {
+  ht as Scrollable
+};

package/dist/SegmentedButton.es.js

@@ -1,4 +1,4 @@
-import { j as u } from "./jsx-runtime-DKDX3adD.js";
+import { j as u } from "./jsx-runtime-GkKLlHH4.js";
 import { c as s } from "./cn-B6yFEsav.js";
 import z, { useState as M, useMemo as C, useEffect as L } from "react";
 import { motion as E } from "framer-motion";

package/dist/{Select-Bq1fVlwM.js → Select-BdxmkrjB.js}

@@ -1,13 +1,14 @@
-import { j as a } from "./jsx-runtime-DKDX3adD.js";
+import { j as a } from "./jsx-runtime-GkKLlHH4.js";
 import { c as f } from "./cn-B6yFEsav.js";
 import Ne, { memo as Z, useState as je, useRef as ce, useMemo as oe, useCallback as U, useEffect as ve, useImperativeHandle as Qe } from "react";
 import Xe from "./Spinner.es.js";
 import { createPortal as Ye } from "react-dom";
 import { u as Ze } from "./useDragScroll-CHN9OMwn.js";
-import { u as et, I as tt } from "./Input-EkMrxcNX.js";
-import { H as nt } from "./HelperComponent-DhGU_ug-.js";
-import { Close as rt } from "./Icons/Close.es.js";
-import lt from "./CheckBox.es.js";
+import { u as et } from "./useLabelBackground-BDIHUdND.js";
+import { H as tt } from "./HelperComponent-ljsn0xD6.js";
+import { Close as nt } from "./Icons/Close.es.js";
+import rt from "./CheckBox.es.js";
+import lt from "./Input.es.js";
 import Ke from "./Skeleton.es.js";
 import { Cancel as ot } from "./Icons/Cancel.es.js";
 import { ChevronDown as Ue } from "./Icons/ChevronDown.es.js";
@@ -52,7 +53,7 @@ const at = {
           ),
           type: "button",
           tabIndex: p,
-          children: /* @__PURE__ */ a.jsx(rt, { size: 18, className: f(u && Fe.icon) })
+          children: /* @__PURE__ */ a.jsx(nt, { size: 18, className: f(u && Fe.icon) })
         }
       )
     ]
@@ -607,7 +608,7 @@ function ct(e) {
           }
         ),
         (Ce || ee) && /* @__PURE__ */ a.jsx("div", { className: "min-h-6", children: /* @__PURE__ */ a.jsx(
-          nt,
+          tt,
           {
             ref: W,
             variant: F,
@@ -619,7 +620,7 @@ function ct(e) {
     }
   );
 }
-const dt = Z(ct, (e, n) => e.value === n.value && e.options === n.options && e.isLoading === n.isLoading && e.disabled === n.disabled && e.errorComponent === n.errorComponent && e.helperComponent === n.helperComponent && e.variant === n.variant && e.label === n.label && e.id === n.id && e.name === n.name && e.placeholder === n.placeholder && e.renderOptionContext === n.renderOptionContext && e.dropdownOptions?.controledSearchValue === n.dropdownOptions?.controledSearchValue && e.dropdownOptions?.isLoading === n.dropdownOptions?.isLoading), kt = dt;
+const dt = Z(ct, (e, n) => e.value === n.value && e.options === n.options && e.isLoading === n.isLoading && e.disabled === n.disabled && e.errorComponent === n.errorComponent && e.helperComponent === n.helperComponent && e.variant === n.variant && e.label === n.label && e.id === n.id && e.name === n.name && e.placeholder === n.placeholder && e.renderOptionContext === n.renderOptionContext && e.dropdownOptions?.controledSearchValue === n.dropdownOptions?.controledSearchValue && e.dropdownOptions?.isLoading === n.dropdownOptions?.isLoading), Et = dt;
 function ft({
   footer: e,
   isOpen: n,
@@ -867,7 +868,7 @@ function ft({
           },
           children: [
             !Ce && /* @__PURE__ */ a.jsx(
-              tt,
+              lt,
               {
                 name: "",
                 label: "",
@@ -1067,7 +1068,7 @@ const mt = Z(
             u && !p && "text-neutral-default-disabled hover:bg-neutral-default-default"
           ),
           children: [
-            i && !p && /* @__PURE__ */ a.jsx(lt, { checked: n, disabled: u }),
+            i && !p && /* @__PURE__ */ a.jsx(rt, { checked: n, disabled: u }),
             /* @__PURE__ */ a.jsx("span", { children: g })
           ]
         },
@@ -1105,6 +1106,6 @@ const Je = Z(
 );
 Je.displayName = "DefaultSelectionDisplay";
 export {
-  kt as S,
+  Et as S,
   G as g
 };

package/dist/Select.es.js

@@ -1,4 +1,4 @@
-import { S as f } from "./Select-Bq1fVlwM.js";
+import { S as f } from "./Select-BdxmkrjB.js";
 export {
   f as default
 };

package/dist/SelectSearch.es.js

@@ -1,5 +1,5 @@
-import { j as Y } from "./jsx-runtime-DKDX3adD.js";
-import { g as i, S as Z } from "./Select-Bq1fVlwM.js";
+import { j as Y } from "./jsx-runtime-GkKLlHH4.js";
+import { g as i, S as Z } from "./Select-BdxmkrjB.js";
 import { useState as A, useRef as E, useEffect as b, useMemo as ee, useCallback as te } from "react";
 function re(e) {
   const {

package/dist/Skeleton.es.js

@@ -1,4 +1,4 @@
-import { j as E } from "./jsx-runtime-DKDX3adD.js";
+import { j as E } from "./jsx-runtime-GkKLlHH4.js";
 import { c as B } from "./cn-B6yFEsav.js";
 import { memo as N, useRef as R, useCallback as D, useLayoutEffect as M } from "react";
 const y = (n) => {

package/dist/Spinner.es.js

@@ -1,4 +1,4 @@
-import { j as n } from "./jsx-runtime-DKDX3adD.js";
+import { j as n } from "./jsx-runtime-GkKLlHH4.js";
 import { c as l } from "./cn-B6yFEsav.js";
 import { c as p } from "./index-BOQuZ0gG.js";
 import { memo as d } from "react";

package/dist/Steps.es.js

@@ -1,4 +1,4 @@
-import { j as e } from "./jsx-runtime-DKDX3adD.js";
+import { j as e } from "./jsx-runtime-GkKLlHH4.js";
 import { c as j } from "./cn-B6yFEsav.js";
 import { motion as r } from "framer-motion";
 import N from "react";

package/dist/SwipeContainer.es.js

@@ -1,4 +1,4 @@
-import { j as o } from "./jsx-runtime-DKDX3adD.js";
+import { j as o } from "./jsx-runtime-GkKLlHH4.js";
 import { c as i } from "./cn-B6yFEsav.js";
 import { useState as d, useRef as D, useEffect as L } from "react";
 const O = ({

package/dist/Switch.es.js

@@ -1,8 +1,8 @@
-import { j as a } from "./jsx-runtime-DKDX3adD.js";
+import { j as a } from "./jsx-runtime-GkKLlHH4.js";
 import { c as r } from "./cn-B6yFEsav.js";
 import { memo as w, useRef as b } from "react";
-import { motion as c } from "framer-motion";
-const l = ({ name: d, value: o, onChange: f, disabled: t = !1 }) => {
+import { motion as l } from "framer-motion";
+const c = ({ name: d, value: o, onChange: f, disabled: t = !1 }) => {
   const n = b(null), h = (u) => {
     if (!n.current || t) return;
     u.preventDefault(), u.stopPropagation();
@@ -59,7 +59,7 @@ const l = ({ name: d, value: o, onChange: f, disabled: t = !1 }) => {
           i[e][s].container
         ),
         children: /* @__PURE__ */ a.jsx(
-          c.span,
+          l.span,
           {
             animate: m[e],
             whileHover: t ? {} : {
@@ -70,7 +70,7 @@ const l = ({ name: d, value: o, onChange: f, disabled: t = !1 }) => {
               "size-10 aspect-square rounded-full absolute top-1/2 -translate-y-1/2"
             ),
             children: /* @__PURE__ */ a.jsx(
-              c.span,
+              l.span,
               {
                 animate: p[e],
                 whileTap: t ? {} : {
@@ -89,8 +89,8 @@ const l = ({ name: d, value: o, onChange: f, disabled: t = !1 }) => {
     )
   ] });
 };
-l.displayName = "Switch";
-const y = w(l);
+c.displayName = "Switch";
+const y = w(c);
 export {
   y as Switch,
   y as default

package/dist/TabLinks.es.js

@@ -1,14 +1,14 @@
-import { j as n } from "./jsx-runtime-DKDX3adD.js";
+import { j as n } from "./jsx-runtime-GkKLlHH4.js";
 import { motion as x } from "framer-motion";
 import { memo as N } from "react";
 import { c as r } from "./cn-B6yFEsav.js";
-function o({
+function c({
   items: t,
   activeTab: e,
   onTabChange: i,
   className: l,
   tabClassName: d,
-  activeTabClassName: u,
+  activeTabClassName: o,
   indicatorClassName: f,
   animated: b = !0,
   renderTab: m
@@ -25,18 +25,18 @@ function o({
       ),
       role: "tablist",
       children: t?.map((a) => {
-        const s = e === a.id, c = () => h(a);
-        return m ? /* @__PURE__ */ n.jsx("div", { children: m(a, s, c) }, a.id) : /* @__PURE__ */ n.jsxs(
+        const s = e === a.id, u = () => h(a);
+        return m ? /* @__PURE__ */ n.jsx("div", { children: m(a, s, u) }, a.id) : /* @__PURE__ */ n.jsxs(
           "button",
           {
-            onClick: c,
+            onClick: u,
             disabled: a.disabled,
             className: r(
               "relative flex justify-center items-center h-10 px-4 font-medium focus:outline-none transition-colors",
               !a.disabled && "hover:text-primary-default-default cursor-pointer",
               a.disabled && "opacity-50 cursor-default",
               d,
-              s && u
+              s && o
             ),
             tabIndex: a.disabled ? -1 : 0,
             "aria-label": a.title,
@@ -78,8 +78,8 @@ function o({
     }
   );
 }
-o.displayName = "TabLinks";
-const C = N(o, (t, e) => {
+c.displayName = "TabLinks";
+const C = N(c, (t, e) => {
   if (t.activeTab !== e.activeTab || t.className !== e.className || t.tabClassName !== e.tabClassName || t.activeTabClassName !== e.activeTabClassName || t.indicatorClassName !== e.indicatorClassName || t.animated !== e.animated || t.onTabChange !== e.onTabChange || t.renderTab !== e.renderTab || t.items.length !== e.items.length)
     return !1;
   for (let i = 0; i < t.items.length; i++) {

package/dist/Table.es.js

@@ -1,4 +1,4 @@
-import { j as r } from "./jsx-runtime-DKDX3adD.js";
+import { j as r } from "./jsx-runtime-GkKLlHH4.js";
 import { c as l } from "./cn-B6yFEsav.js";
 import * as o from "react";
 const n = o.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ r.jsx("div", { className: "w-full", children: /* @__PURE__ */ r.jsx(

package/dist/TextArea.es.js

@@ -1,4 +1,4 @@
-import { j as k } from "./jsx-runtime-DKDX3adD.js";
+import { j as k } from "./jsx-runtime-GkKLlHH4.js";
 import { c as A } from "./cn-B6yFEsav.js";
 import * as a from "react";
 import { forwardRef as E } from "react";

package/dist/Toast.es.js

@@ -1,4 +1,4 @@
-import { j as e } from "./jsx-runtime-DKDX3adD.js";
+import { j as e } from "./jsx-runtime-GkKLlHH4.js";
 import w from "react";
 import { toast as p } from "sonner";
 import { c as s } from "./cn-B6yFEsav.js";

package/dist/ToastProvider.es.js

@@ -1,4 +1,4 @@
-import { j as t } from "./jsx-runtime-DKDX3adD.js";
+import { j as t } from "./jsx-runtime-GkKLlHH4.js";
 import { Toaster as r } from "sonner";
 const i = ({ ...o }) => /* @__PURE__ */ t.jsx(r, { ...o, position: "bottom-right", richColors: !1, theme: "light" });
 export {

package/dist/Tooltip.es.js

@@ -1,4 +1,4 @@
-import { j as e } from "./jsx-runtime-DKDX3adD.js";
+import { j as e } from "./jsx-runtime-GkKLlHH4.js";
 import { AnimatePresence as f, motion as n } from "framer-motion";
 import { useState as p, cloneElement as x } from "react";
 import { Close as b } from "./Icons/Close.es.js";

package/dist/components/Avatar/Avatar.d.ts

@@ -7,5 +7,5 @@ interface IAvatar {
     subImageUrl?: string;
     borderColor?: string;
 }
-export default function Avatar({ imageUrl, sizeImage, sizeFallback, fallbackText, subImageUrl, borderColor, }: IAvatar): import("react/jsx-runtime").JSX.Element;
+export default function Avatar({ imageUrl, sizeImage, sizeFallback, fallbackText, subImageUrl, }: IAvatar): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Drawer/DrawerDesktop.d.ts

@@ -15,6 +15,7 @@ export interface DrawerDesktopProps<TContext = unknown> {
     attachToParent?: boolean;
     closeOnOverlayClick?: boolean;
     hideCloseButton?: boolean;
+    unmountChildrenOnClose?: boolean;
 }
 declare const DrawerDesktop: import('react').ForwardRefExoticComponent<DrawerDesktopProps<any> & import('react').RefAttributes<DrawerDesktopHandle<any>>>;
 export default DrawerDesktop;

package/dist/components/NavigationDrawer/NavigationDrawer.d.ts

@@ -3,10 +3,17 @@ type NavigationDrawerRenderContext = {
     toggleCollapse: () => void;
     getIsCollapsed: () => boolean;
     subscribeToCollapse: (listener: (collapsed: boolean) => void) => () => void;
+    openSidebar: () => void;
+    closeSidebar: () => void;
+    toggleSidebar: () => void;
+    getIsSidebarOpen: () => boolean;
+    subscribeToSidebarOpen: (listener: (open: boolean) => void) => () => void;
 };
 type NavigationDrawerSlotChildren = ReactNode | ((context: NavigationDrawerRenderContext) => ReactNode);
 export interface NavigationDrawerProps {
     children?: NavigationDrawerSlotChildren;
+    classNameDrawer?: string;
+    classNameSidebar?: string;
 }
 type SlotBaseProps = {
     children?: NavigationDrawerSlotChildren;
@@ -14,6 +21,14 @@ type SlotBaseProps = {
     context?: NavigationDrawerRenderContext;
 };
 type ContentProps = SlotBaseProps & Omit<React.AllHTMLAttributes<HTMLDivElement>, "children">;
+export type NavigationDrawerSidebarProps = {
+    children?: NavigationDrawerSlotChildren;
+    className?: string;
+    context?: NavigationDrawerRenderContext;
+    modal?: boolean;
+    closeOnOverlayClick?: boolean;
+    unmountChildrenOnClose?: boolean;
+};
 declare const NavigationDrawer: React.NamedExoticComponent<NavigationDrawerProps> & {
     readonly type: (props: NavigationDrawerProps) => import("react/jsx-runtime").JSX.Element;
 } & {
@@ -24,10 +39,11 @@ declare const NavigationDrawer: React.NamedExoticComponent<NavigationDrawerProps
     Spacer: React.MemoExoticComponent<({ className }: {
         className?: string;
     }) => import("react/jsx-runtime").JSX.Element>;
-    Outlet: React.MemoExoticComponent<({ children, className, context }: {
+    Outlet: React.NamedExoticComponent<{
         children?: NavigationDrawerSlotChildren;
         className?: string;
         context?: NavigationDrawerRenderContext;
-    }) => import("react/jsx-runtime").JSX.Element>;
+    } & React.RefAttributes<HTMLDivElement>>;
+    Sidebar: React.NamedExoticComponent<NavigationDrawerSidebarProps & React.RefAttributes<HTMLDivElement>>;
 };
 export default NavigationDrawer;

package/dist/components/NavigationDrawer/NavigationDrawerActionItem.d.ts

@@ -6,9 +6,11 @@ export interface NavigationDrawerActionItemProps {
     count?: number;
     className?: string;
     isActive?: boolean;
+    disabled?: boolean;
     onClick?: () => void;
     isView?: boolean | (() => boolean);
+    order?: number;
 }
-declare const NavigationDrawerActionItem: import('react').MemoExoticComponent<(props: NavigationDrawerActionItemProps) => import("react/jsx-runtime").JSX.Element>;
+declare const NavigationDrawerActionItem: import('react').MemoExoticComponent<(props: NavigationDrawerActionItemProps) => import("react/jsx-runtime").JSX.Element | null>;
 export default NavigationDrawerActionItem;
 export type { NavigationDrawerActionItemProps as NavigationDrawerActionItemPropsType };

package/dist/components/NavigationDrawer/NavigationDrawerItemBase.d.ts

@@ -12,6 +12,7 @@ export interface NavigationDrawerItemBaseProps {
     as?: "a" | "button" | "div";
     onClick?: React.MouseEventHandler;
     onAuxClick?: React.MouseEventHandler;
+    disabled?: boolean;
 }
 declare const NavigationDrawerItemBase: React.MemoExoticComponent<(props: NavigationDrawerItemBaseProps) => import("react/jsx-runtime").JSX.Element>;
 export default NavigationDrawerItemBase;

package/dist/components/NavigationDrawer/NavigationDrawerLinkItem.d.ts

@@ -9,6 +9,7 @@ export interface NavigationDrawerLinkItemProps {
     relatedPaths?: string[];
     count?: number;
     className?: string;
+    disabled?: boolean;
     isSelected?: boolean;
     toggleCollapse?: () => void;
     getIsCollapsed?: () => boolean;

package/dist/components/NotificationCard/NotificationCard.d.ts

@@ -0,0 +1,25 @@
+import { default as React } from 'react';
+import { ButtonVariant } from '../Shared/types';
+export interface NotificationAction<NotificationMetadata = unknown> {
+    label: string;
+    onClick: (metadata?: NotificationMetadata) => void;
+    variant?: ButtonVariant;
+    disabled?: boolean;
+    hidden?: boolean;
+}
+export interface NoitificationUser {
+    name: string;
+    profile_picture?: string;
+}
+export interface NotificationCardProps<NotificationMetadata = unknown> {
+    user: NoitificationUser;
+    body: string | React.ReactNode | ((metadata?: NotificationMetadata) => React.ReactNode);
+    date: string | Date;
+    actions?: [NotificationAction<NotificationMetadata>, NotificationAction<NotificationMetadata>] | [NotificationAction<NotificationMetadata>];
+    isNew?: boolean;
+    className?: string;
+    metadata?: NotificationMetadata;
+}
+declare const NotificationCard: <NotificationMetadata = unknown>({ user, body, date, actions, isNew, className, metadata }: NotificationCardProps<NotificationMetadata>) => import("react/jsx-runtime").JSX.Element;
+export default NotificationCard;
+export type NotificationCardComponent = typeof NotificationCard;

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

@@ -0,0 +1,8 @@
+import { ReactNode } from 'react';
+interface PyrionHelpSectionProps {
+    onCloseClick?: VoidFunction;
+    children?: ReactNode;
+    title?: string;
+}
+declare const PyrionHelpSection: ({ onCloseClick, children, title }: PyrionHelpSectionProps) => import("react/jsx-runtime").JSX.Element;
+export default PyrionHelpSection;