radix-ui
focus-visible triggered when open a dialog from a dropdown menu using mouse.
Bug report
:focus-visible style is triggered when open a dialog from a dropdown menu using mouse.
Current Behavior
https://github.com/radix-ui/primitives/assets/3297602/54f67dbd-92bf-4dc5-a2aa-8f00f57585f8
If the dialog is not opened from the dropdown menu, the :focus-visible style won't be triggered.
Expected behavior
The :focus-visible style should not be triggered.
Reproducible example
The example is forked from https://github.com/radix-ui/primitives/issues/1836#issuecomment-1556688048
Suggested solution
Additional context
Your environment
| Software | Name(s) | Version |
|---|---|---|
| Radix Package(s) | ||
| React | n/a | |
| Browser | ||
| Assistive tech | ||
| Node | n/a | |
| npm/yarn | ||
| Operating System |
Same here. It should use focus instead of focus-visible when the dialog is triggered without using the keyboard.
Just found this thread - this issue has been driving me bonkers!
Anyone had any joy finding a workaround?
PS - I brute forced it for now by giving my dialog content an ID and used regular css on that id to remove the border and outline. I don't ever need it in my particular use-case, so the sledgehammer approach works just fine ;-)