Support closeOnOutsideClick for nested menus

Is it possible to make the closeOnOutsideClick setting work for nested popovers/menus?

I.e. if I have a nested menu, it should close when I click outside all of the menu layers, but not close the entire menu if I click inside a child layer (as it currently does).

If not, is there any workaround I can use?

[everweij]

Thanks @mtmacdonald for looking into this, very helpful 👍🏼 I will try some things out tomorrow. Will let you know where I will come up with.

[everweij]

Hi @mtmacdonald, Good to hear you managed to get it to work!

I agree it’s a tricky area to solve -> managing layers in a group setting. I think that in the future there should be some kind of mechanism which handles open / close behavior of these kind of related toggle-layers (like nested menu’s). Right now, I think I rather put this logic inside an own hook or component, because I want to limit the complexity and responsibilities that ToggleLayer / useToggleLayer currently has.

Thanks for sharing your code, helpful stuff 👍🏼