stuff

src/hooks/index.ts

@@ -37,3 +37,4 @@ export * from './use-menu-state'
 export * from './use-file-upload'
 export * from './use-accordion'
 export * from './use-binding-editor'
+export * from './use-navigation-menu'

src/lib/json-ui/hooks-registry.ts

@@ -15,6 +15,7 @@ import { useMenuState } from '@/hooks/use-menu-state'
 import { useFileUpload } from '@/hooks/use-file-upload'
 import { useAccordion } from '@/hooks/use-accordion'
 import { useBindingEditor } from '@/hooks/use-binding-editor'
+import { useNavigationMenu } from '@/hooks/use-navigation-menu'
 
 export interface HookRegistry {
   [key: string]: (...args: any[]) => any
@@ -37,6 +38,7 @@ export const hooksRegistry: HookRegistry = {
   useFileUpload,
   useAccordion,
   useBindingEditor,
+  useNavigationMenu,
   // Add more hooks here as needed
 }
 

src/lib/json-ui/json-components.ts

@@ -30,6 +30,7 @@ import type {
   FileUploadProps,
   AccordionProps,
   BindingEditorProps,
+  NavigationMenuProps,
   TextGradientProps,
   ErrorBadgeProps,
   AppLogoProps,
@@ -91,6 +92,7 @@ import menuDef from '@/components/json-definitions/menu.json'
 import fileUploadDef from '@/components/json-definitions/file-upload.json'
 import accordionDef from '@/components/json-definitions/accordion.json'
 import bindingEditorDef from '@/components/json-definitions/binding-editor.json'
+import navigationMenuDef from '@/components/json-definitions/navigation-menu.json'
 import textGradientDef from '@/components/json-definitions/text-gradient.json'
 import errorBadgeDef from '@/components/json-definitions/error-badge.json'
 import appLogoDef from '@/components/json-definitions/app-logo.json'
@@ -258,6 +260,15 @@ export const BindingEditor = createJsonComponentWithHooks<BindingEditorProps>(bi
   }
 })
 
+export const NavigationMenu = createJsonComponentWithHooks<NavigationMenuProps>(navigationMenuDef, {
+  hooks: {
+    menuState: {
+      hookName: 'useNavigationMenu',
+      args: (props) => [props.activeTab, props.onTabChange, props.featureToggles, props.errorCount ?? 0]
+    }
+  }
+})
+
 // Batch 1 - Simple stateless components
 export const TextGradient = createJsonComponent<TextGradientProps>(textGradientDef)
 export const ErrorBadge = createJsonComponent<ErrorBadgeProps>(errorBadgeDef)