@wordpress/block-library 9.0.0 → 9.1.0

package/build-style/media-text/style.css

@@ -99,24 +99,24 @@
   grid-template-columns: 1fr 50%;
 }
 
-.wp-block-media-text.is-vertically-aligned-top .wp-block-media-text__content,
-.wp-block-media-text.is-vertically-aligned-top .wp-block-media-text__media {
+.wp-block-media-text.is-vertically-aligned-top > .wp-block-media-text__content,
+.wp-block-media-text.is-vertically-aligned-top > .wp-block-media-text__media {
   align-self: start;
 }
 
-.wp-block-media-text .wp-block-media-text__content,
-.wp-block-media-text .wp-block-media-text__media,
-.wp-block-media-text.is-vertically-aligned-center .wp-block-media-text__content,
-.wp-block-media-text.is-vertically-aligned-center .wp-block-media-text__media {
+.wp-block-media-text > .wp-block-media-text__content,
+.wp-block-media-text > .wp-block-media-text__media,
+.wp-block-media-text.is-vertically-aligned-center > .wp-block-media-text__content,
+.wp-block-media-text.is-vertically-aligned-center > .wp-block-media-text__media {
   align-self: center;
 }
 
-.wp-block-media-text.is-vertically-aligned-bottom .wp-block-media-text__content,
-.wp-block-media-text.is-vertically-aligned-bottom .wp-block-media-text__media {
+.wp-block-media-text.is-vertically-aligned-bottom > .wp-block-media-text__content,
+.wp-block-media-text.is-vertically-aligned-bottom > .wp-block-media-text__media {
   align-self: end;
 }
 
-.wp-block-media-text .wp-block-media-text__media {
+.wp-block-media-text > .wp-block-media-text__media {
   /*!rtl:begin:ignore*/
   grid-column: 1;
   grid-row: 1;
@@ -124,7 +124,7 @@
   margin: 0;
 }
 
-.wp-block-media-text .wp-block-media-text__content {
+.wp-block-media-text > .wp-block-media-text__content {
   direction: ltr;
   /*!rtl:begin:ignore*/
   grid-column: 2;
@@ -134,14 +134,14 @@
   word-break: break-word;
 }
 
-.wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {
+.wp-block-media-text.has-media-on-the-right > .wp-block-media-text__media {
   /*!rtl:begin:ignore*/
   grid-column: 2;
   grid-row: 1;
   /*!rtl:end:ignore*/
 }
 
-.wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
+.wp-block-media-text.has-media-on-the-right > .wp-block-media-text__content {
   /*!rtl:begin:ignore*/
   grid-column: 1;
   grid-row: 1;
@@ -156,18 +156,18 @@
   vertical-align: middle;
 }
 
-.wp-block-media-text.is-image-fill .wp-block-media-text__media {
+.wp-block-media-text.is-image-fill > .wp-block-media-text__media {
   height: 100%;
   min-height: 250px;
   background-size: cover;
 }
 
-.wp-block-media-text.is-image-fill .wp-block-media-text__media > a {
+.wp-block-media-text.is-image-fill > .wp-block-media-text__media > a {
   display: block;
   height: 100%;
 }
 
-.wp-block-media-text.is-image-fill .wp-block-media-text__media img {
+.wp-block-media-text.is-image-fill > .wp-block-media-text__media img {
   position: absolute;
   width: 1px;
   height: 1px;
@@ -189,11 +189,11 @@
   .wp-block-media-text.is-stacked-on-mobile {
     grid-template-columns: 100% !important;
   }
-  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media {
+  .wp-block-media-text.is-stacked-on-mobile > .wp-block-media-text__media {
     grid-column: 1;
     grid-row: 1;
   }
-  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content {
+  .wp-block-media-text.is-stacked-on-mobile > .wp-block-media-text__content {
     grid-column: 1;
     grid-row: 2;
   }

package/build-style/navigation/editor-rtl.css

@@ -417,21 +417,11 @@
   }
 }
 
-@media (min-width: 782px) {
-  .has-fixed-toolbar .wp-block-navigation__responsive-container.is-menu-open {
-    top: 141px;
-  }
-}
-
 .is-mobile-preview .wp-block-navigation__responsive-container.is-menu-open,
 .is-tablet-preview .wp-block-navigation__responsive-container.is-menu-open {
   top: 141px;
 }
 
-.is-sidebar-opened .wp-block-navigation__responsive-container.is-menu-open {
-  left: 280px;
-}
-
 .is-fullscreen-mode .wp-block-navigation__responsive-container.is-menu-open {
   right: 0;
   top: 155px;
@@ -441,11 +431,6 @@
     top: 61px;
   }
 }
-@media (min-width: 782px) {
-  .is-fullscreen-mode .has-fixed-toolbar .wp-block-navigation__responsive-container.is-menu-open {
-    top: 109px;
-  }
-}
 .is-fullscreen-mode .is-mobile-preview .wp-block-navigation__responsive-container.is-menu-open,
 .is-fullscreen-mode .is-tablet-preview .wp-block-navigation__responsive-container.is-menu-open {
   top: 109px;

package/build-style/navigation/editor.css

@@ -417,21 +417,11 @@
   }
 }
 
-@media (min-width: 782px) {
-  .has-fixed-toolbar .wp-block-navigation__responsive-container.is-menu-open {
-    top: 141px;
-  }
-}
-
 .is-mobile-preview .wp-block-navigation__responsive-container.is-menu-open,
 .is-tablet-preview .wp-block-navigation__responsive-container.is-menu-open {
   top: 141px;
 }
 
-.is-sidebar-opened .wp-block-navigation__responsive-container.is-menu-open {
-  right: 280px;
-}
-
 .is-fullscreen-mode .wp-block-navigation__responsive-container.is-menu-open {
   left: 0;
   top: 155px;
@@ -441,11 +431,6 @@
     top: 61px;
   }
 }
-@media (min-width: 782px) {
-  .is-fullscreen-mode .has-fixed-toolbar .wp-block-navigation__responsive-container.is-menu-open {
-    top: 109px;
-  }
-}
 .is-fullscreen-mode .is-mobile-preview .wp-block-navigation__responsive-container.is-menu-open,
 .is-fullscreen-mode .is-tablet-preview .wp-block-navigation__responsive-container.is-menu-open {
   top: 109px;

package/build-style/query/editor-rtl.css

@@ -123,7 +123,8 @@
   position: sticky;
   top: 0;
   padding: 16px 0;
-  margin-bottom: 2px;
+  transform: translateY(-4px);
+  margin-bottom: -4px;
   z-index: 2;
 }
 

package/build-style/query/editor.css

@@ -123,7 +123,8 @@
   position: sticky;
   top: 0;
   padding: 16px 0;
-  margin-bottom: 2px;
+  transform: translateY(-4px);
+  margin-bottom: -4px;
   z-index: 2;
 }
 

package/build-style/style-rtl.css

@@ -1986,30 +1986,30 @@ ul {
   grid-template-columns: 1fr 50%;
 }
 
-.wp-block-media-text.is-vertically-aligned-top .wp-block-media-text__content,
-.wp-block-media-text.is-vertically-aligned-top .wp-block-media-text__media {
+.wp-block-media-text.is-vertically-aligned-top > .wp-block-media-text__content,
+.wp-block-media-text.is-vertically-aligned-top > .wp-block-media-text__media {
   align-self: start;
 }
 
-.wp-block-media-text .wp-block-media-text__content,
-.wp-block-media-text .wp-block-media-text__media,
-.wp-block-media-text.is-vertically-aligned-center .wp-block-media-text__content,
-.wp-block-media-text.is-vertically-aligned-center .wp-block-media-text__media {
+.wp-block-media-text > .wp-block-media-text__content,
+.wp-block-media-text > .wp-block-media-text__media,
+.wp-block-media-text.is-vertically-aligned-center > .wp-block-media-text__content,
+.wp-block-media-text.is-vertically-aligned-center > .wp-block-media-text__media {
   align-self: center;
 }
 
-.wp-block-media-text.is-vertically-aligned-bottom .wp-block-media-text__content,
-.wp-block-media-text.is-vertically-aligned-bottom .wp-block-media-text__media {
+.wp-block-media-text.is-vertically-aligned-bottom > .wp-block-media-text__content,
+.wp-block-media-text.is-vertically-aligned-bottom > .wp-block-media-text__media {
   align-self: end;
 }
 
-.wp-block-media-text .wp-block-media-text__media {
+.wp-block-media-text > .wp-block-media-text__media {
   grid-column: 1;
   grid-row: 1;
   margin: 0;
 }
 
-.wp-block-media-text .wp-block-media-text__content {
+.wp-block-media-text > .wp-block-media-text__content {
   direction: rtl;
   grid-column: 2;
   grid-row: 1;
@@ -2017,12 +2017,12 @@ ul {
   word-break: break-word;
 }
 
-.wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {
+.wp-block-media-text.has-media-on-the-right > .wp-block-media-text__media {
   grid-column: 2;
   grid-row: 1;
 }
 
-.wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
+.wp-block-media-text.has-media-on-the-right > .wp-block-media-text__content {
   grid-column: 1;
   grid-row: 1;
 }
@@ -2035,18 +2035,18 @@ ul {
   vertical-align: middle;
 }
 
-.wp-block-media-text.is-image-fill .wp-block-media-text__media {
+.wp-block-media-text.is-image-fill > .wp-block-media-text__media {
   height: 100%;
   min-height: 250px;
   background-size: cover;
 }
 
-.wp-block-media-text.is-image-fill .wp-block-media-text__media > a {
+.wp-block-media-text.is-image-fill > .wp-block-media-text__media > a {
   display: block;
   height: 100%;
 }
 
-.wp-block-media-text.is-image-fill .wp-block-media-text__media img {
+.wp-block-media-text.is-image-fill > .wp-block-media-text__media img {
   position: absolute;
   width: 1px;
   height: 1px;
@@ -2068,11 +2068,11 @@ ul {
   .wp-block-media-text.is-stacked-on-mobile {
     grid-template-columns: 100% !important;
   }
-  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media {
+  .wp-block-media-text.is-stacked-on-mobile > .wp-block-media-text__media {
     grid-column: 1;
     grid-row: 1;
   }
-  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content {
+  .wp-block-media-text.is-stacked-on-mobile > .wp-block-media-text__content {
     grid-column: 1;
     grid-row: 2;
   }

package/build-style/style.css

@@ -2008,24 +2008,24 @@ ul {
   grid-template-columns: 1fr 50%;
 }
 
-.wp-block-media-text.is-vertically-aligned-top .wp-block-media-text__content,
-.wp-block-media-text.is-vertically-aligned-top .wp-block-media-text__media {
+.wp-block-media-text.is-vertically-aligned-top > .wp-block-media-text__content,
+.wp-block-media-text.is-vertically-aligned-top > .wp-block-media-text__media {
   align-self: start;
 }
 
-.wp-block-media-text .wp-block-media-text__content,
-.wp-block-media-text .wp-block-media-text__media,
-.wp-block-media-text.is-vertically-aligned-center .wp-block-media-text__content,
-.wp-block-media-text.is-vertically-aligned-center .wp-block-media-text__media {
+.wp-block-media-text > .wp-block-media-text__content,
+.wp-block-media-text > .wp-block-media-text__media,
+.wp-block-media-text.is-vertically-aligned-center > .wp-block-media-text__content,
+.wp-block-media-text.is-vertically-aligned-center > .wp-block-media-text__media {
   align-self: center;
 }
 
-.wp-block-media-text.is-vertically-aligned-bottom .wp-block-media-text__content,
-.wp-block-media-text.is-vertically-aligned-bottom .wp-block-media-text__media {
+.wp-block-media-text.is-vertically-aligned-bottom > .wp-block-media-text__content,
+.wp-block-media-text.is-vertically-aligned-bottom > .wp-block-media-text__media {
   align-self: end;
 }
 
-.wp-block-media-text .wp-block-media-text__media {
+.wp-block-media-text > .wp-block-media-text__media {
   /*!rtl:begin:ignore*/
   grid-column: 1;
   grid-row: 1;
@@ -2033,7 +2033,7 @@ ul {
   margin: 0;
 }
 
-.wp-block-media-text .wp-block-media-text__content {
+.wp-block-media-text > .wp-block-media-text__content {
   direction: ltr;
   /*!rtl:begin:ignore*/
   grid-column: 2;
@@ -2043,14 +2043,14 @@ ul {
   word-break: break-word;
 }
 
-.wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {
+.wp-block-media-text.has-media-on-the-right > .wp-block-media-text__media {
   /*!rtl:begin:ignore*/
   grid-column: 2;
   grid-row: 1;
   /*!rtl:end:ignore*/
 }
 
-.wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
+.wp-block-media-text.has-media-on-the-right > .wp-block-media-text__content {
   /*!rtl:begin:ignore*/
   grid-column: 1;
   grid-row: 1;
@@ -2065,18 +2065,18 @@ ul {
   vertical-align: middle;
 }
 
-.wp-block-media-text.is-image-fill .wp-block-media-text__media {
+.wp-block-media-text.is-image-fill > .wp-block-media-text__media {
   height: 100%;
   min-height: 250px;
   background-size: cover;
 }
 
-.wp-block-media-text.is-image-fill .wp-block-media-text__media > a {
+.wp-block-media-text.is-image-fill > .wp-block-media-text__media > a {
   display: block;
   height: 100%;
 }
 
-.wp-block-media-text.is-image-fill .wp-block-media-text__media img {
+.wp-block-media-text.is-image-fill > .wp-block-media-text__media img {
   position: absolute;
   width: 1px;
   height: 1px;
@@ -2098,11 +2098,11 @@ ul {
   .wp-block-media-text.is-stacked-on-mobile {
     grid-template-columns: 100% !important;
   }
-  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__media {
+  .wp-block-media-text.is-stacked-on-mobile > .wp-block-media-text__media {
     grid-column: 1;
     grid-row: 1;
   }
-  .wp-block-media-text.is-stacked-on-mobile .wp-block-media-text__content {
+  .wp-block-media-text.is-stacked-on-mobile > .wp-block-media-text__content {
     grid-column: 1;
     grid-row: 2;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-library",
-	"version": "9.0.0",
+	"version": "9.1.0",
 	"description": "Block library for the WordPress editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -32,39 +32,39 @@
 	],
 	"dependencies": {
 		"@babel/runtime": "^7.16.0",
-		"@wordpress/a11y": "^4.0.0",
-		"@wordpress/api-fetch": "^7.0.0",
-		"@wordpress/autop": "^4.0.0",
-		"@wordpress/blob": "^4.0.0",
-		"@wordpress/block-editor": "^13.0.0",
-		"@wordpress/blocks": "^13.0.0",
-		"@wordpress/components": "^28.0.0",
-		"@wordpress/compose": "^7.0.0",
-		"@wordpress/core-data": "^7.0.0",
-		"@wordpress/data": "^10.0.0",
-		"@wordpress/date": "^5.0.0",
-		"@wordpress/deprecated": "^4.0.0",
-		"@wordpress/dom": "^4.0.0",
-		"@wordpress/element": "^6.0.0",
-		"@wordpress/escape-html": "^3.0.0",
-		"@wordpress/hooks": "^4.0.0",
-		"@wordpress/html-entities": "^4.0.0",
-		"@wordpress/i18n": "^5.0.0",
-		"@wordpress/icons": "^10.0.0",
-		"@wordpress/interactivity": "^6.0.0",
-		"@wordpress/interactivity-router": "^2.0.0",
-		"@wordpress/keyboard-shortcuts": "^5.0.0",
-		"@wordpress/keycodes": "^4.0.0",
-		"@wordpress/notices": "^5.0.0",
-		"@wordpress/patterns": "^2.0.0",
-		"@wordpress/primitives": "^4.0.0",
-		"@wordpress/private-apis": "^1.0.0",
-		"@wordpress/reusable-blocks": "^5.0.0",
-		"@wordpress/rich-text": "^7.0.0",
-		"@wordpress/server-side-render": "^5.0.0",
-		"@wordpress/url": "^4.0.0",
-		"@wordpress/viewport": "^6.0.0",
-		"@wordpress/wordcount": "^4.0.0",
+		"@wordpress/a11y": "^4.1.0",
+		"@wordpress/api-fetch": "^7.1.0",
+		"@wordpress/autop": "^4.1.0",
+		"@wordpress/blob": "^4.1.0",
+		"@wordpress/block-editor": "^13.1.0",
+		"@wordpress/blocks": "^13.1.0",
+		"@wordpress/components": "^28.1.0",
+		"@wordpress/compose": "^7.1.0",
+		"@wordpress/core-data": "^7.1.0",
+		"@wordpress/data": "^10.1.0",
+		"@wordpress/date": "^5.1.0",
+		"@wordpress/deprecated": "^4.1.0",
+		"@wordpress/dom": "^4.1.0",
+		"@wordpress/element": "^6.1.0",
+		"@wordpress/escape-html": "^3.1.0",
+		"@wordpress/hooks": "^4.1.0",
+		"@wordpress/html-entities": "^4.1.0",
+		"@wordpress/i18n": "^5.1.0",
+		"@wordpress/icons": "^10.1.0",
+		"@wordpress/interactivity": "^6.1.0",
+		"@wordpress/interactivity-router": "^2.1.0",
+		"@wordpress/keyboard-shortcuts": "^5.1.0",
+		"@wordpress/keycodes": "^4.1.0",
+		"@wordpress/notices": "^5.1.0",
+		"@wordpress/patterns": "^2.1.0",
+		"@wordpress/primitives": "^4.1.0",
+		"@wordpress/private-apis": "^1.1.0",
+		"@wordpress/reusable-blocks": "^5.1.0",
+		"@wordpress/rich-text": "^7.1.0",
+		"@wordpress/server-side-render": "^5.1.0",
+		"@wordpress/url": "^4.1.0",
+		"@wordpress/viewport": "^6.1.0",
+		"@wordpress/wordcount": "^4.1.0",
 		"change-case": "^4.1.2",
 		"clsx": "^2.1.1",
 		"colord": "^2.7.0",
@@ -82,5 +82,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "2f30cddff15723ac7017fd009fc5913b7b419400"
+	"gitHead": "66d3bf12e67d16deddc4b4a9ec42e1d0bed3479a"
 }

package/src/button/index.php

@@ -0,0 +1,80 @@
+<?php
+/**
+ * Server-side rendering of the `core/button` block.
+ *
+ * @package WordPress
+ */
+
+/**
+ * Renders the `core/button` block on the server,
+ *
+ * @since 6.6.0
+ *
+ * @param array    $attributes The block attributes.
+ * @param string   $content    The block content.
+ * @param WP_Block $block      The block object.
+ *
+ * @return string The block content.
+ */
+function render_block_core_button( $attributes, $content ) {
+	$p = new WP_HTML_Tag_Processor( $content );
+
+	/*
+	 * The button block can render an `<a>` or `<button>` and also has a
+	 * `<div>` wrapper. Find the a or button tag.
+	 */
+	$tag = null;
+	while ( $p->next_tag() ) {
+		$tag = $p->get_tag();
+		if ( 'A' === $tag || 'BUTTON' === $tag ) {
+			break;
+		}
+	}
+
+	/*
+	 * If this happens, the likelihood is there's no block content,
+	 * or the block has been modified by a plugin.
+	 */
+	if ( null === $tag ) {
+		return $content;
+	}
+
+	// If the next token is the closing tag, the button is empty.
+	$is_empty = true;
+	while ( $p->next_token() && $tag !== $p->get_token_name() && $is_empty ) {
+		if ( '#comment' !== $p->get_token_type() ) {
+			/**
+			 * Anything else implies this is not empty.
+			 * This might include any text content (including a space),
+			 * inline images or other HTML.
+			 */
+			$is_empty = false;
+		}
+	}
+
+	/*
+	 * When there's no text, render nothing for the block.
+	 * See https://github.com/WordPress/gutenberg/issues/17221 for the
+	 * reasoning behind this.
+	 */
+	if ( $is_empty ) {
+		return '';
+	}
+
+	return $content;
+}
+
+/**
+ * Registers the `core/button` block on server.
+ *
+ * @since 6.6.0
+ */
+function register_block_core_button() {
+	register_block_type_from_metadata(
+		__DIR__ . '/button',
+		array(
+			'render_callback' => 'render_block_core_button',
+		)
+	);
+}
+add_action( 'init', 'register_block_core_button' );

package/src/button/save.js

@@ -31,10 +31,6 @@ export default function save( { attributes, className } ) {
 		width,
 	} = attributes;
 
-	if ( RichText.isEmpty( text ) ) {
-		return null;
-	}
-
 	const TagName = tagName || 'a';
 	const isButtonTag = 'button' === TagName;
 	const buttonType = type || 'button';

package/src/buttons/test/__snapshots__/edit.native.js.snap

@@ -2,51 +2,69 @@
 
 exports[`Buttons block color customization sets a background color 1`] = `
 "<!-- wp:buttons -->
-<div class="wp-block-buttons"><!-- wp:button {"backgroundColor":"luminous-vivid-amber"} /--></div>
+<div class="wp-block-buttons"><!-- wp:button {"backgroundColor":"luminous-vivid-amber"} -->
+<div class="wp-block-button"><a class="wp-block-button__link has-luminous-vivid-amber-background-color has-background wp-element-button" href=""></a></div>
+<!-- /wp:button --></div>
 <!-- /wp:buttons -->"
 `;
 
 exports[`Buttons block color customization sets a custom gradient background color 1`] = `
 "<!-- wp:buttons -->
-<div class="wp-block-buttons"><!-- wp:button {"style":{"color":{"gradient":"linear-gradient(200deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%)"}}} /--></div>
+<div class="wp-block-buttons"><!-- wp:button {"style":{"color":{"gradient":"linear-gradient(200deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%)"}}} -->
+<div class="wp-block-button"><a class="wp-block-button__link has-background wp-element-button" href="" style="background:linear-gradient(200deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%)"></a></div>
+<!-- /wp:button --></div>
 <!-- /wp:buttons -->"
 `;
 
 exports[`Buttons block color customization sets a gradient background color 1`] = `
 "<!-- wp:buttons -->
-<div class="wp-block-buttons"><!-- wp:button {"gradient":"light-green-cyan-to-vivid-green-cyan"} /--></div>
+<div class="wp-block-buttons"><!-- wp:button {"gradient":"light-green-cyan-to-vivid-green-cyan"} -->
+<div class="wp-block-button"><a class="wp-block-button__link has-light-green-cyan-to-vivid-green-cyan-gradient-background has-background wp-element-button" href=""></a></div>
+<!-- /wp:button --></div>
 <!-- /wp:buttons -->"
 `;
 
 exports[`Buttons block color customization sets a text color 1`] = `
 "<!-- wp:buttons -->
-<div class="wp-block-buttons"><!-- wp:button {"textColor":"pale-pink"} /--></div>
+<div class="wp-block-buttons"><!-- wp:button {"textColor":"pale-pink"} -->
+<div class="wp-block-button"><a class="wp-block-button__link has-pale-pink-color has-text-color wp-element-button" href=""></a></div>
+<!-- /wp:button --></div>
 <!-- /wp:buttons -->"
 `;
 
 exports[`Buttons block justify content sets Justify items center option 1`] = `
 "<!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center"}} -->
-<div class="wp-block-buttons"><!-- wp:button /--></div>
+<div class="wp-block-buttons"><!-- wp:button -->
+<div class="wp-block-button"><a class="wp-block-button__link wp-element-button"></a></div>
+<!-- /wp:button --></div>
 <!-- /wp:buttons -->"
 `;
 
 exports[`Buttons block justify content sets Justify items left option 1`] = `
 "<!-- wp:buttons {"layout":{"type":"flex","justifyContent":"left"}} -->
-<div class="wp-block-buttons"><!-- wp:button /--></div>
+<div class="wp-block-buttons"><!-- wp:button -->
+<div class="wp-block-button"><a class="wp-block-button__link wp-element-button"></a></div>
+<!-- /wp:button --></div>
 <!-- /wp:buttons -->"
 `;
 
 exports[`Buttons block justify content sets Justify items right option 1`] = `
 "<!-- wp:buttons {"layout":{"type":"flex","justifyContent":"right"}} -->
-<div class="wp-block-buttons"><!-- wp:button /--></div>
+<div class="wp-block-buttons"><!-- wp:button -->
+<div class="wp-block-button"><a class="wp-block-button__link wp-element-button"></a></div>
+<!-- /wp:button --></div>
 <!-- /wp:buttons -->"
 `;
 
 exports[`Buttons block when a button is shown adds another button using the inline appender 1`] = `
 "<!-- wp:buttons -->
-<div class="wp-block-buttons"><!-- wp:button /-->
+<div class="wp-block-buttons"><!-- wp:button -->
+<div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href=""></a></div>
+<!-- /wp:button -->
 
-<!-- wp:button /--></div>
+<!-- wp:button -->
+<div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href=""></a></div>
+<!-- /wp:button --></div>
 <!-- /wp:buttons -->
 
 <!-- wp:paragraph -->
@@ -56,7 +74,9 @@ exports[`Buttons block when a button is shown adds another button using the inli
 
 exports[`Buttons block when a button is shown adds another button using the inserter 1`] = `
 "<!-- wp:buttons -->
-<div class="wp-block-buttons"><!-- wp:button /-->
+<div class="wp-block-buttons"><!-- wp:button -->
+<div class="wp-block-button"><a class="wp-block-button__link wp-element-button" href=""></a></div>
+<!-- /wp:button -->
 
 <!-- wp:button -->
 <div class="wp-block-button"><a class="wp-block-button__link wp-element-button">Hello!</a></div>