Navigation
Tabs, breadcrumbs, and wayfinding.
Pill Tabs
A segmented tab control with a sliding active state.
Command Palette
A ⌘K overlay with grouped fuzzy results and a sliding highlight.
This site's real ⌘K uses the same component, scoped to this box here, so it doesn't take over the page.
Pagination
A controlled page control with ellipsis collapsing and a sliding highlight.
Controlled by page, onPageChange, and pageCount. Past seven pages the run collapses to ellipses around the current page, and the active pill slides on a shared layout id. Table Pagination wraps this with a range label and a page-size select.
Stepper
A step indicator whose connectors fill and checkmarks draw in.
Icon Stepper
A stepper with a swappable per-step icon instead of a number.
Comet Stepper
Advancing races a comet down the connector and flips the badge.
Popover
The anchored-panel primitive, with flip, shift, and arrow repointing.
Drag the anchor toward an edge. The popover flips and shifts to stay in view.
The placement engine tries the preferred side, flips to the opposite when the panel would overflow that edge, then shifts along the cross axis to stay inside the boundary and repoints the arrow at the anchor center. Pick a side to force it and drag the anchor to watch it correct itself; the shipped component is a portal trigger plus content with click-outside and Escape.