@wordpress/components 19.8.3 → 19.10.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 (256) hide show
  1. package/CHANGELOG.md +42 -0
  2. package/CONTRIBUTING.md +80 -7
  3. package/build/alignment-matrix-control/styles/alignment-matrix-control-styles.js +11 -11
  4. package/build/alignment-matrix-control/styles/alignment-matrix-control-styles.js.map +1 -1
  5. package/build/angle-picker-control/angle-circle.js +5 -7
  6. package/build/angle-picker-control/angle-circle.js.map +1 -1
  7. package/build/box-control/index.js +0 -21
  8. package/build/box-control/index.js.map +1 -1
  9. package/build/box-control/utils.js +1 -8
  10. package/build/box-control/utils.js.map +1 -1
  11. package/build/button/index.js +3 -5
  12. package/build/button/index.js.map +1 -1
  13. package/build/circular-option-picker/index.js +1 -2
  14. package/build/circular-option-picker/index.js.map +1 -1
  15. package/build/disabled/index.js +4 -76
  16. package/build/disabled/index.js.map +1 -1
  17. package/build/heading/hook.js +1 -1
  18. package/build/heading/hook.js.map +1 -1
  19. package/build/input-control/index.js +27 -4
  20. package/build/input-control/index.js.map +1 -1
  21. package/build/input-control/styles/input-control-styles.js +42 -30
  22. package/build/input-control/styles/input-control-styles.js.map +1 -1
  23. package/build/mobile/bottom-sheet-select-control/index.native.js +1 -0
  24. package/build/mobile/bottom-sheet-select-control/index.native.js.map +1 -1
  25. package/build/navigation/styles/navigation-styles.js +12 -12
  26. package/build/navigation/styles/navigation-styles.js.map +1 -1
  27. package/build/notice/index.native.js +44 -40
  28. package/build/notice/index.native.js.map +1 -1
  29. package/build/notice/list.native.js +27 -45
  30. package/build/notice/list.native.js.map +1 -1
  31. package/build/popover/index.js +6 -52
  32. package/build/popover/index.js.map +1 -1
  33. package/build/sandbox/index.js +2 -2
  34. package/build/sandbox/index.js.map +1 -1
  35. package/build/select-control/index.js +31 -4
  36. package/build/select-control/index.js.map +1 -1
  37. package/build/select-control/styles/select-control-styles.js +8 -8
  38. package/build/select-control/styles/select-control-styles.js.map +1 -1
  39. package/build/surface/styles.js +8 -8
  40. package/build/surface/styles.js.map +1 -1
  41. package/build/text/hook.js +5 -5
  42. package/build/text/hook.js.map +1 -1
  43. package/build/text/styles/text-mixins.native.js +1 -1
  44. package/build/text/styles/text-mixins.native.js.map +1 -1
  45. package/build/text/styles.js +7 -7
  46. package/build/text/styles.js.map +1 -1
  47. package/build/text-control/index.js +35 -28
  48. package/build/text-control/index.js.map +1 -1
  49. package/build/text-control/types.js +6 -0
  50. package/build/text-control/types.js.map +1 -0
  51. package/build/toggle-group-control/toggle-group-control-option-icon/component.js +6 -4
  52. package/build/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -1
  53. package/build/tools-panel/tools-panel-header/component.js +52 -36
  54. package/build/tools-panel/tools-panel-header/component.js.map +1 -1
  55. package/build/ui/spinner/component.js +1 -1
  56. package/build/ui/spinner/component.js.map +1 -1
  57. package/build/unit-control/index.js +3 -3
  58. package/build/unit-control/index.js.map +1 -1
  59. package/build/unit-control/styles/unit-control-styles.js +11 -20
  60. package/build/unit-control/styles/unit-control-styles.js.map +1 -1
  61. package/build/unit-control/utils.js.map +1 -1
  62. package/build/utils/colors-values.js +9 -24
  63. package/build/utils/colors-values.js.map +1 -1
  64. package/build-module/alignment-matrix-control/styles/alignment-matrix-control-styles.js +11 -11
  65. package/build-module/alignment-matrix-control/styles/alignment-matrix-control-styles.js.map +1 -1
  66. package/build-module/angle-picker-control/angle-circle.js +5 -7
  67. package/build-module/angle-picker-control/angle-circle.js.map +1 -1
  68. package/build-module/box-control/index.js +1 -20
  69. package/build-module/box-control/index.js.map +1 -1
  70. package/build-module/box-control/utils.js +0 -6
  71. package/build-module/box-control/utils.js.map +1 -1
  72. package/build-module/button/index.js +3 -4
  73. package/build-module/button/index.js.map +1 -1
  74. package/build-module/circular-option-picker/index.js +1 -2
  75. package/build-module/circular-option-picker/index.js.map +1 -1
  76. package/build-module/disabled/index.js +5 -76
  77. package/build-module/disabled/index.js.map +1 -1
  78. package/build-module/heading/hook.js +1 -1
  79. package/build-module/heading/hook.js.map +1 -1
  80. package/build-module/input-control/index.js +24 -3
  81. package/build-module/input-control/index.js.map +1 -1
  82. package/build-module/input-control/styles/input-control-styles.js +42 -30
  83. package/build-module/input-control/styles/input-control-styles.js.map +1 -1
  84. package/build-module/mobile/bottom-sheet-select-control/index.native.js +1 -0
  85. package/build-module/mobile/bottom-sheet-select-control/index.native.js.map +1 -1
  86. package/build-module/navigation/styles/navigation-styles.js +13 -13
  87. package/build-module/navigation/styles/navigation-styles.js.map +1 -1
  88. package/build-module/notice/index.native.js +45 -41
  89. package/build-module/notice/index.native.js.map +1 -1
  90. package/build-module/notice/list.native.js +28 -46
  91. package/build-module/notice/list.native.js.map +1 -1
  92. package/build-module/popover/index.js +6 -52
  93. package/build-module/popover/index.js.map +1 -1
  94. package/build-module/sandbox/index.js +2 -2
  95. package/build-module/sandbox/index.js.map +1 -1
  96. package/build-module/select-control/index.js +29 -3
  97. package/build-module/select-control/index.js.map +1 -1
  98. package/build-module/select-control/styles/select-control-styles.js +8 -8
  99. package/build-module/select-control/styles/select-control-styles.js.map +1 -1
  100. package/build-module/surface/styles.js +8 -8
  101. package/build-module/surface/styles.js.map +1 -1
  102. package/build-module/text/hook.js +5 -5
  103. package/build-module/text/hook.js.map +1 -1
  104. package/build-module/text/styles/text-mixins.native.js +2 -2
  105. package/build-module/text/styles/text-mixins.native.js.map +1 -1
  106. package/build-module/text/styles.js +7 -7
  107. package/build-module/text/styles.js.map +1 -1
  108. package/build-module/text-control/index.js +35 -27
  109. package/build-module/text-control/index.js.map +1 -1
  110. package/build-module/text-control/types.js +2 -0
  111. package/build-module/text-control/types.js.map +1 -0
  112. package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js +1 -5
  113. package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -1
  114. package/build-module/tools-panel/tools-panel-header/component.js +51 -36
  115. package/build-module/tools-panel/tools-panel-header/component.js.map +1 -1
  116. package/build-module/ui/spinner/component.js +1 -1
  117. package/build-module/ui/spinner/component.js.map +1 -1
  118. package/build-module/unit-control/index.js +3 -3
  119. package/build-module/unit-control/index.js.map +1 -1
  120. package/build-module/unit-control/styles/unit-control-styles.js +11 -20
  121. package/build-module/unit-control/styles/unit-control-styles.js.map +1 -1
  122. package/build-module/unit-control/utils.js.map +1 -1
  123. package/build-module/utils/colors-values.js +19 -23
  124. package/build-module/utils/colors-values.js.map +1 -1
  125. package/build-style/style-rtl.css +24 -0
  126. package/build-style/style.css +24 -0
  127. package/build-types/button/index.d.ts.map +1 -1
  128. package/build-types/circular-option-picker/index.d.ts.map +1 -1
  129. package/build-types/color-picker/styles.d.ts +3 -3
  130. package/build-types/disabled/index.d.ts.map +1 -1
  131. package/build-types/input-control/index.d.ts +23 -3
  132. package/build-types/input-control/index.d.ts.map +1 -1
  133. package/build-types/input-control/input-field.d.ts +1 -1
  134. package/build-types/input-control/input-field.d.ts.map +1 -1
  135. package/build-types/input-control/stories/index.d.ts +5 -5
  136. package/build-types/input-control/styles/input-control-styles.d.ts +1 -0
  137. package/build-types/input-control/styles/input-control-styles.d.ts.map +1 -1
  138. package/build-types/input-control/types.d.ts +79 -3
  139. package/build-types/input-control/types.d.ts.map +1 -1
  140. package/build-types/number-control/styles/number-control-styles.d.ts +1 -1
  141. package/build-types/popover/index.d.ts +0 -1
  142. package/build-types/popover/index.d.ts.map +1 -1
  143. package/build-types/select-control/index.d.ts +30 -26
  144. package/build-types/select-control/index.d.ts.map +1 -1
  145. package/build-types/select-control/stories/index.d.ts +23 -0
  146. package/build-types/select-control/stories/index.d.ts.map +1 -0
  147. package/build-types/select-control/styles/select-control-styles.d.ts +3 -4
  148. package/build-types/select-control/styles/select-control-styles.d.ts.map +1 -1
  149. package/build-types/select-control/test/select-control.d.ts +2 -0
  150. package/build-types/select-control/test/select-control.d.ts.map +1 -0
  151. package/build-types/select-control/types.d.ts +52 -1
  152. package/build-types/select-control/types.d.ts.map +1 -1
  153. package/build-types/text-control/index.d.ts +32 -0
  154. package/build-types/text-control/index.d.ts.map +1 -0
  155. package/build-types/text-control/stories/index.d.ts +13 -0
  156. package/build-types/text-control/stories/index.d.ts.map +1 -0
  157. package/build-types/text-control/types.d.ts +25 -0
  158. package/build-types/text-control/types.d.ts.map +1 -0
  159. package/build-types/toggle-group-control/toggle-group-control-option-icon/component.d.ts.map +1 -1
  160. package/build-types/tools-panel/tools-panel-header/component.d.ts.map +1 -1
  161. package/build-types/tools-panel/types.d.ts +0 -1
  162. package/build-types/tools-panel/types.d.ts.map +1 -1
  163. package/build-types/unit-control/index.d.ts +2 -2
  164. package/build-types/unit-control/index.d.ts.map +1 -1
  165. package/build-types/unit-control/styles/unit-control-styles.d.ts.map +1 -1
  166. package/build-types/unit-control/test/index.d.ts +2 -0
  167. package/build-types/unit-control/test/index.d.ts.map +1 -0
  168. package/build-types/unit-control/test/utils.d.ts +2 -0
  169. package/build-types/unit-control/test/utils.d.ts.map +1 -0
  170. package/build-types/unit-control/types.d.ts +1 -1
  171. package/build-types/unit-control/types.d.ts.map +1 -1
  172. package/build-types/unit-control/utils.d.ts +3 -3
  173. package/build-types/unit-control/utils.d.ts.map +1 -1
  174. package/build-types/utils/colors-values.d.ts +6 -146
  175. package/build-types/utils/colors-values.d.ts.map +1 -1
  176. package/package.json +17 -17
  177. package/src/alignment-matrix-control/styles/alignment-matrix-control-styles.js +5 -3
  178. package/src/angle-picker-control/angle-circle.js +3 -3
  179. package/src/box-control/README.md +0 -74
  180. package/src/box-control/index.js +0 -15
  181. package/src/box-control/stories/index.js +0 -29
  182. package/src/box-control/utils.js +0 -7
  183. package/src/button/index.js +2 -4
  184. package/src/button/test/index.js +16 -1
  185. package/src/circular-option-picker/index.js +1 -2
  186. package/src/color-palette/README.md +0 -1
  187. package/src/color-palette/test/__snapshots__/index.js.snap +2 -3
  188. package/src/confirm-dialog/stories/index.js +87 -99
  189. package/src/date-time/stories/index.js +19 -0
  190. package/src/date-time/test/date.js +107 -78
  191. package/src/dimension-control/test/__snapshots__/index.test.js.snap +4 -4
  192. package/src/disabled/index.js +5 -90
  193. package/src/form-file-upload/test/index.js +15 -12
  194. package/src/heading/hook.ts +1 -1
  195. package/src/heading/test/__snapshots__/index.js.snap +3 -3
  196. package/src/input-control/README.md +3 -3
  197. package/src/input-control/index.tsx +23 -3
  198. package/src/input-control/stories/index.tsx +63 -0
  199. package/src/input-control/styles/input-control-styles.tsx +20 -7
  200. package/src/input-control/types.ts +79 -2
  201. package/src/menu-item/style.scss +10 -0
  202. package/src/mobile/bottom-sheet/bottom-sheet-navigation/test/navigation-container.native.js +8 -1
  203. package/src/mobile/bottom-sheet-select-control/index.native.js +1 -0
  204. package/src/mobile/html-text-input/style.android.scss +1 -0
  205. package/src/mobile/html-text-input/style.ios.scss +1 -0
  206. package/src/mobile/link-settings/test/link-settings-navigation.native.js +9 -1
  207. package/src/navigation/styles/navigation-styles.js +5 -5
  208. package/src/notice/index.native.js +44 -54
  209. package/src/notice/list.native.js +27 -51
  210. package/src/notice/style.native.scss +1 -0
  211. package/src/popover/index.js +5 -51
  212. package/src/query-controls/README.md +2 -2
  213. package/src/sandbox/index.js +2 -2
  214. package/src/select-control/README.md +2 -2
  215. package/src/select-control/index.tsx +30 -29
  216. package/src/select-control/stories/index.tsx +90 -0
  217. package/src/select-control/styles/select-control-styles.ts +10 -9
  218. package/src/select-control/test/{select-control.js → select-control.tsx} +2 -2
  219. package/src/select-control/types.ts +66 -1
  220. package/src/surface/styles.js +1 -1
  221. package/src/text/hook.js +1 -1
  222. package/src/text/styles/text-mixins.native.js +2 -2
  223. package/src/text/styles.js +1 -1
  224. package/src/text/test/__snapshots__/{index.js.snap → index.tsx.snap} +16 -0
  225. package/src/text/test/{index.js → index.tsx} +12 -6
  226. package/src/text-control/index.tsx +84 -0
  227. package/src/text-control/stories/index.tsx +66 -0
  228. package/src/text-control/types.ts +29 -0
  229. package/src/toggle-group-control/toggle-group-control-option-icon/component.tsx +1 -5
  230. package/src/toolbar-group/style.scss +20 -0
  231. package/src/tools-panel/test/__snapshots__/index.js.snap +2 -2
  232. package/src/tools-panel/test/index.js +71 -18
  233. package/src/tools-panel/tools-panel-header/component.tsx +75 -33
  234. package/src/tools-panel/types.ts +0 -1
  235. package/src/tooltip/test/index.js +6 -0
  236. package/src/ui/spinner/component.js +1 -1
  237. package/src/ui/spinner/test/__snapshots__/index.js.snap +3 -3
  238. package/src/unit-control/index.tsx +2 -5
  239. package/src/unit-control/styles/unit-control-styles.ts +3 -13
  240. package/src/unit-control/test/__snapshots__/index.tsx.snap +33 -0
  241. package/src/unit-control/test/{index.js → index.tsx} +214 -165
  242. package/src/unit-control/test/{utils.js → utils.ts} +38 -19
  243. package/src/unit-control/types.ts +4 -1
  244. package/src/unit-control/utils.ts +5 -3
  245. package/src/utils/colors-values.js +18 -22
  246. package/tsconfig.json +9 -2
  247. package/tsconfig.tsbuildinfo +1 -1
  248. package/build/box-control/visualizer.js +0 -165
  249. package/build/box-control/visualizer.js.map +0 -1
  250. package/build-module/box-control/visualizer.js +0 -154
  251. package/build-module/box-control/visualizer.js.map +0 -1
  252. package/src/box-control/visualizer.js +0 -116
  253. package/src/input-control/stories/index.js +0 -71
  254. package/src/select-control/stories/index.js +0 -104
  255. package/src/text-control/index.js +0 -72
  256. package/src/text-control/stories/index.js +0 -46
@@ -9,27 +9,27 @@ import { css } from '@emotion/react';
9
9
  */
10
10
 
11
11
  import { COLORS, CONFIG } from '../utils';
12
- export const Text = /*#__PURE__*/css("color:", COLORS.darkGray.primary, ";line-height:", CONFIG.fontLineHeightBase, ";margin:0;" + (process.env.NODE_ENV === "production" ? "" : ";label:Text;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGV4dC9zdHlsZXMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBVXVCIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGV4dC9zdHlsZXMuanMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IENPTE9SUywgQ09ORklHIH0gZnJvbSAnLi4vdXRpbHMnO1xuXG5leHBvcnQgY29uc3QgVGV4dCA9IGNzc2Bcblx0Y29sb3I6ICR7IENPTE9SUy5kYXJrR3JheS5wcmltYXJ5IH07XG5cdGxpbmUtaGVpZ2h0OiAkeyBDT05GSUcuZm9udExpbmVIZWlnaHRCYXNlIH07XG5cdG1hcmdpbjogMDtcbmA7XG5cbmV4cG9ydCBjb25zdCBibG9jayA9IGNzc2Bcblx0ZGlzcGxheTogYmxvY2s7XG5gO1xuXG5leHBvcnQgY29uc3QgcG9zaXRpdmUgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuYWxlcnQuZ3JlZW4gfTtcbmA7XG5cbmV4cG9ydCBjb25zdCBkZXN0cnVjdGl2ZSA9IGNzc2Bcblx0Y29sb3I6ICR7IENPTE9SUy5hbGVydC5yZWQgfTtcbmA7XG5cbmV4cG9ydCBjb25zdCBtdXRlZCA9IGNzc2Bcblx0Y29sb3I6ICR7IENPTE9SUy5tZWRpdW1HcmF5LnRleHQgfTtcbmA7XG5cbmV4cG9ydCBjb25zdCBoaWdobGlnaHRlclRleHQgPSBjc3NgXG5cdG1hcmsge1xuXHRcdGJhY2tncm91bmQ6ICR7IENPTE9SUy5hbGVydC55ZWxsb3cgfTtcblx0XHRib3JkZXItcmFkaXVzOiAycHg7XG5cdFx0Ym94LXNoYWRvdzogMCAwIDAgMXB4IHJnYmEoIDAsIDAsIDAsIDAuMDUgKSBpbnNldCxcblx0XHRcdDAgLTFweCAwIHJnYmEoIDAsIDAsIDAsIDAuMSApIGluc2V0O1xuXHR9XG5gO1xuXG5leHBvcnQgY29uc3QgdXBwZXJDYXNlID0gY3NzYFxuXHR0ZXh0LXRyYW5zZm9ybTogdXBwZXJjYXNlO1xuYDtcbiJdfQ== */");
12
+ export const Text = /*#__PURE__*/css("color:", COLORS.gray[900], ";line-height:", CONFIG.fontLineHeightBase, ";margin:0;" + (process.env.NODE_ENV === "production" ? "" : ";label:Text;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGV4dC9zdHlsZXMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBVXVCIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGV4dC9zdHlsZXMuanMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IENPTE9SUywgQ09ORklHIH0gZnJvbSAnLi4vdXRpbHMnO1xuXG5leHBvcnQgY29uc3QgVGV4dCA9IGNzc2Bcblx0Y29sb3I6ICR7IENPTE9SUy5ncmF5WyA5MDAgXSB9O1xuXHRsaW5lLWhlaWdodDogJHsgQ09ORklHLmZvbnRMaW5lSGVpZ2h0QmFzZSB9O1xuXHRtYXJnaW46IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgYmxvY2sgPSBjc3NgXG5cdGRpc3BsYXk6IGJsb2NrO1xuYDtcblxuZXhwb3J0IGNvbnN0IHBvc2l0aXZlID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLmFsZXJ0LmdyZWVuIH07XG5gO1xuXG5leHBvcnQgY29uc3QgZGVzdHJ1Y3RpdmUgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuYWxlcnQucmVkIH07XG5gO1xuXG5leHBvcnQgY29uc3QgbXV0ZWQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMubWVkaXVtR3JheS50ZXh0IH07XG5gO1xuXG5leHBvcnQgY29uc3QgaGlnaGxpZ2h0ZXJUZXh0ID0gY3NzYFxuXHRtYXJrIHtcblx0XHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMuYWxlcnQueWVsbG93IH07XG5cdFx0Ym9yZGVyLXJhZGl1czogMnB4O1xuXHRcdGJveC1zaGFkb3c6IDAgMCAwIDFweCByZ2JhKCAwLCAwLCAwLCAwLjA1ICkgaW5zZXQsXG5cdFx0XHQwIC0xcHggMCByZ2JhKCAwLCAwLCAwLCAwLjEgKSBpbnNldDtcblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IHVwcGVyQ2FzZSA9IGNzc2Bcblx0dGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTtcbmA7XG4iXX0= */");
13
13
  export const block = process.env.NODE_ENV === "production" ? {
14
14
  name: "4zleql",
15
15
  styles: "display:block"
16
16
  } : {
17
17
  name: "14aceuy-block",
18
18
  styles: "display:block;label:block;",
19
- map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGV4dC9zdHlsZXMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZ0J3QiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL3RleHQvc3R5bGVzLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuZGFya0dyYXkucHJpbWFyeSB9O1xuXHRsaW5lLWhlaWdodDogJHsgQ09ORklHLmZvbnRMaW5lSGVpZ2h0QmFzZSB9O1xuXHRtYXJnaW46IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgYmxvY2sgPSBjc3NgXG5cdGRpc3BsYXk6IGJsb2NrO1xuYDtcblxuZXhwb3J0IGNvbnN0IHBvc2l0aXZlID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLmFsZXJ0LmdyZWVuIH07XG5gO1xuXG5leHBvcnQgY29uc3QgZGVzdHJ1Y3RpdmUgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuYWxlcnQucmVkIH07XG5gO1xuXG5leHBvcnQgY29uc3QgbXV0ZWQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMubWVkaXVtR3JheS50ZXh0IH07XG5gO1xuXG5leHBvcnQgY29uc3QgaGlnaGxpZ2h0ZXJUZXh0ID0gY3NzYFxuXHRtYXJrIHtcblx0XHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMuYWxlcnQueWVsbG93IH07XG5cdFx0Ym9yZGVyLXJhZGl1czogMnB4O1xuXHRcdGJveC1zaGFkb3c6IDAgMCAwIDFweCByZ2JhKCAwLCAwLCAwLCAwLjA1ICkgaW5zZXQsXG5cdFx0XHQwIC0xcHggMCByZ2JhKCAwLCAwLCAwLCAwLjEgKSBpbnNldDtcblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IHVwcGVyQ2FzZSA9IGNzc2Bcblx0dGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTtcbmA7XG4iXX0= */",
19
+ map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGV4dC9zdHlsZXMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZ0J3QiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL3RleHQvc3R5bGVzLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuZ3JheVsgOTAwIF0gfTtcblx0bGluZS1oZWlnaHQ6ICR7IENPTkZJRy5mb250TGluZUhlaWdodEJhc2UgfTtcblx0bWFyZ2luOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IGJsb2NrID0gY3NzYFxuXHRkaXNwbGF5OiBibG9jaztcbmA7XG5cbmV4cG9ydCBjb25zdCBwb3NpdGl2ZSA9IGNzc2Bcblx0Y29sb3I6ICR7IENPTE9SUy5hbGVydC5ncmVlbiB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IGRlc3RydWN0aXZlID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLmFsZXJ0LnJlZCB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IG11dGVkID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLm1lZGl1bUdyYXkudGV4dCB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IGhpZ2hsaWdodGVyVGV4dCA9IGNzc2Bcblx0bWFyayB7XG5cdFx0YmFja2dyb3VuZDogJHsgQ09MT1JTLmFsZXJ0LnllbGxvdyB9O1xuXHRcdGJvcmRlci1yYWRpdXM6IDJweDtcblx0XHRib3gtc2hhZG93OiAwIDAgMCAxcHggcmdiYSggMCwgMCwgMCwgMC4wNSApIGluc2V0LFxuXHRcdFx0MCAtMXB4IDAgcmdiYSggMCwgMCwgMCwgMC4xICkgaW5zZXQ7XG5cdH1cbmA7XG5cbmV4cG9ydCBjb25zdCB1cHBlckNhc2UgPSBjc3NgXG5cdHRleHQtdHJhbnNmb3JtOiB1cHBlcmNhc2U7XG5gO1xuIl19 */",
20
20
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
21
21
  };
22
- export const positive = /*#__PURE__*/css("color:", COLORS.alert.green, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:positive;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGV4dC9zdHlsZXMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBb0IyQiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL3RleHQvc3R5bGVzLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuZGFya0dyYXkucHJpbWFyeSB9O1xuXHRsaW5lLWhlaWdodDogJHsgQ09ORklHLmZvbnRMaW5lSGVpZ2h0QmFzZSB9O1xuXHRtYXJnaW46IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgYmxvY2sgPSBjc3NgXG5cdGRpc3BsYXk6IGJsb2NrO1xuYDtcblxuZXhwb3J0IGNvbnN0IHBvc2l0aXZlID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLmFsZXJ0LmdyZWVuIH07XG5gO1xuXG5leHBvcnQgY29uc3QgZGVzdHJ1Y3RpdmUgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuYWxlcnQucmVkIH07XG5gO1xuXG5leHBvcnQgY29uc3QgbXV0ZWQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMubWVkaXVtR3JheS50ZXh0IH07XG5gO1xuXG5leHBvcnQgY29uc3QgaGlnaGxpZ2h0ZXJUZXh0ID0gY3NzYFxuXHRtYXJrIHtcblx0XHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMuYWxlcnQueWVsbG93IH07XG5cdFx0Ym9yZGVyLXJhZGl1czogMnB4O1xuXHRcdGJveC1zaGFkb3c6IDAgMCAwIDFweCByZ2JhKCAwLCAwLCAwLCAwLjA1ICkgaW5zZXQsXG5cdFx0XHQwIC0xcHggMCByZ2JhKCAwLCAwLCAwLCAwLjEgKSBpbnNldDtcblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IHVwcGVyQ2FzZSA9IGNzc2Bcblx0dGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTtcbmA7XG4iXX0= */");
23
- export const destructive = /*#__PURE__*/css("color:", COLORS.alert.red, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:destructive;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGV4dC9zdHlsZXMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBd0I4QiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL3RleHQvc3R5bGVzLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuZGFya0dyYXkucHJpbWFyeSB9O1xuXHRsaW5lLWhlaWdodDogJHsgQ09ORklHLmZvbnRMaW5lSGVpZ2h0QmFzZSB9O1xuXHRtYXJnaW46IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgYmxvY2sgPSBjc3NgXG5cdGRpc3BsYXk6IGJsb2NrO1xuYDtcblxuZXhwb3J0IGNvbnN0IHBvc2l0aXZlID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLmFsZXJ0LmdyZWVuIH07XG5gO1xuXG5leHBvcnQgY29uc3QgZGVzdHJ1Y3RpdmUgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuYWxlcnQucmVkIH07XG5gO1xuXG5leHBvcnQgY29uc3QgbXV0ZWQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMubWVkaXVtR3JheS50ZXh0IH07XG5gO1xuXG5leHBvcnQgY29uc3QgaGlnaGxpZ2h0ZXJUZXh0ID0gY3NzYFxuXHRtYXJrIHtcblx0XHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMuYWxlcnQueWVsbG93IH07XG5cdFx0Ym9yZGVyLXJhZGl1czogMnB4O1xuXHRcdGJveC1zaGFkb3c6IDAgMCAwIDFweCByZ2JhKCAwLCAwLCAwLCAwLjA1ICkgaW5zZXQsXG5cdFx0XHQwIC0xcHggMCByZ2JhKCAwLCAwLCAwLCAwLjEgKSBpbnNldDtcblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IHVwcGVyQ2FzZSA9IGNzc2Bcblx0dGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTtcbmA7XG4iXX0= */");
24
- export const muted = /*#__PURE__*/css("color:", COLORS.mediumGray.text, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:muted;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGV4dC9zdHlsZXMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNEJ3QiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL3RleHQvc3R5bGVzLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuZGFya0dyYXkucHJpbWFyeSB9O1xuXHRsaW5lLWhlaWdodDogJHsgQ09ORklHLmZvbnRMaW5lSGVpZ2h0QmFzZSB9O1xuXHRtYXJnaW46IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgYmxvY2sgPSBjc3NgXG5cdGRpc3BsYXk6IGJsb2NrO1xuYDtcblxuZXhwb3J0IGNvbnN0IHBvc2l0aXZlID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLmFsZXJ0LmdyZWVuIH07XG5gO1xuXG5leHBvcnQgY29uc3QgZGVzdHJ1Y3RpdmUgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuYWxlcnQucmVkIH07XG5gO1xuXG5leHBvcnQgY29uc3QgbXV0ZWQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMubWVkaXVtR3JheS50ZXh0IH07XG5gO1xuXG5leHBvcnQgY29uc3QgaGlnaGxpZ2h0ZXJUZXh0ID0gY3NzYFxuXHRtYXJrIHtcblx0XHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMuYWxlcnQueWVsbG93IH07XG5cdFx0Ym9yZGVyLXJhZGl1czogMnB4O1xuXHRcdGJveC1zaGFkb3c6IDAgMCAwIDFweCByZ2JhKCAwLCAwLCAwLCAwLjA1ICkgaW5zZXQsXG5cdFx0XHQwIC0xcHggMCByZ2JhKCAwLCAwLCAwLCAwLjEgKSBpbnNldDtcblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IHVwcGVyQ2FzZSA9IGNzc2Bcblx0dGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTtcbmA7XG4iXX0= */");
25
- export const highlighterText = /*#__PURE__*/css("mark{background:", COLORS.alert.yellow, ";border-radius:2px;box-shadow:0 0 0 1px rgba( 0, 0, 0, 0.05 ) inset,0 -1px 0 rgba( 0, 0, 0, 0.1 ) inset;}" + (process.env.NODE_ENV === "production" ? "" : ";label:highlighterText;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGV4dC9zdHlsZXMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZ0NrQyIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL3RleHQvc3R5bGVzLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuZGFya0dyYXkucHJpbWFyeSB9O1xuXHRsaW5lLWhlaWdodDogJHsgQ09ORklHLmZvbnRMaW5lSGVpZ2h0QmFzZSB9O1xuXHRtYXJnaW46IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgYmxvY2sgPSBjc3NgXG5cdGRpc3BsYXk6IGJsb2NrO1xuYDtcblxuZXhwb3J0IGNvbnN0IHBvc2l0aXZlID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLmFsZXJ0LmdyZWVuIH07XG5gO1xuXG5leHBvcnQgY29uc3QgZGVzdHJ1Y3RpdmUgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuYWxlcnQucmVkIH07XG5gO1xuXG5leHBvcnQgY29uc3QgbXV0ZWQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMubWVkaXVtR3JheS50ZXh0IH07XG5gO1xuXG5leHBvcnQgY29uc3QgaGlnaGxpZ2h0ZXJUZXh0ID0gY3NzYFxuXHRtYXJrIHtcblx0XHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMuYWxlcnQueWVsbG93IH07XG5cdFx0Ym9yZGVyLXJhZGl1czogMnB4O1xuXHRcdGJveC1zaGFkb3c6IDAgMCAwIDFweCByZ2JhKCAwLCAwLCAwLCAwLjA1ICkgaW5zZXQsXG5cdFx0XHQwIC0xcHggMCByZ2JhKCAwLCAwLCAwLCAwLjEgKSBpbnNldDtcblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IHVwcGVyQ2FzZSA9IGNzc2Bcblx0dGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTtcbmA7XG4iXX0= */");
22
+ export const positive = /*#__PURE__*/css("color:", COLORS.alert.green, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:positive;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGV4dC9zdHlsZXMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBb0IyQiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL3RleHQvc3R5bGVzLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuZ3JheVsgOTAwIF0gfTtcblx0bGluZS1oZWlnaHQ6ICR7IENPTkZJRy5mb250TGluZUhlaWdodEJhc2UgfTtcblx0bWFyZ2luOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IGJsb2NrID0gY3NzYFxuXHRkaXNwbGF5OiBibG9jaztcbmA7XG5cbmV4cG9ydCBjb25zdCBwb3NpdGl2ZSA9IGNzc2Bcblx0Y29sb3I6ICR7IENPTE9SUy5hbGVydC5ncmVlbiB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IGRlc3RydWN0aXZlID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLmFsZXJ0LnJlZCB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IG11dGVkID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLm1lZGl1bUdyYXkudGV4dCB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IGhpZ2hsaWdodGVyVGV4dCA9IGNzc2Bcblx0bWFyayB7XG5cdFx0YmFja2dyb3VuZDogJHsgQ09MT1JTLmFsZXJ0LnllbGxvdyB9O1xuXHRcdGJvcmRlci1yYWRpdXM6IDJweDtcblx0XHRib3gtc2hhZG93OiAwIDAgMCAxcHggcmdiYSggMCwgMCwgMCwgMC4wNSApIGluc2V0LFxuXHRcdFx0MCAtMXB4IDAgcmdiYSggMCwgMCwgMCwgMC4xICkgaW5zZXQ7XG5cdH1cbmA7XG5cbmV4cG9ydCBjb25zdCB1cHBlckNhc2UgPSBjc3NgXG5cdHRleHQtdHJhbnNmb3JtOiB1cHBlcmNhc2U7XG5gO1xuIl19 */");
23
+ export const destructive = /*#__PURE__*/css("color:", COLORS.alert.red, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:destructive;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGV4dC9zdHlsZXMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBd0I4QiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL3RleHQvc3R5bGVzLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuZ3JheVsgOTAwIF0gfTtcblx0bGluZS1oZWlnaHQ6ICR7IENPTkZJRy5mb250TGluZUhlaWdodEJhc2UgfTtcblx0bWFyZ2luOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IGJsb2NrID0gY3NzYFxuXHRkaXNwbGF5OiBibG9jaztcbmA7XG5cbmV4cG9ydCBjb25zdCBwb3NpdGl2ZSA9IGNzc2Bcblx0Y29sb3I6ICR7IENPTE9SUy5hbGVydC5ncmVlbiB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IGRlc3RydWN0aXZlID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLmFsZXJ0LnJlZCB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IG11dGVkID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLm1lZGl1bUdyYXkudGV4dCB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IGhpZ2hsaWdodGVyVGV4dCA9IGNzc2Bcblx0bWFyayB7XG5cdFx0YmFja2dyb3VuZDogJHsgQ09MT1JTLmFsZXJ0LnllbGxvdyB9O1xuXHRcdGJvcmRlci1yYWRpdXM6IDJweDtcblx0XHRib3gtc2hhZG93OiAwIDAgMCAxcHggcmdiYSggMCwgMCwgMCwgMC4wNSApIGluc2V0LFxuXHRcdFx0MCAtMXB4IDAgcmdiYSggMCwgMCwgMCwgMC4xICkgaW5zZXQ7XG5cdH1cbmA7XG5cbmV4cG9ydCBjb25zdCB1cHBlckNhc2UgPSBjc3NgXG5cdHRleHQtdHJhbnNmb3JtOiB1cHBlcmNhc2U7XG5gO1xuIl19 */");
24
+ export const muted = /*#__PURE__*/css("color:", COLORS.mediumGray.text, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:muted;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGV4dC9zdHlsZXMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNEJ3QiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL3RleHQvc3R5bGVzLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuZ3JheVsgOTAwIF0gfTtcblx0bGluZS1oZWlnaHQ6ICR7IENPTkZJRy5mb250TGluZUhlaWdodEJhc2UgfTtcblx0bWFyZ2luOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IGJsb2NrID0gY3NzYFxuXHRkaXNwbGF5OiBibG9jaztcbmA7XG5cbmV4cG9ydCBjb25zdCBwb3NpdGl2ZSA9IGNzc2Bcblx0Y29sb3I6ICR7IENPTE9SUy5hbGVydC5ncmVlbiB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IGRlc3RydWN0aXZlID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLmFsZXJ0LnJlZCB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IG11dGVkID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLm1lZGl1bUdyYXkudGV4dCB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IGhpZ2hsaWdodGVyVGV4dCA9IGNzc2Bcblx0bWFyayB7XG5cdFx0YmFja2dyb3VuZDogJHsgQ09MT1JTLmFsZXJ0LnllbGxvdyB9O1xuXHRcdGJvcmRlci1yYWRpdXM6IDJweDtcblx0XHRib3gtc2hhZG93OiAwIDAgMCAxcHggcmdiYSggMCwgMCwgMCwgMC4wNSApIGluc2V0LFxuXHRcdFx0MCAtMXB4IDAgcmdiYSggMCwgMCwgMCwgMC4xICkgaW5zZXQ7XG5cdH1cbmA7XG5cbmV4cG9ydCBjb25zdCB1cHBlckNhc2UgPSBjc3NgXG5cdHRleHQtdHJhbnNmb3JtOiB1cHBlcmNhc2U7XG5gO1xuIl19 */");
25
+ export const highlighterText = /*#__PURE__*/css("mark{background:", COLORS.alert.yellow, ";border-radius:2px;box-shadow:0 0 0 1px rgba( 0, 0, 0, 0.05 ) inset,0 -1px 0 rgba( 0, 0, 0, 0.1 ) inset;}" + (process.env.NODE_ENV === "production" ? "" : ";label:highlighterText;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGV4dC9zdHlsZXMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZ0NrQyIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL3RleHQvc3R5bGVzLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuZ3JheVsgOTAwIF0gfTtcblx0bGluZS1oZWlnaHQ6ICR7IENPTkZJRy5mb250TGluZUhlaWdodEJhc2UgfTtcblx0bWFyZ2luOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IGJsb2NrID0gY3NzYFxuXHRkaXNwbGF5OiBibG9jaztcbmA7XG5cbmV4cG9ydCBjb25zdCBwb3NpdGl2ZSA9IGNzc2Bcblx0Y29sb3I6ICR7IENPTE9SUy5hbGVydC5ncmVlbiB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IGRlc3RydWN0aXZlID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLmFsZXJ0LnJlZCB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IG11dGVkID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLm1lZGl1bUdyYXkudGV4dCB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IGhpZ2hsaWdodGVyVGV4dCA9IGNzc2Bcblx0bWFyayB7XG5cdFx0YmFja2dyb3VuZDogJHsgQ09MT1JTLmFsZXJ0LnllbGxvdyB9O1xuXHRcdGJvcmRlci1yYWRpdXM6IDJweDtcblx0XHRib3gtc2hhZG93OiAwIDAgMCAxcHggcmdiYSggMCwgMCwgMCwgMC4wNSApIGluc2V0LFxuXHRcdFx0MCAtMXB4IDAgcmdiYSggMCwgMCwgMCwgMC4xICkgaW5zZXQ7XG5cdH1cbmA7XG5cbmV4cG9ydCBjb25zdCB1cHBlckNhc2UgPSBjc3NgXG5cdHRleHQtdHJhbnNmb3JtOiB1cHBlcmNhc2U7XG5gO1xuIl19 */");
26
26
  export const upperCase = process.env.NODE_ENV === "production" ? {
27
27
  name: "50zrmy",
28
28
  styles: "text-transform:uppercase"
29
29
  } : {
30
30
  name: "1mrt3zt-upperCase",
31
31
  styles: "text-transform:uppercase;label:upperCase;",
32
- map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGV4dC9zdHlsZXMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBeUM0QiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL3RleHQvc3R5bGVzLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuZGFya0dyYXkucHJpbWFyeSB9O1xuXHRsaW5lLWhlaWdodDogJHsgQ09ORklHLmZvbnRMaW5lSGVpZ2h0QmFzZSB9O1xuXHRtYXJnaW46IDA7XG5gO1xuXG5leHBvcnQgY29uc3QgYmxvY2sgPSBjc3NgXG5cdGRpc3BsYXk6IGJsb2NrO1xuYDtcblxuZXhwb3J0IGNvbnN0IHBvc2l0aXZlID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLmFsZXJ0LmdyZWVuIH07XG5gO1xuXG5leHBvcnQgY29uc3QgZGVzdHJ1Y3RpdmUgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuYWxlcnQucmVkIH07XG5gO1xuXG5leHBvcnQgY29uc3QgbXV0ZWQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMubWVkaXVtR3JheS50ZXh0IH07XG5gO1xuXG5leHBvcnQgY29uc3QgaGlnaGxpZ2h0ZXJUZXh0ID0gY3NzYFxuXHRtYXJrIHtcblx0XHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMuYWxlcnQueWVsbG93IH07XG5cdFx0Ym9yZGVyLXJhZGl1czogMnB4O1xuXHRcdGJveC1zaGFkb3c6IDAgMCAwIDFweCByZ2JhKCAwLCAwLCAwLCAwLjA1ICkgaW5zZXQsXG5cdFx0XHQwIC0xcHggMCByZ2JhKCAwLCAwLCAwLCAwLjEgKSBpbnNldDtcblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IHVwcGVyQ2FzZSA9IGNzc2Bcblx0dGV4dC10cmFuc2Zvcm06IHVwcGVyY2FzZTtcbmA7XG4iXX0= */",
32
+ map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdGV4dC9zdHlsZXMuanMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBeUM0QiIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL3RleHQvc3R5bGVzLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBDT0xPUlMsIENPTkZJRyB9IGZyb20gJy4uL3V0aWxzJztcblxuZXhwb3J0IGNvbnN0IFRleHQgPSBjc3NgXG5cdGNvbG9yOiAkeyBDT0xPUlMuZ3JheVsgOTAwIF0gfTtcblx0bGluZS1oZWlnaHQ6ICR7IENPTkZJRy5mb250TGluZUhlaWdodEJhc2UgfTtcblx0bWFyZ2luOiAwO1xuYDtcblxuZXhwb3J0IGNvbnN0IGJsb2NrID0gY3NzYFxuXHRkaXNwbGF5OiBibG9jaztcbmA7XG5cbmV4cG9ydCBjb25zdCBwb3NpdGl2ZSA9IGNzc2Bcblx0Y29sb3I6ICR7IENPTE9SUy5hbGVydC5ncmVlbiB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IGRlc3RydWN0aXZlID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLmFsZXJ0LnJlZCB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IG11dGVkID0gY3NzYFxuXHRjb2xvcjogJHsgQ09MT1JTLm1lZGl1bUdyYXkudGV4dCB9O1xuYDtcblxuZXhwb3J0IGNvbnN0IGhpZ2hsaWdodGVyVGV4dCA9IGNzc2Bcblx0bWFyayB7XG5cdFx0YmFja2dyb3VuZDogJHsgQ09MT1JTLmFsZXJ0LnllbGxvdyB9O1xuXHRcdGJvcmRlci1yYWRpdXM6IDJweDtcblx0XHRib3gtc2hhZG93OiAwIDAgMCAxcHggcmdiYSggMCwgMCwgMCwgMC4wNSApIGluc2V0LFxuXHRcdFx0MCAtMXB4IDAgcmdiYSggMCwgMCwgMCwgMC4xICkgaW5zZXQ7XG5cdH1cbmA7XG5cbmV4cG9ydCBjb25zdCB1cHBlckNhc2UgPSBjc3NgXG5cdHRleHQtdHJhbnNmb3JtOiB1cHBlcmNhc2U7XG5gO1xuIl19 */",
33
33
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
34
34
  };
35
35
  //# sourceMappingURL=styles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/text/styles.js"],"names":["css","COLORS","CONFIG","Text","darkGray","primary","fontLineHeightBase","block","positive","alert","green","destructive","red","muted","mediumGray","text","highlighterText","yellow","upperCase"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,GAAT,QAAoB,gBAApB;AAEA;AACA;AACA;;AACA,SAASC,MAAT,EAAiBC,MAAjB,QAA+B,UAA/B;AAEA,OAAO,MAAMC,IAAI,gBAAGH,GAAH,WACNC,MAAM,CAACG,QAAP,CAAgBC,OADV,mBAEAH,MAAM,CAACI,kBAFP,uhDAAV;AAMP,OAAO,MAAMC,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAAX;AAIP,OAAO,MAAMC,QAAQ,gBAAGR,GAAH,WACVC,MAAM,CAACQ,KAAP,CAAaC,KADH,khDAAd;AAIP,OAAO,MAAMC,WAAW,gBAAGX,GAAH,WACbC,MAAM,CAACQ,KAAP,CAAaG,GADA,qhDAAjB;AAIP,OAAO,MAAMC,KAAK,gBAAGb,GAAH,WACPC,MAAM,CAACa,UAAP,CAAkBC,IADX,+gDAAX;AAIP,OAAO,MAAMC,eAAe,gBAAGhB,GAAH,qBAEXC,MAAM,CAACQ,KAAP,CAAaQ,MAFF,ioDAArB;AASP,OAAO,MAAMC,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAAf","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport { COLORS, CONFIG } from '../utils';\n\nexport const Text = css`\n\tcolor: ${ COLORS.darkGray.primary };\n\tline-height: ${ CONFIG.fontLineHeightBase };\n\tmargin: 0;\n`;\n\nexport const block = css`\n\tdisplay: block;\n`;\n\nexport const positive = css`\n\tcolor: ${ COLORS.alert.green };\n`;\n\nexport const destructive = css`\n\tcolor: ${ COLORS.alert.red };\n`;\n\nexport const muted = css`\n\tcolor: ${ COLORS.mediumGray.text };\n`;\n\nexport const highlighterText = css`\n\tmark {\n\t\tbackground: ${ COLORS.alert.yellow };\n\t\tborder-radius: 2px;\n\t\tbox-shadow: 0 0 0 1px rgba( 0, 0, 0, 0.05 ) inset,\n\t\t\t0 -1px 0 rgba( 0, 0, 0, 0.1 ) inset;\n\t}\n`;\n\nexport const upperCase = css`\n\ttext-transform: uppercase;\n`;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/text/styles.js"],"names":["css","COLORS","CONFIG","Text","gray","fontLineHeightBase","block","positive","alert","green","destructive","red","muted","mediumGray","text","highlighterText","yellow","upperCase"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,GAAT,QAAoB,gBAApB;AAEA;AACA;AACA;;AACA,SAASC,MAAT,EAAiBC,MAAjB,QAA+B,UAA/B;AAEA,OAAO,MAAMC,IAAI,gBAAGH,GAAH,WACNC,MAAM,CAACG,IAAP,CAAa,GAAb,CADM,mBAEAF,MAAM,CAACG,kBAFP,+gDAAV;AAMP,OAAO,MAAMC,KAAK;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAAX;AAIP,OAAO,MAAMC,QAAQ,gBAAGP,GAAH,WACVC,MAAM,CAACO,KAAP,CAAaC,KADH,0gDAAd;AAIP,OAAO,MAAMC,WAAW,gBAAGV,GAAH,WACbC,MAAM,CAACO,KAAP,CAAaG,GADA,6gDAAjB;AAIP,OAAO,MAAMC,KAAK,gBAAGZ,GAAH,WACPC,MAAM,CAACY,UAAP,CAAkBC,IADX,ugDAAX;AAIP,OAAO,MAAMC,eAAe,gBAAGf,GAAH,qBAEXC,MAAM,CAACO,KAAP,CAAaQ,MAFF,ynDAArB;AASP,OAAO,MAAMC,SAAS;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAAf","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport { COLORS, CONFIG } from '../utils';\n\nexport const Text = css`\n\tcolor: ${ COLORS.gray[ 900 ] };\n\tline-height: ${ CONFIG.fontLineHeightBase };\n\tmargin: 0;\n`;\n\nexport const block = css`\n\tdisplay: block;\n`;\n\nexport const positive = css`\n\tcolor: ${ COLORS.alert.green };\n`;\n\nexport const destructive = css`\n\tcolor: ${ COLORS.alert.red };\n`;\n\nexport const muted = css`\n\tcolor: ${ COLORS.mediumGray.text };\n`;\n\nexport const highlighterText = css`\n\tmark {\n\t\tbackground: ${ COLORS.alert.yellow };\n\t\tborder-radius: 2px;\n\t\tbox-shadow: 0 0 0 1px rgba( 0, 0, 0, 0.05 ) inset,\n\t\t\t0 -1px 0 rgba( 0, 0, 0, 0.1 ) inset;\n\t}\n`;\n\nexport const upperCase = css`\n\ttext-transform: uppercase;\n`;\n"]}
@@ -1,6 +1,10 @@
1
1
  import _extends from "@babel/runtime/helpers/esm/extends";
2
2
  import { createElement } from "@wordpress/element";
3
3
 
4
+ /**
5
+ * External dependencies
6
+ */
7
+
4
8
  /**
5
9
  * WordPress dependencies
6
10
  */
@@ -11,27 +15,9 @@ import { forwardRef } from '@wordpress/element';
11
15
  */
12
16
 
13
17
  import BaseControl from '../base-control';
14
- /**
15
- * @typedef OwnProps
16
- * @property {string} label Label for the control.
17
- * @property {boolean} [hideLabelFromVision] Whether to accessibly hide the label.
18
- * @property {string} value Value of the input.
19
- * @property {string} [help] Optional help text for the control.
20
- * @property {string} [className] Classname passed to BaseControl wrapper
21
- * @property {(value: string) => void} onChange Handle changes.
22
- * @property {string} [type='text'] Type of the input.
23
- */
24
18
 
25
- /** @typedef {OwnProps & import('react').ComponentProps<'input'>} Props */
26
-
27
- /**
28
- *
29
- * @param {Props} props Props
30
- * @param {import('react').ForwardedRef<HTMLInputElement>} ref
31
- */
32
-
33
- function TextControl(_ref, ref) {
34
- let {
19
+ function UnforwardedTextControl(props, ref) {
20
+ const {
35
21
  label,
36
22
  hideLabelFromVision,
37
23
  value,
@@ -39,14 +25,12 @@ function TextControl(_ref, ref) {
39
25
  className,
40
26
  onChange,
41
27
  type = 'text',
42
- ...props
43
- } = _ref;
28
+ ...additionalProps
29
+ } = props;
44
30
  const instanceId = useInstanceId(TextControl);
45
31
  const id = `inspector-text-control-${instanceId}`;
46
32
 
47
- const onChangeValue = (
48
- /** @type {import('react').ChangeEvent<HTMLInputElement>} */
49
- event) => onChange(event.target.value);
33
+ const onChangeValue = event => onChange(event.target.value);
50
34
 
51
35
  return createElement(BaseControl, {
52
36
  label: label,
@@ -62,8 +46,32 @@ function TextControl(_ref, ref) {
62
46
  onChange: onChangeValue,
63
47
  "aria-describedby": !!help ? id + '__help' : undefined,
64
48
  ref: ref
65
- }, props)));
49
+ }, additionalProps)));
66
50
  }
51
+ /**
52
+ * TextControl components let users enter and edit text.
53
+ *
54
+ *
55
+ * @example
56
+ * ```jsx
57
+ * import { TextControl } from '@wordpress/components';
58
+ * import { useState } from '@wordpress/element';
59
+ *
60
+ * const MyTextControl = () => {
61
+ * const [ className, setClassName ] = useState( '' );
62
+ *
63
+ * return (
64
+ * <TextControl
65
+ * label="Additional CSS Class"
66
+ * value={ className }
67
+ * onChange={ ( value ) => setClassName( value ) }
68
+ * />
69
+ * );
70
+ * };
71
+ * ```
72
+ */
73
+
67
74
 
68
- export default forwardRef(TextControl);
75
+ export const TextControl = forwardRef(UnforwardedTextControl);
76
+ export default TextControl;
69
77
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/text-control/index.js"],"names":["useInstanceId","forwardRef","BaseControl","TextControl","ref","label","hideLabelFromVision","value","help","className","onChange","type","props","instanceId","id","onChangeValue","event","target","undefined"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,aAAT,QAA8B,oBAA9B;AACA,SAASC,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,OAAOC,WAAP,MAAwB,iBAAxB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;;AACA,SAASC,WAAT,OAWCC,GAXD,EAYE;AAAA,MAXD;AACCC,IAAAA,KADD;AAECC,IAAAA,mBAFD;AAGCC,IAAAA,KAHD;AAICC,IAAAA,IAJD;AAKCC,IAAAA,SALD;AAMCC,IAAAA,QAND;AAOCC,IAAAA,IAAI,GAAG,MAPR;AAQC,OAAGC;AARJ,GAWC;AACD,QAAMC,UAAU,GAAGb,aAAa,CAAEG,WAAF,CAAhC;AACA,QAAMW,EAAE,GAAI,0BAA0BD,UAAY,EAAlD;;AACA,QAAME,aAAa,GAAG;AACrB;AACAC,EAAAA,KAFqB,KAGjBN,QAAQ,CAAEM,KAAK,CAACC,MAAN,CAAaV,KAAf,CAHb;;AAKA,SACC,cAAC,WAAD;AACC,IAAA,KAAK,EAAGF,KADT;AAEC,IAAA,mBAAmB,EAAGC,mBAFvB;AAGC,IAAA,EAAE,EAAGQ,EAHN;AAIC,IAAA,IAAI,EAAGN,IAJR;AAKC,IAAA,SAAS,EAAGC;AALb,KAOC;AACC,IAAA,SAAS,EAAC,gCADX;AAEC,IAAA,IAAI,EAAGE,IAFR;AAGC,IAAA,EAAE,EAAGG,EAHN;AAIC,IAAA,KAAK,EAAGP,KAJT;AAKC,IAAA,QAAQ,EAAGQ,aALZ;AAMC,wBAAmB,CAAC,CAAEP,IAAH,GAAUM,EAAE,GAAG,QAAf,GAA0BI,SAN9C;AAOC,IAAA,GAAG,EAAGd;AAPP,KAQMQ,KARN,EAPD,CADD;AAoBA;;AAED,eAAeX,UAAU,CAAEE,WAAF,CAAzB","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../base-control';\n\n/**\n * @typedef OwnProps\n * @property {string} label Label for the control.\n * @property {boolean} [hideLabelFromVision] Whether to accessibly hide the label.\n * @property {string} value Value of the input.\n * @property {string} [help] Optional help text for the control.\n * @property {string} [className] Classname passed to BaseControl wrapper\n * @property {(value: string) => void} onChange Handle changes.\n * @property {string} [type='text'] Type of the input.\n */\n\n/** @typedef {OwnProps & import('react').ComponentProps<'input'>} Props */\n\n/**\n *\n * @param {Props} props Props\n * @param {import('react').ForwardedRef<HTMLInputElement>} ref\n */\nfunction TextControl(\n\t{\n\t\tlabel,\n\t\thideLabelFromVision,\n\t\tvalue,\n\t\thelp,\n\t\tclassName,\n\t\tonChange,\n\t\ttype = 'text',\n\t\t...props\n\t},\n\tref\n) {\n\tconst instanceId = useInstanceId( TextControl );\n\tconst id = `inspector-text-control-${ instanceId }`;\n\tconst onChangeValue = (\n\t\t/** @type {import('react').ChangeEvent<HTMLInputElement>} */\n\t\tevent\n\t) => onChange( event.target.value );\n\n\treturn (\n\t\t<BaseControl\n\t\t\tlabel={ label }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tid={ id }\n\t\t\thelp={ help }\n\t\t\tclassName={ className }\n\t\t>\n\t\t\t<input\n\t\t\t\tclassName=\"components-text-control__input\"\n\t\t\t\ttype={ type }\n\t\t\t\tid={ id }\n\t\t\t\tvalue={ value }\n\t\t\t\tonChange={ onChangeValue }\n\t\t\t\taria-describedby={ !! help ? id + '__help' : undefined }\n\t\t\t\tref={ ref }\n\t\t\t\t{ ...props }\n\t\t\t/>\n\t\t</BaseControl>\n\t);\n}\n\nexport default forwardRef( TextControl );\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/text-control/index.tsx"],"names":["useInstanceId","forwardRef","BaseControl","UnforwardedTextControl","props","ref","label","hideLabelFromVision","value","help","className","onChange","type","additionalProps","instanceId","TextControl","id","onChangeValue","event","target","undefined"],"mappings":";;;AAAA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,aAAT,QAA8B,oBAA9B;AACA,SAASC,UAAT,QAA2B,oBAA3B;AAEA;AACA;AACA;;AACA,OAAOC,WAAP,MAAwB,iBAAxB;;AAIA,SAASC,sBAAT,CACCC,KADD,EAECC,GAFD,EAGE;AACD,QAAM;AACLC,IAAAA,KADK;AAELC,IAAAA,mBAFK;AAGLC,IAAAA,KAHK;AAILC,IAAAA,IAJK;AAKLC,IAAAA,SALK;AAMLC,IAAAA,QANK;AAOLC,IAAAA,IAAI,GAAG,MAPF;AAQL,OAAGC;AARE,MASFT,KATJ;AAUA,QAAMU,UAAU,GAAGd,aAAa,CAAEe,WAAF,CAAhC;AACA,QAAMC,EAAE,GAAI,0BAA0BF,UAAY,EAAlD;;AACA,QAAMG,aAAa,GAAKC,KAAF,IACrBP,QAAQ,CAAEO,KAAK,CAACC,MAAN,CAAaX,KAAf,CADT;;AAGA,SACC,cAAC,WAAD;AACC,IAAA,KAAK,EAAGF,KADT;AAEC,IAAA,mBAAmB,EAAGC,mBAFvB;AAGC,IAAA,EAAE,EAAGS,EAHN;AAIC,IAAA,IAAI,EAAGP,IAJR;AAKC,IAAA,SAAS,EAAGC;AALb,KAOC;AACC,IAAA,SAAS,EAAC,gCADX;AAEC,IAAA,IAAI,EAAGE,IAFR;AAGC,IAAA,EAAE,EAAGI,EAHN;AAIC,IAAA,KAAK,EAAGR,KAJT;AAKC,IAAA,QAAQ,EAAGS,aALZ;AAMC,wBAAmB,CAAC,CAAER,IAAH,GAAUO,EAAE,GAAG,QAAf,GAA0BI,SAN9C;AAOC,IAAA,GAAG,EAAGf;AAPP,KAQMQ,eARN,EAPD,CADD;AAoBA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,OAAO,MAAME,WAAW,GAAGd,UAAU,CAAEE,sBAAF,CAA9B;AAEP,eAAeY,WAAf","sourcesContent":["/**\n * External dependencies\n */\nimport type { ChangeEvent, ForwardedRef } from 'react';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../base-control';\nimport type { WordPressComponentProps } from '../ui/context';\nimport type { TextControlProps } from './types';\n\nfunction UnforwardedTextControl(\n\tprops: WordPressComponentProps< TextControlProps, 'input', false >,\n\tref: ForwardedRef< HTMLInputElement >\n) {\n\tconst {\n\t\tlabel,\n\t\thideLabelFromVision,\n\t\tvalue,\n\t\thelp,\n\t\tclassName,\n\t\tonChange,\n\t\ttype = 'text',\n\t\t...additionalProps\n\t} = props;\n\tconst instanceId = useInstanceId( TextControl );\n\tconst id = `inspector-text-control-${ instanceId }`;\n\tconst onChangeValue = ( event: ChangeEvent< HTMLInputElement > ) =>\n\t\tonChange( event.target.value );\n\n\treturn (\n\t\t<BaseControl\n\t\t\tlabel={ label }\n\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\tid={ id }\n\t\t\thelp={ help }\n\t\t\tclassName={ className }\n\t\t>\n\t\t\t<input\n\t\t\t\tclassName=\"components-text-control__input\"\n\t\t\t\ttype={ type }\n\t\t\t\tid={ id }\n\t\t\t\tvalue={ value }\n\t\t\t\tonChange={ onChangeValue }\n\t\t\t\taria-describedby={ !! help ? id + '__help' : undefined }\n\t\t\t\tref={ ref }\n\t\t\t\t{ ...additionalProps }\n\t\t\t/>\n\t\t</BaseControl>\n\t);\n}\n\n/**\n * TextControl components let users enter and edit text.\n *\n *\n * @example\n * ```jsx\n * import { TextControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const MyTextControl = () => {\n * const [ className, setClassName ] = useState( '' );\n *\n * return (\n * <TextControl\n * label=\"Additional CSS Class\"\n * value={ className }\n * onChange={ ( value ) => setClassName( value ) }\n * />\n * );\n * };\n * ```\n */\nexport const TextControl = forwardRef( UnforwardedTextControl );\n\nexport default TextControl;\n"]}
@@ -0,0 +1,2 @@
1
+ export {};
2
+ //# sourceMappingURL=types.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}
@@ -1,14 +1,10 @@
1
1
  import { createElement } from "@wordpress/element";
2
2
 
3
- /**
4
- * WordPress dependencies
5
- */
6
- import { Icon } from '@wordpress/icons';
7
3
  /**
8
4
  * Internal dependencies
9
5
  */
10
-
11
6
  import { ToggleGroupControlOptionBase } from '../toggle-group-control-option-base';
7
+ import Icon from '../../icon';
12
8
  export default function ToggleGroupControlOptionIcon(props) {
13
9
  const {
14
10
  icon,
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/toggle-group-control/toggle-group-control-option-icon/component.tsx"],"names":["Icon","ToggleGroupControlOptionBase","ToggleGroupControlOptionIcon","props","icon","restProps"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,IAAT,QAAqB,kBAArB;AAEA;AACA;AACA;;AAGA,SAASC,4BAAT,QAA6C,qCAA7C;AAEA,eAAe,SAASC,4BAAT,CACdC,KADc,EAMb;AACD,QAAM;AAAEC,IAAAA,IAAF;AAAQ,OAAGC;AAAX,MAAyBF,KAA/B;AACA,SACC,cAAC,4BAAD,EAAmCE,SAAnC,EACC,cAAC,IAAD;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":["ToggleGroupControlOptionBase","Icon","ToggleGroupControlOptionIcon","props","icon","restProps"],"mappings":";;AAAA;AACA;AACA;AAGA,SAASA,4BAAT,QAA6C,qCAA7C;AACA,OAAOC,IAAP,MAAiB,YAAjB;AAEA,eAAe,SAASC,4BAAT,CACdC,KADc,EAMb;AACD,QAAM;AAAEC,IAAAA,IAAF;AAAQ,OAAGC;AAAX,MAAyBF,KAA/B;AACA,SACC,cAAC,4BAAD,EAAmCE,SAAnC,EACC,cAAC,IAAD;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"]}
@@ -8,6 +8,7 @@ import { createElement, Fragment } from "@wordpress/element";
8
8
  /**
9
9
  * WordPress dependencies
10
10
  */
11
+ import { speak } from '@wordpress/a11y';
11
12
  import { check, reset, moreVertical, plus } from '@wordpress/icons';
12
13
  import { __, _x, sprintf } from '@wordpress/i18n';
13
14
  /**
@@ -22,12 +23,9 @@ import { Heading } from '../../heading';
22
23
  import { useToolsPanelHeader } from './hook';
23
24
  import { contextConnect } from '../../ui/context';
24
25
 
25
- const noop = () => {};
26
-
27
26
  const DefaultControlsGroup = _ref => {
28
27
  let {
29
28
  items,
30
- onClose,
31
29
  toggleItem
32
30
  } = _ref;
33
31
 
@@ -37,20 +35,28 @@ const DefaultControlsGroup = _ref => {
37
35
 
38
36
  return createElement(MenuGroup, null, items.map(_ref2 => {
39
37
  let [label, hasValue] = _ref2;
40
- const icon = hasValue ? reset : check;
41
- const itemLabel = hasValue ? sprintf( // translators: %s: The name of the control being reset e.g. "Padding".
42
- __('Reset %s'), label) : undefined;
38
+
39
+ if (hasValue) {
40
+ return createElement(MenuItem, {
41
+ key: label,
42
+ role: "menuitem",
43
+ icon: reset,
44
+ label: sprintf( // translators: %s: The name of the control being reset e.g. "Padding".
45
+ __('Reset %s'), label),
46
+ onClick: () => {
47
+ toggleItem(label);
48
+ speak(sprintf( // translators: %s: The name of the control being reset e.g. "Padding".
49
+ __('%s reset to default'), label), 'assertive');
50
+ }
51
+ }, label);
52
+ }
53
+
43
54
  return createElement(MenuItem, {
44
55
  key: label,
45
- icon: icon,
56
+ role: "menuitemcheckbox",
57
+ icon: check,
46
58
  isSelected: true,
47
- disabled: !hasValue,
48
- label: itemLabel,
49
- onClick: () => {
50
- toggleItem(label);
51
- onClose();
52
- },
53
- role: "menuitemcheckbox"
59
+ "aria-disabled": true
54
60
  }, label);
55
61
  }));
56
62
  };
@@ -58,7 +64,6 @@ const DefaultControlsGroup = _ref => {
58
64
  const OptionalControlsGroup = _ref3 => {
59
65
  let {
60
66
  items,
61
- onClose,
62
67
  toggleItem
63
68
  } = _ref3;
64
69
 
@@ -77,8 +82,15 @@ const OptionalControlsGroup = _ref3 => {
77
82
  isSelected: isSelected,
78
83
  label: itemLabel,
79
84
  onClick: () => {
85
+ if (isSelected) {
86
+ speak(sprintf( // translators: %s: The name of the control being reset e.g. "Padding".
87
+ __('%s hidden and reset to default'), label), 'assertive');
88
+ } else {
89
+ speak(sprintf( // translators: %s: The name of the control being reset e.g. "Padding".
90
+ __('%s is now visible'), label), 'assertive');
91
+ }
92
+
80
93
  toggleItem(label);
81
- onClose();
82
94
  },
83
95
  role: "menuitemcheckbox"
84
96
  }, label);
@@ -105,7 +117,13 @@ const ToolsPanelHeader = (props, forwardedRef) => {
105
117
  const defaultItems = Object.entries((menuItems === null || menuItems === void 0 ? void 0 : menuItems.default) || {});
106
118
  const optionalItems = Object.entries((menuItems === null || menuItems === void 0 ? void 0 : menuItems.optional) || {});
107
119
  const dropDownMenuIcon = areAllOptionalControlsHidden ? plus : moreVertical;
108
- const dropDownMenuLabelText = areAllOptionalControlsHidden ? _x('View and add options', 'Button label to reveal tool panel options') : _x('View options', 'Button label to reveal tool panel options');
120
+ const dropDownMenuLabelText = sprintf( // translators: %s: The name of the tool e.g. "Color" or "Typography".
121
+ _x('%s options', 'Button label to reveal tool panel options'), labelText);
122
+ const dropdownMenuDescriptionText = areAllOptionalControlsHidden ? __('All options are currently hidden') : undefined;
123
+ const canResetAll = [...defaultItems, ...optionalItems].some(_ref5 => {
124
+ let [, isSelected] = _ref5;
125
+ return isSelected;
126
+ });
109
127
  return createElement(HStack, _extends({}, headerProps, {
110
128
  ref: forwardedRef
111
129
  }), createElement(Heading, {
@@ -118,28 +136,25 @@ const ToolsPanelHeader = (props, forwardedRef) => {
118
136
  className: dropdownMenuClassName
119
137
  },
120
138
  toggleProps: {
121
- isSmall: true
139
+ isSmall: true,
140
+ describedBy: dropdownMenuDescriptionText
122
141
  }
123
- }, _ref5 => {
124
- let {
125
- onClose = noop
126
- } = _ref5;
127
- return createElement(Fragment, null, createElement(DefaultControlsGroup, {
128
- items: defaultItems,
129
- onClose: onClose,
130
- toggleItem: toggleItem
131
- }), createElement(OptionalControlsGroup, {
132
- items: optionalItems,
133
- onClose: onClose,
134
- toggleItem: toggleItem
135
- }), createElement(MenuGroup, null, createElement(MenuItem, {
136
- variant: 'tertiary',
137
- onClick: () => {
142
+ }, () => createElement(Fragment, null, createElement(DefaultControlsGroup, {
143
+ items: defaultItems,
144
+ toggleItem: toggleItem
145
+ }), createElement(OptionalControlsGroup, {
146
+ items: optionalItems,
147
+ toggleItem: toggleItem
148
+ }), createElement(MenuGroup, null, createElement(MenuItem, {
149
+ "aria-disabled": !canResetAll,
150
+ variant: 'tertiary',
151
+ onClick: () => {
152
+ if (canResetAll) {
138
153
  resetAll();
139
- onClose();
154
+ speak(__('All options reset'), 'assertive');
140
155
  }
141
- }, __('Reset all'))));
142
- }));
156
+ }
157
+ }, __('Reset all'))))));
143
158
  };
144
159
 
145
160
  const ConnectedToolsPanelHeader = contextConnect(ToolsPanelHeader, 'ToolsPanelHeader');
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/tools-panel/tools-panel-header/component.tsx"],"names":["check","reset","moreVertical","plus","__","_x","sprintf","DropdownMenu","MenuGroup","MenuItem","HStack","Heading","useToolsPanelHeader","contextConnect","noop","DefaultControlsGroup","items","onClose","toggleItem","length","map","label","hasValue","icon","itemLabel","undefined","OptionalControlsGroup","isSelected","ToolsPanelHeader","props","forwardedRef","areAllOptionalControlsHidden","dropdownMenuClassName","hasMenuItems","headingClassName","labelText","menuItems","resetAll","headerProps","defaultItems","Object","entries","default","optionalItems","optional","dropDownMenuIcon","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":["speak","check","reset","moreVertical","plus","__","_x","sprintf","DropdownMenu","MenuGroup","MenuItem","HStack","Heading","useToolsPanelHeader","contextConnect","DefaultControlsGroup","items","toggleItem","length","map","label","hasValue","OptionalControlsGroup","isSelected","itemLabel","ToolsPanelHeader","props","forwardedRef","areAllOptionalControlsHidden","dropdownMenuClassName","hasMenuItems","headingClassName","labelText","menuItems","resetAll","headerProps","defaultItems","Object","entries","default","optionalItems","optional","dropDownMenuIcon","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"]}
@@ -26,7 +26,7 @@ import { COLORS } from '../../utils/colors-values';
26
26
 
27
27
  function Spinner(props, forwardedRef) {
28
28
  const {
29
- color = COLORS.black,
29
+ color = COLORS.gray[900],
30
30
  size = BASE_SIZE,
31
31
  ...otherProps
32
32
  } = useContextSystem(props, 'Spinner');
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/ui/spinner/component.js"],"names":["BarsView","BarsWrapperView","ContainerView","BASE_SIZE","WRAPPER_SIZE","contextConnect","useContextSystem","COLORS","Spinner","props","forwardedRef","color","black","size","otherProps","ratio","scale","transform","styles","height","width"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,QAAT,EAAmBC,eAAnB,EAAoCC,aAApC,QAAyD,UAAzD;AACA,SAASC,SAAT,EAAoBC,YAApB,QAAwC,SAAxC;AACA,SAASC,cAAT,EAAyBC,gBAAzB,QAAiD,YAAjD;AACA,SAASC,MAAT,QAAuB,2BAAvB;AAEA;;AACA;AACA;AACA;AACA;AACA;;AACA;;AAEA;AACA;AACA;AACA;AACA;;AACA,SAASC,OAAT,CAAkBC,KAAlB,EAAyBC,YAAzB,EAAwC;AACvC,QAAM;AACLC,IAAAA,KAAK,GAAGJ,MAAM,CAACK,KADV;AAELC,IAAAA,IAAI,GAAGV,SAFF;AAGL,OAAGW;AAHE,MAIFR,gBAAgB,CAAEG,KAAF,EAAS,SAAT,CAJpB;AAKA,QAAMM,KAAK,GAAGF,IAAI,GAAGV,SAArB;AACA,QAAMa,KAAK,GAAKD,KAAK,GAAGZ,SAAV,GAAwBC,YAAtC;AACA,QAAMa,SAAS,GAAI,SAASD,KAAO,GAAnC;AAEA,QAAME,MAAM,GAAG;AAAED,IAAAA;AAAF,GAAf;AAEA,SACC,cAAC,aAAD,eACMH,UADN;AAEC,iBAAY,IAFb;AAGC,IAAA,GAAG,EAAGJ,YAHP;AAIC,IAAA,KAAK,EAAG;AAAES,MAAAA,MAAM,EAAEN,IAAV;AAAgBO,MAAAA,KAAK,EAAEP;AAAvB;AAJT,MAMC,cAAC,eAAD;AAAiB,mBAAc,IAA/B;AAAsC,IAAA,KAAK,EAAGK;AAA9C,KACC,cAAC,QAAD;AAAU,IAAA,KAAK,EAAG;AAAEP,MAAAA;AAAF;AAAlB,KACC;AAAK,IAAA,SAAS,EAAC;AAAf,IADD,EAEC;AAAK,IAAA,SAAS,EAAC;AAAf,IAFD,EAGC;AAAK,IAAA,SAAS,EAAC;AAAf,IAHD,EAIC;AAAK,IAAA,SAAS,EAAC;AAAf,IAJD,EAKC;AAAK,IAAA,SAAS,EAAC;AAAf,IALD,EAMC;AAAK,IAAA,SAAS,EAAC;AAAf,IAND,EAOC;AAAK,IAAA,SAAS,EAAC;AAAf,IAPD,EAQC;AAAK,IAAA,SAAS,EAAC;AAAf,IARD,EASC;AAAK,IAAA,SAAS,EAAC;AAAf,IATD,EAUC;AAAK,IAAA,SAAS,EAAC;AAAf,IAVD,EAWC;AAAK,IAAA,SAAS,EAAC;AAAf,IAXD,EAYC;AAAK,IAAA,SAAS,EAAC;AAAf,IAZD,CADD,CAND,CADD;AAyBA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,eAAeN,cAAc,CAAEG,OAAF,EAAW,SAAX,CAA7B","sourcesContent":["/**\n * Internal dependencies\n */\nimport { BarsView, BarsWrapperView, ContainerView } from './styles';\nimport { BASE_SIZE, WRAPPER_SIZE } from './utils';\nimport { contextConnect, useContextSystem } from '../context';\nimport { COLORS } from '../../utils/colors-values';\n\n/* eslint-disable jsdoc/valid-types */\n/**\n * @typedef Props\n * @property {import('react').CSSProperties['color']} [color] Color of `Spinner`.\n * @property {number} [size=16] Size of `Spinner`.\n */\n/* eslint-enable jsdoc/valid-types */\n\n/**\n *\n * @param {import('../context').WordPressComponentProps<Props, 'div'>} props\n * @param {import('react').ForwardedRef<any>} forwardedRef\n */\nfunction Spinner( props, forwardedRef ) {\n\tconst {\n\t\tcolor = COLORS.black,\n\t\tsize = BASE_SIZE,\n\t\t...otherProps\n\t} = useContextSystem( props, 'Spinner' );\n\tconst ratio = size / BASE_SIZE;\n\tconst scale = ( ratio * BASE_SIZE ) / WRAPPER_SIZE;\n\tconst transform = `scale(${ scale })`;\n\n\tconst styles = { transform };\n\n\treturn (\n\t\t<ContainerView\n\t\t\t{ ...otherProps }\n\t\t\taria-busy={ true }\n\t\t\tref={ forwardedRef }\n\t\t\tstyle={ { height: size, width: size } }\n\t\t>\n\t\t\t<BarsWrapperView aria-hidden={ true } style={ styles }>\n\t\t\t\t<BarsView style={ { color } }>\n\t\t\t\t\t<div className=\"InnerBar1\" />\n\t\t\t\t\t<div className=\"InnerBar2\" />\n\t\t\t\t\t<div className=\"InnerBar3\" />\n\t\t\t\t\t<div className=\"InnerBar4\" />\n\t\t\t\t\t<div className=\"InnerBar5\" />\n\t\t\t\t\t<div className=\"InnerBar6\" />\n\t\t\t\t\t<div className=\"InnerBar7\" />\n\t\t\t\t\t<div className=\"InnerBar8\" />\n\t\t\t\t\t<div className=\"InnerBar9\" />\n\t\t\t\t\t<div className=\"InnerBar10\" />\n\t\t\t\t\t<div className=\"InnerBar11\" />\n\t\t\t\t\t<div className=\"InnerBar12\" />\n\t\t\t\t</BarsView>\n\t\t\t</BarsWrapperView>\n\t\t</ContainerView>\n\t);\n}\n\n/**\n * `Spinner` is a component that notify users that their action is being processed.\n *\n * @example\n * ```jsx\n * import { Spinner } from `@wordpress/components/ui`;\n *\n * function Example() {\n * \treturn (\n * \t\t<Spinner />\n * \t);\n * }\n * ```\n */\nexport default contextConnect( Spinner, 'Spinner' );\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/ui/spinner/component.js"],"names":["BarsView","BarsWrapperView","ContainerView","BASE_SIZE","WRAPPER_SIZE","contextConnect","useContextSystem","COLORS","Spinner","props","forwardedRef","color","gray","size","otherProps","ratio","scale","transform","styles","height","width"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,QAAT,EAAmBC,eAAnB,EAAoCC,aAApC,QAAyD,UAAzD;AACA,SAASC,SAAT,EAAoBC,YAApB,QAAwC,SAAxC;AACA,SAASC,cAAT,EAAyBC,gBAAzB,QAAiD,YAAjD;AACA,SAASC,MAAT,QAAuB,2BAAvB;AAEA;;AACA;AACA;AACA;AACA;AACA;;AACA;;AAEA;AACA;AACA;AACA;AACA;;AACA,SAASC,OAAT,CAAkBC,KAAlB,EAAyBC,YAAzB,EAAwC;AACvC,QAAM;AACLC,IAAAA,KAAK,GAAGJ,MAAM,CAACK,IAAP,CAAa,GAAb,CADH;AAELC,IAAAA,IAAI,GAAGV,SAFF;AAGL,OAAGW;AAHE,MAIFR,gBAAgB,CAAEG,KAAF,EAAS,SAAT,CAJpB;AAKA,QAAMM,KAAK,GAAGF,IAAI,GAAGV,SAArB;AACA,QAAMa,KAAK,GAAKD,KAAK,GAAGZ,SAAV,GAAwBC,YAAtC;AACA,QAAMa,SAAS,GAAI,SAASD,KAAO,GAAnC;AAEA,QAAME,MAAM,GAAG;AAAED,IAAAA;AAAF,GAAf;AAEA,SACC,cAAC,aAAD,eACMH,UADN;AAEC,iBAAY,IAFb;AAGC,IAAA,GAAG,EAAGJ,YAHP;AAIC,IAAA,KAAK,EAAG;AAAES,MAAAA,MAAM,EAAEN,IAAV;AAAgBO,MAAAA,KAAK,EAAEP;AAAvB;AAJT,MAMC,cAAC,eAAD;AAAiB,mBAAc,IAA/B;AAAsC,IAAA,KAAK,EAAGK;AAA9C,KACC,cAAC,QAAD;AAAU,IAAA,KAAK,EAAG;AAAEP,MAAAA;AAAF;AAAlB,KACC;AAAK,IAAA,SAAS,EAAC;AAAf,IADD,EAEC;AAAK,IAAA,SAAS,EAAC;AAAf,IAFD,EAGC;AAAK,IAAA,SAAS,EAAC;AAAf,IAHD,EAIC;AAAK,IAAA,SAAS,EAAC;AAAf,IAJD,EAKC;AAAK,IAAA,SAAS,EAAC;AAAf,IALD,EAMC;AAAK,IAAA,SAAS,EAAC;AAAf,IAND,EAOC;AAAK,IAAA,SAAS,EAAC;AAAf,IAPD,EAQC;AAAK,IAAA,SAAS,EAAC;AAAf,IARD,EASC;AAAK,IAAA,SAAS,EAAC;AAAf,IATD,EAUC;AAAK,IAAA,SAAS,EAAC;AAAf,IAVD,EAWC;AAAK,IAAA,SAAS,EAAC;AAAf,IAXD,EAYC;AAAK,IAAA,SAAS,EAAC;AAAf,IAZD,CADD,CAND,CADD;AAyBA;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,eAAeN,cAAc,CAAEG,OAAF,EAAW,SAAX,CAA7B","sourcesContent":["/**\n * Internal dependencies\n */\nimport { BarsView, BarsWrapperView, ContainerView } from './styles';\nimport { BASE_SIZE, WRAPPER_SIZE } from './utils';\nimport { contextConnect, useContextSystem } from '../context';\nimport { COLORS } from '../../utils/colors-values';\n\n/* eslint-disable jsdoc/valid-types */\n/**\n * @typedef Props\n * @property {import('react').CSSProperties['color']} [color] Color of `Spinner`.\n * @property {number} [size=16] Size of `Spinner`.\n */\n/* eslint-enable jsdoc/valid-types */\n\n/**\n *\n * @param {import('../context').WordPressComponentProps<Props, 'div'>} props\n * @param {import('react').ForwardedRef<any>} forwardedRef\n */\nfunction Spinner( props, forwardedRef ) {\n\tconst {\n\t\tcolor = COLORS.gray[ 900 ],\n\t\tsize = BASE_SIZE,\n\t\t...otherProps\n\t} = useContextSystem( props, 'Spinner' );\n\tconst ratio = size / BASE_SIZE;\n\tconst scale = ( ratio * BASE_SIZE ) / WRAPPER_SIZE;\n\tconst transform = `scale(${ scale })`;\n\n\tconst styles = { transform };\n\n\treturn (\n\t\t<ContainerView\n\t\t\t{ ...otherProps }\n\t\t\taria-busy={ true }\n\t\t\tref={ forwardedRef }\n\t\t\tstyle={ { height: size, width: size } }\n\t\t>\n\t\t\t<BarsWrapperView aria-hidden={ true } style={ styles }>\n\t\t\t\t<BarsView style={ { color } }>\n\t\t\t\t\t<div className=\"InnerBar1\" />\n\t\t\t\t\t<div className=\"InnerBar2\" />\n\t\t\t\t\t<div className=\"InnerBar3\" />\n\t\t\t\t\t<div className=\"InnerBar4\" />\n\t\t\t\t\t<div className=\"InnerBar5\" />\n\t\t\t\t\t<div className=\"InnerBar6\" />\n\t\t\t\t\t<div className=\"InnerBar7\" />\n\t\t\t\t\t<div className=\"InnerBar8\" />\n\t\t\t\t\t<div className=\"InnerBar9\" />\n\t\t\t\t\t<div className=\"InnerBar10\" />\n\t\t\t\t\t<div className=\"InnerBar11\" />\n\t\t\t\t\t<div className=\"InnerBar12\" />\n\t\t\t\t</BarsView>\n\t\t\t</BarsWrapperView>\n\t\t</ContainerView>\n\t);\n}\n\n/**\n * `Spinner` is a component that notify users that their action is being processed.\n *\n * @example\n * ```jsx\n * import { Spinner } from `@wordpress/components/ui`;\n *\n * function Example() {\n * \treturn (\n * \t\t<Spinner />\n * \t);\n * }\n * ```\n */\nexport default contextConnect( Spinner, 'Spinner' );\n"]}
@@ -59,7 +59,7 @@ function UnforwardedUnitControl(unitControlProps, forwardedRef) {
59
59
  const nonNullValueProp = valueProp !== null && valueProp !== void 0 ? valueProp : undefined;
60
60
  const units = useMemo(() => getUnitsWithCurrentUnit(nonNullValueProp, unitProp, unitsProp), [nonNullValueProp, unitProp, unitsProp]);
61
61
  const [parsedQuantity, parsedUnit] = getParsedQuantityAndUnit(nonNullValueProp, unitProp, units);
62
- const [unit, setUnit] = useControlledState(unitProp, {
62
+ const [unit, setUnit] = useControlledState(units.length === 1 ? units[0].value : unitProp, {
63
63
  initial: parsedUnit,
64
64
  fallback: ''
65
65
  });
@@ -116,8 +116,8 @@ function UnforwardedUnitControl(unitControlProps, forwardedRef) {
116
116
  const changeProps = {
117
117
  event,
118
118
  data
119
- };
120
- onChangeProp === null || onChangeProp === void 0 ? void 0 : onChangeProp(`${validParsedQuantity !== null && validParsedQuantity !== void 0 ? validParsedQuantity : ''}${validParsedUnit}`, changeProps);
119
+ }; // The `onChange` callback already gets called, no need to call it explicitely.
120
+
121
121
  onUnitChange === null || onUnitChange === void 0 ? void 0 : onUnitChange(validParsedUnit, changeProps);
122
122
  setUnit(validParsedUnit);
123
123
  }
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/unit-control/index.tsx"],"names":["omit","classnames","deprecated","forwardRef","useMemo","useRef","useEffect","__","inputControlActionTypes","Root","ValueInput","UnitSelectControl","CSS_UNITS","getParsedQuantityAndUnit","getUnitsWithCurrentUnit","getValidParsedQuantityAndUnit","useControlledState","UnforwardedUnitControl","unitControlProps","forwardedRef","__unstableStateReducer","stateReducerProp","autoComplete","className","disabled","disableUnits","isPressEnterToChange","isResetValueOnUnitChange","isUnitSelectTabbable","label","onChange","onChangeProp","onUnitChange","size","style","unit","unitProp","units","unitsProp","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","COMMIT","toString","stateReducer","baseState","inputSuffix","step","activeUnit","UnitControl","parseQuantityAndUnitFromRawValue","useCustomUnits"],"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":["omit","classnames","deprecated","forwardRef","useMemo","useRef","useEffect","__","inputControlActionTypes","Root","ValueInput","UnitSelectControl","CSS_UNITS","getParsedQuantityAndUnit","getUnitsWithCurrentUnit","getValidParsedQuantityAndUnit","useControlledState","UnforwardedUnitControl","unitControlProps","forwardedRef","__unstableStateReducer","stateReducerProp","autoComplete","className","disabled","disableUnits","isPressEnterToChange","isResetValueOnUnitChange","isUnitSelectTabbable","label","onChange","onChangeProp","onUnitChange","size","style","unit","unitProp","units","unitsProp","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","COMMIT","toString","stateReducer","baseState","inputSuffix","step","activeUnit","UnitControl","parseQuantityAndUnitFromRawValue","useCustomUnits"],"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"]}