@wordpress/components 28.11.0 → 28.13.1-next.082ed6819.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 (514) hide show
  1. package/CHANGELOG.md +68 -0
  2. package/build/autocomplete/autocompleter-ui.js +1 -0
  3. package/build/autocomplete/autocompleter-ui.js.map +1 -1
  4. package/build/border-box-control/border-box-control/component.js +1 -0
  5. package/build/border-box-control/border-box-control/component.js.map +1 -1
  6. package/build/border-box-control/border-box-control-split-controls/component.js +2 -1
  7. package/build/border-box-control/border-box-control-split-controls/component.js.map +1 -1
  8. package/build/border-control/border-control/component.js +2 -1
  9. package/build/border-control/border-control/component.js.map +1 -1
  10. package/build/border-control/border-control/hook.js +3 -1
  11. package/build/border-control/border-control/hook.js.map +1 -1
  12. package/build/border-control/border-control-dropdown/component.js +1 -1
  13. package/build/border-control/border-control-dropdown/component.js.map +1 -1
  14. package/build/border-control/types.js.map +1 -1
  15. package/build/box-control/all-input-control.js +1 -0
  16. package/build/box-control/all-input-control.js.map +1 -1
  17. package/build/box-control/axial-input-controls.js +1 -0
  18. package/build/box-control/axial-input-controls.js.map +1 -1
  19. package/build/box-control/input-controls.js +1 -0
  20. package/build/box-control/input-controls.js.map +1 -1
  21. package/build/color-palette/index.js +2 -0
  22. package/build/color-palette/index.js.map +1 -1
  23. package/build/color-picker/color-copy-button.js +6 -4
  24. package/build/color-picker/color-copy-button.js.map +1 -1
  25. package/build/color-picker/component.js +1 -0
  26. package/build/color-picker/component.js.map +1 -1
  27. package/build/color-picker/styles.js +21 -28
  28. package/build/color-picker/styles.js.map +1 -1
  29. package/build/combobox-control/index.js +17 -12
  30. package/build/combobox-control/index.js.map +1 -1
  31. package/build/composite/hover.js +1 -1
  32. package/build/composite/hover.js.map +1 -1
  33. package/build/composite/typeahead.js +1 -1
  34. package/build/composite/typeahead.js.map +1 -1
  35. package/build/dashicon/types.js.map +1 -1
  36. package/build/dimension-control/index.js +7 -0
  37. package/build/dimension-control/index.js.map +1 -1
  38. package/build/disabled/index.js +8 -1
  39. package/build/disabled/index.js.map +1 -1
  40. package/build/duotone-picker/duotone-picker.js +2 -0
  41. package/build/duotone-picker/duotone-picker.js.map +1 -1
  42. package/build/font-size-picker/font-size-picker-toggle-group.js +1 -0
  43. package/build/font-size-picker/font-size-picker-toggle-group.js.map +1 -1
  44. package/build/font-size-picker/index.js +7 -0
  45. package/build/font-size-picker/index.js.map +1 -1
  46. package/build/form-file-upload/index.js +7 -1
  47. package/build/form-file-upload/index.js.map +1 -1
  48. package/build/form-token-field/token.js +1 -0
  49. package/build/form-token-field/token.js.map +1 -1
  50. package/build/gradient-picker/index.js +34 -32
  51. package/build/gradient-picker/index.js.map +1 -1
  52. package/build/gradient-picker/types.js.map +1 -1
  53. package/build/guide/page-control.js +1 -0
  54. package/build/guide/page-control.js.map +1 -1
  55. package/build/menu/styles.js +16 -16
  56. package/build/menu/styles.js.map +1 -1
  57. package/build/menu-item/index.js +1 -0
  58. package/build/menu-item/index.js.map +1 -1
  59. package/build/modal/index.js +2 -2
  60. package/build/modal/index.js.map +1 -1
  61. package/build/notice/index.js +2 -0
  62. package/build/notice/index.js.map +1 -1
  63. package/build/palette-edit/index.js +5 -0
  64. package/build/palette-edit/index.js.map +1 -1
  65. package/build/panel/body.js +1 -0
  66. package/build/panel/body.js.map +1 -1
  67. package/build/popover/index.js +4 -1
  68. package/build/popover/index.js.map +1 -1
  69. package/build/private-apis.js +0 -2
  70. package/build/private-apis.js.map +1 -1
  71. package/build/radio-group/radio.js +6 -0
  72. package/build/radio-group/radio.js.map +1 -1
  73. package/build/radio-group/types.js.map +1 -1
  74. package/build/range-control/index.js +11 -0
  75. package/build/range-control/index.js.map +1 -1
  76. package/build/range-control/types.js.map +1 -1
  77. package/build/slot-fill/bubbles-virtually/fill.js +14 -31
  78. package/build/slot-fill/bubbles-virtually/fill.js.map +1 -1
  79. package/build/slot-fill/bubbles-virtually/slot-fill-provider.js +13 -4
  80. package/build/slot-fill/bubbles-virtually/slot-fill-provider.js.map +1 -1
  81. package/build/slot-fill/bubbles-virtually/slot.js +11 -9
  82. package/build/slot-fill/bubbles-virtually/slot.js.map +1 -1
  83. package/build/slot-fill/bubbles-virtually/use-slot.js +1 -8
  84. package/build/slot-fill/bubbles-virtually/use-slot.js.map +1 -1
  85. package/build/slot-fill/fill.js +7 -24
  86. package/build/slot-fill/fill.js.map +1 -1
  87. package/build/slot-fill/index.js +5 -10
  88. package/build/slot-fill/index.js.map +1 -1
  89. package/build/slot-fill/provider.js +2 -2
  90. package/build/slot-fill/provider.js.map +1 -1
  91. package/build/slot-fill/slot.js +37 -77
  92. package/build/slot-fill/slot.js.map +1 -1
  93. package/build/slot-fill/types.js.map +1 -1
  94. package/build/snackbar/index.js +2 -1
  95. package/build/snackbar/index.js.map +1 -1
  96. package/build/tabs/tablist.js +13 -2
  97. package/build/tabs/tablist.js.map +1 -1
  98. package/build/text-control/index.js +7 -0
  99. package/build/text-control/index.js.map +1 -1
  100. package/build/toggle-group-control/toggle-group-control/component.js +10 -1
  101. package/build/toggle-group-control/toggle-group-control/component.js.map +1 -1
  102. package/build/toggle-group-control/toggle-group-control-option/component.js +1 -0
  103. package/build/toggle-group-control/toggle-group-control-option/component.js.map +1 -1
  104. package/build/toggle-group-control/toggle-group-control-option-icon/component.js +1 -1
  105. package/build/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -1
  106. package/build/toggle-group-control/types.js.map +1 -1
  107. package/build/utils/deprecated-36px-size.js +3 -2
  108. package/build/utils/deprecated-36px-size.js.map +1 -1
  109. package/build-module/autocomplete/autocompleter-ui.js +1 -0
  110. package/build-module/autocomplete/autocompleter-ui.js.map +1 -1
  111. package/build-module/border-box-control/border-box-control/component.js +1 -0
  112. package/build-module/border-box-control/border-box-control/component.js.map +1 -1
  113. package/build-module/border-box-control/border-box-control-split-controls/component.js +2 -1
  114. package/build-module/border-box-control/border-box-control-split-controls/component.js.map +1 -1
  115. package/build-module/border-control/border-control/component.js +2 -1
  116. package/build-module/border-control/border-control/component.js.map +1 -1
  117. package/build-module/border-control/border-control/hook.js +3 -1
  118. package/build-module/border-control/border-control/hook.js.map +1 -1
  119. package/build-module/border-control/border-control-dropdown/component.js +1 -1
  120. package/build-module/border-control/border-control-dropdown/component.js.map +1 -1
  121. package/build-module/border-control/types.js.map +1 -1
  122. package/build-module/box-control/all-input-control.js +1 -0
  123. package/build-module/box-control/all-input-control.js.map +1 -1
  124. package/build-module/box-control/axial-input-controls.js +1 -0
  125. package/build-module/box-control/axial-input-controls.js.map +1 -1
  126. package/build-module/box-control/input-controls.js +1 -0
  127. package/build-module/box-control/input-controls.js.map +1 -1
  128. package/build-module/color-palette/index.js +2 -0
  129. package/build-module/color-palette/index.js.map +1 -1
  130. package/build-module/color-picker/color-copy-button.js +6 -4
  131. package/build-module/color-picker/color-copy-button.js.map +1 -1
  132. package/build-module/color-picker/component.js +1 -0
  133. package/build-module/color-picker/component.js.map +1 -1
  134. package/build-module/color-picker/styles.js +20 -27
  135. package/build-module/color-picker/styles.js.map +1 -1
  136. package/build-module/combobox-control/index.js +18 -13
  137. package/build-module/combobox-control/index.js.map +1 -1
  138. package/build-module/composite/hover.js +1 -1
  139. package/build-module/composite/hover.js.map +1 -1
  140. package/build-module/composite/typeahead.js +1 -1
  141. package/build-module/composite/typeahead.js.map +1 -1
  142. package/build-module/dashicon/types.js.map +1 -1
  143. package/build-module/dimension-control/index.js +7 -0
  144. package/build-module/dimension-control/index.js.map +1 -1
  145. package/build-module/disabled/index.js +8 -1
  146. package/build-module/disabled/index.js.map +1 -1
  147. package/build-module/duotone-picker/duotone-picker.js +2 -0
  148. package/build-module/duotone-picker/duotone-picker.js.map +1 -1
  149. package/build-module/font-size-picker/font-size-picker-toggle-group.js +1 -0
  150. package/build-module/font-size-picker/font-size-picker-toggle-group.js.map +1 -1
  151. package/build-module/font-size-picker/index.js +7 -0
  152. package/build-module/font-size-picker/index.js.map +1 -1
  153. package/build-module/form-file-upload/index.js +7 -1
  154. package/build-module/form-file-upload/index.js.map +1 -1
  155. package/build-module/form-token-field/token.js +1 -0
  156. package/build-module/form-token-field/token.js.map +1 -1
  157. package/build-module/gradient-picker/index.js +34 -32
  158. package/build-module/gradient-picker/index.js.map +1 -1
  159. package/build-module/gradient-picker/types.js.map +1 -1
  160. package/build-module/guide/page-control.js +1 -0
  161. package/build-module/guide/page-control.js.map +1 -1
  162. package/build-module/menu/styles.js +16 -16
  163. package/build-module/menu/styles.js.map +1 -1
  164. package/build-module/menu-item/index.js +1 -0
  165. package/build-module/menu-item/index.js.map +1 -1
  166. package/build-module/modal/index.js +2 -2
  167. package/build-module/modal/index.js.map +1 -1
  168. package/build-module/notice/index.js +2 -0
  169. package/build-module/notice/index.js.map +1 -1
  170. package/build-module/palette-edit/index.js +5 -0
  171. package/build-module/palette-edit/index.js.map +1 -1
  172. package/build-module/panel/body.js +1 -0
  173. package/build-module/panel/body.js.map +1 -1
  174. package/build-module/popover/index.js +4 -1
  175. package/build-module/popover/index.js.map +1 -1
  176. package/build-module/private-apis.js +0 -2
  177. package/build-module/private-apis.js.map +1 -1
  178. package/build-module/radio-group/radio.js +6 -0
  179. package/build-module/radio-group/radio.js.map +1 -1
  180. package/build-module/radio-group/types.js.map +1 -1
  181. package/build-module/range-control/index.js +11 -0
  182. package/build-module/range-control/index.js.map +1 -1
  183. package/build-module/range-control/types.js.map +1 -1
  184. package/build-module/slot-fill/bubbles-virtually/fill.js +15 -32
  185. package/build-module/slot-fill/bubbles-virtually/fill.js.map +1 -1
  186. package/build-module/slot-fill/bubbles-virtually/slot-fill-provider.js +13 -4
  187. package/build-module/slot-fill/bubbles-virtually/slot-fill-provider.js.map +1 -1
  188. package/build-module/slot-fill/bubbles-virtually/slot.js +11 -9
  189. package/build-module/slot-fill/bubbles-virtually/slot.js.map +1 -1
  190. package/build-module/slot-fill/bubbles-virtually/use-slot.js +2 -9
  191. package/build-module/slot-fill/bubbles-virtually/use-slot.js.map +1 -1
  192. package/build-module/slot-fill/fill.js +7 -24
  193. package/build-module/slot-fill/fill.js.map +1 -1
  194. package/build-module/slot-fill/index.js +5 -8
  195. package/build-module/slot-fill/index.js.map +1 -1
  196. package/build-module/slot-fill/provider.js +2 -3
  197. package/build-module/slot-fill/provider.js.map +1 -1
  198. package/build-module/slot-fill/slot.js +38 -78
  199. package/build-module/slot-fill/slot.js.map +1 -1
  200. package/build-module/slot-fill/types.js.map +1 -1
  201. package/build-module/snackbar/index.js +2 -1
  202. package/build-module/snackbar/index.js.map +1 -1
  203. package/build-module/tabs/tablist.js +13 -2
  204. package/build-module/tabs/tablist.js.map +1 -1
  205. package/build-module/text-control/index.js +7 -0
  206. package/build-module/text-control/index.js.map +1 -1
  207. package/build-module/toggle-group-control/toggle-group-control/component.js +10 -1
  208. package/build-module/toggle-group-control/toggle-group-control/component.js.map +1 -1
  209. package/build-module/toggle-group-control/toggle-group-control-option/component.js +1 -0
  210. package/build-module/toggle-group-control/toggle-group-control-option/component.js.map +1 -1
  211. package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js +1 -1
  212. package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -1
  213. package/build-module/toggle-group-control/types.js.map +1 -1
  214. package/build-module/utils/deprecated-36px-size.js +3 -2
  215. package/build-module/utils/deprecated-36px-size.js.map +1 -1
  216. package/build-style/style-rtl.css +15 -36
  217. package/build-style/style.css +15 -36
  218. package/build-types/autocomplete/autocompleter-ui.d.ts.map +1 -1
  219. package/build-types/base-control/stories/index.story.d.ts.map +1 -1
  220. package/build-types/border-box-control/border-box-control/component.d.ts.map +1 -1
  221. package/build-types/border-box-control/border-box-control-split-controls/component.d.ts.map +1 -1
  222. package/build-types/border-control/border-control/component.d.ts +1 -0
  223. package/build-types/border-control/border-control/component.d.ts.map +1 -1
  224. package/build-types/border-control/border-control/hook.d.ts.map +1 -1
  225. package/build-types/border-control/border-control-dropdown/component.d.ts.map +1 -1
  226. package/build-types/border-control/border-control-style-picker/component.d.ts.map +1 -1
  227. package/build-types/border-control/stories/index.story.d.ts +10 -5
  228. package/build-types/border-control/stories/index.story.d.ts.map +1 -1
  229. package/build-types/border-control/types.d.ts +7 -0
  230. package/build-types/border-control/types.d.ts.map +1 -1
  231. package/build-types/box-control/all-input-control.d.ts.map +1 -1
  232. package/build-types/box-control/axial-input-controls.d.ts.map +1 -1
  233. package/build-types/box-control/input-controls.d.ts.map +1 -1
  234. package/build-types/box-control/styles/box-control-styles.d.ts +2 -1
  235. package/build-types/box-control/styles/box-control-styles.d.ts.map +1 -1
  236. package/build-types/checkbox-control/stories/index.story.d.ts.map +1 -1
  237. package/build-types/circular-option-picker/stories/index.story.d.ts.map +1 -1
  238. package/build-types/color-indicator/stories/index.story.d.ts.map +1 -1
  239. package/build-types/color-palette/index.d.ts.map +1 -1
  240. package/build-types/color-palette/stories/index.story.d.ts.map +1 -1
  241. package/build-types/color-picker/color-copy-button.d.ts.map +1 -1
  242. package/build-types/color-picker/component.d.ts.map +1 -1
  243. package/build-types/color-picker/stories/index.story.d.ts.map +1 -1
  244. package/build-types/color-picker/styles.d.ts +2 -4
  245. package/build-types/color-picker/styles.d.ts.map +1 -1
  246. package/build-types/combobox-control/index.d.ts +1 -0
  247. package/build-types/combobox-control/index.d.ts.map +1 -1
  248. package/build-types/combobox-control/stories/index.story.d.ts.map +1 -1
  249. package/build-types/composite/typeahead.d.ts.map +1 -1
  250. package/build-types/confirm-dialog/stories/index.story.d.ts.map +1 -1
  251. package/build-types/custom-gradient-picker/stories/index.story.d.ts.map +1 -1
  252. package/build-types/custom-select-control/stories/index.story.d.ts.map +1 -1
  253. package/build-types/custom-select-control-v2/stories/index.story.d.ts.map +1 -1
  254. package/build-types/dashicon/types.d.ts +1 -1
  255. package/build-types/dashicon/types.d.ts.map +1 -1
  256. package/build-types/date-time/stories/date-time.story.d.ts.map +1 -1
  257. package/build-types/date-time/stories/date.story.d.ts.map +1 -1
  258. package/build-types/date-time/stories/time.story.d.ts.map +1 -1
  259. package/build-types/dimension-control/index.d.ts +1 -0
  260. package/build-types/dimension-control/index.d.ts.map +1 -1
  261. package/build-types/disabled/index.d.ts +8 -1
  262. package/build-types/disabled/index.d.ts.map +1 -1
  263. package/build-types/disabled/stories/index.story.d.ts.map +1 -1
  264. package/build-types/drop-zone/stories/index.story.d.ts.map +1 -1
  265. package/build-types/dropdown/stories/index.story.d.ts.map +1 -1
  266. package/build-types/dropdown-menu/stories/index.story.d.ts.map +1 -1
  267. package/build-types/duotone-picker/duotone-picker.d.ts.map +1 -1
  268. package/build-types/external-link/stories/index.story.d.ts.map +1 -1
  269. package/build-types/font-size-picker/font-size-picker-toggle-group.d.ts.map +1 -1
  270. package/build-types/font-size-picker/index.d.ts.map +1 -1
  271. package/build-types/font-size-picker/stories/index.story.d.ts.map +1 -1
  272. package/build-types/form-file-upload/index.d.ts.map +1 -1
  273. package/build-types/form-file-upload/stories/index.story.d.ts.map +1 -1
  274. package/build-types/form-token-field/stories/index.story.d.ts.map +1 -1
  275. package/build-types/form-token-field/token.d.ts.map +1 -1
  276. package/build-types/gradient-picker/index.d.ts +32 -32
  277. package/build-types/gradient-picker/index.d.ts.map +1 -1
  278. package/build-types/gradient-picker/stories/index.story.d.ts.map +1 -1
  279. package/build-types/gradient-picker/types.d.ts +1 -5
  280. package/build-types/gradient-picker/types.d.ts.map +1 -1
  281. package/build-types/guide/page-control.d.ts.map +1 -1
  282. package/build-types/h-stack/stories/index.story.d.ts.map +1 -1
  283. package/build-types/heading/stories/index.story.d.ts.map +1 -1
  284. package/build-types/input-control/stories/index.story.d.ts.map +1 -1
  285. package/build-types/lock-unlock.d.ts +2 -2
  286. package/build-types/menu/stories/index.story.d.ts.map +1 -1
  287. package/build-types/menu-group/stories/index.story.d.ts.map +1 -1
  288. package/build-types/menu-item/index.d.ts.map +1 -1
  289. package/build-types/menu-item/stories/index.story.d.ts.map +1 -1
  290. package/build-types/menu-items-choice/stories/index.story.d.ts.map +1 -1
  291. package/build-types/modal/stories/index.story.d.ts.map +1 -1
  292. package/build-types/navigator/stories/index.story.d.ts.map +1 -1
  293. package/build-types/notice/index.d.ts.map +1 -1
  294. package/build-types/notice/stories/index.story.d.ts.map +1 -1
  295. package/build-types/number-control/stories/index.story.d.ts.map +1 -1
  296. package/build-types/palette-edit/index.d.ts.map +1 -1
  297. package/build-types/panel/body.d.ts.map +1 -1
  298. package/build-types/placeholder/stories/index.story.d.ts.map +1 -1
  299. package/build-types/popover/index.d.ts.map +1 -1
  300. package/build-types/popover/stories/index.story.d.ts.map +1 -1
  301. package/build-types/private-apis.d.ts.map +1 -1
  302. package/build-types/progress-bar/stories/index.story.d.ts.map +1 -1
  303. package/build-types/radio-control/stories/index.story.d.ts.map +1 -1
  304. package/build-types/radio-group/radio.d.ts +4 -2
  305. package/build-types/radio-group/radio.d.ts.map +1 -1
  306. package/build-types/radio-group/stories/index.story.d.ts.map +1 -1
  307. package/build-types/radio-group/types.d.ts +5 -1
  308. package/build-types/radio-group/types.d.ts.map +1 -1
  309. package/build-types/range-control/index.d.ts +3 -1
  310. package/build-types/range-control/index.d.ts.map +1 -1
  311. package/build-types/range-control/stories/index.story.d.ts.map +1 -1
  312. package/build-types/range-control/types.d.ts +7 -0
  313. package/build-types/range-control/types.d.ts.map +1 -1
  314. package/build-types/responsive-wrapper/stories/index.story.d.ts.map +1 -1
  315. package/build-types/search-control/stories/index.story.d.ts.map +1 -1
  316. package/build-types/select-control/stories/index.story.d.ts.map +1 -1
  317. package/build-types/slot-fill/bubbles-virtually/fill.d.ts +1 -1
  318. package/build-types/slot-fill/bubbles-virtually/fill.d.ts.map +1 -1
  319. package/build-types/slot-fill/bubbles-virtually/slot-fill-provider.d.ts.map +1 -1
  320. package/build-types/slot-fill/bubbles-virtually/slot.d.ts.map +1 -1
  321. package/build-types/slot-fill/bubbles-virtually/use-slot-fills.d.ts +1 -1
  322. package/build-types/slot-fill/bubbles-virtually/use-slot-fills.d.ts.map +1 -1
  323. package/build-types/slot-fill/bubbles-virtually/use-slot.d.ts +3 -7
  324. package/build-types/slot-fill/bubbles-virtually/use-slot.d.ts.map +1 -1
  325. package/build-types/slot-fill/fill.d.ts.map +1 -1
  326. package/build-types/slot-fill/index.d.ts +5 -12
  327. package/build-types/slot-fill/index.d.ts.map +1 -1
  328. package/build-types/slot-fill/provider.d.ts.map +1 -1
  329. package/build-types/slot-fill/slot.d.ts +1 -1
  330. package/build-types/slot-fill/slot.d.ts.map +1 -1
  331. package/build-types/slot-fill/types.d.ts +15 -18
  332. package/build-types/slot-fill/types.d.ts.map +1 -1
  333. package/build-types/slot-fill/use-slot.d.ts +1 -1
  334. package/build-types/slot-fill/use-slot.d.ts.map +1 -1
  335. package/build-types/snackbar/index.d.ts.map +1 -1
  336. package/build-types/snackbar/stories/index.story.d.ts.map +1 -1
  337. package/build-types/snackbar/stories/list.story.d.ts.map +1 -1
  338. package/build-types/spinner/stories/index.story.d.ts.map +1 -1
  339. package/build-types/tabs/tablist.d.ts.map +1 -1
  340. package/build-types/text/stories/index.story.d.ts.map +1 -1
  341. package/build-types/text-control/index.d.ts +1 -0
  342. package/build-types/text-control/index.d.ts.map +1 -1
  343. package/build-types/text-control/stories/index.story.d.ts.map +1 -1
  344. package/build-types/text-highlight/stories/index.story.d.ts.map +1 -1
  345. package/build-types/textarea-control/stories/index.story.d.ts.map +1 -1
  346. package/build-types/tip/stories/index.story.d.ts.map +1 -1
  347. package/build-types/toggle-control/stories/index.story.d.ts.map +1 -1
  348. package/build-types/toggle-group-control/stories/index.story.d.ts.map +1 -1
  349. package/build-types/toggle-group-control/toggle-group-control/component.d.ts +2 -0
  350. package/build-types/toggle-group-control/toggle-group-control/component.d.ts.map +1 -1
  351. package/build-types/toggle-group-control/toggle-group-control-option/component.d.ts +1 -0
  352. package/build-types/toggle-group-control/toggle-group-control-option/component.d.ts.map +1 -1
  353. package/build-types/toggle-group-control/toggle-group-control-option-icon/component.d.ts +1 -1
  354. package/build-types/toggle-group-control/types.d.ts +7 -0
  355. package/build-types/toggle-group-control/types.d.ts.map +1 -1
  356. package/build-types/tools-panel/stories/index.story.d.ts.map +1 -1
  357. package/build-types/tooltip/stories/index.story.d.ts.map +1 -1
  358. package/build-types/tree-grid/stories/index.story.d.ts.map +1 -1
  359. package/build-types/tree-select/stories/index.story.d.ts.map +1 -1
  360. package/build-types/truncate/stories/index.story.d.ts.map +1 -1
  361. package/build-types/unit-control/stories/index.story.d.ts.map +1 -1
  362. package/build-types/utils/deprecated-36px-size.d.ts +3 -2
  363. package/build-types/utils/deprecated-36px-size.d.ts.map +1 -1
  364. package/build-types/v-stack/stories/index.story.d.ts.map +1 -1
  365. package/package.json +21 -21
  366. package/src/autocomplete/autocompleter-ui.tsx +1 -0
  367. package/src/base-control/stories/index.story.tsx +2 -1
  368. package/src/border-box-control/border-box-control/component.tsx +1 -0
  369. package/src/border-box-control/border-box-control-split-controls/component.tsx +1 -0
  370. package/src/border-control/border-control/component.tsx +1 -0
  371. package/src/border-control/border-control/hook.ts +2 -0
  372. package/src/border-control/border-control-dropdown/component.tsx +1 -1
  373. package/src/border-control/types.ts +7 -0
  374. package/src/box-control/all-input-control.tsx +1 -0
  375. package/src/box-control/axial-input-controls.tsx +1 -0
  376. package/src/box-control/input-controls.tsx +1 -0
  377. package/src/checkbox-control/stories/index.story.tsx +2 -1
  378. package/src/circular-option-picker/stories/index.story.tsx +2 -1
  379. package/src/color-indicator/stories/index.story.tsx +2 -1
  380. package/src/color-palette/index.tsx +5 -1
  381. package/src/color-palette/stories/index.story.tsx +2 -1
  382. package/src/color-picker/color-copy-button.tsx +8 -10
  383. package/src/color-picker/component.tsx +1 -0
  384. package/src/color-picker/stories/index.story.tsx +2 -1
  385. package/src/color-picker/styles.ts +0 -13
  386. package/src/combobox-control/README.md +1 -0
  387. package/src/combobox-control/index.tsx +19 -13
  388. package/src/combobox-control/stories/index.story.tsx +3 -1
  389. package/src/combobox-control/style.scss +0 -6
  390. package/src/combobox-control/test/index.tsx +7 -1
  391. package/src/composite/hover.tsx +1 -1
  392. package/src/composite/typeahead.tsx +3 -1
  393. package/src/confirm-dialog/stories/index.story.tsx +2 -1
  394. package/src/custom-gradient-picker/stories/index.story.tsx +2 -1
  395. package/src/custom-select-control/stories/index.story.tsx +2 -1
  396. package/src/custom-select-control-v2/stories/index.story.tsx +2 -1
  397. package/src/dashicon/types.ts +0 -2
  398. package/src/date-time/stories/date-time.story.tsx +2 -1
  399. package/src/date-time/stories/date.story.tsx +2 -1
  400. package/src/date-time/stories/time.story.tsx +2 -1
  401. package/src/dimension-control/README.md +1 -0
  402. package/src/dimension-control/index.tsx +8 -0
  403. package/src/dimension-control/stories/index.story.tsx +1 -0
  404. package/src/dimension-control/test/__snapshots__/index.test.js.snap +24 -24
  405. package/src/dimension-control/test/index.test.js +7 -1
  406. package/src/disabled/README.md +9 -7
  407. package/src/disabled/index.tsx +8 -1
  408. package/src/disabled/stories/index.story.tsx +1 -0
  409. package/src/drop-zone/stories/index.story.tsx +2 -1
  410. package/src/dropdown/stories/index.story.tsx +2 -1
  411. package/src/dropdown-menu/stories/index.story.tsx +2 -1
  412. package/src/duotone-picker/duotone-picker.tsx +2 -0
  413. package/src/external-link/stories/index.story.tsx +2 -1
  414. package/src/font-size-picker/README.md +1 -0
  415. package/src/font-size-picker/font-size-picker-toggle-group.tsx +1 -0
  416. package/src/font-size-picker/index.tsx +8 -0
  417. package/src/font-size-picker/stories/index.story.tsx +1 -0
  418. package/src/font-size-picker/test/index.tsx +5 -1
  419. package/src/form-file-upload/index.tsx +13 -1
  420. package/src/form-file-upload/stories/index.story.tsx +2 -1
  421. package/src/form-token-field/stories/index.story.tsx +2 -1
  422. package/src/form-token-field/style.scss +8 -12
  423. package/src/form-token-field/token.tsx +1 -0
  424. package/src/gradient-picker/README.md +107 -69
  425. package/src/gradient-picker/docs-manifest.json +5 -0
  426. package/src/gradient-picker/index.tsx +34 -32
  427. package/src/gradient-picker/stories/index.story.tsx +2 -1
  428. package/src/gradient-picker/types.ts +3 -5
  429. package/src/guide/page-control.tsx +1 -0
  430. package/src/guide/style.scss +4 -6
  431. package/src/h-stack/stories/index.story.tsx +2 -1
  432. package/src/heading/stories/index.story.tsx +2 -1
  433. package/src/higher-order/with-constrained-tabbing/README.md +13 -3
  434. package/src/higher-order/with-focus-return/README.md +9 -2
  435. package/src/input-control/stories/index.story.tsx +2 -1
  436. package/src/menu/stories/index.story.tsx +2 -1
  437. package/src/menu/styles.ts +1 -1
  438. package/src/menu-group/stories/index.story.tsx +2 -1
  439. package/src/menu-item/index.tsx +1 -0
  440. package/src/menu-item/stories/index.story.tsx +2 -1
  441. package/src/menu-item/test/__snapshots__/index.js.snap +4 -4
  442. package/src/menu-items-choice/stories/index.story.tsx +2 -1
  443. package/src/modal/index.tsx +2 -2
  444. package/src/modal/stories/index.story.tsx +3 -2
  445. package/src/navigator/stories/index.story.tsx +2 -1
  446. package/src/notice/index.tsx +2 -0
  447. package/src/notice/stories/index.story.tsx +7 -2
  448. package/src/notice/test/__snapshots__/index.tsx.snap +4 -4
  449. package/src/number-control/stories/index.story.tsx +2 -1
  450. package/src/palette-edit/index.tsx +5 -0
  451. package/src/panel/body.tsx +1 -0
  452. package/src/placeholder/stories/index.story.tsx +1 -0
  453. package/src/popover/index.tsx +3 -0
  454. package/src/popover/stories/index.story.tsx +2 -1
  455. package/src/private-apis.ts +0 -2
  456. package/src/progress-bar/stories/index.story.tsx +2 -1
  457. package/src/radio-control/stories/index.story.tsx +2 -1
  458. package/src/radio-group/README.md +8 -8
  459. package/src/radio-group/radio.tsx +7 -0
  460. package/src/radio-group/stories/index.story.tsx +16 -4
  461. package/src/radio-group/types.ts +6 -1
  462. package/src/range-control/README.md +4 -3
  463. package/src/range-control/index.tsx +11 -0
  464. package/src/range-control/stories/index.story.tsx +9 -1
  465. package/src/range-control/test/index.tsx +7 -1
  466. package/src/range-control/types.ts +7 -0
  467. package/src/responsive-wrapper/stories/index.story.tsx +2 -1
  468. package/src/search-control/stories/index.story.tsx +2 -1
  469. package/src/select-control/stories/index.story.tsx +2 -1
  470. package/src/slot-fill/README.md +26 -15
  471. package/src/slot-fill/bubbles-virtually/fill.tsx +18 -28
  472. package/src/slot-fill/bubbles-virtually/slot-fill-provider.tsx +26 -16
  473. package/src/slot-fill/bubbles-virtually/slot.tsx +13 -9
  474. package/src/slot-fill/bubbles-virtually/use-slot.ts +3 -26
  475. package/src/slot-fill/fill.ts +7 -22
  476. package/src/slot-fill/index.tsx +5 -7
  477. package/src/slot-fill/provider.tsx +8 -17
  478. package/src/slot-fill/slot.tsx +48 -85
  479. package/src/slot-fill/types.ts +14 -51
  480. package/src/snackbar/index.tsx +2 -1
  481. package/src/snackbar/stories/index.story.tsx +2 -1
  482. package/src/snackbar/stories/list.story.tsx +2 -1
  483. package/src/snackbar/style.scss +7 -16
  484. package/src/spinner/stories/index.story.tsx +2 -1
  485. package/src/tabs/tablist.tsx +13 -2
  486. package/src/text/stories/index.story.tsx +2 -1
  487. package/src/text-control/README.md +1 -0
  488. package/src/text-control/index.tsx +8 -0
  489. package/src/text-control/stories/index.story.tsx +3 -1
  490. package/src/text-control/test/text-control.tsx +7 -1
  491. package/src/text-highlight/stories/index.story.tsx +2 -1
  492. package/src/textarea-control/stories/index.story.tsx +2 -1
  493. package/src/tip/stories/index.story.tsx +2 -1
  494. package/src/toggle-control/stories/index.story.tsx +2 -1
  495. package/src/toggle-group-control/stories/index.story.tsx +3 -1
  496. package/src/toggle-group-control/test/__snapshots__/index.tsx.snap +12 -12
  497. package/src/toggle-group-control/test/index.tsx +7 -1
  498. package/src/toggle-group-control/toggle-group-control/README.md +2 -1
  499. package/src/toggle-group-control/toggle-group-control/component.tsx +11 -1
  500. package/src/toggle-group-control/toggle-group-control-option/README.md +1 -1
  501. package/src/toggle-group-control/toggle-group-control-option/component.tsx +1 -0
  502. package/src/toggle-group-control/toggle-group-control-option-icon/README.md +1 -1
  503. package/src/toggle-group-control/toggle-group-control-option-icon/component.tsx +1 -1
  504. package/src/toggle-group-control/types.ts +7 -0
  505. package/src/tools-panel/stories/index.story.tsx +3 -0
  506. package/src/tooltip/stories/index.story.tsx +2 -1
  507. package/src/tree-grid/stories/index.story.tsx +2 -1
  508. package/src/tree-select/stories/index.story.tsx +2 -1
  509. package/src/truncate/stories/index.story.tsx +2 -1
  510. package/src/unit-control/stories/index.story.tsx +2 -1
  511. package/src/utils/deprecated-36px-size.ts +8 -2
  512. package/src/v-stack/stories/index.story.tsx +2 -1
  513. package/src/visually-hidden/stories/index.story.tsx +1 -1
  514. package/tsconfig.tsbuildinfo +1 -1
@@ -1 +1 @@
1
- {"version":3,"names":["Ariakit","css","COLORS","font","rtl","CONFIG","space","Icon","Truncate","ANIMATION_PARAMS","SCALE_AMOUNT_OUTER","SCALE_AMOUNT_CONTENT","DURATION","IN","OUT","EASING","CONTENT_WRAPPER_PADDING","ITEM_PADDING_BLOCK","ITEM_PADDING_INLINE","DEFAULT_BORDER_COLOR","theme","gray","DIVIDER_COLOR","LIGHTER_TEXT_COLOR","LIGHT_BACKGROUND_COLOR","TOOLBAR_VARIANT_BORDER_COLOR","foreground","DEFAULT_BOX_SHADOW","borderWidth","elevationMedium","TOOLBAR_VARIANT_BOX_SHADOW","GRID_TEMPLATE_COLS","MenuPopoverOuterWrapper","_styled","process","env","NODE_ENV","target","label","ui","background","radiusMedium","props","variant","MenuPopoverInnerWrapper","baseItem","radiusSmall","textDisabled","accent","white","MenuItem","MenuCheckboxItem","MenuItemCheckbox","MenuRadioItem","MenuItemRadio","ItemPrefixWrapper","MenuItemContentWrapper","MenuItemChildrenWrapper","ItemSuffixWrapper","MenuGroup","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","MenuGroupLabel","MenuSeparator","SubmenuChevronIcon","transform","MenuItemLabel","MenuItemHelpText"],"sources":["@wordpress/components/src/menu/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport { COLORS, font, rtl, CONFIG } from '../utils';\nimport { space } from '../utils/space';\nimport Icon from '../icon';\nimport { Truncate } from '../truncate';\nimport type { MenuContext } from './types';\n\nconst ANIMATION_PARAMS = {\n\tSCALE_AMOUNT_OUTER: 0.82,\n\tSCALE_AMOUNT_CONTENT: 0.9,\n\tDURATION: {\n\t\tIN: '400ms',\n\t\tOUT: '200ms',\n\t},\n\tEASING: 'cubic-bezier(0.33, 0, 0, 1)',\n};\n\nconst CONTENT_WRAPPER_PADDING = space( 1 );\nconst ITEM_PADDING_BLOCK = space( 2 );\nconst ITEM_PADDING_INLINE = space( 3 );\n\n// TODO:\n// - border color and divider color are different from COLORS.theme variables\n// - lighter text color is not defined in COLORS.theme, should it be?\n// - lighter background color is not defined in COLORS.theme, should it be?\nconst DEFAULT_BORDER_COLOR = COLORS.theme.gray[ 300 ];\nconst DIVIDER_COLOR = COLORS.theme.gray[ 200 ];\nconst LIGHTER_TEXT_COLOR = COLORS.theme.gray[ 700 ];\nconst LIGHT_BACKGROUND_COLOR = COLORS.theme.gray[ 100 ];\nconst TOOLBAR_VARIANT_BORDER_COLOR = COLORS.theme.foreground;\nconst DEFAULT_BOX_SHADOW = `0 0 0 ${ CONFIG.borderWidth } ${ DEFAULT_BORDER_COLOR }, ${ CONFIG.elevationMedium }`;\nconst TOOLBAR_VARIANT_BOX_SHADOW = `0 0 0 ${ CONFIG.borderWidth } ${ TOOLBAR_VARIANT_BORDER_COLOR }`;\n\nconst GRID_TEMPLATE_COLS = 'minmax( 0, max-content ) 1fr';\n\nexport const MenuPopoverOuterWrapper = styled.div<\n\tPick< MenuContext, 'variant' >\n>`\n\tposition: relative;\n\n\tbackground-color: ${ COLORS.ui.background };\n\tborder-radius: ${ CONFIG.radiusMedium };\n\t${ ( props ) => css`\n\t\tbox-shadow: ${ props.variant === 'toolbar'\n\t\t\t? TOOLBAR_VARIANT_BOX_SHADOW\n\t\t\t: DEFAULT_BOX_SHADOW };\n\t` }\n\n\toverflow: hidden;\n\n\t/* Open/close animation (outer wrapper) */\n\t@media not ( prefers-reduced-motion ) {\n\t\ttransition-property: transform, opacity;\n\t\ttransition-timing-function: ${ ANIMATION_PARAMS.EASING };\n\t\ttransition-duration: ${ ANIMATION_PARAMS.DURATION.IN };\n\t\twill-change: transform, opacity;\n\n\t\t/* Regardless of the side, fade in and out. */\n\t\topacity: 0;\n\t\t&:has( [data-enter] ) {\n\t\t\topacity: 1;\n\t\t}\n\n\t\t&:has( [data-leave] ) {\n\t\t\ttransition-duration: ${ ANIMATION_PARAMS.DURATION.OUT };\n\t\t}\n\n\t\t/* For menus opening on top and bottom side, animate the scale Y too. */\n\t\t&:has( [data-side='bottom'] ),\n\t\t&:has( [data-side='top'] ) {\n\t\t\ttransform: scaleY( ${ ANIMATION_PARAMS.SCALE_AMOUNT_OUTER } );\n\t\t}\n\t\t&:has( [data-side='bottom'] ) {\n\t\t\ttransform-origin: top;\n\t\t}\n\t\t&:has( [data-side='top'] ) {\n\t\t\ttransform-origin: bottom;\n\t\t}\n\t\t&:has( [data-enter][data-side='bottom'] ),\n\t\t&:has( [data-enter][data-side='top'] ),\n\t\t/* Do not animate the scaleY when closing the menu */\n\t\t&:has( [data-leave][data-side='bottom'] ),\n\t\t&:has( [data-leave][data-side='top'] ) {\n\t\t\ttransform: scaleY( 1 );\n\t\t}\n\t}\n`;\n\nexport const MenuPopoverInnerWrapper = styled.div`\n\tposition: relative;\n\t/* Same as popover component */\n\t/* TODO: is there a way to read the sass variable? */\n\tz-index: 1000000;\n\n\tdisplay: grid;\n\tgrid-template-columns: ${ GRID_TEMPLATE_COLS };\n\tgrid-template-rows: auto;\n\n\tbox-sizing: border-box;\n\tmin-width: 160px;\n\tmax-width: 320px;\n\tmax-height: var( --popover-available-height );\n\n\tpadding: ${ CONTENT_WRAPPER_PADDING };\n\n\toverscroll-behavior: contain;\n\toverflow: auto;\n\n\t/* Only visible in Windows High Contrast mode */\n\toutline: 2px solid transparent !important;\n\n\t/* Open/close animation (inner content wrapper) */\n\t@media not ( prefers-reduced-motion ) {\n\t\ttransition: inherit;\n\t\ttransform-origin: inherit;\n\n\t\t/*\n\t\t * For menus opening on top and bottom side, animate the scale Y too.\n\t\t * The content scales at a different rate than the outer container:\n\t\t * - first, counter the outer scale factor by doing \"1 / scaleAmountOuter\"\n\t\t * - then, apply the content scale factor.\n\t\t */\n\t\t&[data-side='bottom'],\n\t\t&[data-side='top'] {\n\t\t\ttransform: scaleY(\n\t\t\t\tcalc(\n\t\t\t\t\t1 / ${ ANIMATION_PARAMS.SCALE_AMOUNT_OUTER } *\n\t\t\t\t\t\t${ ANIMATION_PARAMS.SCALE_AMOUNT_CONTENT }\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\t\t&[data-enter][data-side='bottom'],\n\t\t&[data-enter][data-side='top'],\n\t\t/* Do not animate the scaleY when closing the menu */\n\t\t&[data-leave][data-side='bottom'],\n\t\t&[data-leave][data-side='top'] {\n\t\t\ttransform: scaleY( 1 );\n\t\t}\n\t}\n`;\n\nconst baseItem = css`\n\tall: unset;\n\n\tposition: relative;\n\tmin-height: ${ space( 10 ) };\n\tbox-sizing: border-box;\n\n\t/* Occupy the width of all grid columns (ie. full width) */\n\tgrid-column: 1 / -1;\n\n\tdisplay: grid;\n\tgrid-template-columns: ${ GRID_TEMPLATE_COLS };\n\talign-items: center;\n\n\t@supports ( grid-template-columns: subgrid ) {\n\t\t/*\n\t\t * Define a grid layout which inherits the same columns configuration\n\t\t * from the parent layout (ie. subgrid). This allows the menu\n\t\t * to synchronize the indentation of all its items.\n\t\t */\n\t\tgrid-template-columns: subgrid;\n\t}\n\n\tfont-size: ${ font( 'default.fontSize' ) };\n\tfont-family: inherit;\n\tfont-weight: normal;\n\tline-height: 20px;\n\n\tcolor: ${ COLORS.theme.foreground };\n\tborder-radius: ${ CONFIG.radiusSmall };\n\n\tpadding-block: ${ ITEM_PADDING_BLOCK };\n\tpadding-inline: ${ ITEM_PADDING_INLINE };\n\n\t/*\n\t * Make sure that, when an item is scrolled into view (eg. while using the\n\t * keyboard to move focus), the whole item comes into view\n\t */\n\tscroll-margin: ${ CONTENT_WRAPPER_PADDING };\n\n\tuser-select: none;\n\toutline: none;\n\n\t&[aria-disabled='true'] {\n\t\tcolor: ${ COLORS.ui.textDisabled };\n\t\tcursor: not-allowed;\n\t}\n\n\t/* Active item (including hover) */\n\t&[data-active-item]:not( [data-focus-visible] ):not(\n\t\t\t[aria-disabled='true']\n\t\t) {\n\t\tbackground-color: ${ COLORS.theme.accent };\n\t\tcolor: ${ COLORS.white };\n\t}\n\n\t/* Keyboard focus (focus-visible) */\n\t&[data-focus-visible] {\n\t\tbox-shadow: 0 0 0 1.5px ${ COLORS.theme.accent };\n\n\t\t/* Only visible in Windows High Contrast mode */\n\t\toutline: 2px solid transparent;\n\t}\n\n\t/* Active (ie. pressed, mouse down) */\n\t&:active,\n\t&[data-active] {\n\t\t/* TODO: should there be a visual active state? */\n\t}\n\n\t/* When the item is the trigger of an open submenu */\n\t${ MenuPopoverInnerWrapper }:not(:focus) &:not(:focus)[aria-expanded=\"true\"] {\n\t\tbackground-color: ${ LIGHT_BACKGROUND_COLOR };\n\t\tcolor: ${ COLORS.theme.foreground };\n\t}\n\n\tsvg {\n\t\tfill: currentColor;\n\t}\n`;\n\nexport const MenuItem = styled( Ariakit.MenuItem )`\n\t${ baseItem };\n`;\n\nexport const MenuCheckboxItem = styled( Ariakit.MenuItemCheckbox )`\n\t${ baseItem };\n`;\n\nexport const MenuRadioItem = styled( Ariakit.MenuItemRadio )`\n\t${ baseItem };\n`;\n\nexport const ItemPrefixWrapper = styled.span`\n\t/* Always occupy the first column, even when auto-collapsing */\n\tgrid-column: 1;\n\n\t/*\n\t * Even when the item is not checked, occupy the same screen space to avoid\n\t * the space collapside when no items are checked.\n\t */\n\t${ MenuCheckboxItem } > &,\n\t${ MenuRadioItem } > & {\n\t\t/* Same width as the check icons */\n\t\tmin-width: ${ space( 6 ) };\n\t}\n\n\t${ MenuCheckboxItem } > &,\n\t${ MenuRadioItem } > &,\n\t&:not( :empty ) {\n\t\tmargin-inline-end: ${ space( 2 ) };\n\t}\n\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\n\tcolor: ${ LIGHTER_TEXT_COLOR };\n\n\t/*\n\t* When the parent menu item is active, except when it's a non-focused/hovered\n\t* submenu trigger (in that case, color should not be inherited)\n\t*/\n\t[data-active-item]:not( [data-focus-visible] ) > &,\n\t/* When the parent menu item is disabled */\n\t[aria-disabled='true'] > & {\n\t\tcolor: inherit;\n\t}\n`;\n\nexport const MenuItemContentWrapper = styled.div`\n\t/*\n\t * Always occupy the second column, since the first column\n\t * is taken by the prefix wrapper (when displayed).\n\t */\n\tgrid-column: 2;\n\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tgap: ${ space( 3 ) };\n\n\tpointer-events: none;\n`;\n\nexport const MenuItemChildrenWrapper = styled.div`\n\tflex: 1;\n\n\tdisplay: inline-flex;\n\tflex-direction: column;\n\tgap: ${ space( 1 ) };\n`;\n\nexport const ItemSuffixWrapper = styled.span`\n\tflex: 0 1 fit-content;\n\tmin-width: 0;\n\twidth: fit-content;\n\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tgap: ${ space( 3 ) };\n\n\tcolor: ${ LIGHTER_TEXT_COLOR };\n\n\t/*\n\t * When the parent menu item is active, except when it's a non-focused/hovered\n\t * submenu trigger (in that case, color should not be inherited)\n\t */\n\t[data-active-item]:not( [data-focus-visible] ) *:not(${ MenuPopoverInnerWrapper }) &,\n\t/* When the parent menu item is disabled */\n\t[aria-disabled='true'] *:not(${ MenuPopoverInnerWrapper }) & {\n\t\tcolor: inherit;\n\t}\n`;\n\nexport const MenuGroup = styled( Ariakit.MenuGroup )`\n\t/* Ignore this element when calculating the layout. Useful for subgrid */\n\tdisplay: contents;\n`;\n\nexport const MenuGroupLabel = styled( Ariakit.MenuGroupLabel )`\n\t/* Occupy the width of all grid columns (ie. full width) */\n\tgrid-column: 1 / -1;\n\n\tpadding-block-start: ${ space( 3 ) };\n\tpadding-block-end: ${ space( 2 ) };\n\tpadding-inline: ${ ITEM_PADDING_INLINE };\n`;\n\nexport const MenuSeparator = styled( Ariakit.MenuSeparator )<\n\tPick< MenuContext, 'variant' >\n>`\n\t/* Occupy the width of all grid columns (ie. full width) */\n\tgrid-column: 1 / -1;\n\n\tborder: none;\n\theight: ${ CONFIG.borderWidth };\n\tbackground-color: ${ ( props ) =>\n\t\tprops.variant === 'toolbar'\n\t\t\t? TOOLBAR_VARIANT_BORDER_COLOR\n\t\t\t: DIVIDER_COLOR };\n\t/* Align with menu items' content */\n\tmargin-block: ${ space( 2 ) };\n\tmargin-inline: ${ ITEM_PADDING_INLINE };\n\n\t/* Only visible in Windows High Contrast mode */\n\toutline: 2px solid transparent;\n`;\n\nexport const SubmenuChevronIcon = styled( Icon )`\n\twidth: ${ space( 1.5 ) };\n\t${ rtl(\n\t\t{\n\t\t\ttransform: `scaleX(1)`,\n\t\t},\n\t\t{\n\t\t\ttransform: `scaleX(-1)`,\n\t\t}\n\t) };\n`;\n\nexport const MenuItemLabel = styled( Truncate )`\n\tfont-size: ${ font( 'default.fontSize' ) };\n\tline-height: 20px;\n\tcolor: inherit;\n`;\n\nexport const MenuItemHelpText = styled( Truncate )`\n\tfont-size: ${ font( 'helpText.fontSize' ) };\n\tline-height: 16px;\n\tcolor: ${ LIGHTER_TEXT_COLOR };\n\tword-break: break-all;\n\n\t[data-active-item]:not( [data-focus-visible] )\n\t\t*:not( ${ MenuPopoverInnerWrapper } )\n\t\t&,\n\t[aria-disabled='true'] *:not( ${ MenuPopoverInnerWrapper } ) & {\n\t\tcolor: inherit;\n\t}\n`;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["Ariakit","css","COLORS","font","rtl","CONFIG","space","Icon","Truncate","ANIMATION_PARAMS","SCALE_AMOUNT_OUTER","SCALE_AMOUNT_CONTENT","DURATION","IN","OUT","EASING","CONTENT_WRAPPER_PADDING","ITEM_PADDING_BLOCK","ITEM_PADDING_INLINE","DEFAULT_BORDER_COLOR","theme","gray","DIVIDER_COLOR","LIGHTER_TEXT_COLOR","LIGHT_BACKGROUND_COLOR","TOOLBAR_VARIANT_BORDER_COLOR","foreground","DEFAULT_BOX_SHADOW","borderWidth","elevationMedium","TOOLBAR_VARIANT_BOX_SHADOW","GRID_TEMPLATE_COLS","MenuPopoverOuterWrapper","_styled","process","env","NODE_ENV","target","label","ui","background","radiusMedium","props","variant","MenuPopoverInnerWrapper","baseItem","radiusSmall","textDisabled","accent","white","MenuItem","MenuCheckboxItem","MenuItemCheckbox","MenuRadioItem","MenuItemRadio","ItemPrefixWrapper","MenuItemContentWrapper","MenuItemChildrenWrapper","ItemSuffixWrapper","MenuGroup","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","MenuGroupLabel","MenuSeparator","SubmenuChevronIcon","transform","MenuItemLabel","MenuItemHelpText"],"sources":["@wordpress/components/src/menu/styles.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport { COLORS, font, rtl, CONFIG } from '../utils';\nimport { space } from '../utils/space';\nimport Icon from '../icon';\nimport { Truncate } from '../truncate';\nimport type { MenuContext } from './types';\n\nconst ANIMATION_PARAMS = {\n\tSCALE_AMOUNT_OUTER: 0.82,\n\tSCALE_AMOUNT_CONTENT: 0.9,\n\tDURATION: {\n\t\tIN: '400ms',\n\t\tOUT: '200ms',\n\t},\n\tEASING: 'cubic-bezier(0.33, 0, 0, 1)',\n};\n\nconst CONTENT_WRAPPER_PADDING = space( 1 );\nconst ITEM_PADDING_BLOCK = space( 2 );\nconst ITEM_PADDING_INLINE = space( 3 );\n\n// TODO:\n// - border color and divider color are different from COLORS.theme variables\n// - lighter text color is not defined in COLORS.theme, should it be?\n// - lighter background color is not defined in COLORS.theme, should it be?\nconst DEFAULT_BORDER_COLOR = COLORS.theme.gray[ 300 ];\nconst DIVIDER_COLOR = COLORS.theme.gray[ 200 ];\nconst LIGHTER_TEXT_COLOR = COLORS.theme.gray[ 700 ];\nconst LIGHT_BACKGROUND_COLOR = COLORS.theme.gray[ 100 ];\nconst TOOLBAR_VARIANT_BORDER_COLOR = COLORS.theme.foreground;\nconst DEFAULT_BOX_SHADOW = `0 0 0 ${ CONFIG.borderWidth } ${ DEFAULT_BORDER_COLOR }, ${ CONFIG.elevationMedium }`;\nconst TOOLBAR_VARIANT_BOX_SHADOW = `0 0 0 ${ CONFIG.borderWidth } ${ TOOLBAR_VARIANT_BORDER_COLOR }`;\n\nconst GRID_TEMPLATE_COLS = 'minmax( 0, max-content ) 1fr';\n\nexport const MenuPopoverOuterWrapper = styled.div<\n\tPick< MenuContext, 'variant' >\n>`\n\tposition: relative;\n\n\tbackground-color: ${ COLORS.ui.background };\n\tborder-radius: ${ CONFIG.radiusMedium };\n\t${ ( props ) => css`\n\t\tbox-shadow: ${ props.variant === 'toolbar'\n\t\t\t? TOOLBAR_VARIANT_BOX_SHADOW\n\t\t\t: DEFAULT_BOX_SHADOW };\n\t` }\n\n\toverflow: hidden;\n\n\t/* Open/close animation (outer wrapper) */\n\t@media not ( prefers-reduced-motion ) {\n\t\ttransition-property: transform, opacity;\n\t\ttransition-timing-function: ${ ANIMATION_PARAMS.EASING };\n\t\ttransition-duration: ${ ANIMATION_PARAMS.DURATION.IN };\n\t\twill-change: transform, opacity;\n\n\t\t/* Regardless of the side, fade in and out. */\n\t\topacity: 0;\n\t\t&:has( [data-enter] ) {\n\t\t\topacity: 1;\n\t\t}\n\n\t\t&:has( [data-leave] ) {\n\t\t\ttransition-duration: ${ ANIMATION_PARAMS.DURATION.OUT };\n\t\t}\n\n\t\t/* For menus opening on top and bottom side, animate the scale Y too. */\n\t\t&:has( [data-side='bottom'] ),\n\t\t&:has( [data-side='top'] ) {\n\t\t\ttransform: scaleY( ${ ANIMATION_PARAMS.SCALE_AMOUNT_OUTER } );\n\t\t}\n\t\t&:has( [data-side='bottom'] ) {\n\t\t\ttransform-origin: top;\n\t\t}\n\t\t&:has( [data-side='top'] ) {\n\t\t\ttransform-origin: bottom;\n\t\t}\n\t\t&:has( [data-enter][data-side='bottom'] ),\n\t\t&:has( [data-enter][data-side='top'] ),\n\t\t/* Do not animate the scaleY when closing the menu */\n\t\t&:has( [data-leave][data-side='bottom'] ),\n\t\t&:has( [data-leave][data-side='top'] ) {\n\t\t\ttransform: scaleY( 1 );\n\t\t}\n\t}\n`;\n\nexport const MenuPopoverInnerWrapper = styled.div`\n\tposition: relative;\n\t/* Same as popover component */\n\t/* TODO: is there a way to read the sass variable? */\n\tz-index: 1000000;\n\n\tdisplay: grid;\n\tgrid-template-columns: ${ GRID_TEMPLATE_COLS };\n\tgrid-template-rows: auto;\n\n\tbox-sizing: border-box;\n\tmin-width: 160px;\n\tmax-width: 320px;\n\tmax-height: var( --popover-available-height );\n\n\tpadding: ${ CONTENT_WRAPPER_PADDING };\n\n\toverscroll-behavior: contain;\n\toverflow: auto;\n\n\t/* Only visible in Windows High Contrast mode */\n\toutline: 2px solid transparent !important;\n\n\t/* Open/close animation (inner content wrapper) */\n\t@media not ( prefers-reduced-motion ) {\n\t\ttransition: inherit;\n\t\ttransform-origin: inherit;\n\n\t\t/*\n\t\t * For menus opening on top and bottom side, animate the scale Y too.\n\t\t * The content scales at a different rate than the outer container:\n\t\t * - first, counter the outer scale factor by doing \"1 / scaleAmountOuter\"\n\t\t * - then, apply the content scale factor.\n\t\t */\n\t\t&[data-side='bottom'],\n\t\t&[data-side='top'] {\n\t\t\ttransform: scaleY(\n\t\t\t\tcalc(\n\t\t\t\t\t1 / ${ ANIMATION_PARAMS.SCALE_AMOUNT_OUTER } *\n\t\t\t\t\t\t${ ANIMATION_PARAMS.SCALE_AMOUNT_CONTENT }\n\t\t\t\t)\n\t\t\t);\n\t\t}\n\t\t&[data-enter][data-side='bottom'],\n\t\t&[data-enter][data-side='top'],\n\t\t/* Do not animate the scaleY when closing the menu */\n\t\t&[data-leave][data-side='bottom'],\n\t\t&[data-leave][data-side='top'] {\n\t\t\ttransform: scaleY( 1 );\n\t\t}\n\t}\n`;\n\nconst baseItem = css`\n\tall: unset;\n\n\tposition: relative;\n\tmin-height: ${ space( 10 ) };\n\tbox-sizing: border-box;\n\n\t/* Occupy the width of all grid columns (ie. full width) */\n\tgrid-column: 1 / -1;\n\n\tdisplay: grid;\n\tgrid-template-columns: ${ GRID_TEMPLATE_COLS };\n\talign-items: center;\n\n\t@supports ( grid-template-columns: subgrid ) {\n\t\t/*\n\t\t * Define a grid layout which inherits the same columns configuration\n\t\t * from the parent layout (ie. subgrid). This allows the menu\n\t\t * to synchronize the indentation of all its items.\n\t\t */\n\t\tgrid-template-columns: subgrid;\n\t}\n\n\tfont-size: ${ font( 'default.fontSize' ) };\n\tfont-family: inherit;\n\tfont-weight: normal;\n\tline-height: 20px;\n\n\tcolor: ${ COLORS.theme.foreground };\n\tborder-radius: ${ CONFIG.radiusSmall };\n\n\tpadding-block: ${ ITEM_PADDING_BLOCK };\n\tpadding-inline: ${ ITEM_PADDING_INLINE };\n\n\t/*\n\t * Make sure that, when an item is scrolled into view (eg. while using the\n\t * keyboard to move focus), the whole item comes into view\n\t */\n\tscroll-margin: ${ CONTENT_WRAPPER_PADDING };\n\n\tuser-select: none;\n\toutline: none;\n\n\t&[aria-disabled='true'] {\n\t\tcolor: ${ COLORS.ui.textDisabled };\n\t\tcursor: not-allowed;\n\t}\n\n\t/* Active item (including hover) */\n\t&[data-active-item]:not( [data-focus-visible] ):not(\n\t\t\t[aria-disabled='true']\n\t\t) {\n\t\tbackground-color: ${ COLORS.theme.accent };\n\t\tcolor: ${ COLORS.white };\n\t}\n\n\t/* Keyboard focus (focus-visible) */\n\t&[data-focus-visible] {\n\t\tbox-shadow: 0 0 0 1.5px ${ COLORS.theme.accent };\n\n\t\t/* Only visible in Windows High Contrast mode */\n\t\toutline: 2px solid transparent;\n\t}\n\n\t/* Active (ie. pressed, mouse down) */\n\t&:active,\n\t&[data-active] {\n\t\t/* TODO: should there be a visual active state? */\n\t}\n\n\t/* When the item is the trigger of an open submenu */\n\t${ MenuPopoverInnerWrapper }:not(:focus) &:not(:focus)[aria-expanded=\"true\"] {\n\t\tbackground-color: ${ LIGHT_BACKGROUND_COLOR };\n\t\tcolor: ${ COLORS.theme.foreground };\n\t}\n\n\tsvg {\n\t\tfill: currentColor;\n\t}\n`;\n\nexport const MenuItem = styled( Ariakit.MenuItem )`\n\t${ baseItem };\n`;\n\nexport const MenuCheckboxItem = styled( Ariakit.MenuItemCheckbox )`\n\t${ baseItem };\n`;\n\nexport const MenuRadioItem = styled( Ariakit.MenuItemRadio )`\n\t${ baseItem };\n`;\n\nexport const ItemPrefixWrapper = styled.span`\n\t/* Always occupy the first column, even when auto-collapsing */\n\tgrid-column: 1;\n\n\t/*\n\t * Even when the item is not checked, occupy the same screen space to avoid\n\t * the space collapside when no items are checked.\n\t */\n\t${ MenuCheckboxItem } > &,\n\t${ MenuRadioItem } > & {\n\t\t/* Same width as the check icons */\n\t\tmin-width: ${ space( 6 ) };\n\t}\n\n\t${ MenuCheckboxItem } > &,\n\t${ MenuRadioItem } > &,\n\t&:not( :empty ) {\n\t\tmargin-inline-end: ${ space( 2 ) };\n\t}\n\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\n\tcolor: ${ LIGHTER_TEXT_COLOR };\n\n\t/*\n\t* When the parent menu item is active, except when it's a non-focused/hovered\n\t* submenu trigger (in that case, color should not be inherited)\n\t*/\n\t[data-active-item]:not( [data-focus-visible] ) > &,\n\t/* When the parent menu item is disabled */\n\t[aria-disabled='true'] > & {\n\t\tcolor: inherit;\n\t}\n`;\n\nexport const MenuItemContentWrapper = styled.div`\n\t/*\n\t * Always occupy the second column, since the first column\n\t * is taken by the prefix wrapper (when displayed).\n\t */\n\tgrid-column: 2;\n\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n\tgap: ${ space( 3 ) };\n\n\tpointer-events: none;\n`;\n\nexport const MenuItemChildrenWrapper = styled.div`\n\tflex: 1;\n\n\tdisplay: inline-flex;\n\tflex-direction: column;\n\tgap: ${ space( 1 ) };\n`;\n\nexport const ItemSuffixWrapper = styled.span`\n\tflex: 0 1 fit-content;\n\tmin-width: 0;\n\twidth: fit-content;\n\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tgap: ${ space( 3 ) };\n\n\tcolor: ${ LIGHTER_TEXT_COLOR };\n\n\t/*\n\t * When the parent menu item is active, except when it's a non-focused/hovered\n\t * submenu trigger (in that case, color should not be inherited)\n\t */\n\t[data-active-item]:not( [data-focus-visible] ) *:not(${ MenuPopoverInnerWrapper }) &,\n\t/* When the parent menu item is disabled */\n\t[aria-disabled='true'] *:not(${ MenuPopoverInnerWrapper }) & {\n\t\tcolor: inherit;\n\t}\n`;\n\nexport const MenuGroup = styled( Ariakit.MenuGroup )`\n\t/* Ignore this element when calculating the layout. Useful for subgrid */\n\tdisplay: contents;\n`;\n\nexport const MenuGroupLabel = styled( Ariakit.MenuGroupLabel )`\n\t/* Occupy the width of all grid columns (ie. full width) */\n\tgrid-column: 1 / -1;\n\n\tpadding-block-start: ${ space( 3 ) };\n\tpadding-block-end: ${ space( 2 ) };\n\tpadding-inline: ${ ITEM_PADDING_INLINE };\n`;\n\nexport const MenuSeparator = styled( Ariakit.MenuSeparator )<\n\tPick< MenuContext, 'variant' >\n>`\n\t/* Occupy the width of all grid columns (ie. full width) */\n\tgrid-column: 1 / -1;\n\n\tborder: none;\n\theight: ${ CONFIG.borderWidth };\n\tbackground-color: ${ ( props ) =>\n\t\tprops.variant === 'toolbar'\n\t\t\t? TOOLBAR_VARIANT_BORDER_COLOR\n\t\t\t: DIVIDER_COLOR };\n\t/* Align with menu items' content */\n\tmargin-block: ${ space( 2 ) };\n\tmargin-inline: ${ ITEM_PADDING_INLINE };\n\n\t/* Only visible in Windows High Contrast mode */\n\toutline: 2px solid transparent;\n`;\n\nexport const SubmenuChevronIcon = styled( Icon )`\n\twidth: ${ space( 1.5 ) };\n\t${ rtl(\n\t\t{\n\t\t\ttransform: `scaleX(1)`,\n\t\t},\n\t\t{\n\t\t\ttransform: `scaleX(-1)`,\n\t\t}\n\t) };\n`;\n\nexport const MenuItemLabel = styled( Truncate )`\n\tfont-size: ${ font( 'default.fontSize' ) };\n\tline-height: 20px;\n\tcolor: inherit;\n`;\n\nexport const MenuItemHelpText = styled( Truncate )`\n\tfont-size: ${ font( 'helpText.fontSize' ) };\n\tline-height: 16px;\n\tcolor: ${ LIGHTER_TEXT_COLOR };\n\toverflow-wrap: anywhere;\n\n\t[data-active-item]:not( [data-focus-visible] )\n\t\t*:not( ${ MenuPopoverInnerWrapper } )\n\t\t&,\n\t[aria-disabled='true'] *:not( ${ MenuPopoverInnerWrapper } ) & {\n\t\tcolor: inherit;\n\t}\n`;\n"],"mappings":"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","ignoreList":[]}
@@ -50,6 +50,7 @@ function UnforwardedMenuItem(props, ref) {
50
50
  });
51
51
  }
52
52
  return /*#__PURE__*/_jsxs(Button, {
53
+ __next40pxDefaultSize: true,
53
54
  ref: ref
54
55
  // Make sure aria-checked matches spec https://www.w3.org/TR/wai-aria-1.1/#aria-checked
55
56
  ,
@@ -1 +1 @@
1
- {"version":3,"names":["clsx","cloneElement","forwardRef","Shortcut","Button","Icon","jsx","_jsx","jsxs","_jsxs","UnforwardedMenuItem","props","ref","children","info","className","icon","iconPosition","shortcut","isSelected","role","suffix","buttonProps","undefined","MenuItem"],"sources":["@wordpress/components/src/menu-item/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { cloneElement, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Shortcut from '../shortcut';\nimport Button from '../button';\nimport Icon from '../icon';\nimport type { WordPressComponentProps } from '../context';\nimport type { MenuItemProps } from './types';\n\nfunction UnforwardedMenuItem(\n\tprops: WordPressComponentProps< MenuItemProps, 'button', false >,\n\tref: ForwardedRef< HTMLButtonElement >\n) {\n\tlet {\n\t\tchildren,\n\t\tinfo,\n\t\tclassName,\n\t\ticon,\n\t\ticonPosition = 'right',\n\t\tshortcut,\n\t\tisSelected,\n\t\trole = 'menuitem',\n\t\tsuffix,\n\t\t...buttonProps\n\t} = props;\n\n\tclassName = clsx( 'components-menu-item__button', className );\n\n\tif ( info ) {\n\t\tchildren = (\n\t\t\t<span className=\"components-menu-item__info-wrapper\">\n\t\t\t\t<span className=\"components-menu-item__item\">{ children }</span>\n\t\t\t\t<span className=\"components-menu-item__info\">{ info }</span>\n\t\t\t</span>\n\t\t);\n\t}\n\n\tif ( icon && typeof icon !== 'string' ) {\n\t\ticon = cloneElement( icon, {\n\t\t\tclassName: clsx( 'components-menu-items__item-icon', {\n\t\t\t\t'has-icon-right': iconPosition === 'right',\n\t\t\t} ),\n\t\t} );\n\t}\n\n\treturn (\n\t\t<Button\n\t\t\tref={ ref }\n\t\t\t// Make sure aria-checked matches spec https://www.w3.org/TR/wai-aria-1.1/#aria-checked\n\t\t\taria-checked={\n\t\t\t\trole === 'menuitemcheckbox' || role === 'menuitemradio'\n\t\t\t\t\t? isSelected\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\trole={ role }\n\t\t\ticon={ iconPosition === 'left' ? icon : undefined }\n\t\t\tclassName={ className }\n\t\t\t{ ...buttonProps }\n\t\t>\n\t\t\t<span className=\"components-menu-item__item\">{ children }</span>\n\t\t\t{ ! suffix && (\n\t\t\t\t<Shortcut\n\t\t\t\t\tclassName=\"components-menu-item__shortcut\"\n\t\t\t\t\tshortcut={ shortcut }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ ! suffix && icon && iconPosition === 'right' && (\n\t\t\t\t<Icon icon={ icon } />\n\t\t\t) }\n\t\t\t{ suffix }\n\t\t</Button>\n\t);\n}\n\n/**\n * MenuItem is a component which renders a button intended to be used in combination with the `DropdownMenu` component.\n *\n * ```jsx\n * import { MenuItem } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyMenuItem = () => {\n * \tconst [ isActive, setIsActive ] = useState( true );\n *\n * \treturn (\n * \t\t<MenuItem\n * \t\t\ticon={ isActive ? 'yes' : 'no' }\n * \t\t\tisSelected={ isActive }\n * \t\t\trole=\"menuitemcheckbox\"\n * \t\t\tonClick={ () => setIsActive( ( state ) => ! state ) }\n * \t\t>\n * \t\t\tToggle\n * \t\t</MenuItem>\n * \t);\n * };\n * ```\n */\nexport const MenuItem = forwardRef( UnforwardedMenuItem );\n\nexport default MenuItem;\n"],"mappings":"AAAA;AACA;AACA;;AAEA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SAASC,YAAY,EAAEC,UAAU,QAAQ,oBAAoB;;AAE7D;AACA;AACA;AACA,OAAOC,QAAQ,MAAM,aAAa;AAClC,OAAOC,MAAM,MAAM,WAAW;AAC9B,OAAOC,IAAI,MAAM,SAAS;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAI3B,SAASC,mBAAmBA,CAC3BC,KAAgE,EAChEC,GAAsC,EACrC;EACD,IAAI;IACHC,QAAQ;IACRC,IAAI;IACJC,SAAS;IACTC,IAAI;IACJC,YAAY,GAAG,OAAO;IACtBC,QAAQ;IACRC,UAAU;IACVC,IAAI,GAAG,UAAU;IACjBC,MAAM;IACN,GAAGC;EACJ,CAAC,GAAGX,KAAK;EAETI,SAAS,GAAGf,IAAI,CAAE,8BAA8B,EAAEe,SAAU,CAAC;EAE7D,IAAKD,IAAI,EAAG;IACXD,QAAQ,gBACPJ,KAAA;MAAMM,SAAS,EAAC,oCAAoC;MAAAF,QAAA,gBACnDN,IAAA;QAAMQ,SAAS,EAAC,4BAA4B;QAAAF,QAAA,EAAGA;MAAQ,CAAQ,CAAC,eAChEN,IAAA;QAAMQ,SAAS,EAAC,4BAA4B;QAAAF,QAAA,EAAGC;MAAI,CAAQ,CAAC;IAAA,CACvD,CACN;EACF;EAEA,IAAKE,IAAI,IAAI,OAAOA,IAAI,KAAK,QAAQ,EAAG;IACvCA,IAAI,GAAGf,YAAY,CAAEe,IAAI,EAAE;MAC1BD,SAAS,EAAEf,IAAI,CAAE,kCAAkC,EAAE;QACpD,gBAAgB,EAAEiB,YAAY,KAAK;MACpC,CAAE;IACH,CAAE,CAAC;EACJ;EAEA,oBACCR,KAAA,CAACL,MAAM;IACNQ,GAAG,EAAGA;IACN;IAAA;IACA,gBACCQ,IAAI,KAAK,kBAAkB,IAAIA,IAAI,KAAK,eAAe,GACpDD,UAAU,GACVI,SACH;IACDH,IAAI,EAAGA,IAAM;IACbJ,IAAI,EAAGC,YAAY,KAAK,MAAM,GAAGD,IAAI,GAAGO,SAAW;IACnDR,SAAS,EAAGA,SAAW;IAAA,GAClBO,WAAW;IAAAT,QAAA,gBAEhBN,IAAA;MAAMQ,SAAS,EAAC,4BAA4B;MAAAF,QAAA,EAAGA;IAAQ,CAAQ,CAAC,EAC9D,CAAEQ,MAAM,iBACTd,IAAA,CAACJ,QAAQ;MACRY,SAAS,EAAC,gCAAgC;MAC1CG,QAAQ,EAAGA;IAAU,CACrB,CACD,EACC,CAAEG,MAAM,IAAIL,IAAI,IAAIC,YAAY,KAAK,OAAO,iBAC7CV,IAAA,CAACF,IAAI;MAACW,IAAI,EAAGA;IAAM,CAAE,CACrB,EACCK,MAAM;EAAA,CACD,CAAC;AAEX;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMG,QAAQ,GAAGtB,UAAU,CAAEQ,mBAAoB,CAAC;AAEzD,eAAec,QAAQ","ignoreList":[]}
1
+ {"version":3,"names":["clsx","cloneElement","forwardRef","Shortcut","Button","Icon","jsx","_jsx","jsxs","_jsxs","UnforwardedMenuItem","props","ref","children","info","className","icon","iconPosition","shortcut","isSelected","role","suffix","buttonProps","__next40pxDefaultSize","undefined","MenuItem"],"sources":["@wordpress/components/src/menu-item/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { cloneElement, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Shortcut from '../shortcut';\nimport Button from '../button';\nimport Icon from '../icon';\nimport type { WordPressComponentProps } from '../context';\nimport type { MenuItemProps } from './types';\n\nfunction UnforwardedMenuItem(\n\tprops: WordPressComponentProps< MenuItemProps, 'button', false >,\n\tref: ForwardedRef< HTMLButtonElement >\n) {\n\tlet {\n\t\tchildren,\n\t\tinfo,\n\t\tclassName,\n\t\ticon,\n\t\ticonPosition = 'right',\n\t\tshortcut,\n\t\tisSelected,\n\t\trole = 'menuitem',\n\t\tsuffix,\n\t\t...buttonProps\n\t} = props;\n\n\tclassName = clsx( 'components-menu-item__button', className );\n\n\tif ( info ) {\n\t\tchildren = (\n\t\t\t<span className=\"components-menu-item__info-wrapper\">\n\t\t\t\t<span className=\"components-menu-item__item\">{ children }</span>\n\t\t\t\t<span className=\"components-menu-item__info\">{ info }</span>\n\t\t\t</span>\n\t\t);\n\t}\n\n\tif ( icon && typeof icon !== 'string' ) {\n\t\ticon = cloneElement( icon, {\n\t\t\tclassName: clsx( 'components-menu-items__item-icon', {\n\t\t\t\t'has-icon-right': iconPosition === 'right',\n\t\t\t} ),\n\t\t} );\n\t}\n\n\treturn (\n\t\t<Button\n\t\t\t__next40pxDefaultSize\n\t\t\tref={ ref }\n\t\t\t// Make sure aria-checked matches spec https://www.w3.org/TR/wai-aria-1.1/#aria-checked\n\t\t\taria-checked={\n\t\t\t\trole === 'menuitemcheckbox' || role === 'menuitemradio'\n\t\t\t\t\t? isSelected\n\t\t\t\t\t: undefined\n\t\t\t}\n\t\t\trole={ role }\n\t\t\ticon={ iconPosition === 'left' ? icon : undefined }\n\t\t\tclassName={ className }\n\t\t\t{ ...buttonProps }\n\t\t>\n\t\t\t<span className=\"components-menu-item__item\">{ children }</span>\n\t\t\t{ ! suffix && (\n\t\t\t\t<Shortcut\n\t\t\t\t\tclassName=\"components-menu-item__shortcut\"\n\t\t\t\t\tshortcut={ shortcut }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ ! suffix && icon && iconPosition === 'right' && (\n\t\t\t\t<Icon icon={ icon } />\n\t\t\t) }\n\t\t\t{ suffix }\n\t\t</Button>\n\t);\n}\n\n/**\n * MenuItem is a component which renders a button intended to be used in combination with the `DropdownMenu` component.\n *\n * ```jsx\n * import { MenuItem } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyMenuItem = () => {\n * \tconst [ isActive, setIsActive ] = useState( true );\n *\n * \treturn (\n * \t\t<MenuItem\n * \t\t\ticon={ isActive ? 'yes' : 'no' }\n * \t\t\tisSelected={ isActive }\n * \t\t\trole=\"menuitemcheckbox\"\n * \t\t\tonClick={ () => setIsActive( ( state ) => ! state ) }\n * \t\t>\n * \t\t\tToggle\n * \t\t</MenuItem>\n * \t);\n * };\n * ```\n */\nexport const MenuItem = forwardRef( UnforwardedMenuItem );\n\nexport default MenuItem;\n"],"mappings":"AAAA;AACA;AACA;;AAEA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SAASC,YAAY,EAAEC,UAAU,QAAQ,oBAAoB;;AAE7D;AACA;AACA;AACA,OAAOC,QAAQ,MAAM,aAAa;AAClC,OAAOC,MAAM,MAAM,WAAW;AAC9B,OAAOC,IAAI,MAAM,SAAS;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAI3B,SAASC,mBAAmBA,CAC3BC,KAAgE,EAChEC,GAAsC,EACrC;EACD,IAAI;IACHC,QAAQ;IACRC,IAAI;IACJC,SAAS;IACTC,IAAI;IACJC,YAAY,GAAG,OAAO;IACtBC,QAAQ;IACRC,UAAU;IACVC,IAAI,GAAG,UAAU;IACjBC,MAAM;IACN,GAAGC;EACJ,CAAC,GAAGX,KAAK;EAETI,SAAS,GAAGf,IAAI,CAAE,8BAA8B,EAAEe,SAAU,CAAC;EAE7D,IAAKD,IAAI,EAAG;IACXD,QAAQ,gBACPJ,KAAA;MAAMM,SAAS,EAAC,oCAAoC;MAAAF,QAAA,gBACnDN,IAAA;QAAMQ,SAAS,EAAC,4BAA4B;QAAAF,QAAA,EAAGA;MAAQ,CAAQ,CAAC,eAChEN,IAAA;QAAMQ,SAAS,EAAC,4BAA4B;QAAAF,QAAA,EAAGC;MAAI,CAAQ,CAAC;IAAA,CACvD,CACN;EACF;EAEA,IAAKE,IAAI,IAAI,OAAOA,IAAI,KAAK,QAAQ,EAAG;IACvCA,IAAI,GAAGf,YAAY,CAAEe,IAAI,EAAE;MAC1BD,SAAS,EAAEf,IAAI,CAAE,kCAAkC,EAAE;QACpD,gBAAgB,EAAEiB,YAAY,KAAK;MACpC,CAAE;IACH,CAAE,CAAC;EACJ;EAEA,oBACCR,KAAA,CAACL,MAAM;IACNmB,qBAAqB;IACrBX,GAAG,EAAGA;IACN;IAAA;IACA,gBACCQ,IAAI,KAAK,kBAAkB,IAAIA,IAAI,KAAK,eAAe,GACpDD,UAAU,GACVK,SACH;IACDJ,IAAI,EAAGA,IAAM;IACbJ,IAAI,EAAGC,YAAY,KAAK,MAAM,GAAGD,IAAI,GAAGQ,SAAW;IACnDT,SAAS,EAAGA,SAAW;IAAA,GAClBO,WAAW;IAAAT,QAAA,gBAEhBN,IAAA;MAAMQ,SAAS,EAAC,4BAA4B;MAAAF,QAAA,EAAGA;IAAQ,CAAQ,CAAC,EAC9D,CAAEQ,MAAM,iBACTd,IAAA,CAACJ,QAAQ;MACRY,SAAS,EAAC,gCAAgC;MAC1CG,QAAQ,EAAGA;IAAU,CACrB,CACD,EACC,CAAEG,MAAM,IAAIL,IAAI,IAAIC,YAAY,KAAK,OAAO,iBAC7CV,IAAA,CAACF,IAAI;MAACW,IAAI,EAAGA;IAAM,CAAE,CACrB,EACCK,MAAM;EAAA,CACD,CAAC;AAEX;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMI,QAAQ,GAAGvB,UAAU,CAAEQ,mBAAoB,CAAC;AAEzD,eAAee,QAAQ","ignoreList":[]}
@@ -262,9 +262,9 @@ function UnforwardedModal(props, forwardedRef) {
262
262
  }), headerActions, isDismissible && /*#__PURE__*/_jsxs(_Fragment, {
263
263
  children: [/*#__PURE__*/_jsx(Spacer, {
264
264
  marginBottom: 0,
265
- marginLeft: 3
265
+ marginLeft: 2
266
266
  }), /*#__PURE__*/_jsx(Button, {
267
- size: "small",
267
+ size: "compact",
268
268
  onClick: event => closeModal().then(() => onRequestClose(event)),
269
269
  icon: close,
270
270
  label: closeButtonLabel || __('Close')
@@ -1 +1 @@
1
- {"version":3,"names":["clsx","createPortal","useCallback","useEffect","useRef","useState","forwardRef","useLayoutEffect","createContext","useContext","useInstanceId","useFocusReturn","useFocusOnMount","useConstrainedTabbing","useMergeRefs","__","close","getScrollContainer","ariaHelper","Button","StyleProvider","withIgnoreIMEEvents","Spacer","useModalExitAnimation","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","ModalContext","Set","bodyOpenClasses","Map","UnforwardedModal","props","forwardedRef","bodyOpenClassName","role","title","focusOnMount","shouldCloseOnEsc","shouldCloseOnClickOutside","isDismissible","aria","labelledby","undefined","describedby","onRequestClose","icon","closeButtonLabel","children","style","overlayClassName","overlayClassnameProp","className","contentLabel","onKeyDown","isFullScreen","size","headerActions","__experimentalHideHeader","ref","instanceId","Modal","headingId","focusOnMountRef","constrainedTabbingRef","focusReturnRef","contentRef","childrenContainerRef","hasScrolledContent","setHasScrolledContent","hasScrollableContent","setHasScrollableContent","sizeClass","isContentScrollable","current","closestScrollContainer","modalize","unmodalize","onRequestCloseRef","dismissers","nestedDismissers","add","dismisser","delete","_bodyOpenClasses$get","theClass","oneMore","get","set","document","body","classList","oneLess","remove","closeModal","frameRef","frameStyle","overlayClassname","window","ResizeObserver","resizeObserver","observe","disconnect","handleEscapeKeyDown","event","code","key","defaultPrevented","preventDefault","then","onContentContainerScroll","e","_e$currentTarget$scro","scrollY","currentTarget","scrollTop","pressTarget","overlayPressHandlers","onPointerDown","target","onPointerUp","button","isSameTarget","modal","tabIndex","onScroll","id","marginBottom","marginLeft","onClick","label","Provider","value"],"sources":["@wordpress/components/src/modal/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreatePortal,\n\tuseCallback,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tforwardRef,\n\tuseLayoutEffect,\n\tcreateContext,\n\tuseContext,\n} from '@wordpress/element';\nimport {\n\tuseInstanceId,\n\tuseFocusReturn,\n\tuseFocusOnMount,\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';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\nimport { Spacer } from '../spacer';\nimport { useModalExitAnimation } from './use-modal-exit-animation';\n\n// Used to track and dismiss the prior modal when another opens unless nested.\ntype Dismissers = Set<\n\tReact.RefObject< ModalProps[ 'onRequestClose' ] | undefined >\n>;\nconst ModalContext = createContext< Dismissers >( new Set() );\n\n// Used to track body class names applied while modals are open.\nconst bodyOpenClasses = new Map< string, number >();\n\nfunction UnforwardedModal(\n\tprops: ModalProps,\n\tforwardedRef: React.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: overlayClassnameProp,\n\t\tclassName,\n\t\tcontentLabel,\n\t\tonKeyDown,\n\t\tisFullScreen = false,\n\t\tsize,\n\t\theaderActions = null,\n\t\t__experimentalHideHeader = false,\n\t} = props;\n\n\tconst ref = useRef< HTMLDivElement >();\n\n\tconst instanceId = useInstanceId( Modal );\n\tconst headingId = title\n\t\t? `components-modal-header-${ instanceId }`\n\t\t: aria.labelledby;\n\n\t// The focus hook does not support 'firstContentElement' but this is a valid\n\t// value for the Modal's focusOnMount prop. The following code ensures the focus\n\t// hook will focus the first focusable node within the element to which it is applied.\n\t// When `firstContentElement` is passed as the value of the focusOnMount prop,\n\t// the focus hook is applied to the Modal's content element.\n\t// Otherwise, the focus hook is applied to the Modal's ref. This ensures that the\n\t// focus hook will focus the first element in the Modal's **content** when\n\t// `firstContentElement` is passed.\n\tconst focusOnMountRef = useFocusOnMount(\n\t\tfocusOnMount === 'firstContentElement' ? 'firstElement' : focusOnMount\n\t);\n\tconst constrainedTabbingRef = useConstrainedTabbing();\n\tconst focusReturnRef = useFocusReturn();\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\tlet sizeClass;\n\tif ( isFullScreen || size === 'fill' ) {\n\t\tsizeClass = 'is-full-screen';\n\t} else if ( size ) {\n\t\tsizeClass = `has-size-${ size }`;\n\t}\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\t// Accessibly isolates/unisolates the modal.\n\tuseEffect( () => {\n\t\tariaHelper.modalize( ref.current );\n\t\treturn () => ariaHelper.unmodalize();\n\t}, [] );\n\n\t// Keeps a fresh ref for the subsequent effect.\n\tconst onRequestCloseRef = useRef< ModalProps[ 'onRequestClose' ] >();\n\tuseEffect( () => {\n\t\tonRequestCloseRef.current = onRequestClose;\n\t}, [ onRequestClose ] );\n\n\t// The list of `onRequestClose` callbacks of open (non-nested) Modals. Only\n\t// one should remain open at a time and the list enables closing prior ones.\n\tconst dismissers = useContext( ModalContext );\n\t// Used for the tracking and dismissing any nested modals.\n\tconst [ nestedDismissers ] = useState< Dismissers >( () => new Set() );\n\n\t// Updates the stack tracking open modals at this level and calls\n\t// onRequestClose for any prior and/or nested modals as applicable.\n\tuseEffect( () => {\n\t\t// add this modal instance to the dismissers set\n\t\tdismissers.add( onRequestCloseRef );\n\t\t// request that all the other modals close themselves\n\t\tfor ( const dismisser of dismissers ) {\n\t\t\tif ( dismisser !== onRequestCloseRef ) {\n\t\t\t\tdismisser.current?.();\n\t\t\t}\n\t\t}\n\t\treturn () => {\n\t\t\t// request that all the nested modals close themselves\n\t\t\tfor ( const dismisser of nestedDismissers ) {\n\t\t\t\tdismisser.current?.();\n\t\t\t}\n\t\t\t// remove this modal instance from the dismissers set\n\t\t\tdismissers.delete( onRequestCloseRef );\n\t\t};\n\t}, [ dismissers, nestedDismissers ] );\n\n\t// Adds/removes the value of bodyOpenClassName to body element.\n\tuseEffect( () => {\n\t\tconst theClass = bodyOpenClassName;\n\t\tconst oneMore = 1 + ( bodyOpenClasses.get( theClass ) ?? 0 );\n\t\tbodyOpenClasses.set( theClass, oneMore );\n\t\tdocument.body.classList.add( bodyOpenClassName );\n\t\treturn () => {\n\t\t\tconst oneLess = bodyOpenClasses.get( theClass )! - 1;\n\t\t\tif ( oneLess === 0 ) {\n\t\t\t\tdocument.body.classList.remove( theClass );\n\t\t\t\tbodyOpenClasses.delete( theClass );\n\t\t\t} else {\n\t\t\t\tbodyOpenClasses.set( theClass, oneLess );\n\t\t\t}\n\t\t};\n\t}, [ bodyOpenClassName ] );\n\n\tconst { closeModal, frameRef, frameStyle, overlayClassname } =\n\t\tuseModalExitAnimation();\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(\n\t\tevent: React.KeyboardEvent< HTMLDivElement >\n\t) {\n\t\tif (\n\t\t\tshouldCloseOnEsc &&\n\t\t\t( event.code === 'Escape' || event.key === 'Escape' ) &&\n\t\t\t! event.defaultPrevented\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tcloseModal().then( () => onRequestClose( event ) );\n\t\t}\n\t}\n\n\tconst onContentContainerScroll = useCallback(\n\t\t( e: React.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\tlet pressTarget: EventTarget | null = null;\n\tconst overlayPressHandlers: {\n\t\tonPointerDown: React.PointerEventHandler< HTMLDivElement >;\n\t\tonPointerUp: React.PointerEventHandler< HTMLDivElement >;\n\t} = {\n\t\tonPointerDown: ( event ) => {\n\t\t\tif ( event.target === event.currentTarget ) {\n\t\t\t\tpressTarget = event.target;\n\t\t\t\t// Avoids focus changing so that focus return works as expected.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t// Closes the modal with two exceptions. 1. Opening the context menu on\n\t\t// the overlay. 2. Pressing on the overlay then dragging the pointer\n\t\t// over the modal and releasing. Due to the modal being a child of the\n\t\t// overlay, such a gesture is a `click` on the overlay and cannot be\n\t\t// excepted by a `click` handler. Thus the tactic of handling\n\t\t// `pointerup` and comparing its target to that of the `pointerdown`.\n\t\tonPointerUp: ( { target, button } ) => {\n\t\t\tconst isSameTarget = target === pressTarget;\n\t\t\tpressTarget = null;\n\t\t\tif ( button === 0 && isSameTarget ) {\n\t\t\t\tcloseModal().then( () => onRequestClose() );\n\t\t\t}\n\t\t},\n\t};\n\n\tconst modal = (\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={ clsx(\n\t\t\t\t'components-modal__screen-overlay',\n\t\t\t\toverlayClassname,\n\t\t\t\toverlayClassnameProp\n\t\t\t) }\n\t\t\tonKeyDown={ withIgnoreIMEEvents( handleEscapeKeyDown ) }\n\t\t\t{ ...( shouldCloseOnClickOutside ? overlayPressHandlers : {} ) }\n\t\t>\n\t\t\t<StyleProvider document={ document }>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t'components-modal__frame',\n\t\t\t\t\t\tsizeClass,\n\t\t\t\t\t\tclassName\n\t\t\t\t\t) }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t...frameStyle,\n\t\t\t\t\t\t...style,\n\t\t\t\t\t} }\n\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\tframeRef,\n\t\t\t\t\t\tconstrainedTabbingRef,\n\t\t\t\t\t\tfocusReturnRef,\n\t\t\t\t\t\tfocusOnMount !== 'firstContentElement'\n\t\t\t\t\t\t\t? focusOnMountRef\n\t\t\t\t\t\t\t: null,\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\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ clsx( '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{ headerActions }\n\t\t\t\t\t\t\t\t{ isDismissible && (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t<Spacer\n\t\t\t\t\t\t\t\t\t\t\tmarginBottom={ 0 }\n\t\t\t\t\t\t\t\t\t\t\tmarginLeft={ 3 }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\t\t\t\t\tonClick={ (\n\t\t\t\t\t\t\t\t\t\t\t\tevent: React.MouseEvent< HTMLButtonElement >\n\t\t\t\t\t\t\t\t\t\t\t) =>\n\t\t\t\t\t\t\t\t\t\t\t\tcloseModal().then( () =>\n\t\t\t\t\t\t\t\t\t\t\t\t\tonRequestClose( event )\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\t\tcloseButtonLabel ||\n\t\t\t\t\t\t\t\t\t\t\t\t__( 'Close' )\n\t\t\t\t\t\t\t\t\t\t\t}\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\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\t\t\tchildrenContainerRef,\n\t\t\t\t\t\t\t\tfocusOnMount === 'firstContentElement'\n\t\t\t\t\t\t\t\t\t? focusOnMountRef\n\t\t\t\t\t\t\t\t\t: null,\n\t\t\t\t\t\t\t] ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t</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);\n\n\treturn createPortal(\n\t\t<ModalContext.Provider value={ nestedDismissers }>\n\t\t\t{ modal }\n\t\t</ModalContext.Provider>,\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"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["clsx","createPortal","useCallback","useEffect","useRef","useState","forwardRef","useLayoutEffect","createContext","useContext","useInstanceId","useFocusReturn","useFocusOnMount","useConstrainedTabbing","useMergeRefs","__","close","getScrollContainer","ariaHelper","Button","StyleProvider","withIgnoreIMEEvents","Spacer","useModalExitAnimation","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","ModalContext","Set","bodyOpenClasses","Map","UnforwardedModal","props","forwardedRef","bodyOpenClassName","role","title","focusOnMount","shouldCloseOnEsc","shouldCloseOnClickOutside","isDismissible","aria","labelledby","undefined","describedby","onRequestClose","icon","closeButtonLabel","children","style","overlayClassName","overlayClassnameProp","className","contentLabel","onKeyDown","isFullScreen","size","headerActions","__experimentalHideHeader","ref","instanceId","Modal","headingId","focusOnMountRef","constrainedTabbingRef","focusReturnRef","contentRef","childrenContainerRef","hasScrolledContent","setHasScrolledContent","hasScrollableContent","setHasScrollableContent","sizeClass","isContentScrollable","current","closestScrollContainer","modalize","unmodalize","onRequestCloseRef","dismissers","nestedDismissers","add","dismisser","delete","_bodyOpenClasses$get","theClass","oneMore","get","set","document","body","classList","oneLess","remove","closeModal","frameRef","frameStyle","overlayClassname","window","ResizeObserver","resizeObserver","observe","disconnect","handleEscapeKeyDown","event","code","key","defaultPrevented","preventDefault","then","onContentContainerScroll","e","_e$currentTarget$scro","scrollY","currentTarget","scrollTop","pressTarget","overlayPressHandlers","onPointerDown","target","onPointerUp","button","isSameTarget","modal","tabIndex","onScroll","id","marginBottom","marginLeft","onClick","label","Provider","value"],"sources":["@wordpress/components/src/modal/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tcreatePortal,\n\tuseCallback,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tforwardRef,\n\tuseLayoutEffect,\n\tcreateContext,\n\tuseContext,\n} from '@wordpress/element';\nimport {\n\tuseInstanceId,\n\tuseFocusReturn,\n\tuseFocusOnMount,\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';\nimport { withIgnoreIMEEvents } from '../utils/with-ignore-ime-events';\nimport { Spacer } from '../spacer';\nimport { useModalExitAnimation } from './use-modal-exit-animation';\n\n// Used to track and dismiss the prior modal when another opens unless nested.\ntype Dismissers = Set<\n\tReact.RefObject< ModalProps[ 'onRequestClose' ] | undefined >\n>;\nconst ModalContext = createContext< Dismissers >( new Set() );\n\n// Used to track body class names applied while modals are open.\nconst bodyOpenClasses = new Map< string, number >();\n\nfunction UnforwardedModal(\n\tprops: ModalProps,\n\tforwardedRef: React.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: overlayClassnameProp,\n\t\tclassName,\n\t\tcontentLabel,\n\t\tonKeyDown,\n\t\tisFullScreen = false,\n\t\tsize,\n\t\theaderActions = null,\n\t\t__experimentalHideHeader = false,\n\t} = props;\n\n\tconst ref = useRef< HTMLDivElement >();\n\n\tconst instanceId = useInstanceId( Modal );\n\tconst headingId = title\n\t\t? `components-modal-header-${ instanceId }`\n\t\t: aria.labelledby;\n\n\t// The focus hook does not support 'firstContentElement' but this is a valid\n\t// value for the Modal's focusOnMount prop. The following code ensures the focus\n\t// hook will focus the first focusable node within the element to which it is applied.\n\t// When `firstContentElement` is passed as the value of the focusOnMount prop,\n\t// the focus hook is applied to the Modal's content element.\n\t// Otherwise, the focus hook is applied to the Modal's ref. This ensures that the\n\t// focus hook will focus the first element in the Modal's **content** when\n\t// `firstContentElement` is passed.\n\tconst focusOnMountRef = useFocusOnMount(\n\t\tfocusOnMount === 'firstContentElement' ? 'firstElement' : focusOnMount\n\t);\n\tconst constrainedTabbingRef = useConstrainedTabbing();\n\tconst focusReturnRef = useFocusReturn();\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\tlet sizeClass;\n\tif ( isFullScreen || size === 'fill' ) {\n\t\tsizeClass = 'is-full-screen';\n\t} else if ( size ) {\n\t\tsizeClass = `has-size-${ size }`;\n\t}\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\t// Accessibly isolates/unisolates the modal.\n\tuseEffect( () => {\n\t\tariaHelper.modalize( ref.current );\n\t\treturn () => ariaHelper.unmodalize();\n\t}, [] );\n\n\t// Keeps a fresh ref for the subsequent effect.\n\tconst onRequestCloseRef = useRef< ModalProps[ 'onRequestClose' ] >();\n\tuseEffect( () => {\n\t\tonRequestCloseRef.current = onRequestClose;\n\t}, [ onRequestClose ] );\n\n\t// The list of `onRequestClose` callbacks of open (non-nested) Modals. Only\n\t// one should remain open at a time and the list enables closing prior ones.\n\tconst dismissers = useContext( ModalContext );\n\t// Used for the tracking and dismissing any nested modals.\n\tconst [ nestedDismissers ] = useState< Dismissers >( () => new Set() );\n\n\t// Updates the stack tracking open modals at this level and calls\n\t// onRequestClose for any prior and/or nested modals as applicable.\n\tuseEffect( () => {\n\t\t// add this modal instance to the dismissers set\n\t\tdismissers.add( onRequestCloseRef );\n\t\t// request that all the other modals close themselves\n\t\tfor ( const dismisser of dismissers ) {\n\t\t\tif ( dismisser !== onRequestCloseRef ) {\n\t\t\t\tdismisser.current?.();\n\t\t\t}\n\t\t}\n\t\treturn () => {\n\t\t\t// request that all the nested modals close themselves\n\t\t\tfor ( const dismisser of nestedDismissers ) {\n\t\t\t\tdismisser.current?.();\n\t\t\t}\n\t\t\t// remove this modal instance from the dismissers set\n\t\t\tdismissers.delete( onRequestCloseRef );\n\t\t};\n\t}, [ dismissers, nestedDismissers ] );\n\n\t// Adds/removes the value of bodyOpenClassName to body element.\n\tuseEffect( () => {\n\t\tconst theClass = bodyOpenClassName;\n\t\tconst oneMore = 1 + ( bodyOpenClasses.get( theClass ) ?? 0 );\n\t\tbodyOpenClasses.set( theClass, oneMore );\n\t\tdocument.body.classList.add( bodyOpenClassName );\n\t\treturn () => {\n\t\t\tconst oneLess = bodyOpenClasses.get( theClass )! - 1;\n\t\t\tif ( oneLess === 0 ) {\n\t\t\t\tdocument.body.classList.remove( theClass );\n\t\t\t\tbodyOpenClasses.delete( theClass );\n\t\t\t} else {\n\t\t\t\tbodyOpenClasses.set( theClass, oneLess );\n\t\t\t}\n\t\t};\n\t}, [ bodyOpenClassName ] );\n\n\tconst { closeModal, frameRef, frameStyle, overlayClassname } =\n\t\tuseModalExitAnimation();\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(\n\t\tevent: React.KeyboardEvent< HTMLDivElement >\n\t) {\n\t\tif (\n\t\t\tshouldCloseOnEsc &&\n\t\t\t( event.code === 'Escape' || event.key === 'Escape' ) &&\n\t\t\t! event.defaultPrevented\n\t\t) {\n\t\t\tevent.preventDefault();\n\t\t\tcloseModal().then( () => onRequestClose( event ) );\n\t\t}\n\t}\n\n\tconst onContentContainerScroll = useCallback(\n\t\t( e: React.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\tlet pressTarget: EventTarget | null = null;\n\tconst overlayPressHandlers: {\n\t\tonPointerDown: React.PointerEventHandler< HTMLDivElement >;\n\t\tonPointerUp: React.PointerEventHandler< HTMLDivElement >;\n\t} = {\n\t\tonPointerDown: ( event ) => {\n\t\t\tif ( event.target === event.currentTarget ) {\n\t\t\t\tpressTarget = event.target;\n\t\t\t\t// Avoids focus changing so that focus return works as expected.\n\t\t\t\tevent.preventDefault();\n\t\t\t}\n\t\t},\n\t\t// Closes the modal with two exceptions. 1. Opening the context menu on\n\t\t// the overlay. 2. Pressing on the overlay then dragging the pointer\n\t\t// over the modal and releasing. Due to the modal being a child of the\n\t\t// overlay, such a gesture is a `click` on the overlay and cannot be\n\t\t// excepted by a `click` handler. Thus the tactic of handling\n\t\t// `pointerup` and comparing its target to that of the `pointerdown`.\n\t\tonPointerUp: ( { target, button } ) => {\n\t\t\tconst isSameTarget = target === pressTarget;\n\t\t\tpressTarget = null;\n\t\t\tif ( button === 0 && isSameTarget ) {\n\t\t\t\tcloseModal().then( () => onRequestClose() );\n\t\t\t}\n\t\t},\n\t};\n\n\tconst modal = (\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={ clsx(\n\t\t\t\t'components-modal__screen-overlay',\n\t\t\t\toverlayClassname,\n\t\t\t\toverlayClassnameProp\n\t\t\t) }\n\t\t\tonKeyDown={ withIgnoreIMEEvents( handleEscapeKeyDown ) }\n\t\t\t{ ...( shouldCloseOnClickOutside ? overlayPressHandlers : {} ) }\n\t\t>\n\t\t\t<StyleProvider document={ document }>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t'components-modal__frame',\n\t\t\t\t\t\tsizeClass,\n\t\t\t\t\t\tclassName\n\t\t\t\t\t) }\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t...frameStyle,\n\t\t\t\t\t\t...style,\n\t\t\t\t\t} }\n\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\tframeRef,\n\t\t\t\t\t\tconstrainedTabbingRef,\n\t\t\t\t\t\tfocusReturnRef,\n\t\t\t\t\t\tfocusOnMount !== 'firstContentElement'\n\t\t\t\t\t\t\t? focusOnMountRef\n\t\t\t\t\t\t\t: null,\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\tonKeyDown={ onKeyDown }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ clsx( '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{ headerActions }\n\t\t\t\t\t\t\t\t{ isDismissible && (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t<Spacer\n\t\t\t\t\t\t\t\t\t\t\tmarginBottom={ 0 }\n\t\t\t\t\t\t\t\t\t\t\tmarginLeft={ 2 }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\t\t\t\t\tonClick={ (\n\t\t\t\t\t\t\t\t\t\t\t\tevent: React.MouseEvent< HTMLButtonElement >\n\t\t\t\t\t\t\t\t\t\t\t) =>\n\t\t\t\t\t\t\t\t\t\t\t\tcloseModal().then( () =>\n\t\t\t\t\t\t\t\t\t\t\t\t\tonRequestClose( event )\n\t\t\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\ticon={ close }\n\t\t\t\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\t\t\t\tcloseButtonLabel ||\n\t\t\t\t\t\t\t\t\t\t\t\t__( 'Close' )\n\t\t\t\t\t\t\t\t\t\t\t}\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\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tref={ useMergeRefs( [\n\t\t\t\t\t\t\t\tchildrenContainerRef,\n\t\t\t\t\t\t\t\tfocusOnMount === 'firstContentElement'\n\t\t\t\t\t\t\t\t\t? focusOnMountRef\n\t\t\t\t\t\t\t\t\t: null,\n\t\t\t\t\t\t\t] ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t</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);\n\n\treturn createPortal(\n\t\t<ModalContext.Provider value={ nestedDismissers }>\n\t\t\t{ modal }\n\t\t</ModalContext.Provider>,\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"],"mappings":"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","ignoreList":[]}
@@ -120,6 +120,7 @@ function Notice({
120
120
  computedVariant = 'primary';
121
121
  }
122
122
  return /*#__PURE__*/_jsx(Button, {
123
+ __next40pxDefaultSize: true,
123
124
  href: url,
124
125
  variant: computedVariant,
125
126
  onClick: url ? undefined : onClick,
@@ -129,6 +130,7 @@ function Notice({
129
130
  })
130
131
  })]
131
132
  }), isDismissible && /*#__PURE__*/_jsx(Button, {
133
+ size: "small",
132
134
  className: "components-notice__dismiss",
133
135
  icon: close,
134
136
  label: __('Close'),
@@ -1 +1 @@
1
- {"version":3,"names":["clsx","__","RawHTML","useEffect","renderToString","speak","close","Button","VisuallyHidden","jsx","_jsx","jsxs","_jsxs","noop","useSpokenMessage","message","politeness","spokenMessage","getDefaultPoliteness","status","getStatusLabel","Notice","className","children","onRemove","isDismissible","actions","__unstableHTML","onDismiss","classes","onDismissNotice","map","buttonCustomClasses","label","isPrimary","variant","noDefaultClasses","onClick","url","index","computedVariant","href","undefined","icon"],"sources":["@wordpress/components/src/notice/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { RawHTML, useEffect, renderToString } from '@wordpress/element';\nimport { speak } from '@wordpress/a11y';\nimport { close } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport type { NoticeAction, NoticeProps } from './types';\nimport type { DeprecatedButtonProps } from '../button/types';\nimport { VisuallyHidden } from '../visually-hidden';\n\nconst noop = () => {};\n\n/**\n * Custom hook which announces the message with the given politeness, if a\n * valid message is provided.\n */\nfunction useSpokenMessage(\n\tmessage: NoticeProps[ 'spokenMessage' ],\n\tpoliteness: NoticeProps[ 'politeness' ]\n) {\n\tconst spokenMessage =\n\t\ttypeof message === 'string' ? message : renderToString( message );\n\n\tuseEffect( () => {\n\t\tif ( spokenMessage ) {\n\t\t\tspeak( spokenMessage, politeness );\n\t\t}\n\t}, [ spokenMessage, politeness ] );\n}\n\nfunction getDefaultPoliteness( status: NoticeProps[ 'status' ] ) {\n\tswitch ( status ) {\n\t\tcase 'success':\n\t\tcase 'warning':\n\t\tcase 'info':\n\t\t\treturn 'polite';\n\t\t// The default will also catch the 'error' status.\n\t\tdefault:\n\t\t\treturn 'assertive';\n\t}\n}\n\nfunction getStatusLabel( status: NoticeProps[ 'status' ] ) {\n\tswitch ( status ) {\n\t\tcase 'warning':\n\t\t\treturn __( 'Warning notice' );\n\t\tcase 'info':\n\t\t\treturn __( 'Information notice' );\n\t\tcase 'error':\n\t\t\treturn __( 'Error notice' );\n\t\t// The default will also catch the 'success' status.\n\t\tdefault:\n\t\t\treturn __( 'Notice' );\n\t}\n}\n\n/**\n * `Notice` is a component used to communicate feedback to the user.\n *\n *```jsx\n * import { Notice } from `@wordpress/components`;\n *\n * const MyNotice = () => (\n * <Notice status=\"error\">An unknown error occurred.</Notice>\n * );\n * ```\n */\nfunction Notice( {\n\tclassName,\n\tstatus = 'info',\n\tchildren,\n\tspokenMessage = children,\n\tonRemove = noop,\n\tisDismissible = true,\n\tactions = [],\n\tpoliteness = getDefaultPoliteness( status ),\n\t__unstableHTML,\n\t// onDismiss is a callback executed when the notice is dismissed.\n\t// It is distinct from onRemove, which _looks_ like a callback but is\n\t// actually the function to call to remove the notice from the UI.\n\tonDismiss = noop,\n}: NoticeProps ) {\n\tuseSpokenMessage( spokenMessage, politeness );\n\n\tconst classes = clsx( className, 'components-notice', 'is-' + status, {\n\t\t'is-dismissible': isDismissible,\n\t} );\n\n\tif ( __unstableHTML && typeof children === 'string' ) {\n\t\tchildren = <RawHTML>{ children }</RawHTML>;\n\t}\n\n\tconst onDismissNotice = () => {\n\t\tonDismiss();\n\t\tonRemove();\n\t};\n\n\treturn (\n\t\t<div className={ classes }>\n\t\t\t<VisuallyHidden>{ getStatusLabel( status ) }</VisuallyHidden>\n\t\t\t<div className=\"components-notice__content\">\n\t\t\t\t{ children }\n\t\t\t\t<div className=\"components-notice__actions\">\n\t\t\t\t\t{ actions.map(\n\t\t\t\t\t\t(\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tclassName: buttonCustomClasses,\n\t\t\t\t\t\t\t\tlabel,\n\t\t\t\t\t\t\t\tisPrimary,\n\t\t\t\t\t\t\t\tvariant,\n\t\t\t\t\t\t\t\tnoDefaultClasses = false,\n\t\t\t\t\t\t\t\tonClick,\n\t\t\t\t\t\t\t\turl,\n\t\t\t\t\t\t\t}: NoticeAction &\n\t\t\t\t\t\t\t\t// `isPrimary` is a legacy prop included for\n\t\t\t\t\t\t\t\t// backcompat, but `variant` should be used\n\t\t\t\t\t\t\t\t// instead.\n\t\t\t\t\t\t\t\tPick< DeprecatedButtonProps, 'isPrimary' >,\n\t\t\t\t\t\t\tindex\n\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\tlet computedVariant = variant;\n\t\t\t\t\t\t\tif ( variant !== 'primary' && ! noDefaultClasses ) {\n\t\t\t\t\t\t\t\tcomputedVariant = ! url ? 'secondary' : 'link';\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\ttypeof computedVariant === 'undefined' &&\n\t\t\t\t\t\t\t\tisPrimary\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tcomputedVariant = 'primary';\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\t\thref={ url }\n\t\t\t\t\t\t\t\t\tvariant={ computedVariant }\n\t\t\t\t\t\t\t\t\tonClick={ url ? undefined : onClick }\n\t\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t\t'components-notice__action',\n\t\t\t\t\t\t\t\t\t\tbuttonCustomClasses\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\t\t{ label }\n\t\t\t\t\t\t\t\t</Button>\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</div>\n\t\t\t</div>\n\t\t\t{ isDismissible && (\n\t\t\t\t<Button\n\t\t\t\t\tclassName=\"components-notice__dismiss\"\n\t\t\t\t\ticon={ close }\n\t\t\t\t\tlabel={ __( 'Close' ) }\n\t\t\t\t\tonClick={ onDismissNotice }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nexport default Notice;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["clsx","__","RawHTML","useEffect","renderToString","speak","close","Button","VisuallyHidden","jsx","_jsx","jsxs","_jsxs","noop","useSpokenMessage","message","politeness","spokenMessage","getDefaultPoliteness","status","getStatusLabel","Notice","className","children","onRemove","isDismissible","actions","__unstableHTML","onDismiss","classes","onDismissNotice","map","buttonCustomClasses","label","isPrimary","variant","noDefaultClasses","onClick","url","index","computedVariant","__next40pxDefaultSize","href","undefined","size","icon"],"sources":["@wordpress/components/src/notice/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { RawHTML, useEffect, renderToString } from '@wordpress/element';\nimport { speak } from '@wordpress/a11y';\nimport { close } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport type { NoticeAction, NoticeProps } from './types';\nimport type { DeprecatedButtonProps } from '../button/types';\nimport { VisuallyHidden } from '../visually-hidden';\n\nconst noop = () => {};\n\n/**\n * Custom hook which announces the message with the given politeness, if a\n * valid message is provided.\n */\nfunction useSpokenMessage(\n\tmessage: NoticeProps[ 'spokenMessage' ],\n\tpoliteness: NoticeProps[ 'politeness' ]\n) {\n\tconst spokenMessage =\n\t\ttypeof message === 'string' ? message : renderToString( message );\n\n\tuseEffect( () => {\n\t\tif ( spokenMessage ) {\n\t\t\tspeak( spokenMessage, politeness );\n\t\t}\n\t}, [ spokenMessage, politeness ] );\n}\n\nfunction getDefaultPoliteness( status: NoticeProps[ 'status' ] ) {\n\tswitch ( status ) {\n\t\tcase 'success':\n\t\tcase 'warning':\n\t\tcase 'info':\n\t\t\treturn 'polite';\n\t\t// The default will also catch the 'error' status.\n\t\tdefault:\n\t\t\treturn 'assertive';\n\t}\n}\n\nfunction getStatusLabel( status: NoticeProps[ 'status' ] ) {\n\tswitch ( status ) {\n\t\tcase 'warning':\n\t\t\treturn __( 'Warning notice' );\n\t\tcase 'info':\n\t\t\treturn __( 'Information notice' );\n\t\tcase 'error':\n\t\t\treturn __( 'Error notice' );\n\t\t// The default will also catch the 'success' status.\n\t\tdefault:\n\t\t\treturn __( 'Notice' );\n\t}\n}\n\n/**\n * `Notice` is a component used to communicate feedback to the user.\n *\n *```jsx\n * import { Notice } from `@wordpress/components`;\n *\n * const MyNotice = () => (\n * <Notice status=\"error\">An unknown error occurred.</Notice>\n * );\n * ```\n */\nfunction Notice( {\n\tclassName,\n\tstatus = 'info',\n\tchildren,\n\tspokenMessage = children,\n\tonRemove = noop,\n\tisDismissible = true,\n\tactions = [],\n\tpoliteness = getDefaultPoliteness( status ),\n\t__unstableHTML,\n\t// onDismiss is a callback executed when the notice is dismissed.\n\t// It is distinct from onRemove, which _looks_ like a callback but is\n\t// actually the function to call to remove the notice from the UI.\n\tonDismiss = noop,\n}: NoticeProps ) {\n\tuseSpokenMessage( spokenMessage, politeness );\n\n\tconst classes = clsx( className, 'components-notice', 'is-' + status, {\n\t\t'is-dismissible': isDismissible,\n\t} );\n\n\tif ( __unstableHTML && typeof children === 'string' ) {\n\t\tchildren = <RawHTML>{ children }</RawHTML>;\n\t}\n\n\tconst onDismissNotice = () => {\n\t\tonDismiss();\n\t\tonRemove();\n\t};\n\n\treturn (\n\t\t<div className={ classes }>\n\t\t\t<VisuallyHidden>{ getStatusLabel( status ) }</VisuallyHidden>\n\t\t\t<div className=\"components-notice__content\">\n\t\t\t\t{ children }\n\t\t\t\t<div className=\"components-notice__actions\">\n\t\t\t\t\t{ actions.map(\n\t\t\t\t\t\t(\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tclassName: buttonCustomClasses,\n\t\t\t\t\t\t\t\tlabel,\n\t\t\t\t\t\t\t\tisPrimary,\n\t\t\t\t\t\t\t\tvariant,\n\t\t\t\t\t\t\t\tnoDefaultClasses = false,\n\t\t\t\t\t\t\t\tonClick,\n\t\t\t\t\t\t\t\turl,\n\t\t\t\t\t\t\t}: NoticeAction &\n\t\t\t\t\t\t\t\t// `isPrimary` is a legacy prop included for\n\t\t\t\t\t\t\t\t// backcompat, but `variant` should be used\n\t\t\t\t\t\t\t\t// instead.\n\t\t\t\t\t\t\t\tPick< DeprecatedButtonProps, 'isPrimary' >,\n\t\t\t\t\t\t\tindex\n\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\tlet computedVariant = variant;\n\t\t\t\t\t\t\tif ( variant !== 'primary' && ! noDefaultClasses ) {\n\t\t\t\t\t\t\t\tcomputedVariant = ! url ? 'secondary' : 'link';\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\ttypeof computedVariant === 'undefined' &&\n\t\t\t\t\t\t\t\tisPrimary\n\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\tcomputedVariant = 'primary';\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\t\thref={ url }\n\t\t\t\t\t\t\t\t\tvariant={ computedVariant }\n\t\t\t\t\t\t\t\t\tonClick={ url ? undefined : onClick }\n\t\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t\t'components-notice__action',\n\t\t\t\t\t\t\t\t\t\tbuttonCustomClasses\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\t\t{ label }\n\t\t\t\t\t\t\t\t</Button>\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</div>\n\t\t\t</div>\n\t\t\t{ isDismissible && (\n\t\t\t\t<Button\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\tclassName=\"components-notice__dismiss\"\n\t\t\t\t\ticon={ close }\n\t\t\t\t\tlabel={ __( 'Close' ) }\n\t\t\t\t\tonClick={ onDismissNotice }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nexport default Notice;\n"],"mappings":"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","ignoreList":[]}
@@ -168,6 +168,7 @@ function Option({
168
168
  children: [/*#__PURE__*/_jsxs(HStack, {
169
169
  justify: "flex-start",
170
170
  children: [/*#__PURE__*/_jsx(Button, {
171
+ size: "small",
171
172
  onClick: () => {
172
173
  setIsEditingColor(true);
173
174
  },
@@ -366,6 +367,7 @@ export function PaletteEdit({
366
367
  children: /*#__PURE__*/_jsxs(NavigableMenu, {
367
368
  role: "menu",
368
369
  children: [!isEditing && /*#__PURE__*/_jsx(Button, {
370
+ __next40pxDefaultSize: true,
369
371
  variant: "tertiary",
370
372
  onClick: () => {
371
373
  setIsEditing(true);
@@ -374,6 +376,7 @@ export function PaletteEdit({
374
376
  className: "components-palette-edit__menu-button",
375
377
  children: __('Show details')
376
378
  }), !canOnlyChangeValues && /*#__PURE__*/_jsx(Button, {
379
+ __next40pxDefaultSize: true,
377
380
  variant: "tertiary",
378
381
  onClick: () => {
379
382
  setEditingElement(null);
@@ -384,6 +387,8 @@ export function PaletteEdit({
384
387
  className: "components-palette-edit__menu-button",
385
388
  children: isGradient ? __('Remove all gradients') : __('Remove all colors')
386
389
  }), canReset && /*#__PURE__*/_jsx(Button, {
390
+ __next40pxDefaultSize: true,
391
+ className: "components-palette-edit__menu-button",
387
392
  variant: "tertiary",
388
393
  onClick: () => {
389
394
  setEditingElement(null);
@@ -1 +1 @@
1
- {"version":3,"names":["clsx","useState","useRef","useEffect","useCallback","useMemo","__","sprintf","lineSolid","moreVertical","plus","useDebounce","Button","ColorPicker","FlexItem","HStack","Item","ItemGroup","VStack","GradientPicker","ColorPalette","DropdownMenu","Popover","PaletteActionsContainer","PaletteEditStyles","PaletteHeading","IndicatorStyled","NameContainer","NameInputControl","DoneButton","RemoveButton","PaletteEditContents","NavigableMenu","DEFAULT_GRADIENT","CustomGradientPicker","kebabCase","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","DEFAULT_COLOR","NameInput","value","onChange","label","hideLabelFromVision","deduplicateElementSlugs","elements","slugCounts","map","element","_newSlug","newSlug","slug","getNameAndSlugForPosition","slugPrefix","nameRegex","RegExp","position","reduce","previousValue","currentValue","matches","match","id","parseInt","name","ColorPickerPopover","isGradient","popoverProps","receivedPopoverProps","onClose","shift","offset","resize","placement","className","children","color","enableAlpha","newColor","__experimentalIsRenderedInSidebar","gradient","newGradient","Option","canOnlyChangeValues","onRemove","isEditingColor","setIsEditingColor","popoverAnchor","setPopoverAnchor","anchor","ref","size","justify","onClick","trim","length","style","padding","colorValue","nextName","icon","PaletteEditListView","addColorRef","elementsReferenceRef","current","debounceOnChange","updatedElements","spacing","isRounded","isBordered","isSeparated","index","newElement","currentElement","currentIndex","newElements","filter","_currentElement","undefined","focus","EMPTY_ARRAY","PaletteEdit","gradients","colors","paletteLabel","paletteLabelHeadingLevel","emptyMessage","canReset","isEditing","setIsEditing","editingElement","setEditingElement","isAdding","elementsLength","hasElements","onSelectPaletteItem","newEditingElementIndex","selectedElement","key","level","isPressed","toggleProps","role","variant","clearable","disableCustomGradients","disableCustomColors"],"sources":["@wordpress/components/src/palette-edit/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseState,\n\tuseRef,\n\tuseEffect,\n\tuseCallback,\n\tuseMemo,\n} from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { lineSolid, moreVertical, plus } from '@wordpress/icons';\nimport { useDebounce } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport { ColorPicker } from '../color-picker';\nimport { FlexItem } from '../flex';\nimport { HStack } from '../h-stack';\nimport { Item, ItemGroup } from '../item-group';\nimport { VStack } from '../v-stack';\nimport GradientPicker from '../gradient-picker';\nimport ColorPalette from '../color-palette';\nimport DropdownMenu from '../dropdown-menu';\nimport Popover from '../popover';\nimport {\n\tPaletteActionsContainer,\n\tPaletteEditStyles,\n\tPaletteHeading,\n\tIndicatorStyled,\n\tNameContainer,\n\tNameInputControl,\n\tDoneButton,\n\tRemoveButton,\n\tPaletteEditContents,\n} from './styles';\nimport { NavigableMenu } from '../navigable-container';\nimport { DEFAULT_GRADIENT } from '../custom-gradient-picker/constants';\nimport CustomGradientPicker from '../custom-gradient-picker';\nimport { kebabCase } from '../utils/strings';\nimport type {\n\tColor,\n\tColorPickerPopoverProps,\n\tNameInputProps,\n\tOptionProps,\n\tPaletteEditListViewProps,\n\tPaletteEditProps,\n\tPaletteElement,\n} from './types';\n\nconst DEFAULT_COLOR = '#000';\n\nfunction NameInput( { value, onChange, label }: NameInputProps ) {\n\treturn (\n\t\t<NameInputControl\n\t\t\tlabel={ label }\n\t\t\thideLabelFromVision\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t/>\n\t);\n}\n\n/*\n * Deduplicates the slugs of the provided elements.\n */\nexport function deduplicateElementSlugs< T extends PaletteElement >(\n\telements: T[]\n) {\n\tconst slugCounts: { [ slug: string ]: number } = {};\n\n\treturn elements.map( ( element ) => {\n\t\tlet newSlug: string | undefined;\n\n\t\tconst { slug } = element;\n\t\tslugCounts[ slug ] = ( slugCounts[ slug ] || 0 ) + 1;\n\n\t\tif ( slugCounts[ slug ] > 1 ) {\n\t\t\tnewSlug = `${ slug }-${ slugCounts[ slug ] - 1 }`;\n\t\t}\n\n\t\treturn { ...element, slug: newSlug ?? slug };\n\t} );\n}\n\n/**\n * Returns a name and slug for a palette item. The name takes the format \"Color + id\".\n * To ensure there are no duplicate ids, this function checks all slugs.\n * It expects slugs to be in the format: slugPrefix + color- + number.\n * It then sets the id component of the new name based on the incremented id of the highest existing slug id.\n *\n * @param elements An array of color palette items.\n * @param slugPrefix The slug prefix used to match the element slug.\n *\n * @return A name and slug for the new palette item.\n */\nexport function getNameAndSlugForPosition(\n\telements: PaletteElement[],\n\tslugPrefix: string\n) {\n\tconst nameRegex = new RegExp( `^${ slugPrefix }color-([\\\\d]+)$` );\n\tconst position = elements.reduce( ( previousValue, currentValue ) => {\n\t\tif ( typeof currentValue?.slug === 'string' ) {\n\t\t\tconst matches = currentValue?.slug.match( nameRegex );\n\t\t\tif ( matches ) {\n\t\t\t\tconst id = parseInt( matches[ 1 ], 10 );\n\t\t\t\tif ( id >= previousValue ) {\n\t\t\t\t\treturn id + 1;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\treturn previousValue;\n\t}, 1 );\n\n\treturn {\n\t\tname: sprintf(\n\t\t\t/* translators: %s: is an id for a custom color */\n\t\t\t__( 'Color %s' ),\n\t\t\tposition\n\t\t),\n\t\tslug: `${ slugPrefix }color-${ position }`,\n\t};\n}\n\nfunction ColorPickerPopover< T extends PaletteElement >( {\n\tisGradient,\n\telement,\n\tonChange,\n\tpopoverProps: receivedPopoverProps,\n\tonClose = () => {},\n}: ColorPickerPopoverProps< T > ) {\n\tconst popoverProps: ColorPickerPopoverProps< T >[ 'popoverProps' ] =\n\t\tuseMemo(\n\t\t\t() => ( {\n\t\t\t\tshift: true,\n\t\t\t\toffset: 20,\n\t\t\t\t// Disabling resize as it would otherwise cause the popover to show\n\t\t\t\t// scrollbars while dragging the color picker's handle close to the\n\t\t\t\t// popover edge.\n\t\t\t\tresize: false,\n\t\t\t\tplacement: 'left-start',\n\t\t\t\t...receivedPopoverProps,\n\t\t\t\tclassName: clsx(\n\t\t\t\t\t'components-palette-edit__popover',\n\t\t\t\t\treceivedPopoverProps?.className\n\t\t\t\t),\n\t\t\t} ),\n\t\t\t[ receivedPopoverProps ]\n\t\t);\n\n\treturn (\n\t\t<Popover { ...popoverProps } onClose={ onClose }>\n\t\t\t{ ! isGradient && (\n\t\t\t\t<ColorPicker\n\t\t\t\t\tcolor={ element.color }\n\t\t\t\t\tenableAlpha\n\t\t\t\t\tonChange={ ( newColor ) => {\n\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t...element,\n\t\t\t\t\t\t\tcolor: newColor,\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ isGradient && (\n\t\t\t\t<div className=\"components-palette-edit__popover-gradient-picker\">\n\t\t\t\t\t<CustomGradientPicker\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\tvalue={ element.gradient }\n\t\t\t\t\t\tonChange={ ( newGradient ) => {\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t...element,\n\t\t\t\t\t\t\t\tgradient: newGradient,\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</div>\n\t\t\t) }\n\t\t</Popover>\n\t);\n}\n\nfunction Option< T extends PaletteElement >( {\n\tcanOnlyChangeValues,\n\telement,\n\tonChange,\n\tonRemove,\n\tpopoverProps: receivedPopoverProps,\n\tslugPrefix,\n\tisGradient,\n}: OptionProps< T > ) {\n\tconst value = isGradient ? element.gradient : element.color;\n\tconst [ isEditingColor, setIsEditingColor ] = useState( false );\n\n\t// Use internal state instead of a ref to make sure that the component\n\t// re-renders when the popover's anchor updates.\n\tconst [ popoverAnchor, setPopoverAnchor ] = useState( null );\n\tconst popoverProps = useMemo(\n\t\t() => ( {\n\t\t\t...receivedPopoverProps,\n\t\t\t// Use the custom palette color item as the popover anchor.\n\t\t\tanchor: popoverAnchor,\n\t\t} ),\n\t\t[ popoverAnchor, receivedPopoverProps ]\n\t);\n\n\treturn (\n\t\t<Item ref={ setPopoverAnchor } size=\"small\">\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<Button\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tsetIsEditingColor( true );\n\t\t\t\t\t} }\n\t\t\t\t\taria-label={ sprintf(\n\t\t\t\t\t\t// translators: %s is a color or gradient name, e.g. \"Red\".\n\t\t\t\t\t\t__( 'Edit: %s' ),\n\t\t\t\t\t\telement.name.trim().length ? element.name : value\n\t\t\t\t\t) }\n\t\t\t\t\tstyle={ { padding: 0 } }\n\t\t\t\t>\n\t\t\t\t\t<IndicatorStyled colorValue={ value } />\n\t\t\t\t</Button>\n\t\t\t\t<FlexItem>\n\t\t\t\t\t{ ! canOnlyChangeValues ? (\n\t\t\t\t\t\t<NameInput\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\tisGradient\n\t\t\t\t\t\t\t\t\t? __( 'Gradient name' )\n\t\t\t\t\t\t\t\t\t: __( 'Color name' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ element.name }\n\t\t\t\t\t\t\tonChange={ ( nextName?: string ) =>\n\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t...element,\n\t\t\t\t\t\t\t\t\tname: nextName,\n\t\t\t\t\t\t\t\t\tslug:\n\t\t\t\t\t\t\t\t\t\tslugPrefix +\n\t\t\t\t\t\t\t\t\t\tkebabCase( nextName ?? '' ),\n\t\t\t\t\t\t\t\t} )\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\t\t<NameContainer>\n\t\t\t\t\t\t\t{ element.name.trim().length\n\t\t\t\t\t\t\t\t? element.name\n\t\t\t\t\t\t\t\t: /* Fall back to non-breaking space to maintain height */\n\t\t\t\t\t\t\t\t '\\u00A0' }\n\t\t\t\t\t\t</NameContainer>\n\t\t\t\t\t) }\n\t\t\t\t</FlexItem>\n\t\t\t\t{ ! canOnlyChangeValues && (\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<RemoveButton\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\ticon={ lineSolid }\n\t\t\t\t\t\t\tlabel={ sprintf(\n\t\t\t\t\t\t\t\t// translators: %s is a color or gradient name, e.g. \"Red\".\n\t\t\t\t\t\t\t\t__( 'Remove color: %s' ),\n\t\t\t\t\t\t\t\telement.name.trim().length\n\t\t\t\t\t\t\t\t\t? element.name\n\t\t\t\t\t\t\t\t\t: value\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonClick={ onRemove }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t\t{ isEditingColor && (\n\t\t\t\t<ColorPickerPopover\n\t\t\t\t\tisGradient={ isGradient }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\telement={ element }\n\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\tonClose={ () => setIsEditingColor( false ) }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</Item>\n\t);\n}\n\nfunction PaletteEditListView< T extends PaletteElement >( {\n\telements,\n\tonChange,\n\tcanOnlyChangeValues,\n\tslugPrefix,\n\tisGradient,\n\tpopoverProps,\n\taddColorRef,\n}: PaletteEditListViewProps< T > ) {\n\t// When unmounting the component if there are empty elements (the user did not complete the insertion) clean them.\n\tconst elementsReferenceRef = useRef< typeof elements >();\n\tuseEffect( () => {\n\t\telementsReferenceRef.current = elements;\n\t}, [ elements ] );\n\n\tconst debounceOnChange = useDebounce(\n\t\t( updatedElements: T[] ) =>\n\t\t\tonChange( deduplicateElementSlugs( updatedElements ) ),\n\t\t100\n\t);\n\n\treturn (\n\t\t<VStack spacing={ 3 }>\n\t\t\t<ItemGroup isRounded isBordered isSeparated>\n\t\t\t\t{ elements.map( ( element, index ) => (\n\t\t\t\t\t<Option\n\t\t\t\t\t\tisGradient={ isGradient }\n\t\t\t\t\t\tcanOnlyChangeValues={ canOnlyChangeValues }\n\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\telement={ element }\n\t\t\t\t\t\tonChange={ ( newElement ) => {\n\t\t\t\t\t\t\tdebounceOnChange(\n\t\t\t\t\t\t\t\telements.map(\n\t\t\t\t\t\t\t\t\t( currentElement, currentIndex ) => {\n\t\t\t\t\t\t\t\t\t\tif ( currentIndex === index ) {\n\t\t\t\t\t\t\t\t\t\t\treturn newElement;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\treturn currentElement;\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);\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonRemove={ () => {\n\t\t\t\t\t\t\tconst newElements = elements.filter(\n\t\t\t\t\t\t\t\t( _currentElement, currentIndex ) => {\n\t\t\t\t\t\t\t\t\tif ( currentIndex === index ) {\n\t\t\t\t\t\t\t\t\t\treturn false;\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\treturn true;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\tnewElements.length ? newElements : undefined\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\taddColorRef.current?.focus();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tslugPrefix={ slugPrefix }\n\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</ItemGroup>\n\t\t</VStack>\n\t);\n}\n\nconst EMPTY_ARRAY: Color[] = [];\n\n/**\n * Allows editing a palette of colors or gradients.\n *\n * ```jsx\n * import { PaletteEdit } from '@wordpress/components';\n * const MyPaletteEdit = () => {\n * const [ controlledColors, setControlledColors ] = useState( colors );\n *\n * return (\n * <PaletteEdit\n * colors={ controlledColors }\n * onChange={ ( newColors?: Color[] ) => {\n * setControlledColors( newColors );\n * } }\n * paletteLabel=\"Here is a label\"\n * />\n * );\n * };\n * ```\n */\nexport function PaletteEdit( {\n\tgradients,\n\tcolors = EMPTY_ARRAY,\n\tonChange,\n\tpaletteLabel,\n\tpaletteLabelHeadingLevel = 2,\n\temptyMessage,\n\tcanOnlyChangeValues,\n\tcanReset,\n\tslugPrefix = '',\n\tpopoverProps,\n}: PaletteEditProps ) {\n\tconst isGradient = !! gradients;\n\tconst elements = isGradient ? gradients : colors;\n\tconst [ isEditing, setIsEditing ] = useState( false );\n\tconst [ editingElement, setEditingElement ] = useState<\n\t\tnumber | null | undefined\n\t>( null );\n\tconst isAdding =\n\t\tisEditing &&\n\t\t!! editingElement &&\n\t\telements[ editingElement ] &&\n\t\t! elements[ editingElement ].slug;\n\tconst elementsLength = elements.length;\n\tconst hasElements = elementsLength > 0;\n\tconst debounceOnChange = useDebounce( onChange, 100 );\n\tconst onSelectPaletteItem = useCallback(\n\t\t(\n\t\t\tvalue?: PaletteElement[ keyof PaletteElement ],\n\t\t\tnewEditingElementIndex?: number\n\t\t) => {\n\t\t\tconst selectedElement =\n\t\t\t\tnewEditingElementIndex === undefined\n\t\t\t\t\t? undefined\n\t\t\t\t\t: elements[ newEditingElementIndex ];\n\t\t\tconst key = isGradient ? 'gradient' : 'color';\n\t\t\t// Ensures that the index returned matches a known element value.\n\t\t\tif ( !! selectedElement && selectedElement[ key ] === value ) {\n\t\t\t\tsetEditingElement( newEditingElementIndex );\n\t\t\t} else {\n\t\t\t\tsetIsEditing( true );\n\t\t\t}\n\t\t},\n\t\t[ isGradient, elements ]\n\t);\n\n\tconst addColorRef = useRef< HTMLButtonElement | null >( null );\n\n\treturn (\n\t\t<PaletteEditStyles>\n\t\t\t<HStack>\n\t\t\t\t<PaletteHeading level={ paletteLabelHeadingLevel }>\n\t\t\t\t\t{ paletteLabel }\n\t\t\t\t</PaletteHeading>\n\t\t\t\t<PaletteActionsContainer>\n\t\t\t\t\t{ hasElements && isEditing && (\n\t\t\t\t\t\t<DoneButton\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tsetIsEditing( false );\n\t\t\t\t\t\t\t\tsetEditingElement( null );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Done' ) }\n\t\t\t\t\t\t</DoneButton>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! canOnlyChangeValues && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tref={ addColorRef }\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tisPressed={ isAdding }\n\t\t\t\t\t\t\ticon={ plus }\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\tisGradient\n\t\t\t\t\t\t\t\t\t? __( 'Add gradient' )\n\t\t\t\t\t\t\t\t\t: __( 'Add color' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tconst { name, slug } =\n\t\t\t\t\t\t\t\t\tgetNameAndSlugForPosition(\n\t\t\t\t\t\t\t\t\t\telements,\n\t\t\t\t\t\t\t\t\t\tslugPrefix\n\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\tif ( !! gradients ) {\n\t\t\t\t\t\t\t\t\tonChange( [\n\t\t\t\t\t\t\t\t\t\t...gradients,\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tgradient: DEFAULT_GRADIENT,\n\t\t\t\t\t\t\t\t\t\t\tname,\n\t\t\t\t\t\t\t\t\t\t\tslug,\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} else {\n\t\t\t\t\t\t\t\t\tonChange( [\n\t\t\t\t\t\t\t\t\t\t...colors,\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tcolor: DEFAULT_COLOR,\n\t\t\t\t\t\t\t\t\t\t\tname,\n\t\t\t\t\t\t\t\t\t\t\tslug,\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\tsetIsEditing( true );\n\t\t\t\t\t\t\t\tsetEditingElement( elements.length );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ hasElements &&\n\t\t\t\t\t\t( ! isEditing ||\n\t\t\t\t\t\t\t! canOnlyChangeValues ||\n\t\t\t\t\t\t\tcanReset ) && (\n\t\t\t\t\t\t\t<DropdownMenu\n\t\t\t\t\t\t\t\ticon={ moreVertical }\n\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\tisGradient\n\t\t\t\t\t\t\t\t\t\t? __( 'Gradient options' )\n\t\t\t\t\t\t\t\t\t\t: __( 'Color options' )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\ttoggleProps={ {\n\t\t\t\t\t\t\t\t\tsize: 'small',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ ( { onClose }: { onClose: () => void } ) => (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t<NavigableMenu role=\"menu\">\n\t\t\t\t\t\t\t\t\t\t\t{ ! isEditing && (\n\t\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetIsEditing( true );\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-palette-edit__menu-button\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ __( 'Show details' ) }\n\t\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t{ ! canOnlyChangeValues && (\n\t\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetEditingElement(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnull\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetIsEditing( false );\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChange();\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-palette-edit__menu-button\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ isGradient\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'Remove all gradients'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'Remove all colors'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t ) }\n\t\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t{ canReset && (\n\t\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetEditingElement(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnull\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChange();\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ isGradient\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? __( 'Reset gradient' )\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: __( 'Reset colors' ) }\n\t\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t</NavigableMenu>\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</DropdownMenu>\n\t\t\t\t\t\t) }\n\t\t\t\t</PaletteActionsContainer>\n\t\t\t</HStack>\n\t\t\t{ hasElements && (\n\t\t\t\t<PaletteEditContents>\n\t\t\t\t\t{ isEditing && (\n\t\t\t\t\t\t<PaletteEditListView< ( typeof elements )[ number ] >\n\t\t\t\t\t\t\tcanOnlyChangeValues={ canOnlyChangeValues }\n\t\t\t\t\t\t\telements={ elements }\n\t\t\t\t\t\t\t// @ts-expect-error TODO: Don't know how to resolve\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tslugPrefix={ slugPrefix }\n\t\t\t\t\t\t\tisGradient={ isGradient }\n\t\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t\t\taddColorRef={ addColorRef }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! isEditing && editingElement !== null && (\n\t\t\t\t\t\t<ColorPickerPopover\n\t\t\t\t\t\t\tisGradient={ isGradient }\n\t\t\t\t\t\t\tonClose={ () => setEditingElement( null ) }\n\t\t\t\t\t\t\tonChange={ (\n\t\t\t\t\t\t\t\tnewElement: ( typeof elements )[ number ]\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tdebounceOnChange(\n\t\t\t\t\t\t\t\t\t// @ts-expect-error TODO: Don't know how to resolve\n\t\t\t\t\t\t\t\t\telements.map(\n\t\t\t\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\t\t\t\tcurrentElement: ( typeof elements )[ number ],\n\t\t\t\t\t\t\t\t\t\t\tcurrentIndex: number\n\t\t\t\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\t\tcurrentIndex === editingElement\n\t\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\t\treturn newElement;\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\treturn currentElement;\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} }\n\t\t\t\t\t\t\telement={ elements[ editingElement ?? -1 ] }\n\t\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! isEditing &&\n\t\t\t\t\t\t( isGradient ? (\n\t\t\t\t\t\t\t<GradientPicker\n\t\t\t\t\t\t\t\tgradients={ gradients }\n\t\t\t\t\t\t\t\tonChange={ onSelectPaletteItem }\n\t\t\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\t\t\tdisableCustomGradients\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<ColorPalette\n\t\t\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\t\t\tonChange={ onSelectPaletteItem }\n\t\t\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\t\t\tdisableCustomColors\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) ) }\n\t\t\t\t</PaletteEditContents>\n\t\t\t) }\n\t\t\t{ ! hasElements && emptyMessage && (\n\t\t\t\t<PaletteEditContents>{ emptyMessage }</PaletteEditContents>\n\t\t\t) }\n\t\t</PaletteEditStyles>\n\t);\n}\n\nexport default PaletteEdit;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["clsx","useState","useRef","useEffect","useCallback","useMemo","__","sprintf","lineSolid","moreVertical","plus","useDebounce","Button","ColorPicker","FlexItem","HStack","Item","ItemGroup","VStack","GradientPicker","ColorPalette","DropdownMenu","Popover","PaletteActionsContainer","PaletteEditStyles","PaletteHeading","IndicatorStyled","NameContainer","NameInputControl","DoneButton","RemoveButton","PaletteEditContents","NavigableMenu","DEFAULT_GRADIENT","CustomGradientPicker","kebabCase","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","DEFAULT_COLOR","NameInput","value","onChange","label","hideLabelFromVision","deduplicateElementSlugs","elements","slugCounts","map","element","_newSlug","newSlug","slug","getNameAndSlugForPosition","slugPrefix","nameRegex","RegExp","position","reduce","previousValue","currentValue","matches","match","id","parseInt","name","ColorPickerPopover","isGradient","popoverProps","receivedPopoverProps","onClose","shift","offset","resize","placement","className","children","color","enableAlpha","newColor","__experimentalIsRenderedInSidebar","gradient","newGradient","Option","canOnlyChangeValues","onRemove","isEditingColor","setIsEditingColor","popoverAnchor","setPopoverAnchor","anchor","ref","size","justify","onClick","trim","length","style","padding","colorValue","nextName","icon","PaletteEditListView","addColorRef","elementsReferenceRef","current","debounceOnChange","updatedElements","spacing","isRounded","isBordered","isSeparated","index","newElement","currentElement","currentIndex","newElements","filter","_currentElement","undefined","focus","EMPTY_ARRAY","PaletteEdit","gradients","colors","paletteLabel","paletteLabelHeadingLevel","emptyMessage","canReset","isEditing","setIsEditing","editingElement","setEditingElement","isAdding","elementsLength","hasElements","onSelectPaletteItem","newEditingElementIndex","selectedElement","key","level","isPressed","toggleProps","role","__next40pxDefaultSize","variant","clearable","disableCustomGradients","disableCustomColors"],"sources":["@wordpress/components/src/palette-edit/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseState,\n\tuseRef,\n\tuseEffect,\n\tuseCallback,\n\tuseMemo,\n} from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { lineSolid, moreVertical, plus } from '@wordpress/icons';\nimport { useDebounce } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport { ColorPicker } from '../color-picker';\nimport { FlexItem } from '../flex';\nimport { HStack } from '../h-stack';\nimport { Item, ItemGroup } from '../item-group';\nimport { VStack } from '../v-stack';\nimport GradientPicker from '../gradient-picker';\nimport ColorPalette from '../color-palette';\nimport DropdownMenu from '../dropdown-menu';\nimport Popover from '../popover';\nimport {\n\tPaletteActionsContainer,\n\tPaletteEditStyles,\n\tPaletteHeading,\n\tIndicatorStyled,\n\tNameContainer,\n\tNameInputControl,\n\tDoneButton,\n\tRemoveButton,\n\tPaletteEditContents,\n} from './styles';\nimport { NavigableMenu } from '../navigable-container';\nimport { DEFAULT_GRADIENT } from '../custom-gradient-picker/constants';\nimport CustomGradientPicker from '../custom-gradient-picker';\nimport { kebabCase } from '../utils/strings';\nimport type {\n\tColor,\n\tColorPickerPopoverProps,\n\tNameInputProps,\n\tOptionProps,\n\tPaletteEditListViewProps,\n\tPaletteEditProps,\n\tPaletteElement,\n} from './types';\n\nconst DEFAULT_COLOR = '#000';\n\nfunction NameInput( { value, onChange, label }: NameInputProps ) {\n\treturn (\n\t\t<NameInputControl\n\t\t\tlabel={ label }\n\t\t\thideLabelFromVision\n\t\t\tvalue={ value }\n\t\t\tonChange={ onChange }\n\t\t/>\n\t);\n}\n\n/*\n * Deduplicates the slugs of the provided elements.\n */\nexport function deduplicateElementSlugs< T extends PaletteElement >(\n\telements: T[]\n) {\n\tconst slugCounts: { [ slug: string ]: number } = {};\n\n\treturn elements.map( ( element ) => {\n\t\tlet newSlug: string | undefined;\n\n\t\tconst { slug } = element;\n\t\tslugCounts[ slug ] = ( slugCounts[ slug ] || 0 ) + 1;\n\n\t\tif ( slugCounts[ slug ] > 1 ) {\n\t\t\tnewSlug = `${ slug }-${ slugCounts[ slug ] - 1 }`;\n\t\t}\n\n\t\treturn { ...element, slug: newSlug ?? slug };\n\t} );\n}\n\n/**\n * Returns a name and slug for a palette item. The name takes the format \"Color + id\".\n * To ensure there are no duplicate ids, this function checks all slugs.\n * It expects slugs to be in the format: slugPrefix + color- + number.\n * It then sets the id component of the new name based on the incremented id of the highest existing slug id.\n *\n * @param elements An array of color palette items.\n * @param slugPrefix The slug prefix used to match the element slug.\n *\n * @return A name and slug for the new palette item.\n */\nexport function getNameAndSlugForPosition(\n\telements: PaletteElement[],\n\tslugPrefix: string\n) {\n\tconst nameRegex = new RegExp( `^${ slugPrefix }color-([\\\\d]+)$` );\n\tconst position = elements.reduce( ( previousValue, currentValue ) => {\n\t\tif ( typeof currentValue?.slug === 'string' ) {\n\t\t\tconst matches = currentValue?.slug.match( nameRegex );\n\t\t\tif ( matches ) {\n\t\t\t\tconst id = parseInt( matches[ 1 ], 10 );\n\t\t\t\tif ( id >= previousValue ) {\n\t\t\t\t\treturn id + 1;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\treturn previousValue;\n\t}, 1 );\n\n\treturn {\n\t\tname: sprintf(\n\t\t\t/* translators: %s: is an id for a custom color */\n\t\t\t__( 'Color %s' ),\n\t\t\tposition\n\t\t),\n\t\tslug: `${ slugPrefix }color-${ position }`,\n\t};\n}\n\nfunction ColorPickerPopover< T extends PaletteElement >( {\n\tisGradient,\n\telement,\n\tonChange,\n\tpopoverProps: receivedPopoverProps,\n\tonClose = () => {},\n}: ColorPickerPopoverProps< T > ) {\n\tconst popoverProps: ColorPickerPopoverProps< T >[ 'popoverProps' ] =\n\t\tuseMemo(\n\t\t\t() => ( {\n\t\t\t\tshift: true,\n\t\t\t\toffset: 20,\n\t\t\t\t// Disabling resize as it would otherwise cause the popover to show\n\t\t\t\t// scrollbars while dragging the color picker's handle close to the\n\t\t\t\t// popover edge.\n\t\t\t\tresize: false,\n\t\t\t\tplacement: 'left-start',\n\t\t\t\t...receivedPopoverProps,\n\t\t\t\tclassName: clsx(\n\t\t\t\t\t'components-palette-edit__popover',\n\t\t\t\t\treceivedPopoverProps?.className\n\t\t\t\t),\n\t\t\t} ),\n\t\t\t[ receivedPopoverProps ]\n\t\t);\n\n\treturn (\n\t\t<Popover { ...popoverProps } onClose={ onClose }>\n\t\t\t{ ! isGradient && (\n\t\t\t\t<ColorPicker\n\t\t\t\t\tcolor={ element.color }\n\t\t\t\t\tenableAlpha\n\t\t\t\t\tonChange={ ( newColor ) => {\n\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t...element,\n\t\t\t\t\t\t\tcolor: newColor,\n\t\t\t\t\t\t} );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ isGradient && (\n\t\t\t\t<div className=\"components-palette-edit__popover-gradient-picker\">\n\t\t\t\t\t<CustomGradientPicker\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\tvalue={ element.gradient }\n\t\t\t\t\t\tonChange={ ( newGradient ) => {\n\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t...element,\n\t\t\t\t\t\t\t\tgradient: newGradient,\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</div>\n\t\t\t) }\n\t\t</Popover>\n\t);\n}\n\nfunction Option< T extends PaletteElement >( {\n\tcanOnlyChangeValues,\n\telement,\n\tonChange,\n\tonRemove,\n\tpopoverProps: receivedPopoverProps,\n\tslugPrefix,\n\tisGradient,\n}: OptionProps< T > ) {\n\tconst value = isGradient ? element.gradient : element.color;\n\tconst [ isEditingColor, setIsEditingColor ] = useState( false );\n\n\t// Use internal state instead of a ref to make sure that the component\n\t// re-renders when the popover's anchor updates.\n\tconst [ popoverAnchor, setPopoverAnchor ] = useState( null );\n\tconst popoverProps = useMemo(\n\t\t() => ( {\n\t\t\t...receivedPopoverProps,\n\t\t\t// Use the custom palette color item as the popover anchor.\n\t\t\tanchor: popoverAnchor,\n\t\t} ),\n\t\t[ popoverAnchor, receivedPopoverProps ]\n\t);\n\n\treturn (\n\t\t<Item ref={ setPopoverAnchor } size=\"small\">\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<Button\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tsetIsEditingColor( true );\n\t\t\t\t\t} }\n\t\t\t\t\taria-label={ sprintf(\n\t\t\t\t\t\t// translators: %s is a color or gradient name, e.g. \"Red\".\n\t\t\t\t\t\t__( 'Edit: %s' ),\n\t\t\t\t\t\telement.name.trim().length ? element.name : value\n\t\t\t\t\t) }\n\t\t\t\t\tstyle={ { padding: 0 } }\n\t\t\t\t>\n\t\t\t\t\t<IndicatorStyled colorValue={ value } />\n\t\t\t\t</Button>\n\t\t\t\t<FlexItem>\n\t\t\t\t\t{ ! canOnlyChangeValues ? (\n\t\t\t\t\t\t<NameInput\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\tisGradient\n\t\t\t\t\t\t\t\t\t? __( 'Gradient name' )\n\t\t\t\t\t\t\t\t\t: __( 'Color name' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tvalue={ element.name }\n\t\t\t\t\t\t\tonChange={ ( nextName?: string ) =>\n\t\t\t\t\t\t\t\tonChange( {\n\t\t\t\t\t\t\t\t\t...element,\n\t\t\t\t\t\t\t\t\tname: nextName,\n\t\t\t\t\t\t\t\t\tslug:\n\t\t\t\t\t\t\t\t\t\tslugPrefix +\n\t\t\t\t\t\t\t\t\t\tkebabCase( nextName ?? '' ),\n\t\t\t\t\t\t\t\t} )\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\t\t<NameContainer>\n\t\t\t\t\t\t\t{ element.name.trim().length\n\t\t\t\t\t\t\t\t? element.name\n\t\t\t\t\t\t\t\t: /* Fall back to non-breaking space to maintain height */\n\t\t\t\t\t\t\t\t '\\u00A0' }\n\t\t\t\t\t\t</NameContainer>\n\t\t\t\t\t) }\n\t\t\t\t</FlexItem>\n\t\t\t\t{ ! canOnlyChangeValues && (\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<RemoveButton\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\ticon={ lineSolid }\n\t\t\t\t\t\t\tlabel={ sprintf(\n\t\t\t\t\t\t\t\t// translators: %s is a color or gradient name, e.g. \"Red\".\n\t\t\t\t\t\t\t\t__( 'Remove color: %s' ),\n\t\t\t\t\t\t\t\telement.name.trim().length\n\t\t\t\t\t\t\t\t\t? element.name\n\t\t\t\t\t\t\t\t\t: value\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonClick={ onRemove }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t\t{ isEditingColor && (\n\t\t\t\t<ColorPickerPopover\n\t\t\t\t\tisGradient={ isGradient }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\telement={ element }\n\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\tonClose={ () => setIsEditingColor( false ) }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</Item>\n\t);\n}\n\nfunction PaletteEditListView< T extends PaletteElement >( {\n\telements,\n\tonChange,\n\tcanOnlyChangeValues,\n\tslugPrefix,\n\tisGradient,\n\tpopoverProps,\n\taddColorRef,\n}: PaletteEditListViewProps< T > ) {\n\t// When unmounting the component if there are empty elements (the user did not complete the insertion) clean them.\n\tconst elementsReferenceRef = useRef< typeof elements >();\n\tuseEffect( () => {\n\t\telementsReferenceRef.current = elements;\n\t}, [ elements ] );\n\n\tconst debounceOnChange = useDebounce(\n\t\t( updatedElements: T[] ) =>\n\t\t\tonChange( deduplicateElementSlugs( updatedElements ) ),\n\t\t100\n\t);\n\n\treturn (\n\t\t<VStack spacing={ 3 }>\n\t\t\t<ItemGroup isRounded isBordered isSeparated>\n\t\t\t\t{ elements.map( ( element, index ) => (\n\t\t\t\t\t<Option\n\t\t\t\t\t\tisGradient={ isGradient }\n\t\t\t\t\t\tcanOnlyChangeValues={ canOnlyChangeValues }\n\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\telement={ element }\n\t\t\t\t\t\tonChange={ ( newElement ) => {\n\t\t\t\t\t\t\tdebounceOnChange(\n\t\t\t\t\t\t\t\telements.map(\n\t\t\t\t\t\t\t\t\t( currentElement, currentIndex ) => {\n\t\t\t\t\t\t\t\t\t\tif ( currentIndex === index ) {\n\t\t\t\t\t\t\t\t\t\t\treturn newElement;\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\treturn currentElement;\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);\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tonRemove={ () => {\n\t\t\t\t\t\t\tconst newElements = elements.filter(\n\t\t\t\t\t\t\t\t( _currentElement, currentIndex ) => {\n\t\t\t\t\t\t\t\t\tif ( currentIndex === index ) {\n\t\t\t\t\t\t\t\t\t\treturn false;\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\treturn true;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\tnewElements.length ? newElements : undefined\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\taddColorRef.current?.focus();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tslugPrefix={ slugPrefix }\n\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</ItemGroup>\n\t\t</VStack>\n\t);\n}\n\nconst EMPTY_ARRAY: Color[] = [];\n\n/**\n * Allows editing a palette of colors or gradients.\n *\n * ```jsx\n * import { PaletteEdit } from '@wordpress/components';\n * const MyPaletteEdit = () => {\n * const [ controlledColors, setControlledColors ] = useState( colors );\n *\n * return (\n * <PaletteEdit\n * colors={ controlledColors }\n * onChange={ ( newColors?: Color[] ) => {\n * setControlledColors( newColors );\n * } }\n * paletteLabel=\"Here is a label\"\n * />\n * );\n * };\n * ```\n */\nexport function PaletteEdit( {\n\tgradients,\n\tcolors = EMPTY_ARRAY,\n\tonChange,\n\tpaletteLabel,\n\tpaletteLabelHeadingLevel = 2,\n\temptyMessage,\n\tcanOnlyChangeValues,\n\tcanReset,\n\tslugPrefix = '',\n\tpopoverProps,\n}: PaletteEditProps ) {\n\tconst isGradient = !! gradients;\n\tconst elements = isGradient ? gradients : colors;\n\tconst [ isEditing, setIsEditing ] = useState( false );\n\tconst [ editingElement, setEditingElement ] = useState<\n\t\tnumber | null | undefined\n\t>( null );\n\tconst isAdding =\n\t\tisEditing &&\n\t\t!! editingElement &&\n\t\telements[ editingElement ] &&\n\t\t! elements[ editingElement ].slug;\n\tconst elementsLength = elements.length;\n\tconst hasElements = elementsLength > 0;\n\tconst debounceOnChange = useDebounce( onChange, 100 );\n\tconst onSelectPaletteItem = useCallback(\n\t\t(\n\t\t\tvalue?: PaletteElement[ keyof PaletteElement ],\n\t\t\tnewEditingElementIndex?: number\n\t\t) => {\n\t\t\tconst selectedElement =\n\t\t\t\tnewEditingElementIndex === undefined\n\t\t\t\t\t? undefined\n\t\t\t\t\t: elements[ newEditingElementIndex ];\n\t\t\tconst key = isGradient ? 'gradient' : 'color';\n\t\t\t// Ensures that the index returned matches a known element value.\n\t\t\tif ( !! selectedElement && selectedElement[ key ] === value ) {\n\t\t\t\tsetEditingElement( newEditingElementIndex );\n\t\t\t} else {\n\t\t\t\tsetIsEditing( true );\n\t\t\t}\n\t\t},\n\t\t[ isGradient, elements ]\n\t);\n\n\tconst addColorRef = useRef< HTMLButtonElement | null >( null );\n\n\treturn (\n\t\t<PaletteEditStyles>\n\t\t\t<HStack>\n\t\t\t\t<PaletteHeading level={ paletteLabelHeadingLevel }>\n\t\t\t\t\t{ paletteLabel }\n\t\t\t\t</PaletteHeading>\n\t\t\t\t<PaletteActionsContainer>\n\t\t\t\t\t{ hasElements && isEditing && (\n\t\t\t\t\t\t<DoneButton\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tsetIsEditing( false );\n\t\t\t\t\t\t\t\tsetEditingElement( null );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Done' ) }\n\t\t\t\t\t\t</DoneButton>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! canOnlyChangeValues && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tref={ addColorRef }\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tisPressed={ isAdding }\n\t\t\t\t\t\t\ticon={ plus }\n\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\tisGradient\n\t\t\t\t\t\t\t\t\t? __( 'Add gradient' )\n\t\t\t\t\t\t\t\t\t: __( 'Add color' )\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tconst { name, slug } =\n\t\t\t\t\t\t\t\t\tgetNameAndSlugForPosition(\n\t\t\t\t\t\t\t\t\t\telements,\n\t\t\t\t\t\t\t\t\t\tslugPrefix\n\t\t\t\t\t\t\t\t\t);\n\n\t\t\t\t\t\t\t\tif ( !! gradients ) {\n\t\t\t\t\t\t\t\t\tonChange( [\n\t\t\t\t\t\t\t\t\t\t...gradients,\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tgradient: DEFAULT_GRADIENT,\n\t\t\t\t\t\t\t\t\t\t\tname,\n\t\t\t\t\t\t\t\t\t\t\tslug,\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} else {\n\t\t\t\t\t\t\t\t\tonChange( [\n\t\t\t\t\t\t\t\t\t\t...colors,\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\tcolor: DEFAULT_COLOR,\n\t\t\t\t\t\t\t\t\t\t\tname,\n\t\t\t\t\t\t\t\t\t\t\tslug,\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\tsetIsEditing( true );\n\t\t\t\t\t\t\t\tsetEditingElement( elements.length );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ hasElements &&\n\t\t\t\t\t\t( ! isEditing ||\n\t\t\t\t\t\t\t! canOnlyChangeValues ||\n\t\t\t\t\t\t\tcanReset ) && (\n\t\t\t\t\t\t\t<DropdownMenu\n\t\t\t\t\t\t\t\ticon={ moreVertical }\n\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\tisGradient\n\t\t\t\t\t\t\t\t\t\t? __( 'Gradient options' )\n\t\t\t\t\t\t\t\t\t\t: __( 'Color options' )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\ttoggleProps={ {\n\t\t\t\t\t\t\t\t\tsize: 'small',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ ( { onClose }: { onClose: () => void } ) => (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t<NavigableMenu role=\"menu\">\n\t\t\t\t\t\t\t\t\t\t\t{ ! isEditing && (\n\t\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetIsEditing( true );\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-palette-edit__menu-button\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ __( 'Show details' ) }\n\t\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t{ ! canOnlyChangeValues && (\n\t\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetEditingElement(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnull\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetIsEditing( false );\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChange();\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-palette-edit__menu-button\"\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ isGradient\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'Remove all gradients'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: __(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t'Remove all colors'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t ) }\n\t\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t\t{ canReset && (\n\t\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"components-palette-edit__menu-button\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsetEditingElement(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tnull\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonChange();\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{ isGradient\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? __( 'Reset gradient' )\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: __( 'Reset colors' ) }\n\t\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t</NavigableMenu>\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</DropdownMenu>\n\t\t\t\t\t\t) }\n\t\t\t\t</PaletteActionsContainer>\n\t\t\t</HStack>\n\t\t\t{ hasElements && (\n\t\t\t\t<PaletteEditContents>\n\t\t\t\t\t{ isEditing && (\n\t\t\t\t\t\t<PaletteEditListView< ( typeof elements )[ number ] >\n\t\t\t\t\t\t\tcanOnlyChangeValues={ canOnlyChangeValues }\n\t\t\t\t\t\t\telements={ elements }\n\t\t\t\t\t\t\t// @ts-expect-error TODO: Don't know how to resolve\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tslugPrefix={ slugPrefix }\n\t\t\t\t\t\t\tisGradient={ isGradient }\n\t\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t\t\taddColorRef={ addColorRef }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! isEditing && editingElement !== null && (\n\t\t\t\t\t\t<ColorPickerPopover\n\t\t\t\t\t\t\tisGradient={ isGradient }\n\t\t\t\t\t\t\tonClose={ () => setEditingElement( null ) }\n\t\t\t\t\t\t\tonChange={ (\n\t\t\t\t\t\t\t\tnewElement: ( typeof elements )[ number ]\n\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\tdebounceOnChange(\n\t\t\t\t\t\t\t\t\t// @ts-expect-error TODO: Don't know how to resolve\n\t\t\t\t\t\t\t\t\telements.map(\n\t\t\t\t\t\t\t\t\t\t(\n\t\t\t\t\t\t\t\t\t\t\tcurrentElement: ( typeof elements )[ number ],\n\t\t\t\t\t\t\t\t\t\t\tcurrentIndex: number\n\t\t\t\t\t\t\t\t\t\t) => {\n\t\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\t\tcurrentIndex === editingElement\n\t\t\t\t\t\t\t\t\t\t\t) {\n\t\t\t\t\t\t\t\t\t\t\t\treturn newElement;\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\treturn currentElement;\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} }\n\t\t\t\t\t\t\telement={ elements[ editingElement ?? -1 ] }\n\t\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ ! isEditing &&\n\t\t\t\t\t\t( isGradient ? (\n\t\t\t\t\t\t\t<GradientPicker\n\t\t\t\t\t\t\t\tgradients={ gradients }\n\t\t\t\t\t\t\t\tonChange={ onSelectPaletteItem }\n\t\t\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\t\t\tdisableCustomGradients\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<ColorPalette\n\t\t\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\t\t\tonChange={ onSelectPaletteItem }\n\t\t\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\t\t\tdisableCustomColors\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) ) }\n\t\t\t\t</PaletteEditContents>\n\t\t\t) }\n\t\t\t{ ! hasElements && emptyMessage && (\n\t\t\t\t<PaletteEditContents>{ emptyMessage }</PaletteEditContents>\n\t\t\t) }\n\t\t</PaletteEditStyles>\n\t);\n}\n\nexport default PaletteEdit;\n"],"mappings":"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","ignoreList":[]}
@@ -94,6 +94,7 @@ const PanelBodyTitle = forwardRef(({
94
94
  return /*#__PURE__*/_jsx("h2", {
95
95
  className: "components-panel__body-title",
96
96
  children: /*#__PURE__*/_jsxs(Button, {
97
+ __next40pxDefaultSize: true,
97
98
  className: "components-panel__body-toggle",
98
99
  "aria-expanded": isOpened,
99
100
  ref: ref,
@@ -1 +1 @@
1
- {"version":3,"names":["clsx","useReducedMotion","useMergeRefs","forwardRef","useRef","chevronUp","chevronDown","Button","Icon","useControlledState","useUpdateEffect","jsx","_jsx","jsxs","_jsxs","noop","UnforwardedPanelBody","props","ref","buttonProps","children","className","icon","initialOpen","onToggle","opened","title","scrollAfterOpen","isOpened","setIsOpened","initial","undefined","fallback","nodeRef","scrollBehavior","handleOnToggle","event","preventDefault","next","scrollAfterOpenRef","current","scrollIntoView","inline","block","behavior","classes","PanelBodyTitle","Boolean","onClick","size","PanelBody"],"sources":["@wordpress/components/src/panel/body.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useReducedMotion, useMergeRefs } from '@wordpress/compose';\nimport { forwardRef, useRef } from '@wordpress/element';\nimport { chevronUp, chevronDown } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport type { PanelBodyProps, PanelBodyTitleProps } from './types';\nimport type { WordPressComponentProps } from '../context';\nimport Button from '../button';\nimport Icon from '../icon';\nimport { useControlledState, useUpdateEffect } from '../utils';\n\nconst noop = () => {};\n\nexport function UnforwardedPanelBody(\n\tprops: PanelBodyProps,\n\tref: React.ForwardedRef< HTMLDivElement >\n) {\n\tconst {\n\t\tbuttonProps = {},\n\t\tchildren,\n\t\tclassName,\n\t\ticon,\n\t\tinitialOpen,\n\t\tonToggle = noop,\n\t\topened,\n\t\ttitle,\n\t\tscrollAfterOpen = true,\n\t} = props;\n\tconst [ isOpened, setIsOpened ] = useControlledState< boolean | undefined >(\n\t\topened,\n\t\t{\n\t\t\tinitial: initialOpen === undefined ? true : initialOpen,\n\t\t\tfallback: false,\n\t\t}\n\t);\n\tconst nodeRef = useRef< HTMLElement >( null );\n\n\t// Defaults to 'smooth' scrolling\n\t// https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView\n\tconst scrollBehavior = useReducedMotion() ? 'auto' : 'smooth';\n\n\tconst handleOnToggle = ( event: React.MouseEvent ) => {\n\t\tevent.preventDefault();\n\t\tconst next = ! isOpened;\n\t\tsetIsOpened( next );\n\t\tonToggle( next );\n\t};\n\n\t// Ref is used so that the effect does not re-run upon scrollAfterOpen changing value.\n\tconst scrollAfterOpenRef = useRef< boolean | undefined >();\n\tscrollAfterOpenRef.current = scrollAfterOpen;\n\t// Runs after initial render.\n\tuseUpdateEffect( () => {\n\t\tif (\n\t\t\tisOpened &&\n\t\t\tscrollAfterOpenRef.current &&\n\t\t\tnodeRef.current?.scrollIntoView\n\t\t) {\n\t\t\t/*\n\t\t\t * Scrolls the content into view when visible.\n\t\t\t * This improves the UX when there are multiple stacking <PanelBody />\n\t\t\t * components in a scrollable container.\n\t\t\t */\n\t\t\tnodeRef.current.scrollIntoView( {\n\t\t\t\tinline: 'nearest',\n\t\t\t\tblock: 'nearest',\n\t\t\t\tbehavior: scrollBehavior,\n\t\t\t} );\n\t\t}\n\t}, [ isOpened, scrollBehavior ] );\n\n\tconst classes = clsx( 'components-panel__body', className, {\n\t\t'is-opened': isOpened,\n\t} );\n\n\treturn (\n\t\t<div className={ classes } ref={ useMergeRefs( [ nodeRef, ref ] ) }>\n\t\t\t<PanelBodyTitle\n\t\t\t\ticon={ icon }\n\t\t\t\tisOpened={ Boolean( isOpened ) }\n\t\t\t\tonClick={ handleOnToggle }\n\t\t\t\ttitle={ title }\n\t\t\t\t{ ...buttonProps }\n\t\t\t/>\n\t\t\t{ typeof children === 'function'\n\t\t\t\t? children( { opened: Boolean( isOpened ) } )\n\t\t\t\t: isOpened && children }\n\t\t</div>\n\t);\n}\n\nconst PanelBodyTitle = forwardRef(\n\t(\n\t\t{\n\t\t\tisOpened,\n\t\t\ticon,\n\t\t\ttitle,\n\t\t\t...props\n\t\t}: WordPressComponentProps< PanelBodyTitleProps, 'button' >,\n\t\tref: React.ForwardedRef< any >\n\t) => {\n\t\tif ( ! title ) {\n\t\t\treturn null;\n\t\t}\n\n\t\treturn (\n\t\t\t<h2 className=\"components-panel__body-title\">\n\t\t\t\t<Button\n\t\t\t\t\tclassName=\"components-panel__body-toggle\"\n\t\t\t\t\taria-expanded={ isOpened }\n\t\t\t\t\tref={ ref }\n\t\t\t\t\t{ ...props }\n\t\t\t\t>\n\t\t\t\t\t{ /*\n\t\t\t\t\tFirefox + NVDA don't announce aria-expanded because the browser\n\t\t\t\t\trepaints the whole element, so this wrapping span hides that.\n\t\t\t\t*/ }\n\t\t\t\t\t<span aria-hidden=\"true\">\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\tclassName=\"components-panel__arrow\"\n\t\t\t\t\t\t\ticon={ isOpened ? chevronUp : chevronDown }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</span>\n\t\t\t\t\t{ title }\n\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\t\tclassName=\"components-panel__icon\"\n\t\t\t\t\t\t\tsize={ 20 }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</Button>\n\t\t\t</h2>\n\t\t);\n\t}\n);\n\nexport const PanelBody = forwardRef( UnforwardedPanelBody );\n\nexport default PanelBody;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["clsx","useReducedMotion","useMergeRefs","forwardRef","useRef","chevronUp","chevronDown","Button","Icon","useControlledState","useUpdateEffect","jsx","_jsx","jsxs","_jsxs","noop","UnforwardedPanelBody","props","ref","buttonProps","children","className","icon","initialOpen","onToggle","opened","title","scrollAfterOpen","isOpened","setIsOpened","initial","undefined","fallback","nodeRef","scrollBehavior","handleOnToggle","event","preventDefault","next","scrollAfterOpenRef","current","scrollIntoView","inline","block","behavior","classes","PanelBodyTitle","Boolean","onClick","__next40pxDefaultSize","size","PanelBody"],"sources":["@wordpress/components/src/panel/body.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useReducedMotion, useMergeRefs } from '@wordpress/compose';\nimport { forwardRef, useRef } from '@wordpress/element';\nimport { chevronUp, chevronDown } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport type { PanelBodyProps, PanelBodyTitleProps } from './types';\nimport type { WordPressComponentProps } from '../context';\nimport Button from '../button';\nimport Icon from '../icon';\nimport { useControlledState, useUpdateEffect } from '../utils';\n\nconst noop = () => {};\n\nexport function UnforwardedPanelBody(\n\tprops: PanelBodyProps,\n\tref: React.ForwardedRef< HTMLDivElement >\n) {\n\tconst {\n\t\tbuttonProps = {},\n\t\tchildren,\n\t\tclassName,\n\t\ticon,\n\t\tinitialOpen,\n\t\tonToggle = noop,\n\t\topened,\n\t\ttitle,\n\t\tscrollAfterOpen = true,\n\t} = props;\n\tconst [ isOpened, setIsOpened ] = useControlledState< boolean | undefined >(\n\t\topened,\n\t\t{\n\t\t\tinitial: initialOpen === undefined ? true : initialOpen,\n\t\t\tfallback: false,\n\t\t}\n\t);\n\tconst nodeRef = useRef< HTMLElement >( null );\n\n\t// Defaults to 'smooth' scrolling\n\t// https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView\n\tconst scrollBehavior = useReducedMotion() ? 'auto' : 'smooth';\n\n\tconst handleOnToggle = ( event: React.MouseEvent ) => {\n\t\tevent.preventDefault();\n\t\tconst next = ! isOpened;\n\t\tsetIsOpened( next );\n\t\tonToggle( next );\n\t};\n\n\t// Ref is used so that the effect does not re-run upon scrollAfterOpen changing value.\n\tconst scrollAfterOpenRef = useRef< boolean | undefined >();\n\tscrollAfterOpenRef.current = scrollAfterOpen;\n\t// Runs after initial render.\n\tuseUpdateEffect( () => {\n\t\tif (\n\t\t\tisOpened &&\n\t\t\tscrollAfterOpenRef.current &&\n\t\t\tnodeRef.current?.scrollIntoView\n\t\t) {\n\t\t\t/*\n\t\t\t * Scrolls the content into view when visible.\n\t\t\t * This improves the UX when there are multiple stacking <PanelBody />\n\t\t\t * components in a scrollable container.\n\t\t\t */\n\t\t\tnodeRef.current.scrollIntoView( {\n\t\t\t\tinline: 'nearest',\n\t\t\t\tblock: 'nearest',\n\t\t\t\tbehavior: scrollBehavior,\n\t\t\t} );\n\t\t}\n\t}, [ isOpened, scrollBehavior ] );\n\n\tconst classes = clsx( 'components-panel__body', className, {\n\t\t'is-opened': isOpened,\n\t} );\n\n\treturn (\n\t\t<div className={ classes } ref={ useMergeRefs( [ nodeRef, ref ] ) }>\n\t\t\t<PanelBodyTitle\n\t\t\t\ticon={ icon }\n\t\t\t\tisOpened={ Boolean( isOpened ) }\n\t\t\t\tonClick={ handleOnToggle }\n\t\t\t\ttitle={ title }\n\t\t\t\t{ ...buttonProps }\n\t\t\t/>\n\t\t\t{ typeof children === 'function'\n\t\t\t\t? children( { opened: Boolean( isOpened ) } )\n\t\t\t\t: isOpened && children }\n\t\t</div>\n\t);\n}\n\nconst PanelBodyTitle = forwardRef(\n\t(\n\t\t{\n\t\t\tisOpened,\n\t\t\ticon,\n\t\t\ttitle,\n\t\t\t...props\n\t\t}: WordPressComponentProps< PanelBodyTitleProps, 'button' >,\n\t\tref: React.ForwardedRef< any >\n\t) => {\n\t\tif ( ! title ) {\n\t\t\treturn null;\n\t\t}\n\n\t\treturn (\n\t\t\t<h2 className=\"components-panel__body-title\">\n\t\t\t\t<Button\n\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\tclassName=\"components-panel__body-toggle\"\n\t\t\t\t\taria-expanded={ isOpened }\n\t\t\t\t\tref={ ref }\n\t\t\t\t\t{ ...props }\n\t\t\t\t>\n\t\t\t\t\t{ /*\n\t\t\t\t\tFirefox + NVDA don't announce aria-expanded because the browser\n\t\t\t\t\trepaints the whole element, so this wrapping span hides that.\n\t\t\t\t*/ }\n\t\t\t\t\t<span aria-hidden=\"true\">\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\tclassName=\"components-panel__arrow\"\n\t\t\t\t\t\t\ticon={ isOpened ? chevronUp : chevronDown }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</span>\n\t\t\t\t\t{ title }\n\t\t\t\t\t{ icon && (\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\t\tclassName=\"components-panel__icon\"\n\t\t\t\t\t\t\tsize={ 20 }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</Button>\n\t\t\t</h2>\n\t\t);\n\t}\n);\n\nexport const PanelBody = forwardRef( UnforwardedPanelBody );\n\nexport default PanelBody;\n"],"mappings":"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","ignoreList":[]}