Org switcher

Switches organisation and workspace (Cloud).

Guidance

The organisation and workspace switcher for Marmot Cloud, at the foot of the sidebar (OSS hides it). The button shows the organisation over the workspace, after a square initial. It opens a popover with a search field over a listbox of workspaces grouped by organisation, each with its plan as a quiet caption ("Team") and the current one checked, and a "Create workspace" action.

In the collapsed rail only the square initial shows; the full names stay in the accessible name.

Keyboard: the search field is a combobox (https://www.w3.org/WAI/ARIA/apg/patterns/combobox/examples/combobox-autocomplete-list/). Typing filters the workspaces by workspace or organisation name; ArrowDown and ArrowUp move the active workspace (wrapping), Home and End jump to the ends, Enter switches, Escape closes and returns focus to the button. Tab reaches "Create workspace". ArrowDown on the button also opens it.

Properties

Property	Attribute	Type	Default	Description
orgs		Organisation[]	[]	Organisations and their workspaces.
org	org	string	''	The current organisation's id.
workspace	workspace	string	''	The current workspace's id.
collapsed	collapsed	boolean	false	Shows only the square initial, for the collapsed rail. Set by mm-sidebar-nav.
disabled	disabled	boolean	false
noCreate	no-create	boolean	false	Hides "Create workspace", for people who may not create one.
open	open	boolean	false	Whether the popover is open.

Events

Event	Detail	Description
mm-switch	CustomEvent<SwitchDetail>	A workspace was chosen. Cancel it to keep the current one.
mm-create-workspace	CustomEvent<CreateWorkspaceDetail>	"Create workspace" was activated.

CSS parts

Part	Description
trigger	The button.
initial	The square initial.
popover	The popover.
search	The search field.
listbox	The listbox.
option	Each workspace.
create	The "Create workspace" button.

Examples

Every state of mm-org-switcher in Storybook, with keyboard and screen reader tests.