Global Styles: Allow referenced zero value and simplify getValueFromO…

…bjectPath calls (#64836) Co-authored-by: aaronrobertshaw <aaronrobertshaw@git.wordpress.org> Co-authored-by: ramonjd <ramonopoly@git.wordpress.org>
WordPress · Aug 28, 2024 · a902662 · a902662
1 parent 8f12b2e
commit a902662
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 6 deletions.
diff --git a/packages/block-editor/src/components/global-styles/test/utils.js b/packages/block-editor/src/components/global-styles/test/utils.js
@@ -73,6 +73,11 @@ describe( 'editor utils', () => {
 					dimensions: {
 						minHeight: '100px',
 					},
+					spacing: {
+						padding: {
+							top: 0,
+						},
+					},
 				},
 			},
 		},
@@ -444,6 +449,11 @@ describe( 'editor utils', () => {
 				{ url: 'file:./assets/image.jpg' },
 				themeJson,
 			],
+			[
+				{ ref: 'styles.blocks.core/group.spacing.padding.top' },
+				0,
+				themeJson,
+			],
 			[
 				{
 					ref: 'styles.blocks.core/group.background.backgroundImage',

diff --git a/packages/block-editor/src/components/global-styles/utils.js b/packages/block-editor/src/components/global-styles/utils.js
@@ -306,9 +306,8 @@ function getValueFromCustomVariable( features, blockName, variable, path ) {
  */
 export function getValueFromVariable( features, blockName, variable ) {
 	if ( ! variable || typeof variable !== 'string' ) {
-		if ( variable?.ref && typeof variable?.ref === 'string' ) {
-			const refPath = variable.ref.split( '.' );
-			variable = getValueFromObjectPath( features, refPath );
+		if ( typeof variable?.ref === 'string' ) {
+			variable = getValueFromObjectPath( features, variable.ref );
 			// Presence of another ref indicates a reference to another dynamic value.
 			// Pointing to another dynamic value is not supported.
 			if ( ! variable || !! variable?.ref ) {
@@ -568,9 +567,8 @@ export function getResolvedRefValue( ruleValue, tree ) {
 	 * For example: { "ref": "style.color.background" } => "#fff".
 	 */
 	if ( typeof ruleValue !== 'string' && ruleValue?.ref ) {
-		const refPath = ruleValue.ref.split( '.' );
 		const resolvedRuleValue = getCSSValueFromRawStyle(
-			getValueFromObjectPath( tree, refPath )
+			getValueFromObjectPath( tree, ruleValue.ref )
 		);
 
 		/*
@@ -581,7 +579,7 @@ export function getResolvedRefValue( ruleValue, tree ) {
 			return undefined;
 		}
 
-		if ( ! resolvedRuleValue ) {
+		if ( resolvedRuleValue === undefined ) {
 			return ruleValue;
 		}