@enadhq/enad-react-sdk 1.0.2 → 1.1.0

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

@@ -1,225 +1,218 @@
 "use client";
+import { cn } from "../../ui/utils.mjs";
+import { StorefrontButton } from "../primitives/button.mjs";
+import { StorefrontTextLink } from "../primitives/text-link.mjs";
+import { colorThemeClasses, isThemeDark } from "../types.mjs";
+import "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { cn } from "../../ui/utils";
-import { StorefrontButton } from "../primitives/button";
-import { StorefrontTextLink } from "../primitives/text-link";
-import { colorThemeClasses, isThemeDark } from "../types";
-function CTAElement({
-  buttonLabel,
-  buttonHref,
-  textLinkLabel,
-  textLinkHref,
-  dark
-}) {
-  if (!buttonLabel && !textLinkLabel) return null;
-  return /* @__PURE__ */ jsxs("div", { className: "mt-6 flex flex-wrap items-center gap-4", children: [
-    buttonLabel && buttonHref && /* @__PURE__ */ jsx(StorefrontButton, { href: buttonHref, variant: dark ? "outline" : "primary", children: buttonLabel }),
-    textLinkLabel && textLinkHref && /* @__PURE__ */ jsx(StorefrontTextLink, { href: textLinkHref, className: dark ? "text-white" : void 0, children: textLinkLabel })
-  ] });
+//#region src/client/storefront/blocks/text-content-with-image.tsx
+function CTAElement({ buttonLabel, buttonHref, textLinkLabel, textLinkHref, dark }) {
+	if (!buttonLabel && !textLinkLabel) return null;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "mt-6 flex flex-wrap items-center gap-4",
+		children: [buttonLabel && buttonHref && /* @__PURE__ */ jsx(StorefrontButton, {
+			href: buttonHref,
+			variant: dark ? "outline" : "primary",
+			children: buttonLabel
+		}), textLinkLabel && textLinkHref && /* @__PURE__ */ jsx(StorefrontTextLink, {
+			href: textLinkHref,
+			className: dark ? "text-white" : void 0,
+			children: textLinkLabel
+		})]
+	});
 }
-const headingStyle = { fontWeight: "var(--enad-heading-weight)", letterSpacing: "var(--enad-heading-tracking)", textTransform: "var(--enad-heading-transform)" };
-function TextBlockContent({
-  preheader,
-  heading,
-  body,
-  dark,
-  preheaderColor = dark ? "text-white/70" : "text-muted-foreground",
-  headingColor = dark ? "text-white" : "text-foreground",
-  bodyColor = dark ? "text-white/80" : "text-muted-foreground",
-  bodyMaxWidth = ""
-}) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    preheader && /* @__PURE__ */ jsx("p", { className: cn("mb-2 text-sm uppercase tracking-widest", preheaderColor), children: preheader }),
-    heading && /* @__PURE__ */ jsx(
-      "h2",
-      {
-        className: cn("text-2xl font-heading md:text-3xl", headingColor),
-        style: headingStyle,
-        children: heading
-      }
-    ),
-    body && /* @__PURE__ */ jsx("p", { className: cn("mt-4 text-base leading-relaxed", bodyColor, bodyMaxWidth), children: body })
-  ] });
+const headingStyle = {
+	fontWeight: "var(--enad-heading-weight)",
+	letterSpacing: "var(--enad-heading-tracking)",
+	textTransform: "var(--enad-heading-transform)"
+};
+function TextBlockContent({ preheader, heading, body, dark, preheaderColor = dark ? "text-white/70" : "text-muted-foreground", headingColor = dark ? "text-white" : "text-foreground", bodyColor = dark ? "text-white/80" : "text-muted-foreground", bodyMaxWidth = "" }) {
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		preheader && /* @__PURE__ */ jsx("p", {
+			className: cn("mb-2 text-sm uppercase tracking-widest", preheaderColor),
+			children: preheader
+		}),
+		heading && /* @__PURE__ */ jsx("h2", {
+			className: cn("text-2xl font-heading md:text-3xl", headingColor),
+			style: headingStyle,
+			children: heading
+		}),
+		body && /* @__PURE__ */ jsx("p", {
+			className: cn("mt-4 text-base leading-relaxed", bodyColor, bodyMaxWidth),
+			children: body
+		})
+	] });
 }
-function StackedVariant({
-  image,
-  fullWidth = false,
-  preheader,
-  heading,
-  body,
-  buttonLabel,
-  buttonHref,
-  textLinkLabel,
-  textLinkHref,
-  dark,
-  themeClasses,
-  className
-}) {
-  const hasImage = Boolean(image?.src);
-  return /* @__PURE__ */ jsx("section", { className: cn(themeClasses, className), children: /* @__PURE__ */ jsxs("div", { className: cn(fullWidth ? "" : "mx-auto max-w-7xl px-4 py-12 md:px-8"), children: [
-    hasImage && /* @__PURE__ */ jsx("div", { className: cn("relative overflow-hidden rounded-[var(--enad-image-radius)] bg-muted", "aspect-[16/9] w-full"), children: /* @__PURE__ */ jsx("img", { src: image?.src, alt: image?.alt ?? "", loading: "lazy", className: "size-full object-cover" }) }),
-    /* @__PURE__ */ jsxs("div", { className: cn("min-w-0 py-8", fullWidth && "px-8 lg:px-16"), children: [
-      /* @__PURE__ */ jsx(TextBlockContent, { preheader, heading, body, dark, bodyMaxWidth: "max-w-2xl" }),
-      /* @__PURE__ */ jsx(CTAElement, { buttonLabel, buttonHref, textLinkLabel, textLinkHref, dark })
-    ] })
-  ] }) });
+function StackedVariant({ image, fullWidth = false, preheader, heading, body, buttonLabel, buttonHref, textLinkLabel, textLinkHref, dark, themeClasses, className }) {
+	const hasImage = Boolean(image?.src);
+	return /* @__PURE__ */ jsx("section", {
+		className: cn(themeClasses, className),
+		children: /* @__PURE__ */ jsxs("div", {
+			className: cn(fullWidth ? "" : "mx-auto max-w-7xl px-4 py-12 md:px-8"),
+			children: [hasImage && /* @__PURE__ */ jsx("div", {
+				className: cn("relative overflow-hidden rounded-[var(--enad-image-radius)] bg-muted", "aspect-[16/9] w-full"),
+				children: /* @__PURE__ */ jsx("img", {
+					src: image?.src,
+					alt: image?.alt ?? "",
+					loading: "lazy",
+					className: "size-full object-cover"
+				})
+			}), /* @__PURE__ */ jsxs("div", {
+				className: cn("min-w-0 py-8", fullWidth && "px-8 lg:px-16"),
+				children: [/* @__PURE__ */ jsx(TextBlockContent, {
+					preheader,
+					heading,
+					body,
+					dark,
+					bodyMaxWidth: "max-w-2xl"
+				}), /* @__PURE__ */ jsx(CTAElement, {
+					buttonLabel,
+					buttonHref,
+					textLinkLabel,
+					textLinkHref,
+					dark
+				})]
+			})]
+		})
+	});
 }
-function OverlapCTA({
-  buttonLabel,
-  buttonHref,
-  textLinkLabel,
-  textLinkHref,
-  dark
-}) {
-  if (!buttonLabel && !textLinkLabel) return null;
-  return /* @__PURE__ */ jsxs("div", { className: "mt-6 flex flex-wrap items-center gap-4", children: [
-    buttonLabel && buttonHref && /* @__PURE__ */ jsx(StorefrontButton, { href: buttonHref, variant: dark ? "outline" : "primary", children: buttonLabel }),
-    textLinkLabel && textLinkHref && /* @__PURE__ */ jsx(StorefrontTextLink, { href: textLinkHref, className: dark ? "text-background" : void 0, children: textLinkLabel })
-  ] });
+function OverlapCTA({ buttonLabel, buttonHref, textLinkLabel, textLinkHref, dark }) {
+	if (!buttonLabel && !textLinkLabel) return null;
+	return /* @__PURE__ */ jsxs("div", {
+		className: "mt-6 flex flex-wrap items-center gap-4",
+		children: [buttonLabel && buttonHref && /* @__PURE__ */ jsx(StorefrontButton, {
+			href: buttonHref,
+			variant: dark ? "outline" : "primary",
+			children: buttonLabel
+		}), textLinkLabel && textLinkHref && /* @__PURE__ */ jsx(StorefrontTextLink, {
+			href: textLinkHref,
+			className: dark ? "text-background" : void 0,
+			children: textLinkLabel
+		})]
+	});
 }
-function OverlapTextCard({
-  preheader,
-  heading,
-  body,
-  buttonLabel,
-  buttonHref,
-  textLinkLabel,
-  textLinkHref,
-  dark,
-  hasImage,
-  overlapPositionClass
-}) {
-  return /* @__PURE__ */ jsxs("div", { className: cn(
-    "relative z-10 min-w-0 rounded-[var(--enad-card-radius)] shadow-[var(--enad-card-shadow)]",
-    hasImage ? "lg:w-2/5" : "w-full",
-    dark ? "bg-foreground text-background" : "bg-background",
-    "p-8 lg:p-10",
-    hasImage ? "-mt-16 mx-4 lg:mt-0 lg:mx-0" : "",
-    overlapPositionClass
-  ), children: [
-    /* @__PURE__ */ jsx(
-      TextBlockContent,
-      {
-        preheader,
-        heading,
-        body,
-        dark,
-        preheaderColor: dark ? "text-background/70" : "text-muted-foreground",
-        headingColor: dark ? "text-background" : "text-foreground",
-        bodyColor: dark ? "text-background/80" : "text-muted-foreground"
-      }
-    ),
-    /* @__PURE__ */ jsx(OverlapCTA, { buttonLabel, buttonHref, textLinkLabel, textLinkHref, dark })
-  ] });
+function OverlapTextCard({ preheader, heading, body, buttonLabel, buttonHref, textLinkLabel, textLinkHref, dark, hasImage, overlapPositionClass }) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("relative z-10 min-w-0 rounded-[var(--enad-card-radius)] shadow-[var(--enad-card-shadow)]", hasImage ? "lg:w-2/5" : "w-full", dark ? "bg-foreground text-background" : "bg-background", "p-8 lg:p-10", hasImage ? "-mt-16 mx-4 lg:mt-0 lg:mx-0" : "", overlapPositionClass),
+		children: [/* @__PURE__ */ jsx(TextBlockContent, {
+			preheader,
+			heading,
+			body,
+			dark,
+			preheaderColor: dark ? "text-background/70" : "text-muted-foreground",
+			headingColor: dark ? "text-background" : "text-foreground",
+			bodyColor: dark ? "text-background/80" : "text-muted-foreground"
+		}), /* @__PURE__ */ jsx(OverlapCTA, {
+			buttonLabel,
+			buttonHref,
+			textLinkLabel,
+			textLinkHref,
+			dark
+		})]
+	});
 }
-function OverlapVariant({
-  image,
-  imagePosition = "first",
-  preheader,
-  heading,
-  body,
-  buttonLabel,
-  buttonHref,
-  textLinkLabel,
-  textLinkHref,
-  dark,
-  themeClasses,
-  className
-}) {
-  const hasImage = Boolean(image?.src);
-  const overlapPositionClass = (() => {
-    if (!hasImage) return "";
-    if (imagePosition === "last") return "lg:order-1 lg:-me-16";
-    return "lg:-ms-16";
-  })();
-  return /* @__PURE__ */ jsx("section", { className: cn(themeClasses, className), children: /* @__PURE__ */ jsx("div", { className: "mx-auto max-w-7xl px-4 py-12 md:px-8", children: /* @__PURE__ */ jsxs("div", { className: cn("relative", hasImage && "lg:flex lg:items-center"), children: [
-    hasImage && /* @__PURE__ */ jsx("div", { className: cn(
-      "relative overflow-hidden rounded-[var(--enad-image-radius)] bg-muted lg:w-3/5",
-      imagePosition === "last" ? "lg:order-2" : ""
-    ), children: /* @__PURE__ */ jsx("div", { className: "aspect-[4/5] lg:aspect-[3/2]", children: /* @__PURE__ */ jsx("img", { src: image?.src, alt: image?.alt ?? "", loading: "lazy", className: "size-full object-cover" }) }) }),
-    /* @__PURE__ */ jsx(
-      OverlapTextCard,
-      {
-        preheader,
-        heading,
-        body,
-        buttonLabel,
-        buttonHref,
-        textLinkLabel,
-        textLinkHref,
-        dark,
-        hasImage,
-        overlapPositionClass
-      }
-    )
-  ] }) }) });
+function OverlapVariant({ image, imagePosition = "first", preheader, heading, body, buttonLabel, buttonHref, textLinkLabel, textLinkHref, dark, themeClasses, className }) {
+	const hasImage = Boolean(image?.src);
+	const overlapPositionClass = (() => {
+		if (!hasImage) return "";
+		if (imagePosition === "last") return "lg:order-1 lg:-me-16";
+		return "lg:-ms-16";
+	})();
+	return /* @__PURE__ */ jsx("section", {
+		className: cn(themeClasses, className),
+		children: /* @__PURE__ */ jsx("div", {
+			className: "mx-auto max-w-7xl px-4 py-12 md:px-8",
+			children: /* @__PURE__ */ jsxs("div", {
+				className: cn("relative", hasImage && "lg:flex lg:items-center"),
+				children: [hasImage && /* @__PURE__ */ jsx("div", {
+					className: cn("relative overflow-hidden rounded-[var(--enad-image-radius)] bg-muted lg:w-3/5", imagePosition === "last" ? "lg:order-2" : ""),
+					children: /* @__PURE__ */ jsx("div", {
+						className: "aspect-[4/5] lg:aspect-[3/2]",
+						children: /* @__PURE__ */ jsx("img", {
+							src: image?.src,
+							alt: image?.alt ?? "",
+							loading: "lazy",
+							className: "size-full object-cover"
+						})
+					})
+				}), /* @__PURE__ */ jsx(OverlapTextCard, {
+					preheader,
+					heading,
+					body,
+					buttonLabel,
+					buttonHref,
+					textLinkLabel,
+					textLinkHref,
+					dark,
+					hasImage,
+					overlapPositionClass
+				})]
+			})
+		})
+	});
 }
-function SideBySideContent({
-  hasImage,
-  imagePosition,
-  imageEl,
-  textEl
-}) {
-  if (!hasImage) return textEl;
-  if (imagePosition === "first") {
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
-      imageEl,
-      textEl
-    ] });
-  }
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    textEl,
-    imageEl
-  ] });
+function SideBySideContent({ hasImage, imagePosition, imageEl, textEl }) {
+	if (!hasImage) return textEl;
+	if (imagePosition === "first") return /* @__PURE__ */ jsxs(Fragment, { children: [imageEl, textEl] });
+	return /* @__PURE__ */ jsxs(Fragment, { children: [textEl, imageEl] });
 }
-function SideBySideVariant({
-  image,
-  imagePosition = "first",
-  fullWidth = false,
-  preheader,
-  heading,
-  body,
-  buttonLabel,
-  buttonHref,
-  textLinkLabel,
-  textLinkHref,
-  dark,
-  themeClasses,
-  className
-}) {
-  const hasImage = Boolean(image?.src);
-  const imageEl = hasImage ? /* @__PURE__ */ jsx("div", { className: cn("relative overflow-hidden rounded-[var(--enad-image-radius)] bg-muted", fullWidth ? "aspect-[4/5] lg:aspect-auto" : "aspect-[4/5]"), children: /* @__PURE__ */ jsx("img", { src: image?.src, alt: image?.alt ?? "", loading: "lazy", className: "size-full object-cover" }) }) : null;
-  const textEl = /* @__PURE__ */ jsxs("div", { className: cn("flex min-w-0 flex-col justify-center", fullWidth ? "px-8 py-12 lg:px-16 lg:py-20" : "py-8 lg:py-0"), children: [
-    /* @__PURE__ */ jsx(TextBlockContent, { preheader, heading, body, dark, bodyMaxWidth: "max-w-lg" }),
-    /* @__PURE__ */ jsx(CTAElement, { buttonLabel, buttonHref, textLinkLabel, textLinkHref, dark })
-  ] });
-  return /* @__PURE__ */ jsx("section", { className: cn(themeClasses, className), children: /* @__PURE__ */ jsx("div", { className: cn(
-    fullWidth ? cn("grid", hasImage && "lg:grid-cols-2") : cn("mx-auto grid max-w-7xl gap-8 px-4 py-12 md:px-8 lg:items-center lg:gap-12", hasImage && "lg:grid-cols-2")
-  ), children: /* @__PURE__ */ jsx(
-    SideBySideContent,
-    {
-      hasImage,
-      imagePosition,
-      imageEl,
-      textEl
-    }
-  ) }) });
+function SideBySideVariant({ image, imagePosition = "first", fullWidth = false, preheader, heading, body, buttonLabel, buttonHref, textLinkLabel, textLinkHref, dark, themeClasses, className }) {
+	const hasImage = Boolean(image?.src);
+	const imageEl = hasImage ? /* @__PURE__ */ jsx("div", {
+		className: cn("relative overflow-hidden rounded-[var(--enad-image-radius)] bg-muted", fullWidth ? "aspect-[4/5] lg:aspect-auto" : "aspect-[4/5]"),
+		children: /* @__PURE__ */ jsx("img", {
+			src: image?.src,
+			alt: image?.alt ?? "",
+			loading: "lazy",
+			className: "size-full object-cover"
+		})
+	}) : null;
+	const textEl = /* @__PURE__ */ jsxs("div", {
+		className: cn("flex min-w-0 flex-col justify-center", fullWidth ? "px-8 py-12 lg:px-16 lg:py-20" : "py-8 lg:py-0"),
+		children: [/* @__PURE__ */ jsx(TextBlockContent, {
+			preheader,
+			heading,
+			body,
+			dark,
+			bodyMaxWidth: "max-w-lg"
+		}), /* @__PURE__ */ jsx(CTAElement, {
+			buttonLabel,
+			buttonHref,
+			textLinkLabel,
+			textLinkHref,
+			dark
+		})]
+	});
+	return /* @__PURE__ */ jsx("section", {
+		className: cn(themeClasses, className),
+		children: /* @__PURE__ */ jsx("div", {
+			className: cn(fullWidth ? cn("grid", hasImage && "lg:grid-cols-2") : cn("mx-auto grid max-w-7xl gap-8 px-4 py-12 md:px-8 lg:items-center lg:gap-12", hasImage && "lg:grid-cols-2")),
+			children: /* @__PURE__ */ jsx(SideBySideContent, {
+				hasImage,
+				imagePosition,
+				imageEl,
+				textEl
+			})
+		})
+	});
 }
 function TextContentWithImage(props) {
-  const { variant = "side-by-side", colorTheme, className } = props;
-  const dark = isThemeDark(colorTheme);
-  const themeClasses = colorThemeClasses(colorTheme);
-  const variantProps = { ...props, dark, themeClasses, className };
-  switch (variant) {
-    case "stacked":
-      return /* @__PURE__ */ jsx(StackedVariant, { ...variantProps });
-    case "overlap":
-      return /* @__PURE__ */ jsx(OverlapVariant, { ...variantProps });
-    default:
-      return /* @__PURE__ */ jsx(SideBySideVariant, { ...variantProps });
-  }
+	const { variant = "side-by-side", colorTheme, className } = props;
+	const dark = isThemeDark(colorTheme);
+	const themeClasses = colorThemeClasses(colorTheme);
+	const variantProps = {
+		...props,
+		dark,
+		themeClasses,
+		className
+	};
+	switch (variant) {
+		case "stacked": return /* @__PURE__ */ jsx(StackedVariant, { ...variantProps });
+		case "overlap": return /* @__PURE__ */ jsx(OverlapVariant, { ...variantProps });
+		default: return /* @__PURE__ */ jsx(SideBySideVariant, { ...variantProps });
+	}
 }
-export {
-  TextContentWithImage
-};
+//#endregion
+export { TextContentWithImage };
+
 //# sourceMappingURL=text-content-with-image.mjs.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/client/storefront/blocks/text-content-with-image.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { cn } from \"../../ui/utils\"\nimport { StorefrontButton } from \"../primitives/button\"\nimport { StorefrontTextLink } from \"../primitives/text-link\"\nimport { colorThemeClasses, isThemeDark, type TextContentWithImageProps } from \"../types\"\n\n/* ─── Shared props for variant sub-components ─── */\n\ntype VariantProps = Omit<TextContentWithImageProps, \"variant\" | \"className\"> & {\n  dark: boolean\n  themeClasses: string\n  className?: string\n}\n\n/* ─── Shared CTA element builder ─── */\n\nfunction CTAElement({\n  buttonLabel,\n  buttonHref,\n  textLinkLabel,\n  textLinkHref,\n  dark,\n}: {\n  buttonLabel?: string\n  buttonHref?: string\n  textLinkLabel?: string\n  textLinkHref?: string\n  dark: boolean\n}) {\n  if (!buttonLabel && !textLinkLabel) return null\n  return (\n    <div className=\"mt-6 flex flex-wrap items-center gap-4\">\n      {buttonLabel && buttonHref && (\n        <StorefrontButton href={buttonHref} variant={dark ? \"outline\" : \"primary\"}>\n          {buttonLabel}\n        </StorefrontButton>\n      )}\n      {textLinkLabel && textLinkHref && (\n        <StorefrontTextLink href={textLinkHref} className={dark ? \"text-white\" : undefined}>\n          {textLinkLabel}\n        </StorefrontTextLink>\n      )}\n    </div>\n  )\n}\n\n/* ─── Heading style constant ─── */\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 text block (preheader + heading + body) ─── */\n\nfunction TextBlockContent({\n  preheader,\n  heading,\n  body,\n  dark,\n  preheaderColor = dark ? \"text-white/70\" : \"text-muted-foreground\",\n  headingColor = dark ? \"text-white\" : \"text-foreground\",\n  bodyColor = dark ? \"text-white/80\" : \"text-muted-foreground\",\n  bodyMaxWidth = \"\",\n}: {\n  preheader?: string\n  heading?: string\n  body?: string\n  dark: boolean\n  preheaderColor?: string\n  headingColor?: string\n  bodyColor?: string\n  bodyMaxWidth?: string\n}) {\n  return (\n    <>\n      {preheader && (\n        <p className={cn(\"mb-2 text-sm uppercase tracking-widest\", preheaderColor)}>\n          {preheader}\n        </p>\n      )}\n      {heading && (\n        <h2\n          className={cn(\"text-2xl font-heading md:text-3xl\", headingColor)}\n          style={headingStyle}\n        >\n          {heading}\n        </h2>\n      )}\n      {body && (\n        <p className={cn(\"mt-4 text-base leading-relaxed\", bodyColor, bodyMaxWidth)}>\n          {body}\n        </p>\n      )}\n    </>\n  )\n}\n\n/* ─── Stacked variant ─── */\n\nfunction StackedVariant({\n  image,\n  fullWidth = false,\n  preheader,\n  heading,\n  body,\n  buttonLabel,\n  buttonHref,\n  textLinkLabel,\n  textLinkHref,\n  dark,\n  themeClasses,\n  className,\n}: VariantProps) {\n  const hasImage = Boolean(image?.src)\n\n  return (\n    <section className={cn(themeClasses, className)}>\n      <div className={cn(fullWidth ? \"\" : \"mx-auto max-w-7xl px-4 py-12 md:px-8\")}>\n        {hasImage && (\n          <div className={cn(\"relative overflow-hidden rounded-[var(--enad-image-radius)] bg-muted\", \"aspect-[16/9] w-full\")}>\n            <img src={image?.src} alt={image?.alt ?? \"\"} loading=\"lazy\" className=\"size-full object-cover\" />\n          </div>\n        )}\n        <div className={cn(\"min-w-0 py-8\", fullWidth && \"px-8 lg:px-16\")}>\n          <TextBlockContent preheader={preheader} heading={heading} body={body} dark={dark} bodyMaxWidth=\"max-w-2xl\" />\n          <CTAElement buttonLabel={buttonLabel} buttonHref={buttonHref} textLinkLabel={textLinkLabel} textLinkHref={textLinkHref} dark={dark} />\n        </div>\n      </div>\n    </section>\n  )\n}\n\n/* ─── Overlap text card (extracted to reduce complexity) ─── */\n\nfunction OverlapCTA({\n  buttonLabel,\n  buttonHref,\n  textLinkLabel,\n  textLinkHref,\n  dark,\n}: {\n  buttonLabel?: string\n  buttonHref?: string\n  textLinkLabel?: string\n  textLinkHref?: string\n  dark: boolean\n}) {\n  if (!buttonLabel && !textLinkLabel) return null\n  return (\n    <div className=\"mt-6 flex flex-wrap items-center gap-4\">\n      {buttonLabel && buttonHref && (\n        <StorefrontButton href={buttonHref} variant={dark ? \"outline\" : \"primary\"}>\n          {buttonLabel}\n        </StorefrontButton>\n      )}\n      {textLinkLabel && textLinkHref && (\n        <StorefrontTextLink href={textLinkHref} className={dark ? \"text-background\" : undefined}>\n          {textLinkLabel}\n        </StorefrontTextLink>\n      )}\n    </div>\n  )\n}\n\nfunction OverlapTextCard({\n  preheader,\n  heading,\n  body,\n  buttonLabel,\n  buttonHref,\n  textLinkLabel,\n  textLinkHref,\n  dark,\n  hasImage,\n  overlapPositionClass,\n}: {\n  preheader?: string\n  heading?: string\n  body?: string\n  buttonLabel?: string\n  buttonHref?: string\n  textLinkLabel?: string\n  textLinkHref?: string\n  dark: boolean\n  hasImage: boolean\n  overlapPositionClass: string\n}) {\n  return (\n    <div className={cn(\n      \"relative z-10 min-w-0 rounded-[var(--enad-card-radius)] shadow-[var(--enad-card-shadow)]\",\n      hasImage ? \"lg:w-2/5\" : \"w-full\",\n      dark ? \"bg-foreground text-background\" : \"bg-background\",\n      \"p-8 lg:p-10\",\n      hasImage ? \"-mt-16 mx-4 lg:mt-0 lg:mx-0\" : \"\",\n      overlapPositionClass,\n    )}>\n      <TextBlockContent\n        preheader={preheader}\n        heading={heading}\n        body={body}\n        dark={dark}\n        preheaderColor={dark ? \"text-background/70\" : \"text-muted-foreground\"}\n        headingColor={dark ? \"text-background\" : \"text-foreground\"}\n        bodyColor={dark ? \"text-background/80\" : \"text-muted-foreground\"}\n      />\n      <OverlapCTA buttonLabel={buttonLabel} buttonHref={buttonHref} textLinkLabel={textLinkLabel} textLinkHref={textLinkHref} dark={dark} />\n    </div>\n  )\n}\n\n/* ─── Overlap variant ─── */\n\nfunction OverlapVariant({\n  image,\n  imagePosition = \"first\",\n  preheader,\n  heading,\n  body,\n  buttonLabel,\n  buttonHref,\n  textLinkLabel,\n  textLinkHref,\n  dark,\n  themeClasses,\n  className,\n}: VariantProps) {\n  const hasImage = Boolean(image?.src)\n\n  const overlapPositionClass = (() => {\n    if (!hasImage) return \"\"\n    if (imagePosition === \"last\") return \"lg:order-1 lg:-me-16\"\n    return \"lg:-ms-16\"\n  })()\n\n  return (\n    <section className={cn(themeClasses, className)}>\n      <div className=\"mx-auto max-w-7xl px-4 py-12 md:px-8\">\n        <div className={cn(\"relative\", hasImage && \"lg:flex lg:items-center\")}>\n          {hasImage && (\n            <div className={cn(\n              \"relative overflow-hidden rounded-[var(--enad-image-radius)] bg-muted lg:w-3/5\",\n              imagePosition === \"last\" ? \"lg:order-2\" : \"\",\n            )}>\n              <div className=\"aspect-[4/5] lg:aspect-[3/2]\">\n                <img src={image?.src} alt={image?.alt ?? \"\"} loading=\"lazy\" className=\"size-full object-cover\" />\n              </div>\n            </div>\n          )}\n\n          <OverlapTextCard\n            preheader={preheader}\n            heading={heading}\n            body={body}\n            buttonLabel={buttonLabel}\n            buttonHref={buttonHref}\n            textLinkLabel={textLinkLabel}\n            textLinkHref={textLinkHref}\n            dark={dark}\n            hasImage={hasImage}\n            overlapPositionClass={overlapPositionClass}\n          />\n        </div>\n      </div>\n    </section>\n  )\n}\n\n/* ─── Side-by-side content ordering helper ─── */\n\nfunction SideBySideContent({\n  hasImage,\n  imagePosition,\n  imageEl,\n  textEl,\n}: {\n  hasImage: boolean\n  imagePosition: string\n  imageEl: React.ReactNode\n  textEl: React.ReactNode\n}) {\n  if (!hasImage) return textEl\n  if (imagePosition === \"first\") {\n    return (\n      <>\n        {imageEl}\n        {textEl}\n      </>\n    )\n  }\n  return (\n    <>\n      {textEl}\n      {imageEl}\n    </>\n  )\n}\n\n/* ─── Side-by-side variant ─── */\n\nfunction SideBySideVariant({\n  image,\n  imagePosition = \"first\",\n  fullWidth = false,\n  preheader,\n  heading,\n  body,\n  buttonLabel,\n  buttonHref,\n  textLinkLabel,\n  textLinkHref,\n  dark,\n  themeClasses,\n  className,\n}: VariantProps) {\n  const hasImage = Boolean(image?.src)\n\n  const imageEl = hasImage ? (\n    <div className={cn(\"relative overflow-hidden rounded-[var(--enad-image-radius)] bg-muted\", fullWidth ? \"aspect-[4/5] lg:aspect-auto\" : \"aspect-[4/5]\")}>\n      <img src={image?.src} alt={image?.alt ?? \"\"} loading=\"lazy\" className=\"size-full object-cover\" />\n    </div>\n  ) : null\n\n  const textEl = (\n    <div className={cn(\"flex min-w-0 flex-col justify-center\", fullWidth ? \"px-8 py-12 lg:px-16 lg:py-20\" : \"py-8 lg:py-0\")}>\n      <TextBlockContent preheader={preheader} heading={heading} body={body} dark={dark} bodyMaxWidth=\"max-w-lg\" />\n      <CTAElement buttonLabel={buttonLabel} buttonHref={buttonHref} textLinkLabel={textLinkLabel} textLinkHref={textLinkHref} dark={dark} />\n    </div>\n  )\n\n  return (\n    <section className={cn(themeClasses, className)}>\n      <div className={cn(\n        fullWidth\n          ? cn(\"grid\", hasImage && \"lg:grid-cols-2\")\n          : cn(\"mx-auto grid max-w-7xl gap-8 px-4 py-12 md:px-8 lg:items-center lg:gap-12\", hasImage && \"lg:grid-cols-2\"),\n      )}>\n        <SideBySideContent\n          hasImage={hasImage}\n          imagePosition={imagePosition}\n          imageEl={imageEl}\n          textEl={textEl}\n        />\n      </div>\n    </section>\n  )\n}\n\n/* ─── Main component ─── */\n\nfunction TextContentWithImage(props: TextContentWithImageProps) {\n  const { variant = \"side-by-side\", colorTheme, className } = props\n  const dark = isThemeDark(colorTheme)\n  const themeClasses = colorThemeClasses(colorTheme)\n\n  const variantProps: VariantProps = { ...props, dark, themeClasses, className }\n\n  switch (variant) {\n    case \"stacked\":\n      return <StackedVariant {...variantProps} />\n    case \"overlap\":\n      return <OverlapVariant {...variantProps} />\n    default:\n      return <SideBySideVariant {...variantProps} />\n  }\n}\n\nexport { TextContentWithImage, type TextContentWithImageProps }\n"],"mappings":"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","names":[]}
+{"version":3,"file":"text-content-with-image.mjs","names":[],"sources":["../../../../src/client/storefront/blocks/text-content-with-image.tsx"],"sourcesContent":["\"use client\"\n\nimport * as React from \"react\"\nimport { cn } from \"../../ui/utils\"\nimport { StorefrontButton } from \"../primitives/button\"\nimport { StorefrontTextLink } from \"../primitives/text-link\"\nimport { colorThemeClasses, isThemeDark, type TextContentWithImageProps } from \"../types\"\n\n/* ─── Shared props for variant sub-components ─── */\n\ntype VariantProps = Omit<TextContentWithImageProps, \"variant\" | \"className\"> & {\n  dark: boolean\n  themeClasses: string\n  className?: string\n}\n\n/* ─── Shared CTA element builder ─── */\n\nfunction CTAElement({\n  buttonLabel,\n  buttonHref,\n  textLinkLabel,\n  textLinkHref,\n  dark,\n}: {\n  buttonLabel?: string\n  buttonHref?: string\n  textLinkLabel?: string\n  textLinkHref?: string\n  dark: boolean\n}) {\n  if (!buttonLabel && !textLinkLabel) return null\n  return (\n    <div className=\"mt-6 flex flex-wrap items-center gap-4\">\n      {buttonLabel && buttonHref && (\n        <StorefrontButton href={buttonHref} variant={dark ? \"outline\" : \"primary\"}>\n          {buttonLabel}\n        </StorefrontButton>\n      )}\n      {textLinkLabel && textLinkHref && (\n        <StorefrontTextLink href={textLinkHref} className={dark ? \"text-white\" : undefined}>\n          {textLinkLabel}\n        </StorefrontTextLink>\n      )}\n    </div>\n  )\n}\n\n/* ─── Heading style constant ─── */\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 text block (preheader + heading + body) ─── */\n\nfunction TextBlockContent({\n  preheader,\n  heading,\n  body,\n  dark,\n  preheaderColor = dark ? \"text-white/70\" : \"text-muted-foreground\",\n  headingColor = dark ? \"text-white\" : \"text-foreground\",\n  bodyColor = dark ? \"text-white/80\" : \"text-muted-foreground\",\n  bodyMaxWidth = \"\",\n}: {\n  preheader?: string\n  heading?: string\n  body?: string\n  dark: boolean\n  preheaderColor?: string\n  headingColor?: string\n  bodyColor?: string\n  bodyMaxWidth?: string\n}) {\n  return (\n    <>\n      {preheader && (\n        <p className={cn(\"mb-2 text-sm uppercase tracking-widest\", preheaderColor)}>\n          {preheader}\n        </p>\n      )}\n      {heading && (\n        <h2\n          className={cn(\"text-2xl font-heading md:text-3xl\", headingColor)}\n          style={headingStyle}\n        >\n          {heading}\n        </h2>\n      )}\n      {body && (\n        <p className={cn(\"mt-4 text-base leading-relaxed\", bodyColor, bodyMaxWidth)}>\n          {body}\n        </p>\n      )}\n    </>\n  )\n}\n\n/* ─── Stacked variant ─── */\n\nfunction StackedVariant({\n  image,\n  fullWidth = false,\n  preheader,\n  heading,\n  body,\n  buttonLabel,\n  buttonHref,\n  textLinkLabel,\n  textLinkHref,\n  dark,\n  themeClasses,\n  className,\n}: VariantProps) {\n  const hasImage = Boolean(image?.src)\n\n  return (\n    <section className={cn(themeClasses, className)}>\n      <div className={cn(fullWidth ? \"\" : \"mx-auto max-w-7xl px-4 py-12 md:px-8\")}>\n        {hasImage && (\n          <div className={cn(\"relative overflow-hidden rounded-[var(--enad-image-radius)] bg-muted\", \"aspect-[16/9] w-full\")}>\n            <img src={image?.src} alt={image?.alt ?? \"\"} loading=\"lazy\" className=\"size-full object-cover\" />\n          </div>\n        )}\n        <div className={cn(\"min-w-0 py-8\", fullWidth && \"px-8 lg:px-16\")}>\n          <TextBlockContent preheader={preheader} heading={heading} body={body} dark={dark} bodyMaxWidth=\"max-w-2xl\" />\n          <CTAElement buttonLabel={buttonLabel} buttonHref={buttonHref} textLinkLabel={textLinkLabel} textLinkHref={textLinkHref} dark={dark} />\n        </div>\n      </div>\n    </section>\n  )\n}\n\n/* ─── Overlap text card (extracted to reduce complexity) ─── */\n\nfunction OverlapCTA({\n  buttonLabel,\n  buttonHref,\n  textLinkLabel,\n  textLinkHref,\n  dark,\n}: {\n  buttonLabel?: string\n  buttonHref?: string\n  textLinkLabel?: string\n  textLinkHref?: string\n  dark: boolean\n}) {\n  if (!buttonLabel && !textLinkLabel) return null\n  return (\n    <div className=\"mt-6 flex flex-wrap items-center gap-4\">\n      {buttonLabel && buttonHref && (\n        <StorefrontButton href={buttonHref} variant={dark ? \"outline\" : \"primary\"}>\n          {buttonLabel}\n        </StorefrontButton>\n      )}\n      {textLinkLabel && textLinkHref && (\n        <StorefrontTextLink href={textLinkHref} className={dark ? \"text-background\" : undefined}>\n          {textLinkLabel}\n        </StorefrontTextLink>\n      )}\n    </div>\n  )\n}\n\nfunction OverlapTextCard({\n  preheader,\n  heading,\n  body,\n  buttonLabel,\n  buttonHref,\n  textLinkLabel,\n  textLinkHref,\n  dark,\n  hasImage,\n  overlapPositionClass,\n}: {\n  preheader?: string\n  heading?: string\n  body?: string\n  buttonLabel?: string\n  buttonHref?: string\n  textLinkLabel?: string\n  textLinkHref?: string\n  dark: boolean\n  hasImage: boolean\n  overlapPositionClass: string\n}) {\n  return (\n    <div className={cn(\n      \"relative z-10 min-w-0 rounded-[var(--enad-card-radius)] shadow-[var(--enad-card-shadow)]\",\n      hasImage ? \"lg:w-2/5\" : \"w-full\",\n      dark ? \"bg-foreground text-background\" : \"bg-background\",\n      \"p-8 lg:p-10\",\n      hasImage ? \"-mt-16 mx-4 lg:mt-0 lg:mx-0\" : \"\",\n      overlapPositionClass,\n    )}>\n      <TextBlockContent\n        preheader={preheader}\n        heading={heading}\n        body={body}\n        dark={dark}\n        preheaderColor={dark ? \"text-background/70\" : \"text-muted-foreground\"}\n        headingColor={dark ? \"text-background\" : \"text-foreground\"}\n        bodyColor={dark ? \"text-background/80\" : \"text-muted-foreground\"}\n      />\n      <OverlapCTA buttonLabel={buttonLabel} buttonHref={buttonHref} textLinkLabel={textLinkLabel} textLinkHref={textLinkHref} dark={dark} />\n    </div>\n  )\n}\n\n/* ─── Overlap variant ─── */\n\nfunction OverlapVariant({\n  image,\n  imagePosition = \"first\",\n  preheader,\n  heading,\n  body,\n  buttonLabel,\n  buttonHref,\n  textLinkLabel,\n  textLinkHref,\n  dark,\n  themeClasses,\n  className,\n}: VariantProps) {\n  const hasImage = Boolean(image?.src)\n\n  const overlapPositionClass = (() => {\n    if (!hasImage) return \"\"\n    if (imagePosition === \"last\") return \"lg:order-1 lg:-me-16\"\n    return \"lg:-ms-16\"\n  })()\n\n  return (\n    <section className={cn(themeClasses, className)}>\n      <div className=\"mx-auto max-w-7xl px-4 py-12 md:px-8\">\n        <div className={cn(\"relative\", hasImage && \"lg:flex lg:items-center\")}>\n          {hasImage && (\n            <div className={cn(\n              \"relative overflow-hidden rounded-[var(--enad-image-radius)] bg-muted lg:w-3/5\",\n              imagePosition === \"last\" ? \"lg:order-2\" : \"\",\n            )}>\n              <div className=\"aspect-[4/5] lg:aspect-[3/2]\">\n                <img src={image?.src} alt={image?.alt ?? \"\"} loading=\"lazy\" className=\"size-full object-cover\" />\n              </div>\n            </div>\n          )}\n\n          <OverlapTextCard\n            preheader={preheader}\n            heading={heading}\n            body={body}\n            buttonLabel={buttonLabel}\n            buttonHref={buttonHref}\n            textLinkLabel={textLinkLabel}\n            textLinkHref={textLinkHref}\n            dark={dark}\n            hasImage={hasImage}\n            overlapPositionClass={overlapPositionClass}\n          />\n        </div>\n      </div>\n    </section>\n  )\n}\n\n/* ─── Side-by-side content ordering helper ─── */\n\nfunction SideBySideContent({\n  hasImage,\n  imagePosition,\n  imageEl,\n  textEl,\n}: {\n  hasImage: boolean\n  imagePosition: string\n  imageEl: React.ReactNode\n  textEl: React.ReactNode\n}) {\n  if (!hasImage) return textEl\n  if (imagePosition === \"first\") {\n    return (\n      <>\n        {imageEl}\n        {textEl}\n      </>\n    )\n  }\n  return (\n    <>\n      {textEl}\n      {imageEl}\n    </>\n  )\n}\n\n/* ─── Side-by-side variant ─── */\n\nfunction SideBySideVariant({\n  image,\n  imagePosition = \"first\",\n  fullWidth = false,\n  preheader,\n  heading,\n  body,\n  buttonLabel,\n  buttonHref,\n  textLinkLabel,\n  textLinkHref,\n  dark,\n  themeClasses,\n  className,\n}: VariantProps) {\n  const hasImage = Boolean(image?.src)\n\n  const imageEl = hasImage ? (\n    <div className={cn(\"relative overflow-hidden rounded-[var(--enad-image-radius)] bg-muted\", fullWidth ? \"aspect-[4/5] lg:aspect-auto\" : \"aspect-[4/5]\")}>\n      <img src={image?.src} alt={image?.alt ?? \"\"} loading=\"lazy\" className=\"size-full object-cover\" />\n    </div>\n  ) : null\n\n  const textEl = (\n    <div className={cn(\"flex min-w-0 flex-col justify-center\", fullWidth ? \"px-8 py-12 lg:px-16 lg:py-20\" : \"py-8 lg:py-0\")}>\n      <TextBlockContent preheader={preheader} heading={heading} body={body} dark={dark} bodyMaxWidth=\"max-w-lg\" />\n      <CTAElement buttonLabel={buttonLabel} buttonHref={buttonHref} textLinkLabel={textLinkLabel} textLinkHref={textLinkHref} dark={dark} />\n    </div>\n  )\n\n  return (\n    <section className={cn(themeClasses, className)}>\n      <div className={cn(\n        fullWidth\n          ? cn(\"grid\", hasImage && \"lg:grid-cols-2\")\n          : cn(\"mx-auto grid max-w-7xl gap-8 px-4 py-12 md:px-8 lg:items-center lg:gap-12\", hasImage && \"lg:grid-cols-2\"),\n      )}>\n        <SideBySideContent\n          hasImage={hasImage}\n          imagePosition={imagePosition}\n          imageEl={imageEl}\n          textEl={textEl}\n        />\n      </div>\n    </section>\n  )\n}\n\n/* ─── Main component ─── */\n\nfunction TextContentWithImage(props: TextContentWithImageProps) {\n  const { variant = \"side-by-side\", colorTheme, className } = props\n  const dark = isThemeDark(colorTheme)\n  const themeClasses = colorThemeClasses(colorTheme)\n\n  const variantProps: VariantProps = { ...props, dark, themeClasses, className }\n\n  switch (variant) {\n    case \"stacked\":\n      return <StackedVariant {...variantProps} />\n    case \"overlap\":\n      return <OverlapVariant {...variantProps} />\n    default:\n      return <SideBySideVariant {...variantProps} />\n  }\n}\n\nexport { TextContentWithImage, type TextContentWithImageProps }\n"],"mappings":"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"}

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

@@ -1,4 +1,8 @@
-import { type TextContentProps } from "../types";
-declare function TextContent(props: TextContentProps): import("react/jsx-runtime").JSX.Element | null;
+import { TextContentProps } from "../types.js";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/client/storefront/blocks/text-content.d.ts
+declare function TextContent(props: TextContentProps): react_jsx_runtime0.JSX.Element | null;
+//#endregion
 export { TextContent, type TextContentProps };
 //# sourceMappingURL=text-content.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"text-content.d.ts","sourceRoot":"","sources":["../../../../src/client/storefront/blocks/text-content.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAkC,KAAK,gBAAgB,EAAE,MAAM,UAAU,CAAA;AA+MhF,iBAAS,WAAW,CAAC,KAAK,EAAE,gBAAgB,kDAkB3C;AAED,OAAO,EAAE,WAAW,EAAE,KAAK,gBAAgB,EAAE,CAAA"}
+{"version":3,"file":"text-content.d.ts","names":[],"sources":["../../../../src/client/storefront/blocks/text-content.tsx"],"mappings":";;;;iBAqNS,WAAA,CAAY,KAAA,EAAO,gBAAA,GAAgB,kBAAA,CAAA,GAAA,CAAA,OAAA"}