diff --git a/blocks/editable/format-toolbar.js b/blocks/editable/format-toolbar.js index 265067163818d..f5290e524a3ec 100644 --- a/blocks/editable/format-toolbar.js +++ b/blocks/editable/format-toolbar.js @@ -2,6 +2,7 @@ * WordPress dependencies */ import { IconButton, Toolbar } from 'components'; +import { ESCAPE } from 'utils/keycodes'; const FORMATTING_CONTROLS = [ { @@ -36,6 +37,11 @@ class FormatToolbar extends wp.element.Component { this.dropLink = this.dropLink.bind( this ); this.submitLink = this.submitLink.bind( this ); this.updateLinkValue = this.updateLinkValue.bind( this ); + this.onKeyPress = this.onKeyPress.bind( this ); + } + + componentDidMount() { + document.addEventListener( 'keypress', this.onKeyPress ); } componentWillUnmout() { @@ -44,6 +50,15 @@ class FormatToolbar extends wp.element.Component { } } + onKeyPress( event ) { + if ( event.keyCode === ESCAPE ) { + if ( this.state.isEditingLink ) { + event.preventDefault(); + this.dropLink(); + } + } + } + componentWillReceiveProps( nextProps ) { const newState = { linkValue: nextProps.formats.link ? nextProps.formats.link.value : '', @@ -143,6 +158,7 @@ class FormatToolbar extends wp.element.Component { placeholder={ wp.i18n.__( 'Paste URL or type' ) } /> + }