Prepared Docs

Prepared Docs

⌘K

    Loading navigation…

User

  1. Components
  2. Sidebar
  3. API and Development

Sidebar

API and Development

View Source
Submit Issue

SidebarProvider holds collapse state (collapsed, setCollapsed, toggleCollapsed). Sidebar renders a column navigation landmark (role="navigation"). Compose with SidebarHeader, SidebarContent, SidebarGroup, SidebarItem, SidebarExpandableItem, SidebarSection, SidebarNestedGroup, SidebarFooter, SidebarLabel, and SidebarSeparator for full app shells.

Sidebar

No extracted props

This component does not declare package-specific props in the generated API. It may still accept standard HTML and React attributes for its underlying element (for example className, id, and ARIA attributes). Props whose types come only from dependencies are omitted from this table.

Storybook

Interactive examples and edge cases for this component are in Storybook.

Default
With Nested Groups
With Deep Nesting
Collapsed Nested Groups
Icon Collapsed
With Footer
Dispatch Composition
Nested Group Toggle
Long List Scroll
Full Composition

SidebarProvider

Name

Type

Default

Description

defaultCollapsed

boolean

false

Initial collapsed state when uncontrolled.

collapsed

boolean

—

Controlled collapsed flag.

onCollapsedChange

(collapsed: boolean) => void

—

Fires when collapse toggles.

Import

Default

With nested groups

Icon collapsed

With footer

Nested group toggle

Previous

Sidebar / Usage

Next

Sidebar / Accessibility

On this page

Sidebar
Storybook
SidebarProvider
Import
Default
With nested groups
Icon collapsed
With footer
Nested group toggle