From 99a40395a4054a7d65ae680376baa1c8aee2dbdd Mon Sep 17 00:00:00 2001
From: R A Van Epps <rave@ravanepps.com>
Date: Tue, 8 Jun 2021 14:48:03 -0600
Subject: [PATCH 1/2] Add background gradient support

---
 themes/wds_headless/js/blocks.js | 28 ++++++++++++++++++++++++++--
 1 file changed, 26 insertions(+), 2 deletions(-)

diff --git a/themes/wds_headless/js/blocks.js b/themes/wds_headless/js/blocks.js
index ff51ea5f..3502b763 100644
--- a/themes/wds_headless/js/blocks.js
+++ b/themes/wds_headless/js/blocks.js
@@ -1,4 +1,4 @@
-const { validateThemeColors } = wp.blockEditor;
+const { validateThemeColors, validateThemeGradients } = wp.blockEditor;
 const { useEffect } = wp.element;
 const { addFilter, applyFilters } = wp.hooks;
 
@@ -41,6 +41,14 @@ function wdsAddColorPaletteHexValues(settings) {
 		};
 	}
 
+	// Add gradient background hex attribute.
+	if (settings.attributes.hasOwnProperty("gradient")) {
+		settings.attributes.gradientHex = {
+			type: "string",
+			default: "",
+		};
+	}
+
 	// Add main color hex attribute.
 	if (settings.attributes.hasOwnProperty("mainColor")) {
 		settings.attributes.mainColorHex = {
@@ -61,7 +69,7 @@ function wdsAddColorPaletteHexValues(settings) {
 		...settings,
 		edit(props) {
 			const {
-				attributes: { backgroundColor, mainColor, textColor },
+				attributes: { backgroundColor, gradient, mainColor, textColor },
 			} = props;
 
 			useEffect(() => {
@@ -69,6 +77,8 @@ function wdsAddColorPaletteHexValues(settings) {
 				// In that case, this filter may need to be customized.
 				const defaultColors = validateThemeColors();
 
+				const defaultGradients = validateThemeGradients();
+
 				// Check for presence of background color attr.
 				if (backgroundColor) {
 					// Get color object by slug.
@@ -83,6 +93,20 @@ function wdsAddColorPaletteHexValues(settings) {
 					delete props.attributes.backgroundColorHex;
 				}
 
+				// Check for presence of gradient color attr.
+				if (gradient) {
+					// Get color object by slug.
+					const gradientObj = defaultGradients.filter(
+						(color) => color.slug === gradient
+					);
+
+					// Retrieve color hex value.
+					props.attributes.gradientHex =
+						gradientObj?.[0]?.gradient || null;
+				} else {
+					delete props.attributes.gradientHex;
+				}
+
 				// Check for presence of main color attr.
 				if (mainColor) {
 					// Get color object by slug.

From 0353111311cc0f8cead4fc6cbca9a1976fe010ea Mon Sep 17 00:00:00 2001
From: R A Van Epps <rave@ravanepps.com>
Date: Thu, 10 Jun 2021 10:20:46 -0600
Subject: [PATCH 2/2] Remove gradient override

---
 themes/wds_headless/functions.php | 3 ---
 1 file changed, 3 deletions(-)

diff --git a/themes/wds_headless/functions.php b/themes/wds_headless/functions.php
index 00bea4dd..aa3e04e0 100644
--- a/themes/wds_headless/functions.php
+++ b/themes/wds_headless/functions.php
@@ -50,9 +50,6 @@ function wds_theme_setup() {
 		]
 	);
 
-	// Disable background color gradient presets.
-	add_theme_support( 'editor-gradient-presets', [] );
-
 	// Reset available font size presets to only "normal" (16px).
 	add_theme_support(
 		'editor-font-sizes',