Toggle Group
A set of two-state buttons that can be toggled on or off.
Loading preview
Usage
import { ToggleGroup } from "@lemonsqueezy/wedges";<ToggleGroup defaultValue="value-1">
<ToggleGroup.Item value='value-1'>Value 1</ButtonGroup.Item>
<ToggleGroup.Item value='value-2'>Value 2</ButtonGroup.Item>
</ButtonGroup>API Reference
ToggleGroup
Contains a set of ToggleGroup.Item components. Extends the Radix Toggle Group primitive and includes all of its props. Alternatively, ToggleGroup.Root can be used in place of this component.
| Prop | Value | Default |
|---|---|---|
asChild | boolean | false |
defaultValue | string | string[] | / |
dir | "ltr" | "rtl" | "ltr" |
disabled | boolean | false |
loop | boolean | true |
onValueChange | function | / |
orientation | "horizontal" | "vertical" | "vertical" |
rovingFocus | boolean | true |
size | "sm" | "md" | "md" |
type | "single" | "multiple" | single |
value | string | [] |
ToggleGroup.Item
Includes all props from the Toggle component.
Examples
Loading preview
The following example shows how to use the ToggleGroup with multiple prop.
Loading preview