@wordpress/block-library 7.3.10 → 7.3.13

package/build-module/post-comments-form/form.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-library/src/post-comments-form/form.js"],"names":["__","__experimentalUseDisabled","useDisabled","useInstanceId","CommentsForm","disabledFormRef","instanceId"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AACA,SACCC,yBAAyB,IAAIC,WAD9B,EAECC,aAFD,QAGO,oBAHP;;AAKA,MAAMC,YAAY,GAAG,MAAM;AAC1B,QAAMC,eAAe,GAAGH,WAAW,EAAnC;AACA,QAAMI,UAAU,GAAGH,aAAa,CAAEC,YAAF,CAAhC;AAEA,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC;AAAI,IAAA,SAAS,EAAC;AAAd,KAAsCJ,EAAE,CAAE,eAAF,CAAxC,CADD,EAEC;AAAM,IAAA,UAAU,MAAhB;AAAiB,IAAA,SAAS,EAAC,cAA3B;AAA0C,IAAA,GAAG,EAAGK;AAAhD,KACC,yBACC;AAAO,IAAA,OAAO,EAAI,WAAWC,UAAY;AAAzC,KACGN,EAAE,CAAE,SAAF,CADL,CADD,EAIC;AACC,IAAA,EAAE,EAAI,WAAWM,UAAY,EAD9B;AAEC,IAAA,IAAI,EAAC,SAFN;AAGC,IAAA,IAAI,EAAC,IAHN;AAIC,IAAA,IAAI,EAAC;AAJN,IAJD,CADD,EAYC;AAAG,IAAA,SAAS,EAAC;AAAb,KACC;AACC,IAAA,IAAI,EAAC,QADN;AAEC,IAAA,IAAI,EAAC,QAFN;AAGC,IAAA,SAAS,EAAC,8BAHX;AAIC,IAAA,KAAK,EAAGN,EAAE,CAAE,cAAF,CAJX;AAKC,IAAA,KAAK,EAAGA,EAAE,CAAE,cAAF;AALX,IADD,CAZD,CAFD,CADD;AA2BA,CA/BD;;AAiCA,eAAeI,YAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\t__experimentalUseDisabled as useDisabled,\n\tuseInstanceId,\n} from '@wordpress/compose';\n\nconst CommentsForm = () => {\n\tconst disabledFormRef = useDisabled();\n\tconst instanceId = useInstanceId( CommentsForm );\n\n\treturn (\n\t\t<div className=\"comment-respond\">\n\t\t\t<h3 className=\"comment-reply-title\">{ __( 'Leave a Reply' ) }</h3>\n\t\t\t<form noValidate className=\"comment-form\" ref={ disabledFormRef }>\n\t\t\t\t<p>\n\t\t\t\t\t<label htmlFor={ `comment-${ instanceId }` }>\n\t\t\t\t\t\t{ __( 'Comment' ) }\n\t\t\t\t\t</label>\n\t\t\t\t\t<textarea\n\t\t\t\t\t\tid={ `comment-${ instanceId }` }\n\t\t\t\t\t\tname=\"comment\"\n\t\t\t\t\t\tcols=\"45\"\n\t\t\t\t\t\trows=\"8\"\n\t\t\t\t\t/>\n\t\t\t\t</p>\n\t\t\t\t<p className=\"form-submit wp-block-button\">\n\t\t\t\t\t<input\n\t\t\t\t\t\tname=\"submit\"\n\t\t\t\t\t\ttype=\"submit\"\n\t\t\t\t\t\tclassName=\"submit wp-block-button__link\"\n\t\t\t\t\t\tlabel={ __( 'Post Comment' ) }\n\t\t\t\t\t\tvalue={ __( 'Post Comment' ) }\n\t\t\t\t\t/>\n\t\t\t\t</p>\n\t\t\t</form>\n\t\t</div>\n\t);\n};\n\nexport default CommentsForm;\n"]}

package/build-style/editor-rtl.css

@@ -2701,6 +2701,9 @@ div[data-type="core/post-featured-image"] img {
 .wp-block-post-comments-form * {
   pointer-events: none;
 }
+.wp-block-post-comments-form *.block-editor-warning * {
+  pointer-events: auto;
+}
 
 :root .editor-styles-wrapper {
   /*

package/build-style/editor.css

@@ -2712,6 +2712,9 @@ div[data-type="core/post-featured-image"] img {
 .wp-block-post-comments-form * {
   pointer-events: none;
 }
+.wp-block-post-comments-form *.block-editor-warning * {
+  pointer-events: auto;
+}
 
 :root .editor-styles-wrapper {
   /*

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

@@ -271,6 +271,9 @@ button.wp-block-navigation-item__content {
   font-size: inherit;
   font-family: inherit;
   line-height: inherit;
+  font-style: inherit;
+  font-weight: inherit;
+  text-transform: inherit;
   text-align: right;
 }
 

package/build-style/navigation/style.css

@@ -271,6 +271,9 @@ button.wp-block-navigation-item__content {
   font-size: inherit;
   font-family: inherit;
   line-height: inherit;
+  font-style: inherit;
+  font-weight: inherit;
+  text-transform: inherit;
   text-align: left;
 }
 

package/build-style/post-comments-form/editor-rtl.css

@@ -76,4 +76,7 @@
  */
 .wp-block-post-comments-form * {
   pointer-events: none;
+}
+.wp-block-post-comments-form *.block-editor-warning * {
+  pointer-events: auto;
 }

package/build-style/post-comments-form/editor.css

@@ -76,4 +76,7 @@
  */
 .wp-block-post-comments-form * {
   pointer-events: none;
+}
+.wp-block-post-comments-form *.block-editor-warning * {
+  pointer-events: auto;
 }

package/build-style/style-rtl.css

@@ -1753,6 +1753,9 @@ button.wp-block-navigation-item__content {
   font-size: inherit;
   font-family: inherit;
   line-height: inherit;
+  font-style: inherit;
+  font-weight: inherit;
+  text-transform: inherit;
   text-align: right;
 }
 

package/build-style/style.css

@@ -1779,6 +1779,9 @@ button.wp-block-navigation-item__content {
   font-size: inherit;
   font-family: inherit;
   line-height: inherit;
+  font-style: inherit;
+  font-weight: inherit;
+  text-transform: inherit;
   text-align: left;
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-library",
-	"version": "7.3.10",
+	"version": "7.3.13",
 	"description": "Block library for the WordPress editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -37,9 +37,9 @@
 		"@wordpress/api-fetch": "^6.3.1",
 		"@wordpress/autop": "^3.6.1",
 		"@wordpress/blob": "^3.6.1",
-		"@wordpress/block-editor": "^8.5.7",
+		"@wordpress/block-editor": "^8.5.9",
 		"@wordpress/blocks": "^11.5.3",
-		"@wordpress/components": "^19.8.4",
+		"@wordpress/components": "^19.8.5",
 		"@wordpress/compose": "^5.4.1",
 		"@wordpress/core-data": "^4.4.5",
 		"@wordpress/data": "^6.6.1",
@@ -50,13 +50,13 @@
 		"@wordpress/hooks": "^3.6.1",
 		"@wordpress/html-entities": "^3.6.1",
 		"@wordpress/i18n": "^4.6.1",
-		"@wordpress/icons": "^8.2.2",
+		"@wordpress/icons": "^8.2.3",
 		"@wordpress/keycodes": "^3.6.1",
 		"@wordpress/notices": "^3.6.1",
 		"@wordpress/primitives": "^3.4.1",
-		"@wordpress/reusable-blocks": "^3.4.7",
+		"@wordpress/reusable-blocks": "^3.4.9",
 		"@wordpress/rich-text": "^5.4.2",
-		"@wordpress/server-side-render": "^3.4.5",
+		"@wordpress/server-side-render": "^3.4.6",
 		"@wordpress/url": "^3.7.1",
 		"@wordpress/viewport": "^4.4.1",
 		"classnames": "^2.3.1",
@@ -74,5 +74,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "d9042594d77ee2d9e28326266de078a505fdf645"
+	"gitHead": "b2f4eb9e7da83e45e2f726cfdef4d4224c423da8"
 }

package/src/avatar/hooks.js

@@ -76,12 +76,15 @@ export function useUserAvatar( { userId, postId, postType } ) {
 		},
 		[ postType, postId, userId ]
 	);
-	const avatarUrls = authorDetails
-		? Object.values( authorDetails.avatar_urls )
-		: null;
-	const sizes = authorDetails
-		? Object.keys( authorDetails.avatar_urls )
-		: null;
+
+	const avatarUrls =
+		authorDetails && authorDetails?.avatar_urls
+			? Object.values( authorDetails.avatar_urls )
+			: null;
+	const sizes =
+		authorDetails && authorDetails?.avatar_urls
+			? Object.keys( authorDetails.avatar_urls )
+			: null;
 	const { minSize, maxSize } = getAvatarSizes( sizes );
 	const defaultAvatar = useDefaultAvatar();
 	return {

package/src/columns/block.json

@@ -28,7 +28,9 @@
 			}
 		},
 		"spacing": {
-			"blockGap": true,
+			"blockGap": {
+				"__experimentalDefault": "2em"
+			},
 			"margin": [ "top", "bottom" ],
 			"padding": true,
 			"__experimentalDefaultControls": {

package/src/comment-author-name/block.json

@@ -18,10 +18,6 @@
 		},
 		"textAlign": {
 			"type": "string"
-		},
-		"fontSize": {
-			"type": "string",
-			"default": "small"
 		}
 	},
 	"usesContext": [ "commentId" ],

package/src/comment-author-name/edit.js

@@ -41,7 +41,7 @@ export default function Edit( {
 			[ `has-text-align-${ textAlign }` ]: textAlign,
 		} ),
 	} );
-	const displayName = useSelect(
+	let displayName = useSelect(
 		( select ) => {
 			const { getEntityRecord } = select( coreStore );
 
@@ -92,15 +92,7 @@ export default function Edit( {
 	);
 
 	if ( ! commentId || ! displayName ) {
-		return (
-			<>
-				{ inspectorControls }
-				{ blockControls }
-				<div { ...blockProps }>
-					<p>{ _x( 'Comment Author', 'block title' ) }</p>
-				</div>
-			</>
-		);
+		displayName = _x( 'Comment Author', 'block title' );
 	}
 
 	const displayAuthor = isLink ? (
@@ -111,9 +103,8 @@ export default function Edit( {
 			{ displayName }
 		</a>
 	) : (
-		<p>{ displayName }</p>
+		displayName
 	);
-
 	return (
 		<>
 			{ inspectorControls }

package/src/comment-date/block.json

@@ -14,10 +14,6 @@
 		"isLink": {
 			"type": "boolean",
 			"default": true
-		},
-		"fontSize": {
-			"type": "string",
-			"default": "small"
 		}
 	},
 	"usesContext": [ "commentId" ],

package/src/comment-date/edit.js

@@ -33,7 +33,7 @@ export default function Edit( {
 	setAttributes,
 } ) {
 	const blockProps = useBlockProps();
-	const [ date ] = useEntityProp( 'root', 'comment', 'date', commentId );
+	let [ date ] = useEntityProp( 'root', 'comment', 'date', commentId );
 	const [ siteFormat = getDateSettings().formats.date ] = useEntityProp(
 		'root',
 		'site',
@@ -60,21 +60,17 @@ export default function Edit( {
 	);
 
 	if ( ! commentId || ! date ) {
-		return (
-			<>
-				{ inspectorControls }
-				<div { ...blockProps }>
-					<p>{ _x( 'Comment Date', 'block title' ) }</p>
-				</div>
-			</>
-		);
+		date = _x( 'Comment Date', 'block title' );
 	}
 
-	let commentDate = (
-		<time dateTime={ dateI18n( 'c', date ) }>
-			{ dateI18n( format || siteFormat, date ) }
-		</time>
-	);
+	let commentDate =
+		date instanceof Date ? (
+			<time dateTime={ dateI18n( 'c', date ) }>
+				{ dateI18n( format || siteFormat, date ) }
+			</time>
+		) : (
+			<time>{ date }</time>
+		);
 
 	if ( isLink ) {
 		commentDate = (

package/src/comment-date/index.php

@@ -24,9 +24,6 @@ function render_block_core_comment_date( $attributes, $content, $block ) {
 	}
 
 	$classes = '';
-	if ( isset( $attributes['fontSize'] ) ) {
-		$classes .= 'has-' . esc_attr( $attributes['fontSize'] ) . '-font-size';
-	}
 
 	$wrapper_attributes = get_block_wrapper_attributes( array( 'class' => $classes ) );
 	$formatted_date     = get_comment_date(

package/src/comment-edit-link/block.json

@@ -15,10 +15,6 @@
 		},
 		"textAlign": {
 			"type": "string"
-		},
-		"fontSize": {
-			"type": "string",
-			"default": "small"
 		}
 	},
 	"supports": {

package/src/comment-reply-link/block.json

@@ -11,10 +11,6 @@
 	"attributes": {
 		"textAlign": {
 			"type": "string"
-		},
-		"fontSize": {
-			"type": "string",
-			"default": "small"
 		}
 	},
 	"supports": {

package/src/comments-query-loop/edit.js

@@ -37,7 +37,12 @@ const TEMPLATE = [
 						'core/column',
 						{},
 						[
-							[ 'core/comment-author-name' ],
+							[
+								'core/comment-author-name',
+								{
+									fontSize: 'small',
+								},
+							],
 							[
 								'core/group',
 								{
@@ -52,12 +57,27 @@ const TEMPLATE = [
 									},
 								},
 								[
-									[ 'core/comment-date' ],
-									[ 'core/comment-edit-link' ],
+									[
+										'core/comment-date',
+										{
+											fontSize: 'small',
+										},
+									],
+									[
+										'core/comment-edit-link',
+										{
+											fontSize: 'small',
+										},
+									],
 								],
 							],
 							[ 'core/comment-content' ],
-							[ 'core/comment-reply-link' ],
+							[
+								'core/comment-reply-link',
+								{
+									fontSize: 'small',
+								},
+							],
 						],
 					],
 				],

package/src/cover/index.php

@@ -32,12 +32,15 @@ function render_block_core_cover( $attributes, $content ) {
 
 		$image = get_the_post_thumbnail( null, 'post-thumbnail', $attr );
 
-		$content = str_replace(
-			'</span><div',
-			'</span>' . $image . '<div',
-			$content
-		);
-
+		/*
+		 * Inserts the featured image between the (1st) cover 'background' `span` and 'inner_container' `div`,
+		 * and removes eventual withespace characters between the two (typically introduced at template level)
+		 */
+		$inner_container_start = '/<div\b[^>]+wp-block-cover__inner-container[\s|"][^>]*>/U';
+		if ( 1 === preg_match( $inner_container_start, $content, $matches, PREG_OFFSET_CAPTURE ) ) {
+			$offset  = $matches[0][1];
+			$content = substr( $content, 0, $offset ) . $image . substr( $content, $offset );
+		}
 	} else {
 		if ( in_the_loop() ) {
 			update_post_thumbnail_cache();

package/src/gallery/gap-styles.js

@@ -8,12 +8,27 @@ export default function GapStyles( { blockGap, clientId } ) {
 	const styleElement = useContext( BlockList.__unstableElementContext );
 	// --gallery-block--gutter-size is deprecated. --wp--style--gallery-gap-default should be used by themes that want to set a default
 	// gap on the gallery.
-	const gapValue = blockGap
-		? blockGap
-		: `var( --wp--style--gallery-gap-default, var( --gallery-block--gutter-size, var( --wp--style--block-gap, 0.5em ) ) )`;
-	const gap = `#block-${ clientId } { 
-		--wp--style--unstable-gallery-gap: ${ gapValue };
-		gap: ${ gapValue } 
+	const fallbackValue = `var( --wp--style--gallery-gap-default, var( --gallery-block--gutter-size, var( --wp--style--block-gap, 0.5em ) ) )`;
+	let gapValue = fallbackValue;
+	let column = fallbackValue;
+	let row;
+
+	// Check for the possibility of split block gap values. See: https://github.com/WordPress/gutenberg/pull/37736
+	if ( !! blockGap ) {
+		row =
+			typeof blockGap === 'string'
+				? blockGap
+				: blockGap?.top || fallbackValue;
+		column =
+			typeof blockGap === 'string'
+				? blockGap
+				: blockGap?.left || fallbackValue;
+		gapValue = row === column ? row : `${ row } ${ column }`;
+	}
+
+	const gap = `#block-${ clientId } {
+		--wp--style--unstable-gallery-gap: ${ column };
+		gap: ${ gapValue }
 	}`;
 
 	const GapStyle = () => {

package/src/gallery/index.php

@@ -48,7 +48,14 @@ function block_core_gallery_render( $attributes, $content ) {
 	// Skip if gap value contains unsupported characters.
 	// Regex for CSS value borrowed from `safecss_filter_attr`, and used here
 	// because we only want to match against the value, not the CSS attribute.
-	$gap     = preg_match( '%[\\\(&=}]|/\*%', $gap ) ? null : $gap;
+	if ( is_array( $gap ) ) {
+		foreach ( $gap as $key => $value ) {
+			$gap[ $key ] = $value && preg_match( '%[\\\(&=}]|/\*%', $value ) ? null : $value;
+		}
+	} else {
+		$gap = $gap && preg_match( '%[\\\(&=}]|/\*%', $gap ) ? null : $gap;
+	}
+
 	$class   = wp_unique_id( 'wp-block-gallery-' );
 	$content = preg_replace(
 		'/' . preg_quote( 'class="', '/' ) . '/',
@@ -56,10 +63,22 @@ function block_core_gallery_render( $attributes, $content ) {
 		$content,
 		1
 	);
+
 	// --gallery-block--gutter-size is deprecated. --wp--style--gallery-gap-default should be used by themes that want to set a default
 	// gap on the gallery.
-	$gap_value = $gap ? $gap : 'var( --wp--style--gallery-gap-default, var( --gallery-block--gutter-size, var( --wp--style--block-gap, 0.5em ) ) )';
-	$style     = '.' . $class . '{ --wp--style--unstable-gallery-gap: ' . $gap_value . '; gap: ' . $gap_value . '}';
+	$fallback_gap = 'var( --wp--style--gallery-gap-default, var( --gallery-block--gutter-size, var( --wp--style--block-gap, 0.5em ) ) )';
+	$gap_value    = $gap ? $gap : $fallback_gap;
+	$gap_column   = $gap_value;
+
+	if ( is_array( $gap_value ) ) {
+		$gap_row    = isset( $gap_value['top'] ) ? $gap_value['top'] : $fallback_gap;
+		$gap_column = isset( $gap_value['left'] ) ? $gap_value['left'] : $fallback_gap;
+		$gap_value  = $gap_row === $gap_column ? $gap_row : $gap_row . ' ' . $gap_column;
+	}
+
+	// Set the CSS variable to the column value, and the `gap` property to the combined gap value.
+	$style = '.' . $class . '{ --wp--style--unstable-gallery-gap: ' . $gap_column . '; gap: ' . $gap_value . '}';
+
 	// Ideally styles should be loaded in the head, but blocks may be parsed
 	// after that, so loading in the footer for now.
 	// See https://core.trac.wordpress.org/ticket/53494.
@@ -67,7 +86,8 @@ function block_core_gallery_render( $attributes, $content ) {
 		'wp_footer',
 		function () use ( $style ) {
 			echo '<style> ' . $style . '</style>';
-		}
+		},
+		11
 	);
 	return $content;
 }

package/src/image/edit.js

@@ -87,20 +87,6 @@ function hasDefaultSize( image, defaultSize ) {
 	);
 }
 
-/**
- * Checks if a media attachment object has been "destroyed",
- * that is, removed from the media library. The core Media Library
- * adds a `destroyed` property to a deleted attachment object in the media collection.
- *
- * @param {number} id The attachment id.
- *
- * @return {boolean} Whether the image has been destroyed.
- */
-export function isMediaDestroyed( id ) {
-	const attachment = wp?.media?.attachment( id ) || {};
-	return attachment.destroyed;
-}
-
 export function ImageEdit( {
 	attributes,
 	setAttributes,
@@ -141,33 +127,6 @@ export function ImageEdit( {
 		return pick( getSettings(), [ 'imageDefaultSize', 'mediaUpload' ] );
 	}, [] );
 
-	// A callback passed to MediaUpload,
-	// fired when the media modal closes.
-	function onCloseModal() {
-		if ( isMediaDestroyed( attributes?.id ) ) {
-			setAttributes( {
-				url: undefined,
-				id: undefined,
-			} );
-		}
-	}
-
-	/*
-		 Runs an error callback if the image does not load.
-		 If the error callback is triggered, we infer that that image
-		 has been deleted.
-	*/
-	function onImageError( isReplaced = false ) {
-		// If the image block was not replaced with an embed,
-		// clear the attributes and trigger the placeholder.
-		if ( ! isReplaced ) {
-			setAttributes( {
-				url: undefined,
-				id: undefined,
-			} );
-		}
-	}
-
 	function onUploadError( message ) {
 		noticeOperations.removeAllNotices();
 		noticeOperations.createErrorNotice( message );
@@ -366,8 +325,6 @@ export function ImageEdit( {
 					containerRef={ ref }
 					context={ context }
 					clientId={ clientId }
-					onCloseModal={ onCloseModal }
-					onImageLoadError={ onImageError }
 				/>
 			) }
 			{ ! url && (
@@ -384,7 +341,6 @@ export function ImageEdit( {
 				onSelectURL={ onSelectURL }
 				notices={ noticeUI }
 				onError={ onUploadError }
-				onClose={ onCloseModal }
 				accept="image/*"
 				allowedTypes={ ALLOWED_MEDIA_TYPES }
 				value={ { id, src } }

package/src/image/image.js

@@ -43,7 +43,7 @@ import { store as coreStore } from '@wordpress/core-data';
  */
 import { createUpgradedEmbedBlock } from '../embed/util';
 import useClientWidth from './use-client-width';
-import { isExternalImage, isMediaDestroyed } from './edit';
+import { isExternalImage } from './edit';
 
 /**
  * Module constants
@@ -72,14 +72,12 @@ export default function Image( {
 	isSelected,
 	insertBlocksAfter,
 	onReplace,
-	onCloseModal,
 	onSelectImage,
 	onSelectURL,
 	onUploadError,
 	containerRef,
 	context,
 	clientId,
-	onImageLoadError,
 } ) {
 	const imageRef = useRef();
 	const captionRef = useRef();
@@ -218,16 +216,11 @@ export default function Image( {
 	}
 
 	function onImageError() {
-		// Check if there's an embed block that handles this URL, e.g., instagram URL.
-		// See: https://github.com/WordPress/gutenberg/pull/11472
+		// Check if there's an embed block that handles this URL.
 		const embedBlock = createUpgradedEmbedBlock( { attributes: { url } } );
-		const shouldReplace = undefined !== embedBlock;
-
-		if ( shouldReplace ) {
+		if ( undefined !== embedBlock ) {
 			onReplace( embedBlock );
 		}
-
-		onImageLoadError( shouldReplace );
 	}
 
 	function onSetHref( props ) {
@@ -299,9 +292,6 @@ export default function Image( {
 		if ( ! isSelected ) {
 			setIsEditingImage( false );
 		}
-		if ( isSelected && isMediaDestroyed( id ) ) {
-			onImageLoadError();
-		}
 	}, [ isSelected ] );
 
 	const canEditImage = id && naturalWidth && naturalHeight && imageEditing;
@@ -365,7 +355,6 @@ export default function Image( {
 						onSelect={ onSelectImage }
 						onSelectURL={ onSelectURL }
 						onError={ onUploadError }
-						onCloseModal={ onCloseModal }
 					/>
 				</BlockControls>
 			) }

package/src/latest-posts/edit.js

@@ -28,9 +28,11 @@ import {
 	useBlockProps,
 	store as blockEditorStore,
 } from '@wordpress/block-editor';
-import { useSelect } from '@wordpress/data';
+import { useSelect, useDispatch } from '@wordpress/data';
 import { pin, list, grid } from '@wordpress/icons';
 import { store as coreStore } from '@wordpress/core-data';
+import { store as noticeStore } from '@wordpress/notices';
+import { useInstanceId } from '@wordpress/compose';
 
 /**
  * Internal dependencies
@@ -66,6 +68,7 @@ function getFeaturedImageDetails( post, size ) {
 }
 
 export default function LatestPostsEdit( { attributes, setAttributes } ) {
+	const instanceId = useInstanceId( LatestPostsEdit );
 	const {
 		postsToShow,
 		order,
@@ -148,6 +151,20 @@ export default function LatestPostsEdit( { attributes, setAttributes } ) {
 		]
 	);
 
+	// If a user clicks to a link prevent redirection and show a warning.
+	const { createWarningNotice, removeNotice } = useDispatch( noticeStore );
+	let noticeId;
+	const showRedirectionPreventedNotice = ( event ) => {
+		event.preventDefault();
+		// Remove previous warning if any, to show one at a time per block.
+		removeNotice( noticeId );
+		noticeId = `block-library/core/latest-posts/redirection-prevented/${ instanceId }`;
+		createWarningNotice( __( 'Links are disabled in the editor.' ), {
+			id: noticeId,
+			type: 'snackbar',
+		} );
+	};
+
 	const imageSizeOptions = imageSizes
 		.filter( ( { slug } ) => slug !== 'full' )
 		.map( ( { name, slug } ) => ( {
@@ -466,7 +483,11 @@ export default function LatestPostsEdit( { attributes, setAttributes } ) {
 								.join( ' ' ) }
 							{ /* translators: excerpt truncation character, default …  */ }
 							{ __( ' … ' ) }
-							<a href={ post.link } rel="noopener noreferrer">
+							<a
+								href={ post.link }
+								rel="noopener noreferrer"
+								onClick={ showRedirectionPreventedNotice }
+							>
 								{ __( 'Read more' ) }
 							</a>
 						</>
@@ -483,6 +504,9 @@ export default function LatestPostsEdit( { attributes, setAttributes } ) {
 											className="wp-block-latest-posts__post-title"
 											href={ post.link }
 											rel="noreferrer noopener"
+											onClick={
+												showRedirectionPreventedNotice
+											}
 										>
 											{ featuredImage }
 										</a>
@@ -501,6 +525,7 @@ export default function LatestPostsEdit( { attributes, setAttributes } ) {
 										  }
 										: undefined
 								}
+								onClick={ showRedirectionPreventedNotice }
 							>
 								{ ! titleTrimmed ? __( '(no title)' ) : null }
 							</a>