@wordpress/block-editor 12.0.0 → 12.2.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 (627) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/README.md +1 -1
  3. package/build/autocompleters/block.js +13 -5
  4. package/build/autocompleters/block.js.map +1 -1
  5. package/build/components/block-breadcrumb/index.js +6 -3
  6. package/build/components/block-breadcrumb/index.js.map +1 -1
  7. package/build/components/block-controls/slot.js +12 -4
  8. package/build/components/block-controls/slot.js.map +1 -1
  9. package/build/components/block-controls/slot.native.js +10 -1
  10. package/build/components/block-controls/slot.native.js.map +1 -1
  11. package/build/components/block-draggable/index.js +11 -7
  12. package/build/components/block-draggable/index.js.map +1 -1
  13. package/build/components/block-draggable/use-scroll-when-dragging.js +2 -2
  14. package/build/components/block-draggable/use-scroll-when-dragging.js.map +1 -1
  15. package/build/components/block-editing-mode/index.js +84 -0
  16. package/build/components/block-editing-mode/index.js.map +1 -0
  17. package/build/components/block-list/block-invalid-warning.native.js +15 -7
  18. package/build/components/block-list/block-invalid-warning.native.js.map +1 -1
  19. package/build/components/block-list/block-list-block-context.js +15 -0
  20. package/build/components/block-list/block-list-block-context.js.map +1 -0
  21. package/build/components/block-list/block-list-item-cell.native.js +15 -2
  22. package/build/components/block-list/block-list-item-cell.native.js.map +1 -1
  23. package/build/components/block-list/block-list-item.native.js +158 -195
  24. package/build/components/block-list/block-list-item.native.js.map +1 -1
  25. package/build/components/block-list/block-outline.native.js +57 -0
  26. package/build/components/block-list/block-outline.native.js.map +1 -0
  27. package/build/components/block-list/block.js +29 -37
  28. package/build/components/block-list/block.js.map +1 -1
  29. package/build/components/block-list/block.native.js +347 -311
  30. package/build/components/block-list/block.native.js.map +1 -1
  31. package/build/components/block-list/index.native.js +260 -357
  32. package/build/components/block-list/index.native.js.map +1 -1
  33. package/build/components/block-list/insertion-point.native.js +4 -2
  34. package/build/components/block-list/insertion-point.native.js.map +1 -1
  35. package/build/components/block-list/use-block-props/index.js +2 -2
  36. package/build/components/block-list/use-block-props/index.js.map +1 -1
  37. package/build/components/block-list/use-in-between-inserter.js +7 -5
  38. package/build/components/block-list/use-in-between-inserter.js.map +1 -1
  39. package/build/components/block-list-appender/index.js +15 -1
  40. package/build/components/block-list-appender/index.js.map +1 -1
  41. package/build/components/block-mobile-toolbar/block-actions-menu.native.js +19 -4
  42. package/build/components/block-mobile-toolbar/block-actions-menu.native.js.map +1 -1
  43. package/build/components/block-settings-menu/block-settings-dropdown.js +8 -10
  44. package/build/components/block-settings-menu/block-settings-dropdown.js.map +1 -1
  45. package/build/components/block-settings-menu-controls/index.js +15 -4
  46. package/build/components/block-settings-menu-controls/index.js.map +1 -1
  47. package/build/components/block-styles/preview-panel.js +1 -2
  48. package/build/components/block-styles/preview-panel.js.map +1 -1
  49. package/build/components/block-switcher/block-transformations-menu.js +8 -0
  50. package/build/components/block-switcher/block-transformations-menu.js.map +1 -1
  51. package/build/components/block-switcher/block-variation-transformations.js +125 -0
  52. package/build/components/block-switcher/block-variation-transformations.js.map +1 -0
  53. package/build/components/block-switcher/index.js +34 -12
  54. package/build/components/block-switcher/index.js.map +1 -1
  55. package/build/components/block-switcher/pattern-transformations-menu.js +3 -3
  56. package/build/components/block-switcher/pattern-transformations-menu.js.map +1 -1
  57. package/build/components/block-toolbar/index.js +9 -7
  58. package/build/components/block-toolbar/index.js.map +1 -1
  59. package/build/components/block-tools/block-contextual-toolbar.js +22 -65
  60. package/build/components/block-tools/block-contextual-toolbar.js.map +1 -1
  61. package/build/components/block-tools/insertion-point.js +11 -5
  62. package/build/components/block-tools/insertion-point.js.map +1 -1
  63. package/build/components/block-tools/selected-block-popover.js +3 -8
  64. package/build/components/block-tools/selected-block-popover.js.map +1 -1
  65. package/build/components/colors-gradients/use-multiple-origin-colors-and-gradients.js +3 -2
  66. package/build/components/colors-gradients/use-multiple-origin-colors-and-gradients.js.map +1 -1
  67. package/build/components/convert-to-group-buttons/index.js +7 -2
  68. package/build/components/convert-to-group-buttons/index.js.map +1 -1
  69. package/build/components/convert-to-group-buttons/index.native.js +87 -3
  70. package/build/components/convert-to-group-buttons/index.native.js.map +1 -1
  71. package/build/components/convert-to-group-buttons/use-convert-to-group-button-props.js +23 -37
  72. package/build/components/convert-to-group-buttons/use-convert-to-group-button-props.js.map +1 -1
  73. package/build/components/global-styles/advanced-panel.js +86 -0
  74. package/build/components/global-styles/advanced-panel.js.map +1 -0
  75. package/build/components/global-styles/color-panel.js +4 -1
  76. package/build/components/global-styles/color-panel.js.map +1 -1
  77. package/build/components/global-styles/dimensions-panel.js +9 -8
  78. package/build/components/global-styles/dimensions-panel.js.map +1 -1
  79. package/build/components/global-styles/hooks.js +1 -2
  80. package/build/components/global-styles/hooks.js.map +1 -1
  81. package/build/components/global-styles/index.js +24 -0
  82. package/build/components/global-styles/index.js.map +1 -1
  83. package/build/components/global-styles/typography-panel.js +1 -1
  84. package/build/components/global-styles/typography-panel.js.map +1 -1
  85. package/build/components/global-styles/use-global-styles-output.js +27 -4
  86. package/build/components/global-styles/use-global-styles-output.js.map +1 -1
  87. package/build/components/global-styles/utils.js +30 -0
  88. package/build/components/global-styles/utils.js.map +1 -1
  89. package/build/components/iframe/index.js +14 -7
  90. package/build/components/iframe/index.js.map +1 -1
  91. package/build/components/image-editor/use-save-image.js +24 -8
  92. package/build/components/image-editor/use-save-image.js.map +1 -1
  93. package/build/components/inner-blocks/index.js +2 -1
  94. package/build/components/inner-blocks/index.js.map +1 -1
  95. package/build/components/inner-blocks/index.native.js +7 -7
  96. package/build/components/inner-blocks/index.native.js.map +1 -1
  97. package/build/components/inner-blocks/use-nested-settings-update.js +13 -5
  98. package/build/components/inner-blocks/use-nested-settings-update.js.map +1 -1
  99. package/build/components/inserter/index.js +3 -7
  100. package/build/components/inserter/index.js.map +1 -1
  101. package/build/components/inserter/quick-inserter.js +2 -4
  102. package/build/components/inserter/quick-inserter.js.map +1 -1
  103. package/build/components/inserter/search-results.js +19 -6
  104. package/build/components/inserter/search-results.js.map +1 -1
  105. package/build/components/inserter-draggable-blocks/index.js +5 -0
  106. package/build/components/inserter-draggable-blocks/index.js.map +1 -1
  107. package/build/components/inspector-controls/fill.js +1 -1
  108. package/build/components/inspector-controls/fill.js.map +1 -1
  109. package/build/components/inspector-controls/fill.native.js +1 -1
  110. package/build/components/inspector-controls/fill.native.js.map +1 -1
  111. package/build/components/inspector-controls/slot.js +3 -6
  112. package/build/components/inspector-controls/slot.js.map +1 -1
  113. package/build/components/inspector-controls/slot.native.js +1 -1
  114. package/build/components/inspector-controls/slot.native.js.map +1 -1
  115. package/build/components/line-height-control/index.js +7 -2
  116. package/build/components/line-height-control/index.js.map +1 -1
  117. package/build/components/link-control/use-internal-input-value.js +9 -8
  118. package/build/components/link-control/use-internal-input-value.js.map +1 -1
  119. package/build/components/list-view/appender.js +6 -1
  120. package/build/components/list-view/appender.js.map +1 -1
  121. package/build/components/list-view/block-contents.js +9 -2
  122. package/build/components/list-view/block-contents.js.map +1 -1
  123. package/build/components/list-view/block-select-button.js +2 -1
  124. package/build/components/list-view/block-select-button.js.map +1 -1
  125. package/build/components/list-view/block.js +25 -29
  126. package/build/components/list-view/block.js.map +1 -1
  127. package/build/components/list-view/branch.js +1 -3
  128. package/build/components/list-view/branch.js.map +1 -1
  129. package/build/components/list-view/index.js +43 -22
  130. package/build/components/list-view/index.js.map +1 -1
  131. package/build/components/list-view/use-list-view-client-ids.js +27 -3
  132. package/build/components/list-view/use-list-view-client-ids.js.map +1 -1
  133. package/build/components/list-view/use-list-view-drop-zone.js +163 -11
  134. package/build/components/list-view/use-list-view-drop-zone.js.map +1 -1
  135. package/build/components/media-placeholder/index.js +68 -7
  136. package/build/components/media-placeholder/index.js.map +1 -1
  137. package/build/components/multi-selection-inspector/index.js +2 -2
  138. package/build/components/multi-selection-inspector/index.js.map +1 -1
  139. package/build/components/preview-options/index.js +6 -1
  140. package/build/components/preview-options/index.js.map +1 -1
  141. package/build/components/publish-date-time-picker/index.js +0 -2
  142. package/build/components/publish-date-time-picker/index.js.map +1 -1
  143. package/build/components/spacing-sizes-control/spacing-input-control.js +1 -1
  144. package/build/components/spacing-sizes-control/spacing-input-control.js.map +1 -1
  145. package/build/components/url-input/index.js +4 -2
  146. package/build/components/url-input/index.js.map +1 -1
  147. package/build/components/use-block-drop-zone/index.js +25 -15
  148. package/build/components/use-block-drop-zone/index.js.map +1 -1
  149. package/build/components/use-resize-canvas/index.js +8 -1
  150. package/build/components/use-resize-canvas/index.js.map +1 -1
  151. package/build/components/writing-flow/use-arrow-nav.js +13 -7
  152. package/build/components/writing-flow/use-arrow-nav.js.map +1 -1
  153. package/build/hooks/align.js +4 -8
  154. package/build/hooks/align.js.map +1 -1
  155. package/build/hooks/behaviors.js +115 -0
  156. package/build/hooks/behaviors.js.map +1 -0
  157. package/build/hooks/border.js +1 -1
  158. package/build/hooks/border.js.map +1 -1
  159. package/build/hooks/color.js +1 -1
  160. package/build/hooks/color.js.map +1 -1
  161. package/build/hooks/content-lock-ui.js +8 -12
  162. package/build/hooks/content-lock-ui.js.map +1 -1
  163. package/build/hooks/dimensions.js +0 -30
  164. package/build/hooks/dimensions.js.map +1 -1
  165. package/build/hooks/duotone.js +5 -9
  166. package/build/hooks/duotone.js.map +1 -1
  167. package/build/hooks/index.js +2 -0
  168. package/build/hooks/index.js.map +1 -1
  169. package/build/hooks/index.native.js +8 -0
  170. package/build/hooks/index.native.js.map +1 -1
  171. package/build/hooks/layout.js +10 -11
  172. package/build/hooks/layout.js.map +1 -1
  173. package/build/hooks/position.js +1 -1
  174. package/build/hooks/position.js.map +1 -1
  175. package/build/hooks/style.js +1 -1
  176. package/build/hooks/style.js.map +1 -1
  177. package/build/hooks/use-editor-wrapper-styles.native.js +255 -0
  178. package/build/hooks/use-editor-wrapper-styles.native.js.map +1 -0
  179. package/build/hooks/use-typography-props.js +14 -10
  180. package/build/hooks/use-typography-props.js.map +1 -1
  181. package/build/index.native.js +31 -0
  182. package/build/index.native.js.map +1 -0
  183. package/build/private-apis.js +4 -7
  184. package/build/private-apis.js.map +1 -1
  185. package/build/store/private-actions.js +46 -0
  186. package/build/store/private-actions.js.map +1 -1
  187. package/build/store/private-selectors.js +88 -0
  188. package/build/store/private-selectors.js.map +1 -1
  189. package/build/store/reducer.js +36 -1
  190. package/build/store/reducer.js.map +1 -1
  191. package/build/store/selectors.js +28 -18
  192. package/build/store/selectors.js.map +1 -1
  193. package/build/utils/order-inserter-block-items.js +41 -0
  194. package/build/utils/order-inserter-block-items.js.map +1 -0
  195. package/build/utils/use-should-contextual-toolbar-show.js +16 -12
  196. package/build/utils/use-should-contextual-toolbar-show.js.map +1 -1
  197. package/build-module/autocompleters/block.js +12 -5
  198. package/build-module/autocompleters/block.js.map +1 -1
  199. package/build-module/components/block-breadcrumb/index.js +5 -3
  200. package/build-module/components/block-breadcrumb/index.js.map +1 -1
  201. package/build-module/components/block-controls/slot.js +11 -4
  202. package/build-module/components/block-controls/slot.js.map +1 -1
  203. package/build-module/components/block-controls/slot.native.js +9 -1
  204. package/build-module/components/block-controls/slot.native.js.map +1 -1
  205. package/build-module/components/block-draggable/index.js +10 -6
  206. package/build-module/components/block-draggable/index.js.map +1 -1
  207. package/build-module/components/block-draggable/use-scroll-when-dragging.js +2 -2
  208. package/build-module/components/block-draggable/use-scroll-when-dragging.js.map +1 -1
  209. package/build-module/components/block-editing-mode/index.js +72 -0
  210. package/build-module/components/block-editing-mode/index.js.map +1 -0
  211. package/build-module/components/block-list/block-invalid-warning.native.js +16 -8
  212. package/build-module/components/block-list/block-invalid-warning.native.js.map +1 -1
  213. package/build-module/components/block-list/block-list-block-context.js +6 -0
  214. package/build-module/components/block-list/block-list-block-context.js.map +1 -0
  215. package/build-module/components/block-list/block-list-item-cell.native.js +13 -2
  216. package/build-module/components/block-list/block-list-item-cell.native.js.map +1 -1
  217. package/build-module/components/block-list/block-list-item.native.js +160 -190
  218. package/build-module/components/block-list/block-list-item.native.js.map +1 -1
  219. package/build-module/components/block-list/block-outline.native.js +44 -0
  220. package/build-module/components/block-list/block-outline.native.js.map +1 -0
  221. package/build-module/components/block-list/block.js +26 -34
  222. package/build-module/components/block-list/block.js.map +1 -1
  223. package/build-module/components/block-list/block.native.js +345 -310
  224. package/build-module/components/block-list/block.native.js.map +1 -1
  225. package/build-module/components/block-list/index.native.js +263 -355
  226. package/build-module/components/block-list/index.native.js.map +1 -1
  227. package/build-module/components/block-list/insertion-point.native.js +4 -2
  228. package/build-module/components/block-list/insertion-point.native.js.map +1 -1
  229. package/build-module/components/block-list/use-block-props/index.js +1 -1
  230. package/build-module/components/block-list/use-block-props/index.js.map +1 -1
  231. package/build-module/components/block-list/use-in-between-inserter.js +6 -5
  232. package/build-module/components/block-list/use-in-between-inserter.js.map +1 -1
  233. package/build-module/components/block-list-appender/index.js +15 -1
  234. package/build-module/components/block-list-appender/index.js.map +1 -1
  235. package/build-module/components/block-mobile-toolbar/block-actions-menu.native.js +18 -4
  236. package/build-module/components/block-mobile-toolbar/block-actions-menu.native.js.map +1 -1
  237. package/build-module/components/block-settings-menu/block-settings-dropdown.js +8 -9
  238. package/build-module/components/block-settings-menu/block-settings-dropdown.js.map +1 -1
  239. package/build-module/components/block-settings-menu-controls/index.js +13 -5
  240. package/build-module/components/block-settings-menu-controls/index.js.map +1 -1
  241. package/build-module/components/block-styles/preview-panel.js +1 -2
  242. package/build-module/components/block-styles/preview-panel.js.map +1 -1
  243. package/build-module/components/block-switcher/block-transformations-menu.js +7 -0
  244. package/build-module/components/block-switcher/block-transformations-menu.js.map +1 -1
  245. package/build-module/components/block-switcher/block-variation-transformations.js +108 -0
  246. package/build-module/components/block-switcher/block-variation-transformations.js.map +1 -0
  247. package/build-module/components/block-switcher/index.js +33 -12
  248. package/build-module/components/block-switcher/index.js.map +1 -1
  249. package/build-module/components/block-switcher/pattern-transformations-menu.js +3 -3
  250. package/build-module/components/block-switcher/pattern-transformations-menu.js.map +1 -1
  251. package/build-module/components/block-toolbar/index.js +8 -7
  252. package/build-module/components/block-toolbar/index.js.map +1 -1
  253. package/build-module/components/block-tools/block-contextual-toolbar.js +22 -65
  254. package/build-module/components/block-tools/block-contextual-toolbar.js.map +1 -1
  255. package/build-module/components/block-tools/insertion-point.js +11 -5
  256. package/build-module/components/block-tools/insertion-point.js.map +1 -1
  257. package/build-module/components/block-tools/selected-block-popover.js +3 -7
  258. package/build-module/components/block-tools/selected-block-popover.js.map +1 -1
  259. package/build-module/components/colors-gradients/use-multiple-origin-colors-and-gradients.js +3 -2
  260. package/build-module/components/colors-gradients/use-multiple-origin-colors-and-gradients.js.map +1 -1
  261. package/build-module/components/convert-to-group-buttons/index.js +7 -2
  262. package/build-module/components/convert-to-group-buttons/index.js.map +1 -1
  263. package/build-module/components/convert-to-group-buttons/index.native.js +76 -1
  264. package/build-module/components/convert-to-group-buttons/index.native.js.map +1 -1
  265. package/build-module/components/convert-to-group-buttons/use-convert-to-group-button-props.js +22 -36
  266. package/build-module/components/convert-to-group-buttons/use-convert-to-group-button-props.js.map +1 -1
  267. package/build-module/components/global-styles/advanced-panel.js +74 -0
  268. package/build-module/components/global-styles/advanced-panel.js.map +1 -0
  269. package/build-module/components/global-styles/color-panel.js +5 -2
  270. package/build-module/components/global-styles/color-panel.js.map +1 -1
  271. package/build-module/components/global-styles/dimensions-panel.js +9 -8
  272. package/build-module/components/global-styles/dimensions-panel.js.map +1 -1
  273. package/build-module/components/global-styles/hooks.js +1 -2
  274. package/build-module/components/global-styles/hooks.js.map +1 -1
  275. package/build-module/components/global-styles/index.js +3 -1
  276. package/build-module/components/global-styles/index.js.map +1 -1
  277. package/build-module/components/global-styles/typography-panel.js +1 -1
  278. package/build-module/components/global-styles/typography-panel.js.map +1 -1
  279. package/build-module/components/global-styles/use-global-styles-output.js +25 -4
  280. package/build-module/components/global-styles/use-global-styles-output.js.map +1 -1
  281. package/build-module/components/global-styles/utils.js +25 -0
  282. package/build-module/components/global-styles/utils.js.map +1 -1
  283. package/build-module/components/iframe/index.js +15 -8
  284. package/build-module/components/iframe/index.js.map +1 -1
  285. package/build-module/components/image-editor/use-save-image.js +24 -8
  286. package/build-module/components/image-editor/use-save-image.js.map +1 -1
  287. package/build-module/components/inner-blocks/index.js +2 -1
  288. package/build-module/components/inner-blocks/index.js.map +1 -1
  289. package/build-module/components/inner-blocks/index.native.js +7 -6
  290. package/build-module/components/inner-blocks/index.native.js.map +1 -1
  291. package/build-module/components/inner-blocks/use-nested-settings-update.js +13 -5
  292. package/build-module/components/inner-blocks/use-nested-settings-update.js.map +1 -1
  293. package/build-module/components/inserter/index.js +3 -7
  294. package/build-module/components/inserter/index.js.map +1 -1
  295. package/build-module/components/inserter/quick-inserter.js +2 -4
  296. package/build-module/components/inserter/quick-inserter.js.map +1 -1
  297. package/build-module/components/inserter/search-results.js +16 -6
  298. package/build-module/components/inserter/search-results.js.map +1 -1
  299. package/build-module/components/inserter-draggable-blocks/index.js +4 -0
  300. package/build-module/components/inserter-draggable-blocks/index.js.map +1 -1
  301. package/build-module/components/inspector-controls/fill.js +1 -1
  302. package/build-module/components/inspector-controls/fill.js.map +1 -1
  303. package/build-module/components/inspector-controls/fill.native.js +1 -1
  304. package/build-module/components/inspector-controls/fill.native.js.map +1 -1
  305. package/build-module/components/inspector-controls/slot.js +4 -7
  306. package/build-module/components/inspector-controls/slot.js.map +1 -1
  307. package/build-module/components/inspector-controls/slot.native.js +1 -1
  308. package/build-module/components/inspector-controls/slot.native.js.map +1 -1
  309. package/build-module/components/line-height-control/index.js +7 -2
  310. package/build-module/components/line-height-control/index.js.map +1 -1
  311. package/build-module/components/link-control/use-internal-input-value.js +9 -8
  312. package/build-module/components/link-control/use-internal-input-value.js.map +1 -1
  313. package/build-module/components/list-view/appender.js +6 -2
  314. package/build-module/components/list-view/appender.js.map +1 -1
  315. package/build-module/components/list-view/block-contents.js +9 -3
  316. package/build-module/components/list-view/block-contents.js.map +1 -1
  317. package/build-module/components/list-view/block-select-button.js +2 -1
  318. package/build-module/components/list-view/block-select-button.js.map +1 -1
  319. package/build-module/components/list-view/block.js +24 -29
  320. package/build-module/components/list-view/block.js.map +1 -1
  321. package/build-module/components/list-view/branch.js +1 -3
  322. package/build-module/components/list-view/branch.js.map +1 -1
  323. package/build-module/components/list-view/index.js +44 -23
  324. package/build-module/components/list-view/index.js.map +1 -1
  325. package/build-module/components/list-view/use-list-view-client-ids.js +26 -3
  326. package/build-module/components/list-view/use-list-view-client-ids.js.map +1 -1
  327. package/build-module/components/list-view/use-list-view-drop-zone.js +160 -11
  328. package/build-module/components/list-view/use-list-view-drop-zone.js.map +1 -1
  329. package/build-module/components/media-placeholder/index.js +66 -7
  330. package/build-module/components/media-placeholder/index.js.map +1 -1
  331. package/build-module/components/multi-selection-inspector/index.js +2 -2
  332. package/build-module/components/multi-selection-inspector/index.js.map +1 -1
  333. package/build-module/components/preview-options/index.js +7 -2
  334. package/build-module/components/preview-options/index.js.map +1 -1
  335. package/build-module/components/publish-date-time-picker/index.js +0 -2
  336. package/build-module/components/publish-date-time-picker/index.js.map +1 -1
  337. package/build-module/components/spacing-sizes-control/spacing-input-control.js +1 -1
  338. package/build-module/components/spacing-sizes-control/spacing-input-control.js.map +1 -1
  339. package/build-module/components/url-input/index.js +4 -2
  340. package/build-module/components/url-input/index.js.map +1 -1
  341. package/build-module/components/use-block-drop-zone/index.js +25 -16
  342. package/build-module/components/use-block-drop-zone/index.js.map +1 -1
  343. package/build-module/components/use-resize-canvas/index.js +8 -1
  344. package/build-module/components/use-resize-canvas/index.js.map +1 -1
  345. package/build-module/components/writing-flow/use-arrow-nav.js +13 -7
  346. package/build-module/components/writing-flow/use-arrow-nav.js.map +1 -1
  347. package/build-module/hooks/align.js +4 -7
  348. package/build-module/hooks/align.js.map +1 -1
  349. package/build-module/hooks/behaviors.js +97 -0
  350. package/build-module/hooks/behaviors.js.map +1 -0
  351. package/build-module/hooks/border.js +1 -1
  352. package/build-module/hooks/border.js.map +1 -1
  353. package/build-module/hooks/color.js +1 -1
  354. package/build-module/hooks/color.js.map +1 -1
  355. package/build-module/hooks/content-lock-ui.js +8 -11
  356. package/build-module/hooks/content-lock-ui.js.map +1 -1
  357. package/build-module/hooks/dimensions.js +0 -28
  358. package/build-module/hooks/dimensions.js.map +1 -1
  359. package/build-module/hooks/duotone.js +4 -7
  360. package/build-module/hooks/duotone.js.map +1 -1
  361. package/build-module/hooks/index.js +1 -0
  362. package/build-module/hooks/index.js.map +1 -1
  363. package/build-module/hooks/index.native.js +1 -0
  364. package/build-module/hooks/index.native.js.map +1 -1
  365. package/build-module/hooks/layout.js +9 -11
  366. package/build-module/hooks/layout.js.map +1 -1
  367. package/build-module/hooks/position.js +1 -1
  368. package/build-module/hooks/position.js.map +1 -1
  369. package/build-module/hooks/style.js +1 -1
  370. package/build-module/hooks/style.js.map +1 -1
  371. package/build-module/hooks/use-editor-wrapper-styles.native.js +242 -0
  372. package/build-module/hooks/use-editor-wrapper-styles.native.js.map +1 -0
  373. package/build-module/hooks/use-typography-props.js +14 -10
  374. package/build-module/hooks/use-typography-props.js.map +1 -1
  375. package/build-module/index.native.js +6 -0
  376. package/build-module/index.native.js.map +1 -0
  377. package/build-module/private-apis.js +3 -5
  378. package/build-module/private-apis.js.map +1 -1
  379. package/build-module/store/private-actions.js +42 -0
  380. package/build-module/store/private-actions.js.map +1 -1
  381. package/build-module/store/private-selectors.js +79 -0
  382. package/build-module/store/private-selectors.js.map +1 -1
  383. package/build-module/store/reducer.js +34 -1
  384. package/build-module/store/reducer.js.map +1 -1
  385. package/build-module/store/selectors.js +26 -17
  386. package/build-module/store/selectors.js.map +1 -1
  387. package/build-module/utils/order-inserter-block-items.js +32 -0
  388. package/build-module/utils/order-inserter-block-items.js.map +1 -0
  389. package/build-module/utils/use-should-contextual-toolbar-show.js +16 -12
  390. package/build-module/utils/use-should-contextual-toolbar-show.js.map +1 -1
  391. package/build-style/content-rtl.css +32 -14
  392. package/build-style/content.css +32 -14
  393. package/build-style/default-editor-styles-rtl.css +1 -1
  394. package/build-style/default-editor-styles.css +1 -1
  395. package/build-style/style-rtl.css +56 -77
  396. package/build-style/style.css +57 -77
  397. package/package.json +32 -31
  398. package/src/autocompleters/block.js +15 -7
  399. package/src/components/block-breadcrumb/index.js +11 -3
  400. package/src/components/block-breadcrumb/style.scss +2 -1
  401. package/src/components/block-controls/slot.js +8 -4
  402. package/src/components/block-controls/slot.native.js +6 -1
  403. package/src/components/block-draggable/index.js +10 -6
  404. package/src/components/block-draggable/use-scroll-when-dragging.js +8 -2
  405. package/src/components/block-editing-mode/index.js +71 -0
  406. package/src/components/block-list/block-invalid-warning.native.js +17 -9
  407. package/src/components/block-list/block-list-block-context.js +6 -0
  408. package/src/components/block-list/block-list-item-cell.native.js +10 -1
  409. package/src/components/block-list/block-list-item.native.js +180 -208
  410. package/src/components/block-list/block-outline.native.js +58 -0
  411. package/src/components/block-list/block.js +38 -56
  412. package/src/components/block-list/block.native.js +531 -501
  413. package/src/components/block-list/content.scss +5 -6
  414. package/src/components/block-list/index.native.js +324 -382
  415. package/src/components/block-list/insertion-point.native.js +2 -2
  416. package/src/components/block-list/test/block-invalid-warning.native.js +48 -0
  417. package/src/components/block-list/test/index.native.js +205 -0
  418. package/src/components/block-list/use-block-props/index.js +1 -1
  419. package/src/components/block-list/use-in-between-inserter.js +7 -3
  420. package/src/components/block-list-appender/index.js +22 -4
  421. package/src/components/block-mobile-toolbar/block-actions-menu.native.js +26 -1
  422. package/src/components/block-mover/style.scss +1 -0
  423. package/src/components/block-pattern-setup/style.scss +1 -4
  424. package/src/components/block-patterns-list/style.scss +1 -4
  425. package/src/components/block-settings-menu/block-settings-dropdown.js +10 -17
  426. package/src/components/block-settings-menu-controls/index.js +24 -4
  427. package/src/components/block-styles/preview-panel.js +1 -3
  428. package/src/components/block-styles/style.scss +4 -4
  429. package/src/components/block-switcher/block-transformations-menu.js +12 -0
  430. package/src/components/block-switcher/block-variation-transformations.js +115 -0
  431. package/src/components/block-switcher/index.js +38 -5
  432. package/src/components/block-switcher/pattern-transformations-menu.js +5 -5
  433. package/src/components/block-switcher/style.scss +6 -5
  434. package/src/components/block-toolbar/index.js +10 -11
  435. package/src/components/block-tools/block-contextual-toolbar.js +32 -67
  436. package/src/components/block-tools/insertion-point.js +23 -9
  437. package/src/components/block-tools/selected-block-popover.js +3 -5
  438. package/src/components/block-tools/style.scss +8 -0
  439. package/src/components/button-block-appender/content.scss +22 -0
  440. package/src/components/colors-gradients/use-multiple-origin-colors-and-gradients.js +16 -2
  441. package/src/components/convert-to-group-buttons/index.js +9 -2
  442. package/src/components/convert-to-group-buttons/index.native.js +79 -1
  443. package/src/components/convert-to-group-buttons/use-convert-to-group-button-props.js +32 -38
  444. package/src/components/global-styles/advanced-panel.js +82 -0
  445. package/src/components/global-styles/color-panel.js +6 -1
  446. package/src/components/global-styles/dimensions-panel.js +9 -8
  447. package/src/components/global-styles/hooks.js +1 -5
  448. package/src/components/global-styles/index.js +6 -1
  449. package/src/components/global-styles/style.scss +17 -0
  450. package/src/components/global-styles/test/utils.js +57 -1
  451. package/src/components/global-styles/typography-panel.js +1 -1
  452. package/src/components/global-styles/use-global-styles-output.js +21 -3
  453. package/src/components/global-styles/utils.js +27 -0
  454. package/src/components/iframe/index.js +22 -12
  455. package/src/components/image-editor/use-save-image.js +20 -9
  456. package/src/components/inner-blocks/README.md +5 -0
  457. package/src/components/inner-blocks/index.js +2 -0
  458. package/src/components/inner-blocks/index.native.js +16 -6
  459. package/src/components/inner-blocks/use-nested-settings-update.js +20 -3
  460. package/src/components/inserter/index.js +1 -9
  461. package/src/components/inserter/quick-inserter.js +0 -2
  462. package/src/components/inserter/search-results.js +32 -6
  463. package/src/components/inserter-draggable-blocks/index.js +4 -0
  464. package/src/components/inspector-controls/fill.js +1 -1
  465. package/src/components/inspector-controls/fill.native.js +1 -1
  466. package/src/components/inspector-controls/slot.js +4 -9
  467. package/src/components/inspector-controls/slot.native.js +1 -1
  468. package/src/components/line-height-control/index.js +7 -2
  469. package/src/components/line-height-control/stories/index.js +1 -1
  470. package/src/components/link-control/test/index.js +42 -0
  471. package/src/components/link-control/use-internal-input-value.js +8 -7
  472. package/src/components/list-view/appender.js +3 -2
  473. package/src/components/list-view/block-contents.js +32 -20
  474. package/src/components/list-view/block-select-button.js +5 -1
  475. package/src/components/list-view/block.js +34 -37
  476. package/src/components/list-view/branch.js +1 -7
  477. package/src/components/list-view/index.js +42 -17
  478. package/src/components/list-view/style.scss +7 -7
  479. package/src/components/list-view/test/use-list-view-drop-zone.js +88 -12
  480. package/src/components/list-view/use-list-view-client-ids.js +21 -4
  481. package/src/components/list-view/use-list-view-drop-zone.js +194 -11
  482. package/src/components/media-placeholder/index.js +74 -1
  483. package/src/components/multi-selection-inspector/index.js +2 -2
  484. package/src/components/preview-options/index.js +9 -2
  485. package/src/components/publish-date-time-picker/index.js +0 -2
  486. package/src/components/spacing-sizes-control/spacing-input-control.js +1 -0
  487. package/src/components/url-input/README.md +6 -0
  488. package/src/components/url-input/index.js +2 -2
  489. package/src/components/use-block-drop-zone/index.js +31 -17
  490. package/src/components/use-resize-canvas/index.js +9 -1
  491. package/src/components/writing-flow/test/index.js +15 -0
  492. package/src/components/writing-flow/use-arrow-nav.js +17 -4
  493. package/src/hooks/align.js +5 -12
  494. package/src/hooks/behaviors.js +104 -0
  495. package/src/hooks/border.js +2 -1
  496. package/src/hooks/color.js +2 -1
  497. package/src/hooks/content-lock-ui.js +3 -15
  498. package/src/hooks/dimensions.js +0 -40
  499. package/src/hooks/duotone.js +4 -11
  500. package/src/hooks/index.js +1 -0
  501. package/src/hooks/index.native.js +1 -0
  502. package/src/hooks/layout.js +14 -20
  503. package/src/hooks/position.js +2 -1
  504. package/src/hooks/style.js +2 -1
  505. package/src/hooks/test/use-editor-wrapper-styles.native.js +282 -0
  506. package/src/hooks/test/use-typography-props.js +47 -2
  507. package/src/hooks/use-editor-wrapper-styles.native.js +250 -0
  508. package/src/hooks/use-editor-wrapper-styles.native.scss +11 -0
  509. package/src/hooks/use-typography-props.js +10 -11
  510. package/src/index.native.js +6 -0
  511. package/src/private-apis.js +2 -4
  512. package/src/store/private-actions.js +39 -0
  513. package/src/store/private-selectors.js +95 -0
  514. package/src/store/reducer.js +27 -0
  515. package/src/store/selectors.js +25 -15
  516. package/src/store/test/private-actions.js +32 -1
  517. package/src/store/test/private-selectors.js +158 -0
  518. package/src/store/test/reducer.js +48 -0
  519. package/src/style.scss +0 -3
  520. package/src/utils/order-inserter-block-items.js +26 -0
  521. package/src/utils/use-should-contextual-toolbar-show.js +19 -9
  522. package/tsconfig.json +1 -0
  523. package/tsconfig.tsbuildinfo +1 -1
  524. package/build/components/block-list/block-list-compact.native.js +0 -75
  525. package/build/components/block-list/block-list-compact.native.js.map +0 -1
  526. package/build/components/off-canvas-editor/appender.js +0 -125
  527. package/build/components/off-canvas-editor/appender.js.map +0 -1
  528. package/build/components/off-canvas-editor/block-contents.js +0 -141
  529. package/build/components/off-canvas-editor/block-contents.js.map +0 -1
  530. package/build/components/off-canvas-editor/block-select-button.js +0 -126
  531. package/build/components/off-canvas-editor/block-select-button.js.map +0 -1
  532. package/build/components/off-canvas-editor/block.js +0 -297
  533. package/build/components/off-canvas-editor/block.js.map +0 -1
  534. package/build/components/off-canvas-editor/branch.js +0 -197
  535. package/build/components/off-canvas-editor/branch.js.map +0 -1
  536. package/build/components/off-canvas-editor/context.js +0 -19
  537. package/build/components/off-canvas-editor/context.js.map +0 -1
  538. package/build/components/off-canvas-editor/drop-indicator.js +0 -118
  539. package/build/components/off-canvas-editor/drop-indicator.js.map +0 -1
  540. package/build/components/off-canvas-editor/expander.js +0 -41
  541. package/build/components/off-canvas-editor/expander.js.map +0 -1
  542. package/build/components/off-canvas-editor/index.js +0 -236
  543. package/build/components/off-canvas-editor/index.js.map +0 -1
  544. package/build/components/off-canvas-editor/leaf-more-menu.js +0 -146
  545. package/build/components/off-canvas-editor/leaf-more-menu.js.map +0 -1
  546. package/build/components/off-canvas-editor/leaf.js +0 -60
  547. package/build/components/off-canvas-editor/leaf.js.map +0 -1
  548. package/build/components/off-canvas-editor/link-ui.js +0 -186
  549. package/build/components/off-canvas-editor/link-ui.js.map +0 -1
  550. package/build/components/off-canvas-editor/update-attributes.js +0 -108
  551. package/build/components/off-canvas-editor/update-attributes.js.map +0 -1
  552. package/build/components/off-canvas-editor/use-block-selection.js +0 -139
  553. package/build/components/off-canvas-editor/use-block-selection.js.map +0 -1
  554. package/build/components/off-canvas-editor/use-inserted-block.js +0 -58
  555. package/build/components/off-canvas-editor/use-inserted-block.js.map +0 -1
  556. package/build/components/off-canvas-editor/use-list-view-client-ids.js +0 -33
  557. package/build/components/off-canvas-editor/use-list-view-client-ids.js.map +0 -1
  558. package/build/components/off-canvas-editor/use-list-view-drop-zone.js +0 -235
  559. package/build/components/off-canvas-editor/use-list-view-drop-zone.js.map +0 -1
  560. package/build/components/off-canvas-editor/use-list-view-expand-selected-item.js +0 -60
  561. package/build/components/off-canvas-editor/use-list-view-expand-selected-item.js.map +0 -1
  562. package/build/components/off-canvas-editor/utils.js +0 -60
  563. package/build/components/off-canvas-editor/utils.js.map +0 -1
  564. package/build-module/components/block-list/block-list-compact.native.js +0 -60
  565. package/build-module/components/block-list/block-list-compact.native.js.map +0 -1
  566. package/build-module/components/off-canvas-editor/appender.js +0 -108
  567. package/build-module/components/off-canvas-editor/appender.js.map +0 -1
  568. package/build-module/components/off-canvas-editor/block-contents.js +0 -121
  569. package/build-module/components/off-canvas-editor/block-contents.js.map +0 -1
  570. package/build-module/components/off-canvas-editor/block-select-button.js +0 -107
  571. package/build-module/components/off-canvas-editor/block-select-button.js.map +0 -1
  572. package/build-module/components/off-canvas-editor/block.js +0 -273
  573. package/build-module/components/off-canvas-editor/block.js.map +0 -1
  574. package/build-module/components/off-canvas-editor/branch.js +0 -179
  575. package/build-module/components/off-canvas-editor/branch.js.map +0 -1
  576. package/build-module/components/off-canvas-editor/context.js +0 -7
  577. package/build-module/components/off-canvas-editor/context.js.map +0 -1
  578. package/build-module/components/off-canvas-editor/drop-indicator.js +0 -111
  579. package/build-module/components/off-canvas-editor/drop-indicator.js.map +0 -1
  580. package/build-module/components/off-canvas-editor/expander.js +0 -32
  581. package/build-module/components/off-canvas-editor/expander.js.map +0 -1
  582. package/build-module/components/off-canvas-editor/index.js +0 -213
  583. package/build-module/components/off-canvas-editor/index.js.map +0 -1
  584. package/build-module/components/off-canvas-editor/leaf-more-menu.js +0 -128
  585. package/build-module/components/off-canvas-editor/leaf-more-menu.js.map +0 -1
  586. package/build-module/components/off-canvas-editor/leaf.js +0 -45
  587. package/build-module/components/off-canvas-editor/leaf.js.map +0 -1
  588. package/build-module/components/off-canvas-editor/link-ui.js +0 -166
  589. package/build-module/components/off-canvas-editor/link-ui.js.map +0 -1
  590. package/build-module/components/off-canvas-editor/update-attributes.js +0 -97
  591. package/build-module/components/off-canvas-editor/update-attributes.js.map +0 -1
  592. package/build-module/components/off-canvas-editor/use-block-selection.js +0 -124
  593. package/build-module/components/off-canvas-editor/use-block-selection.js.map +0 -1
  594. package/build-module/components/off-canvas-editor/use-inserted-block.js +0 -47
  595. package/build-module/components/off-canvas-editor/use-inserted-block.js.map +0 -1
  596. package/build-module/components/off-canvas-editor/use-list-view-client-ids.js +0 -24
  597. package/build-module/components/off-canvas-editor/use-list-view-client-ids.js.map +0 -1
  598. package/build-module/components/off-canvas-editor/use-list-view-drop-zone.js +0 -220
  599. package/build-module/components/off-canvas-editor/use-list-view-drop-zone.js.map +0 -1
  600. package/build-module/components/off-canvas-editor/use-list-view-expand-selected-item.js +0 -50
  601. package/build-module/components/off-canvas-editor/use-list-view-expand-selected-item.js.map +0 -1
  602. package/build-module/components/off-canvas-editor/utils.js +0 -44
  603. package/build-module/components/off-canvas-editor/utils.js.map +0 -1
  604. package/src/components/block-list/block-list-compact.native.js +0 -63
  605. package/src/components/off-canvas-editor/README.md +0 -5
  606. package/src/components/off-canvas-editor/appender.js +0 -124
  607. package/src/components/off-canvas-editor/block-contents.js +0 -156
  608. package/src/components/off-canvas-editor/block-select-button.js +0 -128
  609. package/src/components/off-canvas-editor/block.js +0 -347
  610. package/src/components/off-canvas-editor/branch.js +0 -238
  611. package/src/components/off-canvas-editor/context.js +0 -8
  612. package/src/components/off-canvas-editor/drop-indicator.js +0 -126
  613. package/src/components/off-canvas-editor/expander.js +0 -26
  614. package/src/components/off-canvas-editor/index.js +0 -271
  615. package/src/components/off-canvas-editor/leaf-more-menu.js +0 -157
  616. package/src/components/off-canvas-editor/leaf.js +0 -52
  617. package/src/components/off-canvas-editor/link-ui.js +0 -167
  618. package/src/components/off-canvas-editor/style.scss +0 -34
  619. package/src/components/off-canvas-editor/test/use-inserted-block.js +0 -108
  620. package/src/components/off-canvas-editor/test/utils.js +0 -50
  621. package/src/components/off-canvas-editor/update-attributes.js +0 -99
  622. package/src/components/off-canvas-editor/use-block-selection.js +0 -169
  623. package/src/components/off-canvas-editor/use-inserted-block.js +0 -47
  624. package/src/components/off-canvas-editor/use-list-view-client-ids.js +0 -29
  625. package/src/components/off-canvas-editor/use-list-view-drop-zone.js +0 -260
  626. package/src/components/off-canvas-editor/use-list-view-expand-selected-item.js +0 -58
  627. package/src/components/off-canvas-editor/utils.js +0 -58
@@ -1,47 +0,0 @@
1
- /**
2
- * WordPress dependencies
3
- */
4
- import { useSelect, useDispatch } from '@wordpress/data';
5
- /**
6
- * Internal dependencies
7
- */
8
-
9
- import { store as blockEditorStore } from '../../store';
10
- export const useInsertedBlock = insertedBlockClientId => {
11
- const {
12
- insertedBlockAttributes,
13
- insertedBlockName
14
- } = useSelect(select => {
15
- const {
16
- getBlockName,
17
- getBlockAttributes
18
- } = select(blockEditorStore);
19
- return {
20
- insertedBlockAttributes: getBlockAttributes(insertedBlockClientId),
21
- insertedBlockName: getBlockName(insertedBlockClientId)
22
- };
23
- }, [insertedBlockClientId]);
24
- const {
25
- updateBlockAttributes
26
- } = useDispatch(blockEditorStore);
27
-
28
- const setInsertedBlockAttributes = _updatedAttributes => {
29
- if (!insertedBlockClientId) return;
30
- updateBlockAttributes(insertedBlockClientId, _updatedAttributes);
31
- };
32
-
33
- if (!insertedBlockClientId) {
34
- return {
35
- insertedBlockAttributes: undefined,
36
- insertedBlockName: undefined,
37
- setInsertedBlockAttributes
38
- };
39
- }
40
-
41
- return {
42
- insertedBlockAttributes,
43
- insertedBlockName,
44
- setInsertedBlockAttributes
45
- };
46
- };
47
- //# sourceMappingURL=use-inserted-block.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["@wordpress/block-editor/src/components/off-canvas-editor/use-inserted-block.js"],"names":["useSelect","useDispatch","store","blockEditorStore","useInsertedBlock","insertedBlockClientId","insertedBlockAttributes","insertedBlockName","select","getBlockName","getBlockAttributes","updateBlockAttributes","setInsertedBlockAttributes","_updatedAttributes","undefined"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAT,EAAoBC,WAApB,QAAuC,iBAAvC;AAEA;AACA;AACA;;AACA,SAASC,KAAK,IAAIC,gBAAlB,QAA0C,aAA1C;AAEA,OAAO,MAAMC,gBAAgB,GAAKC,qBAAF,IAA6B;AAC5D,QAAM;AAAEC,IAAAA,uBAAF;AAA2BC,IAAAA;AAA3B,MAAiDP,SAAS,CAC7DQ,MAAF,IAAc;AACb,UAAM;AAAEC,MAAAA,YAAF;AAAgBC,MAAAA;AAAhB,QACLF,MAAM,CAAEL,gBAAF,CADP;AAGA,WAAO;AACNG,MAAAA,uBAAuB,EAAEI,kBAAkB,CAC1CL,qBAD0C,CADrC;AAINE,MAAAA,iBAAiB,EAAEE,YAAY,CAAEJ,qBAAF;AAJzB,KAAP;AAMA,GAX8D,EAY/D,CAAEA,qBAAF,CAZ+D,CAAhE;AAeA,QAAM;AAAEM,IAAAA;AAAF,MAA4BV,WAAW,CAAEE,gBAAF,CAA7C;;AAEA,QAAMS,0BAA0B,GAAKC,kBAAF,IAA0B;AAC5D,QAAK,CAAER,qBAAP,EAA+B;AAC/BM,IAAAA,qBAAqB,CAAEN,qBAAF,EAAyBQ,kBAAzB,CAArB;AACA,GAHD;;AAKA,MAAK,CAAER,qBAAP,EAA+B;AAC9B,WAAO;AACNC,MAAAA,uBAAuB,EAAEQ,SADnB;AAENP,MAAAA,iBAAiB,EAAEO,SAFb;AAGNF,MAAAA;AAHM,KAAP;AAKA;;AAED,SAAO;AACNN,IAAAA,uBADM;AAENC,IAAAA,iBAFM;AAGNK,IAAAA;AAHM,GAAP;AAKA,CApCM","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\n\nexport const useInsertedBlock = ( insertedBlockClientId ) => {\n\tconst { insertedBlockAttributes, insertedBlockName } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockName, getBlockAttributes } =\n\t\t\t\tselect( blockEditorStore );\n\n\t\t\treturn {\n\t\t\t\tinsertedBlockAttributes: getBlockAttributes(\n\t\t\t\t\tinsertedBlockClientId\n\t\t\t\t),\n\t\t\t\tinsertedBlockName: getBlockName( insertedBlockClientId ),\n\t\t\t};\n\t\t},\n\t\t[ insertedBlockClientId ]\n\t);\n\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\n\tconst setInsertedBlockAttributes = ( _updatedAttributes ) => {\n\t\tif ( ! insertedBlockClientId ) return;\n\t\tupdateBlockAttributes( insertedBlockClientId, _updatedAttributes );\n\t};\n\n\tif ( ! insertedBlockClientId ) {\n\t\treturn {\n\t\t\tinsertedBlockAttributes: undefined,\n\t\t\tinsertedBlockName: undefined,\n\t\t\tsetInsertedBlockAttributes,\n\t\t};\n\t}\n\n\treturn {\n\t\tinsertedBlockAttributes,\n\t\tinsertedBlockName,\n\t\tsetInsertedBlockAttributes,\n\t};\n};\n"]}
@@ -1,24 +0,0 @@
1
- /**
2
- * WordPress dependencies
3
- */
4
- import { useSelect } from '@wordpress/data';
5
- /**
6
- * Internal dependencies
7
- */
8
-
9
- import { store as blockEditorStore } from '../../store';
10
- export default function useListViewClientIds(blocks) {
11
- return useSelect(select => {
12
- const {
13
- getDraggedBlockClientIds,
14
- getSelectedBlockClientIds,
15
- __unstableGetClientIdsTree
16
- } = select(blockEditorStore);
17
- return {
18
- selectedClientIds: getSelectedBlockClientIds(),
19
- draggedClientIds: getDraggedBlockClientIds(),
20
- clientIdsTree: blocks ? blocks : __unstableGetClientIdsTree()
21
- };
22
- }, [blocks]);
23
- }
24
- //# sourceMappingURL=use-list-view-client-ids.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["@wordpress/block-editor/src/components/off-canvas-editor/use-list-view-client-ids.js"],"names":["useSelect","store","blockEditorStore","useListViewClientIds","blocks","select","getDraggedBlockClientIds","getSelectedBlockClientIds","__unstableGetClientIdsTree","selectedClientIds","draggedClientIds","clientIdsTree"],"mappings":"AAAA;AACA;AACA;AAEA,SAASA,SAAT,QAA0B,iBAA1B;AAEA;AACA;AACA;;AACA,SAASC,KAAK,IAAIC,gBAAlB,QAA0C,aAA1C;AAEA,eAAe,SAASC,oBAAT,CAA+BC,MAA/B,EAAwC;AACtD,SAAOJ,SAAS,CACbK,MAAF,IAAc;AACb,UAAM;AACLC,MAAAA,wBADK;AAELC,MAAAA,yBAFK;AAGLC,MAAAA;AAHK,QAIFH,MAAM,CAAEH,gBAAF,CAJV;AAMA,WAAO;AACNO,MAAAA,iBAAiB,EAAEF,yBAAyB,EADtC;AAENG,MAAAA,gBAAgB,EAAEJ,wBAAwB,EAFpC;AAGNK,MAAAA,aAAa,EAAEP,MAAM,GAAGA,MAAH,GAAYI,0BAA0B;AAHrD,KAAP;AAKA,GAbc,EAcf,CAAEJ,MAAF,CAde,CAAhB;AAgBA","sourcesContent":["/**\n * WordPress dependencies\n */\n\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\n\nexport default function useListViewClientIds( blocks ) {\n\treturn useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetDraggedBlockClientIds,\n\t\t\t\tgetSelectedBlockClientIds,\n\t\t\t\t__unstableGetClientIdsTree,\n\t\t\t} = select( blockEditorStore );\n\n\t\t\treturn {\n\t\t\t\tselectedClientIds: getSelectedBlockClientIds(),\n\t\t\t\tdraggedClientIds: getDraggedBlockClientIds(),\n\t\t\t\tclientIdsTree: blocks ? blocks : __unstableGetClientIdsTree(),\n\t\t\t};\n\t\t},\n\t\t[ blocks ]\n\t);\n}\n"]}
@@ -1,220 +0,0 @@
1
- /**
2
- * WordPress dependencies
3
- */
4
- import { useSelect } from '@wordpress/data';
5
- import { useState, useCallback } from '@wordpress/element';
6
- import { useThrottle, __experimentalUseDropZone as useDropZone } from '@wordpress/compose';
7
- /**
8
- * Internal dependencies
9
- */
10
-
11
- import { getDistanceToNearestEdge, isPointContainedByRect } from '../../utils/math';
12
- import useOnBlockDrop from '../use-on-block-drop';
13
- import { store as blockEditorStore } from '../../store';
14
- /** @typedef {import('../../utils/math').WPPoint} WPPoint */
15
-
16
- /**
17
- * The type of a drag event.
18
- *
19
- * @typedef {'default'|'file'|'html'} WPDragEventType
20
- */
21
-
22
- /**
23
- * An array representing data for blocks in the DOM used by drag and drop.
24
- *
25
- * @typedef {Object} WPListViewDropZoneBlocks
26
- * @property {string} clientId The client id for the block.
27
- * @property {string} rootClientId The root client id for the block.
28
- * @property {number} blockIndex The block's index.
29
- * @property {Element} element The DOM element representing the block.
30
- * @property {number} innerBlockCount The number of inner blocks the block has.
31
- * @property {boolean} isDraggedBlock Whether the block is currently being dragged.
32
- * @property {boolean} canInsertDraggedBlocksAsSibling Whether the dragged block can be a sibling of this block.
33
- * @property {boolean} canInsertDraggedBlocksAsChild Whether the dragged block can be a child of this block.
34
- */
35
-
36
- /**
37
- * An object containing details of a drop target.
38
- *
39
- * @typedef {Object} WPListViewDropZoneTarget
40
- * @property {string} blockIndex The insertion index.
41
- * @property {string} rootClientId The root client id for the block.
42
- * @property {string|undefined} clientId The client id for the block.
43
- * @property {'top'|'bottom'|'inside'} dropPosition The position relative to the block that the user is dropping to.
44
- * 'inside' refers to nesting as an inner block.
45
- */
46
-
47
- /**
48
- * Determines whether the user positioning the dragged block to nest as an
49
- * inner block.
50
- *
51
- * Presently this is determined by whether the cursor is on the right hand side
52
- * of the block.
53
- *
54
- * @param {WPPoint} point The point representing the cursor position when dragging.
55
- * @param {DOMRect} rect The rectangle.
56
- */
57
-
58
- function isNestingGesture(point, rect) {
59
- const blockCenterX = rect.left + rect.width / 2;
60
- return point.x > blockCenterX;
61
- } // Block navigation is always a vertical list, so only allow dropping
62
- // to the above or below a block.
63
-
64
-
65
- const ALLOWED_DROP_EDGES = ['top', 'bottom'];
66
- /**
67
- * Given blocks data and the cursor position, compute the drop target.
68
- *
69
- * @param {WPListViewDropZoneBlocks} blocksData Data about the blocks in list view.
70
- * @param {WPPoint} position The point representing the cursor position when dragging.
71
- *
72
- * @return {WPListViewDropZoneTarget | undefined} An object containing data about the drop target.
73
- */
74
-
75
- function getListViewDropTarget(blocksData, position) {
76
- let candidateEdge;
77
- let candidateBlockData;
78
- let candidateDistance;
79
- let candidateRect;
80
-
81
- for (const blockData of blocksData) {
82
- if (blockData.isDraggedBlock) {
83
- continue;
84
- }
85
-
86
- const rect = blockData.element.getBoundingClientRect();
87
- const [distance, edge] = getDistanceToNearestEdge(position, rect, ALLOWED_DROP_EDGES);
88
- const isCursorWithinBlock = isPointContainedByRect(position, rect);
89
-
90
- if (candidateDistance === undefined || distance < candidateDistance || isCursorWithinBlock) {
91
- candidateDistance = distance;
92
- const index = blocksData.indexOf(blockData);
93
- const previousBlockData = blocksData[index - 1]; // If dragging near the top of a block and the preceding block
94
- // is at the same level, use the preceding block as the candidate
95
- // instead, as later it makes determining a nesting drop easier.
96
-
97
- if (edge === 'top' && previousBlockData && previousBlockData.rootClientId === blockData.rootClientId && !previousBlockData.isDraggedBlock) {
98
- candidateBlockData = previousBlockData;
99
- candidateEdge = 'bottom';
100
- candidateRect = previousBlockData.element.getBoundingClientRect();
101
- } else {
102
- candidateBlockData = blockData;
103
- candidateEdge = edge;
104
- candidateRect = rect;
105
- } // If the mouse position is within the block, break early
106
- // as the user would intend to drop either before or after
107
- // this block.
108
- //
109
- // This solves an issue where some rows in the list view
110
- // tree overlap slightly due to sub-pixel rendering.
111
-
112
-
113
- if (isCursorWithinBlock) {
114
- break;
115
- }
116
- }
117
- }
118
-
119
- if (!candidateBlockData) {
120
- return;
121
- }
122
-
123
- const isDraggingBelow = candidateEdge === 'bottom'; // If the user is dragging towards the bottom of the block check whether
124
- // they might be trying to nest the block as a child.
125
- // If the block already has inner blocks, this should always be treated
126
- // as nesting since the next block in the tree will be the first child.
127
-
128
- if (isDraggingBelow && candidateBlockData.canInsertDraggedBlocksAsChild && (candidateBlockData.innerBlockCount > 0 || isNestingGesture(position, candidateRect))) {
129
- return {
130
- rootClientId: candidateBlockData.clientId,
131
- blockIndex: 0,
132
- dropPosition: 'inside'
133
- };
134
- } // If dropping as a sibling, but block cannot be inserted in
135
- // this context, return early.
136
-
137
-
138
- if (!candidateBlockData.canInsertDraggedBlocksAsSibling) {
139
- return;
140
- }
141
-
142
- const offset = isDraggingBelow ? 1 : 0;
143
- return {
144
- rootClientId: candidateBlockData.rootClientId,
145
- clientId: candidateBlockData.clientId,
146
- blockIndex: candidateBlockData.blockIndex + offset,
147
- dropPosition: candidateEdge
148
- };
149
- }
150
- /**
151
- * A react hook for implementing a drop zone in list view.
152
- *
153
- * @return {WPListViewDropZoneTarget} The drop target.
154
- */
155
-
156
-
157
- export default function useListViewDropZone() {
158
- const {
159
- getBlockRootClientId,
160
- getBlockIndex,
161
- getBlockCount,
162
- getDraggedBlockClientIds,
163
- canInsertBlocks
164
- } = useSelect(blockEditorStore);
165
- const [target, setTarget] = useState();
166
- const {
167
- rootClientId: targetRootClientId,
168
- blockIndex: targetBlockIndex
169
- } = target || {};
170
- const onBlockDrop = useOnBlockDrop(targetRootClientId, targetBlockIndex);
171
- const draggedBlockClientIds = getDraggedBlockClientIds();
172
- const throttled = useThrottle(useCallback((event, currentTarget) => {
173
- const position = {
174
- x: event.clientX,
175
- y: event.clientY
176
- };
177
- const isBlockDrag = !!(draggedBlockClientIds !== null && draggedBlockClientIds !== void 0 && draggedBlockClientIds.length);
178
- const blockElements = Array.from(currentTarget.querySelectorAll('[data-block]'));
179
- const blocksData = blockElements.map(blockElement => {
180
- const clientId = blockElement.dataset.block;
181
- const rootClientId = getBlockRootClientId(clientId);
182
- return {
183
- clientId,
184
- rootClientId,
185
- blockIndex: getBlockIndex(clientId),
186
- element: blockElement,
187
- isDraggedBlock: isBlockDrag ? draggedBlockClientIds.includes(clientId) : false,
188
- innerBlockCount: getBlockCount(clientId),
189
- canInsertDraggedBlocksAsSibling: isBlockDrag ? canInsertBlocks(draggedBlockClientIds, rootClientId) : true,
190
- canInsertDraggedBlocksAsChild: isBlockDrag ? canInsertBlocks(draggedBlockClientIds, clientId) : true
191
- };
192
- });
193
- const newTarget = getListViewDropTarget(blocksData, position);
194
-
195
- if (newTarget) {
196
- setTarget(newTarget);
197
- }
198
- }, [draggedBlockClientIds]), 200);
199
- const ref = useDropZone({
200
- onDrop: onBlockDrop,
201
-
202
- onDragOver(event) {
203
- // `currentTarget` is only available while the event is being
204
- // handled, so get it now and pass it to the thottled function.
205
- // https://developer.mozilla.org/en-US/docs/Web/API/Event/currentTarget
206
- throttled(event, event.currentTarget);
207
- },
208
-
209
- onDragEnd() {
210
- throttled.cancel();
211
- setTarget(null);
212
- }
213
-
214
- });
215
- return {
216
- ref,
217
- target
218
- };
219
- }
220
- //# sourceMappingURL=use-list-view-drop-zone.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["@wordpress/block-editor/src/components/off-canvas-editor/use-list-view-drop-zone.js"],"names":["useSelect","useState","useCallback","useThrottle","__experimentalUseDropZone","useDropZone","getDistanceToNearestEdge","isPointContainedByRect","useOnBlockDrop","store","blockEditorStore","isNestingGesture","point","rect","blockCenterX","left","width","x","ALLOWED_DROP_EDGES","getListViewDropTarget","blocksData","position","candidateEdge","candidateBlockData","candidateDistance","candidateRect","blockData","isDraggedBlock","element","getBoundingClientRect","distance","edge","isCursorWithinBlock","undefined","index","indexOf","previousBlockData","rootClientId","isDraggingBelow","canInsertDraggedBlocksAsChild","innerBlockCount","clientId","blockIndex","dropPosition","canInsertDraggedBlocksAsSibling","offset","useListViewDropZone","getBlockRootClientId","getBlockIndex","getBlockCount","getDraggedBlockClientIds","canInsertBlocks","target","setTarget","targetRootClientId","targetBlockIndex","onBlockDrop","draggedBlockClientIds","throttled","event","currentTarget","clientX","y","clientY","isBlockDrag","length","blockElements","Array","from","querySelectorAll","map","blockElement","dataset","block","includes","newTarget","ref","onDrop","onDragOver","onDragEnd","cancel"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { useState, useCallback } from '@wordpress/element';\nimport {\n\tuseThrottle,\n\t__experimentalUseDropZone as useDropZone,\n} from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport {\n\tgetDistanceToNearestEdge,\n\tisPointContainedByRect,\n} from '../../utils/math';\nimport useOnBlockDrop from '../use-on-block-drop';\nimport { store as blockEditorStore } from '../../store';\n\n/** @typedef {import('../../utils/math').WPPoint} WPPoint */\n\n/**\n * The type of a drag event.\n *\n * @typedef {'default'|'file'|'html'} WPDragEventType\n */\n\n/**\n * An array representing data for blocks in the DOM used by drag and drop.\n *\n * @typedef {Object} WPListViewDropZoneBlocks\n * @property {string} clientId The client id for the block.\n * @property {string} rootClientId The root client id for the block.\n * @property {number} blockIndex The block's index.\n * @property {Element} element The DOM element representing the block.\n * @property {number} innerBlockCount The number of inner blocks the block has.\n * @property {boolean} isDraggedBlock Whether the block is currently being dragged.\n * @property {boolean} canInsertDraggedBlocksAsSibling Whether the dragged block can be a sibling of this block.\n * @property {boolean} canInsertDraggedBlocksAsChild Whether the dragged block can be a child of this block.\n */\n\n/**\n * An object containing details of a drop target.\n *\n * @typedef {Object} WPListViewDropZoneTarget\n * @property {string} blockIndex The insertion index.\n * @property {string} rootClientId The root client id for the block.\n * @property {string|undefined} clientId The client id for the block.\n * @property {'top'|'bottom'|'inside'} dropPosition The position relative to the block that the user is dropping to.\n * 'inside' refers to nesting as an inner block.\n */\n\n/**\n * Determines whether the user positioning the dragged block to nest as an\n * inner block.\n *\n * Presently this is determined by whether the cursor is on the right hand side\n * of the block.\n *\n * @param {WPPoint} point The point representing the cursor position when dragging.\n * @param {DOMRect} rect The rectangle.\n */\nfunction isNestingGesture( point, rect ) {\n\tconst blockCenterX = rect.left + rect.width / 2;\n\treturn point.x > blockCenterX;\n}\n\n// Block navigation is always a vertical list, so only allow dropping\n// to the above or below a block.\nconst ALLOWED_DROP_EDGES = [ 'top', 'bottom' ];\n\n/**\n * Given blocks data and the cursor position, compute the drop target.\n *\n * @param {WPListViewDropZoneBlocks} blocksData Data about the blocks in list view.\n * @param {WPPoint} position The point representing the cursor position when dragging.\n *\n * @return {WPListViewDropZoneTarget | undefined} An object containing data about the drop target.\n */\nfunction getListViewDropTarget( blocksData, position ) {\n\tlet candidateEdge;\n\tlet candidateBlockData;\n\tlet candidateDistance;\n\tlet candidateRect;\n\n\tfor ( const blockData of blocksData ) {\n\t\tif ( blockData.isDraggedBlock ) {\n\t\t\tcontinue;\n\t\t}\n\n\t\tconst rect = blockData.element.getBoundingClientRect();\n\t\tconst [ distance, edge ] = getDistanceToNearestEdge(\n\t\t\tposition,\n\t\t\trect,\n\t\t\tALLOWED_DROP_EDGES\n\t\t);\n\n\t\tconst isCursorWithinBlock = isPointContainedByRect( position, rect );\n\t\tif (\n\t\t\tcandidateDistance === undefined ||\n\t\t\tdistance < candidateDistance ||\n\t\t\tisCursorWithinBlock\n\t\t) {\n\t\t\tcandidateDistance = distance;\n\n\t\t\tconst index = blocksData.indexOf( blockData );\n\t\t\tconst previousBlockData = blocksData[ index - 1 ];\n\n\t\t\t// If dragging near the top of a block and the preceding block\n\t\t\t// is at the same level, use the preceding block as the candidate\n\t\t\t// instead, as later it makes determining a nesting drop easier.\n\t\t\tif (\n\t\t\t\tedge === 'top' &&\n\t\t\t\tpreviousBlockData &&\n\t\t\t\tpreviousBlockData.rootClientId === blockData.rootClientId &&\n\t\t\t\t! previousBlockData.isDraggedBlock\n\t\t\t) {\n\t\t\t\tcandidateBlockData = previousBlockData;\n\t\t\t\tcandidateEdge = 'bottom';\n\t\t\t\tcandidateRect =\n\t\t\t\t\tpreviousBlockData.element.getBoundingClientRect();\n\t\t\t} else {\n\t\t\t\tcandidateBlockData = blockData;\n\t\t\t\tcandidateEdge = edge;\n\t\t\t\tcandidateRect = rect;\n\t\t\t}\n\n\t\t\t// If the mouse position is within the block, break early\n\t\t\t// as the user would intend to drop either before or after\n\t\t\t// this block.\n\t\t\t//\n\t\t\t// This solves an issue where some rows in the list view\n\t\t\t// tree overlap slightly due to sub-pixel rendering.\n\t\t\tif ( isCursorWithinBlock ) {\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\t}\n\n\tif ( ! candidateBlockData ) {\n\t\treturn;\n\t}\n\n\tconst isDraggingBelow = candidateEdge === 'bottom';\n\n\t// If the user is dragging towards the bottom of the block check whether\n\t// they might be trying to nest the block as a child.\n\t// If the block already has inner blocks, this should always be treated\n\t// as nesting since the next block in the tree will be the first child.\n\tif (\n\t\tisDraggingBelow &&\n\t\tcandidateBlockData.canInsertDraggedBlocksAsChild &&\n\t\t( candidateBlockData.innerBlockCount > 0 ||\n\t\t\tisNestingGesture( position, candidateRect ) )\n\t) {\n\t\treturn {\n\t\t\trootClientId: candidateBlockData.clientId,\n\t\t\tblockIndex: 0,\n\t\t\tdropPosition: 'inside',\n\t\t};\n\t}\n\n\t// If dropping as a sibling, but block cannot be inserted in\n\t// this context, return early.\n\tif ( ! candidateBlockData.canInsertDraggedBlocksAsSibling ) {\n\t\treturn;\n\t}\n\n\tconst offset = isDraggingBelow ? 1 : 0;\n\treturn {\n\t\trootClientId: candidateBlockData.rootClientId,\n\t\tclientId: candidateBlockData.clientId,\n\t\tblockIndex: candidateBlockData.blockIndex + offset,\n\t\tdropPosition: candidateEdge,\n\t};\n}\n\n/**\n * A react hook for implementing a drop zone in list view.\n *\n * @return {WPListViewDropZoneTarget} The drop target.\n */\nexport default function useListViewDropZone() {\n\tconst {\n\t\tgetBlockRootClientId,\n\t\tgetBlockIndex,\n\t\tgetBlockCount,\n\t\tgetDraggedBlockClientIds,\n\t\tcanInsertBlocks,\n\t} = useSelect( blockEditorStore );\n\tconst [ target, setTarget ] = useState();\n\tconst { rootClientId: targetRootClientId, blockIndex: targetBlockIndex } =\n\t\ttarget || {};\n\n\tconst onBlockDrop = useOnBlockDrop( targetRootClientId, targetBlockIndex );\n\n\tconst draggedBlockClientIds = getDraggedBlockClientIds();\n\tconst throttled = useThrottle(\n\t\tuseCallback(\n\t\t\t( event, currentTarget ) => {\n\t\t\t\tconst position = { x: event.clientX, y: event.clientY };\n\t\t\t\tconst isBlockDrag = !! draggedBlockClientIds?.length;\n\n\t\t\t\tconst blockElements = Array.from(\n\t\t\t\t\tcurrentTarget.querySelectorAll( '[data-block]' )\n\t\t\t\t);\n\n\t\t\t\tconst blocksData = blockElements.map( ( blockElement ) => {\n\t\t\t\t\tconst clientId = blockElement.dataset.block;\n\t\t\t\t\tconst rootClientId = getBlockRootClientId( clientId );\n\n\t\t\t\t\treturn {\n\t\t\t\t\t\tclientId,\n\t\t\t\t\t\trootClientId,\n\t\t\t\t\t\tblockIndex: getBlockIndex( clientId ),\n\t\t\t\t\t\telement: blockElement,\n\t\t\t\t\t\tisDraggedBlock: isBlockDrag\n\t\t\t\t\t\t\t? draggedBlockClientIds.includes( clientId )\n\t\t\t\t\t\t\t: false,\n\t\t\t\t\t\tinnerBlockCount: getBlockCount( clientId ),\n\t\t\t\t\t\tcanInsertDraggedBlocksAsSibling: isBlockDrag\n\t\t\t\t\t\t\t? canInsertBlocks(\n\t\t\t\t\t\t\t\t\tdraggedBlockClientIds,\n\t\t\t\t\t\t\t\t\trootClientId\n\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t: true,\n\t\t\t\t\t\tcanInsertDraggedBlocksAsChild: isBlockDrag\n\t\t\t\t\t\t\t? canInsertBlocks( draggedBlockClientIds, clientId )\n\t\t\t\t\t\t\t: true,\n\t\t\t\t\t};\n\t\t\t\t} );\n\n\t\t\t\tconst newTarget = getListViewDropTarget( blocksData, position );\n\n\t\t\t\tif ( newTarget ) {\n\t\t\t\t\tsetTarget( newTarget );\n\t\t\t\t}\n\t\t\t},\n\t\t\t[ draggedBlockClientIds ]\n\t\t),\n\t\t200\n\t);\n\n\tconst ref = useDropZone( {\n\t\tonDrop: onBlockDrop,\n\t\tonDragOver( event ) {\n\t\t\t// `currentTarget` is only available while the event is being\n\t\t\t// handled, so get it now and pass it to the thottled function.\n\t\t\t// https://developer.mozilla.org/en-US/docs/Web/API/Event/currentTarget\n\t\t\tthrottled( event, event.currentTarget );\n\t\t},\n\t\tonDragEnd() {\n\t\t\tthrottled.cancel();\n\t\t\tsetTarget( null );\n\t\t},\n\t} );\n\n\treturn { ref, target };\n}\n"]}
@@ -1,50 +0,0 @@
1
- /**
2
- * WordPress dependencies
3
- */
4
- import { useEffect, useState } from '@wordpress/element';
5
- import { useSelect } from '@wordpress/data';
6
- /**
7
- * Internal dependencies
8
- */
9
-
10
- import { store as blockEditorStore } from '../../store';
11
- export default function useListViewExpandSelectedItem(_ref) {
12
- let {
13
- firstSelectedBlockClientId,
14
- setExpandedState
15
- } = _ref;
16
- const [selectedTreeId, setSelectedTreeId] = useState(null);
17
- const {
18
- selectedBlockParentClientIds
19
- } = useSelect(select => {
20
- const {
21
- getBlockParents
22
- } = select(blockEditorStore);
23
- return {
24
- selectedBlockParentClientIds: getBlockParents(firstSelectedBlockClientId, false)
25
- };
26
- }, [firstSelectedBlockClientId]);
27
- const parentClientIds = Array.isArray(selectedBlockParentClientIds) && selectedBlockParentClientIds.length ? selectedBlockParentClientIds : null; // Expand tree when a block is selected.
28
-
29
- useEffect(() => {
30
- // If the selectedTreeId is the same as the selected block,
31
- // it means that the block was selected using the block list tree.
32
- if (selectedTreeId === firstSelectedBlockClientId) {
33
- return;
34
- } // If the selected block has parents, get the top-level parent.
35
-
36
-
37
- if (parentClientIds) {
38
- // If the selected block has parents,
39
- // expand the tree branch.
40
- setExpandedState({
41
- type: 'expand',
42
- clientIds: selectedBlockParentClientIds
43
- });
44
- }
45
- }, [firstSelectedBlockClientId]);
46
- return {
47
- setSelectedTreeId
48
- };
49
- }
50
- //# sourceMappingURL=use-list-view-expand-selected-item.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["@wordpress/block-editor/src/components/off-canvas-editor/use-list-view-expand-selected-item.js"],"names":["useEffect","useState","useSelect","store","blockEditorStore","useListViewExpandSelectedItem","firstSelectedBlockClientId","setExpandedState","selectedTreeId","setSelectedTreeId","selectedBlockParentClientIds","select","getBlockParents","parentClientIds","Array","isArray","length","type","clientIds"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAT,EAAoBC,QAApB,QAAoC,oBAApC;AACA,SAASC,SAAT,QAA0B,iBAA1B;AAEA;AACA;AACA;;AACA,SAASC,KAAK,IAAIC,gBAAlB,QAA0C,aAA1C;AAEA,eAAe,SAASC,6BAAT,OAGX;AAAA,MAHmD;AACtDC,IAAAA,0BADsD;AAEtDC,IAAAA;AAFsD,GAGnD;AACH,QAAM,CAAEC,cAAF,EAAkBC,iBAAlB,IAAwCR,QAAQ,CAAE,IAAF,CAAtD;AACA,QAAM;AAAES,IAAAA;AAAF,MAAmCR,SAAS,CAC/CS,MAAF,IAAc;AACb,UAAM;AAAEC,MAAAA;AAAF,QAAsBD,MAAM,CAAEP,gBAAF,CAAlC;AACA,WAAO;AACNM,MAAAA,4BAA4B,EAAEE,eAAe,CAC5CN,0BAD4C,EAE5C,KAF4C;AADvC,KAAP;AAMA,GATgD,EAUjD,CAAEA,0BAAF,CAViD,CAAlD;AAaA,QAAMO,eAAe,GACpBC,KAAK,CAACC,OAAN,CAAeL,4BAAf,KACAA,4BAA4B,CAACM,MAD7B,GAEGN,4BAFH,GAGG,IAJJ,CAfG,CAqBH;;AACAV,EAAAA,SAAS,CAAE,MAAM;AAChB;AACA;AACA,QAAKQ,cAAc,KAAKF,0BAAxB,EAAqD;AACpD;AACA,KALe,CAOhB;;;AACA,QAAKO,eAAL,EAAuB;AACtB;AACA;AACAN,MAAAA,gBAAgB,CAAE;AACjBU,QAAAA,IAAI,EAAE,QADW;AAEjBC,QAAAA,SAAS,EAAER;AAFM,OAAF,CAAhB;AAIA;AACD,GAhBQ,EAgBN,CAAEJ,0BAAF,CAhBM,CAAT;AAkBA,SAAO;AACNG,IAAAA;AADM,GAAP;AAGA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useEffect, useState } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\n\nexport default function useListViewExpandSelectedItem( {\n\tfirstSelectedBlockClientId,\n\tsetExpandedState,\n} ) {\n\tconst [ selectedTreeId, setSelectedTreeId ] = useState( null );\n\tconst { selectedBlockParentClientIds } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockParents } = select( blockEditorStore );\n\t\t\treturn {\n\t\t\t\tselectedBlockParentClientIds: getBlockParents(\n\t\t\t\t\tfirstSelectedBlockClientId,\n\t\t\t\t\tfalse\n\t\t\t\t),\n\t\t\t};\n\t\t},\n\t\t[ firstSelectedBlockClientId ]\n\t);\n\n\tconst parentClientIds =\n\t\tArray.isArray( selectedBlockParentClientIds ) &&\n\t\tselectedBlockParentClientIds.length\n\t\t\t? selectedBlockParentClientIds\n\t\t\t: null;\n\n\t// Expand tree when a block is selected.\n\tuseEffect( () => {\n\t\t// If the selectedTreeId is the same as the selected block,\n\t\t// it means that the block was selected using the block list tree.\n\t\tif ( selectedTreeId === firstSelectedBlockClientId ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// If the selected block has parents, get the top-level parent.\n\t\tif ( parentClientIds ) {\n\t\t\t// If the selected block has parents,\n\t\t\t// expand the tree branch.\n\t\t\tsetExpandedState( {\n\t\t\t\ttype: 'expand',\n\t\t\t\tclientIds: selectedBlockParentClientIds,\n\t\t\t} );\n\t\t}\n\t}, [ firstSelectedBlockClientId ] );\n\n\treturn {\n\t\tsetSelectedTreeId,\n\t};\n}\n"]}
@@ -1,44 +0,0 @@
1
- /**
2
- * WordPress dependencies
3
- */
4
- import { __, sprintf } from '@wordpress/i18n';
5
- export const getBlockPositionDescription = (position, siblingCount, level) => sprintf(
6
- /* translators: 1: The numerical position of the block. 2: The total number of blocks. 3. The level of nesting for the block. */
7
- __('Block %1$d of %2$d, Level %3$d'), position, siblingCount, level);
8
- /**
9
- * Returns true if the client ID occurs within the block selection or multi-selection,
10
- * or false otherwise.
11
- *
12
- * @param {string} clientId Block client ID.
13
- * @param {string|string[]} selectedBlockClientIds Selected block client ID, or an array of multi-selected blocks client IDs.
14
- *
15
- * @return {boolean} Whether the block is in multi-selection set.
16
- */
17
-
18
- export const isClientIdSelected = (clientId, selectedBlockClientIds) => Array.isArray(selectedBlockClientIds) && selectedBlockClientIds.length ? selectedBlockClientIds.indexOf(clientId) !== -1 : selectedBlockClientIds === clientId;
19
- /**
20
- * From a start and end clientId of potentially different nesting levels,
21
- * return the nearest-depth ids that have a common level of depth in the
22
- * nesting hierarchy. For multiple block selection, this ensure that the
23
- * selection is always at the same nesting level, and not split across
24
- * separate levels.
25
- *
26
- * @param {string} startId The first id of a selection.
27
- * @param {string} endId The end id of a selection, usually one that has been clicked on.
28
- * @param {string[]} startParents An array of ancestor ids for the start id, in descending order.
29
- * @param {string[]} endParents An array of ancestor ids for the end id, in descending order.
30
- * @return {Object} An object containing the start and end ids.
31
- */
32
-
33
- export function getCommonDepthClientIds(startId, endId, startParents, endParents) {
34
- const startPath = [...startParents, startId];
35
- const endPath = [...endParents, endId];
36
- const depth = Math.min(startPath.length, endPath.length) - 1;
37
- const start = startPath[depth];
38
- const end = endPath[depth];
39
- return {
40
- start,
41
- end
42
- };
43
- }
44
- //# sourceMappingURL=utils.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["@wordpress/block-editor/src/components/off-canvas-editor/utils.js"],"names":["__","sprintf","getBlockPositionDescription","position","siblingCount","level","isClientIdSelected","clientId","selectedBlockClientIds","Array","isArray","length","indexOf","getCommonDepthClientIds","startId","endId","startParents","endParents","startPath","endPath","depth","Math","min","start","end"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,EAAT,EAAaC,OAAb,QAA4B,iBAA5B;AAEA,OAAO,MAAMC,2BAA2B,GAAG,CAAEC,QAAF,EAAYC,YAAZ,EAA0BC,KAA1B,KAC1CJ,OAAO;AACN;AACAD,EAAE,CAAE,gCAAF,CAFI,EAGNG,QAHM,EAINC,YAJM,EAKNC,KALM,CADD;AASP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMC,kBAAkB,GAAG,CAAEC,QAAF,EAAYC,sBAAZ,KACjCC,KAAK,CAACC,OAAN,CAAeF,sBAAf,KAA2CA,sBAAsB,CAACG,MAAlE,GACGH,sBAAsB,CAACI,OAAvB,CAAgCL,QAAhC,MAA+C,CAAC,CADnD,GAEGC,sBAAsB,KAAKD,QAHxB;AAKP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASM,uBAAT,CACNC,OADM,EAENC,KAFM,EAGNC,YAHM,EAINC,UAJM,EAKL;AACD,QAAMC,SAAS,GAAG,CAAE,GAAGF,YAAL,EAAmBF,OAAnB,CAAlB;AACA,QAAMK,OAAO,GAAG,CAAE,GAAGF,UAAL,EAAiBF,KAAjB,CAAhB;AACA,QAAMK,KAAK,GAAGC,IAAI,CAACC,GAAL,CAAUJ,SAAS,CAACP,MAApB,EAA4BQ,OAAO,CAACR,MAApC,IAA+C,CAA7D;AACA,QAAMY,KAAK,GAAGL,SAAS,CAAEE,KAAF,CAAvB;AACA,QAAMI,GAAG,GAAGL,OAAO,CAAEC,KAAF,CAAnB;AAEA,SAAO;AACNG,IAAAA,KADM;AAENC,IAAAA;AAFM,GAAP;AAIA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\n\nexport const getBlockPositionDescription = ( position, siblingCount, level ) =>\n\tsprintf(\n\t\t/* translators: 1: The numerical position of the block. 2: The total number of blocks. 3. The level of nesting for the block. */\n\t\t__( 'Block %1$d of %2$d, Level %3$d' ),\n\t\tposition,\n\t\tsiblingCount,\n\t\tlevel\n\t);\n\n/**\n * Returns true if the client ID occurs within the block selection or multi-selection,\n * or false otherwise.\n *\n * @param {string} clientId Block client ID.\n * @param {string|string[]} selectedBlockClientIds Selected block client ID, or an array of multi-selected blocks client IDs.\n *\n * @return {boolean} Whether the block is in multi-selection set.\n */\nexport const isClientIdSelected = ( clientId, selectedBlockClientIds ) =>\n\tArray.isArray( selectedBlockClientIds ) && selectedBlockClientIds.length\n\t\t? selectedBlockClientIds.indexOf( clientId ) !== -1\n\t\t: selectedBlockClientIds === clientId;\n\n/**\n * From a start and end clientId of potentially different nesting levels,\n * return the nearest-depth ids that have a common level of depth in the\n * nesting hierarchy. For multiple block selection, this ensure that the\n * selection is always at the same nesting level, and not split across\n * separate levels.\n *\n * @param {string} startId The first id of a selection.\n * @param {string} endId The end id of a selection, usually one that has been clicked on.\n * @param {string[]} startParents An array of ancestor ids for the start id, in descending order.\n * @param {string[]} endParents An array of ancestor ids for the end id, in descending order.\n * @return {Object} An object containing the start and end ids.\n */\nexport function getCommonDepthClientIds(\n\tstartId,\n\tendId,\n\tstartParents,\n\tendParents\n) {\n\tconst startPath = [ ...startParents, startId ];\n\tconst endPath = [ ...endParents, endId ];\n\tconst depth = Math.min( startPath.length, endPath.length ) - 1;\n\tconst start = startPath[ depth ];\n\tconst end = endPath[ depth ];\n\n\treturn {\n\t\tstart,\n\t\tend,\n\t};\n}\n"]}
@@ -1,63 +0,0 @@
1
- /**
2
- * External dependencies
3
- */
4
- import { View } from 'react-native';
5
-
6
- /**
7
- * WordPress dependencies
8
- */
9
- import { store as blockEditorStore } from '@wordpress/block-editor';
10
- import { useSelect } from '@wordpress/data';
11
-
12
- /**
13
- * Internal dependencies
14
- */
15
- import styles from './style.scss';
16
- import BlockListBlock from './block';
17
-
18
- /**
19
- * NOTE: This is a component currently used by the List block (V2)
20
- * It only passes the needed props for this block, if other blocks will use it
21
- * make sure you pass other props that might be required coming from:
22
- * components/inner-blocks/index.native.js
23
- */
24
-
25
- function BlockListCompact( props ) {
26
- const {
27
- marginHorizontal = styles.defaultBlock.marginLeft,
28
- marginVertical = styles.defaultBlock.marginTop,
29
- rootClientId,
30
- } = props;
31
- const { blockClientIds } = useSelect(
32
- ( select ) => {
33
- const { getBlockOrder } = select( blockEditorStore );
34
- const blockOrder = getBlockOrder( rootClientId );
35
-
36
- return {
37
- blockClientIds: blockOrder,
38
- };
39
- },
40
- [ rootClientId ]
41
- );
42
-
43
- const containerStyle = {
44
- marginVertical: -marginVertical,
45
- marginHorizontal: -marginHorizontal,
46
- };
47
-
48
- return (
49
- <View style={ containerStyle } testID="block-list-wrapper">
50
- { blockClientIds.map( ( currentClientId ) => (
51
- <BlockListBlock
52
- clientId={ currentClientId }
53
- rootClientId={ rootClientId }
54
- key={ currentClientId }
55
- marginHorizontal={ marginHorizontal }
56
- marginVertical={ marginVertical }
57
- />
58
- ) ) }
59
- </View>
60
- );
61
- }
62
-
63
- export default BlockListCompact;
@@ -1,5 +0,0 @@
1
- # Off Canvas Editor
2
-
3
- The OffCanvasEditor component is a modified ListView compoent. It provides an overview of the hierarchical structure of all blocks in the editor. The blocks are presented vertically one below the other. It enables editing of hierarchy and addition of elements in the block tree without selecting the block instance on the canvas.
4
-
5
- It is an experimental component which may end up completely merged into the ListView component via configuration props.
@@ -1,124 +0,0 @@
1
- /**
2
- * WordPress dependencies
3
- */
4
- import { useInstanceId } from '@wordpress/compose';
5
- import { speak } from '@wordpress/a11y';
6
- import { useSelect } from '@wordpress/data';
7
- import {
8
- forwardRef,
9
- useState,
10
- useEffect,
11
- useCallback,
12
- } from '@wordpress/element';
13
- import { __, sprintf } from '@wordpress/i18n';
14
-
15
- /**
16
- * Internal dependencies
17
- */
18
- import { store as blockEditorStore } from '../../store';
19
- import useBlockDisplayTitle from '../block-title/use-block-display-title';
20
- import { ComposedPrivateInserter as PrivateInserter } from '../inserter';
21
-
22
- const prioritizedInserterBlocks = [
23
- 'core/navigation-link/page',
24
- 'core/navigation-link',
25
- ];
26
-
27
- export const Appender = forwardRef(
28
- ( { nestingLevel, blockCount, clientId, ...props }, ref ) => {
29
- const [ insertedBlock, setInsertedBlock ] = useState( null );
30
-
31
- const instanceId = useInstanceId( Appender );
32
- const { hideInserter } = useSelect(
33
- ( select ) => {
34
- const { getTemplateLock, __unstableGetEditorMode } =
35
- select( blockEditorStore );
36
-
37
- return {
38
- hideInserter:
39
- !! getTemplateLock( clientId ) ||
40
- __unstableGetEditorMode() === 'zoom-out',
41
- };
42
- },
43
- [ clientId ]
44
- );
45
-
46
- const blockTitle = useBlockDisplayTitle( {
47
- clientId,
48
- context: 'list-view',
49
- } );
50
-
51
- const insertedBlockTitle = useBlockDisplayTitle( {
52
- clientId: insertedBlock?.clientId,
53
- context: 'list-view',
54
- } );
55
-
56
- useEffect( () => {
57
- if ( ! insertedBlockTitle?.length ) {
58
- return;
59
- }
60
-
61
- speak(
62
- sprintf(
63
- // translators: %s: name of block being inserted (i.e. Paragraph, Image, Group etc)
64
- __( '%s block inserted' ),
65
- insertedBlockTitle
66
- ),
67
- 'assertive'
68
- );
69
- }, [ insertedBlockTitle ] );
70
-
71
- const orderInitialBlockItems = useCallback( ( items ) => {
72
- items.sort( ( { id: aName }, { id: bName } ) => {
73
- // Sort block items according to `prioritizedInserterBlocks`.
74
- let aIndex = prioritizedInserterBlocks.indexOf( aName );
75
- let bIndex = prioritizedInserterBlocks.indexOf( bName );
76
- // All other block items should come after that.
77
- if ( aIndex < 0 ) aIndex = prioritizedInserterBlocks.length;
78
- if ( bIndex < 0 ) bIndex = prioritizedInserterBlocks.length;
79
- return aIndex - bIndex;
80
- } );
81
- return items;
82
- }, [] );
83
-
84
- if ( hideInserter ) {
85
- return null;
86
- }
87
- const descriptionId = `off-canvas-editor-appender__${ instanceId }`;
88
- const description = sprintf(
89
- /* translators: 1: The name of the block. 2: The numerical position of the block. 3: The level of nesting for the block. */
90
- __( 'Append to %1$s block at position %2$d, Level %3$d' ),
91
- blockTitle,
92
- blockCount + 1,
93
- nestingLevel
94
- );
95
-
96
- return (
97
- <div className="offcanvas-editor-appender">
98
- <PrivateInserter
99
- ref={ ref }
100
- rootClientId={ clientId }
101
- position="bottom right"
102
- isAppender
103
- selectBlockOnInsert={ false }
104
- shouldDirectInsert={ false }
105
- __experimentalIsQuick
106
- { ...props }
107
- toggleProps={ { 'aria-describedby': descriptionId } }
108
- onSelectOrClose={ ( maybeInsertedBlock ) => {
109
- if ( maybeInsertedBlock?.clientId ) {
110
- setInsertedBlock( maybeInsertedBlock );
111
- }
112
- } }
113
- orderInitialBlockItems={ orderInitialBlockItems }
114
- />
115
- <div
116
- className="offcanvas-editor-appender__description"
117
- id={ descriptionId }
118
- >
119
- { description }
120
- </div>
121
- </div>
122
- );
123
- }
124
- );