@wordpress/block-editor 16.0.1-next.v.202607070741.0 → 16.2.0

package/src/store/test/selectors.js

@@ -1,6 +1,3 @@
-/**
- * WordPress dependencies
- */
 import {
 	registerBlockType,
 	unregisterBlockType,
@@ -13,10 +10,6 @@ import {
 import { RawHTML } from '@wordpress/element';
 import { symbol } from '@wordpress/icons';
 import { select, dispatch } from '@wordpress/data';
-
-/**
- * Internal dependencies
- */
 import * as selectors from '../selectors';
 import { store } from '../';
 import { lock } from '../../lock-unlock';
@@ -1945,6 +1938,17 @@ describe( 'selectors', () => {
 
 			expect( isBlockSelected( state, '23' ) ).toBe( false );
 		} );
+
+		it( 'should return false if there is no client ID', () => {
+			const state = {
+				selection: {
+					selectionStart: {},
+					selectionEnd: {},
+				},
+			};
+
+			expect( isBlockSelected( state, undefined ) ).toBe( false );
+		} );
 	} );
 
 	describe( 'hasSelectedInnerBlock', () => {
@@ -2049,6 +2053,138 @@ describe( 'selectors', () => {
 			};
 			expect( hasSelectedInnerBlock( state, '3' ) ).toBe( false );
 		} );
+
+		it( 'should return true for a deep check if the selected block is a descendant of the given ClientId', () => {
+			const state = {
+				selection: {
+					selectionStart: { clientId: '3' },
+					selectionEnd: { clientId: '3' },
+				},
+				blocks: {
+					order: new Map(
+						Object.entries( {
+							1: [ '2' ],
+							2: [ '3' ],
+						} )
+					),
+					parents: new Map(
+						Object.entries( {
+							2: '1',
+							3: '2',
+						} )
+					),
+				},
+			};
+
+			expect( hasSelectedInnerBlock( state, '1', true ) ).toBe( true );
+			expect( hasSelectedInnerBlock( state, '2', true ) ).toBe( true );
+			// Without a deep check only the direct parent matches.
+			expect( hasSelectedInnerBlock( state, '1' ) ).toBe( false );
+			expect( hasSelectedInnerBlock( state, '2' ) ).toBe( true );
+		} );
+
+		it( 'should return false for a deep check if the given ClientId is the selected block itself', () => {
+			const state = {
+				selection: {
+					selectionStart: { clientId: '3' },
+					selectionEnd: { clientId: '3' },
+				},
+				blocks: {
+					order: new Map(
+						Object.entries( {
+							1: [ '2' ],
+							2: [ '3' ],
+						} )
+					),
+					parents: new Map(
+						Object.entries( {
+							2: '1',
+							3: '2',
+						} )
+					),
+				},
+			};
+
+			expect( hasSelectedInnerBlock( state, '3', true ) ).toBe( false );
+		} );
+
+		it( 'should return true for a deep check if a multi selection contains a descendant of the block with the given ClientId', () => {
+			const state = {
+				selection: {
+					selectionStart: { clientId: '2' },
+					selectionEnd: { clientId: '3' },
+				},
+				blocks: {
+					order: new Map(
+						Object.entries( {
+							'': [ '1' ],
+							1: [ '2', '3' ],
+							3: [ '4' ],
+						} )
+					),
+					parents: new Map(
+						Object.entries( {
+							1: '',
+							2: '1',
+							3: '1',
+							4: '3',
+						} )
+					),
+				},
+			};
+
+			expect( hasSelectedInnerBlock( state, '1', true ) ).toBe( true );
+			// '3' is selected, and it is not its own ancestor.
+			expect( hasSelectedInnerBlock( state, '3', true ) ).toBe( false );
+			expect( hasSelectedInnerBlock( state, '4', true ) ).toBe( false );
+		} );
+
+		it( 'should return an up to date deep check after the selection moves to another branch', () => {
+			// The same blocks throughout, so only the selection changes.
+			const blocks = {
+				order: new Map(
+					Object.entries( {
+						'': [ '1', '4' ],
+						1: [ '2' ],
+						4: [ '5' ],
+					} )
+				),
+				parents: new Map(
+					Object.entries( {
+						1: '',
+						2: '1',
+						4: '',
+						5: '4',
+					} )
+				),
+			};
+
+			const state = {
+				blocks,
+				selection: {
+					selectionStart: { clientId: '2' },
+					selectionEnd: { clientId: '2' },
+				},
+			};
+
+			expect( hasSelectedInnerBlock( state, '1', true ) ).toBe( true );
+			expect( hasSelectedInnerBlock( state, '4', true ) ).toBe( false );
+
+			const nextState = {
+				blocks,
+				selection: {
+					selectionStart: { clientId: '5' },
+					selectionEnd: { clientId: '5' },
+				},
+			};
+
+			expect( hasSelectedInnerBlock( nextState, '1', true ) ).toBe(
+				false
+			);
+			expect( hasSelectedInnerBlock( nextState, '4', true ) ).toBe(
+				true
+			);
+		} );
 	} );
 
 	describe( 'isBlockWithinSelection', () => {

package/src/store/utils.js

@@ -1,12 +1,5 @@
-/**
- * WordPress dependencies
- */
 import { parse } from '@wordpress/blocks';
 import { parse as grammarParse } from '@wordpress/block-serialization-default-parser';
-
-/**
- * Internal dependencies
- */
 import {
 	selectBlockPatternsKey,
 	userPatternCategoriesSelectKey,

package/src/style.scss

@@ -35,9 +35,11 @@
 @use "./components/fit-text-size-warning/style.scss" as *;
 @use "./components/font-appearance-control/style.scss" as *;
 @use "./components/global-styles/style.scss" as *;
+@use "./components/global-styles/inheritance/style.scss" as *;
 @use "./components/grid/style.scss" as *;
 @use "./components/height-control/style.scss" as *;
 @use "./components/iframe/style.scss" as *;
+@use "./components/image-editor/style.scss" as *;
 @use "./components/inserter-list-item/style.scss" as *;
 @use "./components/inspector-controls/styles.scss" as *;
 @use "./components/inspector-controls-tabs/style.scss" as *;

package/src/utils/block-bindings.ts

@@ -1,8 +1,58 @@
 type Binding = { source?: string };
 type Bindings = Record< string, Binding >;
+type BlockBindingsSource = { usesContext?: readonly string[] };
 
 const DEFAULT_ATTRIBUTE = '__default';
 const PATTERN_OVERRIDES_SOURCE = 'core/pattern-overrides';
+const EMPTY_CONTEXT: Record< string, unknown > = {};
+
+/**
+ * Assembles the context made available to a block's bindings sources: the
+ * entries of the surrounding block context declared by the block type's
+ * `usesContext`, plus the entries declared by the given sources' `usesContext`.
+ *
+ * Only entries present in the surrounding block context are copied — a
+ * declared key with no provider never becomes an own (undefined-valued) key
+ * of the result, so `key in context` checks stay meaningful.
+ *
+ * @param blockContext         The surrounding block context.
+ * @param blockTypeUsesContext The block type's declared context needs.
+ * @param sources              Block-bindings sources whose declared context to add.
+ *
+ * @return The context for resolving the block's bindings.
+ */
+export function getBlockBindingsContext(
+	blockContext: Record< string, unknown >,
+	blockTypeUsesContext: readonly string[] | undefined,
+	sources: readonly ( BlockBindingsSource | undefined )[] | undefined
+): Record< string, unknown > {
+	let context: Record< string, unknown > | undefined;
+	if ( blockTypeUsesContext ) {
+		for ( const [ key, value ] of Object.entries( blockContext ) ) {
+			if ( blockTypeUsesContext.includes( key ) ) {
+				if ( context === undefined ) {
+					context = {};
+				}
+				context[ key ] = value;
+			}
+		}
+	}
+	if ( sources ) {
+		for ( const source of sources ) {
+			source?.usesContext?.forEach( ( key ) => {
+				if ( key in blockContext ) {
+					if ( context === undefined ) {
+						context = {};
+					}
+					context[ key ] = blockContext[ key ];
+				}
+			} );
+		}
+	}
+	// A stable empty object avoids re-renders for consumers that compare the
+	// context by reference.
+	return context ?? EMPTY_CONTEXT;
+}
 
 /**
  * Checks if the block has the `__default` binding for pattern overrides.

package/src/utils/dom.ts

@@ -31,6 +31,39 @@ export function isInsideRootBlock( blockElement: Element, element: Element ) {
 	return parentBlock === blockElement;
 }
 
+/**
+ * Returns the editable element containing the selection, if the selection is
+ * fully contained within one. The root element (an editable wrapper) does not
+ * count as a containing editable element.
+ *
+ * @param selection The selection.
+ * @param root      The editable wrapper element.
+ *
+ * @return The editable element containing the selection.
+ */
+export function getSelectionEditableElement(
+	selection: Selection,
+	root: Element
+) {
+	const { anchorNode, focusNode } = selection;
+
+	if ( ! anchorNode || ! focusNode ) {
+		return;
+	}
+
+	const element =
+		anchorNode.nodeType === anchorNode.ELEMENT_NODE
+			? ( anchorNode as Element )
+			: anchorNode.parentElement;
+	const editable = element?.closest( '[contenteditable="true"]' );
+
+	if ( ! editable || editable === root || ! editable.contains( focusNode ) ) {
+		return;
+	}
+
+	return editable;
+}
+
 /**
  * Finds the block client ID given any DOM node inside the block.
  *

package/src/utils/fit-text-frontend.ts

@@ -3,15 +3,7 @@
  * Automatically detects and initializes fit text on blocks with the has-fit-text class.
  * Supports both initial page load and Interactivity API client-side navigation.
  */
-
-/**
- * WordPress dependencies
- */
 import { store, getElement, getContext } from '@wordpress/interactivity';
-
-/**
- * Internal dependencies
- */
 import { optimizeFitText } from './fit-text-utils';
 
 interface FitTextContext {

package/src/utils/format-font-style.ts

@@ -1,11 +1,4 @@
-/**
- * WordPress dependencies
- */
 import { _x } from '@wordpress/i18n';
-
-/**
- * Internal dependencies
- */
 import type { FormattedFont } from './types';
 
 /**

package/src/utils/format-font-weight.ts

@@ -1,11 +1,4 @@
-/**
- * WordPress dependencies
- */
 import { _x } from '@wordpress/i18n';
-
-/**
- * Internal dependencies
- */
 import type { FormattedFont } from './types';
 
 /**

package/src/utils/get-font-styles-and-weights.ts

@@ -1,11 +1,4 @@
-/**
- * WordPress dependencies
- */
 import { _x, sprintf } from '@wordpress/i18n';
-
-/**
- * Internal dependencies
- */
 import { formatFontStyle } from './format-font-style';
 import { formatFontWeight } from './format-font-weight';
 import type {

package/src/utils/group-blocks.js

@@ -0,0 +1,36 @@
+import {
+	findTransform,
+	getBlockTransforms,
+	switchToBlockType,
+} from '@wordpress/blocks';
+
+/**
+ * Wraps the given blocks in the grouping block. Unlike a plain
+ * `switchToBlockType` call, the blocks' own transforms to the grouping block
+ * type are never used: the Group action is a structural wrap, while a
+ * block's own transform changes what the block is (a quote's transform to
+ * group dissolves the quote into its inner blocks).
+ *
+ * @param {WPBlock[]} blocks            Blocks to group.
+ * @param {string}    groupingBlockName Name of the grouping block.
+ *
+ * @return {?WPBlock[]} The grouped blocks, or null.
+ */
+export function groupBlocks( blocks, groupingBlockName ) {
+	const groupingBlockTransform = findTransform(
+		getBlockTransforms( 'from', groupingBlockName ),
+		( transform ) =>
+			transform.type === 'block' &&
+			transform.isMultiBlock &&
+			transform.blocks.includes( '*' )
+	);
+
+	if ( groupingBlockTransform?.__experimentalConvert ) {
+		const result = groupingBlockTransform.__experimentalConvert( blocks );
+		return Array.isArray( result ) ? result : [ result ];
+	}
+
+	// A grouping block without a wildcard transform. Fall back to regular
+	// block conversion.
+	return switchToBlockType( blocks, groupingBlockName );
+}

package/src/utils/native-undo.js

@@ -0,0 +1,53 @@
+import { useRefEffect } from '@wordpress/compose';
+
+/**
+ * Elements whose content the browser's own undo acts on (a dialog input, an
+ * HTML editing field, a search field), registered through `useNativeUndo`.
+ * The editor history must not act on events originating within them.
+ */
+const nativeUndoNodes = new WeakSet();
+
+/**
+ * Returns a ref that marks an element (and its descendants) as relying on
+ * the browser's own undo, so the editor history leaves the undo and redo
+ * shortcuts alone within it.
+ *
+ * @return {Function} Ref callback.
+ */
+export function useNativeUndo() {
+	return useRefEffect( ( node ) => {
+		nativeUndoNodes.add( node );
+		return () => {
+			nativeUndoNodes.delete( node );
+		};
+	}, [] );
+}
+
+/**
+ * Returns true when the event originates from an element registered through
+ * `useNativeUndo`.
+ *
+ * Events coming from the editor canvas are re-dispatched on the iframe
+ * element, so the real target is resolved through the frame's focused
+ * element.
+ *
+ * @param {KeyboardEvent} event Keyboard event.
+ *
+ * @return {boolean} Whether the element relies on the browser's own undo.
+ */
+export function usesNativeUndo( event ) {
+	let { target } = event;
+
+	if ( target?.nodeName === 'IFRAME' ) {
+		target = target.contentDocument?.activeElement;
+	}
+
+	while ( target ) {
+		if ( nativeUndoNodes.has( target ) ) {
+			return true;
+		}
+		target = target.parentElement;
+	}
+
+	return false;
+}

package/src/utils/pasting.ts

@@ -1,6 +1,3 @@
-/**
- * WordPress dependencies
- */
 import { getFilesFromDataTransfer } from '@wordpress/dom';
 
 /**

package/src/utils/selection.ts

@@ -1,6 +1,3 @@
-/**
- * WordPress dependencies
- */
 import { RichTextData } from '@wordpress/rich-text';
 
 /**

package/src/utils/sibling-block-attributes.js

@@ -0,0 +1,30 @@
+import { getBlockAttributesNamesByRole } from '@wordpress/blocks';
+
+/**
+ * Returns the attributes a newly created block inherits from an adjacent
+ * block of the same type: everything except the adjacent block's content
+ * (attributes with the `content` role) and its metadata.
+ * A styled sibling thus yields an equally styled, empty new block.
+ *
+ * @param {string}  blockName  The block name.
+ * @param {?Object} attributes The adjacent block's attributes.
+ *
+ * @return {Object} The attributes for the new block.
+ */
+export function getSiblingBlockAttributes( blockName, attributes ) {
+	if ( ! attributes ) {
+		return {};
+	}
+
+	const excluded = new Set(
+		getBlockAttributesNamesByRole( blockName, 'content' )
+	);
+	// The metadata attribute has no declared definition to carry a role. Its
+	// contents (bindings, custom name, bookkeeping) must not be duplicated.
+	excluded.add( 'metadata' );
+	return Object.fromEntries(
+		Object.entries( attributes ).filter(
+			( [ key ] ) => ! excluded.has( key )
+		)
+	);
+}

package/src/utils/test/block-bindings.js

@@ -0,0 +1,178 @@
+import {
+	getBlockBindingsContext,
+	hasPatternOverridesDefaultBinding,
+	replacePatternOverridesDefaultBinding,
+} from '../block-bindings';
+
+describe( 'hasPatternOverridesDefaultBinding', () => {
+	it( 'returns true when the `__default` binding targets pattern overrides', () => {
+		expect(
+			hasPatternOverridesDefaultBinding( {
+				__default: { source: 'core/pattern-overrides' },
+			} )
+		).toBe( true );
+	} );
+
+	it( 'returns false when there is no `__default` binding', () => {
+		expect(
+			hasPatternOverridesDefaultBinding( {
+				content: { source: 'core/pattern-overrides' },
+			} )
+		).toBe( false );
+	} );
+
+	it( 'returns false when the `__default` binding targets another source', () => {
+		expect(
+			hasPatternOverridesDefaultBinding( {
+				__default: { source: 'core/post-meta' },
+			} )
+		).toBe( false );
+	} );
+
+	it( 'returns false for undefined bindings', () => {
+		expect( hasPatternOverridesDefaultBinding( undefined ) ).toBe( false );
+	} );
+} );
+
+describe( 'replacePatternOverridesDefaultBinding', () => {
+	it( 'expands `__default` to a binding for each supported attribute', () => {
+		const result = replacePatternOverridesDefaultBinding(
+			{ __default: { source: 'core/pattern-overrides' } },
+			[ 'content', 'url', 'alt' ]
+		);
+
+		expect( result ).toEqual( {
+			content: { source: 'core/pattern-overrides' },
+			url: { source: 'core/pattern-overrides' },
+			alt: { source: 'core/pattern-overrides' },
+		} );
+	} );
+
+	it( 'retains explicit non-pattern-override bindings while expanding `__default`', () => {
+		const result = replacePatternOverridesDefaultBinding(
+			{
+				__default: { source: 'core/pattern-overrides' },
+				url: { source: 'core/post-meta', args: { key: 'my_url' } },
+			},
+			[ 'content', 'url' ]
+		);
+
+		expect( result ).toEqual( {
+			content: { source: 'core/pattern-overrides' },
+			url: { source: 'core/post-meta', args: { key: 'my_url' } },
+		} );
+	} );
+
+	it( 'returns the bindings untouched when there is no `__default` pattern-override binding', () => {
+		const bindings = { content: { source: 'core/pattern-overrides' } };
+
+		expect(
+			replacePatternOverridesDefaultBinding( bindings, [ 'content' ] )
+		).toBe( bindings );
+	} );
+
+	// Regression guard: the `__default` expansion only iterates the block
+	// type's supported *attributes*, so it can never synthesize an
+	// `innerBlocks` binding. Existing `__default` pattern-override blocks
+	// must not implicitly gain an inner-block binding.
+	it( 'never synthesizes an `innerBlocks` binding when expanding `__default`', () => {
+		// A realistic set of supported *attribute* names — `innerBlocks` is not
+		// an attribute and is therefore never present here.
+		const supportedAttributes = [ 'content', 'url', 'alt', 'title' ];
+
+		const result = replacePatternOverridesDefaultBinding(
+			{ __default: { source: 'core/pattern-overrides' } },
+			supportedAttributes
+		);
+
+		// Every produced binding key corresponds to a supported attribute…
+		expect( Object.keys( result ) ).toEqual( supportedAttributes );
+		// …and `innerBlocks` is never among them.
+		expect( result ).not.toHaveProperty( 'innerBlocks' );
+	} );
+
+	it( 'does not add an `innerBlocks` binding even when supportedAttributes is empty', () => {
+		const result = replacePatternOverridesDefaultBinding(
+			{ __default: { source: 'core/pattern-overrides' } },
+			[]
+		);
+
+		expect( result ).toEqual( {} );
+		expect( result ).not.toHaveProperty( 'innerBlocks' );
+	} );
+} );
+
+describe( 'getBlockBindingsContext', () => {
+	const blockContext = {
+		postId: 1,
+		postType: 'post',
+		'pattern/overrides': { content: 'x' },
+	};
+
+	it( 'copies the block-type-declared entries present in the block context', () => {
+		expect(
+			getBlockBindingsContext(
+				blockContext,
+				[ 'postId', 'postType' ],
+				undefined
+			)
+		).toEqual( { postId: 1, postType: 'post' } );
+	} );
+
+	it( 'omits block-type-declared keys absent from the block context', () => {
+		const result = getBlockBindingsContext(
+			blockContext,
+			[ 'postId', 'core/missing' ],
+			undefined
+		);
+
+		expect( result ).toEqual( { postId: 1 } );
+		// The declared-but-unprovided key must not become an own
+		// (undefined-valued) key, so `key in context` checks stay meaningful.
+		expect( result ).not.toHaveProperty( 'core/missing' );
+	} );
+
+	it( 'adds source-declared entries present in the block context', () => {
+		expect(
+			getBlockBindingsContext(
+				blockContext,
+				[ 'postId' ],
+				[
+					{ usesContext: [ 'pattern/overrides' ] },
+					{ usesContext: [ 'postType' ] },
+				]
+			)
+		).toEqual( {
+			postId: 1,
+			postType: 'post',
+			'pattern/overrides': { content: 'x' },
+		} );
+	} );
+
+	it( 'omits source-declared keys absent from the block context', () => {
+		const result = getBlockBindingsContext( blockContext, undefined, [
+			{ usesContext: [ 'core/missing' ] },
+		] );
+
+		expect( result ).toEqual( {} );
+		expect( result ).not.toHaveProperty( 'core/missing' );
+	} );
+
+	it( 'ignores unregistered (undefined) sources and sources without usesContext', () => {
+		expect(
+			getBlockBindingsContext( blockContext, undefined, [
+				undefined,
+				{},
+				{ usesContext: [ 'postId' ] },
+			] )
+		).toEqual( { postId: 1 } );
+	} );
+
+	it( 'returns a stable empty object when nothing is declared', () => {
+		const first = getBlockBindingsContext( blockContext, undefined, [] );
+		const second = getBlockBindingsContext( blockContext, [], undefined );
+
+		expect( first ).toEqual( {} );
+		expect( second ).toBe( first );
+	} );
+} );

package/src/utils/test/color-values.js

@@ -1,6 +1,3 @@
-/**
- * Internal dependencies
- */
 import {
 	extractPresetSlug,
 	encodeColorValueWithPalette,

package/src/utils/test/format-font-style.js

@@ -1,6 +1,3 @@
-/**
- * Internal dependencies
- */
 import { formatFontStyle } from '../format-font-style';
 
 describe( 'formatFontStyle', () => {

package/src/utils/test/format-font-weight.js

@@ -1,6 +1,3 @@
-/**
- * Internal dependencies
- */
 import { formatFontWeight } from '../format-font-weight';
 
 describe( 'formatFontWeight', () => {