@wordpress/block-editor 9.0.0 → 9.1.0

package/build-style/style.css

@@ -107,14 +107,6 @@
   margin-top: 0;
 }
 
-.block-editor-block-alignment-matrix-control__popover .components-popover__content {
-  min-width: 0;
-  width: auto;
-}
-.block-editor-block-alignment-matrix-control__popover .components-popover__content > div {
-  padding: 8px;
-}
-
 .block-editor-block-icon {
   display: flex;
   align-items: center;
@@ -524,18 +516,8 @@
   }
 }
 
-.block-editor-block-list__block-popover-inserter {
-  position: absolute;
-  top: -9999em;
-  margin-bottom: 14px;
-}
-.block-editor-block-list__block-popover-inserter.is-visible {
-  position: static;
-}
-
 .block-editor-default-block-appender .block-editor-inserter__toggle.components-button.has-icon,
-.block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button.has-icon,
-.block-editor-block-list__block-popover-inserter .block-editor-inserter__toggle.components-button.has-icon {
+.block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button.has-icon {
   background: #1e1e1e;
   border-radius: 2px;
   color: #fff;
@@ -544,8 +526,7 @@
   height: 24px;
 }
 .block-editor-default-block-appender .block-editor-inserter__toggle.components-button.has-icon:hover,
-.block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button.has-icon:hover,
-.block-editor-block-list__block-popover-inserter .block-editor-inserter__toggle.components-button.has-icon:hover {
+.block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button.has-icon:hover {
   color: #fff;
   background: var(--wp-admin-theme-color);
 }
@@ -889,7 +870,7 @@
   margin: 0.67em 0;
 }
 
-.block-editor-block-content-overlay.overlay-active::before {
+.block-editor-block-content-overlay::before {
   content: "";
   position: absolute;
   top: 0;
@@ -901,16 +882,10 @@
   border-radius: 2px;
   z-index: 10;
 }
-.block-editor-block-content-overlay:hover:not(.is-dragging-blocks).overlay-active::before, .block-editor-block-content-overlay.parent-highlighted.overlay-active::before {
+.block-editor-block-content-overlay:hover:not(.is-dragging-blocks)::before {
   background: rgba(var(--wp-admin-theme-color--rgb), 0.1);
   box-shadow: 0 0 0 1px var(--wp-admin-theme-color) inset;
 }
-.block-editor-block-content-overlay.overlay-active:not(.is-dragging-blocks) * {
-  pointer-events: none;
-}
-.block-editor-block-content-overlay.is-dragging-blocks {
-  box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
-}
 
 .block-editor-block-draggable-chip-wrapper {
   position: absolute;
@@ -1094,6 +1069,7 @@
   width: max-content;
   background: none;
   border: none;
+  outline: none;
   box-shadow: none;
   overflow-y: visible;
   pointer-events: none;
@@ -1240,10 +1216,6 @@
   font-size: 14px;
 }
 
-.block-editor-block-switcher__popover {
-  margin-left: 6px;
-}
-
 .components-button.block-editor-block-switcher__no-switcher-icon {
   display: flex;
 }
@@ -1286,39 +1258,16 @@
   min-width: 300px;
 }
 
-.components-popover.block-editor-block-switcher__popover .components-popover__content > div {
-  min-width: auto;
-  display: flex;
-  background: #fff;
-  padding: 0;
-}
-.components-popover.block-editor-block-switcher__popover .components-popover__content > div .components-menu-group {
-  margin: 0;
-}
-
-.block-editor-block-switcher__popover .components-popover__content .block-editor-block-styles {
-  margin: 0 -3px;
-}
-.block-editor-block-switcher__popover .components-popover__content .components-panel__body {
-  border: 0;
-  position: relative;
-  z-index: 1;
-}
-.block-editor-block-switcher__popover .components-popover__content .components-panel__body + .components-panel__body {
-  border-top: 1px solid #e0e0e0;
-}
-
 .block-editor-block-switcher__popover__preview__parent .block-editor-block-switcher__popover__preview__container {
   position: absolute;
   top: -12px;
-  left: calc(100% + 32px);
+  left: calc(100% + 16px);
 }
 
 .block-editor-block-switcher__preview__popover {
   display: none;
 }
 .block-editor-block-switcher__preview__popover.components-popover {
-  margin-left: 4px;
   margin-top: 11px;
 }
 @media (min-width: 782px) {
@@ -1331,6 +1280,7 @@
   border: 1px solid #1e1e1e;
   background: #fff;
   border-radius: 2px;
+  outline: none;
 }
 .block-editor-block-switcher__preview__popover .block-editor-block-switcher__preview {
   width: 300px;
@@ -1631,7 +1581,7 @@
 .components-border-radius-control .components-border-radius-control__wrapper > .components-unit-control-wrapper {
   width: 110px;
   margin-bottom: 0;
-  margin-right: 8px;
+  margin-right: 12px;
   flex-shrink: 0;
 }
 .components-border-radius-control .components-border-radius-control__wrapper .components-range-control {
@@ -1653,7 +1603,7 @@
   width: 70%;
   flex-wrap: wrap;
 }
-.components-border-radius-control .components-border-radius-control__input-controls-wrapper .components-unit-control-wrapper {
+.components-border-radius-control .components-border-radius-control__input-controls-wrapper .components-border-radius-control__tooltip-wrapper {
   width: calc(50% - 8px);
   margin-bottom: 8px;
   margin-right: 8px;
@@ -1662,6 +1612,7 @@
   display: flex;
   justify-content: center;
   margin-left: 2px;
+  margin-top: 3px;
 }
 .components-border-radius-control .component-border-radius-control__linked-button.has-icon svg {
   margin-right: 0;
@@ -1736,21 +1687,10 @@
   width: 100%;
 }
 
-.block-editor-panel-color-gradient-settings__dropdown-content .components-popover__content > div {
+.block-editor-panel-color-gradient-settings__dropdown-content .components-popover__content {
   width: 280px;
 }
 
-@media (min-width: 782px) {
-  .block-editor-panel-color-gradient-settings__dropdown-content .components-popover__content {
-    margin-right: 156px !important;
-  }
-  .block-editor-panel-color-gradient-settings__dropdown-content.is-from-top .components-popover__content {
-    margin-top: -60px !important;
-  }
-  .block-editor-panel-color-gradient-settings__dropdown-content.is-from-bottom .components-popover__content {
-    margin-bottom: -60px !important;
-  }
-}
 .block-editor-panel-color-gradient-settings__dropdown:last-child > div {
   border-bottom-width: 0;
 }
@@ -1759,10 +1699,50 @@
   padding-top: 12px !important;
   padding-bottom: 12px !important;
 }
-.block-editor-panel-color-gradient-settings__item .block-editor-panel-color-gradient-settings__color-indicator {
+.block-editor-panel-color-gradient-settings__item.is-open {
+  background: #f0f0f0;
+  color: var(--wp-admin-theme-color);
+}
+
+.block-editor-panel-color-gradient-settings__color-indicator {
   background: linear-gradient(-45deg, transparent 48%, #ddd 48%, #ddd 52%, transparent 52%);
 }
-.block-editor-panel-color-gradient-settings__item.is-open {
+
+/**
+* The following styles replicate the separated border of the
+* `ItemGroup` component but allows for hidden items. This is because
+* to maintain the order of `ToolsPanel` controls, each `ToolsPanelItem`
+* must at least render a placeholder which would otherwise interfere
+* with the `:last-child` styles.
+*/
+.block-editor-tools-panel-color-gradient-settings__item {
+  padding: 0;
+  border-left: 1px solid rgba(0, 0, 0, 0.1);
+  border-right: 1px solid rgba(0, 0, 0, 0.1);
+  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
+}
+.block-editor-tools-panel-color-gradient-settings__item.first {
+  border-top-left-radius: 2px;
+  border-top-right-radius: 2px;
+  border-top: 1px solid rgba(0, 0, 0, 0.1);
+}
+.block-editor-tools-panel-color-gradient-settings__item.last {
+  border-bottom-left-radius: 2px;
+  border-bottom-right-radius: 2px;
+}
+.block-editor-tools-panel-color-gradient-settings__item > div,
+.block-editor-tools-panel-color-gradient-settings__item > div > button {
+  border-radius: inherit;
+}
+
+.block-editor-tools-panel-color-gradient-settings__dropdown {
+  display: block;
+  padding: 0;
+}
+.block-editor-tools-panel-color-gradient-settings__dropdown > button {
+  height: 46px;
+}
+.block-editor-tools-panel-color-gradient-settings__dropdown > button.is-open {
   background: #f0f0f0;
   color: var(--wp-admin-theme-color);
 }
@@ -1892,7 +1872,7 @@
   text-align: left;
 }
 
-.block-editor-duotone-control__popover > .components-popover__content > div {
+.block-editor-duotone-control__popover > .components-popover__content {
   padding: 16px;
   width: 280px;
 }
@@ -1914,10 +1894,6 @@
   font-size: 12px;
 }
 
-.block-editor-duotone-control__popover:not([data-y-axis=middle][data-x-axis=right]) > .components-popover__content {
-  margin-left: -14px;
-}
-
 .components-font-appearance-control {
   margin-bottom: 24px;
 }
@@ -2887,10 +2863,11 @@
   height: 1px;
 }
 
-.block-editor-list-view-drop-indicator:not([data-y-axis=middle][data-x-axis=right]) > .components-popover__content {
+.block-editor-list-view-drop-indicator > .components-popover__content {
   margin-left: 0;
   border: none;
   box-shadow: none;
+  outline: none;
 }
 
 .block-editor-list-view-placeholder {
@@ -3119,13 +3096,10 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
   min-width: auto;
   margin-bottom: 8px;
   box-shadow: none;
-  border: 1px solid #1e1e1e;
-  border-radius: 2px;
-  background-color: #fff;
+  outline: none;
 }
-.components-popover.block-editor-rich-text__inline-format-toolbar .components-toolbar-group,
 .components-popover.block-editor-rich-text__inline-format-toolbar .components-toolbar {
-  border: none;
+  border-radius: 2px;
 }
 .components-popover.block-editor-rich-text__inline-format-toolbar .components-toolbar__control,
 .components-popover.block-editor-rich-text__inline-format-toolbar .components-dropdown-menu__toggle {
@@ -3578,44 +3552,6 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
   grid-column: span 1;
 }
 
-.block-editor__border-box-control__popover .components-popover__content,
-.block-editor__border-box-control__popover-top .components-popover__content,
-.block-editor__border-box-control__popover-right .components-popover__content,
-.block-editor__border-box-control__popover-bottom .components-popover__content,
-.block-editor__border-box-control__popover-left .components-popover__content {
-  width: 282px;
-}
-
-@media (min-width: 782px) {
-  .block-editor__border-box-control__popover .components-popover__content,
-.block-editor__border-box-control__popover-left .components-popover__content {
-    margin-right: 52px !important;
-  }
-
-  .block-editor__border-box-control__popover-top .components-popover__content,
-.block-editor__border-box-control__popover-bottom .components-popover__content {
-    margin-right: 107px !important;
-  }
-
-  .block-editor__border-box-control__popover-right .components-popover__content {
-    margin-right: 162px !important;
-  }
-
-  .block-editor__border-box-control__popover.is-from-top .components-popover__content,
-.block-editor__border-box-control__popover-top.is-from-top .components-popover__content,
-.block-editor__border-box-control__popover-right.is-from-top .components-popover__content,
-.block-editor__border-box-control__popover-bottom.is-from-top .components-popover__content,
-.block-editor__border-box-control__popover-left.is-from-top .components-popover__content {
-    margin-top: -52px !important;
-  }
-  .block-editor__border-box-control__popover.is-from-bottom .components-popover__content,
-.block-editor__border-box-control__popover-top.is-from-bottom .components-popover__content,
-.block-editor__border-box-control__popover-right.is-from-bottom .components-popover__content,
-.block-editor__border-box-control__popover-bottom.is-from-bottom .components-popover__content,
-.block-editor__border-box-control__popover-left.is-from-bottom .components-popover__content {
-    margin-bottom: -52px !important;
-  }
-}
 .dimensions-block-support-panel .single-column {
   grid-column: span 1;
 }
@@ -3632,17 +3568,6 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
 
 .color-block-support-panel {
   /* Increased specificity required to remove the slot wrapper's row gap */
-  /**
-   * The following styles replicate the separated border of the
-   * `ItemGroup` component but allows for hidden items. This is because
-   * to maintain the order of `ToolsPanel` controls, each `ToolsPanelItem`
-   * must at least render a placeholder which would otherwise interfere
-   * with the `:last-child` styles.
-   */
-  /**
-   * The following few styles fix the layout and spacing for the due to the
-   * introduced wrapper element by the `Item` component.
-   */
 }
 .color-block-support-panel .block-editor-contrast-checker {
   /**
@@ -3660,43 +3585,6 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
 .color-block-support-panel.color-block-support-panel .color-block-support-panel__inner-wrapper {
   row-gap: 0;
 }
-.color-block-support-panel .block-editor-tools-panel-color-gradient-settings__item {
-  padding: 0;
-  border-left: 1px solid rgba(0, 0, 0, 0.1);
-  border-right: 1px solid rgba(0, 0, 0, 0.1);
-  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
-}
-.color-block-support-panel .block-editor-tools-panel-color-gradient-settings__item.first {
-  border-top-left-radius: 2px;
-  border-top-right-radius: 2px;
-  border-top: 1px solid rgba(0, 0, 0, 0.1);
-}
-.color-block-support-panel .block-editor-tools-panel-color-gradient-settings__item.last {
-  border-bottom-left-radius: 2px;
-  border-bottom-right-radius: 2px;
-}
-.color-block-support-panel .block-editor-tools-panel-color-gradient-settings__item > div,
-.color-block-support-panel .block-editor-tools-panel-color-gradient-settings__item > div > button {
-  border-radius: inherit;
-}
-.color-block-support-panel .block-editor-panel-color-gradient-settings__color-indicator {
-  background: linear-gradient(-45deg, transparent 48%, #ddd 48%, #ddd 52%, transparent 52%);
-}
-.color-block-support-panel .block-editor-tools-panel-color-dropdown {
-  display: block;
-  padding: 0;
-}
-.color-block-support-panel .block-editor-tools-panel-color-dropdown > button {
-  height: 46px;
-}
-.color-block-support-panel .block-editor-tools-panel-color-dropdown > button.is-open {
-  background: #f0f0f0;
-  color: var(--wp-admin-theme-color);
-}
-.color-block-support-panel .color-block-support-panel__item-group > div {
-  grid-column: span 2;
-  border-radius: inherit;
-}
 
 .block-editor__padding-visualizer {
   position: absolute;
@@ -3880,6 +3768,7 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
 
 .block-editor-inserter__popover.is-quick .components-popover__content {
   border: none;
+  outline: none;
 }
 .block-editor-inserter__popover.is-quick .components-popover__content .block-editor-inserter__quick-inserter > * {
   border-left: 1px solid #ccc;
@@ -4152,7 +4041,7 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
   border-top: 1px solid #ddd;
 }
 
-.block-editor-inserter__popover.is-quick > .components-popover__content > div {
+.block-editor-inserter__popover.is-quick > .components-popover__content {
   padding: 0;
 }
 
@@ -4236,9 +4125,6 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
   padding-left: 8px;
 }
 
-.block-editor-post-preview__dropdown-content .components-popover__content {
-  overflow-y: visible;
-}
 .block-editor-post-preview__dropdown-content.edit-post-post-preview-dropdown .components-menu-group:first-child {
   padding-bottom: 8px;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-editor",
-	"version": "9.0.0",
+	"version": "9.1.0",
 	"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.2.4",
-		"@wordpress/a11y": "^3.8.0",
-		"@wordpress/api-fetch": "^6.5.0",
-		"@wordpress/blob": "^3.8.0",
-		"@wordpress/blocks": "^11.7.0",
-		"@wordpress/components": "^19.10.0",
-		"@wordpress/compose": "^5.6.0",
-		"@wordpress/data": "^6.8.0",
-		"@wordpress/date": "^4.8.0",
-		"@wordpress/deprecated": "^3.8.0",
-		"@wordpress/dom": "^3.8.0",
-		"@wordpress/element": "^4.6.0",
-		"@wordpress/hooks": "^3.8.0",
-		"@wordpress/html-entities": "^3.8.0",
-		"@wordpress/i18n": "^4.8.0",
-		"@wordpress/icons": "^8.4.0",
-		"@wordpress/is-shallow-equal": "^4.8.0",
-		"@wordpress/keyboard-shortcuts": "^3.6.0",
-		"@wordpress/keycodes": "^3.8.0",
-		"@wordpress/notices": "^3.8.0",
-		"@wordpress/rich-text": "^5.6.0",
-		"@wordpress/shortcode": "^3.8.0",
-		"@wordpress/style-engine": "^0.7.0",
-		"@wordpress/token-list": "^2.8.0",
-		"@wordpress/url": "^3.9.0",
-		"@wordpress/warning": "^2.8.0",
-		"@wordpress/wordcount": "^3.8.0",
+		"@wordpress/a11y": "^3.9.0",
+		"@wordpress/api-fetch": "^6.6.0",
+		"@wordpress/blob": "^3.9.0",
+		"@wordpress/blocks": "^11.8.0",
+		"@wordpress/components": "^19.11.0",
+		"@wordpress/compose": "^5.7.0",
+		"@wordpress/data": "^6.9.0",
+		"@wordpress/date": "^4.9.0",
+		"@wordpress/deprecated": "^3.9.0",
+		"@wordpress/dom": "^3.9.0",
+		"@wordpress/element": "^4.7.0",
+		"@wordpress/hooks": "^3.9.0",
+		"@wordpress/html-entities": "^3.9.0",
+		"@wordpress/i18n": "^4.9.0",
+		"@wordpress/icons": "^9.0.0",
+		"@wordpress/is-shallow-equal": "^4.9.0",
+		"@wordpress/keyboard-shortcuts": "^3.7.0",
+		"@wordpress/keycodes": "^3.9.0",
+		"@wordpress/notices": "^3.9.0",
+		"@wordpress/rich-text": "^5.7.0",
+		"@wordpress/shortcode": "^3.9.0",
+		"@wordpress/style-engine": "^0.8.0",
+		"@wordpress/token-list": "^2.9.0",
+		"@wordpress/url": "^3.10.0",
+		"@wordpress/warning": "^2.9.0",
+		"@wordpress/wordcount": "^3.9.0",
 		"classnames": "^2.3.1",
 		"colord": "^2.7.0",
 		"diff": "^4.0.2",
@@ -77,5 +77,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "4631d515033397fcfeda77e5755960253caef9bf"
+	"gitHead": "198fa129cf1af8dc615918987ea6795cd40ab7df"
 }

package/src/components/block-alignment-matrix-control/index.js

@@ -22,15 +22,11 @@ function BlockAlignmentMatrixControl( props ) {
 	} = props;
 
 	const icon = <AlignmentMatrixControl.Icon value={ value } />;
-	const className = 'block-editor-block-alignment-matrix-control';
-	const popoverClassName = `${ className }__popover`;
-	const isAlternate = true;
 
 	return (
 		<Dropdown
 			position="bottom right"
-			className={ className }
-			popoverProps={ { className: popoverClassName, isAlternate } }
+			popoverProps={ { isAlternate: true } }
 			renderToggle={ ( { onToggle, isOpen } ) => {
 				const openOnArrowDown = ( event ) => {
 					if ( ! isOpen && event.keyCode === DOWN ) {

package/src/components/block-content-overlay/index.js

@@ -2,114 +2,27 @@
  * WordPress dependencies
  */
 import { useSelect } from '@wordpress/data';
-import { useState, useEffect } from '@wordpress/element';
 
 /**
  * Internal dependencies
  */
 import { store as blockEditorStore } from '../../store';
 
-/**
- * External dependencies
- */
-import classnames from 'classnames';
-
-export default function BlockContentOverlay( {
-	clientId,
-	tagName: TagName = 'div',
-	wrapperProps,
-	className,
-} ) {
-	const baseClassName = 'block-editor-block-content-overlay';
-	const [ isOverlayActive, setIsOverlayActive ] = useState( true );
-	const [ isHovered, setIsHovered ] = useState( false );
-
-	const {
-		canEdit,
-		isParentSelected,
-		hasChildSelected,
-		isDraggingBlocks,
-		isParentHighlighted,
-	} = useSelect(
+export default function useBlockOverlayActive( clientId ) {
+	return useSelect(
 		( select ) => {
 			const {
 				isBlockSelected,
 				hasSelectedInnerBlock,
-				isDraggingBlocks: _isDraggingBlocks,
-				isBlockHighlighted,
 				canEditBlock,
 			} = select( blockEditorStore );
-			return {
-				canEdit: canEditBlock( clientId ),
-				isParentSelected: isBlockSelected( clientId ),
-				hasChildSelected: hasSelectedInnerBlock( clientId, true ),
-				isDraggingBlocks: _isDraggingBlocks(),
-				isParentHighlighted: isBlockHighlighted( clientId ),
-			};
+
+			return (
+				! canEditBlock( clientId ) ||
+				( ! isBlockSelected( clientId ) &&
+					! hasSelectedInnerBlock( clientId, true ) )
+			);
 		},
 		[ clientId ]
 	);
-
-	const classes = classnames(
-		baseClassName,
-		wrapperProps?.className,
-		className,
-		{
-			'overlay-active': isOverlayActive,
-			'parent-highlighted': isParentHighlighted,
-			'is-dragging-blocks': isDraggingBlocks,
-		}
-	);
-
-	useEffect( () => {
-		// The overlay is always active when editing is locked.
-		if ( ! canEdit ) {
-			setIsOverlayActive( true );
-			return;
-		}
-
-		// Reenable when blocks are not in use.
-		if ( ! isParentSelected && ! hasChildSelected && ! isOverlayActive ) {
-			setIsOverlayActive( true );
-		}
-		// Disable if parent selected by another means (such as list view).
-		// We check hover to ensure the overlay click interaction is not taking place.
-		// Trying to click the overlay will select the parent block via its 'focusin'
-		// listener on the wrapper, so if the block is selected while hovered we will
-		// let the mouseup disable the overlay instead.
-		if ( isParentSelected && ! isHovered && isOverlayActive ) {
-			setIsOverlayActive( false );
-		}
-		// Ensure overlay is disabled if a child block is selected.
-		if ( hasChildSelected && isOverlayActive ) {
-			setIsOverlayActive( false );
-		}
-	}, [
-		isParentSelected,
-		hasChildSelected,
-		isOverlayActive,
-		isHovered,
-		canEdit,
-	] );
-
-	// Disabled because the overlay div doesn't actually have a role or functionality
-	// as far as the a11y is concerned. We're just catching the first click so that
-	// the block can be selected without interacting with its contents.
-	/* eslint-disable jsx-a11y/no-static-element-interactions */
-	return (
-		<TagName
-			{ ...wrapperProps }
-			className={ classes }
-			onMouseEnter={ () => setIsHovered( true ) }
-			onMouseLeave={ () => setIsHovered( false ) }
-			onMouseUp={
-				isOverlayActive && canEdit
-					? () => setIsOverlayActive( false )
-					: undefined
-			}
-		>
-			{ wrapperProps?.children }
-		</TagName>
-	);
 }
-/* eslint-enable jsx-a11y/no-static-element-interactions */

package/src/components/block-content-overlay/style.scss

@@ -1,5 +1,5 @@
 .block-editor-block-content-overlay {
-	&.overlay-active::before {
+	&::before {
 		content: "";
 		position: absolute;
 		top: 0;
@@ -12,17 +12,8 @@
 		z-index: z-index(".block-editor-block-content-overlay__overlay");
 	}
 
-	&:hover:not(.is-dragging-blocks).overlay-active::before,
-	&.parent-highlighted.overlay-active::before {
+	&:hover:not(.is-dragging-blocks)::before {
 		background: rgba(var(--wp-admin-theme-color--rgb), 0.1);
 		box-shadow: 0 0 0 $border-width var(--wp-admin-theme-color) inset;
 	}
-
-	&.overlay-active:not(.is-dragging-blocks) * {
-		pointer-events: none;
-	}
-
-	&.is-dragging-blocks {
-		box-shadow: 0 0 0 $border-width var(--wp-admin-theme-color);
-	}
 }