@opensite/ui 1.4.4 → 1.4.6

package/dist/components.cjs

@@ -1222,7 +1222,7 @@ function DynamicIcon({
   const { url, iconName } = React4__namespace.useMemo(() => {
     const separator = name.includes("/") ? "/" : ":";
     const [prefix, iconName2] = name.split(separator);
-    const baseUrl = `https://icons.opensite.ai/api/icon/${prefix}/${iconName2}?format=svg&width=${size}&height=${size}`;
+    const baseUrl = `https://icons.opensite.ai/api/icon/${prefix}/${iconName2}?format=svg&width=${size}&height=${size}&key=au382bi7fsh96w9h9xlrnat2jglx`;
     return {
       url: baseUrl,
       iconName: iconName2
@@ -4484,7 +4484,8 @@ function FooterContactCard({
   copyrightClassName,
   locationClassName,
   background,
-  spacing,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
+  spacing = "py-6 md:py-32",
   pattern,
   patternOpacity,
   optixFlowConfig
@@ -4497,6 +4498,7 @@ function FooterContactCard({
       pattern,
       patternOpacity,
       className: cn(className),
+      containerClassName,
       children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(contentClassName), children: /* @__PURE__ */ jsxRuntime.jsxs("footer", { children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("grid gap-12 lg:grid-cols-2", gridClassName), children: [
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn(leftColumnClassName), children: [
@@ -4509,7 +4511,16 @@ function FooterContactCard({
                 optixFlowConfig
               }
             ),
-            heading && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cn("mb-8 text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", headingClassName), children: heading }),
+            heading && /* @__PURE__ */ jsxRuntime.jsx(
+              "h2",
+              {
+                className: cn(
+                  "mb-8 text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl",
+                  headingClassName
+                ),
+                children: heading
+              }
+            ),
             (email || phone || address) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-4 opacity-80", contactClassName), children: [
               email && /* @__PURE__ */ jsxRuntime.jsx("p", { children: /* @__PURE__ */ jsxRuntime.jsx(
                 Pressable,
@@ -4530,51 +4541,90 @@ function FooterContactCard({
               address && /* @__PURE__ */ jsxRuntime.jsx("p", { children: address })
             ] })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col justify-between", rightColumnClassName), children: [
-            (socialTitle || socialLinks && socialLinks.length > 0) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn(socialSectionClassName), children: [
-              socialTitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mb-4 font-medium", socialTitleClassName), children: socialTitle }),
-              socialLinks && socialLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("ul", { className: cn("flex items-center gap-4", socialLinksClassName), children: socialLinks.map((social, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
-                SocialLinkIcon,
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
+            {
+              className: cn(
+                "flex flex-col justify-between",
+                rightColumnClassName
+              ),
+              children: [
+                (socialTitle || socialLinks && socialLinks.length > 0) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn(socialSectionClassName), children: [
+                  socialTitle && /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mb-4 font-medium", socialTitleClassName), children: socialTitle }),
+                  socialLinks && socialLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+                    "ul",
+                    {
+                      className: cn(
+                        "flex items-center gap-4",
+                        socialLinksClassName
+                      ),
+                      children: socialLinks.map((social, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
+                        SocialLinkIcon,
+                        {
+                          href: social.href,
+                          label: social.label,
+                          iconNameOverride: social.iconNameOverride,
+                          className: cn(
+                            "flex size-12 items-center justify-center rounded-full border transition-colors hover:opacity-80",
+                            socialLinkClassName
+                          )
+                        }
+                      ) }, idx))
+                    }
+                  )
+                ] }),
+                navLinks && navLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("nav", { className: cn("mt-18 md:mt-8", navClassName), children: /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-wrap gap-6", children: navLinks.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
+                  Pressable,
+                  {
+                    href: link.href,
+                    className: cn(
+                      "opacity-80 hover:opacity-100",
+                      navLinkClassName
+                    ),
+                    children: link.name
+                  }
+                ) }, idx)) }) })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: cn(
+              "mt-16 flex flex-col justify-between gap-4 border-t pt-8 text-sm opacity-80 md:flex-row md:items-center",
+              bottomClassName
+            ),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs(
+                "div",
                 {
-                  href: social.href,
-                  label: social.label,
-                  iconNameOverride: social.iconNameOverride,
                   className: cn(
-                    "flex size-12 items-center justify-center rounded-full border transition-colors hover:opacity-80",
-                    socialLinkClassName
-                  )
+                    "flex flex-col gap-2 md:flex-row md:items-center md:gap-4",
+                    copyrightClassName
+                  ),
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(FooterCopyright, { copyright }),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      BrandAttribution,
+                      {
+                        internalBrandSlug: "open_site_ai",
+                        optionIndex: 7,
+                        variant: "span",
+                        linkClassName: "underline underline-offset-4 transition-colors hover:opacity-100"
+                      }
+                    )
+                  ]
                 }
-              ) }, idx)) })
-            ] }),
-            navLinks && navLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("nav", { className: cn("mt-8", navClassName), children: /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-wrap gap-6", children: navLinks.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
-              Pressable,
-              {
-                href: link.href,
-                className: cn("opacity-80 hover:opacity-100", navLinkClassName),
-                children: link.name
-              }
-            ) }, idx)) }) })
-          ] })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mt-16 flex flex-col justify-between gap-4 border-t pt-8 text-sm opacity-80 md:flex-row md:items-center", bottomClassName), children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-2 md:flex-row md:items-center md:gap-4", copyrightClassName), children: [
-            /* @__PURE__ */ jsxRuntime.jsx(FooterCopyright, { copyright }),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              BrandAttribution,
-              {
-                internalBrandSlug: "open_site_ai",
-                optionIndex: 7,
-                variant: "span",
-                linkClassName: "underline underline-offset-4 transition-colors hover:opacity-100"
-              }
-            )
-          ] }),
-          (locationLabel || location) && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cn(locationClassName), children: [
-            locationLabel,
-            " ",
-            location && /* @__PURE__ */ jsxRuntime.jsx("strong", { children: location })
-          ] })
-        ] })
+              ),
+              (locationLabel || location) && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cn(locationClassName), children: [
+                locationLabel,
+                " ",
+                location && /* @__PURE__ */ jsxRuntime.jsx("strong", { children: location })
+              ] })
+            ]
+          }
+        )
       ] }) })
     }
   );
@@ -4743,7 +4793,8 @@ function FooterAnimatedSocial({
   separatorClassName,
   copyrightClassName,
   background,
-  spacing,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
+  spacing = "py-6 md:py-32",
   pattern,
   patternOpacity
 }) {
@@ -4766,7 +4817,10 @@ function FooterAnimatedSocial({
             label: link.label,
             iconNameOverride: link.iconNameOverride,
             iconSize: 24,
-            className: cn("group flex items-center gap-2 py-2 transition-colors hover:opacity-70", socialLinkClassName)
+            className: cn(
+              "group flex items-center gap-2 py-2 transition-colors hover:opacity-70",
+              socialLinkClassName
+            )
           }
         )
       },
@@ -4781,6 +4835,7 @@ function FooterAnimatedSocial({
       pattern,
       patternOpacity,
       className: cn(className),
+      containerClassName,
       children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn(contentClassName), children: /* @__PURE__ */ jsxRuntime.jsx("footer", { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
         /* @__PURE__ */ jsxRuntime.jsxs(
           framerMotion.motion.div,
@@ -4789,23 +4844,56 @@ function FooterAnimatedSocial({
             initial: "hidden",
             whileInView: "visible",
             viewport: { once: true },
-            className: cn("flex flex-col justify-between md:flex-row md:items-center", layoutClassName),
+            className: cn(
+              "flex flex-col justify-between md:flex-row md:items-center",
+              layoutClassName
+            ),
             children: [
               /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-8", leftColumnClassName), children: [
                 /* @__PURE__ */ jsxRuntime.jsxs(framerMotion.motion.div, { variants: itemVariants, className: "space-y-6", children: [
-                  /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cn("text-4xl leading-tight font-bold lg:text-5xl", headingClassName), children: heading }),
-                  /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("max-w-md text-lg leading-relaxed opacity-80", descriptionClassName), children: description })
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "h2",
+                    {
+                      className: cn(
+                        "text-4xl leading-tight font-bold lg:text-5xl",
+                        headingClassName
+                      ),
+                      children: heading
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "p",
+                    {
+                      className: cn(
+                        "max-w-md text-lg leading-relaxed opacity-80",
+                        descriptionClassName
+                      ),
+                      children: description
+                    }
+                  )
                 ] }),
                 ctaUrl && ctaText && /* @__PURE__ */ jsxRuntime.jsx(framerMotion.motion.div, { variants: itemVariants, children: /* @__PURE__ */ jsxRuntime.jsx(
                   Pressable,
                   {
                     href: ctaUrl,
-                    className: cn("inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border h-11 px-8 hover:opacity-80", ctaClassName),
+                    className: cn(
+                      "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border h-11 px-8 hover:opacity-80",
+                      ctaClassName
+                    ),
                     children: ctaText
                   }
                 ) })
               ] }),
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-5 space-y-8 md:mt-0", rightColumnClassName), children: /* @__PURE__ */ jsxRuntime.jsx(framerMotion.motion.div, { variants: itemVariants, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("space-y-6", socialLinksClassName), children: socialLinksContent }) }) })
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  className: cn(
+                    "flex flex-row md:flex-col flex-wrap items-center justify-center gap-4 md:gap-2",
+                    rightColumnClassName
+                  ),
+                  children: /* @__PURE__ */ jsxRuntime.jsx(framerMotion.motion.div, { variants: itemVariants, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex flex-row md:flex-col items-center gap-4 md:gap-6", socialLinksClassName), children: socialLinksContent }) })
+                }
+              )
             ]
           }
         ),
@@ -4818,14 +4906,32 @@ function FooterAnimatedSocial({
             viewport: { once: true },
             className: cn("mt-16", bottomClassName),
             children: [
-              /* @__PURE__ */ jsxRuntime.jsx(framerMotion.motion.div, { variants: itemVariants, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-8 h-px w-full opacity-20", separatorClassName), style: { backgroundColor: "currentColor" } }) }),
+              /* @__PURE__ */ jsxRuntime.jsx(framerMotion.motion.div, { variants: itemVariants, children: /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  className: cn(
+                    "mb-8 h-px w-full opacity-20",
+                    separatorClassName
+                  ),
+                  style: { backgroundColor: "currentColor" }
+                }
+              ) }),
               /* @__PURE__ */ jsxRuntime.jsxs(
                 framerMotion.motion.div,
                 {
                   variants: itemVariants,
-                  className: cn("flex flex-col items-start justify-between gap-4 sm:flex-row sm:items-center", copyrightClassName),
+                  className: cn(
+                    "flex flex-col items-start justify-between gap-4 sm:flex-row sm:items-center",
+                    copyrightClassName
+                  ),
                   children: [
-                    /* @__PURE__ */ jsxRuntime.jsx(FooterCopyright, { copyright, className: "text-sm opacity-70" }),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      FooterCopyright,
+                      {
+                        copyright,
+                        className: "text-sm opacity-70"
+                      }
+                    ),
                     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-6 text-sm opacity-70", children: /* @__PURE__ */ jsxRuntime.jsx(
                       BrandAttribution,
                       {

package/dist/components.d.cts

@@ -12,7 +12,7 @@ export { CarouselPagination, CarouselPaginationProps } from './carousel-paginati
 export { SocialLinkIcon, SocialLinkIconDynamicIconProps, SocialLinkIconProps } from './social-link-icon.cjs';
 export { Pressable, PressableProps } from './pressable.cjs';
 export { AlternatingBlocks } from './alternating-blocks.cjs';
-export { c as AboutCultureTabs, p as AboutCultureTabsProps, b as AboutExpandableValues, n as AboutExpandableValuesProps, a as AboutMissionPrinciples, m as AboutMissionPrinciplesProps, A as AboutSplitHero, l as AboutSplitHeroProps, k as AlternatingBlockSection, j as AlternatingBlocksProps, h as AnimatedDialogProps, i as AnimatedDialogSize, C as CommunityInitiatives, o as CommunityInitiativesProps, e as ContainerMaxWidth, d as ContainerProps, q as MediaHoverCtaItem, r as MediaHoverCtaType, M as MediaHoverCtasProps, P as PageHeroBannerProps, f as SectionBackground, S as SectionProps, g as SectionSpacing } from './community-initiatives-CPyEa7IX.cjs';
+export { c as AboutCultureTabs, p as AboutCultureTabsProps, b as AboutExpandableValues, n as AboutExpandableValuesProps, a as AboutMissionPrinciples, m as AboutMissionPrinciplesProps, A as AboutSplitHero, l as AboutSplitHeroProps, k as AlternatingBlockSection, j as AlternatingBlocksProps, h as AnimatedDialogProps, i as AnimatedDialogSize, C as CommunityInitiatives, o as CommunityInitiativesProps, e as ContainerMaxWidth, d as ContainerProps, q as MediaHoverCtaItem, r as MediaHoverCtaType, M as MediaHoverCtasProps, P as PageHeroBannerProps, f as SectionBackground, S as SectionProps, g as SectionSpacing } from './community-initiatives-Bz_A5vLU.cjs';
 export { MediaHoverCtas } from './media-hover-ctas.cjs';
 export { FooterLinksGrid } from './footer-links-grid.cjs';
 export { FooterSocialNewsletter } from './footer-social-newsletter.cjs';
@@ -30,9 +30,9 @@ export { FooterNavSocial } from './footer-nav-social.cjs';
 export { SocialPlatformName } from '@opensite/hooks/usePlatformFromUrl';
 import 'react';
 import 'react/jsx-runtime';
-import './blocks-tmd_MRJv.cjs';
+import './blocks-Cohq4eio.cjs';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 import '@radix-ui/react-popover';
 import './types-Cs1jk79n.cjs';

package/dist/components.d.ts

@@ -12,7 +12,7 @@ export { CarouselPagination, CarouselPaginationProps } from './carousel-paginati
 export { SocialLinkIcon, SocialLinkIconDynamicIconProps, SocialLinkIconProps } from './social-link-icon.js';
 export { Pressable, PressableProps } from './pressable.js';
 export { AlternatingBlocks } from './alternating-blocks.js';
-export { c as AboutCultureTabs, p as AboutCultureTabsProps, b as AboutExpandableValues, n as AboutExpandableValuesProps, a as AboutMissionPrinciples, m as AboutMissionPrinciplesProps, A as AboutSplitHero, l as AboutSplitHeroProps, k as AlternatingBlockSection, j as AlternatingBlocksProps, h as AnimatedDialogProps, i as AnimatedDialogSize, C as CommunityInitiatives, o as CommunityInitiativesProps, e as ContainerMaxWidth, d as ContainerProps, q as MediaHoverCtaItem, r as MediaHoverCtaType, M as MediaHoverCtasProps, P as PageHeroBannerProps, f as SectionBackground, S as SectionProps, g as SectionSpacing } from './community-initiatives-hxnFe3w6.js';
+export { c as AboutCultureTabs, p as AboutCultureTabsProps, b as AboutExpandableValues, n as AboutExpandableValuesProps, a as AboutMissionPrinciples, m as AboutMissionPrinciplesProps, A as AboutSplitHero, l as AboutSplitHeroProps, k as AlternatingBlockSection, j as AlternatingBlocksProps, h as AnimatedDialogProps, i as AnimatedDialogSize, C as CommunityInitiatives, o as CommunityInitiativesProps, e as ContainerMaxWidth, d as ContainerProps, q as MediaHoverCtaItem, r as MediaHoverCtaType, M as MediaHoverCtasProps, P as PageHeroBannerProps, f as SectionBackground, S as SectionProps, g as SectionSpacing } from './community-initiatives-Bi_ClKrO.js';
 export { MediaHoverCtas } from './media-hover-ctas.js';
 export { FooterLinksGrid } from './footer-links-grid.js';
 export { FooterSocialNewsletter } from './footer-social-newsletter.js';
@@ -30,9 +30,9 @@ export { FooterNavSocial } from './footer-nav-social.js';
 export { SocialPlatformName } from '@opensite/hooks/usePlatformFromUrl';
 import 'react';
 import 'react/jsx-runtime';
-import './blocks-DRE-f6cS.js';
+import './blocks-k17uluAz.js';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 import '@radix-ui/react-popover';
 import './types-Cs1jk79n.js';

package/dist/components.js

@@ -1199,7 +1199,7 @@ function DynamicIcon({
   const { url, iconName } = React4.useMemo(() => {
     const separator = name.includes("/") ? "/" : ":";
     const [prefix, iconName2] = name.split(separator);
-    const baseUrl = `https://icons.opensite.ai/api/icon/${prefix}/${iconName2}?format=svg&width=${size}&height=${size}`;
+    const baseUrl = `https://icons.opensite.ai/api/icon/${prefix}/${iconName2}?format=svg&width=${size}&height=${size}&key=au382bi7fsh96w9h9xlrnat2jglx`;
     return {
       url: baseUrl,
       iconName: iconName2
@@ -4461,7 +4461,8 @@ function FooterContactCard({
   copyrightClassName,
   locationClassName,
   background,
-  spacing,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
+  spacing = "py-6 md:py-32",
   pattern,
   patternOpacity,
   optixFlowConfig
@@ -4474,6 +4475,7 @@ function FooterContactCard({
       pattern,
       patternOpacity,
       className: cn(className),
+      containerClassName,
       children: /* @__PURE__ */ jsx("div", { className: cn(contentClassName), children: /* @__PURE__ */ jsxs("footer", { children: [
         /* @__PURE__ */ jsxs("div", { className: cn("grid gap-12 lg:grid-cols-2", gridClassName), children: [
           /* @__PURE__ */ jsxs("div", { className: cn(leftColumnClassName), children: [
@@ -4486,7 +4488,16 @@ function FooterContactCard({
                 optixFlowConfig
               }
             ),
-            heading && /* @__PURE__ */ jsx("h2", { className: cn("mb-8 text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", headingClassName), children: heading }),
+            heading && /* @__PURE__ */ jsx(
+              "h2",
+              {
+                className: cn(
+                  "mb-8 text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl",
+                  headingClassName
+                ),
+                children: heading
+              }
+            ),
             (email || phone || address) && /* @__PURE__ */ jsxs("div", { className: cn("space-y-4 opacity-80", contactClassName), children: [
               email && /* @__PURE__ */ jsx("p", { children: /* @__PURE__ */ jsx(
                 Pressable,
@@ -4507,51 +4518,90 @@ function FooterContactCard({
               address && /* @__PURE__ */ jsx("p", { children: address })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col justify-between", rightColumnClassName), children: [
-            (socialTitle || socialLinks && socialLinks.length > 0) && /* @__PURE__ */ jsxs("div", { className: cn(socialSectionClassName), children: [
-              socialTitle && /* @__PURE__ */ jsx("p", { className: cn("mb-4 font-medium", socialTitleClassName), children: socialTitle }),
-              socialLinks && socialLinks.length > 0 && /* @__PURE__ */ jsx("ul", { className: cn("flex items-center gap-4", socialLinksClassName), children: socialLinks.map((social, idx) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-                SocialLinkIcon,
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: cn(
+                "flex flex-col justify-between",
+                rightColumnClassName
+              ),
+              children: [
+                (socialTitle || socialLinks && socialLinks.length > 0) && /* @__PURE__ */ jsxs("div", { className: cn(socialSectionClassName), children: [
+                  socialTitle && /* @__PURE__ */ jsx("p", { className: cn("mb-4 font-medium", socialTitleClassName), children: socialTitle }),
+                  socialLinks && socialLinks.length > 0 && /* @__PURE__ */ jsx(
+                    "ul",
+                    {
+                      className: cn(
+                        "flex items-center gap-4",
+                        socialLinksClassName
+                      ),
+                      children: socialLinks.map((social, idx) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+                        SocialLinkIcon,
+                        {
+                          href: social.href,
+                          label: social.label,
+                          iconNameOverride: social.iconNameOverride,
+                          className: cn(
+                            "flex size-12 items-center justify-center rounded-full border transition-colors hover:opacity-80",
+                            socialLinkClassName
+                          )
+                        }
+                      ) }, idx))
+                    }
+                  )
+                ] }),
+                navLinks && navLinks.length > 0 && /* @__PURE__ */ jsx("nav", { className: cn("mt-18 md:mt-8", navClassName), children: /* @__PURE__ */ jsx("ul", { className: "flex flex-wrap gap-6", children: navLinks.map((link, idx) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+                  Pressable,
+                  {
+                    href: link.href,
+                    className: cn(
+                      "opacity-80 hover:opacity-100",
+                      navLinkClassName
+                    ),
+                    children: link.name
+                  }
+                ) }, idx)) }) })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: cn(
+              "mt-16 flex flex-col justify-between gap-4 border-t pt-8 text-sm opacity-80 md:flex-row md:items-center",
+              bottomClassName
+            ),
+            children: [
+              /* @__PURE__ */ jsxs(
+                "div",
                 {
-                  href: social.href,
-                  label: social.label,
-                  iconNameOverride: social.iconNameOverride,
                   className: cn(
-                    "flex size-12 items-center justify-center rounded-full border transition-colors hover:opacity-80",
-                    socialLinkClassName
-                  )
+                    "flex flex-col gap-2 md:flex-row md:items-center md:gap-4",
+                    copyrightClassName
+                  ),
+                  children: [
+                    /* @__PURE__ */ jsx(FooterCopyright, { copyright }),
+                    /* @__PURE__ */ jsx(
+                      BrandAttribution,
+                      {
+                        internalBrandSlug: "open_site_ai",
+                        optionIndex: 7,
+                        variant: "span",
+                        linkClassName: "underline underline-offset-4 transition-colors hover:opacity-100"
+                      }
+                    )
+                  ]
                 }
-              ) }, idx)) })
-            ] }),
-            navLinks && navLinks.length > 0 && /* @__PURE__ */ jsx("nav", { className: cn("mt-8", navClassName), children: /* @__PURE__ */ jsx("ul", { className: "flex flex-wrap gap-6", children: navLinks.map((link, idx) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-              Pressable,
-              {
-                href: link.href,
-                className: cn("opacity-80 hover:opacity-100", navLinkClassName),
-                children: link.name
-              }
-            ) }, idx)) }) })
-          ] })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { className: cn("mt-16 flex flex-col justify-between gap-4 border-t pt-8 text-sm opacity-80 md:flex-row md:items-center", bottomClassName), children: [
-          /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-2 md:flex-row md:items-center md:gap-4", copyrightClassName), children: [
-            /* @__PURE__ */ jsx(FooterCopyright, { copyright }),
-            /* @__PURE__ */ jsx(
-              BrandAttribution,
-              {
-                internalBrandSlug: "open_site_ai",
-                optionIndex: 7,
-                variant: "span",
-                linkClassName: "underline underline-offset-4 transition-colors hover:opacity-100"
-              }
-            )
-          ] }),
-          (locationLabel || location) && /* @__PURE__ */ jsxs("p", { className: cn(locationClassName), children: [
-            locationLabel,
-            " ",
-            location && /* @__PURE__ */ jsx("strong", { children: location })
-          ] })
-        ] })
+              ),
+              (locationLabel || location) && /* @__PURE__ */ jsxs("p", { className: cn(locationClassName), children: [
+                locationLabel,
+                " ",
+                location && /* @__PURE__ */ jsx("strong", { children: location })
+              ] })
+            ]
+          }
+        )
       ] }) })
     }
   );
@@ -4720,7 +4770,8 @@ function FooterAnimatedSocial({
   separatorClassName,
   copyrightClassName,
   background,
-  spacing,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
+  spacing = "py-6 md:py-32",
   pattern,
   patternOpacity
 }) {
@@ -4743,7 +4794,10 @@ function FooterAnimatedSocial({
             label: link.label,
             iconNameOverride: link.iconNameOverride,
             iconSize: 24,
-            className: cn("group flex items-center gap-2 py-2 transition-colors hover:opacity-70", socialLinkClassName)
+            className: cn(
+              "group flex items-center gap-2 py-2 transition-colors hover:opacity-70",
+              socialLinkClassName
+            )
           }
         )
       },
@@ -4758,6 +4812,7 @@ function FooterAnimatedSocial({
       pattern,
       patternOpacity,
       className: cn(className),
+      containerClassName,
       children: /* @__PURE__ */ jsx("div", { className: cn(contentClassName), children: /* @__PURE__ */ jsx("footer", { children: /* @__PURE__ */ jsxs("div", { children: [
         /* @__PURE__ */ jsxs(
           motion.div,
@@ -4766,23 +4821,56 @@ function FooterAnimatedSocial({
             initial: "hidden",
             whileInView: "visible",
             viewport: { once: true },
-            className: cn("flex flex-col justify-between md:flex-row md:items-center", layoutClassName),
+            className: cn(
+              "flex flex-col justify-between md:flex-row md:items-center",
+              layoutClassName
+            ),
             children: [
               /* @__PURE__ */ jsxs("div", { className: cn("space-y-8", leftColumnClassName), children: [
                 /* @__PURE__ */ jsxs(motion.div, { variants: itemVariants, className: "space-y-6", children: [
-                  /* @__PURE__ */ jsx("h2", { className: cn("text-4xl leading-tight font-bold lg:text-5xl", headingClassName), children: heading }),
-                  /* @__PURE__ */ jsx("p", { className: cn("max-w-md text-lg leading-relaxed opacity-80", descriptionClassName), children: description })
+                  /* @__PURE__ */ jsx(
+                    "h2",
+                    {
+                      className: cn(
+                        "text-4xl leading-tight font-bold lg:text-5xl",
+                        headingClassName
+                      ),
+                      children: heading
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    "p",
+                    {
+                      className: cn(
+                        "max-w-md text-lg leading-relaxed opacity-80",
+                        descriptionClassName
+                      ),
+                      children: description
+                    }
+                  )
                 ] }),
                 ctaUrl && ctaText && /* @__PURE__ */ jsx(motion.div, { variants: itemVariants, children: /* @__PURE__ */ jsx(
                   Pressable,
                   {
                     href: ctaUrl,
-                    className: cn("inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border h-11 px-8 hover:opacity-80", ctaClassName),
+                    className: cn(
+                      "inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 border h-11 px-8 hover:opacity-80",
+                      ctaClassName
+                    ),
                     children: ctaText
                   }
                 ) })
               ] }),
-              /* @__PURE__ */ jsx("div", { className: cn("mt-5 space-y-8 md:mt-0", rightColumnClassName), children: /* @__PURE__ */ jsx(motion.div, { variants: itemVariants, children: /* @__PURE__ */ jsx("div", { className: cn("space-y-6", socialLinksClassName), children: socialLinksContent }) }) })
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: cn(
+                    "flex flex-row md:flex-col flex-wrap items-center justify-center gap-4 md:gap-2",
+                    rightColumnClassName
+                  ),
+                  children: /* @__PURE__ */ jsx(motion.div, { variants: itemVariants, children: /* @__PURE__ */ jsx("div", { className: cn("flex flex-row md:flex-col items-center gap-4 md:gap-6", socialLinksClassName), children: socialLinksContent }) })
+                }
+              )
             ]
           }
         ),
@@ -4795,14 +4883,32 @@ function FooterAnimatedSocial({
             viewport: { once: true },
             className: cn("mt-16", bottomClassName),
             children: [
-              /* @__PURE__ */ jsx(motion.div, { variants: itemVariants, children: /* @__PURE__ */ jsx("div", { className: cn("mb-8 h-px w-full opacity-20", separatorClassName), style: { backgroundColor: "currentColor" } }) }),
+              /* @__PURE__ */ jsx(motion.div, { variants: itemVariants, children: /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: cn(
+                    "mb-8 h-px w-full opacity-20",
+                    separatorClassName
+                  ),
+                  style: { backgroundColor: "currentColor" }
+                }
+              ) }),
               /* @__PURE__ */ jsxs(
                 motion.div,
                 {
                   variants: itemVariants,
-                  className: cn("flex flex-col items-start justify-between gap-4 sm:flex-row sm:items-center", copyrightClassName),
+                  className: cn(
+                    "flex flex-col items-start justify-between gap-4 sm:flex-row sm:items-center",
+                    copyrightClassName
+                  ),
                   children: [
-                    /* @__PURE__ */ jsx(FooterCopyright, { copyright, className: "text-sm opacity-70" }),
+                    /* @__PURE__ */ jsx(
+                      FooterCopyright,
+                      {
+                        copyright,
+                        className: "text-sm opacity-70"
+                      }
+                    ),
                     /* @__PURE__ */ jsx("div", { className: "flex items-center gap-6 text-sm opacity-70", children: /* @__PURE__ */ jsx(
                       BrandAttribution,
                       {