Selects, Dropdowns & Autocompletes: Exploring the Combobox

Will Klein

Will Klein

Computer screen with code and webpage in a split screen

From styling a select, to building a robust autocomplete input with multiple selections, the combobox is a ubiquitous and powerful family of components in our UI. It offers many lessons, from how to layout sub-components like a search icon within an <input> element, to managing a popup for its list items, to learning how the W3C ARIA specification can be used as a reference. Most of all, it sets the stage to explore accessibility, going beyond basic tab order and into keyboard navigation and the screen reader experience. Through examples from our favorite open source component libraries like Chakra UI and MUI, we can quickly level up our understanding of advanced UI components.

Will Klein

About Will Klein

Will is a specialist in developer experience, building tools, and sharing how they work. He draws from 18 years of practice, working in design systems, full-stack development, and most importantly, making mistakes and learning from them.

What started as a fear of public speaking turned into dozens of talks and organizing local events for over a decade. Will has built in-person and online communities around JavaScript, React, and design systems. Through his work, he strives to make the tech industry more equitable and supportive for all.

Author of http://astsareaweso.me

He/him

Copyright © 2024 React Denver. All rights reserved.
netlify call to actionHosted by Netlify