@enadhq/enad-react-sdk 1.0.0 → 1.0.2

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":";AA0BI,cA0EE,YA1EF;AAvBJ,SAAS,eAAe;AACxB,SAAS,MAAM,aAAa,YAAY,kBAAkB;AAC1D,SAAS,UAAU;AACnB,SAAS,yBAAyB;AASlC,SAAS,aAAa;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AACF,GAIG;AACD,MAAI,CAAC,KAAM,QAAO;AAClB,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,WAAW,GAAG,6GAA6G,WAAW;AAAA,MAErI;AAAA;AAAA,EACH;AAEJ;AAEA,SAAS,gBAAgB;AACvB,SAAO,oBAAC,SAAI,WAAU,kCAAiC,eAAY,QAAO;AAC5E;AAEA,SAAS,eAAe;AAAA,EACtB;AAAA,EACA;AAAA,EACA;AACF,GAIG;AACD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,SAAS,CAAC,MAAM;AACd,UAAE,eAAe;AACjB,UAAE,gBAAgB;AAClB,0BAAkB;AAAA,MACpB;AAAA,MACA;AAAA,MACA,cAAW;AAAA,MAEX,8BAAC,aAAU,WAAU,UAAS;AAAA;AAAA,EAChC;AAEJ;AAIA,SAAS,iBAAiB;AAAA,EACxB;AAAA,EACA;AAAA,EACA;AACF,GAIG;AACD,MAAI,cAAc,SAAS,GAAG;AAC5B,WAAO,oBAAC,qBAAkB,OAAO,eAAe,UAAU,oBAAoB;AAAA,EAChF;AACA,MAAI,cAAc,WAAW,GAAG;AAC9B,WAAO,cAAc,CAAC;AAAA,EACxB;AACA,SAAO;AACT;AAIA,SAAS,eAAe;AAAA,EACtB,SAAS,CAAC;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AACF,GAAoB;AAClB,QAAM,UACJ,qBAAC,QAAK,WAAW,GAAG,+LAA+L,SAAS,GAC1N;AAAA,yBAAC,SAAI,WAAU,2BACZ;AAAA,aAAO,CAAC,IACP,oBAAC,SAAI,WAAU,kCACb,8BAAC,SAAI,KAAK,OAAO,CAAC,EAAE,KAAK,KAAK,OAAO,CAAC,EAAE,OAAO,SAAS,IAAI,SAAQ,QAAO,WAAU,6IAA4I,GACnO,IACE,oBAAC,iBAAc;AAAA,MAClB,OACC,oBAAC,UAAK,WAAU,6HACb,eACH;AAAA,OAEJ;AAAA,IACA,qBAAC,eAAY,WAAU,0DACpB;AAAA,eAAS,oBAAC,OAAE,WAAU,sDAAsD,iBAAM;AAAA,MAClF,YAAY,oBAAC,OAAE,WAAU,+CAA+C,oBAAS;AAAA,MACjF,SAAS,oBAAC,OAAE,WAAU,8CAA8C,iBAAM;AAAA,MAC1E,iBACC;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA,WAAU;AAAA;AAAA,MACZ;AAAA,OAEJ;AAAA,KACF;AAEF,SAAO,oBAAC,gBAAa,MAAa,mBAAQ;AAC5C;AAIA,SAAS,YAAY;AAAA,EACnB,SAAS,CAAC;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AACF,GAAoB;AAClB,QAAM,UACJ,qBAAC,SAAI,WAAW,GAAG,qFAAqF,SAAS,GAC9G;AAAA,WAAO,CAAC,IACP,oBAAC,SAAI,WAAU,kCACb,8BAAC,SAAI,KAAK,OAAO,CAAC,EAAE,KAAK,KAAK,OAAO,CAAC,EAAE,OAAO,SAAS,IAAI,SAAQ,QAAO,WAAU,6IAA4I,GACnO,IACE,oBAAC,iBAAc;AAAA,IAElB,OACC,oBAAC,UAAK,WAAU,kIACb,eACH;AAAA,IAGD,iBACC;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA,WAAU;AAAA;AAAA,IACZ;AAAA,IAIF;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,OAAO,EAAE,YAAY,kJAAkJ;AAAA,QAEtK;AAAA,mBAAS,oBAAC,OAAE,WAAU,+CAA+C,iBAAM;AAAA,UAC3E,SAAS,oBAAC,OAAE,WAAU,gCAAgC,iBAAM;AAAA;AAAA;AAAA,IAC/D;AAAA,KACF;AAEF,SAAO,oBAAC,gBAAa,MAAY,aAAY,qCAAqC,mBAAQ;AAC5F;AAIA,SAAS,SAAS;AAAA,EAChB,SAAS,CAAC;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAoB;AAClB,QAAM,UACJ,qBAAC,QAAK,WAAW,GAAG,6CAA6C,SAAS,GACxE;AAAA,wBAAC,SAAI,WAAU,iBACZ,iBAAO,CAAC,IACP,oBAAC,SAAI,WAAU,kCACb,8BAAC,SAAI,KAAK,OAAO,CAAC,EAAE,KAAK,KAAK,OAAO,CAAC,EAAE,OAAO,SAAS,IAAI,SAAQ,QAAO,WAAU,0BAAyB,GAChH,IACE,oBAAC,iBAAc,GACrB;AAAA,IACA,qBAAC,eAAY,WAAU,4CACpB;AAAA,eAAS,oBAAC,OAAE,WAAU,oDAAoD,iBAAM;AAAA,MAChF,YAAY,oBAAC,OAAE,WAAU,iDAAiD,oBAAS;AAAA,MACnF,SAAS,oBAAC,OAAE,WAAU,4CAA4C,iBAAM;AAAA,OAC3E;AAAA,KACF;AAEF,SAAO,oBAAC,gBAAa,MAAa,mBAAQ;AAC5C;AAIA,SAAS,aAAa;AAAA,EACpB,SAAS,CAAC;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAAoB;AAClB,QAAM,UACJ,qBAAC,SAAI,WAAW,GAAG,iBAAiB,SAAS,GAC3C;AAAA,wBAAC,SAAI,WAAU,4BACZ,iBAAO,CAAC,IACP,oBAAC,SAAI,WAAU,kCACb,8BAAC,SAAI,KAAK,OAAO,CAAC,EAAE,KAAK,KAAK,OAAO,CAAC,EAAE,OAAO,SAAS,IAAI,SAAQ,QAAO,WAAU,6IAA4I,GACnO,IACE,oBAAC,iBAAc,GACrB;AAAA,IACC,SAAS,oBAAC,OAAE,WAAU,6CAA6C,iBAAM;AAAA,IACzE,SAAS,oBAAC,OAAE,WAAU,iCAAiC,iBAAM;AAAA,KAChE;AAEF,SAAO,oBAAC,gBAAa,MAAa,mBAAQ;AAC5C;AAIA,SAAS,YAAY;AAAA,EACnB,SAAS,CAAC;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB;AAAA,EAChB,qBAAqB;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AACF,GAAoB;AAClB,QAAM,gBAAgB,OAAO,IAAI,CAAC,KAAK,MACrC,oBAAC,SAAY,WAAU,kCACrB;AAAA,IAAC;AAAA;AAAA,MACC,KAAK,IAAI;AAAA,MACT,KAAK,IAAI,OAAO,SAAS;AAAA,MACzB,SAAQ;AAAA,MACR,WAAU;AAAA;AAAA,EACZ,KANQ,CAOV,CACD;AAED,QAAM,UACJ,qBAAC,QAAK,WAAW,GAAG,+DAA+D,SAAS,GAC1F;AAAA,yBAAC,cAAW,WAAU,gBACpB;AAAA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,UAAU,oBAAC,iBAAc;AAAA,UACzB;AAAA;AAAA,MACF;AAAA,MAEC,OACC,oBAAC,UAAK,WAAU,6HACb,eACH;AAAA,MAGD,iBACC;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA,WAAU;AAAA;AAAA,MACZ;AAAA,OAEJ;AAAA,IAEA,qBAAC,cAAW,WAAU,iDACnB;AAAA,eAAS,oBAAC,OAAE,WAAU,oDAAoD,iBAAM;AAAA,MAChF,YAAY,oBAAC,OAAE,WAAU,0CAA0C,oBAAS;AAAA,MAC5E,SAAS,oBAAC,OAAE,WAAU,uCAAuC,iBAAM;AAAA,OACtE;AAAA,KACF;AAEF,SAAO,oBAAC,gBAAa,MAAa,mBAAQ;AAC5C;AAIA,SAAS,YAAY,OAAyB;AAC5C,QAAM,YAAY,QAAQ,OAAO;AACjC,QAAM,cAA+B,EAAE,GAAG,OAAO,UAAU;AAE3D,UAAQ,MAAM,UAAU,WAAW;AAAA,IACjC,KAAK;AACH,aAAO,oBAAC,kBAAgB,GAAG,aAAa;AAAA,IAC1C,KAAK;AACH,aAAO,oBAAC,eAAa,GAAG,aAAa;AAAA,IACvC,KAAK;AACH,aAAO,oBAAC,YAAU,GAAG,aAAa;AAAA,IACpC,KAAK;AACH,aAAO,oBAAC,gBAAc,GAAG,aAAa;AAAA,IACxC;AACE,aAAO,oBAAC,eAAa,GAAG,aAAa;AAAA,EACzC;AACF;","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"}

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

@@ -0,0 +1,109 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { cn } from "../../ui/utils";
+import { SwipeableCarousel } from "../carousel/swipeable-carousel";
+const aspectClasses = {
+  "1:1": "aspect-square",
+  "4:5": "aspect-[4/5]"
+};
+function getZoomLabel(zoomed) {
+  return zoomed ? "Zoom out" : "Zoom in";
+}
+function ProductImage({
+  images,
+  aspectRatio = "4:5",
+  showZoom = false,
+  arrows = "outset",
+  showDots = true,
+  showThumbnails = false,
+  className
+}) {
+  const [zoomed, setZoomed] = React.useState(false);
+  const [activeSlide, setActiveSlide] = React.useState(0);
+  const toggleZoom = () => {
+    if (showZoom) setZoomed((z) => !z);
+  };
+  const handleZoomKeyDown = (e) => {
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      toggleZoom();
+    }
+  };
+  const imageElements = images.map((img, i) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cn(
+        "relative overflow-hidden bg-muted",
+        aspectClasses[aspectRatio],
+        showZoom && (zoomed ? "cursor-zoom-out" : "cursor-zoom-in")
+      ),
+      ...showZoom && {
+        role: "button",
+        tabIndex: 0,
+        "aria-label": getZoomLabel(zoomed),
+        onClick: toggleZoom,
+        onKeyDown: handleZoomKeyDown
+      },
+      children: /* @__PURE__ */ jsx(
+        "img",
+        {
+          src: img.src,
+          alt: img.alt ?? "",
+          className: cn(
+            "size-full object-cover transition-transform duration-[var(--enad-image-hover-duration)]",
+            zoomed && "scale-150"
+          )
+        }
+      )
+    },
+    i
+  ));
+  if (images.length === 0) {
+    return /* @__PURE__ */ jsx("div", { className: cn("bg-muted", aspectClasses[aspectRatio], className) });
+  }
+  if (images.length === 1) {
+    return /* @__PURE__ */ jsx("div", { className, children: imageElements[0] });
+  }
+  const carousel = /* @__PURE__ */ jsx(
+    SwipeableCarousel,
+    {
+      items: imageElements,
+      arrows,
+      showDots,
+      activeSlide,
+      onSlideChange: setActiveSlide
+    }
+  );
+  if (showThumbnails && images.length > 1) {
+    return /* @__PURE__ */ jsxs("div", { className: cn("flex gap-3", className), children: [
+      /* @__PURE__ */ jsx("div", { className: "hidden md:flex flex-col gap-2 w-16 shrink-0", children: images.map((img, i) => /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          "aria-label": `View image ${i + 1}`,
+          onClick: () => setActiveSlide(i),
+          className: cn(
+            "relative aspect-square overflow-hidden rounded-[var(--enad-card-radius)] border-2 transition",
+            i === activeSlide ? "border-primary ring-1 ring-primary/30" : "border-transparent opacity-60 hover:opacity-100"
+          ),
+          children: /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: img.src,
+              alt: img.alt ?? "",
+              className: "size-full object-cover"
+            }
+          )
+        },
+        i
+      )) }),
+      /* @__PURE__ */ jsx("div", { className: "min-w-0 flex-1", children: carousel })
+    ] });
+  }
+  return /* @__PURE__ */ jsx("div", { className, children: carousel });
+}
+export {
+  ProductImage
+};
+//# sourceMappingURL=product-image.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/storefront/blocks/product-image.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { cn } from \"../../ui/utils\"\nimport { SwipeableCarousel } from \"../carousel/swipeable-carousel\"\nimport type { ProductImageProps } from \"../types\"\n\nconst aspectClasses: Record<string, string> = {\n  \"1:1\": \"aspect-square\",\n  \"4:5\": \"aspect-[4/5]\",\n}\n\nfunction getZoomLabel(zoomed: boolean): string {\n  return zoomed ? \"Zoom out\" : \"Zoom in\"\n}\n\nfunction ProductImage({\n  images,\n  aspectRatio = \"4:5\",\n  showZoom = false,\n  arrows = \"outset\",\n  showDots = true,\n  showThumbnails = false,\n  className,\n}: ProductImageProps) {\n  const [zoomed, setZoomed] = React.useState(false)\n  const [activeSlide, setActiveSlide] = React.useState(0)\n\n  const toggleZoom = () => {\n    if (showZoom) setZoomed((z) => !z)\n  }\n\n  const handleZoomKeyDown = (e: React.KeyboardEvent) => { if (e.key === \"Enter\" || e.key === \" \") { e.preventDefault(); toggleZoom() } }\n\n  const imageElements = images.map((img, i) => (\n    <div\n      key={i}\n      className={cn(\n        \"relative overflow-hidden bg-muted\",\n        aspectClasses[aspectRatio],\n        showZoom && (zoomed ? \"cursor-zoom-out\" : \"cursor-zoom-in\"),\n      )}\n      {...(showZoom && {\n        role: \"button\" as const,\n        tabIndex: 0,\n        \"aria-label\": getZoomLabel(zoomed),\n        onClick: toggleZoom,\n        onKeyDown: handleZoomKeyDown,\n      })}\n    >\n      <img\n        src={img.src}\n        alt={img.alt ?? \"\"}\n        className={cn(\n          \"size-full object-cover transition-transform duration-[var(--enad-image-hover-duration)]\",\n          zoomed && \"scale-150\",\n        )}\n      />\n    </div>\n  ))\n\n  if (images.length === 0) {\n    return (\n      <div className={cn(\"bg-muted\", aspectClasses[aspectRatio], className)} />\n    )\n  }\n\n  if (images.length === 1) {\n    return <div className={className}>{imageElements[0]}</div>\n  }\n\n  const carousel = (\n    <SwipeableCarousel\n      items={imageElements}\n      arrows={arrows}\n      showDots={showDots}\n      activeSlide={activeSlide}\n      onSlideChange={setActiveSlide}\n    />\n  )\n\n  if (showThumbnails && images.length > 1) {\n    return (\n      <div className={cn(\"flex gap-3\", className)}>\n        <div className=\"hidden md:flex flex-col gap-2 w-16 shrink-0\">\n          {images.map((img, i) => (\n            <button\n              key={i}\n              type=\"button\"\n              aria-label={`View image ${i + 1}`}\n              onClick={() => setActiveSlide(i)}\n              className={cn(\n                \"relative aspect-square overflow-hidden rounded-[var(--enad-card-radius)] border-2 transition\",\n                i === activeSlide\n                  ? \"border-primary ring-1 ring-primary/30\"\n                  : \"border-transparent opacity-60 hover:opacity-100\",\n              )}\n            >\n              <img\n                src={img.src}\n                alt={img.alt ?? \"\"}\n                className=\"size-full object-cover\"\n              />\n            </button>\n          ))}\n        </div>\n        <div className=\"min-w-0 flex-1\">{carousel}</div>\n      </div>\n    )\n  }\n\n  return <div className={className}>{carousel}</div>\n}\n\nexport { ProductImage, type ProductImageProps }\n"],"mappings":";AAkDM,cAiCA,YAjCA;AAhDN,YAAY,WAAW;AACvB,SAAS,UAAU;AACnB,SAAS,yBAAyB;AAGlC,MAAM,gBAAwC;AAAA,EAC5C,OAAO;AAAA,EACP,OAAO;AACT;AAEA,SAAS,aAAa,QAAyB;AAC7C,SAAO,SAAS,aAAa;AAC/B;AAEA,SAAS,aAAa;AAAA,EACpB;AAAA,EACA,cAAc;AAAA,EACd,WAAW;AAAA,EACX,SAAS;AAAA,EACT,WAAW;AAAA,EACX,iBAAiB;AAAA,EACjB;AACF,GAAsB;AACpB,QAAM,CAAC,QAAQ,SAAS,IAAI,MAAM,SAAS,KAAK;AAChD,QAAM,CAAC,aAAa,cAAc,IAAI,MAAM,SAAS,CAAC;AAEtD,QAAM,aAAa,MAAM;AACvB,QAAI,SAAU,WAAU,CAAC,MAAM,CAAC,CAAC;AAAA,EACnC;AAEA,QAAM,oBAAoB,CAAC,MAA2B;AAAE,QAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;AAAE,QAAE,eAAe;AAAG,iBAAW;AAAA,IAAE;AAAA,EAAE;AAErI,QAAM,gBAAgB,OAAO,IAAI,CAAC,KAAK,MACrC;AAAA,IAAC;AAAA;AAAA,MAEC,WAAW;AAAA,QACT;AAAA,QACA,cAAc,WAAW;AAAA,QACzB,aAAa,SAAS,oBAAoB;AAAA,MAC5C;AAAA,MACC,GAAI,YAAY;AAAA,QACf,MAAM;AAAA,QACN,UAAU;AAAA,QACV,cAAc,aAAa,MAAM;AAAA,QACjC,SAAS;AAAA,QACT,WAAW;AAAA,MACb;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,KAAK,IAAI;AAAA,UACT,KAAK,IAAI,OAAO;AAAA,UAChB,WAAW;AAAA,YACT;AAAA,YACA,UAAU;AAAA,UACZ;AAAA;AAAA,MACF;AAAA;AAAA,IArBK;AAAA,EAsBP,CACD;AAED,MAAI,OAAO,WAAW,GAAG;AACvB,WACE,oBAAC,SAAI,WAAW,GAAG,YAAY,cAAc,WAAW,GAAG,SAAS,GAAG;AAAA,EAE3E;AAEA,MAAI,OAAO,WAAW,GAAG;AACvB,WAAO,oBAAC,SAAI,WAAuB,wBAAc,CAAC,GAAE;AAAA,EACtD;AAEA,QAAM,WACJ;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAe;AAAA;AAAA,EACjB;AAGF,MAAI,kBAAkB,OAAO,SAAS,GAAG;AACvC,WACE,qBAAC,SAAI,WAAW,GAAG,cAAc,SAAS,GACxC;AAAA,0BAAC,SAAI,WAAU,+CACZ,iBAAO,IAAI,CAAC,KAAK,MAChB;AAAA,QAAC;AAAA;AAAA,UAEC,MAAK;AAAA,UACL,cAAY,cAAc,IAAI,CAAC;AAAA,UAC/B,SAAS,MAAM,eAAe,CAAC;AAAA,UAC/B,WAAW;AAAA,YACT;AAAA,YACA,MAAM,cACF,0CACA;AAAA,UACN;AAAA,UAEA;AAAA,YAAC;AAAA;AAAA,cACC,KAAK,IAAI;AAAA,cACT,KAAK,IAAI,OAAO;AAAA,cAChB,WAAU;AAAA;AAAA,UACZ;AAAA;AAAA,QAfK;AAAA,MAgBP,CACD,GACH;AAAA,MACA,oBAAC,SAAI,WAAU,kBAAkB,oBAAS;AAAA,OAC5C;AAAA,EAEJ;AAEA,SAAO,oBAAC,SAAI,WAAuB,oBAAS;AAC9C;","names":[]}

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

@@ -0,0 +1,4 @@
+import type { SpacerProps } from "../types";
+declare function Spacer({ size }: SpacerProps): import("react/jsx-runtime").JSX.Element;
+export { Spacer, type SpacerProps };
+//# sourceMappingURL=spacer.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"spacer.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/blocks/spacer.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAQ3C,iBAAS,MAAM,CAAC,EAAE,IAAW,EAAE,EAAE,WAAW,2CAE3C;AAED,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,CAAA"}

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

@@ -0,0 +1,14 @@
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../../ui/utils";
+const sizeClasses = {
+  sm: "py-2 md:py-3",
+  md: "py-4 md:py-6",
+  lg: "py-6 md:py-10"
+};
+function Spacer({ size = "md" }) {
+  return /* @__PURE__ */ jsx("div", { className: cn(sizeClasses[size]), "aria-hidden": "true" });
+}
+export {
+  Spacer
+};
+//# sourceMappingURL=spacer.mjs.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/client/storefront/blocks/spacer.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { cn } from \"../../ui/utils\"\nimport type { SpacerProps } from \"../types\"\n\nconst sizeClasses: Record<string, string> = {\n  sm: \"py-2 md:py-3\",\n  md: \"py-4 md:py-6\",\n  lg: \"py-6 md:py-10\",\n}\n\nfunction Spacer({ size = \"md\" }: SpacerProps) {\n  return <div className={cn(sizeClasses[size])} aria-hidden=\"true\" />\n}\n\nexport { Spacer, type SpacerProps }\n"],"mappings":"AAWS;AAVT,SAAS,UAAU;AAGnB,MAAM,cAAsC;AAAA,EAC1C,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN;AAEA,SAAS,OAAO,EAAE,OAAO,KAAK,GAAgB;AAC5C,SAAO,oBAAC,SAAI,WAAW,GAAG,YAAY,IAAI,CAAC,GAAG,eAAY,QAAO;AACnE;","names":[]}

package/dist/client/storefront/blocks/text-content-with-image.d.ts

@@ -0,0 +1,4 @@
+import { type TextContentWithImageProps } from "../types";
+declare function TextContentWithImage(props: TextContentWithImageProps): import("react/jsx-runtime").JSX.Element;
+export { TextContentWithImage, type TextContentWithImageProps };
+//# sourceMappingURL=text-content-with-image.d.ts.map

package/dist/client/storefront/blocks/text-content-with-image.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-content-with-image.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/blocks/text-content-with-image.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAkC,KAAK,yBAAyB,EAAE,MAAM,UAAU,CAAA;AAuVzF,iBAAS,oBAAoB,CAAC,KAAK,EAAE,yBAAyB,2CAe7D;AAED,OAAO,EAAE,oBAAoB,EAAE,KAAK,yBAAyB,EAAE,CAAA"}