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' ) }
/>
+
}