@wordpress/block-editor 8.0.12-next.33ec3857e2.0 → 8.0.15

package/src/components/default-style-picker/index.js

@@ -11,7 +11,6 @@ import { useSelect } from '@wordpress/data';
  * Internal dependencies
  */
 import { store as blockEditorStore } from '../../store';
-import { getDefaultStyle } from '../block-styles/utils';
 
 export default function DefaultStylePicker( { blockName } ) {
 	const {
@@ -39,9 +38,6 @@ export default function DefaultStylePicker( { blockName } ) {
 		],
 		[ styles ]
 	);
-	const defaultStyleName = useMemo( () => getDefaultStyle( styles )?.name, [
-		styles,
-	] );
 	const selectOnChange = useCallback(
 		( blockStyle ) => {
 			onUpdatePreferredStyleVariations( blockName, blockStyle );
@@ -49,22 +45,14 @@ export default function DefaultStylePicker( { blockName } ) {
 		[ blockName, onUpdatePreferredStyleVariations ]
 	);
 
-	// Until the functionality is migrated to global styles,
-	// only show the default style picker if a non-default style has already been selected.
-	if ( ! preferredStyle || preferredStyle === defaultStyleName ) {
-		return null;
-	}
-
 	return (
 		onUpdatePreferredStyleVariations && (
-			<div className="default-style-picker__default-switcher">
-				<SelectControl
-					options={ selectOptions }
-					value={ preferredStyle || '' }
-					label={ __( 'Default Style' ) }
-					onChange={ selectOnChange }
-				/>
-			</div>
+			<SelectControl
+				options={ selectOptions }
+				value={ preferredStyle || '' }
+				label={ __( 'Default Style' ) }
+				onChange={ selectOnChange }
+			/>
 		)
 	);
 }

package/src/components/font-appearance-control/index.js

@@ -3,54 +3,54 @@
  */
 import { CustomSelectControl } from '@wordpress/components';
 import { useMemo } from '@wordpress/element';
-import { __, sprintf } from '@wordpress/i18n';
+import { __, _x, sprintf } from '@wordpress/i18n';
 
 const FONT_STYLES = [
 	{
-		name: __( 'Regular' ),
+		name: _x( 'Regular', 'font style' ),
 		value: 'normal',
 	},
 	{
-		name: __( 'Italic' ),
+		name: _x( 'Italic', 'font style' ),
 		value: 'italic',
 	},
 ];
 
 const FONT_WEIGHTS = [
 	{
-		name: __( 'Thin' ),
+		name: _x( 'Thin', 'font weight' ),
 		value: '100',
 	},
 	{
-		name: __( 'Extra Light' ),
+		name: _x( 'Extra Light', 'font weight' ),
 		value: '200',
 	},
 	{
-		name: __( 'Light' ),
+		name: _x( 'Light', 'font weight' ),
 		value: '300',
 	},
 	{
-		name: __( 'Regular' ),
+		name: _x( 'Regular', 'font weight' ),
 		value: '400',
 	},
 	{
-		name: __( 'Medium' ),
+		name: _x( 'Medium', 'font weight' ),
 		value: '500',
 	},
 	{
-		name: __( 'Semi Bold' ),
+		name: _x( 'Semi Bold', 'font weight' ),
 		value: '600',
 	},
 	{
-		name: __( 'Bold' ),
+		name: _x( 'Bold', 'font weight' ),
 		value: '700',
 	},
 	{
-		name: __( 'Extra Bold' ),
+		name: _x( 'Extra Bold', 'font weight' ),
 		value: '800',
 	},
 	{
-		name: __( 'Black' ),
+		name: _x( 'Black', 'font weight' ),
 		value: '900',
 	},
 ];

package/src/components/gradients/use-gradient.js

@@ -59,22 +59,22 @@ export function getGradientSlugByValue( gradients, value ) {
 	return gradient && gradient.slug;
 }
 
-const EMPTY_OBJECT = {};
-
 export function __experimentalUseGradient( {
 	gradientAttribute = 'gradient',
 	customGradientAttribute = 'customGradient',
 } = {} ) {
 	const { clientId } = useBlockEditContext();
 
-	const gradientsPerOrigin = useSetting( 'color.gradients' ) || EMPTY_OBJECT;
+	const userGradientPalette = useSetting( 'color.gradients.custom' );
+	const themeGradientPalette = useSetting( 'color.gradients.theme' );
+	const defaultGradientPalette = useSetting( 'color.gradients.default' );
 	const allGradients = useMemo(
 		() => [
-			...( gradientsPerOrigin?.custom || [] ),
-			...( gradientsPerOrigin?.theme || [] ),
-			...( gradientsPerOrigin?.default || [] ),
+			...( userGradientPalette || [] ),
+			...( themeGradientPalette || [] ),
+			...( defaultGradientPalette || [] ),
 		],
-		[ gradientsPerOrigin ]
+		[ userGradientPalette, themeGradientPalette, defaultGradientPalette ]
 	);
 	const { gradient, customGradient } = useSelect(
 		( select ) => {

package/src/components/iframe/index.js

@@ -75,13 +75,9 @@ function styleSheetsCompat( doc ) {
 		);
 
 		if ( isMatch && ! doc.getElementById( ownerNode.id ) ) {
-			// eslint-disable-next-line no-console
-			console.warn(
-				`Stylesheet ${ ownerNode.id } was not properly added.
-For blocks, use the block API's style (https://developer.wordpress.org/block-editor/reference-guides/block-api/block-metadata/#style) or editorStyle (https://developer.wordpress.org/block-editor/reference-guides/block-api/block-metadata/#editor-style).
-For themes, use add_editor_style (https://developer.wordpress.org/block-editor/how-to-guides/themes/theme-support/#editor-styles).`,
-				ownerNode.outerHTML
-			);
+			// Display warning once we have a way to add style dependencies to the editor.
+			// See: https://github.com/WordPress/gutenberg/pull/37466.
+
 			doc.head.appendChild( ownerNode.cloneNode( true ) );
 
 			// Add inline styles belonging to the stylesheet.
@@ -164,15 +160,12 @@ async function loadScript( head, { id, src } ) {
 	} );
 }
 
-function Iframe(
-	{ contentRef, children, head, tabIndex = 0, assets, ...props },
-	ref
-) {
+function Iframe( { contentRef, children, head, tabIndex = 0, ...props }, ref ) {
 	const [ , forceRender ] = useReducer( () => ( {} ) );
 	const [ iframeDocument, setIframeDocument ] = useState();
 	const [ bodyClasses, setBodyClasses ] = useState( [] );
-	const styles = useParsedAssets( assets?.styles );
-	const scripts = useParsedAssets( assets?.scripts );
+	const styles = useParsedAssets( window.__editorAssets?.styles );
+	const scripts = useParsedAssets( window.__editorAssets?.scripts );
 	const clearerRef = useBlockSelectionClearer();
 	const [ before, writingFlowRef, after ] = useWritingFlow();
 	const setRef = useRefEffect( ( node ) => {

package/src/components/index.js

@@ -24,7 +24,6 @@ export { default as BlockColorsStyleSelector } from './color-style-selector';
 export { default as BlockEdit, useBlockEditContext } from './block-edit';
 export { default as BlockIcon } from './block-icon';
 export { default as BlockNavigationDropdown } from './block-navigation/dropdown';
-export { default as BlockStyles } from './block-styles';
 export { default as __experimentalBlockVariationPicker } from './block-variation-picker';
 export { default as __experimentalBlockPatternSetup } from './block-pattern-setup';
 export { default as __experimentalBlockVariationTransforms } from './block-variation-transforms';
@@ -141,6 +140,7 @@ export {
 } from './typewriter';
 export { default as Warning } from './warning';
 export { default as WritingFlow } from './writing-flow';
+export { useCanvasClickRedirect as __unstableUseCanvasClickRedirect } from './use-canvas-click-redirect';
 export { default as useBlockDisplayInformation } from './use-block-display-information';
 export { default as __unstableIframe } from './iframe';
 export { default as __experimentalUseNoRecursiveRenders } from './use-no-recursive-renders';

package/src/components/inner-blocks/README.md

@@ -41,8 +41,6 @@ _Note:_ A block can render at most a single `InnerBlocks` and `InnerBlocks.Conte
 
 _Note:_ Because the save step will automatically apply props to the element returned by `save`, it is important to include the wrapping `div` in the above simple example even though we are applying no props of our own. In a real-world example, you may have your own attributes to apply to the saved markup, or sibling content adjacent to the rendered nested blocks.
 
-_Note:_ Inner blocks, by default, are not visible inside a WordPress excerpt. If you wish your block to appear then it needs to be returned from the `excerpt_allowed_wrapper_blocks` filter. More details can be found on the [filter reference page](https://developer.wordpress.org/reference/hooks/excerpt_allowed_wrapper_blocks/) page, as well as the [excerpt_remove_blocks](https://developer.wordpress.org/reference/functions/excerpt_remove_blocks/) page.
-
 ## Props
 
 ### `allowedBlocks`

package/src/components/inner-blocks/default-block-appender.js

@@ -16,8 +16,13 @@ import BaseDefaultBlockAppender from '../default-block-appender';
 import withClientId from './with-client-id';
 import { store as blockEditorStore } from '../../store';
 
-export const DefaultBlockAppender = ( { clientId } ) => {
-	return <BaseDefaultBlockAppender rootClientId={ clientId } />;
+export const DefaultBlockAppender = ( { clientId, lastBlockClientId } ) => {
+	return (
+		<BaseDefaultBlockAppender
+			rootClientId={ clientId }
+			lastBlockClientId={ lastBlockClientId }
+		/>
+	);
 };
 
 export default compose( [

package/src/components/inserter/hooks/use-insertion-point.js

@@ -64,19 +64,12 @@ function useInsertionPoint( {
 				_destinationIndex = insertionIndex;
 			} else if ( clientId ) {
 				// Insert after a specific client ID.
-				_destinationIndex = getBlockIndex(
-					clientId,
-					_destinationRootClientId
-				);
+				_destinationIndex = getBlockIndex( clientId );
 			} else if ( ! isAppender && selectedBlockClientId ) {
 				_destinationRootClientId = getBlockRootClientId(
 					selectedBlockClientId
 				);
-				_destinationIndex =
-					getBlockIndex(
-						selectedBlockClientId,
-						_destinationRootClientId
-					) + 1;
+				_destinationIndex = getBlockIndex( selectedBlockClientId ) + 1;
 			} else {
 				// Insert at the end of the list.
 				_destinationIndex = getBlockOrder( _destinationRootClientId )

package/src/components/inserter/index.js

@@ -265,7 +265,7 @@ export default compose( [
 
 					// If the clientId is defined, we insert at the position of the block.
 					if ( clientId ) {
-						return getBlockIndex( clientId, rootClientId );
+						return getBlockIndex( clientId );
 					}
 
 					// If there a selected block, we insert after the selected block.
@@ -275,7 +275,7 @@ export default compose( [
 						end &&
 						getBlockRootClientId( end ) === rootClientId
 					) {
-						return getBlockIndex( end, rootClientId ) + 1;
+						return getBlockIndex( end ) + 1;
 					}
 
 					// Otherwise, we insert at the end of the current rootClientId

package/src/components/inserter/index.native.js

@@ -7,7 +7,7 @@ import { delay } from 'lodash';
 /**
  * WordPress dependencies
  */
-import { __, _x } from '@wordpress/i18n';
+import { __ } from '@wordpress/i18n';
 import { Dropdown, ToolbarButton, Picker } from '@wordpress/components';
 import { Component } from '@wordpress/element';
 import { withDispatch, withSelect } from '@wordpress/data';
@@ -34,7 +34,7 @@ const VOICE_OVER_ANNOUNCEMENT_DELAY = 1000;
 
 const defaultRenderToggle = ( { onToggle, disabled, style, onLongPress } ) => (
 	<ToolbarButton
-		title={ _x( 'Add block', 'Generic label for block inserter button' ) }
+		title={ __( 'Add block' ) }
 		icon={
 			<Icon
 				icon={ plusCircleFilled }
@@ -343,10 +343,7 @@ export default compose( [
 		const destinationRootClientId = isAnyBlockSelected
 			? getBlockRootClientId( end )
 			: rootClientId;
-		const selectedBlockIndex = getBlockIndex(
-			end,
-			destinationRootClientId
-		);
+		const selectedBlockIndex = getBlockIndex( end );
 		const endOfRootIndex = getBlockOrder( rootClientId ).length;
 		const isSelectedUnmodifiedDefaultBlock = isAnyBlockSelected
 			? isUnmodifiedDefaultBlock( getBlock( end ) )
@@ -364,7 +361,7 @@ export default compose( [
 
 			// If the clientId is defined, we insert at the position of the block.
 			if ( clientId ) {
-				return getBlockIndex( clientId, rootClientId );
+				return getBlockIndex( clientId );
 			}
 
 			// If there is a selected block,

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

@@ -56,7 +56,7 @@ export default function QuickInserter( {
 			const { getSettings, getBlockIndex, getBlockCount } = select(
 				blockEditorStore
 			);
-			const index = getBlockIndex( clientId, rootClientId );
+			const index = getBlockIndex( clientId );
 			return {
 				setInserterIsOpened: getSettings()
 					.__experimentalSetIsInserterOpened,

package/src/components/inserter/tabs.native.js

@@ -63,7 +63,7 @@ function InserterTabs( {
 	}, [ tabIndex ] );
 
 	const { tabs, tabKeys } = useMemo( () => {
-		const filteredTabs = InserterTabs.getTabs().filter(
+		const filteredTabs = InserterTabs.TABS.filter(
 			( { name } ) => showReusableBlocks || name !== 'reusable'
 		);
 		return {
@@ -114,9 +114,8 @@ function InserterTabs( {
 }
 
 function TabsControl( { onChangeTab, showReusableBlocks } ) {
-	const tabs = InserterTabs.getTabs();
 	const segments = useMemo( () => {
-		const filteredTabs = tabs.filter(
+		const filteredTabs = InserterTabs.TABS.filter(
 			( { name } ) => showReusableBlocks || name !== 'reusable'
 		);
 		return filteredTabs.map( ( { title } ) => title );
@@ -124,7 +123,7 @@ function TabsControl( { onChangeTab, showReusableBlocks } ) {
 
 	const segmentHandler = useCallback(
 		( selectedTab ) => {
-			const tabTitles = tabs.map( ( { title } ) => title );
+			const tabTitles = InserterTabs.TABS.map( ( { title } ) => title );
 			onChangeTab( tabTitles.indexOf( selectedTab ) );
 		},
 		[ onChangeTab ]
@@ -140,7 +139,7 @@ function TabsControl( { onChangeTab, showReusableBlocks } ) {
 
 InserterTabs.Control = TabsControl;
 
-InserterTabs.getTabs = () => [
+InserterTabs.TABS = [
 	{ name: 'blocks', title: __( 'Blocks' ), component: BlockTypesTab },
 	{ name: 'reusable', title: __( 'Reusable' ), component: ReusableBlocksTab },
 ];

package/src/components/inspector-controls/block-support-slot-container.js

@@ -6,7 +6,5 @@ import { useContext } from '@wordpress/element';
 
 export default function BlockSupportSlotContainer( { Slot, ...props } ) {
 	const toolsPanelContext = useContext( ToolsPanelContext );
-	return (
-		<Slot { ...props } fillProps={ toolsPanelContext } bubblesVirtually />
-	);
+	return <Slot { ...props } fillProps={ toolsPanelContext } />;
 }

package/src/components/inspector-controls/block-support-tools-panel.js

@@ -11,37 +11,73 @@ import { store as blockEditorStore } from '../../store';
 import { cleanEmptyObject } from '../../hooks/utils';
 
 export default function BlockSupportToolsPanel( { children, group, label } ) {
-	const { clientId, attributes } = useSelect( ( select ) => {
-		const { getBlockAttributes, getSelectedBlockClientId } = select(
-			blockEditorStore
-		);
+	const { attributes, clientIds, panelId } = useSelect( ( select ) => {
+		const {
+			getBlockAttributes,
+			getMultiSelectedBlockClientIds,
+			getSelectedBlockClientId,
+			hasMultiSelection,
+		} = select( blockEditorStore );
+
+		// When we currently have a multi-selection, the value returned from
+		// `getSelectedBlockClientId()` is `null`. When a `null` value is used
+		// for the `panelId`, a `ToolsPanel` will still allow panel items to
+		// register themselves despite their panelIds not matching.
 		const selectedBlockClientId = getSelectedBlockClientId();
 
+		if ( hasMultiSelection() ) {
+			const selectedBlockClientIds = getMultiSelectedBlockClientIds();
+			const selectedBlockAttributes = selectedBlockClientIds.reduce(
+				( blockAttributes, blockId ) => {
+					blockAttributes[ blockId ] = getBlockAttributes( blockId );
+					return blockAttributes;
+				},
+				{}
+			);
+
+			return {
+				panelId: selectedBlockClientId,
+				clientIds: selectedBlockClientIds,
+				attributes: selectedBlockAttributes,
+			};
+		}
+
 		return {
-			clientId: selectedBlockClientId,
-			attributes: getBlockAttributes( selectedBlockClientId ),
+			panelId: selectedBlockClientId,
+			clientIds: [ selectedBlockClientId ],
+			attributes: {
+				[ selectedBlockClientId ]: getBlockAttributes(
+					selectedBlockClientId
+				),
+			},
 		};
 	}, [] );
 	const { updateBlockAttributes } = useDispatch( blockEditorStore );
 
 	const resetAll = ( resetFilters = [] ) => {
-		const { style } = attributes;
-		let newAttributes = { style };
+		const newAttributes = {};
+
+		clientIds.forEach( ( clientId ) => {
+			const { style } = attributes[ clientId ];
+			let newBlockAttributes = { style };
 
-		resetFilters.forEach( ( resetFilter ) => {
-			newAttributes = {
-				...newAttributes,
-				...resetFilter( newAttributes ),
+			resetFilters.forEach( ( resetFilter ) => {
+				newBlockAttributes = {
+					...newBlockAttributes,
+					...resetFilter( newBlockAttributes ),
+				};
+			} );
+
+			// Enforce a cleaned style object.
+			newBlockAttributes = {
+				...newBlockAttributes,
+				style: cleanEmptyObject( newBlockAttributes.style ),
 			};
-		} );
 
-		// Enforce a cleaned style object.
-		newAttributes = {
-			...newAttributes,
-			style: cleanEmptyObject( newAttributes.style ),
-		};
+			newAttributes[ clientId ] = newBlockAttributes;
+		} );
 
-		updateBlockAttributes( clientId, newAttributes );
+		updateBlockAttributes( clientIds, newAttributes, true );
 	};
 
 	return (
@@ -49,8 +85,8 @@ export default function BlockSupportToolsPanel( { children, group, label } ) {
 			className={ `${ group }-block-support-panel` }
 			label={ label }
 			resetAll={ resetAll }
-			key={ clientId }
-			panelId={ clientId }
+			key={ panelId }
+			panelId={ panelId }
 			hasInnerWrapper={ true }
 			shouldRenderPlaceholderItems={ true } // Required to maintain fills ordering.
 		>

package/src/components/inspector-controls/fill.native.js

@@ -14,7 +14,7 @@ import warning from '@wordpress/warning';
  * Internal dependencies
  */
 import groups from './groups';
-import useDisplayBlockControls from '../use-display-block-controls';
+import { useBlockEditContext } from '../block-edit/context';
 import { BlockSettingsButton } from '../block-settings';
 
 export default function InspectorControlsFill( {
@@ -22,14 +22,13 @@ export default function InspectorControlsFill( {
 	__experimentalGroup: group = 'default',
 	...props
 } ) {
-	const isDisplayed = useDisplayBlockControls();
-
+	const { isSelected } = useBlockEditContext();
 	const Fill = groups[ group ]?.Fill;
 	if ( ! Fill ) {
 		warning( `Unknown InspectorControl group "${ group }" provided.` );
 		return null;
 	}
-	if ( ! isDisplayed ) {
+	if ( ! isSelected ) {
 		return null;
 	}
 

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

@@ -5,7 +5,6 @@ import { createSlotFill } from '@wordpress/components';
 
 const InspectorControlsDefault = createSlotFill( 'InspectorControls' );
 const InspectorControlsAdvanced = createSlotFill( 'InspectorAdvancedControls' );
-const InspectorControlsBorder = createSlotFill( 'InspectorControlsBorder' );
 const InspectorControlsDimensions = createSlotFill(
 	'InspectorControlsDimensions'
 );
@@ -16,7 +15,6 @@ const InspectorControlsTypography = createSlotFill(
 const groups = {
 	default: InspectorControlsDefault,
 	advanced: InspectorControlsAdvanced,
-	border: InspectorControlsBorder,
 	dimensions: InspectorControlsDimensions,
 	typography: InspectorControlsTypography,
 };

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

@@ -13,6 +13,7 @@ import groups from './groups';
 
 export default function InspectorControlsSlot( {
 	__experimentalGroup: group = 'default',
+	bubblesVirtually = true,
 	label,
 	...props
 } ) {
@@ -31,10 +32,14 @@ export default function InspectorControlsSlot( {
 	if ( label ) {
 		return (
 			<BlockSupportToolsPanel group={ group } label={ label }>
-				<BlockSupportSlotContainer { ...props } Slot={ Slot } />
+				<BlockSupportSlotContainer
+					{ ...props }
+					bubblesVirtually={ bubblesVirtually }
+					Slot={ Slot }
+				/>
 			</BlockSupportToolsPanel>
 		);
 	}
 
-	return <Slot { ...props } bubblesVirtually />;
+	return <Slot { ...props } bubblesVirtually={ bubblesVirtually } />;
 }

package/src/components/letter-spacing-control/index.js

@@ -15,12 +15,12 @@ import useSetting from '../../components/use-setting';
 /**
  * Control for letter-spacing.
  *
- * @param {Object}                  props                      Component props.
- * @param {string}                  props.value                Currently selected letter-spacing.
- * @param {Function}                props.onChange             Handles change in letter-spacing selection.
- * @param {string|number|undefined} props.__unstableInputWidth Input width to pass through to inner UnitControl. Should be a valid CSS value.
+ * @param {Object}   props                      Component props.
+ * @param {string}   props.value                Currently selected letter-spacing.
+ * @param {Function} props.onChange             Handles change in letter-spacing selection.
+ * @param {boolean}  props.__unstableInputWidth Input width to pass through to inner UnitControl.
  *
- * @return {WPElement} Letter-spacing control.
+ * @return {WPElement}                          Letter-spacing control.
  */
 export default function LetterSpacingControl( {
 	value,
@@ -33,7 +33,7 @@ export default function LetterSpacingControl( {
 	} );
 	return (
 		<UnitControl
-			label={ __( 'Letter spacing' ) }
+			label={ __( 'Letter-spacing' ) }
 			value={ value }
 			__unstableInputWidth={ __unstableInputWidth }
 			units={ units }

package/src/components/link-control/README.md

@@ -114,7 +114,7 @@ Controls the query parameters used to search for suggestions. For example, to li
 
 ```jsx
 <LinkControl
-	suggestionsQuery={ {
+	suggestionQuery={ {
 		type: 'post',
 		subtype: 'page',
 	} }

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

@@ -1634,7 +1634,6 @@ describe( 'Selecting links', () => {
 					);
 
 					// We should have highlighted the first item using the keyboard
-					// eslint-disable-next-line jest/no-conditional-expect
 					expect( selectedSearchResultElement ).toEqual(
 						secondSearchSuggestion
 					);
@@ -1649,7 +1648,6 @@ describe( 'Selecting links', () => {
 					);
 
 					// We should be back to highlighting the first search result again
-					// eslint-disable-next-line jest/no-conditional-expect
 					expect( selectedSearchResultElement ).toEqual(
 						firstSearchSuggestion
 					);

package/src/components/list-view/block-select-button.js

@@ -19,7 +19,6 @@ import useBlockDisplayInformation from '../use-block-display-information';
 import { getBlockPositionDescription } from './utils';
 import BlockTitle from '../block-title';
 import ListViewExpander from './expander';
-import { SPACE, ENTER } from '@wordpress/keycodes';
 
 function ListViewBlockSelectButton(
 	{
@@ -48,22 +47,6 @@ function ListViewBlockSelectButton(
 		level
 	);
 
-	// The `href` attribute triggers the browser's native HTML drag operations.
-	// When the link is dragged, the element's outerHTML is set in DataTransfer object as text/html.
-	// We need to clear any HTML drag data to prevent `pasteHandler` from firing
-	// inside the `useOnBlockDrop` hook.
-	const onDragStartHandler = ( event ) => {
-		event.dataTransfer.clearData();
-		onDragStart( event );
-	};
-
-	function onKeyDownHandler( event ) {
-		if ( event.keyCode === ENTER || event.keyCode === SPACE ) {
-			event.preventDefault();
-			onClick( event );
-		}
-	}
-
 	return (
 		<>
 			<Button
@@ -72,15 +55,13 @@ function ListViewBlockSelectButton(
 					className
 				) }
 				onClick={ onClick }
-				onKeyDown={ onKeyDownHandler }
 				aria-describedby={ descriptionId }
 				ref={ ref }
 				tabIndex={ tabIndex }
 				onFocus={ onFocus }
-				onDragStart={ onDragStartHandler }
+				onDragStart={ onDragStart }
 				onDragEnd={ onDragEnd }
 				draggable={ draggable }
-				href={ `#block-${ clientId }` }
 			>
 				<ListViewExpander onClick={ onToggleExpanded } />
 				<BlockIcon icon={ blockInformation?.icon } showColors />

package/src/components/list-view/use-list-view-drop-zone.js

@@ -226,7 +226,7 @@ export default function useListViewDropZone() {
 					return {
 						clientId,
 						rootClientId,
-						blockIndex: getBlockIndex( clientId, rootClientId ),
+						blockIndex: getBlockIndex( clientId ),
 						element: blockElement,
 						isDraggedBlock: isBlockDrag
 							? draggedBlockClientIds.includes( clientId )