WP_Theme_JSON::get_styles_for_block( array $block_metadata ): string

In this article

Gets the CSS rules for a particular block from theme.json.

Parameters

$block_metadataarrayrequired
Metadata about the block to get styles for.

Return

string Styles for the block.

Source

 *
 * @since 6.1.0
 *
 * @return array The block nodes in theme.json.
 */
public function get_styles_block_nodes() {
	return static::get_block_nodes( $this->theme_json );
}

/**
 * Returns a filtered declarations array if there is a separator block with only a background
 * style defined in theme.json by adding a color attribute to reflect the changes in the front.
 *
 * @since 6.1.1
 *
 * @param array $declarations List of declarations.
 * @return array $declarations List of declarations filtered.
 */
private static function update_separator_declarations( $declarations ) {
	$background_color     = '';
	$border_color_matches = false;
	$text_color_matches   = false;

	foreach ( $declarations as $declaration ) {
		if ( 'background-color' === $declaration['name'] && ! $background_color && isset( $declaration['value'] ) ) {
			$background_color = $declaration['value'];
		} elseif ( 'border-color' === $declaration['name'] ) {
			$border_color_matches = true;
		} elseif ( 'color' === $declaration['name'] ) {
			$text_color_matches = true;
		}

		if ( $background_color && $border_color_matches && $text_color_matches ) {
			break;
		}
	}

	if ( $background_color && ! $border_color_matches && ! $text_color_matches ) {
		$declarations[] = array(
			'name'  => 'color',
			'value' => $background_color,
		);
	}

	return $declarations;
}

/**
 * An internal method to get the block nodes from a theme.json file.
 *
 * @since 6.1.0
 * @since 6.3.0 Refactored and stabilized selectors API.
 *
 * @param array $theme_json The theme.json converted to an array.
 * @return array The block nodes in theme.json.
 */
private static function get_block_nodes( $theme_json ) {
	$selectors = static::get_blocks_metadata();
	$nodes     = array();
	if ( ! isset( $theme_json['styles'] ) ) {
		return $nodes;
	}

	// Blocks.
	if ( ! isset( $theme_json['styles']['blocks'] ) ) {
		return $nodes;
	}

	foreach ( $theme_json['styles']['blocks'] as $name => $node ) {
		$selector = null;
		if ( isset( $selectors[ $name ]['selector'] ) ) {
			$selector = $selectors[ $name ]['selector'];
		}

		$duotone_selector = null;
		if ( isset( $selectors[ $name ]['duotone'] ) ) {
			$duotone_selector = $selectors[ $name ]['duotone'];
		}

		$feature_selectors = null;
		if ( isset( $selectors[ $name ]['selectors'] ) ) {
			$feature_selectors = $selectors[ $name ]['selectors'];
		}

		$variation_selectors = array();
		if ( isset( $node['variations'] ) ) {
			foreach ( $node['variations'] as $variation => $node ) {
				$variation_selectors[] = array(
					'path'     => array( 'styles', 'blocks', $name, 'variations', $variation ),
					'selector' => $selectors[ $name ]['styleVariations'][ $variation ],
				);
			}
		}

		$nodes[] = array(
			'name'       => $name,
			'path'       => array( 'styles', 'blocks', $name ),
			'selector'   => $selector,
			'selectors'  => $feature_selectors,
			'duotone'    => $duotone_selector,
			'features'   => $feature_selectors,
			'variations' => $variation_selectors,
		);

		if ( isset( $theme_json['styles']['blocks'][ $name ]['elements'] ) ) {
			foreach ( $theme_json['styles']['blocks'][ $name ]['elements'] as $element => $node ) {
				$nodes[] = array(
					'path'     => array( 'styles', 'blocks', $name, 'elements', $element ),
					'selector' => $selectors[ $name ]['elements'][ $element ],
				);

				// Handle any pseudo selectors for the element.
				if ( isset( static::VALID_ELEMENT_PSEUDO_SELECTORS[ $element ] ) ) {
					foreach ( static::VALID_ELEMENT_PSEUDO_SELECTORS[ $element ] as $pseudo_selector ) {
						if ( isset( $theme_json['styles']['blocks'][ $name ]['elements'][ $element ][ $pseudo_selector ] ) ) {
							$nodes[] = array(
								'path'     => array( 'styles', 'blocks', $name, 'elements', $element ),
								'selector' => static::append_to_selector( $selectors[ $name ]['elements'][ $element ], $pseudo_selector ),
							);
						}
					}
				}
			}
		}
	}

	return $nodes;
}

/**
 * Gets the CSS rules for a particular block from theme.json.
 *
 * @since 6.1.0
 *
 * @param array $block_metadata Metadata about the block to get styles for.
 *
 * @return string Styles for the block.
 */
public function get_styles_for_block( $block_metadata ) {
	$node                 = _wp_array_get( $this->theme_json, $block_metadata['path'], array() );

Changelog

VersionDescription
6.1.0Introduced.

User Contributed Notes

You must log in before being able to contribute a note or feedback.