@wordpress/block-library 9.30.1-next.6f42e1382.0 → 9.30.1-next.a730c9c8c.0

package/src/image/save.js

@@ -31,6 +31,7 @@ export default function save( { attributes } ) {
 		linkTarget,
 		sizeSlug,
 		title,
+		metadata: { bindings = {} } = {},
 	} = attributes;
 
 	const newRel = ! rel ? undefined : rel;
@@ -70,6 +71,11 @@ export default function save( { attributes } ) {
 		/>
 	);
 
+	const displayCaption =
+		! RichText.isEmpty( caption ) ||
+		bindings.caption ||
+		bindings?.__default?.source === 'core/pattern-overrides';
+
 	const figure = (
 		<>
 			{ href ? (
@@ -84,7 +90,7 @@ export default function save( { attributes } ) {
 			) : (
 				image
 			) }
-			{ ! RichText.isEmpty( caption ) && (
+			{ displayCaption && (
 				<RichText.Content
 					className={ __experimentalGetElementClassName( 'caption' ) }
 					tagName="figcaption"

package/src/navigation/edit/index.js

@@ -112,7 +112,6 @@ function NavigationAddPageButton( { clientId } ) {
 				<ToolbarButton
 					name="add-page"
 					icon={ page }
-					title={ __( 'Add page' ) }
 					onClick={ onAddPage }
 				>
 					{ __( 'Add page' ) }

package/src/post-date/edit.js

@@ -19,6 +19,7 @@ import {
 	InspectorControls,
 	store as blockEditorStore,
 	useBlockProps,
+	useBlockEditingMode,
 	__experimentalDateFormatPicker as DateFormatPicker,
 	__experimentalPublishDateTimePicker as PublishDateTimePicker,
 } from '@wordpress/block-editor';
@@ -99,6 +100,8 @@ export default function PostDateEdit( {
 		[ postTypeSlug ]
 	);
 
+	const blockEditingMode = useBlockEditingMode();
+
 	let postDate = (
 		<time dateTime={ dateI18n( 'c', datetime ) } ref={ setPopoverAnchor }>
 			{ format === 'human-diff'
@@ -120,61 +123,69 @@ export default function PostDateEdit( {
 
 	return (
 		<>
-			<BlockControls group="block">
-				<AlignmentControl
-					value={ textAlign }
-					onChange={ ( nextAlign ) => {
-						setAttributes( { textAlign: nextAlign } );
-					} }
-				/>
-				{ displayType !== 'modified' && ! isDescendentOfQueryLoop && (
-					<ToolbarGroup>
-						<Dropdown
-							popoverProps={ popoverProps }
-							renderContent={ ( { onClose } ) => (
-								<PublishDateTimePicker
-									title={
-										displayType === 'date'
-											? __( 'Publish Date' )
-											: __( 'Date' )
-									}
-									currentDate={ datetime }
-									onChange={ ( newDatetime ) =>
-										setAttributes( {
-											datetime: newDatetime,
-										} )
-									}
-									is12Hour={ is12HourFormat(
-										siteTimeFormat
+			{ ( blockEditingMode === 'default' ||
+				! isDescendentOfQueryLoop ) && (
+				<BlockControls group="block">
+					<AlignmentControl
+						value={ textAlign }
+						onChange={ ( nextAlign ) => {
+							setAttributes( { textAlign: nextAlign } );
+						} }
+					/>
+
+					{ displayType !== 'modified' &&
+						! isDescendentOfQueryLoop && (
+							<ToolbarGroup>
+								<Dropdown
+									popoverProps={ popoverProps }
+									renderContent={ ( { onClose } ) => (
+										<PublishDateTimePicker
+											title={
+												displayType === 'date'
+													? __( 'Publish Date' )
+													: __( 'Date' )
+											}
+											currentDate={ datetime }
+											onChange={ ( newDatetime ) =>
+												setAttributes( {
+													datetime: newDatetime,
+												} )
+											}
+											is12Hour={ is12HourFormat(
+												siteTimeFormat
+											) }
+											onClose={ onClose }
+											dateOrder={
+												/* translators: Order of day, month, and year. Available formats are 'dmy', 'mdy', and 'ymd'. */
+												_x( 'dmy', 'date order' )
+											}
+										/>
 									) }
-									onClose={ onClose }
-									dateOrder={
-										/* translators: Order of day, month, and year. Available formats are 'dmy', 'mdy', and 'ymd'. */
-										_x( 'dmy', 'date order' )
-									}
+									renderToggle={ ( { isOpen, onToggle } ) => {
+										const openOnArrowDown = ( event ) => {
+											if (
+												! isOpen &&
+												event.keyCode === DOWN
+											) {
+												event.preventDefault();
+												onToggle();
+											}
+										};
+										return (
+											<ToolbarButton
+												aria-expanded={ isOpen }
+												icon={ edit }
+												title={ __( 'Change Date' ) }
+												onClick={ onToggle }
+												onKeyDown={ openOnArrowDown }
+											/>
+										);
+									} }
 								/>
-							) }
-							renderToggle={ ( { isOpen, onToggle } ) => {
-								const openOnArrowDown = ( event ) => {
-									if ( ! isOpen && event.keyCode === DOWN ) {
-										event.preventDefault();
-										onToggle();
-									}
-								};
-								return (
-									<ToolbarButton
-										aria-expanded={ isOpen }
-										icon={ edit }
-										title={ __( 'Change Date' ) }
-										onClick={ onToggle }
-										onKeyDown={ openOnArrowDown }
-									/>
-								);
-							} }
-						/>
-					</ToolbarGroup>
-				) }
-			</BlockControls>
+							</ToolbarGroup>
+						) }
+				</BlockControls>
+			) }
 
 			<InspectorControls>
 				<ToolsPanel

package/src/post-date/index.php

@@ -105,18 +105,5 @@ function register_block_core_post_date() {
 			'render_callback' => 'render_block_core_post_date',
 		)
 	);
-
-	// The following filter can be removed once the minimum required WordPress version is 6.9 or newer.
-	add_filter(
-		'block_bindings_supported_attributes_core/post-date',
-		function ( $attributes ) {
-			if ( ! in_array( 'datetime', $attributes, true ) ) {
-				$attributes[] = 'datetime';
-			}
-			return $attributes;
-		},
-		10,
-		3
-	);
 }
 add_action( 'init', 'register_block_core_post_date' );

package/src/post-featured-image/edit.js

@@ -15,6 +15,7 @@ import {
 	Button,
 	Spinner,
 	TextControl,
+	ExternalLink,
 	__experimentalToolsPanel as ToolsPanel,
 	__experimentalToolsPanelItem as ToolsPanelItem,
 } from '@wordpress/components';
@@ -30,7 +31,12 @@ import {
 	privateApis as blockEditorPrivateApis,
 	store as blockEditorStore,
 } from '@wordpress/block-editor';
-import { useMemo, useEffect, useState } from '@wordpress/element';
+import {
+	useMemo,
+	useEffect,
+	useState,
+	createInterpolateElement,
+} from '@wordpress/element';
 import { __, sprintf } from '@wordpress/i18n';
 import { upload } from '@wordpress/icons';
 import { store as noticesStore } from '@wordpress/notices';
@@ -316,7 +322,7 @@ export default function PostFeaturedImageEdit( {
 						) }
 						{ isLink && (
 							<ToolsPanelItem
-								label={ __( 'Link rel' ) }
+								label={ __( 'Link relation' ) }
 								isShownByDefault
 								hasValue={ () => !! rel }
 								onDeselect={ () =>
@@ -328,7 +334,17 @@ export default function PostFeaturedImageEdit( {
 								<TextControl
 									__next40pxDefaultSize
 									__nextHasNoMarginBottom
-									label={ __( 'Link rel' ) }
+									label={ __( 'Link relation' ) }
+									help={ createInterpolateElement(
+										__(
+											'The <a>Link Relation</a> attribute defines the relationship between a linked resource and the current document.'
+										),
+										{
+											a: (
+												<ExternalLink href="https://developer.mozilla.org/docs/Web/HTML/Attributes/rel" />
+											),
+										}
+									) }
 									value={ rel }
 									onChange={ ( newRel ) =>
 										setAttributes( { rel: newRel } )

package/src/post-title/edit.js

@@ -18,6 +18,7 @@ import {
 import {
 	ToggleControl,
 	TextControl,
+	ExternalLink,
 	__experimentalToolsPanel as ToolsPanel,
 	__experimentalToolsPanelItem as ToolsPanelItem,
 } from '@wordpress/components';
@@ -25,6 +26,7 @@ import { __ } from '@wordpress/i18n';
 import { createBlock, getDefaultBlockName } from '@wordpress/blocks';
 import { useEntityProp, store as coreStore } from '@wordpress/core-data';
 import { useSelect } from '@wordpress/data';
+import { createInterpolateElement } from '@wordpress/element';
 
 /**
  * Internal dependencies
@@ -205,7 +207,7 @@ export default function PostTitleEdit( {
 										/>
 									</ToolsPanelItem>
 									<ToolsPanelItem
-										label={ __( 'Link rel' ) }
+										label={ __( 'Link relation' ) }
 										isShownByDefault
 										hasValue={ () => !! rel }
 										onDeselect={ () =>
@@ -215,7 +217,17 @@ export default function PostTitleEdit( {
 										<TextControl
 											__next40pxDefaultSize
 											__nextHasNoMarginBottom
-											label={ __( 'Link rel' ) }
+											label={ __( 'Link relation' ) }
+											help={ createInterpolateElement(
+												__(
+													'The <a>Link Relation</a> attribute defines the relationship between a linked resource and the current document.'
+												),
+												{
+													a: (
+														<ExternalLink href="https://developer.mozilla.org/docs/Web/HTML/Attributes/rel" />
+													),
+												}
+											) }
 											value={ rel }
 											onChange={ ( newRel ) =>
 												setAttributes( { rel: newRel } )

package/src/query/block.json

@@ -53,7 +53,8 @@
 		"align": [ "wide", "full" ],
 		"html": false,
 		"layout": true,
-		"interactivity": true
+		"interactivity": true,
+		"contentRole": true
 	},
 	"editorStyle": "wp-block-query-editor"
 }

package/src/query/edit/pattern-selection.js

@@ -43,7 +43,16 @@ export function useBlockPatterns( clientId, attributes ) {
 		clientId,
 		attributes
 	);
-	return usePatterns( clientId, blockNameForPatterns );
+	const allPatterns = usePatterns( clientId, blockNameForPatterns );
+	// Filter out any patterns that don't have Query as their root block
+	// so that a Query block is always replaced by another Query block.
+	const rootBlockPatterns = useMemo( () => {
+		return allPatterns.filter( ( pattern ) => {
+			return pattern.blocks?.[ 0 ]?.name === blockNameForPatterns;
+		} );
+	}, [ allPatterns, blockNameForPatterns ] );
+
+	return rootBlockPatterns;
 }
 
 export default function PatternSelection( {

package/src/rss/edit.js

@@ -14,11 +14,12 @@ import {
 	ToggleControl,
 	ToolbarGroup,
 	TextControl,
+	ExternalLink,
 	__experimentalInputControl as InputControl,
 	__experimentalToolsPanel as ToolsPanel,
 	__experimentalToolsPanelItem as ToolsPanelItem,
 } from '@wordpress/components';
-import { useState } from '@wordpress/element';
+import { createInterpolateElement, useState } from '@wordpress/element';
 import { grid, list, edit, rss } from '@wordpress/icons';
 import { __, _x } from '@wordpress/i18n';
 import { prependHTTP } from '@wordpress/url';
@@ -301,7 +302,17 @@ export default function RSSEdit( { attributes, setAttributes } ) {
 				<TextControl
 					__next40pxDefaultSize
 					__nextHasNoMarginBottom
-					label={ __( 'Link rel' ) }
+					label={ __( 'Link relation' ) }
+					help={ createInterpolateElement(
+						__(
+							'The <a>Link Relation</a> attribute defines the relationship between a linked resource and the current document.'
+						),
+						{
+							a: (
+								<ExternalLink href="https://developer.mozilla.org/docs/Web/HTML/Attributes/rel" />
+							),
+						}
+					) }
 					value={ rel || '' }
 					onChange={ ( value ) => setAttributes( { rel: value } ) }
 				/>

package/src/site-tagline/block.json

@@ -36,6 +36,7 @@
 				"text": true
 			}
 		},
+		"contentRole": true,
 		"spacing": {
 			"margin": true,
 			"padding": true,

package/src/social-link/edit.js

@@ -17,13 +17,14 @@ import {
 	useBlockProps,
 	store as blockEditorStore,
 } from '@wordpress/block-editor';
-import { useState, useRef } from '@wordpress/element';
+import { useState, useRef, createInterpolateElement } from '@wordpress/element';
 import {
 	Icon,
 	Button,
 	Dropdown,
 	TextControl,
 	ToolbarButton,
+	ExternalLink,
 	__experimentalToolsPanel as ToolsPanel,
 	__experimentalToolsPanelItem as ToolsPanelItem,
 	__experimentalInputControlSuffixWrapper as InputControlSuffixWrapper,
@@ -243,7 +244,17 @@ const SocialLinkEdit = ( {
 				<TextControl
 					__next40pxDefaultSize
 					__nextHasNoMarginBottom
-					label={ __( 'Link rel' ) }
+					label={ __( 'Link relation' ) }
+					help={ createInterpolateElement(
+						__(
+							'The <a>Link Relation</a> attribute defines the relationship between a linked resource and the current document.'
+						),
+						{
+							a: (
+								<ExternalLink href="https://developer.mozilla.org/docs/Web/HTML/Attributes/rel" />
+							),
+						}
+					) }
 					value={ rel || '' }
 					onChange={ ( value ) => setAttributes( { rel: value } ) }
 				/>

package/src/spacer/edit.js

@@ -12,6 +12,7 @@ import {
 	getSpacingPresetCssVar,
 	store as blockEditorStore,
 	privateApis as blockEditorPrivateApis,
+	useBlockEditingMode,
 } from '@wordpress/block-editor';
 import { ResizableBox } from '@wordpress/components';
 import { useState, useEffect } from '@wordpress/element';
@@ -346,6 +347,8 @@ const SpacerEdit = ( {
 		__unstableMarkNextChangeAsNotPersistent,
 	] );
 
+	const blockEditingMode = useBlockEditingMode();
+
 	return (
 		<>
 			<View
@@ -356,7 +359,8 @@ const SpacerEdit = ( {
 					} ),
 				} ) }
 			>
-				{ resizableBoxWithOrientation( inheritedOrientation ) }
+				{ blockEditingMode === 'default' &&
+					resizableBoxWithOrientation( inheritedOrientation ) }
 			</View>
 			{ ! isFlexLayout && (
 				<SpacerControls

package/src/terms-query/inspector-controls.js

@@ -89,28 +89,14 @@ export default function TermsQueryInspectorControls( {
 					</ToolsPanelItem>
 
 					<ToolsPanelItem
-						hasValue={ () => termQuery.order !== 'asc' }
-						label={ __( 'Order' ) }
-						onDeselect={ () => setQuery( { order: 'asc' } ) }
-						isShownByDefault
-					>
-						<SelectControl
-							__nextHasNoMarginBottom
-							__next40pxDefaultSize
-							label={ __( 'Order' ) }
-							options={ [
-								{ label: __( 'Ascending' ), value: 'asc' },
-								{ label: __( 'Descending' ), value: 'desc' },
-							] }
-							value={ termQuery.order }
-							onChange={ ( order ) => setQuery( { order } ) }
-						/>
-					</ToolsPanelItem>
-
-					<ToolsPanelItem
-						hasValue={ () => termQuery.orderBy !== 'name' }
+						hasValue={ () =>
+							termQuery.orderBy !== 'name' ||
+							termQuery.order !== 'asc'
+						}
 						label={ __( 'Order by' ) }
-						onDeselect={ () => setQuery( { orderBy: 'name' } ) }
+						onDeselect={ () =>
+							setQuery( { orderBy: 'name', order: 'asc' } )
+						}
 						isShownByDefault
 					>
 						<SelectControl
@@ -118,12 +104,32 @@ export default function TermsQueryInspectorControls( {
 							__next40pxDefaultSize
 							label={ __( 'Order by' ) }
 							options={ [
-								{ label: __( 'Name' ), value: 'name' },
-								{ label: __( 'Slug' ), value: 'slug' },
-								{ label: __( 'Count' ), value: 'count' },
+								{
+									label: __( 'Name: A → Z' ),
+									value: 'name/asc',
+								},
+								{
+									label: __( 'Name: Z → A' ),
+									value: 'name/desc',
+								},
+								{
+									label: __( 'Count, high to low' ),
+									value: 'count/desc',
+								},
+								{
+									label: __( 'Count, low to high' ),
+									value: 'count/asc',
+								},
 							] }
-							value={ termQuery.orderBy }
-							onChange={ ( orderBy ) => setQuery( { orderBy } ) }
+							value={ termQuery.orderBy + '/' + termQuery.order }
+							onChange={ ( orderBy ) => {
+								const [ newOrderBy, newOrder ] =
+									orderBy.split( '/' );
+								setQuery( {
+									orderBy: newOrderBy,
+									order: newOrder,
+								} );
+							} }
 						/>
 					</ToolsPanelItem>
 

package/src/utils/hooks.js

@@ -66,6 +66,10 @@ export function useUploadMediaFromBlobURL( args = {} ) {
 		const { url, allowedTypes, onChange, onError } = latestArgsRef.current;
 		const { mediaUpload } = getSettings();
 
+		if ( ! mediaUpload ) {
+			return;
+		}
+
 		hasUploadStartedRef.current = true;
 
 		mediaUpload( {