Ticket #5411: 5411-wip.diff

template-parts/section-blocks.php

@@ -13 +13 @@
 
 $classes = [ 'plugin-' . $section_slug, 'section' ];
 $classes = implode( ' ', $classes );
+
+$allowed_svg = array(
+        'svg'   => array(
+                'class' => true,
+                'aria-hidden' => true,
+                'aria-labelledby' => true,
+                'role' => true,
+                'xmlns' => true,
+                'width' => true,
+                'height' => true,
+                'viewbox' => true,
+        ),
+        'g'     => array( 'fill' => true ),
+        'title' => array( 'title' => true ),
+        'path'  => array(
+                'd' => true,
+                'fill' => true,
+                'transform' => true,
+        ),
+);
+
 ?>
+<style>
+.block-icon {
+        display: inline-block;
+        width: 1rem;
+        height: 1rem;
+}
+.block-icon svg {
+        min-width: 24px;
+        min-height: 24px;
+        max-width: 1rem;
+        max-height: 1rem;
+        fill: currentColor;
+}
+</style>
 
 <div id="<?php echo esc_attr( $prefix . $section_slug ); ?>" class="<?php echo esc_attr( $classes ); ?>">
         <h2 id="<?php echo esc_attr( $section_slug . '-header' ); ?>"><?php echo esc_html( $section['title'] ); ?></h2>
@@ -20 +55 @@
 
         <p><?php printf( esc_html( _n( 'This plugin provides %d block.', 'This plugin provides %d blocks.', count( $section_content ), 'wporg-plugins'  ) ), count( $section_content ) ); ?></p>
         <dl>
-                <?php foreach ( $section_content as $block ) : ?>
-                        <dt><?php if ( isset( $block->name ) ) echo esc_html( $block->name ); ?></dt>
-                                <dd><?php if ( isset( $block->title ) ) echo esc_html( $block->title ); ?></dd>
+                <?php foreach ( $section_content as $block ) :
+                        $block_name = isset( $block->title ) ? $block->title : false;
+                        if ( ! $block_name ) {
+                                $block_name = isset( $block->name ) ? $block->name : false;
+                        }
+                        if ( ! $block_name ) {
+                                // If we still have no name, we don't have a valid block.
+                                continue;
+                        }
+                        $block_icon = isset( $block->icon ) ? $block->icon : '';
+                        ?>
+                        <dt>
+                                <?php if ( false !== strpos( $block_icon, '<svg' ) ) : ?>
+                                        <span class="block-icon">
+                                                <?php echo wp_kses( str_replace( '<svg ', '<svg role="img" aria-hidden="true" focusable="false" ', $block_icon ), $allowed_svg ); ?>
+                                        </span>
+                                <?php elseif ( $block_icon ) : ?>
+                                        <span class="block-icon dashicons dashicons-<?php echo esc_attr( $block->icon ); ?>"></span>
+                                <?php endif; ?>
+                                <?php echo esc_html( $block_name ); ?>
+                        </dt>
+                        <?php if ( isset( $block->description ) ) : ?>
+                                <dd><?php echo esc_html( $block->description ); ?></dd>
+                        <?php endif; ?>
                 <?php endforeach; ?>
         </dl>
 </div>