Fix labelling for all or fudged sides

WordPress · May 29, 2023 · 34c172e · 34c172e
1 parent d6eb624
commit 34c172e
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 5 deletions.
diff --git a/packages/block-editor/src/components/spacing-sizes-control/index.js b/packages/block-editor/src/components/spacing-sizes-control/index.js
@@ -71,7 +71,13 @@ export default function SpacingSizesControl( {
 		if ( view === VIEWS.custom ) {
 			return <SeparatedInputControls { ...inputControlProps } />;
 		}
-		return <SingleInputControl side={ view } { ...inputControlProps } />;
+		return (
+			<SingleInputControl
+				side={ view }
+				{ ...inputControlProps }
+				showSideInLabel={ showSideInLabel }
+			/>
+		);
 	};
 
 	const sideLabel =
@@ -82,7 +88,7 @@ export default function SpacingSizesControl( {
 		__( '%1$s %2$s' ),
 		labelProp,
 		sideLabel
-	);
+	).trim();
 
 	const dropdownLabelText = sprintf(
 		// translators: %s: The current spacing property e.g. "Padding", "Margin".

diff --git a/packages/block-editor/src/components/spacing-sizes-control/input-controls/single.js b/packages/block-editor/src/components/spacing-sizes-control/input-controls/single.js
@@ -9,6 +9,7 @@ export default function SingleInputControl( {
 	onChange,
 	onMouseOut,
 	onMouseOver,
+	showSideInLabel,
 	side,
 	spacingSizes,
 	type,
@@ -28,6 +29,7 @@ export default function SingleInputControl( {
 			onChange={ createHandleOnChange( side ) }
 			onMouseOut={ onMouseOut }
 			onMouseOver={ onMouseOver }
+			showSideInLabel={ showSideInLabel }
 			side={ side }
 			spacingSizes={ spacingSizes }
 			type={ type }

diff --git a/...block-editor/src/components/spacing-sizes-control/input-controls/spacing-input-control.js b/...block-editor/src/components/spacing-sizes-control/input-controls/spacing-input-control.js
@@ -23,6 +23,7 @@ import { settings } from '@wordpress/icons';
 import useSetting from '../../use-setting';
 import { store as blockEditorStore } from '../../../store';
 import {
+	ALL_SIDES,
 	LABELS,
 	getSliderValueFromPreset,
 	getCustomValueFromPreset,
@@ -46,6 +47,7 @@ export default function SpacingInputControl( {
 	onChange,
 	onMouseOut,
 	onMouseOver,
+	showSideInLabel = true,
 	side,
 	spacingSizes,
 	type,
@@ -165,12 +167,16 @@ export default function SpacingInputControl( {
 		label: undefined,
 	} ) );
 
+	const sideLabel =
+		ALL_SIDES.includes( side ) && showSideInLabel ? LABELS[ side ] : '';
+	const typeLabel = showSideInLabel ? type?.toLowerCase() : type;
+
 	const ariaLabel = sprintf(
 		// translators: 1: The side of the block being modified (top, bottom, left, All sides etc.). 2. Type of spacing being modified (Padding, margin, etc)
 		__( '%1$s %2$s' ),
-		LABELS[ side ],
-		type?.toLowerCase()
-	);
+		sideLabel,
+		typeLabel
+	).trim();
 
 	return (
 		<HStack className="spacing-sizes-control__wrapper">

diff --git a/packages/block-library/src/spacer/controls.js b/packages/block-library/src/spacer/controls.js
@@ -81,6 +81,7 @@ function DimensionInput( { label, onChange, isResizing, value = '' } ) {
 						units={ units }
 						allowReset={ false }
 						splitOnAxis={ false }
+						showSideInLabel={ false }
 					/>
 				</View>
 			) }