Cherry-picked bug fixes for 6.8.2

packages/block-editor/src/components/inserter/media-tab/media-preview.js

@@ -36,7 +36,6 @@ import { getBlockAndPreviewFromMedia } from './utils';
 import { store as blockEditorStore } from '../../../store';
 
 const ALLOWED_MEDIA_TYPES = [ 'image' ];
-const MAXIMUM_TITLE_LENGTH = 25;
 const MEDIA_OPTIONS_POPOVER_PROPS = {
 	position: 'bottom left',
 	className:
@@ -239,12 +238,6 @@ export function MediaPreview( { media, onClick, category } ) {
 			? media.title
 			: media.title?.rendered || __( 'no title' );
 
-	let truncatedTitle;
-	if ( title.length > MAXIMUM_TITLE_LENGTH ) {
-		const omission = '...';
-		truncatedTitle =
-			title.slice( 0, MAXIMUM_TITLE_LENGTH - omission.length ) + omission;
-	}
 	const onMouseEnter = useCallback( () => setIsHovered( true ), [] );
 	const onMouseLeave = useCallback( () => setIsHovered( false ), [] );
 	return (
@@ -268,7 +261,7 @@ export function MediaPreview( { media, onClick, category } ) {
 							onMouseEnter={ onMouseEnter }
 							onMouseLeave={ onMouseLeave }
 						>
-							<Tooltip text={ truncatedTitle || title }>
+							<Tooltip text={ title }>
 								<Composite.Item
 									render={
 										<div

packages/block-editor/src/components/media-placeholder/index.js

@@ -47,7 +47,7 @@ const InsertFromURLPopover = ( {
 			<InputControl
 				__next40pxDefaultSize
 				label={ __( 'URL' ) }
-				type="url"
+				type="text" // Use text instead of URL to allow relative paths (e.g., /image/image.jpg)
 				hideLabelFromVision
 				placeholder={ __( 'Paste or type URL' ) }
 				onChange={ onChange }

packages/block-editor/src/components/media-placeholder/style.scss

@@ -4,4 +4,10 @@
 	@include break-small() {
 		width: 300px;
 	}
+
+	input {
+		// Targeting input as we're using text instead of URLs for relative paths.
+		/* rtl:ignore */
+		direction: ltr;
+	}
 }

packages/block-library/src/button/style.scss

@@ -10,7 +10,6 @@ $blocks-block__margin: 0.5em;
 	word-break: break-word; // overflow-wrap doesn't work well if a link is wrapped in the div, so use word-break here.
 	box-sizing: border-box;
 	height: 100%;
-	width: 100%;
 	align-content: center;
 
 	&.aligncenter {

packages/block-library/src/buttons/style.scss

@@ -82,6 +82,11 @@ $blocks-block__margin: 0.5em;
 			font-size: inherit;
 		}
 	}
+
+	// Needed to make the buttons stretch correctly in a vertical layout.
+	.wp-block-button__link {
+		width: 100%;
+	}
 }
 
 // Legacy buttons that did not come in a wrapping container.

packages/block-library/src/details/edit.js

@@ -6,20 +6,26 @@ import {
 	useBlockProps,
 	useInnerBlocksProps,
 	InspectorControls,
+	store as blockEditorStore,
 } from '@wordpress/block-editor';
 import {
 	TextControl,
 	ToggleControl,
 	__experimentalToolsPanel as ToolsPanel,
 	__experimentalToolsPanelItem as ToolsPanelItem,
+	privateApis as componentsPrivateApis,
 } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { useState } from '@wordpress/element';
+import { useSelect } from '@wordpress/data';
 
 /**
  * Internal dependencies
  */
 import { useToolsPanelDropdownMenuProps } from '../utils/hooks';
+import { unlock } from '../lock-unlock';
+
+const { withIgnoreIMEEvents } = unlock( componentsPrivateApis );
 
 const TEMPLATE = [
 	[
@@ -30,7 +36,7 @@ const TEMPLATE = [
 	],
 ];
 
-function DetailsEdit( { attributes, setAttributes } ) {
+function DetailsEdit( { attributes, setAttributes, clientId } ) {
 	const { name, showContent, summary, allowedBlocks, placeholder } =
 		attributes;
 	const blockProps = useBlockProps();
@@ -42,6 +48,27 @@ function DetailsEdit( { attributes, setAttributes } ) {
 	const [ isOpen, setIsOpen ] = useState( showContent );
 	const dropdownMenuProps = useToolsPanelDropdownMenuProps();
 
+	// Check if the inner blocks are selected.
+	const hasSelectedInnerBlock = useSelect(
+		( select ) =>
+			select( blockEditorStore ).hasSelectedInnerBlock( clientId, true ),
+		[ clientId ]
+	);
+
+	const handleSummaryKeyDown = ( event ) => {
+		if ( event.key === 'Enter' && ! event.shiftKey ) {
+			setIsOpen( ( prevIsOpen ) => ! prevIsOpen );
+			event.preventDefault();
+		}
+	};
+
+	// Prevent spacebar from toggling <details> while typing.
+	const handleSummaryKeyUp = ( event ) => {
+		if ( event.key === ' ' ) {
+			event.preventDefault();
+		}
+	};
+
 	return (
 		<>
 			<InspectorControls>
@@ -91,18 +118,21 @@ function DetailsEdit( { attributes, setAttributes } ) {
 					) }
 				/>
 			</InspectorControls>
-			<details { ...innerBlocksProps } open={ isOpen }>
+			<details
+				{ ...innerBlocksProps }
+				open={ isOpen || hasSelectedInnerBlock }
+				onToggle={ ( event ) => setIsOpen( event.target.open ) }
+			>
 				<summary
-					onClick={ ( event ) => {
-						event.preventDefault();
-						setIsOpen( ! isOpen );
-					} }
+					onKeyDown={ withIgnoreIMEEvents( handleSummaryKeyDown ) }
+					onKeyUp={ handleSummaryKeyUp }
 				>
 					<RichText
 						identifier="summary"
-						aria-label={ __( 'Write summary' ) }
+						aria-label={ __(
+							'Write summary. Press Enter to expand or collapse the details.'
+						) }
 						placeholder={ placeholder || __( 'Write summary…' ) }
-						allowedFormats={ [] }
 						withoutInteractiveFormatting
 						value={ summary }
 						onChange={ ( newSummary ) =>

packages/block-library/src/embed/variations.js

@@ -251,14 +251,6 @@ const variations = [
 		patterns: [ /^https?:\/\/(www\.)?reverbnation\.com\/.+/i ],
 		attributes: { providerNameSlug: 'reverbnation', responsive: true },
 	},
-	{
-		name: 'screencast',
-		title: getTitle( 'Screencast' ),
-		icon: embedVideoIcon,
-		description: __( 'Embed Screencast content.' ),
-		patterns: [ /^https?:\/\/(www\.)?screencast\.com\/.+/i ],
-		attributes: { providerNameSlug: 'screencast', responsive: true },
-	},
 	{
 		name: 'scribd',
 		title: getTitle( 'Scribd' ),

packages/block-library/src/image/edit.js

@@ -262,10 +262,6 @@ export function ImageEdit( {
 			additionalAttributes = {
 				sizeSlug: newSize,
 			};
-		} else {
-			// Keep the same url when selecting the same file, so "Resolution"
-			// option is not changed.
-			additionalAttributes = { url };
 		}
 
 		// Check if default link setting should be used.