@wordpress/block-editor 10.0.3 → 10.0.5

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 (72) hide show
  1. package/build/components/block-inspector/index.js +3 -4
  2. package/build/components/block-inspector/index.js.map +1 -1
  3. package/build/components/block-list/block.js +72 -14
  4. package/build/components/block-list/block.js.map +1 -1
  5. package/build/components/block-parent-selector/index.js +2 -2
  6. package/build/components/block-parent-selector/index.js.map +1 -1
  7. package/build/components/block-popover/inbetween.js +3 -1
  8. package/build/components/block-popover/inbetween.js.map +1 -1
  9. package/build/components/block-popover/index.js +19 -16
  10. package/build/components/block-popover/index.js.map +1 -1
  11. package/build/components/image-editor/use-transform-image.js +2 -2
  12. package/build/components/image-editor/use-transform-image.js.map +1 -1
  13. package/build/components/inserter/search-items.js +2 -17
  14. package/build/components/inserter/search-items.js.map +1 -1
  15. package/build/components/spacing-sizes-control/index.js +10 -2
  16. package/build/components/spacing-sizes-control/index.js.map +1 -1
  17. package/build/components/spacing-sizes-control/spacing-input-control.js +5 -4
  18. package/build/components/spacing-sizes-control/spacing-input-control.js.map +1 -1
  19. package/build/hooks/index.js +13 -1
  20. package/build/hooks/index.js.map +1 -1
  21. package/build/hooks/layout.js +76 -23
  22. package/build/hooks/layout.js.map +1 -1
  23. package/build/hooks/margin.js +4 -4
  24. package/build/hooks/margin.js.map +1 -1
  25. package/build/index.js +14 -0
  26. package/build/index.js.map +1 -1
  27. package/build-module/components/block-inspector/index.js +3 -4
  28. package/build-module/components/block-inspector/index.js.map +1 -1
  29. package/build-module/components/block-list/block.js +72 -14
  30. package/build-module/components/block-list/block.js.map +1 -1
  31. package/build-module/components/block-parent-selector/index.js +2 -2
  32. package/build-module/components/block-parent-selector/index.js.map +1 -1
  33. package/build-module/components/block-popover/inbetween.js +3 -1
  34. package/build-module/components/block-popover/inbetween.js.map +1 -1
  35. package/build-module/components/block-popover/index.js +19 -16
  36. package/build-module/components/block-popover/index.js.map +1 -1
  37. package/build-module/components/image-editor/use-transform-image.js +2 -2
  38. package/build-module/components/image-editor/use-transform-image.js.map +1 -1
  39. package/build-module/components/inserter/search-items.js +3 -17
  40. package/build-module/components/inserter/search-items.js.map +1 -1
  41. package/build-module/components/spacing-sizes-control/index.js +10 -3
  42. package/build-module/components/spacing-sizes-control/index.js.map +1 -1
  43. package/build-module/components/spacing-sizes-control/spacing-input-control.js +6 -5
  44. package/build-module/components/spacing-sizes-control/spacing-input-control.js.map +1 -1
  45. package/build-module/hooks/index.js +1 -0
  46. package/build-module/hooks/index.js.map +1 -1
  47. package/build-module/hooks/layout.js +73 -23
  48. package/build-module/hooks/layout.js.map +1 -1
  49. package/build-module/hooks/margin.js +4 -4
  50. package/build-module/hooks/margin.js.map +1 -1
  51. package/build-module/index.js +1 -1
  52. package/build-module/index.js.map +1 -1
  53. package/build-style/style-rtl.css +85 -125
  54. package/build-style/style.css +85 -125
  55. package/package.json +9 -10
  56. package/src/components/block-inspector/index.js +4 -7
  57. package/src/components/block-list/block.js +111 -7
  58. package/src/components/block-list/style.scss +85 -133
  59. package/src/components/block-parent-selector/index.js +2 -2
  60. package/src/components/block-popover/inbetween.js +1 -1
  61. package/src/components/block-popover/index.js +36 -21
  62. package/src/components/button-block-appender/style.scss +3 -1
  63. package/src/components/image-editor/use-transform-image.js +2 -2
  64. package/src/components/inserter/search-items.js +3 -15
  65. package/src/components/inserter/test/search-items.js +4 -0
  66. package/src/components/spacing-sizes-control/index.js +15 -3
  67. package/src/components/spacing-sizes-control/spacing-input-control.js +8 -7
  68. package/src/components/spacing-sizes-control/style.scss +28 -24
  69. package/src/hooks/index.js +1 -0
  70. package/src/hooks/layout.js +64 -21
  71. package/src/hooks/margin.js +4 -4
  72. package/src/index.js +2 -0
@@ -172,52 +172,77 @@
172
172
  /**
173
173
  * Cross-Block Selection
174
174
  */
175
+ @keyframes selection-overlay__fade-in-animation {
176
+ from {
177
+ opacity: 0;
178
+ }
179
+ to {
180
+ opacity: 0.4;
181
+ }
182
+ }
175
183
  .block-editor-block-list__layout {
176
184
  position: relative;
177
185
  }
178
186
  .block-editor-block-list__layout::selection {
179
187
  background: transparent;
180
188
  }
181
- .block-editor-block-list__layout .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected)::after,
182
- .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted::after,
183
- .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted ~ .is-multi-selected::after {
189
+ .has-multi-selection .block-editor-block-list__layout::selection {
190
+ background: transparent;
191
+ }
192
+ .block-editor-block-list__layout .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected)::selection, .block-editor-block-list__layout .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected) ::selection {
193
+ background: transparent;
194
+ }
195
+ .block-editor-block-list__layout .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected)::after {
196
+ content: "";
184
197
  position: absolute;
185
198
  z-index: 1;
186
199
  pointer-events: none;
187
- content: "";
188
200
  top: 1px;
201
+ right: 1px;
189
202
  bottom: 1px;
190
203
  left: 1px;
191
- right: 1px;
192
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
193
- border-radius: 1px;
204
+ background: var(--wp-admin-theme-color);
205
+ opacity: 0.4;
206
+ animation: selection-overlay__fade-in-animation 0.1s ease-out;
207
+ animation-fill-mode: forwards;
194
208
  outline: 2px solid transparent;
195
209
  }
196
- .is-dark-theme .block-editor-block-list__layout .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected)::after,
197
- .is-dark-theme .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted::after,
198
- .is-dark-theme .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted ~ .is-multi-selected::after {
199
- box-shadow: 0 0 0 1px #fff;
200
- }
201
- .block-editor-block-list__layout .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected) .components-placeholder ::selection,
202
- .block-editor-block-list__layout .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected) .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected) ::selection,
203
- .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted .components-placeholder ::selection,
204
- .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected) ::selection,
205
- .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted ~ .is-multi-selected .components-placeholder ::selection,
206
- .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted ~ .is-multi-selected .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected) ::selection {
207
- background: transparent;
210
+ @media (prefers-reduced-motion: reduce) {
211
+ .block-editor-block-list__layout .block-editor-block-list__block.is-multi-selected:not(.is-partially-selected)::after {
212
+ animation-duration: 1ms;
213
+ animation-delay: 0s;
214
+ }
208
215
  }
209
- .has-multi-selection .block-editor-block-list__layout::selection {
210
- background: transparent;
216
+ .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted,
217
+ .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted ~ .is-multi-selected, .block-editor-block-list__layout.is-navigate-mode .block-editor-block-list__block.is-selected, .block-editor-block-list__layout .is-block-moving-mode.block-editor-block-list__block.has-child-selected {
218
+ border-radius: 2px;
219
+ box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
220
+ outline: 2px solid transparent;
211
221
  }
212
- .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted::after {
213
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
214
- outline: 1px solid transparent;
222
+ .block-editor-block-list__layout .block-editor-block-list__block:not([contenteditable]):focus {
223
+ outline: none;
215
224
  }
216
- .block-editor-block-list__layout.is-navigate-mode .block-editor-block-list__block.is-selected::after, .block-editor-block-list__layout .is-block-moving-mode.block-editor-block-list__block.has-child-selected {
225
+ .block-editor-block-list__layout .block-editor-block-list__block:not([contenteditable]):focus::after {
226
+ content: "";
227
+ position: absolute;
228
+ z-index: 1;
229
+ pointer-events: none;
230
+ top: 1px;
231
+ right: 1px;
232
+ bottom: 1px;
233
+ left: 1px;
217
234
  box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
235
+ border-radius: 1px;
218
236
  outline: 2px solid transparent;
219
237
  }
220
- .block-editor-block-list__layout .is-block-moving-mode.block-editor-block-list__block.is-selected::before {
238
+ .is-dark-theme .block-editor-block-list__layout .block-editor-block-list__block:not([contenteditable]):focus::after {
239
+ box-shadow: 0 0 0 var(--wp-admin-border-width-focus) #fff;
240
+ }
241
+ .block-editor-block-list__layout .is-block-moving-mode.block-editor-block-list__block.is-selected {
242
+ box-shadow: none;
243
+ outline: none;
244
+ }
245
+ .block-editor-block-list__layout .is-block-moving-mode.block-editor-block-list__block.is-selected::after {
221
246
  content: "";
222
247
  position: absolute;
223
248
  z-index: 0;
@@ -229,10 +254,7 @@
229
254
  border-radius: 2px;
230
255
  border-top: 4px solid #ccc;
231
256
  }
232
- .block-editor-block-list__layout .is-block-moving-mode.block-editor-block-list__block.is-selected::after {
233
- content: none;
234
- }
235
- .block-editor-block-list__layout .is-block-moving-mode.can-insert-moving-block.block-editor-block-list__block.is-selected::before {
257
+ .block-editor-block-list__layout .is-block-moving-mode.can-insert-moving-block.block-editor-block-list__block.is-selected::after {
236
258
  border-color: var(--wp-admin-theme-color);
237
259
  }
238
260
  .has-multi-selection .block-editor-block-list__layout {
@@ -266,24 +288,6 @@
266
288
  /**
267
289
  * Notices
268
290
  */
269
- /**
270
- * Block Layout
271
- */
272
- /**
273
- * Block styles and alignments
274
- */
275
- }
276
- .block-editor-block-list__layout .block-editor-block-list__block.is-partially-selected::after {
277
- top: -0.5px;
278
- right: -0.5px;
279
- bottom: -0.5px;
280
- left: -0.5px;
281
- }
282
- .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted::after, .block-editor-block-list__layout .block-editor-block-list__block.is-highlighted ~ .is-multi-selected::after {
283
- top: 0;
284
- right: 0;
285
- bottom: 0;
286
- left: 0;
287
291
  }
288
292
  .block-editor-block-list__layout .block-editor-block-list__block .reusable-block-edit-panel * {
289
293
  z-index: 1;
@@ -302,43 +306,6 @@
302
306
  .block-editor-block-list__layout .block-editor-block-list__block .components-with-notices-ui .components-notice .components-notice__content {
303
307
  font-size: 13px;
304
308
  }
305
- .block-editor-block-list__layout .block-editor-block-list__block:not([contenteditable]):focus {
306
- outline: none;
307
- }
308
- .block-editor-block-list__layout .block-editor-block-list__block:not([contenteditable]):focus::after {
309
- position: absolute;
310
- z-index: 1;
311
- pointer-events: none;
312
- content: "";
313
- top: 1px;
314
- bottom: 1px;
315
- left: 1px;
316
- right: 1px;
317
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
318
- border-radius: 1px;
319
- outline: 2px solid transparent;
320
- }
321
- .is-dark-theme .block-editor-block-list__layout .block-editor-block-list__block:not([contenteditable]):focus::after {
322
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) #fff;
323
- }
324
- .block-editor-block-list__layout .block-editor-block-list__block::after {
325
- content: "";
326
- pointer-events: none;
327
- position: absolute;
328
- top: 0;
329
- right: 0;
330
- bottom: 0;
331
- left: 0;
332
- border-radius: 2px;
333
- box-shadow: 0 0 0 0 transparent;
334
- transition: box-shadow 0.1s linear;
335
- }
336
- @media (prefers-reduced-motion: reduce) {
337
- .block-editor-block-list__layout .block-editor-block-list__block::after {
338
- transition-duration: 0s;
339
- transition-delay: 0s;
340
- }
341
- }
342
309
  .block-editor-block-list__layout .block-editor-block-list__block.has-warning {
343
310
  min-height: 48px;
344
311
  }
@@ -378,31 +345,19 @@
378
345
 
379
346
  .is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-hovered {
380
347
  cursor: default;
381
- }
382
- .is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-hovered::after {
383
- top: 1px;
384
- left: 1px;
385
- right: 1px;
386
- bottom: 1px;
387
- box-shadow: 0 0 0 1px var(--wp-admin-theme-color);
388
- border-radius: 1px;
348
+ box-shadow: inset 0 0 0 1px var(--wp-admin-theme-color);
349
+ border-radius: 2px;
389
350
  }
390
351
  .is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-selected {
391
352
  cursor: default;
353
+ box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
354
+ border-radius: 2px;
392
355
  }
393
356
  .is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-selected.rich-text {
394
357
  cursor: unset;
395
358
  }
396
- .is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-selected::after {
397
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
398
- top: 1px;
399
- left: 1px;
400
- right: 1px;
401
- bottom: 1px;
402
- border-radius: 1px;
403
- }
404
- .is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-selected:focus::after {
405
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
359
+ .is-outline-mode .block-editor-block-list__block:not(.remove-outline).is-selected:focus {
360
+ box-shadow: inset 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
406
361
  }
407
362
 
408
363
  .is-focus-mode .block-editor-block-list__block:not(.has-child-selected) {
@@ -1757,10 +1712,10 @@
1757
1712
  color: #000;
1758
1713
  }
1759
1714
 
1760
- .is-layout-constrained.block-editor-block-list__block:not(.is-selected) > .block-list-appender:only-child, .is-layout-flow.block-editor-block-list__block:not(.is-selected) > .block-list-appender:only-child {
1715
+ .is-layout-constrained.block-editor-block-list__block:not(.is-selected) > .block-list-appender:only-child, .is-layout-flow.block-editor-block-list__block:not(.is-selected) > .block-list-appender:only-child, .is-layout-constrained.block-editor-block-list__block:not(.is-selected) > .block-editor-block-list__layout > .block-list-appender:only-child, .is-layout-flow.block-editor-block-list__block:not(.is-selected) > .block-editor-block-list__layout > .block-list-appender:only-child {
1761
1716
  pointer-events: none;
1762
1717
  }
1763
- .is-layout-constrained.block-editor-block-list__block:not(.is-selected) > .block-list-appender:only-child::after, .is-layout-flow.block-editor-block-list__block:not(.is-selected) > .block-list-appender:only-child::after {
1718
+ .is-layout-constrained.block-editor-block-list__block:not(.is-selected) > .block-list-appender:only-child::after, .is-layout-flow.block-editor-block-list__block:not(.is-selected) > .block-list-appender:only-child::after, .is-layout-constrained.block-editor-block-list__block:not(.is-selected) > .block-editor-block-list__layout > .block-list-appender:only-child::after, .is-layout-flow.block-editor-block-list__block:not(.is-selected) > .block-editor-block-list__layout > .block-list-appender:only-child::after {
1764
1719
  content: "";
1765
1720
  position: absolute;
1766
1721
  top: 0;
@@ -1771,7 +1726,7 @@
1771
1726
  border: 1px dashed currentColor;
1772
1727
  border-radius: 2px;
1773
1728
  }
1774
- .is-layout-constrained.block-editor-block-list__block:not(.is-selected) > .block-list-appender:only-child .block-editor-inserter, .is-layout-flow.block-editor-block-list__block:not(.is-selected) > .block-list-appender:only-child .block-editor-inserter {
1729
+ .is-layout-constrained.block-editor-block-list__block:not(.is-selected) > .block-list-appender:only-child .block-editor-inserter, .is-layout-flow.block-editor-block-list__block:not(.is-selected) > .block-list-appender:only-child .block-editor-inserter, .is-layout-constrained.block-editor-block-list__block:not(.is-selected) > .block-editor-block-list__layout > .block-list-appender:only-child .block-editor-inserter, .is-layout-flow.block-editor-block-list__block:not(.is-selected) > .block-editor-block-list__layout > .block-list-appender:only-child .block-editor-inserter {
1775
1730
  visibility: hidden;
1776
1731
  }
1777
1732
 
@@ -4317,7 +4272,8 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
4317
4272
  .tools-panel-item-spacing {
4318
4273
  display: grid;
4319
4274
  grid-template-columns: auto 1fr auto;
4320
- grid-row-gap: 4px;
4275
+ align-items: center;
4276
+ grid-template-rows: 25px auto;
4321
4277
  }
4322
4278
 
4323
4279
  .component-spacing-sizes-control {
@@ -4332,19 +4288,28 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
4332
4288
  grid-row: 1/1;
4333
4289
  align-self: center;
4334
4290
  }
4291
+ .component-spacing-sizes-control .components-base-control__label {
4292
+ margin-bottom: 0;
4293
+ height: 16px;
4294
+ }
4335
4295
  .component-spacing-sizes-control .components-spacing-sizes-control__side-labels {
4336
4296
  grid-column: 1/1;
4337
- min-height: 30px;
4338
4297
  justify-content: left;
4298
+ height: 16px;
4299
+ margin-top: 12px;
4339
4300
  }
4340
- .component-spacing-sizes-control .components-spacing-sizes-control__hint-single {
4341
- margin-top: 0;
4342
- margin-left: 0;
4301
+ .component-spacing-sizes-control .components-spacing-sizes-control__side-label {
4302
+ grid-column: 1/1;
4303
+ justify-self: left;
4304
+ margin-bottom: 0;
4305
+ }
4306
+ .component-spacing-sizes-control.is-unlinked .components-range-control.components-spacing-sizes-control__range-control {
4307
+ margin-top: 12px;
4343
4308
  }
4344
4309
  .component-spacing-sizes-control .components-spacing-sizes-control__hint-single,
4345
4310
  .component-spacing-sizes-control .components-spacing-sizes-control__hint-all {
4346
4311
  color: #757575;
4347
- font-size: 12px;
4312
+ margin-bottom: 0;
4348
4313
  }
4349
4314
  .component-spacing-sizes-control .components-spacing-sizes-control__hint-all {
4350
4315
  grid-column: 2/2;
@@ -4359,6 +4324,11 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
4359
4324
  justify-self: end;
4360
4325
  padding: 0;
4361
4326
  }
4327
+ .component-spacing-sizes-control .components-spacing-sizes-control__custom-toggle-all.is-small.has-icon {
4328
+ padding: 0;
4329
+ min-width: 24px;
4330
+ height: 16px;
4331
+ }
4362
4332
  .component-spacing-sizes-control .component-spacing-sizes-control__linked-button ~ .components-spacing-sizes-control__custom-toggle-all {
4363
4333
  margin-right: 4px;
4364
4334
  }
@@ -4366,10 +4336,11 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
4366
4336
  grid-column: 3/3;
4367
4337
  justify-self: end;
4368
4338
  }
4369
- .component-spacing-sizes-control .components-spacing-sizes-control__custom-toggle-all.is-small.has-icon,
4370
4339
  .component-spacing-sizes-control .components-spacing-sizes-control__custom-toggle-single.is-small.has-icon {
4371
4340
  padding: 0;
4372
4341
  min-width: 24px;
4342
+ height: 16px;
4343
+ margin-top: 12px;
4373
4344
  }
4374
4345
  .component-spacing-sizes-control .component-spacing-sizes-control__linked-button {
4375
4346
  grid-column: 3/3;
@@ -4379,7 +4350,6 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
4379
4350
  .component-spacing-sizes-control .components-spacing-sizes-control__custom-value-range {
4380
4351
  grid-column: span 2;
4381
4352
  margin-left: 8px;
4382
- padding-right: 8px;
4383
4353
  height: 30px;
4384
4354
  }
4385
4355
  .component-spacing-sizes-control .components-spacing-sizes-control__custom-value-input {
@@ -4387,11 +4357,7 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
4387
4357
  }
4388
4358
  .component-spacing-sizes-control .components-spacing-sizes-control__range-control {
4389
4359
  grid-column: span 3;
4390
- padding-right: 8px;
4391
- height: 30px;
4392
- }
4393
- .component-spacing-sizes-control .components-range-control__wrapper {
4394
- margin-bottom: 0;
4360
+ height: 40px;
4395
4361
  }
4396
4362
  .component-spacing-sizes-control .components-range-control__mark {
4397
4363
  height: 4px;
@@ -4408,12 +4374,6 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
4408
4374
  .component-spacing-sizes-control [class*=ThumbWrapper-thumbColor] {
4409
4375
  z-index: 3;
4410
4376
  }
4411
- .component-spacing-sizes-control .components-spacing-sizes-control__side-label {
4412
- margin-right: 4px;
4413
- grid-column: 1/1;
4414
- justify-self: left;
4415
- font-size: 12px;
4416
- }
4417
4377
  .component-spacing-sizes-control .components-spacing-sizes-control__custom-select-control {
4418
4378
  grid-column: span 3;
4419
4379
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/block-editor",
3
- "version": "10.0.3",
3
+ "version": "10.0.5",
4
4
  "description": "Generic block editor.",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -36,10 +36,10 @@
36
36
  "@wordpress/a11y": "^3.17.1",
37
37
  "@wordpress/api-fetch": "^6.14.1",
38
38
  "@wordpress/blob": "^3.17.1",
39
- "@wordpress/blocks": "^11.16.3",
40
- "@wordpress/components": "^21.0.3",
39
+ "@wordpress/blocks": "^11.16.4",
40
+ "@wordpress/components": "^21.0.4",
41
41
  "@wordpress/compose": "^5.15.2",
42
- "@wordpress/data": "^7.1.2",
42
+ "@wordpress/data": "^7.1.3",
43
43
  "@wordpress/date": "^4.17.1",
44
44
  "@wordpress/deprecated": "^3.17.1",
45
45
  "@wordpress/dom": "^3.17.2",
@@ -49,17 +49,16 @@
49
49
  "@wordpress/i18n": "^4.17.1",
50
50
  "@wordpress/icons": "^9.8.1",
51
51
  "@wordpress/is-shallow-equal": "^4.17.1",
52
- "@wordpress/keyboard-shortcuts": "^3.15.2",
52
+ "@wordpress/keyboard-shortcuts": "^3.15.3",
53
53
  "@wordpress/keycodes": "^3.17.1",
54
- "@wordpress/notices": "^3.17.2",
55
- "@wordpress/rich-text": "^5.15.2",
54
+ "@wordpress/notices": "^3.17.3",
55
+ "@wordpress/rich-text": "^5.15.3",
56
56
  "@wordpress/shortcode": "^3.17.1",
57
- "@wordpress/style-engine": "^1.0.2",
57
+ "@wordpress/style-engine": "^1.0.3",
58
58
  "@wordpress/token-list": "^2.17.1",
59
59
  "@wordpress/url": "^3.18.1",
60
60
  "@wordpress/warning": "^2.17.1",
61
61
  "@wordpress/wordcount": "^3.17.1",
62
- "change-case": "^4.1.2",
63
62
  "classnames": "^2.3.1",
64
63
  "colord": "^2.7.0",
65
64
  "diff": "^4.0.2",
@@ -79,5 +78,5 @@
79
78
  "publishConfig": {
80
79
  "access": "public"
81
80
  },
82
- "gitHead": "54a676dba557a76062d3bf91bfe8a3e3ea12d254"
81
+ "gitHead": "06334a7bd943f2345f15b8d2f427721d6878e6c1"
83
82
  }
@@ -40,6 +40,7 @@ function useContentBlocks( blockTypes, block ) {
40
40
  const contenBlocksObjectAux = useMemo( () => {
41
41
  return blockTypes.reduce( ( result, blockType ) => {
42
42
  if (
43
+ blockType.name !== 'core/list-item' &&
43
44
  Object.entries( blockType.attributes ).some(
44
45
  ( [ , { __experimentalRole } ] ) =>
45
46
  __experimentalRole === 'content'
@@ -143,7 +144,6 @@ const BlockInspector = ( { showNoBlockSelectedMessage = true } ) => {
143
144
  getSelectedBlockCount,
144
145
  getBlockName,
145
146
  __unstableGetContentLockingParent,
146
- getTemplateLock,
147
147
  } = select( blockEditorStore );
148
148
 
149
149
  const _selectedBlockClientId = getSelectedBlockClientId();
@@ -157,12 +157,9 @@ const BlockInspector = ( { showNoBlockSelectedMessage = true } ) => {
157
157
  selectedBlockClientId: _selectedBlockClientId,
158
158
  selectedBlockName: _selectedBlockName,
159
159
  blockType: _blockType,
160
- topLevelLockedBlock:
161
- getTemplateLock( _selectedBlockClientId ) === 'contentOnly'
162
- ? _selectedBlockClientId
163
- : __unstableGetContentLockingParent(
164
- _selectedBlockClientId
165
- ),
160
+ topLevelLockedBlock: __unstableGetContentLockingParent(
161
+ _selectedBlockClientId
162
+ ),
166
163
  };
167
164
  }, [] );
168
165
 
@@ -296,7 +296,7 @@ const applyWithSelect = withSelect( ( select, { clientId, rootClientId } ) => {
296
296
  };
297
297
  } );
298
298
 
299
- const applyWithDispatch = withDispatch( ( dispatch, ownProps, { select } ) => {
299
+ const applyWithDispatch = withDispatch( ( dispatch, ownProps, registry ) => {
300
300
  const {
301
301
  updateBlockAttributes,
302
302
  insertBlocks,
@@ -304,6 +304,9 @@ const applyWithDispatch = withDispatch( ( dispatch, ownProps, { select } ) => {
304
304
  replaceBlocks,
305
305
  toggleSelection,
306
306
  __unstableMarkLastChangeAsPersistent,
307
+ moveBlocksToPosition,
308
+ removeBlock,
309
+ selectBlock,
307
310
  } = dispatch( blockEditorStore );
308
311
 
309
312
  // Do not add new properties here, use `useDispatch` instead to avoid
@@ -311,7 +314,7 @@ const applyWithDispatch = withDispatch( ( dispatch, ownProps, { select } ) => {
311
314
  return {
312
315
  setAttributes( newAttributes ) {
313
316
  const { getMultiSelectedBlockClientIds } =
314
- select( blockEditorStore );
317
+ registry.select( blockEditorStore );
315
318
  const multiSelectedBlockClientIds =
316
319
  getMultiSelectedBlockClientIds();
317
320
  const { clientId } = ownProps;
@@ -327,26 +330,124 @@ const applyWithDispatch = withDispatch( ( dispatch, ownProps, { select } ) => {
327
330
  },
328
331
  onInsertBlocksAfter( blocks ) {
329
332
  const { clientId, rootClientId } = ownProps;
330
- const { getBlockIndex } = select( blockEditorStore );
333
+ const { getBlockIndex } = registry.select( blockEditorStore );
331
334
  const index = getBlockIndex( clientId );
332
335
  insertBlocks( blocks, index + 1, rootClientId );
333
336
  },
334
337
  onMerge( forward ) {
335
338
  const { clientId, rootClientId } = ownProps;
336
- const { getPreviousBlockClientId, getNextBlockClientId, getBlock } =
337
- select( blockEditorStore );
339
+ const {
340
+ getPreviousBlockClientId,
341
+ getNextBlockClientId,
342
+ getBlock,
343
+ getBlockAttributes,
344
+ getBlockName,
345
+ getBlockOrder,
346
+ } = registry.select( blockEditorStore );
338
347
 
348
+ // For `Delete` or forward merge, we should do the exact same thing
349
+ // as `Backspace`, but from the other block.
339
350
  if ( forward ) {
351
+ if ( rootClientId ) {
352
+ const nextRootClientId =
353
+ getNextBlockClientId( rootClientId );
354
+
355
+ if ( nextRootClientId ) {
356
+ // If there is a block that follows with the same parent
357
+ // block name and the same attributes, merge the inner
358
+ // blocks.
359
+ if (
360
+ getBlockName( rootClientId ) ===
361
+ getBlockName( nextRootClientId )
362
+ ) {
363
+ const rootAttributes =
364
+ getBlockAttributes( rootClientId );
365
+ const previousRootAttributes =
366
+ getBlockAttributes( nextRootClientId );
367
+
368
+ if (
369
+ Object.keys( rootAttributes ).every(
370
+ ( key ) =>
371
+ rootAttributes[ key ] ===
372
+ previousRootAttributes[ key ]
373
+ )
374
+ ) {
375
+ registry.batch( () => {
376
+ moveBlocksToPosition(
377
+ getBlockOrder( nextRootClientId ),
378
+ nextRootClientId,
379
+ rootClientId
380
+ );
381
+ removeBlock( nextRootClientId, false );
382
+ } );
383
+ return;
384
+ }
385
+ } else {
386
+ mergeBlocks( rootClientId, nextRootClientId );
387
+ return;
388
+ }
389
+ }
390
+ }
391
+
340
392
  const nextBlockClientId = getNextBlockClientId( clientId );
341
- if ( nextBlockClientId ) {
393
+
394
+ if ( ! nextBlockClientId ) {
395
+ return;
396
+ }
397
+
398
+ // Check if it's possibile to "unwrap" the following block
399
+ // before trying to merge.
400
+ const replacement = switchToBlockType(
401
+ getBlock( nextBlockClientId ),
402
+ '*'
403
+ );
404
+
405
+ if ( replacement && replacement.length ) {
406
+ replaceBlocks( nextBlockClientId, replacement );
407
+ } else {
342
408
  mergeBlocks( clientId, nextBlockClientId );
343
409
  }
344
410
  } else {
345
411
  const previousBlockClientId =
346
412
  getPreviousBlockClientId( clientId );
413
+
347
414
  if ( previousBlockClientId ) {
348
415
  mergeBlocks( previousBlockClientId, clientId );
349
416
  } else if ( rootClientId ) {
417
+ const previousRootClientId =
418
+ getPreviousBlockClientId( rootClientId );
419
+
420
+ // If there is a preceding block with the same parent block
421
+ // name and the same attributes, merge the inner blocks.
422
+ if (
423
+ previousRootClientId &&
424
+ getBlockName( rootClientId ) ===
425
+ getBlockName( previousRootClientId )
426
+ ) {
427
+ const rootAttributes =
428
+ getBlockAttributes( rootClientId );
429
+ const previousRootAttributes =
430
+ getBlockAttributes( previousRootClientId );
431
+
432
+ if (
433
+ Object.keys( rootAttributes ).every(
434
+ ( key ) =>
435
+ rootAttributes[ key ] ===
436
+ previousRootAttributes[ key ]
437
+ )
438
+ ) {
439
+ registry.batch( () => {
440
+ moveBlocksToPosition(
441
+ getBlockOrder( rootClientId ),
442
+ rootClientId,
443
+ previousRootClientId
444
+ );
445
+ removeBlock( rootClientId, false );
446
+ } );
447
+ return;
448
+ }
449
+ }
450
+
350
451
  // Attempt to "unwrap" the block contents when there's no
351
452
  // preceding block to merge with.
352
453
  const replacement = switchToBlockType(
@@ -354,7 +455,10 @@ const applyWithDispatch = withDispatch( ( dispatch, ownProps, { select } ) => {
354
455
  '*'
355
456
  );
356
457
  if ( replacement && replacement.length ) {
357
- replaceBlocks( rootClientId, replacement, 0 );
458
+ registry.batch( () => {
459
+ replaceBlocks( rootClientId, replacement );
460
+ selectBlock( replacement[ 0 ].clientId, 0 );
461
+ } );
358
462
  }
359
463
  }
360
464
  }