@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
@@ -0,0 +1,140 @@
1
+ // Copyright (c) Meta Platforms, Inc. and affiliates.
2
+
3
+ 'use client';
4
+
5
+ /**
6
+ * @file tableContextMenu.tsx
7
+ * @input React, ContextMenu, Icon, types
8
+ * @output wrapInTableContextMenu helper
9
+ * @position Renders the aggregated `contextMenuActions` for a header cell / row
10
+ *
11
+ * SYNC: When modified, update these files to stay in sync:
12
+ * - /packages/core/src/Table/BaseTable.tsx (call sites)
13
+ * - /packages/core/src/Table/types.ts (TableContextAction)
14
+ */
15
+ import { useState } from 'react';
16
+ import { ContextMenu } from "../ContextMenu/index.js";
17
+ import { Icon } from "../Icon/index.js";
18
+ import { jsx as _jsx } from "react/jsx-runtime";
19
+ /**
20
+ * Resolve a `contextMenuActions` value (array or getter) to a plain array.
21
+ * Use this when composing actions from a prior plugin's render props so you
22
+ * don't have to branch on the array-vs-getter form:
23
+ *
24
+ * ```
25
+ * contextMenuActions: () => [
26
+ * ...resolveContextActions(props.contextMenuActions),
27
+ * ...myActions,
28
+ * ]
29
+ * ```
30
+ */
31
+ export function resolveContextActions(actions) {
32
+ if (typeof actions === 'function') {
33
+ return actions();
34
+ }
35
+ return actions ?? [];
36
+ }
37
+
38
+ /**
39
+ * Convert the flat action list into ContextMenu options, inserting a divider
40
+ * between groups (first-seen group order). Ungrouped actions form a trailing
41
+ * group. A `checked` action shows a trailing check icon.
42
+ */
43
+ function toContextMenuOptions(actions) {
44
+ const order = [];
45
+ const buckets = new Map();
46
+ for (const action of actions) {
47
+ const key = action.group ?? '__ungrouped__';
48
+ let bucket = buckets.get(key);
49
+ if (!bucket) {
50
+ bucket = [];
51
+ buckets.set(key, bucket);
52
+ order.push(key);
53
+ }
54
+ bucket.push(action);
55
+ }
56
+ const options = [];
57
+ order.forEach((key, groupIndex) => {
58
+ if (groupIndex > 0) {
59
+ options.push({
60
+ type: 'divider'
61
+ });
62
+ }
63
+ for (const action of buckets.get(key) ?? []) {
64
+ options.push({
65
+ label: typeof action.label === 'string' ? action.label : action.id,
66
+ // A checked action (e.g. the active sort direction) shows a checkmark;
67
+ // otherwise the action's own icon. ContextMenu's data form takes a
68
+ // single leading icon, so checked state replaces the icon.
69
+ icon: action.checked ? /*#__PURE__*/_jsx(Icon, {
70
+ icon: "check",
71
+ size: "xsm",
72
+ "aria-hidden": true
73
+ }) : action.icon,
74
+ isDisabled: action.disabled,
75
+ onClick: action.onSelect
76
+ });
77
+ }
78
+ });
79
+ return options;
80
+ }
81
+
82
+ /**
83
+ * Wrap a table element (a header cell's content or a row) in a right-click
84
+ * context menu rendering the aggregated `actions`. When no plugin contributes
85
+ * actions the element is returned untouched so the native browser menu passes
86
+ * through.
87
+ */
88
+ /**
89
+ * A context menu whose actions are resolved lazily — only when the user opens
90
+ * the menu (right-click). Deferring the work means plugins that pass a getter
91
+ * don't build an action array (with its closures) for every cell on every
92
+ * render; it's computed on demand and memoized until the menu closes.
93
+ */
94
+ function LazyTableContextMenu({
95
+ element,
96
+ getActions,
97
+ triggerXstyle
98
+ }) {
99
+ const [options, setOptions] = useState(null);
100
+ return /*#__PURE__*/_jsx(ContextMenu, {
101
+ items: options ?? [],
102
+ triggerXstyle: triggerXstyle,
103
+ onOpenChange: open => {
104
+ // Resolve actions when opening; clear on close so state derived later
105
+ // (e.g. current sort direction) is always fresh next open.
106
+ setOptions(open ? toContextMenuOptions(getActions()) : null);
107
+ },
108
+ children: element
109
+ });
110
+ }
111
+
112
+ /**
113
+ * Wrap a table element (a header cell's content or a body cell) in a right-click
114
+ * context menu rendering the aggregated `actions`. Accepts a static array or a
115
+ * getter (resolved lazily on open). When there are no actions the element is
116
+ * returned untouched so the native browser menu passes through.
117
+ *
118
+ * `triggerXstyle` styles the right-click target wrapper. Cells pass a fill +
119
+ * padding style so the entire cell (padding included) opens the menu.
120
+ */
121
+ export function wrapInTableContextMenu(element, actions, triggerXstyle) {
122
+ // Getter form → resolve lazily on open.
123
+ if (typeof actions === 'function') {
124
+ return /*#__PURE__*/_jsx(LazyTableContextMenu, {
125
+ element: element,
126
+ getActions: actions,
127
+ triggerXstyle: triggerXstyle
128
+ });
129
+ }
130
+ if (!actions || actions.length === 0) {
131
+ return element;
132
+ }
133
+ // item (it looked like "ascending" was always selected). Focus moves only
134
+ // when the user arrow-keys into the menu.
135
+ return /*#__PURE__*/_jsx(ContextMenu, {
136
+ items: toContextMenuOptions(actions),
137
+ triggerXstyle: triggerXstyle,
138
+ children: element
139
+ });
140
+ }
@@ -217,6 +217,12 @@ export interface HeaderCellRenderProps {
217
217
  overlay?: ReactNode;
218
218
  /** Content rendered below the header label row (e.g. inline filter controls). */
219
219
  below?: ReactNode;
220
+ /**
221
+ * Right-click context-menu actions for this header cell. Plugins append
222
+ * their actions in `transformHeaderCell`; BaseTable concatenates the arrays
223
+ * across plugins (never overridden) and renders one menu per header cell.
224
+ */
225
+ contextMenuActions?: TableContextActions;
220
226
  /**
221
227
  * Index of this column within the final, ordered list of rendered columns
222
228
  * (after column injection/reordering by other plugins). Populated by
@@ -244,6 +250,13 @@ export interface BodyRowRenderProps {
244
250
  export interface BodyCellRenderProps {
245
251
  htmlProps: TdHTMLAttributes<HTMLTableCellElement>;
246
252
  styles: StyleXStyles[];
253
+ /**
254
+ * Right-click context-menu actions for this body cell. Plugins append their
255
+ * actions in `transformBodyCell`; BaseTable concatenates the arrays across
256
+ * plugins and across the row's cells (never overridden) and renders one menu
257
+ * per row.
258
+ */
259
+ contextMenuActions?: TableContextActions;
247
260
  /**
248
261
  * Index of this cell's column within the final ordered column list.
249
262
  * Mirrors the `columnIndex` passed to `transformHeaderCell`. Populated by
@@ -287,6 +300,42 @@ export interface ScrollWrapperRenderProps {
287
300
  /** Content rendered after the `<table>`, inside the scroll container. */
288
301
  afterTable?: ReactNode;
289
302
  }
303
+ /**
304
+ * A single right-click context-menu action contributed by a plugin.
305
+ *
306
+ * Plugins contribute actions via the `contextMenuActions` field on
307
+ * `HeaderCellRenderProps` / `BodyCellRenderProps` (set in
308
+ * `transformHeaderCell` / `transformBodyCell`); the table aggregates actions
309
+ * from every enabled plugin into a single menu per header cell / row.
310
+ */
311
+ export interface TableContextAction {
312
+ /** Stable identifier, unique within a single menu. */
313
+ id: string;
314
+ /** Visible label for the menu item. */
315
+ label: ReactNode;
316
+ /** Optional leading icon. */
317
+ icon?: ReactNode;
318
+ /** Invoked when the item is selected. */
319
+ onSelect: () => void;
320
+ /** When true, the item is rendered but not selectable. */
321
+ disabled?: boolean;
322
+ /**
323
+ * Group key used to cluster related actions and insert a divider between
324
+ * groups (e.g. 'sort', 'selection'). Actions without a group form a trailing
325
+ * group. Group order follows first-seen order across the aggregated list.
326
+ */
327
+ group?: string;
328
+ /** When true, the item renders as checked (e.g. the active sort direction). */
329
+ checked?: boolean;
330
+ }
331
+ /**
332
+ * Context-menu actions for a cell — either a static array, or a getter that
333
+ * returns the actions lazily. Prefer the getter for actions derived from state
334
+ * (e.g. the active sort direction): it's only invoked when the menu is opened,
335
+ * so the plugin doesn't build an action array (with closures) for every cell on
336
+ * every render.
337
+ */
338
+ export type TableContextActions = TableContextAction[] | (() => TableContextAction[]);
290
339
  /**
291
340
  * Table plugin — transforms render props at each structural level.
292
341
  * Plugins compose by sequential application (first plugin's output feeds next).
@@ -301,6 +350,10 @@ export interface ScrollWrapperRenderProps {
301
350
  * 6. `transformBodyCell` — transform each body `<td>` props
302
351
  * 7. `transformScrollWrapper` — transform the scroll-container wrapper around the table
303
352
  * 8. `transformTableContext` — wrap the table output in context providers
353
+ *
354
+ * Plugins may also contribute right-click menu actions by appending to
355
+ * `contextMenuActions` in `transformHeaderCell` / `transformBodyCell`
356
+ * (aggregated into one menu per header cell / row).
304
357
  */
305
358
  export interface TablePlugin<T extends Record<string, unknown> = Record<string, unknown>> {
306
359
  /**
@@ -355,11 +408,24 @@ export interface TableRowComponentProps extends HTMLAttributes<HTMLTableRowEleme
355
408
  export interface TableCellComponentProps extends TdHTMLAttributes<HTMLTableCellElement> {
356
409
  children?: ReactNode;
357
410
  xstyle?: StyleXStyles | StyleXStyles[];
411
+ /**
412
+ * Right-click actions to render as a context menu around the cell content.
413
+ * The cell owns the menu wrapper so it can control how it interacts with
414
+ * padding / content sizing. Empty/undefined renders no menu (native passes
415
+ * through).
416
+ */
417
+ contextMenuActions?: TableContextActions;
358
418
  }
359
419
  /** Props for header cell components used in the components prop */
360
420
  export interface TableHeaderCellComponentProps extends ThHTMLAttributes<HTMLTableCellElement> {
361
421
  children?: ReactNode;
362
422
  xstyle?: StyleXStyles | StyleXStyles[];
423
+ /**
424
+ * Right-click actions to render as a context menu around the header content.
425
+ * The cell owns the menu wrapper so it can control how it interacts with
426
+ * padding / content sizing. Empty/undefined renders no menu.
427
+ */
428
+ contextMenuActions?: TableContextActions;
363
429
  }
364
430
  /**
365
431
  * Props for the unstyled BaseTable component.
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/Table/types.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/Table/types.ts"],"names":[],"mappings":"AAEA;;;;;;;;;GASG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EACV,aAAa,EACb,cAAc,EACd,GAAG,EACH,gBAAgB,EAChB,gBAAgB,EAChB,SAAS,EACV,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAC;AACjD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,mBAAmB,EAAC,MAAM,uCAAuC,CAAC;AAM/E;;;GAGG;AACH,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,cAAc,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,mFAAmF;IACnF,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED;;;GAGG;AACH,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,OAAO,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,wDAAwD;AACxD,MAAM,MAAM,WAAW,GAAG,iBAAiB,GAAG,UAAU,CAAC;AAMzD;;;GAGG;AACH,MAAM,WAAW,yBAAyB;IACxC;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAMD;;;;;GAKG;AACH,MAAM,MAAM,gBAAgB,GAAG,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;AAM1D;;;;;GAKG;AACH,MAAM,MAAM,kBAAkB,GAAG,QAAQ,GAAG,KAAK,GAAG,QAAQ,CAAC;AAM7D;;;;GAIG;AACH,MAAM,WAAW,WAAW,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAC5D,gFAAgF;IAChF,GAAG,EAAE,MAAM,CAAC;IACZ,sEAAsE;IACtE,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;;;;;;;;;;;;;;;;OAiBG;IACH,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB;;;;;;;;;;;;;;OAcG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC;IACzB;;;;;;;;;;;;;;OAcG;IACH;;;;;;;;;OASG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,GAAG,yBAAyB,CAAC;IAC/C;;;;;;;;;;;;;;;;;;;OAmBG;IACH,MAAM,CAAC,EAAE,mBAAmB,GAAG,MAAM,CAAC;IACtC;;;;;;;;;;;;;;;;;;;;;OAqBG;IACH,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,SAAS,CAAC;CACrC;AAMD,yEAAyE;AACzE,MAAM,WAAW,gBAAgB;IAC/B,SAAS,EAAE,cAAc,CAAC,gBAAgB,CAAC,CAAC;IAC5C,MAAM,EAAE,YAAY,EAAE,CAAC;CACxB;AAED,qEAAqE;AACrE,MAAM,WAAW,oBAAoB;IACnC,SAAS,EAAE,cAAc,CAAC,mBAAmB,CAAC,CAAC;IAC/C,MAAM,EAAE,YAAY,EAAE,CAAC;IACvB,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;GAcG;AACH,MAAM,WAAW,qBAAqB;IACpC,SAAS,EAAE,gBAAgB,CAAC,oBAAoB,CAAC,CAAC;IAClD,MAAM,EAAE,YAAY,EAAE,CAAC;IACvB,gDAAgD;IAChD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,6GAA6G;IAC7G,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,gFAAgF;IAChF,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kEAAkE;IAClE,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,iFAAiF;IACjF,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,mBAAmB,CAAC;IACzC;;;;;OAKG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;;OAKG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC,WAAW,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;CAC/D;AAED,oEAAoE;AACpE,MAAM,WAAW,kBAAkB;IACjC,SAAS,EAAE,cAAc,CAAC,mBAAmB,CAAC,CAAC;IAC/C,MAAM,EAAE,YAAY,EAAE,CAAC;IACvB,QAAQ,EAAE,SAAS,CAAC;IACpB,mFAAmF;IACnF,GAAG,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAC;CAChC;AAED,oEAAoE;AACpE,MAAM,WAAW,mBAAmB;IAClC,SAAS,EAAE,gBAAgB,CAAC,oBAAoB,CAAC,CAAC;IAClD,MAAM,EAAE,YAAY,EAAE,CAAC;IACvB;;;;;OAKG;IACH,kBAAkB,CAAC,EAAE,mBAAmB,CAAC;IACzC;;;;;OAKG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC,WAAW,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,CAAC;CAC/D;AAED;;;;;;;;;;;;;GAaG;AACH,MAAM,WAAW,wBAAwB;IACvC;;;;OAIG;IACH,SAAS,EAAE,cAAc,CAAC,cAAc,CAAC,GAAG;QAC1C,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;KAC3B,CAAC;IACF,MAAM,EAAE,YAAY,EAAE,CAAC;IACvB,0EAA0E;IAC1E,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,yEAAyE;IACzE,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAMD;;;;;;;GAOG;AACH,MAAM,WAAW,kBAAkB;IACjC,sDAAsD;IACtD,EAAE,EAAE,MAAM,CAAC;IACX,uCAAuC;IACvC,KAAK,EAAE,SAAS,CAAC;IACjB,6BAA6B;IAC7B,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,yCAAyC;IACzC,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,+EAA+E;IAC/E,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;;;;;GAMG;AACH,MAAM,MAAM,mBAAmB,GAC3B,kBAAkB,EAAE,GACpB,CAAC,MAAM,kBAAkB,EAAE,CAAC,CAAC;AAMjC;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,WAAW,WAAW,CAC1B,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAE3D;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,EAAE,KAAK,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;IACnE,iDAAiD;IACjD,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,gBAAgB,CAAC;IAC/D,wCAAwC;IACxC,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,oBAAoB,CAAC;IAC3E;;;;;OAKG;IACH,mBAAmB,CAAC,EAAE,CACpB,KAAK,EAAE,qBAAqB,EAC5B,MAAM,EAAE,WAAW,CAAC,CAAC,CAAC,EACtB,WAAW,EAAE,MAAM,EACnB,OAAO,EAAE,aAAa,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,KACnC,qBAAqB,CAAC;IAC3B,uCAAuC;IACvC,gBAAgB,CAAC,EAAE,CACjB,KAAK,EAAE,kBAAkB,EACzB,IAAI,EAAE,CAAC,EACP,KAAK,EAAE,MAAM,KACV,kBAAkB,CAAC;IACxB;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,CAClB,KAAK,EAAE,mBAAmB,EAC1B,MAAM,EAAE,WAAW,CAAC,CAAC,CAAC,EACtB,IAAI,EAAE,CAAC,EACP,WAAW,EAAE,MAAM,EACnB,OAAO,EAAE,aAAa,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,KACnC,mBAAmB,CAAC;IACzB;;;;;OAKG;IACH,sBAAsB,CAAC,EAAE,CACvB,KAAK,EAAE,wBAAwB,KAC5B,wBAAwB,CAAC;IAC9B,iDAAiD;IACjD,qBAAqB,CAAC,EAAE,CAAC,QAAQ,EAAE,SAAS,KAAK,SAAS,CAAC;CAC5D;AAMD,2DAA2D;AAC3D,MAAM,WAAW,sBAAuB,SAAQ,cAAc,CAAC,mBAAmB,CAAC;IACjF,+CAA+C;IAC/C,GAAG,CAAC,EAAE,GAAG,CAAC,mBAAmB,CAAC,CAAC;IAC/B,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,CAAC,EAAE,YAAY,EAAE,CAAC;IACxB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,4DAA4D;AAC5D,MAAM,WAAW,uBAAwB,SAAQ,gBAAgB,CAAC,oBAAoB,CAAC;IACrF,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,MAAM,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IACvC;;;;;OAKG;IACH,kBAAkB,CAAC,EAAE,mBAAmB,CAAC;CAC1C;AAED,mEAAmE;AACnE,MAAM,WAAW,6BAA8B,SAAQ,gBAAgB,CAAC,oBAAoB,CAAC;IAC3F,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,MAAM,CAAC,EAAE,YAAY,GAAG,YAAY,EAAE,CAAC;IACvC;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,mBAAmB,CAAC;CAC1C;AAMD;;;;GAIG;AACH,MAAM,WAAW,cAAc,CAC7B,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CACjC,SAAQ,SAAS,CAAC,gBAAgB,CAAC;IACnC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;IAClC,4CAA4C;IAC5C,IAAI,CAAC,EAAE,CAAC,EAAE,CAAC;IACX,qEAAqE;IACrE,OAAO,CAAC,EAAE,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;IAC3B;;;;;OAKG;IACH,KAAK,CAAC,EAAE,CAAC,MAAM,CAAC,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,KAAK,MAAM,GAAG,MAAM,CAAC,CAAC;IAC5D,sDAAsD;IACtD,OAAO,CAAC,EAAE,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;IAE3B,2EAA2E;IAC3E,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,2DAA2D;IAC3D,UAAU,CAAC,EAAE,cAAc,CAAC,gBAAgB,CAAC,CAAC;IAC9C;;;;;;;;;;OAUG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC;QAC5B,QAAQ,EAAE,SAAS,CAAC;QACpB,SAAS,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,GAAG;YAAC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAA;SAAC,CAAC;QACzE,MAAM,CAAC,EAAE,YAAY,EAAE,CAAC;QACxB,WAAW,CAAC,EAAE,SAAS,CAAC;QACxB,UAAU,CAAC,EAAE,SAAS,CAAC;KACxB,CAAC,CAAC;IACH;;;;;;;;;;;OAWG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IACnC;;;;;;;;;;;;;;;;;;OAkBG;IACH,UAAU,CAAC,EAAE,SAAS,GAAG,KAAK,CAAC;CAChC"}
@@ -79,6 +79,27 @@ export interface TextAreaProps extends Omit<BaseProps, 'onChange' | 'defaultValu
79
79
  * @default false
80
80
  */
81
81
  isDisabled?: boolean;
82
+ /**
83
+ * Explains why the textarea is disabled. When set together with
84
+ * `isDisabled`, the textarea shows a tooltip with this text on hover and
85
+ * keyboard focus, and stays focusable (via `aria-disabled`) so the reason is
86
+ * discoverable by keyboard and assistive technology. The field cannot be
87
+ * edited (it becomes read-only) while disabled.
88
+ *
89
+ * Use this instead of wrapping a disabled textarea in `Tooltip` — disabled
90
+ * controls don't emit the pointer events an external tooltip needs.
91
+ *
92
+ * @example
93
+ * ```
94
+ * <TextArea
95
+ * label="Notes"
96
+ * value={notes}
97
+ * isDisabled
98
+ * disabledMessage="Notes are locked after submission"
99
+ * />
100
+ * ```
101
+ */
102
+ disabledMessage?: string;
82
103
  /**
83
104
  * Status indicator for the textarea.
84
105
  * When set, displays a colored border and status icon.
@@ -150,7 +171,7 @@ export interface TextAreaProps extends Omit<BaseProps, 'onChange' | 'defaultValu
150
171
  * <TextArea label="Notes" rows={5} value={notes} onChange={setNotes} />
151
172
  * ```
152
173
  */
153
- export declare function TextArea({ label, isLabelHidden, description, isOptional, isRequired, onChange, changeAction, isLoading, value, placeholder, rows, isDisabled, status, labelTooltip, startIcon, hasSpellCheck, onPaste, maxLength, hasAutoFocus, size: sizeProp, htmlName, onFocus, onBlur, width, xstyle, className, style, ref, ...rest }: TextAreaProps): import("react").JSX.Element;
174
+ export declare function TextArea({ label, isLabelHidden, description, isOptional, isRequired, onChange, changeAction, isLoading, value, placeholder, rows, isDisabled, disabledMessage, status, labelTooltip, startIcon, hasSpellCheck, onPaste, maxLength, hasAutoFocus, size: sizeProp, htmlName, onFocus, onBlur, width, xstyle, className, style, ref, ...rest }: TextAreaProps): import("react").JSX.Element;
154
175
  export declare namespace TextArea {
155
176
  var displayName: string;
156
177
  }
@@ -1 +1 @@
1
- {"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../src/TextArea/TextArea.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"TextArea.d.ts","sourceRoot":"","sources":["../../src/TextArea/TextArea.tsx"],"names":[],"mappings":"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"}
@@ -22,10 +22,12 @@ import { colorVars, spacingVars, typographyVars, typeScaleVars } from "../theme/
22
22
  import { Field, inputWrapperStyles, inputStatusBorderStyles, inputStatusHoverShadowStyles, inputStatusFocusWithinStyles } from "../Field/index.js";
23
23
  import { Icon, renderIconSlot } from "../Icon/index.js";
24
24
  import { Spinner } from "../Spinner/index.js";
25
+ import { useTooltip } from "../Tooltip/index.js";
25
26
  import { mergeProps, mergeRefs } from "../utils/index.js";
26
27
  import { useInputContainer } from "../hooks/useInputContainer.js";
27
28
  import { useSize } from "../SizeContext/SizeContext.js";
28
29
  import { themeProps } from "../utils/themeProps.js";
30
+ import { VisuallyHidden } from "../VisuallyHidden/index.js";
29
31
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
30
32
  const COUNTER_WARNING_THRESHOLD = 0.8;
31
33
  const styles = {
@@ -70,6 +72,7 @@ export function TextArea({
70
72
  placeholder,
71
73
  rows = 3,
72
74
  isDisabled = false,
75
+ disabledMessage,
73
76
  status,
74
77
  labelTooltip,
75
78
  startIcon,
@@ -98,6 +101,20 @@ export function TextArea({
98
101
  const [, startTransition] = useTransition();
99
102
  const [optimisticValue, setOptimisticValue] = useOptimistic(value);
100
103
  const isBusy = isLoading || optimisticValue !== value;
104
+
105
+ // Disabled-reason tooltip. Disabled controls swallow pointer events, so the
106
+ // tooltip listeners attach to the textarea container (which already exists)
107
+ // and the textarea stays perceivable via aria-disabled instead of the native
108
+ // disabled attribute. The field is made read-only so it can't be typed into,
109
+ // and value mutation is blocked by the isDisabled guard in handleChange.
110
+ const showsDisabledMessage = isDisabled && !!disabledMessage;
111
+ const disabledMessageTooltip = useTooltip({
112
+ placement: 'above',
113
+ // The container div is not naturally focusable; focusin bubbles up from
114
+ // the textarea, so always attach focus listeners.
115
+ focusTrigger: 'always',
116
+ isEnabled: showsDisabledMessage
117
+ });
101
118
  const statusIconMap = {
102
119
  warning: 'warning',
103
120
  error: 'error',
@@ -108,8 +125,14 @@ export function TextArea({
108
125
  error: 'error',
109
126
  success: 'success'
110
127
  };
111
- const ariaDescribedBy = [description ? descriptionID : null, status?.message ? statusMessageID : null, maxLength != null ? counterID : null].filter(Boolean).join(' ') || undefined;
128
+ const ariaDescribedBy = [description ? descriptionID : null, status?.message ? statusMessageID : null, maxLength != null ? counterID : null, showsDisabledMessage ? disabledMessageTooltip.describedBy : null].filter(Boolean).join(' ') || undefined;
112
129
  const handleChange = e => {
130
+ // Value can't change while showing a disabled message (the field is
131
+ // read-only and non-native-disabled), but guard the handler too so the
132
+ // optimistic value and callbacks never fire.
133
+ if (isDisabled) {
134
+ return;
135
+ }
113
136
  const newValue = e.target.value;
114
137
  onChange?.(newValue, e);
115
138
  if (changeAction && !e.defaultPrevented) {
@@ -147,7 +170,13 @@ export function TextArea({
147
170
  labelTooltip: labelTooltip,
148
171
  width: width,
149
172
  children: [/*#__PURE__*/_jsxs("div", {
150
- ref: containerRef,
173
+ ref: el => {
174
+ containerRef.current = el;
175
+ // Anchor + hover/focus listeners for the disabled-message tooltip.
176
+ // Handlers are gated internally by isEnabled, and anchor names
177
+ // compose, so attaching unconditionally is safe.
178
+ disabledMessageTooltip.ref(el);
179
+ },
151
180
  onClick: handleWrapperClick,
152
181
  onMouseUp: handleWrapperMouseUp,
153
182
  ...mergeProps(themeProps('textarea', {
@@ -168,8 +197,14 @@ export function TextArea({
168
197
  onFocus: onFocus,
169
198
  onBlur: onBlur,
170
199
  placeholder: placeholder,
171
- rows: rows,
172
- disabled: isDisabled,
200
+ rows: rows
201
+ // With a disabledMessage the textarea keeps focusability via
202
+ // aria-disabled so the reason is focus-discoverable; readOnly + the
203
+ // handleChange guard keep the value from changing.
204
+ ,
205
+ disabled: isDisabled && !showsDisabledMessage,
206
+ "aria-disabled": showsDisabledMessage ? 'true' : undefined,
207
+ readOnly: showsDisabledMessage || undefined,
173
208
  spellCheck: hasSpellCheck,
174
209
  autoFocus: hasAutoFocus,
175
210
  "data-autofocus": hasAutoFocus || undefined,
@@ -213,14 +248,11 @@ export function TextArea({
213
248
  className: "x78zum5 x13a6bvl xcsaf9d x9ynric x141an7d xjt36v0"
214
249
  }
215
250
  }[!!(optimisticValue.length > maxLength) << 0],
216
- children: [optimisticValue.length, "/", maxLength, /*#__PURE__*/_jsx("span", {
251
+ children: [optimisticValue.length, "/", maxLength, /*#__PURE__*/_jsx(VisuallyHidden, {
217
252
  "aria-live": "polite",
218
- ...{
219
- className: "x10l6tqk x1i1rx1s xjm9jq1 x1717udv xkdpibf xb3r6kr xzpqnlu xuxw1ft xc342km"
220
- },
221
253
  children: optimisticValue.length >= maxLength * COUNTER_WARNING_THRESHOLD ? optimisticValue.length > maxLength ? `${optimisticValue.length - maxLength} characters over limit` : `${maxLength - optimisticValue.length} characters remaining` : ''
222
254
  })]
223
- })]
255
+ }), showsDisabledMessage && disabledMessageTooltip.renderTooltip(disabledMessage)]
224
256
  });
225
257
  }
226
258
  TextArea.displayName = 'TextArea';
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * @file TextInput.tsx
3
- * @input Uses React, useId, ChangeEvent, Field, Icon
3
+ * @input Uses React, useId, ChangeEvent, Field, Icon, InputGroupContext
4
4
  * @output Exports TextInput component, TextInputProps
5
5
  * @position Core implementation; consumed by index.ts, tested by TextInput.test.tsx
6
6
  *
@@ -67,6 +67,27 @@ export interface TextInputProps extends Omit<BaseProps, 'onChange' | 'defaultVal
67
67
  * @default false
68
68
  */
69
69
  isDisabled?: boolean;
70
+ /**
71
+ * Explains why the input is disabled. When set together with `isDisabled`,
72
+ * the input shows a tooltip with this text on hover and keyboard focus, and
73
+ * stays focusable (via `aria-disabled`) so the reason is discoverable by
74
+ * keyboard and assistive technology. The field cannot be edited (it becomes
75
+ * read-only) while disabled.
76
+ *
77
+ * Use this instead of wrapping a disabled input in `Tooltip` — disabled
78
+ * controls don't emit the pointer events an external tooltip needs.
79
+ *
80
+ * @example
81
+ * ```
82
+ * <TextInput
83
+ * label="Owner"
84
+ * value={owner}
85
+ * isDisabled
86
+ * disabledMessage="You need the Editor role to change this"
87
+ * />
88
+ * ```
89
+ */
90
+ disabledMessage?: string;
70
91
  /**
71
92
  * Icon to display at the start of the input.
72
93
  * Accepts a ReactNode (e.g. `<Icon icon={SearchIcon} />`) or an SVG icon component directly.
@@ -145,7 +166,7 @@ export interface TextInputProps extends Omit<BaseProps, 'onChange' | 'defaultVal
145
166
  * <TextInput label="Search" isLabelHidden value={query} onChange={setQuery} />
146
167
  * ```
147
168
  */
148
- export declare function TextInput({ type, label, isLabelHidden, description, isOptional, isRequired, isDisabled, startIcon, status, size: sizeProp, onChange, changeAction, isLoading, value, placeholder, labelTooltip, hasClear, hasAutoFocus, htmlName, onEnter, onKeyDown, width, xstyle, className, style, ref, ...rest }: TextInputProps): import("react").JSX.Element;
169
+ export declare function TextInput({ type, label, isLabelHidden, description, isOptional, isRequired, isDisabled, disabledMessage, startIcon, status, size: sizeProp, onChange, changeAction, isLoading, value, placeholder, labelTooltip, hasClear, hasAutoFocus, htmlName, onEnter, onKeyDown, width, xstyle, className, style, ref, ...rest }: TextInputProps): import("react").JSX.Element;
149
170
  export declare namespace TextInput {
150
171
  var displayName: string;
151
172
  }
@@ -1 +1 @@
1
- {"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../src/TextInput/TextInput.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"TextInput.d.ts","sourceRoot":"","sources":["../../src/TextInput/TextInput.tsx"],"names":[],"mappings":"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"}
@@ -4,7 +4,7 @@
4
4
 
5
5
  /**
6
6
  * @file TextInput.tsx
7
- * @input Uses React, useId, ChangeEvent, Field, Icon
7
+ * @input Uses React, useId, ChangeEvent, Field, Icon, InputGroupContext
8
8
  * @output Exports TextInput component, TextInputProps
9
9
  * @position Core implementation; consumed by index.ts, tested by TextInput.test.tsx
10
10
  *
@@ -22,6 +22,9 @@ import { colorVars, sizeVars, radiusVars, typographyVars, typeScaleVars, borderV
22
22
  import { Field, inputWrapperStyles, inputStatusBorderStyles, inputStatusHoverShadowStyles, inputStatusFocusWithinStyles } from "../Field/index.js";
23
23
  import { Icon, renderIconSlot } from "../Icon/index.js";
24
24
  import { Spinner } from "../Spinner/index.js";
25
+ import { useTooltip } from "../Tooltip/index.js";
26
+ import { VisuallyHidden } from "../VisuallyHidden/index.js";
27
+ import { getInputARIA } from "../utils/index.js";
25
28
  const sizeStyles = {
26
29
  sm: {
27
30
  kZKoxP: "x6k0iem",
@@ -45,7 +48,7 @@ import { useSize } from "../SizeContext/SizeContext.js";
45
48
  import { useInputContainer } from "../hooks/useInputContainer.js";
46
49
  import { useInputGroup } from "../InputGroup/InputGroupContext.js";
47
50
  import { themeProps } from "../utils/themeProps.js";
48
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
51
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
49
52
  /**
50
53
  * A text input component for collecting user input.
51
54
  *
@@ -63,6 +66,7 @@ export function TextInput({
63
66
  isOptional = false,
64
67
  isRequired = false,
65
68
  isDisabled = false,
69
+ disabledMessage,
66
70
  startIcon,
67
71
  status,
68
72
  size: sizeProp,
@@ -86,6 +90,7 @@ export function TextInput({
86
90
  }) {
87
91
  const size = useSize(sizeProp, 'md');
88
92
  const id = useId();
93
+ const inputLabelID = useId();
89
94
  const descriptionID = useId();
90
95
  const statusMessageID = useId();
91
96
  const inputRef = useRef(null);
@@ -94,6 +99,20 @@ export function TextInput({
94
99
  const [, startTransition] = useTransition();
95
100
  const [optimisticValue, setOptimisticValue] = useOptimistic(value);
96
101
  const isBusy = isLoading || optimisticValue !== value;
102
+
103
+ // Disabled-reason tooltip. Disabled controls swallow pointer events, so the
104
+ // tooltip listeners attach to the input container (which already exists) and
105
+ // the input stays perceivable via aria-disabled instead of the native
106
+ // disabled attribute. The field is made read-only so it can't be typed into,
107
+ // and value mutation is blocked by the isDisabled guard in handleChange.
108
+ const showsDisabledMessage = isDisabled && !!disabledMessage;
109
+ const disabledMessageTooltip = useTooltip({
110
+ placement: 'above',
111
+ // The container div is not naturally focusable; focusin bubbles up from
112
+ // the input, so always attach focus listeners.
113
+ focusTrigger: 'always',
114
+ isEnabled: showsDisabledMessage
115
+ });
97
116
  const statusIconMap = {
98
117
  warning: 'warning',
99
118
  error: 'error',
@@ -104,8 +123,17 @@ export function TextInput({
104
123
  error: 'error',
105
124
  success: 'success'
106
125
  };
107
- const ariaDescribedBy = [description ? descriptionID : null, status?.message ? statusMessageID : null].filter(Boolean).join(' ') || undefined;
126
+ const {
127
+ ariaLabelledBy,
128
+ ariaDescribedBy
129
+ } = getInputARIA(inputLabelID, [description ? descriptionID : null, status?.message ? statusMessageID : null, showsDisabledMessage ? disabledMessageTooltip.describedBy : null], inputGroup);
108
130
  const handleChange = e => {
131
+ // Value can't change while showing a disabled message (the field is
132
+ // read-only and non-native-disabled), but guard the handler too so the
133
+ // optimistic value and callbacks never fire.
134
+ if (isDisabled) {
135
+ return;
136
+ }
109
137
  const newValue = e.target.value;
110
138
  onChange?.(newValue, e);
111
139
  if (changeAction && !e.defaultPrevented) {
@@ -132,7 +160,13 @@ export function TextInput({
132
160
  disabled: isDisabled
133
161
  });
134
162
  const inputWrapper = /*#__PURE__*/_jsxs("div", {
135
- ref: containerRef,
163
+ ref: el => {
164
+ containerRef.current = el;
165
+ // Anchor + hover/focus listeners for the disabled-message tooltip.
166
+ // Handlers are gated internally by isEnabled, and anchor names
167
+ // compose, so attaching unconditionally is safe.
168
+ disabledMessageTooltip.ref(el);
169
+ },
136
170
  onClick: handleWrapperClick,
137
171
  onMouseUp: handleWrapperMouseUp,
138
172
  ...mergeProps(themeProps('text-input', {
@@ -142,6 +176,9 @@ export function TextInput({
142
176
  children: [startIcon && renderIconSlot(startIcon, {
143
177
  size: 'sm',
144
178
  color: 'secondary'
179
+ }), inputGroup && /*#__PURE__*/_jsx(VisuallyHidden, {
180
+ id: inputLabelID,
181
+ children: label
145
182
  }), /*#__PURE__*/_jsx("input", {
146
183
  ...rest,
147
184
  ref: mergeRefs(ref, inputRef),
@@ -156,15 +193,21 @@ export function TextInput({
156
193
  }
157
194
  onKeyDown?.(e);
158
195
  } : undefined,
159
- placeholder: placeholder,
160
- disabled: isDisabled,
196
+ placeholder: placeholder
197
+ // With a disabledMessage the input keeps focusability via aria-disabled
198
+ // so the reason is focus-discoverable; readOnly + the handleChange guard
199
+ // keep the value from changing.
200
+ ,
201
+ disabled: isDisabled && !showsDisabledMessage,
202
+ "aria-disabled": showsDisabledMessage ? 'true' : undefined,
203
+ readOnly: showsDisabledMessage || undefined,
161
204
  autoFocus: hasAutoFocus,
162
205
  "data-autofocus": hasAutoFocus || undefined,
163
206
  "aria-describedby": ariaDescribedBy,
164
207
  "aria-required": isRequired === true ? 'true' : undefined,
165
208
  "aria-invalid": status?.type === 'error' ? 'true' : undefined,
166
209
  "aria-busy": isBusy || undefined,
167
- "aria-label": inputGroup ? label : undefined,
210
+ "aria-labelledby": ariaLabelledBy,
168
211
  ...{
169
212
  0: {
170
213
  className: "x1lliihq x98rzlu xeuugli xc342km xng3xce x1717udv x9ynric xjm74w1 x6pjikd xw6l6zx x1tgivj0 xjbqb8w x1a2a7pz xeyghm5"
@@ -194,9 +237,11 @@ export function TextInput({
194
237
  })]
195
238
  });
196
239
  if (inputGroup) {
197
- return inputWrapper;
240
+ return /*#__PURE__*/_jsxs(_Fragment, {
241
+ children: [inputWrapper, showsDisabledMessage && disabledMessageTooltip.renderTooltip(disabledMessage)]
242
+ });
198
243
  }
199
- return /*#__PURE__*/_jsx(Field, {
244
+ return /*#__PURE__*/_jsxs(Field, {
200
245
  label: label,
201
246
  isLabelHidden: isLabelHidden,
202
247
  description: description,
@@ -212,7 +257,7 @@ export function TextInput({
212
257
  } : undefined,
213
258
  labelTooltip: labelTooltip,
214
259
  width: width,
215
- children: inputWrapper
260
+ children: [inputWrapper, showsDisabledMessage && disabledMessageTooltip.renderTooltip(disabledMessage)]
216
261
  });
217
262
  }
218
263
  TextInput.displayName = 'TextInput';