Toggle Group
A set of two-state buttons that can be toggled on or off.
Installation
Usage
Examples
Default
Outline
Single Selection
Small Size
Large Size
Disabled
With Text
API Reference
Properties
| Property | Type | Default | Description |
|---|---|---|---|
variant | "default" | "outline" | "default" | The visual variant of the toggle group. Applied to both the group container and all items. |
size | "default" | "sm" | "lg" | "default" | The size of the toggle group. Applied to both the group container and all items. |
type | "single" | "multiple" | "single" | Whether to allow single or multiple selections. |
disabled | boolean | false | Whether the toggle group is disabled. |
groupValue | string | string[] | — | The current value(s) of the toggle group. |
value | string | — | The value of the toggle group item. Items inherit variant and size from parent. |
disabled | boolean | false | Whether the toggle group item is disabled. |
class | string | — | Additional CSS classes to apply to the toggle group or item. |
Outputs
| Output | Type | Description |
|---|---|---|
groupValueChange | EventEmitter<string | string[]> | Event emitted when the toggle group value changes. |
Built with ❤️ by @immohammadjaved • Source code available on GitHub