@wordpress/block-library 8.22.0 → 8.24.0

package/build-style/style.css

@@ -840,20 +840,20 @@
   color: inherit;
   /*rtl:raw: direction: rtl; */
 }
-.wp-block-cover-image p:not(.has-text-color),
-.wp-block-cover-image h1:not(.has-text-color),
-.wp-block-cover-image h2:not(.has-text-color),
-.wp-block-cover-image h3:not(.has-text-color),
-.wp-block-cover-image h4:not(.has-text-color),
-.wp-block-cover-image h5:not(.has-text-color),
-.wp-block-cover-image h6:not(.has-text-color),
-.wp-block-cover p:not(.has-text-color),
-.wp-block-cover h1:not(.has-text-color),
-.wp-block-cover h2:not(.has-text-color),
-.wp-block-cover h3:not(.has-text-color),
-.wp-block-cover h4:not(.has-text-color),
-.wp-block-cover h5:not(.has-text-color),
-.wp-block-cover h6:not(.has-text-color) {
+.wp-block-cover-image p:where(:not(.has-text-color)),
+.wp-block-cover-image h1:where(:not(.has-text-color)),
+.wp-block-cover-image h2:where(:not(.has-text-color)),
+.wp-block-cover-image h3:where(:not(.has-text-color)),
+.wp-block-cover-image h4:where(:not(.has-text-color)),
+.wp-block-cover-image h5:where(:not(.has-text-color)),
+.wp-block-cover-image h6:where(:not(.has-text-color)),
+.wp-block-cover p:where(:not(.has-text-color)),
+.wp-block-cover h1:where(:not(.has-text-color)),
+.wp-block-cover h2:where(:not(.has-text-color)),
+.wp-block-cover h3:where(:not(.has-text-color)),
+.wp-block-cover h4:where(:not(.has-text-color)),
+.wp-block-cover h5:where(:not(.has-text-color)),
+.wp-block-cover h6:where(:not(.has-text-color)) {
   color: inherit;
 }
 .wp-block-cover-image.is-position-top-left,
@@ -1439,6 +1439,34 @@ figure.wp-block-gallery.has-nested-images {
   text-align: center;
   width: 100%;
   box-sizing: border-box;
+  scrollbar-width: thin;
+  scrollbar-gutter: stable both-edges;
+  scrollbar-color: transparent transparent;
+  will-change: transform;
+}
+.wp-block-gallery.has-nested-images figure.wp-block-image figcaption::-webkit-scrollbar {
+  width: 12px;
+  height: 12px;
+}
+.wp-block-gallery.has-nested-images figure.wp-block-image figcaption::-webkit-scrollbar-track {
+  background-color: transparent;
+}
+.wp-block-gallery.has-nested-images figure.wp-block-image figcaption::-webkit-scrollbar-thumb {
+  background-color: transparent;
+  border-radius: 8px;
+  border: 3px solid transparent;
+  background-clip: padding-box;
+}
+.wp-block-gallery.has-nested-images figure.wp-block-image figcaption:hover::-webkit-scrollbar-thumb, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus::-webkit-scrollbar-thumb, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus-within::-webkit-scrollbar-thumb {
+  background-color: rgba(255, 255, 255, 0.8);
+}
+.wp-block-gallery.has-nested-images figure.wp-block-image figcaption:hover, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus-within {
+  scrollbar-color: rgba(255, 255, 255, 0.8) transparent;
+}
+@media (hover: none) {
+  .wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
+    scrollbar-color: rgba(255, 255, 255, 0.8) transparent;
+  }
 }
 .wp-block-gallery.has-nested-images figure.wp-block-image figcaption img {
   display: inline;
@@ -1686,22 +1714,28 @@ h6.has-text-align-left[style*=writing-mode]:where([style*="vertical-lr"]) {
 .wp-lightbox-container button {
   opacity: 0;
   border: none;
-  background: #000;
+  background-color: rgba(90, 90, 90, 0.25);
+  -webkit-backdrop-filter: blur(16px) saturate(180%);
+          backdrop-filter: blur(16px) saturate(180%);
   cursor: zoom-in;
-  width: 24px;
-  height: 24px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 20px;
+  height: 20px;
   position: absolute;
   z-index: 100;
-  top: 10px;
-  right: 10px;
+  top: 16px;
+  right: 16px;
   text-align: center;
   padding: 0;
-  border-radius: 10%;
+  border-radius: 4px;
+  transition: opacity 0.2s ease;
 }
 .wp-lightbox-container button:focus-visible {
-  outline: 5px auto #212121;
-  outline: 5px auto -webkit-focus-ring-color;
-  outline-offset: 5px;
+  outline: 3px auto rgba(90, 90, 90, 0.25);
+  outline: 3px auto -webkit-focus-ring-color;
+  outline-offset: 3px;
 }
 .wp-lightbox-container button:hover {
   cursor: pointer;
@@ -1711,7 +1745,7 @@ h6.has-text-align-left[style*=writing-mode]:where([style*="vertical-lr"]) {
   opacity: 1;
 }
 .wp-lightbox-container button:hover, .wp-lightbox-container button:focus, .wp-lightbox-container button:not(:hover):not(:active):not(.has-background) {
-  background: #000;
+  background-color: rgba(90, 90, 90, 0.25);
   border: none;
 }
 
@@ -1721,7 +1755,7 @@ h6.has-text-align-left[style*=writing-mode]:where([style*="vertical-lr"]) {
   left: 0;
   z-index: 100000;
   overflow: hidden;
-  width: 100vw;
+  width: 100%;
   height: 100vh;
   box-sizing: border-box;
   visibility: hidden;
@@ -1854,7 +1888,7 @@ h6.has-text-align-left[style*=writing-mode]:where([style*="vertical-lr"]) {
 }
 @keyframes lightbox-zoom-in {
   0% {
-    transform: translate(calc(-50vw + var(--wp--lightbox-initial-left-position)), calc(-50vh + var(--wp--lightbox-initial-top-position))) scale(var(--wp--lightbox-scale));
+    transform: translate(calc((-100vw + var(--wp--lightbox-scrollbar-width)) / 2 + var(--wp--lightbox-initial-left-position)), calc(-50vh + var(--wp--lightbox-initial-top-position))) scale(var(--wp--lightbox-scale));
   }
   100% {
     transform: translate(-50%, -50%) scale(1, 1);
@@ -1870,7 +1904,7 @@ h6.has-text-align-left[style*=writing-mode]:where([style*="vertical-lr"]) {
   }
   100% {
     visibility: hidden;
-    transform: translate(calc(-50vw + var(--wp--lightbox-initial-left-position)), calc(-50vh + var(--wp--lightbox-initial-top-position))) scale(var(--wp--lightbox-scale));
+    transform: translate(calc((-100vw + var(--wp--lightbox-scrollbar-width)) / 2 + var(--wp--lightbox-initial-left-position)), calc(-50vh + var(--wp--lightbox-initial-top-position))) scale(var(--wp--lightbox-scale));
   }
 }
 ol.wp-block-latest-comments {
@@ -3150,16 +3184,19 @@ p.has-text-align-left[style*="writing-mode:vertical-lr"] {
   font-size: 1.125em;
   text-align: right;
 }
+.wp-block-quote > cite {
+  display: block;
+}
 
 .wp-block-read-more {
   display: block;
   width: -moz-fit-content;
   width: fit-content;
 }
-.wp-block-read-more:not([style*=text-decoration]) {
+.wp-block-read-more:where(:not([style*="text-decoration"])) {
   text-decoration: none;
 }
-.wp-block-read-more:not([style*=text-decoration]):focus, .wp-block-read-more:not([style*=text-decoration]):active {
+.wp-block-read-more:where(:not([style*="text-decoration"])):focus, .wp-block-read-more:where(:not([style*="text-decoration"])):active {
   text-decoration: none;
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-library",
-	"version": "8.22.0",
+	"version": "8.24.0",
 	"description": "Block library for the WordPress editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -31,36 +31,36 @@
 	],
 	"dependencies": {
 		"@babel/runtime": "^7.16.0",
-		"@wordpress/a11y": "^3.45.0",
-		"@wordpress/api-fetch": "^6.42.0",
-		"@wordpress/autop": "^3.45.0",
-		"@wordpress/blob": "^3.45.0",
-		"@wordpress/block-editor": "^12.13.0",
-		"@wordpress/blocks": "^12.22.0",
-		"@wordpress/components": "^25.11.0",
-		"@wordpress/compose": "^6.22.0",
-		"@wordpress/core-data": "^6.22.0",
-		"@wordpress/data": "^9.15.0",
-		"@wordpress/date": "^4.45.0",
-		"@wordpress/deprecated": "^3.45.0",
-		"@wordpress/dom": "^3.45.0",
-		"@wordpress/element": "^5.22.0",
-		"@wordpress/escape-html": "^2.45.0",
-		"@wordpress/hooks": "^3.45.0",
-		"@wordpress/html-entities": "^3.45.0",
-		"@wordpress/i18n": "^4.45.0",
-		"@wordpress/icons": "^9.36.0",
-		"@wordpress/interactivity": "^2.6.0",
-		"@wordpress/keycodes": "^3.45.0",
-		"@wordpress/notices": "^4.13.0",
-		"@wordpress/primitives": "^3.43.0",
-		"@wordpress/private-apis": "^0.27.0",
-		"@wordpress/reusable-blocks": "^4.22.0",
-		"@wordpress/rich-text": "^6.22.0",
-		"@wordpress/server-side-render": "^4.22.0",
-		"@wordpress/url": "^3.46.0",
-		"@wordpress/viewport": "^5.22.0",
-		"@wordpress/wordcount": "^3.45.0",
+		"@wordpress/a11y": "^3.47.0",
+		"@wordpress/api-fetch": "^6.44.0",
+		"@wordpress/autop": "^3.47.0",
+		"@wordpress/blob": "^3.47.0",
+		"@wordpress/block-editor": "^12.15.0",
+		"@wordpress/blocks": "^12.24.0",
+		"@wordpress/components": "^25.13.0",
+		"@wordpress/compose": "^6.24.0",
+		"@wordpress/core-data": "^6.24.0",
+		"@wordpress/data": "^9.17.0",
+		"@wordpress/date": "^4.47.0",
+		"@wordpress/deprecated": "^3.47.0",
+		"@wordpress/dom": "^3.47.0",
+		"@wordpress/element": "^5.24.0",
+		"@wordpress/escape-html": "^2.47.0",
+		"@wordpress/hooks": "^3.47.0",
+		"@wordpress/html-entities": "^3.47.0",
+		"@wordpress/i18n": "^4.47.0",
+		"@wordpress/icons": "^9.38.0",
+		"@wordpress/interactivity": "^3.0.0",
+		"@wordpress/keycodes": "^3.47.0",
+		"@wordpress/notices": "^4.15.0",
+		"@wordpress/primitives": "^3.45.0",
+		"@wordpress/private-apis": "^0.29.0",
+		"@wordpress/reusable-blocks": "^4.24.0",
+		"@wordpress/rich-text": "^6.24.0",
+		"@wordpress/server-side-render": "^4.24.0",
+		"@wordpress/url": "^3.48.0",
+		"@wordpress/viewport": "^5.24.0",
+		"@wordpress/wordcount": "^3.47.0",
 		"change-case": "^4.1.2",
 		"classnames": "^2.3.1",
 		"colord": "^2.7.0",
@@ -78,5 +78,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "2a00e87b57b9c27ed2b9b0fd8d423ef3cada72c1"
+	"gitHead": "d98dff8ea96f29cfea045bf964269f46f040d539"
 }

package/src/block/edit.js

@@ -114,33 +114,28 @@ export default function ReusableBlockEdit( {
 			: InnerBlocks.ButtonBlockAppender,
 	} );
 
+	let children = null;
 	if ( hasAlreadyRendered ) {
-		return (
-			<div { ...blockProps }>
-				<Warning>
-					{ __( 'Block cannot be rendered inside itself.' ) }
-				</Warning>
-			</div>
+		children = (
+			<Warning>
+				{ __( 'Block cannot be rendered inside itself.' ) }
+			</Warning>
 		);
 	}
 
 	if ( isMissing ) {
-		return (
-			<div { ...blockProps }>
-				<Warning>
-					{ __( 'Block has been deleted or is unavailable.' ) }
-				</Warning>
-			</div>
+		children = (
+			<Warning>
+				{ __( 'Block has been deleted or is unavailable.' ) }
+			</Warning>
 		);
 	}
 
 	if ( ! hasResolved ) {
-		return (
-			<div { ...blockProps }>
-				<Placeholder>
-					<Spinner />
-				</Placeholder>
-			</div>
+		children = (
+			<Placeholder>
+				<Spinner />
+			</Placeholder>
 		);
 	}
 
@@ -149,14 +144,19 @@ export default function ReusableBlockEdit( {
 			<InspectorControls>
 				<PanelBody>
 					<TextControl
-						__nextHasNoMarginBottom
 						label={ __( 'Name' ) }
 						value={ title }
 						onChange={ setTitle }
+						__nextHasNoMarginBottom
+						__next40pxDefaultSize
 					/>
 				</PanelBody>
 			</InspectorControls>
-			<div { ...innerBlocksProps } />
+			{ children === null ? (
+				<div { ...innerBlocksProps } />
+			) : (
+				<div { ...blockProps }>{ children }</div>
+			) }
 		</RecursionProvider>
 	);
 }

package/src/block/edit.native.js

@@ -78,7 +78,7 @@ export default function ReusableBlockEdit( {
 		styles.spinnerDark
 	);
 
-	const { hasResolved, isEditing, isMissing, innerBlockCount } = useSelect(
+	const { hasResolved, isEditing, isMissing } = useSelect(
 		( select ) => {
 			const persistedBlock = select( coreStore ).getEntityRecord(
 				'postType',
@@ -176,20 +176,12 @@ export default function ReusableBlockEdit( {
 						{ infoTitle }
 					</Text>
 					<Text style={ [ infoTextStyle, infoDescriptionStyle ] }>
-						{ innerBlockCount > 1
-							? __(
-									'Alternatively, you can detach and edit these blocks separately by tapping “Detach patterns”.'
-							  )
-							: __(
-									'Alternatively, you can detach and edit this block separately by tapping “Detach pattern”.'
-							  ) }
+						{ __(
+							'Alternatively, you can detach and edit this block separately by tapping “Detach”.'
+						) }
 					</Text>
 					<TextControl
-						label={
-							innerBlockCount > 1
-								? __( 'Detach patterns' )
-								: __( 'Detach pattern' )
-						}
+						label={ __( 'Detach' ) }
 						separatorType="topFullWidth"
 						onPress={ onConvertToRegularBlocks }
 						labelStyle={ actionButtonStyle }

package/src/button/edit.js

@@ -8,6 +8,7 @@ import classnames from 'classnames';
  */
 import { NEW_TAB_TARGET, NOFOLLOW_REL } from './constants';
 import { getUpdatedLinkAttributes } from './get-updated-link-attributes';
+import removeAnchorTag from '../utils/remove-anchor-tag';
 
 /**
  * WordPress dependencies
@@ -33,11 +34,17 @@ import {
 	__experimentalGetSpacingClassesAndStyles as useSpacingProps,
 	__experimentalLinkControl as LinkControl,
 	__experimentalGetElementClassName,
+	store as blockEditorStore,
 } from '@wordpress/block-editor';
-import { displayShortcut, isKeyboardEvent } from '@wordpress/keycodes';
+import { displayShortcut, isKeyboardEvent, ENTER } from '@wordpress/keycodes';
 import { link, linkOff } from '@wordpress/icons';
-import { createBlock } from '@wordpress/blocks';
-import { useMergeRefs } from '@wordpress/compose';
+import {
+	createBlock,
+	cloneBlock,
+	getDefaultBlockName,
+} from '@wordpress/blocks';
+import { useMergeRefs, useRefEffect } from '@wordpress/compose';
+import { useSelect, useDispatch } from '@wordpress/data';
 
 const LINK_SETTINGS = [
 	...LinkControl.DEFAULT_LINK_SETTINGS,
@@ -47,6 +54,62 @@ const LINK_SETTINGS = [
 	},
 ];
 
+function useEnter( props ) {
+	const { replaceBlocks, selectionChange } = useDispatch( blockEditorStore );
+	const { getBlock, getBlockRootClientId, getBlockIndex } =
+		useSelect( blockEditorStore );
+	const propsRef = useRef( props );
+	propsRef.current = props;
+	return useRefEffect( ( element ) => {
+		function onKeyDown( event ) {
+			if ( event.defaultPrevented || event.keyCode !== ENTER ) {
+				return;
+			}
+			const { content, clientId } = propsRef.current;
+			if ( content.length ) {
+				return;
+			}
+			event.preventDefault();
+			const topParentListBlock = getBlock(
+				getBlockRootClientId( clientId )
+			);
+			const blockIndex = getBlockIndex( clientId );
+			const head = cloneBlock( {
+				...topParentListBlock,
+				innerBlocks: topParentListBlock.innerBlocks.slice(
+					0,
+					blockIndex
+				),
+			} );
+			const middle = createBlock( getDefaultBlockName() );
+			const after = topParentListBlock.innerBlocks.slice(
+				blockIndex + 1
+			);
+			const tail = after.length
+				? [
+						cloneBlock( {
+							...topParentListBlock,
+							innerBlocks: after,
+						} ),
+				  ]
+				: [];
+			replaceBlocks(
+				topParentListBlock.clientId,
+				[ head, middle, ...tail ],
+				1
+			);
+			// We manually change the selection here because we are replacing
+			// a different block than the selected one.
+			selectionChange( middle.clientId );
+		}
+
+		element.addEventListener( 'keydown', onKeyDown );
+		return () => {
+			element.removeEventListener( 'keydown', onKeyDown );
+		};
+	}, [] );
+}
+
 function WidthPanel( { selectedWidth, setAttributes } ) {
 	function handleChange( newWidth ) {
 		// Check if we are toggling the width off
@@ -88,6 +151,7 @@ function ButtonEdit( props ) {
 		isSelected,
 		onReplace,
 		mergeBlocks,
+		clientId,
 	} = props;
 	const {
 		tagName,
@@ -103,11 +167,6 @@ function ButtonEdit( props ) {
 
 	const TagName = tagName || 'a';
 
-	function setButtonText( newText ) {
-		// Remove anchor tags from button text content.
-		setAttributes( { text: newText.replace( /<\/?a[^>]*>/g, '' ) } );
-	}
-
 	function onKeyDown( event ) {
 		if ( isKeyboardEvent.primary( event, 'k' ) ) {
 			startEditing( event );
@@ -164,6 +223,9 @@ function ButtonEdit( props ) {
 		[ url, opensInNewTab, nofollow ]
 	);
 
+	const useEnterRef = useEnter( { content: text, clientId } );
+	const mergedRef = useMergeRefs( [ useEnterRef, richTextRef ] );
+
 	return (
 		<>
 			<div
@@ -175,11 +237,15 @@ function ButtonEdit( props ) {
 				} ) }
 			>
 				<RichText
-					ref={ richTextRef }
+					ref={ mergedRef }
 					aria-label={ __( 'Button text' ) }
 					placeholder={ placeholder || __( 'Add text…' ) }
 					value={ text }
-					onChange={ ( value ) => setButtonText( value ) }
+					onChange={ ( value ) =>
+						setAttributes( {
+							text: removeAnchorTag( value ),
+						} )
+					}
 					withoutInteractiveFormatting
 					className={ classnames(
 						className,

package/src/buttons/test/__snapshots__/edit.native.js.snap

@@ -71,9 +71,3 @@ exports[`Buttons block when a button is shown removing button along with buttons
 <p></p>
 <!-- /wp:paragraph -->"
 `;
-
-exports[`Buttons block when a button is shown removing button along with buttons block removes the button and buttons block when deleting the block using the delete (backspace) key 1`] = `
-"<!-- wp:paragraph -->
-<p></p>
-<!-- /wp:paragraph -->"
-`;

package/src/buttons/test/edit.native.js

@@ -18,7 +18,6 @@ import {
  */
 import { getBlockTypes, unregisterBlockType } from '@wordpress/blocks';
 import { registerCoreBlocks } from '@wordpress/block-library';
-import { BACKSPACE } from '@wordpress/keycodes';
 
 const BUTTONS_HTML = `<!-- wp:buttons -->
 <div class="wp-block-buttons"><!-- wp:button /--></div>
@@ -238,32 +237,6 @@ describe( 'Buttons block', () => {
 
 				expect( getEditorHtml() ).toMatchSnapshot();
 			} );
-
-			it( 'removes the button and buttons block when deleting the block using the delete (backspace) key', async () => {
-				const screen = await initializeEditor( {
-					initialHtml: BUTTONS_HTML,
-				} );
-
-				// Get block
-				const buttonsBlock = await getBlock( screen, 'Buttons' );
-				triggerBlockListLayout( buttonsBlock );
-
-				// Get inner button block
-				const buttonBlock = await getBlock( screen, 'Button' );
-				fireEvent.press( buttonBlock );
-
-				const buttonInput =
-					within( buttonBlock ).getByLabelText( 'Text input. Empty' );
-
-				// Delete block
-				fireEvent( buttonInput, 'onKeyDown', {
-					nativeEvent: {},
-					preventDefault() {},
-					keyCode: BACKSPACE,
-				} );
-
-				expect( getEditorHtml() ).toMatchSnapshot();
-			} );
 		} );
 	} );
 

package/src/code/transforms.js

@@ -2,6 +2,7 @@
  * WordPress dependencies
  */
 import { createBlock } from '@wordpress/blocks';
+import { create, toHTMLString } from '@wordpress/rich-text';
 
 const transforms = {
 	from: [
@@ -12,10 +13,18 @@ const transforms = {
 		},
 		{
 			type: 'block',
-			blocks: [ 'core/html', 'core/paragraph' ],
-			transform: ( { content } ) => {
+			blocks: [ 'core/paragraph' ],
+			transform: ( { content } ) =>
+				createBlock( 'core/code', { content } ),
+		},
+		{
+			type: 'block',
+			blocks: [ 'core/html' ],
+			transform: ( { content: text } ) => {
 				return createBlock( 'core/code', {
-					content,
+					// The HTML is plain text (with plain line breaks), so
+					// convert it to rich text.
+					content: toHTMLString( { value: create( { text } ) } ),
 				} );
 			},
 		},
@@ -42,11 +51,8 @@ const transforms = {
 		{
 			type: 'block',
 			blocks: [ 'core/paragraph' ],
-			transform: ( { content } ) => {
-				return createBlock( 'core/paragraph', {
-					content: content.replace( /\n/g, '<br>' ),
-				} );
-			},
+			transform: ( { content } ) =>
+				createBlock( 'core/paragraph', { content } ),
 		},
 	],
 };

package/src/column/edit.js

@@ -103,7 +103,7 @@ function ColumnEdit( {
 				/>
 			</BlockControls>
 			<InspectorControls>
-				<PanelBody title={ __( 'Column settings' ) }>
+				<PanelBody title={ __( 'Settings' ) }>
 					<UnitControl
 						label={ __( 'Width' ) }
 						labelPosition="edge"

package/src/column/edit.native.js

@@ -160,7 +160,7 @@ function ColumnEdit( {
 						/>
 					</BlockControls>
 					<InspectorControls>
-						<PanelBody title={ __( 'Column settings' ) }>
+						<PanelBody title={ __( 'Settings' ) }>
 							<UnitControl
 								label={ __( 'Width' ) }
 								min={ 1 }

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

@@ -22,6 +22,7 @@ export default function CommentsInspectorControls( {
 			<InspectorControls group="advanced">
 				<SelectControl
 					__nextHasNoMarginBottom
+					__next40pxDefaultSize
 					label={ __( 'HTML element' ) }
 					options={ [
 						{ label: __( 'Default (<div>)' ), value: 'div' },

package/src/cover/edit/index.js

@@ -335,6 +335,7 @@ function CoverEdit( {
 			templateInsertUpdatesSelection: true,
 			allowedBlocks,
 			templateLock,
+			dropZoneElement: ref.current,
 		}
 	);
 

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

@@ -319,6 +319,7 @@ export default function CoverInspectorControls( {
 			<InspectorControls group="advanced">
 				<SelectControl
 					__nextHasNoMarginBottom
+					__next40pxDefaultSize
 					label={ __( 'HTML element' ) }
 					options={ [
 						{ label: __( 'Default (<div>)' ), value: 'div' },

package/src/cover/style.scss

@@ -123,7 +123,7 @@
 	h4,
 	h5,
 	h6 {
-		&:not(.has-text-color) {
+		&:where(:not(.has-text-color)) {
 			color: inherit;
 		}
 	}

package/src/cover/test/edit.js

@@ -53,7 +53,7 @@ async function createAndSelectBlock() {
 	);
 	await userEvent.click(
 		screen.getByRole( 'button', {
-			name: 'Select Cover',
+			name: 'Select parent block: Cover',
 		} )
 	);
 }

package/src/details/edit.js

@@ -72,7 +72,6 @@ function DetailsEdit( { attributes, setAttributes, clientId } ) {
 						onChange={ ( newSummary ) =>
 							setAttributes( { summary: newSummary } )
 						}
-						multiline={ false }
 					/>
 				</summary>
 				{ innerBlocksProps.children }