Block Library: Avoid column auto-adjustment when width changes

WordPress · Jan 8, 2020 · 0048740 · 0048740
1 parent 5ee7986
commit 0048740
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 86 deletions.
diff --git a/packages/block-library/src/column/edit.js b/packages/block-library/src/column/edit.js
@@ -2,7 +2,6 @@
  * External dependencies
  */
 import classnames from 'classnames';
-import { forEach, find, difference } from 'lodash';
 
 /**
  * WordPress dependencies
@@ -18,22 +17,11 @@ import { withDispatch, withSelect } from '@wordpress/data';
 import { compose } from '@wordpress/compose';
 import { __ } from '@wordpress/i18n';
 
-/**
- * Internal dependencies
- */
-import {
-	toWidthPrecision,
-	getTotalColumnsWidth,
-	getColumnWidths,
-	getAdjacentBlocks,
-	getRedistributedColumnWidths,
-} from '../columns/utils';
-
 function ColumnEdit( {
 	attributes,
+	setAttributes,
 	className,
 	updateAlignment,
-	updateWidth,
 	hasChildBlocks,
 } ) {
 	const { verticalAlignment, width } = attributes;
@@ -59,7 +47,9 @@ function ColumnEdit( {
 					<RangeControl
 						label={ __( 'Percentage width' ) }
 						value={ width || '' }
-						onChange={ updateWidth }
+						onChange={ ( nextWidth ) => {
+							setAttributes( { width: nextWidth } );
+						} }
 						min={ 0 }
 						max={ 100 }
 						required
@@ -102,39 +92,6 @@ export default compose(
 				const rootClientId = getBlockRootClientId( clientId );
 				updateBlockAttributes( rootClientId, { verticalAlignment: null } );
 			},
-			updateWidth( width ) {
-				const { clientId } = ownProps;
-				const { updateBlockAttributes } = dispatch( 'core/block-editor' );
-				const { getBlockRootClientId, getBlocks } = registry.select( 'core/block-editor' );
-
-				// Constrain or expand siblings to account for gain or loss of
-				// total columns area.
-				const columns = getBlocks( getBlockRootClientId( clientId ) );
-				const adjacentColumns = getAdjacentBlocks( columns, clientId );
-
-				// The occupied width is calculated as the sum of the new width
-				// and the total width of blocks _not_ in the adjacent set.
-				const occupiedWidth = width + getTotalColumnsWidth(
-					difference( columns, [
-						find( columns, { clientId } ),
-						...adjacentColumns,
-					] )
-				);
-
-				// Compute _all_ next column widths, in case the updated column
-				// is in the middle of a set of columns which don't yet have
-				// any explicit widths assigned (include updates to those not
-				// part of the adjacent blocks).
-				const nextColumnWidths = {
-					...getColumnWidths( columns, columns.length ),
-					[ clientId ]: toWidthPrecision( width ),
-					...getRedistributedColumnWidths( adjacentColumns, 100 - occupiedWidth, columns.length ),
-				};
-
-				forEach( nextColumnWidths, ( nextColumnWidth, columnClientId ) => {
-					updateBlockAttributes( columnClientId, { width: nextColumnWidth } );
-				} );
-			},
 		};
 	} )
 )( ColumnEdit );
diff --git a/packages/block-library/src/columns/test/utils.js b/packages/block-library/src/columns/test/utils.js
@@ -3,7 +3,6 @@
  */
 import {
 	toWidthPrecision,
-	getAdjacentBlocks,
 	getEffectiveColumnWidth,
 	getTotalColumnsWidth,
 	getColumnWidths,
@@ -25,25 +24,6 @@ describe( 'toWidthPrecision', () => {
 	} );
 } );
 
-describe( 'getAdjacentBlocks', () => {
-	const blockA = { clientId: 'a' };
-	const blockB = { clientId: 'b' };
-	const blockC = { clientId: 'c' };
-	const blocks = [ blockA, blockB, blockC ];
-
-	it( 'should return blocks after clientId', () => {
-		const result = getAdjacentBlocks( blocks, 'b' );
-
-		expect( result ).toEqual( [ blockC ] );
-	} );
-
-	it( 'should return blocks before clientId if clientId is last', () => {
-		const result = getAdjacentBlocks( blocks, 'c' );
-
-		expect( result ).toEqual( [ blockA, blockB ] );
-	} );
-} );
-
 describe( 'getEffectiveColumnWidth', () => {
 	it( 'should return attribute value if set, rounded to precision', () => {
 		const block = { attributes: { width: 50.108 } };

diff --git a/packages/block-library/src/columns/utils.js b/packages/block-library/src/columns/utils.js
@@ -1,7 +1,7 @@
 /**
  * External dependencies
  */
-import { findIndex, sumBy, merge, mapValues } from 'lodash';
+import { sumBy, merge, mapValues } from 'lodash';
 
 /**
  * Returns a column width attribute value rounded to standard precision.
@@ -16,24 +16,6 @@ export const toWidthPrecision = ( value ) =>
 		parseFloat( value.toFixed( 2 ) ) :
 		undefined;
 
-/**
- * Returns the considered adjacent to that of the specified `clientId` for
- * resizing consideration. Adjacent blocks are those occurring after, except
- * when the given block is the last block in the set. For the last block, the
- * behavior is reversed.
- *
- * @param {WPBlock[]} blocks   Block objects.
- * @param {string}    clientId Client ID to consider for adjacent blocks.
- *
- * @return {WPBlock[]} Adjacent block objects.
- */
-export function getAdjacentBlocks( blocks, clientId ) {
-	const index = findIndex( blocks, { clientId } );
-	const isLastBlock = index === blocks.length - 1;
-
-	return isLastBlock ? blocks.slice( 0, index ) : blocks.slice( index + 1 );
-}
-
 /**
  * Returns an effective width for a given block. An effective width is equal to
  * its attribute value if set, or a computed value assuming equal distribution.