A checkbox dropdown for selecting multiple values from a list. Selected items can display as a count, labels, or badges. Use it for filtering or when presenting a finite set of options where multiple choices are needed.
tsimport {MultiSelector} from '@astryxdesign/core/MultiSelector'
| Guidance | Practices |
|---|---|
| Do | Use for a moderate, finite set of options where multiple choices are needed. |
| Do | Enable search filtering when the list exceeds ~15 options. |
| Do | Use renderOption for custom option rows; the checkbox affordance remains owned by MultiSelector. |
| Do | Enable select-all when most users will want all or nearly all options selected. |
| Don't | Use for single-value selection; use Selector instead. |
| Don't | Show more than ~20 options without enabling search. |
Column visibility toggle with hidden label, search, select-all, and selection count.
Two multi-selectors in a form with required/optional states.
Multi-select with options grouped into labeled sections.