Popup and ModalDialog use code instead of key

This commit is contained in:
nklhrstv 2020-03-17 18:36:00 +02:00
parent a5b4a25675
commit 57dacc7cd4
2 changed files with 5 additions and 5 deletions

View file

@ -34,9 +34,9 @@ const ModalDialog = ({ className, title, buttons, children, dataset, onCloseRequ
event.nativeEvent.closeModalDialogPrevented = true;
}, []);
React.useEffect(() => {
const onWindowKeyDown = (event) => {
const onKeyDown = (event) => {
// its `-2` because focus lock render locking divs around its content
if (event.key === 'Escape' && modalsContainer.childNodes[modalsContainer.childElementCount - 2] === modalContainerRef.current) {
if (event.code === 'Escape' && modalsContainer.childNodes[modalsContainer.childElementCount - 2] === modalContainerRef.current) {
if (typeof onCloseRequest === 'function') {
onCloseRequest({
type: 'close',
@ -46,9 +46,9 @@ const ModalDialog = ({ className, title, buttons, children, dataset, onCloseRequ
}
}
};
window.addEventListener('keydown', onWindowKeyDown);
window.addEventListener('keydown', onKeyDown);
return () => {
window.removeEventListener('keydown', onWindowKeyDown);
window.removeEventListener('keydown', onKeyDown);
};
}, [dataset, onCloseRequest]);
return (

View file

@ -24,7 +24,7 @@ const Popup = ({ open, direction, renderLabel, renderMenu, dataset, onCloseReque
onCloseRequest(closeEvent);
break;
case 'keydown':
if (event.key === 'Escape') {
if (event.code === 'Escape') {
onCloseRequest(closeEvent);
}
break;