@sudobility/components 4.0.26 → 4.0.28

package/dist/layout/Topbar/TopbarMenuToggle.d.ts

@@ -1,4 +1,5 @@
 import { default as React } from 'react';
+import { TopbarNavItem } from './TopbarNav';
 export interface TopbarMenuToggleProps {
     /** Custom icon component to use instead of default hamburger */
     icon?: React.ComponentType<{
@@ -12,13 +13,32 @@ export interface TopbarMenuToggleProps {
     onClick?: () => void;
     /** Breakpoint at which to hide the toggle (shows on smaller screens) */
     hideAbove?: 'sm' | 'md' | 'lg' | 'xl';
+    /** Menu items to display in dropdown (optional - if provided, shows dropdown instead of toggling mobile nav) */
+    menuItems?: TopbarNavItem[];
+    /** Custom link component for routing integration */
+    LinkComponent?: React.ComponentType<{
+        href: string;
+        className?: string;
+        children: React.ReactNode;
+    }>;
 }
 /**
  * TopbarMenuToggle - Hamburger menu toggle button for mobile navigation
  *
  * @example
  * ```tsx
+ * // Simple toggle (controls TopbarMobileNav)
  * <TopbarMenuToggle hideAbove="lg" />
+ *
+ * // With dropdown menu
+ * <TopbarMenuToggle
+ *   hideAbove="lg"
+ *   menuItems={[
+ *     { id: 'home', label: 'Home', href: '/' },
+ *     { id: 'about', label: 'About', href: '/about' },
+ *   ]}
+ *   LinkComponent={LocalizedLink}
+ * />
  * ```
  */
 export declare const TopbarMenuToggle: React.FC<TopbarMenuToggleProps>;

package/dist/layout/Topbar/TopbarMenuToggle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TopbarMenuToggle.d.ts","sourceRoot":"","sources":["../../../src/layout/Topbar/TopbarMenuToggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,MAAM,WAAW,qBAAqB;IACpC,gEAAgE;IAChE,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACnD,uCAAuC;IACvC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iEAAiE;IACjE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,wEAAwE;IACxE,SAAS,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CACvC;AAwCD;;;;;;;GAOG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAsC5D,CAAC"}
+{"version":3,"file":"TopbarMenuToggle.d.ts","sourceRoot":"","sources":["../../../src/layout/Topbar/TopbarMenuToggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAIhD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAEjD,MAAM,WAAW,qBAAqB;IACpC,gEAAgE;IAChE,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACnD,uCAAuC;IACvC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,6BAA6B;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iEAAiE;IACjE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,wEAAwE;IACxE,SAAS,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IACtC,gHAAgH;IAChH,SAAS,CAAC,EAAE,aAAa,EAAE,CAAC;IAC5B,oDAAoD;IACpD,aAAa,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAClC,IAAI,EAAE,MAAM,CAAC;QACb,SAAS,CAAC,EAAE,MAAM,CAAC;QACnB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;KAC3B,CAAC,CAAC;CACJ;AAwCD;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAmJ5D,CAAC"}

package/dist/layout/Topbar/TopbarNavigation.d.ts

@@ -0,0 +1,44 @@
+import { default as React } from 'react';
+import { TopbarNavItem, TopbarNavProps } from './TopbarNav';
+export interface TopbarNavigationProps {
+    /** Navigation items to display */
+    items: TopbarNavItem[];
+    /** Custom link component for routing integration */
+    LinkComponent?: TopbarNavProps['LinkComponent'];
+    /** Breakpoint at which to collapse navigation into mobile dropdown */
+    collapseBelow?: 'sm' | 'md' | 'lg' | 'xl';
+    /** Alignment of nav items on desktop */
+    align?: 'left' | 'center' | 'right';
+    /** Additional CSS classes for the container */
+    className?: string;
+    /** ARIA label for the mobile menu toggle */
+    mobileMenuLabel?: string;
+}
+/**
+ * TopbarNavigation - Unified navigation component that handles both desktop and mobile layouts
+ *
+ * On desktop (above collapseBelow breakpoint): Shows horizontal nav links
+ * On mobile (below collapseBelow breakpoint): Shows hamburger menu with dropdown
+ *
+ * @example
+ * ```tsx
+ * const navItems = [
+ *   { id: 'home', label: 'Home', href: '/' },
+ *   { id: 'about', label: 'About', href: '/about' },
+ *   { id: 'contact', label: 'Contact', href: '/contact' },
+ * ];
+ *
+ * <Topbar>
+ *   <TopbarLeft>
+ *     <TopbarNavigation
+ *       items={navItems}
+ *       LinkComponent={LocalizedLink}
+ *       collapseBelow="lg"
+ *     />
+ *     <TopbarLogo>...</TopbarLogo>
+ *   </TopbarLeft>
+ * </Topbar>
+ * ```
+ */
+export declare const TopbarNavigation: React.FC<TopbarNavigationProps>;
+//# sourceMappingURL=TopbarNavigation.d.ts.map

package/dist/layout/Topbar/TopbarNavigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TopbarNavigation.d.ts","sourceRoot":"","sources":["../../../src/layout/Topbar/TopbarNavigation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAEL,KAAK,aAAa,EAClB,KAAK,cAAc,EACpB,MAAM,aAAa,CAAC;AAGrB,MAAM,WAAW,qBAAqB;IACpC,kCAAkC;IAClC,KAAK,EAAE,aAAa,EAAE,CAAC;IACvB,oDAAoD;IACpD,aAAa,CAAC,EAAE,cAAc,CAAC,eAAe,CAAC,CAAC;IAChD,sEAAsE;IACtE,aAAa,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1C,wCAAwC;IACxC,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4CAA4C;IAC5C,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CA6B5D,CAAC"}

package/dist/layout/Topbar/index.d.ts

@@ -49,5 +49,6 @@ export { TopbarLeft, TopbarCenter, TopbarRight, TopbarMobileContent, TopbarDivid
 export { TopbarLogo, type TopbarLogoProps } from './TopbarLogo';
 export { TopbarMenuToggle, type TopbarMenuToggleProps, } from './TopbarMenuToggle';
 export { TopbarNav, TopbarMobileNav, type TopbarNavProps, type TopbarNavItem, type TopbarMobileNavProps, } from './TopbarNav';
+export { TopbarNavigation, type TopbarNavigationProps, } from './TopbarNavigation';
 export { TopbarActions, TopbarIconButton, TopbarSearch, type TopbarActionsProps, type TopbarIconButtonProps, type TopbarSearchProps, } from './TopbarActions';
 //# sourceMappingURL=index.d.ts.map

package/dist/layout/Topbar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layout/Topbar/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AAGH,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,KAAK,aAAa,EAAE,MAAM,UAAU,CAAC;AAGxE,OAAO,EACL,cAAc,EACd,SAAS,EACT,aAAa,EACb,KAAK,mBAAmB,GACzB,MAAM,iBAAiB,CAAC;AAGzB,OAAO,EACL,UAAU,EACV,YAAY,EACZ,WAAW,EACX,mBAAmB,EACnB,aAAa,GACd,MAAM,eAAe,CAAC;AAGvB,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAGhE,OAAO,EACL,gBAAgB,EAChB,KAAK,qBAAqB,GAC3B,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EACL,SAAS,EACT,eAAe,EACf,KAAK,cAAc,EACnB,KAAK,aAAa,EAClB,KAAK,oBAAoB,GAC1B,MAAM,aAAa,CAAC;AAGrB,OAAO,EACL,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,KAAK,kBAAkB,EACvB,KAAK,qBAAqB,EAC1B,KAAK,iBAAiB,GACvB,MAAM,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/layout/Topbar/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AAGH,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,KAAK,aAAa,EAAE,MAAM,UAAU,CAAC;AAGxE,OAAO,EACL,cAAc,EACd,SAAS,EACT,aAAa,EACb,KAAK,mBAAmB,GACzB,MAAM,iBAAiB,CAAC;AAGzB,OAAO,EACL,UAAU,EACV,YAAY,EACZ,WAAW,EACX,mBAAmB,EACnB,aAAa,GACd,MAAM,eAAe,CAAC;AAGvB,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,cAAc,CAAC;AAGhE,OAAO,EACL,gBAAgB,EAChB,KAAK,qBAAqB,GAC3B,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EACL,SAAS,EACT,eAAe,EACf,KAAK,cAAc,EACnB,KAAK,aAAa,EAClB,KAAK,oBAAoB,GAC1B,MAAM,aAAa,CAAC;AAGrB,OAAO,EACL,gBAAgB,EAChB,KAAK,qBAAqB,GAC3B,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EACL,aAAa,EACb,gBAAgB,EAChB,YAAY,EACZ,KAAK,kBAAkB,EACvB,KAAK,qBAAqB,EAC1B,KAAK,iBAAiB,GACvB,MAAM,iBAAiB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sudobility/components",
-  "version": "4.0.26",
+  "version": "4.0.28",
   "description": "Reusable UI components and design system - Reorganized for better maintainability",
   "type": "module",
   "main": "dist/index.umd.js",