Inputs

Filtered suggestion field

A text field that filters a list of suggestions as you type and shows the matches in a dropdown below, with keyboard navigation and a clear button.

Destination

Type to filter, arrows to move, Enter to pick. Try “li”.

Using Filtered suggestion field

A text field that filters a list of suggestions as you type and shows the matches in a dropdown below, with keyboard navigation and a clear button.

Try the live preview with a pointer and keyboard, then check focus visibility and the narrow layout in your own page. Use the plate number or slug when asking your coding agent to fetch this component.

Props: placeholder, accentColor, maxVisible

Which frameworks are available?

The catalog lists these versions: react, vue, svelte, astro, html. The live preview on this page runs React.

How do I access the implementation?

The code, framework versions and installation commands are available in the workbench above.

Connect your agent

Nearby

2761Combobox fieldInputsA searchable dropdown field: typing filters a list of options live, and picking one fills the field.

2421Searchable SelectInputsA button that opens a small popover with a search field and a filterable list of options, so someone can type to narrow choices instead of scrolling a long dropdown.

2762Command search paletteInputsA search field that drops a filtered list of commands beneath itself as you type, with arrow-key highlighting, hover selection and a keyboard hint footer.

2800Range span sliderInputsA slider with two thumbs on one track, letting someone pick a low and high value together as a filled span.

2778Search Composer FieldInputsA message box that grows with what you type, with a lookup toggle whose label slides open and a send action that wakes up once there is text.

2297Addon Input GroupInputsA text field wrapped in one bordered shell that can carry a leading icon, a trailing button or text, and shares one focus ring across the whole group.