Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProA multi-select in a bottom sheet that works on a draft: people tick options, search, select all or clear, and only Apply commits while Cancel or a swipe down discards. Use this when a filter should change the page only once, after the person is done choosing.
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 filters on phone-sized layouts and for expensive filters, where every tick re-running the list would be slow or disorienting and people want a clear commit point.
Do not use it when each choice should take effect immediately. Use a popover multi-select.
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 }[] | - | The choices. |
value | string[] | - | Committed values (controlled). |
defaultValue | string[] | [] | Initial values. |
onValueChange | (value: string[]) => void | - | Runs only on Apply. |
title | string | Filter | Sheet title. |
aria-label | string | Filter | Names the button. |
checkbox inputs inside a fieldset whose legend is the title; Select all and Clear act on the filtered options.Apply (3); Cancel discards the draft.The pattern ships with a Testing Library test (bottom-sheet-multi-select-apply.test.tsx) that covers the draft not committing until Apply, Cancel discarding, search keeping ticks and the button count.