first commit
This commit is contained in:
65
wp/wp-includes/block-supports/align.php
Normal file
65
wp/wp-includes/block-supports/align.php
Normal file
@@ -0,0 +1,65 @@
|
||||
<?php
|
||||
/**
|
||||
* Align block support flag.
|
||||
*
|
||||
* @package WordPress
|
||||
* @since 5.6.0
|
||||
*/
|
||||
|
||||
/**
|
||||
* Registers the align block attribute for block types that support it.
|
||||
*
|
||||
* @since 5.6.0
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block Type.
|
||||
*/
|
||||
function wp_register_alignment_support( $block_type ) {
|
||||
$has_align_support = block_has_support( $block_type, array( 'align' ), false );
|
||||
if ( $has_align_support ) {
|
||||
if ( ! $block_type->attributes ) {
|
||||
$block_type->attributes = array();
|
||||
}
|
||||
|
||||
if ( ! array_key_exists( 'align', $block_type->attributes ) ) {
|
||||
$block_type->attributes['align'] = array(
|
||||
'type' => 'string',
|
||||
'enum' => array( 'left', 'center', 'right', 'wide', 'full', '' ),
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Adds CSS classes for block alignment to the incoming attributes array.
|
||||
* This will be applied to the block markup in the front-end.
|
||||
*
|
||||
* @since 5.6.0
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block Type.
|
||||
* @param array $block_attributes Block attributes.
|
||||
* @return array Block alignment CSS classes and inline styles.
|
||||
*/
|
||||
function wp_apply_alignment_support( $block_type, $block_attributes ) {
|
||||
$attributes = array();
|
||||
$has_align_support = block_has_support( $block_type, array( 'align' ), false );
|
||||
if ( $has_align_support ) {
|
||||
$has_block_alignment = array_key_exists( 'align', $block_attributes );
|
||||
|
||||
if ( $has_block_alignment ) {
|
||||
$attributes['class'] = sprintf( 'align%s', $block_attributes['align'] );
|
||||
}
|
||||
}
|
||||
|
||||
return $attributes;
|
||||
}
|
||||
|
||||
// Register the block support.
|
||||
WP_Block_Supports::get_instance()->register(
|
||||
'align',
|
||||
array(
|
||||
'register_attribute' => 'wp_register_alignment_support',
|
||||
'apply' => 'wp_apply_alignment_support',
|
||||
)
|
||||
);
|
||||
174
wp/wp-includes/block-supports/border.php
Normal file
174
wp/wp-includes/block-supports/border.php
Normal file
@@ -0,0 +1,174 @@
|
||||
<?php
|
||||
/**
|
||||
* Border block support flag.
|
||||
*
|
||||
* @package WordPress
|
||||
* @since 5.8.0
|
||||
*/
|
||||
|
||||
/**
|
||||
* Registers the style attribute used by the border feature if needed for block
|
||||
* types that support borders.
|
||||
*
|
||||
* @since 5.8.0
|
||||
* @since 6.1.0 Improved conditional blocks optimization.
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block Type.
|
||||
*/
|
||||
function wp_register_border_support( $block_type ) {
|
||||
// Setup attributes and styles within that if needed.
|
||||
if ( ! $block_type->attributes ) {
|
||||
$block_type->attributes = array();
|
||||
}
|
||||
|
||||
if ( block_has_support( $block_type, array( '__experimentalBorder' ) ) && ! array_key_exists( 'style', $block_type->attributes ) ) {
|
||||
$block_type->attributes['style'] = array(
|
||||
'type' => 'object',
|
||||
);
|
||||
}
|
||||
|
||||
if ( wp_has_border_feature_support( $block_type, 'color' ) && ! array_key_exists( 'borderColor', $block_type->attributes ) ) {
|
||||
$block_type->attributes['borderColor'] = array(
|
||||
'type' => 'string',
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Adds CSS classes and inline styles for border styles to the incoming
|
||||
* attributes array. This will be applied to the block markup in the front-end.
|
||||
*
|
||||
* @since 5.8.0
|
||||
* @since 6.1.0 Implemented the style engine to generate CSS and classnames.
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block type.
|
||||
* @param array $block_attributes Block attributes.
|
||||
* @return array Border CSS classes and inline styles.
|
||||
*/
|
||||
function wp_apply_border_support( $block_type, $block_attributes ) {
|
||||
if ( wp_should_skip_block_supports_serialization( $block_type, 'border' ) ) {
|
||||
return array();
|
||||
}
|
||||
|
||||
$border_block_styles = array();
|
||||
$has_border_color_support = wp_has_border_feature_support( $block_type, 'color' );
|
||||
$has_border_width_support = wp_has_border_feature_support( $block_type, 'width' );
|
||||
|
||||
// Border radius.
|
||||
if (
|
||||
wp_has_border_feature_support( $block_type, 'radius' ) &&
|
||||
isset( $block_attributes['style']['border']['radius'] ) &&
|
||||
! wp_should_skip_block_supports_serialization( $block_type, '__experimentalBorder', 'radius' )
|
||||
) {
|
||||
$border_radius = $block_attributes['style']['border']['radius'];
|
||||
|
||||
if ( is_numeric( $border_radius ) ) {
|
||||
$border_radius .= 'px';
|
||||
}
|
||||
|
||||
$border_block_styles['radius'] = $border_radius;
|
||||
}
|
||||
|
||||
// Border style.
|
||||
if (
|
||||
wp_has_border_feature_support( $block_type, 'style' ) &&
|
||||
isset( $block_attributes['style']['border']['style'] ) &&
|
||||
! wp_should_skip_block_supports_serialization( $block_type, '__experimentalBorder', 'style' )
|
||||
) {
|
||||
$border_block_styles['style'] = $block_attributes['style']['border']['style'];
|
||||
}
|
||||
|
||||
// Border width.
|
||||
if (
|
||||
$has_border_width_support &&
|
||||
isset( $block_attributes['style']['border']['width'] ) &&
|
||||
! wp_should_skip_block_supports_serialization( $block_type, '__experimentalBorder', 'width' )
|
||||
) {
|
||||
$border_width = $block_attributes['style']['border']['width'];
|
||||
|
||||
// This check handles original unitless implementation.
|
||||
if ( is_numeric( $border_width ) ) {
|
||||
$border_width .= 'px';
|
||||
}
|
||||
|
||||
$border_block_styles['width'] = $border_width;
|
||||
}
|
||||
|
||||
// Border color.
|
||||
if (
|
||||
$has_border_color_support &&
|
||||
! wp_should_skip_block_supports_serialization( $block_type, '__experimentalBorder', 'color' )
|
||||
) {
|
||||
$preset_border_color = array_key_exists( 'borderColor', $block_attributes ) ? "var:preset|color|{$block_attributes['borderColor']}" : null;
|
||||
$custom_border_color = _wp_array_get( $block_attributes, array( 'style', 'border', 'color' ), null );
|
||||
$border_block_styles['color'] = $preset_border_color ? $preset_border_color : $custom_border_color;
|
||||
}
|
||||
|
||||
// Generates styles for individual border sides.
|
||||
if ( $has_border_color_support || $has_border_width_support ) {
|
||||
foreach ( array( 'top', 'right', 'bottom', 'left' ) as $side ) {
|
||||
$border = _wp_array_get( $block_attributes, array( 'style', 'border', $side ), null );
|
||||
$border_side_values = array(
|
||||
'width' => isset( $border['width'] ) && ! wp_should_skip_block_supports_serialization( $block_type, '__experimentalBorder', 'width' ) ? $border['width'] : null,
|
||||
'color' => isset( $border['color'] ) && ! wp_should_skip_block_supports_serialization( $block_type, '__experimentalBorder', 'color' ) ? $border['color'] : null,
|
||||
'style' => isset( $border['style'] ) && ! wp_should_skip_block_supports_serialization( $block_type, '__experimentalBorder', 'style' ) ? $border['style'] : null,
|
||||
);
|
||||
$border_block_styles[ $side ] = $border_side_values;
|
||||
}
|
||||
}
|
||||
|
||||
// Collect classes and styles.
|
||||
$attributes = array();
|
||||
$styles = wp_style_engine_get_styles( array( 'border' => $border_block_styles ) );
|
||||
|
||||
if ( ! empty( $styles['classnames'] ) ) {
|
||||
$attributes['class'] = $styles['classnames'];
|
||||
}
|
||||
|
||||
if ( ! empty( $styles['css'] ) ) {
|
||||
$attributes['style'] = $styles['css'];
|
||||
}
|
||||
|
||||
return $attributes;
|
||||
}
|
||||
|
||||
/**
|
||||
* Checks whether the current block type supports the border feature requested.
|
||||
*
|
||||
* If the `__experimentalBorder` support flag is a boolean `true` all border
|
||||
* support features are available. Otherwise, the specific feature's support
|
||||
* flag nested under `experimentalBorder` must be enabled for the feature
|
||||
* to be opted into.
|
||||
*
|
||||
* @since 5.8.0
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block type to check for support.
|
||||
* @param string $feature Name of the feature to check support for.
|
||||
* @param mixed $default_value Fallback value for feature support, defaults to false.
|
||||
* @return bool Whether the feature is supported.
|
||||
*/
|
||||
function wp_has_border_feature_support( $block_type, $feature, $default_value = false ) {
|
||||
// Check if all border support features have been opted into via `"__experimentalBorder": true`.
|
||||
if (
|
||||
property_exists( $block_type, 'supports' ) &&
|
||||
( true === _wp_array_get( $block_type->supports, array( '__experimentalBorder' ), $default_value ) )
|
||||
) {
|
||||
return true;
|
||||
}
|
||||
|
||||
// Check if the specific feature has been opted into individually
|
||||
// via nested flag under `__experimentalBorder`.
|
||||
return block_has_support( $block_type, array( '__experimentalBorder', $feature ), $default_value );
|
||||
}
|
||||
|
||||
// Register the block support.
|
||||
WP_Block_Supports::get_instance()->register(
|
||||
'border',
|
||||
array(
|
||||
'register_attribute' => 'wp_register_border_support',
|
||||
'apply' => 'wp_apply_border_support',
|
||||
)
|
||||
);
|
||||
129
wp/wp-includes/block-supports/colors.php
Normal file
129
wp/wp-includes/block-supports/colors.php
Normal file
@@ -0,0 +1,129 @@
|
||||
<?php
|
||||
/**
|
||||
* Colors block support flag.
|
||||
*
|
||||
* @package WordPress
|
||||
* @since 5.6.0
|
||||
*/
|
||||
|
||||
/**
|
||||
* Registers the style and colors block attributes for block types that support it.
|
||||
*
|
||||
* @since 5.6.0
|
||||
* @since 6.1.0 Improved $color_support assignment optimization.
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block Type.
|
||||
*/
|
||||
function wp_register_colors_support( $block_type ) {
|
||||
$color_support = property_exists( $block_type, 'supports' ) ? _wp_array_get( $block_type->supports, array( 'color' ), false ) : false;
|
||||
$has_text_colors_support = true === $color_support || ( is_array( $color_support ) && _wp_array_get( $color_support, array( 'text' ), true ) );
|
||||
$has_background_colors_support = true === $color_support || ( is_array( $color_support ) && _wp_array_get( $color_support, array( 'background' ), true ) );
|
||||
$has_gradients_support = _wp_array_get( $color_support, array( 'gradients' ), false );
|
||||
$has_link_colors_support = _wp_array_get( $color_support, array( 'link' ), false );
|
||||
$has_color_support = $has_text_colors_support ||
|
||||
$has_background_colors_support ||
|
||||
$has_gradients_support ||
|
||||
$has_link_colors_support;
|
||||
|
||||
if ( ! $block_type->attributes ) {
|
||||
$block_type->attributes = array();
|
||||
}
|
||||
|
||||
if ( $has_color_support && ! array_key_exists( 'style', $block_type->attributes ) ) {
|
||||
$block_type->attributes['style'] = array(
|
||||
'type' => 'object',
|
||||
);
|
||||
}
|
||||
|
||||
if ( $has_background_colors_support && ! array_key_exists( 'backgroundColor', $block_type->attributes ) ) {
|
||||
$block_type->attributes['backgroundColor'] = array(
|
||||
'type' => 'string',
|
||||
);
|
||||
}
|
||||
|
||||
if ( $has_text_colors_support && ! array_key_exists( 'textColor', $block_type->attributes ) ) {
|
||||
$block_type->attributes['textColor'] = array(
|
||||
'type' => 'string',
|
||||
);
|
||||
}
|
||||
|
||||
if ( $has_gradients_support && ! array_key_exists( 'gradient', $block_type->attributes ) ) {
|
||||
$block_type->attributes['gradient'] = array(
|
||||
'type' => 'string',
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Adds CSS classes and inline styles for colors to the incoming attributes array.
|
||||
* This will be applied to the block markup in the front-end.
|
||||
*
|
||||
* @since 5.6.0
|
||||
* @since 6.1.0 Implemented the style engine to generate CSS and classnames.
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block type.
|
||||
* @param array $block_attributes Block attributes.
|
||||
*
|
||||
* @return array Colors CSS classes and inline styles.
|
||||
*/
|
||||
function wp_apply_colors_support( $block_type, $block_attributes ) {
|
||||
$color_support = _wp_array_get( $block_type->supports, array( 'color' ), false );
|
||||
|
||||
if (
|
||||
is_array( $color_support ) &&
|
||||
wp_should_skip_block_supports_serialization( $block_type, 'color' )
|
||||
) {
|
||||
return array();
|
||||
}
|
||||
|
||||
$has_text_colors_support = true === $color_support || ( is_array( $color_support ) && _wp_array_get( $color_support, array( 'text' ), true ) );
|
||||
$has_background_colors_support = true === $color_support || ( is_array( $color_support ) && _wp_array_get( $color_support, array( 'background' ), true ) );
|
||||
$has_gradients_support = _wp_array_get( $color_support, array( 'gradients' ), false );
|
||||
$color_block_styles = array();
|
||||
|
||||
// Text colors.
|
||||
if ( $has_text_colors_support && ! wp_should_skip_block_supports_serialization( $block_type, 'color', 'text' ) ) {
|
||||
$preset_text_color = array_key_exists( 'textColor', $block_attributes ) ? "var:preset|color|{$block_attributes['textColor']}" : null;
|
||||
$custom_text_color = _wp_array_get( $block_attributes, array( 'style', 'color', 'text' ), null );
|
||||
$color_block_styles['text'] = $preset_text_color ? $preset_text_color : $custom_text_color;
|
||||
}
|
||||
|
||||
// Background colors.
|
||||
if ( $has_background_colors_support && ! wp_should_skip_block_supports_serialization( $block_type, 'color', 'background' ) ) {
|
||||
$preset_background_color = array_key_exists( 'backgroundColor', $block_attributes ) ? "var:preset|color|{$block_attributes['backgroundColor']}" : null;
|
||||
$custom_background_color = _wp_array_get( $block_attributes, array( 'style', 'color', 'background' ), null );
|
||||
$color_block_styles['background'] = $preset_background_color ? $preset_background_color : $custom_background_color;
|
||||
}
|
||||
|
||||
// Gradients.
|
||||
if ( $has_gradients_support && ! wp_should_skip_block_supports_serialization( $block_type, 'color', 'gradients' ) ) {
|
||||
$preset_gradient_color = array_key_exists( 'gradient', $block_attributes ) ? "var:preset|gradient|{$block_attributes['gradient']}" : null;
|
||||
$custom_gradient_color = _wp_array_get( $block_attributes, array( 'style', 'color', 'gradient' ), null );
|
||||
$color_block_styles['gradient'] = $preset_gradient_color ? $preset_gradient_color : $custom_gradient_color;
|
||||
}
|
||||
|
||||
$attributes = array();
|
||||
$styles = wp_style_engine_get_styles( array( 'color' => $color_block_styles ), array( 'convert_vars_to_classnames' => true ) );
|
||||
|
||||
if ( ! empty( $styles['classnames'] ) ) {
|
||||
$attributes['class'] = $styles['classnames'];
|
||||
}
|
||||
|
||||
if ( ! empty( $styles['css'] ) ) {
|
||||
$attributes['style'] = $styles['css'];
|
||||
}
|
||||
|
||||
return $attributes;
|
||||
}
|
||||
|
||||
// Register the block support.
|
||||
WP_Block_Supports::get_instance()->register(
|
||||
'colors',
|
||||
array(
|
||||
'register_attribute' => 'wp_register_colors_support',
|
||||
'apply' => 'wp_apply_colors_support',
|
||||
)
|
||||
);
|
||||
65
wp/wp-includes/block-supports/custom-classname.php
Normal file
65
wp/wp-includes/block-supports/custom-classname.php
Normal file
@@ -0,0 +1,65 @@
|
||||
<?php
|
||||
/**
|
||||
* Custom classname block support flag.
|
||||
*
|
||||
* @package WordPress
|
||||
* @since 5.6.0
|
||||
*/
|
||||
|
||||
/**
|
||||
* Registers the custom classname block attribute for block types that support it.
|
||||
*
|
||||
* @since 5.6.0
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block Type.
|
||||
*/
|
||||
function wp_register_custom_classname_support( $block_type ) {
|
||||
$has_custom_classname_support = block_has_support( $block_type, array( 'customClassName' ), true );
|
||||
|
||||
if ( $has_custom_classname_support ) {
|
||||
if ( ! $block_type->attributes ) {
|
||||
$block_type->attributes = array();
|
||||
}
|
||||
|
||||
if ( ! array_key_exists( 'className', $block_type->attributes ) ) {
|
||||
$block_type->attributes['className'] = array(
|
||||
'type' => 'string',
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Adds the custom classnames to the output.
|
||||
*
|
||||
* @since 5.6.0
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block Type.
|
||||
* @param array $block_attributes Block attributes.
|
||||
*
|
||||
* @return array Block CSS classes and inline styles.
|
||||
*/
|
||||
function wp_apply_custom_classname_support( $block_type, $block_attributes ) {
|
||||
$has_custom_classname_support = block_has_support( $block_type, array( 'customClassName' ), true );
|
||||
$attributes = array();
|
||||
if ( $has_custom_classname_support ) {
|
||||
$has_custom_classnames = array_key_exists( 'className', $block_attributes );
|
||||
|
||||
if ( $has_custom_classnames ) {
|
||||
$attributes['class'] = $block_attributes['className'];
|
||||
}
|
||||
}
|
||||
|
||||
return $attributes;
|
||||
}
|
||||
|
||||
// Register the block support.
|
||||
WP_Block_Supports::get_instance()->register(
|
||||
'custom-classname',
|
||||
array(
|
||||
'register_attribute' => 'wp_register_custom_classname_support',
|
||||
'apply' => 'wp_apply_custom_classname_support',
|
||||
)
|
||||
);
|
||||
88
wp/wp-includes/block-supports/dimensions.php
Normal file
88
wp/wp-includes/block-supports/dimensions.php
Normal file
@@ -0,0 +1,88 @@
|
||||
<?php
|
||||
/**
|
||||
* Dimensions block support flag.
|
||||
*
|
||||
* This does not include the `spacing` block support even though that visually
|
||||
* appears under the "Dimensions" panel in the editor. It remains in its
|
||||
* original `spacing.php` file for compatibility with core.
|
||||
*
|
||||
* @package WordPress
|
||||
* @since 5.9.0
|
||||
*/
|
||||
|
||||
/**
|
||||
* Registers the style block attribute for block types that support it.
|
||||
*
|
||||
* @since 5.9.0
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block Type.
|
||||
*/
|
||||
function wp_register_dimensions_support( $block_type ) {
|
||||
// Setup attributes and styles within that if needed.
|
||||
if ( ! $block_type->attributes ) {
|
||||
$block_type->attributes = array();
|
||||
}
|
||||
|
||||
// Check for existing style attribute definition e.g. from block.json.
|
||||
if ( array_key_exists( 'style', $block_type->attributes ) ) {
|
||||
return;
|
||||
}
|
||||
|
||||
$has_dimensions_support = block_has_support( $block_type, array( 'dimensions' ), false );
|
||||
|
||||
if ( $has_dimensions_support ) {
|
||||
$block_type->attributes['style'] = array(
|
||||
'type' => 'object',
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Adds CSS classes for block dimensions to the incoming attributes array.
|
||||
* This will be applied to the block markup in the front-end.
|
||||
*
|
||||
* @since 5.9.0
|
||||
* @since 6.2.0 Added `minHeight` support.
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block Type.
|
||||
* @param array $block_attributes Block attributes.
|
||||
* @return array Block dimensions CSS classes and inline styles.
|
||||
*/
|
||||
function wp_apply_dimensions_support( $block_type, $block_attributes ) { // phpcs:ignore VariableAnalysis.CodeAnalysis.VariableAnalysis.UnusedVariable
|
||||
if ( wp_should_skip_block_supports_serialization( $block_type, 'dimensions' ) ) {
|
||||
return array();
|
||||
}
|
||||
|
||||
$attributes = array();
|
||||
|
||||
// Width support to be added in near future.
|
||||
|
||||
$has_min_height_support = block_has_support( $block_type, array( 'dimensions', 'minHeight' ), false );
|
||||
$block_styles = isset( $block_attributes['style'] ) ? $block_attributes['style'] : null;
|
||||
|
||||
if ( ! $block_styles ) {
|
||||
return $attributes;
|
||||
}
|
||||
|
||||
$skip_min_height = wp_should_skip_block_supports_serialization( $block_type, 'dimensions', 'minHeight' );
|
||||
$dimensions_block_styles = array();
|
||||
$dimensions_block_styles['minHeight'] = $has_min_height_support && ! $skip_min_height ? _wp_array_get( $block_styles, array( 'dimensions', 'minHeight' ), null ) : null;
|
||||
$styles = wp_style_engine_get_styles( array( 'dimensions' => $dimensions_block_styles ) );
|
||||
|
||||
if ( ! empty( $styles['css'] ) ) {
|
||||
$attributes['style'] = $styles['css'];
|
||||
}
|
||||
|
||||
return $attributes;
|
||||
}
|
||||
|
||||
// Register the block support.
|
||||
WP_Block_Supports::get_instance()->register(
|
||||
'dimensions',
|
||||
array(
|
||||
'register_attribute' => 'wp_register_dimensions_support',
|
||||
'apply' => 'wp_apply_dimensions_support',
|
||||
)
|
||||
);
|
||||
597
wp/wp-includes/block-supports/duotone.php
Normal file
597
wp/wp-includes/block-supports/duotone.php
Normal file
@@ -0,0 +1,597 @@
|
||||
<?php
|
||||
/**
|
||||
* Duotone block support flag.
|
||||
*
|
||||
* Parts of this source were derived and modified from TinyColor,
|
||||
* released under the MIT license.
|
||||
*
|
||||
* https://github.com/bgrins/TinyColor
|
||||
*
|
||||
* Copyright (c), Brian Grinstead, http://briangrinstead.com
|
||||
*
|
||||
* Permission is hereby granted, free of charge, to any person obtaining
|
||||
* a copy of this software and associated documentation files (the
|
||||
* "Software"), to deal in the Software without restriction, including
|
||||
* without limitation the rights to use, copy, modify, merge, publish,
|
||||
* distribute, sublicense, and/or sell copies of the Software, and to
|
||||
* permit persons to whom the Software is furnished to do so, subject to
|
||||
* the following conditions:
|
||||
*
|
||||
* The above copyright notice and this permission notice shall be
|
||||
* included in all copies or substantial portions of the Software.
|
||||
*
|
||||
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
* EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
||||
* MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
||||
* NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
||||
* LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
||||
* OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
||||
* WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
*
|
||||
* @package WordPress
|
||||
* @since 5.8.0
|
||||
*/
|
||||
|
||||
/**
|
||||
* Takes input from [0, n] and returns it as [0, 1].
|
||||
*
|
||||
* 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 mixed $n Number of unknown type.
|
||||
* @param int $max Upper value of the range to bound to.
|
||||
* @return float Value in the range [0, 1].
|
||||
*/
|
||||
function wp_tinycolor_bound01( $n, $max ) {
|
||||
if ( 'string' === gettype( $n ) && false !== strpos( $n, '.' ) && 1 === (float) $n ) {
|
||||
$n = '100%';
|
||||
}
|
||||
|
||||
$n = min( $max, max( 0, (float) $n ) );
|
||||
|
||||
// Automatically convert percentage into number.
|
||||
if ( 'string' === gettype( $n ) && false !== strpos( $n, '%' ) ) {
|
||||
$n = (int) ( $n * $max ) / 100;
|
||||
}
|
||||
|
||||
// Handle floating point rounding errors.
|
||||
if ( ( abs( $n - $max ) < 0.000001 ) ) {
|
||||
return 1.0;
|
||||
}
|
||||
|
||||
// Convert into [0, 1] range if it isn't already.
|
||||
return ( $n % $max ) / (float) $max;
|
||||
}
|
||||
|
||||
/**
|
||||
* Direct port of tinycolor's boundAlpha function to maintain consistency with
|
||||
* how tinycolor works.
|
||||
*
|
||||
* @see https://github.com/bgrins/TinyColor
|
||||
*
|
||||
* @since 5.9.0
|
||||
* @access private
|
||||
*
|
||||
* @param mixed $n Number of unknown type.
|
||||
* @return float Value in the range [0,1].
|
||||
*/
|
||||
function _wp_tinycolor_bound_alpha( $n ) {
|
||||
if ( is_numeric( $n ) ) {
|
||||
$n = (float) $n;
|
||||
if ( $n >= 0 && $n <= 1 ) {
|
||||
return $n;
|
||||
}
|
||||
}
|
||||
return 1;
|
||||
}
|
||||
|
||||
/**
|
||||
* Rounds and converts values of an RGB object.
|
||||
*
|
||||
* 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 $rgb_color RGB object.
|
||||
* @return array Rounded and converted RGB object.
|
||||
*/
|
||||
function wp_tinycolor_rgb_to_rgb( $rgb_color ) {
|
||||
return array(
|
||||
'r' => 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;
|
||||
}
|
||||
if ( $t > 1 ) {
|
||||
--$t;
|
||||
}
|
||||
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;
|
||||
}
|
||||
|
||||
/**
|
||||
* Converts 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.
|
||||
*
|
||||
* 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
|
||||
* @since 5.9.0 Added alpha processing.
|
||||
* @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 ) ) {
|
||||
$rgb = wp_tinycolor_rgb_to_rgb(
|
||||
array(
|
||||
'r' => $match[1],
|
||||
'g' => $match[2],
|
||||
'b' => $match[3],
|
||||
)
|
||||
);
|
||||
|
||||
$rgb['a'] = 1;
|
||||
|
||||
return $rgb;
|
||||
}
|
||||
|
||||
$rgba_regexp = '/^rgba' . $permissive_match4 . '$/';
|
||||
if ( preg_match( $rgba_regexp, $color_str, $match ) ) {
|
||||
$rgb = wp_tinycolor_rgb_to_rgb(
|
||||
array(
|
||||
'r' => $match[1],
|
||||
'g' => $match[2],
|
||||
'b' => $match[3],
|
||||
)
|
||||
);
|
||||
|
||||
$rgb['a'] = _wp_tinycolor_bound_alpha( $match[4] );
|
||||
|
||||
return $rgb;
|
||||
}
|
||||
|
||||
$hsl_regexp = '/^hsl' . $permissive_match3 . '$/';
|
||||
if ( preg_match( $hsl_regexp, $color_str, $match ) ) {
|
||||
$rgb = wp_tinycolor_hsl_to_rgb(
|
||||
array(
|
||||
'h' => $match[1],
|
||||
's' => $match[2],
|
||||
'l' => $match[3],
|
||||
)
|
||||
);
|
||||
|
||||
$rgb['a'] = 1;
|
||||
|
||||
return $rgb;
|
||||
}
|
||||
|
||||
$hsla_regexp = '/^hsla' . $permissive_match4 . '$/';
|
||||
if ( preg_match( $hsla_regexp, $color_str, $match ) ) {
|
||||
$rgb = wp_tinycolor_hsl_to_rgb(
|
||||
array(
|
||||
'h' => $match[1],
|
||||
's' => $match[2],
|
||||
'l' => $match[3],
|
||||
)
|
||||
);
|
||||
|
||||
$rgb['a'] = _wp_tinycolor_bound_alpha( $match[4] );
|
||||
|
||||
return $rgb;
|
||||
}
|
||||
|
||||
$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 ) ) {
|
||||
$rgb = 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 ),
|
||||
)
|
||||
);
|
||||
|
||||
$rgb['a'] = _wp_tinycolor_bound_alpha(
|
||||
base_convert( $match[4], 16, 10 ) / 255
|
||||
);
|
||||
|
||||
return $rgb;
|
||||
}
|
||||
|
||||
$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 ) ) {
|
||||
$rgb = 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 ),
|
||||
)
|
||||
);
|
||||
|
||||
$rgb['a'] = 1;
|
||||
|
||||
return $rgb;
|
||||
}
|
||||
|
||||
$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 ) ) {
|
||||
$rgb = 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 ),
|
||||
)
|
||||
);
|
||||
|
||||
$rgb['a'] = _wp_tinycolor_bound_alpha(
|
||||
base_convert( $match[4] . $match[4], 16, 10 ) / 255
|
||||
);
|
||||
|
||||
return $rgb;
|
||||
}
|
||||
|
||||
$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 ) ) {
|
||||
$rgb = 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 ),
|
||||
)
|
||||
);
|
||||
|
||||
$rgb['a'] = 1;
|
||||
|
||||
return $rgb;
|
||||
}
|
||||
|
||||
/*
|
||||
* The JS color picker considers the string "transparent" to be a hex value,
|
||||
* so we need to handle it here as a special case.
|
||||
*/
|
||||
if ( 'transparent' === $color_str ) {
|
||||
return array(
|
||||
'r' => 0,
|
||||
'g' => 0,
|
||||
'b' => 0,
|
||||
'a' => 0,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns the prefixed id for the duotone filter for use as a CSS id.
|
||||
*
|
||||
* @since 5.9.1
|
||||
* @access private
|
||||
*
|
||||
* @param array $preset Duotone preset value as seen in theme.json.
|
||||
* @return string Duotone filter CSS id.
|
||||
*/
|
||||
function wp_get_duotone_filter_id( $preset ) {
|
||||
if ( ! isset( $preset['slug'] ) ) {
|
||||
return '';
|
||||
}
|
||||
|
||||
return 'wp-duotone-' . $preset['slug'];
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns the CSS filter property url to reference the rendered SVG.
|
||||
*
|
||||
* @since 5.9.0
|
||||
* @since 6.1.0 Allow unset for preset colors.
|
||||
* @access private
|
||||
*
|
||||
* @param array $preset Duotone preset value as seen in theme.json.
|
||||
* @return string Duotone CSS filter property url value.
|
||||
*/
|
||||
function wp_get_duotone_filter_property( $preset ) {
|
||||
if ( isset( $preset['colors'] ) && 'unset' === $preset['colors'] ) {
|
||||
return 'none';
|
||||
}
|
||||
$filter_id = wp_get_duotone_filter_id( $preset );
|
||||
return "url('#" . $filter_id . "')";
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns the duotone filter SVG string for the preset.
|
||||
*
|
||||
* @since 5.9.1
|
||||
* @access private
|
||||
*
|
||||
* @param array $preset Duotone preset value as seen in theme.json.
|
||||
* @return string Duotone SVG filter.
|
||||
*/
|
||||
function wp_get_duotone_filter_svg( $preset ) {
|
||||
$filter_id = wp_get_duotone_filter_id( $preset );
|
||||
|
||||
$duotone_values = array(
|
||||
'r' => array(),
|
||||
'g' => array(),
|
||||
'b' => array(),
|
||||
'a' => array(),
|
||||
);
|
||||
|
||||
if ( ! isset( $preset['colors'] ) || ! is_array( $preset['colors'] ) ) {
|
||||
$preset['colors'] = array();
|
||||
}
|
||||
|
||||
foreach ( $preset['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_values['a'][] = $color['a'];
|
||||
}
|
||||
|
||||
ob_start();
|
||||
|
||||
?>
|
||||
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 0 0"
|
||||
width="0"
|
||||
height="0"
|
||||
focusable="false"
|
||||
role="none"
|
||||
style="visibility: hidden; position: absolute; left: -9999px; overflow: hidden;"
|
||||
>
|
||||
<defs>
|
||||
<filter id="<?php echo esc_attr( $filter_id ); ?>">
|
||||
<feColorMatrix
|
||||
color-interpolation-filters="sRGB"
|
||||
type="matrix"
|
||||
values="
|
||||
.299 .587 .114 0 0
|
||||
.299 .587 .114 0 0
|
||||
.299 .587 .114 0 0
|
||||
.299 .587 .114 0 0
|
||||
"
|
||||
/>
|
||||
<feComponentTransfer color-interpolation-filters="sRGB" >
|
||||
<feFuncR type="table" tableValues="<?php echo esc_attr( implode( ' ', $duotone_values['r'] ) ); ?>" />
|
||||
<feFuncG type="table" tableValues="<?php echo esc_attr( implode( ' ', $duotone_values['g'] ) ); ?>" />
|
||||
<feFuncB type="table" tableValues="<?php echo esc_attr( implode( ' ', $duotone_values['b'] ) ); ?>" />
|
||||
<feFuncA type="table" tableValues="<?php echo esc_attr( implode( ' ', $duotone_values['a'] ) ); ?>" />
|
||||
</feComponentTransfer>
|
||||
<feComposite in2="SourceGraphic" operator="in" />
|
||||
</filter>
|
||||
</defs>
|
||||
</svg>
|
||||
|
||||
<?php
|
||||
|
||||
$svg = ob_get_clean();
|
||||
|
||||
if ( ! SCRIPT_DEBUG ) {
|
||||
// Clean up the whitespace.
|
||||
$svg = preg_replace( "/[\r\n\t ]+/", ' ', $svg );
|
||||
$svg = str_replace( '> <', '><', $svg );
|
||||
$svg = trim( $svg );
|
||||
}
|
||||
|
||||
return $svg;
|
||||
}
|
||||
|
||||
/**
|
||||
* 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',
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Renders out the duotone stylesheet and SVG.
|
||||
*
|
||||
* @since 5.8.0
|
||||
* @since 6.1.0 Allow unset for preset colors.
|
||||
* @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;
|
||||
}
|
||||
|
||||
$colors = $block['attrs']['style']['color']['duotone'];
|
||||
$filter_key = is_array( $colors ) ? implode( '-', $colors ) : $colors;
|
||||
$filter_preset = array(
|
||||
'slug' => wp_unique_id( sanitize_key( $filter_key . '-' ) ),
|
||||
'colors' => $colors,
|
||||
);
|
||||
$filter_property = wp_get_duotone_filter_property( $filter_preset );
|
||||
$filter_id = wp_get_duotone_filter_id( $filter_preset );
|
||||
|
||||
$scope = '.' . $filter_id;
|
||||
$selectors = explode( ',', $duotone_support );
|
||||
$scoped = array();
|
||||
foreach ( $selectors as $sel ) {
|
||||
$scoped[] = $scope . ' ' . trim( $sel );
|
||||
}
|
||||
$selector = implode( ', ', $scoped );
|
||||
|
||||
// !important is needed because these styles render before global styles,
|
||||
// and they should be overriding the duotone filters set by global styles.
|
||||
$filter_style = SCRIPT_DEBUG
|
||||
? $selector . " {\n\tfilter: " . $filter_property . " !important;\n}\n"
|
||||
: $selector . '{filter:' . $filter_property . ' !important;}';
|
||||
|
||||
wp_register_style( $filter_id, false );
|
||||
wp_add_inline_style( $filter_id, $filter_style );
|
||||
wp_enqueue_style( $filter_id );
|
||||
|
||||
if ( 'unset' !== $colors ) {
|
||||
$filter_svg = wp_get_duotone_filter_svg( $filter_preset );
|
||||
add_action(
|
||||
'wp_footer',
|
||||
static function () use ( $filter_svg, $selector ) {
|
||||
echo $filter_svg;
|
||||
|
||||
/*
|
||||
* Safari renders elements incorrectly on first paint when the
|
||||
* SVG filter comes after the content that it is filtering, so
|
||||
* we force a repaint with a WebKit hack which solves the issue.
|
||||
*/
|
||||
global $is_safari;
|
||||
if ( $is_safari ) {
|
||||
/*
|
||||
* Simply accessing el.offsetHeight flushes layout and style
|
||||
* changes in WebKit without having to wait for setTimeout.
|
||||
*/
|
||||
printf(
|
||||
'<script>( function() { var el = document.querySelector( %s ); var display = el.style.display; el.style.display = "none"; el.offsetHeight; el.style.display = display; } )();</script>',
|
||||
wp_json_encode( $selector )
|
||||
);
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
// Like the layout hook, this assumes the hook only applies to blocks with a single wrapper.
|
||||
return preg_replace(
|
||||
'/' . preg_quote( 'class="', '/' ) . '/',
|
||||
'class="' . $filter_id . ' ',
|
||||
$block_content,
|
||||
1
|
||||
);
|
||||
}
|
||||
|
||||
// Register the block support.
|
||||
WP_Block_Supports::get_instance()->register(
|
||||
'duotone',
|
||||
array(
|
||||
'register_attribute' => 'wp_register_duotone_support',
|
||||
)
|
||||
);
|
||||
add_filter( 'render_block', 'wp_render_duotone_support', 10, 2 );
|
||||
111
wp/wp-includes/block-supports/elements.php
Normal file
111
wp/wp-includes/block-supports/elements.php
Normal file
@@ -0,0 +1,111 @@
|
||||
<?php
|
||||
/**
|
||||
* Elements styles block support.
|
||||
*
|
||||
* @package WordPress
|
||||
* @since 5.8.0
|
||||
*/
|
||||
|
||||
/**
|
||||
* Gets the elements class names.
|
||||
*
|
||||
* @since 6.0.0
|
||||
* @access private
|
||||
*
|
||||
* @param array $block Block object.
|
||||
* @return string The unique class name.
|
||||
*/
|
||||
function wp_get_elements_class_name( $block ) {
|
||||
return 'wp-elements-' . md5( serialize( $block ) );
|
||||
}
|
||||
|
||||
/**
|
||||
* Updates the block content with elements class names.
|
||||
*
|
||||
* @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_elements_support( $block_content, $block ) {
|
||||
if ( ! $block_content ) {
|
||||
return $block_content;
|
||||
}
|
||||
|
||||
$block_type = WP_Block_Type_Registry::get_instance()->get_registered( $block['blockName'] );
|
||||
$skip_link_color_serialization = wp_should_skip_block_supports_serialization( $block_type, 'color', 'link' );
|
||||
|
||||
if ( $skip_link_color_serialization ) {
|
||||
return $block_content;
|
||||
}
|
||||
|
||||
$link_color = null;
|
||||
if ( ! empty( $block['attrs'] ) ) {
|
||||
$link_color = _wp_array_get( $block['attrs'], array( 'style', 'elements', 'link', 'color', 'text' ), null );
|
||||
}
|
||||
|
||||
/*
|
||||
* For now we only care about link color.
|
||||
* This code in the future when we have a public API
|
||||
* should take advantage of WP_Theme_JSON::compute_style_properties
|
||||
* and work for any element and style.
|
||||
*/
|
||||
if ( null === $link_color ) {
|
||||
return $block_content;
|
||||
}
|
||||
|
||||
// Like the layout hook this assumes the hook only applies to blocks with a single wrapper.
|
||||
// Add the class name to the first element, presuming it's the wrapper, if it exists.
|
||||
$tags = new WP_HTML_Tag_Processor( $block_content );
|
||||
if ( $tags->next_tag() ) {
|
||||
$tags->add_class( wp_get_elements_class_name( $block ) );
|
||||
}
|
||||
|
||||
return $tags->get_updated_html();
|
||||
}
|
||||
|
||||
/**
|
||||
* Renders the elements stylesheet.
|
||||
*
|
||||
* In the case of nested blocks we want the parent element styles to be rendered before their descendants.
|
||||
* This solves the issue of an element (e.g.: link color) being styled in both the parent and a descendant:
|
||||
* we want the descendant style to take priority, and this is done by loading it after, in DOM order.
|
||||
*
|
||||
* @since 6.0.0
|
||||
* @since 6.1.0 Implemented the style engine to generate CSS and classnames.
|
||||
* @access private
|
||||
*
|
||||
* @param string|null $pre_render The pre-rendered content. Default null.
|
||||
* @param array $block The block being rendered.
|
||||
* @return null
|
||||
*/
|
||||
function wp_render_elements_support_styles( $pre_render, $block ) {
|
||||
$block_type = WP_Block_Type_Registry::get_instance()->get_registered( $block['blockName'] );
|
||||
$element_block_styles = isset( $block['attrs']['style']['elements'] ) ? $block['attrs']['style']['elements'] : null;
|
||||
|
||||
/*
|
||||
* For now we only care about link color.
|
||||
*/
|
||||
$skip_link_color_serialization = wp_should_skip_block_supports_serialization( $block_type, 'color', 'link' );
|
||||
|
||||
if ( $skip_link_color_serialization ) {
|
||||
return null;
|
||||
}
|
||||
$class_name = wp_get_elements_class_name( $block );
|
||||
$link_block_styles = isset( $element_block_styles['link'] ) ? $element_block_styles['link'] : null;
|
||||
|
||||
wp_style_engine_get_styles(
|
||||
$link_block_styles,
|
||||
array(
|
||||
'selector' => ".$class_name a",
|
||||
'context' => 'block-supports',
|
||||
)
|
||||
);
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
add_filter( 'render_block', 'wp_render_elements_support', 10, 2 );
|
||||
add_filter( 'pre_render_block', 'wp_render_elements_support_styles', 10, 2 );
|
||||
71
wp/wp-includes/block-supports/generated-classname.php
Normal file
71
wp/wp-includes/block-supports/generated-classname.php
Normal file
@@ -0,0 +1,71 @@
|
||||
<?php
|
||||
/**
|
||||
* Generated classname block support flag.
|
||||
*
|
||||
* @package WordPress
|
||||
* @since 5.6.0
|
||||
*/
|
||||
|
||||
/**
|
||||
* Gets the generated classname from a given block name.
|
||||
*
|
||||
* @since 5.6.0
|
||||
*
|
||||
* @access private
|
||||
*
|
||||
* @param string $block_name Block Name.
|
||||
* @return string Generated classname.
|
||||
*/
|
||||
function wp_get_block_default_classname( $block_name ) {
|
||||
// Generated HTML classes for blocks follow the `wp-block-{name}` nomenclature.
|
||||
// Blocks provided by WordPress drop the prefixes 'core/' or 'core-' (historically used in 'core-embed/').
|
||||
$classname = 'wp-block-' . preg_replace(
|
||||
'/^core-/',
|
||||
'',
|
||||
str_replace( '/', '-', $block_name )
|
||||
);
|
||||
|
||||
/**
|
||||
* Filters the default block className for server rendered blocks.
|
||||
*
|
||||
* @since 5.6.0
|
||||
*
|
||||
* @param string $class_name The current applied classname.
|
||||
* @param string $block_name The block name.
|
||||
*/
|
||||
$classname = apply_filters( 'block_default_classname', $classname, $block_name );
|
||||
|
||||
return $classname;
|
||||
}
|
||||
|
||||
/**
|
||||
* Adds the generated classnames to the output.
|
||||
*
|
||||
* @since 5.6.0
|
||||
*
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block Type.
|
||||
* @return array Block CSS classes and inline styles.
|
||||
*/
|
||||
function wp_apply_generated_classname_support( $block_type ) {
|
||||
$attributes = array();
|
||||
$has_generated_classname_support = block_has_support( $block_type, array( 'className' ), true );
|
||||
if ( $has_generated_classname_support ) {
|
||||
$block_classname = wp_get_block_default_classname( $block_type->name );
|
||||
|
||||
if ( $block_classname ) {
|
||||
$attributes['class'] = $block_classname;
|
||||
}
|
||||
}
|
||||
|
||||
return $attributes;
|
||||
}
|
||||
|
||||
// Register the block support.
|
||||
WP_Block_Supports::get_instance()->register(
|
||||
'generated-classname',
|
||||
array(
|
||||
'apply' => 'wp_apply_generated_classname_support',
|
||||
)
|
||||
);
|
||||
633
wp/wp-includes/block-supports/layout.php
Normal file
633
wp/wp-includes/block-supports/layout.php
Normal file
@@ -0,0 +1,633 @@
|
||||
<?php
|
||||
/**
|
||||
* Layout block support flag.
|
||||
*
|
||||
* @package WordPress
|
||||
* @since 5.8.0
|
||||
*/
|
||||
|
||||
/**
|
||||
* Registers the layout block attribute for block types that support it.
|
||||
*
|
||||
* @since 5.8.0
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block Type.
|
||||
*/
|
||||
function wp_register_layout_support( $block_type ) {
|
||||
$support_layout = block_has_support( $block_type, array( '__experimentalLayout' ), false );
|
||||
if ( $support_layout ) {
|
||||
if ( ! $block_type->attributes ) {
|
||||
$block_type->attributes = array();
|
||||
}
|
||||
|
||||
if ( ! array_key_exists( 'layout', $block_type->attributes ) ) {
|
||||
$block_type->attributes['layout'] = array(
|
||||
'type' => 'object',
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Generates the CSS corresponding to the provided layout.
|
||||
*
|
||||
* @since 5.9.0
|
||||
* @since 6.1.0 Added `$block_spacing` param, use style engine to enqueue styles.
|
||||
* @access private
|
||||
*
|
||||
* @param string $selector CSS selector.
|
||||
* @param array $layout Layout object. The one that is passed has already checked
|
||||
* the existence of default block layout.
|
||||
* @param bool $has_block_gap_support Optional. Whether the theme has support for the block gap. Default false.
|
||||
* @param string|string[]|null $gap_value Optional. The block gap value to apply. Default null.
|
||||
* @param bool $should_skip_gap_serialization Optional. Whether to skip applying the user-defined value set in the editor. Default false.
|
||||
* @param string $fallback_gap_value Optional. The block gap value to apply. Default '0.5em'.
|
||||
* @param array|null $block_spacing Optional. Custom spacing set on the block. Default null.
|
||||
* @return string CSS styles on success. Else, empty string.
|
||||
*/
|
||||
function wp_get_layout_style( $selector, $layout, $has_block_gap_support = false, $gap_value = null, $should_skip_gap_serialization = false, $fallback_gap_value = '0.5em', $block_spacing = null ) {
|
||||
$layout_type = isset( $layout['type'] ) ? $layout['type'] : 'default';
|
||||
$layout_styles = array();
|
||||
|
||||
if ( 'default' === $layout_type ) {
|
||||
if ( $has_block_gap_support ) {
|
||||
if ( is_array( $gap_value ) ) {
|
||||
$gap_value = isset( $gap_value['top'] ) ? $gap_value['top'] : null;
|
||||
}
|
||||
if ( null !== $gap_value && ! $should_skip_gap_serialization ) {
|
||||
// Get spacing CSS variable from preset value if provided.
|
||||
if ( is_string( $gap_value ) && str_contains( $gap_value, 'var:preset|spacing|' ) ) {
|
||||
$index_to_splice = strrpos( $gap_value, '|' ) + 1;
|
||||
$slug = _wp_to_kebab_case( substr( $gap_value, $index_to_splice ) );
|
||||
$gap_value = "var(--wp--preset--spacing--$slug)";
|
||||
}
|
||||
|
||||
array_push(
|
||||
$layout_styles,
|
||||
array(
|
||||
'selector' => "$selector > *",
|
||||
'declarations' => array(
|
||||
'margin-block-start' => '0',
|
||||
'margin-block-end' => '0',
|
||||
),
|
||||
),
|
||||
array(
|
||||
'selector' => "$selector$selector > * + *",
|
||||
'declarations' => array(
|
||||
'margin-block-start' => $gap_value,
|
||||
'margin-block-end' => '0',
|
||||
),
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
} elseif ( 'constrained' === $layout_type ) {
|
||||
$content_size = isset( $layout['contentSize'] ) ? $layout['contentSize'] : '';
|
||||
$wide_size = isset( $layout['wideSize'] ) ? $layout['wideSize'] : '';
|
||||
$justify_content = isset( $layout['justifyContent'] ) ? $layout['justifyContent'] : 'center';
|
||||
|
||||
$all_max_width_value = $content_size ? $content_size : $wide_size;
|
||||
$wide_max_width_value = $wide_size ? $wide_size : $content_size;
|
||||
|
||||
// Make sure there is a single CSS rule, and all tags are stripped for security.
|
||||
$all_max_width_value = safecss_filter_attr( explode( ';', $all_max_width_value )[0] );
|
||||
$wide_max_width_value = safecss_filter_attr( explode( ';', $wide_max_width_value )[0] );
|
||||
|
||||
$margin_left = 'left' === $justify_content ? '0 !important' : 'auto !important';
|
||||
$margin_right = 'right' === $justify_content ? '0 !important' : 'auto !important';
|
||||
|
||||
if ( $content_size || $wide_size ) {
|
||||
array_push(
|
||||
$layout_styles,
|
||||
array(
|
||||
'selector' => "$selector > :where(:not(.alignleft):not(.alignright):not(.alignfull))",
|
||||
'declarations' => array(
|
||||
'max-width' => $all_max_width_value,
|
||||
'margin-left' => $margin_left,
|
||||
'margin-right' => $margin_right,
|
||||
),
|
||||
),
|
||||
array(
|
||||
'selector' => "$selector > .alignwide",
|
||||
'declarations' => array( 'max-width' => $wide_max_width_value ),
|
||||
),
|
||||
array(
|
||||
'selector' => "$selector .alignfull",
|
||||
'declarations' => array( 'max-width' => 'none' ),
|
||||
)
|
||||
);
|
||||
|
||||
if ( isset( $block_spacing ) ) {
|
||||
$block_spacing_values = wp_style_engine_get_styles(
|
||||
array(
|
||||
'spacing' => $block_spacing,
|
||||
)
|
||||
);
|
||||
|
||||
/*
|
||||
* Handle negative margins for alignfull children of blocks with custom padding set.
|
||||
* They're added separately because padding might only be set on one side.
|
||||
*/
|
||||
if ( isset( $block_spacing_values['declarations']['padding-right'] ) ) {
|
||||
$padding_right = $block_spacing_values['declarations']['padding-right'];
|
||||
$layout_styles[] = array(
|
||||
'selector' => "$selector > .alignfull",
|
||||
'declarations' => array( 'margin-right' => "calc($padding_right * -1)" ),
|
||||
);
|
||||
}
|
||||
if ( isset( $block_spacing_values['declarations']['padding-left'] ) ) {
|
||||
$padding_left = $block_spacing_values['declarations']['padding-left'];
|
||||
$layout_styles[] = array(
|
||||
'selector' => "$selector > .alignfull",
|
||||
'declarations' => array( 'margin-left' => "calc($padding_left * -1)" ),
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if ( 'left' === $justify_content ) {
|
||||
$layout_styles[] = array(
|
||||
'selector' => "$selector > :where(:not(.alignleft):not(.alignright):not(.alignfull))",
|
||||
'declarations' => array( 'margin-left' => '0 !important' ),
|
||||
);
|
||||
}
|
||||
|
||||
if ( 'right' === $justify_content ) {
|
||||
$layout_styles[] = array(
|
||||
'selector' => "$selector > :where(:not(.alignleft):not(.alignright):not(.alignfull))",
|
||||
'declarations' => array( 'margin-right' => '0 !important' ),
|
||||
);
|
||||
}
|
||||
|
||||
if ( $has_block_gap_support ) {
|
||||
if ( is_array( $gap_value ) ) {
|
||||
$gap_value = isset( $gap_value['top'] ) ? $gap_value['top'] : null;
|
||||
}
|
||||
if ( null !== $gap_value && ! $should_skip_gap_serialization ) {
|
||||
// Get spacing CSS variable from preset value if provided.
|
||||
if ( is_string( $gap_value ) && str_contains( $gap_value, 'var:preset|spacing|' ) ) {
|
||||
$index_to_splice = strrpos( $gap_value, '|' ) + 1;
|
||||
$slug = _wp_to_kebab_case( substr( $gap_value, $index_to_splice ) );
|
||||
$gap_value = "var(--wp--preset--spacing--$slug)";
|
||||
}
|
||||
|
||||
array_push(
|
||||
$layout_styles,
|
||||
array(
|
||||
'selector' => "$selector > *",
|
||||
'declarations' => array(
|
||||
'margin-block-start' => '0',
|
||||
'margin-block-end' => '0',
|
||||
),
|
||||
),
|
||||
array(
|
||||
'selector' => "$selector$selector > * + *",
|
||||
'declarations' => array(
|
||||
'margin-block-start' => $gap_value,
|
||||
'margin-block-end' => '0',
|
||||
),
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
||||
} elseif ( 'flex' === $layout_type ) {
|
||||
$layout_orientation = isset( $layout['orientation'] ) ? $layout['orientation'] : 'horizontal';
|
||||
|
||||
$justify_content_options = array(
|
||||
'left' => 'flex-start',
|
||||
'right' => 'flex-end',
|
||||
'center' => 'center',
|
||||
);
|
||||
|
||||
$vertical_alignment_options = array(
|
||||
'top' => 'flex-start',
|
||||
'center' => 'center',
|
||||
'bottom' => 'flex-end',
|
||||
);
|
||||
|
||||
if ( 'horizontal' === $layout_orientation ) {
|
||||
$justify_content_options += array( 'space-between' => 'space-between' );
|
||||
$vertical_alignment_options += array( 'stretch' => 'stretch' );
|
||||
} else {
|
||||
$justify_content_options += array( 'stretch' => 'stretch' );
|
||||
$vertical_alignment_options += array( 'space-between' => 'space-between' );
|
||||
}
|
||||
|
||||
if ( ! empty( $layout['flexWrap'] ) && 'nowrap' === $layout['flexWrap'] ) {
|
||||
$layout_styles[] = array(
|
||||
'selector' => $selector,
|
||||
'declarations' => array( 'flex-wrap' => 'nowrap' ),
|
||||
);
|
||||
}
|
||||
|
||||
if ( $has_block_gap_support && isset( $gap_value ) ) {
|
||||
$combined_gap_value = '';
|
||||
$gap_sides = is_array( $gap_value ) ? array( 'top', 'left' ) : array( 'top' );
|
||||
|
||||
foreach ( $gap_sides as $gap_side ) {
|
||||
$process_value = is_string( $gap_value ) ? $gap_value : _wp_array_get( $gap_value, array( $gap_side ), $fallback_gap_value );
|
||||
// Get spacing CSS variable from preset value if provided.
|
||||
if ( is_string( $process_value ) && str_contains( $process_value, 'var:preset|spacing|' ) ) {
|
||||
$index_to_splice = strrpos( $process_value, '|' ) + 1;
|
||||
$slug = _wp_to_kebab_case( substr( $process_value, $index_to_splice ) );
|
||||
$process_value = "var(--wp--preset--spacing--$slug)";
|
||||
}
|
||||
$combined_gap_value .= "$process_value ";
|
||||
}
|
||||
$gap_value = trim( $combined_gap_value );
|
||||
|
||||
if ( null !== $gap_value && ! $should_skip_gap_serialization ) {
|
||||
$layout_styles[] = array(
|
||||
'selector' => $selector,
|
||||
'declarations' => array( 'gap' => $gap_value ),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
if ( 'horizontal' === $layout_orientation ) {
|
||||
/*
|
||||
* Add this style only if is not empty for backwards compatibility,
|
||||
* since we intend to convert blocks that had flex layout implemented
|
||||
* by custom css.
|
||||
*/
|
||||
if ( ! empty( $layout['justifyContent'] ) && array_key_exists( $layout['justifyContent'], $justify_content_options ) ) {
|
||||
$layout_styles[] = array(
|
||||
'selector' => $selector,
|
||||
'declarations' => array( 'justify-content' => $justify_content_options[ $layout['justifyContent'] ] ),
|
||||
);
|
||||
}
|
||||
|
||||
if ( ! empty( $layout['verticalAlignment'] ) && array_key_exists( $layout['verticalAlignment'], $vertical_alignment_options ) ) {
|
||||
$layout_styles[] = array(
|
||||
'selector' => $selector,
|
||||
'declarations' => array( 'align-items' => $vertical_alignment_options[ $layout['verticalAlignment'] ] ),
|
||||
);
|
||||
}
|
||||
} else {
|
||||
$layout_styles[] = array(
|
||||
'selector' => $selector,
|
||||
'declarations' => array( 'flex-direction' => 'column' ),
|
||||
);
|
||||
if ( ! empty( $layout['justifyContent'] ) && array_key_exists( $layout['justifyContent'], $justify_content_options ) ) {
|
||||
$layout_styles[] = array(
|
||||
'selector' => $selector,
|
||||
'declarations' => array( 'align-items' => $justify_content_options[ $layout['justifyContent'] ] ),
|
||||
);
|
||||
} else {
|
||||
$layout_styles[] = array(
|
||||
'selector' => $selector,
|
||||
'declarations' => array( 'align-items' => 'flex-start' ),
|
||||
);
|
||||
}
|
||||
if ( ! empty( $layout['verticalAlignment'] ) && array_key_exists( $layout['verticalAlignment'], $vertical_alignment_options ) ) {
|
||||
$layout_styles[] = array(
|
||||
'selector' => $selector,
|
||||
'declarations' => array( 'justify-content' => $vertical_alignment_options[ $layout['verticalAlignment'] ] ),
|
||||
);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if ( ! empty( $layout_styles ) ) {
|
||||
/*
|
||||
* Add to the style engine store to enqueue and render layout styles.
|
||||
* Return compiled layout styles to retain backwards compatibility.
|
||||
* Since https://github.com/WordPress/gutenberg/pull/42452,
|
||||
* wp_enqueue_block_support_styles is no longer called in this block supports file.
|
||||
*/
|
||||
return wp_style_engine_get_stylesheet_from_css_rules(
|
||||
$layout_styles,
|
||||
array(
|
||||
'context' => 'block-supports',
|
||||
'prettify' => false,
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
|
||||
/**
|
||||
* Renders the layout config to the block wrapper.
|
||||
*
|
||||
* @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_layout_support_flag( $block_content, $block ) {
|
||||
$block_type = WP_Block_Type_Registry::get_instance()->get_registered( $block['blockName'] );
|
||||
$support_layout = block_has_support( $block_type, array( '__experimentalLayout' ), false );
|
||||
$has_child_layout = isset( $block['attrs']['style']['layout']['selfStretch'] );
|
||||
|
||||
if ( ! $support_layout && ! $has_child_layout ) {
|
||||
return $block_content;
|
||||
}
|
||||
$outer_class_names = array();
|
||||
|
||||
if ( $has_child_layout && ( 'fixed' === $block['attrs']['style']['layout']['selfStretch'] || 'fill' === $block['attrs']['style']['layout']['selfStretch'] ) ) {
|
||||
$container_content_class = wp_unique_id( 'wp-container-content-' );
|
||||
|
||||
$child_layout_styles = array();
|
||||
|
||||
if ( 'fixed' === $block['attrs']['style']['layout']['selfStretch'] && isset( $block['attrs']['style']['layout']['flexSize'] ) ) {
|
||||
$child_layout_styles[] = array(
|
||||
'selector' => ".$container_content_class",
|
||||
'declarations' => array(
|
||||
'flex-basis' => $block['attrs']['style']['layout']['flexSize'],
|
||||
'box-sizing' => 'border-box',
|
||||
),
|
||||
);
|
||||
} elseif ( 'fill' === $block['attrs']['style']['layout']['selfStretch'] ) {
|
||||
$child_layout_styles[] = array(
|
||||
'selector' => ".$container_content_class",
|
||||
'declarations' => array(
|
||||
'flex-grow' => '1',
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
wp_style_engine_get_stylesheet_from_css_rules(
|
||||
$child_layout_styles,
|
||||
array(
|
||||
'context' => 'block-supports',
|
||||
'prettify' => false,
|
||||
)
|
||||
);
|
||||
|
||||
$outer_class_names[] = $container_content_class;
|
||||
}
|
||||
|
||||
// Return early if only child layout exists.
|
||||
if ( ! $support_layout && ! empty( $outer_class_names ) ) {
|
||||
$content = new WP_HTML_Tag_Processor( $block_content );
|
||||
$content->next_tag();
|
||||
$content->add_class( implode( ' ', $outer_class_names ) );
|
||||
return (string) $content;
|
||||
}
|
||||
|
||||
$global_settings = wp_get_global_settings();
|
||||
$block_gap = _wp_array_get( $global_settings, array( 'spacing', 'blockGap' ), null );
|
||||
$has_block_gap_support = isset( $block_gap );
|
||||
$global_layout_settings = _wp_array_get( $global_settings, array( 'layout' ), null );
|
||||
$root_padding_aware_alignments = _wp_array_get( $global_settings, array( 'useRootPaddingAwareAlignments' ), false );
|
||||
|
||||
$default_block_layout = _wp_array_get( $block_type->supports, array( '__experimentalLayout', 'default' ), array() );
|
||||
$used_layout = isset( $block['attrs']['layout'] ) ? $block['attrs']['layout'] : $default_block_layout;
|
||||
|
||||
if ( isset( $used_layout['inherit'] ) && $used_layout['inherit'] && ! $global_layout_settings ) {
|
||||
return $block_content;
|
||||
}
|
||||
|
||||
$class_names = array();
|
||||
$layout_definitions = _wp_array_get( $global_layout_settings, array( 'definitions' ), array() );
|
||||
$container_class = wp_unique_id( 'wp-container-' );
|
||||
$layout_classname = '';
|
||||
|
||||
// Set the correct layout type for blocks using legacy content width.
|
||||
if ( isset( $used_layout['inherit'] ) && $used_layout['inherit'] || isset( $used_layout['contentSize'] ) && $used_layout['contentSize'] ) {
|
||||
$used_layout['type'] = 'constrained';
|
||||
}
|
||||
|
||||
if (
|
||||
$root_padding_aware_alignments &&
|
||||
isset( $used_layout['type'] ) &&
|
||||
'constrained' === $used_layout['type']
|
||||
) {
|
||||
$class_names[] = 'has-global-padding';
|
||||
}
|
||||
|
||||
/*
|
||||
* The following section was added to reintroduce a small set of layout classnames that were
|
||||
* removed in the 5.9 release (https://github.com/WordPress/gutenberg/issues/38719). It is
|
||||
* not intended to provide an extended set of classes to match all block layout attributes
|
||||
* here.
|
||||
*/
|
||||
if ( ! empty( $block['attrs']['layout']['orientation'] ) ) {
|
||||
$class_names[] = 'is-' . sanitize_title( $block['attrs']['layout']['orientation'] );
|
||||
}
|
||||
|
||||
if ( ! empty( $block['attrs']['layout']['justifyContent'] ) ) {
|
||||
$class_names[] = 'is-content-justification-' . sanitize_title( $block['attrs']['layout']['justifyContent'] );
|
||||
}
|
||||
|
||||
if ( ! empty( $block['attrs']['layout']['flexWrap'] ) && 'nowrap' === $block['attrs']['layout']['flexWrap'] ) {
|
||||
$class_names[] = 'is-nowrap';
|
||||
}
|
||||
|
||||
// Get classname for layout type.
|
||||
if ( isset( $used_layout['type'] ) ) {
|
||||
$layout_classname = _wp_array_get( $layout_definitions, array( $used_layout['type'], 'className' ), '' );
|
||||
} else {
|
||||
$layout_classname = _wp_array_get( $layout_definitions, array( 'default', 'className' ), '' );
|
||||
}
|
||||
|
||||
if ( $layout_classname && is_string( $layout_classname ) ) {
|
||||
$class_names[] = sanitize_title( $layout_classname );
|
||||
}
|
||||
|
||||
/*
|
||||
* Only generate Layout styles if the theme has not opted-out.
|
||||
* Attribute-based Layout classnames are output in all cases.
|
||||
*/
|
||||
if ( ! current_theme_supports( 'disable-layout-styles' ) ) {
|
||||
|
||||
$gap_value = _wp_array_get( $block, array( 'attrs', 'style', 'spacing', 'blockGap' ) );
|
||||
/*
|
||||
* Skip if gap value contains unsupported characters.
|
||||
* Regex for CSS value borrowed from `safecss_filter_attr`, and used here
|
||||
* to only match against the value, not the CSS attribute.
|
||||
*/
|
||||
if ( is_array( $gap_value ) ) {
|
||||
foreach ( $gap_value as $key => $value ) {
|
||||
$gap_value[ $key ] = $value && preg_match( '%[\\\(&=}]|/\*%', $value ) ? null : $value;
|
||||
}
|
||||
} else {
|
||||
$gap_value = $gap_value && preg_match( '%[\\\(&=}]|/\*%', $gap_value ) ? null : $gap_value;
|
||||
}
|
||||
|
||||
$fallback_gap_value = _wp_array_get( $block_type->supports, array( 'spacing', 'blockGap', '__experimentalDefault' ), '0.5em' );
|
||||
$block_spacing = _wp_array_get( $block, array( 'attrs', 'style', 'spacing' ), null );
|
||||
|
||||
/*
|
||||
* If a block's block.json skips serialization for spacing or spacing.blockGap,
|
||||
* don't apply the user-defined value to the styles.
|
||||
*/
|
||||
$should_skip_gap_serialization = wp_should_skip_block_supports_serialization( $block_type, 'spacing', 'blockGap' );
|
||||
|
||||
$style = wp_get_layout_style(
|
||||
".$container_class.$container_class",
|
||||
$used_layout,
|
||||
$has_block_gap_support,
|
||||
$gap_value,
|
||||
$should_skip_gap_serialization,
|
||||
$fallback_gap_value,
|
||||
$block_spacing
|
||||
);
|
||||
|
||||
// Only add container class and enqueue block support styles if unique styles were generated.
|
||||
if ( ! empty( $style ) ) {
|
||||
$class_names[] = $container_class;
|
||||
}
|
||||
}
|
||||
|
||||
$content_with_outer_classnames = '';
|
||||
|
||||
if ( ! empty( $outer_class_names ) ) {
|
||||
$content_with_outer_classnames = new WP_HTML_Tag_Processor( $block_content );
|
||||
$content_with_outer_classnames->next_tag();
|
||||
foreach ( $outer_class_names as $outer_class_name ) {
|
||||
$content_with_outer_classnames->add_class( $outer_class_name );
|
||||
}
|
||||
|
||||
$content_with_outer_classnames = (string) $content_with_outer_classnames;
|
||||
}
|
||||
|
||||
/**
|
||||
* The first chunk of innerContent contains the block markup up until the inner blocks start.
|
||||
* This targets the opening tag of the inner blocks wrapper, which is the last tag in that chunk.
|
||||
*/
|
||||
$inner_content_classnames = '';
|
||||
|
||||
if ( isset( $block['innerContent'][0] ) && 'string' === gettype( $block['innerContent'][0] ) && count( $block['innerContent'] ) > 1 ) {
|
||||
$tags = new WP_HTML_Tag_Processor( $block['innerContent'][0] );
|
||||
$last_classnames = '';
|
||||
while ( $tags->next_tag() ) {
|
||||
$last_classnames = $tags->get_attribute( 'class' );
|
||||
}
|
||||
|
||||
$inner_content_classnames = (string) $last_classnames;
|
||||
}
|
||||
|
||||
$content = $content_with_outer_classnames ? new WP_HTML_Tag_Processor( $content_with_outer_classnames ) : new WP_HTML_Tag_Processor( $block_content );
|
||||
|
||||
if ( $inner_content_classnames ) {
|
||||
$content->next_tag( array( 'class_name' => $inner_content_classnames ) );
|
||||
foreach ( $class_names as $class_name ) {
|
||||
$content->add_class( $class_name );
|
||||
}
|
||||
} else {
|
||||
$content->next_tag();
|
||||
foreach ( $class_names as $class_name ) {
|
||||
$content->add_class( $class_name );
|
||||
}
|
||||
}
|
||||
|
||||
return (string) $content;
|
||||
}
|
||||
|
||||
// Register the block support.
|
||||
WP_Block_Supports::get_instance()->register(
|
||||
'layout',
|
||||
array(
|
||||
'register_attribute' => 'wp_register_layout_support',
|
||||
)
|
||||
);
|
||||
add_filter( 'render_block', 'wp_render_layout_support_flag', 10, 2 );
|
||||
|
||||
/**
|
||||
* For themes without theme.json file, make sure
|
||||
* to restore the inner div for the group block
|
||||
* to avoid breaking styles relying on that div.
|
||||
*
|
||||
* @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_restore_group_inner_container( $block_content, $block ) {
|
||||
$tag_name = isset( $block['attrs']['tagName'] ) ? $block['attrs']['tagName'] : 'div';
|
||||
$group_with_inner_container_regex = sprintf(
|
||||
'/(^\s*<%1$s\b[^>]*wp-block-group(\s|")[^>]*>)(\s*<div\b[^>]*wp-block-group__inner-container(\s|")[^>]*>)((.|\S|\s)*)/U',
|
||||
preg_quote( $tag_name, '/' )
|
||||
);
|
||||
|
||||
if (
|
||||
wp_theme_has_theme_json() ||
|
||||
1 === preg_match( $group_with_inner_container_regex, $block_content ) ||
|
||||
( isset( $block['attrs']['layout']['type'] ) && 'flex' === $block['attrs']['layout']['type'] )
|
||||
) {
|
||||
return $block_content;
|
||||
}
|
||||
|
||||
$replace_regex = sprintf(
|
||||
'/(^\s*<%1$s\b[^>]*wp-block-group[^>]*>)(.*)(<\/%1$s>\s*$)/ms',
|
||||
preg_quote( $tag_name, '/' )
|
||||
);
|
||||
$updated_content = preg_replace_callback(
|
||||
$replace_regex,
|
||||
static function( $matches ) {
|
||||
return $matches[1] . '<div class="wp-block-group__inner-container">' . $matches[2] . '</div>' . $matches[3];
|
||||
},
|
||||
$block_content
|
||||
);
|
||||
return $updated_content;
|
||||
}
|
||||
|
||||
add_filter( 'render_block_core/group', 'wp_restore_group_inner_container', 10, 2 );
|
||||
|
||||
/**
|
||||
* For themes without theme.json file, make sure
|
||||
* to restore the outer div for the aligned image block
|
||||
* to avoid breaking styles relying on that div.
|
||||
*
|
||||
* @since 6.0.0
|
||||
* @access private
|
||||
*
|
||||
* @param string $block_content Rendered block content.
|
||||
* @param array $block Block object.
|
||||
* @return string Filtered block content.
|
||||
*/
|
||||
function wp_restore_image_outer_container( $block_content, $block ) {
|
||||
$image_with_align = "
|
||||
/# 1) everything up to the class attribute contents
|
||||
(
|
||||
^\s*
|
||||
<figure\b
|
||||
[^>]*
|
||||
\bclass=
|
||||
[\"']
|
||||
)
|
||||
# 2) the class attribute contents
|
||||
(
|
||||
[^\"']*
|
||||
\bwp-block-image\b
|
||||
[^\"']*
|
||||
\b(?:alignleft|alignright|aligncenter)\b
|
||||
[^\"']*
|
||||
)
|
||||
# 3) everything after the class attribute contents
|
||||
(
|
||||
[\"']
|
||||
[^>]*
|
||||
>
|
||||
.*
|
||||
<\/figure>
|
||||
)/iUx";
|
||||
|
||||
if (
|
||||
wp_theme_has_theme_json() ||
|
||||
0 === preg_match( $image_with_align, $block_content, $matches )
|
||||
) {
|
||||
return $block_content;
|
||||
}
|
||||
|
||||
$wrapper_classnames = array( 'wp-block-image' );
|
||||
|
||||
// If the block has a classNames attribute these classnames need to be removed from the content and added back
|
||||
// to the new wrapper div also.
|
||||
if ( ! empty( $block['attrs']['className'] ) ) {
|
||||
$wrapper_classnames = array_merge( $wrapper_classnames, explode( ' ', $block['attrs']['className'] ) );
|
||||
}
|
||||
$content_classnames = explode( ' ', $matches[2] );
|
||||
$filtered_content_classnames = array_diff( $content_classnames, $wrapper_classnames );
|
||||
|
||||
return '<div class="' . implode( ' ', $wrapper_classnames ) . '">' . $matches[1] . implode( ' ', $filtered_content_classnames ) . $matches[3] . '</div>';
|
||||
}
|
||||
|
||||
add_filter( 'render_block_core/image', 'wp_restore_image_outer_container', 10, 2 );
|
||||
151
wp/wp-includes/block-supports/position.php
Normal file
151
wp/wp-includes/block-supports/position.php
Normal file
@@ -0,0 +1,151 @@
|
||||
<?php
|
||||
/**
|
||||
* Position block support flag.
|
||||
*
|
||||
* @package WordPress
|
||||
* @since 6.2.0
|
||||
*/
|
||||
|
||||
/**
|
||||
* Registers the style block attribute for block types that support it.
|
||||
*
|
||||
* @since 6.2.0
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block Type.
|
||||
*/
|
||||
function wp_register_position_support( $block_type ) {
|
||||
$has_position_support = block_has_support( $block_type, array( 'position' ), false );
|
||||
|
||||
// Set up attributes and styles within that if needed.
|
||||
if ( ! $block_type->attributes ) {
|
||||
$block_type->attributes = array();
|
||||
}
|
||||
|
||||
if ( $has_position_support && ! array_key_exists( 'style', $block_type->attributes ) ) {
|
||||
$block_type->attributes['style'] = array(
|
||||
'type' => 'object',
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Renders position styles to the block wrapper.
|
||||
*
|
||||
* @since 6.2.0
|
||||
* @access private
|
||||
*
|
||||
* @param string $block_content Rendered block content.
|
||||
* @param array $block Block object.
|
||||
* @return string Filtered block content.
|
||||
*/
|
||||
function wp_render_position_support( $block_content, $block ) {
|
||||
$block_type = WP_Block_Type_Registry::get_instance()->get_registered( $block['blockName'] );
|
||||
$has_position_support = block_has_support( $block_type, array( 'position' ), false );
|
||||
|
||||
if (
|
||||
! $has_position_support ||
|
||||
empty( $block['attrs']['style']['position'] )
|
||||
) {
|
||||
return $block_content;
|
||||
}
|
||||
|
||||
$global_settings = wp_get_global_settings();
|
||||
$theme_has_sticky_support = _wp_array_get( $global_settings, array( 'position', 'sticky' ), false );
|
||||
$theme_has_fixed_support = _wp_array_get( $global_settings, array( 'position', 'fixed' ), false );
|
||||
|
||||
// Only allow output for position types that the theme supports.
|
||||
$allowed_position_types = array();
|
||||
if ( true === $theme_has_sticky_support ) {
|
||||
$allowed_position_types[] = 'sticky';
|
||||
}
|
||||
if ( true === $theme_has_fixed_support ) {
|
||||
$allowed_position_types[] = 'fixed';
|
||||
}
|
||||
|
||||
$style_attribute = _wp_array_get( $block, array( 'attrs', 'style' ), null );
|
||||
$class_name = wp_unique_id( 'wp-container-' );
|
||||
$selector = ".$class_name";
|
||||
$position_styles = array();
|
||||
$position_type = _wp_array_get( $style_attribute, array( 'position', 'type' ), '' );
|
||||
$wrapper_classes = array();
|
||||
|
||||
if (
|
||||
in_array( $position_type, $allowed_position_types, true )
|
||||
) {
|
||||
$wrapper_classes[] = $class_name;
|
||||
$wrapper_classes[] = 'is-position-' . $position_type;
|
||||
$sides = array( 'top', 'right', 'bottom', 'left' );
|
||||
|
||||
foreach ( $sides as $side ) {
|
||||
$side_value = _wp_array_get( $style_attribute, array( 'position', $side ) );
|
||||
if ( null !== $side_value ) {
|
||||
/*
|
||||
* For fixed or sticky top positions,
|
||||
* ensure the value includes an offset for the logged in admin bar.
|
||||
*/
|
||||
if (
|
||||
'top' === $side &&
|
||||
( 'fixed' === $position_type || 'sticky' === $position_type )
|
||||
) {
|
||||
// Ensure 0 values can be used in `calc()` calculations.
|
||||
if ( '0' === $side_value || 0 === $side_value ) {
|
||||
$side_value = '0px';
|
||||
}
|
||||
|
||||
// Ensure current side value also factors in the height of the logged in admin bar.
|
||||
$side_value = "calc($side_value + var(--wp-admin--admin-bar--position-offset, 0px))";
|
||||
}
|
||||
|
||||
$position_styles[] =
|
||||
array(
|
||||
'selector' => $selector,
|
||||
'declarations' => array(
|
||||
$side => $side_value,
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
$position_styles[] =
|
||||
array(
|
||||
'selector' => $selector,
|
||||
'declarations' => array(
|
||||
'position' => $position_type,
|
||||
'z-index' => '10',
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
if ( ! empty( $position_styles ) ) {
|
||||
/*
|
||||
* Add to the style engine store to enqueue and render position styles.
|
||||
*/
|
||||
wp_style_engine_get_stylesheet_from_css_rules(
|
||||
$position_styles,
|
||||
array(
|
||||
'context' => 'block-supports',
|
||||
'prettify' => false,
|
||||
)
|
||||
);
|
||||
|
||||
// Inject class name to block container markup.
|
||||
$content = new WP_HTML_Tag_Processor( $block_content );
|
||||
$content->next_tag();
|
||||
foreach ( $wrapper_classes as $class ) {
|
||||
$content->add_class( $class );
|
||||
}
|
||||
return (string) $content;
|
||||
}
|
||||
|
||||
return $block_content;
|
||||
}
|
||||
|
||||
// Register the block support.
|
||||
WP_Block_Supports::get_instance()->register(
|
||||
'position',
|
||||
array(
|
||||
'register_attribute' => 'wp_register_position_support',
|
||||
)
|
||||
);
|
||||
add_filter( 'render_block', 'wp_render_position_support', 10, 2 );
|
||||
146
wp/wp-includes/block-supports/settings.php
Normal file
146
wp/wp-includes/block-supports/settings.php
Normal file
@@ -0,0 +1,146 @@
|
||||
<?php
|
||||
/**
|
||||
* Block level presets support.
|
||||
*
|
||||
* @package WordPress
|
||||
* @since 6.2.0
|
||||
*/
|
||||
|
||||
/**
|
||||
* Get the class name used on block level presets.
|
||||
*
|
||||
* @internal
|
||||
*
|
||||
* @since 6.2.0
|
||||
* @access private
|
||||
*
|
||||
* @param array $block Block object.
|
||||
* @return string The unique class name.
|
||||
*/
|
||||
function _wp_get_presets_class_name( $block ) {
|
||||
return 'wp-settings-' . md5( serialize( $block ) );
|
||||
}
|
||||
|
||||
/**
|
||||
* Update the block content with block level presets class name.
|
||||
*
|
||||
* @internal
|
||||
*
|
||||
* @since 6.2.0
|
||||
* @access private
|
||||
*
|
||||
* @param string $block_content Rendered block content.
|
||||
* @param array $block Block object.
|
||||
* @return string Filtered block content.
|
||||
*/
|
||||
function _wp_add_block_level_presets_class( $block_content, $block ) {
|
||||
if ( ! $block_content ) {
|
||||
return $block_content;
|
||||
}
|
||||
|
||||
// return early if the block doesn't have support for settings.
|
||||
$block_type = WP_Block_Type_Registry::get_instance()->get_registered( $block['blockName'] );
|
||||
if ( ! block_has_support( $block_type, array( '__experimentalSettings' ), false ) ) {
|
||||
return $block_content;
|
||||
}
|
||||
|
||||
// return early if no settings are found on the block attributes.
|
||||
$block_settings = _wp_array_get( $block, array( 'attrs', 'settings' ), null );
|
||||
if ( empty( $block_settings ) ) {
|
||||
return $block_content;
|
||||
}
|
||||
|
||||
// Like the layout hook this assumes the hook only applies to blocks with a single wrapper.
|
||||
// Add the class name to the first element, presuming it's the wrapper, if it exists.
|
||||
$tags = new WP_HTML_Tag_Processor( $block_content );
|
||||
if ( $tags->next_tag() ) {
|
||||
$tags->add_class( _wp_get_presets_class_name( $block ) );
|
||||
}
|
||||
|
||||
return $tags->get_updated_html();
|
||||
}
|
||||
|
||||
/**
|
||||
* Render the block level presets stylesheet.
|
||||
*
|
||||
* @internal
|
||||
*
|
||||
* @since 6.2.0
|
||||
* @access private
|
||||
*
|
||||
* @param string|null $pre_render The pre-rendered content. Default null.
|
||||
* @param array $block The block being rendered.
|
||||
*
|
||||
* @return null
|
||||
*/
|
||||
function _wp_add_block_level_preset_styles( $pre_render, $block ) {
|
||||
// Return early if the block has not support for descendent block styles.
|
||||
$block_type = WP_Block_Type_Registry::get_instance()->get_registered( $block['blockName'] );
|
||||
if ( ! block_has_support( $block_type, array( '__experimentalSettings' ), false ) ) {
|
||||
return null;
|
||||
}
|
||||
|
||||
// return early if no settings are found on the block attributes.
|
||||
$block_settings = _wp_array_get( $block, array( 'attrs', 'settings' ), null );
|
||||
if ( empty( $block_settings ) ) {
|
||||
return null;
|
||||
}
|
||||
|
||||
$class_name = '.' . _wp_get_presets_class_name( $block );
|
||||
|
||||
// the root selector for preset variables needs to target every possible block selector
|
||||
// in order for the general setting to override any bock specific setting of a parent block or
|
||||
// the site root.
|
||||
$variables_root_selector = '*,[class*="wp-block"]';
|
||||
$registry = WP_Block_Type_Registry::get_instance();
|
||||
$blocks = $registry->get_all_registered();
|
||||
foreach ( $blocks as $block_type ) {
|
||||
if (
|
||||
isset( $block_type->supports['__experimentalSelector'] ) &&
|
||||
is_string( $block_type->supports['__experimentalSelector'] )
|
||||
) {
|
||||
$variables_root_selector .= ',' . $block_type->supports['__experimentalSelector'];
|
||||
}
|
||||
}
|
||||
$variables_root_selector = WP_Theme_JSON::scope_selector( $class_name, $variables_root_selector );
|
||||
|
||||
// Remove any potentially unsafe styles.
|
||||
$theme_json_shape = WP_Theme_JSON::remove_insecure_properties(
|
||||
array(
|
||||
'version' => WP_Theme_JSON::LATEST_SCHEMA,
|
||||
'settings' => $block_settings,
|
||||
)
|
||||
);
|
||||
$theme_json_object = new WP_Theme_JSON( $theme_json_shape );
|
||||
|
||||
$styles = '';
|
||||
|
||||
// include preset css variables declaration on the stylesheet.
|
||||
$styles .= $theme_json_object->get_stylesheet(
|
||||
array( 'variables' ),
|
||||
null,
|
||||
array(
|
||||
'root_selector' => $variables_root_selector,
|
||||
'scope' => $class_name,
|
||||
)
|
||||
);
|
||||
|
||||
// include preset css classes on the the stylesheet.
|
||||
$styles .= $theme_json_object->get_stylesheet(
|
||||
array( 'presets' ),
|
||||
null,
|
||||
array(
|
||||
'root_selector' => $class_name . ',' . $class_name . ' *',
|
||||
'scope' => $class_name,
|
||||
)
|
||||
);
|
||||
|
||||
if ( ! empty( $styles ) ) {
|
||||
wp_enqueue_block_support_styles( $styles );
|
||||
}
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
add_filter( 'render_block', '_wp_add_block_level_presets_class', 10, 2 );
|
||||
add_filter( 'pre_render_block', '_wp_add_block_level_preset_styles', 10, 2 );
|
||||
82
wp/wp-includes/block-supports/spacing.php
Normal file
82
wp/wp-includes/block-supports/spacing.php
Normal file
@@ -0,0 +1,82 @@
|
||||
<?php
|
||||
/**
|
||||
* Spacing block support flag.
|
||||
*
|
||||
* For backwards compatibility, this remains separate to the dimensions.php
|
||||
* block support despite both belonging under a single panel in the editor.
|
||||
*
|
||||
* @package WordPress
|
||||
* @since 5.8.0
|
||||
*/
|
||||
|
||||
/**
|
||||
* Registers the style block attribute for block types that support it.
|
||||
*
|
||||
* @since 5.8.0
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block Type.
|
||||
*/
|
||||
function wp_register_spacing_support( $block_type ) {
|
||||
$has_spacing_support = block_has_support( $block_type, array( 'spacing' ), false );
|
||||
|
||||
// Setup attributes and styles within that if needed.
|
||||
if ( ! $block_type->attributes ) {
|
||||
$block_type->attributes = array();
|
||||
}
|
||||
|
||||
if ( $has_spacing_support && ! array_key_exists( 'style', $block_type->attributes ) ) {
|
||||
$block_type->attributes['style'] = array(
|
||||
'type' => 'object',
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Adds CSS classes for block spacing to the incoming attributes array.
|
||||
* This will be applied to the block markup in the front-end.
|
||||
*
|
||||
* @since 5.8.0
|
||||
* @since 6.1.0 Implemented the style engine to generate CSS and classnames.
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block Type.
|
||||
* @param array $block_attributes Block attributes.
|
||||
* @return array Block spacing CSS classes and inline styles.
|
||||
*/
|
||||
function wp_apply_spacing_support( $block_type, $block_attributes ) {
|
||||
if ( wp_should_skip_block_supports_serialization( $block_type, 'spacing' ) ) {
|
||||
return array();
|
||||
}
|
||||
|
||||
$attributes = array();
|
||||
$has_padding_support = block_has_support( $block_type, array( 'spacing', 'padding' ), false );
|
||||
$has_margin_support = block_has_support( $block_type, array( 'spacing', 'margin' ), false );
|
||||
$block_styles = isset( $block_attributes['style'] ) ? $block_attributes['style'] : null;
|
||||
|
||||
if ( ! $block_styles ) {
|
||||
return $attributes;
|
||||
}
|
||||
|
||||
$skip_padding = wp_should_skip_block_supports_serialization( $block_type, 'spacing', 'padding' );
|
||||
$skip_margin = wp_should_skip_block_supports_serialization( $block_type, 'spacing', 'margin' );
|
||||
$spacing_block_styles = array();
|
||||
$spacing_block_styles['padding'] = $has_padding_support && ! $skip_padding ? _wp_array_get( $block_styles, array( 'spacing', 'padding' ), null ) : null;
|
||||
$spacing_block_styles['margin'] = $has_margin_support && ! $skip_margin ? _wp_array_get( $block_styles, array( 'spacing', 'margin' ), null ) : null;
|
||||
$styles = wp_style_engine_get_styles( array( 'spacing' => $spacing_block_styles ) );
|
||||
|
||||
if ( ! empty( $styles['css'] ) ) {
|
||||
$attributes['style'] = $styles['css'];
|
||||
}
|
||||
|
||||
return $attributes;
|
||||
}
|
||||
|
||||
// Register the block support.
|
||||
WP_Block_Supports::get_instance()->register(
|
||||
'spacing',
|
||||
array(
|
||||
'register_attribute' => 'wp_register_spacing_support',
|
||||
'apply' => 'wp_apply_spacing_support',
|
||||
)
|
||||
);
|
||||
597
wp/wp-includes/block-supports/typography.php
Normal file
597
wp/wp-includes/block-supports/typography.php
Normal file
@@ -0,0 +1,597 @@
|
||||
<?php
|
||||
/**
|
||||
* Typography block support flag.
|
||||
*
|
||||
* @package WordPress
|
||||
* @since 5.6.0
|
||||
*/
|
||||
|
||||
/**
|
||||
* Registers the style and typography block attributes for block types that support it.
|
||||
*
|
||||
* @since 5.6.0
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block Type.
|
||||
*/
|
||||
function wp_register_typography_support( $block_type ) {
|
||||
if ( ! property_exists( $block_type, 'supports' ) ) {
|
||||
return;
|
||||
}
|
||||
|
||||
$typography_supports = _wp_array_get( $block_type->supports, array( 'typography' ), false );
|
||||
if ( ! $typography_supports ) {
|
||||
return;
|
||||
}
|
||||
|
||||
$has_font_family_support = _wp_array_get( $typography_supports, array( '__experimentalFontFamily' ), false );
|
||||
$has_font_size_support = _wp_array_get( $typography_supports, array( 'fontSize' ), false );
|
||||
$has_font_style_support = _wp_array_get( $typography_supports, array( '__experimentalFontStyle' ), false );
|
||||
$has_font_weight_support = _wp_array_get( $typography_supports, array( '__experimentalFontWeight' ), false );
|
||||
$has_letter_spacing_support = _wp_array_get( $typography_supports, array( '__experimentalLetterSpacing' ), false );
|
||||
$has_line_height_support = _wp_array_get( $typography_supports, array( 'lineHeight' ), false );
|
||||
$has_text_decoration_support = _wp_array_get( $typography_supports, array( '__experimentalTextDecoration' ), false );
|
||||
$has_text_transform_support = _wp_array_get( $typography_supports, array( '__experimentalTextTransform' ), false );
|
||||
|
||||
$has_typography_support = $has_font_family_support
|
||||
|| $has_font_size_support
|
||||
|| $has_font_style_support
|
||||
|| $has_font_weight_support
|
||||
|| $has_letter_spacing_support
|
||||
|| $has_line_height_support
|
||||
|| $has_text_decoration_support
|
||||
|| $has_text_transform_support;
|
||||
|
||||
if ( ! $block_type->attributes ) {
|
||||
$block_type->attributes = array();
|
||||
}
|
||||
|
||||
if ( $has_typography_support && ! array_key_exists( 'style', $block_type->attributes ) ) {
|
||||
$block_type->attributes['style'] = array(
|
||||
'type' => 'object',
|
||||
);
|
||||
}
|
||||
|
||||
if ( $has_font_size_support && ! array_key_exists( 'fontSize', $block_type->attributes ) ) {
|
||||
$block_type->attributes['fontSize'] = array(
|
||||
'type' => 'string',
|
||||
);
|
||||
}
|
||||
|
||||
if ( $has_font_family_support && ! array_key_exists( 'fontFamily', $block_type->attributes ) ) {
|
||||
$block_type->attributes['fontFamily'] = array(
|
||||
'type' => 'string',
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Adds CSS classes and inline styles for typography features such as font sizes
|
||||
* to the incoming attributes array. This will be applied to the block markup in
|
||||
* the front-end.
|
||||
*
|
||||
* @since 5.6.0
|
||||
* @since 6.1.0 Used the style engine to generate CSS and classnames.
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block type.
|
||||
* @param array $block_attributes Block attributes.
|
||||
* @return array Typography CSS classes and inline styles.
|
||||
*/
|
||||
function wp_apply_typography_support( $block_type, $block_attributes ) {
|
||||
if ( ! property_exists( $block_type, 'supports' ) ) {
|
||||
return array();
|
||||
}
|
||||
|
||||
$typography_supports = _wp_array_get( $block_type->supports, array( 'typography' ), false );
|
||||
if ( ! $typography_supports ) {
|
||||
return array();
|
||||
}
|
||||
|
||||
if ( wp_should_skip_block_supports_serialization( $block_type, 'typography' ) ) {
|
||||
return array();
|
||||
}
|
||||
|
||||
$has_font_family_support = _wp_array_get( $typography_supports, array( '__experimentalFontFamily' ), false );
|
||||
$has_font_size_support = _wp_array_get( $typography_supports, array( 'fontSize' ), false );
|
||||
$has_font_style_support = _wp_array_get( $typography_supports, array( '__experimentalFontStyle' ), false );
|
||||
$has_font_weight_support = _wp_array_get( $typography_supports, array( '__experimentalFontWeight' ), false );
|
||||
$has_letter_spacing_support = _wp_array_get( $typography_supports, array( '__experimentalLetterSpacing' ), false );
|
||||
$has_line_height_support = _wp_array_get( $typography_supports, array( 'lineHeight' ), false );
|
||||
$has_text_decoration_support = _wp_array_get( $typography_supports, array( '__experimentalTextDecoration' ), false );
|
||||
$has_text_transform_support = _wp_array_get( $typography_supports, array( '__experimentalTextTransform' ), false );
|
||||
|
||||
// Whether to skip individual block support features.
|
||||
$should_skip_font_size = wp_should_skip_block_supports_serialization( $block_type, 'typography', 'fontSize' );
|
||||
$should_skip_font_family = wp_should_skip_block_supports_serialization( $block_type, 'typography', 'fontFamily' );
|
||||
$should_skip_font_style = wp_should_skip_block_supports_serialization( $block_type, 'typography', 'fontStyle' );
|
||||
$should_skip_font_weight = wp_should_skip_block_supports_serialization( $block_type, 'typography', 'fontWeight' );
|
||||
$should_skip_line_height = wp_should_skip_block_supports_serialization( $block_type, 'typography', 'lineHeight' );
|
||||
$should_skip_text_decoration = wp_should_skip_block_supports_serialization( $block_type, 'typography', 'textDecoration' );
|
||||
$should_skip_text_transform = wp_should_skip_block_supports_serialization( $block_type, 'typography', 'textTransform' );
|
||||
$should_skip_letter_spacing = wp_should_skip_block_supports_serialization( $block_type, 'typography', 'letterSpacing' );
|
||||
|
||||
$typography_block_styles = array();
|
||||
if ( $has_font_size_support && ! $should_skip_font_size ) {
|
||||
$preset_font_size = array_key_exists( 'fontSize', $block_attributes )
|
||||
? "var:preset|font-size|{$block_attributes['fontSize']}"
|
||||
: null;
|
||||
$custom_font_size = isset( $block_attributes['style']['typography']['fontSize'] )
|
||||
? $block_attributes['style']['typography']['fontSize']
|
||||
: null;
|
||||
$typography_block_styles['fontSize'] = $preset_font_size ? $preset_font_size : wp_get_typography_font_size_value(
|
||||
array(
|
||||
'size' => $custom_font_size,
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
if ( $has_font_family_support && ! $should_skip_font_family ) {
|
||||
$preset_font_family = array_key_exists( 'fontFamily', $block_attributes )
|
||||
? "var:preset|font-family|{$block_attributes['fontFamily']}"
|
||||
: null;
|
||||
$custom_font_family = isset( $block_attributes['style']['typography']['fontFamily'] )
|
||||
? wp_typography_get_preset_inline_style_value( $block_attributes['style']['typography']['fontFamily'], 'font-family' )
|
||||
: null;
|
||||
$typography_block_styles['fontFamily'] = $preset_font_family ? $preset_font_family : $custom_font_family;
|
||||
}
|
||||
|
||||
if (
|
||||
$has_font_style_support &&
|
||||
! $should_skip_font_style &&
|
||||
isset( $block_attributes['style']['typography']['fontStyle'] )
|
||||
) {
|
||||
$typography_block_styles['fontStyle'] = wp_typography_get_preset_inline_style_value(
|
||||
$block_attributes['style']['typography']['fontStyle'],
|
||||
'font-style'
|
||||
);
|
||||
}
|
||||
|
||||
if (
|
||||
$has_font_weight_support &&
|
||||
! $should_skip_font_weight &&
|
||||
isset( $block_attributes['style']['typography']['fontWeight'] )
|
||||
) {
|
||||
$typography_block_styles['fontWeight'] = wp_typography_get_preset_inline_style_value(
|
||||
$block_attributes['style']['typography']['fontWeight'],
|
||||
'font-weight'
|
||||
);
|
||||
}
|
||||
|
||||
if ( $has_line_height_support && ! $should_skip_line_height ) {
|
||||
$typography_block_styles['lineHeight'] = _wp_array_get( $block_attributes, array( 'style', 'typography', 'lineHeight' ) );
|
||||
}
|
||||
|
||||
if (
|
||||
$has_text_decoration_support &&
|
||||
! $should_skip_text_decoration &&
|
||||
isset( $block_attributes['style']['typography']['textDecoration'] )
|
||||
) {
|
||||
$typography_block_styles['textDecoration'] = wp_typography_get_preset_inline_style_value(
|
||||
$block_attributes['style']['typography']['textDecoration'],
|
||||
'text-decoration'
|
||||
);
|
||||
}
|
||||
|
||||
if (
|
||||
$has_text_transform_support &&
|
||||
! $should_skip_text_transform &&
|
||||
isset( $block_attributes['style']['typography']['textTransform'] )
|
||||
) {
|
||||
$typography_block_styles['textTransform'] = wp_typography_get_preset_inline_style_value(
|
||||
$block_attributes['style']['typography']['textTransform'],
|
||||
'text-transform'
|
||||
);
|
||||
}
|
||||
|
||||
if (
|
||||
$has_letter_spacing_support &&
|
||||
! $should_skip_letter_spacing &&
|
||||
isset( $block_attributes['style']['typography']['letterSpacing'] )
|
||||
) {
|
||||
$typography_block_styles['letterSpacing'] = wp_typography_get_preset_inline_style_value(
|
||||
$block_attributes['style']['typography']['letterSpacing'],
|
||||
'letter-spacing'
|
||||
);
|
||||
}
|
||||
|
||||
$attributes = array();
|
||||
$styles = wp_style_engine_get_styles(
|
||||
array( 'typography' => $typography_block_styles ),
|
||||
array( 'convert_vars_to_classnames' => true )
|
||||
);
|
||||
|
||||
if ( ! empty( $styles['classnames'] ) ) {
|
||||
$attributes['class'] = $styles['classnames'];
|
||||
}
|
||||
|
||||
if ( ! empty( $styles['css'] ) ) {
|
||||
$attributes['style'] = $styles['css'];
|
||||
}
|
||||
|
||||
return $attributes;
|
||||
}
|
||||
|
||||
/**
|
||||
* Generates an inline style value for a typography feature e.g. text decoration,
|
||||
* text transform, and font style.
|
||||
*
|
||||
* Note: This function is for backwards compatibility.
|
||||
* * It is necessary to parse older blocks whose typography styles contain presets.
|
||||
* * It mostly replaces the deprecated `wp_typography_get_css_variable_inline_style()`,
|
||||
* but skips compiling a CSS declaration as the style engine takes over this role.
|
||||
* @link https://github.com/wordpress/gutenberg/pull/27555
|
||||
*
|
||||
* @since 6.1.0
|
||||
*
|
||||
* @param string $style_value A raw style value for a single typography feature from a block's style attribute.
|
||||
* @param string $css_property Slug for the CSS property the inline style sets.
|
||||
* @return string A CSS inline style value.
|
||||
*/
|
||||
function wp_typography_get_preset_inline_style_value( $style_value, $css_property ) {
|
||||
// If the style value is not a preset CSS variable go no further.
|
||||
if ( empty( $style_value ) || ! str_contains( $style_value, "var:preset|{$css_property}|" ) ) {
|
||||
return $style_value;
|
||||
}
|
||||
|
||||
/*
|
||||
* For backwards compatibility.
|
||||
* Presets were removed in WordPress/gutenberg#27555.
|
||||
* A preset CSS variable is the style.
|
||||
* Gets the style value from the string and return CSS style.
|
||||
*/
|
||||
$index_to_splice = strrpos( $style_value, '|' ) + 1;
|
||||
$slug = _wp_to_kebab_case( substr( $style_value, $index_to_splice ) );
|
||||
|
||||
// Return the actual CSS inline style value,
|
||||
// e.g. `var(--wp--preset--text-decoration--underline);`.
|
||||
return sprintf( 'var(--wp--preset--%s--%s);', $css_property, $slug );
|
||||
}
|
||||
|
||||
/**
|
||||
* Renders typography styles/content to the block wrapper.
|
||||
*
|
||||
* @since 6.1.0
|
||||
*
|
||||
* @param string $block_content Rendered block content.
|
||||
* @param array $block Block object.
|
||||
* @return string Filtered block content.
|
||||
*/
|
||||
function wp_render_typography_support( $block_content, $block ) {
|
||||
if ( ! isset( $block['attrs']['style']['typography']['fontSize'] ) ) {
|
||||
return $block_content;
|
||||
}
|
||||
|
||||
$custom_font_size = $block['attrs']['style']['typography']['fontSize'];
|
||||
$fluid_font_size = wp_get_typography_font_size_value( array( 'size' => $custom_font_size ) );
|
||||
|
||||
/*
|
||||
* Checks that $fluid_font_size does not match $custom_font_size,
|
||||
* which means it's been mutated by the fluid font size functions.
|
||||
*/
|
||||
if ( ! empty( $fluid_font_size ) && $fluid_font_size !== $custom_font_size ) {
|
||||
// Replaces the first instance of `font-size:$custom_font_size` with `font-size:$fluid_font_size`.
|
||||
return preg_replace( '/font-size\s*:\s*' . preg_quote( $custom_font_size, '/' ) . '\s*;?/', 'font-size:' . esc_attr( $fluid_font_size ) . ';', $block_content, 1 );
|
||||
}
|
||||
|
||||
return $block_content;
|
||||
}
|
||||
|
||||
/**
|
||||
* Checks a string for a unit and value and returns an array
|
||||
* consisting of `'value'` and `'unit'`, e.g. array( '42', 'rem' ).
|
||||
*
|
||||
* @since 6.1.0
|
||||
*
|
||||
* @param string|int|float $raw_value Raw size value from theme.json.
|
||||
* @param array $options {
|
||||
* Optional. An associative array of options. Default is empty array.
|
||||
*
|
||||
* @type string $coerce_to Coerce the value to rem or px. Default `'rem'`.
|
||||
* @type int $root_size_value Value of root font size for rem|em <-> px conversion. Default `16`.
|
||||
* @type string[] $acceptable_units An array of font size units. Default `array( 'rem', 'px', 'em' )`;
|
||||
* }
|
||||
* @return array|null An array consisting of `'value'` and `'unit'` properties on success.
|
||||
* `null` on failure.
|
||||
*/
|
||||
function wp_get_typography_value_and_unit( $raw_value, $options = array() ) {
|
||||
if ( ! is_string( $raw_value ) && ! is_int( $raw_value ) && ! is_float( $raw_value ) ) {
|
||||
_doing_it_wrong(
|
||||
__FUNCTION__,
|
||||
__( 'Raw size value must be a string, integer, or float.' ),
|
||||
'6.1.0'
|
||||
);
|
||||
return null;
|
||||
}
|
||||
|
||||
if ( empty( $raw_value ) ) {
|
||||
return null;
|
||||
}
|
||||
|
||||
// Converts numbers to pixel values by default.
|
||||
if ( is_numeric( $raw_value ) ) {
|
||||
$raw_value = $raw_value . 'px';
|
||||
}
|
||||
|
||||
$defaults = array(
|
||||
'coerce_to' => '',
|
||||
'root_size_value' => 16,
|
||||
'acceptable_units' => array( 'rem', 'px', 'em' ),
|
||||
);
|
||||
|
||||
$options = wp_parse_args( $options, $defaults );
|
||||
|
||||
$acceptable_units_group = implode( '|', $options['acceptable_units'] );
|
||||
$pattern = '/^(\d*\.?\d+)(' . $acceptable_units_group . '){1,1}$/';
|
||||
|
||||
preg_match( $pattern, $raw_value, $matches );
|
||||
|
||||
// Bails out if not a number value and a px or rem unit.
|
||||
if ( ! isset( $matches[1] ) || ! isset( $matches[2] ) ) {
|
||||
return null;
|
||||
}
|
||||
|
||||
$value = $matches[1];
|
||||
$unit = $matches[2];
|
||||
|
||||
/*
|
||||
* Default browser font size. Later, possibly could inject some JS to
|
||||
* compute this `getComputedStyle( document.querySelector( "html" ) ).fontSize`.
|
||||
*/
|
||||
if ( 'px' === $options['coerce_to'] && ( 'em' === $unit || 'rem' === $unit ) ) {
|
||||
$value = $value * $options['root_size_value'];
|
||||
$unit = $options['coerce_to'];
|
||||
}
|
||||
|
||||
if ( 'px' === $unit && ( 'em' === $options['coerce_to'] || 'rem' === $options['coerce_to'] ) ) {
|
||||
$value = $value / $options['root_size_value'];
|
||||
$unit = $options['coerce_to'];
|
||||
}
|
||||
|
||||
/*
|
||||
* No calculation is required if swapping between em and rem yet,
|
||||
* since we assume a root size value. Later we might like to differentiate between
|
||||
* :root font size (rem) and parent element font size (em) relativity.
|
||||
*/
|
||||
if ( ( 'em' === $options['coerce_to'] || 'rem' === $options['coerce_to'] ) && ( 'em' === $unit || 'rem' === $unit ) ) {
|
||||
$unit = $options['coerce_to'];
|
||||
}
|
||||
|
||||
return array(
|
||||
'value' => round( $value, 3 ),
|
||||
'unit' => $unit,
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Internal implementation of CSS clamp() based on available min/max viewport
|
||||
* width and min/max font sizes.
|
||||
*
|
||||
* @since 6.1.0
|
||||
* @access private
|
||||
*
|
||||
* @param array $args {
|
||||
* Optional. An associative array of values to calculate a fluid formula
|
||||
* for font size. Default is empty array.
|
||||
*
|
||||
* @type string $maximum_viewport_width Maximum size up to which type will have fluidity.
|
||||
* @type string $minimum_viewport_width Minimum viewport size from which type will have fluidity.
|
||||
* @type string $maximum_font_size Maximum font size for any clamp() calculation.
|
||||
* @type string $minimum_font_size Minimum font size for any clamp() calculation.
|
||||
* @type int $scale_factor A scale factor to determine how fast a font scales within boundaries.
|
||||
* }
|
||||
* @return string|null A font-size value using clamp() on success, otherwise null.
|
||||
*/
|
||||
function wp_get_computed_fluid_typography_value( $args = array() ) {
|
||||
$maximum_viewport_width_raw = isset( $args['maximum_viewport_width'] ) ? $args['maximum_viewport_width'] : null;
|
||||
$minimum_viewport_width_raw = isset( $args['minimum_viewport_width'] ) ? $args['minimum_viewport_width'] : null;
|
||||
$maximum_font_size_raw = isset( $args['maximum_font_size'] ) ? $args['maximum_font_size'] : null;
|
||||
$minimum_font_size_raw = isset( $args['minimum_font_size'] ) ? $args['minimum_font_size'] : null;
|
||||
$scale_factor = isset( $args['scale_factor'] ) ? $args['scale_factor'] : null;
|
||||
|
||||
// Normalizes the minimum font size in order to use the value for calculations.
|
||||
$minimum_font_size = wp_get_typography_value_and_unit( $minimum_font_size_raw );
|
||||
|
||||
/*
|
||||
* We get a 'preferred' unit to keep units consistent when calculating,
|
||||
* otherwise the result will not be accurate.
|
||||
*/
|
||||
$font_size_unit = isset( $minimum_font_size['unit'] ) ? $minimum_font_size['unit'] : 'rem';
|
||||
|
||||
// Normalizes the maximum font size in order to use the value for calculations.
|
||||
$maximum_font_size = wp_get_typography_value_and_unit(
|
||||
$maximum_font_size_raw,
|
||||
array(
|
||||
'coerce_to' => $font_size_unit,
|
||||
)
|
||||
);
|
||||
|
||||
// Checks for mandatory min and max sizes, and protects against unsupported units.
|
||||
if ( ! $maximum_font_size || ! $minimum_font_size ) {
|
||||
return null;
|
||||
}
|
||||
|
||||
// Uses rem for accessible fluid target font scaling.
|
||||
$minimum_font_size_rem = wp_get_typography_value_and_unit(
|
||||
$minimum_font_size_raw,
|
||||
array(
|
||||
'coerce_to' => 'rem',
|
||||
)
|
||||
);
|
||||
|
||||
// Viewport widths defined for fluid typography. Normalize units.
|
||||
$maximum_viewport_width = wp_get_typography_value_and_unit(
|
||||
$maximum_viewport_width_raw,
|
||||
array(
|
||||
'coerce_to' => $font_size_unit,
|
||||
)
|
||||
);
|
||||
$minimum_viewport_width = wp_get_typography_value_and_unit(
|
||||
$minimum_viewport_width_raw,
|
||||
array(
|
||||
'coerce_to' => $font_size_unit,
|
||||
)
|
||||
);
|
||||
|
||||
/*
|
||||
* Build CSS rule.
|
||||
* Borrowed from https://websemantics.uk/tools/responsive-font-calculator/.
|
||||
*/
|
||||
$view_port_width_offset = round( $minimum_viewport_width['value'] / 100, 3 ) . $font_size_unit;
|
||||
$linear_factor = 100 * ( ( $maximum_font_size['value'] - $minimum_font_size['value'] ) / ( $maximum_viewport_width['value'] - $minimum_viewport_width['value'] ) );
|
||||
$linear_factor_scaled = round( $linear_factor * $scale_factor, 3 );
|
||||
$linear_factor_scaled = empty( $linear_factor_scaled ) ? 1 : $linear_factor_scaled;
|
||||
$fluid_target_font_size = implode( '', $minimum_font_size_rem ) . " + ((1vw - $view_port_width_offset) * $linear_factor_scaled)";
|
||||
|
||||
return "clamp($minimum_font_size_raw, $fluid_target_font_size, $maximum_font_size_raw)";
|
||||
}
|
||||
|
||||
/**
|
||||
* Returns a font-size value based on a given font-size preset.
|
||||
* Takes into account fluid typography parameters and attempts to return a CSS
|
||||
* formula depending on available, valid values.
|
||||
*
|
||||
* @since 6.1.0
|
||||
* @since 6.1.1 Adjusted rules for min and max font sizes.
|
||||
* @since 6.2.0 Added 'settings.typography.fluid.minFontSize' support.
|
||||
*
|
||||
* @param array $preset {
|
||||
* Required. fontSizes preset value as seen in theme.json.
|
||||
*
|
||||
* @type string $name Name of the font size preset.
|
||||
* @type string $slug Kebab-case, unique identifier for the font size preset.
|
||||
* @type string|int|float $size CSS font-size value, including units if applicable.
|
||||
* }
|
||||
* @param bool $should_use_fluid_typography An override to switch fluid typography "on". Can be used for unit testing.
|
||||
* Default is false.
|
||||
* @return string|null Font-size value or null if a size is not passed in $preset.
|
||||
*/
|
||||
function wp_get_typography_font_size_value( $preset, $should_use_fluid_typography = false ) {
|
||||
if ( ! isset( $preset['size'] ) ) {
|
||||
return null;
|
||||
}
|
||||
|
||||
/*
|
||||
* Catches empty values and 0/'0'.
|
||||
* Fluid calculations cannot be performed on 0.
|
||||
*/
|
||||
if ( empty( $preset['size'] ) ) {
|
||||
return $preset['size'];
|
||||
}
|
||||
|
||||
// Checks if fluid font sizes are activated.
|
||||
$typography_settings = wp_get_global_settings( array( 'typography' ) );
|
||||
if (
|
||||
isset( $typography_settings['fluid'] ) &&
|
||||
( true === $typography_settings['fluid'] || is_array( $typography_settings['fluid'] ) )
|
||||
) {
|
||||
$should_use_fluid_typography = true;
|
||||
}
|
||||
|
||||
if ( ! $should_use_fluid_typography ) {
|
||||
return $preset['size'];
|
||||
}
|
||||
|
||||
$fluid_settings = isset( $typography_settings['fluid'] ) && is_array( $typography_settings['fluid'] )
|
||||
? $typography_settings['fluid']
|
||||
: array();
|
||||
|
||||
// Defaults.
|
||||
$default_maximum_viewport_width = '1600px';
|
||||
$default_minimum_viewport_width = '768px';
|
||||
$default_minimum_font_size_factor = 0.75;
|
||||
$default_scale_factor = 1;
|
||||
$has_min_font_size = isset( $fluid_settings['minFontSize'] ) && ! empty( wp_get_typography_value_and_unit( $fluid_settings['minFontSize'] ) );
|
||||
$default_minimum_font_size_limit = $has_min_font_size ? $fluid_settings['minFontSize'] : '14px';
|
||||
|
||||
// Font sizes.
|
||||
$fluid_font_size_settings = isset( $preset['fluid'] ) ? $preset['fluid'] : null;
|
||||
|
||||
// A font size has explicitly bypassed fluid calculations.
|
||||
if ( false === $fluid_font_size_settings ) {
|
||||
return $preset['size'];
|
||||
}
|
||||
|
||||
// Try to grab explicit min and max fluid font sizes.
|
||||
$minimum_font_size_raw = isset( $fluid_font_size_settings['min'] ) ? $fluid_font_size_settings['min'] : null;
|
||||
$maximum_font_size_raw = isset( $fluid_font_size_settings['max'] ) ? $fluid_font_size_settings['max'] : null;
|
||||
|
||||
// Font sizes.
|
||||
$preferred_size = wp_get_typography_value_and_unit( $preset['size'] );
|
||||
|
||||
// Protects against unsupported units.
|
||||
if ( empty( $preferred_size['unit'] ) ) {
|
||||
return $preset['size'];
|
||||
}
|
||||
|
||||
/*
|
||||
* Normalizes the minimum font size limit according to the incoming unit,
|
||||
* in order to perform comparative checks.
|
||||
*/
|
||||
$minimum_font_size_limit = wp_get_typography_value_and_unit(
|
||||
$default_minimum_font_size_limit,
|
||||
array(
|
||||
'coerce_to' => $preferred_size['unit'],
|
||||
)
|
||||
);
|
||||
|
||||
// Don't enforce minimum font size if a font size has explicitly set a min and max value.
|
||||
if ( ! empty( $minimum_font_size_limit ) && ( ! $minimum_font_size_raw && ! $maximum_font_size_raw ) ) {
|
||||
/*
|
||||
* If a minimum size was not passed to this function
|
||||
* and the user-defined font size is lower than $minimum_font_size_limit,
|
||||
* do not calculate a fluid value.
|
||||
*/
|
||||
if ( $preferred_size['value'] <= $minimum_font_size_limit['value'] ) {
|
||||
return $preset['size'];
|
||||
}
|
||||
}
|
||||
|
||||
// If no fluid max font size is available use the incoming value.
|
||||
if ( ! $maximum_font_size_raw ) {
|
||||
$maximum_font_size_raw = $preferred_size['value'] . $preferred_size['unit'];
|
||||
}
|
||||
|
||||
/*
|
||||
* If no minimumFontSize is provided, create one using
|
||||
* the given font size multiplied by the min font size scale factor.
|
||||
*/
|
||||
if ( ! $minimum_font_size_raw ) {
|
||||
$calculated_minimum_font_size = round(
|
||||
$preferred_size['value'] * $default_minimum_font_size_factor,
|
||||
3
|
||||
);
|
||||
|
||||
// Only use calculated min font size if it's > $minimum_font_size_limit value.
|
||||
if ( ! empty( $minimum_font_size_limit ) && $calculated_minimum_font_size <= $minimum_font_size_limit['value'] ) {
|
||||
$minimum_font_size_raw = $minimum_font_size_limit['value'] . $minimum_font_size_limit['unit'];
|
||||
} else {
|
||||
$minimum_font_size_raw = $calculated_minimum_font_size . $preferred_size['unit'];
|
||||
}
|
||||
}
|
||||
|
||||
$fluid_font_size_value = wp_get_computed_fluid_typography_value(
|
||||
array(
|
||||
'minimum_viewport_width' => $default_minimum_viewport_width,
|
||||
'maximum_viewport_width' => $default_maximum_viewport_width,
|
||||
'minimum_font_size' => $minimum_font_size_raw,
|
||||
'maximum_font_size' => $maximum_font_size_raw,
|
||||
'scale_factor' => $default_scale_factor,
|
||||
)
|
||||
);
|
||||
|
||||
if ( ! empty( $fluid_font_size_value ) ) {
|
||||
return $fluid_font_size_value;
|
||||
}
|
||||
|
||||
return $preset['size'];
|
||||
}
|
||||
|
||||
// Register the block support.
|
||||
WP_Block_Supports::get_instance()->register(
|
||||
'typography',
|
||||
array(
|
||||
'register_attribute' => 'wp_register_typography_support',
|
||||
'apply' => 'wp_apply_typography_support',
|
||||
)
|
||||
);
|
||||
36
wp/wp-includes/block-supports/utils.php
Normal file
36
wp/wp-includes/block-supports/utils.php
Normal file
@@ -0,0 +1,36 @@
|
||||
<?php
|
||||
/**
|
||||
* Block support utility functions.
|
||||
*
|
||||
* @package WordPress
|
||||
* @subpackage Block Supports
|
||||
* @since 6.0.0
|
||||
*/
|
||||
|
||||
/**
|
||||
* Checks whether serialization of the current block's supported properties
|
||||
* should occur.
|
||||
*
|
||||
* @since 6.0.0
|
||||
* @access private
|
||||
*
|
||||
* @param WP_Block_Type $block_type Block type.
|
||||
* @param string $feature_set Name of block support feature set..
|
||||
* @param string $feature Optional name of individual feature to check.
|
||||
*
|
||||
* @return boolean Whether to serialize block support styles & classes.
|
||||
*/
|
||||
function wp_should_skip_block_supports_serialization( $block_type, $feature_set, $feature = null ) {
|
||||
if ( ! is_object( $block_type ) || ! $feature_set ) {
|
||||
return false;
|
||||
}
|
||||
|
||||
$path = array( $feature_set, '__experimentalSkipSerialization' );
|
||||
$skip_serialization = _wp_array_get( $block_type->supports, $path, false );
|
||||
|
||||
if ( is_array( $skip_serialization ) ) {
|
||||
return in_array( $feature, $skip_serialization, true );
|
||||
}
|
||||
|
||||
return $skip_serialization;
|
||||
}
|
||||
Reference in New Issue
Block a user