import { IconWrapper } from '../inline-toolbar' ; import SvgCode from '../../icons/code' ; import { useEventChangeSelection , useInlineTool } from '../hooks' ; import { surround } from '../../../utils/find-blocks' ; import { getSelectionRange } from '../../../utils/ranges' ; import { StitchesProps } from '@hexx/theme' ; export function InlineCode ( props ) { const { getProps , setIsActive } = useInlineTool ( { shortcut : '⌘ + e' , onToggle : ( isActive ) => { if ( ! isActive ) { document . execCommand ( 'removeFormat' ) ; setIsActive ( false ) ; } else { surround ( 'code' ) ; document . execCommand ( 'unlink' ) ; setIsActive ( true ) ; } } , } ) ; useEventChangeSelection ( ( ) => { const r = getSelectionRange ( ) ; if ( r ?. startContainer ?. parentNode ?. tagName === 'CODE' || r ?. endContainer ?. parentNode ?. tagName === 'CODE' ) { setIsActive ( true ) ; } else { setIsActive ( false ) ; } } ) ; return ( < IconWrapper { ... getProps } { ... props } > < SvgCode title = "code" / > < /IconWrapper>); }