How do you handle cases where a modal is shown from clicking in a layer
philmetzger opened this issue · comments
Philip Metzger commented
I have created a dropdown component:
const { renderLayer, triggerProps, layerProps } = useLayer({
isOpen: isVisible,
onOutsideClick: () => setIsVisible(false),
overflowContainer: true,
auto: true, // Automatically find the best placement.
placement,
triggerOffset: 5,
onDisappear: (_disappearType) => {
if (_disappearType === disappearType) {
setIsVisible(false);
}
},
});
Now in my dropdown I load a Modal. However as soon as i click anywhere in the modal, then everything closes because of
onOutsideClick: () => setIsVisible(false)
Is there a nice solution for this so if something is above the dropdown, like a modal, to ignore the click outside?
José Luis commented
Same issue here with onHover
, I want to keep the layer open while I'm hovering the layer itself.
Ricardo Ferreira commented
Same issue!! I have a dialog and it closes everything on close because it propagates the event. event.stopPropagation not working. @everweij