From f3b4abe280ee1bed16fc3ead19be67c3a677a6fd Mon Sep 17 00:00:00 2001
From: Riad Benguella <benguella@gmail.com>
Date: Wed, 4 Dec 2024 11:26:42 +0100
Subject: [PATCH] Fix no presets case

---
 .../single-input-control.js                   | 102 +++++++++---------
 1 file changed, 51 insertions(+), 51 deletions(-)

diff --git a/packages/block-editor/src/components/border-radius-control/single-input-control.js b/packages/block-editor/src/components/border-radius-control/single-input-control.js
index c9f1647945d21b..7d2c55f4d2d05a 100644
--- a/packages/block-editor/src/components/border-radius-control/single-input-control.js
+++ b/packages/block-editor/src/components/border-radius-control/single-input-control.js
@@ -151,42 +151,40 @@ export default function SingleInputControl( {
 	// https://github.com/WordPress/gutenberg/pull/24966#issuecomment-685875026
 	return (
 		<HStack>
-			{ ! hasPresets ||
-				( showCustomValueControl && (
-					<div className="components-border-radius-control__input-controls-wrapper">
-						<Tooltip text={ CORNERS[ corner ] } placement="top">
-							<div className="components-border-radius-control__tooltip-wrapper">
-								<UnitControl
-									className="components-border-radius-control__unit-control"
-									aria-label={ CORNERS[ corner ] }
-									value={ [
-										parsedQuantity,
-										computedUnit,
-									].join( '' ) }
-									onChange={ onChangeValue }
-									onUnitChange={ onChangeUnit }
-									size="__unstable-large"
-									min={ MIN_BORDER_RADIUS_VALUE }
-									units={ units }
-								/>
-							</div>
-						</Tooltip>
-						<RangeControl
-							__next40pxDefaultSize
-							label={ __( 'Border radius' ) }
-							hideLabelFromVision
-							className="components-border-radius-control__range-control"
-							value={ parsedQuantity ?? '' }
-							min={ MIN_BORDER_RADIUS_VALUE }
-							max={ MAX_BORDER_RADIUS_VALUES[ computedUnit ] }
-							initialPosition={ 0 }
-							withInputField={ false }
-							onChange={ handleSliderChange }
-							step={ step }
-							__nextHasNoMarginBottom
-						/>
-					</div>
-				) ) }
+			{ ( ! hasPresets || showCustomValueControl ) && (
+				<div className="components-border-radius-control__input-controls-wrapper">
+					<Tooltip text={ CORNERS[ corner ] } placement="top">
+						<div className="components-border-radius-control__tooltip-wrapper">
+							<UnitControl
+								className="components-border-radius-control__unit-control"
+								aria-label={ CORNERS[ corner ] }
+								value={ [ parsedQuantity, computedUnit ].join(
+									''
+								) }
+								onChange={ onChangeValue }
+								onUnitChange={ onChangeUnit }
+								size="__unstable-large"
+								min={ MIN_BORDER_RADIUS_VALUE }
+								units={ units }
+							/>
+						</div>
+					</Tooltip>
+					<RangeControl
+						__next40pxDefaultSize
+						label={ __( 'Border radius' ) }
+						hideLabelFromVision
+						className="components-border-radius-control__range-control"
+						value={ parsedQuantity ?? '' }
+						min={ MIN_BORDER_RADIUS_VALUE }
+						max={ MAX_BORDER_RADIUS_VALUES[ computedUnit ] }
+						initialPosition={ 0 }
+						withInputField={ false }
+						onChange={ handleSliderChange }
+						step={ step }
+						__nextHasNoMarginBottom
+					/>
+				</div>
+			) }
 			{ hasPresets && showRangeControl && ! showCustomValueControl && (
 				<RangeControl
 					__next40pxDefaultSize
@@ -259,21 +257,23 @@ export default function SingleInputControl( {
 					onBlur={ onMouseOut }*/
 				/>
 			) }
-			<Button
-				label={
-					showCustomValueControl
-						? __( 'Use border radius preset' )
-						: __( 'Set custom border radius' )
-				}
-				icon={ settings }
-				onClick={ () => {
-					setShowCustomValueControl( ! showCustomValueControl );
-				} }
-				isPressed={ showCustomValueControl }
-				size="small"
-				className="components-border-radius-control__custom-toggle"
-				iconSize={ 24 }
-			/>
+			{ hasPresets && (
+				<Button
+					label={
+						showCustomValueControl
+							? __( 'Use border radius preset' )
+							: __( 'Set custom border radius' )
+					}
+					icon={ settings }
+					onClick={ () => {
+						setShowCustomValueControl( ! showCustomValueControl );
+					} }
+					isPressed={ showCustomValueControl }
+					size="small"
+					className="components-border-radius-control__custom-toggle"
+					iconSize={ 24 }
+				/>
+			) }
 		</HStack>
 	);
 }