clicking outside combobox keeps focus on input, how can i get it to blur #3557
-
|
Hi, I'm currently trying out useCombobox and built this sandbox with a lot of help from the docs. I removed the restoreFocus prop from (in Popover.tsx) but it still restores focus to the input. Thanks |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment 7 replies
-
|
UPDATE: See last few comments in this thread for the answer Just click a second time to blur it. This is how native controls work too. See Select https://codesandbox.io/s/solitary-microservice-7p2vvv the first click will close it and the second will blur the control. As for restoring, in a combobox, technically focus never left the input. It's virtually moving focus around in the popover. To verify this, try typing something in the input, then move up or down the menu in the popover using arrow keys. Note that the cursor remains in the input the entire time. |
Beta Was this translation helpful? Give feedback.
-
|
hm, interesting. |
Beta Was this translation helpful? Give feedback.
-
|
Quickly tested that theory. Deleting the FocusScope in the docs code does not affect it. It was a good theory though. |
Beta Was this translation helpful? Give feedback.
-
|
Found a combination that seems to help
Though I'm not quite sure if this has any other implications |
Beta Was this translation helpful? Give feedback.
-
|
That looks to be right. We don't use a restoring focus scope in our popover because focus is never actually in the popover. I'm not sure why the isDismissable false, but that's what we have in our React Spectrum Component as well. https://github.com/adobe/react-spectrum/blob/main/packages/%40react-spectrum/combobox/src/ComboBox.tsx#L186 Good job sleuthing! I'll get the docs updated soon. |
Beta Was this translation helpful? Give feedback.
-
|
cool, then maybe DismissButton should be removed also? |
Beta Was this translation helpful? Give feedback.
UPDATE: See last few comments in this thread for the answer
Just click a second time to blur it. This is how native controls work too. See Select https://codesandbox.io/s/solitary-microservice-7p2vvv the first click will close it and the second will blur the control.
As for restoring, in a combobox, technically focus never left the input. It's virtually moving focus around in the popover. To verify this, try typing something in the input, then move up or down the menu in the popover using arrow keys. Note that the cursor remains in the input the entire time.