Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProA multi-select whose Select all row applies to the options that match the search, with a mixed state and a live count. Use this when people pick many items out of a long list and want to take a filtered group in one go.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use it for choosing members, files or recipients out of dozens, where "everyone in Design" is a search followed by Select all, not twenty clicks.
Do not use it when people must pick one by one on purpose (consent, approvals). Do not offer a bulk row there.
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Default | Description |
|---|---|---|---|
options | { value, label, group? }[] | - | The items. |
value | string[] | - | Selected values (controlled). |
defaultValue | string[] | [] | Initial selection. |
onValueChange | (value: string[]) => void | - | Runs on every change. |
noun | string | items | Word used in the labels and announcements. |
disabled | boolean | false | Disables the button. |
Select all 4 matching (or Clear 4 matching), with aria-checked true, false or mixed for the matches.aria-checked; the list is aria-multiselectable; the button name is <noun>, N selected.4 match, 2 of them selected.The pattern ships with a Testing Library test (multi-select-all-matching.test.tsx) that covers select all over the filtered results only, the mixed state, clearing the matches and keeping the other selections.