@wordpress/block-library 9.3.0 → 9.5.0

package/build-style/style-rtl.css

@@ -34,6 +34,9 @@
  * Grid System.
  * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  */
+/**
+ * Radius scale.
+ */
 /**
  * Dimensions.
  */
@@ -308,6 +311,10 @@
 .wp-block-categories.wp-block-categories-dropdown.aligncenter {
   text-align: center;
 }
+.wp-block-categories .wp-block-categories__label {
+  width: 100%;
+  display: block;
+}
 
 .wp-block-code {
   box-sizing: border-box;
@@ -1120,6 +1127,7 @@ section.wp-block-cover-image > h2,
 .wp-block-form-input__label:has(input[type=checkbox]) {
   width: -moz-fit-content;
   width: fit-content;
+  /* stylelint-disable-next-line declaration-property-value-allowed-list -- This should be refactored to not use the row-reverse value. */
   flex-direction: row-reverse;
 }
 
@@ -1530,6 +1538,14 @@ h6.has-text-align-left[style*=writing-mode]:where([style*="vertical-lr"]) {
   vertical-align: bottom;
   box-sizing: border-box;
 }
+@media (prefers-reduced-motion: no-preference) {
+  .wp-block-image img.hide {
+    visibility: hidden;
+  }
+  .wp-block-image img.show {
+    animation: show-content-image 0.4s;
+  }
+}
 .wp-block-image[style*=border-radius] > a,
 .wp-block-image[style*=border-radius] img {
   border-radius: inherit;
@@ -1773,6 +1789,17 @@ h6.has-text-align-left[style*=writing-mode]:where([style*="vertical-lr"]) {
   }
 }
 
+@keyframes show-content-image {
+  0% {
+    visibility: hidden;
+  }
+  99% {
+    visibility: hidden;
+  }
+  100% {
+    visibility: visible;
+  }
+}
 @keyframes turn-on-visibility {
   0% {
     opacity: 0;
@@ -1977,10 +2004,14 @@ ul {
   box-sizing: border-box;
 }
 
-:root :where(ul.has-background, ol.has-background) {
+:root :where(.wp-block-list.has-background) {
   padding: 1.25em 2.375em;
 }
 
+.wp-block-loginout {
+  box-sizing: border-box;
+}
+
 .wp-block-media-text {
   direction: ltr;
   display: grid;
@@ -2133,10 +2164,7 @@ ul {
 .wp-block-navigation.has-text-decoration-line-through .wp-block-navigation-item__content:focus, .wp-block-navigation.has-text-decoration-line-through .wp-block-navigation-item__content:active {
   text-decoration: line-through;
 }
-.wp-block-navigation:where(:not([class*="has-text-decoration"])) a {
-  text-decoration: none;
-}
-.wp-block-navigation:where(:not([class*="has-text-decoration"])) a:focus, .wp-block-navigation:where(:not([class*="has-text-decoration"])) a:active {
+.wp-block-navigation :where(a), .wp-block-navigation :where(a:focus), .wp-block-navigation :where(a:active) {
   text-decoration: none;
 }
 .wp-block-navigation .wp-block-navigation__submenu-icon {
@@ -2754,7 +2782,7 @@ p.has-text-align-left[style*="writing-mode:vertical-lr"] {
 .wp-block-post-comments-form[style*=letter-spacing] :where(.comment-reply-title) {
   letter-spacing: inherit;
 }
-.wp-block-post-comments-form input[type=submit] {
+.wp-block-post-comments-form :where(input[type="submit"]) {
   box-shadow: none;
   cursor: pointer;
   display: inline-block;
@@ -2788,11 +2816,18 @@ p.has-text-align-left[style*="writing-mode:vertical-lr"] {
   margin-right: 0.5em;
 }
 
+.wp-block-post-content::after {
+  content: "";
+  display: table;
+  clear: both;
+}
+
 .wp-block-post-date {
   box-sizing: border-box;
 }
 
 :where(.wp-block-post-excerpt) {
+  box-sizing: border-box;
   margin-top: var(--wp--style--block-gap);
   margin-bottom: var(--wp--style--block-gap);
 }
@@ -3335,7 +3370,14 @@ ul.wp-block-rss.is-grid li {
   border-radius: 9999px;
 }
 
-:root :where(.wp-block-site-title a) {
+.wp-block-site-tagline {
+  box-sizing: border-box;
+}
+
+.wp-block-site-title {
+  box-sizing: border-box;
+}
+.wp-block-site-title :where(a) {
   color: inherit;
 }
 
@@ -3456,7 +3498,7 @@ ul.wp-block-rss.is-grid li {
   color: #fff;
 }
 :where(.wp-block-social-links:not(.is-style-logos-only)) .wp-social-link-facebook {
-  background-color: #1778f2;
+  background-color: #0866ff;
   color: #fff;
 }
 :where(.wp-block-social-links:not(.is-style-logos-only)) .wp-social-link-fivehundredpx {
@@ -3632,7 +3674,7 @@ ul.wp-block-rss.is-grid li {
   color: #f45800;
 }
 :where(.wp-block-social-links.is-style-logos-only) .wp-social-link-facebook {
-  color: #1778f2;
+  color: #0866ff;
 }
 :where(.wp-block-social-links.is-style-logos-only) .wp-social-link-fivehundredpx {
   color: #000;
@@ -3929,7 +3971,12 @@ ul.wp-block-rss.is-grid li {
   border-style: inherit;
 }
 
+:root :where(.wp-block-table-of-contents) {
+  box-sizing: border-box;
+}
+
 :where(.wp-block-term-description) {
+  box-sizing: border-box;
   margin-top: var(--wp--style--block-gap);
   margin-bottom: var(--wp--style--block-gap);
 }

package/build-style/style.css

@@ -34,6 +34,9 @@
  * Grid System.
  * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  */
+/**
+ * Radius scale.
+ */
 /**
  * Dimensions.
  */
@@ -311,6 +314,10 @@
 .wp-block-categories.wp-block-categories-dropdown.aligncenter {
   text-align: center;
 }
+.wp-block-categories .wp-block-categories__label {
+  width: 100%;
+  display: block;
+}
 
 .wp-block-code {
   box-sizing: border-box;
@@ -1128,6 +1135,7 @@ section.wp-block-cover-image > h2,
 .wp-block-form-input__label:has(input[type=checkbox]) {
   width: -moz-fit-content;
   width: fit-content;
+  /* stylelint-disable-next-line declaration-property-value-allowed-list -- This should be refactored to not use the row-reverse value. */
   flex-direction: row-reverse;
 }
 
@@ -1538,6 +1546,14 @@ h6.has-text-align-left[style*=writing-mode]:where([style*="vertical-lr"]) {
   vertical-align: bottom;
   box-sizing: border-box;
 }
+@media (prefers-reduced-motion: no-preference) {
+  .wp-block-image img.hide {
+    visibility: hidden;
+  }
+  .wp-block-image img.show {
+    animation: show-content-image 0.4s;
+  }
+}
 .wp-block-image[style*=border-radius] > a,
 .wp-block-image[style*=border-radius] img {
   border-radius: inherit;
@@ -1787,6 +1803,17 @@ h6.has-text-align-left[style*=writing-mode]:where([style*="vertical-lr"]) {
   }
 }
 
+@keyframes show-content-image {
+  0% {
+    visibility: hidden;
+  }
+  99% {
+    visibility: hidden;
+  }
+  100% {
+    visibility: visible;
+  }
+}
 @keyframes turn-on-visibility {
   0% {
     opacity: 0;
@@ -1997,10 +2024,14 @@ ul {
   box-sizing: border-box;
 }
 
-:root :where(ul.has-background, ol.has-background) {
+:root :where(.wp-block-list.has-background) {
   padding: 1.25em 2.375em;
 }
 
+.wp-block-loginout {
+  box-sizing: border-box;
+}
+
 .wp-block-media-text {
   /*!rtl:begin:ignore*/
   direction: ltr;
@@ -2163,10 +2194,7 @@ ul {
 .wp-block-navigation.has-text-decoration-line-through .wp-block-navigation-item__content:focus, .wp-block-navigation.has-text-decoration-line-through .wp-block-navigation-item__content:active {
   text-decoration: line-through;
 }
-.wp-block-navigation:where(:not([class*="has-text-decoration"])) a {
-  text-decoration: none;
-}
-.wp-block-navigation:where(:not([class*="has-text-decoration"])) a:focus, .wp-block-navigation:where(:not([class*="has-text-decoration"])) a:active {
+.wp-block-navigation :where(a), .wp-block-navigation :where(a:focus), .wp-block-navigation :where(a:active) {
   text-decoration: none;
 }
 .wp-block-navigation .wp-block-navigation__submenu-icon {
@@ -2784,7 +2812,7 @@ p.has-text-align-left[style*="writing-mode:vertical-lr"] {
 .wp-block-post-comments-form[style*=letter-spacing] :where(.comment-reply-title) {
   letter-spacing: inherit;
 }
-.wp-block-post-comments-form input[type=submit] {
+.wp-block-post-comments-form :where(input[type="submit"]) {
   box-shadow: none;
   cursor: pointer;
   display: inline-block;
@@ -2818,11 +2846,18 @@ p.has-text-align-left[style*="writing-mode:vertical-lr"] {
   margin-left: 0.5em;
 }
 
+.wp-block-post-content::after {
+  content: "";
+  display: table;
+  clear: both;
+}
+
 .wp-block-post-date {
   box-sizing: border-box;
 }
 
 :where(.wp-block-post-excerpt) {
+  box-sizing: border-box;
   margin-top: var(--wp--style--block-gap);
   margin-bottom: var(--wp--style--block-gap);
 }
@@ -3370,7 +3405,14 @@ ul.wp-block-rss.is-grid li {
   border-radius: 9999px;
 }
 
-:root :where(.wp-block-site-title a) {
+.wp-block-site-tagline {
+  box-sizing: border-box;
+}
+
+.wp-block-site-title {
+  box-sizing: border-box;
+}
+.wp-block-site-title :where(a) {
   color: inherit;
 }
 
@@ -3491,7 +3533,7 @@ ul.wp-block-rss.is-grid li {
   color: #fff;
 }
 :where(.wp-block-social-links:not(.is-style-logos-only)) .wp-social-link-facebook {
-  background-color: #1778f2;
+  background-color: #0866ff;
   color: #fff;
 }
 :where(.wp-block-social-links:not(.is-style-logos-only)) .wp-social-link-fivehundredpx {
@@ -3667,7 +3709,7 @@ ul.wp-block-rss.is-grid li {
   color: #f45800;
 }
 :where(.wp-block-social-links.is-style-logos-only) .wp-social-link-facebook {
-  color: #1778f2;
+  color: #0866ff;
 }
 :where(.wp-block-social-links.is-style-logos-only) .wp-social-link-fivehundredpx {
   color: #000;
@@ -3964,7 +4006,12 @@ ul.wp-block-rss.is-grid li {
   border-style: inherit;
 }
 
+:root :where(.wp-block-table-of-contents) {
+  box-sizing: border-box;
+}
+
 :where(.wp-block-term-description) {
+  box-sizing: border-box;
   margin-top: var(--wp--style--block-gap);
   margin-bottom: var(--wp--style--block-gap);
 }

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

@@ -33,6 +33,9 @@
  * Grid System.
  * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  */
+/**
+ * Radius scale.
+ */
 /**
  * Dimensions.
  */

package/build-style/table/editor.css

@@ -33,6 +33,9 @@
  * Grid System.
  * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  */
+/**
+ * Radius scale.
+ */
 /**
  * Dimensions.
  */

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

@@ -33,6 +33,9 @@
  * Grid System.
  * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  */
+/**
+ * Radius scale.
+ */
 /**
  * Dimensions.
  */

package/build-style/table/style.css

@@ -33,6 +33,9 @@
  * Grid System.
  * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  */
+/**
+ * Radius scale.
+ */
 /**
  * Dimensions.
  */

package/build-style/table/theme-rtl.css

@@ -33,6 +33,9 @@
  * Grid System.
  * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  */
+/**
+ * Radius scale.
+ */
 /**
  * Dimensions.
  */

package/build-style/table/theme.css

@@ -33,6 +33,9 @@
  * Grid System.
  * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
  */
+/**
+ * Radius scale.
+ */
 /**
  * Dimensions.
  */

package/build-style/table-of-contents/style-rtl.css

@@ -0,0 +1,94 @@
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Colors
+ */
+/**
+ * Breakpoints & Media Queries
+ */
+/**
+ * SCSS Variables.
+ *
+ * Please use variables from this sheet to ensure consistency across the UI.
+ * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
+ * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
+ */
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Colors
+ */
+/**
+ * Fonts & basic variables.
+ */
+/**
+ * Grid System.
+ * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
+ */
+/**
+ * Radius scale.
+ */
+/**
+ * Dimensions.
+ */
+/**
+ * Shadows.
+ */
+/**
+ * Editor widths.
+ */
+/**
+ * Block & Editor UI.
+ */
+/**
+ * Block paddings.
+ */
+/**
+ * React Native specific.
+ * These variables do not appear to be used anywhere else.
+ */
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Long content fade mixin
+ *
+ * Creates a fading overlay to signify that the content is longer
+ * than the space allows.
+ */
+/**
+ * Breakpoint mixins
+ */
+/**
+ * Focus styles.
+ */
+/**
+ * Applies editor left position to the selector passed as argument
+ */
+/**
+ * Styles that are reused verbatim in a few places
+ */
+/**
+ * Allows users to opt-out of animations via OS-level preferences.
+ */
+/**
+ * Reset default styles for JavaScript UI based pages.
+ * This is a WP-admin agnostic reset
+ */
+/**
+ * Reset the WP Admin page styles for Gutenberg-like pages.
+ */
+:root :where(.wp-block-table-of-contents) {
+  box-sizing: border-box;
+}

package/build-style/table-of-contents/style.css

@@ -0,0 +1,94 @@
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Colors
+ */
+/**
+ * Breakpoints & Media Queries
+ */
+/**
+ * SCSS Variables.
+ *
+ * Please use variables from this sheet to ensure consistency across the UI.
+ * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
+ * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
+ */
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Colors
+ */
+/**
+ * Fonts & basic variables.
+ */
+/**
+ * Grid System.
+ * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
+ */
+/**
+ * Radius scale.
+ */
+/**
+ * Dimensions.
+ */
+/**
+ * Shadows.
+ */
+/**
+ * Editor widths.
+ */
+/**
+ * Block & Editor UI.
+ */
+/**
+ * Block paddings.
+ */
+/**
+ * React Native specific.
+ * These variables do not appear to be used anywhere else.
+ */
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Long content fade mixin
+ *
+ * Creates a fading overlay to signify that the content is longer
+ * than the space allows.
+ */
+/**
+ * Breakpoint mixins
+ */
+/**
+ * Focus styles.
+ */
+/**
+ * Applies editor left position to the selector passed as argument
+ */
+/**
+ * Styles that are reused verbatim in a few places
+ */
+/**
+ * Allows users to opt-out of animations via OS-level preferences.
+ */
+/**
+ * Reset default styles for JavaScript UI based pages.
+ * This is a WP-admin agnostic reset
+ */
+/**
+ * Reset the WP Admin page styles for Gutenberg-like pages.
+ */
+:root :where(.wp-block-table-of-contents) {
+  box-sizing: border-box;
+}

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

@@ -0,0 +1,95 @@
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Colors
+ */
+/**
+ * Breakpoints & Media Queries
+ */
+/**
+ * SCSS Variables.
+ *
+ * Please use variables from this sheet to ensure consistency across the UI.
+ * Don't add to this sheet unless you're pretty sure the value will be reused in many places.
+ * For example, don't add rules to this sheet that affect block visuals. It's purely for UI.
+ */
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Colors
+ */
+/**
+ * Fonts & basic variables.
+ */
+/**
+ * Grid System.
+ * https://make.wordpress.org/design/2019/10/31/proposal-a-consistent-spacing-system-for-wordpress/
+ */
+/**
+ * Radius scale.
+ */
+/**
+ * Dimensions.
+ */
+/**
+ * Shadows.
+ */
+/**
+ * Editor widths.
+ */
+/**
+ * Block & Editor UI.
+ */
+/**
+ * Block paddings.
+ */
+/**
+ * React Native specific.
+ * These variables do not appear to be used anywhere else.
+ */
+/**
+*  Converts a hex value into the rgb equivalent.
+*
+* @param {string} hex - the hexadecimal value to convert
+* @return {string} comma separated rgb values
+*/
+/**
+ * Long content fade mixin
+ *
+ * Creates a fading overlay to signify that the content is longer
+ * than the space allows.
+ */
+/**
+ * Breakpoint mixins
+ */
+/**
+ * Focus styles.
+ */
+/**
+ * Applies editor left position to the selector passed as argument
+ */
+/**
+ * Styles that are reused verbatim in a few places
+ */
+/**
+ * Allows users to opt-out of animations via OS-level preferences.
+ */
+/**
+ * Reset default styles for JavaScript UI based pages.
+ * This is a WP-admin agnostic reset
+ */
+/**
+ * Reset the WP Admin page styles for Gutenberg-like pages.
+ */
+.wp-block-tag-cloud .wp-block-tag-cloud {
+  margin: 0;
+  padding: 0;
+}