@wordpress/block-editor 12.3.4 → 12.5.0

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 (192) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/README.md +4 -0
  3. package/build/components/block-heading-level-dropdown/heading-level-icon.js +10 -2
  4. package/build/components/block-heading-level-dropdown/heading-level-icon.js.map +1 -1
  5. package/build/components/block-heading-level-dropdown/index.native.js +4 -3
  6. package/build/components/block-heading-level-dropdown/index.native.js.map +1 -1
  7. package/build/components/block-parent-selector/index.js +8 -5
  8. package/build/components/block-parent-selector/index.js.map +1 -1
  9. package/build/components/block-removal-warning-modal/index.js +18 -25
  10. package/build/components/block-removal-warning-modal/index.js.map +1 -1
  11. package/build/components/block-tools/block-contextual-toolbar.js +7 -11
  12. package/build/components/block-tools/block-contextual-toolbar.js.map +1 -1
  13. package/build/components/global-styles/color-panel.js +1 -1
  14. package/build/components/global-styles/color-panel.js.map +1 -1
  15. package/build/components/global-styles/hooks.js +2 -2
  16. package/build/components/global-styles/hooks.js.map +1 -1
  17. package/build/components/global-styles/typography-panel.js +34 -2
  18. package/build/components/global-styles/typography-panel.js.map +1 -1
  19. package/build/components/index.js +19 -1
  20. package/build/components/index.js.map +1 -1
  21. package/build/components/inserter/media-tab/hooks.js +2 -21
  22. package/build/components/inserter/media-tab/hooks.js.map +1 -1
  23. package/build/components/inserter/reusable-block-rename-hint.js +62 -0
  24. package/build/components/inserter/reusable-block-rename-hint.js.map +1 -0
  25. package/build/components/inserter/reusable-blocks-tab.js +5 -1
  26. package/build/components/inserter/reusable-blocks-tab.js.map +1 -1
  27. package/build/components/inserter/reusable-blocks-tab.native.js +2 -2
  28. package/build/components/inserter/reusable-blocks-tab.native.js.map +1 -1
  29. package/build/components/inserter/tabs.native.js +1 -1
  30. package/build/components/inserter/tabs.native.js.map +1 -1
  31. package/build/components/inserter-draggable-blocks/index.js +9 -1
  32. package/build/components/inserter-draggable-blocks/index.js.map +1 -1
  33. package/build/components/link-control/constants.js +1 -1
  34. package/build/components/link-control/constants.js.map +1 -1
  35. package/build/components/link-control/search-create-button.js +5 -21
  36. package/build/components/link-control/search-create-button.js.map +1 -1
  37. package/build/components/link-control/search-item.js +13 -30
  38. package/build/components/link-control/search-item.js.map +1 -1
  39. package/build/components/link-control/search-results.js +2 -2
  40. package/build/components/link-control/search-results.js.map +1 -1
  41. package/build/components/list-view/appender.js +2 -6
  42. package/build/components/list-view/appender.js.map +1 -1
  43. package/build/components/provider/index.js +5 -2
  44. package/build/components/provider/index.js.map +1 -1
  45. package/build/components/writing-flow/use-tab-nav.js +10 -27
  46. package/build/components/writing-flow/use-tab-nav.js.map +1 -1
  47. package/build/components/writing-mode-control/index.js +70 -0
  48. package/build/components/writing-mode-control/index.js.map +1 -0
  49. package/build/hooks/behaviors.js +25 -20
  50. package/build/hooks/behaviors.js.map +1 -1
  51. package/build/hooks/supports.js +7 -1
  52. package/build/hooks/supports.js.map +1 -1
  53. package/build/hooks/typography.js +2 -1
  54. package/build/hooks/typography.js.map +1 -1
  55. package/build/hooks/utils.js +4 -2
  56. package/build/hooks/utils.js.map +1 -1
  57. package/build/private-apis.js +3 -0
  58. package/build/private-apis.js.map +1 -1
  59. package/build/private-apis.native.js +3 -0
  60. package/build/private-apis.native.js.map +1 -1
  61. package/build/store/actions.js +195 -1
  62. package/build/store/actions.js.map +1 -1
  63. package/build/store/index.js +10 -1
  64. package/build/store/index.js.map +1 -1
  65. package/build/store/private-actions.js +46 -40
  66. package/build/store/private-actions.js.map +1 -1
  67. package/build/store/private-selectors.js +3 -3
  68. package/build/store/private-selectors.js.map +1 -1
  69. package/build/store/reducer.js +22 -8
  70. package/build/store/reducer.js.map +1 -1
  71. package/build/store/selectors.js +6 -4
  72. package/build/store/selectors.js.map +1 -1
  73. package/build-module/components/block-heading-level-dropdown/heading-level-icon.js +9 -2
  74. package/build-module/components/block-heading-level-dropdown/heading-level-icon.js.map +1 -1
  75. package/build-module/components/block-heading-level-dropdown/index.native.js +4 -3
  76. package/build-module/components/block-heading-level-dropdown/index.native.js.map +1 -1
  77. package/build-module/components/block-parent-selector/index.js +7 -5
  78. package/build-module/components/block-parent-selector/index.js.map +1 -1
  79. package/build-module/components/block-removal-warning-modal/index.js +19 -23
  80. package/build-module/components/block-removal-warning-modal/index.js.map +1 -1
  81. package/build-module/components/block-tools/block-contextual-toolbar.js +8 -11
  82. package/build-module/components/block-tools/block-contextual-toolbar.js.map +1 -1
  83. package/build-module/components/global-styles/color-panel.js +1 -1
  84. package/build-module/components/global-styles/color-panel.js.map +1 -1
  85. package/build-module/components/global-styles/hooks.js +2 -2
  86. package/build-module/components/global-styles/hooks.js.map +1 -1
  87. package/build-module/components/global-styles/typography-panel.js +33 -2
  88. package/build-module/components/global-styles/typography-panel.js.map +1 -1
  89. package/build-module/components/index.js +6 -0
  90. package/build-module/components/index.js.map +1 -1
  91. package/build-module/components/inserter/media-tab/hooks.js +2 -21
  92. package/build-module/components/inserter/media-tab/hooks.js.map +1 -1
  93. package/build-module/components/inserter/reusable-block-rename-hint.js +48 -0
  94. package/build-module/components/inserter/reusable-block-rename-hint.js.map +1 -0
  95. package/build-module/components/inserter/reusable-blocks-tab.js +4 -1
  96. package/build-module/components/inserter/reusable-blocks-tab.js.map +1 -1
  97. package/build-module/components/inserter/reusable-blocks-tab.native.js +2 -2
  98. package/build-module/components/inserter/reusable-blocks-tab.native.js.map +1 -1
  99. package/build-module/components/inserter/tabs.native.js +1 -1
  100. package/build-module/components/inserter/tabs.native.js.map +1 -1
  101. package/build-module/components/inserter-draggable-blocks/index.js +9 -2
  102. package/build-module/components/inserter-draggable-blocks/index.js.map +1 -1
  103. package/build-module/components/link-control/constants.js +1 -1
  104. package/build-module/components/link-control/constants.js.map +1 -1
  105. package/build-module/components/link-control/search-create-button.js +7 -20
  106. package/build-module/components/link-control/search-create-button.js.map +1 -1
  107. package/build-module/components/link-control/search-item.js +14 -28
  108. package/build-module/components/link-control/search-item.js.map +1 -1
  109. package/build-module/components/link-control/search-results.js +3 -3
  110. package/build-module/components/link-control/search-results.js.map +1 -1
  111. package/build-module/components/list-view/appender.js +2 -6
  112. package/build-module/components/list-view/appender.js.map +1 -1
  113. package/build-module/components/provider/index.js +5 -2
  114. package/build-module/components/provider/index.js.map +1 -1
  115. package/build-module/components/writing-flow/use-tab-nav.js +8 -26
  116. package/build-module/components/writing-flow/use-tab-nav.js.map +1 -1
  117. package/build-module/components/writing-mode-control/index.js +57 -0
  118. package/build-module/components/writing-mode-control/index.js.map +1 -0
  119. package/build-module/hooks/behaviors.js +26 -20
  120. package/build-module/hooks/behaviors.js.map +1 -1
  121. package/build-module/hooks/supports.js +7 -1
  122. package/build-module/hooks/supports.js.map +1 -1
  123. package/build-module/hooks/typography.js +2 -1
  124. package/build-module/hooks/typography.js.map +1 -1
  125. package/build-module/hooks/utils.js +4 -2
  126. package/build-module/hooks/utils.js.map +1 -1
  127. package/build-module/private-apis.js +2 -0
  128. package/build-module/private-apis.js.map +1 -1
  129. package/build-module/private-apis.native.js +2 -0
  130. package/build-module/private-apis.native.js.map +1 -1
  131. package/build-module/store/actions.js +191 -1
  132. package/build-module/store/actions.js.map +1 -1
  133. package/build-module/store/index.js +10 -1
  134. package/build-module/store/index.js.map +1 -1
  135. package/build-module/store/private-actions.js +45 -36
  136. package/build-module/store/private-actions.js.map +1 -1
  137. package/build-module/store/private-selectors.js +2 -2
  138. package/build-module/store/private-selectors.js.map +1 -1
  139. package/build-module/store/reducer.js +22 -8
  140. package/build-module/store/reducer.js.map +1 -1
  141. package/build-module/store/selectors.js +6 -4
  142. package/build-module/store/selectors.js.map +1 -1
  143. package/build-style/style-rtl.css +88 -81
  144. package/build-style/style.css +88 -81
  145. package/package.json +31 -31
  146. package/src/components/block-draggable/style.scss +1 -0
  147. package/src/components/block-heading-level-dropdown/heading-level-icon.js +6 -1
  148. package/src/components/block-heading-level-dropdown/index.native.js +8 -4
  149. package/src/components/block-inspector/style.scss +2 -1
  150. package/src/components/block-parent-selector/index.js +13 -8
  151. package/src/components/block-removal-warning-modal/index.js +16 -27
  152. package/src/components/block-tools/block-contextual-toolbar.js +5 -11
  153. package/src/components/block-tools/style.scss +69 -26
  154. package/src/components/font-family/README.md +71 -0
  155. package/src/components/global-styles/color-panel.js +1 -1
  156. package/src/components/global-styles/hooks.js +2 -0
  157. package/src/components/global-styles/typography-panel.js +40 -0
  158. package/src/components/index.js +6 -0
  159. package/src/components/inserter/media-tab/hooks.js +2 -22
  160. package/src/components/inserter/reusable-block-rename-hint.js +52 -0
  161. package/src/components/inserter/reusable-blocks-tab.js +4 -0
  162. package/src/components/inserter/reusable-blocks-tab.native.js +2 -2
  163. package/src/components/inserter/style.scss +28 -0
  164. package/src/components/inserter/tabs.native.js +5 -1
  165. package/src/components/inserter-draggable-blocks/index.js +13 -2
  166. package/src/components/link-control/constants.js +1 -1
  167. package/src/components/link-control/search-create-button.js +8 -26
  168. package/src/components/link-control/search-item.js +21 -43
  169. package/src/components/link-control/search-results.js +48 -46
  170. package/src/components/link-control/style.scss +18 -68
  171. package/src/components/link-control/test/index.js +6 -7
  172. package/src/components/list-view/appender.js +5 -6
  173. package/src/components/panel-color-settings/README.md +98 -0
  174. package/src/components/provider/index.js +9 -2
  175. package/src/components/recursion-provider/README.md +101 -0
  176. package/src/components/writing-flow/use-tab-nav.js +10 -33
  177. package/src/components/writing-mode-control/index.js +68 -0
  178. package/src/components/writing-mode-control/style.scss +18 -0
  179. package/src/hooks/behaviors.js +25 -16
  180. package/src/hooks/supports.js +7 -0
  181. package/src/hooks/typography.js +2 -0
  182. package/src/hooks/utils.js +3 -0
  183. package/src/private-apis.js +2 -0
  184. package/src/private-apis.native.js +2 -0
  185. package/src/store/actions.js +194 -1
  186. package/src/store/index.js +10 -0
  187. package/src/store/private-actions.js +39 -39
  188. package/src/store/private-selectors.js +2 -2
  189. package/src/store/reducer.js +22 -8
  190. package/src/store/selectors.js +9 -6
  191. package/src/store/test/actions.js +111 -0
  192. package/src/store/test/private-actions.js +56 -0
@@ -160,7 +160,8 @@
160
160
  margin-bottom: 8px;
161
161
  }
162
162
  .block-editor-block-inspector .components-focal-point-picker-control .components-base-control,
163
- .block-editor-block-inspector .components-query-controls .components-base-control {
163
+ .block-editor-block-inspector .components-query-controls .components-base-control,
164
+ .block-editor-block-inspector .components-range-control .components-base-control {
164
165
  margin-bottom: 0;
165
166
  }
166
167
  .block-editor-block-inspector .components-panel__body {
@@ -333,42 +334,72 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
333
334
  }
334
335
  @media (min-width: 782px) {
335
336
  .block-editor-block-contextual-toolbar.is-fixed {
336
- margin-right: 64px;
337
+ margin-right: 180px;
337
338
  position: fixed;
338
- top: 40px;
339
+ top: 39px;
339
340
  min-height: initial;
340
341
  border-bottom: none;
341
342
  display: flex;
342
343
  }
343
344
  .block-editor-block-contextual-toolbar.is-fixed.is-collapsed {
344
345
  width: initial;
345
- margin-right: 216px;
346
346
  }
347
347
  .is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
348
- margin-right: 120px;
349
- top: 8px;
348
+ margin-right: 240px;
349
+ top: 7px;
350
350
  }
351
351
  .is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed.is-collapsed {
352
352
  width: initial;
353
- margin-right: 280px;
353
+ }
354
+ .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar.is-showing-movers {
355
+ flex-grow: initial;
356
+ width: initial;
357
+ }
358
+ .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar.is-showing-movers::before {
359
+ content: "";
360
+ width: 1px;
361
+ height: 24px;
362
+ margin-top: 12px;
363
+ margin-left: 0;
364
+ background-color: #ddd;
365
+ position: relative;
366
+ right: -2px;
367
+ top: -1px;
354
368
  }
355
369
  .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-collapse-fixed-toolbar {
356
370
  border: none;
357
371
  }
358
- .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-collapse-fixed-toolbar::after {
372
+ .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-collapse-fixed-toolbar .components-button.has-icon svg {
373
+ display: none;
374
+ }
375
+ .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-collapse-fixed-toolbar .components-button.has-icon::after {
376
+ content: attr(aria-label);
377
+ font-size: 12px;
378
+ }
379
+ .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-collapse-fixed-toolbar::before {
359
380
  content: "";
360
381
  width: 1px;
361
382
  height: 24px;
362
383
  margin-top: 12px;
363
- margin-bottom: 12px;
384
+ margin-left: 8px;
364
385
  background-color: #ddd;
365
- position: absolute;
366
- right: 44px;
386
+ position: relative;
387
+ right: 0;
367
388
  top: -1px;
368
389
  }
369
390
  .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-expand-fixed-toolbar {
370
391
  border: none;
371
392
  }
393
+ .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-expand-fixed-toolbar {
394
+ width: 256px;
395
+ }
396
+ .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-expand-fixed-toolbar .components-button.has-icon svg {
397
+ display: none;
398
+ }
399
+ .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-expand-fixed-toolbar .components-button.has-icon::after {
400
+ content: attr(aria-label);
401
+ font-size: 12px;
402
+ }
372
403
  .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-expand-fixed-toolbar::before {
373
404
  content: "";
374
405
  width: 1px;
@@ -376,20 +407,15 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
376
407
  margin-bottom: 12px;
377
408
  background-color: #ddd;
378
409
  position: relative;
379
- right: -12px;
410
+ right: -8px;
380
411
  height: 24px;
412
+ top: -1px;
381
413
  }
382
414
  .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed {
383
- margin-right: 64px;
384
- }
385
- .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed.is-collapsed {
386
- margin-right: 384px;
415
+ margin-right: 80px;
387
416
  }
388
417
  .is-fullscreen-mode .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed {
389
- margin-right: 128px;
390
- }
391
- .is-fullscreen-mode .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed.is-collapsed {
392
- margin-right: 448px;
418
+ margin-right: 144px;
393
419
  }
394
420
  .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed .block-editor-block-parent-selector .block-editor-block-parent-selector__button::after {
395
421
  right: 0;
@@ -447,7 +473,7 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
447
473
  }
448
474
  @media (min-width: 960px) {
449
475
  .block-editor-block-contextual-toolbar.is-fixed {
450
- width: initial;
476
+ width: calc(100% - 240px - 256px);
451
477
  }
452
478
  }
453
479
 
@@ -768,6 +794,7 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
768
794
  padding: 0 13px;
769
795
  -webkit-user-select: none;
770
796
  user-select: none;
797
+ width: max-content;
771
798
  }
772
799
  .block-editor-block-draggable-chip svg {
773
800
  fill: currentColor;
@@ -1872,6 +1899,7 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
1872
1899
  }
1873
1900
 
1874
1901
  .block-editor-link-control__search-input-wrapper {
1902
+ margin-bottom: 8px;
1875
1903
  position: relative;
1876
1904
  }
1877
1905
 
@@ -1972,8 +2000,8 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
1972
2000
  }
1973
2001
 
1974
2002
  .block-editor-link-control__search-results {
1975
- margin: 0;
1976
- padding: 8px 16px 8px;
2003
+ margin-top: -16px;
2004
+ padding: 8px;
1977
2005
  max-height: 200px;
1978
2006
  overflow-y: auto;
1979
2007
  }
@@ -1981,35 +2009,23 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
1981
2009
  opacity: 0.2;
1982
2010
  }
1983
2011
 
1984
- .block-editor-link-control__search-item {
1985
- position: relative;
1986
- display: flex;
1987
- align-items: flex-start;
1988
- font-size: 13px;
1989
- cursor: pointer;
1990
- background: #fff;
1991
- width: 100%;
1992
- border: none;
1993
- text-align: right;
1994
- padding: 12px 16px;
1995
- border-radius: 2px;
2012
+ .block-editor-link-control__search-item.components-button.components-menu-item__button {
1996
2013
  height: auto;
2014
+ text-align: right;
1997
2015
  }
1998
- .block-editor-link-control__search-item:hover, .block-editor-link-control__search-item:focus {
1999
- background-color: #f0f0f0;
2000
- }
2001
- .block-editor-link-control__search-item:hover .block-editor-link-control__search-item-type, .block-editor-link-control__search-item:focus .block-editor-link-control__search-item-type {
2002
- background: #fff;
2016
+ .block-editor-link-control__search-item .components-menu-item__item {
2017
+ overflow: hidden;
2018
+ text-overflow: ellipsis;
2019
+ display: inline-block;
2003
2020
  }
2004
- .block-editor-link-control__search-item:focus:not(:disabled) {
2005
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color) inset;
2021
+ .block-editor-link-control__search-item .components-menu-item__shortcut {
2022
+ color: #757575;
2023
+ text-transform: capitalize;
2024
+ white-space: nowrap;
2006
2025
  }
2007
- .block-editor-link-control__search-item.is-selected {
2026
+ .block-editor-link-control__search-item[aria-selected] {
2008
2027
  background: #f0f0f0;
2009
2028
  }
2010
- .block-editor-link-control__search-item.is-selected .block-editor-link-control__search-item-type {
2011
- background: #fff;
2012
- }
2013
2029
  .block-editor-link-control__search-item.is-current {
2014
2030
  flex-direction: column;
2015
2031
  background: transparent;
@@ -2038,7 +2054,6 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
2038
2054
  }
2039
2055
  .block-editor-link-control__search-item .block-editor-link-control__search-item-icon {
2040
2056
  position: relative;
2041
- top: 0.2em;
2042
2057
  margin-left: 8px;
2043
2058
  max-height: 24px;
2044
2059
  flex-shrink: 0;
@@ -2054,17 +2069,6 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
2054
2069
  width: 32px;
2055
2070
  max-height: 32px;
2056
2071
  }
2057
- .block-editor-link-control__search-item .block-editor-link-control__search-item-info,
2058
- .block-editor-link-control__search-item .block-editor-link-control__search-item-title {
2059
- overflow: hidden;
2060
- text-overflow: ellipsis;
2061
- }
2062
- .block-editor-link-control__search-item .block-editor-link-control__search-item-info .components-external-link__icon,
2063
- .block-editor-link-control__search-item .block-editor-link-control__search-item-title .components-external-link__icon {
2064
- position: absolute;
2065
- left: 0;
2066
- margin-top: 0;
2067
- }
2068
2072
  .block-editor-link-control__search-item .block-editor-link-control__search-item-title {
2069
2073
  display: block;
2070
2074
  margin-bottom: 0.2em;
@@ -2082,25 +2086,6 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
2082
2086
  .block-editor-link-control__search-item .block-editor-link-control__search-item-title svg {
2083
2087
  display: none;
2084
2088
  }
2085
- .block-editor-link-control__search-item .block-editor-link-control__search-item-info {
2086
- display: block;
2087
- color: #757575;
2088
- font-size: 0.9em;
2089
- line-height: 1.3;
2090
- }
2091
- .block-editor-link-control__search-item .block-editor-link-control__search-item-error-notice {
2092
- font-style: italic;
2093
- font-size: 1.1em;
2094
- }
2095
- .block-editor-link-control__search-item .block-editor-link-control__search-item-type {
2096
- display: block;
2097
- padding: 3px 6px;
2098
- margin-right: auto;
2099
- font-size: 0.9em;
2100
- background-color: #f0f0f0;
2101
- border-radius: 2px;
2102
- white-space: nowrap;
2103
- }
2104
2089
  .block-editor-link-control__search-item .block-editor-link-control__search-item-description {
2105
2090
  padding-top: 12px;
2106
2091
  margin: 0;
@@ -2215,10 +2200,6 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
2215
2200
  top: 0;
2216
2201
  }
2217
2202
 
2218
- .block-editor-link-control__search-results div[role=menu] > .block-editor-link-control__search-item.block-editor-link-control__search-item {
2219
- padding: 10px;
2220
- }
2221
-
2222
2203
  .block-editor-link-control__drawer {
2223
2204
  display: flex;
2224
2205
  order: 30;
@@ -4114,6 +4095,32 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
4114
4095
  margin: 0;
4115
4096
  }
4116
4097
 
4098
+ .block-editor-inserter__hint {
4099
+ margin: 16px 16px 0;
4100
+ }
4101
+
4102
+ .reusable-blocks-menu-items__rename-hint {
4103
+ align-items: top;
4104
+ background: #f0f0f0;
4105
+ border-radius: 2px;
4106
+ color: #1e1e1e;
4107
+ display: flex;
4108
+ flex-direction: row;
4109
+ max-width: 380px;
4110
+ }
4111
+
4112
+ .reusable-blocks-menu-items__rename-hint-content {
4113
+ margin: 12px 12px 12px 0;
4114
+ }
4115
+
4116
+ .reusable-blocks-menu-items__rename-hint-dismiss {
4117
+ margin: 4px 0 4px 4px;
4118
+ }
4119
+
4120
+ .components-menu-group .reusable-blocks-menu-items__rename-hint {
4121
+ margin: 0;
4122
+ }
4123
+
4117
4124
  .block-editor-post-preview__dropdown {
4118
4125
  padding: 0;
4119
4126
  }
@@ -160,7 +160,8 @@
160
160
  margin-bottom: 8px;
161
161
  }
162
162
  .block-editor-block-inspector .components-focal-point-picker-control .components-base-control,
163
- .block-editor-block-inspector .components-query-controls .components-base-control {
163
+ .block-editor-block-inspector .components-query-controls .components-base-control,
164
+ .block-editor-block-inspector .components-range-control .components-base-control {
164
165
  margin-bottom: 0;
165
166
  }
166
167
  .block-editor-block-inspector .components-panel__body {
@@ -333,42 +334,72 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
333
334
  }
334
335
  @media (min-width: 782px) {
335
336
  .block-editor-block-contextual-toolbar.is-fixed {
336
- margin-left: 64px;
337
+ margin-left: 180px;
337
338
  position: fixed;
338
- top: 40px;
339
+ top: 39px;
339
340
  min-height: initial;
340
341
  border-bottom: none;
341
342
  display: flex;
342
343
  }
343
344
  .block-editor-block-contextual-toolbar.is-fixed.is-collapsed {
344
345
  width: initial;
345
- margin-left: 216px;
346
346
  }
347
347
  .is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
348
- margin-left: 120px;
349
- top: 8px;
348
+ margin-left: 240px;
349
+ top: 7px;
350
350
  }
351
351
  .is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed.is-collapsed {
352
352
  width: initial;
353
- margin-left: 280px;
353
+ }
354
+ .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar.is-showing-movers {
355
+ flex-grow: initial;
356
+ width: initial;
357
+ }
358
+ .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar.is-showing-movers::before {
359
+ content: "";
360
+ width: 1px;
361
+ height: 24px;
362
+ margin-top: 12px;
363
+ margin-right: 0;
364
+ background-color: #ddd;
365
+ position: relative;
366
+ left: -2px;
367
+ top: -1px;
354
368
  }
355
369
  .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-collapse-fixed-toolbar {
356
370
  border: none;
357
371
  }
358
- .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-collapse-fixed-toolbar::after {
372
+ .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-collapse-fixed-toolbar .components-button.has-icon svg {
373
+ display: none;
374
+ }
375
+ .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-collapse-fixed-toolbar .components-button.has-icon::after {
376
+ content: attr(aria-label);
377
+ font-size: 12px;
378
+ }
379
+ .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-collapse-fixed-toolbar::before {
359
380
  content: "";
360
381
  width: 1px;
361
382
  height: 24px;
362
383
  margin-top: 12px;
363
- margin-bottom: 12px;
384
+ margin-right: 8px;
364
385
  background-color: #ddd;
365
- position: absolute;
366
- left: 44px;
386
+ position: relative;
387
+ left: 0;
367
388
  top: -1px;
368
389
  }
369
390
  .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-expand-fixed-toolbar {
370
391
  border: none;
371
392
  }
393
+ .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-expand-fixed-toolbar {
394
+ width: 256px;
395
+ }
396
+ .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-expand-fixed-toolbar .components-button.has-icon svg {
397
+ display: none;
398
+ }
399
+ .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-expand-fixed-toolbar .components-button.has-icon::after {
400
+ content: attr(aria-label);
401
+ font-size: 12px;
402
+ }
372
403
  .block-editor-block-contextual-toolbar.is-fixed > .block-editor-block-toolbar__group-expand-fixed-toolbar::before {
373
404
  content: "";
374
405
  width: 1px;
@@ -376,20 +407,15 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
376
407
  margin-bottom: 12px;
377
408
  background-color: #ddd;
378
409
  position: relative;
379
- left: -12px;
410
+ left: -8px;
380
411
  height: 24px;
412
+ top: -1px;
381
413
  }
382
414
  .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed {
383
- margin-left: 64px;
384
- }
385
- .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed.is-collapsed {
386
- margin-left: 384px;
415
+ margin-left: 80px;
387
416
  }
388
417
  .is-fullscreen-mode .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed {
389
- margin-left: 128px;
390
- }
391
- .is-fullscreen-mode .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed.is-collapsed {
392
- margin-left: 448px;
418
+ margin-left: 144px;
393
419
  }
394
420
  .show-icon-labels .block-editor-block-contextual-toolbar.is-fixed .block-editor-block-parent-selector .block-editor-block-parent-selector__button::after {
395
421
  left: 0;
@@ -447,7 +473,7 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
447
473
  }
448
474
  @media (min-width: 960px) {
449
475
  .block-editor-block-contextual-toolbar.is-fixed {
450
- width: initial;
476
+ width: calc(100% - 240px - 256px);
451
477
  }
452
478
  }
453
479
 
@@ -768,6 +794,7 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
768
794
  padding: 0 13px;
769
795
  -webkit-user-select: none;
770
796
  user-select: none;
797
+ width: max-content;
771
798
  }
772
799
  .block-editor-block-draggable-chip svg {
773
800
  fill: currentColor;
@@ -1873,6 +1900,7 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
1873
1900
  }
1874
1901
 
1875
1902
  .block-editor-link-control__search-input-wrapper {
1903
+ margin-bottom: 8px;
1876
1904
  position: relative;
1877
1905
  }
1878
1906
 
@@ -1973,8 +2001,8 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
1973
2001
  }
1974
2002
 
1975
2003
  .block-editor-link-control__search-results {
1976
- margin: 0;
1977
- padding: 8px 16px 8px;
2004
+ margin-top: -16px;
2005
+ padding: 8px;
1978
2006
  max-height: 200px;
1979
2007
  overflow-y: auto;
1980
2008
  }
@@ -1982,35 +2010,23 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
1982
2010
  opacity: 0.2;
1983
2011
  }
1984
2012
 
1985
- .block-editor-link-control__search-item {
1986
- position: relative;
1987
- display: flex;
1988
- align-items: flex-start;
1989
- font-size: 13px;
1990
- cursor: pointer;
1991
- background: #fff;
1992
- width: 100%;
1993
- border: none;
1994
- text-align: left;
1995
- padding: 12px 16px;
1996
- border-radius: 2px;
2013
+ .block-editor-link-control__search-item.components-button.components-menu-item__button {
1997
2014
  height: auto;
2015
+ text-align: left;
1998
2016
  }
1999
- .block-editor-link-control__search-item:hover, .block-editor-link-control__search-item:focus {
2000
- background-color: #f0f0f0;
2001
- }
2002
- .block-editor-link-control__search-item:hover .block-editor-link-control__search-item-type, .block-editor-link-control__search-item:focus .block-editor-link-control__search-item-type {
2003
- background: #fff;
2017
+ .block-editor-link-control__search-item .components-menu-item__item {
2018
+ overflow: hidden;
2019
+ text-overflow: ellipsis;
2020
+ display: inline-block;
2004
2021
  }
2005
- .block-editor-link-control__search-item:focus:not(:disabled) {
2006
- box-shadow: 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color) inset;
2022
+ .block-editor-link-control__search-item .components-menu-item__shortcut {
2023
+ color: #757575;
2024
+ text-transform: capitalize;
2025
+ white-space: nowrap;
2007
2026
  }
2008
- .block-editor-link-control__search-item.is-selected {
2027
+ .block-editor-link-control__search-item[aria-selected] {
2009
2028
  background: #f0f0f0;
2010
2029
  }
2011
- .block-editor-link-control__search-item.is-selected .block-editor-link-control__search-item-type {
2012
- background: #fff;
2013
- }
2014
2030
  .block-editor-link-control__search-item.is-current {
2015
2031
  flex-direction: column;
2016
2032
  background: transparent;
@@ -2039,7 +2055,6 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
2039
2055
  }
2040
2056
  .block-editor-link-control__search-item .block-editor-link-control__search-item-icon {
2041
2057
  position: relative;
2042
- top: 0.2em;
2043
2058
  margin-right: 8px;
2044
2059
  max-height: 24px;
2045
2060
  flex-shrink: 0;
@@ -2055,17 +2070,6 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
2055
2070
  width: 32px;
2056
2071
  max-height: 32px;
2057
2072
  }
2058
- .block-editor-link-control__search-item .block-editor-link-control__search-item-info,
2059
- .block-editor-link-control__search-item .block-editor-link-control__search-item-title {
2060
- overflow: hidden;
2061
- text-overflow: ellipsis;
2062
- }
2063
- .block-editor-link-control__search-item .block-editor-link-control__search-item-info .components-external-link__icon,
2064
- .block-editor-link-control__search-item .block-editor-link-control__search-item-title .components-external-link__icon {
2065
- position: absolute;
2066
- right: 0;
2067
- margin-top: 0;
2068
- }
2069
2073
  .block-editor-link-control__search-item .block-editor-link-control__search-item-title {
2070
2074
  display: block;
2071
2075
  margin-bottom: 0.2em;
@@ -2083,25 +2087,6 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
2083
2087
  .block-editor-link-control__search-item .block-editor-link-control__search-item-title svg {
2084
2088
  display: none;
2085
2089
  }
2086
- .block-editor-link-control__search-item .block-editor-link-control__search-item-info {
2087
- display: block;
2088
- color: #757575;
2089
- font-size: 0.9em;
2090
- line-height: 1.3;
2091
- }
2092
- .block-editor-link-control__search-item .block-editor-link-control__search-item-error-notice {
2093
- font-style: italic;
2094
- font-size: 1.1em;
2095
- }
2096
- .block-editor-link-control__search-item .block-editor-link-control__search-item-type {
2097
- display: block;
2098
- padding: 3px 6px;
2099
- margin-left: auto;
2100
- font-size: 0.9em;
2101
- background-color: #f0f0f0;
2102
- border-radius: 2px;
2103
- white-space: nowrap;
2104
- }
2105
2090
  .block-editor-link-control__search-item .block-editor-link-control__search-item-description {
2106
2091
  padding-top: 12px;
2107
2092
  margin: 0;
@@ -2216,10 +2201,6 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
2216
2201
  top: 0;
2217
2202
  }
2218
2203
 
2219
- .block-editor-link-control__search-results div[role=menu] > .block-editor-link-control__search-item.block-editor-link-control__search-item {
2220
- padding: 10px;
2221
- }
2222
-
2223
2204
  .block-editor-link-control__drawer {
2224
2205
  display: flex;
2225
2206
  order: 30;
@@ -4115,6 +4096,32 @@ body.is-fullscreen-mode .block-editor-block-contextual-toolbar.is-fixed {
4115
4096
  margin: 0;
4116
4097
  }
4117
4098
 
4099
+ .block-editor-inserter__hint {
4100
+ margin: 16px 16px 0;
4101
+ }
4102
+
4103
+ .reusable-blocks-menu-items__rename-hint {
4104
+ align-items: top;
4105
+ background: #f0f0f0;
4106
+ border-radius: 2px;
4107
+ color: #1e1e1e;
4108
+ display: flex;
4109
+ flex-direction: row;
4110
+ max-width: 380px;
4111
+ }
4112
+
4113
+ .reusable-blocks-menu-items__rename-hint-content {
4114
+ margin: 12px 0 12px 12px;
4115
+ }
4116
+
4117
+ .reusable-blocks-menu-items__rename-hint-dismiss {
4118
+ margin: 4px 4px 4px 0;
4119
+ }
4120
+
4121
+ .components-menu-group .reusable-blocks-menu-items__rename-hint {
4122
+ margin: 0;
4123
+ }
4124
+
4118
4125
  .block-editor-post-preview__dropdown {
4119
4126
  padding: 0;
4120
4127
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wordpress/block-editor",
3
- "version": "12.3.4",
3
+ "version": "12.5.0",
4
4
  "description": "Generic block editor.",
5
5
  "author": "The WordPress Contributors",
6
6
  "license": "GPL-2.0-or-later",
@@ -34,35 +34,35 @@
34
34
  "@babel/runtime": "^7.16.0",
35
35
  "@emotion/styled": "^11.6.0",
36
36
  "@react-spring/web": "^9.4.5",
37
- "@wordpress/a11y": "^3.35.1",
38
- "@wordpress/api-fetch": "^6.32.1",
39
- "@wordpress/blob": "^3.35.1",
40
- "@wordpress/blocks": "^12.12.2",
41
- "@wordpress/components": "^25.1.4",
42
- "@wordpress/compose": "^6.12.1",
43
- "@wordpress/data": "^9.5.2",
44
- "@wordpress/date": "^4.35.1",
45
- "@wordpress/deprecated": "^3.35.1",
46
- "@wordpress/dom": "^3.35.1",
47
- "@wordpress/element": "^5.12.1",
48
- "@wordpress/escape-html": "^2.35.1",
49
- "@wordpress/hooks": "^3.35.1",
50
- "@wordpress/html-entities": "^3.35.1",
51
- "@wordpress/i18n": "^4.35.1",
52
- "@wordpress/icons": "^9.26.2",
53
- "@wordpress/is-shallow-equal": "^4.35.1",
54
- "@wordpress/keyboard-shortcuts": "^4.12.2",
55
- "@wordpress/keycodes": "^3.35.1",
56
- "@wordpress/notices": "^4.3.2",
57
- "@wordpress/preferences": "^3.12.4",
58
- "@wordpress/private-apis": "^0.17.1",
59
- "@wordpress/rich-text": "^6.12.2",
60
- "@wordpress/shortcode": "^3.35.1",
61
- "@wordpress/style-engine": "^1.18.1",
62
- "@wordpress/token-list": "^2.35.1",
63
- "@wordpress/url": "^3.36.1",
64
- "@wordpress/warning": "^2.35.1",
65
- "@wordpress/wordcount": "^3.35.1",
37
+ "@wordpress/a11y": "^3.37.0",
38
+ "@wordpress/api-fetch": "^6.34.0",
39
+ "@wordpress/blob": "^3.37.0",
40
+ "@wordpress/blocks": "^12.14.0",
41
+ "@wordpress/components": "^25.3.0",
42
+ "@wordpress/compose": "^6.14.0",
43
+ "@wordpress/data": "^9.7.0",
44
+ "@wordpress/date": "^4.37.0",
45
+ "@wordpress/deprecated": "^3.37.0",
46
+ "@wordpress/dom": "^3.37.0",
47
+ "@wordpress/element": "^5.14.0",
48
+ "@wordpress/escape-html": "^2.37.0",
49
+ "@wordpress/hooks": "^3.37.0",
50
+ "@wordpress/html-entities": "^3.37.0",
51
+ "@wordpress/i18n": "^4.37.0",
52
+ "@wordpress/icons": "^9.28.0",
53
+ "@wordpress/is-shallow-equal": "^4.37.0",
54
+ "@wordpress/keyboard-shortcuts": "^4.14.0",
55
+ "@wordpress/keycodes": "^3.37.0",
56
+ "@wordpress/notices": "^4.5.0",
57
+ "@wordpress/preferences": "^3.14.0",
58
+ "@wordpress/private-apis": "^0.19.0",
59
+ "@wordpress/rich-text": "^6.14.0",
60
+ "@wordpress/shortcode": "^3.37.0",
61
+ "@wordpress/style-engine": "^1.20.0",
62
+ "@wordpress/token-list": "^2.37.0",
63
+ "@wordpress/url": "^3.38.0",
64
+ "@wordpress/warning": "^2.37.0",
65
+ "@wordpress/wordcount": "^3.37.0",
66
66
  "change-case": "^4.1.2",
67
67
  "classnames": "^2.3.1",
68
68
  "colord": "^2.7.0",
@@ -85,5 +85,5 @@
85
85
  "publishConfig": {
86
86
  "access": "public"
87
87
  },
88
- "gitHead": "65fb4cd5187a47ca274c24c04a220bcdb2ddfa67"
88
+ "gitHead": "bcd13d59b22553b3c9dc5869077bff1e864cf9f5"
89
89
  }
@@ -15,6 +15,7 @@
15
15
  height: $block-toolbar-height;
16
16
  padding: 0 ( $grid-unit-15 + $border-width );
17
17
  user-select: none;
18
+ width: max-content;
18
19
 
19
20
  svg {
20
21
  fill: currentColor;