The Autocomplete component allow user to type and select from a list of options.
The Autocomplete components renders a filterable list of options in a Popover — it does not render the text input. If you need a combination with a text input and trigger button, take a look at the Combobox component.
The autocomplete component combines a set of external libraries:
Downshift
for autocompletereact-tiny-virtual-list
for performant list renderingfuzzaldrin-plus
for fuzzy filteringGet the openMenu
prop to manually open the menu on certain events such as onFocus
.
Full width with flex and options title, onFocus, filtering, and button to trigger the autocomplete. Note that this is very similar to the Combobox component. Consider using that component before using the Autocomplete component directly.