NavigationMenu
navigationA collection of links for navigating websites with full keyboard support.
Preview
Installation
npm install @launchapp/design-systemImport
import { NavigationMenu, NavigationMenuList, NavigationMenuItem, NavigationMenuTrigger, NavigationMenuContent, NavigationMenuLink} from "@launchapp/design-system";Examples
Navigation Menu
<NavigationMenu> <NavigationMenuList> <NavigationMenuItem> <NavigationMenuTrigger>Getting started</NavigationMenuTrigger> <NavigationMenuContent> <div className="p-4"> <NavigationMenuLink href="/">Introduction</NavigationMenuLink> </div> </NavigationMenuContent> </NavigationMenuItem> <NavigationMenuItem> <NavigationMenuLink href="/docs">Documentation</NavigationMenuLink> </NavigationMenuItem> </NavigationMenuList></NavigationMenu>Props
| Prop | Type | Default | Description |
|---|---|---|---|
value | string | — | Controlled open value. |
onValueChange | (value: string) => void | — | Callback when open value changes. |
delayDuration | number | 200 | Duration from when the mouse enters a trigger to when the content opens. |