wp_tinycolor_bound01( $rgb_color['r'], 255 ) * 255,
'g' => wp_tinycolor_bound01( $rgb_color['g'], 255 ) * 255,
'b' => wp_tinycolor_bound01( $rgb_color['b'], 255 ) * 255,
);
}
/**
* Helper function for hsl to rgb conversion.
*
* Direct port of TinyColor's function, lightly simplified to maintain
* consistency with TinyColor.
*
* @see https://github.com/bgrins/TinyColor
*
* @since 5.8.0
* @access private
*
* @param float $p first component.
* @param float $q second component.
* @param float $t third component.
*
* @return float R, G, or B component.
*/
function wp_tinycolor_hue_to_rgb( $p, $q, $t ) {
if ( $t < 0 ) {
$t += 1;
}
if ( $t > 1 ) {
$t -= 1;
}
if ( $t < 1 / 6 ) {
return $p + ( $q - $p ) * 6 * $t;
}
if ( $t < 1 / 2 ) {
return $q;
}
if ( $t < 2 / 3 ) {
return $p + ( $q - $p ) * ( 2 / 3 - $t ) * 6;
}
return $p;
}
/**
* Convert an HSL object to an RGB object with converted and rounded values.
*
* Direct port of TinyColor's function, lightly simplified to maintain
* consistency with TinyColor.
*
* @see https://github.com/bgrins/TinyColor
*
* @since 5.8.0
* @access private
*
* @param array $hsl_color HSL object.
*
* @return array Rounded and converted RGB object.
*/
function wp_tinycolor_hsl_to_rgb( $hsl_color ) {
$h = wp_tinycolor_bound01( $hsl_color['h'], 360 );
$s = wp_tinycolor_bound01( $hsl_color['s'], 100 );
$l = wp_tinycolor_bound01( $hsl_color['l'], 100 );
if ( 0 === $s ) {
// Achromatic.
$r = $l;
$g = $l;
$b = $l;
} else {
$q = $l < 0.5 ? $l * ( 1 + $s ) : $l + $s - $l * $s;
$p = 2 * $l - $q;
$r = wp_tinycolor_hue_to_rgb( $p, $q, $h + 1 / 3 );
$g = wp_tinycolor_hue_to_rgb( $p, $q, $h );
$b = wp_tinycolor_hue_to_rgb( $p, $q, $h - 1 / 3 );
}
return array(
'r' => $r * 255,
'g' => $g * 255,
'b' => $b * 255,
);
}
/**
* Parses hex, hsl, and rgb CSS strings using the same regex as TinyColor v1.4.2
* used in the JavaScript. Only colors output from react-color are implemented
* and the alpha value is ignored as it is not used in duotone.
*
* Direct port of TinyColor's function, lightly simplified to maintain
* consistency with TinyColor.
*
* @see https://github.com/bgrins/TinyColor
* @see https://github.com/casesandberg/react-color/
*
* @since 5.8.0
* @access private
*
* @param string $color_str CSS color string.
*
* @return array RGB object.
*/
function wp_tinycolor_string_to_rgb( $color_str ) {
$color_str = strtolower( trim( $color_str ) );
$css_integer = '[-\\+]?\\d+%?';
$css_number = '[-\\+]?\\d*\\.\\d+%?';
$css_unit = '(?:' . $css_number . ')|(?:' . $css_integer . ')';
$permissive_match3 = '[\\s|\\(]+(' . $css_unit . ')[,|\\s]+(' . $css_unit . ')[,|\\s]+(' . $css_unit . ')\\s*\\)?';
$permissive_match4 = '[\\s|\\(]+(' . $css_unit . ')[,|\\s]+(' . $css_unit . ')[,|\\s]+(' . $css_unit . ')[,|\\s]+(' . $css_unit . ')\\s*\\)?';
$rgb_regexp = '/^rgb' . $permissive_match3 . '$/';
if ( preg_match( $rgb_regexp, $color_str, $match ) ) {
return wp_tinycolor_rgb_to_rgb(
array(
'r' => $match[1],
'g' => $match[2],
'b' => $match[3],
)
);
}
$rgba_regexp = '/^rgba' . $permissive_match4 . '$/';
if ( preg_match( $rgba_regexp, $color_str, $match ) ) {
return wp_tinycolor_rgb_to_rgb(
array(
'r' => $match[1],
'g' => $match[2],
'b' => $match[3],
)
);
}
$hsl_regexp = '/^hsl' . $permissive_match3 . '$/';
if ( preg_match( $hsl_regexp, $color_str, $match ) ) {
return wp_tinycolor_hsl_to_rgb(
array(
'h' => $match[1],
's' => $match[2],
'l' => $match[3],
)
);
}
$hsla_regexp = '/^hsla' . $permissive_match4 . '$/';
if ( preg_match( $hsla_regexp, $color_str, $match ) ) {
return wp_tinycolor_hsl_to_rgb(
array(
'h' => $match[1],
's' => $match[2],
'l' => $match[3],
)
);
}
$hex8_regexp = '/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/';
if ( preg_match( $hex8_regexp, $color_str, $match ) ) {
return wp_tinycolor_rgb_to_rgb(
array(
'r' => base_convert( $match[1], 16, 10 ),
'g' => base_convert( $match[2], 16, 10 ),
'b' => base_convert( $match[3], 16, 10 ),
)
);
}
$hex6_regexp = '/^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/';
if ( preg_match( $hex6_regexp, $color_str, $match ) ) {
return wp_tinycolor_rgb_to_rgb(
array(
'r' => base_convert( $match[1], 16, 10 ),
'g' => base_convert( $match[2], 16, 10 ),
'b' => base_convert( $match[3], 16, 10 ),
)
);
}
$hex4_regexp = '/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/';
if ( preg_match( $hex4_regexp, $color_str, $match ) ) {
return wp_tinycolor_rgb_to_rgb(
array(
'r' => base_convert( $match[1] . $match[1], 16, 10 ),
'g' => base_convert( $match[2] . $match[2], 16, 10 ),
'b' => base_convert( $match[3] . $match[3], 16, 10 ),
)
);
}
$hex3_regexp = '/^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/';
if ( preg_match( $hex3_regexp, $color_str, $match ) ) {
return wp_tinycolor_rgb_to_rgb(
array(
'r' => base_convert( $match[1] . $match[1], 16, 10 ),
'g' => base_convert( $match[2] . $match[2], 16, 10 ),
'b' => base_convert( $match[3] . $match[3], 16, 10 ),
)
);
}
}
/**
* Registers the style and colors block attributes for block types that support it.
*
* @since 5.8.0
* @access private
*
* @param WP_Block_Type $block_type Block Type.
*/
function wp_register_duotone_support( $block_type ) {
$has_duotone_support = false;
if ( property_exists( $block_type, 'supports' ) ) {
$has_duotone_support = _wp_array_get( $block_type->supports, array( 'color', '__experimentalDuotone' ), false );
}
if ( $has_duotone_support ) {
if ( ! $block_type->attributes ) {
$block_type->attributes = array();
}
if ( ! array_key_exists( 'style', $block_type->attributes ) ) {
$block_type->attributes['style'] = array(
'type' => 'object',
);
}
}
}
/**
* Render out the duotone stylesheet and SVG.
*
* @since 5.8.0
* @access private
*
* @param string $block_content Rendered block content.
* @param array $block Block object.
*
* @return string Filtered block content.
*/
function wp_render_duotone_support( $block_content, $block ) {
$block_type = WP_Block_Type_Registry::get_instance()->get_registered( $block['blockName'] );
$duotone_support = false;
if ( $block_type && property_exists( $block_type, 'supports' ) ) {
$duotone_support = _wp_array_get( $block_type->supports, array( 'color', '__experimentalDuotone' ), false );
}
$has_duotone_attribute = isset( $block['attrs']['style']['color']['duotone'] );
if (
! $duotone_support ||
! $has_duotone_attribute
) {
return $block_content;
}
$duotone_colors = $block['attrs']['style']['color']['duotone'];
$duotone_values = array(
'r' => array(),
'g' => array(),
'b' => array(),
);
foreach ( $duotone_colors as $color_str ) {
$color = wp_tinycolor_string_to_rgb( $color_str );
$duotone_values['r'][] = $color['r'] / 255;
$duotone_values['g'][] = $color['g'] / 255;
$duotone_values['b'][] = $color['b'] / 255;
}
$duotone_id = 'wp-duotone-filter-' . uniqid();
$selectors = explode( ',', $duotone_support );
$selectors_scoped = array_map(
static function ( $selector ) use ( $duotone_id ) {
return '.' . $duotone_id . ' ' . trim( $selector );
},
$selectors
);
$selectors_group = implode( ', ', $selectors_scoped );
ob_start();
?>
register(
'duotone',
array(
'register_attribute' => 'wp_register_duotone_support',
)
);
add_filter( 'render_block', 'wp_render_duotone_support', 10, 2 );