@wordpress/block-library 8.3.1 → 8.3.3

package/src/classic.scss

@@ -13,3 +13,8 @@
 
 	font-size: 1.125em;
 }
+
+.wp-block-file__button {
+	background: #32373c;
+	color: $white;
+}

package/src/cover/edit/index.js

@@ -116,7 +116,10 @@ function CoverEdit( {
 	// we define the url and background type
 	// depending on the value of the useFeaturedImage flag
 	// to preview in edit the dynamic featured image
-	const url = useFeaturedImage ? mediaUrl : attributes.url;
+	const url = useFeaturedImage
+		? mediaUrl
+		: // Ensure the url is not malformed due to sanitization through `wp_kses`.
+		  attributes.url?.replaceAll( '&', '&' );
 	const backgroundType = useFeaturedImage
 		? IMAGE_BACKGROUND_TYPE
 		: attributes.backgroundType;

package/src/editor.scss

@@ -93,3 +93,8 @@
  * These are only output in the editor, but styles here are NOT prefixed .editor-styles-wrapper.
  * This allows us to create normalization styles that are easily overridden by editor styles.
  */
+
+// Remove the browser default border for iframe in Custom HTML block, Embed block, etc.
+.editor-styles-wrapper iframe:not([frameborder]) {
+	border: 0;
+}

package/src/gallery/index.php

@@ -99,12 +99,13 @@ function block_core_gallery_render( $attributes, $content ) {
 	}
 
 	// Set the CSS variable to the column value, and the `gap` property to the combined gap value.
-	$gallery_styles   = array();
-	$gallery_styles[] = array(
-		'selector'     => ".wp-block-gallery.{$unique_gallery_classname}",
-		'declarations' => array(
-			'--wp--style--unstable-gallery-gap' => $gap_column,
-			'gap'                               => $gap_value,
+	$gallery_styles = array(
+		array(
+			'selector'     => ".wp-block-gallery.{$unique_gallery_classname}",
+			'declarations' => array(
+				'--wp--style--unstable-gallery-gap' => $gap_column,
+				'gap'                               => $gap_value,
+			),
 		),
 	);
 

package/src/image/image.js

@@ -124,30 +124,37 @@ export default function Image( {
 		},
 		[ id, isSelected, clientId ]
 	);
-	const { canInsertCover, imageEditing, imageSizes, mediaUpload } = useSelect(
-		( select ) => {
-			const { getBlockRootClientId, getSettings, canInsertBlockType } =
-				select( blockEditorStore );
-
-			const rootClientId = getBlockRootClientId( clientId );
-			const settings = Object.fromEntries(
-				Object.entries( getSettings() ).filter( ( [ key ] ) =>
-					[ 'imageEditing', 'imageSizes', 'mediaUpload' ].includes(
-						key
+	const { canInsertCover, imageEditing, imageSizes, maxWidth, mediaUpload } =
+		useSelect(
+			( select ) => {
+				const {
+					getBlockRootClientId,
+					getSettings,
+					canInsertBlockType,
+				} = select( blockEditorStore );
+
+				const rootClientId = getBlockRootClientId( clientId );
+				const settings = Object.fromEntries(
+					Object.entries( getSettings() ).filter( ( [ key ] ) =>
+						[
+							'imageEditing',
+							'imageSizes',
+							'maxWidth',
+							'mediaUpload',
+						].includes( key )
 					)
-				)
-			);
+				);
 
-			return {
-				...settings,
-				canInsertCover: canInsertBlockType(
-					'core/cover',
-					rootClientId
-				),
-			};
-		},
-		[ clientId ]
-	);
+				return {
+					...settings,
+					canInsertCover: canInsertBlockType(
+						'core/cover',
+						rootClientId
+					),
+				};
+			},
+			[ clientId ]
+		);
 	const { replaceBlocks, toggleSelection } = useDispatch( blockEditorStore );
 	const { createErrorNotice, createSuccessNotice } =
 		useDispatch( noticesStore );
@@ -548,9 +555,13 @@ export default function Image( {
 		// With the current implementation of ResizableBox, an image needs an
 		// explicit pixel value for the max-width. In absence of being able to
 		// set the content-width, this max-width is currently dictated by the
-		// vanilla editor style. We'll use the clientWidth here, to prevent the width
-		// of the image growing larger than the width of the block column.
-		const maxWidthBuffer = clientWidth;
+		// vanilla editor style. The following variable adds a buffer to this
+		// vanilla style, so 3rd party themes have some wiggleroom. This does,
+		// in most cases, allow you to scale the image beyond the width of the
+		// main column, though not infinitely.
+		// @todo It would be good to revisit this once a content-width variable
+		// becomes available.
+		const maxWidthBuffer = maxWidth * 2.5;
 
 		let showRightHandle = false;
 		let showLeftHandle = false;

package/src/navigation/edit/index.js

@@ -27,7 +27,7 @@ import {
 	__experimentalUseBlockOverlayActive as useBlockOverlayActive,
 	__experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients,
 } from '@wordpress/block-editor';
-import { EntityProvider, store as coreStore } from '@wordpress/core-data';
+import { EntityProvider } from '@wordpress/core-data';
 
 import { useDispatch } from '@wordpress/data';
 import {
@@ -112,7 +112,6 @@ function Navigation( {
 
 	const recursionId = `navigationMenu/${ ref }`;
 	const hasAlreadyRendered = useHasRecursion( recursionId );
-	const { editEntityRecord } = useDispatch( coreStore );
 
 	// Preload classic menus, so that they don't suddenly pop-in when viewing
 	// the Select Menu dropdown.
@@ -128,11 +127,6 @@ function Navigation( {
 			name: 'block-library/core/navigation/classic-menu-conversion',
 		} );
 
-	const [ showMenuAutoPublishDraftNotice, hideMenuAutoPublishDraftNotice ] =
-		useNavigationNotice( {
-			name: 'block-library/core/navigation/auto-publish-draft',
-		} );
-
 	const [
 		showNavigationMenuPermissionsNotice,
 		hideNavigationMenuPermissionsNotice,
@@ -209,7 +203,6 @@ function Navigation( {
 		isNavigationMenuResolved,
 		isNavigationMenuMissing,
 		navigationMenus,
-		navigationMenu,
 		canUserUpdateNavigationMenu,
 		hasResolvedCanUserUpdateNavigationMenu,
 		canUserDeleteNavigationMenu,
@@ -536,26 +529,6 @@ function Navigation( {
 		{ open: overlayMenuPreview }
 	);
 
-	// Prompt the user to publish the menu they have set as a draft
-	const isDraftNavigationMenu = navigationMenu?.status === 'draft';
-	useEffect( () => {
-		hideMenuAutoPublishDraftNotice();
-		if ( ! isDraftNavigationMenu ) {
-			return;
-		}
-		editEntityRecord(
-			'postType',
-			'wp_navigation',
-			navigationMenu?.id,
-			{ status: 'publish' },
-			{ throwOnError: true }
-		).catch( () => {
-			showMenuAutoPublishDraftNotice(
-				__( 'Error occurred while publishing the navigation menu.' )
-			);
-		} );
-	}, [ isDraftNavigationMenu, navigationMenu ] );
-
 	const colorGradientSettings = useMultipleOriginColorsAndGradients();
 	const stylingInspectorControls = (
 		<>
@@ -752,8 +725,6 @@ function Navigation( {
 					<UnsavedInnerBlocks
 						createNavigationMenu={ createNavigationMenu }
 						blocks={ uncontrolledInnerBlocks }
-						templateLock={ templateLock }
-						navigationMenus={ navigationMenus }
 						hasSelection={ isSelected || isInnerBlockSelected }
 					/>
 				</ResponsiveWrapper>

package/src/navigation/edit/menu-inspector-controls.js

@@ -2,7 +2,7 @@
  * WordPress dependencies
  */
 import {
-	experiments as blockEditorExperiments,
+	privateApis as blockEditorPrivateApis,
 	InspectorControls,
 	store as blockEditorStore,
 } from '@wordpress/block-editor';
@@ -20,7 +20,7 @@ import { __, sprintf } from '@wordpress/i18n';
  */
 import NavigationMenuSelector from './navigation-menu-selector';
 import { LeafMoreMenu } from '../leaf-more-menu';
-import { unlock } from '../../experiments';
+import { unlock } from '../../private-apis';
 import DeletedNavigationWarning from './deleted-navigation-warning';
 import useNavigationMenu from '../use-navigation-menu';
 
@@ -34,7 +34,8 @@ const MainContent = ( {
 	isNavigationMenuMissing,
 	onCreateNew,
 } ) => {
-	const { OffCanvasEditor } = unlock( blockEditorExperiments );
+	const { OffCanvasEditor } = unlock( blockEditorPrivateApis );
+
 	// Provide a hierarchy of clientIds for the given Navigation block (clientId).
 	// This is required else the list view will display the entire block tree.
 	const clientIdsTree = useSelect(

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

@@ -39,7 +39,6 @@ const ALLOWED_BLOCKS = [
 export default function UnsavedInnerBlocks( {
 	blocks,
 	createNavigationMenu,
-
 	hasSelection,
 } ) {
 	const originalBlocks = useRef();
@@ -91,37 +90,34 @@ export default function UnsavedInnerBlocks( {
 		}
 	);
 
-	const { isSaving, draftNavigationMenus, hasResolvedDraftNavigationMenus } =
-		useSelect(
-			( select ) => {
-				if ( isDisabled ) {
-					return EMPTY_OBJECT;
-				}
-
-				const {
-					getEntityRecords,
-					hasFinishedResolution,
-					isSavingEntityRecord,
-				} = select( coreStore );
-
-				return {
-					isSaving: isSavingEntityRecord(
-						'postType',
-						'wp_navigation'
-					),
-					draftNavigationMenus: getEntityRecords(
-						...DRAFT_MENU_PARAMS
-					),
-					hasResolvedDraftNavigationMenus: hasFinishedResolution(
-						'getEntityRecords',
-						DRAFT_MENU_PARAMS
-					),
-				};
-			},
-			[ isDisabled ]
-		);
-
-	const { hasResolvedNavigationMenus, navigationMenus } = useNavigationMenu();
+	const { isSaving, hasResolvedDraftNavigationMenus } = useSelect(
+		( select ) => {
+			if ( isDisabled ) {
+				return EMPTY_OBJECT;
+			}
+
+			const {
+				getEntityRecords,
+				hasFinishedResolution,
+				isSavingEntityRecord,
+			} = select( coreStore );
+
+			return {
+				isSaving: isSavingEntityRecord( 'postType', 'wp_navigation' ),
+				draftNavigationMenus: getEntityRecords(
+					// This is needed so that hasResolvedDraftNavigationMenus gives the correct status.
+					...DRAFT_MENU_PARAMS
+				),
+				hasResolvedDraftNavigationMenus: hasFinishedResolution(
+					'getEntityRecords',
+					DRAFT_MENU_PARAMS
+				),
+			};
+		},
+		[ isDisabled ]
+	);
+
+	const { hasResolvedNavigationMenus } = useNavigationMenu();
 
 	// Automatically save the uncontrolled blocks.
 	useEffect( () => {
@@ -154,11 +150,8 @@ export default function UnsavedInnerBlocks( {
 		isSaving,
 		hasResolvedDraftNavigationMenus,
 		hasResolvedNavigationMenus,
-		draftNavigationMenus,
-		navigationMenus,
+		innerBlocksAreDirty,
 		hasSelection,
-		createNavigationMenu,
-		blocks,
 	] );
 
 	const Wrapper = isSaving ? Disabled : 'div';

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

@@ -21,7 +21,7 @@ export default function useCreateNavigationMenu( clientId ) {
 	const [ value, setValue ] = useState( null );
 	const [ error, setError ] = useState( null );
 
-	const { saveEntityRecord } = useDispatch( coreStore );
+	const { saveEntityRecord, editEntityRecord } = useDispatch( coreStore );
 	const generateDefaultTitle = useGenerateDefaultNavigationTitle( clientId );
 
 	// This callback uses data from the two placeholder steps and only creates
@@ -68,6 +68,18 @@ export default function useCreateNavigationMenu( clientId ) {
 				.then( ( response ) => {
 					setValue( response );
 					setStatus( CREATE_NAVIGATION_MENU_SUCCESS );
+
+					// Set the status to publish so that the Navigation block
+					// shows up in the multi entity save flow.
+					if ( postStatus !== 'publish' ) {
+						editEntityRecord(
+							'postType',
+							'wp_navigation',
+							response.id,
+							{ status: 'publish' }
+						);
+					}
+
 					return response;
 				} )
 				.catch( ( err ) => {

package/src/navigation/index.php

@@ -65,58 +65,58 @@ if ( defined( 'IS_GUTENBERG_PLUGIN' ) && IS_GUTENBERG_PLUGIN ) {
 
 		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();
-		}
+/**
+ * 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,
+			),
+		);
 
-		$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;
-		}
+		$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'] );
 
-		return $blocks;
+		$blocks[] = $block;
 	}
+
+	return $blocks;
 }
 
 /**
@@ -874,35 +874,3 @@ function block_core_navigation_typographic_presets_backcompatibility( $parsed_bl
 }
 
 add_filter( 'render_block_data', 'block_core_navigation_typographic_presets_backcompatibility' );
-
-/**
- * Enables animation of the block inspector for the Navigation block.
- *
- * See:
- * - https://github.com/WordPress/gutenberg/pull/46342
- * - https://github.com/WordPress/gutenberg/issues/45884
- *
- * @param array $settings Default editor settings.
- * @return array Filtered editor settings.
- */
-function block_core_navigation_enable_inspector_animation( $settings ) {
-	$current_animation_settings = _wp_array_get(
-		$settings,
-		array( '__experimentalBlockInspectorAnimation' ),
-		array()
-	);
-
-	$settings['__experimentalBlockInspectorAnimation'] = array_merge(
-		$current_animation_settings,
-		array(
-			'core/navigation' =>
-				array(
-					'enterDirection' => 'leftToRight',
-				),
-		)
-	);
-
-	return $settings;
-}
-
-add_filter( 'block_editor_settings_all', 'block_core_navigation_enable_inspector_animation' );

package/src/navigation-link/index.php

@@ -371,35 +371,3 @@ function register_block_core_navigation_link() {
 	);
 }
 add_action( 'init', 'register_block_core_navigation_link' );
-
-/**
- * Enables animation of the block inspector for the Navigation Link block.
- *
- * See:
- * - https://github.com/WordPress/gutenberg/pull/46342
- * - https://github.com/WordPress/gutenberg/issues/45884
- *
- * @param array $settings Default editor settings.
- * @return array Filtered editor settings.
- */
-function block_core_navigation_link_enable_inspector_animation( $settings ) {
-	$current_animation_settings = _wp_array_get(
-		$settings,
-		array( '__experimentalBlockInspectorAnimation' ),
-		array()
-	);
-
-	$settings['__experimentalBlockInspectorAnimation'] = array_merge(
-		$current_animation_settings,
-		array(
-			'core/navigation-link' =>
-				array(
-					'enterDirection' => 'rightToLeft',
-				),
-		)
-	);
-
-	return $settings;
-}
-
-add_filter( 'block_editor_settings_all', 'block_core_navigation_link_enable_inspector_animation' );

package/src/navigation-submenu/index.php

@@ -289,35 +289,3 @@ function register_block_core_navigation_submenu() {
 	);
 }
 add_action( 'init', 'register_block_core_navigation_submenu' );
-
-/**
- * Enables animation of the block inspector for the Navigation Submenu block.
- *
- * See:
- * - https://github.com/WordPress/gutenberg/pull/46342
- * - https://github.com/WordPress/gutenberg/issues/45884
- *
- * @param array $settings Default editor settings.
- * @return array Filtered editor settings.
- */
-function block_core_navigation_submenu_enable_inspector_animation( $settings ) {
-	$current_animation_settings = _wp_array_get(
-		$settings,
-		array( '__experimentalBlockInspectorAnimation' ),
-		array()
-	);
-
-	$settings['__experimentalBlockInspectorAnimation'] = array_merge(
-		$current_animation_settings,
-		array(
-			'core/navigation-submenu' =>
-				array(
-					'enterDirection' => 'rightToLeft',
-				),
-		)
-	);
-
-	return $settings;
-}
-
-add_filter( 'block_editor_settings_all', 'block_core_navigation_submenu_enable_inspector_animation' );

package/src/{experiments.js → private-apis.js}

@@ -1,7 +1,7 @@
 /**
  * WordPress dependencies
  */
-import { __dangerousOptInToUnstableAPIsOnlyForCoreModules } from '@wordpress/experiments';
+import { __dangerousOptInToUnstableAPIsOnlyForCoreModules } from '@wordpress/private-apis';
 
 export const { lock, unlock } =
 	__dangerousOptInToUnstableAPIsOnlyForCoreModules(

package/src/read-more/index.php

@@ -18,12 +18,19 @@ function render_block_core_read_more( $attributes, $content, $block ) {
 		return '';
 	}
 
-	$post_ID            = $block->context['postId'];
-	$post_title         = get_the_title( $post_ID );
+	$post_ID    = $block->context['postId'];
+	$post_title = get_the_title( $post_ID );
+	if ( '' === $post_title ) {
+		$post_title = sprintf(
+			/* translators: %s is post ID to describe the link for screen readers. */
+			__( 'untitled post %s' ),
+			$post_ID
+		);
+	}
 	$screen_reader_text = sprintf(
 		/* translators: %s is either the post title or post ID to describe the link for screen readers. */
 		__( ': %s' ),
-		'' !== $post_title ? $post_title : __( 'untitled post ' ) . $post_ID
+		$post_title
 	);
 	$justify_class_name = empty( $attributes['justifyContent'] ) ? '' : "is-justified-{$attributes['justifyContent']}";
 	$wrapper_attributes = get_block_wrapper_attributes( array( 'class' => $justify_class_name ) );

package/tsconfig.json

@@ -6,6 +6,29 @@
 		"types": [ "gutenberg-env" ],
 		"strictNullChecks": true
 	},
-	"references": [ { "path": "../element" } ],
+	"references": [
+		{ "path": "../a11y" },
+		{ "path": "../api-fetch" },
+		{ "path": "../autop" },
+		{ "path": "../blob" },
+		{ "path": "../block-editor" },
+		{ "path": "../components" },
+		{ "path": "../compose" },
+		{ "path": "../core-data" },
+		{ "path": "../data" },
+		{ "path": "../date" },
+		{ "path": "../deprecated" },
+		{ "path": "../dom" },
+		{ "path": "../element" },
+		{ "path": "../escape-html" },
+		{ "path": "../private-apis" },
+		{ "path": "../hooks" },
+		{ "path": "../html-entities" },
+		{ "path": "../i18n" },
+		{ "path": "../icons" },
+		{ "path": "../keycodes" },
+		{ "path": "../primitives" },
+		{ "path": "../url" }
+	],
 	"include": [ "src/**/*.ts", "src/**/*.tsx" ]
 }