@wordpress/block-library 8.23.0 → 8.24.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (136) hide show
  1. package/CHANGELOG.md +2 -0
  2. package/build/block/edit.js +8 -11
  3. package/build/block/edit.js.map +1 -1
  4. package/build/block/edit.native.js +3 -4
  5. package/build/block/edit.native.js.map +1 -1
  6. package/build/button/edit.js +4 -7
  7. package/build/button/edit.js.map +1 -1
  8. package/build/column/edit.js +1 -1
  9. package/build/column/edit.js.map +1 -1
  10. package/build/column/edit.native.js +1 -1
  11. package/build/column/edit.native.js.map +1 -1
  12. package/build/cover/edit/index.js +2 -1
  13. package/build/cover/edit/index.js.map +1 -1
  14. package/build/file/edit.js +8 -9
  15. package/build/file/edit.js.map +1 -1
  16. package/build/file/view.js +4 -6
  17. package/build/file/view.js.map +1 -1
  18. package/build/group/edit.js +3 -7
  19. package/build/group/edit.js.map +1 -1
  20. package/build/image/edit.js +17 -18
  21. package/build/image/edit.js.map +1 -1
  22. package/build/image/edit.native.js +22 -15
  23. package/build/image/edit.native.js.map +1 -1
  24. package/build/image/image.js +35 -27
  25. package/build/image/image.js.map +1 -1
  26. package/build/image/index.js +2 -3
  27. package/build/image/index.js.map +1 -1
  28. package/build/image/view.js +233 -268
  29. package/build/image/view.js.map +1 -1
  30. package/build/navigation/view.js +153 -176
  31. package/build/navigation/view.js.map +1 -1
  32. package/build/navigation-link/index.js +2 -1
  33. package/build/navigation-link/index.js.map +1 -1
  34. package/build/pattern/edit.js +1 -3
  35. package/build/pattern/edit.js.map +1 -1
  36. package/build/post-template/edit.js +1 -1
  37. package/build/post-template/edit.js.map +1 -1
  38. package/build/query/view.js +52 -60
  39. package/build/query/view.js.map +1 -1
  40. package/build/search/view.js +66 -74
  41. package/build/search/view.js.map +1 -1
  42. package/build/utils/remove-anchor-tag.js +17 -0
  43. package/build/utils/remove-anchor-tag.js.map +1 -0
  44. package/build-module/block/edit.js +8 -11
  45. package/build-module/block/edit.js.map +1 -1
  46. package/build-module/block/edit.native.js +3 -4
  47. package/build-module/block/edit.native.js.map +1 -1
  48. package/build-module/button/edit.js +4 -7
  49. package/build-module/button/edit.js.map +1 -1
  50. package/build-module/column/edit.js +1 -1
  51. package/build-module/column/edit.js.map +1 -1
  52. package/build-module/column/edit.native.js +1 -1
  53. package/build-module/column/edit.native.js.map +1 -1
  54. package/build-module/cover/edit/index.js +2 -1
  55. package/build-module/cover/edit/index.js.map +1 -1
  56. package/build-module/file/edit.js +8 -9
  57. package/build-module/file/edit.js.map +1 -1
  58. package/build-module/file/view.js +5 -7
  59. package/build-module/file/view.js.map +1 -1
  60. package/build-module/group/edit.js +3 -7
  61. package/build-module/group/edit.js.map +1 -1
  62. package/build-module/image/edit.js +18 -19
  63. package/build-module/image/edit.js.map +1 -1
  64. package/build-module/image/edit.native.js +23 -16
  65. package/build-module/image/edit.native.js.map +1 -1
  66. package/build-module/image/image.js +36 -28
  67. package/build-module/image/image.js.map +1 -1
  68. package/build-module/image/index.js +2 -3
  69. package/build-module/image/index.js.map +1 -1
  70. package/build-module/image/view.js +234 -269
  71. package/build-module/image/view.js.map +1 -1
  72. package/build-module/navigation/view.js +154 -177
  73. package/build-module/navigation/view.js.map +1 -1
  74. package/build-module/navigation-link/index.js +2 -1
  75. package/build-module/navigation-link/index.js.map +1 -1
  76. package/build-module/pattern/edit.js +1 -3
  77. package/build-module/pattern/edit.js.map +1 -1
  78. package/build-module/post-template/edit.js +1 -1
  79. package/build-module/post-template/edit.js.map +1 -1
  80. package/build-module/query/view.js +53 -61
  81. package/build-module/query/view.js.map +1 -1
  82. package/build-module/search/view.js +67 -75
  83. package/build-module/search/view.js.map +1 -1
  84. package/build-module/utils/remove-anchor-tag.js +11 -0
  85. package/build-module/utils/remove-anchor-tag.js.map +1 -0
  86. package/build-style/cover/style-rtl.css +14 -14
  87. package/build-style/cover/style.css +14 -14
  88. package/build-style/editor-rtl.css +6 -9
  89. package/build-style/editor.css +6 -9
  90. package/build-style/gallery/style-rtl.css +28 -0
  91. package/build-style/gallery/style.css +28 -0
  92. package/build-style/image/editor-rtl.css +0 -3
  93. package/build-style/image/editor.css +0 -3
  94. package/build-style/style-rtl.css +42 -14
  95. package/build-style/style.css +42 -14
  96. package/package.json +32 -32
  97. package/src/block/edit.js +18 -19
  98. package/src/block/edit.native.js +5 -13
  99. package/src/button/edit.js +6 -6
  100. package/src/buttons/test/__snapshots__/edit.native.js.snap +0 -6
  101. package/src/buttons/test/edit.native.js +0 -27
  102. package/src/column/edit.js +1 -1
  103. package/src/column/edit.native.js +1 -1
  104. package/src/cover/edit/index.js +1 -0
  105. package/src/cover/style.scss +1 -1
  106. package/src/cover/test/edit.js +1 -1
  107. package/src/editor.scss +6 -6
  108. package/src/file/edit.js +11 -10
  109. package/src/file/index.php +30 -11
  110. package/src/file/view.js +5 -7
  111. package/src/gallery/style.scss +1 -0
  112. package/src/group/edit.js +3 -11
  113. package/src/heading/test/__snapshots__/index.native.js.snap +6 -0
  114. package/src/heading/test/index.native.js +40 -0
  115. package/src/image/block.json +2 -3
  116. package/src/image/edit.js +16 -21
  117. package/src/image/edit.native.js +17 -18
  118. package/src/image/editor.scss +0 -7
  119. package/src/image/image.js +48 -51
  120. package/src/image/index.php +54 -45
  121. package/src/image/view.js +278 -334
  122. package/src/navigation/index.php +19 -10
  123. package/src/navigation/view.js +159 -192
  124. package/src/navigation-link/block.json +2 -1
  125. package/src/paragraph/test/edit.native.js +37 -1
  126. package/src/pattern/edit.js +5 -3
  127. package/src/post-template/edit.js +1 -1
  128. package/src/query/index.php +36 -22
  129. package/src/query/view.js +58 -65
  130. package/src/query-pagination-next/index.php +3 -3
  131. package/src/query-pagination-numbers/index.php +1 -1
  132. package/src/query-pagination-previous/index.php +3 -3
  133. package/src/search/index.php +40 -40
  134. package/src/search/view.js +58 -63
  135. package/src/utils/remove-anchor-tag.js +10 -0
  136. package/tsconfig.json +1 -0
@@ -317,20 +317,20 @@
317
317
  color: inherit;
318
318
  /*rtl:raw: direction: rtl; */
319
319
  }
320
- .wp-block-cover-image p:not(.has-text-color),
321
- .wp-block-cover-image h1:not(.has-text-color),
322
- .wp-block-cover-image h2:not(.has-text-color),
323
- .wp-block-cover-image h3:not(.has-text-color),
324
- .wp-block-cover-image h4:not(.has-text-color),
325
- .wp-block-cover-image h5:not(.has-text-color),
326
- .wp-block-cover-image h6:not(.has-text-color),
327
- .wp-block-cover p:not(.has-text-color),
328
- .wp-block-cover h1:not(.has-text-color),
329
- .wp-block-cover h2:not(.has-text-color),
330
- .wp-block-cover h3:not(.has-text-color),
331
- .wp-block-cover h4:not(.has-text-color),
332
- .wp-block-cover h5:not(.has-text-color),
333
- .wp-block-cover h6:not(.has-text-color) {
320
+ .wp-block-cover-image p:where(:not(.has-text-color)),
321
+ .wp-block-cover-image h1:where(:not(.has-text-color)),
322
+ .wp-block-cover-image h2:where(:not(.has-text-color)),
323
+ .wp-block-cover-image h3:where(:not(.has-text-color)),
324
+ .wp-block-cover-image h4:where(:not(.has-text-color)),
325
+ .wp-block-cover-image h5:where(:not(.has-text-color)),
326
+ .wp-block-cover-image h6:where(:not(.has-text-color)),
327
+ .wp-block-cover p:where(:not(.has-text-color)),
328
+ .wp-block-cover h1:where(:not(.has-text-color)),
329
+ .wp-block-cover h2:where(:not(.has-text-color)),
330
+ .wp-block-cover h3:where(:not(.has-text-color)),
331
+ .wp-block-cover h4:where(:not(.has-text-color)),
332
+ .wp-block-cover h5:where(:not(.has-text-color)),
333
+ .wp-block-cover h6:where(:not(.has-text-color)) {
334
334
  color: inherit;
335
335
  }
336
336
  .wp-block-cover-image.is-position-top-left,
@@ -1386,9 +1386,6 @@ figure.wp-block-image:not(.wp-block) {
1386
1386
  right: 50%;
1387
1387
  transform: translate(50%, -50%);
1388
1388
  }
1389
- .wp-block-image > a {
1390
- cursor: default;
1391
- }
1392
1389
 
1393
1390
  .wp-block-image .components-resizable-box__container {
1394
1391
  display: table;
@@ -3160,24 +3157,24 @@ div[data-type="core/post-featured-image"] img {
3160
3157
  background: linear-gradient(-135deg, #020381 0%, #2874fc 100%);
3161
3158
  }
3162
3159
 
3163
- .editor-styles-wrapper {
3160
+ :where(.editor-styles-wrapper) {
3164
3161
  --wp--preset--font-size--normal: 16px;
3165
3162
  --wp--preset--font-size--huge: 42px;
3166
3163
  }
3167
3164
 
3168
- .editor-styles-wrapper .has-regular-font-size {
3165
+ :where(.editor-styles-wrapper) .has-regular-font-size {
3169
3166
  font-size: 16px;
3170
3167
  }
3171
3168
 
3172
- .editor-styles-wrapper .has-larger-font-size {
3169
+ :where(.editor-styles-wrapper) .has-larger-font-size {
3173
3170
  font-size: 42px;
3174
3171
  }
3175
3172
 
3176
- .editor-styles-wrapper .has-normal-font-size {
3173
+ :where(.editor-styles-wrapper) .has-normal-font-size {
3177
3174
  font-size: var(--wp--preset--font-size--normal);
3178
3175
  }
3179
3176
 
3180
- .editor-styles-wrapper .has-huge-font-size {
3177
+ :where(.editor-styles-wrapper) .has-huge-font-size {
3181
3178
  font-size: var(--wp--preset--font-size--huge);
3182
3179
  }
3183
3180
 
@@ -3187,6 +3184,6 @@ div[data-type="core/post-featured-image"] img {
3187
3184
  * These are only output in the editor, but styles here are NOT prefixed .editor-styles-wrapper.
3188
3185
  * This allows us to create normalization styles that are easily overridden by editor styles.
3189
3186
  */
3190
- .editor-styles-wrapper iframe:not([frameborder]) {
3187
+ :where(.editor-styles-wrapper) iframe:not([frameborder]) {
3191
3188
  border: 0;
3192
3189
  }
@@ -1394,9 +1394,6 @@ figure.wp-block-image:not(.wp-block) {
1394
1394
  left: 50%;
1395
1395
  transform: translate(-50%, -50%);
1396
1396
  }
1397
- .wp-block-image > a {
1398
- cursor: default;
1399
- }
1400
1397
 
1401
1398
  .wp-block-image .components-resizable-box__container {
1402
1399
  display: table;
@@ -3171,24 +3168,24 @@ div[data-type="core/post-featured-image"] img {
3171
3168
  background: linear-gradient(135deg, #020381 0%, #2874fc 100%);
3172
3169
  }
3173
3170
 
3174
- .editor-styles-wrapper {
3171
+ :where(.editor-styles-wrapper) {
3175
3172
  --wp--preset--font-size--normal: 16px;
3176
3173
  --wp--preset--font-size--huge: 42px;
3177
3174
  }
3178
3175
 
3179
- .editor-styles-wrapper .has-regular-font-size {
3176
+ :where(.editor-styles-wrapper) .has-regular-font-size {
3180
3177
  font-size: 16px;
3181
3178
  }
3182
3179
 
3183
- .editor-styles-wrapper .has-larger-font-size {
3180
+ :where(.editor-styles-wrapper) .has-larger-font-size {
3184
3181
  font-size: 42px;
3185
3182
  }
3186
3183
 
3187
- .editor-styles-wrapper .has-normal-font-size {
3184
+ :where(.editor-styles-wrapper) .has-normal-font-size {
3188
3185
  font-size: var(--wp--preset--font-size--normal);
3189
3186
  }
3190
3187
 
3191
- .editor-styles-wrapper .has-huge-font-size {
3188
+ :where(.editor-styles-wrapper) .has-huge-font-size {
3192
3189
  font-size: var(--wp--preset--font-size--huge);
3193
3190
  }
3194
3191
 
@@ -3198,6 +3195,6 @@ div[data-type="core/post-featured-image"] img {
3198
3195
  * These are only output in the editor, but styles here are NOT prefixed .editor-styles-wrapper.
3199
3196
  * This allows us to create normalization styles that are easily overridden by editor styles.
3200
3197
  */
3201
- .editor-styles-wrapper iframe:not([frameborder]) {
3198
+ :where(.editor-styles-wrapper) iframe:not([frameborder]) {
3202
3199
  border: 0;
3203
3200
  }
@@ -320,6 +320,34 @@ figure.wp-block-gallery.has-nested-images {
320
320
  text-align: center;
321
321
  width: 100%;
322
322
  box-sizing: border-box;
323
+ scrollbar-width: thin;
324
+ scrollbar-gutter: stable both-edges;
325
+ scrollbar-color: transparent transparent;
326
+ will-change: transform;
327
+ }
328
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption::-webkit-scrollbar {
329
+ width: 12px;
330
+ height: 12px;
331
+ }
332
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption::-webkit-scrollbar-track {
333
+ background-color: transparent;
334
+ }
335
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption::-webkit-scrollbar-thumb {
336
+ background-color: transparent;
337
+ border-radius: 8px;
338
+ border: 3px solid transparent;
339
+ background-clip: padding-box;
340
+ }
341
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:hover::-webkit-scrollbar-thumb, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus::-webkit-scrollbar-thumb, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus-within::-webkit-scrollbar-thumb {
342
+ background-color: rgba(255, 255, 255, 0.8);
343
+ }
344
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:hover, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus-within {
345
+ scrollbar-color: rgba(255, 255, 255, 0.8) transparent;
346
+ }
347
+ @media (hover: none) {
348
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
349
+ scrollbar-color: rgba(255, 255, 255, 0.8) transparent;
350
+ }
323
351
  }
324
352
  .wp-block-gallery.has-nested-images figure.wp-block-image figcaption img {
325
353
  display: inline;
@@ -320,6 +320,34 @@ figure.wp-block-gallery.has-nested-images {
320
320
  text-align: center;
321
321
  width: 100%;
322
322
  box-sizing: border-box;
323
+ scrollbar-width: thin;
324
+ scrollbar-gutter: stable both-edges;
325
+ scrollbar-color: transparent transparent;
326
+ will-change: transform;
327
+ }
328
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption::-webkit-scrollbar {
329
+ width: 12px;
330
+ height: 12px;
331
+ }
332
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption::-webkit-scrollbar-track {
333
+ background-color: transparent;
334
+ }
335
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption::-webkit-scrollbar-thumb {
336
+ background-color: transparent;
337
+ border-radius: 8px;
338
+ border: 3px solid transparent;
339
+ background-clip: padding-box;
340
+ }
341
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:hover::-webkit-scrollbar-thumb, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus::-webkit-scrollbar-thumb, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus-within::-webkit-scrollbar-thumb {
342
+ background-color: rgba(255, 255, 255, 0.8);
343
+ }
344
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:hover, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus-within {
345
+ scrollbar-color: rgba(255, 255, 255, 0.8) transparent;
346
+ }
347
+ @media (hover: none) {
348
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
349
+ scrollbar-color: rgba(255, 255, 255, 0.8) transparent;
350
+ }
323
351
  }
324
352
  .wp-block-gallery.has-nested-images figure.wp-block-image figcaption img {
325
353
  display: inline;
@@ -128,9 +128,6 @@ figure.wp-block-image:not(.wp-block) {
128
128
  right: 50%;
129
129
  transform: translate(50%, -50%);
130
130
  }
131
- .wp-block-image > a {
132
- cursor: default;
133
- }
134
131
 
135
132
  .wp-block-image .components-resizable-box__container {
136
133
  display: table;
@@ -128,9 +128,6 @@ figure.wp-block-image:not(.wp-block) {
128
128
  left: 50%;
129
129
  transform: translate(-50%, -50%);
130
130
  }
131
- .wp-block-image > a {
132
- cursor: default;
133
- }
134
131
 
135
132
  .wp-block-image .components-resizable-box__container {
136
133
  display: table;
@@ -833,20 +833,20 @@
833
833
  z-index: 1;
834
834
  color: inherit; direction: rtl;
835
835
  }
836
- .wp-block-cover-image p:not(.has-text-color),
837
- .wp-block-cover-image h1:not(.has-text-color),
838
- .wp-block-cover-image h2:not(.has-text-color),
839
- .wp-block-cover-image h3:not(.has-text-color),
840
- .wp-block-cover-image h4:not(.has-text-color),
841
- .wp-block-cover-image h5:not(.has-text-color),
842
- .wp-block-cover-image h6:not(.has-text-color),
843
- .wp-block-cover p:not(.has-text-color),
844
- .wp-block-cover h1:not(.has-text-color),
845
- .wp-block-cover h2:not(.has-text-color),
846
- .wp-block-cover h3:not(.has-text-color),
847
- .wp-block-cover h4:not(.has-text-color),
848
- .wp-block-cover h5:not(.has-text-color),
849
- .wp-block-cover h6:not(.has-text-color) {
836
+ .wp-block-cover-image p:where(:not(.has-text-color)),
837
+ .wp-block-cover-image h1:where(:not(.has-text-color)),
838
+ .wp-block-cover-image h2:where(:not(.has-text-color)),
839
+ .wp-block-cover-image h3:where(:not(.has-text-color)),
840
+ .wp-block-cover-image h4:where(:not(.has-text-color)),
841
+ .wp-block-cover-image h5:where(:not(.has-text-color)),
842
+ .wp-block-cover-image h6:where(:not(.has-text-color)),
843
+ .wp-block-cover p:where(:not(.has-text-color)),
844
+ .wp-block-cover h1:where(:not(.has-text-color)),
845
+ .wp-block-cover h2:where(:not(.has-text-color)),
846
+ .wp-block-cover h3:where(:not(.has-text-color)),
847
+ .wp-block-cover h4:where(:not(.has-text-color)),
848
+ .wp-block-cover h5:where(:not(.has-text-color)),
849
+ .wp-block-cover h6:where(:not(.has-text-color)) {
850
850
  color: inherit;
851
851
  }
852
852
  .wp-block-cover-image.is-position-top-left,
@@ -1431,6 +1431,34 @@ figure.wp-block-gallery.has-nested-images {
1431
1431
  text-align: center;
1432
1432
  width: 100%;
1433
1433
  box-sizing: border-box;
1434
+ scrollbar-width: thin;
1435
+ scrollbar-gutter: stable both-edges;
1436
+ scrollbar-color: transparent transparent;
1437
+ will-change: transform;
1438
+ }
1439
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption::-webkit-scrollbar {
1440
+ width: 12px;
1441
+ height: 12px;
1442
+ }
1443
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption::-webkit-scrollbar-track {
1444
+ background-color: transparent;
1445
+ }
1446
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption::-webkit-scrollbar-thumb {
1447
+ background-color: transparent;
1448
+ border-radius: 8px;
1449
+ border: 3px solid transparent;
1450
+ background-clip: padding-box;
1451
+ }
1452
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:hover::-webkit-scrollbar-thumb, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus::-webkit-scrollbar-thumb, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus-within::-webkit-scrollbar-thumb {
1453
+ background-color: rgba(255, 255, 255, 0.8);
1454
+ }
1455
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:hover, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus-within {
1456
+ scrollbar-color: rgba(255, 255, 255, 0.8) transparent;
1457
+ }
1458
+ @media (hover: none) {
1459
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
1460
+ scrollbar-color: rgba(255, 255, 255, 0.8) transparent;
1461
+ }
1434
1462
  }
1435
1463
  .wp-block-gallery.has-nested-images figure.wp-block-image figcaption img {
1436
1464
  display: inline;
@@ -840,20 +840,20 @@
840
840
  color: inherit;
841
841
  /*rtl:raw: direction: rtl; */
842
842
  }
843
- .wp-block-cover-image p:not(.has-text-color),
844
- .wp-block-cover-image h1:not(.has-text-color),
845
- .wp-block-cover-image h2:not(.has-text-color),
846
- .wp-block-cover-image h3:not(.has-text-color),
847
- .wp-block-cover-image h4:not(.has-text-color),
848
- .wp-block-cover-image h5:not(.has-text-color),
849
- .wp-block-cover-image h6:not(.has-text-color),
850
- .wp-block-cover p:not(.has-text-color),
851
- .wp-block-cover h1:not(.has-text-color),
852
- .wp-block-cover h2:not(.has-text-color),
853
- .wp-block-cover h3:not(.has-text-color),
854
- .wp-block-cover h4:not(.has-text-color),
855
- .wp-block-cover h5:not(.has-text-color),
856
- .wp-block-cover h6:not(.has-text-color) {
843
+ .wp-block-cover-image p:where(:not(.has-text-color)),
844
+ .wp-block-cover-image h1:where(:not(.has-text-color)),
845
+ .wp-block-cover-image h2:where(:not(.has-text-color)),
846
+ .wp-block-cover-image h3:where(:not(.has-text-color)),
847
+ .wp-block-cover-image h4:where(:not(.has-text-color)),
848
+ .wp-block-cover-image h5:where(:not(.has-text-color)),
849
+ .wp-block-cover-image h6:where(:not(.has-text-color)),
850
+ .wp-block-cover p:where(:not(.has-text-color)),
851
+ .wp-block-cover h1:where(:not(.has-text-color)),
852
+ .wp-block-cover h2:where(:not(.has-text-color)),
853
+ .wp-block-cover h3:where(:not(.has-text-color)),
854
+ .wp-block-cover h4:where(:not(.has-text-color)),
855
+ .wp-block-cover h5:where(:not(.has-text-color)),
856
+ .wp-block-cover h6:where(:not(.has-text-color)) {
857
857
  color: inherit;
858
858
  }
859
859
  .wp-block-cover-image.is-position-top-left,
@@ -1439,6 +1439,34 @@ figure.wp-block-gallery.has-nested-images {
1439
1439
  text-align: center;
1440
1440
  width: 100%;
1441
1441
  box-sizing: border-box;
1442
+ scrollbar-width: thin;
1443
+ scrollbar-gutter: stable both-edges;
1444
+ scrollbar-color: transparent transparent;
1445
+ will-change: transform;
1446
+ }
1447
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption::-webkit-scrollbar {
1448
+ width: 12px;
1449
+ height: 12px;
1450
+ }
1451
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption::-webkit-scrollbar-track {
1452
+ background-color: transparent;
1453
+ }
1454
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption::-webkit-scrollbar-thumb {
1455
+ background-color: transparent;
1456
+ border-radius: 8px;
1457
+ border: 3px solid transparent;
1458
+ background-clip: padding-box;
1459
+ }
1460
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:hover::-webkit-scrollbar-thumb, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus::-webkit-scrollbar-thumb, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus-within::-webkit-scrollbar-thumb {
1461
+ background-color: rgba(255, 255, 255, 0.8);
1462
+ }
1463
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:hover, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus, .wp-block-gallery.has-nested-images figure.wp-block-image figcaption:focus-within {
1464
+ scrollbar-color: rgba(255, 255, 255, 0.8) transparent;
1465
+ }
1466
+ @media (hover: none) {
1467
+ .wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
1468
+ scrollbar-color: rgba(255, 255, 255, 0.8) transparent;
1469
+ }
1442
1470
  }
1443
1471
  .wp-block-gallery.has-nested-images figure.wp-block-image figcaption img {
1444
1472
  display: inline;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/block-library",
3
- "version": "8.23.0",
3
+ "version": "8.24.1",
4
4
  "description": "Block library for the WordPress editor.",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -31,36 +31,36 @@
31
31
  ],
32
32
  "dependencies": {
33
33
  "@babel/runtime": "^7.16.0",
34
- "@wordpress/a11y": "^3.46.0",
35
- "@wordpress/api-fetch": "^6.43.0",
36
- "@wordpress/autop": "^3.46.0",
37
- "@wordpress/blob": "^3.46.0",
38
- "@wordpress/block-editor": "^12.14.0",
39
- "@wordpress/blocks": "^12.23.0",
40
- "@wordpress/components": "^25.12.0",
41
- "@wordpress/compose": "^6.23.0",
42
- "@wordpress/core-data": "^6.23.0",
43
- "@wordpress/data": "^9.16.0",
44
- "@wordpress/date": "^4.46.0",
45
- "@wordpress/deprecated": "^3.46.0",
46
- "@wordpress/dom": "^3.46.0",
47
- "@wordpress/element": "^5.23.0",
48
- "@wordpress/escape-html": "^2.46.0",
49
- "@wordpress/hooks": "^3.46.0",
50
- "@wordpress/html-entities": "^3.46.0",
51
- "@wordpress/i18n": "^4.46.0",
52
- "@wordpress/icons": "^9.37.0",
53
- "@wordpress/interactivity": "^2.7.0",
54
- "@wordpress/keycodes": "^3.46.0",
55
- "@wordpress/notices": "^4.14.0",
56
- "@wordpress/primitives": "^3.44.0",
57
- "@wordpress/private-apis": "^0.28.0",
58
- "@wordpress/reusable-blocks": "^4.23.0",
59
- "@wordpress/rich-text": "^6.23.0",
60
- "@wordpress/server-side-render": "^4.23.0",
61
- "@wordpress/url": "^3.47.0",
62
- "@wordpress/viewport": "^5.23.0",
63
- "@wordpress/wordcount": "^3.46.0",
34
+ "@wordpress/a11y": "^3.47.0",
35
+ "@wordpress/api-fetch": "^6.44.0",
36
+ "@wordpress/autop": "^3.47.0",
37
+ "@wordpress/blob": "^3.47.0",
38
+ "@wordpress/block-editor": "^12.15.0",
39
+ "@wordpress/blocks": "^12.24.0",
40
+ "@wordpress/components": "^25.13.0",
41
+ "@wordpress/compose": "^6.24.0",
42
+ "@wordpress/core-data": "^6.24.0",
43
+ "@wordpress/data": "^9.17.0",
44
+ "@wordpress/date": "^4.47.0",
45
+ "@wordpress/deprecated": "^3.47.0",
46
+ "@wordpress/dom": "^3.47.0",
47
+ "@wordpress/element": "^5.24.0",
48
+ "@wordpress/escape-html": "^2.47.0",
49
+ "@wordpress/hooks": "^3.47.0",
50
+ "@wordpress/html-entities": "^3.47.0",
51
+ "@wordpress/i18n": "^4.47.0",
52
+ "@wordpress/icons": "^9.38.0",
53
+ "@wordpress/interactivity": "^3.0.1",
54
+ "@wordpress/keycodes": "^3.47.0",
55
+ "@wordpress/notices": "^4.15.0",
56
+ "@wordpress/primitives": "^3.45.0",
57
+ "@wordpress/private-apis": "^0.29.0",
58
+ "@wordpress/reusable-blocks": "^4.24.0",
59
+ "@wordpress/rich-text": "^6.24.0",
60
+ "@wordpress/server-side-render": "^4.24.0",
61
+ "@wordpress/url": "^3.48.0",
62
+ "@wordpress/viewport": "^5.24.0",
63
+ "@wordpress/wordcount": "^3.47.0",
64
64
  "change-case": "^4.1.2",
65
65
  "classnames": "^2.3.1",
66
66
  "colord": "^2.7.0",
@@ -78,5 +78,5 @@
78
78
  "publishConfig": {
79
79
  "access": "public"
80
80
  },
81
- "gitHead": "839018ff6029ba749780e288e08ff9cd898e50e8"
81
+ "gitHead": "12b897d7feff1cb00ddbf9016b62c1177d9c0081"
82
82
  }
package/src/block/edit.js CHANGED
@@ -114,33 +114,28 @@ export default function ReusableBlockEdit( {
114
114
  : InnerBlocks.ButtonBlockAppender,
115
115
  } );
116
116
 
117
+ let children = null;
117
118
  if ( hasAlreadyRendered ) {
118
- return (
119
- <div { ...blockProps }>
120
- <Warning>
121
- { __( 'Block cannot be rendered inside itself.' ) }
122
- </Warning>
123
- </div>
119
+ children = (
120
+ <Warning>
121
+ { __( 'Block cannot be rendered inside itself.' ) }
122
+ </Warning>
124
123
  );
125
124
  }
126
125
 
127
126
  if ( isMissing ) {
128
- return (
129
- <div { ...blockProps }>
130
- <Warning>
131
- { __( 'Block has been deleted or is unavailable.' ) }
132
- </Warning>
133
- </div>
127
+ children = (
128
+ <Warning>
129
+ { __( 'Block has been deleted or is unavailable.' ) }
130
+ </Warning>
134
131
  );
135
132
  }
136
133
 
137
134
  if ( ! hasResolved ) {
138
- return (
139
- <div { ...blockProps }>
140
- <Placeholder>
141
- <Spinner />
142
- </Placeholder>
143
- </div>
135
+ children = (
136
+ <Placeholder>
137
+ <Spinner />
138
+ </Placeholder>
144
139
  );
145
140
  }
146
141
 
@@ -157,7 +152,11 @@ export default function ReusableBlockEdit( {
157
152
  />
158
153
  </PanelBody>
159
154
  </InspectorControls>
160
- <div { ...innerBlocksProps } />
155
+ { children === null ? (
156
+ <div { ...innerBlocksProps } />
157
+ ) : (
158
+ <div { ...blockProps }>{ children }</div>
159
+ ) }
161
160
  </RecursionProvider>
162
161
  );
163
162
  }
@@ -78,7 +78,7 @@ export default function ReusableBlockEdit( {
78
78
  styles.spinnerDark
79
79
  );
80
80
 
81
- const { hasResolved, isEditing, isMissing, innerBlockCount } = useSelect(
81
+ const { hasResolved, isEditing, isMissing } = useSelect(
82
82
  ( select ) => {
83
83
  const persistedBlock = select( coreStore ).getEntityRecord(
84
84
  'postType',
@@ -176,20 +176,12 @@ export default function ReusableBlockEdit( {
176
176
  { infoTitle }
177
177
  </Text>
178
178
  <Text style={ [ infoTextStyle, infoDescriptionStyle ] }>
179
- { innerBlockCount > 1
180
- ? __(
181
- 'Alternatively, you can detach and edit these blocks separately by tapping “Detach patterns”.'
182
- )
183
- : __(
184
- 'Alternatively, you can detach and edit this block separately by tapping “Detach pattern”.'
185
- ) }
179
+ { __(
180
+ 'Alternatively, you can detach and edit this block separately by tapping “Detach”.'
181
+ ) }
186
182
  </Text>
187
183
  <TextControl
188
- label={
189
- innerBlockCount > 1
190
- ? __( 'Detach patterns' )
191
- : __( 'Detach pattern' )
192
- }
184
+ label={ __( 'Detach' ) }
193
185
  separatorType="topFullWidth"
194
186
  onPress={ onConvertToRegularBlocks }
195
187
  labelStyle={ actionButtonStyle }
@@ -8,6 +8,7 @@ import classnames from 'classnames';
8
8
  */
9
9
  import { NEW_TAB_TARGET, NOFOLLOW_REL } from './constants';
10
10
  import { getUpdatedLinkAttributes } from './get-updated-link-attributes';
11
+ import removeAnchorTag from '../utils/remove-anchor-tag';
11
12
 
12
13
  /**
13
14
  * WordPress dependencies
@@ -166,11 +167,6 @@ function ButtonEdit( props ) {
166
167
 
167
168
  const TagName = tagName || 'a';
168
169
 
169
- function setButtonText( newText ) {
170
- // Remove anchor tags from button text content.
171
- setAttributes( { text: newText.replace( /<\/?a[^>]*>/g, '' ) } );
172
- }
173
-
174
170
  function onKeyDown( event ) {
175
171
  if ( isKeyboardEvent.primary( event, 'k' ) ) {
176
172
  startEditing( event );
@@ -245,7 +241,11 @@ function ButtonEdit( props ) {
245
241
  aria-label={ __( 'Button text' ) }
246
242
  placeholder={ placeholder || __( 'Add text…' ) }
247
243
  value={ text }
248
- onChange={ ( value ) => setButtonText( value ) }
244
+ onChange={ ( value ) =>
245
+ setAttributes( {
246
+ text: removeAnchorTag( value ),
247
+ } )
248
+ }
249
249
  withoutInteractiveFormatting
250
250
  className={ classnames(
251
251
  className,
@@ -71,9 +71,3 @@ exports[`Buttons block when a button is shown removing button along with buttons
71
71
  <p></p>
72
72
  <!-- /wp:paragraph -->"
73
73
  `;
74
-
75
- exports[`Buttons block when a button is shown removing button along with buttons block removes the button and buttons block when deleting the block using the delete (backspace) key 1`] = `
76
- "<!-- wp:paragraph -->
77
- <p></p>
78
- <!-- /wp:paragraph -->"
79
- `;
@@ -18,7 +18,6 @@ import {
18
18
  */
19
19
  import { getBlockTypes, unregisterBlockType } from '@wordpress/blocks';
20
20
  import { registerCoreBlocks } from '@wordpress/block-library';
21
- import { BACKSPACE } from '@wordpress/keycodes';
22
21
 
23
22
  const BUTTONS_HTML = `<!-- wp:buttons -->
24
23
  <div class="wp-block-buttons"><!-- wp:button /--></div>
@@ -238,32 +237,6 @@ describe( 'Buttons block', () => {
238
237
 
239
238
  expect( getEditorHtml() ).toMatchSnapshot();
240
239
  } );
241
-
242
- it( 'removes the button and buttons block when deleting the block using the delete (backspace) key', async () => {
243
- const screen = await initializeEditor( {
244
- initialHtml: BUTTONS_HTML,
245
- } );
246
-
247
- // Get block
248
- const buttonsBlock = await getBlock( screen, 'Buttons' );
249
- triggerBlockListLayout( buttonsBlock );
250
-
251
- // Get inner button block
252
- const buttonBlock = await getBlock( screen, 'Button' );
253
- fireEvent.press( buttonBlock );
254
-
255
- const buttonInput =
256
- within( buttonBlock ).getByLabelText( 'Text input. Empty' );
257
-
258
- // Delete block
259
- fireEvent( buttonInput, 'onKeyDown', {
260
- nativeEvent: {},
261
- preventDefault() {},
262
- keyCode: BACKSPACE,
263
- } );
264
-
265
- expect( getEditorHtml() ).toMatchSnapshot();
266
- } );
267
240
  } );
268
241
  } );
269
242
 
@@ -103,7 +103,7 @@ function ColumnEdit( {
103
103
  />
104
104
  </BlockControls>
105
105
  <InspectorControls>
106
- <PanelBody title={ __( 'Column settings' ) }>
106
+ <PanelBody title={ __( 'Settings' ) }>
107
107
  <UnitControl
108
108
  label={ __( 'Width' ) }
109
109
  labelPosition="edge"
@@ -160,7 +160,7 @@ function ColumnEdit( {
160
160
  />
161
161
  </BlockControls>
162
162
  <InspectorControls>
163
- <PanelBody title={ __( 'Column settings' ) }>
163
+ <PanelBody title={ __( 'Settings' ) }>
164
164
  <UnitControl
165
165
  label={ __( 'Width' ) }
166
166
  min={ 1 }
@@ -335,6 +335,7 @@ function CoverEdit( {
335
335
  templateInsertUpdatesSelection: true,
336
336
  allowedBlocks,
337
337
  templateLock,
338
+ dropZoneElement: ref.current,
338
339
  }
339
340
  );
340
341