@wordpress/block-library 8.28.3 → 8.28.4

package/build-module/utils/get-transformed-metadata.js

@@ -0,0 +1,51 @@
+/**
+ * WordPress dependencies
+ */
+import { getBlockType } from '@wordpress/blocks';
+
+/**
+ * Transform the metadata attribute with only the values and bindings specified by each transform.
+ * Returns `undefined` if the input metadata is falsy.
+ *
+ * @param {Object}   metadata         Original metadata attribute from the block that is being transformed.
+ * @param {Object}   newBlockName     Name of the final block after the transformation.
+ * @param {Function} bindingsCallback Optional callback to transform the `bindings` property object.
+ * @return {Object|undefined} New metadata object only with the relevant properties.
+ */
+export function getTransformedMetadata(metadata, newBlockName, bindingsCallback) {
+  if (!metadata) {
+    return;
+  }
+  const {
+    supports
+  } = getBlockType(newBlockName);
+  // Fixed until an opt-in mechanism is implemented.
+  const BLOCK_BINDINGS_SUPPORTED_BLOCKS = ['core/paragraph', 'core/heading', 'core/image', 'core/button'];
+  // The metadata properties that should be preserved after the transform.
+  const transformSupportedProps = [];
+  // If it support bindings, and there is a transform bindings callback, add the `id` and `bindings` properties.
+  if (BLOCK_BINDINGS_SUPPORTED_BLOCKS.includes(newBlockName) && bindingsCallback) {
+    transformSupportedProps.push('id', 'bindings');
+  }
+  // If it support block naming (true by default), add the `name` property.
+  if (supports.renaming !== false) {
+    transformSupportedProps.push('name');
+  }
+
+  // Return early if no supported properties.
+  if (!transformSupportedProps.length) {
+    return;
+  }
+  const newMetadata = Object.entries(metadata).reduce((obj, [prop, value]) => {
+    // If prop is not supported, don't add it to the new metadata object.
+    if (!transformSupportedProps.includes(prop)) {
+      return obj;
+    }
+    obj[prop] = prop === 'bindings' ? bindingsCallback(value) : value;
+    return obj;
+  }, {});
+
+  // Return undefined if object is empty.
+  return Object.keys(newMetadata).length ? newMetadata : undefined;
+}
+//# sourceMappingURL=get-transformed-metadata.js.map

package/build-module/utils/get-transformed-metadata.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["getBlockType","getTransformedMetadata","metadata","newBlockName","bindingsCallback","supports","BLOCK_BINDINGS_SUPPORTED_BLOCKS","transformSupportedProps","includes","push","renaming","length","newMetadata","Object","entries","reduce","obj","prop","value","keys","undefined"],"sources":["@wordpress/block-library/src/utils/get-transformed-metadata.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { getBlockType } from '@wordpress/blocks';\n\n/**\n * Transform the metadata attribute with only the values and bindings specified by each transform.\n * Returns `undefined` if the input metadata is falsy.\n *\n * @param {Object}   metadata         Original metadata attribute from the block that is being transformed.\n * @param {Object}   newBlockName     Name of the final block after the transformation.\n * @param {Function} bindingsCallback Optional callback to transform the `bindings` property object.\n * @return {Object|undefined} New metadata object only with the relevant properties.\n */\nexport function getTransformedMetadata(\n\tmetadata,\n\tnewBlockName,\n\tbindingsCallback\n) {\n\tif ( ! metadata ) {\n\t\treturn;\n\t}\n\tconst { supports } = getBlockType( newBlockName );\n\t// Fixed until an opt-in mechanism is implemented.\n\tconst BLOCK_BINDINGS_SUPPORTED_BLOCKS = [\n\t\t'core/paragraph',\n\t\t'core/heading',\n\t\t'core/image',\n\t\t'core/button',\n\t];\n\t// The metadata properties that should be preserved after the transform.\n\tconst transformSupportedProps = [];\n\t// If it support bindings, and there is a transform bindings callback, add the `id` and `bindings` properties.\n\tif (\n\t\tBLOCK_BINDINGS_SUPPORTED_BLOCKS.includes( newBlockName ) &&\n\t\tbindingsCallback\n\t) {\n\t\ttransformSupportedProps.push( 'id', 'bindings' );\n\t}\n\t// If it support block naming (true by default), add the `name` property.\n\tif ( supports.renaming !== false ) {\n\t\ttransformSupportedProps.push( 'name' );\n\t}\n\n\t// Return early if no supported properties.\n\tif ( ! transformSupportedProps.length ) {\n\t\treturn;\n\t}\n\n\tconst newMetadata = Object.entries( metadata ).reduce(\n\t\t( obj, [ prop, value ] ) => {\n\t\t\t// If prop is not supported, don't add it to the new metadata object.\n\t\t\tif ( ! transformSupportedProps.includes( prop ) ) {\n\t\t\t\treturn obj;\n\t\t\t}\n\t\t\tobj[ prop ] =\n\t\t\t\tprop === 'bindings' ? bindingsCallback( value ) : value;\n\t\t\treturn obj;\n\t\t},\n\t\t{}\n\t);\n\n\t// Return undefined if object is empty.\n\treturn Object.keys( newMetadata ).length ? newMetadata : undefined;\n}\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,YAAY,QAAQ,mBAAmB;;AAEhD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,sBAAsBA,CACrCC,QAAQ,EACRC,YAAY,EACZC,gBAAgB,EACf;EACD,IAAK,CAAEF,QAAQ,EAAG;IACjB;EACD;EACA,MAAM;IAAEG;EAAS,CAAC,GAAGL,YAAY,CAAEG,YAAa,CAAC;EACjD;EACA,MAAMG,+BAA+B,GAAG,CACvC,gBAAgB,EAChB,cAAc,EACd,YAAY,EACZ,aAAa,CACb;EACD;EACA,MAAMC,uBAAuB,GAAG,EAAE;EAClC;EACA,IACCD,+BAA+B,CAACE,QAAQ,CAAEL,YAAa,CAAC,IACxDC,gBAAgB,EACf;IACDG,uBAAuB,CAACE,IAAI,CAAE,IAAI,EAAE,UAAW,CAAC;EACjD;EACA;EACA,IAAKJ,QAAQ,CAACK,QAAQ,KAAK,KAAK,EAAG;IAClCH,uBAAuB,CAACE,IAAI,CAAE,MAAO,CAAC;EACvC;;EAEA;EACA,IAAK,CAAEF,uBAAuB,CAACI,MAAM,EAAG;IACvC;EACD;EAEA,MAAMC,WAAW,GAAGC,MAAM,CAACC,OAAO,CAAEZ,QAAS,CAAC,CAACa,MAAM,CACpD,CAAEC,GAAG,EAAE,CAAEC,IAAI,EAAEC,KAAK,CAAE,KAAM;IAC3B;IACA,IAAK,CAAEX,uBAAuB,CAACC,QAAQ,CAAES,IAAK,CAAC,EAAG;MACjD,OAAOD,GAAG;IACX;IACAA,GAAG,CAAEC,IAAI,CAAE,GACVA,IAAI,KAAK,UAAU,GAAGb,gBAAgB,CAAEc,KAAM,CAAC,GAAGA,KAAK;IACxD,OAAOF,GAAG;EACX,CAAC,EACD,CAAC,CACF,CAAC;;EAED;EACA,OAAOH,MAAM,CAACM,IAAI,CAAEP,WAAY,CAAC,CAACD,MAAM,GAAGC,WAAW,GAAGQ,SAAS;AACnE"}

package/build-style/cover/style-rtl.css

@@ -95,7 +95,8 @@
   justify-content: center;
   align-items: center;
   padding: 1em;
-  overflow-x: clip;
+  overflow: hidden;
+  overflow: clip;
   box-sizing: border-box; direction: ltr;
   /**
    * Set a default background color for has-background-dim _unless_ it includes another

package/build-style/cover/style.css

@@ -95,7 +95,8 @@
   justify-content: center;
   align-items: center;
   padding: 1em;
-  overflow-x: clip;
+  overflow: hidden;
+  overflow: clip;
   box-sizing: border-box;
   /*rtl:raw: direction: ltr; */
   /**

package/build-style/search/style-rtl.css

@@ -96,6 +96,8 @@
 .wp-block-search__button svg {
   min-width: 24px;
   min-height: 24px;
+  width: 1.25em;
+  height: 1.25em;
   fill: currentColor;
   vertical-align: text-bottom;
 }

package/build-style/search/style.css

@@ -96,6 +96,8 @@
 .wp-block-search__button svg {
   min-width: 24px;
   min-height: 24px;
+  width: 1.25em;
+  height: 1.25em;
   fill: currentColor;
   vertical-align: text-bottom;
 }

package/build-style/style-rtl.css

@@ -613,7 +613,8 @@
   justify-content: center;
   align-items: center;
   padding: 1em;
-  overflow-x: clip;
+  overflow: hidden;
+  overflow: clip;
   box-sizing: border-box; direction: ltr;
   /**
    * Set a default background color for has-background-dim _unless_ it includes another
@@ -3252,6 +3253,8 @@ ul.wp-block-rss.is-grid li {
 .wp-block-search__button svg {
   min-width: 24px;
   min-height: 24px;
+  width: 1.25em;
+  height: 1.25em;
   fill: currentColor;
   vertical-align: text-bottom;
 }

package/build-style/style.css

@@ -618,7 +618,8 @@
   justify-content: center;
   align-items: center;
   padding: 1em;
-  overflow-x: clip;
+  overflow: hidden;
+  overflow: clip;
   box-sizing: border-box;
   /*rtl:raw: direction: ltr; */
   /**
@@ -3286,6 +3287,8 @@ ul.wp-block-rss.is-grid li {
 .wp-block-search__button svg {
   min-width: 24px;
   min-height: 24px;
+  width: 1.25em;
+  height: 1.25em;
   fill: currentColor;
   vertical-align: text-bottom;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-library",
-	"version": "8.28.3",
+	"version": "8.28.4",
 	"description": "Block library for the WordPress editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -35,11 +35,11 @@
 		"@wordpress/api-fetch": "^6.48.1",
 		"@wordpress/autop": "^3.51.1",
 		"@wordpress/blob": "^3.51.1",
-		"@wordpress/block-editor": "^12.19.3",
-		"@wordpress/blocks": "^12.28.3",
-		"@wordpress/components": "^26.0.2",
+		"@wordpress/block-editor": "^12.19.4",
+		"@wordpress/blocks": "^12.28.4",
+		"@wordpress/components": "^26.0.3",
 		"@wordpress/compose": "^6.28.1",
-		"@wordpress/core-data": "^6.28.3",
+		"@wordpress/core-data": "^6.28.4",
 		"@wordpress/data": "^9.21.1",
 		"@wordpress/date": "^4.51.1",
 		"@wordpress/deprecated": "^3.51.1",
@@ -49,17 +49,17 @@
 		"@wordpress/hooks": "^3.51.1",
 		"@wordpress/html-entities": "^3.51.1",
 		"@wordpress/i18n": "^4.51.1",
-		"@wordpress/icons": "^9.42.1",
-		"@wordpress/interactivity": "^5.0.1",
-		"@wordpress/interactivity-router": "^1.1.1",
+		"@wordpress/icons": "^9.42.2",
+		"@wordpress/interactivity": "^5.0.2",
+		"@wordpress/interactivity-router": "^1.1.2",
 		"@wordpress/keycodes": "^3.51.1",
 		"@wordpress/notices": "^4.19.1",
-		"@wordpress/patterns": "^1.12.3",
+		"@wordpress/patterns": "^1.12.4",
 		"@wordpress/primitives": "^3.49.1",
 		"@wordpress/private-apis": "^0.33.1",
-		"@wordpress/reusable-blocks": "^4.28.3",
+		"@wordpress/reusable-blocks": "^4.28.4",
 		"@wordpress/rich-text": "^6.28.2",
-		"@wordpress/server-side-render": "^4.28.3",
+		"@wordpress/server-side-render": "^4.28.4",
 		"@wordpress/url": "^3.52.1",
 		"@wordpress/viewport": "^5.28.1",
 		"@wordpress/wordcount": "^3.51.1",
@@ -80,5 +80,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "b12d75c5c5256fda2a0509bb432e20ddd3354d5e"
+	"gitHead": "864c1c553cb284def3bd5c907998da45f5c143ea"
 }

package/src/button/edit.js

@@ -45,6 +45,7 @@ import {
 	createBlock,
 	cloneBlock,
 	getDefaultBlockName,
+	store as blocksStore,
 } from '@wordpress/blocks';
 import { useMergeRefs, useRefEffect } from '@wordpress/compose';
 import { useSelect, useDispatch } from '@wordpress/data';
@@ -239,7 +240,7 @@ function ButtonEdit( props ) {
 			}
 
 			const blockBindingsSource = unlock(
-				select( blockEditorStore )
+				select( blocksStore )
 			).getBlockBindingsSource( metadata?.bindings?.url?.source );
 
 			return {

package/src/buttons/transforms.js

@@ -4,6 +4,11 @@
 import { createBlock } from '@wordpress/blocks';
 import { __unstableCreateElement as createElement } from '@wordpress/rich-text';
 
+/**
+ * Internal dependencies
+ */
+import { getTransformedMetadata } from '../utils/get-transformed-metadata';
+
 const transforms = {
 	from: [
 		{
@@ -33,10 +38,8 @@ const transforms = {
 					{},
 					// Loop the selected buttons.
 					buttons.map( ( attributes ) => {
-						const element = createElement(
-							document,
-							attributes.content
-						);
+						const { content, metadata } = attributes;
+						const element = createElement( document, content );
 						// Remove any HTML tags.
 						const text = element.innerText || '';
 						// Get first url.
@@ -46,6 +49,13 @@ const transforms = {
 						return createBlock( 'core/button', {
 							text,
 							url,
+							metadata: getTransformedMetadata(
+								metadata,
+								'core/button',
+								( { content: contentBinding } ) => ( {
+									text: contentBinding,
+								} )
+							),
 						} );
 					} )
 				),

package/src/code/transforms.js

@@ -4,6 +4,11 @@
 import { createBlock } from '@wordpress/blocks';
 import { create, toHTMLString } from '@wordpress/rich-text';
 
+/**
+ * Internal dependencies
+ */
+import { getTransformedMetadata } from '../utils/get-transformed-metadata';
+
 const transforms = {
 	from: [
 		{
@@ -14,17 +19,21 @@ const transforms = {
 		{
 			type: 'block',
 			blocks: [ 'core/paragraph' ],
-			transform: ( { content } ) =>
-				createBlock( 'core/code', { content } ),
+			transform: ( { content, metadata } ) =>
+				createBlock( 'core/code', {
+					content,
+					metadata: getTransformedMetadata( metadata, 'core/code' ),
+				} ),
 		},
 		{
 			type: 'block',
 			blocks: [ 'core/html' ],
-			transform: ( { content: text } ) => {
+			transform: ( { content: text, metadata } ) => {
 				return createBlock( 'core/code', {
 					// The HTML is plain text (with plain line breaks), so
 					// convert it to rich text.
 					content: toHTMLString( { value: create( { text } ) } ),
+					metadata: getTransformedMetadata( metadata, 'core/code' ),
 				} );
 			},
 		},
@@ -51,8 +60,14 @@ const transforms = {
 		{
 			type: 'block',
 			blocks: [ 'core/paragraph' ],
-			transform: ( { content } ) =>
-				createBlock( 'core/paragraph', { content } ),
+			transform: ( { content, metadata } ) =>
+				createBlock( 'core/paragraph', {
+					content,
+					metadata: getTransformedMetadata(
+						metadata,
+						'core/paragraph'
+					),
+				} ),
 		},
 	],
 };

package/src/cover/edit/block-controls.js

@@ -8,6 +8,7 @@ import {
 	MediaReplaceFlow,
 	__experimentalBlockAlignmentMatrixControl as BlockAlignmentMatrixControl,
 	__experimentalBlockFullHeightAligmentControl as FullHeightAlignmentControl,
+	privateApis as blockEditorPrivateApis,
 } from '@wordpress/block-editor';
 import { __ } from '@wordpress/i18n';
 
@@ -15,6 +16,9 @@ import { __ } from '@wordpress/i18n';
  * Internal dependencies
  */
 import { ALLOWED_MEDIA_TYPES } from '../shared';
+import { unlock } from '../../lock-unlock';
+
+const { cleanEmptyObject } = unlock( blockEditorPrivateApis );
 
 export default function CoverBlockControls( {
 	attributes,
@@ -30,7 +34,10 @@ export default function CoverBlockControls( {
 	const [ prevMinHeightValue, setPrevMinHeightValue ] = useState( minHeight );
 	const [ prevMinHeightUnit, setPrevMinHeightUnit ] =
 		useState( minHeightUnit );
-	const isMinFullHeight = minHeightUnit === 'vh' && minHeight === 100;
+	const isMinFullHeight =
+		minHeightUnit === 'vh' &&
+		minHeight === 100 &&
+		! attributes?.style?.dimensions?.aspectRatio;
 	const toggleMinFullHeight = () => {
 		if ( isMinFullHeight ) {
 			// If there aren't previous values, take the default ones.
@@ -51,10 +58,17 @@ export default function CoverBlockControls( {
 		setPrevMinHeightValue( minHeight );
 		setPrevMinHeightUnit( minHeightUnit );
 
-		// Set full height.
+		// Set full height, and clear any aspect ratio value.
 		return setAttributes( {
 			minHeight: 100,
 			minHeightUnit: 'vh',
+			style: cleanEmptyObject( {
+				...attributes?.style,
+				dimensions: {
+					...attributes?.style?.dimensions,
+					aspectRatio: undefined, // Reset aspect ratio when minHeight is set.
+				},
+			} ),
 		} );
 	};
 

package/src/cover/edit/inspector-controls.js

@@ -308,7 +308,11 @@ export default function CoverInspectorControls( {
 					panelId={ clientId }
 				>
 					<CoverHeightInput
-						value={ minHeight }
+						value={
+							attributes?.style?.dimensions?.aspectRatio
+								? ''
+								: minHeight
+						}
 						unit={ minHeightUnit }
 						onChange={ ( newMinHeight ) =>
 							setAttributes( {

package/src/cover/style.scss

@@ -8,9 +8,10 @@
 	align-items: center;
 	padding: 1em;
 	// Prevent the `wp-block-cover__background` span from overflowing the container when border-radius is applied.
+	// `overflow: hidden` is provided as a fallback for browsers that don't support `overflow: clip`.
+	overflow: hidden;
 	// Use clip instead of overflow: hidden so that sticky position works on child elements.
-	// Use overflow-x instead of overflow so that aspect-ratio allows content to expand the area of the cover block.
-	overflow-x: clip;
+	overflow: clip;
 	// This block has customizable padding, border-box makes that more predictable.
 	box-sizing: border-box;
 	// Keep the flex layout direction to the physical direction (LTR) in RTL languages.

package/src/footnotes/index.php

@@ -105,7 +105,7 @@ function register_block_core_footnotes_post_meta() {
 		}
 	}
 }
-/**
+/*
  * Most post types are registered at priority 10, so use priority 20 here in
  * order to catch them.
 */

package/src/heading/transforms.js

@@ -7,6 +7,7 @@ import { createBlock, getBlockAttributes } from '@wordpress/blocks';
  * Internal dependencies
  */
 import { getLevelFromHeadingNodeName } from './shared';
+import { getTransformedMetadata } from '../utils/get-transformed-metadata';
 
 const transforms = {
 	from: [
@@ -15,12 +16,20 @@ const transforms = {
 			isMultiBlock: true,
 			blocks: [ 'core/paragraph' ],
 			transform: ( attributes ) =>
-				attributes.map( ( { content, anchor, align: textAlign } ) =>
-					createBlock( 'core/heading', {
-						content,
-						anchor,
-						textAlign,
-					} )
+				attributes.map(
+					( { content, anchor, align: textAlign, metadata } ) =>
+						createBlock( 'core/heading', {
+							content,
+							anchor,
+							textAlign,
+							metadata: getTransformedMetadata(
+								metadata,
+								'core/heading',
+								( { content: contentBinding } ) => ( {
+									content: contentBinding,
+								} )
+							),
+						} )
 				),
 		},
 		{
@@ -82,8 +91,18 @@ const transforms = {
 			isMultiBlock: true,
 			blocks: [ 'core/paragraph' ],
 			transform: ( attributes ) =>
-				attributes.map( ( { content, textAlign: align } ) =>
-					createBlock( 'core/paragraph', { content, align } )
+				attributes.map( ( { content, textAlign: align, metadata } ) =>
+					createBlock( 'core/paragraph', {
+						content,
+						align,
+						metadata: getTransformedMetadata(
+							metadata,
+							'core/paragraph',
+							( { content: contentBinding } ) => ( {
+								content: contentBinding,
+							} )
+						),
+					} )
 				),
 		},
 	],

package/src/image/edit.js

@@ -7,6 +7,7 @@ import classnames from 'classnames';
  * WordPress dependencies
  */
 import { getBlobByURL, isBlobURL, revokeBlobURL } from '@wordpress/blob';
+import { store as blocksStore } from '@wordpress/blocks';
 import { Placeholder } from '@wordpress/components';
 import { useDispatch, useSelect } from '@wordpress/data';
 import {
@@ -342,7 +343,7 @@ export function ImageEdit( {
 			}
 
 			const blockBindingsSource = unlock(
-				select( blockEditorStore )
+				select( blocksStore )
 			).getBlockBindingsSource( metadata?.bindings?.url?.source );
 
 			return {

package/src/image/image.js

@@ -33,7 +33,7 @@ import { useEffect, useMemo, useState, useRef } from '@wordpress/element';
 import { __, _x, sprintf, isRTL } from '@wordpress/i18n';
 import { DOWN } from '@wordpress/keycodes';
 import { getFilename } from '@wordpress/url';
-import { switchToBlockType } from '@wordpress/blocks';
+import { switchToBlockType, store as blocksStore } from '@wordpress/blocks';
 import { crop, overlayText, upload } from '@wordpress/icons';
 import { store as noticesStore } from '@wordpress/notices';
 import { store as coreStore } from '@wordpress/core-data';
@@ -411,14 +411,16 @@ export default function Image( {
 		lockHrefControls = false,
 		lockAltControls = false,
 		lockTitleControls = false,
+		lockCaption = false,
 	} = useSelect(
 		( select ) => {
 			if ( ! isSingleSelected ) {
 				return {};
 			}
-
-			const { getBlockBindingsSource, getBlockParentsByBlockName } =
-				unlock( select( blockEditorStore ) );
+			const { getBlockBindingsSource } = unlock( select( blocksStore ) );
+			const { getBlockParentsByBlockName } = unlock(
+				select( blockEditorStore )
+			);
 			const {
 				url: urlBinding,
 				alt: altBinding,
@@ -444,6 +446,10 @@ export default function Image( {
 					// Disable editing the link of the URL if the image is inside a pattern instance.
 					// This is a temporary solution until we support overriding the link on the frontend.
 					hasParentPattern,
+				lockCaption:
+					// Disable editing the caption if the image is inside a pattern instance.
+					// This is a temporary solution until we support overriding the caption on the frontend.
+					hasParentPattern,
 				lockAltControls:
 					!! altBinding &&
 					( ! altBindingSource ||
@@ -907,6 +913,7 @@ export default function Image( {
 				which causes duplicated image upload. */ }
 			{ ! temporaryURL && controls }
 			{ img }
+
 			<Caption
 				attributes={ attributes }
 				setAttributes={ setAttributes }
@@ -914,6 +921,7 @@ export default function Image( {
 				insertBlocksAfter={ insertBlocksAfter }
 				label={ __( 'Image caption text' ) }
 				showToolbarButton={ isSingleSelected && hasNonContentControls }
+				disableEditing={ lockCaption }
 			/>
 		</>
 	);

package/src/navigation/index.php

@@ -554,14 +554,18 @@ class WP_Navigation_Block_Renderer {
 		// When adding to this array be mindful of security concerns.
 		$nav_element_context    = data_wp_context(
 			array(
-				'overlayOpenedBy' => array(),
+				'overlayOpenedBy' => array(
+					'click' => false,
+					'hover' => false,
+					'focus' => false,
+				),
 				'type'            => 'overlay',
 				'roleAttribute'   => '',
 				'ariaLabel'       => __( 'Menu' ),
 			)
 		);
 		$nav_element_directives = '
-		 data-wp-interactive="core/navigation"'
+		 data-wp-interactive="core/navigation" '
 		. $nav_element_context;
 
 		return $nav_element_directives;
@@ -764,7 +768,7 @@ function block_core_navigation_add_directives_to_submenu( $tags, $block_attribut
 	) ) {
 		// Add directives to the parent `<li>`.
 		$tags->set_attribute( 'data-wp-interactive', 'core/navigation' );
-		$tags->set_attribute( 'data-wp-context', '{ "submenuOpenedBy": {}, "type": "submenu" }' );
+		$tags->set_attribute( 'data-wp-context', '{ "submenuOpenedBy": { "click": false, "hover": false, "focus": false }, "type": "submenu" }' );
 		$tags->set_attribute( 'data-wp-watch', 'callbacks.initMenu' );
 		$tags->set_attribute( 'data-wp-on--focusout', 'actions.handleMenuFocusout' );
 		$tags->set_attribute( 'data-wp-on--keydown', 'actions.handleMenuKeydown' );

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

@@ -24,6 +24,7 @@ import {
 	useBlockProps,
 	store as blockEditorStore,
 	__experimentalUseBorderProps as useBorderProps,
+	useBlockEditingMode,
 } from '@wordpress/block-editor';
 import { useMemo } from '@wordpress/element';
 import { __, sprintf } from '@wordpress/i18n';
@@ -143,6 +144,7 @@ export default function PostFeaturedImageEdit( {
 		style: { width, height, aspectRatio },
 	} );
 	const borderProps = useBorderProps( attributes );
+	const blockEditingMode = useBlockEditingMode();
 
 	const placeholder = ( content ) => {
 		return (
@@ -174,8 +176,13 @@ export default function PostFeaturedImageEdit( {
 		createErrorNotice( message, { type: 'snackbar' } );
 	};
 
-	const controls = (
+	const controls = blockEditingMode === 'default' && (
 		<>
+			<Overlay
+				attributes={ attributes }
+				setAttributes={ setAttributes }
+				clientId={ clientId }
+			/>
 			<DimensionControls
 				clientId={ clientId }
 				attributes={ attributes }
@@ -224,6 +231,7 @@ export default function PostFeaturedImageEdit( {
 			</InspectorControls>
 		</>
 	);
+
 	let image;
 
 	/**
@@ -251,11 +259,6 @@ export default function PostFeaturedImageEdit( {
 					) : (
 						placeholder()
 					) }
-					<Overlay
-						attributes={ attributes }
-						setAttributes={ setAttributes }
-						clientId={ clientId }
-					/>
 				</div>
 			</>
 		);
@@ -360,11 +363,6 @@ export default function PostFeaturedImageEdit( {
 				) : (
 					image
 				) }
-				<Overlay
-					attributes={ attributes }
-					setAttributes={ setAttributes }
-					clientId={ clientId }
-				/>
 			</figure>
 		</>
 	);