@wordpress/components 28.6.0 → 28.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (698) hide show
  1. package/CHANGELOG.md +122 -0
  2. package/CONTRIBUTING.md +42 -19
  3. package/build/alignment-matrix-control/cell.js +4 -7
  4. package/build/alignment-matrix-control/cell.js.map +1 -1
  5. package/build/alignment-matrix-control/icon.js +31 -19
  6. package/build/alignment-matrix-control/icon.js.map +1 -1
  7. package/build/alignment-matrix-control/index.js +55 -51
  8. package/build/alignment-matrix-control/index.js.map +1 -1
  9. package/build/alignment-matrix-control/styles.js +73 -0
  10. package/build/alignment-matrix-control/styles.js.map +1 -0
  11. package/build/alignment-matrix-control/types.js.map +1 -1
  12. package/build/angle-picker-control/angle-circle.js +9 -9
  13. package/build/angle-picker-control/angle-circle.js.map +1 -1
  14. package/build/border-control/border-control/component.js +18 -13
  15. package/build/border-control/border-control/component.js.map +1 -1
  16. package/build/box-control/all-input-control.js +1 -2
  17. package/build/box-control/all-input-control.js.map +1 -1
  18. package/build/box-control/utils.js +1 -1
  19. package/build/box-control/utils.js.map +1 -1
  20. package/build/card/card/component.js +2 -2
  21. package/build/card/card/component.js.map +1 -1
  22. package/build/card/styles.js +18 -18
  23. package/build/card/styles.js.map +1 -1
  24. package/build/circular-option-picker/circular-option-picker-option.js +15 -9
  25. package/build/circular-option-picker/circular-option-picker-option.js.map +1 -1
  26. package/build/circular-option-picker/circular-option-picker.js +15 -12
  27. package/build/circular-option-picker/circular-option-picker.js.map +1 -1
  28. package/build/circular-option-picker/types.js.map +1 -1
  29. package/build/clipboard-button/index.js +6 -6
  30. package/build/clipboard-button/index.js.map +1 -1
  31. package/build/color-palette/utils.js +1 -2
  32. package/build/color-palette/utils.js.map +1 -1
  33. package/build/color-picker/color-copy-button.js +8 -8
  34. package/build/color-picker/color-copy-button.js.map +1 -1
  35. package/build/color-picker/hex-input.js +8 -8
  36. package/build/color-picker/hex-input.js.map +1 -1
  37. package/build/color-picker/input-with-slider.js +8 -8
  38. package/build/color-picker/input-with-slider.js.map +1 -1
  39. package/build/color-picker/styles.js +8 -8
  40. package/build/color-picker/styles.js.map +1 -1
  41. package/build/combobox-control/index.js +3 -1
  42. package/build/combobox-control/index.js.map +1 -1
  43. package/build/combobox-control/types.js.map +1 -1
  44. package/build/composite/context.js +1 -1
  45. package/build/composite/context.js.map +1 -1
  46. package/build/composite/group-label.js +33 -0
  47. package/build/composite/group-label.js.map +1 -0
  48. package/build/composite/group.js +33 -0
  49. package/build/composite/group.js.map +1 -0
  50. package/build/composite/hover.js +33 -0
  51. package/build/composite/hover.js.map +1 -0
  52. package/build/composite/index.js +63 -118
  53. package/build/composite/index.js.map +1 -1
  54. package/build/composite/item.js +33 -0
  55. package/build/composite/item.js.map +1 -0
  56. package/build/composite/legacy/index.js +59 -7
  57. package/build/composite/legacy/index.js.map +1 -1
  58. package/build/composite/row.js +33 -0
  59. package/build/composite/row.js.map +1 -0
  60. package/build/composite/typeahead.js +33 -0
  61. package/build/composite/typeahead.js.map +1 -0
  62. package/build/composite/types.js.map +1 -1
  63. package/build/custom-gradient-picker/gradient-bar/control-points.js +8 -8
  64. package/build/custom-gradient-picker/gradient-bar/control-points.js.map +1 -1
  65. package/build/custom-select-control-v2/styles.js +12 -14
  66. package/build/custom-select-control-v2/styles.js.map +1 -1
  67. package/build/date-time/date/index.js +1 -1
  68. package/build/date-time/date/index.js.map +1 -1
  69. package/build/date-time/date/styles.js +37 -26
  70. package/build/date-time/date/styles.js.map +1 -1
  71. package/build/date-time/date/use-lilius/index.js +163 -0
  72. package/build/date-time/date/use-lilius/index.js.map +1 -0
  73. package/build/date-time/time/time-input/index.js +17 -19
  74. package/build/date-time/time/time-input/index.js.map +1 -1
  75. package/build/dimension-control/index.js +6 -1
  76. package/build/dimension-control/index.js.map +1 -1
  77. package/build/draggable/index.js +4 -4
  78. package/build/draggable/index.js.map +1 -1
  79. package/build/dropdown-menu-v2/checkbox-item.js +69 -0
  80. package/build/dropdown-menu-v2/checkbox-item.js.map +1 -0
  81. package/build/dropdown-menu-v2/context.js +17 -0
  82. package/build/dropdown-menu-v2/context.js.map +1 -0
  83. package/build/dropdown-menu-v2/group-label.js +40 -0
  84. package/build/dropdown-menu-v2/group-label.js.map +1 -0
  85. package/build/dropdown-menu-v2/group.js +29 -0
  86. package/build/dropdown-menu-v2/group.js.map +1 -0
  87. package/build/dropdown-menu-v2/index.js +58 -146
  88. package/build/dropdown-menu-v2/index.js.map +1 -1
  89. package/build/dropdown-menu-v2/item-help-text.js +27 -0
  90. package/build/dropdown-menu-v2/item-help-text.js.map +1 -0
  91. package/build/dropdown-menu-v2/item-label.js +27 -0
  92. package/build/dropdown-menu-v2/item-label.js.map +1 -0
  93. package/build/dropdown-menu-v2/item.js +53 -0
  94. package/build/dropdown-menu-v2/item.js.map +1 -0
  95. package/build/dropdown-menu-v2/radio-item.js +79 -0
  96. package/build/dropdown-menu-v2/radio-item.js.map +1 -0
  97. package/build/dropdown-menu-v2/separator.js +30 -0
  98. package/build/dropdown-menu-v2/separator.js.map +1 -0
  99. package/build/dropdown-menu-v2/styles.js +55 -79
  100. package/build/dropdown-menu-v2/styles.js.map +1 -1
  101. package/build/dropdown-menu-v2/types.js.map +1 -1
  102. package/build/dropdown-menu-v2/use-temporary-focus-visible-fix.js +27 -0
  103. package/build/dropdown-menu-v2/use-temporary-focus-visible-fix.js.map +1 -0
  104. package/build/focal-point-picker/styles/focal-point-style.js +7 -2
  105. package/build/focal-point-picker/styles/focal-point-style.js.map +1 -1
  106. package/build/form-token-field/types.js.map +1 -1
  107. package/build/index.js +13 -0
  108. package/build/index.js.map +1 -1
  109. package/build/input-control/index.js +2 -2
  110. package/build/input-control/index.js.map +1 -1
  111. package/build/input-control/input-base.js +5 -10
  112. package/build/input-control/input-base.js.map +1 -1
  113. package/build/input-control/input-prefix-wrapper.js +3 -3
  114. package/build/input-control/input-prefix-wrapper.js.map +1 -1
  115. package/build/input-control/input-suffix-wrapper.js +2 -3
  116. package/build/input-control/input-suffix-wrapper.js.map +1 -1
  117. package/build/input-control/reducer/reducer.js +8 -8
  118. package/build/input-control/reducer/reducer.js.map +1 -1
  119. package/build/input-control/styles/input-control-styles.js +75 -45
  120. package/build/input-control/styles/input-control-styles.js.map +1 -1
  121. package/build/input-control/types.js.map +1 -1
  122. package/build/input-control/utils.js +3 -3
  123. package/build/input-control/utils.js.map +1 -1
  124. package/build/item-group/styles.js +10 -10
  125. package/build/item-group/styles.js.map +1 -1
  126. package/build/modal/index.js +32 -17
  127. package/build/modal/index.js.map +1 -1
  128. package/build/modal/types.js.map +1 -1
  129. package/build/modal/use-modal-exit-animation.js +75 -0
  130. package/build/modal/use-modal-exit-animation.js.map +1 -0
  131. package/build/navigation/index.js +4 -4
  132. package/build/navigation/index.js.map +1 -1
  133. package/build/navigation/styles/navigation-styles.js +13 -13
  134. package/build/navigation/styles/navigation-styles.js.map +1 -1
  135. package/build/navigator/index.js +12 -13
  136. package/build/navigator/index.js.map +1 -1
  137. package/build/navigator/navigator-back-button/hook.js +2 -2
  138. package/build/navigator/navigator-back-button/hook.js.map +1 -1
  139. package/build/navigator/navigator-button/hook.js +2 -2
  140. package/build/navigator/navigator-button/hook.js.map +1 -1
  141. package/build/navigator/navigator-provider/component.js +99 -67
  142. package/build/navigator/navigator-provider/component.js.map +1 -1
  143. package/build/navigator/navigator-screen/component.js +5 -0
  144. package/build/navigator/navigator-screen/component.js.map +1 -1
  145. package/build/navigator/navigator-to-parent-button/component.js +2 -2
  146. package/build/navigator/navigator-to-parent-button/component.js.map +1 -1
  147. package/build/navigator/types.js.map +1 -1
  148. package/build/navigator/use-navigator.js +1 -2
  149. package/build/navigator/use-navigator.js.map +1 -1
  150. package/build/palette-edit/index.js +2 -2
  151. package/build/palette-edit/index.js.map +1 -1
  152. package/build/private-apis.js +1 -14
  153. package/build/private-apis.js.map +1 -1
  154. package/build/range-control/styles/range-control-styles.js +30 -30
  155. package/build/range-control/styles/range-control-styles.js.map +1 -1
  156. package/build/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js +4 -4
  157. package/build/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js.map +1 -1
  158. package/build/select-control/styles/select-control-styles.js +12 -12
  159. package/build/select-control/styles/select-control-styles.js.map +1 -1
  160. package/build/slot-fill/bubbles-virtually/fill.js +4 -4
  161. package/build/slot-fill/bubbles-virtually/fill.js.map +1 -1
  162. package/build/slot-fill/index.js +1 -0
  163. package/build/slot-fill/index.js.map +1 -1
  164. package/build/snackbar/index.js +4 -4
  165. package/build/snackbar/index.js.map +1 -1
  166. package/build/tabs/index.js +4 -4
  167. package/build/tabs/index.js.map +1 -1
  168. package/build/tabs/styles.js +3 -3
  169. package/build/tabs/styles.js.map +1 -1
  170. package/build/tabs/tablist.js +5 -4
  171. package/build/tabs/tablist.js.map +1 -1
  172. package/build/toggle-group-control/toggle-group-control/utils.js +6 -6
  173. package/build/toggle-group-control/toggle-group-control/utils.js.map +1 -1
  174. package/build/tools-panel/tools-panel/hook.js +6 -6
  175. package/build/tools-panel/tools-panel/hook.js.map +1 -1
  176. package/build/unit-control/styles/unit-control-styles.js +7 -7
  177. package/build/unit-control/styles/unit-control-styles.js.map +1 -1
  178. package/build/utils/config-values.js +10 -9
  179. package/build/utils/config-values.js.map +1 -1
  180. package/build/utils/element-rect.js +73 -105
  181. package/build/utils/element-rect.js.map +1 -1
  182. package/build/utils/hooks/use-update-effect.js +4 -4
  183. package/build/utils/hooks/use-update-effect.js.map +1 -1
  184. package/build-module/alignment-matrix-control/cell.js +2 -5
  185. package/build-module/alignment-matrix-control/cell.js.map +1 -1
  186. package/build-module/alignment-matrix-control/icon.js +31 -19
  187. package/build-module/alignment-matrix-control/icon.js.map +1 -1
  188. package/build-module/alignment-matrix-control/index.js +55 -50
  189. package/build-module/alignment-matrix-control/index.js.map +1 -1
  190. package/build-module/alignment-matrix-control/styles.js +70 -0
  191. package/build-module/alignment-matrix-control/styles.js.map +1 -0
  192. package/build-module/alignment-matrix-control/types.js.map +1 -1
  193. package/build-module/angle-picker-control/angle-circle.js +9 -9
  194. package/build-module/angle-picker-control/angle-circle.js.map +1 -1
  195. package/build-module/border-control/border-control/component.js +18 -13
  196. package/build-module/border-control/border-control/component.js.map +1 -1
  197. package/build-module/box-control/all-input-control.js +2 -2
  198. package/build-module/box-control/all-input-control.js.map +1 -1
  199. package/build-module/box-control/utils.js +1 -1
  200. package/build-module/box-control/utils.js.map +1 -1
  201. package/build-module/card/card/component.js +2 -2
  202. package/build-module/card/card/component.js.map +1 -1
  203. package/build-module/card/styles.js +18 -18
  204. package/build-module/card/styles.js.map +1 -1
  205. package/build-module/circular-option-picker/circular-option-picker-option.js +16 -10
  206. package/build-module/circular-option-picker/circular-option-picker-option.js.map +1 -1
  207. package/build-module/circular-option-picker/circular-option-picker.js +16 -13
  208. package/build-module/circular-option-picker/circular-option-picker.js.map +1 -1
  209. package/build-module/circular-option-picker/types.js.map +1 -1
  210. package/build-module/clipboard-button/index.js +6 -6
  211. package/build-module/clipboard-button/index.js.map +1 -1
  212. package/build-module/color-palette/utils.js +1 -2
  213. package/build-module/color-palette/utils.js.map +1 -1
  214. package/build-module/color-picker/color-copy-button.js +8 -8
  215. package/build-module/color-picker/color-copy-button.js.map +1 -1
  216. package/build-module/color-picker/hex-input.js +7 -8
  217. package/build-module/color-picker/hex-input.js.map +1 -1
  218. package/build-module/color-picker/input-with-slider.js +7 -8
  219. package/build-module/color-picker/input-with-slider.js.map +1 -1
  220. package/build-module/color-picker/styles.js +8 -8
  221. package/build-module/color-picker/styles.js.map +1 -1
  222. package/build-module/combobox-control/index.js +3 -1
  223. package/build-module/combobox-control/index.js.map +1 -1
  224. package/build-module/combobox-control/types.js.map +1 -1
  225. package/build-module/composite/context.js +1 -1
  226. package/build-module/composite/context.js.map +1 -1
  227. package/build-module/composite/group-label.js +25 -0
  228. package/build-module/composite/group-label.js.map +1 -0
  229. package/build-module/composite/group.js +25 -0
  230. package/build-module/composite/group.js.map +1 -0
  231. package/build-module/composite/hover.js +25 -0
  232. package/build-module/composite/hover.js.map +1 -0
  233. package/build-module/composite/index.js +64 -118
  234. package/build-module/composite/index.js.map +1 -1
  235. package/build-module/composite/item.js +25 -0
  236. package/build-module/composite/item.js.map +1 -0
  237. package/build-module/composite/legacy/index.js +57 -8
  238. package/build-module/composite/legacy/index.js.map +1 -1
  239. package/build-module/composite/row.js +25 -0
  240. package/build-module/composite/row.js.map +1 -0
  241. package/build-module/composite/typeahead.js +25 -0
  242. package/build-module/composite/typeahead.js.map +1 -0
  243. package/build-module/composite/types.js.map +1 -1
  244. package/build-module/custom-gradient-picker/gradient-bar/control-points.js +8 -8
  245. package/build-module/custom-gradient-picker/gradient-bar/control-points.js.map +1 -1
  246. package/build-module/custom-select-control-v2/styles.js +12 -14
  247. package/build-module/custom-select-control-v2/styles.js.map +1 -1
  248. package/build-module/date-time/date/index.js +1 -2
  249. package/build-module/date-time/date/index.js.map +1 -1
  250. package/build-module/date-time/date/styles.js +33 -26
  251. package/build-module/date-time/date/styles.js.map +1 -1
  252. package/build-module/date-time/date/use-lilius/index.js +158 -0
  253. package/build-module/date-time/date/use-lilius/index.js.map +1 -0
  254. package/build-module/date-time/time/time-input/index.js +17 -19
  255. package/build-module/date-time/time/time-input/index.js.map +1 -1
  256. package/build-module/dimension-control/index.js +6 -1
  257. package/build-module/dimension-control/index.js.map +1 -1
  258. package/build-module/draggable/index.js +4 -4
  259. package/build-module/draggable/index.js.map +1 -1
  260. package/build-module/dropdown-menu-v2/checkbox-item.js +62 -0
  261. package/build-module/dropdown-menu-v2/checkbox-item.js.map +1 -0
  262. package/build-module/dropdown-menu-v2/context.js +11 -0
  263. package/build-module/dropdown-menu-v2/context.js.map +1 -0
  264. package/build-module/dropdown-menu-v2/group-label.js +32 -0
  265. package/build-module/dropdown-menu-v2/group-label.js.map +1 -0
  266. package/build-module/dropdown-menu-v2/group.js +21 -0
  267. package/build-module/dropdown-menu-v2/group.js.map +1 -0
  268. package/build-module/dropdown-menu-v2/index.js +57 -144
  269. package/build-module/dropdown-menu-v2/index.js.map +1 -1
  270. package/build-module/dropdown-menu-v2/item-help-text.js +19 -0
  271. package/build-module/dropdown-menu-v2/item-help-text.js.map +1 -0
  272. package/build-module/dropdown-menu-v2/item-label.js +19 -0
  273. package/build-module/dropdown-menu-v2/item-label.js.map +1 -0
  274. package/build-module/dropdown-menu-v2/item.js +46 -0
  275. package/build-module/dropdown-menu-v2/item.js.map +1 -0
  276. package/build-module/dropdown-menu-v2/radio-item.js +72 -0
  277. package/build-module/dropdown-menu-v2/radio-item.js.map +1 -0
  278. package/build-module/dropdown-menu-v2/separator.js +22 -0
  279. package/build-module/dropdown-menu-v2/separator.js.map +1 -0
  280. package/build-module/dropdown-menu-v2/styles.js +55 -79
  281. package/build-module/dropdown-menu-v2/styles.js.map +1 -1
  282. package/build-module/dropdown-menu-v2/types.js.map +1 -1
  283. package/build-module/dropdown-menu-v2/use-temporary-focus-visible-fix.js +20 -0
  284. package/build-module/dropdown-menu-v2/use-temporary-focus-visible-fix.js.map +1 -0
  285. package/build-module/focal-point-picker/styles/focal-point-style.js +6 -2
  286. package/build-module/focal-point-picker/styles/focal-point-style.js.map +1 -1
  287. package/build-module/form-token-field/types.js.map +1 -1
  288. package/build-module/index.js +3 -1
  289. package/build-module/index.js.map +1 -1
  290. package/build-module/input-control/index.js +2 -2
  291. package/build-module/input-control/index.js.map +1 -1
  292. package/build-module/input-control/input-base.js +6 -11
  293. package/build-module/input-control/input-base.js.map +1 -1
  294. package/build-module/input-control/input-prefix-wrapper.js +4 -3
  295. package/build-module/input-control/input-prefix-wrapper.js.map +1 -1
  296. package/build-module/input-control/input-suffix-wrapper.js +3 -3
  297. package/build-module/input-control/input-suffix-wrapper.js.map +1 -1
  298. package/build-module/input-control/reducer/reducer.js +8 -8
  299. package/build-module/input-control/reducer/reducer.js.map +1 -1
  300. package/build-module/input-control/styles/input-control-styles.js +74 -44
  301. package/build-module/input-control/styles/input-control-styles.js.map +1 -1
  302. package/build-module/input-control/types.js.map +1 -1
  303. package/build-module/input-control/utils.js +3 -3
  304. package/build-module/input-control/utils.js.map +1 -1
  305. package/build-module/item-group/styles.js +10 -10
  306. package/build-module/item-group/styles.js.map +1 -1
  307. package/build-module/modal/index.js +34 -17
  308. package/build-module/modal/index.js.map +1 -1
  309. package/build-module/modal/types.js.map +1 -1
  310. package/build-module/modal/use-modal-exit-animation.js +68 -0
  311. package/build-module/modal/use-modal-exit-animation.js.map +1 -0
  312. package/build-module/navigation/index.js +4 -4
  313. package/build-module/navigation/index.js.map +1 -1
  314. package/build-module/navigation/styles/navigation-styles.js +14 -14
  315. package/build-module/navigation/styles/navigation-styles.js.map +1 -1
  316. package/build-module/navigator/index.js +6 -6
  317. package/build-module/navigator/index.js.map +1 -1
  318. package/build-module/navigator/navigator-back-button/hook.js +1 -1
  319. package/build-module/navigator/navigator-back-button/hook.js.map +1 -1
  320. package/build-module/navigator/navigator-button/hook.js +1 -1
  321. package/build-module/navigator/navigator-button/hook.js.map +1 -1
  322. package/build-module/navigator/navigator-provider/component.js +99 -67
  323. package/build-module/navigator/navigator-provider/component.js.map +1 -1
  324. package/build-module/navigator/navigator-screen/component.js +4 -0
  325. package/build-module/navigator/navigator-screen/component.js.map +1 -1
  326. package/build-module/navigator/navigator-to-parent-button/component.js +1 -1
  327. package/build-module/navigator/navigator-to-parent-button/component.js.map +1 -1
  328. package/build-module/navigator/types.js.map +1 -1
  329. package/build-module/navigator/use-navigator.js +1 -2
  330. package/build-module/navigator/use-navigator.js.map +1 -1
  331. package/build-module/palette-edit/index.js +2 -2
  332. package/build-module/palette-edit/index.js.map +1 -1
  333. package/build-module/private-apis.js +1 -14
  334. package/build-module/private-apis.js.map +1 -1
  335. package/build-module/range-control/styles/range-control-styles.js +31 -31
  336. package/build-module/range-control/styles/range-control-styles.js.map +1 -1
  337. package/build-module/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js +5 -5
  338. package/build-module/resizable-box/resize-tooltip/styles/resize-tooltip.styles.js.map +1 -1
  339. package/build-module/select-control/styles/select-control-styles.js +13 -13
  340. package/build-module/select-control/styles/select-control-styles.js.map +1 -1
  341. package/build-module/slot-fill/bubbles-virtually/fill.js +4 -4
  342. package/build-module/slot-fill/bubbles-virtually/fill.js.map +1 -1
  343. package/build-module/slot-fill/index.js +1 -0
  344. package/build-module/slot-fill/index.js.map +1 -1
  345. package/build-module/snackbar/index.js +4 -4
  346. package/build-module/snackbar/index.js.map +1 -1
  347. package/build-module/tabs/index.js +4 -4
  348. package/build-module/tabs/index.js.map +1 -1
  349. package/build-module/tabs/styles.js +4 -4
  350. package/build-module/tabs/styles.js.map +1 -1
  351. package/build-module/tabs/tablist.js +5 -4
  352. package/build-module/tabs/tablist.js.map +1 -1
  353. package/build-module/toggle-group-control/toggle-group-control/utils.js +6 -6
  354. package/build-module/toggle-group-control/toggle-group-control/utils.js.map +1 -1
  355. package/build-module/tools-panel/tools-panel/hook.js +6 -6
  356. package/build-module/tools-panel/tools-panel/hook.js.map +1 -1
  357. package/build-module/unit-control/styles/unit-control-styles.js +7 -7
  358. package/build-module/unit-control/styles/unit-control-styles.js.map +1 -1
  359. package/build-module/utils/config-values.js +10 -9
  360. package/build-module/utils/config-values.js.map +1 -1
  361. package/build-module/utils/element-rect.js +74 -105
  362. package/build-module/utils/element-rect.js.map +1 -1
  363. package/build-module/utils/hooks/use-update-effect.js +4 -4
  364. package/build-module/utils/hooks/use-update-effect.js.map +1 -1
  365. package/build-style/style-rtl.css +60 -31
  366. package/build-style/style.css +60 -31
  367. package/build-types/alignment-matrix-control/cell.d.ts +1 -1
  368. package/build-types/alignment-matrix-control/cell.d.ts.map +1 -1
  369. package/build-types/alignment-matrix-control/icon.d.ts +1 -1
  370. package/build-types/alignment-matrix-control/icon.d.ts.map +1 -1
  371. package/build-types/alignment-matrix-control/index.d.ts +16 -6
  372. package/build-types/alignment-matrix-control/index.d.ts.map +1 -1
  373. package/build-types/alignment-matrix-control/stories/index.story.d.ts.map +1 -1
  374. package/build-types/alignment-matrix-control/{styles/alignment-matrix-control-styles.d.ts → styles.d.ts} +9 -10
  375. package/build-types/alignment-matrix-control/styles.d.ts.map +1 -0
  376. package/build-types/alignment-matrix-control/types.d.ts +12 -1
  377. package/build-types/alignment-matrix-control/types.d.ts.map +1 -1
  378. package/build-types/angle-picker-control/angle-circle.d.ts.map +1 -1
  379. package/build-types/border-control/border-control/component.d.ts.map +1 -1
  380. package/build-types/box-control/all-input-control.d.ts.map +1 -1
  381. package/build-types/box-control/stories/index.story.d.ts.map +1 -1
  382. package/build-types/box-control/utils.d.ts +1 -1
  383. package/build-types/box-control/utils.d.ts.map +1 -1
  384. package/build-types/button-group/stories/index.story.d.ts +2 -2
  385. package/build-types/button-group/stories/index.story.d.ts.map +1 -1
  386. package/build-types/circular-option-picker/circular-option-picker-option.d.ts.map +1 -1
  387. package/build-types/circular-option-picker/circular-option-picker.d.ts.map +1 -1
  388. package/build-types/circular-option-picker/types.d.ts +2 -2
  389. package/build-types/circular-option-picker/types.d.ts.map +1 -1
  390. package/build-types/color-palette/utils.d.ts.map +1 -1
  391. package/build-types/color-picker/color-copy-button.d.ts.map +1 -1
  392. package/build-types/color-picker/hex-input.d.ts.map +1 -1
  393. package/build-types/color-picker/input-with-slider.d.ts.map +1 -1
  394. package/build-types/color-picker/styles.d.ts.map +1 -1
  395. package/build-types/combobox-control/index.d.ts.map +1 -1
  396. package/build-types/combobox-control/stories/index.story.d.ts +4 -0
  397. package/build-types/combobox-control/stories/index.story.d.ts.map +1 -1
  398. package/build-types/combobox-control/types.d.ts +5 -0
  399. package/build-types/combobox-control/types.d.ts.map +1 -1
  400. package/build-types/composite/context.d.ts.map +1 -1
  401. package/build-types/composite/group-label.d.ts +3 -0
  402. package/build-types/composite/group-label.d.ts.map +1 -0
  403. package/build-types/composite/group.d.ts +3 -0
  404. package/build-types/composite/group.d.ts.map +1 -0
  405. package/build-types/composite/hover.d.ts +3 -0
  406. package/build-types/composite/hover.d.ts.map +1 -0
  407. package/build-types/composite/index.d.ts +63 -47
  408. package/build-types/composite/index.d.ts.map +1 -1
  409. package/build-types/composite/item.d.ts +3 -0
  410. package/build-types/composite/item.d.ts.map +1 -0
  411. package/build-types/composite/legacy/index.d.ts +23 -3
  412. package/build-types/composite/legacy/index.d.ts.map +1 -1
  413. package/build-types/composite/legacy/stories/index.story.d.ts.map +1 -1
  414. package/build-types/composite/row.d.ts +3 -0
  415. package/build-types/composite/row.d.ts.map +1 -0
  416. package/build-types/composite/stories/index.story.d.ts +9 -8
  417. package/build-types/composite/stories/index.story.d.ts.map +1 -1
  418. package/build-types/composite/typeahead.d.ts +3 -0
  419. package/build-types/composite/typeahead.d.ts.map +1 -0
  420. package/build-types/composite/types.d.ts +12 -11
  421. package/build-types/composite/types.d.ts.map +1 -1
  422. package/build-types/custom-select-control-v2/styles.d.ts.map +1 -1
  423. package/build-types/date-time/date/index.d.ts +0 -3
  424. package/build-types/date-time/date/index.d.ts.map +1 -1
  425. package/build-types/date-time/date/styles.d.ts.map +1 -1
  426. package/build-types/date-time/date/test/use-lilius.d.ts +2 -0
  427. package/build-types/date-time/date/test/use-lilius.d.ts.map +1 -0
  428. package/build-types/date-time/date/use-lilius/index.d.ts +169 -0
  429. package/build-types/date-time/date/use-lilius/index.d.ts.map +1 -0
  430. package/build-types/date-time/time/time-input/index.d.ts.map +1 -1
  431. package/build-types/dimension-control/index.d.ts +1 -1
  432. package/build-types/dimension-control/index.d.ts.map +1 -1
  433. package/build-types/dimension-control/stories/index.story.d.ts +5 -0
  434. package/build-types/dimension-control/stories/index.story.d.ts.map +1 -1
  435. package/build-types/dropdown-menu-v2/checkbox-item.d.ts +3 -0
  436. package/build-types/dropdown-menu-v2/checkbox-item.d.ts.map +1 -0
  437. package/build-types/dropdown-menu-v2/context.d.ts +6 -0
  438. package/build-types/dropdown-menu-v2/context.d.ts.map +1 -0
  439. package/build-types/dropdown-menu-v2/group-label.d.ts +3 -0
  440. package/build-types/dropdown-menu-v2/group-label.d.ts.map +1 -0
  441. package/build-types/dropdown-menu-v2/group.d.ts +3 -0
  442. package/build-types/dropdown-menu-v2/group.d.ts.map +1 -0
  443. package/build-types/dropdown-menu-v2/index.d.ts +39 -18
  444. package/build-types/dropdown-menu-v2/index.d.ts.map +1 -1
  445. package/build-types/dropdown-menu-v2/item-help-text.d.ts +6 -0
  446. package/build-types/dropdown-menu-v2/item-help-text.d.ts.map +1 -0
  447. package/build-types/dropdown-menu-v2/item-label.d.ts +6 -0
  448. package/build-types/dropdown-menu-v2/item-label.d.ts.map +1 -0
  449. package/build-types/dropdown-menu-v2/item.d.ts +3 -0
  450. package/build-types/dropdown-menu-v2/item.d.ts.map +1 -0
  451. package/build-types/dropdown-menu-v2/radio-item.d.ts +3 -0
  452. package/build-types/dropdown-menu-v2/radio-item.d.ts.map +1 -0
  453. package/build-types/dropdown-menu-v2/separator.d.ts +3 -0
  454. package/build-types/dropdown-menu-v2/separator.d.ts.map +1 -0
  455. package/build-types/dropdown-menu-v2/stories/index.story.d.ts +10 -10
  456. package/build-types/dropdown-menu-v2/stories/index.story.d.ts.map +1 -1
  457. package/build-types/dropdown-menu-v2/styles.d.ts +14 -6
  458. package/build-types/dropdown-menu-v2/styles.d.ts.map +1 -1
  459. package/build-types/dropdown-menu-v2/types.d.ts +6 -0
  460. package/build-types/dropdown-menu-v2/types.d.ts.map +1 -1
  461. package/build-types/dropdown-menu-v2/use-temporary-focus-visible-fix.d.ts +8 -0
  462. package/build-types/dropdown-menu-v2/use-temporary-focus-visible-fix.d.ts.map +1 -0
  463. package/build-types/focal-point-picker/styles/focal-point-style.d.ts.map +1 -1
  464. package/build-types/form-token-field/types.d.ts +1 -0
  465. package/build-types/form-token-field/types.d.ts.map +1 -1
  466. package/build-types/index.d.ts +4 -1
  467. package/build-types/index.d.ts.map +1 -1
  468. package/build-types/input-control/input-base.d.ts.map +1 -1
  469. package/build-types/input-control/input-prefix-wrapper.d.ts +2 -2
  470. package/build-types/input-control/input-prefix-wrapper.d.ts.map +1 -1
  471. package/build-types/input-control/input-suffix-wrapper.d.ts +2 -2
  472. package/build-types/input-control/input-suffix-wrapper.d.ts.map +1 -1
  473. package/build-types/input-control/reducer/reducer.d.ts.map +1 -1
  474. package/build-types/input-control/stories/index.story.d.ts +9 -0
  475. package/build-types/input-control/stories/index.story.d.ts.map +1 -1
  476. package/build-types/input-control/styles/input-control-styles.d.ts +15 -9
  477. package/build-types/input-control/styles/input-control-styles.d.ts.map +1 -1
  478. package/build-types/input-control/types.d.ts +23 -6
  479. package/build-types/input-control/types.d.ts.map +1 -1
  480. package/build-types/modal/index.d.ts.map +1 -1
  481. package/build-types/modal/stories/index.story.d.ts +3 -0
  482. package/build-types/modal/stories/index.story.d.ts.map +1 -1
  483. package/build-types/modal/types.d.ts +6 -10
  484. package/build-types/modal/types.d.ts.map +1 -1
  485. package/build-types/modal/use-modal-exit-animation.d.ts +9 -0
  486. package/build-types/modal/use-modal-exit-animation.d.ts.map +1 -0
  487. package/build-types/navigation/styles/navigation-styles.d.ts.map +1 -1
  488. package/build-types/navigator/index.d.ts +6 -6
  489. package/build-types/navigator/index.d.ts.map +1 -1
  490. package/build-types/navigator/navigator-provider/component.d.ts.map +1 -1
  491. package/build-types/navigator/navigator-screen/component.d.ts.map +1 -1
  492. package/build-types/navigator/stories/index.story.d.ts +1 -1
  493. package/build-types/navigator/stories/index.story.d.ts.map +1 -1
  494. package/build-types/navigator/types.d.ts +3 -1
  495. package/build-types/navigator/types.d.ts.map +1 -1
  496. package/build-types/navigator/use-navigator.d.ts +1 -2
  497. package/build-types/navigator/use-navigator.d.ts.map +1 -1
  498. package/build-types/private-apis.d.ts.map +1 -1
  499. package/build-types/range-control/styles/range-control-styles.d.ts.map +1 -1
  500. package/build-types/resizable-box/resize-tooltip/styles/resize-tooltip.styles.d.ts.map +1 -1
  501. package/build-types/select-control/styles/select-control-styles.d.ts +1 -1
  502. package/build-types/select-control/styles/select-control-styles.d.ts.map +1 -1
  503. package/build-types/slot-fill/index.d.ts +3 -0
  504. package/build-types/slot-fill/index.d.ts.map +1 -1
  505. package/build-types/tabs/index.d.ts.map +1 -1
  506. package/build-types/tabs/styles.d.ts.map +1 -1
  507. package/build-types/tabs/tablist.d.ts.map +1 -1
  508. package/build-types/unit-control/styles/unit-control-styles.d.ts.map +1 -1
  509. package/build-types/utils/config-values.d.ts +3 -4
  510. package/build-types/utils/element-rect.d.ts +32 -74
  511. package/build-types/utils/element-rect.d.ts.map +1 -1
  512. package/package.json +19 -20
  513. package/src/alignment-matrix-control/README.md +1 -5
  514. package/src/alignment-matrix-control/cell.tsx +3 -9
  515. package/src/alignment-matrix-control/icon.tsx +48 -30
  516. package/src/alignment-matrix-control/index.tsx +60 -50
  517. package/src/alignment-matrix-control/stories/index.story.tsx +3 -12
  518. package/src/alignment-matrix-control/styles.ts +113 -0
  519. package/src/alignment-matrix-control/types.ts +12 -1
  520. package/src/angle-picker-control/angle-circle.tsx +11 -9
  521. package/src/border-control/border-control/component.tsx +23 -16
  522. package/src/box-control/README.md +7 -0
  523. package/src/box-control/all-input-control.tsx +2 -3
  524. package/src/box-control/utils.ts +1 -1
  525. package/src/button-group/stories/index.story.tsx +10 -15
  526. package/src/card/card/component.tsx +1 -1
  527. package/src/card/styles.ts +1 -1
  528. package/src/card/test/__snapshots__/index.tsx.snap +54 -54
  529. package/src/circular-option-picker/circular-option-picker-option.tsx +16 -19
  530. package/src/circular-option-picker/circular-option-picker.tsx +26 -12
  531. package/src/circular-option-picker/types.ts +2 -2
  532. package/src/clipboard-button/index.tsx +6 -6
  533. package/src/color-palette/test/utils.ts +21 -2
  534. package/src/color-palette/utils.ts +1 -3
  535. package/src/color-picker/color-copy-button.tsx +10 -8
  536. package/src/color-picker/hex-input.tsx +6 -10
  537. package/src/color-picker/input-with-slider.tsx +6 -10
  538. package/src/color-picker/styles.ts +1 -1
  539. package/src/combobox-control/README.md +7 -0
  540. package/src/combobox-control/index.tsx +2 -0
  541. package/src/combobox-control/test/index.tsx +40 -0
  542. package/src/combobox-control/types.ts +5 -0
  543. package/src/composite/README.md +5 -24
  544. package/src/composite/{context.ts → context.tsx} +1 -2
  545. package/src/composite/group-label.tsx +30 -0
  546. package/src/composite/group.tsx +30 -0
  547. package/src/composite/hover.tsx +30 -0
  548. package/src/composite/index.tsx +71 -166
  549. package/src/composite/item.tsx +30 -0
  550. package/src/composite/legacy/index.tsx +73 -11
  551. package/src/composite/legacy/stories/index.story.tsx +2 -1
  552. package/src/composite/legacy/test/index.tsx +57 -1
  553. package/src/composite/row.tsx +30 -0
  554. package/src/composite/stories/index.story.tsx +254 -365
  555. package/src/composite/typeahead.tsx +30 -0
  556. package/src/composite/types.ts +14 -16
  557. package/src/custom-gradient-picker/gradient-bar/control-points.tsx +10 -10
  558. package/src/custom-gradient-picker/style.scss +2 -21
  559. package/src/custom-select-control-v2/styles.ts +5 -4
  560. package/src/date-time/date/index.tsx +1 -1
  561. package/src/date-time/date/styles.ts +33 -13
  562. package/src/date-time/date/test/use-lilius.ts +417 -0
  563. package/src/date-time/date/use-lilius/index.ts +394 -0
  564. package/src/date-time/time/test/index.tsx +3 -6
  565. package/src/date-time/time/time-input/index.tsx +25 -25
  566. package/src/date-time/time/time-input/test/index.tsx +6 -7
  567. package/src/dimension-control/README.md +4 -0
  568. package/src/dimension-control/index.tsx +7 -1
  569. package/src/dimension-control/stories/index.story.tsx +7 -2
  570. package/src/dimension-control/test/__snapshots__/index.test.js.snap +16 -16
  571. package/src/dimension-control/test/index.test.js +1 -0
  572. package/src/draggable/index.tsx +4 -4
  573. package/src/dropdown-menu-v2/README.md +73 -60
  574. package/src/dropdown-menu-v2/checkbox-item.tsx +63 -0
  575. package/src/dropdown-menu-v2/context.tsx +13 -0
  576. package/src/dropdown-menu-v2/group-label.tsx +37 -0
  577. package/src/dropdown-menu-v2/group.tsx +26 -0
  578. package/src/dropdown-menu-v2/index.tsx +57 -197
  579. package/src/dropdown-menu-v2/item-help-text.tsx +23 -0
  580. package/src/dropdown-menu-v2/item-label.tsx +23 -0
  581. package/src/dropdown-menu-v2/item.tsx +50 -0
  582. package/src/dropdown-menu-v2/radio-item.tsx +70 -0
  583. package/src/dropdown-menu-v2/separator.tsx +27 -0
  584. package/src/dropdown-menu-v2/stories/index.story.tsx +295 -262
  585. package/src/dropdown-menu-v2/styles.ts +103 -67
  586. package/src/dropdown-menu-v2/test/index.tsx +159 -132
  587. package/src/dropdown-menu-v2/types.ts +7 -0
  588. package/src/dropdown-menu-v2/use-temporary-focus-visible-fix.ts +22 -0
  589. package/src/focal-point-picker/styles/focal-point-style.ts +6 -1
  590. package/src/form-toggle/style.scss +2 -1
  591. package/src/form-token-field/style.scss +2 -3
  592. package/src/form-token-field/types.ts +1 -0
  593. package/src/index.ts +6 -1
  594. package/src/input-control/index.tsx +2 -2
  595. package/src/input-control/input-base.tsx +4 -14
  596. package/src/input-control/input-prefix-wrapper.tsx +8 -4
  597. package/src/input-control/input-suffix-wrapper.tsx +4 -6
  598. package/src/input-control/reducer/reducer.ts +13 -10
  599. package/src/input-control/stories/index.story.tsx +31 -12
  600. package/src/input-control/styles/input-control-styles.tsx +42 -11
  601. package/src/input-control/types.ts +23 -7
  602. package/src/input-control/utils.ts +3 -3
  603. package/src/item-group/styles.ts +3 -3
  604. package/src/item-group/test/__snapshots__/index.js.snap +3 -3
  605. package/src/modal/index.tsx +47 -24
  606. package/src/modal/stories/index.story.tsx +8 -14
  607. package/src/modal/style.scss +34 -11
  608. package/src/modal/types.ts +6 -18
  609. package/src/modal/use-modal-exit-animation.ts +99 -0
  610. package/src/navigation/index.tsx +4 -4
  611. package/src/navigation/styles/navigation-styles.tsx +3 -3
  612. package/src/navigator/index.ts +6 -6
  613. package/src/navigator/navigator-back-button/hook.ts +1 -1
  614. package/src/navigator/navigator-button/hook.ts +1 -1
  615. package/src/navigator/navigator-provider/README.md +2 -3
  616. package/src/navigator/navigator-provider/component.tsx +97 -82
  617. package/src/navigator/navigator-screen/component.tsx +7 -0
  618. package/src/navigator/navigator-to-parent-button/component.tsx +1 -1
  619. package/src/navigator/stories/index.story.tsx +82 -253
  620. package/src/navigator/test/index.tsx +8 -0
  621. package/src/navigator/types.ts +3 -1
  622. package/src/navigator/use-navigator.ts +1 -3
  623. package/src/palette-edit/index.tsx +2 -2
  624. package/src/popover/style.scss +3 -2
  625. package/src/private-apis.ts +1 -23
  626. package/src/range-control/styles/range-control-styles.ts +8 -7
  627. package/src/resizable-box/resize-tooltip/styles/resize-tooltip.styles.ts +2 -2
  628. package/src/resizable-box/style.scss +3 -3
  629. package/src/select-control/README.md +2 -2
  630. package/src/select-control/styles/select-control-styles.ts +5 -5
  631. package/src/slot-fill/bubbles-virtually/fill.tsx +4 -4
  632. package/src/slot-fill/index.tsx +1 -0
  633. package/src/snackbar/index.tsx +4 -4
  634. package/src/snackbar/style.scss +1 -1
  635. package/src/tab-panel/style.scss +0 -1
  636. package/src/tabs/index.tsx +8 -4
  637. package/src/tabs/styles.ts +42 -14
  638. package/src/tabs/tablist.tsx +5 -4
  639. package/src/text-control/style.scss +3 -2
  640. package/src/toggle-group-control/toggle-group-control/utils.ts +7 -7
  641. package/src/tools-panel/tools-panel/hook.ts +6 -6
  642. package/src/tooltip/style.scss +1 -0
  643. package/src/unit-control/styles/unit-control-styles.ts +2 -1
  644. package/src/utils/config-values.js +10 -9
  645. package/src/utils/element-rect.ts +93 -130
  646. package/src/utils/hooks/use-update-effect.js +4 -4
  647. package/tsconfig.tsbuildinfo +1 -1
  648. package/build/alignment-matrix-control/styles/alignment-matrix-control-icon-styles.js +0 -66
  649. package/build/alignment-matrix-control/styles/alignment-matrix-control-icon-styles.js.map +0 -1
  650. package/build/alignment-matrix-control/styles/alignment-matrix-control-styles.js +0 -77
  651. package/build/alignment-matrix-control/styles/alignment-matrix-control-styles.js.map +0 -1
  652. package/build/navigator/navigator-back-button/index.js +0 -14
  653. package/build/navigator/navigator-back-button/index.js.map +0 -1
  654. package/build/navigator/navigator-button/index.js +0 -14
  655. package/build/navigator/navigator-button/index.js.map +0 -1
  656. package/build/navigator/navigator-provider/index.js +0 -14
  657. package/build/navigator/navigator-provider/index.js.map +0 -1
  658. package/build/navigator/navigator-screen/index.js +0 -14
  659. package/build/navigator/navigator-screen/index.js.map +0 -1
  660. package/build/navigator/navigator-to-parent-button/index.js +0 -14
  661. package/build/navigator/navigator-to-parent-button/index.js.map +0 -1
  662. package/build-module/alignment-matrix-control/styles/alignment-matrix-control-icon-styles.js +0 -63
  663. package/build-module/alignment-matrix-control/styles/alignment-matrix-control-icon-styles.js.map +0 -1
  664. package/build-module/alignment-matrix-control/styles/alignment-matrix-control-styles.js +0 -72
  665. package/build-module/alignment-matrix-control/styles/alignment-matrix-control-styles.js.map +0 -1
  666. package/build-module/navigator/navigator-back-button/index.js +0 -2
  667. package/build-module/navigator/navigator-back-button/index.js.map +0 -1
  668. package/build-module/navigator/navigator-button/index.js +0 -2
  669. package/build-module/navigator/navigator-button/index.js.map +0 -1
  670. package/build-module/navigator/navigator-provider/index.js +0 -2
  671. package/build-module/navigator/navigator-provider/index.js.map +0 -1
  672. package/build-module/navigator/navigator-screen/index.js +0 -2
  673. package/build-module/navigator/navigator-screen/index.js.map +0 -1
  674. package/build-module/navigator/navigator-to-parent-button/index.js +0 -2
  675. package/build-module/navigator/navigator-to-parent-button/index.js.map +0 -1
  676. package/build-types/alignment-matrix-control/styles/alignment-matrix-control-icon-styles.d.ts +0 -18
  677. package/build-types/alignment-matrix-control/styles/alignment-matrix-control-icon-styles.d.ts.map +0 -1
  678. package/build-types/alignment-matrix-control/styles/alignment-matrix-control-styles.d.ts.map +0 -1
  679. package/build-types/composite/stories/utils.d.ts +0 -29
  680. package/build-types/composite/stories/utils.d.ts.map +0 -1
  681. package/build-types/navigator/navigator-back-button/index.d.ts +0 -2
  682. package/build-types/navigator/navigator-back-button/index.d.ts.map +0 -1
  683. package/build-types/navigator/navigator-button/index.d.ts +0 -2
  684. package/build-types/navigator/navigator-button/index.d.ts.map +0 -1
  685. package/build-types/navigator/navigator-provider/index.d.ts +0 -2
  686. package/build-types/navigator/navigator-provider/index.d.ts.map +0 -1
  687. package/build-types/navigator/navigator-screen/index.d.ts +0 -2
  688. package/build-types/navigator/navigator-screen/index.d.ts.map +0 -1
  689. package/build-types/navigator/navigator-to-parent-button/index.d.ts +0 -2
  690. package/build-types/navigator/navigator-to-parent-button/index.d.ts.map +0 -1
  691. package/src/alignment-matrix-control/styles/alignment-matrix-control-icon-styles.ts +0 -77
  692. package/src/alignment-matrix-control/styles/alignment-matrix-control-styles.ts +0 -102
  693. package/src/composite/stories/utils.tsx +0 -76
  694. package/src/navigator/navigator-back-button/index.ts +0 -1
  695. package/src/navigator/navigator-button/index.ts +0 -1
  696. package/src/navigator/navigator-provider/index.ts +0 -1
  697. package/src/navigator/navigator-screen/index.ts +0 -1
  698. package/src/navigator/navigator-to-parent-button/index.ts +0 -1
@@ -16,125 +16,64 @@ import * as Ariakit from '@ariakit/react';
16
16
  /**
17
17
  * WordPress dependencies
18
18
  */
19
+ import { isRTL } from '@wordpress/i18n';
19
20
  import { useMemo, forwardRef } from '@wordpress/element';
20
21
 
21
22
  /**
22
23
  * Internal dependencies
23
24
  */
24
25
 
25
- import { CompositeContext, useCompositeContext } from './context';
26
+ import { CompositeContext } from './context';
27
+ import { CompositeGroup } from './group';
28
+ import { CompositeGroupLabel } from './group-label';
29
+ import { CompositeHover } from './hover';
30
+ import { CompositeItem } from './item';
31
+ import { CompositeRow } from './row';
32
+ import { CompositeTypeahead } from './typeahead';
26
33
  import { jsx as _jsx } from "react/jsx-runtime";
27
34
  /**
28
- * Creates a composite store.
35
+ * Renders a widget based on the WAI-ARIA [`composite`](https://w3c.github.io/aria/#composite)
36
+ * role, which provides a single tab stop on the page and arrow key navigation
37
+ * through the focusable descendants.
29
38
  *
30
39
  * @example
31
40
  * ```jsx
32
- * import { Composite, useCompositeStore } from '@wordpress/components';
41
+ * import { Composite } from '@wordpress/components';
33
42
  *
34
- * const store = useCompositeStore();
35
- * <Composite store={store}>
36
- * <Composite.Item>Item</Composite.Item>
37
- * <Composite.Item>Item</Composite.Item>
38
- * <Composite.Item>Item</Composite.Item>
43
+ * <Composite>
44
+ * <Composite.Item>Item 1</Composite.Item>
45
+ * <Composite.Item>Item 2</Composite.Item>
39
46
  * </Composite>
40
47
  * ```
41
48
  */
42
- export function useCompositeStore({
49
+ export const Composite = Object.assign(forwardRef(function Composite({
50
+ // Composite store props
51
+ activeId,
52
+ defaultActiveId,
53
+ setActiveId,
43
54
  focusLoop = false,
44
55
  focusWrap = false,
45
56
  focusShift = false,
46
57
  virtualFocus = false,
47
58
  orientation = 'both',
48
- rtl = false,
59
+ rtl = isRTL(),
60
+ // Composite component props
61
+ children,
62
+ disabled = false,
63
+ // Rest props
49
64
  ...props
50
- } = {}) {
51
- return Ariakit.useCompositeStore({
65
+ }, ref) {
66
+ const store = Ariakit.useCompositeStore({
67
+ activeId,
68
+ defaultActiveId,
69
+ setActiveId,
52
70
  focusLoop,
53
71
  focusWrap,
54
72
  focusShift,
55
73
  virtualFocus,
56
74
  orientation,
57
- rtl,
58
- ...props
59
- });
60
- }
61
- const Group = forwardRef(function CompositeGroup(props, ref) {
62
- const context = useCompositeContext();
63
- return /*#__PURE__*/_jsx(Ariakit.CompositeGroup, {
64
- store: context?.store,
65
- ...props,
66
- ref: ref
67
- });
68
- });
69
- Group.displayName = 'Composite.Group';
70
- const GroupLabel = forwardRef(function CompositeGroupLabel(props, ref) {
71
- const context = useCompositeContext();
72
- return /*#__PURE__*/_jsx(Ariakit.CompositeGroupLabel, {
73
- store: context?.store,
74
- ...props,
75
- ref: ref
76
- });
77
- });
78
- GroupLabel.displayName = 'Composite.GroupLabel';
79
- const Item = forwardRef(function CompositeItem(props, ref) {
80
- const context = useCompositeContext();
81
- return /*#__PURE__*/_jsx(Ariakit.CompositeItem, {
82
- store: context?.store,
83
- ...props,
84
- ref: ref
85
- });
86
- });
87
- Item.displayName = 'Composite.Item';
88
- const Row = forwardRef(function CompositeRow(props, ref) {
89
- const context = useCompositeContext();
90
- return /*#__PURE__*/_jsx(Ariakit.CompositeRow, {
91
- store: context?.store,
92
- ...props,
93
- ref: ref
94
- });
95
- });
96
- Row.displayName = 'Composite.Row';
97
- const Hover = forwardRef(function CompositeHover(props, ref) {
98
- const context = useCompositeContext();
99
- return /*#__PURE__*/_jsx(Ariakit.CompositeHover, {
100
- store: context?.store,
101
- ...props,
102
- ref: ref
103
- });
104
- });
105
- Hover.displayName = 'Composite.Hover';
106
- const Typeahead = forwardRef(function CompositeTypeahead(props, ref) {
107
- const context = useCompositeContext();
108
- return /*#__PURE__*/_jsx(Ariakit.CompositeTypeahead, {
109
- store: context?.store,
110
- ...props,
111
- ref: ref
75
+ rtl
112
76
  });
113
- });
114
- Typeahead.displayName = 'Composite.Typeahead';
115
-
116
- /**
117
- * Renders a widget based on the WAI-ARIA [`composite`](https://w3c.github.io/aria/#composite)
118
- * role, which provides a single tab stop on the page and arrow key navigation
119
- * through the focusable descendants.
120
- *
121
- * @example
122
- * ```jsx
123
- * import { Composite, useCompositeStore } from '@wordpress/components';
124
- *
125
- * const store = useCompositeStore();
126
- * <Composite store={store}>
127
- * <Composite.Item>Item 1</Composite.Item>
128
- * <Composite.Item>Item 2</Composite.Item>
129
- * </Composite>
130
- * ```
131
- */
132
- export const Composite = Object.assign(forwardRef(function Composite({
133
- children,
134
- store,
135
- disabled = false,
136
- ...props
137
- }, ref) {
138
77
  const contextValue = useMemo(() => ({
139
78
  store
140
79
  }), [store]);
@@ -149,16 +88,14 @@ export const Composite = Object.assign(forwardRef(function Composite({
149
88
  })
150
89
  });
151
90
  }), {
152
- displayName: 'Composite',
153
91
  /**
154
92
  * Renders a group element for composite items.
155
93
  *
156
94
  * @example
157
95
  * ```jsx
158
- * import { Composite, useCompositeStore } from '@wordpress/components';
96
+ * import { Composite } from '@wordpress/components';
159
97
  *
160
- * const store = useCompositeStore();
161
- * <Composite store={store}>
98
+ * <Composite>
162
99
  * <Composite.Group>
163
100
  * <Composite.GroupLabel>Label</Composite.GroupLabel>
164
101
  * <Composite.Item>Item 1</Composite.Item>
@@ -167,7 +104,9 @@ export const Composite = Object.assign(forwardRef(function Composite({
167
104
  * </Composite>
168
105
  * ```
169
106
  */
170
- Group,
107
+ Group: Object.assign(CompositeGroup, {
108
+ displayName: 'Composite.Group'
109
+ }),
171
110
  /**
172
111
  * Renders a label in a composite group. This component must be wrapped with
173
112
  * `Composite.Group` so the `aria-labelledby` prop is properly set on the
@@ -175,10 +114,9 @@ export const Composite = Object.assign(forwardRef(function Composite({
175
114
  *
176
115
  * @example
177
116
  * ```jsx
178
- * import { Composite, useCompositeStore } from '@wordpress/components';
117
+ * import { Composite } from '@wordpress/components';
179
118
  *
180
- * const store = useCompositeStore();
181
- * <Composite store={store}>
119
+ * <Composite>
182
120
  * <Composite.Group>
183
121
  * <Composite.GroupLabel>Label</Composite.GroupLabel>
184
122
  * <Composite.Item>Item 1</Composite.Item>
@@ -187,23 +125,26 @@ export const Composite = Object.assign(forwardRef(function Composite({
187
125
  * </Composite>
188
126
  * ```
189
127
  */
190
- GroupLabel,
128
+ GroupLabel: Object.assign(CompositeGroupLabel, {
129
+ displayName: 'Composite.GroupLabel'
130
+ }),
191
131
  /**
192
132
  * Renders a composite item.
193
133
  *
194
134
  * @example
195
135
  * ```jsx
196
- * import { Composite, useCompositeStore } from '@wordpress/components';
136
+ * import { Composite } from '@wordpress/components';
197
137
  *
198
- * const store = useCompositeStore();
199
- * <Composite store={store}>
138
+ * <Composite>
200
139
  * <Composite.Item>Item 1</Composite.Item>
201
140
  * <Composite.Item>Item 2</Composite.Item>
202
141
  * <Composite.Item>Item 3</Composite.Item>
203
142
  * </Composite>
204
143
  * ```
205
144
  */
206
- Item,
145
+ Item: Object.assign(CompositeItem, {
146
+ displayName: 'Composite.Item'
147
+ }),
207
148
  /**
208
149
  * Renders a composite row. Wrapping `Composite.Item` elements within
209
150
  * `Composite.Row` will create a two-dimensional composite widget, such as a
@@ -211,10 +152,9 @@ export const Composite = Object.assign(forwardRef(function Composite({
211
152
  *
212
153
  * @example
213
154
  * ```jsx
214
- * import { Composite, useCompositeStore } from '@wordpress/components';
155
+ * import { Composite } from '@wordpress/components';
215
156
  *
216
- * const store = useCompositeStore();
217
- * <Composite store={store}>
157
+ * <Composite>
218
158
  * <Composite.Row>
219
159
  * <Composite.Item>Item 1.1</Composite.Item>
220
160
  * <Composite.Item>Item 1.2</Composite.Item>
@@ -228,7 +168,9 @@ export const Composite = Object.assign(forwardRef(function Composite({
228
168
  * </Composite>
229
169
  * ```
230
170
  */
231
- Row,
171
+ Row: Object.assign(CompositeRow, {
172
+ displayName: 'Composite.Row'
173
+ }),
232
174
  /**
233
175
  * Renders an element in a composite widget that receives focus on mouse move
234
176
  * and loses focus to the composite base element on mouse leave. This should
@@ -236,10 +178,9 @@ export const Composite = Object.assign(forwardRef(function Composite({
236
178
  *
237
179
  * @example
238
180
  * ```jsx
239
- * import { Composite, useCompositeStore } from '@wordpress/components';
181
+ * import { Composite } from '@wordpress/components';
240
182
  *
241
- * const store = useCompositeStore();
242
- * <Composite store={store}>
183
+ * <Composite>
243
184
  * <Composite.Hover render={ <Composite.Item /> }>
244
185
  * Item 1
245
186
  * </Composite.Hover>
@@ -249,7 +190,9 @@ export const Composite = Object.assign(forwardRef(function Composite({
249
190
  * </Composite>
250
191
  * ```
251
192
  */
252
- Hover,
193
+ Hover: Object.assign(CompositeHover, {
194
+ displayName: 'Composite.Hover'
195
+ }),
253
196
  /**
254
197
  * Renders a component that adds typeahead functionality to composite
255
198
  * components. Hitting printable character keys will move focus to the next
@@ -257,16 +200,17 @@ export const Composite = Object.assign(forwardRef(function Composite({
257
200
  *
258
201
  * @example
259
202
  * ```jsx
260
- * import { Composite, useCompositeStore } from '@wordpress/components';
203
+ * import { Composite } from '@wordpress/components';
261
204
  *
262
- * const store = useCompositeStore();
263
- * <Composite store={store} render={ <CompositeTypeahead /> }>
205
+ * <Composite render={ <CompositeTypeahead /> }>
264
206
  * <Composite.Item>Item 1</Composite.Item>
265
207
  * <Composite.Item>Item 2</Composite.Item>
266
208
  * </Composite>
267
209
  * ```
268
210
  */
269
- Typeahead,
211
+ Typeahead: Object.assign(CompositeTypeahead, {
212
+ displayName: 'Composite.Typeahead'
213
+ }),
270
214
  /**
271
215
  * The React context used by the composite components. It can be used by
272
216
  * to access the composite store, and to forward the context when composite
@@ -281,6 +225,8 @@ export const Composite = Object.assign(forwardRef(function Composite({
281
225
  * const compositeContext = useContext( Composite.Context );
282
226
  * ```
283
227
  */
284
- Context: CompositeContext
228
+ Context: Object.assign(CompositeContext, {
229
+ displayName: 'Composite.Context'
230
+ })
285
231
  });
286
232
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"names":["Ariakit","useMemo","forwardRef","CompositeContext","useCompositeContext","jsx","_jsx","useCompositeStore","focusLoop","focusWrap","focusShift","virtualFocus","orientation","rtl","props","Group","CompositeGroup","ref","context","store","displayName","GroupLabel","CompositeGroupLabel","Item","CompositeItem","Row","CompositeRow","Hover","CompositeHover","Typeahead","CompositeTypeahead","Composite","Object","assign","children","disabled","contextValue","Provider","value","Context"],"sources":["@wordpress/components/src/composite/index.tsx"],"sourcesContent":["/**\n * Composite is a component that may contain navigable items represented by\n * Composite.Item. It's inspired by the WAI-ARIA Composite Role and implements\n * all the keyboard navigation mechanisms to ensure that there's only one\n * tab stop for the whole Composite element. This means that it can behave as\n * a roving tabindex or aria-activedescendant container.\n *\n * @see https://ariakit.org/components/composite\n */\n\n/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { CompositeContext, useCompositeContext } from './context';\nimport type {\n\tCompositeStoreProps,\n\tCompositeProps,\n\tCompositeGroupProps,\n\tCompositeGroupLabelProps,\n\tCompositeItemProps,\n\tCompositeRowProps,\n\tCompositeHoverProps,\n\tCompositeTypeaheadProps,\n} from './types';\n\n/**\n * Creates a composite store.\n *\n * @example\n * ```jsx\n * import { Composite, useCompositeStore } from '@wordpress/components';\n *\n * const store = useCompositeStore();\n * <Composite store={store}>\n * <Composite.Item>Item</Composite.Item>\n * <Composite.Item>Item</Composite.Item>\n * <Composite.Item>Item</Composite.Item>\n * </Composite>\n * ```\n */\nexport function useCompositeStore( {\n\tfocusLoop = false,\n\tfocusWrap = false,\n\tfocusShift = false,\n\tvirtualFocus = false,\n\torientation = 'both',\n\trtl = false,\n\t...props\n}: CompositeStoreProps = {} ) {\n\treturn Ariakit.useCompositeStore( {\n\t\tfocusLoop,\n\t\tfocusWrap,\n\t\tfocusShift,\n\t\tvirtualFocus,\n\t\torientation,\n\t\trtl,\n\t\t...props,\n\t} );\n}\n\nconst Group = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< CompositeGroupProps, 'div', false >\n>( function CompositeGroup( props, ref ) {\n\tconst context = useCompositeContext();\n\treturn (\n\t\t<Ariakit.CompositeGroup\n\t\t\tstore={ context?.store }\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t/>\n\t);\n} );\nGroup.displayName = 'Composite.Group';\n\nconst GroupLabel = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< CompositeGroupLabelProps, 'div', false >\n>( function CompositeGroupLabel( props, ref ) {\n\tconst context = useCompositeContext();\n\treturn (\n\t\t<Ariakit.CompositeGroupLabel\n\t\t\tstore={ context?.store }\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t/>\n\t);\n} );\nGroupLabel.displayName = 'Composite.GroupLabel';\n\nconst Item = forwardRef<\n\tHTMLButtonElement,\n\tWordPressComponentProps< CompositeItemProps, 'button', false >\n>( function CompositeItem( props, ref ) {\n\tconst context = useCompositeContext();\n\treturn (\n\t\t<Ariakit.CompositeItem\n\t\t\tstore={ context?.store }\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t/>\n\t);\n} );\nItem.displayName = 'Composite.Item';\n\nconst Row = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< CompositeRowProps, 'div', false >\n>( function CompositeRow( props, ref ) {\n\tconst context = useCompositeContext();\n\treturn (\n\t\t<Ariakit.CompositeRow\n\t\t\tstore={ context?.store }\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t/>\n\t);\n} );\nRow.displayName = 'Composite.Row';\n\nconst Hover = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< CompositeHoverProps, 'div', false >\n>( function CompositeHover( props, ref ) {\n\tconst context = useCompositeContext();\n\treturn (\n\t\t<Ariakit.CompositeHover\n\t\t\tstore={ context?.store }\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t/>\n\t);\n} );\nHover.displayName = 'Composite.Hover';\n\nconst Typeahead = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< CompositeTypeaheadProps, 'div', false >\n>( function CompositeTypeahead( props, ref ) {\n\tconst context = useCompositeContext();\n\treturn (\n\t\t<Ariakit.CompositeTypeahead\n\t\t\tstore={ context?.store }\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t/>\n\t);\n} );\nTypeahead.displayName = 'Composite.Typeahead';\n\n/**\n * Renders a widget based on the WAI-ARIA [`composite`](https://w3c.github.io/aria/#composite)\n * role, which provides a single tab stop on the page and arrow key navigation\n * through the focusable descendants.\n *\n * @example\n * ```jsx\n * import { Composite, useCompositeStore } from '@wordpress/components';\n *\n * const store = useCompositeStore();\n * <Composite store={store}>\n * <Composite.Item>Item 1</Composite.Item>\n * <Composite.Item>Item 2</Composite.Item>\n * </Composite>\n * ```\n */\nexport const Composite = Object.assign(\n\tforwardRef<\n\t\tHTMLDivElement,\n\t\tWordPressComponentProps< CompositeProps, 'div', false >\n\t>( function Composite(\n\t\t{ children, store, disabled = false, ...props },\n\t\tref\n\t) {\n\t\tconst contextValue = useMemo(\n\t\t\t() => ( {\n\t\t\t\tstore,\n\t\t\t} ),\n\t\t\t[ store ]\n\t\t);\n\n\t\treturn (\n\t\t\t<Ariakit.Composite\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tstore={ store }\n\t\t\t\t{ ...props }\n\t\t\t\tref={ ref }\n\t\t\t>\n\t\t\t\t<CompositeContext.Provider value={ contextValue }>\n\t\t\t\t\t{ children }\n\t\t\t\t</CompositeContext.Provider>\n\t\t\t</Ariakit.Composite>\n\t\t);\n\t} ),\n\t{\n\t\tdisplayName: 'Composite',\n\t\t/**\n\t\t * Renders a group element for composite items.\n\t\t *\n\t\t * @example\n\t\t * ```jsx\n\t\t * import { Composite, useCompositeStore } from '@wordpress/components';\n\t\t *\n\t\t * const store = useCompositeStore();\n\t\t * <Composite store={store}>\n\t\t * <Composite.Group>\n\t\t * <Composite.GroupLabel>Label</Composite.GroupLabel>\n\t\t * <Composite.Item>Item 1</Composite.Item>\n\t\t * <Composite.Item>Item 2</Composite.Item>\n\t\t * </CompositeGroup>\n\t\t * </Composite>\n\t\t * ```\n\t\t */\n\t\tGroup,\n\t\t/**\n\t\t * Renders a label in a composite group. This component must be wrapped with\n\t\t * `Composite.Group` so the `aria-labelledby` prop is properly set on the\n\t\t * composite group element.\n\t\t *\n\t\t * @example\n\t\t * ```jsx\n\t\t * import { Composite, useCompositeStore } from '@wordpress/components';\n\t\t *\n\t\t * const store = useCompositeStore();\n\t\t * <Composite store={store}>\n\t\t * <Composite.Group>\n\t\t * <Composite.GroupLabel>Label</Composite.GroupLabel>\n\t\t * <Composite.Item>Item 1</Composite.Item>\n\t\t * <Composite.Item>Item 2</Composite.Item>\n\t\t * </CompositeGroup>\n\t\t * </Composite>\n\t\t * ```\n\t\t */\n\t\tGroupLabel,\n\t\t/**\n\t\t * Renders a composite item.\n\t\t *\n\t\t * @example\n\t\t * ```jsx\n\t\t * import { Composite, useCompositeStore } from '@wordpress/components';\n\t\t *\n\t\t * const store = useCompositeStore();\n\t\t * <Composite store={store}>\n\t\t * <Composite.Item>Item 1</Composite.Item>\n\t\t * <Composite.Item>Item 2</Composite.Item>\n\t\t * <Composite.Item>Item 3</Composite.Item>\n\t\t * </Composite>\n\t\t * ```\n\t\t */\n\t\tItem,\n\t\t/**\n\t\t * Renders a composite row. Wrapping `Composite.Item` elements within\n\t\t * `Composite.Row` will create a two-dimensional composite widget, such as a\n\t\t * grid.\n\t\t *\n\t\t * @example\n\t\t * ```jsx\n\t\t * import { Composite, useCompositeStore } from '@wordpress/components';\n\t\t *\n\t\t * const store = useCompositeStore();\n\t\t * <Composite store={store}>\n\t\t * <Composite.Row>\n\t\t * <Composite.Item>Item 1.1</Composite.Item>\n\t\t * <Composite.Item>Item 1.2</Composite.Item>\n\t\t * <Composite.Item>Item 1.3</Composite.Item>\n\t\t * </Composite.Row>\n\t\t * <Composite.Row>\n\t\t * <Composite.Item>Item 2.1</Composite.Item>\n\t\t * <Composite.Item>Item 2.2</Composite.Item>\n\t\t * <Composite.Item>Item 2.3</Composite.Item>\n\t\t * </Composite.Row>\n\t\t * </Composite>\n\t\t * ```\n\t\t */\n\t\tRow,\n\t\t/**\n\t\t * Renders an element in a composite widget that receives focus on mouse move\n\t\t * and loses focus to the composite base element on mouse leave. This should\n\t\t * be combined with the `Composite.Item` component.\n\t\t *\n\t\t * @example\n\t\t * ```jsx\n\t\t * import { Composite, useCompositeStore } from '@wordpress/components';\n\t\t *\n\t\t * const store = useCompositeStore();\n\t\t * <Composite store={store}>\n\t\t * <Composite.Hover render={ <Composite.Item /> }>\n\t\t * Item 1\n\t\t * </Composite.Hover>\n\t\t * <Composite.Hover render={ <Composite.Item /> }>\n\t\t * Item 2\n\t\t * </Composite.Hover>\n\t\t * </Composite>\n\t\t * ```\n\t\t */\n\t\tHover,\n\t\t/**\n\t\t * Renders a component that adds typeahead functionality to composite\n\t\t * components. Hitting printable character keys will move focus to the next\n\t\t * composite item that begins with the input characters.\n\t\t *\n\t\t * @example\n\t\t * ```jsx\n\t\t * import { Composite, useCompositeStore } from '@wordpress/components';\n\t\t *\n\t\t * const store = useCompositeStore();\n\t\t * <Composite store={store} render={ <CompositeTypeahead /> }>\n\t\t * <Composite.Item>Item 1</Composite.Item>\n\t\t * <Composite.Item>Item 2</Composite.Item>\n\t\t * </Composite>\n\t\t * ```\n\t\t */\n\t\tTypeahead,\n\t\t/**\n\t\t * The React context used by the composite components. It can be used by\n\t\t * to access the composite store, and to forward the context when composite\n\t\t * sub-components are rendered across portals (ie. `SlotFill` components)\n\t\t * that would not otherwise forward the context to the `Fill` children.\n\t\t *\n\t\t * @example\n\t\t * ```jsx\n\t\t * import { Composite } from '@wordpress/components';\n\t\t * import { useContext } from '@wordpress/element';\n\t\t *\n\t\t * const compositeContext = useContext( Composite.Context );\n\t\t * ```\n\t\t */\n\t\tContext: CompositeContext,\n\t}\n);\n"],"mappings":"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A;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMW,SAAS,GAAGC,MAAM,CAACC,MAAM,CACrC/B,UAAU,CAGP,SAAS6B,SAASA,CACpB;EAAEG,QAAQ;EAAEf,KAAK;EAAEgB,QAAQ,GAAG,KAAK;EAAE,GAAGrB;AAAM,CAAC,EAC/CG,GAAG,EACF;EACD,MAAMmB,YAAY,GAAGnC,OAAO,CAC3B,OAAQ;IACPkB;EACD,CAAC,CAAE,EACH,CAAEA,KAAK,CACR,CAAC;EAED,oBACCb,IAAA,CAACN,OAAO,CAAC+B,SAAS;IACjBI,QAAQ,EAAGA,QAAU;IACrBhB,KAAK,EAAGA,KAAO;IAAA,GACVL,KAAK;IACVG,GAAG,EAAGA,GAAK;IAAAiB,QAAA,eAEX5B,IAAA,CAACH,gBAAgB,CAACkC,QAAQ;MAACC,KAAK,EAAGF,YAAc;MAAAF,QAAA,EAC9CA;IAAQ,CACgB;EAAC,CACV,CAAC;AAEtB,CAAE,CAAC,EACH;EACCd,WAAW,EAAE,WAAW;EACxB;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACEL,KAAK;EACL;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACEM,UAAU;EACV;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACEE,IAAI;EACJ;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACEE,GAAG;EACH;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACEE,KAAK;EACL;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACEE,SAAS;EACT;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACEU,OAAO,EAAEpC;AACV,CACD,CAAC","ignoreList":[]}
1
+ {"version":3,"names":["Ariakit","isRTL","useMemo","forwardRef","CompositeContext","CompositeGroup","CompositeGroupLabel","CompositeHover","CompositeItem","CompositeRow","CompositeTypeahead","jsx","_jsx","Composite","Object","assign","activeId","defaultActiveId","setActiveId","focusLoop","focusWrap","focusShift","virtualFocus","orientation","rtl","children","disabled","props","ref","store","useCompositeStore","contextValue","Provider","value","Group","displayName","GroupLabel","Item","Row","Hover","Typeahead","Context"],"sources":["@wordpress/components/src/composite/index.tsx"],"sourcesContent":["/**\n * Composite is a component that may contain navigable items represented by\n * Composite.Item. It's inspired by the WAI-ARIA Composite Role and implements\n * all the keyboard navigation mechanisms to ensure that there's only one\n * tab stop for the whole Composite element. This means that it can behave as\n * a roving tabindex or aria-activedescendant container.\n *\n * @see https://ariakit.org/components/composite\n */\n\n/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { isRTL } from '@wordpress/i18n';\nimport { useMemo, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { CompositeContext } from './context';\nimport { CompositeGroup } from './group';\nimport { CompositeGroupLabel } from './group-label';\nimport { CompositeHover } from './hover';\nimport { CompositeItem } from './item';\nimport { CompositeRow } from './row';\nimport { CompositeTypeahead } from './typeahead';\nimport type { CompositeProps } from './types';\n\n/**\n * Renders a widget based on the WAI-ARIA [`composite`](https://w3c.github.io/aria/#composite)\n * role, which provides a single tab stop on the page and arrow key navigation\n * through the focusable descendants.\n *\n * @example\n * ```jsx\n * import { Composite } from '@wordpress/components';\n *\n * <Composite>\n * <Composite.Item>Item 1</Composite.Item>\n * <Composite.Item>Item 2</Composite.Item>\n * </Composite>\n * ```\n */\nexport const Composite = Object.assign(\n\tforwardRef<\n\t\tHTMLDivElement,\n\t\tWordPressComponentProps< CompositeProps, 'div', false >\n\t>( function Composite(\n\t\t{\n\t\t\t// Composite store props\n\t\t\tactiveId,\n\t\t\tdefaultActiveId,\n\t\t\tsetActiveId,\n\t\t\tfocusLoop = false,\n\t\t\tfocusWrap = false,\n\t\t\tfocusShift = false,\n\t\t\tvirtualFocus = false,\n\t\t\torientation = 'both',\n\t\t\trtl = isRTL(),\n\n\t\t\t// Composite component props\n\t\t\tchildren,\n\t\t\tdisabled = false,\n\n\t\t\t// Rest props\n\t\t\t...props\n\t\t},\n\t\tref\n\t) {\n\t\tconst store = Ariakit.useCompositeStore( {\n\t\t\tactiveId,\n\t\t\tdefaultActiveId,\n\t\t\tsetActiveId,\n\t\t\tfocusLoop,\n\t\t\tfocusWrap,\n\t\t\tfocusShift,\n\t\t\tvirtualFocus,\n\t\t\torientation,\n\t\t\trtl,\n\t\t} );\n\n\t\tconst contextValue = useMemo(\n\t\t\t() => ( {\n\t\t\t\tstore,\n\t\t\t} ),\n\t\t\t[ store ]\n\t\t);\n\n\t\treturn (\n\t\t\t<Ariakit.Composite\n\t\t\t\tdisabled={ disabled }\n\t\t\t\tstore={ store }\n\t\t\t\t{ ...props }\n\t\t\t\tref={ ref }\n\t\t\t>\n\t\t\t\t<CompositeContext.Provider value={ contextValue }>\n\t\t\t\t\t{ children }\n\t\t\t\t</CompositeContext.Provider>\n\t\t\t</Ariakit.Composite>\n\t\t);\n\t} ),\n\t{\n\t\t/**\n\t\t * Renders a group element for composite items.\n\t\t *\n\t\t * @example\n\t\t * ```jsx\n\t\t * import { Composite } from '@wordpress/components';\n\t\t *\n\t\t * <Composite>\n\t\t * <Composite.Group>\n\t\t * <Composite.GroupLabel>Label</Composite.GroupLabel>\n\t\t * <Composite.Item>Item 1</Composite.Item>\n\t\t * <Composite.Item>Item 2</Composite.Item>\n\t\t * </CompositeGroup>\n\t\t * </Composite>\n\t\t * ```\n\t\t */\n\t\tGroup: Object.assign( CompositeGroup, {\n\t\t\tdisplayName: 'Composite.Group',\n\t\t} ),\n\t\t/**\n\t\t * Renders a label in a composite group. This component must be wrapped with\n\t\t * `Composite.Group` so the `aria-labelledby` prop is properly set on the\n\t\t * composite group element.\n\t\t *\n\t\t * @example\n\t\t * ```jsx\n\t\t * import { Composite } from '@wordpress/components';\n\t\t *\n\t\t * <Composite>\n\t\t * <Composite.Group>\n\t\t * <Composite.GroupLabel>Label</Composite.GroupLabel>\n\t\t * <Composite.Item>Item 1</Composite.Item>\n\t\t * <Composite.Item>Item 2</Composite.Item>\n\t\t * </CompositeGroup>\n\t\t * </Composite>\n\t\t * ```\n\t\t */\n\t\tGroupLabel: Object.assign( CompositeGroupLabel, {\n\t\t\tdisplayName: 'Composite.GroupLabel',\n\t\t} ),\n\t\t/**\n\t\t * Renders a composite item.\n\t\t *\n\t\t * @example\n\t\t * ```jsx\n\t\t * import { Composite } from '@wordpress/components';\n\t\t *\n\t\t * <Composite>\n\t\t * <Composite.Item>Item 1</Composite.Item>\n\t\t * <Composite.Item>Item 2</Composite.Item>\n\t\t * <Composite.Item>Item 3</Composite.Item>\n\t\t * </Composite>\n\t\t * ```\n\t\t */\n\t\tItem: Object.assign( CompositeItem, { displayName: 'Composite.Item' } ),\n\t\t/**\n\t\t * Renders a composite row. Wrapping `Composite.Item` elements within\n\t\t * `Composite.Row` will create a two-dimensional composite widget, such as a\n\t\t * grid.\n\t\t *\n\t\t * @example\n\t\t * ```jsx\n\t\t * import { Composite } from '@wordpress/components';\n\t\t *\n\t\t * <Composite>\n\t\t * <Composite.Row>\n\t\t * <Composite.Item>Item 1.1</Composite.Item>\n\t\t * <Composite.Item>Item 1.2</Composite.Item>\n\t\t * <Composite.Item>Item 1.3</Composite.Item>\n\t\t * </Composite.Row>\n\t\t * <Composite.Row>\n\t\t * <Composite.Item>Item 2.1</Composite.Item>\n\t\t * <Composite.Item>Item 2.2</Composite.Item>\n\t\t * <Composite.Item>Item 2.3</Composite.Item>\n\t\t * </Composite.Row>\n\t\t * </Composite>\n\t\t * ```\n\t\t */\n\t\tRow: Object.assign( CompositeRow, { displayName: 'Composite.Row' } ),\n\t\t/**\n\t\t * Renders an element in a composite widget that receives focus on mouse move\n\t\t * and loses focus to the composite base element on mouse leave. This should\n\t\t * be combined with the `Composite.Item` component.\n\t\t *\n\t\t * @example\n\t\t * ```jsx\n\t\t * import { Composite } from '@wordpress/components';\n\t\t *\n\t\t * <Composite>\n\t\t * <Composite.Hover render={ <Composite.Item /> }>\n\t\t * Item 1\n\t\t * </Composite.Hover>\n\t\t * <Composite.Hover render={ <Composite.Item /> }>\n\t\t * Item 2\n\t\t * </Composite.Hover>\n\t\t * </Composite>\n\t\t * ```\n\t\t */\n\t\tHover: Object.assign( CompositeHover, {\n\t\t\tdisplayName: 'Composite.Hover',\n\t\t} ),\n\t\t/**\n\t\t * Renders a component that adds typeahead functionality to composite\n\t\t * components. Hitting printable character keys will move focus to the next\n\t\t * composite item that begins with the input characters.\n\t\t *\n\t\t * @example\n\t\t * ```jsx\n\t\t * import { Composite } from '@wordpress/components';\n\t\t *\n\t\t * <Composite render={ <CompositeTypeahead /> }>\n\t\t * <Composite.Item>Item 1</Composite.Item>\n\t\t * <Composite.Item>Item 2</Composite.Item>\n\t\t * </Composite>\n\t\t * ```\n\t\t */\n\t\tTypeahead: Object.assign( CompositeTypeahead, {\n\t\t\tdisplayName: 'Composite.Typeahead',\n\t\t} ),\n\t\t/**\n\t\t * The React context used by the composite components. It can be used by\n\t\t * to access the composite store, and to forward the context when composite\n\t\t * sub-components are rendered across portals (ie. `SlotFill` components)\n\t\t * that would not otherwise forward the context to the `Fill` children.\n\t\t *\n\t\t * @example\n\t\t * ```jsx\n\t\t * import { Composite } from '@wordpress/components';\n\t\t * import { useContext } from '@wordpress/element';\n\t\t *\n\t\t * const compositeContext = useContext( Composite.Context );\n\t\t * ```\n\t\t */\n\t\tContext: Object.assign( CompositeContext, {\n\t\t\tdisplayName: 'Composite.Context',\n\t\t} ),\n\t}\n);\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA,OAAO,KAAKA,OAAO,MAAM,gBAAgB;;AAEzC;AACA;AACA;AACA,SAASC,KAAK,QAAQ,iBAAiB;AACvC,SAASC,OAAO,EAAEC,UAAU,QAAQ,oBAAoB;;AAExD;AACA;AACA;;AAEA,SAASC,gBAAgB,QAAQ,WAAW;AAC5C,SAASC,cAAc,QAAQ,SAAS;AACxC,SAASC,mBAAmB,QAAQ,eAAe;AACnD,SAASC,cAAc,QAAQ,SAAS;AACxC,SAASC,aAAa,QAAQ,QAAQ;AACtC,SAASC,YAAY,QAAQ,OAAO;AACpC,SAASC,kBAAkB,QAAQ,aAAa;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAGjD;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,SAAS,GAAGC,MAAM,CAACC,MAAM,CACrCZ,UAAU,CAGP,SAASU,SAASA,CACpB;EACC;EACAG,QAAQ;EACRC,eAAe;EACfC,WAAW;EACXC,SAAS,GAAG,KAAK;EACjBC,SAAS,GAAG,KAAK;EACjBC,UAAU,GAAG,KAAK;EAClBC,YAAY,GAAG,KAAK;EACpBC,WAAW,GAAG,MAAM;EACpBC,GAAG,GAAGvB,KAAK,CAAC,CAAC;EAEb;EACAwB,QAAQ;EACRC,QAAQ,GAAG,KAAK;EAEhB;EACA,GAAGC;AACJ,CAAC,EACDC,GAAG,EACF;EACD,MAAMC,KAAK,GAAG7B,OAAO,CAAC8B,iBAAiB,CAAE;IACxCd,QAAQ;IACRC,eAAe;IACfC,WAAW;IACXC,SAAS;IACTC,SAAS;IACTC,UAAU;IACVC,YAAY;IACZC,WAAW;IACXC;EACD,CAAE,CAAC;EAEH,MAAMO,YAAY,GAAG7B,OAAO,CAC3B,OAAQ;IACP2B;EACD,CAAC,CAAE,EACH,CAAEA,KAAK,CACR,CAAC;EAED,oBACCjB,IAAA,CAACZ,OAAO,CAACa,SAAS;IACjBa,QAAQ,EAAGA,QAAU;IACrBG,KAAK,EAAGA,KAAO;IAAA,GACVF,KAAK;IACVC,GAAG,EAAGA,GAAK;IAAAH,QAAA,eAEXb,IAAA,CAACR,gBAAgB,CAAC4B,QAAQ;MAACC,KAAK,EAAGF,YAAc;MAAAN,QAAA,EAC9CA;IAAQ,CACgB;EAAC,CACV,CAAC;AAEtB,CAAE,CAAC,EACH;EACC;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACES,KAAK,EAAEpB,MAAM,CAACC,MAAM,CAAEV,cAAc,EAAE;IACrC8B,WAAW,EAAE;EACd,CAAE,CAAC;EACH;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACEC,UAAU,EAAEtB,MAAM,CAACC,MAAM,CAAET,mBAAmB,EAAE;IAC/C6B,WAAW,EAAE;EACd,CAAE,CAAC;EACH;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACEE,IAAI,EAAEvB,MAAM,CAACC,MAAM,CAAEP,aAAa,EAAE;IAAE2B,WAAW,EAAE;EAAiB,CAAE,CAAC;EACvE;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACEG,GAAG,EAAExB,MAAM,CAACC,MAAM,CAAEN,YAAY,EAAE;IAAE0B,WAAW,EAAE;EAAgB,CAAE,CAAC;EACpE;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACEI,KAAK,EAAEzB,MAAM,CAACC,MAAM,CAAER,cAAc,EAAE;IACrC4B,WAAW,EAAE;EACd,CAAE,CAAC;EACH;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACEK,SAAS,EAAE1B,MAAM,CAACC,MAAM,CAAEL,kBAAkB,EAAE;IAC7CyB,WAAW,EAAE;EACd,CAAE,CAAC;EACH;AACF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EACEM,OAAO,EAAE3B,MAAM,CAACC,MAAM,CAAEX,gBAAgB,EAAE;IACzC+B,WAAW,EAAE;EACd,CAAE;AACH,CACD,CAAC","ignoreList":[]}
@@ -0,0 +1,25 @@
1
+ /**
2
+ * External dependencies
3
+ */
4
+ import * as Ariakit from '@ariakit/react';
5
+
6
+ /**
7
+ * WordPress dependencies
8
+ */
9
+ import { forwardRef } from '@wordpress/element';
10
+
11
+ /**
12
+ * Internal dependencies
13
+ */
14
+
15
+ import { useCompositeContext } from './context';
16
+ import { jsx as _jsx } from "react/jsx-runtime";
17
+ export const CompositeItem = forwardRef(function CompositeItem(props, ref) {
18
+ const context = useCompositeContext();
19
+ return /*#__PURE__*/_jsx(Ariakit.CompositeItem, {
20
+ store: context.store,
21
+ ...props,
22
+ ref: ref
23
+ });
24
+ });
25
+ //# sourceMappingURL=item.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["Ariakit","forwardRef","useCompositeContext","jsx","_jsx","CompositeItem","props","ref","context","store"],"sources":["@wordpress/components/src/composite/item.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { useCompositeContext } from './context';\nimport type { CompositeItemProps } from './types';\n\nexport const CompositeItem = forwardRef<\n\tHTMLButtonElement,\n\tWordPressComponentProps< CompositeItemProps, 'button', false >\n>( function CompositeItem( props, ref ) {\n\tconst context = useCompositeContext();\n\treturn (\n\t\t<Ariakit.CompositeItem\n\t\t\tstore={ context.store as Ariakit.CompositeStore }\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t/>\n\t);\n} );\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAO,KAAKA,OAAO,MAAM,gBAAgB;;AAEzC;AACA;AACA;AACA,SAASC,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;;AAEA,SAASC,mBAAmB,QAAQ,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAGhD,OAAO,MAAMC,aAAa,GAAGJ,UAAU,CAGpC,SAASI,aAAaA,CAAEC,KAAK,EAAEC,GAAG,EAAG;EACvC,MAAMC,OAAO,GAAGN,mBAAmB,CAAC,CAAC;EACrC,oBACCE,IAAA,CAACJ,OAAO,CAACK,aAAa;IACrBI,KAAK,EAAGD,OAAO,CAACC,KAAiC;IAAA,GAC5CH,KAAK;IACVC,GAAG,EAAGA;EAAK,CACX,CAAC;AAEJ,CAAE,CAAC","ignoreList":[]}
@@ -13,16 +13,22 @@
13
13
  * @see https://ariakit.org/components/composite
14
14
  */
15
15
 
16
+ /**
17
+ * External dependencies
18
+ */
19
+ import * as Ariakit from '@ariakit/react';
20
+
16
21
  /**
17
22
  * WordPress dependencies
18
23
  */
19
24
  import { forwardRef } from '@wordpress/element';
25
+ import { useInstanceId } from '@wordpress/compose';
26
+ import deprecated from '@wordpress/deprecated';
20
27
 
21
28
  /**
22
29
  * Internal dependencies
23
30
  */
24
- import { Composite as Current, useCompositeStore } from '..';
25
- import { useInstanceId } from '@wordpress/compose';
31
+ import { Composite as Current } from '..';
26
32
 
27
33
  // Legacy composite components can either provide state through a
28
34
  // single `state` prop, or via individual props, usually through
@@ -49,9 +55,20 @@ function mapLegacyStatePropsToComponentProps(legacyProps) {
49
55
  }
50
56
  return legacyProps;
51
57
  }
58
+ const LEGACY_TO_NEW_DISPLAY_NAME = {
59
+ __unstableComposite: 'Composite',
60
+ __unstableCompositeGroup: 'Composite.Group or Composite.Row',
61
+ __unstableCompositeItem: 'Composite.Item',
62
+ __unstableUseCompositeState: 'Composite'
63
+ };
52
64
  function proxyComposite(ProxiedComponent, propMap = {}) {
53
- const displayName = ProxiedComponent.displayName;
65
+ var _ProxiedComponent$dis;
66
+ const displayName = (_ProxiedComponent$dis = ProxiedComponent.displayName) !== null && _ProxiedComponent$dis !== void 0 ? _ProxiedComponent$dis : '';
54
67
  const Component = legacyProps => {
68
+ deprecated(`wp.components.${displayName}`, {
69
+ since: '6.7',
70
+ alternative: LEGACY_TO_NEW_DISPLAY_NAME.hasOwnProperty(displayName) ? LEGACY_TO_NEW_DISPLAY_NAME[displayName] : undefined
71
+ });
55
72
  const {
56
73
  store,
57
74
  ...rest
@@ -80,7 +97,7 @@ function proxyComposite(ProxiedComponent, propMap = {}) {
80
97
  // `CompositeRow`, but this has been split into two different
81
98
  // components. We handle that difference by checking on the
82
99
  // provided role, and returning the appropriate component.
83
- const unproxiedCompositeGroup = forwardRef(({
100
+ const UnproxiedCompositeGroup = forwardRef(({
84
101
  role,
85
102
  ...props
86
103
  }, ref) => {
@@ -91,14 +108,46 @@ const unproxiedCompositeGroup = forwardRef(({
91
108
  ...props
92
109
  });
93
110
  });
94
- export const Composite = proxyComposite(Current, {
111
+
112
+ /**
113
+ * _Note: please use the `Composite` component instead._
114
+ *
115
+ * @deprecated
116
+ */
117
+ export const Composite = proxyComposite(Object.assign(Current, {
118
+ displayName: '__unstableComposite'
119
+ }), {
95
120
  baseId: 'id'
96
121
  });
97
- export const CompositeGroup = proxyComposite(unproxiedCompositeGroup);
98
- export const CompositeItem = proxyComposite(Current.Item, {
122
+ /**
123
+ * _Note: please use the `Composite.Row` or `Composite.Group` components instead._
124
+ *
125
+ * @deprecated
126
+ */
127
+ export const CompositeGroup = proxyComposite(Object.assign(UnproxiedCompositeGroup, {
128
+ displayName: '__unstableCompositeGroup'
129
+ }));
130
+ /**
131
+ * _Note: please use the `Composite.Item` component instead._
132
+ *
133
+ * @deprecated
134
+ */
135
+ export const CompositeItem = proxyComposite(Object.assign(Current.Item, {
136
+ displayName: '__unstableCompositeItem'
137
+ }), {
99
138
  focusable: 'accessibleWhenDisabled'
100
139
  });
140
+
141
+ /**
142
+ * _Note: please use the `Composite` component instead._
143
+ *
144
+ * @deprecated
145
+ */
101
146
  export function useCompositeState(legacyStateOptions = {}) {
147
+ deprecated(`wp.components.__unstableUseCompositeState`, {
148
+ since: '6.7',
149
+ alternative: LEGACY_TO_NEW_DISPLAY_NAME.__unstableUseCompositeState
150
+ });
102
151
  const {
103
152
  baseId,
104
153
  currentId: defaultActiveId,
@@ -112,7 +161,7 @@ export function useCompositeState(legacyStateOptions = {}) {
112
161
  } = legacyStateOptions;
113
162
  return {
114
163
  baseId: useInstanceId(Composite, 'composite', baseId),
115
- store: useCompositeStore({
164
+ store: Ariakit.useCompositeStore({
116
165
  defaultActiveId,
117
166
  rtl,
118
167
  orientation,
@@ -1 +1 @@
1
- {"version":3,"names":["forwardRef","Composite","Current","useCompositeStore","useInstanceId","jsx","_jsx","mapLegacyStatePropsToComponentProps","legacyProps","state","rest","store","props","proxyComposite","ProxiedComponent","propMap","displayName","Component","id","baseId","Object","entries","forEach","from","to","hasOwnProperty","assign","unproxiedCompositeGroup","role","ref","Row","Group","CompositeGroup","CompositeItem","Item","focusable","useCompositeState","legacyStateOptions","currentId","defaultActiveId","orientation","rtl","loop","focusLoop","wrap","focusWrap","shift","focusShift","unstable_virtual","virtualFocus"],"sources":["@wordpress/components/src/composite/legacy/index.tsx"],"sourcesContent":["/**\n * Composite is a component that may contain navigable items represented by\n * CompositeItem. It's inspired by the WAI-ARIA Composite Role and implements\n * all the keyboard navigation mechanisms to ensure that there's only one\n * tab stop for the whole Composite element. This means that it can behave as\n * a roving tabindex or aria-activedescendant container.\n *\n * This file aims at providing components that are as close as possible to the\n * original `reakit`-based implementation (which was removed from the codebase),\n * although it is recommended that consumers of the package switch to the stable,\n * un-prefixed, `ariakit`-based version of `Composite`.\n *\n * @see https://ariakit.org/components/composite\n */\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { Composite as Current, useCompositeStore } from '..';\nimport { useInstanceId } from '@wordpress/compose';\n\ntype Orientation = 'horizontal' | 'vertical';\n\nexport interface LegacyStateOptions {\n\t/**\n\t * ID that will serve as a base for all the items IDs.\n\t */\n\tbaseId?: string;\n\t/**\n\t * Determines how next and previous functions will behave. If `rtl` is set\n\t * to `true`, they will be inverted. This only affects the composite widget\n\t * behavior. You still need to set `dir=\"rtl\"` on HTML/CSS.\n\t *\n\t * @default false\n\t */\n\trtl?: boolean;\n\t/**\n\t * Defines the orientation of the composite widget. If the composite has a\n\t * single row or column (one-dimensional), the orientation value determines\n\t * which arrow keys can be used to move focus.\n\t */\n\torientation?: Orientation;\n\t/**\n\t * The current focused item `id`.\n\t */\n\tcurrentId?: string;\n\t/**\n\t * Determines how focus moves from the start and end of rows and columns.\n\t *\n\t * @default false\n\t */\n\tloop?: boolean | Orientation;\n\t/**\n\t * If enabled, moving to the next item from the last one in a row or column\n\t * will focus the first item in the next row or column and vice-versa.\n\t *\n\t * ** Has effect only on two-dimensional composites. **\n\t *\n\t * @default false\n\t */\n\twrap?: boolean | Orientation;\n\t/**\n\t * If enabled, moving up or down when there's no next item or the next item\n\t * is disabled will shift to the item right before it.\n\t *\n\t * ** Has effect only on two-dimensional composites. **\n\t *\n\t * @default false\n\t */\n\tshift?: boolean;\n\tunstable_virtual?: boolean;\n}\n\ntype Component = React.FunctionComponent< any >;\n\ntype CompositeStore = ReturnType< typeof useCompositeStore >;\ntype CompositeStoreState = { store: CompositeStore };\nexport type CompositeState = CompositeStoreState &\n\tRequired< Pick< LegacyStateOptions, 'baseId' > >;\n\n// Legacy composite components can either provide state through a\n// single `state` prop, or via individual props, usually through\n// spreading the state generated by `useCompositeState`.\n// That is, `<Composite* { ...state }>`.\nexport type CompositeStateProps =\n\t| { state: CompositeState }\n\t| ( CompositeState & { state?: never } );\ntype ComponentProps< C extends Component > = React.ComponentPropsWithRef< C >;\nexport type CompositeProps< C extends Component > = ComponentProps< C > &\n\tCompositeStateProps;\ntype CompositeComponent< C extends Component > = (\n\tprops: CompositeProps< C >\n) => React.ReactElement;\ntype CompositeComponentProps = CompositeState &\n\t(\n\t\t| ComponentProps< typeof Current.Group >\n\t\t| ComponentProps< typeof Current.Item >\n\t\t| ComponentProps< typeof Current.Row >\n\t);\n\nfunction mapLegacyStatePropsToComponentProps(\n\tlegacyProps: CompositeStateProps\n): CompositeComponentProps {\n\t// If a `state` prop is provided, we unpack that; otherwise,\n\t// the necessary props are provided directly in `legacyProps`.\n\tif ( legacyProps.state ) {\n\t\tconst { state, ...rest } = legacyProps;\n\t\tconst { store, ...props } =\n\t\t\tmapLegacyStatePropsToComponentProps( state );\n\t\treturn { ...rest, ...props, store };\n\t}\n\n\treturn legacyProps;\n}\n\nfunction proxyComposite< C extends Component >(\n\tProxiedComponent: C | React.ForwardRefExoticComponent< C >,\n\tpropMap: Record< string, string > = {}\n): CompositeComponent< C > {\n\tconst displayName = ProxiedComponent.displayName;\n\tconst Component = ( legacyProps: CompositeStateProps ) => {\n\t\tconst { store, ...rest } =\n\t\t\tmapLegacyStatePropsToComponentProps( legacyProps );\n\t\tconst props = rest as ComponentProps< C >;\n\t\tprops.id = useInstanceId( store, props.baseId, props.id );\n\n\t\tObject.entries( propMap ).forEach( ( [ from, to ] ) => {\n\t\t\tif ( props.hasOwnProperty( from ) ) {\n\t\t\t\tObject.assign( props, { [ to ]: props[ from ] } );\n\t\t\t\tdelete props[ from ];\n\t\t\t}\n\t\t} );\n\n\t\tdelete props.baseId;\n\n\t\treturn <ProxiedComponent { ...props } store={ store } />;\n\t};\n\tComponent.displayName = displayName;\n\treturn Component;\n}\n\n// The old `CompositeGroup` used to behave more like the current\n// `CompositeRow`, but this has been split into two different\n// components. We handle that difference by checking on the\n// provided role, and returning the appropriate component.\nconst unproxiedCompositeGroup = forwardRef<\n\tany,\n\tReact.ComponentPropsWithoutRef< typeof Current.Group | typeof Current.Row >\n>( ( { role, ...props }, ref ) => {\n\tconst Component = role === 'row' ? Current.Row : Current.Group;\n\treturn <Component ref={ ref } role={ role } { ...props } />;\n} );\n\nexport const Composite = proxyComposite( Current, { baseId: 'id' } );\nexport const CompositeGroup = proxyComposite( unproxiedCompositeGroup );\nexport const CompositeItem = proxyComposite( Current.Item, {\n\tfocusable: 'accessibleWhenDisabled',\n} );\n\nexport function useCompositeState(\n\tlegacyStateOptions: LegacyStateOptions = {}\n): CompositeState {\n\tconst {\n\t\tbaseId,\n\t\tcurrentId: defaultActiveId,\n\t\torientation,\n\t\trtl = false,\n\t\tloop: focusLoop = false,\n\t\twrap: focusWrap = false,\n\t\tshift: focusShift = false,\n\t\t// eslint-disable-next-line camelcase\n\t\tunstable_virtual: virtualFocus,\n\t} = legacyStateOptions;\n\n\treturn {\n\t\tbaseId: useInstanceId( Composite, 'composite', baseId ),\n\t\tstore: useCompositeStore( {\n\t\t\tdefaultActiveId,\n\t\t\trtl,\n\t\t\torientation,\n\t\t\tfocusLoop,\n\t\t\tfocusShift,\n\t\t\tfocusWrap,\n\t\t\tvirtualFocus,\n\t\t} ),\n\t};\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["Ariakit","forwardRef","useInstanceId","deprecated","Composite","Current","jsx","_jsx","mapLegacyStatePropsToComponentProps","legacyProps","state","rest","store","props","LEGACY_TO_NEW_DISPLAY_NAME","__unstableComposite","__unstableCompositeGroup","__unstableCompositeItem","__unstableUseCompositeState","proxyComposite","ProxiedComponent","propMap","_ProxiedComponent$dis","displayName","Component","since","alternative","hasOwnProperty","undefined","id","baseId","Object","entries","forEach","from","to","assign","UnproxiedCompositeGroup","role","ref","Row","Group","CompositeGroup","CompositeItem","Item","focusable","useCompositeState","legacyStateOptions","currentId","defaultActiveId","orientation","rtl","loop","focusLoop","wrap","focusWrap","shift","focusShift","unstable_virtual","virtualFocus","useCompositeStore"],"sources":["@wordpress/components/src/composite/legacy/index.tsx"],"sourcesContent":["/**\n * Composite is a component that may contain navigable items represented by\n * CompositeItem. It's inspired by the WAI-ARIA Composite Role and implements\n * all the keyboard navigation mechanisms to ensure that there's only one\n * tab stop for the whole Composite element. This means that it can behave as\n * a roving tabindex or aria-activedescendant container.\n *\n * This file aims at providing components that are as close as possible to the\n * original `reakit`-based implementation (which was removed from the codebase),\n * although it is recommended that consumers of the package switch to the stable,\n * un-prefixed, `ariakit`-based version of `Composite`.\n *\n * @see https://ariakit.org/components/composite\n */\n\n/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\nimport { useInstanceId } from '@wordpress/compose';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport { Composite as Current } from '..';\n\ntype Orientation = 'horizontal' | 'vertical';\n\nexport interface LegacyStateOptions {\n\t/**\n\t * ID that will serve as a base for all the items IDs.\n\t */\n\tbaseId?: string;\n\t/**\n\t * Determines how next and previous functions will behave. If `rtl` is set\n\t * to `true`, they will be inverted. This only affects the composite widget\n\t * behavior. You still need to set `dir=\"rtl\"` on HTML/CSS.\n\t *\n\t * @default false\n\t */\n\trtl?: boolean;\n\t/**\n\t * Defines the orientation of the composite widget. If the composite has a\n\t * single row or column (one-dimensional), the orientation value determines\n\t * which arrow keys can be used to move focus.\n\t */\n\torientation?: Orientation;\n\t/**\n\t * The current focused item `id`.\n\t */\n\tcurrentId?: string;\n\t/**\n\t * Determines how focus moves from the start and end of rows and columns.\n\t *\n\t * @default false\n\t */\n\tloop?: boolean | Orientation;\n\t/**\n\t * If enabled, moving to the next item from the last one in a row or column\n\t * will focus the first item in the next row or column and vice-versa.\n\t *\n\t * ** Has effect only on two-dimensional composites. **\n\t *\n\t * @default false\n\t */\n\twrap?: boolean | Orientation;\n\t/**\n\t * If enabled, moving up or down when there's no next item or the next item\n\t * is disabled will shift to the item right before it.\n\t *\n\t * ** Has effect only on two-dimensional composites. **\n\t *\n\t * @default false\n\t */\n\tshift?: boolean;\n\tunstable_virtual?: boolean;\n}\n\ntype Component = React.FunctionComponent< any >;\n\ntype CompositeStore = ReturnType< typeof Ariakit.useCompositeStore >;\ntype CompositeStoreState = { store: CompositeStore };\nexport type CompositeState = CompositeStoreState &\n\tRequired< Pick< LegacyStateOptions, 'baseId' > >;\n\n// Legacy composite components can either provide state through a\n// single `state` prop, or via individual props, usually through\n// spreading the state generated by `useCompositeState`.\n// That is, `<Composite* { ...state }>`.\nexport type CompositeStateProps =\n\t| { state: CompositeState }\n\t| ( CompositeState & { state?: never } );\ntype ComponentProps< C extends Component > = React.ComponentPropsWithRef< C >;\nexport type CompositeProps< C extends Component > = ComponentProps< C > &\n\tCompositeStateProps;\ntype CompositeComponent< C extends Component > = (\n\tprops: CompositeProps< C >\n) => React.ReactElement;\ntype CompositeComponentProps = CompositeState &\n\t(\n\t\t| ComponentProps< typeof Current.Group >\n\t\t| ComponentProps< typeof Current.Item >\n\t\t| ComponentProps< typeof Current.Row >\n\t);\n\nfunction mapLegacyStatePropsToComponentProps(\n\tlegacyProps: CompositeStateProps\n): CompositeComponentProps {\n\t// If a `state` prop is provided, we unpack that; otherwise,\n\t// the necessary props are provided directly in `legacyProps`.\n\tif ( legacyProps.state ) {\n\t\tconst { state, ...rest } = legacyProps;\n\t\tconst { store, ...props } =\n\t\t\tmapLegacyStatePropsToComponentProps( state );\n\t\treturn { ...rest, ...props, store };\n\t}\n\n\treturn legacyProps;\n}\n\nconst LEGACY_TO_NEW_DISPLAY_NAME = {\n\t__unstableComposite: 'Composite',\n\t__unstableCompositeGroup: 'Composite.Group or Composite.Row',\n\t__unstableCompositeItem: 'Composite.Item',\n\t__unstableUseCompositeState: 'Composite',\n};\n\nfunction proxyComposite< C extends Component >(\n\tProxiedComponent: C | React.ForwardRefExoticComponent< C >,\n\tpropMap: Record< string, string > = {}\n): CompositeComponent< C > {\n\tconst displayName = ProxiedComponent.displayName ?? '';\n\n\tconst Component = ( legacyProps: CompositeStateProps ) => {\n\t\tdeprecated( `wp.components.${ displayName }`, {\n\t\t\tsince: '6.7',\n\t\t\talternative: LEGACY_TO_NEW_DISPLAY_NAME.hasOwnProperty(\n\t\t\t\tdisplayName\n\t\t\t)\n\t\t\t\t? LEGACY_TO_NEW_DISPLAY_NAME[\n\t\t\t\t\t\tdisplayName as keyof typeof LEGACY_TO_NEW_DISPLAY_NAME\n\t\t\t\t ]\n\t\t\t\t: undefined,\n\t\t} );\n\n\t\tconst { store, ...rest } =\n\t\t\tmapLegacyStatePropsToComponentProps( legacyProps );\n\t\tconst props = rest as ComponentProps< C >;\n\t\tprops.id = useInstanceId( store, props.baseId, props.id );\n\n\t\tObject.entries( propMap ).forEach( ( [ from, to ] ) => {\n\t\t\tif ( props.hasOwnProperty( from ) ) {\n\t\t\t\tObject.assign( props, { [ to ]: props[ from ] } );\n\t\t\t\tdelete props[ from ];\n\t\t\t}\n\t\t} );\n\n\t\tdelete props.baseId;\n\n\t\treturn <ProxiedComponent { ...props } store={ store } />;\n\t};\n\tComponent.displayName = displayName;\n\treturn Component;\n}\n\n// The old `CompositeGroup` used to behave more like the current\n// `CompositeRow`, but this has been split into two different\n// components. We handle that difference by checking on the\n// provided role, and returning the appropriate component.\nconst UnproxiedCompositeGroup = forwardRef<\n\tany,\n\tReact.ComponentPropsWithoutRef< typeof Current.Group | typeof Current.Row >\n>( ( { role, ...props }, ref ) => {\n\tconst Component = role === 'row' ? Current.Row : Current.Group;\n\treturn <Component ref={ ref } role={ role } { ...props } />;\n} );\n\n/**\n * _Note: please use the `Composite` component instead._\n *\n * @deprecated\n */\nexport const Composite = proxyComposite(\n\tObject.assign( Current, { displayName: '__unstableComposite' } ),\n\t{ baseId: 'id' }\n);\n/**\n * _Note: please use the `Composite.Row` or `Composite.Group` components instead._\n *\n * @deprecated\n */\nexport const CompositeGroup = proxyComposite(\n\tObject.assign( UnproxiedCompositeGroup, {\n\t\tdisplayName: '__unstableCompositeGroup',\n\t} )\n);\n/**\n * _Note: please use the `Composite.Item` component instead._\n *\n * @deprecated\n */\nexport const CompositeItem = proxyComposite(\n\tObject.assign( Current.Item, {\n\t\tdisplayName: '__unstableCompositeItem',\n\t} ),\n\t{\n\t\tfocusable: 'accessibleWhenDisabled',\n\t}\n);\n\n/**\n * _Note: please use the `Composite` component instead._\n *\n * @deprecated\n */\nexport function useCompositeState(\n\tlegacyStateOptions: LegacyStateOptions = {}\n): CompositeState {\n\tdeprecated( `wp.components.__unstableUseCompositeState`, {\n\t\tsince: '6.7',\n\t\talternative: LEGACY_TO_NEW_DISPLAY_NAME.__unstableUseCompositeState,\n\t} );\n\n\tconst {\n\t\tbaseId,\n\t\tcurrentId: defaultActiveId,\n\t\torientation,\n\t\trtl = false,\n\t\tloop: focusLoop = false,\n\t\twrap: focusWrap = false,\n\t\tshift: focusShift = false,\n\t\t// eslint-disable-next-line camelcase\n\t\tunstable_virtual: virtualFocus,\n\t} = legacyStateOptions;\n\n\treturn {\n\t\tbaseId: useInstanceId( Composite, 'composite', baseId ),\n\t\tstore: Ariakit.useCompositeStore( {\n\t\t\tdefaultActiveId,\n\t\t\trtl,\n\t\t\torientation,\n\t\t\tfocusLoop,\n\t\t\tfocusShift,\n\t\t\tfocusWrap,\n\t\t\tvirtualFocus,\n\t\t} ),\n\t};\n}\n"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,25 @@
1
+ /**
2
+ * External dependencies
3
+ */
4
+ import * as Ariakit from '@ariakit/react';
5
+
6
+ /**
7
+ * WordPress dependencies
8
+ */
9
+ import { forwardRef } from '@wordpress/element';
10
+
11
+ /**
12
+ * Internal dependencies
13
+ */
14
+
15
+ import { useCompositeContext } from './context';
16
+ import { jsx as _jsx } from "react/jsx-runtime";
17
+ export const CompositeRow = forwardRef(function CompositeRow(props, ref) {
18
+ const context = useCompositeContext();
19
+ return /*#__PURE__*/_jsx(Ariakit.CompositeRow, {
20
+ store: context.store,
21
+ ...props,
22
+ ref: ref
23
+ });
24
+ });
25
+ //# sourceMappingURL=row.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["Ariakit","forwardRef","useCompositeContext","jsx","_jsx","CompositeRow","props","ref","context","store"],"sources":["@wordpress/components/src/composite/row.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { useCompositeContext } from './context';\nimport type { CompositeRowProps } from './types';\n\nexport const CompositeRow = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< CompositeRowProps, 'div', false >\n>( function CompositeRow( props, ref ) {\n\tconst context = useCompositeContext();\n\treturn (\n\t\t<Ariakit.CompositeRow\n\t\t\tstore={ context.store as Ariakit.CompositeStore }\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t/>\n\t);\n} );\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAO,KAAKA,OAAO,MAAM,gBAAgB;;AAEzC;AACA;AACA;AACA,SAASC,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;;AAEA,SAASC,mBAAmB,QAAQ,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAGhD,OAAO,MAAMC,YAAY,GAAGJ,UAAU,CAGnC,SAASI,YAAYA,CAAEC,KAAK,EAAEC,GAAG,EAAG;EACtC,MAAMC,OAAO,GAAGN,mBAAmB,CAAC,CAAC;EACrC,oBACCE,IAAA,CAACJ,OAAO,CAACK,YAAY;IACpBI,KAAK,EAAGD,OAAO,CAACC,KAAiC;IAAA,GAC5CH,KAAK;IACVC,GAAG,EAAGA;EAAK,CACX,CAAC;AAEJ,CAAE,CAAC","ignoreList":[]}
@@ -0,0 +1,25 @@
1
+ /**
2
+ * External dependencies
3
+ */
4
+ import * as Ariakit from '@ariakit/react';
5
+
6
+ /**
7
+ * WordPress dependencies
8
+ */
9
+ import { forwardRef } from '@wordpress/element';
10
+
11
+ /**
12
+ * Internal dependencies
13
+ */
14
+
15
+ import { useCompositeContext } from './context';
16
+ import { jsx as _jsx } from "react/jsx-runtime";
17
+ export const CompositeTypeahead = forwardRef(function CompositeTypeahead(props, ref) {
18
+ const context = useCompositeContext();
19
+ return /*#__PURE__*/_jsx(Ariakit.CompositeTypeahead, {
20
+ store: context.store,
21
+ ...props,
22
+ ref: ref
23
+ });
24
+ });
25
+ //# sourceMappingURL=typeahead.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["Ariakit","forwardRef","useCompositeContext","jsx","_jsx","CompositeTypeahead","props","ref","context","store"],"sources":["@wordpress/components/src/composite/typeahead.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { WordPressComponentProps } from '../context';\nimport { useCompositeContext } from './context';\nimport type { CompositeTypeaheadProps } from './types';\n\nexport const CompositeTypeahead = forwardRef<\n\tHTMLDivElement,\n\tWordPressComponentProps< CompositeTypeaheadProps, 'div', false >\n>( function CompositeTypeahead( props, ref ) {\n\tconst context = useCompositeContext();\n\treturn (\n\t\t<Ariakit.CompositeTypeahead\n\t\t\tstore={ context.store as Ariakit.CompositeStore }\n\t\t\t{ ...props }\n\t\t\tref={ ref }\n\t\t/>\n\t);\n} );\n"],"mappings":"AAAA;AACA;AACA;AACA,OAAO,KAAKA,OAAO,MAAM,gBAAgB;;AAEzC;AACA;AACA;AACA,SAASC,UAAU,QAAQ,oBAAoB;;AAE/C;AACA;AACA;;AAEA,SAASC,mBAAmB,QAAQ,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAGhD,OAAO,MAAMC,kBAAkB,GAAGJ,UAAU,CAGzC,SAASI,kBAAkBA,CAAEC,KAAK,EAAEC,GAAG,EAAG;EAC5C,MAAMC,OAAO,GAAGN,mBAAmB,CAAC,CAAC;EACrC,oBACCE,IAAA,CAACJ,OAAO,CAACK,kBAAkB;IAC1BI,KAAK,EAAGD,OAAO,CAACC,KAAiC;IAAA,GAC5CH,KAAK;IACVC,GAAG,EAAGA;EAAK,CACX,CAAC;AAEJ,CAAE,CAAC","ignoreList":[]}