@opensite/ui 1.0.8 → 1.1.0

package/dist/navbar-image-preview.js

@@ -6,6 +6,7 @@ import { twMerge } from 'tailwind-merge';
 import { cva } from 'class-variance-authority';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { Img } from '@page-speed/img';
+import * as AccordionPrimitive from '@radix-ui/react-accordion';
 import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu';
 
 // components/blocks/navbars/navbar-image-preview.tsx
@@ -970,6 +971,66 @@ var NavbarLogo = ({
     }
   );
 };
+function Accordion({
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(AccordionPrimitive.Root, { "data-slot": "accordion", ...props });
+}
+function AccordionItem({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    AccordionPrimitive.Item,
+    {
+      "data-slot": "accordion-item",
+      className: cn("border-b ", className),
+      ...props
+    }
+  );
+}
+function AccordionTrigger({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(AccordionPrimitive.Header, { className: "flex", children: /* @__PURE__ */ jsxs(
+    AccordionPrimitive.Trigger,
+    {
+      "data-slot": "accordion-trigger",
+      className: cn(
+        "focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-center justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(
+          DynamicIcon,
+          {
+            name: "lucide/chevron-down",
+            className: "text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200"
+          }
+        )
+      ]
+    }
+  ) });
+}
+function AccordionContent({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    AccordionPrimitive.Content,
+    {
+      "data-slot": "accordion-content",
+      className: "data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm",
+      ...props,
+      children: /* @__PURE__ */ jsx("div", { className: cn("pt-0 pb-4", className), children })
+    }
+  );
+}
 function NavigationMenu({
   className,
   children,
@@ -1114,6 +1175,7 @@ var NavbarMobileMenu = ({
   children,
   className,
   contentClassName,
+  closeContainerClassName = "",
   title = "Mobile Navigation"
 }) => {
   React.useEffect(() => {
@@ -1138,18 +1200,27 @@ var NavbarMobileMenu = ({
       "data-state": open ? "open" : "closed",
       children: [
         /* @__PURE__ */ jsx("div", { className: "sr-only", children: /* @__PURE__ */ jsx("h2", { children: title }) }),
-        /* @__PURE__ */ jsx("div", { className: "absolute top-4 right-4 z-10", children: /* @__PURE__ */ jsxs(
-          "button",
+        /* @__PURE__ */ jsx(
+          "div",
           {
-            onClick: onClose,
-            className: "flex size-10 items-center justify-center rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none",
-            "aria-label": "Close mobile menu",
-            children: [
-              /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
-              /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
-            ]
+            className: cn(
+              closeContainerClassName,
+              "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
+            ),
+            children: /* @__PURE__ */ jsxs(
+              "button",
+              {
+                onClick: onClose,
+                className: "flex size-10 items-center justify-center rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none",
+                "aria-label": "Close mobile menu",
+                children: [
+                  /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
+                  /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
+                ]
+              }
+            )
           }
-        ) }),
+        ),
         /* @__PURE__ */ jsx(
           "div",
           {
@@ -1485,41 +1556,17 @@ var MobileNavigationMenu = ({
   authActions,
   authActionsSlot
 }) => {
-  const renderMobileNavigation = useMemo(() => {
-    if (mobileNavigationSlot) return mobileNavigationSlot;
-    if (!mobileNavigation || mobileNavigation.length === 0) return null;
-    return /* @__PURE__ */ jsx("div", { className: "grid w-full grid-cols-1 gap-x-4 gap-y-10", children: mobileNavigation.map((item, index) => /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: cn("flex flex-col gap-4 ", item.className),
-        children: [
-          /* @__PURE__ */ jsx("div", { className: "text-xs uppercase", children: item.title }),
-          /* @__PURE__ */ jsx("ul", { className: "flex flex-col gap-3", children: item.links?.map((link, i) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
-            Pressable,
-            {
-              href: getLinkUrl(link),
-              className: cn(
-                "leading-normal font-medium",
-                index === 0 ? "" : "text-base"
-              ),
-              children: link.label
-            }
-          ) }, `mobile-nav-link-${i}`)) })
-        ]
-      },
-      `mobile-menu-item-${index}`
-    )) });
-  }, [mobileNavigationSlot, mobileNavigation]);
+  const handleClose = () => setOpen(false);
   const renderSocialLinks = useMemo(() => {
     if (socialLinksSlot) return socialLinksSlot;
     if (!socialLinks || socialLinks.length === 0) return null;
-    return /* @__PURE__ */ jsxs("div", { className: "col-span-2 flex flex-col gap-4", children: [
-      /* @__PURE__ */ jsx("div", { className: "text-xs uppercase", children: "SOCIAL" }),
-      /* @__PURE__ */ jsx("div", { className: "flex gap-4", children: socialLinks.map((link, index) => /* @__PURE__ */ jsxs(
+    return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 mt-6", children: [
+      /* @__PURE__ */ jsx("div", { className: "px-4 text-[10px] text-muted-foreground uppercase", children: "SOCIAL" }),
+      /* @__PURE__ */ jsx("div", { className: "flex gap-4 px-4", children: socialLinks.map((link, index) => /* @__PURE__ */ jsxs(
         Pressable,
         {
           href: link.url,
-          className: "",
+          onClick: handleClose,
           children: [
             link.icon ?? (link.iconName && /* @__PURE__ */ jsx(DynamicIcon, { name: link.iconName, size: 20 })),
             !link.icon && !link.iconName && link.label
@@ -1528,11 +1575,11 @@ var MobileNavigationMenu = ({
         `social-link-${index}`
       )) })
     ] });
-  }, [socialLinksSlot, socialLinks]);
+  }, [socialLinksSlot, socialLinks, handleClose]);
   const renderMobileAuthActions = useMemo(() => {
     if (authActionsSlot) return authActionsSlot;
     if (!authActions || authActions.length === 0) return null;
-    return /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-2", children: authActions.map((action, index) => {
+    return /* @__PURE__ */ jsx("div", { className: "flex flex-col gap-4 mt-6", children: authActions.map((action, index) => {
       const {
         label,
         icon,
@@ -1546,6 +1593,7 @@ var MobileNavigationMenu = ({
         {
           asButton: true,
           className: cn("w-full", actionClassName),
+          onClick: handleClose,
           ...pressableProps,
           children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
             icon,
@@ -1556,20 +1604,63 @@ var MobileNavigationMenu = ({
         index
       );
     }) });
-  }, [authActionsSlot, authActions]);
-  return /* @__PURE__ */ jsx(
-    NavbarMobileMenu,
-    {
-      open,
-      onClose: () => setOpen(false),
-      title: "Mobile Navigation",
-      children: /* @__PURE__ */ jsx("div", { className: "max-w-screen-sm mx-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col justify-between gap-30", children: [
-        renderMobileNavigation,
-        renderSocialLinks,
-        renderMobileAuthActions
-      ] }) })
-    }
-  );
+  }, [authActionsSlot, authActions, handleClose]);
+  if (mobileNavigationSlot) {
+    return /* @__PURE__ */ jsx(NavbarMobileMenu, { open, onClose: handleClose, title: "Mobile Navigation", children: /* @__PURE__ */ jsx("div", { className: "max-w-screen-sm mx-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
+      mobileNavigationSlot,
+      renderSocialLinks,
+      renderMobileAuthActions
+    ] }) }) });
+  }
+  return /* @__PURE__ */ jsx(NavbarMobileMenu, { open, onClose: handleClose, title: "Mobile Navigation", children: /* @__PURE__ */ jsx("div", { className: "max-w-screen-sm mx-auto", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
+    /* @__PURE__ */ jsx(Accordion, { type: "multiple", className: "w-full", children: mobileNavigation.map((item, index) => {
+      if (item.links && item.links.length > 0) {
+        return /* @__PURE__ */ jsxs(
+          AccordionItem,
+          {
+            value: `nav-${index}`,
+            className: "border-b-0",
+            children: [
+              /* @__PURE__ */ jsx(AccordionTrigger, { className: "h-15 items-center p-0 px-4! text-base leading-[3.75] font-normal text-muted-foreground hover:bg-muted hover:no-underline", children: item.title }),
+              /* @__PURE__ */ jsx(AccordionContent, { className: "overflow-x-none", children: item.links.map((link, linkIndex) => /* @__PURE__ */ jsxs(
+                Pressable,
+                {
+                  href: getLinkUrl(link),
+                  className: "flex min-h-12 items-center gap-2 rounded-lg px-4 text-muted-foreground transition-colors duration-300 hover:bg-muted hover:text-foreground",
+                  onClick: handleClose,
+                  children: [
+                    link.icon ? link.icon : link.iconName ? /* @__PURE__ */ jsx(
+                      DynamicIcon,
+                      {
+                        name: link.iconName,
+                        size: 16,
+                        className: "stroke-muted-foreground"
+                      }
+                    ) : null,
+                    link.label
+                  ]
+                },
+                `mobile-link-${linkIndex}`
+              )) })
+            ]
+          },
+          `nav-item-${index}`
+        );
+      }
+      return /* @__PURE__ */ jsx(
+        Pressable,
+        {
+          href: item.url,
+          className: "flex h-15 items-center rounded-md p-0 px-4 text-left text-base leading-[3.75] font-normal text-muted-foreground ring-ring/10 outline-ring/50 transition-all hover:bg-muted focus-visible:ring-4 focus-visible:outline-1",
+          onClick: handleClose,
+          children: item.title
+        },
+        `nav-link-${index}`
+      );
+    }) }),
+    renderSocialLinks,
+    renderMobileAuthActions
+  ] }) }) });
 };
 
 export { NavbarImagePreview };

package/dist/navbar-mega-menu.cjs

@@ -1198,6 +1198,7 @@ var NavbarMobileMenu = ({
   children,
   className,
   contentClassName,
+  closeContainerClassName = "",
   title = "Mobile Navigation"
 }) => {
   React__namespace.useEffect(() => {
@@ -1222,18 +1223,27 @@ var NavbarMobileMenu = ({
       "data-state": open ? "open" : "closed",
       children: [
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "sr-only", children: /* @__PURE__ */ jsxRuntime.jsx("h2", { children: title }) }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-4 right-4 z-10", children: /* @__PURE__ */ jsxRuntime.jsxs(
-          "button",
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
           {
-            onClick: onClose,
-            className: "flex size-10 items-center justify-center rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none",
-            "aria-label": "Close mobile menu",
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
-            ]
+            className: cn(
+              closeContainerClassName,
+              "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
+            ),
+            children: /* @__PURE__ */ jsxRuntime.jsxs(
+              "button",
+              {
+                onClick: onClose,
+                className: "flex size-10 items-center justify-center rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none",
+                "aria-label": "Close mobile menu",
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
+                ]
+              }
+            )
           }
-        ) }),
+        ),
         /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {

package/dist/navbar-mega-menu.d.cts

@@ -1,11 +1,11 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-r_NhxVet.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
 import { L as LogoConfig, I as IMenuLink, N as NavbarLayoutVariant } from './types-COVDidbn.cjs';
 export { b as ILinkItem, a as IMenuLinkGroup, M as MegaMenuLayout } from './types-COVDidbn.cjs';
-import { A as ActionConfig, O as OptixFlowConfig } from './blocks-DP3Vofl4.cjs';
+import { A as ActionConfig, O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 
 /**

package/dist/navbar-mega-menu.d.ts

@@ -1,11 +1,11 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DmVsuoHE.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
 import { L as LogoConfig, I as IMenuLink, N as NavbarLayoutVariant } from './types-COVDidbn.js';
 export { b as ILinkItem, a as IMenuLinkGroup, M as MegaMenuLayout } from './types-COVDidbn.js';
-import { A as ActionConfig, O as OptixFlowConfig } from './blocks-XLPGq8A5.js';
+import { A as ActionConfig, O as OptixFlowConfig } from './blocks-k17uluAz.js';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 
 /**

package/dist/navbar-mega-menu.js

@@ -1175,6 +1175,7 @@ var NavbarMobileMenu = ({
   children,
   className,
   contentClassName,
+  closeContainerClassName = "",
   title = "Mobile Navigation"
 }) => {
   React.useEffect(() => {
@@ -1199,18 +1200,27 @@ var NavbarMobileMenu = ({
       "data-state": open ? "open" : "closed",
       children: [
         /* @__PURE__ */ jsx("div", { className: "sr-only", children: /* @__PURE__ */ jsx("h2", { children: title }) }),
-        /* @__PURE__ */ jsx("div", { className: "absolute top-4 right-4 z-10", children: /* @__PURE__ */ jsxs(
-          "button",
+        /* @__PURE__ */ jsx(
+          "div",
           {
-            onClick: onClose,
-            className: "flex size-10 items-center justify-center rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none",
-            "aria-label": "Close mobile menu",
-            children: [
-              /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
-              /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
-            ]
+            className: cn(
+              closeContainerClassName,
+              "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
+            ),
+            children: /* @__PURE__ */ jsxs(
+              "button",
+              {
+                onClick: onClose,
+                className: "flex size-10 items-center justify-center rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none",
+                "aria-label": "Close mobile menu",
+                children: [
+                  /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
+                  /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
+                ]
+              }
+            )
           }
-        ) }),
+        ),
         /* @__PURE__ */ jsx(
           "div",
           {

package/dist/navbar-multi-column-groups.cjs

@@ -1198,6 +1198,7 @@ var NavbarMobileMenu = ({
   children,
   className,
   contentClassName,
+  closeContainerClassName = "",
   title = "Mobile Navigation"
 }) => {
   React__namespace.useEffect(() => {
@@ -1222,18 +1223,27 @@ var NavbarMobileMenu = ({
       "data-state": open ? "open" : "closed",
       children: [
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "sr-only", children: /* @__PURE__ */ jsxRuntime.jsx("h2", { children: title }) }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-4 right-4 z-10", children: /* @__PURE__ */ jsxRuntime.jsxs(
-          "button",
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
           {
-            onClick: onClose,
-            className: "flex size-10 items-center justify-center rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none",
-            "aria-label": "Close mobile menu",
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
-              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
-            ]
+            className: cn(
+              closeContainerClassName,
+              "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen"
+            ),
+            children: /* @__PURE__ */ jsxRuntime.jsxs(
+              "button",
+              {
+                onClick: onClose,
+                className: "flex size-10 items-center justify-center rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none",
+                "aria-label": "Close mobile menu",
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", className: "size-4" }),
+                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Close" })
+                ]
+              }
+            )
           }
-        ) }),
+        ),
         /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
@@ -1455,8 +1465,8 @@ var NavbarMultiColumnGroups = ({
         open,
         setOpen,
         navigation: navigation ?? [],
-        authActions: mobileAuthActions,
-        authActionsSlot: mobileAuthActionsSlot
+        authActions: mobileAuthActions ?? authActions,
+        authActionsSlot: mobileAuthActionsSlot ?? authActionsSlot
       }
     )
   ] });
@@ -1507,10 +1517,11 @@ var MobileNavigationMenu = ({
   authActions,
   authActionsSlot
 }) => {
+  const handleClose = () => setOpen(false);
   const renderMobileAuthActions = React.useMemo(() => {
     if (authActionsSlot) return authActionsSlot;
     if (!authActions || authActions.length === 0) return null;
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4", children: authActions.map((action, index) => {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4 mt-6", children: authActions.map((action, index) => {
       const {
         label,
         icon,
@@ -1524,6 +1535,7 @@ var MobileNavigationMenu = ({
         {
           asButton: true,
           className: cn("w-full", actionClassName),
+          onClick: handleClose,
           ...pressableProps,
           children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
             icon,
@@ -1534,56 +1546,73 @@ var MobileNavigationMenu = ({
         index
       );
     }) });
-  }, [authActionsSlot, authActions]);
+  }, [authActionsSlot, authActions, handleClose]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     NavbarMobileMenu,
     {
       open,
-      onClose: () => setOpen(false),
+      onClose: handleClose,
       title: "Mobile Navigation",
-      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-screen-sm mx-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4", children: [
-        navigation.map((item, index) => renderMobileMenuItem(item, index)),
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-screen-sm mx-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Accordion, { type: "multiple", className: "w-full", children: navigation.map((item, index) => {
+          if (item.groups && item.groups.length > 0) {
+            return /* @__PURE__ */ jsxRuntime.jsxs(
+              AccordionItem,
+              {
+                value: `nav-${index}`,
+                className: "border-b-0",
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(AccordionTrigger, { className: "h-15 items-center p-0 px-4! text-base leading-[3.75] font-normal text-muted-foreground hover:bg-muted hover:no-underline", children: item.title }),
+                  /* @__PURE__ */ jsxRuntime.jsx(AccordionContent, { className: "overflow-x-none", children: item.groups.map((group, groupIndex) => /* @__PURE__ */ jsxRuntime.jsxs(
+                    "div",
+                    {
+                      className: "mb-4",
+                      children: [
+                        group.title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-4 px-4 text-xs font-semibold text-muted-foreground uppercase", children: group.title }),
+                        group.links.map((link, linkIndex) => /* @__PURE__ */ jsxRuntime.jsxs(
+                          Pressable,
+                          {
+                            href: link.url,
+                            className: "flex min-h-12 items-center gap-2 rounded-lg px-4 text-muted-foreground transition-colors duration-300 hover:bg-muted hover:text-foreground",
+                            onClick: handleClose,
+                            children: [
+                              link.icon ? link.icon : link.iconName ? /* @__PURE__ */ jsxRuntime.jsx(
+                                DynamicIcon,
+                                {
+                                  name: link.iconName,
+                                  size: 16,
+                                  className: "stroke-muted-foreground"
+                                }
+                              ) : null,
+                              link.label
+                            ]
+                          },
+                          `mobile-link-${groupIndex}-${linkIndex}`
+                        ))
+                      ]
+                    },
+                    `mobile-group-${groupIndex}`
+                  )) })
+                ]
+              },
+              `nav-item-${index}`
+            );
+          }
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            Pressable,
+            {
+              href: item.url,
+              className: "flex h-15 items-center rounded-md p-0 px-4 text-left text-base leading-[3.75] font-normal text-muted-foreground ring-ring/10 outline-ring/50 transition-all hover:bg-muted focus-visible:ring-4 focus-visible:outline-1",
+              onClick: handleClose,
+              children: item.title
+            },
+            `nav-link-${index}`
+          );
+        }) }),
         renderMobileAuthActions
       ] }) })
     }
   );
 };
-var renderMobileMenuItem = (item, index) => {
-  if (item.groups) {
-    return /* @__PURE__ */ jsxRuntime.jsx(Accordion, { type: "single", className: "w-full", children: /* @__PURE__ */ jsxRuntime.jsxs(AccordionItem, { value: `nav-${index}`, className: "border-b-0", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(AccordionTrigger, { className: "h-15 items-center p-0 px-4! text-base leading-[3.75] font-normal text-muted-foreground hover:bg-muted hover:no-underline", children: item.title }),
-      /* @__PURE__ */ jsxRuntime.jsx(AccordionContent, { className: "overflow-x-none", children: item.groups.flatMap(
-        (group, groupIndex) => group.links.map((link, linkIndex) => /* @__PURE__ */ jsxRuntime.jsxs(
-          Pressable,
-          {
-            href: link.url,
-            className: "flex min-h-12 items-center gap-2 rounded-lg px-4 text-muted-foreground transition-colors duration-300 hover:bg-muted hover:text-foreground",
-            children: [
-              link.icon ? link.icon : link.iconName ? /* @__PURE__ */ jsxRuntime.jsx(
-                DynamicIcon,
-                {
-                  name: link.iconName,
-                  size: 16,
-                  className: "stroke-muted-foreground"
-                }
-              ) : null,
-              link.label
-            ]
-          },
-          `mobile-link-${groupIndex}-${linkIndex}`
-        ))
-      ) })
-    ] }) }, `nav-item-${index}`);
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    Pressable,
-    {
-      href: item.url,
-      className: "flex h-15 items-center rounded-md p-0 px-4 text-left text-base leading-[3.75] font-normal text-muted-foreground ring-ring/10 outline-ring/50 transition-all hover:bg-muted focus-visible:ring-4 focus-visible:outline-1 nth-last-1:border-0",
-      children: item.title
-    },
-    `nav-link-${index}`
-  );
-};
 
 exports.NavbarMultiColumnGroups = NavbarMultiColumnGroups;

package/dist/navbar-multi-column-groups.d.cts

@@ -1,10 +1,10 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-r_NhxVet.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bz_A5vLU.cjs';
 import { L as LogoConfig, N as NavbarLayoutVariant } from './types-COVDidbn.cjs';
-import { A as ActionConfig, O as OptixFlowConfig } from './blocks-DP3Vofl4.cjs';
+import { A as ActionConfig, O as OptixFlowConfig } from './blocks-Cohq4eio.cjs';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 
 interface MenuLink {

package/dist/navbar-multi-column-groups.d.ts

@@ -1,10 +1,10 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DmVsuoHE.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-Bi_ClKrO.js';
 import { L as LogoConfig, N as NavbarLayoutVariant } from './types-COVDidbn.js';
-import { A as ActionConfig, O as OptixFlowConfig } from './blocks-XLPGq8A5.js';
+import { A as ActionConfig, O as OptixFlowConfig } from './blocks-k17uluAz.js';
 import 'class-variance-authority';
-import './button-variants-CdNtNOuP.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 
 interface MenuLink {