@wordpress/block-library 8.12.0 → 8.12.2

package/src/query/deprecated.js

@@ -12,7 +12,7 @@ import {
 /**
  * Internal dependencies
  */
-import { unlock } from '../private-apis';
+import { unlock } from '../lock-unlock';
 
 const { cleanEmptyObject } = unlock( blockEditorPrivateApis );
 
@@ -143,6 +143,8 @@ const migrateToConstrainedLayout = ( attributes ) => {
 			},
 		};
 	}
+
+	return attributes;
 };
 
 const findPostTemplateBlock = ( innerBlocks = [] ) => {
@@ -294,7 +296,7 @@ const v2 = {
 			gradients: true,
 			link: true,
 		},
-		__experimentalLayout: true,
+		layout: true,
 	},
 	isEligible: ( { query: { categoryIds, tagIds } = {} } ) =>
 		categoryIds || tagIds,
@@ -367,7 +369,7 @@ const v3 = {
 				text: true,
 			},
 		},
-		__experimentalLayout: true,
+		layout: true,
 	},
 	isEligible( attributes ) {
 		const { style, backgroundColor, gradient, textColor } = attributes;
@@ -446,7 +448,7 @@ const v4 = {
 				text: true,
 			},
 		},
-		__experimentalLayout: true,
+		layout: true,
 	},
 	save( { attributes: { tagName: Tag = 'div' } } ) {
 		const blockProps = useBlockProps.save();
@@ -507,7 +509,7 @@ const v5 = {
 		align: [ 'wide', 'full' ],
 		anchor: true,
 		html: false,
-		__experimentalLayout: true,
+		layout: true,
 	},
 	save( { attributes: { tagName: Tag = 'div' } } ) {
 		const blockProps = useBlockProps.save();

package/src/query/edit/inspector-controls/index.js

@@ -28,7 +28,7 @@ import ParentControl from './parent-control';
 import { TaxonomyControls } from './taxonomy-controls';
 import StickyControl from './sticky-control';
 import CreateNewPostLink from './create-new-post-link';
-import { unlock } from '../../../private-apis';
+import { unlock } from '../../../lock-unlock';
 import {
 	usePostTypes,
 	useIsPostTypeHierarchical,

package/src/query/edit/query-content.js

@@ -13,6 +13,7 @@ import {
 } from '@wordpress/block-editor';
 import { SelectControl } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
+import { store as coreStore } from '@wordpress/core-data';
 
 /**
  * Internal dependencies
@@ -35,6 +36,7 @@ export default function QueryContent( {
 		query,
 		displayLayout,
 		tagName: TagName = 'div',
+		query: { inherit } = {},
 	} = attributes;
 	const { __unstableMarkNextChangeAsNotPersistent } =
 		useDispatch( blockEditorStore );
@@ -45,9 +47,12 @@ export default function QueryContent( {
 	} );
 	const { postsPerPage } = useSelect( ( select ) => {
 		const { getSettings } = select( blockEditorStore );
+		const { getEntityRecord, canUser } = select( coreStore );
+		const settingPerPage = canUser( 'read', 'settings' )
+			? +getEntityRecord( 'root', 'site' )?.posts_per_page
+			: +getSettings().postsPerPage;
 		return {
-			postsPerPage:
-				+getSettings().postsPerPage || DEFAULTS_POSTS_PER_PAGE,
+			postsPerPage: settingPerPage || DEFAULTS_POSTS_PER_PAGE,
 		};
 	}, [] );
 	// There are some effects running where some initialization logic is
@@ -61,14 +66,18 @@ export default function QueryContent( {
 	// would cause to override previous wanted changes.
 	useEffect( () => {
 		const newQuery = {};
-		if ( ! query.perPage && postsPerPage ) {
+		// When we inherit from global query always need to set the `perPage`
+		// based on the reading settings.
+		if ( inherit && query.perPage !== postsPerPage ) {
+			newQuery.perPage = postsPerPage;
+		} else if ( ! query.perPage && postsPerPage ) {
 			newQuery.perPage = postsPerPage;
 		}
 		if ( !! Object.keys( newQuery ).length ) {
 			__unstableMarkNextChangeAsNotPersistent();
 			updateQuery( newQuery );
 		}
-	}, [ query.perPage ] );
+	}, [ query.perPage, postsPerPage, inherit ] );
 	// We need this for multi-query block pagination.
 	// Query parameters for each block are scoped to their ID.
 	useEffect( () => {

package/src/query-no-results/block.json

@@ -9,7 +9,6 @@
 	"textdomain": "default",
 	"usesContext": [ "queryId", "query" ],
 	"supports": {
-		"anchor": true,
 		"align": true,
 		"reusable": false,
 		"html": false,

package/src/query-pagination/block.json

@@ -23,7 +23,6 @@
 		"showLabel": "showLabel"
 	},
 	"supports": {
-		"anchor": true,
 		"align": true,
 		"reusable": false,
 		"html": false,
@@ -36,7 +35,7 @@
 				"link": true
 			}
 		},
-		"__experimentalLayout": {
+		"layout": {
 			"allowSwitching": false,
 			"allowInheriting": false,
 			"default": {

package/src/query-pagination-next/block.json

@@ -14,7 +14,6 @@
 	},
 	"usesContext": [ "queryId", "query", "paginationArrow", "showLabel" ],
 	"supports": {
-		"anchor": true,
 		"reusable": false,
 		"html": false,
 		"color": {

package/src/query-pagination-numbers/block.json

@@ -9,7 +9,6 @@
 	"textdomain": "default",
 	"usesContext": [ "queryId", "query" ],
 	"supports": {
-		"anchor": true,
 		"reusable": false,
 		"html": false,
 		"color": {
@@ -33,5 +32,5 @@
 			}
 		}
 	},
-	"editorStyle": "query-pagination-numbers-editor"
+	"editorStyle": "wp-block-query-pagination-numbers-editor"
 }

package/src/query-pagination-previous/block.json

@@ -14,7 +14,6 @@
 	},
 	"usesContext": [ "queryId", "query", "paginationArrow", "showLabel" ],
 	"supports": {
-		"anchor": true,
 		"reusable": false,
 		"html": false,
 		"color": {

package/src/query-title/block.json

@@ -27,7 +27,6 @@
 		}
 	},
 	"supports": {
-		"anchor": true,
 		"align": [ "wide", "full" ],
 		"html": false,
 		"color": {

package/src/query-title/edit.js

@@ -12,15 +12,11 @@ import {
 	InspectorControls,
 	useBlockProps,
 	Warning,
+	HeadingLevelDropdown,
 } from '@wordpress/block-editor';
 import { ToggleControl, PanelBody } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 
-/**
- * Internal dependencies
- */
-import HeadingLevelDropdown from '../heading/heading-level-dropdown';
-
 const SUPPORTED_TYPES = [ 'archive', 'search' ];
 
 export default function QueryTitleEdit( {
@@ -98,7 +94,7 @@ export default function QueryTitleEdit( {
 		<>
 			<BlockControls group="block">
 				<HeadingLevelDropdown
-					selectedLevel={ level }
+					value={ level }
 					onChange={ ( newLevel ) =>
 						setAttributes( { level: newLevel } )
 					}

package/src/read-more/block.json

@@ -17,7 +17,6 @@
 	},
 	"usesContext": [ "postId" ],
 	"supports": {
-		"anchor": true,
 		"html": false,
 		"color": {
 			"gradients": true,

package/src/rss/block.json

@@ -43,7 +43,6 @@
 	},
 	"supports": {
 		"align": true,
-		"anchor": true,
 		"html": false
 	},
 	"editorStyle": "wp-block-rss-editor",

package/src/search/block.json

@@ -54,7 +54,6 @@
 	},
 	"supports": {
 		"align": [ "left", "center", "right" ],
-		"anchor": true,
 		"color": {
 			"gradients": true,
 			"__experimentalSkipSerialization": true,

package/src/search/edit.js

@@ -226,7 +226,7 @@ export default function SearchEdit( {
 		},
 		{
 			role: 'menuitemradio',
-			title: __( 'Button Only' ),
+			title: __( 'Button only' ),
 			isActive: buttonPosition === 'button-only',
 			icon: buttonOnly,
 			onClick: () => {
@@ -440,8 +440,8 @@ export default function SearchEdit( {
 										key={ widthValue }
 										isSmall
 										variant={
-											`${ widthValue }%` ===
-											`${ width }${ widthUnit }`
+											widthValue === width &&
+											widthUnit === '%'
 												? 'primary'
 												: undefined
 										}

package/src/site-logo/block.json

@@ -31,7 +31,6 @@
 	},
 	"supports": {
 		"html": false,
-		"anchor": true,
 		"align": true,
 		"alignWide": false,
 		"color": {

package/src/site-tagline/block.json

@@ -14,7 +14,6 @@
 	},
 	"example": {},
 	"supports": {
-		"anchor": true,
 		"align": [ "wide", "full" ],
 		"html": false,
 		"color": {

package/src/site-tagline/icon.js

@@ -5,7 +5,6 @@ import { SVG, Path } from '@wordpress/components';
 
 export default (
 	<SVG xmlns="http://www.w3.org/2000/svg" width="24" height="24">
-		<Path fill="none" d="M0 0h24v24H0z" />
-		<Path d="M4 9h16v2H4V9zm0 4h10v2H4v-2z" />
+		<Path d="M4 10.5h16V9H4v1.5ZM4 15h9v-1.5H4V15Z" />
 	</SVG>
 );

package/src/site-title/block.json

@@ -27,7 +27,6 @@
 		"viewportWidth": 500
 	},
 	"supports": {
-		"anchor": true,
 		"align": [ "wide", "full" ],
 		"html": false,
 		"color": {

package/src/site-title/edit/index.js

@@ -15,15 +15,13 @@ import {
 	InspectorControls,
 	BlockControls,
 	useBlockProps,
+	HeadingLevelDropdown,
 } from '@wordpress/block-editor';
 import { ToggleControl, PanelBody } from '@wordpress/components';
 import { createBlock, getDefaultBlockName } from '@wordpress/blocks';
 import { decodeEntities } from '@wordpress/html-entities';
 
-/**
- * Internal dependencies
- */
-import LevelControl from './level-toolbar';
+const HEADING_LEVELS = [ 0, 1, 2, 3, 4, 5, 6 ];
 
 export default function SiteTitleEdit( {
 	attributes,
@@ -95,8 +93,9 @@ export default function SiteTitleEdit( {
 	return (
 		<>
 			<BlockControls group="block">
-				<LevelControl
-					level={ level }
+				<HeadingLevelDropdown
+					options={ HEADING_LEVELS }
+					value={ level }
 					onChange={ ( newLevel ) =>
 						setAttributes( { level: newLevel } )
 					}

package/src/social-link/block.json

@@ -30,7 +30,6 @@
 		"iconBackgroundColorValue"
 	],
 	"supports": {
-		"anchor": true,
 		"reusable": false,
 		"html": false
 	},

package/src/social-links/block.json

@@ -50,7 +50,7 @@
 		"align": [ "left", "center", "right" ],
 		"anchor": true,
 		"__experimentalExposeControlsToChildren": true,
-		"__experimentalLayout": {
+		"layout": {
 			"allowSwitching": false,
 			"allowInheriting": false,
 			"allowVerticalAlignment": false,

package/src/spacer/save.js

@@ -3,12 +3,17 @@
  */
 import { useBlockProps, getSpacingPresetCssVar } from '@wordpress/block-editor';
 
-export default function save( { attributes: { height, width } } ) {
+export default function save( { attributes } ) {
+	const { height, width, style } = attributes;
+	const { layout: { selfStretch } = {} } = style || {};
+	// If selfStretch is set to 'fill' or 'fit', don't set default height.
+	const finalHeight =
+		selfStretch === 'fill' || selfStretch === 'fit' ? undefined : height;
 	return (
 		<div
 			{ ...useBlockProps.save( {
 				style: {
-					height: getSpacingPresetCssVar( height ),
+					height: getSpacingPresetCssVar( finalHeight ),
 					width: getSpacingPresetCssVar( width ),
 				},
 				'aria-hidden': true,

package/src/spacer/test/index.native.js

@@ -5,7 +5,7 @@ import {
 	fireEvent,
 	getEditorHtml,
 	initializeEditor,
-	waitFor,
+	waitForModalVisible,
 } from 'test/helpers';
 
 /**
@@ -65,13 +65,14 @@ describe( 'Spacer block', () => {
 
 		// Open block settings
 		fireEvent.press( screen.getByLabelText( 'Open Settings' ) );
-		await waitFor(
-			() => screen.getByTestId( 'block-settings-modal' ).props.isVisible
-		);
+		const blockSettingsModal = screen.getByTestId( 'block-settings-modal' );
+		await waitForModalVisible( blockSettingsModal );
 
 		// Update height attribute
-		fireEvent.press( screen.getByText( '100' ) );
-		const heightTextInput = screen.getByDisplayValue( '100' );
+		fireEvent.press( screen.getByText( '100', { hidden: true } ) );
+		const heightTextInput = screen.getByDisplayValue( '100', {
+			hidden: true,
+		} );
 		fireEvent.changeText( heightTextInput, '50' );
 
 		expect( getEditorHtml() ).toMatchSnapshot();
@@ -92,17 +93,20 @@ describe( 'Spacer block', () => {
 
 		// Open block settings
 		fireEvent.press( screen.getByLabelText( 'Open Settings' ) );
-		await waitFor(
-			() => screen.getByTestId( 'block-settings-modal' ).props.isVisible
-		);
+		const blockSettingsModal = screen.getByTestId( 'block-settings-modal' );
+		await waitForModalVisible( blockSettingsModal );
 
 		// Set vh unit
-		fireEvent.press( screen.getByText( 'px' ) );
-		fireEvent.press( screen.getByText( 'Viewport height (vh)' ) );
+		fireEvent.press( screen.getByText( 'px', { hidden: true } ) );
+		fireEvent.press(
+			screen.getByText( 'Viewport height (vh)', { hidden: true } )
+		);
 
 		// Update height attribute
-		fireEvent.press( screen.getByText( '100' ) );
-		const heightTextInput = screen.getByDisplayValue( '100' );
+		fireEvent.press( screen.getByText( '100', { hidden: true } ) );
+		const heightTextInput = screen.getByDisplayValue( '100', {
+			hidden: true,
+		} );
 		fireEvent.changeText( heightTextInput, '25' );
 
 		expect( getEditorHtml() ).toMatchSnapshot();
@@ -123,9 +127,8 @@ describe( 'Spacer block', () => {
 
 		// Open block settings
 		fireEvent.press( screen.getByLabelText( 'Open Settings' ) );
-		await waitFor(
-			() => screen.getByTestId( 'block-settings-modal' ).props.isVisible
-		);
+		const blockSettingsModal = screen.getByTestId( 'block-settings-modal' );
+		await waitForModalVisible( blockSettingsModal );
 
 		// Increment height
 		fireEvent(
@@ -154,9 +157,8 @@ describe( 'Spacer block', () => {
 
 		// Open block settings
 		fireEvent.press( screen.getByLabelText( 'Open Settings' ) );
-		await waitFor(
-			() => screen.getByTestId( 'block-settings-modal' ).props.isVisible
-		);
+		const blockSettingsModal = screen.getByTestId( 'block-settings-modal' );
+		await waitForModalVisible( blockSettingsModal );
 
 		// Increment height
 		fireEvent(
@@ -212,13 +214,14 @@ describe( 'Spacer block', () => {
 
 		// Open block settings
 		fireEvent.press( screen.getByLabelText( 'Open Settings' ) );
-		await waitFor(
-			() => screen.getByTestId( 'block-settings-modal' ).props.isVisible
-		);
+		const blockSettingsModal = screen.getByTestId( 'block-settings-modal' );
+		await waitForModalVisible( blockSettingsModal );
 
 		// Update height attribute
-		fireEvent.press( screen.getByText( '60' ) );
-		const heightTextInput = screen.getByDisplayValue( '60' );
+		fireEvent.press( screen.getByText( '60', { hidden: true } ) );
+		const heightTextInput = screen.getByDisplayValue( '60', {
+			hidden: true,
+		} );
 		fireEvent.changeText( heightTextInput, '70' );
 
 		expect( getEditorHtml() ).toMatchSnapshot();
@@ -239,13 +242,14 @@ describe( 'Spacer block', () => {
 
 		// Open block settings
 		fireEvent.press( screen.getByLabelText( 'Open Settings' ) );
-		await waitFor(
-			() => screen.getByTestId( 'block-settings-modal' ).props.isVisible
-		);
+		const blockSettingsModal = screen.getByTestId( 'block-settings-modal' );
+		await waitForModalVisible( blockSettingsModal );
 
 		// Update height attribute
-		fireEvent.press( screen.getByText( '100' ) );
-		const heightTextInput = screen.getByDisplayValue( '100' );
+		fireEvent.press( screen.getByText( '100', { hidden: true } ) );
+		const heightTextInput = screen.getByDisplayValue( '100', {
+			hidden: true,
+		} );
 		fireEvent.changeText( heightTextInput, '120' );
 
 		expect( getEditorHtml() ).toMatchSnapshot();

package/src/style.scss

@@ -55,5 +55,6 @@
 @import "./text-columns/style.scss";
 @import "./verse/style.scss";
 @import "./video/style.scss";
+@import "./footnotes/style.scss";
 
 @import "common.scss";

package/src/tag-cloud/block.json

@@ -36,7 +36,6 @@
 	],
 	"supports": {
 		"html": false,
-		"anchor": true,
 		"align": true,
 		"spacing": {
 			"margin": true,

package/src/template-part/block.json

@@ -21,7 +21,6 @@
 		}
 	},
 	"supports": {
-		"anchor": true,
 		"align": true,
 		"html": false,
 		"reusable": false

package/src/template-part/edit/inner-blocks.js

@@ -37,7 +37,7 @@ export default function TemplatePartInnerBlocks( {
 		renderAppender: hasInnerBlocks
 			? undefined
 			: InnerBlocks.ButtonBlockAppender,
-		__experimentalLayout: themeSupportsLayout ? usedLayout : undefined,
+		layout: themeSupportsLayout ? usedLayout : undefined,
 	} );
 
 	return <TagName { ...innerBlocksProps } />;

package/src/template-part/index.php

@@ -18,11 +18,12 @@ function render_block_core_template_part( $attributes ) {
 	$template_part_id = null;
 	$content          = null;
 	$area             = WP_TEMPLATE_PART_AREA_UNCATEGORIZED;
+	$stylesheet       = get_stylesheet();
 
 	if (
 		isset( $attributes['slug'] ) &&
 		isset( $attributes['theme'] ) &&
-		get_stylesheet() === $attributes['theme']
+		$stylesheet === $attributes['theme']
 	) {
 		$template_part_id    = $attributes['theme'] . '//' . $attributes['slug'];
 		$template_part_query = new WP_Query(
@@ -65,16 +66,22 @@ function render_block_core_template_part( $attributes ) {
 		} else {
 			// Else, if the template part was provided by the active theme,
 			// render the corresponding file content.
-			$parent_theme_folders        = get_block_theme_folders( get_template() );
-			$child_theme_folders         = get_block_theme_folders( get_stylesheet() );
-			$child_theme_part_file_path  = get_theme_file_path( '/' . $child_theme_folders['wp_template_part'] . '/' . $attributes['slug'] . '.html' );
-			$parent_theme_part_file_path = get_theme_file_path( '/' . $parent_theme_folders['wp_template_part'] . '/' . $attributes['slug'] . '.html' );
-			$template_part_file_path     = 0 === validate_file( $attributes['slug'] ) && file_exists( $child_theme_part_file_path ) ? $child_theme_part_file_path : $parent_theme_part_file_path;
-			if ( 0 === validate_file( $attributes['slug'] ) && file_exists( $template_part_file_path ) ) {
-				$content = file_get_contents( $template_part_file_path );
-				$content = is_string( $content ) && '' !== $content
-						? _inject_theme_attribute_in_block_template_content( $content )
-						: '';
+			if ( 0 === validate_file( $attributes['slug'] ) ) {
+				$themes   = array( $stylesheet );
+				$template = get_template();
+				if ( $stylesheet !== $template ) {
+					$themes[] = $template;
+				}
+
+				foreach ( $themes as $theme ) {
+					$theme_folders           = get_block_theme_folders( $theme );
+					$template_part_file_path = get_theme_file_path( '/' . $theme_folders['wp_template_part'] . '/' . $attributes['slug'] . '.html' );
+					if ( file_exists( $template_part_file_path ) ) {
+						$content = (string) file_get_contents( $template_part_file_path );
+						$content = '' !== $content ? _inject_theme_attribute_in_block_template_content( $content ) : '';
+						break;
+					}
+				}
 			}
 
 			if ( '' !== $content && null !== $content ) {

package/src/term-description/block.json

@@ -12,7 +12,6 @@
 		}
 	},
 	"supports": {
-		"anchor": true,
 		"align": [ "wide", "full" ],
 		"html": false,
 		"color": {

package/src/utils/interactivity/index.js

@@ -12,6 +12,4 @@ registerDirectives();
 
 document.addEventListener( 'DOMContentLoaded', async () => {
 	await init();
-	// eslint-disable-next-line no-console
-	console.log( 'Interactivity API started' );
 } );

package/src/utils/migrate-font-family.js

@@ -6,7 +6,7 @@ import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
 /**
  * Internal dependencies
  */
-import { unlock } from '../private-apis';
+import { unlock } from '../lock-unlock';
 
 const { cleanEmptyObject } = unlock( blockEditorPrivateApis );