Fixed an unpleasant interaction with owners modal "..." button

This commit is contained in:
Brian Vaughn
2019-04-08 12:20:45 -07:00
parent e43cfa0239
commit 44ecff31e3
+10 -6
View File
@@ -101,9 +101,15 @@ export function useModalDismissSignal(
}
};
const handleMouseOrTouch = ({ target }: any) => {
const handleClick = (event: any) => {
// $FlowFixMe
if (modalRef.current !== null && !modalRef.current.contains(target)) {
if (
modalRef.current !== null &&
!modalRef.current.contains(event.target)
) {
event.stopPropagation();
event.preventDefault();
dismissCallback();
}
};
@@ -113,13 +119,11 @@ export function useModalDismissSignal(
// and the root document might belong to a different window.
const ownerDocument = modalRef.current.ownerDocument;
ownerDocument.addEventListener('keydown', handleKeyDown);
ownerDocument.addEventListener('mousedown', handleMouseOrTouch);
ownerDocument.addEventListener('touchstart', handleMouseOrTouch);
ownerDocument.addEventListener('click', handleClick);
return () => {
ownerDocument.removeEventListener('keydown', handleKeyDown);
ownerDocument.removeEventListener('mousedown', handleMouseOrTouch);
ownerDocument.removeEventListener('touchstart', handleMouseOrTouch);
ownerDocument.removeEventListener('click', handleClick);
};
}, [modalRef, dismissCallback]);
}