prometeo-design-system 2.7.0 → 2.7.2

package/dist/DrawerDesktop.es.js

@@ -1,30 +1,31 @@
 import { j as l } from "./jsx-runtime-DKDX3adD.js";
 import { c as h } from "./cn-B6yFEsav.js";
-import { c as k, B as E } from "./Button-CvBWH1HX.js";
-import { createPortal as I } from "react-dom";
-import { Icons as V } from "./Icons.es.js";
-import { forwardRef as B, useRef as u, useState as N, useEffect as d, useCallback as f, useImperativeHandle as P } from "react";
-const L = B((t, s) => {
-  const o = u(null), [e, a] = N(t.defaultOpen || !1), [r, y] = N(null), b = u(t.onClose), c = u(r), {
+import { c as k } from "./index-BOQuZ0gG.js";
+import { createPortal as E } from "react-dom";
+import { Icons as I } from "./Icons.es.js";
+import { forwardRef as V, useRef as u, useState as N, useEffect as d, useCallback as f, useImperativeHandle as P } from "react";
+import B from "./Button.es.js";
+const L = V((t, s) => {
+  const n = u(null), [e, a] = N(t.defaultOpen || !1), [r, y] = N(null), b = u(t.onClose), c = u(r), {
     modal: i = !1,
     children: m,
     className: w,
     direction: C = "left",
     attachToParent: x = !1,
-    closeOnOverlayClick: n = !1,
+    closeOnOverlayClick: o = !1,
     hideCloseButton: T = !1
-  } = t, g = u(n), O = u(e);
+  } = t, g = u(o), O = u(e);
   c.current = r, d(() => {
     O.current = e;
   }, [e]), d(() => {
     c.current = r;
   }, [r]), d(() => {
-    g.current = n;
-  }, [n]);
+    g.current = o;
+  }, [o]);
   const R = (p) => {
-    if (!o.current)
+    if (!n.current)
       return;
-    const z = o.current;
+    const z = n.current;
     z && !z.contains(p.target) && g.current && O.current && v();
   };
   d(() => {
@@ -36,7 +37,7 @@ const L = B((t, s) => {
     return () => {
       clearTimeout(p), document.removeEventListener("click", R);
     };
-  }, [n, e, i]), d(() => {
+  }, [o, e, i]), d(() => {
     b.current = t.onClose;
   }, [t.onClose]);
   const j = f((p) => {
@@ -58,25 +59,25 @@ const L = B((t, s) => {
     Y,
     {
       context: r,
-      ref: o,
+      ref: n,
       isOpen: e,
       close: v,
       direction: C,
       modal: i,
       className: w,
       attachToParent: x,
-      closeOnOverlayClick: n,
+      closeOnOverlayClick: o,
       hideCloseButton: T,
       children: typeof m == "function" ? m(r) : m
     }
   );
-  return x ? D : I(D, document.body);
+  return x ? D : E(D, document.body);
 });
 L.displayName = "DrawerDesktopV2";
 const Y = ({
   ref: t,
   children: s,
-  direction: o = "left",
+  direction: n = "left",
   isOpen: e,
   close: a,
   modal: r = !1,
@@ -88,9 +89,9 @@ const Y = ({
 }) => {
   d(() => {
     if (e && r) {
-      const n = window.scrollY;
-      return document.body.style.position = "fixed", document.body.style.top = `-${n}px`, document.body.style.width = "100%", () => {
-        document.body.style.position = "", document.body.style.top = "", document.body.style.width = "", window.scrollTo(0, n);
+      const o = window.scrollY;
+      return document.body.style.position = "fixed", document.body.style.top = `-${o}px`, document.body.style.width = "100%", () => {
+        document.body.style.position = "", document.body.style.top = "", document.body.style.width = "", window.scrollTo(0, o);
       };
     }
   }, [e, r]);
@@ -128,8 +129,8 @@ const Y = ({
       "div",
       {
         className: h(C({ isOpen: e })),
-        onClick: (n) => {
-          n.preventDefault(), n.stopPropagation(), c && a();
+        onClick: (o) => {
+          o.preventDefault(), o.stopPropagation(), c && a();
         },
         "aria-hidden": "true"
       }
@@ -141,7 +142,7 @@ const Y = ({
         className: h(
           "bg-neutral-strong-default h-full top-0 z-60 w-max overflow-y-auto",
           b ? "absolute" : "fixed",
-          w({ isOpen: e, direction: o }),
+          w({ isOpen: e, direction: n }),
           !i && "p-4 pt-10",
           y
         ),
@@ -149,9 +150,9 @@ const Y = ({
         "aria-modal": r,
         children: [
           !i && /* @__PURE__ */ l.jsx(
-            E,
+            B,
             {
-              icon: /* @__PURE__ */ l.jsx(V.Close, { size: 24 }),
+              icon: /* @__PURE__ */ l.jsx(I.Close, { size: 24 }),
               animate: !1,
               type: "button",
               size: "small",
@@ -161,7 +162,7 @@ const Y = ({
               color: "secondary",
               className: h(
                 "absolute top-0 z-50",
-                x({ direction: o })
+                x({ direction: n })
               ),
               "aria-label": "Close drawer"
             }
@@ -171,21 +172,21 @@ const Y = ({
       }
     )
   ] });
-}, G = () => {
+}, J = () => {
   const t = u(null), s = f((r) => {
     t.current?.open(r);
-  }, []), o = f(() => {
+  }, []), n = f(() => {
     t.current?.close();
   }, []), e = f(() => t.current?.isOpen ?? !1, []), a = f(() => t.current?.getContext() ?? null, []);
   return {
     isOpen: e,
     open: s,
-    close: o,
+    close: n,
     drawerRef: t,
     getContext: a
   };
 };
 export {
   L as default,
-  G as useDrawerDesktop
+  J as useDrawerDesktop
 };

package/dist/FAButton.es.js

@@ -1,22 +1,23 @@
-import { j as i } from "./jsx-runtime-DKDX3adD.js";
-import s, { memo as c } from "react";
-import { c as n } from "./cn-B6yFEsav.js";
-import { Icons as f } from "./Icons.es.js";
+import { j as c } from "./jsx-runtime-DKDX3adD.js";
+import u, { memo as n } from "react";
+import { c as f } from "./cn-B6yFEsav.js";
+import { Icons as v } from "./Icons.es.js";
 import { createPortal as m } from "react-dom";
-const v = {
+import { c as b } from "./index-BOQuZ0gG.js";
+const h = {
   right: 24,
   bottom: 64,
   left: "auto",
   top: "auto"
-}, b = {
-  filled: {
+}, r = {
+  fill: {
     primary: "bg-primary-default-default hover:bg-primary-default-hover active:bg-primary-default-pressed",
     secondary: "bg-neutral-medium-default hover:bg-neutral-medium-hover active:bg-neutral-medium-pressed",
     success: "bg-success-default-default hover:bg-success-default-hover active:bg-success-default-pressed",
     error: "bg-error-default-default hover:bg-error-default-hover active:bg-error-default-pressed",
     warning: "bg-warning-default-default hover:bg-warning-default-hover active:bg-warning-default-pressed"
   },
-  outlined: {
+  outline: {
     primary: "border border-primary-default-default hover:border-primary-default-hover active:border-primary-default-pressed text-primary-default-default hover:text-primary-default-hover active:text-primary-default-pressed",
     secondary: "border border-neutral-medium-default hover:border-neutral-medium-hover active:border-neutral-medium-pressed text-neutral-medium-default hover:text-neutral-medium-hover active:text-neutral-medium-pressed",
     success: "border border-success-default-default hover:border-success-default-hover active:border-success-default-pressed text-success-default-default hover:text-success-default-hover active:text-success-default-pressed",
@@ -30,15 +31,58 @@ const v = {
     error: "text-error-default-default hover:text-error-default-hover active:text-error-default-pressed",
     warning: "text-warning-default-default hover:text-warning-default-hover active:text-warning-default-pressed"
   }
-}, h = "bg-primary-default-disabled text-neutral-default-disabled hover:bg-primary-default-disabled active:bg-primary-default-disabled cursor-default", g = (e) => {
-  const t = e.position || v, r = e.attachToParent || !1, o = e.color || "primary", l = e.icon || f.Add, a = e.disabled || !1, u = e.variant || "filled", d = /* @__PURE__ */ i.jsx(
+}, g = "bg-primary-default-disabled text-neutral-default-disabled hover:bg-primary-default-disabled active:bg-primary-default-disabled cursor-default", x = b(
+  "transition-all duration-300 cursor-pointer text-neutral-default-default",
+  {
+    variants: {
+      color: {
+        primary: "",
+        secondary: "",
+        success: "",
+        error: "",
+        warning: ""
+      },
+      variant: {
+        fill: "",
+        outline: "",
+        text: ""
+      },
+      disabled: {
+        true: g,
+        false: ""
+      }
+    },
+    compoundVariants: [
+      { variant: "fill", color: "primary", class: r.fill.primary },
+      { variant: "fill", color: "secondary", class: r.fill.secondary },
+      { variant: "fill", color: "error", class: r.fill.error },
+      { variant: "fill", color: "success", class: r.fill.success },
+      { variant: "fill", color: "warning", class: r.fill.warning },
+      { variant: "outline", color: "primary", class: r.outline.primary },
+      { variant: "outline", color: "secondary", class: r.outline.secondary },
+      { variant: "outline", color: "success", class: r.outline.success },
+      { variant: "outline", color: "error", class: r.outline.error },
+      { variant: "outline", color: "warning", class: r.outline.warning },
+      { variant: "text", color: "primary", class: r.text.primary },
+      { variant: "text", color: "secondary", class: r.text.secondary },
+      { variant: "text", color: "success", class: r.text.success },
+      { variant: "text", color: "error", class: r.text.error },
+      { variant: "text", color: "warning", class: r.text.warning }
+    ],
+    defaultVariants: {
+      color: "primary",
+      variant: "fill"
+    }
+  }
+), y = (e) => {
+  const t = e.position || h, a = e.attachToParent || !1, i = e.color || "primary", s = e.icon || v.Add, o = e.disabled || !1, d = e.variant || "fill", l = /* @__PURE__ */ c.jsx(
     "div",
     {
       style: {
         width: "56px",
         height: "56px",
         borderRadius: "8px",
-        position: r ? "absolute" : "fixed",
+        position: a ? "absolute" : "fixed",
         right: t.right,
         bottom: t.bottom,
         left: t.left,
@@ -47,14 +91,21 @@ const v = {
         placeItems: "center",
         padding: 16
       },
-      className: n("transition-all duration-300 cursor-pointer text-neutral-default-default", b[u][o], a && h, e.className),
-      onClick: a ? void 0 : e.onClick,
-      children: s.createElement(l, { size: 24 })
+      className: f(
+        x({
+          color: i,
+          variant: d,
+          disabled: o
+        }),
+        e.className
+      ),
+      onClick: o ? void 0 : e.onClick,
+      children: u.createElement(s, { size: 24 })
     }
   );
-  return r ? d : m(d, document.body);
-}, x = c(g, (e, t) => e.attachToParent === t.attachToParent && e.position === t.position && e.color === t.color && e.icon === t.icon && e.disabled === t.disabled && e.variant === t.variant && e.className === t.className && e.onClick === t.onClick);
-x.displayName = "FAButton";
+  return a ? l : m(l, document.body);
+}, p = n(y, (e, t) => e.attachToParent === t.attachToParent && e.position === t.position && e.color === t.color && e.icon === t.icon && e.disabled === t.disabled && e.variant === t.variant && e.className === t.className && e.onClick === t.onClick);
+p.displayName = "FAButton";
 export {
-  x as default
+  p as default
 };

package/dist/Header.es.js

@@ -1,32 +1,32 @@
-import { j as l } from "./jsx-runtime-DKDX3adD.js";
-import { c as a } from "./cn-B6yFEsav.js";
-import { motion as r } from "framer-motion";
-import { memo as d } from "react";
-const x = ({ title: e, subtitle: t, children: i, className: s, subtitleClassName: m, titleClassName: n }) => /* @__PURE__ */ l.jsx(
+import { j as a } from "./jsx-runtime-DKDX3adD.js";
+import { c as l } from "./cn-B6yFEsav.js";
+import { motion as n } from "framer-motion";
+import { memo as c } from "react";
+const d = ({ title: e, subtitle: t, children: i, className: s, subtitleClassName: m, titleClassName: r }) => /* @__PURE__ */ a.jsx(
   "header",
   {
-    className: a(
+    className: l(
       "h-16 flex items-center px-4 sm:h-20 md:h-24 md:px-6 lg:h-28 xl:h-32 2xl:h-36",
       s
     ),
-    children: /* @__PURE__ */ l.jsxs(
-      r.div,
+    children: /* @__PURE__ */ a.jsxs(
+      n.div,
       {
         initial: { opacity: 0, y: -10 },
         animate: { opacity: 1, y: 0 },
         transition: { duration: 0.6, ease: "easeOut" },
         className: "flex justify-between items-center w-full",
         children: [
-          /* @__PURE__ */ l.jsxs("div", { className: "flex flex-col leading-6", children: [
-            t && /* @__PURE__ */ l.jsx("h3", { className: a("font-semibold text-neutral-medium-default leading-1 sm:leading-2 prometeo-fonts-headline-large ", m), children: t }),
-            e && /* @__PURE__ */ l.jsx("h1", { className: a("text-xl font-bold text-neutral-strong-default sm:text-2xl md:text-3xl xl:text-[32px] 2xl:text-[34px]", n), children: e })
+          /* @__PURE__ */ a.jsxs("div", { className: "flex flex-col leading-6", children: [
+            t && /* @__PURE__ */ a.jsx("h3", { className: l(" prometeo-fonts-body-medium text-neutral-medium-default ", m), children: t }),
+            e && /* @__PURE__ */ a.jsx("h1", { className: l("prometeo-fonts-headline-small text-neutral-strong-default", r), children: e })
           ] }),
-          i && /* @__PURE__ */ l.jsx("div", { className: "flex gap-4", children: i })
+          i && /* @__PURE__ */ a.jsx("div", { className: "flex gap-4", children: i })
         ]
       }
     )
   }
-), h = d(x, (e, t) => e.title !== t.title || e.subtitle !== t.subtitle || e.className !== t.className ? !1 : e.children !== t.children ? !e.children && !t.children : !0);
+), x = c(d, (e, t) => e.title !== t.title || e.subtitle !== t.subtitle || e.className !== t.className ? !1 : e.children !== t.children ? !e.children && !t.children : !0);
 export {
-  h as default
+  x as default
 };

package/dist/Icons/Icons.d.ts

@@ -54,6 +54,11 @@ declare const Icons: {
     readonly CheckCircle: import('react').MemoExoticComponent<(props: IconProps) => ReactElement>;
     readonly FormatColorText: import('react').MemoExoticComponent<(props: IconProps) => ReactElement>;
     readonly CheckList: import('react').MemoExoticComponent<(props: IconProps) => ReactElement>;
+    readonly WhatsApp: import('react').MemoExoticComponent<(props: IconProps) => ReactElement>;
+    readonly File: import('react').MemoExoticComponent<(props: IconProps) => ReactElement>;
+    readonly Email: import('react').MemoExoticComponent<(props: IconProps) => ReactElement>;
+    readonly Download: import('react').MemoExoticComponent<(props: IconProps) => ReactElement>;
+    readonly Reload: import('react').MemoExoticComponent<(props: IconProps) => ReactElement>;
 };
 export { Icons };
 export type IconName = keyof typeof Icons;