Components
Switchers
Switchers
A trigger + dropdown for switching context — organisation (conveyancing), partner, or branch (partner area). The current item drives the trigger; the dropdown lists every option (shown even when there is only one) and each row posts to a switch endpoint. Closes on click-outside or Escape.
Canonical
The card variant (set a label). The trigger shows the current item; clicking opens the
dropdown of all options. Drop the label for the compact button variant used in a top bar.
Props
7 inputs| Attribute | Type | Notes |
|---|---|---|
| items | IReadOnlyList<ContextSwitcherItem> | Each row's name, current state, hidden form fields, and avatar (Organisation / Partner / Icon). The current item drives the trigger. |
| label | string? | Set it for the card trigger (eyebrow over the current name). Omit it for the compact button trigger. |
| post-url | string | Form action each row posts to (e.g. /conveyancing/switch). |
| align | left | right | Which edge the dropdown aligns to. Use right in a right-aligned top bar. |
| collapse-state | string? | Alpine expression (e.g. sidebarCollapsed); when truthy the trigger shows the avatar only. |
| search-placeholder / empty-label | string | Search field placeholder and no-results message. Search appears once the list is long. |
Do & don't
Do
Render the switcher even when there's a single option, so users learn the control can hold more. Reuse one component for org, partner, and branch — just change the items and post URL.
Don't
Don't trap context switching behind a full-screen modal. A dropdown dismisses on click-outside or Escape and keeps the user in place.