@wordpress/block-library 7.9.0 → 7.12.0

package/src/navigation/edit/responsive-wrapper.js

@@ -9,6 +9,7 @@ import classnames from 'classnames';
 import { close, Icon } from '@wordpress/icons';
 import { Button } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
+import { getColorClassName } from '@wordpress/block-editor';
 
 /**
  * Internal dependencies
@@ -22,21 +23,41 @@ export default function ResponsiveWrapper( {
 	isResponsive,
 	onToggle,
 	isHiddenByDefault,
-	classNames,
-	styles,
+	overlayBackgroundColor,
+	overlayTextColor,
 	hasIcon,
 } ) {
 	if ( ! isResponsive ) {
 		return children;
 	}
+
 	const responsiveContainerClasses = classnames(
 		'wp-block-navigation__responsive-container',
-		classNames,
 		{
+			'has-text-color':
+				!! overlayTextColor.color || !! overlayTextColor?.class,
+			[ getColorClassName( 'color', overlayTextColor?.slug ) ]:
+				!! overlayTextColor?.slug,
+			'has-background':
+				!! overlayBackgroundColor.color ||
+				overlayBackgroundColor?.class,
+			[ getColorClassName(
+				'background-color',
+				overlayBackgroundColor?.slug
+			) ]: !! overlayBackgroundColor?.slug,
 			'is-menu-open': isOpen,
 			'hidden-by-default': isHiddenByDefault,
 		}
 	);
+
+	const styles = {
+		color: ! overlayTextColor?.slug && overlayTextColor?.color,
+		backgroundColor:
+			! overlayBackgroundColor?.slug &&
+			overlayBackgroundColor?.color &&
+			overlayBackgroundColor.color,
+	};
+
 	const openButtonClasses = classnames(
 		'wp-block-navigation__responsive-container-open',
 		{ 'always-shown': isHiddenByDefault }

package/src/navigation/edit/use-create-navigation-menu.js

@@ -86,5 +86,9 @@ export default function useCreateNavigationMenu( clientId ) {
 		status,
 		value,
 		error,
+		isIdle: status === CREATE_NAVIGATION_MENU_IDLE,
+		isPending: status === CREATE_NAVIGATION_MENU_PENDING,
+		isSuccess: status === CREATE_NAVIGATION_MENU_SUCCESS,
+		isError: status === CREATE_NAVIGATION_MENU_ERROR,
 	};
 }

package/src/navigation/edit/use-inner-blocks.js

@@ -0,0 +1,39 @@
+/**
+ * WordPress dependencies
+ */
+import { useSelect } from '@wordpress/data';
+import { store as blockEditorStore } from '@wordpress/block-editor';
+
+const EMPTY_ARRAY = [];
+
+export function useInnerBlocks( clientId ) {
+	return useSelect(
+		( select ) => {
+			const { getBlock, getBlocks, hasSelectedInnerBlock } =
+				select( blockEditorStore );
+
+			// This relies on the fact that `getBlock` won't return controlled
+			// inner blocks, while `getBlocks` does. It might be more stable to
+			// introduce a selector like `getUncontrolledInnerBlocks`, just in
+			// case `getBlock` is fixed.
+			const _uncontrolledInnerBlocks = getBlock( clientId ).innerBlocks;
+
+			const _hasUncontrolledInnerBlocks =
+				!! _uncontrolledInnerBlocks?.length;
+			const _controlledInnerBlocks = _hasUncontrolledInnerBlocks
+				? EMPTY_ARRAY
+				: getBlocks( clientId );
+
+			return {
+				innerBlocks: _hasUncontrolledInnerBlocks
+					? _uncontrolledInnerBlocks
+					: _controlledInnerBlocks,
+				hasUncontrolledInnerBlocks: _hasUncontrolledInnerBlocks,
+				uncontrolledInnerBlocks: _uncontrolledInnerBlocks,
+				controlledInnerBlocks: _controlledInnerBlocks,
+				isInnerBlockSelected: hasSelectedInnerBlock( clientId, true ),
+			};
+		},
+		[ clientId ]
+	);
+}

package/src/navigation/edit/utils.js

@@ -0,0 +1,30 @@
+function getComputedStyle( node ) {
+	return node.ownerDocument.defaultView.getComputedStyle( node );
+}
+
+export function detectColors(
+	colorsDetectionElement,
+	setColor,
+	setBackground
+) {
+	if ( ! colorsDetectionElement ) {
+		return;
+	}
+	setColor( getComputedStyle( colorsDetectionElement ).color );
+
+	let backgroundColorNode = colorsDetectionElement;
+	let backgroundColor =
+		getComputedStyle( backgroundColorNode ).backgroundColor;
+	while (
+		backgroundColor === 'rgba(0, 0, 0, 0)' &&
+		backgroundColorNode.parentNode &&
+		backgroundColorNode.parentNode.nodeType ===
+			backgroundColorNode.parentNode.ELEMENT_NODE
+	) {
+		backgroundColorNode = backgroundColorNode.parentNode;
+		backgroundColor =
+			getComputedStyle( backgroundColorNode ).backgroundColor;
+	}
+
+	setBackground( backgroundColor );
+}

package/src/navigation/index.php

@@ -472,6 +472,12 @@ function render_block_core_navigation( $attributes, $content, $block ) {
 			return '';
 		}
 
+		// Only published posts are valid. If this is changed then a corresponding change
+		// must also be implemented in `use-navigation-menu.js`.
+		if ( 'publish' !== $navigation_post->post_status ) {
+			return '';
+		}
+
 		$nav_menu_name = $navigation_post->post_title;
 
 		if ( isset( $seen_menu_names[ $nav_menu_name ] ) ) {

package/src/navigation/style.scss

@@ -45,9 +45,6 @@ $navigation-icon-size: 24px;
 	// but still allow them to be overridden by user-set colors.
 	.wp-block-navigation-item__content {
 		display: block;
-
-		// Set the default menu item padding to zero, to allow text-only buttons.
-		padding: 0;
 	}
 
 	// The following rules provide class based application of user selected text
@@ -105,7 +102,7 @@ $navigation-icon-size: 24px;
 			width: inherit;
 			height: inherit;
 
-			// Position the arrow to balance with the the text.
+			// Position the arrow to balance with the text.
 			margin-top: 0.075em;
 		}
 	}
@@ -154,10 +151,7 @@ $navigation-icon-size: 24px;
 // Styles for submenu flyout.
 // These are separated out with reduced specificity to allow better inheritance from Global Styles.
 .wp-block-navigation .has-child {
-	// We use :where to keep specificity minimal, yet still scope it to only the navigation block.
-	// That way if padding is set in theme.json, it still wins.
-	// https://css-tricks.com/almanac/selectors/w/where/
-	:where(.wp-block-navigation__submenu-container) {
+	.wp-block-navigation__submenu-container {
 		background-color: inherit;
 		color: inherit;
 		position: absolute;
@@ -233,7 +227,7 @@ $navigation-icon-size: 24px;
 
 	// Custom menu items.
 	// Show submenus on hover unless they open on click.
-	&:where(:not(.open-on-click)):hover > .wp-block-navigation__submenu-container {
+	&:not(.open-on-click):hover > .wp-block-navigation__submenu-container {
 		visibility: visible;
 		overflow: visible;
 		opacity: 1;
@@ -243,7 +237,7 @@ $navigation-icon-size: 24px;
 	}
 
 	// Keep submenus open when focus is within.
-	&:where(:not(.open-on-click):not(.open-on-hover-click)):focus-within > .wp-block-navigation__submenu-container {
+	&:not(.open-on-click):not(.open-on-hover-click):focus-within > .wp-block-navigation__submenu-container {
 		visibility: visible;
 		overflow: visible;
 		opacity: 1;
@@ -339,17 +333,6 @@ button.wp-block-navigation-item__content {
 	gap: inherit;
 }
 
-// Menu items with background.
-// We use :where to keep specificity minimal, yet still scope it to only the navigation block.
-// That way if padding is set in theme.json, it still wins.
-// https://css-tricks.com/almanac/selectors/w/where/
-.wp-block-navigation:where(.has-background) {
-	&,
-	.wp-block-navigation .wp-block-page-list,
-	.wp-block-navigation__container {
-		gap: inherit;
-	}
-}
 
 /**
  * Paddings
@@ -361,15 +344,18 @@ button.wp-block-navigation-item__content {
 
 // When the menu has a background, items have paddings, reduce margins to compensate.
 // Treat margins and paddings differently when the block has a background.
-.wp-block-navigation:where(.has-background) .wp-block-navigation-item__content {
+:where(.wp-block-navigation.has-background .wp-block-navigation-link a:not(.wp-element-button)),
+:where(.wp-block-navigation.has-background .wp-block-navigation-submenu a:not(.wp-element-button)) {
 	padding: 0.5em 1em;
 }
 
 // Provide a default padding for submenus who should always have some, regardless of the top level menu items.
-.wp-block-navigation :where(.wp-block-navigation__submenu-container) .wp-block-navigation-item__content {
+:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-link a:not(.wp-element-button)),
+:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-submenu a:not(.wp-element-button)) {
 	padding: 0.5em 1em;
 }
 
+
 /**
  * Justifications.
  */
@@ -452,6 +438,10 @@ button.wp-block-navigation-item__content {
 	right: 0;
 	bottom: 0;
 
+	.wp-block-navigation-link a {
+		color: inherit;
+	}
+
 	.wp-block-navigation__responsive-container-content {
 		display: flex;
 		flex-wrap: var(--navigation-layout-wrap, wrap);

package/src/navigation/use-navigation-menu.js

@@ -99,15 +99,19 @@ function selectExistingMenu( select, ref ) {
 		args
 	);
 
+	// Only published Navigation posts are considered valid.
+	// If this is changed then a corresponding change must also be made
+	// in the index.php file.
+	const isNavigationMenuPublished = editedNavigationMenu.status === 'publish';
+
 	return {
 		isNavigationMenuResolved: hasResolvedNavigationMenu,
-		isNavigationMenuMissing: hasResolvedNavigationMenu && ! navigationMenu,
+		isNavigationMenuMissing:
+			hasResolvedNavigationMenu &&
+			( ! navigationMenu || ! isNavigationMenuPublished ),
 
 		// getEditedEntityRecord will return the post regardless of status.
 		// Therefore if the found post is not published then we should ignore it.
-		navigationMenu:
-			editedNavigationMenu.status === 'publish'
-				? editedNavigationMenu
-				: null,
+		navigationMenu: isNavigationMenuPublished ? editedNavigationMenu : null,
 	};
 }

package/src/navigation/view.js

@@ -4,8 +4,6 @@ function closeSubmenus( element ) {
 		.querySelectorAll( '[aria-expanded="true"]' )
 		.forEach( function ( toggle ) {
 			toggle.setAttribute( 'aria-expanded', 'false' );
-			// Always focus the trigger, this becomes especially useful in closing submenus with escape key to ensure focus doesn't get trapped.
-			toggle.focus();
 		} );
 }
 
@@ -63,11 +61,13 @@ window.addEventListener( 'load', () => {
 			'.wp-block-navigation-item.has-child'
 		);
 		submenuBlocks.forEach( function ( block ) {
-			if (
-				! block.contains( event.target ) ||
-				( block.contains( event.target ) && event.key === 'Escape' )
-			) {
+			if ( ! block.contains( event.target ) ) {
+				closeSubmenus( block );
+			} else if ( event.key === 'Escape' ) {
+				const toggle = block.querySelector( '[aria-expanded="true"]' );
 				closeSubmenus( block );
+				// Focus the submenu trigger so focus does not get trapped in the closed submenu.
+				toggle?.focus();
 			}
 		} );
 	} );

package/src/navigation-link/edit.js

@@ -312,7 +312,7 @@ const useIsInvalidLink = ( kind, type, id ) => {
 	return [ isInvalid, isDraft ];
 };
 
-const useMissingText = ( type ) => {
+function getMissingText( type ) {
 	let missingText = '';
 
 	switch ( type ) {
@@ -338,7 +338,7 @@ const useMissingText = ( type ) => {
 	}
 
 	return missingText;
-};
+}
 
 /**
  * Removes HTML from a given string.
@@ -682,7 +682,7 @@ export default function NavigationLinkEdit( {
 		'wp-block-navigation-link__placeholder': ! url || isInvalid || isDraft,
 	} );
 
-	const missingText = useMissingText( type, isInvalid, isDraft );
+	const missingText = getMissingText( type );
 	/* translators: Whether the navigation link is Invalid or a Draft. */
 	const placeholderText = `(${
 		isInvalid ? __( 'Invalid' ) : __( 'Draft' )
@@ -849,6 +849,7 @@ export default function NavigationLinkEdit( {
 							position="bottom center"
 							onClose={ () => setIsLinkOpen( false ) }
 							anchorRef={ listItemRef.current }
+							__unstableShift
 						>
 							<LinkControl
 								hasTextControl

package/src/navigation-link/hooks.js

@@ -9,11 +9,6 @@ import {
 	customPostType,
 } from '@wordpress/icons';
 
-/**
- * Internal dependencies
- */
-import fallbackVariations from './fallback-variations';
-
 function getIcon( variationName ) {
 	switch ( variationName ) {
 		case 'post':
@@ -34,15 +29,6 @@ export function enhanceNavigationLinkVariations( settings, name ) {
 		return settings;
 	}
 
-	// Fallback handling may be deleted after supported WP ranges understand the `variations`
-	// property when passed to register_block_type in index.php.
-	if ( ! settings.variations ) {
-		return {
-			...settings,
-			variations: fallbackVariations,
-		};
-	}
-
 	// Otherwise decorate server passed variations with an icon and isActive function.
 	if ( settings.variations ) {
 		const isActive = ( blockAttributes, variationAttributes ) => {

package/src/navigation-link/index.js

@@ -88,7 +88,7 @@ export const settings = {
 	transforms,
 };
 
-// importing this file includes side effects. This is whitelisted in block-library/package.json under sideEffects
+// importing this file includes side effects. This is added in block-library/package.json under sideEffects
 addFilter(
 	'blocks.registerBlockType',
 	'core/navigation-link',

package/src/navigation-link/index.php

@@ -150,7 +150,7 @@ function render_block_core_navigation_link( $attributes, $content, $block ) {
 
 	$css_classes = trim( implode( ' ', $classes ) );
 	$has_submenu = count( $block->inner_blocks ) > 0;
-	$is_active   = ! empty( $attributes['id'] ) && ( get_the_ID() === $attributes['id'] );
+	$is_active   = ! empty( $attributes['id'] ) && ( get_the_ID() === (int) $attributes['id'] );
 
 	$wrapper_attributes = get_block_wrapper_attributes(
 		array(

package/src/navigation-link/test/__snapshots__/hooks.js.snap

@@ -1,98 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`hooks enhanceNavigationLinkVariations adds fallback variations when variations are missing 1`] = `
-Object {
-  "name": "core/navigation-link",
-  "one": "one",
-  "three": "three",
-  "two": "two",
-  "variations": Array [
-    Object {
-      "attributes": Object {},
-      "description": "A link to a custom URL.",
-      "isActive": [Function],
-      "isDefault": true,
-      "name": "link",
-      "title": "Custom Link",
-    },
-    Object {
-      "attributes": Object {
-        "kind": "post-type",
-        "type": "post",
-      },
-      "description": "A link to a post.",
-      "icon": <SVG
-        viewBox="0 0 24 24"
-        xmlns="https://www.w3.org/2000/svg"
-      >
-        <Path
-          d="M4 20h16v-1.5H4V20zm0-4.8h16v-1.5H4v1.5zm0-6.4v1.5h16V8.8H4zM16 4H4v1.5h12V4z"
-        />
-      </SVG>,
-      "isActive": [Function],
-      "name": "post",
-      "title": "Post Link",
-    },
-    Object {
-      "attributes": Object {
-        "kind": "post-type",
-        "type": "page",
-      },
-      "description": "A link to a page.",
-      "icon": <SVG
-        viewBox="0 0 24 24"
-        xmlns="http://www.w3.org/2000/svg"
-      >
-        <Path
-          d="M7 5.5h10a.5.5 0 01.5.5v12a.5.5 0 01-.5.5H7a.5.5 0 01-.5-.5V6a.5.5 0 01.5-.5zM17 4H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V6a2 2 0 00-2-2zm-1 3.75H8v1.5h8v-1.5zM8 11h8v1.5H8V11zm6 3.25H8v1.5h6v-1.5z"
-        />
-      </SVG>,
-      "isActive": [Function],
-      "name": "page",
-      "title": "Page Link",
-    },
-    Object {
-      "attributes": Object {
-        "kind": "taxonomy",
-        "type": "category",
-      },
-      "description": "A link to a category.",
-      "icon": <SVG
-        viewBox="0 0 24 24"
-        xmlns="http://www.w3.org/2000/svg"
-      >
-        <Path
-          clipRule="evenodd"
-          d="M6 5.5h3a.5.5 0 01.5.5v3a.5.5 0 01-.5.5H6a.5.5 0 01-.5-.5V6a.5.5 0 01.5-.5zM4 6a2 2 0 012-2h3a2 2 0 012 2v3a2 2 0 01-2 2H6a2 2 0 01-2-2V6zm11-.5h3a.5.5 0 01.5.5v3a.5.5 0 01-.5.5h-3a.5.5 0 01-.5-.5V6a.5.5 0 01.5-.5zM13 6a2 2 0 012-2h3a2 2 0 012 2v3a2 2 0 01-2 2h-3a2 2 0 01-2-2V6zm5 8.5h-3a.5.5 0 00-.5.5v3a.5.5 0 00.5.5h3a.5.5 0 00.5-.5v-3a.5.5 0 00-.5-.5zM15 13a2 2 0 00-2 2v3a2 2 0 002 2h3a2 2 0 002-2v-3a2 2 0 00-2-2h-3zm-9 1.5h3a.5.5 0 01.5.5v3a.5.5 0 01-.5.5H6a.5.5 0 01-.5-.5v-3a.5.5 0 01.5-.5zM4 15a2 2 0 012-2h3a2 2 0 012 2v3a2 2 0 01-2 2H6a2 2 0 01-2-2v-3z"
-          fillRule="evenodd"
-        />
-      </SVG>,
-      "isActive": [Function],
-      "name": "category",
-      "title": "Category Link",
-    },
-    Object {
-      "attributes": Object {
-        "kind": "taxonomy",
-        "type": "tag",
-      },
-      "description": "A link to a tag.",
-      "icon": <SVG
-        viewBox="0 0 24 24"
-        xmlns="http://www.w3.org/2000/svg"
-      >
-        <Path
-          d="M20.1 11.2l-6.7-6.7c-.1-.1-.3-.2-.5-.2H5c-.4-.1-.8.3-.8.7v7.8c0 .2.1.4.2.5l6.7 6.7c.2.2.5.4.7.5s.6.2.9.2c.3 0 .6-.1.9-.2.3-.1.5-.3.8-.5l5.6-5.6c.4-.4.7-1 .7-1.6.1-.6-.2-1.2-.6-1.6zM19 13.4L13.4 19c-.1.1-.2.1-.3.2-.2.1-.4.1-.6 0-.1 0-.2-.1-.3-.2l-6.5-6.5V5.8h6.8l6.5 6.5c.2.2.2.4.2.6 0 .1 0 .3-.2.5zM9 8c-.6 0-1 .4-1 1s.4 1 1 1 1-.4 1-1-.4-1-1-1z"
-        />
-      </SVG>,
-      "isActive": [Function],
-      "name": "tag",
-      "title": "Tag Link",
-    },
-  ],
-}
-`;
-
 exports[`hooks enhanceNavigationLinkVariations enhances variations with icon and isActive functions 1`] = `
 Object {
   "extraProp": "extraProp",

package/src/navigation-link/test/hooks.js

@@ -26,18 +26,6 @@ describe( 'hooks', () => {
 				three: 'three',
 			} );
 		} );
-		it( 'adds fallback variations when variations are missing', () => {
-			const updatedSettings = enhanceNavigationLinkVariations(
-				{
-					name: 'core/navigation-link',
-					one: 'one',
-					two: 'two',
-					three: 'three',
-				},
-				'core/navigation-link'
-			);
-			expect( updatedSettings ).toMatchSnapshot();
-		} );
 		it( 'enhances variations with icon and isActive functions', () => {
 			const updatedSettings = enhanceNavigationLinkVariations(
 				{

package/src/navigation-submenu/edit.js

@@ -634,6 +634,7 @@ export default function NavigationSubmenuEdit( {
 							position="bottom center"
 							onClose={ () => setIsLinkOpen( false ) }
 							anchorRef={ listItemRef.current }
+							__unstableShift
 						>
 							<LinkControl
 								className="wp-block-navigation-link__inline-link-input"

package/src/navigation-submenu/index.php

@@ -148,7 +148,7 @@ function render_block_core_navigation_submenu( $attributes, $content, $block ) {
 
 	$css_classes = trim( implode( ' ', $classes ) );
 	$has_submenu = count( $block->inner_blocks ) > 0;
-	$is_active   = ! empty( $attributes['id'] ) && ( get_the_ID() === $attributes['id'] );
+	$is_active   = ! empty( $attributes['id'] ) && ( get_the_ID() === (int) $attributes['id'] );
 
 	$show_submenu_indicators = isset( $block->context['showSubmenuIcon'] ) && $block->context['showSubmenuIcon'];
 	$open_on_click           = isset( $block->context['openSubmenusOnClick'] ) && $block->context['openSubmenusOnClick'];

package/src/navigation-submenu/view.js

@@ -3,8 +3,6 @@ const closeSubmenus = ( element ) => {
 		.querySelectorAll( '[aria-expanded="true"]' )
 		.forEach( ( toggle ) => {
 			toggle.setAttribute( 'aria-expanded', 'false' );
-			// Always focus the trigger, this becomes especially useful in closing submenus with escape key to ensure focus doesn't get trapped.
-			toggle.focus();
 		} );
 };
 
@@ -57,11 +55,13 @@ document.addEventListener( 'keyup', function ( event ) {
 		'.wp-block-navigation-submenu'
 	);
 	submenuBlocks.forEach( ( block ) => {
-		if (
-			! block.contains( event.target ) ||
-			( block.contains( event.target ) && event.key === 'Escape' )
-		) {
+		if ( ! block.contains( event.target ) ) {
+			closeSubmenus( block );
+		} else if ( event.key === 'Escape' ) {
+			const toggle = block.querySelector( '[aria-expanded="true"]' );
 			closeSubmenus( block );
+			// Focus the submenu trigger so focus does not get trapped in the closed submenu.
+			toggle?.focus();
 		}
 	} );
 } );

package/src/nextpage/edit.js

@@ -7,9 +7,7 @@ import { useBlockProps } from '@wordpress/block-editor';
 export default function NextPageEdit() {
 	return (
 		<div { ...useBlockProps() }>
-			<div className="wp-block-nextpage">
-				<span>{ __( 'Page break' ) }</span>
-			</div>
+			<span>{ __( 'Page break' ) }</span>
 		</div>
 	);
 }

package/src/page-list/edit.js

@@ -76,11 +76,9 @@ export default function PageListEdit( { context, clientId } ) {
 
 			{ hasResolvedPages && totalPages === null && (
 				<div { ...blockProps }>
-					<div { ...blockProps }>
-						<Notice status={ 'warning' } isDismissible={ false }>
-							{ __( 'Page List: Cannot retrieve Pages.' ) }
-						</Notice>
-					</div>
+					<Notice status={ 'warning' } isDismissible={ false }>
+						{ __( 'Page List: Cannot retrieve Pages.' ) }
+					</Notice>
 				</div>
 			) }
 
@@ -105,6 +103,14 @@ export default function PageListEdit( { context, clientId } ) {
 
 function useFrontPageId() {
 	return useSelect( ( select ) => {
+		const canReadSettings = select( coreStore ).canUser(
+			'read',
+			'settings'
+		);
+		if ( ! canReadSettings ) {
+			return undefined;
+		}
+
 		const site = select( coreStore ).getEntityRecord( 'root', 'site' );
 		return site?.show_on_front === 'page' && site?.page_on_front;
 	}, [] );
@@ -119,6 +125,7 @@ function usePageData() {
 			order: 'asc',
 			_fields: [ 'id', 'link', 'parent', 'title', 'menu_order' ],
 			per_page: -1,
+			context: 'view',
 		}
 	);
 

package/src/page-list/index.php

@@ -328,9 +328,9 @@ function render_block_core_page_list( $attributes, $content, $block ) {
 	);
 }
 
-	/**
-	 * Registers the `core/pages` block on server.
-	 */
+/**
+ * Registers the `core/pages` block on server.
+ */
 function register_block_core_page_list() {
 	register_block_type_from_metadata(
 		__DIR__ . '/page-list',
@@ -339,4 +339,4 @@ function register_block_core_page_list() {
 		)
 	);
 }
-	add_action( 'init', 'register_block_core_page_list' );
+add_action( 'init', 'register_block_core_page_list' );

package/src/paragraph/edit.js

@@ -8,7 +8,7 @@ import classnames from 'classnames';
  */
 import { __, _x, isRTL } from '@wordpress/i18n';
 import {
-	ToolbarDropdownMenu,
+	ToolbarButton,
 	ToggleControl,
 	__experimentalToolsPanelItem as ToolsPanelItem,
 } from '@wordpress/components';
@@ -33,19 +33,13 @@ const name = 'core/paragraph';
 function ParagraphRTLControl( { direction, setDirection } ) {
 	return (
 		isRTL() && (
-			<ToolbarDropdownMenu
-				controls={ [
-					{
-						icon: formatLtr,
-						title: _x( 'Left to right', 'editor button' ),
-						isActive: direction === 'ltr',
-						onClick() {
-							setDirection(
-								direction === 'ltr' ? undefined : 'ltr'
-							);
-						},
-					},
-				] }
+			<ToolbarButton
+				icon={ formatLtr }
+				title={ _x( 'Left to right', 'editor button' ) }
+				isActive={ direction === 'ltr' }
+				onClick={ () => {
+					setDirection( direction === 'ltr' ? undefined : 'ltr' );
+				} }
 			/>
 		)
 	);

package/src/post-author/edit.js

@@ -162,9 +162,12 @@ function PostAuthorEdit( {
 						{ authorDetails?.name || __( 'Post Author' ) }
 					</p>
 					{ showBio && (
-						<p className="wp-block-post-author__bio">
-							{ authorDetails?.description }
-						</p>
+						<p
+							className="wp-block-post-author__bio"
+							dangerouslySetInnerHTML={ {
+								__html: authorDetails?.description,
+							} }
+						/>
 					) }
 				</div>
 			</div>