Searchable Dropdown (Autocomplete)

Design a mobile autocomplete dropdown for a form field that narrows options as the user types. It should feel like one control: the input at top, the suggestion list directly below, and the current query always visible.

This lives in a phone form flow where the user may need to pick from a long, messy list without scrolling through the whole thing. The interaction has to support fast typing, quick scanning, and tapping a result with one thumb.

Make the filtered list feel responsive without becoming noisy. Show how matching text is surfaced, how the list changes as the query evolves, and what happens when the search returns only a few results or none at all.

The interesting part is balancing search and selection in a tight vertical space. The component needs to stay legible while the keyboard is open, keep the current input context intact, and make the chosen option feel confirmed without leaving the field.

Use clear match highlighting and keep the typed query anchored in the field; don’t replace the input with the selected label until the choice is committed.