Ready for Dev, so its markup, attributes, events and styles can all still change without notice,
it is not covered by the accessibility gate, and it is not published to npm. It is on this site so the work
can be seen and reviewed - nothing more.
Combobox
A filterable single-select built on the native customizable-select API, rendered as
<select is="root-combobox">.
Usage
<select is="root-combobox" aria-label="Choose a country">
<option value="it">Italy</option>
<option value="fr">France</option>
<option value="es">Spain</option>
<option value="de">Germany</option>
</select>
It reuses the customizable-select picker and adds type-to-filter: typing hides the
options (and emptied <optgroup>s) that don't match, a visually-hidden live region
announces the result count, and Escape clears the filter. Selecting an option or leaving
the field resets it. Native selection, keyboard, value and form participation are untouched; where the
customizable-select API is unsupported it degrades to a plain native <select> with
native typeahead.
Methods
| Method | Description |
|---|---|
filterBy(query) |
Hide options that don't match query; collapse empty groups; announce the count |
resetFilter() |
Restore every option/group and clear the announcement |
Events
Native change (and input) events fire from the underlying
<select>.
Extends
HTMLSelectElement - use with <select is="root-combobox">.