diff --git a/packages/block-library/src/navigation-link/link-ui.js b/packages/block-library/src/navigation-link/link-ui.js index 3dede053de3db..782d1fff4a01b 100644 --- a/packages/block-library/src/navigation-link/link-ui.js +++ b/packages/block-library/src/navigation-link/link-ui.js @@ -9,7 +9,7 @@ import { BlockIcon, store as blockEditorStore, } from '@wordpress/block-editor'; -import { createInterpolateElement } from '@wordpress/element'; +import { createInterpolateElement, useMemo } from '@wordpress/element'; import { store as coreStore } from '@wordpress/core-data'; import { decodeEntities } from '@wordpress/html-entities'; import { switchToBlockType } from '@wordpress/blocks'; @@ -154,11 +154,17 @@ export function LinkUI( props ) { } const { label, url, opensInNewTab, type, kind } = props.link; - const link = { - url, - opensInNewTab, - title: label && stripHTML( label ), - }; + + // Memoize link value to avoid overriding the LinkControl's internal state. + // This is a temporary fix. See https://github.com/WordPress/gutenberg/issues/50976#issuecomment-1568226407. + const link = useMemo( + () => ( { + url, + opensInNewTab, + title: label && stripHTML( label ), + } ), + [ label, opensInNewTab, url ] + ); return (