Workspace Switcher
Menus
Source and install need .
pnpm dlx shadcn@latest add @assembli/sidebar-settings-menuSidebar Settings Menu
The account and settings menu at the foot of an app sidebar. The signed-in person is the trigger; the menu opens upward with their profile and plan, settings links, an inline Light/System/Dark switch, a language submenu, help links with an unread count, an upgrade card with a usage meter, and log out. Collapsed sidebars get an avatar trigger and a menu that opens sideways.
Props
Other props pass through to the root element.
user
SettingsUser
Default
DEFAULT_USERusage
SettingsUsage
Shows an upgrade card with a usage meter. Leave out for paid plans.
collapsed
boolean
Default
falseIcon-only trigger for a collapsed sidebar; the menu then opens to the right.
theme
SettingsTheme
defaultTheme
SettingsTheme
Default
"system"onThemeChange
(theme: SettingsTheme) => void
languages
SettingsLanguage[]
Default
DEFAULT_LANGUAGESlanguage
string
defaultLanguage
string
onLanguageChange
(language: string) => void
unread
number
Default
0Unread changelog entries, shown as a count on Help and Changelog.
onAction
(action: SettingsMenuAction) => void
| Description | |||
|---|---|---|---|
| user | SettingsUser | DEFAULT_USER | |
| usage | SettingsUsage | – | Shows an upgrade card with a usage meter. Leave out for paid plans. |
| collapsed | boolean | false | Icon-only trigger for a collapsed sidebar; the menu then opens to the right. |
| theme | SettingsTheme | – | |
| defaultTheme | SettingsTheme | "system" | |
| onThemeChange | (theme: SettingsTheme) => void | – | |
| languages | SettingsLanguage[] | DEFAULT_LANGUAGES | |
| language | string | – | |
| defaultLanguage | string | – | |
| onLanguageChange | (language: string) => void | – | |
| unread | number | 0 | Unread changelog entries, shown as a count on Help and Changelog. |
| onAction | (action: SettingsMenuAction) => void | – |
