Editor: Set only focus for the RichText component

WordPress · May 29, 2018 · 17603b2 · 17603b2
1 parent 6dc4397
commit 17603b2
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 35 deletions.
diff --git a/core-blocks/gallery/gallery-image.js b/core-blocks/gallery/gallery-image.js
@@ -6,12 +6,12 @@ import classnames from 'classnames';
 /**
  * WordPress Dependencies
  */
-import { Component, compose } from '@wordpress/element';
+import { Component } from '@wordpress/element';
 import { IconButton, Spinner } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { keycodes } from '@wordpress/utils';
 import { withSelect } from '@wordpress/data';
-import { RichText, withBlockEditContext } from '@wordpress/editor';
+import { RichText } from '@wordpress/editor';
 
 /**
  * Module constants
@@ -22,7 +22,6 @@ class GalleryImage extends Component {
 	constructor() {
 		super( ...arguments );
 
-		this.onImageClick = this.onImageClick.bind( this );
 		this.onKeyDown = this.onKeyDown.bind( this );
 		this.bindContainer = this.bindContainer.bind( this );
 	}
@@ -31,10 +30,6 @@ class GalleryImage extends Component {
 		this.container = ref;
 	}
 
-	onImageClick() {
-		this.props.setFocusedElement( null );
-	}
-
 	onKeyDown( event ) {
 		if (
 			this.container === document.activeElement &&
@@ -72,7 +67,7 @@ class GalleryImage extends Component {
 		// Disable reason: Image itself is not meant to be
 		// interactive, but should direct image selection and unfocus caption fields
 		// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions, jsx-a11y/click-events-have-key-events
-		const img = url ? <img src={ url } alt={ alt } data-id={ id } onClick={ this.onImageClick } /> : <Spinner />;
+		const img = url ? <img src={ url } alt={ alt } data-id={ id } /> : <Spinner />;
 
 		const className = classnames( {
 			'is-selected': isSelected,
@@ -115,18 +110,11 @@ class GalleryImage extends Component {
 	}
 }
 
-export default compose( [
-	withBlockEditContext( ( { setFocusedElement } ) => {
-		return {
-			setFocusedElement,
-		};
-	} ),
-	withSelect( ( select, ownProps ) => {
-		const { getMedia } = select( 'core' );
-		const { id } = ownProps;
+export default withSelect( ( select, ownProps ) => {
+	const { getMedia } = select( 'core' );
+	const { id } = ownProps;
 
-		return {
-			image: id ? getMedia( id ) : null,
-		};
-	} ),
-] )( GalleryImage );
+	return {
+		image: id ? getMedia( id ) : null,
+	};
+} )( GalleryImage );
diff --git a/core-blocks/image/edit.js b/core-blocks/image/edit.js
@@ -38,7 +38,6 @@ import {
 	BlockAlignmentToolbar,
 	UrlInputButton,
 	editorMediaUpload,
-	withBlockEditContext,
 } from '@wordpress/editor';
 import { withViewportMatch } from '@wordpress/viewport';
 
@@ -58,7 +57,6 @@ class ImageEdit extends Component {
 		super( ...arguments );
 		this.updateAlt = this.updateAlt.bind( this );
 		this.updateAlignment = this.updateAlignment.bind( this );
-		this.onImageClick = this.onImageClick.bind( this );
 		this.onSelectImage = this.onSelectImage.bind( this );
 		this.onSetHref = this.onSetHref.bind( this );
 		this.updateImageURL = this.updateImageURL.bind( this );
@@ -116,10 +114,6 @@ class ImageEdit extends Component {
 		this.props.setAttributes( { href: value } );
 	}
 
-	onImageClick() {
-		this.props.setFocusedElement( null );
-	}
-
 	updateAlt( newAlt ) {
 		this.props.setAttributes( { alt: newAlt } );
 	}
@@ -308,7 +302,7 @@ class ImageEdit extends Component {
 							// Disable reason: Image itself is not meant to be
 							// interactive, but should direct focus to block
 							// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions
-							const img = <img src={ url } alt={ alt } onClick={ this.onImageClick } />;
+							const img = <img src={ url } alt={ alt } />;
 
 							if ( ! isResizable || ! imageWidthWithinContainer ) {
 								return (
@@ -381,11 +375,6 @@ class ImageEdit extends Component {
 }
 
 export default compose( [
-	withBlockEditContext( ( { setFocusedElement } ) => {
-		return {
-			setFocusedElement,
-		};
-	} ),
 	withSelect( ( select, props ) => {
 		const { getMedia } = select( 'core' );
 		const { getEditorSettings } = select( 'core/editor' );

diff --git a/editor/components/index.js b/editor/components/index.js
@@ -5,7 +5,6 @@ export { default as AlignmentToolbar } from './alignment-toolbar';
 export { default as BlockAlignmentToolbar } from './block-alignment-toolbar';
 export { default as BlockControls } from './block-controls';
 export { default as BlockEdit } from './block-edit';
-export { withBlockEditContext } from './block-edit/context';
 export { default as BlockFormatControls } from './block-format-controls';
 export { default as BlockIcon } from './block-icon';
 export { default as ColorPalette } from './color-palette';