Hamburger menu
Menu button whose lines morph to an ×, opening a full-panel modal menu with staggered links, in-place sub-sections and a footer.
Preview
Version 3.2
Write together, calmly.
Drafts, reviews and launches in one place. Tap the menu.
1,284 editors
38 ms sync
Version 3.2
Write together, calmly.
Drafts, reviews and launches in one place. Tap the menu.
1,284 editors
38 ms sync
Install
Pro source requires Pebble Pro. Try the full preview above.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| items | ({ label; href; description? } | { label; items })[] | — | Links, or sections whose sub-links open in place. |
| brand / footer | ReactNode | — | Top of the panel and the bottom strip of secondary actions. |
| current | string | — | Href of the current page: ember dot and aria-current. |
| open / defaultOpen / onOpenChange | boolean / boolean / (open: boolean) => void | — / false / — | Controlled or uncontrolled open state. |
| container | HTMLElement | null | body | Render the panel inside a frame instead of over the whole page. |
| modal | boolean | true | Trap focus and hide the page while open. Turn off only for held previews. |
Pro component
Try the full preview above. Editable source and build guides require Pebble Pro.