dune-react 0.0.21 → 0.0.23

package/dist/components/puck-block/cta-sections/text-block-cta/text-block-cta.js

@@ -0,0 +1,165 @@
+"use client";
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { CompoundButton } from "../../../puck-base/button.js";
+import { CompoundImage } from "../../../puck-base/image.js";
+import { cn } from "../../../../utils/css-utils.js";
+import { SectionWrapper } from "../../../puck-core/section-wrapper.js";
+const TextBlockCta = (props) => {
+  const {
+    heading,
+    description,
+    buttons,
+    images,
+    video,
+    // inputPlaceholder,
+    // formButton,
+    // termsAndConditions,
+    styles,
+    logos
+  } = {
+    ...TextBlockCtaDefaults,
+    ...props
+  };
+  const {
+    className: sectionClassName,
+    style: sectionStyle,
+    css,
+    textLayout = "left",
+    bgMedia = "none",
+    bordered = false,
+    // formType = "buttons",
+    bottomContent = "none"
+  } = styles ?? {};
+  const hasBg = bgMedia !== "none";
+  const isFullscreenBg = bgMedia === "fullscreenImage" || bgMedia === "fullscreenVideo";
+  const isContainerBg = bgMedia === "containerImage" || bgMedia === "containerVideo";
+  const isBgImage = bgMedia === "fullscreenImage" || bgMedia === "containerImage";
+  const isBgVideo = bgMedia === "fullscreenVideo" || bgMedia === "containerVideo";
+  const isCenter = textLayout === "center";
+  const isTwoColumn = textLayout === "twoColumn";
+  const isInlineRow = textLayout === "inlineRow";
+  const renderActions = () => {
+    return /* @__PURE__ */ jsx("div", { className: "mt-6 flex flex-wrap gap-4 md:mt-8", children: buttons.map((button, index) => /* @__PURE__ */ jsx(CompoundButton, { label: button.label, variant: button.variant, size: button.size, action: button.action, icon: button.icon }, index)) });
+  };
+  const renderBottomContent = () => {
+    if (bottomContent === "image" && images && images.length > 0) {
+      return /* @__PURE__ */ jsx("div", { className: "mt-12 md:mt-18 lg:mt-20", children: /* @__PURE__ */ jsx(
+        CompoundImage,
+        {
+          src: images[0].src,
+          alt: images[0].alt,
+          className: "w-full object-cover"
+        }
+      ) });
+    }
+    if (bottomContent === "logos" && logos && logos.length > 0) {
+      return /* @__PURE__ */ jsx("div", { className: "mt-12 flex flex-wrap items-center justify-center gap-x-8 gap-y-6 md:mt-18 lg:mt-20", children: logos.map((logo, index) => /* @__PURE__ */ jsx(CompoundImage, { src: logo.src, alt: logo.alt, className: "max-h-12" }, index)) });
+    }
+    return null;
+  };
+  const renderBgMedia = () => {
+    var _a, _b;
+    if (!hasBg) return null;
+    if (isFullscreenBg) {
+      return /* @__PURE__ */ jsxs("div", { className: "absolute inset-0 z-0", children: [
+        isBgImage && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(CompoundImage, { src: (_a = images == null ? void 0 : images[0]) == null ? void 0 : _a.src, className: "size-full object-cover", alt: (_b = images == null ? void 0 : images[0]) == null ? void 0 : _b.alt }),
+          /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-black/50" })
+        ] }),
+        isBgVideo && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx("video", { className: "size-full object-cover", autoPlay: true, loop: true, muted: true, children: /* @__PURE__ */ jsx("source", { src: video, type: "video/mp4" }) }),
+          /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-black/50" })
+        ] })
+      ] });
+    }
+    return null;
+  };
+  const renderContainerMedia = () => {
+    var _a, _b;
+    if (!isContainerBg) return null;
+    return /* @__PURE__ */ jsxs("div", { className: "mt-12 md:mt-18 lg:mt-20", children: [
+      isBgImage && /* @__PURE__ */ jsx(CompoundImage, { src: (_a = images == null ? void 0 : images[0]) == null ? void 0 : _a.src, className: "w-full object-cover", alt: (_b = images == null ? void 0 : images[0]) == null ? void 0 : _b.alt }),
+      isBgVideo && /* @__PURE__ */ jsx("video", { className: "w-full object-cover", autoPlay: true, loop: true, muted: true, children: /* @__PURE__ */ jsx("source", { src: video, type: "video/mp4" }) })
+    ] });
+  };
+  const textColorClass = isFullscreenBg ? "text-text-alternative" : "";
+  const renderTextContent = () => {
+    if (isTwoColumn) {
+      return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 gap-y-5 md:grid-cols-2 md:gap-x-12 lg:gap-x-20", children: [
+        /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("h2", { className: cn("mb-5 text-5xl font-bold md:mb-6 md:text-7xl lg:text-8xl", textColorClass), children: heading }) }),
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("p", { className: cn("md:text-md", textColorClass), children: description }),
+          renderActions()
+        ] })
+      ] });
+    }
+    if (isInlineRow) {
+      return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col items-start gap-6 md:flex-row md:items-center md:justify-between", {
+        "border border-border-primary p-8 md:p-12": bordered && !isFullscreenBg
+      }), children: [
+        /* @__PURE__ */ jsx("h2", { className: cn("text-5xl font-bold md:text-7xl lg:text-8xl", textColorClass), children: heading }),
+        renderActions()
+      ] });
+    }
+    if (isCenter) {
+      return /* @__PURE__ */ jsxs("div", { className: cn("mx-auto max-w-lg text-center", textColorClass), children: [
+        /* @__PURE__ */ jsx("h2", { className: "mb-5 text-5xl font-bold md:mb-6 md:text-7xl lg:text-8xl", children: heading }),
+        /* @__PURE__ */ jsx("p", { className: "md:text-md", children: description }),
+        renderActions()
+      ] });
+    }
+    return /* @__PURE__ */ jsxs("div", { className: cn("w-full max-w-lg", textColorClass), children: [
+      /* @__PURE__ */ jsx("h2", { className: "mb-5 text-5xl font-bold md:mb-6 md:text-7xl lg:text-8xl", children: heading }),
+      /* @__PURE__ */ jsx("p", { className: "md:text-md", children: description }),
+      renderActions()
+    ] });
+  };
+  return /* @__PURE__ */ jsxs(SectionWrapper, { className: cn("px-[5%] py-8 md:py-12 lg:py-14", { relative: isFullscreenBg }, sectionClassName), style: sectionStyle, css, children: [
+    renderBgMedia(),
+    /* @__PURE__ */ jsxs("div", { className: cn("container", { "relative z-10": isFullscreenBg }), children: [
+      renderTextContent(),
+      renderContainerMedia(),
+      renderBottomContent()
+    ] })
+  ] });
+};
+const TextBlockCtaDefaults = {
+  heading: "Medium length heading goes here",
+  description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique.",
+  buttons: [{ label: "Button" }, { label: "Button", variant: "secondary" }],
+  images: [
+    {
+      src: "https://picsum.photos/seed/cta-bg/1920/1080",
+      alt: "Placeholder image"
+    },
+    {
+      src: "https://picsum.photos/seed/cta-bottom/1200/600",
+      alt: "Placeholder image"
+    }
+  ],
+  video: "https://www.example.com/video.mp4",
+  // inputPlaceholder: "Enter your email",
+  // formButton: { label: "Sign up" },
+  // termsAndConditions: `
+  // <p class='text-xs'>
+  //   By clicking Sign Up you're confirming that you agree with our
+  //   <a href='#' class='underline'>Terms and Conditions</a>.
+  // </p>
+  // `,
+  logos: [
+    { src: "https://picsum.photos/seed/logo1/120/40", alt: "Logo 1" },
+    { src: "https://picsum.photos/seed/logo2/120/40", alt: "Logo 2" },
+    { src: "https://picsum.photos/seed/logo3/120/40", alt: "Logo 3" }
+  ],
+  styles: {
+    textLayout: "left",
+    bgMedia: "none",
+    bordered: false,
+    // formType: "buttons",
+    bottomContent: "none"
+  }
+};
+export {
+  TextBlockCta,
+  TextBlockCtaDefaults
+};

package/dist/components/puck-block/faq-sections/dual-column-accordion-faq/index.d.ts

@@ -46,7 +46,7 @@ declare const conf: {
                 readonly action: {
                     type: "custom";
                     label: string;
-                    render: typeof import("../../../puck-core").ActionField;
+                    render: typeof import("../../..").ActionField;
                 };
                 readonly variant: {
                     readonly type: "select";

package/dist/components/puck-block/faq-sections/icon-card-faq/index.d.ts

@@ -55,7 +55,7 @@ declare const conf: {
                 readonly action: {
                     type: "custom";
                     label: string;
-                    render: typeof import("../../../puck-core").ActionField;
+                    render: typeof import("../../..").ActionField;
                 };
                 readonly variant: {
                     readonly type: "select";

package/dist/components/puck-block/faq-sections/stacked-accordion-faq/index.d.ts

@@ -46,7 +46,7 @@ declare const conf: {
                 readonly action: {
                     type: "custom";
                     label: string;
-                    render: typeof import("../../../puck-core").ActionField;
+                    render: typeof import("../../..").ActionField;
                 };
                 readonly variant: {
                     readonly type: "select";

package/dist/components/puck-block/faq-sections/stacked-static-faq/index.d.ts

@@ -46,7 +46,7 @@ declare const conf: {
                 readonly action: {
                     type: "custom";
                     label: string;
-                    render: typeof import("../../../puck-core").ActionField;
+                    render: typeof import("../../..").ActionField;
                 };
                 readonly variant: {
                     readonly type: "select";

package/dist/components/puck-block/faq-sections/two-column-accordion-faq/index.d.ts

@@ -21,7 +21,7 @@ declare const conf: {
                 readonly action: {
                     type: "custom";
                     label: string;
-                    render: typeof import("../../../puck-core").ActionField;
+                    render: typeof import("../../..").ActionField;
                 };
                 readonly variant: {
                     readonly type: "select";

package/dist/components/puck-block/faq-sections/two-column-static-faq/index.d.ts

@@ -21,7 +21,7 @@ declare const conf: {
                 readonly action: {
                     type: "custom";
                     label: string;
-                    render: typeof import("../../../puck-core").ActionField;
+                    render: typeof import("../../..").ActionField;
                 };
                 readonly variant: {
                     readonly type: "select";

package/dist/components/puck-block/feature-sections/feature-cards-grid/component.js

@@ -96,7 +96,7 @@ const FeatureCardsGridDefaults = {
   ],
   image: {
     src: "https://picsum.photos/seed/feature-cards/800/600",
-    alt: "Relume placeholder image"
+    alt: "Placeholder image"
   },
   video: "https://www.youtube.com/embed/8DKLYsikxTs?si=Ch9W0KrDWWUiCMMW",
   buttons: [{ label: "Button" }, { label: "Button", variant: "secondary" }],

package/dist/components/puck-block/feature-sections/feature-cards-grid/index.d.ts

@@ -38,7 +38,7 @@ declare const conf: {
                         readonly action: {
                             type: "custom";
                             label: string;
-                            render: typeof import("../../../puck-core").ActionField;
+                            render: typeof import("../../..").ActionField;
                         };
                         readonly variant: {
                             readonly type: "select";
@@ -119,7 +119,7 @@ declare const conf: {
                 readonly action: {
                     type: "custom";
                     label: string;
-                    render: typeof import("../../../puck-core").ActionField;
+                    render: typeof import("../../..").ActionField;
                 };
                 readonly variant: {
                     readonly type: "select";

package/dist/components/puck-block/feature-sections/feature-list-split/component.js

@@ -93,7 +93,7 @@ const FeatureListSplitDefaults = {
   ],
   image: {
     src: "https://picsum.photos/seed/feature-list/800/600",
-    alt: "Relume placeholder image"
+    alt: "Placeholder image"
   },
   video: "https://www.youtube.com/embed/8DKLYsikxTs?si=Ch9W0KrDWWUiCMMW",
   buttons: [{ label: "Button" }, { label: "Button", variant: "secondary" }],

package/dist/components/puck-block/feature-sections/feature-list-split/index.d.ts

@@ -38,7 +38,7 @@ declare const conf: {
                         readonly action: {
                             type: "custom";
                             label: string;
-                            render: typeof import("../../../puck-core").ActionField;
+                            render: typeof import("../../..").ActionField;
                         };
                         readonly variant: {
                             readonly type: "select";
@@ -119,7 +119,7 @@ declare const conf: {
                 readonly action: {
                     type: "custom";
                     label: string;
-                    render: typeof import("../../../puck-core").ActionField;
+                    render: typeof import("../../..").ActionField;
                 };
                 readonly variant: {
                     readonly type: "select";

package/dist/components/puck-block/feature-sections/tab-feature/component.js

@@ -9,47 +9,51 @@ import { CgSpinner } from "../../../../node_modules/.pnpm/react-icons@5.6.0_reac
 import { cn } from "../../../../utils/css-utils.js";
 import { SectionWrapper } from "../../../puck-core/section-wrapper.js";
 const TabFeature = (props) => {
-  const { defaultTabValue, tabs = [], styles } = {
+  const {
+    defaultTabValue,
+    tabs = [],
+    styles
+  } = {
     ...TabFeatureDefaults,
     ...props
   };
-  const { className: sectionClassName, style: sectionStyle, css } = styles ?? {};
+  const {
+    className: sectionClassName,
+    style: sectionStyle,
+    css
+  } = styles ?? {};
   const [isIframeLoaded, setIsIframeLoaded] = useState(false);
-  return /* @__PURE__ */ jsx(SectionWrapper, { className: cn("px-[5%] py-8 md:py-12 lg:py-14", sectionClassName), style: sectionStyle, css, children: /* @__PURE__ */ jsx("div", { className: "container", children: /* @__PURE__ */ jsxs(
-    Tabs,
+  return /* @__PURE__ */ jsx(
+    SectionWrapper,
     {
-      defaultValue: defaultTabValue,
-      className: "grid grid-cols-1 items-center gap-y-12 md:grid-cols-2 md:gap-x-12 lg:gap-x-20",
-      children: [
-        /* @__PURE__ */ jsx(TabsList, { className: "col-start-1 col-end-2 row-start-1 row-end-2 grid grid-cols-1 items-center gap-x-4 gap-y-10", children: tabs.map((tab) => /* @__PURE__ */ jsxs(
-          TabsTrigger,
-          {
-            value: tab.value,
-            className: "flex-col items-start justify-start whitespace-normal border-0 border-l-2 border-transparent py-0 pl-8 pr-0 text-left data-[state=active]:border-black data-[state=active]:bg-transparent data-[state=active]:text-text-primary",
-            children: [
-              /* @__PURE__ */ jsx("h3", { className: "mb-3 text-2xl font-bold md:mb-4 md:text-3xl md:leading-[1.3] lg:text-4xl", children: tab.heading }),
-              /* @__PURE__ */ jsx("p", { children: tab.description })
-            ]
-          },
-          tab.value
-        )) }),
-        /* @__PURE__ */ jsx("div", { className: "max-size-full flex items-center justify-center overflow-hidden", children: tabs.map((tab) => /* @__PURE__ */ jsxs(
-          TabsContent,
-          {
-            value: tab.value,
-            className: "data-[state=active]:animate-tabs",
-            children: [
-              tab.image && !tab.videoUrl && /* @__PURE__ */ jsx(
-                CompoundImage,
-                {
-                  src: tab.image.src,
-                  alt: tab.image.alt,
-                  className: "size-full object-cover"
-                }
-              ),
-              tab.videoUrl && tab.image && /* @__PURE__ */ jsxs(Dialog, { children: [
-                /* @__PURE__ */ jsx(DialogTrigger, { asChild: true, children: /* @__PURE__ */ jsxs("button", { className: "relative flex w-full items-center justify-center", children: [
-                  /* @__PURE__ */ jsx(
+      className: cn("px-[5%] py-8 md:py-12 lg:py-14", sectionClassName),
+      style: sectionStyle,
+      css,
+      children: /* @__PURE__ */ jsx("div", { className: "container", children: /* @__PURE__ */ jsxs(
+        Tabs,
+        {
+          defaultValue: defaultTabValue,
+          className: "grid grid-cols-1 items-center gap-y-12 md:grid-cols-2 md:gap-x-12 lg:gap-x-20",
+          children: [
+            /* @__PURE__ */ jsx(TabsList, { className: "col-start-1 col-end-2 row-start-1 row-end-2 h-full! w-full! grid grid-cols-1 items-center gap-x-4 gap-y-4", children: tabs.map((tab) => /* @__PURE__ */ jsxs(
+              TabsTrigger,
+              {
+                value: tab.value,
+                className: "flex-col items-start justify-start whitespace-normal border-0 border-l-2 border-transparent py-2 px-2 pr-0 text-left data-[state=active]:border-black data-[state=active]:bg-transparent data-[state=active]:text-text-primary",
+                children: [
+                  /* @__PURE__ */ jsx("h3", { className: "mb-3 text-2xl font-bold md:mb-2 md:text-3xl md:leading-[1.3] lg:text-4xl", children: tab.heading }),
+                  /* @__PURE__ */ jsx("p", { children: tab.description })
+                ]
+              },
+              tab.value
+            )) }),
+            /* @__PURE__ */ jsx("div", { className: "size-full flex items-center justify-center overflow-hidden", children: tabs.map((tab) => /* @__PURE__ */ jsxs(
+              TabsContent,
+              {
+                value: tab.value,
+                className: "data-[state=active]:animate-tabs",
+                children: [
+                  tab.image && !tab.videoUrl && /* @__PURE__ */ jsx(
                     CompoundImage,
                     {
                       src: tab.image.src,
@@ -57,33 +61,45 @@ const TabFeature = (props) => {
                       className: "size-full object-cover"
                     }
                   ),
-                  /* @__PURE__ */ jsx(FaCirclePlay, { className: "absolute z-20 size-16 text-white" }),
-                  /* @__PURE__ */ jsx("span", { className: "absolute inset-0 z-10 bg-black/50" })
-                ] }) }),
-                /* @__PURE__ */ jsxs(DialogContent, { children: [
-                  !isIframeLoaded && /* @__PURE__ */ jsx(CgSpinner, { className: "mx-auto size-16 animate-spin text-white" }),
-                  /* @__PURE__ */ jsx(
-                    "iframe",
-                    {
-                      className: cn(
-                        "z-0 mx-auto aspect-video size-full md:w-[738px] lg:w-[940px]",
-                        { visible: isIframeLoaded, hidden: !isIframeLoaded }
+                  tab.videoUrl && tab.image && /* @__PURE__ */ jsxs(Dialog, { children: [
+                    /* @__PURE__ */ jsx(DialogTrigger, { asChild: true, children: /* @__PURE__ */ jsxs("button", { className: "relative flex w-full items-center justify-center", children: [
+                      /* @__PURE__ */ jsx(
+                        CompoundImage,
+                        {
+                          src: tab.image.src,
+                          alt: tab.image.alt,
+                          className: "size-full object-cover"
+                        }
                       ),
-                      src: tab.videoUrl,
-                      allow: "autoplay; encrypted-media; picture-in-picture",
-                      allowFullScreen: true,
-                      onLoad: () => setIsIframeLoaded(true)
-                    }
-                  )
-                ] })
-              ] })
-            ]
-          },
-          tab.value
-        )) })
-      ]
+                      /* @__PURE__ */ jsx(FaCirclePlay, { className: "absolute z-20 size-16 text-white" }),
+                      /* @__PURE__ */ jsx("span", { className: "absolute inset-0 z-10 bg-black/50" })
+                    ] }) }),
+                    /* @__PURE__ */ jsxs(DialogContent, { children: [
+                      !isIframeLoaded && /* @__PURE__ */ jsx(CgSpinner, { className: "mx-auto size-16 animate-spin text-white" }),
+                      /* @__PURE__ */ jsx(
+                        "iframe",
+                        {
+                          className: cn(
+                            "z-0 mx-auto aspect-video size-full md:w-[738px] lg:w-[940px]",
+                            { visible: isIframeLoaded, hidden: !isIframeLoaded }
+                          ),
+                          src: tab.videoUrl,
+                          allow: "autoplay; encrypted-media; picture-in-picture",
+                          allowFullScreen: true,
+                          onLoad: () => setIsIframeLoaded(true)
+                        }
+                      )
+                    ] })
+                  ] })
+                ]
+              },
+              tab.value
+            )) })
+          ]
+        }
+      ) })
     }
-  ) }) });
+  );
 };
 const TabFeatureDefaults = {
   defaultTabValue: "tab-1",
@@ -94,7 +110,7 @@ const TabFeatureDefaults = {
       description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.",
       image: {
         src: "https://picsum.photos/seed/tab-feature1/800/600",
-        alt: "Relume placeholder image 1"
+        alt: "Placeholder image 1"
       }
     },
     {
@@ -103,7 +119,7 @@ const TabFeatureDefaults = {
       description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.",
       image: {
         src: "https://picsum.photos/seed/tab-feature2/800/600",
-        alt: "Relume placeholder image 2"
+        alt: "Placeholder image 2"
       }
     },
     {
@@ -112,7 +128,7 @@ const TabFeatureDefaults = {
       description: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.",
       image: {
         src: "https://picsum.photos/seed/tab-feature3/800/600",
-        alt: "Relume placeholder image 3"
+        alt: "Placeholder image 3"
       }
     }
   ]

package/dist/components/puck-block/feature-sections/text-media-split/component.js

@@ -78,7 +78,7 @@ const TextMediaSplitDefaults = {
   buttons: [{ label: "Button" }, { label: "Button", variant: "secondary" }],
   image: {
     src: "https://picsum.photos/seed/feature-split/800/600",
-    alt: "Relume placeholder image"
+    alt: "Placeholder image"
   },
   video: "https://www.youtube.com/embed/8DKLYsikxTs?si=Ch9W0KrDWWUiCMMW",
   styles: {

package/dist/components/puck-block/feature-sections/text-media-split/index.d.ts

@@ -28,7 +28,7 @@ declare const conf: {
                 readonly action: {
                     type: "custom";
                     label: string;
-                    render: typeof import("../../../puck-core").ActionField;
+                    render: typeof import("../../..").ActionField;
                 };
                 readonly variant: {
                     readonly type: "select";

package/dist/components/puck-block/feature-sections/text-only-section/index.d.ts

@@ -28,7 +28,7 @@ declare const conf: {
                 readonly action: {
                     type: "custom";
                     label: string;
-                    render: typeof import("../../../puck-core").ActionField;
+                    render: typeof import("../../..").ActionField;
                 };
                 readonly variant: {
                     readonly type: "select";

package/dist/components/puck-block/footer-sections/centered-minimal-footer/centered-minimal-footer.js

@@ -3,23 +3,64 @@ import { CompoundImage } from "../../../puck-base/image.js";
 import { SectionWrapper } from "../../../puck-core/section-wrapper.js";
 import { cn } from "../../../../utils/css-utils.js";
 const CenteredMinimalFooter = (props) => {
-  const { logo, columnLinks, socialMediaLinks, footerText, footerLinks, styles } = { ...CenteredMinimalFooterDefaults, ...props };
-  const { className: sectionClassName, style: sectionStyle, css } = styles ?? {};
-  return /* @__PURE__ */ jsx(SectionWrapper, { className: cn("px-[5%] py-6 md:py-9 lg:py-10", sectionClassName), style: sectionStyle, css, children: /* @__PURE__ */ jsxs("div", { className: "container", children: [
-    /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 items-center justify-center justify-items-center gap-x-[4vw] gap-y-12 pb-12 md:pb-18 lg:grid-cols-[0.25fr_1fr_0.25fr] lg:justify-between lg:gap-y-4 lg:pb-20", children: [
-      /* @__PURE__ */ jsx("a", { href: logo == null ? void 0 : logo.url, className: "lg:justify-self-start", children: /* @__PURE__ */ jsx(CompoundImage, { src: logo == null ? void 0 : logo.src, alt: logo == null ? void 0 : logo.alt, className: "inline-block" }) }),
-      columnLinks == null ? void 0 : columnLinks.map((col, i) => /* @__PURE__ */ jsx("ul", { className: "grid grid-flow-row grid-cols-1 items-start justify-center justify-items-center gap-6 md:grid-flow-col md:grid-cols-[max-content] md:justify-center md:justify-items-start", children: col.links.map((l, li) => /* @__PURE__ */ jsx("li", { className: "font-semibold", children: /* @__PURE__ */ jsx("a", { href: l.url, children: l.title }) }, li)) }, i)),
-      /* @__PURE__ */ jsx("div", { className: "flex items-start justify-start justify-items-center gap-x-3 lg:justify-self-end", children: socialMediaLinks == null ? void 0 : socialMediaLinks.map((l, i) => /* @__PURE__ */ jsx("a", { href: l.url, children: l.icon }, i)) })
-    ] }),
-    /* @__PURE__ */ jsx("div", { className: "h-px w-full bg-black" }),
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-col-reverse items-center justify-center pb-4 pt-6 text-sm md:flex-row md:gap-x-6 md:pb-0 md:pt-8", children: [
-      /* @__PURE__ */ jsx("p", { className: "mt-8 md:mt-0", children: footerText }),
-      /* @__PURE__ */ jsx("ul", { className: "grid grid-flow-row grid-cols-[max-content] items-center justify-center gap-y-4 text-sm md:grid-flow-col md:gap-x-6 md:gap-y-0", children: footerLinks == null ? void 0 : footerLinks.map((l, i) => /* @__PURE__ */ jsx("li", { className: "underline", children: /* @__PURE__ */ jsx("a", { href: l.url, children: l.title }) }, i)) })
-    ] })
-  ] }) });
+  const {
+    logo,
+    columnLinks,
+    socialMediaLinks,
+    footerText,
+    footerLinks,
+    styles
+  } = { ...CenteredMinimalFooterDefaults, ...props };
+  const {
+    className: sectionClassName,
+    style: sectionStyle,
+    css
+  } = styles ?? {};
+  return /* @__PURE__ */ jsx(
+    SectionWrapper,
+    {
+      className: cn("px-[5%] py-6 md:py-9 lg:py-10", sectionClassName),
+      style: sectionStyle,
+      css,
+      children: /* @__PURE__ */ jsxs("div", { className: "container", children: [
+        /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 items-center justify-center justify-items-center gap-x-[4vw] gap-y-12 pb-12 md:pb-18 lg:grid-cols-[0.25fr_1fr_0.25fr] lg:justify-between lg:gap-y-4 lg:pb-20", children: [
+          /* @__PURE__ */ jsx("a", { href: logo == null ? void 0 : logo.url, className: "lg:justify-self-start", children: /* @__PURE__ */ jsx(
+            CompoundImage,
+            {
+              src: logo == null ? void 0 : logo.src,
+              alt: logo == null ? void 0 : logo.alt,
+              className: "inline-block"
+            }
+          ) }),
+          columnLinks == null ? void 0 : columnLinks.map((col, i) => {
+            var _a;
+            return /* @__PURE__ */ jsx(
+              "ul",
+              {
+                className: "grid grid-flow-row grid-cols-1 items-start justify-center justify-items-center gap-6 md:grid-flow-col md:grid-cols-[max-content] md:justify-center md:justify-items-start",
+                children: (_a = col.links) == null ? void 0 : _a.map((l, li) => /* @__PURE__ */ jsx("li", { className: "font-semibold", children: /* @__PURE__ */ jsx("a", { href: l.url, children: l.title }) }, li))
+              },
+              i
+            );
+          }),
+          /* @__PURE__ */ jsx("div", { className: "flex items-start justify-start justify-items-center gap-x-3 lg:justify-self-end", children: socialMediaLinks == null ? void 0 : socialMediaLinks.map((l, i) => /* @__PURE__ */ jsx("a", { href: l.url, children: l.icon }, i)) })
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "h-px w-full bg-black" }),
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-col-reverse items-center justify-center pb-4 pt-6 text-sm md:flex-row md:gap-x-6 md:pb-0 md:pt-8", children: [
+          /* @__PURE__ */ jsx("p", { className: "mt-8 md:mt-0", children: footerText }),
+          /* @__PURE__ */ jsx("ul", { className: "grid grid-flow-row grid-cols-[max-content] items-center justify-center gap-y-4 text-sm md:grid-flow-col md:gap-x-6 md:gap-y-0", children: footerLinks == null ? void 0 : footerLinks.map((l, i) => /* @__PURE__ */ jsx("li", { className: "underline", children: /* @__PURE__ */ jsx("a", { href: l.url, children: l.title }) }, i)) })
+        ] })
+      ] })
+    }
+  );
 };
 const CenteredMinimalFooterDefaults = {
-  logo: { url: "#", src: "https://d22po4pjz3o32e.cloudfront.net/logo-image.svg", alt: "Logo image" },
+  __metadata: { type: "footer" },
+  logo: {
+    url: "#",
+    src: "https://file.springbrand.ai/web_assets/template-logo.svg",
+    alt: "Logo image"
+  },
   heading: "",
   description: "",
   buttons: [],
@@ -28,9 +69,22 @@ const CenteredMinimalFooterDefaults = {
   inputPlaceholder: "",
   button: { label: "" },
   termsAndConditions: "",
-  columnLinks: [{ links: [{ title: "Link One", url: "#" }, { title: "Link Two", url: "#" }, { title: "Link Three", url: "#" }, { title: "Link Four", url: "#" }, { title: "Link Five", url: "#" }] }],
-  footerText: "© 2024 Relume. All rights reserved.",
-  footerLinks: [{ title: "Privacy Policy", url: "#" }, { title: "Terms of Service", url: "#" }],
+  columnLinks: [
+    {
+      links: [
+        { title: "Link One", url: "#" },
+        { title: "Link Two", url: "#" },
+        { title: "Link Three", url: "#" },
+        { title: "Link Four", url: "#" },
+        { title: "Link Five", url: "#" }
+      ]
+    }
+  ],
+  footerText: "© 2024 Company. All rights reserved.",
+  footerLinks: [
+    { title: "Privacy Policy", url: "#" },
+    { title: "Terms of Service", url: "#" }
+  ],
   socialMediaLinks: [],
   address: { label: "", value: "" },
   contact: { label: "", phone: "", email: "" },