@wordpress/block-editor 8.5.0 → 8.6.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 (274) hide show
  1. package/CHANGELOG.md +2 -0
  2. package/build/components/block-alignment-control/ui.js +1 -1
  3. package/build/components/block-alignment-control/ui.js.map +1 -1
  4. package/build/components/block-content-overlay/index.js +13 -4
  5. package/build/components/block-content-overlay/index.js.map +1 -1
  6. package/build/components/block-list/block.native.js +3 -1
  7. package/build/components/block-list/block.native.js.map +1 -1
  8. package/build/components/block-lock/index.js +8 -0
  9. package/build/components/block-lock/index.js.map +1 -1
  10. package/build/components/block-lock/menu-item.js +5 -20
  11. package/build/components/block-lock/menu-item.js.map +1 -1
  12. package/build/components/block-lock/modal.js +33 -12
  13. package/build/components/block-lock/modal.js.map +1 -1
  14. package/build/components/block-lock/toolbar.js +7 -20
  15. package/build/components/block-lock/toolbar.js.map +1 -1
  16. package/build/components/block-lock/use-block-lock.js +50 -0
  17. package/build/components/block-lock/use-block-lock.js.map +1 -0
  18. package/build/components/block-mover/button.js +4 -4
  19. package/build/components/block-mover/button.js.map +1 -1
  20. package/build/components/block-mover/index.js +39 -65
  21. package/build/components/block-mover/index.js.map +1 -1
  22. package/build/components/block-pattern-setup/index.js +37 -22
  23. package/build/components/block-pattern-setup/index.js.map +1 -1
  24. package/build/components/block-pattern-setup/setup-toolbar.js +1 -1
  25. package/build/components/block-pattern-setup/setup-toolbar.js.map +1 -1
  26. package/build/components/block-popover/inbetween.js +183 -0
  27. package/build/components/block-popover/inbetween.js.map +1 -0
  28. package/build/components/block-popover/index.js +82 -0
  29. package/build/components/block-popover/index.js.map +1 -0
  30. package/build/components/{block-tools → block-popover}/use-popover-scroll.js +4 -1
  31. package/build/components/block-popover/use-popover-scroll.js.map +1 -0
  32. package/build/components/block-preview/auto.js +6 -3
  33. package/build/components/block-preview/auto.js.map +1 -1
  34. package/build/components/block-preview/index.js +4 -2
  35. package/build/components/block-preview/index.js.map +1 -1
  36. package/build/components/block-styles/index.js +1 -10
  37. package/build/components/block-styles/index.js.map +1 -1
  38. package/build/components/block-switcher/index.js +7 -2
  39. package/build/components/block-switcher/index.js.map +1 -1
  40. package/build/components/block-tools/back-compat.js +2 -2
  41. package/build/components/block-tools/back-compat.js.map +1 -1
  42. package/build/components/block-tools/block-selection-button.js +4 -2
  43. package/build/components/block-tools/block-selection-button.js.map +1 -1
  44. package/build/components/block-tools/index.js +5 -5
  45. package/build/components/block-tools/index.js.map +1 -1
  46. package/build/components/block-tools/insertion-point.js +14 -121
  47. package/build/components/block-tools/insertion-point.js.map +1 -1
  48. package/build/components/block-tools/{block-popover.js → selected-block-popover.js} +25 -108
  49. package/build/components/block-tools/selected-block-popover.js.map +1 -0
  50. package/build/components/copy-handler/index.js +44 -9
  51. package/build/components/copy-handler/index.js.map +1 -1
  52. package/build/components/duotone-control/index.js +5 -1
  53. package/build/components/duotone-control/index.js.map +1 -1
  54. package/build/components/inserter/index.native.js +30 -8
  55. package/build/components/inserter/index.native.js.map +1 -1
  56. package/build/components/link-control/index.js +6 -7
  57. package/build/components/link-control/index.js.map +1 -1
  58. package/build/components/list-view/block-select-button.js +4 -10
  59. package/build/components/list-view/block-select-button.js.map +1 -1
  60. package/build/components/list-view/block.js +13 -2
  61. package/build/components/list-view/block.js.map +1 -1
  62. package/build/components/rich-text/index.js +0 -5
  63. package/build/components/rich-text/index.js.map +1 -1
  64. package/build/components/rich-text/index.native.js +0 -4
  65. package/build/components/rich-text/index.native.js.map +1 -1
  66. package/build/components/use-block-display-information/index.js +3 -1
  67. package/build/components/use-block-display-information/index.js.map +1 -1
  68. package/build/hooks/border.js +468 -44
  69. package/build/hooks/border.js.map +1 -1
  70. package/build/hooks/duotone.js +66 -16
  71. package/build/hooks/duotone.js.map +1 -1
  72. package/build/hooks/index.js +8 -2
  73. package/build/hooks/index.js.map +1 -1
  74. package/build/hooks/use-border-props.js +22 -32
  75. package/build/hooks/use-border-props.js.map +1 -1
  76. package/build/index.js +7 -0
  77. package/build/index.js.map +1 -1
  78. package/build/store/actions.js +36 -31
  79. package/build/store/actions.js.map +1 -1
  80. package/build/store/reducer.js +0 -26
  81. package/build/store/reducer.js.map +1 -1
  82. package/build/store/selectors.js +131 -6
  83. package/build/store/selectors.js.map +1 -1
  84. package/build/store/utils.js +27 -0
  85. package/build/store/utils.js.map +1 -0
  86. package/build-module/components/block-alignment-control/ui.js +2 -2
  87. package/build-module/components/block-alignment-control/ui.js.map +1 -1
  88. package/build-module/components/block-content-overlay/index.js +13 -4
  89. package/build-module/components/block-content-overlay/index.js.map +1 -1
  90. package/build-module/components/block-list/block.native.js +3 -1
  91. package/build-module/components/block-list/block.native.js.map +1 -1
  92. package/build-module/components/block-lock/index.js +1 -0
  93. package/build-module/components/block-lock/index.js.map +1 -1
  94. package/build-module/components/block-lock/menu-item.js +4 -18
  95. package/build-module/components/block-lock/menu-item.js.map +1 -1
  96. package/build-module/components/block-lock/modal.js +31 -12
  97. package/build-module/components/block-lock/modal.js.map +1 -1
  98. package/build-module/components/block-lock/toolbar.js +6 -18
  99. package/build-module/components/block-lock/toolbar.js.map +1 -1
  100. package/build-module/components/block-lock/use-block-lock.js +41 -0
  101. package/build-module/components/block-lock/use-block-lock.js.map +1 -0
  102. package/build-module/components/block-mover/button.js +5 -5
  103. package/build-module/components/block-mover/button.js.map +1 -1
  104. package/build-module/components/block-mover/index.js +38 -63
  105. package/build-module/components/block-mover/index.js.map +1 -1
  106. package/build-module/components/block-pattern-setup/index.js +39 -24
  107. package/build-module/components/block-pattern-setup/index.js.map +1 -1
  108. package/build-module/components/block-pattern-setup/setup-toolbar.js +1 -1
  109. package/build-module/components/block-pattern-setup/setup-toolbar.js.map +1 -1
  110. package/build-module/components/block-popover/inbetween.js +165 -0
  111. package/build-module/components/block-popover/inbetween.js.map +1 -0
  112. package/build-module/components/block-popover/index.js +67 -0
  113. package/build-module/components/block-popover/index.js.map +1 -0
  114. package/build-module/components/{block-tools → block-popover}/use-popover-scroll.js +3 -1
  115. package/build-module/components/block-popover/use-popover-scroll.js.map +1 -0
  116. package/build-module/components/block-preview/auto.js +6 -3
  117. package/build-module/components/block-preview/auto.js.map +1 -1
  118. package/build-module/components/block-preview/index.js +4 -2
  119. package/build-module/components/block-preview/index.js.map +1 -1
  120. package/build-module/components/block-styles/index.js +1 -9
  121. package/build-module/components/block-styles/index.js.map +1 -1
  122. package/build-module/components/block-switcher/index.js +7 -2
  123. package/build-module/components/block-switcher/index.js.map +1 -1
  124. package/build-module/components/block-tools/back-compat.js +1 -1
  125. package/build-module/components/block-tools/back-compat.js.map +1 -1
  126. package/build-module/components/block-tools/block-selection-button.js +3 -2
  127. package/build-module/components/block-tools/block-selection-button.js.map +1 -1
  128. package/build-module/components/block-tools/index.js +3 -3
  129. package/build-module/components/block-tools/index.js.map +1 -1
  130. package/build-module/components/block-tools/insertion-point.js +16 -121
  131. package/build-module/components/block-tools/insertion-point.js.map +1 -1
  132. package/build-module/components/block-tools/{block-popover.js → selected-block-popover.js} +25 -105
  133. package/build-module/components/block-tools/selected-block-popover.js.map +1 -0
  134. package/build-module/components/copy-handler/index.js +44 -9
  135. package/build-module/components/copy-handler/index.js.map +1 -1
  136. package/build-module/components/duotone-control/index.js +4 -1
  137. package/build-module/components/duotone-control/index.js.map +1 -1
  138. package/build-module/components/inserter/index.native.js +31 -10
  139. package/build-module/components/inserter/index.native.js.map +1 -1
  140. package/build-module/components/link-control/index.js +6 -7
  141. package/build-module/components/link-control/index.js.map +1 -1
  142. package/build-module/components/list-view/block-select-button.js +4 -9
  143. package/build-module/components/list-view/block-select-button.js.map +1 -1
  144. package/build-module/components/list-view/block.js +13 -2
  145. package/build-module/components/list-view/block.js.map +1 -1
  146. package/build-module/components/rich-text/index.js +0 -4
  147. package/build-module/components/rich-text/index.js.map +1 -1
  148. package/build-module/components/rich-text/index.native.js +0 -4
  149. package/build-module/components/rich-text/index.native.js.map +1 -1
  150. package/build-module/components/use-block-display-information/index.js +3 -1
  151. package/build-module/components/use-block-display-information/index.js.map +1 -1
  152. package/build-module/hooks/border.js +458 -44
  153. package/build-module/hooks/border.js.map +1 -1
  154. package/build-module/hooks/duotone.js +63 -16
  155. package/build-module/hooks/duotone.js.map +1 -1
  156. package/build-module/hooks/index.js +2 -1
  157. package/build-module/hooks/index.js.map +1 -1
  158. package/build-module/hooks/use-border-props.js +21 -30
  159. package/build-module/hooks/use-border-props.js.map +1 -1
  160. package/build-module/index.js +1 -1
  161. package/build-module/index.js.map +1 -1
  162. package/build-module/store/actions.js +19 -16
  163. package/build-module/store/actions.js.map +1 -1
  164. package/build-module/store/reducer.js +0 -24
  165. package/build-module/store/reducer.js.map +1 -1
  166. package/build-module/store/selectors.js +120 -5
  167. package/build-module/store/selectors.js.map +1 -1
  168. package/build-module/store/utils.js +20 -0
  169. package/build-module/store/utils.js.map +1 -0
  170. package/build-style/style-rtl.css +145 -272
  171. package/build-style/style.css +145 -272
  172. package/package.json +28 -28
  173. package/src/components/block-alignment-control/ui.js +2 -2
  174. package/src/components/block-content-overlay/index.js +19 -2
  175. package/src/components/block-list/block.native.js +2 -0
  176. package/src/components/block-lock/index.js +1 -0
  177. package/src/components/block-lock/menu-item.js +3 -23
  178. package/src/components/block-lock/modal.js +37 -13
  179. package/src/components/block-lock/style.scss +1 -2
  180. package/src/components/block-lock/toolbar.js +4 -21
  181. package/src/components/block-lock/use-block-lock.js +45 -0
  182. package/src/components/block-mover/button.js +5 -7
  183. package/src/components/block-mover/index.js +37 -60
  184. package/src/components/block-mover/stories/index.js +110 -0
  185. package/src/components/block-mover/style.scss +48 -138
  186. package/src/components/block-pattern-setup/index.js +84 -59
  187. package/src/components/block-pattern-setup/setup-toolbar.js +3 -1
  188. package/src/components/block-pattern-setup/style.scss +32 -26
  189. package/src/components/block-popover/README.md +41 -0
  190. package/src/components/block-popover/inbetween.js +180 -0
  191. package/src/components/block-popover/index.js +73 -0
  192. package/src/components/block-popover/style.scss +24 -0
  193. package/src/components/{block-tools → block-popover}/use-popover-scroll.js +3 -1
  194. package/src/components/block-preview/auto.js +10 -1
  195. package/src/components/block-preview/index.js +2 -0
  196. package/src/components/block-styles/index.js +1 -12
  197. package/src/components/block-switcher/index.js +13 -1
  198. package/src/components/block-switcher/style.scss +4 -4
  199. package/src/components/block-switcher/test/__snapshots__/index.js.snap +15 -13
  200. package/src/components/block-toolbar/style.scss +0 -12
  201. package/src/components/block-tools/back-compat.js +1 -1
  202. package/src/components/block-tools/block-selection-button.js +3 -1
  203. package/src/components/block-tools/index.js +6 -4
  204. package/src/components/block-tools/insertion-point.js +19 -152
  205. package/src/components/block-tools/{block-popover.js → selected-block-popover.js} +24 -116
  206. package/src/components/block-tools/style.scss +11 -123
  207. package/src/components/border-radius-control/style.scss +5 -2
  208. package/src/components/copy-handler/index.js +52 -10
  209. package/src/components/default-block-appender/style.scss +1 -2
  210. package/src/components/duotone-control/index.js +8 -1
  211. package/src/components/gradients/README.md +29 -0
  212. package/src/components/inserter/index.native.js +60 -25
  213. package/src/components/inserter/style.native.scss +24 -3
  214. package/src/components/link-control/index.js +5 -5
  215. package/src/components/list-view/block-select-button.js +2 -10
  216. package/src/components/list-view/block.js +16 -7
  217. package/src/components/navigable-toolbar/README.md +16 -0
  218. package/src/components/rich-text/index.js +0 -2
  219. package/src/components/rich-text/index.native.js +0 -4
  220. package/src/components/use-block-display-information/index.js +2 -0
  221. package/src/hooks/border.js +438 -72
  222. package/src/hooks/border.scss +48 -0
  223. package/src/hooks/duotone.js +98 -62
  224. package/src/hooks/index.js +2 -1
  225. package/src/hooks/use-border-props.js +15 -32
  226. package/src/index.js +1 -0
  227. package/src/store/actions.js +19 -15
  228. package/src/store/reducer.js +0 -21
  229. package/src/store/selectors.js +160 -5
  230. package/src/store/test/actions.js +0 -18
  231. package/src/store/test/reducer.js +0 -19
  232. package/src/store/test/selectors.js +0 -19
  233. package/src/store/utils.js +19 -0
  234. package/src/style.scss +1 -1
  235. package/build/components/block-mobile-toolbar/index.js +0 -42
  236. package/build/components/block-mobile-toolbar/index.js.map +0 -1
  237. package/build/components/block-tools/block-popover.js.map +0 -1
  238. package/build/components/block-tools/use-popover-scroll.js.map +0 -1
  239. package/build/components/list-view/appender.js +0 -93
  240. package/build/components/list-view/appender.js.map +0 -1
  241. package/build/components/list-view/list-item.js +0 -62
  242. package/build/components/list-view/list-item.js.map +0 -1
  243. package/build/components/rich-text/use-caret-in-format.js +0 -43
  244. package/build/components/rich-text/use-caret-in-format.js.map +0 -1
  245. package/build/hooks/border-color.js +0 -302
  246. package/build/hooks/border-color.js.map +0 -1
  247. package/build/hooks/border-style.js +0 -96
  248. package/build/hooks/border-style.js.map +0 -1
  249. package/build/hooks/border-width.js +0 -162
  250. package/build/hooks/border-width.js.map +0 -1
  251. package/build-module/components/block-mobile-toolbar/index.js +0 -31
  252. package/build-module/components/block-mobile-toolbar/index.js.map +0 -1
  253. package/build-module/components/block-tools/block-popover.js.map +0 -1
  254. package/build-module/components/block-tools/use-popover-scroll.js.map +0 -1
  255. package/build-module/components/list-view/appender.js +0 -76
  256. package/build-module/components/list-view/appender.js.map +0 -1
  257. package/build-module/components/list-view/list-item.js +0 -47
  258. package/build-module/components/list-view/list-item.js.map +0 -1
  259. package/build-module/components/rich-text/use-caret-in-format.js +0 -33
  260. package/build-module/components/rich-text/use-caret-in-format.js.map +0 -1
  261. package/build-module/hooks/border-color.js +0 -276
  262. package/build-module/hooks/border-color.js.map +0 -1
  263. package/build-module/hooks/border-style.js +0 -78
  264. package/build-module/hooks/border-style.js.map +0 -1
  265. package/build-module/hooks/border-width.js +0 -143
  266. package/build-module/hooks/border-width.js.map +0 -1
  267. package/src/components/block-mobile-toolbar/index.js +0 -24
  268. package/src/components/block-mobile-toolbar/style.scss +0 -29
  269. package/src/components/list-view/appender.js +0 -82
  270. package/src/components/list-view/list-item.js +0 -59
  271. package/src/components/rich-text/use-caret-in-format.js +0 -28
  272. package/src/hooks/border-color.js +0 -315
  273. package/src/hooks/border-style.js +0 -64
  274. package/src/hooks/border-width.js +0 -139
@@ -502,6 +502,10 @@
502
502
  */
503
503
  .block-editor-block-list__insertion-point {
504
504
  position: absolute;
505
+ top: 0;
506
+ bottom: 0;
507
+ left: 0;
508
+ right: 0;
505
509
  }
506
510
 
507
511
  .block-editor-block-list__insertion-point-indicator {
@@ -541,7 +545,6 @@
541
545
  position: static;
542
546
  }
543
547
 
544
- .block-editor-block-list__empty-block-inserter .block-editor-inserter__toggle.components-button.has-icon,
545
548
  .block-editor-default-block-appender .block-editor-inserter__toggle.components-button.has-icon,
546
549
  .block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button.has-icon,
547
550
  .block-editor-block-list__block-popover-inserter .block-editor-inserter__toggle.components-button.has-icon {
@@ -552,7 +555,6 @@
552
555
  min-width: 24px;
553
556
  height: 24px;
554
557
  }
555
- .block-editor-block-list__empty-block-inserter .block-editor-inserter__toggle.components-button.has-icon:hover,
556
558
  .block-editor-default-block-appender .block-editor-inserter__toggle.components-button.has-icon:hover,
557
559
  .block-editor-block-list__insertion-point-inserter .block-editor-inserter__toggle.components-button.has-icon:hover,
558
560
  .block-editor-block-list__block-popover-inserter .block-editor-inserter__toggle.components-button.has-icon:hover {
@@ -595,30 +597,6 @@
595
597
  .block-editor-block-contextual-toolbar.is-fixed .block-editor-block-toolbar .components-toolbar {
596
598
  border-right-color: #e0e0e0;
597
599
  }
598
- .block-editor-block-contextual-toolbar .block-editor-block-mover-button {
599
- overflow: hidden;
600
- }
601
- .block-editor-block-contextual-toolbar .block-editor-block-mover.is-horizontal .block-editor-block-mover-button.block-editor-block-mover-button {
602
- min-width: 24px;
603
- width: 24px;
604
- }
605
- .block-editor-block-contextual-toolbar .block-editor-block-mover.is-horizontal .block-editor-block-mover-button.block-editor-block-mover-button svg {
606
- min-width: 24px;
607
- }
608
-
609
- .block-editor-block-contextual-toolbar .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover-button:focus::before {
610
- left: 0 !important;
611
- min-width: 0;
612
- width: 100%;
613
- }
614
- @media (min-width: 600px) {
615
- .block-editor-block-contextual-toolbar .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover-button.is-up-button svg {
616
- top: 5px;
617
- }
618
- .block-editor-block-contextual-toolbar .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover-button.is-down-button svg {
619
- bottom: 5px;
620
- }
621
- }
622
600
 
623
601
  /**
624
602
  * Block Label for Navigation/Selection Mode
@@ -673,58 +651,15 @@
673
651
  padding: 0;
674
652
  }
675
653
 
676
- /**
677
- * Popovers.
678
- */
679
- .block-editor-block-list__insertion-point-popover.is-without-arrow {
680
- z-index: 28;
681
- position: absolute;
682
- pointer-events: none;
683
- }
684
- .block-editor-block-list__insertion-point-popover.is-without-arrow * {
685
- pointer-events: none;
686
- }
687
- .block-editor-block-list__insertion-point-popover.is-without-arrow .is-with-inserter {
688
- pointer-events: all;
689
- }
690
- .block-editor-block-list__insertion-point-popover.is-without-arrow .is-with-inserter * {
691
- pointer-events: all;
692
- }
693
- .block-editor-block-list__insertion-point-popover.is-without-arrow .components-popover__content.components-popover__content {
694
- background: none;
695
- border: none;
696
- box-shadow: none;
697
- overflow-y: visible;
698
- margin-left: 0;
699
- }
700
-
701
654
  @keyframes hide-during-dragging {
702
655
  to {
703
656
  position: fixed;
704
657
  transform: translate(9999px, 9999px);
705
658
  }
706
659
  }
707
- .components-popover.block-editor-block-list__block-popover {
708
- z-index: 31;
709
- position: absolute;
710
- }
711
- .components-popover.block-editor-block-list__block-popover .components-popover__content {
712
- margin: 0 !important;
713
- min-width: auto;
714
- width: max-content;
715
- background: none;
716
- border: none;
717
- box-shadow: none;
718
- overflow-y: visible;
719
- pointer-events: none;
720
- }
721
- .components-popover.block-editor-block-list__block-popover .components-popover__content .block-editor-block-list__block-selection-button,
722
- .components-popover.block-editor-block-list__block-popover .components-popover__content .block-editor-block-contextual-toolbar,
723
- .components-popover.block-editor-block-list__block-popover .components-popover__content .block-editor-block-list__empty-block-inserter {
660
+ .components-popover.block-editor-block-list__block-popover .block-editor-block-list__block-selection-button,
661
+ .components-popover.block-editor-block-list__block-popover .block-editor-block-contextual-toolbar {
724
662
  pointer-events: all;
725
- }
726
- .components-popover.block-editor-block-list__block-popover .components-popover__content .block-editor-block-list__block-selection-button,
727
- .components-popover.block-editor-block-list__block-popover .components-popover__content .block-editor-block-contextual-toolbar {
728
663
  margin-top: 12px;
729
664
  margin-bottom: 12px;
730
665
  }
@@ -740,47 +675,6 @@
740
675
  display: none;
741
676
  }
742
677
 
743
- .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot,
744
- .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar,
745
- .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown,
746
- .block-editor-block-toolbar .components-toolbar-group {
747
- padding-left: 6px;
748
- padding-right: 6px;
749
- }
750
- .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot .components-button,
751
- .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot .components-button.has-icon.has-icon,
752
- .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar .components-button,
753
- .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar .components-button.has-icon.has-icon,
754
- .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown .components-button,
755
- .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown .components-button.has-icon.has-icon,
756
- .block-editor-block-toolbar .components-toolbar-group .components-button,
757
- .block-editor-block-toolbar .components-toolbar-group .components-button.has-icon.has-icon {
758
- min-width: 36px;
759
- padding-left: 6px;
760
- padding-right: 6px;
761
- }
762
- .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot .components-button svg,
763
- .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot .components-button.has-icon.has-icon svg,
764
- .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar .components-button svg,
765
- .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar .components-button.has-icon.has-icon svg,
766
- .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown .components-button svg,
767
- .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown .components-button.has-icon.has-icon svg,
768
- .block-editor-block-toolbar .components-toolbar-group .components-button svg,
769
- .block-editor-block-toolbar .components-toolbar-group .components-button.has-icon.has-icon svg {
770
- min-width: 24px;
771
- }
772
- .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot .components-button::before,
773
- .block-editor-block-toolbar > .components-toolbar > .block-editor-block-toolbar__slot .components-button.has-icon.has-icon::before,
774
- .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar .components-button::before,
775
- .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-toolbar .components-button.has-icon.has-icon::before,
776
- .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown .components-button::before,
777
- .block-editor-block-toolbar > .block-editor-block-toolbar__slot > .components-dropdown .components-button.has-icon.has-icon::before,
778
- .block-editor-block-toolbar .components-toolbar-group .components-button::before,
779
- .block-editor-block-toolbar .components-toolbar-group .components-button.has-icon.has-icon::before {
780
- left: 2px;
781
- right: 2px;
782
- }
783
-
784
678
  .is-vertical .block-list-appender {
785
679
  width: 24px;
786
680
  margin-right: auto;
@@ -855,8 +749,7 @@
855
749
  padding-left: 0 !important;
856
750
  }
857
751
  .block-editor-block-lock-toolbar .components-button.has-icon:focus::before {
858
- left: 0 !important;
859
- right: 12px !important;
752
+ right: 8px !important;
860
753
  }
861
754
 
862
755
  .block-editor-block-breadcrumb {
@@ -1085,138 +978,62 @@
1085
978
  content: none !important;
1086
979
  }
1087
980
 
1088
- .block-editor-block-mobile-toolbar {
1089
- display: flex;
1090
- flex-direction: row;
1091
- border-right: 1px solid #ddd;
1092
- }
1093
- .block-editor-block-mobile-toolbar .block-editor-block-mover-button {
1094
- width: 36px;
1095
- height: 36px;
1096
- border-radius: 2px;
1097
- padding: 3px;
1098
- margin: 0;
1099
- justify-content: center;
1100
- align-items: center;
1101
- }
1102
- .block-editor-block-mobile-toolbar .block-editor-block-mover-button .dashicon {
1103
- margin: auto;
1104
- }
1105
- .block-editor-block-mobile-toolbar .block-editor-block-mover {
981
+ .block-editor-block-mover__move-button-container {
1106
982
  display: flex;
1107
- margin-right: auto;
1108
- }
1109
- .block-editor-block-mobile-toolbar .block-editor-block-mover .block-editor-block-mover-button {
1110
- float: left;
1111
- }
1112
-
1113
- .block-editor-block-mover-button__description {
1114
- display: none;
1115
- }
1116
-
1117
- .block-editor-block-mover-button.has-icon {
1118
- padding: 0;
1119
- }
1120
-
1121
- .block-editor-block-mover {
1122
- display: inline-flex;
1123
- flex-direction: row;
1124
- }
1125
- .block-editor-block-mover .block-editor-block-mover__move-button-container,
1126
- .block-editor-block-mover .components-toolbar {
1127
- flex: 1;
1128
- flex-direction: row;
1129
- border-right: none !important;
1130
983
  padding: 0;
984
+ border: none;
1131
985
  }
1132
986
  @media (min-width: 600px) {
1133
- .block-editor-block-mover .block-editor-block-mover__move-button-container,
1134
- .block-editor-block-mover .components-toolbar {
987
+ .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container {
1135
988
  flex-direction: column;
989
+ width: 36px;
1136
990
  }
1137
- }
1138
- .block-editor-block-mover.is-horizontal .block-editor-block-mover__move-button-container, .block-editor-block-mover.is-horizontal .components-toolbar {
1139
- flex-direction: row;
1140
- }
1141
- .block-editor-block-mover .block-editor-block-mover-button.block-editor-block-mover-button {
1142
- padding-right: 0;
1143
- padding-left: 0;
1144
- min-width: 36px;
1145
- }
1146
- @media (min-width: 600px) {
1147
- .block-editor-block-mover .block-editor-block-mover-button {
991
+ .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container > * {
1148
992
  height: 24px;
1149
- width: 42px;
1150
- padding-right: 11px !important;
1151
- padding-left: 6px !important;
993
+ width: 100%;
994
+ min-width: 0 !important;
1152
995
  }
1153
- .block-editor-block-mover .block-editor-block-mover-button.block-editor-block-mover-button {
1154
- min-width: 42px;
996
+ .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container > *::before {
997
+ height: 100%;
998
+ width: 100%;
1155
999
  }
1156
- }
1157
- @media (min-width: 600px) {
1158
- .block-editor-block-mover .block-editor-block-mover-button::before {
1159
- left: 8px !important;
1160
- right: 8px !important;
1000
+ .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container .block-editor-block-mover-button.is-up-button svg {
1001
+ top: 5px;
1002
+ flex-shrink: 0;
1161
1003
  }
1162
- }
1163
- .block-editor-block-mover .block-editor-block-mover__drag-handle {
1164
- width: 24px;
1165
- cursor: grab;
1166
- min-width: 24px !important;
1167
- padding: 0 !important;
1168
- }
1169
- .block-editor-block-mover .block-editor-block-mover__drag-handle:focus::before {
1170
- left: 0 !important;
1171
- right: 0 !important;
1172
- }
1173
- @media (min-width: 600px) {
1174
- .block-editor-block-mover .components-toolbar-group .block-editor-block-mover-button,
1175
- .block-editor-block-mover .components-toolbar .block-editor-block-mover-button {
1176
- margin: 0 auto 0 0;
1004
+ .block-editor-block-mover:not(.is-horizontal) .block-editor-block-mover__move-button-container .block-editor-block-mover-button.is-down-button svg {
1005
+ bottom: 5px;
1006
+ flex-shrink: 0;
1177
1007
  }
1178
- .block-editor-block-mover .components-toolbar-group .block-editor-block-mover-button.is-up-button::before,
1179
- .block-editor-block-mover .components-toolbar .block-editor-block-mover-button.is-up-button::before {
1180
- bottom: 0;
1181
- height: calc(100% - 1px);
1008
+ .block-editor-block-mover.is-horizontal .block-editor-block-mover__move-button-container {
1009
+ width: 48px;
1182
1010
  }
1183
- .block-editor-block-mover .components-toolbar-group .block-editor-block-mover-button.is-down-button::before,
1184
- .block-editor-block-mover .components-toolbar .block-editor-block-mover-button.is-down-button::before {
1185
- top: 0;
1186
- height: calc(100% - 1px);
1011
+ .block-editor-block-mover.is-horizontal .block-editor-block-mover__move-button-container > * {
1012
+ width: 24px;
1013
+ min-width: 0 !important;
1014
+ padding-left: 0 !important;
1015
+ padding-right: 0 !important;
1016
+ overflow: hidden;
1017
+ }
1018
+ .block-editor-block-mover.is-horizontal .block-editor-block-mover__move-button-container > *::before {
1019
+ height: 100%;
1020
+ }
1021
+ .block-editor-block-mover.is-horizontal .block-editor-block-mover__move-button-container .block-editor-block-mover-button.is-up-button svg {
1022
+ left: 5px;
1023
+ }
1024
+ .block-editor-block-mover.is-horizontal .block-editor-block-mover__move-button-container .block-editor-block-mover-button.is-down-button svg {
1025
+ right: 5px;
1187
1026
  }
1188
1027
  }
1189
- .block-editor-block-mover.is-horizontal .block-editor-block-mover-button.has-icon {
1190
- height: 48px;
1191
- width: 24px;
1192
- padding-left: 0;
1193
- padding-right: 0;
1194
- }
1195
- .block-editor-block-mover.is-horizontal .block-editor-block-mover-button.has-icon::before {
1196
- top: 1px;
1197
- bottom: 1px;
1198
- min-width: 0;
1199
- width: auto;
1200
- height: auto;
1201
- }
1202
- .block-editor-block-mover.is-horizontal .block-editor-block-mover-button.is-up-button.has-icon svg {
1203
- margin-left: 0;
1204
- margin-right: -8px;
1205
- margin-bottom: 0;
1206
- }
1207
- .block-editor-block-mover.is-horizontal .block-editor-block-mover-button.is-up-button.has-icon::before {
1208
- left: 0 !important;
1209
- right: 0 !important;
1210
- }
1211
- .block-editor-block-mover.is-horizontal .block-editor-block-mover-button.is-down-button.has-icon svg {
1212
- margin-left: -8px;
1213
- margin-right: 0;
1214
- margin-top: 0;
1215
- }
1216
- .block-editor-block-mover.is-horizontal .block-editor-block-mover-button.is-down-button.has-icon::before {
1217
- left: 0 !important;
1218
- right: 0 !important;
1219
- width: calc(100% + 1px);
1028
+
1029
+ @media (min-width: 600px) {
1030
+ .block-editor-block-mover__drag-handle {
1031
+ width: 24px;
1032
+ min-width: 0 !important;
1033
+ padding-left: 0 !important;
1034
+ padding-right: 0 !important;
1035
+ overflow: hidden;
1036
+ }
1220
1037
  }
1221
1038
 
1222
1039
  .block-editor-block-navigation__container {
@@ -1279,6 +1096,24 @@
1279
1096
  color: var(--wp-admin-theme-color);
1280
1097
  }
1281
1098
 
1099
+ .components-popover.block-editor-block-popover {
1100
+ z-index: 31;
1101
+ position: absolute;
1102
+ }
1103
+ .components-popover.block-editor-block-popover .components-popover__content {
1104
+ margin: 0 !important;
1105
+ min-width: auto;
1106
+ width: max-content;
1107
+ background: none;
1108
+ border: none;
1109
+ box-shadow: none;
1110
+ overflow-y: visible;
1111
+ pointer-events: none;
1112
+ }
1113
+ .components-popover.block-editor-block-popover .components-popover__content > * {
1114
+ pointer-events: all;
1115
+ }
1116
+
1282
1117
  .block-editor-block-preview__container {
1283
1118
  position: relative;
1284
1119
  width: 100%;
@@ -1385,7 +1220,6 @@
1385
1220
 
1386
1221
  .block-editor-block-switcher {
1387
1222
  position: relative;
1388
- padding: 0 6px;
1389
1223
  }
1390
1224
  .block-editor-block-switcher .components-button.components-dropdown-menu__toggle.has-icon.has-icon {
1391
1225
  min-width: 36px;
@@ -1423,11 +1257,12 @@
1423
1257
  }
1424
1258
 
1425
1259
  .components-button.block-editor-block-switcher__no-switcher-icon {
1426
- width: 48px;
1260
+ display: flex;
1427
1261
  }
1428
- .components-button.block-editor-block-switcher__no-switcher-icon .block-editor-blocks-icon {
1262
+ .components-button.block-editor-block-switcher__no-switcher-icon .block-editor-block-icon {
1429
1263
  margin-right: auto;
1430
1264
  margin-left: auto;
1265
+ min-width: 24px !important;
1431
1266
  }
1432
1267
 
1433
1268
  .components-button.block-editor-block-switcher__no-switcher-icon:disabled {
@@ -1525,7 +1360,7 @@
1525
1360
  }
1526
1361
 
1527
1362
  .block-editor-block-contextual-toolbar .components-button.block-editor-block-switcher__no-switcher-icon {
1528
- width: 48px;
1363
+ min-width: 36px;
1529
1364
  }
1530
1365
  .block-editor-block-contextual-toolbar .components-button.block-editor-block-switcher__no-switcher-icon,
1531
1366
  .block-editor-block-contextual-toolbar .components-button.block-editor-block-switcher__toggle {
@@ -1652,39 +1487,41 @@
1652
1487
  align-items: flex-start;
1653
1488
  width: 100%;
1654
1489
  border-radius: 2px;
1655
- box-shadow: inset 0 0 0 1px #1e1e1e;
1656
- outline: 1px solid transparent;
1657
1490
  }
1658
1491
  .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__toolbar {
1659
1492
  justify-content: center;
1660
1493
  }
1661
1494
  .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container {
1662
- display: grid;
1663
- grid-template-columns: 1fr 1fr;
1664
- grid-gap: 16px;
1665
- padding: 16px;
1666
- max-height: 550px;
1667
- overflow: auto;
1668
- margin: 0 1px 1px 1px;
1669
- width: calc(100% - 2px);
1670
- background: #fff;
1495
+ column-gap: 24px;
1496
+ display: block;
1497
+ width: 100%;
1498
+ padding: 32px;
1499
+ column-count: 2;
1500
+ }
1501
+ @media (min-width: 1440px) {
1502
+ .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container {
1503
+ column-count: 3;
1504
+ }
1671
1505
  }
1672
1506
  .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-preview__container,
1673
1507
  .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container div[role=button] {
1674
1508
  cursor: pointer;
1675
1509
  }
1676
- .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-pattern-setup-list__item-title {
1677
- padding: 4px;
1678
- font-size: 12px;
1679
- text-align: center;
1510
+ .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-pattern-setup-list__list-item {
1511
+ break-inside: avoid-column;
1512
+ margin-bottom: 24px;
1680
1513
  }
1681
- .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-preview__container {
1514
+ .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-pattern-setup-list__list-item .block-editor-block-preview__container {
1515
+ min-height: 100px;
1682
1516
  border-radius: 2px;
1683
1517
  border: 1px solid #ddd;
1684
1518
  }
1519
+ .block-editor-block-pattern-setup.view-mode-grid .block-editor-block-pattern-setup__container .block-editor-block-pattern-setup-list__list-item .block-editor-block-preview__content {
1520
+ width: 100%;
1521
+ }
1685
1522
  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__toolbar {
1523
+ height: 60px;
1686
1524
  box-sizing: border-box;
1687
- position: relative;
1688
1525
  padding: 16px;
1689
1526
  width: 100%;
1690
1527
  text-align: left;
@@ -1692,12 +1529,12 @@
1692
1529
  color: #1e1e1e;
1693
1530
  border-radius: 2px 2px 0 0;
1694
1531
  background-color: #fff;
1695
- box-shadow: inset 0 0 0 1px #1e1e1e;
1696
- outline: 1px solid transparent;
1697
1532
  display: flex;
1698
1533
  flex-direction: row;
1699
1534
  align-items: center;
1700
1535
  justify-content: space-between;
1536
+ border-top: 1px solid #ddd;
1537
+ align-self: flex-end;
1701
1538
  }
1702
1539
  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__toolbar .block-editor-block-pattern-setup__display-controls {
1703
1540
  display: flex;
@@ -1728,13 +1565,12 @@
1728
1565
  box-sizing: border-box;
1729
1566
  }
1730
1567
  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__container .carousel-container .pattern-slide {
1731
- opacity: 0;
1732
1568
  position: absolute;
1733
1569
  top: 0;
1734
1570
  width: 100%;
1735
1571
  margin: auto;
1736
- padding: 16px;
1737
- transition: transform 0.5s, opacity 0.5s, z-index 0.5s;
1572
+ padding: 0;
1573
+ transition: transform 0.5s, z-index 0.5s;
1738
1574
  z-index: 100;
1739
1575
  }
1740
1576
  .block-editor-block-pattern-setup .block-editor-block-pattern-setup__container .carousel-container .pattern-slide.active-slide {
@@ -1754,6 +1590,12 @@
1754
1590
  display: none;
1755
1591
  }
1756
1592
 
1593
+ .block-editor-block-pattern-setup__carousel,
1594
+ .block-editor-block-pattern-setup__grid {
1595
+ width: 100%;
1596
+ overflow-y: auto;
1597
+ }
1598
+
1757
1599
  .block-editor-block-variation-transforms {
1758
1600
  padding: 0 16px 16px 52px;
1759
1601
  width: 100%;
@@ -1799,11 +1641,13 @@
1799
1641
  align-items: flex-start;
1800
1642
  }
1801
1643
  .components-border-radius-control .components-border-radius-control__wrapper > .components-unit-control-wrapper {
1802
- width: calc(50% - 26px);
1644
+ width: 110px;
1803
1645
  margin-bottom: 0;
1646
+ margin-right: 8px;
1647
+ flex-shrink: 0;
1804
1648
  }
1805
1649
  .components-border-radius-control .components-border-radius-control__wrapper .components-range-control {
1806
- width: calc(50% - 26px);
1650
+ flex: 1;
1807
1651
  margin-bottom: 0;
1808
1652
  }
1809
1653
  .components-border-radius-control .components-border-radius-control__wrapper .components-range-control .components-base-control__field {
@@ -1829,6 +1673,7 @@
1829
1673
  .components-border-radius-control .component-border-radius-control__linked-button.has-icon {
1830
1674
  display: flex;
1831
1675
  justify-content: center;
1676
+ margin-left: 2px;
1832
1677
  }
1833
1678
  .components-border-radius-control .component-border-radius-control__linked-button.has-icon svg {
1834
1679
  margin-right: 0;
@@ -1977,15 +1822,13 @@
1977
1822
  display: none;
1978
1823
  }
1979
1824
 
1980
- .block-editor-default-block-appender .block-editor-inserter,
1981
- .block-editor-block-list__empty-block-inserter.block-editor-block-list__empty-block-inserter {
1825
+ .block-editor-default-block-appender .block-editor-inserter {
1982
1826
  position: absolute;
1983
1827
  top: 0;
1984
1828
  right: 0;
1985
1829
  line-height: 0;
1986
1830
  }
1987
- .block-editor-default-block-appender .block-editor-inserter:disabled,
1988
- .block-editor-block-list__empty-block-inserter.block-editor-block-list__empty-block-inserter:disabled {
1831
+ .block-editor-default-block-appender .block-editor-inserter:disabled {
1989
1832
  display: none;
1990
1833
  }
1991
1834
 
@@ -3762,6 +3605,44 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
3762
3605
  grid-column: span 1;
3763
3606
  }
3764
3607
 
3608
+ .block-editor__border-box-control__popover .components-popover__content,
3609
+ .block-editor__border-box-control__popover-top .components-popover__content,
3610
+ .block-editor__border-box-control__popover-right .components-popover__content,
3611
+ .block-editor__border-box-control__popover-bottom .components-popover__content,
3612
+ .block-editor__border-box-control__popover-left .components-popover__content {
3613
+ width: 282px;
3614
+ }
3615
+
3616
+ @media (min-width: 782px) {
3617
+ .block-editor__border-box-control__popover .components-popover__content,
3618
+ .block-editor__border-box-control__popover-left .components-popover__content {
3619
+ margin-right: 52px !important;
3620
+ }
3621
+
3622
+ .block-editor__border-box-control__popover-top .components-popover__content,
3623
+ .block-editor__border-box-control__popover-bottom .components-popover__content {
3624
+ margin-right: 107px !important;
3625
+ }
3626
+
3627
+ .block-editor__border-box-control__popover-right .components-popover__content {
3628
+ margin-right: 162px !important;
3629
+ }
3630
+
3631
+ .block-editor__border-box-control__popover.is-from-top .components-popover__content,
3632
+ .block-editor__border-box-control__popover-top.is-from-top .components-popover__content,
3633
+ .block-editor__border-box-control__popover-right.is-from-top .components-popover__content,
3634
+ .block-editor__border-box-control__popover-bottom.is-from-top .components-popover__content,
3635
+ .block-editor__border-box-control__popover-left.is-from-top .components-popover__content {
3636
+ margin-top: -52px !important;
3637
+ }
3638
+ .block-editor__border-box-control__popover.is-from-bottom .components-popover__content,
3639
+ .block-editor__border-box-control__popover-top.is-from-bottom .components-popover__content,
3640
+ .block-editor__border-box-control__popover-right.is-from-bottom .components-popover__content,
3641
+ .block-editor__border-box-control__popover-bottom.is-from-bottom .components-popover__content,
3642
+ .block-editor__border-box-control__popover-left.is-from-bottom .components-popover__content {
3643
+ margin-bottom: -52px !important;
3644
+ }
3645
+ }
3765
3646
  .dimensions-block-support-panel .single-column {
3766
3647
  grid-column: span 1;
3767
3648
  }
@@ -3903,19 +3784,11 @@ figcaption.block-editor-rich-text__editable [data-rich-text-placeholder]::before
3903
3784
  margin-bottom: -1px;
3904
3785
  }
3905
3786
 
3906
- .block-editor-block-toolbar__block-controls {
3907
- height: auto !important;
3908
- padding: 0 !important;
3909
- margin-left: -1px;
3910
- }
3911
3787
  .block-editor-block-toolbar__block-controls .block-editor-block-switcher .components-dropdown-menu__toggle .block-editor-block-icon,
3912
3788
  .block-editor-block-toolbar__block-controls .block-editor-block-switcher__no-switcher-icon .block-editor-block-icon {
3913
3789
  width: 24px !important;
3914
3790
  margin: 0 !important;
3915
3791
  }
3916
- .block-editor-block-toolbar__block-controls .block-editor-block-mover {
3917
- margin-left: -6px;
3918
- }
3919
3792
  .block-editor-block-toolbar__block-controls .block-editor-block-lock-toolbar {
3920
3793
  margin-left: -6px !important;
3921
3794
  }