From ee0bdf50a0e2c94e0f589cda1c67d2131c8eb0de Mon Sep 17 00:00:00 2001
From: ramon <ramonjd@gmail.com>
Date: Fri, 12 Apr 2024 14:39:08 +1000
Subject: [PATCH] the background size panel displays by default in the site
 editor for top-level styles, but only when there's an image available. Using
 constant for "image"

---
 .../src/components/global-styles/background-panel.js  | 11 +++++------
 .../src/components/global-styles/background-panel.js  |  8 ++++++++
 2 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/packages/block-editor/src/components/global-styles/background-panel.js b/packages/block-editor/src/components/global-styles/background-panel.js
index 284404fcd4e31..954e87cc4ecd3 100644
--- a/packages/block-editor/src/components/global-styles/background-panel.js
+++ b/packages/block-editor/src/components/global-styles/background-panel.js
@@ -40,6 +40,10 @@ import MediaReplaceFlow from '../media-replace-flow';
 import { store as blockEditorStore } from '../../store';
 
 const IMAGE_BACKGROUND_TYPE = 'image';
+const DEFAULT_CONTROLS = {
+	backgroundImage: true,
+	backgroundSize: false,
+};
 
 /**
  * Checks site settings to see if the background panel may be used.
@@ -248,7 +252,7 @@ function BackgroundImageToolsPanelItem( {
 
 	const onFilesDrop = ( filesList ) => {
 		mediaUpload( {
-			allowedTypes: [ 'image' ],
+			allowedTypes: [ IMAGE_BACKGROUND_TYPE ],
 			filesList,
 			onFileChange( [ image ] ) {
 				if ( isBlobURL( image?.url ) ) {
@@ -540,11 +544,6 @@ function BackgroundToolsPanel( {
 	);
 }
 
-const DEFAULT_CONTROLS = {
-	backgroundImage: true,
-	backgroundSize: false,
-};
-
 export default function BackgroundPanel( {
 	as: Wrapper = BackgroundToolsPanel,
 	value,
diff --git a/packages/edit-site/src/components/global-styles/background-panel.js b/packages/edit-site/src/components/global-styles/background-panel.js
index ec15aca790e03..2addf109873aa 100644
--- a/packages/edit-site/src/components/global-styles/background-panel.js
+++ b/packages/edit-site/src/components/global-styles/background-panel.js
@@ -29,6 +29,13 @@ export default function BackgroundPanel() {
 	} );
 	const [ settings ] = useGlobalSetting( '' );
 
+	const defaultControls = {
+		backgroundImage: true,
+		backgroundSize:
+			!! style?.background?.backgroundImage &&
+			!! inheritedStyle?.background?.backgroundImage,
+	};
+
 	return (
 		<StylesBackgroundPanel
 			inheritedValue={ inheritedStyle }
@@ -37,6 +44,7 @@ export default function BackgroundPanel() {
 			settings={ settings }
 			headerLabel={ __( 'Image' ) }
 			defaultValues={ BACKGROUND_DEFAULT_VALUES }
+			defaultControls={ defaultControls }
 		/>
 	);
 }