downshift-js/downshift

This system is a React library for building accessible autocomplete, combobox, and select UI components. It provides a suite of hooks, including useCombobox, useSelect, and useTagGroup, to manage stateful logic and ARIA-compliant props for these interfaces. The codebase has been rewritten in TypeScript to support modern React patterns and includes comprehensive testing for browser, server-side, and React Native environments.

11 changes.

The project underwent a major infrastructure overhaul, migrating the codebase from JavaScript to TypeScript and upgrading the testing stack to Playwright. This period centered on the complete rewrite of Downshift v9, replacing legacy class-based components with modern React hooks and optimizing builds with Babel macros. Comprehensive test suites were added to ensure type safety, accessibility compliance, and compatibility across various environments including SSR and Preact.

7 changes.

This period focused on introducing the useSelect and useCombobox hooks to provide accessible, stateful logic for custom dropdowns and autocomplete components. The work included implementing ARIA-compliant patterns with keyboard navigation and screen reader support, alongside comprehensive test suites and Flow type definitions to ensure robustness and developer experience.

8 changes.

This period focused on introducing the new useTagGroup hook to provide accessible tag group components, while deprecating the older useMultipleSelection hook. The work was heavily supported by extensive test coverage, including unit tests for utilities and hooks, as well as Playwright end-to-end tests for core UI components. Additionally, a new Docusaurus documentation site was established to host interactive examples and guide users through the API changes.

Introduces a new Docusaurus-based documentation site featuring interactive examples for Downshift components, including useCombobox, useSelect, useMultipleCombobox, useMultipleSelect, useTagGroup, and useTagGroupCombobox. The site includes a compiled version of useCombobox to demonstrate React Compiler compatibility, along with necessary Webpack 5 polyfills and TypeScript configuration to support the build process.

docusaurus · high confidence

This change introduces Flowtype definitions for the Downshift library (version 2.x.x), generated from TypeScript definitions. This enables Flow users to get type checking and autocomplete support for Downshift components and props, such as \DownshiftProps\, \StateChangeTypes\, and various helper functions like \getInputProps\ and \getMenuProps\.

flow-typed · high confidence

The library now provides a single entry point for all TypeScript definitions in typings/index.d.ts, which re-exports types from the internal distribution files for the legacy Downshift component and the useSelect, useCombobox, useMultipleSelection, and useTagGroup hooks, simplifying type imports for consumers.

typings · high confidence

The library has been rewritten from the ground up for version 9, replacing the legacy class-based \Controller\ and \Input\ components with a modern architecture centered around the \Downshift\ class and new React hooks (\useSelect\, \useCombobox\, \useTagGroup\). The codebase is now fully typed with TypeScript definitions (\downshift.types.ts\) and utilizes Babel macros (\is.macro\, \productionEnum.macro\) to statically optimize environment checks (Preact, React Native) and strip development-only code for production builds. This change removes the old context-based API and legacy utility files, introducing a cleaner, more performant, and type-safe interface for building autocomplete and select components.

src · high confidence

This change adds the \useSelect\ hook, a new React hook that manages the stateful logic required to build custom, accessible select dropdowns. It provides getter props (for the label, toggle button, menu, and items) and action props to implement the ARIA dropdown select pattern, including keyboard navigation, screen reader support, and item selection. The implementation includes a dedicated reducer, TypeScript types, and state change type definitions to handle interactions like arrow keys, character typing, and mouse events.

src/hooks/useSelect · high confidence

Added the \useTagGroup\ hook, which provides the stateful logic and ARIA-compliant props needed to build accessible tag group components. The hook manages item selection, addition, and removal, supporting keyboard navigation (arrow keys, delete, backspace) and screen reader announcements. It exposes getter props (\getTagGroupProps\, \getTagProps\, \getTagRemoveProps\) and imperative actions (\addItem\), along with state and callbacks for customization. The implementation includes a dedicated reducer for state transitions and utilities for generating stable element IDs and accessible descriptions.

src/hooks/useTagGroup · high confidence

The \useCombobox\ hook is now available, providing a React hook that manages the stateful logic for accessible combobox and autocomplete dropdowns. It returns getter props (for label, toggle button, input, menu, and items) and action props to implement the ARIA combobox pattern, supporting features like keyboard navigation, item selection, and screen reader status messages.

src/hooks/useCombobox · high confidence

The Next.js-based example application located in the \examples\ directory has been completely removed. This includes the deletion of the \pages\ directory (containing basic, react-autocomplete, react-instantsearch, react-select, and semantic-ui examples), the \next.config.js\ configuration, and associated build files like \.babelrc\ and \.npmrc\. Users relying on these specific Next.js-based demos for reference or development will no longer have access to them in this location.

examples · high confidence

The project has undergone a significant infrastructure migration. The codebase has been converted from JavaScript to TypeScript, evidenced by the addition of \tsconfig.json\ and the removal of the legacy \.babelrc\. The documentation site has been rebuilt using Docusaurus (replacing Docz), with a new \docusaurus.config.js\ and \babel.config.js\ to handle the build. End-to-end testing has switched from Cypress to Playwright, reflected in the new \playwright.config.ts\ and the removal of Cypress-specific files. Additionally, the project has moved from Travis CI to GitHub Actions, removed the \nps\ script runner in favor of standard npm scripts, and updated the repository metadata to reflect the \downshift-js\ organization.

(repo-wide) · high confidence

The \useMultipleSelection\ hook is now deprecated and users are advised to migrate to the new \useTagGroup\ hook, which provides a more intuitive and extensible API for building accessible multiple-selection interfaces with tags. This change introduces a migration guide and updates the hook's documentation to reflect its deprecated status, while the underlying implementation remains available for existing consumers.

src/hooks/useMultipleSelection · high confidence

This release introduces comprehensive migration documentation for upgrading to versions 7, 8, and 9, detailing breaking changes such as ARIA 1.2 compliance, the removal of the \circularNavigation\ prop, and updates to accessibility message props. Additionally, the \useSelect\ hook now includes a new \getItemIndexByCharacterKey\ utility function that handles case-insensitive, circular item matching by character input while respecting disabled items, accompanied by its corresponding unit tests.

src/hooks · high confidence

Add test utilities and internal state management for useCombobox hook; Added Jest snapshot tests for Downshift components and utilities; Added Playwright end-to-end tests for combobox, select, and tag group components; Added TypeScript test fixtures for Downshift hooks and components; Added comprehensive test coverage for the useMultipleSelection hook; Added comprehensive test coverage for utility functions; Added comprehensive test suite for Downshift component; Added comprehensive tests for the useSelect hook; Added comprehensive tests for useCombobox getter props and state actions; Added mocks for accessibility status and utility functions; Added server-side rendering tests; Added test suite for React Native support; Added tests for build exports and Preact compatibility; Added unit tests for utility hooks and functions.

The project has performed a comprehensive dependency upgrade, moving the React peer dependency from version 15 to 18, replacing the legacy Babel toolchain with modern build scripts via kcd-scripts, and switching end-to-end testing from Cypress to Playwright. Runtime dependencies were updated to include compute-scroll-into-view v3, tslib, and react-is, while the legacy examples package (which relied on Next.js v2 and React v15) has been removed entirely.

(dependencies) · high confidence

Written by watchdog.canine.dev from the codebase's own history, inside the signed delivery this page is composed from.

• CAI 59 → 54 (-5.2)
• Rubric changed (rubric-2026.09.12 → rubric-2026.09.18) — scores are not directly comparable.

• Code Health 76 → 76 (+0.2)
• Architecture 93 → 87 (-6.2)
• Maturity 61 → 61 (-0.0)
• Readiness 53 → 41 (-12.2)
• Security 68 → 68 (+0.1)
• Accessibility 61 → 61 (+0.0)
• Performance 100 (new)

• Documentation: no installation or build instructions (README.md)
• Documentation: no licence statement (README.md)
• Documentation: no usage examples (README.md)
• Hotspot: src/hooks/useMultipleSelection/index.js (src/hooks/useMultipleSelection/index.js)
• Hotspot: src/hooks/utils/getHighlightedIndexOnOpen.ts (src/hooks/utils/getHighlightedIndexOnOpen.ts)
• Off-boarding risk: anonymized user #1

• End-of-life runtime: Node.js 16
• Off-boarding risk: anonymized user #1
• Projects may be oversized for their cohesion

Written by watchdog.canine.dev from the codebase's own history, inside the signed delivery this page is composed from.

downshift-js/downshift was measured the same way every project in this corpus was: the same rubric, at a pinned commit, with the result published in full. Point a surveyor at a repository you know and see whether you agree with it.