asheeui 0.6.14 → 0.7.0

package/dist/components/card/Card.js

@@ -1,206 +1,116 @@
 "use client";
-import { jsxs as C, jsx as d } from "react/jsx-runtime";
-import { forwardRef as ot, useId as nt } from "react";
-import { useAsheeConfig as et } from "../../libs/context.js";
-import { resolveCascade as v, resolveRadiusKey as st, resolveAnimate as lt, resolveClassKey as y } from "../../utils/resolve-token.js";
-import { Image as dt } from "../image/Image.js";
-import { FALLBACK_CARD_CONFIG as e } from "./card-config.js";
-import { CARD_PADDING_CLASS as at, CARD_GAP_CLASS as ct, CARD_HEADER_GAP_CLASS as it, CARD_VARIANT_CLASS as k } from "./card-styles.js";
-import { RADIUS_CLASS as ut } from "../../shared/radius.js";
-import { cn as p } from "../../utils/cn.js";
-const ft = ot(
-  ({
-    variant: G,
-    size: j,
-    radius: K,
-    animate: B,
-    isClickable: D,
-    isDisabled: s = !1,
-    href: i,
-    title: h,
-    description: x,
-    header: I,
-    body: E,
-    footer: N,
-    image: t,
-    imageProps: o,
-    className: V,
-    children: F,
-    onClick: u,
-    id: $,
-    style: H,
-    onKeyDown: A,
-    ...O
-  }, T) => {
-    var L;
-    const z = et(), r = (L = z.components) == null ? void 0 : L.card, U = nt(), q = $ ?? U, m = v(
-      j,
-      r == null ? void 0 : r.size,
-      void 0,
-      e.size
-    ), J = v(
-      G,
-      r == null ? void 0 : r.variant,
-      z.defaultVariant,
-      e.variant
-    ), M = st(
-      K,
-      r == null ? void 0 : r.radius,
-      z.defaultRadius,
-      e.radius
-    ), b = v(
-      t == null ? void 0 : t.position,
-      r == null ? void 0 : r.image.position,
-      void 0,
-      e.image.position
-    ), c = D ?? !!(i || u), Q = lt(
-      B,
-      r == null ? void 0 : r.animate,
-      e.animate
-    ), W = y(
-      m,
-      at,
-      e.size
-    ), S = y(
-      m,
-      ct,
-      e.size
-    ), X = y(
-      m,
-      it,
-      e.size
-    ), Y = y(
-      M,
-      ut,
-      e.radius
-    ), Z = v(
-      t == null ? void 0 : t.loading,
-      r == null ? void 0 : r.image.loading,
-      void 0,
-      e.image.loading
-    ), P = k[J] ?? k.bordered, w = (n) => {
-      if (s) {
-        n.preventDefault();
-        return;
-      }
-      u == null || u(n), i && !n.defaultPrevented && (window.location.href = i);
-    }, g = (n) => {
-      A == null || A(n), c && !s && (n.key === "Enter" || n.key === " ") && (n.preventDefault(), w(n));
-    }, R = (n) => {
-      if (!(t != null && t.src) || b !== n) return null;
-      const a = {
-        top: "w-full shrink-0 rounded-b-none",
-        bottom: "w-full shrink-0 order-last rounded-t-none",
-        background: ""
-      }[n];
-      let l = { ...o ?? {} };
-      if (t != null && t.component) {
-        const f = (o == null ? void 0 : o.loading) === "lazy", rt = (o == null ? void 0 : o.priority) === !0;
-        (f || rt) && console.warn(
-          `[Card] ${f ? '`loading="lazy"`' : "`priority={true}`"} with custom image component may cause rendering issues. Consider using \`loading="eager"\` and removing \`priority\` for card images.`
-        ), l = {
-          ...l,
-          loading: "eager",
-          // Remove priority if present to avoid conflicts
-          ...l.priority !== void 0 && { priority: !1 }
-        };
-      }
-      return /* @__PURE__ */ d(
-        dt,
-        {
-          src: t.src,
-          alt: t.alt,
-          ratio: (t == null ? void 0 : t.ratio) ?? "video",
-          fit: t.fit ?? "cover",
-          className: a,
-          imageComponent: t.component,
-          imageProps: l,
-          loading: Z
-        }
-      );
-    }, tt = () => {
-      if (!(t != null && t.src) || b !== "background") return null;
-      const n = t.component || "img";
-      let a = { ...o ?? {} };
-      if (t != null && t.component) {
-        const l = (o == null ? void 0 : o.loading) === "lazy", f = (o == null ? void 0 : o.priority) === !0;
-        (l || f) && console.warn(
-          `[Card] ${l ? '`loading="lazy"`' : "`priority={true}`"} with custom image component may cause rendering issues. Consider using \`loading="eager"\` and removing \`priority\` for card images.`
-        ), a = {
-          ...a,
-          loading: "eager",
-          ...a.priority !== void 0 && { priority: !1 }
-        };
-      }
-      return /* @__PURE__ */ d("div", { className: "absolute inset-0 z-0 pointer-events-none", children: /* @__PURE__ */ d(
-        n,
-        {
-          src: t.src,
-          alt: t == null ? void 0 : t.alt,
-          className: "h-full w-full object-cover",
-          ...a
-        }
-      ) });
-    }, _ = E ?? F;
-    return /* @__PURE__ */ C(
-      "div",
-      {
-        ref: T,
-        id: q,
-        tabIndex: c && !s ? 0 : -1,
-        role: c ? i ? "link" : "button" : void 0,
-        "aria-disabled": s,
-        onClick: w,
-        onKeyDown: g,
-        className: p(
-          "relative flex flex-col transition-colors duration-200 text-left",
-          P,
-          Y,
-          c && !s && "cursor-pointer hover:shadow-lg hover:border-primary/40 focus:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 select-none",
-          c && !s && Q && "motion-safe:transition-transform motion-safe:duration-100 motion-safe:active:scale-[0.99]",
-          s && "opacity-50 pointer-events-none select-none",
-          V
-        ),
-        style: H,
-        ...O,
-        children: [
-          R("top"),
-          tt(),
-          /* @__PURE__ */ C(
-            "div",
-            {
-              className: p(
-                "flex flex-col flex-1 z-10 w-full min-w-0",
-                W,
-                S
-              ),
-              children: [
-                (I || h || x) && /* @__PURE__ */ C("div", { className: p("flex flex-col z-10", X), children: [
-                  I,
-                  h && /* @__PURE__ */ d("h3", { className: "font-semibold leading-tight tracking-tight text-foreground text-lg md:text-xl", children: h }),
-                  x && /* @__PURE__ */ d("p", { className: "text-sm text-muted-foreground leading-relaxed", children: x })
-                ] }),
-                _ && /* @__PURE__ */ d("div", { className: "flex-1 z-10 text-sm leading-relaxed", children: _ }),
-                N && /* @__PURE__ */ d(
-                  "div",
-                  {
-                    className: p(
-                      "flex items-center justify-between z-10 mt-auto pt-2",
-                      S
-                    ),
-                    children: N
-                  }
-                )
-              ]
-            }
-          ),
-          R("bottom")
-        ]
-      }
-    );
-  }
-);
-ft.displayName = "Card";
-export {
-  ft as Card
-};
+"use client";
+import { cn as e } from "../../utils/cn.js";
+import { useAsheeConfig as t } from "../../libs/context.js";
+import { RADIUS_CLASS as n } from "../../shared/radius.js";
+import { resolveAnimate as r, resolveCascade as i, resolveClassKey as a, resolveRadiusKey as o } from "../../utils/resolve-token.js";
+import { Image as s } from "../image/Image.js";
+import { FALLBACK_CARD_CONFIG as c } from "./card-config.js";
+import { CARD_GAP_CLASS as l, CARD_HEADER_GAP_CLASS as u, CARD_PADDING_CLASS as d, CARD_VARIANT_CLASS as f } from "./card-styles.js";
+import { forwardRef as p, useId as m } from "react";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+//#region src/components/card/Card.tsx
+var _ = p(({ variant: p, size: _, radius: ee, animate: v, isClickable: y, isDisabled: b = !1, link: x, title: S, description: C, header: w, body: T, footer: E, image: D, className: te, children: ne, onClick: O, id: k, style: A, onKeyDown: j, ...M }, N) => {
+	let P = t(), F = P.components?.card, I = m(), L = k ?? I, R = i(_, F?.size, void 0, c.size), z = i(p, F?.variant, P.defaultVariant, c.variant), B = o(ee, F?.radius, P.defaultRadius, c.radius), V = i(D?.position, F?.image.position, void 0, c.image.position), H = !!x, U = x?.component ?? (H ? "a" : "div"), W = y ?? !!(H || O), G = r(v, F?.animate, c.animate), K = a(R, d, c.size), q = a(R, l, c.size), J = a(R, u, c.size), Y = a(B, n, c.radius), X = i(D?.loading, F?.image.loading, void 0, c.image.loading), re = f[z] ?? f.bordered, { onClick: ie, ...ae } = x?.props ?? {}, Z = (e) => {
+		if (b) {
+			e.preventDefault();
+			return;
+		}
+		O?.(e), ie?.(e);
+	}, oe = (e) => {
+		j?.(e), !H && W && !b && (e.key === "Enter" || e.key === " ") && (e.preventDefault(), Z(e));
+	}, Q = (e) => {
+		if (!D?.src || V !== e) return null;
+		let t = {
+			top: "w-full shrink-0 rounded-b-none",
+			bottom: "w-full shrink-0 order-last rounded-t-none",
+			background: ""
+		}[e], n = { ...D?.props ?? {} };
+		if (D?.component) {
+			let e = D?.props?.loading === "lazy", t = D?.props?.priority === !0;
+			(e || t) && console.warn(`[Card] ${e ? "`loading=\"lazy\"`" : "`priority={true}`"} with custom image component may cause rendering issues. Consider using \`loading="eager"\` and removing \`priority\` for card images.`), n = {
+				...n,
+				loading: "eager",
+				...n.priority !== void 0 && { priority: !1 }
+			};
+		}
+		return /* @__PURE__ */ h(s, {
+			src: D.src,
+			alt: D.alt,
+			ratio: D?.ratio ?? "video",
+			fit: D.fit ?? "cover",
+			className: t,
+			component: D.component,
+			props: n,
+			loading: X
+		});
+	}, se = () => {
+		if (!D?.src || V !== "background") return null;
+		let e = D.component || "img", t = { ...D?.props ?? {} };
+		if (D?.component) {
+			let e = D?.props?.loading === "lazy", n = D?.props?.priority === !0;
+			(e || n) && console.warn(`[Card] ${e ? "`loading=\"lazy\"`" : "`priority={true}`"} with custom image component may cause rendering issues. Consider using \`loading="eager"\` and removing \`priority\` for card images.`), t = {
+				...t,
+				loading: "eager",
+				...t.priority !== void 0 && { priority: !1 }
+			};
+		}
+		return /* @__PURE__ */ h("div", {
+			className: "absolute inset-0 z-0 pointer-events-none",
+			children: /* @__PURE__ */ h(e, {
+				src: D.src,
+				alt: D?.alt,
+				className: "h-full w-full object-cover",
+				...t
+			})
+		});
+	}, $ = T ?? ne;
+	return /* @__PURE__ */ g(U, {
+		ref: N,
+		id: L,
+		tabIndex: W && !b ? 0 : -1,
+		role: W ? H ? "link" : "button" : void 0,
+		"aria-disabled": b,
+		onClick: Z,
+		onKeyDown: oe,
+		className: e("relative flex flex-col transition-colors duration-200 text-left", re, Y, W && !b && "cursor-pointer hover:shadow-lg hover:border-primary/40 focus:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-offset-2 select-none", W && !b && G && "motion-safe:transition-transform motion-safe:duration-100 motion-safe:active:scale-[0.99]", b && "opacity-50 pointer-events-none select-none", te),
+		style: A,
+		...M,
+		...ae,
+		children: [
+			Q("top"),
+			se(),
+			/* @__PURE__ */ g("div", {
+				className: e("flex flex-col flex-1 z-10 w-full min-w-0", K, q),
+				children: [
+					(w || S || C) && /* @__PURE__ */ g("div", {
+						className: e("flex flex-col z-10", J),
+						children: [
+							w,
+							S && /* @__PURE__ */ h("h3", {
+								className: "font-semibold leading-tight tracking-tight text-foreground text-lg md:text-xl",
+								children: S
+							}),
+							C && /* @__PURE__ */ h("p", {
+								className: "text-sm text-muted-foreground leading-relaxed",
+								children: C
+							})
+						]
+					}),
+					$ && /* @__PURE__ */ h("div", {
+						className: "flex-1 z-10 text-sm leading-relaxed",
+						children: $
+					}),
+					E && /* @__PURE__ */ h("div", {
+						className: e("flex items-center justify-between z-10 mt-auto pt-2", q),
+						children: E
+					})
+				]
+			}),
+			Q("bottom")
+		]
+	});
+});
+_.displayName = "Card";
+//#endregion
+export { _ as Card };

package/dist/components/card/card-config.js

@@ -1,24 +1,27 @@
 "use client";
-import { registerComponentDefaults as i } from "../../libs/registry.js";
-const e = {
-  size: "md",
-  image: { position: "top", ratio: "video", fit: "cover" },
-  animate: !0
+import { registerComponentDefaults as e } from "../../libs/registry.js";
+//#region src/components/card/card-config.ts
+var t = {
+	size: "md",
+	image: {
+		position: "top",
+		ratio: "video",
+		fit: "cover"
+	},
+	animate: !0
 };
-i("card", e);
-const t = {
-  size: "md",
-  variant: "bordered",
-  radius: "md",
-  image: {
-    position: "top",
-    ratio: "video",
-    fit: "cover",
-    loading: "lazy"
-  },
-  animate: !0
-};
-export {
-  t as FALLBACK_CARD_CONFIG,
-  e as defaultCardConfig
+e("card", t);
+var n = {
+	size: "md",
+	variant: "bordered",
+	radius: "md",
+	image: {
+		position: "top",
+		ratio: "video",
+		fit: "cover",
+		loading: "lazy"
+	},
+	animate: !0
 };
+//#endregion
+export { n as FALLBACK_CARD_CONFIG, t as defaultCardConfig };

package/dist/components/card/card-styles.js

@@ -1,25 +1,22 @@
 "use client";
-const o = {
-  sm: "p-4",
-  md: "p-6",
-  lg: "p-8"
+//#region src/components/card/card-styles.ts
+var e = {
+	sm: "p-4",
+	md: "p-6",
+	lg: "p-8"
+}, t = {
+	sm: "gap-3",
+	md: "gap-4",
+	lg: "gap-5"
+}, n = {
+	sm: "gap-1",
+	md: "gap-1.5",
+	lg: "gap-2"
 }, r = {
-  sm: "gap-3",
-  md: "gap-4",
-  lg: "gap-5"
-}, e = {
-  sm: "gap-1",
-  md: "gap-1.5",
-  lg: "gap-2"
-}, d = {
-  elevated: "bg-secondary text-foreground shadow-md border border-border/40",
-  bordered: "bg-background text-foreground border border-border shadow-xs",
-  flat: "bg-secondary/50 text-foreground border-none",
-  ghost: "bg-transparent text-foreground border-none shadow-none"
-};
-export {
-  r as CARD_GAP_CLASS,
-  e as CARD_HEADER_GAP_CLASS,
-  o as CARD_PADDING_CLASS,
-  d as CARD_VARIANT_CLASS
+	elevated: "bg-secondary text-foreground shadow-md border border-border/40",
+	bordered: "bg-background text-foreground border border-border shadow-xs",
+	flat: "bg-secondary/50 text-foreground border-none",
+	ghost: "bg-transparent text-foreground border-none shadow-none"
 };
+//#endregion
+export { t as CARD_GAP_CLASS, n as CARD_HEADER_GAP_CLASS, e as CARD_PADDING_CLASS, r as CARD_VARIANT_CLASS };