Mobile Navigation
The collapsing nav bar for marketing pages on small screens.
Sakani
Control it to close on navigation
Uncontrolled works for a static page. In a client-routed app the menu won't know a link changed the route, so pass open and close it yourself on route change — otherwise it stays open over the page it just navigated to.
Sakani
Menu is closed
Not the app sidebar
This is marketing-site navigation. For an application shell, use Sidebar and TopBarMobile.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| label | string | Brand or product name shown in the bar. | |
| links | { label: string; href?: string; onClick?: () => void }[] | Nav entries. Give each either an href or an onClick. | |
| ctaLabel / onCtaClick | string / () => void | Optional call to action at the end of the menu. | |
| open | boolean | Controlled open state. Omit to let the menu manage its own toggle. | |
| defaultOpen | boolean | false | Initial state when uncontrolled. |
| onOpenChange | (open: boolean) => void | Fires whenever the menu opens or closes, in both modes. |