@wordpress/block-editor 12.7.0 → 12.8.0

package/src/store/test/private-selectors.js

@@ -1,23 +1,14 @@
-/**
- * WordPress dependencies
- */
-import { select } from '@wordpress/data';
-
 /**
  * Internal dependencies
  */
 import {
 	isBlockInterfaceHidden,
 	getLastInsertedBlocksClientIds,
-	getBlockEditingMode,
 	isBlockSubtreeDisabled,
 	getEnabledClientIdsTree,
 	getEnabledBlockParents,
 } from '../private-selectors';
-
-jest.mock( '@wordpress/data/src/select', () => ( {
-	select: jest.fn(),
-} ) );
+import { getBlockEditingMode } from '../selectors';
 
 describe( 'private selectors', () => {
 	describe( 'isBlockInterfaceHidden', () => {
@@ -63,7 +54,7 @@ describe( 'private selectors', () => {
 		} );
 	} );
 
-	describe( 'block editing mode selectors', () => {
+	describe( 'isBlockSubtreeDisabled', () => {
 		const baseState = {
 			settings: {},
 			blocks: {
@@ -130,264 +121,100 @@ describe( 'private selectors', () => {
 			blockEditingModes: new Map( [] ),
 		};
 
-		describe( 'getBlockEditingMode', () => {
-			const __experimentalHasContentRoleAttribute = jest.fn(
-				() => false
-			);
-			select.mockReturnValue( {
+		const __experimentalHasContentRoleAttribute = jest.fn( () => false );
+		getBlockEditingMode.registry = {
+			select: jest.fn( () => ( {
 				__experimentalHasContentRoleAttribute,
-			} );
-
-			it( 'should return default by default', () => {
-				expect(
-					getBlockEditingMode(
-						baseState,
-						'b3247f75-fd94-4fef-97f9-5bfd162cc416'
-					)
-				).toBe( 'default' );
-			} );
-
-			it( 'should return disabled if explicitly set', () => {
-				const state = {
-					...baseState,
-					blockEditingModes: new Map( [
-						[ 'b3247f75-fd94-4fef-97f9-5bfd162cc416', 'disabled' ],
-					] ),
-				};
-				expect(
-					getBlockEditingMode(
-						state,
-						'b3247f75-fd94-4fef-97f9-5bfd162cc416'
-					)
-				).toBe( 'disabled' );
-			} );
-
-			it( 'should return contentOnly if explicitly set', () => {
-				const state = {
-					...baseState,
-					blockEditingModes: new Map( [
-						[
-							'b3247f75-fd94-4fef-97f9-5bfd162cc416',
-							'contentOnly',
-						],
-					] ),
-				};
-				expect(
-					getBlockEditingMode(
-						state,
-						'b3247f75-fd94-4fef-97f9-5bfd162cc416'
-					)
-				).toBe( 'contentOnly' );
-			} );
-
-			it( 'should return disabled if explicitly set on a parent', () => {
-				const state = {
-					...baseState,
-					blockEditingModes: new Map( [
-						[ 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', 'disabled' ],
-					] ),
-				};
-				expect(
-					getBlockEditingMode(
-						state,
-						'b3247f75-fd94-4fef-97f9-5bfd162cc416'
-					)
-				).toBe( 'disabled' );
-			} );
-
-			it( 'should return default if parent is set to contentOnly', () => {
-				const state = {
-					...baseState,
-					blockEditingModes: new Map( [
-						[
-							'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337',
-							'contentOnly',
-						],
-					] ),
-				};
-				expect(
-					getBlockEditingMode(
-						state,
-						'b3247f75-fd94-4fef-97f9-5bfd162cc416'
-					)
-				).toBe( 'default' );
-			} );
-
-			it( 'should return disabled if overridden by a parent', () => {
-				const state = {
-					...baseState,
-					blockEditingModes: new Map( [
-						[ '', 'disabled' ],
-						[ 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', 'default' ],
-						[ '9b9c5c3f-2e46-4f02-9e14-9fe9515b958f', 'disabled' ],
-					] ),
-				};
-				expect(
-					getBlockEditingMode(
-						state,
-						'b3247f75-fd94-4fef-97f9-5bfd162cc416'
-					)
-				).toBe( 'disabled' );
-			} );
-
-			it( 'should return disabled if explicitly set on root', () => {
-				const state = {
-					...baseState,
-					blockEditingModes: new Map( [ [ '', 'disabled' ] ] ),
-				};
-				expect(
-					getBlockEditingMode(
-						state,
-						'b3247f75-fd94-4fef-97f9-5bfd162cc416'
-					)
-				).toBe( 'disabled' );
-			} );
-
-			it( 'should return default if root is contentOnly', () => {
-				const state = {
-					...baseState,
-					blockEditingModes: new Map( [ [ '', 'contentOnly' ] ] ),
-				};
-				expect(
-					getBlockEditingMode(
-						state,
-						'b3247f75-fd94-4fef-97f9-5bfd162cc416'
-					)
-				).toBe( 'default' );
-			} );
-
-			it( 'should return disabled if parent is locked and the block has no content role', () => {
-				const state = {
-					...baseState,
-					blockListSettings: {
-						...baseState.blockListSettings,
-						'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f': {
-							templateLock: 'contentOnly',
-						},
-					},
-				};
-				__experimentalHasContentRoleAttribute.mockReturnValueOnce(
-					false
-				);
-				expect(
-					getBlockEditingMode(
-						state,
-						'b3247f75-fd94-4fef-97f9-5bfd162cc416'
-					)
-				).toBe( 'disabled' );
-			} );
+			} ) ),
+		};
 
-			it( 'should return contentOnly if parent is locked and the block has a content role', () => {
-				const state = {
-					...baseState,
-					blockListSettings: {
-						...baseState.blockListSettings,
-						'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f': {
-							templateLock: 'contentOnly',
-						},
-					},
-				};
-				__experimentalHasContentRoleAttribute.mockReturnValueOnce(
-					true
-				);
-				expect(
-					getBlockEditingMode(
-						state,
-						'b3247f75-fd94-4fef-97f9-5bfd162cc416'
-					)
-				).toBe( 'contentOnly' );
-			} );
+		it( 'should return false when top level block is not disabled', () => {
+			const state = {
+				...baseState,
+				blockEditingModes: new Map( [] ),
+			};
+			expect(
+				isBlockSubtreeDisabled(
+					state,
+					'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337'
+				)
+			).toBe( false );
 		} );
 
-		describe( 'isBlockSubtreeDisabled', () => {
-			it( 'should return false when top level block is not disabled', () => {
-				const state = {
-					...baseState,
-					blockEditingModes: new Map( [] ),
-				};
-				expect(
-					isBlockSubtreeDisabled(
-						state,
-						'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337'
-					)
-				).toBe( false );
-			} );
-
-			it( 'should return true when top level block is disabled and there are no editing modes within it', () => {
-				const state = {
-					...baseState,
-					blockEditingModes: new Map( [
-						[ 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', 'disabled' ],
-					] ),
-				};
-				expect(
-					isBlockSubtreeDisabled(
-						state,
-						'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337'
-					)
-				).toBe( true );
-			} );
+		it( 'should return true when top level block is disabled and there are no editing modes within it', () => {
+			const state = {
+				...baseState,
+				blockEditingModes: new Map( [
+					[ 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', 'disabled' ],
+				] ),
+			};
+			expect(
+				isBlockSubtreeDisabled(
+					state,
+					'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337'
+				)
+			).toBe( true );
+		} );
 
-			it( 'should return true when top level block is disabled via inheritence and there are no editing modes within it', () => {
-				const state = {
-					...baseState,
-					blockEditingModes: new Map( [ [ '', 'disabled' ] ] ),
-				};
-				expect(
-					isBlockSubtreeDisabled(
-						state,
-						'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337'
-					)
-				).toBe( true );
-			} );
+		it( 'should return true when top level block is disabled via inheritence and there are no editing modes within it', () => {
+			const state = {
+				...baseState,
+				blockEditingModes: new Map( [ [ '', 'disabled' ] ] ),
+			};
+			expect(
+				isBlockSubtreeDisabled(
+					state,
+					'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337'
+				)
+			).toBe( true );
+		} );
 
-			it( 'should return true when top level block is disabled and there are disabled editing modes within it', () => {
-				const state = {
-					...baseState,
-					blockEditingModes: new Map( [
-						[ 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', 'disabled' ],
-						[ 'b3247f75-fd94-4fef-97f9-5bfd162cc416', 'disabled' ],
-					] ),
-				};
-				expect(
-					isBlockSubtreeDisabled(
-						state,
-						'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337'
-					)
-				).toBe( true );
-			} );
+		it( 'should return true when top level block is disabled and there are disabled editing modes within it', () => {
+			const state = {
+				...baseState,
+				blockEditingModes: new Map( [
+					[ 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', 'disabled' ],
+					[ 'b3247f75-fd94-4fef-97f9-5bfd162cc416', 'disabled' ],
+				] ),
+			};
+			expect(
+				isBlockSubtreeDisabled(
+					state,
+					'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337'
+				)
+			).toBe( true );
+		} );
 
-			it( 'should return false when top level block is disabled and there are non-disabled editing modes within it', () => {
-				const state = {
-					...baseState,
-					blockEditingModes: new Map( [
-						[ 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', 'disabled' ],
-						[ 'b3247f75-fd94-4fef-97f9-5bfd162cc416', 'default' ],
-					] ),
-				};
-				expect(
-					isBlockSubtreeDisabled(
-						state,
-						'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337'
-					)
-				).toBe( false );
-			} );
+		it( 'should return false when top level block is disabled and there are non-disabled editing modes within it', () => {
+			const state = {
+				...baseState,
+				blockEditingModes: new Map( [
+					[ 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', 'disabled' ],
+					[ 'b3247f75-fd94-4fef-97f9-5bfd162cc416', 'default' ],
+				] ),
+			};
+			expect(
+				isBlockSubtreeDisabled(
+					state,
+					'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337'
+				)
+			).toBe( false );
+		} );
 
-			it( 'should return false when top level block is disabled via inheritence and there are non-disabled editing modes within it', () => {
-				const state = {
-					...baseState,
-					blockEditingModes: new Map( [
-						[ '', 'disabled' ],
-						[ 'b3247f75-fd94-4fef-97f9-5bfd162cc416', 'default' ],
-					] ),
-				};
-				expect(
-					isBlockSubtreeDisabled(
-						state,
-						'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337'
-					)
-				).toBe( false );
-			} );
+		it( 'should return false when top level block is disabled via inheritence and there are non-disabled editing modes within it', () => {
+			const state = {
+				...baseState,
+				blockEditingModes: new Map( [
+					[ '', 'disabled' ],
+					[ 'b3247f75-fd94-4fef-97f9-5bfd162cc416', 'default' ],
+				] ),
+			};
+			expect(
+				isBlockSubtreeDisabled(
+					state,
+					'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337'
+				)
+			).toBe( false );
 		} );
 	} );
 

package/src/store/test/selectors.js

@@ -73,6 +73,7 @@ const {
 	__experimentalGetPatternTransformItems,
 	wasBlockJustInserted,
 	__experimentalGetGlobalBlocksByName,
+	getBlockEditingMode,
 } = selectors;
 
 describe( 'selectors', () => {
@@ -3348,7 +3349,10 @@ describe( 'selectors', () => {
 				category: 'reusable',
 				content: '<!-- /wp:test-block-a -->',
 				frecency: 0,
-				icon: symbol,
+				icon: {
+					src: symbol,
+					foreground: 'var(--wp-block-synced-color)',
+				},
 				id: 'core/block/1',
 				initialAttributes: { ref: 1 },
 				isDisabled: false,
@@ -4788,3 +4792,201 @@ describe( '__unstableGetClientIdsTree', () => {
 		] );
 	} );
 } );
+
+describe( 'getBlockEditingMode', () => {
+	const baseState = {
+		settings: {},
+		blocks: {
+			byClientId: new Map( [
+				[ '6cf70164-9097-4460-bcbf-200560546988', {} ], // Header
+				[ 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', {} ], // Group
+				[ 'b26fc763-417d-4f01-b81c-2ec61e14a972', {} ], // |  Post Title
+				[ '9b9c5c3f-2e46-4f02-9e14-9fe9515b958f', {} ], // |  Post Content
+				[ 'b3247f75-fd94-4fef-97f9-5bfd162cc416', {} ], // | |  Paragraph
+				[ 'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c', {} ], // | |  Paragraph
+			] ),
+			order: new Map( [
+				[
+					'',
+					[
+						'6cf70164-9097-4460-bcbf-200560546988',
+						'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337',
+					],
+				],
+				[ '6cf70164-9097-4460-bcbf-200560546988', [] ],
+				[
+					'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337',
+					[
+						'b26fc763-417d-4f01-b81c-2ec61e14a972',
+						'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+					],
+				],
+				[ 'b26fc763-417d-4f01-b81c-2ec61e14a972', [] ],
+				[
+					'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+					[
+						'b3247f75-fd94-4fef-97f9-5bfd162cc416',
+						'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c',
+					],
+				],
+				[ 'b3247f75-fd94-4fef-97f9-5bfd162cc416', [] ],
+				[ 'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c', [] ],
+			] ),
+			parents: new Map( [
+				[ '6cf70164-9097-4460-bcbf-200560546988', '' ],
+				[ 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', '' ],
+				[
+					'b26fc763-417d-4f01-b81c-2ec61e14a972',
+					'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337',
+				],
+				[
+					'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+					'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337',
+				],
+				[
+					'b3247f75-fd94-4fef-97f9-5bfd162cc416',
+					'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+				],
+				[
+					'e178812d-ce5e-48c7-a945-8ae4ffcbbb7c',
+					'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f',
+				],
+			] ),
+		},
+		blockListSettings: {
+			'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337': {},
+			'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f': {},
+		},
+		blockEditingModes: new Map( [] ),
+	};
+
+	const __experimentalHasContentRoleAttribute = jest.fn( () => false );
+	getBlockEditingMode.registry = {
+		select: jest.fn( () => ( {
+			__experimentalHasContentRoleAttribute,
+		} ) ),
+	};
+
+	it( 'should return default by default', () => {
+		expect(
+			getBlockEditingMode(
+				baseState,
+				'b3247f75-fd94-4fef-97f9-5bfd162cc416'
+			)
+		).toBe( 'default' );
+	} );
+
+	it( 'should return disabled if explicitly set', () => {
+		const state = {
+			...baseState,
+			blockEditingModes: new Map( [
+				[ 'b3247f75-fd94-4fef-97f9-5bfd162cc416', 'disabled' ],
+			] ),
+		};
+		expect(
+			getBlockEditingMode( state, 'b3247f75-fd94-4fef-97f9-5bfd162cc416' )
+		).toBe( 'disabled' );
+	} );
+
+	it( 'should return contentOnly if explicitly set', () => {
+		const state = {
+			...baseState,
+			blockEditingModes: new Map( [
+				[ 'b3247f75-fd94-4fef-97f9-5bfd162cc416', 'contentOnly' ],
+			] ),
+		};
+		expect(
+			getBlockEditingMode( state, 'b3247f75-fd94-4fef-97f9-5bfd162cc416' )
+		).toBe( 'contentOnly' );
+	} );
+
+	it( 'should return disabled if explicitly set on a parent', () => {
+		const state = {
+			...baseState,
+			blockEditingModes: new Map( [
+				[ 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', 'disabled' ],
+			] ),
+		};
+		expect(
+			getBlockEditingMode( state, 'b3247f75-fd94-4fef-97f9-5bfd162cc416' )
+		).toBe( 'disabled' );
+	} );
+
+	it( 'should return default if parent is set to contentOnly', () => {
+		const state = {
+			...baseState,
+			blockEditingModes: new Map( [
+				[ 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', 'contentOnly' ],
+			] ),
+		};
+		expect(
+			getBlockEditingMode( state, 'b3247f75-fd94-4fef-97f9-5bfd162cc416' )
+		).toBe( 'default' );
+	} );
+
+	it( 'should return disabled if overridden by a parent', () => {
+		const state = {
+			...baseState,
+			blockEditingModes: new Map( [
+				[ '', 'disabled' ],
+				[ 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', 'default' ],
+				[ '9b9c5c3f-2e46-4f02-9e14-9fe9515b958f', 'disabled' ],
+			] ),
+		};
+		expect(
+			getBlockEditingMode( state, 'b3247f75-fd94-4fef-97f9-5bfd162cc416' )
+		).toBe( 'disabled' );
+	} );
+
+	it( 'should return disabled if explicitly set on root', () => {
+		const state = {
+			...baseState,
+			blockEditingModes: new Map( [ [ '', 'disabled' ] ] ),
+		};
+		expect(
+			getBlockEditingMode( state, 'b3247f75-fd94-4fef-97f9-5bfd162cc416' )
+		).toBe( 'disabled' );
+	} );
+
+	it( 'should return default if root is contentOnly', () => {
+		const state = {
+			...baseState,
+			blockEditingModes: new Map( [ [ '', 'contentOnly' ] ] ),
+		};
+		expect(
+			getBlockEditingMode( state, 'b3247f75-fd94-4fef-97f9-5bfd162cc416' )
+		).toBe( 'default' );
+	} );
+
+	it( 'should return disabled if parent is locked and the block has no content role', () => {
+		const state = {
+			...baseState,
+			blockListSettings: {
+				...baseState.blockListSettings,
+				'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f': {
+					templateLock: 'contentOnly',
+				},
+			},
+		};
+		__experimentalHasContentRoleAttribute.mockReturnValueOnce( false );
+		expect(
+			getBlockEditingMode( state, 'b3247f75-fd94-4fef-97f9-5bfd162cc416' )
+		).toBe( 'disabled' );
+	} );
+
+	it( 'should return contentOnly if parent is locked and the block has a content role', () => {
+		const state = {
+			...baseState,
+			blockListSettings: {
+				...baseState.blockListSettings,
+				'9b9c5c3f-2e46-4f02-9e14-9fe9515b958f': {
+					templateLock: 'contentOnly',
+				},
+			},
+		};
+		__experimentalHasContentRoleAttribute.mockReturnValueOnce( true );
+		expect(
+			getBlockEditingMode( state, 'b3247f75-fd94-4fef-97f9-5bfd162cc416' )
+		).toBe( 'contentOnly' );
+	} );
+} );

package/src/utils/transform-styles/ast/parse.js

@@ -455,6 +455,36 @@ export default function ( css, options ) {
 		} );
 	}
 
+	/**
+	 * Parse container.
+	 */
+
+	function atcontainer() {
+		const pos = position();
+		const m = match( /^@container *([^{]+)/ );
+
+		if ( ! m ) {
+			return;
+		}
+		const container = trim( m[ 1 ] );
+
+		if ( ! open() ) {
+			return error( "@container missing '{'" );
+		}
+
+		const style = comments().concat( rules() );
+
+		if ( ! close() ) {
+			return error( "@container missing '}'" );
+		}
+
+		return pos( {
+			type: 'container',
+			container,
+			rules: style,
+		} );
+	}
+
 	/**
 	 * Parse custom-media.
 	 */
@@ -624,6 +654,7 @@ export default function ( css, options ) {
 		return (
 			atkeyframes() ||
 			atmedia() ||
+			atcontainer() ||
 			atcustommedia() ||
 			atsupports() ||
 			atimport() ||

package/src/utils/transform-styles/ast/stringify/compress.js

@@ -68,6 +68,19 @@ Compiler.prototype.media = function ( node ) {
 	);
 };
 
+/**
+ * Visit container node.
+ */
+
+Compiler.prototype.container = function ( node ) {
+	return (
+		this.emit( '@container ' + node.container, node.position ) +
+		this.emit( '{' ) +
+		this.mapVisit( node.rules ) +
+		this.emit( '}' )
+	);
+};
+
 /**
  * Visit document node.
  */

package/src/utils/transform-styles/ast/stringify/identity.js

@@ -83,6 +83,19 @@ Compiler.prototype.media = function ( node ) {
 	);
 };
 
+/**
+ * Visit container node.
+ */
+
+Compiler.prototype.container = function ( node ) {
+	return (
+		this.emit( '@container ' + node.container, node.position ) +
+		this.emit( ' {\n' + this.indent( 1 ) ) +
+		this.mapVisit( node.rules, '\n\n' ) +
+		this.emit( this.indent( -1 ) + '\n}' )
+	);
+};
+
 /**
  * Visit document node.
  */