Move min height into the dimensions block support panel

WordPress · Aug 13, 2021 · ff6ca6f · ff6ca6f
1 parent ab8a037
commit ff6ca6f
Showing 1 changed file with 31 additions and 14 deletions.
diff --git a/packages/block-library/src/cover/edit.js b/packages/block-library/src/cover/edit.js
@@ -22,11 +22,13 @@ import {
 	withNotices,
 	__experimentalUseCustomUnits as useCustomUnits,
 	__experimentalBoxControl as BoxControl,
+	__experimentalToolsPanelItem as ToolsPanelItem,
 } from '@wordpress/components';
 import { compose, withInstanceId, useInstanceId } from '@wordpress/compose';
 import {
 	BlockControls,
 	BlockIcon,
+	DimensionControls,
 	InspectorControls,
 	MediaPlaceholder,
 	MediaReplaceFlow,
@@ -512,20 +514,6 @@ function CoverEdit( {
 						</PanelRow>
 					</PanelBody>
 				) }
-				<PanelBody title={ __( 'Dimensions' ) }>
-					<CoverHeightInput
-						value={ temporaryMinHeight || minHeight }
-						unit={ minHeightUnit }
-						onChange={ ( newMinHeight ) =>
-							setAttributes( { minHeight: newMinHeight } )
-						}
-						onUnitChange={ ( nextUnit ) =>
-							setAttributes( {
-								minHeightUnit: nextUnit,
-							} )
-						}
-					/>
-				</PanelBody>
 				<PanelColorGradientSettings
 					title={ __( 'Overlay' ) }
 					initialOpen={ true }
@@ -556,6 +544,35 @@ function CoverEdit( {
 					) }
 				</PanelColorGradientSettings>
 			</InspectorControls>
+			<DimensionControls>
+				<ToolsPanelItem
+					hasValue={ () => !! minHeight }
+					label={ __( 'Minimum height' ) }
+					onDeselect={ () =>
+						setAttributes( { minHeight: undefined } )
+					}
+					resetAllFilter={ ( newAttributes ) => {
+						return {
+							...newAttributes,
+							minHeight: undefined,
+						};
+					} }
+					isShownByDefault={ true }
+				>
+					<CoverHeightInput
+						value={ temporaryMinHeight || minHeight }
+						unit={ minHeightUnit }
+						onChange={ ( newMinHeight ) =>
+							setAttributes( { minHeight: newMinHeight } )
+						}
+						onUnitChange={ ( nextUnit ) =>
+							setAttributes( {
+								minHeightUnit: nextUnit,
+							} )
+						}
+					/>
+				</ToolsPanelItem>
+			</DimensionControls>
 		</>
 	);