@wordpress/components 25.14.0 → 25.15.1-next.79a6196f.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 (568) hide show
  1. package/CHANGELOG.md +51 -0
  2. package/CONTRIBUTING.md +57 -115
  3. package/LICENSE.md +1 -1
  4. package/build/base-control/index.js +17 -13
  5. package/build/base-control/index.js.map +1 -1
  6. package/build/border-box-control/border-box-control-linked-button/component.js +1 -1
  7. package/build/border-box-control/border-box-control-linked-button/component.js.map +1 -1
  8. package/build/border-control/border-control-style-picker/component.js +1 -1
  9. package/build/border-control/border-control-style-picker/component.js.map +1 -1
  10. package/build/box-control/index.js +1 -1
  11. package/build/box-control/index.js.map +1 -1
  12. package/build/box-control/linked-button.js +1 -1
  13. package/build/box-control/linked-button.js.map +1 -1
  14. package/build/button/index.js +1 -1
  15. package/build/button/index.js.map +1 -1
  16. package/build/color-palette/index.native.js +11 -7
  17. package/build/color-palette/index.native.js.map +1 -1
  18. package/build/color-picker/color-copy-button.js +1 -1
  19. package/build/color-picker/color-copy-button.js.map +1 -1
  20. package/build/context/wordpress-component.js.map +1 -1
  21. package/build/custom-select-control-v2/index.js +11 -10
  22. package/build/custom-select-control-v2/index.js.map +1 -1
  23. package/build/date-time/date/styles.js +8 -8
  24. package/build/date-time/date/styles.js.map +1 -1
  25. package/build/dropdown-menu-v2/index.js +205 -159
  26. package/build/dropdown-menu-v2/index.js.map +1 -1
  27. package/build/dropdown-menu-v2/styles.js +86 -77
  28. package/build/dropdown-menu-v2/styles.js.map +1 -1
  29. package/build/dropdown-menu-v2/types.js.map +1 -1
  30. package/build/duotone-picker/duotone-picker.js +4 -3
  31. package/build/duotone-picker/duotone-picker.js.map +1 -1
  32. package/build/font-size-picker/index.js +4 -2
  33. package/build/font-size-picker/index.js.map +1 -1
  34. package/build/font-size-picker/index.native.js +6 -3
  35. package/build/font-size-picker/index.native.js.map +1 -1
  36. package/build/form-token-field/index.js +10 -5
  37. package/build/form-token-field/index.js.map +1 -1
  38. package/build/form-token-field/token.js +1 -0
  39. package/build/form-token-field/token.js.map +1 -1
  40. package/build/gradient-picker/index.js +3 -2
  41. package/build/gradient-picker/index.js.map +1 -1
  42. package/build/index.native.js +20 -3
  43. package/build/index.native.js.map +1 -1
  44. package/build/input-control/styles/input-control-styles.js +32 -29
  45. package/build/input-control/styles/input-control-styles.js.map +1 -1
  46. package/build/input-control/types.js.map +1 -1
  47. package/build/lock-unlock.js +18 -0
  48. package/build/lock-unlock.js.map +1 -0
  49. package/build/mobile/bottom-sheet/index.native.js +8 -0
  50. package/build/mobile/bottom-sheet/index.native.js.map +1 -1
  51. package/build/mobile/color-settings/palette.screen.native.js +8 -4
  52. package/build/mobile/color-settings/palette.screen.native.js.map +1 -1
  53. package/build/mobile/global-styles-context/utils.native.js +26 -13
  54. package/build/mobile/global-styles-context/utils.native.js.map +1 -1
  55. package/build/mobile/image/constants.js +12 -0
  56. package/build/mobile/image/constants.js.map +1 -0
  57. package/build/mobile/image/index.native.js +26 -18
  58. package/build/mobile/image/index.native.js.map +1 -1
  59. package/build/mobile/keyboard-aware-flat-list/index.android.js +40 -8
  60. package/build/mobile/keyboard-aware-flat-list/index.android.js.map +1 -1
  61. package/build/mobile/keyboard-aware-flat-list/index.ios.js +44 -68
  62. package/build/mobile/keyboard-aware-flat-list/index.ios.js.map +1 -1
  63. package/build/mobile/keyboard-aware-flat-list/use-scroll-to-element.native.js +39 -0
  64. package/build/mobile/keyboard-aware-flat-list/use-scroll-to-element.native.js.map +1 -0
  65. package/build/mobile/keyboard-aware-flat-list/{use-scroll-to-text-input.native.js → use-scroll-to-section.native.js} +22 -29
  66. package/build/mobile/keyboard-aware-flat-list/use-scroll-to-section.native.js.map +1 -0
  67. package/build/mobile/keyboard-aware-flat-list/use-scroll.native.js +93 -0
  68. package/build/mobile/keyboard-aware-flat-list/use-scroll.native.js.map +1 -0
  69. package/build/mobile/utils/get-px-from-css-unit.native.js +302 -0
  70. package/build/mobile/utils/get-px-from-css-unit.native.js.map +1 -0
  71. package/build/modal/index.js +18 -13
  72. package/build/modal/index.js.map +1 -1
  73. package/build/navigation/menu/menu-title.js +1 -1
  74. package/build/navigation/menu/menu-title.js.map +1 -1
  75. package/build/navigator/navigator-provider/component.js +13 -15
  76. package/build/navigator/navigator-provider/component.js.map +1 -1
  77. package/build/navigator/navigator-screen/component.js +23 -63
  78. package/build/navigator/navigator-screen/component.js.map +1 -1
  79. package/build/navigator/styles.js +52 -0
  80. package/build/navigator/styles.js.map +1 -0
  81. package/build/number-control/index.js +4 -8
  82. package/build/number-control/index.js.map +1 -1
  83. package/build/number-control/types.js.map +1 -1
  84. package/build/palette-edit/index.js +15 -54
  85. package/build/palette-edit/index.js.map +1 -1
  86. package/build/private-apis.js +11 -26
  87. package/build/private-apis.js.map +1 -1
  88. package/build/private-apis.native.js +21 -0
  89. package/build/private-apis.native.js.map +1 -0
  90. package/build/radio-control/index.js +1 -0
  91. package/build/radio-control/index.js.map +1 -1
  92. package/build/range-control/index.js +1 -1
  93. package/build/range-control/index.js.map +1 -1
  94. package/build/select-control/styles/select-control-styles.js +15 -25
  95. package/build/select-control/styles/select-control-styles.js.map +1 -1
  96. package/build/slot-fill/index.js +3 -2
  97. package/build/slot-fill/index.js.map +1 -1
  98. package/build/slot-fill/types.js.map +1 -1
  99. package/build/snackbar/types.js.map +1 -1
  100. package/build/tabs/styles.js +3 -3
  101. package/build/tabs/styles.js.map +1 -1
  102. package/build/tabs/tabpanel.js +9 -7
  103. package/build/tabs/tabpanel.js.map +1 -1
  104. package/build/toggle-group-control/toggle-group-control/component.js +4 -4
  105. package/build/toggle-group-control/toggle-group-control/component.js.map +1 -1
  106. package/build/toggle-group-control/toggle-group-control/styles.js +29 -15
  107. package/build/toggle-group-control/toggle-group-control/styles.js.map +1 -1
  108. package/build/toggle-group-control/toggle-group-control-option-base/styles.js +9 -9
  109. package/build/toggle-group-control/toggle-group-control-option-base/styles.js.map +1 -1
  110. package/build/tools-panel/tools-panel/component.js +3 -1
  111. package/build/tools-panel/tools-panel/component.js.map +1 -1
  112. package/build/tools-panel/tools-panel-header/component.js +9 -8
  113. package/build/tools-panel/tools-panel-header/component.js.map +1 -1
  114. package/build/tools-panel/types.js.map +1 -1
  115. package/build/tooltip/index.js +34 -10
  116. package/build/tooltip/index.js.map +1 -1
  117. package/build/tooltip/types.js.map +1 -1
  118. package/build/truncate/hook.js +10 -4
  119. package/build/truncate/hook.js.map +1 -1
  120. package/build/truncate/types.js.map +1 -1
  121. package/build/unit-control/index.js +1 -1
  122. package/build/unit-control/index.js.map +1 -1
  123. package/build/utils/strings.js +34 -3
  124. package/build/utils/strings.js.map +1 -1
  125. package/build-module/base-control/index.js +16 -12
  126. package/build-module/base-control/index.js.map +1 -1
  127. package/build-module/border-box-control/border-box-control-linked-button/component.js +1 -1
  128. package/build-module/border-box-control/border-box-control-linked-button/component.js.map +1 -1
  129. package/build-module/border-control/border-control-style-picker/component.js +1 -1
  130. package/build-module/border-control/border-control-style-picker/component.js.map +1 -1
  131. package/build-module/box-control/index.js +1 -1
  132. package/build-module/box-control/index.js.map +1 -1
  133. package/build-module/box-control/linked-button.js +1 -1
  134. package/build-module/box-control/linked-button.js.map +1 -1
  135. package/build-module/button/index.js +1 -1
  136. package/build-module/button/index.js.map +1 -1
  137. package/build-module/color-palette/index.native.js +11 -7
  138. package/build-module/color-palette/index.native.js.map +1 -1
  139. package/build-module/color-picker/color-copy-button.js +1 -1
  140. package/build-module/color-picker/color-copy-button.js.map +1 -1
  141. package/build-module/context/wordpress-component.js.map +1 -1
  142. package/build-module/custom-select-control-v2/index.js +11 -10
  143. package/build-module/custom-select-control-v2/index.js.map +1 -1
  144. package/build-module/date-time/date/styles.js +8 -8
  145. package/build-module/date-time/date/styles.js.map +1 -1
  146. package/build-module/dropdown-menu-v2/index.js +201 -154
  147. package/build-module/dropdown-menu-v2/index.js.map +1 -1
  148. package/build-module/dropdown-menu-v2/styles.js +68 -61
  149. package/build-module/dropdown-menu-v2/styles.js.map +1 -1
  150. package/build-module/dropdown-menu-v2/types.js.map +1 -1
  151. package/build-module/duotone-picker/duotone-picker.js +4 -3
  152. package/build-module/duotone-picker/duotone-picker.js.map +1 -1
  153. package/build-module/font-size-picker/index.js +4 -2
  154. package/build-module/font-size-picker/index.js.map +1 -1
  155. package/build-module/font-size-picker/index.native.js +5 -2
  156. package/build-module/font-size-picker/index.native.js.map +1 -1
  157. package/build-module/form-token-field/index.js +10 -5
  158. package/build-module/form-token-field/index.js.map +1 -1
  159. package/build-module/form-token-field/token.js +1 -0
  160. package/build-module/form-token-field/token.js.map +1 -1
  161. package/build-module/gradient-picker/index.js +3 -2
  162. package/build-module/gradient-picker/index.js.map +1 -1
  163. package/build-module/index.native.js +6 -1
  164. package/build-module/index.native.js.map +1 -1
  165. package/build-module/input-control/styles/input-control-styles.js +31 -29
  166. package/build-module/input-control/styles/input-control-styles.js.map +1 -1
  167. package/build-module/input-control/types.js.map +1 -1
  168. package/build-module/lock-unlock.js +9 -0
  169. package/build-module/lock-unlock.js.map +1 -0
  170. package/build-module/mobile/bottom-sheet/index.native.js +9 -1
  171. package/build-module/mobile/bottom-sheet/index.native.js.map +1 -1
  172. package/build-module/mobile/color-settings/palette.screen.native.js +8 -4
  173. package/build-module/mobile/color-settings/palette.screen.native.js.map +1 -1
  174. package/build-module/mobile/global-styles-context/utils.native.js +25 -13
  175. package/build-module/mobile/global-styles-context/utils.native.js.map +1 -1
  176. package/build-module/mobile/image/constants.js +5 -0
  177. package/build-module/mobile/image/constants.js.map +1 -0
  178. package/build-module/mobile/image/index.native.js +25 -16
  179. package/build-module/mobile/image/index.native.js.map +1 -1
  180. package/build-module/mobile/keyboard-aware-flat-list/index.android.js +40 -6
  181. package/build-module/mobile/keyboard-aware-flat-list/index.android.js.map +1 -1
  182. package/build-module/mobile/keyboard-aware-flat-list/index.ios.js +46 -68
  183. package/build-module/mobile/keyboard-aware-flat-list/index.ios.js.map +1 -1
  184. package/build-module/mobile/keyboard-aware-flat-list/use-scroll-to-element.native.js +33 -0
  185. package/build-module/mobile/keyboard-aware-flat-list/use-scroll-to-element.native.js.map +1 -0
  186. package/build-module/mobile/keyboard-aware-flat-list/{use-scroll-to-text-input.native.js → use-scroll-to-section.native.js} +21 -27
  187. package/build-module/mobile/keyboard-aware-flat-list/use-scroll-to-section.native.js.map +1 -0
  188. package/build-module/mobile/keyboard-aware-flat-list/use-scroll.native.js +86 -0
  189. package/build-module/mobile/keyboard-aware-flat-list/use-scroll.native.js.map +1 -0
  190. package/build-module/mobile/utils/get-px-from-css-unit.native.js +294 -0
  191. package/build-module/mobile/utils/get-px-from-css-unit.native.js.map +1 -0
  192. package/build-module/modal/index.js +18 -13
  193. package/build-module/modal/index.js.map +1 -1
  194. package/build-module/navigation/menu/menu-title.js +1 -1
  195. package/build-module/navigation/menu/menu-title.js.map +1 -1
  196. package/build-module/navigator/navigator-provider/component.js +3 -16
  197. package/build-module/navigator/navigator-provider/component.js.map +1 -1
  198. package/build-module/navigator/navigator-screen/component.js +16 -70
  199. package/build-module/navigator/navigator-screen/component.js.map +1 -1
  200. package/build-module/navigator/styles.js +47 -0
  201. package/build-module/navigator/styles.js.map +1 -0
  202. package/build-module/number-control/index.js +4 -8
  203. package/build-module/number-control/index.js.map +1 -1
  204. package/build-module/number-control/types.js.map +1 -1
  205. package/build-module/palette-edit/index.js +15 -51
  206. package/build-module/palette-edit/index.js.map +1 -1
  207. package/build-module/private-apis.js +10 -23
  208. package/build-module/private-apis.js.map +1 -1
  209. package/build-module/private-apis.native.js +14 -0
  210. package/build-module/private-apis.native.js.map +1 -0
  211. package/build-module/radio-control/index.js +1 -0
  212. package/build-module/radio-control/index.js.map +1 -1
  213. package/build-module/range-control/index.js +1 -1
  214. package/build-module/range-control/index.js.map +1 -1
  215. package/build-module/select-control/styles/select-control-styles.js +15 -25
  216. package/build-module/select-control/styles/select-control-styles.js.map +1 -1
  217. package/build-module/slot-fill/index.js +3 -2
  218. package/build-module/slot-fill/index.js.map +1 -1
  219. package/build-module/slot-fill/types.js.map +1 -1
  220. package/build-module/snackbar/types.js.map +1 -1
  221. package/build-module/tabs/styles.js +3 -3
  222. package/build-module/tabs/styles.js.map +1 -1
  223. package/build-module/tabs/tabpanel.js +9 -7
  224. package/build-module/tabs/tabpanel.js.map +1 -1
  225. package/build-module/toggle-group-control/toggle-group-control/component.js +4 -4
  226. package/build-module/toggle-group-control/toggle-group-control/component.js.map +1 -1
  227. package/build-module/toggle-group-control/toggle-group-control/styles.js +29 -15
  228. package/build-module/toggle-group-control/toggle-group-control/styles.js.map +1 -1
  229. package/build-module/toggle-group-control/toggle-group-control-option-base/styles.js +9 -9
  230. package/build-module/toggle-group-control/toggle-group-control-option-base/styles.js.map +1 -1
  231. package/build-module/tools-panel/tools-panel/component.js +3 -1
  232. package/build-module/tools-panel/tools-panel/component.js.map +1 -1
  233. package/build-module/tools-panel/tools-panel-header/component.js +9 -8
  234. package/build-module/tools-panel/tools-panel-header/component.js.map +1 -1
  235. package/build-module/tools-panel/types.js.map +1 -1
  236. package/build-module/tooltip/index.js +34 -12
  237. package/build-module/tooltip/index.js.map +1 -1
  238. package/build-module/tooltip/types.js.map +1 -1
  239. package/build-module/truncate/hook.js +10 -4
  240. package/build-module/truncate/hook.js.map +1 -1
  241. package/build-module/truncate/types.js.map +1 -1
  242. package/build-module/unit-control/index.js +1 -1
  243. package/build-module/unit-control/index.js.map +1 -1
  244. package/build-module/utils/strings.js +32 -2
  245. package/build-module/utils/strings.js.map +1 -1
  246. package/build-style/style-rtl.css +29 -5
  247. package/build-style/style.css +29 -5
  248. package/build-types/base-control/index.d.ts +3 -27
  249. package/build-types/base-control/index.d.ts.map +1 -1
  250. package/build-types/base-control/stories/index.story.d.ts +4 -1
  251. package/build-types/base-control/stories/index.story.d.ts.map +1 -1
  252. package/build-types/border-box-control/border-box-control/hook.d.ts +4 -4
  253. package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts +6 -6
  254. package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts +4 -4
  255. package/build-types/border-box-control/border-box-control-visualizer/hook.d.ts +4 -4
  256. package/build-types/border-box-control/stories/index.story.d.ts +1 -1
  257. package/build-types/border-control/border-control/hook.d.ts +4 -4
  258. package/build-types/border-control/border-control-dropdown/hook.d.ts +4 -4
  259. package/build-types/border-control/border-control-style-picker/hook.d.ts +4 -4
  260. package/build-types/border-control/stories/index.story.d.ts +6 -6
  261. package/build-types/box-control/stories/index.story.d.ts +42 -42
  262. package/build-types/box-control/styles/box-control-styles.d.ts +1 -1
  263. package/build-types/button/deprecated.d.ts +3 -3
  264. package/build-types/card/card/hook.d.ts +4 -4
  265. package/build-types/card/card-body/hook.d.ts +4 -4
  266. package/build-types/card/card-divider/hook.d.ts +4 -4
  267. package/build-types/card/card-footer/hook.d.ts +4 -4
  268. package/build-types/card/card-header/hook.d.ts +4 -4
  269. package/build-types/card/card-media/hook.d.ts +4 -4
  270. package/build-types/color-palette/styles.d.ts +2 -2
  271. package/build-types/color-picker/component.d.ts +2 -2
  272. package/build-types/color-picker/stories/index.story.d.ts +1 -1
  273. package/build-types/color-picker/stories/index.story.d.ts.map +1 -1
  274. package/build-types/color-picker/styles.d.ts +3 -3
  275. package/build-types/composite/test/index.d.ts.map +1 -0
  276. package/build-types/context/wordpress-component.d.ts +3 -3
  277. package/build-types/context/wordpress-component.d.ts.map +1 -1
  278. package/build-types/custom-select-control-v2/index.d.ts +3 -2
  279. package/build-types/custom-select-control-v2/index.d.ts.map +1 -1
  280. package/build-types/custom-select-control-v2/stories/index.story.d.ts +4 -3
  281. package/build-types/custom-select-control-v2/stories/index.story.d.ts.map +1 -1
  282. package/build-types/date-time/date/styles.d.ts +3 -3
  283. package/build-types/date-time/date-time/styles.d.ts +1 -1
  284. package/build-types/date-time/time/styles.d.ts +4 -4
  285. package/build-types/dropdown/index.d.ts +1 -1
  286. package/build-types/dropdown/index.d.ts.map +1 -1
  287. package/build-types/dropdown/stories/index.story.d.ts +3 -3
  288. package/build-types/dropdown/stories/index.story.d.ts.map +1 -1
  289. package/build-types/dropdown-menu/index.d.ts +1 -1
  290. package/build-types/dropdown-menu/index.d.ts.map +1 -1
  291. package/build-types/dropdown-menu/stories/index.story.d.ts +2 -2
  292. package/build-types/dropdown-menu/stories/index.story.d.ts.map +1 -1
  293. package/build-types/dropdown-menu-v2/index.d.ts +18 -15
  294. package/build-types/dropdown-menu-v2/index.d.ts.map +1 -1
  295. package/build-types/dropdown-menu-v2/stories/index.story.d.ts +7 -2
  296. package/build-types/dropdown-menu-v2/stories/index.story.d.ts.map +1 -1
  297. package/build-types/dropdown-menu-v2/styles.d.ts +77 -23
  298. package/build-types/dropdown-menu-v2/styles.d.ts.map +1 -1
  299. package/build-types/dropdown-menu-v2/types.d.ts +89 -173
  300. package/build-types/dropdown-menu-v2/types.d.ts.map +1 -1
  301. package/build-types/duotone-picker/duotone-picker.d.ts.map +1 -1
  302. package/build-types/elevation/hook.d.ts +4 -4
  303. package/build-types/flex/flex/hook.d.ts +4 -4
  304. package/build-types/flex/flex-block/hook.d.ts +4 -4
  305. package/build-types/flex/flex-item/hook.d.ts +4 -4
  306. package/build-types/focal-point-picker/stories/index.story.d.ts +4 -4
  307. package/build-types/focal-point-picker/styles/focal-point-picker-style.d.ts +1 -1
  308. package/build-types/font-size-picker/index.d.ts.map +1 -1
  309. package/build-types/font-size-picker/styles.d.ts +1 -1
  310. package/build-types/form-token-field/index.d.ts.map +1 -1
  311. package/build-types/form-token-field/token.d.ts.map +1 -1
  312. package/build-types/grid/hook.d.ts +4 -4
  313. package/build-types/h-stack/hook.d.ts +4 -4
  314. package/build-types/heading/component.d.ts +1 -1
  315. package/build-types/heading/hook.d.ts +4 -4
  316. package/build-types/input-control/styles/input-control-styles.d.ts +11 -0
  317. package/build-types/input-control/styles/input-control-styles.d.ts.map +1 -1
  318. package/build-types/input-control/types.d.ts +1 -1
  319. package/build-types/input-control/types.d.ts.map +1 -1
  320. package/build-types/item-group/item/hook.d.ts +4 -4
  321. package/build-types/item-group/item-group/hook.d.ts +4 -4
  322. package/build-types/lock-unlock.d.ts +3 -0
  323. package/build-types/lock-unlock.d.ts.map +1 -0
  324. package/build-types/menu-item/index.d.ts +1 -1
  325. package/build-types/menu-item/stories/index.story.d.ts +4 -4
  326. package/build-types/mobile/image/constants.d.ts +5 -0
  327. package/build-types/mobile/image/constants.d.ts.map +1 -0
  328. package/build-types/modal/index.d.ts.map +1 -1
  329. package/build-types/navigation/styles/navigation-styles.d.ts +3 -3
  330. package/build-types/navigator/navigator-back-button/hook.d.ts +6 -6
  331. package/build-types/navigator/navigator-button/hook.d.ts +6 -6
  332. package/build-types/navigator/navigator-provider/component.d.ts.map +1 -1
  333. package/build-types/navigator/navigator-screen/component.d.ts +1 -7
  334. package/build-types/navigator/navigator-screen/component.d.ts.map +1 -1
  335. package/build-types/navigator/styles.d.ts +9 -0
  336. package/build-types/navigator/styles.d.ts.map +1 -0
  337. package/build-types/number-control/index.d.ts +1 -1
  338. package/build-types/number-control/index.d.ts.map +1 -1
  339. package/build-types/number-control/stories/index.story.d.ts +1 -1
  340. package/build-types/number-control/types.d.ts +1 -1
  341. package/build-types/palette-edit/index.d.ts +3 -8
  342. package/build-types/palette-edit/index.d.ts.map +1 -1
  343. package/build-types/palette-edit/styles.d.ts +3 -3
  344. package/build-types/popover/index.d.ts +1 -1
  345. package/build-types/popover/index.d.ts.map +1 -1
  346. package/build-types/popover/stories/e2e/index.story.d.ts +1 -1
  347. package/build-types/private-apis.d.ts +0 -1
  348. package/build-types/private-apis.d.ts.map +1 -1
  349. package/build-types/radio-control/index.d.ts.map +1 -1
  350. package/build-types/range-control/index.d.ts +1 -1
  351. package/build-types/range-control/styles/range-control-styles.d.ts +1 -1
  352. package/build-types/resizable-box/index.d.ts +1 -1
  353. package/build-types/resizable-box/resize-tooltip/index.d.ts +1 -1
  354. package/build-types/resizable-box/stories/index.story.d.ts +2 -2
  355. package/build-types/scrollable/hook.d.ts +4 -4
  356. package/build-types/search-control/index.d.ts +1 -1
  357. package/build-types/search-control/stories/index.story.d.ts +2 -2
  358. package/build-types/select-control/styles/select-control-styles.d.ts.map +1 -1
  359. package/build-types/slot-fill/index.d.ts +1 -1
  360. package/build-types/slot-fill/index.d.ts.map +1 -1
  361. package/build-types/slot-fill/types.d.ts +4 -0
  362. package/build-types/slot-fill/types.d.ts.map +1 -1
  363. package/build-types/snackbar/index.d.ts +2 -2
  364. package/build-types/snackbar/stories/index.story.d.ts +0 -3
  365. package/build-types/snackbar/stories/index.story.d.ts.map +1 -1
  366. package/build-types/snackbar/types.d.ts +1 -1
  367. package/build-types/snackbar/types.d.ts.map +1 -1
  368. package/build-types/spacer/hook.d.ts +4 -4
  369. package/build-types/surface/hook.d.ts +4 -4
  370. package/build-types/tabs/styles.d.ts.map +1 -1
  371. package/build-types/tabs/tabpanel.d.ts +1 -1
  372. package/build-types/tabs/tabpanel.d.ts.map +1 -1
  373. package/build-types/text/hook.d.ts +4 -4
  374. package/build-types/text-control/index.d.ts +1 -1
  375. package/build-types/textarea-control/index.d.ts +1 -1
  376. package/build-types/toggle-control/stories/index.story.d.ts +2 -2
  377. package/build-types/toggle-group-control/toggle-group-control/as-button-group.d.ts +1 -1
  378. package/build-types/toggle-group-control/toggle-group-control/as-radio-group.d.ts +1 -1
  379. package/build-types/toggle-group-control/toggle-group-control/component.d.ts.map +1 -1
  380. package/build-types/toggle-group-control/toggle-group-control/styles.d.ts +2 -2
  381. package/build-types/toggle-group-control/toggle-group-control/styles.d.ts.map +1 -1
  382. package/build-types/toggle-group-control/toggle-group-control-option/component.d.ts +1 -1
  383. package/build-types/toggle-group-control/toggle-group-control-option-base/component.d.ts +1 -1
  384. package/build-types/toggle-group-control/toggle-group-control-option-base/component.d.ts.map +1 -1
  385. package/build-types/toggle-group-control/toggle-group-control-option-base/styles.d.ts.map +1 -1
  386. package/build-types/toggle-group-control/toggle-group-control-option-icon/component.d.ts +1 -1
  387. package/build-types/toolbar/toolbar-button/index.d.ts +3 -3
  388. package/build-types/tools-panel/tools-panel/component.d.ts.map +1 -1
  389. package/build-types/tools-panel/tools-panel/hook.d.ts +5 -4
  390. package/build-types/tools-panel/tools-panel/hook.d.ts.map +1 -1
  391. package/build-types/tools-panel/tools-panel-header/component.d.ts.map +1 -1
  392. package/build-types/tools-panel/tools-panel-header/hook.d.ts +5 -4
  393. package/build-types/tools-panel/tools-panel-header/hook.d.ts.map +1 -1
  394. package/build-types/tools-panel/tools-panel-item/hook.d.ts +4 -4
  395. package/build-types/tools-panel/types.d.ts +9 -0
  396. package/build-types/tools-panel/types.d.ts.map +1 -1
  397. package/build-types/tooltip/index.d.ts +1 -1
  398. package/build-types/tooltip/index.d.ts.map +1 -1
  399. package/build-types/tooltip/stories/index.story.d.ts +10 -1
  400. package/build-types/tooltip/stories/index.story.d.ts.map +1 -1
  401. package/build-types/tooltip/types.d.ts +3 -0
  402. package/build-types/tooltip/types.d.ts.map +1 -1
  403. package/build-types/truncate/hook.d.ts +5 -5
  404. package/build-types/truncate/hook.d.ts.map +1 -1
  405. package/build-types/truncate/types.d.ts +4 -0
  406. package/build-types/truncate/types.d.ts.map +1 -1
  407. package/build-types/unit-control/index.d.ts +1 -1
  408. package/build-types/unit-control/styles/unit-control-styles.d.ts +1 -1
  409. package/build-types/utils/strings.d.ts +14 -2
  410. package/build-types/utils/strings.d.ts.map +1 -1
  411. package/build-types/v-stack/hook.d.ts +4 -4
  412. package/build-types/v-stack/stories/index.story.d.ts +1 -1
  413. package/package.json +20 -21
  414. package/src/alignment-matrix-control/test/index.tsx +10 -16
  415. package/src/base-control/index.tsx +21 -16
  416. package/src/border-box-control/border-box-control-linked-button/component.tsx +1 -1
  417. package/src/border-control/border-control-style-picker/component.tsx +1 -1
  418. package/src/box-control/index.tsx +1 -1
  419. package/src/box-control/linked-button.tsx +1 -1
  420. package/src/button/README.md +32 -6
  421. package/src/button/index.tsx +1 -1
  422. package/src/button-group/README.md +0 -6
  423. package/src/card/card/README.md +1 -1
  424. package/src/checkbox-control/README.md +1 -9
  425. package/src/color-palette/index.native.js +18 -7
  426. package/src/color-picker/color-copy-button.tsx +1 -1
  427. package/src/combobox-control/README.md +0 -6
  428. package/src/composite/test/index.tsx +576 -0
  429. package/src/context/wordpress-component.ts +11 -6
  430. package/src/custom-select-control/README.md +0 -6
  431. package/src/custom-select-control-v2/index.tsx +13 -12
  432. package/src/date-time/date/styles.ts +3 -3
  433. package/src/dropdown-menu/README.md +0 -5
  434. package/src/dropdown-menu-v2/README.md +75 -136
  435. package/src/dropdown-menu-v2/index.tsx +321 -231
  436. package/src/dropdown-menu-v2/stories/index.story.tsx +522 -126
  437. package/src/dropdown-menu-v2/styles.ts +226 -151
  438. package/src/dropdown-menu-v2/test/index.tsx +480 -188
  439. package/src/dropdown-menu-v2/types.ts +98 -184
  440. package/src/duotone-picker/duotone-picker.tsx +7 -3
  441. package/src/font-size-picker/index.native.js +8 -2
  442. package/src/font-size-picker/index.tsx +4 -2
  443. package/src/form-toggle/README.md +0 -6
  444. package/src/form-token-field/index.tsx +11 -7
  445. package/src/form-token-field/test/index.tsx +97 -0
  446. package/src/form-token-field/token.tsx +1 -0
  447. package/src/gradient-picker/index.tsx +2 -2
  448. package/src/index.native.js +6 -1
  449. package/src/input-control/styles/input-control-styles.tsx +10 -8
  450. package/src/input-control/types.ts +1 -1
  451. package/src/lock-unlock.js +10 -0
  452. package/src/menu-group/README.md +0 -8
  453. package/src/menu-items-choice/README.md +0 -7
  454. package/src/mobile/bottom-sheet/index.native.js +15 -1
  455. package/src/mobile/color-settings/palette.screen.native.js +7 -5
  456. package/src/mobile/global-styles-context/test/fixtures/theme.native.js +0 -20
  457. package/src/mobile/global-styles-context/utils.native.js +28 -19
  458. package/src/mobile/image/constants.js +1 -0
  459. package/src/mobile/image/index.native.js +55 -18
  460. package/src/mobile/image/style.native.scss +35 -9
  461. package/src/mobile/keyboard-aware-flat-list/index.android.js +50 -5
  462. package/src/mobile/keyboard-aware-flat-list/index.ios.js +65 -91
  463. package/src/mobile/keyboard-aware-flat-list/test/{use-scroll-to-text-input.native.js → use-scroll-to-section.native.js} +27 -25
  464. package/src/mobile/keyboard-aware-flat-list/test/use-scroll.native.js +71 -0
  465. package/src/mobile/keyboard-aware-flat-list/use-scroll-to-element.native.js +41 -0
  466. package/src/mobile/keyboard-aware-flat-list/{use-scroll-to-text-input.native.js → use-scroll-to-section.native.js} +22 -27
  467. package/src/mobile/keyboard-aware-flat-list/use-scroll.native.js +100 -0
  468. package/src/mobile/utils/get-px-from-css-unit.native.js +329 -0
  469. package/src/mobile/utils/test/get-px-from-css-unit.native.js +172 -0
  470. package/src/modal/README.md +0 -6
  471. package/src/modal/index.tsx +18 -16
  472. package/src/modal/test/index.tsx +90 -1
  473. package/src/navigation/menu/menu-title.tsx +1 -1
  474. package/src/navigator/navigator-provider/component.tsx +3 -4
  475. package/src/navigator/navigator-screen/component.tsx +15 -93
  476. package/src/navigator/styles.ts +71 -0
  477. package/src/navigator/test/index.tsx +0 -64
  478. package/src/notice/README.md +0 -6
  479. package/src/number-control/README.md +2 -2
  480. package/src/number-control/index.tsx +4 -8
  481. package/src/number-control/types.ts +1 -1
  482. package/src/palette-edit/index.tsx +15 -58
  483. package/src/palette-edit/test/index.tsx +1 -75
  484. package/src/panel/README.md +0 -6
  485. package/src/private-apis.native.js +13 -0
  486. package/src/private-apis.ts +12 -37
  487. package/src/radio-control/README.md +0 -6
  488. package/src/radio-control/index.tsx +4 -1
  489. package/src/radio-control/style.scss +29 -2
  490. package/src/radio-group/README.md +0 -6
  491. package/src/range-control/README.md +1 -9
  492. package/src/range-control/index.tsx +1 -1
  493. package/src/search-control/README.md +0 -6
  494. package/src/select-control/README.md +0 -6
  495. package/src/select-control/styles/select-control-styles.ts +10 -28
  496. package/src/slot-fill/index.tsx +5 -2
  497. package/src/slot-fill/types.ts +5 -0
  498. package/src/snackbar/README.md +0 -6
  499. package/src/snackbar/stories/index.story.tsx +7 -5
  500. package/src/snackbar/style.scss +4 -3
  501. package/src/snackbar/types.ts +2 -1
  502. package/src/spacer/README.md +0 -2
  503. package/src/tab-panel/README.md +0 -5
  504. package/src/tab-panel/test/index.tsx +39 -56
  505. package/src/tabs/styles.ts +7 -1
  506. package/src/tabs/tabpanel.tsx +7 -6
  507. package/src/tabs/test/index.tsx +56 -0
  508. package/src/text-control/README.md +0 -6
  509. package/src/textarea-control/README.md +0 -6
  510. package/src/toggle-group-control/test/__snapshots__/index.tsx.snap +12 -16
  511. package/src/toggle-group-control/test/index.tsx +58 -45
  512. package/src/toggle-group-control/toggle-group-control/component.tsx +5 -4
  513. package/src/toggle-group-control/toggle-group-control/styles.ts +13 -19
  514. package/src/toggle-group-control/toggle-group-control-option/README.md +1 -1
  515. package/src/toggle-group-control/toggle-group-control-option-base/README.md +1 -1
  516. package/src/toggle-group-control/toggle-group-control-option-base/styles.ts +3 -2
  517. package/src/toggle-group-control/toggle-group-control-option-icon/README.md +1 -1
  518. package/src/toolbar/toolbar/README.md +0 -6
  519. package/src/tools-panel/test/index.tsx +12 -20
  520. package/src/tools-panel/tools-panel/README.md +7 -0
  521. package/src/tools-panel/tools-panel/component.tsx +2 -0
  522. package/src/tools-panel/tools-panel-header/README.md +7 -0
  523. package/src/tools-panel/tools-panel-header/component.tsx +20 -13
  524. package/src/tools-panel/types.ts +9 -0
  525. package/src/tooltip/README.md +4 -0
  526. package/src/tooltip/index.tsx +48 -10
  527. package/src/tooltip/stories/index.story.tsx +18 -1
  528. package/src/tooltip/test/index.tsx +404 -254
  529. package/src/tooltip/types.ts +4 -0
  530. package/src/tree-grid/README.md +0 -4
  531. package/src/truncate/README.md +8 -0
  532. package/src/truncate/hook.ts +17 -10
  533. package/src/truncate/test/index.tsx +54 -27
  534. package/src/truncate/types.ts +4 -0
  535. package/src/unit-control/index.tsx +1 -1
  536. package/src/utils/strings.ts +30 -2
  537. package/src/utils/test/strings.js +96 -1
  538. package/tsconfig.tsbuildinfo +1 -1
  539. package/build/dropdown-menu-v2-ariakit/index.js +0 -256
  540. package/build/dropdown-menu-v2-ariakit/index.js.map +0 -1
  541. package/build/dropdown-menu-v2-ariakit/styles.js +0 -180
  542. package/build/dropdown-menu-v2-ariakit/styles.js.map +0 -1
  543. package/build/dropdown-menu-v2-ariakit/types.js +0 -6
  544. package/build/dropdown-menu-v2-ariakit/types.js.map +0 -1
  545. package/build/mobile/keyboard-aware-flat-list/use-scroll-to-text-input.native.js.map +0 -1
  546. package/build-module/dropdown-menu-v2-ariakit/index.js +0 -237
  547. package/build-module/dropdown-menu-v2-ariakit/index.js.map +0 -1
  548. package/build-module/dropdown-menu-v2-ariakit/styles.js +0 -165
  549. package/build-module/dropdown-menu-v2-ariakit/styles.js.map +0 -1
  550. package/build-module/dropdown-menu-v2-ariakit/types.js +0 -2
  551. package/build-module/dropdown-menu-v2-ariakit/types.js.map +0 -1
  552. package/build-module/mobile/keyboard-aware-flat-list/use-scroll-to-text-input.native.js.map +0 -1
  553. package/build-types/dropdown-menu-v2-ariakit/index.d.ts +0 -20
  554. package/build-types/dropdown-menu-v2-ariakit/index.d.ts.map +0 -1
  555. package/build-types/dropdown-menu-v2-ariakit/stories/index.story.d.ts +0 -16
  556. package/build-types/dropdown-menu-v2-ariakit/stories/index.story.d.ts.map +0 -1
  557. package/build-types/dropdown-menu-v2-ariakit/styles.d.ts +0 -96
  558. package/build-types/dropdown-menu-v2-ariakit/styles.d.ts.map +0 -1
  559. package/build-types/dropdown-menu-v2-ariakit/test/index.d.ts.map +0 -1
  560. package/build-types/dropdown-menu-v2-ariakit/types.d.ts +0 -168
  561. package/build-types/dropdown-menu-v2-ariakit/types.d.ts.map +0 -1
  562. package/src/dropdown-menu-v2-ariakit/README.md +0 -331
  563. package/src/dropdown-menu-v2-ariakit/index.tsx +0 -383
  564. package/src/dropdown-menu-v2-ariakit/stories/index.story.tsx +0 -617
  565. package/src/dropdown-menu-v2-ariakit/styles.ts +0 -345
  566. package/src/dropdown-menu-v2-ariakit/test/index.tsx +0 -1108
  567. package/src/dropdown-menu-v2-ariakit/types.ts +0 -179
  568. /package/build-types/{dropdown-menu-v2-ariakit → composite}/test/index.d.ts +0 -0
@@ -1 +1 @@
1
- {"version":3,"names":["_removeAccents","_interopRequireDefault","require","ALL_UNICODE_DASH_CHARACTERS","RegExp","join","normalizeTextString","value","removeAccents","toLocaleLowerCase","replace","exports","escapeRegExp","string"],"sources":["@wordpress/components/src/utils/strings.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport removeAccents from 'remove-accents';\n\nconst ALL_UNICODE_DASH_CHARACTERS = new RegExp(\n\t`[${ [\n\t\t// - (hyphen-minus)\n\t\t'\\u002d',\n\t\t// ~ (tilde)\n\t\t'\\u007e',\n\t\t// ­ (soft hyphen)\n\t\t'\\u00ad',\n\t\t// ֊ (armenian hyphen)\n\t\t'\\u058a',\n\t\t// ־ (hebrew punctuation maqaf)\n\t\t'\\u05be',\n\t\t// ᐀ (canadian syllabics hyphen)\n\t\t'\\u1400',\n\t\t// ᠆ (mongolian todo soft hyphen)\n\t\t'\\u1806',\n\t\t// ‐ (hyphen)\n\t\t'\\u2010',\n\t\t// non-breaking hyphen)\n\t\t'\\u2011',\n\t\t// ‒ (figure dash)\n\t\t'\\u2012',\n\t\t// – (en dash)\n\t\t'\\u2013',\n\t\t// — (em dash)\n\t\t'\\u2014',\n\t\t// ― (horizontal bar)\n\t\t'\\u2015',\n\t\t// ⁓ (swung dash)\n\t\t'\\u2053',\n\t\t// superscript minus)\n\t\t'\\u207b',\n\t\t// subscript minus)\n\t\t'\\u208b',\n\t\t// − (minus sign)\n\t\t'\\u2212',\n\t\t// ⸗ (double oblique hyphen)\n\t\t'\\u2e17',\n\t\t// ⸺ (two-em dash)\n\t\t'\\u2e3a',\n\t\t// ⸻ (three-em dash)\n\t\t'\\u2e3b',\n\t\t// 〜 (wave dash)\n\t\t'\\u301c',\n\t\t// 〰 (wavy dash)\n\t\t'\\u3030',\n\t\t// ゠ (katakana-hiragana double hyphen)\n\t\t'\\u30a0',\n\t\t// ︱ (presentation form for vertical em dash)\n\t\t'\\ufe31',\n\t\t// ︲ (presentation form for vertical en dash)\n\t\t'\\ufe32',\n\t\t// ﹘ (small em dash)\n\t\t'\\ufe58',\n\t\t// ﹣ (small hyphen-minus)\n\t\t'\\ufe63',\n\t\t// - (fullwidth hyphen-minus)\n\t\t'\\uff0d',\n\t].join( '' ) }]`,\n\t'g'\n);\n\nexport const normalizeTextString = ( value: string ): string => {\n\treturn removeAccents( value )\n\t\t.toLocaleLowerCase()\n\t\t.replace( ALL_UNICODE_DASH_CHARACTERS, '-' );\n};\n\n/**\n * Escapes the RegExp special characters.\n *\n * @param {string} string Input string.\n *\n * @return {string} Regex-escaped string.\n */\nexport function escapeRegExp( string: string ): string {\n\treturn string.replace( /[\\\\^$.*+?()[\\]{}|]/g, '\\\\$&' );\n}\n"],"mappings":";;;;;;;;AAGA,IAAAA,cAAA,GAAAC,sBAAA,CAAAC,OAAA;AAHA;AACA;AACA;;AAGA,MAAMC,2BAA2B,GAAG,IAAIC,MAAM,CAC5C,IAAI;AACJ;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ,CACR,CAACC,IAAI,CAAE,EAAG,CAAG,GAAE,EAChB,GACD,CAAC;AAEM,MAAMC,mBAAmB,GAAKC,KAAa,IAAc;EAC/D,OAAO,IAAAC,sBAAa,EAAED,KAAM,CAAC,CAC3BE,iBAAiB,CAAC,CAAC,CACnBC,OAAO,CAAEP,2BAA2B,EAAE,GAAI,CAAC;AAC9C,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AANAQ,OAAA,CAAAL,mBAAA,GAAAA,mBAAA;AAOO,SAASM,YAAYA,CAAEC,MAAc,EAAW;EACtD,OAAOA,MAAM,CAACH,OAAO,CAAE,qBAAqB,EAAE,MAAO,CAAC;AACvD"}
1
+ {"version":3,"names":["_removeAccents","_interopRequireDefault","require","_changeCase","ALL_UNICODE_DASH_CHARACTERS","RegExp","join","normalizeTextString","value","removeAccents","toLocaleLowerCase","replace","exports","kebabCase","str","_str$toString","input","toString","paramCase","splitRegexp","escapeRegExp","string"],"sources":["@wordpress/components/src/utils/strings.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport removeAccents from 'remove-accents';\nimport { paramCase } from 'change-case';\n\nconst ALL_UNICODE_DASH_CHARACTERS = new RegExp(\n\t`[${ [\n\t\t// - (hyphen-minus)\n\t\t'\\u002d',\n\t\t// ~ (tilde)\n\t\t'\\u007e',\n\t\t// ­ (soft hyphen)\n\t\t'\\u00ad',\n\t\t// ֊ (armenian hyphen)\n\t\t'\\u058a',\n\t\t// ־ (hebrew punctuation maqaf)\n\t\t'\\u05be',\n\t\t// ᐀ (canadian syllabics hyphen)\n\t\t'\\u1400',\n\t\t// ᠆ (mongolian todo soft hyphen)\n\t\t'\\u1806',\n\t\t// ‐ (hyphen)\n\t\t'\\u2010',\n\t\t// non-breaking hyphen)\n\t\t'\\u2011',\n\t\t// ‒ (figure dash)\n\t\t'\\u2012',\n\t\t// – (en dash)\n\t\t'\\u2013',\n\t\t// — (em dash)\n\t\t'\\u2014',\n\t\t// ― (horizontal bar)\n\t\t'\\u2015',\n\t\t// ⁓ (swung dash)\n\t\t'\\u2053',\n\t\t// superscript minus)\n\t\t'\\u207b',\n\t\t// subscript minus)\n\t\t'\\u208b',\n\t\t// − (minus sign)\n\t\t'\\u2212',\n\t\t// ⸗ (double oblique hyphen)\n\t\t'\\u2e17',\n\t\t// ⸺ (two-em dash)\n\t\t'\\u2e3a',\n\t\t// ⸻ (three-em dash)\n\t\t'\\u2e3b',\n\t\t// 〜 (wave dash)\n\t\t'\\u301c',\n\t\t// 〰 (wavy dash)\n\t\t'\\u3030',\n\t\t// ゠ (katakana-hiragana double hyphen)\n\t\t'\\u30a0',\n\t\t// ︱ (presentation form for vertical em dash)\n\t\t'\\ufe31',\n\t\t// ︲ (presentation form for vertical en dash)\n\t\t'\\ufe32',\n\t\t// ﹘ (small em dash)\n\t\t'\\ufe58',\n\t\t// ﹣ (small hyphen-minus)\n\t\t'\\ufe63',\n\t\t// - (fullwidth hyphen-minus)\n\t\t'\\uff0d',\n\t].join( '' ) }]`,\n\t'g'\n);\n\nexport const normalizeTextString = ( value: string ): string => {\n\treturn removeAccents( value )\n\t\t.toLocaleLowerCase()\n\t\t.replace( ALL_UNICODE_DASH_CHARACTERS, '-' );\n};\n\n/**\n * Converts any string to kebab case.\n * Backwards compatible with Lodash's `_.kebabCase()`.\n * Backwards compatible with `_wp_to_kebab_case()`.\n *\n * @see https://lodash.com/docs/4.17.15#kebabCase\n * @see https://developer.wordpress.org/reference/functions/_wp_to_kebab_case/\n *\n * @param str String to convert.\n * @return Kebab-cased string\n */\nexport function kebabCase( str: unknown ) {\n\tlet input = str?.toString?.() ?? '';\n\n\t// See https://github.com/lodash/lodash/blob/b185fcee26b2133bd071f4aaca14b455c2ed1008/lodash.js#L4970\n\tinput = input.replace( /['\\u2019]/, '' );\n\n\treturn paramCase( input, {\n\t\tsplitRegexp: [\n\t\t\t/(?!(?:1ST|2ND|3RD|[4-9]TH)(?![a-z]))([a-z0-9])([A-Z])/g, // fooBar => foo-bar, 3Bar => 3-bar\n\t\t\t/(?!(?:1st|2nd|3rd|[4-9]th)(?![a-z]))([0-9])([a-z])/g, // 3bar => 3-bar\n\t\t\t/([A-Za-z])([0-9])/g, // Foo3 => foo-3, foo3 => foo-3\n\t\t\t/([A-Z])([A-Z][a-z])/g, // FOOBar => foo-bar\n\t\t],\n\t} );\n}\n\n/**\n * Escapes the RegExp special characters.\n *\n * @param string Input string.\n *\n * @return Regex-escaped string.\n */\nexport function escapeRegExp( string: string ): string {\n\treturn string.replace( /[\\\\^$.*+?()[\\]{}|]/g, '\\\\$&' );\n}\n"],"mappings":";;;;;;;;;AAGA,IAAAA,cAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,WAAA,GAAAD,OAAA;AAJA;AACA;AACA;;AAIA,MAAME,2BAA2B,GAAG,IAAIC,MAAM,CAC5C,IAAI;AACJ;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ;AACR;AACA,QAAQ,CACR,CAACC,IAAI,CAAE,EAAG,CAAG,GAAE,EAChB,GACD,CAAC;AAEM,MAAMC,mBAAmB,GAAKC,KAAa,IAAc;EAC/D,OAAO,IAAAC,sBAAa,EAAED,KAAM,CAAC,CAC3BE,iBAAiB,CAAC,CAAC,CACnBC,OAAO,CAAEP,2BAA2B,EAAE,GAAI,CAAC;AAC9C,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAVAQ,OAAA,CAAAL,mBAAA,GAAAA,mBAAA;AAWO,SAASM,SAASA,CAAEC,GAAY,EAAG;EAAA,IAAAC,aAAA;EACzC,IAAIC,KAAK,IAAAD,aAAA,GAAGD,GAAG,EAAEG,QAAQ,GAAG,CAAC,cAAAF,aAAA,cAAAA,aAAA,GAAI,EAAE;;EAEnC;EACAC,KAAK,GAAGA,KAAK,CAACL,OAAO,CAAE,WAAW,EAAE,EAAG,CAAC;EAExC,OAAO,IAAAO,qBAAS,EAAEF,KAAK,EAAE;IACxBG,WAAW,EAAE,CACZ,wDAAwD;IAAE;IAC1D,qDAAqD;IAAE;IACvD,oBAAoB;IAAE;IACtB,sBAAsB,CAAE;IAAA;EAE1B,CAAE,CAAC;AACJ;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,YAAYA,CAAEC,MAAc,EAAW;EACtD,OAAOA,MAAM,CAACV,OAAO,CAAE,qBAAqB,EAAE,MAAO,CAAC;AACvD"}
@@ -9,6 +9,7 @@ import classnames from 'classnames';
9
9
  */
10
10
  import { VisuallyHidden } from '../visually-hidden';
11
11
  import { Wrapper, StyledField, StyledLabel, StyledHelp, StyledVisualLabel } from './styles/base-control-styles';
12
+ import { contextConnectWithoutRef, useContextSystem } from '../context';
12
13
  export { useBaseControlProps } from './hooks';
13
14
 
14
15
  /**
@@ -34,17 +35,18 @@ export { useBaseControlProps } from './hooks';
34
35
  * );
35
36
  * ```
36
37
  */
37
- export const BaseControl = ({
38
- __nextHasNoMarginBottom = false,
39
- id,
40
- label,
41
- hideLabelFromVision = false,
42
- help,
43
- className,
44
- children
45
- }) => {
38
+ const UnconnectedBaseControl = props => {
39
+ const {
40
+ __nextHasNoMarginBottom = false,
41
+ id,
42
+ label,
43
+ hideLabelFromVision = false,
44
+ help,
45
+ className,
46
+ children
47
+ } = useContextSystem(props, 'BaseControl');
46
48
  return createElement(Wrapper, {
47
- className: classnames('components-base-control', className)
49
+ className: className
48
50
  }, createElement(StyledField, {
49
51
  className: "components-base-control__field"
50
52
  // TODO: Official deprecation for this should start after all internal usages have been migrated
@@ -58,7 +60,7 @@ export const BaseControl = ({
58
60
  htmlFor: id
59
61
  }, label)), label && !id && (hideLabelFromVision ? createElement(VisuallyHidden, {
60
62
  as: "label"
61
- }, label) : createElement(BaseControl.VisualLabel, null, label)), children), !!help && createElement(StyledHelp, {
63
+ }, label) : createElement(VisualLabel, null, label)), children), !!help && createElement(StyledHelp, {
62
64
  id: id ? id + '__help' : undefined,
63
65
  className: "components-base-control__help",
64
66
  __nextHasNoMarginBottom: __nextHasNoMarginBottom
@@ -92,6 +94,8 @@ export const VisualLabel = ({
92
94
  className: classnames('components-base-control__label', className)
93
95
  }, children);
94
96
  };
95
- BaseControl.VisualLabel = VisualLabel;
97
+ export const BaseControl = Object.assign(contextConnectWithoutRef(UnconnectedBaseControl, 'BaseControl'), {
98
+ VisualLabel
99
+ });
96
100
  export default BaseControl;
97
101
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["classnames","VisuallyHidden","Wrapper","StyledField","StyledLabel","StyledHelp","StyledVisualLabel","useBaseControlProps","BaseControl","__nextHasNoMarginBottom","id","label","hideLabelFromVision","help","className","children","createElement","as","htmlFor","VisualLabel","undefined","props"],"sources":["@wordpress/components/src/base-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * Internal dependencies\n */\nimport { VisuallyHidden } from '../visually-hidden';\nimport type { BaseControlProps, BaseControlVisualLabelProps } from './types';\nimport {\n\tWrapper,\n\tStyledField,\n\tStyledLabel,\n\tStyledHelp,\n\tStyledVisualLabel,\n} from './styles/base-control-styles';\nimport type { WordPressComponentProps } from '../context';\n\nexport { useBaseControlProps } from './hooks';\n\n/**\n * `BaseControl` is a component used to generate labels and help text for components handling user inputs.\n *\n * ```jsx\n * import { BaseControl, useBaseControlProps } from '@wordpress/components';\n *\n * // Render a `BaseControl` for a textarea input\n * const MyCustomTextareaControl = ({ children, ...baseProps }) => (\n * \t// `useBaseControlProps` is a convenience hook to get the props for the `BaseControl`\n * \t// and the inner control itself. Namely, it takes care of generating a unique `id`,\n * \t// properly associating it with the `label` and `help` elements.\n * \tconst { baseControlProps, controlProps } = useBaseControlProps( baseProps );\n *\n * \treturn (\n * \t\t<BaseControl { ...baseControlProps } __nextHasNoMarginBottom={ true }>\n * \t\t\t<textarea { ...controlProps }>\n * \t\t\t { children }\n * \t\t\t</textarea>\n * \t\t</BaseControl>\n * \t);\n * );\n * ```\n */\nexport const BaseControl = ( {\n\t__nextHasNoMarginBottom = false,\n\tid,\n\tlabel,\n\thideLabelFromVision = false,\n\thelp,\n\tclassName,\n\tchildren,\n}: BaseControlProps ) => {\n\treturn (\n\t\t<Wrapper\n\t\t\tclassName={ classnames( 'components-base-control', className ) }\n\t\t>\n\t\t\t<StyledField\n\t\t\t\tclassName=\"components-base-control__field\"\n\t\t\t\t// TODO: Official deprecation for this should start after all internal usages have been migrated\n\t\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t>\n\t\t\t\t{ label &&\n\t\t\t\t\tid &&\n\t\t\t\t\t( hideLabelFromVision ? (\n\t\t\t\t\t\t<VisuallyHidden as=\"label\" htmlFor={ id }>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<StyledLabel\n\t\t\t\t\t\t\tclassName=\"components-base-control__label\"\n\t\t\t\t\t\t\thtmlFor={ id }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</StyledLabel>\n\t\t\t\t\t) ) }\n\t\t\t\t{ label &&\n\t\t\t\t\t! id &&\n\t\t\t\t\t( hideLabelFromVision ? (\n\t\t\t\t\t\t<VisuallyHidden as=\"label\">{ label }</VisuallyHidden>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<BaseControl.VisualLabel>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t\t) ) }\n\t\t\t\t{ children }\n\t\t\t</StyledField>\n\t\t\t{ !! help && (\n\t\t\t\t<StyledHelp\n\t\t\t\t\tid={ id ? id + '__help' : undefined }\n\t\t\t\t\tclassName=\"components-base-control__help\"\n\t\t\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t\t>\n\t\t\t\t\t{ help }\n\t\t\t\t</StyledHelp>\n\t\t\t) }\n\t\t</Wrapper>\n\t);\n};\n\n/**\n * `BaseControl.VisualLabel` is used to render a purely visual label inside a `BaseControl` component.\n *\n * It should only be used in cases where the children being rendered inside `BaseControl` are already accessibly labeled,\n * e.g., a button, but we want an additional visual label for that section equivalent to the labels `BaseControl` would\n * otherwise use if the `label` prop was passed.\n *\n * @example\n * import { BaseControl } from '@wordpress/components';\n *\n * const MyBaseControl = () => (\n * \t<BaseControl help=\"This button is already accessibly labeled.\">\n * \t\t<BaseControl.VisualLabel>Author</BaseControl.VisualLabel>\n * \t\t<Button>Select an author</Button>\n * \t</BaseControl>\n * );\n */\nexport const VisualLabel = ( {\n\tclassName,\n\tchildren,\n\t...props\n}: WordPressComponentProps< BaseControlVisualLabelProps, 'span' > ) => {\n\treturn (\n\t\t<StyledVisualLabel\n\t\t\t{ ...props }\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-base-control__label',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t{ children }\n\t\t</StyledVisualLabel>\n\t);\n};\nBaseControl.VisualLabel = VisualLabel;\n\nexport default BaseControl;\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;;AAEnC;AACA;AACA;AACA,SAASC,cAAc,QAAQ,oBAAoB;AAEnD,SACCC,OAAO,EACPC,WAAW,EACXC,WAAW,EACXC,UAAU,EACVC,iBAAiB,QACX,8BAA8B;AAGrC,SAASC,mBAAmB,QAAQ,SAAS;;AAE7C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,WAAW,GAAGA,CAAE;EAC5BC,uBAAuB,GAAG,KAAK;EAC/BC,EAAE;EACFC,KAAK;EACLC,mBAAmB,GAAG,KAAK;EAC3BC,IAAI;EACJC,SAAS;EACTC;AACiB,CAAC,KAAM;EACxB,OACCC,aAAA,CAACd,OAAO;IACPY,SAAS,EAAGd,UAAU,CAAE,yBAAyB,EAAEc,SAAU;EAAG,GAEhEE,aAAA,CAACb,WAAW;IACXW,SAAS,EAAC;IACV;IAAA;IACAL,uBAAuB,EAAGA;EAAyB,GAEjDE,KAAK,IACND,EAAE,KACAE,mBAAmB,GACpBI,aAAA,CAACf,cAAc;IAACgB,EAAE,EAAC,OAAO;IAACC,OAAO,EAAGR;EAAI,GACtCC,KACa,CAAC,GAEjBK,aAAA,CAACZ,WAAW;IACXU,SAAS,EAAC,gCAAgC;IAC1CI,OAAO,EAAGR;EAAI,GAEZC,KACU,CACb,CAAE,EACFA,KAAK,IACN,CAAED,EAAE,KACFE,mBAAmB,GACpBI,aAAA,CAACf,cAAc;IAACgB,EAAE,EAAC;EAAO,GAAGN,KAAuB,CAAC,GAErDK,aAAA,CAACR,WAAW,CAACW,WAAW,QACrBR,KACsB,CACzB,CAAE,EACFI,QACU,CAAC,EACZ,CAAC,CAAEF,IAAI,IACRG,aAAA,CAACX,UAAU;IACVK,EAAE,EAAGA,EAAE,GAAGA,EAAE,GAAG,QAAQ,GAAGU,SAAW;IACrCN,SAAS,EAAC,+BAA+B;IACzCL,uBAAuB,EAAGA;EAAyB,GAEjDI,IACS,CAEL,CAAC;AAEZ,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMM,WAAW,GAAGA,CAAE;EAC5BL,SAAS;EACTC,QAAQ;EACR,GAAGM;AAC4D,CAAC,KAAM;EACtE,OACCL,aAAA,CAACV,iBAAiB;IAAA,GACZe,KAAK;IACVP,SAAS,EAAGd,UAAU,CACrB,gCAAgC,EAChCc,SACD;EAAG,GAEDC,QACgB,CAAC;AAEtB,CAAC;AACDP,WAAW,CAACW,WAAW,GAAGA,WAAW;AAErC,eAAeX,WAAW"}
1
+ {"version":3,"names":["classnames","VisuallyHidden","Wrapper","StyledField","StyledLabel","StyledHelp","StyledVisualLabel","contextConnectWithoutRef","useContextSystem","useBaseControlProps","UnconnectedBaseControl","props","__nextHasNoMarginBottom","id","label","hideLabelFromVision","help","className","children","createElement","as","htmlFor","VisualLabel","undefined","BaseControl","Object","assign"],"sources":["@wordpress/components/src/base-control/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * Internal dependencies\n */\nimport { VisuallyHidden } from '../visually-hidden';\nimport type { BaseControlProps, BaseControlVisualLabelProps } from './types';\nimport {\n\tWrapper,\n\tStyledField,\n\tStyledLabel,\n\tStyledHelp,\n\tStyledVisualLabel,\n} from './styles/base-control-styles';\nimport type { WordPressComponentProps } from '../context';\nimport { contextConnectWithoutRef, useContextSystem } from '../context';\n\nexport { useBaseControlProps } from './hooks';\n\n/**\n * `BaseControl` is a component used to generate labels and help text for components handling user inputs.\n *\n * ```jsx\n * import { BaseControl, useBaseControlProps } from '@wordpress/components';\n *\n * // Render a `BaseControl` for a textarea input\n * const MyCustomTextareaControl = ({ children, ...baseProps }) => (\n * \t// `useBaseControlProps` is a convenience hook to get the props for the `BaseControl`\n * \t// and the inner control itself. Namely, it takes care of generating a unique `id`,\n * \t// properly associating it with the `label` and `help` elements.\n * \tconst { baseControlProps, controlProps } = useBaseControlProps( baseProps );\n *\n * \treturn (\n * \t\t<BaseControl { ...baseControlProps } __nextHasNoMarginBottom={ true }>\n * \t\t\t<textarea { ...controlProps }>\n * \t\t\t { children }\n * \t\t\t</textarea>\n * \t\t</BaseControl>\n * \t);\n * );\n * ```\n */\nconst UnconnectedBaseControl = (\n\tprops: WordPressComponentProps< BaseControlProps, null >\n) => {\n\tconst {\n\t\t__nextHasNoMarginBottom = false,\n\t\tid,\n\t\tlabel,\n\t\thideLabelFromVision = false,\n\t\thelp,\n\t\tclassName,\n\t\tchildren,\n\t} = useContextSystem( props, 'BaseControl' );\n\n\treturn (\n\t\t<Wrapper className={ className }>\n\t\t\t<StyledField\n\t\t\t\tclassName=\"components-base-control__field\"\n\t\t\t\t// TODO: Official deprecation for this should start after all internal usages have been migrated\n\t\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t>\n\t\t\t\t{ label &&\n\t\t\t\t\tid &&\n\t\t\t\t\t( hideLabelFromVision ? (\n\t\t\t\t\t\t<VisuallyHidden as=\"label\" htmlFor={ id }>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<StyledLabel\n\t\t\t\t\t\t\tclassName=\"components-base-control__label\"\n\t\t\t\t\t\t\thtmlFor={ id }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t</StyledLabel>\n\t\t\t\t\t) ) }\n\t\t\t\t{ label &&\n\t\t\t\t\t! id &&\n\t\t\t\t\t( hideLabelFromVision ? (\n\t\t\t\t\t\t<VisuallyHidden as=\"label\">{ label }</VisuallyHidden>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<VisualLabel>{ label }</VisualLabel>\n\t\t\t\t\t) ) }\n\t\t\t\t{ children }\n\t\t\t</StyledField>\n\t\t\t{ !! help && (\n\t\t\t\t<StyledHelp\n\t\t\t\t\tid={ id ? id + '__help' : undefined }\n\t\t\t\t\tclassName=\"components-base-control__help\"\n\t\t\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\t\t>\n\t\t\t\t\t{ help }\n\t\t\t\t</StyledHelp>\n\t\t\t) }\n\t\t</Wrapper>\n\t);\n};\n\n/**\n * `BaseControl.VisualLabel` is used to render a purely visual label inside a `BaseControl` component.\n *\n * It should only be used in cases where the children being rendered inside `BaseControl` are already accessibly labeled,\n * e.g., a button, but we want an additional visual label for that section equivalent to the labels `BaseControl` would\n * otherwise use if the `label` prop was passed.\n *\n * @example\n * import { BaseControl } from '@wordpress/components';\n *\n * const MyBaseControl = () => (\n * \t<BaseControl help=\"This button is already accessibly labeled.\">\n * \t\t<BaseControl.VisualLabel>Author</BaseControl.VisualLabel>\n * \t\t<Button>Select an author</Button>\n * \t</BaseControl>\n * );\n */\nexport const VisualLabel = ( {\n\tclassName,\n\tchildren,\n\t...props\n}: WordPressComponentProps< BaseControlVisualLabelProps, 'span' > ) => {\n\treturn (\n\t\t<StyledVisualLabel\n\t\t\t{ ...props }\n\t\t\tclassName={ classnames(\n\t\t\t\t'components-base-control__label',\n\t\t\t\tclassName\n\t\t\t) }\n\t\t>\n\t\t\t{ children }\n\t\t</StyledVisualLabel>\n\t);\n};\n\nexport const BaseControl = Object.assign(\n\tcontextConnectWithoutRef( UnconnectedBaseControl, 'BaseControl' ),\n\t{ VisualLabel }\n);\n\nexport default BaseControl;\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;;AAEnC;AACA;AACA;AACA,SAASC,cAAc,QAAQ,oBAAoB;AAEnD,SACCC,OAAO,EACPC,WAAW,EACXC,WAAW,EACXC,UAAU,EACVC,iBAAiB,QACX,8BAA8B;AAErC,SAASC,wBAAwB,EAAEC,gBAAgB,QAAQ,YAAY;AAEvE,SAASC,mBAAmB,QAAQ,SAAS;;AAE7C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,sBAAsB,GAC3BC,KAAwD,IACpD;EACJ,MAAM;IACLC,uBAAuB,GAAG,KAAK;IAC/BC,EAAE;IACFC,KAAK;IACLC,mBAAmB,GAAG,KAAK;IAC3BC,IAAI;IACJC,SAAS;IACTC;EACD,CAAC,GAAGV,gBAAgB,CAAEG,KAAK,EAAE,aAAc,CAAC;EAE5C,OACCQ,aAAA,CAACjB,OAAO;IAACe,SAAS,EAAGA;EAAW,GAC/BE,aAAA,CAAChB,WAAW;IACXc,SAAS,EAAC;IACV;IAAA;IACAL,uBAAuB,EAAGA;EAAyB,GAEjDE,KAAK,IACND,EAAE,KACAE,mBAAmB,GACpBI,aAAA,CAAClB,cAAc;IAACmB,EAAE,EAAC,OAAO;IAACC,OAAO,EAAGR;EAAI,GACtCC,KACa,CAAC,GAEjBK,aAAA,CAACf,WAAW;IACXa,SAAS,EAAC,gCAAgC;IAC1CI,OAAO,EAAGR;EAAI,GAEZC,KACU,CACb,CAAE,EACFA,KAAK,IACN,CAAED,EAAE,KACFE,mBAAmB,GACpBI,aAAA,CAAClB,cAAc;IAACmB,EAAE,EAAC;EAAO,GAAGN,KAAuB,CAAC,GAErDK,aAAA,CAACG,WAAW,QAAGR,KAAoB,CACnC,CAAE,EACFI,QACU,CAAC,EACZ,CAAC,CAAEF,IAAI,IACRG,aAAA,CAACd,UAAU;IACVQ,EAAE,EAAGA,EAAE,GAAGA,EAAE,GAAG,QAAQ,GAAGU,SAAW;IACrCN,SAAS,EAAC,+BAA+B;IACzCL,uBAAuB,EAAGA;EAAyB,GAEjDI,IACS,CAEL,CAAC;AAEZ,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMM,WAAW,GAAGA,CAAE;EAC5BL,SAAS;EACTC,QAAQ;EACR,GAAGP;AAC4D,CAAC,KAAM;EACtE,OACCQ,aAAA,CAACb,iBAAiB;IAAA,GACZK,KAAK;IACVM,SAAS,EAAGjB,UAAU,CACrB,gCAAgC,EAChCiB,SACD;EAAG,GAEDC,QACgB,CAAC;AAEtB,CAAC;AAED,OAAO,MAAMM,WAAW,GAAGC,MAAM,CAACC,MAAM,CACvCnB,wBAAwB,CAAEG,sBAAsB,EAAE,aAAc,CAAC,EACjE;EAAEY;AAAY,CACf,CAAC;AAED,eAAeE,WAAW"}
@@ -26,7 +26,7 @@ const BorderBoxControlLinkedButton = (props, forwardedRef) => {
26
26
  className: className
27
27
  }, createElement(Button, {
28
28
  ...buttonProps,
29
- isSmall: true,
29
+ size: "small",
30
30
  icon: isLinked ? link : linkOff,
31
31
  iconSize: 24,
32
32
  "aria-label": label,
@@ -1 +1 @@
1
- {"version":3,"names":["link","linkOff","__","Button","Tooltip","View","contextConnect","useBorderBoxControlLinkedButton","BorderBoxControlLinkedButton","props","forwardedRef","className","isLinked","buttonProps","label","createElement","text","isSmall","icon","iconSize","ref","ConnectedBorderBoxControlLinkedButton"],"sources":["@wordpress/components/src/border-box-control/border-box-control-linked-button/component.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { link, linkOff } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport Tooltip from '../../tooltip';\nimport { View } from '../../view';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderBoxControlLinkedButton } from './hook';\n\nimport type { LinkedButtonProps } from '../types';\n\nconst BorderBoxControlLinkedButton = (\n\tprops: WordPressComponentProps< LinkedButtonProps, 'button' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst { className, isLinked, ...buttonProps } =\n\t\tuseBorderBoxControlLinkedButton( props );\n\tconst label = isLinked ? __( 'Unlink sides' ) : __( 'Link sides' );\n\n\treturn (\n\t\t<Tooltip text={ label }>\n\t\t\t<View className={ className }>\n\t\t\t\t<Button\n\t\t\t\t\t{ ...buttonProps }\n\t\t\t\t\tisSmall\n\t\t\t\t\ticon={ isLinked ? link : linkOff }\n\t\t\t\t\ticonSize={ 24 }\n\t\t\t\t\taria-label={ label }\n\t\t\t\t\tref={ forwardedRef }\n\t\t\t\t/>\n\t\t\t</View>\n\t\t</Tooltip>\n\t);\n};\n\nconst ConnectedBorderBoxControlLinkedButton = contextConnect(\n\tBorderBoxControlLinkedButton,\n\t'BorderBoxControlLinkedButton'\n);\nexport default ConnectedBorderBoxControlLinkedButton;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,IAAI,EAAEC,OAAO,QAAQ,kBAAkB;AAChD,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,OAAOC,MAAM,MAAM,cAAc;AACjC,OAAOC,OAAO,MAAM,eAAe;AACnC,SAASC,IAAI,QAAQ,YAAY;AAEjC,SAASC,cAAc,QAAQ,eAAe;AAC9C,SAASC,+BAA+B,QAAQ,QAAQ;AAIxD,MAAMC,4BAA4B,GAAGA,CACpCC,KAA6D,EAC7DC,YAAuC,KACnC;EACJ,MAAM;IAAEC,SAAS;IAAEC,QAAQ;IAAE,GAAGC;EAAY,CAAC,GAC5CN,+BAA+B,CAAEE,KAAM,CAAC;EACzC,MAAMK,KAAK,GAAGF,QAAQ,GAAGV,EAAE,CAAE,cAAe,CAAC,GAAGA,EAAE,CAAE,YAAa,CAAC;EAElE,OACCa,aAAA,CAACX,OAAO;IAACY,IAAI,EAAGF;EAAO,GACtBC,aAAA,CAACV,IAAI;IAACM,SAAS,EAAGA;EAAW,GAC5BI,aAAA,CAACZ,MAAM;IAAA,GACDU,WAAW;IAChBI,OAAO;IACPC,IAAI,EAAGN,QAAQ,GAAGZ,IAAI,GAAGC,OAAS;IAClCkB,QAAQ,EAAG,EAAI;IACf,cAAaL,KAAO;IACpBM,GAAG,EAAGV;EAAc,CACpB,CACI,CACE,CAAC;AAEZ,CAAC;AAED,MAAMW,qCAAqC,GAAGf,cAAc,CAC3DE,4BAA4B,EAC5B,8BACD,CAAC;AACD,eAAea,qCAAqC"}
1
+ {"version":3,"names":["link","linkOff","__","Button","Tooltip","View","contextConnect","useBorderBoxControlLinkedButton","BorderBoxControlLinkedButton","props","forwardedRef","className","isLinked","buttonProps","label","createElement","text","size","icon","iconSize","ref","ConnectedBorderBoxControlLinkedButton"],"sources":["@wordpress/components/src/border-box-control/border-box-control-linked-button/component.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { link, linkOff } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport Tooltip from '../../tooltip';\nimport { View } from '../../view';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderBoxControlLinkedButton } from './hook';\n\nimport type { LinkedButtonProps } from '../types';\n\nconst BorderBoxControlLinkedButton = (\n\tprops: WordPressComponentProps< LinkedButtonProps, 'button' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst { className, isLinked, ...buttonProps } =\n\t\tuseBorderBoxControlLinkedButton( props );\n\tconst label = isLinked ? __( 'Unlink sides' ) : __( 'Link sides' );\n\n\treturn (\n\t\t<Tooltip text={ label }>\n\t\t\t<View className={ className }>\n\t\t\t\t<Button\n\t\t\t\t\t{ ...buttonProps }\n\t\t\t\t\tsize=\"small\"\n\t\t\t\t\ticon={ isLinked ? link : linkOff }\n\t\t\t\t\ticonSize={ 24 }\n\t\t\t\t\taria-label={ label }\n\t\t\t\t\tref={ forwardedRef }\n\t\t\t\t/>\n\t\t\t</View>\n\t\t</Tooltip>\n\t);\n};\n\nconst ConnectedBorderBoxControlLinkedButton = contextConnect(\n\tBorderBoxControlLinkedButton,\n\t'BorderBoxControlLinkedButton'\n);\nexport default ConnectedBorderBoxControlLinkedButton;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,IAAI,EAAEC,OAAO,QAAQ,kBAAkB;AAChD,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,OAAOC,MAAM,MAAM,cAAc;AACjC,OAAOC,OAAO,MAAM,eAAe;AACnC,SAASC,IAAI,QAAQ,YAAY;AAEjC,SAASC,cAAc,QAAQ,eAAe;AAC9C,SAASC,+BAA+B,QAAQ,QAAQ;AAIxD,MAAMC,4BAA4B,GAAGA,CACpCC,KAA6D,EAC7DC,YAAuC,KACnC;EACJ,MAAM;IAAEC,SAAS;IAAEC,QAAQ;IAAE,GAAGC;EAAY,CAAC,GAC5CN,+BAA+B,CAAEE,KAAM,CAAC;EACzC,MAAMK,KAAK,GAAGF,QAAQ,GAAGV,EAAE,CAAE,cAAe,CAAC,GAAGA,EAAE,CAAE,YAAa,CAAC;EAElE,OACCa,aAAA,CAACX,OAAO;IAACY,IAAI,EAAGF;EAAO,GACtBC,aAAA,CAACV,IAAI;IAACM,SAAS,EAAGA;EAAW,GAC5BI,aAAA,CAACZ,MAAM;IAAA,GACDU,WAAW;IAChBI,IAAI,EAAC,OAAO;IACZC,IAAI,EAAGN,QAAQ,GAAGZ,IAAI,GAAGC,OAAS;IAClCkB,QAAQ,EAAG,EAAI;IACf,cAAaL,KAAO;IACpBM,GAAG,EAAGV;EAAc,CACpB,CACI,CACE,CAAC;AAEZ,CAAC;AAED,MAAMW,qCAAqC,GAAGf,cAAc,CAC3DE,4BAA4B,EAC5B,8BACD,CAAC;AACD,eAAea,qCAAqC"}
@@ -62,7 +62,7 @@ const BorderControlStylePicker = (props, forwardedRef) => {
62
62
  key: borderStyle.value,
63
63
  className: buttonClassName,
64
64
  icon: borderStyle.icon,
65
- isSmall: true,
65
+ size: "small",
66
66
  isPressed: borderStyle.value === value,
67
67
  onClick: () => onChange(borderStyle.value === value ? undefined : borderStyle.value),
68
68
  "aria-label": borderStyle.label,
@@ -1 +1 @@
1
- {"version":3,"names":["lineDashed","lineDotted","lineSolid","__","Button","StyledLabel","View","Flex","VisuallyHidden","contextConnect","useBorderControlStylePicker","BORDER_STYLES","label","icon","value","Label","props","hideLabelFromVision","createElement","as","BorderControlStylePicker","forwardedRef","buttonClassName","onChange","otherProps","ref","justify","gap","map","borderStyle","key","className","isSmall","isPressed","onClick","undefined","showTooltip","ConnectedBorderControlStylePicker"],"sources":["@wordpress/components/src/border-control/border-control-style-picker/component.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { lineDashed, lineDotted, lineSolid } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport { View } from '../../view';\nimport { Flex } from '../../flex';\nimport { VisuallyHidden } from '../../visually-hidden';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderControlStylePicker } from './hook';\n\nimport type { LabelProps, StylePickerProps } from '../types';\n\nconst BORDER_STYLES = [\n\t{ label: __( 'Solid' ), icon: lineSolid, value: 'solid' },\n\t{ label: __( 'Dashed' ), icon: lineDashed, value: 'dashed' },\n\t{ label: __( 'Dotted' ), icon: lineDotted, value: 'dotted' },\n];\n\nconst Label = ( props: LabelProps ) => {\n\tconst { label, hideLabelFromVision } = props;\n\n\tif ( ! label ) {\n\t\treturn null;\n\t}\n\n\treturn hideLabelFromVision ? (\n\t\t<VisuallyHidden as=\"label\">{ label }</VisuallyHidden>\n\t) : (\n\t\t<StyledLabel>{ label }</StyledLabel>\n\t);\n};\n\nconst BorderControlStylePicker = (\n\tprops: WordPressComponentProps< StylePickerProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\tbuttonClassName,\n\t\thideLabelFromVision,\n\t\tlabel,\n\t\tonChange,\n\t\tvalue,\n\t\t...otherProps\n\t} = useBorderControlStylePicker( props );\n\n\treturn (\n\t\t<View { ...otherProps } ref={ forwardedRef }>\n\t\t\t<Label\n\t\t\t\tlabel={ label }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t/>\n\t\t\t<Flex justify=\"flex-start\" gap={ 1 }>\n\t\t\t\t{ BORDER_STYLES.map( ( borderStyle ) => (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tkey={ borderStyle.value }\n\t\t\t\t\t\tclassName={ buttonClassName }\n\t\t\t\t\t\ticon={ borderStyle.icon }\n\t\t\t\t\t\tisSmall\n\t\t\t\t\t\tisPressed={ borderStyle.value === value }\n\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\tborderStyle.value === value\n\t\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t\t: borderStyle.value\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t\taria-label={ borderStyle.label }\n\t\t\t\t\t\tlabel={ borderStyle.label }\n\t\t\t\t\t\tshowTooltip={ true }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</Flex>\n\t\t</View>\n\t);\n};\n\nconst ConnectedBorderControlStylePicker = contextConnect(\n\tBorderControlStylePicker,\n\t'BorderControlStylePicker'\n);\n\nexport default ConnectedBorderControlStylePicker;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,UAAU,EAAEC,UAAU,EAAEC,SAAS,QAAQ,kBAAkB;AACpE,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,OAAOC,MAAM,MAAM,cAAc;AACjC,SAASC,WAAW,QAAQ,+CAA+C;AAC3E,SAASC,IAAI,QAAQ,YAAY;AACjC,SAASC,IAAI,QAAQ,YAAY;AACjC,SAASC,cAAc,QAAQ,uBAAuB;AAEtD,SAASC,cAAc,QAAQ,eAAe;AAC9C,SAASC,2BAA2B,QAAQ,QAAQ;AAIpD,MAAMC,aAAa,GAAG,CACrB;EAAEC,KAAK,EAAET,EAAE,CAAE,OAAQ,CAAC;EAAEU,IAAI,EAAEX,SAAS;EAAEY,KAAK,EAAE;AAAQ,CAAC,EACzD;EAAEF,KAAK,EAAET,EAAE,CAAE,QAAS,CAAC;EAAEU,IAAI,EAAEb,UAAU;EAAEc,KAAK,EAAE;AAAS,CAAC,EAC5D;EAAEF,KAAK,EAAET,EAAE,CAAE,QAAS,CAAC;EAAEU,IAAI,EAAEZ,UAAU;EAAEa,KAAK,EAAE;AAAS,CAAC,CAC5D;AAED,MAAMC,KAAK,GAAKC,KAAiB,IAAM;EACtC,MAAM;IAAEJ,KAAK;IAAEK;EAAoB,CAAC,GAAGD,KAAK;EAE5C,IAAK,CAAEJ,KAAK,EAAG;IACd,OAAO,IAAI;EACZ;EAEA,OAAOK,mBAAmB,GACzBC,aAAA,CAACV,cAAc;IAACW,EAAE,EAAC;EAAO,GAAGP,KAAuB,CAAC,GAErDM,aAAA,CAACb,WAAW,QAAGO,KAAoB,CACnC;AACF,CAAC;AAED,MAAMQ,wBAAwB,GAAGA,CAChCJ,KAAyD,EACzDK,YAAuC,KACnC;EACJ,MAAM;IACLC,eAAe;IACfL,mBAAmB;IACnBL,KAAK;IACLW,QAAQ;IACRT,KAAK;IACL,GAAGU;EACJ,CAAC,GAAGd,2BAA2B,CAAEM,KAAM,CAAC;EAExC,OACCE,aAAA,CAACZ,IAAI;IAAA,GAAMkB,UAAU;IAAGC,GAAG,EAAGJ;EAAc,GAC3CH,aAAA,CAACH,KAAK;IACLH,KAAK,EAAGA,KAAO;IACfK,mBAAmB,EAAGA;EAAqB,CAC3C,CAAC,EACFC,aAAA,CAACX,IAAI;IAACmB,OAAO,EAAC,YAAY;IAACC,GAAG,EAAG;EAAG,GACjChB,aAAa,CAACiB,GAAG,CAAIC,WAAW,IACjCX,aAAA,CAACd,MAAM;IACN0B,GAAG,EAAGD,WAAW,CAACf,KAAO;IACzBiB,SAAS,EAAGT,eAAiB;IAC7BT,IAAI,EAAGgB,WAAW,CAAChB,IAAM;IACzBmB,OAAO;IACPC,SAAS,EAAGJ,WAAW,CAACf,KAAK,KAAKA,KAAO;IACzCoB,OAAO,EAAGA,CAAA,KACTX,QAAQ,CACPM,WAAW,CAACf,KAAK,KAAKA,KAAK,GACxBqB,SAAS,GACTN,WAAW,CAACf,KAChB,CACA;IACD,cAAae,WAAW,CAACjB,KAAO;IAChCA,KAAK,EAAGiB,WAAW,CAACjB,KAAO;IAC3BwB,WAAW,EAAG;EAAM,CACpB,CACA,CACG,CACD,CAAC;AAET,CAAC;AAED,MAAMC,iCAAiC,GAAG5B,cAAc,CACvDW,wBAAwB,EACxB,0BACD,CAAC;AAED,eAAeiB,iCAAiC"}
1
+ {"version":3,"names":["lineDashed","lineDotted","lineSolid","__","Button","StyledLabel","View","Flex","VisuallyHidden","contextConnect","useBorderControlStylePicker","BORDER_STYLES","label","icon","value","Label","props","hideLabelFromVision","createElement","as","BorderControlStylePicker","forwardedRef","buttonClassName","onChange","otherProps","ref","justify","gap","map","borderStyle","key","className","size","isPressed","onClick","undefined","showTooltip","ConnectedBorderControlStylePicker"],"sources":["@wordpress/components/src/border-control/border-control-style-picker/component.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { lineDashed, lineDotted, lineSolid } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../../button';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport { View } from '../../view';\nimport { Flex } from '../../flex';\nimport { VisuallyHidden } from '../../visually-hidden';\nimport type { WordPressComponentProps } from '../../context';\nimport { contextConnect } from '../../context';\nimport { useBorderControlStylePicker } from './hook';\n\nimport type { LabelProps, StylePickerProps } from '../types';\n\nconst BORDER_STYLES = [\n\t{ label: __( 'Solid' ), icon: lineSolid, value: 'solid' },\n\t{ label: __( 'Dashed' ), icon: lineDashed, value: 'dashed' },\n\t{ label: __( 'Dotted' ), icon: lineDotted, value: 'dotted' },\n];\n\nconst Label = ( props: LabelProps ) => {\n\tconst { label, hideLabelFromVision } = props;\n\n\tif ( ! label ) {\n\t\treturn null;\n\t}\n\n\treturn hideLabelFromVision ? (\n\t\t<VisuallyHidden as=\"label\">{ label }</VisuallyHidden>\n\t) : (\n\t\t<StyledLabel>{ label }</StyledLabel>\n\t);\n};\n\nconst BorderControlStylePicker = (\n\tprops: WordPressComponentProps< StylePickerProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\tbuttonClassName,\n\t\thideLabelFromVision,\n\t\tlabel,\n\t\tonChange,\n\t\tvalue,\n\t\t...otherProps\n\t} = useBorderControlStylePicker( props );\n\n\treturn (\n\t\t<View { ...otherProps } ref={ forwardedRef }>\n\t\t\t<Label\n\t\t\t\tlabel={ label }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t/>\n\t\t\t<Flex justify=\"flex-start\" gap={ 1 }>\n\t\t\t\t{ BORDER_STYLES.map( ( borderStyle ) => (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tkey={ borderStyle.value }\n\t\t\t\t\t\tclassName={ buttonClassName }\n\t\t\t\t\t\ticon={ borderStyle.icon }\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tisPressed={ borderStyle.value === value }\n\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\tonChange(\n\t\t\t\t\t\t\t\tborderStyle.value === value\n\t\t\t\t\t\t\t\t\t? undefined\n\t\t\t\t\t\t\t\t\t: borderStyle.value\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t\taria-label={ borderStyle.label }\n\t\t\t\t\t\tlabel={ borderStyle.label }\n\t\t\t\t\t\tshowTooltip={ true }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</Flex>\n\t\t</View>\n\t);\n};\n\nconst ConnectedBorderControlStylePicker = contextConnect(\n\tBorderControlStylePicker,\n\t'BorderControlStylePicker'\n);\n\nexport default ConnectedBorderControlStylePicker;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,UAAU,EAAEC,UAAU,EAAEC,SAAS,QAAQ,kBAAkB;AACpE,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,OAAOC,MAAM,MAAM,cAAc;AACjC,SAASC,WAAW,QAAQ,+CAA+C;AAC3E,SAASC,IAAI,QAAQ,YAAY;AACjC,SAASC,IAAI,QAAQ,YAAY;AACjC,SAASC,cAAc,QAAQ,uBAAuB;AAEtD,SAASC,cAAc,QAAQ,eAAe;AAC9C,SAASC,2BAA2B,QAAQ,QAAQ;AAIpD,MAAMC,aAAa,GAAG,CACrB;EAAEC,KAAK,EAAET,EAAE,CAAE,OAAQ,CAAC;EAAEU,IAAI,EAAEX,SAAS;EAAEY,KAAK,EAAE;AAAQ,CAAC,EACzD;EAAEF,KAAK,EAAET,EAAE,CAAE,QAAS,CAAC;EAAEU,IAAI,EAAEb,UAAU;EAAEc,KAAK,EAAE;AAAS,CAAC,EAC5D;EAAEF,KAAK,EAAET,EAAE,CAAE,QAAS,CAAC;EAAEU,IAAI,EAAEZ,UAAU;EAAEa,KAAK,EAAE;AAAS,CAAC,CAC5D;AAED,MAAMC,KAAK,GAAKC,KAAiB,IAAM;EACtC,MAAM;IAAEJ,KAAK;IAAEK;EAAoB,CAAC,GAAGD,KAAK;EAE5C,IAAK,CAAEJ,KAAK,EAAG;IACd,OAAO,IAAI;EACZ;EAEA,OAAOK,mBAAmB,GACzBC,aAAA,CAACV,cAAc;IAACW,EAAE,EAAC;EAAO,GAAGP,KAAuB,CAAC,GAErDM,aAAA,CAACb,WAAW,QAAGO,KAAoB,CACnC;AACF,CAAC;AAED,MAAMQ,wBAAwB,GAAGA,CAChCJ,KAAyD,EACzDK,YAAuC,KACnC;EACJ,MAAM;IACLC,eAAe;IACfL,mBAAmB;IACnBL,KAAK;IACLW,QAAQ;IACRT,KAAK;IACL,GAAGU;EACJ,CAAC,GAAGd,2BAA2B,CAAEM,KAAM,CAAC;EAExC,OACCE,aAAA,CAACZ,IAAI;IAAA,GAAMkB,UAAU;IAAGC,GAAG,EAAGJ;EAAc,GAC3CH,aAAA,CAACH,KAAK;IACLH,KAAK,EAAGA,KAAO;IACfK,mBAAmB,EAAGA;EAAqB,CAC3C,CAAC,EACFC,aAAA,CAACX,IAAI;IAACmB,OAAO,EAAC,YAAY;IAACC,GAAG,EAAG;EAAG,GACjChB,aAAa,CAACiB,GAAG,CAAIC,WAAW,IACjCX,aAAA,CAACd,MAAM;IACN0B,GAAG,EAAGD,WAAW,CAACf,KAAO;IACzBiB,SAAS,EAAGT,eAAiB;IAC7BT,IAAI,EAAGgB,WAAW,CAAChB,IAAM;IACzBmB,IAAI,EAAC,OAAO;IACZC,SAAS,EAAGJ,WAAW,CAACf,KAAK,KAAKA,KAAO;IACzCoB,OAAO,EAAGA,CAAA,KACTX,QAAQ,CACPM,WAAW,CAACf,KAAK,KAAKA,KAAK,GACxBqB,SAAS,GACTN,WAAW,CAACf,KAChB,CACA;IACD,cAAae,WAAW,CAACjB,KAAO;IAChCA,KAAK,EAAGiB,WAAW,CAACjB,KAAO;IAC3BwB,WAAW,EAAG;EAAM,CACpB,CACA,CACG,CACD,CAAC;AAET,CAAC;AAED,MAAMC,iCAAiC,GAAG5B,cAAc,CACvDW,wBAAwB,EACxB,0BACD,CAAC;AAED,eAAeiB,iCAAiC"}
@@ -134,7 +134,7 @@ function BoxControl({
134
134
  }, label)), allowReset && createElement(FlexItem, null, createElement(Button, {
135
135
  className: "component-box-control__reset-button",
136
136
  variant: "secondary",
137
- isSmall: true,
137
+ size: "small",
138
138
  onClick: handleOnReset,
139
139
  disabled: !isDirty
140
140
  }, __('Reset')))), createElement(HeaderControlWrapper, {
@@ -1 +1 @@
1
- {"version":3,"names":["useInstanceId","useState","__","BaseControl","Button","FlexItem","FlexBlock","AllInputControl","InputControls","AxialInputControls","BoxControlIcon","LinkedButton","Root","Header","HeaderControlWrapper","parseQuantityAndUnitFromRawValue","DEFAULT_VALUES","getInitialSide","isValuesMixed","isValuesDefined","useControlledState","defaultInputProps","min","noop","useUniqueId","idProp","instanceId","BoxControl","id","inputProps","onChange","label","values","valuesProp","units","sides","splitOnAxis","allowReset","resetValues","onMouseOver","onMouseOut","setValues","fallback","inputValues","hasInitialValue","hasOneSide","length","isDirty","setIsDirty","isLinked","setIsLinked","side","setSide","selectedUnits","setSelectedUnits","top","right","bottom","left","headingId","toggleLinked","handleOnFocus","_event","nextSide","handleOnChange","nextValues","handleOnReset","inputControlProps","onFocus","createElement","role","className","VisualLabel","variant","isSmall","onClick","disabled","applyValueToSides"],"sources":["@wordpress/components/src/box-control/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { BaseControl } from '../base-control';\nimport Button from '../button';\nimport { FlexItem, FlexBlock } from '../flex';\nimport AllInputControl from './all-input-control';\nimport InputControls from './input-controls';\nimport AxialInputControls from './axial-input-controls';\nimport BoxControlIcon from './icon';\nimport LinkedButton from './linked-button';\nimport {\n\tRoot,\n\tHeader,\n\tHeaderControlWrapper,\n} from './styles/box-control-styles';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';\nimport {\n\tDEFAULT_VALUES,\n\tgetInitialSide,\n\tisValuesMixed,\n\tisValuesDefined,\n} from './utils';\nimport { useControlledState } from '../utils/hooks';\nimport type {\n\tBoxControlIconProps,\n\tBoxControlProps,\n\tBoxControlValue,\n} from './types';\n\nconst defaultInputProps = {\n\tmin: 0,\n};\n\nconst noop = () => {};\n\nfunction useUniqueId( idProp?: string ) {\n\tconst instanceId = useInstanceId( BoxControl, 'inspector-box-control' );\n\n\treturn idProp || instanceId;\n}\n\n/**\n * BoxControl components let users set values for Top, Right, Bottom, and Left.\n * This can be used as an input control for values like `padding` or `margin`.\n *\n * ```jsx\n * import { __experimentalBoxControl as BoxControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const Example = () => {\n * \tconst [ values, setValues ] = useState( {\n * \t\ttop: '50px',\n * \t\tleft: '10%',\n * \t\tright: '10%',\n * \t\tbottom: '50px',\n * \t} );\n *\n * \treturn (\n * \t\t<BoxControl\n * \t\t\tvalues={ values }\n * \t\t\tonChange={ ( nextValues ) => setValues( nextValues ) }\n * \t\t/>\n * \t);\n * };\n * ```\n */\nfunction BoxControl( {\n\tid: idProp,\n\tinputProps = defaultInputProps,\n\tonChange = noop,\n\tlabel = __( 'Box Control' ),\n\tvalues: valuesProp,\n\tunits,\n\tsides,\n\tsplitOnAxis = false,\n\tallowReset = true,\n\tresetValues = DEFAULT_VALUES,\n\tonMouseOver,\n\tonMouseOut,\n}: BoxControlProps ) {\n\tconst [ values, setValues ] = useControlledState( valuesProp, {\n\t\tfallback: DEFAULT_VALUES,\n\t} );\n\tconst inputValues = values || DEFAULT_VALUES;\n\tconst hasInitialValue = isValuesDefined( valuesProp );\n\tconst hasOneSide = sides?.length === 1;\n\n\tconst [ isDirty, setIsDirty ] = useState( hasInitialValue );\n\tconst [ isLinked, setIsLinked ] = useState(\n\t\t! hasInitialValue || ! isValuesMixed( inputValues ) || hasOneSide\n\t);\n\n\tconst [ side, setSide ] = useState< BoxControlIconProps[ 'side' ] >(\n\t\tgetInitialSide( isLinked, splitOnAxis )\n\t);\n\n\t// Tracking selected units via internal state allows filtering of CSS unit\n\t// only values from being saved while maintaining preexisting unit selection\n\t// behaviour. Filtering CSS only values prevents invalid style values.\n\tconst [ selectedUnits, setSelectedUnits ] = useState< BoxControlValue >( {\n\t\ttop: parseQuantityAndUnitFromRawValue( valuesProp?.top )[ 1 ],\n\t\tright: parseQuantityAndUnitFromRawValue( valuesProp?.right )[ 1 ],\n\t\tbottom: parseQuantityAndUnitFromRawValue( valuesProp?.bottom )[ 1 ],\n\t\tleft: parseQuantityAndUnitFromRawValue( valuesProp?.left )[ 1 ],\n\t} );\n\n\tconst id = useUniqueId( idProp );\n\tconst headingId = `${ id }-heading`;\n\n\tconst toggleLinked = () => {\n\t\tsetIsLinked( ! isLinked );\n\t\tsetSide( getInitialSide( ! isLinked, splitOnAxis ) );\n\t};\n\n\tconst handleOnFocus = (\n\t\t_event: React.FocusEvent< HTMLInputElement >,\n\t\t{ side: nextSide }: { side: typeof side }\n\t) => {\n\t\tsetSide( nextSide );\n\t};\n\n\tconst handleOnChange = ( nextValues: BoxControlValue ) => {\n\t\tonChange( nextValues );\n\t\tsetValues( nextValues );\n\t\tsetIsDirty( true );\n\t};\n\n\tconst handleOnReset = () => {\n\t\tonChange( resetValues );\n\t\tsetValues( resetValues );\n\t\tsetSelectedUnits( resetValues );\n\t\tsetIsDirty( false );\n\t};\n\n\tconst inputControlProps = {\n\t\t...inputProps,\n\t\tonChange: handleOnChange,\n\t\tonFocus: handleOnFocus,\n\t\tisLinked,\n\t\tunits,\n\t\tselectedUnits,\n\t\tsetSelectedUnits,\n\t\tsides,\n\t\tvalues: inputValues,\n\t\tonMouseOver,\n\t\tonMouseOut,\n\t};\n\n\treturn (\n\t\t<Root id={ id } role=\"group\" aria-labelledby={ headingId }>\n\t\t\t<Header className=\"component-box-control__header\">\n\t\t\t\t<FlexItem>\n\t\t\t\t\t<BaseControl.VisualLabel id={ headingId }>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t</FlexItem>\n\t\t\t\t{ allowReset && (\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"component-box-control__reset-button\"\n\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\tonClick={ handleOnReset }\n\t\t\t\t\t\t\tdisabled={ ! isDirty }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Reset' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t) }\n\t\t\t</Header>\n\t\t\t<HeaderControlWrapper className=\"component-box-control__header-control-wrapper\">\n\t\t\t\t<FlexItem>\n\t\t\t\t\t<BoxControlIcon side={ side } sides={ sides } />\n\t\t\t\t</FlexItem>\n\t\t\t\t{ isLinked && (\n\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t<AllInputControl\n\t\t\t\t\t\t\taria-label={ label }\n\t\t\t\t\t\t\t{ ...inputControlProps }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexBlock>\n\t\t\t\t) }\n\t\t\t\t{ ! isLinked && splitOnAxis && (\n\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t<AxialInputControls { ...inputControlProps } />\n\t\t\t\t\t</FlexBlock>\n\t\t\t\t) }\n\t\t\t\t{ ! hasOneSide && (\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<LinkedButton\n\t\t\t\t\t\t\tonClick={ toggleLinked }\n\t\t\t\t\t\t\tisLinked={ isLinked }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t) }\n\t\t\t</HeaderControlWrapper>\n\t\t\t{ ! isLinked && ! splitOnAxis && (\n\t\t\t\t<InputControls { ...inputControlProps } />\n\t\t\t) }\n\t\t</Root>\n\t);\n}\n\nexport { applyValueToSides } from './utils';\nexport default BoxControl;\n"],"mappings":"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"}
1
+ {"version":3,"names":["useInstanceId","useState","__","BaseControl","Button","FlexItem","FlexBlock","AllInputControl","InputControls","AxialInputControls","BoxControlIcon","LinkedButton","Root","Header","HeaderControlWrapper","parseQuantityAndUnitFromRawValue","DEFAULT_VALUES","getInitialSide","isValuesMixed","isValuesDefined","useControlledState","defaultInputProps","min","noop","useUniqueId","idProp","instanceId","BoxControl","id","inputProps","onChange","label","values","valuesProp","units","sides","splitOnAxis","allowReset","resetValues","onMouseOver","onMouseOut","setValues","fallback","inputValues","hasInitialValue","hasOneSide","length","isDirty","setIsDirty","isLinked","setIsLinked","side","setSide","selectedUnits","setSelectedUnits","top","right","bottom","left","headingId","toggleLinked","handleOnFocus","_event","nextSide","handleOnChange","nextValues","handleOnReset","inputControlProps","onFocus","createElement","role","className","VisualLabel","variant","size","onClick","disabled","applyValueToSides"],"sources":["@wordpress/components/src/box-control/index.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useInstanceId } from '@wordpress/compose';\nimport { useState } from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { BaseControl } from '../base-control';\nimport Button from '../button';\nimport { FlexItem, FlexBlock } from '../flex';\nimport AllInputControl from './all-input-control';\nimport InputControls from './input-controls';\nimport AxialInputControls from './axial-input-controls';\nimport BoxControlIcon from './icon';\nimport LinkedButton from './linked-button';\nimport {\n\tRoot,\n\tHeader,\n\tHeaderControlWrapper,\n} from './styles/box-control-styles';\nimport { parseQuantityAndUnitFromRawValue } from '../unit-control/utils';\nimport {\n\tDEFAULT_VALUES,\n\tgetInitialSide,\n\tisValuesMixed,\n\tisValuesDefined,\n} from './utils';\nimport { useControlledState } from '../utils/hooks';\nimport type {\n\tBoxControlIconProps,\n\tBoxControlProps,\n\tBoxControlValue,\n} from './types';\n\nconst defaultInputProps = {\n\tmin: 0,\n};\n\nconst noop = () => {};\n\nfunction useUniqueId( idProp?: string ) {\n\tconst instanceId = useInstanceId( BoxControl, 'inspector-box-control' );\n\n\treturn idProp || instanceId;\n}\n\n/**\n * BoxControl components let users set values for Top, Right, Bottom, and Left.\n * This can be used as an input control for values like `padding` or `margin`.\n *\n * ```jsx\n * import { __experimentalBoxControl as BoxControl } from '@wordpress/components';\n * import { useState } from '@wordpress/element';\n *\n * const Example = () => {\n * \tconst [ values, setValues ] = useState( {\n * \t\ttop: '50px',\n * \t\tleft: '10%',\n * \t\tright: '10%',\n * \t\tbottom: '50px',\n * \t} );\n *\n * \treturn (\n * \t\t<BoxControl\n * \t\t\tvalues={ values }\n * \t\t\tonChange={ ( nextValues ) => setValues( nextValues ) }\n * \t\t/>\n * \t);\n * };\n * ```\n */\nfunction BoxControl( {\n\tid: idProp,\n\tinputProps = defaultInputProps,\n\tonChange = noop,\n\tlabel = __( 'Box Control' ),\n\tvalues: valuesProp,\n\tunits,\n\tsides,\n\tsplitOnAxis = false,\n\tallowReset = true,\n\tresetValues = DEFAULT_VALUES,\n\tonMouseOver,\n\tonMouseOut,\n}: BoxControlProps ) {\n\tconst [ values, setValues ] = useControlledState( valuesProp, {\n\t\tfallback: DEFAULT_VALUES,\n\t} );\n\tconst inputValues = values || DEFAULT_VALUES;\n\tconst hasInitialValue = isValuesDefined( valuesProp );\n\tconst hasOneSide = sides?.length === 1;\n\n\tconst [ isDirty, setIsDirty ] = useState( hasInitialValue );\n\tconst [ isLinked, setIsLinked ] = useState(\n\t\t! hasInitialValue || ! isValuesMixed( inputValues ) || hasOneSide\n\t);\n\n\tconst [ side, setSide ] = useState< BoxControlIconProps[ 'side' ] >(\n\t\tgetInitialSide( isLinked, splitOnAxis )\n\t);\n\n\t// Tracking selected units via internal state allows filtering of CSS unit\n\t// only values from being saved while maintaining preexisting unit selection\n\t// behaviour. Filtering CSS only values prevents invalid style values.\n\tconst [ selectedUnits, setSelectedUnits ] = useState< BoxControlValue >( {\n\t\ttop: parseQuantityAndUnitFromRawValue( valuesProp?.top )[ 1 ],\n\t\tright: parseQuantityAndUnitFromRawValue( valuesProp?.right )[ 1 ],\n\t\tbottom: parseQuantityAndUnitFromRawValue( valuesProp?.bottom )[ 1 ],\n\t\tleft: parseQuantityAndUnitFromRawValue( valuesProp?.left )[ 1 ],\n\t} );\n\n\tconst id = useUniqueId( idProp );\n\tconst headingId = `${ id }-heading`;\n\n\tconst toggleLinked = () => {\n\t\tsetIsLinked( ! isLinked );\n\t\tsetSide( getInitialSide( ! isLinked, splitOnAxis ) );\n\t};\n\n\tconst handleOnFocus = (\n\t\t_event: React.FocusEvent< HTMLInputElement >,\n\t\t{ side: nextSide }: { side: typeof side }\n\t) => {\n\t\tsetSide( nextSide );\n\t};\n\n\tconst handleOnChange = ( nextValues: BoxControlValue ) => {\n\t\tonChange( nextValues );\n\t\tsetValues( nextValues );\n\t\tsetIsDirty( true );\n\t};\n\n\tconst handleOnReset = () => {\n\t\tonChange( resetValues );\n\t\tsetValues( resetValues );\n\t\tsetSelectedUnits( resetValues );\n\t\tsetIsDirty( false );\n\t};\n\n\tconst inputControlProps = {\n\t\t...inputProps,\n\t\tonChange: handleOnChange,\n\t\tonFocus: handleOnFocus,\n\t\tisLinked,\n\t\tunits,\n\t\tselectedUnits,\n\t\tsetSelectedUnits,\n\t\tsides,\n\t\tvalues: inputValues,\n\t\tonMouseOver,\n\t\tonMouseOut,\n\t};\n\n\treturn (\n\t\t<Root id={ id } role=\"group\" aria-labelledby={ headingId }>\n\t\t\t<Header className=\"component-box-control__header\">\n\t\t\t\t<FlexItem>\n\t\t\t\t\t<BaseControl.VisualLabel id={ headingId }>\n\t\t\t\t\t\t{ label }\n\t\t\t\t\t</BaseControl.VisualLabel>\n\t\t\t\t</FlexItem>\n\t\t\t\t{ allowReset && (\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"component-box-control__reset-button\"\n\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tonClick={ handleOnReset }\n\t\t\t\t\t\t\tdisabled={ ! isDirty }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Reset' ) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t) }\n\t\t\t</Header>\n\t\t\t<HeaderControlWrapper className=\"component-box-control__header-control-wrapper\">\n\t\t\t\t<FlexItem>\n\t\t\t\t\t<BoxControlIcon side={ side } sides={ sides } />\n\t\t\t\t</FlexItem>\n\t\t\t\t{ isLinked && (\n\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t<AllInputControl\n\t\t\t\t\t\t\taria-label={ label }\n\t\t\t\t\t\t\t{ ...inputControlProps }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexBlock>\n\t\t\t\t) }\n\t\t\t\t{ ! isLinked && splitOnAxis && (\n\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t<AxialInputControls { ...inputControlProps } />\n\t\t\t\t\t</FlexBlock>\n\t\t\t\t) }\n\t\t\t\t{ ! hasOneSide && (\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<LinkedButton\n\t\t\t\t\t\t\tonClick={ toggleLinked }\n\t\t\t\t\t\t\tisLinked={ isLinked }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t) }\n\t\t\t</HeaderControlWrapper>\n\t\t\t{ ! isLinked && ! splitOnAxis && (\n\t\t\t\t<InputControls { ...inputControlProps } />\n\t\t\t) }\n\t\t</Root>\n\t);\n}\n\nexport { applyValueToSides } from './utils';\nexport default BoxControl;\n"],"mappings":"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"}
@@ -20,7 +20,7 @@ export default function LinkedButton({
20
20
  }, createElement(Button, {
21
21
  ...props,
22
22
  className: "component-box-control__linked-button",
23
- isSmall: true,
23
+ size: "small",
24
24
  icon: isLinked ? link : linkOff,
25
25
  iconSize: 24,
26
26
  "aria-label": label
@@ -1 +1 @@
1
- {"version":3,"names":["link","linkOff","__","Button","Tooltip","LinkedButton","isLinked","props","label","createElement","text","className","isSmall","icon","iconSize"],"sources":["@wordpress/components/src/box-control/linked-button.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { link, linkOff } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport Tooltip from '../tooltip';\n\nexport default function LinkedButton( {\n\tisLinked,\n\t...props\n}: { isLinked?: boolean } & React.ComponentProps< typeof Button > ) {\n\tconst label = isLinked ? __( 'Unlink sides' ) : __( 'Link sides' );\n\n\treturn (\n\t\t<Tooltip text={ label }>\n\t\t\t<Button\n\t\t\t\t{ ...props }\n\t\t\t\tclassName=\"component-box-control__linked-button\"\n\t\t\t\tisSmall\n\t\t\t\ticon={ isLinked ? link : linkOff }\n\t\t\t\ticonSize={ 24 }\n\t\t\t\taria-label={ label }\n\t\t\t/>\n\t\t</Tooltip>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,IAAI,EAAEC,OAAO,QAAQ,kBAAkB;AAChD,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,OAAOC,MAAM,MAAM,WAAW;AAC9B,OAAOC,OAAO,MAAM,YAAY;AAEhC,eAAe,SAASC,YAAYA,CAAE;EACrCC,QAAQ;EACR,GAAGC;AAC4D,CAAC,EAAG;EACnE,MAAMC,KAAK,GAAGF,QAAQ,GAAGJ,EAAE,CAAE,cAAe,CAAC,GAAGA,EAAE,CAAE,YAAa,CAAC;EAElE,OACCO,aAAA,CAACL,OAAO;IAACM,IAAI,EAAGF;EAAO,GACtBC,aAAA,CAACN,MAAM;IAAA,GACDI,KAAK;IACVI,SAAS,EAAC,sCAAsC;IAChDC,OAAO;IACPC,IAAI,EAAGP,QAAQ,GAAGN,IAAI,GAAGC,OAAS;IAClCa,QAAQ,EAAG,EAAI;IACf,cAAaN;EAAO,CACpB,CACO,CAAC;AAEZ"}
1
+ {"version":3,"names":["link","linkOff","__","Button","Tooltip","LinkedButton","isLinked","props","label","createElement","text","className","size","icon","iconSize"],"sources":["@wordpress/components/src/box-control/linked-button.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { link, linkOff } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport Tooltip from '../tooltip';\n\nexport default function LinkedButton( {\n\tisLinked,\n\t...props\n}: { isLinked?: boolean } & React.ComponentProps< typeof Button > ) {\n\tconst label = isLinked ? __( 'Unlink sides' ) : __( 'Link sides' );\n\n\treturn (\n\t\t<Tooltip text={ label }>\n\t\t\t<Button\n\t\t\t\t{ ...props }\n\t\t\t\tclassName=\"component-box-control__linked-button\"\n\t\t\t\tsize=\"small\"\n\t\t\t\ticon={ isLinked ? link : linkOff }\n\t\t\t\ticonSize={ 24 }\n\t\t\t\taria-label={ label }\n\t\t\t/>\n\t\t</Tooltip>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,IAAI,EAAEC,OAAO,QAAQ,kBAAkB;AAChD,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,OAAOC,MAAM,MAAM,WAAW;AAC9B,OAAOC,OAAO,MAAM,YAAY;AAEhC,eAAe,SAASC,YAAYA,CAAE;EACrCC,QAAQ;EACR,GAAGC;AAC4D,CAAC,EAAG;EACnE,MAAMC,KAAK,GAAGF,QAAQ,GAAGJ,EAAE,CAAE,cAAe,CAAC,GAAGA,EAAE,CAAE,YAAa,CAAC;EAElE,OACCO,aAAA,CAACL,OAAO;IAACM,IAAI,EAAGF;EAAO,GACtBC,aAAA,CAACN,MAAM;IAAA,GACDI,KAAK;IACVI,SAAS,EAAC,sCAAsC;IAChDC,IAAI,EAAC,OAAO;IACZC,IAAI,EAAGP,QAAQ,GAAGN,IAAI,GAAGC,OAAS;IAClCa,QAAQ,EAAG,EAAI;IACf,cAAaN;EAAO,CACpB,CACO,CAAC;AAEZ"}
@@ -123,7 +123,7 @@ export function UnforwardedButton(props, ref) {
123
123
  'is-busy': isBusy,
124
124
  'is-link': variant === 'link',
125
125
  'is-destructive': isDestructive,
126
- 'has-text': !!icon && hasChildren,
126
+ 'has-text': !!icon && (hasChildren || text),
127
127
  'has-icon': !!icon
128
128
  });
129
129
  const trulyDisabled = disabled && !isFocusable;
@@ -1 +1 @@
1
- {"version":3,"names":["classnames","deprecated","forwardRef","useInstanceId","Tooltip","Icon","VisuallyHidden","positionToPlacement","disabledEventsOnDisabledButton","useDeprecatedProps","isDefault","isPrimary","isSecondary","isTertiary","isLink","isPressed","isSmall","size","variant","otherProps","computedSize","computedVariant","newProps","_computedSize","_computedVariant","_computedVariant2","_computedVariant3","_computedVariant4","since","alternative","version","_computedVariant5","UnforwardedButton","props","ref","__next40pxDefaultSize","isBusy","isDestructive","className","disabled","icon","iconPosition","iconSize","showTooltip","tooltipPosition","shortcut","label","children","text","__experimentalIsFocusable","isFocusable","describedBy","buttonOrAnchorProps","href","target","ariaChecked","ariaPressed","ariaSelected","additionalProps","undefined","instanceId","Button","hasChildren","Array","isArray","truthyAriaPressedValues","classes","includes","trulyDisabled","Tag","buttonProps","type","anchorProps","disabledEvent","event","stopPropagation","preventDefault","shouldShowTooltip","length","descriptionId","describedById","commonProps","elementChildren","createElement","Fragment","element","computedPlacement","id","placement"],"sources":["@wordpress/components/src/button/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type {\n\tComponentPropsWithoutRef,\n\tForwardedRef,\n\tHTMLAttributes,\n\tMouseEvent,\n\tReactElement,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Tooltip from '../tooltip';\nimport Icon from '../icon';\nimport { VisuallyHidden } from '../visually-hidden';\nimport type { ButtonProps, DeprecatedButtonProps } from './types';\nimport { positionToPlacement } from '../popover/utils';\n\nconst disabledEventsOnDisabledButton = [ 'onMouseDown', 'onClick' ] as const;\n\nfunction useDeprecatedProps( {\n\tisDefault,\n\tisPrimary,\n\tisSecondary,\n\tisTertiary,\n\tisLink,\n\tisPressed,\n\tisSmall,\n\tsize,\n\tvariant,\n\t...otherProps\n}: ButtonProps & DeprecatedButtonProps ): ButtonProps {\n\tlet computedSize = size;\n\tlet computedVariant = variant;\n\n\tconst newProps: { 'aria-pressed'?: boolean } = {\n\t\t// @TODO Mark `isPressed` as deprecated\n\t\t'aria-pressed': isPressed,\n\t};\n\n\tif ( isSmall ) {\n\t\tcomputedSize ??= 'small';\n\t}\n\n\tif ( isPrimary ) {\n\t\tcomputedVariant ??= 'primary';\n\t}\n\n\tif ( isTertiary ) {\n\t\tcomputedVariant ??= 'tertiary';\n\t}\n\n\tif ( isSecondary ) {\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isDefault ) {\n\t\tdeprecated( 'Button isDefault prop', {\n\t\t\tsince: '5.4',\n\t\t\talternative: 'variant=\"secondary\"',\n\t\t\tversion: '6.2',\n\t\t} );\n\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isLink ) {\n\t\tcomputedVariant ??= 'link';\n\t}\n\n\treturn {\n\t\t...newProps,\n\t\t...otherProps,\n\t\tsize: computedSize,\n\t\tvariant: computedVariant,\n\t};\n}\n\nexport function UnforwardedButton(\n\tprops: ButtonProps,\n\tref: ForwardedRef< any >\n) {\n\tconst {\n\t\t__next40pxDefaultSize,\n\t\tisBusy,\n\t\tisDestructive,\n\t\tclassName,\n\t\tdisabled,\n\t\ticon,\n\t\ticonPosition = 'left',\n\t\ticonSize,\n\t\tshowTooltip,\n\t\ttooltipPosition,\n\t\tshortcut,\n\t\tlabel,\n\t\tchildren,\n\t\tsize = 'default',\n\t\ttext,\n\t\tvariant,\n\t\t__experimentalIsFocusable: isFocusable,\n\t\tdescribedBy,\n\t\t...buttonOrAnchorProps\n\t} = useDeprecatedProps( props );\n\n\tconst {\n\t\thref,\n\t\ttarget,\n\t\t'aria-checked': ariaChecked,\n\t\t'aria-pressed': ariaPressed,\n\t\t'aria-selected': ariaSelected,\n\t\t...additionalProps\n\t} = 'href' in buttonOrAnchorProps\n\t\t? buttonOrAnchorProps\n\t\t: { href: undefined, target: undefined, ...buttonOrAnchorProps };\n\n\tconst instanceId = useInstanceId(\n\t\tButton,\n\t\t'components-button__description'\n\t);\n\n\tconst hasChildren =\n\t\t( 'string' === typeof children && !! children ) ||\n\t\t( Array.isArray( children ) &&\n\t\t\tchildren?.[ 0 ] &&\n\t\t\tchildren[ 0 ] !== null &&\n\t\t\t// Tooltip should not considered as a child\n\t\t\tchildren?.[ 0 ]?.props?.className !== 'components-tooltip' );\n\n\tconst truthyAriaPressedValues: ( typeof ariaPressed )[] = [\n\t\ttrue,\n\t\t'true',\n\t\t'mixed',\n\t];\n\n\tconst classes = classnames( 'components-button', className, {\n\t\t'is-next-40px-default-size': __next40pxDefaultSize,\n\t\t'is-secondary': variant === 'secondary',\n\t\t'is-primary': variant === 'primary',\n\t\t'is-small': size === 'small',\n\t\t'is-compact': size === 'compact',\n\t\t'is-tertiary': variant === 'tertiary',\n\n\t\t'is-pressed': truthyAriaPressedValues.includes( ariaPressed ),\n\t\t'is-pressed-mixed': ariaPressed === 'mixed',\n\n\t\t'is-busy': isBusy,\n\t\t'is-link': variant === 'link',\n\t\t'is-destructive': isDestructive,\n\t\t'has-text': !! icon && hasChildren,\n\t\t'has-icon': !! icon,\n\t} );\n\n\tconst trulyDisabled = disabled && ! isFocusable;\n\tconst Tag = href !== undefined && ! trulyDisabled ? 'a' : 'button';\n\tconst buttonProps: ComponentPropsWithoutRef< 'button' > =\n\t\tTag === 'button'\n\t\t\t? {\n\t\t\t\t\ttype: 'button',\n\t\t\t\t\tdisabled: trulyDisabled,\n\t\t\t\t\t'aria-checked': ariaChecked,\n\t\t\t\t\t'aria-pressed': ariaPressed,\n\t\t\t\t\t'aria-selected': ariaSelected,\n\t\t\t }\n\t\t\t: {};\n\tconst anchorProps: ComponentPropsWithoutRef< 'a' > =\n\t\tTag === 'a' ? { href, target } : {};\n\n\tif ( disabled && isFocusable ) {\n\t\t// In this case, the button will be disabled, but still focusable and\n\t\t// perceivable by screen reader users.\n\t\tbuttonProps[ 'aria-disabled' ] = true;\n\t\tanchorProps[ 'aria-disabled' ] = true;\n\n\t\tfor ( const disabledEvent of disabledEventsOnDisabledButton ) {\n\t\t\tadditionalProps[ disabledEvent ] = ( event: MouseEvent ) => {\n\t\t\t\tif ( event ) {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t}\n\t\t\t};\n\t\t}\n\t}\n\n\t// Should show the tooltip if...\n\tconst shouldShowTooltip =\n\t\t! trulyDisabled &&\n\t\t// An explicit tooltip is passed or...\n\t\t( ( showTooltip && label ) ||\n\t\t\t// There's a shortcut or...\n\t\t\tshortcut ||\n\t\t\t// There's a label and...\n\t\t\t( !! label &&\n\t\t\t\t// The children are empty and...\n\t\t\t\t! ( children as string | ReactElement[] )?.length &&\n\t\t\t\t// The tooltip is not explicitly disabled.\n\t\t\t\tfalse !== showTooltip ) );\n\n\tconst descriptionId = describedBy ? instanceId : undefined;\n\n\tconst describedById =\n\t\tadditionalProps[ 'aria-describedby' ] || descriptionId;\n\n\tconst commonProps = {\n\t\tclassName: classes,\n\t\t'aria-label': additionalProps[ 'aria-label' ] || label,\n\t\t'aria-describedby': describedById,\n\t\tref,\n\t};\n\n\tconst elementChildren = (\n\t\t<>\n\t\t\t{ icon && iconPosition === 'left' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t\t{ text && <>{ text }</> }\n\t\t\t{ icon && iconPosition === 'right' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t\t{ children }\n\t\t</>\n\t);\n\n\tconst element =\n\t\tTag === 'a' ? (\n\t\t\t<a\n\t\t\t\t{ ...anchorProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLAnchorElement > ) }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</a>\n\t\t) : (\n\t\t\t<button\n\t\t\t\t{ ...buttonProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLButtonElement > ) }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</button>\n\t\t);\n\n\t// Convert legacy `position` values to be used with the new `placement` prop\n\tlet computedPlacement;\n\t// if `tooltipPosition` is defined, compute value to `placement`\n\tif ( tooltipPosition !== undefined ) {\n\t\tcomputedPlacement = positionToPlacement( tooltipPosition );\n\t}\n\n\tif ( ! shouldShowTooltip ) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ element }\n\t\t\t\t{ describedBy && (\n\t\t\t\t\t<VisuallyHidden>\n\t\t\t\t\t\t<span id={ descriptionId }>{ describedBy }</span>\n\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t) }\n\t\t\t</>\n\t\t);\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<Tooltip\n\t\t\t\ttext={\n\t\t\t\t\t( children as string | ReactElement[] )?.length &&\n\t\t\t\t\tdescribedBy\n\t\t\t\t\t\t? describedBy\n\t\t\t\t\t\t: label\n\t\t\t\t}\n\t\t\t\tshortcut={ shortcut }\n\t\t\t\tplacement={ computedPlacement }\n\t\t\t>\n\t\t\t\t{ element }\n\t\t\t</Tooltip>\n\t\t\t{ describedBy && (\n\t\t\t\t<VisuallyHidden>\n\t\t\t\t\t<span id={ descriptionId }>{ describedBy }</span>\n\t\t\t\t</VisuallyHidden>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\n/**\n * Lets users take actions and make choices with a single click or tap.\n *\n * ```jsx\n * import { Button } from '@wordpress/components';\n * const Mybutton = () => (\n * <Button\n * variant=\"primary\"\n * onClick={ handleClick }\n * >\n * Click here\n * </Button>\n * );\n * ```\n */\nexport const Button = forwardRef( UnforwardedButton );\nexport default Button;\n"],"mappings":"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"}
1
+ {"version":3,"names":["classnames","deprecated","forwardRef","useInstanceId","Tooltip","Icon","VisuallyHidden","positionToPlacement","disabledEventsOnDisabledButton","useDeprecatedProps","isDefault","isPrimary","isSecondary","isTertiary","isLink","isPressed","isSmall","size","variant","otherProps","computedSize","computedVariant","newProps","_computedSize","_computedVariant","_computedVariant2","_computedVariant3","_computedVariant4","since","alternative","version","_computedVariant5","UnforwardedButton","props","ref","__next40pxDefaultSize","isBusy","isDestructive","className","disabled","icon","iconPosition","iconSize","showTooltip","tooltipPosition","shortcut","label","children","text","__experimentalIsFocusable","isFocusable","describedBy","buttonOrAnchorProps","href","target","ariaChecked","ariaPressed","ariaSelected","additionalProps","undefined","instanceId","Button","hasChildren","Array","isArray","truthyAriaPressedValues","classes","includes","trulyDisabled","Tag","buttonProps","type","anchorProps","disabledEvent","event","stopPropagation","preventDefault","shouldShowTooltip","length","descriptionId","describedById","commonProps","elementChildren","createElement","Fragment","element","computedPlacement","id","placement"],"sources":["@wordpress/components/src/button/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport type {\n\tComponentPropsWithoutRef,\n\tForwardedRef,\n\tHTMLAttributes,\n\tMouseEvent,\n\tReactElement,\n} from 'react';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { forwardRef } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Tooltip from '../tooltip';\nimport Icon from '../icon';\nimport { VisuallyHidden } from '../visually-hidden';\nimport type { ButtonProps, DeprecatedButtonProps } from './types';\nimport { positionToPlacement } from '../popover/utils';\n\nconst disabledEventsOnDisabledButton = [ 'onMouseDown', 'onClick' ] as const;\n\nfunction useDeprecatedProps( {\n\tisDefault,\n\tisPrimary,\n\tisSecondary,\n\tisTertiary,\n\tisLink,\n\tisPressed,\n\tisSmall,\n\tsize,\n\tvariant,\n\t...otherProps\n}: ButtonProps & DeprecatedButtonProps ): ButtonProps {\n\tlet computedSize = size;\n\tlet computedVariant = variant;\n\n\tconst newProps: { 'aria-pressed'?: boolean } = {\n\t\t// @TODO Mark `isPressed` as deprecated\n\t\t'aria-pressed': isPressed,\n\t};\n\n\tif ( isSmall ) {\n\t\tcomputedSize ??= 'small';\n\t}\n\n\tif ( isPrimary ) {\n\t\tcomputedVariant ??= 'primary';\n\t}\n\n\tif ( isTertiary ) {\n\t\tcomputedVariant ??= 'tertiary';\n\t}\n\n\tif ( isSecondary ) {\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isDefault ) {\n\t\tdeprecated( 'Button isDefault prop', {\n\t\t\tsince: '5.4',\n\t\t\talternative: 'variant=\"secondary\"',\n\t\t\tversion: '6.2',\n\t\t} );\n\n\t\tcomputedVariant ??= 'secondary';\n\t}\n\n\tif ( isLink ) {\n\t\tcomputedVariant ??= 'link';\n\t}\n\n\treturn {\n\t\t...newProps,\n\t\t...otherProps,\n\t\tsize: computedSize,\n\t\tvariant: computedVariant,\n\t};\n}\n\nexport function UnforwardedButton(\n\tprops: ButtonProps,\n\tref: ForwardedRef< any >\n) {\n\tconst {\n\t\t__next40pxDefaultSize,\n\t\tisBusy,\n\t\tisDestructive,\n\t\tclassName,\n\t\tdisabled,\n\t\ticon,\n\t\ticonPosition = 'left',\n\t\ticonSize,\n\t\tshowTooltip,\n\t\ttooltipPosition,\n\t\tshortcut,\n\t\tlabel,\n\t\tchildren,\n\t\tsize = 'default',\n\t\ttext,\n\t\tvariant,\n\t\t__experimentalIsFocusable: isFocusable,\n\t\tdescribedBy,\n\t\t...buttonOrAnchorProps\n\t} = useDeprecatedProps( props );\n\n\tconst {\n\t\thref,\n\t\ttarget,\n\t\t'aria-checked': ariaChecked,\n\t\t'aria-pressed': ariaPressed,\n\t\t'aria-selected': ariaSelected,\n\t\t...additionalProps\n\t} = 'href' in buttonOrAnchorProps\n\t\t? buttonOrAnchorProps\n\t\t: { href: undefined, target: undefined, ...buttonOrAnchorProps };\n\n\tconst instanceId = useInstanceId(\n\t\tButton,\n\t\t'components-button__description'\n\t);\n\n\tconst hasChildren =\n\t\t( 'string' === typeof children && !! children ) ||\n\t\t( Array.isArray( children ) &&\n\t\t\tchildren?.[ 0 ] &&\n\t\t\tchildren[ 0 ] !== null &&\n\t\t\t// Tooltip should not considered as a child\n\t\t\tchildren?.[ 0 ]?.props?.className !== 'components-tooltip' );\n\n\tconst truthyAriaPressedValues: ( typeof ariaPressed )[] = [\n\t\ttrue,\n\t\t'true',\n\t\t'mixed',\n\t];\n\n\tconst classes = classnames( 'components-button', className, {\n\t\t'is-next-40px-default-size': __next40pxDefaultSize,\n\t\t'is-secondary': variant === 'secondary',\n\t\t'is-primary': variant === 'primary',\n\t\t'is-small': size === 'small',\n\t\t'is-compact': size === 'compact',\n\t\t'is-tertiary': variant === 'tertiary',\n\n\t\t'is-pressed': truthyAriaPressedValues.includes( ariaPressed ),\n\t\t'is-pressed-mixed': ariaPressed === 'mixed',\n\n\t\t'is-busy': isBusy,\n\t\t'is-link': variant === 'link',\n\t\t'is-destructive': isDestructive,\n\t\t'has-text': !! icon && ( hasChildren || text ),\n\t\t'has-icon': !! icon,\n\t} );\n\n\tconst trulyDisabled = disabled && ! isFocusable;\n\tconst Tag = href !== undefined && ! trulyDisabled ? 'a' : 'button';\n\tconst buttonProps: ComponentPropsWithoutRef< 'button' > =\n\t\tTag === 'button'\n\t\t\t? {\n\t\t\t\t\ttype: 'button',\n\t\t\t\t\tdisabled: trulyDisabled,\n\t\t\t\t\t'aria-checked': ariaChecked,\n\t\t\t\t\t'aria-pressed': ariaPressed,\n\t\t\t\t\t'aria-selected': ariaSelected,\n\t\t\t }\n\t\t\t: {};\n\tconst anchorProps: ComponentPropsWithoutRef< 'a' > =\n\t\tTag === 'a' ? { href, target } : {};\n\n\tif ( disabled && isFocusable ) {\n\t\t// In this case, the button will be disabled, but still focusable and\n\t\t// perceivable by screen reader users.\n\t\tbuttonProps[ 'aria-disabled' ] = true;\n\t\tanchorProps[ 'aria-disabled' ] = true;\n\n\t\tfor ( const disabledEvent of disabledEventsOnDisabledButton ) {\n\t\t\tadditionalProps[ disabledEvent ] = ( event: MouseEvent ) => {\n\t\t\t\tif ( event ) {\n\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t}\n\t\t\t};\n\t\t}\n\t}\n\n\t// Should show the tooltip if...\n\tconst shouldShowTooltip =\n\t\t! trulyDisabled &&\n\t\t// An explicit tooltip is passed or...\n\t\t( ( showTooltip && label ) ||\n\t\t\t// There's a shortcut or...\n\t\t\tshortcut ||\n\t\t\t// There's a label and...\n\t\t\t( !! label &&\n\t\t\t\t// The children are empty and...\n\t\t\t\t! ( children as string | ReactElement[] )?.length &&\n\t\t\t\t// The tooltip is not explicitly disabled.\n\t\t\t\tfalse !== showTooltip ) );\n\n\tconst descriptionId = describedBy ? instanceId : undefined;\n\n\tconst describedById =\n\t\tadditionalProps[ 'aria-describedby' ] || descriptionId;\n\n\tconst commonProps = {\n\t\tclassName: classes,\n\t\t'aria-label': additionalProps[ 'aria-label' ] || label,\n\t\t'aria-describedby': describedById,\n\t\tref,\n\t};\n\n\tconst elementChildren = (\n\t\t<>\n\t\t\t{ icon && iconPosition === 'left' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t\t{ text && <>{ text }</> }\n\t\t\t{ icon && iconPosition === 'right' && (\n\t\t\t\t<Icon icon={ icon } size={ iconSize } />\n\t\t\t) }\n\t\t\t{ children }\n\t\t</>\n\t);\n\n\tconst element =\n\t\tTag === 'a' ? (\n\t\t\t<a\n\t\t\t\t{ ...anchorProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLAnchorElement > ) }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</a>\n\t\t) : (\n\t\t\t<button\n\t\t\t\t{ ...buttonProps }\n\t\t\t\t{ ...( additionalProps as HTMLAttributes< HTMLButtonElement > ) }\n\t\t\t\t{ ...commonProps }\n\t\t\t>\n\t\t\t\t{ elementChildren }\n\t\t\t</button>\n\t\t);\n\n\t// Convert legacy `position` values to be used with the new `placement` prop\n\tlet computedPlacement;\n\t// if `tooltipPosition` is defined, compute value to `placement`\n\tif ( tooltipPosition !== undefined ) {\n\t\tcomputedPlacement = positionToPlacement( tooltipPosition );\n\t}\n\n\tif ( ! shouldShowTooltip ) {\n\t\treturn (\n\t\t\t<>\n\t\t\t\t{ element }\n\t\t\t\t{ describedBy && (\n\t\t\t\t\t<VisuallyHidden>\n\t\t\t\t\t\t<span id={ descriptionId }>{ describedBy }</span>\n\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t) }\n\t\t\t</>\n\t\t);\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<Tooltip\n\t\t\t\ttext={\n\t\t\t\t\t( children as string | ReactElement[] )?.length &&\n\t\t\t\t\tdescribedBy\n\t\t\t\t\t\t? describedBy\n\t\t\t\t\t\t: label\n\t\t\t\t}\n\t\t\t\tshortcut={ shortcut }\n\t\t\t\tplacement={ computedPlacement }\n\t\t\t>\n\t\t\t\t{ element }\n\t\t\t</Tooltip>\n\t\t\t{ describedBy && (\n\t\t\t\t<VisuallyHidden>\n\t\t\t\t\t<span id={ descriptionId }>{ describedBy }</span>\n\t\t\t\t</VisuallyHidden>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\n/**\n * Lets users take actions and make choices with a single click or tap.\n *\n * ```jsx\n * import { Button } from '@wordpress/components';\n * const Mybutton = () => (\n * <Button\n * variant=\"primary\"\n * onClick={ handleClick }\n * >\n * Click here\n * </Button>\n * );\n * ```\n */\nexport const Button = forwardRef( UnforwardedButton );\nexport default Button;\n"],"mappings":"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"}
@@ -22,7 +22,7 @@ let contentWidth = 0;
22
22
  let scrollPosition = 0;
23
23
  let customIndicatorWidth = 0;
24
24
  function ColorPalette({
25
- enableCustomColor = true,
25
+ enableCustomColor = false,
26
26
  setColor,
27
27
  activeColor,
28
28
  isGradientColor,
@@ -37,23 +37,27 @@ function ColorPalette({
37
37
  customIndicatorWrapperStyles,
38
38
  label
39
39
  }) {
40
- var _defaultSettings$colo, _defaultSettings$allC, _defaultSettings$grad;
40
+ var _defaultSettings$colo, _defaultSettings$grad, _defaultSettings$allC, _defaultSettings$allG;
41
41
  const customSwatchGradients = ['linear-gradient(120deg, rgba(255,0,0,.8) 0%, rgba(255,255,255,1) 70.71%)', 'linear-gradient(240deg, rgba(0,255,0,.8) 0%, rgba(0,255,0,0) 70.71%)', 'linear-gradient(360deg, rgba(0,0,255,.8) 0%, rgba(0,0,255,0) 70.71%)'];
42
42
  const scrollViewRef = useRef();
43
43
  const isIOS = Platform.OS === 'ios';
44
44
  const isGradientSegment = currentSegment === colorsUtils.segments[1];
45
45
  const scale = useRef(new Animated.Value(1)).current;
46
46
  const opacity = useRef(new Animated.Value(1)).current;
47
- const defaultColors = [...new Set(((_defaultSettings$colo = defaultSettings.colors) !== null && _defaultSettings$colo !== void 0 ? _defaultSettings$colo : []).map(({
47
+ const mergedColors = [...new Set(((_defaultSettings$colo = defaultSettings.colors) !== null && _defaultSettings$colo !== void 0 ? _defaultSettings$colo : []).map(({
48
48
  color
49
49
  }) => color))];
50
- const mergedColors = [...new Set(((_defaultSettings$allC = defaultSettings.allColors) !== null && _defaultSettings$allC !== void 0 ? _defaultSettings$allC : []).map(({
50
+ const mergedGradients = [...new Set(((_defaultSettings$grad = defaultSettings.gradients) !== null && _defaultSettings$grad !== void 0 ? _defaultSettings$grad : []).map(({
51
+ gradient
52
+ }) => gradient))];
53
+ const allAvailableColors = [...new Set(((_defaultSettings$allC = defaultSettings.allColors) !== null && _defaultSettings$allC !== void 0 ? _defaultSettings$allC : []).map(({
51
54
  color
52
55
  }) => color))];
53
- const defaultGradientColors = [...new Set(((_defaultSettings$grad = defaultSettings.gradients) !== null && _defaultSettings$grad !== void 0 ? _defaultSettings$grad : []).map(({
56
+ const allAvailableGradients = [...new Set(((_defaultSettings$allG = defaultSettings.allGradients) !== null && _defaultSettings$allG !== void 0 ? _defaultSettings$allG : []).map(({
54
57
  gradient
55
58
  }) => gradient))];
56
- const colors = isGradientSegment ? defaultGradientColors : defaultColors;
59
+ const colors = isGradientSegment ? mergedGradients : mergedColors;
60
+ const allColors = isGradientSegment ? allAvailableGradients : allAvailableColors;
57
61
  const customIndicatorColor = isGradientSegment ? activeColor : customSwatchGradients;
58
62
  const isCustomGradientColor = isGradientColor && isSelectedCustom();
59
63
  const shouldShowCustomIndicator = enableCustomColor && shouldShowCustomIndicatorOption && (!isGradientSegment || isCustomGradientColor);
@@ -75,7 +79,7 @@ function ColorPalette({
75
79
  // eslint-disable-next-line react-hooks/exhaustive-deps
76
80
  }, [currentSegment]);
77
81
  function isSelectedCustom() {
78
- const isWithinColors = activeColor && mergedColors && mergedColors.includes(activeColor);
82
+ const isWithinColors = activeColor && allColors?.includes(activeColor);
79
83
  if (enableCustomColor && activeColor) {
80
84
  if (isGradientSegment) {
81
85
  return isGradientColor && !isWithinColors;
@@ -1 +1 @@
1
- {"version":3,"names":["ScrollView","TouchableWithoutFeedback","View","Animated","Easing","Dimensions","Platform","Text","__","sprintf","useRef","useEffect","usePreferredColorSchemeStyle","styles","ColorIndicator","colorsUtils","ANIMATION_DURATION","contentWidth","scrollPosition","customIndicatorWidth","ColorPalette","enableCustomColor","setColor","activeColor","isGradientColor","defaultSettings","currentSegment","onCustomPress","shouldEnableBottomSheetScroll","shouldShowCustomIndicatorOption","shouldShowCustomLabel","shouldShowCustomVerticalSeparator","customColorIndicatorStyles","customIndicatorWrapperStyles","label","_defaultSettings$colo","_defaultSettings$allC","_defaultSettings$grad","customSwatchGradients","scrollViewRef","isIOS","OS","isGradientSegment","segments","scale","Value","current","opacity","defaultColors","Set","colors","map","color","mergedColors","allColors","defaultGradientColors","gradients","gradient","customIndicatorColor","isCustomGradientColor","isSelectedCustom","shouldShowCustomIndicator","accessibilityHint","customText","scrollToEndWithDelay","scrollTo","x","y","isWithinColors","includes","isSelected","timingAnimation","property","toValue","timing","duration","easing","ease","useNativeDriver","performAnimation","setValue","parallel","start","scaleInterpolation","interpolate","inputRange","outputRange","deselectCustomGradient","width","get","isVisible","getColorGradientName","value","fallbackName","foundColorName","find","name","onColorPress","onContentSizeChange","delayedScroll","setTimeout","scrollToEnd","clearTimeout","onCustomIndicatorLayout","nativeEvent","layout","onScroll","contentOffset","verticalSeparatorStyle","verticalSeparator","verticalSeparatorDark","customTextStyle","customTextAndroid","customTextDark","customIndicatorWrapperStyle","customIndicatorWrapper","createElement","Fragment","accessibilityRole","style","headerText","contentContainerStyle","contentContainer","horizontal","showsHorizontalScrollIndicator","keyboardShouldPersistTaps","disableScrollViewPanResponder","scrollEventThrottle","onScrollBeginDrag","onScrollEndDrag","ref","testID","scaleValue","colorName","key","onPress","accessibilityState","selected","accessibilityLabel","transform","colorIndicator","onLayout","withCustomPicker","toUpperCase"],"sources":["@wordpress/components/src/color-palette/index.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tScrollView,\n\tTouchableWithoutFeedback,\n\tView,\n\tAnimated,\n\tEasing,\n\tDimensions,\n\tPlatform,\n\tText,\n} from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useRef, useEffect } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\nimport ColorIndicator from '../color-indicator';\nimport { colorsUtils } from '../mobile/color-settings/utils';\n\nconst ANIMATION_DURATION = 200;\n\nlet contentWidth = 0;\nlet scrollPosition = 0;\nlet customIndicatorWidth = 0;\n\nfunction ColorPalette( {\n\tenableCustomColor = true,\n\tsetColor,\n\tactiveColor,\n\tisGradientColor,\n\tdefaultSettings,\n\tcurrentSegment,\n\tonCustomPress,\n\tshouldEnableBottomSheetScroll,\n\tshouldShowCustomIndicatorOption = true,\n\tshouldShowCustomLabel = true,\n\tshouldShowCustomVerticalSeparator = true,\n\tcustomColorIndicatorStyles,\n\tcustomIndicatorWrapperStyles,\n\tlabel,\n} ) {\n\tconst customSwatchGradients = [\n\t\t'linear-gradient(120deg, rgba(255,0,0,.8) 0%, rgba(255,255,255,1) 70.71%)',\n\t\t'linear-gradient(240deg, rgba(0,255,0,.8) 0%, rgba(0,255,0,0) 70.71%)',\n\t\t'linear-gradient(360deg, rgba(0,0,255,.8) 0%, rgba(0,0,255,0) 70.71%)',\n\t];\n\n\tconst scrollViewRef = useRef();\n\tconst isIOS = Platform.OS === 'ios';\n\n\tconst isGradientSegment = currentSegment === colorsUtils.segments[ 1 ];\n\n\tconst scale = useRef( new Animated.Value( 1 ) ).current;\n\tconst opacity = useRef( new Animated.Value( 1 ) ).current;\n\n\tconst defaultColors = [\n\t\t...new Set(\n\t\t\t( defaultSettings.colors ?? [] ).map( ( { color } ) => color )\n\t\t),\n\t];\n\tconst mergedColors = [\n\t\t...new Set(\n\t\t\t( defaultSettings.allColors ?? [] ).map( ( { color } ) => color )\n\t\t),\n\t];\n\tconst defaultGradientColors = [\n\t\t...new Set(\n\t\t\t( defaultSettings.gradients ?? [] ).map(\n\t\t\t\t( { gradient } ) => gradient\n\t\t\t)\n\t\t),\n\t];\n\tconst colors = isGradientSegment ? defaultGradientColors : defaultColors;\n\n\tconst customIndicatorColor = isGradientSegment\n\t\t? activeColor\n\t\t: customSwatchGradients;\n\tconst isCustomGradientColor = isGradientColor && isSelectedCustom();\n\tconst shouldShowCustomIndicator =\n\t\tenableCustomColor &&\n\t\tshouldShowCustomIndicatorOption &&\n\t\t( ! isGradientSegment || isCustomGradientColor );\n\n\tconst accessibilityHint = isGradientSegment\n\t\t? __( 'Navigates to customize the gradient' )\n\t\t: __( 'Navigates to custom color picker' );\n\tconst customText = __( 'Custom' );\n\n\tuseEffect( () => {\n\t\tif ( scrollViewRef.current ) {\n\t\t\tif ( isSelectedCustom() ) {\n\t\t\t\tscrollToEndWithDelay();\n\t\t\t} else {\n\t\t\t\tscrollViewRef.current.scrollTo( { x: 0, y: 0 } );\n\t\t\t}\n\t\t}\n\t\t// Temporarily disabling exhuastive-deps until the component can be refactored and updated safely.\n\t\t// Please see https://github.com/WordPress/gutenberg/pull/41253 for discussion and details.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ currentSegment ] );\n\n\tfunction isSelectedCustom() {\n\t\tconst isWithinColors =\n\t\t\tactiveColor && mergedColors && mergedColors.includes( activeColor );\n\t\tif ( enableCustomColor && activeColor ) {\n\t\t\tif ( isGradientSegment ) {\n\t\t\t\treturn isGradientColor && ! isWithinColors;\n\t\t\t}\n\t\t\treturn ! isGradientColor && ! isWithinColors;\n\t\t}\n\t\treturn false;\n\t}\n\n\tfunction isSelected( color ) {\n\t\treturn ! isSelectedCustom() && activeColor === color;\n\t}\n\n\tfunction timingAnimation( property, toValue ) {\n\t\treturn Animated.timing( property, {\n\t\t\ttoValue,\n\t\t\tduration: ANIMATION_DURATION,\n\t\t\teasing: Easing.ease,\n\t\t\tuseNativeDriver: true,\n\t\t} );\n\t}\n\n\tfunction performAnimation( color ) {\n\t\tif ( ! isSelected( color ) ) {\n\t\t\topacity.setValue( 0 );\n\t\t}\n\n\t\tAnimated.parallel( [\n\t\t\ttimingAnimation( scale, 2 ),\n\t\t\ttimingAnimation( opacity, 1 ),\n\t\t] ).start( () => {\n\t\t\topacity.setValue( 1 );\n\t\t\tscale.setValue( 1 );\n\t\t} );\n\t}\n\n\tconst scaleInterpolation = scale.interpolate( {\n\t\tinputRange: [ 1, 1.5, 2 ],\n\t\toutputRange: [ 1, 0.7, 1 ],\n\t} );\n\n\tfunction deselectCustomGradient() {\n\t\tconst { width } = Dimensions.get( 'window' );\n\t\tconst isVisible =\n\t\t\tcontentWidth - scrollPosition - customIndicatorWidth < width;\n\n\t\tif ( isCustomGradientColor ) {\n\t\t\tif ( ! isIOS ) {\n\t\t\t\t// Scroll position on Android doesn't adjust automatically when removing the last item from the horizontal list.\n\t\t\t\t// https://github.com/facebook/react-native/issues/27504\n\t\t\t\t// Workaround: Force the scroll when deselecting custom gradient color and when custom indicator is visible on layout.\n\t\t\t\tif (\n\t\t\t\t\tisCustomGradientColor &&\n\t\t\t\t\tisVisible &&\n\t\t\t\t\tscrollViewRef.current\n\t\t\t\t) {\n\t\t\t\t\tscrollViewRef.current.scrollTo( {\n\t\t\t\t\t\tx: scrollPosition - customIndicatorWidth,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tfunction getColorGradientName( value ) {\n\t\tconst fallbackName = sprintf(\n\t\t\t/* translators: %s: the hex color value */\n\t\t\t__( 'Unlabeled color. %s' ),\n\t\t\tvalue\n\t\t);\n\t\tconst foundColorName = isGradientSegment\n\t\t\t? defaultSettings.gradients?.find(\n\t\t\t\t\t( gradient ) => gradient.gradient === value\n\t\t\t )\n\t\t\t: defaultSettings.allColors?.find(\n\t\t\t\t\t( color ) => color.color === value\n\t\t\t );\n\t\treturn foundColorName ? foundColorName?.name : fallbackName;\n\t}\n\n\tfunction onColorPress( color ) {\n\t\tdeselectCustomGradient();\n\t\tperformAnimation( color );\n\t\tsetColor( color );\n\t}\n\n\tfunction onContentSizeChange( width ) {\n\t\tcontentWidth = width;\n\t\tif ( isSelectedCustom() && scrollViewRef.current ) {\n\t\t\tscrollToEndWithDelay();\n\t\t}\n\t}\n\n\tfunction scrollToEndWithDelay() {\n\t\tconst delayedScroll = setTimeout( () => {\n\t\t\tscrollViewRef.current.scrollToEnd();\n\t\t}, ANIMATION_DURATION );\n\t\treturn () => {\n\t\t\tclearTimeout( delayedScroll );\n\t\t};\n\t}\n\n\tfunction onCustomIndicatorLayout( { nativeEvent } ) {\n\t\tconst { width } = nativeEvent.layout;\n\t\tif ( width !== customIndicatorWidth ) {\n\t\t\tcustomIndicatorWidth = width;\n\t\t}\n\t}\n\n\tfunction onScroll( { nativeEvent } ) {\n\t\tscrollPosition = nativeEvent.contentOffset.x;\n\t}\n\n\tconst verticalSeparatorStyle = usePreferredColorSchemeStyle(\n\t\tstyles.verticalSeparator,\n\t\tstyles.verticalSeparatorDark\n\t);\n\n\tconst customTextStyle = usePreferredColorSchemeStyle(\n\t\t[ styles.customText, ! isIOS && styles.customTextAndroid ],\n\t\tstyles.customTextDark\n\t);\n\n\tconst customIndicatorWrapperStyle = [\n\t\tstyles.customIndicatorWrapper,\n\t\tcustomIndicatorWrapperStyles,\n\t];\n\n\treturn (\n\t\t<>\n\t\t\t{ label && (\n\t\t\t\t<Text accessibilityRole=\"header\" style={ styles.headerText }>\n\t\t\t\t\t{ label }\n\t\t\t\t</Text>\n\t\t\t) }\n\n\t\t\t<ScrollView\n\t\t\t\tcontentContainerStyle={ styles.contentContainer }\n\t\t\t\thorizontal\n\t\t\t\tshowsHorizontalScrollIndicator={ false }\n\t\t\t\tkeyboardShouldPersistTaps=\"always\"\n\t\t\t\tdisableScrollViewPanResponder\n\t\t\t\tscrollEventThrottle={ 16 }\n\t\t\t\tonScroll={ onScroll }\n\t\t\t\tonContentSizeChange={ onContentSizeChange }\n\t\t\t\tonScrollBeginDrag={ () =>\n\t\t\t\t\tshouldEnableBottomSheetScroll( false )\n\t\t\t\t}\n\t\t\t\tonScrollEndDrag={ () => shouldEnableBottomSheetScroll( true ) }\n\t\t\t\tref={ scrollViewRef }\n\t\t\t\ttestID={ `color-palette${ label ? '-' + label : '' }` }\n\t\t\t>\n\t\t\t\t{ colors.map( ( color ) => {\n\t\t\t\t\tconst scaleValue = isSelected( color )\n\t\t\t\t\t\t? scaleInterpolation\n\t\t\t\t\t\t: 1;\n\t\t\t\t\tconst colorName = getColorGradientName( color );\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<View key={ `${ color }-${ isSelected( color ) }` }>\n\t\t\t\t\t\t\t<TouchableWithoutFeedback\n\t\t\t\t\t\t\t\tonPress={ () => onColorPress( color ) }\n\t\t\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\t\t\taccessibilityState={ {\n\t\t\t\t\t\t\t\t\tselected: isSelected( color ),\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\taccessibilityHint={ color }\n\t\t\t\t\t\t\t\taccessibilityLabel={ colorName }\n\t\t\t\t\t\t\t\ttestID={ color }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Animated.View\n\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\ttransform: [\n\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\tscale: scaleValue,\n\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\t\t\t\tcolor={ color }\n\t\t\t\t\t\t\t\t\t\tisSelected={ isSelected( color ) }\n\t\t\t\t\t\t\t\t\t\topacity={ opacity }\n\t\t\t\t\t\t\t\t\t\tstyle={ [\n\t\t\t\t\t\t\t\t\t\t\tstyles.colorIndicator,\n\t\t\t\t\t\t\t\t\t\t\tcustomColorIndicatorStyles,\n\t\t\t\t\t\t\t\t\t\t] }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</Animated.View>\n\t\t\t\t\t\t\t</TouchableWithoutFeedback>\n\t\t\t\t\t\t</View>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t\t{ shouldShowCustomIndicator && (\n\t\t\t\t\t<View\n\t\t\t\t\t\tstyle={ customIndicatorWrapperStyle }\n\t\t\t\t\t\tonLayout={ onCustomIndicatorLayout }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ shouldShowCustomVerticalSeparator && (\n\t\t\t\t\t\t\t<View style={ verticalSeparatorStyle } />\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t<TouchableWithoutFeedback\n\t\t\t\t\t\t\tonPress={ onCustomPress }\n\t\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\t\taccessibilityState={ {\n\t\t\t\t\t\t\t\tselected: isSelectedCustom(),\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\taccessibilityHint={ accessibilityHint }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<View style={ customIndicatorWrapperStyle }>\n\t\t\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\t\t\twithCustomPicker={ ! isGradientSegment }\n\t\t\t\t\t\t\t\t\tcolor={ customIndicatorColor }\n\t\t\t\t\t\t\t\t\tisSelected={ isSelectedCustom() }\n\t\t\t\t\t\t\t\t\tstyle={ [\n\t\t\t\t\t\t\t\t\t\tstyles.colorIndicator,\n\t\t\t\t\t\t\t\t\t\tcustomColorIndicatorStyles,\n\t\t\t\t\t\t\t\t\t] }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t{ shouldShowCustomLabel && (\n\t\t\t\t\t\t\t\t\t<Text style={ customTextStyle }>\n\t\t\t\t\t\t\t\t\t\t{ isIOS\n\t\t\t\t\t\t\t\t\t\t\t? customText\n\t\t\t\t\t\t\t\t\t\t\t: customText.toUpperCase() }\n\t\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</View>\n\t\t\t\t\t\t</TouchableWithoutFeedback>\n\t\t\t\t\t</View>\n\t\t\t\t) }\n\t\t\t</ScrollView>\n\t\t</>\n\t);\n}\n\nexport default ColorPalette;\n"],"mappings":"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"}
1
+ {"version":3,"names":["ScrollView","TouchableWithoutFeedback","View","Animated","Easing","Dimensions","Platform","Text","__","sprintf","useRef","useEffect","usePreferredColorSchemeStyle","styles","ColorIndicator","colorsUtils","ANIMATION_DURATION","contentWidth","scrollPosition","customIndicatorWidth","ColorPalette","enableCustomColor","setColor","activeColor","isGradientColor","defaultSettings","currentSegment","onCustomPress","shouldEnableBottomSheetScroll","shouldShowCustomIndicatorOption","shouldShowCustomLabel","shouldShowCustomVerticalSeparator","customColorIndicatorStyles","customIndicatorWrapperStyles","label","_defaultSettings$colo","_defaultSettings$grad","_defaultSettings$allC","_defaultSettings$allG","customSwatchGradients","scrollViewRef","isIOS","OS","isGradientSegment","segments","scale","Value","current","opacity","mergedColors","Set","colors","map","color","mergedGradients","gradients","gradient","allAvailableColors","allColors","allAvailableGradients","allGradients","customIndicatorColor","isCustomGradientColor","isSelectedCustom","shouldShowCustomIndicator","accessibilityHint","customText","scrollToEndWithDelay","scrollTo","x","y","isWithinColors","includes","isSelected","timingAnimation","property","toValue","timing","duration","easing","ease","useNativeDriver","performAnimation","setValue","parallel","start","scaleInterpolation","interpolate","inputRange","outputRange","deselectCustomGradient","width","get","isVisible","getColorGradientName","value","fallbackName","foundColorName","find","name","onColorPress","onContentSizeChange","delayedScroll","setTimeout","scrollToEnd","clearTimeout","onCustomIndicatorLayout","nativeEvent","layout","onScroll","contentOffset","verticalSeparatorStyle","verticalSeparator","verticalSeparatorDark","customTextStyle","customTextAndroid","customTextDark","customIndicatorWrapperStyle","customIndicatorWrapper","createElement","Fragment","accessibilityRole","style","headerText","contentContainerStyle","contentContainer","horizontal","showsHorizontalScrollIndicator","keyboardShouldPersistTaps","disableScrollViewPanResponder","scrollEventThrottle","onScrollBeginDrag","onScrollEndDrag","ref","testID","scaleValue","colorName","key","onPress","accessibilityState","selected","accessibilityLabel","transform","colorIndicator","onLayout","withCustomPicker","toUpperCase"],"sources":["@wordpress/components/src/color-palette/index.native.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tScrollView,\n\tTouchableWithoutFeedback,\n\tView,\n\tAnimated,\n\tEasing,\n\tDimensions,\n\tPlatform,\n\tText,\n} from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useRef, useEffect } from '@wordpress/element';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport styles from './style.scss';\nimport ColorIndicator from '../color-indicator';\nimport { colorsUtils } from '../mobile/color-settings/utils';\n\nconst ANIMATION_DURATION = 200;\n\nlet contentWidth = 0;\nlet scrollPosition = 0;\nlet customIndicatorWidth = 0;\n\nfunction ColorPalette( {\n\tenableCustomColor = false,\n\tsetColor,\n\tactiveColor,\n\tisGradientColor,\n\tdefaultSettings,\n\tcurrentSegment,\n\tonCustomPress,\n\tshouldEnableBottomSheetScroll,\n\tshouldShowCustomIndicatorOption = true,\n\tshouldShowCustomLabel = true,\n\tshouldShowCustomVerticalSeparator = true,\n\tcustomColorIndicatorStyles,\n\tcustomIndicatorWrapperStyles,\n\tlabel,\n} ) {\n\tconst customSwatchGradients = [\n\t\t'linear-gradient(120deg, rgba(255,0,0,.8) 0%, rgba(255,255,255,1) 70.71%)',\n\t\t'linear-gradient(240deg, rgba(0,255,0,.8) 0%, rgba(0,255,0,0) 70.71%)',\n\t\t'linear-gradient(360deg, rgba(0,0,255,.8) 0%, rgba(0,0,255,0) 70.71%)',\n\t];\n\n\tconst scrollViewRef = useRef();\n\tconst isIOS = Platform.OS === 'ios';\n\n\tconst isGradientSegment = currentSegment === colorsUtils.segments[ 1 ];\n\n\tconst scale = useRef( new Animated.Value( 1 ) ).current;\n\tconst opacity = useRef( new Animated.Value( 1 ) ).current;\n\n\tconst mergedColors = [\n\t\t...new Set(\n\t\t\t( defaultSettings.colors ?? [] ).map( ( { color } ) => color )\n\t\t),\n\t];\n\tconst mergedGradients = [\n\t\t...new Set(\n\t\t\t( defaultSettings.gradients ?? [] ).map(\n\t\t\t\t( { gradient } ) => gradient\n\t\t\t)\n\t\t),\n\t];\n\tconst allAvailableColors = [\n\t\t...new Set(\n\t\t\t( defaultSettings.allColors ?? [] ).map( ( { color } ) => color )\n\t\t),\n\t];\n\tconst allAvailableGradients = [\n\t\t...new Set(\n\t\t\t( defaultSettings.allGradients ?? [] ).map(\n\t\t\t\t( { gradient } ) => gradient\n\t\t\t)\n\t\t),\n\t];\n\n\tconst colors = isGradientSegment ? mergedGradients : mergedColors;\n\tconst allColors = isGradientSegment\n\t\t? allAvailableGradients\n\t\t: allAvailableColors;\n\n\tconst customIndicatorColor = isGradientSegment\n\t\t? activeColor\n\t\t: customSwatchGradients;\n\tconst isCustomGradientColor = isGradientColor && isSelectedCustom();\n\tconst shouldShowCustomIndicator =\n\t\tenableCustomColor &&\n\t\tshouldShowCustomIndicatorOption &&\n\t\t( ! isGradientSegment || isCustomGradientColor );\n\n\tconst accessibilityHint = isGradientSegment\n\t\t? __( 'Navigates to customize the gradient' )\n\t\t: __( 'Navigates to custom color picker' );\n\tconst customText = __( 'Custom' );\n\n\tuseEffect( () => {\n\t\tif ( scrollViewRef.current ) {\n\t\t\tif ( isSelectedCustom() ) {\n\t\t\t\tscrollToEndWithDelay();\n\t\t\t} else {\n\t\t\t\tscrollViewRef.current.scrollTo( { x: 0, y: 0 } );\n\t\t\t}\n\t\t}\n\t\t// Temporarily disabling exhuastive-deps until the component can be refactored and updated safely.\n\t\t// Please see https://github.com/WordPress/gutenberg/pull/41253 for discussion and details.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ currentSegment ] );\n\n\tfunction isSelectedCustom() {\n\t\tconst isWithinColors =\n\t\t\tactiveColor && allColors?.includes( activeColor );\n\t\tif ( enableCustomColor && activeColor ) {\n\t\t\tif ( isGradientSegment ) {\n\t\t\t\treturn isGradientColor && ! isWithinColors;\n\t\t\t}\n\t\t\treturn ! isGradientColor && ! isWithinColors;\n\t\t}\n\t\treturn false;\n\t}\n\n\tfunction isSelected( color ) {\n\t\treturn ! isSelectedCustom() && activeColor === color;\n\t}\n\n\tfunction timingAnimation( property, toValue ) {\n\t\treturn Animated.timing( property, {\n\t\t\ttoValue,\n\t\t\tduration: ANIMATION_DURATION,\n\t\t\teasing: Easing.ease,\n\t\t\tuseNativeDriver: true,\n\t\t} );\n\t}\n\n\tfunction performAnimation( color ) {\n\t\tif ( ! isSelected( color ) ) {\n\t\t\topacity.setValue( 0 );\n\t\t}\n\n\t\tAnimated.parallel( [\n\t\t\ttimingAnimation( scale, 2 ),\n\t\t\ttimingAnimation( opacity, 1 ),\n\t\t] ).start( () => {\n\t\t\topacity.setValue( 1 );\n\t\t\tscale.setValue( 1 );\n\t\t} );\n\t}\n\n\tconst scaleInterpolation = scale.interpolate( {\n\t\tinputRange: [ 1, 1.5, 2 ],\n\t\toutputRange: [ 1, 0.7, 1 ],\n\t} );\n\n\tfunction deselectCustomGradient() {\n\t\tconst { width } = Dimensions.get( 'window' );\n\t\tconst isVisible =\n\t\t\tcontentWidth - scrollPosition - customIndicatorWidth < width;\n\n\t\tif ( isCustomGradientColor ) {\n\t\t\tif ( ! isIOS ) {\n\t\t\t\t// Scroll position on Android doesn't adjust automatically when removing the last item from the horizontal list.\n\t\t\t\t// https://github.com/facebook/react-native/issues/27504\n\t\t\t\t// Workaround: Force the scroll when deselecting custom gradient color and when custom indicator is visible on layout.\n\t\t\t\tif (\n\t\t\t\t\tisCustomGradientColor &&\n\t\t\t\t\tisVisible &&\n\t\t\t\t\tscrollViewRef.current\n\t\t\t\t) {\n\t\t\t\t\tscrollViewRef.current.scrollTo( {\n\t\t\t\t\t\tx: scrollPosition - customIndicatorWidth,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tfunction getColorGradientName( value ) {\n\t\tconst fallbackName = sprintf(\n\t\t\t/* translators: %s: the hex color value */\n\t\t\t__( 'Unlabeled color. %s' ),\n\t\t\tvalue\n\t\t);\n\t\tconst foundColorName = isGradientSegment\n\t\t\t? defaultSettings.gradients?.find(\n\t\t\t\t\t( gradient ) => gradient.gradient === value\n\t\t\t )\n\t\t\t: defaultSettings.allColors?.find(\n\t\t\t\t\t( color ) => color.color === value\n\t\t\t );\n\t\treturn foundColorName ? foundColorName?.name : fallbackName;\n\t}\n\n\tfunction onColorPress( color ) {\n\t\tdeselectCustomGradient();\n\t\tperformAnimation( color );\n\t\tsetColor( color );\n\t}\n\n\tfunction onContentSizeChange( width ) {\n\t\tcontentWidth = width;\n\t\tif ( isSelectedCustom() && scrollViewRef.current ) {\n\t\t\tscrollToEndWithDelay();\n\t\t}\n\t}\n\n\tfunction scrollToEndWithDelay() {\n\t\tconst delayedScroll = setTimeout( () => {\n\t\t\tscrollViewRef.current.scrollToEnd();\n\t\t}, ANIMATION_DURATION );\n\t\treturn () => {\n\t\t\tclearTimeout( delayedScroll );\n\t\t};\n\t}\n\n\tfunction onCustomIndicatorLayout( { nativeEvent } ) {\n\t\tconst { width } = nativeEvent.layout;\n\t\tif ( width !== customIndicatorWidth ) {\n\t\t\tcustomIndicatorWidth = width;\n\t\t}\n\t}\n\n\tfunction onScroll( { nativeEvent } ) {\n\t\tscrollPosition = nativeEvent.contentOffset.x;\n\t}\n\n\tconst verticalSeparatorStyle = usePreferredColorSchemeStyle(\n\t\tstyles.verticalSeparator,\n\t\tstyles.verticalSeparatorDark\n\t);\n\n\tconst customTextStyle = usePreferredColorSchemeStyle(\n\t\t[ styles.customText, ! isIOS && styles.customTextAndroid ],\n\t\tstyles.customTextDark\n\t);\n\n\tconst customIndicatorWrapperStyle = [\n\t\tstyles.customIndicatorWrapper,\n\t\tcustomIndicatorWrapperStyles,\n\t];\n\n\treturn (\n\t\t<>\n\t\t\t{ label && (\n\t\t\t\t<Text accessibilityRole=\"header\" style={ styles.headerText }>\n\t\t\t\t\t{ label }\n\t\t\t\t</Text>\n\t\t\t) }\n\n\t\t\t<ScrollView\n\t\t\t\tcontentContainerStyle={ styles.contentContainer }\n\t\t\t\thorizontal\n\t\t\t\tshowsHorizontalScrollIndicator={ false }\n\t\t\t\tkeyboardShouldPersistTaps=\"always\"\n\t\t\t\tdisableScrollViewPanResponder\n\t\t\t\tscrollEventThrottle={ 16 }\n\t\t\t\tonScroll={ onScroll }\n\t\t\t\tonContentSizeChange={ onContentSizeChange }\n\t\t\t\tonScrollBeginDrag={ () =>\n\t\t\t\t\tshouldEnableBottomSheetScroll( false )\n\t\t\t\t}\n\t\t\t\tonScrollEndDrag={ () => shouldEnableBottomSheetScroll( true ) }\n\t\t\t\tref={ scrollViewRef }\n\t\t\t\ttestID={ `color-palette${ label ? '-' + label : '' }` }\n\t\t\t>\n\t\t\t\t{ colors.map( ( color ) => {\n\t\t\t\t\tconst scaleValue = isSelected( color )\n\t\t\t\t\t\t? scaleInterpolation\n\t\t\t\t\t\t: 1;\n\t\t\t\t\tconst colorName = getColorGradientName( color );\n\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<View key={ `${ color }-${ isSelected( color ) }` }>\n\t\t\t\t\t\t\t<TouchableWithoutFeedback\n\t\t\t\t\t\t\t\tonPress={ () => onColorPress( color ) }\n\t\t\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\t\t\taccessibilityState={ {\n\t\t\t\t\t\t\t\t\tselected: isSelected( color ),\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\taccessibilityHint={ color }\n\t\t\t\t\t\t\t\taccessibilityLabel={ colorName }\n\t\t\t\t\t\t\t\ttestID={ color }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Animated.View\n\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\ttransform: [\n\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\tscale: scaleValue,\n\t\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\t\t\t\tcolor={ color }\n\t\t\t\t\t\t\t\t\t\tisSelected={ isSelected( color ) }\n\t\t\t\t\t\t\t\t\t\topacity={ opacity }\n\t\t\t\t\t\t\t\t\t\tstyle={ [\n\t\t\t\t\t\t\t\t\t\t\tstyles.colorIndicator,\n\t\t\t\t\t\t\t\t\t\t\tcustomColorIndicatorStyles,\n\t\t\t\t\t\t\t\t\t\t] }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</Animated.View>\n\t\t\t\t\t\t\t</TouchableWithoutFeedback>\n\t\t\t\t\t\t</View>\n\t\t\t\t\t);\n\t\t\t\t} ) }\n\t\t\t\t{ shouldShowCustomIndicator && (\n\t\t\t\t\t<View\n\t\t\t\t\t\tstyle={ customIndicatorWrapperStyle }\n\t\t\t\t\t\tonLayout={ onCustomIndicatorLayout }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ shouldShowCustomVerticalSeparator && (\n\t\t\t\t\t\t\t<View style={ verticalSeparatorStyle } />\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t<TouchableWithoutFeedback\n\t\t\t\t\t\t\tonPress={ onCustomPress }\n\t\t\t\t\t\t\taccessibilityRole={ 'button' }\n\t\t\t\t\t\t\taccessibilityState={ {\n\t\t\t\t\t\t\t\tselected: isSelectedCustom(),\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\taccessibilityHint={ accessibilityHint }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<View style={ customIndicatorWrapperStyle }>\n\t\t\t\t\t\t\t\t<ColorIndicator\n\t\t\t\t\t\t\t\t\twithCustomPicker={ ! isGradientSegment }\n\t\t\t\t\t\t\t\t\tcolor={ customIndicatorColor }\n\t\t\t\t\t\t\t\t\tisSelected={ isSelectedCustom() }\n\t\t\t\t\t\t\t\t\tstyle={ [\n\t\t\t\t\t\t\t\t\t\tstyles.colorIndicator,\n\t\t\t\t\t\t\t\t\t\tcustomColorIndicatorStyles,\n\t\t\t\t\t\t\t\t\t] }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t{ shouldShowCustomLabel && (\n\t\t\t\t\t\t\t\t\t<Text style={ customTextStyle }>\n\t\t\t\t\t\t\t\t\t\t{ isIOS\n\t\t\t\t\t\t\t\t\t\t\t? customText\n\t\t\t\t\t\t\t\t\t\t\t: customText.toUpperCase() }\n\t\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</View>\n\t\t\t\t\t\t</TouchableWithoutFeedback>\n\t\t\t\t\t</View>\n\t\t\t\t) }\n\t\t\t</ScrollView>\n\t\t</>\n\t);\n}\n\nexport default ColorPalette;\n"],"mappings":"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"}
@@ -58,7 +58,7 @@ export const ColorCopyButton = props => {
58
58
  hideOnClick: false,
59
59
  text: copiedColor === color.toHex() ? __('Copied!') : __('Copy')
60
60
  }, createElement(CopyButton, {
61
- isSmall: true,
61
+ size: "small",
62
62
  ref: copyRef,
63
63
  icon: copy,
64
64
  showTooltip: false
@@ -1 +1 @@
1
- {"version":3,"names":["useCopyToClipboard","useState","useEffect","useRef","copy","__","CopyButton","Tooltip","ColorCopyButton","props","color","colorType","copiedColor","setCopiedColor","copyTimer","copyRef","toHslString","toRgbString","toHex","current","clearTimeout","setTimeout","undefined","createElement","delay","hideOnClick","text","isSmall","ref","icon","showTooltip"],"sources":["@wordpress/components/src/color-picker/color-copy-button.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCopyToClipboard } from '@wordpress/compose';\nimport { useState, useEffect, useRef } from '@wordpress/element';\nimport { copy } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { CopyButton } from './styles';\nimport Tooltip from '../tooltip';\n\nimport type { ColorCopyButtonProps } from './types';\n\nexport const ColorCopyButton = ( props: ColorCopyButtonProps ) => {\n\tconst { color, colorType } = props;\n\tconst [ copiedColor, setCopiedColor ] = useState< string | null >( null );\n\tconst copyTimer = useRef< ReturnType< typeof setTimeout > | undefined >();\n\tconst copyRef = useCopyToClipboard< HTMLDivElement >(\n\t\t() => {\n\t\t\tswitch ( colorType ) {\n\t\t\t\tcase 'hsl': {\n\t\t\t\t\treturn color.toHslString();\n\t\t\t\t}\n\t\t\t\tcase 'rgb': {\n\t\t\t\t\treturn color.toRgbString();\n\t\t\t\t}\n\t\t\t\tdefault:\n\t\t\t\tcase 'hex': {\n\t\t\t\t\treturn color.toHex();\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t() => {\n\t\t\tif ( copyTimer.current ) {\n\t\t\t\tclearTimeout( copyTimer.current );\n\t\t\t}\n\t\t\tsetCopiedColor( color.toHex() );\n\t\t\tcopyTimer.current = setTimeout( () => {\n\t\t\t\tsetCopiedColor( null );\n\t\t\t\tcopyTimer.current = undefined;\n\t\t\t}, 3000 );\n\t\t}\n\t);\n\tuseEffect( () => {\n\t\t// Clear copyTimer on component unmount.\n\t\treturn () => {\n\t\t\tif ( copyTimer.current ) {\n\t\t\t\tclearTimeout( copyTimer.current );\n\t\t\t}\n\t\t};\n\t}, [] );\n\n\treturn (\n\t\t<Tooltip\n\t\t\tdelay={ 0 }\n\t\t\thideOnClick={ false }\n\t\t\ttext={\n\t\t\t\tcopiedColor === color.toHex() ? __( 'Copied!' ) : __( 'Copy' )\n\t\t\t}\n\t\t>\n\t\t\t<CopyButton\n\t\t\t\tisSmall\n\t\t\t\tref={ copyRef }\n\t\t\t\ticon={ copy }\n\t\t\t\tshowTooltip={ false }\n\t\t\t/>\n\t\t</Tooltip>\n\t);\n};\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,kBAAkB,QAAQ,oBAAoB;AACvD,SAASC,QAAQ,EAAEC,SAAS,EAAEC,MAAM,QAAQ,oBAAoB;AAChE,SAASC,IAAI,QAAQ,kBAAkB;AACvC,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,SAASC,UAAU,QAAQ,UAAU;AACrC,OAAOC,OAAO,MAAM,YAAY;AAIhC,OAAO,MAAMC,eAAe,GAAKC,KAA2B,IAAM;EACjE,MAAM;IAAEC,KAAK;IAAEC;EAAU,CAAC,GAAGF,KAAK;EAClC,MAAM,CAAEG,WAAW,EAAEC,cAAc,CAAE,GAAGZ,QAAQ,CAAmB,IAAK,CAAC;EACzE,MAAMa,SAAS,GAAGX,MAAM,CAAgD,CAAC;EACzE,MAAMY,OAAO,GAAGf,kBAAkB,CACjC,MAAM;IACL,QAASW,SAAS;MACjB,KAAK,KAAK;QAAE;UACX,OAAOD,KAAK,CAACM,WAAW,CAAC,CAAC;QAC3B;MACA,KAAK,KAAK;QAAE;UACX,OAAON,KAAK,CAACO,WAAW,CAAC,CAAC;QAC3B;MACA;MACA,KAAK,KAAK;QAAE;UACX,OAAOP,KAAK,CAACQ,KAAK,CAAC,CAAC;QACrB;IACD;EACD,CAAC,EACD,MAAM;IACL,IAAKJ,SAAS,CAACK,OAAO,EAAG;MACxBC,YAAY,CAAEN,SAAS,CAACK,OAAQ,CAAC;IAClC;IACAN,cAAc,CAAEH,KAAK,CAACQ,KAAK,CAAC,CAAE,CAAC;IAC/BJ,SAAS,CAACK,OAAO,GAAGE,UAAU,CAAE,MAAM;MACrCR,cAAc,CAAE,IAAK,CAAC;MACtBC,SAAS,CAACK,OAAO,GAAGG,SAAS;IAC9B,CAAC,EAAE,IAAK,CAAC;EACV,CACD,CAAC;EACDpB,SAAS,CAAE,MAAM;IAChB;IACA,OAAO,MAAM;MACZ,IAAKY,SAAS,CAACK,OAAO,EAAG;QACxBC,YAAY,CAAEN,SAAS,CAACK,OAAQ,CAAC;MAClC;IACD,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EAEP,OACCI,aAAA,CAAChB,OAAO;IACPiB,KAAK,EAAG,CAAG;IACXC,WAAW,EAAG,KAAO;IACrBC,IAAI,EACHd,WAAW,KAAKF,KAAK,CAACQ,KAAK,CAAC,CAAC,GAAGb,EAAE,CAAE,SAAU,CAAC,GAAGA,EAAE,CAAE,MAAO;EAC7D,GAEDkB,aAAA,CAACjB,UAAU;IACVqB,OAAO;IACPC,GAAG,EAAGb,OAAS;IACfc,IAAI,EAAGzB,IAAM;IACb0B,WAAW,EAAG;EAAO,CACrB,CACO,CAAC;AAEZ,CAAC"}
1
+ {"version":3,"names":["useCopyToClipboard","useState","useEffect","useRef","copy","__","CopyButton","Tooltip","ColorCopyButton","props","color","colorType","copiedColor","setCopiedColor","copyTimer","copyRef","toHslString","toRgbString","toHex","current","clearTimeout","setTimeout","undefined","createElement","delay","hideOnClick","text","size","ref","icon","showTooltip"],"sources":["@wordpress/components/src/color-picker/color-copy-button.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCopyToClipboard } from '@wordpress/compose';\nimport { useState, useEffect, useRef } from '@wordpress/element';\nimport { copy } from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { CopyButton } from './styles';\nimport Tooltip from '../tooltip';\n\nimport type { ColorCopyButtonProps } from './types';\n\nexport const ColorCopyButton = ( props: ColorCopyButtonProps ) => {\n\tconst { color, colorType } = props;\n\tconst [ copiedColor, setCopiedColor ] = useState< string | null >( null );\n\tconst copyTimer = useRef< ReturnType< typeof setTimeout > | undefined >();\n\tconst copyRef = useCopyToClipboard< HTMLDivElement >(\n\t\t() => {\n\t\t\tswitch ( colorType ) {\n\t\t\t\tcase 'hsl': {\n\t\t\t\t\treturn color.toHslString();\n\t\t\t\t}\n\t\t\t\tcase 'rgb': {\n\t\t\t\t\treturn color.toRgbString();\n\t\t\t\t}\n\t\t\t\tdefault:\n\t\t\t\tcase 'hex': {\n\t\t\t\t\treturn color.toHex();\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t() => {\n\t\t\tif ( copyTimer.current ) {\n\t\t\t\tclearTimeout( copyTimer.current );\n\t\t\t}\n\t\t\tsetCopiedColor( color.toHex() );\n\t\t\tcopyTimer.current = setTimeout( () => {\n\t\t\t\tsetCopiedColor( null );\n\t\t\t\tcopyTimer.current = undefined;\n\t\t\t}, 3000 );\n\t\t}\n\t);\n\tuseEffect( () => {\n\t\t// Clear copyTimer on component unmount.\n\t\treturn () => {\n\t\t\tif ( copyTimer.current ) {\n\t\t\t\tclearTimeout( copyTimer.current );\n\t\t\t}\n\t\t};\n\t}, [] );\n\n\treturn (\n\t\t<Tooltip\n\t\t\tdelay={ 0 }\n\t\t\thideOnClick={ false }\n\t\t\ttext={\n\t\t\t\tcopiedColor === color.toHex() ? __( 'Copied!' ) : __( 'Copy' )\n\t\t\t}\n\t\t>\n\t\t\t<CopyButton\n\t\t\t\tsize=\"small\"\n\t\t\t\tref={ copyRef }\n\t\t\t\ticon={ copy }\n\t\t\t\tshowTooltip={ false }\n\t\t\t/>\n\t\t</Tooltip>\n\t);\n};\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,kBAAkB,QAAQ,oBAAoB;AACvD,SAASC,QAAQ,EAAEC,SAAS,EAAEC,MAAM,QAAQ,oBAAoB;AAChE,SAASC,IAAI,QAAQ,kBAAkB;AACvC,SAASC,EAAE,QAAQ,iBAAiB;;AAEpC;AACA;AACA;AACA,SAASC,UAAU,QAAQ,UAAU;AACrC,OAAOC,OAAO,MAAM,YAAY;AAIhC,OAAO,MAAMC,eAAe,GAAKC,KAA2B,IAAM;EACjE,MAAM;IAAEC,KAAK;IAAEC;EAAU,CAAC,GAAGF,KAAK;EAClC,MAAM,CAAEG,WAAW,EAAEC,cAAc,CAAE,GAAGZ,QAAQ,CAAmB,IAAK,CAAC;EACzE,MAAMa,SAAS,GAAGX,MAAM,CAAgD,CAAC;EACzE,MAAMY,OAAO,GAAGf,kBAAkB,CACjC,MAAM;IACL,QAASW,SAAS;MACjB,KAAK,KAAK;QAAE;UACX,OAAOD,KAAK,CAACM,WAAW,CAAC,CAAC;QAC3B;MACA,KAAK,KAAK;QAAE;UACX,OAAON,KAAK,CAACO,WAAW,CAAC,CAAC;QAC3B;MACA;MACA,KAAK,KAAK;QAAE;UACX,OAAOP,KAAK,CAACQ,KAAK,CAAC,CAAC;QACrB;IACD;EACD,CAAC,EACD,MAAM;IACL,IAAKJ,SAAS,CAACK,OAAO,EAAG;MACxBC,YAAY,CAAEN,SAAS,CAACK,OAAQ,CAAC;IAClC;IACAN,cAAc,CAAEH,KAAK,CAACQ,KAAK,CAAC,CAAE,CAAC;IAC/BJ,SAAS,CAACK,OAAO,GAAGE,UAAU,CAAE,MAAM;MACrCR,cAAc,CAAE,IAAK,CAAC;MACtBC,SAAS,CAACK,OAAO,GAAGG,SAAS;IAC9B,CAAC,EAAE,IAAK,CAAC;EACV,CACD,CAAC;EACDpB,SAAS,CAAE,MAAM;IAChB;IACA,OAAO,MAAM;MACZ,IAAKY,SAAS,CAACK,OAAO,EAAG;QACxBC,YAAY,CAAEN,SAAS,CAACK,OAAQ,CAAC;MAClC;IACD,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EAEP,OACCI,aAAA,CAAChB,OAAO;IACPiB,KAAK,EAAG,CAAG;IACXC,WAAW,EAAG,KAAO;IACrBC,IAAI,EACHd,WAAW,KAAKF,KAAK,CAACQ,KAAK,CAAC,CAAC,GAAGb,EAAE,CAAE,SAAU,CAAC,GAAGA,EAAE,CAAE,MAAO;EAC7D,GAEDkB,aAAA,CAACjB,UAAU;IACVqB,IAAI,EAAC,OAAO;IACZC,GAAG,EAAGb,OAAS;IACfc,IAAI,EAAGzB,IAAM;IACb0B,WAAW,EAAG;EAAO,CACrB,CACO,CAAC;AAEZ,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["@wordpress/components/src/context/wordpress-component.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type * as React from 'react';\n\n// Based on https://github.com/reakit/reakit/blob/master/packages/reakit-utils/src/types.ts\nexport type WordPressComponentProps<\n\t/** Prop types. */\n\tP,\n\t/** The HTML element to inherit props from. */\n\tT extends React.ElementType,\n\t/** Supports polymorphism through the `as` prop. */\n\tIsPolymorphic extends boolean = true,\n> = P &\n\t// The `children` prop is being explicitly omitted since it is otherwise implicitly added\n\t// by `ComponentPropsWithRef`. The context is that components should require the `children`\n\t// prop explicitly when needed (see https://github.com/WordPress/gutenberg/pull/31817).\n\tOmit< React.ComponentPropsWithoutRef< T >, 'as' | keyof P | 'children' > &\n\t( IsPolymorphic extends true\n\t\t? {\n\t\t\t\t/** The HTML element or React component to render the component as. */\n\t\t\t\tas?: T | keyof JSX.IntrinsicElements;\n\t\t }\n\t\t: {} );\n\nexport type WordPressComponent<\n\tT extends React.ElementType,\n\tO,\n\tIsPolymorphic extends boolean,\n> = {\n\t< TT extends React.ElementType >(\n\t\tprops: WordPressComponentProps< O, TT, IsPolymorphic > &\n\t\t\t( IsPolymorphic extends true ? { as: TT } : {} )\n\t): JSX.Element | null;\n\t(\n\t\tprops: WordPressComponentProps< O, T, IsPolymorphic >\n\t): JSX.Element | null;\n\tdisplayName?: string;\n\t/**\n\t * A CSS selector used to fake component interpolation in styled components\n\t * for components not generated by `styled`. Anything passed to `contextConnect`\n\t * will get this property.\n\t *\n\t * We restrict it to a class to align with the already existing class names that\n\t * are generated by the context system.\n\t */\n\tselector?: `.${ string }`;\n};\n\nexport type WordPressComponentFromProps<\n\tProps,\n\tForwardsRef extends boolean = true,\n> = Props extends WordPressComponentProps< infer P, infer T, infer I >\n\t? WordPressComponent<\n\t\t\tT,\n\t\t\tP & ( ForwardsRef extends true ? React.RefAttributes< any > : {} ),\n\t\t\tI\n\t >\n\t: never;\n"],"mappings":""}
1
+ {"version":3,"names":[],"sources":["@wordpress/components/src/context/wordpress-component.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type * as React from 'react';\n\n// Based on https://github.com/reakit/reakit/blob/master/packages/reakit-utils/src/types.ts\nexport type WordPressComponentProps<\n\t/** Prop types. */\n\tP,\n\t/** The HTML element to inherit props from. */\n\tT extends React.ElementType | null,\n\t/** Supports polymorphism through the `as` prop. */\n\tIsPolymorphic extends boolean = true,\n> = P &\n\t( T extends React.ElementType\n\t\t? // The `children` prop is being explicitly omitted since it is otherwise implicitly added\n\t\t // by `ComponentPropsWithRef`. The context is that components should require the `children`\n\t\t // prop explicitly when needed (see https://github.com/WordPress/gutenberg/pull/31817).\n\t\t Omit<\n\t\t\t\tReact.ComponentPropsWithoutRef< T >,\n\t\t\t\t'as' | keyof P | 'children'\n\t\t >\n\t\t: {} ) &\n\t( IsPolymorphic extends true\n\t\t? {\n\t\t\t\t/** The HTML element or React component to render the component as. */\n\t\t\t\tas?: T | keyof JSX.IntrinsicElements;\n\t\t }\n\t\t: {} );\n\nexport type WordPressComponent<\n\tT extends React.ElementType | null,\n\tO,\n\tIsPolymorphic extends boolean,\n> = {\n\t< TT extends React.ElementType >(\n\t\tprops: WordPressComponentProps< O, TT, IsPolymorphic > &\n\t\t\t( IsPolymorphic extends true ? { as: TT } : {} )\n\t): JSX.Element | null;\n\t(\n\t\tprops: WordPressComponentProps< O, T, IsPolymorphic >\n\t): JSX.Element | null;\n\tdisplayName?: string;\n\t/**\n\t * A CSS selector used to fake component interpolation in styled components\n\t * for components not generated by `styled`. Anything passed to `contextConnect`\n\t * will get this property.\n\t *\n\t * We restrict it to a class to align with the already existing class names that\n\t * are generated by the context system.\n\t */\n\tselector?: `.${ string }`;\n};\n\nexport type WordPressComponentFromProps<\n\tProps,\n\tForwardsRef extends boolean = true,\n> = Props extends WordPressComponentProps< infer P, infer T, infer I >\n\t? WordPressComponent<\n\t\t\tT,\n\t\t\tP & ( ForwardsRef extends true ? React.RefAttributes< any > : {} ),\n\t\t\tI\n\t >\n\t: never;\n"],"mappings":""}