prometeo-design-system 7.2.3 → 7.2.5

package/dist/AttachInput.d.ts

@@ -0,0 +1,6 @@
+export * from './exports/AttachInput'
+export {}
+import PrometeoDesignSystem from './exports/AttachInput'
+export default PrometeoDesignSystem
+export * from './exports/AttachInput'
+export {}

package/dist/AttachInput.es.js

@@ -0,0 +1,206 @@
+import { j as r } from "./jsx-runtime-GkKLlHH4.js";
+import { c as s } from "./cn-B6yFEsav.js";
+import { memo as T, forwardRef as H, useCallback as P } from "react";
+import { useDropzone as E } from "react-dropzone";
+import G from "./PlainTooltip.es.js";
+import { H as _ } from "./HelperComponent-BFzIO-0g.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",
+  {
+    variants: {
+      disabled: {
+        true: "cursor-default",
+        false: "hover:cursor-pointer group"
+      }
+    },
+    defaultVariants: {
+      disabled: !1
+    }
+  }
+), U = {
+  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(
+  "prometeo-fonts-body-medium text-balanced text-neutral-secondary-default",
+  {
+    variants: {
+      disabled: {
+        true: "text-disabled-default!",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      disabled: !1
+    }
+  }
+), L = i("icon-neutral-tertiary-default", {
+  variants: {
+    disabled: {
+      true: "icon-disabled-default!",
+      false: ""
+    }
+  }
+}), Q = i(
+  "prometeo-fonts-label-large flex items-center px-3 gap-0.5",
+  {
+    variants: {
+      visualStatus: {
+        default: "text-neutral-secondary-default",
+        error: "text-semantic-error-onneutral-default",
+        success: "text-semantic-success-onneutral-default"
+      },
+      disabled: {
+        true: "text-disabled-default!",
+        false: ""
+      }
+    },
+    defaultVariants: {
+      visualStatus: "default",
+      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(
+    (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 = H(
+  ({
+    onFilesAccepted: t,
+    onFilesRejected: e,
+    className: n,
+    label: c,
+    subtitle: o = "Arrastra y suelta los archivos aquí, o haz clic para seleccionar",
+    acceptedFormats: d,
+    status: u,
+    supportingText: f,
+    showSupportingText: w,
+    disabled: a = !1,
+    accept: m,
+    maxFiles: h = 1,
+    maxSize: p,
+    ...M
+  }, C) => {
+    const D = P(
+      (g, j) => {
+        g.length > 0 && t?.(g), j.length > 0 && e?.(j);
+      },
+      [t, e]
+    ), {
+      getRootProps: V,
+      getInputProps: $,
+      isDragActive: k,
+      isDragReject: A,
+      fileRejections: b
+    } = E({
+      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(
+        "label",
+        {
+          className: Q({
+            visualStatus: l,
+            disabled: a
+          }),
+          children: c
+        }
+      ),
+      /* @__PURE__ */ r.jsxs(
+        "div",
+        {
+          ref: C,
+          ...V(),
+          className: O({ disabled: a }),
+          children: [
+            /* @__PURE__ */ r.jsx("input", { ...$() }),
+            /* @__PURE__ */ r.jsx(
+              "svg",
+              {
+                "aria-hidden": !0,
+                className: s(
+                  "absolute inset-0 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(
+                  "rect",
+                  {
+                    x: "0.5",
+                    y: "0.5",
+                    width: "99%",
+                    height: "99%",
+                    rx: "15.5",
+                    fill: "none",
+                    stroke: "currentColor",
+                    strokeDasharray: "8 8",
+                    strokeWidth: x === "active" ? 2 : 1
+                  }
+                )
+              }
+            ),
+            o && /* @__PURE__ */ r.jsx(
+              "p",
+              {
+                className: J({
+                  disabled: a
+                }),
+                children: o
+              }
+            ),
+            /* @__PURE__ */ r.jsx(
+              q,
+              {
+                size: 20,
+                className: L({
+                  disabled: a
+                })
+              }
+            ),
+            !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(G, { title: B, children: /* @__PURE__ */ r.jsx(
+                K,
+                {
+                  size: 12,
+                  className: s("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 })
+    ] });
+  }
+);
+N.displayName = "AttachInput";
+const ie = T(N);
+export {
+  ie as AttachInput,
+  ie as default
+};

package/dist/Chip.es.js

@@ -1,37 +1,37 @@
 import { j as o } from "./jsx-runtime-GkKLlHH4.js";
-import { memo as C, forwardRef as B, useMemo as N, useCallback as p } from "react";
+import { memo as C, forwardRef as F, useMemo as N, useCallback as p } from "react";
 import { c as h } from "./index-BOQuZ0gG.js";
 import { c as v } from "./cn-B6yFEsav.js";
 import { i as V } from "./iconUtils-rTOfKDxE.js";
-import { Close as F } from "./Icons/Close.es.js";
-import { A as K } from "./AvatarBase-sKVPLn_O.js";
-const q = {
+import { Close as K } from "./Icons/Close.es.js";
+import { A as q } from "./AvatarBase-sKVPLn_O.js";
+const Q = {
   small: "h-5 px-2 text-xs prometeo-fonts-body-small",
   medium: "h-8 px-3 text-sm prometeo-fonts-body-medium",
   large: "h-9 px-3 text-sm prometeo-fonts-body-medium"
-}, Q = {
+}, Z = {
   default: "text-neutral-default-default border-neutral-default-default bg-inherit rounded-lg font-semibold",
   error: "",
   success: ""
-}, Z = "border-neutral-strong-default text-neutral-default-disabled", $ = "text-neutral-default-disabled", J = ["leading", "avatar"], W = ["default", "error", "success"];
-function X(e) {
-  return J.includes(e);
+}, $ = "border-neutral-strong-default text-neutral-default-disabled", J = "text-neutral-default-disabled", W = ["leading", "avatar"], X = ["default", "error", "success"];
+function ee(e) {
+  return W.includes(e);
 }
 function H(e) {
-  return W.includes(e);
+  return X.includes(e);
 }
-function ee(e) {
-  const a = e.layout ?? (X(e.variant) ? e.variant : void 0), s = e.semanticVariant ?? (H(e.variant) ? e.variant : void 0), i = a ?? (e.avatar ? "avatar" : "leading"), m = !!e.onRemove || !!e.size || !!s || !!e.semanticVariant || H(e.variant);
+function ae(e) {
+  const a = e.layout ?? (ee(e.variant) ? e.variant : void 0), s = e.semanticVariant ?? (H(e.variant) ? e.variant : void 0), i = a ?? (e.avatar ? "avatar" : "leading"), m = !!e.onRemove || !!e.size || !!s || !!e.semanticVariant || H(e.variant);
   return {
     layout: i,
     legacySemanticVariant: s,
-    legacySizeClass: e.size ? q[e.size] : void 0,
-    legacySemanticContainerClass: s ? Q[s] : void 0,
+    legacySizeClass: e.size ? Q[e.size] : void 0,
+    legacySemanticContainerClass: s ? Z[s] : void 0,
     useLegacyRemoveHandler: !!e.onRemove,
     isLegacyMode: m
   };
 }
-const ae = h(
+const re = h(
   "group/chip flex items-center gap-1 p-2 w-max h-8 radius-medium border transition-all duration-300 ease-in-out",
   {
     variants: {
@@ -118,7 +118,7 @@ const ae = h(
       }
     ]
   }
-), re = h(
+), te = h(
   "pyrion-fonts-label-medium transition-all duration-300 ease-in-out select-none",
   {
     variants: {
@@ -211,7 +211,7 @@ const ae = h(
       }
     ]
   }
-), te = h("transition-all duration-300 ease-in-out", {
+), se = h("transition-all duration-300 ease-in-out", {
   variants: {
     isSelected: {
       true: "",
@@ -295,7 +295,7 @@ const ae = h(
       className: "icon-disabled-ondisabled group-hover/chip:icon-disabled-ondisabled group-active/chip:icon-disabled-ondisabled"
     }
   ]
-}), se = h(
+}), de = h(
   "transition-all duration-300 ease-in-out border-neutral-default-default border",
   {
     variants: {
@@ -349,24 +349,24 @@ const ae = h(
       }
     ]
   }
-), de = {
+), oe = {
   size: "xsmall",
   name: "A B"
 };
-function oe(e, a, s) {
+function ne(e, a, s) {
   return {
     isSelected: !!e,
     disabled: !!a,
     forcedStatus: s
   };
 }
-function ne(e) {
+function ie(e) {
   return N(
     () => ({
-      container: ae(e),
-      label: re(e),
-      icon: te(e),
-      avatar: se(e)
+      container: re(e),
+      label: te(e),
+      icon: se(e),
+      avatar: de(e)
     }),
     [e.isSelected, e.disabled, e.forcedStatus]
   );
@@ -377,17 +377,17 @@ const D = C(function({
   size: i = 16
 }) {
   return /* @__PURE__ */ o.jsx(a, { size: i, className: s });
-}), ie = C(function({
+}), le = C(function({
   avatar: a,
   className: s
 }) {
-  return /* @__PURE__ */ o.jsx(K, { ...a, className: s });
+  return /* @__PURE__ */ o.jsx(q, { ...a, className: s });
 });
-function le(e, a) {
+function ce(e, a) {
   return e.label === a.label && e.isSelected === a.isSelected && e.disabled === a.disabled && e.forcedStatus === a.forcedStatus && e.layout === a.layout && e.variant === a.variant && e.semanticVariant === a.semanticVariant && e.className === a.className && e.onRemove === a.onRemove && e.id === a.id && e.size === a.size && e.tabIndex === a.tabIndex && e.leadingIcon === a.leadingIcon && e.leadingSlot === a.leadingSlot && e.trailingIcon === a.trailingIcon && e.onClick === a.onClick && e.onTrailingIconClick === a.onTrailingIconClick && e.avatar?.imageUrl === a.avatar?.imageUrl && e.avatar?.name === a.avatar?.name;
 }
-const ce = C(
-  B(function({
+const ue = C(
+  F(function({
     isSelected: a = !1,
     label: s,
     leadingIcon: i,
@@ -405,10 +405,11 @@ const ce = C(
     id: g,
     size: _,
     tabIndex: y,
-    className: j
-  }, T) {
+    className: j,
+    ...T
+  }, z) {
     const t = N(
-      () => ee({
+      () => ae({
         layout: A,
         variant: L,
         semanticVariant: I,
@@ -417,34 +418,35 @@ const ce = C(
         size: _
       }),
       [A, L, I, c, u, _]
-    ), z = oe(a, r, P), b = ne(z), E = V(i) ? i : null, S = V(x) ? x : t.useLegacyRemoveHandler ? F : null, M = N(
-      () => ({ ...de, ...c }),
+    ), M = ne(a, r, P), b = ie(M), E = V(i) ? i : null, S = V(x) ? x : t.useLegacyRemoveHandler ? K : null, w = N(
+      () => ({ ...oe, ...c }),
       [c?.imageUrl, c?.name]
-    ), n = !r && !!l, R = t.layout === "avatar", w = y !== void 0 ? y : n ? 0 : void 0, Y = p(
+    ), n = !r && !!l, R = t.layout === "avatar", Y = y !== void 0 ? y : n ? 0 : void 0, k = p(
       (d) => {
         r || (d.preventDefault(), d.stopPropagation(), f?.(d));
       },
       [r, f]
-    ), k = p(
+    ), G = p(
       (d) => {
         r || (d.stopPropagation(), d.preventDefault(), g != null && u?.(g));
       },
       [r, g, u]
-    ), G = p(
+    ), O = p(
       (d) => {
         r || l?.(d);
       },
       [r, l]
-    ), O = p(
+    ), U = p(
       (d) => {
         !n || r || d.key !== "Enter" && d.key !== " " || (d.preventDefault(), l?.(d));
       },
       [r, n, l]
-    ), U = !!S && (!!f || t.useLegacyRemoveHandler);
+    ), B = !!S && (!!f || t.useLegacyRemoveHandler);
     return /* @__PURE__ */ o.jsxs(
       "div",
       {
-        ref: T,
+        ...T,
+        ref: z,
         className: v(
           b.container,
           !t.legacySizeClass && "h-8",
@@ -452,29 +454,29 @@ const ce = C(
           t.legacySemanticContainerClass,
           t.isLegacyMode && "inline-flex font-semibold",
           n && "cursor-pointer",
-          r && t.isLegacyMode && Z,
+          r && t.isLegacyMode && $,
           r && "pointer-events-none",
           j
         ),
-        onClick: n ? G : void 0,
-        onKeyDown: n ? O : void 0,
+        onClick: n ? O : void 0,
+        onKeyDown: n ? U : void 0,
         "aria-disabled": r || void 0,
         role: n ? "button" : void 0,
-        tabIndex: w,
+        tabIndex: Y,
         children: [
           /* @__PURE__ */ o.jsxs("div", { className: "flex items-center gap-1 min-w-0", children: [
             !R && (m ?? (E && /* @__PURE__ */ o.jsx(D, { icon: E, className: b.icon }))),
-            R && /* @__PURE__ */ o.jsx(ie, { avatar: M, className: b.avatar }),
+            R && /* @__PURE__ */ o.jsx(le, { avatar: w, className: b.avatar }),
             /* @__PURE__ */ o.jsx("span", { className: v(b.label, "truncate"), children: s })
           ] }),
-          U && S && /* @__PURE__ */ o.jsx(
+          B && S && /* @__PURE__ */ o.jsx(
             "button",
             {
               type: "button",
               disabled: r,
               tabIndex: y,
-              onMouseDown: t.useLegacyRemoveHandler ? k : void 0,
-              onClick: t.useLegacyRemoveHandler ? void 0 : Y,
+              onMouseDown: t.useLegacyRemoveHandler ? G : void 0,
+              onClick: t.useLegacyRemoveHandler ? void 0 : k,
               className: v(
                 "shrink-0",
                 (f || u) && !r && "cursor-pointer",
@@ -488,7 +490,7 @@ const ce = C(
                   icon: S,
                   className: v(
                     b.icon,
-                    r && t.isLegacyMode && $
+                    r && t.isLegacyMode && J
                   ),
                   size: t.useLegacyRemoveHandler ? 18 : 16
                 }
@@ -499,9 +501,9 @@ const ce = C(
       }
     );
   }),
-  le
+  ce
 );
-ce.displayName = "Chip";
+ue.displayName = "Chip";
 export {
-  ce as default
+  ue as default
 };