WP_Theme_JSON::compute_preset_classes( array $settings, string $selector, string[] $origins ): string

Source

protected static function compute_preset_classes( $settings, $selector, $origins ) {
	if ( static::ROOT_BLOCK_SELECTOR === $selector || static::ROOT_CSS_PROPERTIES_SELECTOR === $selector ) {
		/*
		 * Classes at the global level do not need any CSS prefixed,
		 * and we don't want to increase its specificity.
		 */
		$selector = '';
	}

	$stylesheet = '';
	foreach ( static::PRESETS_METADATA as $preset_metadata ) {
		if ( empty( $preset_metadata['classes'] ) ) {
			continue;
		}
		$slugs = static::get_settings_slugs( $settings, $preset_metadata, $origins );
		foreach ( $preset_metadata['classes'] as $class => $property ) {
			foreach ( $slugs as $slug ) {
				$css_var    = static::replace_slug_in_string( $preset_metadata['css_vars'], $slug );
				$class_name = static::replace_slug_in_string( $class, $slug );

				/*
				 * $selector is often empty (root-level presets), in which case the
				 * bare class is used. For block-level presets the block selector is
				 * wrapped in `:where()` so the class keeps the same 0-1-0 specificity
				 * as a root-level preset. Without this, block-level palette rules
				 * (e.g. `p.has-x-color`) out-rank equally-important rules that also
				 * target the same property at 0-1-0, such as per-instance responsive
				 * state styles.
				 */
				$new_selector = '' === $selector ? $class_name : ':where(' . $selector . ')' . $class_name;
				$stylesheet  .= static::to_ruleset(
					$new_selector,
					array(
						array(
							'name'  => $property,
							'value' => 'var(' . $css_var . ') !important',
						),
					)
				);
			}
		}
	}

	return $stylesheet;
}

View all references View on Trac View on GitHub