@wordpress/components 19.6.1 → 19.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (514) hide show
  1. package/CHANGELOG.md +54 -0
  2. package/README.md +38 -0
  3. package/build/base-control/index.js +41 -32
  4. package/build/base-control/index.js.map +1 -1
  5. package/build/base-control/styles/base-control-styles.js +43 -22
  6. package/build/base-control/styles/base-control-styles.js.map +1 -1
  7. package/build/base-control/types.js +6 -0
  8. package/build/base-control/types.js.map +1 -0
  9. package/build/border-box-control/border-box-control/component.js +124 -0
  10. package/build/border-box-control/border-box-control/component.js.map +1 -0
  11. package/build/border-box-control/border-box-control/hook.js +113 -0
  12. package/build/border-box-control/border-box-control/hook.js.map +1 -0
  13. package/build/border-box-control/border-box-control/index.js +24 -0
  14. package/build/border-box-control/border-box-control/index.js.map +1 -0
  15. package/build/border-box-control/border-box-control-linked-button/component.js +59 -0
  16. package/build/border-box-control/border-box-control-linked-button/component.js.map +1 -0
  17. package/build/border-box-control/border-box-control-linked-button/hook.js +41 -0
  18. package/build/border-box-control/border-box-control-linked-button/hook.js.map +1 -0
  19. package/build/border-box-control/border-box-control-linked-button/index.js +16 -0
  20. package/build/border-box-control/border-box-control-linked-button/index.js.map +1 -0
  21. package/build/border-box-control/border-box-control-split-controls/component.js +93 -0
  22. package/build/border-box-control/border-box-control-split-controls/component.js.map +1 -0
  23. package/build/border-box-control/border-box-control-split-controls/hook.js +45 -0
  24. package/build/border-box-control/border-box-control-split-controls/hook.js.map +1 -0
  25. package/build/border-box-control/border-box-control-split-controls/index.js +16 -0
  26. package/build/border-box-control/border-box-control-split-controls/index.js.map +1 -0
  27. package/build/border-box-control/border-box-control-visualizer/component.js +40 -0
  28. package/build/border-box-control/border-box-control-visualizer/component.js.map +1 -0
  29. package/build/border-box-control/border-box-control-visualizer/hook.js +43 -0
  30. package/build/border-box-control/border-box-control-visualizer/hook.js.map +1 -0
  31. package/build/border-box-control/border-box-control-visualizer/index.js +16 -0
  32. package/build/border-box-control/border-box-control-visualizer/index.js.map +1 -0
  33. package/build/border-box-control/index.js +44 -0
  34. package/build/border-box-control/index.js.map +1 -0
  35. package/build/border-box-control/styles.js +76 -0
  36. package/build/border-box-control/styles.js.map +1 -0
  37. package/build/border-box-control/types.js +6 -0
  38. package/build/border-box-control/types.js.map +1 -0
  39. package/build/border-box-control/utils.js +161 -0
  40. package/build/border-box-control/utils.js.map +1 -0
  41. package/build/border-control/border-control/component.js +119 -0
  42. package/build/border-control/border-control/component.js.map +1 -0
  43. package/build/border-control/border-control/hook.js +130 -0
  44. package/build/border-control/border-control/hook.js.map +1 -0
  45. package/build/border-control/border-control/index.js +24 -0
  46. package/build/border-control/border-control/index.js.map +1 -0
  47. package/build/border-control/border-control-dropdown/component.js +196 -0
  48. package/build/border-control/border-control-dropdown/component.js.map +1 -0
  49. package/build/border-control/border-control-dropdown/hook.js +105 -0
  50. package/build/border-control/border-control-dropdown/hook.js.map +1 -0
  51. package/build/border-control/border-control-dropdown/index.js +16 -0
  52. package/build/border-control/border-control-dropdown/index.js.map +1 -0
  53. package/build/border-control/border-control-style-picker/component.js +101 -0
  54. package/build/border-control/border-control-style-picker/component.js.map +1 -0
  55. package/build/border-control/border-control-style-picker/hook.js +45 -0
  56. package/build/border-control/border-control-style-picker/hook.js.map +1 -0
  57. package/build/border-control/border-control-style-picker/index.js +16 -0
  58. package/build/border-control/border-control-style-picker/index.js.map +1 -0
  59. package/build/border-control/index.js +24 -0
  60. package/build/border-control/index.js.map +1 -0
  61. package/build/border-control/styles.js +125 -0
  62. package/build/border-control/styles.js.map +1 -0
  63. package/build/border-control/types.js +6 -0
  64. package/build/border-control/types.js.map +1 -0
  65. package/build/box-control/all-input-control.js +3 -7
  66. package/build/box-control/all-input-control.js.map +1 -1
  67. package/build/box-control/axial-input-controls.js +20 -15
  68. package/build/box-control/axial-input-controls.js.map +1 -1
  69. package/build/box-control/input-controls.js +21 -16
  70. package/build/box-control/input-controls.js.map +1 -1
  71. package/build/box-control/utils.js +25 -11
  72. package/build/box-control/utils.js.map +1 -1
  73. package/build/card/styles.js +22 -17
  74. package/build/card/styles.js.map +1 -1
  75. package/build/checkbox-control/index.js +21 -1
  76. package/build/checkbox-control/index.js.map +1 -1
  77. package/build/color-palette/index.js +53 -4
  78. package/build/color-palette/index.js.map +1 -1
  79. package/build/custom-select-control/index.js +12 -4
  80. package/build/custom-select-control/index.js.map +1 -1
  81. package/build/divider/styles.js +28 -16
  82. package/build/divider/styles.js.map +1 -1
  83. package/build/focal-point-picker/controls.js +2 -3
  84. package/build/focal-point-picker/controls.js.map +1 -1
  85. package/build/form-file-upload/index.js +4 -1
  86. package/build/form-file-upload/index.js.map +1 -1
  87. package/build/index.js +40 -0
  88. package/build/index.js.map +1 -1
  89. package/build/input-control/input-field.js +21 -14
  90. package/build/input-control/input-field.js.map +1 -1
  91. package/build/input-control/reducer/actions.js +1 -3
  92. package/build/input-control/reducer/actions.js.map +1 -1
  93. package/build/input-control/reducer/reducer.js +1 -43
  94. package/build/input-control/reducer/reducer.js.map +1 -1
  95. package/build/item-group/styles.js +14 -14
  96. package/build/item-group/styles.js.map +1 -1
  97. package/build/mobile/picker/index.android.js +0 -3
  98. package/build/mobile/picker/index.android.js.map +1 -1
  99. package/build/number-control/index.js +15 -10
  100. package/build/number-control/index.js.map +1 -1
  101. package/build/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js +4 -4
  102. package/build/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js.map +1 -1
  103. package/build/surface/styles.js +8 -8
  104. package/build/surface/styles.js.map +1 -1
  105. package/build/toggle-group-control/index.js +8 -0
  106. package/build/toggle-group-control/index.js.map +1 -1
  107. package/build/toggle-group-control/toggle-group-control/component.js +10 -1
  108. package/build/toggle-group-control/toggle-group-control/component.js.map +1 -1
  109. package/build/toggle-group-control/toggle-group-control/styles.js +14 -3
  110. package/build/toggle-group-control/toggle-group-control/styles.js.map +1 -1
  111. package/build/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.js +90 -0
  112. package/build/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.js.map +1 -0
  113. package/build/toggle-group-control/toggle-group-control-option/component.js +9 -87
  114. package/build/toggle-group-control/toggle-group-control-option/component.js.map +1 -1
  115. package/build/toggle-group-control/toggle-group-control-option-base/component.js +127 -0
  116. package/build/toggle-group-control/toggle-group-control-option-base/component.js.map +1 -0
  117. package/build/toggle-group-control/toggle-group-control-option-base/index.js +16 -0
  118. package/build/toggle-group-control/toggle-group-control-option-base/index.js.map +1 -0
  119. package/build/toggle-group-control/toggle-group-control-option-base/styles.js +66 -0
  120. package/build/toggle-group-control/toggle-group-control-option-base/styles.js.map +1 -0
  121. package/build/toggle-group-control/toggle-group-control-option-icon/component.js +55 -0
  122. package/build/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -0
  123. package/build/toggle-group-control/toggle-group-control-option-icon/index.js +16 -0
  124. package/build/toggle-group-control/toggle-group-control-option-icon/index.js.map +1 -0
  125. package/build/toolbar-dropdown-menu/index.js +1 -1
  126. package/build/toolbar-dropdown-menu/index.js.map +1 -1
  127. package/build/unit-control/index.js +56 -29
  128. package/build/unit-control/index.js.map +1 -1
  129. package/build/unit-control/unit-select-control.js +2 -4
  130. package/build/unit-control/unit-select-control.js.map +1 -1
  131. package/build/utils/colors-values.js +5 -3
  132. package/build/utils/colors-values.js.map +1 -1
  133. package/build/utils/config-values.js +9 -4
  134. package/build/utils/config-values.js.map +1 -1
  135. package/build-module/base-control/index.js +39 -35
  136. package/build-module/base-control/index.js.map +1 -1
  137. package/build-module/base-control/styles/base-control-styles.js +44 -16
  138. package/build-module/base-control/styles/base-control-styles.js.map +1 -1
  139. package/build-module/base-control/types.js +2 -0
  140. package/build-module/base-control/types.js.map +1 -0
  141. package/build-module/border-box-control/border-box-control/component.js +104 -0
  142. package/build-module/border-box-control/border-box-control/component.js.map +1 -0
  143. package/build-module/border-box-control/border-box-control/hook.js +97 -0
  144. package/build-module/border-box-control/border-box-control/hook.js.map +1 -0
  145. package/build-module/border-box-control/border-box-control/index.js +3 -0
  146. package/build-module/border-box-control/border-box-control/index.js.map +1 -0
  147. package/build-module/border-box-control/border-box-control-linked-button/component.js +42 -0
  148. package/build-module/border-box-control/border-box-control-linked-button/component.js.map +1 -0
  149. package/build-module/border-box-control/border-box-control-linked-button/hook.js +26 -0
  150. package/build-module/border-box-control/border-box-control-linked-button/hook.js.map +1 -0
  151. package/build-module/border-box-control/border-box-control-linked-button/index.js +2 -0
  152. package/build-module/border-box-control/border-box-control-linked-button/index.js.map +1 -0
  153. package/build-module/border-box-control/border-box-control-split-controls/component.js +77 -0
  154. package/build-module/border-box-control/border-box-control-split-controls/component.js.map +1 -0
  155. package/build-module/border-box-control/border-box-control-split-controls/hook.js +30 -0
  156. package/build-module/border-box-control/border-box-control-split-controls/hook.js.map +1 -0
  157. package/build-module/border-box-control/border-box-control-split-controls/index.js +2 -0
  158. package/build-module/border-box-control/border-box-control-split-controls/index.js.map +1 -0
  159. package/build-module/border-box-control/border-box-control-visualizer/component.js +27 -0
  160. package/build-module/border-box-control/border-box-control-visualizer/component.js.map +1 -0
  161. package/build-module/border-box-control/border-box-control-visualizer/hook.js +28 -0
  162. package/build-module/border-box-control/border-box-control-visualizer/hook.js.map +1 -0
  163. package/build-module/border-box-control/border-box-control-visualizer/index.js +2 -0
  164. package/build-module/border-box-control/border-box-control-visualizer/index.js.map +1 -0
  165. package/build-module/border-box-control/index.js +4 -0
  166. package/build-module/border-box-control/index.js.map +1 -0
  167. package/build-module/border-box-control/styles.js +66 -0
  168. package/build-module/border-box-control/styles.js.map +1 -0
  169. package/build-module/border-box-control/types.js +2 -0
  170. package/build-module/border-box-control/types.js.map +1 -0
  171. package/build-module/border-box-control/utils.js +127 -0
  172. package/build-module/border-box-control/utils.js.map +1 -0
  173. package/build-module/border-control/border-control/component.js +100 -0
  174. package/build-module/border-control/border-control/component.js.map +1 -0
  175. package/build-module/border-control/border-control/hook.js +115 -0
  176. package/build-module/border-control/border-control/hook.js.map +1 -0
  177. package/build-module/border-control/border-control/index.js +3 -0
  178. package/build-module/border-control/border-control/index.js.map +1 -0
  179. package/build-module/border-control/border-control-dropdown/component.js +174 -0
  180. package/build-module/border-control/border-control-dropdown/component.js.map +1 -0
  181. package/build-module/border-control/border-control-dropdown/hook.js +89 -0
  182. package/build-module/border-control/border-control-dropdown/hook.js.map +1 -0
  183. package/build-module/border-control/border-control-dropdown/index.js +2 -0
  184. package/build-module/border-control/border-control-dropdown/index.js.map +1 -0
  185. package/build-module/border-control/border-control-style-picker/component.js +81 -0
  186. package/build-module/border-control/border-control-style-picker/component.js.map +1 -0
  187. package/build-module/border-control/border-control-style-picker/hook.js +30 -0
  188. package/build-module/border-control/border-control-style-picker/hook.js.map +1 -0
  189. package/build-module/border-control/border-control-style-picker/index.js +2 -0
  190. package/build-module/border-control/border-control-style-picker/index.js.map +1 -0
  191. package/build-module/border-control/index.js +3 -0
  192. package/build-module/border-control/index.js.map +1 -0
  193. package/build-module/border-control/styles.js +90 -0
  194. package/build-module/border-control/styles.js.map +1 -0
  195. package/build-module/border-control/types.js +2 -0
  196. package/build-module/border-control/types.js.map +1 -0
  197. package/build-module/box-control/all-input-control.js +4 -8
  198. package/build-module/box-control/all-input-control.js.map +1 -1
  199. package/build-module/box-control/axial-input-controls.js +18 -14
  200. package/build-module/box-control/axial-input-controls.js.map +1 -1
  201. package/build-module/box-control/input-controls.js +18 -14
  202. package/build-module/box-control/input-controls.js.map +1 -1
  203. package/build-module/box-control/utils.js +25 -11
  204. package/build-module/box-control/utils.js.map +1 -1
  205. package/build-module/card/styles.js +23 -18
  206. package/build-module/card/styles.js.map +1 -1
  207. package/build-module/checkbox-control/index.js +24 -3
  208. package/build-module/checkbox-control/index.js.map +1 -1
  209. package/build-module/color-palette/index.js +52 -4
  210. package/build-module/color-palette/index.js.map +1 -1
  211. package/build-module/custom-select-control/index.js +12 -4
  212. package/build-module/custom-select-control/index.js.map +1 -1
  213. package/build-module/divider/styles.js +29 -10
  214. package/build-module/divider/styles.js.map +1 -1
  215. package/build-module/focal-point-picker/controls.js +2 -3
  216. package/build-module/focal-point-picker/controls.js.map +1 -1
  217. package/build-module/form-file-upload/index.js +4 -1
  218. package/build-module/form-file-upload/index.js.map +1 -1
  219. package/build-module/index.js +3 -1
  220. package/build-module/index.js.map +1 -1
  221. package/build-module/input-control/input-field.js +21 -13
  222. package/build-module/input-control/input-field.js.map +1 -1
  223. package/build-module/input-control/reducer/actions.js +0 -1
  224. package/build-module/input-control/reducer/actions.js.map +1 -1
  225. package/build-module/input-control/reducer/reducer.js +2 -39
  226. package/build-module/input-control/reducer/reducer.js.map +1 -1
  227. package/build-module/item-group/styles.js +14 -14
  228. package/build-module/item-group/styles.js.map +1 -1
  229. package/build-module/mobile/picker/index.android.js +0 -3
  230. package/build-module/mobile/picker/index.android.js.map +1 -1
  231. package/build-module/number-control/index.js +15 -9
  232. package/build-module/number-control/index.js.map +1 -1
  233. package/build-module/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js +4 -4
  234. package/build-module/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js.map +1 -1
  235. package/build-module/surface/styles.js +8 -8
  236. package/build-module/surface/styles.js.map +1 -1
  237. package/build-module/toggle-group-control/index.js +1 -0
  238. package/build-module/toggle-group-control/index.js.map +1 -1
  239. package/build-module/toggle-group-control/toggle-group-control/component.js +8 -1
  240. package/build-module/toggle-group-control/toggle-group-control/component.js.map +1 -1
  241. package/build-module/toggle-group-control/toggle-group-control/styles.js +11 -3
  242. package/build-module/toggle-group-control/toggle-group-control/styles.js.map +1 -1
  243. package/build-module/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.js +86 -0
  244. package/build-module/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.js.map +1 -0
  245. package/build-module/toggle-group-control/toggle-group-control-option/component.js +9 -76
  246. package/build-module/toggle-group-control/toggle-group-control-option/component.js.map +1 -1
  247. package/build-module/toggle-group-control/toggle-group-control-option-base/component.js +105 -0
  248. package/build-module/toggle-group-control/toggle-group-control-option-base/component.js.map +1 -0
  249. package/build-module/toggle-group-control/toggle-group-control-option-base/index.js +2 -0
  250. package/build-module/toggle-group-control/toggle-group-control-option-base/index.js.map +1 -0
  251. package/build-module/toggle-group-control/toggle-group-control-option-base/styles.js +55 -0
  252. package/build-module/toggle-group-control/toggle-group-control-option-base/styles.js.map +1 -0
  253. package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js +50 -0
  254. package/build-module/toggle-group-control/toggle-group-control-option-icon/component.js.map +1 -0
  255. package/build-module/toggle-group-control/toggle-group-control-option-icon/index.js +2 -0
  256. package/build-module/toggle-group-control/toggle-group-control-option-icon/index.js.map +1 -0
  257. package/build-module/toolbar-dropdown-menu/index.js +1 -1
  258. package/build-module/toolbar-dropdown-menu/index.js.map +1 -1
  259. package/build-module/unit-control/index.js +54 -27
  260. package/build-module/unit-control/index.js.map +1 -1
  261. package/build-module/unit-control/unit-select-control.js +2 -3
  262. package/build-module/unit-control/unit-select-control.js.map +1 -1
  263. package/build-module/utils/colors-values.js +5 -3
  264. package/build-module/utils/colors-values.js.map +1 -1
  265. package/build-module/utils/config-values.js +8 -4
  266. package/build-module/utils/config-values.js.map +1 -1
  267. package/build-style/style-rtl.css +33 -182
  268. package/build-style/style.css +33 -182
  269. package/build-types/base-control/index.d.ts +35 -71
  270. package/build-types/base-control/index.d.ts.map +1 -1
  271. package/build-types/base-control/stories/index.d.ts +25 -0
  272. package/build-types/base-control/stories/index.d.ts.map +1 -0
  273. package/build-types/base-control/styles/base-control-styles.d.ts +10 -5
  274. package/build-types/base-control/styles/base-control-styles.d.ts.map +1 -1
  275. package/build-types/base-control/types.d.ts +41 -0
  276. package/build-types/base-control/types.d.ts.map +1 -0
  277. package/build-types/border-box-control/border-box-control/component.d.ts +4 -0
  278. package/build-types/border-box-control/border-box-control/component.d.ts.map +1 -0
  279. package/build-types/border-box-control/border-box-control/hook.d.ts +282 -0
  280. package/build-types/border-box-control/border-box-control/hook.d.ts.map +1 -0
  281. package/build-types/border-box-control/border-box-control/index.d.ts +3 -0
  282. package/build-types/border-box-control/border-box-control/index.d.ts.map +1 -0
  283. package/build-types/border-box-control/border-box-control-linked-button/component.d.ts +4 -0
  284. package/build-types/border-box-control/border-box-control-linked-button/component.d.ts.map +1 -0
  285. package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts +266 -0
  286. package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts.map +1 -0
  287. package/build-types/border-box-control/border-box-control-linked-button/index.d.ts +2 -0
  288. package/build-types/border-box-control/border-box-control-linked-button/index.d.ts.map +1 -0
  289. package/build-types/border-box-control/border-box-control-split-controls/component.d.ts +4 -0
  290. package/build-types/border-box-control/border-box-control-split-controls/component.d.ts.map +1 -0
  291. package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts +274 -0
  292. package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts.map +1 -0
  293. package/build-types/border-box-control/border-box-control-split-controls/index.d.ts +2 -0
  294. package/build-types/border-box-control/border-box-control-split-controls/index.d.ts.map +1 -0
  295. package/build-types/border-box-control/border-box-control-visualizer/component.d.ts +4 -0
  296. package/build-types/border-box-control/border-box-control-visualizer/component.d.ts.map +1 -0
  297. package/build-types/border-box-control/border-box-control-visualizer/hook.d.ts +266 -0
  298. package/build-types/border-box-control/border-box-control-visualizer/hook.d.ts.map +1 -0
  299. package/build-types/border-box-control/border-box-control-visualizer/index.d.ts +2 -0
  300. package/build-types/border-box-control/border-box-control-visualizer/index.d.ts.map +1 -0
  301. package/build-types/border-box-control/index.d.ts +4 -0
  302. package/build-types/border-box-control/index.d.ts.map +1 -0
  303. package/build-types/border-box-control/styles.d.ts +8 -0
  304. package/build-types/border-box-control/styles.d.ts.map +1 -0
  305. package/build-types/border-box-control/types.d.ts +91 -0
  306. package/build-types/border-box-control/types.d.ts.map +1 -0
  307. package/build-types/border-box-control/utils.d.ts +24 -0
  308. package/build-types/border-box-control/utils.d.ts.map +1 -0
  309. package/build-types/border-control/border-control/component.d.ts +4 -0
  310. package/build-types/border-control/border-control/component.d.ts.map +1 -0
  311. package/build-types/border-control/border-control/hook.d.ts +285 -0
  312. package/build-types/border-control/border-control/hook.d.ts.map +1 -0
  313. package/build-types/border-control/border-control/index.d.ts +3 -0
  314. package/build-types/border-control/border-control/index.d.ts.map +1 -0
  315. package/build-types/border-control/border-control-dropdown/component.d.ts +4 -0
  316. package/build-types/border-control/border-control-dropdown/component.d.ts.map +1 -0
  317. package/build-types/border-control/border-control-dropdown/hook.d.ts +280 -0
  318. package/build-types/border-control/border-control-dropdown/hook.d.ts.map +1 -0
  319. package/build-types/border-control/border-control-dropdown/index.d.ts +2 -0
  320. package/build-types/border-control/border-control-dropdown/index.d.ts.map +1 -0
  321. package/build-types/border-control/border-control-style-picker/component.d.ts +4 -0
  322. package/build-types/border-control/border-control-style-picker/component.d.ts.map +1 -0
  323. package/build-types/border-control/border-control-style-picker/hook.d.ts +269 -0
  324. package/build-types/border-control/border-control-style-picker/hook.d.ts.map +1 -0
  325. package/build-types/border-control/border-control-style-picker/index.d.ts +2 -0
  326. package/build-types/border-control/border-control-style-picker/index.d.ts.map +1 -0
  327. package/build-types/border-control/index.d.ts +3 -0
  328. package/build-types/border-control/index.d.ts.map +1 -0
  329. package/build-types/border-control/styles.d.ts +18 -0
  330. package/build-types/border-control/styles.d.ts.map +1 -0
  331. package/build-types/border-control/types.d.ts +163 -0
  332. package/build-types/border-control/types.d.ts.map +1 -0
  333. package/build-types/card/card-divider/hook.d.ts +1 -1
  334. package/build-types/card/styles.d.ts.map +1 -1
  335. package/build-types/color-indicator/index.d.ts +7 -0
  336. package/build-types/color-indicator/index.d.ts.map +1 -0
  337. package/build-types/color-palette/index.d.ts.map +1 -1
  338. package/build-types/color-picker/styles.d.ts +1 -1
  339. package/build-types/divider/stories/index.d.ts +1 -0
  340. package/build-types/divider/stories/index.d.ts.map +1 -1
  341. package/build-types/divider/styles.d.ts.map +1 -1
  342. package/build-types/divider/types.d.ts +8 -1
  343. package/build-types/divider/types.d.ts.map +1 -1
  344. package/build-types/input-control/input-field.d.ts.map +1 -1
  345. package/build-types/input-control/reducer/actions.d.ts +1 -3
  346. package/build-types/input-control/reducer/actions.d.ts.map +1 -1
  347. package/build-types/input-control/reducer/reducer.d.ts +3 -9
  348. package/build-types/input-control/reducer/reducer.d.ts.map +1 -1
  349. package/build-types/input-control/types.d.ts +2 -2
  350. package/build-types/input-control/types.d.ts.map +1 -1
  351. package/build-types/item-group/styles.d.ts.map +1 -1
  352. package/build-types/number-control/index.d.ts +3 -3
  353. package/build-types/number-control/index.d.ts.map +1 -1
  354. package/build-types/range-control/styles/range-control-styles.d.ts +1 -1
  355. package/build-types/resizable-box/resize-tooltip/styles/resize-tooltip.styles.d.ts.map +1 -1
  356. package/build-types/toggle-group-control/index.d.ts +1 -0
  357. package/build-types/toggle-group-control/index.d.ts.map +1 -1
  358. package/build-types/toggle-group-control/toggle-group-control/component.d.ts.map +1 -1
  359. package/build-types/toggle-group-control/toggle-group-control/styles.d.ts +5 -0
  360. package/build-types/toggle-group-control/toggle-group-control/styles.d.ts.map +1 -1
  361. package/build-types/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.d.ts +9 -0
  362. package/build-types/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.d.ts.map +1 -0
  363. package/build-types/toggle-group-control/toggle-group-control-option/component.d.ts +6 -2
  364. package/build-types/toggle-group-control/toggle-group-control-option/component.d.ts.map +1 -1
  365. package/build-types/toggle-group-control/toggle-group-control-option-base/component.d.ts +25 -0
  366. package/build-types/toggle-group-control/toggle-group-control-option-base/component.d.ts.map +1 -0
  367. package/build-types/toggle-group-control/toggle-group-control-option-base/index.d.ts +2 -0
  368. package/build-types/toggle-group-control/toggle-group-control-option-base/index.d.ts.map +1 -0
  369. package/build-types/toggle-group-control/{toggle-group-control-option → toggle-group-control-option-base}/styles.d.ts +0 -0
  370. package/build-types/toggle-group-control/toggle-group-control-option-base/styles.d.ts.map +1 -0
  371. package/build-types/toggle-group-control/toggle-group-control-option-icon/component.d.ts +37 -0
  372. package/build-types/toggle-group-control/toggle-group-control-option-icon/component.d.ts.map +1 -0
  373. package/build-types/toggle-group-control/toggle-group-control-option-icon/index.d.ts +2 -0
  374. package/build-types/toggle-group-control/toggle-group-control-option-icon/index.d.ts.map +1 -0
  375. package/build-types/toggle-group-control/types.d.ts +24 -8
  376. package/build-types/toggle-group-control/types.d.ts.map +1 -1
  377. package/build-types/ui/form-group/form-group.d.ts +2 -2
  378. package/build-types/unit-control/index.d.ts +12 -5
  379. package/build-types/unit-control/index.d.ts.map +1 -1
  380. package/build-types/unit-control/stories/index.d.ts +33 -0
  381. package/build-types/unit-control/stories/index.d.ts.map +1 -0
  382. package/build-types/unit-control/styles/unit-control-styles.d.ts +1 -1
  383. package/build-types/unit-control/types.d.ts +28 -7
  384. package/build-types/unit-control/types.d.ts.map +1 -1
  385. package/build-types/unit-control/unit-select-control.d.ts.map +1 -1
  386. package/build-types/utils/colors-values.d.ts +78 -18
  387. package/build-types/utils/colors-values.d.ts.map +1 -1
  388. package/build-types/utils/config-values.d.ts +71 -71
  389. package/build-types/utils/config-values.d.ts.map +1 -1
  390. package/package.json +17 -17
  391. package/src/animate/README.md +1 -1
  392. package/src/base-control/README.md +20 -12
  393. package/src/base-control/index.tsx +124 -0
  394. package/src/base-control/stories/index.tsx +80 -0
  395. package/src/base-control/styles/{base-control-styles.js → base-control-styles.ts} +23 -1
  396. package/src/base-control/types.ts +42 -0
  397. package/src/border-box-control/border-box-control/README.md +178 -0
  398. package/src/border-box-control/border-box-control/component.tsx +123 -0
  399. package/src/border-box-control/border-box-control/hook.ts +119 -0
  400. package/src/border-box-control/border-box-control/index.ts +2 -0
  401. package/src/border-box-control/border-box-control-linked-button/component.tsx +50 -0
  402. package/src/border-box-control/border-box-control-linked-button/hook.ts +30 -0
  403. package/src/border-box-control/border-box-control-linked-button/index.ts +1 -0
  404. package/src/border-box-control/border-box-control-split-controls/component.tsx +90 -0
  405. package/src/border-box-control/border-box-control-split-controls/hook.ts +34 -0
  406. package/src/border-box-control/border-box-control-split-controls/index.ts +1 -0
  407. package/src/border-box-control/border-box-control-visualizer/component.tsx +28 -0
  408. package/src/border-box-control/border-box-control-visualizer/hook.ts +30 -0
  409. package/src/border-box-control/border-box-control-visualizer/index.ts +1 -0
  410. package/src/border-box-control/index.ts +3 -0
  411. package/src/border-box-control/stories/index.js +104 -0
  412. package/src/border-box-control/styles.ts +69 -0
  413. package/src/border-box-control/test/index.js +354 -0
  414. package/src/border-box-control/test/utils.js +305 -0
  415. package/src/border-box-control/types.ts +98 -0
  416. package/src/border-box-control/utils.ts +151 -0
  417. package/src/border-control/border-control/README.md +181 -0
  418. package/src/border-control/border-control/component.tsx +112 -0
  419. package/src/border-control/border-control/hook.ts +145 -0
  420. package/src/border-control/border-control/index.ts +2 -0
  421. package/src/border-control/border-control-dropdown/component.tsx +252 -0
  422. package/src/border-control/border-control-dropdown/hook.ts +98 -0
  423. package/src/border-control/border-control-dropdown/index.ts +1 -0
  424. package/src/border-control/border-control-style-picker/component.tsx +89 -0
  425. package/src/border-control/border-control-style-picker/hook.ts +34 -0
  426. package/src/border-control/border-control-style-picker/index.ts +1 -0
  427. package/src/border-control/index.ts +2 -0
  428. package/src/border-control/stories/index.js +118 -0
  429. package/src/border-control/styles.ts +190 -0
  430. package/src/border-control/test/index.js +436 -0
  431. package/src/border-control/types.ts +173 -0
  432. package/src/box-control/all-input-control.js +2 -10
  433. package/src/box-control/axial-input-controls.js +32 -21
  434. package/src/box-control/input-controls.js +30 -19
  435. package/src/box-control/utils.js +29 -12
  436. package/src/card/styles.js +11 -5
  437. package/src/card/test/__snapshots__/index.js.snap +83 -66
  438. package/src/card/test/index.js +7 -5
  439. package/src/checkbox-control/index.js +34 -3
  440. package/src/checkbox-control/stories/index.js +44 -0
  441. package/src/checkbox-control/style.scss +4 -2
  442. package/src/color-palette/README.md +6 -0
  443. package/src/color-palette/index.js +73 -8
  444. package/src/color-palette/stories/index.js +69 -26
  445. package/src/color-palette/style.scss +11 -3
  446. package/src/color-palette/test/__snapshots__/index.js.snap +662 -12
  447. package/src/color-palette/test/index.js +1 -1
  448. package/src/custom-select-control/index.js +15 -3
  449. package/src/custom-select-control/stories/index.js +77 -74
  450. package/src/custom-select-control/style.scss +23 -4
  451. package/src/disabled/README.md +7 -10
  452. package/src/divider/stories/index.tsx +26 -23
  453. package/src/divider/styles.ts +9 -0
  454. package/src/divider/types.ts +11 -1
  455. package/src/flyout/test/__snapshots__/index.js.snap +7 -7
  456. package/src/focal-point-picker/controls.js +2 -3
  457. package/src/form-file-upload/README.md +18 -0
  458. package/src/form-file-upload/index.js +3 -0
  459. package/src/form-file-upload/test/index.js +73 -11
  460. package/src/form-toggle/README.md +1 -1
  461. package/src/index.js +8 -0
  462. package/src/input-control/input-field.tsx +23 -12
  463. package/src/input-control/reducer/actions.ts +1 -7
  464. package/src/input-control/reducer/reducer.ts +0 -29
  465. package/src/input-control/types.ts +2 -1
  466. package/src/item-group/styles.ts +1 -0
  467. package/src/item-group/test/__snapshots__/index.js.snap +11 -10
  468. package/src/mobile/picker/index.android.js +0 -1
  469. package/src/number-control/README.md +14 -0
  470. package/src/number-control/index.js +13 -12
  471. package/src/number-control/stories/index.js +14 -7
  472. package/src/number-control/test/index.js +79 -1
  473. package/src/range-control/stories/index.js +91 -119
  474. package/src/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js +1 -0
  475. package/src/surface/styles.js +1 -1
  476. package/src/surface/test/__snapshots__/index.js.snap +11 -11
  477. package/src/toggle-group-control/index.ts +1 -0
  478. package/src/toggle-group-control/stories/index.js +37 -7
  479. package/src/toggle-group-control/test/__snapshots__/index.js.snap +269 -5
  480. package/src/toggle-group-control/test/index.js +43 -10
  481. package/src/toggle-group-control/toggle-group-control/component.tsx +10 -0
  482. package/src/toggle-group-control/toggle-group-control/styles.ts +14 -0
  483. package/src/toggle-group-control/toggle-group-control/toggle-group-control-backdrop.tsx +86 -0
  484. package/src/toggle-group-control/toggle-group-control-option/README.md +8 -5
  485. package/src/toggle-group-control/toggle-group-control-option/component.tsx +18 -94
  486. package/src/toggle-group-control/toggle-group-control-option-base/README.md +27 -0
  487. package/src/toggle-group-control/toggle-group-control-option-base/component.tsx +129 -0
  488. package/src/toggle-group-control/toggle-group-control-option-base/index.ts +1 -0
  489. package/src/toggle-group-control/{toggle-group-control-option → toggle-group-control-option-base}/styles.ts +4 -1
  490. package/src/toggle-group-control/toggle-group-control-option-icon/README.md +56 -0
  491. package/src/toggle-group-control/toggle-group-control-option-icon/component.tsx +56 -0
  492. package/src/toggle-group-control/toggle-group-control-option-icon/index.ts +1 -0
  493. package/src/toggle-group-control/types.ts +33 -8
  494. package/src/toolbar-dropdown-menu/index.js +1 -1
  495. package/src/toolbar-group/style.scss +0 -73
  496. package/src/tools-panel/test/__snapshots__/index.js.snap +8 -8
  497. package/src/unit-control/README.md +7 -3
  498. package/src/unit-control/index.tsx +65 -31
  499. package/src/unit-control/stories/index.tsx +170 -0
  500. package/src/unit-control/test/index.js +263 -100
  501. package/src/unit-control/types.ts +65 -42
  502. package/src/unit-control/unit-select-control.tsx +2 -3
  503. package/src/utils/colors-values.js +4 -3
  504. package/src/utils/config-values.js +9 -4
  505. package/tsconfig.json +3 -0
  506. package/tsconfig.tsbuildinfo +1 -1
  507. package/build/toggle-group-control/toggle-group-control-option/styles.js +0 -66
  508. package/build/toggle-group-control/toggle-group-control-option/styles.js.map +0 -1
  509. package/build-module/toggle-group-control/toggle-group-control-option/styles.js +0 -55
  510. package/build-module/toggle-group-control/toggle-group-control-option/styles.js.map +0 -1
  511. package/build-types/toggle-group-control/toggle-group-control-option/styles.d.ts.map +0 -1
  512. package/src/base-control/index.js +0 -111
  513. package/src/base-control/stories/index.js +0 -81
  514. package/src/unit-control/stories/index.js +0 -127
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/checkbox-control/index.js"],"names":["classnames","useInstanceId","deprecated","Icon","check","BaseControl","CheckboxControl","label","className","heading","checked","help","onChange","props","alternative","since","instanceId","id","onChangeValue","event","target","undefined"],"mappings":";;;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,aAAT,QAA8B,oBAA9B;AACA,OAAOC,UAAP,MAAuB,uBAAvB;AACA,SAASC,IAAT,EAAeC,KAAf,QAA4B,kBAA5B;AAEA;AACA;AACA;;AACA,OAAOC,WAAP,MAAwB,iBAAxB;AAEA,eAAe,SAASC,eAAT,OAQX;AAAA,MARqC;AACxCC,IAAAA,KADwC;AAExCC,IAAAA,SAFwC;AAGxCC,IAAAA,OAHwC;AAIxCC,IAAAA,OAJwC;AAKxCC,IAAAA,IALwC;AAMxCC,IAAAA,QANwC;AAOxC,OAAGC;AAPqC,GAQrC;;AACH,MAAKJ,OAAL,EAAe;AACdP,IAAAA,UAAU,CAAE,qCAAF,EAAyC;AAClDY,MAAAA,WAAW,EAAE,2CADqC;AAElDC,MAAAA,KAAK,EAAE;AAF2C,KAAzC,CAAV;AAIA;;AAED,QAAMC,UAAU,GAAGf,aAAa,CAAEK,eAAF,CAAhC;AACA,QAAMW,EAAE,GAAI,8BAA8BD,UAAY,EAAtD;;AACA,QAAME,aAAa,GAAKC,KAAF,IAAaP,QAAQ,CAAEO,KAAK,CAACC,MAAN,CAAaV,OAAf,CAA3C;;AAEA,SACC,cAAC,WAAD;AACC,IAAA,KAAK,EAAGD,OADT;AAEC,IAAA,EAAE,EAAGQ,EAFN;AAGC,IAAA,IAAI,EAAGN,IAHR;AAIC,IAAA,SAAS,EAAGX,UAAU,CAAE,6BAAF,EAAiCQ,SAAjC;AAJvB,KAMC;AAAM,IAAA,SAAS,EAAC;AAAhB,KACC;AACC,IAAA,EAAE,EAAGS,EADN;AAEC,IAAA,SAAS,EAAC,oCAFX;AAGC,IAAA,IAAI,EAAC,UAHN;AAIC,IAAA,KAAK,EAAC,GAJP;AAKC,IAAA,QAAQ,EAAGC,aALZ;AAMC,IAAA,OAAO,EAAGR,OANX;AAOC,wBAAmB,CAAC,CAAEC,IAAH,GAAUM,EAAE,GAAG,QAAf,GAA0BI;AAP9C,KAQMR,KARN,EADD,EAWGH,OAAO,GACR,cAAC,IAAD;AACC,IAAA,IAAI,EAAGN,KADR;AAEC,IAAA,SAAS,EAAC,sCAFX;AAGC,IAAA,IAAI,EAAC;AAHN,IADQ,GAML,IAjBL,CAND,EAyBC;AACC,IAAA,SAAS,EAAC,oCADX;AAEC,IAAA,OAAO,EAAGa;AAFX,KAIGV,KAJH,CAzBD,CADD;AAkCA","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport deprecated from '@wordpress/deprecated';\nimport { Icon, check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../base-control';\n\nexport default function CheckboxControl( {\n\tlabel,\n\tclassName,\n\theading,\n\tchecked,\n\thelp,\n\tonChange,\n\t...props\n} ) {\n\tif ( heading ) {\n\t\tdeprecated( '`heading` prop in `CheckboxControl`', {\n\t\t\talternative: 'a separate element to implement a heading',\n\t\t\tsince: '5.8',\n\t\t} );\n\t}\n\n\tconst instanceId = useInstanceId( CheckboxControl );\n\tconst id = `inspector-checkbox-control-${ instanceId }`;\n\tconst onChangeValue = ( event ) => onChange( event.target.checked );\n\n\treturn (\n\t\t<BaseControl\n\t\t\tlabel={ heading }\n\t\t\tid={ id }\n\t\t\thelp={ help }\n\t\t\tclassName={ classnames( 'components-checkbox-control', className ) }\n\t\t>\n\t\t\t<span className=\"components-checkbox-control__input-container\">\n\t\t\t\t<input\n\t\t\t\t\tid={ id }\n\t\t\t\t\tclassName=\"components-checkbox-control__input\"\n\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\tvalue=\"1\"\n\t\t\t\t\tonChange={ onChangeValue }\n\t\t\t\t\tchecked={ checked }\n\t\t\t\t\taria-describedby={ !! help ? id + '__help' : undefined }\n\t\t\t\t\t{ ...props }\n\t\t\t\t/>\n\t\t\t\t{ checked ? (\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={ check }\n\t\t\t\t\t\tclassName=\"components-checkbox-control__checked\"\n\t\t\t\t\t\trole=\"presentation\"\n\t\t\t\t\t/>\n\t\t\t\t) : null }\n\t\t\t</span>\n\t\t\t<label\n\t\t\t\tclassName=\"components-checkbox-control__label\"\n\t\t\t\thtmlFor={ id }\n\t\t\t>\n\t\t\t\t{ label }\n\t\t\t</label>\n\t\t</BaseControl>\n\t);\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/checkbox-control/index.js"],"names":["classnames","useState","useInstanceId","useRefEffect","deprecated","Icon","check","reset","BaseControl","CheckboxControl","label","className","heading","checked","indeterminate","help","onChange","props","alternative","since","showCheckedIcon","setShowCheckedIcon","showIndeterminateIcon","setShowIndeterminateIcon","ref","node","matches","instanceId","id","onChangeValue","event","target","undefined"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useState } from '@wordpress/element';\nimport { useInstanceId, useRefEffect } from '@wordpress/compose';\nimport deprecated from '@wordpress/deprecated';\nimport { Icon, check, reset } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport BaseControl from '../base-control';\n\nexport default function CheckboxControl( {\n\tlabel,\n\tclassName,\n\theading,\n\tchecked,\n\tindeterminate,\n\thelp,\n\tonChange,\n\t...props\n} ) {\n\tif ( heading ) {\n\t\tdeprecated( '`heading` prop in `CheckboxControl`', {\n\t\t\talternative: 'a separate element to implement a heading',\n\t\t\tsince: '5.8',\n\t\t} );\n\t}\n\n\tconst [ showCheckedIcon, setShowCheckedIcon ] = useState( false );\n\tconst [ showIndeterminateIcon, setShowIndeterminateIcon ] = useState(\n\t\tfalse\n\t);\n\n\t// Run the following callback everytime the `ref` (and the additional\n\t// dependencies) change.\n\tconst ref = useRefEffect(\n\t\t( node ) => {\n\t\t\tif ( ! node ) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// It cannot be set using an HTML attribute.\n\t\t\tnode.indeterminate = !! indeterminate;\n\n\t\t\tsetShowCheckedIcon( node.matches( ':checked' ) );\n\t\t\tsetShowIndeterminateIcon( node.matches( ':indeterminate' ) );\n\t\t},\n\t\t[ checked, indeterminate ]\n\t);\n\tconst instanceId = useInstanceId( CheckboxControl );\n\tconst id = `inspector-checkbox-control-${ instanceId }`;\n\tconst onChangeValue = ( event ) => onChange( event.target.checked );\n\n\treturn (\n\t\t<BaseControl\n\t\t\tlabel={ heading }\n\t\t\tid={ id }\n\t\t\thelp={ help }\n\t\t\tclassName={ classnames( 'components-checkbox-control', className ) }\n\t\t>\n\t\t\t<span className=\"components-checkbox-control__input-container\">\n\t\t\t\t<input\n\t\t\t\t\tref={ ref }\n\t\t\t\t\tid={ id }\n\t\t\t\t\tclassName=\"components-checkbox-control__input\"\n\t\t\t\t\ttype=\"checkbox\"\n\t\t\t\t\tvalue=\"1\"\n\t\t\t\t\tonChange={ onChangeValue }\n\t\t\t\t\tchecked={ checked }\n\t\t\t\t\taria-describedby={ !! help ? id + '__help' : undefined }\n\t\t\t\t\t{ ...props }\n\t\t\t\t/>\n\t\t\t\t{ showIndeterminateIcon ? (\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={ reset }\n\t\t\t\t\t\tclassName=\"components-checkbox-control__indeterminate\"\n\t\t\t\t\t\trole=\"presentation\"\n\t\t\t\t\t/>\n\t\t\t\t) : null }\n\t\t\t\t{ showCheckedIcon ? (\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={ check }\n\t\t\t\t\t\tclassName=\"components-checkbox-control__checked\"\n\t\t\t\t\t\trole=\"presentation\"\n\t\t\t\t\t/>\n\t\t\t\t) : null }\n\t\t\t</span>\n\t\t\t<label\n\t\t\t\tclassName=\"components-checkbox-control__label\"\n\t\t\t\thtmlFor={ id }\n\t\t\t>\n\t\t\t\t{ label }\n\t\t\t</label>\n\t\t</BaseControl>\n\t);\n}\n"]}
@@ -24,6 +24,8 @@ import Dropdown from '../dropdown';
24
24
  import { ColorPicker } from '../color-picker';
25
25
  import CircularOptionPicker from '../circular-option-picker';
26
26
  import { VStack } from '../v-stack';
27
+ import { Flex, FlexItem } from '../flex';
28
+ import { Truncate } from '../truncate';
27
29
  import { ColorHeading } from './styles';
28
30
  extend([namesPlugin, a11yPlugin]);
29
31
 
@@ -110,6 +112,37 @@ export function CustomColorPickerDropdown(_ref5) {
110
112
  })
111
113
  }, props));
112
114
  }
115
+
116
+ const extractColorNameFromCurrentValue = function (currentValue) {
117
+ let colors = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
118
+ let showMultiplePalettes = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
119
+
120
+ if (!currentValue) {
121
+ return '';
122
+ } // Normalize format of `colors` to simplify the following loop
123
+
124
+
125
+ const colorPalettes = showMultiplePalettes ? colors : [{
126
+ colors
127
+ }];
128
+
129
+ for (const {
130
+ colors: paletteColors
131
+ } of colorPalettes) {
132
+ for (const {
133
+ name: colorName,
134
+ color: colorValue
135
+ } of paletteColors) {
136
+ if (colord(currentValue).toHex() === colord(colorValue).toHex()) {
137
+ return colorName;
138
+ }
139
+ }
140
+ } // translators: shown when the user has picked a custom color (i.e not in the palette of colors).
141
+
142
+
143
+ return __('Custom');
144
+ };
145
+
113
146
  export default function ColorPalette(_ref6) {
114
147
  let {
115
148
  clearable = true,
@@ -123,7 +156,8 @@ export default function ColorPalette(_ref6) {
123
156
  __experimentalIsRenderedInSidebar = false
124
157
  } = _ref6;
125
158
  const clearColor = useCallback(() => onChange(undefined), [onChange]);
126
- const Component = __experimentalHasMultipleOrigins && colors !== null && colors !== void 0 && colors.length ? MultiplePalettes : SinglePalette;
159
+ const showMultiplePalettes = __experimentalHasMultipleOrigins && (colors === null || colors === void 0 ? void 0 : colors.length);
160
+ const Component = showMultiplePalettes ? MultiplePalettes : SinglePalette;
127
161
 
128
162
  const renderCustomColorPicker = () => createElement(ColorPicker, {
129
163
  color: value,
@@ -138,6 +172,10 @@ export default function ColorPalette(_ref6) {
138
172
  }
139
173
 
140
174
  const colordColor = colord(value);
175
+ const valueWithoutLeadingHash = value !== null && value !== void 0 && value.startsWith('#') ? value.substring(1) : value !== null && value !== void 0 ? value : '';
176
+ const buttonLabelName = useMemo(() => extractColorNameFromCurrentValue(value, colors, showMultiplePalettes), [value, colors, showMultiplePalettes]);
177
+ const customColorAccessibleLabel = !!valueWithoutLeadingHash ? sprintf( // translators: %1$s: The name of the color e.g: "vivid red". %2$s: The color's hex code e.g: "#f00".
178
+ __('Custom color picker. The currently selected color is called "%1$s" and has a value of "%2$s".'), buttonLabelName, valueWithoutLeadingHash) : __('Custom color picker.');
141
179
  return createElement(VStack, {
142
180
  spacing: 3,
143
181
  className: className
@@ -150,17 +188,27 @@ export default function ColorPalette(_ref6) {
150
188
  isOpen,
151
189
  onToggle
152
190
  } = _ref7;
153
- return createElement("button", {
191
+ return createElement(Flex, {
192
+ as: 'button',
193
+ justify: "space-between",
194
+ align: "flex-start",
154
195
  className: "components-color-palette__custom-color",
155
196
  "aria-expanded": isOpen,
156
197
  "aria-haspopup": "true",
157
198
  onClick: onToggle,
158
- "aria-label": __('Custom color picker'),
199
+ "aria-label": customColorAccessibleLabel,
159
200
  style: {
160
201
  background: value,
161
202
  color: colordColor.contrast() > colordColor.contrast('#000') ? '#fff' : '#000'
162
203
  }
163
- }, value);
204
+ }, createElement(FlexItem, {
205
+ isBlock: true,
206
+ as: Truncate,
207
+ className: "components-color-palette__custom-color-name"
208
+ }, buttonLabelName), createElement(FlexItem, {
209
+ as: "span",
210
+ className: "components-color-palette__custom-color-value"
211
+ }, valueWithoutLeadingHash));
164
212
  }
165
213
  }), createElement(Component, {
166
214
  clearable: clearable,
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/color-palette/index.js"],"names":["map","colord","extend","namesPlugin","a11yPlugin","classnames","__","sprintf","useCallback","useMemo","Dropdown","ColorPicker","CircularOptionPicker","VStack","ColorHeading","SinglePalette","className","clearColor","colors","onChange","value","actions","colorOptions","color","name","colordColor","fill","contrast","backgroundColor","MultiplePalettes","index","colorPalette","length","CustomColorPickerDropdown","isRenderedInSidebar","props","ColorPalette","clearable","disableCustomColors","enableAlpha","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","undefined","Component","renderCustomColorPicker","dropdownPosition","isOpen","onToggle","background"],"mappings":"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","sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport { map } from 'lodash';\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\nimport a11yPlugin from 'colord/plugins/a11y';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Dropdown from '../dropdown';\nimport { ColorPicker } from '../color-picker';\nimport CircularOptionPicker from '../circular-option-picker';\nimport { VStack } from '../v-stack';\nimport { ColorHeading } from './styles';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\nfunction SinglePalette( {\n\tclassName,\n\tclearColor,\n\tcolors,\n\tonChange,\n\tvalue,\n\tactions,\n} ) {\n\tconst colorOptions = useMemo( () => {\n\t\treturn map( colors, ( { color, name } ) => {\n\t\t\tconst colordColor = colord( color );\n\n\t\t\treturn (\n\t\t\t\t<CircularOptionPicker.Option\n\t\t\t\t\tkey={ color }\n\t\t\t\t\tisSelected={ value === color }\n\t\t\t\t\tselectedIconProps={\n\t\t\t\t\t\tvalue === color\n\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\tfill:\n\t\t\t\t\t\t\t\t\t\tcolordColor.contrast() >\n\t\t\t\t\t\t\t\t\t\tcolordColor.contrast( '#000' )\n\t\t\t\t\t\t\t\t\t\t\t? '#fff'\n\t\t\t\t\t\t\t\t\t\t\t: '#000',\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t: {}\n\t\t\t\t\t}\n\t\t\t\t\ttooltipText={\n\t\t\t\t\t\tname ||\n\t\t\t\t\t\t// translators: %s: color hex code e.g: \"#f00\".\n\t\t\t\t\t\tsprintf( __( 'Color code: %s' ), color )\n\t\t\t\t\t}\n\t\t\t\t\tstyle={ { backgroundColor: color, color } }\n\t\t\t\t\tonClick={\n\t\t\t\t\t\tvalue === color ? clearColor : () => onChange( color )\n\t\t\t\t\t}\n\t\t\t\t\taria-label={\n\t\t\t\t\t\tname\n\t\t\t\t\t\t\t? // translators: %s: The name of the color e.g: \"vivid red\".\n\t\t\t\t\t\t\t sprintf( __( 'Color: %s' ), name )\n\t\t\t\t\t\t\t: // translators: %s: color hex code e.g: \"#f00\".\n\t\t\t\t\t\t\t sprintf( __( 'Color code: %s' ), color )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t);\n\t\t} );\n\t}, [ colors, value, onChange, clearColor ] );\n\treturn (\n\t\t<CircularOptionPicker\n\t\t\tclassName={ className }\n\t\t\toptions={ colorOptions }\n\t\t\tactions={ actions }\n\t\t/>\n\t);\n}\n\nfunction MultiplePalettes( {\n\tclassName,\n\tclearColor,\n\tcolors,\n\tonChange,\n\tvalue,\n\tactions,\n} ) {\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ colors.map( ( { name, colors: colorPalette }, index ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<VStack spacing={ 2 } key={ index }>\n\t\t\t\t\t\t<ColorHeading>{ name }</ColorHeading>\n\t\t\t\t\t\t<SinglePalette\n\t\t\t\t\t\t\tclearColor={ clearColor }\n\t\t\t\t\t\t\tcolors={ colorPalette }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\tactions={\n\t\t\t\t\t\t\t\tcolors.length === index + 1 ? actions : null\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</VStack>\n\t);\n}\n\nexport function CustomColorPickerDropdown( { isRenderedInSidebar, ...props } ) {\n\treturn (\n\t\t<Dropdown\n\t\t\tcontentClassName={ classnames(\n\t\t\t\t'components-color-palette__custom-color-dropdown-content',\n\t\t\t\t{\n\t\t\t\t\t'is-rendered-in-sidebar': isRenderedInSidebar,\n\t\t\t\t}\n\t\t\t) }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nexport default function ColorPalette( {\n\tclearable = true,\n\tclassName,\n\tcolors,\n\tdisableCustomColors = false,\n\tenableAlpha,\n\tonChange,\n\tvalue,\n\t__experimentalHasMultipleOrigins = false,\n\t__experimentalIsRenderedInSidebar = false,\n} ) {\n\tconst clearColor = useCallback( () => onChange( undefined ), [ onChange ] );\n\tconst Component =\n\t\t__experimentalHasMultipleOrigins && colors?.length\n\t\t\t? MultiplePalettes\n\t\t\t: SinglePalette;\n\n\tconst renderCustomColorPicker = () => (\n\t\t<ColorPicker\n\t\t\tcolor={ value }\n\t\t\tonChange={ ( color ) => onChange( color ) }\n\t\t\tenableAlpha={ enableAlpha }\n\t\t/>\n\t);\n\n\tlet dropdownPosition;\n\tif ( __experimentalIsRenderedInSidebar ) {\n\t\tdropdownPosition = 'bottom left';\n\t}\n\n\tconst colordColor = colord( value );\n\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ ! disableCustomColors && (\n\t\t\t\t<CustomColorPickerDropdown\n\t\t\t\t\tposition={ dropdownPosition }\n\t\t\t\t\tisRenderedInSidebar={ __experimentalIsRenderedInSidebar }\n\t\t\t\t\trenderContent={ renderCustomColorPicker }\n\t\t\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color\"\n\t\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\t\taria-label={ __( 'Custom color picker' ) }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tbackground: value,\n\t\t\t\t\t\t\t\tcolor:\n\t\t\t\t\t\t\t\t\tcolordColor.contrast() >\n\t\t\t\t\t\t\t\t\tcolordColor.contrast( '#000' )\n\t\t\t\t\t\t\t\t\t\t? '#fff'\n\t\t\t\t\t\t\t\t\t\t: '#000',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ value }\n\t\t\t\t\t\t</button>\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t<Component\n\t\t\t\tclearable={ clearable }\n\t\t\t\tclearColor={ clearColor }\n\t\t\t\tcolors={ colors }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tvalue={ value }\n\t\t\t\tactions={\n\t\t\t\t\t!! clearable && (\n\t\t\t\t\t\t<CircularOptionPicker.ButtonAction\n\t\t\t\t\t\t\tonClick={ clearColor }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Clear' ) }\n\t\t\t\t\t\t</CircularOptionPicker.ButtonAction>\n\t\t\t\t\t)\n\t\t\t\t}\n\t\t\t/>\n\t\t</VStack>\n\t);\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/color-palette/index.js"],"names":["map","colord","extend","namesPlugin","a11yPlugin","classnames","__","sprintf","useCallback","useMemo","Dropdown","ColorPicker","CircularOptionPicker","VStack","Flex","FlexItem","Truncate","ColorHeading","SinglePalette","className","clearColor","colors","onChange","value","actions","colorOptions","color","name","colordColor","fill","contrast","backgroundColor","MultiplePalettes","index","colorPalette","length","CustomColorPickerDropdown","isRenderedInSidebar","props","extractColorNameFromCurrentValue","currentValue","showMultiplePalettes","colorPalettes","paletteColors","colorName","colorValue","toHex","ColorPalette","clearable","disableCustomColors","enableAlpha","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","undefined","Component","renderCustomColorPicker","dropdownPosition","valueWithoutLeadingHash","startsWith","substring","buttonLabelName","customColorAccessibleLabel","isOpen","onToggle","background"],"mappings":";;AAAA;;AACA;AACA;AACA;AACA,SAASA,GAAT,QAAoB,QAApB;AACA,SAASC,MAAT,EAAiBC,MAAjB,QAA+B,QAA/B;AACA,OAAOC,WAAP,MAAwB,sBAAxB;AACA,OAAOC,UAAP,MAAuB,qBAAvB;AACA,OAAOC,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,EAAT,EAAaC,OAAb,QAA4B,iBAA5B;AACA,SAASC,WAAT,EAAsBC,OAAtB,QAAqC,oBAArC;AAEA;AACA;AACA;;AACA,OAAOC,QAAP,MAAqB,aAArB;AACA,SAASC,WAAT,QAA4B,iBAA5B;AACA,OAAOC,oBAAP,MAAiC,2BAAjC;AACA,SAASC,MAAT,QAAuB,YAAvB;AACA,SAASC,IAAT,EAAeC,QAAf,QAA+B,SAA/B;AACA,SAASC,QAAT,QAAyB,aAAzB;AACA,SAASC,YAAT,QAA6B,UAA7B;AAEAf,MAAM,CAAE,CAAEC,WAAF,EAAeC,UAAf,CAAF,CAAN;;AAEA,SAASc,aAAT,OAOI;AAAA,MAPoB;AACvBC,IAAAA,SADuB;AAEvBC,IAAAA,UAFuB;AAGvBC,IAAAA,MAHuB;AAIvBC,IAAAA,QAJuB;AAKvBC,IAAAA,KALuB;AAMvBC,IAAAA;AANuB,GAOpB;AACH,QAAMC,YAAY,GAAGhB,OAAO,CAAE,MAAM;AACnC,WAAOT,GAAG,CAAEqB,MAAF,EAAU,SAAuB;AAAA,UAArB;AAAEK,QAAAA,KAAF;AAASC,QAAAA;AAAT,OAAqB;AAC1C,YAAMC,WAAW,GAAG3B,MAAM,CAAEyB,KAAF,CAA1B;AAEA,aACC,cAAC,oBAAD,CAAsB,MAAtB;AACC,QAAA,GAAG,EAAGA,KADP;AAEC,QAAA,UAAU,EAAGH,KAAK,KAAKG,KAFxB;AAGC,QAAA,iBAAiB,EAChBH,KAAK,KAAKG,KAAV,GACG;AACAG,UAAAA,IAAI,EACHD,WAAW,CAACE,QAAZ,KACAF,WAAW,CAACE,QAAZ,CAAsB,MAAtB,CADA,GAEG,MAFH,GAGG;AALJ,SADH,GAQG,EAZL;AAcC,QAAA,WAAW,EACVH,IAAI,IACJ;AACApB,QAAAA,OAAO,CAAED,EAAE,CAAE,gBAAF,CAAJ,EAA0BoB,KAA1B,CAjBT;AAmBC,QAAA,KAAK,EAAG;AAAEK,UAAAA,eAAe,EAAEL,KAAnB;AAA0BA,UAAAA;AAA1B,SAnBT;AAoBC,QAAA,OAAO,EACNH,KAAK,KAAKG,KAAV,GAAkBN,UAAlB,GAA+B,MAAME,QAAQ,CAAEI,KAAF,CArB/C;AAuBC,sBACCC,IAAI,GACD;AACApB,QAAAA,OAAO,CAAED,EAAE,CAAE,WAAF,CAAJ,EAAqBqB,IAArB,CAFN,GAGD;AACApB,QAAAA,OAAO,CAAED,EAAE,CAAE,gBAAF,CAAJ,EAA0BoB,KAA1B;AA5BZ,QADD;AAiCA,KApCS,CAAV;AAqCA,GAtC2B,EAsCzB,CAAEL,MAAF,EAAUE,KAAV,EAAiBD,QAAjB,EAA2BF,UAA3B,CAtCyB,CAA5B;AAuCA,SACC,cAAC,oBAAD;AACC,IAAA,SAAS,EAAGD,SADb;AAEC,IAAA,OAAO,EAAGM,YAFX;AAGC,IAAA,OAAO,EAAGD;AAHX,IADD;AAOA;;AAED,SAASQ,gBAAT,QAOI;AAAA,MAPuB;AAC1Bb,IAAAA,SAD0B;AAE1BC,IAAAA,UAF0B;AAG1BC,IAAAA,MAH0B;AAI1BC,IAAAA,QAJ0B;AAK1BC,IAAAA,KAL0B;AAM1BC,IAAAA;AAN0B,GAOvB;AACH,SACC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAG,CAAlB;AAAsB,IAAA,SAAS,EAAGL;AAAlC,KACGE,MAAM,CAACrB,GAAP,CAAY,QAAkCiC,KAAlC,KAA6C;AAAA,QAA3C;AAAEN,MAAAA,IAAF;AAAQN,MAAAA,MAAM,EAAEa;AAAhB,KAA2C;AAC1D,WACC,cAAC,MAAD;AAAQ,MAAA,OAAO,EAAG,CAAlB;AAAsB,MAAA,GAAG,EAAGD;AAA5B,OACC,cAAC,YAAD,QAAgBN,IAAhB,CADD,EAEC,cAAC,aAAD;AACC,MAAA,UAAU,EAAGP,UADd;AAEC,MAAA,MAAM,EAAGc,YAFV;AAGC,MAAA,QAAQ,EAAGZ,QAHZ;AAIC,MAAA,KAAK,EAAGC,KAJT;AAKC,MAAA,OAAO,EACNF,MAAM,CAACc,MAAP,KAAkBF,KAAK,GAAG,CAA1B,GAA8BT,OAA9B,GAAwC;AAN1C,MAFD,CADD;AAcA,GAfC,CADH,CADD;AAoBA;;AAED,OAAO,SAASY,yBAAT,QAAwE;AAAA,MAApC;AAAEC,IAAAA,mBAAF;AAAuB,OAAGC;AAA1B,GAAoC;AAC9E,SACC,cAAC,QAAD;AACC,IAAA,gBAAgB,EAAGjC,UAAU,CAC5B,yDAD4B,EAE5B;AACC,gCAA0BgC;AAD3B,KAF4B;AAD9B,KAOMC,KAPN,EADD;AAWA;;AAED,MAAMC,gCAAgC,GAAG,UACxCC,YADwC,EAIpC;AAAA,MAFJnB,MAEI,uEAFK,EAEL;AAAA,MADJoB,oBACI,uEADmB,KACnB;;AACJ,MAAK,CAAED,YAAP,EAAsB;AACrB,WAAO,EAAP;AACA,GAHG,CAKJ;;;AACA,QAAME,aAAa,GAAGD,oBAAoB,GAAGpB,MAAH,GAAY,CAAE;AAAEA,IAAAA;AAAF,GAAF,CAAtD;;AACA,OAAM,MAAM;AAAEA,IAAAA,MAAM,EAAEsB;AAAV,GAAZ,IAAyCD,aAAzC,EAAyD;AACxD,SAAM,MAAM;AAAEf,MAAAA,IAAI,EAAEiB,SAAR;AAAmBlB,MAAAA,KAAK,EAAEmB;AAA1B,KAAZ,IAAsDF,aAAtD,EAAsE;AACrE,UACC1C,MAAM,CAAEuC,YAAF,CAAN,CAAuBM,KAAvB,OAAmC7C,MAAM,CAAE4C,UAAF,CAAN,CAAqBC,KAArB,EADpC,EAEE;AACD,eAAOF,SAAP;AACA;AACD;AACD,GAfG,CAiBJ;;;AACA,SAAOtC,EAAE,CAAE,QAAF,CAAT;AACA,CAvBD;;AAyBA,eAAe,SAASyC,YAAT,QAUX;AAAA,MAVkC;AACrCC,IAAAA,SAAS,GAAG,IADyB;AAErC7B,IAAAA,SAFqC;AAGrCE,IAAAA,MAHqC;AAIrC4B,IAAAA,mBAAmB,GAAG,KAJe;AAKrCC,IAAAA,WALqC;AAMrC5B,IAAAA,QANqC;AAOrCC,IAAAA,KAPqC;AAQrC4B,IAAAA,gCAAgC,GAAG,KARE;AASrCC,IAAAA,iCAAiC,GAAG;AATC,GAUlC;AACH,QAAMhC,UAAU,GAAGZ,WAAW,CAAE,MAAMc,QAAQ,CAAE+B,SAAF,CAAhB,EAA+B,CAAE/B,QAAF,CAA/B,CAA9B;AACA,QAAMmB,oBAAoB,GACzBU,gCAAgC,KAAI9B,MAAJ,aAAIA,MAAJ,uBAAIA,MAAM,CAAEc,MAAZ,CADjC;AAEA,QAAMmB,SAAS,GAAGb,oBAAoB,GAAGT,gBAAH,GAAsBd,aAA5D;;AAEA,QAAMqC,uBAAuB,GAAG,MAC/B,cAAC,WAAD;AACC,IAAA,KAAK,EAAGhC,KADT;AAEC,IAAA,QAAQ,EAAKG,KAAF,IAAaJ,QAAQ,CAAEI,KAAF,CAFjC;AAGC,IAAA,WAAW,EAAGwB;AAHf,IADD;;AAQA,MAAIM,gBAAJ;;AACA,MAAKJ,iCAAL,EAAyC;AACxCI,IAAAA,gBAAgB,GAAG,aAAnB;AACA;;AAED,QAAM5B,WAAW,GAAG3B,MAAM,CAAEsB,KAAF,CAA1B;AAEA,QAAMkC,uBAAuB,GAAGlC,KAAK,SAAL,IAAAA,KAAK,WAAL,IAAAA,KAAK,CAAEmC,UAAP,CAAmB,GAAnB,IAC7BnC,KAAK,CAACoC,SAAN,CAAiB,CAAjB,CAD6B,GAE7BpC,KAF6B,aAE7BA,KAF6B,cAE7BA,KAF6B,GAEpB,EAFZ;AAGA,QAAMqC,eAAe,GAAGnD,OAAO,CAC9B,MACC8B,gCAAgC,CAC/BhB,KAD+B,EAE/BF,MAF+B,EAG/BoB,oBAH+B,CAFH,EAO9B,CAAElB,KAAF,EAASF,MAAT,EAAiBoB,oBAAjB,CAP8B,CAA/B;AAUA,QAAMoB,0BAA0B,GAAG,CAAC,CAAEJ,uBAAH,GAChClD,OAAO,EACP;AACAD,EAAAA,EAAE,CACD,+FADC,CAFK,EAKPsD,eALO,EAMPH,uBANO,CADyB,GAShCnD,EAAE,CAAE,sBAAF,CATL;AAWA,SACC,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAG,CAAlB;AAAsB,IAAA,SAAS,EAAGa;AAAlC,KACG,CAAE8B,mBAAF,IACD,cAAC,yBAAD;AACC,IAAA,QAAQ,EAAGO,gBADZ;AAEC,IAAA,mBAAmB,EAAGJ,iCAFvB;AAGC,IAAA,aAAa,EAAGG,uBAHjB;AAIC,IAAA,YAAY,EAAG;AAAA,UAAE;AAAEO,QAAAA,MAAF;AAAUC,QAAAA;AAAV,OAAF;AAAA,aACd,cAAC,IAAD;AACC,QAAA,EAAE,EAAG,QADN;AAEC,QAAA,OAAO,EAAC,eAFT;AAGC,QAAA,KAAK,EAAC,YAHP;AAIC,QAAA,SAAS,EAAC,wCAJX;AAKC,yBAAgBD,MALjB;AAMC,yBAAc,MANf;AAOC,QAAA,OAAO,EAAGC,QAPX;AAQC,sBAAaF,0BARd;AASC,QAAA,KAAK,EAAG;AACPG,UAAAA,UAAU,EAAEzC,KADL;AAEPG,UAAAA,KAAK,EACJE,WAAW,CAACE,QAAZ,KACAF,WAAW,CAACE,QAAZ,CAAsB,MAAtB,CADA,GAEG,MAFH,GAGG;AANG;AATT,SAkBC,cAAC,QAAD;AACC,QAAA,OAAO,MADR;AAEC,QAAA,EAAE,EAAGd,QAFN;AAGC,QAAA,SAAS,EAAC;AAHX,SAKG4C,eALH,CAlBD,EAyBC,cAAC,QAAD;AACC,QAAA,EAAE,EAAC,MADJ;AAEC,QAAA,SAAS,EAAC;AAFX,SAIGH,uBAJH,CAzBD,CADc;AAAA;AAJhB,IAFF,EA0CC,cAAC,SAAD;AACC,IAAA,SAAS,EAAGT,SADb;AAEC,IAAA,UAAU,EAAG5B,UAFd;AAGC,IAAA,MAAM,EAAGC,MAHV;AAIC,IAAA,QAAQ,EAAGC,QAJZ;AAKC,IAAA,KAAK,EAAGC,KALT;AAMC,IAAA,OAAO,EACN,CAAC,CAAEyB,SAAH,IACC,cAAC,oBAAD,CAAsB,YAAtB;AACC,MAAA,OAAO,EAAG5B;AADX,OAGGd,EAAE,CAAE,OAAF,CAHL;AARH,IA1CD,CADD;AA6DA","sourcesContent":["// @ts-nocheck\n/**\n * External dependencies\n */\nimport { map } from 'lodash';\nimport { colord, extend } from 'colord';\nimport namesPlugin from 'colord/plugins/names';\nimport a11yPlugin from 'colord/plugins/a11y';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Dropdown from '../dropdown';\nimport { ColorPicker } from '../color-picker';\nimport CircularOptionPicker from '../circular-option-picker';\nimport { VStack } from '../v-stack';\nimport { Flex, FlexItem } from '../flex';\nimport { Truncate } from '../truncate';\nimport { ColorHeading } from './styles';\n\nextend( [ namesPlugin, a11yPlugin ] );\n\nfunction SinglePalette( {\n\tclassName,\n\tclearColor,\n\tcolors,\n\tonChange,\n\tvalue,\n\tactions,\n} ) {\n\tconst colorOptions = useMemo( () => {\n\t\treturn map( colors, ( { color, name } ) => {\n\t\t\tconst colordColor = colord( color );\n\n\t\t\treturn (\n\t\t\t\t<CircularOptionPicker.Option\n\t\t\t\t\tkey={ color }\n\t\t\t\t\tisSelected={ value === color }\n\t\t\t\t\tselectedIconProps={\n\t\t\t\t\t\tvalue === color\n\t\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t\tfill:\n\t\t\t\t\t\t\t\t\t\tcolordColor.contrast() >\n\t\t\t\t\t\t\t\t\t\tcolordColor.contrast( '#000' )\n\t\t\t\t\t\t\t\t\t\t\t? '#fff'\n\t\t\t\t\t\t\t\t\t\t\t: '#000',\n\t\t\t\t\t\t\t }\n\t\t\t\t\t\t\t: {}\n\t\t\t\t\t}\n\t\t\t\t\ttooltipText={\n\t\t\t\t\t\tname ||\n\t\t\t\t\t\t// translators: %s: color hex code e.g: \"#f00\".\n\t\t\t\t\t\tsprintf( __( 'Color code: %s' ), color )\n\t\t\t\t\t}\n\t\t\t\t\tstyle={ { backgroundColor: color, color } }\n\t\t\t\t\tonClick={\n\t\t\t\t\t\tvalue === color ? clearColor : () => onChange( color )\n\t\t\t\t\t}\n\t\t\t\t\taria-label={\n\t\t\t\t\t\tname\n\t\t\t\t\t\t\t? // translators: %s: The name of the color e.g: \"vivid red\".\n\t\t\t\t\t\t\t sprintf( __( 'Color: %s' ), name )\n\t\t\t\t\t\t\t: // translators: %s: color hex code e.g: \"#f00\".\n\t\t\t\t\t\t\t sprintf( __( 'Color code: %s' ), color )\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t);\n\t\t} );\n\t}, [ colors, value, onChange, clearColor ] );\n\treturn (\n\t\t<CircularOptionPicker\n\t\t\tclassName={ className }\n\t\t\toptions={ colorOptions }\n\t\t\tactions={ actions }\n\t\t/>\n\t);\n}\n\nfunction MultiplePalettes( {\n\tclassName,\n\tclearColor,\n\tcolors,\n\tonChange,\n\tvalue,\n\tactions,\n} ) {\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ colors.map( ( { name, colors: colorPalette }, index ) => {\n\t\t\t\treturn (\n\t\t\t\t\t<VStack spacing={ 2 } key={ index }>\n\t\t\t\t\t\t<ColorHeading>{ name }</ColorHeading>\n\t\t\t\t\t\t<SinglePalette\n\t\t\t\t\t\t\tclearColor={ clearColor }\n\t\t\t\t\t\t\tcolors={ colorPalette }\n\t\t\t\t\t\t\tonChange={ onChange }\n\t\t\t\t\t\t\tvalue={ value }\n\t\t\t\t\t\t\tactions={\n\t\t\t\t\t\t\t\tcolors.length === index + 1 ? actions : null\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</VStack>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</VStack>\n\t);\n}\n\nexport function CustomColorPickerDropdown( { isRenderedInSidebar, ...props } ) {\n\treturn (\n\t\t<Dropdown\n\t\t\tcontentClassName={ classnames(\n\t\t\t\t'components-color-palette__custom-color-dropdown-content',\n\t\t\t\t{\n\t\t\t\t\t'is-rendered-in-sidebar': isRenderedInSidebar,\n\t\t\t\t}\n\t\t\t) }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n\nconst extractColorNameFromCurrentValue = (\n\tcurrentValue,\n\tcolors = [],\n\tshowMultiplePalettes = false\n) => {\n\tif ( ! currentValue ) {\n\t\treturn '';\n\t}\n\n\t// Normalize format of `colors` to simplify the following loop\n\tconst colorPalettes = showMultiplePalettes ? colors : [ { colors } ];\n\tfor ( const { colors: paletteColors } of colorPalettes ) {\n\t\tfor ( const { name: colorName, color: colorValue } of paletteColors ) {\n\t\t\tif (\n\t\t\t\tcolord( currentValue ).toHex() === colord( colorValue ).toHex()\n\t\t\t) {\n\t\t\t\treturn colorName;\n\t\t\t}\n\t\t}\n\t}\n\n\t// translators: shown when the user has picked a custom color (i.e not in the palette of colors).\n\treturn __( 'Custom' );\n};\n\nexport default function ColorPalette( {\n\tclearable = true,\n\tclassName,\n\tcolors,\n\tdisableCustomColors = false,\n\tenableAlpha,\n\tonChange,\n\tvalue,\n\t__experimentalHasMultipleOrigins = false,\n\t__experimentalIsRenderedInSidebar = false,\n} ) {\n\tconst clearColor = useCallback( () => onChange( undefined ), [ onChange ] );\n\tconst showMultiplePalettes =\n\t\t__experimentalHasMultipleOrigins && colors?.length;\n\tconst Component = showMultiplePalettes ? MultiplePalettes : SinglePalette;\n\n\tconst renderCustomColorPicker = () => (\n\t\t<ColorPicker\n\t\t\tcolor={ value }\n\t\t\tonChange={ ( color ) => onChange( color ) }\n\t\t\tenableAlpha={ enableAlpha }\n\t\t/>\n\t);\n\n\tlet dropdownPosition;\n\tif ( __experimentalIsRenderedInSidebar ) {\n\t\tdropdownPosition = 'bottom left';\n\t}\n\n\tconst colordColor = colord( value );\n\n\tconst valueWithoutLeadingHash = value?.startsWith( '#' )\n\t\t? value.substring( 1 )\n\t\t: value ?? '';\n\tconst buttonLabelName = useMemo(\n\t\t() =>\n\t\t\textractColorNameFromCurrentValue(\n\t\t\t\tvalue,\n\t\t\t\tcolors,\n\t\t\t\tshowMultiplePalettes\n\t\t\t),\n\t\t[ value, colors, showMultiplePalettes ]\n\t);\n\n\tconst customColorAccessibleLabel = !! valueWithoutLeadingHash\n\t\t? sprintf(\n\t\t\t\t// translators: %1$s: The name of the color e.g: \"vivid red\". %2$s: The color's hex code e.g: \"#f00\".\n\t\t\t\t__(\n\t\t\t\t\t'Custom color picker. The currently selected color is called \"%1$s\" and has a value of \"%2$s\".'\n\t\t\t\t),\n\t\t\t\tbuttonLabelName,\n\t\t\t\tvalueWithoutLeadingHash\n\t\t )\n\t\t: __( 'Custom color picker.' );\n\n\treturn (\n\t\t<VStack spacing={ 3 } className={ className }>\n\t\t\t{ ! disableCustomColors && (\n\t\t\t\t<CustomColorPickerDropdown\n\t\t\t\t\tposition={ dropdownPosition }\n\t\t\t\t\tisRenderedInSidebar={ __experimentalIsRenderedInSidebar }\n\t\t\t\t\trenderContent={ renderCustomColorPicker }\n\t\t\t\t\trenderToggle={ ( { isOpen, onToggle } ) => (\n\t\t\t\t\t\t<Flex\n\t\t\t\t\t\t\tas={ 'button' }\n\t\t\t\t\t\t\tjustify=\"space-between\"\n\t\t\t\t\t\t\talign=\"flex-start\"\n\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color\"\n\t\t\t\t\t\t\taria-expanded={ isOpen }\n\t\t\t\t\t\t\taria-haspopup=\"true\"\n\t\t\t\t\t\t\tonClick={ onToggle }\n\t\t\t\t\t\t\taria-label={ customColorAccessibleLabel }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tbackground: value,\n\t\t\t\t\t\t\t\tcolor:\n\t\t\t\t\t\t\t\t\tcolordColor.contrast() >\n\t\t\t\t\t\t\t\t\tcolordColor.contrast( '#000' )\n\t\t\t\t\t\t\t\t\t\t? '#fff'\n\t\t\t\t\t\t\t\t\t\t: '#000',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\t\tisBlock\n\t\t\t\t\t\t\t\tas={ Truncate }\n\t\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-name\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ buttonLabelName }\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t<FlexItem\n\t\t\t\t\t\t\t\tas=\"span\"\n\t\t\t\t\t\t\t\tclassName=\"components-color-palette__custom-color-value\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ valueWithoutLeadingHash }\n\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t</Flex>\n\t\t\t\t\t) }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t<Component\n\t\t\t\tclearable={ clearable }\n\t\t\t\tclearColor={ clearColor }\n\t\t\t\tcolors={ colors }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tvalue={ value }\n\t\t\t\tactions={\n\t\t\t\t\t!! clearable && (\n\t\t\t\t\t\t<CircularOptionPicker.ButtonAction\n\t\t\t\t\t\t\tonClick={ clearColor }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Clear' ) }\n\t\t\t\t\t\t</CircularOptionPicker.ButtonAction>\n\t\t\t\t\t)\n\t\t\t\t}\n\t\t\t/>\n\t\t</VStack>\n\t);\n}\n"]}
@@ -61,6 +61,8 @@ export default function CustomSelectControl(_ref3) {
61
61
  var _menuProps$ariaActiv;
62
62
 
63
63
  let {
64
+ /** Start opting into the larger default height that will become the default size in a future version. */
65
+ __next36pxDefaultSize = false,
64
66
  className,
65
67
  hideLabelFromVision,
66
68
  label,
@@ -128,12 +130,17 @@ export default function CustomSelectControl(_ref3) {
128
130
  // This is needed because some speech recognition software don't support `aria-labelledby`.
129
131
  'aria-label': label,
130
132
  'aria-labelledby': undefined,
131
- className: 'components-custom-select-control__button',
132
- isSmall: true,
133
+ className: classnames('components-custom-select-control__button', {
134
+ 'is-next-36px-default-size': __next36pxDefaultSize
135
+ }),
136
+ isSmall: !__next36pxDefaultSize,
133
137
  describedBy: getDescribedBy()
134
138
  }), itemToString(selectedItem), createElement(Icon, {
135
139
  icon: chevronDown,
136
- className: "components-custom-select-control__button-icon"
140
+ className: classnames('components-custom-select-control__button-icon', {
141
+ 'is-next-36px-default-size': __next36pxDefaultSize
142
+ }),
143
+ size: 18
137
144
  })), createElement("ul", _extends({}, menuProps, {
138
145
  onKeyDown: onKeyDownHandler
139
146
  }), isOpen && items.map((item, index) => // eslint-disable-next-line react/jsx-key
@@ -143,7 +150,8 @@ export default function CustomSelectControl(_ref3) {
143
150
  key: item.key,
144
151
  className: classnames(item.className, 'components-custom-select-control__item', {
145
152
  'is-highlighted': index === highlightedIndex,
146
- 'has-hint': !!item.__experimentalHint
153
+ 'has-hint': !!item.__experimentalHint,
154
+ 'is-next-36px-default-size': __next36pxDefaultSize
147
155
  }),
148
156
  style: item.style
149
157
  }), item.name, item.__experimentalHint && createElement("span", {
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/custom-select-control/index.js"],"names":["useSelect","classnames","Icon","check","chevronDown","__","sprintf","useCallback","Button","VisuallyHidden","itemToString","item","name","stateReducer","selectedItem","type","changes","props","items","stateChangeTypes","ToggleButtonKeyDownArrowDown","Math","min","indexOf","length","ToggleButtonKeyDownArrowUp","max","CustomSelectControl","className","hideLabelFromVision","label","describedBy","options","onChange","onSelectedItemChange","value","_selectedItem","getLabelProps","getToggleButtonProps","getMenuProps","getItemProps","isOpen","highlightedIndex","initialSelectedItem","undefined","getDescribedBy","menuProps","onKeyDownHandler","e","stopPropagation","onKeyDown","startsWith","isSmall","map","index","key","__experimentalHint","style"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,SAAT,QAA0B,WAA1B;AACA,OAAOC,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,IAAT,EAAeC,KAAf,EAAsBC,WAAtB,QAAyC,kBAAzC;AACA,SAASC,EAAT,EAAaC,OAAb,QAA4B,iBAA5B;AACA,SAASC,WAAT,QAA4B,oBAA5B;AAEA;AACA;AACA;;AACA,SAASC,MAAT,EAAiBC,cAAjB,QAAuC,KAAvC;;AAEA,MAAMC,YAAY,GAAKC,IAAF,IAAYA,IAAZ,aAAYA,IAAZ,uBAAYA,IAAI,CAAEC,IAAvC,C,CACA;AACA;AACA;AACA;;;AACA,MAAMC,YAAY,GAAG,iBAGhB;AAAA,MAFJ;AAAEC,IAAAA;AAAF,GAEI;AAAA,MADJ;AAAEC,IAAAA,IAAF;AAAQC,IAAAA,OAAR;AAAiBC,IAAAA,KAAK,EAAE;AAAEC,MAAAA;AAAF;AAAxB,GACI;;AACJ,UAASH,IAAT;AACC,SAAKf,SAAS,CAACmB,gBAAV,CAA2BC,4BAAhC;AACC;AACA;AACA,aAAO;AACNN,QAAAA,YAAY,EACXI,KAAK,CACJJ,YAAY,GACTO,IAAI,CAACC,GAAL,CACAJ,KAAK,CAACK,OAAN,CAAeT,YAAf,IAAgC,CADhC,EAEAI,KAAK,CAACM,MAAN,GAAe,CAFf,CADS,GAKT,CANC;AAFA,OAAP;;AAWD,SAAKxB,SAAS,CAACmB,gBAAV,CAA2BM,0BAAhC;AACC;AACA;AACA,aAAO;AACNX,QAAAA,YAAY,EACXI,KAAK,CACJJ,YAAY,GACTO,IAAI,CAACK,GAAL,CAAUR,KAAK,CAACK,OAAN,CAAeT,YAAf,IAAgC,CAA1C,EAA6C,CAA7C,CADS,GAETI,KAAK,CAACM,MAAN,GAAe,CAHd;AAFA,OAAP;;AAQD;AACC,aAAOR,OAAP;AA3BF;AA6BA,CAjCD;;AAkCA,eAAe,SAASW,mBAAT,QAQX;AAAA;;AAAA,MARyC;AAC5CC,IAAAA,SAD4C;AAE5CC,IAAAA,mBAF4C;AAG5CC,IAAAA,KAH4C;AAI5CC,IAAAA,WAJ4C;AAK5CC,IAAAA,OAAO,EAAEd,KALmC;AAM5Ce,IAAAA,QAAQ,EAAEC,oBANkC;AAO5CC,IAAAA,KAAK,EAAEC;AAPqC,GAQzC;AACH,QAAM;AACLC,IAAAA,aADK;AAELC,IAAAA,oBAFK;AAGLC,IAAAA,YAHK;AAILC,IAAAA,YAJK;AAKLC,IAAAA,MALK;AAMLC,IAAAA,gBANK;AAOL5B,IAAAA;AAPK,MAQFd,SAAS,CAAE;AACd2C,IAAAA,mBAAmB,EAAEzB,KAAK,CAAE,CAAF,CADZ;AAEdA,IAAAA,KAFc;AAGdR,IAAAA,YAHc;AAIdwB,IAAAA,oBAJc;AAKd,QAAK,OAAOE,aAAP,KAAyB,WAAzB,IAAwCA,aAAa,KAAK,IAA1D,GACF;AAAEtB,MAAAA,YAAY,EAAEsB;AAAhB,KADE,GAEFQ,SAFH,CALc;AAQd/B,IAAAA;AARc,GAAF,CARb;;AAmBA,WAASgC,cAAT,GAA0B;AACzB,QAAKd,WAAL,EAAmB;AAClB,aAAOA,WAAP;AACA;;AAED,QAAK,CAAEjB,YAAP,EAAsB;AACrB,aAAOT,EAAE,CAAE,cAAF,CAAT;AACA,KAPwB,CASzB;;;AACA,WAAOC,OAAO,CAAED,EAAE,CAAE,wBAAF,CAAJ,EAAkCS,YAAY,CAACF,IAA/C,CAAd;AACA;;AAED,QAAMkC,SAAS,GAAGP,YAAY,CAAE;AAC/BX,IAAAA,SAAS,EAAE,wCADoB;AAE/B,mBAAe,CAAEa;AAFc,GAAF,CAA9B;AAKA,QAAMM,gBAAgB,GAAGxC,WAAW,CACjCyC,CAAF,IAAS;AAAA;;AACRA,IAAAA,CAAC,CAACC,eAAF;AACAH,IAAAA,SAAS,SAAT,IAAAA,SAAS,WAAT,oCAAAA,SAAS,CAAEI,SAAX,mFAAAJ,SAAS,EAAeE,CAAf,CAAT;AACA,GAJkC,EAKnC,CAAEF,SAAF,CALmC,CAApC,CAtCG,CA8CH;;AACA,8BACCA,SAAS,CAAE,uBAAF,CADV,iDACC,qBAAsCK,UAAtC,CAAkD,gBAAlD,CADD,EAEE;AACD,WAAOL,SAAS,CAAE,uBAAF,CAAhB;AACA;;AACD,SACC;AACC,IAAA,SAAS,EAAG7C,UAAU,CACrB,kCADqB,EAErB2B,SAFqB;AADvB,KAMGC,mBAAmB,GACpB,cAAC,cAAD;AAAgB,IAAA,EAAE,EAAC;AAAnB,KAAgCQ,aAAa,EAA7C,GACGP,KADH,CADoB;AAKpB;AACA,yBACMO,aAAa,CAAE;AACnBT,IAAAA,SAAS,EAAE;AADQ,GAAF,CADnB,EAKGE,KALH,CAZF,EAoBC,cAAC,MAAD,EACMQ,oBAAoB,CAAE;AAC1B;AACA,kBAAcR,KAFY;AAG1B,uBAAmBc,SAHO;AAI1BhB,IAAAA,SAAS,EAAE,0CAJe;AAK1BwB,IAAAA,OAAO,EAAE,IALiB;AAM1BrB,IAAAA,WAAW,EAAEc,cAAc;AAND,GAAF,CAD1B,EAUGnC,YAAY,CAAEI,YAAF,CAVf,EAWC,cAAC,IAAD;AACC,IAAA,IAAI,EAAGV,WADR;AAEC,IAAA,SAAS,EAAC;AAFX,IAXD,CApBD,EAqCC,iCAAS0C,SAAT;AAAqB,IAAA,SAAS,EAAGC;AAAjC,MACGN,MAAM,IACPvB,KAAK,CAACmC,GAAN,CAAW,CAAE1C,IAAF,EAAQ2C,KAAR,KACV;AACA,sBACMd,YAAY,CAAE;AAClB7B,IAAAA,IADkB;AAElB2C,IAAAA,KAFkB;AAGlBC,IAAAA,GAAG,EAAE5C,IAAI,CAAC4C,GAHQ;AAIlB3B,IAAAA,SAAS,EAAE3B,UAAU,CACpBU,IAAI,CAACiB,SADe,EAEpB,wCAFoB,EAGpB;AACC,wBACC0B,KAAK,KAAKZ,gBAFZ;AAGC,kBAAY,CAAC,CAAE/B,IAAI,CAAC6C;AAHrB,KAHoB,CAJH;AAalBC,IAAAA,KAAK,EAAE9C,IAAI,CAAC8C;AAbM,GAAF,CADlB,EAiBG9C,IAAI,CAACC,IAjBR,EAkBGD,IAAI,CAAC6C,kBAAL,IACD;AAAM,IAAA,SAAS,EAAC;AAAhB,KACG7C,IAAI,CAAC6C,kBADR,CAnBF,EAuBG7C,IAAI,KAAKG,YAAT,IACD,cAAC,IAAD;AACC,IAAA,IAAI,EAAGX,KADR;AAEC,IAAA,SAAS,EAAC;AAFX,IAxBF,CAFD,CAFF,CArCD,CADD;AA4EA","sourcesContent":["/**\n * External dependencies\n */\nimport { useSelect } from 'downshift';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { Icon, check, chevronDown } from '@wordpress/icons';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { Button, VisuallyHidden } from '../';\n\nconst itemToString = ( item ) => item?.name;\n// This is needed so that in Windows, where\n// the menu does not necessarily open on\n// key up/down, you can still switch between\n// options with the menu closed.\nconst stateReducer = (\n\t{ selectedItem },\n\t{ type, changes, props: { items } }\n) => {\n\tswitch ( type ) {\n\t\tcase useSelect.stateChangeTypes.ToggleButtonKeyDownArrowDown:\n\t\t\t// If we already have a selected item, try to select the next one,\n\t\t\t// without circular navigation. Otherwise, select the first item.\n\t\t\treturn {\n\t\t\t\tselectedItem:\n\t\t\t\t\titems[\n\t\t\t\t\t\tselectedItem\n\t\t\t\t\t\t\t? Math.min(\n\t\t\t\t\t\t\t\t\titems.indexOf( selectedItem ) + 1,\n\t\t\t\t\t\t\t\t\titems.length - 1\n\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t: 0\n\t\t\t\t\t],\n\t\t\t};\n\t\tcase useSelect.stateChangeTypes.ToggleButtonKeyDownArrowUp:\n\t\t\t// If we already have a selected item, try to select the previous one,\n\t\t\t// without circular navigation. Otherwise, select the last item.\n\t\t\treturn {\n\t\t\t\tselectedItem:\n\t\t\t\t\titems[\n\t\t\t\t\t\tselectedItem\n\t\t\t\t\t\t\t? Math.max( items.indexOf( selectedItem ) - 1, 0 )\n\t\t\t\t\t\t\t: items.length - 1\n\t\t\t\t\t],\n\t\t\t};\n\t\tdefault:\n\t\t\treturn changes;\n\t}\n};\nexport default function CustomSelectControl( {\n\tclassName,\n\thideLabelFromVision,\n\tlabel,\n\tdescribedBy,\n\toptions: items,\n\tonChange: onSelectedItemChange,\n\tvalue: _selectedItem,\n} ) {\n\tconst {\n\t\tgetLabelProps,\n\t\tgetToggleButtonProps,\n\t\tgetMenuProps,\n\t\tgetItemProps,\n\t\tisOpen,\n\t\thighlightedIndex,\n\t\tselectedItem,\n\t} = useSelect( {\n\t\tinitialSelectedItem: items[ 0 ],\n\t\titems,\n\t\titemToString,\n\t\tonSelectedItemChange,\n\t\t...( typeof _selectedItem !== 'undefined' && _selectedItem !== null\n\t\t\t? { selectedItem: _selectedItem }\n\t\t\t: undefined ),\n\t\tstateReducer,\n\t} );\n\n\tfunction getDescribedBy() {\n\t\tif ( describedBy ) {\n\t\t\treturn describedBy;\n\t\t}\n\n\t\tif ( ! selectedItem ) {\n\t\t\treturn __( 'No selection' );\n\t\t}\n\n\t\t// translators: %s: The selected option.\n\t\treturn sprintf( __( 'Currently selected: %s' ), selectedItem.name );\n\t}\n\n\tconst menuProps = getMenuProps( {\n\t\tclassName: 'components-custom-select-control__menu',\n\t\t'aria-hidden': ! isOpen,\n\t} );\n\n\tconst onKeyDownHandler = useCallback(\n\t\t( e ) => {\n\t\t\te.stopPropagation();\n\t\t\tmenuProps?.onKeyDown?.( e );\n\t\t},\n\t\t[ menuProps ]\n\t);\n\n\t// We need this here, because the null active descendant is not fully ARIA compliant.\n\tif (\n\t\tmenuProps[ 'aria-activedescendant' ]?.startsWith( 'downshift-null' )\n\t) {\n\t\tdelete menuProps[ 'aria-activedescendant' ];\n\t}\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-custom-select-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t{ hideLabelFromVision ? (\n\t\t\t\t<VisuallyHidden as=\"label\" { ...getLabelProps() }>\n\t\t\t\t\t{ label }\n\t\t\t\t</VisuallyHidden>\n\t\t\t) : (\n\t\t\t\t/* eslint-disable-next-line jsx-a11y/label-has-associated-control, jsx-a11y/label-has-for */\n\t\t\t\t<label\n\t\t\t\t\t{ ...getLabelProps( {\n\t\t\t\t\t\tclassName: 'components-custom-select-control__label',\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ label }\n\t\t\t\t</label>\n\t\t\t) }\n\t\t\t<Button\n\t\t\t\t{ ...getToggleButtonProps( {\n\t\t\t\t\t// This is needed because some speech recognition software don't support `aria-labelledby`.\n\t\t\t\t\t'aria-label': label,\n\t\t\t\t\t'aria-labelledby': undefined,\n\t\t\t\t\tclassName: 'components-custom-select-control__button',\n\t\t\t\t\tisSmall: true,\n\t\t\t\t\tdescribedBy: getDescribedBy(),\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t{ itemToString( selectedItem ) }\n\t\t\t\t<Icon\n\t\t\t\t\ticon={ chevronDown }\n\t\t\t\t\tclassName=\"components-custom-select-control__button-icon\"\n\t\t\t\t/>\n\t\t\t</Button>\n\t\t\t{ /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */ }\n\t\t\t<ul { ...menuProps } onKeyDown={ onKeyDownHandler }>\n\t\t\t\t{ isOpen &&\n\t\t\t\t\titems.map( ( item, index ) => (\n\t\t\t\t\t\t// eslint-disable-next-line react/jsx-key\n\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t{ ...getItemProps( {\n\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\tkey: item.key,\n\t\t\t\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t\t\t\titem.className,\n\t\t\t\t\t\t\t\t\t'components-custom-select-control__item',\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t'is-highlighted':\n\t\t\t\t\t\t\t\t\t\t\tindex === highlightedIndex,\n\t\t\t\t\t\t\t\t\t\t'has-hint': !! item.__experimentalHint,\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\tstyle: item.style,\n\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ item.name }\n\t\t\t\t\t\t\t{ item.__experimentalHint && (\n\t\t\t\t\t\t\t\t<span className=\"components-custom-select-control__item-hint\">\n\t\t\t\t\t\t\t\t\t{ item.__experimentalHint }\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t{ item === selectedItem && (\n\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\ticon={ check }\n\t\t\t\t\t\t\t\t\tclassName=\"components-custom-select-control__item-icon\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</li>\n\t\t\t\t\t) ) }\n\t\t\t</ul>\n\t\t</div>\n\t);\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/custom-select-control/index.js"],"names":["useSelect","classnames","Icon","check","chevronDown","__","sprintf","useCallback","Button","VisuallyHidden","itemToString","item","name","stateReducer","selectedItem","type","changes","props","items","stateChangeTypes","ToggleButtonKeyDownArrowDown","Math","min","indexOf","length","ToggleButtonKeyDownArrowUp","max","CustomSelectControl","__next36pxDefaultSize","className","hideLabelFromVision","label","describedBy","options","onChange","onSelectedItemChange","value","_selectedItem","getLabelProps","getToggleButtonProps","getMenuProps","getItemProps","isOpen","highlightedIndex","initialSelectedItem","undefined","getDescribedBy","menuProps","onKeyDownHandler","e","stopPropagation","onKeyDown","startsWith","isSmall","map","index","key","__experimentalHint","style"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { useSelect } from 'downshift';\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { Icon, check, chevronDown } from '@wordpress/icons';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { Button, VisuallyHidden } from '../';\n\nconst itemToString = ( item ) => item?.name;\n// This is needed so that in Windows, where\n// the menu does not necessarily open on\n// key up/down, you can still switch between\n// options with the menu closed.\nconst stateReducer = (\n\t{ selectedItem },\n\t{ type, changes, props: { items } }\n) => {\n\tswitch ( type ) {\n\t\tcase useSelect.stateChangeTypes.ToggleButtonKeyDownArrowDown:\n\t\t\t// If we already have a selected item, try to select the next one,\n\t\t\t// without circular navigation. Otherwise, select the first item.\n\t\t\treturn {\n\t\t\t\tselectedItem:\n\t\t\t\t\titems[\n\t\t\t\t\t\tselectedItem\n\t\t\t\t\t\t\t? Math.min(\n\t\t\t\t\t\t\t\t\titems.indexOf( selectedItem ) + 1,\n\t\t\t\t\t\t\t\t\titems.length - 1\n\t\t\t\t\t\t\t )\n\t\t\t\t\t\t\t: 0\n\t\t\t\t\t],\n\t\t\t};\n\t\tcase useSelect.stateChangeTypes.ToggleButtonKeyDownArrowUp:\n\t\t\t// If we already have a selected item, try to select the previous one,\n\t\t\t// without circular navigation. Otherwise, select the last item.\n\t\t\treturn {\n\t\t\t\tselectedItem:\n\t\t\t\t\titems[\n\t\t\t\t\t\tselectedItem\n\t\t\t\t\t\t\t? Math.max( items.indexOf( selectedItem ) - 1, 0 )\n\t\t\t\t\t\t\t: items.length - 1\n\t\t\t\t\t],\n\t\t\t};\n\t\tdefault:\n\t\t\treturn changes;\n\t}\n};\nexport default function CustomSelectControl( {\n\t/** Start opting into the larger default height that will become the default size in a future version. */\n\t__next36pxDefaultSize = false,\n\tclassName,\n\thideLabelFromVision,\n\tlabel,\n\tdescribedBy,\n\toptions: items,\n\tonChange: onSelectedItemChange,\n\tvalue: _selectedItem,\n} ) {\n\tconst {\n\t\tgetLabelProps,\n\t\tgetToggleButtonProps,\n\t\tgetMenuProps,\n\t\tgetItemProps,\n\t\tisOpen,\n\t\thighlightedIndex,\n\t\tselectedItem,\n\t} = useSelect( {\n\t\tinitialSelectedItem: items[ 0 ],\n\t\titems,\n\t\titemToString,\n\t\tonSelectedItemChange,\n\t\t...( typeof _selectedItem !== 'undefined' && _selectedItem !== null\n\t\t\t? { selectedItem: _selectedItem }\n\t\t\t: undefined ),\n\t\tstateReducer,\n\t} );\n\n\tfunction getDescribedBy() {\n\t\tif ( describedBy ) {\n\t\t\treturn describedBy;\n\t\t}\n\n\t\tif ( ! selectedItem ) {\n\t\t\treturn __( 'No selection' );\n\t\t}\n\n\t\t// translators: %s: The selected option.\n\t\treturn sprintf( __( 'Currently selected: %s' ), selectedItem.name );\n\t}\n\n\tconst menuProps = getMenuProps( {\n\t\tclassName: 'components-custom-select-control__menu',\n\t\t'aria-hidden': ! isOpen,\n\t} );\n\n\tconst onKeyDownHandler = useCallback(\n\t\t( e ) => {\n\t\t\te.stopPropagation();\n\t\t\tmenuProps?.onKeyDown?.( e );\n\t\t},\n\t\t[ menuProps ]\n\t);\n\n\t// We need this here, because the null active descendant is not fully ARIA compliant.\n\tif (\n\t\tmenuProps[ 'aria-activedescendant' ]?.startsWith( 'downshift-null' )\n\t) {\n\t\tdelete menuProps[ 'aria-activedescendant' ];\n\t}\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-custom-select-control',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t{ hideLabelFromVision ? (\n\t\t\t\t<VisuallyHidden as=\"label\" { ...getLabelProps() }>\n\t\t\t\t\t{ label }\n\t\t\t\t</VisuallyHidden>\n\t\t\t) : (\n\t\t\t\t/* eslint-disable-next-line jsx-a11y/label-has-associated-control, jsx-a11y/label-has-for */\n\t\t\t\t<label\n\t\t\t\t\t{ ...getLabelProps( {\n\t\t\t\t\t\tclassName: 'components-custom-select-control__label',\n\t\t\t\t\t} ) }\n\t\t\t\t>\n\t\t\t\t\t{ label }\n\t\t\t\t</label>\n\t\t\t) }\n\t\t\t<Button\n\t\t\t\t{ ...getToggleButtonProps( {\n\t\t\t\t\t// This is needed because some speech recognition software don't support `aria-labelledby`.\n\t\t\t\t\t'aria-label': label,\n\t\t\t\t\t'aria-labelledby': undefined,\n\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t'components-custom-select-control__button',\n\t\t\t\t\t\t{ 'is-next-36px-default-size': __next36pxDefaultSize }\n\t\t\t\t\t),\n\t\t\t\t\tisSmall: ! __next36pxDefaultSize,\n\t\t\t\t\tdescribedBy: getDescribedBy(),\n\t\t\t\t} ) }\n\t\t\t>\n\t\t\t\t{ itemToString( selectedItem ) }\n\t\t\t\t<Icon\n\t\t\t\t\ticon={ chevronDown }\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'components-custom-select-control__button-icon',\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'is-next-36px-default-size': __next36pxDefaultSize,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t\tsize={ 18 }\n\t\t\t\t/>\n\t\t\t</Button>\n\t\t\t{ /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */ }\n\t\t\t<ul { ...menuProps } onKeyDown={ onKeyDownHandler }>\n\t\t\t\t{ isOpen &&\n\t\t\t\t\titems.map( ( item, index ) => (\n\t\t\t\t\t\t// eslint-disable-next-line react/jsx-key\n\t\t\t\t\t\t<li\n\t\t\t\t\t\t\t{ ...getItemProps( {\n\t\t\t\t\t\t\t\titem,\n\t\t\t\t\t\t\t\tindex,\n\t\t\t\t\t\t\t\tkey: item.key,\n\t\t\t\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t\t\t\titem.className,\n\t\t\t\t\t\t\t\t\t'components-custom-select-control__item',\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t'is-highlighted':\n\t\t\t\t\t\t\t\t\t\t\tindex === highlightedIndex,\n\t\t\t\t\t\t\t\t\t\t'has-hint': !! item.__experimentalHint,\n\t\t\t\t\t\t\t\t\t\t'is-next-36px-default-size': __next36pxDefaultSize,\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\tstyle: item.style,\n\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ item.name }\n\t\t\t\t\t\t\t{ item.__experimentalHint && (\n\t\t\t\t\t\t\t\t<span className=\"components-custom-select-control__item-hint\">\n\t\t\t\t\t\t\t\t\t{ item.__experimentalHint }\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t{ item === selectedItem && (\n\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\ticon={ check }\n\t\t\t\t\t\t\t\t\tclassName=\"components-custom-select-control__item-icon\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</li>\n\t\t\t\t\t) ) }\n\t\t\t</ul>\n\t\t</div>\n\t);\n}\n"]}
@@ -1,5 +1,7 @@
1
1
  import _styled from "@emotion/styled/base";
2
2
 
3
+ function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
4
+
3
5
  /**
4
6
  * External dependencies
5
7
  */
@@ -23,36 +25,53 @@ const MARGIN_DIRECTIONS = {
23
25
  // When both the generic `margin` and the specific `marginStart|marginEnd` props are defined,
24
26
  // the latter will take priority.
25
27
 
26
- const renderMargin = _ref => {
28
+ const renderMargin = _ref2 => {
27
29
  let {
28
30
  'aria-orientation': orientation = 'horizontal',
29
31
  margin,
30
32
  marginStart,
31
33
  marginEnd
32
- } = _ref;
34
+ } = _ref2;
33
35
  return /*#__PURE__*/css(rtl({
34
36
  [MARGIN_DIRECTIONS[orientation].start]: space(marginStart !== null && marginStart !== void 0 ? marginStart : margin),
35
37
  [MARGIN_DIRECTIONS[orientation].end]: space(marginEnd !== null && marginEnd !== void 0 ? marginEnd : margin)
36
- })(), process.env.NODE_ENV === "production" ? "" : ";label:renderMargin;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBb0NDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vdWkvdXRpbHMvc3BhY2UnO1xuaW1wb3J0IHsgcnRsIH0gZnJvbSAnLi4vdXRpbHMnO1xuaW1wb3J0IHR5cGUgeyBQcm9wcyB9IGZyb20gJy4vdHlwZXMnO1xuXG5jb25zdCBNQVJHSU5fRElSRUNUSU9OUzogUmVjb3JkPFxuXHROb25OdWxsYWJsZTwgUHJvcHNbICdvcmllbnRhdGlvbicgXSA+LFxuXHRSZWNvcmQ8ICdzdGFydCcgfCAnZW5kJywgc3RyaW5nID5cbj4gPSB7XG5cdHZlcnRpY2FsOiB7XG5cdFx0c3RhcnQ6ICdtYXJnaW5MZWZ0Jyxcblx0XHRlbmQ6ICdtYXJnaW5SaWdodCcsXG5cdH0sXG5cdGhvcml6b250YWw6IHtcblx0XHRzdGFydDogJ21hcmdpblRvcCcsXG5cdFx0ZW5kOiAnbWFyZ2luQm90dG9tJyxcblx0fSxcbn07XG5cbi8vIFJlbmRlcnMgdGhlIGNvcnJlY3QgbWFyZ2lucyBnaXZlbiB0aGUgRGl2aWRlcidzIGBvcmllbnRhdGlvbmAgYW5kIHRoZSB3cml0aW5nIGRpcmVjdGlvbi5cbi8vIFdoZW4gYm90aCB0aGUgZ2VuZXJpYyBgbWFyZ2luYCBhbmQgdGhlIHNwZWNpZmljIGBtYXJnaW5TdGFydHxtYXJnaW5FbmRgIHByb3BzIGFyZSBkZWZpbmVkLFxuLy8gdGhlIGxhdHRlciB3aWxsIHRha2UgcHJpb3JpdHkuXG5jb25zdCByZW5kZXJNYXJnaW4gPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcblx0bWFyZ2luLFxuXHRtYXJnaW5TdGFydCxcblx0bWFyZ2luRW5kLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoXG5cdFx0cnRsKCB7XG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLnN0YXJ0IF06IHNwYWNlKFxuXHRcdFx0XHRtYXJnaW5TdGFydCA/PyBtYXJnaW5cblx0XHRcdCksXG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLmVuZCBdOiBzcGFjZShcblx0XHRcdFx0bWFyZ2luRW5kID8/IG1hcmdpblxuXHRcdFx0KSxcblx0XHR9ICkoKVxuXHQpO1xuXG5jb25zdCByZW5kZXJCb3JkZXIgPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcbn06IFByb3BzICkgPT4ge1xuXHRyZXR1cm4gY3NzKCB7XG5cdFx0WyBvcmllbnRhdGlvbiA9PT0gJ3ZlcnRpY2FsJ1xuXHRcdFx0PyAnYm9yZGVyUmlnaHQnXG5cdFx0XHQ6ICdib3JkZXJCb3R0b20nIF06ICcxcHggc29saWQgY3VycmVudENvbG9yJyxcblx0fSApO1xufTtcblxuY29uc3QgcmVuZGVyU2l6ZSA9ICgge1xuXHQnYXJpYS1vcmllbnRhdGlvbic6IG9yaWVudGF0aW9uID0gJ2hvcml6b250YWwnLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoIHtcblx0XHRoZWlnaHQ6IG9yaWVudGF0aW9uID09PSAndmVydGljYWwnID8gJ2F1dG8nIDogMCxcblx0XHR3aWR0aDogb3JpZW50YXRpb24gPT09ICd2ZXJ0aWNhbCcgPyAwIDogJ2F1dG8nLFxuXHR9ICk7XG5cbmV4cG9ydCBjb25zdCBEaXZpZGVyVmlldyA9IHN0eWxlZC5ocjwgUHJvcHMgPmBcblx0Ym9yZGVyOiAwO1xuXHRtYXJnaW46IDA7XG5cblx0JHsgcmVuZGVyQm9yZGVyIH1cblx0JHsgcmVuZGVyU2l6ZSB9XG5cdCR7IHJlbmRlck1hcmdpbiB9XG5gO1xuIl19 */");
38
+ })(), process.env.NODE_ENV === "production" ? "" : ";label:renderMargin;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBb0NDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vdWkvdXRpbHMvc3BhY2UnO1xuaW1wb3J0IHsgcnRsIH0gZnJvbSAnLi4vdXRpbHMnO1xuaW1wb3J0IHR5cGUgeyBQcm9wcyB9IGZyb20gJy4vdHlwZXMnO1xuXG5jb25zdCBNQVJHSU5fRElSRUNUSU9OUzogUmVjb3JkPFxuXHROb25OdWxsYWJsZTwgUHJvcHNbICdvcmllbnRhdGlvbicgXSA+LFxuXHRSZWNvcmQ8ICdzdGFydCcgfCAnZW5kJywgc3RyaW5nID5cbj4gPSB7XG5cdHZlcnRpY2FsOiB7XG5cdFx0c3RhcnQ6ICdtYXJnaW5MZWZ0Jyxcblx0XHRlbmQ6ICdtYXJnaW5SaWdodCcsXG5cdH0sXG5cdGhvcml6b250YWw6IHtcblx0XHRzdGFydDogJ21hcmdpblRvcCcsXG5cdFx0ZW5kOiAnbWFyZ2luQm90dG9tJyxcblx0fSxcbn07XG5cbi8vIFJlbmRlcnMgdGhlIGNvcnJlY3QgbWFyZ2lucyBnaXZlbiB0aGUgRGl2aWRlcidzIGBvcmllbnRhdGlvbmAgYW5kIHRoZSB3cml0aW5nIGRpcmVjdGlvbi5cbi8vIFdoZW4gYm90aCB0aGUgZ2VuZXJpYyBgbWFyZ2luYCBhbmQgdGhlIHNwZWNpZmljIGBtYXJnaW5TdGFydHxtYXJnaW5FbmRgIHByb3BzIGFyZSBkZWZpbmVkLFxuLy8gdGhlIGxhdHRlciB3aWxsIHRha2UgcHJpb3JpdHkuXG5jb25zdCByZW5kZXJNYXJnaW4gPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcblx0bWFyZ2luLFxuXHRtYXJnaW5TdGFydCxcblx0bWFyZ2luRW5kLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoXG5cdFx0cnRsKCB7XG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLnN0YXJ0IF06IHNwYWNlKFxuXHRcdFx0XHRtYXJnaW5TdGFydCA/PyBtYXJnaW5cblx0XHRcdCksXG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLmVuZCBdOiBzcGFjZShcblx0XHRcdFx0bWFyZ2luRW5kID8/IG1hcmdpblxuXHRcdFx0KSxcblx0XHR9ICkoKVxuXHQpO1xuXG5jb25zdCByZW5kZXJEaXNwbGF5ID0gKCB7XG5cdCdhcmlhLW9yaWVudGF0aW9uJzogb3JpZW50YXRpb24gPSAnaG9yaXpvbnRhbCcsXG59OiBQcm9wcyApID0+IHtcblx0cmV0dXJuIG9yaWVudGF0aW9uID09PSAndmVydGljYWwnXG5cdFx0PyBjc3MoIHsgZGlzcGxheTogJ2lubGluZScgfSApXG5cdFx0OiB1bmRlZmluZWQ7XG59O1xuXG5jb25zdCByZW5kZXJCb3JkZXIgPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcbn06IFByb3BzICkgPT4ge1xuXHRyZXR1cm4gY3NzKCB7XG5cdFx0WyBvcmllbnRhdGlvbiA9PT0gJ3ZlcnRpY2FsJ1xuXHRcdFx0PyAnYm9yZGVyUmlnaHQnXG5cdFx0XHQ6ICdib3JkZXJCb3R0b20nIF06ICcxcHggc29saWQgY3VycmVudENvbG9yJyxcblx0fSApO1xufTtcblxuY29uc3QgcmVuZGVyU2l6ZSA9ICgge1xuXHQnYXJpYS1vcmllbnRhdGlvbic6IG9yaWVudGF0aW9uID0gJ2hvcml6b250YWwnLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoIHtcblx0XHRoZWlnaHQ6IG9yaWVudGF0aW9uID09PSAndmVydGljYWwnID8gJ2F1dG8nIDogMCxcblx0XHR3aWR0aDogb3JpZW50YXRpb24gPT09ICd2ZXJ0aWNhbCcgPyAwIDogJ2F1dG8nLFxuXHR9ICk7XG5cbmV4cG9ydCBjb25zdCBEaXZpZGVyVmlldyA9IHN0eWxlZC5ocjwgUHJvcHMgPmBcblx0Ym9yZGVyOiAwO1xuXHRtYXJnaW46IDA7XG5cblx0JHsgcmVuZGVyRGlzcGxheSB9XG5cdCR7IHJlbmRlckJvcmRlciB9XG5cdCR7IHJlbmRlclNpemUgfVxuXHQkeyByZW5kZXJNYXJnaW4gfVxuYDtcbiJdfQ== */");
39
+ };
40
+
41
+ var _ref = process.env.NODE_ENV === "production" ? {
42
+ name: "1u4hpl4",
43
+ styles: "display:inline"
44
+ } : {
45
+ name: "9r0jm7-renderDisplay",
46
+ styles: "display:inline;label:renderDisplay;",
47
+ map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBbURJIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vdWkvdXRpbHMvc3BhY2UnO1xuaW1wb3J0IHsgcnRsIH0gZnJvbSAnLi4vdXRpbHMnO1xuaW1wb3J0IHR5cGUgeyBQcm9wcyB9IGZyb20gJy4vdHlwZXMnO1xuXG5jb25zdCBNQVJHSU5fRElSRUNUSU9OUzogUmVjb3JkPFxuXHROb25OdWxsYWJsZTwgUHJvcHNbICdvcmllbnRhdGlvbicgXSA+LFxuXHRSZWNvcmQ8ICdzdGFydCcgfCAnZW5kJywgc3RyaW5nID5cbj4gPSB7XG5cdHZlcnRpY2FsOiB7XG5cdFx0c3RhcnQ6ICdtYXJnaW5MZWZ0Jyxcblx0XHRlbmQ6ICdtYXJnaW5SaWdodCcsXG5cdH0sXG5cdGhvcml6b250YWw6IHtcblx0XHRzdGFydDogJ21hcmdpblRvcCcsXG5cdFx0ZW5kOiAnbWFyZ2luQm90dG9tJyxcblx0fSxcbn07XG5cbi8vIFJlbmRlcnMgdGhlIGNvcnJlY3QgbWFyZ2lucyBnaXZlbiB0aGUgRGl2aWRlcidzIGBvcmllbnRhdGlvbmAgYW5kIHRoZSB3cml0aW5nIGRpcmVjdGlvbi5cbi8vIFdoZW4gYm90aCB0aGUgZ2VuZXJpYyBgbWFyZ2luYCBhbmQgdGhlIHNwZWNpZmljIGBtYXJnaW5TdGFydHxtYXJnaW5FbmRgIHByb3BzIGFyZSBkZWZpbmVkLFxuLy8gdGhlIGxhdHRlciB3aWxsIHRha2UgcHJpb3JpdHkuXG5jb25zdCByZW5kZXJNYXJnaW4gPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcblx0bWFyZ2luLFxuXHRtYXJnaW5TdGFydCxcblx0bWFyZ2luRW5kLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoXG5cdFx0cnRsKCB7XG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLnN0YXJ0IF06IHNwYWNlKFxuXHRcdFx0XHRtYXJnaW5TdGFydCA/PyBtYXJnaW5cblx0XHRcdCksXG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLmVuZCBdOiBzcGFjZShcblx0XHRcdFx0bWFyZ2luRW5kID8/IG1hcmdpblxuXHRcdFx0KSxcblx0XHR9ICkoKVxuXHQpO1xuXG5jb25zdCByZW5kZXJEaXNwbGF5ID0gKCB7XG5cdCdhcmlhLW9yaWVudGF0aW9uJzogb3JpZW50YXRpb24gPSAnaG9yaXpvbnRhbCcsXG59OiBQcm9wcyApID0+IHtcblx0cmV0dXJuIG9yaWVudGF0aW9uID09PSAndmVydGljYWwnXG5cdFx0PyBjc3MoIHsgZGlzcGxheTogJ2lubGluZScgfSApXG5cdFx0OiB1bmRlZmluZWQ7XG59O1xuXG5jb25zdCByZW5kZXJCb3JkZXIgPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcbn06IFByb3BzICkgPT4ge1xuXHRyZXR1cm4gY3NzKCB7XG5cdFx0WyBvcmllbnRhdGlvbiA9PT0gJ3ZlcnRpY2FsJ1xuXHRcdFx0PyAnYm9yZGVyUmlnaHQnXG5cdFx0XHQ6ICdib3JkZXJCb3R0b20nIF06ICcxcHggc29saWQgY3VycmVudENvbG9yJyxcblx0fSApO1xufTtcblxuY29uc3QgcmVuZGVyU2l6ZSA9ICgge1xuXHQnYXJpYS1vcmllbnRhdGlvbic6IG9yaWVudGF0aW9uID0gJ2hvcml6b250YWwnLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoIHtcblx0XHRoZWlnaHQ6IG9yaWVudGF0aW9uID09PSAndmVydGljYWwnID8gJ2F1dG8nIDogMCxcblx0XHR3aWR0aDogb3JpZW50YXRpb24gPT09ICd2ZXJ0aWNhbCcgPyAwIDogJ2F1dG8nLFxuXHR9ICk7XG5cbmV4cG9ydCBjb25zdCBEaXZpZGVyVmlldyA9IHN0eWxlZC5ocjwgUHJvcHMgPmBcblx0Ym9yZGVyOiAwO1xuXHRtYXJnaW46IDA7XG5cblx0JHsgcmVuZGVyRGlzcGxheSB9XG5cdCR7IHJlbmRlckJvcmRlciB9XG5cdCR7IHJlbmRlclNpemUgfVxuXHQkeyByZW5kZXJNYXJnaW4gfVxuYDtcbiJdfQ== */",
48
+ toString: _EMOTION_STRINGIFIED_CSS_ERROR__
37
49
  };
38
50
 
39
- const renderBorder = _ref2 => {
51
+ const renderDisplay = _ref3 => {
40
52
  let {
41
53
  'aria-orientation': orientation = 'horizontal'
42
- } = _ref2;
54
+ } = _ref3;
55
+ return orientation === 'vertical' ? _ref : undefined;
56
+ };
57
+
58
+ const renderBorder = _ref4 => {
59
+ let {
60
+ 'aria-orientation': orientation = 'horizontal'
61
+ } = _ref4;
43
62
  return /*#__PURE__*/css({
44
63
  [orientation === 'vertical' ? 'borderRight' : 'borderBottom']: '1px solid currentColor'
45
- }, process.env.NODE_ENV === "production" ? "" : ";label:renderBorder;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBa0RRIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vdWkvdXRpbHMvc3BhY2UnO1xuaW1wb3J0IHsgcnRsIH0gZnJvbSAnLi4vdXRpbHMnO1xuaW1wb3J0IHR5cGUgeyBQcm9wcyB9IGZyb20gJy4vdHlwZXMnO1xuXG5jb25zdCBNQVJHSU5fRElSRUNUSU9OUzogUmVjb3JkPFxuXHROb25OdWxsYWJsZTwgUHJvcHNbICdvcmllbnRhdGlvbicgXSA+LFxuXHRSZWNvcmQ8ICdzdGFydCcgfCAnZW5kJywgc3RyaW5nID5cbj4gPSB7XG5cdHZlcnRpY2FsOiB7XG5cdFx0c3RhcnQ6ICdtYXJnaW5MZWZ0Jyxcblx0XHRlbmQ6ICdtYXJnaW5SaWdodCcsXG5cdH0sXG5cdGhvcml6b250YWw6IHtcblx0XHRzdGFydDogJ21hcmdpblRvcCcsXG5cdFx0ZW5kOiAnbWFyZ2luQm90dG9tJyxcblx0fSxcbn07XG5cbi8vIFJlbmRlcnMgdGhlIGNvcnJlY3QgbWFyZ2lucyBnaXZlbiB0aGUgRGl2aWRlcidzIGBvcmllbnRhdGlvbmAgYW5kIHRoZSB3cml0aW5nIGRpcmVjdGlvbi5cbi8vIFdoZW4gYm90aCB0aGUgZ2VuZXJpYyBgbWFyZ2luYCBhbmQgdGhlIHNwZWNpZmljIGBtYXJnaW5TdGFydHxtYXJnaW5FbmRgIHByb3BzIGFyZSBkZWZpbmVkLFxuLy8gdGhlIGxhdHRlciB3aWxsIHRha2UgcHJpb3JpdHkuXG5jb25zdCByZW5kZXJNYXJnaW4gPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcblx0bWFyZ2luLFxuXHRtYXJnaW5TdGFydCxcblx0bWFyZ2luRW5kLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoXG5cdFx0cnRsKCB7XG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLnN0YXJ0IF06IHNwYWNlKFxuXHRcdFx0XHRtYXJnaW5TdGFydCA/PyBtYXJnaW5cblx0XHRcdCksXG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLmVuZCBdOiBzcGFjZShcblx0XHRcdFx0bWFyZ2luRW5kID8/IG1hcmdpblxuXHRcdFx0KSxcblx0XHR9ICkoKVxuXHQpO1xuXG5jb25zdCByZW5kZXJCb3JkZXIgPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcbn06IFByb3BzICkgPT4ge1xuXHRyZXR1cm4gY3NzKCB7XG5cdFx0WyBvcmllbnRhdGlvbiA9PT0gJ3ZlcnRpY2FsJ1xuXHRcdFx0PyAnYm9yZGVyUmlnaHQnXG5cdFx0XHQ6ICdib3JkZXJCb3R0b20nIF06ICcxcHggc29saWQgY3VycmVudENvbG9yJyxcblx0fSApO1xufTtcblxuY29uc3QgcmVuZGVyU2l6ZSA9ICgge1xuXHQnYXJpYS1vcmllbnRhdGlvbic6IG9yaWVudGF0aW9uID0gJ2hvcml6b250YWwnLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoIHtcblx0XHRoZWlnaHQ6IG9yaWVudGF0aW9uID09PSAndmVydGljYWwnID8gJ2F1dG8nIDogMCxcblx0XHR3aWR0aDogb3JpZW50YXRpb24gPT09ICd2ZXJ0aWNhbCcgPyAwIDogJ2F1dG8nLFxuXHR9ICk7XG5cbmV4cG9ydCBjb25zdCBEaXZpZGVyVmlldyA9IHN0eWxlZC5ocjwgUHJvcHMgPmBcblx0Ym9yZGVyOiAwO1xuXHRtYXJnaW46IDA7XG5cblx0JHsgcmVuZGVyQm9yZGVyIH1cblx0JHsgcmVuZGVyU2l6ZSB9XG5cdCR7IHJlbmRlck1hcmdpbiB9XG5gO1xuIl19 */");
64
+ }, process.env.NODE_ENV === "production" ? "" : ";label:renderBorder;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBMERRIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vdWkvdXRpbHMvc3BhY2UnO1xuaW1wb3J0IHsgcnRsIH0gZnJvbSAnLi4vdXRpbHMnO1xuaW1wb3J0IHR5cGUgeyBQcm9wcyB9IGZyb20gJy4vdHlwZXMnO1xuXG5jb25zdCBNQVJHSU5fRElSRUNUSU9OUzogUmVjb3JkPFxuXHROb25OdWxsYWJsZTwgUHJvcHNbICdvcmllbnRhdGlvbicgXSA+LFxuXHRSZWNvcmQ8ICdzdGFydCcgfCAnZW5kJywgc3RyaW5nID5cbj4gPSB7XG5cdHZlcnRpY2FsOiB7XG5cdFx0c3RhcnQ6ICdtYXJnaW5MZWZ0Jyxcblx0XHRlbmQ6ICdtYXJnaW5SaWdodCcsXG5cdH0sXG5cdGhvcml6b250YWw6IHtcblx0XHRzdGFydDogJ21hcmdpblRvcCcsXG5cdFx0ZW5kOiAnbWFyZ2luQm90dG9tJyxcblx0fSxcbn07XG5cbi8vIFJlbmRlcnMgdGhlIGNvcnJlY3QgbWFyZ2lucyBnaXZlbiB0aGUgRGl2aWRlcidzIGBvcmllbnRhdGlvbmAgYW5kIHRoZSB3cml0aW5nIGRpcmVjdGlvbi5cbi8vIFdoZW4gYm90aCB0aGUgZ2VuZXJpYyBgbWFyZ2luYCBhbmQgdGhlIHNwZWNpZmljIGBtYXJnaW5TdGFydHxtYXJnaW5FbmRgIHByb3BzIGFyZSBkZWZpbmVkLFxuLy8gdGhlIGxhdHRlciB3aWxsIHRha2UgcHJpb3JpdHkuXG5jb25zdCByZW5kZXJNYXJnaW4gPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcblx0bWFyZ2luLFxuXHRtYXJnaW5TdGFydCxcblx0bWFyZ2luRW5kLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoXG5cdFx0cnRsKCB7XG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLnN0YXJ0IF06IHNwYWNlKFxuXHRcdFx0XHRtYXJnaW5TdGFydCA/PyBtYXJnaW5cblx0XHRcdCksXG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLmVuZCBdOiBzcGFjZShcblx0XHRcdFx0bWFyZ2luRW5kID8/IG1hcmdpblxuXHRcdFx0KSxcblx0XHR9ICkoKVxuXHQpO1xuXG5jb25zdCByZW5kZXJEaXNwbGF5ID0gKCB7XG5cdCdhcmlhLW9yaWVudGF0aW9uJzogb3JpZW50YXRpb24gPSAnaG9yaXpvbnRhbCcsXG59OiBQcm9wcyApID0+IHtcblx0cmV0dXJuIG9yaWVudGF0aW9uID09PSAndmVydGljYWwnXG5cdFx0PyBjc3MoIHsgZGlzcGxheTogJ2lubGluZScgfSApXG5cdFx0OiB1bmRlZmluZWQ7XG59O1xuXG5jb25zdCByZW5kZXJCb3JkZXIgPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcbn06IFByb3BzICkgPT4ge1xuXHRyZXR1cm4gY3NzKCB7XG5cdFx0WyBvcmllbnRhdGlvbiA9PT0gJ3ZlcnRpY2FsJ1xuXHRcdFx0PyAnYm9yZGVyUmlnaHQnXG5cdFx0XHQ6ICdib3JkZXJCb3R0b20nIF06ICcxcHggc29saWQgY3VycmVudENvbG9yJyxcblx0fSApO1xufTtcblxuY29uc3QgcmVuZGVyU2l6ZSA9ICgge1xuXHQnYXJpYS1vcmllbnRhdGlvbic6IG9yaWVudGF0aW9uID0gJ2hvcml6b250YWwnLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoIHtcblx0XHRoZWlnaHQ6IG9yaWVudGF0aW9uID09PSAndmVydGljYWwnID8gJ2F1dG8nIDogMCxcblx0XHR3aWR0aDogb3JpZW50YXRpb24gPT09ICd2ZXJ0aWNhbCcgPyAwIDogJ2F1dG8nLFxuXHR9ICk7XG5cbmV4cG9ydCBjb25zdCBEaXZpZGVyVmlldyA9IHN0eWxlZC5ocjwgUHJvcHMgPmBcblx0Ym9yZGVyOiAwO1xuXHRtYXJnaW46IDA7XG5cblx0JHsgcmVuZGVyRGlzcGxheSB9XG5cdCR7IHJlbmRlckJvcmRlciB9XG5cdCR7IHJlbmRlclNpemUgfVxuXHQkeyByZW5kZXJNYXJnaW4gfVxuYDtcbiJdfQ== */");
46
65
  };
47
66
 
48
- const renderSize = _ref3 => {
67
+ const renderSize = _ref5 => {
49
68
  let {
50
69
  'aria-orientation': orientation = 'horizontal'
51
- } = _ref3;
70
+ } = _ref5;
52
71
  return /*#__PURE__*/css({
53
72
  height: orientation === 'vertical' ? 'auto' : 0,
54
73
  width: orientation === 'vertical' ? 0 : 'auto'
55
- }, process.env.NODE_ENV === "production" ? "" : ";label:renderSize;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNERDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vdWkvdXRpbHMvc3BhY2UnO1xuaW1wb3J0IHsgcnRsIH0gZnJvbSAnLi4vdXRpbHMnO1xuaW1wb3J0IHR5cGUgeyBQcm9wcyB9IGZyb20gJy4vdHlwZXMnO1xuXG5jb25zdCBNQVJHSU5fRElSRUNUSU9OUzogUmVjb3JkPFxuXHROb25OdWxsYWJsZTwgUHJvcHNbICdvcmllbnRhdGlvbicgXSA+LFxuXHRSZWNvcmQ8ICdzdGFydCcgfCAnZW5kJywgc3RyaW5nID5cbj4gPSB7XG5cdHZlcnRpY2FsOiB7XG5cdFx0c3RhcnQ6ICdtYXJnaW5MZWZ0Jyxcblx0XHRlbmQ6ICdtYXJnaW5SaWdodCcsXG5cdH0sXG5cdGhvcml6b250YWw6IHtcblx0XHRzdGFydDogJ21hcmdpblRvcCcsXG5cdFx0ZW5kOiAnbWFyZ2luQm90dG9tJyxcblx0fSxcbn07XG5cbi8vIFJlbmRlcnMgdGhlIGNvcnJlY3QgbWFyZ2lucyBnaXZlbiB0aGUgRGl2aWRlcidzIGBvcmllbnRhdGlvbmAgYW5kIHRoZSB3cml0aW5nIGRpcmVjdGlvbi5cbi8vIFdoZW4gYm90aCB0aGUgZ2VuZXJpYyBgbWFyZ2luYCBhbmQgdGhlIHNwZWNpZmljIGBtYXJnaW5TdGFydHxtYXJnaW5FbmRgIHByb3BzIGFyZSBkZWZpbmVkLFxuLy8gdGhlIGxhdHRlciB3aWxsIHRha2UgcHJpb3JpdHkuXG5jb25zdCByZW5kZXJNYXJnaW4gPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcblx0bWFyZ2luLFxuXHRtYXJnaW5TdGFydCxcblx0bWFyZ2luRW5kLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoXG5cdFx0cnRsKCB7XG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLnN0YXJ0IF06IHNwYWNlKFxuXHRcdFx0XHRtYXJnaW5TdGFydCA/PyBtYXJnaW5cblx0XHRcdCksXG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLmVuZCBdOiBzcGFjZShcblx0XHRcdFx0bWFyZ2luRW5kID8/IG1hcmdpblxuXHRcdFx0KSxcblx0XHR9ICkoKVxuXHQpO1xuXG5jb25zdCByZW5kZXJCb3JkZXIgPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcbn06IFByb3BzICkgPT4ge1xuXHRyZXR1cm4gY3NzKCB7XG5cdFx0WyBvcmllbnRhdGlvbiA9PT0gJ3ZlcnRpY2FsJ1xuXHRcdFx0PyAnYm9yZGVyUmlnaHQnXG5cdFx0XHQ6ICdib3JkZXJCb3R0b20nIF06ICcxcHggc29saWQgY3VycmVudENvbG9yJyxcblx0fSApO1xufTtcblxuY29uc3QgcmVuZGVyU2l6ZSA9ICgge1xuXHQnYXJpYS1vcmllbnRhdGlvbic6IG9yaWVudGF0aW9uID0gJ2hvcml6b250YWwnLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoIHtcblx0XHRoZWlnaHQ6IG9yaWVudGF0aW9uID09PSAndmVydGljYWwnID8gJ2F1dG8nIDogMCxcblx0XHR3aWR0aDogb3JpZW50YXRpb24gPT09ICd2ZXJ0aWNhbCcgPyAwIDogJ2F1dG8nLFxuXHR9ICk7XG5cbmV4cG9ydCBjb25zdCBEaXZpZGVyVmlldyA9IHN0eWxlZC5ocjwgUHJvcHMgPmBcblx0Ym9yZGVyOiAwO1xuXHRtYXJnaW46IDA7XG5cblx0JHsgcmVuZGVyQm9yZGVyIH1cblx0JHsgcmVuZGVyU2l6ZSB9XG5cdCR7IHJlbmRlck1hcmdpbiB9XG5gO1xuIl19 */");
74
+ }, process.env.NODE_ENV === "production" ? "" : ";label:renderSize;", process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBb0VDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vdWkvdXRpbHMvc3BhY2UnO1xuaW1wb3J0IHsgcnRsIH0gZnJvbSAnLi4vdXRpbHMnO1xuaW1wb3J0IHR5cGUgeyBQcm9wcyB9IGZyb20gJy4vdHlwZXMnO1xuXG5jb25zdCBNQVJHSU5fRElSRUNUSU9OUzogUmVjb3JkPFxuXHROb25OdWxsYWJsZTwgUHJvcHNbICdvcmllbnRhdGlvbicgXSA+LFxuXHRSZWNvcmQ8ICdzdGFydCcgfCAnZW5kJywgc3RyaW5nID5cbj4gPSB7XG5cdHZlcnRpY2FsOiB7XG5cdFx0c3RhcnQ6ICdtYXJnaW5MZWZ0Jyxcblx0XHRlbmQ6ICdtYXJnaW5SaWdodCcsXG5cdH0sXG5cdGhvcml6b250YWw6IHtcblx0XHRzdGFydDogJ21hcmdpblRvcCcsXG5cdFx0ZW5kOiAnbWFyZ2luQm90dG9tJyxcblx0fSxcbn07XG5cbi8vIFJlbmRlcnMgdGhlIGNvcnJlY3QgbWFyZ2lucyBnaXZlbiB0aGUgRGl2aWRlcidzIGBvcmllbnRhdGlvbmAgYW5kIHRoZSB3cml0aW5nIGRpcmVjdGlvbi5cbi8vIFdoZW4gYm90aCB0aGUgZ2VuZXJpYyBgbWFyZ2luYCBhbmQgdGhlIHNwZWNpZmljIGBtYXJnaW5TdGFydHxtYXJnaW5FbmRgIHByb3BzIGFyZSBkZWZpbmVkLFxuLy8gdGhlIGxhdHRlciB3aWxsIHRha2UgcHJpb3JpdHkuXG5jb25zdCByZW5kZXJNYXJnaW4gPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcblx0bWFyZ2luLFxuXHRtYXJnaW5TdGFydCxcblx0bWFyZ2luRW5kLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoXG5cdFx0cnRsKCB7XG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLnN0YXJ0IF06IHNwYWNlKFxuXHRcdFx0XHRtYXJnaW5TdGFydCA/PyBtYXJnaW5cblx0XHRcdCksXG5cdFx0XHRbIE1BUkdJTl9ESVJFQ1RJT05TWyBvcmllbnRhdGlvbiBdLmVuZCBdOiBzcGFjZShcblx0XHRcdFx0bWFyZ2luRW5kID8/IG1hcmdpblxuXHRcdFx0KSxcblx0XHR9ICkoKVxuXHQpO1xuXG5jb25zdCByZW5kZXJEaXNwbGF5ID0gKCB7XG5cdCdhcmlhLW9yaWVudGF0aW9uJzogb3JpZW50YXRpb24gPSAnaG9yaXpvbnRhbCcsXG59OiBQcm9wcyApID0+IHtcblx0cmV0dXJuIG9yaWVudGF0aW9uID09PSAndmVydGljYWwnXG5cdFx0PyBjc3MoIHsgZGlzcGxheTogJ2lubGluZScgfSApXG5cdFx0OiB1bmRlZmluZWQ7XG59O1xuXG5jb25zdCByZW5kZXJCb3JkZXIgPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcbn06IFByb3BzICkgPT4ge1xuXHRyZXR1cm4gY3NzKCB7XG5cdFx0WyBvcmllbnRhdGlvbiA9PT0gJ3ZlcnRpY2FsJ1xuXHRcdFx0PyAnYm9yZGVyUmlnaHQnXG5cdFx0XHQ6ICdib3JkZXJCb3R0b20nIF06ICcxcHggc29saWQgY3VycmVudENvbG9yJyxcblx0fSApO1xufTtcblxuY29uc3QgcmVuZGVyU2l6ZSA9ICgge1xuXHQnYXJpYS1vcmllbnRhdGlvbic6IG9yaWVudGF0aW9uID0gJ2hvcml6b250YWwnLFxufTogUHJvcHMgKSA9PlxuXHRjc3MoIHtcblx0XHRoZWlnaHQ6IG9yaWVudGF0aW9uID09PSAndmVydGljYWwnID8gJ2F1dG8nIDogMCxcblx0XHR3aWR0aDogb3JpZW50YXRpb24gPT09ICd2ZXJ0aWNhbCcgPyAwIDogJ2F1dG8nLFxuXHR9ICk7XG5cbmV4cG9ydCBjb25zdCBEaXZpZGVyVmlldyA9IHN0eWxlZC5ocjwgUHJvcHMgPmBcblx0Ym9yZGVyOiAwO1xuXHRtYXJnaW46IDA7XG5cblx0JHsgcmVuZGVyRGlzcGxheSB9XG5cdCR7IHJlbmRlckJvcmRlciB9XG5cdCR7IHJlbmRlclNpemUgfVxuXHQkeyByZW5kZXJNYXJnaW4gfVxuYDtcbiJdfQ== */");
56
75
  };
57
76
 
58
77
  export const DividerView = _styled("hr", process.env.NODE_ENV === "production" ? {
@@ -60,5 +79,5 @@ export const DividerView = _styled("hr", process.env.NODE_ENV === "production" ?
60
79
  } : {
61
80
  target: "e19on6iw0",
62
81
  label: "DividerView"
63
- })("border:0;margin:0;", renderBorder, " ", renderSize, " ", renderMargin, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaUU2QyIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2RpdmlkZXIvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBzcGFjZSB9IGZyb20gJy4uL3VpL3V0aWxzL3NwYWNlJztcbmltcG9ydCB7IHJ0bCB9IGZyb20gJy4uL3V0aWxzJztcbmltcG9ydCB0eXBlIHsgUHJvcHMgfSBmcm9tICcuL3R5cGVzJztcblxuY29uc3QgTUFSR0lOX0RJUkVDVElPTlM6IFJlY29yZDxcblx0Tm9uTnVsbGFibGU8IFByb3BzWyAnb3JpZW50YXRpb24nIF0gPixcblx0UmVjb3JkPCAnc3RhcnQnIHwgJ2VuZCcsIHN0cmluZyA+XG4+ID0ge1xuXHR2ZXJ0aWNhbDoge1xuXHRcdHN0YXJ0OiAnbWFyZ2luTGVmdCcsXG5cdFx0ZW5kOiAnbWFyZ2luUmlnaHQnLFxuXHR9LFxuXHRob3Jpem9udGFsOiB7XG5cdFx0c3RhcnQ6ICdtYXJnaW5Ub3AnLFxuXHRcdGVuZDogJ21hcmdpbkJvdHRvbScsXG5cdH0sXG59O1xuXG4vLyBSZW5kZXJzIHRoZSBjb3JyZWN0IG1hcmdpbnMgZ2l2ZW4gdGhlIERpdmlkZXIncyBgb3JpZW50YXRpb25gIGFuZCB0aGUgd3JpdGluZyBkaXJlY3Rpb24uXG4vLyBXaGVuIGJvdGggdGhlIGdlbmVyaWMgYG1hcmdpbmAgYW5kIHRoZSBzcGVjaWZpYyBgbWFyZ2luU3RhcnR8bWFyZ2luRW5kYCBwcm9wcyBhcmUgZGVmaW5lZCxcbi8vIHRoZSBsYXR0ZXIgd2lsbCB0YWtlIHByaW9yaXR5LlxuY29uc3QgcmVuZGVyTWFyZ2luID0gKCB7XG5cdCdhcmlhLW9yaWVudGF0aW9uJzogb3JpZW50YXRpb24gPSAnaG9yaXpvbnRhbCcsXG5cdG1hcmdpbixcblx0bWFyZ2luU3RhcnQsXG5cdG1hcmdpbkVuZCxcbn06IFByb3BzICkgPT5cblx0Y3NzKFxuXHRcdHJ0bCgge1xuXHRcdFx0WyBNQVJHSU5fRElSRUNUSU9OU1sgb3JpZW50YXRpb24gXS5zdGFydCBdOiBzcGFjZShcblx0XHRcdFx0bWFyZ2luU3RhcnQgPz8gbWFyZ2luXG5cdFx0XHQpLFxuXHRcdFx0WyBNQVJHSU5fRElSRUNUSU9OU1sgb3JpZW50YXRpb24gXS5lbmQgXTogc3BhY2UoXG5cdFx0XHRcdG1hcmdpbkVuZCA/PyBtYXJnaW5cblx0XHRcdCksXG5cdFx0fSApKClcblx0KTtcblxuY29uc3QgcmVuZGVyQm9yZGVyID0gKCB7XG5cdCdhcmlhLW9yaWVudGF0aW9uJzogb3JpZW50YXRpb24gPSAnaG9yaXpvbnRhbCcsXG59OiBQcm9wcyApID0+IHtcblx0cmV0dXJuIGNzcygge1xuXHRcdFsgb3JpZW50YXRpb24gPT09ICd2ZXJ0aWNhbCdcblx0XHRcdD8gJ2JvcmRlclJpZ2h0J1xuXHRcdFx0OiAnYm9yZGVyQm90dG9tJyBdOiAnMXB4IHNvbGlkIGN1cnJlbnRDb2xvcicsXG5cdH0gKTtcbn07XG5cbmNvbnN0IHJlbmRlclNpemUgPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcbn06IFByb3BzICkgPT5cblx0Y3NzKCB7XG5cdFx0aGVpZ2h0OiBvcmllbnRhdGlvbiA9PT0gJ3ZlcnRpY2FsJyA/ICdhdXRvJyA6IDAsXG5cdFx0d2lkdGg6IG9yaWVudGF0aW9uID09PSAndmVydGljYWwnID8gMCA6ICdhdXRvJyxcblx0fSApO1xuXG5leHBvcnQgY29uc3QgRGl2aWRlclZpZXcgPSBzdHlsZWQuaHI8IFByb3BzID5gXG5cdGJvcmRlcjogMDtcblx0bWFyZ2luOiAwO1xuXG5cdCR7IHJlbmRlckJvcmRlciB9XG5cdCR7IHJlbmRlclNpemUgfVxuXHQkeyByZW5kZXJNYXJnaW4gfVxuYDtcbiJdfQ== */"));
82
+ })("border:0;margin:0;", renderDisplay, " ", renderBorder, " ", renderSize, " ", renderMargin, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvZGl2aWRlci9zdHlsZXMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBeUU2QyIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2RpdmlkZXIvc3R5bGVzLnRzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBzcGFjZSB9IGZyb20gJy4uL3VpL3V0aWxzL3NwYWNlJztcbmltcG9ydCB7IHJ0bCB9IGZyb20gJy4uL3V0aWxzJztcbmltcG9ydCB0eXBlIHsgUHJvcHMgfSBmcm9tICcuL3R5cGVzJztcblxuY29uc3QgTUFSR0lOX0RJUkVDVElPTlM6IFJlY29yZDxcblx0Tm9uTnVsbGFibGU8IFByb3BzWyAnb3JpZW50YXRpb24nIF0gPixcblx0UmVjb3JkPCAnc3RhcnQnIHwgJ2VuZCcsIHN0cmluZyA+XG4+ID0ge1xuXHR2ZXJ0aWNhbDoge1xuXHRcdHN0YXJ0OiAnbWFyZ2luTGVmdCcsXG5cdFx0ZW5kOiAnbWFyZ2luUmlnaHQnLFxuXHR9LFxuXHRob3Jpem9udGFsOiB7XG5cdFx0c3RhcnQ6ICdtYXJnaW5Ub3AnLFxuXHRcdGVuZDogJ21hcmdpbkJvdHRvbScsXG5cdH0sXG59O1xuXG4vLyBSZW5kZXJzIHRoZSBjb3JyZWN0IG1hcmdpbnMgZ2l2ZW4gdGhlIERpdmlkZXIncyBgb3JpZW50YXRpb25gIGFuZCB0aGUgd3JpdGluZyBkaXJlY3Rpb24uXG4vLyBXaGVuIGJvdGggdGhlIGdlbmVyaWMgYG1hcmdpbmAgYW5kIHRoZSBzcGVjaWZpYyBgbWFyZ2luU3RhcnR8bWFyZ2luRW5kYCBwcm9wcyBhcmUgZGVmaW5lZCxcbi8vIHRoZSBsYXR0ZXIgd2lsbCB0YWtlIHByaW9yaXR5LlxuY29uc3QgcmVuZGVyTWFyZ2luID0gKCB7XG5cdCdhcmlhLW9yaWVudGF0aW9uJzogb3JpZW50YXRpb24gPSAnaG9yaXpvbnRhbCcsXG5cdG1hcmdpbixcblx0bWFyZ2luU3RhcnQsXG5cdG1hcmdpbkVuZCxcbn06IFByb3BzICkgPT5cblx0Y3NzKFxuXHRcdHJ0bCgge1xuXHRcdFx0WyBNQVJHSU5fRElSRUNUSU9OU1sgb3JpZW50YXRpb24gXS5zdGFydCBdOiBzcGFjZShcblx0XHRcdFx0bWFyZ2luU3RhcnQgPz8gbWFyZ2luXG5cdFx0XHQpLFxuXHRcdFx0WyBNQVJHSU5fRElSRUNUSU9OU1sgb3JpZW50YXRpb24gXS5lbmQgXTogc3BhY2UoXG5cdFx0XHRcdG1hcmdpbkVuZCA/PyBtYXJnaW5cblx0XHRcdCksXG5cdFx0fSApKClcblx0KTtcblxuY29uc3QgcmVuZGVyRGlzcGxheSA9ICgge1xuXHQnYXJpYS1vcmllbnRhdGlvbic6IG9yaWVudGF0aW9uID0gJ2hvcml6b250YWwnLFxufTogUHJvcHMgKSA9PiB7XG5cdHJldHVybiBvcmllbnRhdGlvbiA9PT0gJ3ZlcnRpY2FsJ1xuXHRcdD8gY3NzKCB7IGRpc3BsYXk6ICdpbmxpbmUnIH0gKVxuXHRcdDogdW5kZWZpbmVkO1xufTtcblxuY29uc3QgcmVuZGVyQm9yZGVyID0gKCB7XG5cdCdhcmlhLW9yaWVudGF0aW9uJzogb3JpZW50YXRpb24gPSAnaG9yaXpvbnRhbCcsXG59OiBQcm9wcyApID0+IHtcblx0cmV0dXJuIGNzcygge1xuXHRcdFsgb3JpZW50YXRpb24gPT09ICd2ZXJ0aWNhbCdcblx0XHRcdD8gJ2JvcmRlclJpZ2h0J1xuXHRcdFx0OiAnYm9yZGVyQm90dG9tJyBdOiAnMXB4IHNvbGlkIGN1cnJlbnRDb2xvcicsXG5cdH0gKTtcbn07XG5cbmNvbnN0IHJlbmRlclNpemUgPSAoIHtcblx0J2FyaWEtb3JpZW50YXRpb24nOiBvcmllbnRhdGlvbiA9ICdob3Jpem9udGFsJyxcbn06IFByb3BzICkgPT5cblx0Y3NzKCB7XG5cdFx0aGVpZ2h0OiBvcmllbnRhdGlvbiA9PT0gJ3ZlcnRpY2FsJyA/ICdhdXRvJyA6IDAsXG5cdFx0d2lkdGg6IG9yaWVudGF0aW9uID09PSAndmVydGljYWwnID8gMCA6ICdhdXRvJyxcblx0fSApO1xuXG5leHBvcnQgY29uc3QgRGl2aWRlclZpZXcgPSBzdHlsZWQuaHI8IFByb3BzID5gXG5cdGJvcmRlcjogMDtcblx0bWFyZ2luOiAwO1xuXG5cdCR7IHJlbmRlckRpc3BsYXkgfVxuXHQkeyByZW5kZXJCb3JkZXIgfVxuXHQkeyByZW5kZXJTaXplIH1cblx0JHsgcmVuZGVyTWFyZ2luIH1cbmA7XG4iXX0= */"));
64
83
  //# sourceMappingURL=styles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/divider/styles.ts"],"names":["css","space","rtl","MARGIN_DIRECTIONS","vertical","start","end","horizontal","renderMargin","orientation","margin","marginStart","marginEnd","renderBorder","renderSize","height","width","DividerView"],"mappings":";;AAAA;AACA;AACA;AAEA,SAASA,GAAT,QAAoB,gBAApB;AAEA;AACA;AACA;;AACA,SAASC,KAAT,QAAsB,mBAAtB;AACA,SAASC,GAAT,QAAoB,UAApB;AAGA,MAAMC,iBAGL,GAAG;AACHC,EAAAA,QAAQ,EAAE;AACTC,IAAAA,KAAK,EAAE,YADE;AAETC,IAAAA,GAAG,EAAE;AAFI,GADP;AAKHC,EAAAA,UAAU,EAAE;AACXF,IAAAA,KAAK,EAAE,WADI;AAEXC,IAAAA,GAAG,EAAE;AAFM;AALT,CAHJ,C,CAcA;AACA;AACA;;AACA,MAAME,YAAY,GAAG;AAAA,MAAE;AACtB,wBAAoBC,WAAW,GAAG,YADZ;AAEtBC,IAAAA,MAFsB;AAGtBC,IAAAA,WAHsB;AAItBC,IAAAA;AAJsB,GAAF;AAAA,sBAMpBZ,GAAG,CACFE,GAAG,CAAE;AACJ,KAAEC,iBAAiB,CAAEM,WAAF,CAAjB,CAAiCJ,KAAnC,GAA4CJ,KAAK,CAChDU,WADgD,aAChDA,WADgD,cAChDA,WADgD,GACjCD,MADiC,CAD7C;AAIJ,KAAEP,iBAAiB,CAAEM,WAAF,CAAjB,CAAiCH,GAAnC,GAA0CL,KAAK,CAC9CW,SAD8C,aAC9CA,SAD8C,cAC9CA,SAD8C,GACjCF,MADiC;AAJ3C,GAAF,CAAH,EADE,kqFANiB;AAAA,CAArB;;AAiBA,MAAMG,YAAY,GAAG,SAEP;AAAA,MAFS;AACtB,wBAAoBJ,WAAW,GAAG;AADZ,GAET;AACb,sBAAOT,GAAG,CAAE;AACX,KAAES,WAAW,KAAK,UAAhB,GACC,aADD,GAEC,cAFH,GAEqB;AAHV,GAAF,kqFAAV;AAKA,CARD;;AAUA,MAAMK,UAAU,GAAG;AAAA,MAAE;AACpB,wBAAoBL,WAAW,GAAG;AADd,GAAF;AAAA,sBAGlBT,GAAG,CAAE;AACJe,IAAAA,MAAM,EAAEN,WAAW,KAAK,UAAhB,GAA6B,MAA7B,GAAsC,CAD1C;AAEJO,IAAAA,KAAK,EAAEP,WAAW,KAAK,UAAhB,GAA6B,CAA7B,GAAiC;AAFpC,GAAF,gqFAHe;AAAA,CAAnB;;AAQA,OAAO,MAAMQ,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,yBAIpBJ,YAJoB,OAKpBC,UALoB,OAMpBN,YANoB,ymFAAjB","sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\nimport { css } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport { space } from '../ui/utils/space';\nimport { rtl } from '../utils';\nimport type { Props } from './types';\n\nconst MARGIN_DIRECTIONS: Record<\n\tNonNullable< Props[ 'orientation' ] >,\n\tRecord< 'start' | 'end', string >\n> = {\n\tvertical: {\n\t\tstart: 'marginLeft',\n\t\tend: 'marginRight',\n\t},\n\thorizontal: {\n\t\tstart: 'marginTop',\n\t\tend: 'marginBottom',\n\t},\n};\n\n// Renders the correct margins given the Divider's `orientation` and the writing direction.\n// When both the generic `margin` and the specific `marginStart|marginEnd` props are defined,\n// the latter will take priority.\nconst renderMargin = ( {\n\t'aria-orientation': orientation = 'horizontal',\n\tmargin,\n\tmarginStart,\n\tmarginEnd,\n}: Props ) =>\n\tcss(\n\t\trtl( {\n\t\t\t[ MARGIN_DIRECTIONS[ orientation ].start ]: space(\n\t\t\t\tmarginStart ?? margin\n\t\t\t),\n\t\t\t[ MARGIN_DIRECTIONS[ orientation ].end ]: space(\n\t\t\t\tmarginEnd ?? margin\n\t\t\t),\n\t\t} )()\n\t);\n\nconst renderBorder = ( {\n\t'aria-orientation': orientation = 'horizontal',\n}: Props ) => {\n\treturn css( {\n\t\t[ orientation === 'vertical'\n\t\t\t? 'borderRight'\n\t\t\t: 'borderBottom' ]: '1px solid currentColor',\n\t} );\n};\n\nconst renderSize = ( {\n\t'aria-orientation': orientation = 'horizontal',\n}: Props ) =>\n\tcss( {\n\t\theight: orientation === 'vertical' ? 'auto' : 0,\n\t\twidth: orientation === 'vertical' ? 0 : 'auto',\n\t} );\n\nexport const DividerView = styled.hr< Props >`\n\tborder: 0;\n\tmargin: 0;\n\n\t${ renderBorder }\n\t${ renderSize }\n\t${ renderMargin }\n`;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/divider/styles.ts"],"names":["css","space","rtl","MARGIN_DIRECTIONS","vertical","start","end","horizontal","renderMargin","orientation","margin","marginStart","marginEnd","renderDisplay","undefined","renderBorder","renderSize","height","width","DividerView"],"mappings":";;;;AAAA;AACA;AACA;AAEA,SAASA,GAAT,QAAoB,gBAApB;AAEA;AACA;AACA;;AACA,SAASC,KAAT,QAAsB,mBAAtB;AACA,SAASC,GAAT,QAAoB,UAApB;AAGA,MAAMC,iBAGL,GAAG;AACHC,EAAAA,QAAQ,EAAE;AACTC,IAAAA,KAAK,EAAE,YADE;AAETC,IAAAA,GAAG,EAAE;AAFI,GADP;AAKHC,EAAAA,UAAU,EAAE;AACXF,IAAAA,KAAK,EAAE,WADI;AAEXC,IAAAA,GAAG,EAAE;AAFM;AALT,CAHJ,C,CAcA;AACA;AACA;;AACA,MAAME,YAAY,GAAG;AAAA,MAAE;AACtB,wBAAoBC,WAAW,GAAG,YADZ;AAEtBC,IAAAA,MAFsB;AAGtBC,IAAAA,WAHsB;AAItBC,IAAAA;AAJsB,GAAF;AAAA,sBAMpBZ,GAAG,CACFE,GAAG,CAAE;AACJ,KAAEC,iBAAiB,CAAEM,WAAF,CAAjB,CAAiCJ,KAAnC,GAA4CJ,KAAK,CAChDU,WADgD,aAChDA,WADgD,cAChDA,WADgD,GACjCD,MADiC,CAD7C;AAIJ,KAAEP,iBAAiB,CAAEM,WAAF,CAAjB,CAAiCH,GAAnC,GAA0CL,KAAK,CAC9CW,SAD8C,aAC9CA,SAD8C,cAC9CA,SAD8C,GACjCF,MADiC;AAJ3C,GAAF,CAAH,EADE,k8FANiB;AAAA,CAArB;;;;;;;;;;;;AAiBA,MAAMG,aAAa,GAAG,SAER;AAAA,MAFU;AACvB,wBAAoBJ,WAAW,GAAG;AADX,GAEV;AACb,SAAOA,WAAW,KAAK,UAAhB,UAEJK,SAFH;AAGA,CAND;;AAQA,MAAMC,YAAY,GAAG,SAEP;AAAA,MAFS;AACtB,wBAAoBN,WAAW,GAAG;AADZ,GAET;AACb,sBAAOT,GAAG,CAAE;AACX,KAAES,WAAW,KAAK,UAAhB,GACC,aADD,GAEC,cAFH,GAEqB;AAHV,GAAF,k8FAAV;AAKA,CARD;;AAUA,MAAMO,UAAU,GAAG;AAAA,MAAE;AACpB,wBAAoBP,WAAW,GAAG;AADd,GAAF;AAAA,sBAGlBT,GAAG,CAAE;AACJiB,IAAAA,MAAM,EAAER,WAAW,KAAK,UAAhB,GAA6B,MAA7B,GAAsC,CAD1C;AAEJS,IAAAA,KAAK,EAAET,WAAW,KAAK,UAAhB,GAA6B,CAA7B,GAAiC;AAFpC,GAAF,g8FAHe;AAAA,CAAnB;;AAQA,OAAO,MAAMU,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,yBAIpBN,aAJoB,OAKpBE,YALoB,OAMpBC,UANoB,OAOpBR,YAPoB,q4FAAjB","sourcesContent":["/**\n * External dependencies\n */\nimport styled from '@emotion/styled';\nimport { css } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport { space } from '../ui/utils/space';\nimport { rtl } from '../utils';\nimport type { Props } from './types';\n\nconst MARGIN_DIRECTIONS: Record<\n\tNonNullable< Props[ 'orientation' ] >,\n\tRecord< 'start' | 'end', string >\n> = {\n\tvertical: {\n\t\tstart: 'marginLeft',\n\t\tend: 'marginRight',\n\t},\n\thorizontal: {\n\t\tstart: 'marginTop',\n\t\tend: 'marginBottom',\n\t},\n};\n\n// Renders the correct margins given the Divider's `orientation` and the writing direction.\n// When both the generic `margin` and the specific `marginStart|marginEnd` props are defined,\n// the latter will take priority.\nconst renderMargin = ( {\n\t'aria-orientation': orientation = 'horizontal',\n\tmargin,\n\tmarginStart,\n\tmarginEnd,\n}: Props ) =>\n\tcss(\n\t\trtl( {\n\t\t\t[ MARGIN_DIRECTIONS[ orientation ].start ]: space(\n\t\t\t\tmarginStart ?? margin\n\t\t\t),\n\t\t\t[ MARGIN_DIRECTIONS[ orientation ].end ]: space(\n\t\t\t\tmarginEnd ?? margin\n\t\t\t),\n\t\t} )()\n\t);\n\nconst renderDisplay = ( {\n\t'aria-orientation': orientation = 'horizontal',\n}: Props ) => {\n\treturn orientation === 'vertical'\n\t\t? css( { display: 'inline' } )\n\t\t: undefined;\n};\n\nconst renderBorder = ( {\n\t'aria-orientation': orientation = 'horizontal',\n}: Props ) => {\n\treturn css( {\n\t\t[ orientation === 'vertical'\n\t\t\t? 'borderRight'\n\t\t\t: 'borderBottom' ]: '1px solid currentColor',\n\t} );\n};\n\nconst renderSize = ( {\n\t'aria-orientation': orientation = 'horizontal',\n}: Props ) =>\n\tcss( {\n\t\theight: orientation === 'vertical' ? 'auto' : 0,\n\t\twidth: orientation === 'vertical' ? 0 : 'auto',\n\t} );\n\nexport const DividerView = styled.hr< Props >`\n\tborder: 0;\n\tmargin: 0;\n\n\t${ renderDisplay }\n\t${ renderBorder }\n\t${ renderSize }\n\t${ renderMargin }\n`;\n"]}
@@ -43,12 +43,12 @@ export default function FocalPointPickerControls(_ref) {
43
43
  className: "focal-point-picker__controls"
44
44
  }, createElement(UnitControl, {
45
45
  label: __('Left'),
46
- value: valueX,
46
+ value: [valueX, '%'].join(''),
47
47
  onChange: next => handleChange(next, 'x'),
48
48
  dragDirection: "e"
49
49
  }), createElement(UnitControl, {
50
50
  label: __('Top'),
51
- value: valueY,
51
+ value: [valueY, '%'].join(''),
52
52
  onChange: next => handleChange(next, 'y'),
53
53
  dragDirection: "s"
54
54
  }));
@@ -60,7 +60,6 @@ function UnitControl(props) {
60
60
  labelPosition: "top",
61
61
  max: TEXTCONTROL_MAX,
62
62
  min: TEXTCONTROL_MIN,
63
- unit: "%",
64
63
  units: [{
65
64
  value: '%',
66
65
  label: '%'
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/focal-point-picker/controls.js"],"names":["noop","__","UnitControl","BaseUnitControl","ControlWrapper","fractionToPercentage","TEXTCONTROL_MIN","TEXTCONTROL_MAX","FocalPointPickerControls","onChange","percentages","x","y","valueX","valueY","handleChange","value","axis","num","parseInt","isNaN","next","props","label"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,IAAT,QAAqB,QAArB;AAEA;AACA;AACA;;AACA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,SACCC,WAAW,IAAIC,eADhB,EAECC,cAFD,QAGO,mCAHP;AAIA,SAASC,oBAAT,QAAqC,SAArC;AAEA,MAAMC,eAAe,GAAG,CAAxB;AACA,MAAMC,eAAe,GAAG,GAAxB;AAEA,eAAe,SAASC,wBAAT,OAMX;AAAA,MAN8C;AACjDC,IAAAA,QAAQ,GAAGT,IADsC;AAEjDU,IAAAA,WAAW,GAAG;AACbC,MAAAA,CAAC,EAAE,GADU;AAEbC,MAAAA,CAAC,EAAE;AAFU;AAFmC,GAM9C;AACH,QAAMC,MAAM,GAAGR,oBAAoB,CAAEK,WAAW,CAACC,CAAd,CAAnC;AACA,QAAMG,MAAM,GAAGT,oBAAoB,CAAEK,WAAW,CAACE,CAAd,CAAnC;;AAEA,QAAMG,YAAY,GAAG,CAAEC,KAAF,EAASC,IAAT,KAAmB;AACvC,UAAMC,GAAG,GAAGC,QAAQ,CAAEH,KAAF,EAAS,EAAT,CAApB;;AAEA,QAAK,CAAEI,KAAK,CAAEF,GAAF,CAAZ,EAAsB;AACrBT,MAAAA,QAAQ,CAAE,EAAE,GAAGC,WAAL;AAAkB,SAAEO,IAAF,GAAUC,GAAG,GAAG;AAAlC,OAAF,CAAR;AACA;AACD,GAND;;AAQA,SACC,cAAC,cAAD;AAAgB,IAAA,SAAS,EAAC;AAA1B,KACC,cAAC,WAAD;AACC,IAAA,KAAK,EAAGjB,EAAE,CAAE,MAAF,CADX;AAEC,IAAA,KAAK,EAAGY,MAFT;AAGC,IAAA,QAAQ,EAAKQ,IAAF,IAAYN,YAAY,CAAEM,IAAF,EAAQ,GAAR,CAHpC;AAIC,IAAA,aAAa,EAAC;AAJf,IADD,EAOC,cAAC,WAAD;AACC,IAAA,KAAK,EAAGpB,EAAE,CAAE,KAAF,CADX;AAEC,IAAA,KAAK,EAAGa,MAFT;AAGC,IAAA,QAAQ,EAAKO,IAAF,IAAYN,YAAY,CAAEM,IAAF,EAAQ,GAAR,CAHpC;AAIC,IAAA,aAAa,EAAC;AAJf,IAPD,CADD;AAgBA;;AAED,SAASnB,WAAT,CAAsBoB,KAAtB,EAA8B;AAC7B,SACC,cAAC,eAAD;AACC,IAAA,SAAS,EAAC,oDADX;AAEC,IAAA,aAAa,EAAC,KAFf;AAGC,IAAA,GAAG,EAAGf,eAHP;AAIC,IAAA,GAAG,EAAGD,eAJP;AAKC,IAAA,IAAI,EAAC,GALN;AAMC,IAAA,KAAK,EAAG,CAAE;AAAEU,MAAAA,KAAK,EAAE,GAAT;AAAcO,MAAAA,KAAK,EAAE;AAArB,KAAF;AANT,KAOMD,KAPN,EADD;AAWA","sourcesContent":["/**\n * External dependencies\n */\nimport { noop } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport {\n\tUnitControl as BaseUnitControl,\n\tControlWrapper,\n} from './styles/focal-point-picker-style';\nimport { fractionToPercentage } from './utils';\n\nconst TEXTCONTROL_MIN = 0;\nconst TEXTCONTROL_MAX = 100;\n\nexport default function FocalPointPickerControls( {\n\tonChange = noop,\n\tpercentages = {\n\t\tx: 0.5,\n\t\ty: 0.5,\n\t},\n} ) {\n\tconst valueX = fractionToPercentage( percentages.x );\n\tconst valueY = fractionToPercentage( percentages.y );\n\n\tconst handleChange = ( value, axis ) => {\n\t\tconst num = parseInt( value, 10 );\n\n\t\tif ( ! isNaN( num ) ) {\n\t\t\tonChange( { ...percentages, [ axis ]: num / 100 } );\n\t\t}\n\t};\n\n\treturn (\n\t\t<ControlWrapper className=\"focal-point-picker__controls\">\n\t\t\t<UnitControl\n\t\t\t\tlabel={ __( 'Left' ) }\n\t\t\t\tvalue={ valueX }\n\t\t\t\tonChange={ ( next ) => handleChange( next, 'x' ) }\n\t\t\t\tdragDirection=\"e\"\n\t\t\t/>\n\t\t\t<UnitControl\n\t\t\t\tlabel={ __( 'Top' ) }\n\t\t\t\tvalue={ valueY }\n\t\t\t\tonChange={ ( next ) => handleChange( next, 'y' ) }\n\t\t\t\tdragDirection=\"s\"\n\t\t\t/>\n\t\t</ControlWrapper>\n\t);\n}\n\nfunction UnitControl( props ) {\n\treturn (\n\t\t<BaseUnitControl\n\t\t\tclassName=\"focal-point-picker__controls-position-unit-control\"\n\t\t\tlabelPosition=\"top\"\n\t\t\tmax={ TEXTCONTROL_MAX }\n\t\t\tmin={ TEXTCONTROL_MIN }\n\t\t\tunit=\"%\"\n\t\t\tunits={ [ { value: '%', label: '%' } ] }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/focal-point-picker/controls.js"],"names":["noop","__","UnitControl","BaseUnitControl","ControlWrapper","fractionToPercentage","TEXTCONTROL_MIN","TEXTCONTROL_MAX","FocalPointPickerControls","onChange","percentages","x","y","valueX","valueY","handleChange","value","axis","num","parseInt","isNaN","join","next","props","label"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,IAAT,QAAqB,QAArB;AAEA;AACA;AACA;;AACA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,SACCC,WAAW,IAAIC,eADhB,EAECC,cAFD,QAGO,mCAHP;AAIA,SAASC,oBAAT,QAAqC,SAArC;AAEA,MAAMC,eAAe,GAAG,CAAxB;AACA,MAAMC,eAAe,GAAG,GAAxB;AAEA,eAAe,SAASC,wBAAT,OAMX;AAAA,MAN8C;AACjDC,IAAAA,QAAQ,GAAGT,IADsC;AAEjDU,IAAAA,WAAW,GAAG;AACbC,MAAAA,CAAC,EAAE,GADU;AAEbC,MAAAA,CAAC,EAAE;AAFU;AAFmC,GAM9C;AACH,QAAMC,MAAM,GAAGR,oBAAoB,CAAEK,WAAW,CAACC,CAAd,CAAnC;AACA,QAAMG,MAAM,GAAGT,oBAAoB,CAAEK,WAAW,CAACE,CAAd,CAAnC;;AAEA,QAAMG,YAAY,GAAG,CAAEC,KAAF,EAASC,IAAT,KAAmB;AACvC,UAAMC,GAAG,GAAGC,QAAQ,CAAEH,KAAF,EAAS,EAAT,CAApB;;AAEA,QAAK,CAAEI,KAAK,CAAEF,GAAF,CAAZ,EAAsB;AACrBT,MAAAA,QAAQ,CAAE,EAAE,GAAGC,WAAL;AAAkB,SAAEO,IAAF,GAAUC,GAAG,GAAG;AAAlC,OAAF,CAAR;AACA;AACD,GAND;;AAQA,SACC,cAAC,cAAD;AAAgB,IAAA,SAAS,EAAC;AAA1B,KACC,cAAC,WAAD;AACC,IAAA,KAAK,EAAGjB,EAAE,CAAE,MAAF,CADX;AAEC,IAAA,KAAK,EAAG,CAAEY,MAAF,EAAU,GAAV,EAAgBQ,IAAhB,CAAsB,EAAtB,CAFT;AAGC,IAAA,QAAQ,EAAKC,IAAF,IAAYP,YAAY,CAAEO,IAAF,EAAQ,GAAR,CAHpC;AAIC,IAAA,aAAa,EAAC;AAJf,IADD,EAOC,cAAC,WAAD;AACC,IAAA,KAAK,EAAGrB,EAAE,CAAE,KAAF,CADX;AAEC,IAAA,KAAK,EAAG,CAAEa,MAAF,EAAU,GAAV,EAAgBO,IAAhB,CAAsB,EAAtB,CAFT;AAGC,IAAA,QAAQ,EAAKC,IAAF,IAAYP,YAAY,CAAEO,IAAF,EAAQ,GAAR,CAHpC;AAIC,IAAA,aAAa,EAAC;AAJf,IAPD,CADD;AAgBA;;AAED,SAASpB,WAAT,CAAsBqB,KAAtB,EAA8B;AAC7B,SACC,cAAC,eAAD;AACC,IAAA,SAAS,EAAC,oDADX;AAEC,IAAA,aAAa,EAAC,KAFf;AAGC,IAAA,GAAG,EAAGhB,eAHP;AAIC,IAAA,GAAG,EAAGD,eAJP;AAKC,IAAA,KAAK,EAAG,CAAE;AAAEU,MAAAA,KAAK,EAAE,GAAT;AAAcQ,MAAAA,KAAK,EAAE;AAArB,KAAF;AALT,KAMMD,KANN,EADD;AAUA","sourcesContent":["/**\n * External dependencies\n */\nimport { noop } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport {\n\tUnitControl as BaseUnitControl,\n\tControlWrapper,\n} from './styles/focal-point-picker-style';\nimport { fractionToPercentage } from './utils';\n\nconst TEXTCONTROL_MIN = 0;\nconst TEXTCONTROL_MAX = 100;\n\nexport default function FocalPointPickerControls( {\n\tonChange = noop,\n\tpercentages = {\n\t\tx: 0.5,\n\t\ty: 0.5,\n\t},\n} ) {\n\tconst valueX = fractionToPercentage( percentages.x );\n\tconst valueY = fractionToPercentage( percentages.y );\n\n\tconst handleChange = ( value, axis ) => {\n\t\tconst num = parseInt( value, 10 );\n\n\t\tif ( ! isNaN( num ) ) {\n\t\t\tonChange( { ...percentages, [ axis ]: num / 100 } );\n\t\t}\n\t};\n\n\treturn (\n\t\t<ControlWrapper className=\"focal-point-picker__controls\">\n\t\t\t<UnitControl\n\t\t\t\tlabel={ __( 'Left' ) }\n\t\t\t\tvalue={ [ valueX, '%' ].join( '' ) }\n\t\t\t\tonChange={ ( next ) => handleChange( next, 'x' ) }\n\t\t\t\tdragDirection=\"e\"\n\t\t\t/>\n\t\t\t<UnitControl\n\t\t\t\tlabel={ __( 'Top' ) }\n\t\t\t\tvalue={ [ valueY, '%' ].join( '' ) }\n\t\t\t\tonChange={ ( next ) => handleChange( next, 'y' ) }\n\t\t\t\tdragDirection=\"s\"\n\t\t\t/>\n\t\t</ControlWrapper>\n\t);\n}\n\nfunction UnitControl( props ) {\n\treturn (\n\t\t<BaseUnitControl\n\t\t\tclassName=\"focal-point-picker__controls-position-unit-control\"\n\t\t\tlabelPosition=\"top\"\n\t\t\tmax={ TEXTCONTROL_MAX }\n\t\t\tmin={ TEXTCONTROL_MIN }\n\t\t\tunits={ [ { value: '%', label: '%' } ] }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n"]}
@@ -17,6 +17,7 @@ function FormFileUpload(_ref) {
17
17
  children,
18
18
  multiple = false,
19
19
  onChange,
20
+ onClick,
20
21
  render,
21
22
  ...props
22
23
  } = _ref;
@@ -41,7 +42,9 @@ function FormFileUpload(_ref) {
41
42
  display: 'none'
42
43
  },
43
44
  accept: accept,
44
- onChange: onChange
45
+ onChange: onChange,
46
+ onClick: onClick,
47
+ "data-testid": "form-file-upload-input"
45
48
  }));
46
49
  }
47
50
 
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/form-file-upload/index.js"],"names":["useRef","Button","FormFileUpload","accept","children","multiple","onChange","render","props","ref","openFileDialog","current","click","ui","display"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,MAAT,QAAuB,oBAAvB;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,WAAnB;;AAEA,SAASC,cAAT,OAOI;AAAA,MAPqB;AACxBC,IAAAA,MADwB;AAExBC,IAAAA,QAFwB;AAGxBC,IAAAA,QAAQ,GAAG,KAHa;AAIxBC,IAAAA,QAJwB;AAKxBC,IAAAA,MALwB;AAMxB,OAAGC;AANqB,GAOrB;AACH,QAAMC,GAAG,GAAGT,MAAM,EAAlB;;AACA,QAAMU,cAAc,GAAG,MAAM;AAC5BD,IAAAA,GAAG,CAACE,OAAJ,CAAYC,KAAZ;AACA,GAFD;;AAIA,QAAMC,EAAE,GAAGN,MAAM,GAChBA,MAAM,CAAE;AAAEG,IAAAA;AAAF,GAAF,CADU,GAGhB,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAGA;AAAlB,KAAwCF,KAAxC,GACGJ,QADH,CAHD;AAOA,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGS,EADH,EAEC;AACC,IAAA,IAAI,EAAC,MADN;AAEC,IAAA,GAAG,EAAGJ,GAFP;AAGC,IAAA,QAAQ,EAAGJ,QAHZ;AAIC,IAAA,KAAK,EAAG;AAAES,MAAAA,OAAO,EAAE;AAAX,KAJT;AAKC,IAAA,MAAM,EAAGX,MALV;AAMC,IAAA,QAAQ,EAAGG;AANZ,IAFD,CADD;AAaA;;AAED,eAAeJ,cAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\n\nfunction FormFileUpload( {\n\taccept,\n\tchildren,\n\tmultiple = false,\n\tonChange,\n\trender,\n\t...props\n} ) {\n\tconst ref = useRef();\n\tconst openFileDialog = () => {\n\t\tref.current.click();\n\t};\n\n\tconst ui = render ? (\n\t\trender( { openFileDialog } )\n\t) : (\n\t\t<Button onClick={ openFileDialog } { ...props }>\n\t\t\t{ children }\n\t\t</Button>\n\t);\n\treturn (\n\t\t<div className=\"components-form-file-upload\">\n\t\t\t{ ui }\n\t\t\t<input\n\t\t\t\ttype=\"file\"\n\t\t\t\tref={ ref }\n\t\t\t\tmultiple={ multiple }\n\t\t\t\tstyle={ { display: 'none' } }\n\t\t\t\taccept={ accept }\n\t\t\t\tonChange={ onChange }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nexport default FormFileUpload;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/form-file-upload/index.js"],"names":["useRef","Button","FormFileUpload","accept","children","multiple","onChange","onClick","render","props","ref","openFileDialog","current","click","ui","display"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,MAAT,QAAuB,oBAAvB;AAEA;AACA;AACA;;AACA,OAAOC,MAAP,MAAmB,WAAnB;;AAEA,SAASC,cAAT,OAQI;AAAA,MARqB;AACxBC,IAAAA,MADwB;AAExBC,IAAAA,QAFwB;AAGxBC,IAAAA,QAAQ,GAAG,KAHa;AAIxBC,IAAAA,QAJwB;AAKxBC,IAAAA,OALwB;AAMxBC,IAAAA,MANwB;AAOxB,OAAGC;AAPqB,GAQrB;AACH,QAAMC,GAAG,GAAGV,MAAM,EAAlB;;AACA,QAAMW,cAAc,GAAG,MAAM;AAC5BD,IAAAA,GAAG,CAACE,OAAJ,CAAYC,KAAZ;AACA,GAFD;;AAIA,QAAMC,EAAE,GAAGN,MAAM,GAChBA,MAAM,CAAE;AAAEG,IAAAA;AAAF,GAAF,CADU,GAGhB,cAAC,MAAD;AAAQ,IAAA,OAAO,EAAGA;AAAlB,KAAwCF,KAAxC,GACGL,QADH,CAHD;AAOA,SACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGU,EADH,EAEC;AACC,IAAA,IAAI,EAAC,MADN;AAEC,IAAA,GAAG,EAAGJ,GAFP;AAGC,IAAA,QAAQ,EAAGL,QAHZ;AAIC,IAAA,KAAK,EAAG;AAAEU,MAAAA,OAAO,EAAE;AAAX,KAJT;AAKC,IAAA,MAAM,EAAGZ,MALV;AAMC,IAAA,QAAQ,EAAGG,QANZ;AAOC,IAAA,OAAO,EAAGC,OAPX;AAQC,mBAAY;AARb,IAFD,CADD;AAeA;;AAED,eAAeL,cAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\n\nfunction FormFileUpload( {\n\taccept,\n\tchildren,\n\tmultiple = false,\n\tonChange,\n\tonClick,\n\trender,\n\t...props\n} ) {\n\tconst ref = useRef();\n\tconst openFileDialog = () => {\n\t\tref.current.click();\n\t};\n\n\tconst ui = render ? (\n\t\trender( { openFileDialog } )\n\t) : (\n\t\t<Button onClick={ openFileDialog } { ...props }>\n\t\t\t{ children }\n\t\t</Button>\n\t);\n\treturn (\n\t\t<div className=\"components-form-file-upload\">\n\t\t\t{ ui }\n\t\t\t<input\n\t\t\t\ttype=\"file\"\n\t\t\t\tref={ ref }\n\t\t\t\tmultiple={ multiple }\n\t\t\t\tstyle={ { display: 'none' } }\n\t\t\t\taccept={ accept }\n\t\t\t\tonChange={ onChange }\n\t\t\t\tonClick={ onClick }\n\t\t\t\tdata-testid=\"form-file-upload-input\"\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nexport default FormFileUpload;\n"]}
@@ -7,6 +7,8 @@ export { __unstableMotion } from './animation';
7
7
  export { default as AnglePickerControl } from './angle-picker-control';
8
8
  export { default as Autocomplete, useAutocompleteProps as __unstableUseAutocompleteProps } from './autocomplete';
9
9
  export { default as BaseControl } from './base-control';
10
+ export { BorderBoxControl as __experimentalBorderBoxControl, hasSplitBorders as __experimentalHasSplitBorders, isDefinedBorder as __experimentalIsDefinedBorder, isEmptyBorder as __experimentalIsEmptyBorder } from './border-box-control';
11
+ export { BorderControl as __experimentalBorderControl } from './border-control';
10
12
  export { default as __experimentalBoxControl } from './box-control';
11
13
  export { default as Button } from './button';
12
14
  export { default as ButtonGroup } from './button-group';
@@ -99,7 +101,7 @@ export { default as TextareaControl } from './textarea-control';
99
101
  export { default as TextHighlight } from './text-highlight';
100
102
  export { default as Tip } from './tip';
101
103
  export { default as ToggleControl } from './toggle-control';
102
- export { ToggleGroupControl as __experimentalToggleGroupControl, ToggleGroupControlOption as __experimentalToggleGroupControlOption } from './toggle-group-control';
104
+ export { ToggleGroupControl as __experimentalToggleGroupControl, ToggleGroupControlOption as __experimentalToggleGroupControlOption, ToggleGroupControlOptionIcon as __experimentalToggleGroupControlOptionIcon } from './toggle-group-control';
103
105
  export { default as Toolbar } from './toolbar';
104
106
  export { default as ToolbarButton } from './toolbar-button';
105
107
  export { default as ToolbarDropdownMenu } from './toolbar-dropdown-menu';