Allow the heading block and the button block to be partially synced

WordPress · Dec 1, 2023 · 5924426 · 5924426
1 parent 16eb009
commit 5924426
Show file tree

Hide file tree

Showing 5 changed files with 18 additions and 12 deletions.
diff --git a/lib/experimental/blocks.php b/lib/experimental/blocks.php
@@ -100,14 +100,17 @@ function gutenberg_render_block_connections( $block_content, $block, $block_inst
 		// Allowlist of blocks that support block connections.
 		// Currently, we only allow the following blocks and attributes:
 		// - Paragraph: content.
+		// - Heading: content.
+		// - Button: text.
 		// - Image: url.
 		$blocks_attributes_allowlist = array(
 			'core/paragraph' => array( 'content' ),
+			'core/heading'   => array( 'content' ),
+			'core/button'    => array( 'text' ),
 			'core/image'     => array( 'url' ),
 		);
 
 		// Whitelist of the block types that support block connections.
-		// Currently, we only allow the Paragraph and Image blocks to use block connections.
 		if ( ! in_array( $block['blockName'], array_keys( $blocks_attributes_allowlist ), true ) ) {
 			return $block_content;
 		}
@@ -168,14 +171,14 @@ function gutenberg_render_block_connections( $block_content, $block, $block_inst
 				continue;
 			}
 
-			$tags  = new WP_HTML_Tag_Processor( $block_content );
-			$found = $tags->next_tag(
-				array(
-					// TODO: In the future, when blocks other than Paragraph and Image are
-					// supported, we should build the full query from CSS selector.
-					'tag_name' => $block_type->attributes[ $attribute_name ]['selector'],
-				)
-			);
+			$selectors = explode( ',', $block_type->attributes[ $attribute_name ]['selector'] );
+			$found     = false;
+			while ( ! $found && count( $selectors ) > 0 ) {
+				$tags = new WP_HTML_Tag_Processor( $block_content );
+				// TODO: In the future, when blocks are supported,
+				// we should build the full query from CSS selector.
+				$found = $tags->next_tag( trim( array_shift( $selectors ) ) );
+			}
 			if ( ! $found ) {
 				return $block_content;
 			}

diff --git a/packages/block-library/src/button/block.json b/packages/block-library/src/button/block.json
@@ -118,7 +118,8 @@
 				"width": true
 			}
 		},
-		"__experimentalSelector": ".wp-block-button .wp-block-button__link"
+		"__experimentalSelector": ".wp-block-button .wp-block-button__link",
+		"__experimentalConnections": true
 	},
 	"styles": [
 		{ "name": "fill", "label": "Fill", "isDefault": true },

diff --git a/packages/block-library/src/heading/block.json b/packages/block-library/src/heading/block.json
@@ -63,7 +63,8 @@
 			}
 		},
 		"__unstablePasteTextInline": true,
-		"__experimentalSlashInserter": true
+		"__experimentalSlashInserter": true,
+		"__experimentalConnections": true
 	},
 	"editorStyle": "wp-block-heading-editor",
 	"style": "wp-block-heading"

diff --git a/packages/editor/src/hooks/pattern-partial-syncing.js b/packages/editor/src/hooks/pattern-partial-syncing.js
@@ -23,7 +23,6 @@ const {
 /**
  * Override the default edit UI to include a new block inspector control for
  * assigning a partial syncing controls to supported blocks in the pattern editor.
- * Currently, only the `core/paragraph` block is supported.
  *
  * @param {Component} BlockEdit Original component.
  *

diff --git a/packages/patterns/src/constants.js b/packages/patterns/src/constants.js
@@ -23,4 +23,6 @@ export const PATTERN_SYNC_TYPES = {
 // TODO: This should not be hardcoded. Maybe there should be a config and/or an UI.
 export const PARTIAL_SYNCING_SUPPORTED_BLOCKS = {
 	'core/paragraph': { content: __( 'Content' ) },
+	'core/heading': { content: __( 'Content' ) },
+	'core/button': { text: __( 'Text' ) },
 };