From c4b166fd99a9a4b66b7c769d19f4e86989189b6d Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Fri, 26 May 2023 10:24:52 +0100
Subject: [PATCH 01/24] Remove edit control from preview

---
 .../src/components/link-control/link-preview.js        | 10 +---------
 1 file changed, 1 insertion(+), 9 deletions(-)

diff --git a/packages/block-editor/src/components/link-control/link-preview.js b/packages/block-editor/src/components/link-control/link-preview.js
index 04a67d44789948..05a39382d81984 100644
--- a/packages/block-editor/src/components/link-control/link-preview.js
+++ b/packages/block-editor/src/components/link-control/link-preview.js
@@ -14,7 +14,7 @@ import {
 	Tooltip,
 } from '@wordpress/components';
 import { filterURLForDisplay, safeDecodeURI } from '@wordpress/url';
-import { Icon, globe, info, linkOff, edit } from '@wordpress/icons';
+import { Icon, globe, info, linkOff } from '@wordpress/icons';
 import { __unstableStripHTML as stripHTML } from '@wordpress/dom';
 
 /**
@@ -26,7 +26,6 @@ import useRichUrlData from './use-rich-url-data';
 
 export default function LinkPreview( {
 	value,
-	onEditClick,
 	hasRichPreviews = false,
 	hasUnlinkControl = false,
 	onRemove,
@@ -114,13 +113,6 @@ export default function LinkPreview( {
 					</span>
 				</span>
 
-				<Button
-					icon={ edit }
-					label={ __( 'Edit' ) }
-					className="block-editor-link-control__search-item-action"
-					onClick={ onEditClick }
-					iconSize={ 24 }
-				/>
 				{ hasUnlinkControl && (
 					<Button
 						icon={ linkOff }

From 5be5c28f525f7edcfc4d95d20b6713f557485bd9 Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Fri, 26 May 2023 10:25:54 +0100
Subject: [PATCH 02/24] Remove image and description from preview

---
 .../components/link-control/link-preview.js   | 49 +------------------
 1 file changed, 1 insertion(+), 48 deletions(-)

diff --git a/packages/block-editor/src/components/link-control/link-preview.js b/packages/block-editor/src/components/link-control/link-preview.js
index 05a39382d81984..4ef7730a035982 100644
--- a/packages/block-editor/src/components/link-control/link-preview.js
+++ b/packages/block-editor/src/components/link-control/link-preview.js
@@ -7,12 +7,7 @@ import classnames from 'classnames';
  * WordPress dependencies
  */
 import { __ } from '@wordpress/i18n';
-import {
-	Button,
-	ExternalLink,
-	__experimentalText as Text,
-	Tooltip,
-} from '@wordpress/components';
+import { Button, ExternalLink, Tooltip } from '@wordpress/components';
 import { filterURLForDisplay, safeDecodeURI } from '@wordpress/url';
 import { Icon, globe, info, linkOff } from '@wordpress/icons';
 import { __unstableStripHTML as stripHTML } from '@wordpress/dom';
@@ -125,48 +120,6 @@ export default function LinkPreview( {
 				<ViewerSlot fillProps={ value } />
 			</div>
 
-			{ !! (
-				( hasRichData &&
-					( richData?.image || richData?.description ) ) ||
-				isFetching
-			) && (
-				<div className="block-editor-link-control__search-item-bottom">
-					{ ( richData?.image || isFetching ) && (
-						<div
-							aria-hidden={ ! richData?.image }
-							className={ classnames(
-								'block-editor-link-control__search-item-image',
-								{
-									'is-placeholder': ! richData?.image,
-								}
-							) }
-						>
-							{ richData?.image && (
-								<img src={ richData?.image } alt="" />
-							) }
-						</div>
-					) }
-
-					{ ( richData?.description || isFetching ) && (
-						<div
-							aria-hidden={ ! richData?.description }
-							className={ classnames(
-								'block-editor-link-control__search-item-description',
-								{
-									'is-placeholder': ! richData?.description,
-								}
-							) }
-						>
-							{ richData?.description && (
-								<Text truncate numberOfLines="2">
-									{ richData.description }
-								</Text>
-							) }
-						</div>
-					) }
-				</div>
-			) }
-
 			{ additionalControls && additionalControls() }
 		</div>
 	);

From fbb69addba39e95da028264423d590de5a1296df Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Fri, 26 May 2023 10:29:13 +0100
Subject: [PATCH 03/24] =?UTF-8?q?Don=E2=80=99t=20use=20label=20in=20previe?=
 =?UTF-8?q?w=20title=20and=20this=20represents=20an=20entity?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/link-control/link-preview.js             | 6 ++----
 1 file changed, 2 insertions(+), 4 deletions(-)

diff --git a/packages/block-editor/src/components/link-control/link-preview.js b/packages/block-editor/src/components/link-control/link-preview.js
index 4ef7730a035982..e8980f1c5ea473 100644
--- a/packages/block-editor/src/components/link-control/link-preview.js
+++ b/packages/block-editor/src/components/link-control/link-preview.js
@@ -38,13 +38,11 @@ export default function LinkPreview( {
 		( value && filterURLForDisplay( safeDecodeURI( value.url ), 16 ) ) ||
 		'';
 
+	const displayTitle = stripHTML( richData?.title || displayURL );
+
 	// url can be undefined if the href attribute is unset
 	const isEmptyURL = ! value?.url?.length;
 
-	const displayTitle =
-		! isEmptyURL &&
-		stripHTML( richData?.title || value?.title || displayURL );
-
 	let icon;
 
 	if ( richData?.icon ) {

From 3a59112c53e25b3cf373c4cccc960863df933eed Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Thu, 7 Sep 2023 12:07:13 +0100
Subject: [PATCH 04/24] Remove some editing-based conditionals

---
 .../src/components/link-control/index.js      | 150 ++++++++----------
 packages/format-library/src/link/inline.js    |   2 +-
 2 files changed, 64 insertions(+), 88 deletions(-)

diff --git a/packages/block-editor/src/components/link-control/index.js b/packages/block-editor/src/components/link-control/index.js
index a208fa20d242ff..689b48c403b14b 100644
--- a/packages/block-editor/src/components/link-control/index.js
+++ b/packages/block-editor/src/components/link-control/index.js
@@ -333,16 +333,15 @@ function LinkControl( {
 	const shownUnlinkControl =
 		onRemove && value && ! isEditingLink && ! isCreatingPage;
 
-	const showActions = isEditingLink && hasLinkValue;
+	const showActions = hasLinkValue;
 
 	// Only show text control once a URL value has been committed
 	// and it isn't just empty whitespace.
 	// See https://github.com/WordPress/gutenberg/pull/33849/#issuecomment-932194927.
 	const showTextControl = hasLinkValue && hasTextControl;
 
-	const isEditing = ( isEditingLink || ! value ) && ! isCreatingPage;
 	const isDisabled = ! valueHasChanges || currentInputIsEmpty;
-	const showSettings = !! settings?.length && isEditingLink && hasLinkValue;
+	const showSettings = !! settings?.length && hasLinkValue;
 
 	return (
 		<div
@@ -356,96 +355,13 @@ function LinkControl( {
 				</div>
 			) }
 
-			{ isEditing && (
-				<>
-					<div
-						className={ classnames( {
-							'block-editor-link-control__search-input-wrapper': true,
-							'has-text-control': showTextControl,
-							'has-actions': showActions,
-						} ) }
-					>
-						{ showTextControl && (
-							<TextControl
-								__nextHasNoMarginBottom
-								ref={ textInputRef }
-								className="block-editor-link-control__field block-editor-link-control__text-content"
-								label={ __( 'Text' ) }
-								value={ internalControlValue?.title }
-								onChange={ setInternalTextInputValue }
-								onKeyDown={ handleSubmitWithEnter }
-								size="__unstable-large"
-							/>
-						) }
-						<LinkControlSearchInput
-							currentLink={ value }
-							className="block-editor-link-control__field block-editor-link-control__search-input"
-							placeholder={ searchInputPlaceholder }
-							value={ currentUrlInputValue }
-							withCreateSuggestion={ withCreateSuggestion }
-							onCreateSuggestion={ createPage }
-							onChange={ setInternalURLInputValue }
-							onSelect={ handleSelectSuggestion }
-							showInitialSuggestions={ showInitialSuggestions }
-							allowDirectEntry={ ! noDirectEntry }
-							showSuggestions={ showSuggestions }
-							suggestionsQuery={ suggestionsQuery }
-							withURLSuggestion={ ! noURLSuggestion }
-							createSuggestionButtonText={
-								createSuggestionButtonText
-							}
-							hideLabelFromVision={ ! showTextControl }
-						/>
-						{ ! showActions && (
-							<div className="block-editor-link-control__search-enter">
-								<Button
-									onClick={ isDisabled ? noop : handleSubmit }
-									label={ __( 'Submit' ) }
-									icon={ keyboardReturn }
-									className="block-editor-link-control__search-submit"
-									aria-disabled={ isDisabled }
-								/>
-							</div>
-						) }
-					</div>
-					{ errorMessage && (
-						<Notice
-							className="block-editor-link-control__search-error"
-							status="error"
-							isDismissible={ false }
-						>
-							{ errorMessage }
-						</Notice>
-					) }
-				</>
-			) }
-
-			{ value && ! isEditingLink && ! isCreatingPage && (
+			{ hasLinkValue && ! isCreatingPage && (
 				<LinkPreview
 					key={ value?.url } // force remount when URL changes to avoid race conditions for rich previews
 					value={ value }
 					onEditClick={ () => setIsEditingLink( true ) }
 					hasRichPreviews={ hasRichPreviews }
 					hasUnlinkControl={ shownUnlinkControl }
-					additionalControls={ () => {
-						// Expose the "Opens in new tab" settings in the preview
-						// as it is the most common setting to change.
-						if (
-							settings?.find(
-								( setting ) => setting.id === 'opensInNewTab'
-							)
-						) {
-							return (
-								<LinkSettings
-									value={ internalControlValue }
-									settings={ settings?.filter(
-										( { id } ) => id === 'opensInNewTab'
-									) }
-									onChange={ onChange }
-								/>
-							);
-						}
-					} }
 					onRemove={ () => {
 						onRemove();
 						setIsEditingLink( true );
@@ -453,6 +369,66 @@ function LinkControl( {
 				/>
 			) }
 
+			<div
+				className={ classnames( {
+					'block-editor-link-control__search-input-wrapper': true,
+					'has-text-control': showTextControl,
+					'has-actions': showActions,
+				} ) }
+			>
+				<LinkControlSearchInput
+					currentLink={ value }
+					className="block-editor-link-control__field block-editor-link-control__search-input"
+					placeholder={ searchInputPlaceholder }
+					value={ currentUrlInputValue }
+					withCreateSuggestion={ withCreateSuggestion }
+					onCreateSuggestion={ createPage }
+					onChange={ setInternalURLInputValue }
+					onSelect={ handleSelectSuggestion }
+					showInitialSuggestions={ showInitialSuggestions }
+					allowDirectEntry={ ! noDirectEntry }
+					showSuggestions={ showSuggestions }
+					suggestionsQuery={ suggestionsQuery }
+					withURLSuggestion={ ! noURLSuggestion }
+					createSuggestionButtonText={ createSuggestionButtonText }
+					hideLabelFromVision={ ! showTextControl }
+				/>
+
+				{ showTextControl && (
+					<TextControl
+						__nextHasNoMarginBottom
+						ref={ textInputRef }
+						className="block-editor-link-control__field block-editor-link-control__text-content"
+						label={ __( 'Text' ) }
+						value={ internalControlValue?.title }
+						onChange={ setInternalTextInputValue }
+						onKeyDown={ handleSubmitWithEnter }
+						size="__unstable-large"
+					/>
+				) }
+
+				{ ! showActions && (
+					<div className="block-editor-link-control__search-enter">
+						<Button
+							onClick={ isDisabled ? noop : handleSubmit }
+							label={ __( 'Submit' ) }
+							icon={ keyboardReturn }
+							className="block-editor-link-control__search-submit"
+							aria-disabled={ isDisabled }
+						/>
+					</div>
+				) }
+			</div>
+			{ errorMessage && (
+				<Notice
+					className="block-editor-link-control__search-error"
+					status="error"
+					isDismissible={ false }
+				>
+					{ errorMessage }
+				</Notice>
+			) }
+
 			{ showSettings && (
 				<div className="block-editor-link-control__tools">
 					{ ! currentInputIsEmpty && (
diff --git a/packages/format-library/src/link/inline.js b/packages/format-library/src/link/inline.js
index 58da13eb51ab6b..27d26ab860b81b 100644
--- a/packages/format-library/src/link/inline.js
+++ b/packages/format-library/src/link/inline.js
@@ -264,7 +264,7 @@ function InlineLinkUI( {
 				value={ linkValue }
 				onChange={ onChangeLink }
 				onRemove={ removeLink }
-				forceIsEditingLink={ addingLink }
+				onCancel={ stopAddingLink }
 				hasRichPreviews
 				createSuggestion={ createPageEntity && handleCreate }
 				withCreateSuggestion={ userCanCreatePages }

From 6f39472443c85f67af24c8174e717833c85e3215 Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Thu, 7 Sep 2023 12:10:33 +0100
Subject: [PATCH 05/24] Remove remaining state relating to editing mode

---
 .../src/components/link-control/index.js      | 31 ++-----------------
 1 file changed, 3 insertions(+), 28 deletions(-)

diff --git a/packages/block-editor/src/components/link-control/index.js b/packages/block-editor/src/components/link-control/index.js
index 689b48c403b14b..25fff71c0234d8 100644
--- a/packages/block-editor/src/components/link-control/index.js
+++ b/packages/block-editor/src/components/link-control/index.js
@@ -91,9 +91,6 @@ import { DEFAULT_LINK_SETTINGS } from './constants';
  *
  * @property {(WPLinkControlSetting[])=}  settings                   An array of settings objects. Each object will used to
  *                                                                   render a `ToggleControl` for that setting.
- * @property {boolean=}                   forceIsEditingLink         If passed as either `true` or `false`, controls the
- *                                                                   internal editing state of the component to respective
- *                                                                   show or not show the URL input field.
  * @property {WPLinkControlValue=}        value                      Current link value.
  * @property {WPLinkControlOnChangeProp=} onChange                   Value change handler, called with the updated value if
  *                                                                   the user selects a new link or updates settings.
@@ -130,7 +127,6 @@ function LinkControl( {
 	noDirectEntry = false,
 	showSuggestions = true,
 	showInitialSuggestions,
-	forceIsEditingLink,
 	createSuggestion,
 	withCreateSuggestion,
 	inputValue: propInputValue = '',
@@ -198,23 +194,9 @@ function LinkControl( {
 	const valueHasChanges =
 		value && ! isShallowEqualObjects( internalControlValue, value );
 
-	const [ isEditingLink, setIsEditingLink ] = useState(
-		forceIsEditingLink !== undefined
-			? forceIsEditingLink
-			: ! value || ! value.url
-	);
-
 	const { createPage, isCreatingPage, errorMessage } =
 		useCreatePage( createSuggestion );
 
-	useEffect( () => {
-		if ( forceIsEditingLink === undefined ) {
-			return;
-		}
-
-		setIsEditingLink( forceIsEditingLink );
-	}, [ forceIsEditingLink ] );
-
 	useEffect( () => {
 		// We don't auto focus into the Link UI on mount
 		// because otherwise using the keyboard to select text
@@ -236,7 +218,7 @@ function LinkControl( {
 		nextFocusTarget.focus();
 
 		isEndingEditWithFocus.current = false;
-	}, [ isEditingLink, isCreatingPage ] );
+	}, [ isCreatingPage ] );
 
 	const hasLinkValue = value?.url?.trim()?.length > 0;
 
@@ -248,8 +230,6 @@ function LinkControl( {
 		isEndingEditWithFocus.current = !! wrapperNode.current?.contains(
 			wrapperNode.current.ownerDocument.activeElement
 		);
-
-		setIsEditingLink( false );
 	};
 
 	const handleSelectSuggestion = ( updatedValue ) => {
@@ -330,8 +310,7 @@ function LinkControl( {
 
 	const currentInputIsEmpty = ! currentUrlInputValue?.trim()?.length;
 
-	const shownUnlinkControl =
-		onRemove && value && ! isEditingLink && ! isCreatingPage;
+	const shownUnlinkControl = onRemove && value && ! isCreatingPage;
 
 	const showActions = hasLinkValue;
 
@@ -359,13 +338,9 @@ function LinkControl( {
 				<LinkPreview
 					key={ value?.url } // force remount when URL changes to avoid race conditions for rich previews
 					value={ value }
-					onEditClick={ () => setIsEditingLink( true ) }
 					hasRichPreviews={ hasRichPreviews }
 					hasUnlinkControl={ shownUnlinkControl }
-					onRemove={ () => {
-						onRemove();
-						setIsEditingLink( true );
-					} }
+					onRemove={ onRemove }
 				/>
 			) }
 

From 4b3faf381cc9b813c22778c2913c02a8a9cd542e Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Thu, 7 Sep 2023 12:13:53 +0100
Subject: [PATCH 06/24] Add border to separate preview from form

---
 packages/block-editor/src/components/link-control/style.scss | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/packages/block-editor/src/components/link-control/style.scss b/packages/block-editor/src/components/link-control/style.scss
index 4821359cab8fc0..f6ce8a64bd0ab5 100644
--- a/packages/block-editor/src/components/link-control/style.scss
+++ b/packages/block-editor/src/components/link-control/style.scss
@@ -195,6 +195,10 @@ $preview-image-height: 140px;
 		}
 	}
 
+	&.is-preview {
+		border-bottom: 1px solid $gray-400;
+	}
+
 	&.is-preview .block-editor-link-control__search-item-header {
 		display: flex;
 		flex: 1; // Fill available space.

From f3c146067906e260d701d560bd8476d227d2f7a7 Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Thu, 7 Sep 2023 12:19:32 +0100
Subject: [PATCH 07/24] Always focus firstElement in Popover

---
 packages/format-library/src/link/inline.js | 13 ++-----------
 1 file changed, 2 insertions(+), 11 deletions(-)

diff --git a/packages/format-library/src/link/inline.js b/packages/format-library/src/link/inline.js
index 27d26ab860b81b..30c35808921fe6 100644
--- a/packages/format-library/src/link/inline.js
+++ b/packages/format-library/src/link/inline.js
@@ -1,7 +1,7 @@
 /**
  * WordPress dependencies
  */
-import { useMemo, useRef, createInterpolateElement } from '@wordpress/element';
+import { useMemo, createInterpolateElement } from '@wordpress/element';
 import { __, sprintf } from '@wordpress/i18n';
 import { speak } from '@wordpress/a11y';
 import { Popover } from '@wordpress/components';
@@ -42,7 +42,6 @@ const LINK_SETTINGS = [
 function InlineLinkUI( {
 	isActive,
 	activeAttributes,
-	addingLink,
 	value,
 	onChange,
 	stopAddingLink,
@@ -216,14 +215,6 @@ function InlineLinkUI( {
 	// See https://github.com/WordPress/gutenberg/pull/34742.
 	const forceRemountKey = useLinkInstanceKey( popoverAnchor );
 
-	// Focus should only be moved into the Popover when the Link is being created or edited.
-	// When the Link is in "preview" mode focus should remain on the rich text because at
-	// this point the Link dialog is informational only and thus the user should be able to
-	// continue editing the rich text.
-	// Ref used because the focusOnMount prop shouldn't evolve during render of a Popover
-	// otherwise it causes a render of the content.
-	const focusOnMount = useRef( addingLink ? 'firstElement' : false );
-
 	async function handleCreate( pageTitle ) {
 		const page = await createPageEntity( {
 			title: pageTitle,
@@ -253,7 +244,7 @@ function InlineLinkUI( {
 	return (
 		<Popover
 			anchor={ popoverAnchor }
-			focusOnMount={ focusOnMount.current }
+			focusOnMount={ 'firstElement' }
 			onClose={ stopAddingLink }
 			onFocusOutside={ () => stopAddingLink( false ) }
 			placement="bottom"

From afbed95320cf29f39fd11d8562e12e519522a0a8 Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Thu, 7 Sep 2023 12:21:22 +0100
Subject: [PATCH 08/24] Make Popover a dialog

---
 packages/format-library/src/link/inline.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/format-library/src/link/inline.js b/packages/format-library/src/link/inline.js
index 30c35808921fe6..fee80b7a5fa769 100644
--- a/packages/format-library/src/link/inline.js
+++ b/packages/format-library/src/link/inline.js
@@ -243,6 +243,7 @@ function InlineLinkUI( {
 
 	return (
 		<Popover
+			role="dialog"
 			anchor={ popoverAnchor }
 			focusOnMount={ 'firstElement' }
 			onClose={ stopAddingLink }

From a1a41dcaaaa3c9a986903ba0d7bb292665c08ba2 Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Thu, 7 Sep 2023 12:31:24 +0100
Subject: [PATCH 09/24] Allow for Popover to be forced closed when exiting the
 Link UI

---
 packages/format-library/src/link/index.js | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/packages/format-library/src/link/index.js b/packages/format-library/src/link/index.js
index ab287daff19a73..04c76197b069b8 100644
--- a/packages/format-library/src/link/index.js
+++ b/packages/format-library/src/link/index.js
@@ -2,7 +2,7 @@
  * WordPress dependencies
  */
 import { __ } from '@wordpress/i18n';
-import { useState } from '@wordpress/element';
+import { useState, useEffect } from '@wordpress/element';
 import {
 	getTextContent,
 	applyFormat,
@@ -40,6 +40,18 @@ function Edit( {
 } ) {
 	const [ addingLink, setAddingLink ] = useState( false );
 
+	// When the format is active toggle the state keeping track
+	// of whether to show the Link UI. This is needed to ensure
+	// that the addingLink state alone controls the visibility
+	// of the Link UI. This allows the Link UI to be forced to
+	// close (even if the format is active) if the user closes
+	// the Popover.
+	useEffect( () => {
+		if ( isActive ) {
+			setAddingLink( true );
+		}
+	}, [ isActive ] );
+
 	function addLink() {
 		const text = getTextContent( slice( value ) );
 
@@ -108,7 +120,7 @@ function Edit( {
 					aria-expanded={ addingLink || isActive }
 				/>
 			) }
-			{ ( addingLink || isActive ) && (
+			{ addingLink && (
 				<InlineLinkUI
 					addingLink={ addingLink }
 					stopAddingLink={ stopAddingLink }

From 87d8d99e713166b5a386f5ee172ddd3f7dd7d277 Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Thu, 7 Sep 2023 12:41:03 +0100
Subject: [PATCH 10/24] Reintstate rich media preview for attachments

---
 .../components/link-control/link-preview.js   | 27 +++++++++++++++++++
 1 file changed, 27 insertions(+)

diff --git a/packages/block-editor/src/components/link-control/link-preview.js b/packages/block-editor/src/components/link-control/link-preview.js
index e8980f1c5ea473..384fd8dc73eb90 100644
--- a/packages/block-editor/src/components/link-control/link-preview.js
+++ b/packages/block-editor/src/components/link-control/link-preview.js
@@ -26,6 +26,9 @@ export default function LinkPreview( {
 	onRemove,
 	additionalControls,
 } ) {
+	// Only use the image if the type is a media attachment.
+	const showRichDataImage = value?.type === 'attachment';
+
 	// Avoid fetching if rich previews are not desired.
 	const showRichPreviews = hasRichPreviews ? value?.url : null;
 
@@ -118,6 +121,30 @@ export default function LinkPreview( {
 				<ViewerSlot fillProps={ value } />
 			</div>
 
+			{ !! (
+				hasRichData &&
+				showRichDataImage &&
+				( richData?.image || isFetching )
+			) && (
+				<div className="block-editor-link-control__search-item-bottom">
+					{ ( richData?.image || isFetching ) && (
+						<div
+							aria-hidden={ ! richData?.image }
+							className={ classnames(
+								'block-editor-link-control__search-item-image',
+								{
+									'is-placeholder': ! richData?.image,
+								}
+							) }
+						>
+							{ richData?.image && (
+								<img src={ richData?.image } alt="" />
+							) }
+						</div>
+					) }
+				</div>
+			) }
+
 			{ additionalControls && additionalControls() }
 		</div>
 	);

From 605f11ceb89a78aa2d537f623b449eac7bc13ad4 Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Thu, 7 Sep 2023 12:45:07 +0100
Subject: [PATCH 11/24] Fix Nav block to conform to new steps

---
 packages/block-library/src/navigation-link/edit.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/block-library/src/navigation-link/edit.js b/packages/block-library/src/navigation-link/edit.js
index f6936e8ecfe362..2871d88df63048 100644
--- a/packages/block-library/src/navigation-link/edit.js
+++ b/packages/block-library/src/navigation-link/edit.js
@@ -574,6 +574,7 @@ export default function NavigationLinkEdit( {
 							onClose={ () => setIsLinkOpen( false ) }
 							anchor={ popoverAnchor }
 							onRemove={ removeLink }
+							onCancel={ () => setIsLinkOpen( false ) }
 							onChange={ ( updatedValue ) => {
 								updateAttributes(
 									updatedValue,

From a14c76391d9f4cf851328845ebab315d16c4ec61 Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Thu, 7 Sep 2023 12:51:44 +0100
Subject: [PATCH 12/24] =?UTF-8?q?Don=E2=80=99t=20show=20cancel=20button=20?=
 =?UTF-8?q?if=20no=20handler=20is=20supplied?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/link-control/index.js       | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

diff --git a/packages/block-editor/src/components/link-control/index.js b/packages/block-editor/src/components/link-control/index.js
index 25fff71c0234d8..5bb17c72b7c97f 100644
--- a/packages/block-editor/src/components/link-control/index.js
+++ b/packages/block-editor/src/components/link-control/index.js
@@ -322,6 +322,16 @@ function LinkControl( {
 	const isDisabled = ! valueHasChanges || currentInputIsEmpty;
 	const showSettings = !! settings?.length && hasLinkValue;
 
+	// In previous iterations of this component, clicking "Cancel" would toggle
+	// the UI to "preview" mode.
+	//
+	// However, this UI state was removed in:
+	// https://github.com/WordPress/gutenberg/pull/50998
+	//
+	// Therefore as the state no longer exists, unless a dedicated handler is
+	// provided, the cancel button will not be shown.
+	const showOnCancel = onCancel;
+
 	return (
 		<div
 			tabIndex={ -1 }
@@ -428,9 +438,11 @@ function LinkControl( {
 					justify="right"
 					className="block-editor-link-control__search-actions"
 				>
-					<Button variant="tertiary" onClick={ handleCancel }>
-						{ __( 'Cancel' ) }
-					</Button>
+					{ showOnCancel && (
+						<Button variant="tertiary" onClick={ handleCancel }>
+							{ __( 'Cancel' ) }
+						</Button>
+					) }
 					<Button
 						variant="primary"
 						onClick={ isDisabled ? noop : handleSubmit }

From 6a310acb13037864c984c8b9eb4257a244b243f9 Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Thu, 7 Sep 2023 12:58:29 +0100
Subject: [PATCH 13/24] Remove stopEditing internal mode

---
 .../src/components/link-control/index.js       | 18 +-----------------
 1 file changed, 1 insertion(+), 17 deletions(-)

diff --git a/packages/block-editor/src/components/link-control/index.js b/packages/block-editor/src/components/link-control/index.js
index 5bb17c72b7c97f..8ec3627d6ae786 100644
--- a/packages/block-editor/src/components/link-control/index.js
+++ b/packages/block-editor/src/components/link-control/index.js
@@ -222,16 +222,6 @@ function LinkControl( {
 
 	const hasLinkValue = value?.url?.trim()?.length > 0;
 
-	/**
-	 * Cancels editing state and marks that focus may need to be restored after
-	 * the next render, if focus was within the wrapper when editing finished.
-	 */
-	const stopEditing = () => {
-		isEndingEditWithFocus.current = !! wrapperNode.current?.contains(
-			wrapperNode.current.ownerDocument.activeElement
-		);
-	};
-
 	const handleSelectSuggestion = ( updatedValue ) => {
 		// Suggestions may contains "settings" values (e.g. `opensInNewTab`)
 		// which should not overide any existing settings values set by the
@@ -254,8 +244,6 @@ function LinkControl( {
 			// any "title" value provided by the "suggestion".
 			title: internalControlValue?.title || updatedValue?.title,
 		} );
-
-		stopEditing();
 	};
 
 	const handleSubmit = () => {
@@ -268,7 +256,6 @@ function LinkControl( {
 				url: currentUrlInputValue,
 			} );
 		}
-		stopEditing();
 	};
 
 	const handleSubmitWithEnter = ( event ) => {
@@ -294,10 +281,7 @@ function LinkControl( {
 		// Ensure that any unsubmitted input changes are reset.
 		resetInternalValues();
 
-		if ( hasLinkValue ) {
-			// If there is a link then exist editing mode and show preview.
-			stopEditing();
-		} else {
+		if ( ! hasLinkValue ) {
 			// If there is no link value, then remove the link entirely.
 			onRemove?.();
 		}

From 31cd88762176423d69ca7bb92a49733eac9e0d34 Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Thu, 7 Sep 2023 13:03:25 +0100
Subject: [PATCH 14/24] Call `onChange` will original value to mimic Cancel
 exiting the edit state

---
 .../src/components/link-control/index.js      | 37 +++++++++++--------
 1 file changed, 21 insertions(+), 16 deletions(-)

diff --git a/packages/block-editor/src/components/link-control/index.js b/packages/block-editor/src/components/link-control/index.js
index 8ec3627d6ae786..1d5fe293efa38d 100644
--- a/packages/block-editor/src/components/link-control/index.js
+++ b/packages/block-editor/src/components/link-control/index.js
@@ -286,7 +286,23 @@ function LinkControl( {
 			onRemove?.();
 		}
 
-		onCancel?.();
+		// In previous iterations of this component, clicking "Cancel" would toggle
+		// the component's UI into "preview" mode.
+		//
+		// However, this UI state was removed in:
+		// https://github.com/WordPress/gutenberg/pull/50998
+		//
+		// This poses a backwards compatibility problem as current consumers will
+		// assume that the previous UI behaviour is maintained.
+		//
+		// To avoid this, if a dedicated onCancel hanlder is not provided then the
+		// component will simply call onChange with the **original** (unchanged) value.
+		// This should effectively save the current value and close the UI.
+		if ( onCancel ) {
+			onCancel();
+		} else {
+			onChange( value );
+		}
 	};
 
 	const currentUrlInputValue =
@@ -306,16 +322,6 @@ function LinkControl( {
 	const isDisabled = ! valueHasChanges || currentInputIsEmpty;
 	const showSettings = !! settings?.length && hasLinkValue;
 
-	// In previous iterations of this component, clicking "Cancel" would toggle
-	// the UI to "preview" mode.
-	//
-	// However, this UI state was removed in:
-	// https://github.com/WordPress/gutenberg/pull/50998
-	//
-	// Therefore as the state no longer exists, unless a dedicated handler is
-	// provided, the cancel button will not be shown.
-	const showOnCancel = onCancel;
-
 	return (
 		<div
 			tabIndex={ -1 }
@@ -422,11 +428,10 @@ function LinkControl( {
 					justify="right"
 					className="block-editor-link-control__search-actions"
 				>
-					{ showOnCancel && (
-						<Button variant="tertiary" onClick={ handleCancel }>
-							{ __( 'Cancel' ) }
-						</Button>
-					) }
+					<Button variant="tertiary" onClick={ handleCancel }>
+						{ __( 'Cancel' ) }
+					</Button>
+
 					<Button
 						variant="primary"
 						onClick={ isDisabled ? noop : handleSubmit }

From 7b1f6e0966f75447da927acc34cc20b900955954 Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Thu, 7 Sep 2023 13:34:43 +0100
Subject: [PATCH 15/24] Update Core implemenation for button

---
 packages/block-library/src/button/edit.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/block-library/src/button/edit.js b/packages/block-library/src/button/edit.js
index d41d917d5b8fe1..71e0960249c8d2 100644
--- a/packages/block-library/src/button/edit.js
+++ b/packages/block-library/src/button/edit.js
@@ -311,7 +311,7 @@ function ButtonEdit( props ) {
 						richTextRef.current?.focus();
 					} }
 					anchor={ popoverAnchor }
-					focusOnMount={ isEditingURL ? 'firstElement' : false }
+					focusOnMount={ 'firstElement' }
 					__unstableSlotName={ '__unstable-block-tools-after' }
 					shift
 				>

From 251597c10253240d6f0ff863d109afe8d7cad42d Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Thu, 7 Sep 2023 13:35:00 +0100
Subject: [PATCH 16/24] Close UI on submitting link in Navigation block

---
 packages/block-library/src/navigation-link/edit.js | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/block-library/src/navigation-link/edit.js b/packages/block-library/src/navigation-link/edit.js
index 2871d88df63048..a0386bb16e6705 100644
--- a/packages/block-library/src/navigation-link/edit.js
+++ b/packages/block-library/src/navigation-link/edit.js
@@ -581,6 +581,8 @@ export default function NavigationLinkEdit( {
 									setAttributes,
 									attributes
 								);
+
+								setIsLinkOpen( false );
 							} }
 						/>
 					) }

From 19c457c78dbc8adced47d4b1eae5040491fdc09e Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Wed, 13 Sep 2023 11:45:43 +0100
Subject: [PATCH 17/24] Differentiate focus handling between create and edit

---
 packages/format-library/src/link/inline.js | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/packages/format-library/src/link/inline.js b/packages/format-library/src/link/inline.js
index fee80b7a5fa769..8224faaf08a3e8 100644
--- a/packages/format-library/src/link/inline.js
+++ b/packages/format-library/src/link/inline.js
@@ -1,7 +1,7 @@
 /**
  * WordPress dependencies
  */
-import { useMemo, createInterpolateElement } from '@wordpress/element';
+import { useMemo, useRef, createInterpolateElement } from '@wordpress/element';
 import { __, sprintf } from '@wordpress/i18n';
 import { speak } from '@wordpress/a11y';
 import { Popover } from '@wordpress/components';
@@ -241,11 +241,22 @@ function InlineLinkUI( {
 		);
 	}
 
+	const hasLink = linkValue?.url;
+
+	// Focus should only be moved into the Popover when the Link is being **created**.
+	// When the link has already been created it is in a pseudo "preview" mode and thus
+	// focus should remain on the rich text because at this point the Link dialog is
+	// partially informational and thus the user should be able to continue editing the
+	// rich text.
+	// Ref used because the focusOnMount prop shouldn't evolve during render of a Popover
+	// otherwise it causes a render of the content.
+	const focusOnMount = useRef( hasLink ? false : 'firstElement' );
+
 	return (
 		<Popover
 			role="dialog"
 			anchor={ popoverAnchor }
-			focusOnMount={ 'firstElement' }
+			focusOnMount={ focusOnMount.current }
 			onClose={ stopAddingLink }
 			onFocusOutside={ () => stopAddingLink( false ) }
 			placement="bottom"

From cce2a69bcd39371b30ba2738d7cbd926fe3d86ed Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Wed, 13 Sep 2023 11:55:54 +0100
Subject: [PATCH 18/24] Revert previous change

---
 packages/format-library/src/link/index.js | 16 ++--------------
 1 file changed, 2 insertions(+), 14 deletions(-)

diff --git a/packages/format-library/src/link/index.js b/packages/format-library/src/link/index.js
index 04c76197b069b8..ab287daff19a73 100644
--- a/packages/format-library/src/link/index.js
+++ b/packages/format-library/src/link/index.js
@@ -2,7 +2,7 @@
  * WordPress dependencies
  */
 import { __ } from '@wordpress/i18n';
-import { useState, useEffect } from '@wordpress/element';
+import { useState } from '@wordpress/element';
 import {
 	getTextContent,
 	applyFormat,
@@ -40,18 +40,6 @@ function Edit( {
 } ) {
 	const [ addingLink, setAddingLink ] = useState( false );
 
-	// When the format is active toggle the state keeping track
-	// of whether to show the Link UI. This is needed to ensure
-	// that the addingLink state alone controls the visibility
-	// of the Link UI. This allows the Link UI to be forced to
-	// close (even if the format is active) if the user closes
-	// the Popover.
-	useEffect( () => {
-		if ( isActive ) {
-			setAddingLink( true );
-		}
-	}, [ isActive ] );
-
 	function addLink() {
 		const text = getTextContent( slice( value ) );
 
@@ -120,7 +108,7 @@ function Edit( {
 					aria-expanded={ addingLink || isActive }
 				/>
 			) }
-			{ addingLink && (
+			{ ( addingLink || isActive ) && (
 				<InlineLinkUI
 					addingLink={ addingLink }
 					stopAddingLink={ stopAddingLink }

From 7214db76c5bf809d5348abe4b80b34a7150e33b6 Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Thu, 4 Jan 2024 11:15:15 +0000
Subject: [PATCH 19/24] =?UTF-8?q?Don=E2=80=99t=20set=20ID=20on=20direct=20?=
 =?UTF-8?q?entry=20results=20type?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/link-control/use-search-handler.js            | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/block-editor/src/components/link-control/use-search-handler.js b/packages/block-editor/src/components/link-control/use-search-handler.js
index 455d228be1974b..6150afe11aa6b9 100644
--- a/packages/block-editor/src/components/link-control/use-search-handler.js
+++ b/packages/block-editor/src/components/link-control/use-search-handler.js
@@ -39,7 +39,6 @@ export const handleDirectEntry = ( val ) => {
 
 	return Promise.resolve( [
 		{
-			id: val,
 			title: val,
 			url: type === 'URL' ? prependHTTP( val ) : val,
 			type,

From dbe5b823e9012f06d4f5dee9f54b0db3ffdb2bf3 Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Thu, 4 Jan 2024 11:16:14 +0000
Subject: [PATCH 20/24] Conditionally display search input only for direct
 entry results

---
 .../src/components/link-control/index.js      | 42 +++++++++++--------
 1 file changed, 25 insertions(+), 17 deletions(-)

diff --git a/packages/block-editor/src/components/link-control/index.js b/packages/block-editor/src/components/link-control/index.js
index 1d5fe293efa38d..efbd73752a9c99 100644
--- a/packages/block-editor/src/components/link-control/index.js
+++ b/packages/block-editor/src/components/link-control/index.js
@@ -314,6 +314,10 @@ function LinkControl( {
 
 	const showActions = hasLinkValue;
 
+	// Show the input if there is not a link value or if the link value
+	// does not represent a Post object.
+	const showSearchInput = ! hasLinkValue || ! value?.id;
+
 	// Only show text control once a URL value has been committed
 	// and it isn't just empty whitespace.
 	// See https://github.com/WordPress/gutenberg/pull/33849/#issuecomment-932194927.
@@ -351,23 +355,27 @@ function LinkControl( {
 					'has-actions': showActions,
 				} ) }
 			>
-				<LinkControlSearchInput
-					currentLink={ value }
-					className="block-editor-link-control__field block-editor-link-control__search-input"
-					placeholder={ searchInputPlaceholder }
-					value={ currentUrlInputValue }
-					withCreateSuggestion={ withCreateSuggestion }
-					onCreateSuggestion={ createPage }
-					onChange={ setInternalURLInputValue }
-					onSelect={ handleSelectSuggestion }
-					showInitialSuggestions={ showInitialSuggestions }
-					allowDirectEntry={ ! noDirectEntry }
-					showSuggestions={ showSuggestions }
-					suggestionsQuery={ suggestionsQuery }
-					withURLSuggestion={ ! noURLSuggestion }
-					createSuggestionButtonText={ createSuggestionButtonText }
-					hideLabelFromVision={ ! showTextControl }
-				/>
+				{ showSearchInput && (
+					<LinkControlSearchInput
+						currentLink={ value }
+						className="block-editor-link-control__field block-editor-link-control__search-input"
+						placeholder={ searchInputPlaceholder }
+						value={ currentUrlInputValue }
+						withCreateSuggestion={ withCreateSuggestion }
+						onCreateSuggestion={ createPage }
+						onChange={ setInternalURLInputValue }
+						onSelect={ handleSelectSuggestion }
+						showInitialSuggestions={ showInitialSuggestions }
+						allowDirectEntry={ ! noDirectEntry }
+						showSuggestions={ showSuggestions }
+						suggestionsQuery={ suggestionsQuery }
+						withURLSuggestion={ ! noURLSuggestion }
+						createSuggestionButtonText={
+							createSuggestionButtonText
+						}
+						hideLabelFromVision={ ! showTextControl }
+					/>
+				) }
 
 				{ showTextControl && (
 					<TextControl

From 8c03f78b0f297bfcdd6ade687e8adaaa5c985ddb Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Thu, 4 Jan 2024 11:21:36 +0000
Subject: [PATCH 21/24] Show non-searchable URL input for direct entry types

---
 .../src/components/link-control/index.js      | 21 ++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/packages/block-editor/src/components/link-control/index.js b/packages/block-editor/src/components/link-control/index.js
index efbd73752a9c99..6c6cc91fc4da27 100644
--- a/packages/block-editor/src/components/link-control/index.js
+++ b/packages/block-editor/src/components/link-control/index.js
@@ -314,9 +314,12 @@ function LinkControl( {
 
 	const showActions = hasLinkValue;
 
-	// Show the input if there is not a link value or if the link value
-	// does not represent a Post object.
-	const showSearchInput = ! hasLinkValue || ! value?.id;
+	// Show the searchable input if there is not a link value.
+	const showSearchInput = ! hasLinkValue;
+
+	// Show the plain URL input if there is a link value and
+	// it does not represent a Post object.
+	const showURLInput = hasLinkValue && ! value?.id;
 
 	// Only show text control once a URL value has been committed
 	// and it isn't just empty whitespace.
@@ -377,6 +380,18 @@ function LinkControl( {
 					/>
 				) }
 
+				{ showURLInput && (
+					<TextControl
+						__nextHasNoMarginBottom
+						className="block-editor-link-control__field block-editor-link-control__search-input"
+						label={ __( 'Link' ) }
+						value={ currentUrlInputValue }
+						onChange={ setInternalURLInputValue }
+						onKeyDown={ handleSubmitWithEnter }
+						size="__unstable-large"
+					/>
+				) }
+
 				{ showTextControl && (
 					<TextControl
 						__nextHasNoMarginBottom

From 656bfb1b94ed991e127767b2d512b9a42cd87116 Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Fri, 5 Jan 2024 12:43:46 +0000
Subject: [PATCH 22/24] Details entity details in preview

---
 .../src/components/link-control/constants.js  |  9 ++
 .../components/link-control/link-preview.js   | 32 +++++--
 .../components/link-control/search-item.js    | 23 ++---
 .../link-control/use-entity-data.js           | 89 +++++++++++++++++++
 .../provider/use-block-editor-settings.js     |  7 +-
 5 files changed, 135 insertions(+), 25 deletions(-)
 create mode 100644 packages/block-editor/src/components/link-control/use-entity-data.js

diff --git a/packages/block-editor/src/components/link-control/constants.js b/packages/block-editor/src/components/link-control/constants.js
index e70ff7b04c7477..e05e4f8dbee249 100644
--- a/packages/block-editor/src/components/link-control/constants.js
+++ b/packages/block-editor/src/components/link-control/constants.js
@@ -2,6 +2,7 @@
  * WordPress dependencies
  */
 import { __ } from '@wordpress/i18n';
+import { page, tag, postList, category, file } from '@wordpress/icons';
 
 // Used as a unique identifier for the "Create" option within search results.
 // Used to help distinguish the "Create" suggestion within the search results in
@@ -19,6 +20,14 @@ export const LINK_ENTRY_TYPES = [
 	INTERNAL_TYPE,
 ];
 
+export const ICONS_MAP = {
+	post: postList,
+	page,
+	post_tag: tag,
+	category,
+	attachment: file,
+};
+
 export const DEFAULT_LINK_SETTINGS = [
 	{
 		id: 'opensInNewTab',
diff --git a/packages/block-editor/src/components/link-control/link-preview.js b/packages/block-editor/src/components/link-control/link-preview.js
index 384fd8dc73eb90..cd9d085fe6ae28 100644
--- a/packages/block-editor/src/components/link-control/link-preview.js
+++ b/packages/block-editor/src/components/link-control/link-preview.js
@@ -18,6 +18,8 @@ import { __unstableStripHTML as stripHTML } from '@wordpress/dom';
 import { ViewerSlot } from './viewer-slot';
 
 import useRichUrlData from './use-rich-url-data';
+import useEntityData from './use-entity-data';
+import { ICONS_MAP } from './constants';
 
 export default function LinkPreview( {
 	value,
@@ -32,23 +34,37 @@ export default function LinkPreview( {
 	// Avoid fetching if rich previews are not desired.
 	const showRichPreviews = hasRichPreviews ? value?.url : null;
 
-	const { richData, isFetching } = useRichUrlData( showRichPreviews );
+	const { richData, isFetching: isFetchingRichURLData } =
+		useRichUrlData( showRichPreviews );
+
+	const { entityData, isFetching: isFetchingEntityData } = useEntityData(
+		value?.type,
+		value?.id
+	);
+
+	const isFetching = isFetchingRichURLData || isFetchingEntityData;
 
 	// Rich data may be an empty object so test for that.
-	const hasRichData = richData && Object.keys( richData ).length;
+	const hasRichData =
+		( richData && Object.keys( richData ).length ) ||
+		( entityData && Object.keys( entityData ).length );
 
 	const displayURL =
 		( value && filterURLForDisplay( safeDecodeURI( value.url ), 16 ) ) ||
 		'';
 
-	const displayTitle = stripHTML( richData?.title || displayURL );
+	const displayTitle = stripHTML(
+		entityData?.title?.rendered || richData?.title || displayURL
+	);
 
 	// url can be undefined if the href attribute is unset
 	const isEmptyURL = ! value?.url?.length;
 
 	let icon;
 
-	if ( richData?.icon ) {
+	if ( entityData?.type ) {
+		icon = <Icon icon={ ICONS_MAP[ entityData.type ] } />;
+	} else if ( richData?.icon ) {
 		icon = <img src={ richData?.icon } alt="" />;
 	} else if ( isEmptyURL ) {
 		icon = <Icon icon={ info } size={ 32 } />;
@@ -95,9 +111,13 @@ export default function LinkPreview( {
 									</ExternalLink>
 								</Tooltip>
 
-								{ value?.url && displayTitle !== displayURL && (
+								{ ( entityData?.slug ||
+									( value?.url &&
+										displayTitle !== displayURL ) ) && (
 									<span className="block-editor-link-control__search-item-info">
-										{ displayURL }
+										{ filterURLForDisplay(
+											'/' + entityData?.slug
+										) || displayURL }
 									</span>
 								) }
 							</>
diff --git a/packages/block-editor/src/components/link-control/search-item.js b/packages/block-editor/src/components/link-control/search-item.js
index 7fa8ee1803644c..8908ed125fcc6e 100644
--- a/packages/block-editor/src/components/link-control/search-item.js
+++ b/packages/block-editor/src/components/link-control/search-item.js
@@ -3,28 +3,15 @@
  */
 import { __ } from '@wordpress/i18n';
 import { MenuItem, TextHighlight } from '@wordpress/components';
-import {
-	Icon,
-	globe,
-	page,
-	tag,
-	postList,
-	category,
-	file,
-	home,
-	verse,
-} from '@wordpress/icons';
+import { Icon, globe, home, verse } from '@wordpress/icons';
 import { __unstableStripHTML as stripHTML } from '@wordpress/dom';
 import { safeDecodeURI, filterURLForDisplay, getPath } from '@wordpress/url';
 import { pipe } from '@wordpress/compose';
 
-const ICONS_MAP = {
-	post: postList,
-	page,
-	post_tag: tag,
-	category,
-	attachment: file,
-};
+/**
+ * Internal dependencies
+ */
+import { ICONS_MAP } from './constants';
 
 function SearchItemIcon( { isURL, suggestion } ) {
 	let icon = null;
diff --git a/packages/block-editor/src/components/link-control/use-entity-data.js b/packages/block-editor/src/components/link-control/use-entity-data.js
new file mode 100644
index 00000000000000..ac0066e411adc4
--- /dev/null
+++ b/packages/block-editor/src/components/link-control/use-entity-data.js
@@ -0,0 +1,89 @@
+/**
+ * Internal dependencies
+ */
+import { store as blockEditorStore } from '../../store';
+
+/**
+ * WordPress dependencies
+ */
+import { useSelect } from '@wordpress/data';
+import { useEffect, useReducer } from '@wordpress/element';
+
+function reducer( state, action ) {
+	switch ( action.type ) {
+		case 'RESOLVED':
+			return {
+				...state,
+				isFetching: false,
+				entityData: action.entityData,
+			};
+		case 'ERROR':
+			return {
+				...state,
+				isFetching: false,
+				entityData: null,
+			};
+		case 'LOADING':
+			return {
+				...state,
+				isFetching: true,
+			};
+		default:
+			throw new Error( `Unexpected action type ${ action.type }` );
+	}
+}
+
+function useEntityData( postType, id ) {
+	const [ state, dispatch ] = useReducer( reducer, {
+		entityData: null,
+		isFetching: false,
+	} );
+
+	const { fetchEntityData } = useSelect( ( select ) => {
+		const { getSettings } = select( blockEditorStore );
+		return {
+			fetchEntityData: getSettings().__experimentalSyncGetEntityRecord,
+		};
+	}, [] );
+
+	useEffect( () => {
+		// Only make the request if we have an actual URL
+		// and the fetching util is available. In some editors
+		// there may not be such a util.
+		if ( id && fetchEntityData && typeof AbortController !== 'undefined' ) {
+			dispatch( {
+				type: 'LOADING',
+			} );
+
+			const controller = new window.AbortController();
+
+			const signal = controller.signal;
+
+			fetchEntityData( 'postType', postType, Number( id ), {
+				signal,
+			} )
+				.then( ( data ) => {
+					dispatch( {
+						type: 'RESOLVED',
+						entityData: data,
+					} );
+				} )
+				.catch( () => {
+					// Avoid setting state on unmounted component
+					if ( ! signal.aborted ) {
+						dispatch( {
+							type: 'ERROR',
+						} );
+					}
+				} );
+			// Cleanup: when the URL changes the abort the current request.
+			return () => {
+				controller.abort();
+			};
+		}
+	}, [ fetchEntityData, postType, id ] );
+
+	return state;
+}
+
+export default useEntityData;
diff --git a/packages/editor/src/components/provider/use-block-editor-settings.js b/packages/editor/src/components/provider/use-block-editor-settings.js
index eddc295766f8ce..d3ae2913adb3b8 100644
--- a/packages/editor/src/components/provider/use-block-editor-settings.js
+++ b/packages/editor/src/components/provider/use-block-editor-settings.js
@@ -2,7 +2,7 @@
  * WordPress dependencies
  */
 import { Platform, useMemo, useCallback } from '@wordpress/element';
-import { useDispatch, useSelect } from '@wordpress/data';
+import { resolveSelect, useDispatch, useSelect } from '@wordpress/data';
 import {
 	store as coreStore,
 	__experimentalFetchLinkSuggestions as fetchLinkSuggestions,
@@ -216,6 +216,9 @@ function useBlockEditorSettings( settings, postType, postId ) {
 	);
 
 	const forceDisableFocusMode = settings.focusMode === false;
+	const syncGetEntityRecord = useCallback( async ( ...args ) => {
+		return await resolveSelect( coreStore ).getEntityRecord( ...args );
+	}, [] );
 
 	return useMemo(
 		() => ( {
@@ -259,6 +262,7 @@ function useBlockEditorSettings( settings, postType, postId ) {
 					? [ [ 'core/navigation', {}, [] ] ]
 					: settings.template,
 			__experimentalSetIsInserterOpened: setIsInserterOpened,
+			__experimentalSyncGetEntityRecord: syncGetEntityRecord,
 		} ),
 		[
 			allowRightClickOverrides,
@@ -281,6 +285,7 @@ function useBlockEditorSettings( settings, postType, postId ) {
 			pageForPosts,
 			postType,
 			setIsInserterOpened,
+			syncGetEntityRecord,
 		]
 	);
 }

From 95d495bf38890b24d347863f3b7d4d7b18aa412d Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Mon, 8 Jan 2024 12:16:39 +0000
Subject: [PATCH 23/24] Force stop editing link to remove activeFormats

---
 packages/format-library/src/link/index.js  | 13 +++++++++++++
 packages/format-library/src/link/inline.js | 13 -------------
 2 files changed, 13 insertions(+), 13 deletions(-)

diff --git a/packages/format-library/src/link/index.js b/packages/format-library/src/link/index.js
index ab287daff19a73..0ee27890a4e848 100644
--- a/packages/format-library/src/link/index.js
+++ b/packages/format-library/src/link/index.js
@@ -11,6 +11,7 @@ import {
 	isCollapsed,
 	insert,
 	create,
+	concat,
 } from '@wordpress/rich-text';
 import { isURL, isEmail } from '@wordpress/url';
 import {
@@ -64,6 +65,18 @@ function Edit( {
 
 	function stopAddingLink( returnFocus = true ) {
 		setAddingLink( false );
+
+		// Remove any active formats.
+		// Cloning the existing value has the effect of removing
+		// any active formats and is roughly equivalent to the
+		// following mutation:
+		// value.activeFormats = [];
+		const newValue = concat( value );
+
+		// Update to force format to no longer be active.
+		onChange( newValue );
+
+		// Handle focus
 		if ( returnFocus ) {
 			onFocus();
 		}
diff --git a/packages/format-library/src/link/inline.js b/packages/format-library/src/link/inline.js
index 8224faaf08a3e8..ca9bdfd6d1734d 100644
--- a/packages/format-library/src/link/inline.js
+++ b/packages/format-library/src/link/inline.js
@@ -89,12 +89,6 @@ function InlineLinkUI( {
 	}
 
 	function onChangeLink( nextValue ) {
-		// LinkControl calls `onChange` immediately upon the toggling a setting.
-		// Before merging the next value with the current link value, check if
-		// the setting was toggled.
-		const didToggleSetting =
-			linkValue.opensInNewTab !== nextValue.opensInNewTab &&
-			nextValue.url === undefined;
 		// Merge the next value with the current link value.
 		nextValue = {
 			...linkValue,
@@ -180,16 +174,9 @@ function InlineLinkUI( {
 			newValue.start = newValue.end;
 
 			// Hides the Link UI.
-			newValue.activeFormats = [];
 			onChange( newValue );
 		}
 
-		// Focus should only be shifted back to the formatted segment when the
-		// URL is submitted.
-		if ( ! didToggleSetting ) {
-			stopAddingLink();
-		}
-
 		if ( ! isValidHref( newUrl ) ) {
 			speak(
 				__(

From a4a0927a0f3bb9a53403c791e989d1c6ba4eaaf9 Mon Sep 17 00:00:00 2001
From: Dave Smith <getdavemail@gmail.com>
Date: Wed, 10 Jan 2024 09:41:39 +0000
Subject: [PATCH 24/24] Close the Link UI on value updates except upon initial
 creation

---
 packages/format-library/src/link/inline.js | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/packages/format-library/src/link/inline.js b/packages/format-library/src/link/inline.js
index ca9bdfd6d1734d..3b540d7970afb4 100644
--- a/packages/format-library/src/link/inline.js
+++ b/packages/format-library/src/link/inline.js
@@ -89,6 +89,9 @@ function InlineLinkUI( {
 	}
 
 	function onChangeLink( nextValue ) {
+		const hasLink = linkValue?.url;
+		const isNewLink = ! hasLink;
+
 		// Merge the next value with the current link value.
 		nextValue = {
 			...linkValue,
@@ -173,7 +176,11 @@ function InlineLinkUI( {
 
 			newValue.start = newValue.end;
 
-			// Hides the Link UI.
+			// Hides the Link UI on change except upon the initial creation of the link.
+			if ( ! isNewLink ) {
+				newValue.activeFormats = [];
+			}
+
 			onChange( newValue );
 		}