Table of Contents#
- Sidebar Props
- SidebarContainer Props
- SidebarFooter Props
- SidebarHeader Props
- SidebarItem Props
- SidebarToggleButton Props
- SidebarProvider Props
Sidebar Props#
| Prop | Type | Default | Description |
|---|---|---|---|
| children | ReactNode | - | Content inside the Sidebar, typically SidebarItems, SidebarHeader, etc. |
| className | string | '' | Additional CSS classes for the sidebar container. |
| breakPoint | sm md lg xl 2xl none | 'md' | Responsive breakpoint at which the sidebar behavior changes. |
| ...rest | HTMLAttributes<HTMLElement> | - | Additional HTML attributes passed to the root sidebar element. |
SidebarContainer Props#
| Prop | Type | Default | Description |
|---|---|---|---|
| children | ReactNode | - | Content inside the Sidebar container. |
| className | string | '' | Additional CSS classes for the sidebar container wrapper. |
| ...rest | HTMLAttributes<HTMLElement> | - | Additional HTML attributes passed to the container element. |
SidebarFooter Props#
| Prop | Type | Default | Description |
|---|---|---|---|
| children | ReactNode | - | Content inside the sidebar footer. |
| className | string | '' | Additional CSS classes for the sidebar footer container. |
| ...rest | HTMLAttributes<HTMLElement> | - | Additional HTML attributes passed to the footer element. |
SidebarHeader Props#
| Prop | Type | Default | Description |
|---|---|---|---|
| children | ReactNode | - | Content inside the sidebar header. |
| className | string | '' | Additional CSS classes for the sidebar header container. |
| ...rest | HTMLAttributes<HTMLElement> | - | Additional HTML attributes passed to the header element. |
SidebarItem Props#
| Prop | Type | Default | Description |
|---|---|---|---|
| children | ReactNode | - | Content inside the sidebar item. |
| onClick | () => void undefined | - | Callback fired when the sidebar item is clicked. |
| className | string | '' | Additional CSS classes for the sidebar item. |
| ...rest | HTMLAttributes<HTMLElement> | - | Additional HTML attributes passed to the sidebar item. |
SidebarToggleButton Props#
| Prop | Type | Default | Description |
|---|---|---|---|
| className | string | '' | Additional CSS classes for the toggle button. |
| variant | primary secondary success warning link outline ghost icon withIcon default | 'default' | Visual style variant of the toggle button. |
| size | small medium large | 'medium' | Size of the toggle button. |
| icon | ReactNode | <Menu /> | Icon displayed inside the toggle button. |
| ...rest | ButtonHTMLAttributes<HTMLButtonElement> | - | Additional button HTML attributes passed to the toggle button. |
SidebarProvider Props#
| Prop | Type | Default | Description |
|---|---|---|---|
| children | ReactNode | - | Elements that should have access to the sidebar context (wrapped components). |