Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Fix displayValue syncing when Combobox.Input is unmounted and re-mounted in different trees #2090

Merged
merged 2 commits into from
Dec 12, 2022
Merged

Fix displayValue syncing when Combobox.Input is unmounted and re-mounted in different trees #2090

merged 2 commits into from
Dec 12, 2022

Conversation

RobinMalfait
Copy link
Member

This PR should simplify the calculation of the displayValue, regardless of whether it is used in
the same or a different render tree.

The idea is that the displayValue (the text that should be shown in the Combobox.Input) is
always calculated, but only applied when it is safe to apply. These rules are:

  • When a user is not typing in the input field, it is safe to update the input value based on the selected option(s).
  • The value can be updated when:
    • The value is set from outside of the component.
    • The value is set when the user uses their keyboard (confirm via enter or space).
    • The value is set when the user clicks on a value to select it.
  • The value will be reset to the current selected option(s), when:
    • The user is not typing (otherwise you will loose your current state / query).
    • The user cancels the current changes:
      • By pressing escape.
      • By clicking outside of the Combobox.

Fix: #1735

@vercel
Copy link

vercel bot commented Dec 12, 2022 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated
headlessui-react ✅ Ready (Inspect) Visit Preview Dec 12, 2022 at 6:13PM (UTC)
headlessui-vue ✅ Ready (Inspect) Visit Preview Dec 12, 2022 at 6:13PM (UTC)

@RobinMalfait
simplify currentDisplayValue calculation
cc9903a 
Always calculate the currentDisplayValue, and only apply it if the user
is not typing. In all other cases it can be applied (e.g.: when the
value changes from the outside, inside or on reset)
@RobinMalfait RobinMalfait merged commit 1f2de63 into main Dec 12, 2022
@RobinMalfait RobinMalfait deleted the fix/issue-1735 branch December 12, 2022 18:16
@RobinMalfait RobinMalfait mentioned this pull request Dec 12, 2022
Closed
@thecrypticace thecrypticace mentioned this pull request Mar 21, 2024
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

[Bug][Severe] Using Combobox.Input with displayValue breaks the input behaviour
1 participant
@RobinMalfait