Sidebar

A vertical navigation rail rendered as a <nav> landmark with grouped sections. Each group has a label and a list of items; the current item carries aria-current="page". Groups can be made collapsible, becoming a disclosure with aria-expanded. The rail is sticky and independently scrollable, and its surface is token-driven (var(--surface-sunk)). Items are <a> when given an href, otherwise <button>. Up/Down arrows and Home/End move focus between items and collapsible headers.

Grouped sections — active item

Button-mode items (controlled selection)

Collapsible group (controlled) + icons & trailing badges

Uncollapsible + collapsed-by-default group, disabled item