Toggle Chip
Filter chips that toggle into the lit key with a sliding, drawn check and a count, in single or multiple chip groups with roving focus, plus removable chips.
Preview
Status · multiple
Sort · single
Standalone · sizes
Applied tags · removable
design-systemq4priya
Install
Pro source requires Pebble Pro. Try the full preview above.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| pressed / defaultPressed / onPressedChange | boolean / boolean / (pressed) => void | — / false / — | ToggleChip state. |
| type | "single" | "multiple" | — | ToggleChipGroup. Radio-like or checkbox-like. Required. |
| value / defaultValue / onValueChange | string | string[] | — | ToggleChipGroup selection (a string for single, an array for multiple). |
| count | number | — | A count after the label, spoken as "Open, 38". |
| icon | ReactNode | — | Leading icon. |
| size | "sm" | "md" | "lg" | "md" | 28, 32 or 36 px. |
| onRemove / removeLabel | () => void / string | — / "Remove <label>" | RemovableChip. The × and Backspace/Delete call onRemove. |
Pro component
Try the full preview above. Editable source and build guides require Pebble Pro.