@opensite/ui 3.4.8 → 3.5.0

package/dist/navbar-split-cta.js

@@ -746,7 +746,7 @@ var NavbarSplitCta = ({
   return /* @__PURE__ */ jsx(
     Section,
     {
-      id: sectionId,
+      id: "navbar-split-cta",
       background,
       spacing: spacingOverride ?? spacing,
       className: sectionClasses,
@@ -821,20 +821,19 @@ var NavbarSplitCta = ({
                 children: renderAuthActions
               }
             ),
-            /* @__PURE__ */ jsxs(
+            /* @__PURE__ */ jsx("div", { className: "flex lg:hidden", children: /* @__PURE__ */ jsxs(
               Pressable,
               {
                 variant: "ghost",
                 size: "icon",
                 asButton: true,
-                className: "lg:hidden",
                 onClick: () => setIsOpen(!isOpen),
                 children: [
                   /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/menu", size: 20 }),
                   /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Toggle menu" })
                 ]
               }
-            ),
+            ) }),
             /* @__PURE__ */ jsx(
               NavbarMobileMenu,
               {

package/dist/navbar-sticky-compact.cjs

@@ -875,6 +875,7 @@ var NavbarStickyCompact = ({
     /* @__PURE__ */ jsxRuntime.jsx(
       Section,
       {
+        id: "navbar-sticky-compact",
         background,
         spacing: spacingOverride ?? spacing,
         className: cn(
@@ -915,20 +916,26 @@ var NavbarStickyCompact = ({
                   children: renderAuthActions
                 }
               ),
-              /* @__PURE__ */ jsxRuntime.jsxs(
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex lg:hidden", children: /* @__PURE__ */ jsxRuntime.jsxs(
                 pressable.Pressable,
                 {
                   variant: "ghost",
                   size: isScrolled ? "sm" : "icon",
                   asButton: true,
-                  className: "lg:hidden transition-all duration-300",
+                  className: "transition-all duration-300",
                   onClick: () => setIsOpen(!isOpen),
                   children: [
-                    /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/menu", size: isScrolled ? 18 : 20 }),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      DynamicIcon,
+                      {
+                        name: "lucide/menu",
+                        size: isScrolled ? 18 : 20
+                      }
+                    ),
                     /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Toggle menu" })
                   ]
                 }
-              )
+              ) })
             ]
           }
         ) }) }) })

package/dist/navbar-sticky-compact.d.cts

@@ -23,6 +23,20 @@ interface MenuItem {
  * Props for the NavbarStickyCompact component
  */
 interface NavbarStickyCompactProps {
+    /**
+       * Logo configuration
+       */
+    logo?: LogoConfig;
+    /**
+       * Navigation menu items
+       */
+    menu?: MenuItem[];
+    /**
+       * Authentication action configurations
+       */
+    authActions?: ActionConfig[];
+}
+interface NavbarStickyCompactRuntimeProps {
     /**
      * Additional CSS classes for the section
      */
@@ -101,6 +115,6 @@ interface NavbarStickyCompactProps {
  * Mobile view uses a slide-out sheet from the right. Ideal for content-heavy sites where
  * vertical space is valuable.
  */
-declare const NavbarStickyCompact: ({ logo, logoSlot, logoClassName, menu, menuSlot, authActions, authActionsSlot, className, containerClassName, navClassName, actionsClassName, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarStickyCompactProps) => react_jsx_runtime.JSX.Element;
+declare const NavbarStickyCompact: ({ logo, logoSlot, logoClassName, menu, menuSlot, authActions, authActionsSlot, className, containerClassName, navClassName, actionsClassName, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarStickyCompactRuntimeProps) => react_jsx_runtime.JSX.Element;
 
 export { NavbarStickyCompact, type NavbarStickyCompactProps };

package/dist/navbar-sticky-compact.d.ts

@@ -23,6 +23,20 @@ interface MenuItem {
  * Props for the NavbarStickyCompact component
  */
 interface NavbarStickyCompactProps {
+    /**
+       * Logo configuration
+       */
+    logo?: LogoConfig;
+    /**
+       * Navigation menu items
+       */
+    menu?: MenuItem[];
+    /**
+       * Authentication action configurations
+       */
+    authActions?: ActionConfig[];
+}
+interface NavbarStickyCompactRuntimeProps {
     /**
      * Additional CSS classes for the section
      */
@@ -101,6 +115,6 @@ interface NavbarStickyCompactProps {
  * Mobile view uses a slide-out sheet from the right. Ideal for content-heavy sites where
  * vertical space is valuable.
  */
-declare const NavbarStickyCompact: ({ logo, logoSlot, logoClassName, menu, menuSlot, authActions, authActionsSlot, className, containerClassName, navClassName, actionsClassName, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarStickyCompactProps) => react_jsx_runtime.JSX.Element;
+declare const NavbarStickyCompact: ({ logo, logoSlot, logoClassName, menu, menuSlot, authActions, authActionsSlot, className, containerClassName, navClassName, actionsClassName, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarStickyCompactRuntimeProps) => react_jsx_runtime.JSX.Element;
 
 export { NavbarStickyCompact, type NavbarStickyCompactProps };

package/dist/navbar-sticky-compact.js

@@ -852,6 +852,7 @@ var NavbarStickyCompact = ({
     /* @__PURE__ */ jsx(
       Section,
       {
+        id: "navbar-sticky-compact",
         background,
         spacing: spacingOverride ?? spacing,
         className: cn(
@@ -892,20 +893,26 @@ var NavbarStickyCompact = ({
                   children: renderAuthActions
                 }
               ),
-              /* @__PURE__ */ jsxs(
+              /* @__PURE__ */ jsx("div", { className: "flex lg:hidden", children: /* @__PURE__ */ jsxs(
                 Pressable,
                 {
                   variant: "ghost",
                   size: isScrolled ? "sm" : "icon",
                   asButton: true,
-                  className: "lg:hidden transition-all duration-300",
+                  className: "transition-all duration-300",
                   onClick: () => setIsOpen(!isOpen),
                   children: [
-                    /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/menu", size: isScrolled ? 18 : 20 }),
+                    /* @__PURE__ */ jsx(
+                      DynamicIcon,
+                      {
+                        name: "lucide/menu",
+                        size: isScrolled ? 18 : 20
+                      }
+                    ),
                     /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Toggle menu" })
                   ]
                 }
-              )
+              ) })
             ]
           }
         ) }) }) })

package/dist/navbar-tabbed-sections.cjs

@@ -1016,7 +1016,7 @@ var NavbarTabbedSections = ({
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
-      id: sectionId,
+      id: "navbar-tabbed-sections",
       background,
       spacing: spacingOverride ?? spacing,
       className: sectionClasses,
@@ -1054,20 +1054,19 @@ var NavbarTabbedSections = ({
                 children: renderAuthActions
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsxs(
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex lg:hidden", children: /* @__PURE__ */ jsxRuntime.jsxs(
               pressable.Pressable,
               {
                 variant: "ghost",
                 size: "icon",
                 asButton: true,
-                className: "lg:hidden",
                 onClick: () => setIsOpen(!isOpen),
                 children: [
                   /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/menu", size: 20 }),
                   /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Toggle menu" })
                 ]
               }
-            ),
+            ) }),
             /* @__PURE__ */ jsxRuntime.jsx(
               NavbarMobileMenu,
               {

package/dist/navbar-tabbed-sections.d.cts

@@ -35,6 +35,20 @@ interface MenuItem {
  * Props for the NavbarTabbedSections component
  */
 interface NavbarTabbedSectionsProps {
+    /**
+       * Logo configuration
+       */
+    logo?: LogoConfig;
+    /**
+       * Navigation menu items
+       */
+    menu?: MenuItem[];
+    /**
+       * Authentication action configurations
+       */
+    authActions?: ActionConfig[];
+}
+interface NavbarTabbedSectionsRuntimeProps {
     /**
      * Additional CSS classes for the section
      */
@@ -115,6 +129,6 @@ interface NavbarTabbedSectionsProps {
  * the same dropdown. Mobile view uses a slide-out sheet with expandable sections. Ideal for
  * products with many features organized into logical categories.
  */
-declare const NavbarTabbedSections: ({ sectionId, logo, logoSlot, logoClassName, menu, menuSlot, authActions, authActionsSlot, className, containerClassName, navClassName, actionsClassName, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarTabbedSectionsProps) => react_jsx_runtime.JSX.Element;
+declare const NavbarTabbedSections: ({ sectionId, logo, logoSlot, logoClassName, menu, menuSlot, authActions, authActionsSlot, className, containerClassName, navClassName, actionsClassName, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarTabbedSectionsRuntimeProps) => react_jsx_runtime.JSX.Element;
 
 export { NavbarTabbedSections, type NavbarTabbedSectionsProps };

package/dist/navbar-tabbed-sections.d.ts

@@ -35,6 +35,20 @@ interface MenuItem {
  * Props for the NavbarTabbedSections component
  */
 interface NavbarTabbedSectionsProps {
+    /**
+       * Logo configuration
+       */
+    logo?: LogoConfig;
+    /**
+       * Navigation menu items
+       */
+    menu?: MenuItem[];
+    /**
+       * Authentication action configurations
+       */
+    authActions?: ActionConfig[];
+}
+interface NavbarTabbedSectionsRuntimeProps {
     /**
      * Additional CSS classes for the section
      */
@@ -115,6 +129,6 @@ interface NavbarTabbedSectionsProps {
  * the same dropdown. Mobile view uses a slide-out sheet with expandable sections. Ideal for
  * products with many features organized into logical categories.
  */
-declare const NavbarTabbedSections: ({ sectionId, logo, logoSlot, logoClassName, menu, menuSlot, authActions, authActionsSlot, className, containerClassName, navClassName, actionsClassName, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarTabbedSectionsProps) => react_jsx_runtime.JSX.Element;
+declare const NavbarTabbedSections: ({ sectionId, logo, logoSlot, logoClassName, menu, menuSlot, authActions, authActionsSlot, className, containerClassName, navClassName, actionsClassName, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarTabbedSectionsRuntimeProps) => react_jsx_runtime.JSX.Element;
 
 export { NavbarTabbedSections, type NavbarTabbedSectionsProps };

package/dist/navbar-tabbed-sections.js

@@ -992,7 +992,7 @@ var NavbarTabbedSections = ({
   return /* @__PURE__ */ jsx(
     Section,
     {
-      id: sectionId,
+      id: "navbar-tabbed-sections",
       background,
       spacing: spacingOverride ?? spacing,
       className: sectionClasses,
@@ -1030,20 +1030,19 @@ var NavbarTabbedSections = ({
                 children: renderAuthActions
               }
             ),
-            /* @__PURE__ */ jsxs(
+            /* @__PURE__ */ jsx("div", { className: "flex lg:hidden", children: /* @__PURE__ */ jsxs(
               Pressable,
               {
                 variant: "ghost",
                 size: "icon",
                 asButton: true,
-                className: "lg:hidden",
                 onClick: () => setIsOpen(!isOpen),
                 children: [
                   /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/menu", size: 20 }),
                   /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Toggle menu" })
                 ]
               }
-            ),
+            ) }),
             /* @__PURE__ */ jsx(
               NavbarMobileMenu,
               {

package/dist/navbar-transparent-overlay.cjs

@@ -852,6 +852,7 @@ var NavbarTransparentOverlay = ({
     /* @__PURE__ */ jsxRuntime.jsx(
       Section,
       {
+        id: "navbar-transparent-overlay",
         background,
         spacing: spacingOverride ?? spacing,
         className: sectionClasses,

package/dist/navbar-transparent-overlay.d.cts

@@ -30,6 +30,20 @@ interface NavbarTransparentOverlaySocialLink {
  * Props for the NavbarTransparentOverlay component
  */
 interface NavbarTransparentOverlayProps {
+    /**
+       * Logo configuration
+       */
+    logo?: LogoConfig;
+    /**
+       * Navigation items
+       */
+    navItems?: NavItem[];
+    /**
+       * Authentication action configurations for desktop
+       */
+    authActions?: ActionConfig[];
+}
+interface NavbarTransparentOverlayRuntimeProps {
     /**
      * Additional CSS classes for the section
      */
@@ -136,6 +150,6 @@ interface NavbarTransparentOverlayProps {
  * with a staggered effect. The hamburger menu transforms into an X when open. Perfect for
  * landing pages, portfolios, and creative websites with hero sections.
  */
-declare const NavbarTransparentOverlay: ({ className, containerClassName, navClassName, navigationMenuClassName, actionsClassName, mobileMenuClassName, socialLinksClassName, logo, logoSlot, logoClassName, navItems, navigationSlot, authActions, authActionsSlot, mobileAuthActions, mobileAuthActionsSlot, socialLinks, socialLinksSlot, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarTransparentOverlayProps) => react_jsx_runtime.JSX.Element;
+declare const NavbarTransparentOverlay: ({ className, containerClassName, navClassName, navigationMenuClassName, actionsClassName, mobileMenuClassName, socialLinksClassName, logo, logoSlot, logoClassName, navItems, navigationSlot, authActions, authActionsSlot, mobileAuthActions, mobileAuthActionsSlot, socialLinks, socialLinksSlot, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarTransparentOverlayRuntimeProps) => react_jsx_runtime.JSX.Element;
 
 export { NavbarTransparentOverlay, type NavbarTransparentOverlayProps };

package/dist/navbar-transparent-overlay.d.ts

@@ -30,6 +30,20 @@ interface NavbarTransparentOverlaySocialLink {
  * Props for the NavbarTransparentOverlay component
  */
 interface NavbarTransparentOverlayProps {
+    /**
+       * Logo configuration
+       */
+    logo?: LogoConfig;
+    /**
+       * Navigation items
+       */
+    navItems?: NavItem[];
+    /**
+       * Authentication action configurations for desktop
+       */
+    authActions?: ActionConfig[];
+}
+interface NavbarTransparentOverlayRuntimeProps {
     /**
      * Additional CSS classes for the section
      */
@@ -136,6 +150,6 @@ interface NavbarTransparentOverlayProps {
  * with a staggered effect. The hamburger menu transforms into an X when open. Perfect for
  * landing pages, portfolios, and creative websites with hero sections.
  */
-declare const NavbarTransparentOverlay: ({ className, containerClassName, navClassName, navigationMenuClassName, actionsClassName, mobileMenuClassName, socialLinksClassName, logo, logoSlot, logoClassName, navItems, navigationSlot, authActions, authActionsSlot, mobileAuthActions, mobileAuthActionsSlot, socialLinks, socialLinksSlot, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarTransparentOverlayProps) => react_jsx_runtime.JSX.Element;
+declare const NavbarTransparentOverlay: ({ className, containerClassName, navClassName, navigationMenuClassName, actionsClassName, mobileMenuClassName, socialLinksClassName, logo, logoSlot, logoClassName, navItems, navigationSlot, authActions, authActionsSlot, mobileAuthActions, mobileAuthActionsSlot, socialLinks, socialLinksSlot, layoutVariant, background, spacing, pattern, patternOpacity, optixFlowConfig, }: NavbarTransparentOverlayRuntimeProps) => react_jsx_runtime.JSX.Element;
 
 export { NavbarTransparentOverlay, type NavbarTransparentOverlayProps };

package/dist/navbar-transparent-overlay.js

@@ -830,6 +830,7 @@ var NavbarTransparentOverlay = ({
     /* @__PURE__ */ jsx(
       Section,
       {
+        id: "navbar-transparent-overlay",
         background,
         spacing: spacingOverride ?? spacing,
         className: sectionClasses,