Skip to content

Commit

Permalink
Add generated block classname to dynamic blocks (#24546)
Browse files Browse the repository at this point in the history
  • Loading branch information
@youknowriad
youknowriad authored Aug 17, 2020
1 parent 90a0eb3 commit 52cf528
Show file tree
Hide file tree
Showing 26 changed files with 150 additions and 77 deletions.
53 changes: 53 additions & 0 deletions lib/block-supports/generated-classname.php
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
<?php
/**
* Generated classname block support flag.
*
* @package gutenberg
*/

/**
* Get the generated classname from a given block name.
*
* @param string $block_name Block Name.
* @return string Generated classname.
*/
function gutenberg_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.
*
* @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;
}

/**
* Add the generated classnames to the output.
*
* @param array $attributes comprehensive list of attributes to be applied.
* @param array $block_attributes block attributes.
* @param array $block_type Block Type.
* @return array Block CSS classes and inline styles.
*/
function gutenberg_apply_generated_classname_support( $attributes, $block_attributes, $block_type ) {
$has_generated_classname_support = gutenberg_experimental_get( $block_type->supports, array( 'className' ), true );
if ( $has_generated_classname_support ) {
$block_classname = gutenberg_get_block_default_classname( $block_type->name );

if ( $block_classname ) {
$attributes['css_classes'][] = $block_classname;
}
}

return $attributes;
}
1 change: 1 addition & 0 deletions lib/block-supports/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ function gutenberg_apply_block_supports( $block_content, $block ) {
}

$attributes = array();
$attributes = gutenberg_apply_generated_classname_support( $attributes, $block['attrs'], $block_type );
$attributes = gutenberg_apply_colors_support( $attributes, $block['attrs'], $block_type );
$attributes = gutenberg_apply_typography_support( $attributes, $block['attrs'], $block_type );
$attributes = gutenberg_apply_alignment_support( $attributes, $block['attrs'], $block_type );
Expand Down
1 change: 1 addition & 0 deletions lib/load.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -117,3 +117,4 @@ function gutenberg_is_experiment_enabled( $name ) {
require dirname( __FILE__ ) . '/block-supports/colors.php';
require dirname( __FILE__ ) . '/block-supports/typography.php';
require dirname( __FILE__ ) . '/block-supports/custom-classname.php';
require dirname( __FILE__ ) . '/block-supports/generated-classname.php';
2 changes: 1 addition & 1 deletion packages/block-library/src/archives/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
function render_block_core_archives( $attributes ) {
$show_post_count = ! empty( $attributes['showPostCounts'] );

$class = 'wp-block-archives';
$class = '';

if ( ! empty( $attributes['displayAsDropdown'] ) ) {

Expand Down
3 changes: 1 addition & 2 deletions packages/block-library/src/calendar/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,8 +32,7 @@ function render_block_core_calendar( $attributes ) {
}

$output = sprintf(
'<div class="%1$s">%2$s</div>',
esc_attr( 'wp-block-calendar' ),
'<div>%1$s</div>',
get_calendar( true, false )
);

Expand Down
2 changes: 1 addition & 1 deletion packages/block-library/src/categories/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@ function render_block_core_categories( $attributes ) {
$type = 'list';
}

$class = "wp-block-categories wp-block-categories-{$type}";
$class = "wp-block-categories-{$type}";

return sprintf(
$wrapper_markup,
Expand Down
16 changes: 8 additions & 8 deletions packages/block-library/src/latest-comments/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -116,28 +116,28 @@ function render_block_core_latest_comments( $attributes = array() ) {
}
}

$class = 'wp-block-latest-comments';
$classnames = array();
if ( $attributes['displayAvatar'] ) {
$class .= ' has-avatars';
$classnames[] = 'has-avatars';
}
if ( $attributes['displayDate'] ) {
$class .= ' has-dates';
$classnames[] = 'has-dates';
}
if ( $attributes['displayExcerpt'] ) {
$class .= ' has-excerpts';
$classnames[] = 'has-excerpts';
}
if ( empty( $comments ) ) {
$class .= ' no-comments';
$classnames[] = 'no-comments';
}
$classnames = esc_attr( $class );
$class = esc_attr( implode( ' ', $classnames ) );

return ! empty( $comments ) ? sprintf(
'<ol class="%1$s">%2$s</ol>',
$classnames,
$class,
$list_items_markup
) : sprintf(
'<div class="%1$s">%2$s</div>',
$classnames,
$class,
__( 'No comments to show.' )
);
}
Expand Down
2 changes: 1 addition & 1 deletion packages/block-library/src/latest-posts/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -144,7 +144,7 @@ function render_block_core_latest_posts( $attributes ) {

remove_filter( 'excerpt_length', 'block_core_latest_posts_get_excerpt_length', 20 );

$class = 'wp-block-latest-posts wp-block-latest-posts__list';
$class = 'wp-block-latest-posts__list';

if ( isset( $attributes['postLayout'] ) && 'grid' === $attributes['postLayout'] ) {
$class .= ' is-grid';
Expand Down
1 change: 0 additions & 1 deletion packages/block-library/src/navigation-link/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -115,7 +115,6 @@ function render_block_core_navigation_link( $attributes, $content, $block ) {
$colors['css_classes'],
$font_sizes['css_classes']
);
$classes[] = 'wp-block-navigation-link';
$style_attribute = ( $colors['inline_styles'] || $font_sizes['inline_styles'] );

$css_classes = trim( implode( ' ', $classes ) );
Expand Down
1 change: 0 additions & 1 deletion packages/block-library/src/navigation/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -130,7 +130,6 @@ function render_block_core_navigation( $attributes, $content, $block ) {
$classes = array_merge(
$colors['css_classes'],
$font_sizes['css_classes'],
array( 'wp-block-navigation' ),
( isset( $attributes['orientation'] ) && 'vertical' === $attributes['orientation'] ) ? array( 'is-vertical' ) : array(),
isset( $attributes['itemsJustification'] ) ? array( 'items-justified-' . $attributes['itemsJustification'] ) : array()
);
Expand Down
1 change: 0 additions & 1 deletion packages/block-library/src/post-author/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,6 @@ function render_block_core_post_author( $attributes, $content, $block ) {

$byline = ! empty( $attributes['byline'] ) ? $attributes['byline'] : false;
$classes = array_merge(
array( 'wp-block-post-author' ),
isset( $attributes['className'] ) ? array( $attributes['className'] ) : array(),
isset( $attributes['itemsJustification'] ) ? array( 'items-justified-' . $attributes['itemsJustification'] ) : array(),
isset( $attributes['textAlign'] ) ? array( 'has-text-align-' . $attributes['textAlign'] ) : array()
Expand Down
4 changes: 2 additions & 2 deletions packages/block-library/src/post-comments-count/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,9 +18,9 @@ function render_block_core_post_comments_count( $attributes, $content, $block )
return '';
}

$classes = 'wp-block-post-comments-count';
$classes = '';
if ( isset( $attributes['textAlign'] ) ) {
$classes .= ' has-text-align-' . $attributes['textAlign'];
$classes .= 'has-text-align-' . $attributes['textAlign'];
}

return sprintf(
Expand Down
4 changes: 2 additions & 2 deletions packages/block-library/src/post-comments-form/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,9 +18,9 @@ function render_block_core_post_comments_form( $attributes, $content, $block ) {
return '';
}

$classes = 'wp-block-post-comments-form';
$classes = '';
if ( isset( $attributes['textAlign'] ) ) {
$classes .= ' has-text-align-' . $attributes['textAlign'];
$classes .= 'has-text-align-' . $attributes['textAlign'];
}

ob_start();
Expand Down
4 changes: 2 additions & 2 deletions packages/block-library/src/post-comments/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,9 +31,9 @@ function render_block_core_post_comments( $attributes, $content, $block ) {
comments_template();
$post = $post_before;

$classes = 'wp-block-post-comments';
$classes = '';
if ( isset( $attributes['textAlign'] ) ) {
$classes .= ' has-text-align-' . $attributes['textAlign'];
$classes .= 'has-text-align-' . $attributes['textAlign'];
}

$output = sprintf( '<div class="%1$s">', esc_attr( $classes ) ) . ob_get_clean() . '</div>';
Expand Down
4 changes: 2 additions & 2 deletions packages/block-library/src/post-date/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,11 +18,11 @@ function render_block_core_post_date( $attributes, $content, $block ) {
return '';
}

$align_class_name = empty( $attributes['textAlign'] ) ? '' : ' ' . "has-text-align-{$attributes['textAlign']}";
$align_class_name = empty( $attributes['textAlign'] ) ? '' : "has-text-align-{$attributes['textAlign']}";

return sprintf(
'<div class="%1$s"><time datetime="%2$s">%3$s</time></div>',
'wp-block-post-date' . esc_attr( $align_class_name ),
esc_attr( $align_class_name ),
get_the_date( 'c', $block->context['postId'] ),
get_the_date( isset( $attributes['format'] ) ? $attributes['format'] : '', $block->context['postId'] )
);
Expand Down
4 changes: 2 additions & 2 deletions packages/block-library/src/post-excerpt/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -28,9 +28,9 @@ function render_block_core_post_excerpt( $attributes, $content, $block ) {
$filter_excerpt_length
);

$classes = 'wp-block-post-excerpt';
$classes = '';
if ( isset( $attributes['textAlign'] ) ) {
$classes .= ' has-text-align-' . $attributes['textAlign'];
$classes .= 'has-text-align-' . $attributes['textAlign'];
}

$output = sprintf( '<div class="%1$s">', esc_attr( $classes ) ) . '<p class="wp-block-post-excerpt__excerpt">' . get_the_excerpt( $block->context['postId'] );
Expand Down
4 changes: 2 additions & 2 deletions packages/block-library/src/post-tags/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,9 +20,9 @@ function render_block_core_post_tags( $attributes, $content, $block ) {

$post_tags = get_the_tags( $block->context['postId'] );
if ( ! empty( $post_tags ) ) {
$classes = 'wp-block-post-tags';
$classes = '';
if ( isset( $attributes['textAlign'] ) ) {
$classes .= ' has-text-align-' . $attributes['textAlign'];
$classes .= 'has-text-align-' . $attributes['textAlign'];
}

$output = sprintf( '<div class="%1$s">', esc_attr( $classes ) );
Expand Down
4 changes: 2 additions & 2 deletions packages/block-library/src/post-title/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ function render_block_core_post_title( $attributes, $content, $block ) {
}

$tag_name = 'h2';
$align_class_name = empty( $attributes['textAlign'] ) ? '' : ' ' . "has-text-align-{$attributes['textAlign']}";
$align_class_name = empty( $attributes['textAlign'] ) ? '' : "has-text-align-{$attributes['textAlign']}";

if ( isset( $attributes['level'] ) ) {
$tag_name = 0 === $attributes['level'] ? 'p' : 'h' . $attributes['level'];
Expand All @@ -29,7 +29,7 @@ function render_block_core_post_title( $attributes, $content, $block ) {
return sprintf(
'<%1$s class="%2$s">%3$s</%1$s>',
$tag_name,
'wp-block-post-title' . esc_attr( $align_class_name ),
esc_attr( $align_class_name ),
get_the_title( $block->context['postId'] )
);
}
Expand Down
8 changes: 4 additions & 4 deletions packages/block-library/src/rss/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -79,16 +79,16 @@ function render_block_core_rss( $attributes ) {
$list_items .= "<li class='wp-block-rss__item'>{$title}{$date}{$author}{$excerpt}</li>";
}

$class = 'wp-block-rss';
$classnames = array();
if ( isset( $attributes['blockLayout'] ) && 'grid' === $attributes['blockLayout'] ) {
$class .= ' is-grid';
$classnames[] = 'is-grid';
}

if ( isset( $attributes['columns'] ) && 'grid' === $attributes['blockLayout'] ) {
$class .= ' columns-' . $attributes['columns'];
$classnames[] = 'columns-' . $attributes['columns'];
}

return sprintf( '<ul class="%s">%s</ul>', esc_attr( $class ), $list_items );
return sprintf( '<ul class="%s">%s</ul>', esc_attr( implode( ' ', $classnames ) ), $list_items );
}

/**
Expand Down
5 changes: 1 addition & 4 deletions packages/block-library/src/search/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -59,11 +59,8 @@ function render_block_core_search( $attributes ) {
);
}

$class = 'wp-block-search';

return sprintf(
'<form class="%s" role="search" method="get" action="%s">%s</form>',
esc_attr( $class ),
'<form role="search" method="get" action="%s">%s</form>',
esc_url( home_url( '/' ) ),
$label_markup . $input_markup . $button_markup
);
Expand Down
9 changes: 5 additions & 4 deletions packages/block-library/src/site-logo/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,16 +23,17 @@ function render_block_core_site_logo( $attributes ) {

add_filter( 'wp_get_attachment_image_src', $adjust_width_height_filter );
$custom_logo = get_custom_logo();
$class_name = 'wp-block-site-logo';
$classnames = array();
if ( ! empty( $attributes['className'] ) ) {
$class_name .= " {$attributes['className']}";
$classnames[] = $attributes['className'];
}

if ( ! empty( $attributes['align'] ) && in_array( $attributes['align'], array( 'center', 'left', 'right' ), true ) ) {
$class_name .= " align{$attributes['align']}";
$classnames[] = "align{$attributes['align']}";
}

$html = sprintf( '<div class="%s"><a href="' . get_bloginfo( 'url' ) . '" rel="home" title="' . get_bloginfo( 'name' ) . '">%s</a></div>', $class_name, $custom_logo );
$class_name = implode( ' ', $classnames );
$html = sprintf( '<div class="%s"><a href="' . get_bloginfo( 'url' ) . '" rel="home" title="' . get_bloginfo( 'name' ) . '">%s</a></div>', $class_name, $custom_logo );
remove_filter( 'wp_get_attachment_image_src', $adjust_width_height_filter );
return $html;
}
Expand Down
4 changes: 2 additions & 2 deletions packages/block-library/src/site-tagline/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,11 +13,11 @@
* @return string The render.
*/
function render_block_core_site_tagline( $attributes ) {
$align_class_name = empty( $attributes['textAlign'] ) ? '' : ' ' . "has-text-align-{$attributes['textAlign']}";
$align_class_name = empty( $attributes['textAlign'] ) ? '' : "has-text-align-{$attributes['textAlign']}";

return sprintf(
'<p class="%1$s">%2$s</p>',
'wp-block-site-tagline' . esc_attr( $align_class_name ),
esc_attr( $align_class_name ),
get_bloginfo( 'description' )
);
}
Expand Down
4 changes: 2 additions & 2 deletions packages/block-library/src/site-title/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
*/
function render_block_core_site_title( $attributes ) {
$tag_name = 'h1';
$align_class_name = empty( $attributes['textAlign'] ) ? '' : ' ' . "has-text-align-{$attributes['textAlign']}";
$align_class_name = empty( $attributes['textAlign'] ) ? '' : "has-text-align-{$attributes['textAlign']}";

if ( isset( $attributes['level'] ) ) {
$tag_name = 0 === $attributes['level'] ? 'p' : 'h' . $attributes['level'];
Expand All @@ -23,7 +23,7 @@ function render_block_core_site_title( $attributes ) {
return sprintf(
'<%1$s class="%2$s">%3$s</%1$s>',
$tag_name,
'wp-block-site-title' . esc_attr( $align_class_name ),
esc_attr( $align_class_name ),
get_bloginfo( 'name' )
);
}
Expand Down
7 changes: 2 additions & 5 deletions packages/block-library/src/tag-cloud/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,13 +13,11 @@
* @return string Returns the tag cloud for selected taxonomy.
*/
function render_block_core_tag_cloud( $attributes ) {
$class = 'wp-block-tag-cloud';
$args = array(
$args = array(
'echo' => false,
'taxonomy' => $attributes['taxonomy'],
'show_count' => $attributes['showTagCounts'],
);

$tag_cloud = wp_tag_cloud( $args );

if ( ! $tag_cloud ) {
Expand All @@ -34,8 +32,7 @@ function render_block_core_tag_cloud( $attributes ) {
}

return sprintf(
'<p class="%1$s">%2$s</p>',
esc_attr( $class ),
'<p>%1$s</p>',
$tag_cloud
);
}
Expand Down
2 changes: 1 addition & 1 deletion packages/block-library/src/template-part/index.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ function render_block_core_template_part( $attributes ) {
}
$content = do_shortcode( $content );

return '<div class="wp-block-template-part">' . str_replace( ']]>', ']]&gt;', $content ) . '</div>';
return '<div>' . str_replace( ']]>', ']]&gt;', $content ) . '</div>';
}

/**
Expand Down
Loading

0 comments on commit 52cf528

Please sign in to comment.