@sprintup-cms/sdk 1.8.69 → 1.8.71

package/dist/react/index.js

@@ -54,11 +54,15 @@ function ImageBlock({ block }) {
 }
 function HeroBlock({ block }) {
   const d = getData(block);
-  return /* @__PURE__ */ jsx("section", { className: "py-12 md:py-20", children: /* @__PURE__ */ jsxs("div", { className: "max-w-3xl", children: [
-    d.badge && /* @__PURE__ */ jsx("span", { className: "inline-block px-3 py-1 text-xs font-semibold rounded-full bg-secondary text-secondary-foreground mb-4", children: d.badge }),
-    /* @__PURE__ */ jsx("h1", { className: "text-4xl md:text-5xl font-bold tracking-tight mb-4 text-balance", children: d.title }),
-    d.subtitle && /* @__PURE__ */ jsx("p", { className: "text-xl text-muted-foreground mb-8", children: d.subtitle }),
-    (d.primaryButton || d.cta) && /* @__PURE__ */ jsxs("div", { className: "flex gap-4 flex-wrap", children: [
+  const align = d.alignment || "left";
+  const textAlign = align === "right" ? "text-right" : align === "center" ? "text-center" : "text-left";
+  const itemsAlign = align === "right" ? "items-end" : align === "center" ? "items-center" : "items-start";
+  const mx = align === "center" ? "mx-auto" : align === "right" ? "ml-auto" : "";
+  return /* @__PURE__ */ jsx("section", { className: "py-12 md:py-20", children: /* @__PURE__ */ jsxs("div", { className: `max-w-3xl ${mx}`, children: [
+    d.badge && /* @__PURE__ */ jsx("span", { className: `inline-block px-3 py-1 text-xs font-semibold rounded-full bg-secondary text-secondary-foreground mb-4`, children: d.badge }),
+    /* @__PURE__ */ jsx("h1", { className: `text-4xl md:text-5xl font-bold tracking-tight mb-4 text-balance ${textAlign}`, children: d.title }),
+    d.subtitle && /* @__PURE__ */ jsx("p", { className: `text-xl text-muted-foreground mb-8 ${textAlign}`, children: d.subtitle }),
+    (d.primaryButton || d.cta) && /* @__PURE__ */ jsxs("div", { className: `flex gap-4 flex-wrap ${itemsAlign}`, children: [
       (d.primaryButton || d.cta) && /* @__PURE__ */ jsx(
         "a",
         {
@@ -497,12 +501,16 @@ function CenteredHeroBlock({ block }) {
 }
 function ProductHeroBlock({ block }) {
   const d = getData(block);
+  const align = d.alignment || "left";
+  const textAlign = align === "right" ? "text-right" : align === "center" ? "text-center" : "text-left";
+  const itemsAlign = align === "right" ? "justify-end" : align === "center" ? "justify-center" : "justify-start";
+  const mx = align === "center" ? "mx-auto" : align === "right" ? "ml-auto" : "";
   return /* @__PURE__ */ jsx("section", { className: "py-16 md:py-24", children: /* @__PURE__ */ jsxs("div", { className: "max-w-6xl mx-auto px-4", children: [
-    /* @__PURE__ */ jsxs("div", { className: "text-center max-w-3xl mx-auto mb-12", children: [
-      d.badge && /* @__PURE__ */ jsx("span", { className: "inline-flex items-center gap-1.5 px-3 py-1 text-xs font-semibold rounded-full bg-primary/10 text-primary mb-5", children: d.badge }),
-      /* @__PURE__ */ jsx("h1", { className: "text-4xl md:text-5xl font-extrabold tracking-tight mb-5 text-balance leading-tight", children: d.title }),
-      d.subtitle && /* @__PURE__ */ jsx("p", { className: "text-lg text-muted-foreground leading-relaxed text-pretty mb-8", children: d.subtitle }),
-      (d.primaryButton || d.secondaryButton) && /* @__PURE__ */ jsxs("div", { className: "flex gap-3 justify-center flex-wrap", children: [
+    /* @__PURE__ */ jsxs("div", { className: `max-w-3xl ${mx} mb-12`, children: [
+      d.badge && /* @__PURE__ */ jsx("span", { className: `inline-flex items-center gap-1.5 px-3 py-1 text-xs font-semibold rounded-full bg-primary/10 text-primary mb-5`, children: d.badge }),
+      /* @__PURE__ */ jsx("h1", { className: `text-4xl md:text-5xl font-extrabold tracking-tight mb-5 text-balance leading-tight ${textAlign}`, children: d.title }),
+      d.subtitle && /* @__PURE__ */ jsx("p", { className: `text-lg text-muted-foreground leading-relaxed text-pretty mb-8 ${textAlign}`, children: d.subtitle }),
+      (d.primaryButton || d.secondaryButton) && /* @__PURE__ */ jsxs("div", { className: `flex gap-3 flex-wrap ${itemsAlign}`, children: [
         d.primaryButton && /* @__PURE__ */ jsx(
           "a",
           {
@@ -539,12 +547,16 @@ function ProductHeroBlock({ block }) {
 function BentoHeroBlock({ block }) {
   const d = getData(block);
   const cards = Array.isArray(d.cards) ? d.cards : [];
+  const align = d.alignment || "center";
+  const textAlign = align === "right" ? "text-right" : align === "left" ? "text-left" : "text-center";
+  const itemsAlign = align === "right" ? "justify-end" : align === "left" ? "justify-start" : "justify-center";
+  const mx = align === "left" ? "" : align === "right" ? "ml-auto" : "mx-auto";
   return /* @__PURE__ */ jsx("section", { className: "py-16 md:py-24", children: /* @__PURE__ */ jsxs("div", { className: "max-w-6xl mx-auto px-4", children: [
-    /* @__PURE__ */ jsxs("div", { className: "text-center max-w-3xl mx-auto mb-12", children: [
+    /* @__PURE__ */ jsxs("div", { className: `max-w-3xl ${mx} mb-12`, children: [
       d.badge && /* @__PURE__ */ jsx("span", { className: "inline-block px-3 py-1 text-xs font-semibold rounded-full bg-secondary text-secondary-foreground mb-5", children: d.badge }),
-      /* @__PURE__ */ jsx("h1", { className: "text-4xl md:text-5xl font-extrabold tracking-tight mb-4 text-balance", children: d.title }),
-      d.subtitle && /* @__PURE__ */ jsx("p", { className: "text-lg text-muted-foreground leading-relaxed text-pretty", children: d.subtitle }),
-      (d.primaryButton || d.secondaryButton) && /* @__PURE__ */ jsxs("div", { className: "flex gap-3 justify-center flex-wrap mt-7", children: [
+      /* @__PURE__ */ jsx("h1", { className: `text-4xl md:text-5xl font-extrabold tracking-tight mb-4 text-balance ${textAlign}`, children: d.title }),
+      d.subtitle && /* @__PURE__ */ jsx("p", { className: `text-lg text-muted-foreground leading-relaxed text-pretty ${textAlign}`, children: d.subtitle }),
+      (d.primaryButton || d.secondaryButton) && /* @__PURE__ */ jsxs("div", { className: `flex gap-3 flex-wrap mt-7 ${itemsAlign}`, children: [
         d.primaryButton && /* @__PURE__ */ jsx(
           "a",
           {
@@ -570,7 +582,7 @@ function BentoHeroBlock({ block }) {
         style: { background: card.background || "var(--muted)" },
         children: [
           card.icon && /* @__PURE__ */ jsx("span", { className: "text-2xl", role: "img", "aria-label": card.title, children: card.icon }),
-          card.image && /* @__PURE__ */ jsx("img", { src: card.image, alt: card.title || "", className: "w-full rounded-lg object-cover mb-1", style: { maxHeight: card.featured ? "180px" : "120px" } }),
+          card.image && /* @__PURE__ */ jsx("img", { src: card.image, alt: card.imageAlt || card.title || "Feature illustration", className: "w-full rounded-lg object-cover mb-1", style: { maxHeight: card.featured ? "180px" : "120px" } }),
           card.title && /* @__PURE__ */ jsx("h3", { className: "font-semibold text-sm", children: card.title }),
           card.description && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground leading-relaxed", children: card.description })
         ]
@@ -579,74 +591,17 @@ function BentoHeroBlock({ block }) {
     )) })
   ] }) });
 }
-function AnimatedHeroBlock({ block }) {
-  const d = getData(block);
-  const words = Array.isArray(d.animatedWords) && d.animatedWords.length > 0 ? d.animatedWords : ["Fast", "Simple", "Powerful"];
-  const [wordIndex, setWordIndex] = React.useState(0);
-  const [visible, setVisible] = React.useState(true);
-  React.useEffect(() => {
-    const interval = setInterval(() => {
-      setVisible(false);
-      setTimeout(() => {
-        setWordIndex((i) => (i + 1) % words.length);
-        setVisible(true);
-      }, 300);
-    }, d.interval || 2500);
-    return () => clearInterval(interval);
-  }, [words.length, d.interval]);
-  return /* @__PURE__ */ jsx("section", { className: "py-24 flex flex-col items-center text-center px-6", children: /* @__PURE__ */ jsxs("div", { className: "max-w-3xl mx-auto", children: [
-    d.badge && /* @__PURE__ */ jsx("span", { className: "inline-block px-3 py-1 text-xs font-semibold rounded-full bg-secondary text-secondary-foreground mb-6", children: d.badge }),
-    /* @__PURE__ */ jsxs("h1", { className: "text-4xl md:text-6xl font-extrabold tracking-tight mb-3 text-balance leading-tight", children: [
-      d.titlePrefix && /* @__PURE__ */ jsxs("span", { children: [
-        d.titlePrefix,
-        " "
-      ] }),
-      /* @__PURE__ */ jsx(
-        "span",
-        {
-          style: {
-            display: "inline-block",
-            color: "var(--primary)",
-            transition: "opacity 0.3s ease, transform 0.3s ease",
-            opacity: visible ? 1 : 0,
-            transform: visible ? "translateY(0)" : "translateY(-8px)"
-          },
-          children: words[wordIndex]
-        }
-      ),
-      d.titleSuffix && /* @__PURE__ */ jsxs("span", { children: [
-        " ",
-        d.titleSuffix
-      ] })
-    ] }),
-    d.subtitle && /* @__PURE__ */ jsx("p", { className: "text-lg md:text-xl text-muted-foreground leading-relaxed mb-9 text-pretty", children: d.subtitle }),
-    (d.primaryButton || d.secondaryButton) && /* @__PURE__ */ jsxs("div", { className: "flex gap-4 justify-center flex-wrap", children: [
-      d.primaryButton && /* @__PURE__ */ jsx(
-        "a",
-        {
-          href: d.primaryUrl || "#",
-          className: "inline-flex items-center px-8 py-3.5 rounded-xl bg-primary text-primary-foreground font-semibold text-sm hover:opacity-90 transition-opacity",
-          children: d.primaryButton
-        }
-      ),
-      d.secondaryButton && /* @__PURE__ */ jsx(
-        "a",
-        {
-          href: d.secondaryUrl || "#",
-          className: "inline-flex items-center px-8 py-3.5 rounded-xl border border-border text-foreground font-semibold text-sm hover:bg-muted transition-colors",
-          children: d.secondaryButton
-        }
-      )
-    ] })
-  ] }) });
-}
 function MinimalHeroBlock({ block }) {
   const d = getData(block);
-  return /* @__PURE__ */ jsx("section", { className: "py-20 md:py-28 px-4 border-b border-border", children: /* @__PURE__ */ jsxs("div", { className: "max-w-4xl", children: [
-    d.eyebrow && /* @__PURE__ */ jsx("p", { className: "text-xs uppercase tracking-[0.2em] font-semibold text-muted-foreground mb-5", children: d.eyebrow }),
-    /* @__PURE__ */ jsx("h1", { className: "text-5xl md:text-7xl font-black tracking-tight mb-6 text-balance leading-none whitespace-pre-line", children: d.title }),
-    d.subtitle && /* @__PURE__ */ jsx("p", { className: "text-lg md:text-xl text-muted-foreground leading-relaxed text-pretty max-w-2xl mb-9", children: d.subtitle }),
-    (d.primaryButton || d.secondaryButton) && /* @__PURE__ */ jsxs("div", { className: "flex gap-4 flex-wrap items-center", children: [
+  const align = d.alignment || "left";
+  const textAlign = align === "right" ? "text-right" : align === "center" ? "text-center" : "text-left";
+  const itemsAlign = align === "right" ? "justify-end" : align === "center" ? "justify-center" : "justify-start";
+  const mx = align === "center" ? "mx-auto" : align === "right" ? "ml-auto" : "";
+  return /* @__PURE__ */ jsx("section", { className: "py-20 md:py-28 px-4 border-b border-border", children: /* @__PURE__ */ jsxs("div", { className: `max-w-4xl ${mx}`, children: [
+    d.eyebrow && /* @__PURE__ */ jsx("p", { className: `text-xs uppercase tracking-[0.2em] font-semibold text-muted-foreground mb-5 ${textAlign}`, children: d.eyebrow }),
+    /* @__PURE__ */ jsx("h1", { className: `text-5xl md:text-7xl font-black tracking-tight mb-6 text-balance leading-none whitespace-pre-line ${textAlign}`, children: d.title }),
+    d.subtitle && /* @__PURE__ */ jsx("p", { className: `text-lg md:text-xl text-muted-foreground leading-relaxed text-pretty max-w-2xl mb-9 ${textAlign} ${mx}`, children: d.subtitle }),
+    (d.primaryButton || d.secondaryButton) && /* @__PURE__ */ jsxs("div", { className: `flex gap-4 flex-wrap items-center ${itemsAlign}`, children: [
       d.primaryButton && /* @__PURE__ */ jsxs(
         "a",
         {
@@ -672,16 +627,19 @@ function MinimalHeroBlock({ block }) {
 function SplitHeroBlock({ block }) {
   const d = getData(block);
   const imgLeft = d.imagePosition === "left";
+  const align = d.alignment || "left";
+  const textAlign = align === "center" ? "text-center" : "text-left";
+  const itemsAlign = align === "center" ? "items-center" : "items-start";
   return /* @__PURE__ */ jsx("section", { className: "py-16", children: /* @__PURE__ */ jsxs("div", { className: `flex flex-col ${imgLeft ? "md:flex-row-reverse" : "md:flex-row"} items-center gap-10 md:gap-16 max-w-6xl mx-auto px-4`, children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex-1 space-y-5", children: [
-      d.title && /* @__PURE__ */ jsx("h1", { className: "text-3xl md:text-5xl font-extrabold tracking-tight text-balance leading-tight", children: d.title }),
-      d.subtitle && /* @__PURE__ */ jsx("p", { className: "text-lg text-muted-foreground leading-relaxed text-pretty", children: d.subtitle }),
-      (d.button || d.secondaryButton) && /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-3 pt-2", children: [
+    /* @__PURE__ */ jsxs("div", { className: `flex-1 space-y-5 ${itemsAlign} flex flex-col`, children: [
+      d.title && /* @__PURE__ */ jsx("h1", { className: `text-3xl md:text-5xl font-extrabold tracking-tight text-balance leading-tight ${textAlign}`, children: d.title }),
+      d.subtitle && /* @__PURE__ */ jsx("p", { className: `text-lg text-muted-foreground leading-relaxed text-pretty ${textAlign}`, children: d.subtitle }),
+      (d.button || d.secondaryButton) && /* @__PURE__ */ jsxs("div", { className: `flex flex-wrap gap-3 pt-2 ${align === "center" ? "justify-center" : "justify-start"}`, children: [
         d.button && /* @__PURE__ */ jsx("a", { href: d.buttonUrl || "#", className: "inline-flex items-center px-6 py-3 rounded-lg bg-primary text-primary-foreground font-semibold text-sm hover:opacity-90 transition-opacity", children: d.button }),
         d.secondaryButton && /* @__PURE__ */ jsx("a", { href: d.secondaryUrl || "#", className: "inline-flex items-center px-6 py-3 rounded-lg border border-border text-foreground font-semibold text-sm hover:bg-muted transition-colors", children: d.secondaryButton })
       ] })
     ] }),
-    /* @__PURE__ */ jsx("div", { className: "flex-1 w-full", children: d.image ? /* @__PURE__ */ jsx("img", { src: d.image, alt: d.title || "", className: "w-full rounded-2xl object-cover shadow-lg border border-border" }) : /* @__PURE__ */ jsx("div", { className: "w-full rounded-2xl bg-muted border border-border aspect-video flex items-center justify-center", children: /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: "No image set" }) }) })
+    /* @__PURE__ */ jsx("div", { className: "flex-1 w-full", children: d.image ? /* @__PURE__ */ jsx("img", { src: d.image, alt: d.imageAlt || d.title || "Hero image", className: "w-full rounded-2xl object-cover shadow-lg border border-border" }) : /* @__PURE__ */ jsx("div", { className: "w-full rounded-2xl bg-muted border border-border aspect-video flex items-center justify-center", "aria-hidden": "true", children: /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: "No image set" }) }) })
   ] }) });
 }
 function AccordionBlock({ block }) {
@@ -932,7 +890,6 @@ var BUILT_IN = {
   "centered-hero": (b) => /* @__PURE__ */ jsx(CenteredHeroBlock, { block: b }),
   "product-hero": (b) => /* @__PURE__ */ jsx(ProductHeroBlock, { block: b }),
   "bento-hero": (b) => /* @__PURE__ */ jsx(BentoHeroBlock, { block: b }),
-  "animated-hero": (b) => /* @__PURE__ */ jsx(AnimatedHeroBlock, { block: b }),
   "minimal-hero": (b) => /* @__PURE__ */ jsx(MinimalHeroBlock, { block: b }),
   cta: (b) => /* @__PURE__ */ jsx(CTABlock, { block: b }),
   faq: (b) => /* @__PURE__ */ jsx(FAQBlock, { block: b }),