Account Menu
A polymorphic account trigger and dropdown. In the logged-out state it renders sign-in and sign-up links. In the logged-in state it shows an avatar and a configurable dropdown with logout support.
core/account-menuInstallation
1 · Add registry to components.json
2 · Install component
Examples
Signed out
Default logged-out state with sign in / sign up links.
Signed in
Avatar with dropdown showing user details and menu items.
Trigger variants
Four trigger styles: avatar, avatar-chevron, burger-avatar, pill.
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
userreq | AccountMenuUser | null | — | Pass null for logged-out state, or a user object for logged-in. |
items | AccountMenuItem[] | [] | Menu items shown when logged in. |
triggerVariant | "avatar" | "avatar-chevron" | "burger-avatar" | "pill" | "avatar" | Style of the trigger button. |
dropdownVariant | "default" | "dark" | "luxury" | "default" | Style of the dropdown panel. |
signInHref | string | "/login" | Href for the sign-in link. |
signUpHref | string | — | Href for the sign-up link. |
onLogout | () => void | — | Called when the user clicks Log out. |