Shadcn Toggle Group Basic

When to use

• Editor formatting and alignment controls kept as one set, such as bold, italic, underline or justify
• View, column layout and theme switchers where the pressed item holds the current choice
• Short option rows for a time range, status, sort order, billing period, channels or device settings

When not to use

• Formatting where only one option applies at a time, such as text alignment: use the Toggle Group Text Alignment example
• Related actions such as export, zoom or playback joined in one strip with no pressed state: use the Button Group component
• A single on or off control such as bookmark or mute that stands on its own: use the Toggle component
• Labelled settings in a list, each flipped on or off beside its own text: use the Switch component

Agent notes

• The base twin picks one item unless multiple is set and always takes an array defaultValue; the radix twin needs type single or multiple
• No example passes value to ToggleGroup or reads a change back, so the pick stays inside the group; control it to act on the choice
• A second click on a pressed ToggleGroupItem releases it in both twins, so even a single choice group can end with nothing picked