NavigationMenu
NavigationHorizontal navigation menu with dropdown sub-menus.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
items | DsNavMenuItem[] | [] | Navigation items { label, href?, description?, children? }. |
Examples
Horizontal navigation
vue
<DsNavigationMenu
:items="[
{ label: 'Products', children: [
{ label: 'Analytics', href: '#', description: 'Real-time data insights' },
{ label: 'Automation', href: '#', description: 'Workflow automation tools' },
]},
{ label: 'Docs', href: '#' },
{ label: 'Pricing', href: '#' },
{ label: 'Blog', href: '#' },
]"
/>Skeleton
Use DsNavigationMenuSkeleton as a loading placeholder while content is being fetched.
Default
vue
<DsNavigationMenuSkeleton />Accessibility
- Keyboard navigation supported.
- Sub-menus open on hover or click.