A searchable input for selecting a single item from a large or dynamic dataset. Results appear as the user types, with support for async data sources, debounced search, and custom item rendering. Use it when the option list is too large for a Selector dropdown.
tsimport {Typeahead} from '@astryxdesign/core/Typeahead'
| Guidance | Practices |
|---|---|
| Do | Provide descriptive placeholder text that hints at what users can search for. |
| Do | Show suggestions on focus when users benefit from seeing popular or recent options before typing. |
| Do | Add a search delay for remote data sources to avoid excessive network requests. |
| Don't | Use for short, static option lists; use Selector for better discoverability. |
| Don't | Use for multi-selection; use Tokenizer instead. |
| Don't | Place multiple Typeaheads adjacent to each other without clear labels differentiating them. |
Typeahead with a capped dropdown showing at most three results.