From 69bf71eefcaef47f3414e215bfd782e146b8ccc8 Mon Sep 17 00:00:00 2001
From: Lena Morita <lena@jaguchi.com>
Date: Wed, 3 Jan 2024 00:16:09 +0900
Subject: [PATCH 1/2] DuotonePicker: Fix top margin when no duotone options

---
 .../components/src/duotone-picker/duotone-picker.tsx   | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/packages/components/src/duotone-picker/duotone-picker.tsx b/packages/components/src/duotone-picker/duotone-picker.tsx
index 759c517b4759e..ee54c9cdf4235 100644
--- a/packages/components/src/duotone-picker/duotone-picker.tsx
+++ b/packages/components/src/duotone-picker/duotone-picker.tsx
@@ -91,7 +91,7 @@ function DuotonePicker( {
 		/>
 	);
 
-	const options = duotonePalette.map( ( { colors, slug, name } ) => {
+	const duotoneOptions = duotonePalette.map( ( { colors, slug, name } ) => {
 		const style = {
 			background: getGradientFromCSSColors( colors, '135deg' ),
 			color: 'transparent',
@@ -155,11 +155,15 @@ function DuotonePicker( {
 		}
 	}
 
+	const options = unsetable
+		? [ unsetOption, ...duotoneOptions ]
+		: duotoneOptions;
+
 	return (
 		<CircularOptionPicker
 			{ ...otherProps }
 			{ ...metaProps }
-			options={ unsetable ? [ unsetOption, ...options ] : options }
+			options={ options }
 			actions={
 				!! clearable && (
 					<CircularOptionPicker.ButtonAction
@@ -170,7 +174,7 @@ function DuotonePicker( {
 				)
 			}
 		>
-			<Spacer paddingTop={ 4 }>
+			<Spacer paddingTop={ options.length === 0 ? 0 : 4 }>
 				<VStack spacing={ 3 }>
 					{ ! disableCustomColors && ! disableCustomDuotone && (
 						<CustomDuotoneBar

From 612d97091478ec8c853fa4dc4eb31e395bf319d6 Mon Sep 17 00:00:00 2001
From: Lena Morita <lena@jaguchi.com>
Date: Wed, 3 Jan 2024 00:25:14 +0900
Subject: [PATCH 2/2] Update changelog

---
 packages/components/CHANGELOG.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md
index 3e3a29728490b..e5c7da789f810 100644
--- a/packages/components/CHANGELOG.md
+++ b/packages/components/CHANGELOG.md
@@ -16,6 +16,7 @@
 -   `Truncate`: improve handling of non-string `children` ([#57261](https://github.com/WordPress/gutenberg/pull/57261)).
 -   `PaletteEdit`: Don't discard colors with default name and slug ([#54332](https://github.com/WordPress/gutenberg/pull/54332)).
 -   `RadioControl`: Fully encapsulate styles ([#57347](https://github.com/WordPress/gutenberg/pull/57347)).
+-   `DuotonePicker`: Remove top margin when no duotone options ([#57489](https://github.com/WordPress/gutenberg/pull/57489)).
 -   `GradientPicker`: Use slug while iterating over gradient entries to avoid React "duplicated key" warning ([#57361](https://github.com/WordPress/gutenberg/pull/57361)).
 
 ### Enhancements