@astryxdesign/core 0.1.2 → 0.1.3-canary.102854d

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 (586) hide show
  1. package/CHANGELOG.md +165 -0
  2. package/README.md +12 -12
  3. package/dist/Avatar/Avatar.d.ts.map +1 -1
  4. package/dist/Avatar/Avatar.js +11 -5
  5. package/dist/Breadcrumbs/BreadcrumbItem.d.ts +1 -1
  6. package/dist/Breadcrumbs/BreadcrumbItem.d.ts.map +1 -1
  7. package/dist/Breadcrumbs/BreadcrumbItem.js +24 -5
  8. package/dist/Button/Button.d.ts.map +1 -1
  9. package/dist/Button/Button.js +31 -12
  10. package/dist/ButtonGroup/ButtonGroup.d.ts.map +1 -1
  11. package/dist/ButtonGroup/ButtonGroup.js +0 -1
  12. package/dist/Calendar/Calendar.d.ts +5 -4
  13. package/dist/Calendar/Calendar.d.ts.map +1 -1
  14. package/dist/Calendar/Calendar.js +124 -61
  15. package/dist/Calendar/dayCellUtils.d.ts +67 -5
  16. package/dist/Calendar/dayCellUtils.d.ts.map +1 -1
  17. package/dist/Calendar/dayCellUtils.js +139 -18
  18. package/dist/Calendar/hooks/index.d.ts +0 -2
  19. package/dist/Calendar/hooks/index.d.ts.map +1 -1
  20. package/dist/Calendar/hooks/index.js +1 -2
  21. package/dist/Calendar/index.d.ts +3 -3
  22. package/dist/Calendar/index.d.ts.map +1 -1
  23. package/dist/Calendar/index.js +1 -1
  24. package/dist/Calendar/styles.d.ts +3 -9
  25. package/dist/Calendar/styles.d.ts.map +1 -1
  26. package/dist/Calendar/styles.js +3 -11
  27. package/dist/Carousel/Carousel.d.ts.map +1 -1
  28. package/dist/Carousel/Carousel.js +17 -3
  29. package/dist/Center/Center.d.ts +11 -1
  30. package/dist/Center/Center.d.ts.map +1 -1
  31. package/dist/Center/Center.js +9 -3
  32. package/dist/Chat/ChatComposerInput.d.ts.map +1 -1
  33. package/dist/Chat/ChatComposerInput.js +0 -1
  34. package/dist/Chat/ChatMessageList.d.ts +14 -1
  35. package/dist/Chat/ChatMessageList.d.ts.map +1 -1
  36. package/dist/Chat/ChatMessageList.js +2 -0
  37. package/dist/Chat/useTriggerMenu.d.ts +8 -1
  38. package/dist/Chat/useTriggerMenu.d.ts.map +1 -1
  39. package/dist/Chat/useTriggerMenu.js +15 -3
  40. package/dist/CheckboxInput/CheckboxInput.d.ts +23 -2
  41. package/dist/CheckboxInput/CheckboxInput.d.ts.map +1 -1
  42. package/dist/CheckboxInput/CheckboxInput.js +51 -9
  43. package/dist/CheckboxList/CheckboxList.d.ts +13 -1
  44. package/dist/CheckboxList/CheckboxList.d.ts.map +1 -1
  45. package/dist/CheckboxList/CheckboxList.js +39 -9
  46. package/dist/CheckboxList/CheckboxListContext.d.ts +7 -0
  47. package/dist/CheckboxList/CheckboxListContext.d.ts.map +1 -1
  48. package/dist/CheckboxList/CheckboxListItem.d.ts.map +1 -1
  49. package/dist/CheckboxList/CheckboxListItem.js +0 -1
  50. package/dist/Citation/Citation.d.ts.map +1 -1
  51. package/dist/Citation/Citation.js +9 -5
  52. package/dist/CodeBlock/CodeBlock.d.ts.map +1 -1
  53. package/dist/CodeBlock/CodeBlock.js +51 -37
  54. package/dist/CommandPalette/CommandPalette.d.ts.map +1 -1
  55. package/dist/CommandPalette/CommandPalette.js +5 -5
  56. package/dist/ContextMenu/ContextMenu.d.ts +12 -5
  57. package/dist/ContextMenu/ContextMenu.d.ts.map +1 -1
  58. package/dist/ContextMenu/ContextMenu.js +96 -11
  59. package/dist/DateInput/DateInput.d.ts +23 -1
  60. package/dist/DateInput/DateInput.d.ts.map +1 -1
  61. package/dist/DateInput/DateInput.js +167 -99
  62. package/dist/DateRangeInput/DateRangeInput.d.ts +23 -1
  63. package/dist/DateRangeInput/DateRangeInput.d.ts.map +1 -1
  64. package/dist/DateRangeInput/DateRangeInput.js +42 -9
  65. package/dist/DateTimeInput/DateTimeInput.d.ts +35 -2
  66. package/dist/DateTimeInput/DateTimeInput.d.ts.map +1 -1
  67. package/dist/DateTimeInput/DateTimeInput.js +78 -15
  68. package/dist/Dialog/Dialog.d.ts.map +1 -1
  69. package/dist/Dialog/Dialog.js +12 -0
  70. package/dist/DropdownMenu/DropdownMenu.d.ts +1 -8
  71. package/dist/DropdownMenu/DropdownMenu.d.ts.map +1 -1
  72. package/dist/DropdownMenu/DropdownMenu.js +42 -14
  73. package/dist/Field/Field.d.ts +19 -2
  74. package/dist/Field/Field.d.ts.map +1 -1
  75. package/dist/Field/Field.js +4 -0
  76. package/dist/Field/FieldLabel.d.ts +21 -2
  77. package/dist/Field/FieldLabel.d.ts.map +1 -1
  78. package/dist/Field/FieldLabel.js +41 -26
  79. package/dist/FileInput/FileInput.d.ts +22 -1
  80. package/dist/FileInput/FileInput.d.ts.map +1 -1
  81. package/dist/FileInput/FileInput.js +56 -10
  82. package/dist/Grid/Grid.d.ts +11 -1
  83. package/dist/Grid/Grid.d.ts.map +1 -1
  84. package/dist/Grid/Grid.js +32 -6
  85. package/dist/InputGroup/InputGroup.d.ts +4 -3
  86. package/dist/InputGroup/InputGroup.d.ts.map +1 -1
  87. package/dist/InputGroup/InputGroup.js +16 -6
  88. package/dist/InputGroup/InputGroupContext.d.ts +4 -0
  89. package/dist/InputGroup/InputGroupContext.d.ts.map +1 -1
  90. package/dist/InputGroup/InputGroupContext.js +2 -2
  91. package/dist/InputGroup/groupStyles.d.ts +1 -1
  92. package/dist/InputGroup/groupStyles.d.ts.map +1 -1
  93. package/dist/InputGroup/groupStyles.js +3 -3
  94. package/dist/InputGroup/index.d.ts +1 -0
  95. package/dist/InputGroup/index.d.ts.map +1 -1
  96. package/dist/Kbd/Kbd.d.ts.map +1 -1
  97. package/dist/Kbd/Kbd.js +33 -1
  98. package/dist/Layer/layerAnimations.stylex.d.ts +4 -0
  99. package/dist/Layer/layerAnimations.stylex.d.ts.map +1 -1
  100. package/dist/Layer/layerAnimations.stylex.js +8 -4
  101. package/dist/Layer/useLayer.d.ts +10 -0
  102. package/dist/Layer/useLayer.d.ts.map +1 -1
  103. package/dist/Layer/useLayer.js +64 -9
  104. package/dist/Layout/Layout.d.ts +4 -11
  105. package/dist/Layout/Layout.d.ts.map +1 -1
  106. package/dist/Layout/Layout.js +10 -11
  107. package/dist/Layout/LayoutFooter.d.ts +2 -2
  108. package/dist/Layout/LayoutFooter.d.ts.map +1 -1
  109. package/dist/Layout/LayoutHeader.d.ts +2 -2
  110. package/dist/Layout/LayoutHeader.d.ts.map +1 -1
  111. package/dist/Layout/LayoutPanel.d.ts +2 -2
  112. package/dist/Layout/LayoutPanel.d.ts.map +1 -1
  113. package/dist/Layout/padding.stylex.d.ts +51 -0
  114. package/dist/Layout/padding.stylex.d.ts.map +1 -1
  115. package/dist/Layout/padding.stylex.js +63 -0
  116. package/dist/Lightbox/Lightbox.d.ts.map +1 -1
  117. package/dist/Lightbox/Lightbox.js +4 -2
  118. package/dist/Link/Link.d.ts +16 -1
  119. package/dist/Link/Link.d.ts.map +1 -1
  120. package/dist/Link/Link.js +18 -7
  121. package/dist/Markdown/Markdown.d.ts.map +1 -1
  122. package/dist/Markdown/Markdown.js +7 -0
  123. package/dist/MoreMenu/MoreMenu.d.ts +1 -7
  124. package/dist/MoreMenu/MoreMenu.d.ts.map +1 -1
  125. package/dist/MoreMenu/MoreMenu.js +0 -2
  126. package/dist/MultiSelector/MultiSelector.d.ts +27 -2
  127. package/dist/MultiSelector/MultiSelector.d.ts.map +1 -1
  128. package/dist/MultiSelector/MultiSelector.js +141 -42
  129. package/dist/MultiSelector/hooks.d.ts +12 -1
  130. package/dist/MultiSelector/hooks.d.ts.map +1 -1
  131. package/dist/MultiSelector/hooks.js +14 -1
  132. package/dist/NavMenu/NavHeadingMenu.d.ts.map +1 -1
  133. package/dist/NavMenu/NavHeadingMenu.js +34 -3
  134. package/dist/NumberInput/NumberInput.d.ts +23 -2
  135. package/dist/NumberInput/NumberInput.d.ts.map +1 -1
  136. package/dist/NumberInput/NumberInput.js +62 -12
  137. package/dist/Pagination/Pagination.d.ts +1 -1
  138. package/dist/Pagination/Pagination.d.ts.map +1 -1
  139. package/dist/Pagination/Pagination.js +15 -1
  140. package/dist/Popover/Popover.d.ts +18 -2
  141. package/dist/Popover/Popover.d.ts.map +1 -1
  142. package/dist/Popover/Popover.js +5 -2
  143. package/dist/Popover/usePopover.d.ts +38 -3
  144. package/dist/Popover/usePopover.d.ts.map +1 -1
  145. package/dist/Popover/usePopover.js +24 -9
  146. package/dist/PowerSearch/PowerSearch.d.ts +11 -1
  147. package/dist/PowerSearch/PowerSearch.d.ts.map +1 -1
  148. package/dist/PowerSearch/PowerSearch.js +6 -1
  149. package/dist/ProgressBar/ProgressBar.d.ts.map +1 -1
  150. package/dist/ProgressBar/ProgressBar.js +3 -5
  151. package/dist/RadioList/RadioList.d.ts +20 -2
  152. package/dist/RadioList/RadioList.d.ts.map +1 -1
  153. package/dist/RadioList/RadioList.js +105 -9
  154. package/dist/RadioList/RadioListItem.d.ts.map +1 -1
  155. package/dist/RadioList/RadioListItem.js +13 -2
  156. package/dist/SegmentedControl/SegmentedControl.d.ts +13 -2
  157. package/dist/SegmentedControl/SegmentedControl.d.ts.map +1 -1
  158. package/dist/SegmentedControl/SegmentedControl.js +78 -44
  159. package/dist/SegmentedControl/SegmentedControlContext.d.ts +7 -0
  160. package/dist/SegmentedControl/SegmentedControlContext.d.ts.map +1 -1
  161. package/dist/SegmentedControl/SegmentedControlItem.d.ts.map +1 -1
  162. package/dist/SegmentedControl/SegmentedControlItem.js +13 -2
  163. package/dist/Selector/Selector.d.ts +24 -1
  164. package/dist/Selector/Selector.d.ts.map +1 -1
  165. package/dist/Selector/Selector.js +122 -43
  166. package/dist/Selector/hooks.d.ts +8 -1
  167. package/dist/Selector/hooks.d.ts.map +1 -1
  168. package/dist/Selector/hooks.js +14 -1
  169. package/dist/SideNav/SideNavHeading.d.ts.map +1 -1
  170. package/dist/SideNav/SideNavHeading.js +2 -0
  171. package/dist/SideNav/SideNavItem.d.ts.map +1 -1
  172. package/dist/SideNav/SideNavItem.js +1 -1
  173. package/dist/Skeleton/Skeleton.d.ts.map +1 -1
  174. package/dist/Skeleton/Skeleton.js +8 -2
  175. package/dist/Slider/Slider.d.ts +21 -0
  176. package/dist/Slider/Slider.d.ts.map +1 -1
  177. package/dist/Slider/Slider.js +36 -9
  178. package/dist/Spinner/Spinner.d.ts.map +1 -1
  179. package/dist/Spinner/Spinner.js +1 -1
  180. package/dist/Stack/Stack.d.ts +38 -23
  181. package/dist/Stack/Stack.d.ts.map +1 -1
  182. package/dist/Stack/Stack.js +25 -1
  183. package/dist/Stack/StackItem.d.ts +12 -23
  184. package/dist/Stack/StackItem.d.ts.map +1 -1
  185. package/dist/Stack/StackItem.js +8 -1
  186. package/dist/Switch/Switch.d.ts +23 -2
  187. package/dist/Switch/Switch.d.ts.map +1 -1
  188. package/dist/Switch/Switch.js +41 -11
  189. package/dist/TabList/Tab.d.ts.map +1 -1
  190. package/dist/TabList/Tab.js +6 -0
  191. package/dist/TabList/TabList.d.ts +16 -4
  192. package/dist/TabList/TabList.d.ts.map +1 -1
  193. package/dist/TabList/TabList.js +87 -10
  194. package/dist/TabList/TabListContext.d.ts +5 -0
  195. package/dist/TabList/TabListContext.d.ts.map +1 -1
  196. package/dist/TabList/TabListContext.js +5 -0
  197. package/dist/TabList/TabMenu.d.ts.map +1 -1
  198. package/dist/TabList/TabMenu.js +6 -1
  199. package/dist/Table/BaseTable.d.ts.map +1 -1
  200. package/dist/Table/BaseTable.js +13 -9
  201. package/dist/Table/Table.d.ts.map +1 -1
  202. package/dist/Table/Table.js +10 -1
  203. package/dist/Table/TableCell.d.ts +8 -1
  204. package/dist/Table/TableCell.d.ts.map +1 -1
  205. package/dist/Table/TableCell.js +79 -10
  206. package/dist/Table/TableHeaderCell.d.ts +8 -1
  207. package/dist/Table/TableHeaderCell.d.ts.map +1 -1
  208. package/dist/Table/TableHeaderCell.js +16 -16
  209. package/dist/Table/index.d.ts +4 -1
  210. package/dist/Table/index.d.ts.map +1 -1
  211. package/dist/Table/index.js +3 -2
  212. package/dist/Table/plugins/pagination/paginateData.d.ts +2 -1
  213. package/dist/Table/plugins/pagination/paginateData.d.ts.map +1 -1
  214. package/dist/Table/plugins/pagination/paginateData.js +8 -3
  215. package/dist/Table/plugins/pagination/useTablePagination.d.ts.map +1 -1
  216. package/dist/Table/plugins/pagination/useTablePagination.js +6 -1
  217. package/dist/Table/plugins/rowExpansion/index.d.ts +3 -0
  218. package/dist/Table/plugins/rowExpansion/index.d.ts.map +1 -0
  219. package/dist/Table/plugins/rowExpansion/index.js +3 -0
  220. package/dist/Table/plugins/rowExpansion/useTableRowExpansion.d.ts +90 -0
  221. package/dist/Table/plugins/rowExpansion/useTableRowExpansion.d.ts.map +1 -0
  222. package/dist/Table/plugins/rowExpansion/useTableRowExpansion.js +398 -0
  223. package/dist/Table/plugins/sortable/useTableSortable.d.ts.map +1 -1
  224. package/dist/Table/plugins/sortable/useTableSortable.js +59 -3
  225. package/dist/Table/tableContextMenu.d.ts +37 -0
  226. package/dist/Table/tableContextMenu.d.ts.map +1 -0
  227. package/dist/Table/tableContextMenu.js +140 -0
  228. package/dist/Table/types.d.ts +66 -0
  229. package/dist/Table/types.d.ts.map +1 -1
  230. package/dist/TextArea/TextArea.d.ts +22 -1
  231. package/dist/TextArea/TextArea.d.ts.map +1 -1
  232. package/dist/TextArea/TextArea.js +41 -9
  233. package/dist/TextInput/TextInput.d.ts +23 -2
  234. package/dist/TextInput/TextInput.d.ts.map +1 -1
  235. package/dist/TextInput/TextInput.js +55 -10
  236. package/dist/TimeInput/TimeInput.d.ts +23 -1
  237. package/dist/TimeInput/TimeInput.d.ts.map +1 -1
  238. package/dist/TimeInput/TimeInput.js +147 -76
  239. package/dist/Toast/Toast.d.ts.map +1 -1
  240. package/dist/Toast/Toast.js +14 -0
  241. package/dist/Toast/ToastViewport.d.ts.map +1 -1
  242. package/dist/Toast/ToastViewport.js +131 -3
  243. package/dist/Tokenizer/Tokenizer.d.ts +12 -1
  244. package/dist/Tokenizer/Tokenizer.d.ts.map +1 -1
  245. package/dist/Tokenizer/Tokenizer.js +26 -4
  246. package/dist/Toolbar/Toolbar.d.ts +3 -3
  247. package/dist/Toolbar/Toolbar.d.ts.map +1 -1
  248. package/dist/Toolbar/Toolbar.js +51 -7
  249. package/dist/Tooltip/useTooltip.d.ts.map +1 -1
  250. package/dist/Tooltip/useTooltip.js +56 -9
  251. package/dist/TopNav/TopNavHeading.d.ts +7 -1
  252. package/dist/TopNav/TopNavHeading.d.ts.map +1 -1
  253. package/dist/TopNav/TopNavHeading.js +8 -0
  254. package/dist/TreeList/TreeList.d.ts +1 -1
  255. package/dist/TreeList/TreeList.d.ts.map +1 -1
  256. package/dist/TreeList/TreeList.js +72 -2
  257. package/dist/TreeList/TreeListItem.d.ts +11 -1
  258. package/dist/TreeList/TreeListItem.d.ts.map +1 -1
  259. package/dist/TreeList/TreeListItem.js +51 -12
  260. package/dist/TreeList/treeListItem.markers.stylex.d.ts +16 -0
  261. package/dist/TreeList/treeListItem.markers.stylex.d.ts.map +1 -0
  262. package/dist/TreeList/treeListItem.markers.stylex.js +22 -0
  263. package/dist/Typeahead/BaseTypeahead.d.ts +13 -0
  264. package/dist/Typeahead/BaseTypeahead.d.ts.map +1 -1
  265. package/dist/Typeahead/BaseTypeahead.js +69 -6
  266. package/dist/Typeahead/Typeahead.d.ts +26 -3
  267. package/dist/Typeahead/Typeahead.d.ts.map +1 -1
  268. package/dist/Typeahead/Typeahead.js +65 -29
  269. package/dist/VisuallyHidden/VisuallyHidden.d.ts +61 -0
  270. package/dist/VisuallyHidden/VisuallyHidden.d.ts.map +1 -0
  271. package/dist/VisuallyHidden/VisuallyHidden.js +65 -0
  272. package/dist/VisuallyHidden/index.d.ts +11 -0
  273. package/dist/VisuallyHidden/index.d.ts.map +1 -0
  274. package/dist/VisuallyHidden/index.js +13 -0
  275. package/dist/astryx.css +22 -0
  276. package/dist/astryx.umd.js +55 -55
  277. package/dist/astryx.umd.js.map +4 -4
  278. package/dist/hooks/focusableSelector.d.ts +22 -0
  279. package/dist/hooks/focusableSelector.d.ts.map +1 -0
  280. package/dist/hooks/focusableSelector.js +24 -0
  281. package/dist/hooks/index.d.ts +12 -2
  282. package/dist/hooks/index.d.ts.map +1 -1
  283. package/dist/hooks/index.js +7 -2
  284. package/dist/hooks/useAnnounce.d.ts +40 -0
  285. package/dist/hooks/useAnnounce.d.ts.map +1 -0
  286. package/dist/hooks/useAnnounce.js +142 -0
  287. package/dist/hooks/useClickableContainer.d.ts +16 -1
  288. package/dist/hooks/useClickableContainer.d.ts.map +1 -1
  289. package/dist/hooks/useClickableContainer.js +16 -4
  290. package/dist/hooks/useEntryAnimation.d.ts.map +1 -1
  291. package/dist/hooks/useEntryAnimation.js +4 -4
  292. package/dist/hooks/useFocusTrap.d.ts +18 -0
  293. package/dist/hooks/useFocusTrap.d.ts.map +1 -1
  294. package/dist/hooks/useFocusTrap.js +87 -3
  295. package/dist/hooks/useGridFocus.d.ts +88 -1
  296. package/dist/hooks/useGridFocus.d.ts.map +1 -1
  297. package/dist/hooks/useGridFocus.js +261 -62
  298. package/dist/hooks/useKeyboardHint.d.ts +82 -0
  299. package/dist/hooks/useKeyboardHint.d.ts.map +1 -0
  300. package/dist/hooks/useKeyboardHint.js +220 -0
  301. package/dist/hooks/useListFocus.d.ts +78 -7
  302. package/dist/hooks/useListFocus.d.ts.map +1 -1
  303. package/dist/hooks/useListFocus.js +305 -52
  304. package/dist/hooks/useLongPress.d.ts +21 -0
  305. package/dist/hooks/useLongPress.d.ts.map +1 -0
  306. package/dist/hooks/useLongPress.js +89 -0
  307. package/dist/hooks/useTreeFocus.d.ts +157 -0
  308. package/dist/hooks/useTreeFocus.d.ts.map +1 -0
  309. package/dist/hooks/useTreeFocus.js +337 -0
  310. package/dist/hooks/useTypeahead.d.ts +63 -0
  311. package/dist/hooks/useTypeahead.d.ts.map +1 -0
  312. package/dist/hooks/useTypeahead.js +117 -0
  313. package/dist/index.d.ts +1 -0
  314. package/dist/index.d.ts.map +1 -1
  315. package/dist/index.js +1 -0
  316. package/dist/utils/dateTypes.d.ts +12 -0
  317. package/dist/utils/dateTypes.d.ts.map +1 -1
  318. package/dist/utils/dateTypes.js +41 -1
  319. package/dist/utils/index.d.ts +4 -0
  320. package/dist/utils/index.d.ts.map +1 -1
  321. package/dist/utils/index.js +3 -1
  322. package/dist/utils/inputAria.d.ts +29 -0
  323. package/dist/utils/inputAria.d.ts.map +1 -0
  324. package/dist/utils/inputAria.js +30 -0
  325. package/dist/utils/timeParser.d.ts.map +1 -1
  326. package/dist/utils/timeParser.js +5 -2
  327. package/docs.mjs +2 -2
  328. package/package.json +12 -8
  329. package/src/Avatar/Avatar.doc.mjs +2 -2
  330. package/src/Avatar/Avatar.test.tsx +37 -0
  331. package/src/Avatar/Avatar.tsx +10 -5
  332. package/src/Breadcrumbs/BreadcrumbItem.tsx +25 -7
  333. package/src/Breadcrumbs/Breadcrumbs.test.tsx +31 -10
  334. package/src/Button/Button.tsx +42 -22
  335. package/src/ButtonGroup/ButtonGroup.test.tsx +9 -9
  336. package/src/ButtonGroup/ButtonGroup.tsx +0 -1
  337. package/src/Calendar/Calendar.doc.mjs +4 -4
  338. package/src/Calendar/Calendar.test.tsx +247 -30
  339. package/src/Calendar/Calendar.tsx +173 -86
  340. package/src/Calendar/dayCellUtils.test.ts +306 -1
  341. package/src/Calendar/dayCellUtils.ts +206 -13
  342. package/src/Calendar/hooks/index.ts +0 -6
  343. package/src/Calendar/index.ts +1 -3
  344. package/src/Calendar/styles.ts +4 -9
  345. package/src/Carousel/Carousel.doc.mjs +7 -1
  346. package/src/Carousel/Carousel.test.tsx +20 -0
  347. package/src/Carousel/Carousel.tsx +16 -1
  348. package/src/Center/Center.doc.mjs +12 -2
  349. package/src/Center/Center.tsx +28 -3
  350. package/src/Chat/ChatComposerInput.test.tsx +26 -7
  351. package/src/Chat/ChatComposerInput.tsx +0 -1
  352. package/src/Chat/ChatDictationButton.doc.mjs +1 -1
  353. package/src/Chat/ChatMessageList.doc.mjs +8 -0
  354. package/src/Chat/ChatMessageList.test.tsx +18 -0
  355. package/src/Chat/ChatMessageList.tsx +16 -0
  356. package/src/Chat/useTriggerMenu.tsx +22 -4
  357. package/src/CheckboxInput/CheckboxInput.doc.mjs +10 -0
  358. package/src/CheckboxInput/CheckboxInput.test.tsx +172 -27
  359. package/src/CheckboxInput/CheckboxInput.tsx +78 -6
  360. package/src/CheckboxList/CheckboxList.doc.mjs +9 -0
  361. package/src/CheckboxList/CheckboxList.test.tsx +192 -26
  362. package/src/CheckboxList/CheckboxList.tsx +56 -3
  363. package/src/CheckboxList/CheckboxListContext.tsx +7 -0
  364. package/src/CheckboxList/CheckboxListItem.tsx +0 -3
  365. package/src/Citation/Citation.doc.mjs +10 -0
  366. package/src/Citation/Citation.test.tsx +121 -0
  367. package/src/Citation/Citation.tsx +15 -3
  368. package/src/CodeBlock/CodeBlock.test.tsx +115 -0
  369. package/src/CodeBlock/CodeBlock.tsx +63 -33
  370. package/src/CommandPalette/CommandPalette.test.tsx +47 -1
  371. package/src/CommandPalette/CommandPalette.tsx +9 -21
  372. package/src/ContextMenu/ContextMenu.doc.mjs +4 -4
  373. package/src/ContextMenu/ContextMenu.test.tsx +155 -1
  374. package/src/ContextMenu/ContextMenu.tsx +129 -16
  375. package/src/DateInput/DateInput.doc.mjs +291 -56
  376. package/src/DateInput/DateInput.test.tsx +248 -2
  377. package/src/DateInput/DateInput.tsx +196 -100
  378. package/src/DateRangeInput/DateRangeInput.doc.mjs +251 -46
  379. package/src/DateRangeInput/DateRangeInput.test.tsx +182 -20
  380. package/src/DateRangeInput/DateRangeInput.tsx +63 -5
  381. package/src/DateTimeInput/DateTimeInput.doc.mjs +368 -67
  382. package/src/DateTimeInput/DateTimeInput.test.tsx +279 -11
  383. package/src/DateTimeInput/DateTimeInput.tsx +125 -17
  384. package/src/Dialog/Dialog.doc.mjs +2 -2
  385. package/src/Dialog/Dialog.tsx +12 -0
  386. package/src/DropdownMenu/DropdownMenu.doc.mjs +1 -8
  387. package/src/DropdownMenu/DropdownMenu.test.tsx +56 -42
  388. package/src/DropdownMenu/DropdownMenu.tsx +52 -18
  389. package/src/Field/Field.doc.mjs +59 -18
  390. package/src/Field/Field.test.tsx +32 -0
  391. package/src/Field/Field.tsx +23 -5
  392. package/src/Field/FieldLabel.tsx +55 -17
  393. package/src/FileInput/FileInput.doc.mjs +17 -0
  394. package/src/FileInput/FileInput.test.tsx +283 -49
  395. package/src/FileInput/FileInput.tsx +76 -4
  396. package/src/Grid/Grid.doc.mjs +17 -4
  397. package/src/Grid/Grid.test.tsx +43 -30
  398. package/src/Grid/Grid.tsx +38 -3
  399. package/src/Icon/Icon.doc.mjs +3 -3
  400. package/src/InputGroup/InputGroup.doc.mjs +111 -23
  401. package/src/InputGroup/InputGroup.test.tsx +257 -60
  402. package/src/InputGroup/InputGroup.tsx +23 -5
  403. package/src/InputGroup/InputGroupContext.ts +9 -4
  404. package/src/InputGroup/groupStyles.ts +7 -1
  405. package/src/InputGroup/index.ts +1 -0
  406. package/src/Kbd/Kbd.test.tsx +22 -4
  407. package/src/Kbd/Kbd.tsx +35 -3
  408. package/src/Layer/layerAnimations.stylex.ts +20 -4
  409. package/src/Layer/useLayer.doc.mjs +5 -0
  410. package/src/Layer/useLayer.test.tsx +111 -0
  411. package/src/Layer/useLayer.tsx +90 -9
  412. package/src/Layout/Layout.tsx +8 -16
  413. package/src/Layout/LayoutFooter.doc.mjs +4 -4
  414. package/src/Layout/LayoutFooter.tsx +3 -3
  415. package/src/Layout/LayoutHeader.doc.mjs +4 -4
  416. package/src/Layout/LayoutHeader.tsx +3 -3
  417. package/src/Layout/LayoutPanel.tsx +3 -3
  418. package/src/Layout/__tests__/edgeCompensation.test.tsx +72 -0
  419. package/src/Layout/padding.stylex.ts +52 -0
  420. package/src/Lightbox/Lightbox.doc.mjs +9 -0
  421. package/src/Lightbox/Lightbox.test.tsx +53 -5
  422. package/src/Lightbox/Lightbox.tsx +9 -4
  423. package/src/Link/Link.doc.mjs +14 -0
  424. package/src/Link/Link.test.tsx +50 -0
  425. package/src/Link/Link.tsx +39 -4
  426. package/src/Markdown/Markdown.test.tsx +11 -0
  427. package/src/Markdown/Markdown.tsx +7 -0
  428. package/src/MetadataList/MetadataListItem.doc.mjs +4 -0
  429. package/src/MoreMenu/MoreMenu.doc.mjs +2 -17
  430. package/src/MoreMenu/MoreMenu.tsx +0 -9
  431. package/src/MultiSelector/MultiSelector.doc.mjs +35 -0
  432. package/src/MultiSelector/MultiSelector.test.tsx +375 -8
  433. package/src/MultiSelector/MultiSelector.tsx +194 -48
  434. package/src/MultiSelector/hooks.ts +27 -0
  435. package/src/NavMenu/NavHeadingMenu.test.tsx +77 -1
  436. package/src/NavMenu/NavHeadingMenu.tsx +50 -3
  437. package/src/NumberInput/NumberInput.doc.mjs +17 -0
  438. package/src/NumberInput/NumberInput.test.tsx +242 -40
  439. package/src/NumberInput/NumberInput.tsx +89 -11
  440. package/src/Pagination/Pagination.doc.mjs +3 -3
  441. package/src/Pagination/Pagination.test.tsx +117 -5
  442. package/src/Pagination/Pagination.tsx +21 -1
  443. package/src/Popover/Popover.doc.mjs +26 -0
  444. package/src/Popover/Popover.test.tsx +121 -0
  445. package/src/Popover/Popover.tsx +23 -2
  446. package/src/Popover/usePopover.doc.mjs +9 -3
  447. package/src/Popover/usePopover.tsx +70 -12
  448. package/src/PowerSearch/PowerSearch.doc.mjs +15 -0
  449. package/src/PowerSearch/PowerSearch.test.tsx +97 -1
  450. package/src/PowerSearch/PowerSearch.tsx +16 -3
  451. package/src/ProgressBar/ProgressBar.test.tsx +34 -26
  452. package/src/ProgressBar/ProgressBar.tsx +3 -4
  453. package/src/RadioList/RadioList.doc.mjs +9 -0
  454. package/src/RadioList/RadioList.test.tsx +252 -16
  455. package/src/RadioList/RadioList.tsx +166 -10
  456. package/src/RadioList/RadioListItem.tsx +14 -2
  457. package/src/SegmentedControl/SegmentedControl.doc.mjs +9 -0
  458. package/src/SegmentedControl/SegmentedControl.test.tsx +214 -42
  459. package/src/SegmentedControl/SegmentedControl.tsx +102 -54
  460. package/src/SegmentedControl/SegmentedControlContext.ts +7 -0
  461. package/src/SegmentedControl/SegmentedControlItem.tsx +14 -1
  462. package/src/SelectableCard/SelectableCard.doc.mjs +1 -1
  463. package/src/Selector/Selector.doc.mjs +31 -0
  464. package/src/Selector/Selector.test.tsx +387 -15
  465. package/src/Selector/Selector.tsx +175 -67
  466. package/src/Selector/hooks.ts +23 -0
  467. package/src/SideNav/SideNav.test.tsx +48 -0
  468. package/src/SideNav/SideNavHeading.tsx +8 -2
  469. package/src/SideNav/SideNavItem.tsx +2 -4
  470. package/src/Skeleton/Skeleton.test.tsx +25 -0
  471. package/src/Skeleton/Skeleton.tsx +11 -1
  472. package/src/Slider/Slider.doc.mjs +15 -0
  473. package/src/Slider/Slider.test.tsx +155 -2
  474. package/src/Slider/Slider.tsx +53 -5
  475. package/src/Spinner/Spinner.tsx +7 -1
  476. package/src/Stack/Stack.doc.mjs +77 -0
  477. package/src/Stack/Stack.test.tsx +55 -5
  478. package/src/Stack/Stack.tsx +73 -24
  479. package/src/Stack/StackItem.test.tsx +23 -0
  480. package/src/Stack/StackItem.tsx +20 -23
  481. package/src/Switch/Switch.doc.mjs +15 -0
  482. package/src/Switch/Switch.test.tsx +162 -27
  483. package/src/Switch/Switch.tsx +61 -21
  484. package/src/TabList/Tab.tsx +6 -0
  485. package/src/TabList/TabList.doc.mjs +9 -3
  486. package/src/TabList/TabList.test.tsx +251 -0
  487. package/src/TabList/TabList.tsx +103 -12
  488. package/src/TabList/TabListContext.ts +7 -3
  489. package/src/TabList/TabMenu.tsx +6 -3
  490. package/src/Table/BaseTable.tsx +24 -18
  491. package/src/Table/Table.doc.mjs +2 -0
  492. package/src/Table/Table.test.tsx +10 -0
  493. package/src/Table/Table.tsx +8 -0
  494. package/src/Table/TableCell.tsx +105 -24
  495. package/src/Table/TableHeaderCell.tsx +28 -29
  496. package/src/Table/index.ts +8 -2
  497. package/src/Table/plugins/pagination/paginateData.ts +10 -3
  498. package/src/Table/plugins/pagination/useTablePagination.test.tsx +16 -0
  499. package/src/Table/plugins/pagination/useTablePagination.tsx +8 -1
  500. package/src/Table/plugins/rowExpansion/index.ts +7 -0
  501. package/src/Table/plugins/rowExpansion/useTableRowExpansion.test.tsx +155 -0
  502. package/src/Table/plugins/rowExpansion/useTableRowExpansion.tsx +590 -0
  503. package/src/Table/plugins/sortable/useTableSortable.test.tsx +91 -2
  504. package/src/Table/plugins/sortable/useTableSortable.tsx +53 -1
  505. package/src/Table/tableContextMenu.test.tsx +181 -0
  506. package/src/Table/tableContextMenu.tsx +160 -0
  507. package/src/Table/types.ts +74 -0
  508. package/src/Table/useTableColumnResize.doc.mjs +3 -3
  509. package/src/Table/useTablePagination.doc.mjs +4 -1
  510. package/src/Table/useTableRowExpansion.doc.mjs +63 -0
  511. package/src/Table/useTableSortable.doc.mjs +4 -1
  512. package/src/Table/useTableStickyColumns.doc.mjs +2 -2
  513. package/src/Text/Text.doc.mjs +18 -18
  514. package/src/TextArea/TextArea.doc.mjs +17 -0
  515. package/src/TextArea/TextArea.test.tsx +167 -35
  516. package/src/TextArea/TextArea.tsx +62 -15
  517. package/src/TextInput/TextInput.doc.mjs +17 -0
  518. package/src/TextInput/TextInput.test.tsx +168 -34
  519. package/src/TextInput/TextInput.tsx +77 -9
  520. package/src/Thumbnail/Thumbnail.doc.mjs +4 -4
  521. package/src/TimeInput/TimeInput.doc.mjs +345 -60
  522. package/src/TimeInput/TimeInput.test.tsx +255 -7
  523. package/src/TimeInput/TimeInput.tsx +176 -70
  524. package/src/Timestamp/Timestamp.doc.mjs +19 -19
  525. package/src/Toast/Toast.tsx +14 -0
  526. package/src/Toast/ToastViewport.test.tsx +214 -0
  527. package/src/Toast/ToastViewport.tsx +167 -21
  528. package/src/Tokenizer/Tokenizer.doc.mjs +29 -14
  529. package/src/Tokenizer/Tokenizer.test.tsx +105 -1
  530. package/src/Tokenizer/Tokenizer.tsx +37 -1
  531. package/src/Toolbar/Toolbar.test.tsx +109 -6
  532. package/src/Toolbar/Toolbar.tsx +59 -5
  533. package/src/Tooltip/Tooltip.test.tsx +68 -0
  534. package/src/Tooltip/useTooltip.tsx +55 -8
  535. package/src/TopNav/TopNav.test.tsx +50 -0
  536. package/src/TopNav/TopNavHeading.tsx +17 -1
  537. package/src/TreeList/TreeList.test.tsx +295 -6
  538. package/src/TreeList/TreeList.tsx +73 -1
  539. package/src/TreeList/TreeListItem.tsx +51 -5
  540. package/src/TreeList/treeListItem.markers.stylex.ts +20 -0
  541. package/src/Typeahead/BaseTypeahead.tsx +93 -9
  542. package/src/Typeahead/Typeahead.doc.mjs +146 -30
  543. package/src/Typeahead/Typeahead.test.tsx +331 -1
  544. package/src/Typeahead/Typeahead.tsx +105 -33
  545. package/src/VisuallyHidden/VisuallyHidden.doc.mjs +80 -0
  546. package/src/VisuallyHidden/VisuallyHidden.test.tsx +76 -0
  547. package/src/VisuallyHidden/VisuallyHidden.tsx +113 -0
  548. package/src/VisuallyHidden/index.ts +15 -0
  549. package/src/docs-script.test.mjs +50 -0
  550. package/src/hooks/focusableSelector.ts +25 -0
  551. package/src/hooks/index.ts +28 -2
  552. package/src/hooks/useAnnounce.test.tsx +101 -0
  553. package/src/hooks/useAnnounce.ts +168 -0
  554. package/src/hooks/useClickableContainer.ts +16 -4
  555. package/src/hooks/useEntryAnimation.ts +16 -4
  556. package/src/hooks/useFocusTrap.test.tsx +132 -0
  557. package/src/hooks/useFocusTrap.ts +98 -4
  558. package/src/hooks/useGridFocus.doc.mjs +40 -2
  559. package/src/hooks/useGridFocus.test.tsx +132 -0
  560. package/src/hooks/useGridFocus.ts +343 -67
  561. package/src/hooks/useKeyboardHint.doc.mjs +101 -0
  562. package/src/hooks/useKeyboardHint.test.tsx +70 -0
  563. package/src/hooks/useKeyboardHint.tsx +332 -0
  564. package/src/hooks/useListFocus.doc.mjs +50 -10
  565. package/src/hooks/useListFocus.test.tsx +375 -0
  566. package/src/hooks/useListFocus.ts +395 -57
  567. package/src/hooks/useLongPress.test.tsx +134 -0
  568. package/src/hooks/useLongPress.ts +119 -0
  569. package/src/hooks/useTreeFocus.doc.mjs +140 -0
  570. package/src/hooks/useTreeFocus.test.tsx +214 -0
  571. package/src/hooks/useTreeFocus.ts +559 -0
  572. package/src/hooks/useTypeahead.test.tsx +109 -0
  573. package/src/hooks/useTypeahead.ts +183 -0
  574. package/src/index.ts +1 -0
  575. package/src/theme/derivedVarRegistry.test.ts +10 -5
  576. package/src/utils/dateTypes.test.ts +40 -0
  577. package/src/utils/dateTypes.ts +40 -0
  578. package/src/utils/index.ts +9 -0
  579. package/src/utils/inputAria.test.ts +39 -0
  580. package/src/utils/inputAria.ts +58 -0
  581. package/src/utils/timeParser.test.ts +10 -0
  582. package/src/utils/timeParser.ts +5 -2
  583. package/dist/Calendar/hooks/useCalendarRovingTabindex.d.ts +0 -57
  584. package/dist/Calendar/hooks/useCalendarRovingTabindex.d.ts.map +0 -1
  585. package/dist/Calendar/hooks/useCalendarRovingTabindex.js +0 -96
  586. package/src/Calendar/hooks/useCalendarRovingTabindex.ts +0 -118
package/src/Lightbox/Lightbox.tsx CHANGED
@@ -496,13 +496,16 @@ export function Lightbox({
496
496
  />
497
497
  </div>
498
498
 
499
- {/* Gallery nav: prev */}
500
- {isGallery && canPrev && (
499
+ {/* Gallery nav: prev — stays mounted and is disabled at the start of
500
+ the range so pressing/arrowing to the boundary doesn't unmount the
501
+ focused control and drop focus to <body>. */}
502
+ {isGallery && (
501
503
  <div {...stylex.props(styles.navButton, styles.navPrev)}>
502
504
  <IconButton
503
505
  icon={<Icon icon="chevronLeft" size="sm" color="inherit" />}
504
506
  label="Previous"
505
507
  variant="ghost"
508
+ isDisabled={!canPrev}
506
509
  onClick={goToPrev}
507
510
  xstyle={styles.controlButton}
508
511
  />
@@ -549,13 +552,15 @@ export function Lightbox({
549
552
  )}
550
553
  </div>
551
554
 
552
- {/* Gallery nav: next */}
553
- {isGallery && canNext && (
555
+ {/* Gallery nav: next — see "prev" above; stays mounted and disabled at
556
+ the end of the range instead of unmounting. */}
557
+ {isGallery && (
554
558
  <div {...stylex.props(styles.navButton, styles.navNext)}>
555
559
  <IconButton
556
560
  icon={<Icon icon="chevronRight" size="sm" color="inherit" />}
557
561
  label="Next"
558
562
  variant="ghost"
563
+ isDisabled={!canNext}
559
564
  onClick={goToNext}
560
565
  xstyle={styles.controlButton}
561
566
  />
package/src/Link/Link.doc.mjs CHANGED
@@ -59,6 +59,13 @@ export const docs = {
59
59
  'Opens in new tab with external icon and safe rel tokens',
60
60
  default: 'false',
61
61
  },
62
+ {
63
+ name: 'newTabLabel',
64
+ type: 'string',
65
+ description:
66
+ 'Screen-reader text announcing that an external link opens in a new tab. Override for localization.',
67
+ default: "'(opens in new tab)'",
68
+ },
62
69
  {
63
70
  name: 'target',
64
71
  type: 'string',
@@ -185,6 +192,12 @@ export const docsZh = {
185
192
  description: '在新标签页中打开，带外部图标和安全 rel 标记',
186
193
  default: 'false',
187
194
  },
195
+ {
196
+ name: 'newTabLabel',
197
+ type: 'string',
198
+ description: '向屏幕阅读器announce外部链接将在新标签页打开的文本。可覆盖以本地化。',
199
+ default: "'(opens in new tab)'",
200
+ },
188
201
  {
189
202
  name: 'target',
190
203
  type: 'string',
@@ -296,6 +309,7 @@ export const docsDense = {
296
309
  hasUnderline: 'Always show underline',
297
310
  isDisabled: 'Disables link',
298
311
  isExternalLink: 'Opens new tab w/ external icon and safe rel tokens',
312
+ newTabLabel: 'SR text announcing an external link opens in a new tab',
299
313
  target:
300
314
  'Where to open linked document. target="_blank" auto-adds noopener noreferrer.',
301
315
  rel: 'Link relationship tokens. noopener noreferrer are merged for target="_blank".',
package/src/Link/Link.test.tsx CHANGED
@@ -120,6 +120,24 @@ describe('Link', () => {
120
120
  expect(screen.getByRole('link')).toBeInTheDocument();
121
121
  });
122
122
 
123
+ it('defaults the inner text type to body', () => {
124
+ render(<Link href="/test">Body link</Link>);
125
+ expect(screen.getByText('Body link')).toHaveClass('astryx-text', 'body');
126
+ });
127
+
128
+ it('forwards type="inherit" so the link adopts the surrounding text type', () => {
129
+ render(
130
+ <Link href="/test" type="inherit">
131
+ Inline link
132
+ </Link>,
133
+ );
134
+ // The inner Text renders with the `inherit` type, so font-size/line-height
135
+ // inherit from the surrounding text rather than imposing the body type.
136
+ const text = screen.getByText('Inline link');
137
+ expect(text).toHaveClass('astryx-text', 'inherit');
138
+ expect(text).not.toHaveClass('body');
139
+ });
140
+
123
141
  it('applies hasUnderline style when true', () => {
124
142
  render(
125
143
  <Link href="/test" hasUnderline>
@@ -152,6 +170,38 @@ describe('Link', () => {
152
170
  expect(link.querySelector('svg')).toBeInTheDocument();
153
171
  });
154
172
 
173
+ it('announces the new-tab context via screen-reader text (obs-4)', () => {
174
+ render(
175
+ <Link href="https://example.com" isExternalLink>
176
+ Docs
177
+ </Link>,
178
+ );
179
+ // The link's accessible name includes the new-tab hint (the icon is
180
+ // decorative).
181
+ expect(
182
+ screen.getByRole('link', {name: 'Docs (opens in new tab)'}),
183
+ ).toBeInTheDocument();
184
+ });
185
+
186
+ it('supports a custom newTabLabel for localization', () => {
187
+ render(
188
+ <Link
189
+ href="https://example.com"
190
+ isExternalLink
191
+ newTabLabel="(new window)">
192
+ Docs
193
+ </Link>,
194
+ );
195
+ expect(
196
+ screen.getByRole('link', {name: 'Docs (new window)'}),
197
+ ).toBeInTheDocument();
198
+ });
199
+
200
+ it('does not add new-tab text to non-external links', () => {
201
+ render(<Link href="/internal">Internal</Link>);
202
+ expect(screen.getByRole('link', {name: 'Internal'})).toBeInTheDocument();
203
+ });
204
+
155
205
  it('renders external link with existing rel merged', () => {
156
206
  render(
157
207
  <Link href="https://example.com" isExternalLink rel="sponsored">
package/src/Link/Link.tsx CHANGED
@@ -30,6 +30,7 @@ import {
30
30
  import {Icon} from '../Icon';
31
31
  import {Tooltip} from '../Tooltip';
32
32
  import {Text} from '../Text';
33
+ import {VisuallyHidden} from '../VisuallyHidden';
33
34
  import type {
34
35
  TextType,
35
36
  TextSize,
@@ -106,10 +107,20 @@ const styles = stylex.create({
106
107
  */
107
108
  const linkColorStyles = stylex.create({
108
109
  primary: {
109
- color: colorVars['--color-text-primary'],
110
+ color: {
111
+ default: colorVars['--color-text-primary'],
112
+ ':hover': {
113
+ '@media (hover: hover)': `color-mix(in srgb, ${colorVars['--color-text-primary']}, ${colorVars['--color-tint-hover']} 15%)`,
114
+ },
115
+ },
110
116
  },
111
117
  secondary: {
112
- color: colorVars['--color-text-secondary'],
118
+ color: {
119
+ default: colorVars['--color-text-secondary'],
120
+ ':hover': {
121
+ '@media (hover: hover)': `color-mix(in srgb, ${colorVars['--color-text-secondary']}, ${colorVars['--color-tint-hover']} 15%)`,
122
+ },
123
+ },
113
124
  },
114
125
  disabled: {
115
126
  color: colorVars['--color-text-disabled'],
@@ -118,7 +129,12 @@ const linkColorStyles = stylex.create({
118
129
  color: colorVars['--color-text-secondary'],
119
130
  },
120
131
  accent: {
121
- color: colorVars['--color-text-accent'],
132
+ color: {
133
+ default: colorVars['--color-text-accent'],
134
+ ':hover': {
135
+ '@media (hover: hover)': `color-mix(in srgb, ${colorVars['--color-text-accent']}, ${colorVars['--color-tint-hover']} 15%)`,
136
+ },
137
+ },
122
138
  },
123
139
  inherit: {
124
140
  color: 'inherit',
@@ -167,6 +183,12 @@ export interface LinkProps extends BaseProps<
167
183
  * @default false
168
184
  */
169
185
  isExternalLink?: boolean;
186
+ /**
187
+ * Screen-reader text appended to an external link to announce that it opens
188
+ * in a new tab (the visual icon is decorative). Override for localization.
189
+ * @default '(opens in new tab)'
190
+ */
191
+ newTabLabel?: string;
170
192
  /**
171
193
  * Where to open the linked document.
172
194
  * Overridden to "_blank" when isExternalLink is true.
@@ -203,6 +225,10 @@ export interface LinkProps extends BaseProps<
203
225
  isStandalone?: boolean;
204
226
  /**
205
227
  * Semantic text type for Text. Determines base typography.
228
+ *
229
+ * Use `type="inherit"` for inline links inside an existing `Text` element so
230
+ * the link adopts the surrounding text's size and line-height instead of
231
+ * imposing its own (e.g. a link within a `large` paragraph).
206
232
  * @default 'body'
207
233
  */
208
234
  type?: TextType;
@@ -248,6 +274,11 @@ export interface LinkProps extends BaseProps<
248
274
  * <Link href="/settings" color="secondary">Settings</Link>
249
275
  * <Link href="/privacy" hasUnderline>Privacy Policy</Link>
250
276
  * <Link label="Close dialog" href="/home"><Icon icon="x" /></Link>
277
+ *
278
+ * // Inline link inside text — inherits the surrounding type/size:
279
+ * <Text type="large">
280
+ * Read our <Link href="/terms" type="inherit">terms</Link> first.
281
+ * </Text>
251
282
  * ```
252
283
  */
253
284
  export function Link({
@@ -257,6 +288,7 @@ export function Link({
257
288
  hasUnderline = false,
258
289
  isDisabled = false,
259
290
  isExternalLink = false,
291
+ newTabLabel = '(opens in new tab)',
260
292
  target: targetFromProps,
261
293
  onClick,
262
294
  tooltip,
@@ -300,7 +332,10 @@ export function Link({
300
332
  {children}
301
333
  </Text>
302
334
  {isExternalLink && !renderAsButton && (
303
- <Icon icon="externalLink" size="xsm" color="inherit" />
335
+ <>
336
+ <Icon icon="externalLink" size="xsm" color="inherit" />
337
+ <VisuallyHidden>{newTabLabel}</VisuallyHidden>
338
+ </>
304
339
  )}
305
340
  </>
306
341
  );
package/src/Markdown/Markdown.test.tsx CHANGED
@@ -189,6 +189,17 @@ describe('Markdown', () => {
189
189
  expect(document.querySelectorAll('td')).toHaveLength(2);
190
190
  });
191
191
 
192
+ it('makes the table scroll wrapper keyboard-focusable', () => {
193
+ render(<Markdown>{'| A | B |\n| --- | --- |\n| 1 | 2 |'}</Markdown>);
194
+ const table = document.querySelector('table');
195
+ expect(table).toBeInTheDocument();
196
+ // The GFM table's outer overflow wrapper is keyboard-focusable so keyboard
197
+ // users can horizontally scroll a wide table.
198
+ const wrapper = table!.closest('[role="group"][tabindex="0"]');
199
+ expect(wrapper).toBeTruthy();
200
+ expect(wrapper).toHaveAttribute('aria-label', 'Table');
201
+ });
202
+
192
203
  it('renders horizontal rules', () => {
193
204
  render(<Markdown>{'---'}</Markdown>);
194
205
  expect(document.querySelector('hr')).toBeInTheDocument();
package/src/Markdown/Markdown.tsx CHANGED
@@ -1399,6 +1399,13 @@ function renderBlock(
1399
1399
  return (
1400
1400
  <div
1401
1401
  key={index}
1402
+ // Keyboard-focusable so keyboard users can scroll a horizontally
1403
+ // overflowing GFM table. Uses role="group" (not "region") so
1404
+ // multiple tables don't create duplicate same-named landmarks
1405
+ // (axe: landmark-unique).
1406
+ tabIndex={0}
1407
+ role="group"
1408
+ aria-label="Table"
1402
1409
  {...stylex.props(
1403
1410
  styles.tableWrapper,
1404
1411
  spacing,
package/src/MetadataList/MetadataListItem.doc.mjs CHANGED
@@ -8,6 +8,10 @@ export const docs = {
8
8
  displayName: 'Metadata List Item',
9
9
  isHiddenFromOverview: true,
10
10
  description: 'A single labeled metadata value within an MetadataList.',
11
+ playground: {
12
+ defaults: {label: 'Status', children: 'Active'},
13
+ wrapper: {component: 'MetadataList'},
14
+ },
11
15
  props: [
12
16
  {
13
17
  name: 'children',
package/src/MoreMenu/MoreMenu.doc.mjs CHANGED
@@ -46,14 +46,7 @@ export const docs = {
46
46
  type: 'boolean',
47
47
  description: 'Whether the menu trigger is disabled.',
48
48
  default: 'false',
49
- },
50
- {
51
- name: 'hasAutoFocus',
52
- type: 'boolean',
53
- description: 'Whether to auto-focus the first menu item when the menu opens. Set to false for inline showcases or documentation previews.',
54
- default: 'true',
55
- },
56
- {
49
+ }, {
57
50
  name: 'xstyle',
58
51
  type: 'StyleXStyles',
59
52
  description:
@@ -126,14 +119,7 @@ export const docsZh = {
126
119
  type: 'boolean',
127
120
  description: '菜单触发器是否禁用。',
128
121
  default: 'false',
129
- },
130
- {
131
- name: 'hasAutoFocus',
132
- type: 'boolean',
133
- description: '菜单打开时是否自动聚焦第一个菜单项。内联展示或文档预览设为 false。',
134
- default: 'true',
135
- },
136
- {
122
+ }, {
137
123
  name: 'xstyle',
138
124
  type: 'StyleXStyles',
139
125
  description:
@@ -176,7 +162,6 @@ export const docsDense = {
176
162
  size: 'Trigger button size.',
177
163
  icon: 'Override default three-dot icon. Accepts any ReactNode.',
178
164
  isDisabled: 'Whether menu trigger disabled.',
179
- hasAutoFocus: 'Auto-focus first item on open; false for showcases.',
180
165
  xstyle:
181
166
  'StyleX styles for layout customization (margins, positioning, sizing). Must be stylex.create() value.',
182
167
  },
package/src/MoreMenu/MoreMenu.tsx CHANGED
@@ -81,13 +81,6 @@ export interface MoreMenuProps extends Pick<
81
81
  */
82
82
  onOpenChange?: (isOpen: boolean) => void;
83
83
 
84
- /**
85
- * Whether to auto-focus the first menu item when the menu opens.
86
- * Set to `false` for inline showcases or documentation previews.
87
- * @default true
88
- */
89
- hasAutoFocus?: boolean;
90
-
91
84
  /** Test ID for testing frameworks. */
92
85
  'data-testid'?: string;
93
86
  }
@@ -116,7 +109,6 @@ export function MoreMenu({
116
109
  isDisabled = false,
117
110
  isMenuOpen,
118
111
  onOpenChange,
119
- hasAutoFocus,
120
112
  xstyle,
121
113
  className: classNameProp,
122
114
  style,
@@ -149,7 +141,6 @@ export function MoreMenu({
149
141
  }}
150
142
  items={items}
151
143
  hasChevron={false}
152
- hasAutoFocus={hasAutoFocus}
153
144
  data-testid={testId}
154
145
  />
155
146
  );
package/src/MultiSelector/MultiSelector.doc.mjs CHANGED
@@ -112,6 +112,12 @@ export const docs = {
112
112
  type: 'boolean',
113
113
  description: 'Disables the selector.',
114
114
  },
115
+ {
116
+ name: 'disabledMessage',
117
+ type: 'string',
118
+ description:
119
+ 'Explains why the selector is disabled. With isDisabled, shows a tooltip on hover/keyboard focus and keeps the trigger focusable via aria-disabled (activation stays blocked). Use this instead of wrapping a disabled MultiSelector in Tooltip. Disabled controls swallow the hover events an external Tooltip needs.',
120
+ },
115
121
  {
116
122
  name: 'isLabelHidden',
117
123
  type: 'boolean',
@@ -181,6 +187,11 @@ export const docs = {
181
187
  description:
182
188
  'Enable select-all when most users will want all or nearly all options selected.',
183
189
  },
190
+ {
191
+ guidance: true,
192
+ description:
193
+ 'Use inside InputGroup only when the control needs a short prefix or suffix addon as part of one decorated input surface; prefer count or labels trigger display so the group stays single-line.',
194
+ },
184
195
  {
185
196
  guidance: false,
186
197
  description: 'Use for single-value selection; use Selector instead.',
@@ -189,6 +200,11 @@ export const docs = {
189
200
  guidance: false,
190
201
  description: 'Show more than ~20 options without enabling search.',
191
202
  },
203
+ {
204
+ guidance: false,
205
+ description:
206
+ 'Wrap a disabled MultiSelector in Tooltip to explain why it is disabled; disabled triggers swallow the hover events the wrapper needs. Use the disabledMessage prop instead.',
207
+ },
192
208
  ],
193
209
  },
194
210
  };
@@ -217,6 +233,8 @@ export const docsZh = {
217
233
  hasSearch: '是否显示用于过滤选项的搜索输入。',
218
234
  searchPlaceholder: '搜索输入的占位文本。',
219
235
  isDisabled: '禁用选择器。',
236
+ disabledMessage:
237
+ '解释选择器被禁用的原因。与 isDisabled 一起使用时，悬停/键盘聚焦时显示工具提示，并通过 aria-disabled 保持触发器可聚焦（仍无法激活）。请使用此属性，而不是用 Tooltip 包裹被禁用的选择器。',
220
238
  isLabelHidden: '视觉上隐藏标签同时保持其可访问性。',
221
239
  description: '标签下方显示的辅助文本。',
222
240
  isOptional: '将字段标记为可选。',
@@ -261,6 +279,11 @@ export const docsZh = {
261
279
  guidance: false,
262
280
  description: 'Show more than ~20 options without enabling search.',
263
281
  },
282
+ {
283
+ guidance: false,
284
+ description:
285
+ 'Wrap a disabled MultiSelector in Tooltip to explain why it is disabled; disabled triggers swallow the hover events the wrapper needs. Use the disabledMessage prop instead.',
286
+ },
264
287
  ],
265
288
  },
266
289
  };
@@ -293,6 +316,11 @@ export const docsDense = {
293
316
  description:
294
317
  'Enable select-all when most users will want all or nearly all options selected.',
295
318
  },
319
+ {
320
+ guidance: true,
321
+ description:
322
+ 'Use inside InputGroup only for a short prefix or suffix addon; prefer count or labels trigger display so the group stays single-line.',
323
+ },
296
324
  {
297
325
  guidance: false,
298
326
  description: 'Use for single-value selection; use Selector instead.',
@@ -301,6 +329,11 @@ export const docsDense = {
301
329
  guidance: false,
302
330
  description: 'Show more than ~20 options without enabling search.',
303
331
  },
332
+ {
333
+ guidance: false,
334
+ description:
335
+ 'Wrap a disabled MultiSelector in Tooltip to explain why it is disabled; disabled triggers swallow the hover events the wrapper needs. Use the disabledMessage prop instead.',
336
+ },
304
337
  ],
305
338
  },
306
339
  components: [
@@ -324,6 +357,8 @@ export const docsDense = {
324
357
  hasSearch: 'show search input',
325
358
  searchPlaceholder: 'search placeholder',
326
359
  isDisabled: 'disables selector',
360
+ disabledMessage:
361
+ 'why disabled; w/ isDisabled shows tooltip on hover/focus, trigger stays focusable via aria-disabled; use instead of Tooltip wrapper',
327
362
  isLabelHidden: 'visually hides label',
328
363
  description: 'helper text below label',
329
364
  isOptional: 'marks optional',