Skip to content

NavigationMenu

A website-style multi-level navigation bar: hover / keyboard expands submenus (cascading popups); leaf items with href render as links.

Basic usage

Basic usage

Nothing selected

Disabled items

Disabled items

API

Attributes

AttributeDescriptionTypeDefault
itemsNavigation items JSON (hierarchical)string[]

Events

EventDescription
oas-selectAn item was selected, detail: { value }

NavItem fields (inherits MenuItem):

FieldDescriptionType
labelNavigation textstring
valueSelection valuestring
hrefLink URL (optional); leaf items with href render as <a> and are navigablestring
targetLink open target (optional)string
disabledDisabledboolean
childrenSub navigation items (nested recursively, cascading to the right)NavItem[]

Interaction: hover expands a submenu, click toggles; keyboard / switches top level, /Enter opens, opens and focuses the last item, enters a cascading submenu, returns to the parent, Esc closes everything and refocuses the top level. While a submenu is open, Tab cycles among its items (focus trap); after selection it collapses and fires oas-select.