Background images: resolve theme.json dynamic ref values and ensure appropriate style default values
The commit syncs the following changes from Gutenberg: - Background images: add support for theme.json ref value resolution gutenberg#64128 - Background images: ensure appropriate default values gutenberg#64192 - Background image: ensure consistency with defaults and fix reset/remove functionality gutenberg#64328 These changes brings consistency to the default background image styles WordPress applies to user uploaded images, and adds support for ref resolution to "background" style properties. Props andrewserong, aaronrobertshaw. Fixes #61858 Built from https://develop.svn.wordpress.org/trunk@58936 git-svn-id: http://core.svn.wordpress.org/trunk@58332 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
ramonopoly
parent
0735fa8ce0
commit
9e650efbb8
|
|
@ -75,7 +75,7 @@ function wp_render_background_support( $block_content, $block ) {
|
|||
|
||||
// If the background size is set to `contain` and no position is set, set the position to `center`.
|
||||
if ( 'contain' === $background_styles['backgroundSize'] && ! $background_styles['backgroundPosition'] ) {
|
||||
$background_styles['backgroundPosition'] = 'center';
|
||||
$background_styles['backgroundPosition'] = '50% 50%';
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -2295,7 +2295,7 @@ class WP_Theme_JSON {
|
|||
*
|
||||
* array(
|
||||
* 'name' => 'property_name',
|
||||
* 'value' => 'property_value,
|
||||
* 'value' => 'property_value',
|
||||
* )
|
||||
*
|
||||
* @since 5.8.0
|
||||
|
|
@ -2303,6 +2303,7 @@ class WP_Theme_JSON {
|
|||
* @since 6.1.0 Added `$theme_json`, `$selector`, and `$use_root_padding` parameters.
|
||||
* @since 6.5.0 Output a `min-height: unset` rule when `aspect-ratio` is set.
|
||||
* @since 6.6.0 Pass current theme JSON settings to wp_get_typography_font_size_value(), and process background properties.
|
||||
* @since 6.7.0 `ref` resolution of background properties, and assigning custom default values.
|
||||
*
|
||||
* @param array $styles Styles to process.
|
||||
* @param array $settings Theme settings.
|
||||
|
|
@ -2356,10 +2357,27 @@ class WP_Theme_JSON {
|
|||
}
|
||||
}
|
||||
|
||||
// Processes background styles.
|
||||
if ( 'background' === $value_path[0] && isset( $styles['background'] ) ) {
|
||||
$background_styles = wp_style_engine_get_styles( array( 'background' => $styles['background'] ) );
|
||||
$value = isset( $background_styles['declarations'][ $css_property ] ) ? $background_styles['declarations'][ $css_property ] : $value;
|
||||
/*
|
||||
* Processes background image styles.
|
||||
* If the value is a URL, it will be converted to a CSS `url()` value.
|
||||
* For uploaded image (images with a database ID), apply size and position defaults,
|
||||
* equal to those applied in block supports in lib/background.php.
|
||||
*/
|
||||
if ( 'background-image' === $css_property && ! empty( $value ) ) {
|
||||
$background_styles = wp_style_engine_get_styles(
|
||||
array( 'background' => array( 'backgroundImage' => $value ) )
|
||||
);
|
||||
$value = $background_styles['declarations'][ $css_property ];
|
||||
}
|
||||
if ( empty( $value ) && static::ROOT_BLOCK_SELECTOR !== $selector && ! empty( $styles['background']['backgroundImage']['id'] ) ) {
|
||||
if ( 'background-size' === $css_property ) {
|
||||
$value = 'cover';
|
||||
}
|
||||
// If the background size is set to `contain` and no position is set, set the position to `center`.
|
||||
if ( 'background-position' === $css_property ) {
|
||||
$background_size = $styles['background']['backgroundSize'] ?? null;
|
||||
$value = 'contain' === $background_size ? '50% 50%' : null;
|
||||
}
|
||||
}
|
||||
|
||||
// Skip if empty and not "0" or value represents array of longhand values.
|
||||
|
|
@ -2421,6 +2439,7 @@ class WP_Theme_JSON {
|
|||
* to the standard form "--wp--preset--color--secondary".
|
||||
* This is already done by the sanitize method,
|
||||
* so every property will be in the standard form.
|
||||
* @since 6.7.0 Added support for background image refs.
|
||||
*
|
||||
* @param array $styles Styles subtree.
|
||||
* @param array $path Which property to process.
|
||||
|
|
@ -2437,14 +2456,18 @@ class WP_Theme_JSON {
|
|||
|
||||
/*
|
||||
* This converts references to a path to the value at that path
|
||||
* where the values is an array with a "ref" key, pointing to a path.
|
||||
* where the value is an array with a "ref" key, pointing to a path.
|
||||
* For example: { "ref": "style.color.background" } => "#fff".
|
||||
* In the case of backgroundImage, if both a ref and a URL are present in the value,
|
||||
* the URL takes precedence and the ref is ignored.
|
||||
*/
|
||||
if ( is_array( $value ) && isset( $value['ref'] ) ) {
|
||||
$value_path = explode( '.', $value['ref'] );
|
||||
$ref_value = _wp_array_get( $theme_json, $value_path );
|
||||
// Background Image refs can refer to a string or an array containing a URL string.
|
||||
$ref_value_url = $ref_value['url'] ?? null;
|
||||
// Only use the ref value if we find anything.
|
||||
if ( ! empty( $ref_value ) && is_string( $ref_value ) ) {
|
||||
if ( ! empty( $ref_value ) && ( is_string( $ref_value ) || is_string( $ref_value_url ) ) ) {
|
||||
$value = $ref_value;
|
||||
}
|
||||
|
||||
|
|
@ -3083,6 +3106,7 @@ class WP_Theme_JSON {
|
|||
*
|
||||
* @since 5.8.0
|
||||
* @since 5.9.0 Duotone preset also has origins.
|
||||
* @since 6.7.0 Replace background image objects during merge.
|
||||
*
|
||||
* @param WP_Theme_JSON $incoming Data to merge.
|
||||
*/
|
||||
|
|
@ -3206,6 +3230,25 @@ class WP_Theme_JSON {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* Style values are merged at the leaf level, however
|
||||
* some values provide exceptions, namely style values that are
|
||||
* objects and represent unique definitions for the style.
|
||||
*/
|
||||
$style_nodes = static::get_styles_block_nodes();
|
||||
foreach ( $style_nodes as $style_node ) {
|
||||
$path = $style_node['path'];
|
||||
/*
|
||||
* Background image styles should be replaced, not merged,
|
||||
* as they themselves are specific object definitions for the style.
|
||||
*/
|
||||
$background_image_path = array_merge( $path, static::PROPERTIES_METADATA['background-image'] );
|
||||
$content = _wp_array_get( $incoming_data, $background_image_path, null );
|
||||
if ( isset( $content ) ) {
|
||||
_wp_array_set( $this->theme_json, $background_image_path, $content );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@
|
|||
*
|
||||
* @global string $wp_version
|
||||
*/
|
||||
$wp_version = '6.7-alpha-58935';
|
||||
$wp_version = '6.7-alpha-58936';
|
||||
|
||||
/**
|
||||
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.
|
||||
|
|
|
|||
Loading…
Reference in New Issue