@wordpress/components 21.3.0 → 22.1.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 (811) hide show
  1. package/CHANGELOG.md +107 -1
  2. package/build/angle-picker-control/index.js +4 -2
  3. package/build/angle-picker-control/index.js.map +1 -1
  4. package/build/autocomplete/autocompleter-ui.js +28 -2
  5. package/build/autocomplete/autocompleter-ui.js.map +1 -1
  6. package/build/autocomplete/index.js +7 -3
  7. package/build/autocomplete/index.js.map +1 -1
  8. package/build/border-box-control/border-box-control/component.js +63 -15
  9. package/build/border-box-control/border-box-control/component.js.map +1 -1
  10. package/build/border-box-control/border-box-control/hook.js +19 -3
  11. package/build/border-box-control/border-box-control/hook.js.map +1 -1
  12. package/build/border-box-control/border-box-control-linked-button/hook.js +3 -3
  13. package/build/border-box-control/border-box-control-linked-button/hook.js.map +1 -1
  14. package/build/border-box-control/border-box-control-split-controls/component.js +3 -3
  15. package/build/border-box-control/border-box-control-split-controls/component.js.map +1 -1
  16. package/build/border-box-control/border-box-control-split-controls/hook.js +18 -11
  17. package/build/border-box-control/border-box-control-split-controls/hook.js.map +1 -1
  18. package/build/border-box-control/border-box-control-visualizer/hook.js +3 -7
  19. package/build/border-box-control/border-box-control-visualizer/hook.js.map +1 -1
  20. package/build/border-box-control/styles.js +34 -34
  21. package/build/border-box-control/styles.js.map +1 -1
  22. package/build/border-control/border-control/component.js +6 -5
  23. package/build/border-control/border-control/component.js.map +1 -1
  24. package/build/border-control/border-control/hook.js +22 -5
  25. package/build/border-control/border-control/hook.js.map +1 -1
  26. package/build/border-control/border-control-dropdown/component.js +1 -1
  27. package/build/border-control/border-control-dropdown/component.js.map +1 -1
  28. package/build/border-control/border-control-dropdown/hook.js +15 -7
  29. package/build/border-control/border-control-dropdown/hook.js.map +1 -1
  30. package/build/border-control/styles.js +19 -34
  31. package/build/border-control/styles.js.map +1 -1
  32. package/build/box-control/index.js +6 -2
  33. package/build/box-control/index.js.map +1 -1
  34. package/build/circular-option-picker/index.js +14 -14
  35. package/build/circular-option-picker/index.js.map +1 -1
  36. package/build/color-palette/index.js +84 -31
  37. package/build/color-palette/index.js.map +1 -1
  38. package/build/color-palette/styles.js +3 -3
  39. package/build/color-palette/styles.js.map +1 -1
  40. package/build/color-palette/types.js +6 -0
  41. package/build/color-palette/types.js.map +1 -0
  42. package/build/color-picker/input-with-slider.js +18 -4
  43. package/build/color-picker/input-with-slider.js.map +1 -1
  44. package/build/custom-gradient-picker/gradient-bar/index.js +1 -3
  45. package/build/custom-gradient-picker/gradient-bar/index.js.map +1 -1
  46. package/build/custom-select-control/index.js +12 -5
  47. package/build/custom-select-control/index.js.map +1 -1
  48. package/build/dashicon/index.js +17 -2
  49. package/build/dashicon/index.js.map +1 -1
  50. package/build/date-time/date-time/index.js +2 -0
  51. package/build/date-time/date-time/index.js.map +1 -1
  52. package/build/date-time/time/index.js +4 -4
  53. package/build/date-time/time/index.js.map +1 -1
  54. package/build/disabled/index.js +8 -1
  55. package/build/disabled/index.js.map +1 -1
  56. package/build/draggable/index.js +58 -38
  57. package/build/draggable/index.js.map +1 -1
  58. package/build/draggable/types.js +6 -0
  59. package/build/draggable/types.js.map +1 -0
  60. package/build/external-link/index.js +13 -2
  61. package/build/external-link/index.js.map +1 -1
  62. package/build/flex/flex/hook.js +2 -3
  63. package/build/flex/flex/hook.js.map +1 -1
  64. package/build/focal-point-picker/focal-point.js +2 -12
  65. package/build/focal-point-picker/focal-point.js.map +1 -1
  66. package/build/focal-point-picker/styles/focal-point-style.js +11 -51
  67. package/build/focal-point-picker/styles/focal-point-style.js.map +1 -1
  68. package/build/focusable-iframe/index.js +0 -1
  69. package/build/focusable-iframe/index.js.map +1 -1
  70. package/build/font-size-picker/constants.js +41 -0
  71. package/build/font-size-picker/constants.js.map +1 -0
  72. package/build/font-size-picker/font-size-picker-select.js +97 -0
  73. package/build/font-size-picker/font-size-picker-select.js.map +1 -0
  74. package/build/font-size-picker/font-size-picker-toggle-group.js +50 -0
  75. package/build/font-size-picker/font-size-picker-toggle-group.js.map +1 -0
  76. package/build/font-size-picker/index.js +86 -110
  77. package/build/font-size-picker/index.js.map +1 -1
  78. package/build/font-size-picker/utils.js +16 -109
  79. package/build/font-size-picker/utils.js.map +1 -1
  80. package/build/form-file-upload/index.js.map +1 -1
  81. package/build/form-token-field/index.js +9 -6
  82. package/build/form-token-field/index.js.map +1 -1
  83. package/build/higher-order/navigate-regions/index.js +3 -0
  84. package/build/higher-order/navigate-regions/index.js.map +1 -1
  85. package/build/higher-order/with-filters/index.js +1 -7
  86. package/build/higher-order/with-filters/index.js.map +1 -1
  87. package/build/icon/index.js +3 -2
  88. package/build/icon/index.js.map +1 -1
  89. package/build/index.js +15 -1
  90. package/build/index.js.map +1 -1
  91. package/build/input-control/index.js +2 -0
  92. package/build/input-control/index.js.map +1 -1
  93. package/build/input-control/input-base.js +1 -1
  94. package/build/input-control/input-base.js.map +1 -1
  95. package/build/input-control/styles/input-control-styles.js +21 -21
  96. package/build/input-control/styles/input-control-styles.js.map +1 -1
  97. package/build/isolated-event-container/index.js +5 -9
  98. package/build/isolated-event-container/index.js.map +1 -1
  99. package/build/item-group/styles.js +10 -10
  100. package/build/item-group/styles.js.map +1 -1
  101. package/build/menu-group/index.js +17 -3
  102. package/build/menu-group/index.js.map +1 -1
  103. package/build/menu-group/types.js +6 -0
  104. package/build/menu-group/types.js.map +1 -0
  105. package/build/navigator/navigator-screen/component.js +27 -17
  106. package/build/navigator/navigator-screen/component.js.map +1 -1
  107. package/build/number-control/index.js +82 -22
  108. package/build/number-control/index.js.map +1 -1
  109. package/build/number-control/styles/number-control-styles.js +36 -6
  110. package/build/number-control/styles/number-control-styles.js.map +1 -1
  111. package/build/palette-edit/index.js +3 -1
  112. package/build/palette-edit/index.js.map +1 -1
  113. package/build/popover/index.js +23 -33
  114. package/build/popover/index.js.map +1 -1
  115. package/build/radio-group/index.js +7 -1
  116. package/build/radio-group/index.js.map +1 -1
  117. package/build/{radio → radio-group/radio}/index.js +7 -1
  118. package/build/radio-group/radio/index.js.map +1 -0
  119. package/build/{radio-context → radio-group/radio-context}/index.js +0 -0
  120. package/build/radio-group/radio-context/index.js.map +1 -0
  121. package/build/range-control/styles/range-control-styles.js +47 -57
  122. package/build/range-control/styles/range-control-styles.js.map +1 -1
  123. package/build/slot-fill/bubbles-virtually/fill.js +9 -5
  124. package/build/slot-fill/bubbles-virtually/fill.js.map +1 -1
  125. package/build/slot-fill/bubbles-virtually/slot.js +13 -8
  126. package/build/slot-fill/bubbles-virtually/slot.js.map +1 -1
  127. package/build/slot-fill/bubbles-virtually/use-slot.js +15 -9
  128. package/build/slot-fill/bubbles-virtually/use-slot.js.map +1 -1
  129. package/build/slot-fill/fill.js +12 -4
  130. package/build/slot-fill/fill.js.map +1 -1
  131. package/build/slot-fill/use-slot.js +3 -1
  132. package/build/slot-fill/use-slot.js.map +1 -1
  133. package/build/snackbar/index.js +1 -1
  134. package/build/snackbar/index.js.map +1 -1
  135. package/build/spinner/styles.js +4 -4
  136. package/build/spinner/styles.js.map +1 -1
  137. package/build/tab-panel/index.js +4 -9
  138. package/build/tab-panel/index.js.map +1 -1
  139. package/build/text-control/index.js +0 -2
  140. package/build/text-control/index.js.map +1 -1
  141. package/build/toggle-control/index.js +15 -3
  142. package/build/toggle-control/index.js.map +1 -1
  143. package/build/toggle-group-control/toggle-group-control/as-button-group.js +90 -0
  144. package/build/toggle-group-control/toggle-group-control/as-button-group.js.map +1 -0
  145. package/build/toggle-group-control/toggle-group-control/as-radio-group.js +90 -0
  146. package/build/toggle-group-control/toggle-group-control/as-radio-group.js.map +1 -0
  147. package/build/toggle-group-control/toggle-group-control/component.js +22 -50
  148. package/build/toggle-group-control/toggle-group-control/component.js.map +1 -1
  149. package/build/toggle-group-control/toggle-group-control/styles.js +13 -8
  150. package/build/toggle-group-control/toggle-group-control/styles.js.map +1 -1
  151. package/build/toggle-group-control/toggle-group-control-option-base/component.js +39 -17
  152. package/build/toggle-group-control/toggle-group-control-option-base/component.js.map +1 -1
  153. package/build/toggle-group-control/toggle-group-control-option-base/styles.js +23 -23
  154. package/build/toggle-group-control/toggle-group-control-option-base/styles.js.map +1 -1
  155. package/build/toolbar-dropdown-menu/index.js +1 -1
  156. package/build/toolbar-dropdown-menu/index.js.map +1 -1
  157. package/build/tools-panel/styles.js +14 -14
  158. package/build/tools-panel/styles.js.map +1 -1
  159. package/build/tools-panel/tools-panel-item/hook.js +9 -5
  160. package/build/tools-panel/tools-panel-item/hook.js.map +1 -1
  161. package/build/ui/context/context-system-provider.js +9 -22
  162. package/build/ui/context/context-system-provider.js.map +1 -1
  163. package/build/unit-control/index.js +7 -9
  164. package/build/unit-control/index.js.map +1 -1
  165. package/build/unit-control/styles/unit-control-styles.js +15 -25
  166. package/build/unit-control/styles/unit-control-styles.js.map +1 -1
  167. package/build/utils/colors-values.js +3 -2
  168. package/build/utils/colors-values.js.map +1 -1
  169. package/build/utils/config-values.js +0 -1
  170. package/build/utils/config-values.js.map +1 -1
  171. package/build/utils/hooks/use-update-effect.js +5 -1
  172. package/build/utils/hooks/use-update-effect.js.map +1 -1
  173. package/build/utils/input/base.js +2 -2
  174. package/build/utils/input/base.js.map +1 -1
  175. package/build/view/index.js.map +1 -1
  176. package/build-module/angle-picker-control/index.js +3 -2
  177. package/build-module/angle-picker-control/index.js.map +1 -1
  178. package/build-module/autocomplete/autocompleter-ui.js +29 -3
  179. package/build-module/autocomplete/autocompleter-ui.js.map +1 -1
  180. package/build-module/autocomplete/index.js +7 -3
  181. package/build-module/autocomplete/index.js.map +1 -1
  182. package/build-module/border-box-control/border-box-control/component.js +61 -13
  183. package/build-module/border-box-control/border-box-control/component.js.map +1 -1
  184. package/build-module/border-box-control/border-box-control/hook.js +19 -3
  185. package/build-module/border-box-control/border-box-control/hook.js.map +1 -1
  186. package/build-module/border-box-control/border-box-control-linked-button/hook.js +3 -3
  187. package/build-module/border-box-control/border-box-control-linked-button/hook.js.map +1 -1
  188. package/build-module/border-box-control/border-box-control-split-controls/component.js +3 -3
  189. package/build-module/border-box-control/border-box-control-split-controls/component.js.map +1 -1
  190. package/build-module/border-box-control/border-box-control-split-controls/hook.js +19 -10
  191. package/build-module/border-box-control/border-box-control-split-controls/hook.js.map +1 -1
  192. package/build-module/border-box-control/border-box-control-visualizer/hook.js +4 -6
  193. package/build-module/border-box-control/border-box-control-visualizer/hook.js.map +1 -1
  194. package/build-module/border-box-control/styles.js +26 -28
  195. package/build-module/border-box-control/styles.js.map +1 -1
  196. package/build-module/border-control/border-control/component.js +6 -5
  197. package/build-module/border-control/border-control/component.js.map +1 -1
  198. package/build-module/border-control/border-control/hook.js +22 -5
  199. package/build-module/border-control/border-control/hook.js.map +1 -1
  200. package/build-module/border-control/border-control-dropdown/component.js +1 -1
  201. package/build-module/border-control/border-control-dropdown/component.js.map +1 -1
  202. package/build-module/border-control/border-control-dropdown/hook.js +15 -7
  203. package/build-module/border-control/border-control-dropdown/hook.js.map +1 -1
  204. package/build-module/border-control/styles.js +20 -36
  205. package/build-module/border-control/styles.js.map +1 -1
  206. package/build-module/box-control/index.js +6 -2
  207. package/build-module/box-control/index.js.map +1 -1
  208. package/build-module/circular-option-picker/index.js +14 -14
  209. package/build-module/circular-option-picker/index.js.map +1 -1
  210. package/build-module/color-palette/index.js +82 -29
  211. package/build-module/color-palette/index.js.map +1 -1
  212. package/build-module/color-palette/styles.js +3 -3
  213. package/build-module/color-palette/styles.js.map +1 -1
  214. package/build-module/color-palette/types.js +2 -0
  215. package/build-module/color-palette/types.js.map +1 -0
  216. package/build-module/color-picker/input-with-slider.js +18 -4
  217. package/build-module/color-picker/input-with-slider.js.map +1 -1
  218. package/build-module/custom-gradient-picker/gradient-bar/index.js +1 -2
  219. package/build-module/custom-gradient-picker/gradient-bar/index.js.map +1 -1
  220. package/build-module/custom-select-control/index.js +12 -5
  221. package/build-module/custom-select-control/index.js.map +1 -1
  222. package/build-module/dashicon/index.js +17 -2
  223. package/build-module/dashicon/index.js.map +1 -1
  224. package/build-module/date-time/date-time/index.js +2 -0
  225. package/build-module/date-time/date-time/index.js.map +1 -1
  226. package/build-module/date-time/time/index.js +4 -4
  227. package/build-module/date-time/time/index.js.map +1 -1
  228. package/build-module/disabled/index.js +8 -1
  229. package/build-module/disabled/index.js.map +1 -1
  230. package/build-module/draggable/index.js +59 -38
  231. package/build-module/draggable/index.js.map +1 -1
  232. package/build-module/draggable/types.js +2 -0
  233. package/build-module/draggable/types.js.map +1 -0
  234. package/build-module/external-link/index.js +13 -2
  235. package/build-module/external-link/index.js.map +1 -1
  236. package/build-module/flex/flex/hook.js +2 -3
  237. package/build-module/flex/flex/hook.js.map +1 -1
  238. package/build-module/focal-point-picker/focal-point.js +3 -13
  239. package/build-module/focal-point-picker/focal-point.js.map +1 -1
  240. package/build-module/focal-point-picker/styles/focal-point-style.js +6 -52
  241. package/build-module/focal-point-picker/styles/focal-point-style.js.map +1 -1
  242. package/build-module/focusable-iframe/index.js +0 -1
  243. package/build-module/focusable-iframe/index.js.map +1 -1
  244. package/build-module/font-size-picker/constants.js +31 -0
  245. package/build-module/font-size-picker/constants.js.map +1 -0
  246. package/build-module/font-size-picker/font-size-picker-select.js +83 -0
  247. package/build-module/font-size-picker/font-size-picker-select.js.map +1 -0
  248. package/build-module/font-size-picker/font-size-picker-toggle-group.js +40 -0
  249. package/build-module/font-size-picker/font-size-picker-toggle-group.js.map +1 -0
  250. package/build-module/font-size-picker/index.js +88 -111
  251. package/build-module/font-size-picker/index.js.map +1 -1
  252. package/build-module/font-size-picker/utils.js +15 -105
  253. package/build-module/font-size-picker/utils.js.map +1 -1
  254. package/build-module/form-file-upload/index.js.map +1 -1
  255. package/build-module/form-token-field/index.js +9 -6
  256. package/build-module/form-token-field/index.js.map +1 -1
  257. package/build-module/higher-order/navigate-regions/index.js +3 -0
  258. package/build-module/higher-order/navigate-regions/index.js.map +1 -1
  259. package/build-module/higher-order/with-filters/index.js +1 -6
  260. package/build-module/higher-order/with-filters/index.js.map +1 -1
  261. package/build-module/icon/index.js +3 -2
  262. package/build-module/icon/index.js.map +1 -1
  263. package/build-module/index.js +3 -2
  264. package/build-module/index.js.map +1 -1
  265. package/build-module/input-control/index.js +2 -0
  266. package/build-module/input-control/index.js.map +1 -1
  267. package/build-module/input-control/input-base.js +1 -1
  268. package/build-module/input-control/input-base.js.map +1 -1
  269. package/build-module/input-control/styles/input-control-styles.js +21 -21
  270. package/build-module/input-control/styles/input-control-styles.js.map +1 -1
  271. package/build-module/isolated-event-container/index.js +7 -9
  272. package/build-module/isolated-event-container/index.js.map +1 -1
  273. package/build-module/item-group/styles.js +10 -10
  274. package/build-module/item-group/styles.js.map +1 -1
  275. package/build-module/menu-group/index.js +20 -2
  276. package/build-module/menu-group/index.js.map +1 -1
  277. package/build-module/menu-group/types.js +2 -0
  278. package/build-module/menu-group/types.js.map +1 -0
  279. package/build-module/navigator/navigator-screen/component.js +27 -7
  280. package/build-module/navigator/navigator-screen/component.js.map +1 -1
  281. package/build-module/number-control/index.js +81 -26
  282. package/build-module/number-control/index.js.map +1 -1
  283. package/build-module/number-control/styles/number-control-styles.js +30 -4
  284. package/build-module/number-control/styles/number-control-styles.js.map +1 -1
  285. package/build-module/palette-edit/index.js +3 -1
  286. package/build-module/palette-edit/index.js.map +1 -1
  287. package/build-module/popover/index.js +23 -33
  288. package/build-module/popover/index.js.map +1 -1
  289. package/build-module/radio-group/index.js +6 -1
  290. package/build-module/radio-group/index.js.map +1 -1
  291. package/build-module/{radio → radio-group/radio}/index.js +6 -1
  292. package/build-module/radio-group/radio/index.js.map +1 -0
  293. package/build-module/{radio-context → radio-group/radio-context}/index.js +0 -0
  294. package/build-module/radio-group/radio-context/index.js.map +1 -0
  295. package/build-module/range-control/styles/range-control-styles.js +47 -57
  296. package/build-module/range-control/styles/range-control-styles.js.map +1 -1
  297. package/build-module/slot-fill/bubbles-virtually/fill.js +9 -5
  298. package/build-module/slot-fill/bubbles-virtually/fill.js.map +1 -1
  299. package/build-module/slot-fill/bubbles-virtually/slot.js +13 -8
  300. package/build-module/slot-fill/bubbles-virtually/slot.js.map +1 -1
  301. package/build-module/slot-fill/bubbles-virtually/use-slot.js +15 -9
  302. package/build-module/slot-fill/bubbles-virtually/use-slot.js.map +1 -1
  303. package/build-module/slot-fill/fill.js +12 -4
  304. package/build-module/slot-fill/fill.js.map +1 -1
  305. package/build-module/slot-fill/use-slot.js +3 -1
  306. package/build-module/slot-fill/use-slot.js.map +1 -1
  307. package/build-module/snackbar/index.js +1 -1
  308. package/build-module/snackbar/index.js.map +1 -1
  309. package/build-module/spinner/styles.js +4 -4
  310. package/build-module/spinner/styles.js.map +1 -1
  311. package/build-module/tab-panel/index.js +5 -10
  312. package/build-module/tab-panel/index.js.map +1 -1
  313. package/build-module/text-control/index.js +0 -2
  314. package/build-module/text-control/index.js.map +1 -1
  315. package/build-module/toggle-control/index.js +15 -3
  316. package/build-module/toggle-control/index.js.map +1 -1
  317. package/build-module/toggle-group-control/toggle-group-control/as-button-group.js +76 -0
  318. package/build-module/toggle-group-control/toggle-group-control/as-button-group.js.map +1 -0
  319. package/build-module/toggle-group-control/toggle-group-control/as-radio-group.js +75 -0
  320. package/build-module/toggle-group-control/toggle-group-control/as-radio-group.js.map +1 -0
  321. package/build-module/toggle-group-control/toggle-group-control/component.js +20 -49
  322. package/build-module/toggle-group-control/toggle-group-control/component.js.map +1 -1
  323. package/build-module/toggle-group-control/toggle-group-control/styles.js +13 -6
  324. package/build-module/toggle-group-control/toggle-group-control/styles.js.map +1 -1
  325. package/build-module/toggle-group-control/toggle-group-control-option-base/component.js +39 -17
  326. package/build-module/toggle-group-control/toggle-group-control-option-base/component.js.map +1 -1
  327. package/build-module/toggle-group-control/toggle-group-control-option-base/styles.js +21 -18
  328. package/build-module/toggle-group-control/toggle-group-control-option-base/styles.js.map +1 -1
  329. package/build-module/toolbar-dropdown-menu/index.js +1 -1
  330. package/build-module/toolbar-dropdown-menu/index.js.map +1 -1
  331. package/build-module/tools-panel/styles.js +14 -14
  332. package/build-module/tools-panel/styles.js.map +1 -1
  333. package/build-module/tools-panel/tools-panel-item/hook.js +9 -5
  334. package/build-module/tools-panel/tools-panel-item/hook.js.map +1 -1
  335. package/build-module/ui/context/context-system-provider.js +6 -20
  336. package/build-module/ui/context/context-system-provider.js.map +1 -1
  337. package/build-module/unit-control/index.js +8 -10
  338. package/build-module/unit-control/index.js.map +1 -1
  339. package/build-module/unit-control/styles/unit-control-styles.js +8 -24
  340. package/build-module/unit-control/styles/unit-control-styles.js.map +1 -1
  341. package/build-module/utils/colors-values.js +3 -2
  342. package/build-module/utils/colors-values.js.map +1 -1
  343. package/build-module/utils/config-values.js +0 -1
  344. package/build-module/utils/config-values.js.map +1 -1
  345. package/build-module/utils/hooks/use-update-effect.js +5 -1
  346. package/build-module/utils/hooks/use-update-effect.js.map +1 -1
  347. package/build-module/utils/input/base.js +2 -2
  348. package/build-module/utils/input/base.js.map +1 -1
  349. package/build-module/view/index.js.map +1 -1
  350. package/build-style/style-rtl.css +93 -85
  351. package/build-style/style.css +91 -83
  352. package/build-types/base-field/hook.d.ts +11 -11
  353. package/build-types/border-box-control/border-box-control/component.d.ts +55 -6
  354. package/build-types/border-box-control/border-box-control/component.d.ts.map +1 -1
  355. package/build-types/border-box-control/border-box-control/hook.d.ts +18 -17
  356. package/build-types/border-box-control/border-box-control/hook.d.ts.map +1 -1
  357. package/build-types/border-box-control/border-box-control-linked-button/component.d.ts +4 -2
  358. package/build-types/border-box-control/border-box-control-linked-button/component.d.ts.map +1 -1
  359. package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts +12 -12
  360. package/build-types/border-box-control/border-box-control-linked-button/hook.d.ts.map +1 -1
  361. package/build-types/border-box-control/border-box-control-split-controls/component.d.ts +3 -3
  362. package/build-types/border-box-control/border-box-control-split-controls/component.d.ts.map +1 -1
  363. package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts +17 -17
  364. package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts.map +1 -1
  365. package/build-types/border-box-control/border-box-control-visualizer/component.d.ts +3 -2
  366. package/build-types/border-box-control/border-box-control-visualizer/component.d.ts.map +1 -1
  367. package/build-types/border-box-control/border-box-control-visualizer/hook.d.ts +12 -12
  368. package/build-types/border-box-control/border-box-control-visualizer/hook.d.ts.map +1 -1
  369. package/build-types/border-box-control/stories/index.d.ts +17 -0
  370. package/build-types/border-box-control/stories/index.d.ts.map +1 -0
  371. package/build-types/border-box-control/styles.d.ts +7 -6
  372. package/build-types/border-box-control/styles.d.ts.map +1 -1
  373. package/build-types/border-box-control/types.d.ts +5 -42
  374. package/build-types/border-box-control/types.d.ts.map +1 -1
  375. package/build-types/border-control/border-control/component.d.ts +4 -2
  376. package/build-types/border-control/border-control/component.d.ts.map +1 -1
  377. package/build-types/border-control/border-control/hook.d.ts +18 -18
  378. package/build-types/border-control/border-control/hook.d.ts.map +1 -1
  379. package/build-types/border-control/border-control-dropdown/component.d.ts +3 -3
  380. package/build-types/border-control/border-control-dropdown/component.d.ts.map +1 -1
  381. package/build-types/border-control/border-control-dropdown/hook.d.ts +16 -16
  382. package/build-types/border-control/border-control-dropdown/hook.d.ts.map +1 -1
  383. package/build-types/border-control/border-control-style-picker/hook.d.ts +11 -11
  384. package/build-types/border-control/stories/index.d.ts +24 -12
  385. package/build-types/border-control/stories/index.d.ts.map +1 -1
  386. package/build-types/border-control/styles.d.ts +3 -3
  387. package/build-types/border-control/styles.d.ts.map +1 -1
  388. package/build-types/border-control/types.d.ts +10 -53
  389. package/build-types/border-control/types.d.ts.map +1 -1
  390. package/build-types/card/card/hook.d.ts +12 -12
  391. package/build-types/card/card-body/hook.d.ts +12 -12
  392. package/build-types/card/card-divider/hook.d.ts +13 -13
  393. package/build-types/card/card-footer/hook.d.ts +12 -12
  394. package/build-types/card/card-header/hook.d.ts +12 -12
  395. package/build-types/card/card-media/hook.d.ts +12 -12
  396. package/build-types/card/stories/index.d.ts.map +1 -1
  397. package/build-types/circular-option-picker/index.d.ts +4 -24
  398. package/build-types/circular-option-picker/index.d.ts.map +1 -1
  399. package/build-types/color-palette/index.d.ts +43 -14
  400. package/build-types/color-palette/index.d.ts.map +1 -1
  401. package/build-types/color-palette/stories/index.d.ts +50 -0
  402. package/build-types/color-palette/stories/index.d.ts.map +1 -0
  403. package/build-types/color-palette/styles.d.ts +3 -2
  404. package/build-types/color-palette/styles.d.ts.map +1 -1
  405. package/build-types/color-palette/test/index.d.ts +2 -0
  406. package/build-types/color-palette/test/index.d.ts.map +1 -0
  407. package/build-types/color-palette/types.d.ts +90 -0
  408. package/build-types/color-palette/types.d.ts.map +1 -0
  409. package/build-types/color-picker/input-with-slider.d.ts.map +1 -1
  410. package/build-types/color-picker/styles.d.ts +5 -4
  411. package/build-types/color-picker/styles.d.ts.map +1 -1
  412. package/build-types/confirm-dialog/component.d.ts +4 -4
  413. package/build-types/custom-select-control/index.d.ts +1 -12
  414. package/build-types/custom-select-control/index.d.ts.map +1 -1
  415. package/build-types/custom-select-control/styles.d.ts +3 -1
  416. package/build-types/custom-select-control/styles.d.ts.map +1 -1
  417. package/build-types/dashicon/index.d.ts +6 -1
  418. package/build-types/dashicon/index.d.ts.map +1 -1
  419. package/build-types/date-time/date/styles.d.ts +3 -3
  420. package/build-types/date-time/date-time/index.d.ts +2 -0
  421. package/build-types/date-time/date-time/index.d.ts.map +1 -1
  422. package/build-types/date-time/date-time/styles.d.ts +3 -3
  423. package/build-types/date-time/stories/date-time.d.ts.map +1 -1
  424. package/build-types/date-time/time/styles.d.ts +8 -4
  425. package/build-types/date-time/time/styles.d.ts.map +1 -1
  426. package/build-types/date-time/types.d.ts +0 -16
  427. package/build-types/date-time/types.d.ts.map +1 -1
  428. package/build-types/disabled/index.d.ts +8 -1
  429. package/build-types/disabled/index.d.ts.map +1 -1
  430. package/build-types/draggable/index.d.ts +42 -66
  431. package/build-types/draggable/index.d.ts.map +1 -1
  432. package/build-types/draggable/stories/index.d.ts +12 -0
  433. package/build-types/draggable/stories/index.d.ts.map +1 -0
  434. package/build-types/draggable/types.d.ts +58 -0
  435. package/build-types/draggable/types.d.ts.map +1 -0
  436. package/build-types/elevation/hook.d.ts +12 -12
  437. package/build-types/external-link/index.d.ts.map +1 -1
  438. package/build-types/external-link/styles/external-link-styles.d.ts +1 -1
  439. package/build-types/external-link/test/index.d.ts +2 -0
  440. package/build-types/external-link/test/index.d.ts.map +1 -0
  441. package/build-types/flex/flex/hook.d.ts +12 -12
  442. package/build-types/flex/flex/hook.d.ts.map +1 -1
  443. package/build-types/flex/flex-block/hook.d.ts +12 -12
  444. package/build-types/flex/flex-item/hook.d.ts +12 -12
  445. package/build-types/focal-point-picker/focal-point.d.ts.map +1 -1
  446. package/build-types/focal-point-picker/styles/focal-point-picker-style.d.ts +2 -2
  447. package/build-types/focal-point-picker/styles/focal-point-style.d.ts +1 -12
  448. package/build-types/focal-point-picker/styles/focal-point-style.d.ts.map +1 -1
  449. package/build-types/focusable-iframe/index.d.ts.map +1 -1
  450. package/build-types/font-size-picker/constants.d.ts +15 -0
  451. package/build-types/font-size-picker/constants.d.ts.map +1 -0
  452. package/build-types/font-size-picker/font-size-picker-select.d.ts +5 -0
  453. package/build-types/font-size-picker/font-size-picker-select.d.ts.map +1 -0
  454. package/build-types/font-size-picker/font-size-picker-toggle-group.d.ts +5 -0
  455. package/build-types/font-size-picker/font-size-picker-toggle-group.d.ts.map +1 -0
  456. package/build-types/font-size-picker/index.d.ts.map +1 -1
  457. package/build-types/font-size-picker/types.d.ts +14 -14
  458. package/build-types/font-size-picker/types.d.ts.map +1 -1
  459. package/build-types/font-size-picker/utils.d.ts +6 -26
  460. package/build-types/font-size-picker/utils.d.ts.map +1 -1
  461. package/build-types/form-file-upload/index.d.ts.map +1 -1
  462. package/build-types/form-file-upload/types.d.ts +5 -4
  463. package/build-types/form-file-upload/types.d.ts.map +1 -1
  464. package/build-types/form-token-field/index.d.ts.map +1 -1
  465. package/build-types/grid/hook.d.ts +12 -12
  466. package/build-types/h-stack/component.d.ts +1 -1
  467. package/build-types/h-stack/hook.d.ts +12 -12
  468. package/build-types/heading/hook.d.ts +12 -12
  469. package/build-types/icon/index.d.ts +1 -1
  470. package/build-types/icon/index.d.ts.map +1 -1
  471. package/build-types/input-control/index.d.ts +1 -1
  472. package/build-types/input-control/index.d.ts.map +1 -1
  473. package/build-types/input-control/input-base.d.ts +5 -2
  474. package/build-types/input-control/input-base.d.ts.map +1 -1
  475. package/build-types/input-control/styles/input-control-styles.d.ts.map +1 -1
  476. package/build-types/input-control/types.d.ts +3 -8
  477. package/build-types/input-control/types.d.ts.map +1 -1
  478. package/build-types/input-control/utils.d.ts +1 -1
  479. package/build-types/isolated-event-container/index.d.ts +3 -2
  480. package/build-types/isolated-event-container/index.d.ts.map +1 -1
  481. package/build-types/item-group/item/hook.d.ts +13 -13
  482. package/build-types/item-group/item-group/hook.d.ts +13 -13
  483. package/build-types/menu-group/index.d.ts +21 -1
  484. package/build-types/menu-group/index.d.ts.map +1 -1
  485. package/build-types/menu-group/test/index.d.ts +2 -0
  486. package/build-types/menu-group/test/index.d.ts.map +1 -0
  487. package/build-types/menu-group/types.d.ts +23 -0
  488. package/build-types/menu-group/types.d.ts.map +1 -0
  489. package/build-types/navigator/navigator-back-button/hook.d.ts +13 -13
  490. package/build-types/navigator/navigator-button/hook.d.ts +13 -13
  491. package/build-types/navigator/navigator-screen/component.d.ts.map +1 -1
  492. package/build-types/number-control/index.d.ts +2 -4
  493. package/build-types/number-control/index.d.ts.map +1 -1
  494. package/build-types/number-control/styles/number-control-styles.d.ts +5 -0
  495. package/build-types/number-control/styles/number-control-styles.d.ts.map +1 -1
  496. package/build-types/number-control/types.d.ts +12 -0
  497. package/build-types/number-control/types.d.ts.map +1 -1
  498. package/build-types/popover/index.d.ts +1 -1
  499. package/build-types/popover/index.d.ts.map +1 -1
  500. package/build-types/popover/stories/e2e/index.d.ts +1 -1
  501. package/build-types/popover/stories/index.d.ts +2 -0
  502. package/build-types/popover/stories/index.d.ts.map +1 -1
  503. package/build-types/popover/types.d.ts +18 -14
  504. package/build-types/popover/types.d.ts.map +1 -1
  505. package/build-types/radio-group/index.d.ts +10 -0
  506. package/build-types/radio-group/index.d.ts.map +1 -0
  507. package/build-types/radio-group/radio/index.d.ts +7 -0
  508. package/build-types/radio-group/radio/index.d.ts.map +1 -0
  509. package/build-types/{radio-context → radio-group/radio-context}/index.d.ts +0 -0
  510. package/build-types/radio-group/radio-context/index.d.ts.map +1 -0
  511. package/build-types/range-control/index.d.ts +1 -1
  512. package/build-types/range-control/styles/range-control-styles.d.ts +2 -1
  513. package/build-types/range-control/styles/range-control-styles.d.ts.map +1 -1
  514. package/build-types/resizable-box/index.d.ts +1 -1
  515. package/build-types/resizable-box/resize-tooltip/index.d.ts +1 -1
  516. package/build-types/resizable-box/resize-tooltip/label.d.ts +1 -1
  517. package/build-types/scrollable/hook.d.ts +12 -12
  518. package/build-types/search-control/index.d.ts +2 -2
  519. package/build-types/search-control/stories/index.d.ts +4 -4
  520. package/build-types/select-control/stories/index.d.ts.map +1 -1
  521. package/build-types/slot-fill/bubbles-virtually/use-slot.d.ts.map +1 -1
  522. package/build-types/slot-fill/fill.d.ts.map +1 -1
  523. package/build-types/slot-fill/use-slot.d.ts.map +1 -1
  524. package/build-types/spacer/hook.d.ts +12 -12
  525. package/build-types/spinner/index.d.ts +1 -1
  526. package/build-types/surface/hook.d.ts +12 -12
  527. package/build-types/tab-panel/index.d.ts.map +1 -1
  528. package/build-types/text/hook.d.ts +12 -12
  529. package/build-types/text-control/index.d.ts +2 -4
  530. package/build-types/text-control/index.d.ts.map +1 -1
  531. package/build-types/text-control/stories/index.d.ts.map +1 -1
  532. package/build-types/toggle-control/index.d.ts.map +1 -1
  533. package/build-types/toggle-control/types.d.ts +2 -1
  534. package/build-types/toggle-control/types.d.ts.map +1 -1
  535. package/build-types/toggle-group-control/stories/index.d.ts +2 -2
  536. package/build-types/toggle-group-control/stories/index.d.ts.map +1 -1
  537. package/build-types/toggle-group-control/toggle-group-control/as-button-group.d.ts +6 -0
  538. package/build-types/toggle-group-control/toggle-group-control/as-button-group.d.ts.map +1 -0
  539. package/build-types/toggle-group-control/toggle-group-control/as-radio-group.d.ts +6 -0
  540. package/build-types/toggle-group-control/toggle-group-control/as-radio-group.d.ts.map +1 -0
  541. package/build-types/toggle-group-control/toggle-group-control/component.d.ts +2 -2
  542. package/build-types/toggle-group-control/toggle-group-control/component.d.ts.map +1 -1
  543. package/build-types/toggle-group-control/toggle-group-control/styles.d.ts +1 -2
  544. package/build-types/toggle-group-control/toggle-group-control/styles.d.ts.map +1 -1
  545. package/build-types/toggle-group-control/toggle-group-control-option-base/component.d.ts.map +1 -1
  546. package/build-types/toggle-group-control/toggle-group-control-option-base/styles.d.ts +4 -7
  547. package/build-types/toggle-group-control/toggle-group-control-option-base/styles.d.ts.map +1 -1
  548. package/build-types/toggle-group-control/toggle-group-control-option-icon/component.d.ts +1 -1
  549. package/build-types/toggle-group-control/types.d.ts +21 -15
  550. package/build-types/toggle-group-control/types.d.ts.map +1 -1
  551. package/build-types/tools-panel/tools-panel/hook.d.ts +12 -12
  552. package/build-types/tools-panel/tools-panel-header/hook.d.ts +12 -12
  553. package/build-types/tools-panel/tools-panel-item/hook.d.ts +12 -12
  554. package/build-types/tools-panel/tools-panel-item/hook.d.ts.map +1 -1
  555. package/build-types/truncate/hook.d.ts +12 -12
  556. package/build-types/ui/context/context-system-provider.d.ts.map +1 -1
  557. package/build-types/ui/control-group/hook.d.ts +12 -12
  558. package/build-types/ui/control-label/component.d.ts +1 -1
  559. package/build-types/ui/control-label/hook.d.ts +12 -12
  560. package/build-types/ui/form-group/form-group.d.ts +4 -4
  561. package/build-types/ui/form-group/use-form-group.d.ts +28 -28
  562. package/build-types/unit-control/index.d.ts +2 -2
  563. package/build-types/unit-control/index.d.ts.map +1 -1
  564. package/build-types/unit-control/styles/unit-control-styles.d.ts +2 -5
  565. package/build-types/unit-control/styles/unit-control-styles.d.ts.map +1 -1
  566. package/build-types/unit-control/types.d.ts +3 -3
  567. package/build-types/unit-control/types.d.ts.map +1 -1
  568. package/build-types/utils/colors-values.d.ts +1 -0
  569. package/build-types/utils/colors-values.d.ts.map +1 -1
  570. package/build-types/utils/config-values.d.ts +0 -1
  571. package/build-types/utils/hooks/use-update-effect.d.ts.map +1 -1
  572. package/build-types/utils/types.d.ts +0 -14
  573. package/build-types/utils/types.d.ts.map +1 -1
  574. package/build-types/v-stack/component.d.ts +2 -2
  575. package/build-types/v-stack/hook.d.ts +12 -12
  576. package/build-types/v-stack/stories/index.d.ts +2 -2
  577. package/build-types/view/index.d.ts +1 -1
  578. package/build-types/view/index.d.ts.map +1 -1
  579. package/package.json +17 -17
  580. package/src/angle-picker-control/index.js +3 -2
  581. package/src/angle-picker-control/stories/index.js +3 -0
  582. package/src/autocomplete/autocompleter-ui.js +29 -2
  583. package/src/autocomplete/index.js +12 -3
  584. package/src/autocomplete/style.scss +1 -1
  585. package/src/autocomplete/test/index.js +89 -0
  586. package/src/base-field/test/__snapshots__/index.js.snap +9 -7
  587. package/src/base-field/test/index.js +27 -15
  588. package/src/border-box-control/border-box-control/README.md +13 -17
  589. package/src/border-box-control/border-box-control/component.tsx +64 -13
  590. package/src/border-box-control/border-box-control/hook.ts +25 -6
  591. package/src/border-box-control/border-box-control-linked-button/hook.ts +3 -6
  592. package/src/border-box-control/border-box-control-split-controls/component.tsx +3 -6
  593. package/src/border-box-control/border-box-control-split-controls/hook.ts +21 -14
  594. package/src/border-box-control/border-box-control-visualizer/hook.ts +4 -7
  595. package/src/border-box-control/stories/index.tsx +90 -0
  596. package/src/border-box-control/styles.ts +28 -22
  597. package/src/border-box-control/test/index.js +287 -122
  598. package/src/border-box-control/types.ts +32 -62
  599. package/src/border-control/border-control/README.md +12 -17
  600. package/src/border-control/border-control/component.tsx +5 -4
  601. package/src/border-control/border-control/hook.ts +20 -6
  602. package/src/border-control/border-control-dropdown/component.tsx +7 -6
  603. package/src/border-control/border-control-dropdown/hook.ts +14 -8
  604. package/src/border-control/stories/index.tsx +12 -14
  605. package/src/border-control/styles.ts +20 -23
  606. package/src/border-control/test/index.js +139 -96
  607. package/src/border-control/types.ts +43 -82
  608. package/src/box-control/README.md +14 -0
  609. package/src/box-control/index.js +4 -0
  610. package/src/box-control/stories/index.js +8 -27
  611. package/src/button/README.md +2 -15
  612. package/src/button/stories/index.js +109 -178
  613. package/src/button/style.scss +17 -54
  614. package/src/card/stories/index.tsx +27 -31
  615. package/src/card/test/__snapshots__/index.tsx.snap +98 -401
  616. package/src/card/test/index.tsx +4 -8
  617. package/src/checkbox-control/style.scss +3 -3
  618. package/src/circular-option-picker/index.js +14 -20
  619. package/src/color-palette/README.md +47 -49
  620. package/src/color-palette/{index.js → index.tsx} +132 -51
  621. package/src/color-palette/stories/{index.js → index.tsx} +38 -27
  622. package/src/color-palette/style.scss +3 -3
  623. package/src/color-palette/{styles.js → styles.ts} +0 -0
  624. package/src/color-palette/test/__snapshots__/{index.js.snap → index.tsx.snap} +0 -0
  625. package/src/color-palette/test/{index.js → index.tsx} +1 -1
  626. package/src/color-palette/types.ts +97 -0
  627. package/src/color-picker/input-with-slider.tsx +14 -3
  628. package/src/custom-gradient-picker/gradient-bar/index.js +1 -3
  629. package/src/custom-select-control/README.md +14 -0
  630. package/src/custom-select-control/index.js +29 -15
  631. package/src/custom-select-control/stories/index.js +1 -0
  632. package/src/custom-select-control/style.scss +6 -1
  633. package/src/custom-select-control/test/index.js +39 -0
  634. package/src/dashicon/index.js +21 -2
  635. package/src/date-time/date/test/index.tsx +2 -2
  636. package/src/date-time/date-time/index.tsx +2 -0
  637. package/src/date-time/stories/date-time.tsx +4 -0
  638. package/src/date-time/time/index.tsx +4 -4
  639. package/src/date-time/types.ts +0 -19
  640. package/src/dimension-control/test/__snapshots__/index.test.js.snap +4 -0
  641. package/src/disabled/README.md +2 -0
  642. package/src/disabled/index.tsx +8 -1
  643. package/src/disabled/test/index.tsx +0 -5
  644. package/src/divider/test/index.tsx +4 -4
  645. package/src/draggable/README.md +13 -18
  646. package/src/draggable/{index.js → index.tsx} +71 -47
  647. package/src/draggable/stories/index.tsx +83 -0
  648. package/src/draggable/types.ts +58 -0
  649. package/src/drop-zone/style.scss +1 -1
  650. package/src/external-link/index.tsx +14 -6
  651. package/src/external-link/test/index.tsx +106 -0
  652. package/src/flex/flex/hook.ts +0 -3
  653. package/src/flex/test/index.tsx +29 -3
  654. package/src/focal-point-picker/focal-point.tsx +2 -24
  655. package/src/focal-point-picker/styles/focal-point-style.ts +8 -32
  656. package/src/focusable-iframe/index.js +0 -1
  657. package/src/font-size-picker/README.md +3 -3
  658. package/src/font-size-picker/constants.ts +37 -0
  659. package/src/font-size-picker/font-size-picker-select.tsx +98 -0
  660. package/src/font-size-picker/font-size-picker-toggle-group.tsx +41 -0
  661. package/src/font-size-picker/index.tsx +161 -214
  662. package/src/font-size-picker/test/index.tsx +653 -171
  663. package/src/font-size-picker/test/utils.ts +56 -140
  664. package/src/font-size-picker/types.ts +26 -17
  665. package/src/font-size-picker/utils.ts +16 -124
  666. package/src/form-file-upload/README.md +1 -3
  667. package/src/form-file-upload/index.tsx +1 -0
  668. package/src/form-file-upload/types.ts +5 -4
  669. package/src/form-toggle/style.scss +3 -3
  670. package/src/form-toggle/test/__snapshots__/index.tsx.snap +15 -13
  671. package/src/form-toggle/test/index.tsx +1 -1
  672. package/src/form-token-field/index.tsx +13 -5
  673. package/src/form-token-field/style.scss +2 -2
  674. package/src/form-token-field/test/index.tsx +6 -6
  675. package/src/h-stack/test/__snapshots__/index.tsx.snap +36 -30
  676. package/src/h-stack/test/index.tsx +3 -3
  677. package/src/higher-order/navigate-regions/index.js +4 -0
  678. package/src/higher-order/navigate-regions/style.scss +72 -20
  679. package/src/higher-order/with-filters/index.js +4 -9
  680. package/src/higher-order/with-notices/test/index.js +1 -1
  681. package/src/icon/index.tsx +3 -2
  682. package/src/icon/test/index.js +10 -0
  683. package/src/index.js +3 -1
  684. package/src/input-control/index.tsx +2 -0
  685. package/src/input-control/input-base.tsx +3 -3
  686. package/src/input-control/styles/input-control-styles.tsx +1 -0
  687. package/src/input-control/types.ts +4 -11
  688. package/src/isolated-event-container/index.tsx +32 -0
  689. package/src/item-group/stories/index.js +1 -1
  690. package/src/item-group/styles.ts +1 -1
  691. package/src/item-group/test/__snapshots__/index.js.snap +90 -85
  692. package/src/item-group/test/index.js +7 -17
  693. package/src/menu-group/{index.js → index.tsx} +22 -3
  694. package/src/menu-group/test/{index.js → index.tsx} +0 -0
  695. package/src/menu-group/types.ts +23 -0
  696. package/src/menu-item/style.scss +1 -1
  697. package/src/mobile/bottom-sheet/test/range-cell.native.js +4 -4
  698. package/src/mobile/html-text-input/test/index.native.js +2 -2
  699. package/src/mobile/link-settings/test/edit.native.js +29 -29
  700. package/src/mobile/link-settings/test/link-settings-navigation.native.js +5 -5
  701. package/src/navigator/navigator-screen/component.tsx +28 -6
  702. package/src/notice/README.md +2 -1
  703. package/src/notice/style.scss +1 -1
  704. package/src/number-control/README.md +9 -4
  705. package/src/number-control/index.tsx +100 -33
  706. package/src/number-control/styles/number-control-styles.js +26 -1
  707. package/src/number-control/test/index.js +50 -0
  708. package/src/number-control/types.ts +12 -0
  709. package/src/palette-edit/index.js +3 -0
  710. package/src/panel/style.scss +1 -1
  711. package/src/popover/README.md +12 -7
  712. package/src/popover/index.tsx +38 -37
  713. package/src/popover/stories/index.tsx +29 -1
  714. package/src/popover/style.scss +9 -0
  715. package/src/popover/types.ts +18 -15
  716. package/src/radio-group/README.md +4 -0
  717. package/src/radio-group/index.js +6 -1
  718. package/src/{radio → radio-group/radio}/index.js +6 -1
  719. package/src/{radio-context → radio-group/radio-context}/index.js +0 -0
  720. package/src/radio-group/stories/index.js +11 -2
  721. package/src/range-control/styles/range-control-styles.ts +2 -2
  722. package/src/resizable-box/style.scss +2 -2
  723. package/src/sandbox/test/index.js +2 -2
  724. package/src/scrollable/test/index.tsx +7 -3
  725. package/src/search-control/style.scss +1 -1
  726. package/src/select-control/stories/index.tsx +9 -4
  727. package/src/slot-fill/bubbles-virtually/fill.js +5 -5
  728. package/src/slot-fill/bubbles-virtually/slot.js +10 -8
  729. package/src/slot-fill/bubbles-virtually/use-slot.js +15 -9
  730. package/src/slot-fill/fill.js +12 -2
  731. package/src/slot-fill/use-slot.js +3 -0
  732. package/src/snackbar/index.js +1 -1
  733. package/src/snackbar/style.scss +2 -2
  734. package/src/spacer/test/index.tsx +33 -3
  735. package/src/spinner/styles.ts +1 -1
  736. package/src/surface/test/__snapshots__/index.tsx.snap +58 -46
  737. package/src/surface/test/index.tsx +12 -22
  738. package/src/tab-panel/index.tsx +10 -8
  739. package/src/tab-panel/style.scss +4 -5
  740. package/src/tab-panel/test/index.tsx +78 -1
  741. package/src/text/test/__snapshots__/index.tsx.snap +19 -15
  742. package/src/text/test/index.tsx +6 -6
  743. package/src/text-control/index.tsx +0 -2
  744. package/src/text-control/stories/index.tsx +5 -6
  745. package/src/toggle-control/README.md +6 -4
  746. package/src/toggle-control/index.tsx +13 -2
  747. package/src/toggle-control/types.ts +2 -4
  748. package/src/toggle-group-control/stories/index.tsx +6 -4
  749. package/src/toggle-group-control/test/__snapshots__/index.tsx.snap +221 -164
  750. package/src/toggle-group-control/test/index.tsx +156 -17
  751. package/src/toggle-group-control/toggle-group-control/README.md +8 -1
  752. package/src/toggle-group-control/toggle-group-control/as-button-group.tsx +103 -0
  753. package/src/toggle-group-control/toggle-group-control/as-radio-group.tsx +99 -0
  754. package/src/toggle-group-control/toggle-group-control/component.tsx +29 -74
  755. package/src/toggle-group-control/toggle-group-control/styles.ts +23 -15
  756. package/src/toggle-group-control/toggle-group-control-option-base/component.tsx +49 -25
  757. package/src/toggle-group-control/toggle-group-control-option-base/styles.ts +39 -19
  758. package/src/toggle-group-control/types.ts +76 -63
  759. package/src/toolbar-dropdown-menu/index.js +1 -1
  760. package/src/tools-panel/stories/index.js +0 -1
  761. package/src/tools-panel/stories/tools-panel-with-item-group-slot.js +0 -1
  762. package/src/tools-panel/styles.ts +1 -1
  763. package/src/tools-panel/tools-panel-item/hook.ts +6 -1
  764. package/src/tree-grid/test/__snapshots__/cell.js.snap +20 -18
  765. package/src/tree-grid/test/__snapshots__/roving-tab-index.js.snap +3 -1
  766. package/src/tree-grid/test/__snapshots__/row.js.snap +33 -29
  767. package/src/tree-grid/test/cell.js +1 -1
  768. package/src/tree-grid/test/index.js +12 -12
  769. package/src/tree-grid/test/roving-tab-index.js +1 -1
  770. package/src/tree-grid/test/row.js +2 -2
  771. package/src/truncate/test/index.tsx +9 -9
  772. package/src/ui/context/context-system-provider.js +5 -18
  773. package/src/ui/context/test/__snapshots__/context-system-provider.js.snap +23 -17
  774. package/src/ui/context/test/context-system-provider.js +3 -3
  775. package/src/ui/control-group/test/__snapshots__/index.js.snap +18 -16
  776. package/src/ui/control-group/test/index.js +1 -1
  777. package/src/ui/control-label/test/__snapshots__/index.js.snap +27 -21
  778. package/src/ui/control-label/test/index.js +3 -3
  779. package/src/ui/form-group/test/__snapshots__/index.js.snap +34 -30
  780. package/src/ui/form-group/test/index.js +18 -19
  781. package/src/ui/shortcut/test/__snapshots__/index.js.snap +1 -1
  782. package/src/ui/shortcut/test/index.js +1 -1
  783. package/src/ui/spinner/test/__snapshots__/index.js.snap +75 -73
  784. package/src/ui/spinner/test/index.js +3 -7
  785. package/src/unit-control/index.tsx +29 -30
  786. package/src/unit-control/styles/unit-control-styles.ts +6 -12
  787. package/src/unit-control/test/utils.ts +43 -0
  788. package/src/unit-control/types.ts +5 -6
  789. package/src/utils/colors-values.js +4 -2
  790. package/src/utils/config-values.js +0 -1
  791. package/src/utils/hooks/stories/use-cx.js +1 -1
  792. package/src/utils/hooks/use-update-effect.js +5 -1
  793. package/src/utils/input/base.js +2 -2
  794. package/src/utils/types.ts +0 -15
  795. package/src/v-stack/test/__snapshots__/index.tsx.snap +36 -30
  796. package/src/v-stack/test/index.tsx +3 -3
  797. package/src/view/{index.js → index.ts} +0 -0
  798. package/src/view/test/__snapshots__/index.js.snap +34 -24
  799. package/src/view/test/index.js +5 -5
  800. package/tsconfig.json +0 -2
  801. package/tsconfig.tsbuildinfo +1 -1
  802. package/build/radio/index.js.map +0 -1
  803. package/build/radio-context/index.js.map +0 -1
  804. package/build-module/radio/index.js.map +0 -1
  805. package/build-module/radio-context/index.js.map +0 -1
  806. package/build-types/radio-context/index.d.ts.map +0 -1
  807. package/src/border-box-control/stories/index.js +0 -106
  808. package/src/draggable/stories/index.js +0 -72
  809. package/src/form-file-upload/stories/index.js +0 -51
  810. package/src/isolated-event-container/index.js +0 -28
  811. package/src/radio/stories/index.js +0 -20
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/utils/config-values.js"],"names":["CONTROL_HEIGHT","CONTROL_PADDING_X","CONTROL_PROPS","controlSurfaceColor","COLORS","white","controlTextActiveColor","ui","theme","controlPaddingX","controlPaddingXLarge","controlPaddingXSmall","controlBackgroundColor","controlBorderRadius","controlBorderColor","gray","controlBoxShadow","controlBorderColorHover","controlBoxShadowFocus","controlDestructiveBorderColor","alert","red","controlHeight","controlHeightXSmall","controlHeightSmall","controlHeightLarge","controlHeightXLarge","TOGGLE_GROUP_CONTROL_PROPS","toggleGroupControlBackgroundColor","toggleGroupControlBorderColor","border","toggleGroupControlBackdropBackgroundColor","toggleGroupControlBackdropBorderColor","toggleGroupControlBackdropBoxShadow","toggleGroupControlButtonColorActive","Object","assign","colorDivider","colorScrollbarThumb","colorScrollbarThumbHover","colorScrollbarTrack","elevationIntensity","radiusBlockUi","borderWidth","borderWidthFocus","borderWidthTab","spinnerSize","fontSize","fontSizeH1","fontSizeH2","fontSizeH3","fontSizeH4","fontSizeH5","fontSizeH6","fontSizeInputMobile","fontSizeMobile","fontSizeSmall","fontSizeXSmall","fontLineHeightBase","fontWeight","fontWeightHeading","gridBase","cardBorderRadius","cardPaddingXSmall","cardPaddingSmall","cardPaddingMedium","cardPaddingLarge","surfaceBackgroundColor","surfaceBackgroundSubtleColor","surfaceBackgroundTintColor","surfaceBorderColor","surfaceBorderBoldColor","surfaceBorderSubtleColor","surfaceBackgroundTertiaryColor","surfaceColor","transitionDuration","transitionDurationFast","transitionDurationFaster","transitionDurationFastest","transitionTimingFunction","transitionTimingFunctionControl"],"mappings":"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","sourcesContent":["/**\n * Internal dependencies\n */\nimport { space } from '../ui/utils/space';\nimport { COLORS } from './colors-values';\n\nconst CONTROL_HEIGHT = '36px';\nconst CONTROL_PADDING_X = '12px';\n\nconst CONTROL_PROPS = {\n\tcontrolSurfaceColor: COLORS.white,\n\tcontrolTextActiveColor: COLORS.ui.theme,\n\tcontrolPaddingX: CONTROL_PADDING_X,\n\tcontrolPaddingXLarge: `calc(${ CONTROL_PADDING_X } * 1.3334)`,\n\tcontrolPaddingXSmall: `calc(${ CONTROL_PADDING_X } / 1.3334)`,\n\tcontrolBackgroundColor: COLORS.white,\n\tcontrolBorderRadius: '2px',\n\tcontrolBorderColor: COLORS.gray[ 700 ],\n\tcontrolBoxShadow: 'transparent',\n\tcontrolBorderColorHover: COLORS.gray[ 700 ],\n\tcontrolBoxShadowFocus: `0 0 0 0.5px ${ COLORS.ui.theme }`,\n\tcontrolDestructiveBorderColor: COLORS.alert.red,\n\tcontrolHeight: CONTROL_HEIGHT,\n\tcontrolHeightXSmall: `calc( ${ CONTROL_HEIGHT } * 0.6 )`,\n\tcontrolHeightSmall: `calc( ${ CONTROL_HEIGHT } * 0.8 )`,\n\tcontrolHeightLarge: `calc( ${ CONTROL_HEIGHT } * 1.2 )`,\n\tcontrolHeightXLarge: `calc( ${ CONTROL_HEIGHT } * 1.4 )`,\n};\n\nconst TOGGLE_GROUP_CONTROL_PROPS = {\n\ttoggleGroupControlBackgroundColor: CONTROL_PROPS.controlBackgroundColor,\n\ttoggleGroupControlBorderColor: COLORS.ui.border,\n\ttoggleGroupControlBackdropBackgroundColor:\n\t\tCONTROL_PROPS.controlSurfaceColor,\n\ttoggleGroupControlBackdropBorderColor: COLORS.ui.border,\n\ttoggleGroupControlBackdropBoxShadow: 'transparent',\n\ttoggleGroupControlButtonColorActive: CONTROL_PROPS.controlBackgroundColor,\n};\n\n// Using Object.assign to avoid creating circular references when emitting\n// TypeScript type declarations.\nexport default Object.assign( {}, CONTROL_PROPS, TOGGLE_GROUP_CONTROL_PROPS, {\n\tcolorDivider: 'rgba(0, 0, 0, 0.1)',\n\tcolorScrollbarThumb: 'rgba(0, 0, 0, 0.2)',\n\tcolorScrollbarThumbHover: 'rgba(0, 0, 0, 0.5)',\n\tcolorScrollbarTrack: 'rgba(0, 0, 0, 0.04)',\n\televationIntensity: 1,\n\tradiusBlockUi: '2px',\n\tborderWidth: '1px',\n\tborderWidthFocus: '1.5px',\n\tborderWidthTab: '4px',\n\tspinnerSize: 16,\n\tfontSize: '13px',\n\tfontSizeH1: 'calc(2.44 * 13px)',\n\tfontSizeH2: 'calc(1.95 * 13px)',\n\tfontSizeH3: 'calc(1.56 * 13px)',\n\tfontSizeH4: 'calc(1.25 * 13px)',\n\tfontSizeH5: '13px',\n\tfontSizeH6: 'calc(0.8 * 13px)',\n\tfontSizeInputMobile: '16px',\n\tfontSizeMobile: '15px',\n\tfontSizeSmall: 'calc(0.92 * 13px)',\n\tfontSizeXSmall: 'calc(0.75 * 13px)',\n\tfontLineHeightBase: '1.2',\n\tfontWeight: 'normal',\n\tfontWeightHeading: '600',\n\tgridBase: '4px',\n\tcardBorderRadius: '2px',\n\tcardPaddingXSmall: `${ space( 2 ) }`,\n\tcardPaddingSmall: `${ space( 4 ) }`,\n\tcardPaddingMedium: `${ space( 4 ) } ${ space( 6 ) }`,\n\tcardPaddingLarge: `${ space( 6 ) } ${ space( 8 ) }`,\n\tsurfaceBackgroundColor: COLORS.white,\n\tsurfaceBackgroundSubtleColor: '#F3F3F3',\n\tsurfaceBackgroundTintColor: '#F5F5F5',\n\tsurfaceBorderColor: 'rgba(0, 0, 0, 0.1)',\n\tsurfaceBorderBoldColor: 'rgba(0, 0, 0, 0.15)',\n\tsurfaceBorderSubtleColor: 'rgba(0, 0, 0, 0.05)',\n\tsurfaceBackgroundTertiaryColor: COLORS.white,\n\tsurfaceColor: COLORS.white,\n\ttransitionDuration: '200ms',\n\ttransitionDurationFast: '160ms',\n\ttransitionDurationFaster: '120ms',\n\ttransitionDurationFastest: '100ms',\n\ttransitionTimingFunction: 'cubic-bezier(0.08, 0.52, 0.52, 1)',\n\ttransitionTimingFunctionControl: 'cubic-bezier(0.12, 0.8, 0.32, 1)',\n} );\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/utils/config-values.js"],"names":["CONTROL_HEIGHT","CONTROL_PADDING_X","CONTROL_PROPS","controlSurfaceColor","COLORS","white","controlTextActiveColor","ui","theme","controlPaddingX","controlPaddingXLarge","controlPaddingXSmall","controlBackgroundColor","controlBorderRadius","controlBorderColor","gray","controlBoxShadow","controlBorderColorHover","controlBoxShadowFocus","controlDestructiveBorderColor","alert","red","controlHeight","controlHeightXSmall","controlHeightSmall","controlHeightLarge","controlHeightXLarge","TOGGLE_GROUP_CONTROL_PROPS","toggleGroupControlBackgroundColor","toggleGroupControlBorderColor","border","toggleGroupControlBackdropBackgroundColor","toggleGroupControlBackdropBorderColor","toggleGroupControlButtonColorActive","Object","assign","colorDivider","colorScrollbarThumb","colorScrollbarThumbHover","colorScrollbarTrack","elevationIntensity","radiusBlockUi","borderWidth","borderWidthFocus","borderWidthTab","spinnerSize","fontSize","fontSizeH1","fontSizeH2","fontSizeH3","fontSizeH4","fontSizeH5","fontSizeH6","fontSizeInputMobile","fontSizeMobile","fontSizeSmall","fontSizeXSmall","fontLineHeightBase","fontWeight","fontWeightHeading","gridBase","cardBorderRadius","cardPaddingXSmall","cardPaddingSmall","cardPaddingMedium","cardPaddingLarge","surfaceBackgroundColor","surfaceBackgroundSubtleColor","surfaceBackgroundTintColor","surfaceBorderColor","surfaceBorderBoldColor","surfaceBorderSubtleColor","surfaceBackgroundTertiaryColor","surfaceColor","transitionDuration","transitionDurationFast","transitionDurationFaster","transitionDurationFastest","transitionTimingFunction","transitionTimingFunctionControl"],"mappings":"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","sourcesContent":["/**\n * Internal dependencies\n */\nimport { space } from '../ui/utils/space';\nimport { COLORS } from './colors-values';\n\nconst CONTROL_HEIGHT = '36px';\nconst CONTROL_PADDING_X = '12px';\n\nconst CONTROL_PROPS = {\n\tcontrolSurfaceColor: COLORS.white,\n\tcontrolTextActiveColor: COLORS.ui.theme,\n\tcontrolPaddingX: CONTROL_PADDING_X,\n\tcontrolPaddingXLarge: `calc(${ CONTROL_PADDING_X } * 1.3334)`,\n\tcontrolPaddingXSmall: `calc(${ CONTROL_PADDING_X } / 1.3334)`,\n\tcontrolBackgroundColor: COLORS.white,\n\tcontrolBorderRadius: '2px',\n\tcontrolBorderColor: COLORS.gray[ 700 ],\n\tcontrolBoxShadow: 'transparent',\n\tcontrolBorderColorHover: COLORS.gray[ 700 ],\n\tcontrolBoxShadowFocus: `0 0 0 0.5px ${ COLORS.ui.theme }`,\n\tcontrolDestructiveBorderColor: COLORS.alert.red,\n\tcontrolHeight: CONTROL_HEIGHT,\n\tcontrolHeightXSmall: `calc( ${ CONTROL_HEIGHT } * 0.6 )`,\n\tcontrolHeightSmall: `calc( ${ CONTROL_HEIGHT } * 0.8 )`,\n\tcontrolHeightLarge: `calc( ${ CONTROL_HEIGHT } * 1.2 )`,\n\tcontrolHeightXLarge: `calc( ${ CONTROL_HEIGHT } * 1.4 )`,\n};\n\nconst TOGGLE_GROUP_CONTROL_PROPS = {\n\ttoggleGroupControlBackgroundColor: CONTROL_PROPS.controlBackgroundColor,\n\ttoggleGroupControlBorderColor: COLORS.ui.border,\n\ttoggleGroupControlBackdropBackgroundColor:\n\t\tCONTROL_PROPS.controlSurfaceColor,\n\ttoggleGroupControlBackdropBorderColor: COLORS.ui.border,\n\ttoggleGroupControlButtonColorActive: CONTROL_PROPS.controlBackgroundColor,\n};\n\n// Using Object.assign to avoid creating circular references when emitting\n// TypeScript type declarations.\nexport default Object.assign( {}, CONTROL_PROPS, TOGGLE_GROUP_CONTROL_PROPS, {\n\tcolorDivider: 'rgba(0, 0, 0, 0.1)',\n\tcolorScrollbarThumb: 'rgba(0, 0, 0, 0.2)',\n\tcolorScrollbarThumbHover: 'rgba(0, 0, 0, 0.5)',\n\tcolorScrollbarTrack: 'rgba(0, 0, 0, 0.04)',\n\televationIntensity: 1,\n\tradiusBlockUi: '2px',\n\tborderWidth: '1px',\n\tborderWidthFocus: '1.5px',\n\tborderWidthTab: '4px',\n\tspinnerSize: 16,\n\tfontSize: '13px',\n\tfontSizeH1: 'calc(2.44 * 13px)',\n\tfontSizeH2: 'calc(1.95 * 13px)',\n\tfontSizeH3: 'calc(1.56 * 13px)',\n\tfontSizeH4: 'calc(1.25 * 13px)',\n\tfontSizeH5: '13px',\n\tfontSizeH6: 'calc(0.8 * 13px)',\n\tfontSizeInputMobile: '16px',\n\tfontSizeMobile: '15px',\n\tfontSizeSmall: 'calc(0.92 * 13px)',\n\tfontSizeXSmall: 'calc(0.75 * 13px)',\n\tfontLineHeightBase: '1.2',\n\tfontWeight: 'normal',\n\tfontWeightHeading: '600',\n\tgridBase: '4px',\n\tcardBorderRadius: '2px',\n\tcardPaddingXSmall: `${ space( 2 ) }`,\n\tcardPaddingSmall: `${ space( 4 ) }`,\n\tcardPaddingMedium: `${ space( 4 ) } ${ space( 6 ) }`,\n\tcardPaddingLarge: `${ space( 6 ) } ${ space( 8 ) }`,\n\tsurfaceBackgroundColor: COLORS.white,\n\tsurfaceBackgroundSubtleColor: '#F3F3F3',\n\tsurfaceBackgroundTintColor: '#F5F5F5',\n\tsurfaceBorderColor: 'rgba(0, 0, 0, 0.1)',\n\tsurfaceBorderBoldColor: 'rgba(0, 0, 0, 0.15)',\n\tsurfaceBorderSubtleColor: 'rgba(0, 0, 0, 0.05)',\n\tsurfaceBackgroundTertiaryColor: COLORS.white,\n\tsurfaceColor: COLORS.white,\n\ttransitionDuration: '200ms',\n\ttransitionDurationFast: '160ms',\n\ttransitionDurationFaster: '120ms',\n\ttransitionDurationFastest: '100ms',\n\ttransitionTimingFunction: 'cubic-bezier(0.08, 0.52, 0.52, 1)',\n\ttransitionTimingFunctionControl: 'cubic-bezier(0.12, 0.8, 0.32, 1)',\n} );\n"]}
@@ -27,7 +27,11 @@ function useUpdateEffect(effect, deps) {
27
27
  }
28
28
 
29
29
  mounted.current = true;
30
- return undefined;
30
+ return undefined; // Disable reasons:
31
+ // 1. This hook needs to pass a dep list that isn't an array literal
32
+ // 2. `effect` is missing from the array, and will need to be added carefully to avoid additional warnings
33
+ // see https://github.com/WordPress/gutenberg/pull/41166
34
+ // eslint-disable-next-line react-hooks/exhaustive-deps
31
35
  }, deps);
32
36
  }
33
37
 
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/utils/hooks/use-update-effect.js"],"names":["useUpdateEffect","effect","deps","mounted","current","undefined"],"mappings":";;;;;;;AAGA;;AAHA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,eAAT,CAA0BC,MAA1B,EAAkCC,IAAlC,EAAyC;AACxC,QAAMC,OAAO,GAAG,qBAAQ,KAAR,CAAhB;AAEA,0BAAW,MAAM;AAChB,QAAKA,OAAO,CAACC,OAAb,EAAuB;AACtB,aAAOH,MAAM,EAAb;AACA;;AACDE,IAAAA,OAAO,CAACC,OAAR,GAAkB,IAAlB;AACA,WAAOC,SAAP;AACA,GAND,EAMGH,IANH;AAOA;;eAEcF,e","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, useEffect } from '@wordpress/element';\n\n/**\n * A `React.useEffect` that will not run on the first render.\n * Source:\n * https://github.com/reakit/reakit/blob/HEAD/packages/reakit-utils/src/useUpdateEffect.ts\n *\n * @param {import('react').EffectCallback} effect\n * @param {import('react').DependencyList} deps\n */\nfunction useUpdateEffect( effect, deps ) {\n\tconst mounted = useRef( false );\n\n\tuseEffect( () => {\n\t\tif ( mounted.current ) {\n\t\t\treturn effect();\n\t\t}\n\t\tmounted.current = true;\n\t\treturn undefined;\n\t}, deps );\n}\n\nexport default useUpdateEffect;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/utils/hooks/use-update-effect.js"],"names":["useUpdateEffect","effect","deps","mounted","current","undefined"],"mappings":";;;;;;;AAGA;;AAHA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASA,eAAT,CAA0BC,MAA1B,EAAkCC,IAAlC,EAAyC;AACxC,QAAMC,OAAO,GAAG,qBAAQ,KAAR,CAAhB;AACA,0BAAW,MAAM;AAChB,QAAKA,OAAO,CAACC,OAAb,EAAuB;AACtB,aAAOH,MAAM,EAAb;AACA;;AACDE,IAAAA,OAAO,CAACC,OAAR,GAAkB,IAAlB;AACA,WAAOC,SAAP,CALgB,CAMhB;AACA;AACA;AACA;AACA;AACA,GAXD,EAWGH,IAXH;AAYA;;eAEcF,e","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, useEffect } from '@wordpress/element';\n\n/**\n * A `React.useEffect` that will not run on the first render.\n * Source:\n * https://github.com/reakit/reakit/blob/HEAD/packages/reakit-utils/src/useUpdateEffect.ts\n *\n * @param {import('react').EffectCallback} effect\n * @param {import('react').DependencyList} deps\n */\nfunction useUpdateEffect( effect, deps ) {\n\tconst mounted = useRef( false );\n\tuseEffect( () => {\n\t\tif ( mounted.current ) {\n\t\t\treturn effect();\n\t\t}\n\t\tmounted.current = true;\n\t\treturn undefined;\n\t\t// Disable reasons:\n\t\t// 1. This hook needs to pass a dep list that isn't an array literal\n\t\t// 2. `effect` is missing from the array, and will need to be added carefully to avoid additional warnings\n\t\t// see https://github.com/WordPress/gutenberg/pull/41166\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, deps );\n}\n\nexport default useUpdateEffect;\n"]}
@@ -20,8 +20,8 @@ var _ = require("../");
20
20
  /**
21
21
  * Internal dependencies
22
22
  */
23
- const inputStyleNeutral = /*#__PURE__*/(0, _react.css)("box-shadow:0 0 0 transparent;transition:box-shadow 0.1s linear;border-radius:", _.CONFIG.radiusBlockUi, ";border:", _.CONFIG.borderWidth, " solid ", _colorsValues.COLORS.ui.border, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:inputStyleNeutral;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdXRpbHMvaW5wdXQvYmFzZS5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFZb0MiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy91dGlscy9pbnB1dC9iYXNlLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyByZWR1Y2VNb3Rpb24gfSBmcm9tICcuLi9yZWR1Y2UtbW90aW9uJztcbmltcG9ydCB7IENPTE9SUyB9IGZyb20gJy4uL2NvbG9ycy12YWx1ZXMnO1xuaW1wb3J0IHsgQ09ORklHIH0gZnJvbSAnLi4vJztcblxuZXhwb3J0IGNvbnN0IGlucHV0U3R5bGVOZXV0cmFsID0gY3NzYFxuXHRib3gtc2hhZG93OiAwIDAgMCB0cmFuc3BhcmVudDtcblx0dHJhbnNpdGlvbjogYm94LXNoYWRvdyAwLjFzIGxpbmVhcjtcblx0Ym9yZGVyLXJhZGl1czogJHsgQ09ORklHLnJhZGl1c0Jsb2NrVWkgfTtcblx0Ym9yZGVyOiAkeyBDT05GSUcuYm9yZGVyV2lkdGggfSBzb2xpZCAkeyBDT0xPUlMudWkuYm9yZGVyIH0gfTtcblx0JHsgcmVkdWNlTW90aW9uKCAndHJhbnNpdGlvbicgKSB9XG5gO1xuXG5leHBvcnQgY29uc3QgaW5wdXRTdHlsZUZvY3VzID0gY3NzYFxuXHRib3JkZXItY29sb3I6IHZhciggLS13cC1hZG1pbi10aGVtZS1jb2xvciApO1xuXHRib3gtc2hhZG93OiAwIDAgMFxuXHRcdGNhbGMoICR7IENPTkZJRy5ib3JkZXJXaWR0aEZvY3VzIH0gLSAkeyBDT05GSUcuYm9yZGVyV2lkdGggfSApXG5cdFx0dmFyKCAtLXdwLWFkbWluLXRoZW1lLWNvbG9yICk7XG5cblx0Ly8gV2luZG93cyBIaWdoIENvbnRyYXN0IG1vZGUgd2lsbCBzaG93IHRoaXMgb3V0bGluZSwgYnV0IG5vdCB0aGUgYm94LXNoYWRvdy5cblx0b3V0bGluZTogMnB4IHNvbGlkIHRyYW5zcGFyZW50O1xuYDtcbiJdfQ== */");
23
+ const inputStyleNeutral = /*#__PURE__*/(0, _react.css)("box-shadow:0 0 0 transparent;transition:box-shadow 0.1s linear;border-radius:", _.CONFIG.radiusBlockUi, ";border:", _.CONFIG.borderWidth, " solid ", _colorsValues.COLORS.ui.border, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:inputStyleNeutral;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdXRpbHMvaW5wdXQvYmFzZS5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFZb0MiLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy91dGlscy9pbnB1dC9iYXNlLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyByZWR1Y2VNb3Rpb24gfSBmcm9tICcuLi9yZWR1Y2UtbW90aW9uJztcbmltcG9ydCB7IENPTE9SUyB9IGZyb20gJy4uL2NvbG9ycy12YWx1ZXMnO1xuaW1wb3J0IHsgQ09ORklHIH0gZnJvbSAnLi4vJztcblxuZXhwb3J0IGNvbnN0IGlucHV0U3R5bGVOZXV0cmFsID0gY3NzYFxuXHRib3gtc2hhZG93OiAwIDAgMCB0cmFuc3BhcmVudDtcblx0dHJhbnNpdGlvbjogYm94LXNoYWRvdyAwLjFzIGxpbmVhcjtcblx0Ym9yZGVyLXJhZGl1czogJHsgQ09ORklHLnJhZGl1c0Jsb2NrVWkgfTtcblx0Ym9yZGVyOiAkeyBDT05GSUcuYm9yZGVyV2lkdGggfSBzb2xpZCAkeyBDT0xPUlMudWkuYm9yZGVyIH0gfTtcblx0JHsgcmVkdWNlTW90aW9uKCAndHJhbnNpdGlvbicgKSB9XG5gO1xuXG5leHBvcnQgY29uc3QgaW5wdXRTdHlsZUZvY3VzID0gY3NzYFxuXHRib3JkZXItY29sb3I6ICR7IENPTE9SUy51aS50aGVtZSB9O1xuXHRib3gtc2hhZG93OiAwIDAgMFxuXHRcdGNhbGMoICR7IENPTkZJRy5ib3JkZXJXaWR0aEZvY3VzIH0gLSAkeyBDT05GSUcuYm9yZGVyV2lkdGggfSApXG5cdFx0JHsgQ09MT1JTLnVpLnRoZW1lIH07XG5cblx0Ly8gV2luZG93cyBIaWdoIENvbnRyYXN0IG1vZGUgd2lsbCBzaG93IHRoaXMgb3V0bGluZSwgYnV0IG5vdCB0aGUgYm94LXNoYWRvdy5cblx0b3V0bGluZTogMnB4IHNvbGlkIHRyYW5zcGFyZW50O1xuYDtcbiJdfQ== */");
24
24
  exports.inputStyleNeutral = inputStyleNeutral;
25
- const inputStyleFocus = /*#__PURE__*/(0, _react.css)("border-color:var( --wp-admin-theme-color );box-shadow:0 0 0 calc( ", _.CONFIG.borderWidthFocus, " - ", _.CONFIG.borderWidth, " ) var( --wp-admin-theme-color );outline:2px solid transparent;" + (process.env.NODE_ENV === "production" ? "" : ";label:inputStyleFocus;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdXRpbHMvaW5wdXQvYmFzZS5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFvQmtDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdXRpbHMvaW5wdXQvYmFzZS5qcyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgcmVkdWNlTW90aW9uIH0gZnJvbSAnLi4vcmVkdWNlLW1vdGlvbic7XG5pbXBvcnQgeyBDT0xPUlMgfSBmcm9tICcuLi9jb2xvcnMtdmFsdWVzJztcbmltcG9ydCB7IENPTkZJRyB9IGZyb20gJy4uLyc7XG5cbmV4cG9ydCBjb25zdCBpbnB1dFN0eWxlTmV1dHJhbCA9IGNzc2Bcblx0Ym94LXNoYWRvdzogMCAwIDAgdHJhbnNwYXJlbnQ7XG5cdHRyYW5zaXRpb246IGJveC1zaGFkb3cgMC4xcyBsaW5lYXI7XG5cdGJvcmRlci1yYWRpdXM6ICR7IENPTkZJRy5yYWRpdXNCbG9ja1VpIH07XG5cdGJvcmRlcjogJHsgQ09ORklHLmJvcmRlcldpZHRoIH0gc29saWQgJHsgQ09MT1JTLnVpLmJvcmRlciB9IH07XG5cdCR7IHJlZHVjZU1vdGlvbiggJ3RyYW5zaXRpb24nICkgfVxuYDtcblxuZXhwb3J0IGNvbnN0IGlucHV0U3R5bGVGb2N1cyA9IGNzc2Bcblx0Ym9yZGVyLWNvbG9yOiB2YXIoIC0td3AtYWRtaW4tdGhlbWUtY29sb3IgKTtcblx0Ym94LXNoYWRvdzogMCAwIDBcblx0XHRjYWxjKCAkeyBDT05GSUcuYm9yZGVyV2lkdGhGb2N1cyB9IC0gJHsgQ09ORklHLmJvcmRlcldpZHRoIH0gKVxuXHRcdHZhciggLS13cC1hZG1pbi10aGVtZS1jb2xvciApO1xuXG5cdC8vIFdpbmRvd3MgSGlnaCBDb250cmFzdCBtb2RlIHdpbGwgc2hvdyB0aGlzIG91dGxpbmUsIGJ1dCBub3QgdGhlIGJveC1zaGFkb3cuXG5cdG91dGxpbmU6IDJweCBzb2xpZCB0cmFuc3BhcmVudDtcbmA7XG4iXX0= */");
25
+ const inputStyleFocus = /*#__PURE__*/(0, _react.css)("border-color:", _colorsValues.COLORS.ui.theme, ";box-shadow:0 0 0 calc( ", _.CONFIG.borderWidthFocus, " - ", _.CONFIG.borderWidth, " ) ", _colorsValues.COLORS.ui.theme, ";outline:2px solid transparent;" + (process.env.NODE_ENV === "production" ? "" : ";label:inputStyleFocus;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdXRpbHMvaW5wdXQvYmFzZS5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFvQmtDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvdXRpbHMvaW5wdXQvYmFzZS5qcyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgcmVkdWNlTW90aW9uIH0gZnJvbSAnLi4vcmVkdWNlLW1vdGlvbic7XG5pbXBvcnQgeyBDT0xPUlMgfSBmcm9tICcuLi9jb2xvcnMtdmFsdWVzJztcbmltcG9ydCB7IENPTkZJRyB9IGZyb20gJy4uLyc7XG5cbmV4cG9ydCBjb25zdCBpbnB1dFN0eWxlTmV1dHJhbCA9IGNzc2Bcblx0Ym94LXNoYWRvdzogMCAwIDAgdHJhbnNwYXJlbnQ7XG5cdHRyYW5zaXRpb246IGJveC1zaGFkb3cgMC4xcyBsaW5lYXI7XG5cdGJvcmRlci1yYWRpdXM6ICR7IENPTkZJRy5yYWRpdXNCbG9ja1VpIH07XG5cdGJvcmRlcjogJHsgQ09ORklHLmJvcmRlcldpZHRoIH0gc29saWQgJHsgQ09MT1JTLnVpLmJvcmRlciB9IH07XG5cdCR7IHJlZHVjZU1vdGlvbiggJ3RyYW5zaXRpb24nICkgfVxuYDtcblxuZXhwb3J0IGNvbnN0IGlucHV0U3R5bGVGb2N1cyA9IGNzc2Bcblx0Ym9yZGVyLWNvbG9yOiAkeyBDT0xPUlMudWkudGhlbWUgfTtcblx0Ym94LXNoYWRvdzogMCAwIDBcblx0XHRjYWxjKCAkeyBDT05GSUcuYm9yZGVyV2lkdGhGb2N1cyB9IC0gJHsgQ09ORklHLmJvcmRlcldpZHRoIH0gKVxuXHRcdCR7IENPTE9SUy51aS50aGVtZSB9O1xuXG5cdC8vIFdpbmRvd3MgSGlnaCBDb250cmFzdCBtb2RlIHdpbGwgc2hvdyB0aGlzIG91dGxpbmUsIGJ1dCBub3QgdGhlIGJveC1zaGFkb3cuXG5cdG91dGxpbmU6IDJweCBzb2xpZCB0cmFuc3BhcmVudDtcbmA7XG4iXX0= */");
26
26
  exports.inputStyleFocus = inputStyleFocus;
27
27
  //# sourceMappingURL=base.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/utils/input/base.js"],"names":["inputStyleNeutral","css","CONFIG","radiusBlockUi","borderWidth","COLORS","ui","border","inputStyleFocus","borderWidthFocus"],"mappings":";;;;;;;AAGA;;AAKA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAKO,MAAMA,iBAAiB,oBAAGC,UAAH,mFAGXC,SAAOC,aAHI,cAIlBD,SAAOE,WAJW,aAIYC,qBAAOC,EAAP,CAAUC,MAJtB,uhDAAvB;;AAQA,MAAMC,eAAe,oBAAGP,UAAH,wEAGjBC,SAAOO,gBAHU,SAGcP,SAAOE,WAHrB,mlDAArB","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport { reduceMotion } from '../reduce-motion';\nimport { COLORS } from '../colors-values';\nimport { CONFIG } from '../';\n\nexport const inputStyleNeutral = css`\n\tbox-shadow: 0 0 0 transparent;\n\ttransition: box-shadow 0.1s linear;\n\tborder-radius: ${ CONFIG.radiusBlockUi };\n\tborder: ${ CONFIG.borderWidth } solid ${ COLORS.ui.border } };\n\t${ reduceMotion( 'transition' ) }\n`;\n\nexport const inputStyleFocus = css`\n\tborder-color: var( --wp-admin-theme-color );\n\tbox-shadow: 0 0 0\n\t\tcalc( ${ CONFIG.borderWidthFocus } - ${ CONFIG.borderWidth } )\n\t\tvar( --wp-admin-theme-color );\n\n\t// Windows High Contrast mode will show this outline, but not the box-shadow.\n\toutline: 2px solid transparent;\n`;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/utils/input/base.js"],"names":["inputStyleNeutral","css","CONFIG","radiusBlockUi","borderWidth","COLORS","ui","border","inputStyleFocus","theme","borderWidthFocus"],"mappings":";;;;;;;AAGA;;AAKA;;AACA;;AACA;;AAVA;AACA;AACA;;AAGA;AACA;AACA;AAKO,MAAMA,iBAAiB,oBAAGC,UAAH,mFAGXC,SAAOC,aAHI,cAIlBD,SAAOE,WAJW,aAIYC,qBAAOC,EAAP,CAAUC,MAJtB,+/CAAvB;;AAQA,MAAMC,eAAe,oBAAGP,UAAH,mBACVI,qBAAOC,EAAP,CAAUG,KADA,8BAGjBP,SAAOQ,gBAHU,SAGcR,SAAOE,WAHrB,SAIvBC,qBAAOC,EAAP,CAAUG,KAJa,2hDAArB","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\n\n/**\n * Internal dependencies\n */\nimport { reduceMotion } from '../reduce-motion';\nimport { COLORS } from '../colors-values';\nimport { CONFIG } from '../';\n\nexport const inputStyleNeutral = css`\n\tbox-shadow: 0 0 0 transparent;\n\ttransition: box-shadow 0.1s linear;\n\tborder-radius: ${ CONFIG.radiusBlockUi };\n\tborder: ${ CONFIG.borderWidth } solid ${ COLORS.ui.border } };\n\t${ reduceMotion( 'transition' ) }\n`;\n\nexport const inputStyleFocus = css`\n\tborder-color: ${ COLORS.ui.theme };\n\tbox-shadow: 0 0 0\n\t\tcalc( ${ CONFIG.borderWidthFocus } - ${ CONFIG.borderWidth } )\n\t\t${ COLORS.ui.theme };\n\n\t// Windows High Contrast mode will show this outline, but not the box-shadow.\n\toutline: 2px solid transparent;\n`;\n"]}
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/view/index.js"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA","sourcesContent":["export { default as View } from './component';\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/view/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;AAAA","sourcesContent":["export { default as View } from './component';\n"]}
@@ -21,6 +21,7 @@ import { Root } from './styles/angle-picker-control-styles';
21
21
  import { space } from '../ui/utils/space';
22
22
  import { Text } from '../text';
23
23
  import { Spacer } from '../spacer';
24
+ import { COLORS } from '../utils/colors-values';
24
25
  export default function AnglePickerControl(_ref) {
25
26
  let {
26
27
  /** Start opting into the new margin-free styles that will become the default in a future version. */
@@ -58,13 +59,13 @@ export default function AnglePickerControl(_ref) {
58
59
  size: "__unstable-large",
59
60
  step: "1",
60
61
  value: value,
61
- hideHTMLArrows: true,
62
+ spinControls: "none",
62
63
  suffix: createElement(Spacer, {
63
64
  as: Text,
64
65
  marginBottom: 0,
65
66
  marginRight: space(3),
66
67
  style: {
67
- color: 'var( --wp-admin-theme-color )'
68
+ color: COLORS.ui.theme
68
69
  }
69
70
  }, "\xB0")
70
71
  })), createElement(FlexItem, {
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/angle-picker-control/index.js"],"names":["classnames","deprecated","__","FlexBlock","FlexItem","NumberControl","AngleCircle","Root","space","Text","Spacer","AnglePickerControl","__nextHasNoMarginBottom","className","label","onChange","value","since","version","hint","handleOnNumberChange","unprocessedValue","inputValue","parseInt","classes","color","marginBottom","marginTop"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,OAAOC,UAAP,MAAuB,uBAAvB;AACA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,SAASC,SAAT,EAAoBC,QAApB,QAAoC,SAApC;AACA,OAAOC,aAAP,MAA0B,mBAA1B;AACA,OAAOC,WAAP,MAAwB,gBAAxB;AACA,SAASC,IAAT,QAAqB,sCAArB;AACA,SAASC,KAAT,QAAsB,mBAAtB;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,SAASC,MAAT,QAAuB,WAAvB;AAEA,eAAe,SAASC,kBAAT,OAOX;AAAA,MAPwC;AAC3C;AACAC,IAAAA,uBAAuB,GAAG,KAFiB;AAG3CC,IAAAA,SAH2C;AAI3CC,IAAAA,KAAK,GAAGZ,EAAE,CAAE,OAAF,CAJiC;AAK3Ca,IAAAA,QAL2C;AAM3CC,IAAAA;AAN2C,GAOxC;;AACH,MAAK,CAAEJ,uBAAP,EAAiC;AAChCX,IAAAA,UAAU,CACT,2DADS,EAET;AACCgB,MAAAA,KAAK,EAAE,KADR;AAECC,MAAAA,OAAO,EAAE,KAFV;AAGCC,MAAAA,IAAI,EAAE;AAHP,KAFS,CAAV;AAQA;;AAED,QAAMC,oBAAoB,GAAKC,gBAAF,IAAwB;AACpD,UAAMC,UAAU,GACfD,gBAAgB,KAAK,EAArB,GAA0BE,QAAQ,CAAEF,gBAAF,EAAoB,EAApB,CAAlC,GAA6D,CAD9D;AAEAN,IAAAA,QAAQ,CAAEO,UAAF,CAAR;AACA,GAJD;;AAMA,QAAME,OAAO,GAAGxB,UAAU,CAAE,iCAAF,EAAqCa,SAArC,CAA1B;AAEA,SACC,cAAC,IAAD;AACC,IAAA,uBAAuB,EAAGD,uBAD3B;AAEC,IAAA,SAAS,EAAGY,OAFb;AAGC,IAAA,GAAG,EAAG;AAHP,KAKC,cAAC,SAAD,QACC,cAAC,aAAD;AACC,IAAA,KAAK,EAAGV,KADT;AAEC,IAAA,SAAS,EAAC,8CAFX;AAGC,IAAA,GAAG,EAAG,GAHP;AAIC,IAAA,GAAG,EAAG,CAJP;AAKC,IAAA,QAAQ,EAAGM,oBALZ;AAMC,IAAA,IAAI,EAAC,kBANN;AAOC,IAAA,IAAI,EAAC,GAPN;AAQC,IAAA,KAAK,EAAGJ,KART;AASC,IAAA,cAAc,MATf;AAUC,IAAA,MAAM,EACL,cAAC,MAAD;AACC,MAAA,EAAE,EAAGP,IADN;AAEC,MAAA,YAAY,EAAG,CAFhB;AAGC,MAAA,WAAW,EAAGD,KAAK,CAAE,CAAF,CAHpB;AAIC,MAAA,KAAK,EAAG;AACPiB,QAAAA,KAAK,EAAE;AADA;AAJT;AAXF,IADD,CALD,EA8BC,cAAC,QAAD;AACC,IAAA,KAAK,EAAG;AACPC,MAAAA,YAAY,EAAElB,KAAK,CAAE,CAAF,CADZ;AAEPmB,MAAAA,SAAS,EAAE;AAFJ;AADT,KAMC,cAAC,WAAD;AACC,mBAAY,MADb;AAEC,IAAA,KAAK,EAAGX,KAFT;AAGC,IAAA,QAAQ,EAAGD;AAHZ,IAND,CA9BD,CADD;AA6CA","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { FlexBlock, FlexItem } from '../flex';\nimport NumberControl from '../number-control';\nimport AngleCircle from './angle-circle';\nimport { Root } from './styles/angle-picker-control-styles';\nimport { space } from '../ui/utils/space';\nimport { Text } from '../text';\nimport { Spacer } from '../spacer';\n\nexport default function AnglePickerControl( {\n\t/** Start opting into the new margin-free styles that will become the default in a future version. */\n\t__nextHasNoMarginBottom = false,\n\tclassName,\n\tlabel = __( 'Angle' ),\n\tonChange,\n\tvalue,\n} ) {\n\tif ( ! __nextHasNoMarginBottom ) {\n\t\tdeprecated(\n\t\t\t'Bottom margin styles for wp.components.AnglePickerControl',\n\t\t\t{\n\t\t\t\tsince: '6.1',\n\t\t\t\tversion: '6.4',\n\t\t\t\thint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version.',\n\t\t\t}\n\t\t);\n\t}\n\n\tconst handleOnNumberChange = ( unprocessedValue ) => {\n\t\tconst inputValue =\n\t\t\tunprocessedValue !== '' ? parseInt( unprocessedValue, 10 ) : 0;\n\t\tonChange( inputValue );\n\t};\n\n\tconst classes = classnames( 'components-angle-picker-control', className );\n\n\treturn (\n\t\t<Root\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\tclassName={ classes }\n\t\t\tgap={ 4 }\n\t\t>\n\t\t\t<FlexBlock>\n\t\t\t\t<NumberControl\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tclassName=\"components-angle-picker-control__input-field\"\n\t\t\t\t\tmax={ 360 }\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tonChange={ handleOnNumberChange }\n\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\tstep=\"1\"\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\thideHTMLArrows\n\t\t\t\t\tsuffix={\n\t\t\t\t\t\t<Spacer\n\t\t\t\t\t\t\tas={ Text }\n\t\t\t\t\t\t\tmarginBottom={ 0 }\n\t\t\t\t\t\t\tmarginRight={ space( 3 ) }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tcolor: 'var( --wp-admin-theme-color )',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t°\n\t\t\t\t\t\t</Spacer>\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</FlexBlock>\n\t\t\t<FlexItem\n\t\t\t\tstyle={ {\n\t\t\t\t\tmarginBottom: space( 1 ),\n\t\t\t\t\tmarginTop: 'auto',\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<AngleCircle\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t/>\n\t\t\t</FlexItem>\n\t\t</Root>\n\t);\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/angle-picker-control/index.js"],"names":["classnames","deprecated","__","FlexBlock","FlexItem","NumberControl","AngleCircle","Root","space","Text","Spacer","COLORS","AnglePickerControl","__nextHasNoMarginBottom","className","label","onChange","value","since","version","hint","handleOnNumberChange","unprocessedValue","inputValue","parseInt","classes","color","ui","theme","marginBottom","marginTop"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,OAAOC,UAAP,MAAuB,uBAAvB;AACA,SAASC,EAAT,QAAmB,iBAAnB;AAEA;AACA;AACA;;AACA,SAASC,SAAT,EAAoBC,QAApB,QAAoC,SAApC;AACA,OAAOC,aAAP,MAA0B,mBAA1B;AACA,OAAOC,WAAP,MAAwB,gBAAxB;AACA,SAASC,IAAT,QAAqB,sCAArB;AACA,SAASC,KAAT,QAAsB,mBAAtB;AACA,SAASC,IAAT,QAAqB,SAArB;AACA,SAASC,MAAT,QAAuB,WAAvB;AACA,SAASC,MAAT,QAAuB,wBAAvB;AAEA,eAAe,SAASC,kBAAT,OAOX;AAAA,MAPwC;AAC3C;AACAC,IAAAA,uBAAuB,GAAG,KAFiB;AAG3CC,IAAAA,SAH2C;AAI3CC,IAAAA,KAAK,GAAGb,EAAE,CAAE,OAAF,CAJiC;AAK3Cc,IAAAA,QAL2C;AAM3CC,IAAAA;AAN2C,GAOxC;;AACH,MAAK,CAAEJ,uBAAP,EAAiC;AAChCZ,IAAAA,UAAU,CACT,2DADS,EAET;AACCiB,MAAAA,KAAK,EAAE,KADR;AAECC,MAAAA,OAAO,EAAE,KAFV;AAGCC,MAAAA,IAAI,EAAE;AAHP,KAFS,CAAV;AAQA;;AAED,QAAMC,oBAAoB,GAAKC,gBAAF,IAAwB;AACpD,UAAMC,UAAU,GACfD,gBAAgB,KAAK,EAArB,GAA0BE,QAAQ,CAAEF,gBAAF,EAAoB,EAApB,CAAlC,GAA6D,CAD9D;AAEAN,IAAAA,QAAQ,CAAEO,UAAF,CAAR;AACA,GAJD;;AAMA,QAAME,OAAO,GAAGzB,UAAU,CAAE,iCAAF,EAAqCc,SAArC,CAA1B;AAEA,SACC,cAAC,IAAD;AACC,IAAA,uBAAuB,EAAGD,uBAD3B;AAEC,IAAA,SAAS,EAAGY,OAFb;AAGC,IAAA,GAAG,EAAG;AAHP,KAKC,cAAC,SAAD,QACC,cAAC,aAAD;AACC,IAAA,KAAK,EAAGV,KADT;AAEC,IAAA,SAAS,EAAC,8CAFX;AAGC,IAAA,GAAG,EAAG,GAHP;AAIC,IAAA,GAAG,EAAG,CAJP;AAKC,IAAA,QAAQ,EAAGM,oBALZ;AAMC,IAAA,IAAI,EAAC,kBANN;AAOC,IAAA,IAAI,EAAC,GAPN;AAQC,IAAA,KAAK,EAAGJ,KART;AASC,IAAA,YAAY,EAAC,MATd;AAUC,IAAA,MAAM,EACL,cAAC,MAAD;AACC,MAAA,EAAE,EAAGR,IADN;AAEC,MAAA,YAAY,EAAG,CAFhB;AAGC,MAAA,WAAW,EAAGD,KAAK,CAAE,CAAF,CAHpB;AAIC,MAAA,KAAK,EAAG;AACPkB,QAAAA,KAAK,EAAEf,MAAM,CAACgB,EAAP,CAAUC;AADV;AAJT;AAXF,IADD,CALD,EA8BC,cAAC,QAAD;AACC,IAAA,KAAK,EAAG;AACPC,MAAAA,YAAY,EAAErB,KAAK,CAAE,CAAF,CADZ;AAEPsB,MAAAA,SAAS,EAAE;AAFJ;AADT,KAMC,cAAC,WAAD;AACC,mBAAY,MADb;AAEC,IAAA,KAAK,EAAGb,KAFT;AAGC,IAAA,QAAQ,EAAGD;AAHZ,IAND,CA9BD,CADD;AA6CA","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport deprecated from '@wordpress/deprecated';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { FlexBlock, FlexItem } from '../flex';\nimport NumberControl from '../number-control';\nimport AngleCircle from './angle-circle';\nimport { Root } from './styles/angle-picker-control-styles';\nimport { space } from '../ui/utils/space';\nimport { Text } from '../text';\nimport { Spacer } from '../spacer';\nimport { COLORS } from '../utils/colors-values';\n\nexport default function AnglePickerControl( {\n\t/** Start opting into the new margin-free styles that will become the default in a future version. */\n\t__nextHasNoMarginBottom = false,\n\tclassName,\n\tlabel = __( 'Angle' ),\n\tonChange,\n\tvalue,\n} ) {\n\tif ( ! __nextHasNoMarginBottom ) {\n\t\tdeprecated(\n\t\t\t'Bottom margin styles for wp.components.AnglePickerControl',\n\t\t\t{\n\t\t\t\tsince: '6.1',\n\t\t\t\tversion: '6.4',\n\t\t\t\thint: 'Set the `__nextHasNoMarginBottom` prop to true to start opting into the new styles, which will become the default in a future version.',\n\t\t\t}\n\t\t);\n\t}\n\n\tconst handleOnNumberChange = ( unprocessedValue ) => {\n\t\tconst inputValue =\n\t\t\tunprocessedValue !== '' ? parseInt( unprocessedValue, 10 ) : 0;\n\t\tonChange( inputValue );\n\t};\n\n\tconst classes = classnames( 'components-angle-picker-control', className );\n\n\treturn (\n\t\t<Root\n\t\t\t__nextHasNoMarginBottom={ __nextHasNoMarginBottom }\n\t\t\tclassName={ classes }\n\t\t\tgap={ 4 }\n\t\t>\n\t\t\t<FlexBlock>\n\t\t\t\t<NumberControl\n\t\t\t\t\tlabel={ label }\n\t\t\t\t\tclassName=\"components-angle-picker-control__input-field\"\n\t\t\t\t\tmax={ 360 }\n\t\t\t\t\tmin={ 0 }\n\t\t\t\t\tonChange={ handleOnNumberChange }\n\t\t\t\t\tsize=\"__unstable-large\"\n\t\t\t\t\tstep=\"1\"\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tspinControls=\"none\"\n\t\t\t\t\tsuffix={\n\t\t\t\t\t\t<Spacer\n\t\t\t\t\t\t\tas={ Text }\n\t\t\t\t\t\t\tmarginBottom={ 0 }\n\t\t\t\t\t\t\tmarginRight={ space( 3 ) }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tcolor: COLORS.ui.theme,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t°\n\t\t\t\t\t\t</Spacer>\n\t\t\t\t\t}\n\t\t\t\t/>\n\t\t\t</FlexBlock>\n\t\t\t<FlexItem\n\t\t\t\tstyle={ {\n\t\t\t\t\tmarginBottom: space( 1 ),\n\t\t\t\t\tmarginTop: 'auto',\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t<AngleCircle\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\tvalue={ value }\n\t\t\t\t\tonChange={ onChange }\n\t\t\t\t/>\n\t\t\t</FlexItem>\n\t\t</Root>\n\t);\n}\n"]}
@@ -9,7 +9,7 @@ import { map } from 'lodash';
9
9
  * WordPress dependencies
10
10
  */
11
11
 
12
- import { useLayoutEffect } from '@wordpress/element';
12
+ import { useLayoutEffect, useRef, useEffect } from '@wordpress/element';
13
13
  import { useAnchor } from '@wordpress/rich-text';
14
14
  /**
15
15
  * Internal dependencies
@@ -31,6 +31,7 @@ export function getAutoCompleterUI(autocompleter) {
31
31
  onChangeOptions,
32
32
  onSelect,
33
33
  onReset,
34
+ reset,
34
35
  value,
35
36
  contentRef
36
37
  } = _ref;
@@ -39,6 +40,8 @@ export function getAutoCompleterUI(autocompleter) {
39
40
  editableContentElement: contentRef.current,
40
41
  value
41
42
  });
43
+ const popoverRef = useRef();
44
+ useOnClickOutside(popoverRef, reset);
42
45
  useLayoutEffect(() => {
43
46
  onChangeOptions(items); // Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.
44
47
  // See https://github.com/WordPress/gutenberg/pull/41820
@@ -52,9 +55,10 @@ export function getAutoCompleterUI(autocompleter) {
52
55
  return createElement(Popover, {
53
56
  focusOnMount: false,
54
57
  onClose: onReset,
55
- position: "top right",
58
+ placement: "top-start",
56
59
  className: "components-autocomplete__popover",
57
- anchor: popoverAnchor
60
+ anchor: popoverAnchor,
61
+ ref: popoverRef
58
62
  }, createElement("div", {
59
63
  id: listBoxId,
60
64
  role: "listbox",
@@ -74,4 +78,26 @@ export function getAutoCompleterUI(autocompleter) {
74
78
 
75
79
  return AutocompleterUI;
76
80
  }
81
+
82
+ function useOnClickOutside(ref, handler) {
83
+ useEffect(() => {
84
+ const listener = event => {
85
+ // Do nothing if clicking ref's element or descendent elements, or if the ref is not referencing an element
86
+ if (!ref.current || ref.current.contains(event.target)) {
87
+ return;
88
+ }
89
+
90
+ handler(event);
91
+ };
92
+
93
+ document.addEventListener('mousedown', listener);
94
+ document.addEventListener('touchstart', listener);
95
+ return () => {
96
+ document.removeEventListener('mousedown', listener);
97
+ document.removeEventListener('touchstart', listener);
98
+ }; // Disable reason: `ref` is a ref object and should not be included in a
99
+ // hook's dependency list.
100
+ // eslint-disable-next-line react-hooks/exhaustive-deps
101
+ }, [handler]);
102
+ }
77
103
  //# sourceMappingURL=autocompleter-ui.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/autocomplete/autocompleter-ui.js"],"names":["classnames","map","useLayoutEffect","useAnchor","getDefaultUseItems","Button","Popover","getAutoCompleterUI","autocompleter","useItems","AutocompleterUI","filterValue","instanceId","listBoxId","className","selectedIndex","onChangeOptions","onSelect","onReset","value","contentRef","items","popoverAnchor","editableContentElement","current","length","option","index","key","isDisabled","label"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AACA,SAASC,GAAT,QAAoB,QAApB;AAEA;AACA;AACA;;AACA,SAASC,eAAT,QAAgC,oBAAhC;AACA,SAASC,SAAT,QAA0B,sBAA1B;AAEA;AACA;AACA;;AACA,OAAOC,kBAAP,MAA+B,yBAA/B;AACA,OAAOC,MAAP,MAAmB,WAAnB;AACA,OAAOC,OAAP,MAAoB,YAApB;AAEA,OAAO,SAASC,kBAAT,CAA6BC,aAA7B,EAA6C;AACnD,QAAMC,QAAQ,GAAGD,aAAa,CAACC,QAAd,GACdD,aAAa,CAACC,QADA,GAEdL,kBAAkB,CAAEI,aAAF,CAFrB;;AAIA,WAASE,eAAT,OAWI;AAAA,QAXsB;AACzBC,MAAAA,WADyB;AAEzBC,MAAAA,UAFyB;AAGzBC,MAAAA,SAHyB;AAIzBC,MAAAA,SAJyB;AAKzBC,MAAAA,aALyB;AAMzBC,MAAAA,eANyB;AAOzBC,MAAAA,QAPyB;AAQzBC,MAAAA,OARyB;AASzBC,MAAAA,KATyB;AAUzBC,MAAAA;AAVyB,KAWtB;AACH,UAAM,CAAEC,KAAF,IAAYZ,QAAQ,CAAEE,WAAF,CAA1B;AACA,UAAMW,aAAa,GAAGnB,SAAS,CAAE;AAChCoB,MAAAA,sBAAsB,EAAEH,UAAU,CAACI,OADH;AAEhCL,MAAAA;AAFgC,KAAF,CAA/B;AAKAjB,IAAAA,eAAe,CAAE,MAAM;AACtBc,MAAAA,eAAe,CAAEK,KAAF,CAAf,CADsB,CAEtB;AACA;AACA;AACA,KALc,EAKZ,CAAEA,KAAF,CALY,CAAf;;AAOA,QAAK,CAAEA,KAAK,CAACI,MAAR,GAAiB,CAAtB,EAA0B;AACzB,aAAO,IAAP;AACA;;AAED,WACC,cAAC,OAAD;AACC,MAAA,YAAY,EAAG,KADhB;AAEC,MAAA,OAAO,EAAGP,OAFX;AAGC,MAAA,QAAQ,EAAC,WAHV;AAIC,MAAA,SAAS,EAAC,kCAJX;AAKC,MAAA,MAAM,EAAGI;AALV,OAOC;AACC,MAAA,EAAE,EAAGT,SADN;AAEC,MAAA,IAAI,EAAC,SAFN;AAGC,MAAA,SAAS,EAAC;AAHX,OAKGZ,GAAG,CAAEoB,KAAF,EAAS,CAAEK,MAAF,EAAUC,KAAV,KACb,cAAC,MAAD;AACC,MAAA,GAAG,EAAGD,MAAM,CAACE,GADd;AAEC,MAAA,EAAE,EAAI,gCAAgChB,UAAY,IAAIc,MAAM,CAACE,GAAK,EAFnE;AAGC,MAAA,IAAI,EAAC,QAHN;AAIC,uBAAgBD,KAAK,KAAKZ,aAJ3B;AAKC,MAAA,QAAQ,EAAGW,MAAM,CAACG,UALnB;AAMC,MAAA,SAAS,EAAG7B,UAAU,CACrB,iCADqB,EAErBc,SAFqB,EAGrB;AACC,uBAAea,KAAK,KAAKZ;AAD1B,OAHqB,CANvB;AAaC,MAAA,OAAO,EAAG,MAAME,QAAQ,CAAES,MAAF;AAbzB,OAeGA,MAAM,CAACI,KAfV,CADI,CALN,CAPD,CADD;AAmCA;;AAED,SAAOpB,eAAP;AACA","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { map } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { useLayoutEffect } from '@wordpress/element';\nimport { useAnchor } from '@wordpress/rich-text';\n\n/**\n * Internal dependencies\n */\nimport getDefaultUseItems from './get-default-use-items';\nimport Button from '../button';\nimport Popover from '../popover';\n\nexport function getAutoCompleterUI( autocompleter ) {\n\tconst useItems = autocompleter.useItems\n\t\t? autocompleter.useItems\n\t\t: getDefaultUseItems( autocompleter );\n\n\tfunction AutocompleterUI( {\n\t\tfilterValue,\n\t\tinstanceId,\n\t\tlistBoxId,\n\t\tclassName,\n\t\tselectedIndex,\n\t\tonChangeOptions,\n\t\tonSelect,\n\t\tonReset,\n\t\tvalue,\n\t\tcontentRef,\n\t} ) {\n\t\tconst [ items ] = useItems( filterValue );\n\t\tconst popoverAnchor = useAnchor( {\n\t\t\teditableContentElement: contentRef.current,\n\t\t\tvalue,\n\t\t} );\n\n\t\tuseLayoutEffect( () => {\n\t\t\tonChangeOptions( items );\n\t\t\t// Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.\n\t\t\t// See https://github.com/WordPress/gutenberg/pull/41820\n\t\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t\t}, [ items ] );\n\n\t\tif ( ! items.length > 0 ) {\n\t\t\treturn null;\n\t\t}\n\n\t\treturn (\n\t\t\t<Popover\n\t\t\t\tfocusOnMount={ false }\n\t\t\t\tonClose={ onReset }\n\t\t\t\tposition=\"top right\"\n\t\t\t\tclassName=\"components-autocomplete__popover\"\n\t\t\t\tanchor={ popoverAnchor }\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tid={ listBoxId }\n\t\t\t\t\trole=\"listbox\"\n\t\t\t\t\tclassName=\"components-autocomplete__results\"\n\t\t\t\t>\n\t\t\t\t\t{ map( items, ( option, index ) => (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tkey={ option.key }\n\t\t\t\t\t\t\tid={ `components-autocomplete-item-${ instanceId }-${ option.key }` }\n\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\taria-selected={ index === selectedIndex }\n\t\t\t\t\t\t\tdisabled={ option.isDisabled }\n\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t'components-autocomplete__result',\n\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t'is-selected': index === selectedIndex,\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonClick={ () => onSelect( option ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ option.label }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) ) }\n\t\t\t\t</div>\n\t\t\t</Popover>\n\t\t);\n\t}\n\n\treturn AutocompleterUI;\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/autocomplete/autocompleter-ui.js"],"names":["classnames","map","useLayoutEffect","useRef","useEffect","useAnchor","getDefaultUseItems","Button","Popover","getAutoCompleterUI","autocompleter","useItems","AutocompleterUI","filterValue","instanceId","listBoxId","className","selectedIndex","onChangeOptions","onSelect","onReset","reset","value","contentRef","items","popoverAnchor","editableContentElement","current","popoverRef","useOnClickOutside","length","option","index","key","isDisabled","label","ref","handler","listener","event","contains","target","document","addEventListener","removeEventListener"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\nimport { map } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { useLayoutEffect, useRef, useEffect } from '@wordpress/element';\nimport { useAnchor } from '@wordpress/rich-text';\n\n/**\n * Internal dependencies\n */\nimport getDefaultUseItems from './get-default-use-items';\nimport Button from '../button';\nimport Popover from '../popover';\n\nexport function getAutoCompleterUI( autocompleter ) {\n\tconst useItems = autocompleter.useItems\n\t\t? autocompleter.useItems\n\t\t: getDefaultUseItems( autocompleter );\n\n\tfunction AutocompleterUI( {\n\t\tfilterValue,\n\t\tinstanceId,\n\t\tlistBoxId,\n\t\tclassName,\n\t\tselectedIndex,\n\t\tonChangeOptions,\n\t\tonSelect,\n\t\tonReset,\n\t\treset,\n\t\tvalue,\n\t\tcontentRef,\n\t} ) {\n\t\tconst [ items ] = useItems( filterValue );\n\t\tconst popoverAnchor = useAnchor( {\n\t\t\teditableContentElement: contentRef.current,\n\t\t\tvalue,\n\t\t} );\n\n\t\tconst popoverRef = useRef();\n\n\t\tuseOnClickOutside( popoverRef, reset );\n\n\t\tuseLayoutEffect( () => {\n\t\t\tonChangeOptions( items );\n\t\t\t// Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.\n\t\t\t// See https://github.com/WordPress/gutenberg/pull/41820\n\t\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t\t}, [ items ] );\n\n\t\tif ( ! items.length > 0 ) {\n\t\t\treturn null;\n\t\t}\n\n\t\treturn (\n\t\t\t<Popover\n\t\t\t\tfocusOnMount={ false }\n\t\t\t\tonClose={ onReset }\n\t\t\t\tplacement=\"top-start\"\n\t\t\t\tclassName=\"components-autocomplete__popover\"\n\t\t\t\tanchor={ popoverAnchor }\n\t\t\t\tref={ popoverRef }\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tid={ listBoxId }\n\t\t\t\t\trole=\"listbox\"\n\t\t\t\t\tclassName=\"components-autocomplete__results\"\n\t\t\t\t>\n\t\t\t\t\t{ map( items, ( option, index ) => (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tkey={ option.key }\n\t\t\t\t\t\t\tid={ `components-autocomplete-item-${ instanceId }-${ option.key }` }\n\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\taria-selected={ index === selectedIndex }\n\t\t\t\t\t\t\tdisabled={ option.isDisabled }\n\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t'components-autocomplete__result',\n\t\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t'is-selected': index === selectedIndex,\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\tonClick={ () => onSelect( option ) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ option.label }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t) ) }\n\t\t\t\t</div>\n\t\t\t</Popover>\n\t\t);\n\t}\n\n\treturn AutocompleterUI;\n}\n\nfunction useOnClickOutside( ref, handler ) {\n\tuseEffect( () => {\n\t\tconst listener = ( event ) => {\n\t\t\t// Do nothing if clicking ref's element or descendent elements, or if the ref is not referencing an element\n\t\t\tif ( ! ref.current || ref.current.contains( event.target ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\thandler( event );\n\t\t};\n\t\tdocument.addEventListener( 'mousedown', listener );\n\t\tdocument.addEventListener( 'touchstart', listener );\n\t\treturn () => {\n\t\t\tdocument.removeEventListener( 'mousedown', listener );\n\t\t\tdocument.removeEventListener( 'touchstart', listener );\n\t\t};\n\t\t// Disable reason: `ref` is a ref object and should not be included in a\n\t\t// hook's dependency list.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ handler ] );\n}\n"]}
@@ -191,7 +191,7 @@ function useAutocomplete(_ref) {
191
191
  }
192
192
 
193
193
  function handleKeyDown(event) {
194
- backspacing.current = event.code === 'Backspace';
194
+ backspacing.current = event.key === 'Backspace';
195
195
 
196
196
  if (!autocompleter) {
197
197
  return;
@@ -201,11 +201,15 @@ function useAutocomplete(_ref) {
201
201
  return;
202
202
  }
203
203
 
204
- if (event.defaultPrevented) {
204
+ if (event.defaultPrevented || // Ignore keydowns from IMEs
205
+ event.isComposing || // Workaround for Mac Safari where the final Enter/Backspace of an IME composition
206
+ // is `isComposing=false`, even though it's technically still part of the composition.
207
+ // These can only be detected by keyCode.
208
+ event.keyCode === 229) {
205
209
  return;
206
210
  }
207
211
 
208
- switch (event.code) {
212
+ switch (event.key) {
209
213
  case 'ArrowUp':
210
214
  setSelectedIndex((selectedIndex === 0 ? filteredOptions.length : selectedIndex) - 1);
211
215
  break;
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/autocomplete/index.js"],"names":["find","removeAccents","renderToString","useEffect","useState","useRef","useMemo","__","_n","sprintf","useInstanceId","useDebounce","useMergeRefs","useRefEffect","create","slice","insert","isCollapsed","getTextContent","speak","getAutoCompleterUI","escapeRegExp","useAutocomplete","record","onChange","onReplace","completers","contentRef","debouncedSpeak","instanceId","selectedIndex","setSelectedIndex","filteredOptions","setFilteredOptions","filterValue","setFilterValue","autocompleter","setAutocompleter","AutocompleterUI","setAutocompleterUI","backspacing","insertCompletion","replacement","end","start","triggerPrefix","length","toInsert","html","select","option","getOptionCompletion","isDisabled","completion","value","action","undefined","reset","announce","options","onChangeOptions","handleKeyDown","event","current","code","defaultPrevented","preventDefault","textContent","text","textAfterSelection","completer","allowContext","index","lastIndexOf","textWithoutTrigger","tooDistantFromTrigger","mismatch","wordsFromTrigger","split","hasOneTriggerWord","matchingWhileBackspacing","test","safeTrigger","match","RegExp","query","key","selectedKey","className","isExpanded","listBoxId","activeId","hasSelection","onKeyDown","popover","useAutocompleteProps","ref","onKeyDownRef","element","_onKeyDown","addEventListener","removeEventListener","children","Autocomplete","isSelected","props"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { find } from 'lodash';\nimport removeAccents from 'remove-accents';\n\n/**\n * WordPress dependencies\n */\nimport {\n\trenderToString,\n\tuseEffect,\n\tuseState,\n\tuseRef,\n\tuseMemo,\n} from '@wordpress/element';\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport {\n\tuseInstanceId,\n\tuseDebounce,\n\tuseMergeRefs,\n\tuseRefEffect,\n} from '@wordpress/compose';\nimport {\n\tcreate,\n\tslice,\n\tinsert,\n\tisCollapsed,\n\tgetTextContent,\n} from '@wordpress/rich-text';\nimport { speak } from '@wordpress/a11y';\n\n/**\n * Internal dependencies\n */\nimport { getAutoCompleterUI } from './autocompleter-ui';\nimport { escapeRegExp } from '../utils/strings';\n\n/**\n * A raw completer option.\n *\n * @typedef {*} CompleterOption\n */\n\n/**\n * @callback FnGetOptions\n *\n * @return {(CompleterOption[]|Promise.<CompleterOption[]>)} The completer options or a promise for them.\n */\n\n/**\n * @callback FnGetOptionKeywords\n * @param {CompleterOption} option a completer option.\n *\n * @return {string[]} list of key words to search.\n */\n\n/**\n * @callback FnIsOptionDisabled\n * @param {CompleterOption} option a completer option.\n *\n * @return {string[]} whether or not the given option is disabled.\n */\n\n/**\n * @callback FnGetOptionLabel\n * @param {CompleterOption} option a completer option.\n *\n * @return {(string|Array.<(string|WPElement)>)} list of react components to render.\n */\n\n/**\n * @callback FnAllowContext\n * @param {string} before the string before the auto complete trigger and query.\n * @param {string} after the string after the autocomplete trigger and query.\n *\n * @return {boolean} true if the completer can handle.\n */\n\n/**\n * @typedef {Object} OptionCompletion\n * @property {'insert-at-caret'|'replace'} action the intended placement of the completion.\n * @property {OptionCompletionValue} value the completion value.\n */\n\n/**\n * A completion value.\n *\n * @typedef {(string|WPElement|Object)} OptionCompletionValue\n */\n\n/**\n * @callback FnGetOptionCompletion\n * @param {CompleterOption} value the value of the completer option.\n * @param {string} query the text value of the autocomplete query.\n *\n * @return {(OptionCompletion|OptionCompletionValue)} the completion for the given option. If an\n * \t\t\t\t\t\t\t\t\t\t\t\t\t OptionCompletionValue is returned, the\n * \t\t\t\t\t\t\t\t\t\t\t\t\t completion action defaults to `insert-at-caret`.\n */\n\n/**\n * @typedef {Object} WPCompleter\n * @property {string} name a way to identify a completer, useful for selective overriding.\n * @property {?string} className A class to apply to the popup menu.\n * @property {string} triggerPrefix the prefix that will display the menu.\n * @property {(CompleterOption[]|FnGetOptions)} options the completer options or a function to get them.\n * @property {?FnGetOptionKeywords} getOptionKeywords get the keywords for a given option.\n * @property {?FnIsOptionDisabled} isOptionDisabled get whether or not the given option is disabled.\n * @property {FnGetOptionLabel} getOptionLabel get the label for a given option.\n * @property {?FnAllowContext} allowContext filter the context under which the autocomplete activates.\n * @property {FnGetOptionCompletion} getOptionCompletion get the completion associated with a given option.\n */\n\nfunction useAutocomplete( {\n\trecord,\n\tonChange,\n\tonReplace,\n\tcompleters,\n\tcontentRef,\n} ) {\n\tconst debouncedSpeak = useDebounce( speak, 500 );\n\tconst instanceId = useInstanceId( useAutocomplete );\n\tconst [ selectedIndex, setSelectedIndex ] = useState( 0 );\n\tconst [ filteredOptions, setFilteredOptions ] = useState( [] );\n\tconst [ filterValue, setFilterValue ] = useState( '' );\n\tconst [ autocompleter, setAutocompleter ] = useState( null );\n\tconst [ AutocompleterUI, setAutocompleterUI ] = useState( null );\n\tconst backspacing = useRef( false );\n\n\tfunction insertCompletion( replacement ) {\n\t\tconst end = record.start;\n\t\tconst start =\n\t\t\tend - autocompleter.triggerPrefix.length - filterValue.length;\n\t\tconst toInsert = create( { html: renderToString( replacement ) } );\n\n\t\tonChange( insert( record, toInsert, start, end ) );\n\t}\n\n\tfunction select( option ) {\n\t\tconst { getOptionCompletion } = autocompleter || {};\n\n\t\tif ( option.isDisabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( getOptionCompletion ) {\n\t\t\tconst completion = getOptionCompletion( option.value, filterValue );\n\n\t\t\tconst { action, value } =\n\t\t\t\tundefined === completion.action ||\n\t\t\t\tundefined === completion.value\n\t\t\t\t\t? { action: 'insert-at-caret', value: completion }\n\t\t\t\t\t: completion;\n\n\t\t\tif ( 'replace' === action ) {\n\t\t\t\tonReplace( [ value ] );\n\t\t\t\t// When replacing, the component will unmount, so don't reset\n\t\t\t\t// state (below) on an unmounted component.\n\t\t\t\treturn;\n\t\t\t} else if ( 'insert-at-caret' === action ) {\n\t\t\t\tinsertCompletion( value );\n\t\t\t}\n\t\t}\n\n\t\t// Reset autocomplete state after insertion rather than before\n\t\t// so insertion events don't cause the completion menu to redisplay.\n\t\treset();\n\t}\n\n\tfunction reset() {\n\t\tsetSelectedIndex( 0 );\n\t\tsetFilteredOptions( [] );\n\t\tsetFilterValue( '' );\n\t\tsetAutocompleter( null );\n\t\tsetAutocompleterUI( null );\n\t}\n\n\tfunction announce( options ) {\n\t\tif ( ! debouncedSpeak ) {\n\t\t\treturn;\n\t\t}\n\t\tif ( !! options.length ) {\n\t\t\tdebouncedSpeak(\n\t\t\t\tsprintf(\n\t\t\t\t\t/* translators: %d: number of results. */\n\t\t\t\t\t_n(\n\t\t\t\t\t\t'%d result found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t'%d results found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\toptions.length\n\t\t\t\t\t),\n\t\t\t\t\toptions.length\n\t\t\t\t),\n\t\t\t\t'assertive'\n\t\t\t);\n\t\t} else {\n\t\t\tdebouncedSpeak( __( 'No results.' ), 'assertive' );\n\t\t}\n\t}\n\n\t/**\n\t * Load options for an autocompleter.\n\t *\n\t * @param {Array} options\n\t */\n\tfunction onChangeOptions( options ) {\n\t\tsetSelectedIndex(\n\t\t\toptions.length === filteredOptions.length ? selectedIndex : 0\n\t\t);\n\t\tsetFilteredOptions( options );\n\t\tannounce( options );\n\t}\n\n\tfunction handleKeyDown( event ) {\n\t\tbackspacing.current = event.code === 'Backspace';\n\n\t\tif ( ! autocompleter ) {\n\t\t\treturn;\n\t\t}\n\t\tif ( filteredOptions.length === 0 ) {\n\t\t\treturn;\n\t\t}\n\t\tif ( event.defaultPrevented ) {\n\t\t\treturn;\n\t\t}\n\t\tswitch ( event.code ) {\n\t\t\tcase 'ArrowUp':\n\t\t\t\tsetSelectedIndex(\n\t\t\t\t\t( selectedIndex === 0\n\t\t\t\t\t\t? filteredOptions.length\n\t\t\t\t\t\t: selectedIndex ) - 1\n\t\t\t\t);\n\t\t\t\tbreak;\n\n\t\t\tcase 'ArrowDown':\n\t\t\t\tsetSelectedIndex(\n\t\t\t\t\t( selectedIndex + 1 ) % filteredOptions.length\n\t\t\t\t);\n\t\t\t\tbreak;\n\n\t\t\tcase 'Escape':\n\t\t\t\tsetAutocompleter( null );\n\t\t\t\tsetAutocompleterUI( null );\n\t\t\t\tevent.preventDefault();\n\t\t\t\tbreak;\n\n\t\t\tcase 'Enter':\n\t\t\t\tselect( filteredOptions[ selectedIndex ] );\n\t\t\t\tbreak;\n\n\t\t\tcase 'ArrowLeft':\n\t\t\tcase 'ArrowRight':\n\t\t\t\treset();\n\t\t\t\treturn;\n\n\t\t\tdefault:\n\t\t\t\treturn;\n\t\t}\n\n\t\t// Any handled key should prevent original behavior. This relies on\n\t\t// the early return in the default case.\n\t\tevent.preventDefault();\n\t}\n\n\t// textContent is a primitive (string), memoizing is not strictly necessary\n\t// but this is a preemptive performance improvement, since the autocompleter\n\t// is a potential bottleneck for the editor type metric.\n\tconst textContent = useMemo( () => {\n\t\tif ( isCollapsed( record ) ) {\n\t\t\treturn getTextContent( slice( record, 0 ) );\n\t\t}\n\t}, [ record ] );\n\n\tuseEffect( () => {\n\t\tif ( ! textContent ) {\n\t\t\treset();\n\t\t\treturn;\n\t\t}\n\n\t\tconst text = removeAccents( textContent );\n\t\tconst textAfterSelection = getTextContent(\n\t\t\tslice( record, undefined, getTextContent( record ).length )\n\t\t);\n\t\tconst completer = find(\n\t\t\tcompleters,\n\t\t\t( { triggerPrefix, allowContext } ) => {\n\t\t\t\tconst index = text.lastIndexOf( triggerPrefix );\n\n\t\t\t\tif ( index === -1 ) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\tconst textWithoutTrigger = text.slice(\n\t\t\t\t\tindex + triggerPrefix.length\n\t\t\t\t);\n\n\t\t\t\tconst tooDistantFromTrigger = textWithoutTrigger.length > 50; // 50 chars seems to be a good limit.\n\t\t\t\t// This is a final barrier to prevent the effect from completing with\n\t\t\t\t// an extremely long string, which causes the editor to slow-down\n\t\t\t\t// significantly. This could happen, for example, if `matchingWhileBackspacing`\n\t\t\t\t// is true and one of the \"words\" end up being too long. If that's the case,\n\t\t\t\t// it will be caught by this guard.\n\t\t\t\tif ( tooDistantFromTrigger ) return false;\n\n\t\t\t\tconst mismatch = filteredOptions.length === 0;\n\t\t\t\tconst wordsFromTrigger = textWithoutTrigger.split( /\\s/ );\n\t\t\t\t// We need to allow the effect to run when not backspacing and if there\n\t\t\t\t// was a mismatch. i.e when typing a trigger + the match string or when\n\t\t\t\t// clicking in an existing trigger word on the page. We do that if we\n\t\t\t\t// detect that we have one word from trigger in the current textual context.\n\t\t\t\t//\n\t\t\t\t// Ex.: \"Some text @a\" <-- \"@a\" will be detected as the trigger word and\n\t\t\t\t// allow the effect to run. It will run until there's a mismatch.\n\t\t\t\tconst hasOneTriggerWord = wordsFromTrigger.length === 1;\n\t\t\t\t// This is used to allow the effect to run when backspacing and if\n\t\t\t\t// \"touching\" a word that \"belongs\" to a trigger. We consider a \"trigger\n\t\t\t\t// word\" any word up to the limit of 3 from the trigger character.\n\t\t\t\t// Anything beyond that is ignored if there's a mismatch. This allows\n\t\t\t\t// us to \"escape\" a mismatch when backspacing, but still imposing some\n\t\t\t\t// sane limits.\n\t\t\t\t//\n\t\t\t\t// Ex: \"Some text @marcelo sekkkk\" <--- \"kkkk\" caused a mismatch, but\n\t\t\t\t// if the user presses backspace here, it will show the completion popup again.\n\t\t\t\tconst matchingWhileBackspacing =\n\t\t\t\t\tbackspacing.current &&\n\t\t\t\t\ttextWithoutTrigger.split( /\\s/ ).length <= 3;\n\n\t\t\t\tif (\n\t\t\t\t\tmismatch &&\n\t\t\t\t\t! ( matchingWhileBackspacing || hasOneTriggerWord )\n\t\t\t\t) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\tif (\n\t\t\t\t\tallowContext &&\n\t\t\t\t\t! allowContext( text.slice( 0, index ), textAfterSelection )\n\t\t\t\t) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\tif (\n\t\t\t\t\t/^\\s/.test( textWithoutTrigger ) ||\n\t\t\t\t\t/\\s\\s+$/.test( textWithoutTrigger )\n\t\t\t\t) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\treturn /[\\u0000-\\uFFFF]*$/.test( textWithoutTrigger );\n\t\t\t}\n\t\t);\n\n\t\tif ( ! completer ) {\n\t\t\treset();\n\t\t\treturn;\n\t\t}\n\n\t\tconst safeTrigger = escapeRegExp( completer.triggerPrefix );\n\t\tconst match = text\n\t\t\t.slice( text.lastIndexOf( completer.triggerPrefix ) )\n\t\t\t.match( new RegExp( `${ safeTrigger }([\\u0000-\\uFFFF]*)$` ) );\n\t\tconst query = match && match[ 1 ];\n\n\t\tsetAutocompleter( completer );\n\t\tsetAutocompleterUI( () =>\n\t\t\tcompleter !== autocompleter\n\t\t\t\t? getAutoCompleterUI( completer )\n\t\t\t\t: AutocompleterUI\n\t\t);\n\t\tsetFilterValue( query );\n\t\t// Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.\n\t\t// See https://github.com/WordPress/gutenberg/pull/41820\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ textContent ] );\n\n\tconst { key: selectedKey = '' } = filteredOptions[ selectedIndex ] || {};\n\tconst { className } = autocompleter || {};\n\tconst isExpanded = !! autocompleter && filteredOptions.length > 0;\n\tconst listBoxId = isExpanded\n\t\t? `components-autocomplete-listbox-${ instanceId }`\n\t\t: null;\n\tconst activeId = isExpanded\n\t\t? `components-autocomplete-item-${ instanceId }-${ selectedKey }`\n\t\t: null;\n\tconst hasSelection = record.start !== undefined;\n\n\treturn {\n\t\tlistBoxId,\n\t\tactiveId,\n\t\tonKeyDown: handleKeyDown,\n\t\tpopover: hasSelection && AutocompleterUI && (\n\t\t\t<AutocompleterUI\n\t\t\t\tclassName={ className }\n\t\t\t\tfilterValue={ filterValue }\n\t\t\t\tinstanceId={ instanceId }\n\t\t\t\tlistBoxId={ listBoxId }\n\t\t\t\tselectedIndex={ selectedIndex }\n\t\t\t\tonChangeOptions={ onChangeOptions }\n\t\t\t\tonSelect={ select }\n\t\t\t\tvalue={ record }\n\t\t\t\tcontentRef={ contentRef }\n\t\t\t\treset={ reset }\n\t\t\t/>\n\t\t),\n\t};\n}\n\nexport function useAutocompleteProps( options ) {\n\tconst ref = useRef();\n\tconst onKeyDownRef = useRef();\n\tconst { popover, listBoxId, activeId, onKeyDown } = useAutocomplete( {\n\t\t...options,\n\t\tcontentRef: ref,\n\t} );\n\tonKeyDownRef.current = onKeyDown;\n\treturn {\n\t\tref: useMergeRefs( [\n\t\t\tref,\n\t\t\tuseRefEffect( ( element ) => {\n\t\t\t\tfunction _onKeyDown( event ) {\n\t\t\t\t\tonKeyDownRef.current( event );\n\t\t\t\t}\n\t\t\t\telement.addEventListener( 'keydown', _onKeyDown );\n\t\t\t\treturn () => {\n\t\t\t\t\telement.removeEventListener( 'keydown', _onKeyDown );\n\t\t\t\t};\n\t\t\t}, [] ),\n\t\t] ),\n\t\tchildren: popover,\n\t\t'aria-autocomplete': listBoxId ? 'list' : undefined,\n\t\t'aria-owns': listBoxId,\n\t\t'aria-activedescendant': activeId,\n\t};\n}\n\nexport default function Autocomplete( { children, isSelected, ...options } ) {\n\tconst { popover, ...props } = useAutocomplete( options );\n\treturn (\n\t\t<>\n\t\t\t{ children( props ) }\n\t\t\t{ isSelected && popover }\n\t\t</>\n\t);\n}\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/autocomplete/index.js"],"names":["find","removeAccents","renderToString","useEffect","useState","useRef","useMemo","__","_n","sprintf","useInstanceId","useDebounce","useMergeRefs","useRefEffect","create","slice","insert","isCollapsed","getTextContent","speak","getAutoCompleterUI","escapeRegExp","useAutocomplete","record","onChange","onReplace","completers","contentRef","debouncedSpeak","instanceId","selectedIndex","setSelectedIndex","filteredOptions","setFilteredOptions","filterValue","setFilterValue","autocompleter","setAutocompleter","AutocompleterUI","setAutocompleterUI","backspacing","insertCompletion","replacement","end","start","triggerPrefix","length","toInsert","html","select","option","getOptionCompletion","isDisabled","completion","value","action","undefined","reset","announce","options","onChangeOptions","handleKeyDown","event","current","key","defaultPrevented","isComposing","keyCode","preventDefault","textContent","text","textAfterSelection","completer","allowContext","index","lastIndexOf","textWithoutTrigger","tooDistantFromTrigger","mismatch","wordsFromTrigger","split","hasOneTriggerWord","matchingWhileBackspacing","test","safeTrigger","match","RegExp","query","selectedKey","className","isExpanded","listBoxId","activeId","hasSelection","onKeyDown","popover","useAutocompleteProps","ref","onKeyDownRef","element","_onKeyDown","addEventListener","removeEventListener","children","Autocomplete","isSelected","props"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { find } from 'lodash';\nimport removeAccents from 'remove-accents';\n\n/**\n * WordPress dependencies\n */\nimport {\n\trenderToString,\n\tuseEffect,\n\tuseState,\n\tuseRef,\n\tuseMemo,\n} from '@wordpress/element';\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport {\n\tuseInstanceId,\n\tuseDebounce,\n\tuseMergeRefs,\n\tuseRefEffect,\n} from '@wordpress/compose';\nimport {\n\tcreate,\n\tslice,\n\tinsert,\n\tisCollapsed,\n\tgetTextContent,\n} from '@wordpress/rich-text';\nimport { speak } from '@wordpress/a11y';\n\n/**\n * Internal dependencies\n */\nimport { getAutoCompleterUI } from './autocompleter-ui';\nimport { escapeRegExp } from '../utils/strings';\n\n/**\n * A raw completer option.\n *\n * @typedef {*} CompleterOption\n */\n\n/**\n * @callback FnGetOptions\n *\n * @return {(CompleterOption[]|Promise.<CompleterOption[]>)} The completer options or a promise for them.\n */\n\n/**\n * @callback FnGetOptionKeywords\n * @param {CompleterOption} option a completer option.\n *\n * @return {string[]} list of key words to search.\n */\n\n/**\n * @callback FnIsOptionDisabled\n * @param {CompleterOption} option a completer option.\n *\n * @return {string[]} whether or not the given option is disabled.\n */\n\n/**\n * @callback FnGetOptionLabel\n * @param {CompleterOption} option a completer option.\n *\n * @return {(string|Array.<(string|WPElement)>)} list of react components to render.\n */\n\n/**\n * @callback FnAllowContext\n * @param {string} before the string before the auto complete trigger and query.\n * @param {string} after the string after the autocomplete trigger and query.\n *\n * @return {boolean} true if the completer can handle.\n */\n\n/**\n * @typedef {Object} OptionCompletion\n * @property {'insert-at-caret'|'replace'} action the intended placement of the completion.\n * @property {OptionCompletionValue} value the completion value.\n */\n\n/**\n * A completion value.\n *\n * @typedef {(string|WPElement|Object)} OptionCompletionValue\n */\n\n/**\n * @callback FnGetOptionCompletion\n * @param {CompleterOption} value the value of the completer option.\n * @param {string} query the text value of the autocomplete query.\n *\n * @return {(OptionCompletion|OptionCompletionValue)} the completion for the given option. If an\n * \t\t\t\t\t\t\t\t\t\t\t\t\t OptionCompletionValue is returned, the\n * \t\t\t\t\t\t\t\t\t\t\t\t\t completion action defaults to `insert-at-caret`.\n */\n\n/**\n * @typedef {Object} WPCompleter\n * @property {string} name a way to identify a completer, useful for selective overriding.\n * @property {?string} className A class to apply to the popup menu.\n * @property {string} triggerPrefix the prefix that will display the menu.\n * @property {(CompleterOption[]|FnGetOptions)} options the completer options or a function to get them.\n * @property {?FnGetOptionKeywords} getOptionKeywords get the keywords for a given option.\n * @property {?FnIsOptionDisabled} isOptionDisabled get whether or not the given option is disabled.\n * @property {FnGetOptionLabel} getOptionLabel get the label for a given option.\n * @property {?FnAllowContext} allowContext filter the context under which the autocomplete activates.\n * @property {FnGetOptionCompletion} getOptionCompletion get the completion associated with a given option.\n */\n\nfunction useAutocomplete( {\n\trecord,\n\tonChange,\n\tonReplace,\n\tcompleters,\n\tcontentRef,\n} ) {\n\tconst debouncedSpeak = useDebounce( speak, 500 );\n\tconst instanceId = useInstanceId( useAutocomplete );\n\tconst [ selectedIndex, setSelectedIndex ] = useState( 0 );\n\tconst [ filteredOptions, setFilteredOptions ] = useState( [] );\n\tconst [ filterValue, setFilterValue ] = useState( '' );\n\tconst [ autocompleter, setAutocompleter ] = useState( null );\n\tconst [ AutocompleterUI, setAutocompleterUI ] = useState( null );\n\tconst backspacing = useRef( false );\n\n\tfunction insertCompletion( replacement ) {\n\t\tconst end = record.start;\n\t\tconst start =\n\t\t\tend - autocompleter.triggerPrefix.length - filterValue.length;\n\t\tconst toInsert = create( { html: renderToString( replacement ) } );\n\n\t\tonChange( insert( record, toInsert, start, end ) );\n\t}\n\n\tfunction select( option ) {\n\t\tconst { getOptionCompletion } = autocompleter || {};\n\n\t\tif ( option.isDisabled ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( getOptionCompletion ) {\n\t\t\tconst completion = getOptionCompletion( option.value, filterValue );\n\n\t\t\tconst { action, value } =\n\t\t\t\tundefined === completion.action ||\n\t\t\t\tundefined === completion.value\n\t\t\t\t\t? { action: 'insert-at-caret', value: completion }\n\t\t\t\t\t: completion;\n\n\t\t\tif ( 'replace' === action ) {\n\t\t\t\tonReplace( [ value ] );\n\t\t\t\t// When replacing, the component will unmount, so don't reset\n\t\t\t\t// state (below) on an unmounted component.\n\t\t\t\treturn;\n\t\t\t} else if ( 'insert-at-caret' === action ) {\n\t\t\t\tinsertCompletion( value );\n\t\t\t}\n\t\t}\n\n\t\t// Reset autocomplete state after insertion rather than before\n\t\t// so insertion events don't cause the completion menu to redisplay.\n\t\treset();\n\t}\n\n\tfunction reset() {\n\t\tsetSelectedIndex( 0 );\n\t\tsetFilteredOptions( [] );\n\t\tsetFilterValue( '' );\n\t\tsetAutocompleter( null );\n\t\tsetAutocompleterUI( null );\n\t}\n\n\tfunction announce( options ) {\n\t\tif ( ! debouncedSpeak ) {\n\t\t\treturn;\n\t\t}\n\t\tif ( !! options.length ) {\n\t\t\tdebouncedSpeak(\n\t\t\t\tsprintf(\n\t\t\t\t\t/* translators: %d: number of results. */\n\t\t\t\t\t_n(\n\t\t\t\t\t\t'%d result found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\t'%d results found, use up and down arrow keys to navigate.',\n\t\t\t\t\t\toptions.length\n\t\t\t\t\t),\n\t\t\t\t\toptions.length\n\t\t\t\t),\n\t\t\t\t'assertive'\n\t\t\t);\n\t\t} else {\n\t\t\tdebouncedSpeak( __( 'No results.' ), 'assertive' );\n\t\t}\n\t}\n\n\t/**\n\t * Load options for an autocompleter.\n\t *\n\t * @param {Array} options\n\t */\n\tfunction onChangeOptions( options ) {\n\t\tsetSelectedIndex(\n\t\t\toptions.length === filteredOptions.length ? selectedIndex : 0\n\t\t);\n\t\tsetFilteredOptions( options );\n\t\tannounce( options );\n\t}\n\n\tfunction handleKeyDown( event ) {\n\t\tbackspacing.current = event.key === 'Backspace';\n\n\t\tif ( ! autocompleter ) {\n\t\t\treturn;\n\t\t}\n\t\tif ( filteredOptions.length === 0 ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif (\n\t\t\tevent.defaultPrevented ||\n\t\t\t// Ignore keydowns from IMEs\n\t\t\tevent.isComposing ||\n\t\t\t// Workaround for Mac Safari where the final Enter/Backspace of an IME composition\n\t\t\t// is `isComposing=false`, even though it's technically still part of the composition.\n\t\t\t// These can only be detected by keyCode.\n\t\t\tevent.keyCode === 229\n\t\t) {\n\t\t\treturn;\n\t\t}\n\t\tswitch ( event.key ) {\n\t\t\tcase 'ArrowUp':\n\t\t\t\tsetSelectedIndex(\n\t\t\t\t\t( selectedIndex === 0\n\t\t\t\t\t\t? filteredOptions.length\n\t\t\t\t\t\t: selectedIndex ) - 1\n\t\t\t\t);\n\t\t\t\tbreak;\n\n\t\t\tcase 'ArrowDown':\n\t\t\t\tsetSelectedIndex(\n\t\t\t\t\t( selectedIndex + 1 ) % filteredOptions.length\n\t\t\t\t);\n\t\t\t\tbreak;\n\n\t\t\tcase 'Escape':\n\t\t\t\tsetAutocompleter( null );\n\t\t\t\tsetAutocompleterUI( null );\n\t\t\t\tevent.preventDefault();\n\t\t\t\tbreak;\n\n\t\t\tcase 'Enter':\n\t\t\t\tselect( filteredOptions[ selectedIndex ] );\n\t\t\t\tbreak;\n\n\t\t\tcase 'ArrowLeft':\n\t\t\tcase 'ArrowRight':\n\t\t\t\treset();\n\t\t\t\treturn;\n\n\t\t\tdefault:\n\t\t\t\treturn;\n\t\t}\n\n\t\t// Any handled key should prevent original behavior. This relies on\n\t\t// the early return in the default case.\n\t\tevent.preventDefault();\n\t}\n\n\t// textContent is a primitive (string), memoizing is not strictly necessary\n\t// but this is a preemptive performance improvement, since the autocompleter\n\t// is a potential bottleneck for the editor type metric.\n\tconst textContent = useMemo( () => {\n\t\tif ( isCollapsed( record ) ) {\n\t\t\treturn getTextContent( slice( record, 0 ) );\n\t\t}\n\t}, [ record ] );\n\n\tuseEffect( () => {\n\t\tif ( ! textContent ) {\n\t\t\treset();\n\t\t\treturn;\n\t\t}\n\n\t\tconst text = removeAccents( textContent );\n\t\tconst textAfterSelection = getTextContent(\n\t\t\tslice( record, undefined, getTextContent( record ).length )\n\t\t);\n\t\tconst completer = find(\n\t\t\tcompleters,\n\t\t\t( { triggerPrefix, allowContext } ) => {\n\t\t\t\tconst index = text.lastIndexOf( triggerPrefix );\n\n\t\t\t\tif ( index === -1 ) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\tconst textWithoutTrigger = text.slice(\n\t\t\t\t\tindex + triggerPrefix.length\n\t\t\t\t);\n\n\t\t\t\tconst tooDistantFromTrigger = textWithoutTrigger.length > 50; // 50 chars seems to be a good limit.\n\t\t\t\t// This is a final barrier to prevent the effect from completing with\n\t\t\t\t// an extremely long string, which causes the editor to slow-down\n\t\t\t\t// significantly. This could happen, for example, if `matchingWhileBackspacing`\n\t\t\t\t// is true and one of the \"words\" end up being too long. If that's the case,\n\t\t\t\t// it will be caught by this guard.\n\t\t\t\tif ( tooDistantFromTrigger ) return false;\n\n\t\t\t\tconst mismatch = filteredOptions.length === 0;\n\t\t\t\tconst wordsFromTrigger = textWithoutTrigger.split( /\\s/ );\n\t\t\t\t// We need to allow the effect to run when not backspacing and if there\n\t\t\t\t// was a mismatch. i.e when typing a trigger + the match string or when\n\t\t\t\t// clicking in an existing trigger word on the page. We do that if we\n\t\t\t\t// detect that we have one word from trigger in the current textual context.\n\t\t\t\t//\n\t\t\t\t// Ex.: \"Some text @a\" <-- \"@a\" will be detected as the trigger word and\n\t\t\t\t// allow the effect to run. It will run until there's a mismatch.\n\t\t\t\tconst hasOneTriggerWord = wordsFromTrigger.length === 1;\n\t\t\t\t// This is used to allow the effect to run when backspacing and if\n\t\t\t\t// \"touching\" a word that \"belongs\" to a trigger. We consider a \"trigger\n\t\t\t\t// word\" any word up to the limit of 3 from the trigger character.\n\t\t\t\t// Anything beyond that is ignored if there's a mismatch. This allows\n\t\t\t\t// us to \"escape\" a mismatch when backspacing, but still imposing some\n\t\t\t\t// sane limits.\n\t\t\t\t//\n\t\t\t\t// Ex: \"Some text @marcelo sekkkk\" <--- \"kkkk\" caused a mismatch, but\n\t\t\t\t// if the user presses backspace here, it will show the completion popup again.\n\t\t\t\tconst matchingWhileBackspacing =\n\t\t\t\t\tbackspacing.current &&\n\t\t\t\t\ttextWithoutTrigger.split( /\\s/ ).length <= 3;\n\n\t\t\t\tif (\n\t\t\t\t\tmismatch &&\n\t\t\t\t\t! ( matchingWhileBackspacing || hasOneTriggerWord )\n\t\t\t\t) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\tif (\n\t\t\t\t\tallowContext &&\n\t\t\t\t\t! allowContext( text.slice( 0, index ), textAfterSelection )\n\t\t\t\t) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\tif (\n\t\t\t\t\t/^\\s/.test( textWithoutTrigger ) ||\n\t\t\t\t\t/\\s\\s+$/.test( textWithoutTrigger )\n\t\t\t\t) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\treturn /[\\u0000-\\uFFFF]*$/.test( textWithoutTrigger );\n\t\t\t}\n\t\t);\n\n\t\tif ( ! completer ) {\n\t\t\treset();\n\t\t\treturn;\n\t\t}\n\n\t\tconst safeTrigger = escapeRegExp( completer.triggerPrefix );\n\t\tconst match = text\n\t\t\t.slice( text.lastIndexOf( completer.triggerPrefix ) )\n\t\t\t.match( new RegExp( `${ safeTrigger }([\\u0000-\\uFFFF]*)$` ) );\n\t\tconst query = match && match[ 1 ];\n\n\t\tsetAutocompleter( completer );\n\t\tsetAutocompleterUI( () =>\n\t\t\tcompleter !== autocompleter\n\t\t\t\t? getAutoCompleterUI( completer )\n\t\t\t\t: AutocompleterUI\n\t\t);\n\t\tsetFilterValue( query );\n\t\t// Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.\n\t\t// See https://github.com/WordPress/gutenberg/pull/41820\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ textContent ] );\n\n\tconst { key: selectedKey = '' } = filteredOptions[ selectedIndex ] || {};\n\tconst { className } = autocompleter || {};\n\tconst isExpanded = !! autocompleter && filteredOptions.length > 0;\n\tconst listBoxId = isExpanded\n\t\t? `components-autocomplete-listbox-${ instanceId }`\n\t\t: null;\n\tconst activeId = isExpanded\n\t\t? `components-autocomplete-item-${ instanceId }-${ selectedKey }`\n\t\t: null;\n\tconst hasSelection = record.start !== undefined;\n\n\treturn {\n\t\tlistBoxId,\n\t\tactiveId,\n\t\tonKeyDown: handleKeyDown,\n\t\tpopover: hasSelection && AutocompleterUI && (\n\t\t\t<AutocompleterUI\n\t\t\t\tclassName={ className }\n\t\t\t\tfilterValue={ filterValue }\n\t\t\t\tinstanceId={ instanceId }\n\t\t\t\tlistBoxId={ listBoxId }\n\t\t\t\tselectedIndex={ selectedIndex }\n\t\t\t\tonChangeOptions={ onChangeOptions }\n\t\t\t\tonSelect={ select }\n\t\t\t\tvalue={ record }\n\t\t\t\tcontentRef={ contentRef }\n\t\t\t\treset={ reset }\n\t\t\t/>\n\t\t),\n\t};\n}\n\nexport function useAutocompleteProps( options ) {\n\tconst ref = useRef();\n\tconst onKeyDownRef = useRef();\n\tconst { popover, listBoxId, activeId, onKeyDown } = useAutocomplete( {\n\t\t...options,\n\t\tcontentRef: ref,\n\t} );\n\tonKeyDownRef.current = onKeyDown;\n\treturn {\n\t\tref: useMergeRefs( [\n\t\t\tref,\n\t\t\tuseRefEffect( ( element ) => {\n\t\t\t\tfunction _onKeyDown( event ) {\n\t\t\t\t\tonKeyDownRef.current( event );\n\t\t\t\t}\n\t\t\t\telement.addEventListener( 'keydown', _onKeyDown );\n\t\t\t\treturn () => {\n\t\t\t\t\telement.removeEventListener( 'keydown', _onKeyDown );\n\t\t\t\t};\n\t\t\t}, [] ),\n\t\t] ),\n\t\tchildren: popover,\n\t\t'aria-autocomplete': listBoxId ? 'list' : undefined,\n\t\t'aria-owns': listBoxId,\n\t\t'aria-activedescendant': activeId,\n\t};\n}\n\nexport default function Autocomplete( { children, isSelected, ...options } ) {\n\tconst { popover, ...props } = useAutocomplete( options );\n\treturn (\n\t\t<>\n\t\t\t{ children( props ) }\n\t\t\t{ isSelected && popover }\n\t\t</>\n\t);\n}\n"]}
@@ -14,7 +14,6 @@ import { useMergeRefs } from '@wordpress/compose';
14
14
  import BorderBoxControlLinkedButton from '../border-box-control-linked-button';
15
15
  import BorderBoxControlSplitControls from '../border-box-control-split-controls';
16
16
  import { BorderControl } from '../../border-control';
17
- import { HStack } from '../../h-stack';
18
17
  import { StyledLabel } from '../../base-control/styles/base-control-styles';
19
18
  import { View } from '../../view';
20
19
  import { VisuallyHidden } from '../../visually-hidden';
@@ -36,7 +35,7 @@ const BorderLabel = props => {
36
35
  }, label) : createElement(StyledLabel, null, label);
37
36
  };
38
37
 
39
- const BorderBoxControl = (props, forwardedRef) => {
38
+ const UnconnectedBorderBoxControl = (props, forwardedRef) => {
40
39
  const {
41
40
  className,
42
41
  colors,
@@ -54,11 +53,12 @@ const BorderBoxControl = (props, forwardedRef) => {
54
53
  onSplitChange,
55
54
  popoverPlacement,
56
55
  popoverOffset,
56
+ size,
57
57
  splitValue,
58
58
  toggleLinked,
59
+ wrapperClassName,
59
60
  __experimentalHasMultipleOrigins,
60
61
  __experimentalIsRenderedInSidebar,
61
- __next36pxDefaultSize = false,
62
62
  ...otherProps
63
63
  } = useBorderBoxControl(props); // Use internal state instead of a ref to make sure that the component
64
64
  // re-renders when the popover's anchor updates.
@@ -79,10 +79,8 @@ const BorderBoxControl = (props, forwardedRef) => {
79
79
  }), createElement(BorderLabel, {
80
80
  label: label,
81
81
  hideLabelFromVision: hideLabelFromVision
82
- }), createElement(HStack, {
83
- alignment: 'start',
84
- expanded: true,
85
- spacing: 0
82
+ }), createElement(View, {
83
+ className: wrapperClassName
86
84
  }, isLinked ? createElement(BorderControl, {
87
85
  className: linkedControlClassName,
88
86
  colors: colors,
@@ -97,10 +95,10 @@ const BorderBoxControl = (props, forwardedRef) => {
97
95
  ,
98
96
  value: linkedValue,
99
97
  withSlider: true,
100
- width: '110px',
98
+ width: size === '__unstable-large' ? '116px' : '110px',
101
99
  __experimentalHasMultipleOrigins: __experimentalHasMultipleOrigins,
102
100
  __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
103
- __next36pxDefaultSize: __next36pxDefaultSize
101
+ size: size
104
102
  }) : createElement(BorderBoxControlSplitControls, {
105
103
  colors: colors,
106
104
  disableCustomColors: disableCustomColors,
@@ -112,14 +110,64 @@ const BorderBoxControl = (props, forwardedRef) => {
112
110
  value: splitValue,
113
111
  __experimentalHasMultipleOrigins: __experimentalHasMultipleOrigins,
114
112
  __experimentalIsRenderedInSidebar: __experimentalIsRenderedInSidebar,
115
- __next36pxDefaultSize: __next36pxDefaultSize
113
+ size: size
116
114
  }), createElement(BorderBoxControlLinkedButton, {
117
115
  onClick: toggleLinked,
118
116
  isLinked: isLinked,
119
- __next36pxDefaultSize: __next36pxDefaultSize
117
+ size: size
120
118
  })));
121
119
  };
120
+ /**
121
+ * The `BorderBoxControl` effectively has two view states. The first, a "linked"
122
+ * view, allows configuration of a flat border via a single `BorderControl`.
123
+ * The second, a "split" view, contains a `BorderControl` for each side
124
+ * as well as a visualizer for the currently selected borders. Each view also
125
+ * contains a button to toggle between the two.
126
+ *
127
+ * When switching from the "split" view to "linked", if the individual side
128
+ * borders are not consistent, the "linked" view will display any border
129
+ * properties selections that are consistent while showing a mixed state for
130
+ * those that aren't. For example, if all borders had the same color and style
131
+ * but different widths, then the border dropdown in the "linked" view's
132
+ * `BorderControl` would show that consistent color and style but the "linked"
133
+ * view's width input would show "Mixed" placeholder text.
134
+ *
135
+ * ```jsx
136
+ * import { __experimentalBorderBoxControl as BorderBoxControl } from '@wordpress/components';
137
+ * import { __ } from '@wordpress/i18n';
138
+ *
139
+ * const colors = [
140
+ * { name: 'Blue 20', color: '#72aee6' },
141
+ * // ...
142
+ * ];
143
+ *
144
+ * const MyBorderBoxControl = () => {
145
+ * const defaultBorder = {
146
+ * color: '#72aee6',
147
+ * style: 'dashed',
148
+ * width: '1px',
149
+ * };
150
+ * const [ borders, setBorders ] = useState( {
151
+ * top: defaultBorder,
152
+ * right: defaultBorder,
153
+ * bottom: defaultBorder,
154
+ * left: defaultBorder,
155
+ * } );
156
+ * const onChange = ( newBorders ) => setBorders( newBorders );
157
+ *
158
+ * return (
159
+ * <BorderBoxControl
160
+ * colors={ colors }
161
+ * label={ __( 'Borders' ) }
162
+ * onChange={ onChange }
163
+ * value={ borders }
164
+ * />
165
+ * );
166
+ * };
167
+ * ```
168
+ */
169
+
122
170
 
123
- const ConnectedBorderBoxControl = contextConnect(BorderBoxControl, 'BorderBoxControl');
124
- export default ConnectedBorderBoxControl;
171
+ export const BorderBoxControl = contextConnect(UnconnectedBorderBoxControl, 'BorderBoxControl');
172
+ export default BorderBoxControl;
125
173
  //# sourceMappingURL=component.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/border-box-control/border-box-control/component.tsx"],"names":["__","useMemo","useState","useMergeRefs","BorderBoxControlLinkedButton","BorderBoxControlSplitControls","BorderControl","HStack","StyledLabel","View","VisuallyHidden","contextConnect","useBorderBoxControl","BorderLabel","props","label","hideLabelFromVision","BorderBoxControl","forwardedRef","className","colors","disableCustomColors","disableUnits","enableAlpha","enableStyle","hasMixedBorders","isLinked","linkedControlClassName","linkedValue","onLinkedChange","onSplitChange","popoverPlacement","popoverOffset","splitValue","toggleLinked","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","__next36pxDefaultSize","otherProps","popoverAnchor","setPopoverAnchor","popoverProps","placement","offset","anchor","shift","undefined","mergedRef","ConnectedBorderBoxControl"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useMemo, useState } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport BorderBoxControlLinkedButton from '../border-box-control-linked-button';\nimport BorderBoxControlSplitControls from '../border-box-control-split-controls';\nimport { BorderControl } from '../../border-control';\nimport { HStack } from '../../h-stack';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport { View } from '../../view';\nimport { VisuallyHidden } from '../../visually-hidden';\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { useBorderBoxControl } from './hook';\n\nimport type { BorderBoxControlProps } from '../types';\nimport type {\n\tLabelProps,\n\tBorderControlProps,\n} from '../../border-control/types';\n\nconst BorderLabel = ( 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 BorderBoxControl = (\n\tprops: WordPressComponentProps< BorderBoxControlProps, 'div' >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\tclassName,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tdisableUnits,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\thasMixedBorders,\n\t\thideLabelFromVision,\n\t\tisLinked,\n\t\tlabel,\n\t\tlinkedControlClassName,\n\t\tlinkedValue,\n\t\tonLinkedChange,\n\t\tonSplitChange,\n\t\tpopoverPlacement,\n\t\tpopoverOffset,\n\t\tsplitValue,\n\t\ttoggleLinked,\n\t\t__experimentalHasMultipleOrigins,\n\t\t__experimentalIsRenderedInSidebar,\n\t\t__next36pxDefaultSize = false,\n\t\t...otherProps\n\t} = useBorderBoxControl( props );\n\n\t// Use internal state instead of a ref to make sure that the component\n\t// re-renders when the popover's anchor updates.\n\tconst [ popoverAnchor, setPopoverAnchor ] = useState< Element | null >(\n\t\tnull\n\t);\n\n\t// Memoize popoverProps to avoid returning a new object every time.\n\tconst popoverProps: BorderControlProps[ '__unstablePopoverProps' ] =\n\t\tuseMemo(\n\t\t\t() =>\n\t\t\t\tpopoverPlacement\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tplacement: popoverPlacement,\n\t\t\t\t\t\t\toffset: popoverOffset,\n\t\t\t\t\t\t\tanchor: popoverAnchor,\n\t\t\t\t\t\t\tshift: true,\n\t\t\t\t\t }\n\t\t\t\t\t: undefined,\n\t\t\t[ popoverPlacement, popoverOffset, popoverAnchor ]\n\t\t);\n\n\tconst mergedRef = useMergeRefs( [ setPopoverAnchor, forwardedRef ] );\n\n\treturn (\n\t\t<View className={ className } { ...otherProps } ref={ mergedRef }>\n\t\t\t<BorderLabel\n\t\t\t\tlabel={ label }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t/>\n\t\t\t<HStack alignment={ 'start' } expanded={ true } spacing={ 0 }>\n\t\t\t\t{ isLinked ? (\n\t\t\t\t\t<BorderControl\n\t\t\t\t\t\tclassName={ linkedControlClassName }\n\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\tdisableUnits={ disableUnits }\n\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t\tenableStyle={ enableStyle }\n\t\t\t\t\t\tonChange={ onLinkedChange }\n\t\t\t\t\t\tplaceholder={\n\t\t\t\t\t\t\thasMixedBorders ? __( 'Mixed' ) : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__unstablePopoverProps={ popoverProps }\n\t\t\t\t\t\tshouldSanitizeBorder={ false } // This component will handle that.\n\t\t\t\t\t\tvalue={ linkedValue }\n\t\t\t\t\t\twithSlider={ true }\n\t\t\t\t\t\twidth={ '110px' }\n\t\t\t\t\t\t__experimentalHasMultipleOrigins={\n\t\t\t\t\t\t\t__experimentalHasMultipleOrigins\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<BorderBoxControlSplitControls\n\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t\tenableStyle={ enableStyle }\n\t\t\t\t\t\tonChange={ onSplitChange }\n\t\t\t\t\t\tpopoverPlacement={ popoverPlacement }\n\t\t\t\t\t\tpopoverOffset={ popoverOffset }\n\t\t\t\t\t\tvalue={ splitValue }\n\t\t\t\t\t\t__experimentalHasMultipleOrigins={\n\t\t\t\t\t\t\t__experimentalHasMultipleOrigins\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t<BorderBoxControlLinkedButton\n\t\t\t\t\tonClick={ toggleLinked }\n\t\t\t\t\tisLinked={ isLinked }\n\t\t\t\t\t__next36pxDefaultSize={ __next36pxDefaultSize }\n\t\t\t\t/>\n\t\t\t</HStack>\n\t\t</View>\n\t);\n};\n\nconst ConnectedBorderBoxControl = contextConnect(\n\tBorderBoxControl,\n\t'BorderBoxControl'\n);\n\nexport default ConnectedBorderBoxControl;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/border-box-control/border-box-control/component.tsx"],"names":["__","useMemo","useState","useMergeRefs","BorderBoxControlLinkedButton","BorderBoxControlSplitControls","BorderControl","StyledLabel","View","VisuallyHidden","contextConnect","useBorderBoxControl","BorderLabel","props","label","hideLabelFromVision","UnconnectedBorderBoxControl","forwardedRef","className","colors","disableCustomColors","disableUnits","enableAlpha","enableStyle","hasMixedBorders","isLinked","linkedControlClassName","linkedValue","onLinkedChange","onSplitChange","popoverPlacement","popoverOffset","size","splitValue","toggleLinked","wrapperClassName","__experimentalHasMultipleOrigins","__experimentalIsRenderedInSidebar","otherProps","popoverAnchor","setPopoverAnchor","popoverProps","placement","offset","anchor","shift","undefined","mergedRef","BorderBoxControl"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useMemo, useState } from '@wordpress/element';\nimport { useMergeRefs } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport BorderBoxControlLinkedButton from '../border-box-control-linked-button';\nimport BorderBoxControlSplitControls from '../border-box-control-split-controls';\nimport { BorderControl } from '../../border-control';\nimport { StyledLabel } from '../../base-control/styles/base-control-styles';\nimport { View } from '../../view';\nimport { VisuallyHidden } from '../../visually-hidden';\nimport { contextConnect, WordPressComponentProps } from '../../ui/context';\nimport { useBorderBoxControl } from './hook';\n\nimport type { BorderBoxControlProps } from '../types';\nimport type {\n\tLabelProps,\n\tBorderControlProps,\n} from '../../border-control/types';\n\nconst BorderLabel = ( 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 UnconnectedBorderBoxControl = (\n\tprops: WordPressComponentProps< BorderBoxControlProps, 'div', false >,\n\tforwardedRef: React.ForwardedRef< any >\n) => {\n\tconst {\n\t\tclassName,\n\t\tcolors,\n\t\tdisableCustomColors,\n\t\tdisableUnits,\n\t\tenableAlpha,\n\t\tenableStyle,\n\t\thasMixedBorders,\n\t\thideLabelFromVision,\n\t\tisLinked,\n\t\tlabel,\n\t\tlinkedControlClassName,\n\t\tlinkedValue,\n\t\tonLinkedChange,\n\t\tonSplitChange,\n\t\tpopoverPlacement,\n\t\tpopoverOffset,\n\t\tsize,\n\t\tsplitValue,\n\t\ttoggleLinked,\n\t\twrapperClassName,\n\t\t__experimentalHasMultipleOrigins,\n\t\t__experimentalIsRenderedInSidebar,\n\t\t...otherProps\n\t} = useBorderBoxControl( props );\n\n\t// Use internal state instead of a ref to make sure that the component\n\t// re-renders when the popover's anchor updates.\n\tconst [ popoverAnchor, setPopoverAnchor ] = useState< Element | null >(\n\t\tnull\n\t);\n\n\t// Memoize popoverProps to avoid returning a new object every time.\n\tconst popoverProps: BorderControlProps[ '__unstablePopoverProps' ] =\n\t\tuseMemo(\n\t\t\t() =>\n\t\t\t\tpopoverPlacement\n\t\t\t\t\t? {\n\t\t\t\t\t\t\tplacement: popoverPlacement,\n\t\t\t\t\t\t\toffset: popoverOffset,\n\t\t\t\t\t\t\tanchor: popoverAnchor,\n\t\t\t\t\t\t\tshift: true,\n\t\t\t\t\t }\n\t\t\t\t\t: undefined,\n\t\t\t[ popoverPlacement, popoverOffset, popoverAnchor ]\n\t\t);\n\n\tconst mergedRef = useMergeRefs( [ setPopoverAnchor, forwardedRef ] );\n\n\treturn (\n\t\t<View className={ className } { ...otherProps } ref={ mergedRef }>\n\t\t\t<BorderLabel\n\t\t\t\tlabel={ label }\n\t\t\t\thideLabelFromVision={ hideLabelFromVision }\n\t\t\t/>\n\t\t\t<View className={ wrapperClassName }>\n\t\t\t\t{ isLinked ? (\n\t\t\t\t\t<BorderControl\n\t\t\t\t\t\tclassName={ linkedControlClassName }\n\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\tdisableUnits={ disableUnits }\n\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t\tenableStyle={ enableStyle }\n\t\t\t\t\t\tonChange={ onLinkedChange }\n\t\t\t\t\t\tplaceholder={\n\t\t\t\t\t\t\thasMixedBorders ? __( 'Mixed' ) : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__unstablePopoverProps={ popoverProps }\n\t\t\t\t\t\tshouldSanitizeBorder={ false } // This component will handle that.\n\t\t\t\t\t\tvalue={ linkedValue }\n\t\t\t\t\t\twithSlider={ true }\n\t\t\t\t\t\twidth={\n\t\t\t\t\t\t\tsize === '__unstable-large' ? '116px' : '110px'\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__experimentalHasMultipleOrigins={\n\t\t\t\t\t\t\t__experimentalHasMultipleOrigins\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\tsize={ size }\n\t\t\t\t\t/>\n\t\t\t\t) : (\n\t\t\t\t\t<BorderBoxControlSplitControls\n\t\t\t\t\t\tcolors={ colors }\n\t\t\t\t\t\tdisableCustomColors={ disableCustomColors }\n\t\t\t\t\t\tenableAlpha={ enableAlpha }\n\t\t\t\t\t\tenableStyle={ enableStyle }\n\t\t\t\t\t\tonChange={ onSplitChange }\n\t\t\t\t\t\tpopoverPlacement={ popoverPlacement }\n\t\t\t\t\t\tpopoverOffset={ popoverOffset }\n\t\t\t\t\t\tvalue={ splitValue }\n\t\t\t\t\t\t__experimentalHasMultipleOrigins={\n\t\t\t\t\t\t\t__experimentalHasMultipleOrigins\n\t\t\t\t\t\t}\n\t\t\t\t\t\t__experimentalIsRenderedInSidebar={\n\t\t\t\t\t\t\t__experimentalIsRenderedInSidebar\n\t\t\t\t\t\t}\n\t\t\t\t\t\tsize={ size }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t<BorderBoxControlLinkedButton\n\t\t\t\t\tonClick={ toggleLinked }\n\t\t\t\t\tisLinked={ isLinked }\n\t\t\t\t\tsize={ size }\n\t\t\t\t/>\n\t\t\t</View>\n\t\t</View>\n\t);\n};\n\n/**\n * The `BorderBoxControl` effectively has two view states. The first, a \"linked\"\n * view, allows configuration of a flat border via a single `BorderControl`.\n * The second, a \"split\" view, contains a `BorderControl` for each side\n * as well as a visualizer for the currently selected borders. Each view also\n * contains a button to toggle between the two.\n *\n * When switching from the \"split\" view to \"linked\", if the individual side\n * borders are not consistent, the \"linked\" view will display any border\n * properties selections that are consistent while showing a mixed state for\n * those that aren't. For example, if all borders had the same color and style\n * but different widths, then the border dropdown in the \"linked\" view's\n * `BorderControl` would show that consistent color and style but the \"linked\"\n * view's width input would show \"Mixed\" placeholder text.\n *\n * ```jsx\n * import { __experimentalBorderBoxControl as BorderBoxControl } from '@wordpress/components';\n * import { __ } from '@wordpress/i18n';\n *\n * const colors = [\n * \t{ name: 'Blue 20', color: '#72aee6' },\n * \t// ...\n * ];\n *\n * const MyBorderBoxControl = () => {\n * \tconst defaultBorder = {\n * \t\tcolor: '#72aee6',\n * \t\tstyle: 'dashed',\n * \t\twidth: '1px',\n * \t};\n * \tconst [ borders, setBorders ] = useState( {\n * \t\ttop: defaultBorder,\n * \t\tright: defaultBorder,\n * \t\tbottom: defaultBorder,\n * \t\tleft: defaultBorder,\n * \t} );\n * \tconst onChange = ( newBorders ) => setBorders( newBorders );\n *\n * \treturn (\n * \t\t<BorderBoxControl\n * \t\t\tcolors={ colors }\n * \t\t\tlabel={ __( 'Borders' ) }\n * \t\t\tonChange={ onChange }\n * \t\t\tvalue={ borders }\n * \t\t/>\n * \t);\n * };\n * ```\n */\nexport const BorderBoxControl = contextConnect(\n\tUnconnectedBorderBoxControl,\n\t'BorderBoxControl'\n);\n\nexport default BorderBoxControl;\n"]}