Pill nav
Floating centred pill navigation whose lit-key chip follows the section in view, with a sliding hover chip, smooth jump links and a condensed state on scroll.
Preview
Install
Pro source requires Pebble Pro. Try the full preview above.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| items | { id: string; label: string }[] | — | Sections in page order; id is the section element's id. |
| container | RefObject<HTMLElement> | — | Scroll container holding the sections. Defaults to the window. |
| offset | number | 80 | Px from the top of the scroll area at which a section becomes current. |
| condenseAt | number | 24 | Scroll distance in px after which the pill tightens and lifts. |
| label | string | "Sections" | Accessible name of the navigation. |
Pro component
Try the full preview above. Editable source and build guides require Pebble Pro.