wp/wp-includes/block-supports/colors.php
changeset 21 48c4eec2b7e6
parent 19 3d72ae0968f4
equal deleted inserted replaced
20:7b1b88e27a20 21:48c4eec2b7e6
     8 
     8 
     9 /**
     9 /**
    10  * Registers the style and colors block attributes for block types that support it.
    10  * Registers the style and colors block attributes for block types that support it.
    11  *
    11  *
    12  * @since 5.6.0
    12  * @since 5.6.0
       
    13  * @since 6.1.0 Improved $color_support assignment optimization.
    13  * @access private
    14  * @access private
    14  *
    15  *
    15  * @param WP_Block_Type $block_type Block Type.
    16  * @param WP_Block_Type $block_type Block Type.
    16  */
    17  */
    17 function wp_register_colors_support( $block_type ) {
    18 function wp_register_colors_support( $block_type ) {
    18 	$color_support = false;
    19 	$color_support = false;
    19 	if ( property_exists( $block_type, 'supports' ) ) {
    20 	if ( $block_type instanceof WP_Block_Type ) {
    20 		$color_support = _wp_array_get( $block_type->supports, array( 'color' ), false );
    21 		$color_support = isset( $block_type->supports['color'] ) ? $block_type->supports['color'] : false;
    21 	}
    22 	}
    22 	$has_text_colors_support       = true === $color_support || ( is_array( $color_support ) && _wp_array_get( $color_support, array( 'text' ), true ) );
    23 	$has_text_colors_support       = true === $color_support ||
    23 	$has_background_colors_support = true === $color_support || ( is_array( $color_support ) && _wp_array_get( $color_support, array( 'background' ), true ) );
    24 		( isset( $color_support['text'] ) && $color_support['text'] ) ||
    24 	$has_gradients_support         = _wp_array_get( $color_support, array( 'gradients' ), false );
    25 		( is_array( $color_support ) && ! isset( $color_support['text'] ) );
    25 	$has_link_colors_support       = _wp_array_get( $color_support, array( 'link' ), false );
    26 	$has_background_colors_support = true === $color_support ||
       
    27 		( isset( $color_support['background'] ) && $color_support['background'] ) ||
       
    28 		( is_array( $color_support ) && ! isset( $color_support['background'] ) );
       
    29 	$has_gradients_support         = isset( $color_support['gradients'] ) ? $color_support['gradients'] : false;
       
    30 	$has_link_colors_support       = isset( $color_support['link'] ) ? $color_support['link'] : false;
       
    31 	$has_button_colors_support     = isset( $color_support['button'] ) ? $color_support['button'] : false;
       
    32 	$has_heading_colors_support    = isset( $color_support['heading'] ) ? $color_support['heading'] : false;
    26 	$has_color_support             = $has_text_colors_support ||
    33 	$has_color_support             = $has_text_colors_support ||
    27 		$has_background_colors_support ||
    34 		$has_background_colors_support ||
    28 		$has_gradients_support ||
    35 		$has_gradients_support ||
    29 		$has_link_colors_support;
    36 		$has_link_colors_support ||
       
    37 		$has_button_colors_support ||
       
    38 		$has_heading_colors_support;
    30 
    39 
    31 	if ( ! $block_type->attributes ) {
    40 	if ( ! $block_type->attributes ) {
    32 		$block_type->attributes = array();
    41 		$block_type->attributes = array();
    33 	}
    42 	}
    34 
    43 
    57 	}
    66 	}
    58 }
    67 }
    59 
    68 
    60 
    69 
    61 /**
    70 /**
    62  * Add CSS classes and inline styles for colors to the incoming attributes array.
    71  * Adds CSS classes and inline styles for colors to the incoming attributes array.
    63  * This will be applied to the block markup in the front-end.
    72  * This will be applied to the block markup in the front-end.
    64  *
    73  *
    65  * @since 5.6.0
    74  * @since 5.6.0
       
    75  * @since 6.1.0 Implemented the style engine to generate CSS and classnames.
    66  * @access private
    76  * @access private
    67  *
    77  *
    68  * @param  WP_Block_Type $block_type       Block type.
    78  * @param  WP_Block_Type $block_type       Block type.
    69  * @param  array         $block_attributes Block attributes.
    79  * @param  array         $block_attributes Block attributes.
    70  *
    80  *
    71  * @return array Colors CSS classes and inline styles.
    81  * @return array Colors CSS classes and inline styles.
    72  */
    82  */
    73 function wp_apply_colors_support( $block_type, $block_attributes ) {
    83 function wp_apply_colors_support( $block_type, $block_attributes ) {
    74 	$color_support = _wp_array_get( $block_type->supports, array( 'color' ), false );
    84 	$color_support = isset( $block_type->supports['color'] ) ? $block_type->supports['color'] : false;
    75 
    85 
    76 	if (
    86 	if (
    77 		is_array( $color_support ) &&
    87 		is_array( $color_support ) &&
    78 		wp_should_skip_block_supports_serialization( $block_type, 'color' )
    88 		wp_should_skip_block_supports_serialization( $block_type, 'color' )
    79 	) {
    89 	) {
    80 		return array();
    90 		return array();
    81 	}
    91 	}
    82 
    92 
    83 	$has_text_colors_support       = true === $color_support || ( is_array( $color_support ) && _wp_array_get( $color_support, array( 'text' ), true ) );
    93 	$has_text_colors_support       = true === $color_support ||
    84 	$has_background_colors_support = true === $color_support || ( is_array( $color_support ) && _wp_array_get( $color_support, array( 'background' ), true ) );
    94 		( isset( $color_support['text'] ) && $color_support['text'] ) ||
    85 	$has_gradients_support         = _wp_array_get( $color_support, array( 'gradients' ), false );
    95 		( is_array( $color_support ) && ! isset( $color_support['text'] ) );
    86 	$classes                       = array();
    96 	$has_background_colors_support = true === $color_support ||
    87 	$styles                        = array();
    97 		( isset( $color_support['background'] ) && $color_support['background'] ) ||
       
    98 		( is_array( $color_support ) && ! isset( $color_support['background'] ) );
       
    99 	$has_gradients_support         = isset( $color_support['gradients'] ) ? $color_support['gradients'] : false;
       
   100 	$color_block_styles            = array();
    88 
   101 
    89 	// Text colors.
   102 	// Text colors.
    90 	// Check support for text colors.
       
    91 	if ( $has_text_colors_support && ! wp_should_skip_block_supports_serialization( $block_type, 'color', 'text' ) ) {
   103 	if ( $has_text_colors_support && ! wp_should_skip_block_supports_serialization( $block_type, 'color', 'text' ) ) {
    92 		$has_named_text_color  = array_key_exists( 'textColor', $block_attributes );
   104 		$preset_text_color          = array_key_exists( 'textColor', $block_attributes ) ? "var:preset|color|{$block_attributes['textColor']}" : null;
    93 		$has_custom_text_color = isset( $block_attributes['style']['color']['text'] );
   105 		$custom_text_color          = isset( $block_attributes['style']['color']['text'] ) ? $block_attributes['style']['color']['text'] : null;
    94 
   106 		$color_block_styles['text'] = $preset_text_color ? $preset_text_color : $custom_text_color;
    95 		// Apply required generic class.
       
    96 		if ( $has_custom_text_color || $has_named_text_color ) {
       
    97 			$classes[] = 'has-text-color';
       
    98 		}
       
    99 		// Apply color class or inline style.
       
   100 		if ( $has_named_text_color ) {
       
   101 			$classes[] = sprintf( 'has-%s-color', _wp_to_kebab_case( $block_attributes['textColor'] ) );
       
   102 		} elseif ( $has_custom_text_color ) {
       
   103 			$styles[] = sprintf( 'color: %s;', $block_attributes['style']['color']['text'] );
       
   104 		}
       
   105 	}
   107 	}
   106 
   108 
   107 	// Background colors.
   109 	// Background colors.
   108 	if ( $has_background_colors_support && ! wp_should_skip_block_supports_serialization( $block_type, 'color', 'background' ) ) {
   110 	if ( $has_background_colors_support && ! wp_should_skip_block_supports_serialization( $block_type, 'color', 'background' ) ) {
   109 		$has_named_background_color  = array_key_exists( 'backgroundColor', $block_attributes );
   111 		$preset_background_color          = array_key_exists( 'backgroundColor', $block_attributes ) ? "var:preset|color|{$block_attributes['backgroundColor']}" : null;
   110 		$has_custom_background_color = isset( $block_attributes['style']['color']['background'] );
   112 		$custom_background_color          = isset( $block_attributes['style']['color']['background'] ) ? $block_attributes['style']['color']['background'] : null;
   111 
   113 		$color_block_styles['background'] = $preset_background_color ? $preset_background_color : $custom_background_color;
   112 		// Apply required background class.
       
   113 		if ( $has_custom_background_color || $has_named_background_color ) {
       
   114 			$classes[] = 'has-background';
       
   115 		}
       
   116 		// Apply background color classes or styles.
       
   117 		if ( $has_named_background_color ) {
       
   118 			$classes[] = sprintf( 'has-%s-background-color', _wp_to_kebab_case( $block_attributes['backgroundColor'] ) );
       
   119 		} elseif ( $has_custom_background_color ) {
       
   120 			$styles[] = sprintf( 'background-color: %s;', $block_attributes['style']['color']['background'] );
       
   121 		}
       
   122 	}
   114 	}
   123 
   115 
   124 	// Gradients.
   116 	// Gradients.
   125 	if ( $has_gradients_support && ! wp_should_skip_block_supports_serialization( $block_type, 'color', 'gradients' ) ) {
   117 	if ( $has_gradients_support && ! wp_should_skip_block_supports_serialization( $block_type, 'color', 'gradients' ) ) {
   126 		$has_named_gradient  = array_key_exists( 'gradient', $block_attributes );
   118 		$preset_gradient_color          = array_key_exists( 'gradient', $block_attributes ) ? "var:preset|gradient|{$block_attributes['gradient']}" : null;
   127 		$has_custom_gradient = isset( $block_attributes['style']['color']['gradient'] );
   119 		$custom_gradient_color          = isset( $block_attributes['style']['color']['gradient'] ) ? $block_attributes['style']['color']['gradient'] : null;
   128 
   120 		$color_block_styles['gradient'] = $preset_gradient_color ? $preset_gradient_color : $custom_gradient_color;
   129 		if ( $has_named_gradient || $has_custom_gradient ) {
       
   130 			$classes[] = 'has-background';
       
   131 		}
       
   132 		// Apply required background class.
       
   133 		if ( $has_named_gradient ) {
       
   134 			$classes[] = sprintf( 'has-%s-gradient-background', _wp_to_kebab_case( $block_attributes['gradient'] ) );
       
   135 		} elseif ( $has_custom_gradient ) {
       
   136 			$styles[] = sprintf( 'background: %s;', $block_attributes['style']['color']['gradient'] );
       
   137 		}
       
   138 	}
   121 	}
   139 
   122 
   140 	$attributes = array();
   123 	$attributes = array();
   141 	if ( ! empty( $classes ) ) {
   124 	$styles     = wp_style_engine_get_styles( array( 'color' => $color_block_styles ), array( 'convert_vars_to_classnames' => true ) );
   142 		$attributes['class'] = implode( ' ', $classes );
   125 
       
   126 	if ( ! empty( $styles['classnames'] ) ) {
       
   127 		$attributes['class'] = $styles['classnames'];
   143 	}
   128 	}
   144 	if ( ! empty( $styles ) ) {
   129 
   145 		$attributes['style'] = implode( ' ', $styles );
   130 	if ( ! empty( $styles['css'] ) ) {
       
   131 		$attributes['style'] = $styles['css'];
   146 	}
   132 	}
   147 
   133 
   148 	return $attributes;
   134 	return $attributes;
   149 }
   135 }
   150 
   136