Merge branch 'trunk' into remove/wp-components-experimental-designati…

…on-for-alignmentmatrixcontrol

packages/block-editor/package.json

@@ -39,6 +39,7 @@
 		"@wordpress/a11y": "file:../a11y",
 		"@wordpress/api-fetch": "file:../api-fetch",
 		"@wordpress/blob": "file:../blob",
+		"@wordpress/block-serialization-default-parser": "file:../block-serialization-default-parser",
 		"@wordpress/blocks": "file:../blocks",
 		"@wordpress/commands": "file:../commands",
 		"@wordpress/components": "file:../components",

packages/block-editor/src/components/writing-flow/use-selection-observer.js

@@ -4,6 +4,7 @@
 import { useSelect, useDispatch } from '@wordpress/data';
 import { useRefEffect } from '@wordpress/compose';
 import { create } from '@wordpress/rich-text';
+import { isSelectionForward } from '@wordpress/dom';
 
 /**
  * Internal dependencies
@@ -53,6 +54,14 @@ function extractSelectionEndNode( selection ) {
 		return focusNode;
 	}
 
+	// When the selection is forward (the selection ends with the focus node),
+	// the selection may extend into the next element with an offset of 0. This
+	// may trigger multi selection even though the selection does not visually
+	// end in the next block.
+	if ( focusOffset === 0 && isSelectionForward( selection ) ) {
+		return focusNode.previousSibling ?? focusNode.parentElement;
+	}
+
 	return focusNode.childNodes[ focusOffset ];
 }
 

packages/block-editor/src/hooks/block-bindings.js

@@ -55,14 +55,9 @@ function BlockBindingsPanelDropdown( { fieldsList, attribute, binding } ) {
 				<Fragment key={ name }>
 					<DropdownMenuV2.Group>
 						{ Object.keys( fieldsList ).length > 1 && (
-							<Text
-								className="block-editor-bindings__source-label"
-								upperCase
-								variant="muted"
-								aria-hidden
-							>
+							<DropdownMenuV2.GroupLabel>
 								{ registeredSources[ name ].label }
-							</Text>
+							</DropdownMenuV2.GroupLabel>
 						) }
 						{ Object.entries( fields ).map( ( [ key, value ] ) => (
 							<DropdownMenuV2.RadioItem
@@ -160,7 +155,6 @@ function EditableBlockBindingsPanelItems( {
 								isMobile ? 'bottom-start' : 'left-start'
 							}
 							gutter={ isMobile ? 8 : 36 }
-							className="block-editor-bindings__popover"
 							trigger={
 								<Item>
 									<BlockBindingsAttribute

packages/block-editor/src/hooks/block-bindings.scss

@@ -4,11 +4,3 @@ div.block-editor-bindings__panel {
 		color: inherit;
 	}
 }
-
-.block-editor-bindings__popover {
-	// This won't be needed if `DropdownMenuGroup` component handles the label.
-	.block-editor-bindings__source-label {
-		grid-column: 2;
-		margin: $grid-unit-10 0;
-	}
-}

packages/block-editor/src/hooks/use-bindings-attributes.js

@@ -10,6 +10,7 @@ import { addFilter } from '@wordpress/hooks';
 /**
  * Internal dependencies
  */
+import isURLLike from '../components/link-control/is-url-like';
 import { unlock } from '../lock-unlock';
 import BlockContext from '../components/block-context';
 
@@ -134,10 +135,7 @@ export const withBlockBindingSupport = createHigherOrderComponent(
 			) ) {
 				const { source: sourceName, args: sourceArgs } = binding;
 				const source = sources[ sourceName ];
-				if (
-					! source?.getValues ||
-					! canBindAttribute( name, attributeName )
-				) {
+				if ( ! source || ! canBindAttribute( name, attributeName ) ) {
 					continue;
 				}
 
@@ -161,29 +159,30 @@ export const withBlockBindingSupport = createHigherOrderComponent(
 					}
 
 					// Get values in batch if the source supports it.
-					const values = source.getValues( {
-						registry,
-						context,
-						clientId,
-						bindings,
-					} );
+					let values = {};
+					if ( ! source.getValues ) {
+						Object.keys( bindings ).forEach( ( attr ) => {
+							// Default to the `key` or the source label when `getValues` doesn't exist
+							values[ attr ] =
+								bindings[ attr ].args?.key || source.label;
+						} );
+					} else {
+						values = source.getValues( {
+							registry,
+							context,
+							clientId,
+							bindings,
+						} );
+					}
 					for ( const [ attributeName, value ] of Object.entries(
 						values
 					) ) {
-						// Use placeholder when value is undefined.
-						if ( value === undefined ) {
-							if ( attributeName === 'url' ) {
-								attributes[ attributeName ] = null;
-							} else {
-								attributes[ attributeName ] =
-									source.getPlaceholder?.( {
-										registry,
-										context,
-										clientId,
-										attributeName,
-										args: bindings[ attributeName ].args,
-									} );
-							}
+						if (
+							attributeName === 'url' &&
+							( ! value || ! isURLLike( value ) )
+						) {
+							// Return null if value is not a valid URL.
+							attributes[ attributeName ] = null;
 						} else {
 							attributes[ attributeName ] = value;
 						}

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

@@ -20,7 +20,7 @@ import {
 	checkAllowListRecursive,
 	getAllPatternsDependants,
 	getInsertBlockTypeDependants,
-	getParsedPattern,
+	getGrammar,
 } from './utils';
 import { INSERTER_PATTERN_TYPES } from '../components/inserter/block-patterns-tab/utils';
 import { STORE_NAME } from './constants';
@@ -300,10 +300,10 @@ export const hasAllowedPatterns = createRegistrySelector( ( select ) =>
 				if ( ! inserter ) {
 					return false;
 				}
-				const { blocks } = getParsedPattern( pattern );
+				const grammar = getGrammar( pattern );
 				return (
-					checkAllowListRecursive( blocks, allowedBlockTypes ) &&
-					blocks.every( ( { name: blockName } ) =>
+					checkAllowListRecursive( grammar, allowedBlockTypes ) &&
+					grammar.every( ( { name: blockName } ) =>
 						canInsertBlockType( state, blockName, rootClientId )
 					)
 				);

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

@@ -27,6 +27,7 @@ import {
 	getAllPatternsDependants,
 	getInsertBlockTypeDependants,
 	getParsedPattern,
+	getGrammar,
 } from './utils';
 import { orderBy } from '../utils/sorting';
 import { STORE_NAME } from './constants';
@@ -2376,17 +2377,27 @@ export const __experimentalGetAllowedPatterns = createRegistrySelector(
 			const { getAllPatterns } = unlock( select( STORE_NAME ) );
 			const patterns = getAllPatterns();
 			const { allowedBlockTypes } = getSettings( state );
-
 			const parsedPatterns = patterns
 				.filter( ( { inserter = true } ) => !! inserter )
-				.map( getParsedPattern );
+				.map( ( pattern ) => {
+					return {
+						...pattern,
+						get blocks() {
+							return getParsedPattern( pattern ).blocks;
+						},
+					};
+				} );
+
 			const availableParsedPatterns = parsedPatterns.filter(
-				( { blocks } ) =>
-					checkAllowListRecursive( blocks, allowedBlockTypes )
+				( pattern ) =>
+					checkAllowListRecursive(
+						getGrammar( pattern ),
+						allowedBlockTypes
+					)
 			);
 			const patternsAllowed = availableParsedPatterns.filter(
-				( { blocks } ) =>
-					blocks.every( ( { name } ) =>
+				( pattern ) =>
+					getGrammar( pattern ).every( ( { blockName: name } ) =>
 						canInsertBlockType( state, name, rootClientId )
 					)
 			);

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

@@ -2,6 +2,7 @@
  * WordPress dependencies
  */
 import { parse } from '@wordpress/blocks';
+import { parse as grammarParse } from '@wordpress/block-serialization-default-parser';
 
 /**
  * Internal dependencies
@@ -13,6 +14,7 @@ import { STORE_NAME } from './constants';
 export const withRootClientIdOptionKey = Symbol( 'withRootClientId' );
 
 const parsedPatternCache = new WeakMap();
+const grammarMapCache = new WeakMap();
 
 function parsePattern( pattern ) {
 	const blocks = parse( pattern.content, {
@@ -37,14 +39,24 @@ function parsePattern( pattern ) {
 
 export function getParsedPattern( pattern ) {
 	let parsedPattern = parsedPatternCache.get( pattern );
-	if ( parsedPattern ) {
-		return parsedPattern;
+	if ( ! parsedPattern ) {
+		parsedPattern = parsePattern( pattern );
+		parsedPatternCache.set( pattern, parsedPattern );
 	}
-	parsedPattern = parsePattern( pattern );
-	parsedPatternCache.set( pattern, parsedPattern );
 	return parsedPattern;
 }
 
+export function getGrammar( pattern ) {
+	let grammarMap = grammarMapCache.get( pattern );
+	if ( ! grammarMap ) {
+		grammarMap = grammarParse( pattern.content );
+		// Block names are null only at the top level for whitespace.
+		grammarMap = grammarMap.filter( ( block ) => block.blockName !== null );
+		grammarMapCache.set( pattern, grammarMap );
+	}
+	return grammarMap;
+}
+
 export const checkAllowList = ( list, item, defaultResult = null ) => {
 	if ( typeof list === 'boolean' ) {
 		return list;

packages/block-editor/tsconfig.json

@@ -8,6 +8,7 @@
 	"references": [
 		{ "path": "../a11y" },
 		{ "path": "../api-fetch" },
+		{ "path": "../block-serialization-default-parser" },
 		{ "path": "../blob" },
 		{ "path": "../components" },
 		{ "path": "../compose" },

packages/block-library/src/details/index.js

@@ -11,6 +11,7 @@ import initBlock from '../utils/init-block';
 import metadata from './block.json';
 import edit from './edit';
 import save from './save';
+import transforms from './transforms';
 
 const { name } = metadata;
 export { metadata, name };
@@ -35,6 +36,7 @@ export const settings = {
 	},
 	save,
 	edit,
+	transforms,
 };
 
 export const init = () => initBlock( { name, metadata, settings } );

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

@@ -0,0 +1,26 @@
+/**
+ * WordPress dependencies
+ */
+import { createBlock, cloneBlock } from '@wordpress/blocks';
+
+export default {
+	from: [
+		{
+			type: 'block',
+			isMultiBlock: true,
+			blocks: [ '*' ],
+			isMatch( {}, blocks ) {
+				return ! (
+					blocks.length === 1 && blocks[ 0 ].name === 'core/details'
+				);
+			},
+			__experimentalConvert( blocks ) {
+				return createBlock(
+					'core/details',
+					{},
+					blocks.map( ( block ) => cloneBlock( block ) )
+				);
+			},
+		},
+	],
+};

packages/blocks/src/api/raw-handling/figure-content-reducer.js

@@ -95,7 +95,7 @@ export default function figureContentReducer( node, doc, schema ) {
 		) {
 			wrapFigureContent( nodeToInsert, wrapper );
 		}
-	} else if ( nodeToInsert.parentNode.nodeName === 'BODY' ) {
+	} else {
 		wrapFigureContent( nodeToInsert );
 	}
 }

packages/blocks/src/api/registration.js

@@ -773,7 +773,6 @@ export const unregisterBlockVariation = ( blockName, variationName ) => {
  * @param {Array}    [source.usesContext]      Array of context needed by the source only in the editor.
  * @param {Function} [source.getValues]        Function to get the values from the source.
  * @param {Function} [source.setValues]        Function to update multiple values connected to the source.
- * @param {Function} [source.getPlaceholder]   Function to get the placeholder when the value is undefined.
  * @param {Function} [source.canUserEditValue] Function to determine if the user can edit the value.
  * @param {Function} [source.getFieldsList]    Function to get the lists of fields to expose in the connections panel.
  *
@@ -787,7 +786,6 @@ export const unregisterBlockVariation = ( blockName, variationName ) => {
  *     label: _x( 'My Custom Source', 'block bindings source' ),
  *     getValues: () => getSourceValues(),
  *     setValues: () => updateMyCustomValuesInBatch(),
- *     getPlaceholder: () => 'Placeholder text when the value is undefined',
  *     canUserEditValue: () => true,
  * } );
  * ```
@@ -799,7 +797,6 @@ export const registerBlockBindingsSource = ( source ) => {
 		usesContext,
 		getValues,
 		setValues,
-		getPlaceholder,
 		canUserEditValue,
 		getFieldsList,
 	} = source;
@@ -889,13 +886,7 @@ export const registerBlockBindingsSource = ( source ) => {
 		return;
 	}
 
-	// Check the `getPlaceholder` property is correct.
-	if ( getPlaceholder && typeof getPlaceholder !== 'function' ) {
-		warning( 'Block bindings source getPlaceholder must be a function.' );
-		return;
-	}
-
-	// Check the `getPlaceholder` property is correct.
+	// Check the `canUserEditValue` property is correct.
 	if ( canUserEditValue && typeof canUserEditValue !== 'function' ) {
 		warning( 'Block bindings source canUserEditValue must be a function.' );
 		return;