Remove unwrap from transforms and add ungroup to more blocks

packages/block-editor/src/components/convert-to-group-buttons/index.js

@@ -17,6 +17,7 @@ function ConvertToGroupButton( {
 	clientIds,
 	isGroupable,
 	isUngroupable,
+	onUngroup,
 	blocksSelection,
 	groupingBlockName,
 	onClose = () => {},
@@ -34,10 +35,16 @@ function ConvertToGroupButton( {
 	};
 
 	const onConvertFromGroup = () => {
-		const innerBlocks = blocksSelection[ 0 ].innerBlocks;
+		let innerBlocks = blocksSelection[ 0 ].innerBlocks;
 		if ( ! innerBlocks.length ) {
 			return;
 		}
+		if ( onUngroup ) {
+			innerBlocks = onUngroup(
+				blocksSelection[ 0 ].attributes,
+				blocksSelection[ 0 ].innerBlocks
+			);
+		}
 		replaceBlocks( clientIds, innerBlocks );
 	};
 
@@ -66,7 +73,7 @@ function ConvertToGroupButton( {
 				>
 					{ _x(
 						'Ungroup',
-						'Ungrouping blocks from within a Group block back into individual blocks within the Editor '
+						'Ungrouping blocks from within a grouping block back into individual blocks within the Editor '
 					) }
 				</MenuItem>
 			) }

packages/block-editor/src/components/convert-to-group-buttons/use-convert-to-group-button-props.js

@@ -37,6 +37,7 @@ export default function useConvertToGroupButtonProps( selectedClientIds ) {
 		isUngroupable,
 		blocksSelection,
 		groupingBlockName,
+		onUngroup,
 	} = useSelect(
 		( select ) => {
 			const {
@@ -45,8 +46,8 @@ export default function useConvertToGroupButtonProps( selectedClientIds ) {
 				canInsertBlockType,
 				getSelectedBlockClientIds,
 			} = select( blockEditorStore );
-			const { getGroupingBlockName } = select( blocksStore );
-
+			const { getGroupingBlockName, getBlockType } =
+				select( blocksStore );
 			const _clientIds = selectedClientIds?.length
 				? selectedClientIds
 				: getSelectedBlockClientIds();
@@ -62,27 +63,35 @@ export default function useConvertToGroupButtonProps( selectedClientIds ) {
 			);
 
 			const _blocksSelection = getBlocksByClientId( _clientIds );
-
-			const isSingleGroupingBlock =
-				_blocksSelection.length === 1 &&
-				_blocksSelection[ 0 ]?.name === _groupingBlockName;
+			const _isSingleBlockSelected = _blocksSelection.length === 1;
+			const [ firstSelectedBlock ] = _blocksSelection;
+			// A block is ungroupable if it is a single grouping block with inner blocks.
+			// If a block has an `ungroup` transform, it is also ungroupable, without the
+			// requirement of being the default grouping block.
+			// Do we have a single grouping Block selected and does that group have inner blocks?
+			const _isUngroupable =
+				_isSingleBlockSelected &&
+				( firstSelectedBlock.name === _groupingBlockName ||
+					getBlockType( firstSelectedBlock.name )?.transforms
+						?.ungroup ) &&
+				!! firstSelectedBlock.innerBlocks.length;
 
 			// Do we have
 			// 1. Grouping block available to be inserted?
 			// 2. One or more blocks selected
 			const _isGroupable =
 				groupingBlockAvailable && _blocksSelection.length;
 
-			// Do we have a single Group Block selected and does that group have inner blocks?
-			const _isUngroupable =
-				isSingleGroupingBlock &&
-				!! _blocksSelection[ 0 ].innerBlocks.length;
 			return {
 				clientIds: _clientIds,
 				isGroupable: _isGroupable,
 				isUngroupable: _isUngroupable,
 				blocksSelection: _blocksSelection,
 				groupingBlockName: _groupingBlockName,
+				onUngroup:
+					_isUngroupable &&
+					getBlockType( firstSelectedBlock.name )?.transforms
+						?.ungroup,
 			};
 		},
 		[ selectedClientIds ]
@@ -92,6 +101,7 @@ export default function useConvertToGroupButtonProps( selectedClientIds ) {
 		clientIds,
 		isGroupable,
 		isUngroupable,
+		onUngroup,
 		blocksSelection,
 		groupingBlockName,
 	};

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

@@ -18,7 +18,6 @@ import {
 import { Platform } from '@wordpress/element';
 import { applyFilters } from '@wordpress/hooks';
 import { symbol } from '@wordpress/icons';
-import { __ } from '@wordpress/i18n';
 import { create, remove, toHTMLString } from '@wordpress/rich-text';
 import deprecated from '@wordpress/deprecated';
 
@@ -2101,7 +2100,6 @@ export const getInserterItems = createSelector(
 export const getBlockTransformItems = createSelector(
 	( state, blocks, rootClientId = null ) => {
 		const normalizedBlocks = Array.isArray( blocks ) ? blocks : [ blocks ];
-		const [ sourceBlock ] = normalizedBlocks;
 		const buildBlockTypeTransformItem = buildBlockTypeItem( state, {
 			buildScope: 'transform',
 		} );
@@ -2118,22 +2116,10 @@ export const getBlockTransformItems = createSelector(
 			] )
 		);
 
-		// Consider unwraping the highest priority.
-		itemsByName[ '*' ] = {
-			frecency: +Infinity,
-			id: '*',
-			isDisabled: false,
-			name: '*',
-			title: __( 'Unwrap' ),
-			icon: itemsByName[ sourceBlock?.name ]?.icon,
-		};
-
 		const possibleTransforms = getPossibleBlockTransformations(
 			normalizedBlocks
 		).reduce( ( accumulator, block ) => {
-			if ( block === '*' ) {
-				accumulator.push( itemsByName[ '*' ] );
-			} else if ( itemsByName[ block?.name ] ) {
+			if ( itemsByName[ block?.name ] ) {
 				accumulator.push( itemsByName[ block.name ] );
 			}
 			return accumulator;

packages/block-library/src/columns/transforms.js

@@ -105,14 +105,8 @@ const transforms = {
 			},
 		},
 	],
-	to: [
-		{
-			type: 'block',
-			blocks: [ '*' ],
-			transform: ( attributes, innerBlocks ) =>
-				innerBlocks.flatMap( ( innerBlock ) => innerBlock.innerBlocks ),
-		},
-	],
+	ungroup: ( attributes, innerBlocks ) =>
+		innerBlocks.flatMap( ( innerBlock ) => innerBlock.innerBlocks ),
 };
 
 export default transforms;

packages/block-library/src/group/transforms.js

@@ -48,13 +48,6 @@ const transforms = {
 			},
 		},
 	],
-	to: [
-		{
-			type: 'block',
-			blocks: [ '*' ],
-			transform: ( attributes, innerBlocks ) => innerBlocks,
-		},
-	],
 };
 
 export default transforms;

packages/block-library/src/quote/transforms.js

@@ -132,20 +132,16 @@ const transforms = {
 						: innerBlocks
 				),
 		},
-		{
-			type: 'block',
-			blocks: [ '*' ],
-			transform: ( { citation }, innerBlocks ) =>
-				citation
-					? [
-							...innerBlocks,
-							createBlock( 'core/paragraph', {
-								content: citation,
-							} ),
-					  ]
-					: innerBlocks,
-		},
 	],
+	ungroup: ( { citation }, innerBlocks ) =>
+		citation
+			? [
+					...innerBlocks,
+					createBlock( 'core/paragraph', {
+						content: citation,
+					} ),
+			  ]
+			: innerBlocks,
 };
 
 export default transforms;

packages/blocks/src/api/factory.js

@@ -278,9 +278,7 @@ const getBlockTypesForPossibleToTransforms = ( blocks ) => {
 		.flat();
 
 	// Map block names to block types.
-	return blockNames.map( ( name ) =>
-		name === '*' ? name : getBlockType( name )
-	);
+	return blockNames.map( getBlockType );
 };
 
 /**
@@ -473,7 +471,8 @@ export function switchToBlockType( blocks, name ) {
 			transformationsTo,
 			( t ) =>
 				t.type === 'block' &&
-				t.blocks.indexOf( name ) !== -1 &&
+				( isWildcardBlockTransform( t ) ||
+					t.blocks.indexOf( name ) !== -1 ) &&
 				( ! isMultiBlock || t.isMultiBlock ) &&
 				maybeCheckTransformIsMatch( t, blocksArray )
 		) ||
@@ -539,12 +538,6 @@ export function switchToBlockType( blocks, name ) {
 		return null;
 	}
 
-	// When unwrapping blocks (`switchToBlockType( wrapperblocks, '*' )`), do
-	// not run filters on the unwrapped blocks. They shoud remain as they are.
-	if ( name === '*' ) {
-		return transformationResults;
-	}
-
 	const hasSwitchedBlock = transformationResults.some(
 		( result ) => result.name === name
 	);