Changeset 53157 for trunk/src/wp-includes/blocks/navigation.php

Timestamp:

04/12/2022 03:10:30 PM (3 years ago)

Author:

gziolo

Message:

Editor: Update WordPress packages based based on Gutenberg v13.0 RC3

This is the last step of backports from the Gutenberg plugin for WordPress 6.0 Beta 1 release. It includes all updates WordPress packages published to npm based on the Gutenberg plugin v13.0 RC3 release. This patch also includes all the necessary changes applied to core blocks. New blocks included:

• Avatar
• Comment Author Name
• Comment Content
• Comment Date
• Comment Edit Link
• Comment Rely Link
• Comment Template
• Comments Pagination
• Comments Pagination Next
• Comments Pagination Previous
• Comments Query Loop
• Home Link
• Post Author Biography
• Query No Results
• Read More

See more details in ​https://github.com/WordPress/wordpress-develop/pull/2564.

Props zieladam, ramonopoly, ocean90.
Fixes #55505.

File:

• trunk/src/wp-includes/blocks/navigation.php (modified) (10 diffs)

trunk/src/wp-includes/blocks/navigation.php

@@ -246 +246 @@
  */
 function block_core_navigation_render_submenu_icon() {
-    return '<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none" role="img" aria-hidden="true" focusable="false"><path d="M1.50002 4L6.00002 8L10.5 4" stroke-width="1.5"></path></svg>';
+    return '<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12" fill="none" aria-hidden="true" focusable="false"><path d="M1.50002 4L6.00002 8L10.5 4" stroke-width="1.5"></path></svg>';
 }
 
@@ -344 +344 @@
      * children of the `core/navigation` block.
      *
+     * @since 5.9.0
+     *
      * @param array[] default fallback blocks provided by the default block mechanic.
      */
@@ -352 +354 @@
  * Renders the `core/navigation` block on server.
  *
- * @param array $attributes The block attributes.
- * @param array $content The saved content.
- * @param array $block The parsed block.
+ * @param array    $attributes The block attributes.
+ * @param string   $content    The saved content.
+ * @param WP_Block $block      The parsed block.
  *
  * @return string Returns the post content with the legacy widget added.
  */
 function render_block_core_navigation( $attributes, $content, $block ) {
+
+    static $seen_menu_names = array();
 
     // Flag used to indicate whether the rendered output is considered to be
     // a fallback (i.e. the block has no menu associated with it).
     $is_fallback = false;
+
+    $nav_menu_name = '';
 
     /**
@@ -427 +433 @@
         }
 
+        $nav_menu_name = $navigation_post->post_title;
+
+        if ( isset( $seen_menu_names[ $nav_menu_name ] ) ) {
+            ++$seen_menu_names[ $nav_menu_name ];
+        } else {
+            $seen_menu_names[ $nav_menu_name ] = 1;
+        }
+
         $parsed_blocks = parse_blocks( $navigation_post->post_content );
 
@@ -472 +486 @@
         $layout_class .= ' no-wrap';
     }
+
+    // Manually add block support text decoration as CSS class.
+    $text_decoration       = _wp_array_get( $attributes, array( 'style', 'typography', 'textDecoration' ), null );
+    $text_decoration_class = sprintf( 'has-text-decoration-%s', $text_decoration );
 
     $colors     = block_core_navigation_build_css_colors( $attributes );
@@ -480 +498 @@
         $is_responsive_menu ? array( 'is-responsive' ) : array(),
         $layout_class ? array( $layout_class ) : array(),
-        $is_fallback ? array( 'is-fallback' ) : array()
+        $is_fallback ? array( 'is-fallback' ) : array(),
+        $text_decoration ? array( $text_decoration_class ) : array()
     );
 
@@ -507 +526 @@
     $block_styles = isset( $attributes['styles'] ) ? $attributes['styles'] : '';
 
+    // If the menu name has been used previously then append an ID
+    // to the name to ensure uniqueness across a given post.
+    if ( isset( $seen_menu_names[ $nav_menu_name ] ) && $seen_menu_names[ $nav_menu_name ] > 1 ) {
+        $count         = $seen_menu_names[ $nav_menu_name ];
+        $nav_menu_name = $nav_menu_name . ' ' . ( $count );
+    }
+
     $wrapper_attributes = get_block_wrapper_attributes(
         array(
-            'class' => implode( ' ', $classes ),
-            'style' => $block_styles . $colors['inline_styles'] . $font_sizes['inline_styles'],
+            'class'      => implode( ' ', $classes ),
+            'style'      => $block_styles . $colors['inline_styles'] . $font_sizes['inline_styles'],
+            'aria-label' => $nav_menu_name,
         )
     );
 
-    $modal_unique_id = uniqid();
+    $modal_unique_id = wp_unique_id( 'modal-' );
 
     // Determine whether or not navigation elements should be wrapped in the markup required to make it responsive,
@@ -538 +565 @@
     );
 
+    $toggle_button_icon        = '<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><rect x="4" y="7.5" width="16" height="1.5" /><rect x="4" y="15" width="16" height="1.5" /></svg>';
+    $should_display_icon_label = isset( $attributes['hasIcon'] ) && true === $attributes['hasIcon'];
+    $toggle_button_content     = $should_display_icon_label ? $toggle_button_icon : 'Menu';
+
     $responsive_container_markup = sprintf(
-        '<button aria-haspopup="true" aria-label="%3$s" class="%6$s" data-micromodal-trigger="modal-%1$s"><svg width="24" height="24" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" role="img" aria-hidden="true" focusable="false"><rect x="4" y="7.5" width="16" height="1.5" /><rect x="4" y="15" width="16" height="1.5" /></svg></button>
-            <div class="%5$s" style="%7$s" id="modal-%1$s">
+        '<button aria-haspopup="true" aria-label="%3$s" class="%6$s" data-micromodal-trigger="%1$s">%9$s</button>
+            <div class="%5$s" style="%7$s" id="%1$s">
                 <div class="wp-block-navigation__responsive-close" tabindex="-1" data-micromodal-close>
                     <div class="wp-block-navigation__responsive-dialog" aria-label="%8$s">
-                            <button aria-label="%4$s" data-micromodal-close class="wp-block-navigation__responsive-container-close"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" role="img" aria-hidden="true" focusable="false"><path d="M13 11.8l6.1-6.3-1-1-6.1 6.2-6.1-6.2-1 1 6.1 6.3-6.5 6.7 1 1 6.5-6.6 6.5 6.6 1-1z"></path></svg></button>
-                        <div class="wp-block-navigation__responsive-container-content" id="modal-%1$s-content">
+                            <button aria-label="%4$s" data-micromodal-close class="wp-block-navigation__responsive-container-close"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24" aria-hidden="true" focusable="false"><path d="M13 11.8l6.1-6.3-1-1-6.1 6.2-6.1-6.2-1 1 6.1 6.3-6.5 6.7 1 1 6.5-6.6 6.5 6.6 1-1z"></path></svg></button>
+                        <div class="wp-block-navigation__responsive-container-content" id="%1$s-content">
                             %2$s
                         </div>
@@ -550 +581 @@
                 </div>
             </div>',
-        $modal_unique_id,
+        esc_attr( $modal_unique_id ),
         $inner_blocks_html,
         __( 'Open menu' ), // Open button label.
         __( 'Close menu' ), // Close button label.
-        implode( ' ', $responsive_container_classes ),
-        implode( ' ', $open_button_classes ),
-        $colors['overlay_inline_styles'],
-        __( 'Menu' )
+        esc_attr( implode( ' ', $responsive_container_classes ) ),
+        esc_attr( implode( ' ', $open_button_classes ) ),
+        safecss_filter_attr( $colors['overlay_inline_styles'] ),
+        __( 'Menu' ),
+        $toggle_button_content
     );
 
@@ -570 +602 @@
  * Register the navigation block.
  *
+ * @uses render_block_core_navigation()
  * @throws WP_Error An WP_Error exception parsing the block definition.
- * @uses render_block_core_navigation()
  */
 function register_block_core_navigation() {