@wordpress/block-library 7.16.0 → 7.18.0

package/build-style/cover/editor.css

@@ -160,4 +160,8 @@
 
 .color-block-support-panel__inner-wrapper > :not(.block-editor-tools-panel-color-gradient-settings__item) {
   margin-top: 24px;
+}
+
+.wp-block-cover::after {
+  min-height: auto;
 }

package/build-style/editor-rtl.css

@@ -253,6 +253,7 @@ html :where(.wp-block-column) {
 
 /* Styles for backwards compatibility with the legacy `post-comments` block */
 .wp-block-post-comments, .wp-block-comments__legacy-placeholder {
+  box-sizing: border-box;
   /* utility classes */
   /* end utility classes */
 }
@@ -512,6 +513,10 @@ html :where(.wp-block-column) {
   margin-top: 24px;
 }
 
+.wp-block-cover::after {
+  min-height: auto;
+}
+
 .wp-block-embed {
   margin-right: 0;
   margin-left: 0;
@@ -1104,6 +1109,7 @@ figure.wp-block-gallery .components-spinner {
   flex: 1 0 48px;
   pointer-events: none;
   min-height: 46px;
+  border: 1px dashed currentColor;
   border-radius: 2px;
 }
 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child::after::before {
@@ -1195,7 +1201,7 @@ figure.wp-block-image:not(.wp-block) {
 }
 
 .wp-block-image .components-resizable-box__container {
-  display: inline-block;
+  display: table;
 }
 .wp-block-image .components-resizable-box__container img {
   display: block;
@@ -1580,10 +1586,6 @@ figure.wp-block-image:not(.wp-block) {
   color: #1e1e1e;
 }
 
-.wp-block-navigation-placeholder .components-spinner {
-  margin-top: 0;
-}
-
 .wp-block-navigation-placeholder__preview {
   display: flex;
   align-items: center;
@@ -1605,6 +1607,7 @@ figure.wp-block-image:not(.wp-block) {
   bottom: 0;
   right: 0;
   pointer-events: none;
+  border: 1px dashed currentColor;
   border-radius: 2px;
   border-radius: inherit;
 }
@@ -1819,6 +1822,10 @@ body.editor-styles-wrapper .wp-block-navigation__responsive-container.is-menu-op
   padding: 8px 12px;
 }
 
+.wp-block-navigation .wp-block-navigation__uncontrolled-inner-blocks-loading-indicator {
+  margin-top: 0;
+}
+
 @keyframes fadeouthalf {
   0% {
     opacity: 1;
@@ -2101,22 +2108,6 @@ body.editor-styles-wrapper .wp-block-navigation__responsive-container.is-menu-op
   opacity: 0;
 }
 
-.components-popover.wp-block-paragraph__drop-zone .components-popover__content {
-  border: none;
-  outline: none;
-  box-shadow: none;
-}
-.components-popover.wp-block-paragraph__drop-zone .wp-block-paragraph__drop-zone-backdrop {
-  position: absolute;
-}
-.components-popover.wp-block-paragraph__drop-zone .wp-block-paragraph__drop-zone-foreground {
-  position: absolute;
-  inset: 0;
-  pointer-events: none;
-  background-color: var(--wp-admin-theme-color);
-  border-radius: 2px;
-}
-
 .wp-block-post-excerpt .wp-block-post-excerpt__excerpt.is-inline {
   display: inline-block;
 }
@@ -2268,6 +2259,7 @@ body.editor-styles-wrapper .wp-block-navigation__responsive-container.is-menu-op
   border-radius: inherit;
 }
 .wp-block-site-logo.wp-block-site-logo .components-placeholder {
+  display: flex;
   justify-content: center;
   align-items: center;
   padding: 0;

package/build-style/editor.css

@@ -254,6 +254,7 @@ html :where(.wp-block-column) {
 
 /* Styles for backwards compatibility with the legacy `post-comments` block */
 .wp-block-post-comments, .wp-block-comments__legacy-placeholder {
+  box-sizing: border-box;
   /* utility classes */
   /* end utility classes */
 }
@@ -516,6 +517,10 @@ html :where(.wp-block-column) {
   margin-top: 24px;
 }
 
+.wp-block-cover::after {
+  min-height: auto;
+}
+
 .wp-block-embed {
   margin-left: 0;
   margin-right: 0;
@@ -1112,6 +1117,7 @@ figure.wp-block-gallery .components-spinner {
   flex: 1 0 48px;
   pointer-events: none;
   min-height: 46px;
+  border: 1px dashed currentColor;
   border-radius: 2px;
 }
 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child::after::before {
@@ -1203,7 +1209,7 @@ figure.wp-block-image:not(.wp-block) {
 }
 
 .wp-block-image .components-resizable-box__container {
-  display: inline-block;
+  display: table;
 }
 .wp-block-image .components-resizable-box__container img {
   display: block;
@@ -1588,10 +1594,6 @@ figure.wp-block-image:not(.wp-block) {
   color: #1e1e1e;
 }
 
-.wp-block-navigation-placeholder .components-spinner {
-  margin-top: 0;
-}
-
 .wp-block-navigation-placeholder__preview {
   display: flex;
   align-items: center;
@@ -1613,6 +1615,7 @@ figure.wp-block-image:not(.wp-block) {
   bottom: 0;
   left: 0;
   pointer-events: none;
+  border: 1px dashed currentColor;
   border-radius: 2px;
   border-radius: inherit;
 }
@@ -1827,6 +1830,10 @@ body.editor-styles-wrapper .wp-block-navigation__responsive-container.is-menu-op
   padding: 8px 12px;
 }
 
+.wp-block-navigation .wp-block-navigation__uncontrolled-inner-blocks-loading-indicator {
+  margin-top: 0;
+}
+
 @keyframes fadeouthalf {
   0% {
     opacity: 1;
@@ -2109,22 +2116,6 @@ body.editor-styles-wrapper .wp-block-navigation__responsive-container.is-menu-op
   opacity: 0;
 }
 
-.components-popover.wp-block-paragraph__drop-zone .components-popover__content {
-  border: none;
-  outline: none;
-  box-shadow: none;
-}
-.components-popover.wp-block-paragraph__drop-zone .wp-block-paragraph__drop-zone-backdrop {
-  position: absolute;
-}
-.components-popover.wp-block-paragraph__drop-zone .wp-block-paragraph__drop-zone-foreground {
-  position: absolute;
-  inset: 0;
-  pointer-events: none;
-  background-color: var(--wp-admin-theme-color);
-  border-radius: 2px;
-}
-
 .wp-block-post-excerpt .wp-block-post-excerpt__excerpt.is-inline {
   display: inline-block;
 }
@@ -2276,6 +2267,7 @@ body.editor-styles-wrapper .wp-block-navigation__responsive-container.is-menu-op
   border-radius: inherit;
 }
 .wp-block-site-logo.wp-block-site-logo .components-placeholder {
+  display: flex;
   justify-content: center;
   align-items: center;
   padding: 0;

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

@@ -109,6 +109,7 @@
   flex: 1 0 48px;
   pointer-events: none;
   min-height: 46px;
+  border: 1px dashed currentColor;
   border-radius: 2px;
 }
 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child::after::before {

package/build-style/group/editor.css

@@ -109,6 +109,7 @@
   flex: 1 0 48px;
   pointer-events: none;
   min-height: 46px;
+  border: 1px dashed currentColor;
   border-radius: 2px;
 }
 .wp-block-group.is-layout-flex.block-editor-block-list__block > .block-list-appender:only-child::after::before {

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

@@ -118,7 +118,7 @@ figure.wp-block-image:not(.wp-block) {
 }
 
 .wp-block-image .components-resizable-box__container {
-  display: inline-block;
+  display: table;
 }
 .wp-block-image .components-resizable-box__container img {
   display: block;

package/build-style/image/editor.css

@@ -118,7 +118,7 @@ figure.wp-block-image:not(.wp-block) {
 }
 
 .wp-block-image .components-resizable-box__container {
-  display: inline-block;
+  display: table;
 }
 .wp-block-image .components-resizable-box__container img {
   display: block;

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

@@ -256,10 +256,6 @@
   color: #1e1e1e;
 }
 
-.wp-block-navigation-placeholder .components-spinner {
-  margin-top: 0;
-}
-
 .wp-block-navigation-placeholder__preview {
   display: flex;
   align-items: center;
@@ -281,6 +277,7 @@
   bottom: 0;
   right: 0;
   pointer-events: none;
+  border: 1px dashed currentColor;
   border-radius: 2px;
   border-radius: inherit;
 }
@@ -495,6 +492,10 @@ body.editor-styles-wrapper .wp-block-navigation__responsive-container.is-menu-op
   padding: 8px 12px;
 }
 
+.wp-block-navigation .wp-block-navigation__uncontrolled-inner-blocks-loading-indicator {
+  margin-top: 0;
+}
+
 @keyframes fadeouthalf {
   0% {
     opacity: 1;

package/build-style/navigation/editor.css

@@ -256,10 +256,6 @@
   color: #1e1e1e;
 }
 
-.wp-block-navigation-placeholder .components-spinner {
-  margin-top: 0;
-}
-
 .wp-block-navigation-placeholder__preview {
   display: flex;
   align-items: center;
@@ -281,6 +277,7 @@
   bottom: 0;
   left: 0;
   pointer-events: none;
+  border: 1px dashed currentColor;
   border-radius: 2px;
   border-radius: inherit;
 }
@@ -495,6 +492,10 @@ body.editor-styles-wrapper .wp-block-navigation__responsive-container.is-menu-op
   padding: 8px 12px;
 }
 
+.wp-block-navigation .wp-block-navigation__uncontrolled-inner-blocks-loading-indicator {
+  margin-top: 0;
+}
+
 @keyframes fadeouthalf {
   0% {
     opacity: 1;

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

@@ -311,7 +311,9 @@ button.wp-block-navigation-item__content {
 }
 
 :where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item a:not(.wp-element-button)),
-:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-submenu a:not(.wp-element-button)) {
+:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-submenu a:not(.wp-element-button)),
+:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-submenu button.wp-block-navigation-item__content),
+:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-pages-list__item button.wp-block-navigation-item__content) {
   padding: 0.5em 1em;
 }
 

package/build-style/navigation/style.css

@@ -311,7 +311,9 @@ button.wp-block-navigation-item__content {
 }
 
 :where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item a:not(.wp-element-button)),
-:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-submenu a:not(.wp-element-button)) {
+:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-submenu a:not(.wp-element-button)),
+:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-submenu button.wp-block-navigation-item__content),
+:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-pages-list__item button.wp-block-navigation-item__content) {
   padding: 0.5em 1em;
 }
 

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

@@ -84,20 +84,4 @@
 
 .block-editor-block-list__block[data-empty=true] + .block-editor-block-list__block[data-empty=true]:not([data-custom-placeholder=true]) [data-rich-text-placeholder] {
   opacity: 0;
-}
-
-.components-popover.wp-block-paragraph__drop-zone .components-popover__content {
-  border: none;
-  outline: none;
-  box-shadow: none;
-}
-.components-popover.wp-block-paragraph__drop-zone .wp-block-paragraph__drop-zone-backdrop {
-  position: absolute;
-}
-.components-popover.wp-block-paragraph__drop-zone .wp-block-paragraph__drop-zone-foreground {
-  position: absolute;
-  inset: 0;
-  pointer-events: none;
-  background-color: var(--wp-admin-theme-color);
-  border-radius: 2px;
 }

package/build-style/paragraph/editor.css

@@ -84,20 +84,4 @@
 
 .block-editor-block-list__block[data-empty=true] + .block-editor-block-list__block[data-empty=true]:not([data-custom-placeholder=true]) [data-rich-text-placeholder] {
   opacity: 0;
-}
-
-.components-popover.wp-block-paragraph__drop-zone .components-popover__content {
-  border: none;
-  outline: none;
-  box-shadow: none;
-}
-.components-popover.wp-block-paragraph__drop-zone .wp-block-paragraph__drop-zone-backdrop {
-  position: absolute;
-}
-.components-popover.wp-block-paragraph__drop-zone .wp-block-paragraph__drop-zone-foreground {
-  position: absolute;
-  inset: 0;
-  pointer-events: none;
-  background-color: var(--wp-admin-theme-color);
-  border-radius: 2px;
 }

package/build-style/post-comments-form/style-rtl.css

@@ -74,6 +74,9 @@
 /**
  * Reset the WP Admin page styles for Gutenberg-like pages.
  */
+.wp-block-post-comments-form {
+  box-sizing: border-box;
+}
 .wp-block-post-comments-form[style*=font-weight] :where(.comment-reply-title) {
   font-weight: inherit;
 }

package/build-style/post-comments-form/style.css

@@ -74,6 +74,9 @@
 /**
  * Reset the WP Admin page styles for Gutenberg-like pages.
  */
+.wp-block-post-comments-form {
+  box-sizing: border-box;
+}
 .wp-block-post-comments-form[style*=font-weight] :where(.comment-reply-title) {
   font-weight: inherit;
 }

package/build-style/site-logo/editor-rtl.css

@@ -108,6 +108,7 @@
   border-radius: inherit;
 }
 .wp-block-site-logo.wp-block-site-logo .components-placeholder {
+  display: flex;
   justify-content: center;
   align-items: center;
   padding: 0;

package/build-style/site-logo/editor.css

@@ -108,6 +108,7 @@
   border-radius: inherit;
 }
 .wp-block-site-logo.wp-block-site-logo .components-placeholder {
+  display: flex;
   justify-content: center;
   align-items: center;
   padding: 0;

package/build-style/style-rtl.css

@@ -75,6 +75,10 @@
 /**
  * Reset the WP Admin page styles for Gutenberg-like pages.
  */
+.wp-block-archives {
+  box-sizing: border-box;
+}
+
 .wp-block-archives-dropdown label {
   display: block;
 }
@@ -180,6 +184,7 @@
 .wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background),
 .wp-block-button .wp-block-button__link.is-style-outline:not(.has-background) {
   background-color: transparent;
+  background-image: none;
 }
 
 .wp-block-buttons {
@@ -373,6 +378,7 @@
 
 /* Styles for backwards compatibility with the legacy `post-comments` block */
 .wp-block-post-comments {
+  box-sizing: border-box;
   /* utility classes */
   /* end utility classes */
 }
@@ -513,6 +519,7 @@
 }
 
 .wp-block-comment-template {
+  box-sizing: border-box;
   margin-bottom: 0;
   max-width: 100%;
   list-style: none;
@@ -1976,7 +1983,9 @@ button.wp-block-navigation-item__content {
 }
 
 :where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item a:not(.wp-element-button)),
-:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-submenu a:not(.wp-element-button)) {
+:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-submenu a:not(.wp-element-button)),
+:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-submenu button.wp-block-navigation-item__content),
+:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-pages-list__item button.wp-block-navigation-item__content) {
   padding: 0.5em 1em;
 }
 
@@ -2325,6 +2334,9 @@ p.has-background {
   margin: 0;
 }
 
+.wp-block-post-comments-form {
+  box-sizing: border-box;
+}
 .wp-block-post-comments-form[style*=font-weight] :where(.comment-reply-title) {
   font-weight: inherit;
 }
@@ -3207,6 +3219,9 @@ ul.wp-block-rss.is-grid li {
   clear: both;
 }
 
+.wp-block-tag-cloud {
+  box-sizing: border-box;
+}
 .wp-block-tag-cloud.aligncenter {
   text-align: center;
   justify-content: center;

package/build-style/style.css

@@ -75,6 +75,10 @@
 /**
  * Reset the WP Admin page styles for Gutenberg-like pages.
  */
+.wp-block-archives {
+  box-sizing: border-box;
+}
+
 .wp-block-archives-dropdown label {
   display: block;
 }
@@ -181,6 +185,7 @@
 .wp-block-button.is-style-outline > .wp-block-button__link:not(.has-background),
 .wp-block-button .wp-block-button__link.is-style-outline:not(.has-background) {
   background-color: transparent;
+  background-image: none;
 }
 
 .wp-block-buttons {
@@ -376,6 +381,7 @@
 
 /* Styles for backwards compatibility with the legacy `post-comments` block */
 .wp-block-post-comments {
+  box-sizing: border-box;
   /* utility classes */
   /* end utility classes */
 }
@@ -518,6 +524,7 @@
 }
 
 .wp-block-comment-template {
+  box-sizing: border-box;
   margin-bottom: 0;
   max-width: 100%;
   list-style: none;
@@ -2004,7 +2011,9 @@ button.wp-block-navigation-item__content {
 }
 
 :where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item a:not(.wp-element-button)),
-:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-submenu a:not(.wp-element-button)) {
+:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-submenu a:not(.wp-element-button)),
+:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-submenu button.wp-block-navigation-item__content),
+:where(.wp-block-navigation .wp-block-navigation__submenu-container .wp-block-pages-list__item button.wp-block-navigation-item__content) {
   padding: 0.5em 1em;
 }
 
@@ -2353,6 +2362,9 @@ p.has-background {
   margin: 0;
 }
 
+.wp-block-post-comments-form {
+  box-sizing: border-box;
+}
 .wp-block-post-comments-form[style*=font-weight] :where(.comment-reply-title) {
   font-weight: inherit;
 }
@@ -3240,6 +3252,9 @@ ul.wp-block-rss.is-grid li {
   clear: both;
 }
 
+.wp-block-tag-cloud {
+  box-sizing: border-box;
+}
 .wp-block-tag-cloud.aligncenter {
   text-align: center;
   justify-content: center;

package/build-style/tag-cloud/style-rtl.css

@@ -74,6 +74,9 @@
 /**
  * Reset the WP Admin page styles for Gutenberg-like pages.
  */
+.wp-block-tag-cloud {
+  box-sizing: border-box;
+}
 .wp-block-tag-cloud.aligncenter {
   text-align: center;
   justify-content: center;

package/build-style/tag-cloud/style.css

@@ -74,6 +74,9 @@
 /**
  * Reset the WP Admin page styles for Gutenberg-like pages.
  */
+.wp-block-tag-cloud {
+  box-sizing: border-box;
+}
 .wp-block-tag-cloud.aligncenter {
   text-align: center;
   justify-content: center;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@wordpress/block-library",
-	"version": "7.16.0",
+	"version": "7.18.0",
 	"description": "Block library for the WordPress editor.",
 	"author": "The WordPress Contributors",
 	"license": "GPL-2.0-or-later",
@@ -31,35 +31,36 @@
 	],
 	"dependencies": {
 		"@babel/runtime": "^7.16.0",
-		"@wordpress/a11y": "^3.19.0",
-		"@wordpress/api-fetch": "^6.16.0",
-		"@wordpress/autop": "^3.19.0",
-		"@wordpress/blob": "^3.19.0",
-		"@wordpress/block-editor": "^10.2.0",
-		"@wordpress/blocks": "^11.18.0",
-		"@wordpress/components": "^21.2.0",
-		"@wordpress/compose": "^5.17.0",
-		"@wordpress/core-data": "^5.2.0",
-		"@wordpress/data": "^7.3.0",
-		"@wordpress/date": "^4.19.0",
-		"@wordpress/deprecated": "^3.19.0",
-		"@wordpress/dom": "^3.19.0",
-		"@wordpress/element": "^4.17.0",
-		"@wordpress/hooks": "^3.19.0",
-		"@wordpress/html-entities": "^3.19.0",
-		"@wordpress/i18n": "^4.19.0",
-		"@wordpress/icons": "^9.10.0",
-		"@wordpress/keycodes": "^3.19.0",
-		"@wordpress/notices": "^3.19.0",
-		"@wordpress/primitives": "^3.17.0",
-		"@wordpress/reusable-blocks": "^3.17.0",
-		"@wordpress/rich-text": "^5.17.0",
-		"@wordpress/server-side-render": "^3.17.0",
-		"@wordpress/url": "^3.20.0",
-		"@wordpress/viewport": "^4.17.0",
+		"@wordpress/a11y": "^3.21.0",
+		"@wordpress/api-fetch": "^6.18.0",
+		"@wordpress/autop": "^3.21.0",
+		"@wordpress/blob": "^3.21.0",
+		"@wordpress/block-editor": "^10.4.0",
+		"@wordpress/blocks": "^11.20.0",
+		"@wordpress/components": "^22.0.0",
+		"@wordpress/compose": "^5.19.0",
+		"@wordpress/core-data": "^5.4.0",
+		"@wordpress/data": "^7.5.0",
+		"@wordpress/date": "^4.21.0",
+		"@wordpress/deprecated": "^3.21.0",
+		"@wordpress/dom": "^3.21.0",
+		"@wordpress/element": "^4.19.0",
+		"@wordpress/hooks": "^3.21.0",
+		"@wordpress/html-entities": "^3.21.0",
+		"@wordpress/i18n": "^4.21.0",
+		"@wordpress/icons": "^9.12.0",
+		"@wordpress/keycodes": "^3.21.0",
+		"@wordpress/notices": "^3.21.0",
+		"@wordpress/primitives": "^3.19.0",
+		"@wordpress/reusable-blocks": "^3.19.0",
+		"@wordpress/rich-text": "^5.19.0",
+		"@wordpress/server-side-render": "^3.19.0",
+		"@wordpress/url": "^3.22.0",
+		"@wordpress/viewport": "^4.19.0",
 		"change-case": "^4.1.2",
 		"classnames": "^2.3.1",
 		"colord": "^2.7.0",
+		"escape-html": "^1.0.3",
 		"fast-average-color": "^9.1.1",
 		"lodash": "^4.17.21",
 		"memize": "^1.1.0",
@@ -73,5 +74,5 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"gitHead": "8d42d2febb7d0ba8372a33e560a62f5a5f6a9112"
+	"gitHead": "511f4cc1f0138641bc4394bc1cf36e833109c791"
 }

package/src/archives/edit.js

@@ -66,6 +66,7 @@ export default function ArchivesEdit( { attributes, setAttributes } ) {
 				<Disabled>
 					<ServerSideRender
 						block="core/archives"
+						skipBlockSupportAttributes
 						attributes={ attributes }
 					/>
 				</Disabled>

package/src/archives/style.scss

@@ -1,3 +1,8 @@
+.wp-block-archives {
+	// This block has customizable padding, border-box makes that more predictable.
+	box-sizing: border-box;
+}
+
 .wp-block-archives-dropdown {
 	label {
 		display: block;