From b441954040a083b51112312c8e17bc6dcd66dd06 Mon Sep 17 00:00:00 2001 From: Sergey Biryukov Date: Thu, 23 Jun 2022 23:11:10 +0000 Subject: [PATCH] Editor: Add utility classnames back to blocks that have layout attributes specified. [https://github.com/WordPress/gutenberg/issues/38719 In 5.9 these utility classnames were removed], which removed the ability for theme/plugin authors to assign their own custom CSS related to specific layout selections. This was mostly related to the Button block. This commit adds these classes dynamically based on attributes, rather than saving them to the serialized content. Original PR from Gutenberg repository: * [https://github.com/WordPress/gutenberg/pull/41487 #41487 Add utility classnames back to blocks that have layout attributes specified] Props glendaviesnz, peterwilsoncc, andrewserong, zieladam, matveb, samikeijonen. Merges [53568] to the 6.0 branch. See #56058. Built from https://develop.svn.wordpress.org/branches/6.0@53569 git-svn-id: https://core.svn.wordpress.org/branches/6.0@53158 1a063a9b-81f0-0310-95a4-ce76da25c4cd --- wp-includes/block-supports/layout.php | 27 +++++++++++++++++++++++---- wp-includes/version.php | 2 +- 2 files changed, 24 insertions(+), 5 deletions(-) diff --git a/wp-includes/block-supports/layout.php b/wp-includes/block-supports/layout.php index bd8666f044..4ad4665fd4 100644 --- a/wp-includes/block-supports/layout.php +++ b/wp-includes/block-supports/layout.php @@ -170,8 +170,27 @@ function wp_render_layout_support_flag( $block_content, $block ) { $used_layout = $default_layout; } - $class_name = wp_unique_id( 'wp-container-' ); - $gap_value = _wp_array_get( $block, array( 'attrs', 'style', 'spacing', 'blockGap' ) ); + $class_names = array(); + $container_class = wp_unique_id( 'wp-container-' ); + $class_names[] = $container_class; + + // 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'; + } + + $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 // because we only want to match against the value, not the CSS attribute. @@ -188,12 +207,12 @@ function wp_render_layout_support_flag( $block_content, $block ) { // 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( ".$class_name", $used_layout, $has_block_gap_support, $gap_value, $should_skip_gap_serialization, $fallback_gap_value ); + $style = wp_get_layout_style( ".$container_class", $used_layout, $has_block_gap_support, $gap_value, $should_skip_gap_serialization, $fallback_gap_value ); // This assumes the hook only applies to blocks with a single wrapper. // I think this is a reasonable limitation for that particular hook. $content = preg_replace( '/' . preg_quote( 'class="', '/' ) . '/', - 'class="' . esc_attr( $class_name ) . ' ', + 'class="' . esc_attr( implode( ' ', $class_names ) ) . ' ', $block_content, 1 ); diff --git a/wp-includes/version.php b/wp-includes/version.php index ae777b2bad..319523ddd1 100644 --- a/wp-includes/version.php +++ b/wp-includes/version.php @@ -16,7 +16,7 @@ * * @global string $wp_version */ -$wp_version = '6.0.1-alpha-53446'; +$wp_version = '6.0.1-alpha-53569'; /** * Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.