sheengemologic ui
All components

WorkspaceSwitcher

An app-owned workspace selector with consistent topbar, sidebar-header, and sidebar-footer presentations.@gemologic/sheen-patterns · application

Playground

<ThemeProvider><WorkspaceSwitcher workspace={{ label: "Workspace", currentId: "alpha", items: [{ id: "alpha", label: "Alpha" }], onChange: () => {} }}  target="sidebar-header"/></ThemeProvider>

Variant matrix

Sidebar workspace
target: topbar-start
target: topbar-end
target: sidebar-header
target: sidebar-footer

Anatomy

Package
@gemologic/sheen-patterns
Source
packages/patterns/src/WorkspaceSwitcher.tsx
Tokens
  • --sheen-color-accent
  • --sheen-color-bg-raised

Accessibility

Role: button, menu, radioKeyboard: Tab, Enter, Space, ArrowDown, ArrowUp, Escape

Do

  • Keep currentId app-owned and stable during refresh.

Do not

  • Do not persist or fetch workspace state inside the selector.

Generated props

NameTypeDefaultDescription
workspace *AdminWorkspaceModel—Current workspace, ordered choices, and an app-owned accepted-change callback.
target"topbar-start" | "topbar-end" | "sidebar-header" | "sidebar-footer"sidebar-headerSemantic chrome target controlling logical menu direction and alignment.
collapsedbooleanfalseIcon-rail presentation. The workspace label remains available to assistive technology.
Native Solid/HTML attributes remain available and are omitted from this authored-prop view.