@wordpress/components 23.1.0 → 23.3.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 (623) hide show
  1. package/CHANGELOG.md +53 -0
  2. package/CONTRIBUTING.md +1 -1
  3. package/LICENSE.md +1 -1
  4. package/build/alignment-matrix-control/utils.js +2 -2
  5. package/build/alignment-matrix-control/utils.js.map +1 -1
  6. package/build/autocomplete/autocompleter-ui.js +1 -3
  7. package/build/autocomplete/autocompleter-ui.js.map +1 -1
  8. package/build/border-box-control/border-box-control-linked-button/component.js.map +1 -1
  9. package/build/border-box-control/border-box-control-linked-button/hook.js.map +1 -1
  10. package/build/border-control/border-control-dropdown/component.js +8 -4
  11. package/build/border-control/border-control-dropdown/component.js.map +1 -1
  12. package/build/button/deprecated.js +8 -6
  13. package/build/button/deprecated.js.map +1 -1
  14. package/build/button/index.js +52 -23
  15. package/build/button/index.js.map +1 -1
  16. package/build/button/types.js +6 -0
  17. package/build/button/types.js.map +1 -0
  18. package/build/color-list-picker/index.js.map +1 -1
  19. package/build/color-list-picker/types.js +6 -0
  20. package/build/color-list-picker/types.js.map +1 -0
  21. package/build/color-palette/index.js +9 -61
  22. package/build/color-palette/index.js.map +1 -1
  23. package/build/color-palette/index.native.js +24 -9
  24. package/build/color-palette/index.native.js.map +1 -1
  25. package/build/color-palette/utils.js +103 -0
  26. package/build/color-palette/utils.js.map +1 -0
  27. package/build/color-picker/component.js +1 -0
  28. package/build/color-picker/component.js.map +1 -1
  29. package/build/color-picker/styles.js +8 -10
  30. package/build/color-picker/styles.js.map +1 -1
  31. package/build/combobox-control/index.js +5 -1
  32. package/build/combobox-control/index.js.map +1 -1
  33. package/build/custom-gradient-picker/gradient-bar/utils.js +1 -1
  34. package/build/custom-gradient-picker/gradient-bar/utils.js.map +1 -1
  35. package/build/date-time/date/index.js.map +1 -1
  36. package/build/dropdown/index.js +20 -8
  37. package/build/dropdown/index.js.map +1 -1
  38. package/build/focal-point-picker/utils.js +1 -1
  39. package/build/focal-point-picker/utils.js.map +1 -1
  40. package/build/form-token-field/token.js +1 -1
  41. package/build/form-token-field/token.js.map +1 -1
  42. package/build/gradient-picker/index.js +9 -1
  43. package/build/gradient-picker/index.js.map +1 -1
  44. package/build/h-stack/component.js +0 -1
  45. package/build/h-stack/component.js.map +1 -1
  46. package/build/index.js +7 -17
  47. package/build/index.js.map +1 -1
  48. package/build/index.native.js +8 -18
  49. package/build/index.native.js.map +1 -1
  50. package/build/input-control/input-field.js +4 -2
  51. package/build/input-control/input-field.js.map +1 -1
  52. package/build/item-group/item/component.js +27 -3
  53. package/build/item-group/item/component.js.map +1 -1
  54. package/build/item-group/item-group/component.js +26 -3
  55. package/build/item-group/item-group/component.js.map +1 -1
  56. package/build/item-group/styles.js +14 -14
  57. package/build/item-group/styles.js.map +1 -1
  58. package/build/keyboard-shortcuts/index.js +44 -16
  59. package/build/keyboard-shortcuts/index.js.map +1 -1
  60. package/build/keyboard-shortcuts/types.js +6 -0
  61. package/build/keyboard-shortcuts/types.js.map +1 -0
  62. package/build/modal/index.js +1 -1
  63. package/build/modal/index.js.map +1 -1
  64. package/build/notice/index.js +16 -18
  65. package/build/notice/index.js.map +1 -1
  66. package/build/notice/list.js +23 -8
  67. package/build/notice/list.js.map +1 -1
  68. package/build/notice/types.js +6 -0
  69. package/build/notice/types.js.map +1 -0
  70. package/build/number-control/index.js +1 -1
  71. package/build/number-control/index.js.map +1 -1
  72. package/build/panel/row.js +5 -3
  73. package/build/panel/row.js.map +1 -1
  74. package/build/query-controls/author-select.js +7 -3
  75. package/build/query-controls/author-select.js.map +1 -1
  76. package/build/query-controls/category-select.js +7 -3
  77. package/build/query-controls/category-select.js.map +1 -1
  78. package/build/query-controls/index.js +69 -20
  79. package/build/query-controls/index.js.map +1 -1
  80. package/build/query-controls/terms.js +4 -3
  81. package/build/query-controls/terms.js.map +1 -1
  82. package/build/query-controls/types.js +6 -0
  83. package/build/query-controls/types.js.map +1 -0
  84. package/build/resizable-box/index.js +5 -4
  85. package/build/resizable-box/index.js.map +1 -1
  86. package/build/responsive-wrapper/index.js +18 -1
  87. package/build/responsive-wrapper/index.js.map +1 -1
  88. package/build/responsive-wrapper/types.js +6 -0
  89. package/build/responsive-wrapper/types.js.map +1 -0
  90. package/build/sandbox/index.js +35 -24
  91. package/build/sandbox/index.js.map +1 -1
  92. package/build/sandbox/types.js +6 -0
  93. package/build/sandbox/types.js.map +1 -0
  94. package/build/slot-fill/bubbles-virtually/fill.js +1 -0
  95. package/build/slot-fill/bubbles-virtually/fill.js.map +1 -1
  96. package/build/slot-fill/slot.js +1 -0
  97. package/build/slot-fill/slot.js.map +1 -1
  98. package/build/slot-fill/use-slot.js +1 -11
  99. package/build/slot-fill/use-slot.js.map +1 -1
  100. package/build/snackbar/index.js.map +1 -1
  101. package/build/snackbar/list.js.map +1 -1
  102. package/build/tab-panel/index.js +40 -7
  103. package/build/tab-panel/index.js.map +1 -1
  104. package/build/toolbar/index.js +42 -60
  105. package/build/toolbar/index.js.map +1 -1
  106. package/build/toolbar/toolbar/index.js +74 -0
  107. package/build/toolbar/toolbar/index.js.map +1 -0
  108. package/build/toolbar/{toolbar-container.js → toolbar/toolbar-container.js} +0 -0
  109. package/build/toolbar/toolbar/toolbar-container.js.map +1 -0
  110. package/build/toolbar/{toolbar-container.native.js → toolbar/toolbar-container.native.js} +0 -0
  111. package/build/toolbar/toolbar/toolbar-container.native.js.map +1 -0
  112. package/build/{toolbar-button → toolbar/toolbar-button}/index.js +1 -1
  113. package/build/toolbar/toolbar-button/index.js.map +1 -0
  114. package/build/{toolbar-button → toolbar/toolbar-button}/toolbar-button-container.js +0 -0
  115. package/build/toolbar/toolbar-button/toolbar-button-container.js.map +1 -0
  116. package/build/{toolbar-button → toolbar/toolbar-button}/toolbar-button-container.native.js +0 -0
  117. package/build/toolbar/toolbar-button/toolbar-button-container.native.js.map +1 -0
  118. package/build/{toolbar-context → toolbar/toolbar-context}/index.js +0 -0
  119. package/build/toolbar/toolbar-context/index.js.map +1 -0
  120. package/build/{toolbar-dropdown-menu → toolbar/toolbar-dropdown-menu}/index.js +1 -1
  121. package/build/toolbar/toolbar-dropdown-menu/index.js.map +1 -0
  122. package/build/{toolbar-group → toolbar/toolbar-group}/index.js +0 -0
  123. package/build/toolbar/toolbar-group/index.js.map +1 -0
  124. package/build/{toolbar-group → toolbar/toolbar-group}/toolbar-group-collapsed.js +1 -1
  125. package/build/toolbar/toolbar-group/toolbar-group-collapsed.js.map +1 -0
  126. package/build/{toolbar-group → toolbar/toolbar-group}/toolbar-group-collapsed.native.js +1 -1
  127. package/build/toolbar/toolbar-group/toolbar-group-collapsed.native.js.map +1 -0
  128. package/build/{toolbar-group → toolbar/toolbar-group}/toolbar-group-container.js +0 -0
  129. package/build/toolbar/toolbar-group/toolbar-group-container.js.map +1 -0
  130. package/build/{toolbar-group → toolbar/toolbar-group}/toolbar-group-container.native.js +0 -0
  131. package/build/toolbar/toolbar-group/toolbar-group-container.native.js.map +1 -0
  132. package/build/{toolbar-item → toolbar/toolbar-item}/index.js +0 -0
  133. package/build/toolbar/toolbar-item/index.js.map +1 -0
  134. package/build/{toolbar-item → toolbar/toolbar-item}/index.native.js +0 -0
  135. package/build/toolbar/toolbar-item/index.native.js.map +1 -0
  136. package/build/tree-grid/index.js +4 -4
  137. package/build/tree-grid/index.js.map +1 -1
  138. package/build/tree-select/index.js +2 -6
  139. package/build/tree-select/index.js.map +1 -1
  140. package/build-module/alignment-matrix-control/utils.js +2 -2
  141. package/build-module/alignment-matrix-control/utils.js.map +1 -1
  142. package/build-module/autocomplete/autocompleter-ui.js +1 -2
  143. package/build-module/autocomplete/autocompleter-ui.js.map +1 -1
  144. package/build-module/border-box-control/border-box-control-linked-button/component.js.map +1 -1
  145. package/build-module/border-box-control/border-box-control-linked-button/hook.js.map +1 -1
  146. package/build-module/border-control/border-control-dropdown/component.js +7 -4
  147. package/build-module/border-control/border-control-dropdown/component.js.map +1 -1
  148. package/build-module/button/deprecated.js +8 -5
  149. package/build-module/button/deprecated.js.map +1 -1
  150. package/build-module/button/index.js +51 -22
  151. package/build-module/button/index.js.map +1 -1
  152. package/build-module/button/types.js +2 -0
  153. package/build-module/button/types.js.map +1 -0
  154. package/build-module/color-list-picker/index.js.map +1 -1
  155. package/build-module/color-list-picker/types.js +2 -0
  156. package/build-module/color-list-picker/types.js.map +1 -0
  157. package/build-module/color-palette/index.js +7 -54
  158. package/build-module/color-palette/index.js.map +1 -1
  159. package/build-module/color-palette/index.native.js +24 -8
  160. package/build-module/color-palette/index.native.js.map +1 -1
  161. package/build-module/color-palette/utils.js +79 -0
  162. package/build-module/color-palette/utils.js.map +1 -0
  163. package/build-module/color-picker/component.js +1 -0
  164. package/build-module/color-picker/component.js.map +1 -1
  165. package/build-module/color-picker/styles.js +8 -9
  166. package/build-module/color-picker/styles.js.map +1 -1
  167. package/build-module/combobox-control/index.js +5 -1
  168. package/build-module/combobox-control/index.js.map +1 -1
  169. package/build-module/custom-gradient-picker/gradient-bar/utils.js +1 -1
  170. package/build-module/custom-gradient-picker/gradient-bar/utils.js.map +1 -1
  171. package/build-module/date-time/date/index.js +1 -1
  172. package/build-module/date-time/date/index.js.map +1 -1
  173. package/build-module/dropdown/index.js +19 -8
  174. package/build-module/dropdown/index.js.map +1 -1
  175. package/build-module/focal-point-picker/utils.js +1 -1
  176. package/build-module/focal-point-picker/utils.js.map +1 -1
  177. package/build-module/form-token-field/token.js +1 -1
  178. package/build-module/form-token-field/token.js.map +1 -1
  179. package/build-module/gradient-picker/index.js +9 -2
  180. package/build-module/gradient-picker/index.js.map +1 -1
  181. package/build-module/h-stack/component.js +0 -1
  182. package/build-module/h-stack/component.js.map +1 -1
  183. package/build-module/index.js +1 -6
  184. package/build-module/index.js.map +1 -1
  185. package/build-module/index.native.js +1 -6
  186. package/build-module/index.native.js.map +1 -1
  187. package/build-module/input-control/input-field.js +4 -2
  188. package/build-module/input-control/input-field.js.map +1 -1
  189. package/build-module/item-group/item/component.js +26 -2
  190. package/build-module/item-group/item/component.js.map +1 -1
  191. package/build-module/item-group/item-group/component.js +25 -2
  192. package/build-module/item-group/item-group/component.js.map +1 -1
  193. package/build-module/item-group/styles.js +14 -14
  194. package/build-module/item-group/styles.js.map +1 -1
  195. package/build-module/keyboard-shortcuts/index.js +48 -16
  196. package/build-module/keyboard-shortcuts/index.js.map +1 -1
  197. package/build-module/keyboard-shortcuts/types.js +2 -0
  198. package/build-module/keyboard-shortcuts/types.js.map +1 -0
  199. package/build-module/modal/index.js +1 -1
  200. package/build-module/modal/index.js.map +1 -1
  201. package/build-module/notice/index.js +14 -15
  202. package/build-module/notice/index.js.map +1 -1
  203. package/build-module/notice/list.js +23 -8
  204. package/build-module/notice/list.js.map +1 -1
  205. package/build-module/notice/types.js +2 -0
  206. package/build-module/notice/types.js.map +1 -0
  207. package/build-module/number-control/index.js +1 -1
  208. package/build-module/number-control/index.js.map +1 -1
  209. package/build-module/panel/row.js +5 -3
  210. package/build-module/panel/row.js.map +1 -1
  211. package/build-module/query-controls/author-select.js +7 -3
  212. package/build-module/query-controls/author-select.js.map +1 -1
  213. package/build-module/query-controls/category-select.js +8 -4
  214. package/build-module/query-controls/category-select.js.map +1 -1
  215. package/build-module/query-controls/index.js +65 -20
  216. package/build-module/query-controls/index.js.map +1 -1
  217. package/build-module/query-controls/terms.js +8 -4
  218. package/build-module/query-controls/terms.js.map +1 -1
  219. package/build-module/query-controls/types.js +2 -0
  220. package/build-module/query-controls/types.js.map +1 -0
  221. package/build-module/resizable-box/index.js +3 -2
  222. package/build-module/resizable-box/index.js.map +1 -1
  223. package/build-module/responsive-wrapper/index.js +20 -1
  224. package/build-module/responsive-wrapper/index.js.map +1 -1
  225. package/build-module/responsive-wrapper/types.js +2 -0
  226. package/build-module/responsive-wrapper/types.js.map +1 -0
  227. package/build-module/sandbox/index.js +37 -23
  228. package/build-module/sandbox/index.js.map +1 -1
  229. package/build-module/sandbox/types.js +2 -0
  230. package/build-module/sandbox/types.js.map +1 -0
  231. package/build-module/slot-fill/bubbles-virtually/fill.js +1 -0
  232. package/build-module/slot-fill/bubbles-virtually/fill.js.map +1 -1
  233. package/build-module/slot-fill/slot.js +1 -0
  234. package/build-module/slot-fill/slot.js.map +1 -1
  235. package/build-module/slot-fill/use-slot.js +2 -12
  236. package/build-module/slot-fill/use-slot.js.map +1 -1
  237. package/build-module/snackbar/index.js.map +1 -1
  238. package/build-module/snackbar/list.js.map +1 -1
  239. package/build-module/tab-panel/index.js +40 -7
  240. package/build-module/tab-panel/index.js.map +1 -1
  241. package/build-module/toolbar/index.js +6 -58
  242. package/build-module/toolbar/index.js.map +1 -1
  243. package/build-module/toolbar/toolbar/index.js +59 -0
  244. package/build-module/toolbar/toolbar/index.js.map +1 -0
  245. package/build-module/toolbar/{toolbar-container.js → toolbar/toolbar-container.js} +0 -0
  246. package/{build → build-module/toolbar}/toolbar/toolbar-container.js.map +1 -1
  247. package/build-module/toolbar/{toolbar-container.native.js → toolbar/toolbar-container.native.js} +0 -0
  248. package/build-module/toolbar/toolbar/toolbar-container.native.js.map +1 -0
  249. package/build-module/{toolbar-button → toolbar/toolbar-button}/index.js +1 -1
  250. package/build-module/toolbar/toolbar-button/index.js.map +1 -0
  251. package/build-module/{toolbar-button → toolbar/toolbar-button}/toolbar-button-container.js +0 -0
  252. package/build-module/toolbar/toolbar-button/toolbar-button-container.js.map +1 -0
  253. package/build-module/{toolbar-button → toolbar/toolbar-button}/toolbar-button-container.native.js +0 -0
  254. package/build-module/toolbar/toolbar-button/toolbar-button-container.native.js.map +1 -0
  255. package/build-module/{toolbar-context → toolbar/toolbar-context}/index.js +0 -0
  256. package/build-module/toolbar/toolbar-context/index.js.map +1 -0
  257. package/build-module/{toolbar-dropdown-menu → toolbar/toolbar-dropdown-menu}/index.js +1 -1
  258. package/build-module/toolbar/toolbar-dropdown-menu/index.js.map +1 -0
  259. package/build-module/{toolbar-group → toolbar/toolbar-group}/index.js +0 -0
  260. package/build-module/toolbar/toolbar-group/index.js.map +1 -0
  261. package/build-module/{toolbar-group → toolbar/toolbar-group}/toolbar-group-collapsed.js +1 -1
  262. package/build-module/toolbar/toolbar-group/toolbar-group-collapsed.js.map +1 -0
  263. package/build-module/{toolbar-group → toolbar/toolbar-group}/toolbar-group-collapsed.native.js +1 -1
  264. package/build-module/toolbar/toolbar-group/toolbar-group-collapsed.native.js.map +1 -0
  265. package/build-module/{toolbar-group → toolbar/toolbar-group}/toolbar-group-container.js +0 -0
  266. package/build-module/toolbar/toolbar-group/toolbar-group-container.js.map +1 -0
  267. package/build-module/{toolbar-group → toolbar/toolbar-group}/toolbar-group-container.native.js +0 -0
  268. package/build-module/toolbar/toolbar-group/toolbar-group-container.native.js.map +1 -0
  269. package/build-module/{toolbar-item → toolbar/toolbar-item}/index.js +0 -0
  270. package/build-module/toolbar/toolbar-item/index.js.map +1 -0
  271. package/build-module/{toolbar-item → toolbar/toolbar-item}/index.native.js +0 -0
  272. package/build-module/toolbar/toolbar-item/index.native.js.map +1 -0
  273. package/build-module/tree-grid/index.js +4 -4
  274. package/build-module/tree-grid/index.js.map +1 -1
  275. package/build-module/tree-select/index.js +2 -6
  276. package/build-module/tree-select/index.js.map +1 -1
  277. package/build-style/style-rtl.css +6 -1
  278. package/build-style/style.css +6 -1
  279. package/build-types/border-box-control/border-box-control/hook.d.ts +1 -1
  280. package/build-types/border-box-control/border-box-control-linked-button/component.d.ts +1 -1
  281. package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts +171 -160
  282. package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts.map +1 -1
  283. package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts +1 -1
  284. package/build-types/border-control/border-control/hook.d.ts +1 -1
  285. package/build-types/border-control/border-control-dropdown/component.d.ts.map +1 -1
  286. package/build-types/border-control/border-control-dropdown/hook.d.ts +1 -1
  287. package/build-types/button/deprecated.d.ts +143 -7
  288. package/build-types/button/deprecated.d.ts.map +1 -1
  289. package/build-types/button/index.d.ts +20 -3
  290. package/build-types/button/index.d.ts.map +1 -1
  291. package/build-types/button/stories/index.d.ts +20 -0
  292. package/build-types/button/stories/index.d.ts.map +1 -0
  293. package/build-types/button/test/index.d.ts +2 -0
  294. package/build-types/button/test/index.d.ts.map +1 -0
  295. package/build-types/button/types.d.ts +134 -0
  296. package/build-types/button/types.d.ts.map +1 -0
  297. package/build-types/color-list-picker/index.d.ts +5 -0
  298. package/build-types/color-list-picker/index.d.ts.map +1 -0
  299. package/build-types/color-list-picker/types.d.ts +42 -0
  300. package/build-types/color-list-picker/types.d.ts.map +1 -0
  301. package/build-types/color-palette/index.d.ts +2 -4
  302. package/build-types/color-palette/index.d.ts.map +1 -1
  303. package/build-types/color-palette/stories/index.d.ts +2 -2
  304. package/build-types/color-palette/styles.d.ts +1 -1
  305. package/build-types/color-palette/types.d.ts +1 -1
  306. package/build-types/color-palette/types.d.ts.map +1 -1
  307. package/build-types/color-palette/utils.d.ts +14 -0
  308. package/build-types/color-palette/utils.d.ts.map +1 -0
  309. package/build-types/color-picker/component.d.ts.map +1 -1
  310. package/build-types/color-picker/styles.d.ts +2 -2
  311. package/build-types/color-picker/styles.d.ts.map +1 -1
  312. package/build-types/dashicon/types.d.ts +0 -4
  313. package/build-types/dashicon/types.d.ts.map +1 -1
  314. package/build-types/date-time/date/index.d.ts.map +1 -1
  315. package/build-types/date-time/date/styles.d.ts +3 -3
  316. package/build-types/dropdown/index.d.ts +4 -4
  317. package/build-types/dropdown/index.d.ts.map +1 -1
  318. package/build-types/dropdown/stories/index.d.ts.map +1 -1
  319. package/build-types/dropdown/types.d.ts +9 -10
  320. package/build-types/dropdown/types.d.ts.map +1 -1
  321. package/build-types/focal-point-picker/utils.d.ts.map +1 -1
  322. package/build-types/font-size-picker/styles.d.ts +2 -2
  323. package/build-types/h-stack/component.d.ts +0 -1
  324. package/build-types/h-stack/component.d.ts.map +1 -1
  325. package/build-types/input-control/input-field.d.ts.map +1 -1
  326. package/build-types/item-group/item/component.d.ts +24 -2
  327. package/build-types/item-group/item/component.d.ts.map +1 -1
  328. package/build-types/item-group/item-group/component.d.ts +23 -2
  329. package/build-types/item-group/item-group/component.d.ts.map +1 -1
  330. package/build-types/item-group/stories/index.d.ts +15 -0
  331. package/build-types/item-group/stories/index.d.ts.map +1 -0
  332. package/build-types/item-group/styles.d.ts.map +1 -1
  333. package/build-types/keyboard-shortcuts/index.d.ts +38 -0
  334. package/build-types/keyboard-shortcuts/index.d.ts.map +1 -0
  335. package/build-types/keyboard-shortcuts/stories/index.d.ts +12 -0
  336. package/build-types/keyboard-shortcuts/stories/index.d.ts.map +1 -0
  337. package/build-types/keyboard-shortcuts/test/index.d.ts +2 -0
  338. package/build-types/keyboard-shortcuts/test/index.d.ts.map +1 -0
  339. package/build-types/keyboard-shortcuts/types.d.ts +48 -0
  340. package/build-types/keyboard-shortcuts/types.d.ts.map +1 -0
  341. package/build-types/modal/index.d.ts.map +1 -1
  342. package/build-types/navigator/navigator-back-button/component.d.ts +1 -1
  343. package/build-types/navigator/navigator-back-button/hook.d.ts +2 -2
  344. package/build-types/navigator/navigator-button/component.d.ts +1 -1
  345. package/build-types/navigator/navigator-button/hook.d.ts +2 -2
  346. package/build-types/notice/index.d.ts +16 -0
  347. package/build-types/notice/index.d.ts.map +1 -0
  348. package/build-types/notice/list.d.ts +32 -0
  349. package/build-types/notice/list.d.ts.map +1 -0
  350. package/build-types/notice/stories/index.d.ts +17 -0
  351. package/build-types/notice/stories/index.d.ts.map +1 -0
  352. package/build-types/notice/test/index.d.ts +2 -0
  353. package/build-types/notice/test/index.d.ts.map +1 -0
  354. package/build-types/notice/test/list.d.ts +2 -0
  355. package/build-types/notice/test/list.d.ts.map +1 -0
  356. package/build-types/notice/types.d.ts +128 -0
  357. package/build-types/notice/types.d.ts.map +1 -0
  358. package/build-types/number-control/styles/number-control-styles.d.ts +2 -2
  359. package/build-types/number-control/styles/number-control-styles.d.ts.map +1 -1
  360. package/build-types/placeholder/stories/index.d.ts.map +1 -1
  361. package/build-types/query-controls/author-select.d.ts +4 -0
  362. package/build-types/query-controls/author-select.d.ts.map +1 -0
  363. package/build-types/query-controls/category-select.d.ts +4 -0
  364. package/build-types/query-controls/category-select.d.ts.map +1 -0
  365. package/build-types/query-controls/index.d.ts +30 -0
  366. package/build-types/query-controls/index.d.ts.map +1 -0
  367. package/build-types/query-controls/stories/index.d.ts +13 -0
  368. package/build-types/query-controls/stories/index.d.ts.map +1 -0
  369. package/build-types/query-controls/terms.d.ts +13 -0
  370. package/build-types/query-controls/terms.d.ts.map +1 -0
  371. package/build-types/query-controls/test/terms.d.ts +2 -0
  372. package/build-types/query-controls/test/terms.d.ts.map +1 -0
  373. package/build-types/query-controls/types.d.ts +131 -0
  374. package/build-types/query-controls/types.d.ts.map +1 -0
  375. package/build-types/range-control/index.d.ts +1 -1
  376. package/build-types/resizable-box/index.d.ts +6 -7
  377. package/build-types/resizable-box/index.d.ts.map +1 -1
  378. package/build-types/resizable-box/stories/index.d.ts +61 -0
  379. package/build-types/resizable-box/stories/index.d.ts.map +1 -0
  380. package/build-types/responsive-wrapper/index.d.ts +24 -0
  381. package/build-types/responsive-wrapper/index.d.ts.map +1 -0
  382. package/build-types/responsive-wrapper/stories/index.d.ts +12 -0
  383. package/build-types/responsive-wrapper/stories/index.d.ts.map +1 -0
  384. package/build-types/responsive-wrapper/types.d.ts +22 -0
  385. package/build-types/responsive-wrapper/types.d.ts.map +1 -0
  386. package/build-types/sandbox/index.d.ts +19 -0
  387. package/build-types/sandbox/index.d.ts.map +1 -0
  388. package/build-types/sandbox/stories/index.d.ts +12 -0
  389. package/build-types/sandbox/stories/index.d.ts.map +1 -0
  390. package/build-types/sandbox/test/index.d.ts +2 -0
  391. package/build-types/sandbox/test/index.d.ts.map +1 -0
  392. package/build-types/sandbox/types.d.ts +36 -0
  393. package/build-types/sandbox/types.d.ts.map +1 -0
  394. package/build-types/slot-fill/bubbles-virtually/fill.d.ts.map +1 -1
  395. package/build-types/slot-fill/use-slot.d.ts.map +1 -1
  396. package/build-types/snackbar/index.d.ts +9 -2
  397. package/build-types/snackbar/index.d.ts.map +1 -1
  398. package/build-types/snackbar/list.d.ts.map +1 -1
  399. package/build-types/snackbar/types.d.ts +15 -88
  400. package/build-types/snackbar/types.d.ts.map +1 -1
  401. package/build-types/tab-panel/index.d.ts.map +1 -1
  402. package/build-types/tab-panel/stories/index.d.ts +1 -0
  403. package/build-types/tab-panel/stories/index.d.ts.map +1 -1
  404. package/build-types/tab-panel/types.d.ts +11 -5
  405. package/build-types/tab-panel/types.d.ts.map +1 -1
  406. package/build-types/toggle-group-control/stories/index.d.ts.map +1 -1
  407. package/build-types/tree-select/index.d.ts.map +1 -1
  408. package/build-types/ui/form-group/form-group.d.ts +2 -2
  409. package/package.json +18 -17
  410. package/src/alignment-matrix-control/utils.tsx +2 -2
  411. package/src/autocomplete/autocompleter-ui.js +1 -2
  412. package/src/autocomplete/test/index.js +1 -5
  413. package/src/border-box-control/border-box-control-linked-button/component.tsx +1 -1
  414. package/src/border-box-control/border-box-control-linked-button/hook.ts +1 -1
  415. package/src/border-control/border-control-dropdown/component.tsx +9 -8
  416. package/src/box-control/test/index.js +11 -35
  417. package/src/button/README.md +49 -55
  418. package/src/button/{deprecated.js → deprecated.tsx} +19 -4
  419. package/src/button/{index.js → index.tsx} +95 -34
  420. package/src/button/stories/index.tsx +106 -0
  421. package/src/button/style.scss +3 -2
  422. package/src/button/test/{index.js → index.tsx} +30 -7
  423. package/src/button/types.ts +138 -0
  424. package/src/checkbox-control/test/index.tsx +1 -5
  425. package/src/color-list-picker/{index.js → index.tsx} +3 -2
  426. package/src/color-list-picker/types.ts +46 -0
  427. package/src/color-palette/README.md +1 -1
  428. package/src/color-palette/index.native.js +11 -4
  429. package/src/color-palette/index.tsx +11 -67
  430. package/src/color-palette/test/index.tsx +4 -14
  431. package/src/color-palette/test/utils.ts +1 -1
  432. package/src/color-palette/types.ts +1 -1
  433. package/src/color-palette/utils.ts +98 -0
  434. package/src/color-picker/component.tsx +1 -0
  435. package/src/color-picker/stories/index.js +20 -60
  436. package/src/color-picker/styles.ts +0 -5
  437. package/src/color-picker/test/index.js +6 -15
  438. package/src/combobox-control/index.js +9 -1
  439. package/src/combobox-control/test/index.js +1 -6
  440. package/src/confirm-dialog/test/index.js +9 -29
  441. package/src/custom-gradient-picker/gradient-bar/utils.js +1 -1
  442. package/src/dashicon/types.ts +0 -6
  443. package/src/date-time/date/index.tsx +2 -1
  444. package/src/date-time/date/test/index.tsx +2 -8
  445. package/src/date-time/time/test/index.tsx +9 -29
  446. package/src/dimension-control/test/index.test.js +2 -8
  447. package/src/disabled/test/index.tsx +1 -5
  448. package/src/draggable/test/index.native.js +4 -4
  449. package/src/dropdown/README.md +1 -8
  450. package/src/dropdown/index.tsx +17 -6
  451. package/src/dropdown/stories/index.tsx +3 -3
  452. package/src/dropdown/test/index.tsx +2 -8
  453. package/src/dropdown/types.ts +9 -10
  454. package/src/dropdown-menu/README.md +1 -1
  455. package/src/dropdown-menu/stories/index.js +96 -27
  456. package/src/dropdown-menu/test/index.js +2 -8
  457. package/src/external-link/test/index.tsx +1 -6
  458. package/src/focal-point-picker/stories/index.tsx +1 -1
  459. package/src/focal-point-picker/test/index.js +3 -11
  460. package/src/focal-point-picker/utils.ts +4 -1
  461. package/src/font-size-picker/test/index.tsx +14 -44
  462. package/src/form-file-upload/test/index.tsx +2 -17
  463. package/src/form-toggle/test/index.tsx +1 -5
  464. package/src/form-token-field/test/index.tsx +80 -163
  465. package/src/form-token-field/token.tsx +1 -1
  466. package/src/gradient-picker/index.js +15 -4
  467. package/src/guide/stories/index.js +14 -41
  468. package/src/guide/test/index.js +5 -17
  469. package/src/h-stack/component.tsx +0 -1
  470. package/src/higher-order/with-filters/test/index.js +24 -24
  471. package/src/higher-order/with-focus-outside/test/index.js +11 -25
  472. package/src/higher-order/with-focus-return/test/index.js +1 -5
  473. package/src/index.js +8 -6
  474. package/src/index.native.js +8 -6
  475. package/src/input-control/input-field.tsx +3 -1
  476. package/src/input-control/test/index.js +1 -6
  477. package/src/isolated-event-container/test/index.js +2 -8
  478. package/src/item-group/item/component.tsx +26 -2
  479. package/src/item-group/item-group/component.tsx +25 -2
  480. package/src/item-group/stories/index.tsx +103 -0
  481. package/src/item-group/styles.ts +1 -0
  482. package/src/item-group/test/__snapshots__/index.js.snap +11 -10
  483. package/src/keyboard-shortcuts/README.md +1 -1
  484. package/src/keyboard-shortcuts/index.tsx +93 -0
  485. package/src/keyboard-shortcuts/stories/index.tsx +60 -0
  486. package/src/keyboard-shortcuts/test/{index.js → index.tsx} +16 -6
  487. package/src/keyboard-shortcuts/types.ts +51 -0
  488. package/src/modal/index.tsx +1 -2
  489. package/src/navigable-container/test/navigable-menu.js +5 -17
  490. package/src/navigable-container/test/tababble-container.js +3 -11
  491. package/src/navigation/test/index.js +3 -11
  492. package/src/navigator/test/index.tsx +6 -20
  493. package/src/notice/README.md +89 -42
  494. package/src/notice/{index.js → index.tsx} +28 -20
  495. package/src/notice/list.tsx +72 -0
  496. package/src/notice/stories/index.tsx +119 -0
  497. package/src/notice/test/__snapshots__/{index.js.snap → index.tsx.snap} +0 -0
  498. package/src/notice/test/{index.js → index.tsx} +7 -4
  499. package/src/notice/test/{list.js → list.tsx} +0 -0
  500. package/src/notice/types.ts +136 -0
  501. package/src/number-control/index.tsx +1 -1
  502. package/src/number-control/test/index.tsx +28 -86
  503. package/src/panel/row.js +3 -3
  504. package/src/panel/stories/index.js +62 -80
  505. package/src/panel/test/body.js +2 -8
  506. package/src/placeholder/stories/index.tsx +1 -0
  507. package/src/placeholder/style.scss +1 -1
  508. package/src/query-controls/README.md +56 -56
  509. package/src/query-controls/author-select.tsx +37 -0
  510. package/src/query-controls/category-select.tsx +46 -0
  511. package/src/query-controls/index.tsx +192 -0
  512. package/src/query-controls/stories/index.tsx +205 -0
  513. package/src/query-controls/terms.ts +57 -0
  514. package/src/query-controls/test/{terms.js → terms.ts} +36 -20
  515. package/src/query-controls/types.ts +150 -0
  516. package/src/resizable-box/README.md +2 -2
  517. package/src/resizable-box/index.tsx +7 -6
  518. package/src/resizable-box/stories/index.tsx +92 -0
  519. package/src/responsive-wrapper/README.md +29 -0
  520. package/src/responsive-wrapper/{index.js → index.tsx} +23 -2
  521. package/src/responsive-wrapper/stories/index.tsx +38 -0
  522. package/src/responsive-wrapper/types.ts +20 -0
  523. package/src/sandbox/README.md +45 -2
  524. package/src/sandbox/{index.js → index.tsx} +47 -24
  525. package/src/sandbox/stories/index.tsx +32 -0
  526. package/src/sandbox/test/{index.js → index.tsx} +9 -4
  527. package/src/sandbox/types.ts +34 -0
  528. package/src/select-control/test/select-control.tsx +1 -6
  529. package/src/slot-fill/bubbles-virtually/fill.js +1 -0
  530. package/src/slot-fill/slot.js +1 -1
  531. package/src/slot-fill/stories/index.js +12 -17
  532. package/src/slot-fill/use-slot.js +6 -16
  533. package/src/snackbar/index.tsx +6 -5
  534. package/src/snackbar/list.tsx +4 -2
  535. package/src/snackbar/types.ts +18 -92
  536. package/src/style.scss +3 -3
  537. package/src/tab-panel/README.md +1 -0
  538. package/src/tab-panel/index.tsx +42 -6
  539. package/src/tab-panel/stories/index.tsx +20 -0
  540. package/src/tab-panel/style.scss +8 -0
  541. package/src/tab-panel/test/index.tsx +124 -7
  542. package/src/tab-panel/types.ts +11 -5
  543. package/src/theme/test/index.tsx +4 -4
  544. package/src/toggle-group-control/stories/index.tsx +1 -0
  545. package/src/toggle-group-control/test/index.tsx +7 -23
  546. package/src/toolbar/index.js +6 -52
  547. package/src/toolbar/stories/index.js +71 -75
  548. package/src/toolbar/test/index.js +1 -2
  549. package/src/{toolbar-group/test/index.js → toolbar/test/toolbar-group.js} +1 -1
  550. package/src/toolbar/{README.md → toolbar/README.md} +0 -0
  551. package/src/toolbar/toolbar/index.js +52 -0
  552. package/src/toolbar/{style.native.scss → toolbar/style.native.scss} +0 -0
  553. package/src/toolbar/{style.scss → toolbar/style.scss} +0 -0
  554. package/src/toolbar/{toolbar-container.js → toolbar/toolbar-container.js} +0 -0
  555. package/src/toolbar/{toolbar-container.native.js → toolbar/toolbar-container.native.js} +0 -0
  556. package/src/{toolbar-button → toolbar/toolbar-button}/README.md +0 -0
  557. package/src/{toolbar-button → toolbar/toolbar-button}/index.js +1 -1
  558. package/src/{toolbar-button → toolbar/toolbar-button}/style.scss +0 -0
  559. package/src/{toolbar-button → toolbar/toolbar-button}/toolbar-button-container.js +0 -0
  560. package/src/{toolbar-button → toolbar/toolbar-button}/toolbar-button-container.native.js +0 -0
  561. package/src/{toolbar-context → toolbar/toolbar-context}/index.js +0 -0
  562. package/src/{toolbar-dropdown-menu → toolbar/toolbar-dropdown-menu}/README.md +0 -0
  563. package/src/{toolbar-dropdown-menu → toolbar/toolbar-dropdown-menu}/index.js +1 -1
  564. package/src/{toolbar-group → toolbar/toolbar-group}/README.md +0 -0
  565. package/src/{toolbar-group → toolbar/toolbar-group}/index.js +0 -0
  566. package/src/{toolbar-group → toolbar/toolbar-group}/style.native.scss +0 -0
  567. package/src/{toolbar-group → toolbar/toolbar-group}/style.scss +0 -0
  568. package/src/{toolbar-group → toolbar/toolbar-group}/toolbar-group-collapsed.js +1 -1
  569. package/src/{toolbar-group → toolbar/toolbar-group}/toolbar-group-collapsed.native.js +1 -1
  570. package/src/{toolbar-group → toolbar/toolbar-group}/toolbar-group-container.js +0 -0
  571. package/src/{toolbar-group → toolbar/toolbar-group}/toolbar-group-container.native.js +0 -0
  572. package/src/{toolbar-item → toolbar/toolbar-item}/README.md +0 -0
  573. package/src/{toolbar-item → toolbar/toolbar-item}/index.js +0 -0
  574. package/src/{toolbar-item → toolbar/toolbar-item}/index.native.js +0 -0
  575. package/src/tools-panel/stories/index.js +3 -0
  576. package/src/tools-panel/test/index.js +1 -1
  577. package/src/tree-grid/index.js +3 -5
  578. package/src/tree-select/index.tsx +3 -6
  579. package/src/ui/context/test/context-connect.tsx +2 -0
  580. package/src/ui/context/test/wordpress-component.tsx +2 -0
  581. package/src/unit-control/test/index.tsx +21 -74
  582. package/src/utils/hooks/test/use-latest-ref.js +15 -18
  583. package/tsconfig.json +1 -11
  584. package/tsconfig.tsbuildinfo +1 -1
  585. package/build/toolbar/toolbar-container.native.js.map +0 -1
  586. package/build/toolbar-button/index.js.map +0 -1
  587. package/build/toolbar-button/toolbar-button-container.js.map +0 -1
  588. package/build/toolbar-button/toolbar-button-container.native.js.map +0 -1
  589. package/build/toolbar-context/index.js.map +0 -1
  590. package/build/toolbar-dropdown-menu/index.js.map +0 -1
  591. package/build/toolbar-group/index.js.map +0 -1
  592. package/build/toolbar-group/toolbar-group-collapsed.js.map +0 -1
  593. package/build/toolbar-group/toolbar-group-collapsed.native.js.map +0 -1
  594. package/build/toolbar-group/toolbar-group-container.js.map +0 -1
  595. package/build/toolbar-group/toolbar-group-container.native.js.map +0 -1
  596. package/build/toolbar-item/index.js.map +0 -1
  597. package/build/toolbar-item/index.native.js.map +0 -1
  598. package/build-module/toolbar/toolbar-container.js.map +0 -1
  599. package/build-module/toolbar/toolbar-container.native.js.map +0 -1
  600. package/build-module/toolbar-button/index.js.map +0 -1
  601. package/build-module/toolbar-button/toolbar-button-container.js.map +0 -1
  602. package/build-module/toolbar-button/toolbar-button-container.native.js.map +0 -1
  603. package/build-module/toolbar-context/index.js.map +0 -1
  604. package/build-module/toolbar-dropdown-menu/index.js.map +0 -1
  605. package/build-module/toolbar-group/index.js.map +0 -1
  606. package/build-module/toolbar-group/toolbar-group-collapsed.js.map +0 -1
  607. package/build-module/toolbar-group/toolbar-group-collapsed.native.js.map +0 -1
  608. package/build-module/toolbar-group/toolbar-group-container.js.map +0 -1
  609. package/build-module/toolbar-group/toolbar-group-container.native.js.map +0 -1
  610. package/build-module/toolbar-item/index.js.map +0 -1
  611. package/build-module/toolbar-item/index.native.js.map +0 -1
  612. package/src/button/stories/index.js +0 -179
  613. package/src/item-group/stories/index.js +0 -270
  614. package/src/keyboard-shortcuts/index.js +0 -56
  615. package/src/notice/list.js +0 -48
  616. package/src/notice/stories/index.js +0 -74
  617. package/src/query-controls/author-select.js +0 -23
  618. package/src/query-controls/category-select.js +0 -31
  619. package/src/query-controls/index.js +0 -121
  620. package/src/query-controls/terms.js +0 -40
  621. package/src/resizable-box/stories/index.js +0 -97
  622. package/src/toolbar-button/stories/index.js +0 -33
  623. package/src/toolbar-group/stories/index.js +0 -33
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/resizable-box/index.tsx"],"names":["HANDLE_CLASS_NAME","SIDE_HANDLE_CLASS_NAME","CORNER_HANDLE_CLASS_NAME","HANDLE_CLASSES","top","right","bottom","left","topLeft","topRight","bottomRight","bottomLeft","HANDLE_STYLES_OVERRIDES","width","undefined","height","HANDLE_STYLES","ResizableBox","ref","className","children","showHandle","__experimentalShowTooltip","showTooltip","__experimentalTooltipProps","tooltipProps","props"],"mappings":";;;;;;;;;AAGA;;;;AAKA;;AACA;;AAOA;;AAhBA;AACA;AACA;;AAGA;AACA;AACA;;AAMA;AACA;AACA;AAGA,MAAMA,iBAAiB,GAAG,kCAA1B;AACA,MAAMC,sBAAsB,GAAG,uCAA/B;AACA,MAAMC,wBAAwB,GAAG,yCAAjC;AAEA,MAAMC,cAAc,GAAG;AACtBC,EAAAA,GAAG,EAAE,yBACJJ,iBADI,EAEJC,sBAFI,EAGJ,sCAHI,CADiB;AAMtBI,EAAAA,KAAK,EAAE,yBACNL,iBADM,EAENC,sBAFM,EAGN,wCAHM,CANe;AAWtBK,EAAAA,MAAM,EAAE,yBACPN,iBADO,EAEPC,sBAFO,EAGP,yCAHO,CAXc;AAgBtBM,EAAAA,IAAI,EAAE,yBACLP,iBADK,EAELC,sBAFK,EAGL,uCAHK,CAhBgB;AAqBtBO,EAAAA,OAAO,EAAE,yBACRR,iBADQ,EAERE,wBAFQ,EAGR,sCAHQ,EAIR,uCAJQ,CArBa;AA2BtBO,EAAAA,QAAQ,EAAE,yBACTT,iBADS,EAETE,wBAFS,EAGT,sCAHS,EAIT,wCAJS,CA3BY;AAiCtBQ,EAAAA,WAAW,EAAE,yBACZV,iBADY,EAEZE,wBAFY,EAGZ,yCAHY,EAIZ,wCAJY,CAjCS;AAuCtBS,EAAAA,UAAU,EAAE,yBACXX,iBADW,EAEXE,wBAFW,EAGX,yCAHW,EAIX,uCAJW;AAvCU,CAAvB,C,CA+CA;;AACA,MAAMU,uBAAuB,GAAG;AAC/BC,EAAAA,KAAK,EAAEC,SADwB;AAE/BC,EAAAA,MAAM,EAAED,SAFuB;AAG/BV,EAAAA,GAAG,EAAEU,SAH0B;AAI/BT,EAAAA,KAAK,EAAES,SAJwB;AAK/BR,EAAAA,MAAM,EAAEQ,SALuB;AAM/BP,EAAAA,IAAI,EAAEO;AANyB,CAAhC;AAQA,MAAME,aAAa,GAAG;AACrBZ,EAAAA,GAAG,EAAEQ,uBADgB;AAErBP,EAAAA,KAAK,EAAEO,uBAFc;AAGrBN,EAAAA,MAAM,EAAEM,uBAHa;AAIrBL,EAAAA,IAAI,EAAEK,uBAJe;AAKrBJ,EAAAA,OAAO,EAAEI,uBALY;AAMrBH,EAAAA,QAAQ,EAAEG,uBANW;AAOrBF,EAAAA,WAAW,EAAEE,uBAPQ;AAQrBD,EAAAA,UAAU,EAAEC;AARS,CAAtB;;AAmBA,SAASK,YAAT,OASCC,GATD,EAUe;AAAA,MATd;AACCC,IAAAA,SADD;AAECC,IAAAA,QAFD;AAGCC,IAAAA,UAAU,GAAG,IAHd;AAICC,IAAAA,yBAAyB,EAAEC,WAAW,GAAG,KAJ1C;AAKCC,IAAAA,0BAA0B,EAAEC,YAAY,GAAG,EAL5C;AAMC,OAAGC;AANJ,GASc;AACd,SACC,4BAAC,sBAAD;AACC,IAAA,SAAS,EAAG,yBACX,qCADW,EAEXL,UAAU,IAAI,iBAFH,EAGXF,SAHW,CADb;AAMC,IAAA,aAAa,EAAGhB,cANjB;AAOC,IAAA,YAAY,EAAGa,aAPhB;AAQC,IAAA,GAAG,EAAGE;AARP,KASMQ,KATN,GAWGN,QAXH,EAYGG,WAAW,IAAI,4BAAC,sBAAD,EAAoBE,YAApB,CAZlB,CADD;AAgBA;;eAEc,yBAAYR,YAAZ,C","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { Resizable } from 're-resizable';\nimport type { ResizableProps } from 're-resizable';\nimport type { ReactNode, ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport ResizeTooltip from './resize-tooltip';\n\nconst HANDLE_CLASS_NAME = 'components-resizable-box__handle';\nconst SIDE_HANDLE_CLASS_NAME = 'components-resizable-box__side-handle';\nconst CORNER_HANDLE_CLASS_NAME = 'components-resizable-box__corner-handle';\n\nconst HANDLE_CLASSES = {\n\ttop: classnames(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-top'\n\t),\n\tright: classnames(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-right'\n\t),\n\tbottom: classnames(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-bottom'\n\t),\n\tleft: classnames(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-left'\n\t),\n\ttopLeft: classnames(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-top',\n\t\t'components-resizable-box__handle-left'\n\t),\n\ttopRight: classnames(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-top',\n\t\t'components-resizable-box__handle-right'\n\t),\n\tbottomRight: classnames(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-bottom',\n\t\t'components-resizable-box__handle-right'\n\t),\n\tbottomLeft: classnames(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-bottom',\n\t\t'components-resizable-box__handle-left'\n\t),\n};\n\n// Removes the inline styles in the drag handles.\nconst HANDLE_STYLES_OVERRIDES = {\n\twidth: undefined,\n\theight: undefined,\n\ttop: undefined,\n\tright: undefined,\n\tbottom: undefined,\n\tleft: undefined,\n};\nconst HANDLE_STYLES = {\n\ttop: HANDLE_STYLES_OVERRIDES,\n\tright: HANDLE_STYLES_OVERRIDES,\n\tbottom: HANDLE_STYLES_OVERRIDES,\n\tleft: HANDLE_STYLES_OVERRIDES,\n\ttopLeft: HANDLE_STYLES_OVERRIDES,\n\ttopRight: HANDLE_STYLES_OVERRIDES,\n\tbottomRight: HANDLE_STYLES_OVERRIDES,\n\tbottomLeft: HANDLE_STYLES_OVERRIDES,\n};\n\ntype ResizableBoxProps = ResizableProps & {\n\tclassName: string;\n\tchildren: ReactNode;\n\tshowHandle: boolean;\n\t__experimentalShowTooltip: boolean;\n\t__experimentalTooltipProps: Parameters< typeof ResizeTooltip >[ 0 ];\n};\n\nfunction ResizableBox(\n\t{\n\t\tclassName,\n\t\tchildren,\n\t\tshowHandle = true,\n\t\t__experimentalShowTooltip: showTooltip = false,\n\t\t__experimentalTooltipProps: tooltipProps = {},\n\t\t...props\n\t}: ResizableBoxProps,\n\tref: ForwardedRef< Resizable >\n): JSX.Element {\n\treturn (\n\t\t<Resizable\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-resizable-box__container',\n\t\t\t\tshowHandle && 'has-show-handle',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\thandleClasses={ HANDLE_CLASSES }\n\t\t\thandleStyles={ HANDLE_STYLES }\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children }\n\t\t\t{ showTooltip && <ResizeTooltip { ...tooltipProps } /> }\n\t\t</Resizable>\n\t);\n}\n\nexport default forwardRef( ResizableBox );\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/resizable-box/index.tsx"],"names":["HANDLE_CLASS_NAME","SIDE_HANDLE_CLASS_NAME","CORNER_HANDLE_CLASS_NAME","HANDLE_CLASSES","top","right","bottom","left","topLeft","topRight","bottomRight","bottomLeft","HANDLE_STYLES_OVERRIDES","width","undefined","height","HANDLE_STYLES","UnforwardedResizableBox","ref","className","children","showHandle","__experimentalShowTooltip","showTooltip","__experimentalTooltipProps","tooltipProps","props","ResizableBox"],"mappings":";;;;;;;;;AAGA;;;;AAKA;;AACA;;AAOA;;AAhBA;AACA;AACA;;AAGA;AACA;AACA;;AAMA;AACA;AACA;AAGA,MAAMA,iBAAiB,GAAG,kCAA1B;AACA,MAAMC,sBAAsB,GAAG,uCAA/B;AACA,MAAMC,wBAAwB,GAAG,yCAAjC;AAEA,MAAMC,cAAc,GAAG;AACtBC,EAAAA,GAAG,EAAE,yBACJJ,iBADI,EAEJC,sBAFI,EAGJ,sCAHI,CADiB;AAMtBI,EAAAA,KAAK,EAAE,yBACNL,iBADM,EAENC,sBAFM,EAGN,wCAHM,CANe;AAWtBK,EAAAA,MAAM,EAAE,yBACPN,iBADO,EAEPC,sBAFO,EAGP,yCAHO,CAXc;AAgBtBM,EAAAA,IAAI,EAAE,yBACLP,iBADK,EAELC,sBAFK,EAGL,uCAHK,CAhBgB;AAqBtBO,EAAAA,OAAO,EAAE,yBACRR,iBADQ,EAERE,wBAFQ,EAGR,sCAHQ,EAIR,uCAJQ,CArBa;AA2BtBO,EAAAA,QAAQ,EAAE,yBACTT,iBADS,EAETE,wBAFS,EAGT,sCAHS,EAIT,wCAJS,CA3BY;AAiCtBQ,EAAAA,WAAW,EAAE,yBACZV,iBADY,EAEZE,wBAFY,EAGZ,yCAHY,EAIZ,wCAJY,CAjCS;AAuCtBS,EAAAA,UAAU,EAAE,yBACXX,iBADW,EAEXE,wBAFW,EAGX,yCAHW,EAIX,uCAJW;AAvCU,CAAvB,C,CA+CA;;AACA,MAAMU,uBAAuB,GAAG;AAC/BC,EAAAA,KAAK,EAAEC,SADwB;AAE/BC,EAAAA,MAAM,EAAED,SAFuB;AAG/BV,EAAAA,GAAG,EAAEU,SAH0B;AAI/BT,EAAAA,KAAK,EAAES,SAJwB;AAK/BR,EAAAA,MAAM,EAAEQ,SALuB;AAM/BP,EAAAA,IAAI,EAAEO;AANyB,CAAhC;AAQA,MAAME,aAAa,GAAG;AACrBZ,EAAAA,GAAG,EAAEQ,uBADgB;AAErBP,EAAAA,KAAK,EAAEO,uBAFc;AAGrBN,EAAAA,MAAM,EAAEM,uBAHa;AAIrBL,EAAAA,IAAI,EAAEK,uBAJe;AAKrBJ,EAAAA,OAAO,EAAEI,uBALY;AAMrBH,EAAAA,QAAQ,EAAEG,uBANW;AAOrBF,EAAAA,WAAW,EAAEE,uBAPQ;AAQrBD,EAAAA,UAAU,EAAEC;AARS,CAAtB;;AAkBA,SAASK,uBAAT,OASCC,GATD,EAUe;AAAA,MATd;AACCC,IAAAA,SADD;AAECC,IAAAA,QAFD;AAGCC,IAAAA,UAAU,GAAG,IAHd;AAICC,IAAAA,yBAAyB,EAAEC,WAAW,GAAG,KAJ1C;AAKCC,IAAAA,0BAA0B,EAAEC,YAAY,GAAG,EAL5C;AAMC,OAAGC;AANJ,GASc;AACd,SACC,4BAAC,sBAAD;AACC,IAAA,SAAS,EAAG,yBACX,qCADW,EAEXL,UAAU,IAAI,iBAFH,EAGXF,SAHW,CADb;AAMC,IAAA,aAAa,EAAGhB,cANjB;AAOC,IAAA,YAAY,EAAGa,aAPhB;AAQC,IAAA,GAAG,EAAGE;AARP,KASMQ,KATN,GAWGN,QAXH,EAYGG,WAAW,IAAI,4BAAC,sBAAD,EAAoBE,YAApB,CAZlB,CADD;AAgBA;;AAEM,MAAME,YAAY,GAAG,yBAAYV,uBAAZ,CAArB;;eAEQU,Y","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { Resizable } from 're-resizable';\nimport type { ResizableProps } from 're-resizable';\nimport type { ReactNode, ForwardedRef } from 'react';\n\n/**\n * Internal dependencies\n */\nimport ResizeTooltip from './resize-tooltip';\n\nconst HANDLE_CLASS_NAME = 'components-resizable-box__handle';\nconst SIDE_HANDLE_CLASS_NAME = 'components-resizable-box__side-handle';\nconst CORNER_HANDLE_CLASS_NAME = 'components-resizable-box__corner-handle';\n\nconst HANDLE_CLASSES = {\n\ttop: classnames(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-top'\n\t),\n\tright: classnames(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-right'\n\t),\n\tbottom: classnames(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-bottom'\n\t),\n\tleft: classnames(\n\t\tHANDLE_CLASS_NAME,\n\t\tSIDE_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-left'\n\t),\n\ttopLeft: classnames(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-top',\n\t\t'components-resizable-box__handle-left'\n\t),\n\ttopRight: classnames(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-top',\n\t\t'components-resizable-box__handle-right'\n\t),\n\tbottomRight: classnames(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-bottom',\n\t\t'components-resizable-box__handle-right'\n\t),\n\tbottomLeft: classnames(\n\t\tHANDLE_CLASS_NAME,\n\t\tCORNER_HANDLE_CLASS_NAME,\n\t\t'components-resizable-box__handle-bottom',\n\t\t'components-resizable-box__handle-left'\n\t),\n};\n\n// Removes the inline styles in the drag handles.\nconst HANDLE_STYLES_OVERRIDES = {\n\twidth: undefined,\n\theight: undefined,\n\ttop: undefined,\n\tright: undefined,\n\tbottom: undefined,\n\tleft: undefined,\n};\nconst HANDLE_STYLES = {\n\ttop: HANDLE_STYLES_OVERRIDES,\n\tright: HANDLE_STYLES_OVERRIDES,\n\tbottom: HANDLE_STYLES_OVERRIDES,\n\tleft: HANDLE_STYLES_OVERRIDES,\n\ttopLeft: HANDLE_STYLES_OVERRIDES,\n\ttopRight: HANDLE_STYLES_OVERRIDES,\n\tbottomRight: HANDLE_STYLES_OVERRIDES,\n\tbottomLeft: HANDLE_STYLES_OVERRIDES,\n};\n\ntype ResizableBoxProps = ResizableProps & {\n\tchildren: ReactNode;\n\tshowHandle?: boolean;\n\t__experimentalShowTooltip?: boolean;\n\t__experimentalTooltipProps?: Parameters< typeof ResizeTooltip >[ 0 ];\n};\n\nfunction UnforwardedResizableBox(\n\t{\n\t\tclassName,\n\t\tchildren,\n\t\tshowHandle = true,\n\t\t__experimentalShowTooltip: showTooltip = false,\n\t\t__experimentalTooltipProps: tooltipProps = {},\n\t\t...props\n\t}: ResizableBoxProps,\n\tref: ForwardedRef< Resizable >\n): JSX.Element {\n\treturn (\n\t\t<Resizable\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-resizable-box__container',\n\t\t\t\tshowHandle && 'has-show-handle',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t\thandleClasses={ HANDLE_CLASSES }\n\t\t\thandleStyles={ HANDLE_STYLES }\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t>\n\t\t\t{ children }\n\t\t\t{ showTooltip && <ResizeTooltip { ...tooltipProps } /> }\n\t\t</Resizable>\n\t);\n}\n\nexport const ResizableBox = forwardRef( UnforwardedResizableBox );\n\nexport default ResizableBox;\n"]}
@@ -20,6 +20,23 @@ var _compose = require("@wordpress/compose");
20
20
  /**
21
21
  * WordPress dependencies
22
22
  */
23
+
24
+ /**
25
+ * A wrapper component that maintains its aspect ratio when resized.
26
+ *
27
+ * ```jsx
28
+ * import { ResponsiveWrapper } from '@wordpress/components';
29
+ *
30
+ * const MyResponsiveWrapper = () => (
31
+ * <ResponsiveWrapper naturalWidth={ 2000 } naturalHeight={ 680 }>
32
+ * <img
33
+ * src="https://s.w.org/style/images/about/WordPress-logotype-standard.png"
34
+ * alt="WordPress"
35
+ * />
36
+ * </ResponsiveWrapper>
37
+ * );
38
+ * ```
39
+ */
23
40
  function ResponsiveWrapper(_ref) {
24
41
  let {
25
42
  naturalWidth,
@@ -36,7 +53,7 @@ function ResponsiveWrapper(_ref) {
36
53
  }
37
54
 
38
55
  const imageStyle = {
39
- paddingBottom: naturalWidth < containerWidth ? naturalHeight : naturalHeight / naturalWidth * 100 + '%'
56
+ paddingBottom: naturalWidth < (containerWidth !== null && containerWidth !== void 0 ? containerWidth : 0) ? naturalHeight : naturalHeight / naturalWidth * 100 + '%'
40
57
  };
41
58
  const TagName = isInline ? 'span' : 'div';
42
59
  return (0, _element.createElement)(TagName, {
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/responsive-wrapper/index.js"],"names":["ResponsiveWrapper","naturalWidth","naturalHeight","children","isInline","containerResizeListener","width","containerWidth","Children","count","imageStyle","paddingBottom","TagName","className","props"],"mappings":";;;;;;;;;AAQA;;AALA;;AAMA;;AATA;AACA;AACA;;AAGA;AACA;AACA;AAIA,SAASA,iBAAT,OAKI;AAAA,MALwB;AAC3BC,IAAAA,YAD2B;AAE3BC,IAAAA,aAF2B;AAG3BC,IAAAA,QAH2B;AAI3BC,IAAAA,QAAQ,GAAG;AAJgB,GAKxB;AACH,QAAM,CAAEC,uBAAF,EAA2B;AAAEC,IAAAA,KAAK,EAAEC;AAAT,GAA3B,IACL,iCADD;;AAEA,MAAKC,kBAASC,KAAT,CAAgBN,QAAhB,MAA+B,CAApC,EAAwC;AACvC,WAAO,IAAP;AACA;;AACD,QAAMO,UAAU,GAAG;AAClBC,IAAAA,aAAa,EACZV,YAAY,GAAGM,cAAf,GACGL,aADH,GAEKA,aAAa,GAAGD,YAAlB,GAAmC,GAAnC,GAAyC;AAJ3B,GAAnB;AAMA,QAAMW,OAAO,GAAGR,QAAQ,GAAG,MAAH,GAAY,KAApC;AACA,SACC,4BAAC,OAAD;AAAS,IAAA,SAAS,EAAC;AAAnB,KACGC,uBADH,EAEC,4BAAC,OAAD;AAAS,IAAA,KAAK,EAAGK;AAAjB,IAFD,EAGG,2BAAcP,QAAd,EAAwB;AACzBU,IAAAA,SAAS,EAAE,yBACV,wCADU,EAEVV,QAAQ,CAACW,KAAT,CAAeD,SAFL;AADc,GAAxB,CAHH,CADD;AAYA;;eAEcb,iB","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { cloneElement, Children } from '@wordpress/element';\nimport { useResizeObserver } from '@wordpress/compose';\n\nfunction ResponsiveWrapper( {\n\tnaturalWidth,\n\tnaturalHeight,\n\tchildren,\n\tisInline = false,\n} ) {\n\tconst [ containerResizeListener, { width: containerWidth } ] =\n\t\tuseResizeObserver();\n\tif ( Children.count( children ) !== 1 ) {\n\t\treturn null;\n\t}\n\tconst imageStyle = {\n\t\tpaddingBottom:\n\t\t\tnaturalWidth < containerWidth\n\t\t\t\t? naturalHeight\n\t\t\t\t: ( naturalHeight / naturalWidth ) * 100 + '%',\n\t};\n\tconst TagName = isInline ? 'span' : 'div';\n\treturn (\n\t\t<TagName className=\"components-responsive-wrapper\">\n\t\t\t{ containerResizeListener }\n\t\t\t<TagName style={ imageStyle } />\n\t\t\t{ cloneElement( children, {\n\t\t\t\tclassName: classnames(\n\t\t\t\t\t'components-responsive-wrapper__content',\n\t\t\t\t\tchildren.props.className\n\t\t\t\t),\n\t\t\t} ) }\n\t\t</TagName>\n\t);\n}\n\nexport default ResponsiveWrapper;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/responsive-wrapper/index.tsx"],"names":["ResponsiveWrapper","naturalWidth","naturalHeight","children","isInline","containerResizeListener","width","containerWidth","Children","count","imageStyle","paddingBottom","TagName","className","props"],"mappings":";;;;;;;;;AAQA;;AALA;;AAMA;;AATA;AACA;AACA;;AAGA;AACA;AACA;;AASA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,iBAAT,OAK4B;AAAA,MALA;AAC3BC,IAAAA,YAD2B;AAE3BC,IAAAA,aAF2B;AAG3BC,IAAAA,QAH2B;AAI3BC,IAAAA,QAAQ,GAAG;AAJgB,GAKA;AAC3B,QAAM,CAAEC,uBAAF,EAA2B;AAAEC,IAAAA,KAAK,EAAEC;AAAT,GAA3B,IACL,iCADD;;AAEA,MAAKC,kBAASC,KAAT,CAAgBN,QAAhB,MAA+B,CAApC,EAAwC;AACvC,WAAO,IAAP;AACA;;AACD,QAAMO,UAAU,GAAG;AAClBC,IAAAA,aAAa,EACZV,YAAY,IAAKM,cAAL,aAAKA,cAAL,cAAKA,cAAL,GAAuB,CAAvB,CAAZ,GACGL,aADH,GAEKA,aAAa,GAAGD,YAAlB,GAAmC,GAAnC,GAAyC;AAJ3B,GAAnB;AAMA,QAAMW,OAAO,GAAGR,QAAQ,GAAG,MAAH,GAAY,KAApC;AACA,SACC,4BAAC,OAAD;AAAS,IAAA,SAAS,EAAC;AAAnB,KACGC,uBADH,EAEC,4BAAC,OAAD;AAAS,IAAA,KAAK,EAAGK;AAAjB,IAFD,EAGG,2BAAcP,QAAd,EAAwB;AACzBU,IAAAA,SAAS,EAAE,yBACV,wCADU,EAEVV,QAAQ,CAACW,KAAT,CAAeD,SAFL;AADc,GAAxB,CAHH,CADD;AAYA;;eAEcb,iB","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { cloneElement, Children } from '@wordpress/element';\nimport { useResizeObserver } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport type { ResponsiveWrapperProps } from './types';\n\n/**\n * A wrapper component that maintains its aspect ratio when resized.\n *\n * ```jsx\n * import { ResponsiveWrapper } from '@wordpress/components';\n *\n * const MyResponsiveWrapper = () => (\n * \t<ResponsiveWrapper naturalWidth={ 2000 } naturalHeight={ 680 }>\n * \t\t<img\n * \t\t\tsrc=\"https://s.w.org/style/images/about/WordPress-logotype-standard.png\"\n * \t\t\talt=\"WordPress\"\n * \t\t/>\n * \t</ResponsiveWrapper>\n * );\n * ```\n */\nfunction ResponsiveWrapper( {\n\tnaturalWidth,\n\tnaturalHeight,\n\tchildren,\n\tisInline = false,\n}: ResponsiveWrapperProps ) {\n\tconst [ containerResizeListener, { width: containerWidth } ] =\n\t\tuseResizeObserver();\n\tif ( Children.count( children ) !== 1 ) {\n\t\treturn null;\n\t}\n\tconst imageStyle = {\n\t\tpaddingBottom:\n\t\t\tnaturalWidth < ( containerWidth ?? 0 )\n\t\t\t\t? naturalHeight\n\t\t\t\t: ( naturalHeight / naturalWidth ) * 100 + '%',\n\t};\n\tconst TagName = isInline ? 'span' : 'div';\n\treturn (\n\t\t<TagName className=\"components-responsive-wrapper\">\n\t\t\t{ containerResizeListener }\n\t\t\t<TagName style={ imageStyle } />\n\t\t\t{ cloneElement( children, {\n\t\t\t\tclassName: classnames(\n\t\t\t\t\t'components-responsive-wrapper__content',\n\t\t\t\t\tchildren.props.className\n\t\t\t\t),\n\t\t\t} ) }\n\t\t</TagName>\n\t);\n}\n\nexport default ResponsiveWrapper;\n"]}
@@ -0,0 +1,6 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ //# sourceMappingURL=types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.default = Sandbox;
6
+ exports.default = void 0;
7
7
 
8
8
  var _element = require("@wordpress/element");
9
9
 
@@ -64,7 +64,8 @@ const observeAndResizeJS = function () {
64
64
  // get an DOM mutations for that, so do the resize when the window is resized, too.
65
65
 
66
66
  window.addEventListener('resize', sendResize, true);
67
- };
67
+ }; // TODO: These styles shouldn't be coupled with WordPress.
68
+
68
69
 
69
70
  const style = `
70
71
  body {
@@ -88,8 +89,19 @@ const style = `
88
89
  margin-bottom: 0 !important;
89
90
  }
90
91
  `;
92
+ /**
93
+ * This component provides an isolated environment for arbitrary HTML via iframes.
94
+ *
95
+ * ```jsx
96
+ * import { SandBox } from '@wordpress/components';
97
+ *
98
+ * const MySandBox = () => (
99
+ * <SandBox html="<p>Content</p>" title="SandBox" type="embed" />
100
+ * );
101
+ * ```
102
+ */
91
103
 
92
- function Sandbox(_ref) {
104
+ function SandBox(_ref) {
93
105
  let {
94
106
  html = '',
95
107
  title = '',
@@ -104,13 +116,15 @@ function Sandbox(_ref) {
104
116
 
105
117
  function isFrameAccessible() {
106
118
  try {
107
- return !!ref.current.contentDocument.body;
119
+ var _ref$current, _ref$current$contentD;
120
+
121
+ return !!((_ref$current = ref.current) !== null && _ref$current !== void 0 && (_ref$current$contentD = _ref$current.contentDocument) !== null && _ref$current$contentD !== void 0 && _ref$current$contentD.body);
108
122
  } catch (e) {
109
123
  return false;
110
124
  }
111
125
  }
112
126
 
113
- function trySandbox() {
127
+ function trySandBox() {
114
128
  let forceRerender = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
115
129
 
116
130
  if (!isFrameAccessible()) {
@@ -121,11 +135,8 @@ function Sandbox(_ref) {
121
135
  contentDocument,
122
136
  ownerDocument
123
137
  } = ref.current;
124
- const {
125
- body
126
- } = contentDocument;
127
138
 
128
- if (!forceRerender && null !== body.getAttribute('data-resizable-iframe-connected')) {
139
+ if (!forceRerender && null !== (contentDocument === null || contentDocument === void 0 ? void 0 : contentDocument.body.getAttribute('data-resizable-iframe-connected'))) {
129
140
  return;
130
141
  } // Put the html snippet into a html document, and then write it to the iframe's document
131
142
  // we can use this in the future to inject custom styles or scripts.
@@ -170,10 +181,12 @@ function Sandbox(_ref) {
170
181
  }
171
182
 
172
183
  (0, _element.useEffect)(() => {
173
- trySandbox();
184
+ var _iframe$ownerDocument;
174
185
 
175
- function tryNoForceSandbox() {
176
- trySandbox(false);
186
+ trySandBox();
187
+
188
+ function tryNoForceSandBox() {
189
+ trySandBox(false);
177
190
  }
178
191
 
179
192
  function checkMessageForResize(event) {
@@ -203,32 +216,27 @@ function Sandbox(_ref) {
203
216
  }
204
217
 
205
218
  const iframe = ref.current;
206
- const {
207
- ownerDocument
208
- } = iframe;
209
- const {
210
- defaultView
211
- } = ownerDocument; // This used to be registered using <iframe onLoad={} />, but it made the iframe blank
219
+ const defaultView = iframe === null || iframe === void 0 ? void 0 : (_iframe$ownerDocument = iframe.ownerDocument) === null || _iframe$ownerDocument === void 0 ? void 0 : _iframe$ownerDocument.defaultView; // This used to be registered using <iframe onLoad={} />, but it made the iframe blank
212
220
  // after reordering the containing block. See these two issues for more details:
213
221
  // https://github.com/WordPress/gutenberg/issues/6146
214
222
  // https://github.com/facebook/react/issues/18752
215
223
 
216
- iframe.addEventListener('load', tryNoForceSandbox, false);
217
- defaultView.addEventListener('message', checkMessageForResize);
224
+ iframe === null || iframe === void 0 ? void 0 : iframe.addEventListener('load', tryNoForceSandBox, false);
225
+ defaultView === null || defaultView === void 0 ? void 0 : defaultView.addEventListener('message', checkMessageForResize);
218
226
  return () => {
219
- iframe === null || iframe === void 0 ? void 0 : iframe.removeEventListener('load', tryNoForceSandbox, false);
220
- defaultView.addEventListener('message', checkMessageForResize);
227
+ iframe === null || iframe === void 0 ? void 0 : iframe.removeEventListener('load', tryNoForceSandBox, false);
228
+ defaultView === null || defaultView === void 0 ? void 0 : defaultView.addEventListener('message', checkMessageForResize);
221
229
  }; // Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor.
222
230
  // See https://github.com/WordPress/gutenberg/pull/44378
223
231
  // eslint-disable-next-line react-hooks/exhaustive-deps
224
232
  }, []);
225
233
  (0, _element.useEffect)(() => {
226
- trySandbox(); // Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor.
234
+ trySandBox(); // Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor.
227
235
  // See https://github.com/WordPress/gutenberg/pull/44378
228
236
  // eslint-disable-next-line react-hooks/exhaustive-deps
229
237
  }, [title, styles, scripts]);
230
238
  (0, _element.useEffect)(() => {
231
- trySandbox(true); // Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor.
239
+ trySandBox(true); // Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor.
232
240
  // See https://github.com/WordPress/gutenberg/pull/44378
233
241
  // eslint-disable-next-line react-hooks/exhaustive-deps
234
242
  }, [html, type]);
@@ -242,4 +250,7 @@ function Sandbox(_ref) {
242
250
  height: Math.ceil(height)
243
251
  });
244
252
  }
253
+
254
+ var _default = SandBox;
255
+ exports.default = _default;
245
256
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/sandbox/index.js"],"names":["observeAndResizeJS","MutationObserver","window","document","body","parent","sendResize","clientBoundingRect","getBoundingClientRect","postMessage","action","width","height","observer","observe","attributes","attributeOldValue","characterData","characterDataOldValue","childList","subtree","addEventListener","removeViewportStyles","ruleOrNode","style","forEach","test","Array","prototype","call","querySelectorAll","styleSheets","stylesheet","cssRules","rules","position","setAttribute","Sandbox","html","title","type","styles","scripts","onFocus","ref","setWidth","setHeight","isFrameAccessible","current","contentDocument","e","trySandbox","forceRerender","ownerDocument","getAttribute","htmlDoc","documentElement","lang","__html","map","i","toString","src","open","write","close","tryNoForceSandbox","checkMessageForResize","event","iframe","contentWindow","source","data","JSON","parse","defaultView","removeEventListener","Math","ceil"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\trenderToString,\n\tuseRef,\n\tuseState,\n\tuseEffect,\n} from '@wordpress/element';\nimport { useFocusableIframe, useMergeRefs } from '@wordpress/compose';\n\nconst observeAndResizeJS = function () {\n\tconst { MutationObserver } = window;\n\n\tif ( ! MutationObserver || ! document.body || ! window.parent ) {\n\t\treturn;\n\t}\n\n\tfunction sendResize() {\n\t\tconst clientBoundingRect = document.body.getBoundingClientRect();\n\n\t\twindow.parent.postMessage(\n\t\t\t{\n\t\t\t\taction: 'resize',\n\t\t\t\twidth: clientBoundingRect.width,\n\t\t\t\theight: clientBoundingRect.height,\n\t\t\t},\n\t\t\t'*'\n\t\t);\n\t}\n\n\tconst observer = new MutationObserver( sendResize );\n\tobserver.observe( document.body, {\n\t\tattributes: true,\n\t\tattributeOldValue: false,\n\t\tcharacterData: true,\n\t\tcharacterDataOldValue: false,\n\t\tchildList: true,\n\t\tsubtree: true,\n\t} );\n\n\twindow.addEventListener( 'load', sendResize, true );\n\n\t// Hack: Remove viewport unit styles, as these are relative\n\t// the iframe root and interfere with our mechanism for\n\t// determining the unconstrained page bounds.\n\tfunction removeViewportStyles( ruleOrNode ) {\n\t\tif ( ruleOrNode.style ) {\n\t\t\t[ 'width', 'height', 'minHeight', 'maxHeight' ].forEach( function (\n\t\t\t\tstyle\n\t\t\t) {\n\t\t\t\tif (\n\t\t\t\t\t/^\\\\d+(vmin|vmax|vh|vw)$/.test( ruleOrNode.style[ style ] )\n\t\t\t\t) {\n\t\t\t\t\truleOrNode.style[ style ] = '';\n\t\t\t\t}\n\t\t\t} );\n\t\t}\n\t}\n\n\tArray.prototype.forEach.call(\n\t\tdocument.querySelectorAll( '[style]' ),\n\t\tremoveViewportStyles\n\t);\n\tArray.prototype.forEach.call(\n\t\tdocument.styleSheets,\n\t\tfunction ( stylesheet ) {\n\t\t\tArray.prototype.forEach.call(\n\t\t\t\tstylesheet.cssRules || stylesheet.rules,\n\t\t\t\tremoveViewportStyles\n\t\t\t);\n\t\t}\n\t);\n\n\tdocument.body.style.position = 'absolute';\n\tdocument.body.style.width = '100%';\n\tdocument.body.setAttribute( 'data-resizable-iframe-connected', '' );\n\n\tsendResize();\n\n\t// Resize events can change the width of elements with 100% width, but we don't\n\t// get an DOM mutations for that, so do the resize when the window is resized, too.\n\twindow.addEventListener( 'resize', sendResize, true );\n};\n\nconst style = `\n\tbody {\n\t\tmargin: 0;\n\t}\n\thtml,\n\tbody,\n\tbody > div {\n\t\twidth: 100%;\n\t}\n\thtml.wp-has-aspect-ratio,\n\tbody.wp-has-aspect-ratio,\n\tbody.wp-has-aspect-ratio > div,\n\tbody.wp-has-aspect-ratio > div iframe {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\toverflow: hidden; /* If it has an aspect ratio, it shouldn't scroll. */\n\t}\n\tbody > div > * {\n\t\tmargin-top: 0 !important; /* Has to have !important to override inline styles. */\n\t\tmargin-bottom: 0 !important;\n\t}\n`;\n\nexport default function Sandbox( {\n\thtml = '',\n\ttitle = '',\n\ttype,\n\tstyles = [],\n\tscripts = [],\n\tonFocus,\n} ) {\n\tconst ref = useRef();\n\tconst [ width, setWidth ] = useState( 0 );\n\tconst [ height, setHeight ] = useState( 0 );\n\n\tfunction isFrameAccessible() {\n\t\ttry {\n\t\t\treturn !! ref.current.contentDocument.body;\n\t\t} catch ( e ) {\n\t\t\treturn false;\n\t\t}\n\t}\n\n\tfunction trySandbox( forceRerender = false ) {\n\t\tif ( ! isFrameAccessible() ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { contentDocument, ownerDocument } = ref.current;\n\t\tconst { body } = contentDocument;\n\n\t\tif (\n\t\t\t! forceRerender &&\n\t\t\tnull !== body.getAttribute( 'data-resizable-iframe-connected' )\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Put the html snippet into a html document, and then write it to the iframe's document\n\t\t// we can use this in the future to inject custom styles or scripts.\n\t\t// Scripts go into the body rather than the head, to support embedded content such as Instagram\n\t\t// that expect the scripts to be part of the body.\n\t\tconst htmlDoc = (\n\t\t\t<html\n\t\t\t\tlang={ ownerDocument.documentElement.lang }\n\t\t\t\tclassName={ type }\n\t\t\t>\n\t\t\t\t<head>\n\t\t\t\t\t<title>{ title }</title>\n\t\t\t\t\t<style dangerouslySetInnerHTML={ { __html: style } } />\n\t\t\t\t\t{ styles.map( ( rules, i ) => (\n\t\t\t\t\t\t<style\n\t\t\t\t\t\t\tkey={ i }\n\t\t\t\t\t\t\tdangerouslySetInnerHTML={ { __html: rules } }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t</head>\n\t\t\t\t<body\n\t\t\t\t\tdata-resizable-iframe-connected=\"data-resizable-iframe-connected\"\n\t\t\t\t\tclassName={ type }\n\t\t\t\t>\n\t\t\t\t\t<div dangerouslySetInnerHTML={ { __html: html } } />\n\t\t\t\t\t<script\n\t\t\t\t\t\ttype=\"text/javascript\"\n\t\t\t\t\t\tdangerouslySetInnerHTML={ {\n\t\t\t\t\t\t\t__html: `(${ observeAndResizeJS.toString() })();`,\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t\t{ scripts.map( ( src ) => (\n\t\t\t\t\t\t<script key={ src } src={ src } />\n\t\t\t\t\t) ) }\n\t\t\t\t</body>\n\t\t\t</html>\n\t\t);\n\n\t\t// Writing the document like this makes it act in the same way as if it was\n\t\t// loaded over the network, so DOM creation and mutation, script execution, etc.\n\t\t// all work as expected.\n\t\tcontentDocument.open();\n\t\tcontentDocument.write( '<!DOCTYPE html>' + renderToString( htmlDoc ) );\n\t\tcontentDocument.close();\n\t}\n\n\tuseEffect( () => {\n\t\ttrySandbox();\n\n\t\tfunction tryNoForceSandbox() {\n\t\t\ttrySandbox( false );\n\t\t}\n\n\t\tfunction checkMessageForResize( event ) {\n\t\t\tconst iframe = ref.current;\n\n\t\t\t// Verify that the mounted element is the source of the message.\n\t\t\tif ( ! iframe || iframe.contentWindow !== event.source ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Attempt to parse the message data as JSON if passed as string.\n\t\t\tlet data = event.data || {};\n\n\t\t\tif ( 'string' === typeof data ) {\n\t\t\t\ttry {\n\t\t\t\t\tdata = JSON.parse( data );\n\t\t\t\t} catch ( e ) {}\n\t\t\t}\n\n\t\t\t// Update the state only if the message is formatted as we expect,\n\t\t\t// i.e. as an object with a 'resize' action.\n\t\t\tif ( 'resize' !== data.action ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetWidth( data.width );\n\t\t\tsetHeight( data.height );\n\t\t}\n\n\t\tconst iframe = ref.current;\n\t\tconst { ownerDocument } = iframe;\n\t\tconst { defaultView } = ownerDocument;\n\n\t\t// This used to be registered using <iframe onLoad={} />, but it made the iframe blank\n\t\t// after reordering the containing block. See these two issues for more details:\n\t\t// https://github.com/WordPress/gutenberg/issues/6146\n\t\t// https://github.com/facebook/react/issues/18752\n\t\tiframe.addEventListener( 'load', tryNoForceSandbox, false );\n\t\tdefaultView.addEventListener( 'message', checkMessageForResize );\n\n\t\treturn () => {\n\t\t\tiframe?.removeEventListener( 'load', tryNoForceSandbox, false );\n\t\t\tdefaultView.addEventListener( 'message', checkMessageForResize );\n\t\t};\n\t\t// Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor.\n\t\t// See https://github.com/WordPress/gutenberg/pull/44378\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [] );\n\n\tuseEffect( () => {\n\t\ttrySandbox();\n\t\t// Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor.\n\t\t// See https://github.com/WordPress/gutenberg/pull/44378\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ title, styles, scripts ] );\n\n\tuseEffect( () => {\n\t\ttrySandbox( true );\n\t\t// Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor.\n\t\t// See https://github.com/WordPress/gutenberg/pull/44378\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ html, type ] );\n\n\treturn (\n\t\t<iframe\n\t\t\tref={ useMergeRefs( [ ref, useFocusableIframe() ] ) }\n\t\t\ttitle={ title }\n\t\t\tclassName=\"components-sandbox\"\n\t\t\tsandbox=\"allow-scripts allow-same-origin allow-presentation\"\n\t\t\tonFocus={ onFocus }\n\t\t\twidth={ Math.ceil( width ) }\n\t\t\theight={ Math.ceil( height ) }\n\t\t/>\n\t);\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/sandbox/index.tsx"],"names":["observeAndResizeJS","MutationObserver","window","document","body","parent","sendResize","clientBoundingRect","getBoundingClientRect","postMessage","action","width","height","observer","observe","attributes","attributeOldValue","characterData","characterDataOldValue","childList","subtree","addEventListener","removeViewportStyles","ruleOrNode","style","forEach","test","Array","prototype","call","querySelectorAll","styleSheets","stylesheet","cssRules","rules","position","setAttribute","SandBox","html","title","type","styles","scripts","onFocus","ref","setWidth","setHeight","isFrameAccessible","current","contentDocument","e","trySandBox","forceRerender","ownerDocument","getAttribute","htmlDoc","documentElement","lang","__html","map","i","toString","src","open","write","close","tryNoForceSandBox","checkMessageForResize","event","iframe","contentWindow","source","data","JSON","parse","defaultView","removeEventListener","Math","ceil"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\trenderToString,\n\tuseRef,\n\tuseState,\n\tuseEffect,\n} from '@wordpress/element';\nimport { useFocusableIframe, useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport type { SandBoxProps } from './types';\n\nconst observeAndResizeJS = function () {\n\tconst { MutationObserver } = window;\n\n\tif ( ! MutationObserver || ! document.body || ! window.parent ) {\n\t\treturn;\n\t}\n\n\tfunction sendResize() {\n\t\tconst clientBoundingRect = document.body.getBoundingClientRect();\n\n\t\twindow.parent.postMessage(\n\t\t\t{\n\t\t\t\taction: 'resize',\n\t\t\t\twidth: clientBoundingRect.width,\n\t\t\t\theight: clientBoundingRect.height,\n\t\t\t},\n\t\t\t'*'\n\t\t);\n\t}\n\n\tconst observer = new MutationObserver( sendResize );\n\tobserver.observe( document.body, {\n\t\tattributes: true,\n\t\tattributeOldValue: false,\n\t\tcharacterData: true,\n\t\tcharacterDataOldValue: false,\n\t\tchildList: true,\n\t\tsubtree: true,\n\t} );\n\n\twindow.addEventListener( 'load', sendResize, true );\n\n\t// Hack: Remove viewport unit styles, as these are relative\n\t// the iframe root and interfere with our mechanism for\n\t// determining the unconstrained page bounds.\n\tfunction removeViewportStyles( ruleOrNode: ElementCSSInlineStyle ) {\n\t\tif ( ruleOrNode.style ) {\n\t\t\t(\n\t\t\t\t[ 'width', 'height', 'minHeight', 'maxHeight' ] as const\n\t\t\t ).forEach( function ( style ) {\n\t\t\t\tif (\n\t\t\t\t\t/^\\\\d+(vmin|vmax|vh|vw)$/.test( ruleOrNode.style[ style ] )\n\t\t\t\t) {\n\t\t\t\t\truleOrNode.style[ style ] = '';\n\t\t\t\t}\n\t\t\t} );\n\t\t}\n\t}\n\n\tArray.prototype.forEach.call(\n\t\tdocument.querySelectorAll( '[style]' ),\n\t\tremoveViewportStyles\n\t);\n\tArray.prototype.forEach.call(\n\t\tdocument.styleSheets,\n\t\tfunction ( stylesheet ) {\n\t\t\tArray.prototype.forEach.call(\n\t\t\t\tstylesheet.cssRules || stylesheet.rules,\n\t\t\t\tremoveViewportStyles\n\t\t\t);\n\t\t}\n\t);\n\n\tdocument.body.style.position = 'absolute';\n\tdocument.body.style.width = '100%';\n\tdocument.body.setAttribute( 'data-resizable-iframe-connected', '' );\n\n\tsendResize();\n\n\t// Resize events can change the width of elements with 100% width, but we don't\n\t// get an DOM mutations for that, so do the resize when the window is resized, too.\n\twindow.addEventListener( 'resize', sendResize, true );\n};\n\n// TODO: These styles shouldn't be coupled with WordPress.\nconst style = `\n\tbody {\n\t\tmargin: 0;\n\t}\n\thtml,\n\tbody,\n\tbody > div {\n\t\twidth: 100%;\n\t}\n\thtml.wp-has-aspect-ratio,\n\tbody.wp-has-aspect-ratio,\n\tbody.wp-has-aspect-ratio > div,\n\tbody.wp-has-aspect-ratio > div iframe {\n\t\twidth: 100%;\n\t\theight: 100%;\n\t\toverflow: hidden; /* If it has an aspect ratio, it shouldn't scroll. */\n\t}\n\tbody > div > * {\n\t\tmargin-top: 0 !important; /* Has to have !important to override inline styles. */\n\t\tmargin-bottom: 0 !important;\n\t}\n`;\n\n/**\n * This component provides an isolated environment for arbitrary HTML via iframes.\n *\n * ```jsx\n * import { SandBox } from '@wordpress/components';\n *\n * const MySandBox = () => (\n * \t<SandBox html=\"<p>Content</p>\" title=\"SandBox\" type=\"embed\" />\n * );\n * ```\n */\nfunction SandBox( {\n\thtml = '',\n\ttitle = '',\n\ttype,\n\tstyles = [],\n\tscripts = [],\n\tonFocus,\n}: SandBoxProps ) {\n\tconst ref = useRef< HTMLIFrameElement >();\n\tconst [ width, setWidth ] = useState( 0 );\n\tconst [ height, setHeight ] = useState( 0 );\n\n\tfunction isFrameAccessible() {\n\t\ttry {\n\t\t\treturn !! ref.current?.contentDocument?.body;\n\t\t} catch ( e ) {\n\t\t\treturn false;\n\t\t}\n\t}\n\n\tfunction trySandBox( forceRerender = false ) {\n\t\tif ( ! isFrameAccessible() ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst { contentDocument, ownerDocument } =\n\t\t\tref.current as HTMLIFrameElement & {\n\t\t\t\tcontentDocument: Document;\n\t\t\t};\n\n\t\tif (\n\t\t\t! forceRerender &&\n\t\t\tnull !==\n\t\t\t\tcontentDocument?.body.getAttribute(\n\t\t\t\t\t'data-resizable-iframe-connected'\n\t\t\t\t)\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Put the html snippet into a html document, and then write it to the iframe's document\n\t\t// we can use this in the future to inject custom styles or scripts.\n\t\t// Scripts go into the body rather than the head, to support embedded content such as Instagram\n\t\t// that expect the scripts to be part of the body.\n\t\tconst htmlDoc = (\n\t\t\t<html\n\t\t\t\tlang={ ownerDocument.documentElement.lang }\n\t\t\t\tclassName={ type }\n\t\t\t>\n\t\t\t\t<head>\n\t\t\t\t\t<title>{ title }</title>\n\t\t\t\t\t<style dangerouslySetInnerHTML={ { __html: style } } />\n\t\t\t\t\t{ styles.map( ( rules, i ) => (\n\t\t\t\t\t\t<style\n\t\t\t\t\t\t\tkey={ i }\n\t\t\t\t\t\t\tdangerouslySetInnerHTML={ { __html: rules } }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t</head>\n\t\t\t\t<body\n\t\t\t\t\tdata-resizable-iframe-connected=\"data-resizable-iframe-connected\"\n\t\t\t\t\tclassName={ type }\n\t\t\t\t>\n\t\t\t\t\t<div dangerouslySetInnerHTML={ { __html: html } } />\n\t\t\t\t\t<script\n\t\t\t\t\t\ttype=\"text/javascript\"\n\t\t\t\t\t\tdangerouslySetInnerHTML={ {\n\t\t\t\t\t\t\t__html: `(${ observeAndResizeJS.toString() })();`,\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t\t{ scripts.map( ( src ) => (\n\t\t\t\t\t\t<script key={ src } src={ src } />\n\t\t\t\t\t) ) }\n\t\t\t\t</body>\n\t\t\t</html>\n\t\t);\n\n\t\t// Writing the document like this makes it act in the same way as if it was\n\t\t// loaded over the network, so DOM creation and mutation, script execution, etc.\n\t\t// all work as expected.\n\t\tcontentDocument.open();\n\t\tcontentDocument.write( '<!DOCTYPE html>' + renderToString( htmlDoc ) );\n\t\tcontentDocument.close();\n\t}\n\n\tuseEffect( () => {\n\t\ttrySandBox();\n\n\t\tfunction tryNoForceSandBox() {\n\t\t\ttrySandBox( false );\n\t\t}\n\n\t\tfunction checkMessageForResize( event: MessageEvent ) {\n\t\t\tconst iframe = ref.current;\n\n\t\t\t// Verify that the mounted element is the source of the message.\n\t\t\tif ( ! iframe || iframe.contentWindow !== event.source ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Attempt to parse the message data as JSON if passed as string.\n\t\t\tlet data = event.data || {};\n\n\t\t\tif ( 'string' === typeof data ) {\n\t\t\t\ttry {\n\t\t\t\t\tdata = JSON.parse( data );\n\t\t\t\t} catch ( e ) {}\n\t\t\t}\n\n\t\t\t// Update the state only if the message is formatted as we expect,\n\t\t\t// i.e. as an object with a 'resize' action.\n\t\t\tif ( 'resize' !== data.action ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetWidth( data.width );\n\t\t\tsetHeight( data.height );\n\t\t}\n\n\t\tconst iframe = ref.current;\n\t\tconst defaultView = iframe?.ownerDocument?.defaultView;\n\n\t\t// This used to be registered using <iframe onLoad={} />, but it made the iframe blank\n\t\t// after reordering the containing block. See these two issues for more details:\n\t\t// https://github.com/WordPress/gutenberg/issues/6146\n\t\t// https://github.com/facebook/react/issues/18752\n\t\tiframe?.addEventListener( 'load', tryNoForceSandBox, false );\n\t\tdefaultView?.addEventListener( 'message', checkMessageForResize );\n\n\t\treturn () => {\n\t\t\tiframe?.removeEventListener( 'load', tryNoForceSandBox, false );\n\t\t\tdefaultView?.addEventListener( 'message', checkMessageForResize );\n\t\t};\n\t\t// Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor.\n\t\t// See https://github.com/WordPress/gutenberg/pull/44378\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [] );\n\n\tuseEffect( () => {\n\t\ttrySandBox();\n\t\t// Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor.\n\t\t// See https://github.com/WordPress/gutenberg/pull/44378\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ title, styles, scripts ] );\n\n\tuseEffect( () => {\n\t\ttrySandBox( true );\n\t\t// Ignore reason: passing `exhaustive-deps` will likely involve a more detailed refactor.\n\t\t// See https://github.com/WordPress/gutenberg/pull/44378\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ html, type ] );\n\n\treturn (\n\t\t<iframe\n\t\t\tref={ useMergeRefs( [ ref, useFocusableIframe() ] ) }\n\t\t\ttitle={ title }\n\t\t\tclassName=\"components-sandbox\"\n\t\t\tsandbox=\"allow-scripts allow-same-origin allow-presentation\"\n\t\t\tonFocus={ onFocus }\n\t\t\twidth={ Math.ceil( width ) }\n\t\t\theight={ Math.ceil( height ) }\n\t\t/>\n\t);\n}\n\nexport default SandBox;\n"]}
@@ -0,0 +1,6 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ //# sourceMappingURL=types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}
@@ -26,6 +26,7 @@ function useForceUpdate() {
26
26
  const [, setState] = (0, _element.useState)({});
27
27
  const mounted = (0, _element.useRef)(true);
28
28
  (0, _element.useEffect)(() => {
29
+ mounted.current = true;
29
30
  return () => {
30
31
  mounted.current = false;
31
32
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/slot-fill/bubbles-virtually/fill.js"],"names":["useForceUpdate","setState","mounted","current","Fill","name","children","registerFill","unregisterFill","slot","ref","rerender","fillProps","wrappedChildren","ownerDocument"],"mappings":";;;;;;;;;AAIA;;AAKA;;AACA;;AAVA;;AACA;AACA;AACA;;AAGA;AACA;AACA;AAIA,SAASA,cAAT,GAA0B;AACzB,QAAM,GAAIC,QAAJ,IAAiB,uBAAU,EAAV,CAAvB;AACA,QAAMC,OAAO,GAAG,qBAAQ,IAAR,CAAhB;AAEA,0BAAW,MAAM;AAChB,WAAO,MAAM;AACZA,MAAAA,OAAO,CAACC,OAAR,GAAkB,KAAlB;AACA,KAFD;AAGA,GAJD,EAIG,EAJH;AAMA,SAAO,MAAM;AACZ,QAAKD,OAAO,CAACC,OAAb,EAAuB;AACtBF,MAAAA,QAAQ,CAAE,EAAF,CAAR;AACA;AACD,GAJD;AAKA;;AAEc,SAASG,IAAT,OAAoC;AAAA,MAArB;AAAEC,IAAAA,IAAF;AAAQC,IAAAA;AAAR,GAAqB;AAClD,QAAM;AAAEC,IAAAA,YAAF;AAAgBC,IAAAA,cAAhB;AAAgC,OAAGC;AAAnC,MAA4C,sBAASJ,IAAT,CAAlD;AACA,QAAMK,GAAG,GAAG,qBAAQ;AAAEC,IAAAA,QAAQ,EAAEX,cAAc;AAA1B,GAAR,CAAZ;AAEA,0BAAW,MAAM;AAChB;AACA;AACA;AACAO,IAAAA,YAAY,CAAEG,GAAF,CAAZ;AACA,WAAO,MAAM;AACZF,MAAAA,cAAc,CAAEE,GAAF,CAAd;AACA,KAFD;AAGA,GARD,EAQG,CAAEH,YAAF,EAAgBC,cAAhB,CARH;;AAUA,MAAK,CAAEC,IAAI,CAACC,GAAP,IAAc,CAAED,IAAI,CAACC,GAAL,CAASP,OAA9B,EAAwC;AACvC,WAAO,IAAP;AACA;;AAED,MAAK,OAAOG,QAAP,KAAoB,UAAzB,EAAsC;AACrCA,IAAAA,QAAQ,GAAGA,QAAQ,CAAEG,IAAI,CAACG,SAAP,CAAnB;AACA,GApBiD,CAsBlD;AACA;AACA;AACA;;;AACA,QAAMC,eAAe,GACpB,4BAAC,sBAAD;AAAe,IAAA,QAAQ,EAAGJ,IAAI,CAACC,GAAL,CAASP,OAAT,CAAiBW;AAA3C,KACGR,QADH,CADD;AAMA,SAAO,2BAAcO,eAAd,EAA+BJ,IAAI,CAACC,GAAL,CAASP,OAAxC,CAAP;AACA","sourcesContent":["// @ts-nocheck\n/**\n * WordPress dependencies\n */\nimport { useRef, useState, useEffect, createPortal } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useSlot from './use-slot';\nimport StyleProvider from '../../style-provider';\n\nfunction useForceUpdate() {\n\tconst [ , setState ] = useState( {} );\n\tconst mounted = useRef( true );\n\n\tuseEffect( () => {\n\t\treturn () => {\n\t\t\tmounted.current = false;\n\t\t};\n\t}, [] );\n\n\treturn () => {\n\t\tif ( mounted.current ) {\n\t\t\tsetState( {} );\n\t\t}\n\t};\n}\n\nexport default function Fill( { name, children } ) {\n\tconst { registerFill, unregisterFill, ...slot } = useSlot( name );\n\tconst ref = useRef( { rerender: useForceUpdate() } );\n\n\tuseEffect( () => {\n\t\t// We register fills so we can keep track of their existence.\n\t\t// Some Slot implementations need to know if there're already fills\n\t\t// registered so they can choose to render themselves or not.\n\t\tregisterFill( ref );\n\t\treturn () => {\n\t\t\tunregisterFill( ref );\n\t\t};\n\t}, [ registerFill, unregisterFill ] );\n\n\tif ( ! slot.ref || ! slot.ref.current ) {\n\t\treturn null;\n\t}\n\n\tif ( typeof children === 'function' ) {\n\t\tchildren = children( slot.fillProps );\n\t}\n\n\t// When using a `Fill`, the `children` will be rendered in the document of the\n\t// `Slot`. This means that we need to wrap the `children` in a `StyleProvider`\n\t// to make sure we're referencing the right document/iframe (instead of the\n\t// context of the `Fill`'s parent).\n\tconst wrappedChildren = (\n\t\t<StyleProvider document={ slot.ref.current.ownerDocument }>\n\t\t\t{ children }\n\t\t</StyleProvider>\n\t);\n\n\treturn createPortal( wrappedChildren, slot.ref.current );\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/slot-fill/bubbles-virtually/fill.js"],"names":["useForceUpdate","setState","mounted","current","Fill","name","children","registerFill","unregisterFill","slot","ref","rerender","fillProps","wrappedChildren","ownerDocument"],"mappings":";;;;;;;;;AAIA;;AAKA;;AACA;;AAVA;;AACA;AACA;AACA;;AAGA;AACA;AACA;AAIA,SAASA,cAAT,GAA0B;AACzB,QAAM,GAAIC,QAAJ,IAAiB,uBAAU,EAAV,CAAvB;AACA,QAAMC,OAAO,GAAG,qBAAQ,IAAR,CAAhB;AAEA,0BAAW,MAAM;AAChBA,IAAAA,OAAO,CAACC,OAAR,GAAkB,IAAlB;AACA,WAAO,MAAM;AACZD,MAAAA,OAAO,CAACC,OAAR,GAAkB,KAAlB;AACA,KAFD;AAGA,GALD,EAKG,EALH;AAOA,SAAO,MAAM;AACZ,QAAKD,OAAO,CAACC,OAAb,EAAuB;AACtBF,MAAAA,QAAQ,CAAE,EAAF,CAAR;AACA;AACD,GAJD;AAKA;;AAEc,SAASG,IAAT,OAAoC;AAAA,MAArB;AAAEC,IAAAA,IAAF;AAAQC,IAAAA;AAAR,GAAqB;AAClD,QAAM;AAAEC,IAAAA,YAAF;AAAgBC,IAAAA,cAAhB;AAAgC,OAAGC;AAAnC,MAA4C,sBAASJ,IAAT,CAAlD;AACA,QAAMK,GAAG,GAAG,qBAAQ;AAAEC,IAAAA,QAAQ,EAAEX,cAAc;AAA1B,GAAR,CAAZ;AAEA,0BAAW,MAAM;AAChB;AACA;AACA;AACAO,IAAAA,YAAY,CAAEG,GAAF,CAAZ;AACA,WAAO,MAAM;AACZF,MAAAA,cAAc,CAAEE,GAAF,CAAd;AACA,KAFD;AAGA,GARD,EAQG,CAAEH,YAAF,EAAgBC,cAAhB,CARH;;AAUA,MAAK,CAAEC,IAAI,CAACC,GAAP,IAAc,CAAED,IAAI,CAACC,GAAL,CAASP,OAA9B,EAAwC;AACvC,WAAO,IAAP;AACA;;AAED,MAAK,OAAOG,QAAP,KAAoB,UAAzB,EAAsC;AACrCA,IAAAA,QAAQ,GAAGA,QAAQ,CAAEG,IAAI,CAACG,SAAP,CAAnB;AACA,GApBiD,CAsBlD;AACA;AACA;AACA;;;AACA,QAAMC,eAAe,GACpB,4BAAC,sBAAD;AAAe,IAAA,QAAQ,EAAGJ,IAAI,CAACC,GAAL,CAASP,OAAT,CAAiBW;AAA3C,KACGR,QADH,CADD;AAMA,SAAO,2BAAcO,eAAd,EAA+BJ,IAAI,CAACC,GAAL,CAASP,OAAxC,CAAP;AACA","sourcesContent":["// @ts-nocheck\n/**\n * WordPress dependencies\n */\nimport { useRef, useState, useEffect, createPortal } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useSlot from './use-slot';\nimport StyleProvider from '../../style-provider';\n\nfunction useForceUpdate() {\n\tconst [ , setState ] = useState( {} );\n\tconst mounted = useRef( true );\n\n\tuseEffect( () => {\n\t\tmounted.current = true;\n\t\treturn () => {\n\t\t\tmounted.current = false;\n\t\t};\n\t}, [] );\n\n\treturn () => {\n\t\tif ( mounted.current ) {\n\t\t\tsetState( {} );\n\t\t}\n\t};\n}\n\nexport default function Fill( { name, children } ) {\n\tconst { registerFill, unregisterFill, ...slot } = useSlot( name );\n\tconst ref = useRef( { rerender: useForceUpdate() } );\n\n\tuseEffect( () => {\n\t\t// We register fills so we can keep track of their existence.\n\t\t// Some Slot implementations need to know if there're already fills\n\t\t// registered so they can choose to render themselves or not.\n\t\tregisterFill( ref );\n\t\treturn () => {\n\t\t\tunregisterFill( ref );\n\t\t};\n\t}, [ registerFill, unregisterFill ] );\n\n\tif ( ! slot.ref || ! slot.ref.current ) {\n\t\treturn null;\n\t}\n\n\tif ( typeof children === 'function' ) {\n\t\tchildren = children( slot.fillProps );\n\t}\n\n\t// When using a `Fill`, the `children` will be rendered in the document of the\n\t// `Slot`. This means that we need to wrap the `children` in a `StyleProvider`\n\t// to make sure we're referencing the right document/iframe (instead of the\n\t// context of the `Fill`'s parent).\n\tconst wrappedChildren = (\n\t\t<StyleProvider document={ slot.ref.current.ownerDocument }>\n\t\t\t{ children }\n\t\t</StyleProvider>\n\t);\n\n\treturn createPortal( wrappedChildren, slot.ref.current );\n}\n"]}
@@ -44,6 +44,7 @@ class SlotComponent extends _element.Component {
44
44
  const {
45
45
  registerSlot
46
46
  } = this.props;
47
+ this.isUnmounted = false;
47
48
  registerSlot(this.props.name, this);
48
49
  }
49
50
 
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/slot-fill/slot.js"],"names":["isFunction","maybeFunc","SlotComponent","Component","constructor","arguments","isUnmounted","bindNode","bind","componentDidMount","registerSlot","props","name","componentWillUnmount","unregisterSlot","componentDidUpdate","prevProps","node","forceUpdate","render","children","fillProps","getFills","fills","map","fill","fillChildren","Children","child","childIndex","childKey","key","filter","element","Slot"],"mappings":"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","sourcesContent":["// @ts-nocheck\n/**\n * WordPress dependencies\n */\nimport {\n\tChildren,\n\tComponent,\n\tcloneElement,\n\tisEmptyElement,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './context';\n\n/**\n * Whether the argument is a function.\n *\n * @param {*} maybeFunc The argument to check.\n * @return {boolean} True if the argument is a function, false otherwise.\n */\nfunction isFunction( maybeFunc ) {\n\treturn typeof maybeFunc === 'function';\n}\n\nclass SlotComponent extends Component {\n\tconstructor() {\n\t\tsuper( ...arguments );\n\n\t\tthis.isUnmounted = false;\n\t\tthis.bindNode = this.bindNode.bind( this );\n\t}\n\n\tcomponentDidMount() {\n\t\tconst { registerSlot } = this.props;\n\n\t\tregisterSlot( this.props.name, this );\n\t}\n\n\tcomponentWillUnmount() {\n\t\tconst { unregisterSlot } = this.props;\n\t\tthis.isUnmounted = true;\n\t\tunregisterSlot( this.props.name, this );\n\t}\n\n\tcomponentDidUpdate( prevProps ) {\n\t\tconst { name, unregisterSlot, registerSlot } = this.props;\n\n\t\tif ( prevProps.name !== name ) {\n\t\t\tunregisterSlot( prevProps.name );\n\t\t\tregisterSlot( name, this );\n\t\t}\n\t}\n\n\tbindNode( node ) {\n\t\tthis.node = node;\n\t}\n\n\tforceUpdate() {\n\t\tif ( this.isUnmounted ) {\n\t\t\treturn;\n\t\t}\n\t\tsuper.forceUpdate();\n\t}\n\n\trender() {\n\t\tconst { children, name, fillProps = {}, getFills } = this.props;\n\n\t\tconst fills = ( getFills( name, this ) ?? [] )\n\t\t\t.map( ( fill ) => {\n\t\t\t\tconst fillChildren = isFunction( fill.children )\n\t\t\t\t\t? fill.children( fillProps )\n\t\t\t\t\t: fill.children;\n\n\t\t\t\treturn Children.map( fillChildren, ( child, childIndex ) => {\n\t\t\t\t\tif ( ! child || typeof child === 'string' ) {\n\t\t\t\t\t\treturn child;\n\t\t\t\t\t}\n\n\t\t\t\t\tconst childKey = child.key || childIndex;\n\t\t\t\t\treturn cloneElement( child, { key: childKey } );\n\t\t\t\t} );\n\t\t\t} )\n\t\t\t.filter(\n\t\t\t\t// In some cases fills are rendered only when some conditions apply.\n\t\t\t\t// This ensures that we only use non-empty fills when rendering, i.e.,\n\t\t\t\t// it allows us to render wrappers only when the fills are actually present.\n\t\t\t\t( element ) => ! isEmptyElement( element )\n\t\t\t);\n\n\t\treturn <>{ isFunction( children ) ? children( fills ) : fills }</>;\n\t}\n}\n\nconst Slot = ( props ) => (\n\t<SlotFillContext.Consumer>\n\t\t{ ( { registerSlot, unregisterSlot, getFills } ) => (\n\t\t\t<SlotComponent\n\t\t\t\t{ ...props }\n\t\t\t\tregisterSlot={ registerSlot }\n\t\t\t\tunregisterSlot={ unregisterSlot }\n\t\t\t\tgetFills={ getFills }\n\t\t\t/>\n\t\t) }\n\t</SlotFillContext.Consumer>\n);\n\nexport default Slot;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/slot-fill/slot.js"],"names":["isFunction","maybeFunc","SlotComponent","Component","constructor","arguments","isUnmounted","bindNode","bind","componentDidMount","registerSlot","props","name","componentWillUnmount","unregisterSlot","componentDidUpdate","prevProps","node","forceUpdate","render","children","fillProps","getFills","fills","map","fill","fillChildren","Children","child","childIndex","childKey","key","filter","element","Slot"],"mappings":"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","sourcesContent":["// @ts-nocheck\n/**\n * WordPress dependencies\n */\nimport {\n\tChildren,\n\tComponent,\n\tcloneElement,\n\tisEmptyElement,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './context';\n\n/**\n * Whether the argument is a function.\n *\n * @param {*} maybeFunc The argument to check.\n * @return {boolean} True if the argument is a function, false otherwise.\n */\nfunction isFunction( maybeFunc ) {\n\treturn typeof maybeFunc === 'function';\n}\n\nclass SlotComponent extends Component {\n\tconstructor() {\n\t\tsuper( ...arguments );\n\n\t\tthis.isUnmounted = false;\n\t\tthis.bindNode = this.bindNode.bind( this );\n\t}\n\n\tcomponentDidMount() {\n\t\tconst { registerSlot } = this.props;\n\t\tthis.isUnmounted = false;\n\t\tregisterSlot( this.props.name, this );\n\t}\n\n\tcomponentWillUnmount() {\n\t\tconst { unregisterSlot } = this.props;\n\t\tthis.isUnmounted = true;\n\t\tunregisterSlot( this.props.name, this );\n\t}\n\n\tcomponentDidUpdate( prevProps ) {\n\t\tconst { name, unregisterSlot, registerSlot } = this.props;\n\n\t\tif ( prevProps.name !== name ) {\n\t\t\tunregisterSlot( prevProps.name );\n\t\t\tregisterSlot( name, this );\n\t\t}\n\t}\n\n\tbindNode( node ) {\n\t\tthis.node = node;\n\t}\n\n\tforceUpdate() {\n\t\tif ( this.isUnmounted ) {\n\t\t\treturn;\n\t\t}\n\t\tsuper.forceUpdate();\n\t}\n\n\trender() {\n\t\tconst { children, name, fillProps = {}, getFills } = this.props;\n\n\t\tconst fills = ( getFills( name, this ) ?? [] )\n\t\t\t.map( ( fill ) => {\n\t\t\t\tconst fillChildren = isFunction( fill.children )\n\t\t\t\t\t? fill.children( fillProps )\n\t\t\t\t\t: fill.children;\n\n\t\t\t\treturn Children.map( fillChildren, ( child, childIndex ) => {\n\t\t\t\t\tif ( ! child || typeof child === 'string' ) {\n\t\t\t\t\t\treturn child;\n\t\t\t\t\t}\n\n\t\t\t\t\tconst childKey = child.key || childIndex;\n\t\t\t\t\treturn cloneElement( child, { key: childKey } );\n\t\t\t\t} );\n\t\t\t} )\n\t\t\t.filter(\n\t\t\t\t// In some cases fills are rendered only when some conditions apply.\n\t\t\t\t// This ensures that we only use non-empty fills when rendering, i.e.,\n\t\t\t\t// it allows us to render wrappers only when the fills are actually present.\n\t\t\t\t( element ) => ! isEmptyElement( element )\n\t\t\t);\n\n\t\treturn <>{ isFunction( children ) ? children( fills ) : fills }</>;\n\t}\n}\n\nconst Slot = ( props ) => (\n\t<SlotFillContext.Consumer>\n\t\t{ ( { registerSlot, unregisterSlot, getFills } ) => (\n\t\t\t<SlotComponent\n\t\t\t\t{ ...props }\n\t\t\t\tregisterSlot={ registerSlot }\n\t\t\t\tunregisterSlot={ unregisterSlot }\n\t\t\t\tgetFills={ getFills }\n\t\t\t/>\n\t\t) }\n\t</SlotFillContext.Consumer>\n);\n\nexport default Slot;\n"]}
@@ -32,17 +32,7 @@ const useSlot = name => {
32
32
  getSlot,
33
33
  subscribe
34
34
  } = (0, _element.useContext)(_context.default);
35
- const [slot, setSlot] = (0, _element.useState)(getSlot(name));
36
- (0, _element.useEffect)(() => {
37
- setSlot(getSlot(name));
38
- const unsubscribe = subscribe(() => {
39
- setSlot(getSlot(name));
40
- });
41
- return unsubscribe; // Ignore reason: Modifying this dep array could introduce unexpected changes in behavior,
42
- // so we'll leave it as=is until the hook can be properly refactored for exhaustive-deps.
43
- // eslint-disable-next-line react-hooks/exhaustive-deps
44
- }, [name]);
45
- return slot;
35
+ return (0, _element.useSyncExternalStore)(subscribe, () => getSlot(name), () => getSlot(name));
46
36
  };
47
37
 
48
38
  var _default = useSlot;
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/slot-fill/use-slot.js"],"names":["useSlot","name","getSlot","subscribe","SlotFillContext","slot","setSlot","unsubscribe"],"mappings":";;;;;;;;;AAIA;;AAKA;;AATA;;AACA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMA,OAAO,GAAKC,IAAF,IAAY;AAC3B,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA;AAAX,MAAyB,yBAAYC,gBAAZ,CAA/B;AACA,QAAM,CAAEC,IAAF,EAAQC,OAAR,IAAoB,uBAAUJ,OAAO,CAAED,IAAF,CAAjB,CAA1B;AAEA,0BAAW,MAAM;AAChBK,IAAAA,OAAO,CAAEJ,OAAO,CAAED,IAAF,CAAT,CAAP;AACA,UAAMM,WAAW,GAAGJ,SAAS,CAAE,MAAM;AACpCG,MAAAA,OAAO,CAAEJ,OAAO,CAAED,IAAF,CAAT,CAAP;AACA,KAF4B,CAA7B;AAIA,WAAOM,WAAP,CANgB,CAOhB;AACA;AACA;AACA,GAVD,EAUG,CAAEN,IAAF,CAVH;AAYA,SAAOI,IAAP;AACA,CAjBD;;eAmBeL,O","sourcesContent":["// @ts-nocheck\n/**\n * WordPress dependencies\n */\nimport { useContext, useState, useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './context';\n\n/**\n * React hook returning the active slot given a name.\n *\n * @param {string} name Slot name.\n * @return {Object} Slot object.\n */\nconst useSlot = ( name ) => {\n\tconst { getSlot, subscribe } = useContext( SlotFillContext );\n\tconst [ slot, setSlot ] = useState( getSlot( name ) );\n\n\tuseEffect( () => {\n\t\tsetSlot( getSlot( name ) );\n\t\tconst unsubscribe = subscribe( () => {\n\t\t\tsetSlot( getSlot( name ) );\n\t\t} );\n\n\t\treturn unsubscribe;\n\t\t// Ignore reason: Modifying this dep array could introduce unexpected changes in behavior,\n\t\t// so we'll leave it as=is until the hook can be properly refactored for exhaustive-deps.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ name ] );\n\n\treturn slot;\n};\n\nexport default useSlot;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/slot-fill/use-slot.js"],"names":["useSlot","name","getSlot","subscribe","SlotFillContext"],"mappings":";;;;;;;;;AAIA;;AAKA;;AATA;;AACA;AACA;AACA;;AAGA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMA,OAAO,GAAKC,IAAF,IAAY;AAC3B,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA;AAAX,MAAyB,yBAAYC,gBAAZ,CAA/B;AACA,SAAO,mCACND,SADM,EAEN,MAAMD,OAAO,CAAED,IAAF,CAFP,EAGN,MAAMC,OAAO,CAAED,IAAF,CAHP,CAAP;AAKA,CAPD;;eASeD,O","sourcesContent":["// @ts-nocheck\n/**\n * WordPress dependencies\n */\nimport { useContext, useSyncExternalStore } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport SlotFillContext from './context';\n\n/**\n * React hook returning the active slot given a name.\n *\n * @param {string} name Slot name.\n * @return {Object} Slot object.\n */\nconst useSlot = ( name ) => {\n\tconst { getSlot, subscribe } = useContext( SlotFillContext );\n\treturn useSyncExternalStore(\n\t\tsubscribe,\n\t\t() => getSlot( name ),\n\t\t() => getSlot( name )\n\t);\n};\n\nexport default useSlot;\n"]}
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/snackbar/index.tsx"],"names":["NOTICE_TIMEOUT","useSpokenMessage","message","politeness","spokenMessage","UnforwardedSnackbar","ref","className","children","actions","onRemove","icon","explicitDismiss","onDismiss","listRef","dismissMe","event","preventDefault","current","focus","onActionClick","onClick","stopPropagation","timeoutHandle","setTimeout","clearTimeout","classes","length","snackbarContentClassnames","undefined","map","index","label","url","Snackbar"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef, KeyboardEvent, MouseEvent } from 'react';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { speak } from '@wordpress/a11y';\nimport { useEffect, forwardRef, renderToString } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport warning from '@wordpress/warning';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport type { NoticeAction, SnackbarProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nconst NOTICE_TIMEOUT = 10000;\n\n/**\n * Custom hook which announces the message with the given politeness, if a\n * valid message is provided.\n *\n * @param message Message to announce.\n * @param politeness Politeness to announce.\n */\nfunction useSpokenMessage(\n\tmessage: SnackbarProps[ 'spokenMessage' ],\n\tpoliteness: NonNullable< SnackbarProps[ 'politeness' ] >\n) {\n\tconst spokenMessage =\n\t\ttypeof message === 'string' ? message : renderToString( message );\n\n\tuseEffect( () => {\n\t\tif ( spokenMessage ) {\n\t\t\tspeak( spokenMessage, politeness );\n\t\t}\n\t}, [ spokenMessage, politeness ] );\n}\n\nfunction UnforwardedSnackbar(\n\t{\n\t\tclassName,\n\t\tchildren,\n\t\tspokenMessage = children,\n\t\tpoliteness = 'polite',\n\t\tactions = [],\n\t\tonRemove,\n\t\ticon = null,\n\t\texplicitDismiss = false,\n\t\t// onDismiss is a callback executed when the snackbar is dismissed.\n\t\t// It is distinct from onRemove, which _looks_ like a callback but is\n\t\t// actually the function to call to remove the snackbar from the UI.\n\t\tonDismiss,\n\t\tlistRef,\n\t}: WordPressComponentProps< SnackbarProps, 'div' >,\n\tref: ForwardedRef< any >\n) {\n\tfunction dismissMe( event: KeyboardEvent | MouseEvent ) {\n\t\tif ( event && event.preventDefault ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\n\t\t// Prevent focus loss by moving it to the list element.\n\t\tlistRef?.current?.focus();\n\n\t\tonDismiss?.();\n\t\tonRemove?.();\n\t}\n\n\tfunction onActionClick(\n\t\tevent: MouseEvent,\n\t\tonClick: NoticeAction[ 'onClick' ]\n\t) {\n\t\tevent.stopPropagation();\n\n\t\tonRemove?.();\n\n\t\tif ( onClick ) {\n\t\t\tonClick( event );\n\t\t}\n\t}\n\n\tuseSpokenMessage( spokenMessage, politeness );\n\n\t// Only set up the timeout dismiss if we're not explicitly dismissing.\n\tuseEffect( () => {\n\t\tconst timeoutHandle = setTimeout( () => {\n\t\t\tif ( ! explicitDismiss ) {\n\t\t\t\tonDismiss?.();\n\t\t\t\tonRemove?.();\n\t\t\t}\n\t\t}, NOTICE_TIMEOUT );\n\n\t\treturn () => clearTimeout( timeoutHandle );\n\t}, [ onDismiss, onRemove, explicitDismiss ] );\n\n\tconst classes = classnames( className, 'components-snackbar', {\n\t\t'components-snackbar-explicit-dismiss': !! explicitDismiss,\n\t} );\n\tif ( actions && actions.length > 1 ) {\n\t\t// We need to inform developers that snackbar only accepts 1 action.\n\t\twarning(\n\t\t\t'Snackbar can only have 1 action, use Notice if your message require many messages'\n\t\t);\n\t\t// return first element only while keeping it inside an array\n\t\tactions = [ actions[ 0 ] ];\n\t}\n\n\tconst snackbarContentClassnames = classnames(\n\t\t'components-snackbar__content',\n\t\t{\n\t\t\t'components-snackbar__content-with-icon': !! icon,\n\t\t}\n\t);\n\n\treturn (\n\t\t<div\n\t\t\tref={ ref }\n\t\t\tclassName={ classes }\n\t\t\tonClick={ ! explicitDismiss ? dismissMe : undefined }\n\t\t\ttabIndex={ 0 }\n\t\t\trole={ ! explicitDismiss ? 'button' : '' }\n\t\t\tonKeyPress={ ! explicitDismiss ? dismissMe : undefined }\n\t\t\taria-label={ ! explicitDismiss ? __( 'Dismiss this notice' ) : '' }\n\t\t>\n\t\t\t<div className={ snackbarContentClassnames }>\n\t\t\t\t{ icon && (\n\t\t\t\t\t<div className=\"components-snackbar__icon\">{ icon }</div>\n\t\t\t\t) }\n\t\t\t\t{ children }\n\t\t\t\t{ actions.map( ( { label, onClick, url }, index ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\thref={ url }\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tonClick={ ( event: MouseEvent ) =>\n\t\t\t\t\t\t\t\tonActionClick( event, onClick )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tclassName=\"components-snackbar__action\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t\t{ explicitDismiss && (\n\t\t\t\t\t<span\n\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\taria-label=\"Dismiss this notice\"\n\t\t\t\t\t\ttabIndex={ 0 }\n\t\t\t\t\t\tclassName=\"components-snackbar__dismiss-button\"\n\t\t\t\t\t\tonClick={ dismissMe }\n\t\t\t\t\t\tonKeyPress={ dismissMe }\n\t\t\t\t\t>\n\t\t\t\t\t\t&#x2715;\n\t\t\t\t\t</span>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\n/**\n * A Snackbar displays a succinct message that is cleared out after a small delay.\n *\n * It can also offer the user options, like viewing a published post.\n * But these options should also be available elsewhere in the UI.\n *\n * ```jsx\n * const MySnackbarNotice = () => (\n * <Snackbar>Post published successfully.</Snackbar>\n * );\n * ```\n */\nexport const Snackbar = forwardRef( UnforwardedSnackbar );\n\nexport default Snackbar;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/snackbar/index.tsx"],"names":["NOTICE_TIMEOUT","useSpokenMessage","message","politeness","spokenMessage","UnforwardedSnackbar","ref","className","children","actions","onRemove","icon","explicitDismiss","onDismiss","listRef","dismissMe","event","preventDefault","current","focus","onActionClick","onClick","stopPropagation","timeoutHandle","setTimeout","clearTimeout","classes","length","snackbarContentClassnames","undefined","map","index","label","url","Snackbar"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef, KeyboardEvent, MouseEvent } from 'react';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { speak } from '@wordpress/a11y';\nimport { useEffect, forwardRef, renderToString } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport warning from '@wordpress/warning';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport type { SnackbarProps } from './types';\nimport type { NoticeAction } from '../notice/types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nconst NOTICE_TIMEOUT = 10000;\n\n/**\n * Custom hook which announces the message with the given politeness, if a\n * valid message is provided.\n *\n * @param message Message to announce.\n * @param politeness Politeness to announce.\n */\nfunction useSpokenMessage(\n\tmessage: SnackbarProps[ 'spokenMessage' ],\n\tpoliteness: NonNullable< SnackbarProps[ 'politeness' ] >\n) {\n\tconst spokenMessage =\n\t\ttypeof message === 'string' ? message : renderToString( message );\n\n\tuseEffect( () => {\n\t\tif ( spokenMessage ) {\n\t\t\tspeak( spokenMessage, politeness );\n\t\t}\n\t}, [ spokenMessage, politeness ] );\n}\n\nfunction UnforwardedSnackbar(\n\t{\n\t\tclassName,\n\t\tchildren,\n\t\tspokenMessage = children,\n\t\tpoliteness = 'polite',\n\t\tactions = [],\n\t\tonRemove,\n\t\ticon = null,\n\t\texplicitDismiss = false,\n\t\t// onDismiss is a callback executed when the snackbar is dismissed.\n\t\t// It is distinct from onRemove, which _looks_ like a callback but is\n\t\t// actually the function to call to remove the snackbar from the UI.\n\t\tonDismiss,\n\t\tlistRef,\n\t}: WordPressComponentProps< SnackbarProps, 'div' >,\n\tref: ForwardedRef< any >\n) {\n\tfunction dismissMe( event: KeyboardEvent | MouseEvent ) {\n\t\tif ( event && event.preventDefault ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\n\t\t// Prevent focus loss by moving it to the list element.\n\t\tlistRef?.current?.focus();\n\n\t\tonDismiss?.();\n\t\tonRemove?.();\n\t}\n\n\tfunction onActionClick(\n\t\tevent: MouseEvent< HTMLButtonElement >,\n\t\tonClick: NoticeAction[ 'onClick' ]\n\t) {\n\t\tevent.stopPropagation();\n\n\t\tonRemove?.();\n\n\t\tif ( onClick ) {\n\t\t\tonClick( event );\n\t\t}\n\t}\n\n\tuseSpokenMessage( spokenMessage, politeness );\n\n\t// Only set up the timeout dismiss if we're not explicitly dismissing.\n\tuseEffect( () => {\n\t\tconst timeoutHandle = setTimeout( () => {\n\t\t\tif ( ! explicitDismiss ) {\n\t\t\t\tonDismiss?.();\n\t\t\t\tonRemove?.();\n\t\t\t}\n\t\t}, NOTICE_TIMEOUT );\n\n\t\treturn () => clearTimeout( timeoutHandle );\n\t}, [ onDismiss, onRemove, explicitDismiss ] );\n\n\tconst classes = classnames( className, 'components-snackbar', {\n\t\t'components-snackbar-explicit-dismiss': !! explicitDismiss,\n\t} );\n\tif ( actions && actions.length > 1 ) {\n\t\t// We need to inform developers that snackbar only accepts 1 action.\n\t\twarning(\n\t\t\t'Snackbar can only have 1 action, use Notice if your message require many messages'\n\t\t);\n\t\t// return first element only while keeping it inside an array\n\t\tactions = [ actions[ 0 ] ];\n\t}\n\n\tconst snackbarContentClassnames = classnames(\n\t\t'components-snackbar__content',\n\t\t{\n\t\t\t'components-snackbar__content-with-icon': !! icon,\n\t\t}\n\t);\n\n\treturn (\n\t\t<div\n\t\t\tref={ ref }\n\t\t\tclassName={ classes }\n\t\t\tonClick={ ! explicitDismiss ? dismissMe : undefined }\n\t\t\ttabIndex={ 0 }\n\t\t\trole={ ! explicitDismiss ? 'button' : '' }\n\t\t\tonKeyPress={ ! explicitDismiss ? dismissMe : undefined }\n\t\t\taria-label={ ! explicitDismiss ? __( 'Dismiss this notice' ) : '' }\n\t\t>\n\t\t\t<div className={ snackbarContentClassnames }>\n\t\t\t\t{ icon && (\n\t\t\t\t\t<div className=\"components-snackbar__icon\">{ icon }</div>\n\t\t\t\t) }\n\t\t\t\t{ children }\n\t\t\t\t{ actions.map( ( { label, onClick, url }, index ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\thref={ url }\n\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\tonClick={ (\n\t\t\t\t\t\t\t\tevent: MouseEvent< HTMLButtonElement >\n\t\t\t\t\t\t\t) => onActionClick( event, onClick ) }\n\t\t\t\t\t\t\tclassName=\"components-snackbar__action\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t\t{ explicitDismiss && (\n\t\t\t\t\t<span\n\t\t\t\t\t\trole=\"button\"\n\t\t\t\t\t\taria-label=\"Dismiss this notice\"\n\t\t\t\t\t\ttabIndex={ 0 }\n\t\t\t\t\t\tclassName=\"components-snackbar__dismiss-button\"\n\t\t\t\t\t\tonClick={ dismissMe }\n\t\t\t\t\t\tonKeyPress={ dismissMe }\n\t\t\t\t\t>\n\t\t\t\t\t\t&#x2715;\n\t\t\t\t\t</span>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\n/**\n * A Snackbar displays a succinct message that is cleared out after a small delay.\n *\n * It can also offer the user options, like viewing a published post.\n * But these options should also be available elsewhere in the UI.\n *\n * ```jsx\n * const MySnackbarNotice = () => (\n * <Snackbar>Post published successfully.</Snackbar>\n * );\n * ```\n */\nexport const Snackbar = forwardRef( UnforwardedSnackbar );\n\nexport default Snackbar;\n"]}
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/snackbar/list.tsx"],"names":["SNACKBAR_VARIANTS","init","height","opacity","open","transition","stiffness","velocity","exit","duration","SnackbarList","notices","className","children","onRemove","listRef","isReducedMotion","removeNotice","notice","id","map","content","restNotice","undefined"],"mappings":";;;;;;;;;;AASA;;;;AANA;;AAKA;;AAMA;;AACA;;AAfA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AASA,MAAMA,iBAAiB,GAAG;AACzBC,EAAAA,IAAI,EAAE;AACLC,IAAAA,MAAM,EAAE,CADH;AAELC,IAAAA,OAAO,EAAE;AAFJ,GADmB;AAKzBC,EAAAA,IAAI,EAAE;AACLF,IAAAA,MAAM,EAAE,MADH;AAELC,IAAAA,OAAO,EAAE,CAFJ;AAGLE,IAAAA,UAAU,EAAE;AACXH,MAAAA,MAAM,EAAE;AAAEI,QAAAA,SAAS,EAAE,IAAb;AAAmBC,QAAAA,QAAQ,EAAE,CAAC;AAA9B;AADG;AAHP,GALmB;AAYzBC,EAAAA,IAAI,EAAE;AACLL,IAAAA,OAAO,EAAE,CADJ;AAELE,IAAAA,UAAU,EAAE;AACXI,MAAAA,QAAQ,EAAE;AADC;AAFP;AAZmB,CAA1B;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACO,SAASC,YAAT,OAKkD;AAAA,MAL3B;AAC7BC,IAAAA,OAD6B;AAE7BC,IAAAA,SAF6B;AAG7BC,IAAAA,QAH6B;AAI7BC,IAAAA;AAJ6B,GAK2B;AACxD,QAAMC,OAAO,GAAG,qBAAiC,IAAjC,CAAhB;AACA,QAAMC,eAAe,GAAG,gCAAxB;AACAJ,EAAAA,SAAS,GAAG,yBAAY,0BAAZ,EAAwCA,SAAxC,CAAZ;;AACA,QAAMK,YAAY,GAAKC,MAAF,IAAsB,MAAMJ,QAAN,aAAMA,QAAN,uBAAMA,QAAQ,CAAII,MAAM,CAACC,EAAX,CAAzD;;AACA,SACC;AAAK,IAAA,SAAS,EAAGP,SAAjB;AAA6B,IAAA,QAAQ,EAAG,CAAC,CAAzC;AAA6C,IAAA,GAAG,EAAGG;AAAnD,KACGF,QADH,EAEC,4BAAC,oCAAD,QACGF,OAAO,CAACS,GAAR,CAAeF,MAAF,IAAc;AAC5B,UAAM;AAAEG,MAAAA,OAAF;AAAW,SAAGC;AAAd,QAA6BJ,MAAnC;AAEA,WACC,4BAAC,2BAAD,CAAQ,GAAR;AACC,MAAA,MAAM,EAAG,CAAEF,eADZ,CAC8B;AAD9B;AAEC,MAAA,OAAO,EAAG,MAFX;AAGC,MAAA,OAAO,EAAG,MAHX;AAIC,MAAA,IAAI,EAAG,MAJR;AAKC,MAAA,GAAG,EAAGE,MAAM,CAACC,EALd;AAMC,MAAA,QAAQ,EACPH,eAAe,GAAGO,SAAH,GAAevB;AAPhC,OAUC;AAAK,MAAA,SAAS,EAAC;AAAf,OACC,4BAAC,SAAD,6BACMsB,UADN;AAEC,MAAA,QAAQ,EAAGL,YAAY,CAAEC,MAAF,CAFxB;AAGC,MAAA,OAAO,EAAGH;AAHX,QAKGG,MAAM,CAACG,OALV,CADD,CAVD,CADD;AAsBA,GAzBC,CADH,CAFD,CADD;AAiCA;;eAEcX,Y","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useReducedMotion } from '@wordpress/compose';\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Snackbar from '.';\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '../animation';\nimport type { Notice, SnackbarListProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nconst SNACKBAR_VARIANTS = {\n\tinit: {\n\t\theight: 0,\n\t\topacity: 0,\n\t},\n\topen: {\n\t\theight: 'auto',\n\t\topacity: 1,\n\t\ttransition: {\n\t\t\theight: { stiffness: 1000, velocity: -100 },\n\t\t},\n\t},\n\texit: {\n\t\topacity: 0,\n\t\ttransition: {\n\t\t\tduration: 0.5,\n\t\t},\n\t},\n};\n\n/**\n * Renders a list of notices.\n *\n * ```jsx\n * const MySnackbarListNotice = () => (\n * <SnackbarList\n * notices={ notices }\n * onRemove={ removeNotice }\n * />\n * );\n * ```\n */\nexport function SnackbarList( {\n\tnotices,\n\tclassName,\n\tchildren,\n\tonRemove,\n}: WordPressComponentProps< SnackbarListProps, 'div' > ) {\n\tconst listRef = useRef< HTMLDivElement | null >( null );\n\tconst isReducedMotion = useReducedMotion();\n\tclassName = classnames( 'components-snackbar-list', className );\n\tconst removeNotice = ( notice: Notice ) => () => onRemove?.( notice.id );\n\treturn (\n\t\t<div className={ className } tabIndex={ -1 } ref={ listRef }>\n\t\t\t{ children }\n\t\t\t<AnimatePresence>\n\t\t\t\t{ notices.map( ( notice ) => {\n\t\t\t\t\tconst { content, ...restNotice } = notice;\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tlayout={ ! isReducedMotion } // See https://www.framer.com/docs/animation/#layout-animations\n\t\t\t\t\t\t\tinitial={ 'init' }\n\t\t\t\t\t\t\tanimate={ 'open' }\n\t\t\t\t\t\t\texit={ 'exit' }\n\t\t\t\t\t\t\tkey={ notice.id }\n\t\t\t\t\t\t\tvariants={\n\t\t\t\t\t\t\t\tisReducedMotion ? undefined : SNACKBAR_VARIANTS\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div className=\"components-snackbar-list__notice-container\">\n\t\t\t\t\t\t\t\t<Snackbar\n\t\t\t\t\t\t\t\t\t{ ...restNotice }\n\t\t\t\t\t\t\t\t\tonRemove={ removeNotice( notice ) }\n\t\t\t\t\t\t\t\t\tlistRef={ listRef }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ notice.content }\n\t\t\t\t\t\t\t\t</Snackbar>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t</AnimatePresence>\n\t\t</div>\n\t);\n}\n\nexport default SnackbarList;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/snackbar/list.tsx"],"names":["SNACKBAR_VARIANTS","init","height","opacity","open","transition","stiffness","velocity","exit","duration","SnackbarList","notices","className","children","onRemove","listRef","isReducedMotion","removeNotice","notice","id","map","content","restNotice","undefined"],"mappings":";;;;;;;;;;AASA;;;;AANA;;AAKA;;AAMA;;AACA;;AAfA;AACA;AACA;;AAGA;AACA;AACA;;AAIA;AACA;AACA;AASA,MAAMA,iBAAiB,GAAG;AACzBC,EAAAA,IAAI,EAAE;AACLC,IAAAA,MAAM,EAAE,CADH;AAELC,IAAAA,OAAO,EAAE;AAFJ,GADmB;AAKzBC,EAAAA,IAAI,EAAE;AACLF,IAAAA,MAAM,EAAE,MADH;AAELC,IAAAA,OAAO,EAAE,CAFJ;AAGLE,IAAAA,UAAU,EAAE;AACXH,MAAAA,MAAM,EAAE;AAAEI,QAAAA,SAAS,EAAE,IAAb;AAAmBC,QAAAA,QAAQ,EAAE,CAAC;AAA9B;AADG;AAHP,GALmB;AAYzBC,EAAAA,IAAI,EAAE;AACLL,IAAAA,OAAO,EAAE,CADJ;AAELE,IAAAA,UAAU,EAAE;AACXI,MAAAA,QAAQ,EAAE;AADC;AAFP;AAZmB,CAA1B;AAoBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACO,SAASC,YAAT,OAKkD;AAAA,MAL3B;AAC7BC,IAAAA,OAD6B;AAE7BC,IAAAA,SAF6B;AAG7BC,IAAAA,QAH6B;AAI7BC,IAAAA;AAJ6B,GAK2B;AACxD,QAAMC,OAAO,GAAG,qBAAiC,IAAjC,CAAhB;AACA,QAAMC,eAAe,GAAG,gCAAxB;AACAJ,EAAAA,SAAS,GAAG,yBAAY,0BAAZ,EAAwCA,SAAxC,CAAZ;;AACA,QAAMK,YAAY,GACfC,MAAF,IAAwD,MACvDJ,QADuD,aACvDA,QADuD,uBACvDA,QAAQ,CAAII,MAAM,CAACC,EAAX,CAFV;;AAGA,SACC;AAAK,IAAA,SAAS,EAAGP,SAAjB;AAA6B,IAAA,QAAQ,EAAG,CAAC,CAAzC;AAA6C,IAAA,GAAG,EAAGG;AAAnD,KACGF,QADH,EAEC,4BAAC,oCAAD,QACGF,OAAO,CAACS,GAAR,CAAeF,MAAF,IAAc;AAC5B,UAAM;AAAEG,MAAAA,OAAF;AAAW,SAAGC;AAAd,QAA6BJ,MAAnC;AAEA,WACC,4BAAC,2BAAD,CAAQ,GAAR;AACC,MAAA,MAAM,EAAG,CAAEF,eADZ,CAC8B;AAD9B;AAEC,MAAA,OAAO,EAAG,MAFX;AAGC,MAAA,OAAO,EAAG,MAHX;AAIC,MAAA,IAAI,EAAG,MAJR;AAKC,MAAA,GAAG,EAAGE,MAAM,CAACC,EALd;AAMC,MAAA,QAAQ,EACPH,eAAe,GAAGO,SAAH,GAAevB;AAPhC,OAUC;AAAK,MAAA,SAAS,EAAC;AAAf,OACC,4BAAC,SAAD,6BACMsB,UADN;AAEC,MAAA,QAAQ,EAAGL,YAAY,CAAEC,MAAF,CAFxB;AAGC,MAAA,OAAO,EAAGH;AAHX,QAKGG,MAAM,CAACG,OALV,CADD,CAVD,CADD;AAsBA,GAzBC,CADH,CAFD,CADD;AAiCA;;eAEcX,Y","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useReducedMotion } from '@wordpress/compose';\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Snackbar from '.';\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '../animation';\nimport type { SnackbarListProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nconst SNACKBAR_VARIANTS = {\n\tinit: {\n\t\theight: 0,\n\t\topacity: 0,\n\t},\n\topen: {\n\t\theight: 'auto',\n\t\topacity: 1,\n\t\ttransition: {\n\t\t\theight: { stiffness: 1000, velocity: -100 },\n\t\t},\n\t},\n\texit: {\n\t\topacity: 0,\n\t\ttransition: {\n\t\t\tduration: 0.5,\n\t\t},\n\t},\n};\n\n/**\n * Renders a list of notices.\n *\n * ```jsx\n * const MySnackbarListNotice = () => (\n * <SnackbarList\n * notices={ notices }\n * onRemove={ removeNotice }\n * />\n * );\n * ```\n */\nexport function SnackbarList( {\n\tnotices,\n\tclassName,\n\tchildren,\n\tonRemove,\n}: WordPressComponentProps< SnackbarListProps, 'div' > ) {\n\tconst listRef = useRef< HTMLDivElement | null >( null );\n\tconst isReducedMotion = useReducedMotion();\n\tclassName = classnames( 'components-snackbar-list', className );\n\tconst removeNotice =\n\t\t( notice: SnackbarListProps[ 'notices' ][ number ] ) => () =>\n\t\t\tonRemove?.( notice.id );\n\treturn (\n\t\t<div className={ className } tabIndex={ -1 } ref={ listRef }>\n\t\t\t{ children }\n\t\t\t<AnimatePresence>\n\t\t\t\t{ notices.map( ( notice ) => {\n\t\t\t\t\tconst { content, ...restNotice } = notice;\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tlayout={ ! isReducedMotion } // See https://www.framer.com/docs/animation/#layout-animations\n\t\t\t\t\t\t\tinitial={ 'init' }\n\t\t\t\t\t\t\tanimate={ 'open' }\n\t\t\t\t\t\t\texit={ 'exit' }\n\t\t\t\t\t\t\tkey={ notice.id }\n\t\t\t\t\t\t\tvariants={\n\t\t\t\t\t\t\t\tisReducedMotion ? undefined : SNACKBAR_VARIANTS\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<div className=\"components-snackbar-list__notice-container\">\n\t\t\t\t\t\t\t\t<Snackbar\n\t\t\t\t\t\t\t\t\t{ ...restNotice }\n\t\t\t\t\t\t\t\t\tonRemove={ removeNotice( notice ) }\n\t\t\t\t\t\t\t\t\tlistRef={ listRef }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ notice.content }\n\t\t\t\t\t\t\t\t</Snackbar>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t</AnimatePresence>\n\t\t</div>\n\t);\n}\n\nexport default SnackbarList;\n"]}
@@ -34,17 +34,16 @@ var _button = _interopRequireDefault(require("../button"));
34
34
  const TabButton = _ref => {
35
35
  let {
36
36
  tabId,
37
- onClick,
38
37
  children,
39
38
  selected,
40
39
  ...rest
41
40
  } = _ref;
42
41
  return (0, _element.createElement)(_button.default, (0, _extends2.default)({
43
42
  role: "tab",
44
- tabIndex: selected ? null : -1,
43
+ tabIndex: selected ? undefined : -1,
45
44
  "aria-selected": selected,
46
45
  id: tabId,
47
- onClick: onClick
46
+ __experimentalIsFocusable: true
48
47
  }, rest), children);
49
48
  };
50
49
  /**
@@ -116,12 +115,45 @@ function TabPanel(_ref2) {
116
115
  } = _ref3;
117
116
  return name === selected;
118
117
  });
119
- const selectedId = `${instanceId}-${(_selectedTab$name = selectedTab === null || selectedTab === void 0 ? void 0 : selectedTab.name) !== null && _selectedTab$name !== void 0 ? _selectedTab$name : 'none'}`;
118
+ const selectedId = `${instanceId}-${(_selectedTab$name = selectedTab === null || selectedTab === void 0 ? void 0 : selectedTab.name) !== null && _selectedTab$name !== void 0 ? _selectedTab$name : 'none'}`; // Handle selecting the initial tab.
119
+
120
+ (0, _element.useEffect)(() => {
121
+ // If there's a selected tab, don't override it.
122
+ if (selectedTab) {
123
+ return;
124
+ }
125
+
126
+ const initialTab = tabs.find(tab => tab.name === initialTabName); // Wait for the denoted initial tab to be declared before making a
127
+ // selection. This ensures that if a tab is declared lazily it can
128
+ // still receive initial selection.
129
+
130
+ if (initialTabName && !initialTab) {
131
+ return;
132
+ }
133
+
134
+ if (initialTab && !initialTab.disabled) {
135
+ // Select the initial tab if it's not disabled.
136
+ handleTabSelection(initialTab.name);
137
+ } else {
138
+ // Fallback to the first enabled tab when the initial is disabled.
139
+ const firstEnabledTab = tabs.find(tab => !tab.disabled);
140
+ if (firstEnabledTab) handleTabSelection(firstEnabledTab.name);
141
+ }
142
+ }, [tabs, selectedTab, initialTabName, handleTabSelection]); // Handle the currently selected tab becoming disabled.
143
+
120
144
  (0, _element.useEffect)(() => {
121
- if (!(selectedTab !== null && selectedTab !== void 0 && selectedTab.name) && tabs.length > 0) {
122
- handleTabSelection(initialTabName || tabs[0].name);
145
+ // This effect only runs when the selected tab is defined and becomes disabled.
146
+ if (!(selectedTab !== null && selectedTab !== void 0 && selectedTab.disabled)) {
147
+ return;
148
+ }
149
+
150
+ const firstEnabledTab = tabs.find(tab => !tab.disabled); // If the currently selected tab becomes disabled, select the first enabled tab.
151
+ // (if there is one).
152
+
153
+ if (firstEnabledTab) {
154
+ handleTabSelection(firstEnabledTab.name);
123
155
  }
124
- }, [tabs, selectedTab === null || selectedTab === void 0 ? void 0 : selectedTab.name, initialTabName, handleTabSelection]);
156
+ }, [tabs, selectedTab === null || selectedTab === void 0 ? void 0 : selectedTab.disabled, handleTabSelection]);
125
157
  return (0, _element.createElement)("div", {
126
158
  className: className
127
159
  }, (0, _element.createElement)(_navigableContainer.NavigableMenu, {
@@ -138,6 +170,7 @@ function TabPanel(_ref2) {
138
170
  selected: tab.name === selected,
139
171
  key: tab.name,
140
172
  onClick: () => handleTabSelection(tab.name),
173
+ disabled: tab.disabled,
141
174
  label: tab.icon && tab.title,
142
175
  icon: tab.icon,
143
176
  showTooltip: !!tab.icon