@wordpress/block-library 8.3.5 → 8.3.7

package/src/navigation-submenu/index.php

@@ -9,18 +9,17 @@
  * Build an array with CSS classes and inline styles defining the colors
  * which will be applied to the navigation markup in the front-end.
  *
- * @param  array $context    Navigation block context.
- * @param  array $attributes Block attributes.
+ * @param  array $context     Navigation block context.
+ * @param  array $attributes  Block attributes.
+ * @param  bool  $is_sub_menu Whether the block is a sub-menu.
  * @return array Colors CSS classes and inline styles.
  */
-function block_core_navigation_submenu_build_css_colors( $context, $attributes ) {
+function block_core_navigation_submenu_build_css_colors( $context, $attributes, $is_sub_menu = false ) {
 	$colors = array(
 		'css_classes'   => array(),
 		'inline_styles' => '',
 	);
 
-	$is_sub_menu = isset( $attributes['isTopLevelItem'] ) ? ( ! $attributes['isTopLevelItem'] ) : false;
-
 	// Text color.
 	$named_text_color  = null;
 	$custom_text_color = null;
@@ -250,6 +249,15 @@ function render_block_core_navigation_submenu( $attributes, $content, $block ) {
 	}
 
 	if ( $has_submenu ) {
+		$colors      = block_core_navigation_submenu_build_css_colors( $block->context, $attributes, $has_submenu );
+		$classes     = array_merge(
+			array( 'wp-block-navigation__submenu-container' ),
+			$colors['css_classes']
+		);
+		$css_classes = trim( implode( ' ', $classes ) );
+
+		$style_attribute = $colors['inline_styles'];
+
 		$inner_blocks_html = '';
 		foreach ( $block->inner_blocks as $inner_block ) {
 			$inner_blocks_html .= $inner_block->render();
@@ -263,10 +271,19 @@ function render_block_core_navigation_submenu( $attributes, $content, $block ) {
 			$html = $tag_processor->get_updated_html();
 		}
 
+		$wrapper_attributes = get_block_wrapper_attributes(
+			array(
+				'class' => $css_classes,
+				'style' => $style_attribute,
+			)
+		);
+
 		$html .= sprintf(
-			'<ul class="wp-block-navigation__submenu-container">%s</ul>',
+			'<ul %s>%s</ul>',
+			$wrapper_attributes,
 			$inner_blocks_html
 		);
+
 	}
 
 	$html .= '</li>';

package/src/page-list/block.json

@@ -33,7 +33,6 @@
 		"openSubmenusOnClick"
 	],
 	"supports": {
-		"anchor": true,
 		"reusable": false,
 		"html": false,
 		"typography": {

package/src/page-list/edit.js

@@ -55,7 +55,9 @@ function BlockContent( {
 	if ( ! hasResolvedPages ) {
 		return (
 			<div { ...blockProps }>
-				<Spinner />
+				<div className="wp-block-page-list__loading-indicator-container">
+					<Spinner className="wp-block-page-list__loading-indicator" />
+				</div>
 			</div>
 		);
 	}

package/src/page-list/editor.scss

@@ -61,3 +61,9 @@
 .wp-block-page-list .components-notice {
 	margin-left: 0;
 }
+
+// Space spinner to give it breathing
+// room when block is selected and has focus outline.
+.wp-block-page-list__loading-indicator-container {
+	padding: $grid-unit-10 $grid-unit-15;
+}

package/src/post-author/block.json

@@ -35,7 +35,6 @@
 	},
 	"usesContext": [ "postType", "postId", "queryId" ],
 	"supports": {
-		"anchor": true,
 		"html": false,
 		"spacing": {
 			"margin": true,

package/src/post-author-biography/block.json

@@ -13,7 +13,6 @@
 	},
 	"usesContext": [ "postType", "postId" ],
 	"supports": {
-		"anchor": true,
 		"spacing": {
 			"margin": true,
 			"padding": true

package/src/post-author-name/block.json

@@ -21,7 +21,6 @@
 	},
 	"usesContext": [ "postType", "postId" ],
 	"supports": {
-		"anchor": true,
 		"html": false,
 		"spacing": {
 			"margin": true,

package/src/post-comments-count/block.json

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

package/src/post-comments-form/block.json

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

package/src/post-comments-link/block.json

@@ -14,7 +14,6 @@
 		}
 	},
 	"supports": {
-		"anchor": true,
 		"html": false,
 		"color": {
 			"link": true,

package/src/post-content/block.json

@@ -8,7 +8,6 @@
 	"textdomain": "default",
 	"usesContext": [ "postId", "postType", "queryId" ],
 	"supports": {
-		"anchor": true,
 		"align": [ "wide", "full" ],
 		"html": false,
 		"__experimentalLayout": true,

package/src/post-date/block.json

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

package/src/post-excerpt/block.json

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

package/src/post-featured-image/block.json

@@ -53,7 +53,6 @@
 	"usesContext": [ "postId", "postType", "queryId" ],
 	"supports": {
 		"align": [ "left", "right", "center", "wide", "full" ],
-		"anchor": true,
 		"color": {
 			"__experimentalDuotone": "img, .wp-block-post-featured-image__placeholder, .components-placeholder__illustration, .components-placeholder::before",
 			"text": false,

package/src/post-navigation-link/block.json

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

package/src/post-template/block.json

@@ -19,7 +19,6 @@
 		"reusable": false,
 		"html": false,
 		"align": true,
-		"anchor": true,
 		"__experimentalLayout": {
 			"allowEditing": false
 		},

package/src/post-terms/block.json

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

package/src/post-title/block.json

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

package/src/query/block.json

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

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

@@ -19,7 +19,7 @@ import { __ } from '@wordpress/i18n';
 /**
  * Internal dependencies
  */
-import { useScopedBlockVariations } from '../utils';
+import { useScopedBlockVariations, useBlockNameForPatterns } from '../utils';
 
 export default function QueryPlaceholder( {
 	attributes,
@@ -30,6 +30,10 @@ export default function QueryPlaceholder( {
 } ) {
 	const [ isStartingBlank, setIsStartingBlank ] = useState( false );
 	const blockProps = useBlockProps();
+	const blockNameForPatterns = useBlockNameForPatterns(
+		clientId,
+		attributes
+	);
 
 	const { blockType, allVariations, hasPatterns } = useSelect(
 		( select ) => {
@@ -37,15 +41,16 @@ export default function QueryPlaceholder( {
 			const { getBlockRootClientId, getPatternsByBlockTypes } =
 				select( blockEditorStore );
 			const rootClientId = getBlockRootClientId( clientId );
-
 			return {
 				blockType: getBlockType( name ),
 				allVariations: getBlockVariations( name ),
-				hasPatterns: !! getPatternsByBlockTypes( name, rootClientId )
-					.length,
+				hasPatterns: !! getPatternsByBlockTypes(
+					blockNameForPatterns,
+					rootClientId
+				).length,
 			};
 		},
-		[ name, clientId ]
+		[ name, blockNameForPatterns, clientId ]
 	);
 
 	const matchingVariation = getMatchingVariation( attributes, allVariations );

package/src/query/editor.scss

@@ -42,6 +42,7 @@
 		position: sticky;
 		top: 0;
 		padding: $grid-unit-20 0;
+		margin-bottom: 2px;
 		z-index: z-index(".block-library-query-pattern__selection-search");
 	}
 }

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

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

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

@@ -14,7 +14,6 @@
 	},
 	"usesContext": [ "queryId", "query", "paginationArrow" ],
 	"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": {

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

@@ -14,7 +14,6 @@
 	},
 	"usesContext": [ "queryId", "query", "paginationArrow" ],
 	"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/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

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

package/src/site-logo/block.json

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

package/src/site-logo/editor.scss

@@ -33,10 +33,10 @@
 // Provide special styling for the placeholder.
 // @todo: this particular minimal style of placeholder could be componentized further.
 .wp-block-site-logo.wp-block-site-logo {
-	// Match the default logo size.
+
 	&.is-default-size .components-placeholder {
-		height: 120px;
-		width: 120px;
+		height: 60px;
+		width: 60px;
 	}
 
 	// Inherit radius.

package/src/site-tagline/block.json

@@ -12,8 +12,8 @@
 			"type": "string"
 		}
 	},
+	"example": {},
 	"supports": {
-		"anchor": true,
 		"align": [ "wide", "full" ],
 		"html": false,
 		"color": {

package/src/site-title/block.json

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

package/src/social-link/block.json

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

package/src/social-links/edit.js

@@ -109,6 +109,7 @@ export function SocialLinksEdit( props ) {
 		allowedBlocks: ALLOWED_BLOCKS,
 		placeholder: isSelected ? SelectedSocialPlaceholder : SocialPlaceholder,
 		templateLock: false,
+		orientation: attributes.layout?.orientation ?? 'horizontal',
 		__experimentalAppenderTagName: 'li',
 	} );
 

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/import-controls.js

@@ -12,10 +12,6 @@ import {
 	__experimentalHStack as HStack,
 	__experimentalSpacer as Spacer,
 } from '@wordpress/components';
-import {
-	switchToBlockType,
-	getPossibleBlockTransformations,
-} from '@wordpress/blocks';
 import { store as coreStore } from '@wordpress/core-data';
 import { store as noticesStore } from '@wordpress/notices';
 
@@ -25,16 +21,25 @@ import { store as noticesStore } from '@wordpress/notices';
 import { useCreateTemplatePartFromBlocks } from './utils/hooks';
 import { transformWidgetToBlock } from './utils/transformers';
 
+const SIDEBARS_QUERY = {
+	per_page: -1,
+	_fields: 'id,name,description,status,widgets',
+};
+
 export function TemplatePartImportControls( { area, setAttributes } ) {
 	const [ selectedSidebar, setSelectedSidebar ] = useState( '' );
 	const [ isBusy, setIsBusy ] = useState( false );
 
 	const registry = useRegistry();
-	const sidebars = useSelect( ( select ) => {
-		return select( coreStore ).getSidebars( {
-			per_page: -1,
-			_fields: 'id,name,description,status,widgets',
-		} );
+	const { sidebars, hasResolved } = useSelect( ( select ) => {
+		const { getSidebars, hasFinishedResolution } = select( coreStore );
+
+		return {
+			sidebars: getSidebars( SIDEBARS_QUERY ),
+			hasResolved: hasFinishedResolution( 'getSidebars', [
+				SIDEBARS_QUERY,
+			] ),
+		};
 	}, [] );
 	const { createErrorNotice } = useDispatch( noticesStore );
 
@@ -67,6 +72,16 @@ export function TemplatePartImportControls( { area, setAttributes } ) {
 		];
 	}, [ sidebars ] );
 
+	// Render an empty node while data is loading to avoid SlotFill re-positioning bug.
+	// See: https://github.com/WordPress/gutenberg/issues/15641.
+	if ( ! hasResolved ) {
+		return <Spacer marginBottom="0" />;
+	}
+
+	if ( hasResolved && ! options.length ) {
+		return null;
+	}
+
 	async function createFromWidgets( event ) {
 		event.preventDefault();
 
@@ -91,36 +106,13 @@ export function TemplatePartImportControls( { area, setAttributes } ) {
 		const blocks = widgets.flatMap( ( widget ) => {
 			const block = transformWidgetToBlock( widget );
 
-			if ( block.name !== 'core/legacy-widget' ) {
-				return block;
-			}
-
-			const transforms = getPossibleBlockTransformations( [
-				block,
-			] ).filter( ( item ) => {
-				// The block without any transformations can't be a wildcard.
-				if ( ! item.transforms ) {
-					return true;
-				}
-
-				const hasWildCardFrom = item.transforms?.from?.find(
-					( from ) => from.blocks && from.blocks.includes( '*' )
-				);
-				const hasWildCardTo = item.transforms?.to?.find(
-					( to ) => to.blocks && to.blocks.includes( '*' )
-				);
-
-				return ! hasWildCardFrom && ! hasWildCardTo;
-			} );
-
 			// Skip the block if we have no matching transformations.
-			if ( ! transforms.length ) {
+			if ( ! block ) {
 				skippedWidgets.add( widget.id_base );
 				return [];
 			}
 
-			// Try transforming the Legacy Widget into a first matching block.
-			return switchToBlockType( block, transforms[ 0 ].name );
+			return block;
 		} );
 
 		await createFromBlocks(