Sidebar

Vertical section navigation. Groups collapse natively, and the group holding the current page opens on load.

Example

<Sidebar
  current="/components/button"
  items={[
    { label: "Getting started", href: "/" },
    {
      label: "Components",
      children: [
        { label: "Buttons", href: "/components/button" },
        { label: "Inputs", href: "/components/text-field" },
      ],
    },
  }}
/>

Props

Prop	Type	Default	Description
`items`	`Array`	-	Links; `children` makes a collapsible group.
`current`	`string`	-	Href of the current page (opens its group).
`label`	`string`	`Section`	Nav landmark name.

Accessibility

Current link carries aria-current="page".
Groups are native details/summary: keyboard free, zero script.