Outer overlay(Popper) is getting closed on performing action on inner overlay(Popper) [RootClose: true for both the ovelays]
ramareddy12345 opened this issue · 2 comments
We are opening inner overlay on button click inside outer overlay. both the overlays has Rootclose: true and both are appended to dom as siblings through portal.(container is body tag for both the overlays).
Our requirement is outer overlay contains set of date pickers. on clicking picker calendar will be open in another overlay. Upon interacting with calendar outer overlay is getting closed.
Current behaviour: useRootcloseWrapper hook doesn't have mechanism to check relate inner & outer overlay relation and considering it as different overlay and triggering onHide on outer overlay resulting in outer overlay getting closed.
Expected behaviour: usePopper should maintain stack of overlay hierarchy (After creating popper instance) and consider overlays relation in useRootcloseWrapper . Functionality should be similar to https://runfaj.github.io/react-nested-popper/#/nested
if we could rely on Portal event bubbling for our click outside logic this could be neatly avoided...I don't think there is any good way of doing that tho? Or maybe we just need to mark the native event as bubbled and check it in a document listener? Didn't we try that before @taion?
i think that was the old, old implementation, and i recall it led to some weird edge cases
@ramareddy12345 why not just set the container for the inner overlay to be something inside the outer overlay? wouldn't that solve the issues here?