@wordpress/block-editor 8.0.16 → 8.1.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 (436) hide show
  1. package/CHANGELOG.md +2 -0
  2. package/LICENSE.md +1 -1
  3. package/README.md +12 -1
  4. package/build/components/block-caption/index.native.js +14 -3
  5. package/build/components/block-caption/index.native.js.map +1 -1
  6. package/build/components/block-edit/index.js +9 -0
  7. package/build/components/block-edit/index.js.map +1 -1
  8. package/build/components/block-inspector/index.js +8 -20
  9. package/build/components/block-inspector/index.js.map +1 -1
  10. package/build/components/block-list-appender/index.js +3 -11
  11. package/build/components/block-list-appender/index.js.map +1 -1
  12. package/build/components/block-media-update-progress/index.native.js +2 -1
  13. package/build/components/block-media-update-progress/index.native.js.map +1 -1
  14. package/build/components/block-preview/auto.js +10 -2
  15. package/build/components/block-preview/auto.js.map +1 -1
  16. package/build/components/block-settings/container.native.js +2 -1
  17. package/build/components/block-settings/container.native.js.map +1 -1
  18. package/build/components/block-styles/index.js +110 -134
  19. package/build/components/block-styles/index.js.map +1 -1
  20. package/build/components/block-styles/menu-items.js +63 -0
  21. package/build/components/block-styles/menu-items.js.map +1 -0
  22. package/build/components/block-styles/preview-panel.js +45 -0
  23. package/build/components/block-styles/preview-panel.js.map +1 -0
  24. package/build/components/block-styles/preview.native.js +2 -2
  25. package/build/components/block-styles/preview.native.js.map +1 -1
  26. package/build/components/block-styles/use-styles-for-block.js +119 -0
  27. package/build/components/block-styles/use-styles-for-block.js.map +1 -0
  28. package/build/components/block-styles/utils.js +39 -0
  29. package/build/components/block-styles/utils.js.map +1 -1
  30. package/build/components/block-switcher/block-styles-menu.js +3 -23
  31. package/build/components/block-switcher/block-styles-menu.js.map +1 -1
  32. package/build/components/block-tools/back-compat.js +2 -1
  33. package/build/components/block-tools/back-compat.js.map +1 -1
  34. package/build/components/block-tools/block-selection-button.js +5 -1
  35. package/build/components/block-tools/block-selection-button.js.map +1 -1
  36. package/build/components/block-tools/insertion-point.js +11 -1
  37. package/build/components/block-tools/insertion-point.js.map +1 -1
  38. package/build/components/block-types-list/index.native.js +2 -2
  39. package/build/components/block-types-list/index.native.js.map +1 -1
  40. package/build/components/button-block-appender/index.js +2 -1
  41. package/build/components/button-block-appender/index.js.map +1 -1
  42. package/build/components/colors-gradients/dropdown.js +88 -0
  43. package/build/components/colors-gradients/dropdown.js.map +1 -0
  44. package/build/components/colors-gradients/panel-color-gradient-settings.js +6 -5
  45. package/build/components/colors-gradients/panel-color-gradient-settings.js.map +1 -1
  46. package/build/components/colors-gradients/panel-color-gradient-settings.native.js +6 -3
  47. package/build/components/colors-gradients/panel-color-gradient-settings.native.js.map +1 -1
  48. package/build/components/contrast-checker/index.js +34 -9
  49. package/build/components/contrast-checker/index.js.map +1 -1
  50. package/build/components/contrast-checker/index.native.js +108 -0
  51. package/build/components/contrast-checker/index.native.js.map +1 -0
  52. package/build/components/default-block-appender/index.js +16 -19
  53. package/build/components/default-block-appender/index.js.map +1 -1
  54. package/build/components/default-style-picker/index.js +18 -3
  55. package/build/components/default-style-picker/index.js.map +1 -1
  56. package/build/components/iframe/index.js +4 -5
  57. package/build/components/iframe/index.js.map +1 -1
  58. package/build/components/index.js +18 -9
  59. package/build/components/index.js.map +1 -1
  60. package/build/components/index.native.js +9 -0
  61. package/build/components/index.native.js.map +1 -1
  62. package/build/components/inner-blocks/default-block-appender.js +2 -4
  63. package/build/components/inner-blocks/default-block-appender.js.map +1 -1
  64. package/build/components/inner-blocks/use-nested-settings-update.js +16 -14
  65. package/build/components/inner-blocks/use-nested-settings-update.js.map +1 -1
  66. package/build/components/inserter/index.js +61 -3
  67. package/build/components/inserter/index.js.map +1 -1
  68. package/build/components/inserter/index.native.js +1 -1
  69. package/build/components/inserter/index.native.js.map +1 -1
  70. package/build/components/inserter/library.js +5 -3
  71. package/build/components/inserter/library.js.map +1 -1
  72. package/build/components/inserter/menu.js +11 -3
  73. package/build/components/inserter/menu.js.map +1 -1
  74. package/build/components/inserter/tabs.native.js +7 -4
  75. package/build/components/inserter/tabs.native.js.map +1 -1
  76. package/build/components/inspector-controls/block-support-slot-container.js +2 -1
  77. package/build/components/inspector-controls/block-support-slot-container.js.map +1 -1
  78. package/build/components/inspector-controls/block-support-tools-panel.js +11 -43
  79. package/build/components/inspector-controls/block-support-tools-panel.js.map +1 -1
  80. package/build/components/inspector-controls/fill.native.js +3 -5
  81. package/build/components/inspector-controls/fill.native.js.map +1 -1
  82. package/build/components/inspector-controls/groups.js +2 -0
  83. package/build/components/inspector-controls/groups.js.map +1 -1
  84. package/build/components/inspector-controls/slot.js +1 -3
  85. package/build/components/inspector-controls/slot.js.map +1 -1
  86. package/build/components/letter-spacing-control/index.js +6 -6
  87. package/build/components/letter-spacing-control/index.js.map +1 -1
  88. package/build/components/link-control/link-preview.js +1 -1
  89. package/build/components/link-control/link-preview.js.map +1 -1
  90. package/build/components/link-control/search-item.js +11 -1
  91. package/build/components/link-control/search-item.js.map +1 -1
  92. package/build/components/link-control/search-results.js +2 -1
  93. package/build/components/link-control/search-results.js.map +1 -1
  94. package/build/components/link-control/use-search-handler.js +18 -5
  95. package/build/components/link-control/use-search-handler.js.map +1 -1
  96. package/build/components/list-view/block-select-button.js +23 -3
  97. package/build/components/list-view/block-select-button.js.map +1 -1
  98. package/build/components/list-view/block.js +8 -0
  99. package/build/components/list-view/block.js.map +1 -1
  100. package/build/components/media-placeholder/index.js +2 -0
  101. package/build/components/media-placeholder/index.js.map +1 -1
  102. package/build/components/media-replace-flow/index.js +32 -6
  103. package/build/components/media-replace-flow/index.js.map +1 -1
  104. package/build/components/media-upload-progress/index.native.js +2 -1
  105. package/build/components/media-upload-progress/index.native.js.map +1 -1
  106. package/build/components/panel-color-settings/index.js +7 -3
  107. package/build/components/panel-color-settings/index.js.map +1 -1
  108. package/build/components/provider/block-refs-provider.js +4 -1
  109. package/build/components/provider/block-refs-provider.js.map +1 -1
  110. package/build/components/rich-text/file-paste-handler.js +1 -1
  111. package/build/components/rich-text/file-paste-handler.js.map +1 -1
  112. package/build/components/rich-text/prevent-event-discovery.js +33 -0
  113. package/build/components/rich-text/prevent-event-discovery.js.map +1 -0
  114. package/build/components/rich-text/use-input-rules.js +3 -1
  115. package/build/components/rich-text/use-input-rules.js.map +1 -1
  116. package/build/components/selection-scroll-into-view/index.js +2 -1
  117. package/build/components/selection-scroll-into-view/index.js.map +1 -1
  118. package/build/components/use-display-block-controls/index.native.js +45 -0
  119. package/build/components/use-display-block-controls/index.native.js.map +1 -0
  120. package/build/components/use-on-block-drop/index.js +7 -3
  121. package/build/components/use-on-block-drop/index.js.map +1 -1
  122. package/build/components/writing-flow/use-multi-selection.js +3 -1
  123. package/build/components/writing-flow/use-multi-selection.js.map +1 -1
  124. package/build/hooks/border-color.js +74 -10
  125. package/build/hooks/border-color.js.map +1 -1
  126. package/build/hooks/border-radius.js +47 -0
  127. package/build/hooks/border-radius.js.map +1 -1
  128. package/build/hooks/border-style.js +41 -0
  129. package/build/hooks/border-style.js.map +1 -1
  130. package/build/hooks/border-width.js +70 -31
  131. package/build/hooks/border-width.js.map +1 -1
  132. package/build/hooks/border.js +81 -11
  133. package/build/hooks/border.js.map +1 -1
  134. package/build/hooks/color-panel.js +4 -1
  135. package/build/hooks/color-panel.js.map +1 -1
  136. package/build/hooks/color-panel.native.js +77 -0
  137. package/build/hooks/color-panel.native.js.map +1 -0
  138. package/build/hooks/color.js +6 -5
  139. package/build/hooks/color.js.map +1 -1
  140. package/build/hooks/index.native.js +2 -0
  141. package/build/hooks/index.native.js.map +1 -1
  142. package/build/hooks/layout.native.js +20 -0
  143. package/build/hooks/layout.native.js.map +1 -0
  144. package/build/hooks/letter-spacing.js +1 -1
  145. package/build/hooks/letter-spacing.js.map +1 -1
  146. package/build/hooks/typography.js +1 -1
  147. package/build/hooks/typography.js.map +1 -1
  148. package/build/store/actions.js +1 -2
  149. package/build/store/actions.js.map +1 -1
  150. package/build/store/defaults.js +5 -1
  151. package/build/store/defaults.js.map +1 -1
  152. package/build/store/defaults.native.js +2 -6
  153. package/build/store/defaults.native.js.map +1 -1
  154. package/build/store/selectors.js +10 -5
  155. package/build/store/selectors.js.map +1 -1
  156. package/build/utils/get-paste-event-data.js +1 -1
  157. package/build/utils/get-paste-event-data.js.map +1 -1
  158. package/build/utils/parse-css-unit-to-px.js +1 -1
  159. package/build/utils/parse-css-unit-to-px.js.map +1 -1
  160. package/build-module/components/block-caption/index.native.js +13 -3
  161. package/build-module/components/block-caption/index.native.js.map +1 -1
  162. package/build-module/components/block-edit/index.js +9 -0
  163. package/build-module/components/block-edit/index.js.map +1 -1
  164. package/build-module/components/block-inspector/index.js +8 -20
  165. package/build-module/components/block-inspector/index.js.map +1 -1
  166. package/build-module/components/block-list-appender/index.js +3 -10
  167. package/build-module/components/block-list-appender/index.js.map +1 -1
  168. package/build-module/components/block-media-update-progress/index.native.js +2 -1
  169. package/build-module/components/block-media-update-progress/index.native.js.map +1 -1
  170. package/build-module/components/block-preview/auto.js +10 -2
  171. package/build-module/components/block-preview/auto.js.map +1 -1
  172. package/build-module/components/block-settings/container.native.js +2 -1
  173. package/build-module/components/block-settings/container.native.js.map +1 -1
  174. package/build-module/components/block-styles/index.js +112 -133
  175. package/build-module/components/block-styles/index.js.map +1 -1
  176. package/build-module/components/block-styles/menu-items.js +50 -0
  177. package/build-module/components/block-styles/menu-items.js.map +1 -0
  178. package/build-module/components/block-styles/preview-panel.js +35 -0
  179. package/build-module/components/block-styles/preview-panel.js.map +1 -0
  180. package/build-module/components/block-styles/preview.native.js +2 -2
  181. package/build-module/components/block-styles/preview.native.js.map +1 -1
  182. package/build-module/components/block-styles/use-styles-for-block.js +107 -0
  183. package/build-module/components/block-styles/use-styles-for-block.js.map +1 -0
  184. package/build-module/components/block-styles/utils.js +34 -0
  185. package/build-module/components/block-styles/utils.js.map +1 -1
  186. package/build-module/components/block-switcher/block-styles-menu.js +3 -21
  187. package/build-module/components/block-switcher/block-styles-menu.js.map +1 -1
  188. package/build-module/components/block-tools/back-compat.js +2 -1
  189. package/build-module/components/block-tools/back-compat.js.map +1 -1
  190. package/build-module/components/block-tools/block-selection-button.js +5 -1
  191. package/build-module/components/block-tools/block-selection-button.js.map +1 -1
  192. package/build-module/components/block-tools/insertion-point.js +11 -1
  193. package/build-module/components/block-tools/insertion-point.js.map +1 -1
  194. package/build-module/components/block-types-list/index.native.js +2 -2
  195. package/build-module/components/block-types-list/index.native.js.map +1 -1
  196. package/build-module/components/button-block-appender/index.js +2 -1
  197. package/build-module/components/button-block-appender/index.js.map +1 -1
  198. package/build-module/components/colors-gradients/dropdown.js +75 -0
  199. package/build-module/components/colors-gradients/dropdown.js.map +1 -0
  200. package/build-module/components/colors-gradients/panel-color-gradient-settings.js +8 -7
  201. package/build-module/components/colors-gradients/panel-color-gradient-settings.js.map +1 -1
  202. package/build-module/components/colors-gradients/panel-color-gradient-settings.native.js +7 -4
  203. package/build-module/components/colors-gradients/panel-color-gradient-settings.native.js.map +1 -1
  204. package/build-module/components/contrast-checker/index.js +34 -9
  205. package/build-module/components/contrast-checker/index.js.map +1 -1
  206. package/build-module/components/contrast-checker/index.native.js +90 -0
  207. package/build-module/components/contrast-checker/index.native.js.map +1 -0
  208. package/build-module/components/default-block-appender/index.js +15 -18
  209. package/build-module/components/default-block-appender/index.js.map +1 -1
  210. package/build-module/components/default-style-picker/index.js +17 -3
  211. package/build-module/components/default-style-picker/index.js.map +1 -1
  212. package/build-module/components/iframe/index.js +4 -5
  213. package/build-module/components/iframe/index.js.map +1 -1
  214. package/build-module/components/index.js +2 -1
  215. package/build-module/components/index.js.map +1 -1
  216. package/build-module/components/index.native.js +1 -0
  217. package/build-module/components/index.native.js.map +1 -1
  218. package/build-module/components/inner-blocks/default-block-appender.js +2 -4
  219. package/build-module/components/inner-blocks/default-block-appender.js.map +1 -1
  220. package/build-module/components/inner-blocks/use-nested-settings-update.js +16 -14
  221. package/build-module/components/inner-blocks/use-nested-settings-update.js.map +1 -1
  222. package/build-module/components/inserter/index.js +61 -3
  223. package/build-module/components/inserter/index.js.map +1 -1
  224. package/build-module/components/inserter/index.native.js +2 -2
  225. package/build-module/components/inserter/index.native.js.map +1 -1
  226. package/build-module/components/inserter/library.js +5 -3
  227. package/build-module/components/inserter/library.js.map +1 -1
  228. package/build-module/components/inserter/menu.js +11 -4
  229. package/build-module/components/inserter/menu.js.map +1 -1
  230. package/build-module/components/inserter/tabs.native.js +7 -4
  231. package/build-module/components/inserter/tabs.native.js.map +1 -1
  232. package/build-module/components/inspector-controls/block-support-slot-container.js +2 -1
  233. package/build-module/components/inspector-controls/block-support-slot-container.js.map +1 -1
  234. package/build-module/components/inspector-controls/block-support-tools-panel.js +12 -43
  235. package/build-module/components/inspector-controls/block-support-tools-panel.js.map +1 -1
  236. package/build-module/components/inspector-controls/fill.native.js +3 -5
  237. package/build-module/components/inspector-controls/fill.native.js.map +1 -1
  238. package/build-module/components/inspector-controls/groups.js +2 -0
  239. package/build-module/components/inspector-controls/groups.js.map +1 -1
  240. package/build-module/components/inspector-controls/slot.js +1 -3
  241. package/build-module/components/inspector-controls/slot.js.map +1 -1
  242. package/build-module/components/letter-spacing-control/index.js +6 -6
  243. package/build-module/components/letter-spacing-control/index.js.map +1 -1
  244. package/build-module/components/link-control/link-preview.js +1 -1
  245. package/build-module/components/link-control/link-preview.js.map +1 -1
  246. package/build-module/components/link-control/search-item.js +11 -1
  247. package/build-module/components/link-control/search-item.js.map +1 -1
  248. package/build-module/components/link-control/search-results.js +2 -1
  249. package/build-module/components/link-control/search-results.js.map +1 -1
  250. package/build-module/components/link-control/use-search-handler.js +18 -5
  251. package/build-module/components/link-control/use-search-handler.js.map +1 -1
  252. package/build-module/components/list-view/block-select-button.js +22 -3
  253. package/build-module/components/list-view/block-select-button.js.map +1 -1
  254. package/build-module/components/list-view/block.js +6 -0
  255. package/build-module/components/list-view/block.js.map +1 -1
  256. package/build-module/components/media-placeholder/index.js +2 -0
  257. package/build-module/components/media-placeholder/index.js.map +1 -1
  258. package/build-module/components/media-replace-flow/index.js +32 -6
  259. package/build-module/components/media-replace-flow/index.js.map +1 -1
  260. package/build-module/components/media-upload-progress/index.native.js +2 -1
  261. package/build-module/components/media-upload-progress/index.native.js.map +1 -1
  262. package/build-module/components/panel-color-settings/index.js +7 -3
  263. package/build-module/components/panel-color-settings/index.js.map +1 -1
  264. package/build-module/components/provider/block-refs-provider.js +4 -1
  265. package/build-module/components/provider/block-refs-provider.js.map +1 -1
  266. package/build-module/components/rich-text/file-paste-handler.js +1 -1
  267. package/build-module/components/rich-text/file-paste-handler.js.map +1 -1
  268. package/build-module/components/rich-text/prevent-event-discovery.js +25 -0
  269. package/build-module/components/rich-text/prevent-event-discovery.js.map +1 -0
  270. package/build-module/components/rich-text/use-input-rules.js +2 -1
  271. package/build-module/components/rich-text/use-input-rules.js.map +1 -1
  272. package/build-module/components/selection-scroll-into-view/index.js +2 -1
  273. package/build-module/components/selection-scroll-into-view/index.js.map +1 -1
  274. package/build-module/components/use-display-block-controls/index.native.js +34 -0
  275. package/build-module/components/use-display-block-controls/index.native.js.map +1 -0
  276. package/build-module/components/use-on-block-drop/index.js +7 -3
  277. package/build-module/components/use-on-block-drop/index.js.map +1 -1
  278. package/build-module/components/writing-flow/use-multi-selection.js +3 -4
  279. package/build-module/components/writing-flow/use-multi-selection.js.map +1 -1
  280. package/build-module/hooks/border-color.js +72 -12
  281. package/build-module/hooks/border-color.js.map +1 -1
  282. package/build-module/hooks/border-radius.js +42 -0
  283. package/build-module/hooks/border-radius.js.map +1 -1
  284. package/build-module/hooks/border-style.js +36 -0
  285. package/build-module/hooks/border-style.js.map +1 -1
  286. package/build-module/hooks/border-width.js +66 -32
  287. package/build-module/hooks/border-width.js.map +1 -1
  288. package/build-module/hooks/border.js +80 -12
  289. package/build-module/hooks/border.js.map +1 -1
  290. package/build-module/hooks/color-panel.js +4 -1
  291. package/build-module/hooks/color-panel.js.map +1 -1
  292. package/build-module/hooks/color-panel.native.js +62 -0
  293. package/build-module/hooks/color-panel.native.js.map +1 -0
  294. package/build-module/hooks/color.js +6 -5
  295. package/build-module/hooks/color.js.map +1 -1
  296. package/build-module/hooks/index.native.js +1 -0
  297. package/build-module/hooks/index.native.js.map +1 -1
  298. package/build-module/hooks/layout.native.js +16 -0
  299. package/build-module/hooks/layout.native.js.map +1 -0
  300. package/build-module/hooks/letter-spacing.js +1 -1
  301. package/build-module/hooks/letter-spacing.js.map +1 -1
  302. package/build-module/hooks/typography.js +1 -1
  303. package/build-module/hooks/typography.js.map +1 -1
  304. package/build-module/store/actions.js +1 -2
  305. package/build-module/store/actions.js.map +1 -1
  306. package/build-module/store/defaults.js +5 -1
  307. package/build-module/store/defaults.js.map +1 -1
  308. package/build-module/store/defaults.native.js +2 -5
  309. package/build-module/store/defaults.native.js.map +1 -1
  310. package/build-module/store/selectors.js +10 -5
  311. package/build-module/store/selectors.js.map +1 -1
  312. package/build-module/utils/get-paste-event-data.js +1 -1
  313. package/build-module/utils/get-paste-event-data.js.map +1 -1
  314. package/build-module/utils/parse-css-unit-to-px.js +1 -1
  315. package/build-module/utils/parse-css-unit-to-px.js.map +1 -1
  316. package/build-style/style-rtl.css +226 -181
  317. package/build-style/style.css +226 -181
  318. package/package.json +31 -27
  319. package/src/components/block-caption/index.native.js +22 -4
  320. package/src/components/block-card/README.md +1 -1
  321. package/src/components/block-edit/index.js +8 -0
  322. package/src/components/block-edit/test/edit.native.js +10 -9
  323. package/src/components/block-inspector/index.js +9 -16
  324. package/src/components/block-list-appender/index.js +5 -21
  325. package/src/components/block-media-update-progress/index.native.js +1 -1
  326. package/src/components/block-media-update-progress/test/index.native.js +136 -93
  327. package/src/components/block-mover/test/__snapshots__/index.native.js.snap +108 -47
  328. package/src/components/block-mover/test/index.native.js +5 -5
  329. package/src/components/block-preview/README.md +14 -26
  330. package/src/components/block-preview/auto.js +7 -2
  331. package/src/components/block-preview/test/index.js +2 -0
  332. package/src/components/block-settings/container.native.js +1 -0
  333. package/src/components/block-styles/index.js +125 -145
  334. package/src/components/block-styles/menu-items.js +49 -0
  335. package/src/components/block-styles/preview-panel.js +36 -0
  336. package/src/components/block-styles/preview.native.js +5 -2
  337. package/src/components/block-styles/style.scss +59 -51
  338. package/src/components/block-styles/test/{index.js → utils.js} +60 -1
  339. package/src/components/block-styles/use-styles-for-block.js +99 -0
  340. package/src/components/block-styles/utils.js +39 -0
  341. package/src/components/block-switcher/block-styles-menu.js +3 -38
  342. package/src/components/block-tools/back-compat.js +1 -0
  343. package/src/components/block-tools/block-selection-button.js +7 -1
  344. package/src/components/block-tools/insertion-point.js +10 -1
  345. package/src/components/block-types-list/index.native.js +5 -2
  346. package/src/components/border-radius-control/style.scss +1 -1
  347. package/src/components/border-style-control/style.scss +0 -1
  348. package/src/components/button-block-appender/index.js +1 -0
  349. package/src/components/color-palette/test/__snapshots__/control.js.snap +9 -4
  350. package/src/components/colors-gradients/dropdown.js +96 -0
  351. package/src/components/colors-gradients/panel-color-gradient-settings.js +23 -19
  352. package/src/components/colors-gradients/panel-color-gradient-settings.native.js +13 -2
  353. package/src/components/colors-gradients/style.scss +59 -5
  354. package/src/components/contrast-checker/README.md +3 -1
  355. package/src/components/contrast-checker/index.js +48 -20
  356. package/src/components/contrast-checker/index.native.js +113 -0
  357. package/src/components/contrast-checker/style.native.scss +26 -0
  358. package/src/components/contrast-checker/test/index.js +65 -0
  359. package/src/components/default-block-appender/index.js +17 -24
  360. package/src/components/default-block-appender/style.scss +4 -0
  361. package/src/components/default-block-appender/test/__snapshots__/index.js.snap +12 -24
  362. package/src/components/default-block-appender/test/index.js +4 -14
  363. package/src/components/default-style-picker/index.js +18 -6
  364. package/src/components/iframe/index.js +7 -3
  365. package/src/components/index.js +2 -1
  366. package/src/components/index.native.js +1 -0
  367. package/src/components/inner-blocks/README.md +2 -0
  368. package/src/components/inner-blocks/default-block-appender.js +2 -7
  369. package/src/components/inner-blocks/use-nested-settings-update.js +16 -14
  370. package/src/components/inserter/index.js +77 -5
  371. package/src/components/inserter/index.native.js +2 -2
  372. package/src/components/inserter/library.js +17 -12
  373. package/src/components/inserter/menu.js +31 -13
  374. package/src/components/inserter/tabs.native.js +5 -4
  375. package/src/components/inserter/test/block-types-tab.native.js +9 -10
  376. package/src/components/inserter/test/index.native.js +3 -7
  377. package/src/components/inserter/test/reusable-blocks-tab.native.js +8 -10
  378. package/src/components/inspector-controls/block-support-slot-container.js +3 -1
  379. package/src/components/inspector-controls/block-support-tools-panel.js +39 -58
  380. package/src/components/inspector-controls/fill.native.js +4 -3
  381. package/src/components/inspector-controls/groups.js +2 -0
  382. package/src/components/inspector-controls/slot.js +2 -7
  383. package/src/components/letter-spacing-control/index.js +6 -6
  384. package/src/components/link-control/README.md +1 -1
  385. package/src/components/link-control/link-preview.js +1 -1
  386. package/src/components/link-control/search-item.js +11 -2
  387. package/src/components/link-control/search-results.js +1 -0
  388. package/src/components/link-control/style.scss +2 -1
  389. package/src/components/link-control/test/index.js +4 -0
  390. package/src/components/link-control/use-search-handler.js +25 -4
  391. package/src/components/list-view/block-select-button.js +20 -1
  392. package/src/components/list-view/block.js +10 -0
  393. package/src/components/media-placeholder/index.js +2 -0
  394. package/src/components/media-replace-flow/index.js +35 -5
  395. package/src/components/media-upload/test/index.native.js +28 -47
  396. package/src/components/media-upload-progress/index.native.js +1 -0
  397. package/src/components/media-upload-progress/test/index.native.js +60 -47
  398. package/src/components/panel-color-settings/index.js +8 -4
  399. package/src/components/provider/block-refs-provider.js +4 -1
  400. package/src/components/rich-text/file-paste-handler.js +3 -1
  401. package/src/components/rich-text/prevent-event-discovery.js +23 -0
  402. package/src/components/rich-text/use-input-rules.js +2 -1
  403. package/src/components/selection-scroll-into-view/index.js +1 -0
  404. package/src/components/url-input/README.md +5 -0
  405. package/src/components/use-display-block-controls/index.native.js +38 -0
  406. package/src/components/use-on-block-drop/index.js +7 -3
  407. package/src/components/writing-flow/test/use-multi-selection.js +36 -0
  408. package/src/components/writing-flow/use-multi-selection.js +12 -9
  409. package/src/hooks/border-color.js +69 -9
  410. package/src/hooks/border-radius.js +32 -0
  411. package/src/hooks/border-style.js +26 -0
  412. package/src/hooks/border-width.js +56 -32
  413. package/src/hooks/border.js +115 -20
  414. package/src/hooks/border.scss +3 -17
  415. package/src/hooks/color-panel.js +3 -0
  416. package/src/hooks/color-panel.native.js +63 -0
  417. package/src/hooks/color.js +8 -7
  418. package/src/hooks/dimensions.scss +5 -0
  419. package/src/hooks/index.native.js +1 -0
  420. package/src/hooks/layout.native.js +23 -0
  421. package/src/hooks/letter-spacing.js +1 -1
  422. package/src/hooks/typography.js +1 -1
  423. package/src/store/actions.js +1 -2
  424. package/src/store/defaults.js +2 -0
  425. package/src/store/defaults.native.js +2 -6
  426. package/src/store/selectors.js +10 -5
  427. package/src/style.scss +4 -3
  428. package/src/utils/get-paste-event-data.js +1 -1
  429. package/src/utils/parse-css-unit-to-px.js +1 -1
  430. package/src/utils/test/parse-css-unit-to-px.js +3 -0
  431. package/tsconfig.tsbuildinfo +1 -1
  432. package/build/components/use-canvas-click-redirect/index.js +0 -66
  433. package/build/components/use-canvas-click-redirect/index.js.map +0 -1
  434. package/build-module/components/use-canvas-click-redirect/index.js +0 -54
  435. package/build-module/components/use-canvas-click-redirect/index.js.map +0 -1
  436. package/src/components/use-canvas-click-redirect/index.js +0 -57
@@ -1,12 +1,17 @@
1
1
  /**
2
2
  * External dependencies
3
3
  */
4
- import { shallow } from 'enzyme';
4
+ import { render } from 'test/helpers';
5
5
 
6
6
  /**
7
7
  * WordPress dependencies
8
8
  */
9
- import { sendMediaUpload, sendMediaSave } from '@wordpress/react-native-bridge';
9
+ import {
10
+ sendMediaSave,
11
+ sendMediaUpload,
12
+ subscribeMediaSave,
13
+ subscribeMediaUpload,
14
+ } from '@wordpress/react-native-bridge';
10
15
 
11
16
  /**
12
17
  * Internal dependencies
@@ -25,31 +30,19 @@ import {
25
30
  MEDIA_SAVE_MEDIAID_CHANGED,
26
31
  } from '../';
27
32
 
28
- jest.mock( '@wordpress/react-native-bridge', () => {
29
- const callUploadCallback = ( payload ) => {
30
- this.uploadCallBack( payload );
31
- };
32
- const callSaveCallback = ( payload ) => {
33
- this.saveCallBack( payload );
34
- };
35
- const subscribeMediaUpload = ( callback ) => {
36
- this.uploadCallBack = callback;
37
- };
38
- const subscribeMediaSave = ( callback ) => {
39
- this.saveCallBack = callback;
40
- };
41
- const mediaSources = {
42
- deviceCamera: 'DEVICE_CAMERA',
43
- deviceLibrary: 'DEVICE_MEDIA_LIBRARY',
44
- siteMediaLibrary: 'SITE_MEDIA_LIBRARY',
45
- };
46
- return {
47
- subscribeMediaUpload,
48
- subscribeMediaSave,
49
- sendMediaUpload: callUploadCallback,
50
- sendMediaSave: callSaveCallback,
51
- mediaSources,
52
- };
33
+ let uploadCallBack;
34
+ subscribeMediaUpload.mockImplementation( ( callback ) => {
35
+ uploadCallBack = callback;
36
+ } );
37
+ let saveCallBack;
38
+ subscribeMediaSave.mockImplementation( ( callback ) => {
39
+ saveCallBack = callback;
40
+ } );
41
+ sendMediaUpload.mockImplementation( ( payload ) => {
42
+ uploadCallBack( payload );
43
+ } );
44
+ sendMediaSave.mockImplementation( ( payload ) => {
45
+ saveCallBack( payload );
53
46
  } );
54
47
 
55
48
  const MEDIAID_LOCAL = 2;
@@ -99,14 +92,15 @@ const localMediaFiles = [
99
92
 
100
93
  describe( 'BlockMediaUpdateProgress component', () => {
101
94
  it( 'renders without crashing', () => {
102
- const wrapper = shallow(
95
+ const wrapper = render(
103
96
  <BlockMediaUpdateProgress renderContent={ () => {} } />
104
97
  );
105
98
  expect( wrapper ).toBeTruthy();
106
99
  } );
107
100
 
108
101
  it( 'upload: onUpdateMediaUploadProgress is called when a progress update payload is received', () => {
109
- const progress = 10;
102
+ const renderContentMock = jest.fn();
103
+ const progress = 0.1;
110
104
  const payload = {
111
105
  state: MEDIA_UPLOAD_STATE_UPLOADING,
112
106
  mediaId: MEDIAID_LOCAL,
@@ -115,19 +109,23 @@ describe( 'BlockMediaUpdateProgress component', () => {
115
109
 
116
110
  const onUpdateMediaUploadProgress = jest.fn();
117
111
 
118
- const wrapper = shallow(
112
+ const wrapper = render(
119
113
  <BlockMediaUpdateProgress
120
114
  onUpdateMediaUploadProgress={ onUpdateMediaUploadProgress }
121
115
  mediaFiles={ localMediaFiles }
122
- renderContent={ () => {} }
116
+ renderContent={ renderContentMock }
123
117
  />
124
118
  );
125
119
 
126
120
  sendMediaUpload( payload );
127
121
 
128
- expect( wrapper.instance().state.progress ).toEqual( progress );
129
- expect( wrapper.instance().state.isUploadInProgress ).toEqual( true );
130
- expect( wrapper.instance().state.isUploadFailed ).toEqual( false );
122
+ expect( wrapper.getByTestId( 'spinner' ) ).toBeTruthy();
123
+ expect( renderContentMock ).toHaveBeenCalledWith(
124
+ expect.objectContaining( {
125
+ isUploadInProgress: true,
126
+ isUploadFailed: false,
127
+ } )
128
+ );
131
129
  expect( onUpdateMediaUploadProgress ).toHaveBeenCalledTimes( 1 );
132
130
  expect( onUpdateMediaUploadProgress ).toHaveBeenCalledWith( payload );
133
131
  } );
@@ -137,10 +135,10 @@ describe( 'BlockMediaUpdateProgress component', () => {
137
135
  const payload = {
138
136
  state: MEDIA_UPLOAD_STATE_UPLOADING,
139
137
  mediaId: 432, // id not belonging to assigned mediaFiles collection in test
140
- progress: 20,
138
+ progress: 0.2,
141
139
  };
142
140
  const onUpdateMediaUploadProgress = jest.fn();
143
- const wrapper = shallow(
141
+ const wrapper = render(
144
142
  <BlockMediaUpdateProgress
145
143
  onUpdateMediaUploadProgress={ onUpdateMediaUploadProgress }
146
144
  mediaFiles={ localMediaFiles }
@@ -150,12 +148,13 @@ describe( 'BlockMediaUpdateProgress component', () => {
150
148
 
151
149
  sendMediaUpload( payload );
152
150
 
153
- expect( wrapper.instance().state.progress ).toEqual( 0 );
151
+ expect( wrapper.queryByTestId( 'spinner' ) ).toBeNull();
154
152
  expect( onUpdateMediaUploadProgress ).toHaveBeenCalledTimes( 0 );
155
153
  } );
156
154
 
157
155
  it( 'upload: onFinishMediaUploadWithSuccess is called when a success payload is received', () => {
158
- const progress = 10;
156
+ const renderContentMock = jest.fn();
157
+ const progress = 0.1;
159
158
  const payloadSuccess = {
160
159
  state: MEDIA_UPLOAD_STATE_SUCCEEDED,
161
160
  mediaId: MEDIAID_LOCAL,
@@ -168,23 +167,27 @@ describe( 'BlockMediaUpdateProgress component', () => {
168
167
 
169
168
  const onFinishMediaUploadWithSuccess = jest.fn();
170
169
 
171
- const wrapper = shallow(
170
+ const wrapper = render(
172
171
  <BlockMediaUpdateProgress
173
172
  onFinishMediaUploadWithSuccess={
174
173
  onFinishMediaUploadWithSuccess
175
174
  }
176
175
  mediaFiles={ localMediaFiles }
177
- renderContent={ () => {} }
176
+ renderContent={ renderContentMock }
178
177
  />
179
178
  );
180
179
 
181
180
  sendMediaUpload( payloadUploading );
182
181
 
183
- expect( wrapper.instance().state.progress ).toEqual( progress );
182
+ expect( wrapper.getByTestId( 'spinner' ) ).toBeTruthy();
184
183
 
185
184
  sendMediaUpload( payloadSuccess );
186
185
 
187
- expect( wrapper.instance().state.isUploadInProgress ).toEqual( false );
186
+ expect( renderContentMock ).toHaveBeenCalledWith(
187
+ expect.objectContaining( {
188
+ isUploadInProgress: false,
189
+ } )
190
+ );
188
191
  expect( onFinishMediaUploadWithSuccess ).toHaveBeenCalledTimes( 1 );
189
192
  expect( onFinishMediaUploadWithSuccess ).toHaveBeenCalledWith(
190
193
  payloadSuccess
@@ -192,7 +195,8 @@ describe( 'BlockMediaUpdateProgress component', () => {
192
195
  } );
193
196
 
194
197
  it( 'upload: onFinishMediaUploadWithFailure is called when a failed payload is received', () => {
195
- const progress = 10;
198
+ const renderContentMock = jest.fn();
199
+ const progress = 0.1;
196
200
  const payloadFail = {
197
201
  state: MEDIA_UPLOAD_STATE_FAILED,
198
202
  mediaId: MEDIAID_LOCAL,
@@ -205,24 +209,28 @@ describe( 'BlockMediaUpdateProgress component', () => {
205
209
 
206
210
  const onFinishMediaUploadWithFailure = jest.fn();
207
211
 
208
- const wrapper = shallow(
212
+ const wrapper = render(
209
213
  <BlockMediaUpdateProgress
210
214
  onFinishMediaUploadWithFailure={
211
215
  onFinishMediaUploadWithFailure
212
216
  }
213
217
  mediaFiles={ localMediaFiles }
214
- renderContent={ () => {} }
218
+ renderContent={ renderContentMock }
215
219
  />
216
220
  );
217
221
 
218
222
  sendMediaUpload( payloadUploading );
219
223
 
220
- expect( wrapper.instance().state.progress ).toEqual( progress );
224
+ expect( wrapper.getByTestId( 'spinner' ) ).toBeTruthy();
221
225
 
222
226
  sendMediaUpload( payloadFail );
223
227
 
224
- expect( wrapper.instance().state.isUploadInProgress ).toEqual( false );
225
- expect( wrapper.instance().state.isUploadFailed ).toEqual( true );
228
+ expect( renderContentMock ).toHaveBeenCalledWith(
229
+ expect.objectContaining( {
230
+ isUploadInProgress: false,
231
+ isUploadFailed: true,
232
+ } )
233
+ );
226
234
  expect( onFinishMediaUploadWithFailure ).toHaveBeenCalledTimes( 1 );
227
235
  expect( onFinishMediaUploadWithFailure ).toHaveBeenCalledWith(
228
236
  payloadFail
@@ -230,7 +238,8 @@ describe( 'BlockMediaUpdateProgress component', () => {
230
238
  } );
231
239
 
232
240
  it( 'upload: onMediaUploadStateReset is called when a reset payload is received', () => {
233
- const progress = 10;
241
+ const renderContentMock = jest.fn();
242
+ const progress = 0.1;
234
243
  const payloadReset = {
235
244
  state: MEDIA_UPLOAD_STATE_RESET,
236
245
  mediaId: MEDIAID_LOCAL,
@@ -243,22 +252,26 @@ describe( 'BlockMediaUpdateProgress component', () => {
243
252
 
244
253
  const onMediaUploadStateReset = jest.fn();
245
254
 
246
- const wrapper = shallow(
255
+ const wrapper = render(
247
256
  <BlockMediaUpdateProgress
248
257
  onMediaUploadStateReset={ onMediaUploadStateReset }
249
258
  mediaFiles={ localMediaFiles }
250
- renderContent={ () => {} }
259
+ renderContent={ renderContentMock }
251
260
  />
252
261
  );
253
262
 
254
263
  sendMediaUpload( payloadUploading );
255
264
 
256
- expect( wrapper.instance().state.progress ).toEqual( progress );
265
+ expect( wrapper.getByTestId( 'spinner' ) ).toBeTruthy();
257
266
 
258
267
  sendMediaUpload( payloadReset );
259
268
 
260
- expect( wrapper.instance().state.isUploadInProgress ).toEqual( false );
261
- expect( wrapper.instance().state.isUploadFailed ).toEqual( false );
269
+ expect( renderContentMock ).toHaveBeenCalledWith(
270
+ expect.objectContaining( {
271
+ isUploadInProgress: false,
272
+ isUploadFailed: false,
273
+ } )
274
+ );
262
275
  expect( onMediaUploadStateReset ).toHaveBeenCalledTimes( 1 );
263
276
  expect( onMediaUploadStateReset ).toHaveBeenCalledWith( payloadReset );
264
277
  } );
@@ -268,10 +281,10 @@ describe( 'BlockMediaUpdateProgress component', () => {
268
281
  const payload = {
269
282
  state: MEDIA_SAVE_STATE_SAVING,
270
283
  mediaId: 'tempid-432', // id not belonging to assigned mediaFiles collection in test
271
- progress: 20,
284
+ progress: 0.2,
272
285
  };
273
286
  const onUpdateMediaSaveProgress = jest.fn();
274
- const wrapper = shallow(
287
+ const wrapper = render(
275
288
  <BlockMediaUpdateProgress
276
289
  onUpdateMediaSaveProgress={ onUpdateMediaSaveProgress }
277
290
  mediaFiles={ tempMediaFiles }
@@ -281,12 +294,12 @@ describe( 'BlockMediaUpdateProgress component', () => {
281
294
 
282
295
  sendMediaSave( payload );
283
296
 
284
- expect( wrapper.instance().state.progress ).toEqual( 0 );
297
+ expect( wrapper.queryByTestId( 'spinner' ) ).toBeNull();
285
298
  expect( onUpdateMediaSaveProgress ).toHaveBeenCalledTimes( 0 );
286
299
  } );
287
300
 
288
301
  it( 'save: onFinishMediaSaveWithSuccess is called when a success payload is received', () => {
289
- const progress = 10;
302
+ const progress = 0.1;
290
303
  const payloadSuccess = {
291
304
  state: MEDIA_SAVE_STATE_SUCCEEDED,
292
305
  mediaId: MEDIAID_TEMP, // while saving, we have a tempid key
@@ -299,7 +312,7 @@ describe( 'BlockMediaUpdateProgress component', () => {
299
312
 
300
313
  const onFinishMediaSaveWithSuccess = jest.fn();
301
314
 
302
- const wrapper = shallow(
315
+ const wrapper = render(
303
316
  <BlockMediaUpdateProgress
304
317
  onFinishMediaSaveWithSuccess={ onFinishMediaSaveWithSuccess }
305
318
  mediaFiles={ tempMediaFiles }
@@ -309,11 +322,11 @@ describe( 'BlockMediaUpdateProgress component', () => {
309
322
 
310
323
  sendMediaSave( payloadSaving );
311
324
 
312
- expect( wrapper.instance().state.progress ).toEqual( progress );
325
+ expect( wrapper.getByTestId( 'spinner' ) ).toBeTruthy();
313
326
 
314
327
  sendMediaSave( payloadSuccess );
315
328
 
316
- expect( wrapper.instance().state.isSaveInProgress ).toEqual( false );
329
+ expect( wrapper.queryByTestId( 'spinner' ) ).toBeNull();
317
330
  expect( onFinishMediaSaveWithSuccess ).toHaveBeenCalledTimes( 1 );
318
331
  expect( onFinishMediaSaveWithSuccess ).toHaveBeenCalledWith(
319
332
  payloadSuccess
@@ -321,7 +334,8 @@ describe( 'BlockMediaUpdateProgress component', () => {
321
334
  } );
322
335
 
323
336
  it( 'save: onFinishMediaSaveWithFailure is called when a failed payload is received', () => {
324
- const progress = 10;
337
+ const renderContentMock = jest.fn();
338
+ const progress = 0.1;
325
339
  const payloadFail = {
326
340
  state: MEDIA_SAVE_STATE_FAILED,
327
341
  mediaId: MEDIAID_TEMP, // while saving, we have a tempid key
@@ -334,22 +348,27 @@ describe( 'BlockMediaUpdateProgress component', () => {
334
348
 
335
349
  const onFinishMediaSaveWithFailure = jest.fn();
336
350
 
337
- const wrapper = shallow(
351
+ const wrapper = render(
338
352
  <BlockMediaUpdateProgress
339
353
  onFinishMediaSaveWithFailure={ onFinishMediaSaveWithFailure }
340
354
  mediaFiles={ tempMediaFiles }
341
- renderContent={ () => {} }
355
+ renderContent={ renderContentMock }
342
356
  />
343
357
  );
344
358
 
345
359
  sendMediaSave( payloadSaving );
346
360
 
347
- expect( wrapper.instance().state.progress ).toEqual( progress );
361
+ expect( wrapper.getByTestId( 'spinner' ) ).toBeTruthy();
348
362
 
349
363
  sendMediaSave( payloadFail );
350
364
 
351
- expect( wrapper.instance().state.isSaveInProgress ).toEqual( false );
352
- expect( wrapper.instance().state.isSaveFailed ).toEqual( true );
365
+ expect( wrapper.queryByTestId( 'spinner' ) ).toBeNull();
366
+ expect( renderContentMock ).toHaveBeenCalledWith(
367
+ expect.objectContaining( {
368
+ isSaveInProgress: false,
369
+ isSaveFailed: true,
370
+ } )
371
+ );
353
372
  expect( onFinishMediaSaveWithFailure ).toHaveBeenCalledTimes( 1 );
354
373
  expect( onFinishMediaSaveWithFailure ).toHaveBeenCalledWith(
355
374
  payloadFail
@@ -357,7 +376,8 @@ describe( 'BlockMediaUpdateProgress component', () => {
357
376
  } );
358
377
 
359
378
  it( 'save: onMediaSaveStateReset is called when a reset payload is received', () => {
360
- const progress = 10;
379
+ const renderContentMock = jest.fn();
380
+ const progress = 0.1;
361
381
  const payloadReset = {
362
382
  state: MEDIA_SAVE_STATE_RESET,
363
383
  mediaId: MEDIAID_TEMP, // while saving, we have a tempid key
@@ -370,28 +390,34 @@ describe( 'BlockMediaUpdateProgress component', () => {
370
390
 
371
391
  const onMediaSaveStateReset = jest.fn();
372
392
 
373
- const wrapper = shallow(
393
+ const wrapper = render(
374
394
  <BlockMediaUpdateProgress
375
395
  onMediaSaveStateReset={ onMediaSaveStateReset }
376
396
  mediaFiles={ tempMediaFiles }
377
- renderContent={ () => {} }
397
+ renderContent={ renderContentMock }
378
398
  />
379
399
  );
380
400
 
381
401
  sendMediaSave( payloadSaving );
382
402
 
383
- expect( wrapper.instance().state.progress ).toEqual( progress );
403
+ expect( wrapper.getByTestId( 'spinner' ) ).toBeTruthy();
384
404
 
385
405
  sendMediaSave( payloadReset );
386
406
 
387
- expect( wrapper.instance().state.isSaveInProgress ).toEqual( false );
388
- expect( wrapper.instance().state.isSaveFailed ).toEqual( false );
407
+ expect( wrapper.queryByTestId( 'spinner' ) ).toBeNull();
408
+ expect( renderContentMock ).toHaveBeenCalledWith(
409
+ expect.objectContaining( {
410
+ isSaveFailed: false,
411
+ isSaveInProgress: false,
412
+ } )
413
+ );
389
414
  expect( onMediaSaveStateReset ).toHaveBeenCalledTimes( 1 );
390
415
  expect( onMediaSaveStateReset ).toHaveBeenCalledWith( payloadReset );
391
416
  } );
392
417
 
393
418
  it( 'save: onFinalSaveResult is called with fail result when fail result is received', () => {
394
- const progress = 10;
419
+ const renderContentMock = jest.fn();
420
+ const progress = 0.1;
395
421
  const payloadFail = {
396
422
  state: MEDIA_SAVE_FINAL_STATE_RESULT,
397
423
  mediaId: MEDIAID_TEMP, // while saving, we have a tempid key
@@ -405,28 +431,34 @@ describe( 'BlockMediaUpdateProgress component', () => {
405
431
 
406
432
  const onFinalSaveResult = jest.fn();
407
433
 
408
- const wrapper = shallow(
434
+ const wrapper = render(
409
435
  <BlockMediaUpdateProgress
410
436
  onFinalSaveResult={ onFinalSaveResult }
411
437
  mediaFiles={ tempMediaFiles }
412
- renderContent={ () => {} }
438
+ renderContent={ renderContentMock }
413
439
  />
414
440
  );
415
441
 
416
442
  sendMediaSave( payloadSaving );
417
443
 
418
- expect( wrapper.instance().state.progress ).toEqual( progress );
444
+ expect( wrapper.getByTestId( 'spinner' ) ).toBeTruthy();
419
445
 
420
446
  sendMediaSave( payloadFail );
421
447
 
422
- expect( wrapper.instance().state.isSaveInProgress ).toEqual( false );
423
- expect( wrapper.instance().state.isSaveFailed ).toEqual( true );
448
+ expect( wrapper.queryByTestId( 'spinner' ) ).toBeNull();
449
+ expect( renderContentMock ).toHaveBeenCalledWith(
450
+ expect.objectContaining( {
451
+ isSaveFailed: true,
452
+ isSaveInProgress: false,
453
+ } )
454
+ );
424
455
  expect( onFinalSaveResult ).toHaveBeenCalledTimes( 1 );
425
456
  expect( onFinalSaveResult ).toHaveBeenCalledWith( payloadFail );
426
457
  } );
427
458
 
428
459
  it( 'save: onFinalSaveResult is called with success result when success result is received', () => {
429
- const progress = 10;
460
+ const renderContentMock = jest.fn();
461
+ const progress = 0.1;
430
462
  const payloadSuccess = {
431
463
  state: MEDIA_SAVE_FINAL_STATE_RESULT,
432
464
  mediaId: MEDIAID_TEMP, // while saving, we have a tempid key
@@ -440,28 +472,34 @@ describe( 'BlockMediaUpdateProgress component', () => {
440
472
 
441
473
  const onFinalSaveResult = jest.fn();
442
474
 
443
- const wrapper = shallow(
475
+ const wrapper = render(
444
476
  <BlockMediaUpdateProgress
445
477
  onFinalSaveResult={ onFinalSaveResult }
446
478
  mediaFiles={ tempMediaFiles }
447
- renderContent={ () => {} }
479
+ renderContent={ renderContentMock }
448
480
  />
449
481
  );
450
482
 
451
483
  sendMediaSave( payloadSaving );
452
484
 
453
- expect( wrapper.instance().state.progress ).toEqual( progress );
485
+ expect( wrapper.getByTestId( 'spinner' ) ).toBeTruthy();
454
486
 
455
487
  sendMediaSave( payloadSuccess );
456
488
 
457
- expect( wrapper.instance().state.isSaveInProgress ).toEqual( false );
458
- expect( wrapper.instance().state.isSaveFailed ).toEqual( false );
489
+ expect( wrapper.queryByTestId( 'spinner' ) ).toBeNull();
490
+ expect( renderContentMock ).toHaveBeenCalledWith(
491
+ expect.objectContaining( {
492
+ isSaveFailed: false,
493
+ isSaveInProgress: false,
494
+ } )
495
+ );
459
496
  expect( onFinalSaveResult ).toHaveBeenCalledTimes( 1 );
460
497
  expect( onFinalSaveResult ).toHaveBeenCalledWith( payloadSuccess );
461
498
  } );
462
499
 
463
500
  it( 'save: listens to mediaId change and passes it up', () => {
464
- const progress = 10;
501
+ const renderContentMock = jest.fn();
502
+ const progress = 0.1;
465
503
  const payloadMediaIdChange = {
466
504
  state: MEDIA_SAVE_MEDIAID_CHANGED,
467
505
  mediaId: MEDIAID_TEMP, // while saving, we have a tempid key
@@ -476,24 +514,29 @@ describe( 'BlockMediaUpdateProgress component', () => {
476
514
 
477
515
  const onMediaIdChanged = jest.fn();
478
516
 
479
- const wrapper = shallow(
517
+ const wrapper = render(
480
518
  <BlockMediaUpdateProgress
481
519
  onMediaIdChanged={ onMediaIdChanged }
482
520
  mediaFiles={ tempMediaFiles }
483
- renderContent={ () => {} }
521
+ renderContent={ renderContentMock }
484
522
  />
485
523
  );
486
524
 
487
525
  sendMediaSave( payloadSaving );
488
526
 
489
- expect( wrapper.instance().state.progress ).toEqual( progress );
527
+ expect( wrapper.getByTestId( 'spinner' ) ).toBeTruthy();
490
528
 
491
529
  sendMediaSave( payloadMediaIdChange );
492
530
 
493
- expect( wrapper.instance().state.isSaveInProgress ).toEqual( false );
494
- expect( wrapper.instance().state.isSaveFailed ).toEqual( false );
495
- expect( wrapper.instance().state.isUploadInProgress ).toEqual( false );
496
- expect( wrapper.instance().state.isUploadFailed ).toEqual( false );
531
+ expect( wrapper.queryByTestId( 'spinner' ) ).toBeNull();
532
+ expect( renderContentMock ).toHaveBeenCalledWith(
533
+ expect.objectContaining( {
534
+ isSaveFailed: false,
535
+ isSaveInProgress: false,
536
+ isUploadInProgress: false,
537
+ isUploadFailed: false,
538
+ } )
539
+ );
497
540
  expect( onMediaIdChanged ).toHaveBeenCalledTimes( 1 );
498
541
  expect( onMediaIdChanged ).toHaveBeenCalledWith( payloadMediaIdChange );
499
542
  } );
@@ -1,55 +1,116 @@
1
1
  // Jest Snapshot v1, https://goo.gl/fbAQLP
2
2
 
3
3
  exports[`Block Mover Picker should match snapshot 1`] = `
4
- <Fragment>
5
- <ForwardRef(ToolbarButton)
6
- extraProps={
7
- Object {
8
- "hint": "Double tap to move the block to the left",
4
+ Array [
5
+ <View>
6
+ <View
7
+ accessibilityHint="Double tap to move the block to the left"
8
+ accessibilityLabel="Move block left from position 2 to position 1"
9
+ accessibilityRole="button"
10
+ accessibilityState={
11
+ Object {
12
+ "disabled": false,
13
+ }
9
14
  }
10
- }
11
- icon={
12
- <SVG
13
- viewBox="0 0 24 24"
14
- xmlns="http://www.w3.org/2000/svg"
15
+ accessible={true}
16
+ collapsable={false}
17
+ focusable={true}
18
+ nativeID="animatedComponent"
19
+ onClick={[Function]}
20
+ onResponderGrant={[Function]}
21
+ onResponderMove={[Function]}
22
+ onResponderRelease={[Function]}
23
+ onResponderTerminate={[Function]}
24
+ onResponderTerminationRequest={[Function]}
25
+ onStartShouldSetResponder={[Function]}
26
+ style={
27
+ Object {
28
+ "alignItems": "center",
29
+ "flex": 1,
30
+ "justifyContent": "center",
31
+ "opacity": 1,
32
+ "padding": 3,
33
+ }
34
+ }
35
+ >
36
+ <View
37
+ style={
38
+ Object {
39
+ "alignItems": "center",
40
+ "aspectRatio": 1,
41
+ "flex": 1,
42
+ "flexDirection": "row",
43
+ "justifyContent": "center",
44
+ "opacity": 1,
45
+ }
46
+ }
15
47
  >
16
- <Path
17
- d="M20 10.8H6.7l4.1-4.5-1.1-1.1-5.8 6.3 5.8 5.8 1.1-1.1-4-3.9H20z"
18
- />
19
- </SVG>
20
- }
21
- isDisabled={false}
22
- onClick={[MockFunction]}
23
- onLongPress={[Function]}
24
- title="Move block left from position 2 to position 1"
25
- />
26
- <ForwardRef(ToolbarButton)
27
- extraProps={
28
- Object {
29
- "hint": "Double tap to move the block to the right",
48
+ <View
49
+ style={
50
+ Object {
51
+ "flexDirection": "row",
52
+ }
53
+ }
54
+ >
55
+ Svg
56
+ </View>
57
+ </View>
58
+ </View>
59
+ </View>,
60
+ <View>
61
+ <View
62
+ accessibilityHint="Double tap to move the block to the right"
63
+ accessibilityLabel="Move block right"
64
+ accessibilityRole="button"
65
+ accessibilityState={
66
+ Object {
67
+ "disabled": true,
68
+ }
69
+ }
70
+ accessible={true}
71
+ collapsable={false}
72
+ focusable={true}
73
+ nativeID="animatedComponent"
74
+ onClick={[Function]}
75
+ onResponderGrant={[Function]}
76
+ onResponderMove={[Function]}
77
+ onResponderRelease={[Function]}
78
+ onResponderTerminate={[Function]}
79
+ onResponderTerminationRequest={[Function]}
80
+ onStartShouldSetResponder={[Function]}
81
+ style={
82
+ Object {
83
+ "alignItems": "center",
84
+ "flex": 1,
85
+ "justifyContent": "center",
86
+ "opacity": 1,
87
+ "padding": 3,
88
+ }
30
89
  }
31
- }
32
- icon={
33
- <SVG
34
- viewBox="0 0 24 24"
35
- xmlns="http://www.w3.org/2000/svg"
90
+ >
91
+ <View
92
+ style={
93
+ Object {
94
+ "alignItems": "center",
95
+ "aspectRatio": 1,
96
+ "flex": 1,
97
+ "flexDirection": "row",
98
+ "justifyContent": "center",
99
+ "opacity": 0.3,
100
+ }
101
+ }
36
102
  >
37
- <Path
38
- d="M14.3 6.7l-1.1 1.1 4 4H4v1.5h13.3l-4.1 4.4 1.1 1.1 5.8-6.3z"
39
- />
40
- </SVG>
41
- }
42
- isDisabled={true}
43
- onClick={[MockFunction]}
44
- onLongPress={[Function]}
45
- title="Move block right"
46
- />
47
- <Picker
48
- hideCancelButton={true}
49
- leftAlign={true}
50
- onChange={[Function]}
51
- options={Array []}
52
- title="Change block position"
53
- />
54
- </Fragment>
103
+ <View
104
+ style={
105
+ Object {
106
+ "flexDirection": "row",
107
+ }
108
+ }
109
+ >
110
+ Svg
111
+ </View>
112
+ </View>
113
+ </View>
114
+ </View>,
115
+ ]
55
116
  `;