NavigationMenu

NavigationMenu is a compound component that provides navigationmenu functionality.

Active

NavigationMenu

Installation

npm install @your-design-system/navigationmenu

import { NavigationMenu } from "@/components/ui/navigationmenu"

export function NavigationMenuDemo() {
  return (
    <NavigationMenu>
      {/* Content */}
    </NavigationMenu>
  )
}

API Reference

Prop	Type	Default	Description
`value`	`string`	-	The value prop for the component.
`onValueChange`	`string`	-	The onValueChange prop for the component.
`orientation`	`enum`	`horizontal`	The orientation prop for the component. Options: horizontal \| vertical

Styling

The component uses Tailwind CSS classes for styling. You can customize the appearance by overriding these classes.

Base Classes

relativez-10flexmax-w-maxflex-1items-centerjustify-center

Design System Compliance

This component is validated against atomic design principles and foundation token usage.

✓ Atomic Design Compliant

This component follows atomic design principles and properly uses foundation tokens.

On This Page