@wordpress/block-library 6.0.11 → 6.0.12

package/src/gallery/edit-wrapper.js

@@ -1,47 +1,27 @@
 /**
  * WordPress dependencies
  */
-import { store as blockEditorStore } from '@wordpress/block-editor';
-import { useSelect } from '@wordpress/data';
+import { compose } from '@wordpress/compose';
+import { withNotices } from '@wordpress/components';
 
 /**
  * Internal dependencies
  */
 import EditWithInnerBlocks from './edit';
 import EditWithoutInnerBlocks from './v1/edit';
+import { isGalleryV2Enabled } from './shared';
 
 /*
  * Using a wrapper around the logic to load the edit for v1 of Gallery block
  * or the refactored version with InnerBlocks. This is to prevent conditional
  * use of hooks lint errors if adding this logic to the top of the edit component.
  */
-export default function GalleryEditWrapper( props ) {
-	const { attributes, clientId } = props;
-
-	const innerBlockImages = useSelect(
-		( select ) => {
-			return select( blockEditorStore ).getBlock( clientId )?.innerBlocks;
-		},
-		[ clientId ]
-	);
-
-	const __unstableGalleryWithImageBlocks = useSelect( ( select ) => {
-		const settings = select( blockEditorStore ).getSettings();
-		return settings.__unstableGalleryWithImageBlocks;
-	}, [] );
-
-	// This logic is used to infer version information from content with higher
-	// precedence than the flag. New galleries (and existing empty galleries) will
-	// honor the flag.
-	const hasNewVersionContent = !! innerBlockImages?.length;
-	const hasOldVersionContent =
-		0 < attributes?.ids?.length || 0 < attributes?.images?.length;
-	if (
-		hasOldVersionContent ||
-		( ! hasNewVersionContent && ! __unstableGalleryWithImageBlocks )
-	) {
+function GalleryEditWrapper( props ) {
+	if ( ! isGalleryV2Enabled() ) {
 		return <EditWithoutInnerBlocks { ...props } />;
 	}
 
 	return <EditWithInnerBlocks { ...props } />;
 }
+
+export default compose( [ withNotices ] )( GalleryEditWrapper );

package/src/gallery/edit.js

@@ -144,7 +144,7 @@ function GalleryEdit( props ) {
 	useEffect( () => {
 		newImages?.forEach( ( newImage ) => {
 			updateBlockAttributes( newImage.clientId, {
-				...buildImageAttributes( false, newImage.attributes ),
+				...buildImageAttributes( newImage.attributes ),
 				id: newImage.id,
 				align: undefined,
 			} );
@@ -176,26 +176,24 @@ function GalleryEdit( props ) {
 	 * it already existed in the gallery. If the image is in fact new, we need
 	 * to apply the gallery's current settings to the image.
 	 *
-	 * @param {Object} existingBlock Existing Image block that still exists after gallery update.
-	 * @param {Object} image         Media object for the actual image.
-	 * @return {Object}               Attributes to set on the new image block.
+	 * @param {Object} imageAttributes Media object for the actual image.
+	 * @return {Object}                Attributes to set on the new image block.
 	 */
-	function buildImageAttributes( existingBlock, image ) {
-		if ( existingBlock ) {
-			return existingBlock.attributes;
-		}
+	function buildImageAttributes( imageAttributes ) {
+		const image = imageAttributes.id
+			? find( imageData, { id: imageAttributes.id } )
+			: null;
 
 		let newClassName;
-		if ( image.className && image.className !== '' ) {
-			newClassName = image.className;
+		if ( imageAttributes.className && imageAttributes.className !== '' ) {
+			newClassName = imageAttributes.className;
 		} else {
 			newClassName = preferredStyle
 				? `is-style-${ preferredStyle }`
 				: undefined;
 		}
-
 		return {
-			...pickRelevantMediaFiles( image, sizeSlug ),
+			...pickRelevantMediaFiles( imageAttributes, sizeSlug ),
 			...getHrefAndDestination( image, linkTo ),
 			...getUpdatedLinkTargetSettings( linkTarget, attributes ),
 			className: newClassName,

package/src/gallery/save.js

@@ -16,9 +16,10 @@ import {
  * Internal dependencies
  */
 import saveWithoutInnerBlocks from './v1/save';
+import { isGalleryV2Enabled } from './shared';
 
 export default function saveWithInnerBlocks( { attributes } ) {
-	if ( attributes?.ids?.length > 0 || attributes?.images?.length > 0 ) {
+	if ( ! isGalleryV2Enabled() ) {
 		return saveWithoutInnerBlocks( { attributes } );
 	}
 

package/src/gallery/shared.js

@@ -21,3 +21,27 @@ export const pickRelevantMediaFiles = ( image, sizeSlug = 'large' ) => {
 	}
 	return imageProps;
 };
+
+/**
+ * The new gallery block format is not compatible with the use_BalanceTags option
+ * in WP versions <= 5.8 https://core.trac.wordpress.org/ticket/54130. The
+ * window.wp.galleryBlockV2Enabled flag is set in lib/compat.php. This method
+ * can be removed when minimum supported WP version >=5.9.
+ */
+export function isGalleryV2Enabled() {
+	// Only run the Gallery version compat check if the plugin is running, otherwise
+	// assume we are in 5.9 core and enable by default.
+	if ( process.env.GUTENBERG_PHASE === 2 ) {
+		// We want to fail early here, at least during beta testing phase, to ensure
+		// there aren't instances where undefined values cause false negatives.
+		if (
+			! window.wp ||
+			typeof window.wp.galleryBlockV2Enabled !== 'boolean'
+		) {
+			throw 'window.wp.galleryBlockV2Enabled is not defined';
+		}
+		return window.wp.galleryBlockV2Enabled;
+	}
+
+	return true;
+}

package/src/gallery/transforms.js

@@ -8,8 +8,6 @@ import { filter, every, toString } from 'lodash';
  */
 import { createBlock } from '@wordpress/blocks';
 import { createBlobURL } from '@wordpress/blob';
-import { select } from '@wordpress/data';
-import { store as blockEditorStore } from '@wordpress/block-editor';
 import { addFilter } from '@wordpress/hooks';
 
 /**
@@ -24,7 +22,7 @@ import {
 	LINK_DESTINATION_ATTACHMENT as DEPRECATED_LINK_DESTINATION_ATTACHMENT,
 	LINK_DESTINATION_MEDIA as DEPRECATED_LINK_DESTINATION_MEDIA,
 } from './v1/constants';
-import { pickRelevantMediaFiles } from './shared';
+import { pickRelevantMediaFiles, isGalleryV2Enabled } from './shared';
 
 const parseShortcodeIds = ( ids ) => {
 	if ( ! ids ) {
@@ -49,9 +47,8 @@ const parseShortcodeIds = ( ids ) => {
  * @return   {Block}                 The transformed block.
  */
 function updateThirdPartyTransformToGallery( block ) {
-	const settings = select( blockEditorStore ).getSettings();
 	if (
-		settings.__unstableGalleryWithImageBlocks &&
+		isGalleryV2Enabled() &&
 		block.name === 'core/gallery' &&
 		block.attributes?.images.length > 0
 	) {
@@ -145,8 +142,7 @@ const transforms = {
 
 				const validImages = filter( attributes, ( { url } ) => url );
 
-				const settings = select( blockEditorStore ).getSettings();
-				if ( settings.__unstableGalleryWithImageBlocks ) {
+				if ( isGalleryV2Enabled() ) {
 					const innerBlocks = validImages.map( ( image ) => {
 						return createBlock( 'core/image', image );
 					} );
@@ -184,10 +180,7 @@ const transforms = {
 				images: {
 					type: 'array',
 					shortcode: ( { named: { ids } } ) => {
-						const settings = select(
-							blockEditorStore
-						).getSettings();
-						if ( ! settings.__unstableGalleryWithImageBlocks ) {
+						if ( ! isGalleryV2Enabled() ) {
 							return parseShortcodeIds( ids ).map( ( id ) => ( {
 								id: toString( id ),
 							} ) );
@@ -197,10 +190,7 @@ const transforms = {
 				ids: {
 					type: 'array',
 					shortcode: ( { named: { ids } } ) => {
-						const settings = select(
-							blockEditorStore
-						).getSettings();
-						if ( ! settings.__unstableGalleryWithImageBlocks ) {
+						if ( ! isGalleryV2Enabled() ) {
 							return parseShortcodeIds( ids );
 						}
 					},
@@ -208,10 +198,7 @@ const transforms = {
 				shortCodeTransforms: {
 					type: 'array',
 					shortcode: ( { named: { ids } } ) => {
-						const settings = select(
-							blockEditorStore
-						).getSettings();
-						if ( settings.__unstableGalleryWithImageBlocks ) {
+						if ( isGalleryV2Enabled() ) {
 							return parseShortcodeIds( ids ).map( ( id ) => ( {
 								id: parseInt( id ),
 							} ) );
@@ -227,10 +214,7 @@ const transforms = {
 				linkTo: {
 					type: 'string',
 					shortcode: ( { named: { link } } ) => {
-						const settings = select(
-							blockEditorStore
-						).getSettings();
-						if ( ! settings.__unstableGalleryWithImageBlocks ) {
+						if ( ! isGalleryV2Enabled() ) {
 							switch ( link ) {
 								case 'post':
 									return DEPRECATED_LINK_DESTINATION_ATTACHMENT;
@@ -273,8 +257,7 @@ const transforms = {
 				);
 			},
 			transform( files ) {
-				const settings = select( blockEditorStore ).getSettings();
-				if ( settings.__unstableGalleryWithImageBlocks ) {
+				if ( isGalleryV2Enabled() ) {
 					const innerBlocks = files.map( ( file ) =>
 						createBlock( 'core/image', {
 							url: createBlobURL( file ),
@@ -299,8 +282,7 @@ const transforms = {
 			type: 'block',
 			blocks: [ 'core/image' ],
 			transform: ( { align, images, ids, sizeSlug }, innerBlocks ) => {
-				const settings = select( blockEditorStore ).getSettings();
-				if ( settings.__unstableGalleryWithImageBlocks ) {
+				if ( isGalleryV2Enabled() ) {
 					if ( innerBlocks.length > 0 ) {
 						return innerBlocks.map(
 							( {

package/src/gallery/use-mobile-warning.js

@@ -20,7 +20,7 @@ export default function useMobileWarning( newImages ) {
 
 	createWarningNotice(
 		__(
-			'Editing this Gallery in the WordPress mobile app requires version 18.2 or higher.'
+			'If you want to edit the gallery you just added in the mobile app, to avoid losing any data please make sure you use version 18.2 of the app or above.'
 		),
 		{ type: 'snackbar', explicitDismiss: true }
 	);

package/src/gallery/v1/edit.js

@@ -24,10 +24,8 @@ import {
 	ToggleControl,
 	withNotices,
 	RangeControl,
-	ToolbarButton,
 } from '@wordpress/components';
 import {
-	BlockControls,
 	MediaPlaceholder,
 	InspectorControls,
 	useBlockProps,
@@ -53,7 +51,6 @@ import {
 	LINK_DESTINATION_MEDIA,
 	LINK_DESTINATION_NONE,
 } from './constants';
-import UpdateGalleryModal from './update-gallery-modal';
 
 const MAX_COLUMNS = 8;
 const linkOptions = [
@@ -102,13 +99,10 @@ function GalleryEdit( props ) {
 		mediaUpload,
 		getMedia,
 		wasBlockJustInserted,
-		__unstableGalleryWithImageBlocks,
 	} = useSelect( ( select ) => {
 		const settings = select( blockEditorStore ).getSettings();
 
 		return {
-			__unstableGalleryWithImageBlocks:
-				settings.__unstableGalleryWithImageBlocks,
 			imageSizes: settings.imageSizes,
 			mediaUpload: settings.mediaUpload,
 			getMedia: select( coreStore ).getMedia,
@@ -414,10 +408,6 @@ function GalleryEdit( props ) {
 		/>
 	);
 
-	const [ isUpdateOpen, setUpdateOpen ] = useState( false );
-	const openUpdateModal = () => setUpdateOpen( true );
-	const closeUpdateModal = () => setUpdateOpen( false );
-
 	const blockProps = useBlockProps();
 
 	if ( ! hasImages ) {
@@ -466,24 +456,7 @@ function GalleryEdit( props ) {
 					) }
 				</PanelBody>
 			</InspectorControls>
-			{ /* TODO: Remove platform condition when native conversion is ready */ }
-			{ Platform.isWeb && __unstableGalleryWithImageBlocks && (
-				<BlockControls group="other">
-					<ToolbarButton
-						onClick={ openUpdateModal }
-						title={ __( 'Update' ) }
-						label={ __( 'Update to the new gallery format' ) }
-					>
-						{ __( 'Update' ) }
-					</ToolbarButton>
-				</BlockControls>
-			) }
-			{ Platform.isWeb && isUpdateOpen && (
-				<UpdateGalleryModal
-					onClose={ closeUpdateModal }
-					clientId={ clientId }
-				/>
-			) }
+
 			{ noticeUI }
 			<Gallery
 				{ ...props }

package/src/navigation/edit/index.js

@@ -437,6 +437,7 @@ function Navigation( {
 					{ hasColorSettings && (
 						<PanelColorSettings
 							__experimentalHasMultipleOrigins
+							__experimentalIsRenderedInSidebar
 							title={ __( 'Color' ) }
 							initialOpen={ false }
 							colorSettings={ [

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

@@ -110,11 +110,6 @@ export default function NavigationInnerBlocks( {
 			__experimentalDirectInsert: shouldDirectInsert,
 			orientation,
 			renderAppender: CustomAppender || appender,
-
-			// Ensure block toolbar is not too far removed from item
-			// being edited when in vertical mode.
-			// see: https://github.com/WordPress/gutenberg/pull/34615.
-			__experimentalCaptureToolbars: orientation !== 'vertical',
 			// Template lock set to false here so that the Nav
 			// Block on the experimental menus screen does not
 			// inherit templateLock={ 'all' }.

package/src/navigation/index.php

@@ -5,6 +5,120 @@
  * @package WordPress
  */
 
+// These functions are used for the __unstableLocation feature and only active
+// when the gutenberg plugin is active.
+if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) {
+	/**
+	 * Returns the menu items for a WordPress menu location.
+	 *
+	 * @param string $location The menu location.
+	 * @return array Menu items for the location.
+	 */
+	function block_core_navigation_get_menu_items_at_location( $location ) {
+		if ( empty( $location ) ) {
+			return;
+		}
+
+		// Build menu data. The following approximates the code in
+		// `wp_nav_menu()` and `gutenberg_output_block_nav_menu`.
+
+		// Find the location in the list of locations, returning early if the
+		// location can't be found.
+		$locations = get_nav_menu_locations();
+		if ( ! isset( $locations[ $location ] ) ) {
+			return;
+		}
+
+		// Get the menu from the location, returning early if there is no
+		// menu or there was an error.
+		$menu = wp_get_nav_menu_object( $locations[ $location ] );
+		if ( ! $menu || is_wp_error( $menu ) ) {
+			return;
+		}
+
+		$menu_items = wp_get_nav_menu_items( $menu->term_id, array( 'update_post_term_cache' => false ) );
+		_wp_menu_item_classes_by_context( $menu_items );
+
+		return $menu_items;
+	}
+
+
+	/**
+	 * Sorts a standard array of menu items into a nested structure keyed by the
+	 * id of the parent menu.
+	 *
+	 * @param array $menu_items Menu items to sort.
+	 * @return array An array keyed by the id of the parent menu where each element
+	 *               is an array of menu items that belong to that parent.
+	 */
+	function block_core_navigation_sort_menu_items_by_parent_id( $menu_items ) {
+		$sorted_menu_items = array();
+		foreach ( (array) $menu_items as $menu_item ) {
+			$sorted_menu_items[ $menu_item->menu_order ] = $menu_item;
+		}
+		unset( $menu_items, $menu_item );
+
+		$menu_items_by_parent_id = array();
+		foreach ( $sorted_menu_items as $menu_item ) {
+			$menu_items_by_parent_id[ $menu_item->menu_item_parent ][] = $menu_item;
+		}
+
+		return $menu_items_by_parent_id;
+	}
+
+	/**
+	 * Turns menu item data into a nested array of parsed blocks
+	 *
+	 * @param array $menu_items               An array of menu items that represent
+	 *                                        an individual level of a menu.
+	 * @param array $menu_items_by_parent_id  An array keyed by the id of the
+	 *                                        parent menu where each element is an
+	 *                                        array of menu items that belong to
+	 *                                        that parent.
+	 * @return array An array of parsed block data.
+	 */
+	function block_core_navigation_parse_blocks_from_menu_items( $menu_items, $menu_items_by_parent_id ) {
+		if ( empty( $menu_items ) ) {
+			return array();
+		}
+
+		$blocks = array();
+
+		foreach ( $menu_items as $menu_item ) {
+			$class_name       = ! empty( $menu_item->classes ) ? implode( ' ', (array) $menu_item->classes ) : null;
+			$id               = ( null !== $menu_item->object_id && 'custom' !== $menu_item->object ) ? $menu_item->object_id : null;
+			$opens_in_new_tab = null !== $menu_item->target && '_blank' === $menu_item->target;
+			$rel              = ( null !== $menu_item->xfn && '' !== $menu_item->xfn ) ? $menu_item->xfn : null;
+			$kind             = null !== $menu_item->type ? str_replace( '_', '-', $menu_item->type ) : 'custom';
+
+			$block = array(
+				'blockName' => isset( $menu_items_by_parent_id[ $menu_item->ID ] ) ? 'core/navigation-submenu' : 'core/navigation-link',
+				'attrs'     => array(
+					'className'     => $class_name,
+					'description'   => $menu_item->description,
+					'id'            => $id,
+					'kind'          => $kind,
+					'label'         => $menu_item->title,
+					'opensInNewTab' => $opens_in_new_tab,
+					'rel'           => $rel,
+					'title'         => $menu_item->attr_title,
+					'type'          => $menu_item->object,
+					'url'           => $menu_item->url,
+				),
+			);
+
+			$block['innerBlocks']  = isset( $menu_items_by_parent_id[ $menu_item->ID ] )
+				? block_core_navigation_parse_blocks_from_menu_items( $menu_items_by_parent_id[ $menu_item->ID ], $menu_items_by_parent_id )
+				: array();
+			$block['innerContent'] = array_map( 'serialize_block', $block['innerBlocks'] );
+
+			$blocks[] = $block;
+		}
+
+		return $blocks;
+	}
+}
+
 /**
  * Build an array with CSS classes and inline styles defining the colors
  * which will be applied to the navigation markup in the front-end.
@@ -145,17 +259,23 @@ function block_core_navigation_get_first_non_empty_navigation() {
 	// see:
 	// - https://github.com/WordPress/wordpress-develop/blob/ba943e113d3b31b121f77a2d30aebe14b047c69d/src/wp-includes/nav-menu.php#L613-L619.
 	// - https://developer.wordpress.org/reference/classes/wp_query/#order-orderby-parameters.
-	$navigation_posts = get_posts(
-		array(
-			'post_type'      => 'wp_navigation',
-			'order'          => 'ASC',
-			'orderby'        => 'name',
-			'posts_per_page' => 1, // only the first post.
-			's'              => '<!-- wp:', // look for block indicators to ensure we only include non-empty Navigations.
-		)
+	$parsed_args = array(
+		'post_type'      => 'wp_navigation',
+		'no_found_rows'  => true,
+		'order'          => 'ASC',
+		'orderby'        => 'name',
+		'post_status'    => 'publish',
+		'posts_per_page' => 20, // Try the first 20 posts.
 	);
-	return count( $navigation_posts ) ? $navigation_posts[0] : null;
 
+	$navigation_posts = new WP_Query( $parsed_args );
+	foreach ( $navigation_posts->posts as $navigation_post ) {
+		if ( has_blocks( $navigation_post ) ) {
+			return $navigation_post;
+		}
+	}
+
+	return null;
 }
 
 /**
@@ -272,22 +392,33 @@ function render_block_core_navigation( $attributes, $content, $block ) {
 
 	$inner_blocks = $block->inner_blocks;
 
-	// If `__unstableLocation` is defined, create inner blocks from the classic menu assigned to that location.
-	if ( empty( $inner_blocks ) && array_key_exists( '__unstableLocation', $attributes ) ) {
-		$menu_items = gutenberg_get_menu_items_at_location( $attributes['__unstableLocation'] );
+	// Ensure that blocks saved with the legacy ref attribute name (navigationMenuId) continue to render.
+	if ( array_key_exists( 'navigationMenuId', $attributes ) ) {
+		$attributes['ref'] = $attributes['navigationMenuId'];
+	}
+
+	// If:
+	// - the gutenberg plugin is active
+	// - `__unstableLocation` is defined
+	// - we have menu items at the defined location
+	// - we don't have a relationship to a `wp_navigation` Post (via `ref`).
+	// ...then create inner blocks from the classic menu assigned to that location.
+	if (
+		defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN &&
+		array_key_exists( '__unstableLocation', $attributes ) &&
+		! array_key_exists( 'ref', $attributes ) &&
+		! empty( block_core_navigation_get_menu_items_at_location( $attributes['__unstableLocation'] ) )
+	) {
+		$menu_items = block_core_navigation_get_menu_items_at_location( $attributes['__unstableLocation'] );
 		if ( empty( $menu_items ) ) {
 			return '';
 		}
 
-		$menu_items_by_parent_id = gutenberg_sort_menu_items_by_parent_id( $menu_items );
-		$parsed_blocks           = gutenberg_parse_blocks_from_menu_items( $menu_items_by_parent_id[0], $menu_items_by_parent_id );
+		$menu_items_by_parent_id = block_core_navigation_sort_menu_items_by_parent_id( $menu_items );
+		$parsed_blocks           = block_core_navigation_parse_blocks_from_menu_items( $menu_items_by_parent_id[0], $menu_items_by_parent_id );
 		$inner_blocks            = new WP_Block_List( $parsed_blocks, $attributes );
 	}
 
-	// Ensure that blocks saved with the legacy ref attribute name (navigationMenuId) continue to render.
-	if ( array_key_exists( 'navigationMenuId', $attributes ) ) {
-		$attributes['ref'] = $attributes['navigationMenuId'];
-	}
 	// Load inner blocks from the navigation post.
 	if ( array_key_exists( 'ref', $attributes ) ) {
 		$navigation_post = get_post( $attributes['ref'] );

package/src/navigation/style.scss

@@ -426,7 +426,10 @@ button.wp-block-navigation-item__content {
 			align-items: var(--layout-justification-setting, inherit);
 
 			// Always align the contents of the menu to the top.
-			justify-content: flex-start;
+			&,
+			.wp-block-navigation__container {
+				justify-content: flex-start;
+			}
 
 			// Allow menu to scroll.
 			overflow: auto;

package/src/navigation-submenu/edit.js

@@ -508,6 +508,12 @@ export default function NavigationSubmenuEdit( {
 			allowedBlocks: ALLOWED_BLOCKS,
 			__experimentalDefaultBlock: DEFAULT_BLOCK,
 			__experimentalDirectInsert: true,
+
+			// Ensure block toolbar is not too far removed from item
+			// being edited.
+			// see: https://github.com/WordPress/gutenberg/pull/34615.
+			__experimentalCaptureToolbars: true,
+
 			renderAppender:
 				isSelected ||
 				( isImmediateParentOfSelectedBlock &&

package/src/navigation-submenu/index.php

@@ -163,7 +163,32 @@ function render_block_core_navigation_submenu( $attributes, $content, $block ) {
 			'style' => $style_attribute,
 		)
 	);
-	$html               = '<li ' . $wrapper_attributes . '>';
+
+	$label = '';
+
+	if ( isset( $attributes['label'] ) ) {
+		$label .= wp_kses(
+			$attributes['label'],
+			array(
+				'code'   => array(),
+				'em'     => array(),
+				'img'    => array(
+					'scale' => array(),
+					'class' => array(),
+					'style' => array(),
+					'src'   => array(),
+					'alt'   => array(),
+				),
+				's'      => array(),
+				'span'   => array(
+					'style' => array(),
+				),
+				'strong' => array(),
+			)
+		);
+	}
+
+	$html = '<li ' . $wrapper_attributes . '>';
 
 	// If Submenus open on hover, we render an anchor tag with attributes.
 	// If submenu icons are set to show, we also render a submenu button, so the submenu can be opened on click.
@@ -193,27 +218,7 @@ function render_block_core_navigation_submenu( $attributes, $content, $block ) {
 		$html .= '>';
 		// End appending HTML attributes to anchor tag.
 
-		if ( isset( $attributes['label'] ) ) {
-			$html .= wp_kses(
-				$attributes['label'],
-				array(
-					'code'   => array(),
-					'em'     => array(),
-					'img'    => array(
-						'scale' => array(),
-						'class' => array(),
-						'style' => array(),
-						'src'   => array(),
-						'alt'   => array(),
-					),
-					's'      => array(),
-					'span'   => array(
-						'style' => array(),
-					),
-					'strong' => array(),
-				)
-			);
-		}
+		$html .= $label;
 
 		$html .= '</a>';
 		// End anchor tag content.
@@ -221,36 +226,16 @@ function render_block_core_navigation_submenu( $attributes, $content, $block ) {
 		if ( $show_submenu_indicators ) {
 			// The submenu icon is rendered in a button here
 			// so that there's a clickable elment to open the submenu.
-			$html .= '<button class="wp-block-navigation__submenu-icon wp-block-navigation-submenu__toggle" aria-expanded="false">' . block_core_navigation_submenu_render_submenu_icon() . '</button>';
+			$html .= '<button aria-label="' . $label . ' ' . __( 'submenu', 'gutenberg' ) . '" class="wp-block-navigation__submenu-icon wp-block-navigation-submenu__toggle" aria-expanded="false">' . block_core_navigation_submenu_render_submenu_icon() . '</button>';
 		}
 	} else {
 		// If menus open on click, we render the parent as a button.
-		$html .= '<button class="wp-block-navigation-item__content wp-block-navigation-submenu__toggle" aria-expanded="false">';
+		$html .= '<button aria-label="' . $label . ' ' . __( 'submenu', 'gutenberg' ) . '" class="wp-block-navigation-item__content wp-block-navigation-submenu__toggle" aria-expanded="false">';
 
 		// Wrap title with span to isolate it from submenu icon.
 		$html .= '<span class="wp-block-navigation-item__label">';
 
-		if ( isset( $attributes['label'] ) ) {
-			$html .= wp_kses(
-				$attributes['label'],
-				array(
-					'code'   => array(),
-					'em'     => array(),
-					'img'    => array(
-						'scale' => array(),
-						'class' => array(),
-						'style' => array(),
-						'src'   => array(),
-						'alt'   => array(),
-					),
-					's'      => array(),
-					'span'   => array(
-						'style' => array(),
-					),
-					'strong' => array(),
-				)
-			);
-		}
+		$html .= $label;
 
 		$html .= '</span>';