[Block Editor]: Stabilize __experimentalGetPatternsByBlockTypes (#4…

…7183)

docs/reference-guides/data/data-core-block-editor.md

@@ -673,6 +673,24 @@ _Returns_
 
 -   `?string`: Adjacent block's client ID, or null if none exists.
 
+### getPatternsByBlockTypes
+
+Returns the list of patterns based on their declared `blockTypes`
+and a block's name.
+Patterns can use `blockTypes` to integrate in work flows like
+suggesting appropriate patterns in a Placeholder state(during insertion)
+or blocks transformations.
+
+_Parameters_
+
+-   _state_ `Object`: Editor state.
+-   _blockNames_ `string|string[]`: Block's name or array of block names to find matching pattens.
+-   _rootClientId_ `?string`: Optional target root client ID.
+
+_Returns_
+
+-   `Array`: The list of matched block patterns based on declared `blockTypes` and block name.
+
 ### getPreviousBlockClientId
 
 Returns the previous block's client ID from the given reference start ID.

packages/block-editor/src/components/block-pattern-setup/use-patterns-setup.js

@@ -13,7 +13,7 @@ function usePatternsSetup( clientId, blockName, filterPatternsFn ) {
 		( select ) => {
 			const {
 				getBlockRootClientId,
-				__experimentalGetPatternsByBlockTypes,
+				getPatternsByBlockTypes,
 				__experimentalGetAllowedPatterns,
 			} = select( blockEditorStore );
 			const rootClientId = getBlockRootClientId( clientId );
@@ -22,10 +22,7 @@ function usePatternsSetup( clientId, blockName, filterPatternsFn ) {
 					filterPatternsFn
 				);
 			}
-			return __experimentalGetPatternsByBlockTypes(
-				blockName,
-				rootClientId
-			);
+			return getPatternsByBlockTypes( blockName, rootClientId );
 		},
 		[ clientId, blockName, filterPatternsFn ]
 	);

packages/block-editor/src/store/selectors.js

@@ -2313,7 +2313,7 @@ export const __experimentalGetAllowedPatterns = createSelector(
  *
  * @return {Array} The list of matched block patterns based on declared `blockTypes` and block name.
  */
-export const __experimentalGetPatternsByBlockTypes = createSelector(
+export const getPatternsByBlockTypes = createSelector(
 	( state, blockNames, rootClientId = null ) => {
 		if ( ! blockNames ) return EMPTY_ARRAY;
 		const patterns = __experimentalGetAllowedPatterns(
@@ -2337,6 +2337,27 @@ export const __experimentalGetPatternsByBlockTypes = createSelector(
 	]
 );
 
+export const __experimentalGetPatternsByBlockTypes = createSelector(
+	( state, blockNames, rootClientId = null ) => {
+		deprecated(
+			'wp.data.select( "core/block-editor" ).__experimentalGetPatternsByBlockTypes',
+			{
+				alternative:
+					'wp.data.select( "core/block-editor" ).getPatternsByBlockTypes',
+				since: '6.2',
+				version: '6.4',
+			}
+		);
+		return getPatternsByBlockTypes( state, blockNames, rootClientId );
+	},
+	( state, blockNames, rootClientId ) => [
+		...__experimentalGetAllowedPatterns.getDependants(
+			state,
+			rootClientId
+		),
+	]
+);
+
 /**
  * Determines the items that appear in the available pattern transforms list.
  *
@@ -2384,17 +2405,14 @@ export const __experimentalGetPatternTransformItems = createSelector(
 		 * block pattern's blocks and try to find matches from the selected blocks.
 		 * Now this happens in the consumer to avoid heavy operations in the selector.
 		 */
-		return __experimentalGetPatternsByBlockTypes(
+		return getPatternsByBlockTypes(
 			state,
 			selectedBlockNames,
 			rootClientId
 		);
 	},
 	( state, blocks, rootClientId ) => [
-		...__experimentalGetPatternsByBlockTypes.getDependants(
-			state,
-			rootClientId
-		),
+		...getPatternsByBlockTypes.getDependants( state, rootClientId ),
 	]
 );
 

packages/block-editor/src/store/test/selectors.js

@@ -67,7 +67,7 @@ const {
 	__experimentalGetActiveBlockIdByBlockNames: getActiveBlockIdByBlockNames,
 	__experimentalGetAllowedPatterns,
 	__experimentalGetParsedPattern,
-	__experimentalGetPatternsByBlockTypes,
+	getPatternsByBlockTypes,
 	__unstableGetClientIdWithClientIdsTree,
 	__unstableGetClientIdsTree,
 	__experimentalGetPatternTransformItems,
@@ -4223,7 +4223,7 @@ describe( 'selectors', () => {
 			);
 		} );
 	} );
-	describe( '__experimentalGetPatternsByBlockTypes', () => {
+	describe( 'getPatternsByBlockTypes', () => {
 		const state = {
 			blocks: {
 				byClientId: new Map(
@@ -4263,22 +4263,17 @@ describe( 'selectors', () => {
 			},
 		};
 		it( 'should return empty array if no block name is provided', () => {
-			expect( __experimentalGetPatternsByBlockTypes( state ) ).toEqual(
-				[]
-			);
+			expect( getPatternsByBlockTypes( state ) ).toEqual( [] );
 		} );
 		it( 'shoud return empty array if no match is found', () => {
-			const patterns = __experimentalGetPatternsByBlockTypes(
+			const patterns = getPatternsByBlockTypes(
 				state,
 				'test/block-not-exists'
 			);
 			expect( patterns ).toEqual( [] );
 		} );
 		it( 'should return proper results when there are matched block patterns', () => {
-			const patterns = __experimentalGetPatternsByBlockTypes(
-				state,
-				'test/block-a'
-			);
+			const patterns = getPatternsByBlockTypes( state, 'test/block-a' );
 			expect( patterns ).toHaveLength( 2 );
 			expect( patterns ).toEqual(
 				expect.arrayContaining( [
@@ -4288,7 +4283,7 @@ describe( 'selectors', () => {
 			);
 		} );
 		it( 'should return proper result with matched patterns and allowed blocks from rootClientId', () => {
-			const patterns = __experimentalGetPatternsByBlockTypes(
+			const patterns = getPatternsByBlockTypes(
 				state,
 				'test/block-a',
 				'block1'

packages/block-library/src/query/edit/query-placeholder.js

@@ -34,19 +34,15 @@ export default function QueryPlaceholder( {
 	const { blockType, allVariations, hasPatterns } = useSelect(
 		( select ) => {
 			const { getBlockVariations, getBlockType } = select( blocksStore );
-			const {
-				getBlockRootClientId,
-				__experimentalGetPatternsByBlockTypes,
-			} = select( blockEditorStore );
+			const { getBlockRootClientId, getPatternsByBlockTypes } =
+				select( blockEditorStore );
 			const rootClientId = getBlockRootClientId( clientId );
 
 			return {
 				blockType: getBlockType( name ),
 				allVariations: getBlockVariations( name ),
-				hasPatterns: !! __experimentalGetPatternsByBlockTypes(
-					name,
-					rootClientId
-				).length,
+				hasPatterns: !! getPatternsByBlockTypes( name, rootClientId )
+					.length,
 			};
 		},
 		[ name, clientId ]

packages/block-library/src/query/edit/query-toolbar.js

@@ -24,15 +24,10 @@ export default function QueryToolbar( {
 } ) {
 	const hasPatterns = useSelect(
 		( select ) => {
-			const {
-				getBlockRootClientId,
-				__experimentalGetPatternsByBlockTypes,
-			} = select( blockEditorStore );
+			const { getBlockRootClientId, getPatternsByBlockTypes } =
+				select( blockEditorStore );
 			const rootClientId = getBlockRootClientId( clientId );
-			return !! __experimentalGetPatternsByBlockTypes(
-				name,
-				rootClientId
-			).length;
+			return !! getPatternsByBlockTypes( name, rootClientId ).length;
 		},
 		[ name, clientId ]
 	);

packages/block-library/src/query/utils.js

@@ -247,15 +247,10 @@ export function useBlockNameForPatterns( clientId, attributes ) {
 			if ( ! activeVariationName ) {
 				return;
 			}
-			const {
-				getBlockRootClientId,
-				__experimentalGetPatternsByBlockTypes,
-			} = select( blockEditorStore );
+			const { getBlockRootClientId, getPatternsByBlockTypes } =
+				select( blockEditorStore );
 			const rootClientId = getBlockRootClientId( clientId );
-			return __experimentalGetPatternsByBlockTypes(
-				blockName,
-				rootClientId
-			);
+			return getPatternsByBlockTypes( blockName, rootClientId );
 		},
 		[ clientId, activeVariationName ]
 	);

packages/block-library/src/template-part/edit/utils/hooks.js

@@ -83,15 +83,10 @@ export function useAlternativeBlockPatterns( area, clientId ) {
 			const blockNameWithArea = area
 				? `core/template-part/${ area }`
 				: 'core/template-part';
-			const {
-				getBlockRootClientId,
-				__experimentalGetPatternsByBlockTypes,
-			} = select( blockEditorStore );
+			const { getBlockRootClientId, getPatternsByBlockTypes } =
+				select( blockEditorStore );
 			const rootClientId = getBlockRootClientId( clientId );
-			return __experimentalGetPatternsByBlockTypes(
-				blockNameWithArea,
-				rootClientId
-			);
+			return getPatternsByBlockTypes( blockNameWithArea, rootClientId );
 		},
 		[ area, clientId ]
 	);

packages/edit-post/src/components/start-page-options/index.js

@@ -23,15 +23,11 @@ function useStartPatterns() {
 	// the current post type is part of the postTypes declared.
 	const { blockPatternsWithPostContentBlockType, postType } = useSelect(
 		( select ) => {
-			const { __experimentalGetPatternsByBlockTypes } =
-				select( blockEditorStore );
+			const { getPatternsByBlockTypes } = select( blockEditorStore );
 			const { getCurrentPostType } = select( editorStore );
 			return {
-				// get pa
 				blockPatternsWithPostContentBlockType:
-					__experimentalGetPatternsByBlockTypes(
-						'core/post-content'
-					),
+					getPatternsByBlockTypes( 'core/post-content' ),
 				postType: getCurrentPostType(),
 			};
 		},