@wordpress/components 19.9.0 → 19.12.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (816) hide show
  1. package/CHANGELOG.md +84 -0
  2. package/CONTRIBUTING.md +80 -7
  3. package/README.md +1 -1
  4. package/build/alignment-matrix-control/index.js +5 -2
  5. package/build/alignment-matrix-control/index.js.map +1 -1
  6. package/build/angle-picker-control/angle-circle.js +5 -7
  7. package/build/angle-picker-control/angle-circle.js.map +1 -1
  8. package/build/autocomplete/autocompleter-ui.js +1 -1
  9. package/build/autocomplete/autocompleter-ui.js.map +1 -1
  10. package/build/autocomplete/autocompleter-ui.native.js +2 -2
  11. package/build/autocomplete/autocompleter-ui.native.js.map +1 -1
  12. package/build/autocomplete/index.js +12 -10
  13. package/build/autocomplete/index.js.map +1 -1
  14. package/build/border-box-control/border-box-control/component.js +22 -7
  15. package/build/border-box-control/border-box-control/component.js.map +1 -1
  16. package/build/border-box-control/border-box-control/hook.js +2 -2
  17. package/build/border-box-control/border-box-control/hook.js.map +1 -1
  18. package/build/border-box-control/border-box-control-linked-button/hook.js +3 -2
  19. package/build/border-box-control/border-box-control-linked-button/hook.js.map +1 -1
  20. package/build/border-box-control/border-box-control-split-controls/component.js +23 -8
  21. package/build/border-box-control/border-box-control-split-controls/component.js.map +1 -1
  22. package/build/border-box-control/border-box-control-split-controls/hook.js +13 -4
  23. package/build/border-box-control/border-box-control-split-controls/hook.js.map +1 -1
  24. package/build/border-box-control/border-box-control-visualizer/hook.js +7 -2
  25. package/build/border-box-control/border-box-control-visualizer/hook.js.map +1 -1
  26. package/build/border-box-control/styles.js +25 -19
  27. package/build/border-box-control/styles.js.map +1 -1
  28. package/build/border-control/border-control/component.js +5 -3
  29. package/build/border-control/border-control/component.js.map +1 -1
  30. package/build/border-control/border-control/hook.js +8 -5
  31. package/build/border-control/border-control/hook.js.map +1 -1
  32. package/build/border-control/border-control-dropdown/component.js +6 -2
  33. package/build/border-control/border-control-dropdown/component.js.map +1 -1
  34. package/build/border-control/border-control-dropdown/hook.js +5 -5
  35. package/build/border-control/border-control-dropdown/hook.js.map +1 -1
  36. package/build/border-control/styles.js +58 -29
  37. package/build/border-control/styles.js.map +1 -1
  38. package/build/box-control/index.js +0 -21
  39. package/build/box-control/index.js.map +1 -1
  40. package/build/box-control/utils.js +1 -8
  41. package/build/box-control/utils.js.map +1 -1
  42. package/build/button/index.js +3 -5
  43. package/build/button/index.js.map +1 -1
  44. package/build/button/index.native.js +16 -2
  45. package/build/button/index.native.js.map +1 -1
  46. package/build/button-group/index.js +24 -7
  47. package/build/button-group/index.js.map +1 -1
  48. package/build/{flyout → button-group}/types.js +0 -0
  49. package/build/button-group/types.js.map +1 -0
  50. package/build/checkbox-control/index.js +34 -7
  51. package/build/checkbox-control/index.js.map +1 -1
  52. package/build/checkbox-control/types.js +6 -0
  53. package/build/checkbox-control/types.js.map +1 -0
  54. package/build/circular-option-picker/index.js +1 -2
  55. package/build/circular-option-picker/index.js.map +1 -1
  56. package/build/color-palette/index.js +14 -14
  57. package/build/color-palette/index.js.map +1 -1
  58. package/build/color-palette/index.native.js +4 -1
  59. package/build/color-palette/index.native.js.map +1 -1
  60. package/build/color-picker/color-copy-button.js +87 -0
  61. package/build/color-picker/color-copy-button.js.map +1 -0
  62. package/build/color-picker/component.js +5 -15
  63. package/build/color-picker/component.js.map +1 -1
  64. package/build/color-picker/hex-input.js +18 -1
  65. package/build/color-picker/hex-input.js.map +1 -1
  66. package/build/color-picker/styles.js +11 -11
  67. package/build/color-picker/styles.js.map +1 -1
  68. package/build/custom-gradient-picker/utils.js +1 -1
  69. package/build/custom-gradient-picker/utils.js.map +1 -1
  70. package/build/date-time/{date.js → date/index.js} +83 -20
  71. package/build/date-time/date/index.js.map +1 -0
  72. package/build/date-time/date/styles.js +70 -0
  73. package/build/date-time/date/styles.js.map +1 -0
  74. package/build/date-time/{utils.js → date/utils.js} +6 -4
  75. package/build/date-time/date/utils.js.map +1 -0
  76. package/build/date-time/date-time/index.js +175 -0
  77. package/build/date-time/date-time/index.js.map +1 -0
  78. package/build/date-time/date-time/styles.js +32 -0
  79. package/build/date-time/date-time/styles.js.map +1 -0
  80. package/build/date-time/index.js +2 -84
  81. package/build/date-time/index.js.map +1 -1
  82. package/build/date-time/time/index.js +322 -0
  83. package/build/date-time/time/index.js.map +1 -0
  84. package/build/date-time/time/styles.js +139 -0
  85. package/build/date-time/time/styles.js.map +1 -0
  86. package/build/date-time/{timezone.js → time/timezone.js} +8 -5
  87. package/build/date-time/time/timezone.js.map +1 -0
  88. package/build/date-time/types.js +6 -0
  89. package/build/date-time/types.js.map +1 -0
  90. package/build/disabled/index.js +4 -76
  91. package/build/disabled/index.js.map +1 -1
  92. package/build/draggable/index.native.js +228 -0
  93. package/build/draggable/index.native.js.map +1 -0
  94. package/build/dropdown/index.js +9 -4
  95. package/build/dropdown/index.js.map +1 -1
  96. package/build/focal-point-picker/index.native.js +3 -3
  97. package/build/focal-point-picker/index.native.js.map +1 -1
  98. package/build/index.js +0 -8
  99. package/build/index.js.map +1 -1
  100. package/build/index.native.js +16 -0
  101. package/build/index.native.js.map +1 -1
  102. package/build/input-control/index.js +12 -6
  103. package/build/input-control/index.js.map +1 -1
  104. package/build/input-control/input-field.js +1 -26
  105. package/build/input-control/input-field.js.map +1 -1
  106. package/build/input-control/reducer/reducer.js +36 -24
  107. package/build/input-control/reducer/reducer.js.map +1 -1
  108. package/build/input-control/reducer/state.js +0 -1
  109. package/build/input-control/reducer/state.js.map +1 -1
  110. package/build/input-control/styles/input-control-styles.js +42 -30
  111. package/build/input-control/styles/input-control-styles.js.map +1 -1
  112. package/build/input-control/utils.js +45 -0
  113. package/build/input-control/utils.js.map +1 -1
  114. package/build/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js +1 -1
  115. package/build/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js.map +1 -1
  116. package/build/mobile/bottom-sheet/index.native.js +1 -1
  117. package/build/mobile/bottom-sheet/index.native.js.map +1 -1
  118. package/build/mobile/bottom-sheet-select-control/index.native.js +4 -2
  119. package/build/mobile/bottom-sheet-select-control/index.native.js.map +1 -1
  120. package/build/mobile/html-text-input/index.native.js +19 -8
  121. package/build/mobile/html-text-input/index.native.js.map +1 -1
  122. package/build/mobile/keyboard-aware-flat-list/index.android.js +28 -5
  123. package/build/mobile/keyboard-aware-flat-list/index.android.js.map +1 -1
  124. package/build/mobile/keyboard-aware-flat-list/index.ios.js +47 -24
  125. package/build/mobile/keyboard-aware-flat-list/index.ios.js.map +1 -1
  126. package/build/palette-edit/index.js +38 -7
  127. package/build/palette-edit/index.js.map +1 -1
  128. package/build/popover/index.js +228 -321
  129. package/build/popover/index.js.map +1 -1
  130. package/build/resizable-box/resize-tooltip/utils.js +5 -8
  131. package/build/resizable-box/resize-tooltip/utils.js.map +1 -1
  132. package/build/sandbox/index.native.js +1 -1
  133. package/build/sandbox/index.native.js.map +1 -1
  134. package/build/search-control/index.js +4 -6
  135. package/build/search-control/index.js.map +1 -1
  136. package/build/select-control/index.js +34 -5
  137. package/build/select-control/index.js.map +1 -1
  138. package/build/select-control/styles/select-control-styles.js +17 -14
  139. package/build/select-control/styles/select-control-styles.js.map +1 -1
  140. package/build/spacer/hook.js +11 -3
  141. package/build/spacer/hook.js.map +1 -1
  142. package/build/surface/component.js +7 -7
  143. package/build/surface/component.js.map +1 -1
  144. package/build/surface/hook.js +8 -11
  145. package/build/surface/hook.js.map +1 -1
  146. package/build/surface/index.js.map +1 -1
  147. package/build/surface/styles.js +8 -48
  148. package/build/surface/styles.js.map +1 -1
  149. package/build/text-control/index.js +35 -28
  150. package/build/text-control/index.js.map +1 -1
  151. package/build/text-control/types.js +6 -0
  152. package/build/text-control/types.js.map +1 -0
  153. package/build/textarea-control/index.js +40 -6
  154. package/build/textarea-control/index.js.map +1 -1
  155. package/build/textarea-control/styles/textarea-control-styles.js +3 -3
  156. package/build/textarea-control/styles/textarea-control-styles.js.map +1 -1
  157. package/build/textarea-control/types.js +6 -0
  158. package/build/textarea-control/types.js.map +1 -0
  159. package/build/toggle-group-control/toggle-group-control/component.js +1 -3
  160. package/build/toggle-group-control/toggle-group-control/component.js.map +1 -1
  161. package/build/toggle-group-control/toggle-group-control-option-icon/component.js +6 -4
  162. package/build/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -1
  163. package/build/tools-panel/tools-panel-header/component.js +52 -36
  164. package/build/tools-panel/tools-panel-header/component.js.map +1 -1
  165. package/build/tooltip/index.js +2 -2
  166. package/build/tooltip/index.js.map +1 -1
  167. package/build/unit-control/index.js +3 -3
  168. package/build/unit-control/index.js.map +1 -1
  169. package/build/unit-control/styles/unit-control-styles.js +11 -20
  170. package/build/unit-control/styles/unit-control-styles.js.map +1 -1
  171. package/build/unit-control/utils.js.map +1 -1
  172. package/build/utils/hooks/index.js +0 -8
  173. package/build/utils/hooks/index.js.map +1 -1
  174. package/build-module/alignment-matrix-control/index.js +5 -2
  175. package/build-module/alignment-matrix-control/index.js.map +1 -1
  176. package/build-module/angle-picker-control/angle-circle.js +5 -7
  177. package/build-module/angle-picker-control/angle-circle.js.map +1 -1
  178. package/build-module/autocomplete/autocompleter-ui.js +1 -1
  179. package/build-module/autocomplete/autocompleter-ui.js.map +1 -1
  180. package/build-module/autocomplete/autocompleter-ui.native.js +2 -2
  181. package/build-module/autocomplete/autocompleter-ui.native.js.map +1 -1
  182. package/build-module/autocomplete/index.js +13 -11
  183. package/build-module/autocomplete/index.js.map +1 -1
  184. package/build-module/border-box-control/border-box-control/component.js +22 -7
  185. package/build-module/border-box-control/border-box-control/component.js.map +1 -1
  186. package/build-module/border-box-control/border-box-control/hook.js +2 -2
  187. package/build-module/border-box-control/border-box-control/hook.js.map +1 -1
  188. package/build-module/border-box-control/border-box-control-linked-button/hook.js +3 -2
  189. package/build-module/border-box-control/border-box-control-linked-button/hook.js.map +1 -1
  190. package/build-module/border-box-control/border-box-control-split-controls/component.js +23 -8
  191. package/build-module/border-box-control/border-box-control-split-controls/component.js.map +1 -1
  192. package/build-module/border-box-control/border-box-control-split-controls/hook.js +11 -4
  193. package/build-module/border-box-control/border-box-control-split-controls/hook.js.map +1 -1
  194. package/build-module/border-box-control/border-box-control-visualizer/hook.js +5 -2
  195. package/build-module/border-box-control/border-box-control-visualizer/hook.js.map +1 -1
  196. package/build-module/border-box-control/styles.js +15 -16
  197. package/build-module/border-box-control/styles.js.map +1 -1
  198. package/build-module/border-control/border-control/component.js +5 -3
  199. package/build-module/border-control/border-control/component.js.map +1 -1
  200. package/build-module/border-control/border-control/hook.js +8 -5
  201. package/build-module/border-control/border-control/hook.js.map +1 -1
  202. package/build-module/border-control/border-control-dropdown/component.js +6 -2
  203. package/build-module/border-control/border-control-dropdown/component.js.map +1 -1
  204. package/build-module/border-control/border-control-dropdown/hook.js +5 -5
  205. package/build-module/border-control/border-control-dropdown/hook.js.map +1 -1
  206. package/build-module/border-control/styles.js +56 -29
  207. package/build-module/border-control/styles.js.map +1 -1
  208. package/build-module/box-control/index.js +1 -20
  209. package/build-module/box-control/index.js.map +1 -1
  210. package/build-module/box-control/utils.js +0 -6
  211. package/build-module/box-control/utils.js.map +1 -1
  212. package/build-module/button/index.js +3 -4
  213. package/build-module/button/index.js.map +1 -1
  214. package/build-module/button/index.native.js +16 -3
  215. package/build-module/button/index.native.js.map +1 -1
  216. package/build-module/button-group/index.js +27 -7
  217. package/build-module/button-group/index.js.map +1 -1
  218. package/build-module/{flyout → button-group}/types.js +0 -0
  219. package/build-module/{flyout → button-group}/types.js.map +0 -0
  220. package/build-module/checkbox-control/index.js +31 -7
  221. package/build-module/checkbox-control/index.js.map +1 -1
  222. package/build-module/checkbox-control/types.js +2 -0
  223. package/{build/flyout → build-module/checkbox-control}/types.js.map +0 -0
  224. package/build-module/circular-option-picker/index.js +1 -2
  225. package/build-module/circular-option-picker/index.js.map +1 -1
  226. package/build-module/color-palette/index.js +12 -16
  227. package/build-module/color-palette/index.js.map +1 -1
  228. package/build-module/color-palette/index.native.js +4 -1
  229. package/build-module/color-palette/index.native.js.map +1 -1
  230. package/build-module/color-picker/color-copy-button.js +73 -0
  231. package/build-module/color-picker/color-copy-button.js.map +1 -0
  232. package/build-module/color-picker/component.js +6 -15
  233. package/build-module/color-picker/component.js.map +1 -1
  234. package/build-module/color-picker/hex-input.js +18 -1
  235. package/build-module/color-picker/hex-input.js.map +1 -1
  236. package/build-module/color-picker/styles.js +9 -9
  237. package/build-module/color-picker/styles.js.map +1 -1
  238. package/build-module/custom-gradient-picker/utils.js +1 -1
  239. package/build-module/custom-gradient-picker/utils.js.map +1 -1
  240. package/build-module/date-time/{date.js → date/index.js} +79 -22
  241. package/build-module/date-time/date/index.js.map +1 -0
  242. package/build-module/date-time/date/styles.js +61 -0
  243. package/build-module/date-time/date/styles.js.map +1 -0
  244. package/build-module/date-time/date/utils.js +22 -0
  245. package/build-module/date-time/date/utils.js.map +1 -0
  246. package/build-module/date-time/date-time/index.js +144 -0
  247. package/build-module/date-time/date-time/index.js.map +1 -0
  248. package/build-module/date-time/date-time/styles.js +22 -0
  249. package/build-module/date-time/date-time/styles.js.map +1 -0
  250. package/build-module/date-time/index.js +2 -82
  251. package/build-module/date-time/index.js.map +1 -1
  252. package/build-module/date-time/time/index.js +302 -0
  253. package/build-module/date-time/time/index.js.map +1 -0
  254. package/build-module/date-time/time/styles.js +118 -0
  255. package/build-module/date-time/time/styles.js.map +1 -0
  256. package/build-module/date-time/{timezone.js → time/timezone.js} +7 -5
  257. package/build-module/date-time/time/timezone.js.map +1 -0
  258. package/build-module/date-time/types.js +2 -0
  259. package/build-module/date-time/types.js.map +1 -0
  260. package/build-module/disabled/index.js +5 -76
  261. package/build-module/disabled/index.js.map +1 -1
  262. package/build-module/draggable/index.native.js +211 -0
  263. package/build-module/draggable/index.native.js.map +1 -0
  264. package/build-module/dropdown/index.js +9 -4
  265. package/build-module/dropdown/index.js.map +1 -1
  266. package/build-module/focal-point-picker/index.native.js +3 -3
  267. package/build-module/focal-point-picker/index.native.js.map +1 -1
  268. package/build-module/index.js +0 -1
  269. package/build-module/index.js.map +1 -1
  270. package/build-module/index.native.js +2 -1
  271. package/build-module/index.native.js.map +1 -1
  272. package/build-module/input-control/index.js +11 -6
  273. package/build-module/input-control/index.js.map +1 -1
  274. package/build-module/input-control/input-field.js +1 -25
  275. package/build-module/input-control/input-field.js.map +1 -1
  276. package/build-module/input-control/reducer/reducer.js +38 -26
  277. package/build-module/input-control/reducer/reducer.js.map +1 -1
  278. package/build-module/input-control/reducer/state.js +0 -1
  279. package/build-module/input-control/reducer/state.js.map +1 -1
  280. package/build-module/input-control/styles/input-control-styles.js +42 -30
  281. package/build-module/input-control/styles/input-control-styles.js.map +1 -1
  282. package/build-module/input-control/utils.js +48 -2
  283. package/build-module/input-control/utils.js.map +1 -1
  284. package/build-module/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js +1 -1
  285. package/build-module/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js.map +1 -1
  286. package/build-module/mobile/bottom-sheet/index.native.js +1 -1
  287. package/build-module/mobile/bottom-sheet/index.native.js.map +1 -1
  288. package/build-module/mobile/bottom-sheet-select-control/index.native.js +4 -2
  289. package/build-module/mobile/bottom-sheet-select-control/index.native.js.map +1 -1
  290. package/build-module/mobile/html-text-input/index.native.js +20 -9
  291. package/build-module/mobile/html-text-input/index.native.js.map +1 -1
  292. package/build-module/mobile/keyboard-aware-flat-list/index.android.js +21 -5
  293. package/build-module/mobile/keyboard-aware-flat-list/index.android.js.map +1 -1
  294. package/build-module/mobile/keyboard-aware-flat-list/index.ios.js +42 -25
  295. package/build-module/mobile/keyboard-aware-flat-list/index.ios.js.map +1 -1
  296. package/build-module/palette-edit/index.js +37 -7
  297. package/build-module/palette-edit/index.js.map +1 -1
  298. package/build-module/popover/index.js +230 -323
  299. package/build-module/popover/index.js.map +1 -1
  300. package/build-module/resizable-box/resize-tooltip/utils.js +4 -5
  301. package/build-module/resizable-box/resize-tooltip/utils.js.map +1 -1
  302. package/build-module/sandbox/index.native.js +1 -1
  303. package/build-module/sandbox/index.native.js.map +1 -1
  304. package/build-module/search-control/index.js +6 -7
  305. package/build-module/search-control/index.js.map +1 -1
  306. package/build-module/select-control/index.js +32 -4
  307. package/build-module/select-control/index.js.map +1 -1
  308. package/build-module/select-control/styles/select-control-styles.js +17 -14
  309. package/build-module/select-control/styles/select-control-styles.js.map +1 -1
  310. package/build-module/spacer/hook.js +10 -2
  311. package/build-module/spacer/hook.js.map +1 -1
  312. package/build-module/surface/component.js +7 -7
  313. package/build-module/surface/component.js.map +1 -1
  314. package/build-module/surface/hook.js +8 -11
  315. package/build-module/surface/hook.js.map +1 -1
  316. package/build-module/surface/index.js.map +1 -1
  317. package/build-module/surface/styles.js +8 -48
  318. package/build-module/surface/styles.js.map +1 -1
  319. package/build-module/text-control/index.js +35 -27
  320. package/build-module/text-control/index.js.map +1 -1
  321. package/build-module/text-control/types.js +2 -0
  322. package/build-module/text-control/types.js.map +1 -0
  323. package/build-module/textarea-control/index.js +36 -5
  324. package/build-module/textarea-control/index.js.map +1 -1
  325. package/build-module/textarea-control/styles/textarea-control-styles.js +3 -3
  326. package/build-module/textarea-control/styles/textarea-control-styles.js.map +1 -1
  327. package/build-module/textarea-control/types.js +2 -0
  328. package/build-module/textarea-control/types.js.map +1 -0
  329. package/build-module/toggle-group-control/toggle-group-control/component.js +2 -3
  330. package/build-module/toggle-group-control/toggle-group-control/component.js.map +1 -1
  331. package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js +1 -5
  332. package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -1
  333. package/build-module/tools-panel/tools-panel-header/component.js +51 -36
  334. package/build-module/tools-panel/tools-panel-header/component.js.map +1 -1
  335. package/build-module/tooltip/index.js +2 -2
  336. package/build-module/tooltip/index.js.map +1 -1
  337. package/build-module/unit-control/index.js +3 -3
  338. package/build-module/unit-control/index.js.map +1 -1
  339. package/build-module/unit-control/styles/unit-control-styles.js +11 -20
  340. package/build-module/unit-control/styles/unit-control-styles.js.map +1 -1
  341. package/build-module/unit-control/utils.js.map +1 -1
  342. package/build-module/utils/hooks/index.js +0 -1
  343. package/build-module/utils/hooks/index.js.map +1 -1
  344. package/build-style/style-rtl.css +51 -358
  345. package/build-style/style.css +47 -361
  346. package/build-types/border-box-control/border-box-control/component.d.ts.map +1 -1
  347. package/build-types/border-box-control/border-box-control/hook.d.ts +3 -1
  348. package/build-types/border-box-control/border-box-control/hook.d.ts.map +1 -1
  349. package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts.map +1 -1
  350. package/build-types/border-box-control/border-box-control-split-controls/component.d.ts.map +1 -1
  351. package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts +4 -1
  352. package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts.map +1 -1
  353. package/build-types/border-box-control/border-box-control-visualizer/hook.d.ts.map +1 -1
  354. package/build-types/border-box-control/styles.d.ts +4 -3
  355. package/build-types/border-box-control/styles.d.ts.map +1 -1
  356. package/build-types/border-box-control/types.d.ts +40 -13
  357. package/build-types/border-box-control/types.d.ts.map +1 -1
  358. package/build-types/border-control/border-control/component.d.ts.map +1 -1
  359. package/build-types/border-control/border-control/hook.d.ts +2 -1
  360. package/build-types/border-control/border-control/hook.d.ts.map +1 -1
  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 +1 -0
  363. package/build-types/border-control/border-control-dropdown/hook.d.ts.map +1 -1
  364. package/build-types/border-control/styles.d.ts +2 -1
  365. package/build-types/border-control/styles.d.ts.map +1 -1
  366. package/build-types/border-control/types.d.ts +18 -6
  367. package/build-types/border-control/types.d.ts.map +1 -1
  368. package/build-types/button/index.d.ts.map +1 -1
  369. package/build-types/button-group/index.d.ts +25 -0
  370. package/build-types/button-group/index.d.ts.map +1 -0
  371. package/build-types/button-group/stories/index.d.ts +12 -0
  372. package/build-types/button-group/stories/index.d.ts.map +1 -0
  373. package/build-types/button-group/types.d.ts +11 -0
  374. package/build-types/button-group/types.d.ts.map +1 -0
  375. package/build-types/card/types.d.ts +1 -1
  376. package/build-types/card/types.d.ts.map +1 -1
  377. package/build-types/checkbox-control/index.d.ts +26 -0
  378. package/build-types/checkbox-control/index.d.ts.map +1 -0
  379. package/build-types/checkbox-control/stories/index.d.ts +13 -0
  380. package/build-types/checkbox-control/stories/index.d.ts.map +1 -0
  381. package/build-types/checkbox-control/test/index.d.ts +2 -0
  382. package/build-types/checkbox-control/test/index.d.ts.map +1 -0
  383. package/build-types/checkbox-control/types.d.ts +35 -0
  384. package/build-types/checkbox-control/types.d.ts.map +1 -0
  385. package/build-types/circular-option-picker/index.d.ts.map +1 -1
  386. package/build-types/color-palette/index.d.ts +1 -0
  387. package/build-types/color-palette/index.d.ts.map +1 -1
  388. package/build-types/color-palette/test/utils.d.ts +2 -0
  389. package/build-types/color-palette/test/utils.d.ts.map +1 -0
  390. package/build-types/color-picker/color-copy-button.d.ts +4 -0
  391. package/build-types/color-picker/color-copy-button.d.ts.map +1 -0
  392. package/build-types/color-picker/component.d.ts.map +1 -1
  393. package/build-types/color-picker/hex-input.d.ts.map +1 -1
  394. package/build-types/color-picker/styles.d.ts +4 -4
  395. package/build-types/color-picker/styles.d.ts.map +1 -1
  396. package/build-types/color-picker/types.d.ts +8 -0
  397. package/build-types/color-picker/types.d.ts.map +1 -1
  398. package/build-types/date-time/date/index.d.ts +25 -0
  399. package/build-types/date-time/date/index.d.ts.map +1 -0
  400. package/build-types/date-time/date/styles.d.ts +23 -0
  401. package/build-types/date-time/date/styles.d.ts.map +1 -0
  402. package/build-types/date-time/date/test/index.d.ts +2 -0
  403. package/build-types/date-time/date/test/index.d.ts.map +1 -0
  404. package/build-types/date-time/date/test/utils.d.ts +2 -0
  405. package/build-types/date-time/date/test/utils.d.ts.map +1 -0
  406. package/build-types/date-time/date/utils.d.ts +15 -0
  407. package/build-types/date-time/date/utils.d.ts.map +1 -0
  408. package/build-types/date-time/date-time/index.d.ts +33 -0
  409. package/build-types/date-time/date-time/index.d.ts.map +1 -0
  410. package/build-types/date-time/date-time/styles.d.ts +6 -0
  411. package/build-types/date-time/date-time/styles.d.ts.map +1 -0
  412. package/build-types/date-time/index.d.ts +9 -0
  413. package/build-types/date-time/index.d.ts.map +1 -0
  414. package/build-types/date-time/stories/date-time.d.ts +14 -0
  415. package/build-types/date-time/stories/date-time.d.ts.map +1 -0
  416. package/build-types/date-time/stories/date.d.ts +14 -0
  417. package/build-types/date-time/stories/date.d.ts.map +1 -0
  418. package/build-types/date-time/stories/time.d.ts +12 -0
  419. package/build-types/date-time/stories/time.d.ts.map +1 -0
  420. package/build-types/date-time/stories/utils.d.ts +3 -0
  421. package/build-types/date-time/stories/utils.d.ts.map +1 -0
  422. package/build-types/date-time/time/index.d.ts +25 -0
  423. package/build-types/date-time/time/index.d.ts.map +1 -0
  424. package/build-types/date-time/time/styles.d.ts +111 -0
  425. package/build-types/date-time/time/styles.d.ts.map +1 -0
  426. package/build-types/date-time/time/test/index.d.ts +2 -0
  427. package/build-types/date-time/time/test/index.d.ts.map +1 -0
  428. package/build-types/date-time/time/timezone.d.ts +8 -0
  429. package/build-types/date-time/time/timezone.d.ts.map +1 -0
  430. package/build-types/date-time/types.d.ts +90 -0
  431. package/build-types/date-time/types.d.ts.map +1 -0
  432. package/build-types/disabled/index.d.ts.map +1 -1
  433. package/build-types/dropdown/index.d.ts.map +1 -1
  434. package/build-types/input-control/index.d.ts +4 -3
  435. package/build-types/input-control/index.d.ts.map +1 -1
  436. package/build-types/input-control/input-field.d.ts.map +1 -1
  437. package/build-types/input-control/reducer/reducer.d.ts +5 -3
  438. package/build-types/input-control/reducer/reducer.d.ts.map +1 -1
  439. package/build-types/input-control/reducer/state.d.ts +2 -2
  440. package/build-types/input-control/reducer/state.d.ts.map +1 -1
  441. package/build-types/input-control/stories/index.d.ts +5 -5
  442. package/build-types/input-control/stories/index.d.ts.map +1 -1
  443. package/build-types/input-control/styles/input-control-styles.d.ts +1 -0
  444. package/build-types/input-control/styles/input-control-styles.d.ts.map +1 -1
  445. package/build-types/input-control/types.d.ts +6 -0
  446. package/build-types/input-control/types.d.ts.map +1 -1
  447. package/build-types/input-control/utils.d.ts +17 -0
  448. package/build-types/input-control/utils.d.ts.map +1 -1
  449. package/build-types/number-control/styles/number-control-styles.d.ts +1 -1
  450. package/build-types/popover/index.d.ts +6 -8
  451. package/build-types/popover/index.d.ts.map +1 -1
  452. package/build-types/resizable-box/index.d.ts +1 -1
  453. package/build-types/resizable-box/resize-tooltip/index.d.ts +1 -1
  454. package/build-types/resizable-box/resize-tooltip/utils.d.ts.map +1 -1
  455. package/build-types/select-control/index.d.ts +30 -26
  456. package/build-types/select-control/index.d.ts.map +1 -1
  457. package/build-types/select-control/stories/index.d.ts +23 -0
  458. package/build-types/select-control/stories/index.d.ts.map +1 -0
  459. package/build-types/select-control/styles/select-control-styles.d.ts +3 -4
  460. package/build-types/select-control/styles/select-control-styles.d.ts.map +1 -1
  461. package/build-types/select-control/test/select-control.d.ts +2 -0
  462. package/build-types/select-control/test/select-control.d.ts.map +1 -0
  463. package/build-types/select-control/types.d.ts +52 -1
  464. package/build-types/select-control/types.d.ts.map +1 -1
  465. package/build-types/surface/component.d.ts +3 -2
  466. package/build-types/surface/component.d.ts.map +1 -1
  467. package/build-types/surface/hook.d.ts +4 -4
  468. package/build-types/surface/hook.d.ts.map +1 -1
  469. package/build-types/surface/index.d.ts +2 -2
  470. package/build-types/surface/index.d.ts.map +1 -1
  471. package/build-types/surface/stories/index.d.ts +12 -0
  472. package/build-types/surface/stories/index.d.ts.map +1 -0
  473. package/build-types/surface/styles.d.ts +10 -21
  474. package/build-types/surface/styles.d.ts.map +1 -1
  475. package/build-types/surface/test/index.d.ts +2 -0
  476. package/build-types/{flyout/flyout → surface/test}/index.d.ts.map +1 -1
  477. package/build-types/surface/types.d.ts +1 -1
  478. package/build-types/surface/types.d.ts.map +1 -1
  479. package/build-types/text-control/index.d.ts +32 -0
  480. package/build-types/text-control/index.d.ts.map +1 -0
  481. package/build-types/text-control/stories/index.d.ts +13 -0
  482. package/build-types/text-control/stories/index.d.ts.map +1 -0
  483. package/build-types/text-control/types.d.ts +25 -0
  484. package/build-types/text-control/types.d.ts.map +1 -0
  485. package/build-types/textarea-control/index.d.ts +29 -0
  486. package/build-types/textarea-control/index.d.ts.map +1 -0
  487. package/build-types/textarea-control/stories/index.d.ts +12 -0
  488. package/build-types/textarea-control/stories/index.d.ts.map +1 -0
  489. package/build-types/textarea-control/styles/textarea-control-styles.d.ts +6 -0
  490. package/build-types/textarea-control/styles/textarea-control-styles.d.ts.map +1 -0
  491. package/build-types/textarea-control/types.d.ts +26 -0
  492. package/build-types/textarea-control/types.d.ts.map +1 -0
  493. package/build-types/toggle-group-control/toggle-group-control/component.d.ts.map +1 -1
  494. package/build-types/toggle-group-control/toggle-group-control-option-icon/component.d.ts.map +1 -1
  495. package/build-types/tools-panel/tools-panel-header/component.d.ts.map +1 -1
  496. package/build-types/tools-panel/types.d.ts +0 -1
  497. package/build-types/tools-panel/types.d.ts.map +1 -1
  498. package/build-types/tooltip/index.d.ts.map +1 -1
  499. package/build-types/unit-control/index.d.ts +2 -2
  500. package/build-types/unit-control/index.d.ts.map +1 -1
  501. package/build-types/unit-control/styles/unit-control-styles.d.ts.map +1 -1
  502. package/build-types/unit-control/test/index.d.ts +2 -0
  503. package/build-types/unit-control/test/index.d.ts.map +1 -0
  504. package/build-types/unit-control/test/utils.d.ts +2 -0
  505. package/build-types/unit-control/test/utils.d.ts.map +1 -0
  506. package/build-types/unit-control/types.d.ts +1 -1
  507. package/build-types/unit-control/types.d.ts.map +1 -1
  508. package/build-types/unit-control/utils.d.ts +3 -3
  509. package/build-types/unit-control/utils.d.ts.map +1 -1
  510. package/build-types/utils/hooks/index.d.ts +0 -1
  511. package/package.json +20 -20
  512. package/src/alignment-matrix-control/index.js +4 -2
  513. package/src/angle-picker-control/angle-circle.js +3 -3
  514. package/src/autocomplete/autocompleter-ui.js +1 -1
  515. package/src/autocomplete/autocompleter-ui.native.js +2 -2
  516. package/src/autocomplete/index.js +21 -9
  517. package/src/autocomplete/style.scss +1 -1
  518. package/src/border-box-control/border-box-control/README.md +10 -14
  519. package/src/border-box-control/border-box-control/component.tsx +21 -4
  520. package/src/border-box-control/border-box-control/hook.ts +2 -2
  521. package/src/border-box-control/border-box-control-linked-button/hook.ts +10 -6
  522. package/src/border-box-control/border-box-control-split-controls/component.tsx +26 -7
  523. package/src/border-box-control/border-box-control-split-controls/hook.ts +18 -4
  524. package/src/border-box-control/border-box-control-visualizer/hook.ts +14 -6
  525. package/src/border-box-control/stories/index.js +1 -0
  526. package/src/border-box-control/styles.ts +20 -9
  527. package/src/border-box-control/types.ts +40 -14
  528. package/src/border-control/border-control/README.md +0 -7
  529. package/src/border-control/border-control/component.tsx +4 -2
  530. package/src/border-control/border-control/hook.ts +13 -4
  531. package/src/border-control/border-control-dropdown/component.tsx +18 -11
  532. package/src/border-control/border-control-dropdown/hook.ts +7 -5
  533. package/src/border-control/stories/index.js +1 -0
  534. package/src/border-control/styles.ts +82 -22
  535. package/src/border-control/types.ts +18 -6
  536. package/src/box-control/README.md +0 -74
  537. package/src/box-control/index.js +0 -15
  538. package/src/box-control/stories/index.js +0 -29
  539. package/src/box-control/test/index.js +120 -109
  540. package/src/box-control/utils.js +0 -7
  541. package/src/button/index.js +2 -4
  542. package/src/button/index.native.js +33 -18
  543. package/src/button/test/index.js +16 -1
  544. package/src/button-group/index.tsx +47 -0
  545. package/src/button-group/stories/index.tsx +41 -0
  546. package/src/button-group/types.ts +11 -0
  547. package/src/card/types.ts +1 -1
  548. package/src/checkbox-control/README.md +10 -8
  549. package/src/checkbox-control/{index.js → index.tsx} +49 -14
  550. package/src/checkbox-control/stories/{index.js → index.tsx} +49 -27
  551. package/src/checkbox-control/test/__snapshots__/index.tsx.snap +42 -0
  552. package/src/checkbox-control/test/index.tsx +109 -0
  553. package/src/checkbox-control/types.ts +36 -0
  554. package/src/circular-option-picker/index.js +1 -2
  555. package/src/circular-option-picker/style.scss +1 -0
  556. package/src/color-palette/README.md +0 -1
  557. package/src/color-palette/index.js +17 -17
  558. package/src/color-palette/index.native.js +3 -0
  559. package/src/color-palette/stories/index.js +25 -1
  560. package/src/color-palette/style.scss +3 -18
  561. package/src/color-palette/test/__snapshots__/index.js.snap +2 -3
  562. package/src/color-palette/test/utils.ts +24 -0
  563. package/src/color-picker/color-copy-button.tsx +76 -0
  564. package/src/color-picker/component.tsx +18 -38
  565. package/src/color-picker/hex-input.tsx +16 -0
  566. package/src/color-picker/styles.ts +5 -1
  567. package/src/color-picker/types.ts +9 -0
  568. package/src/confirm-dialog/stories/index.js +87 -99
  569. package/src/custom-gradient-picker/utils.js +1 -1
  570. package/src/date-time/README.md +29 -10
  571. package/src/date-time/{datepicker.scss → date/datepicker.scss} +0 -0
  572. package/src/date-time/{date.js → date/index.tsx} +76 -24
  573. package/src/date-time/date/style.scss +75 -0
  574. package/src/date-time/date/styles.ts +55 -0
  575. package/src/date-time/date/test/index.tsx +127 -0
  576. package/src/date-time/{test/utils.js → date/test/utils.ts} +1 -1
  577. package/src/date-time/date/utils.ts +20 -0
  578. package/src/date-time/date-time/index.tsx +217 -0
  579. package/src/date-time/date-time/styles.ts +8 -0
  580. package/src/date-time/index.ts +9 -0
  581. package/src/date-time/stories/date-time.tsx +75 -0
  582. package/src/date-time/stories/date.tsx +73 -0
  583. package/src/date-time/stories/time.tsx +51 -0
  584. package/src/date-time/stories/utils.ts +9 -0
  585. package/src/date-time/style.scss +1 -262
  586. package/src/date-time/time/index.tsx +356 -0
  587. package/src/date-time/time/styles.ts +119 -0
  588. package/src/date-time/{test/time.js → time/test/index.tsx} +119 -57
  589. package/src/date-time/{timezone.js → time/timezone.tsx} +9 -5
  590. package/src/date-time/types.ts +104 -0
  591. package/src/dimension-control/test/__snapshots__/index.test.js.snap +4 -4
  592. package/src/disabled/index.js +5 -90
  593. package/src/draggable/index.native.js +226 -0
  594. package/src/draggable/style.native.scss +3 -0
  595. package/src/draggable/test/index.native.js +130 -0
  596. package/src/dropdown/index.js +12 -3
  597. package/src/dropdown/style.scss +1 -1
  598. package/src/focal-point-picker/index.native.js +3 -3
  599. package/src/form-file-upload/test/index.js +20 -13
  600. package/src/index.js +0 -1
  601. package/src/index.native.js +1 -0
  602. package/src/input-control/README.md +1 -1
  603. package/src/input-control/index.tsx +11 -4
  604. package/src/input-control/input-field.tsx +10 -30
  605. package/src/input-control/reducer/reducer.ts +40 -26
  606. package/src/input-control/reducer/state.ts +2 -3
  607. package/src/input-control/stories/index.tsx +1 -1
  608. package/src/input-control/styles/input-control-styles.tsx +19 -5
  609. package/src/input-control/types.ts +6 -0
  610. package/src/input-control/utils.ts +55 -1
  611. package/src/item-group/stories/index.js +22 -18
  612. package/src/menu-item/style.scss +10 -0
  613. package/src/mobile/bottom-sheet/bottom-sheet-navigation/navigation-screen.native.js +1 -1
  614. package/src/mobile/bottom-sheet/bottom-sheet-navigation/test/navigation-container.native.js +9 -2
  615. package/src/mobile/bottom-sheet/index.native.js +1 -1
  616. package/src/mobile/bottom-sheet-select-control/index.native.js +8 -2
  617. package/src/mobile/html-text-input/index.native.js +45 -29
  618. package/src/mobile/html-text-input/style.android.scss +2 -15
  619. package/src/mobile/html-text-input/style.ios.scss +2 -15
  620. package/src/mobile/html-text-input/{style-common.native.scss → style.scss} +16 -0
  621. package/src/mobile/keyboard-aware-flat-list/index.android.js +15 -5
  622. package/src/mobile/keyboard-aware-flat-list/index.ios.js +75 -46
  623. package/src/mobile/link-settings/test/link-settings-navigation.native.js +9 -1
  624. package/src/navigator/stories/index.js +16 -10
  625. package/src/palette-edit/index.js +37 -9
  626. package/src/palette-edit/style.scss +0 -7
  627. package/src/palette-edit/test/index.js +63 -0
  628. package/src/panel/README.md +1 -1
  629. package/src/placeholder/test/index.js +7 -0
  630. package/src/popover/README.md +7 -9
  631. package/src/popover/index.js +256 -416
  632. package/src/popover/style.scss +20 -190
  633. package/src/popover/test/__snapshots__/index.js.snap +6 -18
  634. package/src/query-controls/README.md +1 -1
  635. package/src/resizable-box/resize-tooltip/utils.ts +4 -5
  636. package/src/sandbox/index.native.js +1 -1
  637. package/src/search-control/index.js +6 -7
  638. package/src/select-control/README.md +13 -2
  639. package/src/select-control/index.tsx +36 -30
  640. package/src/select-control/stories/index.tsx +90 -0
  641. package/src/select-control/styles/select-control-styles.ts +15 -11
  642. package/src/select-control/test/{select-control.js → select-control.tsx} +2 -2
  643. package/src/select-control/types.ts +66 -1
  644. package/src/slot-fill/README.md +1 -1
  645. package/src/spacer/hook.ts +13 -13
  646. package/src/surface/README.md +15 -15
  647. package/src/surface/{component.js → component.tsx} +13 -7
  648. package/src/surface/{hook.js → hook.ts} +13 -12
  649. package/src/surface/{index.js → index.ts} +0 -0
  650. package/src/surface/stories/index.tsx +40 -0
  651. package/src/surface/{styles.js → styles.ts} +15 -44
  652. package/src/surface/test/__snapshots__/{index.js.snap → index.tsx.snap} +0 -0
  653. package/src/surface/test/{index.js → index.tsx} +2 -1
  654. package/src/surface/types.ts +1 -1
  655. package/src/tab-panel/style.scss +1 -1
  656. package/src/text-control/index.tsx +84 -0
  657. package/src/text-control/stories/index.tsx +66 -0
  658. package/src/text-control/types.ts +29 -0
  659. package/src/textarea-control/README.md +14 -20
  660. package/src/textarea-control/index.tsx +86 -0
  661. package/src/textarea-control/stories/index.tsx +58 -0
  662. package/src/textarea-control/styles/{textarea-control-styles.js → textarea-control-styles.ts} +0 -0
  663. package/src/textarea-control/types.ts +30 -0
  664. package/src/toggle-group-control/test/__snapshots__/index.js.snap +4 -10
  665. package/src/toggle-group-control/toggle-group-control/component.tsx +7 -3
  666. package/src/toggle-group-control/toggle-group-control-option-icon/component.tsx +1 -5
  667. package/src/tools-panel/test/__snapshots__/index.js.snap +1 -1
  668. package/src/tools-panel/test/index.js +71 -18
  669. package/src/tools-panel/tools-panel-header/component.tsx +75 -33
  670. package/src/tools-panel/types.ts +0 -1
  671. package/src/tooltip/index.js +8 -2
  672. package/src/tooltip/style.scss +2 -4
  673. package/src/tooltip/test/index.js +6 -0
  674. package/src/tooltip/test/index.native.js +1 -1
  675. package/src/unit-control/index.tsx +2 -5
  676. package/src/unit-control/styles/unit-control-styles.ts +3 -13
  677. package/src/unit-control/test/__snapshots__/index.tsx.snap +33 -0
  678. package/src/unit-control/test/{index.js → index.tsx} +295 -166
  679. package/src/unit-control/test/{utils.js → utils.ts} +38 -19
  680. package/src/unit-control/types.ts +4 -1
  681. package/src/unit-control/utils.ts +5 -3
  682. package/src/utils/hooks/index.js +0 -1
  683. package/tsconfig.json +7 -1
  684. package/tsconfig.tsbuildinfo +1 -1
  685. package/build/box-control/visualizer.js +0 -165
  686. package/build/box-control/visualizer.js.map +0 -1
  687. package/build/color-picker/color-display.js +0 -184
  688. package/build/color-picker/color-display.js.map +0 -1
  689. package/build/date-time/date.js.map +0 -1
  690. package/build/date-time/time.js +0 -287
  691. package/build/date-time/time.js.map +0 -1
  692. package/build/date-time/timezone.js.map +0 -1
  693. package/build/date-time/utils.js.map +0 -1
  694. package/build/flyout/context.js +0 -23
  695. package/build/flyout/context.js.map +0 -1
  696. package/build/flyout/flyout/component.js +0 -106
  697. package/build/flyout/flyout/component.js.map +0 -1
  698. package/build/flyout/flyout/hook.js +0 -53
  699. package/build/flyout/flyout/hook.js.map +0 -1
  700. package/build/flyout/flyout/index.js +0 -24
  701. package/build/flyout/flyout/index.js.map +0 -1
  702. package/build/flyout/flyout-content/component.js +0 -65
  703. package/build/flyout/flyout-content/component.js.map +0 -1
  704. package/build/flyout/flyout-content/index.js +0 -16
  705. package/build/flyout/flyout-content/index.js.map +0 -1
  706. package/build/flyout/index.js +0 -16
  707. package/build/flyout/index.js.map +0 -1
  708. package/build/flyout/styles.js +0 -46
  709. package/build/flyout/styles.js.map +0 -1
  710. package/build/flyout/utils.js +0 -36
  711. package/build/flyout/utils.js.map +0 -1
  712. package/build/mobile/html-text-input/container.android.js +0 -41
  713. package/build/mobile/html-text-input/container.android.js.map +0 -1
  714. package/build/mobile/html-text-input/container.ios.js +0 -60
  715. package/build/mobile/html-text-input/container.ios.js.map +0 -1
  716. package/build/popover/utils.js +0 -322
  717. package/build/popover/utils.js.map +0 -1
  718. package/build/utils/hooks/use-combined-ref.js +0 -32
  719. package/build/utils/hooks/use-combined-ref.js.map +0 -1
  720. package/build-module/box-control/visualizer.js +0 -154
  721. package/build-module/box-control/visualizer.js.map +0 -1
  722. package/build-module/color-picker/color-display.js +0 -170
  723. package/build-module/color-picker/color-display.js.map +0 -1
  724. package/build-module/date-time/date.js.map +0 -1
  725. package/build-module/date-time/time.js +0 -269
  726. package/build-module/date-time/time.js.map +0 -1
  727. package/build-module/date-time/timezone.js.map +0 -1
  728. package/build-module/date-time/utils.js +0 -20
  729. package/build-module/date-time/utils.js.map +0 -1
  730. package/build-module/flyout/context.js +0 -11
  731. package/build-module/flyout/context.js.map +0 -1
  732. package/build-module/flyout/flyout/component.js +0 -89
  733. package/build-module/flyout/flyout/component.js.map +0 -1
  734. package/build-module/flyout/flyout/hook.js +0 -44
  735. package/build-module/flyout/flyout/hook.js.map +0 -1
  736. package/build-module/flyout/flyout/index.js +0 -3
  737. package/build-module/flyout/flyout/index.js.map +0 -1
  738. package/build-module/flyout/flyout-content/component.js +0 -51
  739. package/build-module/flyout/flyout-content/component.js.map +0 -1
  740. package/build-module/flyout/flyout-content/index.js +0 -2
  741. package/build-module/flyout/flyout-content/index.js.map +0 -1
  742. package/build-module/flyout/index.js +0 -2
  743. package/build-module/flyout/index.js.map +0 -1
  744. package/build-module/flyout/styles.js +0 -27
  745. package/build-module/flyout/styles.js.map +0 -1
  746. package/build-module/flyout/utils.js +0 -25
  747. package/build-module/flyout/utils.js.map +0 -1
  748. package/build-module/mobile/html-text-input/container.android.js +0 -29
  749. package/build-module/mobile/html-text-input/container.android.js.map +0 -1
  750. package/build-module/mobile/html-text-input/container.ios.js +0 -48
  751. package/build-module/mobile/html-text-input/container.ios.js.map +0 -1
  752. package/build-module/popover/utils.js +0 -308
  753. package/build-module/popover/utils.js.map +0 -1
  754. package/build-module/utils/hooks/use-combined-ref.js +0 -28
  755. package/build-module/utils/hooks/use-combined-ref.js.map +0 -1
  756. package/build-types/color-picker/color-display.d.ts +0 -14
  757. package/build-types/color-picker/color-display.d.ts.map +0 -1
  758. package/build-types/flyout/context.d.ts +0 -6
  759. package/build-types/flyout/context.d.ts.map +0 -1
  760. package/build-types/flyout/flyout/component.d.ts +0 -21
  761. package/build-types/flyout/flyout/component.d.ts.map +0 -1
  762. package/build-types/flyout/flyout/hook.d.ts +0 -270
  763. package/build-types/flyout/flyout/hook.d.ts.map +0 -1
  764. package/build-types/flyout/flyout/index.d.ts +0 -3
  765. package/build-types/flyout/flyout-content/component.d.ts +0 -3
  766. package/build-types/flyout/flyout-content/component.d.ts.map +0 -1
  767. package/build-types/flyout/flyout-content/index.d.ts +0 -2
  768. package/build-types/flyout/flyout-content/index.d.ts.map +0 -1
  769. package/build-types/flyout/index.d.ts +0 -2
  770. package/build-types/flyout/index.d.ts.map +0 -1
  771. package/build-types/flyout/styles.d.ts +0 -22
  772. package/build-types/flyout/styles.d.ts.map +0 -1
  773. package/build-types/flyout/types.d.ts +0 -80
  774. package/build-types/flyout/types.d.ts.map +0 -1
  775. package/build-types/flyout/utils.d.ts +0 -8
  776. package/build-types/flyout/utils.d.ts.map +0 -1
  777. package/build-types/popover/utils.d.ts +0 -70
  778. package/build-types/popover/utils.d.ts.map +0 -1
  779. package/build-types/utils/hooks/use-combined-ref.d.ts +0 -8
  780. package/build-types/utils/hooks/use-combined-ref.d.ts.map +0 -1
  781. package/src/box-control/visualizer.js +0 -116
  782. package/src/button-group/index.js +0 -17
  783. package/src/button-group/stories/index.js +0 -21
  784. package/src/color-picker/color-display.tsx +0 -169
  785. package/src/date-time/index.js +0 -170
  786. package/src/date-time/stories/date.js +0 -17
  787. package/src/date-time/stories/index.js +0 -72
  788. package/src/date-time/stories/time.js +0 -32
  789. package/src/date-time/test/date.js +0 -97
  790. package/src/date-time/time.js +0 -310
  791. package/src/date-time/utils.js +0 -18
  792. package/src/flyout/context.js +0 -10
  793. package/src/flyout/flyout/README.md +0 -98
  794. package/src/flyout/flyout/component.js +0 -111
  795. package/src/flyout/flyout/hook.js +0 -45
  796. package/src/flyout/flyout/index.js +0 -2
  797. package/src/flyout/flyout-content/component.js +0 -53
  798. package/src/flyout/flyout-content/index.js +0 -1
  799. package/src/flyout/index.js +0 -1
  800. package/src/flyout/stories/index.js +0 -24
  801. package/src/flyout/styles.ts +0 -41
  802. package/src/flyout/test/__snapshots__/index.js.snap +0 -186
  803. package/src/flyout/test/index.js +0 -103
  804. package/src/flyout/types.ts +0 -84
  805. package/src/flyout/utils.js +0 -23
  806. package/src/mobile/html-text-input/container.android.js +0 -23
  807. package/src/mobile/html-text-input/container.ios.js +0 -50
  808. package/src/popover/test/utils.js +0 -304
  809. package/src/popover/utils.js +0 -396
  810. package/src/select-control/stories/index.js +0 -104
  811. package/src/surface/stories/index.js +0 -46
  812. package/src/text-control/index.js +0 -72
  813. package/src/text-control/stories/index.js +0 -46
  814. package/src/textarea-control/index.js +0 -45
  815. package/src/textarea-control/stories/index.js +0 -48
  816. package/src/utils/hooks/use-combined-ref.ts +0 -28
@@ -13,8 +13,6 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
13
13
 
14
14
  var _reakit = require("reakit");
15
15
 
16
- var _reactResizeAware = _interopRequireDefault(require("react-resize-aware"));
17
-
18
16
  var _compose = require("@wordpress/compose");
19
17
 
20
18
  var _context = require("../../ui/context");
@@ -60,7 +58,7 @@ function ToggleGroupControl(props, forwardedRef) {
60
58
  } = (0, _context.useContextSystem)(props, 'ToggleGroupControl');
61
59
  const cx = (0, _hooks.useCx)();
62
60
  const containerRef = (0, _element.useRef)();
63
- const [resizeListener, sizes] = (0, _reactResizeAware.default)();
61
+ const [resizeListener, sizes] = (0, _compose.useResizeObserver)();
64
62
  const baseId = (0, _compose.useInstanceId)(ToggleGroupControl, 'toggle-group-control').toString();
65
63
  const radio = (0, _reakit.useRadioState)({
66
64
  baseId,
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control/component.tsx"],"names":["noop","ToggleGroupControl","props","forwardedRef","className","isAdaptiveWidth","isBlock","label","hideLabelFromVision","help","onChange","value","children","otherProps","cx","containerRef","resizeListener","sizes","baseId","toString","radio","state","previousValue","setState","classes","styles","block","View","width","ConnectedToggleGroupControl"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n// eslint-disable-next-line no-restricted-imports\nimport { RadioGroup, useRadioState } from 'reakit';\nimport useResizeAware from 'react-resize-aware';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useRef, useMemo } from '@wordpress/element';\nimport { useMergeRefs, useInstanceId, usePrevious } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport {\n\tcontextConnect,\n\tuseContextSystem,\n\tWordPressComponentProps,\n} from '../../ui/context';\nimport { useUpdateEffect, useCx } from '../../utils/hooks';\nimport { View } from '../../view';\nimport BaseControl from '../../base-control';\nimport type { ToggleGroupControlProps } from '../types';\nimport ToggleGroupControlBackdrop from './toggle-group-control-backdrop';\nimport ToggleGroupControlContext from '../context';\nimport * as styles from './styles';\n\nconst noop = () => {};\n\nfunction ToggleGroupControl(\n\tprops: WordPressComponentProps< ToggleGroupControlProps, 'input' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\tclassName,\n\t\tisAdaptiveWidth = false,\n\t\tisBlock = false,\n\t\tlabel,\n\t\thideLabelFromVision = false,\n\t\thelp,\n\t\tonChange = noop,\n\t\tvalue,\n\t\tchildren,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToggleGroupControl' );\n\tconst cx = useCx();\n\tconst containerRef = useRef();\n\tconst [ resizeListener, sizes ] = useResizeAware();\n\tconst baseId = useInstanceId(\n\t\tToggleGroupControl,\n\t\t'toggle-group-control'\n\t).toString();\n\tconst radio = useRadioState( {\n\t\tbaseId,\n\t\tstate: value,\n\t} );\n\tconst previousValue = usePrevious( value );\n\n\t// Propagate radio.state change.\n\tuseUpdateEffect( () => {\n\t\t// Avoid calling onChange if radio state changed\n\t\t// from incoming value.\n\t\tif ( previousValue !== radio.state ) {\n\t\t\tonChange( radio.state );\n\t\t}\n\t}, [ radio.state ] );\n\n\t// Sync incoming value with radio.state.\n\tuseUpdateEffect( () => {\n\t\tif ( value !== radio.state ) {\n\t\t\tradio.setState( value );\n\t\t}\n\t}, [ value ] );\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.ToggleGroupControl,\n\t\t\t\tisBlock && styles.block,\n\t\t\t\t'medium',\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, cx, isBlock ]\n\t);\n\treturn (\n\t\t<BaseControl help={ help }>\n\t\t\t<ToggleGroupControlContext.Provider\n\t\t\t\tvalue={ { ...radio, isBlock: ! isAdaptiveWidth } }\n\t\t\t>\n\t\t\t\t{ ! hideLabelFromVision && (\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t\t<RadioGroup\n\t\t\t\t\t{ ...radio }\n\t\t\t\t\taria-label={ label }\n\t\t\t\t\tas={ View }\n\t\t\t\t\tclassName={ classes }\n\t\t\t\t\t{ ...otherProps }\n\t\t\t\t\tref={ useMergeRefs( [ containerRef, forwardedRef ] ) }\n\t\t\t\t>\n\t\t\t\t\t{ resizeListener }\n\t\t\t\t\t<ToggleGroupControlBackdrop\n\t\t\t\t\t\t{ ...radio }\n\t\t\t\t\t\tcontainerRef={ containerRef }\n\t\t\t\t\t\tcontainerWidth={ sizes.width }\n\t\t\t\t\t\tisAdaptiveWidth={ isAdaptiveWidth }\n\t\t\t\t\t/>\n\t\t\t\t\t{ children }\n\t\t\t\t</RadioGroup>\n\t\t\t</ToggleGroupControlContext.Provider>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * `ToggleGroupControl` is a form component that lets users choose options\n * represented in horizontal segments. To render options for this control use\n * `ToggleGroupControlOption` component.\n *\n * Only use this control when you know for sure the labels of items inside won't\n * wrap. For items with longer labels, you can consider a `SelectControl` or a\n * `CustomSelectControl` component instead.\n *\n * @example\n * ```jsx\n * import {\n * __experimentalToggleGroupControl as ToggleGroupControl,\n * __experimentalToggleGroupControlOption as ToggleGroupControlOption,\n * } from '@wordpress/components';\n *\n * function Example() {\n * return (\n * <ToggleGroupControl label=\"my label\" value=\"vertical\" isBlock>\n * <ToggleGroupControlOption value=\"horizontal\" label=\"Horizontal\" />\n * <ToggleGroupControlOption value=\"vertical\" label=\"Vertical\" />\n * </ToggleGroupControl>\n * );\n * }\n * ```\n */\nconst ConnectedToggleGroupControl = contextConnect(\n\tToggleGroupControl,\n\t'ToggleGroupControl'\n);\n\nexport default ConnectedToggleGroupControl;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control/component.tsx"],"names":["noop","ToggleGroupControl","props","forwardedRef","className","isAdaptiveWidth","isBlock","label","hideLabelFromVision","help","onChange","value","children","otherProps","cx","containerRef","resizeListener","sizes","baseId","toString","radio","state","previousValue","setState","classes","styles","block","View","width","ConnectedToggleGroupControl"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n// eslint-disable-next-line no-restricted-imports\nimport { RadioGroup, useRadioState } from 'reakit';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useRef, useMemo } from '@wordpress/element';\nimport {\n\tuseMergeRefs,\n\tuseInstanceId,\n\tusePrevious,\n\tuseResizeObserver,\n} from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport {\n\tcontextConnect,\n\tuseContextSystem,\n\tWordPressComponentProps,\n} from '../../ui/context';\nimport { useUpdateEffect, useCx } from '../../utils/hooks';\nimport { View } from '../../view';\nimport BaseControl from '../../base-control';\nimport type { ToggleGroupControlProps } from '../types';\nimport ToggleGroupControlBackdrop from './toggle-group-control-backdrop';\nimport ToggleGroupControlContext from '../context';\nimport * as styles from './styles';\n\nconst noop = () => {};\n\nfunction ToggleGroupControl(\n\tprops: WordPressComponentProps< ToggleGroupControlProps, 'input' >,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\tclassName,\n\t\tisAdaptiveWidth = false,\n\t\tisBlock = false,\n\t\tlabel,\n\t\thideLabelFromVision = false,\n\t\thelp,\n\t\tonChange = noop,\n\t\tvalue,\n\t\tchildren,\n\t\t...otherProps\n\t} = useContextSystem( props, 'ToggleGroupControl' );\n\tconst cx = useCx();\n\tconst containerRef = useRef();\n\tconst [ resizeListener, sizes ] = useResizeObserver();\n\tconst baseId = useInstanceId(\n\t\tToggleGroupControl,\n\t\t'toggle-group-control'\n\t).toString();\n\tconst radio = useRadioState( {\n\t\tbaseId,\n\t\tstate: value,\n\t} );\n\tconst previousValue = usePrevious( value );\n\n\t// Propagate radio.state change.\n\tuseUpdateEffect( () => {\n\t\t// Avoid calling onChange if radio state changed\n\t\t// from incoming value.\n\t\tif ( previousValue !== radio.state ) {\n\t\t\tonChange( radio.state );\n\t\t}\n\t}, [ radio.state ] );\n\n\t// Sync incoming value with radio.state.\n\tuseUpdateEffect( () => {\n\t\tif ( value !== radio.state ) {\n\t\t\tradio.setState( value );\n\t\t}\n\t}, [ value ] );\n\n\tconst classes = useMemo(\n\t\t() =>\n\t\t\tcx(\n\t\t\t\tstyles.ToggleGroupControl,\n\t\t\t\tisBlock && styles.block,\n\t\t\t\t'medium',\n\t\t\t\tclassName\n\t\t\t),\n\t\t[ className, cx, isBlock ]\n\t);\n\treturn (\n\t\t<BaseControl help={ help }>\n\t\t\t<ToggleGroupControlContext.Provider\n\t\t\t\tvalue={ { ...radio, isBlock: ! isAdaptiveWidth } }\n\t\t\t>\n\t\t\t\t{ ! hideLabelFromVision && (\n\t\t\t\t\t<div>\n\t\t\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t\t<RadioGroup\n\t\t\t\t\t{ ...radio }\n\t\t\t\t\taria-label={ label }\n\t\t\t\t\tas={ View }\n\t\t\t\t\tclassName={ classes }\n\t\t\t\t\t{ ...otherProps }\n\t\t\t\t\tref={ useMergeRefs( [ containerRef, forwardedRef ] ) }\n\t\t\t\t>\n\t\t\t\t\t{ resizeListener }\n\t\t\t\t\t<ToggleGroupControlBackdrop\n\t\t\t\t\t\t{ ...radio }\n\t\t\t\t\t\tcontainerRef={ containerRef }\n\t\t\t\t\t\tcontainerWidth={ sizes.width }\n\t\t\t\t\t\tisAdaptiveWidth={ isAdaptiveWidth }\n\t\t\t\t\t/>\n\t\t\t\t\t{ children }\n\t\t\t\t</RadioGroup>\n\t\t\t</ToggleGroupControlContext.Provider>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * `ToggleGroupControl` is a form component that lets users choose options\n * represented in horizontal segments. To render options for this control use\n * `ToggleGroupControlOption` component.\n *\n * Only use this control when you know for sure the labels of items inside won't\n * wrap. For items with longer labels, you can consider a `SelectControl` or a\n * `CustomSelectControl` component instead.\n *\n * @example\n * ```jsx\n * import {\n * __experimentalToggleGroupControl as ToggleGroupControl,\n * __experimentalToggleGroupControlOption as ToggleGroupControlOption,\n * } from '@wordpress/components';\n *\n * function Example() {\n * return (\n * <ToggleGroupControl label=\"my label\" value=\"vertical\" isBlock>\n * <ToggleGroupControlOption value=\"horizontal\" label=\"Horizontal\" />\n * <ToggleGroupControlOption value=\"vertical\" label=\"Vertical\" />\n * </ToggleGroupControl>\n * );\n * }\n * ```\n */\nconst ConnectedToggleGroupControl = contextConnect(\n\tToggleGroupControl,\n\t'ToggleGroupControl'\n);\n\nexport default ConnectedToggleGroupControl;\n"]}
@@ -1,5 +1,7 @@
1
1
  "use strict";
2
2
 
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
3
5
  Object.defineProperty(exports, "__esModule", {
4
6
  value: true
5
7
  });
@@ -7,19 +9,19 @@ exports.default = ToggleGroupControlOptionIcon;
7
9
 
8
10
  var _element = require("@wordpress/element");
9
11
 
10
- var _icons = require("@wordpress/icons");
11
-
12
12
  var _toggleGroupControlOptionBase = require("../toggle-group-control-option-base");
13
13
 
14
+ var _icon = _interopRequireDefault(require("../../icon"));
15
+
14
16
  /**
15
- * WordPress dependencies
17
+ * Internal dependencies
16
18
  */
17
19
  function ToggleGroupControlOptionIcon(props) {
18
20
  const {
19
21
  icon,
20
22
  ...restProps
21
23
  } = props;
22
- return (0, _element.createElement)(_toggleGroupControlOptionBase.ToggleGroupControlOptionBase, restProps, (0, _element.createElement)(_icons.Icon, {
24
+ return (0, _element.createElement)(_toggleGroupControlOptionBase.ToggleGroupControlOptionBase, restProps, (0, _element.createElement)(_icon.default, {
23
25
  icon: icon
24
26
  }));
25
27
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control-option-icon/component.tsx"],"names":["ToggleGroupControlOptionIcon","props","icon","restProps"],"mappings":";;;;;;;;;AAGA;;AAOA;;AAVA;AACA;AACA;AAUe,SAASA,4BAAT,CACdC,KADc,EAMb;AACD,QAAM;AAAEC,IAAAA,IAAF;AAAQ,OAAGC;AAAX,MAAyBF,KAA/B;AACA,SACC,4BAAC,0DAAD,EAAmCE,SAAnC,EACC,4BAAC,WAAD;AAAM,IAAA,IAAI,EAAGD;AAAb,IADD,CADD;AAKA;AAED;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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { Icon } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../../ui/context';\nimport type { ToggleGroupControlOptionIconProps } from '../types';\nimport { ToggleGroupControlOptionBase } from '../toggle-group-control-option-base';\n\nexport default function ToggleGroupControlOptionIcon(\n\tprops: WordPressComponentProps<\n\t\tToggleGroupControlOptionIconProps,\n\t\t'button',\n\t\tfalse\n\t>\n) {\n\tconst { icon, ...restProps } = props;\n\treturn (\n\t\t<ToggleGroupControlOptionBase { ...restProps }>\n\t\t\t<Icon icon={ icon } />\n\t\t</ToggleGroupControlOptionBase>\n\t);\n}\n\n/**\n * `ToggleGroupControlOptionIcon` is a form component which is meant to be used as a\n * child of `ToggleGroupControl` and displays an icon.\n *\n * @example\n * ```jsx\n *\n * import {\n *\t__experimentalToggleGroupControl as ToggleGroupControl,\n *\t__experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,\n * from '@wordpress/components';\n * import { formatLowercase, formatUppercase } from '@wordpress/icons';\n *\n * function Example() {\n *\treturn (\n *\t\t<ToggleGroupControl label=\"my label\" value=\"vertical\" isBlock>\n *\t\t\t<ToggleGroupControlOptionIcon\n *\t\t\t\tvalue=\"uppercase\"\n *\t\t\t\ticon={ formatUppercase }\n *\t\t\t/>\n *\t\t\t<ToggleGroupControlOptionIcon\n *\t\t\t\tvalue=\"lowercase\"\n *\t\t\t\ticon={ formatLowercase }\n *\t\t\t/>\n *\t\t</ToggleGroupControl>\n *\t);\n * }\n ** ```\n */\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control-option-icon/component.tsx"],"names":["ToggleGroupControlOptionIcon","props","icon","restProps"],"mappings":";;;;;;;;;;;AAKA;;AACA;;AANA;AACA;AACA;AAMe,SAASA,4BAAT,CACdC,KADc,EAMb;AACD,QAAM;AAAEC,IAAAA,IAAF;AAAQ,OAAGC;AAAX,MAAyBF,KAA/B;AACA,SACC,4BAAC,0DAAD,EAAmCE,SAAnC,EACC,4BAAC,aAAD;AAAM,IAAA,IAAI,EAAGD;AAAb,IADD,CADD;AAKA;AAED;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","sourcesContent":["/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../../ui/context';\nimport type { ToggleGroupControlOptionIconProps } from '../types';\nimport { ToggleGroupControlOptionBase } from '../toggle-group-control-option-base';\nimport Icon from '../../icon';\n\nexport default function ToggleGroupControlOptionIcon(\n\tprops: WordPressComponentProps<\n\t\tToggleGroupControlOptionIconProps,\n\t\t'button',\n\t\tfalse\n\t>\n) {\n\tconst { icon, ...restProps } = props;\n\treturn (\n\t\t<ToggleGroupControlOptionBase { ...restProps }>\n\t\t\t<Icon icon={ icon } />\n\t\t</ToggleGroupControlOptionBase>\n\t);\n}\n\n/**\n * `ToggleGroupControlOptionIcon` is a form component which is meant to be used as a\n * child of `ToggleGroupControl` and displays an icon.\n *\n * @example\n * ```jsx\n *\n * import {\n *\t__experimentalToggleGroupControl as ToggleGroupControl,\n *\t__experimentalToggleGroupControlOptionIcon as ToggleGroupControlOptionIcon,\n * from '@wordpress/components';\n * import { formatLowercase, formatUppercase } from '@wordpress/icons';\n *\n * function Example() {\n *\treturn (\n *\t\t<ToggleGroupControl label=\"my label\" value=\"vertical\" isBlock>\n *\t\t\t<ToggleGroupControlOptionIcon\n *\t\t\t\tvalue=\"uppercase\"\n *\t\t\t\ticon={ formatUppercase }\n *\t\t\t/>\n *\t\t\t<ToggleGroupControlOptionIcon\n *\t\t\t\tvalue=\"lowercase\"\n *\t\t\t\ticon={ formatLowercase }\n *\t\t\t/>\n *\t\t</ToggleGroupControl>\n *\t);\n * }\n ** ```\n */\n"]}
@@ -11,6 +11,8 @@ var _element = require("@wordpress/element");
11
11
 
12
12
  var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
13
13
 
14
+ var _a11y = require("@wordpress/a11y");
15
+
14
16
  var _icons = require("@wordpress/icons");
15
17
 
16
18
  var _i18n = require("@wordpress/i18n");
@@ -40,12 +42,9 @@ var _context = require("../../ui/context");
40
42
  /**
41
43
  * Internal dependencies
42
44
  */
43
- const noop = () => {};
44
-
45
45
  const DefaultControlsGroup = _ref => {
46
46
  let {
47
47
  items,
48
- onClose,
49
48
  toggleItem
50
49
  } = _ref;
51
50
 
@@ -55,20 +54,28 @@ const DefaultControlsGroup = _ref => {
55
54
 
56
55
  return (0, _element.createElement)(_menuGroup.default, null, items.map(_ref2 => {
57
56
  let [label, hasValue] = _ref2;
58
- const icon = hasValue ? _icons.reset : _icons.check;
59
- const itemLabel = hasValue ? (0, _i18n.sprintf)( // translators: %s: The name of the control being reset e.g. "Padding".
60
- (0, _i18n.__)('Reset %s'), label) : undefined;
57
+
58
+ if (hasValue) {
59
+ return (0, _element.createElement)(_menuItem.default, {
60
+ key: label,
61
+ role: "menuitem",
62
+ icon: _icons.reset,
63
+ label: (0, _i18n.sprintf)( // translators: %s: The name of the control being reset e.g. "Padding".
64
+ (0, _i18n.__)('Reset %s'), label),
65
+ onClick: () => {
66
+ toggleItem(label);
67
+ (0, _a11y.speak)((0, _i18n.sprintf)( // translators: %s: The name of the control being reset e.g. "Padding".
68
+ (0, _i18n.__)('%s reset to default'), label), 'assertive');
69
+ }
70
+ }, label);
71
+ }
72
+
61
73
  return (0, _element.createElement)(_menuItem.default, {
62
74
  key: label,
63
- icon: icon,
75
+ role: "menuitemcheckbox",
76
+ icon: _icons.check,
64
77
  isSelected: true,
65
- disabled: !hasValue,
66
- label: itemLabel,
67
- onClick: () => {
68
- toggleItem(label);
69
- onClose();
70
- },
71
- role: "menuitemcheckbox"
78
+ "aria-disabled": true
72
79
  }, label);
73
80
  }));
74
81
  };
@@ -76,7 +83,6 @@ const DefaultControlsGroup = _ref => {
76
83
  const OptionalControlsGroup = _ref3 => {
77
84
  let {
78
85
  items,
79
- onClose,
80
86
  toggleItem
81
87
  } = _ref3;
82
88
 
@@ -95,8 +101,15 @@ const OptionalControlsGroup = _ref3 => {
95
101
  isSelected: isSelected,
96
102
  label: itemLabel,
97
103
  onClick: () => {
104
+ if (isSelected) {
105
+ (0, _a11y.speak)((0, _i18n.sprintf)( // translators: %s: The name of the control being reset e.g. "Padding".
106
+ (0, _i18n.__)('%s hidden and reset to default'), label), 'assertive');
107
+ } else {
108
+ (0, _a11y.speak)((0, _i18n.sprintf)( // translators: %s: The name of the control being reset e.g. "Padding".
109
+ (0, _i18n.__)('%s is now visible'), label), 'assertive');
110
+ }
111
+
98
112
  toggleItem(label);
99
- onClose();
100
113
  },
101
114
  role: "menuitemcheckbox"
102
115
  }, label);
@@ -123,7 +136,13 @@ const ToolsPanelHeader = (props, forwardedRef) => {
123
136
  const defaultItems = Object.entries((menuItems === null || menuItems === void 0 ? void 0 : menuItems.default) || {});
124
137
  const optionalItems = Object.entries((menuItems === null || menuItems === void 0 ? void 0 : menuItems.optional) || {});
125
138
  const dropDownMenuIcon = areAllOptionalControlsHidden ? _icons.plus : _icons.moreVertical;
126
- const dropDownMenuLabelText = areAllOptionalControlsHidden ? (0, _i18n._x)('View and add options', 'Button label to reveal tool panel options') : (0, _i18n._x)('View options', 'Button label to reveal tool panel options');
139
+ const dropDownMenuLabelText = (0, _i18n.sprintf)( // translators: %s: The name of the tool e.g. "Color" or "Typography".
140
+ (0, _i18n._x)('%s options', 'Button label to reveal tool panel options'), labelText);
141
+ const dropdownMenuDescriptionText = areAllOptionalControlsHidden ? (0, _i18n.__)('All options are currently hidden') : undefined;
142
+ const canResetAll = [...defaultItems, ...optionalItems].some(_ref5 => {
143
+ let [, isSelected] = _ref5;
144
+ return isSelected;
145
+ });
127
146
  return (0, _element.createElement)(_hStack.HStack, (0, _extends2.default)({}, headerProps, {
128
147
  ref: forwardedRef
129
148
  }), (0, _element.createElement)(_heading.Heading, {
@@ -136,28 +155,25 @@ const ToolsPanelHeader = (props, forwardedRef) => {
136
155
  className: dropdownMenuClassName
137
156
  },
138
157
  toggleProps: {
139
- isSmall: true
158
+ isSmall: true,
159
+ describedBy: dropdownMenuDescriptionText
140
160
  }
141
- }, _ref5 => {
142
- let {
143
- onClose = noop
144
- } = _ref5;
145
- return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(DefaultControlsGroup, {
146
- items: defaultItems,
147
- onClose: onClose,
148
- toggleItem: toggleItem
149
- }), (0, _element.createElement)(OptionalControlsGroup, {
150
- items: optionalItems,
151
- onClose: onClose,
152
- toggleItem: toggleItem
153
- }), (0, _element.createElement)(_menuGroup.default, null, (0, _element.createElement)(_menuItem.default, {
154
- variant: 'tertiary',
155
- onClick: () => {
161
+ }, () => (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(DefaultControlsGroup, {
162
+ items: defaultItems,
163
+ toggleItem: toggleItem
164
+ }), (0, _element.createElement)(OptionalControlsGroup, {
165
+ items: optionalItems,
166
+ toggleItem: toggleItem
167
+ }), (0, _element.createElement)(_menuGroup.default, null, (0, _element.createElement)(_menuItem.default, {
168
+ "aria-disabled": !canResetAll,
169
+ variant: 'tertiary',
170
+ onClick: () => {
171
+ if (canResetAll) {
156
172
  resetAll();
157
- onClose();
173
+ (0, _a11y.speak)((0, _i18n.__)('All options reset'), 'assertive');
158
174
  }
159
- }, (0, _i18n.__)('Reset all'))));
160
- }));
175
+ }
176
+ }, (0, _i18n.__)('Reset all'))))));
161
177
  };
162
178
 
163
179
  const ConnectedToolsPanelHeader = (0, _context.contextConnect)(ToolsPanelHeader, 'ToolsPanelHeader');
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/tools-panel/tools-panel-header/component.tsx"],"names":["noop","DefaultControlsGroup","items","onClose","toggleItem","length","map","label","hasValue","icon","reset","check","itemLabel","undefined","OptionalControlsGroup","isSelected","ToolsPanelHeader","props","forwardedRef","areAllOptionalControlsHidden","dropdownMenuClassName","hasMenuItems","headingClassName","labelText","menuItems","resetAll","headerProps","defaultItems","Object","entries","default","optionalItems","optional","dropDownMenuIcon","plus","moreVertical","dropDownMenuLabelText","className","isSmall","ConnectedToolsPanelHeader"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { check, reset, moreVertical, plus } from '@wordpress/icons';\nimport { __, _x, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport DropdownMenu from '../../dropdown-menu';\nimport MenuGroup from '../../menu-group';\nimport MenuItem from '../../menu-item';\nimport { HStack } from '../../h-stack';\nimport { Heading } from '../../heading';\nimport { useToolsPanelHeader } from './hook';\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport type {\n\tToolsPanelControlsGroupProps,\n\tToolsPanelHeaderProps,\n} from '../types';\n\nconst noop = () => {};\n\nconst DefaultControlsGroup = ( {\n\titems,\n\tonClose,\n\ttoggleItem,\n}: ToolsPanelControlsGroupProps ) => {\n\tif ( ! items.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<MenuGroup>\n\t\t\t{ items.map( ( [ label, hasValue ] ) => {\n\t\t\t\tconst icon = hasValue ? reset : check;\n\t\t\t\tconst itemLabel = hasValue\n\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t// translators: %s: The name of the control being reset e.g. \"Padding\".\n\t\t\t\t\t\t\t__( 'Reset %s' ),\n\t\t\t\t\t\t\tlabel\n\t\t\t\t\t )\n\t\t\t\t\t: undefined;\n\n\t\t\t\treturn (\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tkey={ label }\n\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\tisSelected={ true }\n\t\t\t\t\t\tdisabled={ ! hasValue }\n\t\t\t\t\t\tlabel={ itemLabel }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\ttoggleItem( label );\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\trole=\"menuitemcheckbox\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</MenuGroup>\n\t);\n};\n\nconst OptionalControlsGroup = ( {\n\titems,\n\tonClose,\n\ttoggleItem,\n}: ToolsPanelControlsGroupProps ) => {\n\tif ( ! items.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<MenuGroup>\n\t\t\t{ items.map( ( [ label, isSelected ] ) => {\n\t\t\t\tconst itemLabel = isSelected\n\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t// translators: %s: The name of the control being hidden and reset e.g. \"Padding\".\n\t\t\t\t\t\t\t__( 'Hide and reset %s' ),\n\t\t\t\t\t\t\tlabel\n\t\t\t\t\t )\n\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t// translators: %s: The name of the control to display e.g. \"Padding\".\n\t\t\t\t\t\t\t__( 'Show %s' ),\n\t\t\t\t\t\t\tlabel\n\t\t\t\t\t );\n\n\t\t\t\treturn (\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tkey={ label }\n\t\t\t\t\t\ticon={ isSelected && check }\n\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\tlabel={ itemLabel }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\ttoggleItem( label );\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\trole=\"menuitemcheckbox\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</MenuGroup>\n\t);\n};\n\nconst ToolsPanelHeader = (\n\tprops: WordPressComponentProps< ToolsPanelHeaderProps, 'h2' >,\n\tforwardedRef: ForwardedRef< any >\n) => {\n\tconst {\n\t\tareAllOptionalControlsHidden,\n\t\tdropdownMenuClassName,\n\t\thasMenuItems,\n\t\theadingClassName,\n\t\tlabel: labelText,\n\t\tmenuItems,\n\t\tresetAll,\n\t\ttoggleItem,\n\t\t...headerProps\n\t} = useToolsPanelHeader( props );\n\n\tif ( ! labelText ) {\n\t\treturn null;\n\t}\n\n\tconst defaultItems = Object.entries( menuItems?.default || {} );\n\tconst optionalItems = Object.entries( menuItems?.optional || {} );\n\tconst dropDownMenuIcon = areAllOptionalControlsHidden ? plus : moreVertical;\n\tconst dropDownMenuLabelText = areAllOptionalControlsHidden\n\t\t? _x(\n\t\t\t\t'View and add options',\n\t\t\t\t'Button label to reveal tool panel options'\n\t\t )\n\t\t: _x( 'View options', 'Button label to reveal tool panel options' );\n\n\treturn (\n\t\t<HStack { ...headerProps } ref={ forwardedRef }>\n\t\t\t<Heading level={ 2 } className={ headingClassName }>\n\t\t\t\t{ labelText }\n\t\t\t</Heading>\n\t\t\t{ hasMenuItems && (\n\t\t\t\t<DropdownMenu\n\t\t\t\t\ticon={ dropDownMenuIcon }\n\t\t\t\t\tlabel={ dropDownMenuLabelText }\n\t\t\t\t\tmenuProps={ { className: dropdownMenuClassName } }\n\t\t\t\t\ttoggleProps={ { isSmall: true } }\n\t\t\t\t>\n\t\t\t\t\t{ ( { onClose = noop } ) => (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<DefaultControlsGroup\n\t\t\t\t\t\t\t\titems={ defaultItems }\n\t\t\t\t\t\t\t\tonClose={ onClose }\n\t\t\t\t\t\t\t\ttoggleItem={ toggleItem }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<OptionalControlsGroup\n\t\t\t\t\t\t\t\titems={ optionalItems }\n\t\t\t\t\t\t\t\tonClose={ onClose }\n\t\t\t\t\t\t\t\ttoggleItem={ toggleItem }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<MenuGroup>\n\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\tvariant={ 'tertiary' }\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tresetAll();\n\t\t\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ __( 'Reset all' ) }\n\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t</MenuGroup>\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t</DropdownMenu>\n\t\t\t) }\n\t\t</HStack>\n\t);\n};\n\nconst ConnectedToolsPanelHeader = contextConnect(\n\tToolsPanelHeader,\n\t'ToolsPanelHeader'\n);\n\nexport default ConnectedToolsPanelHeader;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/tools-panel/tools-panel-header/component.tsx"],"names":["DefaultControlsGroup","items","toggleItem","length","map","label","hasValue","reset","check","OptionalControlsGroup","isSelected","itemLabel","ToolsPanelHeader","props","forwardedRef","areAllOptionalControlsHidden","dropdownMenuClassName","hasMenuItems","headingClassName","labelText","menuItems","resetAll","headerProps","defaultItems","Object","entries","default","optionalItems","optional","dropDownMenuIcon","plus","moreVertical","dropDownMenuLabelText","dropdownMenuDescriptionText","undefined","canResetAll","some","className","isSmall","describedBy","ConnectedToolsPanelHeader"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type { ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { speak } from '@wordpress/a11y';\nimport { check, reset, moreVertical, plus } from '@wordpress/icons';\nimport { __, _x, sprintf } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport DropdownMenu from '../../dropdown-menu';\nimport MenuGroup from '../../menu-group';\nimport MenuItem from '../../menu-item';\nimport { HStack } from '../../h-stack';\nimport { Heading } from '../../heading';\nimport { useToolsPanelHeader } from './hook';\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport type {\n\tToolsPanelControlsGroupProps,\n\tToolsPanelHeaderProps,\n} from '../types';\n\nconst DefaultControlsGroup = ( {\n\titems,\n\ttoggleItem,\n}: ToolsPanelControlsGroupProps ) => {\n\tif ( ! items.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<MenuGroup>\n\t\t\t{ items.map( ( [ label, hasValue ] ) => {\n\t\t\t\tif ( hasValue ) {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\tkey={ label }\n\t\t\t\t\t\t\trole=\"menuitem\"\n\t\t\t\t\t\t\ticon={ reset }\n\t\t\t\t\t\t\tlabel={ sprintf(\n\t\t\t\t\t\t\t\t// translators: %s: The name of the control being reset e.g. \"Padding\".\n\t\t\t\t\t\t\t\t__( 'Reset %s' ),\n\t\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\ttoggleItem( label );\n\t\t\t\t\t\t\t\tspeak(\n\t\t\t\t\t\t\t\t\tsprintf(\n\t\t\t\t\t\t\t\t\t\t// translators: %s: The name of the control being reset e.g. \"Padding\".\n\t\t\t\t\t\t\t\t\t\t__( '%s reset to default' ),\n\t\t\t\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t'assertive'\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\t\t{ label }\n\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\treturn (\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tkey={ label }\n\t\t\t\t\t\trole=\"menuitemcheckbox\"\n\t\t\t\t\t\ticon={ check }\n\t\t\t\t\t\tisSelected\n\t\t\t\t\t\taria-disabled\n\t\t\t\t\t>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</MenuGroup>\n\t);\n};\n\nconst OptionalControlsGroup = ( {\n\titems,\n\ttoggleItem,\n}: ToolsPanelControlsGroupProps ) => {\n\tif ( ! items.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<MenuGroup>\n\t\t\t{ items.map( ( [ label, isSelected ] ) => {\n\t\t\t\tconst itemLabel = isSelected\n\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t// translators: %s: The name of the control being hidden and reset e.g. \"Padding\".\n\t\t\t\t\t\t\t__( 'Hide and reset %s' ),\n\t\t\t\t\t\t\tlabel\n\t\t\t\t\t )\n\t\t\t\t\t: sprintf(\n\t\t\t\t\t\t\t// translators: %s: The name of the control to display e.g. \"Padding\".\n\t\t\t\t\t\t\t__( 'Show %s' ),\n\t\t\t\t\t\t\tlabel\n\t\t\t\t\t );\n\n\t\t\t\treturn (\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tkey={ label }\n\t\t\t\t\t\ticon={ isSelected && check }\n\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\tlabel={ itemLabel }\n\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\tif ( isSelected ) {\n\t\t\t\t\t\t\t\tspeak(\n\t\t\t\t\t\t\t\t\tsprintf(\n\t\t\t\t\t\t\t\t\t\t// translators: %s: The name of the control being reset e.g. \"Padding\".\n\t\t\t\t\t\t\t\t\t\t__( '%s hidden and reset to default' ),\n\t\t\t\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t'assertive'\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\t\tspeak(\n\t\t\t\t\t\t\t\t\tsprintf(\n\t\t\t\t\t\t\t\t\t\t// translators: %s: The name of the control being reset e.g. \"Padding\".\n\t\t\t\t\t\t\t\t\t\t__( '%s is now visible' ),\n\t\t\t\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t\t),\n\t\t\t\t\t\t\t\t\t'assertive'\n\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\ttoggleItem( label );\n\t\t\t\t\t\t} }\n\t\t\t\t\t\trole=\"menuitemcheckbox\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</MenuGroup>\n\t);\n};\n\nconst ToolsPanelHeader = (\n\tprops: WordPressComponentProps< ToolsPanelHeaderProps, 'h2' >,\n\tforwardedRef: ForwardedRef< any >\n) => {\n\tconst {\n\t\tareAllOptionalControlsHidden,\n\t\tdropdownMenuClassName,\n\t\thasMenuItems,\n\t\theadingClassName,\n\t\tlabel: labelText,\n\t\tmenuItems,\n\t\tresetAll,\n\t\ttoggleItem,\n\t\t...headerProps\n\t} = useToolsPanelHeader( props );\n\n\tif ( ! labelText ) {\n\t\treturn null;\n\t}\n\n\tconst defaultItems = Object.entries( menuItems?.default || {} );\n\tconst optionalItems = Object.entries( menuItems?.optional || {} );\n\tconst dropDownMenuIcon = areAllOptionalControlsHidden ? plus : moreVertical;\n\tconst dropDownMenuLabelText = sprintf(\n\t\t// translators: %s: The name of the tool e.g. \"Color\" or \"Typography\".\n\t\t_x( '%s options', 'Button label to reveal tool panel options' ),\n\t\tlabelText\n\t);\n\tconst dropdownMenuDescriptionText = areAllOptionalControlsHidden\n\t\t? __( 'All options are currently hidden' )\n\t\t: undefined;\n\n\tconst canResetAll = [ ...defaultItems, ...optionalItems ].some(\n\t\t( [ , isSelected ] ) => isSelected\n\t);\n\n\treturn (\n\t\t<HStack { ...headerProps } ref={ forwardedRef }>\n\t\t\t<Heading level={ 2 } className={ headingClassName }>\n\t\t\t\t{ labelText }\n\t\t\t</Heading>\n\t\t\t{ hasMenuItems && (\n\t\t\t\t<DropdownMenu\n\t\t\t\t\ticon={ dropDownMenuIcon }\n\t\t\t\t\tlabel={ dropDownMenuLabelText }\n\t\t\t\t\tmenuProps={ { className: dropdownMenuClassName } }\n\t\t\t\t\ttoggleProps={ {\n\t\t\t\t\t\tisSmall: true,\n\t\t\t\t\t\tdescribedBy: dropdownMenuDescriptionText,\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t{ () => (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<DefaultControlsGroup\n\t\t\t\t\t\t\t\titems={ defaultItems }\n\t\t\t\t\t\t\t\ttoggleItem={ toggleItem }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<OptionalControlsGroup\n\t\t\t\t\t\t\t\titems={ optionalItems }\n\t\t\t\t\t\t\t\ttoggleItem={ toggleItem }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<MenuGroup>\n\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\taria-disabled={ ! canResetAll }\n\t\t\t\t\t\t\t\t\tvariant={ 'tertiary' }\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tif ( canResetAll ) {\n\t\t\t\t\t\t\t\t\t\t\tresetAll();\n\t\t\t\t\t\t\t\t\t\t\tspeak(\n\t\t\t\t\t\t\t\t\t\t\t\t__( 'All options reset' ),\n\t\t\t\t\t\t\t\t\t\t\t\t'assertive'\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\t\t{ __( 'Reset all' ) }\n\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t</MenuGroup>\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t</DropdownMenu>\n\t\t\t) }\n\t\t</HStack>\n\t);\n};\n\nconst ConnectedToolsPanelHeader = contextConnect(\n\tToolsPanelHeader,\n\t'ToolsPanelHeader'\n);\n\nexport default ConnectedToolsPanelHeader;\n"]}
@@ -80,7 +80,7 @@ const addPopoverToGrandchildren = _ref3 => {
80
80
  className: "components-tooltip",
81
81
  "aria-hidden": "true",
82
82
  animate: false,
83
- noArrow: true
83
+ offset: 12
84
84
  }, text, (0, _element.createElement)(_shortcut.default, {
85
85
  className: "components-tooltip__shortcut",
86
86
  shortcut: shortcut
@@ -107,7 +107,7 @@ const emitToChild = (children, eventName, event) => {
107
107
  function Tooltip(props) {
108
108
  const {
109
109
  children,
110
- position,
110
+ position = 'bottom middle',
111
111
  text,
112
112
  shortcut,
113
113
  delay = TOOLTIP_DELAY
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/tooltip/index.js"],"names":["TOOLTIP_DELAY","eventCatcher","getDisabledElement","eventHandlers","child","childrenWithPopover","children","getRegularElement","addPopoverToGrandchildren","grandchildren","isOver","position","text","shortcut","emitToChild","eventName","event","Children","count","only","props","disabled","Tooltip","delay","isMouseDown","setIsMouseDown","setIsOver","delayedSetIsOver","createMouseDown","document","addEventListener","cancelIsMouseDown","createMouseUp","removeEventListener","createMouseEvent","type","createToggleIsOver","isDelayed","currentTarget","cancel","_isOver","clearOnUnmount","process","env","NODE_ENV","console","error","onMouseEnter","onMouseLeave","onClick","onFocus","onBlur","onMouseDown","getElementWithPopover","popoverData"],"mappings":"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","sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport { includes } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tChildren,\n\tcloneElement,\n\tconcatChildren,\n\tuseEffect,\n\tuseState,\n} from '@wordpress/element';\nimport { useDebounce } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Popover from '../popover';\nimport Shortcut from '../shortcut';\n\n/**\n * Time over children to wait before showing tooltip\n *\n * @type {number}\n */\nexport const TOOLTIP_DELAY = 700;\n\nconst eventCatcher = <div className=\"event-catcher\" />;\n\nconst getDisabledElement = ( { eventHandlers, child, childrenWithPopover } ) =>\n\tcloneElement(\n\t\t<span className=\"disabled-element-wrapper\">\n\t\t\t{ cloneElement( eventCatcher, eventHandlers ) }\n\t\t\t{ cloneElement( child, {\n\t\t\t\tchildren: childrenWithPopover,\n\t\t\t} ) }\n\t\t</span>,\n\t\teventHandlers\n\t);\n\nconst getRegularElement = ( { child, eventHandlers, childrenWithPopover } ) =>\n\tcloneElement( child, {\n\t\t...eventHandlers,\n\t\tchildren: childrenWithPopover,\n\t} );\n\nconst addPopoverToGrandchildren = ( {\n\tgrandchildren,\n\tisOver,\n\tposition,\n\ttext,\n\tshortcut,\n} ) =>\n\tconcatChildren(\n\t\tgrandchildren,\n\t\tisOver && (\n\t\t\t<Popover\n\t\t\t\tfocusOnMount={ false }\n\t\t\t\tposition={ position }\n\t\t\t\tclassName=\"components-tooltip\"\n\t\t\t\taria-hidden=\"true\"\n\t\t\t\tanimate={ false }\n\t\t\t\tnoArrow={ true }\n\t\t\t>\n\t\t\t\t{ text }\n\t\t\t\t<Shortcut\n\t\t\t\t\tclassName=\"components-tooltip__shortcut\"\n\t\t\t\t\tshortcut={ shortcut }\n\t\t\t\t/>\n\t\t\t</Popover>\n\t\t)\n\t);\n\nconst emitToChild = ( children, eventName, event ) => {\n\tif ( Children.count( children ) !== 1 ) {\n\t\treturn;\n\t}\n\n\tconst child = Children.only( children );\n\n\t// If the underlying element is disabled, do not emit the event.\n\tif ( child.props.disabled ) {\n\t\treturn;\n\t}\n\n\tif ( typeof child.props[ eventName ] === 'function' ) {\n\t\tchild.props[ eventName ]( event );\n\t}\n};\n\nfunction Tooltip( props ) {\n\tconst { children, position, text, shortcut, delay = TOOLTIP_DELAY } = props;\n\t/**\n\t * Whether a mouse is currently pressed, used in determining whether\n\t * to handle a focus event as displaying the tooltip immediately.\n\t *\n\t * @type {boolean}\n\t */\n\tconst [ isMouseDown, setIsMouseDown ] = useState( false );\n\tconst [ isOver, setIsOver ] = useState( false );\n\tconst delayedSetIsOver = useDebounce( setIsOver, delay );\n\n\tconst createMouseDown = ( event ) => {\n\t\t// Preserve original child callback behavior.\n\t\temitToChild( children, 'onMouseDown', event );\n\n\t\t// On mouse down, the next `mouseup` should revert the value of the\n\t\t// instance property and remove its own event handler. The bind is\n\t\t// made on the document since the `mouseup` might not occur within\n\t\t// the bounds of the element.\n\t\tdocument.addEventListener( 'mouseup', cancelIsMouseDown );\n\t\tsetIsMouseDown( true );\n\t};\n\n\tconst createMouseUp = ( event ) => {\n\t\temitToChild( children, 'onMouseUp', event );\n\t\tdocument.removeEventListener( 'mouseup', cancelIsMouseDown );\n\t\tsetIsMouseDown( false );\n\t};\n\n\tconst createMouseEvent = ( type ) => {\n\t\tif ( type === 'mouseUp' ) return createMouseUp;\n\t\tif ( type === 'mouseDown' ) return createMouseDown;\n\t};\n\n\t/**\n\t * Prebound `isInMouseDown` handler, created as a constant reference to\n\t * assure ability to remove in component unmount.\n\t *\n\t * @type {Function}\n\t */\n\tconst cancelIsMouseDown = createMouseEvent( 'mouseUp' );\n\n\tconst createToggleIsOver = ( eventName, isDelayed ) => {\n\t\treturn ( event ) => {\n\t\t\t// Preserve original child callback behavior.\n\t\t\temitToChild( children, eventName, event );\n\n\t\t\t// Mouse events behave unreliably in React for disabled elements,\n\t\t\t// firing on mouseenter but not mouseleave. Further, the default\n\t\t\t// behavior for disabled elements in some browsers is to ignore\n\t\t\t// mouse events. Don't bother trying to to handle them.\n\t\t\t//\n\t\t\t// See: https://github.com/facebook/react/issues/4251\n\t\t\tif ( event.currentTarget.disabled ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// A focus event will occur as a result of a mouse click, but it\n\t\t\t// should be disambiguated between interacting with the button and\n\t\t\t// using an explicit focus shift as a cue to display the tooltip.\n\t\t\tif ( 'focus' === event.type && isMouseDown ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Needed in case unsetting is over while delayed set pending, i.e.\n\t\t\t// quickly blur/mouseleave before delayedSetIsOver is called.\n\t\t\tdelayedSetIsOver.cancel();\n\n\t\t\tconst _isOver = includes( [ 'focus', 'mouseenter' ], event.type );\n\t\t\tif ( _isOver === isOver ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( isDelayed ) {\n\t\t\t\tdelayedSetIsOver( _isOver );\n\t\t\t} else {\n\t\t\t\tsetIsOver( _isOver );\n\t\t\t}\n\t\t};\n\t};\n\tconst clearOnUnmount = () => {\n\t\tdelayedSetIsOver.cancel();\n\t\tdocument.removeEventListener( 'mouseup', cancelIsMouseDown );\n\t};\n\n\tuseEffect( () => clearOnUnmount, [] );\n\n\tif ( Children.count( children ) !== 1 ) {\n\t\tif ( 'development' === process.env.NODE_ENV ) {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.error(\n\t\t\t\t'Tooltip should be called with only a single child element.'\n\t\t\t);\n\t\t}\n\n\t\treturn children;\n\t}\n\n\tconst eventHandlers = {\n\t\tonMouseEnter: createToggleIsOver( 'onMouseEnter', true ),\n\t\tonMouseLeave: createToggleIsOver( 'onMouseLeave' ),\n\t\tonClick: createToggleIsOver( 'onClick' ),\n\t\tonFocus: createToggleIsOver( 'onFocus' ),\n\t\tonBlur: createToggleIsOver( 'onBlur' ),\n\t\tonMouseDown: createMouseEvent( 'mouseDown' ),\n\t};\n\n\tconst child = Children.only( children );\n\tconst { children: grandchildren, disabled } = child.props;\n\tconst getElementWithPopover = disabled\n\t\t? getDisabledElement\n\t\t: getRegularElement;\n\n\tconst popoverData = {\n\t\tisOver,\n\t\tposition,\n\t\ttext,\n\t\tshortcut,\n\t};\n\tconst childrenWithPopover = addPopoverToGrandchildren( {\n\t\tgrandchildren,\n\t\t...popoverData,\n\t} );\n\n\treturn getElementWithPopover( {\n\t\tchild,\n\t\teventHandlers,\n\t\tchildrenWithPopover,\n\t} );\n}\n\nexport default Tooltip;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/tooltip/index.js"],"names":["TOOLTIP_DELAY","eventCatcher","getDisabledElement","eventHandlers","child","childrenWithPopover","children","getRegularElement","addPopoverToGrandchildren","grandchildren","isOver","position","text","shortcut","emitToChild","eventName","event","Children","count","only","props","disabled","Tooltip","delay","isMouseDown","setIsMouseDown","setIsOver","delayedSetIsOver","createMouseDown","document","addEventListener","cancelIsMouseDown","createMouseUp","removeEventListener","createMouseEvent","type","createToggleIsOver","isDelayed","currentTarget","cancel","_isOver","clearOnUnmount","process","env","NODE_ENV","console","error","onMouseEnter","onMouseLeave","onClick","onFocus","onBlur","onMouseDown","getElementWithPopover","popoverData"],"mappings":"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","sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport { includes } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tChildren,\n\tcloneElement,\n\tconcatChildren,\n\tuseEffect,\n\tuseState,\n} from '@wordpress/element';\nimport { useDebounce } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Popover from '../popover';\nimport Shortcut from '../shortcut';\n\n/**\n * Time over children to wait before showing tooltip\n *\n * @type {number}\n */\nexport const TOOLTIP_DELAY = 700;\n\nconst eventCatcher = <div className=\"event-catcher\" />;\n\nconst getDisabledElement = ( { eventHandlers, child, childrenWithPopover } ) =>\n\tcloneElement(\n\t\t<span className=\"disabled-element-wrapper\">\n\t\t\t{ cloneElement( eventCatcher, eventHandlers ) }\n\t\t\t{ cloneElement( child, {\n\t\t\t\tchildren: childrenWithPopover,\n\t\t\t} ) }\n\t\t</span>,\n\t\teventHandlers\n\t);\n\nconst getRegularElement = ( { child, eventHandlers, childrenWithPopover } ) =>\n\tcloneElement( child, {\n\t\t...eventHandlers,\n\t\tchildren: childrenWithPopover,\n\t} );\n\nconst addPopoverToGrandchildren = ( {\n\tgrandchildren,\n\tisOver,\n\tposition,\n\ttext,\n\tshortcut,\n} ) =>\n\tconcatChildren(\n\t\tgrandchildren,\n\t\tisOver && (\n\t\t\t<Popover\n\t\t\t\tfocusOnMount={ false }\n\t\t\t\tposition={ position }\n\t\t\t\tclassName=\"components-tooltip\"\n\t\t\t\taria-hidden=\"true\"\n\t\t\t\tanimate={ false }\n\t\t\t\toffset={ 12 }\n\t\t\t>\n\t\t\t\t{ text }\n\t\t\t\t<Shortcut\n\t\t\t\t\tclassName=\"components-tooltip__shortcut\"\n\t\t\t\t\tshortcut={ shortcut }\n\t\t\t\t/>\n\t\t\t</Popover>\n\t\t)\n\t);\n\nconst emitToChild = ( children, eventName, event ) => {\n\tif ( Children.count( children ) !== 1 ) {\n\t\treturn;\n\t}\n\n\tconst child = Children.only( children );\n\n\t// If the underlying element is disabled, do not emit the event.\n\tif ( child.props.disabled ) {\n\t\treturn;\n\t}\n\n\tif ( typeof child.props[ eventName ] === 'function' ) {\n\t\tchild.props[ eventName ]( event );\n\t}\n};\n\nfunction Tooltip( props ) {\n\tconst {\n\t\tchildren,\n\t\tposition = 'bottom middle',\n\t\ttext,\n\t\tshortcut,\n\t\tdelay = TOOLTIP_DELAY,\n\t} = props;\n\t/**\n\t * Whether a mouse is currently pressed, used in determining whether\n\t * to handle a focus event as displaying the tooltip immediately.\n\t *\n\t * @type {boolean}\n\t */\n\tconst [ isMouseDown, setIsMouseDown ] = useState( false );\n\tconst [ isOver, setIsOver ] = useState( false );\n\tconst delayedSetIsOver = useDebounce( setIsOver, delay );\n\n\tconst createMouseDown = ( event ) => {\n\t\t// Preserve original child callback behavior.\n\t\temitToChild( children, 'onMouseDown', event );\n\n\t\t// On mouse down, the next `mouseup` should revert the value of the\n\t\t// instance property and remove its own event handler. The bind is\n\t\t// made on the document since the `mouseup` might not occur within\n\t\t// the bounds of the element.\n\t\tdocument.addEventListener( 'mouseup', cancelIsMouseDown );\n\t\tsetIsMouseDown( true );\n\t};\n\n\tconst createMouseUp = ( event ) => {\n\t\temitToChild( children, 'onMouseUp', event );\n\t\tdocument.removeEventListener( 'mouseup', cancelIsMouseDown );\n\t\tsetIsMouseDown( false );\n\t};\n\n\tconst createMouseEvent = ( type ) => {\n\t\tif ( type === 'mouseUp' ) return createMouseUp;\n\t\tif ( type === 'mouseDown' ) return createMouseDown;\n\t};\n\n\t/**\n\t * Prebound `isInMouseDown` handler, created as a constant reference to\n\t * assure ability to remove in component unmount.\n\t *\n\t * @type {Function}\n\t */\n\tconst cancelIsMouseDown = createMouseEvent( 'mouseUp' );\n\n\tconst createToggleIsOver = ( eventName, isDelayed ) => {\n\t\treturn ( event ) => {\n\t\t\t// Preserve original child callback behavior.\n\t\t\temitToChild( children, eventName, event );\n\n\t\t\t// Mouse events behave unreliably in React for disabled elements,\n\t\t\t// firing on mouseenter but not mouseleave. Further, the default\n\t\t\t// behavior for disabled elements in some browsers is to ignore\n\t\t\t// mouse events. Don't bother trying to to handle them.\n\t\t\t//\n\t\t\t// See: https://github.com/facebook/react/issues/4251\n\t\t\tif ( event.currentTarget.disabled ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// A focus event will occur as a result of a mouse click, but it\n\t\t\t// should be disambiguated between interacting with the button and\n\t\t\t// using an explicit focus shift as a cue to display the tooltip.\n\t\t\tif ( 'focus' === event.type && isMouseDown ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// Needed in case unsetting is over while delayed set pending, i.e.\n\t\t\t// quickly blur/mouseleave before delayedSetIsOver is called.\n\t\t\tdelayedSetIsOver.cancel();\n\n\t\t\tconst _isOver = includes( [ 'focus', 'mouseenter' ], event.type );\n\t\t\tif ( _isOver === isOver ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tif ( isDelayed ) {\n\t\t\t\tdelayedSetIsOver( _isOver );\n\t\t\t} else {\n\t\t\t\tsetIsOver( _isOver );\n\t\t\t}\n\t\t};\n\t};\n\tconst clearOnUnmount = () => {\n\t\tdelayedSetIsOver.cancel();\n\t\tdocument.removeEventListener( 'mouseup', cancelIsMouseDown );\n\t};\n\n\tuseEffect( () => clearOnUnmount, [] );\n\n\tif ( Children.count( children ) !== 1 ) {\n\t\tif ( 'development' === process.env.NODE_ENV ) {\n\t\t\t// eslint-disable-next-line no-console\n\t\t\tconsole.error(\n\t\t\t\t'Tooltip should be called with only a single child element.'\n\t\t\t);\n\t\t}\n\n\t\treturn children;\n\t}\n\n\tconst eventHandlers = {\n\t\tonMouseEnter: createToggleIsOver( 'onMouseEnter', true ),\n\t\tonMouseLeave: createToggleIsOver( 'onMouseLeave' ),\n\t\tonClick: createToggleIsOver( 'onClick' ),\n\t\tonFocus: createToggleIsOver( 'onFocus' ),\n\t\tonBlur: createToggleIsOver( 'onBlur' ),\n\t\tonMouseDown: createMouseEvent( 'mouseDown' ),\n\t};\n\n\tconst child = Children.only( children );\n\tconst { children: grandchildren, disabled } = child.props;\n\tconst getElementWithPopover = disabled\n\t\t? getDisabledElement\n\t\t: getRegularElement;\n\n\tconst popoverData = {\n\t\tisOver,\n\t\tposition,\n\t\ttext,\n\t\tshortcut,\n\t};\n\tconst childrenWithPopover = addPopoverToGrandchildren( {\n\t\tgrandchildren,\n\t\t...popoverData,\n\t} );\n\n\treturn getElementWithPopover( {\n\t\tchild,\n\t\teventHandlers,\n\t\tchildrenWithPopover,\n\t} );\n}\n\nexport default Tooltip;\n"]}
@@ -88,7 +88,7 @@ function UnforwardedUnitControl(unitControlProps, forwardedRef) {
88
88
  const nonNullValueProp = valueProp !== null && valueProp !== void 0 ? valueProp : undefined;
89
89
  const units = (0, _element.useMemo)(() => (0, _utils.getUnitsWithCurrentUnit)(nonNullValueProp, unitProp, unitsProp), [nonNullValueProp, unitProp, unitsProp]);
90
90
  const [parsedQuantity, parsedUnit] = (0, _utils.getParsedQuantityAndUnit)(nonNullValueProp, unitProp, units);
91
- const [unit, setUnit] = (0, _hooks.useControlledState)(unitProp, {
91
+ const [unit, setUnit] = (0, _hooks.useControlledState)(units.length === 1 ? units[0].value : unitProp, {
92
92
  initial: parsedUnit,
93
93
  fallback: ''
94
94
  });
@@ -145,8 +145,8 @@ function UnforwardedUnitControl(unitControlProps, forwardedRef) {
145
145
  const changeProps = {
146
146
  event,
147
147
  data
148
- };
149
- onChangeProp === null || onChangeProp === void 0 ? void 0 : onChangeProp(`${validParsedQuantity !== null && validParsedQuantity !== void 0 ? validParsedQuantity : ''}${validParsedUnit}`, changeProps);
148
+ }; // The `onChange` callback already gets called, no need to call it explicitely.
149
+
150
150
  onUnitChange === null || onUnitChange === void 0 ? void 0 : onUnitChange(validParsedUnit, changeProps);
151
151
  setUnit(validParsedUnit);
152
152
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/unit-control/index.tsx"],"names":["UnforwardedUnitControl","unitControlProps","forwardedRef","__unstableStateReducer","stateReducerProp","autoComplete","className","disabled","disableUnits","isPressEnterToChange","isResetValueOnUnitChange","isUnitSelectTabbable","label","onChange","onChangeProp","onUnitChange","size","style","unit","unitProp","units","unitsProp","CSS_UNITS","value","valueProp","onBlur","onBlurProp","props","since","hint","version","nonNullValueProp","undefined","parsedQuantity","parsedUnit","setUnit","initial","fallback","refParsedQuantity","classes","handleOnQuantityChange","nextQuantityValue","changeProps","onChangeValue","join","handleOnUnitChange","nextUnitValue","data","nextValue","default","mayUpdateUnit","event","isNaN","Number","currentTarget","current","validParsedQuantity","validParsedUnit","Array","isArray","find","option","handleOnBlur","handleOnKeyDown","key","unitControlStateReducer","state","action","nextState","type","inputControlActionTypes","COMMIT","toString","stateReducer","baseState","inputSuffix","step","activeUnit","UnitControl"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type {\n\tFocusEventHandler,\n\tKeyboardEvent,\n\tForwardedRef,\n\tSyntheticEvent,\n\tChangeEvent,\n\tPointerEvent,\n} from 'react';\nimport { omit } from 'lodash';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef, useMemo, useRef, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../ui/context';\nimport * as inputControlActionTypes from '../input-control/reducer/actions';\nimport { Root, ValueInput } from './styles/unit-control-styles';\nimport UnitSelectControl from './unit-select-control';\nimport {\n\tCSS_UNITS,\n\tgetParsedQuantityAndUnit,\n\tgetUnitsWithCurrentUnit,\n\tgetValidParsedQuantityAndUnit,\n} from './utils';\nimport { useControlledState } from '../utils/hooks';\nimport type { UnitControlProps, UnitControlOnChangeCallback } from './types';\nimport type { StateReducer } from '../input-control/reducer/state';\n\nfunction UnforwardedUnitControl(\n\tunitControlProps: WordPressComponentProps<\n\t\tUnitControlProps,\n\t\t'input',\n\t\tfalse\n\t>,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\t__unstableStateReducer: stateReducerProp,\n\t\tautoComplete = 'off',\n\t\tclassName,\n\t\tdisabled = false,\n\t\tdisableUnits = false,\n\t\tisPressEnterToChange = false,\n\t\tisResetValueOnUnitChange = false,\n\t\tisUnitSelectTabbable = true,\n\t\tlabel,\n\t\tonChange: onChangeProp,\n\t\tonUnitChange,\n\t\tsize = 'default',\n\t\tstyle,\n\t\tunit: unitProp,\n\t\tunits: unitsProp = CSS_UNITS,\n\t\tvalue: valueProp,\n\t\tonBlur: onBlurProp,\n\t\t...props\n\t} = unitControlProps;\n\n\tif ( 'unit' in unitControlProps ) {\n\t\tdeprecated( 'UnitControl unit prop', {\n\t\t\tsince: '5.6',\n\t\t\thint: 'The unit should be provided within the `value` prop.',\n\t\t\tversion: '6.2',\n\t\t} );\n\t}\n\n\t// The `value` prop, in theory, should not be `null`, but the following line\n\t// ensures it fallback to `undefined` in case a consumer of `UnitControl`\n\t// still passes `null` as a `value`.\n\tconst nonNullValueProp = valueProp ?? undefined;\n\tconst units = useMemo(\n\t\t() => getUnitsWithCurrentUnit( nonNullValueProp, unitProp, unitsProp ),\n\t\t[ nonNullValueProp, unitProp, unitsProp ]\n\t);\n\tconst [ parsedQuantity, parsedUnit ] = getParsedQuantityAndUnit(\n\t\tnonNullValueProp,\n\t\tunitProp,\n\t\tunits\n\t);\n\n\tconst [ unit, setUnit ] = useControlledState< string | undefined >(\n\t\tunitProp,\n\t\t{\n\t\t\tinitial: parsedUnit,\n\t\t\tfallback: '',\n\t\t}\n\t);\n\n\tuseEffect( () => {\n\t\tif ( parsedUnit !== undefined ) {\n\t\t\tsetUnit( parsedUnit );\n\t\t}\n\t}, [ parsedUnit ] );\n\n\t// Stores parsed value for hand-off in state reducer.\n\tconst refParsedQuantity = useRef< number | undefined >( undefined );\n\n\tconst classes = classnames( 'components-unit-control', className );\n\n\tconst handleOnQuantityChange = (\n\t\tnextQuantityValue: number | string | undefined,\n\t\tchangeProps: {\n\t\t\tevent:\n\t\t\t\t| ChangeEvent< HTMLInputElement >\n\t\t\t\t| PointerEvent< HTMLInputElement >;\n\t\t}\n\t) => {\n\t\tif (\n\t\t\tnextQuantityValue === '' ||\n\t\t\ttypeof nextQuantityValue === 'undefined' ||\n\t\t\tnextQuantityValue === null\n\t\t) {\n\t\t\tonChangeProp?.( '', changeProps );\n\t\t\treturn;\n\t\t}\n\n\t\t/*\n\t\t * Customizing the onChange callback.\n\t\t * This allows as to broadcast a combined value+unit to onChange.\n\t\t */\n\t\tconst onChangeValue = getValidParsedQuantityAndUnit(\n\t\t\tnextQuantityValue,\n\t\t\tunits,\n\t\t\tparsedQuantity,\n\t\t\tunit\n\t\t).join( '' );\n\n\t\tonChangeProp?.( onChangeValue, changeProps );\n\t};\n\n\tconst handleOnUnitChange: UnitControlOnChangeCallback = (\n\t\tnextUnitValue,\n\t\tchangeProps\n\t) => {\n\t\tconst { data } = changeProps;\n\n\t\tlet nextValue = `${ parsedQuantity ?? '' }${ nextUnitValue }`;\n\n\t\tif ( isResetValueOnUnitChange && data?.default !== undefined ) {\n\t\t\tnextValue = `${ data.default }${ nextUnitValue }`;\n\t\t}\n\n\t\tonChangeProp?.( nextValue, changeProps );\n\t\tonUnitChange?.( nextUnitValue, changeProps );\n\n\t\tsetUnit( nextUnitValue );\n\t};\n\n\tconst mayUpdateUnit = ( event: SyntheticEvent< HTMLInputElement > ) => {\n\t\tif ( ! isNaN( Number( event.currentTarget.value ) ) ) {\n\t\t\trefParsedQuantity.current = undefined;\n\t\t\treturn;\n\t\t}\n\t\tconst [\n\t\t\tvalidParsedQuantity,\n\t\t\tvalidParsedUnit,\n\t\t] = getValidParsedQuantityAndUnit(\n\t\t\tevent.currentTarget.value,\n\t\t\tunits,\n\t\t\tparsedQuantity,\n\t\t\tunit\n\t\t);\n\n\t\trefParsedQuantity.current = validParsedQuantity;\n\n\t\tif ( isPressEnterToChange && validParsedUnit !== unit ) {\n\t\t\tconst data = Array.isArray( units )\n\t\t\t\t? units.find( ( option ) => option.value === validParsedUnit )\n\t\t\t\t: undefined;\n\t\t\tconst changeProps = { event, data };\n\n\t\t\tonChangeProp?.(\n\t\t\t\t`${ validParsedQuantity ?? '' }${ validParsedUnit }`,\n\t\t\t\tchangeProps\n\t\t\t);\n\t\t\tonUnitChange?.( validParsedUnit, changeProps );\n\n\t\t\tsetUnit( validParsedUnit );\n\t\t}\n\t};\n\n\tconst handleOnBlur: FocusEventHandler< HTMLInputElement > = ( event ) => {\n\t\tmayUpdateUnit( event );\n\t\tonBlurProp?.( event );\n\t};\n\n\tconst handleOnKeyDown = ( event: KeyboardEvent< HTMLInputElement > ) => {\n\t\tconst { key } = event;\n\t\tif ( key === 'Enter' ) {\n\t\t\tmayUpdateUnit( event );\n\t\t}\n\t};\n\n\t/**\n\t * \"Middleware\" function that intercepts updates from InputControl.\n\t * This allows us to tap into actions to transform the (next) state for\n\t * InputControl.\n\t *\n\t * @param state State from InputControl\n\t * @param action Action triggering state change\n\t * @return The updated state to apply to InputControl\n\t */\n\tconst unitControlStateReducer: StateReducer = ( state, action ) => {\n\t\tconst nextState = { ...state };\n\n\t\t/*\n\t\t * On commits (when pressing ENTER and on blur if\n\t\t * isPressEnterToChange is true), if a parse has been performed\n\t\t * then use that result to update the state.\n\t\t */\n\t\tif ( action.type === inputControlActionTypes.COMMIT ) {\n\t\t\tif ( refParsedQuantity.current !== undefined ) {\n\t\t\t\tnextState.value = (\n\t\t\t\t\trefParsedQuantity.current ?? ''\n\t\t\t\t).toString();\n\t\t\t\trefParsedQuantity.current = undefined;\n\t\t\t}\n\t\t}\n\n\t\treturn nextState;\n\t};\n\n\tlet stateReducer: StateReducer = unitControlStateReducer;\n\tif ( stateReducerProp ) {\n\t\tstateReducer = ( state, action ) => {\n\t\t\tconst baseState = unitControlStateReducer( state, action );\n\t\t\treturn stateReducerProp( baseState, action );\n\t\t};\n\t}\n\n\tconst inputSuffix = ! disableUnits ? (\n\t\t<UnitSelectControl\n\t\t\taria-label={ __( 'Select unit' ) }\n\t\t\tdisabled={ disabled }\n\t\t\tisUnitSelectTabbable={ isUnitSelectTabbable }\n\t\t\tonChange={ handleOnUnitChange }\n\t\t\tsize={ size }\n\t\t\tunit={ unit }\n\t\t\tunits={ units }\n\t\t\tonBlur={ onBlurProp }\n\t\t/>\n\t) : null;\n\n\tlet step = props.step;\n\n\t/*\n\t * If no step prop has been passed, lookup the active unit and\n\t * try to get step from `units`, or default to a value of `1`\n\t */\n\tif ( ! step && units ) {\n\t\tconst activeUnit = units.find( ( option ) => option.value === unit );\n\t\tstep = activeUnit?.step ?? 1;\n\t}\n\n\treturn (\n\t\t<Root className=\"components-unit-control-wrapper\" style={ style }>\n\t\t\t<ValueInput\n\t\t\t\taria-label={ label }\n\t\t\t\ttype={ isPressEnterToChange ? 'text' : 'number' }\n\t\t\t\t{ ...omit( props, [ 'children' ] ) }\n\t\t\t\tautoComplete={ autoComplete }\n\t\t\t\tclassName={ classes }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tdisableUnits={ disableUnits }\n\t\t\t\tisPressEnterToChange={ isPressEnterToChange }\n\t\t\t\tlabel={ label }\n\t\t\t\tonBlur={ handleOnBlur }\n\t\t\t\tonKeyDown={ handleOnKeyDown }\n\t\t\t\tonChange={ handleOnQuantityChange }\n\t\t\t\tref={ forwardedRef }\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={ inputSuffix }\n\t\t\t\tvalue={ parsedQuantity ?? '' }\n\t\t\t\tstep={ step }\n\t\t\t\t__unstableStateReducer={ stateReducer }\n\t\t\t/>\n\t\t</Root>\n\t);\n}\n\n/**\n * `UnitControl` allows the user to set a numeric quantity as well as a unit (e.g. `px`).\n *\n *\n * @example\n * ```jsx\n * import { __experimentalUnitControl as UnitControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const Example = () => {\n * const [ value, setValue ] = useState( '10px' );\n *\n * return <UnitControl onChange={ setValue } value={ value } />;\n * };\n * ```\n */\nexport const UnitControl = forwardRef( UnforwardedUnitControl );\n\nexport { parseQuantityAndUnitFromRawValue, useCustomUnits } from './utils';\nexport default UnitControl;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/unit-control/index.tsx"],"names":["UnforwardedUnitControl","unitControlProps","forwardedRef","__unstableStateReducer","stateReducerProp","autoComplete","className","disabled","disableUnits","isPressEnterToChange","isResetValueOnUnitChange","isUnitSelectTabbable","label","onChange","onChangeProp","onUnitChange","size","style","unit","unitProp","units","unitsProp","CSS_UNITS","value","valueProp","onBlur","onBlurProp","props","since","hint","version","nonNullValueProp","undefined","parsedQuantity","parsedUnit","setUnit","length","initial","fallback","refParsedQuantity","classes","handleOnQuantityChange","nextQuantityValue","changeProps","onChangeValue","join","handleOnUnitChange","nextUnitValue","data","nextValue","default","mayUpdateUnit","event","isNaN","Number","currentTarget","current","validParsedQuantity","validParsedUnit","Array","isArray","find","option","handleOnBlur","handleOnKeyDown","key","unitControlStateReducer","state","action","nextState","type","inputControlActionTypes","COMMIT","toString","stateReducer","baseState","inputSuffix","step","activeUnit","UnitControl"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport type {\n\tFocusEventHandler,\n\tKeyboardEvent,\n\tForwardedRef,\n\tSyntheticEvent,\n\tChangeEvent,\n\tPointerEvent,\n} from 'react';\nimport { omit } from 'lodash';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef, useMemo, useRef, useEffect } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../ui/context';\nimport * as inputControlActionTypes from '../input-control/reducer/actions';\nimport { Root, ValueInput } from './styles/unit-control-styles';\nimport UnitSelectControl from './unit-select-control';\nimport {\n\tCSS_UNITS,\n\tgetParsedQuantityAndUnit,\n\tgetUnitsWithCurrentUnit,\n\tgetValidParsedQuantityAndUnit,\n} from './utils';\nimport { useControlledState } from '../utils/hooks';\nimport type { UnitControlProps, UnitControlOnChangeCallback } from './types';\nimport type { StateReducer } from '../input-control/reducer/state';\n\nfunction UnforwardedUnitControl(\n\tunitControlProps: WordPressComponentProps<\n\t\tUnitControlProps,\n\t\t'input',\n\t\tfalse\n\t>,\n\tforwardedRef: ForwardedRef< any >\n) {\n\tconst {\n\t\t__unstableStateReducer: stateReducerProp,\n\t\tautoComplete = 'off',\n\t\tclassName,\n\t\tdisabled = false,\n\t\tdisableUnits = false,\n\t\tisPressEnterToChange = false,\n\t\tisResetValueOnUnitChange = false,\n\t\tisUnitSelectTabbable = true,\n\t\tlabel,\n\t\tonChange: onChangeProp,\n\t\tonUnitChange,\n\t\tsize = 'default',\n\t\tstyle,\n\t\tunit: unitProp,\n\t\tunits: unitsProp = CSS_UNITS,\n\t\tvalue: valueProp,\n\t\tonBlur: onBlurProp,\n\t\t...props\n\t} = unitControlProps;\n\n\tif ( 'unit' in unitControlProps ) {\n\t\tdeprecated( 'UnitControl unit prop', {\n\t\t\tsince: '5.6',\n\t\t\thint: 'The unit should be provided within the `value` prop.',\n\t\t\tversion: '6.2',\n\t\t} );\n\t}\n\n\t// The `value` prop, in theory, should not be `null`, but the following line\n\t// ensures it fallback to `undefined` in case a consumer of `UnitControl`\n\t// still passes `null` as a `value`.\n\tconst nonNullValueProp = valueProp ?? undefined;\n\tconst units = useMemo(\n\t\t() => getUnitsWithCurrentUnit( nonNullValueProp, unitProp, unitsProp ),\n\t\t[ nonNullValueProp, unitProp, unitsProp ]\n\t);\n\tconst [ parsedQuantity, parsedUnit ] = getParsedQuantityAndUnit(\n\t\tnonNullValueProp,\n\t\tunitProp,\n\t\tunits\n\t);\n\n\tconst [ unit, setUnit ] = useControlledState< string | undefined >(\n\t\tunits.length === 1 ? units[ 0 ].value : unitProp,\n\t\t{\n\t\t\tinitial: parsedUnit,\n\t\t\tfallback: '',\n\t\t}\n\t);\n\n\tuseEffect( () => {\n\t\tif ( parsedUnit !== undefined ) {\n\t\t\tsetUnit( parsedUnit );\n\t\t}\n\t}, [ parsedUnit ] );\n\n\t// Stores parsed value for hand-off in state reducer.\n\tconst refParsedQuantity = useRef< number | undefined >( undefined );\n\n\tconst classes = classnames( 'components-unit-control', className );\n\n\tconst handleOnQuantityChange = (\n\t\tnextQuantityValue: number | string | undefined,\n\t\tchangeProps: {\n\t\t\tevent:\n\t\t\t\t| ChangeEvent< HTMLInputElement >\n\t\t\t\t| PointerEvent< HTMLInputElement >;\n\t\t}\n\t) => {\n\t\tif (\n\t\t\tnextQuantityValue === '' ||\n\t\t\ttypeof nextQuantityValue === 'undefined' ||\n\t\t\tnextQuantityValue === null\n\t\t) {\n\t\t\tonChangeProp?.( '', changeProps );\n\t\t\treturn;\n\t\t}\n\n\t\t/*\n\t\t * Customizing the onChange callback.\n\t\t * This allows as to broadcast a combined value+unit to onChange.\n\t\t */\n\t\tconst onChangeValue = getValidParsedQuantityAndUnit(\n\t\t\tnextQuantityValue,\n\t\t\tunits,\n\t\t\tparsedQuantity,\n\t\t\tunit\n\t\t).join( '' );\n\n\t\tonChangeProp?.( onChangeValue, changeProps );\n\t};\n\n\tconst handleOnUnitChange: UnitControlOnChangeCallback = (\n\t\tnextUnitValue,\n\t\tchangeProps\n\t) => {\n\t\tconst { data } = changeProps;\n\n\t\tlet nextValue = `${ parsedQuantity ?? '' }${ nextUnitValue }`;\n\n\t\tif ( isResetValueOnUnitChange && data?.default !== undefined ) {\n\t\t\tnextValue = `${ data.default }${ nextUnitValue }`;\n\t\t}\n\n\t\tonChangeProp?.( nextValue, changeProps );\n\t\tonUnitChange?.( nextUnitValue, changeProps );\n\n\t\tsetUnit( nextUnitValue );\n\t};\n\n\tconst mayUpdateUnit = ( event: SyntheticEvent< HTMLInputElement > ) => {\n\t\tif ( ! isNaN( Number( event.currentTarget.value ) ) ) {\n\t\t\trefParsedQuantity.current = undefined;\n\t\t\treturn;\n\t\t}\n\t\tconst [\n\t\t\tvalidParsedQuantity,\n\t\t\tvalidParsedUnit,\n\t\t] = getValidParsedQuantityAndUnit(\n\t\t\tevent.currentTarget.value,\n\t\t\tunits,\n\t\t\tparsedQuantity,\n\t\t\tunit\n\t\t);\n\n\t\trefParsedQuantity.current = validParsedQuantity;\n\n\t\tif ( isPressEnterToChange && validParsedUnit !== unit ) {\n\t\t\tconst data = Array.isArray( units )\n\t\t\t\t? units.find( ( option ) => option.value === validParsedUnit )\n\t\t\t\t: undefined;\n\t\t\tconst changeProps = { event, data };\n\n\t\t\t// The `onChange` callback already gets called, no need to call it explicitely.\n\t\t\tonUnitChange?.( validParsedUnit, changeProps );\n\n\t\t\tsetUnit( validParsedUnit );\n\t\t}\n\t};\n\n\tconst handleOnBlur: FocusEventHandler< HTMLInputElement > = ( event ) => {\n\t\tmayUpdateUnit( event );\n\t\tonBlurProp?.( event );\n\t};\n\n\tconst handleOnKeyDown = ( event: KeyboardEvent< HTMLInputElement > ) => {\n\t\tconst { key } = event;\n\t\tif ( key === 'Enter' ) {\n\t\t\tmayUpdateUnit( event );\n\t\t}\n\t};\n\n\t/**\n\t * \"Middleware\" function that intercepts updates from InputControl.\n\t * This allows us to tap into actions to transform the (next) state for\n\t * InputControl.\n\t *\n\t * @param state State from InputControl\n\t * @param action Action triggering state change\n\t * @return The updated state to apply to InputControl\n\t */\n\tconst unitControlStateReducer: StateReducer = ( state, action ) => {\n\t\tconst nextState = { ...state };\n\n\t\t/*\n\t\t * On commits (when pressing ENTER and on blur if\n\t\t * isPressEnterToChange is true), if a parse has been performed\n\t\t * then use that result to update the state.\n\t\t */\n\t\tif ( action.type === inputControlActionTypes.COMMIT ) {\n\t\t\tif ( refParsedQuantity.current !== undefined ) {\n\t\t\t\tnextState.value = (\n\t\t\t\t\trefParsedQuantity.current ?? ''\n\t\t\t\t).toString();\n\t\t\t\trefParsedQuantity.current = undefined;\n\t\t\t}\n\t\t}\n\n\t\treturn nextState;\n\t};\n\n\tlet stateReducer: StateReducer = unitControlStateReducer;\n\tif ( stateReducerProp ) {\n\t\tstateReducer = ( state, action ) => {\n\t\t\tconst baseState = unitControlStateReducer( state, action );\n\t\t\treturn stateReducerProp( baseState, action );\n\t\t};\n\t}\n\n\tconst inputSuffix = ! disableUnits ? (\n\t\t<UnitSelectControl\n\t\t\taria-label={ __( 'Select unit' ) }\n\t\t\tdisabled={ disabled }\n\t\t\tisUnitSelectTabbable={ isUnitSelectTabbable }\n\t\t\tonChange={ handleOnUnitChange }\n\t\t\tsize={ size }\n\t\t\tunit={ unit }\n\t\t\tunits={ units }\n\t\t\tonBlur={ onBlurProp }\n\t\t/>\n\t) : null;\n\n\tlet step = props.step;\n\n\t/*\n\t * If no step prop has been passed, lookup the active unit and\n\t * try to get step from `units`, or default to a value of `1`\n\t */\n\tif ( ! step && units ) {\n\t\tconst activeUnit = units.find( ( option ) => option.value === unit );\n\t\tstep = activeUnit?.step ?? 1;\n\t}\n\n\treturn (\n\t\t<Root className=\"components-unit-control-wrapper\" style={ style }>\n\t\t\t<ValueInput\n\t\t\t\taria-label={ label }\n\t\t\t\ttype={ isPressEnterToChange ? 'text' : 'number' }\n\t\t\t\t{ ...omit( props, [ 'children' ] ) }\n\t\t\t\tautoComplete={ autoComplete }\n\t\t\t\tclassName={ classes }\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tdisableUnits={ disableUnits }\n\t\t\t\tisPressEnterToChange={ isPressEnterToChange }\n\t\t\t\tlabel={ label }\n\t\t\t\tonBlur={ handleOnBlur }\n\t\t\t\tonKeyDown={ handleOnKeyDown }\n\t\t\t\tonChange={ handleOnQuantityChange }\n\t\t\t\tref={ forwardedRef }\n\t\t\t\tsize={ size }\n\t\t\t\tsuffix={ inputSuffix }\n\t\t\t\tvalue={ parsedQuantity ?? '' }\n\t\t\t\tstep={ step }\n\t\t\t\t__unstableStateReducer={ stateReducer }\n\t\t\t/>\n\t\t</Root>\n\t);\n}\n\n/**\n * `UnitControl` allows the user to set a numeric quantity as well as a unit (e.g. `px`).\n *\n *\n * @example\n * ```jsx\n * import { __experimentalUnitControl as UnitControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const Example = () => {\n * const [ value, setValue ] = useState( '10px' );\n *\n * return <UnitControl onChange={ setValue } value={ value } />;\n * };\n * ```\n */\nexport const UnitControl = forwardRef( UnforwardedUnitControl );\n\nexport { parseQuantityAndUnitFromRawValue, useCustomUnits } from './utils';\nexport default UnitControl;\n"]}