@wordpress/components 23.3.5 → 23.5.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 (777) hide show
  1. package/CHANGELOG.md +35 -5
  2. package/build/alignment-matrix-control/utils.js +4 -4
  3. package/build/alignment-matrix-control/utils.js.map +1 -1
  4. package/build/angle-picker-control/angle-circle.js +37 -29
  5. package/build/angle-picker-control/angle-circle.js.map +1 -1
  6. package/build/angle-picker-control/index.js +44 -9
  7. package/build/angle-picker-control/index.js.map +1 -1
  8. package/build/angle-picker-control/styles/angle-picker-control-styles.js +13 -13
  9. package/build/angle-picker-control/styles/angle-picker-control-styles.js.map +1 -1
  10. package/build/angle-picker-control/types.js.map +1 -0
  11. package/build/autocomplete/autocompleter-ui.js +41 -17
  12. package/build/autocomplete/autocompleter-ui.js.map +1 -1
  13. package/build/autocomplete/autocompleter-ui.native.js +1 -0
  14. package/build/autocomplete/autocompleter-ui.native.js.map +1 -1
  15. package/build/autocomplete/index.js +31 -33
  16. package/build/autocomplete/index.js.map +1 -1
  17. package/build/base-control/hooks.js +1 -1
  18. package/build/base-control/hooks.js.map +1 -1
  19. package/build/border-box-control/utils.js +1 -1
  20. package/build/border-box-control/utils.js.map +1 -1
  21. package/build/box-control/all-input-control.js +2 -2
  22. package/build/box-control/all-input-control.js.map +1 -1
  23. package/build/box-control/axial-input-controls.js +1 -1
  24. package/build/box-control/axial-input-controls.js.map +1 -1
  25. package/build/box-control/icon.js.map +1 -1
  26. package/build/box-control/index.js +32 -3
  27. package/build/box-control/index.js.map +1 -1
  28. package/build/box-control/input-controls.js +5 -5
  29. package/build/box-control/input-controls.js.map +1 -1
  30. package/build/box-control/linked-button.js.map +1 -1
  31. package/build/box-control/styles/box-control-icon-styles.js +28 -28
  32. package/build/box-control/styles/box-control-icon-styles.js.map +1 -1
  33. package/build/box-control/styles/box-control-styles.js +23 -23
  34. package/build/box-control/styles/box-control-styles.js.map +1 -1
  35. package/build/box-control/styles/box-control-visualizer-styles.js +19 -19
  36. package/build/box-control/styles/box-control-visualizer-styles.js.map +1 -1
  37. package/build/box-control/types.js +6 -0
  38. package/build/box-control/types.js.map +1 -0
  39. package/build/box-control/unit-control.js.map +1 -1
  40. package/build/box-control/utils.js +23 -23
  41. package/build/box-control/utils.js.map +1 -1
  42. package/build/circular-option-picker/index.js +63 -14
  43. package/build/circular-option-picker/index.js.map +1 -1
  44. package/build/circular-option-picker/types.js +6 -0
  45. package/build/circular-option-picker/types.js.map +1 -0
  46. package/build/color-palette/index.js +8 -3
  47. package/build/color-palette/index.js.map +1 -1
  48. package/build/combobox-control/index.js +68 -12
  49. package/build/combobox-control/index.js.map +1 -1
  50. package/build/combobox-control/styles.js +2 -2
  51. package/build/combobox-control/styles.js.map +1 -1
  52. package/build/combobox-control/types.js +6 -0
  53. package/build/combobox-control/types.js.map +1 -0
  54. package/build/custom-gradient-picker/index.js +0 -1
  55. package/build/custom-gradient-picker/index.js.map +1 -1
  56. package/build/date-time/time/index.js +1 -1
  57. package/build/date-time/time/index.js.map +1 -1
  58. package/build/date-time/utils.js +1 -1
  59. package/build/date-time/utils.js.map +1 -1
  60. package/build/draggable/index.js +2 -2
  61. package/build/draggable/index.js.map +1 -1
  62. package/build/focal-point-picker/utils.js +3 -3
  63. package/build/focal-point-picker/utils.js.map +1 -1
  64. package/build/font-size-picker/utils.js +2 -2
  65. package/build/font-size-picker/utils.js.map +1 -1
  66. package/build/gradient-picker/index.js +9 -4
  67. package/build/gradient-picker/index.js.map +1 -1
  68. package/build/higher-order/with-constrained-tabbing/index.js +9 -0
  69. package/build/higher-order/with-constrained-tabbing/index.js.map +1 -1
  70. package/build/input-control/reducer/reducer.js +5 -5
  71. package/build/input-control/reducer/reducer.js.map +1 -1
  72. package/build/input-control/utils.js +1 -1
  73. package/build/input-control/utils.js.map +1 -1
  74. package/build/menu-items-choice/index.js +40 -3
  75. package/build/menu-items-choice/index.js.map +1 -1
  76. package/build/menu-items-choice/types.js +6 -0
  77. package/build/menu-items-choice/types.js.map +1 -0
  78. package/build/mobile/global-styles-context/utils.native.js +2 -1
  79. package/build/mobile/global-styles-context/utils.native.js.map +1 -1
  80. package/build/modal/index.js +41 -3
  81. package/build/modal/index.js.map +1 -1
  82. package/build/palette-edit/index.js +4 -1
  83. package/build/palette-edit/index.js.map +1 -1
  84. package/build/panel/header.js +9 -0
  85. package/build/panel/header.js.map +1 -1
  86. package/build/panel/index.js +21 -3
  87. package/build/panel/index.js.map +1 -1
  88. package/build/panel/row.js +10 -4
  89. package/build/panel/row.js.map +1 -1
  90. package/build/panel/types.js +6 -0
  91. package/build/panel/types.js.map +1 -0
  92. package/build/popover/index.js +15 -3
  93. package/build/popover/index.js.map +1 -1
  94. package/build/popover/overlay-middlewares.js +46 -0
  95. package/build/popover/overlay-middlewares.js.map +1 -0
  96. package/build/popover/utils.js +45 -6
  97. package/build/popover/utils.js.map +1 -1
  98. package/build/query-controls/terms.js +1 -1
  99. package/build/query-controls/terms.js.map +1 -1
  100. package/build/range-control/utils.js +4 -4
  101. package/build/range-control/utils.js.map +1 -1
  102. package/build/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js +12 -12
  103. package/build/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js.map +1 -1
  104. package/build/resizable-box/resize-tooltip/utils.js +14 -14
  105. package/build/resizable-box/resize-tooltip/utils.js.map +1 -1
  106. package/build/snackbar/index.js +2 -2
  107. package/build/snackbar/index.js.map +1 -1
  108. package/build/toolbar/toolbar/index.js +25 -14
  109. package/build/toolbar/toolbar/index.js.map +1 -1
  110. package/build/toolbar/toolbar/toolbar-container.js +5 -4
  111. package/build/toolbar/toolbar/toolbar-container.js.map +1 -1
  112. package/build/toolbar/toolbar/types.js +6 -0
  113. package/build/toolbar/toolbar/types.js.map +1 -0
  114. package/build/toolbar/toolbar-button/index.js +2 -0
  115. package/build/toolbar/toolbar-button/index.js.map +1 -1
  116. package/build/toolbar/toolbar-button/toolbar-button-container.js +1 -0
  117. package/build/toolbar/toolbar-button/toolbar-button-container.js.map +1 -1
  118. package/build/toolbar/toolbar-context/index.js +2 -0
  119. package/build/toolbar/toolbar-context/index.js.map +1 -1
  120. package/build/toolbar/toolbar-dropdown-menu/index.js +2 -0
  121. package/build/toolbar/toolbar-dropdown-menu/index.js.map +1 -1
  122. package/build/toolbar/toolbar-group/index.js +2 -0
  123. package/build/toolbar/toolbar-group/index.js.map +1 -1
  124. package/build/toolbar/toolbar-group/toolbar-group-collapsed.js +2 -0
  125. package/build/toolbar/toolbar-group/toolbar-group-collapsed.js.map +1 -1
  126. package/build/toolbar/toolbar-group/toolbar-group-container.js +1 -0
  127. package/build/toolbar/toolbar-group/toolbar-group-container.js.map +1 -1
  128. package/build/toolbar/toolbar-item/index.js +2 -0
  129. package/build/toolbar/toolbar-item/index.js.map +1 -1
  130. package/build/tools-panel/context.js +2 -0
  131. package/build/tools-panel/context.js.map +1 -1
  132. package/build/tools-panel/tools-panel/component.js +61 -5
  133. package/build/tools-panel/tools-panel/component.js.map +1 -1
  134. package/build/tools-panel/tools-panel/hook.js +22 -14
  135. package/build/tools-panel/tools-panel/hook.js.map +1 -1
  136. package/build/tools-panel/tools-panel-header/component.js +2 -1
  137. package/build/tools-panel/tools-panel-header/component.js.map +1 -1
  138. package/build/tools-panel/tools-panel-header/hook.js +2 -0
  139. package/build/tools-panel/tools-panel-header/hook.js.map +1 -1
  140. package/build/tools-panel/tools-panel-item/component.js +5 -4
  141. package/build/tools-panel/tools-panel-item/component.js.map +1 -1
  142. package/build/tools-panel/tools-panel-item/hook.js +18 -4
  143. package/build/tools-panel/tools-panel-item/hook.js.map +1 -1
  144. package/build/tree-grid/cell.js +15 -4
  145. package/build/tree-grid/cell.js.map +1 -1
  146. package/build/tree-grid/index.js +81 -19
  147. package/build/tree-grid/index.js.map +1 -1
  148. package/build/tree-grid/item.js +14 -3
  149. package/build/tree-grid/item.js.map +1 -1
  150. package/build/tree-grid/roving-tab-index-context.js +1 -1
  151. package/build/tree-grid/roving-tab-index-context.js.map +1 -1
  152. package/build/tree-grid/roving-tab-index-item.js +13 -6
  153. package/build/tree-grid/roving-tab-index-item.js.map +1 -1
  154. package/build/tree-grid/roving-tab-index.js +0 -3
  155. package/build/tree-grid/roving-tab-index.js.map +1 -1
  156. package/build/tree-grid/row.js +20 -18
  157. package/build/tree-grid/row.js.map +1 -1
  158. package/build/tree-grid/types.js +6 -0
  159. package/build/tree-grid/types.js.map +1 -0
  160. package/build/ui/context/context-connect.js +7 -7
  161. package/build/ui/context/context-connect.js.map +1 -1
  162. package/build/ui/context/context-system-provider.js +8 -4
  163. package/build/ui/context/context-system-provider.js.map +1 -1
  164. package/build/ui/context/get-styled-class-name-from-key.js +1 -1
  165. package/build/ui/context/get-styled-class-name-from-key.js.map +1 -1
  166. package/build/ui/utils/get-valid-children.js +1 -1
  167. package/build/ui/utils/get-valid-children.js.map +1 -1
  168. package/build/ui/utils/space.js +1 -1
  169. package/build/ui/utils/space.js.map +1 -1
  170. package/build/unit-control/index.js +2 -2
  171. package/build/unit-control/index.js.map +1 -1
  172. package/build/unit-control/utils.js +20 -20
  173. package/build/unit-control/utils.js.map +1 -1
  174. package/build/utils/events.js +4 -4
  175. package/build/utils/events.js.map +1 -1
  176. package/build/utils/hooks/use-controlled-state.js +2 -2
  177. package/build/utils/hooks/use-controlled-state.js.map +1 -1
  178. package/build/utils/hooks/use-controlled-value.js +4 -4
  179. package/build/utils/hooks/use-controlled-value.js.map +1 -1
  180. package/build/utils/hooks/use-latest-ref.js +1 -1
  181. package/build/utils/hooks/use-latest-ref.js.map +1 -1
  182. package/build/utils/unit-values.js +3 -3
  183. package/build/utils/unit-values.js.map +1 -1
  184. package/build-module/alignment-matrix-control/utils.js +4 -4
  185. package/build-module/alignment-matrix-control/utils.js.map +1 -1
  186. package/build-module/angle-picker-control/angle-circle.js +37 -29
  187. package/build-module/angle-picker-control/angle-circle.js.map +1 -1
  188. package/build-module/angle-picker-control/index.js +42 -8
  189. package/build-module/angle-picker-control/index.js.map +1 -1
  190. package/build-module/angle-picker-control/styles/angle-picker-control-styles.js +13 -13
  191. package/build-module/angle-picker-control/styles/angle-picker-control-styles.js.map +1 -1
  192. package/build-module/autocomplete/autocompleter-ui.js +40 -19
  193. package/build-module/autocomplete/autocompleter-ui.js.map +1 -1
  194. package/build-module/autocomplete/autocompleter-ui.native.js +1 -0
  195. package/build-module/autocomplete/autocompleter-ui.native.js.map +1 -1
  196. package/build-module/autocomplete/index.js +30 -32
  197. package/build-module/autocomplete/index.js.map +1 -1
  198. package/build-module/base-control/hooks.js +1 -1
  199. package/build-module/base-control/hooks.js.map +1 -1
  200. package/build-module/border-box-control/utils.js +1 -1
  201. package/build-module/border-box-control/utils.js.map +1 -1
  202. package/build-module/box-control/all-input-control.js +2 -2
  203. package/build-module/box-control/all-input-control.js.map +1 -1
  204. package/build-module/box-control/axial-input-controls.js +1 -1
  205. package/build-module/box-control/axial-input-controls.js.map +1 -1
  206. package/build-module/box-control/icon.js.map +1 -1
  207. package/build-module/box-control/index.js +31 -3
  208. package/build-module/box-control/index.js.map +1 -1
  209. package/build-module/box-control/input-controls.js +5 -5
  210. package/build-module/box-control/input-controls.js.map +1 -1
  211. package/build-module/box-control/linked-button.js.map +1 -1
  212. package/build-module/box-control/styles/box-control-icon-styles.js +28 -28
  213. package/build-module/box-control/styles/box-control-icon-styles.js.map +1 -1
  214. package/build-module/box-control/styles/box-control-styles.js +23 -23
  215. package/build-module/box-control/styles/box-control-styles.js.map +1 -1
  216. package/build-module/box-control/styles/box-control-visualizer-styles.js +19 -19
  217. package/build-module/box-control/styles/box-control-visualizer-styles.js.map +1 -1
  218. package/build-module/box-control/types.js +2 -0
  219. package/build-module/box-control/unit-control.js.map +1 -1
  220. package/build-module/box-control/utils.js +23 -23
  221. package/build-module/box-control/utils.js.map +1 -1
  222. package/build-module/circular-option-picker/index.js +59 -16
  223. package/build-module/circular-option-picker/index.js.map +1 -1
  224. package/build-module/circular-option-picker/types.js +2 -0
  225. package/build-module/color-palette/index.js +8 -3
  226. package/build-module/color-palette/index.js.map +1 -1
  227. package/build-module/combobox-control/index.js +68 -12
  228. package/build-module/combobox-control/index.js.map +1 -1
  229. package/build-module/combobox-control/styles.js +2 -2
  230. package/build-module/combobox-control/styles.js.map +1 -1
  231. package/build-module/combobox-control/types.js +2 -0
  232. package/build-module/custom-gradient-picker/index.js +0 -1
  233. package/build-module/custom-gradient-picker/index.js.map +1 -1
  234. package/build-module/date-time/time/index.js +1 -1
  235. package/build-module/date-time/time/index.js.map +1 -1
  236. package/build-module/date-time/utils.js +1 -1
  237. package/build-module/date-time/utils.js.map +1 -1
  238. package/build-module/draggable/index.js +2 -2
  239. package/build-module/draggable/index.js.map +1 -1
  240. package/build-module/focal-point-picker/utils.js +3 -3
  241. package/build-module/focal-point-picker/utils.js.map +1 -1
  242. package/build-module/font-size-picker/utils.js +2 -2
  243. package/build-module/font-size-picker/utils.js.map +1 -1
  244. package/build-module/gradient-picker/index.js +9 -4
  245. package/build-module/gradient-picker/index.js.map +1 -1
  246. package/build-module/higher-order/with-constrained-tabbing/index.js +9 -0
  247. package/build-module/higher-order/with-constrained-tabbing/index.js.map +1 -1
  248. package/build-module/input-control/reducer/reducer.js +5 -5
  249. package/build-module/input-control/reducer/reducer.js.map +1 -1
  250. package/build-module/input-control/utils.js +1 -1
  251. package/build-module/input-control/utils.js.map +1 -1
  252. package/build-module/menu-items-choice/index.js +40 -4
  253. package/build-module/menu-items-choice/index.js.map +1 -1
  254. package/build-module/menu-items-choice/types.js +2 -0
  255. package/build-module/menu-items-choice/types.js.map +1 -0
  256. package/build-module/mobile/global-styles-context/utils.native.js +2 -1
  257. package/build-module/mobile/global-styles-context/utils.native.js.map +1 -1
  258. package/build-module/modal/index.js +41 -4
  259. package/build-module/modal/index.js.map +1 -1
  260. package/build-module/palette-edit/index.js +4 -1
  261. package/build-module/palette-edit/index.js.map +1 -1
  262. package/build-module/panel/header.js +9 -0
  263. package/build-module/panel/header.js.map +1 -1
  264. package/build-module/panel/index.js +20 -2
  265. package/build-module/panel/index.js.map +1 -1
  266. package/build-module/panel/row.js +9 -3
  267. package/build-module/panel/row.js.map +1 -1
  268. package/build-module/panel/types.js +2 -0
  269. package/build-module/panel/types.js.map +1 -0
  270. package/build-module/popover/index.js +14 -4
  271. package/build-module/popover/index.js.map +1 -1
  272. package/build-module/popover/overlay-middlewares.js +38 -0
  273. package/build-module/popover/overlay-middlewares.js.map +1 -0
  274. package/build-module/popover/utils.js +41 -5
  275. package/build-module/popover/utils.js.map +1 -1
  276. package/build-module/query-controls/terms.js +1 -1
  277. package/build-module/query-controls/terms.js.map +1 -1
  278. package/build-module/range-control/utils.js +4 -4
  279. package/build-module/range-control/utils.js.map +1 -1
  280. package/build-module/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js +12 -12
  281. package/build-module/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js.map +1 -1
  282. package/build-module/resizable-box/resize-tooltip/utils.js +14 -14
  283. package/build-module/resizable-box/resize-tooltip/utils.js.map +1 -1
  284. package/build-module/snackbar/index.js +2 -2
  285. package/build-module/snackbar/index.js.map +1 -1
  286. package/build-module/toolbar/toolbar/index.js +25 -13
  287. package/build-module/toolbar/toolbar/index.js.map +1 -1
  288. package/build-module/toolbar/toolbar/toolbar-container.js +4 -3
  289. package/build-module/toolbar/toolbar/toolbar-container.js.map +1 -1
  290. package/build-module/toolbar/toolbar/types.js +2 -0
  291. package/build-module/toolbar/toolbar/types.js.map +1 -0
  292. package/build-module/toolbar/toolbar-button/index.js +1 -0
  293. package/build-module/toolbar/toolbar-button/index.js.map +1 -1
  294. package/build-module/toolbar/toolbar-button/toolbar-button-container.js +1 -0
  295. package/build-module/toolbar/toolbar-button/toolbar-button-container.js.map +1 -1
  296. package/build-module/toolbar/toolbar-context/index.js +2 -0
  297. package/build-module/toolbar/toolbar-context/index.js.map +1 -1
  298. package/build-module/toolbar/toolbar-dropdown-menu/index.js +1 -0
  299. package/build-module/toolbar/toolbar-dropdown-menu/index.js.map +1 -1
  300. package/build-module/toolbar/toolbar-group/index.js +1 -0
  301. package/build-module/toolbar/toolbar-group/index.js.map +1 -1
  302. package/build-module/toolbar/toolbar-group/toolbar-group-collapsed.js +1 -0
  303. package/build-module/toolbar/toolbar-group/toolbar-group-collapsed.js.map +1 -1
  304. package/build-module/toolbar/toolbar-group/toolbar-group-container.js +1 -0
  305. package/build-module/toolbar/toolbar-group/toolbar-group-container.js.map +1 -1
  306. package/build-module/toolbar/toolbar-item/index.js +1 -0
  307. package/build-module/toolbar/toolbar-item/index.js.map +1 -1
  308. package/build-module/tools-panel/context.js +2 -0
  309. package/build-module/tools-panel/context.js.map +1 -1
  310. package/build-module/tools-panel/tools-panel/component.js +59 -4
  311. package/build-module/tools-panel/tools-panel/component.js.map +1 -1
  312. package/build-module/tools-panel/tools-panel/hook.js +22 -14
  313. package/build-module/tools-panel/tools-panel/hook.js.map +1 -1
  314. package/build-module/tools-panel/tools-panel-header/component.js +2 -1
  315. package/build-module/tools-panel/tools-panel-header/component.js.map +1 -1
  316. package/build-module/tools-panel/tools-panel-header/hook.js +2 -0
  317. package/build-module/tools-panel/tools-panel-header/hook.js.map +1 -1
  318. package/build-module/tools-panel/tools-panel-item/component.js +3 -3
  319. package/build-module/tools-panel/tools-panel-item/component.js.map +1 -1
  320. package/build-module/tools-panel/tools-panel-item/hook.js +19 -4
  321. package/build-module/tools-panel/tools-panel-item/hook.js.map +1 -1
  322. package/build-module/tree-grid/cell.js +16 -4
  323. package/build-module/tree-grid/cell.js.map +1 -1
  324. package/build-module/tree-grid/index.js +81 -21
  325. package/build-module/tree-grid/index.js.map +1 -1
  326. package/build-module/tree-grid/item.js +14 -2
  327. package/build-module/tree-grid/item.js.map +1 -1
  328. package/build-module/tree-grid/roving-tab-index-context.js +1 -1
  329. package/build-module/tree-grid/roving-tab-index-context.js.map +1 -1
  330. package/build-module/tree-grid/roving-tab-index-item.js +11 -4
  331. package/build-module/tree-grid/roving-tab-index-item.js.map +1 -1
  332. package/build-module/tree-grid/roving-tab-index.js +0 -3
  333. package/build-module/tree-grid/roving-tab-index.js.map +1 -1
  334. package/build-module/tree-grid/row.js +22 -17
  335. package/build-module/tree-grid/row.js.map +1 -1
  336. package/build-module/tree-grid/types.js +2 -0
  337. package/build-module/tree-grid/types.js.map +1 -0
  338. package/build-module/ui/context/context-connect.js +7 -7
  339. package/build-module/ui/context/context-connect.js.map +1 -1
  340. package/build-module/ui/context/context-system-provider.js +7 -4
  341. package/build-module/ui/context/context-system-provider.js.map +1 -1
  342. package/build-module/ui/context/get-styled-class-name-from-key.js +1 -1
  343. package/build-module/ui/context/get-styled-class-name-from-key.js.map +1 -1
  344. package/build-module/ui/utils/get-valid-children.js +1 -1
  345. package/build-module/ui/utils/get-valid-children.js.map +1 -1
  346. package/build-module/ui/utils/space.js +1 -1
  347. package/build-module/ui/utils/space.js.map +1 -1
  348. package/build-module/unit-control/index.js +2 -2
  349. package/build-module/unit-control/index.js.map +1 -1
  350. package/build-module/unit-control/utils.js +20 -20
  351. package/build-module/unit-control/utils.js.map +1 -1
  352. package/build-module/utils/events.js +4 -4
  353. package/build-module/utils/events.js.map +1 -1
  354. package/build-module/utils/hooks/use-controlled-state.js +2 -2
  355. package/build-module/utils/hooks/use-controlled-state.js.map +1 -1
  356. package/build-module/utils/hooks/use-controlled-value.js +4 -4
  357. package/build-module/utils/hooks/use-controlled-value.js.map +1 -1
  358. package/build-module/utils/hooks/use-latest-ref.js +1 -1
  359. package/build-module/utils/hooks/use-latest-ref.js.map +1 -1
  360. package/build-module/utils/unit-values.js +3 -3
  361. package/build-module/utils/unit-values.js.map +1 -1
  362. package/build-style/style-rtl.css +5 -0
  363. package/build-style/style.css +5 -0
  364. package/build-types/alignment-matrix-control/utils.d.ts +4 -4
  365. package/build-types/angle-picker-control/angle-circle.d.ts +6 -0
  366. package/build-types/angle-picker-control/angle-circle.d.ts.map +1 -0
  367. package/build-types/angle-picker-control/index.d.ts +29 -0
  368. package/build-types/angle-picker-control/index.d.ts.map +1 -0
  369. package/build-types/angle-picker-control/stories/index.d.ts +15 -0
  370. package/build-types/angle-picker-control/stories/index.d.ts.map +1 -0
  371. package/build-types/angle-picker-control/styles/angle-picker-control-styles.d.ts +20 -0
  372. package/build-types/angle-picker-control/styles/angle-picker-control-styles.d.ts.map +1 -0
  373. package/build-types/angle-picker-control/types.d.ts +26 -0
  374. package/build-types/angle-picker-control/types.d.ts.map +1 -0
  375. package/build-types/base-control/hooks.d.ts +1 -1
  376. package/build-types/border-box-control/border-box-control/component.d.ts +1 -1
  377. package/build-types/border-box-control/border-box-control/hook.d.ts +1 -1
  378. package/build-types/border-box-control/border-box-control-split-controls/component.d.ts +1 -1
  379. package/build-types/border-box-control/border-box-control-split-controls/hook.d.ts +1 -1
  380. package/build-types/border-box-control/stories/index.d.ts +1 -1
  381. package/build-types/border-box-control/test/index.d.ts.map +1 -0
  382. package/build-types/border-box-control/test/utils.d.ts +2 -0
  383. package/build-types/border-box-control/test/utils.d.ts.map +1 -0
  384. package/build-types/box-control/all-input-control.d.ts +4 -0
  385. package/build-types/box-control/all-input-control.d.ts.map +1 -0
  386. package/build-types/box-control/axial-input-controls.d.ts +4 -0
  387. package/build-types/box-control/axial-input-controls.d.ts.map +1 -0
  388. package/build-types/box-control/icon.d.ts +8 -0
  389. package/build-types/box-control/icon.d.ts.map +1 -0
  390. package/build-types/box-control/index.d.ts +31 -0
  391. package/build-types/box-control/index.d.ts.map +1 -0
  392. package/build-types/box-control/input-controls.d.ts +4 -0
  393. package/build-types/box-control/input-controls.d.ts.map +1 -0
  394. package/build-types/box-control/linked-button.d.ts +9 -0
  395. package/build-types/box-control/linked-button.d.ts.map +1 -0
  396. package/build-types/box-control/styles/box-control-icon-styles.d.ts +42 -0
  397. package/build-types/box-control/styles/box-control-icon-styles.d.ts.map +1 -0
  398. package/build-types/box-control/styles/box-control-styles.d.ts +42 -0
  399. package/build-types/box-control/styles/box-control-styles.d.ts.map +1 -0
  400. package/build-types/box-control/styles/box-control-visualizer-styles.d.ts +46 -0
  401. package/build-types/box-control/styles/box-control-visualizer-styles.d.ts.map +1 -0
  402. package/build-types/box-control/test/index.d.ts +2 -0
  403. package/build-types/box-control/test/index.d.ts.map +1 -0
  404. package/build-types/box-control/types.d.ts +99 -0
  405. package/build-types/box-control/types.d.ts.map +1 -0
  406. package/build-types/box-control/unit-control.d.ts +4 -0
  407. package/build-types/box-control/unit-control.d.ts.map +1 -0
  408. package/build-types/box-control/utils.d.ts +84 -0
  409. package/build-types/box-control/utils.d.ts.map +1 -0
  410. package/build-types/circular-option-picker/index.d.ts +56 -7
  411. package/build-types/circular-option-picker/index.d.ts.map +1 -1
  412. package/build-types/circular-option-picker/stories/index.d.ts +14 -0
  413. package/build-types/circular-option-picker/stories/index.d.ts.map +1 -0
  414. package/build-types/circular-option-picker/types.d.ts +49 -0
  415. package/build-types/circular-option-picker/types.d.ts.map +1 -0
  416. package/build-types/color-palette/index.d.ts +3 -1
  417. package/build-types/color-palette/index.d.ts.map +1 -1
  418. package/build-types/color-palette/stories/index.d.ts +6 -2
  419. package/build-types/color-palette/stories/index.d.ts.map +1 -1
  420. package/build-types/color-palette/types.d.ts +8 -0
  421. package/build-types/color-palette/types.d.ts.map +1 -1
  422. package/build-types/combobox-control/index.d.ts +51 -0
  423. package/build-types/combobox-control/index.d.ts.map +1 -0
  424. package/build-types/combobox-control/stories/index.d.ts +18 -0
  425. package/build-types/combobox-control/stories/index.d.ts.map +1 -0
  426. package/build-types/combobox-control/styles.d.ts +8 -0
  427. package/build-types/combobox-control/styles.d.ts.map +1 -0
  428. package/build-types/combobox-control/test/index.d.ts +2 -0
  429. package/build-types/combobox-control/test/index.d.ts.map +1 -0
  430. package/build-types/combobox-control/types.d.ts +62 -0
  431. package/build-types/combobox-control/types.d.ts.map +1 -0
  432. package/build-types/date-time/utils.d.ts +1 -1
  433. package/build-types/focal-point-picker/styles/focal-point-picker-style.d.ts +1 -1
  434. package/build-types/focal-point-picker/utils.d.ts +3 -3
  435. package/build-types/font-size-picker/utils.d.ts +2 -2
  436. package/build-types/h-stack/stories/e2e/index.d.ts +9 -0
  437. package/build-types/h-stack/stories/e2e/index.d.ts.map +1 -0
  438. package/build-types/higher-order/with-constrained-tabbing/index.d.ts +10 -1
  439. package/build-types/higher-order/with-constrained-tabbing/index.d.ts.map +1 -1
  440. package/build-types/input-control/reducer/reducer.d.ts +3 -3
  441. package/build-types/input-control/utils.d.ts +1 -1
  442. package/build-types/menu-items-choice/index.d.ts +38 -0
  443. package/build-types/menu-items-choice/index.d.ts.map +1 -0
  444. package/build-types/menu-items-choice/stories/index.d.ts +12 -0
  445. package/build-types/menu-items-choice/stories/index.d.ts.map +1 -0
  446. package/build-types/menu-items-choice/types.d.ts +53 -0
  447. package/build-types/menu-items-choice/types.d.ts.map +1 -0
  448. package/build-types/modal/index.d.ts.map +1 -1
  449. package/build-types/modal/types.d.ts +2 -0
  450. package/build-types/modal/types.d.ts.map +1 -1
  451. package/build-types/panel/header.d.ts +13 -0
  452. package/build-types/panel/header.d.ts.map +1 -0
  453. package/build-types/panel/index.d.ts +21 -0
  454. package/build-types/panel/index.d.ts.map +1 -0
  455. package/build-types/panel/row.d.ts +12 -0
  456. package/build-types/panel/row.d.ts.map +1 -0
  457. package/build-types/panel/test/header.d.ts +2 -0
  458. package/build-types/panel/test/header.d.ts.map +1 -0
  459. package/build-types/panel/test/index.d.ts +2 -0
  460. package/build-types/{base-field → panel}/test/index.d.ts.map +1 -1
  461. package/build-types/panel/test/row.d.ts +2 -0
  462. package/build-types/panel/test/row.d.ts.map +1 -0
  463. package/build-types/panel/types.d.ts +38 -0
  464. package/build-types/panel/types.d.ts.map +1 -0
  465. package/build-types/popover/index.d.ts.map +1 -1
  466. package/build-types/popover/overlay-middlewares.d.ts +9 -0
  467. package/build-types/popover/overlay-middlewares.d.ts.map +1 -0
  468. package/build-types/popover/stories/index.d.ts.map +1 -1
  469. package/build-types/popover/types.d.ts +3 -2
  470. package/build-types/popover/types.d.ts.map +1 -1
  471. package/build-types/popover/utils.d.ts +12 -4
  472. package/build-types/popover/utils.d.ts.map +1 -1
  473. package/build-types/query-controls/terms.d.ts +1 -1
  474. package/build-types/range-control/utils.d.ts +4 -4
  475. package/build-types/resizable-box/resize-tooltip/styles/resize-tooltip.styles.d.ts +5 -4
  476. package/build-types/resizable-box/resize-tooltip/styles/resize-tooltip.styles.d.ts.map +1 -1
  477. package/build-types/resizable-box/resize-tooltip/utils.d.ts +6 -6
  478. package/build-types/tab-panel/stories/index.d.ts +1 -0
  479. package/build-types/tab-panel/stories/index.d.ts.map +1 -1
  480. package/build-types/toolbar/index.d.ts +7 -0
  481. package/build-types/toolbar/index.d.ts.map +1 -0
  482. package/build-types/toolbar/stories/index.d.ts +14 -0
  483. package/build-types/toolbar/stories/index.d.ts.map +1 -0
  484. package/build-types/toolbar/test/index.d.ts +2 -0
  485. package/build-types/toolbar/test/index.d.ts.map +1 -0
  486. package/build-types/toolbar/test/toolbar-group.d.ts +2 -0
  487. package/build-types/toolbar/test/toolbar-group.d.ts.map +1 -0
  488. package/build-types/toolbar/toolbar/index.d.ts +25 -0
  489. package/build-types/toolbar/toolbar/index.d.ts.map +1 -0
  490. package/build-types/toolbar/toolbar/toolbar-container.d.ts +5 -0
  491. package/build-types/toolbar/toolbar/toolbar-container.d.ts.map +1 -0
  492. package/build-types/toolbar/toolbar/types.d.ts +15 -0
  493. package/build-types/toolbar/toolbar/types.d.ts.map +1 -0
  494. package/build-types/toolbar/toolbar-button/index.d.ts +12 -0
  495. package/build-types/toolbar/toolbar-button/index.d.ts.map +1 -0
  496. package/build-types/toolbar/toolbar-button/toolbar-button-container.d.ts +3 -0
  497. package/build-types/toolbar/toolbar-button/toolbar-button-container.d.ts.map +1 -0
  498. package/build-types/toolbar/toolbar-context/index.d.ts +3 -0
  499. package/build-types/toolbar/toolbar-context/index.d.ts.map +1 -0
  500. package/build-types/toolbar/toolbar-dropdown-menu/index.d.ts +3 -0
  501. package/build-types/toolbar/toolbar-dropdown-menu/index.d.ts.map +1 -0
  502. package/build-types/toolbar/toolbar-group/index.d.ts +39 -0
  503. package/build-types/toolbar/toolbar-group/index.d.ts.map +1 -0
  504. package/build-types/toolbar/toolbar-group/toolbar-group-collapsed.d.ts +7 -0
  505. package/build-types/toolbar/toolbar-group/toolbar-group-collapsed.d.ts.map +1 -0
  506. package/build-types/toolbar/toolbar-group/toolbar-group-container.d.ts +7 -0
  507. package/build-types/toolbar/toolbar-group/toolbar-group-container.d.ts.map +1 -0
  508. package/build-types/toolbar/toolbar-item/index.d.ts +7 -0
  509. package/build-types/toolbar/toolbar-item/index.d.ts.map +1 -0
  510. package/build-types/tools-panel/context.d.ts.map +1 -1
  511. package/build-types/tools-panel/stories/index.d.ts +17 -0
  512. package/build-types/tools-panel/stories/index.d.ts.map +1 -0
  513. package/build-types/tools-panel/test/index.d.ts +2 -0
  514. package/build-types/tools-panel/test/index.d.ts.map +1 -0
  515. package/build-types/tools-panel/tools-panel/component.d.ts +54 -2
  516. package/build-types/tools-panel/tools-panel/component.d.ts.map +1 -1
  517. package/build-types/tools-panel/tools-panel/hook.d.ts +5 -2
  518. package/build-types/tools-panel/tools-panel/hook.d.ts.map +1 -1
  519. package/build-types/tools-panel/tools-panel-header/component.d.ts.map +1 -1
  520. package/build-types/tools-panel/tools-panel-header/hook.d.ts +2 -1
  521. package/build-types/tools-panel/tools-panel-header/hook.d.ts.map +1 -1
  522. package/build-types/tools-panel/tools-panel-item/component.d.ts +3 -2
  523. package/build-types/tools-panel/tools-panel-item/component.d.ts.map +1 -1
  524. package/build-types/tools-panel/tools-panel-item/hook.d.ts.map +1 -1
  525. package/build-types/tools-panel/types.d.ts +49 -20
  526. package/build-types/tools-panel/types.d.ts.map +1 -1
  527. package/build-types/tree-grid/cell.d.ts +13 -0
  528. package/build-types/tree-grid/cell.d.ts.map +1 -0
  529. package/build-types/tree-grid/index.d.ts +70 -0
  530. package/build-types/tree-grid/index.d.ts.map +1 -0
  531. package/build-types/tree-grid/item.d.ts +12 -0
  532. package/build-types/tree-grid/item.d.ts.map +1 -0
  533. package/build-types/tree-grid/roving-tab-index-context.d.ts +10 -0
  534. package/build-types/tree-grid/roving-tab-index-context.d.ts.map +1 -0
  535. package/build-types/tree-grid/roving-tab-index-item.d.ts +5 -0
  536. package/build-types/tree-grid/roving-tab-index-item.d.ts.map +1 -0
  537. package/build-types/tree-grid/roving-tab-index.d.ts +10 -0
  538. package/build-types/tree-grid/roving-tab-index.d.ts.map +1 -0
  539. package/build-types/tree-grid/row.d.ts +12 -0
  540. package/build-types/tree-grid/row.d.ts.map +1 -0
  541. package/build-types/tree-grid/stories/index.d.ts +13 -0
  542. package/build-types/tree-grid/stories/index.d.ts.map +1 -0
  543. package/build-types/tree-grid/test/cell.d.ts +2 -0
  544. package/build-types/tree-grid/test/cell.d.ts.map +1 -0
  545. package/build-types/tree-grid/test/index.d.ts +2 -0
  546. package/build-types/tree-grid/test/index.d.ts.map +1 -0
  547. package/build-types/tree-grid/test/roving-tab-index-item.d.ts +2 -0
  548. package/build-types/tree-grid/test/roving-tab-index-item.d.ts.map +1 -0
  549. package/build-types/tree-grid/test/roving-tab-index.d.ts +2 -0
  550. package/build-types/tree-grid/test/roving-tab-index.d.ts.map +1 -0
  551. package/build-types/tree-grid/test/row.d.ts +2 -0
  552. package/build-types/tree-grid/test/row.d.ts.map +1 -0
  553. package/build-types/tree-grid/types.d.ts +109 -0
  554. package/build-types/tree-grid/types.d.ts.map +1 -0
  555. package/build-types/ui/context/context-connect.d.ts +7 -7
  556. package/build-types/ui/context/context-system-provider.d.ts.map +1 -1
  557. package/build-types/ui/context/get-styled-class-name-from-key.d.ts +1 -1
  558. package/build-types/ui/utils/get-valid-children.d.ts +1 -1
  559. package/build-types/ui/utils/space.d.ts +1 -1
  560. package/build-types/unit-control/index.d.ts +1 -1
  561. package/build-types/unit-control/utils.d.ts +20 -20
  562. package/build-types/utils/events.d.ts +2 -2
  563. package/build-types/utils/hooks/use-controlled-state.d.ts +1 -1
  564. package/build-types/utils/hooks/use-controlled-state.d.ts.map +1 -1
  565. package/build-types/utils/hooks/use-controlled-value.d.ts +4 -4
  566. package/build-types/utils/hooks/use-latest-ref.d.ts +1 -1
  567. package/build-types/utils/unit-values.d.ts +3 -3
  568. package/build-types/v-stack/stories/e2e/index.d.ts +9 -0
  569. package/build-types/v-stack/stories/e2e/index.d.ts.map +1 -0
  570. package/package.json +21 -19
  571. package/src/alignment-matrix-control/utils.tsx +4 -4
  572. package/src/angle-picker-control/README.md +17 -14
  573. package/src/angle-picker-control/{angle-circle.js → angle-circle.tsx} +44 -12
  574. package/src/angle-picker-control/{index.js → index.tsx} +54 -10
  575. package/src/angle-picker-control/stories/index.tsx +57 -0
  576. package/src/angle-picker-control/styles/{angle-picker-control-styles.js → angle-picker-control-styles.tsx} +5 -1
  577. package/src/angle-picker-control/types.ts +29 -0
  578. package/src/autocomplete/autocompleter-ui.js +72 -34
  579. package/src/autocomplete/autocompleter-ui.native.js +1 -0
  580. package/src/autocomplete/index.js +36 -36
  581. package/src/base-control/hooks.ts +1 -1
  582. package/src/border-box-control/test/{index.js → index.tsx} +76 -102
  583. package/src/border-box-control/test/{utils.js → utils.ts} +20 -0
  584. package/src/border-box-control/utils.ts +1 -1
  585. package/src/box-control/README.md +17 -26
  586. package/src/box-control/{all-input-control.js → all-input-control.tsx} +10 -6
  587. package/src/box-control/{axial-input-controls.js → axial-input-controls.tsx} +29 -24
  588. package/src/box-control/{icon.js → icon.tsx} +9 -4
  589. package/src/box-control/{index.js → index.tsx} +43 -8
  590. package/src/box-control/{input-controls.js → input-controls.tsx} +26 -16
  591. package/src/box-control/{linked-button.js → linked-button.tsx} +4 -1
  592. package/src/box-control/styles/{box-control-icon-styles.js → box-control-icon-styles.ts} +1 -1
  593. package/src/box-control/styles/{box-control-styles.js → box-control-styles.ts} +10 -2
  594. package/src/box-control/styles/{box-control-visualizer-styles.js → box-control-visualizer-styles.ts} +6 -2
  595. package/src/box-control/test/{index.js → index.tsx} +12 -9
  596. package/src/box-control/types.ts +121 -0
  597. package/src/box-control/{unit-control.js → unit-control.tsx} +9 -2
  598. package/src/box-control/{utils.js → utils.ts} +47 -38
  599. package/src/button/test/index.tsx +38 -30
  600. package/src/circular-option-picker/README.md +141 -0
  601. package/src/circular-option-picker/{index.js → index.tsx} +74 -14
  602. package/src/circular-option-picker/stories/index.tsx +134 -0
  603. package/src/circular-option-picker/types.ts +69 -0
  604. package/src/color-palette/README.md +7 -0
  605. package/src/color-palette/index.tsx +6 -1
  606. package/src/color-palette/test/__snapshots__/index.tsx.snap +1 -1
  607. package/src/color-palette/types.ts +8 -0
  608. package/src/combobox-control/README.md +8 -15
  609. package/src/combobox-control/{index.js → index.tsx} +91 -19
  610. package/src/combobox-control/stories/index.tsx +114 -0
  611. package/src/combobox-control/styles.ts +4 -1
  612. package/src/combobox-control/test/{index.js → index.tsx} +9 -7
  613. package/src/combobox-control/types.ts +69 -0
  614. package/src/custom-gradient-picker/index.js +0 -1
  615. package/src/custom-select-control/stories/index.js +1 -1
  616. package/src/date-time/time/index.tsx +1 -1
  617. package/src/date-time/utils.ts +1 -1
  618. package/src/draggable/index.tsx +2 -2
  619. package/src/dropdown-menu/test/index.js +3 -11
  620. package/src/focal-point-picker/utils.ts +3 -3
  621. package/src/font-size-picker/utils.ts +2 -2
  622. package/src/gradient-picker/README.md +8 -0
  623. package/src/gradient-picker/index.js +6 -1
  624. package/src/h-stack/stories/e2e/index.tsx +36 -0
  625. package/src/higher-order/with-constrained-tabbing/index.tsx +30 -0
  626. package/src/input-control/reducer/reducer.ts +5 -5
  627. package/src/input-control/utils.ts +1 -1
  628. package/src/menu-items-choice/index.tsx +83 -0
  629. package/src/menu-items-choice/stories/index.tsx +79 -0
  630. package/src/menu-items-choice/types.ts +54 -0
  631. package/src/mobile/global-styles-context/utils.native.js +1 -0
  632. package/src/modal/index.tsx +45 -1
  633. package/src/modal/style.scss +8 -0
  634. package/src/modal/types.ts +2 -0
  635. package/src/palette-edit/index.js +4 -1
  636. package/src/panel/README.md +2 -2
  637. package/src/panel/header.tsx +20 -0
  638. package/src/panel/index.tsx +48 -0
  639. package/src/panel/row.tsx +37 -0
  640. package/src/panel/stories/index.js +22 -0
  641. package/src/panel/test/{header.js → header.tsx} +1 -1
  642. package/src/panel/test/{index.js → index.tsx} +6 -4
  643. package/src/panel/test/{row.js → row.tsx} +4 -2
  644. package/src/panel/types.ts +38 -0
  645. package/src/popover/README.md +4 -1
  646. package/src/popover/index.tsx +17 -1
  647. package/src/popover/overlay-middlewares.tsx +29 -0
  648. package/src/popover/stories/index.tsx +7 -1
  649. package/src/popover/test/index.tsx +29 -21
  650. package/src/popover/types.ts +4 -2
  651. package/src/popover/utils.ts +39 -3
  652. package/src/query-controls/terms.ts +1 -1
  653. package/src/range-control/utils.ts +4 -4
  654. package/src/resizable-box/resize-tooltip/utils.ts +14 -14
  655. package/src/snackbar/index.tsx +2 -2
  656. package/src/tab-panel/stories/index.tsx +41 -0
  657. package/src/tab-panel/test/index.tsx +794 -262
  658. package/src/toolbar/stories/{index.js → index.tsx} +39 -26
  659. package/src/toolbar/test/{toolbar-group.js → toolbar-group.tsx} +2 -2
  660. package/src/toolbar/toolbar/README.md +7 -2
  661. package/src/toolbar/toolbar/{index.js → index.tsx} +33 -12
  662. package/src/toolbar/toolbar/{toolbar-container.js → toolbar-container.tsx} +9 -2
  663. package/src/toolbar/toolbar/types.ts +15 -0
  664. package/src/toolbar/toolbar-button/index.js +2 -0
  665. package/src/toolbar/toolbar-button/toolbar-button-container.js +2 -0
  666. package/src/toolbar/toolbar-context/index.js +2 -0
  667. package/src/toolbar/toolbar-dropdown-menu/index.js +2 -0
  668. package/src/toolbar/toolbar-group/index.js +2 -0
  669. package/src/toolbar/toolbar-group/toolbar-group-collapsed.js +2 -0
  670. package/src/toolbar/toolbar-group/toolbar-group-container.js +2 -0
  671. package/src/toolbar/toolbar-item/index.js +2 -0
  672. package/src/tools-panel/context.ts +2 -0
  673. package/src/tools-panel/stories/{index.js → index.tsx} +196 -95
  674. package/src/tools-panel/test/{index.js → index.tsx} +177 -67
  675. package/src/tools-panel/tools-panel/README.md +12 -4
  676. package/src/tools-panel/tools-panel/component.tsx +57 -3
  677. package/src/tools-panel/tools-panel/hook.ts +34 -13
  678. package/src/tools-panel/tools-panel-header/README.md +7 -0
  679. package/src/tools-panel/tools-panel-header/component.tsx +2 -1
  680. package/src/tools-panel/tools-panel-header/hook.ts +6 -4
  681. package/src/tools-panel/tools-panel-item/README.md +6 -4
  682. package/src/tools-panel/tools-panel-item/component.tsx +4 -4
  683. package/src/tools-panel/tools-panel-item/hook.ts +22 -4
  684. package/src/tools-panel/types.ts +51 -20
  685. package/src/tree-grid/README.md +18 -58
  686. package/src/tree-grid/cell.tsx +41 -0
  687. package/src/tree-grid/{index.js → index.tsx} +111 -35
  688. package/src/tree-grid/item.tsx +32 -0
  689. package/src/tree-grid/{roving-tab-index-context.js → roving-tab-index-context.ts} +9 -1
  690. package/src/tree-grid/roving-tab-index-item.tsx +50 -0
  691. package/src/tree-grid/{roving-tab-index.js → roving-tab-index.tsx} +7 -5
  692. package/src/tree-grid/row.tsx +47 -0
  693. package/src/tree-grid/stories/index.tsx +144 -0
  694. package/src/tree-grid/test/__snapshots__/index.tsx.snap +3 -0
  695. package/src/tree-grid/test/{cell.js → cell.tsx} +7 -4
  696. package/src/tree-grid/test/{index.js → index.tsx} +13 -5
  697. package/src/tree-grid/test/{roving-tab-index-item.js → roving-tab-index-item.tsx} +7 -4
  698. package/src/tree-grid/test/{row.js → row.tsx} +4 -4
  699. package/src/tree-grid/types.ts +116 -0
  700. package/src/ui/context/context-connect.ts +7 -7
  701. package/src/ui/context/context-system-provider.js +7 -4
  702. package/src/ui/context/get-styled-class-name-from-key.ts +1 -1
  703. package/src/ui/utils/get-valid-children.ts +1 -1
  704. package/src/ui/utils/space.ts +1 -1
  705. package/src/unit-control/index.tsx +2 -2
  706. package/src/unit-control/utils.ts +20 -20
  707. package/src/utils/events.ts +4 -4
  708. package/src/utils/hooks/use-controlled-state.js +2 -2
  709. package/src/utils/hooks/use-controlled-value.ts +4 -4
  710. package/src/utils/hooks/use-latest-ref.ts +1 -1
  711. package/src/utils/unit-values.ts +3 -3
  712. package/src/v-stack/stories/e2e/index.tsx +36 -0
  713. package/tsconfig.json +1 -7
  714. package/tsconfig.tsbuildinfo +1 -1
  715. package/build/base-field/hook.js +0 -54
  716. package/build/base-field/hook.js.map +0 -1
  717. package/build/base-field/index.js +0 -14
  718. package/build/base-field/index.js.map +0 -1
  719. package/build/base-field/styles.js +0 -33
  720. package/build/base-field/styles.js.map +0 -1
  721. package/build/resizable-box/styles/resizable-box.styles.js +0 -2
  722. package/build-module/base-field/hook.js +0 -37
  723. package/build-module/base-field/hook.js.map +0 -1
  724. package/build-module/base-field/index.js +0 -2
  725. package/build-module/base-field/index.js.map +0 -1
  726. package/build-module/base-field/styles.js +0 -18
  727. package/build-module/base-field/styles.js.map +0 -1
  728. package/build-module/resizable-box/styles/resizable-box.styles.js +0 -2
  729. package/build-types/base-field/hook.d.ts +0 -270
  730. package/build-types/base-field/hook.d.ts.map +0 -1
  731. package/build-types/base-field/index.d.ts +0 -2
  732. package/build-types/base-field/index.d.ts.map +0 -1
  733. package/build-types/base-field/styles.d.ts +0 -6
  734. package/build-types/base-field/styles.d.ts.map +0 -1
  735. package/build-types/base-field/types.d.ts +0 -29
  736. package/build-types/base-field/types.d.ts.map +0 -1
  737. package/build-types/resizable-box/styles/resizable-box.styles.d.ts +0 -1
  738. package/build-types/resizable-box/styles/resizable-box.styles.d.ts.map +0 -1
  739. package/src/angle-picker-control/stories/index.js +0 -29
  740. package/src/base-field/README.md +0 -66
  741. package/src/base-field/hook.ts +0 -51
  742. package/src/base-field/index.ts +0 -1
  743. package/src/base-field/styles.ts +0 -86
  744. package/src/base-field/test/__snapshots__/index.tsx.snap +0 -141
  745. package/src/base-field/test/index.tsx +0 -84
  746. package/src/base-field/types.ts +0 -29
  747. package/src/combobox-control/stories/index.js +0 -339
  748. package/src/higher-order/with-constrained-tabbing/index.js +0 -22
  749. package/src/menu-items-choice/index.js +0 -43
  750. package/src/panel/header.js +0 -10
  751. package/src/panel/index.js +0 -26
  752. package/src/panel/row.js +0 -20
  753. package/src/resizable-box/styles/resizable-box.styles.js +0 -0
  754. package/src/tools-panel/stories/utils/tools-panel-with-item-group-slot.js +0 -246
  755. package/src/tree-grid/cell.js +0 -24
  756. package/src/tree-grid/item.js +0 -20
  757. package/src/tree-grid/roving-tab-index-item.js +0 -33
  758. package/src/tree-grid/row.js +0 -31
  759. package/src/tree-grid/stories/index.js +0 -106
  760. package/src/tree-grid/test/__snapshots__/index.js.snap +0 -3
  761. /package/build/{base-field → angle-picker-control}/types.js +0 -0
  762. /package/build-module/{base-field → angle-picker-control}/types.js +0 -0
  763. /package/build-module/{base-field → angle-picker-control}/types.js.map +0 -0
  764. /package/{build/base-field → build-module/box-control}/types.js.map +0 -0
  765. /package/build-module/{resizable-box/styles/resizable-box.styles.js.map → circular-option-picker/types.js.map} +0 -0
  766. /package/{build/resizable-box/styles/resizable-box.styles.js.map → build-module/combobox-control/types.js.map} +0 -0
  767. /package/build-types/{base-field → border-box-control}/test/index.d.ts +0 -0
  768. /package/src/panel/test/__snapshots__/{header.js.snap → header.tsx.snap} +0 -0
  769. /package/src/panel/test/__snapshots__/{index.js.snap → index.tsx.snap} +0 -0
  770. /package/src/panel/test/__snapshots__/{row.js.snap → row.tsx.snap} +0 -0
  771. /package/src/resizable-box/resize-tooltip/styles/{resize-tooltip.styles.js → resize-tooltip.styles.ts} +0 -0
  772. /package/src/toolbar/test/{index.js → index.tsx} +0 -0
  773. /package/src/tree-grid/test/__snapshots__/{cell.js.snap → cell.tsx.snap} +0 -0
  774. /package/src/tree-grid/test/__snapshots__/{roving-tab-index-item.js.snap → roving-tab-index-item.tsx.snap} +0 -0
  775. /package/src/tree-grid/test/__snapshots__/{roving-tab-index.js.snap → roving-tab-index.tsx.snap} +0 -0
  776. /package/src/tree-grid/test/__snapshots__/{row.js.snap → row.tsx.snap} +0 -0
  777. /package/src/tree-grid/test/{roving-tab-index.js → roving-tab-index.tsx} +0 -0
@@ -21,25 +21,25 @@ const deprecatedBottomMargin = _ref => {
21
21
  let {
22
22
  __nextHasNoMarginBottom
23
23
  } = _ref;
24
- return !__nextHasNoMarginBottom ? /*#__PURE__*/css("margin-bottom:", space(2), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:deprecatedBottomMargin;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYW5nbGUtcGlja2VyLWNvbnRyb2wvc3R5bGVzL2FuZ2xlLXBpY2tlci1jb250cm9sLXN0eWxlcy5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFtQk8iLCJmaWxlIjoiQHdvcmRwcmVzcy9jb21wb25lbnRzL3NyYy9hbmdsZS1waWNrZXItY29udHJvbC9zdHlsZXMvYW5nbGUtcGlja2VyLWNvbnRyb2wtc3R5bGVzLmpzIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBGbGV4IH0gZnJvbSAnLi4vLi4vZmxleCc7XG5pbXBvcnQgeyBDT0xPUlMgfSBmcm9tICcuLi8uLi91dGlscyc7XG5pbXBvcnQgeyBzcGFjZSB9IGZyb20gJy4uLy4uL3VpL3V0aWxzL3NwYWNlJztcbmltcG9ydCBDT05GSUcgZnJvbSAnLi4vLi4vdXRpbHMvY29uZmlnLXZhbHVlcyc7XG5cbmNvbnN0IENJUkNMRV9TSVpFID0gMzI7XG5jb25zdCBJTk5FUl9DSVJDTEVfU0laRSA9IDM7XG5cbmNvbnN0IGRlcHJlY2F0ZWRCb3R0b21NYXJnaW4gPSAoIHsgX19uZXh0SGFzTm9NYXJnaW5Cb3R0b20gfSApID0+IHtcblx0cmV0dXJuICEgX19uZXh0SGFzTm9NYXJnaW5Cb3R0b21cblx0XHQ/IGNzc2Bcblx0XHRcdFx0bWFyZ2luLWJvdHRvbTogJHsgc3BhY2UoIDIgKSB9O1xuXHRcdCAgYFxuXHRcdDogJyc7XG59O1xuXG5leHBvcnQgY29uc3QgUm9vdCA9IHN0eWxlZCggRmxleCApYFxuXHQkeyBkZXByZWNhdGVkQm90dG9tTWFyZ2luIH1cbmA7XG5cbmV4cG9ydCBjb25zdCBDaXJjbGVSb290ID0gc3R5bGVkLmRpdmBcblx0Ym9yZGVyLXJhZGl1czogNTAlO1xuXHRib3JkZXI6ICR7IENPTkZJRy5ib3JkZXJXaWR0aCB9IHNvbGlkICR7IENPTE9SUy51aS5ib3JkZXIgfTtcblx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0Y3Vyc29yOiBncmFiO1xuXHRoZWlnaHQ6ICR7IENJUkNMRV9TSVpFIH1weDtcblx0b3ZlcmZsb3c6IGhpZGRlbjtcblx0d2lkdGg6ICR7IENJUkNMRV9TSVpFIH1weDtcbmA7XG5cbmV4cG9ydCBjb25zdCBDaXJjbGVJbmRpY2F0b3JXcmFwcGVyID0gc3R5bGVkLmRpdmBcblx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0cG9zaXRpb246IHJlbGF0aXZlO1xuXHR3aWR0aDogMTAwJTtcblx0aGVpZ2h0OiAxMDAlO1xuXG5cdDpmb2N1cy12aXNpYmxlIHtcblx0XHRvdXRsaW5lOiBub25lO1xuXHR9XG5gO1xuXG5leHBvcnQgY29uc3QgQ2lyY2xlSW5kaWNhdG9yID0gc3R5bGVkLmRpdmBcblx0YmFja2dyb3VuZDogJHsgQ09MT1JTLnVpLnRoZW1lIH07XG5cdGJvcmRlci1yYWRpdXM6IDUwJTtcblx0Ym9yZGVyOiAkeyBJTk5FUl9DSVJDTEVfU0laRSB9cHggc29saWQgJHsgQ09MT1JTLnVpLnRoZW1lIH07XG5cdGJvdHRvbTogMDtcblx0Ym94LXNpemluZzogYm9yZGVyLWJveDtcblx0ZGlzcGxheTogYmxvY2s7XG5cdGhlaWdodDogMHB4O1xuXHRsZWZ0OiAwO1xuXHRtYXJnaW46IGF1dG87XG5cdHBvc2l0aW9uOiBhYnNvbHV0ZTtcblx0cmlnaHQ6IDA7XG5cdHRvcDogLSR7IENJUkNMRV9TSVpFIC8gMiB9cHg7XG5cdHdpZHRoOiAwcHg7XG5gO1xuIl19 */") : '';
24
+ return !__nextHasNoMarginBottom ? /*#__PURE__*/css("margin-bottom:", space(2), ";" + (process.env.NODE_ENV === "production" ? "" : ";label:deprecatedBottomMargin;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYW5nbGUtcGlja2VyLWNvbnRyb2wvc3R5bGVzL2FuZ2xlLXBpY2tlci1jb250cm9sLXN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBdUJPIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYW5nbGUtcGlja2VyLWNvbnRyb2wvc3R5bGVzL2FuZ2xlLXBpY2tlci1jb250cm9sLXN0eWxlcy50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIEV4dGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5cbi8qKlxuICogSW50ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IEZsZXggfSBmcm9tICcuLi8uLi9mbGV4JztcbmltcG9ydCB7IENPTE9SUyB9IGZyb20gJy4uLy4uL3V0aWxzJztcbmltcG9ydCB7IHNwYWNlIH0gZnJvbSAnLi4vLi4vdWkvdXRpbHMvc3BhY2UnO1xuaW1wb3J0IENPTkZJRyBmcm9tICcuLi8uLi91dGlscy9jb25maWctdmFsdWVzJztcblxuaW1wb3J0IHR5cGUgeyBBbmdsZVBpY2tlckNvbnRyb2xQcm9wcyB9IGZyb20gJy4uL3R5cGVzJztcblxuY29uc3QgQ0lSQ0xFX1NJWkUgPSAzMjtcbmNvbnN0IElOTkVSX0NJUkNMRV9TSVpFID0gMztcblxuY29uc3QgZGVwcmVjYXRlZEJvdHRvbU1hcmdpbiA9ICgge1xuXHRfX25leHRIYXNOb01hcmdpbkJvdHRvbSxcbn06IFBpY2s8IEFuZ2xlUGlja2VyQ29udHJvbFByb3BzLCAnX19uZXh0SGFzTm9NYXJnaW5Cb3R0b20nID4gKSA9PiB7XG5cdHJldHVybiAhIF9fbmV4dEhhc05vTWFyZ2luQm90dG9tXG5cdFx0PyBjc3NgXG5cdFx0XHRcdG1hcmdpbi1ib3R0b206ICR7IHNwYWNlKCAyICkgfTtcblx0XHQgIGBcblx0XHQ6ICcnO1xufTtcblxuZXhwb3J0IGNvbnN0IFJvb3QgPSBzdHlsZWQoIEZsZXggKWBcblx0JHsgZGVwcmVjYXRlZEJvdHRvbU1hcmdpbiB9XG5gO1xuXG5leHBvcnQgY29uc3QgQ2lyY2xlUm9vdCA9IHN0eWxlZC5kaXZgXG5cdGJvcmRlci1yYWRpdXM6IDUwJTtcblx0Ym9yZGVyOiAkeyBDT05GSUcuYm9yZGVyV2lkdGggfSBzb2xpZCAkeyBDT0xPUlMudWkuYm9yZGVyIH07XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGN1cnNvcjogZ3JhYjtcblx0aGVpZ2h0OiAkeyBDSVJDTEVfU0laRSB9cHg7XG5cdG92ZXJmbG93OiBoaWRkZW47XG5cdHdpZHRoOiAkeyBDSVJDTEVfU0laRSB9cHg7XG5gO1xuXG5leHBvcnQgY29uc3QgQ2lyY2xlSW5kaWNhdG9yV3JhcHBlciA9IHN0eWxlZC5kaXZgXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0d2lkdGg6IDEwMCU7XG5cdGhlaWdodDogMTAwJTtcblxuXHQ6Zm9jdXMtdmlzaWJsZSB7XG5cdFx0b3V0bGluZTogbm9uZTtcblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IENpcmNsZUluZGljYXRvciA9IHN0eWxlZC5kaXZgXG5cdGJhY2tncm91bmQ6ICR7IENPTE9SUy51aS50aGVtZSB9O1xuXHRib3JkZXItcmFkaXVzOiA1MCU7XG5cdGJvcmRlcjogJHsgSU5ORVJfQ0lSQ0xFX1NJWkUgfXB4IHNvbGlkICR7IENPTE9SUy51aS50aGVtZSB9O1xuXHRib3R0b206IDA7XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGRpc3BsYXk6IGJsb2NrO1xuXHRoZWlnaHQ6IDBweDtcblx0bGVmdDogMDtcblx0bWFyZ2luOiBhdXRvO1xuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHJpZ2h0OiAwO1xuXHR0b3A6IC0keyBDSVJDTEVfU0laRSAvIDIgfXB4O1xuXHR3aWR0aDogMHB4O1xuYDtcbiJdfQ== */") : '';
25
25
  };
26
26
 
27
27
  export const Root = /*#__PURE__*/_styled(Flex, process.env.NODE_ENV === "production" ? {
28
- target: "e65ony43"
28
+ target: "eln3bjz3"
29
29
  } : {
30
- target: "e65ony43",
30
+ target: "eln3bjz3",
31
31
  label: "Root"
32
- })(deprecatedBottomMargin, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYW5nbGUtcGlja2VyLWNvbnRyb2wvc3R5bGVzL2FuZ2xlLXBpY2tlci1jb250cm9sLXN0eWxlcy5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF5QmtDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYW5nbGUtcGlja2VyLWNvbnRyb2wvc3R5bGVzL2FuZ2xlLXBpY2tlci1jb250cm9sLXN0eWxlcy5qcyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgRmxleCB9IGZyb20gJy4uLy4uL2ZsZXgnO1xuaW1wb3J0IHsgQ09MT1JTIH0gZnJvbSAnLi4vLi4vdXRpbHMnO1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi8uLi91aS91dGlscy9zcGFjZSc7XG5pbXBvcnQgQ09ORklHIGZyb20gJy4uLy4uL3V0aWxzL2NvbmZpZy12YWx1ZXMnO1xuXG5jb25zdCBDSVJDTEVfU0laRSA9IDMyO1xuY29uc3QgSU5ORVJfQ0lSQ0xFX1NJWkUgPSAzO1xuXG5jb25zdCBkZXByZWNhdGVkQm90dG9tTWFyZ2luID0gKCB7IF9fbmV4dEhhc05vTWFyZ2luQm90dG9tIH0gKSA9PiB7XG5cdHJldHVybiAhIF9fbmV4dEhhc05vTWFyZ2luQm90dG9tXG5cdFx0PyBjc3NgXG5cdFx0XHRcdG1hcmdpbi1ib3R0b206ICR7IHNwYWNlKCAyICkgfTtcblx0XHQgIGBcblx0XHQ6ICcnO1xufTtcblxuZXhwb3J0IGNvbnN0IFJvb3QgPSBzdHlsZWQoIEZsZXggKWBcblx0JHsgZGVwcmVjYXRlZEJvdHRvbU1hcmdpbiB9XG5gO1xuXG5leHBvcnQgY29uc3QgQ2lyY2xlUm9vdCA9IHN0eWxlZC5kaXZgXG5cdGJvcmRlci1yYWRpdXM6IDUwJTtcblx0Ym9yZGVyOiAkeyBDT05GSUcuYm9yZGVyV2lkdGggfSBzb2xpZCAkeyBDT0xPUlMudWkuYm9yZGVyIH07XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGN1cnNvcjogZ3JhYjtcblx0aGVpZ2h0OiAkeyBDSVJDTEVfU0laRSB9cHg7XG5cdG92ZXJmbG93OiBoaWRkZW47XG5cdHdpZHRoOiAkeyBDSVJDTEVfU0laRSB9cHg7XG5gO1xuXG5leHBvcnQgY29uc3QgQ2lyY2xlSW5kaWNhdG9yV3JhcHBlciA9IHN0eWxlZC5kaXZgXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0d2lkdGg6IDEwMCU7XG5cdGhlaWdodDogMTAwJTtcblxuXHQ6Zm9jdXMtdmlzaWJsZSB7XG5cdFx0b3V0bGluZTogbm9uZTtcblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IENpcmNsZUluZGljYXRvciA9IHN0eWxlZC5kaXZgXG5cdGJhY2tncm91bmQ6ICR7IENPTE9SUy51aS50aGVtZSB9O1xuXHRib3JkZXItcmFkaXVzOiA1MCU7XG5cdGJvcmRlcjogJHsgSU5ORVJfQ0lSQ0xFX1NJWkUgfXB4IHNvbGlkICR7IENPTE9SUy51aS50aGVtZSB9O1xuXHRib3R0b206IDA7XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGRpc3BsYXk6IGJsb2NrO1xuXHRoZWlnaHQ6IDBweDtcblx0bGVmdDogMDtcblx0bWFyZ2luOiBhdXRvO1xuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHJpZ2h0OiAwO1xuXHR0b3A6IC0keyBDSVJDTEVfU0laRSAvIDIgfXB4O1xuXHR3aWR0aDogMHB4O1xuYDtcbiJdfQ== */"));
32
+ })(deprecatedBottomMargin, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYW5nbGUtcGlja2VyLWNvbnRyb2wvc3R5bGVzL2FuZ2xlLXBpY2tlci1jb250cm9sLXN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBNkJrQyIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2FuZ2xlLXBpY2tlci1jb250cm9sL3N0eWxlcy9hbmdsZS1waWNrZXItY29udHJvbC1zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBGbGV4IH0gZnJvbSAnLi4vLi4vZmxleCc7XG5pbXBvcnQgeyBDT0xPUlMgfSBmcm9tICcuLi8uLi91dGlscyc7XG5pbXBvcnQgeyBzcGFjZSB9IGZyb20gJy4uLy4uL3VpL3V0aWxzL3NwYWNlJztcbmltcG9ydCBDT05GSUcgZnJvbSAnLi4vLi4vdXRpbHMvY29uZmlnLXZhbHVlcyc7XG5cbmltcG9ydCB0eXBlIHsgQW5nbGVQaWNrZXJDb250cm9sUHJvcHMgfSBmcm9tICcuLi90eXBlcyc7XG5cbmNvbnN0IENJUkNMRV9TSVpFID0gMzI7XG5jb25zdCBJTk5FUl9DSVJDTEVfU0laRSA9IDM7XG5cbmNvbnN0IGRlcHJlY2F0ZWRCb3R0b21NYXJnaW4gPSAoIHtcblx0X19uZXh0SGFzTm9NYXJnaW5Cb3R0b20sXG59OiBQaWNrPCBBbmdsZVBpY2tlckNvbnRyb2xQcm9wcywgJ19fbmV4dEhhc05vTWFyZ2luQm90dG9tJyA+ICkgPT4ge1xuXHRyZXR1cm4gISBfX25leHRIYXNOb01hcmdpbkJvdHRvbVxuXHRcdD8gY3NzYFxuXHRcdFx0XHRtYXJnaW4tYm90dG9tOiAkeyBzcGFjZSggMiApIH07XG5cdFx0ICBgXG5cdFx0OiAnJztcbn07XG5cbmV4cG9ydCBjb25zdCBSb290ID0gc3R5bGVkKCBGbGV4IClgXG5cdCR7IGRlcHJlY2F0ZWRCb3R0b21NYXJnaW4gfVxuYDtcblxuZXhwb3J0IGNvbnN0IENpcmNsZVJvb3QgPSBzdHlsZWQuZGl2YFxuXHRib3JkZXItcmFkaXVzOiA1MCU7XG5cdGJvcmRlcjogJHsgQ09ORklHLmJvcmRlcldpZHRoIH0gc29saWQgJHsgQ09MT1JTLnVpLmJvcmRlciB9O1xuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRjdXJzb3I6IGdyYWI7XG5cdGhlaWdodDogJHsgQ0lSQ0xFX1NJWkUgfXB4O1xuXHRvdmVyZmxvdzogaGlkZGVuO1xuXHR3aWR0aDogJHsgQ0lSQ0xFX1NJWkUgfXB4O1xuYDtcblxuZXhwb3J0IGNvbnN0IENpcmNsZUluZGljYXRvcldyYXBwZXIgPSBzdHlsZWQuZGl2YFxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdHdpZHRoOiAxMDAlO1xuXHRoZWlnaHQ6IDEwMCU7XG5cblx0OmZvY3VzLXZpc2libGUge1xuXHRcdG91dGxpbmU6IG5vbmU7XG5cdH1cbmA7XG5cbmV4cG9ydCBjb25zdCBDaXJjbGVJbmRpY2F0b3IgPSBzdHlsZWQuZGl2YFxuXHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMudWkudGhlbWUgfTtcblx0Ym9yZGVyLXJhZGl1czogNTAlO1xuXHRib3JkZXI6ICR7IElOTkVSX0NJUkNMRV9TSVpFIH1weCBzb2xpZCAkeyBDT0xPUlMudWkudGhlbWUgfTtcblx0Ym90dG9tOiAwO1xuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRkaXNwbGF5OiBibG9jaztcblx0aGVpZ2h0OiAwcHg7XG5cdGxlZnQ6IDA7XG5cdG1hcmdpbjogYXV0bztcblx0cG9zaXRpb246IGFic29sdXRlO1xuXHRyaWdodDogMDtcblx0dG9wOiAtJHsgQ0lSQ0xFX1NJWkUgLyAyIH1weDtcblx0d2lkdGg6IDBweDtcbmA7XG4iXX0= */"));
33
33
  export const CircleRoot = _styled("div", process.env.NODE_ENV === "production" ? {
34
- target: "e65ony42"
34
+ target: "eln3bjz2"
35
35
  } : {
36
- target: "e65ony42",
36
+ target: "eln3bjz2",
37
37
  label: "CircleRoot"
38
- })("border-radius:50%;border:", CONFIG.borderWidth, " solid ", COLORS.ui.border, ";box-sizing:border-box;cursor:grab;height:", CIRCLE_SIZE, "px;overflow:hidden;width:", CIRCLE_SIZE, "px;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYW5nbGUtcGlja2VyLWNvbnRyb2wvc3R5bGVzL2FuZ2xlLXBpY2tlci1jb250cm9sLXN0eWxlcy5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE2Qm9DIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYW5nbGUtcGlja2VyLWNvbnRyb2wvc3R5bGVzL2FuZ2xlLXBpY2tlci1jb250cm9sLXN0eWxlcy5qcyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgRmxleCB9IGZyb20gJy4uLy4uL2ZsZXgnO1xuaW1wb3J0IHsgQ09MT1JTIH0gZnJvbSAnLi4vLi4vdXRpbHMnO1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi8uLi91aS91dGlscy9zcGFjZSc7XG5pbXBvcnQgQ09ORklHIGZyb20gJy4uLy4uL3V0aWxzL2NvbmZpZy12YWx1ZXMnO1xuXG5jb25zdCBDSVJDTEVfU0laRSA9IDMyO1xuY29uc3QgSU5ORVJfQ0lSQ0xFX1NJWkUgPSAzO1xuXG5jb25zdCBkZXByZWNhdGVkQm90dG9tTWFyZ2luID0gKCB7IF9fbmV4dEhhc05vTWFyZ2luQm90dG9tIH0gKSA9PiB7XG5cdHJldHVybiAhIF9fbmV4dEhhc05vTWFyZ2luQm90dG9tXG5cdFx0PyBjc3NgXG5cdFx0XHRcdG1hcmdpbi1ib3R0b206ICR7IHNwYWNlKCAyICkgfTtcblx0XHQgIGBcblx0XHQ6ICcnO1xufTtcblxuZXhwb3J0IGNvbnN0IFJvb3QgPSBzdHlsZWQoIEZsZXggKWBcblx0JHsgZGVwcmVjYXRlZEJvdHRvbU1hcmdpbiB9XG5gO1xuXG5leHBvcnQgY29uc3QgQ2lyY2xlUm9vdCA9IHN0eWxlZC5kaXZgXG5cdGJvcmRlci1yYWRpdXM6IDUwJTtcblx0Ym9yZGVyOiAkeyBDT05GSUcuYm9yZGVyV2lkdGggfSBzb2xpZCAkeyBDT0xPUlMudWkuYm9yZGVyIH07XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGN1cnNvcjogZ3JhYjtcblx0aGVpZ2h0OiAkeyBDSVJDTEVfU0laRSB9cHg7XG5cdG92ZXJmbG93OiBoaWRkZW47XG5cdHdpZHRoOiAkeyBDSVJDTEVfU0laRSB9cHg7XG5gO1xuXG5leHBvcnQgY29uc3QgQ2lyY2xlSW5kaWNhdG9yV3JhcHBlciA9IHN0eWxlZC5kaXZgXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0d2lkdGg6IDEwMCU7XG5cdGhlaWdodDogMTAwJTtcblxuXHQ6Zm9jdXMtdmlzaWJsZSB7XG5cdFx0b3V0bGluZTogbm9uZTtcblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IENpcmNsZUluZGljYXRvciA9IHN0eWxlZC5kaXZgXG5cdGJhY2tncm91bmQ6ICR7IENPTE9SUy51aS50aGVtZSB9O1xuXHRib3JkZXItcmFkaXVzOiA1MCU7XG5cdGJvcmRlcjogJHsgSU5ORVJfQ0lSQ0xFX1NJWkUgfXB4IHNvbGlkICR7IENPTE9SUy51aS50aGVtZSB9O1xuXHRib3R0b206IDA7XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGRpc3BsYXk6IGJsb2NrO1xuXHRoZWlnaHQ6IDBweDtcblx0bGVmdDogMDtcblx0bWFyZ2luOiBhdXRvO1xuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHJpZ2h0OiAwO1xuXHR0b3A6IC0keyBDSVJDTEVfU0laRSAvIDIgfXB4O1xuXHR3aWR0aDogMHB4O1xuYDtcbiJdfQ== */"));
38
+ })("border-radius:50%;border:", CONFIG.borderWidth, " solid ", COLORS.ui.border, ";box-sizing:border-box;cursor:grab;height:", CIRCLE_SIZE, "px;overflow:hidden;width:", CIRCLE_SIZE, "px;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYW5nbGUtcGlja2VyLWNvbnRyb2wvc3R5bGVzL2FuZ2xlLXBpY2tlci1jb250cm9sLXN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBaUNvQyIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2FuZ2xlLXBpY2tlci1jb250cm9sL3N0eWxlcy9hbmdsZS1waWNrZXItY29udHJvbC1zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBGbGV4IH0gZnJvbSAnLi4vLi4vZmxleCc7XG5pbXBvcnQgeyBDT0xPUlMgfSBmcm9tICcuLi8uLi91dGlscyc7XG5pbXBvcnQgeyBzcGFjZSB9IGZyb20gJy4uLy4uL3VpL3V0aWxzL3NwYWNlJztcbmltcG9ydCBDT05GSUcgZnJvbSAnLi4vLi4vdXRpbHMvY29uZmlnLXZhbHVlcyc7XG5cbmltcG9ydCB0eXBlIHsgQW5nbGVQaWNrZXJDb250cm9sUHJvcHMgfSBmcm9tICcuLi90eXBlcyc7XG5cbmNvbnN0IENJUkNMRV9TSVpFID0gMzI7XG5jb25zdCBJTk5FUl9DSVJDTEVfU0laRSA9IDM7XG5cbmNvbnN0IGRlcHJlY2F0ZWRCb3R0b21NYXJnaW4gPSAoIHtcblx0X19uZXh0SGFzTm9NYXJnaW5Cb3R0b20sXG59OiBQaWNrPCBBbmdsZVBpY2tlckNvbnRyb2xQcm9wcywgJ19fbmV4dEhhc05vTWFyZ2luQm90dG9tJyA+ICkgPT4ge1xuXHRyZXR1cm4gISBfX25leHRIYXNOb01hcmdpbkJvdHRvbVxuXHRcdD8gY3NzYFxuXHRcdFx0XHRtYXJnaW4tYm90dG9tOiAkeyBzcGFjZSggMiApIH07XG5cdFx0ICBgXG5cdFx0OiAnJztcbn07XG5cbmV4cG9ydCBjb25zdCBSb290ID0gc3R5bGVkKCBGbGV4IClgXG5cdCR7IGRlcHJlY2F0ZWRCb3R0b21NYXJnaW4gfVxuYDtcblxuZXhwb3J0IGNvbnN0IENpcmNsZVJvb3QgPSBzdHlsZWQuZGl2YFxuXHRib3JkZXItcmFkaXVzOiA1MCU7XG5cdGJvcmRlcjogJHsgQ09ORklHLmJvcmRlcldpZHRoIH0gc29saWQgJHsgQ09MT1JTLnVpLmJvcmRlciB9O1xuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRjdXJzb3I6IGdyYWI7XG5cdGhlaWdodDogJHsgQ0lSQ0xFX1NJWkUgfXB4O1xuXHRvdmVyZmxvdzogaGlkZGVuO1xuXHR3aWR0aDogJHsgQ0lSQ0xFX1NJWkUgfXB4O1xuYDtcblxuZXhwb3J0IGNvbnN0IENpcmNsZUluZGljYXRvcldyYXBwZXIgPSBzdHlsZWQuZGl2YFxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdHdpZHRoOiAxMDAlO1xuXHRoZWlnaHQ6IDEwMCU7XG5cblx0OmZvY3VzLXZpc2libGUge1xuXHRcdG91dGxpbmU6IG5vbmU7XG5cdH1cbmA7XG5cbmV4cG9ydCBjb25zdCBDaXJjbGVJbmRpY2F0b3IgPSBzdHlsZWQuZGl2YFxuXHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMudWkudGhlbWUgfTtcblx0Ym9yZGVyLXJhZGl1czogNTAlO1xuXHRib3JkZXI6ICR7IElOTkVSX0NJUkNMRV9TSVpFIH1weCBzb2xpZCAkeyBDT0xPUlMudWkudGhlbWUgfTtcblx0Ym90dG9tOiAwO1xuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRkaXNwbGF5OiBibG9jaztcblx0aGVpZ2h0OiAwcHg7XG5cdGxlZnQ6IDA7XG5cdG1hcmdpbjogYXV0bztcblx0cG9zaXRpb246IGFic29sdXRlO1xuXHRyaWdodDogMDtcblx0dG9wOiAtJHsgQ0lSQ0xFX1NJWkUgLyAyIH1weDtcblx0d2lkdGg6IDBweDtcbmA7XG4iXX0= */"));
39
39
  export const CircleIndicatorWrapper = _styled("div", process.env.NODE_ENV === "production" ? {
40
- target: "e65ony41"
40
+ target: "eln3bjz1"
41
41
  } : {
42
- target: "e65ony41",
42
+ target: "eln3bjz1",
43
43
  label: "CircleIndicatorWrapper"
44
44
  })(process.env.NODE_ENV === "production" ? {
45
45
  name: "1r307gh",
@@ -47,13 +47,13 @@ export const CircleIndicatorWrapper = _styled("div", process.env.NODE_ENV === "p
47
47
  } : {
48
48
  name: "1r307gh",
49
49
  styles: "box-sizing:border-box;position:relative;width:100%;height:100%;:focus-visible{outline:none;}",
50
- map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYW5nbGUtcGlja2VyLWNvbnRyb2wvc3R5bGVzL2FuZ2xlLXBpY2tlci1jb250cm9sLXN0eWxlcy5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUF1Q2dEIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYW5nbGUtcGlja2VyLWNvbnRyb2wvc3R5bGVzL2FuZ2xlLXBpY2tlci1jb250cm9sLXN0eWxlcy5qcyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgRmxleCB9IGZyb20gJy4uLy4uL2ZsZXgnO1xuaW1wb3J0IHsgQ09MT1JTIH0gZnJvbSAnLi4vLi4vdXRpbHMnO1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi8uLi91aS91dGlscy9zcGFjZSc7XG5pbXBvcnQgQ09ORklHIGZyb20gJy4uLy4uL3V0aWxzL2NvbmZpZy12YWx1ZXMnO1xuXG5jb25zdCBDSVJDTEVfU0laRSA9IDMyO1xuY29uc3QgSU5ORVJfQ0lSQ0xFX1NJWkUgPSAzO1xuXG5jb25zdCBkZXByZWNhdGVkQm90dG9tTWFyZ2luID0gKCB7IF9fbmV4dEhhc05vTWFyZ2luQm90dG9tIH0gKSA9PiB7XG5cdHJldHVybiAhIF9fbmV4dEhhc05vTWFyZ2luQm90dG9tXG5cdFx0PyBjc3NgXG5cdFx0XHRcdG1hcmdpbi1ib3R0b206ICR7IHNwYWNlKCAyICkgfTtcblx0XHQgIGBcblx0XHQ6ICcnO1xufTtcblxuZXhwb3J0IGNvbnN0IFJvb3QgPSBzdHlsZWQoIEZsZXggKWBcblx0JHsgZGVwcmVjYXRlZEJvdHRvbU1hcmdpbiB9XG5gO1xuXG5leHBvcnQgY29uc3QgQ2lyY2xlUm9vdCA9IHN0eWxlZC5kaXZgXG5cdGJvcmRlci1yYWRpdXM6IDUwJTtcblx0Ym9yZGVyOiAkeyBDT05GSUcuYm9yZGVyV2lkdGggfSBzb2xpZCAkeyBDT0xPUlMudWkuYm9yZGVyIH07XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGN1cnNvcjogZ3JhYjtcblx0aGVpZ2h0OiAkeyBDSVJDTEVfU0laRSB9cHg7XG5cdG92ZXJmbG93OiBoaWRkZW47XG5cdHdpZHRoOiAkeyBDSVJDTEVfU0laRSB9cHg7XG5gO1xuXG5leHBvcnQgY29uc3QgQ2lyY2xlSW5kaWNhdG9yV3JhcHBlciA9IHN0eWxlZC5kaXZgXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0d2lkdGg6IDEwMCU7XG5cdGhlaWdodDogMTAwJTtcblxuXHQ6Zm9jdXMtdmlzaWJsZSB7XG5cdFx0b3V0bGluZTogbm9uZTtcblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IENpcmNsZUluZGljYXRvciA9IHN0eWxlZC5kaXZgXG5cdGJhY2tncm91bmQ6ICR7IENPTE9SUy51aS50aGVtZSB9O1xuXHRib3JkZXItcmFkaXVzOiA1MCU7XG5cdGJvcmRlcjogJHsgSU5ORVJfQ0lSQ0xFX1NJWkUgfXB4IHNvbGlkICR7IENPTE9SUy51aS50aGVtZSB9O1xuXHRib3R0b206IDA7XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGRpc3BsYXk6IGJsb2NrO1xuXHRoZWlnaHQ6IDBweDtcblx0bGVmdDogMDtcblx0bWFyZ2luOiBhdXRvO1xuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHJpZ2h0OiAwO1xuXHR0b3A6IC0keyBDSVJDTEVfU0laRSAvIDIgfXB4O1xuXHR3aWR0aDogMHB4O1xuYDtcbiJdfQ== */",
50
+ map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYW5nbGUtcGlja2VyLWNvbnRyb2wvc3R5bGVzL2FuZ2xlLXBpY2tlci1jb250cm9sLXN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBMkNnRCIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2FuZ2xlLXBpY2tlci1jb250cm9sL3N0eWxlcy9hbmdsZS1waWNrZXItY29udHJvbC1zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBGbGV4IH0gZnJvbSAnLi4vLi4vZmxleCc7XG5pbXBvcnQgeyBDT0xPUlMgfSBmcm9tICcuLi8uLi91dGlscyc7XG5pbXBvcnQgeyBzcGFjZSB9IGZyb20gJy4uLy4uL3VpL3V0aWxzL3NwYWNlJztcbmltcG9ydCBDT05GSUcgZnJvbSAnLi4vLi4vdXRpbHMvY29uZmlnLXZhbHVlcyc7XG5cbmltcG9ydCB0eXBlIHsgQW5nbGVQaWNrZXJDb250cm9sUHJvcHMgfSBmcm9tICcuLi90eXBlcyc7XG5cbmNvbnN0IENJUkNMRV9TSVpFID0gMzI7XG5jb25zdCBJTk5FUl9DSVJDTEVfU0laRSA9IDM7XG5cbmNvbnN0IGRlcHJlY2F0ZWRCb3R0b21NYXJnaW4gPSAoIHtcblx0X19uZXh0SGFzTm9NYXJnaW5Cb3R0b20sXG59OiBQaWNrPCBBbmdsZVBpY2tlckNvbnRyb2xQcm9wcywgJ19fbmV4dEhhc05vTWFyZ2luQm90dG9tJyA+ICkgPT4ge1xuXHRyZXR1cm4gISBfX25leHRIYXNOb01hcmdpbkJvdHRvbVxuXHRcdD8gY3NzYFxuXHRcdFx0XHRtYXJnaW4tYm90dG9tOiAkeyBzcGFjZSggMiApIH07XG5cdFx0ICBgXG5cdFx0OiAnJztcbn07XG5cbmV4cG9ydCBjb25zdCBSb290ID0gc3R5bGVkKCBGbGV4IClgXG5cdCR7IGRlcHJlY2F0ZWRCb3R0b21NYXJnaW4gfVxuYDtcblxuZXhwb3J0IGNvbnN0IENpcmNsZVJvb3QgPSBzdHlsZWQuZGl2YFxuXHRib3JkZXItcmFkaXVzOiA1MCU7XG5cdGJvcmRlcjogJHsgQ09ORklHLmJvcmRlcldpZHRoIH0gc29saWQgJHsgQ09MT1JTLnVpLmJvcmRlciB9O1xuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRjdXJzb3I6IGdyYWI7XG5cdGhlaWdodDogJHsgQ0lSQ0xFX1NJWkUgfXB4O1xuXHRvdmVyZmxvdzogaGlkZGVuO1xuXHR3aWR0aDogJHsgQ0lSQ0xFX1NJWkUgfXB4O1xuYDtcblxuZXhwb3J0IGNvbnN0IENpcmNsZUluZGljYXRvcldyYXBwZXIgPSBzdHlsZWQuZGl2YFxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdHdpZHRoOiAxMDAlO1xuXHRoZWlnaHQ6IDEwMCU7XG5cblx0OmZvY3VzLXZpc2libGUge1xuXHRcdG91dGxpbmU6IG5vbmU7XG5cdH1cbmA7XG5cbmV4cG9ydCBjb25zdCBDaXJjbGVJbmRpY2F0b3IgPSBzdHlsZWQuZGl2YFxuXHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMudWkudGhlbWUgfTtcblx0Ym9yZGVyLXJhZGl1czogNTAlO1xuXHRib3JkZXI6ICR7IElOTkVSX0NJUkNMRV9TSVpFIH1weCBzb2xpZCAkeyBDT0xPUlMudWkudGhlbWUgfTtcblx0Ym90dG9tOiAwO1xuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRkaXNwbGF5OiBibG9jaztcblx0aGVpZ2h0OiAwcHg7XG5cdGxlZnQ6IDA7XG5cdG1hcmdpbjogYXV0bztcblx0cG9zaXRpb246IGFic29sdXRlO1xuXHRyaWdodDogMDtcblx0dG9wOiAtJHsgQ0lSQ0xFX1NJWkUgLyAyIH1weDtcblx0d2lkdGg6IDBweDtcbmA7XG4iXX0= */",
51
51
  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
52
52
  });
53
53
  export const CircleIndicator = _styled("div", process.env.NODE_ENV === "production" ? {
54
- target: "e65ony40"
54
+ target: "eln3bjz0"
55
55
  } : {
56
- target: "e65ony40",
56
+ target: "eln3bjz0",
57
57
  label: "CircleIndicator"
58
- })("background:", COLORS.ui.theme, ";border-radius:50%;border:", INNER_CIRCLE_SIZE, "px solid ", COLORS.ui.theme, ";bottom:0;box-sizing:border-box;display:block;height:0px;left:0;margin:auto;position:absolute;right:0;top:-", CIRCLE_SIZE / 2, "px;width:0px;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYW5nbGUtcGlja2VyLWNvbnRyb2wvc3R5bGVzL2FuZ2xlLXBpY2tlci1jb250cm9sLXN0eWxlcy5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFrRHlDIiwiZmlsZSI6IkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYW5nbGUtcGlja2VyLWNvbnRyb2wvc3R5bGVzL2FuZ2xlLXBpY2tlci1jb250cm9sLXN0eWxlcy5qcyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogRXh0ZXJuYWwgZGVwZW5kZW5jaWVzXG4gKi9cbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcblxuLyoqXG4gKiBJbnRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgRmxleCB9IGZyb20gJy4uLy4uL2ZsZXgnO1xuaW1wb3J0IHsgQ09MT1JTIH0gZnJvbSAnLi4vLi4vdXRpbHMnO1xuaW1wb3J0IHsgc3BhY2UgfSBmcm9tICcuLi8uLi91aS91dGlscy9zcGFjZSc7XG5pbXBvcnQgQ09ORklHIGZyb20gJy4uLy4uL3V0aWxzL2NvbmZpZy12YWx1ZXMnO1xuXG5jb25zdCBDSVJDTEVfU0laRSA9IDMyO1xuY29uc3QgSU5ORVJfQ0lSQ0xFX1NJWkUgPSAzO1xuXG5jb25zdCBkZXByZWNhdGVkQm90dG9tTWFyZ2luID0gKCB7IF9fbmV4dEhhc05vTWFyZ2luQm90dG9tIH0gKSA9PiB7XG5cdHJldHVybiAhIF9fbmV4dEhhc05vTWFyZ2luQm90dG9tXG5cdFx0PyBjc3NgXG5cdFx0XHRcdG1hcmdpbi1ib3R0b206ICR7IHNwYWNlKCAyICkgfTtcblx0XHQgIGBcblx0XHQ6ICcnO1xufTtcblxuZXhwb3J0IGNvbnN0IFJvb3QgPSBzdHlsZWQoIEZsZXggKWBcblx0JHsgZGVwcmVjYXRlZEJvdHRvbU1hcmdpbiB9XG5gO1xuXG5leHBvcnQgY29uc3QgQ2lyY2xlUm9vdCA9IHN0eWxlZC5kaXZgXG5cdGJvcmRlci1yYWRpdXM6IDUwJTtcblx0Ym9yZGVyOiAkeyBDT05GSUcuYm9yZGVyV2lkdGggfSBzb2xpZCAkeyBDT0xPUlMudWkuYm9yZGVyIH07XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGN1cnNvcjogZ3JhYjtcblx0aGVpZ2h0OiAkeyBDSVJDTEVfU0laRSB9cHg7XG5cdG92ZXJmbG93OiBoaWRkZW47XG5cdHdpZHRoOiAkeyBDSVJDTEVfU0laRSB9cHg7XG5gO1xuXG5leHBvcnQgY29uc3QgQ2lyY2xlSW5kaWNhdG9yV3JhcHBlciA9IHN0eWxlZC5kaXZgXG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdHBvc2l0aW9uOiByZWxhdGl2ZTtcblx0d2lkdGg6IDEwMCU7XG5cdGhlaWdodDogMTAwJTtcblxuXHQ6Zm9jdXMtdmlzaWJsZSB7XG5cdFx0b3V0bGluZTogbm9uZTtcblx0fVxuYDtcblxuZXhwb3J0IGNvbnN0IENpcmNsZUluZGljYXRvciA9IHN0eWxlZC5kaXZgXG5cdGJhY2tncm91bmQ6ICR7IENPTE9SUy51aS50aGVtZSB9O1xuXHRib3JkZXItcmFkaXVzOiA1MCU7XG5cdGJvcmRlcjogJHsgSU5ORVJfQ0lSQ0xFX1NJWkUgfXB4IHNvbGlkICR7IENPTE9SUy51aS50aGVtZSB9O1xuXHRib3R0b206IDA7XG5cdGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG5cdGRpc3BsYXk6IGJsb2NrO1xuXHRoZWlnaHQ6IDBweDtcblx0bGVmdDogMDtcblx0bWFyZ2luOiBhdXRvO1xuXHRwb3NpdGlvbjogYWJzb2x1dGU7XG5cdHJpZ2h0OiAwO1xuXHR0b3A6IC0keyBDSVJDTEVfU0laRSAvIDIgfXB4O1xuXHR3aWR0aDogMHB4O1xuYDtcbiJdfQ== */"));
58
+ })("background:", COLORS.ui.theme, ";border-radius:50%;border:", INNER_CIRCLE_SIZE, "px solid ", COLORS.ui.theme, ";bottom:0;box-sizing:border-box;display:block;height:0px;left:0;margin:auto;position:absolute;right:0;top:-", CIRCLE_SIZE / 2, "px;width:0px;" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkB3b3JkcHJlc3MvY29tcG9uZW50cy9zcmMvYW5nbGUtcGlja2VyLWNvbnRyb2wvc3R5bGVzL2FuZ2xlLXBpY2tlci1jb250cm9sLXN0eWxlcy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBc0R5QyIsImZpbGUiOiJAd29yZHByZXNzL2NvbXBvbmVudHMvc3JjL2FuZ2xlLXBpY2tlci1jb250cm9sL3N0eWxlcy9hbmdsZS1waWNrZXItY29udHJvbC1zdHlsZXMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBFeHRlcm5hbCBkZXBlbmRlbmNpZXNcbiAqL1xuaW1wb3J0IHsgY3NzIH0gZnJvbSAnQGVtb3Rpb24vcmVhY3QnO1xuaW1wb3J0IHN0eWxlZCBmcm9tICdAZW1vdGlvbi9zdHlsZWQnO1xuXG4vKipcbiAqIEludGVybmFsIGRlcGVuZGVuY2llc1xuICovXG5pbXBvcnQgeyBGbGV4IH0gZnJvbSAnLi4vLi4vZmxleCc7XG5pbXBvcnQgeyBDT0xPUlMgfSBmcm9tICcuLi8uLi91dGlscyc7XG5pbXBvcnQgeyBzcGFjZSB9IGZyb20gJy4uLy4uL3VpL3V0aWxzL3NwYWNlJztcbmltcG9ydCBDT05GSUcgZnJvbSAnLi4vLi4vdXRpbHMvY29uZmlnLXZhbHVlcyc7XG5cbmltcG9ydCB0eXBlIHsgQW5nbGVQaWNrZXJDb250cm9sUHJvcHMgfSBmcm9tICcuLi90eXBlcyc7XG5cbmNvbnN0IENJUkNMRV9TSVpFID0gMzI7XG5jb25zdCBJTk5FUl9DSVJDTEVfU0laRSA9IDM7XG5cbmNvbnN0IGRlcHJlY2F0ZWRCb3R0b21NYXJnaW4gPSAoIHtcblx0X19uZXh0SGFzTm9NYXJnaW5Cb3R0b20sXG59OiBQaWNrPCBBbmdsZVBpY2tlckNvbnRyb2xQcm9wcywgJ19fbmV4dEhhc05vTWFyZ2luQm90dG9tJyA+ICkgPT4ge1xuXHRyZXR1cm4gISBfX25leHRIYXNOb01hcmdpbkJvdHRvbVxuXHRcdD8gY3NzYFxuXHRcdFx0XHRtYXJnaW4tYm90dG9tOiAkeyBzcGFjZSggMiApIH07XG5cdFx0ICBgXG5cdFx0OiAnJztcbn07XG5cbmV4cG9ydCBjb25zdCBSb290ID0gc3R5bGVkKCBGbGV4IClgXG5cdCR7IGRlcHJlY2F0ZWRCb3R0b21NYXJnaW4gfVxuYDtcblxuZXhwb3J0IGNvbnN0IENpcmNsZVJvb3QgPSBzdHlsZWQuZGl2YFxuXHRib3JkZXItcmFkaXVzOiA1MCU7XG5cdGJvcmRlcjogJHsgQ09ORklHLmJvcmRlcldpZHRoIH0gc29saWQgJHsgQ09MT1JTLnVpLmJvcmRlciB9O1xuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRjdXJzb3I6IGdyYWI7XG5cdGhlaWdodDogJHsgQ0lSQ0xFX1NJWkUgfXB4O1xuXHRvdmVyZmxvdzogaGlkZGVuO1xuXHR3aWR0aDogJHsgQ0lSQ0xFX1NJWkUgfXB4O1xuYDtcblxuZXhwb3J0IGNvbnN0IENpcmNsZUluZGljYXRvcldyYXBwZXIgPSBzdHlsZWQuZGl2YFxuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRwb3NpdGlvbjogcmVsYXRpdmU7XG5cdHdpZHRoOiAxMDAlO1xuXHRoZWlnaHQ6IDEwMCU7XG5cblx0OmZvY3VzLXZpc2libGUge1xuXHRcdG91dGxpbmU6IG5vbmU7XG5cdH1cbmA7XG5cbmV4cG9ydCBjb25zdCBDaXJjbGVJbmRpY2F0b3IgPSBzdHlsZWQuZGl2YFxuXHRiYWNrZ3JvdW5kOiAkeyBDT0xPUlMudWkudGhlbWUgfTtcblx0Ym9yZGVyLXJhZGl1czogNTAlO1xuXHRib3JkZXI6ICR7IElOTkVSX0NJUkNMRV9TSVpFIH1weCBzb2xpZCAkeyBDT0xPUlMudWkudGhlbWUgfTtcblx0Ym90dG9tOiAwO1xuXHRib3gtc2l6aW5nOiBib3JkZXItYm94O1xuXHRkaXNwbGF5OiBibG9jaztcblx0aGVpZ2h0OiAwcHg7XG5cdGxlZnQ6IDA7XG5cdG1hcmdpbjogYXV0bztcblx0cG9zaXRpb246IGFic29sdXRlO1xuXHRyaWdodDogMDtcblx0dG9wOiAtJHsgQ0lSQ0xFX1NJWkUgLyAyIH1weDtcblx0d2lkdGg6IDBweDtcbmA7XG4iXX0= */"));
59
59
  //# sourceMappingURL=angle-picker-control-styles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/angle-picker-control/styles/angle-picker-control-styles.js"],"names":["css","Flex","COLORS","space","CONFIG","CIRCLE_SIZE","INNER_CIRCLE_SIZE","deprecatedBottomMargin","__nextHasNoMarginBottom","Root","CircleRoot","borderWidth","ui","border","CircleIndicatorWrapper","CircleIndicator","theme"],"mappings":";;;;AAAA;AACA;AACA;AACA,SAASA,GAAT,QAAoB,gBAApB;;AAGA;AACA;AACA;AACA,SAASC,IAAT,QAAqB,YAArB;AACA,SAASC,MAAT,QAAuB,aAAvB;AACA,SAASC,KAAT,QAAsB,sBAAtB;AACA,OAAOC,MAAP,MAAmB,2BAAnB;AAEA,MAAMC,WAAW,GAAG,EAApB;AACA,MAAMC,iBAAiB,GAAG,CAA1B;;AAEA,MAAMC,sBAAsB,GAAG,QAAmC;AAAA,MAAjC;AAAEC,IAAAA;AAAF,GAAiC;AACjE,SAAO,CAAEA,uBAAF,gBACJR,GADI,mBAEcG,KAAK,CAAE,CAAF,CAFnB,+6EAIJ,EAJH;AAKA,CAND;;AAQA,OAAO,MAAMM,IAAI,GAAG,qBAAQR,IAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,CACbM,sBADa,i2EAAV;AAIP,OAAO,MAAMG,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,gCAEXN,MAAM,CAACO,WAFI,aAEmBT,MAAM,CAACU,EAAP,CAAUC,MAF7B,gDAKXR,WALW,+BAOZA,WAPY,m2EAAhB;AAUP,OAAO,MAAMS,sBAAsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAA5B;AAWP,OAAO,MAAMC,eAAe;AAAA;AAAA;AAAA;AAAA;AAAA,kBACZb,MAAM,CAACU,EAAP,CAAUI,KADE,gCAGhBV,iBAHgB,eAGeJ,MAAM,CAACU,EAAP,CAAUI,KAHzB,iHAYlBX,WAAW,GAAG,CAZI,62EAArB","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport { Flex } from '../../flex';\nimport { COLORS } from '../../utils';\nimport { space } from '../../ui/utils/space';\nimport CONFIG from '../../utils/config-values';\n\nconst CIRCLE_SIZE = 32;\nconst INNER_CIRCLE_SIZE = 3;\n\nconst deprecatedBottomMargin = ( { __nextHasNoMarginBottom } ) => {\n\treturn ! __nextHasNoMarginBottom\n\t\t? css`\n\t\t\t\tmargin-bottom: ${ space( 2 ) };\n\t\t `\n\t\t: '';\n};\n\nexport const Root = styled( Flex )`\n\t${ deprecatedBottomMargin }\n`;\n\nexport const CircleRoot = styled.div`\n\tborder-radius: 50%;\n\tborder: ${ CONFIG.borderWidth } solid ${ COLORS.ui.border };\n\tbox-sizing: border-box;\n\tcursor: grab;\n\theight: ${ CIRCLE_SIZE }px;\n\toverflow: hidden;\n\twidth: ${ CIRCLE_SIZE }px;\n`;\n\nexport const CircleIndicatorWrapper = styled.div`\n\tbox-sizing: border-box;\n\tposition: relative;\n\twidth: 100%;\n\theight: 100%;\n\n\t:focus-visible {\n\t\toutline: none;\n\t}\n`;\n\nexport const CircleIndicator = styled.div`\n\tbackground: ${ COLORS.ui.theme };\n\tborder-radius: 50%;\n\tborder: ${ INNER_CIRCLE_SIZE }px solid ${ COLORS.ui.theme };\n\tbottom: 0;\n\tbox-sizing: border-box;\n\tdisplay: block;\n\theight: 0px;\n\tleft: 0;\n\tmargin: auto;\n\tposition: absolute;\n\tright: 0;\n\ttop: -${ CIRCLE_SIZE / 2 }px;\n\twidth: 0px;\n`;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/angle-picker-control/styles/angle-picker-control-styles.tsx"],"names":["css","Flex","COLORS","space","CONFIG","CIRCLE_SIZE","INNER_CIRCLE_SIZE","deprecatedBottomMargin","__nextHasNoMarginBottom","Root","CircleRoot","borderWidth","ui","border","CircleIndicatorWrapper","CircleIndicator","theme"],"mappings":";;;;AAAA;AACA;AACA;AACA,SAASA,GAAT,QAAoB,gBAApB;;AAGA;AACA;AACA;AACA,SAASC,IAAT,QAAqB,YAArB;AACA,SAASC,MAAT,QAAuB,aAAvB;AACA,SAASC,KAAT,QAAsB,sBAAtB;AACA,OAAOC,MAAP,MAAmB,2BAAnB;AAIA,MAAMC,WAAW,GAAG,EAApB;AACA,MAAMC,iBAAiB,GAAG,CAA1B;;AAEA,MAAMC,sBAAsB,GAAG,QAEoC;AAAA,MAFlC;AAChCC,IAAAA;AADgC,GAEkC;AAClE,SAAO,CAAEA,uBAAF,gBACJR,GADI,mBAEcG,KAAK,CAAE,CAAF,CAFnB,2lFAIJ,EAJH;AAKA,CARD;;AAUA,OAAO,MAAMM,IAAI,GAAG,qBAAQR,IAAR;AAAA;AAAA;AAAA;AAAA;AAAA,EAAH,CACbM,sBADa,ygFAAV;AAIP,OAAO,MAAMG,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,gCAEXN,MAAM,CAACO,WAFI,aAEmBT,MAAM,CAACU,EAAP,CAAUC,MAF7B,gDAKXR,WALW,+BAOZA,WAPY,2gFAAhB;AAUP,OAAO,MAAMS,sBAAsB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAA5B;AAWP,OAAO,MAAMC,eAAe;AAAA;AAAA;AAAA;AAAA;AAAA,kBACZb,MAAM,CAACU,EAAP,CAAUI,KADE,gCAGhBV,iBAHgB,eAGeJ,MAAM,CAACU,EAAP,CAAUI,KAHzB,iHAYlBX,WAAW,GAAG,CAZI,qhFAArB","sourcesContent":["/**\n * External dependencies\n */\nimport { css } from '@emotion/react';\nimport styled from '@emotion/styled';\n\n/**\n * Internal dependencies\n */\nimport { Flex } from '../../flex';\nimport { COLORS } from '../../utils';\nimport { space } from '../../ui/utils/space';\nimport CONFIG from '../../utils/config-values';\n\nimport type { AnglePickerControlProps } from '../types';\n\nconst CIRCLE_SIZE = 32;\nconst INNER_CIRCLE_SIZE = 3;\n\nconst deprecatedBottomMargin = ( {\n\t__nextHasNoMarginBottom,\n}: Pick< AnglePickerControlProps, '__nextHasNoMarginBottom' > ) => {\n\treturn ! __nextHasNoMarginBottom\n\t\t? css`\n\t\t\t\tmargin-bottom: ${ space( 2 ) };\n\t\t `\n\t\t: '';\n};\n\nexport const Root = styled( Flex )`\n\t${ deprecatedBottomMargin }\n`;\n\nexport const CircleRoot = styled.div`\n\tborder-radius: 50%;\n\tborder: ${ CONFIG.borderWidth } solid ${ COLORS.ui.border };\n\tbox-sizing: border-box;\n\tcursor: grab;\n\theight: ${ CIRCLE_SIZE }px;\n\toverflow: hidden;\n\twidth: ${ CIRCLE_SIZE }px;\n`;\n\nexport const CircleIndicatorWrapper = styled.div`\n\tbox-sizing: border-box;\n\tposition: relative;\n\twidth: 100%;\n\theight: 100%;\n\n\t:focus-visible {\n\t\toutline: none;\n\t}\n`;\n\nexport const CircleIndicator = styled.div`\n\tbackground: ${ COLORS.ui.theme };\n\tborder-radius: 50%;\n\tborder: ${ INNER_CIRCLE_SIZE }px solid ${ COLORS.ui.theme };\n\tbottom: 0;\n\tbox-sizing: border-box;\n\tdisplay: block;\n\theight: 0px;\n\tleft: 0;\n\tmargin: auto;\n\tposition: absolute;\n\tright: 0;\n\ttop: -${ CIRCLE_SIZE / 2 }px;\n\twidth: 0px;\n`;\n"]}
@@ -1,4 +1,4 @@
1
- import { createElement } from "@wordpress/element";
1
+ import { createElement, Fragment } from "@wordpress/element";
2
2
 
3
3
  /**
4
4
  * External dependencies
@@ -8,8 +8,9 @@ import classnames from 'classnames';
8
8
  * WordPress dependencies
9
9
  */
10
10
 
11
- import { useLayoutEffect, useRef, useEffect } from '@wordpress/element';
11
+ import { useLayoutEffect, useRef, useEffect, useState } from '@wordpress/element';
12
12
  import { useAnchor } from '@wordpress/rich-text';
13
+ import { useMergeRefs, useRefEffect } from '@wordpress/compose';
13
14
  /**
14
15
  * Internal dependencies
15
16
  */
@@ -17,6 +18,8 @@ import { useAnchor } from '@wordpress/rich-text';
17
18
  import getDefaultUseItems from './get-default-use-items';
18
19
  import Button from '../button';
19
20
  import Popover from '../popover';
21
+ import { VisuallyHidden } from '../visually-hidden';
22
+ import { createPortal } from 'react-dom';
20
23
  export function getAutoCompleterUI(autocompleter) {
21
24
  const useItems = autocompleter.useItems ? autocompleter.useItems : getDefaultUseItems(autocompleter);
22
25
 
@@ -39,7 +42,16 @@ export function getAutoCompleterUI(autocompleter) {
39
42
  editableContentElement: contentRef.current,
40
43
  value
41
44
  });
45
+ const [needsA11yCompat, setNeedsA11yCompat] = useState(false);
42
46
  const popoverRef = useRef();
47
+ const popoverRefs = useMergeRefs([popoverRef, useRefEffect(node => {
48
+ if (!contentRef.current) return; // If the popover is rendered in a different document than
49
+ // the content, we need to duplicate the options list in the
50
+ // content document so that it's available to the screen
51
+ // readers, which check the DOM ID based aira-* attributes.
52
+
53
+ setNeedsA11yCompat(node.ownerDocument !== contentRef.current.ownerDocument);
54
+ }, [contentRef])]);
43
55
  useOnClickOutside(popoverRef, reset);
44
56
  useLayoutEffect(() => {
45
57
  onChangeOptions(items); // Temporarily disabling exhaustive-deps to avoid introducing unexpected side effecst.
@@ -51,28 +63,37 @@ export function getAutoCompleterUI(autocompleter) {
51
63
  return null;
52
64
  }
53
65
 
54
- return createElement(Popover, {
66
+ const ListBox = _ref2 => {
67
+ let {
68
+ Component = 'div'
69
+ } = _ref2;
70
+ return createElement(Component, {
71
+ id: listBoxId,
72
+ role: "listbox",
73
+ className: "components-autocomplete__results"
74
+ }, items.map((option, index) => createElement(Button, {
75
+ key: option.key,
76
+ id: `components-autocomplete-item-${instanceId}-${option.key}`,
77
+ role: "option",
78
+ "aria-selected": index === selectedIndex,
79
+ disabled: option.isDisabled,
80
+ className: classnames('components-autocomplete__result', className, {
81
+ 'is-selected': index === selectedIndex
82
+ }),
83
+ onClick: () => onSelect(option)
84
+ }, option.label)));
85
+ };
86
+
87
+ return createElement(Fragment, null, createElement(Popover, {
55
88
  focusOnMount: false,
56
89
  onClose: onReset,
57
90
  placement: "top-start",
58
91
  className: "components-autocomplete__popover",
59
92
  anchor: popoverAnchor,
60
- ref: popoverRef
61
- }, createElement("div", {
62
- id: listBoxId,
63
- role: "listbox",
64
- className: "components-autocomplete__results"
65
- }, items.map((option, index) => createElement(Button, {
66
- key: option.key,
67
- id: `components-autocomplete-item-${instanceId}-${option.key}`,
68
- role: "option",
69
- "aria-selected": index === selectedIndex,
70
- disabled: option.isDisabled,
71
- className: classnames('components-autocomplete__result', className, {
72
- 'is-selected': index === selectedIndex
73
- }),
74
- onClick: () => onSelect(option)
75
- }, option.label))));
93
+ ref: popoverRefs
94
+ }, createElement(ListBox, null)), contentRef.current && needsA11yCompat && createPortal(createElement(ListBox, {
95
+ Component: VisuallyHidden
96
+ }), contentRef.current.ownerDocument.body));
76
97
  }
77
98
 
78
99
  return AutocompleterUI;
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/autocomplete/autocompleter-ui.js"],"names":["classnames","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","map","option","index","key","isDisabled","label","ref","handler","listener","event","contains","target","document","addEventListener","removeEventListener"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,UAAP,MAAuB,YAAvB;AAEA;AACA;AACA;;AACA,SAASC,eAAT,EAA0BC,MAA1B,EAAkCC,SAAlC,QAAmD,oBAAnD;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,OAYI;AAAA,QAZsB;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,KAVyB;AAWzBC,MAAAA;AAXyB,KAYtB;AACH,UAAM,CAAEC,KAAF,IAAYb,QAAQ,CAAEE,WAAF,CAA1B;AACA,UAAMY,aAAa,GAAGpB,SAAS,CAAE;AAChCqB,MAAAA,sBAAsB,EAAEH,UAAU,CAACI,OADH;AAEhCL,MAAAA;AAFgC,KAAF,CAA/B;AAKA,UAAMM,UAAU,GAAGzB,MAAM,EAAzB;AAEA0B,IAAAA,iBAAiB,CAAED,UAAF,EAAcP,KAAd,CAAjB;AAEAnB,IAAAA,eAAe,CAAE,MAAM;AACtBgB,MAAAA,eAAe,CAAEM,KAAF,CAAf,CADsB,CAEtB;AACA;AACA;AACA,KALc,EAKZ,CAAEA,KAAF,CALY,CAAf;;AAOA,QAAK,CAAEA,KAAK,CAACM,MAAR,GAAiB,CAAtB,EAA0B;AACzB,aAAO,IAAP;AACA;;AAED,WACC,cAAC,OAAD;AACC,MAAA,YAAY,EAAG,KADhB;AAEC,MAAA,OAAO,EAAGV,OAFX;AAGC,MAAA,SAAS,EAAC,WAHX;AAIC,MAAA,SAAS,EAAC,kCAJX;AAKC,MAAA,MAAM,EAAGK,aALV;AAMC,MAAA,GAAG,EAAGG;AANP,OAQC;AACC,MAAA,EAAE,EAAGb,SADN;AAEC,MAAA,IAAI,EAAC,SAFN;AAGC,MAAA,SAAS,EAAC;AAHX,OAKGS,KAAK,CAACO,GAAN,CAAW,CAAEC,MAAF,EAAUC,KAAV,KACZ,cAAC,MAAD;AACC,MAAA,GAAG,EAAGD,MAAM,CAACE,GADd;AAEC,MAAA,EAAE,EAAI,gCAAgCpB,UAAY,IAAIkB,MAAM,CAACE,GAAK,EAFnE;AAGC,MAAA,IAAI,EAAC,QAHN;AAIC,uBAAgBD,KAAK,KAAKhB,aAJ3B;AAKC,MAAA,QAAQ,EAAGe,MAAM,CAACG,UALnB;AAMC,MAAA,SAAS,EAAGlC,UAAU,CACrB,iCADqB,EAErBe,SAFqB,EAGrB;AACC,uBAAeiB,KAAK,KAAKhB;AAD1B,OAHqB,CANvB;AAaC,MAAA,OAAO,EAAG,MAAME,QAAQ,CAAEa,MAAF;AAbzB,OAeGA,MAAM,CAACI,KAfV,CADC,CALH,CARD,CADD;AAoCA;;AAED,SAAOxB,eAAP;AACA;;AAED,SAASiB,iBAAT,CAA4BQ,GAA5B,EAAiCC,OAAjC,EAA2C;AAC1ClC,EAAAA,SAAS,CAAE,MAAM;AAChB,UAAMmC,QAAQ,GAAKC,KAAF,IAAa;AAC7B;AACA,UAAK,CAAEH,GAAG,CAACV,OAAN,IAAiBU,GAAG,CAACV,OAAJ,CAAYc,QAAZ,CAAsBD,KAAK,CAACE,MAA5B,CAAtB,EAA6D;AAC5D;AACA;;AACDJ,MAAAA,OAAO,CAAEE,KAAF,CAAP;AACA,KAND;;AAOAG,IAAAA,QAAQ,CAACC,gBAAT,CAA2B,WAA3B,EAAwCL,QAAxC;AACAI,IAAAA,QAAQ,CAACC,gBAAT,CAA2B,YAA3B,EAAyCL,QAAzC;AACA,WAAO,MAAM;AACZI,MAAAA,QAAQ,CAACE,mBAAT,CAA8B,WAA9B,EAA2CN,QAA3C;AACAI,MAAAA,QAAQ,CAACE,mBAAT,CAA8B,YAA9B,EAA4CN,QAA5C;AACA,KAHD,CAVgB,CAchB;AACA;AACA;AACA,GAjBQ,EAiBN,CAAED,OAAF,CAjBM,CAAT;AAkBA","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\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{ items.map( ( 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"]}
1
+ {"version":3,"sources":["@wordpress/components/src/autocomplete/autocompleter-ui.js"],"names":["classnames","useLayoutEffect","useRef","useEffect","useState","useAnchor","useMergeRefs","useRefEffect","getDefaultUseItems","Button","Popover","VisuallyHidden","createPortal","getAutoCompleterUI","autocompleter","useItems","AutocompleterUI","filterValue","instanceId","listBoxId","className","selectedIndex","onChangeOptions","onSelect","onReset","reset","value","contentRef","items","popoverAnchor","editableContentElement","current","needsA11yCompat","setNeedsA11yCompat","popoverRef","popoverRefs","node","ownerDocument","useOnClickOutside","length","ListBox","Component","map","option","index","key","isDisabled","label","body","ref","handler","listener","event","contains","target","document","addEventListener","removeEventListener"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseLayoutEffect,\n\tuseRef,\n\tuseEffect,\n\tuseState,\n} from '@wordpress/element';\nimport { useAnchor } from '@wordpress/rich-text';\nimport { useMergeRefs, useRefEffect } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport getDefaultUseItems from './get-default-use-items';\nimport Button from '../button';\nimport Popover from '../popover';\nimport { VisuallyHidden } from '../visually-hidden';\nimport { createPortal } from 'react-dom';\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 [ needsA11yCompat, setNeedsA11yCompat ] = useState( false );\n\t\tconst popoverRef = useRef();\n\t\tconst popoverRefs = useMergeRefs( [\n\t\t\tpopoverRef,\n\t\t\tuseRefEffect(\n\t\t\t\t( node ) => {\n\t\t\t\t\tif ( ! contentRef.current ) return;\n\n\t\t\t\t\t// If the popover is rendered in a different document than\n\t\t\t\t\t// the content, we need to duplicate the options list in the\n\t\t\t\t\t// content document so that it's available to the screen\n\t\t\t\t\t// readers, which check the DOM ID based aira-* attributes.\n\t\t\t\t\tsetNeedsA11yCompat(\n\t\t\t\t\t\tnode.ownerDocument !== contentRef.current.ownerDocument\n\t\t\t\t\t);\n\t\t\t\t},\n\t\t\t\t[ contentRef ]\n\t\t\t),\n\t\t] );\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\tconst ListBox = ( { Component = 'div' } ) => (\n\t\t\t<Component\n\t\t\t\tid={ listBoxId }\n\t\t\t\trole=\"listbox\"\n\t\t\t\tclassName=\"components-autocomplete__results\"\n\t\t\t>\n\t\t\t\t{ items.map( ( option, index ) => (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tkey={ option.key }\n\t\t\t\t\t\tid={ `components-autocomplete-item-${ instanceId }-${ option.key }` }\n\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\taria-selected={ index === selectedIndex }\n\t\t\t\t\t\tdisabled={ option.isDisabled }\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'components-autocomplete__result',\n\t\t\t\t\t\t\tclassName,\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'is-selected': index === selectedIndex,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tonClick={ () => onSelect( option ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ option.label }\n\t\t\t\t\t</Button>\n\t\t\t\t) ) }\n\t\t\t</Component>\n\t\t);\n\n\t\treturn (\n\t\t\t<>\n\t\t\t\t<Popover\n\t\t\t\t\tfocusOnMount={ false }\n\t\t\t\t\tonClose={ onReset }\n\t\t\t\t\tplacement=\"top-start\"\n\t\t\t\t\tclassName=\"components-autocomplete__popover\"\n\t\t\t\t\tanchor={ popoverAnchor }\n\t\t\t\t\tref={ popoverRefs }\n\t\t\t\t>\n\t\t\t\t\t<ListBox />\n\t\t\t\t</Popover>\n\t\t\t\t{ contentRef.current &&\n\t\t\t\t\tneedsA11yCompat &&\n\t\t\t\t\tcreatePortal(\n\t\t\t\t\t\t<ListBox Component={ VisuallyHidden } />,\n\t\t\t\t\t\tcontentRef.current.ownerDocument.body\n\t\t\t\t\t) }\n\t\t\t</>\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"]}
@@ -107,6 +107,7 @@ export function getAutoCompleterUI(autocompleter) {
107
107
  }, createElement(Animated.View, {
108
108
  style: contentStyles
109
109
  }, createElement(BackgroundView, null, createElement(ScrollView, {
110
+ testID: "autocompleter",
110
111
  ref: scrollViewRef,
111
112
  horizontal: true,
112
113
  contentContainerStyle: styles['components-autocomplete__content'],
@@ -1 +1 @@
1
- {"version":3,"sources":["@wordpress/components/src/autocomplete/autocompleter-ui.native.js"],"names":["View","Animated","StyleSheet","Text","TouchableOpacity","ScrollView","useLayoutEffect","useEffect","useRef","useState","useCallback","__","sprintf","Icon","__unstableAutocompletionItemsFill","AutocompletionItemsFill","usePreferredColorSchemeStyle","BackgroundView","getDefaultUseItems","styles","compose","stylesCompose","getAutoCompleterUI","autocompleter","useItems","AutocompleterUI","filterValue","selectedIndex","onChangeOptions","onSelect","value","reset","items","filteredItems","filter","item","isDisabled","scrollViewRef","animationValue","Value","current","isVisible","setIsVisible","text","length","scrollTo","x","animated","startAnimation","activeItemStyles","iconStyles","activeIconStyles","textStyles","activeTextStyles","show","timing","toValue","duration","useNativeDriver","start","finished","contentStyles","transform","translateY","interpolate","inputRange","outputRange","height","map","option","index","isActive","itemStyle","textStyle","iconStyle","iconSource","icon","src","title"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tView,\n\tAnimated,\n\tStyleSheet,\n\tText,\n\tTouchableOpacity,\n\tScrollView,\n} from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseLayoutEffect,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tuseCallback,\n} from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tIcon,\n\t__unstableAutocompletionItemsFill as AutocompletionItemsFill,\n} from '@wordpress/components';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport BackgroundView from './background-view';\nimport getDefaultUseItems from './get-default-use-items';\nimport styles from './style.scss';\n\nconst { compose: stylesCompose } = StyleSheet;\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\tselectedIndex,\n\t\tonChangeOptions,\n\t\tonSelect,\n\t\tvalue,\n\t\treset,\n\t} ) {\n\t\tconst [ items ] = useItems( filterValue );\n\t\tconst filteredItems = items.filter( ( item ) => ! item.isDisabled );\n\t\tconst scrollViewRef = useRef();\n\t\tconst animationValue = useRef( new Animated.Value( 0 ) ).current;\n\t\tconst [ isVisible, setIsVisible ] = useState( false );\n\t\tconst { text } = value;\n\n\t\tuseEffect( () => {\n\t\t\tif ( ! isVisible && text.length > 0 ) {\n\t\t\t\tsetIsVisible( true );\n\t\t\t}\n\t\t}, [ isVisible, text ] );\n\n\t\tuseLayoutEffect( () => {\n\t\t\tonChangeOptions( items );\n\t\t\tscrollViewRef.current?.scrollTo( { x: 0, animated: false } );\n\n\t\t\tif ( isVisible && text.length > 0 ) {\n\t\t\t\tstartAnimation( true );\n\t\t\t} else if ( isVisible && text.length === 0 ) {\n\t\t\t\tstartAnimation( false );\n\t\t\t}\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, isVisible, text ] );\n\n\t\tconst activeItemStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__item-active' ],\n\t\t\tstyles[ 'components-autocomplete__item-active-dark' ]\n\t\t);\n\n\t\tconst iconStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__icon' ],\n\t\t\tstyles[ 'components-autocomplete__icon-active-dark' ]\n\t\t);\n\n\t\tconst activeIconStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__icon-active ' ],\n\t\t\tstyles[ 'components-autocomplete__icon-active-dark' ]\n\t\t);\n\n\t\tconst textStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__text' ],\n\t\t\tstyles[ 'components-autocomplete__text-dark' ]\n\t\t);\n\n\t\tconst activeTextStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__text-active' ],\n\t\t\tstyles[ 'components-autocomplete__text-active-dark' ]\n\t\t);\n\n\t\tconst startAnimation = useCallback(\n\t\t\t( show ) => {\n\t\t\t\tAnimated.timing( animationValue, {\n\t\t\t\t\ttoValue: show ? 1 : 0,\n\t\t\t\t\tduration: show ? 200 : 100,\n\t\t\t\t\tuseNativeDriver: true,\n\t\t\t\t} ).start( ( { finished } ) => {\n\t\t\t\t\tif ( finished && ! show && isVisible ) {\n\t\t\t\t\t\tsetIsVisible( false );\n\t\t\t\t\t\treset();\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t},\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\t[ isVisible ]\n\t\t);\n\n\t\tconst contentStyles = {\n\t\t\ttransform: [\n\t\t\t\t{\n\t\t\t\t\ttranslateY: animationValue.interpolate( {\n\t\t\t\t\t\tinputRange: [ 0, 1 ],\n\t\t\t\t\t\toutputRange: [\n\t\t\t\t\t\t\tstyles[ 'components-autocomplete' ].height,\n\t\t\t\t\t\t\t0,\n\t\t\t\t\t\t],\n\t\t\t\t\t} ),\n\t\t\t\t},\n\t\t\t],\n\t\t};\n\n\t\tif ( ! filteredItems.length > 0 || ! isVisible ) {\n\t\t\treturn null;\n\t\t}\n\n\t\treturn (\n\t\t\t<AutocompletionItemsFill>\n\t\t\t\t<View style={ styles[ 'components-autocomplete' ] }>\n\t\t\t\t\t<Animated.View style={ contentStyles }>\n\t\t\t\t\t\t<BackgroundView>\n\t\t\t\t\t\t\t<ScrollView\n\t\t\t\t\t\t\t\tref={ scrollViewRef }\n\t\t\t\t\t\t\t\thorizontal\n\t\t\t\t\t\t\t\tcontentContainerStyle={\n\t\t\t\t\t\t\t\t\tstyles[ 'components-autocomplete__content' ]\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tshowsHorizontalScrollIndicator={ false }\n\t\t\t\t\t\t\t\tkeyboardShouldPersistTaps=\"always\"\n\t\t\t\t\t\t\t\taccessibilityLabel={\n\t\t\t\t\t\t\t\t\t// translators: Slash inserter autocomplete results\n\t\t\t\t\t\t\t\t\t__( 'Slash inserter results' )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ filteredItems.map( ( option, index ) => {\n\t\t\t\t\t\t\t\t\tconst isActive = index === selectedIndex;\n\t\t\t\t\t\t\t\t\tconst itemStyle = stylesCompose(\n\t\t\t\t\t\t\t\t\t\tstyles[\n\t\t\t\t\t\t\t\t\t\t\t'components-autocomplete__item'\n\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t\tisActive && activeItemStyles\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\tconst textStyle = stylesCompose(\n\t\t\t\t\t\t\t\t\t\ttextStyles,\n\t\t\t\t\t\t\t\t\t\tisActive && activeTextStyles\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\tconst iconStyle = stylesCompose(\n\t\t\t\t\t\t\t\t\t\ticonStyles,\n\t\t\t\t\t\t\t\t\t\tisActive && activeIconStyles\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\tconst iconSource =\n\t\t\t\t\t\t\t\t\t\toption?.value?.icon?.src ||\n\t\t\t\t\t\t\t\t\t\toption?.value?.icon;\n\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<TouchableOpacity\n\t\t\t\t\t\t\t\t\t\t\tactiveOpacity={ 0.5 }\n\t\t\t\t\t\t\t\t\t\t\tstyle={ itemStyle }\n\t\t\t\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\t\t\t\tonPress={ () => onSelect( option ) }\n\t\t\t\t\t\t\t\t\t\t\taccessibilityLabel={ sprintf(\n\t\t\t\t\t\t\t\t\t\t\t\t// translators: %s: Block name e.g. \"Image block\"\n\t\t\t\t\t\t\t\t\t\t\t\t__( '%s block' ),\n\t\t\t\t\t\t\t\t\t\t\t\toption?.value?.title\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<View\n\t\t\t\t\t\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles[\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t'components-autocomplete__icon'\n\t\t\t\t\t\t\t\t\t\t\t\t\t]\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\t\t\ticon={ iconSource }\n\t\t\t\t\t\t\t\t\t\t\t\t\tsize={ 24 }\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={ iconStyle }\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t</View>\n\t\t\t\t\t\t\t\t\t\t\t<Text style={ textStyle }>\n\t\t\t\t\t\t\t\t\t\t\t\t{ option?.value?.title }\n\t\t\t\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t\t\t\t</TouchableOpacity>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t\t</ScrollView>\n\t\t\t\t\t\t</BackgroundView>\n\t\t\t\t\t</Animated.View>\n\t\t\t\t</View>\n\t\t\t</AutocompletionItemsFill>\n\t\t);\n\t}\n\n\treturn AutocompleterUI;\n}\n\nexport default getAutoCompleterUI;\n"]}
1
+ {"version":3,"sources":["@wordpress/components/src/autocomplete/autocompleter-ui.native.js"],"names":["View","Animated","StyleSheet","Text","TouchableOpacity","ScrollView","useLayoutEffect","useEffect","useRef","useState","useCallback","__","sprintf","Icon","__unstableAutocompletionItemsFill","AutocompletionItemsFill","usePreferredColorSchemeStyle","BackgroundView","getDefaultUseItems","styles","compose","stylesCompose","getAutoCompleterUI","autocompleter","useItems","AutocompleterUI","filterValue","selectedIndex","onChangeOptions","onSelect","value","reset","items","filteredItems","filter","item","isDisabled","scrollViewRef","animationValue","Value","current","isVisible","setIsVisible","text","length","scrollTo","x","animated","startAnimation","activeItemStyles","iconStyles","activeIconStyles","textStyles","activeTextStyles","show","timing","toValue","duration","useNativeDriver","start","finished","contentStyles","transform","translateY","interpolate","inputRange","outputRange","height","map","option","index","isActive","itemStyle","textStyle","iconStyle","iconSource","icon","src","title"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport {\n\tView,\n\tAnimated,\n\tStyleSheet,\n\tText,\n\tTouchableOpacity,\n\tScrollView,\n} from 'react-native';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseLayoutEffect,\n\tuseEffect,\n\tuseRef,\n\tuseState,\n\tuseCallback,\n} from '@wordpress/element';\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tIcon,\n\t__unstableAutocompletionItemsFill as AutocompletionItemsFill,\n} from '@wordpress/components';\nimport { usePreferredColorSchemeStyle } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport BackgroundView from './background-view';\nimport getDefaultUseItems from './get-default-use-items';\nimport styles from './style.scss';\n\nconst { compose: stylesCompose } = StyleSheet;\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\tselectedIndex,\n\t\tonChangeOptions,\n\t\tonSelect,\n\t\tvalue,\n\t\treset,\n\t} ) {\n\t\tconst [ items ] = useItems( filterValue );\n\t\tconst filteredItems = items.filter( ( item ) => ! item.isDisabled );\n\t\tconst scrollViewRef = useRef();\n\t\tconst animationValue = useRef( new Animated.Value( 0 ) ).current;\n\t\tconst [ isVisible, setIsVisible ] = useState( false );\n\t\tconst { text } = value;\n\n\t\tuseEffect( () => {\n\t\t\tif ( ! isVisible && text.length > 0 ) {\n\t\t\t\tsetIsVisible( true );\n\t\t\t}\n\t\t}, [ isVisible, text ] );\n\n\t\tuseLayoutEffect( () => {\n\t\t\tonChangeOptions( items );\n\t\t\tscrollViewRef.current?.scrollTo( { x: 0, animated: false } );\n\n\t\t\tif ( isVisible && text.length > 0 ) {\n\t\t\t\tstartAnimation( true );\n\t\t\t} else if ( isVisible && text.length === 0 ) {\n\t\t\t\tstartAnimation( false );\n\t\t\t}\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, isVisible, text ] );\n\n\t\tconst activeItemStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__item-active' ],\n\t\t\tstyles[ 'components-autocomplete__item-active-dark' ]\n\t\t);\n\n\t\tconst iconStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__icon' ],\n\t\t\tstyles[ 'components-autocomplete__icon-active-dark' ]\n\t\t);\n\n\t\tconst activeIconStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__icon-active ' ],\n\t\t\tstyles[ 'components-autocomplete__icon-active-dark' ]\n\t\t);\n\n\t\tconst textStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__text' ],\n\t\t\tstyles[ 'components-autocomplete__text-dark' ]\n\t\t);\n\n\t\tconst activeTextStyles = usePreferredColorSchemeStyle(\n\t\t\tstyles[ 'components-autocomplete__text-active' ],\n\t\t\tstyles[ 'components-autocomplete__text-active-dark' ]\n\t\t);\n\n\t\tconst startAnimation = useCallback(\n\t\t\t( show ) => {\n\t\t\t\tAnimated.timing( animationValue, {\n\t\t\t\t\ttoValue: show ? 1 : 0,\n\t\t\t\t\tduration: show ? 200 : 100,\n\t\t\t\t\tuseNativeDriver: true,\n\t\t\t\t} ).start( ( { finished } ) => {\n\t\t\t\t\tif ( finished && ! show && isVisible ) {\n\t\t\t\t\t\tsetIsVisible( false );\n\t\t\t\t\t\treset();\n\t\t\t\t\t}\n\t\t\t\t} );\n\t\t\t},\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\t[ isVisible ]\n\t\t);\n\n\t\tconst contentStyles = {\n\t\t\ttransform: [\n\t\t\t\t{\n\t\t\t\t\ttranslateY: animationValue.interpolate( {\n\t\t\t\t\t\tinputRange: [ 0, 1 ],\n\t\t\t\t\t\toutputRange: [\n\t\t\t\t\t\t\tstyles[ 'components-autocomplete' ].height,\n\t\t\t\t\t\t\t0,\n\t\t\t\t\t\t],\n\t\t\t\t\t} ),\n\t\t\t\t},\n\t\t\t],\n\t\t};\n\n\t\tif ( ! filteredItems.length > 0 || ! isVisible ) {\n\t\t\treturn null;\n\t\t}\n\n\t\treturn (\n\t\t\t<AutocompletionItemsFill>\n\t\t\t\t<View style={ styles[ 'components-autocomplete' ] }>\n\t\t\t\t\t<Animated.View style={ contentStyles }>\n\t\t\t\t\t\t<BackgroundView>\n\t\t\t\t\t\t\t<ScrollView\n\t\t\t\t\t\t\t\ttestID=\"autocompleter\"\n\t\t\t\t\t\t\t\tref={ scrollViewRef }\n\t\t\t\t\t\t\t\thorizontal\n\t\t\t\t\t\t\t\tcontentContainerStyle={\n\t\t\t\t\t\t\t\t\tstyles[ 'components-autocomplete__content' ]\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tshowsHorizontalScrollIndicator={ false }\n\t\t\t\t\t\t\t\tkeyboardShouldPersistTaps=\"always\"\n\t\t\t\t\t\t\t\taccessibilityLabel={\n\t\t\t\t\t\t\t\t\t// translators: Slash inserter autocomplete results\n\t\t\t\t\t\t\t\t\t__( 'Slash inserter results' )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ filteredItems.map( ( option, index ) => {\n\t\t\t\t\t\t\t\t\tconst isActive = index === selectedIndex;\n\t\t\t\t\t\t\t\t\tconst itemStyle = stylesCompose(\n\t\t\t\t\t\t\t\t\t\tstyles[\n\t\t\t\t\t\t\t\t\t\t\t'components-autocomplete__item'\n\t\t\t\t\t\t\t\t\t\t],\n\t\t\t\t\t\t\t\t\t\tisActive && activeItemStyles\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\tconst textStyle = stylesCompose(\n\t\t\t\t\t\t\t\t\t\ttextStyles,\n\t\t\t\t\t\t\t\t\t\tisActive && activeTextStyles\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\tconst iconStyle = stylesCompose(\n\t\t\t\t\t\t\t\t\t\ticonStyles,\n\t\t\t\t\t\t\t\t\t\tisActive && activeIconStyles\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\tconst iconSource =\n\t\t\t\t\t\t\t\t\t\toption?.value?.icon?.src ||\n\t\t\t\t\t\t\t\t\t\toption?.value?.icon;\n\n\t\t\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t\t\t<TouchableOpacity\n\t\t\t\t\t\t\t\t\t\t\tactiveOpacity={ 0.5 }\n\t\t\t\t\t\t\t\t\t\t\tstyle={ itemStyle }\n\t\t\t\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\t\t\t\tonPress={ () => onSelect( option ) }\n\t\t\t\t\t\t\t\t\t\t\taccessibilityLabel={ sprintf(\n\t\t\t\t\t\t\t\t\t\t\t\t// translators: %s: Block name e.g. \"Image block\"\n\t\t\t\t\t\t\t\t\t\t\t\t__( '%s block' ),\n\t\t\t\t\t\t\t\t\t\t\t\toption?.value?.title\n\t\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t<View\n\t\t\t\t\t\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyles[\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t'components-autocomplete__icon'\n\t\t\t\t\t\t\t\t\t\t\t\t\t]\n\t\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\t\t\ticon={ iconSource }\n\t\t\t\t\t\t\t\t\t\t\t\t\tsize={ 24 }\n\t\t\t\t\t\t\t\t\t\t\t\t\tstyle={ iconStyle }\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t</View>\n\t\t\t\t\t\t\t\t\t\t\t<Text style={ textStyle }>\n\t\t\t\t\t\t\t\t\t\t\t\t{ option?.value?.title }\n\t\t\t\t\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t\t\t\t</TouchableOpacity>\n\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t} ) }\n\t\t\t\t\t\t\t</ScrollView>\n\t\t\t\t\t\t</BackgroundView>\n\t\t\t\t\t</Animated.View>\n\t\t\t\t</View>\n\t\t\t</AutocompletionItemsFill>\n\t\t);\n\t}\n\n\treturn AutocompleterUI;\n}\n\nexport default getAutoCompleterUI;\n"]}
@@ -19,6 +19,7 @@ import { speak } from '@wordpress/a11y';
19
19
 
20
20
  import { getAutoCompleterUI } from './autocompleter-ui';
21
21
  import { escapeRegExp } from '../utils/strings';
22
+ const EMPTY_ARRAY = [];
22
23
  /**
23
24
  * A raw completer option.
24
25
  *
@@ -106,7 +107,7 @@ function useAutocomplete(_ref) {
106
107
  const debouncedSpeak = useDebounce(speak, 500);
107
108
  const instanceId = useInstanceId(useAutocomplete);
108
109
  const [selectedIndex, setSelectedIndex] = useState(0);
109
- const [filteredOptions, setFilteredOptions] = useState([]);
110
+ const [filteredOptions, setFilteredOptions] = useState(EMPTY_ARRAY);
110
111
  const [filterValue, setFilterValue] = useState('');
111
112
  const [autocompleter, setAutocompleter] = useState(null);
112
113
  const [AutocompleterUI, setAutocompleterUI] = useState(null);
@@ -157,7 +158,7 @@ function useAutocomplete(_ref) {
157
158
 
158
159
  function reset() {
159
160
  setSelectedIndex(0);
160
- setFilteredOptions([]);
161
+ setFilteredOptions(EMPTY_ARRAY);
161
162
  setFilterValue('');
162
163
  setAutocompleter(null);
163
164
  setAutocompleterUI(null);
@@ -251,24 +252,22 @@ function useAutocomplete(_ref) {
251
252
  }, [record]);
252
253
  useEffect(() => {
253
254
  if (!textContent) {
254
- reset();
255
+ if (autocompleter) reset();
255
256
  return;
256
257
  }
257
258
 
258
- const text = removeAccents(textContent);
259
- const textAfterSelection = getTextContent(slice(record, undefined, getTextContent(record).length));
260
259
  const completer = completers === null || completers === void 0 ? void 0 : completers.find(_ref2 => {
261
260
  let {
262
261
  triggerPrefix,
263
262
  allowContext
264
263
  } = _ref2;
265
- const index = text.lastIndexOf(triggerPrefix);
264
+ const index = textContent.lastIndexOf(triggerPrefix);
266
265
 
267
266
  if (index === -1) {
268
267
  return false;
269
268
  }
270
269
 
271
- const textWithoutTrigger = text.slice(index + triggerPrefix.length);
270
+ const textWithoutTrigger = textContent.slice(index + triggerPrefix.length);
272
271
  const tooDistantFromTrigger = textWithoutTrigger.length > 50; // 50 chars seems to be a good limit.
273
272
  // This is a final barrier to prevent the effect from completing with
274
273
  // an extremely long string, which causes the editor to slow-down
@@ -302,7 +301,9 @@ function useAutocomplete(_ref) {
302
301
  return false;
303
302
  }
304
303
 
305
- if (allowContext && !allowContext(text.slice(0, index), textAfterSelection)) {
304
+ const textAfterSelection = getTextContent(slice(record, undefined, getTextContent(record).length));
305
+
306
+ if (allowContext && !allowContext(textContent.slice(0, index), textAfterSelection)) {
306
307
  return false;
307
308
  }
308
309
 
@@ -314,11 +315,12 @@ function useAutocomplete(_ref) {
314
315
  });
315
316
 
316
317
  if (!completer) {
317
- reset();
318
+ if (autocompleter) reset();
318
319
  return;
319
320
  }
320
321
 
321
322
  const safeTrigger = escapeRegExp(completer.triggerPrefix);
323
+ const text = removeAccents(textContent);
322
324
  const match = text.slice(text.lastIndexOf(completer.triggerPrefix)).match(new RegExp(`${safeTrigger}([\u0000-\uFFFF]*)$`));
323
325
  const query = match && match[1];
324
326
  setAutocompleter(completer);
@@ -356,11 +358,24 @@ function useAutocomplete(_ref) {
356
358
  };
357
359
  }
358
360
 
361
+ function useLastDifferentValue(value) {
362
+ const history = useRef(new Set());
363
+ history.current.add(value); // Keep the history size to 2.
364
+
365
+ if (history.current.size > 2) {
366
+ history.current.delete(Array.from(history.current)[0]);
367
+ }
368
+
369
+ return Array.from(history.current)[0];
370
+ }
371
+
359
372
  export function useAutocompleteProps(options) {
360
- const [isVisible, setIsVisible] = useState(false);
361
373
  const ref = useRef();
362
- const recordAfterInput = useRef();
363
374
  const onKeyDownRef = useRef();
375
+ const {
376
+ record
377
+ } = options;
378
+ const previousRecord = useLastDifferentValue(record);
364
379
  const {
365
380
  popover,
366
381
  listBoxId,
@@ -370,37 +385,20 @@ export function useAutocompleteProps(options) {
370
385
  contentRef: ref
371
386
  });
372
387
  onKeyDownRef.current = onKeyDown;
373
- useEffect(() => {
374
- if (isVisible) {
375
- if (!recordAfterInput.current) {
376
- recordAfterInput.current = options.record;
377
- } else if (recordAfterInput.current.start !== options.record.start || recordAfterInput.current.end !== options.record.end) {
378
- setIsVisible(false);
379
- recordAfterInput.current = null;
380
- }
381
- } // eslint-disable-next-line react-hooks/exhaustive-deps
382
-
383
- }, [options.record]);
384
388
  const mergedRefs = useMergeRefs([ref, useRefEffect(element => {
385
389
  function _onKeyDown(event) {
386
390
  onKeyDownRef.current(event);
387
391
  }
388
392
 
389
- function _onInput() {
390
- // Only show auto complete UI if the user is inputting text.
391
- setIsVisible(true);
392
- recordAfterInput.current = null;
393
- }
394
-
395
393
  element.addEventListener('keydown', _onKeyDown);
396
- element.addEventListener('input', _onInput);
397
394
  return () => {
398
395
  element.removeEventListener('keydown', _onKeyDown);
399
- element.removeEventListener('input', _onInput);
400
396
  };
401
- }, [])]);
397
+ }, [])]); // We only want to show the popover if the user has typed something.
398
+
399
+ const didUserInput = record.text !== (previousRecord === null || previousRecord === void 0 ? void 0 : previousRecord.text);
402
400
 
403
- if (!isVisible) {
401
+ if (!didUserInput) {
404
402
  return {
405
403
  ref: mergedRefs
406
404
  };