prometeo-design-system 7.4.0 → 7.4.1

package/dist/AttachInput.es.js

@@ -1,14 +1,15 @@
-import { j as r } from "./jsx-runtime-GkKLlHH4.js";
-import { c as s } from "./cn-B6yFEsav.js";
-import { memo as T, forwardRef as P, useCallback as E } from "react";
-import { useDropzone as G } from "react-dropzone";
-import H from "./PlainTooltip.es.js";
-import _ from "./HelperComponent.es.js";
+import { j as t } from "./jsx-runtime-GkKLlHH4.js";
+import { c as o } from "./cn-B6yFEsav.js";
+import { memo as P, forwardRef as E, useCallback as G } from "react";
+import { useDropzone as H } from "react-dropzone";
+import _ from "./CardBackground.es.js";
+import q from "./PlainTooltip.es.js";
+import K from "./HelperComponent.es.js";
 import { c as i } from "./index-BOQuZ0gG.js";
-import { UploadCloud as q } from "./Icons/UploadCloud.es.js";
-import { Info as K } from "./Icons/Info.es.js";
-const O = i(
-  "relative w-full radius-large transition-colors duration-200 overflow-hidden flex flex-col items-center justify-center text-center gap-1 p-3",
+import { UploadCloud as O } from "./Icons/UploadCloud.es.js";
+import { Info as U } from "./Icons/Info.es.js";
+const W = i(
+  "relative w-full radius-large transition-colors duration-200 overflow-hidden flex flex-col items-center justify-center text-center gap-1 p-3 flex-1",
   {
     variants: {
       disabled: {
@@ -20,14 +21,14 @@ const O = i(
       disabled: !1
     }
   }
-), U = {
+), J = {
   disabled: "text-[var(--border-disabled-ondisabled)]",
   "drag-active": "text-[var(--border-brand-secondary-default)]",
   "drag-reject": "text-[var(--border-error-onneutral-default)]",
   default: "text-[var(--border-neutral-primary-default)]",
   error: "text-[var(--border-error-onneutral-default)]",
   success: "text-[var(--border-success-onneutral-default)]"
-}, W = (t, e, n) => n ? "disabled" : e === "active" ? "drag-active" : e === "reject" ? "drag-reject" : t, J = i(
+}, L = (r, e, n) => n ? "disabled" : e === "active" ? "drag-active" : e === "reject" ? "drag-reject" : r, Q = i(
   "prometeo-fonts-body-medium text-balanced text-neutral-secondary-default",
   {
     variants: {
@@ -40,14 +41,14 @@ const O = i(
       disabled: !1
     }
   }
-), L = i("icon-neutral-tertiary-default", {
+), X = i("icon-neutral-tertiary-default", {
   variants: {
     disabled: {
       true: "icon-disabled-default!",
       false: ""
     }
   }
-}), Q = i(
+}), Y = i(
   "prometeo-fonts-label-large flex items-center px-3 gap-0.5",
   {
     variants: {
@@ -66,81 +67,92 @@ const O = i(
       disabled: !1
     }
   }
-), X = (t) => {
-  const e = t / 1048576;
-  return e < 1 ? `${Math.round(t / 1024)} KB` : e < 1024 ? `${e % 1 === 0 ? e : e.toFixed(1)} MB` : `${(e / 1024).toFixed(1)} GB`;
-}, y = (t) => Object.keys(t).map((e) => t[e].join(", ")).join(" "), Y = (t, e, n) => {
-  if (t.some(
+), Z = (r) => {
+  const e = r / 1048576;
+  return e < 1 ? `${Math.round(r / 1024)} KB` : e < 1024 ? `${e % 1 === 0 ? e : e.toFixed(1)} MB` : `${(e / 1024).toFixed(1)} GB`;
+}, N = (r) => Object.keys(r).map((e) => r[e].join(", ")).join(" "), F = (r, e, n) => {
+  if (r.some(
     (d) => d.errors.some((u) => u.code === "too-many-files")
   ))
     return `Máximo ${e} ${e === 1 ? "archivo" : "archivos"} permitido${e === 1 ? "" : "s"}`;
-  const o = t.length;
-  return o === 1 ? "El archivo no pudo cargarse" : `${o} archivos no pudieron cargarse`;
-}, Z = (t, e) => e ? "reject" : t ? "active" : "idle", N = P(
+  const s = r.length;
+  return s === 1 ? "El archivo no pudo cargarse" : `${s} archivos no pudieron cargarse`;
+}, ee = (r, e) => e ? "reject" : r ? "active" : "idle", w = E(
   ({
-    onFilesAccepted: t,
+    onFilesAccepted: r,
     onFilesRejected: e,
     className: n,
     label: c,
-    subtitle: o = "Arrastra y suelta los archivos aquí, o haz clic para seleccionar",
+    subtitle: s = "Arrastra y suelta los archivos aquí, o haz clic para seleccionar",
     acceptedFormats: d,
     status: u,
     supportingText: f,
-    showSupportingText: w,
+    showSupportingText: z,
     disabled: a = !1,
     accept: m,
     maxFiles: h = 1,
-    maxSize: p,
-    ...M
-  }, C) => {
-    const D = E(
-      (g, j) => {
-        g.length > 0 && t?.(g), j.length > 0 && e?.(j);
+    maxSize: v,
+    cardBackground: b,
+    ...C
+  }, M) => {
+    const D = G(
+      (j, y) => {
+        j.length > 0 && r?.(j), y.length > 0 && e?.(y);
       },
-      [t, e]
+      [r, e]
     ), {
       getRootProps: V,
       getInputProps: $,
       isDragActive: k,
       isDragReject: A,
-      fileRejections: b
-    } = G({
+      fileRejections: g
+    } = H({
       onDrop: D,
       accept: m,
       maxFiles: h,
       disabled: a,
-      maxSize: p,
-      ...M
-    }), v = b.length > 0, l = v ? "error" : u ?? "default", x = Z(k, A), R = W(l, x, a), S = U[R], I = v ? Y([...b], h) : typeof f == "function" ? f() : f, z = d ?? y(m ?? {}), B = y(m ?? {});
-    return /* @__PURE__ */ r.jsxs("div", { className: s("w-full flex flex-col gap-1", n), children: [
-      c && /* @__PURE__ */ r.jsx(
+      maxSize: v,
+      ...C
+    }), p = g.length > 0, l = p ? "error" : u ?? "default", x = ee(k, A), R = L(l, x, a), S = J[R], I = p ? F([...g], h) : typeof f == "function" ? f() : f, B = d ?? N(m ?? {}), T = N(m ?? {});
+    return /* @__PURE__ */ t.jsxs("div", { className: o("w-full flex flex-col gap-1 h-[136px]", n), children: [
+      c && /* @__PURE__ */ t.jsx(
         "label",
         {
-          className: Q({
+          className: Y({
             visualStatus: l,
             disabled: a
           }),
           children: c
         }
       ),
-      /* @__PURE__ */ r.jsxs(
+      /* @__PURE__ */ t.jsxs(
         "div",
         {
-          ref: C,
+          ref: M,
           ...V(),
-          className: O({ disabled: a }),
+          className: W({ disabled: a }),
           children: [
-            /* @__PURE__ */ r.jsx("input", { ...$() }),
-            /* @__PURE__ */ r.jsx(
+            /* @__PURE__ */ t.jsx("input", { ...$() }),
+            /* @__PURE__ */ t.jsx(
+              _,
+              {
+                color: "neutral",
+                variant: "default",
+                forced: "default",
+                ...b,
+                className: o("absolute inset-0", b?.className)
+              }
+            ),
+            /* @__PURE__ */ t.jsx(
               "svg",
               {
                 "aria-hidden": !0,
-                className: s(
-                  "absolute inset-0 w-full h-full pointer-events-none overflow-visible transition-colors duration-200",
+                className: o(
+                  "absolute inset-0 z-[1] w-full h-full pointer-events-none overflow-visible transition-colors duration-200",
                   S,
                   !a && x === "idle" && "group-hover:text-[var(--border-brand-secondary-hover)] group-active:text-[var(--border-brand-secondary-pressed)]"
                 ),
-                children: /* @__PURE__ */ r.jsx(
+                children: /* @__PURE__ */ t.jsx(
                   "rect",
                   {
                     x: "0.5",
@@ -156,51 +168,53 @@ const O = i(
                 )
               }
             ),
-            o && /* @__PURE__ */ r.jsx(
-              "p",
-              {
-                className: J({
-                  disabled: a
-                }),
-                children: o
-              }
-            ),
-            /* @__PURE__ */ r.jsx(
-              q,
+            s && /* @__PURE__ */ t.jsx("p", { className: o(Q({ disabled: a }), "relative z-[1]"), children: s }),
+            /* @__PURE__ */ t.jsx(
+              O,
               {
                 size: 20,
-                className: L({
-                  disabled: a
-                })
+                className: o(X({ disabled: a }), "relative z-[1]")
               }
             ),
-            !v && /* @__PURE__ */ r.jsxs("div", { className: "w-full overflow-hidden flex justify-center items-center gap-0.5", children: [
-              /* @__PURE__ */ r.jsxs("p", { className: s("prometeo-fonts-body-xsmall text-neutral-tertiary-default line-clamp-1", a && "text-disabled-default!"), children: [
-                z,
-                p !== void 0 && /* @__PURE__ */ r.jsxs(r.Fragment, { children: [
-                  " ",
-                  "· Máx. ",
-                  X(p)
-                ] })
-              ] }),
-              /* @__PURE__ */ r.jsx(H, { title: B, children: /* @__PURE__ */ r.jsx(
-                K,
+            !p && /* @__PURE__ */ t.jsxs("div", { className: "relative z-[1] w-full overflow-hidden flex justify-center items-center gap-0.5", children: [
+              /* @__PURE__ */ t.jsxs(
+                "p",
+                {
+                  className: o(
+                    "prometeo-fonts-body-xsmall text-neutral-tertiary-default line-clamp-1",
+                    a && "text-disabled-default!"
+                  ),
+                  children: [
+                    B,
+                    v !== void 0 && /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+                      " ",
+                      "· Máx. ",
+                      Z(v)
+                    ] })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ t.jsx(q, { title: T, children: /* @__PURE__ */ t.jsx(
+                U,
                 {
                   size: 12,
-                  className: s("icon-neutral-tertiary-default shrink-0", a && "icon-disabled-default!")
+                  className: o(
+                    "icon-neutral-tertiary-default shrink-0",
+                    a && "icon-disabled-default!"
+                  )
                 }
               ) })
             ] })
           ]
         }
       ),
-      w && /* @__PURE__ */ r.jsx(_, { variant: l, disabled: a, className: s(l === "default" && !a && "[&>p]:text-neutral-tertiary-default! [&>svg]:icon-neutral-tertiary-default!"), children: I })
+      z && /* @__PURE__ */ t.jsx(K, { variant: l, disabled: a, className: o(l === "default" && !a && "[&>p]:text-neutral-tertiary-default! [&>svg]:icon-neutral-tertiary-default!"), children: I })
     ] });
   }
 );
-N.displayName = "AttachInput";
-const ie = T(N);
+w.displayName = "AttachInput";
+const ue = P(w);
 export {
-  ie as AttachInput,
-  ie as default
+  ue as AttachInput,
+  ue as default
 };

package/dist/Button.es.js

@@ -16,7 +16,7 @@ const W = (r) => Q(r), B = {
     icon: ""
   },
   large: {
-    container: "h-12 px-5 py-3 spacing-x-2 radius-medium ",
+    container: "h-12 px-5 py-3 spacing-x-2 radius-large ",
     icon: ""
   }
 }, e = {