Modal add Esc shortcut
This commit is contained in:
parent
3db21e7e95
commit
38010a9556
@ -1,6 +1,6 @@
|
||||
import { XIcon } from '@heroicons/react/outline'
|
||||
import React, { ReactNode, useRef } from 'react'
|
||||
import { useClickAway } from 'react-use'
|
||||
import { useClickAway, useKey } from 'react-use'
|
||||
import Button from './Button'
|
||||
|
||||
interface ModalProps {
|
||||
@ -17,6 +17,10 @@ export default function Modal(props: ModalProps) {
|
||||
onClose?.()
|
||||
})
|
||||
|
||||
useKey('Escape', onClose, {
|
||||
event: 'keydown',
|
||||
})
|
||||
|
||||
return (
|
||||
<div
|
||||
className={[
|
||||
|
@ -31,8 +31,8 @@ export default function ShortcutsModal(props: ShortcutsModalProps) {
|
||||
<ShortCut content="Enable multi-stroke mask drawing">
|
||||
<p>Hold Cmd/Ctrl</p>
|
||||
</ShortCut>
|
||||
<ShortCut content="Enable panning">
|
||||
<p>Hold Space</p>
|
||||
<ShortCut content="Pan">
|
||||
<p>Space & Drag</p>
|
||||
</ShortCut>
|
||||
<ShortCut content="View original image">
|
||||
<p>Hold Tab</p>
|
||||
|
Loading…
Reference in New Issue
Block a user