Component
Chip group
A horizontally scrolling row of pill filters, single- or multi-select, with the active chip filled solid.
The primitive
chip group.tsx
<NativeChipGroup chips={chips} value={value} onValueChange={setValue} />Example
Filter chips sit above a transaction list, narrowing it by status as each one is toggled.
Showing all transactions
chip-group-example.tsx
<NativeChipGroup chips={filterChips} value={filter} onValueChange={setFilter} />
<TransactionList filter={filter} />Capabilities
| Prop | Type | Description |
|---|---|---|
| chipsrequired | NativeChip[] | — |
| valuerequired | string | string[] | Selected key(s) — pass string for single, string[] for multi |
| onValueChangerequired | (value: string | string[]) => void | — |
| multi | boolean | — |
| className | string | — |