WordPress.org
Get WordPress

Make WordPress Core


Ignore:
Timestamp:
04/15/2021 02:41:38 PM (3 years ago)
Author:
gziolo
Message:

Editor: Update WordPress packages to use with WordPress 5.8

In the response to the discussion during the Dev Chat, I'm doing a first pass to keep WordPress packages up to date in the WordPress 5.8 release cycle.

See ​https://github.com/WordPress/wordpress-develop/pull/1176 for more details.

Props youknowriad, aristath, andraganescu.
See #52991.

File:
1 edited

Legend:

Unmodified
Added
Removed

  • trunk/src/wp-includes/block-supports/typography.php

    r49580 r50761  
    44 *
    55 * @package WordPress
     6 * @since 5.6.0
    67 */
    78
    … …  
    910 * Registers the style and typography block attributes for block types that support it.
    1011 *
     12 * @since 5.6.0
    1113 * @access private
    1214 *
    … …  
    1416 */
    1517function wp_register_typography_support( $block_type ) {
    16     $has_font_size_support = false;
    17     if ( property_exists( $block_type, 'supports' ) ) {
    18         $has_font_size_support = _wp_array_get( $block_type->supports, array( '__experimentalFontSize' ), false );
    19     }
    20 
    21     $has_line_height_support = false;
    22     if ( property_exists( $block_type, 'supports' ) ) {
    23         $has_line_height_support = _wp_array_get( $block_type->supports, array( '__experimentalLineHeight' ), false );
    24     }
     18    if ( ! property_exists( $block_type, 'supports' ) ) {
     19        return;
     20    }
     21
     22    $has_font_size_support       = _wp_array_get( $block_type->supports, array( 'fontSize' ), false );
     23    $has_font_style_support      = _wp_array_get( $block_type->supports, array( '__experimentalFontStyle' ), false );
     24    $has_font_weight_support     = _wp_array_get( $block_type->supports, array( '__experimentalFontWeight' ), false );
     25    $has_line_height_support     = _wp_array_get( $block_type->supports, array( 'lineHeight' ), false );
     26    $has_text_decoration_support = _wp_array_get( $block_type->supports, array( '__experimentalTextDecoration' ), false );
     27    $has_text_transform_support  = _wp_array_get( $block_type->supports, array( '__experimentalTextTransform' ), false );
     28
     29    $has_typography_support = $has_font_size_support
     30        || $has_font_weight_support
     31        || $has_font_style_support
     32        || $has_line_height_support
     33        || $has_text_transform_support
     34        || $has_text_decoration_support;
    2535
    2636    if ( ! $block_type->attributes ) {
    … …  
    2838    }
    2939
    30     if ( ( $has_font_size_support || $has_line_height_support ) && ! array_key_exists( 'style', $block_type->attributes ) ) {
     40    if ( $has_typography_support && ! array_key_exists( 'style', $block_type->attributes ) ) {
    3141        $block_type->attributes['style'] = array(
    3242            'type' => 'object',
    … …  
    4252
    4353/**
    44  * Add CSS classes and inline styles for font sizes to the incoming attributes array.
    45  * This will be applied to the block markup in the front-end.
    46  *
     54 * Add CSS classes and inline styles for typography features such as font sizes
     55 * to the incoming attributes array. This will be applied to the block markup in
     56 * the front-end.
     57 *
     58 * @since 5.6.0
    4759 * @access private
    4860 *
    … …  
    5062 * @param  array         $block_attributes Block attributes.
    5163 *
    52  * @return array Font size CSS classes and inline styles.
     64 * @return array Typography CSS classes and inline styles.
    5365 */
    5466function wp_apply_typography_support( $block_type, $block_attributes ) {
    55     $has_font_size_support = false;
    56     $classes               = array();
    57     $styles                = array();
    58     if ( property_exists( $block_type, 'supports' ) ) {
    59         $has_font_size_support = _wp_array_get( $block_type->supports, array( 'fontSize' ), false );
    60     }
    61 
    62     $has_line_height_support = false;
    63     if ( property_exists( $block_type, 'supports' ) ) {
    64         $has_line_height_support = _wp_array_get( $block_type->supports, array( 'lineHeight' ), false );
    65     }
     67    if ( ! property_exists( $block_type, 'supports' ) ) {
     68        return array();
     69    }
     70
     71    $classes = array();
     72    $styles  = array();
     73
     74    $has_font_family_support     = _wp_array_get( $block_type->supports, array( '__experimentalFontFamily' ), false );
     75    $has_font_style_support      = _wp_array_get( $block_type->supports, array( '__experimentalFontStyle' ), false );
     76    $has_font_weight_support     = _wp_array_get( $block_type->supports, array( '__experimentalFontWeight' ), false );
     77    $has_font_size_support       = _wp_array_get( $block_type->supports, array( 'fontSize' ), false );
     78    $has_line_height_support     = _wp_array_get( $block_type->supports, array( 'lineHeight' ), false );
     79    $has_text_decoration_support = _wp_array_get( $block_type->supports, array( '__experimentalTextDecoration' ), false );
     80    $has_text_transform_support  = _wp_array_get( $block_type->supports, array( '__experimentalTextTransform' ), false );
    6681
    6782    // Font Size.
    … …  
    7489            $classes[] = sprintf( 'has-%s-font-size', $block_attributes['fontSize'] );
    7590        } elseif ( $has_custom_font_size ) {
    76             $styles[] = sprintf( 'font-size: %spx;', $block_attributes['style']['typography']['fontSize'] );
     91            $styles[] = sprintf( 'font-size: %s;', $block_attributes['style']['typography']['fontSize'] );
     92        }
     93    }
     94
     95    // Font Family.
     96    if ( $has_font_family_support ) {
     97        $has_font_family = isset( $block_attributes['style']['typography']['fontFamily'] );
     98        // Apply required class and style.
     99        if ( $has_font_family ) {
     100            $font_family = $block_attributes['style']['typography']['fontFamily'];
     101            if ( strpos( $font_family, 'var:preset|font-family' ) !== false ) {
     102                // Get the name from the string and add proper styles.
     103                $index_to_splice  = strrpos( $font_family, '|' ) + 1;
     104                $font_family_name = substr( $font_family, $index_to_splice );
     105                $styles[]         = sprintf( 'font-family: var(--wp--preset--font-family--%s);', $font_family_name );
     106            } else {
     107                $styles[] = sprintf( 'font-family: %s;', $block_attributes['style']['color']['fontFamily'] );
     108            }
     109        }
     110    }
     111
     112    // Font style.
     113    if ( $has_font_style_support ) {
     114        // Apply font style.
     115        $font_style = wp_typography_get_css_variable_inline_style( $block_attributes, 'fontStyle', 'font-style' );
     116        if ( $font_style ) {
     117            $styles[] = $font_style;
     118        }
     119    }
     120
     121    // Font weight.
     122    if ( $has_font_weight_support ) {
     123        // Apply font weight.
     124        $font_weight = wp_typography_get_css_variable_inline_style( $block_attributes, 'fontWeight', 'font-weight' );
     125        if ( $font_weight ) {
     126            $styles[] = $font_weight;
    77127        }
    78128    }
    … …  
    87137    }
    88138
     139    // Text Decoration.
     140    if ( $has_text_decoration_support ) {
     141        $text_decoration_style = wp_typography_get_css_variable_inline_style( $block_attributes, 'textDecoration', 'text-decoration' );
     142        if ( $text_decoration_style ) {
     143            $styles[] = $text_decoration_style;
     144        }
     145    }
     146
     147    // Text Transform.
     148    if ( $has_text_transform_support ) {
     149        $text_transform_style = wp_typography_get_css_variable_inline_style( $block_attributes, 'textTransform', 'text-transform' );
     150        if ( $text_transform_style ) {
     151            $styles[] = $text_transform_style;
     152        }
     153    }
     154
    89155    $attributes = array();
    90156    if ( ! empty( $classes ) ) {
    … …  
    98164}
    99165
     166/**
     167 * Generates an inline style for a typography feature e.g. text decoration,
     168 * text transform, and font style.
     169 *
     170 * @since 5.8.0
     171 * @access private
     172 *
     173 * @param array  $attributes   Block's attributes.
     174 * @param string $feature      Key for the feature within the typography styles.
     175 * @param string $css_property Slug for the CSS property the inline style sets.
     176 *
     177 * @return string              CSS inline style.
     178 */
     179function wp_typography_get_css_variable_inline_style( $attributes, $feature, $css_property ) {
     180    // Retrieve current attribute value or skip if not found.
     181    $style_value = _wp_array_get( $attributes, array( 'style', 'typography', $feature ), false );
     182    if ( ! $style_value ) {
     183        return;
     184    }
     185
     186    // If we don't have a preset CSS variable, we'll assume it's a regular CSS value.
     187    if ( strpos( $style_value, "var:preset|{$css_property}|" ) === false ) {
     188        return sprintf( '%s:%s;', $css_property, $style_value );
     189    }
     190
     191    // We have a preset CSS variable as the style.
     192    // Get the style value from the string and return CSS style.
     193    $index_to_splice = strrpos( $style_value, '|' ) + 1;
     194    $slug            = substr( $style_value, $index_to_splice );
     195
     196    // Return the actual CSS inline style e.g. `text-decoration:var(--wp--preset--text-decoration--underline);`.
     197    return sprintf( '%s:var(--wp--preset--%s--%s);', $css_property, $css_property, $slug );
     198}
     199
     200// Register the block support.
    100201WP_Block_Supports::get_instance()->register(
    101202    'typography',
Note: See TracChangeset for help on using the changeset viewer.