search

radix-ui / primitives

Radix Primitives is an open-source UI component library for building high-quality, accessible design systems and web apps. Maintained by @workos.
https://radix-ui.com/primitives
MIT License
15.38k stars 768 forks source link

Overlay in Dropdown menu #3023

Open Werthis opened 1 month ago

Werthis commented 1 month ago

Bug report

Current Behavior

Dropdown Menu has default background overlay, which covers everything around Content when it is open and makes every hover and cursor disable

Expected behavior

Not covering anything around Content

Reproducible example

https://codesandbox.io/p/sandbox/radix-ui-react-dropdown-menu-dialog-bug-forked-nz4jvk

Open Context on the top right corner and move cursor around on Trigger button or other buttons, you will se there is no cursor: pointer anymore

Suggested solution

I need to turn that off, so maybe workaround or feature please

Additional context

Topbar is disable when I move cursor around, it makes my UI lose UX a lot. @radix-ui/react-popover does not have this issue

Your environment

REACT

If anyone has the same issue or knows the solution please tell me :)

micnic commented 1 month ago

This actually is a better UX, it prevents the user from accidental click on something outside of dropdown menu or scrolling the dropdown menu open outside of the viewport.

What you are looking for is the modal={false} prop of DropdownMenu.Root: https://www.radix-ui.com/primitives/docs/components/dropdown-menu#root