diff --git a/blocks/editable/format-toolbar.js b/blocks/editable/format-toolbar.js index b52be620e7f24..a718b68e0e185 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.onKeyDown = this.onKeyDown.bind( this ); + } + + componentDidMount() { + document.addEventListener( 'keydown', this.onKeyDown ); } componentWillUnmout() { @@ -44,6 +50,19 @@ class FormatToolbar extends wp.element.Component { } } + onKeyDown( keydown ) { + switch ( keydown.keyCode ) { + case ESCAPE: + if ( this.state.isEditingLink ) { + keydown.preventDefault(); + this.dropLink(); + } + break; + default : + break; + } + } + componentWillReceiveProps( nextProps ) { const newState = { linkValue: nextProps.formats.link ? nextProps.formats.link.value : '',