prometeo-design-system 4.2.4 → 4.2.5

package/dist/SelectSearch.es.js

@@ -1,117 +1,117 @@
 import { j as Y } from "./jsx-runtime-GkKLlHH4.js";
 import { g as i } from "./utils-X4-h3cum.js";
-import { useState as A, useRef as E, useEffect as b, useMemo as ee, useCallback as te } from "react";
+import { useState as A, useRef as E, useEffect as b, useMemo as ee, useCallback as ne } from "react";
 import Z from "./Select.es.js";
 function re(e) {
   const {
-    options: p,
+    options: C,
     fetcher: d,
     asyncMode: _ = "fetch_in_open",
     disabled: w = !1,
     debounceDelay: P = 500,
     minCharacters: T = 3,
     optionLabel: h,
-    optionValue: s,
+    optionValue: c,
     controlledValue: f,
     isOpen: F,
-    inputRef: y,
+    inputRef: p,
     name: I
-  } = e || {}, M = p ? p.filter((t) => t != null) : [], [V, g] = A(M || []), [D, k] = A(M || []), [c, N] = A(""), [W, C] = A(!1), [J, U] = A(!1), l = E(null), O = E(null), m = E(!1), L = E(d), S = e?.multiple === !0 || !1, j = E(S ? [] : void 0), [a, v] = A(S ? [] : void 0);
+  } = e || {}, M = C ? C.filter((n) => n != null) : [], [V, g] = A(M || []), [D, k] = A(M || []), [s, N] = A(""), [W, v] = A(!1), [J, U] = A(!1), l = E(null), O = E(null), m = E(!1), S = E(d), L = e?.multiple === !0 || !1, j = E(L ? [] : void 0), [a, y] = A(L ? [] : void 0);
   b(() => {
-    L.current = d;
+    S.current = d;
   }, [d]), b(() => {
-    if (S) {
-      const t = z(f, "value");
-      v(t);
+    if (L) {
+      const n = z(f, "value");
+      y(n);
     } else
-      f != null ? v(f) : v(void 0);
+      f != null ? y(f) : y(void 0);
   }, [f]), b(() => {
     j.current = f !== void 0 ? f : a;
   }, [f, a]), b(() => {
     if (e?.options) {
-      const t = e.options.filter((n) => n != null);
-      g(t), k(t);
+      const n = e.options.filter((t) => t != null);
+      g(n), k(n);
     }
   }, [e?.options]);
-  const B = ee(() => (t, n) => new Promise((o, r) => {
-    l.current && clearTimeout(l.current), l.current = setTimeout(() => t(c).then(o).catch(r), n);
-  }), [c]), ne = (t) => {
-    const n = f !== void 0, o = (r) => s ? i(r, s) : i(r, "id");
+  const B = ee(() => (n, t) => new Promise((o, r) => {
+    l.current && clearTimeout(l.current), l.current = setTimeout(() => n(s).then(o).catch(r), t);
+  }), [s]), te = (n) => {
+    const t = f !== void 0, o = (r) => c ? i(r, c) : i(r, "id");
     if (e?.multiple === !0) {
       const r = j.current || [];
       let u;
-      r.some((x) => o(x) === o(t)) ? u = r.filter((x) => o(x) !== o(t)) : u = [...r, t], n ? (j.current = u, e?.onChange?.(u, I)) : (j.current = u, v(u), e?.onChange?.(u, I));
+      r.some((x) => o(x) === o(n)) ? u = r.filter((x) => o(x) !== o(n)) : u = [...r, n], t ? (j.current = u, e?.onChange?.(u, I)) : (j.current = u, y(u), e?.onChange?.(u, I));
     } else
-      n ? (j.current = t, e?.onChange?.(t, I)) : (j.current = t, v(t), e?.onChange?.(t, I));
-  }, q = (t) => (e?.onFetchingStart?.(), L.current?.(t) || Promise.resolve([])), z = (t, n) => Array.isArray(t) ? (t.some((o) => typeof o != "object" || o === null) && console.debug(`El valor del ${n || "resultado del fetcher"} contiene elementos no válidos (null,undefined, no-object)`, t), t?.filter((o) => o != null) || []) : (console.debug(`El valor del ${n || "resultado del fetcher"} no es un Array (tipo de dato obtenido: ${typeof t})`), []), $ = te((t, n) => t.length === 0 ? n : s ? n.filter((o) => !t.some((r) => i(r, s) === i(o, s))) : n.filter((o) => !t.some((r) => i(r, "id") === i(o, "id"))), [s]);
+      t ? (j.current = n, e?.onChange?.(n, I)) : (j.current = n, y(n), e?.onChange?.(n, I));
+  }, q = (n) => (e?.onFetchingStart?.(), S.current?.(n) || Promise.resolve([])), z = (n, t) => Array.isArray(n) ? (n.some((o) => typeof o != "object" || o === null) && console.debug(`El valor del ${t || "resultado del fetcher"} contiene elementos no válidos (null,undefined, no-object)`, n), n?.filter((o) => o != null) || []) : (console.debug(`El valor del ${t || "resultado del fetcher"} no es un Array (tipo de dato obtenido: ${typeof n})`), []), $ = ne((n, t) => n.length === 0 ? t : c ? t.filter((o) => !n.some((r) => i(r, c) === i(o, c))) : t.filter((o) => !n.some((r) => i(r, "id") === i(o, "id"))), [c]);
   b(() => {
-    const t = e?.subscribeOpenChange;
-    if (!t) return;
-    const n = t((o) => {
+    const n = e?.subscribeOpenChange;
+    if (!n) return;
+    const t = n((o) => {
       U(o);
     });
     return () => {
-      n && n();
+      t && t();
     };
   }, [e?.subscribeOpenChange]);
   const G = F !== void 0 ? F : J;
   b(() => {
-    if (!w && L.current && _ === "fetch_on_type") {
-      if (!c || c === "" || c.length < T) {
-        l.current && clearTimeout(l.current), C(!1);
+    if (!w && S.current && _ === "fetch_on_type") {
+      if (!s || s === "" || s.length < T) {
+        l.current && clearTimeout(l.current), v(!1);
         return;
       }
-      const t = B(q, P);
-      C(!0), t.then((n) => {
-        const o = z(n);
+      const n = B(q, P);
+      v(!0), n.then((t) => {
+        const o = z(t);
         g(o);
       }).finally(() => {
-        C(!1), e?.onFetchingEnd?.();
+        v(!1), e?.onFetchingEnd?.();
       });
     }
-  }, [_, c, w, P, B, T]), b(() => {
+  }, [_, s, w, P, B, T]), b(() => {
     if (!w)
       if (G) {
         if (e?.onOpen?.(), _ === "fetch_in_open") {
-          if (!L.current)
+          if (!S.current)
             return;
-          C(!0), q().then((t) => {
-            const n = z(t);
+          v(!0), q().then((n) => {
+            const t = z(n);
             g(() => {
-              const o = n.filter((r) => {
-                if (s)
-                  return i(r, s) !== void 0;
+              const o = t.filter((r) => {
+                if (c)
+                  return i(r, c) !== void 0;
               });
-              return S && a.length > 0 ? [...$(a, o), ...a] : o;
+              return L && a.length > 0 ? [...$(a, o), ...a] : o;
             });
           }).finally(() => {
-            C(!1), e?.onFetchingEnd?.();
+            v(!1), e?.onFetchingEnd?.();
           });
         }
       } else
         e?.onClose?.();
   }, [G, _, w]);
-  const H = (t, n) => t?.filter((o) => {
+  const H = (n, t) => n?.filter((o) => {
     if (h)
-      return i(o, h)?.toLowerCase().includes(n.toLowerCase());
+      return i(o, h)?.toLowerCase().includes(t.toLowerCase());
     {
       const r = o;
       switch (typeof r) {
         case "string":
-          return r?.toLowerCase().includes(n.toLowerCase());
+          return r?.toLowerCase().includes(t.toLowerCase());
         case "number":
-          return r.toString().includes(n);
+          return r.toString().includes(t);
         case "object":
-          return Object.values(r).some((R) => R.toString()?.toLowerCase().includes(n.toLowerCase()));
+          return Object.values(r).some((R) => R.toString()?.toLowerCase().includes(t.toLowerCase()));
         default:
           return !1;
       }
     }
-  }) || [], oe = (t) => t?.sort((n, o) => {
+  }) || [], oe = (n) => n?.sort((t, o) => {
     if (h)
-      return i(n, h) < i(o, h) ? -1 : 1;
+      return i(t, h) < i(o, h) ? -1 : 1;
     {
-      const u = ["label", "name", "value"].find((K) => typeof n == "object" && Object.keys(n).includes(K)), R = n, x = o;
+      const u = ["label", "name", "value"].find((K) => typeof t == "object" && Object.keys(t).includes(K)), R = t, x = o;
       switch (typeof R) {
         case "string":
           return R < x ? -1 : 1;
@@ -119,7 +119,7 @@ function re(e) {
           return R < x ? -1 : 1;
         case "object":
           if (u) {
-            const K = i(n, u), le = i(o, u);
+            const K = i(t, u), le = i(o, u);
             return K < le ? -1 : 1;
           } else
             return 1;
@@ -127,21 +127,21 @@ function re(e) {
           return 1;
       }
     }
-  }) || [], Q = (t) => {
-    const n = typeof y == "function" ? y() : y;
-    t.target === n?.current && (O.current && clearTimeout(O.current), m.current || (m.current = !0, e?.onTypeStart?.()), O.current = setTimeout(() => {
+  }) || [], Q = (n) => {
+    const t = typeof p == "function" ? p() : p;
+    n.target === t?.current && (O.current && clearTimeout(O.current), m.current || (m.current = !0, e?.onTypeStart?.()), O.current = setTimeout(() => {
       m.current = !1;
     }, P));
   };
   b(() => {
-    if (c === "")
+    if (s === "")
       k(oe(V));
-    else if (S) {
-      const t = $(a, V);
-      k([...H(t, c), ...a]);
+    else if (L) {
+      const n = $(a, V);
+      k([...H(n, s), ...a]);
     } else {
-      const t = $([a], V);
-      k([...H(t, c), a]);
+      const n = $([a], V);
+      k([...H(n, s), a]);
     }
   }, [V]), b(() => (document.addEventListener("keydown", Q), () => {
     document.removeEventListener("keydown", Q);
@@ -150,31 +150,31 @@ function re(e) {
     N("");
   };
   return {
-    inputValue: c,
+    inputValue: s,
     setInputValue: N,
     cleanInputValue: X,
     cleanOptions: () => {
-      if (S)
+      if (L)
         g(a);
       else {
-        const t = a;
-        g(t ? [t] : []);
+        const n = a;
+        g(n ? [n] : []);
       }
       X();
     },
     clearValue: () => {
-      v(S ? [] : void 0);
+      y(L ? [] : void 0);
     },
     filteredOptions: D,
     isLoading: W,
     value: a,
-    setValue: v,
-    onOptionClick: ne
+    setValue: y,
+    onOptionClick: te
   };
 }
 const he = (e) => {
-  const p = E(null), { asyncMode: d = "fetch_in_open" } = e, _ = (l, O, m) => {
-    const L = {
+  const C = E(null), { asyncMode: d = "fetch_in_open" } = e, _ = (l, O, m) => {
+    const S = {
       options: l.options,
       fetcher: l.fetcher,
       asyncMode: O,
@@ -194,36 +194,36 @@ const he = (e) => {
       name: l.name
     };
     return l.multiple ? {
-      ...L,
+      ...S,
       multiple: !0,
       controlledValue: l.value,
       onChange: l.onChange
     } : {
-      ...L,
+      ...S,
       multiple: !1,
       controlledValue: l.value,
       onChange: l.onChange
     };
-  }, { inputValue: w, setInputValue: P, filteredOptions: T, isLoading: h, value: s, onOptionClick: f, cleanInputValue: F, cleanOptions: y, clearValue: I } = re(_(e, d, p));
+  }, { inputValue: w, setInputValue: P, filteredOptions: T, isLoading: h, value: c, onOptionClick: f, cleanInputValue: F, cleanOptions: p, clearValue: I } = re(_(e, d, C));
   b(() => {
-    !e.controls || !p.current || (e.controls.current = {
-      ...p.current,
+    !e.controls || !C.current || (e.controls.current = {
+      ...C.current,
       cleanOptions: () => {
-        y();
+        p();
       }
     });
-  }, [e.controls, y]);
-  const M = te(
+  }, [e.controls, p]);
+  const M = ne(
     () => d === "fetch_on_type" ? h : !1,
     [d, h]
-  ), V = ee(() => e.multiple ? s.map((l) => i(l, e.optionValue)) : s ? i(s, e.optionValue) : void 0, [s, e.optionValue, e.multiple]), g = (l) => {
+  ), V = ee(() => e.multiple ? c.map((l) => i(l, e.optionValue)) : c ? i(c, e.optionValue) : void 0, [c, e.optionValue, e.multiple]), g = (l) => {
     const O = T.find((m) => i(m, e.optionValue) === l.id);
     O && f(O);
-  }, { displayMode: D = e.multiple ? "chips" : "compact", dropdownOptions: k, overflow: c = "scroll", onChange: N, onClear: W, ...C } = e.selectComponentProps || {}, J = {
+  }, { displayMode: D = e.multiple ? "chips" : "compact", dropdownOptions: k, overflow: s = "scroll", onChange: N, onClear: W, ...v } = e.selectComponentProps || {}, J = {
     controledSearchValue: w,
     onSearchValueChange: d === "fetch_on_type" ? P : void 0,
     onSearchClear: d === "fetch_on_type" ? () => {
-      F(), y();
+      F(), p();
     } : void 0,
     inputSearchPlaceholder: e.inputSearchPlaceholder,
     isLoading: M(),
@@ -238,8 +238,8 @@ const he = (e) => {
       disabled: e.disabled,
       className: e.className,
       name: e.name,
-      overflow: c,
-      ...C,
+      overflow: s,
+      ...v,
       onClear: e?.selectComponentProps?.onClear && U,
       multiple: !0,
       value: V,
@@ -248,9 +248,10 @@ const he = (e) => {
       optionValue: e.optionValue,
       optionLabel: e.optionLabel,
       renderOption: e.renderOption,
+      renderSelection: e.renderSelection,
       onOptionClick: g,
       displayMode: D,
-      controls: p,
+      controls: C,
       emptyMessage: "Use el buscador para obtener las opciones disponibles",
       dropdownOptions: J,
       isLoading: d === "fetch_in_open" ? h : !1
@@ -259,10 +260,10 @@ const he = (e) => {
     Z,
     {
       disabled: e.disabled,
-      ...C,
+      ...v,
       onClear: U,
       className: e.className,
-      overflow: c,
+      overflow: s,
       name: e.name,
       multiple: !1,
       value: V,
@@ -271,9 +272,10 @@ const he = (e) => {
       optionValue: e.optionValue,
       optionLabel: e.optionLabel,
       renderOption: e.renderOption,
+      renderSelection: e.renderSelection,
       onOptionClick: g,
       displayMode: "compact",
-      controls: p,
+      controls: C,
       emptyMessage: "Use el buscador para obtener las opciones disponibles",
       dropdownOptions: J,
       isLoading: d === "fetch_in_open" ? h : !1

package/dist/TabLinks-DxqprStp.js

@@ -0,0 +1,147 @@
+import { j as o } from "./jsx-runtime-GkKLlHH4.js";
+import { motion as v } from "framer-motion";
+import { memo as I, isValidElement as z } from "react";
+import { c as d } from "./cn-B6yFEsav.js";
+import $ from "./PlainTooltip.es.js";
+const w = /* @__PURE__ */ Symbol.for("react.memo"), E = (e, a, l) => {
+  if (!e)
+    return null;
+  if (typeof e == "function") {
+    const i = e;
+    return /* @__PURE__ */ o.jsx(i, { size: l, className: a });
+  }
+  if (typeof e == "object") {
+    if (z(e))
+      return e;
+    if ("$$typeof" in e && e.$$typeof === w) {
+      const i = e;
+      return /* @__PURE__ */ o.jsx(i, { size: l, className: a });
+    }
+  }
+  return e;
+};
+function j({
+  items: e,
+  activeTab: a,
+  onTabChange: l,
+  className: i,
+  tabClassName: n,
+  activeTabClassName: s,
+  indicatorClassName: f,
+  animated: r = !0,
+  renderTab: u
+}) {
+  const b = (t) => {
+    t.disabled || l?.(t.id, t);
+  };
+  return /* @__PURE__ */ o.jsx(
+    "div",
+    {
+      className: d(
+        "flex flex-row justify-around items-end relative border-b border-neutral-strong-default w-full md:justify-start md:px-10 md:gap-5",
+        i
+      ),
+      role: "tablist",
+      children: e?.map((t) => {
+        const c = a === t.id, m = () => b(t), { iconPosition: p = "top", iconSize: x = 24 } = t;
+        return u ? /* @__PURE__ */ o.jsx("div", { children: u(t, c, m, t.onIconClick, t.onIconHover, t.iconTooltipTitle, t.iconTooltipProps, t.iconSize) }, t.id) : /* @__PURE__ */ o.jsx(
+          L,
+          {
+            id: t.id,
+            title: t.title,
+            icon: t.icon,
+            iconPosition: p,
+            onClick: m,
+            disabled: t.disabled,
+            className: n,
+            isActive: c,
+            activeClassName: s,
+            animated: r,
+            onIconHover: t.onIconHover,
+            onIconClick: t.onIconClick,
+            iconTooltipTitle: t.iconTooltipTitle,
+            iconTooltipProps: t.iconTooltipProps,
+            iconSize: x,
+            indicatorClassName: f
+          }
+        );
+      })
+    }
+  );
+}
+j.displayName = "TabLinks";
+const W = I(j, (e, a) => {
+  if (e.activeTab !== a.activeTab || e.className !== a.className || e.tabClassName !== a.tabClassName || e.activeTabClassName !== a.activeTabClassName || e.indicatorClassName !== a.indicatorClassName || e.animated !== a.animated || e.onTabChange !== a.onTabChange || e.renderTab !== a.renderTab || e.items.length !== a.items.length)
+    return !1;
+  for (let l = 0; l < e.items.length; l++) {
+    const i = e.items[l], n = a.items[l];
+    if (i.id !== n.id || i.title !== n.title || i.disabled !== n.disabled || i.description !== n.description)
+      return !1;
+  }
+  return !0;
+}), L = ({ id: e, title: a, icon: l, iconPosition: i = "top", onClick: n, disabled: s = !1, className: f, isActive: r = !1, activeClassName: u, animated: b = !0, onIconHover: t, onIconClick: c, iconTooltipTitle: m, iconTooltipProps: p, iconSize: x = 20, indicatorClassName: k }) => {
+  const C = (h, y, T, N, g) => T ? /* @__PURE__ */ o.jsx($, { title: T, ...N, children: /* @__PURE__ */ o.jsx("div", { onMouseEnter: y, onClick: g, children: h }) }) : /* @__PURE__ */ o.jsx("div", { onMouseEnter: y, onClick: g, children: h });
+  return /* @__PURE__ */ o.jsxs(
+    "button",
+    {
+      onClick: n,
+      disabled: s,
+      className: d(
+        "group/tablink-item",
+        "relative flex flex-col pb-[14px] justify-center items-center h-max px-4 font-medium focus:outline-none transition-colors pt-[14px]",
+        s && "hover:text-primary-default-default cursor-pointer",
+        s && "opacity-50 cursor-default",
+        f,
+        r && u
+      ),
+      tabIndex: s ? -1 : 0,
+      "aria-label": a,
+      role: "tab",
+      "aria-selected": r,
+      children: [
+        /* @__PURE__ */ o.jsxs("div", { className: d(
+          "flex items-center gap-0.5",
+          i === "left" && "flex-row-reverse",
+          i === "top" ? "flex-col-reverse" : "gap-1"
+        ), children: [
+          /* @__PURE__ */ o.jsx(
+            "label",
+            {
+              className: d(
+                "transition-all duration-300 ease-in-out relative z-10 group-hover/tablink-item:text-neutral-medium-hover ",
+                r ? "text-primary-default-default prometeo-fonts-title-medium group-hover/tablink-item:text-primary-default-default" : "text-neutral-medium-default prometeo-fonts-body-large cursor-pointer",
+                "leading-6! line-clamp-1"
+              ),
+              children: a
+            }
+          ),
+          C(E(l, d(
+            "transition-all duration-300 ease-in-out group-hover/tablink-item:text-neutral-medium-hover ",
+            r ? "text-primary-default-default prometeo-fonts-title-medium group-hover/tablink-item:text-primary-default-default" : "text-neutral-medium-default prometeo-fonts-body-large"
+          ), x), t, m, p, c)
+        ] }),
+        r && b && /* @__PURE__ */ o.jsx(
+          v.div,
+          {
+            layoutId: "tab-indicator",
+            className: d(
+              "absolute -bottom-px left-1/2 -translate-x-1/2  h-[4px] rounded-t-xl bg-primary-default-default z-0 w-[calc(100%-32px)]",
+              k
+            ),
+            transition: {
+              type: "spring",
+              stiffness: 250,
+              damping: 17
+            },
+            "aria-hidden": "true"
+          }
+        )
+      ]
+    },
+    e
+  );
+};
+export {
+  W as T,
+  L as a
+};

package/dist/TabLinks.es.js

@@ -1,123 +1,4 @@
-import { j as i } from "./jsx-runtime-GkKLlHH4.js";
-import { motion as C } from "framer-motion";
-import { memo as N, isValidElement as I } from "react";
-import { c as s } from "./cn-B6yFEsav.js";
-import z from "./PlainTooltip.es.js";
-const w = /* @__PURE__ */ Symbol.for("react.memo"), E = (t, a, r) => {
-  if (!t)
-    return null;
-  if (typeof t == "function") {
-    const l = t;
-    return /* @__PURE__ */ i.jsx(l, { size: r, className: a });
-  }
-  if (typeof t == "object") {
-    if (I(t))
-      return t;
-    if ("$$typeof" in t && t.$$typeof === w) {
-      const l = t;
-      return /* @__PURE__ */ i.jsx(l, { size: r, className: a });
-    }
-  }
-  return t;
-};
-function p({
-  items: t,
-  activeTab: a,
-  onTabChange: r,
-  className: l,
-  tabClassName: n,
-  activeTabClassName: h,
-  indicatorClassName: y,
-  animated: g = !0,
-  renderTab: d
-}) {
-  const j = (e) => {
-    e.disabled || r?.(e.id, e);
-  };
-  return /* @__PURE__ */ i.jsx(
-    "div",
-    {
-      className: s(
-        "flex flex-row justify-around items-end relative border-b border-neutral-strong-default w-full md:justify-start md:px-10 md:gap-5",
-        l
-      ),
-      role: "tablist",
-      children: t?.map((e) => {
-        const o = a === e.id, u = () => j(e), { iconPosition: f = "top", iconSize: T = 24 } = e, v = (c, m, b, k, x) => b ? /* @__PURE__ */ i.jsx(z, { title: b, ...k, children: /* @__PURE__ */ i.jsx("div", { onMouseEnter: m, onClick: x, children: c }) }) : /* @__PURE__ */ i.jsx("div", { onMouseEnter: m, onClick: x, children: c });
-        return d ? /* @__PURE__ */ i.jsx("div", { children: d(e, o, u, e.onIconClick, e.onIconHover, e.iconTooltipTitle, e.iconTooltipProps, e.iconSize) }, e.id) : /* @__PURE__ */ i.jsxs(
-          "button",
-          {
-            onClick: u,
-            disabled: e.disabled,
-            className: s(
-              "group/tablink-item",
-              "relative flex flex-col pb-3 justify-center items-center h-max px-4 font-medium focus:outline-none transition-colors",
-              !e.disabled && "hover:text-primary-default-default cursor-pointer",
-              e.disabled && "opacity-50 cursor-default",
-              n,
-              o && h
-            ),
-            tabIndex: e.disabled ? -1 : 0,
-            "aria-label": e.title,
-            role: "tab",
-            "aria-selected": o,
-            children: [
-              /* @__PURE__ */ i.jsxs("div", { className: s(
-                "flex items-center gap-0.5",
-                f === "left" && "flex-row-reverse",
-                f === "top" ? "flex-col-reverse" : "gap-1"
-              ), children: [
-                /* @__PURE__ */ i.jsx(
-                  "label",
-                  {
-                    className: s(
-                      "transition-all duration-300 ease-in-out relative z-10 group-hover/tablink-item:text-neutral-medium-hover ",
-                      o ? "text-primary-default-default prometeo-fonts-title-medium group-hover/tablink-item:text-primary-default-default" : "text-neutral-medium-default prometeo-fonts-body-large cursor-pointer",
-                      "leading-6! line-clamp-1"
-                    ),
-                    children: e.title
-                  }
-                ),
-                v(E(e.icon, s(
-                  "transition-all duration-300 ease-in-out group-hover/tablink-item:text-neutral-medium-hover ",
-                  o ? "text-primary-default-default prometeo-fonts-title-medium group-hover/tablink-item:text-primary-default-default" : "text-neutral-medium-default prometeo-fonts-body-large"
-                ), T), e.onIconHover, e.iconTooltipTitle, e.iconTooltipProps, e.onIconClick)
-              ] }),
-              o && g && /* @__PURE__ */ i.jsx(
-                C.div,
-                {
-                  layoutId: "tab-indicator",
-                  className: s(
-                    "absolute -bottom-px left-1/2 -translate-x-1/2  h-[4px] rounded-t-xl bg-primary-default-default z-0 w-[calc(100%-32px)]",
-                    y
-                  ),
-                  transition: {
-                    type: "spring",
-                    stiffness: 250,
-                    damping: 17
-                  },
-                  "aria-hidden": "true"
-                }
-              )
-            ]
-          },
-          e.id
-        );
-      })
-    }
-  );
-}
-p.displayName = "TabLinks";
-const H = N(p, (t, a) => {
-  if (t.activeTab !== a.activeTab || t.className !== a.className || t.tabClassName !== a.tabClassName || t.activeTabClassName !== a.activeTabClassName || t.indicatorClassName !== a.indicatorClassName || t.animated !== a.animated || t.onTabChange !== a.onTabChange || t.renderTab !== a.renderTab || t.items.length !== a.items.length)
-    return !1;
-  for (let r = 0; r < t.items.length; r++) {
-    const l = t.items[r], n = a.items[r];
-    if (l.id !== n.id || l.title !== n.title || l.disabled !== n.disabled || l.description !== n.description)
-      return !1;
-  }
-  return !0;
-});
+import { T as f } from "./TabLinks-DxqprStp.js";
 export {
-  H as default
+  f as default
 };

package/dist/TicketCard.es.js

@@ -1,5 +1,5 @@
 import { j as l } from "./jsx-runtime-GkKLlHH4.js";
-import { g as L } from "./useLabelBackground-BDIHUdND.js";
+import { g as L } from "./useLabelBackground-D5SzHhl_.js";
 import { c as d } from "./cn-B6yFEsav.js";
 import { memo as O, useState as y, useCallback as x, useImperativeHandle as S, Children as A, isValidElement as B, cloneElement as k, useRef as w, useLayoutEffect as N, useEffect as z } from "react";
 import { CrevronLeft as I } from "./Icons/CrevronLeft.es.js";

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

@@ -17,10 +17,11 @@ export interface NotificationCardProps<NotificationMetadata = any> {
     body: string | React.ReactNode | ((metadata?: NotificationMetadata) => React.ReactNode);
     date: string | Date;
     actions?: [NotificationAction<NotificationMetadata>, NotificationAction<NotificationMetadata>] | [NotificationAction<NotificationMetadata>];
-    isNew?: boolean;
+    read?: boolean;
     className?: string;
     metadata?: NotificationMetadata;
+    onClick?: (metadata?: NotificationMetadata) => void;
 }
-declare const NotificationCard: <NotificationMetadata = unknown>({ user, body, date, actions, isNew, className, metadata }: NotificationCardProps<NotificationMetadata>) => import("react/jsx-runtime").JSX.Element;
+declare const NotificationCard: <NotificationMetadata = unknown>({ user, body, date, actions, read, className, metadata, onClick }: NotificationCardProps<NotificationMetadata>) => import("react/jsx-runtime").JSX.Element;
 export default NotificationCard;
 export type NotificationCardComponent = typeof NotificationCard;

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

@@ -1,15 +1,18 @@
 import { NotificationCardProps } from '../NotificationCard/NotificationCard';
+import { ScrollableControlsHandler } from '../Scrollable/Scrollable';
 interface PLNotificationsDrawerProps<NotificationMetadata> {
     onCloseClick?: VoidFunction;
     onMarkAllAsRead?: () => void;
     notificationsListControls?: React.RefObject<NotificationsListControlsHandler<NotificationMetadata> | null>;
+    scrollableControls?: React.RefObject<ScrollableControlsHandler | null>;
 }
 export interface NotificationsListControlsHandler<NotificationMetadata> {
-    addNewNotification: (notification: NotificationCardProps<NotificationMetadata> | NotificationCardProps<NotificationMetadata>[]) => void;
+    addNewNotification: (notification: NotificationCardProps<NotificationMetadata> | NotificationCardProps<NotificationMetadata>[], position?: 'top' | 'bottom') => void;
     subscribeToUpdates: (callback: (notifications: NotificationCardProps<NotificationMetadata>[], count: number) => void) => () => void;
     removeNotification: (id: string | string[]) => void;
     removeAllNotifications: () => void;
     setNotifications: (notifications: NotificationCardProps<NotificationMetadata>[]) => void;
+    setLoading: (loading: boolean) => void;
 }
-declare const PLNotificationsList: <NotificationMetadata = unknown>({ onCloseClick, onMarkAllAsRead, notificationsListControls }: PLNotificationsDrawerProps<NotificationMetadata>) => import("react/jsx-runtime").JSX.Element;
+declare const PLNotificationsList: <NotificationMetadata = unknown>({ onCloseClick, onMarkAllAsRead, notificationsListControls, scrollableControls }: PLNotificationsDrawerProps<NotificationMetadata>) => import("react/jsx-runtime").JSX.Element;
 export default PLNotificationsList;