@wordpress/block-library 8.26.0 → 8.27.1

package/src/button/edit.js

@@ -9,6 +9,7 @@ import classnames from 'classnames';
 import { NEW_TAB_TARGET, NOFOLLOW_REL } from './constants';
 import { getUpdatedLinkAttributes } from './get-updated-link-attributes';
 import removeAnchorTag from '../utils/remove-anchor-tag';
+import { unlock } from '../lock-unlock';
 
 /**
  * WordPress dependencies
@@ -32,9 +33,11 @@ import {
 	__experimentalUseBorderProps as useBorderProps,
 	__experimentalUseColorProps as useColorProps,
 	__experimentalGetSpacingClassesAndStyles as useSpacingProps,
+	__experimentalUseShadowProps as useShadowProps,
 	__experimentalLinkControl as LinkControl,
 	__experimentalGetElementClassName,
 	store as blockEditorStore,
+	useBlockEditingMode,
 } from '@wordpress/block-editor';
 import { displayShortcut, isKeyboardEvent, ENTER } from '@wordpress/keycodes';
 import { link, linkOff } from '@wordpress/icons';
@@ -163,6 +166,7 @@ function ButtonEdit( props ) {
 		text,
 		url,
 		width,
+		metadata,
 	} = attributes;
 
 	const TagName = tagName || 'a';
@@ -183,12 +187,14 @@ function ButtonEdit( props ) {
 	const borderProps = useBorderProps( attributes );
 	const colorProps = useColorProps( attributes );
 	const spacingProps = useSpacingProps( attributes );
+	const shadowProps = useShadowProps( attributes );
 	const ref = useRef();
 	const richTextRef = useRef();
 	const blockProps = useBlockProps( {
 		ref: useMergeRefs( [ setPopoverAnchor, ref ] ),
 		onKeyDown,
 	} );
+	const blockEditingMode = useBlockEditingMode();
 
 	const [ isEditingURL, setIsEditingURL ] = useState( false );
 	const isURLSet = !! url;
@@ -226,6 +232,27 @@ function ButtonEdit( props ) {
 	const useEnterRef = useEnter( { content: text, clientId } );
 	const mergedRef = useMergeRefs( [ useEnterRef, richTextRef ] );
 
+	const { lockUrlControls = false } = useSelect(
+		( select ) => {
+			if ( ! isSelected ) {
+				return {};
+			}
+
+			const { getBlockBindingsSource } = unlock(
+				select( blockEditorStore )
+			);
+
+			return {
+				lockUrlControls:
+					!! metadata?.bindings?.url &&
+					getBlockBindingsSource(
+						metadata?.bindings?.url?.source?.name
+					)?.lockAttributesEditing === true,
+			};
+		},
+		[ isSelected ]
+	);
+
 	return (
 		<>
 			<div
@@ -264,6 +291,7 @@ function ButtonEdit( props ) {
 						...borderProps.style,
 						...colorProps.style,
 						...spacingProps.style,
+						...shadowProps.style,
 					} }
 					onSplit={ ( value ) =>
 						createBlock( 'core/button', {
@@ -277,13 +305,15 @@ function ButtonEdit( props ) {
 				/>
 			</div>
 			<BlockControls group="block">
-				<AlignmentControl
-					value={ textAlign }
-					onChange={ ( nextAlign ) => {
-						setAttributes( { textAlign: nextAlign } );
-					} }
-				/>
-				{ ! isURLSet && isLinkTag && (
+				{ blockEditingMode === 'default' && (
+					<AlignmentControl
+						value={ textAlign }
+						onChange={ ( nextAlign ) => {
+							setAttributes( { textAlign: nextAlign } );
+						} }
+					/>
+				) }
+				{ ! isURLSet && isLinkTag && ! lockUrlControls && (
 					<ToolbarButton
 						name="link"
 						icon={ link }
@@ -292,7 +322,7 @@ function ButtonEdit( props ) {
 						onClick={ startEditing }
 					/>
 				) }
-				{ isURLSet && isLinkTag && (
+				{ isURLSet && isLinkTag && ! lockUrlControls && (
 					<ToolbarButton
 						name="link"
 						icon={ linkOff }
@@ -303,43 +333,46 @@ function ButtonEdit( props ) {
 					/>
 				) }
 			</BlockControls>
-			{ isLinkTag && isSelected && ( isEditingURL || isURLSet ) && (
-				<Popover
-					placement="bottom"
-					onClose={ () => {
-						setIsEditingURL( false );
-						richTextRef.current?.focus();
-					} }
-					anchor={ popoverAnchor }
-					focusOnMount={ isEditingURL ? 'firstElement' : false }
-					__unstableSlotName={ '__unstable-block-tools-after' }
-					shift
-				>
-					<LinkControl
-						value={ linkValue }
-						onChange={ ( {
-							url: newURL,
-							opensInNewTab: newOpensInNewTab,
-							nofollow: newNofollow,
-						} ) =>
-							setAttributes(
-								getUpdatedLinkAttributes( {
-									rel,
-									url: newURL,
-									opensInNewTab: newOpensInNewTab,
-									nofollow: newNofollow,
-								} )
-							)
-						}
-						onRemove={ () => {
-							unlink();
+			{ isLinkTag &&
+				isSelected &&
+				( isEditingURL || isURLSet ) &&
+				! lockUrlControls && (
+					<Popover
+						placement="bottom"
+						onClose={ () => {
+							setIsEditingURL( false );
 							richTextRef.current?.focus();
 						} }
-						forceIsEditingLink={ isEditingURL }
-						settings={ LINK_SETTINGS }
-					/>
-				</Popover>
-			) }
+						anchor={ popoverAnchor }
+						focusOnMount={ isEditingURL ? 'firstElement' : false }
+						__unstableSlotName={ '__unstable-block-tools-after' }
+						shift
+					>
+						<LinkControl
+							value={ linkValue }
+							onChange={ ( {
+								url: newURL,
+								opensInNewTab: newOpensInNewTab,
+								nofollow: newNofollow,
+							} ) =>
+								setAttributes(
+									getUpdatedLinkAttributes( {
+										rel,
+										url: newURL,
+										opensInNewTab: newOpensInNewTab,
+										nofollow: newNofollow,
+									} )
+								)
+							}
+							onRemove={ () => {
+								unlink();
+								richTextRef.current?.focus();
+							} }
+							forceIsEditingLink={ isEditingURL }
+							settings={ LINK_SETTINGS }
+						/>
+					</Popover>
+				) }
 			<InspectorControls>
 				<WidthPanel
 					selectedWidth={ width }

package/src/button/save.js

@@ -12,6 +12,7 @@ import {
 	__experimentalGetBorderClassesAndStyles as getBorderClassesAndStyles,
 	__experimentalGetColorClassesAndStyles as getColorClassesAndStyles,
 	__experimentalGetSpacingClassesAndStyles as getSpacingClassesAndStyles,
+	__experimentalGetShadowClassesAndStyles as getShadowClassesAndStyles,
 	__experimentalGetElementClassName,
 } from '@wordpress/block-editor';
 
@@ -40,6 +41,7 @@ export default function save( { attributes, className } ) {
 	const borderProps = getBorderClassesAndStyles( attributes );
 	const colorProps = getColorClassesAndStyles( attributes );
 	const spacingProps = getSpacingClassesAndStyles( attributes );
+	const shadowProps = getShadowClassesAndStyles( attributes );
 	const buttonClasses = classnames(
 		'wp-block-button__link',
 		colorProps.className,
@@ -56,6 +58,7 @@ export default function save( { attributes, className } ) {
 		...borderProps.style,
 		...colorProps.style,
 		...spacingProps.style,
+		...shadowProps.style,
 	};
 
 	// The use of a `title` attribute here is soft-deprecated, but still applied

package/src/buttons/test/__snapshots__/edit.native.js.snap

@@ -6,6 +6,12 @@ exports[`Buttons block color customization sets a background color 1`] = `
 <!-- /wp:buttons -->"
 `;
 
+exports[`Buttons block color customization sets a custom gradient background color 1`] = `
+"<!-- wp:buttons -->
+<div class="wp-block-buttons"><!-- wp:button {"style":{"color":{"gradient":"linear-gradient(200deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%)"}}} /--></div>
+<!-- /wp:buttons -->"
+`;
+
 exports[`Buttons block color customization sets a gradient background color 1`] = `
 "<!-- wp:buttons -->
 <div class="wp-block-buttons"><!-- wp:button {"gradient":"light-green-cyan-to-vivid-green-cyan"} /--></div>

package/src/buttons/test/edit.native.js

@@ -10,6 +10,7 @@ import {
 	initializeEditor,
 	triggerBlockListLayout,
 	typeInRichText,
+	openBlockSettings,
 	waitFor,
 } from 'test/helpers';
 
@@ -391,5 +392,53 @@ describe( 'Buttons block', () => {
 			// Assert
 			expect( getEditorHtml() ).toMatchSnapshot();
 		} );
+
+		it( 'sets a custom gradient background color', async () => {
+			// Arrange
+			const screen = await initializeEditor();
+			await addBlock( screen, 'Buttons' );
+
+			// Act
+			const buttonsBlock = getBlock( screen, 'Buttons' );
+			fireEvent.press( buttonsBlock );
+
+			// Trigger onLayout for the list
+			await triggerBlockListLayout( buttonsBlock );
+
+			const buttonBlock = await getBlock( screen, 'Button' );
+			fireEvent.press( buttonBlock );
+
+			// Open Block Settings.
+			await openBlockSettings( screen );
+
+			// Open Text color settings
+			fireEvent.press( screen.getByLabelText( 'Background, Default' ) );
+
+			// Tap on the gradient segment
+			fireEvent.press( screen.getByLabelText( 'Gradient' ) );
+
+			// Tap one gradient color
+			fireEvent.press(
+				screen.getByLabelText( 'Light green cyan to vivid green cyan' )
+			);
+
+			// Tap on Customize Gradient
+			fireEvent.press( screen.getByLabelText( /Customize Gradient/ ) );
+
+			// Change the current angle
+			fireEvent.press( screen.getByText( '135', { hidden: true } ) );
+			const angleTextInput = screen.getByDisplayValue( '135', {
+				hidden: true,
+			} );
+			fireEvent.changeText( angleTextInput, '200' );
+
+			// Go back to the settings list.
+			fireEvent.press( await screen.findByLabelText( 'Go back' ) );
+
+			// Assert
+			const customButton = await screen.findByText( 'CUSTOM' );
+			expect( customButton ).toBeVisible();
+			expect( getEditorHtml() ).toMatchSnapshot();
+		} );
 	} );
 } );

package/src/cover/block.json

@@ -114,6 +114,9 @@
 			"__experimentalSkipSerialization": [ "gradients" ],
 			"enableContrastChecker": false
 		},
+		"dimensions": {
+			"aspectRatio": true
+		},
 		"typography": {
 			"fontSize": true,
 			"lineHeight": true,

package/src/cover/edit/index.js

@@ -431,7 +431,8 @@ function CoverEdit( {
 			toggleSelection( true );
 			setAttributes( { minHeight: newMinHeight } );
 		},
-		showHandle: true,
+		// Hide the resize handle if an aspect ratio is set, as the aspect ratio takes precedence.
+		showHandle: ! attributes.style?.dimensions?.aspectRatio ? true : false,
 		size: resizableBoxDimensions,
 		width,
 	};

package/src/cover/edit/inspector-controls.js

@@ -24,6 +24,7 @@ import {
 	__experimentalColorGradientSettingsDropdown as ColorGradientSettingsDropdown,
 	__experimentalUseGradient,
 	__experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients,
+	privateApis as blockEditorPrivateApis,
 } from '@wordpress/block-editor';
 import { __ } from '@wordpress/i18n';
 
@@ -31,6 +32,9 @@ import { __ } from '@wordpress/i18n';
  * Internal dependencies
  */
 import { COVER_MIN_HEIGHT, mediaPosition } from '../shared';
+import { unlock } from '../../lock-unlock';
+
+const { cleanEmptyObject } = unlock( blockEditorPrivateApis );
 
 function CoverHeightInput( {
 	onChange,
@@ -306,7 +310,16 @@ export default function CoverInspectorControls( {
 						value={ minHeight }
 						unit={ minHeightUnit }
 						onChange={ ( newMinHeight ) =>
-							setAttributes( { minHeight: newMinHeight } )
+							setAttributes( {
+								minHeight: newMinHeight,
+								style: cleanEmptyObject( {
+									...attributes?.style,
+									dimensions: {
+										...attributes?.style?.dimensions,
+										aspectRatio: undefined, // Reset aspect ratio when minHeight is set.
+									},
+								} ),
+							} )
 						}
 						onUnitChange={ ( nextUnit ) =>
 							setAttributes( {

package/src/cover/edit.native.js

@@ -538,6 +538,7 @@ const Cover = ( {
 						<BottomSheetConsumer>
 							{ ( { shouldEnableBottomSheetScroll } ) => (
 								<ColorPalette
+									enableCustomColor={ true }
 									customColorIndicatorStyles={
 										styles.paletteColorIndicator
 									}

package/src/cover/style.scss

@@ -8,10 +8,9 @@
 	align-items: center;
 	padding: 1em;
 	// Prevent the `wp-block-cover__background` span from overflowing the container when border-radius is applied.
-	// `overflow: hidden` is provided as a fallback for browsers that don't support `overflow: clip`.
-	overflow: hidden;
 	// Use clip instead of overflow: hidden so that sticky position works on child elements.
-	overflow: clip;
+	// Use overflow-x instead of overflow so that aspect-ratio allows content to expand the area of the cover block.
+	overflow-x: clip;
 	// This block has customizable padding, border-box makes that more predictable.
 	box-sizing: border-box;
 	// Keep the flex layout direction to the physical direction (LTR) in RTL languages.

package/src/embed/edit.js

@@ -127,16 +127,17 @@ const EmbedEdit = ( props ) => {
 	};
 
 	useEffect( () => {
-		if ( ! preview?.html || ! cannotEmbed || fetching ) {
+		if ( preview?.html || ! cannotEmbed || fetching ) {
 			return;
 		}
+
 		// At this stage, we're not fetching the preview and know it can't be embedded,
 		// so try removing any trailing slash, and resubmit.
 		const newURL = attributesUrl.replace( /\/$/, '' );
 		setURL( newURL );
 		setIsEditingURL( false );
 		setAttributes( { url: newURL } );
-	}, [ preview?.html, attributesUrl, cannotEmbed, fetching ] );
+	}, [ preview?.html, attributesUrl, cannotEmbed, fetching, setAttributes ] );
 
 	// Try a different provider in case the embed url is not supported.
 	useEffect( () => {

package/src/file/block.json

@@ -72,7 +72,6 @@
 		},
 		"interactivity": true
 	},
-	"viewScript": "file:./view.min.js",
 	"editorStyle": "wp-block-file-editor",
 	"style": "wp-block-file"
 }

package/src/file/index.php

@@ -14,35 +14,8 @@
  *
  * @return string Returns the block content.
  */
-function render_block_core_file( $attributes, $content, $block ) {
-	$is_gutenberg_plugin     = defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN;
-	$should_load_view_script = ! empty( $attributes['displayPreview'] );
-	$view_js_file            = 'wp-block-file-view';
-	$script_handles          = $block->block_type->view_script_handles;
-
-	if ( $is_gutenberg_plugin ) {
-		if ( $should_load_view_script ) {
-			gutenberg_enqueue_module( '@wordpress/block-library/file-block' );
-		}
-		// Remove the view script because we are using the module.
-		$block->block_type->view_script_handles = array_diff( $script_handles, array( $view_js_file ) );
-	} else {
-		// If the script already exists, there is no point in removing it from viewScript.
-		if ( ! wp_script_is( $view_js_file ) ) {
-
-			// If the script is not needed, and it is still in the `view_script_handles`, remove it.
-			if ( ! $should_load_view_script && in_array( $view_js_file, $script_handles, true ) ) {
-				$block->block_type->view_script_handles = array_diff( $script_handles, array( $view_js_file ) );
-			}
-			// If the script is needed, but it was previously removed, add it again.
-			if ( $should_load_view_script && ! in_array( $view_js_file, $script_handles, true ) ) {
-				$block->block_type->view_script_handles = array_merge( $script_handles, array( $view_js_file ) );
-			}
-		}
-	}
-
+function render_block_core_file( $attributes, $content ) {
 	// Update object's aria-label attribute if present in block HTML.
-
 	// Match an aria-label attribute from an object tag.
 	$pattern = '@<object.+(?<attribute>aria-label="(?<filename>[^"]+)?")@i';
 	$content = preg_replace_callback(
@@ -63,8 +36,10 @@ function render_block_core_file( $attributes, $content, $block ) {
 		$content
 	);
 
-	// If it uses the Interactivity API, add the directives.
-	if ( $should_load_view_script ) {
+	// If it's interactive, enqueue the script module and add the directives.
+	if ( ! empty( $attributes['displayPreview'] ) ) {
+		wp_enqueue_script_module( '@wordpress/block-library/file' );
+
 		$processor = new WP_HTML_Tag_Processor( $content );
 		$processor->next_tag();
 		$processor->set_attribute( 'data-wp-interactive', '{"namespace":"core/file"}' );
@@ -77,25 +52,6 @@ function render_block_core_file( $attributes, $content, $block ) {
 	return $content;
 }
 
-/**
- * Ensure that the view script has the `wp-interactivity` dependency.
- *
- * @since 6.4.0
- *
- * @global WP_Scripts $wp_scripts
- */
-function block_core_file_ensure_interactivity_dependency() {
-	global $wp_scripts;
-	if (
-		isset( $wp_scripts->registered['wp-block-file-view'] ) &&
-		! in_array( 'wp-interactivity', $wp_scripts->registered['wp-block-file-view']->deps, true )
-	) {
-		$wp_scripts->registered['wp-block-file-view']->deps[] = 'wp-interactivity';
-	}
-}
-
-add_action( 'wp_print_scripts', 'block_core_file_ensure_interactivity_dependency' );
-
 /**
  * Registers the `core/file` block on server.
  */
@@ -107,13 +63,11 @@ function register_block_core_file() {
 		)
 	);
 
-	if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) {
-		gutenberg_register_module(
-			'@wordpress/block-library/file-block',
-			gutenberg_url( '/build/interactivity/file.min.js' ),
-			array( '@wordpress/interactivity' ),
-			defined( 'GUTENBERG_VERSION' ) ? GUTENBERG_VERSION : get_bloginfo( 'version' )
-		);
-	}
+	wp_register_script_module(
+		'@wordpress/block-library/file',
+		defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ? gutenberg_url( '/build/interactivity/file.min.js' ) : includes_url( 'blocks/file/view.min.js' ),
+		array( '@wordpress/interactivity' ),
+		defined( 'GUTENBERG_VERSION' ) ? GUTENBERG_VERSION : get_bloginfo( 'version' )
+	);
 }
 add_action( 'init', 'register_block_core_file' );

package/src/footnotes/edit.js

@@ -14,10 +14,11 @@ export default function FootnotesEdit( { context: { postType, postId } } ) {
 		'meta',
 		postId
 	);
+	const footnotesSupported = 'string' === typeof meta?.footnotes;
 	const footnotes = meta?.footnotes ? JSON.parse( meta.footnotes ) : [];
 	const blockProps = useBlockProps();
 
-	if ( postType !== 'post' && postType !== 'page' ) {
+	if ( ! footnotesSupported ) {
 		return (
 			<div { ...blockProps }>
 				<Placeholder

package/src/footnotes/format.js

@@ -15,6 +15,7 @@ import {
 	privateApis,
 } from '@wordpress/block-editor';
 import { useSelect, useDispatch, useRegistry } from '@wordpress/data';
+import { store as coreDataStore } from '@wordpress/core-data';
 import { createBlock, store as blocksStore } from '@wordpress/blocks';
 
 /**
@@ -38,12 +39,12 @@ export const format = {
 	},
 	interactive: true,
 	contentEditable: false,
-	[ usesContextKey ]: [ 'postType' ],
+	[ usesContextKey ]: [ 'postType', 'postId' ],
 	edit: function Edit( {
 		value,
 		onChange,
 		isObjectActive,
-		context: { postType },
+		context: { postType, postId },
 	} ) {
 		const registry = useRegistry();
 		const {
@@ -53,40 +54,42 @@ export const format = {
 			getBlockName,
 			getBlockParentsByBlockName,
 		} = registry.select( blockEditorStore );
-		const hasFootnotesBlockType = useSelect(
-			( select ) =>
-				!! select( blocksStore ).getBlockType( 'core/footnotes' ),
-			[]
+		const isFootnotesSupported = useSelect(
+			( select ) => {
+				if (
+					! select( blocksStore ).getBlockType( 'core/footnotes' )
+				) {
+					return false;
+				}
+
+				const entityRecord = select( coreDataStore ).getEntityRecord(
+					'postType',
+					postType,
+					postId
+				);
+
+				if ( 'string' !== typeof entityRecord?.meta?.footnotes ) {
+					return false;
+				}
+
+				// Checks if the selected block lives within a pattern.
+				const {
+					getBlockParentsByBlockName: _getBlockParentsByBlockName,
+					getSelectedBlockClientId: _getSelectedBlockClientId,
+				} = select( blockEditorStore );
+				const parentCoreBlocks = _getBlockParentsByBlockName(
+					_getSelectedBlockClientId(),
+					SYNCED_PATTERN_BLOCK_NAME
+				);
+				return ! parentCoreBlocks || parentCoreBlocks.length === 0;
+			},
+			[ postType, postId ]
 		);
-		/*
-		 * This useSelect exists because we need to use its return value
-		 * outside the event callback.
-		 */
-		const isBlockWithinPattern = useSelect( ( select ) => {
-			const {
-				getBlockParentsByBlockName: _getBlockParentsByBlockName,
-				getSelectedBlockClientId: _getSelectedBlockClientId,
-			} = select( blockEditorStore );
-			const parentCoreBlocks = _getBlockParentsByBlockName(
-				_getSelectedBlockClientId(),
-				SYNCED_PATTERN_BLOCK_NAME
-			);
-			return parentCoreBlocks && parentCoreBlocks.length > 0;
-		}, [] );
 
 		const { selectionChange, insertBlock } =
 			useDispatch( blockEditorStore );
 
-		if ( ! hasFootnotesBlockType ) {
-			return null;
-		}
-
-		if ( postType !== 'post' && postType !== 'page' ) {
-			return null;
-		}
-
-		// Checks if the selected block lives within a pattern.
-		if ( isBlockWithinPattern ) {
+		if ( ! isFootnotesSupported ) {
 			return null;
 		}
 

package/src/footnotes/index.php

@@ -68,17 +68,26 @@ function render_block_core_footnotes( $attributes, $content, $block ) {
  * @since 6.3.0
  */
 function register_block_core_footnotes() {
-	foreach ( array( 'post', 'page' ) as $post_type ) {
-		register_post_meta(
-			$post_type,
-			'footnotes',
-			array(
-				'show_in_rest'      => true,
-				'single'            => true,
-				'type'              => 'string',
-				'revisions_enabled' => true,
-			)
-		);
+	$post_types = get_post_types(
+		array(
+			'show_in_rest' => true,
+			'public'       => true,
+		)
+	);
+	foreach ( $post_types as $post_type ) {
+		// Only register the meta field if the post type supports the editor, custom fields, and revisions.
+		if ( post_type_supports( $post_type, 'editor' ) && post_type_supports( $post_type, 'custom-fields' ) && post_type_supports( $post_type, 'revisions' ) ) {
+			register_post_meta(
+				$post_type,
+				'footnotes',
+				array(
+					'show_in_rest'      => true,
+					'single'            => true,
+					'type'              => 'string',
+					'revisions_enabled' => true,
+				)
+			);
+		}
 	}
 	register_block_type_from_metadata(
 		__DIR__ . '/footnotes',

package/src/gallery/index.php

@@ -42,9 +42,6 @@ function block_core_gallery_random_order( $parsed_block ) {
 	if ( 'core/gallery' === $parsed_block['blockName'] && ! empty( $parsed_block['attrs']['randomOrder'] ) ) {
 		shuffle( $parsed_block['innerBlocks'] );
 	}
-
-	return $parsed_block;
-
 	return $parsed_block;
 }
 

package/src/group/block.json

@@ -55,6 +55,7 @@
 			}
 		},
 		"dimensions": {
+			"aspectRatio": true,
 			"minHeight": true
 		},
 		"__experimentalBorder": {

package/src/heading/block.json

@@ -7,6 +7,7 @@
 	"description": "Introduce new sections and organize content to help visitors (and search engines) understand the structure of your content.",
 	"keywords": [ "title", "subtitle" ],
 	"textdomain": "default",
+	"usesContext": [ "pattern/overrides" ],
 	"attributes": {
 		"textAlign": {
 			"type": "string"