Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProThe All, Mine, Unread filter row where each button's name includes its count, the active filter is the checked option and the shown count is announced.
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 this above inboxes, task lists and tables for the two to four filters people use most.
Do not use it for more than five filters (use tabs or a menu), or for filters that combine (use checkboxes).
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 |
|---|---|---|---|
filters | { value, label, count }[] | - | The options. |
value / onValueChange | string / fn | - | Controlled filter. |
label | string | Filter | Name of the group. |
aria-hidden, so it is spoken once.| Key | Action |
|---|---|
| ArrowLeft / ArrowRight | move between filters |
| Enter or Space | choose |
The pattern ships a Testing Library test (toggle-group-quick-filter.test.tsx) that covers names with counts, the announcement, the sticky choice and arrow keys.