@wordpress/components 23.3.2 → 23.4.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 (710) hide show
  1. package/CHANGELOG.md +20 -5
  2. package/build/alignment-matrix-control/utils.js +4 -4
  3. package/build/alignment-matrix-control/utils.js.map +1 -1
  4. package/build/angle-picker-control/angle-circle.js +37 -29
  5. package/build/angle-picker-control/angle-circle.js.map +1 -1
  6. package/build/angle-picker-control/index.js +44 -9
  7. package/build/angle-picker-control/index.js.map +1 -1
  8. package/build/angle-picker-control/styles/angle-picker-control-styles.js +13 -13
  9. package/build/angle-picker-control/styles/angle-picker-control-styles.js.map +1 -1
  10. package/build/{base-field → angle-picker-control}/types.js +0 -0
  11. package/build/angle-picker-control/types.js.map +1 -0
  12. package/build/autocomplete/autocompleter-ui.native.js +1 -0
  13. package/build/autocomplete/autocompleter-ui.native.js.map +1 -1
  14. package/build/base-control/hooks.js +1 -1
  15. package/build/base-control/hooks.js.map +1 -1
  16. package/build/border-box-control/utils.js +1 -1
  17. package/build/border-box-control/utils.js.map +1 -1
  18. package/build/box-control/all-input-control.js +2 -2
  19. package/build/box-control/all-input-control.js.map +1 -1
  20. package/build/box-control/axial-input-controls.js +1 -1
  21. package/build/box-control/axial-input-controls.js.map +1 -1
  22. package/build/box-control/icon.js.map +1 -1
  23. package/build/box-control/index.js +32 -3
  24. package/build/box-control/index.js.map +1 -1
  25. package/build/box-control/input-controls.js +5 -5
  26. package/build/box-control/input-controls.js.map +1 -1
  27. package/build/box-control/linked-button.js.map +1 -1
  28. package/build/box-control/styles/box-control-icon-styles.js +28 -28
  29. package/build/box-control/styles/box-control-icon-styles.js.map +1 -1
  30. package/build/box-control/styles/box-control-styles.js +23 -23
  31. package/build/box-control/styles/box-control-styles.js.map +1 -1
  32. package/build/box-control/styles/box-control-visualizer-styles.js +19 -19
  33. package/build/box-control/styles/box-control-visualizer-styles.js.map +1 -1
  34. package/build/box-control/types.js +6 -0
  35. package/build/box-control/types.js.map +1 -0
  36. package/build/box-control/unit-control.js.map +1 -1
  37. package/build/box-control/utils.js +23 -23
  38. package/build/box-control/utils.js.map +1 -1
  39. package/build/color-palette/index.js +8 -3
  40. package/build/color-palette/index.js.map +1 -1
  41. package/build/combobox-control/index.js +68 -12
  42. package/build/combobox-control/index.js.map +1 -1
  43. package/build/combobox-control/styles.js +2 -2
  44. package/build/combobox-control/styles.js.map +1 -1
  45. package/build/combobox-control/types.js +6 -0
  46. package/build/combobox-control/types.js.map +1 -0
  47. package/build/custom-gradient-picker/index.js +0 -1
  48. package/build/custom-gradient-picker/index.js.map +1 -1
  49. package/build/date-time/time/index.js +1 -1
  50. package/build/date-time/time/index.js.map +1 -1
  51. package/build/date-time/utils.js +1 -1
  52. package/build/date-time/utils.js.map +1 -1
  53. package/build/draggable/index.js +2 -2
  54. package/build/draggable/index.js.map +1 -1
  55. package/build/focal-point-picker/utils.js +3 -3
  56. package/build/focal-point-picker/utils.js.map +1 -1
  57. package/build/font-size-picker/utils.js +2 -2
  58. package/build/font-size-picker/utils.js.map +1 -1
  59. package/build/gradient-picker/index.js +9 -4
  60. package/build/gradient-picker/index.js.map +1 -1
  61. package/build/input-control/reducer/reducer.js +5 -5
  62. package/build/input-control/reducer/reducer.js.map +1 -1
  63. package/build/input-control/utils.js +1 -1
  64. package/build/input-control/utils.js.map +1 -1
  65. package/build/menu-items-choice/index.js +40 -3
  66. package/build/menu-items-choice/index.js.map +1 -1
  67. package/build/menu-items-choice/types.js +6 -0
  68. package/build/menu-items-choice/types.js.map +1 -0
  69. package/build/modal/index.js +41 -3
  70. package/build/modal/index.js.map +1 -1
  71. package/build/palette-edit/index.js +4 -1
  72. package/build/palette-edit/index.js.map +1 -1
  73. package/build/panel/header.js +9 -0
  74. package/build/panel/header.js.map +1 -1
  75. package/build/panel/index.js +21 -3
  76. package/build/panel/index.js.map +1 -1
  77. package/build/panel/row.js +10 -4
  78. package/build/panel/row.js.map +1 -1
  79. package/build/panel/types.js +6 -0
  80. package/build/panel/types.js.map +1 -0
  81. package/build/popover/index.js +15 -3
  82. package/build/popover/index.js.map +1 -1
  83. package/build/popover/overlay-middlewares.js +46 -0
  84. package/build/popover/overlay-middlewares.js.map +1 -0
  85. package/build/popover/utils.js +45 -6
  86. package/build/popover/utils.js.map +1 -1
  87. package/build/query-controls/terms.js +1 -1
  88. package/build/query-controls/terms.js.map +1 -1
  89. package/build/range-control/utils.js +4 -4
  90. package/build/range-control/utils.js.map +1 -1
  91. package/build/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js +12 -12
  92. package/build/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js.map +1 -1
  93. package/build/resizable-box/resize-tooltip/utils.js +14 -14
  94. package/build/resizable-box/resize-tooltip/utils.js.map +1 -1
  95. package/build/snackbar/index.js +2 -2
  96. package/build/snackbar/index.js.map +1 -1
  97. package/build/toolbar/toolbar/index.js +25 -14
  98. package/build/toolbar/toolbar/index.js.map +1 -1
  99. package/build/toolbar/toolbar/toolbar-container.js +5 -4
  100. package/build/toolbar/toolbar/toolbar-container.js.map +1 -1
  101. package/build/toolbar/toolbar/types.js +6 -0
  102. package/build/toolbar/toolbar/types.js.map +1 -0
  103. package/build/toolbar/toolbar-button/index.js +2 -0
  104. package/build/toolbar/toolbar-button/index.js.map +1 -1
  105. package/build/toolbar/toolbar-button/toolbar-button-container.js +1 -0
  106. package/build/toolbar/toolbar-button/toolbar-button-container.js.map +1 -1
  107. package/build/toolbar/toolbar-context/index.js +2 -0
  108. package/build/toolbar/toolbar-context/index.js.map +1 -1
  109. package/build/toolbar/toolbar-dropdown-menu/index.js +2 -0
  110. package/build/toolbar/toolbar-dropdown-menu/index.js.map +1 -1
  111. package/build/toolbar/toolbar-group/index.js +2 -0
  112. package/build/toolbar/toolbar-group/index.js.map +1 -1
  113. package/build/toolbar/toolbar-group/toolbar-group-collapsed.js +2 -0
  114. package/build/toolbar/toolbar-group/toolbar-group-collapsed.js.map +1 -1
  115. package/build/toolbar/toolbar-group/toolbar-group-container.js +1 -0
  116. package/build/toolbar/toolbar-group/toolbar-group-container.js.map +1 -1
  117. package/build/toolbar/toolbar-item/index.js +2 -0
  118. package/build/toolbar/toolbar-item/index.js.map +1 -1
  119. package/build/tools-panel/tools-panel/component.js +61 -5
  120. package/build/tools-panel/tools-panel/component.js.map +1 -1
  121. package/build/tools-panel/tools-panel/hook.js +4 -2
  122. package/build/tools-panel/tools-panel/hook.js.map +1 -1
  123. package/build/tools-panel/tools-panel-header/component.js +2 -1
  124. package/build/tools-panel/tools-panel-header/component.js.map +1 -1
  125. package/build/tools-panel/tools-panel-header/hook.js +2 -0
  126. package/build/tools-panel/tools-panel-header/hook.js.map +1 -1
  127. package/build/tools-panel/tools-panel-item/component.js +5 -4
  128. package/build/tools-panel/tools-panel-item/component.js.map +1 -1
  129. package/build/tools-panel/tools-panel-item/hook.js +4 -2
  130. package/build/tools-panel/tools-panel-item/hook.js.map +1 -1
  131. package/build/tree-grid/cell.js +15 -4
  132. package/build/tree-grid/cell.js.map +1 -1
  133. package/build/tree-grid/index.js +81 -19
  134. package/build/tree-grid/index.js.map +1 -1
  135. package/build/tree-grid/item.js +14 -3
  136. package/build/tree-grid/item.js.map +1 -1
  137. package/build/tree-grid/roving-tab-index-context.js +1 -1
  138. package/build/tree-grid/roving-tab-index-context.js.map +1 -1
  139. package/build/tree-grid/roving-tab-index-item.js +13 -6
  140. package/build/tree-grid/roving-tab-index-item.js.map +1 -1
  141. package/build/tree-grid/roving-tab-index.js +0 -3
  142. package/build/tree-grid/roving-tab-index.js.map +1 -1
  143. package/build/tree-grid/row.js +20 -18
  144. package/build/tree-grid/row.js.map +1 -1
  145. package/build/tree-grid/types.js +6 -0
  146. package/build/tree-grid/types.js.map +1 -0
  147. package/build/ui/context/context-connect.js +7 -7
  148. package/build/ui/context/context-connect.js.map +1 -1
  149. package/build/ui/context/get-styled-class-name-from-key.js +1 -1
  150. package/build/ui/context/get-styled-class-name-from-key.js.map +1 -1
  151. package/build/ui/utils/get-valid-children.js +1 -1
  152. package/build/ui/utils/get-valid-children.js.map +1 -1
  153. package/build/ui/utils/space.js +1 -1
  154. package/build/ui/utils/space.js.map +1 -1
  155. package/build/unit-control/index.js +2 -2
  156. package/build/unit-control/index.js.map +1 -1
  157. package/build/unit-control/utils.js +20 -20
  158. package/build/unit-control/utils.js.map +1 -1
  159. package/build/utils/events.js +4 -4
  160. package/build/utils/events.js.map +1 -1
  161. package/build/utils/hooks/use-controlled-state.js +2 -2
  162. package/build/utils/hooks/use-controlled-state.js.map +1 -1
  163. package/build/utils/hooks/use-controlled-value.js +4 -4
  164. package/build/utils/hooks/use-controlled-value.js.map +1 -1
  165. package/build/utils/hooks/use-latest-ref.js +1 -1
  166. package/build/utils/hooks/use-latest-ref.js.map +1 -1
  167. package/build/utils/unit-values.js +3 -3
  168. package/build/utils/unit-values.js.map +1 -1
  169. package/build-module/alignment-matrix-control/utils.js +4 -4
  170. package/build-module/alignment-matrix-control/utils.js.map +1 -1
  171. package/build-module/angle-picker-control/angle-circle.js +37 -29
  172. package/build-module/angle-picker-control/angle-circle.js.map +1 -1
  173. package/build-module/angle-picker-control/index.js +42 -8
  174. package/build-module/angle-picker-control/index.js.map +1 -1
  175. package/build-module/angle-picker-control/styles/angle-picker-control-styles.js +13 -13
  176. package/build-module/angle-picker-control/styles/angle-picker-control-styles.js.map +1 -1
  177. package/build-module/{base-field → angle-picker-control}/types.js +0 -0
  178. package/build-module/{base-field → angle-picker-control}/types.js.map +0 -0
  179. package/build-module/autocomplete/autocompleter-ui.native.js +1 -0
  180. package/build-module/autocomplete/autocompleter-ui.native.js.map +1 -1
  181. package/build-module/base-control/hooks.js +1 -1
  182. package/build-module/base-control/hooks.js.map +1 -1
  183. package/build-module/border-box-control/utils.js +1 -1
  184. package/build-module/border-box-control/utils.js.map +1 -1
  185. package/build-module/box-control/all-input-control.js +2 -2
  186. package/build-module/box-control/all-input-control.js.map +1 -1
  187. package/build-module/box-control/axial-input-controls.js +1 -1
  188. package/build-module/box-control/axial-input-controls.js.map +1 -1
  189. package/build-module/box-control/icon.js.map +1 -1
  190. package/build-module/box-control/index.js +31 -3
  191. package/build-module/box-control/index.js.map +1 -1
  192. package/build-module/box-control/input-controls.js +5 -5
  193. package/build-module/box-control/input-controls.js.map +1 -1
  194. package/build-module/box-control/linked-button.js.map +1 -1
  195. package/build-module/box-control/styles/box-control-icon-styles.js +28 -28
  196. package/build-module/box-control/styles/box-control-icon-styles.js.map +1 -1
  197. package/build-module/box-control/styles/box-control-styles.js +23 -23
  198. package/build-module/box-control/styles/box-control-styles.js.map +1 -1
  199. package/build-module/box-control/styles/box-control-visualizer-styles.js +19 -19
  200. package/build-module/box-control/styles/box-control-visualizer-styles.js.map +1 -1
  201. package/build-module/box-control/types.js +2 -0
  202. package/{build/base-field → build-module/box-control}/types.js.map +0 -0
  203. package/build-module/box-control/unit-control.js.map +1 -1
  204. package/build-module/box-control/utils.js +23 -23
  205. package/build-module/box-control/utils.js.map +1 -1
  206. package/build-module/color-palette/index.js +8 -3
  207. package/build-module/color-palette/index.js.map +1 -1
  208. package/build-module/combobox-control/index.js +68 -12
  209. package/build-module/combobox-control/index.js.map +1 -1
  210. package/build-module/combobox-control/styles.js +2 -2
  211. package/build-module/combobox-control/styles.js.map +1 -1
  212. package/build-module/combobox-control/types.js +2 -0
  213. package/build-module/{resizable-box/styles/resizable-box.styles.js.map → combobox-control/types.js.map} +0 -0
  214. package/build-module/custom-gradient-picker/index.js +0 -1
  215. package/build-module/custom-gradient-picker/index.js.map +1 -1
  216. package/build-module/date-time/time/index.js +1 -1
  217. package/build-module/date-time/time/index.js.map +1 -1
  218. package/build-module/date-time/utils.js +1 -1
  219. package/build-module/date-time/utils.js.map +1 -1
  220. package/build-module/draggable/index.js +2 -2
  221. package/build-module/draggable/index.js.map +1 -1
  222. package/build-module/focal-point-picker/utils.js +3 -3
  223. package/build-module/focal-point-picker/utils.js.map +1 -1
  224. package/build-module/font-size-picker/utils.js +2 -2
  225. package/build-module/font-size-picker/utils.js.map +1 -1
  226. package/build-module/gradient-picker/index.js +9 -4
  227. package/build-module/gradient-picker/index.js.map +1 -1
  228. package/build-module/input-control/reducer/reducer.js +5 -5
  229. package/build-module/input-control/reducer/reducer.js.map +1 -1
  230. package/build-module/input-control/utils.js +1 -1
  231. package/build-module/input-control/utils.js.map +1 -1
  232. package/build-module/menu-items-choice/index.js +40 -4
  233. package/build-module/menu-items-choice/index.js.map +1 -1
  234. package/build-module/menu-items-choice/types.js +2 -0
  235. package/{build/resizable-box/styles/resizable-box.styles.js.map → build-module/menu-items-choice/types.js.map} +0 -0
  236. package/build-module/modal/index.js +41 -4
  237. package/build-module/modal/index.js.map +1 -1
  238. package/build-module/palette-edit/index.js +4 -1
  239. package/build-module/palette-edit/index.js.map +1 -1
  240. package/build-module/panel/header.js +9 -0
  241. package/build-module/panel/header.js.map +1 -1
  242. package/build-module/panel/index.js +20 -2
  243. package/build-module/panel/index.js.map +1 -1
  244. package/build-module/panel/row.js +9 -3
  245. package/build-module/panel/row.js.map +1 -1
  246. package/build-module/panel/types.js +2 -0
  247. package/build-module/panel/types.js.map +1 -0
  248. package/build-module/popover/index.js +14 -4
  249. package/build-module/popover/index.js.map +1 -1
  250. package/build-module/popover/overlay-middlewares.js +38 -0
  251. package/build-module/popover/overlay-middlewares.js.map +1 -0
  252. package/build-module/popover/utils.js +41 -5
  253. package/build-module/popover/utils.js.map +1 -1
  254. package/build-module/query-controls/terms.js +1 -1
  255. package/build-module/query-controls/terms.js.map +1 -1
  256. package/build-module/range-control/utils.js +4 -4
  257. package/build-module/range-control/utils.js.map +1 -1
  258. package/build-module/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js +12 -12
  259. package/build-module/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js.map +1 -1
  260. package/build-module/resizable-box/resize-tooltip/utils.js +14 -14
  261. package/build-module/resizable-box/resize-tooltip/utils.js.map +1 -1
  262. package/build-module/snackbar/index.js +2 -2
  263. package/build-module/snackbar/index.js.map +1 -1
  264. package/build-module/toolbar/toolbar/index.js +25 -13
  265. package/build-module/toolbar/toolbar/index.js.map +1 -1
  266. package/build-module/toolbar/toolbar/toolbar-container.js +4 -3
  267. package/build-module/toolbar/toolbar/toolbar-container.js.map +1 -1
  268. package/build-module/toolbar/toolbar/types.js +2 -0
  269. package/build-module/toolbar/toolbar/types.js.map +1 -0
  270. package/build-module/toolbar/toolbar-button/index.js +1 -0
  271. package/build-module/toolbar/toolbar-button/index.js.map +1 -1
  272. package/build-module/toolbar/toolbar-button/toolbar-button-container.js +1 -0
  273. package/build-module/toolbar/toolbar-button/toolbar-button-container.js.map +1 -1
  274. package/build-module/toolbar/toolbar-context/index.js +2 -0
  275. package/build-module/toolbar/toolbar-context/index.js.map +1 -1
  276. package/build-module/toolbar/toolbar-dropdown-menu/index.js +1 -0
  277. package/build-module/toolbar/toolbar-dropdown-menu/index.js.map +1 -1
  278. package/build-module/toolbar/toolbar-group/index.js +1 -0
  279. package/build-module/toolbar/toolbar-group/index.js.map +1 -1
  280. package/build-module/toolbar/toolbar-group/toolbar-group-collapsed.js +1 -0
  281. package/build-module/toolbar/toolbar-group/toolbar-group-collapsed.js.map +1 -1
  282. package/build-module/toolbar/toolbar-group/toolbar-group-container.js +1 -0
  283. package/build-module/toolbar/toolbar-group/toolbar-group-container.js.map +1 -1
  284. package/build-module/toolbar/toolbar-item/index.js +1 -0
  285. package/build-module/toolbar/toolbar-item/index.js.map +1 -1
  286. package/build-module/tools-panel/tools-panel/component.js +59 -4
  287. package/build-module/tools-panel/tools-panel/component.js.map +1 -1
  288. package/build-module/tools-panel/tools-panel/hook.js +4 -2
  289. package/build-module/tools-panel/tools-panel/hook.js.map +1 -1
  290. package/build-module/tools-panel/tools-panel-header/component.js +2 -1
  291. package/build-module/tools-panel/tools-panel-header/component.js.map +1 -1
  292. package/build-module/tools-panel/tools-panel-header/hook.js +2 -0
  293. package/build-module/tools-panel/tools-panel-header/hook.js.map +1 -1
  294. package/build-module/tools-panel/tools-panel-item/component.js +3 -3
  295. package/build-module/tools-panel/tools-panel-item/component.js.map +1 -1
  296. package/build-module/tools-panel/tools-panel-item/hook.js +5 -2
  297. package/build-module/tools-panel/tools-panel-item/hook.js.map +1 -1
  298. package/build-module/tree-grid/cell.js +16 -4
  299. package/build-module/tree-grid/cell.js.map +1 -1
  300. package/build-module/tree-grid/index.js +81 -21
  301. package/build-module/tree-grid/index.js.map +1 -1
  302. package/build-module/tree-grid/item.js +14 -2
  303. package/build-module/tree-grid/item.js.map +1 -1
  304. package/build-module/tree-grid/roving-tab-index-context.js +1 -1
  305. package/build-module/tree-grid/roving-tab-index-context.js.map +1 -1
  306. package/build-module/tree-grid/roving-tab-index-item.js +11 -4
  307. package/build-module/tree-grid/roving-tab-index-item.js.map +1 -1
  308. package/build-module/tree-grid/roving-tab-index.js +0 -3
  309. package/build-module/tree-grid/roving-tab-index.js.map +1 -1
  310. package/build-module/tree-grid/row.js +22 -17
  311. package/build-module/tree-grid/row.js.map +1 -1
  312. package/build-module/tree-grid/types.js +2 -0
  313. package/build-module/tree-grid/types.js.map +1 -0
  314. package/build-module/ui/context/context-connect.js +7 -7
  315. package/build-module/ui/context/context-connect.js.map +1 -1
  316. package/build-module/ui/context/get-styled-class-name-from-key.js +1 -1
  317. package/build-module/ui/context/get-styled-class-name-from-key.js.map +1 -1
  318. package/build-module/ui/utils/get-valid-children.js +1 -1
  319. package/build-module/ui/utils/get-valid-children.js.map +1 -1
  320. package/build-module/ui/utils/space.js +1 -1
  321. package/build-module/ui/utils/space.js.map +1 -1
  322. package/build-module/unit-control/index.js +2 -2
  323. package/build-module/unit-control/index.js.map +1 -1
  324. package/build-module/unit-control/utils.js +20 -20
  325. package/build-module/unit-control/utils.js.map +1 -1
  326. package/build-module/utils/events.js +4 -4
  327. package/build-module/utils/events.js.map +1 -1
  328. package/build-module/utils/hooks/use-controlled-state.js +2 -2
  329. package/build-module/utils/hooks/use-controlled-state.js.map +1 -1
  330. package/build-module/utils/hooks/use-controlled-value.js +4 -4
  331. package/build-module/utils/hooks/use-controlled-value.js.map +1 -1
  332. package/build-module/utils/hooks/use-latest-ref.js +1 -1
  333. package/build-module/utils/hooks/use-latest-ref.js.map +1 -1
  334. package/build-module/utils/unit-values.js +3 -3
  335. package/build-module/utils/unit-values.js.map +1 -1
  336. package/build-style/style-rtl.css +5 -0
  337. package/build-style/style.css +5 -0
  338. package/build-types/alignment-matrix-control/utils.d.ts +4 -4
  339. package/build-types/angle-picker-control/angle-circle.d.ts +6 -0
  340. package/build-types/angle-picker-control/angle-circle.d.ts.map +1 -0
  341. package/build-types/angle-picker-control/index.d.ts +29 -0
  342. package/build-types/angle-picker-control/index.d.ts.map +1 -0
  343. package/build-types/angle-picker-control/stories/index.d.ts +15 -0
  344. package/build-types/angle-picker-control/stories/index.d.ts.map +1 -0
  345. package/build-types/angle-picker-control/styles/angle-picker-control-styles.d.ts +20 -0
  346. package/build-types/angle-picker-control/styles/angle-picker-control-styles.d.ts.map +1 -0
  347. package/build-types/angle-picker-control/types.d.ts +26 -0
  348. package/build-types/angle-picker-control/types.d.ts.map +1 -0
  349. package/build-types/base-control/hooks.d.ts +1 -1
  350. package/build-types/border-box-control/border-box-control/component.d.ts +1 -1
  351. package/build-types/border-box-control/border-box-control/hook.d.ts +1 -1
  352. package/build-types/border-box-control/border-box-control-split-controls/component.d.ts +1 -1
  353. package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts +1 -1
  354. package/build-types/border-box-control/stories/index.d.ts +1 -1
  355. package/build-types/{base-field → border-box-control}/test/index.d.ts +0 -0
  356. package/build-types/border-box-control/test/index.d.ts.map +1 -0
  357. package/build-types/border-box-control/test/utils.d.ts +2 -0
  358. package/build-types/border-box-control/test/utils.d.ts.map +1 -0
  359. package/build-types/box-control/all-input-control.d.ts +4 -0
  360. package/build-types/box-control/all-input-control.d.ts.map +1 -0
  361. package/build-types/box-control/axial-input-controls.d.ts +4 -0
  362. package/build-types/box-control/axial-input-controls.d.ts.map +1 -0
  363. package/build-types/box-control/icon.d.ts +8 -0
  364. package/build-types/box-control/icon.d.ts.map +1 -0
  365. package/build-types/box-control/index.d.ts +31 -0
  366. package/build-types/box-control/index.d.ts.map +1 -0
  367. package/build-types/box-control/input-controls.d.ts +4 -0
  368. package/build-types/box-control/input-controls.d.ts.map +1 -0
  369. package/build-types/box-control/linked-button.d.ts +9 -0
  370. package/build-types/box-control/linked-button.d.ts.map +1 -0
  371. package/build-types/box-control/styles/box-control-icon-styles.d.ts +42 -0
  372. package/build-types/box-control/styles/box-control-icon-styles.d.ts.map +1 -0
  373. package/build-types/box-control/styles/box-control-styles.d.ts +42 -0
  374. package/build-types/box-control/styles/box-control-styles.d.ts.map +1 -0
  375. package/build-types/box-control/styles/box-control-visualizer-styles.d.ts +46 -0
  376. package/build-types/box-control/styles/box-control-visualizer-styles.d.ts.map +1 -0
  377. package/build-types/box-control/test/index.d.ts +2 -0
  378. package/build-types/box-control/test/index.d.ts.map +1 -0
  379. package/build-types/box-control/types.d.ts +99 -0
  380. package/build-types/box-control/types.d.ts.map +1 -0
  381. package/build-types/box-control/unit-control.d.ts +4 -0
  382. package/build-types/box-control/unit-control.d.ts.map +1 -0
  383. package/build-types/box-control/utils.d.ts +84 -0
  384. package/build-types/box-control/utils.d.ts.map +1 -0
  385. package/build-types/color-palette/index.d.ts +3 -1
  386. package/build-types/color-palette/index.d.ts.map +1 -1
  387. package/build-types/color-palette/stories/index.d.ts +6 -2
  388. package/build-types/color-palette/stories/index.d.ts.map +1 -1
  389. package/build-types/color-palette/types.d.ts +8 -0
  390. package/build-types/color-palette/types.d.ts.map +1 -1
  391. package/build-types/combobox-control/index.d.ts +51 -0
  392. package/build-types/combobox-control/index.d.ts.map +1 -0
  393. package/build-types/combobox-control/stories/index.d.ts +18 -0
  394. package/build-types/combobox-control/stories/index.d.ts.map +1 -0
  395. package/build-types/combobox-control/styles.d.ts +8 -0
  396. package/build-types/combobox-control/styles.d.ts.map +1 -0
  397. package/build-types/combobox-control/test/index.d.ts +2 -0
  398. package/build-types/combobox-control/test/index.d.ts.map +1 -0
  399. package/build-types/combobox-control/types.d.ts +62 -0
  400. package/build-types/combobox-control/types.d.ts.map +1 -0
  401. package/build-types/date-time/utils.d.ts +1 -1
  402. package/build-types/focal-point-picker/styles/focal-point-picker-style.d.ts +1 -1
  403. package/build-types/focal-point-picker/utils.d.ts +3 -3
  404. package/build-types/font-size-picker/utils.d.ts +2 -2
  405. package/build-types/input-control/reducer/reducer.d.ts +3 -3
  406. package/build-types/input-control/utils.d.ts +1 -1
  407. package/build-types/menu-items-choice/index.d.ts +38 -0
  408. package/build-types/menu-items-choice/index.d.ts.map +1 -0
  409. package/build-types/menu-items-choice/stories/index.d.ts +12 -0
  410. package/build-types/menu-items-choice/stories/index.d.ts.map +1 -0
  411. package/build-types/menu-items-choice/types.d.ts +53 -0
  412. package/build-types/menu-items-choice/types.d.ts.map +1 -0
  413. package/build-types/modal/index.d.ts.map +1 -1
  414. package/build-types/modal/types.d.ts +2 -0
  415. package/build-types/modal/types.d.ts.map +1 -1
  416. package/build-types/panel/header.d.ts +13 -0
  417. package/build-types/panel/header.d.ts.map +1 -0
  418. package/build-types/panel/index.d.ts +21 -0
  419. package/build-types/panel/index.d.ts.map +1 -0
  420. package/build-types/panel/row.d.ts +12 -0
  421. package/build-types/panel/row.d.ts.map +1 -0
  422. package/build-types/panel/test/header.d.ts +2 -0
  423. package/build-types/panel/test/header.d.ts.map +1 -0
  424. package/build-types/panel/test/index.d.ts +2 -0
  425. package/build-types/{base-field → panel}/test/index.d.ts.map +1 -1
  426. package/build-types/panel/test/row.d.ts +2 -0
  427. package/build-types/panel/test/row.d.ts.map +1 -0
  428. package/build-types/panel/types.d.ts +38 -0
  429. package/build-types/panel/types.d.ts.map +1 -0
  430. package/build-types/popover/index.d.ts.map +1 -1
  431. package/build-types/popover/overlay-middlewares.d.ts +9 -0
  432. package/build-types/popover/overlay-middlewares.d.ts.map +1 -0
  433. package/build-types/popover/stories/index.d.ts.map +1 -1
  434. package/build-types/popover/types.d.ts +3 -2
  435. package/build-types/popover/types.d.ts.map +1 -1
  436. package/build-types/popover/utils.d.ts +12 -4
  437. package/build-types/popover/utils.d.ts.map +1 -1
  438. package/build-types/query-controls/terms.d.ts +1 -1
  439. package/build-types/range-control/utils.d.ts +4 -4
  440. package/build-types/resizable-box/resize-tooltip/styles/resize-tooltip.styles.d.ts +5 -4
  441. package/build-types/resizable-box/resize-tooltip/styles/resize-tooltip.styles.d.ts.map +1 -1
  442. package/build-types/resizable-box/resize-tooltip/utils.d.ts +6 -6
  443. package/build-types/toolbar/index.d.ts +7 -0
  444. package/build-types/toolbar/index.d.ts.map +1 -0
  445. package/build-types/toolbar/stories/index.d.ts +14 -0
  446. package/build-types/toolbar/stories/index.d.ts.map +1 -0
  447. package/build-types/toolbar/test/index.d.ts +2 -0
  448. package/build-types/toolbar/test/index.d.ts.map +1 -0
  449. package/build-types/toolbar/test/toolbar-group.d.ts +2 -0
  450. package/build-types/toolbar/test/toolbar-group.d.ts.map +1 -0
  451. package/build-types/toolbar/toolbar/index.d.ts +25 -0
  452. package/build-types/toolbar/toolbar/index.d.ts.map +1 -0
  453. package/build-types/toolbar/toolbar/toolbar-container.d.ts +5 -0
  454. package/build-types/toolbar/toolbar/toolbar-container.d.ts.map +1 -0
  455. package/build-types/toolbar/toolbar/types.d.ts +15 -0
  456. package/build-types/toolbar/toolbar/types.d.ts.map +1 -0
  457. package/build-types/toolbar/toolbar-button/index.d.ts +12 -0
  458. package/build-types/toolbar/toolbar-button/index.d.ts.map +1 -0
  459. package/build-types/toolbar/toolbar-button/toolbar-button-container.d.ts +3 -0
  460. package/build-types/toolbar/toolbar-button/toolbar-button-container.d.ts.map +1 -0
  461. package/build-types/toolbar/toolbar-context/index.d.ts +3 -0
  462. package/build-types/toolbar/toolbar-context/index.d.ts.map +1 -0
  463. package/build-types/toolbar/toolbar-dropdown-menu/index.d.ts +3 -0
  464. package/build-types/toolbar/toolbar-dropdown-menu/index.d.ts.map +1 -0
  465. package/build-types/toolbar/toolbar-group/index.d.ts +39 -0
  466. package/build-types/toolbar/toolbar-group/index.d.ts.map +1 -0
  467. package/build-types/toolbar/toolbar-group/toolbar-group-collapsed.d.ts +7 -0
  468. package/build-types/toolbar/toolbar-group/toolbar-group-collapsed.d.ts.map +1 -0
  469. package/build-types/toolbar/toolbar-group/toolbar-group-container.d.ts +7 -0
  470. package/build-types/toolbar/toolbar-group/toolbar-group-container.d.ts.map +1 -0
  471. package/build-types/toolbar/toolbar-item/index.d.ts +7 -0
  472. package/build-types/toolbar/toolbar-item/index.d.ts.map +1 -0
  473. package/build-types/tools-panel/stories/index.d.ts +17 -0
  474. package/build-types/tools-panel/stories/index.d.ts.map +1 -0
  475. package/build-types/tools-panel/tools-panel/component.d.ts +54 -2
  476. package/build-types/tools-panel/tools-panel/component.d.ts.map +1 -1
  477. package/build-types/tools-panel/tools-panel/hook.d.ts +2 -1
  478. package/build-types/tools-panel/tools-panel/hook.d.ts.map +1 -1
  479. package/build-types/tools-panel/tools-panel-header/component.d.ts.map +1 -1
  480. package/build-types/tools-panel/tools-panel-header/hook.d.ts +2 -1
  481. package/build-types/tools-panel/tools-panel-header/hook.d.ts.map +1 -1
  482. package/build-types/tools-panel/tools-panel-item/component.d.ts +2 -2
  483. package/build-types/tools-panel/tools-panel-item/component.d.ts.map +1 -1
  484. package/build-types/tools-panel/tools-panel-item/hook.d.ts.map +1 -1
  485. package/build-types/tools-panel/types.d.ts +42 -15
  486. package/build-types/tools-panel/types.d.ts.map +1 -1
  487. package/build-types/tree-grid/cell.d.ts +13 -0
  488. package/build-types/tree-grid/cell.d.ts.map +1 -0
  489. package/build-types/tree-grid/index.d.ts +70 -0
  490. package/build-types/tree-grid/index.d.ts.map +1 -0
  491. package/build-types/tree-grid/item.d.ts +12 -0
  492. package/build-types/tree-grid/item.d.ts.map +1 -0
  493. package/build-types/tree-grid/roving-tab-index-context.d.ts +10 -0
  494. package/build-types/tree-grid/roving-tab-index-context.d.ts.map +1 -0
  495. package/build-types/tree-grid/roving-tab-index-item.d.ts +5 -0
  496. package/build-types/tree-grid/roving-tab-index-item.d.ts.map +1 -0
  497. package/build-types/tree-grid/roving-tab-index.d.ts +10 -0
  498. package/build-types/tree-grid/roving-tab-index.d.ts.map +1 -0
  499. package/build-types/tree-grid/row.d.ts +12 -0
  500. package/build-types/tree-grid/row.d.ts.map +1 -0
  501. package/build-types/tree-grid/stories/index.d.ts +13 -0
  502. package/build-types/tree-grid/stories/index.d.ts.map +1 -0
  503. package/build-types/tree-grid/test/cell.d.ts +2 -0
  504. package/build-types/tree-grid/test/cell.d.ts.map +1 -0
  505. package/build-types/tree-grid/test/index.d.ts +2 -0
  506. package/build-types/tree-grid/test/index.d.ts.map +1 -0
  507. package/build-types/tree-grid/test/roving-tab-index-item.d.ts +2 -0
  508. package/build-types/tree-grid/test/roving-tab-index-item.d.ts.map +1 -0
  509. package/build-types/tree-grid/test/roving-tab-index.d.ts +2 -0
  510. package/build-types/tree-grid/test/roving-tab-index.d.ts.map +1 -0
  511. package/build-types/tree-grid/test/row.d.ts +2 -0
  512. package/build-types/tree-grid/test/row.d.ts.map +1 -0
  513. package/build-types/tree-grid/types.d.ts +109 -0
  514. package/build-types/tree-grid/types.d.ts.map +1 -0
  515. package/build-types/ui/context/context-connect.d.ts +7 -7
  516. package/build-types/ui/context/get-styled-class-name-from-key.d.ts +1 -1
  517. package/build-types/ui/utils/get-valid-children.d.ts +1 -1
  518. package/build-types/ui/utils/space.d.ts +1 -1
  519. package/build-types/unit-control/index.d.ts +1 -1
  520. package/build-types/unit-control/utils.d.ts +20 -20
  521. package/build-types/utils/events.d.ts +2 -2
  522. package/build-types/utils/hooks/use-controlled-state.d.ts +1 -1
  523. package/build-types/utils/hooks/use-controlled-state.d.ts.map +1 -1
  524. package/build-types/utils/hooks/use-controlled-value.d.ts +4 -4
  525. package/build-types/utils/hooks/use-latest-ref.d.ts +1 -1
  526. package/build-types/utils/unit-values.d.ts +3 -3
  527. package/package.json +19 -19
  528. package/src/alignment-matrix-control/utils.tsx +4 -4
  529. package/src/angle-picker-control/README.md +17 -14
  530. package/src/angle-picker-control/{angle-circle.js → angle-circle.tsx} +44 -12
  531. package/src/angle-picker-control/{index.js → index.tsx} +54 -10
  532. package/src/angle-picker-control/stories/index.tsx +57 -0
  533. package/src/angle-picker-control/styles/{angle-picker-control-styles.js → angle-picker-control-styles.tsx} +5 -1
  534. package/src/angle-picker-control/types.ts +29 -0
  535. package/src/autocomplete/autocompleter-ui.native.js +1 -0
  536. package/src/base-control/hooks.ts +1 -1
  537. package/src/border-box-control/test/{index.js → index.tsx} +76 -102
  538. package/src/border-box-control/test/{utils.js → utils.ts} +20 -0
  539. package/src/border-box-control/utils.ts +1 -1
  540. package/src/box-control/README.md +17 -26
  541. package/src/box-control/{all-input-control.js → all-input-control.tsx} +10 -6
  542. package/src/box-control/{axial-input-controls.js → axial-input-controls.tsx} +29 -24
  543. package/src/box-control/{icon.js → icon.tsx} +9 -4
  544. package/src/box-control/{index.js → index.tsx} +43 -8
  545. package/src/box-control/{input-controls.js → input-controls.tsx} +26 -16
  546. package/src/box-control/{linked-button.js → linked-button.tsx} +4 -1
  547. package/src/box-control/styles/{box-control-icon-styles.js → box-control-icon-styles.ts} +1 -1
  548. package/src/box-control/styles/{box-control-styles.js → box-control-styles.ts} +10 -2
  549. package/src/box-control/styles/{box-control-visualizer-styles.js → box-control-visualizer-styles.ts} +6 -2
  550. package/src/box-control/test/{index.js → index.tsx} +12 -9
  551. package/src/box-control/types.ts +121 -0
  552. package/src/box-control/{unit-control.js → unit-control.tsx} +9 -2
  553. package/src/box-control/{utils.js → utils.ts} +47 -38
  554. package/src/button/test/index.tsx +38 -30
  555. package/src/color-palette/README.md +7 -0
  556. package/src/color-palette/index.tsx +6 -1
  557. package/src/color-palette/types.ts +8 -0
  558. package/src/combobox-control/README.md +8 -15
  559. package/src/combobox-control/{index.js → index.tsx} +91 -19
  560. package/src/combobox-control/stories/index.tsx +114 -0
  561. package/src/combobox-control/styles.ts +4 -1
  562. package/src/combobox-control/test/{index.js → index.tsx} +9 -7
  563. package/src/combobox-control/types.ts +69 -0
  564. package/src/custom-gradient-picker/index.js +0 -1
  565. package/src/custom-select-control/stories/index.js +1 -1
  566. package/src/date-time/time/index.tsx +1 -1
  567. package/src/date-time/utils.ts +1 -1
  568. package/src/draggable/index.tsx +2 -2
  569. package/src/dropdown-menu/test/index.js +3 -11
  570. package/src/focal-point-picker/utils.ts +3 -3
  571. package/src/font-size-picker/utils.ts +2 -2
  572. package/src/gradient-picker/README.md +8 -0
  573. package/src/gradient-picker/index.js +6 -1
  574. package/src/input-control/reducer/reducer.ts +5 -5
  575. package/src/input-control/utils.ts +1 -1
  576. package/src/menu-items-choice/index.tsx +83 -0
  577. package/src/menu-items-choice/stories/index.tsx +79 -0
  578. package/src/menu-items-choice/types.ts +54 -0
  579. package/src/modal/index.tsx +45 -1
  580. package/src/modal/style.scss +8 -0
  581. package/src/modal/types.ts +2 -0
  582. package/src/palette-edit/index.js +4 -1
  583. package/src/panel/README.md +2 -2
  584. package/src/panel/header.tsx +20 -0
  585. package/src/panel/index.tsx +48 -0
  586. package/src/panel/row.tsx +37 -0
  587. package/src/panel/stories/index.js +22 -0
  588. package/src/panel/test/__snapshots__/{header.js.snap → header.tsx.snap} +0 -0
  589. package/src/panel/test/__snapshots__/{index.js.snap → index.tsx.snap} +0 -0
  590. package/src/panel/test/__snapshots__/{row.js.snap → row.tsx.snap} +0 -0
  591. package/src/panel/test/{header.js → header.tsx} +1 -1
  592. package/src/panel/test/{index.js → index.tsx} +6 -4
  593. package/src/panel/test/{row.js → row.tsx} +4 -2
  594. package/src/panel/types.ts +38 -0
  595. package/src/popover/README.md +4 -1
  596. package/src/popover/index.tsx +17 -1
  597. package/src/popover/overlay-middlewares.tsx +29 -0
  598. package/src/popover/stories/index.tsx +7 -1
  599. package/src/popover/test/index.tsx +29 -21
  600. package/src/popover/types.ts +4 -2
  601. package/src/popover/utils.ts +39 -3
  602. package/src/query-controls/terms.ts +1 -1
  603. package/src/range-control/utils.ts +4 -4
  604. package/src/resizable-box/resize-tooltip/styles/{resize-tooltip.styles.js → resize-tooltip.styles.ts} +0 -0
  605. package/src/resizable-box/resize-tooltip/utils.ts +14 -14
  606. package/src/snackbar/index.tsx +2 -2
  607. package/src/toolbar/stories/{index.js → index.tsx} +39 -26
  608. package/src/toolbar/test/{index.js → index.tsx} +0 -0
  609. package/src/toolbar/test/{toolbar-group.js → toolbar-group.tsx} +2 -2
  610. package/src/toolbar/toolbar/README.md +7 -2
  611. package/src/toolbar/toolbar/{index.js → index.tsx} +33 -12
  612. package/src/toolbar/toolbar/{toolbar-container.js → toolbar-container.tsx} +9 -2
  613. package/src/toolbar/toolbar/types.ts +15 -0
  614. package/src/toolbar/toolbar-button/index.js +2 -0
  615. package/src/toolbar/toolbar-button/toolbar-button-container.js +2 -0
  616. package/src/toolbar/toolbar-context/index.js +2 -0
  617. package/src/toolbar/toolbar-dropdown-menu/index.js +2 -0
  618. package/src/toolbar/toolbar-group/index.js +2 -0
  619. package/src/toolbar/toolbar-group/toolbar-group-collapsed.js +2 -0
  620. package/src/toolbar/toolbar-group/toolbar-group-container.js +2 -0
  621. package/src/toolbar/toolbar-item/index.js +2 -0
  622. package/src/tools-panel/stories/{index.js → index.tsx} +196 -95
  623. package/src/tools-panel/test/index.js +6 -6
  624. package/src/tools-panel/tools-panel/README.md +12 -4
  625. package/src/tools-panel/tools-panel/component.tsx +57 -3
  626. package/src/tools-panel/tools-panel/hook.ts +4 -2
  627. package/src/tools-panel/tools-panel-header/README.md +7 -0
  628. package/src/tools-panel/tools-panel-header/component.tsx +2 -1
  629. package/src/tools-panel/tools-panel-header/hook.ts +6 -4
  630. package/src/tools-panel/tools-panel-item/README.md +6 -4
  631. package/src/tools-panel/tools-panel-item/component.tsx +4 -4
  632. package/src/tools-panel/tools-panel-item/hook.ts +4 -2
  633. package/src/tools-panel/types.ts +43 -15
  634. package/src/tree-grid/README.md +18 -58
  635. package/src/tree-grid/cell.tsx +41 -0
  636. package/src/tree-grid/{index.js → index.tsx} +111 -35
  637. package/src/tree-grid/item.tsx +32 -0
  638. package/src/tree-grid/{roving-tab-index-context.js → roving-tab-index-context.ts} +9 -1
  639. package/src/tree-grid/roving-tab-index-item.tsx +50 -0
  640. package/src/tree-grid/{roving-tab-index.js → roving-tab-index.tsx} +7 -5
  641. package/src/tree-grid/row.tsx +47 -0
  642. package/src/tree-grid/stories/index.tsx +144 -0
  643. package/src/tree-grid/test/__snapshots__/{cell.js.snap → cell.tsx.snap} +0 -0
  644. package/src/tree-grid/test/__snapshots__/{index.js.snap → index.tsx.snap} +0 -0
  645. package/src/tree-grid/test/__snapshots__/{roving-tab-index-item.js.snap → roving-tab-index-item.tsx.snap} +0 -0
  646. package/src/tree-grid/test/__snapshots__/{roving-tab-index.js.snap → roving-tab-index.tsx.snap} +0 -0
  647. package/src/tree-grid/test/__snapshots__/{row.js.snap → row.tsx.snap} +0 -0
  648. package/src/tree-grid/test/{cell.js → cell.tsx} +7 -4
  649. package/src/tree-grid/test/{index.js → index.tsx} +13 -5
  650. package/src/tree-grid/test/{roving-tab-index-item.js → roving-tab-index-item.tsx} +7 -4
  651. package/src/tree-grid/test/{roving-tab-index.js → roving-tab-index.tsx} +0 -0
  652. package/src/tree-grid/test/{row.js → row.tsx} +4 -4
  653. package/src/tree-grid/types.ts +116 -0
  654. package/src/ui/context/context-connect.ts +7 -7
  655. package/src/ui/context/get-styled-class-name-from-key.ts +1 -1
  656. package/src/ui/utils/get-valid-children.ts +1 -1
  657. package/src/ui/utils/space.ts +1 -1
  658. package/src/unit-control/index.tsx +2 -2
  659. package/src/unit-control/utils.ts +20 -20
  660. package/src/utils/events.ts +4 -4
  661. package/src/utils/hooks/use-controlled-state.js +2 -2
  662. package/src/utils/hooks/use-controlled-value.ts +4 -4
  663. package/src/utils/hooks/use-latest-ref.ts +1 -1
  664. package/src/utils/unit-values.ts +3 -3
  665. package/tsconfig.json +1 -7
  666. package/tsconfig.tsbuildinfo +1 -1
  667. package/build/base-field/hook.js +0 -54
  668. package/build/base-field/hook.js.map +0 -1
  669. package/build/base-field/index.js +0 -14
  670. package/build/base-field/index.js.map +0 -1
  671. package/build/base-field/styles.js +0 -33
  672. package/build/base-field/styles.js.map +0 -1
  673. package/build/resizable-box/styles/resizable-box.styles.js +0 -2
  674. package/build-module/base-field/hook.js +0 -37
  675. package/build-module/base-field/hook.js.map +0 -1
  676. package/build-module/base-field/index.js +0 -2
  677. package/build-module/base-field/index.js.map +0 -1
  678. package/build-module/base-field/styles.js +0 -18
  679. package/build-module/base-field/styles.js.map +0 -1
  680. package/build-module/resizable-box/styles/resizable-box.styles.js +0 -2
  681. package/build-types/base-field/hook.d.ts +0 -270
  682. package/build-types/base-field/hook.d.ts.map +0 -1
  683. package/build-types/base-field/index.d.ts +0 -2
  684. package/build-types/base-field/index.d.ts.map +0 -1
  685. package/build-types/base-field/styles.d.ts +0 -6
  686. package/build-types/base-field/styles.d.ts.map +0 -1
  687. package/build-types/base-field/types.d.ts +0 -29
  688. package/build-types/base-field/types.d.ts.map +0 -1
  689. package/build-types/resizable-box/styles/resizable-box.styles.d.ts +0 -1
  690. package/build-types/resizable-box/styles/resizable-box.styles.d.ts.map +0 -1
  691. package/src/angle-picker-control/stories/index.js +0 -29
  692. package/src/base-field/README.md +0 -66
  693. package/src/base-field/hook.ts +0 -51
  694. package/src/base-field/index.ts +0 -1
  695. package/src/base-field/styles.ts +0 -86
  696. package/src/base-field/test/__snapshots__/index.tsx.snap +0 -141
  697. package/src/base-field/test/index.tsx +0 -84
  698. package/src/base-field/types.ts +0 -29
  699. package/src/combobox-control/stories/index.js +0 -339
  700. package/src/menu-items-choice/index.js +0 -43
  701. package/src/panel/header.js +0 -10
  702. package/src/panel/index.js +0 -26
  703. package/src/panel/row.js +0 -20
  704. package/src/resizable-box/styles/resizable-box.styles.js +0 -0
  705. package/src/tools-panel/stories/utils/tools-panel-with-item-group-slot.js +0 -246
  706. package/src/tree-grid/cell.js +0 -24
  707. package/src/tree-grid/item.js +0 -20
  708. package/src/tree-grid/roving-tab-index-item.js +0 -33
  709. package/src/tree-grid/row.js +0 -31
  710. package/src/tree-grid/stories/index.js +0 -106
@@ -6,7 +6,7 @@ const VIDEO_EXTENSIONS = ['avi', 'mpg', 'mpeg', 'mov', 'mp4', 'm4v', 'ogg', 'ogv
6
6
  /**
7
7
  * Gets the extension of a file name.
8
8
  *
9
- * @param filename The file name.
9
+ * @param filename The file name.
10
10
  * @return The extension of the file name.
11
11
  */
12
12
 
@@ -18,7 +18,7 @@ export function getExtension() {
18
18
  /**
19
19
  * Checks if a file is a video.
20
20
  *
21
- * @param filename The file name.
21
+ * @param filename The file name.
22
22
  * @return Whether the file is a video.
23
23
  */
24
24
 
@@ -30,7 +30,7 @@ export function isVideoType() {
30
30
  /**
31
31
  * Transforms a fraction value to a percentage value.
32
32
  *
33
- * @param fraction The fraction value.
33
+ * @param fraction The fraction value.
34
34
  * @return A percentage value.
35
35
  */
36
36
 
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/focal-point-picker/utils.ts"],"names":["INITIAL_BOUNDS","width","height","VIDEO_EXTENSIONS","getExtension","filename","parts","split","length","isVideoType","startsWith","includes","fractionToPercentage","fraction","Math","round"],"mappings":"AAAA,OAAO,MAAMA,cAAc,GAAG;AAC7BC,EAAAA,KAAK,EAAE,GADsB;AAE7BC,EAAAA,MAAM,EAAE;AAFqB,CAAvB;AAKP,MAAMC,gBAAgB,GAAG,CACxB,KADwB,EAExB,KAFwB,EAGxB,MAHwB,EAIxB,KAJwB,EAKxB,KALwB,EAMxB,KANwB,EAOxB,KAPwB,EAQxB,KARwB,EASxB,MATwB,EAUxB,KAVwB,CAAzB;AAaA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,YAAT,GAA+C;AAAA,MAAxBC,QAAwB,uEAAb,EAAa;AACrD,QAAMC,KAAK,GAAGD,QAAQ,CAACE,KAAT,CAAgB,GAAhB,CAAd;AACA,SAAOD,KAAK,CAAEA,KAAK,CAACE,MAAN,GAAe,CAAjB,CAAZ;AACA;AAED;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,WAAT,GAAuD;AAAA,MAAjCJ,QAAiC,uEAAd,EAAc;AAC7D,MAAK,CAAEA,QAAP,EAAkB,OAAO,KAAP;AAClB,SACCA,QAAQ,CAACK,UAAT,CAAqB,aAArB,KACAP,gBAAgB,CAACQ,QAAjB,CAA2BP,YAAY,CAAEC,QAAF,CAAvC,CAFD;AAIA;AAED;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASO,oBAAT,CAA+BC,QAA/B,EAA0D;AAChE,SAAOC,IAAI,CAACC,KAAL,CAAYF,QAAQ,GAAG,GAAvB,CAAP;AACA","sourcesContent":["export const INITIAL_BOUNDS = {\n\twidth: 200,\n\theight: 170,\n};\n\nconst VIDEO_EXTENSIONS = [\n\t'avi',\n\t'mpg',\n\t'mpeg',\n\t'mov',\n\t'mp4',\n\t'm4v',\n\t'ogg',\n\t'ogv',\n\t'webm',\n\t'wmv',\n];\n\n/**\n * Gets the extension of a file name.\n *\n * @param filename The file name.\n * @return The extension of the file name.\n */\nexport function getExtension( filename = '' ): string {\n\tconst parts = filename.split( '.' );\n\treturn parts[ parts.length - 1 ];\n}\n\n/**\n * Checks if a file is a video.\n *\n * @param filename The file name.\n * @return Whether the file is a video.\n */\nexport function isVideoType( filename: string = '' ): boolean {\n\tif ( ! filename ) return false;\n\treturn (\n\t\tfilename.startsWith( 'data:video/' ) ||\n\t\tVIDEO_EXTENSIONS.includes( getExtension( filename ) )\n\t);\n}\n\n/**\n * Transforms a fraction value to a percentage value.\n *\n * @param fraction The fraction value.\n * @return A percentage value.\n */\nexport function fractionToPercentage( fraction: number ): number {\n\treturn Math.round( fraction * 100 );\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/focal-point-picker/utils.ts"],"names":["INITIAL_BOUNDS","width","height","VIDEO_EXTENSIONS","getExtension","filename","parts","split","length","isVideoType","startsWith","includes","fractionToPercentage","fraction","Math","round"],"mappings":"AAAA,OAAO,MAAMA,cAAc,GAAG;AAC7BC,EAAAA,KAAK,EAAE,GADsB;AAE7BC,EAAAA,MAAM,EAAE;AAFqB,CAAvB;AAKP,MAAMC,gBAAgB,GAAG,CACxB,KADwB,EAExB,KAFwB,EAGxB,MAHwB,EAIxB,KAJwB,EAKxB,KALwB,EAMxB,KANwB,EAOxB,KAPwB,EAQxB,KARwB,EASxB,MATwB,EAUxB,KAVwB,CAAzB;AAaA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,YAAT,GAA+C;AAAA,MAAxBC,QAAwB,uEAAb,EAAa;AACrD,QAAMC,KAAK,GAAGD,QAAQ,CAACE,KAAT,CAAgB,GAAhB,CAAd;AACA,SAAOD,KAAK,CAAEA,KAAK,CAACE,MAAN,GAAe,CAAjB,CAAZ;AACA;AAED;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,WAAT,GAAuD;AAAA,MAAjCJ,QAAiC,uEAAd,EAAc;AAC7D,MAAK,CAAEA,QAAP,EAAkB,OAAO,KAAP;AAClB,SACCA,QAAQ,CAACK,UAAT,CAAqB,aAArB,KACAP,gBAAgB,CAACQ,QAAjB,CAA2BP,YAAY,CAAEC,QAAF,CAAvC,CAFD;AAIA;AAED;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASO,oBAAT,CAA+BC,QAA/B,EAA0D;AAChE,SAAOC,IAAI,CAACC,KAAL,CAAYF,QAAQ,GAAG,GAAvB,CAAP;AACA","sourcesContent":["export const INITIAL_BOUNDS = {\n\twidth: 200,\n\theight: 170,\n};\n\nconst VIDEO_EXTENSIONS = [\n\t'avi',\n\t'mpg',\n\t'mpeg',\n\t'mov',\n\t'mp4',\n\t'm4v',\n\t'ogg',\n\t'ogv',\n\t'webm',\n\t'wmv',\n];\n\n/**\n * Gets the extension of a file name.\n *\n * @param filename The file name.\n * @return The extension of the file name.\n */\nexport function getExtension( filename = '' ): string {\n\tconst parts = filename.split( '.' );\n\treturn parts[ parts.length - 1 ];\n}\n\n/**\n * Checks if a file is a video.\n *\n * @param filename The file name.\n * @return Whether the file is a video.\n */\nexport function isVideoType( filename: string = '' ): boolean {\n\tif ( ! filename ) return false;\n\treturn (\n\t\tfilename.startsWith( 'data:video/' ) ||\n\t\tVIDEO_EXTENSIONS.includes( getExtension( filename ) )\n\t);\n}\n\n/**\n * Transforms a fraction value to a percentage value.\n *\n * @param fraction The fraction value.\n * @return A percentage value.\n */\nexport function fractionToPercentage( fraction: number ): number {\n\treturn Math.round( fraction * 100 );\n}\n"]}
@@ -10,7 +10,7 @@ import { parseQuantityAndUnitFromRawValue } from '../unit-control';
10
10
  * Some themes use css vars for their font sizes, so until we
11
11
  * have the way of calculating them don't display them.
12
12
  *
13
- * @param value The value that is checked.
13
+ * @param value The value that is checked.
14
14
  * @return Whether the value is a simple css value.
15
15
  */
16
16
 
@@ -22,7 +22,7 @@ export function isSimpleCssValue(value) {
22
22
  * If all of the given font sizes have the same unit (e.g. 'px'), return that
23
23
  * unit. Otherwise return null.
24
24
  *
25
- * @param fontSizes List of font sizes.
25
+ * @param fontSizes List of font sizes.
26
26
  * @return The common unit, or null.
27
27
  */
28
28
 
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/font-size-picker/utils.ts"],"names":["parseQuantityAndUnitFromRawValue","isSimpleCssValue","value","sizeRegex","test","String","getCommonSizeUnit","fontSizes","firstFontSize","otherFontSizes","firstUnit","size","areAllSizesSameUnit","every","fontSize","unit"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AAEA,SAASA,gCAAT,QAAiD,iBAAjD;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,gBAAT,CACNC,KADM,EAEL;AACD,QAAMC,SAAS,GAAG,gCAAlB;AACA,SAAOA,SAAS,CAACC,IAAV,CAAgBC,MAAM,CAAEH,KAAF,CAAtB,CAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASI,iBAAT,CAA4BC,SAA5B,EAAoD;AAC1D,QAAM,CAAEC,aAAF,EAAiB,GAAGC,cAApB,IAAuCF,SAA7C;;AACA,MAAK,CAAEC,aAAP,EAAuB;AACtB,WAAO,IAAP;AACA;;AACD,QAAM,GAAIE,SAAJ,IAAkBV,gCAAgC,CACvDQ,aAAa,CAACG,IADyC,CAAxD;AAGA,QAAMC,mBAAmB,GAAGH,cAAc,CAACI,KAAf,CAAwBC,QAAF,IAAgB;AACjE,UAAM,GAAIC,IAAJ,IAAaf,gCAAgC,CAAEc,QAAQ,CAACH,IAAX,CAAnD;AACA,WAAOI,IAAI,KAAKL,SAAhB;AACA,GAH2B,CAA5B;AAIA,SAAOE,mBAAmB,GAAGF,SAAH,GAAe,IAAzC;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport type { FontSizePickerProps, FontSize } from './types';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control';\n\n/**\n * Some themes use css vars for their font sizes, so until we\n * have the way of calculating them don't display them.\n *\n * @param value The value that is checked.\n * @return Whether the value is a simple css value.\n */\nexport function isSimpleCssValue(\n\tvalue: NonNullable< FontSizePickerProps[ 'value' ] >\n) {\n\tconst sizeRegex = /^[\\d\\.]+(px|em|rem|vw|vh|%)?$/i;\n\treturn sizeRegex.test( String( value ) );\n}\n\n/**\n * If all of the given font sizes have the same unit (e.g. 'px'), return that\n * unit. Otherwise return null.\n *\n * @param fontSizes List of font sizes.\n * @return The common unit, or null.\n */\nexport function getCommonSizeUnit( fontSizes: FontSize[] ) {\n\tconst [ firstFontSize, ...otherFontSizes ] = fontSizes;\n\tif ( ! firstFontSize ) {\n\t\treturn null;\n\t}\n\tconst [ , firstUnit ] = parseQuantityAndUnitFromRawValue(\n\t\tfirstFontSize.size\n\t);\n\tconst areAllSizesSameUnit = otherFontSizes.every( ( fontSize ) => {\n\t\tconst [ , unit ] = parseQuantityAndUnitFromRawValue( fontSize.size );\n\t\treturn unit === firstUnit;\n\t} );\n\treturn areAllSizesSameUnit ? firstUnit : null;\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/font-size-picker/utils.ts"],"names":["parseQuantityAndUnitFromRawValue","isSimpleCssValue","value","sizeRegex","test","String","getCommonSizeUnit","fontSizes","firstFontSize","otherFontSizes","firstUnit","size","areAllSizesSameUnit","every","fontSize","unit"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AAEA,SAASA,gCAAT,QAAiD,iBAAjD;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,gBAAT,CACNC,KADM,EAEL;AACD,QAAMC,SAAS,GAAG,gCAAlB;AACA,SAAOA,SAAS,CAACC,IAAV,CAAgBC,MAAM,CAAEH,KAAF,CAAtB,CAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASI,iBAAT,CAA4BC,SAA5B,EAAoD;AAC1D,QAAM,CAAEC,aAAF,EAAiB,GAAGC,cAApB,IAAuCF,SAA7C;;AACA,MAAK,CAAEC,aAAP,EAAuB;AACtB,WAAO,IAAP;AACA;;AACD,QAAM,GAAIE,SAAJ,IAAkBV,gCAAgC,CACvDQ,aAAa,CAACG,IADyC,CAAxD;AAGA,QAAMC,mBAAmB,GAAGH,cAAc,CAACI,KAAf,CAAwBC,QAAF,IAAgB;AACjE,UAAM,GAAIC,IAAJ,IAAaf,gCAAgC,CAAEc,QAAQ,CAACH,IAAX,CAAnD;AACA,WAAOI,IAAI,KAAKL,SAAhB;AACA,GAH2B,CAA5B;AAIA,SAAOE,mBAAmB,GAAGF,SAAH,GAAe,IAAzC;AACA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport type { FontSizePickerProps, FontSize } from './types';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control';\n\n/**\n * Some themes use css vars for their font sizes, so until we\n * have the way of calculating them don't display them.\n *\n * @param value The value that is checked.\n * @return Whether the value is a simple css value.\n */\nexport function isSimpleCssValue(\n\tvalue: NonNullable< FontSizePickerProps[ 'value' ] >\n) {\n\tconst sizeRegex = /^[\\d\\.]+(px|em|rem|vw|vh|%)?$/i;\n\treturn sizeRegex.test( String( value ) );\n}\n\n/**\n * If all of the given font sizes have the same unit (e.g. 'px'), return that\n * unit. Otherwise return null.\n *\n * @param fontSizes List of font sizes.\n * @return The common unit, or null.\n */\nexport function getCommonSizeUnit( fontSizes: FontSize[] ) {\n\tconst [ firstFontSize, ...otherFontSizes ] = fontSizes;\n\tif ( ! firstFontSize ) {\n\t\treturn null;\n\t}\n\tconst [ , firstUnit ] = parseQuantityAndUnitFromRawValue(\n\t\tfirstFontSize.size\n\t);\n\tconst areAllSizesSameUnit = otherFontSizes.every( ( fontSize ) => {\n\t\tconst [ , unit ] = parseQuantityAndUnitFromRawValue( fontSize.size );\n\t\treturn unit === firstUnit;\n\t} );\n\treturn areAllSizesSameUnit ? firstUnit : null;\n}\n"]}
@@ -70,7 +70,8 @@ function MultipleOrigin(_ref3) {
70
70
  gradients,
71
71
  onChange,
72
72
  value,
73
- actions
73
+ actions,
74
+ headingLevel
74
75
  } = _ref3;
75
76
  return createElement(VStack, {
76
77
  spacing: 3,
@@ -83,7 +84,9 @@ function MultipleOrigin(_ref3) {
83
84
  return createElement(VStack, {
84
85
  spacing: 2,
85
86
  key: index
86
- }, createElement(ColorHeading, null, name), createElement(SingleOrigin, _extends({
87
+ }, createElement(ColorHeading, {
88
+ level: headingLevel
89
+ }, name), createElement(SingleOrigin, _extends({
87
90
  clearGradient: clearGradient,
88
91
  gradients: gradientSet,
89
92
  onChange: gradient => onChange(gradient, index),
@@ -104,7 +107,8 @@ export default function GradientPicker(_ref5) {
104
107
  value,
105
108
  clearable = true,
106
109
  disableCustomGradients = false,
107
- __experimentalIsRenderedInSidebar
110
+ __experimentalIsRenderedInSidebar,
111
+ headingLevel = 2
108
112
  } = _ref5;
109
113
  const clearGradient = useCallback(() => onChange(undefined), [onChange]);
110
114
  const Component = isMultipleOriginArray(gradients) ? MultipleOrigin : SingleOrigin;
@@ -140,7 +144,8 @@ export default function GradientPicker(_ref5) {
140
144
  value: value,
141
145
  actions: clearable && !disableCustomGradients && createElement(CircularOptionPicker.ButtonAction, {
142
146
  onClick: clearGradient
143
- }, __('Clear'))
147
+ }, __('Clear')),
148
+ headingLevel: headingLevel
144
149
  })))
145
150
  );
146
151
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/gradient-picker/index.js"],"names":["__","sprintf","useCallback","useMemo","deprecated","CircularOptionPicker","CustomGradientPicker","VStack","ColorHeading","Spacer","isMultipleOriginObject","obj","Array","isArray","gradients","isMultipleOriginArray","arr","length","every","gradientObj","SingleOrigin","className","clearGradient","onChange","value","actions","gradientOptions","map","index","gradient","name","color","background","MultipleOrigin","gradientSet","GradientPicker","__nextHasNoMargin","clearable","disableCustomGradients","__experimentalIsRenderedInSidebar","undefined","Component","since","version","hint","deprecatedMarginSpacerProps","marginTop","marginBottom"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback, useMemo } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport CircularOptionPicker from '../circular-option-picker';\nimport CustomGradientPicker from '../custom-gradient-picker';\nimport { VStack } from '../v-stack';\nimport { ColorHeading } from '../color-palette/styles';\nimport { Spacer } from '../spacer';\n\n// The Multiple Origin Gradients have a `gradients` property (an array of\n// gradient objects), while Single Origin ones have a `gradient` property.\nconst isMultipleOriginObject = ( obj ) =>\n\tArray.isArray( obj.gradients ) && ! ( 'gradient' in obj );\n\nconst isMultipleOriginArray = ( arr ) => {\n\treturn (\n\t\tarr.length > 0 &&\n\t\tarr.every( ( gradientObj ) => isMultipleOriginObject( gradientObj ) )\n\t);\n};\n\nfunction SingleOrigin( {\n\tclassName,\n\tclearGradient,\n\tgradients,\n\tonChange,\n\tvalue,\n\tactions,\n} ) {\n\tconst gradientOptions = useMemo( () => {\n\t\treturn gradients.map( ( { gradient, name }, index ) => (\n\t\t\t<CircularOptionPicker.Option\n\t\t\t\tkey={ gradient }\n\t\t\t\tvalue={ gradient }\n\t\t\t\tisSelected={ value === gradient }\n\t\t\t\ttooltipText={\n\t\t\t\t\tname ||\n\t\t\t\t\t// translators: %s: gradient code e.g: \"linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);\".\n\t\t\t\t\tsprintf( __( 'Gradient code: %s' ), gradient )\n\t\t\t\t}\n\t\t\t\tstyle={ { color: 'rgba( 0,0,0,0 )', background: gradient } }\n\t\t\t\tonClick={\n\t\t\t\t\tvalue === gradient\n\t\t\t\t\t\t? clearGradient\n\t\t\t\t\t\t: () => onChange( gradient, index )\n\t\t\t\t}\n\t\t\t\taria-label={\n\t\t\t\t\tname\n\t\t\t\t\t\t? // translators: %s: The name of the gradient e.g: \"Angular red to blue\".\n\t\t\t\t\t\t sprintf( __( 'Gradient: %s' ), name )\n\t\t\t\t\t\t: // translators: %s: gradient code e.g: \"linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);\".\n\t\t\t\t\t\t sprintf( __( 'Gradient code: %s' ), gradient )\n\t\t\t\t}\n\t\t\t/>\n\t\t) );\n\t}, [ gradients, value, onChange, clearGradient ] );\n\treturn (\n\t\t<CircularOptionPicker\n\t\t\tclassName={ className }\n\t\t\toptions={ gradientOptions }\n\t\t\tactions={ actions }\n\t\t/>\n\t);\n}\n\nfunction MultipleOrigin( {\n\tclassName,\n\tclearGradient,\n\tgradients,\n\tonChange,\n\tvalue,\n\tactions,\n} ) {\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ gradients.map( ( { name, gradients: gradientSet }, index ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<VStack spacing={ 2 } key={ index }>\n\t\t\t\t\t\t<ColorHeading>{ name }</ColorHeading>\n\t\t\t\t\t\t<SingleOrigin\n\t\t\t\t\t\t\tclearGradient={ clearGradient }\n\t\t\t\t\t\t\tgradients={ gradientSet }\n\t\t\t\t\t\t\tonChange={ ( gradient ) =>\n\t\t\t\t\t\t\t\tonChange( gradient, index )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\t{ ...( gradients.length === index + 1\n\t\t\t\t\t\t\t\t? { actions }\n\t\t\t\t\t\t\t\t: {} ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</VStack>\n\t);\n}\n\nexport default function GradientPicker( {\n\t/** Start opting into the new margin-free styles that will become the default in a future version. */\n\t__nextHasNoMargin = false,\n\tclassName,\n\tgradients,\n\tonChange,\n\tvalue,\n\tclearable = true,\n\tdisableCustomGradients = false,\n\t__experimentalIsRenderedInSidebar,\n} ) {\n\tconst clearGradient = useCallback(\n\t\t() => onChange( undefined ),\n\t\t[ onChange ]\n\t);\n\tconst Component = isMultipleOriginArray( gradients )\n\t\t? MultipleOrigin\n\t\t: SingleOrigin;\n\n\tif ( ! __nextHasNoMargin ) {\n\t\tdeprecated( 'Outer margin styles for wp.components.GradientPicker', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.4',\n\t\t\thint: 'Set the `__nextHasNoMargin` prop to true to start opting into the new styles, which will become the default in a future version',\n\t\t} );\n\t}\n\n\tconst deprecatedMarginSpacerProps = ! __nextHasNoMargin\n\t\t? {\n\t\t\t\tmarginTop: ! gradients?.length ? 3 : undefined,\n\t\t\t\tmarginBottom: ! clearable ? 6 : 0,\n\t\t }\n\t\t: {};\n\n\treturn (\n\t\t// Outmost Spacer wrapper can be removed when deprecation period is over\n\t\t<Spacer marginBottom={ 0 } { ...deprecatedMarginSpacerProps }>\n\t\t\t<VStack spacing={ gradients?.length ? 4 : 0 }>\n\t\t\t\t{ ! disableCustomGradients && (\n\t\t\t\t\t<CustomGradientPicker\n\t\t\t\t\t\t__nextHasNoMargin\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ ( gradients?.length || clearable ) && (\n\t\t\t\t\t<Component\n\t\t\t\t\t\tclassName={ className }\n\t\t\t\t\t\tclearable={ clearable }\n\t\t\t\t\t\tclearGradient={ clearGradient }\n\t\t\t\t\t\tgradients={ gradients }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tactions={\n\t\t\t\t\t\t\tclearable &&\n\t\t\t\t\t\t\t! disableCustomGradients && (\n\t\t\t\t\t\t\t\t<CircularOptionPicker.ButtonAction\n\t\t\t\t\t\t\t\t\tonClick={ clearGradient }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ __( 'Clear' ) }\n\t\t\t\t\t\t\t\t</CircularOptionPicker.ButtonAction>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</VStack>\n\t\t</Spacer>\n\t);\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/gradient-picker/index.js"],"names":["__","sprintf","useCallback","useMemo","deprecated","CircularOptionPicker","CustomGradientPicker","VStack","ColorHeading","Spacer","isMultipleOriginObject","obj","Array","isArray","gradients","isMultipleOriginArray","arr","length","every","gradientObj","SingleOrigin","className","clearGradient","onChange","value","actions","gradientOptions","map","index","gradient","name","color","background","MultipleOrigin","headingLevel","gradientSet","GradientPicker","__nextHasNoMargin","clearable","disableCustomGradients","__experimentalIsRenderedInSidebar","undefined","Component","since","version","hint","deprecatedMarginSpacerProps","marginTop","marginBottom"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback, useMemo } from '@wordpress/element';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport CircularOptionPicker from '../circular-option-picker';\nimport CustomGradientPicker from '../custom-gradient-picker';\nimport { VStack } from '../v-stack';\nimport { ColorHeading } from '../color-palette/styles';\nimport { Spacer } from '../spacer';\n\n// The Multiple Origin Gradients have a `gradients` property (an array of\n// gradient objects), while Single Origin ones have a `gradient` property.\nconst isMultipleOriginObject = ( obj ) =>\n\tArray.isArray( obj.gradients ) && ! ( 'gradient' in obj );\n\nconst isMultipleOriginArray = ( arr ) => {\n\treturn (\n\t\tarr.length > 0 &&\n\t\tarr.every( ( gradientObj ) => isMultipleOriginObject( gradientObj ) )\n\t);\n};\n\nfunction SingleOrigin( {\n\tclassName,\n\tclearGradient,\n\tgradients,\n\tonChange,\n\tvalue,\n\tactions,\n} ) {\n\tconst gradientOptions = useMemo( () => {\n\t\treturn gradients.map( ( { gradient, name }, index ) => (\n\t\t\t<CircularOptionPicker.Option\n\t\t\t\tkey={ gradient }\n\t\t\t\tvalue={ gradient }\n\t\t\t\tisSelected={ value === gradient }\n\t\t\t\ttooltipText={\n\t\t\t\t\tname ||\n\t\t\t\t\t// translators: %s: gradient code e.g: \"linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);\".\n\t\t\t\t\tsprintf( __( 'Gradient code: %s' ), gradient )\n\t\t\t\t}\n\t\t\t\tstyle={ { color: 'rgba( 0,0,0,0 )', background: gradient } }\n\t\t\t\tonClick={\n\t\t\t\t\tvalue === gradient\n\t\t\t\t\t\t? clearGradient\n\t\t\t\t\t\t: () => onChange( gradient, index )\n\t\t\t\t}\n\t\t\t\taria-label={\n\t\t\t\t\tname\n\t\t\t\t\t\t? // translators: %s: The name of the gradient e.g: \"Angular red to blue\".\n\t\t\t\t\t\t sprintf( __( 'Gradient: %s' ), name )\n\t\t\t\t\t\t: // translators: %s: gradient code e.g: \"linear-gradient(90deg, rgba(98,16,153,1) 0%, rgba(172,110,22,1) 100%);\".\n\t\t\t\t\t\t sprintf( __( 'Gradient code: %s' ), gradient )\n\t\t\t\t}\n\t\t\t/>\n\t\t) );\n\t}, [ gradients, value, onChange, clearGradient ] );\n\treturn (\n\t\t<CircularOptionPicker\n\t\t\tclassName={ className }\n\t\t\toptions={ gradientOptions }\n\t\t\tactions={ actions }\n\t\t/>\n\t);\n}\n\nfunction MultipleOrigin( {\n\tclassName,\n\tclearGradient,\n\tgradients,\n\tonChange,\n\tvalue,\n\tactions,\n\theadingLevel,\n} ) {\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ gradients.map( ( { name, gradients: gradientSet }, index ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<VStack spacing={ 2 } key={ index }>\n\t\t\t\t\t\t<ColorHeading level={ headingLevel }>\n\t\t\t\t\t\t\t{ name }\n\t\t\t\t\t\t</ColorHeading>\n\t\t\t\t\t\t<SingleOrigin\n\t\t\t\t\t\t\tclearGradient={ clearGradient }\n\t\t\t\t\t\t\tgradients={ gradientSet }\n\t\t\t\t\t\t\tonChange={ ( gradient ) =>\n\t\t\t\t\t\t\t\tonChange( gradient, index )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\t{ ...( gradients.length === index + 1\n\t\t\t\t\t\t\t\t? { actions }\n\t\t\t\t\t\t\t\t: {} ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</VStack>\n\t);\n}\n\nexport default function GradientPicker( {\n\t/** Start opting into the new margin-free styles that will become the default in a future version. */\n\t__nextHasNoMargin = false,\n\tclassName,\n\tgradients,\n\tonChange,\n\tvalue,\n\tclearable = true,\n\tdisableCustomGradients = false,\n\t__experimentalIsRenderedInSidebar,\n\theadingLevel = 2,\n} ) {\n\tconst clearGradient = useCallback(\n\t\t() => onChange( undefined ),\n\t\t[ onChange ]\n\t);\n\tconst Component = isMultipleOriginArray( gradients )\n\t\t? MultipleOrigin\n\t\t: SingleOrigin;\n\n\tif ( ! __nextHasNoMargin ) {\n\t\tdeprecated( 'Outer margin styles for wp.components.GradientPicker', {\n\t\t\tsince: '6.1',\n\t\t\tversion: '6.4',\n\t\t\thint: 'Set the `__nextHasNoMargin` prop to true to start opting into the new styles, which will become the default in a future version',\n\t\t} );\n\t}\n\n\tconst deprecatedMarginSpacerProps = ! __nextHasNoMargin\n\t\t? {\n\t\t\t\tmarginTop: ! gradients?.length ? 3 : undefined,\n\t\t\t\tmarginBottom: ! clearable ? 6 : 0,\n\t\t }\n\t\t: {};\n\n\treturn (\n\t\t// Outmost Spacer wrapper can be removed when deprecation period is over\n\t\t<Spacer marginBottom={ 0 } { ...deprecatedMarginSpacerProps }>\n\t\t\t<VStack spacing={ gradients?.length ? 4 : 0 }>\n\t\t\t\t{ ! disableCustomGradients && (\n\t\t\t\t\t<CustomGradientPicker\n\t\t\t\t\t\t__nextHasNoMargin\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ ( gradients?.length || clearable ) && (\n\t\t\t\t\t<Component\n\t\t\t\t\t\tclassName={ className }\n\t\t\t\t\t\tclearable={ clearable }\n\t\t\t\t\t\tclearGradient={ clearGradient }\n\t\t\t\t\t\tgradients={ gradients }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\tactions={\n\t\t\t\t\t\t\tclearable &&\n\t\t\t\t\t\t\t! disableCustomGradients && (\n\t\t\t\t\t\t\t\t<CircularOptionPicker.ButtonAction\n\t\t\t\t\t\t\t\t\tonClick={ clearGradient }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ __( 'Clear' ) }\n\t\t\t\t\t\t\t\t</CircularOptionPicker.ButtonAction>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t\theadingLevel={ headingLevel }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</VStack>\n\t\t</Spacer>\n\t);\n}\n"]}
@@ -16,7 +16,7 @@ import * as actions from './actions';
16
16
  /**
17
17
  * Prepares initialState for the reducer.
18
18
  *
19
- * @param initialState The initial state.
19
+ * @param initialState The initial state.
20
20
  * @return Prepared initialState for the reducer
21
21
  */
22
22
  function mergeInitialState() {
@@ -36,7 +36,7 @@ function mergeInitialState() {
36
36
  * exception for CONTROL actions is because they represent controlled updates
37
37
  * from props and no case has yet presented for their specialization.
38
38
  *
39
- * @param composedStateReducers A reducer to specialize state changes.
39
+ * @param composedStateReducers A reducer to specialize state changes.
40
40
  * @return The reducer.
41
41
  */
42
42
 
@@ -135,9 +135,9 @@ function inputControlStateReducer(composedStateReducers) {
135
135
  * This technique uses the "stateReducer" design pattern:
136
136
  * https://kentcdodds.com/blog/the-state-reducer-pattern/
137
137
  *
138
- * @param stateReducer An external state reducer.
139
- * @param initialState The initial state for the reducer.
140
- * @param onChangeHandler A handler for the onChange event.
138
+ * @param stateReducer An external state reducer.
139
+ * @param initialState The initial state for the reducer.
140
+ * @param onChangeHandler A handler for the onChange event.
141
141
  * @return State, dispatch, and a collection of actions.
142
142
  */
143
143
 
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/input-control/reducer/reducer.ts"],"names":["useReducer","useLayoutEffect","useRef","initialInputControlState","initialStateReducer","actions","mergeInitialState","initialState","value","initialValue","inputControlStateReducer","composedStateReducers","state","action","nextState","type","CONTROL","payload","isDirty","_event","undefined","PRESS_UP","PRESS_DOWN","DRAG_START","isDragging","DRAG_END","CHANGE","error","isPressEnterToChange","COMMIT","RESET","INVALIDATE","event","useInputControlStateReducer","stateReducer","onChangeHandler","dispatch","createChangeEvent","nextValue","createKeyEvent","createDragEvent","change","invalidate","reset","commit","dragStart","drag","DRAG","dragEnd","pressUp","pressDown","pressEnter","PRESS_ENTER","currentState","refProps","current"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { SyntheticEvent, ChangeEvent, PointerEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useReducer, useLayoutEffect, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport {\n\tInputState,\n\tStateReducer,\n\tinitialInputControlState,\n\tinitialStateReducer,\n} from './state';\nimport * as actions from './actions';\nimport type { InputChangeCallback } from '../types';\n\n/**\n * Prepares initialState for the reducer.\n *\n * @param initialState The initial state.\n * @return Prepared initialState for the reducer\n */\nfunction mergeInitialState(\n\tinitialState: Partial< InputState > = initialInputControlState\n): InputState {\n\tconst { value } = initialState;\n\n\treturn {\n\t\t...initialInputControlState,\n\t\t...initialState,\n\t\tinitialValue: value,\n\t} as InputState;\n}\n\n/**\n * Creates the base reducer which may be coupled to a specializing reducer.\n * As its final step, for all actions other than CONTROL, the base reducer\n * passes the state and action on through the specializing reducer. The\n * exception for CONTROL actions is because they represent controlled updates\n * from props and no case has yet presented for their specialization.\n *\n * @param composedStateReducers A reducer to specialize state changes.\n * @return The reducer.\n */\nfunction inputControlStateReducer(\n\tcomposedStateReducers: StateReducer\n): StateReducer< actions.ControlAction > {\n\treturn ( state, action ) => {\n\t\tconst nextState = { ...state };\n\n\t\tswitch ( action.type ) {\n\t\t\t/*\n\t\t\t * Controlled updates\n\t\t\t */\n\t\t\tcase actions.CONTROL:\n\t\t\t\tnextState.value = action.payload.value;\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tnextState._event = undefined;\n\t\t\t\t// Returns immediately to avoid invoking additional reducers.\n\t\t\t\treturn nextState;\n\n\t\t\t/**\n\t\t\t * Keyboard events\n\t\t\t */\n\t\t\tcase actions.PRESS_UP:\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tbreak;\n\n\t\t\tcase actions.PRESS_DOWN:\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tbreak;\n\n\t\t\t/**\n\t\t\t * Drag events\n\t\t\t */\n\t\t\tcase actions.DRAG_START:\n\t\t\t\tnextState.isDragging = true;\n\t\t\t\tbreak;\n\n\t\t\tcase actions.DRAG_END:\n\t\t\t\tnextState.isDragging = false;\n\t\t\t\tbreak;\n\n\t\t\t/**\n\t\t\t * Input events\n\t\t\t */\n\t\t\tcase actions.CHANGE:\n\t\t\t\tnextState.error = null;\n\t\t\t\tnextState.value = action.payload.value;\n\n\t\t\t\tif ( state.isPressEnterToChange ) {\n\t\t\t\t\tnextState.isDirty = true;\n\t\t\t\t}\n\n\t\t\t\tbreak;\n\n\t\t\tcase actions.COMMIT:\n\t\t\t\tnextState.value = action.payload.value;\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tbreak;\n\n\t\t\tcase actions.RESET:\n\t\t\t\tnextState.error = null;\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tnextState.value = action.payload.value || state.initialValue;\n\t\t\t\tbreak;\n\n\t\t\t/**\n\t\t\t * Validation\n\t\t\t */\n\t\t\tcase actions.INVALIDATE:\n\t\t\t\tnextState.error = action.payload.error;\n\t\t\t\tbreak;\n\t\t}\n\n\t\tnextState._event = action.payload.event;\n\n\t\t/**\n\t\t * Send the nextState + action to the composedReducers via\n\t\t * this \"bridge\" mechanism. This allows external stateReducers\n\t\t * to hook into actions, and modify state if needed.\n\t\t */\n\t\treturn composedStateReducers( nextState, action );\n\t};\n}\n\n/**\n * A custom hook that connects and external stateReducer with an internal\n * reducer. This hook manages the internal state of InputControl.\n * However, by connecting an external stateReducer function, other\n * components can react to actions as well as modify state before it is\n * applied.\n *\n * This technique uses the \"stateReducer\" design pattern:\n * https://kentcdodds.com/blog/the-state-reducer-pattern/\n *\n * @param stateReducer An external state reducer.\n * @param initialState The initial state for the reducer.\n * @param onChangeHandler A handler for the onChange event.\n * @return State, dispatch, and a collection of actions.\n */\nexport function useInputControlStateReducer(\n\tstateReducer: StateReducer = initialStateReducer,\n\tinitialState: Partial< InputState > = initialInputControlState,\n\tonChangeHandler: InputChangeCallback\n) {\n\tconst [ state, dispatch ] = useReducer(\n\t\tinputControlStateReducer( stateReducer ),\n\t\tmergeInitialState( initialState )\n\t);\n\n\tconst createChangeEvent =\n\t\t( type: actions.ChangeEventAction[ 'type' ] ) =>\n\t\t(\n\t\t\tnextValue: actions.ChangeEventAction[ 'payload' ][ 'value' ],\n\t\t\tevent: actions.ChangeEventAction[ 'payload' ][ 'event' ]\n\t\t) => {\n\t\t\tdispatch( {\n\t\t\t\ttype,\n\t\t\t\tpayload: { value: nextValue, event },\n\t\t\t} as actions.InputAction );\n\t\t};\n\n\tconst createKeyEvent =\n\t\t( type: actions.KeyEventAction[ 'type' ] ) =>\n\t\t( event: actions.KeyEventAction[ 'payload' ][ 'event' ] ) => {\n\t\t\tdispatch( { type, payload: { event } } );\n\t\t};\n\n\tconst createDragEvent =\n\t\t( type: actions.DragEventAction[ 'type' ] ) =>\n\t\t( payload: actions.DragEventAction[ 'payload' ] ) => {\n\t\t\tdispatch( { type, payload } );\n\t\t};\n\n\t/**\n\t * Actions for the reducer\n\t */\n\tconst change = createChangeEvent( actions.CHANGE );\n\tconst invalidate = ( error: unknown, event: SyntheticEvent ) =>\n\t\tdispatch( { type: actions.INVALIDATE, payload: { error, event } } );\n\tconst reset = createChangeEvent( actions.RESET );\n\tconst commit = createChangeEvent( actions.COMMIT );\n\n\tconst dragStart = createDragEvent( actions.DRAG_START );\n\tconst drag = createDragEvent( actions.DRAG );\n\tconst dragEnd = createDragEvent( actions.DRAG_END );\n\n\tconst pressUp = createKeyEvent( actions.PRESS_UP );\n\tconst pressDown = createKeyEvent( actions.PRESS_DOWN );\n\tconst pressEnter = createKeyEvent( actions.PRESS_ENTER );\n\n\tconst currentState = useRef( state );\n\tconst refProps = useRef( { value: initialState.value, onChangeHandler } );\n\n\t// Freshens refs to props and state so that subsequent effects have access\n\t// to their latest values without their changes causing effect runs.\n\tuseLayoutEffect( () => {\n\t\tcurrentState.current = state;\n\t\trefProps.current = { value: initialState.value, onChangeHandler };\n\t} );\n\n\t// Propagates the latest state through onChange.\n\tuseLayoutEffect( () => {\n\t\tif (\n\t\t\tcurrentState.current._event !== undefined &&\n\t\t\tstate.value !== refProps.current.value &&\n\t\t\t! state.isDirty\n\t\t) {\n\t\t\trefProps.current.onChangeHandler( state.value ?? '', {\n\t\t\t\tevent: currentState.current._event as\n\t\t\t\t\t| ChangeEvent< HTMLInputElement >\n\t\t\t\t\t| PointerEvent< HTMLInputElement >,\n\t\t\t} );\n\t\t}\n\t}, [ state.value, state.isDirty ] );\n\n\t// Updates the state from props.\n\tuseLayoutEffect( () => {\n\t\tif (\n\t\t\tinitialState.value !== currentState.current.value &&\n\t\t\t! currentState.current.isDirty\n\t\t) {\n\t\t\tdispatch( {\n\t\t\t\ttype: actions.CONTROL,\n\t\t\t\tpayload: { value: initialState.value ?? '' },\n\t\t\t} );\n\t\t}\n\t}, [ initialState.value ] );\n\n\treturn {\n\t\tchange,\n\t\tcommit,\n\t\tdispatch,\n\t\tdrag,\n\t\tdragEnd,\n\t\tdragStart,\n\t\tinvalidate,\n\t\tpressDown,\n\t\tpressEnter,\n\t\tpressUp,\n\t\treset,\n\t\tstate,\n\t} as const;\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/input-control/reducer/reducer.ts"],"names":["useReducer","useLayoutEffect","useRef","initialInputControlState","initialStateReducer","actions","mergeInitialState","initialState","value","initialValue","inputControlStateReducer","composedStateReducers","state","action","nextState","type","CONTROL","payload","isDirty","_event","undefined","PRESS_UP","PRESS_DOWN","DRAG_START","isDragging","DRAG_END","CHANGE","error","isPressEnterToChange","COMMIT","RESET","INVALIDATE","event","useInputControlStateReducer","stateReducer","onChangeHandler","dispatch","createChangeEvent","nextValue","createKeyEvent","createDragEvent","change","invalidate","reset","commit","dragStart","drag","DRAG","dragEnd","pressUp","pressDown","pressEnter","PRESS_ENTER","currentState","refProps","current"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,UAAT,EAAqBC,eAArB,EAAsCC,MAAtC,QAAoD,oBAApD;AAEA;AACA;AACA;;AACA,SAGCC,wBAHD,EAICC,mBAJD,QAKO,SALP;AAMA,OAAO,KAAKC,OAAZ,MAAyB,WAAzB;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA,SAASC,iBAAT,GAEc;AAAA,MADbC,YACa,uEADyBJ,wBACzB;AACb,QAAM;AAAEK,IAAAA;AAAF,MAAYD,YAAlB;AAEA,SAAO,EACN,GAAGJ,wBADG;AAEN,OAAGI,YAFG;AAGNE,IAAAA,YAAY,EAAED;AAHR,GAAP;AAKA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,SAASE,wBAAT,CACCC,qBADD,EAEyC;AACxC,SAAO,CAAEC,KAAF,EAASC,MAAT,KAAqB;AAC3B,UAAMC,SAAS,GAAG,EAAE,GAAGF;AAAL,KAAlB;;AAEA,YAASC,MAAM,CAACE,IAAhB;AACC;AACH;AACA;AACG,WAAKV,OAAO,CAACW,OAAb;AACCF,QAAAA,SAAS,CAACN,KAAV,GAAkBK,MAAM,CAACI,OAAP,CAAeT,KAAjC;AACAM,QAAAA,SAAS,CAACI,OAAV,GAAoB,KAApB;AACAJ,QAAAA,SAAS,CAACK,MAAV,GAAmBC,SAAnB,CAHD,CAIC;;AACA,eAAON,SAAP;;AAED;AACH;AACA;;AACG,WAAKT,OAAO,CAACgB,QAAb;AACCP,QAAAA,SAAS,CAACI,OAAV,GAAoB,KAApB;AACA;;AAED,WAAKb,OAAO,CAACiB,UAAb;AACCR,QAAAA,SAAS,CAACI,OAAV,GAAoB,KAApB;AACA;;AAED;AACH;AACA;;AACG,WAAKb,OAAO,CAACkB,UAAb;AACCT,QAAAA,SAAS,CAACU,UAAV,GAAuB,IAAvB;AACA;;AAED,WAAKnB,OAAO,CAACoB,QAAb;AACCX,QAAAA,SAAS,CAACU,UAAV,GAAuB,KAAvB;AACA;;AAED;AACH;AACA;;AACG,WAAKnB,OAAO,CAACqB,MAAb;AACCZ,QAAAA,SAAS,CAACa,KAAV,GAAkB,IAAlB;AACAb,QAAAA,SAAS,CAACN,KAAV,GAAkBK,MAAM,CAACI,OAAP,CAAeT,KAAjC;;AAEA,YAAKI,KAAK,CAACgB,oBAAX,EAAkC;AACjCd,UAAAA,SAAS,CAACI,OAAV,GAAoB,IAApB;AACA;;AAED;;AAED,WAAKb,OAAO,CAACwB,MAAb;AACCf,QAAAA,SAAS,CAACN,KAAV,GAAkBK,MAAM,CAACI,OAAP,CAAeT,KAAjC;AACAM,QAAAA,SAAS,CAACI,OAAV,GAAoB,KAApB;AACA;;AAED,WAAKb,OAAO,CAACyB,KAAb;AACChB,QAAAA,SAAS,CAACa,KAAV,GAAkB,IAAlB;AACAb,QAAAA,SAAS,CAACI,OAAV,GAAoB,KAApB;AACAJ,QAAAA,SAAS,CAACN,KAAV,GAAkBK,MAAM,CAACI,OAAP,CAAeT,KAAf,IAAwBI,KAAK,CAACH,YAAhD;AACA;;AAED;AACH;AACA;;AACG,WAAKJ,OAAO,CAAC0B,UAAb;AACCjB,QAAAA,SAAS,CAACa,KAAV,GAAkBd,MAAM,CAACI,OAAP,CAAeU,KAAjC;AACA;AA9DF;;AAiEAb,IAAAA,SAAS,CAACK,MAAV,GAAmBN,MAAM,CAACI,OAAP,CAAee,KAAlC;AAEA;AACF;AACA;AACA;AACA;;AACE,WAAOrB,qBAAqB,CAAEG,SAAF,EAAaD,MAAb,CAA5B;AACA,GA5ED;AA6EA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,SAASoB,2BAAT,GAIL;AAAA,MAHDC,YAGC,uEAH4B9B,mBAG5B;AAAA,MAFDG,YAEC,uEAFqCJ,wBAErC;AAAA,MADDgC,eACC;AACD,QAAM,CAAEvB,KAAF,EAASwB,QAAT,IAAsBpC,UAAU,CACrCU,wBAAwB,CAAEwB,YAAF,CADa,EAErC5B,iBAAiB,CAAEC,YAAF,CAFoB,CAAtC;;AAKA,QAAM8B,iBAAiB,GACpBtB,IAAF,IACA,CACCuB,SADD,EAECN,KAFD,KAGK;AACJI,IAAAA,QAAQ,CAAE;AACTrB,MAAAA,IADS;AAETE,MAAAA,OAAO,EAAE;AAAET,QAAAA,KAAK,EAAE8B,SAAT;AAAoBN,QAAAA;AAApB;AAFA,KAAF,CAAR;AAIA,GAVF;;AAYA,QAAMO,cAAc,GACjBxB,IAAF,IACEiB,KAAF,IAA6D;AAC5DI,IAAAA,QAAQ,CAAE;AAAErB,MAAAA,IAAF;AAAQE,MAAAA,OAAO,EAAE;AAAEe,QAAAA;AAAF;AAAjB,KAAF,CAAR;AACA,GAJF;;AAMA,QAAMQ,eAAe,GAClBzB,IAAF,IACEE,OAAF,IAAqD;AACpDmB,IAAAA,QAAQ,CAAE;AAAErB,MAAAA,IAAF;AAAQE,MAAAA;AAAR,KAAF,CAAR;AACA,GAJF;AAMA;AACD;AACA;;;AACC,QAAMwB,MAAM,GAAGJ,iBAAiB,CAAEhC,OAAO,CAACqB,MAAV,CAAhC;;AACA,QAAMgB,UAAU,GAAG,CAAEf,KAAF,EAAkBK,KAAlB,KAClBI,QAAQ,CAAE;AAAErB,IAAAA,IAAI,EAAEV,OAAO,CAAC0B,UAAhB;AAA4Bd,IAAAA,OAAO,EAAE;AAAEU,MAAAA,KAAF;AAASK,MAAAA;AAAT;AAArC,GAAF,CADT;;AAEA,QAAMW,KAAK,GAAGN,iBAAiB,CAAEhC,OAAO,CAACyB,KAAV,CAA/B;AACA,QAAMc,MAAM,GAAGP,iBAAiB,CAAEhC,OAAO,CAACwB,MAAV,CAAhC;AAEA,QAAMgB,SAAS,GAAGL,eAAe,CAAEnC,OAAO,CAACkB,UAAV,CAAjC;AACA,QAAMuB,IAAI,GAAGN,eAAe,CAAEnC,OAAO,CAAC0C,IAAV,CAA5B;AACA,QAAMC,OAAO,GAAGR,eAAe,CAAEnC,OAAO,CAACoB,QAAV,CAA/B;AAEA,QAAMwB,OAAO,GAAGV,cAAc,CAAElC,OAAO,CAACgB,QAAV,CAA9B;AACA,QAAM6B,SAAS,GAAGX,cAAc,CAAElC,OAAO,CAACiB,UAAV,CAAhC;AACA,QAAM6B,UAAU,GAAGZ,cAAc,CAAElC,OAAO,CAAC+C,WAAV,CAAjC;AAEA,QAAMC,YAAY,GAAGnD,MAAM,CAAEU,KAAF,CAA3B;AACA,QAAM0C,QAAQ,GAAGpD,MAAM,CAAE;AAAEM,IAAAA,KAAK,EAAED,YAAY,CAACC,KAAtB;AAA6B2B,IAAAA;AAA7B,GAAF,CAAvB,CAhDC,CAkDD;AACA;;AACAlC,EAAAA,eAAe,CAAE,MAAM;AACtBoD,IAAAA,YAAY,CAACE,OAAb,GAAuB3C,KAAvB;AACA0C,IAAAA,QAAQ,CAACC,OAAT,GAAmB;AAAE/C,MAAAA,KAAK,EAAED,YAAY,CAACC,KAAtB;AAA6B2B,MAAAA;AAA7B,KAAnB;AACA,GAHc,CAAf,CApDC,CAyDD;;AACAlC,EAAAA,eAAe,CAAE,MAAM;AACtB,QACCoD,YAAY,CAACE,OAAb,CAAqBpC,MAArB,KAAgCC,SAAhC,IACAR,KAAK,CAACJ,KAAN,KAAgB8C,QAAQ,CAACC,OAAT,CAAiB/C,KADjC,IAEA,CAAEI,KAAK,CAACM,OAHT,EAIE;AAAA;;AACDoC,MAAAA,QAAQ,CAACC,OAAT,CAAiBpB,eAAjB,iBAAkCvB,KAAK,CAACJ,KAAxC,uDAAiD,EAAjD,EAAqD;AACpDwB,QAAAA,KAAK,EAAEqB,YAAY,CAACE,OAAb,CAAqBpC;AADwB,OAArD;AAKA;AACD,GAZc,EAYZ,CAAEP,KAAK,CAACJ,KAAR,EAAeI,KAAK,CAACM,OAArB,CAZY,CAAf,CA1DC,CAwED;;AACAjB,EAAAA,eAAe,CAAE,MAAM;AACtB,QACCM,YAAY,CAACC,KAAb,KAAuB6C,YAAY,CAACE,OAAb,CAAqB/C,KAA5C,IACA,CAAE6C,YAAY,CAACE,OAAb,CAAqBrC,OAFxB,EAGE;AAAA;;AACDkB,MAAAA,QAAQ,CAAE;AACTrB,QAAAA,IAAI,EAAEV,OAAO,CAACW,OADL;AAETC,QAAAA,OAAO,EAAE;AAAET,UAAAA,KAAK,yBAAED,YAAY,CAACC,KAAf,qEAAwB;AAA/B;AAFA,OAAF,CAAR;AAIA;AACD,GAVc,EAUZ,CAAED,YAAY,CAACC,KAAf,CAVY,CAAf;AAYA,SAAO;AACNiC,IAAAA,MADM;AAENG,IAAAA,MAFM;AAGNR,IAAAA,QAHM;AAINU,IAAAA,IAJM;AAKNE,IAAAA,OALM;AAMNH,IAAAA,SANM;AAONH,IAAAA,UAPM;AAQNQ,IAAAA,SARM;AASNC,IAAAA,UATM;AAUNF,IAAAA,OAVM;AAWNN,IAAAA,KAXM;AAYN/B,IAAAA;AAZM,GAAP;AAcA","sourcesContent":["/**\n * External dependencies\n */\nimport type { SyntheticEvent, ChangeEvent, PointerEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useReducer, useLayoutEffect, useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport {\n\tInputState,\n\tStateReducer,\n\tinitialInputControlState,\n\tinitialStateReducer,\n} from './state';\nimport * as actions from './actions';\nimport type { InputChangeCallback } from '../types';\n\n/**\n * Prepares initialState for the reducer.\n *\n * @param initialState The initial state.\n * @return Prepared initialState for the reducer\n */\nfunction mergeInitialState(\n\tinitialState: Partial< InputState > = initialInputControlState\n): InputState {\n\tconst { value } = initialState;\n\n\treturn {\n\t\t...initialInputControlState,\n\t\t...initialState,\n\t\tinitialValue: value,\n\t} as InputState;\n}\n\n/**\n * Creates the base reducer which may be coupled to a specializing reducer.\n * As its final step, for all actions other than CONTROL, the base reducer\n * passes the state and action on through the specializing reducer. The\n * exception for CONTROL actions is because they represent controlled updates\n * from props and no case has yet presented for their specialization.\n *\n * @param composedStateReducers A reducer to specialize state changes.\n * @return The reducer.\n */\nfunction inputControlStateReducer(\n\tcomposedStateReducers: StateReducer\n): StateReducer< actions.ControlAction > {\n\treturn ( state, action ) => {\n\t\tconst nextState = { ...state };\n\n\t\tswitch ( action.type ) {\n\t\t\t/*\n\t\t\t * Controlled updates\n\t\t\t */\n\t\t\tcase actions.CONTROL:\n\t\t\t\tnextState.value = action.payload.value;\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tnextState._event = undefined;\n\t\t\t\t// Returns immediately to avoid invoking additional reducers.\n\t\t\t\treturn nextState;\n\n\t\t\t/**\n\t\t\t * Keyboard events\n\t\t\t */\n\t\t\tcase actions.PRESS_UP:\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tbreak;\n\n\t\t\tcase actions.PRESS_DOWN:\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tbreak;\n\n\t\t\t/**\n\t\t\t * Drag events\n\t\t\t */\n\t\t\tcase actions.DRAG_START:\n\t\t\t\tnextState.isDragging = true;\n\t\t\t\tbreak;\n\n\t\t\tcase actions.DRAG_END:\n\t\t\t\tnextState.isDragging = false;\n\t\t\t\tbreak;\n\n\t\t\t/**\n\t\t\t * Input events\n\t\t\t */\n\t\t\tcase actions.CHANGE:\n\t\t\t\tnextState.error = null;\n\t\t\t\tnextState.value = action.payload.value;\n\n\t\t\t\tif ( state.isPressEnterToChange ) {\n\t\t\t\t\tnextState.isDirty = true;\n\t\t\t\t}\n\n\t\t\t\tbreak;\n\n\t\t\tcase actions.COMMIT:\n\t\t\t\tnextState.value = action.payload.value;\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tbreak;\n\n\t\t\tcase actions.RESET:\n\t\t\t\tnextState.error = null;\n\t\t\t\tnextState.isDirty = false;\n\t\t\t\tnextState.value = action.payload.value || state.initialValue;\n\t\t\t\tbreak;\n\n\t\t\t/**\n\t\t\t * Validation\n\t\t\t */\n\t\t\tcase actions.INVALIDATE:\n\t\t\t\tnextState.error = action.payload.error;\n\t\t\t\tbreak;\n\t\t}\n\n\t\tnextState._event = action.payload.event;\n\n\t\t/**\n\t\t * Send the nextState + action to the composedReducers via\n\t\t * this \"bridge\" mechanism. This allows external stateReducers\n\t\t * to hook into actions, and modify state if needed.\n\t\t */\n\t\treturn composedStateReducers( nextState, action );\n\t};\n}\n\n/**\n * A custom hook that connects and external stateReducer with an internal\n * reducer. This hook manages the internal state of InputControl.\n * However, by connecting an external stateReducer function, other\n * components can react to actions as well as modify state before it is\n * applied.\n *\n * This technique uses the \"stateReducer\" design pattern:\n * https://kentcdodds.com/blog/the-state-reducer-pattern/\n *\n * @param stateReducer An external state reducer.\n * @param initialState The initial state for the reducer.\n * @param onChangeHandler A handler for the onChange event.\n * @return State, dispatch, and a collection of actions.\n */\nexport function useInputControlStateReducer(\n\tstateReducer: StateReducer = initialStateReducer,\n\tinitialState: Partial< InputState > = initialInputControlState,\n\tonChangeHandler: InputChangeCallback\n) {\n\tconst [ state, dispatch ] = useReducer(\n\t\tinputControlStateReducer( stateReducer ),\n\t\tmergeInitialState( initialState )\n\t);\n\n\tconst createChangeEvent =\n\t\t( type: actions.ChangeEventAction[ 'type' ] ) =>\n\t\t(\n\t\t\tnextValue: actions.ChangeEventAction[ 'payload' ][ 'value' ],\n\t\t\tevent: actions.ChangeEventAction[ 'payload' ][ 'event' ]\n\t\t) => {\n\t\t\tdispatch( {\n\t\t\t\ttype,\n\t\t\t\tpayload: { value: nextValue, event },\n\t\t\t} as actions.InputAction );\n\t\t};\n\n\tconst createKeyEvent =\n\t\t( type: actions.KeyEventAction[ 'type' ] ) =>\n\t\t( event: actions.KeyEventAction[ 'payload' ][ 'event' ] ) => {\n\t\t\tdispatch( { type, payload: { event } } );\n\t\t};\n\n\tconst createDragEvent =\n\t\t( type: actions.DragEventAction[ 'type' ] ) =>\n\t\t( payload: actions.DragEventAction[ 'payload' ] ) => {\n\t\t\tdispatch( { type, payload } );\n\t\t};\n\n\t/**\n\t * Actions for the reducer\n\t */\n\tconst change = createChangeEvent( actions.CHANGE );\n\tconst invalidate = ( error: unknown, event: SyntheticEvent ) =>\n\t\tdispatch( { type: actions.INVALIDATE, payload: { error, event } } );\n\tconst reset = createChangeEvent( actions.RESET );\n\tconst commit = createChangeEvent( actions.COMMIT );\n\n\tconst dragStart = createDragEvent( actions.DRAG_START );\n\tconst drag = createDragEvent( actions.DRAG );\n\tconst dragEnd = createDragEvent( actions.DRAG_END );\n\n\tconst pressUp = createKeyEvent( actions.PRESS_UP );\n\tconst pressDown = createKeyEvent( actions.PRESS_DOWN );\n\tconst pressEnter = createKeyEvent( actions.PRESS_ENTER );\n\n\tconst currentState = useRef( state );\n\tconst refProps = useRef( { value: initialState.value, onChangeHandler } );\n\n\t// Freshens refs to props and state so that subsequent effects have access\n\t// to their latest values without their changes causing effect runs.\n\tuseLayoutEffect( () => {\n\t\tcurrentState.current = state;\n\t\trefProps.current = { value: initialState.value, onChangeHandler };\n\t} );\n\n\t// Propagates the latest state through onChange.\n\tuseLayoutEffect( () => {\n\t\tif (\n\t\t\tcurrentState.current._event !== undefined &&\n\t\t\tstate.value !== refProps.current.value &&\n\t\t\t! state.isDirty\n\t\t) {\n\t\t\trefProps.current.onChangeHandler( state.value ?? '', {\n\t\t\t\tevent: currentState.current._event as\n\t\t\t\t\t| ChangeEvent< HTMLInputElement >\n\t\t\t\t\t| PointerEvent< HTMLInputElement >,\n\t\t\t} );\n\t\t}\n\t}, [ state.value, state.isDirty ] );\n\n\t// Updates the state from props.\n\tuseLayoutEffect( () => {\n\t\tif (\n\t\t\tinitialState.value !== currentState.current.value &&\n\t\t\t! currentState.current.isDirty\n\t\t) {\n\t\t\tdispatch( {\n\t\t\t\ttype: actions.CONTROL,\n\t\t\t\tpayload: { value: initialState.value ?? '' },\n\t\t\t} );\n\t\t}\n\t}, [ initialState.value ] );\n\n\treturn {\n\t\tchange,\n\t\tcommit,\n\t\tdispatch,\n\t\tdrag,\n\t\tdragEnd,\n\t\tdragStart,\n\t\tinvalidate,\n\t\tpressDown,\n\t\tpressEnter,\n\t\tpressUp,\n\t\treset,\n\t\tstate,\n\t} as const;\n}\n"]}
@@ -13,7 +13,7 @@ import { useEffect, useLayoutEffect, useRef, useState } from '@wordpress/element
13
13
  /**
14
14
  * Gets a CSS cursor value based on a drag direction.
15
15
  *
16
- * @param dragDirection The drag direction.
16
+ * @param dragDirection The drag direction.
17
17
  * @return The CSS cursor value.
18
18
  */
19
19
  export function getDragCursor(dragDirection) {
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/input-control/utils.ts"],"names":["useEffect","useLayoutEffect","useRef","useState","getDragCursor","dragDirection","dragCursor","useDragCursor","isDragging","document","documentElement","style","cursor","useDraft","props","refPreviousValue","value","draft","setDraft","undefined","current","previousValue","isStale","onChange","nextValue","extra","Object","assign","onBlur","event"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SACCA,SADD,EAECC,eAFD,EAGCC,MAHD,EAICC,QAJD,QAKO,oBALP;AAOA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,aAAT,CAAwBC,aAAxB,EAAwD;AAC9D,MAAIC,UAAU,GAAG,WAAjB;;AAEA,UAASD,aAAT;AACC,SAAK,GAAL;AACA,SAAK,GAAL;AACCC,MAAAA,UAAU,GAAG,WAAb;AACA;;AAED,SAAK,GAAL;AACA,SAAK,GAAL;AACCA,MAAAA,UAAU,GAAG,WAAb;AACA;AATF;;AAYA,SAAOA,UAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,aAAT,CACNC,UADM,EAENH,aAFM,EAGG;AACT,QAAMC,UAAU,GAAGF,aAAa,CAAEC,aAAF,CAAhC;AAEAL,EAAAA,SAAS,CAAE,MAAM;AAChB,QAAKQ,UAAL,EAAkB;AACjBC,MAAAA,QAAQ,CAACC,eAAT,CAAyBC,KAAzB,CAA+BC,MAA/B,GAAwCN,UAAxC;AACA,KAFD,MAEO;AACN;AACAG,MAAAA,QAAQ,CAACC,eAAT,CAAyBC,KAAzB,CAA+BC,MAA/B,GAAwC,IAAxC;AACA;AACD,GAPQ,EAON,CAAEJ,UAAF,EAAcF,UAAd,CAPM,CAAT;AASA,SAAOA,UAAP;AACA;AAED,OAAO,SAASO,QAAT,CAAmBC,KAAnB,EAIH;AACH,QAAMC,gBAAgB,GAAGb,MAAM,CAAEY,KAAK,CAACE,KAAR,CAA/B;AACA,QAAM,CAAEC,KAAF,EAASC,QAAT,IAAsBf,QAAQ,CAG/B,EAH+B,CAApC;AAIA,QAAMa,KAAK,GAAGC,KAAK,CAACD,KAAN,KAAgBG,SAAhB,GAA4BF,KAAK,CAACD,KAAlC,GAA0CF,KAAK,CAACE,KAA9D,CANG,CAQH;AACA;AACA;;AACAf,EAAAA,eAAe,CAAE,MAAM;AACtB,UAAM;AAAEmB,MAAAA,OAAO,EAAEC;AAAX,QAA6BN,gBAAnC;AACAA,IAAAA,gBAAgB,CAACK,OAAjB,GAA2BN,KAAK,CAACE,KAAjC;AACA,QAAKC,KAAK,CAACD,KAAN,KAAgBG,SAAhB,IAA6B,CAAEF,KAAK,CAACK,OAA1C,EACCJ,QAAQ,CAAE,EAAE,GAAGD,KAAL;AAAYK,MAAAA,OAAO,EAAE;AAArB,KAAF,CAAR,CADD,KAEK,IAAKL,KAAK,CAACK,OAAN,IAAiBR,KAAK,CAACE,KAAN,KAAgBK,aAAtC,EACJH,QAAQ,CAAE,EAAF,CAAR;AACD,GAPc,EAOZ,CAAEJ,KAAK,CAACE,KAAR,EAAeC,KAAf,CAPY,CAAf;;AASA,QAAMM,QAA6B,GAAG,CAAEC,SAAF,EAAaC,KAAb,KAAwB;AAC7D;AACAP,IAAAA,QAAQ,CAAIE,OAAF,IACTM,MAAM,CAACC,MAAP,CAAeP,OAAf,EAAwB;AAAEJ,MAAAA,KAAK,EAAEQ,SAAT;AAAoBF,MAAAA,OAAO,EAAE;AAA7B,KAAxB,CADO,CAAR;AAGAR,IAAAA,KAAK,CAACS,QAAN,CAAgBC,SAAhB,EAA2BC,KAA3B;AACA,GAND;;AAOA,QAAMG,MAAyB,GAAKC,KAAF,IAAa;AAAA;;AAC9CX,IAAAA,QAAQ,CAAE,EAAF,CAAR;AACA,qBAAAJ,KAAK,CAACc,MAAN,qEAAAd,KAAK,EAAWe,KAAX,CAAL;AACA,GAHD;;AAKA,SAAO;AAAEb,IAAAA,KAAF;AAASY,IAAAA,MAAT;AAAiBL,IAAAA;AAAjB,GAAP;AACA","sourcesContent":["/**\n * External dependencies\n */\nimport type { FocusEventHandler } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseEffect,\n\tuseLayoutEffect,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { InputChangeCallback } from './types';\n\n/**\n * Gets a CSS cursor value based on a drag direction.\n *\n * @param dragDirection The drag direction.\n * @return The CSS cursor value.\n */\nexport function getDragCursor( dragDirection: string ): string {\n\tlet dragCursor = 'ns-resize';\n\n\tswitch ( dragDirection ) {\n\t\tcase 'n':\n\t\tcase 's':\n\t\t\tdragCursor = 'ns-resize';\n\t\t\tbreak;\n\n\t\tcase 'e':\n\t\tcase 'w':\n\t\t\tdragCursor = 'ew-resize';\n\t\t\tbreak;\n\t}\n\n\treturn dragCursor;\n}\n\n/**\n * Custom hook that renders a drag cursor when dragging.\n *\n * @param {boolean} isDragging The dragging state.\n * @param {string} dragDirection The drag direction.\n *\n * @return {string} The CSS cursor value.\n */\nexport function useDragCursor(\n\tisDragging: boolean,\n\tdragDirection: string\n): string {\n\tconst dragCursor = getDragCursor( dragDirection );\n\n\tuseEffect( () => {\n\t\tif ( isDragging ) {\n\t\t\tdocument.documentElement.style.cursor = dragCursor;\n\t\t} else {\n\t\t\t// @ts-expect-error\n\t\t\tdocument.documentElement.style.cursor = null;\n\t\t}\n\t}, [ isDragging, dragCursor ] );\n\n\treturn dragCursor;\n}\n\nexport function useDraft( props: {\n\tvalue: string | undefined;\n\tonBlur?: FocusEventHandler;\n\tonChange: InputChangeCallback;\n} ) {\n\tconst refPreviousValue = useRef( props.value );\n\tconst [ draft, setDraft ] = useState< {\n\t\tvalue?: string;\n\t\tisStale?: boolean;\n\t} >( {} );\n\tconst value = draft.value !== undefined ? draft.value : props.value;\n\n\t// Determines when to discard the draft value to restore controlled status.\n\t// To do so, it tracks the previous value and marks the draft value as stale\n\t// after each render.\n\tuseLayoutEffect( () => {\n\t\tconst { current: previousValue } = refPreviousValue;\n\t\trefPreviousValue.current = props.value;\n\t\tif ( draft.value !== undefined && ! draft.isStale )\n\t\t\tsetDraft( { ...draft, isStale: true } );\n\t\telse if ( draft.isStale && props.value !== previousValue )\n\t\t\tsetDraft( {} );\n\t}, [ props.value, draft ] );\n\n\tconst onChange: InputChangeCallback = ( nextValue, extra ) => {\n\t\t// Mutates the draft value to avoid an extra effect run.\n\t\tsetDraft( ( current ) =>\n\t\t\tObject.assign( current, { value: nextValue, isStale: false } )\n\t\t);\n\t\tprops.onChange( nextValue, extra );\n\t};\n\tconst onBlur: FocusEventHandler = ( event ) => {\n\t\tsetDraft( {} );\n\t\tprops.onBlur?.( event );\n\t};\n\n\treturn { value, onBlur, onChange };\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/input-control/utils.ts"],"names":["useEffect","useLayoutEffect","useRef","useState","getDragCursor","dragDirection","dragCursor","useDragCursor","isDragging","document","documentElement","style","cursor","useDraft","props","refPreviousValue","value","draft","setDraft","undefined","current","previousValue","isStale","onChange","nextValue","extra","Object","assign","onBlur","event"],"mappings":"AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SACCA,SADD,EAECC,eAFD,EAGCC,MAHD,EAICC,QAJD,QAKO,oBALP;AAOA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,aAAT,CAAwBC,aAAxB,EAAwD;AAC9D,MAAIC,UAAU,GAAG,WAAjB;;AAEA,UAASD,aAAT;AACC,SAAK,GAAL;AACA,SAAK,GAAL;AACCC,MAAAA,UAAU,GAAG,WAAb;AACA;;AAED,SAAK,GAAL;AACA,SAAK,GAAL;AACCA,MAAAA,UAAU,GAAG,WAAb;AACA;AATF;;AAYA,SAAOA,UAAP;AACA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,aAAT,CACNC,UADM,EAENH,aAFM,EAGG;AACT,QAAMC,UAAU,GAAGF,aAAa,CAAEC,aAAF,CAAhC;AAEAL,EAAAA,SAAS,CAAE,MAAM;AAChB,QAAKQ,UAAL,EAAkB;AACjBC,MAAAA,QAAQ,CAACC,eAAT,CAAyBC,KAAzB,CAA+BC,MAA/B,GAAwCN,UAAxC;AACA,KAFD,MAEO;AACN;AACAG,MAAAA,QAAQ,CAACC,eAAT,CAAyBC,KAAzB,CAA+BC,MAA/B,GAAwC,IAAxC;AACA;AACD,GAPQ,EAON,CAAEJ,UAAF,EAAcF,UAAd,CAPM,CAAT;AASA,SAAOA,UAAP;AACA;AAED,OAAO,SAASO,QAAT,CAAmBC,KAAnB,EAIH;AACH,QAAMC,gBAAgB,GAAGb,MAAM,CAAEY,KAAK,CAACE,KAAR,CAA/B;AACA,QAAM,CAAEC,KAAF,EAASC,QAAT,IAAsBf,QAAQ,CAG/B,EAH+B,CAApC;AAIA,QAAMa,KAAK,GAAGC,KAAK,CAACD,KAAN,KAAgBG,SAAhB,GAA4BF,KAAK,CAACD,KAAlC,GAA0CF,KAAK,CAACE,KAA9D,CANG,CAQH;AACA;AACA;;AACAf,EAAAA,eAAe,CAAE,MAAM;AACtB,UAAM;AAAEmB,MAAAA,OAAO,EAAEC;AAAX,QAA6BN,gBAAnC;AACAA,IAAAA,gBAAgB,CAACK,OAAjB,GAA2BN,KAAK,CAACE,KAAjC;AACA,QAAKC,KAAK,CAACD,KAAN,KAAgBG,SAAhB,IAA6B,CAAEF,KAAK,CAACK,OAA1C,EACCJ,QAAQ,CAAE,EAAE,GAAGD,KAAL;AAAYK,MAAAA,OAAO,EAAE;AAArB,KAAF,CAAR,CADD,KAEK,IAAKL,KAAK,CAACK,OAAN,IAAiBR,KAAK,CAACE,KAAN,KAAgBK,aAAtC,EACJH,QAAQ,CAAE,EAAF,CAAR;AACD,GAPc,EAOZ,CAAEJ,KAAK,CAACE,KAAR,EAAeC,KAAf,CAPY,CAAf;;AASA,QAAMM,QAA6B,GAAG,CAAEC,SAAF,EAAaC,KAAb,KAAwB;AAC7D;AACAP,IAAAA,QAAQ,CAAIE,OAAF,IACTM,MAAM,CAACC,MAAP,CAAeP,OAAf,EAAwB;AAAEJ,MAAAA,KAAK,EAAEQ,SAAT;AAAoBF,MAAAA,OAAO,EAAE;AAA7B,KAAxB,CADO,CAAR;AAGAR,IAAAA,KAAK,CAACS,QAAN,CAAgBC,SAAhB,EAA2BC,KAA3B;AACA,GAND;;AAOA,QAAMG,MAAyB,GAAKC,KAAF,IAAa;AAAA;;AAC9CX,IAAAA,QAAQ,CAAE,EAAF,CAAR;AACA,qBAAAJ,KAAK,CAACc,MAAN,qEAAAd,KAAK,EAAWe,KAAX,CAAL;AACA,GAHD;;AAKA,SAAO;AAAEb,IAAAA,KAAF;AAASY,IAAAA,MAAT;AAAiBL,IAAAA;AAAjB,GAAP;AACA","sourcesContent":["/**\n * External dependencies\n */\nimport type { FocusEventHandler } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseEffect,\n\tuseLayoutEffect,\n\tuseRef,\n\tuseState,\n} from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { InputChangeCallback } from './types';\n\n/**\n * Gets a CSS cursor value based on a drag direction.\n *\n * @param dragDirection The drag direction.\n * @return The CSS cursor value.\n */\nexport function getDragCursor( dragDirection: string ): string {\n\tlet dragCursor = 'ns-resize';\n\n\tswitch ( dragDirection ) {\n\t\tcase 'n':\n\t\tcase 's':\n\t\t\tdragCursor = 'ns-resize';\n\t\t\tbreak;\n\n\t\tcase 'e':\n\t\tcase 'w':\n\t\t\tdragCursor = 'ew-resize';\n\t\t\tbreak;\n\t}\n\n\treturn dragCursor;\n}\n\n/**\n * Custom hook that renders a drag cursor when dragging.\n *\n * @param {boolean} isDragging The dragging state.\n * @param {string} dragDirection The drag direction.\n *\n * @return {string} The CSS cursor value.\n */\nexport function useDragCursor(\n\tisDragging: boolean,\n\tdragDirection: string\n): string {\n\tconst dragCursor = getDragCursor( dragDirection );\n\n\tuseEffect( () => {\n\t\tif ( isDragging ) {\n\t\t\tdocument.documentElement.style.cursor = dragCursor;\n\t\t} else {\n\t\t\t// @ts-expect-error\n\t\t\tdocument.documentElement.style.cursor = null;\n\t\t}\n\t}, [ isDragging, dragCursor ] );\n\n\treturn dragCursor;\n}\n\nexport function useDraft( props: {\n\tvalue: string | undefined;\n\tonBlur?: FocusEventHandler;\n\tonChange: InputChangeCallback;\n} ) {\n\tconst refPreviousValue = useRef( props.value );\n\tconst [ draft, setDraft ] = useState< {\n\t\tvalue?: string;\n\t\tisStale?: boolean;\n\t} >( {} );\n\tconst value = draft.value !== undefined ? draft.value : props.value;\n\n\t// Determines when to discard the draft value to restore controlled status.\n\t// To do so, it tracks the previous value and marks the draft value as stale\n\t// after each render.\n\tuseLayoutEffect( () => {\n\t\tconst { current: previousValue } = refPreviousValue;\n\t\trefPreviousValue.current = props.value;\n\t\tif ( draft.value !== undefined && ! draft.isStale )\n\t\t\tsetDraft( { ...draft, isStale: true } );\n\t\telse if ( draft.isStale && props.value !== previousValue )\n\t\t\tsetDraft( {} );\n\t}, [ props.value, draft ] );\n\n\tconst onChange: InputChangeCallback = ( nextValue, extra ) => {\n\t\t// Mutates the draft value to avoid an extra effect run.\n\t\tsetDraft( ( current ) =>\n\t\t\tObject.assign( current, { value: nextValue, isStale: false } )\n\t\t);\n\t\tprops.onChange( nextValue, extra );\n\t};\n\tconst onBlur: FocusEventHandler = ( event ) => {\n\t\tsetDraft( {} );\n\t\tprops.onBlur?.( event );\n\t};\n\n\treturn { value, onBlur, onChange };\n}\n"]}
@@ -1,4 +1,4 @@
1
- import { createElement } from "@wordpress/element";
1
+ import { createElement, Fragment } from "@wordpress/element";
2
2
 
3
3
  /**
4
4
  * WordPress dependencies
@@ -11,15 +11,49 @@ import { check } from '@wordpress/icons';
11
11
  import MenuItem from '../menu-item';
12
12
 
13
13
  const noop = () => {};
14
+ /**
15
+ * `MenuItemsChoice` functions similarly to a set of `MenuItem`s, but allows the user to select one option from a set of multiple choices.
16
+ *
17
+ *
18
+ * ```jsx
19
+ * import { MenuGroup, MenuItemsChoice } from '@wordpress/components';
20
+ * import { useState } from '@wordpress/element';
21
+ *
22
+ * const MyMenuItemsChoice = () => {
23
+ * const [ mode, setMode ] = useState( 'visual' );
24
+ * const choices = [
25
+ * {
26
+ * value: 'visual',
27
+ * label: 'Visual editor',
28
+ * },
29
+ * {
30
+ * value: 'text',
31
+ * label: 'Code editor',
32
+ * },
33
+ * ];
34
+ *
35
+ * return (
36
+ * <MenuGroup label="Editor">
37
+ * <MenuItemsChoice
38
+ * choices={ choices }
39
+ * value={ mode }
40
+ * onSelect={ ( newMode ) => setMode( newMode ) }
41
+ * />
42
+ * </MenuGroup>
43
+ * );
44
+ * };
45
+ * ```
46
+ */
14
47
 
15
- export default function MenuItemsChoice(_ref) {
48
+
49
+ function MenuItemsChoice(_ref) {
16
50
  let {
17
51
  choices = [],
18
52
  onHover = noop,
19
53
  onSelect,
20
54
  value
21
55
  } = _ref;
22
- return choices.map(item => {
56
+ return createElement(Fragment, null, choices.map(item => {
23
57
  const isSelected = value === item.value;
24
58
  return createElement(MenuItem, {
25
59
  key: item.value,
@@ -38,6 +72,8 @@ export default function MenuItemsChoice(_ref) {
38
72
  onMouseLeave: () => onHover(null),
39
73
  "aria-label": item['aria-label']
40
74
  }, item.label);
41
- });
75
+ }));
42
76
  }
77
+
78
+ export default MenuItemsChoice;
43
79
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/menu-items-choice/index.js"],"names":["check","MenuItem","noop","MenuItemsChoice","choices","onHover","onSelect","value","map","item","isSelected","info","shortcut","label"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,KAAT,QAAsB,kBAAtB;AAEA;AACA;AACA;;AACA,OAAOC,QAAP,MAAqB,cAArB;;AAEA,MAAMC,IAAI,GAAG,MAAM,CAAE,CAArB;;AAEA,eAAe,SAASC,eAAT,OAKX;AAAA,MALqC;AACxCC,IAAAA,OAAO,GAAG,EAD8B;AAExCC,IAAAA,OAAO,GAAGH,IAF8B;AAGxCI,IAAAA,QAHwC;AAIxCC,IAAAA;AAJwC,GAKrC;AACH,SAAOH,OAAO,CAACI,GAAR,CAAeC,IAAF,IAAY;AAC/B,UAAMC,UAAU,GAAGH,KAAK,KAAKE,IAAI,CAACF,KAAlC;AACA,WACC,cAAC,QAAD;AACC,MAAA,GAAG,EAAGE,IAAI,CAACF,KADZ;AAEC,MAAA,IAAI,EAAC,eAFN;AAGC,MAAA,IAAI,EAAGG,UAAU,IAAIV,KAHtB;AAIC,MAAA,IAAI,EAAGS,IAAI,CAACE,IAJb;AAKC,MAAA,UAAU,EAAGD,UALd;AAMC,MAAA,QAAQ,EAAGD,IAAI,CAACG,QANjB;AAOC,MAAA,SAAS,EAAC,8BAPX;AAQC,MAAA,OAAO,EAAG,MAAM;AACf,YAAK,CAAEF,UAAP,EAAoB;AACnBJ,UAAAA,QAAQ,CAAEG,IAAI,CAACF,KAAP,CAAR;AACA;AACD,OAZF;AAaC,MAAA,YAAY,EAAG,MAAMF,OAAO,CAAEI,IAAI,CAACF,KAAP,CAb7B;AAcC,MAAA,YAAY,EAAG,MAAMF,OAAO,CAAE,IAAF,CAd7B;AAeC,oBAAaI,IAAI,CAAE,YAAF;AAflB,OAiBGA,IAAI,CAACI,KAjBR,CADD;AAqBA,GAvBM,CAAP;AAwBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport MenuItem from '../menu-item';\n\nconst noop = () => {};\n\nexport default function MenuItemsChoice( {\n\tchoices = [],\n\tonHover = noop,\n\tonSelect,\n\tvalue,\n} ) {\n\treturn choices.map( ( item ) => {\n\t\tconst isSelected = value === item.value;\n\t\treturn (\n\t\t\t<MenuItem\n\t\t\t\tkey={ item.value }\n\t\t\t\trole=\"menuitemradio\"\n\t\t\t\ticon={ isSelected && check }\n\t\t\t\tinfo={ item.info }\n\t\t\t\tisSelected={ isSelected }\n\t\t\t\tshortcut={ item.shortcut }\n\t\t\t\tclassName=\"components-menu-items-choice\"\n\t\t\t\tonClick={ () => {\n\t\t\t\t\tif ( ! isSelected ) {\n\t\t\t\t\t\tonSelect( item.value );\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t\tonMouseEnter={ () => onHover( item.value ) }\n\t\t\t\tonMouseLeave={ () => onHover( null ) }\n\t\t\t\taria-label={ item[ 'aria-label' ] }\n\t\t\t>\n\t\t\t\t{ item.label }\n\t\t\t</MenuItem>\n\t\t);\n\t} );\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/menu-items-choice/index.tsx"],"names":["check","MenuItem","noop","MenuItemsChoice","choices","onHover","onSelect","value","map","item","isSelected","info","shortcut","label"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,KAAT,QAAsB,kBAAtB;AAEA;AACA;AACA;;AACA,OAAOC,QAAP,MAAqB,cAArB;;AAGA,MAAMC,IAAI,GAAG,MAAM,CAAE,CAArB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,SAASC,eAAT,OAK0B;AAAA,MALA;AACzBC,IAAAA,OAAO,GAAG,EADe;AAEzBC,IAAAA,OAAO,GAAGH,IAFe;AAGzBI,IAAAA,QAHyB;AAIzBC,IAAAA;AAJyB,GAKA;AACzB,SACC,8BACGH,OAAO,CAACI,GAAR,CAAeC,IAAF,IAAY;AAC1B,UAAMC,UAAU,GAAGH,KAAK,KAAKE,IAAI,CAACF,KAAlC;AACA,WACC,cAAC,QAAD;AACC,MAAA,GAAG,EAAGE,IAAI,CAACF,KADZ;AAEC,MAAA,IAAI,EAAC,eAFN;AAGC,MAAA,IAAI,EAAGG,UAAU,IAAIV,KAHtB;AAIC,MAAA,IAAI,EAAGS,IAAI,CAACE,IAJb;AAKC,MAAA,UAAU,EAAGD,UALd;AAMC,MAAA,QAAQ,EAAGD,IAAI,CAACG,QANjB;AAOC,MAAA,SAAS,EAAC,8BAPX;AAQC,MAAA,OAAO,EAAG,MAAM;AACf,YAAK,CAAEF,UAAP,EAAoB;AACnBJ,UAAAA,QAAQ,CAAEG,IAAI,CAACF,KAAP,CAAR;AACA;AACD,OAZF;AAaC,MAAA,YAAY,EAAG,MAAMF,OAAO,CAAEI,IAAI,CAACF,KAAP,CAb7B;AAcC,MAAA,YAAY,EAAG,MAAMF,OAAO,CAAE,IAAF,CAd7B;AAeC,oBAAaI,IAAI,CAAE,YAAF;AAflB,OAiBGA,IAAI,CAACI,KAjBR,CADD;AAqBA,GAvBC,CADH,CADD;AA4BA;;AAED,eAAeV,eAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport MenuItem from '../menu-item';\nimport type { MenuItemsChoiceProps } from './types';\n\nconst noop = () => {};\n\n/**\n * `MenuItemsChoice` functions similarly to a set of `MenuItem`s, but allows the user to select one option from a set of multiple choices.\n *\n *\n * ```jsx\n * import { MenuGroup, MenuItemsChoice } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyMenuItemsChoice = () => {\n * \tconst [ mode, setMode ] = useState( 'visual' );\n * \tconst choices = [\n * \t\t{\n * \t\t\tvalue: 'visual',\n * \t\t\tlabel: 'Visual editor',\n * \t\t},\n * \t\t{\n * \t\t\tvalue: 'text',\n * \t\t\tlabel: 'Code editor',\n * \t\t},\n * \t];\n *\n * \treturn (\n * \t\t<MenuGroup label=\"Editor\">\n * \t\t\t<MenuItemsChoice\n * \t\t\t\tchoices={ choices }\n * \t\t\t\tvalue={ mode }\n * \t\t\t\tonSelect={ ( newMode ) => setMode( newMode ) }\n * \t\t\t/>\n * \t\t</MenuGroup>\n * \t);\n * };\n * ```\n */\nfunction MenuItemsChoice( {\n\tchoices = [],\n\tonHover = noop,\n\tonSelect,\n\tvalue,\n}: MenuItemsChoiceProps ) {\n\treturn (\n\t\t<>\n\t\t\t{ choices.map( ( item ) => {\n\t\t\t\tconst isSelected = value === item.value;\n\t\t\t\treturn (\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tkey={ item.value }\n\t\t\t\t\t\trole=\"menuitemradio\"\n\t\t\t\t\t\ticon={ isSelected && check }\n\t\t\t\t\t\tinfo={ item.info }\n\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\tshortcut={ item.shortcut }\n\t\t\t\t\t\tclassName=\"components-menu-items-choice\"\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tif ( ! isSelected ) {\n\t\t\t\t\t\t\t\tonSelect( item.value );\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonMouseEnter={ () => onHover( item.value ) }\n\t\t\t\t\t\tonMouseLeave={ () => onHover( null ) }\n\t\t\t\t\t\taria-label={ item[ 'aria-label' ] }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ item.label }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</>\n\t);\n}\n\nexport default MenuItemsChoice;\n"]}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=types.js.map
@@ -9,10 +9,11 @@ import classnames from 'classnames';
9
9
  /**
10
10
  * WordPress dependencies
11
11
  */
12
- import { createPortal, useCallback, useEffect, useRef, useState, forwardRef } from '@wordpress/element';
12
+ import { createPortal, useCallback, useEffect, useRef, useState, forwardRef, useLayoutEffect } from '@wordpress/element';
13
13
  import { useInstanceId, useFocusReturn, useFocusOnMount, __experimentalUseFocusOutside as useFocusOutside, useConstrainedTabbing, useMergeRefs } from '@wordpress/compose';
14
14
  import { __ } from '@wordpress/i18n';
15
15
  import { close } from '@wordpress/icons';
16
+ import { getScrollContainer } from '@wordpress/dom';
16
17
  /**
17
18
  * Internal dependencies
18
19
  */
@@ -57,7 +58,24 @@ function UnforwardedModal(props, forwardedRef) {
57
58
  const constrainedTabbingRef = useConstrainedTabbing();
58
59
  const focusReturnRef = useFocusReturn();
59
60
  const focusOutsideProps = useFocusOutside(onRequestClose);
61
+ const contentRef = useRef(null);
62
+ const childrenContainerRef = useRef(null);
60
63
  const [hasScrolledContent, setHasScrolledContent] = useState(false);
64
+ const [hasScrollableContent, setHasScrollableContent] = useState(false); // Determines whether the Modal content is scrollable and updates the state.
65
+
66
+ const isContentScrollable = useCallback(() => {
67
+ if (!contentRef.current) {
68
+ return;
69
+ }
70
+
71
+ const closestScrollContainer = getScrollContainer(contentRef.current);
72
+
73
+ if (contentRef.current === closestScrollContainer) {
74
+ setHasScrollableContent(true);
75
+ } else {
76
+ setHasScrollableContent(false);
77
+ }
78
+ }, [contentRef]);
61
79
  useEffect(() => {
62
80
  openModalCount++;
63
81
 
@@ -74,7 +92,20 @@ function UnforwardedModal(props, forwardedRef) {
74
92
  ariaHelper.showApp();
75
93
  }
76
94
  };
77
- }, [bodyOpenClassName]);
95
+ }, [bodyOpenClassName]); // Calls the isContentScrollable callback when the Modal children container resizes.
96
+
97
+ useLayoutEffect(() => {
98
+ if (!window.ResizeObserver || !childrenContainerRef.current) {
99
+ return;
100
+ }
101
+
102
+ const resizeObserver = new ResizeObserver(isContentScrollable);
103
+ resizeObserver.observe(childrenContainerRef.current);
104
+ isContentScrollable();
105
+ return () => {
106
+ resizeObserver.disconnect();
107
+ };
108
+ }, [isContentScrollable, childrenContainerRef]);
78
109
 
79
110
  function handleEscapeKeyDown(event) {
80
111
  if ( // Ignore keydowns from IMEs
@@ -128,10 +159,14 @@ function UnforwardedModal(props, forwardedRef) {
128
159
  }), createElement("div", {
129
160
  className: classnames('components-modal__content', {
130
161
  'hide-header': __experimentalHideHeader,
162
+ 'is-scrollable': hasScrollableContent,
131
163
  'has-scrolled-content': hasScrolledContent
132
164
  }),
133
165
  role: "document",
134
- onScroll: onContentContainerScroll
166
+ onScroll: onContentContainerScroll,
167
+ ref: contentRef,
168
+ "aria-label": hasScrollableContent ? __('Scrollable section') : undefined,
169
+ tabIndex: hasScrollableContent ? 0 : undefined
135
170
  }, !__experimentalHideHeader && createElement("div", {
136
171
  className: "components-modal__header"
137
172
  }, createElement("div", {
@@ -146,7 +181,9 @@ function UnforwardedModal(props, forwardedRef) {
146
181
  onClick: onRequestClose,
147
182
  icon: close,
148
183
  label: closeButtonLabel || __('Close')
149
- })), children)))), document.body);
184
+ })), createElement("div", {
185
+ ref: childrenContainerRef
186
+ }, children))))), document.body);
150
187
  }
151
188
  /**
152
189
  * Modals give users information and choices related to a task they’re trying to
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/modal/index.tsx"],"names":["classnames","createPortal","useCallback","useEffect","useRef","useState","forwardRef","useInstanceId","useFocusReturn","useFocusOnMount","__experimentalUseFocusOutside","useFocusOutside","useConstrainedTabbing","useMergeRefs","__","close","ariaHelper","Button","StyleProvider","openModalCount","UnforwardedModal","props","forwardedRef","bodyOpenClassName","role","title","focusOnMount","shouldCloseOnEsc","shouldCloseOnClickOutside","isDismissible","aria","labelledby","undefined","describedby","onRequestClose","icon","closeButtonLabel","children","style","overlayClassName","className","contentLabel","onKeyDown","isFullScreen","__experimentalHideHeader","ref","instanceId","Modal","headingId","focusOnMountRef","constrainedTabbingRef","focusReturnRef","focusOutsideProps","hasScrolledContent","setHasScrolledContent","hideApp","current","document","body","classList","add","remove","showApp","handleEscapeKeyDown","event","nativeEvent","isComposing","keyCode","code","defaultPrevented","preventDefault","onContentContainerScroll","e","scrollY","currentTarget","scrollTop"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type { ForwardedRef, KeyboardEvent, UIEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreatePortal,\n\tuseCallback,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tforwardRef,\n} from '@wordpress/element';\nimport {\n\tuseInstanceId,\n\tuseFocusReturn,\n\tuseFocusOnMount,\n\t__experimentalUseFocusOutside as useFocusOutside,\n\tuseConstrainedTabbing,\n\tuseMergeRefs,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { close } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport * as ariaHelper from './aria-helper';\nimport Button from '../button';\nimport StyleProvider from '../style-provider';\nimport type { ModalProps } from './types';\n\n// Used to count the number of open modals.\nlet openModalCount = 0;\n\nfunction UnforwardedModal(\n\tprops: ModalProps,\n\tforwardedRef: ForwardedRef< HTMLDivElement >\n) {\n\tconst {\n\t\tbodyOpenClassName = 'modal-open',\n\t\trole = 'dialog',\n\t\ttitle = null,\n\t\tfocusOnMount = true,\n\t\tshouldCloseOnEsc = true,\n\t\tshouldCloseOnClickOutside = true,\n\t\tisDismissible = true,\n\t\t/* Accessibility. */\n\t\taria = {\n\t\t\tlabelledby: undefined,\n\t\t\tdescribedby: undefined,\n\t\t},\n\t\tonRequestClose,\n\t\ticon,\n\t\tcloseButtonLabel,\n\t\tchildren,\n\t\tstyle,\n\t\toverlayClassName,\n\t\tclassName,\n\t\tcontentLabel,\n\t\tonKeyDown,\n\t\tisFullScreen = false,\n\t\t__experimentalHideHeader = false,\n\t} = props;\n\n\tconst ref = useRef< HTMLDivElement >();\n\tconst instanceId = useInstanceId( Modal );\n\tconst headingId = title\n\t\t? `components-modal-header-${ instanceId }`\n\t\t: aria.labelledby;\n\tconst focusOnMountRef = useFocusOnMount( focusOnMount );\n\tconst constrainedTabbingRef = useConstrainedTabbing();\n\tconst focusReturnRef = useFocusReturn();\n\tconst focusOutsideProps = useFocusOutside( onRequestClose );\n\n\tconst [ hasScrolledContent, setHasScrolledContent ] = useState( false );\n\n\tuseEffect( () => {\n\t\topenModalCount++;\n\n\t\tif ( openModalCount === 1 ) {\n\t\t\tariaHelper.hideApp( ref.current );\n\t\t\tdocument.body.classList.add( bodyOpenClassName );\n\t\t}\n\n\t\treturn () => {\n\t\t\topenModalCount--;\n\n\t\t\tif ( openModalCount === 0 ) {\n\t\t\t\tdocument.body.classList.remove( bodyOpenClassName );\n\t\t\t\tariaHelper.showApp();\n\t\t\t}\n\t\t};\n\t}, [ bodyOpenClassName ] );\n\n\tfunction handleEscapeKeyDown( event: KeyboardEvent< HTMLDivElement > ) {\n\t\tif (\n\t\t\t// Ignore keydowns from IMEs\n\t\t\tevent.nativeEvent.isComposing ||\n\t\t\t// Workaround for Mac Safari where the final Enter/Backspace of an IME composition\n\t\t\t// is `isComposing=false`, even though it's technically still part of the composition.\n\t\t\t// These can only be detected by keyCode.\n\t\t\tevent.keyCode === 229\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (\n\t\t\tshouldCloseOnEsc &&\n\t\t\tevent.code === 'Escape' &&\n\t\t\t! event.defaultPrevented\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tif ( onRequestClose ) {\n\t\t\t\tonRequestClose( event );\n\t\t\t}\n\t\t}\n\t}\n\n\tconst onContentContainerScroll = useCallback(\n\t\t( e: UIEvent< HTMLDivElement > ) => {\n\t\t\tconst scrollY = e?.currentTarget?.scrollTop ?? -1;\n\n\t\t\tif ( ! hasScrolledContent && scrollY > 0 ) {\n\t\t\t\tsetHasScrolledContent( true );\n\t\t\t} else if ( hasScrolledContent && scrollY <= 0 ) {\n\t\t\t\tsetHasScrolledContent( false );\n\t\t\t}\n\t\t},\n\t\t[ hasScrolledContent ]\n\t);\n\n\treturn createPortal(\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div\n\t\t\tref={ useMergeRefs( [ ref, forwardedRef ] ) }\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-modal__screen-overlay',\n\t\t\t\toverlayClassName\n\t\t\t) }\n\t\t\tonKeyDown={ handleEscapeKeyDown }\n\t\t>\n\t\t\t<StyleProvider document={ document }>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-modal__frame',\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'is-full-screen': isFullScreen,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t\tstyle={ style }\n\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\tconstrainedTabbingRef,\n\t\t\t\t\t\tfocusReturnRef,\n\t\t\t\t\t\tfocusOnMountRef,\n\t\t\t\t\t] ) }\n\t\t\t\t\trole={ role }\n\t\t\t\t\taria-label={ contentLabel }\n\t\t\t\t\taria-labelledby={ contentLabel ? undefined : headingId }\n\t\t\t\t\taria-describedby={ aria.describedby }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\t{ ...( shouldCloseOnClickOutside\n\t\t\t\t\t\t? focusOutsideProps\n\t\t\t\t\t\t: {} ) }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ classnames( 'components-modal__content', {\n\t\t\t\t\t\t\t'hide-header': __experimentalHideHeader,\n\t\t\t\t\t\t\t'has-scrolled-content': hasScrolledContent,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\trole=\"document\"\n\t\t\t\t\t\tonScroll={ onContentContainerScroll }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ! __experimentalHideHeader && (\n\t\t\t\t\t\t\t<div className=\"components-modal__header\">\n\t\t\t\t\t\t\t\t<div className=\"components-modal__header-heading-container\">\n\t\t\t\t\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__icon-container\"\n\t\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ icon }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ title && (\n\t\t\t\t\t\t\t\t\t\t<h1\n\t\t\t\t\t\t\t\t\t\t\tid={ headingId }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__header-heading\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{ isDismissible && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tonClick={ onRequestClose }\n\t\t\t\t\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\tcloseButtonLabel || __( 'Close' )\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</StyleProvider>\n\t\t</div>,\n\t\tdocument.body\n\t);\n}\n\n/**\n * Modals give users information and choices related to a task they’re trying to\n * accomplish. They can contain critical information, require decisions, or\n * involve multiple tasks.\n *\n * ```jsx\n * import { Button, Modal } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyModal = () => {\n * const [ isOpen, setOpen ] = useState( false );\n * const openModal = () => setOpen( true );\n * const closeModal = () => setOpen( false );\n *\n * return (\n * <>\n * <Button variant=\"secondary\" onClick={ openModal }>\n * Open Modal\n * </Button>\n * { isOpen && (\n * <Modal title=\"This is my modal\" onRequestClose={ closeModal }>\n * <Button variant=\"secondary\" onClick={ closeModal }>\n * My custom close button\n * </Button>\n * </Modal>\n * ) }\n * </>\n * );\n * };\n * ```\n */\nexport const Modal = forwardRef( UnforwardedModal );\n\nexport default Modal;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/modal/index.tsx"],"names":["classnames","createPortal","useCallback","useEffect","useRef","useState","forwardRef","useLayoutEffect","useInstanceId","useFocusReturn","useFocusOnMount","__experimentalUseFocusOutside","useFocusOutside","useConstrainedTabbing","useMergeRefs","__","close","getScrollContainer","ariaHelper","Button","StyleProvider","openModalCount","UnforwardedModal","props","forwardedRef","bodyOpenClassName","role","title","focusOnMount","shouldCloseOnEsc","shouldCloseOnClickOutside","isDismissible","aria","labelledby","undefined","describedby","onRequestClose","icon","closeButtonLabel","children","style","overlayClassName","className","contentLabel","onKeyDown","isFullScreen","__experimentalHideHeader","ref","instanceId","Modal","headingId","focusOnMountRef","constrainedTabbingRef","focusReturnRef","focusOutsideProps","contentRef","childrenContainerRef","hasScrolledContent","setHasScrolledContent","hasScrollableContent","setHasScrollableContent","isContentScrollable","current","closestScrollContainer","hideApp","document","body","classList","add","remove","showApp","window","ResizeObserver","resizeObserver","observe","disconnect","handleEscapeKeyDown","event","nativeEvent","isComposing","keyCode","code","defaultPrevented","preventDefault","onContentContainerScroll","e","scrollY","currentTarget","scrollTop"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type { ForwardedRef, KeyboardEvent, UIEvent } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreatePortal,\n\tuseCallback,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tforwardRef,\n\tuseLayoutEffect,\n} from '@wordpress/element';\nimport {\n\tuseInstanceId,\n\tuseFocusReturn,\n\tuseFocusOnMount,\n\t__experimentalUseFocusOutside as useFocusOutside,\n\tuseConstrainedTabbing,\n\tuseMergeRefs,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { close } from '@wordpress/icons';\nimport { getScrollContainer } from '@wordpress/dom';\n\n/**\n * Internal dependencies\n */\nimport * as ariaHelper from './aria-helper';\nimport Button from '../button';\nimport StyleProvider from '../style-provider';\nimport type { ModalProps } from './types';\n\n// Used to count the number of open modals.\nlet openModalCount = 0;\n\nfunction UnforwardedModal(\n\tprops: ModalProps,\n\tforwardedRef: ForwardedRef< HTMLDivElement >\n) {\n\tconst {\n\t\tbodyOpenClassName = 'modal-open',\n\t\trole = 'dialog',\n\t\ttitle = null,\n\t\tfocusOnMount = true,\n\t\tshouldCloseOnEsc = true,\n\t\tshouldCloseOnClickOutside = true,\n\t\tisDismissible = true,\n\t\t/* Accessibility. */\n\t\taria = {\n\t\t\tlabelledby: undefined,\n\t\t\tdescribedby: undefined,\n\t\t},\n\t\tonRequestClose,\n\t\ticon,\n\t\tcloseButtonLabel,\n\t\tchildren,\n\t\tstyle,\n\t\toverlayClassName,\n\t\tclassName,\n\t\tcontentLabel,\n\t\tonKeyDown,\n\t\tisFullScreen = false,\n\t\t__experimentalHideHeader = false,\n\t} = props;\n\n\tconst ref = useRef< HTMLDivElement >();\n\tconst instanceId = useInstanceId( Modal );\n\tconst headingId = title\n\t\t? `components-modal-header-${ instanceId }`\n\t\t: aria.labelledby;\n\tconst focusOnMountRef = useFocusOnMount( focusOnMount );\n\tconst constrainedTabbingRef = useConstrainedTabbing();\n\tconst focusReturnRef = useFocusReturn();\n\tconst focusOutsideProps = useFocusOutside( onRequestClose );\n\tconst contentRef = useRef< HTMLDivElement >( null );\n\tconst childrenContainerRef = useRef< HTMLDivElement >( null );\n\n\tconst [ hasScrolledContent, setHasScrolledContent ] = useState( false );\n\tconst [ hasScrollableContent, setHasScrollableContent ] = useState( false );\n\n\t// Determines whether the Modal content is scrollable and updates the state.\n\tconst isContentScrollable = useCallback( () => {\n\t\tif ( ! contentRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst closestScrollContainer = getScrollContainer( contentRef.current );\n\n\t\tif ( contentRef.current === closestScrollContainer ) {\n\t\t\tsetHasScrollableContent( true );\n\t\t} else {\n\t\t\tsetHasScrollableContent( false );\n\t\t}\n\t}, [ contentRef ] );\n\n\tuseEffect( () => {\n\t\topenModalCount++;\n\n\t\tif ( openModalCount === 1 ) {\n\t\t\tariaHelper.hideApp( ref.current );\n\t\t\tdocument.body.classList.add( bodyOpenClassName );\n\t\t}\n\n\t\treturn () => {\n\t\t\topenModalCount--;\n\n\t\t\tif ( openModalCount === 0 ) {\n\t\t\t\tdocument.body.classList.remove( bodyOpenClassName );\n\t\t\t\tariaHelper.showApp();\n\t\t\t}\n\t\t};\n\t}, [ bodyOpenClassName ] );\n\n\t// Calls the isContentScrollable callback when the Modal children container resizes.\n\tuseLayoutEffect( () => {\n\t\tif ( ! window.ResizeObserver || ! childrenContainerRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst resizeObserver = new ResizeObserver( isContentScrollable );\n\t\tresizeObserver.observe( childrenContainerRef.current );\n\n\t\tisContentScrollable();\n\n\t\treturn () => {\n\t\t\tresizeObserver.disconnect();\n\t\t};\n\t}, [ isContentScrollable, childrenContainerRef ] );\n\n\tfunction handleEscapeKeyDown( event: KeyboardEvent< HTMLDivElement > ) {\n\t\tif (\n\t\t\t// Ignore keydowns from IMEs\n\t\t\tevent.nativeEvent.isComposing ||\n\t\t\t// Workaround for Mac Safari where the final Enter/Backspace of an IME composition\n\t\t\t// is `isComposing=false`, even though it's technically still part of the composition.\n\t\t\t// These can only be detected by keyCode.\n\t\t\tevent.keyCode === 229\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (\n\t\t\tshouldCloseOnEsc &&\n\t\t\tevent.code === 'Escape' &&\n\t\t\t! event.defaultPrevented\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tif ( onRequestClose ) {\n\t\t\t\tonRequestClose( event );\n\t\t\t}\n\t\t}\n\t}\n\n\tconst onContentContainerScroll = useCallback(\n\t\t( e: UIEvent< HTMLDivElement > ) => {\n\t\t\tconst scrollY = e?.currentTarget?.scrollTop ?? -1;\n\n\t\t\tif ( ! hasScrolledContent && scrollY > 0 ) {\n\t\t\t\tsetHasScrolledContent( true );\n\t\t\t} else if ( hasScrolledContent && scrollY <= 0 ) {\n\t\t\t\tsetHasScrolledContent( false );\n\t\t\t}\n\t\t},\n\t\t[ hasScrolledContent ]\n\t);\n\n\treturn createPortal(\n\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions\n\t\t<div\n\t\t\tref={ useMergeRefs( [ ref, forwardedRef ] ) }\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-modal__screen-overlay',\n\t\t\t\toverlayClassName\n\t\t\t) }\n\t\t\tonKeyDown={ handleEscapeKeyDown }\n\t\t>\n\t\t\t<StyleProvider document={ document }>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-modal__frame',\n\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'is-full-screen': isFullScreen,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t\tstyle={ style }\n\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\tconstrainedTabbingRef,\n\t\t\t\t\t\tfocusReturnRef,\n\t\t\t\t\t\tfocusOnMountRef,\n\t\t\t\t\t] ) }\n\t\t\t\t\trole={ role }\n\t\t\t\t\taria-label={ contentLabel }\n\t\t\t\t\taria-labelledby={ contentLabel ? undefined : headingId }\n\t\t\t\t\taria-describedby={ aria.describedby }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t\t{ ...( shouldCloseOnClickOutside\n\t\t\t\t\t\t? focusOutsideProps\n\t\t\t\t\t\t: {} ) }\n\t\t\t\t\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ classnames( 'components-modal__content', {\n\t\t\t\t\t\t\t'hide-header': __experimentalHideHeader,\n\t\t\t\t\t\t\t'is-scrollable': hasScrollableContent,\n\t\t\t\t\t\t\t'has-scrolled-content': hasScrolledContent,\n\t\t\t\t\t\t} ) }\n\t\t\t\t\t\trole=\"document\"\n\t\t\t\t\t\tonScroll={ onContentContainerScroll }\n\t\t\t\t\t\tref={ contentRef }\n\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\thasScrollableContent\n\t\t\t\t\t\t\t\t? __( 'Scrollable section' )\n\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\ttabIndex={ hasScrollableContent ? 0 : undefined }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ ! __experimentalHideHeader && (\n\t\t\t\t\t\t\t<div className=\"components-modal__header\">\n\t\t\t\t\t\t\t\t<div className=\"components-modal__header-heading-container\">\n\t\t\t\t\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__icon-container\"\n\t\t\t\t\t\t\t\t\t\t\taria-hidden\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ icon }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t{ title && (\n\t\t\t\t\t\t\t\t\t\t<h1\n\t\t\t\t\t\t\t\t\t\t\tid={ headingId }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-modal__header-heading\"\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t\t\t\t</h1>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t{ isDismissible && (\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tonClick={ onRequestClose }\n\t\t\t\t\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\tcloseButtonLabel || __( 'Close' )\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t<div ref={ childrenContainerRef }>{ children }</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</StyleProvider>\n\t\t</div>,\n\t\tdocument.body\n\t);\n}\n\n/**\n * Modals give users information and choices related to a task they’re trying to\n * accomplish. They can contain critical information, require decisions, or\n * involve multiple tasks.\n *\n * ```jsx\n * import { Button, Modal } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyModal = () => {\n * const [ isOpen, setOpen ] = useState( false );\n * const openModal = () => setOpen( true );\n * const closeModal = () => setOpen( false );\n *\n * return (\n * <>\n * <Button variant=\"secondary\" onClick={ openModal }>\n * Open Modal\n * </Button>\n * { isOpen && (\n * <Modal title=\"This is my modal\" onRequestClose={ closeModal }>\n * <Button variant=\"secondary\" onClick={ closeModal }>\n * My custom close button\n * </Button>\n * </Modal>\n * ) }\n * </>\n * );\n * };\n * ```\n */\nexport const Modal = forwardRef( UnforwardedModal );\n\nexport default Modal;\n"]}
@@ -247,6 +247,7 @@ export default function PaletteEdit(_ref6) {
247
247
  colors = EMPTY_ARRAY,
248
248
  onChange,
249
249
  paletteLabel,
250
+ paletteLabelHeadingLevel = 2,
250
251
  emptyMessage,
251
252
  canOnlyChangeValues,
252
253
  canReset,
@@ -270,7 +271,9 @@ export default function PaletteEdit(_ref6) {
270
271
  setIsEditing(true);
271
272
  }
272
273
  }, [isGradient, elements]);
273
- return createElement(PaletteEditStyles, null, createElement(PaletteHStackHeader, null, createElement(PaletteHeading, null, paletteLabel), createElement(PaletteActionsContainer, null, hasElements && isEditing && createElement(DoneButton, {
274
+ return createElement(PaletteEditStyles, null, createElement(PaletteHStackHeader, null, createElement(PaletteHeading, {
275
+ level: paletteLabelHeadingLevel
276
+ }, paletteLabel), createElement(PaletteActionsContainer, null, hasElements && isEditing && createElement(DoneButton, {
274
277
  isSmall: true,
275
278
  onClick: () => {
276
279
  setIsEditing(false);