ToggleChip

A pill button with a pressed state (aria-pressed), for filters and toggles.

@ruckc/truss-ui Choice

Import

import { ToggleChip } from '@ruckc/truss-ui';

intent

size

pressed

icon

check

disabled

Also accepts every attribute of HTMLButtonAttributes, applied to the underlying element.

Prop	Type	Default	Description
`pressed` bindable	`boolean`	`false`
`onchange` event	`(pressed: boolean) => void`	—	Called with the new state after the user toggles the chip.
`size`	`'sm' \| 'md'`	`'md'`	Control size: `sm` (24px), `md` (32px, default) or `lg` (40px).
`intent`	`Intent`	`'primary'`	Colour role of the pressed state.
`icon`	`IconSource`	—	A built-in glyph name, a `{ path, viewBox? }` definition or a snippet.
`check`	`boolean`	`false`	Shows a check mark while pressed (replaces `icon`).
`children` snippet	`Snippet`	—	Content, as a Svelte snippet.