From 2d929a561ce1ed07cace20d7afdf30ebc04b4b89 Mon Sep 17 00:00:00 2001 From: tellthemachines Date: Thu, 30 Nov 2023 10:48:39 +1100 Subject: [PATCH 1/3] Fix input not showing when switching to "Fixed" width --- packages/block-editor/src/hooks/layout.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/block-editor/src/hooks/layout.js b/packages/block-editor/src/hooks/layout.js index 8120de137f9793..82d2b161100fdc 100644 --- a/packages/block-editor/src/hooks/layout.js +++ b/packages/block-editor/src/hooks/layout.js @@ -467,7 +467,8 @@ export const withChildLayoutStyles = createHigherOrderComponent( ( BlockListBlock ) => ( props ) => { const layout = props.attributes.style?.layout ?? {}; const { selfStretch, flexSize } = layout; - const hasChildLayout = selfStretch || flexSize; + const hasChildLayout = + selfStretch === 'fill' || ( selfStretch === 'fixed' && flexSize ); const shouldRenderChildLayoutStyles = useSelect( ( select ) => { From d0efda3df38110b283d7c1bf5ca345a3f78821fd Mon Sep 17 00:00:00 2001 From: tellthemachines Date: Thu, 30 Nov 2023 14:19:37 +1100 Subject: [PATCH 2/3] Always render BlockWithChildLayoutStyles --- packages/block-editor/src/hooks/layout.js | 22 ---------------------- 1 file changed, 22 deletions(-) diff --git a/packages/block-editor/src/hooks/layout.js b/packages/block-editor/src/hooks/layout.js index 82d2b161100fdc..fece8eb51c9437 100644 --- a/packages/block-editor/src/hooks/layout.js +++ b/packages/block-editor/src/hooks/layout.js @@ -465,28 +465,6 @@ function BlockWithChildLayoutStyles( { block: BlockListBlock, props } ) { */ export const withChildLayoutStyles = createHigherOrderComponent( ( BlockListBlock ) => ( props ) => { - const layout = props.attributes.style?.layout ?? {}; - const { selfStretch, flexSize } = layout; - const hasChildLayout = - selfStretch === 'fill' || ( selfStretch === 'fixed' && flexSize ); - - const shouldRenderChildLayoutStyles = useSelect( - ( select ) => { - // The callback returns early to avoid block editor subscription. - if ( ! hasChildLayout ) { - return false; - } - - return ! select( blockEditorStore ).getSettings() - .disableLayoutStyles; - }, - [ hasChildLayout ] - ); - - if ( ! shouldRenderChildLayoutStyles ) { - return ; - } - return ( Date: Thu, 30 Nov 2023 15:23:49 +1100 Subject: [PATCH 3/3] Render BlockWithChildLayoutStyles if layout is enabled --- packages/block-editor/src/hooks/layout.js | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/packages/block-editor/src/hooks/layout.js b/packages/block-editor/src/hooks/layout.js index fece8eb51c9437..9b35c3dcd6076b 100644 --- a/packages/block-editor/src/hooks/layout.js +++ b/packages/block-editor/src/hooks/layout.js @@ -465,6 +465,15 @@ function BlockWithChildLayoutStyles( { block: BlockListBlock, props } ) { */ export const withChildLayoutStyles = createHigherOrderComponent( ( BlockListBlock ) => ( props ) => { + const shouldRenderChildLayoutStyles = useSelect( ( select ) => { + return ! select( blockEditorStore ).getSettings() + .disableLayoutStyles; + } ); + + if ( ! shouldRenderChildLayoutStyles ) { + return ; + } + return (