ToggleGroup — Loidolt Theme

import { ToggleGroup } from '@loidolt/theme-svelte';

Example

Tool: select · Overlays: grid

Single mode is a radio group in behaviour and in markup; multiple mode is a row of pressed buttons.
Reach for Select instead once the options stop being worth showing at all times.

Generated from the component source, so it cannot drift from the implementation.

ToggleGroup props
Prop	Type	Default	Notes
`options` required	`Option<T>[]`	`—`
`children`	`Snippet<[Option<T>]>`	`—`	Renders an option's contents — an icon, say — in place of its plain label.
`class`	`string`	`—`
`disabled`	`boolean`	`false`
`id`	`string`	`—`	Narrowed from the DOM attribute: the Bits root this spreads onto rejects `null`.
`itemClass`	`string`	`—`
`label`	`string`	`—`	Accessible name of the group.
`multiple`	`boolean`	`false`	Lets more than one option be pressed at once. `value` is then an array.
`onValueChange`	`(value: T \| T[]) => void`	`—`
`orientation`	`Orientation`	`'horizontal'`
`ref` bindable	`HTMLDivElement \| null`	`null`
`size`	`ControlSize`	`'md'`
`value` bindable	`T \| T[]`	`—`	Pressed option, or options when `multiple`. Bindable.

Plus the attributes of Omit<HTMLAttributes<HTMLDivElement>, 'children'>, forwarded to the root element.