import useIsomorphicLayoutEffect from './useIsomorphicLayoutEffect' ; import { off , on } from './misc/util' ; const isFocusedElementEditable = ( ) => { const { activeElement , body } = document ; if ( ! activeElement ) { return false ; } if ( activeElement === body ) { return false ; } switch ( activeElement . tagName ) { case 'INPUT' : case 'TEXTAREA' : return true ; } return activeElement . hasAttribute ( 'contenteditable' ) ; } ; const isTypedCharGood = ( { keyCode , metaKey , ctrlKey , altKey } ) => { if ( metaKey || ctrlKey || altKey ) { return false ; } if ( keyCode >= 48 && keyCode <= 57 ) { return true ; } if ( keyCode >= 65 && keyCode <= 90 ) { return true ; } return false ; } ; const useStartTyping = ( onStartTyping ) => { useIsomorphicLayoutEffect ( ( ) => { const keydown = ( event ) => { ! isFocusedElementEditable ( ) && isTypedCharGood ( event ) && onStartTyping ( event ) ; } ; on ( document , 'keydown' , keydown ) ; return ( ) => { off ( document , 'keydown' , keydown ) ; } ; } , [ ] ) ; } ; export default useStartTyping ;