@wordpress/block-editor 10.0.0 → 10.0.2

package/build-style/style-rtl.css

@@ -175,6 +175,9 @@
 .block-editor-block-list__layout {
   position: relative;
 }
+.block-editor-block-list__layout::selection {
+  background: transparent;
+}
 .block-editor-block-list__layout .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected)::after,
 .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted::after,
 .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted ~ .is-multi-selected::after {
@@ -203,6 +206,9 @@
 .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted ~ .is-multi-selected .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected) ::selection {
   background: transparent;
 }
+.has-multi-selection .block-editor-block-list__layout::selection {
+  background: transparent;
+}
 .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted::after {
   box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
   outline: 1px solid transparent;
@@ -268,10 +274,16 @@
   */
 }
 .block-editor-block-list__layout .block-editor-block-list__block.is-partially-selected::after {
-  height: 0;
+  top: -0.5px;
+  left: -0.5px;
+  bottom: -0.5px;
+  right: -0.5px;
 }
 .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted::after, .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted ~ .is-multi-selected::after {
-  height: auto;
+  top: 0;
+  left: 0;
+  bottom: 0;
+  right: 0;
 }
 .block-editor-block-list__layout .block-editor-block-list__block .reusable-block-edit-panel * {
   z-index: 1;
@@ -3286,6 +3298,38 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
   z-index: 100000;
 }
 
+.block-editor-text-decoration-control {
+  border: 0;
+  margin: 0;
+  padding: 0;
+}
+.block-editor-text-decoration-control .block-editor-text-decoration-control__buttons {
+  padding: 4px 0;
+  display: flex;
+}
+.block-editor-text-decoration-control .components-button.has-icon {
+  height: 32px;
+  margin-left: 4px;
+  min-width: 32px;
+  padding: 0;
+}
+
+.block-editor-text-transform-control {
+  border: 0;
+  margin: 0;
+  padding: 0;
+}
+.block-editor-text-transform-control .block-editor-text-transform-control__buttons {
+  padding: 4px 0;
+  display: flex;
+}
+.block-editor-text-transform-control .components-button.has-icon {
+  height: 32px;
+  margin-left: 4px;
+  min-width: 32px;
+  padding: 0;
+}
+
 .block-editor-tool-selector__help {
   margin-top: 8px;
   margin-right: -8px;
@@ -4313,9 +4357,11 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
   grid-column: 2/2;
   grid-row: 1/1;
   justify-self: end;
-  margin-left: 4px;
   padding: 0;
 }
+.component-spacing-sizes-control .component-spacing-sizes-control__linked-button ~ .components-spacing-sizes-control__custom-toggle-all {
+  margin-left: 4px;
+}
 .component-spacing-sizes-control .components-spacing-sizes-control__custom-toggle-single {
   grid-column: 3/3;
   justify-self: end;

package/build-style/style.css

@@ -175,6 +175,9 @@
 .block-editor-block-list__layout {
   position: relative;
 }
+.block-editor-block-list__layout::selection {
+  background: transparent;
+}
 .block-editor-block-list__layout .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected)::after,
 .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted::after,
 .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted ~ .is-multi-selected::after {
@@ -203,6 +206,9 @@
 .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted ~ .is-multi-selected .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected) ::selection {
   background: transparent;
 }
+.has-multi-selection .block-editor-block-list__layout::selection {
+  background: transparent;
+}
 .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted::after {
   box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
   outline: 1px solid transparent;
@@ -268,10 +274,16 @@
   */
 }
 .block-editor-block-list__layout .block-editor-block-list__block.is-partially-selected::after {
-  height: 0;
+  top: -0.5px;
+  right: -0.5px;
+  bottom: -0.5px;
+  left: -0.5px;
 }
 .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted::after, .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted ~ .is-multi-selected::after {
-  height: auto;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
 }
 .block-editor-block-list__layout .block-editor-block-list__block .reusable-block-edit-panel * {
   z-index: 1;
@@ -3286,6 +3298,38 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
   z-index: 100000;
 }
 
+.block-editor-text-decoration-control {
+  border: 0;
+  margin: 0;
+  padding: 0;
+}
+.block-editor-text-decoration-control .block-editor-text-decoration-control__buttons {
+  padding: 4px 0;
+  display: flex;
+}
+.block-editor-text-decoration-control .components-button.has-icon {
+  height: 32px;
+  margin-right: 4px;
+  min-width: 32px;
+  padding: 0;
+}
+
+.block-editor-text-transform-control {
+  border: 0;
+  margin: 0;
+  padding: 0;
+}
+.block-editor-text-transform-control .block-editor-text-transform-control__buttons {
+  padding: 4px 0;
+  display: flex;
+}
+.block-editor-text-transform-control .components-button.has-icon {
+  height: 32px;
+  margin-right: 4px;
+  min-width: 32px;
+  padding: 0;
+}
+
 .block-editor-tool-selector__help {
   margin-top: 8px;
   margin-left: -8px;
@@ -4313,9 +4357,11 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
   grid-column: 2/2;
   grid-row: 1/1;
   justify-self: end;
-  margin-right: 4px;
   padding: 0;
 }
+.component-spacing-sizes-control .component-spacing-sizes-control__linked-button ~ .components-spacing-sizes-control__custom-toggle-all {
+  margin-right: 4px;
+}
 .component-spacing-sizes-control .components-spacing-sizes-control__custom-toggle-single {
   grid-column: 3/3;
   justify-self: end;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-editor",
-	"version": "10.0.0",
+	"version": "10.0.2",
 	"description": "Generic block editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -33,32 +33,32 @@
 	"dependencies": {
 		"@babel/runtime": "^7.16.0",
 		"@react-spring/web": "^9.4.5",
-		"@wordpress/a11y": "^3.17.0",
-		"@wordpress/api-fetch": "^6.14.0",
-		"@wordpress/blob": "^3.17.0",
-		"@wordpress/blocks": "^11.16.0",
-		"@wordpress/components": "^21.0.0",
-		"@wordpress/compose": "^5.15.0",
-		"@wordpress/data": "^7.1.0",
-		"@wordpress/date": "^4.17.0",
-		"@wordpress/deprecated": "^3.17.0",
-		"@wordpress/dom": "^3.17.0",
-		"@wordpress/element": "^4.15.0",
-		"@wordpress/hooks": "^3.17.0",
-		"@wordpress/html-entities": "^3.17.0",
-		"@wordpress/i18n": "^4.17.0",
-		"@wordpress/icons": "^9.8.0",
-		"@wordpress/is-shallow-equal": "^4.17.0",
-		"@wordpress/keyboard-shortcuts": "^3.15.0",
-		"@wordpress/keycodes": "^3.17.0",
-		"@wordpress/notices": "^3.17.0",
-		"@wordpress/rich-text": "^5.15.0",
-		"@wordpress/shortcode": "^3.17.0",
-		"@wordpress/style-engine": "^0.16.0",
-		"@wordpress/token-list": "^2.17.0",
-		"@wordpress/url": "^3.18.0",
-		"@wordpress/warning": "^2.17.0",
-		"@wordpress/wordcount": "^3.17.0",
+		"@wordpress/a11y": "^3.17.1",
+		"@wordpress/api-fetch": "^6.14.1",
+		"@wordpress/blob": "^3.17.1",
+		"@wordpress/blocks": "^11.16.2",
+		"@wordpress/components": "^21.0.2",
+		"@wordpress/compose": "^5.15.2",
+		"@wordpress/data": "^7.1.2",
+		"@wordpress/date": "^4.17.1",
+		"@wordpress/deprecated": "^3.17.1",
+		"@wordpress/dom": "^3.17.2",
+		"@wordpress/element": "^4.15.1",
+		"@wordpress/hooks": "^3.17.1",
+		"@wordpress/html-entities": "^3.17.1",
+		"@wordpress/i18n": "^4.17.1",
+		"@wordpress/icons": "^9.8.1",
+		"@wordpress/is-shallow-equal": "^4.17.1",
+		"@wordpress/keyboard-shortcuts": "^3.15.2",
+		"@wordpress/keycodes": "^3.17.1",
+		"@wordpress/notices": "^3.17.2",
+		"@wordpress/rich-text": "^5.15.2",
+		"@wordpress/shortcode": "^3.17.1",
+		"@wordpress/style-engine": "^1.0.1",
+		"@wordpress/token-list": "^2.17.1",
+		"@wordpress/url": "^3.18.1",
+		"@wordpress/warning": "^2.17.1",
+		"@wordpress/wordcount": "^3.17.1",
 		"change-case": "^4.1.2",
 		"classnames": "^2.3.1",
 		"colord": "^2.7.0",
@@ -79,5 +79,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "0d732d4b184adcb28cc83087603e81b764390d4b"
+	"gitHead": "f6021282457317c7e12dcc3a3f02c9ac28e16a30"
 }

package/src/components/autocomplete/index.js

@@ -32,16 +32,13 @@ const EMPTY_ARRAY = [];
 function useCompleters( { completers = EMPTY_ARRAY } ) {
 	const { name } = useBlockEditContext();
 	return useMemo( () => {
-		let filteredCompleters = completers;
+		let filteredCompleters = [ ...completers, linkAutocompleter ];
 
 		if (
 			name === getDefaultBlockName() ||
 			getBlockSupport( name, '__experimentalSlashInserter', false )
 		) {
-			filteredCompleters = filteredCompleters.concat( [
-				blockAutocompleter,
-				linkAutocompleter,
-			] );
+			filteredCompleters = [ ...filteredCompleters, blockAutocompleter ];
 		}
 
 		if ( hasFilter( 'editor.Autocomplete.completers' ) ) {

package/src/components/block-inspector/index.js

@@ -158,7 +158,7 @@ const BlockInspector = ( { showNoBlockSelectedMessage = true } ) => {
 			selectedBlockName: _selectedBlockName,
 			blockType: _blockType,
 			topLevelLockedBlock:
-				getTemplateLock( _selectedBlockClientId ) === 'noContent'
+				getTemplateLock( _selectedBlockClientId ) === 'contentOnly'
 					? _selectedBlockClientId
 					: __unstableGetContentLockingParent(
 							_selectedBlockClientId

package/src/components/block-list/block-list-compact.native.js

@@ -46,7 +46,7 @@ function BlockListCompact( props ) {
 	};
 
 	return (
-		<View style={ containerStyle }>
+		<View style={ containerStyle } testID="block-list-wrapper">
 			{ blockClientIds.map( ( currentClientId ) => (
 				<BlockListBlock
 					clientId={ currentClientId }

package/src/components/block-list/block.js

@@ -118,7 +118,7 @@ function BlockListBlock( {
 					),
 				hasContentLockedParent: _hasContentLockedParent,
 				isContentLocking:
-					getTemplateLock( clientId ) === 'noContent' &&
+					getTemplateLock( clientId ) === 'contentOnly' &&
 					! _hasContentLockedParent,
 				isTemporarilyEditingAsBlocks:
 					__unstableGetTemporarilyEditingAsBlocks() === clientId,

package/src/components/block-list/style.scss

@@ -13,6 +13,12 @@
 .block-editor-block-list__layout {
 	position: relative;
 
+	// Hide selections on this element, otherwise Safari will include it stacked
+	// under your actual selection.
+	&::selection {
+		background: transparent;
+	}
+
 	// The primary indicator of selection in text is the native selection marker.
 	// When selecting multiple blocks, we provide an additional selection indicator.
 	.block-editor-block-list__block.is-multi-selected:not(.is-partially-selected),
@@ -51,6 +57,11 @@
 		}
 	}
 
+	// Hide the selection indicator on .block-editor-block-list__layout, else Safari will show it stacked.
+	.has-multi-selection &::selection {
+		background: transparent;
+	}
+
 	.block-editor-block-list__block.is-highlighted::after {
 		box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
 		outline: $border-width solid transparent;
@@ -128,14 +139,22 @@
 	// Re-enable text-selection on editable blocks.
 	user-select: text;
 
-	// Hide the select style pseudo element as it interferes with the style.
+	// Hide the select style pseudo element as otherwise it gets shwon as "selected" in Safari.
 	&.is-partially-selected::after {
-		height: 0;
+		// By positioning this pseudo element outside the boundaries of the parent block,
+		// when partially selected it hides the pseudo element selection in Safari.
+		top: -0.5px;
+		right: -0.5px;
+		bottom: -0.5px;
+		left: -0.5px;
 	}
 
 	&.is-highlighted::after,
 	&.is-highlighted ~ .is-multi-selected::after {
-		height: auto;
+		top: 0;
+		right: 0;
+		bottom: 0;
+		left: 0;
 	}
 
 	// Break long strings of text without spaces so they don't overflow the block.

package/src/components/block-lock/use-block-lock.js

@@ -38,7 +38,7 @@ export default function useBlockLock( clientId ) {
 				canMove,
 				canRemove,
 				canLock: canLockBlockType( getBlockName( clientId ) ),
-				isContentLocked: getTemplateLock( clientId ) === 'noContent',
+				isContentLocked: getTemplateLock( clientId ) === 'contentOnly',
 				isLocked: ! canEdit || ! canMove || ! canRemove,
 			};
 		},

package/src/components/block-popover/inbetween.js

@@ -8,7 +8,6 @@ import classnames from 'classnames';
  */
 import { useSelect } from '@wordpress/data';
 import {
-	useCallback,
 	useMemo,
 	createContext,
 	useReducer,
@@ -107,66 +106,65 @@ function BlockPopoverInbetween( {
 		isVisible,
 	] );
 
-	const getAnchorRect = useCallback( () => {
+	const popoverAnchor = useMemo( () => {
 		if ( ( ! previousElement && ! nextElement ) || ! isVisible ) {
-			return {};
+			return undefined;
 		}
 
 		const { ownerDocument } = previousElement || nextElement;
 
-		const previousRect = previousElement
-			? previousElement.getBoundingClientRect()
-			: null;
-		const nextRect = nextElement
-			? nextElement.getBoundingClientRect()
-			: null;
+		return {
+			ownerDocument,
+			getBoundingClientRect() {
+				const previousRect = previousElement
+					? previousElement.getBoundingClientRect()
+					: null;
+				const nextRect = nextElement
+					? nextElement.getBoundingClientRect()
+					: null;
 
-		if ( isVertical ) {
-			if ( isRTL() ) {
-				return {
-					top: previousRect ? previousRect.bottom : nextRect.top,
-					left: previousRect ? previousRect.right : nextRect.right,
-					right: previousRect ? previousRect.right : nextRect.right,
-					bottom: previousRect ? previousRect.bottom : nextRect.top,
-					height: 0,
-					width: 0,
-					ownerDocument,
-				};
-			}
+				let left = 0;
+				let top = 0;
 
-			return {
-				top: previousRect ? previousRect.bottom : nextRect.top,
-				left: previousRect ? previousRect.left : nextRect.left,
-				right: previousRect ? previousRect.left : nextRect.left,
-				bottom: previousRect ? previousRect.bottom : nextRect.top,
-				height: 0,
-				width: 0,
-				ownerDocument,
-			};
-		}
+				if ( isVertical ) {
+					// vertical
+					top = previousRect ? previousRect.bottom : nextRect.top;
 
-		if ( isRTL() ) {
-			return {
-				top: previousRect ? previousRect.top : nextRect.top,
-				left: previousRect ? previousRect.left : nextRect.right,
-				right: previousRect ? previousRect.left : nextRect.right,
-				bottom: previousRect ? previousRect.top : nextRect.top,
-				height: 0,
-				width: 0,
-				ownerDocument,
-			};
-		}
+					if ( isRTL() ) {
+						// vertical, rtl
+						left = previousRect
+							? previousRect.right
+							: nextRect.right;
+					} else {
+						// vertical, ltr
+						left = previousRect ? previousRect.left : nextRect.left;
+					}
+				} else {
+					top = previousRect ? previousRect.top : nextRect.top;
 
-		return {
-			top: previousRect ? previousRect.top : nextRect.top,
-			left: previousRect ? previousRect.right : nextRect.left,
-			right: previousRect ? previousRect.right : nextRect.left,
-			bottom: previousRect ? previousRect.left : nextRect.right,
-			height: 0,
-			width: 0,
-			ownerDocument,
+					if ( isRTL() ) {
+						// non vertical, rtl
+						left = previousRect
+							? previousRect.left
+							: nextRect.right;
+					} else {
+						// non vertical, ltr
+						left = previousRect
+							? previousRect.right
+							: nextRect.left;
+					}
+				}
+
+				return new window.DOMRect( left, top, 0, 0 );
+			},
 		};
-	}, [ previousElement, nextElement, positionRecompute, isVisible ] );
+	}, [
+		previousElement,
+		nextElement,
+		positionRecompute,
+		isVertical,
+		isVisible,
+	] );
 
 	const popoverScrollRef = usePopoverScroll( __unstableContentRef );
 
@@ -229,7 +227,7 @@ function BlockPopoverInbetween( {
 		<Popover
 			ref={ popoverScrollRef }
 			animate={ false }
-			getAnchorRect={ getAnchorRect }
+			anchor={ popoverAnchor }
 			focusOnMount={ false }
 			// Render in the old slot if needed for backward compatibility,
 			// otherwise render in place (not in the default popover slot).

package/src/components/block-popover/index.js

@@ -47,22 +47,60 @@ function BlockPopover(
 		};
 	}, [ selectedElement, lastSelectedElement, __unstableRefreshSize ] );
 
+	const popoverAnchor = useMemo( () => {
+		if (
+			! selectedElement ||
+			( bottomClientId && ! lastSelectedElement )
+		) {
+			return undefined;
+		}
+
+		return {
+			getBoundingClientRect() {
+				const selectedBCR = selectedElement.getBoundingClientRect();
+				const lastSelectedBCR =
+					lastSelectedElement?.getBoundingClientRect();
+
+				// Get the biggest rectangle that encompasses completely the currently
+				// selected element and the last selected element:
+				// - for top/left coordinates, use the smaller numbers
+				// - for the bottom/right coordinates, use the largest numbers
+				const left = Math.min(
+					selectedBCR.left,
+					lastSelectedBCR?.left ?? Infinity
+				);
+				const top = Math.min(
+					selectedBCR.top,
+					lastSelectedBCR?.top ?? Infinity
+				);
+				const right = Math.max(
+					selectedBCR.right,
+					lastSelectedBCR.right ?? -Infinity
+				);
+				const bottom = Math.max(
+					selectedBCR.bottom,
+					lastSelectedBCR.bottom ?? -Infinity
+				);
+				const width = right - left;
+				const height = bottom - top;
+
+				return new window.DOMRect( left, top, width, height );
+			},
+			ownerDocument: selectedElement.ownerDocument,
+		};
+	}, [ bottomClientId, lastSelectedElement, selectedElement ] );
+
 	if ( ! selectedElement || ( bottomClientId && ! lastSelectedElement ) ) {
 		return null;
 	}
 
-	const anchorRef = {
-		top: selectedElement,
-		bottom: lastSelectedElement,
-	};
-
 	return (
 		<Popover
 			ref={ mergedRefs }
 			animate={ false }
 			position="top right left"
 			focusOnMount={ false }
-			anchorRef={ anchorRef }
+			anchor={ popoverAnchor }
 			// Render in the old slot if needed for backward compatibility,
 			// otherwise render in place (not in the default popover slot).
 			__unstableSlotName={ __unstablePopoverSlot || null }

package/src/components/border-radius-control/linked-button.js

@@ -6,20 +6,21 @@ import { link, linkOff } from '@wordpress/icons';
 import { __ } from '@wordpress/i18n';
 
 export default function LinkedButton( { isLinked, ...props } ) {
-	const label = isLinked ? __( 'Unlink Radii' ) : __( 'Link Radii' );
+	const label = isLinked ? __( 'Unlink radii' ) : __( 'Link radii' );
 
+	// TODO: Remove span after merging https://github.com/WordPress/gutenberg/pull/44198
 	return (
 		<Tooltip text={ label }>
-			<Button
-				{ ...props }
-				className="component-border-radius-control__linked-button"
-				isPrimary={ isLinked }
-				isSecondary={ ! isLinked }
-				isSmall
-				icon={ isLinked ? link : linkOff }
-				iconSize={ 16 }
-				aria-label={ label }
-			/>
+			<span>
+				<Button
+					{ ...props }
+					className="component-border-radius-control__linked-button"
+					isSmall
+					icon={ isLinked ? link : linkOff }
+					iconSize={ 24 }
+					aria-label={ label }
+				/>
+			</span>
 		</Tooltip>
 	);
 }

package/src/components/convert-to-group-buttons/toolbar.js

@@ -14,7 +14,7 @@ import { useConvertToGroupButtonProps } from '../convert-to-group-buttons';
 import { store as blockEditorStore } from '../../store';
 
 const layouts = {
-	group: undefined,
+	group: { type: 'constrained' },
 	row: { type: 'flex', flexWrap: 'nowrap' },
 	stack: { type: 'flex', orientation: 'vertical' },
 };
@@ -40,12 +40,16 @@ function BlockGroupToolbar() {
 		[ clientIds, groupingBlockName ]
 	);
 
-	const onConvertToGroup = ( layout = 'group' ) => {
+	const onConvertToGroup = ( layout ) => {
 		const newBlocks = switchToBlockType(
 			blocksSelection,
 			groupingBlockName
 		);
 
+		if ( typeof layout !== 'string' ) {
+			layout = 'group';
+		}
+
 		if ( newBlocks && newBlocks.length > 0 ) {
 			// Because the block is not in the store yet we can't use
 			// updateBlockAttributes so need to manually update attributes.

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

@@ -125,12 +125,12 @@ Template locking of `InnerBlocks` is similar to [Custom Post Type templates lock
 Template locking allows locking the `InnerBlocks` area for the current template.
 _Options:_
 
--   `noContent` — prevents all operations. Additionally, the block types that don't have content are hidden from the list view and can't gain focus within the block list. Unlike the other lock types, this is not overrideable by children.
+-   `contentOnly` — prevents all operations. Additionally, the block types that don't have content are hidden from the list view and can't gain focus within the block list. Unlike the other lock types, this is not overrideable by children.
 -   `'all'` — prevents all operations. It is not possible to insert new blocks. Move existing blocks or delete them.
 -   `'insert'` — prevents inserting or removing blocks, but allows moving existing ones.
 -   `false` — prevents locking from being applied to an `InnerBlocks` area even if a parent block contains locking. ( Boolean )
 
-If locking is not set in an `InnerBlocks` area: the locking of the parent `InnerBlocks` area is used. Note that `noContent` can't be overriden: it's present, the `templateLock` value of any children is ignored.
+If locking is not set in an `InnerBlocks` area: the locking of the parent `InnerBlocks` area is used. Note that `contentOnly` can't be overriden: it's present, the `templateLock` value of any children is ignored.
 
 If the block is a top level block: the locking of the Custom Post Type is used.
 

package/src/components/inner-blocks/index.js

@@ -77,6 +77,13 @@ function UncontrolledInnerBlocks( props ) {
 	const context = useSelect(
 		( select ) => {
 			const block = select( blockEditorStore ).getBlock( clientId );
+
+			// This check is here to avoid the Redux zombie bug where a child subscription
+			// is called before a parent, causing potential JS errors when the child has been removed.
+			if ( ! block ) {
+				return;
+			}
+
 			const blockType = getBlockType( block.name );
 
 			if ( ! blockType || ! blockType.providesContext ) {