Toggle Group

A set of two-state buttons that can be toggled on or off.

Dependencies

@radix-ui/react-toggle-group: v1.1.0

Installation

npx @kosori/cli add components toggle-group

Usage

import { ToggleGroup, ToggleGroupItem } from '~/components/ui/toggle-group';

<ToggleGroup type='single'>
  <ToggleGroupItem value='a'>A</ToggleGroupItem>
  <ToggleGroupItem value='b'>B</ToggleGroupItem>
  <ToggleGroupItem value='c'>C</ToggleGroupItem>
</ToggleGroup>

Reference

Prop	Type	Default
`size`	`enum`	`medium`
`variant`	`enum`	`ghost`

Examples

Variants

Sizes

Single

Disabled

Previous

Toggle

Next

Tooltip

On this page

Install the primitive

Copy-paste the component

Update import paths

Contribute

Report a bug New ideas Start a discussion