Skip to content

Conversation

@ByronDWall
Copy link
Contributor

@ByronDWall ByronDWall commented Oct 28, 2025

Refactored ComboBox to use a unified context-based architecture for better state management and added several missing features that were causing usability issues.

Why this change was necessary:

The previous ComboBox implementation had fragmented state management that made it difficult to coordinate behavior between the input, dropdown, and selection components. This caused issues with:

  • Keyboard navigation not working reliably
  • Multi-select tags not syncing properly with selections
  • Async data loading being difficult to implement
  • Missing critical features like custom option creation and advanced filtering
  • Inconsistent behavior between single and multi-select modes

The new architecture consolidates state management into a single context pattern, enabling proper coordination between all component parts and making it straightforward to add features like async loading, custom filters, and creatable options. This brings ComboBox up to par with other production-grade autocomplete components and unblocks several user-facing feature requests.

@ByronDWall ByronDWall self-assigned this Oct 28, 2025
@changeset-bot
Copy link

changeset-bot bot commented Oct 28, 2025

🦋 Changeset detected

Latest commit: 17fb21e

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 4 packages
Name Type
@commercetools/nimbus Major
@commercetools/nimbus-i18n Major
@commercetools/nimbus-tokens Major
@commercetools/nimbus-icons Major

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel
Copy link

vercel bot commented Oct 28, 2025

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Review Updated (UTC)
nimbus-documentation Ready Ready Preview, Comment Dec 18, 2025 5:58pm
nimbus-storybook Ready Ready Preview, Comment Dec 18, 2025 5:58pm

…nd collection are now being set in a usable way
…ct is working with tag group, filtering is working - basic functionality using single context achieved
…ectly and add a few basic tests, add a set of custom filters for use with combobox and test them, update comments and documentation, update testing plan, update readme, etc
… child components in trigger do not receive external values
Comment on lines +387 to +393
<Provider
// clear child contexts so that parent wrappers do not affect this component
values={[
[ButtonContext, {}],
[InputContext, {}],
[TagGroupContext, {}],
]}
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@jaikamat here's the context clearing. I'm not sure if InputContext being cleared will cause issues with the FormField, so please feel free to remove that if necessary.

* chore(nimbus): combobox - layout structure tests

* chore(nimbus): combobox - multi-select tag display tests

* chore(nimbus): combobox - input field behavior tests

* chore(nimbus): combobox - button visibility and behavior tests

* chore(nimbus): combobox - focus behavior tests

* chore(nimbus): notes

* chore(nimbus): combobox - keyboard navigation tests

* chore(nimbus): combobox - menu opening and closing tests

* chore(nimbus): combobox - option selection tests

* chore(nimbus): combobox - clear button functionality tests

* chore(nimbus): combobox - multi and single select behavior tests

* chore(nimbus): combobox - selection persistence tests

* chore(nimbus): combobox - basic text filtering tests

* chore(nimbus): combobox - custom filter tests

* chore(nimbus): combobox - empty state handling tests

* chore(nimbus): combobox - basic custom option creation tests

* chore(nimbus): combobox - single select creation tests

* chore(nimbus): combobox - a11y keyboard tests

* chore(nimbus): combobox - a11y relationship tests

* chore(nimbus): combobox - visual variant tests

* chore(nimbus): combobox - state visual tests

* chore(docs): remove temporary testing plan file

* chore(combobox): revisions

* feat(combobox option): options in listbox don't focus on hover

* chore(combobox): add test for modal integration

* chore(dialog): squelch button context for children

* Revert "chore(dialog): squelch button context for children"

This reverts commit af7f799.

* chore(combobox): edit tests after rebase

* chore(combobox): await in test, fix

---------

Co-authored-by: Byron Wall <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants