Listbox is not closed when I click on input near it which is not part of ListBox #3019
Unanswered
ElenaShevchenko
asked this question in
Help
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
Greetings,
I am encountering an issue with my custom Currency component. The component comprises a Listbox for selecting currency and an input field for entering the currency value.
As depicted in the provided image
the expected behavior dictates that when the dropdown is opened, clicking on the input field should close the dropdown and shift focus to the input field since it resides outside the dropdown.
Presently, when I focus on the input field, I dynamically change its type based on business requirements using the following logic:
type={!readOnly && isFocused ? 'number' : 'text'}
However, upon making this type change, the dropdown fails to close as anticipated.
I suspect that the issue may be related to the code within the ListBox component, particularly the goToOption function which handles microtasks. Here's a snippet of the relevant code:
` let goToOption = useEvent((focus, id, trigger) => {
d.dispose()
d.microTask(() => {
if (focus === Focus.Specific) {
return dispatch({ type: ActionTypes.GoToOption, focus: Focus.Specific, id: id!, trigger })
}
})`
Thank you
Beta Was this translation helpful? Give feedback.
All reactions