@wordpress/block-library 9.48.0 → 9.48.1

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 (519) hide show
  1. package/CHANGELOG.md +7 -1
  2. package/build/columns/transforms.cjs +65 -0
  3. package/build/columns/transforms.cjs.map +2 -2
  4. package/build/gallery/edit.cjs +212 -331
  5. package/build/gallery/edit.cjs.map +2 -2
  6. package/build/gallery/transforms.cjs +43 -0
  7. package/build/gallery/transforms.cjs.map +2 -2
  8. package/build/heading/edit.cjs +0 -1
  9. package/build/heading/edit.cjs.map +2 -2
  10. package/build/list/edit.cjs +1 -8
  11. package/build/list/edit.cjs.map +2 -2
  12. package/build/list/ordered-list-settings.cjs +1 -44
  13. package/build/list/ordered-list-settings.cjs.map +2 -2
  14. package/build/list-item/hooks/use-merge.cjs +47 -24
  15. package/build/list-item/hooks/use-merge.cjs.map +2 -2
  16. package/build/navigation/edit/index.cjs +15 -26
  17. package/build/navigation/edit/index.cjs.map +2 -2
  18. package/build/navigation-link/edit.cjs +0 -1
  19. package/build/navigation-link/edit.cjs.map +2 -2
  20. package/build/navigation-submenu/edit.cjs +2 -1
  21. package/build/navigation-submenu/edit.cjs.map +2 -2
  22. package/build/paragraph/deprecated.cjs +1 -0
  23. package/build/paragraph/deprecated.cjs.map +2 -2
  24. package/build/paragraph/edit.cjs +10 -1
  25. package/build/paragraph/edit.cjs.map +3 -3
  26. package/build/playlist/block.json +12 -0
  27. package/build/playlist/edit.cjs +27 -1
  28. package/build/playlist/edit.cjs.map +2 -2
  29. package/build/playlist/save.cjs +8 -1
  30. package/build/playlist/save.cjs.map +2 -2
  31. package/build/playlist/view.cjs +1 -0
  32. package/build/playlist/view.cjs.map +2 -2
  33. package/build/post-time-to-read/index.cjs +1 -1
  34. package/build/post-time-to-read/index.cjs.map +2 -2
  35. package/build/post-time-to-read/variations.cjs +1 -1
  36. package/build/post-time-to-read/variations.cjs.map +2 -2
  37. package/build/pullquote/edit.cjs +2 -7
  38. package/build/pullquote/edit.cjs.map +2 -2
  39. package/build/quote/edit.cjs +4 -9
  40. package/build/quote/edit.cjs.map +2 -2
  41. package/build/shortcode/transforms.cjs +2 -2
  42. package/build/shortcode/transforms.cjs.map +2 -2
  43. package/build/utils/waveform-player.cjs +42 -9
  44. package/build/utils/waveform-player.cjs.map +2 -2
  45. package/build/utils/waveform-utils.cjs +6 -4
  46. package/build/utils/waveform-utils.cjs.map +2 -2
  47. package/build/video/edit-common-settings.cjs +3 -6
  48. package/build/video/edit-common-settings.cjs.map +2 -2
  49. package/build-module/columns/transforms.mjs +65 -0
  50. package/build-module/columns/transforms.mjs.map +2 -2
  51. package/build-module/gallery/edit.mjs +214 -334
  52. package/build-module/gallery/edit.mjs.map +2 -2
  53. package/build-module/gallery/transforms.mjs +43 -0
  54. package/build-module/gallery/transforms.mjs.map +2 -2
  55. package/build-module/heading/edit.mjs +1 -2
  56. package/build-module/heading/edit.mjs.map +2 -2
  57. package/build-module/list/edit.mjs +2 -9
  58. package/build-module/list/edit.mjs.map +2 -2
  59. package/build-module/list/ordered-list-settings.mjs +1 -45
  60. package/build-module/list/ordered-list-settings.mjs.map +2 -2
  61. package/build-module/list-item/hooks/use-merge.mjs +48 -25
  62. package/build-module/list-item/hooks/use-merge.mjs.map +2 -2
  63. package/build-module/navigation/edit/index.mjs +16 -33
  64. package/build-module/navigation/edit/index.mjs.map +2 -2
  65. package/build-module/navigation-link/edit.mjs +0 -1
  66. package/build-module/navigation-link/edit.mjs.map +2 -2
  67. package/build-module/navigation-submenu/edit.mjs +2 -1
  68. package/build-module/navigation-submenu/edit.mjs.map +2 -2
  69. package/build-module/paragraph/deprecated.mjs +1 -0
  70. package/build-module/paragraph/deprecated.mjs.map +2 -2
  71. package/build-module/paragraph/edit.mjs +12 -2
  72. package/build-module/paragraph/edit.mjs.map +2 -2
  73. package/build-module/playlist/block.json +12 -0
  74. package/build-module/playlist/edit.mjs +27 -1
  75. package/build-module/playlist/edit.mjs.map +2 -2
  76. package/build-module/playlist/save.mjs +8 -1
  77. package/build-module/playlist/save.mjs.map +2 -2
  78. package/build-module/playlist/view.mjs +1 -0
  79. package/build-module/playlist/view.mjs.map +2 -2
  80. package/build-module/post-time-to-read/index.mjs +1 -1
  81. package/build-module/post-time-to-read/index.mjs.map +2 -2
  82. package/build-module/post-time-to-read/variations.mjs +2 -2
  83. package/build-module/post-time-to-read/variations.mjs.map +2 -2
  84. package/build-module/pullquote/edit.mjs +2 -7
  85. package/build-module/pullquote/edit.mjs.map +2 -2
  86. package/build-module/quote/edit.mjs +5 -10
  87. package/build-module/quote/edit.mjs.map +2 -2
  88. package/build-module/shortcode/transforms.mjs +2 -2
  89. package/build-module/shortcode/transforms.mjs.map +2 -2
  90. package/build-module/utils/waveform-player.mjs +44 -11
  91. package/build-module/utils/waveform-player.mjs.map +2 -2
  92. package/build-module/utils/waveform-utils.mjs +6 -4
  93. package/build-module/utils/waveform-utils.mjs.map +2 -2
  94. package/build-module/video/edit-common-settings.mjs +4 -7
  95. package/build-module/video/edit-common-settings.mjs.map +2 -2
  96. package/build-style/comment-template/style-rtl.css +1 -0
  97. package/build-style/comment-template/style.css +1 -0
  98. package/build-style/common-rtl.css +30 -10
  99. package/build-style/common.css +30 -10
  100. package/build-style/cover/style-rtl.css +2 -1
  101. package/build-style/cover/style.css +2 -1
  102. package/build-style/editor-rtl.css +22 -11
  103. package/build-style/editor.css +22 -11
  104. package/build-style/form-input/style-rtl.css +2 -0
  105. package/build-style/form-input/style.css +2 -0
  106. package/build-style/gallery/style-rtl.css +4 -2
  107. package/build-style/gallery/style.css +4 -2
  108. package/build-style/media-text/style-rtl.css +2 -1
  109. package/build-style/media-text/style.css +2 -1
  110. package/build-style/playlist/style-rtl.css +3 -0
  111. package/build-style/playlist/style.css +3 -0
  112. package/build-style/query/editor-rtl.css +8 -4
  113. package/build-style/query/editor.css +8 -4
  114. package/build-style/read-more/style-rtl.css +1 -0
  115. package/build-style/read-more/style.css +1 -0
  116. package/build-style/reset-rtl.css +3 -1
  117. package/build-style/reset.css +3 -1
  118. package/build-style/search/style-rtl.css +3 -1
  119. package/build-style/search/style.css +3 -1
  120. package/build-style/site-logo/editor-rtl.css +2 -1
  121. package/build-style/site-logo/editor.css +2 -1
  122. package/build-style/style-rtl.css +53 -17
  123. package/build-style/style.css +53 -17
  124. package/build-style/tab/style-rtl.css +3 -1
  125. package/build-style/tab/style.css +3 -1
  126. package/build-style/template-part/editor-rtl.css +8 -4
  127. package/build-style/template-part/editor.css +8 -4
  128. package/build-style/video/style-rtl.css +2 -1
  129. package/build-style/video/style.css +2 -1
  130. package/package.json +49 -45
  131. package/src/accordion/README.md +97 -0
  132. package/src/accordion-heading/README.md +81 -0
  133. package/src/accordion-item/README.md +85 -0
  134. package/src/accordion-panel/README.md +74 -0
  135. package/src/archives/README.md +56 -0
  136. package/src/audio/README.md +55 -0
  137. package/src/avatar/README.md +74 -0
  138. package/src/block/README.md +56 -0
  139. package/src/breadcrumbs/README.md +67 -0
  140. package/src/button/README.md +93 -0
  141. package/src/buttons/README.md +80 -0
  142. package/src/calendar/README.md +51 -0
  143. package/src/categories/README.md +69 -0
  144. package/src/code/README.md +55 -0
  145. package/src/column/README.md +72 -0
  146. package/src/columns/README.md +90 -0
  147. package/src/columns/test/transforms.js +164 -0
  148. package/src/columns/transforms.js +74 -0
  149. package/src/comment-author-avatar/README.md +63 -0
  150. package/src/comment-author-name/README.md +67 -0
  151. package/src/comment-content/README.md +61 -0
  152. package/src/comment-date/README.md +67 -0
  153. package/src/comment-edit-link/README.md +67 -0
  154. package/src/comment-reply-link/README.md +63 -0
  155. package/src/comment-template/README.md +60 -0
  156. package/src/comments/README.md +88 -0
  157. package/src/comments-pagination/README.md +77 -0
  158. package/src/comments-pagination-next/README.md +64 -0
  159. package/src/comments-pagination-numbers/README.md +64 -0
  160. package/src/comments-pagination-previous/README.md +64 -0
  161. package/src/comments-title/README.md +70 -0
  162. package/src/common.scss +63 -10
  163. package/src/cover/README.md +111 -0
  164. package/src/details/README.md +65 -0
  165. package/src/embed/README.md +56 -0
  166. package/src/file/README.md +60 -0
  167. package/src/footnotes/README.md +64 -0
  168. package/src/form/README.md +90 -0
  169. package/src/form-input/README.md +74 -0
  170. package/src/form-submission-notification/README.md +50 -0
  171. package/src/form-submit-button/README.md +54 -0
  172. package/src/freeform/README.md +49 -0
  173. package/src/gallery/README.md +115 -0
  174. package/src/gallery/edit.js +213 -350
  175. package/src/gallery/test/transforms.js +155 -0
  176. package/src/gallery/transforms.js +47 -0
  177. package/src/group/README.md +80 -0
  178. package/src/heading/README.md +60 -0
  179. package/src/heading/edit.js +1 -2
  180. package/src/home-link/README.md +66 -0
  181. package/src/home-link/index.php +3 -15
  182. package/src/html/README.md +48 -0
  183. package/src/icon/README.md +63 -0
  184. package/src/image/README.md +102 -0
  185. package/src/image/index.php +4 -4
  186. package/src/latest-comments/README.md +57 -0
  187. package/src/latest-posts/README.md +71 -0
  188. package/src/list/README.md +70 -0
  189. package/src/list/edit.js +2 -9
  190. package/src/list/ordered-list-settings.js +46 -92
  191. package/src/list-item/README.md +71 -0
  192. package/src/list-item/hooks/use-merge.js +53 -46
  193. package/src/loginout/README.md +56 -0
  194. package/src/math/README.md +50 -0
  195. package/src/media-text/README.md +92 -0
  196. package/src/missing/README.md +55 -0
  197. package/src/more/README.md +49 -0
  198. package/src/navigation/README.md +115 -0
  199. package/src/navigation/edit/index.js +10 -30
  200. package/src/navigation-link/README.md +93 -0
  201. package/src/navigation-link/edit.js +0 -1
  202. package/src/navigation-link/index.php +1 -15
  203. package/src/navigation-overlay-close/README.md +48 -0
  204. package/src/navigation-submenu/README.md +84 -0
  205. package/src/navigation-submenu/edit.js +1 -0
  206. package/src/navigation-submenu/index.php +1 -17
  207. package/src/nextpage/README.md +50 -0
  208. package/src/page-list/README.md +84 -0
  209. package/src/page-list/index.php +3 -15
  210. package/src/page-list-item/README.md +77 -0
  211. package/src/paragraph/README.md +70 -0
  212. package/src/paragraph/deprecated.js +1 -0
  213. package/src/paragraph/edit.js +13 -1
  214. package/src/pattern/README.md +45 -0
  215. package/src/playlist/README.md +86 -0
  216. package/src/playlist/block.json +12 -0
  217. package/src/playlist/edit.js +27 -0
  218. package/src/playlist/index.php +10 -3
  219. package/src/playlist/save.js +9 -1
  220. package/src/playlist/style.scss +7 -0
  221. package/src/playlist/view.js +1 -0
  222. package/src/playlist-track/README.md +69 -0
  223. package/src/post-author/README.md +78 -0
  224. package/src/post-author-biography/README.md +59 -0
  225. package/src/post-author-name/README.md +63 -0
  226. package/src/post-author-name/index.php +1 -1
  227. package/src/post-comment/README.md +61 -0
  228. package/src/post-comments-count/README.md +58 -0
  229. package/src/post-comments-form/README.md +59 -0
  230. package/src/post-comments-link/README.md +60 -0
  231. package/src/post-content/README.md +71 -0
  232. package/src/post-date/README.md +65 -0
  233. package/src/post-date/index.php +1 -1
  234. package/src/post-excerpt/README.md +66 -0
  235. package/src/post-featured-image/README.md +85 -0
  236. package/src/post-featured-image/index.php +1 -1
  237. package/src/post-navigation-link/README.md +63 -0
  238. package/src/post-template/README.md +71 -0
  239. package/src/post-terms/README.md +65 -0
  240. package/src/post-time-to-read/README.md +63 -0
  241. package/src/post-time-to-read/index.js +1 -1
  242. package/src/post-time-to-read/variations.js +2 -2
  243. package/src/post-title/README.md +69 -0
  244. package/src/preformatted/README.md +50 -0
  245. package/src/pullquote/README.md +64 -0
  246. package/src/pullquote/edit.js +1 -7
  247. package/src/query/README.md +64 -0
  248. package/src/query-no-results/README.md +65 -0
  249. package/src/query-pagination/README.md +79 -0
  250. package/src/query-pagination-next/README.md +67 -0
  251. package/src/query-pagination-numbers/README.md +65 -0
  252. package/src/query-pagination-previous/README.md +67 -0
  253. package/src/query-title/README.md +65 -0
  254. package/src/query-total/README.md +66 -0
  255. package/src/quote/README.md +75 -0
  256. package/src/quote/edit.js +3 -9
  257. package/src/read-more/README.md +61 -0
  258. package/src/read-more/index.php +2 -2
  259. package/src/rss/README.md +62 -0
  260. package/src/search/README.md +66 -0
  261. package/src/separator/README.md +62 -0
  262. package/src/shortcode/README.md +44 -0
  263. package/src/shortcode/transforms.js +2 -2
  264. package/src/site-logo/README.md +72 -0
  265. package/src/site-tagline/README.md +56 -0
  266. package/src/site-title/README.md +57 -0
  267. package/src/social-link/README.md +64 -0
  268. package/src/social-links/README.md +98 -0
  269. package/src/spacer/README.md +53 -0
  270. package/src/tab/README.md +69 -0
  271. package/src/tab-list/README.md +79 -0
  272. package/src/tab-panel/README.md +75 -0
  273. package/src/tab-panels/README.md +75 -0
  274. package/src/table/README.md +71 -0
  275. package/src/table-of-contents/README.md +61 -0
  276. package/src/tabs/README.md +83 -0
  277. package/src/tag-cloud/README.md +62 -0
  278. package/src/template-part/README.md +48 -0
  279. package/src/term-count/README.md +59 -0
  280. package/src/term-description/README.md +60 -0
  281. package/src/term-name/README.md +65 -0
  282. package/src/term-template/README.md +65 -0
  283. package/src/terms-query/README.md +58 -0
  284. package/src/text-columns/README.md +51 -0
  285. package/src/utils/test/waveform-player.js +254 -0
  286. package/src/utils/waveform-player.js +90 -18
  287. package/src/utils/waveform-utils.js +15 -11
  288. package/src/verse/README.md +58 -0
  289. package/src/video/README.md +58 -0
  290. package/src/video/edit-common-settings.js +4 -7
  291. package/src/audio/edit.native.js +0 -250
  292. package/src/audio/style.native.scss +0 -13
  293. package/src/audio/test/__snapshots__/edit.native.js.snap +0 -546
  294. package/src/audio/test/__snapshots__/transforms.native.js.snap +0 -25
  295. package/src/audio/test/edit.native.js +0 -132
  296. package/src/audio/test/transforms.native.js +0 -43
  297. package/src/audio/transforms.native.js +0 -12
  298. package/src/block/edit-title.native.js +0 -67
  299. package/src/block/edit.native.js +0 -247
  300. package/src/block/editor.native.scss +0 -125
  301. package/src/block/test/__snapshots__/transforms.native.js.snap +0 -15
  302. package/src/block/test/edit.native.js +0 -262
  303. package/src/block/test/transforms.native.js +0 -40
  304. package/src/button/color-background.native.js +0 -41
  305. package/src/button/edit.native.js +0 -567
  306. package/src/button/editor.native.scss +0 -70
  307. package/src/button/rich-text.android.scss +0 -6
  308. package/src/button/rich-text.ios.scss +0 -6
  309. package/src/buttons/edit.native.js +0 -157
  310. package/src/buttons/editor.native.scss +0 -11
  311. package/src/buttons/test/__snapshots__/edit.native.js.snap +0 -99
  312. package/src/buttons/test/__snapshots__/transforms.native.js.snap +0 -31
  313. package/src/buttons/test/edit.native.js +0 -485
  314. package/src/buttons/test/transforms.native.js +0 -48
  315. package/src/buttons/transforms.native.js +0 -12
  316. package/src/code/edit.native.js +0 -70
  317. package/src/code/test/__snapshots__/edit.native.js.snap +0 -13
  318. package/src/code/test/edit.native.js +0 -65
  319. package/src/code/theme.native.scss +0 -22
  320. package/src/code/transforms.native.js +0 -12
  321. package/src/column/column-preview.native.js +0 -58
  322. package/src/column/edit.native.js +0 -273
  323. package/src/column/editor.native.scss +0 -75
  324. package/src/columns/columnCalculations.native.js +0 -178
  325. package/src/columns/edit.native.js +0 -507
  326. package/src/columns/editor.native.scss +0 -17
  327. package/src/columns/test/__snapshots__/edit.native.js.snap +0 -305
  328. package/src/columns/test/__snapshots__/transforms.native.js.snap +0 -61
  329. package/src/columns/test/edit.native.js +0 -496
  330. package/src/columns/test/transforms.native.js +0 -89
  331. package/src/columns/transforms.native.js +0 -12
  332. package/src/cover/controls.native.js +0 -307
  333. package/src/cover/edit.native.js +0 -708
  334. package/src/cover/focal-point-settings-button.native.js +0 -53
  335. package/src/cover/overlay-color-settings.native.js +0 -106
  336. package/src/cover/style.native.scss +0 -220
  337. package/src/cover/test/__snapshots__/edit.native.js.snap +0 -105
  338. package/src/cover/test/__snapshots__/transforms.native.js.snap +0 -73
  339. package/src/cover/test/edit.native.js +0 -701
  340. package/src/cover/test/transforms.native.js +0 -116
  341. package/src/cover/transforms.native.js +0 -12
  342. package/src/cover/use-cover-is-dark.native.js +0 -51
  343. package/src/embed/edit.native.js +0 -345
  344. package/src/embed/embed-controls.native.js +0 -65
  345. package/src/embed/embed-link-settings.native.js +0 -99
  346. package/src/embed/embed-loading.native.js +0 -29
  347. package/src/embed/embed-no-preview.native.js +0 -230
  348. package/src/embed/embed-placeholder.native.js +0 -178
  349. package/src/embed/embed-preview.native.js +0 -157
  350. package/src/embed/styles.native.scss +0 -196
  351. package/src/embed/test/__snapshots__/index.native.js.snap +0 -191
  352. package/src/embed/test/__snapshots__/transforms.native.js.snap +0 -23
  353. package/src/embed/test/index.native.js +0 -1125
  354. package/src/embed/test/transforms.native.js +0 -44
  355. package/src/embed/transforms.native.js +0 -12
  356. package/src/embed/wp-embed-preview.native.js +0 -80
  357. package/src/file/edit.native.js +0 -605
  358. package/src/file/style.native.scss +0 -79
  359. package/src/file/test/__snapshots__/edit.native.js.snap +0 -580
  360. package/src/file/test/__snapshots__/transforms.native.js.snap +0 -19
  361. package/src/file/test/edit.native.js +0 -93
  362. package/src/file/test/transforms.native.js +0 -43
  363. package/src/file/transforms.native.js +0 -12
  364. package/src/freeform/edit.native.js +0 -13
  365. package/src/freeform/test/__snapshots__/index.native.js.snap +0 -7
  366. package/src/freeform/test/__snapshots__/transforms.native.js.snap +0 -19
  367. package/src/freeform/test/index.native.js +0 -57
  368. package/src/freeform/test/transforms.native.js +0 -39
  369. package/src/gallery/gallery-styles.native.scss +0 -8
  370. package/src/gallery/gallery.native.js +0 -124
  371. package/src/gallery/styles.native.scss +0 -7
  372. package/src/gallery/test/__snapshots__/index.native.js.snap +0 -177
  373. package/src/gallery/test/__snapshots__/transforms.native.js.snap +0 -53
  374. package/src/gallery/test/helpers.native.js +0 -106
  375. package/src/gallery/test/index.native.js +0 -700
  376. package/src/gallery/test/transforms.native.js +0 -53
  377. package/src/gallery/test/use-get-media.native.js +0 -24
  378. package/src/gallery/transforms.native.js +0 -12
  379. package/src/gallery/use-get-media.native.js +0 -49
  380. package/src/group/edit.native.js +0 -137
  381. package/src/group/editor.native.scss +0 -56
  382. package/src/group/test/__snapshots__/edit.native.js.snap +0 -19
  383. package/src/group/test/__snapshots__/transforms.native.js.snap +0 -35
  384. package/src/group/test/edit.native.js +0 -100
  385. package/src/group/test/transforms.native.js +0 -73
  386. package/src/heading/edit.native.js +0 -159
  387. package/src/heading/test/__snapshots__/index.native.js.snap +0 -43
  388. package/src/heading/test/__snapshots__/transforms.native.js.snap +0 -47
  389. package/src/heading/test/index.native.js +0 -257
  390. package/src/heading/test/transforms.native.js +0 -46
  391. package/src/heading/transforms.native.js +0 -12
  392. package/src/html/transforms.native.js +0 -11
  393. package/src/image/edit.native.js +0 -959
  394. package/src/image/styles.native.scss +0 -70
  395. package/src/image/test/__snapshots__/transforms.native.js.snap +0 -49
  396. package/src/image/test/edit.native.js +0 -459
  397. package/src/image/test/transforms.native.js +0 -49
  398. package/src/image/transforms.native.js +0 -12
  399. package/src/index.native.js +0 -274
  400. package/src/latest-posts/edit.native.js +0 -294
  401. package/src/latest-posts/style.native.scss +0 -47
  402. package/src/latest-posts/test/__snapshots__/edit.native.js.snap +0 -3
  403. package/src/latest-posts/test/__snapshots__/transforms.native.js.snap +0 -15
  404. package/src/latest-posts/test/edit.native.js +0 -49
  405. package/src/latest-posts/test/transforms.native.js +0 -61
  406. package/src/list/tag-name.native.js +0 -12
  407. package/src/list/test/__snapshots__/edit.native.js.snap +0 -121
  408. package/src/list/test/__snapshots__/transforms.native.js.snap +0 -85
  409. package/src/list/test/edit.native.js +0 -602
  410. package/src/list/test/transforms.native.js +0 -56
  411. package/src/list/transforms.native.js +0 -12
  412. package/src/list-item/edit.native.js +0 -175
  413. package/src/list-item/hooks/use-enter.native.js +0 -81
  414. package/src/list-item/icons.native.js +0 -34
  415. package/src/list-item/list-style-type.native.js +0 -146
  416. package/src/list-item/style.native.scss +0 -57
  417. package/src/media-text/edit.native.js +0 -417
  418. package/src/media-text/icon-retry.native.js +0 -11
  419. package/src/media-text/media-container.native.js +0 -393
  420. package/src/media-text/style.native.scss +0 -191
  421. package/src/media-text/test/__snapshots__/transforms.native.js.snap +0 -73
  422. package/src/media-text/test/edit.native.js +0 -58
  423. package/src/media-text/test/transforms.native.js +0 -116
  424. package/src/media-text/transforms.native.js +0 -12
  425. package/src/missing/edit.native.js +0 -294
  426. package/src/missing/style.native.scss +0 -79
  427. package/src/missing/test/__snapshots__/edit.native.js.snap +0 -110
  428. package/src/missing/test/edit-integration.native.js +0 -168
  429. package/src/missing/test/edit.native.js +0 -81
  430. package/src/more/edit.native.js +0 -36
  431. package/src/more/editor.native.scss +0 -21
  432. package/src/more/test/__snapshots__/edit.native.js.snap +0 -7
  433. package/src/more/test/__snapshots__/transforms.native.js.snap +0 -19
  434. package/src/more/test/edit.native.js +0 -41
  435. package/src/more/test/transforms.native.js +0 -42
  436. package/src/more/transforms.native.js +0 -12
  437. package/src/navigation-link/shared/build-css-font-sizes.php +0 -43
  438. package/src/nextpage/edit.native.js +0 -58
  439. package/src/nextpage/editor.native.scss +0 -21
  440. package/src/nextpage/test/__snapshots__/transforms.native.js.snap +0 -19
  441. package/src/nextpage/test/transforms.native.js +0 -42
  442. package/src/nextpage/transforms.native.js +0 -12
  443. package/src/paragraph/edit.native.js +0 -116
  444. package/src/paragraph/test/__snapshots__/edit.native.js.snap +0 -88
  445. package/src/paragraph/test/__snapshots__/transforms.native.js.snap +0 -65
  446. package/src/paragraph/test/edit.native.js +0 -999
  447. package/src/paragraph/test/transforms.native.js +0 -51
  448. package/src/paragraph/transforms.native.js +0 -12
  449. package/src/preformatted/edit.native.js +0 -48
  450. package/src/preformatted/styles.native.scss +0 -30
  451. package/src/preformatted/test/__snapshots__/edit.native.js.snap +0 -95
  452. package/src/preformatted/test/__snapshots__/transforms.native.js.snap +0 -37
  453. package/src/preformatted/test/edit.native.js +0 -111
  454. package/src/preformatted/test/transforms.native.js +0 -47
  455. package/src/preformatted/transforms.native.js +0 -12
  456. package/src/pullquote/blockquote.native.js +0 -39
  457. package/src/pullquote/blockquote.native.scss +0 -8
  458. package/src/pullquote/edit.native.js +0 -128
  459. package/src/pullquote/figure.native.js +0 -33
  460. package/src/pullquote/figure.native.scss +0 -16
  461. package/src/pullquote/test/__snapshots__/transforms.native.js.snap +0 -47
  462. package/src/pullquote/test/edit.native.js +0 -73
  463. package/src/pullquote/test/transforms.native.js +0 -46
  464. package/src/pullquote/transforms.native.js +0 -12
  465. package/src/quote/test/__snapshots__/transforms.native.js.snap +0 -49
  466. package/src/quote/test/edit.native.js +0 -94
  467. package/src/quote/test/transforms.native.js +0 -69
  468. package/src/quote/transforms.native.js +0 -12
  469. package/src/search/edit.native.js +0 -486
  470. package/src/search/style.native.scss +0 -99
  471. package/src/search/test/__snapshots__/edit.native.js.snap +0 -827
  472. package/src/search/test/__snapshots__/transforms.native.js.snap +0 -15
  473. package/src/search/test/edit.native.js +0 -170
  474. package/src/search/test/transforms.native.js +0 -40
  475. package/src/separator/separator-settings.native.js +0 -3
  476. package/src/separator/test/__snapshots__/edit.native.js.snap +0 -7
  477. package/src/separator/test/__snapshots__/transforms.native.js.snap +0 -25
  478. package/src/separator/test/edit.native.js +0 -41
  479. package/src/separator/test/transforms.native.js +0 -42
  480. package/src/separator/transforms.native.js +0 -12
  481. package/src/shortcode/edit.native.js +0 -77
  482. package/src/shortcode/style.native.scss +0 -44
  483. package/src/shortcode/test/__snapshots__/edit.native.js.snap +0 -9
  484. package/src/shortcode/test/__snapshots__/transforms.native.js.snap +0 -19
  485. package/src/shortcode/test/edit.native.js +0 -70
  486. package/src/shortcode/test/transforms.native.js +0 -42
  487. package/src/shortcode/transforms.native.js +0 -12
  488. package/src/social-link/edit.native.js +0 -219
  489. package/src/social-link/editor.native.scss +0 -18
  490. package/src/social-links/edit.native.js +0 -147
  491. package/src/social-links/editor.native.scss +0 -25
  492. package/src/social-links/test/__snapshots__/edit.native.js.snap +0 -57
  493. package/src/social-links/test/__snapshots__/transforms.native.js.snap +0 -31
  494. package/src/social-links/test/edit.native.js +0 -266
  495. package/src/social-links/test/transforms.native.js +0 -53
  496. package/src/spacer/controls.native.js +0 -86
  497. package/src/spacer/edit.native.js +0 -110
  498. package/src/spacer/editor.native.scss +0 -18
  499. package/src/spacer/save.native.js +0 -18
  500. package/src/spacer/test/__snapshots__/index.native.js.snap +0 -43
  501. package/src/spacer/test/__snapshots__/transforms.native.js.snap +0 -25
  502. package/src/spacer/test/index.native.js +0 -257
  503. package/src/spacer/test/transforms.native.js +0 -42
  504. package/src/table/transforms.native.js +0 -11
  505. package/src/text-columns/transforms.native.js +0 -12
  506. package/src/utils/init-block.native.js +0 -40
  507. package/src/utils/transformation-categories.native.js +0 -47
  508. package/src/verse/test/__snapshots__/edit.native.js.snap +0 -13
  509. package/src/verse/test/__snapshots__/transforms.native.js.snap +0 -31
  510. package/src/verse/test/edit.native.js +0 -118
  511. package/src/verse/test/transforms.native.js +0 -46
  512. package/src/verse/transforms.native.js +0 -12
  513. package/src/video/edit.native.js +0 -406
  514. package/src/video/icon-retry.native.js +0 -11
  515. package/src/video/style.native.scss +0 -81
  516. package/src/video/test/__snapshots__/transforms.native.js.snap +0 -41
  517. package/src/video/test/edit.native.js +0 -53
  518. package/src/video/test/transforms.native.js +0 -49
  519. package/src/video/transforms.native.js +0 -12
@@ -1,701 +0,0 @@
1
- /**
2
- * External dependencies
3
- */
4
- import { Image } from 'react-native';
5
- import {
6
- getEditorHtml,
7
- initializeEditor,
8
- render,
9
- fireEvent,
10
- waitForModalVisible,
11
- within,
12
- getBlock,
13
- openBlockSettings,
14
- setupMediaPicker,
15
- setupPicker,
16
- } from 'test/helpers';
17
-
18
- /**
19
- * WordPress dependencies
20
- */
21
- import { BottomSheetSettings, BlockEdit } from '@wordpress/block-editor';
22
- import { SlotFillProvider } from '@wordpress/components';
23
- import { setDefaultBlockName, unregisterBlockType } from '@wordpress/blocks';
24
- import {
25
- requestMediaPicker,
26
- requestMediaEditor,
27
- } from '@wordpress/react-native-bridge';
28
-
29
- /**
30
- * Internal dependencies
31
- */
32
- import { IMAGE_BACKGROUND_TYPE } from '../shared';
33
- import * as paragraph from '../../paragraph';
34
- import * as cover from '..';
35
-
36
- // Avoid errors due to mocked stylesheet files missing required selectors.
37
- jest.mock( '@wordpress/compose', () => ( {
38
- ...jest.requireActual( '@wordpress/compose' ),
39
- withPreferredColorScheme: jest.fn( ( Component ) => ( props ) => (
40
- <Component
41
- { ...props }
42
- preferredColorScheme={ {} }
43
- getStylesFromColorScheme={ jest.fn( () => ( {} ) ) }
44
- />
45
- ) ),
46
- } ) );
47
-
48
- const COVER_BLOCK_PLACEHOLDER_HTML = `<!-- wp:cover {"isDark":false} -->
49
- <div class="wp-block-cover is-light"><span aria-hidden="true" class="wp-block-cover__background has-background-dim-100 has-background-dim"></span><div class="wp-block-cover__inner-container"></div></div>
50
- <!-- /wp:cover -->`;
51
- const COVER_BLOCK_SOLID_COLOR_HTML = `<!-- wp:cover {"overlayColor":"cyan-bluish-gray","isDark":false} -->
52
- <div class="wp-block-cover is-light"><span aria-hidden="true" class="wp-block-cover__background has-cyan-bluish-gray-background-color has-background-dim-100 has-background-dim"></span><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"Write title…"} -->
53
- <p class="has-text-align-center"></p>
54
- <!-- /wp:paragraph --></div></div>
55
- <!-- /wp:cover -->`;
56
- const COVER_BLOCK_IMAGE_HTML = `<!-- wp:cover {"url":"https://cldup.com/cXyG__fTLN.jpg","id":10710,"dimRatio":50,"overlayColor":"foreground","isUserOverlayColor":true,"isDark":false} -->
57
- <div class="wp-block-cover is-light"><img class="wp-block-cover__image-background wp-image-10710" alt="" src="https://cldup.com/cXyG__fTLN.jpg" data-object-fit="cover"/><span aria-hidden="true" class="wp-block-cover__background has-foreground-background-color has-background-dim"></span><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"Write title…","fontSize":"large"} -->
58
- <p class="has-text-align-center has-large-font-size"></p>
59
- <!-- /wp:paragraph --></div></div>
60
- <!-- /wp:cover -->`;
61
- const COVER_BLOCK_CUSTOM_HEIGHT_HTML = `<!-- wp:cover {"url":"https://cldup.com/cXyG__fTLN.jpg","id":10710,"dimRatio":50,"overlayColor":"foreground","isUserOverlayColor":true,"minHeight":20,"minHeightUnit":"vw","isDark":false} -->
62
- <div class="wp-block-cover is-light" style="min-height:20vw"><img class="wp-block-cover__image-background wp-image-10710" alt="" src="https://cldup.com/cXyG__fTLN.jpg" data-object-fit="cover"/><span aria-hidden="true" class="wp-block-cover__background has-foreground-background-color has-background-dim"></span><div class="wp-block-cover__inner-container"><!-- wp:paragraph {"align":"center","placeholder":"Write title…","fontSize":"large"} -->
63
- <p class="has-text-align-center has-large-font-size"></p>
64
- <!-- /wp:paragraph --></div></div>
65
- <!-- /wp:cover -->`;
66
-
67
- const COLOR_PINK = '#f78da7';
68
- const COLOR_RED = '#cf2e2e';
69
- const COLOR_GRAY = '#abb8c3';
70
- const GRADIENT_GREEN =
71
- 'linear-gradient(135deg,rgb(122,220,180) 0%,rgb(0,208,130) 100%)';
72
-
73
- const MEDIA_OPTIONS = [
74
- 'Choose from device',
75
- 'Take a Photo',
76
- 'Take a Video',
77
- 'WordPress Media Library',
78
- ];
79
-
80
- // Simplified tree to render Cover edit within slot.
81
- const CoverEdit = ( props ) => (
82
- <SlotFillProvider>
83
- <BlockEdit
84
- isSelected
85
- mayDisplayControls
86
- name={ cover.name }
87
- clientId={ 0 }
88
- { ...props }
89
- />
90
- <BottomSheetSettings isVisible />
91
- </SlotFillProvider>
92
- );
93
-
94
- const setAttributes = jest.fn();
95
- const attributes = {
96
- backgroundType: IMAGE_BACKGROUND_TYPE,
97
- focalPoint: { x: '0.25', y: '0.75' },
98
- hasParallax: false,
99
- overlayColor: { color: '#000000' },
100
- url: 'mock-url',
101
- };
102
-
103
- beforeAll( () => {
104
- // Mock Image.getSize to avoid failed attempt to size non-existent image.
105
- const getSizeSpy = jest.spyOn( Image, 'getSize' );
106
- getSizeSpy.mockImplementation( ( _url, callback ) => callback( 300, 200 ) );
107
-
108
- // Register required blocks.
109
- paragraph.init();
110
- cover.init();
111
- setDefaultBlockName( paragraph.name );
112
- } );
113
-
114
- afterAll( () => {
115
- // Restore mocks.
116
- Image.getSize.mockRestore();
117
-
118
- // Clean up registered blocks.
119
- unregisterBlockType( paragraph.name );
120
- unregisterBlockType( cover.name );
121
- } );
122
-
123
- describe( 'when no media is attached', () => {
124
- it( 'adds an image or video', async () => {
125
- const { getByText, findByText } = render(
126
- <CoverEdit
127
- attributes={ {
128
- ...attributes,
129
- url: undefined,
130
- backgroundType: undefined,
131
- } }
132
- setAttributes={ setAttributes }
133
- />
134
- );
135
- fireEvent.press( getByText( 'Add image or video' ) );
136
- const mediaLibraryButton = await findByText(
137
- 'WordPress Media Library'
138
- );
139
- fireEvent.press( mediaLibraryButton );
140
-
141
- expect( requestMediaPicker ).toHaveBeenCalled();
142
- } );
143
- } );
144
-
145
- describe( 'when no media is attached and overlay color is set', () => {
146
- it( 'adds image', async () => {
147
- const media = {
148
- type: 'image',
149
- id: 2000,
150
- url: 'https://test.files.wordpress.com/local-image-1.mp4',
151
- };
152
- const { mediaPickerCallback } = setupMediaPicker();
153
- const screen = await initializeEditor( {
154
- initialHtml: COVER_BLOCK_SOLID_COLOR_HTML,
155
- } );
156
- const { getByText } = screen;
157
- const { selectOption } = setupPicker( screen, MEDIA_OPTIONS );
158
-
159
- // Get block
160
- const coverBlock = await getBlock( screen, 'Cover' );
161
- fireEvent.press( coverBlock );
162
-
163
- // Open block settings
164
- await openBlockSettings( screen );
165
-
166
- fireEvent.press( getByText( 'Add image or video' ) );
167
- selectOption( 'WordPress Media Library' );
168
- await mediaPickerCallback( media );
169
-
170
- expect( getEditorHtml() ).toMatchSnapshot();
171
- } );
172
- } );
173
-
174
- describe( 'when an image is attached', () => {
175
- it( 'edits the image', async () => {
176
- const screen = render(
177
- <CoverEdit
178
- attributes={ attributes }
179
- setAttributes={ setAttributes }
180
- />
181
- );
182
-
183
- fireEvent.press( screen.getByLabelText( 'Edit image' ) );
184
- const editButton = await screen.findByText( 'Edit' );
185
- fireEvent.press( editButton );
186
-
187
- expect( requestMediaEditor ).toHaveBeenCalled();
188
- } );
189
-
190
- it( 'replaces the image', async () => {
191
- const screen = render(
192
- <CoverEdit
193
- attributes={ attributes }
194
- setAttributes={ setAttributes }
195
- />
196
- );
197
- fireEvent.press( screen.getByLabelText( 'Edit image' ) );
198
- const replaceButton = await screen.findByText( 'Replace' );
199
- fireEvent.press( replaceButton );
200
- const mediaLibraryButton = await screen.findByText(
201
- 'WordPress Media Library'
202
- );
203
- fireEvent.press( mediaLibraryButton );
204
-
205
- expect( requestMediaPicker ).toHaveBeenCalled();
206
- } );
207
-
208
- it( 'clears the image within image edit button', async () => {
209
- const screen = render(
210
- <CoverEdit
211
- attributes={ attributes }
212
- setAttributes={ setAttributes }
213
- />
214
- );
215
- fireEvent.press( screen.getByLabelText( 'Edit image' ) );
216
- const [ clearMediaButton ] =
217
- await screen.findAllByText( 'Clear Media' );
218
- fireEvent.press( clearMediaButton );
219
-
220
- expect( setAttributes ).toHaveBeenCalledWith(
221
- expect.objectContaining( {
222
- focalPoint: undefined,
223
- hasParallax: undefined,
224
- id: undefined,
225
- url: undefined,
226
- } )
227
- );
228
- } );
229
-
230
- it( 'toggles a fixed background', async () => {
231
- const screen = render(
232
- <CoverEdit
233
- attributes={ attributes }
234
- setAttributes={ setAttributes }
235
- />
236
- );
237
- const fixedBackgroundButton =
238
- await screen.findByText( 'Fixed background' );
239
- fireEvent.press( fixedBackgroundButton );
240
-
241
- expect( setAttributes ).toHaveBeenCalledWith(
242
- expect.objectContaining( {
243
- hasParallax: ! attributes.hasParallax,
244
- } )
245
- );
246
- } );
247
-
248
- it( 'edits the focal point with a slider', async () => {
249
- const screen = render(
250
- <CoverEdit
251
- attributes={ attributes }
252
- setAttributes={ setAttributes }
253
- />
254
- );
255
- const editFocalPointButton =
256
- await screen.findByText( 'Edit focal point' );
257
- fireEvent.press( editFocalPointButton );
258
- fireEvent(
259
- screen.getByTestId( 'Slider Y-Axis Position', { hidden: true } ),
260
- 'valueChange',
261
- '52'
262
- );
263
- fireEvent.press( screen.getByLabelText( 'Apply' ) );
264
- // TODO(jest-console): Fix the warning and remove the expect below.
265
- expect( console ).toHaveWarnedWith(
266
- `Non-serializable values were found in the navigation state. Check:\n\nFocalPoint > params.onFocalPointChange (Function)\n\nThis can break usage such as persisting and restoring state. This might happen if you passed non-serializable values such as function, class instances etc. in params. If you need to use components with callbacks in your options, you can use 'navigation.setOptions' instead. See https://reactnavigation.org/docs/troubleshooting#i-get-the-warning-non-serializable-values-were-found-in-the-navigation-state for more details.`
267
- );
268
-
269
- expect( setAttributes ).toHaveBeenCalledWith(
270
- expect.objectContaining( {
271
- focalPoint: { ...attributes.focalPoint, y: '0.52' },
272
- } )
273
- );
274
- } );
275
-
276
- it( 'edits the focal point with a text input', async () => {
277
- const screen = render(
278
- <CoverEdit
279
- attributes={ attributes }
280
- setAttributes={ setAttributes }
281
- />
282
- );
283
- const editFocalPointButton =
284
- await screen.findByText( 'Edit focal point' );
285
- fireEvent.press( editFocalPointButton );
286
- fireEvent.press(
287
- screen.getByText( ( attributes.focalPoint.x * 100 ).toString(), {
288
- hidden: true,
289
- } )
290
- );
291
- fireEvent.changeText(
292
- screen.getByLabelText( 'X-Axis Position', { hidden: true } ),
293
- '99'
294
- );
295
- fireEvent.press( screen.getByLabelText( 'Apply' ) );
296
-
297
- expect( setAttributes ).toHaveBeenCalledWith(
298
- expect.objectContaining( {
299
- focalPoint: { ...attributes.focalPoint, x: '0.99' },
300
- } )
301
- );
302
- } );
303
-
304
- it( 'discards canceled focal point changes', async () => {
305
- const screen = render(
306
- <CoverEdit
307
- attributes={ attributes }
308
- setAttributes={ setAttributes }
309
- />
310
- );
311
- const editFocalPointButton =
312
- await screen.findByText( 'Edit focal point' );
313
- fireEvent.press( editFocalPointButton );
314
- fireEvent.press(
315
- screen.getByText( ( attributes.focalPoint.x * 100 ).toString(), {
316
- hidden: true,
317
- } )
318
- );
319
- fireEvent.changeText(
320
- screen.getByLabelText( 'X-Axis Position', { hidden: true } ),
321
- '80'
322
- );
323
- fireEvent.press( screen.getByLabelText( 'Go back' ) );
324
-
325
- expect( setAttributes ).not.toHaveBeenCalledWith(
326
- expect.objectContaining( {
327
- focalPoint: { ...attributes.focalPoint, x: '0.80' },
328
- } )
329
- );
330
- } );
331
-
332
- it( 'clears the media within cell button', async () => {
333
- const screen = render(
334
- <CoverEdit
335
- attributes={ attributes }
336
- setAttributes={ setAttributes }
337
- />
338
- );
339
- const clearMediaButton = await screen.findByText( 'Clear Media' );
340
- fireEvent.press( clearMediaButton );
341
-
342
- expect( setAttributes ).toHaveBeenCalledWith(
343
- expect.objectContaining( {
344
- focalPoint: undefined,
345
- hasParallax: undefined,
346
- id: undefined,
347
- url: undefined,
348
- } )
349
- );
350
- } );
351
-
352
- it( 'updates background opacity', async () => {
353
- const screen = await initializeEditor( {
354
- initialHtml: COVER_BLOCK_IMAGE_HTML,
355
- } );
356
- const { getByLabelText } = screen;
357
-
358
- // Get block
359
- const coverBlock = await getBlock( screen, 'Cover' );
360
- fireEvent.press( coverBlock );
361
-
362
- // Open block settings
363
- await openBlockSettings( screen );
364
-
365
- // Update Opacity attribute
366
- const opacityControl = getByLabelText( /Opacity/ );
367
- fireEvent.press(
368
- within( opacityControl ).getByText( '50', { hidden: true } )
369
- );
370
- const heightTextInput = within( opacityControl ).getByDisplayValue(
371
- '50',
372
- { hidden: true }
373
- );
374
- fireEvent.changeText( heightTextInput, '20' );
375
-
376
- // The decreasing button should be disabled
377
- fireEvent( opacityControl, 'accessibilityAction', {
378
- nativeEvent: { actionName: 'decrement' },
379
- } );
380
-
381
- expect( getEditorHtml() ).toMatchSnapshot();
382
- } );
383
- } );
384
-
385
- describe( 'color settings', () => {
386
- it( 'sets a color for the overlay background when the placeholder is visible', async () => {
387
- const screen = await initializeEditor( {
388
- initialHtml: COVER_BLOCK_PLACEHOLDER_HTML,
389
- } );
390
-
391
- const block = await screen.findByLabelText( 'Cover block. Empty' );
392
- expect( block ).toBeDefined();
393
-
394
- // Select a color from the placeholder palette.
395
- const colorPalette = await screen.findByTestId( 'color-palette' );
396
- const colorButton = within( colorPalette ).getByTestId( COLOR_PINK );
397
-
398
- expect( colorButton ).toBeDefined();
399
- fireEvent.press( colorButton );
400
-
401
- // Wait for the block to be created.
402
- const [ coverBlockWithOverlay ] =
403
- await screen.findAllByLabelText( /Cover Block\. Row 1/ );
404
- fireEvent.press( coverBlockWithOverlay );
405
-
406
- // Open Block Settings.
407
- const settingsButton = await screen.findByLabelText( 'Open Settings' );
408
- fireEvent.press( settingsButton );
409
-
410
- // Wait for Block Settings to be visible.
411
- const blockSettingsModal = screen.getByTestId( 'block-settings-modal' );
412
- await waitForModalVisible( blockSettingsModal );
413
-
414
- // Open the overlay color settings.
415
- const colorOverlay = await screen.findByLabelText( 'Color. Empty' );
416
- expect( colorOverlay ).toBeDefined();
417
- fireEvent.press( colorOverlay );
418
-
419
- // Find the selected color.
420
- const colorPaletteButton = await screen.findByTestId( COLOR_PINK );
421
- expect( colorPaletteButton ).toBeDefined();
422
- // TODO(jest-console): Fix the warning and remove the expect below.
423
- expect( console ).toHaveWarnedWith(
424
- `Non-serializable values were found in the navigation state. Check:\n\nColor > params.onColorChange (Function)\n\nThis can break usage such as persisting and restoring state. This might happen if you passed non-serializable values such as function, class instances etc. in params. If you need to use components with callbacks in your options, you can use 'navigation.setOptions' instead. See https://reactnavigation.org/docs/troubleshooting#i-get-the-warning-non-serializable-values-were-found-in-the-navigation-state for more details.`
425
- );
426
-
427
- // Select another color.
428
- const newColorButton = await screen.findByTestId( COLOR_RED );
429
- fireEvent.press( newColorButton );
430
-
431
- expect( getEditorHtml() ).toMatchSnapshot();
432
- } );
433
-
434
- it( 'sets a gradient overlay background when a solid background was already selected', async () => {
435
- const screen = await initializeEditor( {
436
- initialHtml: COVER_BLOCK_SOLID_COLOR_HTML,
437
- } );
438
-
439
- // Wait for the block to be created.
440
- const [ coverBlock ] =
441
- await screen.findAllByLabelText( /Cover Block\. Row 1/ );
442
- fireEvent.press( coverBlock );
443
-
444
- // Open Block Settings.
445
- const settingsButton = await screen.findByLabelText( 'Open Settings' );
446
- fireEvent.press( settingsButton );
447
-
448
- // Wait for Block Settings to be visible.
449
- const blockSettingsModal = screen.getByTestId( 'block-settings-modal' );
450
- await waitForModalVisible( blockSettingsModal );
451
-
452
- // Open the overlay color settings.
453
- const colorOverlay = await screen.findByLabelText( 'Color. Empty' );
454
- fireEvent.press( colorOverlay );
455
-
456
- // Find the selected color.
457
- const colorButton = await screen.findByTestId( COLOR_GRAY );
458
- expect( colorButton ).toBeDefined();
459
-
460
- // Open the gradients.
461
- const gradientsButton = await screen.findByLabelText( 'Gradient' );
462
- expect( gradientsButton ).toBeDefined();
463
-
464
- fireEvent( gradientsButton, 'layout', {
465
- nativeEvent: { layout: { width: 80, height: 26 } },
466
- } );
467
- fireEvent.press( gradientsButton );
468
-
469
- // Find the gradient color.
470
- const newGradientButton = await screen.findByTestId( GRADIENT_GREEN );
471
- fireEvent.press( newGradientButton );
472
-
473
- // Dismiss the Block Settings modal.
474
- fireEvent( blockSettingsModal, 'backdropPress' );
475
-
476
- expect( getEditorHtml() ).toMatchSnapshot();
477
- } );
478
-
479
- it( 'toggles between solid colors and gradients', async () => {
480
- const screen = await initializeEditor( {
481
- initialHtml: COVER_BLOCK_PLACEHOLDER_HTML,
482
- } );
483
-
484
- const block = await screen.findByLabelText( 'Cover block. Empty' );
485
- expect( block ).toBeDefined();
486
-
487
- // Select a color from the placeholder palette.
488
- const colorPalette = await screen.findByTestId( 'color-palette' );
489
- const colorButton = within( colorPalette ).getByTestId( COLOR_PINK );
490
-
491
- expect( colorButton ).toBeDefined();
492
- fireEvent.press( colorButton );
493
-
494
- // Wait for the block to be created.
495
- const [ coverBlockWithOverlay ] =
496
- await screen.findAllByLabelText( /Cover Block\. Row 1/ );
497
- fireEvent.press( coverBlockWithOverlay );
498
-
499
- // Open Block Settings.
500
- const settingsButton = await screen.findByLabelText( 'Open Settings' );
501
- fireEvent.press( settingsButton );
502
-
503
- // Wait for Block Settings to be visible.
504
- const blockSettingsModal = screen.getByTestId( 'block-settings-modal' );
505
- await waitForModalVisible( blockSettingsModal );
506
-
507
- // Open the overlay color settings.
508
- const colorOverlay = await screen.findByLabelText( 'Color. Empty' );
509
- fireEvent.press( colorOverlay );
510
-
511
- // Find the selected color.
512
- const colorPaletteButton = await screen.findByTestId( COLOR_PINK );
513
- expect( colorPaletteButton ).toBeDefined();
514
-
515
- // Select another color.
516
- const newColorButton = await screen.findByTestId( COLOR_RED );
517
- fireEvent.press( newColorButton );
518
-
519
- // Open the gradients.
520
- const gradientsButton = await screen.findByLabelText( 'Gradient' );
521
-
522
- fireEvent( gradientsButton, 'layout', {
523
- nativeEvent: { layout: { width: 80, height: 26 } },
524
- } );
525
- fireEvent.press( gradientsButton );
526
-
527
- // Find the gradient color.
528
- const newGradientButton = await screen.findByTestId( GRADIENT_GREEN );
529
- fireEvent.press( newGradientButton );
530
-
531
- // Go back to the settings list.
532
- fireEvent.press( await screen.findByLabelText( 'Go back' ) );
533
-
534
- // Find the color setting.
535
- const colorSetting = await screen.findByLabelText( 'Color. Empty' );
536
- fireEvent.press( colorSetting );
537
-
538
- // Dismiss the Block Settings modal.
539
- fireEvent( blockSettingsModal, 'backdropPress' );
540
-
541
- expect( getEditorHtml() ).toMatchSnapshot();
542
- } );
543
-
544
- it( 'clears the selected overlay color and maintains the inner blocks', async () => {
545
- const screen = await initializeEditor( {
546
- initialHtml: COVER_BLOCK_SOLID_COLOR_HTML,
547
- } );
548
-
549
- // Wait for the block to be created.
550
- const [ coverBlock ] =
551
- await screen.findAllByLabelText( /Cover Block\. Row 1/ );
552
- fireEvent.press( coverBlock );
553
-
554
- // Open Block Settings.
555
- const settingsButton = await screen.findByLabelText( 'Open Settings' );
556
- fireEvent.press( settingsButton );
557
-
558
- // Wait for Block Settings to be visible.
559
- const blockSettingsModal = screen.getByTestId( 'block-settings-modal' );
560
- await waitForModalVisible( blockSettingsModal );
561
-
562
- // Open the overlay color settings.
563
- const colorOverlay = await screen.findByLabelText( 'Color. Empty' );
564
- fireEvent.press( colorOverlay );
565
-
566
- // Find the selected color.
567
- const colorButton = await screen.findByTestId( COLOR_GRAY );
568
- expect( colorButton ).toBeDefined();
569
-
570
- // Reset the selected color.
571
- const resetButton = await screen.findByText( 'Reset' );
572
- fireEvent.press( resetButton );
573
-
574
- expect( getEditorHtml() ).toMatchSnapshot();
575
- } );
576
-
577
- it( 'displays the hex color value in the custom color picker', async () => {
578
- const screen = await initializeEditor( {
579
- initialHtml: COVER_BLOCK_PLACEHOLDER_HTML,
580
- } );
581
-
582
- // Select a color from the placeholder palette.
583
- const colorButton = screen.getByA11yHint(
584
- 'Navigates to custom color picker'
585
- );
586
- fireEvent.press( colorButton );
587
-
588
- // Wait for Block Settings to be visible.
589
- const blockSettingsModal = screen.getByTestId( 'block-settings-modal' );
590
- await waitForModalVisible( blockSettingsModal );
591
-
592
- // Assert label text before tapping color picker
593
- expect( screen.getByText( 'Select a color' ) ).toBeVisible();
594
-
595
- // Tap color picker
596
- const colorPicker = screen.getByTestId( 'hsv-color-picker' );
597
- fireEvent( colorPicker, 'onHuePickerPress', {
598
- hue: 120,
599
- saturation: 12,
600
- value: 50,
601
- } );
602
-
603
- // Assert label hex value after tapping color picker
604
- expect( screen.getByText( '#00FF00' ) ).toBeVisible();
605
- } );
606
- } );
607
-
608
- describe( 'minimum height settings', () => {
609
- it( 'changes the height value to 20(vw)', async () => {
610
- const screen = await initializeEditor( {
611
- initialHtml: COVER_BLOCK_IMAGE_HTML,
612
- } );
613
- const { getByText, getByDisplayValue } = screen;
614
-
615
- // Get block
616
- const coverBlock = await getBlock( screen, 'Cover' );
617
- fireEvent.press( coverBlock );
618
-
619
- // Open block settings
620
- await openBlockSettings( screen );
621
-
622
- // Set vw unit
623
- fireEvent.press( getByText( 'px', { hidden: true } ) );
624
- fireEvent.press( getByText( 'Viewport width (vw)', { hidden: true } ) );
625
-
626
- // Update height attribute
627
- fireEvent.press( getByText( '300', { hidden: true } ) );
628
- const heightTextInput = getByDisplayValue( '300', { hidden: true } );
629
- fireEvent.changeText( heightTextInput, '20' );
630
-
631
- expect( getEditorHtml() ).toMatchSnapshot();
632
- } );
633
-
634
- it( 'changes the height value between units', async () => {
635
- const screen = await initializeEditor( {
636
- initialHtml: COVER_BLOCK_CUSTOM_HEIGHT_HTML,
637
- } );
638
- const { getByText } = screen;
639
-
640
- // Get block
641
- const coverBlock = await getBlock( screen, 'Cover' );
642
- fireEvent.press( coverBlock );
643
-
644
- // Open block settings
645
- await openBlockSettings( screen );
646
-
647
- // Set the pixel unit
648
- fireEvent.press( getByText( 'vw', { hidden: true } ) );
649
- fireEvent.press( getByText( 'Pixels (px)', { hidden: true } ) );
650
-
651
- expect( getEditorHtml() ).toMatchSnapshot();
652
- } );
653
-
654
- describe( 'disables the decrease button when reaching the minimum value', () => {
655
- const testData = [
656
- [ 'Pixels (px)', '50', '50' ],
657
- [ 'Relative to parent font size (em)', '20', '1' ],
658
- [ 'Relative to root font size (rem)', '20', '1' ],
659
- [ 'Viewport width (vw)', '20', '1' ],
660
- [ 'Viewport height (vh)', '20', '1' ],
661
- ];
662
-
663
- test.each( testData )(
664
- 'for %s',
665
- async ( unitName, value, minValue ) => {
666
- const screen = await initializeEditor( {
667
- initialHtml: COVER_BLOCK_CUSTOM_HEIGHT_HTML,
668
- } );
669
- const { getByLabelText, getByText } = screen;
670
-
671
- // Get block
672
- const coverBlock = await getBlock( screen, 'Cover' );
673
- fireEvent.press( coverBlock );
674
-
675
- // Open block settings
676
- await openBlockSettings( screen );
677
-
678
- // Set the unit name
679
- fireEvent.press( getByText( 'vw', { hidden: true } ) );
680
- fireEvent.press( getByText( unitName, { hidden: true } ) );
681
-
682
- // Update height attribute
683
- const heightControl = getByLabelText( /Minimum height/ );
684
- fireEvent.press(
685
- within( heightControl ).getByText( value, { hidden: true } )
686
- );
687
- const heightTextInput = within(
688
- heightControl
689
- ).getByDisplayValue( value, { hidden: true } );
690
- fireEvent.changeText( heightTextInput, minValue );
691
-
692
- // The decreasing button should be disabled
693
- fireEvent( heightControl, 'accessibilityAction', {
694
- nativeEvent: { actionName: 'decrement' },
695
- } );
696
-
697
- expect( getEditorHtml() ).toMatchSnapshot();
698
- }
699
- );
700
- } );
701
- } );