ToggleGroup is a component that allows you to group multiple toggles together. Useful for when you want to allow users to select multiple options. For example, a user can select multiple filters for a search.
import ToggleGroup from "@radui/ui/ToggleGroup";
const items = [
{ label: <FrameIcon />, value: 'item1' },
{ label: <CropIcon />, value: 'item2' },
{ label: <LayersIcon />, value: 'item3' },
{ label: <ColumnsIcon />, value: 'item4' }
];
const ToggleGroupWrapper = () => {
const handleChange = (newPressed) => {
console.log(newPressed)
}
return (
<ToggleGroup
defaultPressed={false}
onChange={handleChange}
type="multiple"
items={items}
/>
)
}