@wordpress/block-editor 9.7.1-next.d6164808d3.0 → 10.0.0

package/src/store/selectors.js

@@ -1,17 +1,7 @@
 /**
  * External dependencies
  */
-import {
-	castArray,
-	first,
-	last,
-	map,
-	reduce,
-	some,
-	find,
-	filter,
-	orderBy,
-} from 'lodash';
+import { castArray, map, reduce, some, find, filter, orderBy } from 'lodash';
 import createSelector from 'rememo';
 
 /**
@@ -798,7 +788,7 @@ export const getMultiSelectedBlocks = createSelector(
  * @return {?string} First block client ID in the multi-selection set.
  */
 export function getFirstMultiSelectedBlockClientId( state ) {
-	return first( getMultiSelectedBlockClientIds( state ) ) || null;
+	return getMultiSelectedBlockClientIds( state )[ 0 ] || null;
 }
 
 /**
@@ -810,7 +800,8 @@ export function getFirstMultiSelectedBlockClientId( state ) {
  * @return {?string} Last block client ID in the multi-selection set.
  */
 export function getLastMultiSelectedBlockClientId( state ) {
-	return last( getMultiSelectedBlockClientIds( state ) ) || null;
+	const selectedClientIds = getMultiSelectedBlockClientIds( state );
+	return selectedClientIds[ selectedClientIds.length - 1 ] || null;
 }
 
 /**
@@ -948,6 +939,14 @@ export function __unstableIsSelectionCollapsed( state ) {
 	);
 }
 
+export function __unstableSelectionHasUnmergeableBlock( state ) {
+	return getSelectedBlockClientIds( state ).some( ( clientId ) => {
+		const blockName = getBlockName( state, clientId );
+		const blockType = getBlockType( blockName );
+		return ! blockType.merge;
+	} );
+}
+
 /**
  * Check whether the selection is mergeable.
  *
@@ -1009,19 +1008,19 @@ export function __unstableIsSelectionMergeable( state, isForward ) {
 		? selectionStart.clientId
 		: selectionEnd.clientId;
 
-	const targetBlock = getBlock( state, targetBlockClientId );
-	const targetBlockType = getBlockType( targetBlock.name );
+	const targetBlockName = getBlockName( state, targetBlockClientId );
+	const targetBlockType = getBlockType( targetBlockName );
 
 	if ( ! targetBlockType.merge ) return false;
 
 	const blockToMerge = getBlock( state, blockToMergeClientId );
 
 	// It's mergeable if the blocks are of the same type.
-	if ( blockToMerge.name === targetBlock.name ) return true;
+	if ( blockToMerge.name === targetBlockName ) return true;
 
 	// If the blocks are of a different type, try to transform the block being
 	// merged into the same type of block.
-	const blocksToMerge = switchToBlockType( blockToMerge, targetBlock.name );
+	const blocksToMerge = switchToBlockType( blockToMerge, targetBlockName );
 
 	return blocksToMerge && blocksToMerge.length;
 }
@@ -2542,7 +2541,18 @@ function getReusableBlocks( state ) {
  * @return {boolean} Is navigation mode enabled.
  */
 export function isNavigationMode( state ) {
-	return state.isNavigationMode;
+	return state.editorMode === 'navigation';
+}
+
+/**
+ * Returns the current editor mode.
+ *
+ * @param {Object} state Editor state.
+ *
+ * @return {string} the editor mode.
+ */
+export function __unstableGetEditorMode( state ) {
+	return state.editorMode;
 }
 
 /**
@@ -2625,7 +2635,7 @@ export const __experimentalGetActiveBlockIdByBlockNames = createSelector(
 		);
 		if ( entityAreaParents ) {
 			// Last parent closest/most interior.
-			return last( entityAreaParents );
+			return entityAreaParents[ entityAreaParents.length - 1 ];
 		}
 		return null;
 	},
@@ -2679,3 +2689,72 @@ export const __unstableGetVisibleBlocks = createSelector(
 	},
 	( state ) => [ state.blocks.visibility ]
 );
+
+export const __unstableGetContentLockingParent = createSelector(
+	( state, clientId ) => {
+		let current = clientId;
+		let result;
+		while ( !! state.blocks.parents[ current ] ) {
+			current = state.blocks.parents[ current ];
+			if ( getTemplateLock( state, current ) === 'noContent' ) {
+				result = current;
+			}
+		}
+		return result;
+	},
+	( state ) => [ state.blocks.parents, state.blockListSettings ]
+);
+
+export function __unstableGetTemporarilyEditingAsBlocks( state ) {
+	return state.temporarilyEditingAsBlocks;
+}
+
+export function __unstableHasActiveBlockOverlayActive( state, clientId ) {
+	// If the block editing is locked, the block overlay is always active.
+	if ( ! canEditBlock( state, clientId ) ) {
+		return true;
+	}
+
+	const editorMode = __unstableGetEditorMode( state );
+
+	// In zoom-out mode, the block overlay is always active for top level blocks.
+	if (
+		editorMode === 'zoom-out' &&
+		! getBlockRootClientId( state, clientId )
+	) {
+		return true;
+	}
+
+	// In navigation mode, the block overlay is active when the block is not
+	// selected (and doesn't contain a selected child). The same behavior is
+	// also enabled in all modes for blocks that have controlled children
+	// (reusable block, template part, navigation), unless explicitly disabled
+	// with `supports.__experimentalDisableBlockOverlay`.
+	const blockSupportDisable = hasBlockSupport(
+		getBlockName( state, clientId ),
+		'__experimentalDisableBlockOverlay',
+		false
+	);
+	const shouldEnableIfUnselected =
+		editorMode === 'navigation' ||
+		( blockSupportDisable
+			? false
+			: areInnerBlocksControlled( state, clientId ) );
+
+	return (
+		shouldEnableIfUnselected &&
+		! isBlockSelected( state, clientId ) &&
+		! hasSelectedInnerBlock( state, clientId, true )
+	);
+}
+
+export function __unstableIsWithinBlockOverlay( state, clientId ) {
+	let parent = state.blocks.parents[ clientId ];
+	while ( !! parent ) {
+		if ( __unstableHasActiveBlockOverlayActive( state, parent ) ) {
+			return true;
+		}
+		parent = state.blocks.parents[ parent ];
+	}
+	return false;
+}

package/src/store/test/reducer.js

@@ -1,7 +1,6 @@
 /**
  * External dependencies
  */
-import { omit } from 'lodash';
 import deepFreeze from 'deep-freeze';
 
 /**
@@ -260,7 +259,8 @@ describe( 'state', () => {
 
 				const state = blocks( existingState, action );
 
-				expect( omit( state, [ 'tree' ] ) ).toEqual( {
+				const { tree, ...restState } = state;
+				expect( restState ).toEqual( {
 					isPersistentChange: true,
 					isIgnoredChange: false,
 					byClientId: {
@@ -342,7 +342,8 @@ describe( 'state', () => {
 
 				const state = blocks( existingState, action );
 
-				expect( omit( state, [ 'tree' ] ) ).toEqual( {
+				const { tree, ...restState } = state;
+				expect( restState ).toEqual( {
 					isPersistentChange: true,
 					isIgnoredChange: false,
 					byClientId: {
@@ -466,7 +467,8 @@ describe( 'state', () => {
 
 				const state = blocks( existingState, action );
 
-				expect( omit( state, [ 'tree' ] ) ).toEqual( {
+				const { tree, ...restState } = state;
+				expect( restState ).toEqual( {
 					isPersistentChange: true,
 					isIgnoredChange: false,
 					byClientId: {
@@ -603,7 +605,8 @@ describe( 'state', () => {
 
 				const state = blocks( existingState, action );
 
-				expect( omit( state, [ 'tree' ] ) ).toEqual( {
+				const { tree, ...restState } = state;
+				expect( restState ).toEqual( {
 					isPersistentChange: true,
 					isIgnoredChange: false,
 					byClientId: {

package/src/style.scss

@@ -46,8 +46,6 @@
 @import "./components/responsive-block-control/style.scss";
 @import "./components/rich-text/style.scss";
 @import "./components/skip-to-selected-block/style.scss";
-@import "./components/text-transform-control/style.scss";
-@import "./components/text-decoration-control/style.scss";
 @import "./components/tool-selector/style.scss";
 @import "./components/url-input/style.scss";
 @import "./components/url-popover/style.scss";

package/src/utils/parse-css-unit-to-px.js

@@ -221,7 +221,7 @@ export function getPxFromCssUnit( cssUnit, options = {} ) {
 	let parsedUnit = parseUnit( cssUnit );
 
 	if ( ! parsedUnit.unit ) {
-		parsedUnit = parseUnitFunction( cssUnit, options );
+		parsedUnit = parseUnitFunction( cssUnit );
 	}
 
 	if ( isMathExpression( cssUnit ) && ! parsedUnit.unit ) {

package/src/components/colors/test/__snapshots__/with-colors.js.snap

@@ -1,23 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`createCustomColorsHOC provides the wrapped component with color values and setter functions as props 1`] = `
-<Component
-  attributes={
-    Object {
-      "backgroundColor": null,
-    }
-  }
-  backgroundColor={
-    Object {
-      "class": undefined,
-      "color": undefined,
-    }
-  }
-  colorUtils={
-    Object {
-      "getMostReadableColor": [Function],
-    }
-  }
-  setBackgroundColor={[Function]}
-/>
-`;

package/src/components/text-decoration-control/style.scss

@@ -1,18 +0,0 @@
-.block-editor-text-decoration-control {
-	flex: 0 0 50%;
-
-	legend {
-		margin-bottom: 8px;
-	}
-
-	.block-editor-text-decoration-control__buttons {
-		display: inline-flex;
-		margin-bottom: 24px;
-
-		.components-button.has-icon {
-			min-width: 24px;
-			padding: 0;
-			margin-right: 4px;
-		}
-	}
-}

package/src/components/text-transform-control/style.scss

@@ -1,18 +0,0 @@
-.block-editor-text-transform-control {
-	flex: 0 0 50%;
-
-	legend {
-		margin-bottom: 8px;
-	}
-
-	.block-editor-text-transform-control__buttons {
-		display: inline-flex;
-		margin-bottom: 24px;
-
-		.components-button.has-icon {
-			min-width: 24px;
-			padding: 0;
-			margin-right: 4px;
-		}
-	}
-}