@wordpress/block-library 11.1.0 → 11.2.0

package/build-style/editor-rtl.css

@@ -176,6 +176,10 @@
   margin: 0 auto;
 }
 
+.wp-block-avatar__help-text {
+  grid-column: 1/-1;
+}
+
 .wp-block[data-align=center] > .wp-block-button {
   text-align: center;
   margin-right: auto;
@@ -747,7 +751,6 @@ html :where(.wp-block-column) {
 }
 
 .wp-block-gallery__source-settings {
-  grid-column: 1/-1;
   display: flex;
   flex-direction: column;
   gap: 8px;
@@ -763,8 +766,7 @@ html :where(.wp-block-column) {
 }
 
 .wp-block-gallery__source-notice {
-  grid-column: 1/-1;
-  margin: 0;
+  margin: 16px 0 0;
 }
 
 /**
@@ -2326,7 +2328,8 @@ html[dir=rtl] .has-drop-cap:not(:focus)::first-letter {
 .wp-block[data-align=left] > .wp-block-table th, .wp-block[data-align=right] > .wp-block-table td,
 .wp-block[data-align=right] > .wp-block-table th, .wp-block[data-align=center] > .wp-block-table td,
 .wp-block[data-align=center] > .wp-block-table th {
-  word-break: break-word;
+  word-break: normal;
+  overflow-wrap: anywhere;
 }
 .wp-block[data-align=center] > .wp-block-table {
   text-align: initial;
@@ -2339,6 +2342,10 @@ html[dir=rtl] .has-drop-cap:not(:focus)::first-letter {
   border: 1px solid;
   padding: 0.5em;
 }
+.wp-block-table td [contenteditable=true],
+.wp-block-table th [contenteditable=true] {
+  overflow-wrap: inherit;
+}
 .wp-block-table td.is-selected,
 .wp-block-table th.is-selected {
   border-color: var(--wp-admin-theme-color);

package/build-style/editor.css

@@ -176,6 +176,10 @@
   margin: 0 auto;
 }
 
+.wp-block-avatar__help-text {
+  grid-column: 1/-1;
+}
+
 .wp-block[data-align=center] > .wp-block-button {
   text-align: center;
   margin-left: auto;
@@ -749,7 +753,6 @@ html :where(.wp-block-column) {
 }
 
 .wp-block-gallery__source-settings {
-  grid-column: 1/-1;
   display: flex;
   flex-direction: column;
   gap: 8px;
@@ -765,8 +768,7 @@ html :where(.wp-block-column) {
 }
 
 .wp-block-gallery__source-notice {
-  grid-column: 1/-1;
-  margin: 0;
+  margin: 16px 0 0;
 }
 
 /**
@@ -2330,7 +2332,8 @@ html[dir=rtl] .has-drop-cap:not(:focus)::first-letter {
 .wp-block[data-align=left] > .wp-block-table th, .wp-block[data-align=right] > .wp-block-table td,
 .wp-block[data-align=right] > .wp-block-table th, .wp-block[data-align=center] > .wp-block-table td,
 .wp-block[data-align=center] > .wp-block-table th {
-  word-break: break-word;
+  word-break: normal;
+  overflow-wrap: anywhere;
 }
 .wp-block[data-align=center] > .wp-block-table {
   text-align: initial;
@@ -2343,6 +2346,10 @@ html[dir=rtl] .has-drop-cap:not(:focus)::first-letter {
   border: 1px solid;
   padding: 0.5em;
 }
+.wp-block-table td [contenteditable=true],
+.wp-block-table th [contenteditable=true] {
+  overflow-wrap: inherit;
+}
 .wp-block-table td.is-selected,
 .wp-block-table th.is-selected {
   border-color: var(--wp-admin-theme-color);

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

@@ -107,13 +107,16 @@
   min-width: 280px;
 }
 
-.wp-block-cover .wp-block-embed {
+:root :where(.wp-block-cover .wp-block-embed) {
   min-width: 320px;
   min-height: 240px;
 }
 
 .wp-block-group.is-layout-flex .wp-block-embed {
   flex: 1 1 0%;
+}
+
+:root :where(.wp-block-group.is-layout-flex .wp-block-embed) {
   min-width: 0;
 }
 

package/build-style/embed/style.css

@@ -107,13 +107,16 @@
   min-width: 280px;
 }
 
-.wp-block-cover .wp-block-embed {
+:root :where(.wp-block-cover .wp-block-embed) {
   min-width: 320px;
   min-height: 240px;
 }
 
 .wp-block-group.is-layout-flex .wp-block-embed {
   flex: 1 1 0%;
+}
+
+:root :where(.wp-block-group.is-layout-flex .wp-block-embed) {
   min-width: 0;
 }
 

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

@@ -185,7 +185,6 @@
 }
 
 .wp-block-gallery__source-settings {
-  grid-column: 1/-1;
   display: flex;
   flex-direction: column;
   gap: 8px;
@@ -201,6 +200,5 @@
 }
 
 .wp-block-gallery__source-notice {
-  grid-column: 1/-1;
-  margin: 0;
+  margin: 16px 0 0;
 }

package/build-style/gallery/editor.css

@@ -185,7 +185,6 @@
 }
 
 .wp-block-gallery__source-settings {
-  grid-column: 1/-1;
   display: flex;
   flex-direction: column;
   gap: 8px;
@@ -201,6 +200,5 @@
 }
 
 .wp-block-gallery__source-notice {
-  grid-column: 1/-1;
-  margin: 0;
+  margin: 16px 0 0;
 }

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

@@ -169,7 +169,7 @@
 }
 @supports (mask-image: none) or (-webkit-mask-image: none) {
   .wp-block-image.is-style-circle-mask img {
-    mask-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="50"/></svg>');
+    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='50' cy='50' r='50'/%3E%3C/svg%3E");
     mask-mode: alpha;
     mask-repeat: no-repeat;
     mask-size: contain;
@@ -194,7 +194,7 @@
 .wp-lightbox-container img {
   cursor: zoom-in;
 }
-.wp-lightbox-container img:hover + button {
+.wp-lightbox-container:has(img:hover) button {
   opacity: 1;
 }
 .wp-lightbox-container button {
@@ -337,6 +337,7 @@
   width: var(--wp--lightbox-container-width);
   height: var(--wp--lightbox-container-height);
   z-index: 2000001;
+  cursor: default;
 }
 .wp-lightbox-overlay .wp-block-image {
   position: relative;
@@ -359,6 +360,10 @@
 .wp-lightbox-overlay .wp-block-image figcaption {
   display: none;
 }
+.wp-lightbox-overlay .lightbox-thumbnail-container {
+  --wp--lightbox-image-width: var(--wp--lightbox-thumbnail-width);
+  --wp--lightbox-image-height: var(--wp--lightbox-thumbnail-height);
+}
 .wp-lightbox-overlay button {
   border: none;
   background: none;
@@ -458,15 +463,18 @@
 }
 @keyframes lightbox-zoom-in {
   0% {
+    clip-path: var(--wp--lightbox-initial-clip);
     transform: translate(calc(-1*((-100vw + var(--wp--lightbox-scrollbar-width)) / 2 + var(--wp--lightbox-initial-left-position))), calc(-50vh + var(--wp--lightbox-initial-top-position))) scale(var(--wp--lightbox-scale));
   }
   100% {
+    clip-path: inset(0);
     transform: translate(50%, -50%) scale(1, 1);
   }
 }
 @keyframes lightbox-zoom-out {
   0% {
     visibility: visible;
+    clip-path: inset(0);
     transform: translate(50%, -50%) scale(1, 1);
   }
   99% {
@@ -474,6 +482,7 @@
   }
   100% {
     visibility: hidden;
+    clip-path: var(--wp--lightbox-initial-clip);
     transform: translate(calc(-1*((-100vw + var(--wp--lightbox-scrollbar-width)) / 2 + var(--wp--lightbox-initial-left-position))), calc(-50vh + var(--wp--lightbox-initial-top-position))) scale(var(--wp--lightbox-scale));
   }
 }

package/build-style/image/style.css

@@ -175,7 +175,7 @@
 }
 @supports (mask-image: none) or (-webkit-mask-image: none) {
   .wp-block-image.is-style-circle-mask img {
-    mask-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="50"/></svg>');
+    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='50' cy='50' r='50'/%3E%3C/svg%3E");
     mask-mode: alpha;
     mask-repeat: no-repeat;
     mask-size: contain;
@@ -200,7 +200,7 @@
 .wp-lightbox-container img {
   cursor: zoom-in;
 }
-.wp-lightbox-container img:hover + button {
+.wp-lightbox-container:has(img:hover) button {
   opacity: 1;
 }
 .wp-lightbox-container button {
@@ -343,6 +343,7 @@
   width: var(--wp--lightbox-container-width);
   height: var(--wp--lightbox-container-height);
   z-index: 2000001;
+  cursor: default;
 }
 .wp-lightbox-overlay .wp-block-image {
   position: relative;
@@ -365,6 +366,10 @@
 .wp-lightbox-overlay .wp-block-image figcaption {
   display: none;
 }
+.wp-lightbox-overlay .lightbox-thumbnail-container {
+  --wp--lightbox-image-width: var(--wp--lightbox-thumbnail-width);
+  --wp--lightbox-image-height: var(--wp--lightbox-thumbnail-height);
+}
 .wp-lightbox-overlay button {
   border: none;
   background: none;
@@ -464,15 +469,18 @@
 }
 @keyframes lightbox-zoom-in {
   0% {
+    clip-path: var(--wp--lightbox-initial-clip);
     transform: translate(calc((-100vw + var(--wp--lightbox-scrollbar-width)) / 2 + var(--wp--lightbox-initial-left-position)), calc(-50vh + var(--wp--lightbox-initial-top-position))) scale(var(--wp--lightbox-scale));
   }
   100% {
+    clip-path: inset(0);
     transform: translate(-50%, -50%) scale(1, 1);
   }
 }
 @keyframes lightbox-zoom-out {
   0% {
     visibility: visible;
+    clip-path: inset(0);
     transform: translate(-50%, -50%) scale(1, 1);
   }
   99% {
@@ -480,6 +488,7 @@
   }
   100% {
     visibility: hidden;
+    clip-path: var(--wp--lightbox-initial-clip);
     transform: translate(calc((-100vw + var(--wp--lightbox-scrollbar-width)) / 2 + var(--wp--lightbox-initial-left-position)), calc(-50vh + var(--wp--lightbox-initial-top-position))) scale(var(--wp--lightbox-scale));
   }
 }

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

@@ -39,10 +39,13 @@
   direction: rtl;
   grid-column: 2;
   grid-row: 1;
-  padding: 0 8% 0 8%;
   word-break: break-word;
 }
 
+:where(.wp-block-media-text > .wp-block-media-text__content) {
+  padding: 0 8%;
+}
+
 .wp-block-media-text.has-media-on-the-right > .wp-block-media-text__media {
   grid-column: 2;
   grid-row: 1;

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

@@ -45,10 +45,13 @@
   grid-column: 2;
   grid-row: 1;
   /*rtl:end:ignore*/
-  padding: 0 8% 0 8%;
   word-break: break-word;
 }
 
+:where(.wp-block-media-text > .wp-block-media-text__content) {
+  padding: 0 8%;
+}
+
 .wp-block-media-text.has-media-on-the-right > .wp-block-media-text__media {
   /*rtl:begin:ignore*/
   grid-column: 2;

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

@@ -1,3 +1,6 @@
+.wp-block-query-pagination {
+  box-sizing: border-box;
+}
 .wp-block-query-pagination.is-content-justification-space-between > .wp-block-query-pagination-next:last-of-type {
   margin-inline-start: auto;
 }

package/build-style/query-pagination/style.css

@@ -1,3 +1,6 @@
+.wp-block-query-pagination {
+  box-sizing: border-box;
+}
 .wp-block-query-pagination.is-content-justification-space-between > .wp-block-query-pagination-next:last-of-type {
   margin-inline-start: auto;
 }

package/build-style/style-rtl.css

@@ -645,6 +645,9 @@
   box-sizing: border-box;
 }
 
+.wp-block-comments-pagination {
+  box-sizing: border-box;
+}
 .wp-block-comments-pagination > .wp-block-comments-pagination-next,
 .wp-block-comments-pagination > .wp-block-comments-pagination-previous,
 .wp-block-comments-pagination > .wp-block-comments-pagination-numbers {
@@ -1215,13 +1218,16 @@ body:not(.editor-styles-wrapper) .wp-block-cover:not(.wp-block-cover:has(.wp-blo
   min-width: 280px;
 }
 
-.wp-block-cover .wp-block-embed {
+:root :where(.wp-block-cover .wp-block-embed) {
   min-width: 320px;
   min-height: 240px;
 }
 
 .wp-block-group.is-layout-flex .wp-block-embed {
   flex: 1 1 0%;
+}
+
+:root :where(.wp-block-group.is-layout-flex .wp-block-embed) {
   min-width: 0;
 }
 
@@ -1831,7 +1837,7 @@ h6.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]) {
 }
 @supports (mask-image: none) or (-webkit-mask-image: none) {
   .wp-block-image.is-style-circle-mask img {
-    mask-image: url('data:image/svg+xml;utf8,<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><circle cx="50" cy="50" r="50"/></svg>');
+    mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='50' cy='50' r='50'/%3E%3C/svg%3E");
     mask-mode: alpha;
     mask-repeat: no-repeat;
     mask-size: contain;
@@ -1856,7 +1862,7 @@ h6.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]) {
 .wp-lightbox-container img {
   cursor: zoom-in;
 }
-.wp-lightbox-container img:hover + button {
+.wp-lightbox-container:has(img:hover) button {
   opacity: 1;
 }
 .wp-lightbox-container button {
@@ -1999,6 +2005,7 @@ h6.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]) {
   width: var(--wp--lightbox-container-width);
   height: var(--wp--lightbox-container-height);
   z-index: 2000001;
+  cursor: default;
 }
 .wp-lightbox-overlay .wp-block-image {
   position: relative;
@@ -2021,6 +2028,10 @@ h6.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]) {
 .wp-lightbox-overlay .wp-block-image figcaption {
   display: none;
 }
+.wp-lightbox-overlay .lightbox-thumbnail-container {
+  --wp--lightbox-image-width: var(--wp--lightbox-thumbnail-width);
+  --wp--lightbox-image-height: var(--wp--lightbox-thumbnail-height);
+}
 .wp-lightbox-overlay button {
   border: none;
   background: none;
@@ -2120,15 +2131,18 @@ h6.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]) {
 }
 @keyframes lightbox-zoom-in {
   0% {
+    clip-path: var(--wp--lightbox-initial-clip);
     transform: translate(calc(-1*((-100vw + var(--wp--lightbox-scrollbar-width)) / 2 + var(--wp--lightbox-initial-left-position))), calc(-50vh + var(--wp--lightbox-initial-top-position))) scale(var(--wp--lightbox-scale));
   }
   100% {
+    clip-path: inset(0);
     transform: translate(50%, -50%) scale(1, 1);
   }
 }
 @keyframes lightbox-zoom-out {
   0% {
     visibility: visible;
+    clip-path: inset(0);
     transform: translate(50%, -50%) scale(1, 1);
   }
   99% {
@@ -2136,6 +2150,7 @@ h6.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]) {
   }
   100% {
     visibility: hidden;
+    clip-path: var(--wp--lightbox-initial-clip);
     transform: translate(calc(-1*((-100vw + var(--wp--lightbox-scrollbar-width)) / 2 + var(--wp--lightbox-initial-left-position))), calc(-50vh + var(--wp--lightbox-initial-top-position))) scale(var(--wp--lightbox-scale));
   }
 }
@@ -2357,10 +2372,13 @@ ul {
   direction: rtl;
   grid-column: 2;
   grid-row: 1;
-  padding: 0 8% 0 8%;
   word-break: break-word;
 }
 
+:where(.wp-block-media-text > .wp-block-media-text__content) {
+  padding: 0 8%;
+}
+
 .wp-block-media-text.has-media-on-the-right > .wp-block-media-text__media {
   grid-column: 2;
   grid-row: 1;
@@ -4206,6 +4224,9 @@ p.has-text-align-left[style*="writing-mode:vertical-lr"] {
   box-sizing: border-box;
 }
 
+.wp-block-query-pagination {
+  box-sizing: border-box;
+}
 .wp-block-query-pagination.is-content-justification-space-between > .wp-block-query-pagination-next:last-of-type {
   margin-inline-start: auto;
 }
@@ -4959,7 +4980,7 @@ ul.wp-block-rss.is-grid li {
 :root :where(.wp-block-tag-cloud.is-style-outline a) {
   border: 1px solid currentColor;
   font-size: unset !important;
-  margin-left: 0;
+  margin-left: 0 !important;
   padding: 1ch 2ch;
   text-decoration: none !important;
 }
@@ -5032,7 +5053,8 @@ ul.wp-block-rss.is-grid li {
 }
 .wp-block-table .has-fixed-layout td,
 .wp-block-table .has-fixed-layout th {
-  word-break: break-word;
+  word-break: normal;
+  overflow-wrap: anywhere;
 }
 .wp-block-table.alignleft, .wp-block-table.aligncenter, .wp-block-table.alignright {
   display: table;
@@ -5042,7 +5064,8 @@ ul.wp-block-rss.is-grid li {
 .wp-block-table.alignleft th, .wp-block-table.aligncenter td,
 .wp-block-table.aligncenter th, .wp-block-table.alignright td,
 .wp-block-table.alignright th {
-  word-break: break-word;
+  word-break: normal;
+  overflow-wrap: anywhere;
 }
 .wp-block-table .has-subtle-light-gray-background-color {
   background-color: #f3f4f5;
@@ -5207,15 +5230,22 @@ pre.wp-block-verse {
   box-sizing: border-box;
   overflow: auto;
   white-space: pre-wrap;
-  min-width: 1em;
   word-break: normal;
   overflow-wrap: break-word;
 }
 
+:root :where(pre.wp-block-verse) {
+  min-width: 1em;
+}
+
 :where(pre.wp-block-verse) {
   font-family: inherit;
 }
 
+pre.wp-block-verse.has-fit-text {
+  white-space: pre !important;
+}
+
 .wp-block-video {
   box-sizing: border-box;
 }
@@ -5262,6 +5292,21 @@ a[data-fn].fn::after {
   --wp-block-synced-color--rgb: 122, 0, 223;
   --wp-bound-block-color: var(--wp-block-synced-color);
   --wp-editor-canvas-background: #ddd;
+  --wp-admin-theme-color: #3858e9;
+  --wp-admin-theme-color--rgb: 56, 88, 233;
+  --wp-admin-theme-color-darker-10: rgb(33.0384615385, 68.7307692308, 230.4615384615);
+  --wp-admin-theme-color-darker-10--rgb: 33.0384615385, 68.7307692308, 230.4615384615;
+  --wp-admin-theme-color-darker-20: rgb(23.6923076923, 58.1538461538, 214.3076923077);
+  --wp-admin-theme-color-darker-20--rgb: 23.6923076923, 58.1538461538, 214.3076923077;
+  --wp-admin-border-width-focus: 2px;
+}
+@media (min-resolution: 192dpi) {
+  :root {
+    --wp-admin-border-width-focus: 1.5px;
+  }
+}
+
+body.admin-color-fresh {
   --wp-admin-theme-color: #007cba;
   --wp-admin-theme-color--rgb: 0, 124, 186;
   --wp-admin-theme-color-darker-10: rgb(0, 107, 160.5);
@@ -5271,7 +5316,7 @@ a[data-fn].fn::after {
   --wp-admin-border-width-focus: 2px;
 }
 @media (min-resolution: 192dpi) {
-  :root {
+  body.admin-color-fresh {
     --wp-admin-border-width-focus: 1.5px;
   }
 }
@@ -5508,4 +5553,20 @@ html :where(.is-position-sticky) {
   html :where(.is-position-sticky) {
     --wp-admin--admin-bar--position-offset: 0px;
   }
+}
+@supports (not (-webkit-backdrop-filter: blur(1px))) and (not (-moz-appearance: none)) {
+  mtd[columnalign=right] {
+    text-align: -webkit-right;
+  }
+  mtd[columnalign=left] {
+    text-align: -webkit-left;
+  }
+  menclose[notation~=top] {
+    padding-top: 0.1em;
+    border-top: 0.065em solid;
+  }
+  menclose[notation~=bottom] {
+    padding-bottom: 0.1em;
+    border-bottom: 0.065em solid;
+  }
 }