Editor: Add layout controls to children of flex layout blocks.
Props isabel_brison, andrewserong, davidbaumwald, flixos90, mamaduka, ntsekouras, hellofromtonya. Fixes #57584. Built from https://develop.svn.wordpress.org/trunk@55282 git-svn-id: http://core.svn.wordpress.org/trunk@54815 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
parent
10838cb5a0
commit
dbdba246b6
|
@ -321,10 +321,53 @@ function wp_get_layout_style( $selector, $layout, $has_block_gap_support = false
|
|||
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 ) {
|
||||
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 );
|
||||
|
@ -341,7 +384,6 @@ function wp_render_layout_support_flag( $block_content, $block ) {
|
|||
|
||||
$class_names = array();
|
||||
$layout_definitions = _wp_array_get( $global_layout_settings, array( 'definitions' ), array() );
|
||||
$block_classname = wp_get_block_default_classname( $block['blockName'] );
|
||||
$container_class = wp_unique_id( 'wp-container-' );
|
||||
$layout_classname = '';
|
||||
|
||||
|
@ -417,7 +459,7 @@ function wp_render_layout_support_flag( $block_content, $block ) {
|
|||
$should_skip_gap_serialization = wp_should_skip_block_supports_serialization( $block_type, 'spacing', 'blockGap' );
|
||||
|
||||
$style = wp_get_layout_style(
|
||||
".$block_classname.$container_class",
|
||||
".$container_class.$container_class",
|
||||
$used_layout,
|
||||
$has_block_gap_support,
|
||||
$gap_value,
|
||||
|
@ -432,18 +474,49 @@ function wp_render_layout_support_flag( $block_content, $block ) {
|
|||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* This assumes the hook only applies to blocks with a single wrapper.
|
||||
* A limitation of this hook is that nested inner blocks wrappers are not yet supported.
|
||||
*/
|
||||
$content = preg_replace(
|
||||
'/' . preg_quote( 'class="', '/' ) . '/',
|
||||
'class="' . esc_attr( implode( ' ', $class_names ) ) . ' ',
|
||||
$block_content,
|
||||
1
|
||||
);
|
||||
$content_with_outer_classnames = '';
|
||||
|
||||
return $content;
|
||||
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] ) ) {
|
||||
$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.
|
||||
|
|
|
@ -16,7 +16,7 @@
|
|||
*
|
||||
* @global string $wp_version
|
||||
*/
|
||||
$wp_version = '6.2-alpha-55281';
|
||||
$wp_version = '6.2-alpha-55282';
|
||||
|
||||
/**
|
||||
* Holds the WordPress DB revision, increments when changes are made to the WordPress DB schema.
|
||||
|
|
Loading…
Reference in New Issue