Navigation Menu

Accessibility

• A nav landmark with a label.
• Triggers use aria-expanded and aria-controls.
• Panels sit inside the nav and hold plain links.

Motion

• Panels open in 200 ms from the trigger.
• Moving to another trigger morphs size and position with no close in between: the surface scales with its corners held round, and the content cross fades.
• One panel is open on the page at a time.
• With reduced motion, panels swap in place.

Responsive behavior

• On Mobile, and on Web when the bar no longer fits on one line, it collapses to a top bar with a menu toggle. The menu holds search, 46 high rows that open like an accordion, and a footer with meta and end.

Performance

• Moving across triggers reuses one panel and animates its position and width, with no close in between.
• The panel mounts only while open, and the 160 ms close timer is cleared on unmount.
• On Mobile only the open entry renders its accordion.

• Import NavigationMenu from @/components/fetaui/navigation-menu after installing it. items is required.
• An entry takes links for a panel, or href for a plain link. width, columns, feature, heading and footer shape the panel.
• Link href values act as keys, so keep them unique in an entry. brand and end fill the bar.
• Links are plain anchors, so wrap routing yourself. Search and Sign in in the demo are static. Composes NavItem from Sidebar.