From 0048740d386725b319f8aa27bb9ff0f49bc9f195 Mon Sep 17 00:00:00 2001 From: Andrew Duthie Date: Wed, 8 Jan 2020 15:16:03 -0500 Subject: [PATCH] Block Library: Avoid column auto-adjustment when width changes --- packages/block-library/src/column/edit.js | 51 ++----------------- .../block-library/src/columns/test/utils.js | 20 -------- packages/block-library/src/columns/utils.js | 20 +------- 3 files changed, 5 insertions(+), 86 deletions(-) diff --git a/packages/block-library/src/column/edit.js b/packages/block-library/src/column/edit.js index 72f359f33da599..a1775e88b350e4 100644 --- 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( { { + 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 index 67ef6dd0332727..a4d95fa4492e43 100644 --- 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 index 61b423f8ca761e..db1c2a17fe9872 100644 --- 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.