diff --git a/src/files-ui/components/previews/FullScreen/FullScreen.tsx b/src/files-ui/components/previews/FullScreen/FullScreen.tsx index 4cc9b0fbfa49a59a356e45fe1e8b6e884c957a3a..7574195c9f7fa891187ddc3c247682f3db022289 100644 --- a/src/files-ui/components/previews/FullScreen/FullScreen.tsx +++ b/src/files-ui/components/previews/FullScreen/FullScreen.tsx @@ -12,6 +12,19 @@ const FullScreen: React.FC<FullScreenProps> = (props: FullScreenProps) => { e.stopPropagation(); onClose?.(); } + React.useEffect(() => { + const handleCloseEsc = (evt: KeyboardEvent) => { + if (evt.key === "Escape") onClose?.(); + }; + console.log("adding listener"); + + document.addEventListener("keydown", handleCloseEsc); + + return () => { + console.log("removing listener"); + document.removeEventListener("keydown", handleCloseEsc); + }; + }, []); return ( <div @@ -19,6 +32,9 @@ const FullScreen: React.FC<FullScreenProps> = (props: FullScreenProps) => { open ? "fui-fullscreen-container show-fs" : "fui-fullscreen-container" } onClick={handleClose} + onKeyPress={(evt) => { + if (evt.key === "Escape") onClose?.(); + }} > {open && ( <div