@wordpress/components 20.0.2-next.957ca95e4c.0 → 21.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (895) hide show
  1. package/CHANGELOG.md +68 -1
  2. package/CONTRIBUTING.md +3 -54
  3. package/build/alignment-matrix-control/styles/alignment-matrix-control-styles.js +9 -9
  4. package/build/alignment-matrix-control/styles/alignment-matrix-control-styles.js.map +1 -1
  5. package/build/angle-picker-control/index.js +10 -0
  6. package/build/angle-picker-control/index.js.map +1 -1
  7. package/build/autocomplete/autocompleter-ui.js +3 -3
  8. package/build/autocomplete/autocompleter-ui.js.map +1 -1
  9. package/build/border-box-control/border-box-control/component.js +10 -7
  10. package/build/border-box-control/border-box-control/component.js.map +1 -1
  11. package/build/border-box-control/border-box-control-linked-button/component.js +1 -2
  12. package/build/border-box-control/border-box-control-linked-button/component.js.map +1 -1
  13. package/build/border-box-control/border-box-control-split-controls/component.js +10 -7
  14. package/build/border-box-control/border-box-control-split-controls/component.js.map +1 -1
  15. package/build/border-box-control/styles.js +7 -7
  16. package/build/border-box-control/styles.js.map +1 -1
  17. package/build/border-control/border-control-dropdown/component.js +2 -1
  18. package/build/border-control/border-control-dropdown/component.js.map +1 -1
  19. package/build/box-control/linked-button.js +3 -3
  20. package/build/box-control/linked-button.js.map +1 -1
  21. package/build/card/styles.js +17 -17
  22. package/build/card/styles.js.map +1 -1
  23. package/build/checkbox-control/index.js +3 -3
  24. package/build/checkbox-control/index.js.map +1 -1
  25. package/build/color-palette/index.js +1 -1
  26. package/build/color-palette/index.js.map +1 -1
  27. package/build/color-picker/input-with-slider.js +2 -1
  28. package/build/color-picker/input-with-slider.js.map +1 -1
  29. package/build/combobox-control/index.js +1 -1
  30. package/build/combobox-control/index.js.map +1 -1
  31. package/build/custom-gradient-picker/index.js +1 -1
  32. package/build/custom-gradient-picker/index.js.map +1 -1
  33. package/build/date-time/date/index.js +1 -1
  34. package/build/date-time/date/index.js.map +1 -1
  35. package/build/date-time/time/timezone.js +1 -1
  36. package/build/date-time/time/timezone.js.map +1 -1
  37. package/build/disabled/index.js +14 -6
  38. package/build/disabled/index.js.map +1 -1
  39. package/build/disabled/styles/disabled-styles.js +8 -18
  40. package/build/disabled/styles/disabled-styles.js.map +1 -1
  41. package/build/drop-zone/index.js +44 -9
  42. package/build/drop-zone/index.js.map +1 -1
  43. package/build/drop-zone/provider.js.map +1 -1
  44. package/build/drop-zone/types.js +6 -0
  45. package/build/drop-zone/types.js.map +1 -0
  46. package/build/dropdown/index.js +11 -4
  47. package/build/dropdown/index.js.map +1 -1
  48. package/build/flex/flex/hook.js +6 -30
  49. package/build/flex/flex/hook.js.map +1 -1
  50. package/build/focal-point-picker/controls.js +10 -5
  51. package/build/focal-point-picker/controls.js.map +1 -1
  52. package/build/focal-point-picker/focal-point.js.map +1 -1
  53. package/build/focal-point-picker/grid.js.map +1 -1
  54. package/build/focal-point-picker/index.js +83 -16
  55. package/build/focal-point-picker/index.js.map +1 -1
  56. package/build/focal-point-picker/media.js +4 -0
  57. package/build/focal-point-picker/media.js.map +1 -1
  58. package/build/focal-point-picker/styles/focal-point-picker-style.js +70 -41
  59. package/build/focal-point-picker/styles/focal-point-picker-style.js.map +1 -1
  60. package/build/focal-point-picker/styles/focal-point-style.js +12 -12
  61. package/build/focal-point-picker/styles/focal-point-style.js.map +1 -1
  62. package/build/focal-point-picker/types.js +6 -0
  63. package/build/focal-point-picker/types.js.map +1 -0
  64. package/build/focal-point-picker/utils.js +6 -6
  65. package/build/focal-point-picker/utils.js.map +1 -1
  66. package/build/font-size-picker/index.js +11 -0
  67. package/build/font-size-picker/index.js.map +1 -1
  68. package/build/font-size-picker/utils.js +1 -1
  69. package/build/font-size-picker/utils.js.map +1 -1
  70. package/build/form-file-upload/index.js +22 -2
  71. package/build/form-file-upload/index.js.map +1 -1
  72. package/build/form-file-upload/types.js +6 -0
  73. package/build/form-file-upload/types.js.map +1 -0
  74. package/build/form-toggle/index.js +1 -3
  75. package/build/form-toggle/index.js.map +1 -1
  76. package/build/form-token-field/index.js +4 -6
  77. package/build/form-token-field/index.js.map +1 -1
  78. package/build/form-token-field/suggestions-list.js +1 -3
  79. package/build/form-token-field/suggestions-list.js.map +1 -1
  80. package/build/gradient-picker/index.js +25 -26
  81. package/build/gradient-picker/index.js.map +1 -1
  82. package/build/icon/index.js +1 -2
  83. package/build/icon/index.js.map +1 -1
  84. package/build/input-control/input-base.js +3 -2
  85. package/build/input-control/input-base.js.map +1 -1
  86. package/build/input-control/label.js +2 -2
  87. package/build/input-control/label.js.map +1 -1
  88. package/build/input-control/styles/input-control-styles.js +41 -128
  89. package/build/input-control/styles/input-control-styles.js.map +1 -1
  90. package/build/modal/aria-helper.js +3 -10
  91. package/build/modal/aria-helper.js.map +1 -1
  92. package/build/navigable-container/container.js +5 -1
  93. package/build/navigable-container/container.js.map +1 -1
  94. package/build/navigable-container/menu.js +10 -12
  95. package/build/navigable-container/menu.js.map +1 -1
  96. package/build/navigable-container/tabbable.js +2 -4
  97. package/build/navigable-container/tabbable.js.map +1 -1
  98. package/build/navigation/menu/menu-title-search.js +2 -1
  99. package/build/navigation/menu/menu-title-search.js.map +1 -1
  100. package/build/navigation/menu/use-navigation-tree-menu.js +2 -1
  101. package/build/navigation/menu/use-navigation-tree-menu.js.map +1 -1
  102. package/build/navigator/navigator-button/hook.js +1 -1
  103. package/build/navigator/navigator-button/hook.js.map +1 -1
  104. package/build/navigator/navigator-screen/component.js +2 -2
  105. package/build/navigator/navigator-screen/component.js.map +1 -1
  106. package/build/number-control/index.js +29 -25
  107. package/build/number-control/index.js.map +1 -1
  108. package/build/number-control/types.js +6 -0
  109. package/build/number-control/types.js.map +1 -0
  110. package/build/placeholder/index.js +1 -3
  111. package/build/placeholder/index.js.map +1 -1
  112. package/build/popover/index.js +190 -160
  113. package/build/popover/index.js.map +1 -1
  114. package/build/popover/types.js +6 -0
  115. package/build/popover/types.js.map +1 -0
  116. package/build/popover/utils.js +125 -24
  117. package/build/popover/utils.js.map +1 -1
  118. package/build/radio-control/index.js +7 -4
  119. package/build/radio-control/index.js.map +1 -1
  120. package/build/range-control/index.js +4 -1
  121. package/build/range-control/index.js.map +1 -1
  122. package/build/range-control/styles/range-control-styles.js +33 -33
  123. package/build/range-control/styles/range-control-styles.js.map +1 -1
  124. package/build/sandbox/index.js +2 -2
  125. package/build/sandbox/index.js.map +1 -1
  126. package/build/search-control/index.js +38 -10
  127. package/build/search-control/index.js.map +1 -1
  128. package/build/search-control/types.js +6 -0
  129. package/build/search-control/types.js.map +1 -0
  130. package/build/select-control/index.native.js +2 -1
  131. package/build/select-control/index.native.js.map +1 -1
  132. package/build/tab-panel/index.js +48 -9
  133. package/build/tab-panel/index.js.map +1 -1
  134. package/build/tab-panel/types.js +6 -0
  135. package/build/tab-panel/types.js.map +1 -0
  136. package/build/text-control/index.js +2 -0
  137. package/build/text-control/index.js.map +1 -1
  138. package/build/textarea-control/index.js +3 -3
  139. package/build/textarea-control/index.js.map +1 -1
  140. package/build/toggle-control/index.js +44 -4
  141. package/build/toggle-control/index.js.map +1 -1
  142. package/build/toggle-control/types.js +6 -0
  143. package/build/toggle-control/types.js.map +1 -0
  144. package/build/toggle-group-control/toggle-group-control/component.js +2 -2
  145. package/build/toggle-group-control/toggle-group-control/component.js.map +1 -1
  146. package/build/toggle-group-control/toggle-group-control-option-icon/component.js +1 -1
  147. package/build/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -1
  148. package/build/tooltip/index.js +9 -7
  149. package/build/tooltip/index.js.map +1 -1
  150. package/build/ui/context/context-connect.js +31 -22
  151. package/build/ui/context/context-connect.js.map +1 -1
  152. package/build/ui/context/context-system-provider.js +4 -3
  153. package/build/ui/context/context-system-provider.js.map +1 -1
  154. package/build/unit-control/index.js +1 -1
  155. package/build/unit-control/index.js.map +1 -1
  156. package/build/unit-control/styles/unit-control-styles.js +9 -9
  157. package/build/unit-control/styles/unit-control-styles.js.map +1 -1
  158. package/build/utils/colors-values.js +2 -30
  159. package/build/utils/colors-values.js.map +1 -1
  160. package/build/utils/math.js +4 -4
  161. package/build/utils/math.js.map +1 -1
  162. package/build/utils/values.js +62 -6
  163. package/build/utils/values.js.map +1 -1
  164. package/build/view/component.js +6 -7
  165. package/build/view/component.js.map +1 -1
  166. package/build/view/types.js +6 -0
  167. package/build/view/types.js.map +1 -0
  168. package/build-module/alignment-matrix-control/styles/alignment-matrix-control-styles.js +9 -9
  169. package/build-module/alignment-matrix-control/styles/alignment-matrix-control-styles.js.map +1 -1
  170. package/build-module/angle-picker-control/index.js +9 -0
  171. package/build-module/angle-picker-control/index.js.map +1 -1
  172. package/build-module/autocomplete/autocompleter-ui.js +4 -4
  173. package/build-module/autocomplete/autocompleter-ui.js.map +1 -1
  174. package/build-module/border-box-control/border-box-control/component.js +11 -8
  175. package/build-module/border-box-control/border-box-control/component.js.map +1 -1
  176. package/build-module/border-box-control/border-box-control-linked-button/component.js +1 -2
  177. package/build-module/border-box-control/border-box-control-linked-button/component.js.map +1 -1
  178. package/build-module/border-box-control/border-box-control-split-controls/component.js +11 -8
  179. package/build-module/border-box-control/border-box-control-split-controls/component.js.map +1 -1
  180. package/build-module/border-box-control/styles.js +7 -7
  181. package/build-module/border-box-control/styles.js.map +1 -1
  182. package/build-module/border-control/border-control-dropdown/component.js +2 -1
  183. package/build-module/border-control/border-control-dropdown/component.js.map +1 -1
  184. package/build-module/box-control/linked-button.js +3 -3
  185. package/build-module/box-control/linked-button.js.map +1 -1
  186. package/build-module/card/styles.js +17 -17
  187. package/build-module/card/styles.js.map +1 -1
  188. package/build-module/checkbox-control/index.js +3 -3
  189. package/build-module/checkbox-control/index.js.map +1 -1
  190. package/build-module/color-palette/index.js +1 -1
  191. package/build-module/color-palette/index.js.map +1 -1
  192. package/build-module/color-picker/input-with-slider.js +2 -1
  193. package/build-module/color-picker/input-with-slider.js.map +1 -1
  194. package/build-module/combobox-control/index.js +1 -1
  195. package/build-module/combobox-control/index.js.map +1 -1
  196. package/build-module/custom-gradient-picker/index.js +1 -1
  197. package/build-module/custom-gradient-picker/index.js.map +1 -1
  198. package/build-module/date-time/date/index.js +2 -3
  199. package/build-module/date-time/date/index.js.map +1 -1
  200. package/build-module/date-time/time/timezone.js +1 -1
  201. package/build-module/date-time/time/timezone.js.map +1 -1
  202. package/build-module/disabled/index.js +16 -8
  203. package/build-module/disabled/index.js.map +1 -1
  204. package/build-module/disabled/styles/disabled-styles.js +6 -12
  205. package/build-module/disabled/styles/disabled-styles.js.map +1 -1
  206. package/build-module/drop-zone/index.js +40 -9
  207. package/build-module/drop-zone/index.js.map +1 -1
  208. package/build-module/drop-zone/provider.js.map +1 -1
  209. package/build-module/drop-zone/types.js +2 -0
  210. package/build-module/drop-zone/types.js.map +1 -0
  211. package/build-module/dropdown/index.js +10 -4
  212. package/build-module/dropdown/index.js.map +1 -1
  213. package/build-module/flex/flex/hook.js +7 -29
  214. package/build-module/flex/flex/hook.js.map +1 -1
  215. package/build-module/focal-point-picker/controls.js +11 -6
  216. package/build-module/focal-point-picker/controls.js.map +1 -1
  217. package/build-module/focal-point-picker/focal-point.js.map +1 -1
  218. package/build-module/focal-point-picker/grid.js.map +1 -1
  219. package/build-module/focal-point-picker/index.js +81 -16
  220. package/build-module/focal-point-picker/index.js.map +1 -1
  221. package/build-module/focal-point-picker/media.js +4 -0
  222. package/build-module/focal-point-picker/media.js.map +1 -1
  223. package/build-module/focal-point-picker/styles/focal-point-picker-style.js +68 -40
  224. package/build-module/focal-point-picker/styles/focal-point-picker-style.js.map +1 -1
  225. package/build-module/focal-point-picker/styles/focal-point-style.js +12 -12
  226. package/build-module/focal-point-picker/styles/focal-point-style.js.map +1 -1
  227. package/build-module/focal-point-picker/types.js +2 -0
  228. package/build-module/focal-point-picker/types.js.map +1 -0
  229. package/build-module/focal-point-picker/utils.js +6 -6
  230. package/build-module/focal-point-picker/utils.js.map +1 -1
  231. package/build-module/font-size-picker/index.js +10 -0
  232. package/build-module/font-size-picker/index.js.map +1 -1
  233. package/build-module/font-size-picker/utils.js +1 -1
  234. package/build-module/font-size-picker/utils.js.map +1 -1
  235. package/build-module/form-file-upload/index.js +21 -4
  236. package/build-module/form-file-upload/index.js.map +1 -1
  237. package/build-module/form-file-upload/types.js +2 -0
  238. package/build-module/form-file-upload/types.js.map +1 -0
  239. package/build-module/form-toggle/index.js +1 -3
  240. package/build-module/form-toggle/index.js.map +1 -1
  241. package/build-module/form-token-field/index.js +4 -5
  242. package/build-module/form-token-field/index.js.map +1 -1
  243. package/build-module/form-token-field/suggestions-list.js +1 -2
  244. package/build-module/form-token-field/suggestions-list.js.map +1 -1
  245. package/build-module/gradient-picker/index.js +25 -26
  246. package/build-module/gradient-picker/index.js.map +1 -1
  247. package/build-module/icon/index.js +1 -2
  248. package/build-module/icon/index.js.map +1 -1
  249. package/build-module/input-control/input-base.js +4 -3
  250. package/build-module/input-control/input-base.js.map +1 -1
  251. package/build-module/input-control/label.js +3 -3
  252. package/build-module/input-control/label.js.map +1 -1
  253. package/build-module/input-control/styles/input-control-styles.js +41 -127
  254. package/build-module/input-control/styles/input-control-styles.js.map +1 -1
  255. package/build-module/modal/aria-helper.js +3 -8
  256. package/build-module/modal/aria-helper.js.map +1 -1
  257. package/build-module/navigable-container/container.js +5 -1
  258. package/build-module/navigable-container/container.js.map +1 -1
  259. package/build-module/navigable-container/menu.js +10 -11
  260. package/build-module/navigable-container/menu.js.map +1 -1
  261. package/build-module/navigable-container/tabbable.js +2 -3
  262. package/build-module/navigable-container/tabbable.js.map +1 -1
  263. package/build-module/navigation/menu/menu-title-search.js +2 -1
  264. package/build-module/navigation/menu/menu-title-search.js.map +1 -1
  265. package/build-module/navigation/menu/use-navigation-tree-menu.js +2 -1
  266. package/build-module/navigation/menu/use-navigation-tree-menu.js.map +1 -1
  267. package/build-module/navigator/navigator-button/hook.js +1 -1
  268. package/build-module/navigator/navigator-button/hook.js.map +1 -1
  269. package/build-module/navigator/navigator-screen/component.js +2 -2
  270. package/build-module/navigator/navigator-screen/component.js.map +1 -1
  271. package/build-module/number-control/index.js +31 -23
  272. package/build-module/number-control/index.js.map +1 -1
  273. package/build-module/number-control/types.js +2 -0
  274. package/build-module/number-control/types.js.map +1 -0
  275. package/build-module/placeholder/index.js +1 -3
  276. package/build-module/placeholder/index.js.map +1 -1
  277. package/build-module/popover/index.js +192 -162
  278. package/build-module/popover/index.js.map +1 -1
  279. package/build-module/popover/types.js +2 -0
  280. package/build-module/popover/types.js.map +1 -0
  281. package/build-module/popover/utils.js +118 -23
  282. package/build-module/popover/utils.js.map +1 -1
  283. package/build-module/radio-control/index.js +7 -5
  284. package/build-module/radio-control/index.js.map +1 -1
  285. package/build-module/range-control/index.js +4 -1
  286. package/build-module/range-control/index.js.map +1 -1
  287. package/build-module/range-control/styles/range-control-styles.js +33 -33
  288. package/build-module/range-control/styles/range-control-styles.js.map +1 -1
  289. package/build-module/sandbox/index.js +2 -2
  290. package/build-module/sandbox/index.js.map +1 -1
  291. package/build-module/search-control/index.js +34 -7
  292. package/build-module/search-control/index.js.map +1 -1
  293. package/build-module/search-control/types.js +2 -0
  294. package/build-module/search-control/types.js.map +1 -0
  295. package/build-module/select-control/index.native.js +1 -1
  296. package/build-module/select-control/index.native.js.map +1 -1
  297. package/build-module/tab-panel/index.js +46 -10
  298. package/build-module/tab-panel/index.js.map +1 -1
  299. package/build-module/tab-panel/types.js +2 -0
  300. package/build-module/tab-panel/types.js.map +1 -0
  301. package/build-module/text-control/index.js +2 -0
  302. package/build-module/text-control/index.js.map +1 -1
  303. package/build-module/textarea-control/index.js +3 -3
  304. package/build-module/textarea-control/index.js.map +1 -1
  305. package/build-module/toggle-control/index.js +38 -4
  306. package/build-module/toggle-control/index.js.map +1 -1
  307. package/build-module/toggle-control/types.js +2 -0
  308. package/build-module/toggle-control/types.js.map +1 -0
  309. package/build-module/toggle-group-control/toggle-group-control/component.js +2 -2
  310. package/build-module/toggle-group-control/toggle-group-control/component.js.map +1 -1
  311. package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js +1 -1
  312. package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -1
  313. package/build-module/tooltip/index.js +10 -8
  314. package/build-module/tooltip/index.js.map +1 -1
  315. package/build-module/ui/context/context-connect.js +30 -23
  316. package/build-module/ui/context/context-connect.js.map +1 -1
  317. package/build-module/ui/context/context-system-provider.js +5 -4
  318. package/build-module/ui/context/context-system-provider.js.map +1 -1
  319. package/build-module/unit-control/index.js +1 -1
  320. package/build-module/unit-control/index.js.map +1 -1
  321. package/build-module/unit-control/styles/unit-control-styles.js +9 -9
  322. package/build-module/unit-control/styles/unit-control-styles.js.map +1 -1
  323. package/build-module/utils/colors-values.js +2 -30
  324. package/build-module/utils/colors-values.js.map +1 -1
  325. package/build-module/utils/math.js +4 -4
  326. package/build-module/utils/math.js.map +1 -1
  327. package/build-module/utils/values.js +48 -6
  328. package/build-module/utils/values.js.map +1 -1
  329. package/build-module/view/component.js +5 -8
  330. package/build-module/view/component.js.map +1 -1
  331. package/build-module/view/types.js +2 -0
  332. package/build-module/view/types.js.map +1 -0
  333. package/build-style/style-rtl.css +4 -31
  334. package/build-style/style.css +4 -31
  335. package/build-types/base-field/hook.d.ts +54 -55
  336. package/build-types/base-field/hook.d.ts.map +1 -1
  337. package/build-types/border-box-control/border-box-control/component.d.ts +10 -2
  338. package/build-types/border-box-control/border-box-control/component.d.ts.map +1 -1
  339. package/build-types/border-box-control/border-box-control/hook.d.ts +56 -57
  340. package/build-types/border-box-control/border-box-control/hook.d.ts.map +1 -1
  341. package/build-types/border-box-control/border-box-control-linked-button/component.d.ts +2 -1
  342. package/build-types/border-box-control/border-box-control-linked-button/component.d.ts.map +1 -1
  343. package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts +55 -56
  344. package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts.map +1 -1
  345. package/build-types/border-box-control/border-box-control-split-controls/component.d.ts +9 -2
  346. package/build-types/border-box-control/border-box-control-split-controls/component.d.ts.map +1 -1
  347. package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts +56 -57
  348. package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts.map +1 -1
  349. package/build-types/border-box-control/border-box-control-visualizer/component.d.ts +2 -1
  350. package/build-types/border-box-control/border-box-control-visualizer/component.d.ts.map +1 -1
  351. package/build-types/border-box-control/border-box-control-visualizer/hook.d.ts +55 -56
  352. package/build-types/border-box-control/border-box-control-visualizer/hook.d.ts.map +1 -1
  353. package/build-types/border-box-control/styles.d.ts.map +1 -1
  354. package/build-types/border-box-control/types.d.ts +5 -4
  355. package/build-types/border-box-control/types.d.ts.map +1 -1
  356. package/build-types/border-control/border-control/component.d.ts +14 -2
  357. package/build-types/border-control/border-control/component.d.ts.map +1 -1
  358. package/build-types/border-control/border-control/hook.d.ts +56 -57
  359. package/build-types/border-control/border-control/hook.d.ts.map +1 -1
  360. package/build-types/border-control/border-control-dropdown/component.d.ts +10 -2
  361. package/build-types/border-control/border-control-dropdown/component.d.ts.map +1 -1
  362. package/build-types/border-control/border-control-dropdown/hook.d.ts +56 -57
  363. package/build-types/border-control/border-control-dropdown/hook.d.ts.map +1 -1
  364. package/build-types/border-control/border-control-style-picker/component.d.ts +6 -2
  365. package/build-types/border-control/border-control-style-picker/component.d.ts.map +1 -1
  366. package/build-types/border-control/border-control-style-picker/hook.d.ts +55 -56
  367. package/build-types/border-control/border-control-style-picker/hook.d.ts.map +1 -1
  368. package/build-types/border-control/stories/index.d.ts +74 -6
  369. package/build-types/border-control/stories/index.d.ts.map +1 -1
  370. package/build-types/border-control/types.d.ts +6 -8
  371. package/build-types/border-control/types.d.ts.map +1 -1
  372. package/build-types/button-group/index.d.ts +1 -3
  373. package/build-types/button-group/index.d.ts.map +1 -1
  374. package/build-types/card/card/component.d.ts +9 -2
  375. package/build-types/card/card/component.d.ts.map +1 -1
  376. package/build-types/card/card/hook.d.ts +55 -56
  377. package/build-types/card/card/hook.d.ts.map +1 -1
  378. package/build-types/card/card-body/component.d.ts +9 -2
  379. package/build-types/card/card-body/component.d.ts.map +1 -1
  380. package/build-types/card/card-body/hook.d.ts +55 -56
  381. package/build-types/card/card-body/hook.d.ts.map +1 -1
  382. package/build-types/card/card-divider/component.d.ts +7 -2
  383. package/build-types/card/card-divider/component.d.ts.map +1 -1
  384. package/build-types/card/card-divider/hook.d.ts +55 -55
  385. package/build-types/card/card-footer/component.d.ts +11 -2
  386. package/build-types/card/card-footer/component.d.ts.map +1 -1
  387. package/build-types/card/card-footer/hook.d.ts +55 -56
  388. package/build-types/card/card-footer/hook.d.ts.map +1 -1
  389. package/build-types/card/card-header/component.d.ts +1 -1
  390. package/build-types/card/card-header/component.d.ts.map +1 -1
  391. package/build-types/card/card-header/hook.d.ts +55 -56
  392. package/build-types/card/card-header/hook.d.ts.map +1 -1
  393. package/build-types/card/card-media/component.d.ts +2 -1
  394. package/build-types/card/card-media/component.d.ts.map +1 -1
  395. package/build-types/card/card-media/hook.d.ts +55 -56
  396. package/build-types/card/card-media/hook.d.ts.map +1 -1
  397. package/build-types/checkbox-control/index.d.ts +1 -1
  398. package/build-types/checkbox-control/index.d.ts.map +1 -1
  399. package/build-types/checkbox-control/stories/index.d.ts.map +1 -1
  400. package/build-types/checkbox-control/types.d.ts +1 -1
  401. package/build-types/checkbox-control/types.d.ts.map +1 -1
  402. package/build-types/color-indicator/index.d.ts +1 -3
  403. package/build-types/color-indicator/index.d.ts.map +1 -1
  404. package/build-types/color-palette/styles.d.ts +1 -3
  405. package/build-types/color-palette/styles.d.ts.map +1 -1
  406. package/build-types/color-picker/component.d.ts +2 -1
  407. package/build-types/color-picker/component.d.ts.map +1 -1
  408. package/build-types/color-picker/input-with-slider.d.ts.map +1 -1
  409. package/build-types/color-picker/styles.d.ts +12 -25
  410. package/build-types/color-picker/styles.d.ts.map +1 -1
  411. package/build-types/confirm-dialog/component.d.ts +4 -8
  412. package/build-types/confirm-dialog/component.d.ts.map +1 -1
  413. package/build-types/date-time/date/styles.d.ts +4 -8
  414. package/build-types/date-time/date/styles.d.ts.map +1 -1
  415. package/build-types/date-time/date-time/styles.d.ts +4 -6
  416. package/build-types/date-time/date-time/styles.d.ts.map +1 -1
  417. package/build-types/date-time/time/styles.d.ts +21 -43
  418. package/build-types/date-time/time/styles.d.ts.map +1 -1
  419. package/build-types/disabled/index.d.ts +1 -1
  420. package/build-types/disabled/index.d.ts.map +1 -1
  421. package/build-types/disabled/styles/disabled-styles.d.ts +1 -5
  422. package/build-types/disabled/styles/disabled-styles.d.ts.map +1 -1
  423. package/build-types/divider/component.d.ts +7 -2
  424. package/build-types/divider/component.d.ts.map +1 -1
  425. package/build-types/drop-zone/index.d.ts +29 -0
  426. package/build-types/drop-zone/index.d.ts.map +1 -0
  427. package/build-types/drop-zone/provider.d.ts +5 -0
  428. package/build-types/drop-zone/provider.d.ts.map +1 -0
  429. package/build-types/drop-zone/stories/index.d.ts +12 -0
  430. package/build-types/drop-zone/stories/index.d.ts.map +1 -0
  431. package/build-types/drop-zone/types.d.ts +29 -0
  432. package/build-types/drop-zone/types.d.ts.map +1 -0
  433. package/build-types/dropdown/dropdown-content-wrapper.d.ts +2 -1
  434. package/build-types/dropdown/dropdown-content-wrapper.d.ts.map +1 -1
  435. package/build-types/dropdown/index.d.ts.map +1 -1
  436. package/build-types/elevation/component.d.ts +2 -1
  437. package/build-types/elevation/component.d.ts.map +1 -1
  438. package/build-types/elevation/hook.d.ts +54 -55
  439. package/build-types/elevation/hook.d.ts.map +1 -1
  440. package/build-types/external-link/index.d.ts +1 -1
  441. package/build-types/external-link/index.d.ts.map +1 -1
  442. package/build-types/external-link/styles/external-link-styles.d.ts +1 -1
  443. package/build-types/flex/flex/component.d.ts +2 -1
  444. package/build-types/flex/flex/component.d.ts.map +1 -1
  445. package/build-types/flex/flex/hook.d.ts +55 -56
  446. package/build-types/flex/flex/hook.d.ts.map +1 -1
  447. package/build-types/flex/flex-block/component.d.ts +2 -1
  448. package/build-types/flex/flex-block/component.d.ts.map +1 -1
  449. package/build-types/flex/flex-block/hook.d.ts +55 -56
  450. package/build-types/flex/flex-block/hook.d.ts.map +1 -1
  451. package/build-types/flex/flex-item/component.d.ts +2 -1
  452. package/build-types/flex/flex-item/component.d.ts.map +1 -1
  453. package/build-types/flex/flex-item/hook.d.ts +55 -56
  454. package/build-types/flex/flex-item/hook.d.ts.map +1 -1
  455. package/build-types/focal-point-picker/controls.d.ts +4 -0
  456. package/build-types/focal-point-picker/controls.d.ts.map +1 -0
  457. package/build-types/focal-point-picker/focal-point.d.ts +5 -0
  458. package/build-types/focal-point-picker/focal-point.d.ts.map +1 -0
  459. package/build-types/focal-point-picker/grid.d.ts +5 -0
  460. package/build-types/focal-point-picker/grid.d.ts.map +1 -0
  461. package/build-types/focal-point-picker/index.d.ts +51 -0
  462. package/build-types/focal-point-picker/index.d.ts.map +1 -0
  463. package/build-types/focal-point-picker/media.d.ts +4 -0
  464. package/build-types/focal-point-picker/media.d.ts.map +1 -0
  465. package/build-types/focal-point-picker/stories/index.d.ts +15 -0
  466. package/build-types/focal-point-picker/stories/index.d.ts.map +1 -0
  467. package/build-types/focal-point-picker/styles/focal-point-picker-style.d.ts +56 -0
  468. package/build-types/focal-point-picker/styles/focal-point-picker-style.d.ts.map +1 -0
  469. package/build-types/focal-point-picker/styles/focal-point-style.d.ts +19 -0
  470. package/build-types/focal-point-picker/styles/focal-point-style.d.ts.map +1 -0
  471. package/build-types/focal-point-picker/types.d.ts +79 -0
  472. package/build-types/focal-point-picker/types.d.ts.map +1 -0
  473. package/build-types/focal-point-picker/utils.d.ts +26 -0
  474. package/build-types/focal-point-picker/utils.d.ts.map +1 -0
  475. package/build-types/form-file-upload/index.d.ts +22 -0
  476. package/build-types/form-file-upload/index.d.ts.map +1 -0
  477. package/build-types/form-file-upload/stories/index.d.ts +23 -0
  478. package/build-types/form-file-upload/stories/index.d.ts.map +1 -0
  479. package/build-types/form-file-upload/test/index.d.ts +2 -0
  480. package/build-types/form-file-upload/test/index.d.ts.map +1 -0
  481. package/build-types/form-file-upload/types.d.ts +63 -0
  482. package/build-types/form-file-upload/types.d.ts.map +1 -0
  483. package/build-types/form-toggle/index.d.ts +1 -1
  484. package/build-types/form-toggle/index.d.ts.map +1 -1
  485. package/build-types/form-token-field/index.d.ts.map +1 -1
  486. package/build-types/form-token-field/styles.d.ts +1 -3
  487. package/build-types/form-token-field/styles.d.ts.map +1 -1
  488. package/build-types/form-token-field/suggestions-list.d.ts.map +1 -1
  489. package/build-types/form-token-field/token-input.d.ts +1 -3
  490. package/build-types/form-token-field/token-input.d.ts.map +1 -1
  491. package/build-types/grid/component.d.ts +2 -1
  492. package/build-types/grid/component.d.ts.map +1 -1
  493. package/build-types/grid/hook.d.ts +55 -56
  494. package/build-types/grid/hook.d.ts.map +1 -1
  495. package/build-types/h-stack/component.d.ts +5 -2
  496. package/build-types/h-stack/component.d.ts.map +1 -1
  497. package/build-types/h-stack/hook.d.ts +55 -56
  498. package/build-types/h-stack/hook.d.ts.map +1 -1
  499. package/build-types/heading/component.d.ts +4 -2
  500. package/build-types/heading/component.d.ts.map +1 -1
  501. package/build-types/heading/hook.d.ts +54 -55
  502. package/build-types/heading/hook.d.ts.map +1 -1
  503. package/build-types/input-control/index.d.ts +1 -1
  504. package/build-types/input-control/index.d.ts.map +1 -1
  505. package/build-types/input-control/input-base.d.ts.map +1 -1
  506. package/build-types/input-control/input-field.d.ts +1 -3
  507. package/build-types/input-control/input-field.d.ts.map +1 -1
  508. package/build-types/input-control/input-prefix-wrapper.d.ts +2 -1
  509. package/build-types/input-control/input-prefix-wrapper.d.ts.map +1 -1
  510. package/build-types/input-control/input-suffix-wrapper.d.ts +2 -1
  511. package/build-types/input-control/input-suffix-wrapper.d.ts.map +1 -1
  512. package/build-types/input-control/label.d.ts.map +1 -1
  513. package/build-types/input-control/stories/index.d.ts +5 -5
  514. package/build-types/input-control/stories/index.d.ts.map +1 -1
  515. package/build-types/input-control/styles/input-control-styles.d.ts +2 -6
  516. package/build-types/input-control/styles/input-control-styles.d.ts.map +1 -1
  517. package/build-types/input-control/types.d.ts +3 -0
  518. package/build-types/input-control/types.d.ts.map +1 -1
  519. package/build-types/item-group/item/component.d.ts +2 -1
  520. package/build-types/item-group/item/component.d.ts.map +1 -1
  521. package/build-types/item-group/item/hook.d.ts +54 -55
  522. package/build-types/item-group/item/hook.d.ts.map +1 -1
  523. package/build-types/item-group/item-group/component.d.ts +2 -1
  524. package/build-types/item-group/item-group/component.d.ts.map +1 -1
  525. package/build-types/item-group/item-group/hook.d.ts +54 -55
  526. package/build-types/item-group/item-group/hook.d.ts.map +1 -1
  527. package/build-types/modal/aria-helper.d.ts.map +1 -1
  528. package/build-types/navigable-container/menu.d.ts.map +1 -1
  529. package/build-types/navigable-container/tabbable.d.ts.map +1 -1
  530. package/build-types/navigator/navigator-back-button/component.d.ts +4 -2
  531. package/build-types/navigator/navigator-back-button/component.d.ts.map +1 -1
  532. package/build-types/navigator/navigator-back-button/hook.d.ts +59 -60
  533. package/build-types/navigator/navigator-back-button/hook.d.ts.map +1 -1
  534. package/build-types/navigator/navigator-button/component.d.ts +7 -2
  535. package/build-types/navigator/navigator-button/component.d.ts.map +1 -1
  536. package/build-types/navigator/navigator-button/hook.d.ts +59 -60
  537. package/build-types/navigator/navigator-button/hook.d.ts.map +1 -1
  538. package/build-types/navigator/navigator-provider/component.d.ts +2 -1
  539. package/build-types/navigator/navigator-provider/component.d.ts.map +1 -1
  540. package/build-types/navigator/navigator-screen/component.d.ts +1 -1
  541. package/build-types/navigator/navigator-screen/component.d.ts.map +1 -1
  542. package/build-types/number-control/index.d.ts +10 -28
  543. package/build-types/number-control/index.d.ts.map +1 -1
  544. package/build-types/number-control/styles/number-control-styles.d.ts +1 -1
  545. package/build-types/number-control/types.d.ts +72 -0
  546. package/build-types/number-control/types.d.ts.map +1 -0
  547. package/build-types/placeholder/index.d.ts +1 -1
  548. package/build-types/placeholder/index.d.ts.map +1 -1
  549. package/build-types/popover/index.d.ts +28 -24
  550. package/build-types/popover/index.d.ts.map +1 -1
  551. package/build-types/popover/stories/index.d.ts +12 -0
  552. package/build-types/popover/stories/index.d.ts.map +1 -0
  553. package/build-types/popover/types.d.ts +179 -0
  554. package/build-types/popover/types.d.ts.map +1 -0
  555. package/build-types/popover/utils.d.ts +42 -24
  556. package/build-types/popover/utils.d.ts.map +1 -1
  557. package/build-types/radio-control/index.d.ts +1 -1
  558. package/build-types/radio-control/index.d.ts.map +1 -1
  559. package/build-types/range-control/index.d.ts +2 -4
  560. package/build-types/range-control/index.d.ts.map +1 -1
  561. package/build-types/range-control/input-range.d.ts +2 -4
  562. package/build-types/range-control/input-range.d.ts.map +1 -1
  563. package/build-types/range-control/styles/range-control-styles.d.ts +5 -10
  564. package/build-types/range-control/styles/range-control-styles.d.ts.map +1 -1
  565. package/build-types/resizable-box/index.d.ts +1 -1
  566. package/build-types/resizable-box/resize-tooltip/index.d.ts +1 -1
  567. package/build-types/resizable-box/resize-tooltip/label.d.ts +1 -1
  568. package/build-types/resizable-box/resize-tooltip/styles/resize-tooltip.styles.d.ts +1 -3
  569. package/build-types/resizable-box/resize-tooltip/styles/resize-tooltip.styles.d.ts.map +1 -1
  570. package/build-types/scrollable/component.d.ts +2 -1
  571. package/build-types/scrollable/component.d.ts.map +1 -1
  572. package/build-types/scrollable/hook.d.ts +55 -56
  573. package/build-types/scrollable/hook.d.ts.map +1 -1
  574. package/build-types/search-control/index.d.ts +29 -0
  575. package/build-types/search-control/index.d.ts.map +1 -0
  576. package/build-types/search-control/stories/index.d.ts +47 -0
  577. package/build-types/search-control/stories/index.d.ts.map +1 -0
  578. package/build-types/search-control/types.d.ts +39 -0
  579. package/build-types/search-control/types.d.ts.map +1 -0
  580. package/build-types/select-control/index.d.ts +1 -3
  581. package/build-types/select-control/index.d.ts.map +1 -1
  582. package/build-types/select-control/stories/index.d.ts +2 -6
  583. package/build-types/select-control/stories/index.d.ts.map +1 -1
  584. package/build-types/select-control/styles/select-control-styles.d.ts +1 -3
  585. package/build-types/select-control/styles/select-control-styles.d.ts.map +1 -1
  586. package/build-types/spacer/component.d.ts +2 -1
  587. package/build-types/spacer/component.d.ts.map +1 -1
  588. package/build-types/spacer/hook.d.ts +55 -56
  589. package/build-types/spacer/hook.d.ts.map +1 -1
  590. package/build-types/spinner/index.d.ts +1 -3
  591. package/build-types/spinner/index.d.ts.map +1 -1
  592. package/build-types/surface/component.d.ts +2 -1
  593. package/build-types/surface/component.d.ts.map +1 -1
  594. package/build-types/surface/hook.d.ts +55 -56
  595. package/build-types/surface/hook.d.ts.map +1 -1
  596. package/build-types/tab-panel/index.d.ts +42 -0
  597. package/build-types/tab-panel/index.d.ts.map +1 -0
  598. package/build-types/tab-panel/stories/index.d.ts +12 -0
  599. package/build-types/tab-panel/stories/index.d.ts.map +1 -0
  600. package/build-types/tab-panel/test/index.d.ts +2 -0
  601. package/build-types/tab-panel/test/index.d.ts.map +1 -0
  602. package/build-types/tab-panel/types.d.ts +64 -0
  603. package/build-types/tab-panel/types.d.ts.map +1 -0
  604. package/build-types/text/component.d.ts +1 -1
  605. package/build-types/text/component.d.ts.map +1 -1
  606. package/build-types/text/hook.d.ts +55 -56
  607. package/build-types/text/hook.d.ts.map +1 -1
  608. package/build-types/text-control/index.d.ts +2 -4
  609. package/build-types/text-control/index.d.ts.map +1 -1
  610. package/build-types/text-control/types.d.ts +1 -1
  611. package/build-types/text-control/types.d.ts.map +1 -1
  612. package/build-types/textarea-control/index.d.ts +1 -1
  613. package/build-types/textarea-control/index.d.ts.map +1 -1
  614. package/build-types/textarea-control/types.d.ts +1 -1
  615. package/build-types/textarea-control/types.d.ts.map +1 -1
  616. package/build-types/toggle-control/index.d.ts +26 -0
  617. package/build-types/toggle-control/index.d.ts.map +1 -0
  618. package/build-types/toggle-control/stories/index.d.ts +13 -0
  619. package/build-types/toggle-control/stories/index.d.ts.map +1 -0
  620. package/build-types/toggle-control/test/index.d.ts +2 -0
  621. package/build-types/toggle-control/test/index.d.ts.map +1 -0
  622. package/build-types/toggle-control/types.d.ts +20 -0
  623. package/build-types/toggle-control/types.d.ts.map +1 -0
  624. package/build-types/toggle-group-control/stories/index.d.ts +4 -2
  625. package/build-types/toggle-group-control/stories/index.d.ts.map +1 -1
  626. package/build-types/toggle-group-control/toggle-group-control/component.d.ts +12 -2
  627. package/build-types/toggle-group-control/toggle-group-control/component.d.ts.map +1 -1
  628. package/build-types/toggle-group-control/toggle-group-control-option/component.d.ts +2 -4
  629. package/build-types/toggle-group-control/toggle-group-control-option/component.d.ts.map +1 -1
  630. package/build-types/toggle-group-control/toggle-group-control-option-base/component.d.ts +2 -1
  631. package/build-types/toggle-group-control/toggle-group-control-option-base/component.d.ts.map +1 -1
  632. package/build-types/toggle-group-control/toggle-group-control-option-icon/component.d.ts +3 -5
  633. package/build-types/toggle-group-control/toggle-group-control-option-icon/component.d.ts.map +1 -1
  634. package/build-types/toggle-group-control/types.d.ts +2 -2
  635. package/build-types/toggle-group-control/types.d.ts.map +1 -1
  636. package/build-types/tools-panel/tools-panel/component.d.ts +2 -1
  637. package/build-types/tools-panel/tools-panel/component.d.ts.map +1 -1
  638. package/build-types/tools-panel/tools-panel/hook.d.ts +55 -56
  639. package/build-types/tools-panel/tools-panel/hook.d.ts.map +1 -1
  640. package/build-types/tools-panel/tools-panel-header/component.d.ts +2 -1
  641. package/build-types/tools-panel/tools-panel-header/component.d.ts.map +1 -1
  642. package/build-types/tools-panel/tools-panel-header/hook.d.ts +55 -56
  643. package/build-types/tools-panel/tools-panel-header/hook.d.ts.map +1 -1
  644. package/build-types/tools-panel/tools-panel-item/component.d.ts +6 -2
  645. package/build-types/tools-panel/tools-panel-item/component.d.ts.map +1 -1
  646. package/build-types/tools-panel/tools-panel-item/hook.d.ts +55 -56
  647. package/build-types/tools-panel/tools-panel-item/hook.d.ts.map +1 -1
  648. package/build-types/tooltip/index.d.ts.map +1 -1
  649. package/build-types/truncate/component.d.ts +2 -1
  650. package/build-types/truncate/component.d.ts.map +1 -1
  651. package/build-types/truncate/hook.d.ts +55 -56
  652. package/build-types/truncate/hook.d.ts.map +1 -1
  653. package/build-types/ui/context/context-connect.d.ts +10 -9
  654. package/build-types/ui/context/context-connect.d.ts.map +1 -1
  655. package/build-types/ui/context/context-system-provider.d.ts.map +1 -1
  656. package/build-types/ui/context/test/context-connect.d.ts +2 -0
  657. package/build-types/ui/context/test/context-connect.d.ts.map +1 -0
  658. package/build-types/ui/context/test/wordpress-component.d.ts +2 -0
  659. package/build-types/ui/context/test/wordpress-component.d.ts.map +1 -0
  660. package/build-types/ui/context/wordpress-component.d.ts +8 -9
  661. package/build-types/ui/context/wordpress-component.d.ts.map +1 -1
  662. package/build-types/ui/control-group/component.d.ts +4 -1
  663. package/build-types/ui/control-group/component.d.ts.map +1 -1
  664. package/build-types/ui/control-group/hook.d.ts +55 -56
  665. package/build-types/ui/control-group/hook.d.ts.map +1 -1
  666. package/build-types/ui/control-label/component.d.ts +4 -1
  667. package/build-types/ui/control-label/component.d.ts.map +1 -1
  668. package/build-types/ui/control-label/hook.d.ts +55 -56
  669. package/build-types/ui/control-label/hook.d.ts.map +1 -1
  670. package/build-types/ui/form-group/form-group.d.ts +4 -8
  671. package/build-types/ui/form-group/form-group.d.ts.map +1 -1
  672. package/build-types/ui/form-group/use-form-group.d.ts +112 -114
  673. package/build-types/ui/form-group/use-form-group.d.ts.map +1 -1
  674. package/build-types/ui/shortcut/component.d.ts +2 -1
  675. package/build-types/ui/shortcut/component.d.ts.map +1 -1
  676. package/build-types/ui/spinner/component.d.ts +1 -1
  677. package/build-types/ui/tooltip/component.d.ts +11 -1
  678. package/build-types/ui/tooltip/component.d.ts.map +1 -1
  679. package/build-types/ui/tooltip/content.d.ts +7 -1
  680. package/build-types/ui/tooltip/styles.d.ts +1 -3
  681. package/build-types/ui/tooltip/styles.d.ts.map +1 -1
  682. package/build-types/unit-control/index.d.ts +2 -12
  683. package/build-types/unit-control/index.d.ts.map +1 -1
  684. package/build-types/unit-control/stories/index.d.ts.map +1 -1
  685. package/build-types/unit-control/styles/unit-control-styles.d.ts +5 -10
  686. package/build-types/unit-control/styles/unit-control-styles.d.ts.map +1 -1
  687. package/build-types/unit-control/types.d.ts +3 -35
  688. package/build-types/unit-control/types.d.ts.map +1 -1
  689. package/build-types/utils/colors-values.d.ts +0 -18
  690. package/build-types/utils/colors-values.d.ts.map +1 -1
  691. package/build-types/utils/math.d.ts +6 -6
  692. package/build-types/utils/math.d.ts.map +1 -1
  693. package/build-types/utils/values.d.ts +10 -8
  694. package/build-types/utils/values.d.ts.map +1 -1
  695. package/build-types/v-stack/component.d.ts +8 -2
  696. package/build-types/v-stack/component.d.ts.map +1 -1
  697. package/build-types/v-stack/hook.d.ts +55 -56
  698. package/build-types/v-stack/hook.d.ts.map +1 -1
  699. package/build-types/v-stack/stories/index.d.ts +8 -1
  700. package/build-types/v-stack/stories/index.d.ts.map +1 -1
  701. package/build-types/view/component.d.ts +8 -6
  702. package/build-types/view/component.d.ts.map +1 -1
  703. package/build-types/view/stories/index.d.ts +12 -0
  704. package/build-types/view/stories/index.d.ts.map +1 -0
  705. package/build-types/view/types.d.ts +8 -0
  706. package/build-types/view/types.d.ts.map +1 -0
  707. package/build-types/visually-hidden/component.d.ts +2 -1
  708. package/build-types/visually-hidden/component.d.ts.map +1 -1
  709. package/build-types/z-stack/component.d.ts +2 -1
  710. package/build-types/z-stack/component.d.ts.map +1 -1
  711. package/package.json +17 -17
  712. package/src/alignment-matrix-control/styles/alignment-matrix-control-styles.js +1 -1
  713. package/src/angle-picker-control/README.md +9 -1
  714. package/src/angle-picker-control/index.js +12 -0
  715. package/src/angle-picker-control/stories/index.js +3 -3
  716. package/src/autocomplete/autocompleter-ui.js +6 -3
  717. package/src/base-field/test/__snapshots__/index.js.snap +3 -5
  718. package/src/border-box-control/border-box-control/component.tsx +28 -12
  719. package/src/border-box-control/border-box-control-linked-button/component.tsx +1 -2
  720. package/src/border-box-control/border-box-control-split-controls/component.tsx +25 -11
  721. package/src/border-box-control/stories/index.js +1 -0
  722. package/src/border-box-control/styles.ts +2 -1
  723. package/src/border-box-control/types.ts +5 -4
  724. package/src/border-control/border-control-dropdown/component.tsx +3 -8
  725. package/src/border-control/types.ts +7 -9
  726. package/src/box-control/linked-button.js +3 -3
  727. package/src/box-control/test/index.js +5 -5
  728. package/src/button/style.scss +4 -3
  729. package/src/card/styles.ts +1 -1
  730. package/src/card/test/__snapshots__/index.tsx.snap +39 -51
  731. package/src/checkbox-control/index.tsx +3 -6
  732. package/src/checkbox-control/stories/index.tsx +6 -2
  733. package/src/checkbox-control/types.ts +4 -1
  734. package/src/color-palette/index.js +1 -1
  735. package/src/color-palette/test/__snapshots__/index.js.snap +67 -91
  736. package/src/color-picker/input-with-slider.tsx +1 -0
  737. package/src/combobox-control/index.js +1 -1
  738. package/src/combobox-control/test/index.js +311 -0
  739. package/src/custom-gradient-picker/index.js +1 -1
  740. package/src/date-time/date/index.tsx +2 -2
  741. package/src/date-time/time/timezone.tsx +1 -1
  742. package/src/dimension-control/test/__snapshots__/index.test.js.snap +1122 -164
  743. package/src/dimension-control/test/index.test.js +29 -38
  744. package/src/disabled/index.tsx +27 -9
  745. package/src/disabled/styles/disabled-styles.tsx +2 -2
  746. package/src/disabled/test/index.tsx +38 -0
  747. package/src/drop-zone/README.md +3 -3
  748. package/src/drop-zone/{index.js → index.tsx} +48 -13
  749. package/src/drop-zone/{provider.js → provider.ts} +5 -1
  750. package/src/drop-zone/stories/index.tsx +30 -0
  751. package/src/drop-zone/types.ts +29 -0
  752. package/src/dropdown/README.md +6 -4
  753. package/src/dropdown/index.js +15 -3
  754. package/src/dropdown/stories/index.js +1 -1
  755. package/src/flex/flex/hook.ts +5 -54
  756. package/src/flex/test/__snapshots__/index.tsx.snap +7 -15
  757. package/src/focal-point-picker/README.md +2 -2
  758. package/src/focal-point-picker/{controls.js → controls.tsx} +38 -10
  759. package/src/focal-point-picker/{focal-point.js → focal-point.tsx} +7 -1
  760. package/src/focal-point-picker/{grid.js → grid.tsx} +6 -1
  761. package/src/focal-point-picker/{index.js → index.tsx} +99 -15
  762. package/src/focal-point-picker/{media.js → media.tsx} +10 -4
  763. package/src/focal-point-picker/stories/index.tsx +93 -0
  764. package/src/focal-point-picker/styles/{focal-point-picker-style.js → focal-point-picker-style.ts} +31 -5
  765. package/src/focal-point-picker/styles/{focal-point-style.js → focal-point-style.ts} +2 -1
  766. package/src/focal-point-picker/test/index.js +27 -7
  767. package/src/focal-point-picker/types.ts +93 -0
  768. package/src/focal-point-picker/{utils.js → utils.ts} +9 -9
  769. package/src/font-size-picker/README.md +9 -0
  770. package/src/font-size-picker/index.js +9 -0
  771. package/src/font-size-picker/stories/index.js +3 -5
  772. package/src/font-size-picker/test/index.js +15 -2
  773. package/src/font-size-picker/test/utils.js +1 -2
  774. package/src/font-size-picker/utils.js +1 -1
  775. package/src/form-file-upload/README.md +6 -1
  776. package/src/form-file-upload/{index.js → index.tsx} +22 -4
  777. package/src/form-file-upload/stories/index.tsx +74 -0
  778. package/src/form-file-upload/test/{index.js → index.tsx} +7 -3
  779. package/src/form-file-upload/types.ts +63 -0
  780. package/src/form-toggle/index.tsx +1 -6
  781. package/src/form-token-field/index.tsx +4 -5
  782. package/src/form-token-field/suggestions-list.tsx +1 -2
  783. package/src/gradient-picker/index.js +41 -47
  784. package/src/gradient-picker/stories/index.js +10 -0
  785. package/src/h-stack/test/__snapshots__/index.tsx.snap +3 -12
  786. package/src/higher-order/with-filters/test/__snapshots__/index.js.snap +87 -0
  787. package/src/higher-order/with-filters/test/index.js +20 -74
  788. package/src/icon/index.tsx +1 -1
  789. package/src/icon/stories/index.js +18 -0
  790. package/src/icon/test/index.js +32 -83
  791. package/src/input-control/input-base.tsx +9 -11
  792. package/src/input-control/label.tsx +9 -4
  793. package/src/input-control/styles/input-control-styles.tsx +0 -43
  794. package/src/input-control/types.ts +3 -0
  795. package/src/isolated-event-container/test/index.js +53 -11
  796. package/src/item-group/test/__snapshots__/index.js.snap +16 -16
  797. package/src/keyboard-shortcuts/test/index.js +16 -31
  798. package/src/menu-item/test/__snapshots__/index.js.snap +60 -62
  799. package/src/menu-item/test/index.js +30 -22
  800. package/src/modal/aria-helper.js +3 -8
  801. package/src/modal/style.scss +3 -4
  802. package/src/navigable-container/README.md +2 -0
  803. package/src/navigable-container/container.js +8 -1
  804. package/src/navigable-container/menu.js +14 -11
  805. package/src/navigable-container/stories/navigable-menu.js +49 -0
  806. package/src/navigable-container/stories/tabbable-container.js +40 -0
  807. package/src/navigable-container/tabbable.js +2 -3
  808. package/src/navigable-container/test/navigable-menu.js +277 -0
  809. package/src/navigable-container/test/tababble-container.js +175 -0
  810. package/src/navigation/menu/menu-title-search.js +2 -0
  811. package/src/navigation/menu/use-navigation-tree-menu.js +2 -0
  812. package/src/navigator/navigator-button/hook.ts +1 -1
  813. package/src/navigator/navigator-screen/component.tsx +6 -1
  814. package/src/number-control/index.tsx +209 -0
  815. package/src/number-control/stories/index.js +6 -18
  816. package/src/number-control/types.ts +75 -0
  817. package/src/panel/README.md +1 -1
  818. package/src/panel/test/__snapshots__/header.js.snap +9 -0
  819. package/src/panel/test/__snapshots__/index.js.snap +17 -0
  820. package/src/panel/test/__snapshots__/row.js.snap +17 -0
  821. package/src/panel/test/header.js +30 -23
  822. package/src/panel/test/index.js +33 -25
  823. package/src/panel/test/row.js +18 -11
  824. package/src/placeholder/index.tsx +4 -5
  825. package/src/placeholder/style.scss +4 -0
  826. package/src/popover/README.md +128 -48
  827. package/src/popover/{index.js → index.tsx} +284 -182
  828. package/src/popover/stories/{index.js → index.tsx} +52 -54
  829. package/src/popover/test/index.js +7 -5
  830. package/src/popover/types.ts +192 -0
  831. package/src/popover/utils.ts +242 -0
  832. package/src/radio-control/index.tsx +28 -29
  833. package/src/radio-control/style.scss +0 -17
  834. package/src/range-control/index.tsx +4 -1
  835. package/src/range-control/styles/range-control-styles.ts +8 -8
  836. package/src/sandbox/index.js +2 -2
  837. package/src/search-control/README.md +5 -3
  838. package/src/search-control/{index.js → index.tsx} +35 -7
  839. package/src/search-control/stories/index.tsx +66 -0
  840. package/src/search-control/types.ts +43 -0
  841. package/src/select-control/index.native.js +1 -1
  842. package/src/slot-fill/test/index.js +69 -12
  843. package/src/style.scss +0 -1
  844. package/src/surface/test/__snapshots__/index.tsx.snap +10 -10
  845. package/src/tab-panel/README.md +1 -2
  846. package/src/tab-panel/{index.js → index.tsx} +58 -13
  847. package/src/tab-panel/stories/index.tsx +37 -0
  848. package/src/tab-panel/test/index.tsx +120 -0
  849. package/src/tab-panel/types.ts +65 -0
  850. package/src/text-control/index.tsx +2 -0
  851. package/src/text-control/types.ts +5 -1
  852. package/src/textarea-control/index.tsx +3 -6
  853. package/src/textarea-control/types.ts +1 -1
  854. package/src/toggle-control/index.tsx +97 -0
  855. package/src/toggle-control/stories/index.tsx +58 -0
  856. package/src/toggle-control/test/index.tsx +53 -0
  857. package/src/toggle-control/types.ts +28 -0
  858. package/src/toggle-group-control/stories/index.tsx +10 -3
  859. package/src/toggle-group-control/toggle-group-control/component.tsx +3 -3
  860. package/src/toggle-group-control/toggle-group-control-option-icon/README.md +1 -1
  861. package/src/toggle-group-control/toggle-group-control-option-icon/component.tsx +1 -1
  862. package/src/toggle-group-control/types.ts +2 -2
  863. package/src/tooltip/index.js +11 -7
  864. package/src/ui/context/context-connect.ts +58 -31
  865. package/src/ui/context/context-system-provider.js +5 -4
  866. package/src/ui/context/test/context-connect.tsx +55 -0
  867. package/src/ui/context/test/wordpress-component.tsx +36 -0
  868. package/src/ui/context/wordpress-component.ts +18 -12
  869. package/src/ui/control-group/test/__snapshots__/index.js.snap +1 -4
  870. package/src/unit-control/index.tsx +1 -1
  871. package/src/unit-control/stories/index.tsx +7 -16
  872. package/src/unit-control/styles/unit-control-styles.ts +2 -2
  873. package/src/unit-control/test/__snapshots__/index.tsx.snap +4 -6
  874. package/src/unit-control/types.ts +3 -44
  875. package/src/utils/colors-values.js +2 -24
  876. package/src/utils/math.js +4 -4
  877. package/src/utils/values.js +48 -6
  878. package/src/v-stack/test/__snapshots__/index.tsx.snap +3 -12
  879. package/src/view/{component.js → component.tsx} +13 -4
  880. package/src/view/stories/index.tsx +32 -0
  881. package/src/view/types.ts +6 -0
  882. package/tsconfig.json +1 -6
  883. package/tsconfig.tsbuildinfo +1 -1
  884. package/src/focal-point-picker/stories/index.js +0 -76
  885. package/src/navigable-container/test/menu.js +0 -310
  886. package/src/navigable-container/test/tabbable.js +0 -158
  887. package/src/number-control/index.js +0 -192
  888. package/src/popover/utils.js +0 -107
  889. package/src/search-control/stories/index.js +0 -39
  890. package/src/tab-panel/stories/index.js +0 -39
  891. package/src/tab-panel/test/index.js +0 -179
  892. package/src/toggle-control/index.js +0 -55
  893. package/src/toggle-control/stories/index.js +0 -64
  894. package/src/toggle-control/style.scss +0 -14
  895. package/src/toggle-control/test/index.js +0 -52
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/color-picker/input-with-slider.tsx"],"names":["HStack","Text","Spacer","space","RangeControl","NumberControlWrapper","COLORS","InputWithSlider","min","max","label","abbreviation","onChange","value","ui","theme"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,MAAT,QAAuB,YAAvB;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,SAASC,MAAT,QAAuB,WAAvB;AACA,SAASC,KAAT,QAAsB,mBAAtB;AACA,SAASC,YAAT,EAAuBC,oBAAvB,QAAmD,UAAnD;AACA,SAASC,MAAT,QAAuB,wBAAvB;AAWA,OAAO,MAAMC,eAAe,GAAG,QAOF;AAAA,MAPI;AAChCC,IAAAA,GADgC;AAEhCC,IAAAA,GAFgC;AAGhCC,IAAAA,KAHgC;AAIhCC,IAAAA,YAJgC;AAKhCC,IAAAA,QALgC;AAMhCC,IAAAA;AANgC,GAOJ;AAC5B,SACC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAG;AAAlB,KACC,cAAC,oBAAD;AACC,IAAA,GAAG,EAAGL,GADP;AAEC,IAAA,GAAG,EAAGC,GAFP;AAGC,IAAA,KAAK,EAAGC,KAHT;AAIC,IAAA,mBAAmB,MAJpB;AAKC,IAAA,KAAK,EAAGG,KALT;AAMC,IAAA,QAAQ,EAAGD,QANZ;AAOC,IAAA,MAAM,EACL,cAAC,MAAD;AACC,MAAA,EAAE,EAAGX,IADN;AAEC,MAAA,WAAW,EAAGE,KAAK,CAAE,CAAF,CAFpB;AAGC,MAAA,KAAK,EAAGG,MAAM,CAACQ,EAAP,CAAUC,KAHnB;AAIC,MAAA,UAAU,EAAG;AAJd,OAMGJ,YANH,CARF;AAiBC,IAAA,cAAc,MAjBf;AAkBC,IAAA,IAAI,EAAC;AAlBN,IADD,EAqBC,cAAC,YAAD;AACC,IAAA,KAAK,EAAGD,KADT;AAEC,IAAA,mBAAmB,MAFpB;AAGC,IAAA,GAAG,EAAGF,GAHP;AAIC,IAAA,GAAG,EAAGC,GAJP;AAKC,IAAA,KAAK,EAAGI,KALT,CAMC;AACA;AAPD;AAQC,IAAA,QAAQ,EAAGD,QARZ;AASC,IAAA,cAAc,EAAG;AATlB,IArBD,CADD;AAmCA,CA3CM","sourcesContent":["/**\n * Internal dependencies\n */\nimport { HStack } from '../h-stack';\nimport { Text } from '../text';\nimport { Spacer } from '../spacer';\nimport { space } from '../ui/utils/space';\nimport { RangeControl, NumberControlWrapper } from './styles';\nimport { COLORS } from '../utils/colors-values';\n\ninterface InputWithSliderProps {\n\tmin: number;\n\tmax: number;\n\tvalue: number;\n\tlabel: string;\n\tabbreviation: string;\n\tonChange: ( value: number ) => void;\n}\n\nexport const InputWithSlider = ( {\n\tmin,\n\tmax,\n\tlabel,\n\tabbreviation,\n\tonChange,\n\tvalue,\n}: InputWithSliderProps ) => {\n\treturn (\n\t\t<HStack spacing={ 4 }>\n\t\t\t<NumberControlWrapper\n\t\t\t\tmin={ min }\n\t\t\t\tmax={ max }\n\t\t\t\tlabel={ label }\n\t\t\t\thideLabelFromVision\n\t\t\t\tvalue={ value }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tprefix={\n\t\t\t\t\t<Spacer\n\t\t\t\t\t\tas={ Text }\n\t\t\t\t\t\tpaddingLeft={ space( 4 ) }\n\t\t\t\t\t\tcolor={ COLORS.ui.theme }\n\t\t\t\t\t\tlineHeight={ 1 }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ abbreviation }\n\t\t\t\t\t</Spacer>\n\t\t\t\t}\n\t\t\t\thideHTMLArrows\n\t\t\t\tsize=\"__unstable-large\"\n\t\t\t/>\n\t\t\t<RangeControl\n\t\t\t\tlabel={ label }\n\t\t\t\thideLabelFromVision\n\t\t\t\tmin={ min }\n\t\t\t\tmax={ max }\n\t\t\t\tvalue={ value }\n\t\t\t\t// @ts-expect-error\n\t\t\t\t// See: https://github.com/WordPress/gutenberg/pull/40535#issuecomment-1172418185\n\t\t\t\tonChange={ onChange }\n\t\t\t\twithInputField={ false }\n\t\t\t/>\n\t\t</HStack>\n\t);\n};\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/color-picker/input-with-slider.tsx"],"names":["HStack","Text","Spacer","space","RangeControl","NumberControlWrapper","COLORS","InputWithSlider","min","max","label","abbreviation","onChange","value","ui","theme"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,MAAT,QAAuB,YAAvB;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,SAASC,MAAT,QAAuB,WAAvB;AACA,SAASC,KAAT,QAAsB,mBAAtB;AACA,SAASC,YAAT,EAAuBC,oBAAvB,QAAmD,UAAnD;AACA,SAASC,MAAT,QAAuB,wBAAvB;AAWA,OAAO,MAAMC,eAAe,GAAG,QAOF;AAAA,MAPI;AAChCC,IAAAA,GADgC;AAEhCC,IAAAA,GAFgC;AAGhCC,IAAAA,KAHgC;AAIhCC,IAAAA,YAJgC;AAKhCC,IAAAA,QALgC;AAMhCC,IAAAA;AANgC,GAOJ;AAC5B,SACC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAG;AAAlB,KACC,cAAC,oBAAD;AACC,IAAA,GAAG,EAAGL,GADP;AAEC,IAAA,GAAG,EAAGC,GAFP;AAGC,IAAA,KAAK,EAAGC,KAHT;AAIC,IAAA,mBAAmB,MAJpB;AAKC,IAAA,KAAK,EAAGG,KALT,CAMC;AAND;AAOC,IAAA,QAAQ,EAAGD,QAPZ;AAQC,IAAA,MAAM,EACL,cAAC,MAAD;AACC,MAAA,EAAE,EAAGX,IADN;AAEC,MAAA,WAAW,EAAGE,KAAK,CAAE,CAAF,CAFpB;AAGC,MAAA,KAAK,EAAGG,MAAM,CAACQ,EAAP,CAAUC,KAHnB;AAIC,MAAA,UAAU,EAAG;AAJd,OAMGJ,YANH,CATF;AAkBC,IAAA,cAAc,MAlBf;AAmBC,IAAA,IAAI,EAAC;AAnBN,IADD,EAsBC,cAAC,YAAD;AACC,IAAA,KAAK,EAAGD,KADT;AAEC,IAAA,mBAAmB,MAFpB;AAGC,IAAA,GAAG,EAAGF,GAHP;AAIC,IAAA,GAAG,EAAGC,GAJP;AAKC,IAAA,KAAK,EAAGI,KALT,CAMC;AACA;AAPD;AAQC,IAAA,QAAQ,EAAGD,QARZ;AASC,IAAA,cAAc,EAAG;AATlB,IAtBD,CADD;AAoCA,CA5CM","sourcesContent":["/**\n * Internal dependencies\n */\nimport { HStack } from '../h-stack';\nimport { Text } from '../text';\nimport { Spacer } from '../spacer';\nimport { space } from '../ui/utils/space';\nimport { RangeControl, NumberControlWrapper } from './styles';\nimport { COLORS } from '../utils/colors-values';\n\ninterface InputWithSliderProps {\n\tmin: number;\n\tmax: number;\n\tvalue: number;\n\tlabel: string;\n\tabbreviation: string;\n\tonChange: ( value: number ) => void;\n}\n\nexport const InputWithSlider = ( {\n\tmin,\n\tmax,\n\tlabel,\n\tabbreviation,\n\tonChange,\n\tvalue,\n}: InputWithSliderProps ) => {\n\treturn (\n\t\t<HStack spacing={ 4 }>\n\t\t\t<NumberControlWrapper\n\t\t\t\tmin={ min }\n\t\t\t\tmax={ max }\n\t\t\t\tlabel={ label }\n\t\t\t\thideLabelFromVision\n\t\t\t\tvalue={ value }\n\t\t\t\t// @ts-expect-error TODO: Resolve discrepancy in NumberControl\n\t\t\t\tonChange={ onChange }\n\t\t\t\tprefix={\n\t\t\t\t\t<Spacer\n\t\t\t\t\t\tas={ Text }\n\t\t\t\t\t\tpaddingLeft={ space( 4 ) }\n\t\t\t\t\t\tcolor={ COLORS.ui.theme }\n\t\t\t\t\t\tlineHeight={ 1 }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ abbreviation }\n\t\t\t\t\t</Spacer>\n\t\t\t\t}\n\t\t\t\thideHTMLArrows\n\t\t\t\tsize=\"__unstable-large\"\n\t\t\t/>\n\t\t\t<RangeControl\n\t\t\t\tlabel={ label }\n\t\t\t\thideLabelFromVision\n\t\t\t\tmin={ min }\n\t\t\t\tmax={ max }\n\t\t\t\tvalue={ value }\n\t\t\t\t// @ts-expect-error\n\t\t\t\t// See: https://github.com/WordPress/gutenberg/pull/40535#issuecomment-1172418185\n\t\t\t\tonChange={ onChange }\n\t\t\t\twithInputField={ false }\n\t\t\t/>\n\t\t</HStack>\n\t);\n};\n"]}
@@ -90,7 +90,7 @@ function ComboboxControl(_ref) {
90
90
  }
91
91
  });
92
92
  return startsWithMatch.concat(containsMatch);
93
- }, [inputValue, options, value]);
93
+ }, [inputValue, options]);
94
94
 
95
95
  const onSuggestionSelected = newSelectedSuggestion => {
96
96
  setValue(newSelectedSuggestion.value);
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/combobox-control/index.js"],"names":["classnames","__","_n","sprintf","Component","useState","useMemo","useRef","useEffect","useInstanceId","speak","closeSmall","InputWrapperFlex","TokenInput","SuggestionsList","BaseControl","Button","FlexBlock","FlexItem","withFocusOutside","useControlledValue","normalizeTextString","noop","DetectOutside","handleFocusOutside","event","props","onFocusOutside","render","children","ComboboxControl","__nextHasNoMarginBottom","__next36pxDefaultSize","value","valueProp","label","options","onChange","onChangeProp","onFilterValueChange","hideLabelFromVision","help","allowReset","className","messages","selected","__experimentalRenderItem","setValue","currentOption","find","option","currentLabel","instanceId","selectedSuggestion","setSelectedSuggestion","isExpanded","setIsExpanded","inputHasFocus","setInputHasFocus","inputValue","setInputValue","inputContainer","matchingSuggestions","startsWithMatch","containsMatch","match","forEach","index","indexOf","push","concat","onSuggestionSelected","newSelectedSuggestion","handleArrowNavigation","offset","nextIndex","length","onKeyDown","preventDefault","defaultPrevented","code","onBlur","onFocus","onInputChange","text","handleOnReset","current","focus","hasMatchingSuggestions","hasSelectedMatchingSuggestions","message","suggestion"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport {\n\tComponent,\n\tuseState,\n\tuseMemo,\n\tuseRef,\n\tuseEffect,\n} from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\nimport { speak } from '@wordpress/a11y';\nimport { closeSmall } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { InputWrapperFlex } from './styles';\nimport TokenInput from '../form-token-field/token-input';\nimport SuggestionsList from '../form-token-field/suggestions-list';\nimport BaseControl from '../base-control';\nimport Button from '../button';\nimport { FlexBlock, FlexItem } from '../flex';\nimport withFocusOutside from '../higher-order/with-focus-outside';\nimport { useControlledValue } from '../utils/hooks';\nimport { normalizeTextString } from '../utils/strings';\n\nconst noop = () => {};\n\nconst DetectOutside = withFocusOutside(\n\tclass extends Component {\n\t\thandleFocusOutside( event ) {\n\t\t\tthis.props.onFocusOutside( event );\n\t\t}\n\n\t\trender() {\n\t\t\treturn this.props.children;\n\t\t}\n\t}\n);\n\nfunction ComboboxControl( {\n\t/** Start opting into the new margin-free styles that will become the default in a future version. */\n\t__nextHasNoMarginBottom = false,\n\t__next36pxDefaultSize,\n\tvalue: valueProp,\n\tlabel,\n\toptions,\n\tonChange: onChangeProp,\n\tonFilterValueChange = noop,\n\thideLabelFromVision,\n\thelp,\n\tallowReset = true,\n\tclassName,\n\tmessages = {\n\t\tselected: __( 'Item selected.' ),\n\t},\n\t__experimentalRenderItem,\n} ) {\n\tconst [ value, setValue ] = useControlledValue( {\n\t\tvalue: valueProp,\n\t\tonChange: onChangeProp,\n\t} );\n\n\tconst currentOption = options.find( ( option ) => option.value === value );\n\tconst currentLabel = currentOption?.label ?? '';\n\t// Use a custom prefix when generating the `instanceId` to avoid having\n\t// duplicate input IDs when rendering this component and `FormTokenField`\n\t// in the same page (see https://github.com/WordPress/gutenberg/issues/42112).\n\tconst instanceId = useInstanceId( ComboboxControl, 'combobox-control' );\n\tconst [ selectedSuggestion, setSelectedSuggestion ] = useState(\n\t\tcurrentOption || null\n\t);\n\tconst [ isExpanded, setIsExpanded ] = useState( false );\n\tconst [ inputHasFocus, setInputHasFocus ] = useState( false );\n\tconst [ inputValue, setInputValue ] = useState( '' );\n\tconst inputContainer = useRef();\n\n\tconst matchingSuggestions = useMemo( () => {\n\t\tconst startsWithMatch = [];\n\t\tconst containsMatch = [];\n\t\tconst match = normalizeTextString( inputValue );\n\t\toptions.forEach( ( option ) => {\n\t\t\tconst index = normalizeTextString( option.label ).indexOf( match );\n\t\t\tif ( index === 0 ) {\n\t\t\t\tstartsWithMatch.push( option );\n\t\t\t} else if ( index > 0 ) {\n\t\t\t\tcontainsMatch.push( option );\n\t\t\t}\n\t\t} );\n\n\t\treturn startsWithMatch.concat( containsMatch );\n\t}, [ inputValue, options, value ] );\n\n\tconst onSuggestionSelected = ( newSelectedSuggestion ) => {\n\t\tsetValue( newSelectedSuggestion.value );\n\t\tspeak( messages.selected, 'assertive' );\n\t\tsetSelectedSuggestion( newSelectedSuggestion );\n\t\tsetInputValue( '' );\n\t\tsetIsExpanded( false );\n\t};\n\n\tconst handleArrowNavigation = ( offset = 1 ) => {\n\t\tconst index = matchingSuggestions.indexOf( selectedSuggestion );\n\t\tlet nextIndex = index + offset;\n\t\tif ( nextIndex < 0 ) {\n\t\t\tnextIndex = matchingSuggestions.length - 1;\n\t\t} else if ( nextIndex >= matchingSuggestions.length ) {\n\t\t\tnextIndex = 0;\n\t\t}\n\t\tsetSelectedSuggestion( matchingSuggestions[ nextIndex ] );\n\t\tsetIsExpanded( true );\n\t};\n\n\tconst onKeyDown = ( event ) => {\n\t\tlet preventDefault = false;\n\n\t\tif ( event.defaultPrevented ) {\n\t\t\treturn;\n\t\t}\n\n\t\tswitch ( event.code ) {\n\t\t\tcase 'Enter':\n\t\t\t\tif ( selectedSuggestion ) {\n\t\t\t\t\tonSuggestionSelected( selectedSuggestion );\n\t\t\t\t\tpreventDefault = true;\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowUp':\n\t\t\t\thandleArrowNavigation( -1 );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowDown':\n\t\t\t\thandleArrowNavigation( 1 );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tcase 'Escape':\n\t\t\t\tsetIsExpanded( false );\n\t\t\t\tsetSelectedSuggestion( null );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\n\t\tif ( preventDefault ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t};\n\n\tconst onBlur = () => {\n\t\tsetInputHasFocus( false );\n\t};\n\n\tconst onFocus = () => {\n\t\tsetInputHasFocus( true );\n\t\tsetIsExpanded( true );\n\t\tonFilterValueChange( '' );\n\t\tsetInputValue( '' );\n\t};\n\n\tconst onFocusOutside = () => {\n\t\tsetIsExpanded( false );\n\t};\n\n\tconst onInputChange = ( event ) => {\n\t\tconst text = event.value;\n\t\tsetInputValue( text );\n\t\tonFilterValueChange( text );\n\t\tif ( inputHasFocus ) {\n\t\t\tsetIsExpanded( true );\n\t\t}\n\t};\n\n\tconst handleOnReset = () => {\n\t\tsetValue( null );\n\t\tinputContainer.current.focus();\n\t};\n\n\t// Update current selections when the filter input changes.\n\tuseEffect( () => {\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\t\tconst hasSelectedMatchingSuggestions =\n\t\t\tmatchingSuggestions.indexOf( selectedSuggestion ) > 0;\n\n\t\tif ( hasMatchingSuggestions && ! hasSelectedMatchingSuggestions ) {\n\t\t\t// If the current selection isn't present in the list of suggestions, then automatically select the first item from the list of suggestions.\n\t\t\tsetSelectedSuggestion( matchingSuggestions[ 0 ] );\n\t\t}\n\t}, [ matchingSuggestions, selectedSuggestion ] );\n\n\t// Announcements.\n\tuseEffect( () => {\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\t\tif ( isExpanded ) {\n\t\t\tconst message = hasMatchingSuggestions\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t/* translators: %d: number of results. */\n\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t'%d result found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\t'%d results found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t\t\t),\n\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t )\n\t\t\t\t: __( 'No results.' );\n\n\t\t\tspeak( message, 'polite' );\n\t\t}\n\t}, [ matchingSuggestions, isExpanded ] );\n\n\t// Disable reason: There is no appropriate role which describes the\n\t// input container intended accessible usability.\n\t// TODO: Refactor click detection to use blur to stop propagation.\n\t/* eslint-disable jsx-a11y/no-static-element-interactions */\n\treturn (\n\t\t<DetectOutside onFocusOutside={ onFocusOutside }>\n\t\t\t<BaseControl\n\t\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\tclassName,\n\t\t\t\t\t'components-combobox-control'\n\t\t\t\t) }\n\t\t\t\ttabIndex=\"-1\"\n\t\t\t\tlabel={ label }\n\t\t\t\tid={ `components-form-token-input-${ instanceId }` }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\thelp={ help }\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"components-combobox-control__suggestions-container\"\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<InputWrapperFlex\n\t\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t\t>\n\t\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t\t<TokenInput\n\t\t\t\t\t\t\t\tclassName=\"components-combobox-control__input\"\n\t\t\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\t\t\tref={ inputContainer }\n\t\t\t\t\t\t\t\tvalue={ isExpanded ? inputValue : currentLabel }\n\t\t\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\t\t\tcurrentLabel\n\t\t\t\t\t\t\t\t\t\t? `${ currentLabel }, ${ label }`\n\t\t\t\t\t\t\t\t\t\t: null\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\t\t\tonBlur={ onBlur }\n\t\t\t\t\t\t\t\tisExpanded={ isExpanded }\n\t\t\t\t\t\t\t\tselectedSuggestionIndex={ matchingSuggestions.indexOf(\n\t\t\t\t\t\t\t\t\tselectedSuggestion\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonChange={ onInputChange }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t\t{ allowReset && (\n\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"components-combobox-control__reset\"\n\t\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\t\tdisabled={ ! value }\n\t\t\t\t\t\t\t\t\tonClick={ handleOnReset }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Reset' ) }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</InputWrapperFlex>\n\t\t\t\t\t{ isExpanded && (\n\t\t\t\t\t\t<SuggestionsList\n\t\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\t\tmatch={ { label: inputValue } }\n\t\t\t\t\t\t\tdisplayTransform={ ( suggestion ) =>\n\t\t\t\t\t\t\t\tsuggestion.label\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsuggestions={ matchingSuggestions }\n\t\t\t\t\t\t\tselectedIndex={ matchingSuggestions.indexOf(\n\t\t\t\t\t\t\t\tselectedSuggestion\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonHover={ setSelectedSuggestion }\n\t\t\t\t\t\t\tonSelect={ onSuggestionSelected }\n\t\t\t\t\t\t\tscrollIntoView\n\t\t\t\t\t\t\t__experimentalRenderItem={\n\t\t\t\t\t\t\t\t__experimentalRenderItem\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</BaseControl>\n\t\t</DetectOutside>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions */\n}\n\nexport default ComboboxControl;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/combobox-control/index.js"],"names":["classnames","__","_n","sprintf","Component","useState","useMemo","useRef","useEffect","useInstanceId","speak","closeSmall","InputWrapperFlex","TokenInput","SuggestionsList","BaseControl","Button","FlexBlock","FlexItem","withFocusOutside","useControlledValue","normalizeTextString","noop","DetectOutside","handleFocusOutside","event","props","onFocusOutside","render","children","ComboboxControl","__nextHasNoMarginBottom","__next36pxDefaultSize","value","valueProp","label","options","onChange","onChangeProp","onFilterValueChange","hideLabelFromVision","help","allowReset","className","messages","selected","__experimentalRenderItem","setValue","currentOption","find","option","currentLabel","instanceId","selectedSuggestion","setSelectedSuggestion","isExpanded","setIsExpanded","inputHasFocus","setInputHasFocus","inputValue","setInputValue","inputContainer","matchingSuggestions","startsWithMatch","containsMatch","match","forEach","index","indexOf","push","concat","onSuggestionSelected","newSelectedSuggestion","handleArrowNavigation","offset","nextIndex","length","onKeyDown","preventDefault","defaultPrevented","code","onBlur","onFocus","onInputChange","text","handleOnReset","current","focus","hasMatchingSuggestions","hasSelectedMatchingSuggestions","message","suggestion"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport {\n\tComponent,\n\tuseState,\n\tuseMemo,\n\tuseRef,\n\tuseEffect,\n} from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\nimport { speak } from '@wordpress/a11y';\nimport { closeSmall } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { InputWrapperFlex } from './styles';\nimport TokenInput from '../form-token-field/token-input';\nimport SuggestionsList from '../form-token-field/suggestions-list';\nimport BaseControl from '../base-control';\nimport Button from '../button';\nimport { FlexBlock, FlexItem } from '../flex';\nimport withFocusOutside from '../higher-order/with-focus-outside';\nimport { useControlledValue } from '../utils/hooks';\nimport { normalizeTextString } from '../utils/strings';\n\nconst noop = () => {};\n\nconst DetectOutside = withFocusOutside(\n\tclass extends Component {\n\t\thandleFocusOutside( event ) {\n\t\t\tthis.props.onFocusOutside( event );\n\t\t}\n\n\t\trender() {\n\t\t\treturn this.props.children;\n\t\t}\n\t}\n);\n\nfunction ComboboxControl( {\n\t/** Start opting into the new margin-free styles that will become the default in a future version. */\n\t__nextHasNoMarginBottom = false,\n\t__next36pxDefaultSize,\n\tvalue: valueProp,\n\tlabel,\n\toptions,\n\tonChange: onChangeProp,\n\tonFilterValueChange = noop,\n\thideLabelFromVision,\n\thelp,\n\tallowReset = true,\n\tclassName,\n\tmessages = {\n\t\tselected: __( 'Item selected.' ),\n\t},\n\t__experimentalRenderItem,\n} ) {\n\tconst [ value, setValue ] = useControlledValue( {\n\t\tvalue: valueProp,\n\t\tonChange: onChangeProp,\n\t} );\n\n\tconst currentOption = options.find( ( option ) => option.value === value );\n\tconst currentLabel = currentOption?.label ?? '';\n\t// Use a custom prefix when generating the `instanceId` to avoid having\n\t// duplicate input IDs when rendering this component and `FormTokenField`\n\t// in the same page (see https://github.com/WordPress/gutenberg/issues/42112).\n\tconst instanceId = useInstanceId( ComboboxControl, 'combobox-control' );\n\tconst [ selectedSuggestion, setSelectedSuggestion ] = useState(\n\t\tcurrentOption || null\n\t);\n\tconst [ isExpanded, setIsExpanded ] = useState( false );\n\tconst [ inputHasFocus, setInputHasFocus ] = useState( false );\n\tconst [ inputValue, setInputValue ] = useState( '' );\n\tconst inputContainer = useRef();\n\n\tconst matchingSuggestions = useMemo( () => {\n\t\tconst startsWithMatch = [];\n\t\tconst containsMatch = [];\n\t\tconst match = normalizeTextString( inputValue );\n\t\toptions.forEach( ( option ) => {\n\t\t\tconst index = normalizeTextString( option.label ).indexOf( match );\n\t\t\tif ( index === 0 ) {\n\t\t\t\tstartsWithMatch.push( option );\n\t\t\t} else if ( index > 0 ) {\n\t\t\t\tcontainsMatch.push( option );\n\t\t\t}\n\t\t} );\n\n\t\treturn startsWithMatch.concat( containsMatch );\n\t}, [ inputValue, options ] );\n\n\tconst onSuggestionSelected = ( newSelectedSuggestion ) => {\n\t\tsetValue( newSelectedSuggestion.value );\n\t\tspeak( messages.selected, 'assertive' );\n\t\tsetSelectedSuggestion( newSelectedSuggestion );\n\t\tsetInputValue( '' );\n\t\tsetIsExpanded( false );\n\t};\n\n\tconst handleArrowNavigation = ( offset = 1 ) => {\n\t\tconst index = matchingSuggestions.indexOf( selectedSuggestion );\n\t\tlet nextIndex = index + offset;\n\t\tif ( nextIndex < 0 ) {\n\t\t\tnextIndex = matchingSuggestions.length - 1;\n\t\t} else if ( nextIndex >= matchingSuggestions.length ) {\n\t\t\tnextIndex = 0;\n\t\t}\n\t\tsetSelectedSuggestion( matchingSuggestions[ nextIndex ] );\n\t\tsetIsExpanded( true );\n\t};\n\n\tconst onKeyDown = ( event ) => {\n\t\tlet preventDefault = false;\n\n\t\tif ( event.defaultPrevented ) {\n\t\t\treturn;\n\t\t}\n\n\t\tswitch ( event.code ) {\n\t\t\tcase 'Enter':\n\t\t\t\tif ( selectedSuggestion ) {\n\t\t\t\t\tonSuggestionSelected( selectedSuggestion );\n\t\t\t\t\tpreventDefault = true;\n\t\t\t\t}\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowUp':\n\t\t\t\thandleArrowNavigation( -1 );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowDown':\n\t\t\t\thandleArrowNavigation( 1 );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tcase 'Escape':\n\t\t\t\tsetIsExpanded( false );\n\t\t\t\tsetSelectedSuggestion( null );\n\t\t\t\tpreventDefault = true;\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tbreak;\n\t\t}\n\n\t\tif ( preventDefault ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t};\n\n\tconst onBlur = () => {\n\t\tsetInputHasFocus( false );\n\t};\n\n\tconst onFocus = () => {\n\t\tsetInputHasFocus( true );\n\t\tsetIsExpanded( true );\n\t\tonFilterValueChange( '' );\n\t\tsetInputValue( '' );\n\t};\n\n\tconst onFocusOutside = () => {\n\t\tsetIsExpanded( false );\n\t};\n\n\tconst onInputChange = ( event ) => {\n\t\tconst text = event.value;\n\t\tsetInputValue( text );\n\t\tonFilterValueChange( text );\n\t\tif ( inputHasFocus ) {\n\t\t\tsetIsExpanded( true );\n\t\t}\n\t};\n\n\tconst handleOnReset = () => {\n\t\tsetValue( null );\n\t\tinputContainer.current.focus();\n\t};\n\n\t// Update current selections when the filter input changes.\n\tuseEffect( () => {\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\t\tconst hasSelectedMatchingSuggestions =\n\t\t\tmatchingSuggestions.indexOf( selectedSuggestion ) > 0;\n\n\t\tif ( hasMatchingSuggestions && ! hasSelectedMatchingSuggestions ) {\n\t\t\t// If the current selection isn't present in the list of suggestions, then automatically select the first item from the list of suggestions.\n\t\t\tsetSelectedSuggestion( matchingSuggestions[ 0 ] );\n\t\t}\n\t}, [ matchingSuggestions, selectedSuggestion ] );\n\n\t// Announcements.\n\tuseEffect( () => {\n\t\tconst hasMatchingSuggestions = matchingSuggestions.length > 0;\n\t\tif ( isExpanded ) {\n\t\t\tconst message = hasMatchingSuggestions\n\t\t\t\t? sprintf(\n\t\t\t\t\t\t/* translators: %d: number of results. */\n\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t'%d result found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\t'%d results found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t\t\t),\n\t\t\t\t\t\tmatchingSuggestions.length\n\t\t\t\t )\n\t\t\t\t: __( 'No results.' );\n\n\t\t\tspeak( message, 'polite' );\n\t\t}\n\t}, [ matchingSuggestions, isExpanded ] );\n\n\t// Disable reason: There is no appropriate role which describes the\n\t// input container intended accessible usability.\n\t// TODO: Refactor click detection to use blur to stop propagation.\n\t/* eslint-disable jsx-a11y/no-static-element-interactions */\n\treturn (\n\t\t<DetectOutside onFocusOutside={ onFocusOutside }>\n\t\t\t<BaseControl\n\t\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\tclassName,\n\t\t\t\t\t'components-combobox-control'\n\t\t\t\t) }\n\t\t\t\ttabIndex=\"-1\"\n\t\t\t\tlabel={ label }\n\t\t\t\tid={ `components-form-token-input-${ instanceId }` }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t\thelp={ help }\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName=\"components-combobox-control__suggestions-container\"\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<InputWrapperFlex\n\t\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t\t>\n\t\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t\t<TokenInput\n\t\t\t\t\t\t\t\tclassName=\"components-combobox-control__input\"\n\t\t\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\t\t\tref={ inputContainer }\n\t\t\t\t\t\t\t\tvalue={ isExpanded ? inputValue : currentLabel }\n\t\t\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\t\t\tcurrentLabel\n\t\t\t\t\t\t\t\t\t\t? `${ currentLabel }, ${ label }`\n\t\t\t\t\t\t\t\t\t\t: null\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonFocus={ onFocus }\n\t\t\t\t\t\t\t\tonBlur={ onBlur }\n\t\t\t\t\t\t\t\tisExpanded={ isExpanded }\n\t\t\t\t\t\t\t\tselectedSuggestionIndex={ matchingSuggestions.indexOf(\n\t\t\t\t\t\t\t\t\tselectedSuggestion\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonChange={ onInputChange }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t\t{ allowReset && (\n\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"components-combobox-control__reset\"\n\t\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\t\tdisabled={ ! value }\n\t\t\t\t\t\t\t\t\tonClick={ handleOnReset }\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Reset' ) }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</InputWrapperFlex>\n\t\t\t\t\t{ isExpanded && (\n\t\t\t\t\t\t<SuggestionsList\n\t\t\t\t\t\t\tinstanceId={ instanceId }\n\t\t\t\t\t\t\tmatch={ { label: inputValue } }\n\t\t\t\t\t\t\tdisplayTransform={ ( suggestion ) =>\n\t\t\t\t\t\t\t\tsuggestion.label\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsuggestions={ matchingSuggestions }\n\t\t\t\t\t\t\tselectedIndex={ matchingSuggestions.indexOf(\n\t\t\t\t\t\t\t\tselectedSuggestion\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonHover={ setSelectedSuggestion }\n\t\t\t\t\t\t\tonSelect={ onSuggestionSelected }\n\t\t\t\t\t\t\tscrollIntoView\n\t\t\t\t\t\t\t__experimentalRenderItem={\n\t\t\t\t\t\t\t\t__experimentalRenderItem\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</BaseControl>\n\t\t</DetectOutside>\n\t);\n\t/* eslint-enable jsx-a11y/no-static-element-interactions */\n}\n\nexport default ComboboxControl;\n"]}
@@ -132,7 +132,7 @@ export default function CustomGradientPicker(_ref3) {
132
132
  }
133
133
 
134
134
  return createElement(VStack, {
135
- spacing: 5,
135
+ spacing: 4,
136
136
  className: classnames('components-custom-gradient-picker', {
137
137
  'is-next-has-no-margin': __nextHasNoMargin
138
138
  })
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/custom-gradient-picker/index.js"],"names":["classnames","deprecated","__","AnglePickerControl","CustomGradientBar","Flex","SelectControl","VStack","getGradientAstWithDefault","getLinearGradientRepresentation","getGradientAstWithControlPoints","getStopCssColor","serializeGradient","DEFAULT_LINEAR_GRADIENT_ANGLE","HORIZONTAL_GRADIENT_ORIENTATION","GRADIENT_OPTIONS","DEFAULT_GRADIENT","AccessoryWrapper","SelectWrapper","GradientAnglePicker","gradientAST","hasGradient","onChange","angle","orientation","value","onAngleChange","newAngle","type","GradientTypePicker","onSetLinearGradient","onSetRadialGradient","restGradientAST","handleOnChange","next","CustomGradientPicker","__nextHasNoMargin","__experimentalIsRenderedInSidebar","background","controlPoints","colorStops","map","colorStop","color","position","parseInt","length","since","version","hint","newControlPoints"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport AnglePickerControl from '../angle-picker-control';\nimport CustomGradientBar from './gradient-bar';\nimport { Flex } from '../flex';\nimport SelectControl from '../select-control';\nimport { VStack } from '../v-stack';\nimport {\n\tgetGradientAstWithDefault,\n\tgetLinearGradientRepresentation,\n\tgetGradientAstWithControlPoints,\n\tgetStopCssColor,\n} from './utils';\nimport { serializeGradient } from './serializer';\nimport {\n\tDEFAULT_LINEAR_GRADIENT_ANGLE,\n\tHORIZONTAL_GRADIENT_ORIENTATION,\n\tGRADIENT_OPTIONS,\n\tDEFAULT_GRADIENT,\n} from './constants';\nimport {\n\tAccessoryWrapper,\n\tSelectWrapper,\n} from './styles/custom-gradient-picker-styles';\n\nconst GradientAnglePicker = ( { gradientAST, hasGradient, onChange } ) => {\n\tconst angle =\n\t\tgradientAST?.orientation?.value ?? DEFAULT_LINEAR_GRADIENT_ANGLE;\n\tconst onAngleChange = ( newAngle ) => {\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...gradientAST,\n\t\t\t\torientation: {\n\t\t\t\t\ttype: 'angular',\n\t\t\t\t\tvalue: newAngle,\n\t\t\t\t},\n\t\t\t} )\n\t\t);\n\t};\n\treturn (\n\t\t<AnglePickerControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\tonChange={ onAngleChange }\n\t\t\tlabelPosition=\"top\"\n\t\t\tvalue={ hasGradient ? angle : '' }\n\t\t/>\n\t);\n};\n\nconst GradientTypePicker = ( { gradientAST, hasGradient, onChange } ) => {\n\tconst { type } = gradientAST;\n\tconst onSetLinearGradient = () => {\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...gradientAST,\n\t\t\t\t...( gradientAST.orientation\n\t\t\t\t\t? {}\n\t\t\t\t\t: { orientation: HORIZONTAL_GRADIENT_ORIENTATION } ),\n\t\t\t\ttype: 'linear-gradient',\n\t\t\t} )\n\t\t);\n\t};\n\n\tconst onSetRadialGradient = () => {\n\t\tconst { orientation, ...restGradientAST } = gradientAST;\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...restGradientAST,\n\t\t\t\ttype: 'radial-gradient',\n\t\t\t} )\n\t\t);\n\t};\n\n\tconst handleOnChange = ( next ) => {\n\t\tif ( next === 'linear-gradient' ) {\n\t\t\tonSetLinearGradient();\n\t\t}\n\t\tif ( next === 'radial-gradient' ) {\n\t\t\tonSetRadialGradient();\n\t\t}\n\t};\n\n\treturn (\n\t\t<SelectControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\tclassName=\"components-custom-gradient-picker__type-picker\"\n\t\t\tlabel={ __( 'Type' ) }\n\t\t\tlabelPosition=\"top\"\n\t\t\tonChange={ handleOnChange }\n\t\t\toptions={ GRADIENT_OPTIONS }\n\t\t\tsize=\"__unstable-large\"\n\t\t\tvalue={ hasGradient && type }\n\t\t/>\n\t);\n};\n\nexport default function CustomGradientPicker( {\n\t/** Start opting into the new margin-free styles that will become the default in a future version. */\n\t__nextHasNoMargin = false,\n\tvalue,\n\tonChange,\n\t__experimentalIsRenderedInSidebar,\n} ) {\n\tconst gradientAST = getGradientAstWithDefault( value );\n\t// On radial gradients the bar should display a linear gradient.\n\t// On radial gradients the bar represents a slice of the gradient from the center until the outside.\n\t// On liner gradients the bar represents the color stops from left to right independently of the angle.\n\tconst background = getLinearGradientRepresentation( gradientAST );\n\tconst hasGradient = gradientAST.value !== DEFAULT_GRADIENT;\n\t// Control points color option may be hex from presets, custom colors will be rgb.\n\t// The position should always be a percentage.\n\tconst controlPoints = gradientAST.colorStops.map( ( colorStop ) => ( {\n\t\tcolor: getStopCssColor( colorStop ),\n\t\tposition: parseInt( colorStop.length.value ),\n\t} ) );\n\n\tif ( ! __nextHasNoMargin ) {\n\t\tdeprecated(\n\t\t\t'Outer margin styles for wp.components.CustomGradientPicker',\n\t\t\t{\n\t\t\t\tsince: '6.1',\n\t\t\t\tversion: '6.4',\n\t\t\t\thint: 'Set the `__nextHasNoMargin` prop to true to start opting into the new styles, which will become the default in a future version',\n\t\t\t}\n\t\t);\n\t}\n\n\treturn (\n\t\t<VStack\n\t\t\tspacing={ 5 }\n\t\t\tclassName={ classnames( 'components-custom-gradient-picker', {\n\t\t\t\t'is-next-has-no-margin': __nextHasNoMargin,\n\t\t\t} ) }\n\t\t>\n\t\t\t<CustomGradientBar\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tbackground={ background }\n\t\t\t\thasGradient={ hasGradient }\n\t\t\t\tvalue={ controlPoints }\n\t\t\t\tonChange={ ( newControlPoints ) => {\n\t\t\t\t\tonChange(\n\t\t\t\t\t\tserializeGradient(\n\t\t\t\t\t\t\tgetGradientAstWithControlPoints(\n\t\t\t\t\t\t\t\tgradientAST,\n\t\t\t\t\t\t\t\tnewControlPoints\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t)\n\t\t\t\t\t);\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<Flex\n\t\t\t\tgap={ 3 }\n\t\t\t\tclassName=\"components-custom-gradient-picker__ui-line\"\n\t\t\t>\n\t\t\t\t<SelectWrapper>\n\t\t\t\t\t<GradientTypePicker\n\t\t\t\t\t\tgradientAST={ gradientAST }\n\t\t\t\t\t\thasGradient={ hasGradient }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t</SelectWrapper>\n\t\t\t\t<AccessoryWrapper>\n\t\t\t\t\t{ gradientAST.type === 'linear-gradient' && (\n\t\t\t\t\t\t<GradientAnglePicker\n\t\t\t\t\t\t\tgradientAST={ gradientAST }\n\t\t\t\t\t\t\thasGradient={ hasGradient }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</AccessoryWrapper>\n\t\t\t</Flex>\n\t\t</VStack>\n\t);\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/custom-gradient-picker/index.js"],"names":["classnames","deprecated","__","AnglePickerControl","CustomGradientBar","Flex","SelectControl","VStack","getGradientAstWithDefault","getLinearGradientRepresentation","getGradientAstWithControlPoints","getStopCssColor","serializeGradient","DEFAULT_LINEAR_GRADIENT_ANGLE","HORIZONTAL_GRADIENT_ORIENTATION","GRADIENT_OPTIONS","DEFAULT_GRADIENT","AccessoryWrapper","SelectWrapper","GradientAnglePicker","gradientAST","hasGradient","onChange","angle","orientation","value","onAngleChange","newAngle","type","GradientTypePicker","onSetLinearGradient","onSetRadialGradient","restGradientAST","handleOnChange","next","CustomGradientPicker","__nextHasNoMargin","__experimentalIsRenderedInSidebar","background","controlPoints","colorStops","map","colorStop","color","position","parseInt","length","since","version","hint","newControlPoints"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,OAAOC,UAAP,MAAuB,uBAAvB;AACA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,OAAOC,kBAAP,MAA+B,yBAA/B;AACA,OAAOC,iBAAP,MAA8B,gBAA9B;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,OAAOC,aAAP,MAA0B,mBAA1B;AACA,SAASC,MAAT,QAAuB,YAAvB;AACA,SACCC,yBADD,EAECC,+BAFD,EAGCC,+BAHD,EAICC,eAJD,QAKO,SALP;AAMA,SAASC,iBAAT,QAAkC,cAAlC;AACA,SACCC,6BADD,EAECC,+BAFD,EAGCC,gBAHD,EAICC,gBAJD,QAKO,aALP;AAMA,SACCC,gBADD,EAECC,aAFD,QAGO,wCAHP;;AAKA,MAAMC,mBAAmB,GAAG,QAA8C;AAAA;;AAAA,MAA5C;AAAEC,IAAAA,WAAF;AAAeC,IAAAA,WAAf;AAA4BC,IAAAA;AAA5B,GAA4C;AACzE,QAAMC,KAAK,4BACVH,WADU,aACVA,WADU,iDACVA,WAAW,CAAEI,WADH,2DACV,uBAA0BC,KADhB,yEACyBZ,6BADpC;;AAEA,QAAMa,aAAa,GAAKC,QAAF,IAAgB;AACrCL,IAAAA,QAAQ,CACPV,iBAAiB,CAAE,EAClB,GAAGQ,WADe;AAElBI,MAAAA,WAAW,EAAE;AACZI,QAAAA,IAAI,EAAE,SADM;AAEZH,QAAAA,KAAK,EAAEE;AAFK;AAFK,KAAF,CADV,CAAR;AASA,GAVD;;AAWA,SACC,cAAC,kBAAD;AACC,IAAA,uBAAuB,MADxB;AAEC,IAAA,QAAQ,EAAGD,aAFZ;AAGC,IAAA,aAAa,EAAC,KAHf;AAIC,IAAA,KAAK,EAAGL,WAAW,GAAGE,KAAH,GAAW;AAJ/B,IADD;AAQA,CAtBD;;AAwBA,MAAMM,kBAAkB,GAAG,SAA8C;AAAA,MAA5C;AAAET,IAAAA,WAAF;AAAeC,IAAAA,WAAf;AAA4BC,IAAAA;AAA5B,GAA4C;AACxE,QAAM;AAAEM,IAAAA;AAAF,MAAWR,WAAjB;;AACA,QAAMU,mBAAmB,GAAG,MAAM;AACjCR,IAAAA,QAAQ,CACPV,iBAAiB,CAAE,EAClB,GAAGQ,WADe;AAElB,UAAKA,WAAW,CAACI,WAAZ,GACF,EADE,GAEF;AAAEA,QAAAA,WAAW,EAAEV;AAAf,OAFH,CAFkB;AAKlBc,MAAAA,IAAI,EAAE;AALY,KAAF,CADV,CAAR;AASA,GAVD;;AAYA,QAAMG,mBAAmB,GAAG,MAAM;AACjC,UAAM;AAAEP,MAAAA,WAAF;AAAe,SAAGQ;AAAlB,QAAsCZ,WAA5C;AACAE,IAAAA,QAAQ,CACPV,iBAAiB,CAAE,EAClB,GAAGoB,eADe;AAElBJ,MAAAA,IAAI,EAAE;AAFY,KAAF,CADV,CAAR;AAMA,GARD;;AAUA,QAAMK,cAAc,GAAKC,IAAF,IAAY;AAClC,QAAKA,IAAI,KAAK,iBAAd,EAAkC;AACjCJ,MAAAA,mBAAmB;AACnB;;AACD,QAAKI,IAAI,KAAK,iBAAd,EAAkC;AACjCH,MAAAA,mBAAmB;AACnB;AACD,GAPD;;AASA,SACC,cAAC,aAAD;AACC,IAAA,uBAAuB,MADxB;AAEC,IAAA,SAAS,EAAC,gDAFX;AAGC,IAAA,KAAK,EAAG7B,EAAE,CAAE,MAAF,CAHX;AAIC,IAAA,aAAa,EAAC,KAJf;AAKC,IAAA,QAAQ,EAAG+B,cALZ;AAMC,IAAA,OAAO,EAAGlB,gBANX;AAOC,IAAA,IAAI,EAAC,kBAPN;AAQC,IAAA,KAAK,EAAGM,WAAW,IAAIO;AARxB,IADD;AAYA,CA7CD;;AA+CA,eAAe,SAASO,oBAAT,QAMX;AAAA,MAN0C;AAC7C;AACAC,IAAAA,iBAAiB,GAAG,KAFyB;AAG7CX,IAAAA,KAH6C;AAI7CH,IAAAA,QAJ6C;AAK7Ce,IAAAA;AAL6C,GAM1C;AACH,QAAMjB,WAAW,GAAGZ,yBAAyB,CAAEiB,KAAF,CAA7C,CADG,CAEH;AACA;AACA;;AACA,QAAMa,UAAU,GAAG7B,+BAA+B,CAAEW,WAAF,CAAlD;AACA,QAAMC,WAAW,GAAGD,WAAW,CAACK,KAAZ,KAAsBT,gBAA1C,CANG,CAOH;AACA;;AACA,QAAMuB,aAAa,GAAGnB,WAAW,CAACoB,UAAZ,CAAuBC,GAAvB,CAA8BC,SAAF,KAAmB;AACpEC,IAAAA,KAAK,EAAEhC,eAAe,CAAE+B,SAAF,CAD8C;AAEpEE,IAAAA,QAAQ,EAAEC,QAAQ,CAAEH,SAAS,CAACI,MAAV,CAAiBrB,KAAnB;AAFkD,GAAnB,CAA5B,CAAtB;;AAKA,MAAK,CAAEW,iBAAP,EAA2B;AAC1BnC,IAAAA,UAAU,CACT,4DADS,EAET;AACC8C,MAAAA,KAAK,EAAE,KADR;AAECC,MAAAA,OAAO,EAAE,KAFV;AAGCC,MAAAA,IAAI,EAAE;AAHP,KAFS,CAAV;AAQA;;AAED,SACC,cAAC,MAAD;AACC,IAAA,OAAO,EAAG,CADX;AAEC,IAAA,SAAS,EAAGjD,UAAU,CAAE,mCAAF,EAAuC;AAC5D,+BAAyBoC;AADmC,KAAvC;AAFvB,KAMC,cAAC,iBAAD;AACC,IAAA,iCAAiC,EAChCC,iCAFF;AAIC,IAAA,UAAU,EAAGC,UAJd;AAKC,IAAA,WAAW,EAAGjB,WALf;AAMC,IAAA,KAAK,EAAGkB,aANT;AAOC,IAAA,QAAQ,EAAKW,gBAAF,IAAwB;AAClC5B,MAAAA,QAAQ,CACPV,iBAAiB,CAChBF,+BAA+B,CAC9BU,WAD8B,EAE9B8B,gBAF8B,CADf,CADV,CAAR;AAQA;AAhBF,IAND,EAwBC,cAAC,IAAD;AACC,IAAA,GAAG,EAAG,CADP;AAEC,IAAA,SAAS,EAAC;AAFX,KAIC,cAAC,aAAD,QACC,cAAC,kBAAD;AACC,IAAA,WAAW,EAAG9B,WADf;AAEC,IAAA,WAAW,EAAGC,WAFf;AAGC,IAAA,QAAQ,EAAGC;AAHZ,IADD,CAJD,EAWC,cAAC,gBAAD,QACGF,WAAW,CAACQ,IAAZ,KAAqB,iBAArB,IACD,cAAC,mBAAD;AACC,IAAA,WAAW,EAAGR,WADf;AAEC,IAAA,WAAW,EAAGC,WAFf;AAGC,IAAA,QAAQ,EAAGC;AAHZ,IAFF,CAXD,CAxBD,CADD;AAgDA","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport AnglePickerControl from '../angle-picker-control';\nimport CustomGradientBar from './gradient-bar';\nimport { Flex } from '../flex';\nimport SelectControl from '../select-control';\nimport { VStack } from '../v-stack';\nimport {\n\tgetGradientAstWithDefault,\n\tgetLinearGradientRepresentation,\n\tgetGradientAstWithControlPoints,\n\tgetStopCssColor,\n} from './utils';\nimport { serializeGradient } from './serializer';\nimport {\n\tDEFAULT_LINEAR_GRADIENT_ANGLE,\n\tHORIZONTAL_GRADIENT_ORIENTATION,\n\tGRADIENT_OPTIONS,\n\tDEFAULT_GRADIENT,\n} from './constants';\nimport {\n\tAccessoryWrapper,\n\tSelectWrapper,\n} from './styles/custom-gradient-picker-styles';\n\nconst GradientAnglePicker = ( { gradientAST, hasGradient, onChange } ) => {\n\tconst angle =\n\t\tgradientAST?.orientation?.value ?? DEFAULT_LINEAR_GRADIENT_ANGLE;\n\tconst onAngleChange = ( newAngle ) => {\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...gradientAST,\n\t\t\t\torientation: {\n\t\t\t\t\ttype: 'angular',\n\t\t\t\t\tvalue: newAngle,\n\t\t\t\t},\n\t\t\t} )\n\t\t);\n\t};\n\treturn (\n\t\t<AnglePickerControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\tonChange={ onAngleChange }\n\t\t\tlabelPosition=\"top\"\n\t\t\tvalue={ hasGradient ? angle : '' }\n\t\t/>\n\t);\n};\n\nconst GradientTypePicker = ( { gradientAST, hasGradient, onChange } ) => {\n\tconst { type } = gradientAST;\n\tconst onSetLinearGradient = () => {\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...gradientAST,\n\t\t\t\t...( gradientAST.orientation\n\t\t\t\t\t? {}\n\t\t\t\t\t: { orientation: HORIZONTAL_GRADIENT_ORIENTATION } ),\n\t\t\t\ttype: 'linear-gradient',\n\t\t\t} )\n\t\t);\n\t};\n\n\tconst onSetRadialGradient = () => {\n\t\tconst { orientation, ...restGradientAST } = gradientAST;\n\t\tonChange(\n\t\t\tserializeGradient( {\n\t\t\t\t...restGradientAST,\n\t\t\t\ttype: 'radial-gradient',\n\t\t\t} )\n\t\t);\n\t};\n\n\tconst handleOnChange = ( next ) => {\n\t\tif ( next === 'linear-gradient' ) {\n\t\t\tonSetLinearGradient();\n\t\t}\n\t\tif ( next === 'radial-gradient' ) {\n\t\t\tonSetRadialGradient();\n\t\t}\n\t};\n\n\treturn (\n\t\t<SelectControl\n\t\t\t__nextHasNoMarginBottom\n\t\t\tclassName=\"components-custom-gradient-picker__type-picker\"\n\t\t\tlabel={ __( 'Type' ) }\n\t\t\tlabelPosition=\"top\"\n\t\t\tonChange={ handleOnChange }\n\t\t\toptions={ GRADIENT_OPTIONS }\n\t\t\tsize=\"__unstable-large\"\n\t\t\tvalue={ hasGradient && type }\n\t\t/>\n\t);\n};\n\nexport default function CustomGradientPicker( {\n\t/** Start opting into the new margin-free styles that will become the default in a future version. */\n\t__nextHasNoMargin = false,\n\tvalue,\n\tonChange,\n\t__experimentalIsRenderedInSidebar,\n} ) {\n\tconst gradientAST = getGradientAstWithDefault( value );\n\t// On radial gradients the bar should display a linear gradient.\n\t// On radial gradients the bar represents a slice of the gradient from the center until the outside.\n\t// On liner gradients the bar represents the color stops from left to right independently of the angle.\n\tconst background = getLinearGradientRepresentation( gradientAST );\n\tconst hasGradient = gradientAST.value !== DEFAULT_GRADIENT;\n\t// Control points color option may be hex from presets, custom colors will be rgb.\n\t// The position should always be a percentage.\n\tconst controlPoints = gradientAST.colorStops.map( ( colorStop ) => ( {\n\t\tcolor: getStopCssColor( colorStop ),\n\t\tposition: parseInt( colorStop.length.value ),\n\t} ) );\n\n\tif ( ! __nextHasNoMargin ) {\n\t\tdeprecated(\n\t\t\t'Outer margin styles for wp.components.CustomGradientPicker',\n\t\t\t{\n\t\t\t\tsince: '6.1',\n\t\t\t\tversion: '6.4',\n\t\t\t\thint: 'Set the `__nextHasNoMargin` prop to true to start opting into the new styles, which will become the default in a future version',\n\t\t\t}\n\t\t);\n\t}\n\n\treturn (\n\t\t<VStack\n\t\t\tspacing={ 4 }\n\t\t\tclassName={ classnames( 'components-custom-gradient-picker', {\n\t\t\t\t'is-next-has-no-margin': __nextHasNoMargin,\n\t\t\t} ) }\n\t\t>\n\t\t\t<CustomGradientBar\n\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t}\n\t\t\t\tbackground={ background }\n\t\t\t\thasGradient={ hasGradient }\n\t\t\t\tvalue={ controlPoints }\n\t\t\t\tonChange={ ( newControlPoints ) => {\n\t\t\t\t\tonChange(\n\t\t\t\t\t\tserializeGradient(\n\t\t\t\t\t\t\tgetGradientAstWithControlPoints(\n\t\t\t\t\t\t\t\tgradientAST,\n\t\t\t\t\t\t\t\tnewControlPoints\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t)\n\t\t\t\t\t);\n\t\t\t\t} }\n\t\t\t/>\n\t\t\t<Flex\n\t\t\t\tgap={ 3 }\n\t\t\t\tclassName=\"components-custom-gradient-picker__ui-line\"\n\t\t\t>\n\t\t\t\t<SelectWrapper>\n\t\t\t\t\t<GradientTypePicker\n\t\t\t\t\t\tgradientAST={ gradientAST }\n\t\t\t\t\t\thasGradient={ hasGradient }\n\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t/>\n\t\t\t\t</SelectWrapper>\n\t\t\t\t<AccessoryWrapper>\n\t\t\t\t\t{ gradientAST.type === 'linear-gradient' && (\n\t\t\t\t\t\t<GradientAnglePicker\n\t\t\t\t\t\t\tgradientAST={ gradientAST }\n\t\t\t\t\t\t\thasGradient={ hasGradient }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</AccessoryWrapper>\n\t\t\t</Flex>\n\t\t</VStack>\n\t);\n}\n"]}
@@ -11,7 +11,7 @@ import { format, isSameDay, subMonths, addMonths, startOfDay, isEqual, addDays,
11
11
 
12
12
  import { __, _n, sprintf, isRTL } from '@wordpress/i18n';
13
13
  import { arrowLeft, arrowRight } from '@wordpress/icons';
14
- import { dateI18n, __experimentalGetSettings } from '@wordpress/date';
14
+ import { dateI18n, getSettings } from '@wordpress/date';
15
15
  import { useState, useRef, useEffect } from '@wordpress/element';
16
16
  /**
17
17
  * Internal dependencies
@@ -224,8 +224,7 @@ function Day(_ref2) {
224
224
  function getDayLabel(date, isSelected, numEvents) {
225
225
  const {
226
226
  formats
227
- } = __experimentalGetSettings();
228
-
227
+ } = getSettings();
229
228
  const localizedDate = dateI18n(formats.date, date, -date.getTimezoneOffset());
230
229
 
231
230
  if (isSelected && numEvents > 0) {
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/date-time/date/index.tsx"],"names":["useLilius","format","isSameDay","subMonths","addMonths","startOfDay","isEqual","addDays","subWeeks","addWeeks","isSameMonth","startOfWeek","endOfWeek","__","_n","sprintf","isRTL","arrowLeft","arrowRight","dateI18n","__experimentalGetSettings","useState","useRef","useEffect","Wrapper","Navigator","NavigatorHeading","Calendar","DayOfWeek","DayButton","inputToDate","Button","TIMEZONELESS_FORMAT","DatePicker","currentDate","onChange","events","isInvalidDate","onMonthPreviewed","weekStartsOn","date","Date","calendar","viewing","setSelected","setViewing","isSelected","viewPreviousMonth","viewNextMonth","selected","focusable","setFocusable","isFocusWithinCalendar","setIsFocusWithinCalendar","prevCurrentDate","setPrevCurrentDate","getTimezoneOffset","map","day","toString","week","index","filter","event","length","getFullYear","getMonth","getDate","getHours","getMinutes","getSeconds","getMilliseconds","nextFocusable","key","preventDefault","Day","column","isFocusable","isFocusAllowed","isToday","isInvalid","numEvents","onClick","onKeyDown","ref","current","focus","getDayLabel","formats","localizedDate"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { useLilius } from 'use-lilius';\nimport {\n\tformat,\n\tisSameDay,\n\tsubMonths,\n\taddMonths,\n\tstartOfDay,\n\tisEqual,\n\taddDays,\n\tsubWeeks,\n\taddWeeks,\n\tisSameMonth,\n\tstartOfWeek,\n\tendOfWeek,\n} from 'date-fns';\n\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf, isRTL } from '@wordpress/i18n';\nimport { arrowLeft, arrowRight } from '@wordpress/icons';\nimport { dateI18n, __experimentalGetSettings } from '@wordpress/date';\nimport { useState, useRef, useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { DatePickerProps } from '../types';\nimport {\n\tWrapper,\n\tNavigator,\n\tNavigatorHeading,\n\tCalendar,\n\tDayOfWeek,\n\tDayButton,\n} from './styles';\nimport { inputToDate } from '../utils';\nimport Button from '../../button';\nimport { TIMEZONELESS_FORMAT } from '../constants';\n\n/**\n * DatePicker is a React component that renders a calendar for date selection.\n *\n * ```jsx\n * import { DatePicker } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDatePicker = () => {\n * const [ date, setDate ] = useState( new Date() );\n *\n * return (\n * <DatePicker\n * currentDate={ date }\n * onChange={ ( newDate ) => setDate( newDate ) }\n * />\n * );\n * };\n * ```\n */\nexport function DatePicker( {\n\tcurrentDate,\n\tonChange,\n\tevents = [],\n\tisInvalidDate,\n\tonMonthPreviewed,\n\tstartOfWeek: weekStartsOn = 0,\n}: DatePickerProps ) {\n\tconst date = currentDate ? inputToDate( currentDate ) : new Date();\n\n\tconst {\n\t\tcalendar,\n\t\tviewing,\n\t\tsetSelected,\n\t\tsetViewing,\n\t\tisSelected,\n\t\tviewPreviousMonth,\n\t\tviewNextMonth,\n\t} = useLilius( {\n\t\tselected: [ startOfDay( date ) ],\n\t\tviewing: startOfDay( date ),\n\t\tweekStartsOn,\n\t} );\n\n\t// Used to implement a roving tab index. Tracks the day that receives focus\n\t// when the user tabs into the calendar.\n\tconst [ focusable, setFocusable ] = useState( startOfDay( date ) );\n\n\t// Allows us to only programmatically focus() a day when focus was already\n\t// within the calendar. This stops us stealing focus from e.g. a TimePicker\n\t// input.\n\tconst [ isFocusWithinCalendar, setIsFocusWithinCalendar ] =\n\t\tuseState( false );\n\n\t// Update internal state when currentDate prop changes.\n\tconst [ prevCurrentDate, setPrevCurrentDate ] = useState( currentDate );\n\tif ( currentDate !== prevCurrentDate ) {\n\t\tsetPrevCurrentDate( currentDate );\n\t\tsetSelected( [ startOfDay( date ) ] );\n\t\tsetViewing( startOfDay( date ) );\n\t\tsetFocusable( startOfDay( date ) );\n\t}\n\n\treturn (\n\t\t<Wrapper\n\t\t\tclassName=\"components-datetime__date\"\n\t\t\trole=\"application\"\n\t\t\taria-label={ __( 'Calendar' ) }\n\t\t>\n\t\t\t<Navigator>\n\t\t\t\t<Button\n\t\t\t\t\ticon={ isRTL() ? arrowRight : arrowLeft }\n\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\taria-label={ __( 'View previous month' ) }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tviewPreviousMonth();\n\t\t\t\t\t\tsetFocusable( subMonths( focusable, 1 ) );\n\t\t\t\t\t\tonMonthPreviewed?.(\n\t\t\t\t\t\t\tformat(\n\t\t\t\t\t\t\t\tsubMonths( viewing, 1 ),\n\t\t\t\t\t\t\t\tTIMEZONELESS_FORMAT\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t);\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t\t<NavigatorHeading level={ 3 }>\n\t\t\t\t\t<strong>\n\t\t\t\t\t\t{ dateI18n(\n\t\t\t\t\t\t\t'F',\n\t\t\t\t\t\t\tviewing,\n\t\t\t\t\t\t\t-viewing.getTimezoneOffset()\n\t\t\t\t\t\t) }\n\t\t\t\t\t</strong>{ ' ' }\n\t\t\t\t\t{ dateI18n( 'Y', viewing, -viewing.getTimezoneOffset() ) }\n\t\t\t\t</NavigatorHeading>\n\t\t\t\t<Button\n\t\t\t\t\ticon={ isRTL() ? arrowLeft : arrowRight }\n\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\taria-label={ __( 'View next month' ) }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tviewNextMonth();\n\t\t\t\t\t\tsetFocusable( addMonths( focusable, 1 ) );\n\t\t\t\t\t\tonMonthPreviewed?.(\n\t\t\t\t\t\t\tformat(\n\t\t\t\t\t\t\t\taddMonths( viewing, 1 ),\n\t\t\t\t\t\t\t\tTIMEZONELESS_FORMAT\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t);\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t</Navigator>\n\t\t\t<Calendar\n\t\t\t\tonFocus={ () => setIsFocusWithinCalendar( true ) }\n\t\t\t\tonBlur={ () => setIsFocusWithinCalendar( false ) }\n\t\t\t>\n\t\t\t\t{ calendar[ 0 ][ 0 ].map( ( day ) => (\n\t\t\t\t\t<DayOfWeek key={ day.toString() }>\n\t\t\t\t\t\t{ dateI18n( 'D', day, -day.getTimezoneOffset() ) }\n\t\t\t\t\t</DayOfWeek>\n\t\t\t\t) ) }\n\t\t\t\t{ calendar[ 0 ].map( ( week ) =>\n\t\t\t\t\tweek.map( ( day, index ) => {\n\t\t\t\t\t\tif ( ! isSameMonth( day, viewing ) ) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<Day\n\t\t\t\t\t\t\t\tkey={ day.toString() }\n\t\t\t\t\t\t\t\tday={ day }\n\t\t\t\t\t\t\t\tcolumn={ index + 1 }\n\t\t\t\t\t\t\t\tisSelected={ isSelected( day ) }\n\t\t\t\t\t\t\t\tisFocusable={ isEqual( day, focusable ) }\n\t\t\t\t\t\t\t\tisFocusAllowed={ isFocusWithinCalendar }\n\t\t\t\t\t\t\t\tisToday={ isSameDay( day, new Date() ) }\n\t\t\t\t\t\t\t\tisInvalid={\n\t\t\t\t\t\t\t\t\tisInvalidDate ? isInvalidDate( day ) : false\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tnumEvents={\n\t\t\t\t\t\t\t\t\tevents.filter( ( event ) =>\n\t\t\t\t\t\t\t\t\t\tisSameDay( event.date, day )\n\t\t\t\t\t\t\t\t\t).length\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\tsetSelected( [ day ] );\n\t\t\t\t\t\t\t\t\tsetFocusable( day );\n\t\t\t\t\t\t\t\t\tonChange?.(\n\t\t\t\t\t\t\t\t\t\tformat(\n\t\t\t\t\t\t\t\t\t\t\t// Don't change the selected date's time fields.\n\t\t\t\t\t\t\t\t\t\t\tnew Date(\n\t\t\t\t\t\t\t\t\t\t\t\tday.getFullYear(),\n\t\t\t\t\t\t\t\t\t\t\t\tday.getMonth(),\n\t\t\t\t\t\t\t\t\t\t\t\tday.getDate(),\n\t\t\t\t\t\t\t\t\t\t\t\tdate.getHours(),\n\t\t\t\t\t\t\t\t\t\t\t\tdate.getMinutes(),\n\t\t\t\t\t\t\t\t\t\t\t\tdate.getSeconds(),\n\t\t\t\t\t\t\t\t\t\t\t\tdate.getMilliseconds()\n\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\tTIMEZONELESS_FORMAT\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\tonKeyDown={ ( event ) => {\n\t\t\t\t\t\t\t\t\tlet nextFocusable;\n\t\t\t\t\t\t\t\t\tif ( event.key === 'ArrowLeft' ) {\n\t\t\t\t\t\t\t\t\t\tnextFocusable = addDays(\n\t\t\t\t\t\t\t\t\t\t\tday,\n\t\t\t\t\t\t\t\t\t\t\tisRTL() ? 1 : -1\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\tif ( event.key === 'ArrowRight' ) {\n\t\t\t\t\t\t\t\t\t\tnextFocusable = addDays(\n\t\t\t\t\t\t\t\t\t\t\tday,\n\t\t\t\t\t\t\t\t\t\t\tisRTL() ? -1 : 1\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\tif ( event.key === 'ArrowUp' ) {\n\t\t\t\t\t\t\t\t\t\tnextFocusable = subWeeks( day, 1 );\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tif ( event.key === 'ArrowDown' ) {\n\t\t\t\t\t\t\t\t\t\tnextFocusable = addWeeks( day, 1 );\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tif ( event.key === 'PageUp' ) {\n\t\t\t\t\t\t\t\t\t\tnextFocusable = subMonths( day, 1 );\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tif ( event.key === 'PageDown' ) {\n\t\t\t\t\t\t\t\t\t\tnextFocusable = addMonths( day, 1 );\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tif ( event.key === 'Home' ) {\n\t\t\t\t\t\t\t\t\t\tnextFocusable = startOfWeek( day );\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tif ( event.key === 'End' ) {\n\t\t\t\t\t\t\t\t\t\tnextFocusable = startOfDay(\n\t\t\t\t\t\t\t\t\t\t\tendOfWeek( day )\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\tif ( nextFocusable ) {\n\t\t\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\t\t\tsetFocusable( nextFocusable );\n\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\t! isSameMonth(\n\t\t\t\t\t\t\t\t\t\t\t\tnextFocusable,\n\t\t\t\t\t\t\t\t\t\t\t\tviewing\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\t\tsetViewing( nextFocusable );\n\t\t\t\t\t\t\t\t\t\t\tonMonthPreviewed?.(\n\t\t\t\t\t\t\t\t\t\t\t\tformat(\n\t\t\t\t\t\t\t\t\t\t\t\t\tnextFocusable,\n\t\t\t\t\t\t\t\t\t\t\t\t\tTIMEZONELESS_FORMAT\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}\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} )\n\t\t\t\t) }\n\t\t\t</Calendar>\n\t\t</Wrapper>\n\t);\n}\n\ntype DayProps = {\n\tday: Date;\n\tcolumn: number;\n\tisSelected: boolean;\n\tisFocusable: boolean;\n\tisFocusAllowed: boolean;\n\tisToday: boolean;\n\tnumEvents: number;\n\tisInvalid: boolean;\n\tonClick: () => void;\n\tonKeyDown: ( event: KeyboardEvent ) => void;\n};\n\nfunction Day( {\n\tday,\n\tcolumn,\n\tisSelected,\n\tisFocusable,\n\tisFocusAllowed,\n\tisToday,\n\tisInvalid,\n\tnumEvents,\n\tonClick,\n\tonKeyDown,\n}: DayProps ) {\n\tconst ref = useRef< HTMLButtonElement >();\n\n\t// Focus the day when it becomes focusable, e.g. because an arrow key is\n\t// pressed. Only do this if focus is allowed - this stops us stealing focus\n\t// from e.g. a TimePicker input.\n\tuseEffect( () => {\n\t\tif ( ref.current && isFocusable && isFocusAllowed ) {\n\t\t\tref.current.focus();\n\t\t}\n\t\t// isFocusAllowed is not a dep as there is no point calling focus() on\n\t\t// an already focused element.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ isFocusable ] );\n\n\treturn (\n\t\t<DayButton\n\t\t\tref={ ref }\n\t\t\tclassName=\"components-datetime__date__day\" // Unused, for backwards compatibility.\n\t\t\tdisabled={ isInvalid }\n\t\t\ttabIndex={ isFocusable ? 0 : -1 }\n\t\t\taria-label={ getDayLabel( day, isSelected, numEvents ) }\n\t\t\tcolumn={ column }\n\t\t\tisSelected={ isSelected }\n\t\t\tisToday={ isToday }\n\t\t\thasEvents={ numEvents > 0 }\n\t\t\tonClick={ onClick }\n\t\t\tonKeyDown={ onKeyDown }\n\t\t>\n\t\t\t{ dateI18n( 'j', day, -day.getTimezoneOffset() ) }\n\t\t</DayButton>\n\t);\n}\n\nfunction getDayLabel( date: Date, isSelected: boolean, numEvents: number ) {\n\tconst { formats } = __experimentalGetSettings();\n\tconst localizedDate = dateI18n(\n\t\tformats.date,\n\t\tdate,\n\t\t-date.getTimezoneOffset()\n\t);\n\tif ( isSelected && numEvents > 0 ) {\n\t\treturn sprintf(\n\t\t\t// translators: 1: The calendar date. 2: Number of events on the calendar date.\n\t\t\t_n(\n\t\t\t\t'%1$s. Selected. There is %2$d event',\n\t\t\t\t'%1$s. Selected. There are %2$d events',\n\t\t\t\tnumEvents\n\t\t\t),\n\t\t\tlocalizedDate,\n\t\t\tnumEvents\n\t\t);\n\t} else if ( isSelected ) {\n\t\treturn sprintf(\n\t\t\t// translators: %s: The calendar date.\n\t\t\t__( '%1$s. Selected' ),\n\t\t\tlocalizedDate\n\t\t);\n\t} else if ( numEvents > 0 ) {\n\t\treturn sprintf(\n\t\t\t// translators: 1: The calendar date. 2: Number of events on the calendar date.\n\t\t\t_n(\n\t\t\t\t'%1$s. There is %2$d event',\n\t\t\t\t'%1$s. There are %2$d events',\n\t\t\t\tnumEvents\n\t\t\t),\n\t\t\tlocalizedDate,\n\t\t\tnumEvents\n\t\t);\n\t}\n\treturn localizedDate;\n}\n\nexport default DatePicker;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/date-time/date/index.tsx"],"names":["useLilius","format","isSameDay","subMonths","addMonths","startOfDay","isEqual","addDays","subWeeks","addWeeks","isSameMonth","startOfWeek","endOfWeek","__","_n","sprintf","isRTL","arrowLeft","arrowRight","dateI18n","getSettings","useState","useRef","useEffect","Wrapper","Navigator","NavigatorHeading","Calendar","DayOfWeek","DayButton","inputToDate","Button","TIMEZONELESS_FORMAT","DatePicker","currentDate","onChange","events","isInvalidDate","onMonthPreviewed","weekStartsOn","date","Date","calendar","viewing","setSelected","setViewing","isSelected","viewPreviousMonth","viewNextMonth","selected","focusable","setFocusable","isFocusWithinCalendar","setIsFocusWithinCalendar","prevCurrentDate","setPrevCurrentDate","getTimezoneOffset","map","day","toString","week","index","filter","event","length","getFullYear","getMonth","getDate","getHours","getMinutes","getSeconds","getMilliseconds","nextFocusable","key","preventDefault","Day","column","isFocusable","isFocusAllowed","isToday","isInvalid","numEvents","onClick","onKeyDown","ref","current","focus","getDayLabel","formats","localizedDate"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,SAAT,QAA0B,YAA1B;AACA,SACCC,MADD,EAECC,SAFD,EAGCC,SAHD,EAICC,SAJD,EAKCC,UALD,EAMCC,OAND,EAOCC,OAPD,EAQCC,QARD,EASCC,QATD,EAUCC,WAVD,EAWCC,WAXD,EAYCC,SAZD,QAaO,UAbP;AAeA;AACA;AACA;;AACA,SAASC,EAAT,EAAaC,EAAb,EAAiBC,OAAjB,EAA0BC,KAA1B,QAAuC,iBAAvC;AACA,SAASC,SAAT,EAAoBC,UAApB,QAAsC,kBAAtC;AACA,SAASC,QAAT,EAAmBC,WAAnB,QAAsC,iBAAtC;AACA,SAASC,QAAT,EAAmBC,MAAnB,EAA2BC,SAA3B,QAA4C,oBAA5C;AAEA;AACA;AACA;;AAEA,SACCC,OADD,EAECC,SAFD,EAGCC,gBAHD,EAICC,QAJD,EAKCC,SALD,EAMCC,SAND,QAOO,UAPP;AAQA,SAASC,WAAT,QAA4B,UAA5B;AACA,OAAOC,MAAP,MAAmB,cAAnB;AACA,SAASC,mBAAT,QAAoC,cAApC;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASC,UAAT,OAOc;AAAA,MAPO;AAC3BC,IAAAA,WAD2B;AAE3BC,IAAAA,QAF2B;AAG3BC,IAAAA,MAAM,GAAG,EAHkB;AAI3BC,IAAAA,aAJ2B;AAK3BC,IAAAA,gBAL2B;AAM3B3B,IAAAA,WAAW,EAAE4B,YAAY,GAAG;AAND,GAOP;AACpB,QAAMC,IAAI,GAAGN,WAAW,GAAGJ,WAAW,CAAEI,WAAF,CAAd,GAAgC,IAAIO,IAAJ,EAAxD;AAEA,QAAM;AACLC,IAAAA,QADK;AAELC,IAAAA,OAFK;AAGLC,IAAAA,WAHK;AAILC,IAAAA,UAJK;AAKLC,IAAAA,UALK;AAMLC,IAAAA,iBANK;AAOLC,IAAAA;AAPK,MAQFhD,SAAS,CAAE;AACdiD,IAAAA,QAAQ,EAAE,CAAE5C,UAAU,CAAEmC,IAAF,CAAZ,CADI;AAEdG,IAAAA,OAAO,EAAEtC,UAAU,CAAEmC,IAAF,CAFL;AAGdD,IAAAA;AAHc,GAAF,CARb,CAHoB,CAiBpB;AACA;;AACA,QAAM,CAAEW,SAAF,EAAaC,YAAb,IAA8B9B,QAAQ,CAAEhB,UAAU,CAAEmC,IAAF,CAAZ,CAA5C,CAnBoB,CAqBpB;AACA;AACA;;AACA,QAAM,CAAEY,qBAAF,EAAyBC,wBAAzB,IACLhC,QAAQ,CAAE,KAAF,CADT,CAxBoB,CA2BpB;;AACA,QAAM,CAAEiC,eAAF,EAAmBC,kBAAnB,IAA0ClC,QAAQ,CAAEa,WAAF,CAAxD;;AACA,MAAKA,WAAW,KAAKoB,eAArB,EAAuC;AACtCC,IAAAA,kBAAkB,CAAErB,WAAF,CAAlB;AACAU,IAAAA,WAAW,CAAE,CAAEvC,UAAU,CAAEmC,IAAF,CAAZ,CAAF,CAAX;AACAK,IAAAA,UAAU,CAAExC,UAAU,CAAEmC,IAAF,CAAZ,CAAV;AACAW,IAAAA,YAAY,CAAE9C,UAAU,CAAEmC,IAAF,CAAZ,CAAZ;AACA;;AAED,SACC,cAAC,OAAD;AACC,IAAA,SAAS,EAAC,2BADX;AAEC,IAAA,IAAI,EAAC,aAFN;AAGC,kBAAa3B,EAAE,CAAE,UAAF;AAHhB,KAKC,cAAC,SAAD,QACC,cAAC,MAAD;AACC,IAAA,IAAI,EAAGG,KAAK,KAAKE,UAAL,GAAkBD,SAD/B;AAEC,IAAA,OAAO,EAAC,UAFT;AAGC,kBAAaJ,EAAE,CAAE,qBAAF,CAHhB;AAIC,IAAA,OAAO,EAAG,MAAM;AACfkC,MAAAA,iBAAiB;AACjBI,MAAAA,YAAY,CAAEhD,SAAS,CAAE+C,SAAF,EAAa,CAAb,CAAX,CAAZ;AACAZ,MAAAA,gBAAgB,SAAhB,IAAAA,gBAAgB,WAAhB,YAAAA,gBAAgB,CACfrC,MAAM,CACLE,SAAS,CAAEwC,OAAF,EAAW,CAAX,CADJ,EAELX,mBAFK,CADS,CAAhB;AAMA;AAbF,IADD,EAgBC,cAAC,gBAAD;AAAkB,IAAA,KAAK,EAAG;AAA1B,KACC,8BACGb,QAAQ,CACT,GADS,EAETwB,OAFS,EAGT,CAACA,OAAO,CAACa,iBAAR,EAHQ,CADX,CADD,EAOY,GAPZ,EAQGrC,QAAQ,CAAE,GAAF,EAAOwB,OAAP,EAAgB,CAACA,OAAO,CAACa,iBAAR,EAAjB,CARX,CAhBD,EA0BC,cAAC,MAAD;AACC,IAAA,IAAI,EAAGxC,KAAK,KAAKC,SAAL,GAAiBC,UAD9B;AAEC,IAAA,OAAO,EAAC,UAFT;AAGC,kBAAaL,EAAE,CAAE,iBAAF,CAHhB;AAIC,IAAA,OAAO,EAAG,MAAM;AACfmC,MAAAA,aAAa;AACbG,MAAAA,YAAY,CAAE/C,SAAS,CAAE8C,SAAF,EAAa,CAAb,CAAX,CAAZ;AACAZ,MAAAA,gBAAgB,SAAhB,IAAAA,gBAAgB,WAAhB,YAAAA,gBAAgB,CACfrC,MAAM,CACLG,SAAS,CAAEuC,OAAF,EAAW,CAAX,CADJ,EAELX,mBAFK,CADS,CAAhB;AAMA;AAbF,IA1BD,CALD,EA+CC,cAAC,QAAD;AACC,IAAA,OAAO,EAAG,MAAMqB,wBAAwB,CAAE,IAAF,CADzC;AAEC,IAAA,MAAM,EAAG,MAAMA,wBAAwB,CAAE,KAAF;AAFxC,KAIGX,QAAQ,CAAE,CAAF,CAAR,CAAe,CAAf,EAAmBe,GAAnB,CAA0BC,GAAF,IACzB,cAAC,SAAD;AAAW,IAAA,GAAG,EAAGA,GAAG,CAACC,QAAJ;AAAjB,KACGxC,QAAQ,CAAE,GAAF,EAAOuC,GAAP,EAAY,CAACA,GAAG,CAACF,iBAAJ,EAAb,CADX,CADC,CAJH,EASGd,QAAQ,CAAE,CAAF,CAAR,CAAce,GAAd,CAAqBG,IAAF,IACpBA,IAAI,CAACH,GAAL,CAAU,CAAEC,GAAF,EAAOG,KAAP,KAAkB;AAC3B,QAAK,CAAEnD,WAAW,CAAEgD,GAAF,EAAOf,OAAP,CAAlB,EAAqC;AACpC,aAAO,IAAP;AACA;;AACD,WACC,cAAC,GAAD;AACC,MAAA,GAAG,EAAGe,GAAG,CAACC,QAAJ,EADP;AAEC,MAAA,GAAG,EAAGD,GAFP;AAGC,MAAA,MAAM,EAAGG,KAAK,GAAG,CAHlB;AAIC,MAAA,UAAU,EAAGf,UAAU,CAAEY,GAAF,CAJxB;AAKC,MAAA,WAAW,EAAGpD,OAAO,CAAEoD,GAAF,EAAOR,SAAP,CALtB;AAMC,MAAA,cAAc,EAAGE,qBANlB;AAOC,MAAA,OAAO,EAAGlD,SAAS,CAAEwD,GAAF,EAAO,IAAIjB,IAAJ,EAAP,CAPpB;AAQC,MAAA,SAAS,EACRJ,aAAa,GAAGA,aAAa,CAAEqB,GAAF,CAAhB,GAA0B,KATzC;AAWC,MAAA,SAAS,EACRtB,MAAM,CAAC0B,MAAP,CAAiBC,KAAF,IACd7D,SAAS,CAAE6D,KAAK,CAACvB,IAAR,EAAckB,GAAd,CADV,EAEEM,MAdJ;AAgBC,MAAA,OAAO,EAAG,MAAM;AACfpB,QAAAA,WAAW,CAAE,CAAEc,GAAF,CAAF,CAAX;AACAP,QAAAA,YAAY,CAAEO,GAAF,CAAZ;AACAvB,QAAAA,QAAQ,SAAR,IAAAA,QAAQ,WAAR,YAAAA,QAAQ,CACPlC,MAAM,EACL;AACA,YAAIwC,IAAJ,CACCiB,GAAG,CAACO,WAAJ,EADD,EAECP,GAAG,CAACQ,QAAJ,EAFD,EAGCR,GAAG,CAACS,OAAJ,EAHD,EAIC3B,IAAI,CAAC4B,QAAL,EAJD,EAKC5B,IAAI,CAAC6B,UAAL,EALD,EAMC7B,IAAI,CAAC8B,UAAL,EAND,EAOC9B,IAAI,CAAC+B,eAAL,EAPD,CAFK,EAWLvC,mBAXK,CADC,CAAR;AAeA,OAlCF;AAmCC,MAAA,SAAS,EAAK+B,KAAF,IAAa;AACxB,YAAIS,aAAJ;;AACA,YAAKT,KAAK,CAACU,GAAN,KAAc,WAAnB,EAAiC;AAChCD,UAAAA,aAAa,GAAGjE,OAAO,CACtBmD,GADsB,EAEtB1C,KAAK,KAAK,CAAL,GAAS,CAAC,CAFO,CAAvB;AAIA;;AACD,YAAK+C,KAAK,CAACU,GAAN,KAAc,YAAnB,EAAkC;AACjCD,UAAAA,aAAa,GAAGjE,OAAO,CACtBmD,GADsB,EAEtB1C,KAAK,KAAK,CAAC,CAAN,GAAU,CAFO,CAAvB;AAIA;;AACD,YAAK+C,KAAK,CAACU,GAAN,KAAc,SAAnB,EAA+B;AAC9BD,UAAAA,aAAa,GAAGhE,QAAQ,CAAEkD,GAAF,EAAO,CAAP,CAAxB;AACA;;AACD,YAAKK,KAAK,CAACU,GAAN,KAAc,WAAnB,EAAiC;AAChCD,UAAAA,aAAa,GAAG/D,QAAQ,CAAEiD,GAAF,EAAO,CAAP,CAAxB;AACA;;AACD,YAAKK,KAAK,CAACU,GAAN,KAAc,QAAnB,EAA8B;AAC7BD,UAAAA,aAAa,GAAGrE,SAAS,CAAEuD,GAAF,EAAO,CAAP,CAAzB;AACA;;AACD,YAAKK,KAAK,CAACU,GAAN,KAAc,UAAnB,EAAgC;AAC/BD,UAAAA,aAAa,GAAGpE,SAAS,CAAEsD,GAAF,EAAO,CAAP,CAAzB;AACA;;AACD,YAAKK,KAAK,CAACU,GAAN,KAAc,MAAnB,EAA4B;AAC3BD,UAAAA,aAAa,GAAG7D,WAAW,CAAE+C,GAAF,CAA3B;AACA;;AACD,YAAKK,KAAK,CAACU,GAAN,KAAc,KAAnB,EAA2B;AAC1BD,UAAAA,aAAa,GAAGnE,UAAU,CACzBO,SAAS,CAAE8C,GAAF,CADgB,CAA1B;AAGA;;AACD,YAAKc,aAAL,EAAqB;AACpBT,UAAAA,KAAK,CAACW,cAAN;AACAvB,UAAAA,YAAY,CAAEqB,aAAF,CAAZ;;AACA,cACC,CAAE9D,WAAW,CACZ8D,aADY,EAEZ7B,OAFY,CADd,EAKE;AACDE,YAAAA,UAAU,CAAE2B,aAAF,CAAV;AACAlC,YAAAA,gBAAgB,SAAhB,IAAAA,gBAAgB,WAAhB,YAAAA,gBAAgB,CACfrC,MAAM,CACLuE,aADK,EAELxC,mBAFK,CADS,CAAhB;AAMA;AACD;AACD;AAvFF,MADD;AA2FA,GA/FD,CADC,CATH,CA/CD,CADD;AA8JA;;AAeD,SAAS2C,GAAT,QAWc;AAAA,MAXA;AACbjB,IAAAA,GADa;AAEbkB,IAAAA,MAFa;AAGb9B,IAAAA,UAHa;AAIb+B,IAAAA,WAJa;AAKbC,IAAAA,cALa;AAMbC,IAAAA,OANa;AAObC,IAAAA,SAPa;AAQbC,IAAAA,SARa;AASbC,IAAAA,OATa;AAUbC,IAAAA;AAVa,GAWA;AACb,QAAMC,GAAG,GAAG9D,MAAM,EAAlB,CADa,CAGb;AACA;AACA;;AACAC,EAAAA,SAAS,CAAE,MAAM;AAChB,QAAK6D,GAAG,CAACC,OAAJ,IAAeR,WAAf,IAA8BC,cAAnC,EAAoD;AACnDM,MAAAA,GAAG,CAACC,OAAJ,CAAYC,KAAZ;AACA,KAHe,CAIhB;AACA;AACA;;AACA,GAPQ,EAON,CAAET,WAAF,CAPM,CAAT;AASA,SACC,cAAC,SAAD;AACC,IAAA,GAAG,EAAGO,GADP;AAEC,IAAA,SAAS,EAAC,gCAFX,CAE4C;AAF5C;AAGC,IAAA,QAAQ,EAAGJ,SAHZ;AAIC,IAAA,QAAQ,EAAGH,WAAW,GAAG,CAAH,GAAO,CAAC,CAJ/B;AAKC,kBAAaU,WAAW,CAAE7B,GAAF,EAAOZ,UAAP,EAAmBmC,SAAnB,CALzB;AAMC,IAAA,MAAM,EAAGL,MANV;AAOC,IAAA,UAAU,EAAG9B,UAPd;AAQC,IAAA,OAAO,EAAGiC,OARX;AASC,IAAA,SAAS,EAAGE,SAAS,GAAG,CATzB;AAUC,IAAA,OAAO,EAAGC,OAVX;AAWC,IAAA,SAAS,EAAGC;AAXb,KAaGhE,QAAQ,CAAE,GAAF,EAAOuC,GAAP,EAAY,CAACA,GAAG,CAACF,iBAAJ,EAAb,CAbX,CADD;AAiBA;;AAED,SAAS+B,WAAT,CAAsB/C,IAAtB,EAAkCM,UAAlC,EAAuDmC,SAAvD,EAA2E;AAC1E,QAAM;AAAEO,IAAAA;AAAF,MAAcpE,WAAW,EAA/B;AACA,QAAMqE,aAAa,GAAGtE,QAAQ,CAC7BqE,OAAO,CAAChD,IADqB,EAE7BA,IAF6B,EAG7B,CAACA,IAAI,CAACgB,iBAAL,EAH4B,CAA9B;;AAKA,MAAKV,UAAU,IAAImC,SAAS,GAAG,CAA/B,EAAmC;AAClC,WAAOlE,OAAO,EACb;AACAD,IAAAA,EAAE,CACD,qCADC,EAED,uCAFC,EAGDmE,SAHC,CAFW,EAObQ,aAPa,EAQbR,SARa,CAAd;AAUA,GAXD,MAWO,IAAKnC,UAAL,EAAkB;AACxB,WAAO/B,OAAO,EACb;AACAF,IAAAA,EAAE,CAAE,gBAAF,CAFW,EAGb4E,aAHa,CAAd;AAKA,GANM,MAMA,IAAKR,SAAS,GAAG,CAAjB,EAAqB;AAC3B,WAAOlE,OAAO,EACb;AACAD,IAAAA,EAAE,CACD,2BADC,EAED,6BAFC,EAGDmE,SAHC,CAFW,EAObQ,aAPa,EAQbR,SARa,CAAd;AAUA;;AACD,SAAOQ,aAAP;AACA;;AAED,eAAexD,UAAf","sourcesContent":["/**\n * External dependencies\n */\nimport { useLilius } from 'use-lilius';\nimport {\n\tformat,\n\tisSameDay,\n\tsubMonths,\n\taddMonths,\n\tstartOfDay,\n\tisEqual,\n\taddDays,\n\tsubWeeks,\n\taddWeeks,\n\tisSameMonth,\n\tstartOfWeek,\n\tendOfWeek,\n} from 'date-fns';\n\n/**\n * WordPress dependencies\n */\nimport { __, _n, sprintf, isRTL } from '@wordpress/i18n';\nimport { arrowLeft, arrowRight } from '@wordpress/icons';\nimport { dateI18n, getSettings } from '@wordpress/date';\nimport { useState, useRef, useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { DatePickerProps } from '../types';\nimport {\n\tWrapper,\n\tNavigator,\n\tNavigatorHeading,\n\tCalendar,\n\tDayOfWeek,\n\tDayButton,\n} from './styles';\nimport { inputToDate } from '../utils';\nimport Button from '../../button';\nimport { TIMEZONELESS_FORMAT } from '../constants';\n\n/**\n * DatePicker is a React component that renders a calendar for date selection.\n *\n * ```jsx\n * import { DatePicker } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDatePicker = () => {\n * const [ date, setDate ] = useState( new Date() );\n *\n * return (\n * <DatePicker\n * currentDate={ date }\n * onChange={ ( newDate ) => setDate( newDate ) }\n * />\n * );\n * };\n * ```\n */\nexport function DatePicker( {\n\tcurrentDate,\n\tonChange,\n\tevents = [],\n\tisInvalidDate,\n\tonMonthPreviewed,\n\tstartOfWeek: weekStartsOn = 0,\n}: DatePickerProps ) {\n\tconst date = currentDate ? inputToDate( currentDate ) : new Date();\n\n\tconst {\n\t\tcalendar,\n\t\tviewing,\n\t\tsetSelected,\n\t\tsetViewing,\n\t\tisSelected,\n\t\tviewPreviousMonth,\n\t\tviewNextMonth,\n\t} = useLilius( {\n\t\tselected: [ startOfDay( date ) ],\n\t\tviewing: startOfDay( date ),\n\t\tweekStartsOn,\n\t} );\n\n\t// Used to implement a roving tab index. Tracks the day that receives focus\n\t// when the user tabs into the calendar.\n\tconst [ focusable, setFocusable ] = useState( startOfDay( date ) );\n\n\t// Allows us to only programmatically focus() a day when focus was already\n\t// within the calendar. This stops us stealing focus from e.g. a TimePicker\n\t// input.\n\tconst [ isFocusWithinCalendar, setIsFocusWithinCalendar ] =\n\t\tuseState( false );\n\n\t// Update internal state when currentDate prop changes.\n\tconst [ prevCurrentDate, setPrevCurrentDate ] = useState( currentDate );\n\tif ( currentDate !== prevCurrentDate ) {\n\t\tsetPrevCurrentDate( currentDate );\n\t\tsetSelected( [ startOfDay( date ) ] );\n\t\tsetViewing( startOfDay( date ) );\n\t\tsetFocusable( startOfDay( date ) );\n\t}\n\n\treturn (\n\t\t<Wrapper\n\t\t\tclassName=\"components-datetime__date\"\n\t\t\trole=\"application\"\n\t\t\taria-label={ __( 'Calendar' ) }\n\t\t>\n\t\t\t<Navigator>\n\t\t\t\t<Button\n\t\t\t\t\ticon={ isRTL() ? arrowRight : arrowLeft }\n\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\taria-label={ __( 'View previous month' ) }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tviewPreviousMonth();\n\t\t\t\t\t\tsetFocusable( subMonths( focusable, 1 ) );\n\t\t\t\t\t\tonMonthPreviewed?.(\n\t\t\t\t\t\t\tformat(\n\t\t\t\t\t\t\t\tsubMonths( viewing, 1 ),\n\t\t\t\t\t\t\t\tTIMEZONELESS_FORMAT\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t);\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t\t<NavigatorHeading level={ 3 }>\n\t\t\t\t\t<strong>\n\t\t\t\t\t\t{ dateI18n(\n\t\t\t\t\t\t\t'F',\n\t\t\t\t\t\t\tviewing,\n\t\t\t\t\t\t\t-viewing.getTimezoneOffset()\n\t\t\t\t\t\t) }\n\t\t\t\t\t</strong>{ ' ' }\n\t\t\t\t\t{ dateI18n( 'Y', viewing, -viewing.getTimezoneOffset() ) }\n\t\t\t\t</NavigatorHeading>\n\t\t\t\t<Button\n\t\t\t\t\ticon={ isRTL() ? arrowLeft : arrowRight }\n\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\taria-label={ __( 'View next month' ) }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tviewNextMonth();\n\t\t\t\t\t\tsetFocusable( addMonths( focusable, 1 ) );\n\t\t\t\t\t\tonMonthPreviewed?.(\n\t\t\t\t\t\t\tformat(\n\t\t\t\t\t\t\t\taddMonths( viewing, 1 ),\n\t\t\t\t\t\t\t\tTIMEZONELESS_FORMAT\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t);\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t</Navigator>\n\t\t\t<Calendar\n\t\t\t\tonFocus={ () => setIsFocusWithinCalendar( true ) }\n\t\t\t\tonBlur={ () => setIsFocusWithinCalendar( false ) }\n\t\t\t>\n\t\t\t\t{ calendar[ 0 ][ 0 ].map( ( day ) => (\n\t\t\t\t\t<DayOfWeek key={ day.toString() }>\n\t\t\t\t\t\t{ dateI18n( 'D', day, -day.getTimezoneOffset() ) }\n\t\t\t\t\t</DayOfWeek>\n\t\t\t\t) ) }\n\t\t\t\t{ calendar[ 0 ].map( ( week ) =>\n\t\t\t\t\tweek.map( ( day, index ) => {\n\t\t\t\t\t\tif ( ! isSameMonth( day, viewing ) ) {\n\t\t\t\t\t\t\treturn null;\n\t\t\t\t\t\t}\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<Day\n\t\t\t\t\t\t\t\tkey={ day.toString() }\n\t\t\t\t\t\t\t\tday={ day }\n\t\t\t\t\t\t\t\tcolumn={ index + 1 }\n\t\t\t\t\t\t\t\tisSelected={ isSelected( day ) }\n\t\t\t\t\t\t\t\tisFocusable={ isEqual( day, focusable ) }\n\t\t\t\t\t\t\t\tisFocusAllowed={ isFocusWithinCalendar }\n\t\t\t\t\t\t\t\tisToday={ isSameDay( day, new Date() ) }\n\t\t\t\t\t\t\t\tisInvalid={\n\t\t\t\t\t\t\t\t\tisInvalidDate ? isInvalidDate( day ) : false\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tnumEvents={\n\t\t\t\t\t\t\t\t\tevents.filter( ( event ) =>\n\t\t\t\t\t\t\t\t\t\tisSameDay( event.date, day )\n\t\t\t\t\t\t\t\t\t).length\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\tsetSelected( [ day ] );\n\t\t\t\t\t\t\t\t\tsetFocusable( day );\n\t\t\t\t\t\t\t\t\tonChange?.(\n\t\t\t\t\t\t\t\t\t\tformat(\n\t\t\t\t\t\t\t\t\t\t\t// Don't change the selected date's time fields.\n\t\t\t\t\t\t\t\t\t\t\tnew Date(\n\t\t\t\t\t\t\t\t\t\t\t\tday.getFullYear(),\n\t\t\t\t\t\t\t\t\t\t\t\tday.getMonth(),\n\t\t\t\t\t\t\t\t\t\t\t\tday.getDate(),\n\t\t\t\t\t\t\t\t\t\t\t\tdate.getHours(),\n\t\t\t\t\t\t\t\t\t\t\t\tdate.getMinutes(),\n\t\t\t\t\t\t\t\t\t\t\t\tdate.getSeconds(),\n\t\t\t\t\t\t\t\t\t\t\t\tdate.getMilliseconds()\n\t\t\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t\t\tTIMEZONELESS_FORMAT\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\tonKeyDown={ ( event ) => {\n\t\t\t\t\t\t\t\t\tlet nextFocusable;\n\t\t\t\t\t\t\t\t\tif ( event.key === 'ArrowLeft' ) {\n\t\t\t\t\t\t\t\t\t\tnextFocusable = addDays(\n\t\t\t\t\t\t\t\t\t\t\tday,\n\t\t\t\t\t\t\t\t\t\t\tisRTL() ? 1 : -1\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\tif ( event.key === 'ArrowRight' ) {\n\t\t\t\t\t\t\t\t\t\tnextFocusable = addDays(\n\t\t\t\t\t\t\t\t\t\t\tday,\n\t\t\t\t\t\t\t\t\t\t\tisRTL() ? -1 : 1\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\tif ( event.key === 'ArrowUp' ) {\n\t\t\t\t\t\t\t\t\t\tnextFocusable = subWeeks( day, 1 );\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tif ( event.key === 'ArrowDown' ) {\n\t\t\t\t\t\t\t\t\t\tnextFocusable = addWeeks( day, 1 );\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tif ( event.key === 'PageUp' ) {\n\t\t\t\t\t\t\t\t\t\tnextFocusable = subMonths( day, 1 );\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tif ( event.key === 'PageDown' ) {\n\t\t\t\t\t\t\t\t\t\tnextFocusable = addMonths( day, 1 );\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tif ( event.key === 'Home' ) {\n\t\t\t\t\t\t\t\t\t\tnextFocusable = startOfWeek( day );\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tif ( event.key === 'End' ) {\n\t\t\t\t\t\t\t\t\t\tnextFocusable = startOfDay(\n\t\t\t\t\t\t\t\t\t\t\tendOfWeek( day )\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\tif ( nextFocusable ) {\n\t\t\t\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\t\t\t\tsetFocusable( nextFocusable );\n\t\t\t\t\t\t\t\t\t\tif (\n\t\t\t\t\t\t\t\t\t\t\t! isSameMonth(\n\t\t\t\t\t\t\t\t\t\t\t\tnextFocusable,\n\t\t\t\t\t\t\t\t\t\t\t\tviewing\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\t\tsetViewing( nextFocusable );\n\t\t\t\t\t\t\t\t\t\t\tonMonthPreviewed?.(\n\t\t\t\t\t\t\t\t\t\t\t\tformat(\n\t\t\t\t\t\t\t\t\t\t\t\t\tnextFocusable,\n\t\t\t\t\t\t\t\t\t\t\t\t\tTIMEZONELESS_FORMAT\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}\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} )\n\t\t\t\t) }\n\t\t\t</Calendar>\n\t\t</Wrapper>\n\t);\n}\n\ntype DayProps = {\n\tday: Date;\n\tcolumn: number;\n\tisSelected: boolean;\n\tisFocusable: boolean;\n\tisFocusAllowed: boolean;\n\tisToday: boolean;\n\tnumEvents: number;\n\tisInvalid: boolean;\n\tonClick: () => void;\n\tonKeyDown: ( event: KeyboardEvent ) => void;\n};\n\nfunction Day( {\n\tday,\n\tcolumn,\n\tisSelected,\n\tisFocusable,\n\tisFocusAllowed,\n\tisToday,\n\tisInvalid,\n\tnumEvents,\n\tonClick,\n\tonKeyDown,\n}: DayProps ) {\n\tconst ref = useRef< HTMLButtonElement >();\n\n\t// Focus the day when it becomes focusable, e.g. because an arrow key is\n\t// pressed. Only do this if focus is allowed - this stops us stealing focus\n\t// from e.g. a TimePicker input.\n\tuseEffect( () => {\n\t\tif ( ref.current && isFocusable && isFocusAllowed ) {\n\t\t\tref.current.focus();\n\t\t}\n\t\t// isFocusAllowed is not a dep as there is no point calling focus() on\n\t\t// an already focused element.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ isFocusable ] );\n\n\treturn (\n\t\t<DayButton\n\t\t\tref={ ref }\n\t\t\tclassName=\"components-datetime__date__day\" // Unused, for backwards compatibility.\n\t\t\tdisabled={ isInvalid }\n\t\t\ttabIndex={ isFocusable ? 0 : -1 }\n\t\t\taria-label={ getDayLabel( day, isSelected, numEvents ) }\n\t\t\tcolumn={ column }\n\t\t\tisSelected={ isSelected }\n\t\t\tisToday={ isToday }\n\t\t\thasEvents={ numEvents > 0 }\n\t\t\tonClick={ onClick }\n\t\t\tonKeyDown={ onKeyDown }\n\t\t>\n\t\t\t{ dateI18n( 'j', day, -day.getTimezoneOffset() ) }\n\t\t</DayButton>\n\t);\n}\n\nfunction getDayLabel( date: Date, isSelected: boolean, numEvents: number ) {\n\tconst { formats } = getSettings();\n\tconst localizedDate = dateI18n(\n\t\tformats.date,\n\t\tdate,\n\t\t-date.getTimezoneOffset()\n\t);\n\tif ( isSelected && numEvents > 0 ) {\n\t\treturn sprintf(\n\t\t\t// translators: 1: The calendar date. 2: Number of events on the calendar date.\n\t\t\t_n(\n\t\t\t\t'%1$s. Selected. There is %2$d event',\n\t\t\t\t'%1$s. Selected. There are %2$d events',\n\t\t\t\tnumEvents\n\t\t\t),\n\t\t\tlocalizedDate,\n\t\t\tnumEvents\n\t\t);\n\t} else if ( isSelected ) {\n\t\treturn sprintf(\n\t\t\t// translators: %s: The calendar date.\n\t\t\t__( '%1$s. Selected' ),\n\t\t\tlocalizedDate\n\t\t);\n\t} else if ( numEvents > 0 ) {\n\t\treturn sprintf(\n\t\t\t// translators: 1: The calendar date. 2: Number of events on the calendar date.\n\t\t\t_n(\n\t\t\t\t'%1$s. There is %2$d event',\n\t\t\t\t'%1$s. There are %2$d events',\n\t\t\t\tnumEvents\n\t\t\t),\n\t\t\tlocalizedDate,\n\t\t\tnumEvents\n\t\t);\n\t}\n\treturn localizedDate;\n}\n\nexport default DatePicker;\n"]}
@@ -4,7 +4,7 @@ import { createElement } from "@wordpress/element";
4
4
  * WordPress dependencies
5
5
  */
6
6
  import { __ } from '@wordpress/i18n';
7
- import { __experimentalGetSettings as getDateSettings } from '@wordpress/date';
7
+ import { getSettings as getDateSettings } from '@wordpress/date';
8
8
  /**
9
9
  * Internal dependencies
10
10
  */
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/date-time/time/timezone.tsx"],"names":["__","__experimentalGetSettings","getDateSettings","Tooltip","TimeZone","StyledComponent","timezone","userTimezoneOffset","Date","getTimezoneOffset","Number","offset","offsetSymbol","zoneAbbr","abbr","isNaN","timezoneDetail","string","replace"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AACA,SAASC,yBAAyB,IAAIC,eAAtC,QAA6D,iBAA7D;AAEA;AACA;AACA;;AACA,OAAOC,OAAP,MAAoB,eAApB;AACA,SAASC,QAAQ,IAAIC,eAArB,QAA4C,UAA5C;AAEA;AACA;AACA;AACA;;AACA,MAAMD,QAAQ,GAAG,MAAM;AACtB,QAAM;AAAEE,IAAAA;AAAF,MAAeJ,eAAe,EAApC,CADsB,CAGtB;;AACA,QAAMK,kBAAkB,GAAG,CAAC,CAAD,IAAO,IAAIC,IAAJ,GAAWC,iBAAX,KAAiC,EAAxC,CAA3B,CAJsB,CAMtB;AACA;;AACA,MAAKC,MAAM,CAAEJ,QAAQ,CAACK,MAAX,CAAN,KAA8BJ,kBAAnC,EAAwD;AACvD,WAAO,IAAP;AACA;;AAED,QAAMK,YAAY,GAAGF,MAAM,CAAEJ,QAAQ,CAACK,MAAX,CAAN,IAA6B,CAA7B,GAAiC,GAAjC,GAAuC,EAA5D;AACA,QAAME,QAAQ,GACb,OAAOP,QAAQ,CAACQ,IAAhB,IAAwBC,KAAK,CAAEL,MAAM,CAAEJ,QAAQ,CAACQ,IAAX,CAAR,CAA7B,GACGR,QAAQ,CAACQ,IADZ,GAEI,MAAMF,YAAc,GAAGN,QAAQ,CAACK,MAAQ,EAH7C;AAKA,QAAMK,cAAc,GACnB,UAAUV,QAAQ,CAACW,MAAnB,GACGjB,EAAE,CAAE,4BAAF,CADL,GAEI,IAAIa,QAAU,KAAKP,QAAQ,CAACW,MAAT,CAAgBC,OAAhB,CAAyB,GAAzB,EAA8B,GAA9B,CAAqC,EAH7D;AAKA,SACC,cAAC,OAAD;AAAS,IAAA,QAAQ,EAAC,YAAlB;AAA+B,IAAA,IAAI,EAAGF;AAAtC,KACC,cAAC,eAAD;AAAiB,IAAA,SAAS,EAAC;AAA3B,KACGH,QADH,CADD,CADD;AAOA,CA9BD;;AAgCA,eAAeT,QAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { __experimentalGetSettings as getDateSettings } from '@wordpress/date';\n\n/**\n * Internal dependencies\n */\nimport Tooltip from '../../tooltip';\nimport { TimeZone as StyledComponent } from './styles';\n\n/**\n * Displays timezone information when user timezone is different from site\n * timezone.\n */\nconst TimeZone = () => {\n\tconst { timezone } = getDateSettings();\n\n\t// Convert timezone offset to hours.\n\tconst userTimezoneOffset = -1 * ( new Date().getTimezoneOffset() / 60 );\n\n\t// System timezone and user timezone match, nothing needed.\n\t// Compare as numbers because it comes over as string.\n\tif ( Number( timezone.offset ) === userTimezoneOffset ) {\n\t\treturn null;\n\t}\n\n\tconst offsetSymbol = Number( timezone.offset ) >= 0 ? '+' : '';\n\tconst zoneAbbr =\n\t\t'' !== timezone.abbr && isNaN( Number( timezone.abbr ) )\n\t\t\t? timezone.abbr\n\t\t\t: `UTC${ offsetSymbol }${ timezone.offset }`;\n\n\tconst timezoneDetail =\n\t\t'UTC' === timezone.string\n\t\t\t? __( 'Coordinated Universal Time' )\n\t\t\t: `(${ zoneAbbr }) ${ timezone.string.replace( '_', ' ' ) }`;\n\n\treturn (\n\t\t<Tooltip position=\"top center\" text={ timezoneDetail }>\n\t\t\t<StyledComponent className=\"components-datetime__timezone\">\n\t\t\t\t{ zoneAbbr }\n\t\t\t</StyledComponent>\n\t\t</Tooltip>\n\t);\n};\n\nexport default TimeZone;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/date-time/time/timezone.tsx"],"names":["__","getSettings","getDateSettings","Tooltip","TimeZone","StyledComponent","timezone","userTimezoneOffset","Date","getTimezoneOffset","Number","offset","offsetSymbol","zoneAbbr","abbr","isNaN","timezoneDetail","string","replace"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AACA,SAASC,WAAW,IAAIC,eAAxB,QAA+C,iBAA/C;AAEA;AACA;AACA;;AACA,OAAOC,OAAP,MAAoB,eAApB;AACA,SAASC,QAAQ,IAAIC,eAArB,QAA4C,UAA5C;AAEA;AACA;AACA;AACA;;AACA,MAAMD,QAAQ,GAAG,MAAM;AACtB,QAAM;AAAEE,IAAAA;AAAF,MAAeJ,eAAe,EAApC,CADsB,CAGtB;;AACA,QAAMK,kBAAkB,GAAG,CAAC,CAAD,IAAO,IAAIC,IAAJ,GAAWC,iBAAX,KAAiC,EAAxC,CAA3B,CAJsB,CAMtB;AACA;;AACA,MAAKC,MAAM,CAAEJ,QAAQ,CAACK,MAAX,CAAN,KAA8BJ,kBAAnC,EAAwD;AACvD,WAAO,IAAP;AACA;;AAED,QAAMK,YAAY,GAAGF,MAAM,CAAEJ,QAAQ,CAACK,MAAX,CAAN,IAA6B,CAA7B,GAAiC,GAAjC,GAAuC,EAA5D;AACA,QAAME,QAAQ,GACb,OAAOP,QAAQ,CAACQ,IAAhB,IAAwBC,KAAK,CAAEL,MAAM,CAAEJ,QAAQ,CAACQ,IAAX,CAAR,CAA7B,GACGR,QAAQ,CAACQ,IADZ,GAEI,MAAMF,YAAc,GAAGN,QAAQ,CAACK,MAAQ,EAH7C;AAKA,QAAMK,cAAc,GACnB,UAAUV,QAAQ,CAACW,MAAnB,GACGjB,EAAE,CAAE,4BAAF,CADL,GAEI,IAAIa,QAAU,KAAKP,QAAQ,CAACW,MAAT,CAAgBC,OAAhB,CAAyB,GAAzB,EAA8B,GAA9B,CAAqC,EAH7D;AAKA,SACC,cAAC,OAAD;AAAS,IAAA,QAAQ,EAAC,YAAlB;AAA+B,IAAA,IAAI,EAAGF;AAAtC,KACC,cAAC,eAAD;AAAiB,IAAA,SAAS,EAAC;AAA3B,KACGH,QADH,CADD,CADD;AAOA,CA9BD;;AAgCA,eAAeT,QAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { getSettings as getDateSettings } from '@wordpress/date';\n\n/**\n * Internal dependencies\n */\nimport Tooltip from '../../tooltip';\nimport { TimeZone as StyledComponent } from './styles';\n\n/**\n * Displays timezone information when user timezone is different from site\n * timezone.\n */\nconst TimeZone = () => {\n\tconst { timezone } = getDateSettings();\n\n\t// Convert timezone offset to hours.\n\tconst userTimezoneOffset = -1 * ( new Date().getTimezoneOffset() / 60 );\n\n\t// System timezone and user timezone match, nothing needed.\n\t// Compare as numbers because it comes over as string.\n\tif ( Number( timezone.offset ) === userTimezoneOffset ) {\n\t\treturn null;\n\t}\n\n\tconst offsetSymbol = Number( timezone.offset ) >= 0 ? '+' : '';\n\tconst zoneAbbr =\n\t\t'' !== timezone.abbr && isNaN( Number( timezone.abbr ) )\n\t\t\t? timezone.abbr\n\t\t\t: `UTC${ offsetSymbol }${ timezone.offset }`;\n\n\tconst timezoneDetail =\n\t\t'UTC' === timezone.string\n\t\t\t? __( 'Coordinated Universal Time' )\n\t\t\t: `(${ zoneAbbr }) ${ timezone.string.replace( '_', ' ' ) }`;\n\n\treturn (\n\t\t<Tooltip position=\"top center\" text={ timezoneDetail }>\n\t\t\t<StyledComponent className=\"components-datetime__timezone\">\n\t\t\t\t{ zoneAbbr }\n\t\t\t</StyledComponent>\n\t\t</Tooltip>\n\t);\n};\n\nexport default TimeZone;\n"]}
@@ -4,23 +4,30 @@ import { createElement } from "@wordpress/element";
4
4
  /**
5
5
  * External dependencies
6
6
  */
7
- import classnames from 'classnames';
7
+
8
8
  /**
9
9
  * WordPress dependencies
10
10
  */
11
-
12
11
  import { useDisabled } from '@wordpress/compose';
13
- import { createContext } from '@wordpress/element';
12
+ import { createContext, forwardRef } from '@wordpress/element';
14
13
  /**
15
14
  * Internal dependencies
16
15
  */
17
16
 
18
- import { StyledWrapper } from './styles/disabled-styles';
17
+ import { disabledStyles } from './styles/disabled-styles';
18
+ import { useCx } from '../utils';
19
19
  const Context = createContext(false);
20
20
  const {
21
21
  Consumer,
22
22
  Provider
23
- } = Context;
23
+ } = Context; // Extracting this ContentWrapper component in order to make it more explicit
24
+ // the same 'ContentWrapper' component is needed so that React can reconcile
25
+ // the dom correctly when switching between disabled/non-disabled (instead
26
+ // of thrashing the previous DOM and therefore losing the form fields values).
27
+
28
+ const ContentWrapper = forwardRef((props, ref) => createElement("div", _extends({}, props, {
29
+ ref: ref
30
+ })));
24
31
  /**
25
32
  * `Disabled` is a component which disables descendant tabbable elements and prevents pointer interaction.
26
33
  *
@@ -60,18 +67,19 @@ function Disabled(_ref) {
60
67
  ...props
61
68
  } = _ref;
62
69
  const ref = useDisabled();
70
+ const cx = useCx();
63
71
 
64
72
  if (!isDisabled) {
65
73
  return createElement(Provider, {
66
74
  value: false
67
- }, children);
75
+ }, createElement(ContentWrapper, null, children));
68
76
  }
69
77
 
70
78
  return createElement(Provider, {
71
79
  value: true
72
- }, createElement(StyledWrapper, _extends({
80
+ }, createElement(ContentWrapper, _extends({
73
81
  ref: ref,
74
- className: classnames(className, 'components-disabled')
82
+ className: cx(disabledStyles, className, 'components-disabled')
75
83
  }, props), children));
76
84
  }
77
85
 
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/disabled/index.tsx"],"names":["classnames","useDisabled","createContext","StyledWrapper","Context","Consumer","Provider","Disabled","className","children","isDisabled","props","ref"],"mappings":";;;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,WAAT,QAA4B,oBAA5B;AACA,SAASC,aAAT,QAA8B,oBAA9B;AAEA;AACA;AACA;;AACA,SAASC,aAAT,QAA8B,0BAA9B;AAIA,MAAMC,OAAO,GAAGF,aAAa,CAAa,KAAb,CAA7B;AACA,MAAM;AAAEG,EAAAA,QAAF;AAAYC,EAAAA;AAAZ,IAAyBF,OAA/B;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASG,QAAT,OAKoE;AAAA,MALjD;AAClBC,IAAAA,SADkB;AAElBC,IAAAA,QAFkB;AAGlBC,IAAAA,UAAU,GAAG,IAHK;AAIlB,OAAGC;AAJe,GAKiD;AACnE,QAAMC,GAAG,GAAGX,WAAW,EAAvB;;AAEA,MAAK,CAAES,UAAP,EAAoB;AACnB,WAAO,cAAC,QAAD;AAAU,MAAA,KAAK,EAAG;AAAlB,OAA4BD,QAA5B,CAAP;AACA;;AAED,SACC,cAAC,QAAD;AAAU,IAAA,KAAK,EAAG;AAAlB,KACC,cAAC,aAAD;AACC,IAAA,GAAG,EAAGG,GADP;AAEC,IAAA,SAAS,EAAGZ,UAAU,CAAEQ,SAAF,EAAa,qBAAb;AAFvB,KAGMG,KAHN,GAKGF,QALH,CADD,CADD;AAWA;;AAEDF,QAAQ,CAACH,OAAT,GAAmBA,OAAnB;AACAG,QAAQ,CAACF,QAAT,GAAoBA,QAApB;AAEA,eAAeE,QAAf","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useDisabled } from '@wordpress/compose';\nimport { createContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { StyledWrapper } from './styles/disabled-styles';\nimport type { DisabledProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\nconst Context = createContext< boolean >( false );\nconst { Consumer, Provider } = Context;\n\n/**\n * `Disabled` is a component which disables descendant tabbable elements and prevents pointer interaction.\n *\n * ```jsx\n * import { Button, Disabled, TextControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDisabled = () => {\n * \tconst [ isDisabled, setIsDisabled ] = useState( true );\n *\n * \tlet input = <TextControl label=\"Input\" onChange={ () => {} } />;\n * \tif ( isDisabled ) {\n * \t\tinput = <Disabled>{ input }</Disabled>;\n * \t}\n *\n * \tconst toggleDisabled = () => {\n * \t\tsetIsDisabled( ( state ) => ! state );\n * \t};\n *\n * \treturn (\n * \t\t<div>\n * \t\t\t{ input }\n * \t\t\t<Button variant=\"primary\" onClick={ toggleDisabled }>\n * \t\t\t\tToggle Disabled\n * \t\t\t</Button>\n * \t\t</div>\n * \t);\n * };\n * ```\n */\nfunction Disabled( {\n\tclassName,\n\tchildren,\n\tisDisabled = true,\n\t...props\n}: Omit< WordPressComponentProps< DisabledProps, 'div' >, 'ref' > ) {\n\tconst ref = useDisabled();\n\n\tif ( ! isDisabled ) {\n\t\treturn <Provider value={ false }>{ children }</Provider>;\n\t}\n\n\treturn (\n\t\t<Provider value={ true }>\n\t\t\t<StyledWrapper\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ classnames( className, 'components-disabled' ) }\n\t\t\t\t{ ...props }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</StyledWrapper>\n\t\t</Provider>\n\t);\n}\n\nDisabled.Context = Context;\nDisabled.Consumer = Consumer;\n\nexport default Disabled;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/disabled/index.tsx"],"names":["useDisabled","createContext","forwardRef","disabledStyles","useCx","Context","Consumer","Provider","ContentWrapper","props","ref","Disabled","className","children","isDisabled","cx"],"mappings":";;;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,WAAT,QAA4B,oBAA5B;AACA,SAASC,aAAT,EAAwBC,UAAxB,QAA0C,oBAA1C;AAEA;AACA;AACA;;AACA,SAASC,cAAT,QAA+B,0BAA/B;AAGA,SAASC,KAAT,QAAsB,UAAtB;AAEA,MAAMC,OAAO,GAAGJ,aAAa,CAAa,KAAb,CAA7B;AACA,MAAM;AAAEK,EAAAA,QAAF;AAAYC,EAAAA;AAAZ,IAAyBF,OAA/B,C,CAEA;AACA;AACA;AACA;;AACA,MAAMG,cAAc,GAAGN,UAAU,CAG9B,CAAEO,KAAF,EAASC,GAAT,KAAkB,kCAAUD,KAAV;AAAkB,EAAA,GAAG,EAAGC;AAAxB,GAHY,CAAjC;AAKA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,SAASC,QAAT,OAKqD;AAAA,MALlC;AAClBC,IAAAA,SADkB;AAElBC,IAAAA,QAFkB;AAGlBC,IAAAA,UAAU,GAAG,IAHK;AAIlB,OAAGL;AAJe,GAKkC;AACpD,QAAMC,GAAG,GAAGV,WAAW,EAAvB;AACA,QAAMe,EAAE,GAAGX,KAAK,EAAhB;;AACA,MAAK,CAAEU,UAAP,EAAoB;AACnB,WACC,cAAC,QAAD;AAAU,MAAA,KAAK,EAAG;AAAlB,OACC,cAAC,cAAD,QAAkBD,QAAlB,CADD,CADD;AAKA;;AAED,SACC,cAAC,QAAD;AAAU,IAAA,KAAK,EAAG;AAAlB,KACC,cAAC,cAAD;AACC,IAAA,GAAG,EAAGH,GADP;AAEC,IAAA,SAAS,EAAGK,EAAE,CACbZ,cADa,EAEbS,SAFa,EAGb,qBAHa;AAFf,KAOMH,KAPN,GASGI,QATH,CADD,CADD;AAeA;;AAEDF,QAAQ,CAACN,OAAT,GAAmBA,OAAnB;AACAM,QAAQ,CAACL,QAAT,GAAoBA,QAApB;AAEA,eAAeK,QAAf","sourcesContent":["/**\n * External dependencies\n */\nimport type { HTMLProps } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useDisabled } from '@wordpress/compose';\nimport { createContext, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { disabledStyles } from './styles/disabled-styles';\nimport type { DisabledProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\nimport { useCx } from '../utils';\n\nconst Context = createContext< boolean >( false );\nconst { Consumer, Provider } = Context;\n\n// Extracting this ContentWrapper component in order to make it more explicit\n// the same 'ContentWrapper' component is needed so that React can reconcile\n// the dom correctly when switching between disabled/non-disabled (instead\n// of thrashing the previous DOM and therefore losing the form fields values).\nconst ContentWrapper = forwardRef<\n\tHTMLDivElement,\n\tHTMLProps< HTMLDivElement >\n>( ( props, ref ) => <div { ...props } ref={ ref } /> );\n\n/**\n * `Disabled` is a component which disables descendant tabbable elements and prevents pointer interaction.\n *\n * ```jsx\n * import { Button, Disabled, TextControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDisabled = () => {\n * \tconst [ isDisabled, setIsDisabled ] = useState( true );\n *\n * \tlet input = <TextControl label=\"Input\" onChange={ () => {} } />;\n * \tif ( isDisabled ) {\n * \t\tinput = <Disabled>{ input }</Disabled>;\n * \t}\n *\n * \tconst toggleDisabled = () => {\n * \t\tsetIsDisabled( ( state ) => ! state );\n * \t};\n *\n * \treturn (\n * \t\t<div>\n * \t\t\t{ input }\n * \t\t\t<Button variant=\"primary\" onClick={ toggleDisabled }>\n * \t\t\t\tToggle Disabled\n * \t\t\t</Button>\n * \t\t</div>\n * \t);\n * };\n * ```\n */\nfunction Disabled( {\n\tclassName,\n\tchildren,\n\tisDisabled = true,\n\t...props\n}: WordPressComponentProps< DisabledProps, 'div' > ) {\n\tconst ref = useDisabled();\n\tconst cx = useCx();\n\tif ( ! isDisabled ) {\n\t\treturn (\n\t\t\t<Provider value={ false }>\n\t\t\t\t<ContentWrapper>{ children }</ContentWrapper>\n\t\t\t</Provider>\n\t\t);\n\t}\n\n\treturn (\n\t\t<Provider value={ true }>\n\t\t\t<ContentWrapper\n\t\t\t\tref={ ref }\n\t\t\t\tclassName={ cx(\n\t\t\t\t\tdisabledStyles,\n\t\t\t\t\tclassName,\n\t\t\t\t\t'components-disabled'\n\t\t\t\t) }\n\t\t\t\t{ ...props }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</ContentWrapper>\n\t\t</Provider>\n\t);\n}\n\nDisabled.Context = Context;\nDisabled.Consumer = Consumer;\n\nexport default Disabled;\n"]}
@@ -1,22 +1,16 @@
1
- import _styled from "@emotion/styled/base";
2
-
3
1
  function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
4
2
 
5
3
  /**
6
4
  * External dependencies
7
5
  */
8
- export const StyledWrapper = _styled("div", process.env.NODE_ENV === "production" ? {
9
- target: "e13jgla80"
10
- } : {
11
- target: "e13jgla80",
12
- label: "StyledWrapper"
13
- })(process.env.NODE_ENV === "production" ? {
6
+ import { css } from '@emotion/react';
7
+ export const disabledStyles = process.env.NODE_ENV === "production" ? {
14
8
  name: "u2jump",
15
9
  styles: "position:relative;pointer-events:none;&::after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;}*{pointer-events:none;}"
16
10
  } : {
17
- name: "u2jump",
18
- styles: "position:relative;pointer-events:none;&::after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;}*{pointer-events:none;}",
19
- map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGlzYWJsZWQvc3R5bGVzL2Rpc2FibGVkLXN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBS3VDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGlzYWJsZWQvc3R5bGVzL2Rpc2FibGVkLXN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbmV4cG9ydCBjb25zdCBTdHlsZWRXcmFwcGVyID0gc3R5bGVkLmRpdmBcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRwb2ludGVyLWV2ZW50czogbm9uZTtcblxuXHQmOjphZnRlciB7XG5cdFx0Y29udGVudDogJyc7XG5cdFx0cG9zaXRpb246IGFic29sdXRlO1xuXHRcdHRvcDogMDtcblx0XHRyaWdodDogMDtcblx0XHRib3R0b206IDA7XG5cdFx0bGVmdDogMDtcblx0fVxuXG5cdC8vIEFsc28gbWFrZSBuZXN0ZWQgYmxvY2tzIHVuc2VsZWN0YWJsZS5cblx0KiB7XG5cdFx0cG9pbnRlci1ldmVudHM6IG5vbmU7XG5cdH1cbmA7XG4iXX0= */",
11
+ name: "iqemdn-disabledStyles",
12
+ styles: "position:relative;pointer-events:none;&::after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;}*{pointer-events:none;};label:disabledStyles;",
13
+ map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGlzYWJsZWQvc3R5bGVzL2Rpc2FibGVkLXN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBS2lDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGlzYWJsZWQvc3R5bGVzL2Rpc2FibGVkLXN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbmV4cG9ydCBjb25zdCBkaXNhYmxlZFN0eWxlcyA9IGNzc2Bcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHRwb2ludGVyLWV2ZW50czogbm9uZTtcblxuXHQmOjphZnRlciB7XG5cdFx0Y29udGVudDogJyc7XG5cdFx0cG9zaXRpb246IGFic29sdXRlO1xuXHRcdHRvcDogMDtcblx0XHRyaWdodDogMDtcblx0XHRib3R0b206IDA7XG5cdFx0bGVmdDogMDtcblx0fVxuXG5cdC8vIEFsc28gbWFrZSBuZXN0ZWQgYmxvY2tzIHVuc2VsZWN0YWJsZS5cblx0KiB7XG5cdFx0cG9pbnRlci1ldmVudHM6IG5vbmU7XG5cdH1cbmA7XG4iXX0= */",
20
14
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
21
- });
15
+ };
22
16
  //# sourceMappingURL=disabled-styles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/disabled/styles/disabled-styles.tsx"],"names":["StyledWrapper"],"mappings":";;;;AAAA;AACA;AACA;AAGA,OAAO,MAAMA,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAnB","sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\n\nexport const StyledWrapper = styled.div`\n\tposition: relative;\n\tpointer-events: none;\n\n\t&::after {\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tright: 0;\n\t\tbottom: 0;\n\t\tleft: 0;\n\t}\n\n\t// Also make nested blocks unselectable.\n\t* {\n\t\tpointer-events: none;\n\t}\n`;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/disabled/styles/disabled-styles.tsx"],"names":["css","disabledStyles"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,GAAT,QAAoB,gBAApB;AAEA,OAAO,MAAMC,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAApB","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\n\nexport const disabledStyles = css`\n\tposition: relative;\n\tpointer-events: none;\n\n\t&::after {\n\t\tcontent: '';\n\t\tposition: absolute;\n\t\ttop: 0;\n\t\tright: 0;\n\t\tbottom: 0;\n\t\tleft: 0;\n\t}\n\n\t// Also make nested blocks unselectable.\n\t* {\n\t\tpointer-events: none;\n\t}\n`;\n"]}
@@ -1,3 +1,4 @@
1
+ import _extends from "@babel/runtime/helpers/esm/extends";
1
2
  import { createElement } from "@wordpress/element";
2
3
 
3
4
  /**
@@ -18,21 +19,48 @@ import { __experimentalUseDropZone as useDropZone, useReducedMotion } from '@wor
18
19
  */
19
20
 
20
21
  import { __unstableMotion as motion, __unstableAnimatePresence as AnimatePresence } from '../animation';
21
- export default function DropZoneComponent(_ref) {
22
+
23
+ /**
24
+ * `DropZone` is a component creating a drop zone area taking the full size of its parent element. It supports dropping files, HTML content or any other HTML drop event.
25
+ *
26
+ * ```jsx
27
+ * import { DropZone } from '@wordpress/components';
28
+ * import { useState } from '@wordpress/element';
29
+ *
30
+ * const MyDropZone = () => {
31
+ * const [ hasDropped, setHasDropped ] = useState( false );
32
+ *
33
+ * return (
34
+ * <div>
35
+ * { hasDropped ? 'Dropped!' : 'Drop something here' }
36
+ * <DropZone
37
+ * onFilesDrop={ () => setHasDropped( true ) }
38
+ * onHTMLDrop={ () => setHasDropped( true ) }
39
+ * onDrop={ () => setHasDropped( true ) }
40
+ * />
41
+ * </div>
42
+ * );
43
+ * }
44
+ * ```
45
+ */
46
+ export function DropZoneComponent(_ref) {
22
47
  let {
23
48
  className,
24
49
  label,
25
50
  onFilesDrop,
26
51
  onHTMLDrop,
27
- onDrop
52
+ onDrop,
53
+ ...restProps
28
54
  } = _ref;
29
55
  const [isDraggingOverDocument, setIsDraggingOverDocument] = useState();
30
56
  const [isDraggingOverElement, setIsDraggingOverElement] = useState();
31
57
  const [type, setType] = useState();
32
58
  const ref = useDropZone({
33
59
  onDrop(event) {
34
- const files = getFilesFromDataTransfer(event.dataTransfer);
35
- const html = event.dataTransfer.getData('text/html');
60
+ var _event$dataTransfer;
61
+
62
+ const files = event.dataTransfer ? getFilesFromDataTransfer(event.dataTransfer) : [];
63
+ const html = (_event$dataTransfer = event.dataTransfer) === null || _event$dataTransfer === void 0 ? void 0 : _event$dataTransfer.getData('text/html');
36
64
  /**
37
65
  * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.
38
66
  * The order of the checks is important to recognise the HTML drop.
@@ -48,6 +76,8 @@ export default function DropZoneComponent(_ref) {
48
76
  },
49
77
 
50
78
  onDragStart(event) {
79
+ var _event$dataTransfer2, _event$dataTransfer3;
80
+
51
81
  setIsDraggingOverDocument(true);
52
82
  let _type = 'default';
53
83
  /**
@@ -55,11 +85,11 @@ export default function DropZoneComponent(_ref) {
55
85
  * The order of the checks is important to recognise the HTML drop.
56
86
  */
57
87
 
58
- if (event.dataTransfer.types.includes('text/html')) {
88
+ if ((_event$dataTransfer2 = event.dataTransfer) !== null && _event$dataTransfer2 !== void 0 && _event$dataTransfer2.types.includes('text/html')) {
59
89
  _type = 'html';
60
90
  } else if ( // Check for the types because sometimes the files themselves
61
91
  // are only available on drop.
62
- event.dataTransfer.types.includes('Files') || getFilesFromDataTransfer(event.dataTransfer).length > 0) {
92
+ (_event$dataTransfer3 = event.dataTransfer) !== null && _event$dataTransfer3 !== void 0 && _event$dataTransfer3.types.includes('Files') || (event.dataTransfer ? getFilesFromDataTransfer(event.dataTransfer) : []).length > 0) {
63
93
  _type = 'file';
64
94
  }
65
95
 
@@ -68,7 +98,7 @@ export default function DropZoneComponent(_ref) {
68
98
 
69
99
  onDragEnd() {
70
100
  setIsDraggingOverDocument(false);
71
- setType();
101
+ setType(undefined);
72
102
  },
73
103
 
74
104
  onDragEnter() {
@@ -144,9 +174,10 @@ export default function DropZoneComponent(_ref) {
144
174
  'is-dragging-over-element': isDraggingOverElement,
145
175
  [`is-dragging-${type}`]: !!type
146
176
  });
147
- return createElement("div", {
177
+ return createElement("div", _extends({}, restProps, {
148
178
  ref: ref,
149
179
  className: classes
150
- }, disableMotion ? children : createElement(AnimatePresence, null, children));
180
+ }), disableMotion ? children : createElement(AnimatePresence, null, children));
151
181
  }
182
+ export default DropZoneComponent;
152
183
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/drop-zone/index.js"],"names":["classnames","__","useState","upload","Icon","getFilesFromDataTransfer","__experimentalUseDropZone","useDropZone","useReducedMotion","__unstableMotion","motion","__unstableAnimatePresence","AnimatePresence","DropZoneComponent","className","label","onFilesDrop","onHTMLDrop","onDrop","isDraggingOverDocument","setIsDraggingOverDocument","isDraggingOverElement","setIsDraggingOverElement","type","setType","ref","event","files","dataTransfer","html","getData","length","onDragStart","_type","types","includes","onDragEnd","onDragEnter","onDragLeave","disableMotion","children","backdrop","hidden","scaleY","opacity","show","transition","duration","delay","delayChildren","exit","foreground","scale","classes"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport { upload, Icon } from '@wordpress/icons';\nimport { getFilesFromDataTransfer } from '@wordpress/dom';\nimport {\n\t__experimentalUseDropZone as useDropZone,\n\tuseReducedMotion,\n} from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '../animation';\n\nexport default function DropZoneComponent( {\n\tclassName,\n\tlabel,\n\tonFilesDrop,\n\tonHTMLDrop,\n\tonDrop,\n} ) {\n\tconst [ isDraggingOverDocument, setIsDraggingOverDocument ] = useState();\n\tconst [ isDraggingOverElement, setIsDraggingOverElement ] = useState();\n\tconst [ type, setType ] = useState();\n\tconst ref = useDropZone( {\n\t\tonDrop( event ) {\n\t\t\tconst files = getFilesFromDataTransfer( event.dataTransfer );\n\t\t\tconst html = event.dataTransfer.getData( 'text/html' );\n\n\t\t\t/**\n\t\t\t * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n\t\t\t * The order of the checks is important to recognise the HTML drop.\n\t\t\t */\n\t\t\tif ( html && onHTMLDrop ) {\n\t\t\t\tonHTMLDrop( html );\n\t\t\t} else if ( files.length && onFilesDrop ) {\n\t\t\t\tonFilesDrop( files );\n\t\t\t} else if ( onDrop ) {\n\t\t\t\tonDrop( event );\n\t\t\t}\n\t\t},\n\t\tonDragStart( event ) {\n\t\t\tsetIsDraggingOverDocument( true );\n\n\t\t\tlet _type = 'default';\n\n\t\t\t/**\n\t\t\t * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n\t\t\t * The order of the checks is important to recognise the HTML drop.\n\t\t\t */\n\t\t\tif ( event.dataTransfer.types.includes( 'text/html' ) ) {\n\t\t\t\t_type = 'html';\n\t\t\t} else if (\n\t\t\t\t// Check for the types because sometimes the files themselves\n\t\t\t\t// are only available on drop.\n\t\t\t\tevent.dataTransfer.types.includes( 'Files' ) ||\n\t\t\t\tgetFilesFromDataTransfer( event.dataTransfer ).length > 0\n\t\t\t) {\n\t\t\t\t_type = 'file';\n\t\t\t}\n\n\t\t\tsetType( _type );\n\t\t},\n\t\tonDragEnd() {\n\t\t\tsetIsDraggingOverDocument( false );\n\t\t\tsetType();\n\t\t},\n\t\tonDragEnter() {\n\t\t\tsetIsDraggingOverElement( true );\n\t\t},\n\t\tonDragLeave() {\n\t\t\tsetIsDraggingOverElement( false );\n\t\t},\n\t} );\n\tconst disableMotion = useReducedMotion();\n\n\tlet children;\n\n\tconst backdrop = {\n\t\thidden: { scaleY: 0, opacity: 0 },\n\t\tshow: {\n\t\t\tscaleY: 1,\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\ttype: 'tween',\n\t\t\t\tduration: 0.2,\n\t\t\t\tdelay: 0.1,\n\t\t\t\tdelayChildren: 0.2,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\tscaleY: 1,\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.3,\n\t\t\t\tdelayChildren: 0,\n\t\t\t},\n\t\t},\n\t};\n\n\tconst foreground = {\n\t\thidden: { opacity: 0, scale: 0.75 },\n\t\tshow: { opacity: 1, scale: 1 },\n\t\texit: { opacity: 0, scale: 0.9 },\n\t};\n\n\tif ( isDraggingOverElement ) {\n\t\tchildren = (\n\t\t\t<motion.div\n\t\t\t\tvariants={ backdrop }\n\t\t\t\tinitial={ disableMotion ? 'show' : 'hidden' }\n\t\t\t\tanimate=\"show\"\n\t\t\t\texit={ disableMotion ? 'show' : 'exit' }\n\t\t\t\tclassName=\"components-drop-zone__content\"\n\t\t\t>\n\t\t\t\t<motion.div variants={ foreground }>\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={ upload }\n\t\t\t\t\t\tclassName=\"components-drop-zone__content-icon\"\n\t\t\t\t\t/>\n\t\t\t\t\t<span className=\"components-drop-zone__content-text\">\n\t\t\t\t\t\t{ label ? label : __( 'Drop files to upload' ) }\n\t\t\t\t\t</span>\n\t\t\t\t</motion.div>\n\t\t\t</motion.div>\n\t\t);\n\t}\n\n\tconst classes = classnames( 'components-drop-zone', className, {\n\t\t'is-active':\n\t\t\t( isDraggingOverDocument || isDraggingOverElement ) &&\n\t\t\t( ( type === 'file' && onFilesDrop ) ||\n\t\t\t\t( type === 'html' && onHTMLDrop ) ||\n\t\t\t\t( type === 'default' && onDrop ) ),\n\t\t'is-dragging-over-document': isDraggingOverDocument,\n\t\t'is-dragging-over-element': isDraggingOverElement,\n\t\t[ `is-dragging-${ type }` ]: !! type,\n\t} );\n\n\treturn (\n\t\t<div ref={ ref } className={ classes }>\n\t\t\t{ disableMotion ? (\n\t\t\t\tchildren\n\t\t\t) : (\n\t\t\t\t<AnimatePresence>{ children }</AnimatePresence>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/drop-zone/index.tsx"],"names":["classnames","__","useState","upload","Icon","getFilesFromDataTransfer","__experimentalUseDropZone","useDropZone","useReducedMotion","__unstableMotion","motion","__unstableAnimatePresence","AnimatePresence","DropZoneComponent","className","label","onFilesDrop","onHTMLDrop","onDrop","restProps","isDraggingOverDocument","setIsDraggingOverDocument","isDraggingOverElement","setIsDraggingOverElement","type","setType","ref","event","files","dataTransfer","html","getData","length","onDragStart","_type","types","includes","onDragEnd","undefined","onDragEnter","onDragLeave","disableMotion","children","backdrop","hidden","scaleY","opacity","show","transition","duration","delay","delayChildren","exit","foreground","scale","classes"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport { upload, Icon } from '@wordpress/icons';\nimport { getFilesFromDataTransfer } from '@wordpress/dom';\nimport {\n\t__experimentalUseDropZone as useDropZone,\n\tuseReducedMotion,\n} from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n} from '../animation';\nimport type { DropType, DropZoneProps } from './types';\nimport type { WordPressComponentProps } from '../ui/context';\n\n/**\n * `DropZone` is a component creating a drop zone area taking the full size of its parent element. It supports dropping files, HTML content or any other HTML drop event.\n *\n * ```jsx\n * import { DropZone } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyDropZone = () => {\n * const [ hasDropped, setHasDropped ] = useState( false );\n *\n * return (\n * <div>\n * { hasDropped ? 'Dropped!' : 'Drop something here' }\n * <DropZone\n * onFilesDrop={ () => setHasDropped( true ) }\n * onHTMLDrop={ () => setHasDropped( true ) }\n * onDrop={ () => setHasDropped( true ) }\n * />\n * </div>\n * );\n * }\n * ```\n */\nexport function DropZoneComponent( {\n\tclassName,\n\tlabel,\n\tonFilesDrop,\n\tonHTMLDrop,\n\tonDrop,\n\t...restProps\n}: WordPressComponentProps< DropZoneProps, 'div', false > ) {\n\tconst [ isDraggingOverDocument, setIsDraggingOverDocument ] =\n\t\tuseState< boolean >();\n\tconst [ isDraggingOverElement, setIsDraggingOverElement ] =\n\t\tuseState< boolean >();\n\tconst [ type, setType ] = useState< DropType >();\n\tconst ref = useDropZone( {\n\t\tonDrop( event ) {\n\t\t\tconst files = event.dataTransfer\n\t\t\t\t? getFilesFromDataTransfer( event.dataTransfer )\n\t\t\t\t: [];\n\t\t\tconst html = event.dataTransfer?.getData( 'text/html' );\n\n\t\t\t/**\n\t\t\t * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n\t\t\t * The order of the checks is important to recognise the HTML drop.\n\t\t\t */\n\t\t\tif ( html && onHTMLDrop ) {\n\t\t\t\tonHTMLDrop( html );\n\t\t\t} else if ( files.length && onFilesDrop ) {\n\t\t\t\tonFilesDrop( files );\n\t\t\t} else if ( onDrop ) {\n\t\t\t\tonDrop( event );\n\t\t\t}\n\t\t},\n\t\tonDragStart( event ) {\n\t\t\tsetIsDraggingOverDocument( true );\n\n\t\t\tlet _type: DropType = 'default';\n\n\t\t\t/**\n\t\t\t * From Windows Chrome 96, the `event.dataTransfer` returns both file object and HTML.\n\t\t\t * The order of the checks is important to recognise the HTML drop.\n\t\t\t */\n\t\t\tif ( event.dataTransfer?.types.includes( 'text/html' ) ) {\n\t\t\t\t_type = 'html';\n\t\t\t} else if (\n\t\t\t\t// Check for the types because sometimes the files themselves\n\t\t\t\t// are only available on drop.\n\t\t\t\tevent.dataTransfer?.types.includes( 'Files' ) ||\n\t\t\t\t( event.dataTransfer\n\t\t\t\t\t? getFilesFromDataTransfer( event.dataTransfer )\n\t\t\t\t\t: []\n\t\t\t\t).length > 0\n\t\t\t) {\n\t\t\t\t_type = 'file';\n\t\t\t}\n\n\t\t\tsetType( _type );\n\t\t},\n\t\tonDragEnd() {\n\t\t\tsetIsDraggingOverDocument( false );\n\t\t\tsetType( undefined );\n\t\t},\n\t\tonDragEnter() {\n\t\t\tsetIsDraggingOverElement( true );\n\t\t},\n\t\tonDragLeave() {\n\t\t\tsetIsDraggingOverElement( false );\n\t\t},\n\t} );\n\tconst disableMotion = useReducedMotion();\n\n\tlet children;\n\n\tconst backdrop = {\n\t\thidden: { scaleY: 0, opacity: 0 },\n\t\tshow: {\n\t\t\tscaleY: 1,\n\t\t\topacity: 1,\n\t\t\ttransition: {\n\t\t\t\ttype: 'tween',\n\t\t\t\tduration: 0.2,\n\t\t\t\tdelay: 0.1,\n\t\t\t\tdelayChildren: 0.2,\n\t\t\t},\n\t\t},\n\t\texit: {\n\t\t\tscaleY: 1,\n\t\t\topacity: 0,\n\t\t\ttransition: {\n\t\t\t\tduration: 0.3,\n\t\t\t\tdelayChildren: 0,\n\t\t\t},\n\t\t},\n\t};\n\n\tconst foreground = {\n\t\thidden: { opacity: 0, scale: 0.75 },\n\t\tshow: { opacity: 1, scale: 1 },\n\t\texit: { opacity: 0, scale: 0.9 },\n\t};\n\n\tif ( isDraggingOverElement ) {\n\t\tchildren = (\n\t\t\t<motion.div\n\t\t\t\tvariants={ backdrop }\n\t\t\t\tinitial={ disableMotion ? 'show' : 'hidden' }\n\t\t\t\tanimate=\"show\"\n\t\t\t\texit={ disableMotion ? 'show' : 'exit' }\n\t\t\t\tclassName=\"components-drop-zone__content\"\n\t\t\t>\n\t\t\t\t<motion.div variants={ foreground }>\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={ upload }\n\t\t\t\t\t\tclassName=\"components-drop-zone__content-icon\"\n\t\t\t\t\t/>\n\t\t\t\t\t<span className=\"components-drop-zone__content-text\">\n\t\t\t\t\t\t{ label ? label : __( 'Drop files to upload' ) }\n\t\t\t\t\t</span>\n\t\t\t\t</motion.div>\n\t\t\t</motion.div>\n\t\t);\n\t}\n\n\tconst classes = classnames( 'components-drop-zone', className, {\n\t\t'is-active':\n\t\t\t( isDraggingOverDocument || isDraggingOverElement ) &&\n\t\t\t( ( type === 'file' && onFilesDrop ) ||\n\t\t\t\t( type === 'html' && onHTMLDrop ) ||\n\t\t\t\t( type === 'default' && onDrop ) ),\n\t\t'is-dragging-over-document': isDraggingOverDocument,\n\t\t'is-dragging-over-element': isDraggingOverElement,\n\t\t[ `is-dragging-${ type }` ]: !! type,\n\t} );\n\n\treturn (\n\t\t<div { ...restProps } ref={ ref } className={ classes }>\n\t\t\t{ disableMotion ? (\n\t\t\t\tchildren\n\t\t\t) : (\n\t\t\t\t<AnimatePresence>{ children }</AnimatePresence>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n\nexport default DropZoneComponent;\n"]}