prometeo-design-system 4.3.1 → 4.3.2

package/dist/NotificationCard.es.js

@@ -1,50 +1,57 @@
 import { j as e } from "./jsx-runtime-GkKLlHH4.js";
+import { useCallback as h } from "react";
 import { c as o } from "./cn-B6yFEsav.js";
-import x from "./Avatar.es.js";
-import p from "./Button.es.js";
-const v = ({ user: i, body: t, date: a, actions: s, isNew: d, className: m, metadata: r }) => {
-  const f = typeof t == "function" ? t(r) : t, c = a instanceof Date ? `${a.toLocaleDateString("es-AR", { day: "2-digit", month: "2-digit", year: "numeric" })} a las ${a.toLocaleTimeString("es-AR", { hour: "2-digit", minute: "2-digit", hour12: !1 })}` : a;
-  return /* @__PURE__ */ e.jsxs("article", { className: o("flex flex-col gap-3 p-3 rounded-md bg-neutral-default-default ", m), children: [
-    /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-2", children: [
+import b from "./Avatar.es.js";
+import j from "./Button.es.js";
+const z = ({ user: m, body: s, date: a, actions: r, read: d, className: f, metadata: t, onClick: i }) => {
+  const c = typeof s == "function" ? s(t) : s, u = a instanceof Date ? `${a.toLocaleDateString("es-AR", { day: "2-digit", month: "2-digit", year: "numeric" })} a las ${a.toLocaleTimeString("es-AR", { hour: "2-digit", minute: "2-digit", hour12: !1 })}` : a, x = h(
+    () => {
+      i?.(t);
+    },
+    [i, t]
+  );
+  return /* @__PURE__ */ e.jsxs("article", { className: o("flex flex-col gap-3 p-3 rounded-md bg-neutral-default-default ", f), onClick: x, children: [
+    /* @__PURE__ */ e.jsxs("div", { className: o("flex flex-col gap-2", i && "cursor-pointer"), children: [
       /* @__PURE__ */ e.jsxs("div", { className: "flex gap-2 items-start w-full", children: [
         /* @__PURE__ */ e.jsxs("div", { className: " relative min-w-max", children: [
-          d && /* @__PURE__ */ e.jsx("div", { className: "size-3 border border-neutral-default bg-(--pyrion-orange-500) rounded-full absolute top-0 left-0 z-20" }),
+          !d && /* @__PURE__ */ e.jsx("div", { className: "size-3 border border-neutral-default bg-(--pyrion-orange-500) rounded-full absolute top-0 left-0 -translate-x-1/2 -translate-y-1/2 z-10" }),
           /* @__PURE__ */ e.jsx(
-            x,
+            b,
             {
-              imageUrl: i.profile_picture,
-              fallbackText: i.name,
+              imageUrl: m.profile_picture,
+              fallbackText: m.name,
               sizeFallback: "xs",
               sizeImage: "xs"
             }
           )
         ] }),
-        /* @__PURE__ */ e.jsx("div", { className: "text-neutral-default-default prometeo-fonts-body-medium", children: f })
+        /* @__PURE__ */ e.jsx("div", { className: "text-neutral-default-default prometeo-fonts-body-medium", children: c })
       ] }),
-      /* @__PURE__ */ e.jsx("p", { className: "text-neutral-medium-default prometeo-fonts-body-xsmall text-right", children: c })
+      /* @__PURE__ */ e.jsx("p", { className: "text-neutral-medium-default prometeo-fonts-body-xsmall text-right", children: u })
     ] }),
-    /* @__PURE__ */ e.jsx("div", { className: "flex gap-2 w-full", children: s?.map((l, n) => {
+    /* @__PURE__ */ e.jsx("div", { className: "flex gap-2 w-full", children: r?.map((l, n) => {
       if (l.hidden)
         return null;
-      const u = () => {
-        l.onClick(r);
+      const p = (g) => {
+        g.stopPropagation(), l.onClick?.(t);
       };
       return /* @__PURE__ */ e.jsx(
-        p,
+        j,
         {
-          className: o("flex-1 h-8", n === 0 && s.length > 1 && "order-2"),
+          className: o("flex-1 h-8", n === 0 && r.length > 1 && "order-2"),
           animate: !1,
           animateIcon: !1,
           label: l.label,
-          onClick: u,
-          variant: l.variant || s.length > 1 ? n === 0 ? "fill" : "text" : "fill",
+          onClick: p,
+          variant: l.variant || r.length > 1 ? n === 0 ? "fill" : "text" : "fill",
           disabled: l.disabled,
           size: "small"
-        }
+        },
+        l.label + n
       );
     }) })
   ] });
 };
 export {
-  v as default
+  z as default
 };

package/dist/PlainTooltip.es.js

@@ -1,62 +1,62 @@
 import { j as y } from "./jsx-runtime-GkKLlHH4.js";
 import { c as _ } from "./cn-B6yFEsav.js";
-import { memo as j, useRef as v, useCallback as A, useEffect as a } from "react";
+import { memo as j, useRef as v, useCallback as A, useEffect as u } from "react";
 import { createPortal as C } from "react-dom";
 const G = ({ title: w, children: p, delayToShow: x = 500, delayToClose: R = 1e3, className: B, attachToParent: d = !1, disabled: D = !1 }) => {
-  const s = v(null), r = v(null), n = v(null), o = A(() => {
+  const s = v(null), n = v(null), r = v(null), o = A(() => {
     if (typeof window > "u")
       return;
-    const e = r.current, i = s.current;
+    const e = n.current, i = s.current;
     if (!e || !i)
       return;
     const l = window.getComputedStyle(e).display, c = e.style.display, m = e.style.visibility, f = e.style.translate, h = l === "none";
     h && (e.style.visibility = "hidden", e.style.display = "block"), f && e.style.removeProperty("translate");
     const E = i.getBoundingClientRect();
     d ? (e.style.removeProperty("position"), e.style.removeProperty("left"), e.style.removeProperty("top")) : (e.style.setProperty("position", "fixed"), e.style.setProperty("left", `${E.right}px`), e.style.setProperty("top", `${E.bottom}px`));
-    const u = e.getBoundingClientRect(), I = window.innerWidth, N = window.innerHeight, b = Math.max(0, 0 - u.left), M = Math.max(0, u.right - I), L = Math.max(0, 0 - u.top), P = Math.max(0, u.bottom - N), O = b > 0 ? b + 16 : M > 0 ? -(M + 16) : 0, T = L > 0 ? L + 16 : P > 0 ? -(P + 16) : 0;
+    const a = e.getBoundingClientRect(), I = window.innerWidth, N = window.innerHeight, b = Math.max(0, 0 - a.left), M = Math.max(0, a.right - I), L = Math.max(0, 0 - a.top), P = Math.max(0, a.bottom - N), O = b > 0 ? b + 16 : M > 0 ? -(M + 16) : 0, T = L > 0 ? L + 16 : P > 0 ? -(P + 16) : 0;
     O === 0 && T === 0 ? e.style.removeProperty("translate") : e.style.setProperty("translate", `${O}px ${T}px`), h && (e.style.display = c, e.style.visibility = m);
   }, [d]);
-  if (a(() => {
-    const t = s.current, e = r.current;
+  if (u(() => {
+    const t = s.current, e = n.current;
     if (!t || !e)
       return;
     const i = (m, f) => {
-      n.current = setTimeout(() => {
+      r.current = setTimeout(() => {
         f();
       }, m);
     }, l = () => {
-      n.current && clearTimeout(n.current), o(), i(x, () => {
-        r.current?.classList.add("visible");
+      r.current && clearTimeout(r.current), o(), i(x, () => {
+        n.current?.classList.add("visible");
       });
     }, c = () => {
-      n.current && clearTimeout(n.current), i(R, () => {
-        r.current?.classList.remove("visible");
+      r.current && clearTimeout(r.current), i(R, () => {
+        n.current?.classList.remove("visible");
       });
     };
     return t.addEventListener("mouseenter", l), t.addEventListener("mouseleave", c), () => {
       t.removeEventListener("mouseenter", l), t.removeEventListener("mouseleave", c);
     };
-  }, [x, R, o]), a(() => {
+  }, [x, R, o]), u(() => {
     o();
-  }, [o, w]), a(() => {
+  }, [o, w]), u(() => {
     if (typeof window > "u")
       return;
     const t = () => {
-      r.current && r.current.classList.contains("visible") && o();
+      n.current && n.current.classList.contains("visible") && o();
     };
     return window.addEventListener("resize", t), window.addEventListener("scroll", t, !0), () => {
       window.removeEventListener("resize", t), window.removeEventListener("scroll", t, !0);
     };
-  }, [o]), a(() => () => {
-    n.current && clearTimeout(n.current);
+  }, [o]), u(() => () => {
+    r.current && clearTimeout(r.current);
   }, []), D) return p;
-  const g = /* @__PURE__ */ y.jsx("span", { ref: r, className: _(
+  const g = /* @__PURE__ */ y.jsx("span", { ref: n, className: _(
     "plain-tooltip ",
     "absolute z-999",
     "bg-neutral-weak-default px-2 py-1 rounded-lg w-max",
-    "text-neutral-strong-default prometeo-fonts-body-small ",
+    "text-neutral-strong-default prometeo-fonts-body-small text-balance ",
     B,
-    r.current?.innerText?.length && r.current?.innerText?.length > Math.floor(450 / 10) ? "w-max line-clamp-1" : "max-w-[200px] line-clamp-none"
+    n.current?.innerText?.length && n.current?.innerText?.length > Math.floor(450 / 10) ? "w-max line-clamp-1" : "max-w-[200px] line-clamp-none"
   ), children: w });
   return !d && typeof document < "u" ? /* @__PURE__ */ y.jsxs("div", { ref: s, children: [
     p,