@enadhq/enad-react-sdk 0.0.6 → 1.0.2

package/dist/client/storefront/blocks/image-block.mjs

@@ -0,0 +1,29 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "../../ui/utils";
+const aspectClasses = {
+  "4:5": "aspect-[4/5]",
+  "16:9": "aspect-[16/9]",
+  "1:1": "aspect-square"
+};
+function ImageBlock({
+  image,
+  aspectRatio = "4:5",
+  caption,
+  className
+}) {
+  return /* @__PURE__ */ jsxs("figure", { className: cn("overflow-hidden", className), children: [
+    /* @__PURE__ */ jsx("div", { className: cn("relative bg-muted", aspectClasses[aspectRatio]), children: image?.src ? /* @__PURE__ */ jsx(
+      "img",
+      {
+        src: image.src,
+        alt: image.alt ?? "",
+        className: "size-full object-cover"
+      }
+    ) : /* @__PURE__ */ jsx("div", { className: "size-full bg-muted" }) }),
+    caption && /* @__PURE__ */ jsx("figcaption", { className: "mt-2 text-sm text-muted-foreground", children: caption })
+  ] });
+}
+export {
+  ImageBlock
+};
+//# sourceMappingURL=image-block.mjs.map

package/dist/client/storefront/blocks/image-block.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/storefront/blocks/image-block.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { cn } from \"../../ui/utils\"\nimport type { ImageBlockProps } from \"../types\"\n\nconst aspectClasses: Record<string, string> = {\n  \"4:5\": \"aspect-[4/5]\",\n  \"16:9\": \"aspect-[16/9]\",\n  \"1:1\": \"aspect-square\",\n}\n\nfunction ImageBlock({\n  image,\n  aspectRatio = \"4:5\",\n  caption,\n  className,\n}: ImageBlockProps) {\n  return (\n    <figure className={cn(\"overflow-hidden\", className)}>\n      <div className={cn(\"relative bg-muted\", aspectClasses[aspectRatio])}>\n        {image?.src ? (\n          <img\n            src={image.src}\n            alt={image.alt ?? \"\"}\n            className=\"size-full object-cover\"\n          />\n        ) : (\n          <div className=\"size-full bg-muted\" />\n        )}\n      </div>\n      {caption && (\n        <figcaption className=\"mt-2 text-sm text-muted-foreground\">\n          {caption}\n        </figcaption>\n      )}\n    </figure>\n  )\n}\n\nexport { ImageBlock, type ImageBlockProps }\n"],"mappings":"AAiBI,SAGM,KAHN;AAhBJ,SAAS,UAAU;AAGnB,MAAM,gBAAwC;AAAA,EAC5C,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,OAAO;AACT;AAEA,SAAS,WAAW;AAAA,EAClB;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA;AACF,GAAoB;AAClB,SACE,qBAAC,YAAO,WAAW,GAAG,mBAAmB,SAAS,GAChD;AAAA,wBAAC,SAAI,WAAW,GAAG,qBAAqB,cAAc,WAAW,CAAC,GAC/D,iBAAO,MACN;AAAA,MAAC;AAAA;AAAA,QACC,KAAK,MAAM;AAAA,QACX,KAAK,MAAM,OAAO;AAAA,QAClB,WAAU;AAAA;AAAA,IACZ,IAEA,oBAAC,SAAI,WAAU,sBAAqB,GAExC;AAAA,IACC,WACC,oBAAC,gBAAW,WAAU,sCACnB,mBACH;AAAA,KAEJ;AAEJ;","names":[]}

package/dist/client/storefront/blocks/index.d.ts

@@ -0,0 +1,20 @@
+export { Spacer, type SpacerProps } from "./spacer";
+export { ImageBlock, type ImageBlockProps } from "./image-block";
+export { CardImageWithCaption, type CardImageWithCaptionProps } from "./card-image-with-caption";
+export { TextContent, type TextContentProps } from "./text-content";
+export { VariableTextContent, type VariableTextContentProps } from "./variable-text-content";
+export { TextContentWithImage, type TextContentWithImageProps } from "./text-content-with-image";
+export { LinkBlock, type LinkBlockProps } from "./link-block";
+export { LinkBlockSmall, type LinkBlockSmallProps } from "./link-block-small";
+export { CardVideo, type CardVideoProps } from "./card-video";
+export { AccordionBlock, type AccordionBlockProps } from "./accordion-block";
+export { TruncatedText, type TruncatedTextProps } from "./truncated-text";
+export { Hero, type HeroProps } from "./hero";
+export { ProductCard, type ProductCardProps } from "./product-card";
+export { ProductImage, type ProductImageProps } from "./product-image";
+export { Gallery, type GalleryProps } from "./gallery";
+export { GalleryWithCaption, type GalleryWithCaptionProps } from "./gallery-with-caption";
+export { GalleryWithLinkBlocks, type GalleryWithLinkBlocksProps } from "./gallery-with-link-blocks";
+export { ContentWithGallery, type ContentWithGalleryProps } from "./content-with-gallery";
+export { ContentWithImageProductData, type ContentWithImageProductDataProps } from "./content-with-image-product-data";
+//# sourceMappingURL=index.d.ts.map

package/dist/client/storefront/blocks/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/blocks/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,UAAU,CAAA;AACnD,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,eAAe,CAAA;AAChE,OAAO,EAAE,oBAAoB,EAAE,KAAK,yBAAyB,EAAE,MAAM,2BAA2B,CAAA;AAChG,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AACnE,OAAO,EAAE,mBAAmB,EAAE,KAAK,wBAAwB,EAAE,MAAM,yBAAyB,CAAA;AAC5F,OAAO,EAAE,oBAAoB,EAAE,KAAK,yBAAyB,EAAE,MAAM,2BAA2B,CAAA;AAChG,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,cAAc,CAAA;AAC7D,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,oBAAoB,CAAA;AAC7E,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,cAAc,CAAA;AAC7D,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,MAAM,mBAAmB,CAAA;AAC5E,OAAO,EAAE,aAAa,EAAE,KAAK,kBAAkB,EAAE,MAAM,kBAAkB,CAAA;AACzE,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,QAAQ,CAAA;AAC7C,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AACnE,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,MAAM,iBAAiB,CAAA;AACtE,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,WAAW,CAAA;AACtD,OAAO,EAAE,kBAAkB,EAAE,KAAK,uBAAuB,EAAE,MAAM,wBAAwB,CAAA;AACzF,OAAO,EAAE,qBAAqB,EAAE,KAAK,0BAA0B,EAAE,MAAM,4BAA4B,CAAA;AACnG,OAAO,EAAE,kBAAkB,EAAE,KAAK,uBAAuB,EAAE,MAAM,wBAAwB,CAAA;AACzF,OAAO,EAAE,2BAA2B,EAAE,KAAK,gCAAgC,EAAE,MAAM,mCAAmC,CAAA"}

package/dist/client/storefront/blocks/index.mjs

@@ -0,0 +1,41 @@
+import { Spacer } from "./spacer";
+import { ImageBlock } from "./image-block";
+import { CardImageWithCaption } from "./card-image-with-caption";
+import { TextContent } from "./text-content";
+import { VariableTextContent } from "./variable-text-content";
+import { TextContentWithImage } from "./text-content-with-image";
+import { LinkBlock } from "./link-block";
+import { LinkBlockSmall } from "./link-block-small";
+import { CardVideo } from "./card-video";
+import { AccordionBlock } from "./accordion-block";
+import { TruncatedText } from "./truncated-text";
+import { Hero } from "./hero";
+import { ProductCard } from "./product-card";
+import { ProductImage } from "./product-image";
+import { Gallery } from "./gallery";
+import { GalleryWithCaption } from "./gallery-with-caption";
+import { GalleryWithLinkBlocks } from "./gallery-with-link-blocks";
+import { ContentWithGallery } from "./content-with-gallery";
+import { ContentWithImageProductData } from "./content-with-image-product-data";
+export {
+  AccordionBlock,
+  CardImageWithCaption,
+  CardVideo,
+  ContentWithGallery,
+  ContentWithImageProductData,
+  Gallery,
+  GalleryWithCaption,
+  GalleryWithLinkBlocks,
+  Hero,
+  ImageBlock,
+  LinkBlock,
+  LinkBlockSmall,
+  ProductCard,
+  ProductImage,
+  Spacer,
+  TextContent,
+  TextContentWithImage,
+  TruncatedText,
+  VariableTextContent
+};
+//# sourceMappingURL=index.mjs.map

package/dist/client/storefront/blocks/index.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/storefront/blocks/index.ts"],"sourcesContent":["export { Spacer, type SpacerProps } from \"./spacer\"\nexport { ImageBlock, type ImageBlockProps } from \"./image-block\"\nexport { CardImageWithCaption, type CardImageWithCaptionProps } from \"./card-image-with-caption\"\nexport { TextContent, type TextContentProps } from \"./text-content\"\nexport { VariableTextContent, type VariableTextContentProps } from \"./variable-text-content\"\nexport { TextContentWithImage, type TextContentWithImageProps } from \"./text-content-with-image\"\nexport { LinkBlock, type LinkBlockProps } from \"./link-block\"\nexport { LinkBlockSmall, type LinkBlockSmallProps } from \"./link-block-small\"\nexport { CardVideo, type CardVideoProps } from \"./card-video\"\nexport { AccordionBlock, type AccordionBlockProps } from \"./accordion-block\"\nexport { TruncatedText, type TruncatedTextProps } from \"./truncated-text\"\nexport { Hero, type HeroProps } from \"./hero\"\nexport { ProductCard, type ProductCardProps } from \"./product-card\"\nexport { ProductImage, type ProductImageProps } from \"./product-image\"\nexport { Gallery, type GalleryProps } from \"./gallery\"\nexport { GalleryWithCaption, type GalleryWithCaptionProps } from \"./gallery-with-caption\"\nexport { GalleryWithLinkBlocks, type GalleryWithLinkBlocksProps } from \"./gallery-with-link-blocks\"\nexport { ContentWithGallery, type ContentWithGalleryProps } from \"./content-with-gallery\"\nexport { ContentWithImageProductData, type ContentWithImageProductDataProps } from \"./content-with-image-product-data\"\n"],"mappings":"AAAA,SAAS,cAAgC;AACzC,SAAS,kBAAwC;AACjD,SAAS,4BAA4D;AACrE,SAAS,mBAA0C;AACnD,SAAS,2BAA0D;AACnE,SAAS,4BAA4D;AACrE,SAAS,iBAAsC;AAC/C,SAAS,sBAAgD;AACzD,SAAS,iBAAsC;AAC/C,SAAS,sBAAgD;AACzD,SAAS,qBAA8C;AACvD,SAAS,YAA4B;AACrC,SAAS,mBAA0C;AACnD,SAAS,oBAA4C;AACrD,SAAS,eAAkC;AAC3C,SAAS,0BAAwD;AACjE,SAAS,6BAA8D;AACvE,SAAS,0BAAwD;AACjE,SAAS,mCAA0E;","names":[]}

package/dist/client/storefront/blocks/link-block-small.d.ts

@@ -0,0 +1,4 @@
+import type { LinkBlockSmallProps } from "../types";
+declare function LinkBlockSmall({ image, title, href, className, }: LinkBlockSmallProps): import("react/jsx-runtime").JSX.Element;
+export { LinkBlockSmall, type LinkBlockSmallProps };
+//# sourceMappingURL=link-block-small.d.ts.map

package/dist/client/storefront/blocks/link-block-small.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-block-small.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/blocks/link-block-small.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,UAAU,CAAA;AAEnD,iBAAS,cAAc,CAAC,EACtB,KAAK,EACL,KAAK,EACL,IAAI,EACJ,SAAS,GACV,EAAE,mBAAmB,2CA6BrB;AAED,OAAO,EAAE,cAAc,EAAE,KAAK,mBAAmB,EAAE,CAAA"}

package/dist/client/storefront/blocks/link-block-small.mjs

@@ -0,0 +1,35 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "../../ui/utils";
+function LinkBlockSmall({
+  image,
+  title,
+  href,
+  className
+}) {
+  const card = /* @__PURE__ */ jsxs("div", { className: cn("enad-interactive group relative aspect-[3/4] overflow-hidden rounded-[var(--enad-card-radius)]", className), children: [
+    image?.src ? /* @__PURE__ */ jsx(
+      "img",
+      {
+        src: image.src,
+        alt: image.alt ?? title ?? "",
+        className: "size-full object-cover transition-transform duration-[var(--enad-image-hover-duration)] group-hover:scale-[var(--enad-image-hover-scale)]"
+      }
+    ) : /* @__PURE__ */ jsx("div", { className: "size-full bg-muted" }),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "absolute inset-0",
+        style: { background: "linear-gradient(to top, color-mix(in oklch, var(--enad-overlay-color) calc(var(--enad-overlay-from-opacity) * 100%), transparent), color-mix(in oklch, var(--enad-overlay-color) calc(var(--enad-overlay-to-opacity) * 100%), transparent))" }
+      }
+    ),
+    title && /* @__PURE__ */ jsx("p", { className: "absolute inset-x-0 bottom-0 p-3 text-sm font-medium text-white", children: title })
+  ] });
+  if (href) {
+    return /* @__PURE__ */ jsx("a", { href, className: "block", children: card });
+  }
+  return card;
+}
+export {
+  LinkBlockSmall
+};
+//# sourceMappingURL=link-block-small.mjs.map

package/dist/client/storefront/blocks/link-block-small.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/storefront/blocks/link-block-small.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { cn } from \"../../ui/utils\"\nimport type { LinkBlockSmallProps } from \"../types\"\n\nfunction LinkBlockSmall({\n  image,\n  title,\n  href,\n  className,\n}: LinkBlockSmallProps) {\n  const card = (\n    <div className={cn(\"enad-interactive group relative aspect-[3/4] overflow-hidden rounded-[var(--enad-card-radius)]\", className)}>\n      {image?.src ? (\n        <img\n          src={image.src}\n          alt={image.alt ?? title ?? \"\"}\n          className=\"size-full object-cover transition-transform duration-[var(--enad-image-hover-duration)] group-hover:scale-[var(--enad-image-hover-scale)]\"\n        />\n      ) : (\n        <div className=\"size-full bg-muted\" />\n      )}\n      <div\n        className=\"absolute inset-0\"\n        style={{ background: \"linear-gradient(to top, color-mix(in oklch, var(--enad-overlay-color) calc(var(--enad-overlay-from-opacity) * 100%), transparent), color-mix(in oklch, var(--enad-overlay-color) calc(var(--enad-overlay-to-opacity) * 100%), transparent))\" }}\n      />\n      {title && (\n        <p className=\"absolute inset-x-0 bottom-0 p-3 text-sm font-medium text-white\">\n          {title}\n        </p>\n      )}\n    </div>\n  )\n\n  if (href) {\n    return <a href={href} className=\"block\">{card}</a>\n  }\n\n  return card\n}\n\nexport { LinkBlockSmall, type LinkBlockSmallProps }\n"],"mappings":"AAWI,SAEI,KAFJ;AAVJ,SAAS,UAAU;AAGnB,SAAS,eAAe;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAwB;AACtB,QAAM,OACJ,qBAAC,SAAI,WAAW,GAAG,kGAAkG,SAAS,GAC3H;AAAA,WAAO,MACN;AAAA,MAAC;AAAA;AAAA,QACC,KAAK,MAAM;AAAA,QACX,KAAK,MAAM,OAAO,SAAS;AAAA,QAC3B,WAAU;AAAA;AAAA,IACZ,IAEA,oBAAC,SAAI,WAAU,sBAAqB;AAAA,IAEtC;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,OAAO,EAAE,YAAY,8OAA8O;AAAA;AAAA,IACrQ;AAAA,IACC,SACC,oBAAC,OAAE,WAAU,kEACV,iBACH;AAAA,KAEJ;AAGF,MAAI,MAAM;AACR,WAAO,oBAAC,OAAE,MAAY,WAAU,SAAS,gBAAK;AAAA,EAChD;AAEA,SAAO;AACT;","names":[]}

package/dist/client/storefront/blocks/link-block.d.ts

@@ -0,0 +1,4 @@
+import { type LinkBlockProps } from "../types";
+declare function LinkBlock(props: LinkBlockProps): import("react/jsx-runtime").JSX.Element;
+export { LinkBlock, type LinkBlockProps };
+//# sourceMappingURL=link-block.d.ts.map

package/dist/client/storefront/blocks/link-block.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"link-block.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/blocks/link-block.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAkC,KAAK,cAAc,EAAE,MAAM,UAAU,CAAA;AA8M9E,iBAAS,SAAS,CAAC,KAAK,EAAE,cAAc,2CAavC;AAED,OAAO,EAAE,SAAS,EAAE,KAAK,cAAc,EAAE,CAAA"}

package/dist/client/storefront/blocks/link-block.mjs

@@ -0,0 +1,150 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "../../ui/utils";
+import { colorThemeClasses, isThemeDark } from "../types";
+const headingStyle = { fontWeight: "var(--enad-heading-weight)", letterSpacing: "var(--enad-heading-tracking)", textTransform: "var(--enad-heading-transform)" };
+function OptionalLink({
+  href,
+  radiusClass,
+  children
+}) {
+  if (!href) return children;
+  return /* @__PURE__ */ jsx(
+    "a",
+    {
+      href,
+      className: cn("block focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2", radiusClass),
+      children
+    }
+  );
+}
+function CardVariant({
+  image,
+  eyebrow,
+  title,
+  buttonLabel,
+  buttonHref,
+  dark,
+  themeClasses,
+  className
+}) {
+  const content = /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "enad-interactive group overflow-hidden rounded-[var(--enad-card-radius)]",
+        "shadow-[var(--enad-card-shadow)] transition-shadow duration-[var(--enad-motion-duration)] hover:shadow-[var(--enad-card-hover-shadow)]",
+        themeClasses || "bg-background",
+        className
+      ),
+      children: [
+        image?.src ? /* @__PURE__ */ jsx("div", { className: "overflow-hidden rounded-t-[var(--enad-image-radius)] bg-muted", children: /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: image.src,
+            alt: image.alt ?? title ?? "",
+            loading: "lazy",
+            className: "aspect-[3/2] w-full object-cover transition-transform duration-[var(--enad-image-hover-duration)] group-hover:scale-[var(--enad-image-hover-scale)]"
+          }
+        ) }) : /* @__PURE__ */ jsx("div", { className: "aspect-[3/2] w-full bg-muted", "aria-hidden": "true" }),
+        /* @__PURE__ */ jsxs("div", { className: "min-w-0 p-6", children: [
+          eyebrow && /* @__PURE__ */ jsx("p", { className: cn("mb-1 text-sm uppercase tracking-widest", dark ? "text-white/70" : "text-muted-foreground"), children: eyebrow }),
+          title && /* @__PURE__ */ jsx(
+            "h3",
+            {
+              className: cn("line-clamp-2 text-xl font-heading", dark ? "text-white" : "text-foreground"),
+              style: headingStyle,
+              children: title
+            }
+          ),
+          buttonLabel && /* @__PURE__ */ jsx("span", { className: cn("mt-3 inline-block text-sm font-medium line-clamp-3", dark ? "text-white/80" : "text-foreground"), children: buttonLabel })
+        ] })
+      ]
+    }
+  );
+  return /* @__PURE__ */ jsx(OptionalLink, { href: buttonHref, radiusClass: "rounded-[var(--enad-card-radius)]", children: content });
+}
+function TextOnlyVariant({
+  eyebrow,
+  title,
+  buttonLabel,
+  buttonHref,
+  dark,
+  themeClasses,
+  className
+}) {
+  const content = /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        "enad-interactive group rounded-[var(--enad-card-radius)] border transition-colors duration-[var(--enad-motion-duration)]",
+        "border-[length:var(--enad-border-width)] px-6 py-5",
+        dark ? "border-white/20 hover:bg-white/10" : "border-border hover:bg-accent",
+        themeClasses,
+        className
+      ),
+      children: [
+        eyebrow && /* @__PURE__ */ jsx("p", { className: cn("mb-1 text-sm uppercase tracking-widest", dark ? "text-white/70" : "text-muted-foreground"), children: eyebrow }),
+        title && /* @__PURE__ */ jsx(
+          "h3",
+          {
+            className: cn("truncate text-lg font-heading", dark ? "text-white" : "text-foreground"),
+            style: headingStyle,
+            children: title
+          }
+        ),
+        buttonLabel && /* @__PURE__ */ jsx("span", { className: cn("mt-2 inline-block text-sm font-medium", dark ? "text-white/80" : "text-muted-foreground"), children: buttonLabel })
+      ]
+    }
+  );
+  return /* @__PURE__ */ jsx(OptionalLink, { href: buttonHref, radiusClass: "rounded-[var(--enad-card-radius)]", children: content });
+}
+function OverlayVariant({
+  image,
+  eyebrow,
+  title,
+  buttonLabel,
+  buttonHref,
+  className
+}) {
+  const content = /* @__PURE__ */ jsxs("div", { className: cn("enad-interactive group relative aspect-[3/4] overflow-hidden md:aspect-[2/1]", className), children: [
+    image?.src ? /* @__PURE__ */ jsx(
+      "img",
+      {
+        src: image.src,
+        alt: image.alt ?? title ?? "",
+        loading: "lazy",
+        className: "size-full object-cover transition-transform duration-[var(--enad-image-hover-duration)] group-hover:scale-[var(--enad-image-hover-scale)]"
+      }
+    ) : /* @__PURE__ */ jsx("div", { className: "size-full bg-primary", "aria-hidden": "true" }),
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "absolute inset-0",
+        style: { background: "linear-gradient(to top, color-mix(in oklch, var(--enad-overlay-color) calc(var(--enad-overlay-from-opacity) * 100%), transparent), color-mix(in oklch, var(--enad-overlay-color) calc(var(--enad-overlay-to-opacity) * 100%), transparent))" }
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: "absolute inset-x-0 bottom-0 min-w-0 p-6 md:p-8", children: [
+      eyebrow && /* @__PURE__ */ jsx("p", { className: "mb-1 text-sm uppercase tracking-widest text-white/70", children: eyebrow }),
+      title && /* @__PURE__ */ jsx("h3", { className: "line-clamp-2 text-xl font-heading text-white md:text-2xl", style: headingStyle, children: title }),
+      buttonLabel && /* @__PURE__ */ jsx("span", { className: "mt-3 inline-block border-b border-white/50 pb-0.5 text-sm text-white transition-colors group-hover:border-white", children: buttonLabel })
+    ] })
+  ] });
+  return /* @__PURE__ */ jsx(OptionalLink, { href: buttonHref, children: content });
+}
+function LinkBlock(props) {
+  const dark = isThemeDark(props.colorTheme);
+  const themeClasses = colorThemeClasses(props.colorTheme);
+  const variantProps = { ...props, dark, themeClasses };
+  switch (props.variant ?? "overlay") {
+    case "card":
+      return /* @__PURE__ */ jsx(CardVariant, { ...variantProps });
+    case "text-only":
+      return /* @__PURE__ */ jsx(TextOnlyVariant, { ...variantProps });
+    default:
+      return /* @__PURE__ */ jsx(OverlayVariant, { ...variantProps });
+  }
+}
+export {
+  LinkBlock
+};
+//# sourceMappingURL=link-block.mjs.map

package/dist/client/storefront/blocks/link-block.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/storefront/blocks/link-block.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { cn } from \"../../ui/utils\"\nimport { colorThemeClasses, isThemeDark, type LinkBlockProps } from \"../types\"\n\n/* ─── Shared types ─── */\n\ntype VariantProps = LinkBlockProps & {\n  dark: boolean\n  themeClasses: string\n}\n\nconst headingStyle = { fontWeight: \"var(--enad-heading-weight)\", letterSpacing: \"var(--enad-heading-tracking)\", textTransform: \"var(--enad-heading-transform)\" } as unknown as React.CSSProperties\n\n/* ─── Shared link wrapper ─── */\n\nfunction OptionalLink({\n  href,\n  radiusClass,\n  children,\n}: {\n  href?: string\n  radiusClass?: string\n  children: React.ReactNode\n}) {\n  if (!href) return children\n  return (\n    <a\n      href={href}\n      className={cn(\"block focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\", radiusClass)}\n    >\n      {children}\n    </a>\n  )\n}\n\n/* ─── Card variant ─── */\n\nfunction CardVariant({\n  image,\n  eyebrow,\n  title,\n  buttonLabel,\n  buttonHref,\n  dark,\n  themeClasses,\n  className,\n}: VariantProps) {\n  const content = (\n    <div\n      className={cn(\n        \"enad-interactive group overflow-hidden rounded-[var(--enad-card-radius)]\",\n        \"shadow-[var(--enad-card-shadow)] transition-shadow duration-[var(--enad-motion-duration)] hover:shadow-[var(--enad-card-hover-shadow)]\",\n        themeClasses || \"bg-background\",\n        className,\n      )}\n    >\n      {/* Image top */}\n      {image?.src ? (\n        <div className=\"overflow-hidden rounded-t-[var(--enad-image-radius)] bg-muted\">\n          <img\n            src={image.src}\n            alt={image.alt ?? title ?? \"\"}\n            loading=\"lazy\"\n            className=\"aspect-[3/2] w-full object-cover transition-transform duration-[var(--enad-image-hover-duration)] group-hover:scale-[var(--enad-image-hover-scale)]\"\n          />\n        </div>\n      ) : (\n        <div className=\"aspect-[3/2] w-full bg-muted\" aria-hidden=\"true\" />\n      )}\n\n      {/* Text content below */}\n      <div className=\"min-w-0 p-6\">\n        {eyebrow && (\n          <p className={cn(\"mb-1 text-sm uppercase tracking-widest\", dark ? \"text-white/70\" : \"text-muted-foreground\")}>\n            {eyebrow}\n          </p>\n        )}\n        {title && (\n          <h3\n            className={cn(\"line-clamp-2 text-xl font-heading\", dark ? \"text-white\" : \"text-foreground\")}\n            style={headingStyle}\n          >\n            {title}\n          </h3>\n        )}\n        {buttonLabel && (\n          <span className={cn(\"mt-3 inline-block text-sm font-medium line-clamp-3\", dark ? \"text-white/80\" : \"text-foreground\")}>\n            {buttonLabel}\n          </span>\n        )}\n      </div>\n    </div>\n  )\n\n  return (\n    <OptionalLink href={buttonHref} radiusClass=\"rounded-[var(--enad-card-radius)]\">\n      {content}\n    </OptionalLink>\n  )\n}\n\n/* ─── Text-only variant ─── */\n\nfunction TextOnlyVariant({\n  eyebrow,\n  title,\n  buttonLabel,\n  buttonHref,\n  dark,\n  themeClasses,\n  className,\n}: VariantProps) {\n  const content = (\n    <div\n      className={cn(\n        \"enad-interactive group rounded-[var(--enad-card-radius)] border transition-colors duration-[var(--enad-motion-duration)]\",\n        \"border-[length:var(--enad-border-width)] px-6 py-5\",\n        dark\n          ? \"border-white/20 hover:bg-white/10\"\n          : \"border-border hover:bg-accent\",\n        themeClasses,\n        className,\n      )}\n    >\n      {eyebrow && (\n        <p className={cn(\"mb-1 text-sm uppercase tracking-widest\", dark ? \"text-white/70\" : \"text-muted-foreground\")}>\n          {eyebrow}\n        </p>\n      )}\n      {title && (\n        <h3\n          className={cn(\"truncate text-lg font-heading\", dark ? \"text-white\" : \"text-foreground\")}\n          style={headingStyle}\n        >\n          {title}\n        </h3>\n      )}\n      {buttonLabel && (\n        <span className={cn(\"mt-2 inline-block text-sm font-medium\", dark ? \"text-white/80\" : \"text-muted-foreground\")}>\n          {buttonLabel}\n        </span>\n      )}\n    </div>\n  )\n\n  return (\n    <OptionalLink href={buttonHref} radiusClass=\"rounded-[var(--enad-card-radius)]\">\n      {content}\n    </OptionalLink>\n  )\n}\n\n/* ─── Overlay variant (default) ─── */\n\nfunction OverlayVariant({\n  image,\n  eyebrow,\n  title,\n  buttonLabel,\n  buttonHref,\n  className,\n}: VariantProps) {\n  const content = (\n    <div className={cn(\"enad-interactive group relative aspect-[3/4] overflow-hidden md:aspect-[2/1]\", className)}>\n      {/* Background image */}\n      {image?.src ? (\n        <img\n          src={image.src}\n          alt={image.alt ?? title ?? \"\"}\n          loading=\"lazy\"\n          className=\"size-full object-cover transition-transform duration-[var(--enad-image-hover-duration)] group-hover:scale-[var(--enad-image-hover-scale)]\"\n        />\n      ) : (\n        <div className=\"size-full bg-primary\" aria-hidden=\"true\" />\n      )}\n\n      {/* Gradient overlay */}\n      <div\n        className=\"absolute inset-0\"\n        style={{ background: \"linear-gradient(to top, color-mix(in oklch, var(--enad-overlay-color) calc(var(--enad-overlay-from-opacity) * 100%), transparent), color-mix(in oklch, var(--enad-overlay-color) calc(var(--enad-overlay-to-opacity) * 100%), transparent))\" }}\n      />\n\n      {/* Text content */}\n      <div className=\"absolute inset-x-0 bottom-0 min-w-0 p-6 md:p-8\">\n        {eyebrow && (\n          <p className=\"mb-1 text-sm uppercase tracking-widest text-white/70\">\n            {eyebrow}\n          </p>\n        )}\n        {title && (\n          <h3 className=\"line-clamp-2 text-xl font-heading text-white md:text-2xl\" style={headingStyle}>\n            {title}\n          </h3>\n        )}\n        {buttonLabel && (\n          <span className=\"mt-3 inline-block border-b border-white/50 pb-0.5 text-sm text-white transition-colors group-hover:border-white\">\n            {buttonLabel}\n          </span>\n        )}\n      </div>\n    </div>\n  )\n\n  return <OptionalLink href={buttonHref}>{content}</OptionalLink>\n}\n\n/* ─── Main component (dispatcher) ─── */\n\nfunction LinkBlock(props: LinkBlockProps) {\n  const dark = isThemeDark(props.colorTheme)\n  const themeClasses = colorThemeClasses(props.colorTheme)\n  const variantProps: VariantProps = { ...props, dark, themeClasses }\n\n  switch (props.variant ?? \"overlay\") {\n    case \"card\":\n      return <CardVariant {...variantProps} />\n    case \"text-only\":\n      return <TextOnlyVariant {...variantProps} />\n    default:\n      return <OverlayVariant {...variantProps} />\n  }\n}\n\nexport { LinkBlock, type LinkBlockProps }\n"],"mappings":"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","names":[]}

package/dist/client/storefront/blocks/product-card.d.ts

@@ -0,0 +1,4 @@
+import type { ProductCardProps } from "../types";
+declare function ProductCard(props: ProductCardProps): import("react/jsx-runtime").JSX.Element;
+export { ProductCard, type ProductCardProps };
+//# sourceMappingURL=product-card.d.ts.map

package/dist/client/storefront/blocks/product-card.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-card.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/blocks/product-card.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAA;AA8RhD,iBAAS,WAAW,CAAC,KAAK,EAAE,gBAAgB,2CAgB3C;AAED,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,CAAA"}

package/dist/client/storefront/blocks/product-card.mjs

@@ -0,0 +1,228 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useIcon } from "../../icons/icon-context";
+import { Card, CardContent, CardFooter, CardHeader } from "../../ui-resolver/card";
+import { cn } from "../../ui/utils";
+import { SwipeableCarousel } from "../carousel/swipeable-carousel";
+function OptionalLink({
+  href,
+  radiusClass,
+  children
+}) {
+  if (!href) return children;
+  return /* @__PURE__ */ jsx(
+    "a",
+    {
+      href,
+      className: cn("block focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2", radiusClass),
+      children
+    }
+  );
+}
+function FallbackImage() {
+  return /* @__PURE__ */ jsx("div", { className: "relative aspect-[4/5] bg-muted", "aria-hidden": "true" });
+}
+function FavoriteButton({
+  HeartIcon,
+  onFavoriteClick,
+  className
+}) {
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      type: "button",
+      onClick: (e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        onFavoriteClick?.();
+      },
+      className,
+      "aria-label": "Add to favorites",
+      children: /* @__PURE__ */ jsx(HeartIcon, { className: "size-4" })
+    }
+  );
+}
+function GalleryImageArea({
+  imageElements,
+  fallback,
+  showPaginationDots
+}) {
+  if (imageElements.length > 1) {
+    return /* @__PURE__ */ jsx(SwipeableCarousel, { items: imageElements, showDots: showPaginationDots });
+  }
+  if (imageElements.length === 1) {
+    return imageElements[0];
+  }
+  return fallback;
+}
+function HorizontalCard({
+  images = [],
+  title,
+  subtitle,
+  price,
+  tag,
+  href,
+  showFavorites = false,
+  onFavoriteClick,
+  className,
+  HeartIcon
+}) {
+  const content = /* @__PURE__ */ jsxs(Card, { className: cn("enad-interactive group flex overflow-hidden border-0 shadow-[var(--enad-card-shadow)] transition-shadow duration-[var(--enad-motion-duration)] hover:shadow-[var(--enad-card-hover-shadow)]", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "relative w-1/3 shrink-0", children: [
+      images[0] ? /* @__PURE__ */ jsx("div", { className: "relative aspect-[4/5] bg-muted", children: /* @__PURE__ */ jsx("img", { src: images[0].src, alt: images[0].alt ?? title ?? "", loading: "lazy", className: "size-full object-cover transition-transform duration-[var(--enad-image-hover-duration)] group-hover:scale-[var(--enad-image-hover-scale)]" }) }) : /* @__PURE__ */ jsx(FallbackImage, {}),
+      tag && /* @__PURE__ */ jsx("span", { className: "absolute start-2 top-2 rounded-[var(--enad-card-radius)] bg-background/90 px-2 py-0.5 text-xs font-medium text-foreground", children: tag })
+    ] }),
+    /* @__PURE__ */ jsxs(CardContent, { className: "flex min-w-0 flex-1 flex-col justify-center p-4 md:p-6", children: [
+      title && /* @__PURE__ */ jsx("p", { className: "line-clamp-2 text-base font-medium text-foreground", children: title }),
+      subtitle && /* @__PURE__ */ jsx("p", { className: "mt-1 truncate text-sm text-muted-foreground", children: subtitle }),
+      price && /* @__PURE__ */ jsx("p", { className: "mt-2 text-base font-medium text-foreground", children: price }),
+      showFavorites && /* @__PURE__ */ jsx(
+        FavoriteButton,
+        {
+          HeartIcon,
+          onFavoriteClick,
+          className: "mt-3 self-start rounded-full bg-muted p-1.5 text-foreground transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+        }
+      )
+    ] })
+  ] });
+  return /* @__PURE__ */ jsx(OptionalLink, { href, children: content });
+}
+function MinimalCard({
+  images = [],
+  title,
+  price,
+  tag,
+  href,
+  showFavorites = false,
+  onFavoriteClick,
+  className,
+  HeartIcon
+}) {
+  const content = /* @__PURE__ */ jsxs("div", { className: cn("enad-interactive group relative overflow-hidden rounded-[var(--enad-card-radius)]", className), children: [
+    images[0] ? /* @__PURE__ */ jsx("div", { className: "relative aspect-[4/5] bg-muted", children: /* @__PURE__ */ jsx("img", { src: images[0].src, alt: images[0].alt ?? title ?? "", loading: "lazy", className: "size-full object-cover transition-transform duration-[var(--enad-image-hover-duration)] group-hover:scale-[var(--enad-image-hover-scale)]" }) }) : /* @__PURE__ */ jsx(FallbackImage, {}),
+    tag && /* @__PURE__ */ jsx("span", { className: "absolute start-3 top-3 z-10 rounded-[var(--enad-card-radius)] bg-background/90 px-2 py-0.5 text-xs font-medium text-foreground", children: tag }),
+    showFavorites && /* @__PURE__ */ jsx(
+      FavoriteButton,
+      {
+        HeartIcon,
+        onFavoriteClick,
+        className: "absolute end-3 top-3 z-10 rounded-full bg-background/80 p-1.5 text-foreground transition-colors hover:bg-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+      }
+    ),
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "absolute inset-x-0 bottom-0 min-w-0 translate-y-full p-4 transition-transform duration-[var(--enad-motion-duration)] group-hover:translate-y-0",
+        style: { background: "linear-gradient(to top, color-mix(in oklch, var(--enad-overlay-color) calc(var(--enad-overlay-from-opacity) * 100%), transparent), transparent)" },
+        children: [
+          title && /* @__PURE__ */ jsx("p", { className: "line-clamp-2 text-sm font-medium text-white", children: title }),
+          price && /* @__PURE__ */ jsx("p", { className: "mt-0.5 text-sm text-white/80", children: price })
+        ]
+      }
+    )
+  ] });
+  return /* @__PURE__ */ jsx(OptionalLink, { href, radiusClass: "rounded-[var(--enad-card-radius)]", children: content });
+}
+function ListCard({
+  images = [],
+  title,
+  subtitle,
+  price,
+  href,
+  className
+}) {
+  const content = /* @__PURE__ */ jsxs(Card, { className: cn("flex overflow-hidden border-0 shadow-none", className), children: [
+    /* @__PURE__ */ jsx("div", { className: "w-32 shrink-0", children: images[0] ? /* @__PURE__ */ jsx("div", { className: "relative aspect-[4/5] bg-muted", children: /* @__PURE__ */ jsx("img", { src: images[0].src, alt: images[0].alt ?? title ?? "", loading: "lazy", className: "size-full object-cover" }) }) : /* @__PURE__ */ jsx(FallbackImage, {}) }),
+    /* @__PURE__ */ jsxs(CardContent, { className: "flex min-w-0 flex-col justify-center p-4", children: [
+      title && /* @__PURE__ */ jsx("p", { className: "line-clamp-2 text-sm font-medium text-foreground", children: title }),
+      subtitle && /* @__PURE__ */ jsx("p", { className: "mt-0.5 truncate text-sm text-muted-foreground", children: subtitle }),
+      price && /* @__PURE__ */ jsx("p", { className: "mt-1 text-sm font-medium text-foreground", children: price })
+    ] })
+  ] });
+  return /* @__PURE__ */ jsx(OptionalLink, { href, children: content });
+}
+function StrippedCard({
+  images = [],
+  title,
+  price,
+  href,
+  className
+}) {
+  const content = /* @__PURE__ */ jsxs("div", { className: cn("group min-w-0", className), children: [
+    /* @__PURE__ */ jsx("div", { className: "relative overflow-hidden", children: images[0] ? /* @__PURE__ */ jsx("div", { className: "relative aspect-[4/5] bg-muted", children: /* @__PURE__ */ jsx("img", { src: images[0].src, alt: images[0].alt ?? title ?? "", loading: "lazy", className: "size-full object-cover transition-transform duration-[var(--enad-image-hover-duration)] group-hover:scale-[var(--enad-image-hover-scale)]" }) }) : /* @__PURE__ */ jsx(FallbackImage, {}) }),
+    title && /* @__PURE__ */ jsx("p", { className: "mt-2 line-clamp-2 text-sm text-foreground", children: title }),
+    price && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: price })
+  ] });
+  return /* @__PURE__ */ jsx(OptionalLink, { href, children: content });
+}
+function GalleryCard({
+  images = [],
+  title,
+  subtitle,
+  price,
+  tag,
+  href,
+  showFavorites = false,
+  showPaginationDots = true,
+  onFavoriteClick,
+  className,
+  HeartIcon
+}) {
+  const imageElements = images.map((img, i) => /* @__PURE__ */ jsx("div", { className: "relative aspect-[4/5] bg-muted", children: /* @__PURE__ */ jsx(
+    "img",
+    {
+      src: img.src,
+      alt: img.alt ?? title ?? "",
+      loading: "lazy",
+      className: "size-full object-cover"
+    }
+  ) }, i));
+  const content = /* @__PURE__ */ jsxs(Card, { className: cn("enad-interactive group overflow-hidden border-0 shadow-none", className), children: [
+    /* @__PURE__ */ jsxs(CardHeader, { className: "relative p-0", children: [
+      /* @__PURE__ */ jsx(
+        GalleryImageArea,
+        {
+          imageElements,
+          fallback: /* @__PURE__ */ jsx(FallbackImage, {}),
+          showPaginationDots
+        }
+      ),
+      tag && /* @__PURE__ */ jsx("span", { className: "absolute start-3 top-3 rounded-[var(--enad-card-radius)] bg-background/90 px-2 py-0.5 text-xs font-medium text-foreground", children: tag }),
+      showFavorites && /* @__PURE__ */ jsx(
+        FavoriteButton,
+        {
+          HeartIcon,
+          onFavoriteClick,
+          className: "absolute end-3 top-3 rounded-full bg-background/80 p-1.5 text-foreground transition-colors hover:bg-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxs(CardFooter, { className: "flex min-w-0 flex-col items-start gap-0.5 p-3", children: [
+      title && /* @__PURE__ */ jsx("p", { className: "line-clamp-2 text-sm font-medium text-foreground", children: title }),
+      subtitle && /* @__PURE__ */ jsx("p", { className: "truncate text-sm text-muted-foreground", children: subtitle }),
+      price && /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-foreground", children: price })
+    ] })
+  ] });
+  return /* @__PURE__ */ jsx(OptionalLink, { href, children: content });
+}
+function ProductCard(props) {
+  const HeartIcon = useIcon("heart");
+  const layoutProps = { ...props, HeartIcon };
+  switch (props.layout ?? "gallery") {
+    case "horizontal":
+      return /* @__PURE__ */ jsx(HorizontalCard, { ...layoutProps });
+    case "minimal":
+      return /* @__PURE__ */ jsx(MinimalCard, { ...layoutProps });
+    case "list":
+      return /* @__PURE__ */ jsx(ListCard, { ...layoutProps });
+    case "stripped":
+      return /* @__PURE__ */ jsx(StrippedCard, { ...layoutProps });
+    default:
+      return /* @__PURE__ */ jsx(GalleryCard, { ...layoutProps });
+  }
+}
+export {
+  ProductCard
+};
+//# sourceMappingURL=product-card.mjs.map

package/dist/client/storefront/blocks/product-card.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/storefront/blocks/product-card.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { useIcon } from \"../../icons/icon-context\"\nimport { Card, CardContent, CardFooter, CardHeader } from \"../../ui-resolver/card\"\nimport { cn } from \"../../ui/utils\"\nimport { SwipeableCarousel } from \"../carousel/swipeable-carousel\"\nimport type { ProductCardProps } from \"../types\"\n\n/* ─── Shared helpers ─── */\n\ntype CardLayoutProps = ProductCardProps & {\n  HeartIcon: React.ComponentType<{ className?: string }>\n}\n\nfunction OptionalLink({\n  href,\n  radiusClass,\n  children,\n}: {\n  href?: string\n  radiusClass?: string\n  children: React.ReactNode\n}) {\n  if (!href) return children\n  return (\n    <a\n      href={href}\n      className={cn(\"block focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2\", radiusClass)}\n    >\n      {children}\n    </a>\n  )\n}\n\nfunction FallbackImage() {\n  return <div className=\"relative aspect-[4/5] bg-muted\" aria-hidden=\"true\" />\n}\n\nfunction FavoriteButton({\n  HeartIcon,\n  onFavoriteClick,\n  className,\n}: {\n  HeartIcon: React.ComponentType<{ className?: string }>\n  onFavoriteClick?: () => void\n  className: string\n}) {\n  return (\n    <button\n      type=\"button\"\n      onClick={(e) => {\n        e.preventDefault()\n        e.stopPropagation()\n        onFavoriteClick?.()\n      }}\n      className={className}\n      aria-label=\"Add to favorites\"\n    >\n      <HeartIcon className=\"size-4\" />\n    </button>\n  )\n}\n\n/* ─── Gallery image element helper ─── */\n\nfunction GalleryImageArea({\n  imageElements,\n  fallback,\n  showPaginationDots,\n}: {\n  imageElements: React.ReactNode[]\n  fallback: React.ReactNode\n  showPaginationDots: boolean\n}) {\n  if (imageElements.length > 1) {\n    return <SwipeableCarousel items={imageElements} showDots={showPaginationDots} />\n  }\n  if (imageElements.length === 1) {\n    return imageElements[0]\n  }\n  return fallback\n}\n\n/* ─── Horizontal layout ─── */\n\nfunction HorizontalCard({\n  images = [],\n  title,\n  subtitle,\n  price,\n  tag,\n  href,\n  showFavorites = false,\n  onFavoriteClick,\n  className,\n  HeartIcon,\n}: CardLayoutProps) {\n  const content = (\n    <Card className={cn(\"enad-interactive group flex overflow-hidden border-0 shadow-[var(--enad-card-shadow)] transition-shadow duration-[var(--enad-motion-duration)] hover:shadow-[var(--enad-card-hover-shadow)]\", className)}>\n      <div className=\"relative w-1/3 shrink-0\">\n        {images[0] ? (\n          <div className=\"relative aspect-[4/5] bg-muted\">\n            <img src={images[0].src} alt={images[0].alt ?? title ?? \"\"} loading=\"lazy\" className=\"size-full object-cover transition-transform duration-[var(--enad-image-hover-duration)] group-hover:scale-[var(--enad-image-hover-scale)]\" />\n          </div>\n        ) : <FallbackImage />}\n        {tag && (\n          <span className=\"absolute start-2 top-2 rounded-[var(--enad-card-radius)] bg-background/90 px-2 py-0.5 text-xs font-medium text-foreground\">\n            {tag}\n          </span>\n        )}\n      </div>\n      <CardContent className=\"flex min-w-0 flex-1 flex-col justify-center p-4 md:p-6\">\n        {title && <p className=\"line-clamp-2 text-base font-medium text-foreground\">{title}</p>}\n        {subtitle && <p className=\"mt-1 truncate text-sm text-muted-foreground\">{subtitle}</p>}\n        {price && <p className=\"mt-2 text-base font-medium text-foreground\">{price}</p>}\n        {showFavorites && (\n          <FavoriteButton\n            HeartIcon={HeartIcon}\n            onFavoriteClick={onFavoriteClick}\n            className=\"mt-3 self-start rounded-full bg-muted p-1.5 text-foreground transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n          />\n        )}\n      </CardContent>\n    </Card>\n  )\n  return <OptionalLink href={href}>{content}</OptionalLink>\n}\n\n/* ─── Minimal layout ─── */\n\nfunction MinimalCard({\n  images = [],\n  title,\n  price,\n  tag,\n  href,\n  showFavorites = false,\n  onFavoriteClick,\n  className,\n  HeartIcon,\n}: CardLayoutProps) {\n  const content = (\n    <div className={cn(\"enad-interactive group relative overflow-hidden rounded-[var(--enad-card-radius)]\", className)}>\n      {images[0] ? (\n        <div className=\"relative aspect-[4/5] bg-muted\">\n          <img src={images[0].src} alt={images[0].alt ?? title ?? \"\"} loading=\"lazy\" className=\"size-full object-cover transition-transform duration-[var(--enad-image-hover-duration)] group-hover:scale-[var(--enad-image-hover-scale)]\" />\n        </div>\n      ) : <FallbackImage />}\n\n      {tag && (\n        <span className=\"absolute start-3 top-3 z-10 rounded-[var(--enad-card-radius)] bg-background/90 px-2 py-0.5 text-xs font-medium text-foreground\">\n          {tag}\n        </span>\n      )}\n\n      {showFavorites && (\n        <FavoriteButton\n          HeartIcon={HeartIcon}\n          onFavoriteClick={onFavoriteClick}\n          className=\"absolute end-3 top-3 z-10 rounded-full bg-background/80 p-1.5 text-foreground transition-colors hover:bg-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n        />\n      )}\n\n      {/* Hover overlay with product info */}\n      <div\n        className=\"absolute inset-x-0 bottom-0 min-w-0 translate-y-full p-4 transition-transform duration-[var(--enad-motion-duration)] group-hover:translate-y-0\"\n        style={{ background: \"linear-gradient(to top, color-mix(in oklch, var(--enad-overlay-color) calc(var(--enad-overlay-from-opacity) * 100%), transparent), transparent)\" }}\n      >\n        {title && <p className=\"line-clamp-2 text-sm font-medium text-white\">{title}</p>}\n        {price && <p className=\"mt-0.5 text-sm text-white/80\">{price}</p>}\n      </div>\n    </div>\n  )\n  return <OptionalLink href={href} radiusClass=\"rounded-[var(--enad-card-radius)]\">{content}</OptionalLink>\n}\n\n/* ─── List layout ─── */\n\nfunction ListCard({\n  images = [],\n  title,\n  subtitle,\n  price,\n  href,\n  className,\n}: CardLayoutProps) {\n  const content = (\n    <Card className={cn(\"flex overflow-hidden border-0 shadow-none\", className)}>\n      <div className=\"w-32 shrink-0\">\n        {images[0] ? (\n          <div className=\"relative aspect-[4/5] bg-muted\">\n            <img src={images[0].src} alt={images[0].alt ?? title ?? \"\"} loading=\"lazy\" className=\"size-full object-cover\" />\n          </div>\n        ) : <FallbackImage />}\n      </div>\n      <CardContent className=\"flex min-w-0 flex-col justify-center p-4\">\n        {title && <p className=\"line-clamp-2 text-sm font-medium text-foreground\">{title}</p>}\n        {subtitle && <p className=\"mt-0.5 truncate text-sm text-muted-foreground\">{subtitle}</p>}\n        {price && <p className=\"mt-1 text-sm font-medium text-foreground\">{price}</p>}\n      </CardContent>\n    </Card>\n  )\n  return <OptionalLink href={href}>{content}</OptionalLink>\n}\n\n/* ─── Stripped layout ─── */\n\nfunction StrippedCard({\n  images = [],\n  title,\n  price,\n  href,\n  className,\n}: CardLayoutProps) {\n  const content = (\n    <div className={cn(\"group min-w-0\", className)}>\n      <div className=\"relative overflow-hidden\">\n        {images[0] ? (\n          <div className=\"relative aspect-[4/5] bg-muted\">\n            <img src={images[0].src} alt={images[0].alt ?? title ?? \"\"} loading=\"lazy\" className=\"size-full object-cover transition-transform duration-[var(--enad-image-hover-duration)] group-hover:scale-[var(--enad-image-hover-scale)]\" />\n          </div>\n        ) : <FallbackImage />}\n      </div>\n      {title && <p className=\"mt-2 line-clamp-2 text-sm text-foreground\">{title}</p>}\n      {price && <p className=\"text-sm text-muted-foreground\">{price}</p>}\n    </div>\n  )\n  return <OptionalLink href={href}>{content}</OptionalLink>\n}\n\n/* ─── Gallery layout (default) ─── */\n\nfunction GalleryCard({\n  images = [],\n  title,\n  subtitle,\n  price,\n  tag,\n  href,\n  showFavorites = false,\n  showPaginationDots = true,\n  onFavoriteClick,\n  className,\n  HeartIcon,\n}: CardLayoutProps) {\n  const imageElements = images.map((img, i) => (\n    <div key={i} className=\"relative aspect-[4/5] bg-muted\">\n      <img\n        src={img.src}\n        alt={img.alt ?? title ?? \"\"}\n        loading=\"lazy\"\n        className=\"size-full object-cover\"\n      />\n    </div>\n  ))\n\n  const content = (\n    <Card className={cn(\"enad-interactive group overflow-hidden border-0 shadow-none\", className)}>\n      <CardHeader className=\"relative p-0\">\n        <GalleryImageArea\n          imageElements={imageElements}\n          fallback={<FallbackImage />}\n          showPaginationDots={showPaginationDots}\n        />\n\n        {tag && (\n          <span className=\"absolute start-3 top-3 rounded-[var(--enad-card-radius)] bg-background/90 px-2 py-0.5 text-xs font-medium text-foreground\">\n            {tag}\n          </span>\n        )}\n\n        {showFavorites && (\n          <FavoriteButton\n            HeartIcon={HeartIcon}\n            onFavoriteClick={onFavoriteClick}\n            className=\"absolute end-3 top-3 rounded-full bg-background/80 p-1.5 text-foreground transition-colors hover:bg-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n          />\n        )}\n      </CardHeader>\n\n      <CardFooter className=\"flex min-w-0 flex-col items-start gap-0.5 p-3\">\n        {title && <p className=\"line-clamp-2 text-sm font-medium text-foreground\">{title}</p>}\n        {subtitle && <p className=\"truncate text-sm text-muted-foreground\">{subtitle}</p>}\n        {price && <p className=\"text-sm font-medium text-foreground\">{price}</p>}\n      </CardFooter>\n    </Card>\n  )\n  return <OptionalLink href={href}>{content}</OptionalLink>\n}\n\n/* ─── Main component (dispatcher) ─── */\n\nfunction ProductCard(props: ProductCardProps) {\n  const HeartIcon = useIcon(\"heart\")\n  const layoutProps: CardLayoutProps = { ...props, HeartIcon }\n\n  switch (props.layout ?? \"gallery\") {\n    case \"horizontal\":\n      return <HorizontalCard {...layoutProps} />\n    case \"minimal\":\n      return <MinimalCard {...layoutProps} />\n    case \"list\":\n      return <ListCard {...layoutProps} />\n    case \"stripped\":\n      return <StrippedCard {...layoutProps} />\n    default:\n      return <GalleryCard {...layoutProps} />\n  }\n}\n\nexport { ProductCard, type ProductCardProps }\n"],"mappings":"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","names":[]}

package/dist/client/storefront/blocks/product-image.d.ts

@@ -0,0 +1,4 @@
+import type { ProductImageProps } from "../types";
+declare function ProductImage({ images, aspectRatio, showZoom, arrows, showDots, showThumbnails, className, }: ProductImageProps): import("react/jsx-runtime").JSX.Element;
+export { ProductImage, type ProductImageProps };
+//# sourceMappingURL=product-image.d.ts.map

package/dist/client/storefront/blocks/product-image.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"product-image.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/blocks/product-image.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAWjD,iBAAS,YAAY,CAAC,EACpB,MAAM,EACN,WAAmB,EACnB,QAAgB,EAChB,MAAiB,EACjB,QAAe,EACf,cAAsB,EACtB,SAAS,GACV,EAAE,iBAAiB,2CAwFnB;AAED,OAAO,EAAE,YAAY,EAAE,KAAK,iBAAiB,EAAE,CAAA"}