search

everweij / react-laag

Hooks to build things like tooltips, dropdown menu's and popovers in React
https://www.react-laag.com
MIT License
907 stars 47 forks source link

[FEATURE] Nested Layer onOutsideClick enabled by option #63

Open ch1ll0ut1 opened 3 years ago

ch1ll0ut1 commented 3 years ago

Is your feature request related to a problem? Please describe. I am using react-laag for several nested layers in a rich text editor. First overlayer is a hovering menu above selected text or another menu for custom rich content. All menus have buttons that can either perform action or open popover/layers on top of that (positioned relative to the clicked button). Everything works great, react-laag is amazing for this kind of custom menus and overlays. There is only one tiny problem now, the first layer can be persistent as long as the cursor is in the content. And layer children´s "onOutsideClick" is ignored and so they dont close when the user clicks around the app. Which I found out is currently intentionally done when a child layer has a parent.

Describe the solution you'd like Add a option to useLayer to disable the ignoring of onOutsideClick events, so that child layers call as expected onOutsideClick (If it would be me I would make that the default behaviour as well, since it appears at first to be a bug and requires a careful read through of the documentation to find out that this is the intended behaviour.)

pigpudle commented 2 years ago

Hi @ch1ll0ut1 ! Have you solved this? Could you please share your solution if you had solved this :)

pigpudle commented 2 years ago

I found react-laag docs saying that onOutsideClick only has effect on root-layer. So I managed this issue by wrapping nested element in its own onClickOutside adapter (from react-cool-onclickoutside for example).