Toggle Group
A set of two-state buttons that can be toggled on or off.
Toggle Group
Formatting
Alignment
View
Installation
1pnpm dlx shadcn@latest add @glasswave/toggle-groupUsage
1import { ToggleGroup, ToggleGroupItem } from "glasswave";1<ToggleGroup type="multiple">2 <ToggleGroupItem value="bold" aria-label="Toggle bold">3 <FontBoldIcon className="h-4 w-4" />4 </ToggleGroupItem>5 <ToggleGroupItem value="italic" aria-label="Toggle italic">6 <FontItalicIcon className="h-4 w-4" />7 </ToggleGroupItem>8 <ToggleGroupItem value="strikethrough" aria-label="Toggle strikethrough">9 <FontStrikethroughIcon className="h-4 w-4" />10 </ToggleGroupItem>11</ToggleGroup>API Reference
Built on Radix UI Toggle Group. variant and size set on ToggleGroup cascade to its items.
ToggleGroup
| Prop | Type | Default |
|---|---|---|
variant | "default" | "secondary" | "default" |
size | "default" | "sm" | "lg" | "default" |