Skip to content

ComponentsToggleGroup

Components

ToggleGroup

A row of independent toggles with roving focus (the code titlebar pane toggles). spacing 1 = 4px apart; spacing 0 = the joined ButtonGroup look. Single-select UIs use SegmentedControl.

Independent toggles

type multiple (default): every item toggles on its own. Arrow keys move focus without toggling; Space / Enter toggle.

light
dark
Code titlebar panes (xs, 4px apart)
files

Joined and single

spacing 0 renders the joined ButtonGroup look (one ring, seams). type single keeps one value (it can be cleared; prefer SegmentedControl for a required choice).

Joined secondary