Skip to content

Commit

Permalink
Fix theme supports for themes without theme.json (#34955)
Browse files Browse the repository at this point in the history 
* Pull theme supports for all themes

* Enqueue only core presets for themes without theme.json

* Fix lint issue

* Fix lint issues
  • Loading branch information
@oandregal
oandregal committed Sep 20, 2021
1 parent dca4f03 commit 635ee9d
Show file tree
Hide file tree
Showing 3 changed files with 51 additions and 35 deletions.
47 changes: 27 additions & 20 deletions lib/class-wp-theme-json-gutenberg.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -596,12 +596,13 @@ private static function append_to_selector( $selector, $to_append ) {
*
* @param array $preset_per_origin Array of presets keyed by origin.
* @param string $value_key The property of the preset that contains its value.
* @param array $origins List of origins to process.
*
* @return array Array of presets where each key is a slug and each value is the preset value.
*/
private static function get_merged_preset_by_slug( $preset_per_origin, $value_key ) {
private static function get_merged_preset_by_slug( $preset_per_origin, $value_key, $origins ) {
$result = array();
foreach ( self::VALID_ORIGINS as $origin ) {
foreach ( $origins as $origin ) {
if ( ! isset( $preset_per_origin[ $origin ] ) ) {
continue;
}
Expand All @@ -622,10 +623,11 @@ private static function get_merged_preset_by_slug( $preset_per_origin, $value_ke
*
* @param array $settings Settings to process.
* @param string $selector Selector wrapping the classes.
* @param array $origins List of origins to process.
*
* @return string The result of processing the presets.
*/
private static function compute_preset_classes( $settings, $selector ) {
private static function compute_preset_classes( $settings, $selector, $origins ) {
if ( self::ROOT_BLOCK_SELECTOR === $selector ) {
// Classes at the global level do not need any CSS prefixed,
// and we don't want to increase its specificity.
Expand All @@ -635,7 +637,7 @@ private static function compute_preset_classes( $settings, $selector ) {
$stylesheet = '';
foreach ( self::PRESETS_METADATA as $preset ) {
$preset_per_origin = _wp_array_get( $settings, $preset['path'], array() );
$preset_by_slug = self::get_merged_preset_by_slug( $preset_per_origin, $preset['value_key'] );
$preset_by_slug = self::get_merged_preset_by_slug( $preset_per_origin, $preset['value_key'], $origins );
foreach ( $preset['classes'] as $class ) {
foreach ( $preset_by_slug as $slug => $value ) {
$stylesheet .= self::to_ruleset(
Expand Down Expand Up @@ -667,14 +669,15 @@ private static function compute_preset_classes( $settings, $selector ) {
* ```
*
* @param array $settings Settings to process.
* @param array $origins List of origins to process.
*
* @return array Returns the modified $declarations.
*/
private static function compute_preset_vars( $settings ) {
private static function compute_preset_vars( $settings, $origins ) {
$declarations = array();
foreach ( self::PRESETS_METADATA as $preset ) {
$preset_per_origin = _wp_array_get( $settings, $preset['path'], array() );
$preset_by_slug = self::get_merged_preset_by_slug( $preset_per_origin, $preset['value_key'] );
$preset_by_slug = self::get_merged_preset_by_slug( $preset_per_origin, $preset['value_key'], $origins );
foreach ( $preset_by_slug as $slug => $value ) {
$declarations[] = array(
'name' => '--wp--preset--' . $preset['css_var_infix'] . '--' . gutenberg_experimental_to_kebab_case( $slug ),
Expand Down Expand Up @@ -770,10 +773,11 @@ function ( $carry, $element ) {
* }
*
* @param array $nodes Nodes with settings.
* @param array $origins List of origins to process.
*
* @return string The new stylesheet.
*/
private function get_css_variables( $nodes ) {
private function get_css_variables( $nodes, $origins ) {
$stylesheet = '';
foreach ( $nodes as $metadata ) {
if ( null === $metadata['selector'] ) {
Expand All @@ -783,7 +787,7 @@ private function get_css_variables( $nodes ) {
$selector = $metadata['selector'];

$node = _wp_array_get( $this->theme_json, $metadata['path'], array() );
$declarations = array_merge( self::compute_preset_vars( $node ), self::compute_theme_vars( $node ) );
$declarations = array_merge( self::compute_preset_vars( $node, $origins ), self::compute_theme_vars( $node ) );

$stylesheet .= self::to_ruleset( $selector, $declarations );
}
Expand Down Expand Up @@ -855,10 +859,11 @@ private function get_block_classes( $style_nodes ) {
* }
* @param array $setting_nodes Nodes with settings.
* @param array $origins List of origins to process presets from.
*
* @return string The new stylesheet.
*/
private function get_preset_classes( $setting_nodes ) {
private function get_preset_classes( $setting_nodes, $origins ) {
$preset_rules = '';

foreach ( $setting_nodes as $metadata ) {
Expand All @@ -868,7 +873,7 @@ private function get_preset_classes( $setting_nodes ) {

$selector = $metadata['selector'];
$node = _wp_array_get( $this->theme_json, $metadata['path'], array() );
$preset_rules .= self::compute_preset_classes( $node, $selector );
$preset_rules .= self::compute_preset_classes( $node, $selector, $origins );
}

return $preset_rules;
Expand Down Expand Up @@ -1069,27 +1074,29 @@ private static function get_setting_nodes( $theme_json, $selectors = array() ) {
* Returns the stylesheet that results of processing
* the theme.json structure this object represents.
*
* @param string $type Type of stylesheet. It accepts:
* 'all': css variables, block classes, preset classes. The default.
* 'block_styles': only block & preset classes.
* 'css_variables': only css variables.
* 'presets': only css variables and preset classes.
* @param string $type Type of stylesheet. It accepts:
* 'all': css variables, block classes, preset classes. The default.
* 'block_styles': only block & preset classes.
* 'css_variables': only css variables.
* 'presets': only css variables and preset classes.
* @param array $origins A list of origins to include. By default it includes 'core', 'theme', and 'user'.
*
* @return string Stylesheet.
*/
public function get_stylesheet( $type = 'all' ) {
public function get_stylesheet( $type = 'all', $origins = self::VALID_ORIGINS ) {
$blocks_metadata = self::get_blocks_metadata();
$style_nodes = self::get_style_nodes( $this->theme_json, $blocks_metadata );
$setting_nodes = self::get_setting_nodes( $this->theme_json, $blocks_metadata );

switch ( $type ) {
case 'block_styles':
return $this->get_block_classes( $style_nodes ) . $this->get_preset_classes( $setting_nodes );
return $this->get_block_classes( $style_nodes ) . $this->get_preset_classes( $setting_nodes, $origins );
case 'css_variables':
return $this->get_css_variables( $setting_nodes );
return $this->get_css_variables( $setting_nodes, $origins );
case 'presets':
return $this->get_css_variables( $setting_nodes ) . $this->get_preset_classes( $setting_nodes );
return $this->get_css_variables( $setting_nodes, $origins ) . $this->get_preset_classes( $setting_nodes, $origins );
default:
return $this->get_css_variables( $setting_nodes ) . $this->get_block_classes( $style_nodes ) . $this->get_preset_classes( $setting_nodes );
return $this->get_css_variables( $setting_nodes, $origins ) . $this->get_block_classes( $style_nodes ) . $this->get_preset_classes( $setting_nodes, $origins );
}
}

Expand Down
7 changes: 0 additions & 7 deletions lib/class-wp-theme-json-resolver-gutenberg.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -410,13 +410,6 @@ public static function get_merged_data( $settings = array(), $origin = 'user' )
$result = new WP_Theme_JSON_Gutenberg();
$result->merge( self::get_core_data() );

if (
! get_theme_support( 'experimental-link-color' ) && // link color support needs the presets CSS variables regardless of the presence of theme.json file.
! WP_Theme_JSON_Resolver_Gutenberg::theme_has_support()
) {
return $result;
}

$theme_support_data = WP_Theme_JSON_Gutenberg::get_from_editor_settings( $settings );
$result->merge( self::get_theme_data( $theme_support_data ) );

Expand Down
32 changes: 24 additions & 8 deletions lib/global-styles.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,11 +10,11 @@
* the corresponding stylesheet.
*
* @param WP_Theme_JSON_Gutenberg $tree Input tree.
* @param string $type Type of stylesheet we want accepts 'all', 'block_styles', 'css_variables', and 'presets'.
* @param string $type Type of stylesheet. It accepts 'all', 'block_styles', 'css_variables', 'presets'.
*
* @return string Stylesheet.
*/
function gutenberg_experimental_global_styles_get_stylesheet( $tree, $type = 'all' ) {
function gutenberg_experimental_global_styles_get_stylesheet( $tree, $type = null ) {
// Check if we can use cached.
$can_use_cached = (
( 'all' === $type ) &&
Expand All @@ -32,7 +32,27 @@ function gutenberg_experimental_global_styles_get_stylesheet( $tree, $type = 'al
}
}

$stylesheet = $tree->get_stylesheet( $type );
$supports_theme_json = WP_Theme_JSON_Resolver_Gutenberg::theme_has_support();
$supports_link_color = get_theme_support( 'experimental-link-color' );

// Only modify the $type if the consumer hasn't provided any.
if ( null === $type && ! $supports_theme_json ) {
$type = 'presets';
} elseif ( null === $type ) {
$type = 'all';
}

$origins = array( 'core', 'theme', 'user' );
if ( ! $supports_theme_json && ! $supports_link_color ) {
// In this case we only enqueue the core presets (CSS Custom Properties + the classes).
$origins = array( 'core' );
} elseif ( ! $supports_theme_json && $supports_link_color ) {
// For the legacy link color feauter to work, the CSS Custom Properties
// should be in scope (either the core or the theme ones).
$origins = array( 'core', 'theme' );
}

$stylesheet = $tree->get_stylesheet( $type, $origins );

if ( $can_use_cached ) {
// Cache for a minute.
Expand All @@ -51,11 +71,7 @@ function gutenberg_experimental_global_styles_enqueue_assets() {
$settings = gutenberg_get_default_block_editor_settings();
$all = WP_Theme_JSON_Resolver_Gutenberg::get_merged_data( $settings );

$type = 'all';
if ( ! WP_Theme_JSON_Resolver_Gutenberg::theme_has_support() ) {
$type = 'presets';
}
$stylesheet = gutenberg_experimental_global_styles_get_stylesheet( $all, $type );
$stylesheet = gutenberg_experimental_global_styles_get_stylesheet( $all );
if ( empty( $stylesheet ) ) {
return;
}
Expand Down

0 comments on commit 635ee9d

Please sign in to comment.