What is downshift?

Downshift is a React library for building dropdown components, autocomplete inputs, and combobox widgets that work correctly for people using screen readers and keyboard navigation. Building these components from scratch while meeting accessibility standards is difficult and repetitive, so Downshift provides the underlying logic, leaving the visual design entirely up to the developer. The library takes a "bring your own UI" approach. Rather than rendering a specific dropdown that developers then try to customize, Downshift handles only the behavior: tracking which item is highlighted, whether the list is open, what happens when the user types or presses arrow keys, and how to announce changes to screen readers. The developer writes all the HTML and CSS for the actual dropdown, and Downshift provides a set of functions that attach the right event handlers and accessibility attributes to each element. The library currently offers three main tools: a useCombobox hook for a text input with a suggestion list (the classic autocomplete pattern), a useSelect hook for a custom dropdown menu that replaces a standard select element, and a useTagGroup hook for managing groups of removable tags, which is useful for multiple-selection interfaces. There is also an older Downshift component that works via a render prop pattern rather than hooks. The README recommends using the hooks for new projects, noting that the older component will eventually be removed once the hooks are considered mature. Installation is a single npm command, and the library also works with Preact. The accessibility implementation follows the W3C ARIA 1.2 combobox patterns, meaning the components behave consistently with what assistive technologies expect. The docsite at downshift-js.com has live examples, API references, and migration guides. The full README is longer than what was shown.