From 73fbff2bc4c6eef73eb45f961e12cd7363dd4fdc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9s?= <andres.maneiro@automattic.com>
Date: Thu, 7 May 2020 11:15:01 +0200
Subject: [PATCH] Extract selectors function and use the styles key for the
 tree

---
 experimental-default-global-styles.json | 10 ++++----
 lib/global-styles.php                   | 32 +++++++++++++++++--------
 2 files changed, 28 insertions(+), 14 deletions(-)

diff --git a/experimental-default-global-styles.json b/experimental-default-global-styles.json
index e6c72e4881186..8176127703787 100644
--- a/experimental-default-global-styles.json
+++ b/experimental-default-global-styles.json
@@ -1,8 +1,10 @@
 {
-	"core": {
-		"color": {
-			"background": "white",
-			"text": "black"
+	"styles": {
+		"global": {
+			"color": {
+				"background": "white",
+				"text": "black"
+			}
 		}
 	}
 }
diff --git a/lib/global-styles.php b/lib/global-styles.php
index 1e4e118f48cfe..8a202842abc87 100644
--- a/lib/global-styles.php
+++ b/lib/global-styles.php
@@ -223,16 +223,12 @@ function gutenberg_experimental_global_styles_extract_selectors( $block_json ) {
 }
 
 /**
- * Takes a Global Styles tree and returns a CSS rule
- * that contains the corresponding CSS custom properties.
+ * Pulls the CSS selectors to use from the block.json config.
  *
- * @param array $global_styles Global Styles tree.
- * @return string CSS rule.
+ * @return array
  */
-function gutenberg_experimental_global_styles_resolver( $global_styles ) {
-	$css_rules = '';
-
-	$selectors = array( 'core' => ':root' );
+function gutenberg_experimental_global_styles_get_selectors() {
+	$selectors = array( 'global' => ':root' );
 
 	// We need to provide a mechanism for blocks to opt-in into this
 	// that can be used by 3rd party blocks as well.
@@ -242,6 +238,7 @@ function gutenberg_experimental_global_styles_resolver( $global_styles ) {
 		'paragraph',
 		'heading',
 	);
+
 	// The block library dir may not exist if working from a fresh clone => bail out early.
 	$block_library_dir = dirname( __FILE__ ) . '/../build/block-library/blocks/';
 	if ( file_exists( $block_library_dir ) ) {
@@ -258,7 +255,22 @@ function gutenberg_experimental_global_styles_resolver( $global_styles ) {
 		}
 	}
 
-	foreach ( $global_styles as $blockname => $subtree ) {
+	return $selectors;
+}
+
+/**
+ * Takes a Global Styles tree and returns a CSS rule
+ * that contains the corresponding CSS custom properties.
+ *
+ * @param array $global_styles Global Styles tree.
+ * @return string CSS rule.
+ */
+function gutenberg_experimental_global_styles_resolver( $global_styles ) {
+	$css_rules = '';
+	$styles    = $global_styles['styles'];
+	$selectors = gutenberg_experimental_global_styles_get_selectors();
+
+	foreach ( $styles as $block_name => $subtree ) {
 		$token    = '--';
 		$prefix   = '--wp' . $token;
 		$css_vars = gutenberg_experimental_global_styles_get_css_vars( $subtree, $prefix, $token );
@@ -266,7 +278,7 @@ function gutenberg_experimental_global_styles_resolver( $global_styles ) {
 			return $css_rules;
 		}
 
-		$css_rules .= $selectors[ $blockname ] . " {\n";
+		$css_rules .= $selectors[ $block_name ] . " {\n";
 		foreach ( $css_vars as $var => $value ) {
 			$css_rules .= "\t" . $var . ': ' . $value . ";\n";
 		}