@opensite/ui 1.4.1 → 1.4.3

package/dist/footer-social-apps.cjs

@@ -640,7 +640,7 @@ function FooterCopyright({
     currentYear,
     " ",
     copyright,
-    ". All Rights Reserved."
+    " All Rights Reserved."
   ] });
 }
 var brandAttributionOptions = [
@@ -1591,6 +1591,7 @@ var SocialLinkIcon = React__namespace.forwardRef(
       Pressable,
       {
         ref,
+        href,
         "aria-label": accessibleLabel,
         className: cn(
           "inline-flex items-center justify-center transition-colors",
@@ -1622,14 +1623,15 @@ function FooterSocialApps({
   appLabel,
   copyright,
   background,
-  spacing,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
+  spacing = "py-6 md:py-32",
   pattern,
   patternOpacity,
   optixFlowConfig
 }) {
   const sectionsContent = React.useMemo(() => {
     if (!sections || sections.length === 0) return null;
-    return sections.map((section, sectionIdx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+    return sections.map((section, sectionIdx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-8 md:mt-0", children: [
       /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4 font-bold", children: section.title }),
       /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-4", children: section.links.map((link, linkIdx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "font-medium ", children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: link.href, children: link.name }) }, linkIdx)) })
     ] }, sectionIdx));
@@ -1669,6 +1671,7 @@ function FooterSocialApps({
       pattern,
       patternOpacity,
       className: cn(className),
+      containerClassName,
       children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxs("footer", { children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col justify-between gap-10 lg:flex-row lg:gap-20", children: [
           logo && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-6", children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -1676,12 +1679,12 @@ function FooterSocialApps({
             {
               logo,
               logoClassName: "flex items-center gap-2",
-              logoImageClassName: "h-10",
+              logoImageClassName: "w-auto object-contain h-8 md:h-10",
               optixFlowConfig
             }
           ) }),
-          sections && sections.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid flex-1 gap-8 sm:grid-cols-2 md:grid-cols-3", children: sectionsContent }),
-          (socialLinks && socialLinks.length > 0 || appLinks && appLinks.length > 0) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6", children: [
+          sections && sections.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid flex-1 gap-4 md:gap-12 grid-cols-2 md:grid-cols-3", children: sectionsContent }),
+          (socialLinks && socialLinks.length > 0 || appLinks && appLinks.length > 0) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6 md:gap-12", children: [
             socialLinks && socialLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
               socialLabel && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-3 font-bold", children: socialLabel }),
               /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex items-center gap-2", children: socialLinksContent })

package/dist/footer-social-apps.d.cts

@@ -55,6 +55,10 @@ interface FooterSocialAppsProps {
     copyright?: string;
     /** Section background variant */
     background?: SectionBackground;
+    /**
+     * Additional CSS classes for the container
+     */
+    containerClassName?: string;
     /** Section spacing variant */
     spacing?: SectionSpacing;
     /** Optional background pattern */
@@ -74,6 +78,6 @@ interface FooterSocialAppsProps {
  * along with multi-column navigation. Ideal for products with mobile apps, community-focused
  * platforms, and businesses that want to highlight their cross-platform presence.
  */
-declare function FooterSocialApps({ logo, className, sections, socialLinks, appLinks, socialLabel, appLabel, copyright, background, spacing, pattern, patternOpacity, optixFlowConfig, }: FooterSocialAppsProps): React.JSX.Element;
+declare function FooterSocialApps({ logo, className, sections, socialLinks, appLinks, socialLabel, appLabel, copyright, background, containerClassName, spacing, pattern, patternOpacity, optixFlowConfig, }: FooterSocialAppsProps): React.JSX.Element;
 
 export { FooterSocialApps, type FooterSocialAppsAppLink, type FooterSocialAppsProps, type FooterSocialAppsSection };

package/dist/footer-social-apps.d.ts

@@ -55,6 +55,10 @@ interface FooterSocialAppsProps {
     copyright?: string;
     /** Section background variant */
     background?: SectionBackground;
+    /**
+     * Additional CSS classes for the container
+     */
+    containerClassName?: string;
     /** Section spacing variant */
     spacing?: SectionSpacing;
     /** Optional background pattern */
@@ -74,6 +78,6 @@ interface FooterSocialAppsProps {
  * along with multi-column navigation. Ideal for products with mobile apps, community-focused
  * platforms, and businesses that want to highlight their cross-platform presence.
  */
-declare function FooterSocialApps({ logo, className, sections, socialLinks, appLinks, socialLabel, appLabel, copyright, background, spacing, pattern, patternOpacity, optixFlowConfig, }: FooterSocialAppsProps): React.JSX.Element;
+declare function FooterSocialApps({ logo, className, sections, socialLinks, appLinks, socialLabel, appLabel, copyright, background, containerClassName, spacing, pattern, patternOpacity, optixFlowConfig, }: FooterSocialAppsProps): React.JSX.Element;
 
 export { FooterSocialApps, type FooterSocialAppsAppLink, type FooterSocialAppsProps, type FooterSocialAppsSection };

package/dist/footer-social-apps.js

@@ -619,7 +619,7 @@ function FooterCopyright({
     currentYear,
     " ",
     copyright,
-    ". All Rights Reserved."
+    " All Rights Reserved."
   ] });
 }
 var brandAttributionOptions = [
@@ -1570,6 +1570,7 @@ var SocialLinkIcon = React.forwardRef(
       Pressable,
       {
         ref,
+        href,
         "aria-label": accessibleLabel,
         className: cn(
           "inline-flex items-center justify-center transition-colors",
@@ -1601,14 +1602,15 @@ function FooterSocialApps({
   appLabel,
   copyright,
   background,
-  spacing,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
+  spacing = "py-6 md:py-32",
   pattern,
   patternOpacity,
   optixFlowConfig
 }) {
   const sectionsContent = useMemo(() => {
     if (!sections || sections.length === 0) return null;
-    return sections.map((section, sectionIdx) => /* @__PURE__ */ jsxs("div", { children: [
+    return sections.map((section, sectionIdx) => /* @__PURE__ */ jsxs("div", { className: "mt-8 md:mt-0", children: [
       /* @__PURE__ */ jsx("h3", { className: "mb-4 font-bold", children: section.title }),
       /* @__PURE__ */ jsx("ul", { className: "space-y-4", children: section.links.map((link, linkIdx) => /* @__PURE__ */ jsx("li", { className: "font-medium ", children: /* @__PURE__ */ jsx(Pressable, { href: link.href, children: link.name }) }, linkIdx)) })
     ] }, sectionIdx));
@@ -1648,6 +1650,7 @@ function FooterSocialApps({
       pattern,
       patternOpacity,
       className: cn(className),
+      containerClassName,
       children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("footer", { children: [
         /* @__PURE__ */ jsxs("div", { className: "flex flex-col justify-between gap-10 lg:flex-row lg:gap-20", children: [
           logo && /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-6", children: /* @__PURE__ */ jsx(
@@ -1655,12 +1658,12 @@ function FooterSocialApps({
             {
               logo,
               logoClassName: "flex items-center gap-2",
-              logoImageClassName: "h-10",
+              logoImageClassName: "w-auto object-contain h-8 md:h-10",
               optixFlowConfig
             }
           ) }),
-          sections && sections.length > 0 && /* @__PURE__ */ jsx("div", { className: "grid flex-1 gap-8 sm:grid-cols-2 md:grid-cols-3", children: sectionsContent }),
-          (socialLinks && socialLinks.length > 0 || appLinks && appLinks.length > 0) && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
+          sections && sections.length > 0 && /* @__PURE__ */ jsx("div", { className: "grid flex-1 gap-4 md:gap-12 grid-cols-2 md:grid-cols-3", children: sectionsContent }),
+          (socialLinks && socialLinks.length > 0 || appLinks && appLinks.length > 0) && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6 md:gap-12", children: [
             socialLinks && socialLinks.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
               socialLabel && /* @__PURE__ */ jsx("p", { className: "mb-3 font-bold", children: socialLabel }),
               /* @__PURE__ */ jsx("ul", { className: "flex items-center gap-2", children: socialLinksContent })

package/dist/footer-social-newsletter.cjs

@@ -535,7 +535,7 @@ function FooterCopyright({
     currentYear,
     " ",
     copyright,
-    ". All Rights Reserved."
+    " All Rights Reserved."
   ] });
 }
 var brandAttributionOptions = [
@@ -1591,6 +1591,7 @@ var SocialLinkIcon = React__namespace.forwardRef(
       Pressable,
       {
         ref,
+        href,
         "aria-label": accessibleLabel,
         className: cn(
           "inline-flex items-center justify-center transition-colors",

package/dist/footer-social-newsletter.js

@@ -514,7 +514,7 @@ function FooterCopyright({
     currentYear,
     " ",
     copyright,
-    ". All Rights Reserved."
+    " All Rights Reserved."
   ] });
 }
 var brandAttributionOptions = [
@@ -1570,6 +1570,7 @@ var SocialLinkIcon = React.forwardRef(
       Pressable,
       {
         ref,
+        href,
         "aria-label": accessibleLabel,
         className: cn(
           "inline-flex items-center justify-center transition-colors",

package/dist/footer-split-image-accordion.cjs

@@ -541,7 +541,7 @@ function FooterCopyright({
     currentYear,
     " ",
     copyright,
-    ". All Rights Reserved."
+    " All Rights Reserved."
   ] });
 }
 var brandAttributionOptions = [
@@ -1222,6 +1222,7 @@ var SocialLinkIcon = React__namespace.forwardRef(
       Pressable,
       {
         ref,
+        href,
         "aria-label": accessibleLabel,
         className: cn(
           "inline-flex items-center justify-center transition-colors",

package/dist/footer-split-image-accordion.js

@@ -519,7 +519,7 @@ function FooterCopyright({
     currentYear,
     " ",
     copyright,
-    ". All Rights Reserved."
+    " All Rights Reserved."
   ] });
 }
 var brandAttributionOptions = [
@@ -1200,6 +1200,7 @@ var SocialLinkIcon = React.forwardRef(
       Pressable,
       {
         ref,
+        href,
         "aria-label": accessibleLabel,
         className: cn(
           "inline-flex items-center justify-center transition-colors",

package/dist/index.cjs

@@ -1735,6 +1735,7 @@ var SocialLinkIcon = React4__namespace.forwardRef(
       Pressable,
       {
         ref,
+        href,
         "aria-label": accessibleLabel,
         className: cn(
           "inline-flex items-center justify-center transition-colors",
@@ -3005,7 +3006,7 @@ function FooterCopyright({
     currentYear,
     " ",
     copyright,
-    ". All Rights Reserved."
+    " All Rights Reserved."
   ] });
 }
 var brandAttributionOptions = [
@@ -3548,7 +3549,7 @@ function FooterLinksGrid({
       className: cn(className),
       containerClassName,
       children: /* @__PURE__ */ jsxRuntime.jsxs("footer", { children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4 md:gap-8 md:grid-cols-6", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-8 md:grid-cols-6", children: [
           (logo || tagline) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex space-y-2 col-span-2 flex-col mb-6 md:mb-0 pr-0 md:pr-6", children: [
             logo && /* @__PURE__ */ jsxRuntime.jsx(
               FooterLogo,
@@ -3558,7 +3559,7 @@ function FooterLinksGrid({
                 optixFlowConfig
               }
             ),
-            tagline && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-4 font-bold", children: tagline })
+            tagline && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-4", children: tagline })
           ] }),
           menuItems && menuItems.length > 0 && menuItems.map((section, sectionIdx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
             /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4 font-bold", children: section.title }),
@@ -3578,7 +3579,7 @@ function FooterLinksGrid({
               }
             )
           ] }),
-          bottomLinks && bottomLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex gap-4", children: bottomLinks.map((link, linkIdx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "underline", children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: link.url, children: link.text }) }, linkIdx)) })
+          bottomLinks && bottomLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "pt-4 md:pt-0 gap-4 grid md:flex grid-cols-2 items-center", children: bottomLinks.map((link, linkIdx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "underline", children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: link.url, children: link.text }) }, linkIdx)) })
         ] })
       ] })
     }
@@ -3787,14 +3788,15 @@ function FooterSocialApps({
   appLabel,
   copyright,
   background,
-  spacing,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
+  spacing = "py-6 md:py-32",
   pattern,
   patternOpacity,
   optixFlowConfig
 }) {
   const sectionsContent = React4.useMemo(() => {
     if (!sections || sections.length === 0) return null;
-    return sections.map((section, sectionIdx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+    return sections.map((section, sectionIdx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-8 md:mt-0", children: [
       /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4 font-bold", children: section.title }),
       /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "space-y-4", children: section.links.map((link, linkIdx) => /* @__PURE__ */ jsxRuntime.jsx("li", { className: "font-medium ", children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: link.href, children: link.name }) }, linkIdx)) })
     ] }, sectionIdx));
@@ -3834,6 +3836,7 @@ function FooterSocialApps({
       pattern,
       patternOpacity,
       className: cn(className),
+      containerClassName,
       children: /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxs("footer", { children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col justify-between gap-10 lg:flex-row lg:gap-20", children: [
           logo && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-6", children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -3841,12 +3844,12 @@ function FooterSocialApps({
             {
               logo,
               logoClassName: "flex items-center gap-2",
-              logoImageClassName: "h-10",
+              logoImageClassName: "w-auto object-contain h-8 md:h-10",
               optixFlowConfig
             }
           ) }),
-          sections && sections.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid flex-1 gap-8 sm:grid-cols-2 md:grid-cols-3", children: sectionsContent }),
-          (socialLinks && socialLinks.length > 0 || appLinks && appLinks.length > 0) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6", children: [
+          sections && sections.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid flex-1 gap-4 md:gap-12 grid-cols-2 md:grid-cols-3", children: sectionsContent }),
+          (socialLinks && socialLinks.length > 0 || appLinks && appLinks.length > 0) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6 md:gap-12", children: [
             socialLinks && socialLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
               socialLabel && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-3 font-bold", children: socialLabel }),
               /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex items-center gap-2", children: socialLinksContent })
@@ -3927,20 +3930,17 @@ function FooterSimpleCentered({
   ]);
   const bottomLinksContent = React4.useMemo(() => {
     if (!bottomLinks || bottomLinks.length === 0) return null;
-    return bottomLinks.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsxs(React4__namespace.Fragment, { children: [
-      idx > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "opacity-70", children: "\u2022" }),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        Pressable,
-        {
-          href: link.href,
-          className: cn(
-            "text-sm opacity-80 transition-colors hover:opacity-100",
-            bottomLinkClassName
-          ),
-          children: link.text
-        }
-      )
-    ] }, link.href));
+    return bottomLinks.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx(React4__namespace.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(
+      Pressable,
+      {
+        href: link.href,
+        className: cn(
+          "text-sm opacity-80 transition-colors hover:opacity-100",
+          bottomLinkClassName
+        ),
+        children: link.text
+      }
+    ) }, link.href));
   }, [bottomLinks, bottomLinkClassName]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
@@ -4026,7 +4026,7 @@ function FooterSimpleCentered({
                 "div",
                 {
                   className: cn(
-                    "flex flex-col items-start gap-4 text-xs sm:text-sm md:flex-row lg:items-center",
+                    "pt-4 md:pt-0 gap-4 grid md:flex grid-cols-2 items-center w-full md:w-fit",
                     bottomLinksClassName
                   ),
                   children: bottomLinksContent
@@ -4118,7 +4118,7 @@ function FooterBrandDescription({
                       "p",
                       {
                         className: cn(
-                          "max-w-[70%] text-sm opacity-80",
+                          "max-w-full md:max-w-[70%] text-sm opacity-80",
                           descriptionClassName
                         ),
                         children: description
@@ -4152,7 +4152,7 @@ function FooterBrandDescription({
                 "div",
                 {
                   className: cn(
-                    "grid w-full gap-6 md:grid-cols-3 lg:gap-20",
+                    "grid w-full gap-6 grid-cols-2 md:grid-cols-3 lg:gap-20",
                     navGridClassName
                   ),
                   children: sections.map((section, sectionIdx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn(navSectionClassName), children: [
@@ -4187,7 +4187,7 @@ function FooterBrandDescription({
           "div",
           {
             className: cn(
-              "mt-8 flex flex-col justify-between gap-4 border-t py-8 text-xs font-medium opacity-70 md:flex-row md:items-center md:text-left",
+              "mt-8 flex flex-col justify-between gap-8 md:gap-4 border-t py-8 text-xs font-medium opacity-70 md:flex-row md:items-center md:text-left",
               bottomClassName
             ),
             children: [
@@ -4216,7 +4216,7 @@ function FooterBrandDescription({
                 "ul",
                 {
                   className: cn(
-                    "order-1 flex flex-col gap-2 md:order-2 md:flex-row",
+                    "order-1 md:order-2 pt-4 md:pt-0 gap-4 grid md:flex grid-cols-2 items-center",
                     legalLinksClassName
                   ),
                   children: legalLinks.map((link, idx) => /* @__PURE__ */ jsxRuntime.jsx(

package/dist/index.js

@@ -1712,6 +1712,7 @@ var SocialLinkIcon = React4.forwardRef(
       Pressable,
       {
         ref,
+        href,
         "aria-label": accessibleLabel,
         className: cn(
           "inline-flex items-center justify-center transition-colors",
@@ -2982,7 +2983,7 @@ function FooterCopyright({
     currentYear,
     " ",
     copyright,
-    ". All Rights Reserved."
+    " All Rights Reserved."
   ] });
 }
 var brandAttributionOptions = [
@@ -3525,7 +3526,7 @@ function FooterLinksGrid({
       className: cn(className),
       containerClassName,
       children: /* @__PURE__ */ jsxs("footer", { children: [
-        /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4 md:gap-8 md:grid-cols-6", children: [
+        /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-8 md:grid-cols-6", children: [
           (logo || tagline) && /* @__PURE__ */ jsxs("div", { className: "flex space-y-2 col-span-2 flex-col mb-6 md:mb-0 pr-0 md:pr-6", children: [
             logo && /* @__PURE__ */ jsx(
               FooterLogo,
@@ -3535,7 +3536,7 @@ function FooterLinksGrid({
                 optixFlowConfig
               }
             ),
-            tagline && /* @__PURE__ */ jsx("p", { className: "mt-4 font-bold", children: tagline })
+            tagline && /* @__PURE__ */ jsx("p", { className: "mt-4", children: tagline })
           ] }),
           menuItems && menuItems.length > 0 && menuItems.map((section, sectionIdx) => /* @__PURE__ */ jsxs("div", { children: [
             /* @__PURE__ */ jsx("h3", { className: "mb-4 font-bold", children: section.title }),
@@ -3555,7 +3556,7 @@ function FooterLinksGrid({
               }
             )
           ] }),
-          bottomLinks && bottomLinks.length > 0 && /* @__PURE__ */ jsx("ul", { className: "flex gap-4", children: bottomLinks.map((link, linkIdx) => /* @__PURE__ */ jsx("li", { className: "underline", children: /* @__PURE__ */ jsx(Pressable, { href: link.url, children: link.text }) }, linkIdx)) })
+          bottomLinks && bottomLinks.length > 0 && /* @__PURE__ */ jsx("ul", { className: "pt-4 md:pt-0 gap-4 grid md:flex grid-cols-2 items-center", children: bottomLinks.map((link, linkIdx) => /* @__PURE__ */ jsx("li", { className: "underline", children: /* @__PURE__ */ jsx(Pressable, { href: link.url, children: link.text }) }, linkIdx)) })
         ] })
       ] })
     }
@@ -3764,14 +3765,15 @@ function FooterSocialApps({
   appLabel,
   copyright,
   background,
-  spacing,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
+  spacing = "py-6 md:py-32",
   pattern,
   patternOpacity,
   optixFlowConfig
 }) {
   const sectionsContent = useMemo(() => {
     if (!sections || sections.length === 0) return null;
-    return sections.map((section, sectionIdx) => /* @__PURE__ */ jsxs("div", { children: [
+    return sections.map((section, sectionIdx) => /* @__PURE__ */ jsxs("div", { className: "mt-8 md:mt-0", children: [
       /* @__PURE__ */ jsx("h3", { className: "mb-4 font-bold", children: section.title }),
       /* @__PURE__ */ jsx("ul", { className: "space-y-4", children: section.links.map((link, linkIdx) => /* @__PURE__ */ jsx("li", { className: "font-medium ", children: /* @__PURE__ */ jsx(Pressable, { href: link.href, children: link.name }) }, linkIdx)) })
     ] }, sectionIdx));
@@ -3811,6 +3813,7 @@ function FooterSocialApps({
       pattern,
       patternOpacity,
       className: cn(className),
+      containerClassName,
       children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsxs("footer", { children: [
         /* @__PURE__ */ jsxs("div", { className: "flex flex-col justify-between gap-10 lg:flex-row lg:gap-20", children: [
           logo && /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-6", children: /* @__PURE__ */ jsx(
@@ -3818,12 +3821,12 @@ function FooterSocialApps({
             {
               logo,
               logoClassName: "flex items-center gap-2",
-              logoImageClassName: "h-10",
+              logoImageClassName: "w-auto object-contain h-8 md:h-10",
               optixFlowConfig
             }
           ) }),
-          sections && sections.length > 0 && /* @__PURE__ */ jsx("div", { className: "grid flex-1 gap-8 sm:grid-cols-2 md:grid-cols-3", children: sectionsContent }),
-          (socialLinks && socialLinks.length > 0 || appLinks && appLinks.length > 0) && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
+          sections && sections.length > 0 && /* @__PURE__ */ jsx("div", { className: "grid flex-1 gap-4 md:gap-12 grid-cols-2 md:grid-cols-3", children: sectionsContent }),
+          (socialLinks && socialLinks.length > 0 || appLinks && appLinks.length > 0) && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6 md:gap-12", children: [
             socialLinks && socialLinks.length > 0 && /* @__PURE__ */ jsxs("div", { children: [
               socialLabel && /* @__PURE__ */ jsx("p", { className: "mb-3 font-bold", children: socialLabel }),
               /* @__PURE__ */ jsx("ul", { className: "flex items-center gap-2", children: socialLinksContent })
@@ -3904,20 +3907,17 @@ function FooterSimpleCentered({
   ]);
   const bottomLinksContent = useMemo(() => {
     if (!bottomLinks || bottomLinks.length === 0) return null;
-    return bottomLinks.map((link, idx) => /* @__PURE__ */ jsxs(React4.Fragment, { children: [
-      idx > 0 && /* @__PURE__ */ jsx("span", { className: "opacity-70", children: "\u2022" }),
-      /* @__PURE__ */ jsx(
-        Pressable,
-        {
-          href: link.href,
-          className: cn(
-            "text-sm opacity-80 transition-colors hover:opacity-100",
-            bottomLinkClassName
-          ),
-          children: link.text
-        }
-      )
-    ] }, link.href));
+    return bottomLinks.map((link, idx) => /* @__PURE__ */ jsx(React4.Fragment, { children: /* @__PURE__ */ jsx(
+      Pressable,
+      {
+        href: link.href,
+        className: cn(
+          "text-sm opacity-80 transition-colors hover:opacity-100",
+          bottomLinkClassName
+        ),
+        children: link.text
+      }
+    ) }, link.href));
   }, [bottomLinks, bottomLinkClassName]);
   return /* @__PURE__ */ jsx(
     Section,
@@ -4003,7 +4003,7 @@ function FooterSimpleCentered({
                 "div",
                 {
                   className: cn(
-                    "flex flex-col items-start gap-4 text-xs sm:text-sm md:flex-row lg:items-center",
+                    "pt-4 md:pt-0 gap-4 grid md:flex grid-cols-2 items-center w-full md:w-fit",
                     bottomLinksClassName
                   ),
                   children: bottomLinksContent
@@ -4095,7 +4095,7 @@ function FooterBrandDescription({
                       "p",
                       {
                         className: cn(
-                          "max-w-[70%] text-sm opacity-80",
+                          "max-w-full md:max-w-[70%] text-sm opacity-80",
                           descriptionClassName
                         ),
                         children: description
@@ -4129,7 +4129,7 @@ function FooterBrandDescription({
                 "div",
                 {
                   className: cn(
-                    "grid w-full gap-6 md:grid-cols-3 lg:gap-20",
+                    "grid w-full gap-6 grid-cols-2 md:grid-cols-3 lg:gap-20",
                     navGridClassName
                   ),
                   children: sections.map((section, sectionIdx) => /* @__PURE__ */ jsxs("div", { className: cn(navSectionClassName), children: [
@@ -4164,7 +4164,7 @@ function FooterBrandDescription({
           "div",
           {
             className: cn(
-              "mt-8 flex flex-col justify-between gap-4 border-t py-8 text-xs font-medium opacity-70 md:flex-row md:items-center md:text-left",
+              "mt-8 flex flex-col justify-between gap-8 md:gap-4 border-t py-8 text-xs font-medium opacity-70 md:flex-row md:items-center md:text-left",
               bottomClassName
             ),
             children: [
@@ -4193,7 +4193,7 @@ function FooterBrandDescription({
                 "ul",
                 {
                   className: cn(
-                    "order-1 flex flex-col gap-2 md:order-2 md:flex-row",
+                    "order-1 md:order-2 pt-4 md:pt-0 gap-4 grid md:flex grid-cols-2 items-center",
                     legalLinksClassName
                   ),
                   children: legalLinks.map((link, idx) => /* @__PURE__ */ jsx(

package/dist/navbar-fullscreen-menu.cjs

@@ -1048,6 +1048,7 @@ var SocialLinkIcon = React__namespace.forwardRef(
       Pressable,
       {
         ref,
+        href,
         "aria-label": accessibleLabel,
         className: cn(
           "inline-flex items-center justify-center transition-colors",

package/dist/navbar-fullscreen-menu.js

@@ -1027,6 +1027,7 @@ var SocialLinkIcon = React.forwardRef(
       Pressable,
       {
         ref,
+        href,
         "aria-label": accessibleLabel,
         className: cn(
           "inline-flex items-center justify-center transition-colors",

package/dist/navbar-transparent-overlay.cjs

@@ -1120,6 +1120,7 @@ var SocialLinkIcon = React__namespace.forwardRef(
       Pressable,
       {
         ref,
+        href,
         "aria-label": accessibleLabel,
         className: cn(
           "inline-flex items-center justify-center transition-colors",

package/dist/navbar-transparent-overlay.js

@@ -1098,6 +1098,7 @@ var SocialLinkIcon = React.forwardRef(
       Pressable,
       {
         ref,
+        href,
         "aria-label": accessibleLabel,
         className: cn(
           "inline-flex items-center justify-center transition-colors",