Skip to main content

UserNav

Sharedcomponent✓ stamped

Account menu with an avatar trigger.

@brite-nites/design-system/primitives/user-nav

Workspace/user dropdown for the sidebar header. Replaces the logo with a clickable trigger showing tenant name + caret. Dropdown shows user info (read-only) and actions (Settings, Log out). Follows Linear's minimal pattern.

Default (initials fallback)

When no tenant logo is provided, shows a colored initial badge. Trigger uses hover state (neutral/15), open state uses active styling (neutral-medium/15 + inner glow).

With tenant logo

When logoUrl is provided, displays the logo image instead of the initial badge.

Role formatting

Role is displayed in the dropdown, formatted as Title Case (owner → Owner, office_staff → Office Staff).

role: owner

role: admin

role: office_staff

role: salesperson

role: crew_lead

role: installer

Keyboard shortcuts

Dropdown menu items show keyboard hints: 'G then S' for Settings, 'Alt + Q' for Log out. These are visual hints only — keyboard handling is implemented at the app level.

Click any UserNav above to see the dropdown with keyboard shortcuts displayed.