saturation/uiApp Sidebar
Collapsible sidebar component with logo, navigation menu, and user profile sections.
Features
- Collapsible navigation — Expands and collapses with smooth animation
- Logo section — With back-to-workspace hover state
- Navigation menu — With active state indicators
- User profile section — With avatar and contact info
- Tooltips in collapsed mode — Show labels when hovering
- Keyboard accessible — Full keyboard navigation
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| logo | string | - | URL to the company logo image |
| companyName | string | "Workspace" | Company or workspace name |
| isCollapsed | boolean | false | Controlled collapsed state |
| onCollapsedChange | (collapsed: boolean) => void | - | Callback when collapsed state changes |
| onBackToWorkspace | () => void | - | Callback when logo/back button is clicked |
| userName | string | "John Doe" | User's display name |
| userEmail | string | "john@example.com" | User's email address |
| userAvatar | string | - | URL to user's avatar image |
Components Used
buttonavatartooltip