Support passing a context variable to the custom format prepareEditTr…

…eeValue (#11630)
WordPress · Nov 9, 2018 · 89539fd · 89539fd
1 parent aa6f609
commit 89539fd
Show file tree

Hide file tree

Showing 6 changed files with 27 additions and 6 deletions.
diff --git a/packages/block-library/src/heading/edit.js b/packages/block-library/src/heading/edit.js
@@ -42,6 +42,7 @@ export default function HeadingEdit( {
 				</PanelBody>
 			</InspectorControls>
 			<RichText
+				identifier="content"
 				wrapperClassName="wp-block-heading"
 				tagName={ tagName }
 				value={ content }

diff --git a/packages/block-library/src/list/index.js b/packages/block-library/src/list/index.js
@@ -334,6 +334,7 @@ export const settings = {
 						] }
 					/>
 					<RichText
+						identifier="values"
 						multiline="li"
 						tagName={ tagName }
 						unstableGetSettings={ this.getEditorSettings }

diff --git a/packages/block-library/src/paragraph/edit.js b/packages/block-library/src/paragraph/edit.js
@@ -219,6 +219,7 @@ class ParagraphBlock extends Component {
 					</PanelColorSettings>
 				</InspectorControls>
 				<RichText
+					identifier="content"
 					tagName="p"
 					className={ classnames( 'wp-block-paragraph', className, {
 						'has-text-color': textColor.color,

diff --git a/packages/block-library/src/quote/index.js b/packages/block-library/src/quote/index.js
@@ -17,15 +17,18 @@ import {
 import { join, split, create, toHTMLString } from '@wordpress/rich-text';
 import { G, Path, SVG } from '@wordpress/components';
 
+const ATTRIBUTE_QUOTE = 'value';
+const ATTRIBUTE_CITATION = 'citation';
+
 const blockAttributes = {
-	value: {
+	[ ATTRIBUTE_QUOTE ]: {
 		type: 'string',
 		source: 'html',
 		selector: 'blockquote',
 		multiline: 'p',
 		default: '',
 	},
-	citation: {
+	[ ATTRIBUTE_CITATION ]: {
 		type: 'string',
 		source: 'html',
 		selector: 'cite',
@@ -201,6 +204,7 @@ export const settings = {
 				</BlockControls>
 				<blockquote className={ className } style={ { textAlign: align } }>
 					<RichText
+						identifier={ ATTRIBUTE_QUOTE }
 						multiline
 						value={ value }
 						onChange={
@@ -222,6 +226,7 @@ export const settings = {
 					/>
 					{ ( ! RichText.isEmpty( citation ) || isSelected ) && (
 						<RichText
+							identifier={ ATTRIBUTE_CITATION }
 							value={ citation }
 							onChange={
 								( nextCitation ) => setAttributes( {

diff --git a/packages/editor/src/components/rich-text/index.js b/packages/editor/src/components/rich-text/index.js
@@ -959,19 +959,23 @@ const RichTextContainer = compose( [
 	withBlockEditContext( ( context, ownProps ) => {
 		// When explicitly set as not selected, do nothing.
 		if ( ownProps.isSelected === false ) {
-			return {};
+			return {
+				clientId: context.clientId,
+			};
 		}
 		// When explicitly set as selected, use the value stored in the context instead.
 		if ( ownProps.isSelected === true ) {
 			return {
 				isSelected: context.isSelected,
+				clientId: context.clientId,
 			};
 		}
 
 		// Ensures that only one RichText component can be focused.
 		return {
 			isSelected: context.isSelected && context.focusedElement === ownProps.instanceId,
 			setFocusedElement: context.setFocusedElement,
+			clientId: context.clientId,
 		};
 	} ),
 	withSelect( ( select ) => {

diff --git a/packages/rich-text/src/register-format-type.js b/packages/rich-text/src/register-format-type.js
@@ -118,14 +118,23 @@ export function registerFormatType( name, settings ) {
 		settings.__experimentalGetPropsForEditableTreePreparation
 	) {
 		addFilter( 'experimentalRichText', name, ( OriginalComponent ) => {
-			return withSelect( ( sel ) => ( {
-				[ `format_${ name }` ]: settings.__experimentalGetPropsForEditableTreePreparation( sel ),
+			return withSelect( ( sel, { clientId, identifier } ) => ( {
+				[ `format_${ name }` ]: settings.__experimentalGetPropsForEditableTreePreparation(
+					sel,
+					{
+						richTextIdentifier: identifier,
+						blockClientId: clientId,
+					}
+				),
 			} ) )( ( props ) => (
 				<OriginalComponent
 					{ ...props }
 					prepareEditableTree={ [
 						...( props.prepareEditableTree || [] ),
-						settings.__experimentalCreatePrepareEditableTree( props[ `format_${ name }` ] ),
+						settings.__experimentalCreatePrepareEditableTree( props[ `format_${ name }` ], 	{
+							richTextIdentifier: props.identifier,
+							blockClientId: props.clientId,
+						} ),
 					] }
 				/>
 			) );