@wordpress/block-editor 14.8.1-next.cd6172eb0.0 → 14.10.0

package/src/components/global-styles/color-panel.js

@@ -19,7 +19,7 @@ import {
 	Button,
 	privateApis as componentsPrivateApis,
 } from '@wordpress/components';
-import { useCallback } from '@wordpress/element';
+import { useCallback, useRef } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
 
 /**
@@ -30,6 +30,7 @@ import { useColorsPerOrigin, useGradientsPerOrigin } from './hooks';
 import { getValueFromVariable, useToolsPanelDropdownMenuProps } from './utils';
 import { setImmutably } from '../../utils/object';
 import { unlock } from '../../lock-unlock';
+import { reset as resetIcon } from '@wordpress/icons';
 
 export function useHasColorPanel( settings ) {
 	const hasTextPanel = useHasTextPanel( settings );
@@ -208,6 +209,7 @@ function ColorPanelDropdown( {
 } ) {
 	const currentTab = tabs.find( ( tab ) => tab.userValue !== undefined );
 	const { key: firstTabKey, ...firstTab } = tabs[ 0 ] ?? {};
+	const colorGradientDropdownButtonRef = useRef( undefined );
 	return (
 		<ToolsPanelItem
 			className="block-editor-tools-panel-color-gradient-settings__item"
@@ -228,15 +230,35 @@ function ColorPanelDropdown( {
 							{ 'is-open': isOpen }
 						),
 						'aria-expanded': isOpen,
+						ref: colorGradientDropdownButtonRef,
 					};
 
 					return (
-						<Button __next40pxDefaultSize { ...toggleProps }>
-							<LabeledColorIndicators
-								indicators={ indicators }
-								label={ label }
-							/>
-						</Button>
+						<>
+							<Button { ...toggleProps } __next40pxDefaultSize>
+								<LabeledColorIndicators
+									indicators={ indicators }
+									label={ label }
+								/>
+							</Button>
+							{ hasValue() && (
+								<Button
+									__next40pxDefaultSize
+									label={ __( 'Reset' ) }
+									className="block-editor-panel-color-gradient-settings__reset"
+									size="small"
+									icon={ resetIcon }
+									onClick={ () => {
+										resetValue();
+										if ( isOpen ) {
+											onToggle();
+										}
+										// Return focus to parent button
+										colorGradientDropdownButtonRef.current?.focus();
+									} }
+								/>
+							) }
+						</>
 					);
 				} }
 				renderContent={ () => (

package/src/components/global-styles/filters-panel.js

@@ -10,10 +10,10 @@ import {
 	__experimentalToolsPanel as ToolsPanel,
 	__experimentalToolsPanelItem as ToolsPanelItem,
 	__experimentalItemGroup as ItemGroup,
+	__experimentalItem as Item,
 	__experimentalHStack as HStack,
 	__experimentalZStack as ZStack,
 	__experimentalDropdownContentWrapper as DropdownContentWrapper,
-	Button,
 	MenuGroup,
 	ColorIndicator,
 	DuotonePicker,
@@ -189,15 +189,12 @@ export default function FiltersPanel( {
 
 							return (
 								<ItemGroup isBordered isSeparated>
-									<Button
-										__next40pxDefaultSize
-										{ ...toggleProps }
-									>
+									<Item as="button" { ...toggleProps }>
 										<LabeledColorIndicator
 											indicator={ duotone }
 											label={ __( 'Duotone' ) }
 										/>
-									</Button>
+									</Item>
 								</ItemGroup>
 							);
 						} }

package/src/components/global-styles/test/use-global-styles-output.js

@@ -855,7 +855,7 @@ describe( 'global styles renderer', () => {
 
 		it( 'should return block selectors data with old experimental selectors', () => {
 			const imageSupports = {
-				border: {
+				__experimentalBorder: {
 					radius: true,
 					__experimentalSelector: 'img, .crop-area',
 				},

package/src/components/global-styles/typography-utils.js

@@ -45,7 +45,7 @@ import { getFontStylesAndWeights } from '../../utils/get-font-styles-and-weights
  * @param {Preset}                     preset
  * @param {Object}                     settings
  * @param {boolean|TypographySettings} settings.typography.fluid  Whether fluid typography is enabled, and, optionally, fluid font size options.
- * @param {Object?}                    settings.typography.layout Layout options.
+ * @param {?Object}                    settings.typography.layout Layout options.
  *
  * @return {string|*} A font-size value or the value of preset.size.
  */

package/src/components/global-styles/use-global-styles-output.js

@@ -47,7 +47,7 @@ const ELEMENT_CLASS_NAMES = {
 // List of block support features that can have their related styles
 // generated under their own feature level selector rather than the block's.
 const BLOCK_SUPPORT_FEATURE_LEVEL_SELECTORS = {
-	border: 'border',
+	__experimentalBorder: 'border',
 	color: 'color',
 	spacing: 'spacing',
 	typography: 'typography',

package/src/components/grid/grid-visualizer.js

@@ -62,6 +62,17 @@ const GridVisualizerGrid = forwardRef(
 				observer.observe( element );
 				observers.push( observer );
 			}
+
+			const mutationObserver = new window.MutationObserver( () => {
+				setGridInfo( getGridInfo( gridElement ) );
+			} );
+			mutationObserver.observe( gridElement, {
+				attributeFilter: [ 'style', 'class' ],
+				childList: true,
+				subtree: true,
+			} );
+			observers.push( mutationObserver );
+
 			return () => {
 				for ( const observer of observers ) {
 					observer.disconnect();

package/src/components/grid/utils.js

@@ -160,6 +160,21 @@ export function getGridInfo( gridElement ) {
 		gridElement,
 		'grid-template-rows'
 	);
+	const borderTopWidth = getComputedCSS( gridElement, 'border-top-width' );
+	const borderRightWidth = getComputedCSS(
+		gridElement,
+		'border-right-width'
+	);
+	const borderBottomWidth = getComputedCSS(
+		gridElement,
+		'border-bottom-width'
+	);
+	const borderLeftWidth = getComputedCSS( gridElement, 'border-left-width' );
+	const paddingTop = getComputedCSS( gridElement, 'padding-top' );
+	const paddingRight = getComputedCSS( gridElement, 'padding-right' );
+	const paddingBottom = getComputedCSS( gridElement, 'padding-bottom' );
+	const paddingLeft = getComputedCSS( gridElement, 'padding-left' );
+
 	const numColumns = gridTemplateColumns.split( ' ' ).length;
 	const numRows = gridTemplateRows.split( ' ' ).length;
 	const numItems = numColumns * numRows;
@@ -172,7 +187,10 @@ export function getGridInfo( gridElement ) {
 			gridTemplateColumns,
 			gridTemplateRows,
 			gap: getComputedCSS( gridElement, 'gap' ),
-			padding: getComputedCSS( gridElement, 'padding' ),
+			paddingTop: `calc(${ paddingTop } + ${ borderTopWidth })`,
+			paddingRight: `calc(${ paddingRight } + ${ borderRightWidth })`,
+			paddingBottom: `calc(${ paddingBottom } + ${ borderBottomWidth })`,
+			paddingLeft: `calc(${ paddingLeft } + ${ borderLeftWidth })`,
 		},
 	};
 }

package/src/components/iframe/index.js

@@ -192,7 +192,7 @@ function Iframe( {
 					// Appending a hash to the current URL will not reload the
 					// page. This is useful for e.g. footnotes.
 					const href = event.target.getAttribute( 'href' );
-					if ( href.startsWith( '#' ) ) {
+					if ( href?.startsWith( '#' ) ) {
 						iFrameDocument.defaultView.location.hash =
 							href.slice( 1 );
 					}

package/src/components/index.js

@@ -67,10 +67,13 @@ export {
 	JustifyToolbar,
 	JustifyContentControl,
 } from './justify-content-control';
-export { default as __experimentalLinkControl } from './link-control';
-export { default as __experimentalLinkControlSearchInput } from './link-control/search-input';
-export { default as __experimentalLinkControlSearchResults } from './link-control/search-results';
-export { default as __experimentalLinkControlSearchItem } from './link-control/search-item';
+export {
+	default as LinkControl,
+	DeprecatedExperimentalLinkControl as __experimentalLinkControl,
+} from './link-control';
+export { __experimentalLinkControlSearchInput } from './link-control/search-input';
+export { __experimentalLinkControlSearchResults } from './link-control/search-results';
+export { __experimentalLinkControlSearchItem } from './link-control/search-item';
 export { default as LineHeightControl } from './line-height-control';
 export { default as __experimentalListView } from './list-view';
 export { default as MediaReplaceFlow } from './media-replace-flow';

package/src/components/inner-blocks/use-inner-block-template-sync.js

@@ -7,7 +7,7 @@ import fastDeepEqual from 'fast-deep-equal/es6';
  * WordPress dependencies
  */
 import { useRef, useLayoutEffect } from '@wordpress/element';
-import { useSelect, useDispatch } from '@wordpress/data';
+import { useRegistry } from '@wordpress/data';
 import { synchronizeBlocksWithTemplate } from '@wordpress/blocks';
 
 /**
@@ -42,14 +42,7 @@ export default function useInnerBlockTemplateSync(
 ) {
 	// Instead of adding a useSelect mapping here, please add to the useSelect
 	// mapping in InnerBlocks! Every subscription impacts performance.
-
-	const {
-		getBlocks,
-		getSelectedBlocksInitialCaretPosition,
-		isBlockSelected,
-	} = useSelect( blockEditorStore );
-	const { replaceInnerBlocks, __unstableMarkNextChangeAsNotPersistent } =
-		useDispatch( blockEditorStore );
+	const registry = useRegistry();
 
 	// Maintain a reference to the previous value so we can do a deep equality check.
 	const existingTemplateRef = useRef( null );
@@ -57,6 +50,14 @@ export default function useInnerBlockTemplateSync(
 	useLayoutEffect( () => {
 		let isCancelled = false;
 
+		const {
+			getBlocks,
+			getSelectedBlocksInitialCaretPosition,
+			isBlockSelected,
+		} = registry.select( blockEditorStore );
+		const { replaceInnerBlocks, __unstableMarkNextChangeAsNotPersistent } =
+			registry.dispatch( blockEditorStore );
+
 		// There's an implicit dependency between useInnerBlockTemplateSync and useNestedSettingsUpdate
 		// The former needs to happen after the latter and since the latter is using microtasks to batch updates (performance optimization),
 		// we need to schedule this one in a microtask as well.
@@ -110,5 +111,11 @@ export default function useInnerBlockTemplateSync(
 		return () => {
 			isCancelled = true;
 		};
-	}, [ template, templateLock, clientId ] );
+	}, [
+		template,
+		templateLock,
+		clientId,
+		registry,
+		templateInsertUpdatesSelection,
+	] );
 }

package/src/components/inserter/block-patterns-explorer/index.js

@@ -14,9 +14,8 @@ import { usePatternCategories } from '../block-patterns-tab/use-pattern-categori
 
 function PatternsExplorer( { initialCategory, rootClientId } ) {
 	const [ searchValue, setSearchValue ] = useState( '' );
-	const [ selectedCategory, setSelectedCategory ] = useState(
-		initialCategory?.name
-	);
+	const [ selectedCategory, setSelectedCategory ] =
+		useState( initialCategory );
 
 	const patternCategories = usePatternCategories( rootClientId );
 

package/src/components/inserter/block-patterns-tab/index.js

@@ -70,7 +70,9 @@ function BlockPatternsTab( {
 			) }
 			{ showPatternsExplorer && (
 				<PatternsExplorerModal
-					initialCategory={ selectedCategory || categories[ 0 ] }
+					initialCategory={
+						selectedCategory?.name || categories[ 0 ]?.name
+					}
 					patternCategories={ categories }
 					onModalClose={ () => setShowPatternsExplorer( false ) }
 					rootClientId={ rootClientId }

package/src/components/inserter/block-patterns-tab/pattern-category-previews.js

@@ -69,19 +69,19 @@ export function PatternCategoryPreviews( {
 					return false;
 				}
 
-				if ( category.name === allPatternsCategory.name ) {
+				if ( category.name === allPatternsCategory?.name ) {
 					return true;
 				}
 
 				if (
-					category.name === myPatternsCategory.name &&
+					category.name === myPatternsCategory?.name &&
 					pattern.type === INSERTER_PATTERN_TYPES.user
 				) {
 					return true;
 				}
 
 				if (
-					category.name === starterPatternsCategory.name &&
+					category.name === starterPatternsCategory?.name &&
 					pattern.blockTypes?.includes( 'core/post-content' )
 				) {
 					return true;
@@ -149,7 +149,7 @@ export function PatternCategoryPreviews( {
 							level={ 4 }
 							as="div"
 						>
-							{ category.label }
+							{ category?.label }
 						</Heading>
 					</FlexBlock>
 					<PatternsFilter

package/src/components/inserter/block-patterns-tab/patterns-filter.js

@@ -25,7 +25,7 @@ import {
 const getShouldDisableSyncFilter = ( sourceFilter ) =>
 	sourceFilter !== 'all' && sourceFilter !== 'user';
 const getShouldHideSourcesFilter = ( category ) => {
-	return category.name === myPatternsCategory.name;
+	return category?.name === myPatternsCategory.name;
 };
 
 const PATTERN_SOURCE_MENU_OPTIONS = [
@@ -60,7 +60,7 @@ export function PatternsFilter( {
 	// the user may be confused when switching to another category if the haven't explicity set
 	// this filter themselves.
 	const currentPatternSourceFilter =
-		category.name === myPatternsCategory.name
+		category?.name === myPatternsCategory.name
 			? INSERTER_PATTERN_TYPES.user
 			: patternSourceFilter;
 

package/src/components/inserter/block-types-tab.js

@@ -186,7 +186,7 @@ export function BlockTypesTab(
 			continue;
 		}
 
-		if ( rootClientId && item.isAllowedInCurrentRoot ) {
+		if ( item.isAllowedInCurrentRoot ) {
 			itemsForCurrentRoot.push( item );
 		} else {
 			itemsRemaining.push( item );

package/src/components/inserter/category-tabs/index.js

@@ -64,9 +64,10 @@ function CategoryTabs( {
 					<Tabs.Tab
 						key={ category.name }
 						tabId={ category.name }
-						aria-label={ category.label }
 						aria-current={
-							category === selectedCategory ? 'true' : undefined
+							category.name === selectedCategory?.name
+								? 'true'
+								: undefined
 						}
 					>
 						{ category.label }

package/src/components/inserter/index.js

@@ -29,7 +29,6 @@ const defaultRenderToggle = ( {
 	blockTitle,
 	hasSingleBlockType,
 	toggleProps = {},
-	prioritizePatterns,
 } ) => {
 	const {
 		as: Wrapper = Button,
@@ -45,8 +44,6 @@ const defaultRenderToggle = ( {
 			_x( 'Add %s', 'directly add the only allowed block' ),
 			blockTitle
 		);
-	} else if ( ! label && prioritizePatterns ) {
-		label = __( 'Add pattern' );
 	} else if ( ! label ) {
 		label = _x( 'Add block', 'Generic label for block inserter button' );
 	}
@@ -63,6 +60,7 @@ const defaultRenderToggle = ( {
 
 	return (
 		<Wrapper
+			__next40pxDefaultSize={ toggleProps.as ? undefined : true }
 			icon={ plus }
 			label={ label }
 			tooltipPosition="bottom"
@@ -113,7 +111,6 @@ class Inserter extends Component {
 			toggleProps,
 			hasItems,
 			renderToggle = defaultRenderToggle,
-			prioritizePatterns,
 		} = this.props;
 
 		return renderToggle( {
@@ -124,7 +121,6 @@ class Inserter extends Component {
 			hasSingleBlockType,
 			directInsertBlock,
 			toggleProps,
-			prioritizePatterns,
 		} );
 	}
 
@@ -147,7 +143,6 @@ class Inserter extends Component {
 			// This prop is experimental to give some time for the quick inserter to mature
 			// Feel free to make them stable after a few releases.
 			__experimentalIsQuick: isQuick,
-			prioritizePatterns,
 			onSelectOrClose,
 			selectBlockOnInsert,
 		} = this.props;
@@ -171,7 +166,6 @@ class Inserter extends Component {
 					rootClientId={ rootClientId }
 					clientId={ clientId }
 					isAppender={ isAppender }
-					prioritizePatterns={ prioritizePatterns }
 					selectBlockOnInsert={ selectBlockOnInsert }
 				/>
 			);
@@ -230,7 +224,6 @@ export default compose( [
 				hasInserterItems,
 				getAllowedBlocks,
 				getDirectInsertBlock,
-				getSettings,
 			} = select( blockEditorStore );
 
 			const { getBlockVariations } = select( blocksStore );
@@ -243,8 +236,6 @@ export default compose( [
 			const directInsertBlock =
 				shouldDirectInsert && getDirectInsertBlock( rootClientId );
 
-			const settings = getSettings();
-
 			const hasSingleBlockType =
 				allowedBlocks?.length === 1 &&
 				getBlockVariations( allowedBlocks[ 0 ].name, 'inserter' )
@@ -262,9 +253,6 @@ export default compose( [
 				allowedBlockType,
 				directInsertBlock,
 				rootClientId,
-				prioritizePatterns:
-					settings.__experimentalPreferPatternsOnRoot &&
-					! rootClientId,
 			};
 		}
 	),

package/src/components/inserter/menu.js

@@ -82,6 +82,8 @@ function InserterMenu(
 		if ( isZoomOutMode ) {
 			return 'patterns';
 		}
+
+		return 'blocks';
 	}
 	const [ selectedTab, setSelectedTab ] = useState( getInitialTab() );
 

package/src/components/inserter/quick-inserter.js

@@ -16,21 +16,17 @@ import { useSelect } from '@wordpress/data';
  */
 import InserterSearchResults from './search-results';
 import useInsertionPoint from './hooks/use-insertion-point';
-import usePatternsState from './hooks/use-patterns-state';
 import useBlockTypesState from './hooks/use-block-types-state';
 import { store as blockEditorStore } from '../../store';
 
 const SEARCH_THRESHOLD = 6;
 const SHOWN_BLOCK_TYPES = 6;
-const SHOWN_BLOCK_PATTERNS = 2;
-const SHOWN_BLOCK_PATTERNS_WITH_PRIORITIZATION = 4;
 
 export default function QuickInserter( {
 	onSelect,
 	rootClientId,
 	clientId,
 	isAppender,
-	prioritizePatterns,
 	selectBlockOnInsert,
 	hasSearch = true,
 } ) {
@@ -47,12 +43,6 @@ export default function QuickInserter( {
 		onInsertBlocks,
 		true
 	);
-	const [ patterns ] = usePatternsState(
-		onInsertBlocks,
-		destinationRootClientId,
-		undefined,
-		true
-	);
 
 	const { setInserterIsOpened, insertionIndex } = useSelect(
 		( select ) => {
@@ -70,12 +60,7 @@ export default function QuickInserter( {
 		[ clientId ]
 	);
 
-	const showPatterns =
-		patterns.length && ( !! filterValue || prioritizePatterns );
-	const showSearch =
-		hasSearch &&
-		( ( showPatterns && patterns.length > SEARCH_THRESHOLD ) ||
-			blockTypes.length > SEARCH_THRESHOLD );
+	const showSearch = hasSearch && blockTypes.length > SEARCH_THRESHOLD;
 
 	useEffect( () => {
 		if ( setInserterIsOpened ) {
@@ -94,13 +79,6 @@ export default function QuickInserter( {
 		} );
 	};
 
-	let maxBlockPatterns = 0;
-	if ( showPatterns ) {
-		maxBlockPatterns = prioritizePatterns
-			? SHOWN_BLOCK_PATTERNS_WITH_PRIORITIZATION
-			: SHOWN_BLOCK_PATTERNS;
-	}
-
 	return (
 		<div
 			className={ clsx( 'block-editor-inserter__quick-inserter', {
@@ -128,10 +106,9 @@ export default function QuickInserter( {
 					rootClientId={ rootClientId }
 					clientId={ clientId }
 					isAppender={ isAppender }
-					maxBlockPatterns={ maxBlockPatterns }
+					maxBlockPatterns={ 0 }
 					maxBlockTypes={ SHOWN_BLOCK_TYPES }
 					isDraggable={ false }
-					prioritizePatterns={ prioritizePatterns }
 					selectBlockOnInsert={ selectBlockOnInsert }
 					isQuick
 				/>

package/src/components/inspector-controls/slot.js

@@ -1,11 +1,7 @@
 /**
  * WordPress dependencies
  */
-import {
-	__experimentalUseSlotFills as useSlotFills,
-	__unstableMotionContext as MotionContext,
-} from '@wordpress/components';
-import { useContext, useMemo } from '@wordpress/element';
+import { __experimentalUseSlotFills as useSlotFills } from '@wordpress/components';
 import warning from '@wordpress/warning';
 import deprecated from '@wordpress/deprecated';
 
@@ -37,19 +33,6 @@ export default function InspectorControlsSlot( {
 	const slotFill = groups[ group ];
 	const fills = useSlotFills( slotFill?.name );
 
-	const motionContextValue = useContext( MotionContext );
-
-	const computedFillProps = useMemo(
-		() => ( {
-			...fillProps,
-			forwardedContext: [
-				...( fillProps?.forwardedContext ?? [] ),
-				[ MotionContext.Provider, { value: motionContextValue } ],
-			],
-		} ),
-		[ motionContextValue, fillProps ]
-	);
-
 	if ( ! slotFill ) {
 		warning( `Unknown InspectorControls group "${ group }" provided.` );
 		return null;
@@ -66,14 +49,12 @@ export default function InspectorControlsSlot( {
 			<BlockSupportToolsPanel group={ group } label={ label }>
 				<BlockSupportSlotContainer
 					{ ...props }
-					fillProps={ computedFillProps }
+					fillProps={ fillProps }
 					Slot={ Slot }
 				/>
 			</BlockSupportToolsPanel>
 		);
 	}
 
-	return (
-		<Slot { ...props } fillProps={ computedFillProps } bubblesVirtually />
-	);
+	return <Slot { ...props } fillProps={ fillProps } bubblesVirtually />;
 }

package/src/components/keyboard-shortcuts/index.js

@@ -29,8 +29,8 @@ function KeyboardShortcutsRegister() {
 			category: 'block',
 			description: __( 'Remove the selected block(s).' ),
 			keyCombination: {
-				modifier: 'access',
-				character: 'z',
+				modifier: 'shift',
+				character: 'backspace',
 			},
 		} );
 

package/src/components/line-height-control/README.md

@@ -18,6 +18,7 @@ const MyLineHeightControl = () => (
 	<LineHeightControl
 		value={ lineHeight }
 		onChange={ onChange }
+		__next40pxDefaultSize
 	/>
 );
 ```

package/src/components/line-height-control/index.js

@@ -3,6 +3,7 @@
  */
 import { __ } from '@wordpress/i18n';
 import { __experimentalNumberControl as NumberControl } from '@wordpress/components';
+import deprecated from '@wordpress/deprecated';
 
 /**
  * Internal dependencies
@@ -89,6 +90,17 @@ const LineHeightControl = ( {
 		onChange( `${ nextValue }` );
 	};
 
+	if (
+		! __next40pxDefaultSize &&
+		( otherProps.size === undefined || otherProps.size === 'default' )
+	) {
+		deprecated( `36px default size for wp.blockEditor.LineHeightControl`, {
+			since: '6.8',
+			version: '7.1',
+			hint: 'Set the `__next40pxDefaultSize` prop to true to start opting into the new default size, which will become the default in a future version.',
+		} );
+	}
+
 	return (
 		<div className="block-editor-line-height-control">
 			<NumberControl

package/src/components/line-height-control/stories/index.story.js

@@ -22,6 +22,7 @@ const Template = ( props ) => {
 
 export const Default = Template.bind( {} );
 Default.args = {
+	__next40pxDefaultSize: true,
 	__unstableInputWidth: '100px',
 };
 

package/src/components/line-height-control/test/index.js

@@ -19,7 +19,13 @@ const SPIN = STEP * SPIN_FACTOR;
 
 const ControlledLineHeightControl = () => {
 	const [ value, setValue ] = useState();
-	return <LineHeightControl value={ value } onChange={ setValue } />;
+	return (
+		<LineHeightControl
+			value={ value }
+			onChange={ setValue }
+			__next40pxDefaultSize
+		/>
+	);
 };
 
 describe( 'LineHeightControl', () => {

package/src/components/link-control/index.js

@@ -34,6 +34,7 @@ import useCreatePage from './use-create-page';
 import useInternalValue from './use-internal-value';
 import { ViewerFill } from './viewer-slot';
 import { DEFAULT_LINK_SETTINGS } from './constants';
+import deprecated from '@wordpress/deprecated';
 
 /**
  * Default properties associated with a link control value.
@@ -500,4 +501,13 @@ function LinkControl( {
 LinkControl.ViewerFill = ViewerFill;
 LinkControl.DEFAULT_LINK_SETTINGS = DEFAULT_LINK_SETTINGS;
 
+export const DeprecatedExperimentalLinkControl = ( props ) => {
+	deprecated( 'wp.blockEditor.__experimentalLinkControl', {
+		since: '6.8',
+		alternative: 'wp.blockEditor.LinkControl',
+	} );
+
+	return <LinkControl { ...props } />;
+};
+
 export default LinkControl;