Command Palette

Search for a command to run...

Docs
Sidebar

Sidebar

A composable, animated sidebar with collapsed/expanded states, responsive mobile overlay, and full light/dark mode support.

Home

Select a menu item from the sidebar

Installation

Props

SidebarProvider Props

PropTypeDefaultDescription
defaultCollapsedbooleanfalseInitial collapsed state
collapsedWidthnumber64Width in px when collapsed
expandedWidthnumber260Width in px when expanded
mobileBreakpointnumber768Breakpoint (px) to switch to mobile mode
PropTypeDefaultDescription
side"left" | "right""left"Which side of the screen
classNamestring-Additional CSS classes

SidebarMenuItem Props

PropTypeDefaultDescription
iconReact.ReactNode-Icon element
labelstring-Navigation label text
badgeReact.ReactNode-Optional badge (e.g. count)
activebooleanfalseHighlights the item as active
onClick() => void-Click handler
hrefstring-If set, renders as <a> link
classNamestring-Additional CSS classes