prometeo-design-system 2.0.2 → 2.1.0

package/dist/Button-Bc0LYLfg.js

@@ -0,0 +1,183 @@
+import { j as f } from "./jsx-runtime-ByW6EXIE.js";
+import { c as g } from "./cn-B6yFEsav.js";
+import { clsx as B } from "clsx";
+import { useAnimationControls as E, motion as j } from "framer-motion";
+import { memo as P, useCallback as w, useMemo as h } from "react";
+const C = (l) => typeof l == "boolean" ? `${l}` : l === 0 ? "0" : l, V = B, _ = (l, d) => (e) => {
+  var m;
+  if (d?.variants == null) return V(l, e?.class, e?.className);
+  const { variants: v, defaultVariants: t } = d, n = Object.keys(v).map((s) => {
+    const u = e?.[s], i = t?.[s];
+    if (u === null) return null;
+    const o = C(u) || C(i);
+    return v[s][o];
+  }), r = e && Object.entries(e).reduce((s, u) => {
+    let [i, o] = u;
+    return o === void 0 || (s[i] = o), s;
+  }, {}), a = d == null || (m = d.compoundVariants) === null || m === void 0 ? void 0 : m.reduce((s, u) => {
+    let { class: i, className: o, ...p } = u;
+    return Object.entries(p).every((y) => {
+      let [b, x] = y;
+      return Array.isArray(x) ? x.includes({
+        ...t,
+        ...r
+      }[b]) : {
+        ...t,
+        ...r
+      }[b] === x;
+    }) ? [
+      ...s,
+      i,
+      o
+    ] : s;
+  }, []);
+  return V(l, n, a, e?.class, e?.className);
+}, $ = _(
+  "flex items-center justify-center cursor-pointer focus:outline-none font-semibold rounded-md transition-colors",
+  {
+    variants: {
+      variant: {
+        filled: "",
+        outline: "bg-transparent border-1",
+        text: "bg-transparent border-0"
+      },
+      color: {
+        primary: "",
+        secondary: ""
+      },
+      size: {
+        small: "h-[40px] w-[123px] w-fit px-2 py-3 text-sm",
+        medium: "h-[48px] w-[134px] w-fit px-2 py-3 text-base",
+        large: "h-[56px] w-[145px] w-fit px-4 py-3 text-base"
+      },
+      disabled: {
+        true: "opacity-50 cursor-not-allowed",
+        false: ""
+      },
+      loading: {
+        true: "cursor-wait",
+        false: ""
+      },
+      customSize: {
+        true: "px-4 py-2",
+        false: ""
+      }
+    },
+    compoundVariants: [
+      {
+        variant: "filled",
+        color: "primary",
+        class: "bg-primary-default-default text-neutral-strong-default border-0 hover:bg-primary-default-hover hover:text-neutral-strong-hover focus:bg-primary-default-pressed focus:text-neutral-strong-focused active:bg-primary-pressed active:text-neutral-strong-pressed disabled:bg-primary-medium-disabled disabled:text-neutral-strong-disabled"
+      },
+      {
+        variant: "filled",
+        color: "secondary",
+        class: "bg-neutral-strong-medium-default text-neutral-strong-default hover:bg-neutral-medium-hover hover:text-neutral-strong-hover focus:bg-neutral-medium-pressed focus:text-neutral-strong-pressed active:bg-neutral-medium-pressed disabled:bg-primary-default-disabled disabled:text-neutral-strong-disabled"
+      },
+      {
+        variant: "outline",
+        color: "primary",
+        class: "text-primary-medium-default border-primary-medium-default hover:bg-neutral-default-hover hover:text-primary-medium-hover hover:border-primary-medium-hover focus:bg-neutral-default-pressed focus:text-primary-medium-pressed focus:border-primary-medium-pressed active:bg-neutral-default-pressed active:text-primary-medium-pressed active:border-primary-medium-pressed disabled:border-primary-disabled disabled:text-primary-disabled"
+      },
+      {
+        variant: "outline",
+        color: "secondary",
+        class: "text-neutral-strong-default border-neutral-strong-default hover:bg-neutral-default-hover hover:text-neutral-strong-hover hover:border-neutral-strong-hover focus:bg-neutral-default-pressed focus:text-neutral-strong-pressed focus:border-neutral-strong-pressed active:bg-neutral-default-pressed active:text-neutral-strong-pressed active:border-neutral-strong-pressed disabled:border-neutral-disabled disabled:text-neutral-disabled"
+      },
+      {
+        variant: "text",
+        color: "primary",
+        class: "text-primary-medium-default hover:bg-neutral-default-hover hover:text-primary-medium-hover focus:bg-neutral-default-pressed focus:text-primary-medium-pressed active:bg-neutral-default-pressed active:text-primary-medium-pressed disabled:text-primary-medium-disabled"
+      },
+      {
+        variant: "text",
+        color: "secondary",
+        class: "text-neutral-strong-default hover:bg-neutral-default-hover hover:text-primary-default-hover focus:bg-neutral-default-pressed focus:text-primary-medium-pressed active:bg-neutral-default-pressed active:text-primary-medium-pressed disabled:text-primary-medium-disabled"
+      }
+    ],
+    defaultVariants: {
+      variant: "filled",
+      color: "primary",
+      size: "medium",
+      disabled: !1,
+      loading: !1,
+      customSize: !1
+    }
+  }
+);
+function z({
+  label: l = "Selene",
+  onClick: d,
+  icon: e,
+  contentClassName: m,
+  loadingText: v = "Cargando...",
+  animate: t = !0,
+  animateIcon: n = !0,
+  isLoading: r = !1,
+  disabled: a = !1,
+  type: s = "button",
+  variant: u = "filled",
+  color: i = "primary",
+  size: o = "medium",
+  children: p,
+  Spinner: y,
+  className: b,
+  form: x,
+  ...N
+}) {
+  const c = E(), H = w(() => {
+    !t || a || r || !n || c.start({ rotate: 90 });
+  }, [t, a, r, n, c]), S = w(() => {
+    !t || a || r || !n || c.start({ rotate: 0 });
+  }, [t, a, r, n, c]), k = h(() => g(
+    $({
+      variant: u,
+      color: i,
+      size: o,
+      disabled: a || r,
+      loading: r
+    }),
+    b
+  ), [u, i, o, a, r, b]), O = h(() => ({
+    whileHover: t && !a && !r ? { scale: 1.05 } : {},
+    whileTap: t && !a && !r ? { scale: 0.98 } : {},
+    transition: { type: "spring", stiffness: 400, damping: 17 }
+  }), [t, a, r]), A = h(() => r ? /* @__PURE__ */ f.jsxs("div", { className: "flex items-center gap-2", children: [
+    y,
+    o !== "small" && /* @__PURE__ */ f.jsx("span", { children: v })
+  ] }) : p || /* @__PURE__ */ f.jsxs("span", { className: g("flex items-center gap-2", m), children: [
+    e && /* @__PURE__ */ f.jsx(
+      j.div,
+      {
+        animate: n ? c : void 0,
+        transition: {
+          type: "spring",
+          stiffness: 400,
+          damping: 17
+        },
+        children: e
+      }
+    ),
+    l && /* @__PURE__ */ f.jsx("span", { children: l })
+  ] }), [r, p, e, l, y, o, v, n, c, m]);
+  return /* @__PURE__ */ f.jsx(
+    j.button,
+    {
+      form: x,
+      onClick: d,
+      className: k,
+      ...O,
+      onHoverStart: H,
+      onHoverEnd: S,
+      disabled: a || r,
+      type: s,
+      ...N,
+      children: A
+    }
+  );
+}
+const W = P(z);
+export {
+  W as B,
+  _ as c
+};

package/dist/Button.es.js

@@ -1,153 +1,4 @@
-import { j as o } from "./jsx-runtime-ByW6EXIE.js";
-import { c as x } from "./cn-B6yFEsav.js";
-import { c as N } from "./index-BOQuZ0gG.js";
-import { useAnimationControls as k, motion as y } from "framer-motion";
-import { memo as z, useCallback as g, useMemo as i } from "react";
-const A = N(
-  "flex items-center justify-center cursor-pointer focus:outline-none font-semibold rounded-md transition-colors",
-  {
-    variants: {
-      variant: {
-        filled: "",
-        outline: "bg-transparent border-1",
-        text: "bg-transparent border-0"
-      },
-      color: {
-        primary: "",
-        secondary: ""
-      },
-      size: {
-        small: "h-[40px] w-[123px] w-fit px-2 py-3 text-sm",
-        medium: "h-[48px] w-[134px] w-fit px-2 py-3 text-base",
-        large: "h-[56px] w-[145px] w-fit px-4 py-3 text-base"
-      },
-      disabled: {
-        true: "opacity-50 cursor-not-allowed",
-        false: ""
-      },
-      loading: {
-        true: "cursor-wait",
-        false: ""
-      },
-      customSize: {
-        true: "px-4 py-2",
-        false: ""
-      }
-    },
-    compoundVariants: [
-      {
-        variant: "filled",
-        color: "primary",
-        class: "bg-primary-default-default text-neutral-strong-default border-0 hover:bg-primary-default-hover hover:text-neutral-strong-hover focus:bg-primary-default-pressed focus:text-neutral-strong-focused active:bg-primary-pressed active:text-neutral-strong-pressed disabled:bg-primary-medium-disabled disabled:text-neutral-strong-disabled"
-      },
-      {
-        variant: "filled",
-        color: "secondary",
-        class: "bg-neutral-strong-medium-default text-neutral-strong-default hover:bg-neutral-medium-hover hover:text-neutral-strong-hover focus:bg-neutral-medium-pressed focus:text-neutral-strong-pressed active:bg-neutral-medium-pressed disabled:bg-primary-default-disabled disabled:text-neutral-strong-disabled"
-      },
-      {
-        variant: "outline",
-        color: "primary",
-        class: "text-primary-medium-default border-primary-medium-default hover:bg-neutral-default-hover hover:text-primary-medium-hover hover:border-primary-medium-hover focus:bg-neutral-default-pressed focus:text-primary-medium-pressed focus:border-primary-medium-pressed active:bg-neutral-default-pressed active:text-primary-medium-pressed active:border-primary-medium-pressed disabled:border-primary-disabled disabled:text-primary-disabled"
-      },
-      {
-        variant: "outline",
-        color: "secondary",
-        class: "text-neutral-strong-default border-neutral-strong-default hover:bg-neutral-default-hover hover:text-neutral-strong-hover hover:border-neutral-strong-hover focus:bg-neutral-default-pressed focus:text-neutral-strong-pressed focus:border-neutral-strong-pressed active:bg-neutral-default-pressed active:text-neutral-strong-pressed active:border-neutral-strong-pressed disabled:border-neutral-disabled disabled:text-neutral-disabled"
-      },
-      {
-        variant: "text",
-        color: "primary",
-        class: "text-primary-medium-default hover:bg-neutral-default-hover hover:text-primary-medium-hover focus:bg-neutral-default-pressed focus:text-primary-medium-pressed active:bg-neutral-default-pressed active:text-primary-medium-pressed disabled:text-primary-medium-disabled"
-      },
-      {
-        variant: "text",
-        color: "secondary",
-        class: "text-neutral-strong-default hover:bg-neutral-default-hover hover:text-primary-default-hover focus:bg-neutral-default-pressed focus:text-primary-medium-pressed active:bg-neutral-default-pressed active:text-primary-medium-pressed disabled:text-primary-medium-disabled"
-      }
-    ],
-    defaultVariants: {
-      variant: "filled",
-      color: "primary",
-      size: "medium",
-      disabled: !1,
-      loading: !1,
-      customSize: !1
-    }
-  }
-);
-function M({
-  label: l = "Selene",
-  onClick: h,
-  icon: u,
-  contentClassName: m,
-  loadingText: p = "Cargando...",
-  animate: t = !0,
-  animateIcon: s = !0,
-  isLoading: e = !1,
-  disabled: r = !1,
-  type: w = "button",
-  variant: f = "filled",
-  color: c = "primary",
-  size: d = "medium",
-  children: n,
-  Spinner: b,
-  className: v,
-  form: j,
-  ...C
-}) {
-  const a = k(), H = g(() => {
-    !t || r || e || !s || a.start({ rotate: 90 });
-  }, [t, r, e, s, a]), S = g(() => {
-    !t || r || e || !s || a.start({ rotate: 0 });
-  }, [t, r, e, s, a]), E = i(() => x(
-    A({
-      variant: f,
-      color: c,
-      size: d,
-      disabled: r || e,
-      loading: e
-    }),
-    v
-  ), [f, c, d, r, e, v]), V = i(() => ({
-    whileHover: t && !r && !e ? { scale: 1.05 } : {},
-    whileTap: t && !r && !e ? { scale: 0.98 } : {},
-    transition: { type: "spring", stiffness: 400, damping: 17 }
-  }), [t, r, e]), B = i(() => e ? /* @__PURE__ */ o.jsxs("div", { className: "flex items-center gap-2", children: [
-    b,
-    d !== "small" && /* @__PURE__ */ o.jsx("span", { children: p })
-  ] }) : n || /* @__PURE__ */ o.jsxs("span", { className: x("flex items-center gap-2", m), children: [
-    u && /* @__PURE__ */ o.jsx(
-      y.div,
-      {
-        animate: s ? a : void 0,
-        transition: {
-          type: "spring",
-          stiffness: 400,
-          damping: 17
-        },
-        children: u
-      }
-    ),
-    l && /* @__PURE__ */ o.jsx("span", { children: l })
-  ] }), [e, n, u, l, b, d, p, s, a, m]);
-  return /* @__PURE__ */ o.jsx(
-    y.button,
-    {
-      form: j,
-      onClick: h,
-      className: E,
-      ...V,
-      onHoverStart: H,
-      onHoverEnd: S,
-      disabled: r || e,
-      type: w,
-      ...C,
-      children: B
-    }
-  );
-}
-const F = z(M);
+import { B as f } from "./Button-Bc0LYLfg.js";
 export {
-  F as default
+  f as default
 };