@astryxdesign/core 0.7.5-canary.a17ee0a → 0.7.5-canary.a2e2bcc

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 (869) hide show
  1. package/CHANGELOG.md +10 -10
  2. package/README.md +3 -3
  3. package/dist/AlertDialog/AlertDialog.js +1 -1
  4. package/dist/AppShell/AppShell.d.ts +0 -22
  5. package/dist/AppShell/AppShell.d.ts.map +1 -1
  6. package/dist/AppShell/AppShell.js +155 -1
  7. package/dist/Banner/Banner.d.ts +1 -0
  8. package/dist/Banner/Banner.d.ts.map +1 -1
  9. package/dist/Banner/Banner.js +2 -0
  10. package/dist/BottomSheet/BottomSheet.d.ts +51 -7
  11. package/dist/BottomSheet/BottomSheet.d.ts.map +1 -1
  12. package/dist/BottomSheet/BottomSheet.js +430 -204
  13. package/dist/BottomSheet/BottomSheetHostContext.d.ts +8 -0
  14. package/dist/BottomSheet/BottomSheetHostContext.d.ts.map +1 -0
  15. package/dist/BottomSheet/BottomSheetHostContext.js +35 -0
  16. package/dist/BottomSheet/BottomSheetPanel.d.ts +9 -1
  17. package/dist/BottomSheet/BottomSheetPanel.d.ts.map +1 -1
  18. package/dist/BottomSheet/BottomSheetPanel.js +77 -23
  19. package/dist/BottomSheet/BottomSheetSwitcher.d.ts +53 -14
  20. package/dist/BottomSheet/BottomSheetSwitcher.d.ts.map +1 -1
  21. package/dist/BottomSheet/BottomSheetSwitcher.js +229 -27
  22. package/dist/BottomSheet/BottomSheetSwitcherContext.d.ts +6 -0
  23. package/dist/BottomSheet/BottomSheetSwitcherContext.d.ts.map +1 -1
  24. package/dist/BottomSheet/bottomSheetEscape.d.ts +3 -0
  25. package/dist/BottomSheet/bottomSheetEscape.d.ts.map +1 -0
  26. package/dist/BottomSheet/bottomSheetEscape.js +20 -0
  27. package/dist/BottomSheet/bottomSheetStack.d.ts +262 -0
  28. package/dist/BottomSheet/bottomSheetStack.d.ts.map +1 -0
  29. package/dist/BottomSheet/bottomSheetStack.js +1675 -0
  30. package/dist/BottomSheet/useSheetGestures.d.ts +31 -3
  31. package/dist/BottomSheet/useSheetGestures.d.ts.map +1 -1
  32. package/dist/BottomSheet/useSheetGestures.js +73 -17
  33. package/dist/Breadcrumbs/BreadcrumbItem.d.ts.map +1 -1
  34. package/dist/Breadcrumbs/BreadcrumbItem.js +31 -3
  35. package/dist/Chat/ChatComposer.js +1 -1
  36. package/dist/Chat/ChatComposerInput.d.ts.map +1 -1
  37. package/dist/Chat/ChatComposerInput.js +55 -16
  38. package/dist/Chat/ChatPastedTextToken.d.ts.map +1 -1
  39. package/dist/Chat/ChatPastedTextToken.js +7 -6
  40. package/dist/CodeBlock/CodeBlock.d.ts +17 -2
  41. package/dist/CodeBlock/CodeBlock.d.ts.map +1 -1
  42. package/dist/CodeBlock/CodeBlock.js +26 -8
  43. package/dist/CodeBlock/grammar.d.ts +134 -0
  44. package/dist/CodeBlock/grammar.d.ts.map +1 -0
  45. package/dist/CodeBlock/grammar.js +219 -0
  46. package/dist/CodeBlock/index.d.ts +2 -0
  47. package/dist/CodeBlock/index.d.ts.map +1 -1
  48. package/dist/CodeBlock/index.js +1 -0
  49. package/dist/CodeBlock/languages/dockerfile.d.ts +3 -0
  50. package/dist/CodeBlock/languages/dockerfile.d.ts.map +1 -0
  51. package/dist/CodeBlock/languages/dockerfile.js +45 -0
  52. package/dist/CodeBlock/languages/graphql.d.ts +3 -0
  53. package/dist/CodeBlock/languages/graphql.d.ts.map +1 -0
  54. package/dist/CodeBlock/languages/graphql.js +27 -0
  55. package/dist/CodeBlock/languages/java.d.ts +3 -0
  56. package/dist/CodeBlock/languages/java.d.ts.map +1 -0
  57. package/dist/CodeBlock/languages/java.js +24 -0
  58. package/dist/CodeBlock/languages/lua.d.ts +3 -0
  59. package/dist/CodeBlock/languages/lua.d.ts.map +1 -0
  60. package/dist/CodeBlock/languages/lua.js +21 -0
  61. package/dist/CodeBlock/languages/objective-c.d.ts +3 -0
  62. package/dist/CodeBlock/languages/objective-c.d.ts.map +1 -0
  63. package/dist/CodeBlock/languages/objective-c.js +27 -0
  64. package/dist/CodeBlock/languages/powershell.d.ts +3 -0
  65. package/dist/CodeBlock/languages/powershell.d.ts.map +1 -0
  66. package/dist/CodeBlock/languages/powershell.js +30 -0
  67. package/dist/CodeBlock/languages/ruby.d.ts +3 -0
  68. package/dist/CodeBlock/languages/ruby.d.ts.map +1 -0
  69. package/dist/CodeBlock/languages/ruby.js +24 -0
  70. package/dist/CodeBlock/languages/thrift.d.ts +3 -0
  71. package/dist/CodeBlock/languages/thrift.d.ts.map +1 -0
  72. package/dist/CodeBlock/languages/thrift.js +18 -0
  73. package/dist/CodeBlock/languages/toml.d.ts +3 -0
  74. package/dist/CodeBlock/languages/toml.d.ts.map +1 -0
  75. package/dist/CodeBlock/languages/toml.js +53 -0
  76. package/dist/CodeBlock/tokenizer.d.ts +8 -4
  77. package/dist/CodeBlock/tokenizer.d.ts.map +1 -1
  78. package/dist/CodeBlock/tokenizer.js +158 -8
  79. package/dist/Collapsible/Collapsible.d.ts +8 -1
  80. package/dist/Collapsible/Collapsible.d.ts.map +1 -1
  81. package/dist/Collapsible/Collapsible.js +84 -2
  82. package/dist/CommandPalette/CommandPaletteEmpty.d.ts.map +1 -1
  83. package/dist/CommandPalette/CommandPaletteEmpty.js +1 -0
  84. package/dist/ComplexSelector/ComplexSelector.d.ts.map +1 -1
  85. package/dist/ComplexSelector/ComplexSelector.js +6 -2
  86. package/dist/Dialog/Dialog.d.ts.map +1 -1
  87. package/dist/Dialog/Dialog.js +41 -11
  88. package/dist/Drawer/Drawer.d.ts.map +1 -1
  89. package/dist/Drawer/Drawer.js +18 -13
  90. package/dist/DropdownMenu/DropdownMenu.d.ts.map +1 -1
  91. package/dist/DropdownMenu/DropdownMenu.js +2 -10
  92. package/dist/DropdownMenu/DropdownMenuGroup.d.ts +7 -4
  93. package/dist/DropdownMenu/DropdownMenuGroup.d.ts.map +1 -1
  94. package/dist/DropdownMenu/DropdownMenuGroup.js +10 -4
  95. package/dist/DropdownMenu/lazyMenuBottomSheet.d.ts +10 -1
  96. package/dist/DropdownMenu/lazyMenuBottomSheet.d.ts.map +1 -1
  97. package/dist/DropdownMenu/lazyMenuBottomSheet.js +16 -2
  98. package/dist/DropdownMenu/menuTouchAction.stylex.d.ts +25 -0
  99. package/dist/DropdownMenu/menuTouchAction.stylex.d.ts.map +1 -0
  100. package/dist/DropdownMenu/menuTouchAction.stylex.js +29 -0
  101. package/dist/Field/Field.js +1 -1
  102. package/dist/Field/FieldLabel.js +1 -1
  103. package/dist/Field/PanelSearchInput.d.ts +9 -1
  104. package/dist/Field/PanelSearchInput.d.ts.map +1 -1
  105. package/dist/Field/PanelSearchInput.js +20 -8
  106. package/dist/FileInput/FileInput.d.ts.map +1 -1
  107. package/dist/FileInput/FileInput.js +19 -9
  108. package/dist/Icon/Icon.d.ts +31 -2
  109. package/dist/Icon/Icon.d.ts.map +1 -1
  110. package/dist/Icon/Icon.js +58 -8
  111. package/dist/Icon/IconSize.stylex.d.ts +16 -11
  112. package/dist/Icon/IconSize.stylex.d.ts.map +1 -1
  113. package/dist/Icon/IconSize.stylex.js +27 -11
  114. package/dist/Icon/globalIconRegistry.d.ts +71 -4
  115. package/dist/Icon/globalIconRegistry.d.ts.map +1 -1
  116. package/dist/Icon/globalIconRegistry.js +163 -23
  117. package/dist/Icon/index.d.ts +26 -2
  118. package/dist/Icon/index.d.ts.map +1 -1
  119. package/dist/Icon/index.js +24 -1
  120. package/dist/Icon/useIcon.d.ts +5 -1
  121. package/dist/Icon/useIcon.d.ts.map +1 -1
  122. package/dist/Icon/useIcon.js +5 -1
  123. package/dist/Item/Item.d.ts +5 -1
  124. package/dist/Item/Item.d.ts.map +1 -1
  125. package/dist/Item/Item.js +22 -6
  126. package/dist/Item/ItemMarkerColumns.a11y.chromium.spec.d.ts +2 -0
  127. package/dist/Item/ItemMarkerColumns.a11y.chromium.spec.d.ts.map +1 -0
  128. package/dist/Item/ItemMarkerColumns.a11y.chromium.spec.js +132 -0
  129. package/dist/Item/ItemMarkerColumnsContext.d.ts +14 -0
  130. package/dist/Item/ItemMarkerColumnsContext.d.ts.map +1 -0
  131. package/dist/Item/ItemMarkerColumnsContext.js +18 -0
  132. package/dist/Kbd/Kbd.d.ts +2 -2
  133. package/dist/Kbd/Kbd.d.ts.map +1 -1
  134. package/dist/Kbd/Kbd.js +18 -11
  135. package/dist/Layer/modalOutlet.d.ts +43 -5
  136. package/dist/Layer/modalOutlet.d.ts.map +1 -1
  137. package/dist/Layer/modalOutlet.js +149 -13
  138. package/dist/Layer/useLayer.d.ts.map +1 -1
  139. package/dist/Layer/useLayer.js +128 -39
  140. package/dist/Lightbox/Lightbox.d.ts.map +1 -1
  141. package/dist/Lightbox/Lightbox.js +88 -81
  142. package/dist/Lightbox/LightboxViewport.a11y.browser.spec.d.ts +2 -0
  143. package/dist/Lightbox/LightboxViewport.a11y.browser.spec.d.ts.map +1 -0
  144. package/dist/Lightbox/LightboxViewport.a11y.browser.spec.js +65 -0
  145. package/dist/List/List.d.ts +2 -1
  146. package/dist/List/List.d.ts.map +1 -1
  147. package/dist/List/List.js +9 -2
  148. package/dist/List/ListContext.d.ts +16 -4
  149. package/dist/List/ListContext.d.ts.map +1 -1
  150. package/dist/List/ListContext.js +10 -5
  151. package/dist/List/ListItem.d.ts +7 -1
  152. package/dist/List/ListItem.d.ts.map +1 -1
  153. package/dist/List/ListItem.js +52 -8
  154. package/dist/List/ListMarkers.a11y.chromium.spec.d.ts +2 -0
  155. package/dist/List/ListMarkers.a11y.chromium.spec.d.ts.map +1 -0
  156. package/dist/List/ListMarkers.a11y.chromium.spec.js +677 -0
  157. package/dist/Markdown/Markdown.d.ts +11 -1
  158. package/dist/Markdown/Markdown.d.ts.map +1 -1
  159. package/dist/Markdown/Markdown.js +41 -14
  160. package/dist/MobileNav/MobileNav.d.ts.map +1 -1
  161. package/dist/MobileNav/MobileNav.js +37 -32
  162. package/dist/MobileNav/MobileNavToggle.d.ts +7 -3
  163. package/dist/MobileNav/MobileNavToggle.d.ts.map +1 -1
  164. package/dist/MobileNav/MobileNavToggle.js +11 -3
  165. package/dist/MultiSelector/CreateRow.a11y.chromium.spec.js +52 -6
  166. package/dist/MultiSelector/MultiSelector.d.ts +1 -1
  167. package/dist/MultiSelector/MultiSelector.d.ts.map +1 -1
  168. package/dist/MultiSelector/MultiSelector.js +13 -1
  169. package/dist/NavMenu/NavHeadingMenu.d.ts +1 -1
  170. package/dist/NavMenu/NavHeadingMenu.d.ts.map +1 -1
  171. package/dist/NavMenu/NavHeadingMenu.js +29 -5
  172. package/dist/NavMenu/NavHeadingMenuItem.d.ts.map +1 -1
  173. package/dist/NavMenu/NavHeadingMenuItem.js +51 -7
  174. package/dist/NavMenu/NavMenuContext.d.ts +9 -0
  175. package/dist/NavMenu/NavMenuContext.d.ts.map +1 -1
  176. package/dist/NavMenu/NavMenuContext.js +9 -0
  177. package/dist/NumberInput/NumberInput.d.ts +4 -2
  178. package/dist/NumberInput/NumberInput.d.ts.map +1 -1
  179. package/dist/NumberInput/NumberInput.js +11 -4
  180. package/dist/Overlay/Overlay.d.ts +3 -3
  181. package/dist/Overlay/Overlay.d.ts.map +1 -1
  182. package/dist/Overlay/Overlay.js +12 -5
  183. package/dist/Popover/Popover.d.ts +41 -2
  184. package/dist/Popover/Popover.d.ts.map +1 -1
  185. package/dist/Popover/Popover.js +276 -44
  186. package/dist/Popover/index.d.ts +1 -1
  187. package/dist/Popover/index.d.ts.map +1 -1
  188. package/dist/Popover/lazyPopoverBottomSheet.d.ts +23 -0
  189. package/dist/Popover/lazyPopoverBottomSheet.d.ts.map +1 -0
  190. package/dist/Popover/lazyPopoverBottomSheet.js +40 -0
  191. package/dist/PowerSearch/PowerSearch.d.ts.map +1 -1
  192. package/dist/PowerSearch/PowerSearch.js +7 -5
  193. package/dist/SegmentedControl/SegmentedControl.d.ts +1 -1
  194. package/dist/SegmentedControl/SegmentedControl.d.ts.map +1 -1
  195. package/dist/SegmentedControl/SegmentedControl.js +6 -2
  196. package/dist/Selector/Selector.d.ts.map +1 -1
  197. package/dist/Selector/Selector.js +19 -4
  198. package/dist/Selector/hooks.d.ts +52 -6
  199. package/dist/Selector/hooks.d.ts.map +1 -1
  200. package/dist/Selector/hooks.js +145 -2
  201. package/dist/SideNav/SideNav.d.ts.map +1 -1
  202. package/dist/SideNav/SideNav.js +58 -2
  203. package/dist/SideNav/SideNavHeading.d.ts.map +1 -1
  204. package/dist/SideNav/SideNavHeading.js +45 -3
  205. package/dist/SideNav/SideNavItem.d.ts +5 -1
  206. package/dist/SideNav/SideNavItem.d.ts.map +1 -1
  207. package/dist/SideNav/SideNavItem.js +36 -13
  208. package/dist/SideNav/railMotion.d.ts +54 -0
  209. package/dist/SideNav/railMotion.d.ts.map +1 -0
  210. package/dist/SideNav/railMotion.js +253 -0
  211. package/dist/Slider/Slider.d.ts.map +1 -1
  212. package/dist/Slider/Slider.js +7 -3
  213. package/dist/TabList/Tab.d.ts.map +1 -1
  214. package/dist/TabList/Tab.js +5 -1
  215. package/dist/TabList/TabMenu.d.ts.map +1 -1
  216. package/dist/TabList/TabMenu.js +25 -3
  217. package/dist/Table/TableCell.d.ts.map +1 -1
  218. package/dist/Table/TableCell.js +5 -1
  219. package/dist/Table/TableHeaderCell.d.ts.map +1 -1
  220. package/dist/Table/TableHeaderCell.js +1 -0
  221. package/dist/Table/TableRow.d.ts.map +1 -1
  222. package/dist/Table/TableRow.js +3 -0
  223. package/dist/Table/glidingDivider.d.ts +96 -0
  224. package/dist/Table/glidingDivider.d.ts.map +1 -0
  225. package/dist/Table/glidingDivider.js +275 -0
  226. package/dist/Table/plugins/columnResize/useTableColumnResize.d.ts.map +1 -1
  227. package/dist/Table/plugins/columnResize/useTableColumnResize.js +11 -2
  228. package/dist/Table/plugins/rowExpansion/useTableRowExpansion.d.ts +8 -0
  229. package/dist/Table/plugins/rowExpansion/useTableRowExpansion.d.ts.map +1 -1
  230. package/dist/Table/plugins/rowExpansion/useTableRowExpansion.js +374 -13
  231. package/dist/Table/plugins/stickyColumns/useTableStickyColumns.d.ts.map +1 -1
  232. package/dist/Table/plugins/stickyColumns/useTableStickyColumns.js +244 -6
  233. package/dist/Table/rowDivider.d.ts +34 -0
  234. package/dist/Table/rowDivider.d.ts.map +1 -0
  235. package/dist/Table/rowDivider.js +118 -0
  236. package/dist/Text/useTruncation.d.ts.map +1 -1
  237. package/dist/Text/useTruncation.js +23 -5
  238. package/dist/TextInput/TextInput.d.ts +1 -1
  239. package/dist/TextInput/TextInput.d.ts.map +1 -1
  240. package/dist/TextInput/TextInput.js +8 -1
  241. package/dist/Thumbnail/Thumbnail.d.ts.map +1 -1
  242. package/dist/Thumbnail/Thumbnail.js +35 -5
  243. package/dist/Toast/ToastViewport.d.ts.map +1 -1
  244. package/dist/Toast/ToastViewport.js +62 -6
  245. package/dist/Tokenizer/Tokenizer.d.ts +71 -4
  246. package/dist/Tokenizer/Tokenizer.d.ts.map +1 -1
  247. package/dist/Tokenizer/Tokenizer.js +422 -34
  248. package/dist/Tokenizer/TokenizerBottomSheet.d.ts +98 -0
  249. package/dist/Tokenizer/TokenizerBottomSheet.d.ts.map +1 -0
  250. package/dist/Tokenizer/TokenizerBottomSheet.js +721 -0
  251. package/dist/TopNav/TopNavHeading.d.ts.map +1 -1
  252. package/dist/TopNav/TopNavHeading.js +26 -0
  253. package/dist/TopNav/TopNavMegaMenu.d.ts.map +1 -1
  254. package/dist/TopNav/TopNavMegaMenu.js +4 -4
  255. package/dist/TopNav/TopNavMenu.d.ts.map +1 -1
  256. package/dist/TopNav/TopNavMenu.js +32 -4
  257. package/dist/TreeList/TreeList.d.ts +8 -23
  258. package/dist/TreeList/TreeList.d.ts.map +1 -1
  259. package/dist/TreeList/TreeList.js +175 -3
  260. package/dist/TreeList/TreeListBranches.d.ts.map +1 -1
  261. package/dist/TreeList/TreeListBranches.js +7 -5
  262. package/dist/TreeList/TreeListItem.d.ts +7 -1
  263. package/dist/TreeList/TreeListItem.d.ts.map +1 -1
  264. package/dist/TreeList/TreeListItem.js +5 -3
  265. package/dist/Typeahead/BaseTypeahead.d.ts +1 -1
  266. package/dist/Typeahead/BaseTypeahead.d.ts.map +1 -1
  267. package/dist/Typeahead/BaseTypeahead.emptyState.a11y.chromium.spec.d.ts +2 -0
  268. package/dist/Typeahead/BaseTypeahead.emptyState.a11y.chromium.spec.d.ts.map +1 -0
  269. package/dist/Typeahead/BaseTypeahead.emptyState.a11y.chromium.spec.js +118 -0
  270. package/dist/Typeahead/BaseTypeahead.js +11 -7
  271. package/dist/astryx.css +96 -10
  272. package/dist/hooks/ModalAnnounceProvider.d.ts +41 -0
  273. package/dist/hooks/ModalAnnounceProvider.d.ts.map +1 -0
  274. package/dist/hooks/ModalAnnounceProvider.js +133 -0
  275. package/dist/hooks/actionGroupTracker.d.ts +98 -0
  276. package/dist/hooks/actionGroupTracker.d.ts.map +1 -0
  277. package/dist/hooks/actionGroupTracker.js +338 -0
  278. package/dist/hooks/index.d.ts +2 -0
  279. package/dist/hooks/index.d.ts.map +1 -1
  280. package/dist/hooks/index.js +1 -0
  281. package/dist/hooks/menuPressOnItems.d.ts +19 -0
  282. package/dist/hooks/menuPressOnItems.d.ts.map +1 -0
  283. package/dist/hooks/menuPressOnItems.js +32 -0
  284. package/dist/hooks/modalAnnounce.d.ts +18 -0
  285. package/dist/hooks/modalAnnounce.d.ts.map +1 -0
  286. package/dist/hooks/modalAnnounce.js +382 -0
  287. package/dist/hooks/scrollGeometry.d.ts +28 -0
  288. package/dist/hooks/scrollGeometry.d.ts.map +1 -1
  289. package/dist/hooks/scrollGeometry.js +36 -2
  290. package/dist/hooks/useAdaptivePresentation.d.ts +8 -0
  291. package/dist/hooks/useAdaptivePresentation.d.ts.map +1 -1
  292. package/dist/hooks/useAdaptivePresentation.js +27 -5
  293. package/dist/hooks/useAnimatedLayout.d.ts +42 -0
  294. package/dist/hooks/useAnimatedLayout.d.ts.map +1 -0
  295. package/dist/hooks/useAnimatedLayout.js +46 -0
  296. package/dist/hooks/useAnnounce.d.ts +114 -0
  297. package/dist/hooks/useAnnounce.d.ts.map +1 -1
  298. package/dist/hooks/useAnnounce.js +273 -10
  299. package/dist/hooks/useBusyAnnouncement.d.ts +5 -3
  300. package/dist/hooks/useBusyAnnouncement.d.ts.map +1 -1
  301. package/dist/hooks/useBusyAnnouncement.js +30 -44
  302. package/dist/hooks/useFocusTrap.d.ts.map +1 -1
  303. package/dist/hooks/useFocusTrap.js +15 -8
  304. package/dist/hooks/useMenuHover.d.ts.map +1 -1
  305. package/dist/hooks/useMenuHover.js +6 -2
  306. package/dist/hooks/usePressFeedback.d.ts +5 -2
  307. package/dist/hooks/usePressFeedback.d.ts.map +1 -1
  308. package/dist/hooks/usePressFeedback.js +5 -2
  309. package/dist/hooks/useScrollableArea.d.ts +5 -0
  310. package/dist/hooks/useScrollableArea.d.ts.map +1 -1
  311. package/dist/hooks/useScrollableArea.js +67 -6
  312. package/dist/i18n/generated-locales/en.generated.d.ts.map +1 -1
  313. package/dist/i18n/generated-locales/en.generated.js +33 -0
  314. package/dist/i18n/generated-locales/pseudo.generated.d.ts.map +1 -1
  315. package/dist/i18n/generated-locales/pseudo.generated.js +33 -0
  316. package/dist/internal/tokenizer-presentation.d.ts +21 -0
  317. package/dist/internal/tokenizer-presentation.d.ts.map +1 -0
  318. package/dist/internal/tokenizer-presentation.js +21 -0
  319. package/dist/internal/touch.d.ts +26 -0
  320. package/dist/internal/touch.d.ts.map +1 -0
  321. package/dist/internal/touch.js +28 -0
  322. package/dist/motion/LayoutChangeSnapshot.d.ts +33 -0
  323. package/dist/motion/LayoutChangeSnapshot.d.ts.map +1 -0
  324. package/dist/motion/LayoutChangeSnapshot.js +37 -0
  325. package/dist/motion/animatedLayout.d.ts +190 -0
  326. package/dist/motion/animatedLayout.d.ts.map +1 -0
  327. package/dist/motion/animatedLayout.js +1502 -0
  328. package/dist/motion/animator.d.ts +240 -0
  329. package/dist/motion/animator.d.ts.map +1 -0
  330. package/dist/motion/animator.js +2203 -0
  331. package/dist/motion/bezier.d.ts +18 -0
  332. package/dist/motion/bezier.d.ts.map +1 -0
  333. package/dist/motion/bezier.js +60 -0
  334. package/dist/motion/coast.d.ts +61 -0
  335. package/dist/motion/coast.d.ts.map +1 -0
  336. package/dist/motion/coast.js +107 -0
  337. package/dist/motion/projection.d.ts +4 -15
  338. package/dist/motion/projection.d.ts.map +1 -1
  339. package/dist/motion/projection.js +5 -29
  340. package/dist/motion/reducedMotion.d.ts +25 -0
  341. package/dist/motion/reducedMotion.d.ts.map +1 -0
  342. package/dist/motion/reducedMotion.js +85 -0
  343. package/dist/motion/reducedMotion.stylex.d.ts +19 -0
  344. package/dist/motion/reducedMotion.stylex.d.ts.map +1 -0
  345. package/dist/motion/reducedMotion.stylex.js +37 -0
  346. package/dist/motion/reducedMotionPlan.d.ts +89 -0
  347. package/dist/motion/reducedMotionPlan.d.ts.map +1 -0
  348. package/dist/motion/reducedMotionPlan.js +194 -0
  349. package/dist/motion/resolveSnapPoint.d.ts +52 -0
  350. package/dist/motion/resolveSnapPoint.d.ts.map +1 -0
  351. package/dist/motion/resolveSnapPoint.js +135 -0
  352. package/dist/motion/roleValue.d.ts +33 -0
  353. package/dist/motion/roleValue.d.ts.map +1 -0
  354. package/dist/motion/roleValue.js +84 -0
  355. package/dist/motion/roles.d.ts +79 -0
  356. package/dist/motion/roles.d.ts.map +1 -0
  357. package/dist/motion/roles.js +199 -0
  358. package/dist/motion/selectPage.d.ts +26 -0
  359. package/dist/motion/selectPage.d.ts.map +1 -0
  360. package/dist/motion/selectPage.js +55 -0
  361. package/dist/motion/transientCopy.d.ts +33 -0
  362. package/dist/motion/transientCopy.d.ts.map +1 -0
  363. package/dist/motion/transientCopy.js +314 -0
  364. package/dist/motion/uikit/index.d.ts +6 -5
  365. package/dist/motion/uikit/index.d.ts.map +1 -1
  366. package/dist/motion/uikit/index.js +6 -5
  367. package/dist/motion/uikit/navigation.d.ts +6 -23
  368. package/dist/motion/uikit/navigation.d.ts.map +1 -1
  369. package/dist/motion/uikit/navigation.js +11 -1
  370. package/dist/motion/uikit/scroll.d.ts +12 -20
  371. package/dist/motion/uikit/scroll.d.ts.map +1 -1
  372. package/dist/motion/uikit/scroll.js +21 -4
  373. package/dist/motion/uikit/springs.d.ts +409 -210
  374. package/dist/motion/uikit/springs.d.ts.map +1 -1
  375. package/dist/motion/uikit/springs.js +489 -328
  376. package/dist/motion/uikit/timing.d.ts +40 -47
  377. package/dist/motion/uikit/timing.d.ts.map +1 -1
  378. package/dist/motion/uikit/timing.js +66 -26
  379. package/dist/theme/defineTheme.d.ts +111 -11
  380. package/dist/theme/defineTheme.d.ts.map +1 -1
  381. package/dist/theme/defineTheme.js +97 -7
  382. package/dist/theme/derivedVarRegistry.d.ts.map +1 -1
  383. package/dist/theme/derivedVarRegistry.js +9 -0
  384. package/dist/theme/syntax/SyntaxTheme.d.ts +1 -1
  385. package/dist/theme/syntax/SyntaxTheme.js +1 -1
  386. package/dist/theme/syntax/defineSyntaxTheme.js +1 -1
  387. package/dist/theme/syntax/presets.d.ts +1 -1
  388. package/dist/theme/syntax/presets.js +1 -1
  389. package/dist/theme/syntax/tokens.d.ts +1 -1
  390. package/dist/theme/syntax/tokens.js +1 -1
  391. package/dist/theme/tokens.stylex.d.ts +2 -0
  392. package/dist/theme/tokens.stylex.d.ts.map +1 -1
  393. package/dist/theme/tokens.stylex.js +7 -1
  394. package/dist/theme/useTheme.d.ts +4 -2
  395. package/dist/theme/useTheme.d.ts.map +1 -1
  396. package/dist/theme/useTheme.js +10 -4
  397. package/dist/utils/focusReturn.d.ts +17 -1
  398. package/dist/utils/focusReturn.d.ts.map +1 -1
  399. package/dist/utils/focusReturn.js +11 -4
  400. package/dist/utils/hitArea.d.ts +72 -0
  401. package/dist/utils/hitArea.d.ts.map +1 -0
  402. package/dist/utils/hitArea.js +681 -0
  403. package/dist/utils/interactionModality.d.ts +11 -2
  404. package/dist/utils/interactionModality.d.ts.map +1 -1
  405. package/dist/utils/interactionModality.js +58 -5
  406. package/dist/utils/interactionOverlay.stylex.d.ts +4 -1
  407. package/dist/utils/interactionOverlay.stylex.d.ts.map +1 -1
  408. package/dist/utils/interactionOverlay.stylex.js +4 -1
  409. package/dist/utils/pressFeedback.d.ts +5 -1
  410. package/dist/utils/pressFeedback.d.ts.map +1 -1
  411. package/dist/utils/pressFeedback.js +285 -54
  412. package/dist/utils/pressGesture.d.ts +13 -1
  413. package/dist/utils/pressGesture.d.ts.map +1 -1
  414. package/dist/utils/pressGesture.js +40 -1
  415. package/locales/af-ZA.json +1 -1
  416. package/locales/ar-SA.json +1 -1
  417. package/locales/ca-ES.json +1 -1
  418. package/locales/cs-CZ.json +1 -1
  419. package/locales/da-DK.json +1 -1
  420. package/locales/de-DE.json +1 -1
  421. package/locales/el-GR.json +1 -1
  422. package/locales/en.json +132 -0
  423. package/locales/es-ES.json +1 -1
  424. package/locales/fi-FI.json +1 -1
  425. package/locales/fr-FR.json +1 -1
  426. package/locales/he-IL.json +1 -1
  427. package/locales/hu-HU.json +1 -1
  428. package/locales/it-IT.json +1 -1
  429. package/locales/ja-JP.json +1 -1
  430. package/locales/ko-KR.json +1 -1
  431. package/locales/nl-NL.json +1 -1
  432. package/locales/no-NO.json +1 -1
  433. package/locales/pl-PL.json +1 -1
  434. package/locales/pseudo.json +99 -0
  435. package/locales/pt-BR.json +1 -1
  436. package/locales/pt-PT.json +1 -1
  437. package/locales/ro-RO.json +1 -1
  438. package/locales/ru-RU.json +1 -1
  439. package/locales/sr-SP.json +1 -1
  440. package/locales/sv-SE.json +1 -1
  441. package/locales/tr-TR.json +1 -1
  442. package/locales/uk-UA.json +1 -1
  443. package/locales/vi-VN.json +1 -1
  444. package/locales/zh-CN.json +1 -1
  445. package/locales/zh-TW.json +1 -1
  446. package/package.json +61 -6
  447. package/src/AlertDialog/AlertDialog.spec.md +85 -31
  448. package/src/AlertDialog/AlertDialog.tsx +1 -1
  449. package/src/AlertDialog/__tests__/AlertDialog.a11y.chromium.spec.ts +18 -6
  450. package/src/AppShell/AppShell.spec.md +49 -44
  451. package/src/AppShell/AppShell.tsx +170 -2
  452. package/src/AspectRatio/AspectRatio.spec.md +179 -0
  453. package/src/AvatarGroup/AvatarGroup.spec.md +205 -0
  454. package/src/AvatarGroup/AvatarGroupOverflow.spec.md +123 -120
  455. package/src/Banner/Banner.spec.md +4 -2
  456. package/src/Banner/Banner.test.tsx +36 -17
  457. package/src/Banner/Banner.tsx +5 -0
  458. package/src/Blockquote/Blockquote.spec.md +171 -0
  459. package/src/BottomSheet/BottomSheet.doc.mjs +106 -24
  460. package/src/BottomSheet/BottomSheet.spec.md +63 -51
  461. package/src/BottomSheet/BottomSheet.test.tsx +537 -5
  462. package/src/BottomSheet/BottomSheet.tsx +540 -152
  463. package/src/BottomSheet/BottomSheetHostContext.ts +44 -0
  464. package/src/BottomSheet/BottomSheetPanel.test.tsx +73 -19
  465. package/src/BottomSheet/BottomSheetPanel.tsx +178 -63
  466. package/src/BottomSheet/BottomSheetReplace.test.tsx +1638 -0
  467. package/src/BottomSheet/BottomSheetStacking.announce.test.tsx +246 -0
  468. package/src/BottomSheet/BottomSheetStacking.test.tsx +3184 -0
  469. package/src/BottomSheet/BottomSheetSwitcher.doc.mjs +27 -31
  470. package/src/BottomSheet/BottomSheetSwitcher.spec.md +26 -33
  471. package/src/BottomSheet/BottomSheetSwitcher.tsx +275 -26
  472. package/src/BottomSheet/BottomSheetSwitcherContext.ts +6 -0
  473. package/src/BottomSheet/__tests__/BottomSheetKeyboard.a11y.browser.spec.ts +3 -1
  474. package/src/BottomSheet/bottomSheetEscape.ts +21 -0
  475. package/src/BottomSheet/bottomSheetStack.ts +2054 -0
  476. package/src/BottomSheet/useSheetGestures.test.ts +52 -0
  477. package/src/BottomSheet/useSheetGestures.ts +105 -18
  478. package/src/Breadcrumbs/BreadcrumbItem.spec.md +104 -60
  479. package/src/Breadcrumbs/BreadcrumbItem.tsx +25 -1
  480. package/src/Breadcrumbs/Breadcrumbs.spec.md +165 -0
  481. package/src/Breadcrumbs/Breadcrumbs.test.tsx +70 -2
  482. package/src/Breadcrumbs/__tests__/Breadcrumbs.a11y.chromium.spec.ts +18 -6
  483. package/src/Button/Button.spec.md +30 -28
  484. package/src/ButtonGroup/ButtonGroup.spec.md +4 -2
  485. package/src/Calendar/Calendar.spec.md +87 -48
  486. package/src/Calendar/__tests__/Calendar.a11y.chromium.spec.ts +21 -7
  487. package/src/Card/Card.spec.md +205 -0
  488. package/src/Carousel/__tests__/Carousel.a11y.chromium.spec.ts +21 -7
  489. package/src/Center/Center.spec.md +104 -124
  490. package/src/Chat/ChatComposer.test.tsx +32 -0
  491. package/src/Chat/ChatComposer.tsx +1 -1
  492. package/src/Chat/ChatComposerInput.test.tsx +165 -21
  493. package/src/Chat/ChatComposerInput.tsx +73 -16
  494. package/src/Chat/ChatPastedTextToken.test.tsx +71 -0
  495. package/src/Chat/ChatPastedTextToken.tsx +8 -7
  496. package/src/Chat/__tests__/ChatLayoutScrollButton.a11y.chromium.spec.ts +21 -4
  497. package/src/CheckboxInput/CheckboxInput.spec.md +97 -66
  498. package/src/CheckboxList/CheckboxList.spec.md +92 -78
  499. package/src/CheckboxList/CheckboxListItem.spec.md +86 -60
  500. package/src/ClickableCard/ClickableCard.spec.md +124 -128
  501. package/src/Code/Code.spec.md +30 -32
  502. package/src/CodeBlock/CodeBlock.doc.mjs +5 -4
  503. package/src/CodeBlock/CodeBlock.tsx +66 -15
  504. package/src/CodeBlock/CodeLanguage.test.tsx +173 -0
  505. package/src/CodeBlock/__tests__/CodeBlockLanguages.a11y.chromium.spec.ts +64 -0
  506. package/src/CodeBlock/grammar.ts +291 -0
  507. package/src/CodeBlock/index.ts +7 -0
  508. package/src/CodeBlock/languages/dockerfile.ts +43 -0
  509. package/src/CodeBlock/languages/graphql.ts +30 -0
  510. package/src/CodeBlock/languages/java.ts +28 -0
  511. package/src/CodeBlock/languages/lua.ts +21 -0
  512. package/src/CodeBlock/languages/objective-c.ts +26 -0
  513. package/src/CodeBlock/languages/powershell.ts +31 -0
  514. package/src/CodeBlock/languages/ruby.ts +29 -0
  515. package/src/CodeBlock/languages/thrift.ts +32 -0
  516. package/src/CodeBlock/languages/toml.ts +36 -0
  517. package/src/CodeBlock/languages.test.ts +402 -0
  518. package/src/CodeBlock/tokenizer.ts +176 -16
  519. package/src/CodeBlock/tokenizerBudget.test.ts +112 -0
  520. package/src/Collapsible/Collapsible.doc.mjs +6 -0
  521. package/src/Collapsible/Collapsible.spec.md +26 -23
  522. package/src/Collapsible/Collapsible.tsx +121 -2
  523. package/src/Collapsible/__tests__/Collapsible.a11y.chromium.spec.ts +18 -7
  524. package/src/Collapsible/__tests__/CollapsibleGroupAccordion.a11y.chromium.spec.ts +18 -6
  525. package/src/CommandPalette/CommandPalette.perf.test.ts +8 -4
  526. package/src/CommandPalette/CommandPaletteEmpty.doc.mjs +6 -3
  527. package/src/CommandPalette/CommandPaletteEmpty.spec.md +190 -0
  528. package/src/CommandPalette/CommandPaletteEmpty.tsx +4 -0
  529. package/src/CommandPalette/__tests__/CommandPaletteEmptyAudit.a11y.chromium.spec.ts +715 -0
  530. package/src/CommandPalette/__tests__/CommandPaletteFooter.a11y.chromium.spec.ts +2 -2
  531. package/src/ComplexSelector/ComplexSelector.spec.md +1 -1
  532. package/src/ComplexSelector/ComplexSelector.test.tsx +43 -0
  533. package/src/ComplexSelector/ComplexSelector.tsx +7 -1
  534. package/src/ContextMenu/ContextMenu.spec.md +30 -26
  535. package/src/DateInput/DateInputTouch.test.tsx +1 -1
  536. package/src/DateTimeInput/DateTimeInput.spec.md +71 -48
  537. package/src/Dialog/Dialog.spec.md +20 -4
  538. package/src/Dialog/Dialog.test.tsx +216 -2
  539. package/src/Dialog/Dialog.tsx +47 -11
  540. package/src/Dialog/__tests__/Dialog.reduced-motion.a11y.browser.spec.ts +63 -2
  541. package/src/Dialog/__tests__/DialogSecondDocument.a11y.browser.spec.ts +202 -0
  542. package/src/Divider/Divider.spec.md +79 -70
  543. package/src/Drawer/Drawer.spec.md +111 -80
  544. package/src/Drawer/Drawer.tsx +38 -35
  545. package/src/Drawer/DrawerHeader.spec.md +181 -0
  546. package/src/DropdownMenu/DropdownMenu.spec.md +3 -1
  547. package/src/DropdownMenu/DropdownMenu.ssr.test.tsx +44 -8
  548. package/src/DropdownMenu/DropdownMenu.test.tsx +43 -0
  549. package/src/DropdownMenu/DropdownMenu.tsx +4 -13
  550. package/src/DropdownMenu/DropdownMenuGroup.doc.mjs +2 -2
  551. package/src/DropdownMenu/DropdownMenuGroup.tsx +12 -6
  552. package/src/DropdownMenu/__tests__/Menu.a11y.chromium.spec.ts +19 -7
  553. package/src/DropdownMenu/__tests__/MenuButton.a11y.chromium.spec.ts +21 -9
  554. package/src/DropdownMenu/lazyMenuBottomSheet.test.ts +53 -0
  555. package/src/DropdownMenu/lazyMenuBottomSheet.ts +23 -6
  556. package/src/DropdownMenu/menuTouchAction.stylex.ts +28 -0
  557. package/src/DropdownMenu/modules/useMenuPress.spec.md +35 -36
  558. package/src/Field/Field.spec.md +57 -48
  559. package/src/Field/Field.tsx +1 -1
  560. package/src/Field/FieldLabel.spec.md +70 -59
  561. package/src/Field/FieldLabel.tsx +1 -1
  562. package/src/Field/PanelSearchInput.tsx +11 -0
  563. package/src/FileInput/FileInput.doc.mjs +1 -1
  564. package/src/FileInput/FileInput.test.tsx +102 -0
  565. package/src/FileInput/FileInput.tsx +15 -9
  566. package/src/FormLayout/FormLayout.spec.md +69 -51
  567. package/src/Grid/Grid.spec.md +72 -69
  568. package/src/Grid/GridSpan.spec.md +158 -0
  569. package/src/Heading/Heading.spec.md +198 -0
  570. package/src/HoverCard/HoverCard.spec.md +244 -0
  571. package/src/Icon/Icon.doc.mjs +65 -3
  572. package/src/Icon/Icon.test.tsx +545 -9
  573. package/src/Icon/Icon.tsx +73 -12
  574. package/src/Icon/IconSize.stylex.ts +27 -11
  575. package/src/Icon/globalIconRegistry.test.tsx +395 -3
  576. package/src/Icon/globalIconRegistry.tsx +184 -36
  577. package/src/Icon/index.ts +29 -1
  578. package/src/Icon/useIcon.ts +5 -1
  579. package/src/IconButton/IconButton.test.tsx +5 -2
  580. package/src/InputGroup/InputGroup.spec.md +199 -0
  581. package/src/InputGroup/InputGroupText.spec.md +139 -0
  582. package/src/Item/Item.test.tsx +40 -1
  583. package/src/Item/Item.tsx +37 -4
  584. package/src/Item/ItemMarkerColumns.a11y.chromium.spec.ts +211 -0
  585. package/src/Item/ItemMarkerColumnsContext.tsx +20 -0
  586. package/src/Kbd/Kbd.test.tsx +95 -0
  587. package/src/Kbd/Kbd.tsx +30 -23
  588. package/src/Layer/LayerProvider.spec.md +149 -0
  589. package/src/Layer/layerDismissalInvariants.test.tsx +9 -0
  590. package/src/Layer/modalOutlet.ts +155 -14
  591. package/src/Layer/useLayer.doc.mjs +1 -1
  592. package/src/Layer/useLayer.test.tsx +216 -1
  593. package/src/Layer/useLayer.tsx +162 -46
  594. package/src/Layout/__tests__/Layout.a11y.chromium.spec.ts +18 -6
  595. package/src/Lightbox/Lightbox.spec.md +9 -8
  596. package/src/Lightbox/Lightbox.test.tsx +15 -0
  597. package/src/Lightbox/Lightbox.tsx +126 -118
  598. package/src/Lightbox/LightboxViewport.a11y.browser.spec.ts +70 -0
  599. package/src/Link/Link.spec.md +229 -0
  600. package/src/Link/LinkProvider.spec.md +167 -0
  601. package/src/Link/__tests__/Link.a11y.chromium.spec.ts +18 -8
  602. package/src/List/List.spec.md +113 -34
  603. package/src/List/List.tsx +13 -1
  604. package/src/List/ListContext.tsx +19 -5
  605. package/src/List/ListItem.tsx +97 -28
  606. package/src/List/ListMarkers.a11y.chromium.spec.ts +904 -0
  607. package/src/Markdown/Markdown.codeLanguages.test.tsx +137 -0
  608. package/src/Markdown/Markdown.doc.mjs +12 -0
  609. package/src/Markdown/Markdown.test.tsx +50 -0
  610. package/src/Markdown/Markdown.tsx +61 -8
  611. package/src/MobileNav/MobileNav.doc.mjs +2 -2
  612. package/src/MobileNav/MobileNav.spec.md +161 -64
  613. package/src/MobileNav/MobileNav.tsx +41 -35
  614. package/src/MobileNav/MobileNavToggle.test.tsx +63 -0
  615. package/src/MobileNav/MobileNavToggle.tsx +13 -5
  616. package/src/MoreMenu/MoreMenu.spec.md +88 -53
  617. package/src/MultiSelector/CreateRow.a11y.chromium.spec.ts +66 -9
  618. package/src/MultiSelector/MultiSelector.test.tsx +97 -0
  619. package/src/MultiSelector/MultiSelector.tsx +16 -1
  620. package/src/NavIcon/NavIcon.spec.md +66 -38
  621. package/src/NavMenu/NavHeadingMenu.spec.md +104 -46
  622. package/src/NavMenu/NavHeadingMenu.test.tsx +276 -2
  623. package/src/NavMenu/NavHeadingMenu.tsx +42 -4
  624. package/src/NavMenu/NavHeadingMenuItem.tsx +60 -6
  625. package/src/NavMenu/NavMenuContext.tsx +11 -0
  626. package/src/NavMenu/__tests__/NavMenusSlideSelection.a11y.chromium.spec.ts +137 -0
  627. package/src/NumberInput/NumberInput.doc.mjs +13 -7
  628. package/src/NumberInput/NumberInput.spec.md +270 -0
  629. package/src/NumberInput/NumberInput.test.tsx +43 -0
  630. package/src/NumberInput/NumberInput.tsx +24 -4
  631. package/src/NumberInput/__tests__/NumberInput.coarse-pointer.a11y.chromium.spec.ts +102 -0
  632. package/src/Overlay/Overlay.doc.mjs +2 -2
  633. package/src/Overlay/Overlay.test.tsx +72 -4
  634. package/src/Overlay/Overlay.tsx +18 -8
  635. package/src/Popover/Popover.doc.mjs +38 -2
  636. package/src/Popover/Popover.spec.md +72 -12
  637. package/src/Popover/Popover.test.tsx +95 -0
  638. package/src/Popover/Popover.tsx +401 -35
  639. package/src/Popover/PopoverPresentation.test.tsx +952 -0
  640. package/src/Popover/index.ts +5 -1
  641. package/src/Popover/lazyPopoverBottomSheet.ts +57 -0
  642. package/src/PowerSearch/PowerSearch.spec.md +423 -53
  643. package/src/PowerSearch/PowerSearch.test.tsx +32 -1
  644. package/src/PowerSearch/PowerSearch.tsx +7 -5
  645. package/src/ProgressBar/__tests__/ProgressBar.a11y.chromium.spec.ts +21 -9
  646. package/src/RadioList/RadioList.spec.md +227 -0
  647. package/src/RadioList/RadioListItem.spec.md +223 -0
  648. package/src/Resizable/__tests__/ResizeHandle.a11y.chromium.spec.ts +21 -14
  649. package/src/Section/Section.spec.md +102 -44
  650. package/src/SegmentedControl/SegmentedControl.spec.md +162 -53
  651. package/src/SegmentedControl/SegmentedControl.test.tsx +46 -0
  652. package/src/SegmentedControl/SegmentedControl.tsx +7 -3
  653. package/src/SegmentedControl/SegmentedControlItem.spec.md +206 -0
  654. package/src/SelectableCard/SelectableCard.spec.md +230 -0
  655. package/src/Selector/Selector.sheetActiveDescendant.test.tsx +95 -0
  656. package/src/Selector/Selector.test.tsx +47 -0
  657. package/src/Selector/Selector.tsx +22 -3
  658. package/src/Selector/__tests__/ComboboxField.a11y.chromium.spec.ts +458 -0
  659. package/src/Selector/hooks.ts +234 -10
  660. package/src/Selector/useCombobox.doc.mjs +156 -9
  661. package/src/Selector/useCombobox.public.test.tsx +89 -0
  662. package/src/Selector/useCombobox.test.tsx +444 -0
  663. package/src/SideNav/SideNav.spec.md +45 -27
  664. package/src/SideNav/SideNav.test.tsx +354 -17
  665. package/src/SideNav/SideNav.tsx +85 -1
  666. package/src/SideNav/SideNavHeading.spec.md +26 -19
  667. package/src/SideNav/SideNavHeading.tsx +61 -6
  668. package/src/SideNav/SideNavItem.tsx +40 -9
  669. package/src/SideNav/SideNavRailMotion.test.tsx +620 -0
  670. package/src/SideNav/__tests__/SideNavRailMotion.interaction.browser.spec.ts +417 -0
  671. package/src/SideNav/railMotion.ts +315 -0
  672. package/src/Skeleton/Skeleton.spec.md +7 -7
  673. package/src/Slider/Slider.fr10.test.tsx +34 -0
  674. package/src/Slider/Slider.tsx +10 -2
  675. package/src/Slider/__tests__/Slider.a11y.chromium.spec.ts +19 -7
  676. package/src/Spinner/Spinner.spec.md +10 -10
  677. package/src/Stack/Stack.spec.md +104 -56
  678. package/src/Stepper/Step.spec.md +206 -0
  679. package/src/Switch/Switch.spec.md +150 -66
  680. package/src/TabList/Tab.spec.md +201 -0
  681. package/src/TabList/Tab.tsx +7 -1
  682. package/src/TabList/TabList.test.tsx +27 -0
  683. package/src/TabList/TabMenu.spec.md +198 -0
  684. package/src/TabList/TabMenu.tsx +24 -1
  685. package/src/TabList/__tests__/TabListOverflow.interaction.browser.spec.ts +99 -0
  686. package/src/Table/Table.spec.md +51 -31
  687. package/src/Table/TableCell.tsx +9 -0
  688. package/src/Table/TableHeaderCell.tsx +2 -0
  689. package/src/Table/TableRow.tsx +3 -0
  690. package/src/Table/__tests__/Table.a11y.chromium.spec.ts +18 -6
  691. package/src/Table/__tests__/TableRowGlide.a11y.browser.spec.ts +382 -0
  692. package/src/Table/__tests__/TableStickyDividers.a11y.browser.spec.ts +560 -0
  693. package/src/Table/glidingDivider.ts +336 -0
  694. package/src/Table/plugins/columnResize/useTableColumnResize.tsx +23 -8
  695. package/src/Table/plugins/rowExpansion/useTableRowExpansion.glide.test.tsx +280 -0
  696. package/src/Table/plugins/rowExpansion/useTableRowExpansion.test.tsx +91 -9
  697. package/src/Table/plugins/rowExpansion/useTableRowExpansion.tsx +471 -10
  698. package/src/Table/plugins/rowStatus/useTableRowStatus.spec.md +4 -4
  699. package/src/Table/plugins/sortable/__tests__/useTableSortable.a11y.ts +1 -1
  700. package/src/Table/plugins/stickyColumns/useTableStickyColumns.test.tsx +51 -1
  701. package/src/Table/plugins/stickyColumns/useTableStickyColumns.tsx +312 -12
  702. package/src/Table/rowDivider.ts +154 -0
  703. package/src/Table/useTableRowExpansion.doc.mjs +8 -0
  704. package/src/Text/Text.spec.md +114 -127
  705. package/src/Text/useTruncation.test.tsx +128 -1
  706. package/src/Text/useTruncation.ts +23 -5
  707. package/src/TextArea/TextArea.spec.md +164 -64
  708. package/src/TextInput/TextInput.spec.md +260 -0
  709. package/src/TextInput/TextInput.test.tsx +43 -0
  710. package/src/TextInput/TextInput.tsx +11 -1
  711. package/src/Thumbnail/Thumbnail.spec.md +244 -0
  712. package/src/Thumbnail/Thumbnail.test.tsx +109 -6
  713. package/src/Thumbnail/Thumbnail.tsx +34 -4
  714. package/src/TimeInput/TimeInput.spec.md +273 -0
  715. package/src/Timestamp/Timestamp.spec.md +252 -0
  716. package/src/Toast/Toast.spec.md +300 -0
  717. package/src/Toast/ToastViewport.modalHost.test.tsx +496 -6
  718. package/src/Toast/ToastViewport.test.tsx +137 -0
  719. package/src/Toast/ToastViewport.tsx +63 -6
  720. package/src/ToggleButton/ToggleButtonGroup.spec.md +14 -13
  721. package/src/Tokenizer/Tokenizer.props-type.test.tsx +126 -0
  722. package/src/Tokenizer/Tokenizer.spec.md +313 -72
  723. package/src/Tokenizer/Tokenizer.ssr.test.tsx +196 -0
  724. package/src/Tokenizer/Tokenizer.test.tsx +48 -0
  725. package/src/Tokenizer/Tokenizer.tsx +575 -27
  726. package/src/Tokenizer/TokenizerBottomSheet.test.tsx +2719 -0
  727. package/src/Tokenizer/TokenizerBottomSheet.tsx +957 -0
  728. package/src/Tokenizer/__tests__/TokenizerEndLane.a11y.chromium.spec.ts +60 -27
  729. package/src/Toolbar/Toolbar.spec.md +103 -49
  730. package/src/Toolbar/__tests__/Toolbar.a11y.chromium.spec.ts +18 -6
  731. package/src/Tooltip/Tooltip.spec.md +161 -36
  732. package/src/Tooltip/__tests__/Tooltip.a11y.chromium.spec.ts +18 -7
  733. package/src/Tooltip/__tests__/TooltipTallContent.a11y.browser.spec.ts +34 -7
  734. package/src/TopNav/TopNav.test.tsx +89 -0
  735. package/src/TopNav/TopNavHeading.spec.md +24 -17
  736. package/src/TopNav/TopNavHeading.tsx +35 -2
  737. package/src/TopNav/TopNavMegaMenu.reduced-motion.source-build.test.mjs +83 -0
  738. package/src/TopNav/TopNavMegaMenu.tsx +21 -4
  739. package/src/TopNav/TopNavMenu.spec.md +27 -20
  740. package/src/TopNav/TopNavMenu.test.tsx +65 -1
  741. package/src/TopNav/TopNavMenu.tsx +30 -1
  742. package/src/TreeList/TreeList.doc.mjs +13 -0
  743. package/src/TreeList/TreeList.spec.md +54 -35
  744. package/src/TreeList/TreeList.tsx +234 -2
  745. package/src/TreeList/TreeListBranches.tsx +8 -6
  746. package/src/TreeList/TreeListItem.tsx +12 -6
  747. package/src/TreeList/__tests__/TreeList.a11y.chromium.spec.ts +18 -6
  748. package/src/TreeList/__tests__/TreeListGuideAlignment.interaction.browser.spec.ts +127 -0
  749. package/src/Typeahead/BaseTypeahead.emptyState.a11y.chromium.spec.ts +138 -0
  750. package/src/Typeahead/BaseTypeahead.test.tsx +201 -4
  751. package/src/Typeahead/BaseTypeahead.tsx +12 -8
  752. package/src/VisuallyHidden/VisuallyHidden.spec.md +170 -0
  753. package/src/__tests__/BusyOwnerAnnouncement.test.tsx +7 -5
  754. package/src/__tests__/PressModality.a11y.chromium.spec.ts +392 -0
  755. package/src/__tests__/unthemedLength.ts +34 -0
  756. package/src/gestures/__tests__/VelocityTracker.streams.test.ts +243 -0
  757. package/src/gestures/__tests__/fixtures/pointer-streams/README.md +82 -0
  758. package/src/gestures/__tests__/fixtures/pointer-streams/android-chromium-fling.json +130 -0
  759. package/src/gestures/__tests__/fixtures/pointer-streams/android-chromium-slow.json +860 -0
  760. package/src/gestures/__tests__/fixtures/pointer-streams/android-chromium-stop-release.json +357 -0
  761. package/src/gestures/__tests__/fixtures/pointer-streams/android-firefox-fling.json +66 -0
  762. package/src/gestures/__tests__/fixtures/pointer-streams/android-firefox-slow.json +268 -0
  763. package/src/gestures/__tests__/fixtures/pointer-streams/android-firefox-stop-release.json +128 -0
  764. package/src/gestures/__tests__/fixtures/pointer-streams/capture.html +123 -0
  765. package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-mouse-fling.json +64 -0
  766. package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-mouse-slow.json +268 -0
  767. package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-mouse-stop-release.json +124 -0
  768. package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-pen-fling.json +64 -0
  769. package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-pen-slow.json +268 -0
  770. package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-pen-stop-release.json +124 -0
  771. package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-touch-fling.json +84 -0
  772. package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-touch-slow.json +381 -0
  773. package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-touch-stop-release.json +171 -0
  774. package/src/gestures/__tests__/fixtures/pointer-streams/ios-safari-fling.json +45 -0
  775. package/src/gestures/__tests__/fixtures/pointer-streams/ios-safari-slow.json +101 -0
  776. package/src/gestures/__tests__/fixtures/pointer-streams/ios-safari-stop-release.json +130 -0
  777. package/src/hooks/ModalAnnounceProvider.tsx +155 -0
  778. package/src/hooks/__tests__/menuLinkClicks.ts +71 -0
  779. package/src/hooks/actionGroupTracker.exports.test.ts +28 -0
  780. package/src/hooks/actionGroupTracker.test.ts +510 -0
  781. package/src/hooks/actionGroupTracker.ts +449 -0
  782. package/src/hooks/index.ts +6 -0
  783. package/src/hooks/menuPressOnItems.ts +40 -0
  784. package/src/hooks/modalAnnounce.ts +439 -0
  785. package/src/hooks/scrollGeometry.ts +71 -4
  786. package/src/hooks/useAdaptivePresentation.ts +36 -6
  787. package/src/hooks/useAnimatedLayout.doc.mjs +101 -0
  788. package/src/hooks/useAnimatedLayout.ts +61 -0
  789. package/src/hooks/useAnnounce.doc.mjs +4 -4
  790. package/src/hooks/useAnnounce.modal.test.tsx +1291 -0
  791. package/src/hooks/useAnnounce.ts +362 -10
  792. package/src/hooks/useAnnounceRenderedText.adopters.test.tsx +22 -0
  793. package/src/hooks/useBusyAnnouncement.ts +29 -50
  794. package/src/hooks/useFocusTrap.doc.mjs +3 -3
  795. package/src/hooks/useFocusTrap.test.tsx +64 -0
  796. package/src/hooks/useFocusTrap.ts +15 -8
  797. package/src/hooks/useMenuHover.ts +6 -2
  798. package/src/hooks/usePressFeedback.doc.mjs +4 -4
  799. package/src/hooks/usePressFeedback.ts +5 -2
  800. package/src/hooks/useScrollableArea.test.tsx +185 -3
  801. package/src/hooks/useScrollableArea.ts +81 -7
  802. package/src/i18n/generated-locales/en.generated.ts +35 -0
  803. package/src/i18n/generated-locales/pseudo.generated.ts +37 -0
  804. package/src/internal/tokenizer-presentation.test.ts +29 -0
  805. package/src/internal/tokenizer-presentation.ts +25 -0
  806. package/src/internal/touch.test.ts +44 -0
  807. package/src/internal/touch.ts +41 -0
  808. package/src/motion/LayoutChangeSnapshot.tsx +50 -0
  809. package/src/motion/MEASUREMENTS.md +21 -21
  810. package/src/motion/README.md +130 -17
  811. package/src/motion/__tests__/animatedLayout.interaction.browser.spec.ts +1613 -0
  812. package/src/motion/__tests__/animatedLayoutAdopters.interaction.browser.spec.ts +217 -0
  813. package/src/motion/__tests__/animatedLayoutBundle.ts +17 -0
  814. package/src/motion/animatedLayout.boundary.test.ts +155 -0
  815. package/src/motion/animatedLayout.swap.test.ts +827 -0
  816. package/src/motion/animatedLayout.test.ts +1154 -0
  817. package/src/motion/animatedLayout.ts +1801 -0
  818. package/src/motion/animatedLayoutAdopters.test.tsx +500 -0
  819. package/src/motion/animator.test.ts +2653 -0
  820. package/src/motion/animator.ts +2794 -0
  821. package/src/motion/bezier.test.ts +52 -0
  822. package/src/motion/bezier.ts +64 -0
  823. package/src/motion/coast.test.ts +99 -0
  824. package/src/motion/coast.ts +150 -0
  825. package/src/motion/projection.test.ts +2 -34
  826. package/src/motion/projection.ts +5 -37
  827. package/src/motion/reducedMotion.stylex.ts +41 -0
  828. package/src/motion/reducedMotion.test.ts +129 -0
  829. package/src/motion/reducedMotion.ts +94 -0
  830. package/src/motion/reducedMotionPlan.test.ts +182 -0
  831. package/src/motion/reducedMotionPlan.ts +263 -0
  832. package/src/motion/resolveSnapPoint.test.ts +189 -0
  833. package/src/motion/resolveSnapPoint.ts +169 -0
  834. package/src/motion/roleValue.ts +105 -0
  835. package/src/motion/roles.test.ts +256 -0
  836. package/src/motion/roles.ts +262 -0
  837. package/src/motion/selectPage.test.ts +31 -0
  838. package/src/motion/selectPage.ts +55 -0
  839. package/src/motion/transientCopy.ts +374 -0
  840. package/src/motion/uikit/index.ts +42 -5
  841. package/src/motion/uikit/navigation.ts +10 -0
  842. package/src/motion/uikit/scroll.ts +20 -3
  843. package/src/motion/uikit/springRows.test.ts +71 -0
  844. package/src/motion/uikit/springs.ts +470 -286
  845. package/src/motion/uikit/timing.ts +73 -25
  846. package/src/motion/uikit/uikit.test.ts +77 -14
  847. package/src/theme/defineTheme.test.ts +235 -2
  848. package/src/theme/defineTheme.ts +231 -19
  849. package/src/theme/derivedVarRegistry.test.ts +25 -0
  850. package/src/theme/derivedVarRegistry.ts +4 -0
  851. package/src/theme/expandMotionScale.test.ts +17 -0
  852. package/src/theme/extensibleAxes.test.ts +74 -29
  853. package/src/theme/syntax/SyntaxTheme.tsx +1 -1
  854. package/src/theme/syntax/defineSyntaxTheme.ts +1 -1
  855. package/src/theme/syntax/presets.ts +1 -1
  856. package/src/theme/syntax/tokens.ts +1 -1
  857. package/src/theme/tokens.stylex.ts +5 -0
  858. package/src/theme/tokens.test.ts +15 -0
  859. package/src/theme/useTheme.ts +10 -4
  860. package/src/utils/focusReturn.ts +17 -6
  861. package/src/utils/hitArea.test.ts +628 -0
  862. package/src/utils/hitArea.ts +770 -0
  863. package/src/utils/interactionModality.test.ts +45 -1
  864. package/src/utils/interactionModality.ts +64 -5
  865. package/src/utils/interactionOverlay.stylex.ts +4 -1
  866. package/src/utils/pressFeedback.test.ts +310 -2
  867. package/src/utils/pressFeedback.ts +306 -54
  868. package/src/utils/pressGesture.test.ts +50 -0
  869. package/src/utils/pressGesture.ts +40 -2
package/CHANGELOG.md CHANGED
@@ -58,7 +58,7 @@ Thanks to everyone who contributed to this release:
58
58
 
59
59
  #### Fixes
60
60
 
61
- - `TimeInput`'s arrow keys ignore a fractional increment instead of writing a malformed time such as "14:30.5": `adjustTime` returns the time unchanged for a fractional minute delta ([#7823](https://github.com/facebook/astryx/pull/7823)).
61
+ - `TimeInput`'s arrow keys ignore a fractional increment instead of writing a malformed time such as "14:30.5": `adjustTime` returns the time unchanged for a fractional minute delta ([#7823](https://github.com/meta/astryx/pull/7823)).
62
62
  - Screen readers now announce a `Button` that is first rendered with `isLoading` (for example after a remount). Its visually hidden loading live region mounts empty and gets "Loading" on the next frame, because screen readers skip a live region that already holds its text when it appears. A Button that becomes loading after it mounts is unchanged, and a Button mounted idle does no extra render.
63
63
  - `ChatComposer`: screen readers now announce a status message, errors assertively and warnings politely, once per occasion: a rerender does not repeat it, and a status that clears and then returns is announced again. Before, the status bar mounted as a `role="alert"` or `role="status"` region already holding its text, which screen readers often skip. The message now goes through the shared announcement channel, and the visible bar no longer carries a live role. No API changes.
64
64
  - `ChatSystemMessage`: a new chat notice inside a `ChatMessageList` now has one live region announcing it, the list's polite log, instead of also being a second live region nested in it (WCAG 2.2 SC 4.1.3). Its root no longer forces `role="status"`, in either variant, so date and divider rows are no longer presented as status messages, and a `role` passed to the component reaches its root. Tests that found a system message by the `status` role should query it by its text instead.
@@ -67,12 +67,12 @@ Thanks to everyone who contributed to this release:
67
67
  - Keyboard and screen-reader users can now reach a disabled `ComplexSelector` and hear that it is unavailable (WCAG 2.2 SC 2.1.1 and 4.1.2). Before, its trigger rendered the native `disabled` attribute, so Tab skipped it and a focused trigger lost focus when disabled; now it exposes `aria-disabled="true"`, keeps focus, shows its keyboard focus outline, and still opens nothing. A press or key on it reaches no handler: not the toggle, not a caller's `onClick` or `onKeyDown`, and not an ancestor's click handler.
68
68
  - Keyboard and screen-reader users can now reach a disabled `Calendar` day or `Pagination` dot and hear that it is disabled. Disabled `TreeList` rows' expand toggle and action button, disabled `Pagination` dots and disabled `Calendar` days expose `aria-disabled="true"` instead of the native `disabled` attribute, while clicks, Enter and Space still do nothing and arrow keys still skip disabled days as before. No API changes.
69
69
  - `DateInput`: keyboard and screen-reader users can now reach a disabled date field and hear that it is disabled. A disabled or busy field no longer renders native `disabled`: its input and calendar button keep their place in the focus order and expose `aria-disabled`, while typing and opening stay blocked, and a focused disabled field shows its focus ring. Tests that query a disabled DateInput with `toBeDisabled()` or `:disabled` should check `aria-disabled="true"` instead.
70
- - `DateRangeInput`: keyboard and screen-reader users can now reach a disabled field or preset and hear that it is disabled. A disabled or busy field and a disabled preset no longer render native `disabled`: the trigger, calendar button and presets keep their place in the focus order and expose `aria-disabled`, while opening and selecting stay blocked, and a focused disabled field shows its focus ring. Tests that query them with `toBeDisabled()` or `:disabled` should check `aria-disabled="true"` instead ([#7866](https://github.com/facebook/astryx/pull/7866)).
70
+ - `DateRangeInput`: keyboard and screen-reader users can now reach a disabled field or preset and hear that it is disabled. A disabled or busy field and a disabled preset no longer render native `disabled`: the trigger, calendar button and presets keep their place in the focus order and expose `aria-disabled`, while opening and selecting stay blocked, and a focused disabled field shows its focus ring. Tests that query them with `toBeDisabled()` or `:disabled` should check `aria-disabled="true"` instead ([#7866](https://github.com/meta/astryx/pull/7866)).
71
71
  - `DateTimeInput`: keyboard and screen-reader users can now reach a disabled or busy field and hear that it is disabled. It no longer renders native `disabled` on its text, native-picker or touch fields, or on its calendar and clock buttons: they keep their place in the focus order and expose `aria-disabled`, while typing, picking, opening and a caller's `onClick` stay blocked, and a focused disabled field shows its focus ring. `TimeInput`'s native picker button, which shares the time segment and stays out of the tab order, also moves from `disabled` to `aria-disabled` and stays inert. Tests that query a disabled DateTimeInput with `toBeDisabled()` or `:disabled` should check `aria-disabled="true"` instead.
72
72
  - Apps that use Core's prebuilt CSS without a StyleX build step now get the default data colors: the prebuilt CSS defines the canonical `dataVars` defaults, so compiled imports and raw CSS references paint correctly.
73
73
  - `Dialog`, `BottomSheet` and `BottomSheetSwitcher` stay open when a file picker inside them is dismissed. A file input fires a bubbling `cancel` event when its picker closes without a choice, and all three took that event for a close request of their own and closed (a switcher closed its whole flow). They now act only on a `cancel` aimed at their own `<dialog>`, so Escape and platform close requests (the Android back gesture) behave as before. No API changes.
74
74
  - `DropdownMenuRadioGroup` now forwards `ref`, and its docs explain controlled selection, how to name the group, when the menu closes, and how it composes inside a `DropdownMenu`.
75
- - `astryx init` writes the agent docs at the project root, in files the project commits, so Codex, Gemini CLI, Copilot CLI and Claude Code all read the block from the project root or any folder below it ([#7497](https://github.com/facebook/astryx/pull/7497)). It no longer writes agent docs into a project's subfolder, the home folder, or a settings folder in it such as `~/.gemini`.
75
+ - `astryx init` writes the agent docs at the project root, in files the project commits, so Codex, Gemini CLI, Copilot CLI and Claude Code all read the block from the project root or any folder below it ([#7497](https://github.com/meta/astryx/pull/7497)). It no longer writes agent docs into a project's subfolder, the home folder, or a settings folder in it such as `~/.gemini`.
76
76
  - `AGENTS.md` holds the block, created when missing. Before, a project with only `CLAUDE.md` got the block only there, so Codex and Gemini CLI never saw it.
77
77
  - Claude Code skips `AGENTS.md` in a folder that has a `CLAUDE.md` or `.claude/CLAUDE.md`, so the Claude Code file the project already has keeps a full copy: root `CLAUDE.md`, else `.claude/CLAUDE.md`. It keeps the copy even when it imports `AGENTS.md`, because Claude Code does not follow that import in a session started in a subfolder; started at the root, Claude Code then reads two. When both exist, the copy goes in root `CLAUDE.md`, which projects commit even when they ignore `.claude/`, and a block in `.claude/CLAUDE.md` is removed. Init creates no Claude file. `astryx upgrade` refreshes every copy, except in a project at the top of a home settings folder (see the next entry).
78
78
  - Gemini CLI reads only `GEMINI.md`: init adds a one-line import, `@./AGENTS.md`, creating `GEMINI.md` when it is missing. It adds none when `GEMINI.md` already imports `AGENTS.md`, inline or on its own line. It adds the import even when the project's `.gemini/settings.json` has Gemini read `AGENTS.md` through `context.fileName`: Gemini loads those settings only when it starts at the project root, so a session started in a subfolder would otherwise get no copy. Started at the root, Gemini then reads two.
@@ -95,18 +95,18 @@ Thanks to everyone who contributed to this release:
95
95
  - `Selector` options in a narrow list now shrink and truncate a long label with an ellipsis instead of being clipped past the list edge.
96
96
  - `Switch`: a busy switch announces "Loading" once per busy start. Under React StrictMode the announcement used to be made twice.
97
97
  - `TimeInput`: keyboard and screen-reader users can now reach a disabled field, or a busy bottom-sheet field, and hear that it is disabled. It no longer renders native `disabled` on its typed, native-picker or touch input or its picker button: they keep their place in the focus order and expose `aria-disabled`, while typing, arrow-key adjustment, opening, submitting a surrounding form with Enter, and a caller's `onClick` stay blocked, a draft typed before the field became disabled is dropped, and a focused disabled field shows its focus ring. Tests that query a disabled or busy TimeInput with `toBeDisabled()` or `:disabled` should check `aria-disabled="true"` instead.
98
- - Pages that use `Timestamp` with an absolute format (`date`, `time`, `date_time` and the other fixed formats) now prerender in Next.js with `cacheComponents` turned on, where they used to fail the build: `Timestamp` no longer reads the current time while rendering on the server, and absolute formats never read the clock. `relative`, `relative_short` and `auto` read the clock on the client only: a server render or static prerender shows the full date and time in UTC, labelled, and the client switches to the format's normal output right after hydration, so server and client markup now always match. Client-only rendering is unchanged. No API changes ([#7883](https://github.com/facebook/astryx/pull/7883)).
98
+ - Pages that use `Timestamp` with an absolute format (`date`, `time`, `date_time` and the other fixed formats) now prerender in Next.js with `cacheComponents` turned on, where they used to fail the build: `Timestamp` no longer reads the current time while rendering on the server, and absolute formats never read the clock. `relative`, `relative_short` and `auto` read the clock on the client only: a server render or static prerender shows the full date and time in UTC, labelled, and the client switches to the format's normal output right after hydration, so server and client markup now always match. Client-only rendering is unchanged. No API changes ([#7883](https://github.com/meta/astryx/pull/7883)).
99
99
  - `Tooltip`: moving the pointer straight from the trigger onto the tooltip in one step no longer hides it, so it stays open while hovered (WCAG 2.2 SC 1.4.13).
100
- - A `SideNavItem` in a collapsed `SideNav` now shows its tooltip on hover and gets `aria-describedby`, even when the item first appears inside an already-collapsed `SideNav`, the common case for saved collapse state. Before, only an item that collapsed after it appeared got a tooltip. Fixes [#7692](https://github.com/facebook/astryx/issues/7692).
100
+ - A `SideNavItem` in a collapsed `SideNav` now shows its tooltip on hover and gets `aria-describedby`, even when the item first appears inside an already-collapsed `SideNav`, the common case for saved collapse state. Before, only an item that collapsed after it appeared got a tooltip. Fixes [#7692](https://github.com/meta/astryx/issues/7692).
101
101
 
102
102
  A `Tooltip` with an `anchorRef` that renders inside the very element the ref points at, as `SideNavItem` does, now attaches however it mounted. The effect now re-checks the anchor once the commit has finished attaching refs; event listeners and the `aria-describedby` merge and restore are unchanged.
103
103
 
104
104
  - `TopNav` on narrow screens: a long `TopNavHeading` now gives way (it truncates with an ellipsis, or wraps when the heading is a link) instead of pushing the end content and the menu toggle past the edge of the bar, and the mobile drawer's close button is back on screen.
105
- - `Typeahead`: clearing the value while editing it now empties the input and reports `onChangeQuery('')`, instead of leaving the old label in a field with no value. Fixes [#7038](https://github.com/facebook/astryx/issues/7038).
105
+ - `Typeahead`: clearing the value while editing it now empties the input and reports `onChangeQuery('')`, instead of leaving the old label in a field with no value. Fixes [#7038](https://github.com/meta/astryx/issues/7038).
106
106
 
107
107
  #### Performance
108
108
 
109
- - Pages with many code blocks, such as a long Markdown document, paint sooner on first load: `CodeBlock` inserts its syntax-highlight rules before the first layout read instead of after it, which cut first paint by 16–19% in 100–500 KB test documents ([#7875](https://github.com/facebook/astryx/pull/7875)). The rules and the highlighted output are unchanged.
109
+ - Pages with many code blocks, such as a long Markdown document, paint sooner on first load: `CodeBlock` inserts its syntax-highlight rules before the first layout read instead of after it, which cut first paint by 16–19% in 100–500 KB test documents ([#7875](https://github.com/meta/astryx/pull/7875)). The rules and the highlighted output are unchanged.
110
110
  - Pages that update around a long `Markdown` document stay responsive: Markdown skips re-rendering its document when a parent re-renders without changing the text or any rendering prop, and a link handler passed as a new function on each render no longer forces that work. The rendered output is unchanged.
111
111
 
112
112
  #### Documentation
@@ -1362,7 +1362,7 @@ Thanks to everyone who contributed to this release:
1362
1362
 
1363
1363
  **The horizontal clip mirrors under `dir="rtl"`.** `clip-path: inset()` is physical — top/right/bottom/left, no logical form — while the row itself reverses. Left unflipped, the leading segment sits to the _right_ of the node in RTL and still clipped its right edge, so the hole opened at the join between steps instead of at the indicator. Measured before the fix: `con0 x=622, indicator x=606, clips RIGHT edge`. After: `clips LEFT edge`, with LTR unchanged. The block axis needs no handling — `dir` does not reverse it.
1364
1364
 
1365
- **One declaration covers both layers.** The gap has to reach the track (the segment's own background) and the accent fill (an absolutely placed `::before`). Spending it on each separately meant two declarations on two boxes, so a percentage resolved against a different containing block for each and stopped them ~1.2px apart. A single `clip-path: inset(…)` on the segment clips the element and its pseudo-element together against one reference box, so every accepted value behaves identically on both — which is what [#5824](https://github.com/facebook/astryx/pull/5824) requires of a public input across its full value domain. Clipping also cannot change layout, so the node the segment positions cannot move.
1365
+ **One declaration covers both layers.** The gap has to reach the track (the segment's own background) and the accent fill (an absolutely placed `::before`). Spending it on each separately meant two declarations on two boxes, so a percentage resolved against a different containing block for each and stopped them ~1.2px apart. A single `clip-path: inset(…)` on the segment clips the element and its pseudo-element together against one reference box, so every accepted value behaves identically on both — which is what [#5824](https://github.com/meta/astryx/pull/5824) requires of a public input across its full value domain. Clipping also cannot change layout, so the node the segment positions cannot move.
1366
1366
 
1367
1367
  **No indicator, no gap.** `indicator="none"` renders no node, so a gap there is a hole in a track that is meant to be continuous.
1368
1368
 
@@ -1718,7 +1718,7 @@ Thanks to everyone who contributed to this release:
1718
1718
 
1719
1719
  `MetadataListItem` targets its wrapper `<div>` when stacked and its `<dt>` when inline. A `TypeaheadItem` backed by caller-supplied `item.element` remains unchanged and does not receive forwarded props because that value may not be a cloneable element.
1720
1720
 
1721
- This completes [#5254](https://github.com/facebook/astryx/issues/5254) after [#5288](https://github.com/facebook/astryx/pull/5288) by @lexs landed `List` and `Markdown` first, followed by [#5493](https://github.com/facebook/astryx/pull/5493) by @gonzoblasco for `TreeList`.
1721
+ This completes [#5254](https://github.com/meta/astryx/issues/5254) after [#5288](https://github.com/meta/astryx/pull/5288) by @lexs landed `List` and `Markdown` first, followed by [#5493](https://github.com/meta/astryx/pull/5493) by @gonzoblasco for `TreeList`.
1722
1722
 
1723
1723
  - `Button` now reflects `elevation` as a theme target. The prop selected between four StyleX style objects but was missing from the sibling `themeProps('button')` call, so `data-elevation` never reached the DOM and no theme could style the axis — the same defect fixed on `Card` in #5491, and one `ButtonGroup` already had right. A button inside a `ButtonGroup` reports `none`, because the group owns the surface's elevation and the member paints flat. Every wrapper that forwards `ButtonProps` through to `Button` — `IconButton` — picks the reflection up with it. (`ToggleButton` does not: its props extend `BaseProps`, not `ButtonProps`, so it has no `elevation` to forward and keeps reporting `none`.) Nothing about the rendered button changes: 60 of 64 captured frames are byte-identical, and the four that differ do so only inside the loading spinner's own box. (#5552)
1724
1724
  - Calendar: announce a cleared range in the provider locale, wrap the two-month layout instead of overflowing a narrow viewport, keep the selected date visible under forced colors (#5453)
@@ -3459,7 +3459,7 @@ Thanks to everyone who contributed to this release:
3459
3459
  `height: '100%'`. With no sized parent, the skeleton collapsed to a zero-size
3460
3460
  (invisible) element. The doc now sets a `playground.defaults` of
3461
3461
  `width: 320` / `height: 80` so the shimmer placeholder renders visibly.
3462
- - Update stale `facebookexperimental/xds` doc/JSDoc links to the current `facebook/astryx` namespace in source comments (theme/syntax `@see` references). The old org 301-redirects, so these weren't broken — just stale — and this matches the canonical org used elsewhere
3462
+ - Update stale `facebookexperimental/xds` doc/JSDoc links to the then-current `facebook/astryx` namespace in source comments (theme/syntax `@see` references). The old org 301-redirects, so these weren't broken — just stale — and this matches the canonical org used elsewhere
3463
3463
  - Document Table's `verticalAlign` and `textOverflow` props, which were supported by the component but missing from the docsite properties tab
3464
3464
  - Document TabList's `layout` prop ('hug' | 'fill') for tab sizing, which was supported by the component but missing from the docsite properties tab
3465
3465
  - Document Text's `justify` prop, which was supported by the component but missing from the docsite properties tab (same omission previously fixed for Heading) (#2847-adjacent)
package/README.md CHANGED
@@ -63,13 +63,13 @@ astryx gap-report # report a missing capability
63
63
 
64
64
  | Package | Description |
65
65
  | ----------------------------------------------------------------------------------------------------- | ------------------------------------------------------------- |
66
- | [`@astryxdesign/cli`](https://github.com/facebook/astryx/tree/main/packages/cli) | CLI tooling: component docs, templates, scaffolding, codemods |
67
- | [`@astryxdesign/theme-neutral`](https://github.com/facebook/astryx/tree/main/packages/themes/neutral) | Muted, minimal theme (Lucide icons) |
66
+ | [`@astryxdesign/cli`](https://github.com/meta/astryx/tree/main/packages/cli) | CLI tooling: component docs, templates, scaffolding, codemods |
67
+ | [`@astryxdesign/theme-neutral`](https://github.com/meta/astryx/tree/main/packages/themes/neutral) | Muted, minimal theme (Lucide icons) |
68
68
 
69
69
  ## Resources
70
70
 
71
71
  - [Component Storybook](https://astryx.atmeta.com/storybook/)
72
- - [GitHub Repository](https://github.com/facebook/astryx)
72
+ - [GitHub Repository](https://github.com/meta/astryx)
73
73
 
74
74
  ---
75
75
 
@@ -28,7 +28,7 @@ import { Button } from "../Button/index.js";
28
28
  import { mergeProps } from "../utils/index.js";
29
29
  import { themeProps } from "../utils/themeProps.js";
30
30
  import { useTranslator } from "../i18n/index.js";
31
- import { useMediaQuery } from "../hooks/index.js";
31
+ import { useMediaQuery } from "../hooks/useMediaQuery.js";
32
32
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
33
33
  const SMALL_SCREEN_QUERY = '(max-width: 640px)';
34
34
  const styles = {
@@ -176,28 +176,6 @@ export interface AppShellProps extends BaseProps<HTMLDivElement> {
176
176
  */
177
177
  topNav?: ReactNode;
178
178
  }
179
- /**
180
- * Page shell for an application. Provides the structural frame for an app:
181
- * top navigation, side navigation, and main content area.
182
- *
183
- * Slot-based API with `topNav`, `sideNav`, `banner`, and `children`.
184
- * Supports two height modes (`fill` and `auto`), responsive side nav
185
- * collapse, and mobile overlay with backdrop.
186
- *
187
- * @example
188
- * ```
189
- * <AppShell
190
- * topNav={<TopNav label="Navigation" heading={<TopNavHeading heading="My App" />} />}
191
- * sideNav={<SideNav>{navSections}</SideNav>}
192
- * mobileNav={
193
- * <MobileNav isOpen={mobileOpen} onOpenChange={(open) => setMobileOpen(open)} header="My App">
194
- * {navSections}
195
- * </MobileNav>
196
- * }>
197
- * <Content />
198
- * </AppShell>
199
- * ```
200
- */
201
179
  export declare function AppShell({ variant, banner, children, contentPadding, 'data-testid': dataTestId, height, mobileNav, sideNav, topNav, xstyle, className, style, ref, ...rest }: AppShellProps): React.JSX.Element;
202
180
  export declare namespace AppShell {
203
181
  var displayName: string;
@@ -1 +1 @@
1
- {"version":3,"file":"AppShell.d.ts","sourceRoot":"","sources":["../../src/AppShell/AppShell.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAQL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAoBf,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAChD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAQ5C,OAAO,EAEL,KAAK,mBAAmB,EACzB,MAAM,2BAA2B,CAAC;AACnC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,SAAS,CAAC;AAsChD;;;GAGG;AACH,MAAM,MAAM,kBAAkB,GAAG,mBAAmB,GAAG,MAAM,CAAC;AAE9D;;;;;;;GAOG;AAEH;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,kBAAkB,CAAC;AAEvD;;;GAGG;AACH,MAAM,WAAW,eAAe;IAC9B;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAEzC;;;;OAIG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAEhC;;;;;;;;;;OAUG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,WAAW,aAAc,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC;IAE1B;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;;;;OAOG;IACH,cAAc,CAAC,EAAE,WAAW,CAAC;IAE7B;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAEzB;;;;;;;;;;;;;;;;;;;;;OAqBG;IACH,SAAS,CAAC,EAAE,KAAK,GAAG,eAAe,GAAG,SAAS,CAAC;IAEhD;;;;;;;;;;;;;;;;;;;;;;;;;OAyBG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAkLD;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,QAAQ,CAAC,EACvB,OAAoB,EACpB,MAAM,EACN,QAAQ,EACR,cAAc,EACd,aAAa,EAAE,UAAU,EACzB,MAAe,EACf,SAAS,EACT,OAAO,EACP,MAAM,EACN,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,IAAI,EACR,EAAE,aAAa,qBA0bf;yBAzce,QAAQ"}
1
+ {"version":3,"file":"AppShell.d.ts","sourceRoot":"","sources":["../../src/AppShell/AppShell.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAQL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAgCf,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAChD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAQ5C,OAAO,EAEL,KAAK,mBAAmB,EACzB,MAAM,2BAA2B,CAAC;AACnC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,SAAS,CAAC;AAsChD;;;GAGG;AACH,MAAM,MAAM,kBAAkB,GAAG,mBAAmB,GAAG,MAAM,CAAC;AAE9D;;;;;;;GAOG;AAEH;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,kBAAkB,CAAC;AAEvD;;;GAGG;AACH,MAAM,WAAW,eAAe;IAC9B;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAEzC;;;;OAIG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAEhC;;;;;;;;;;OAUG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,WAAW,aAAc,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC;IAE1B;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;;;;OAOG;IACH,cAAc,CAAC,EAAE,WAAW,CAAC;IAE7B;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAEzB;;;;;;;;;;;;;;;;;;;;;OAqBG;IACH,SAAS,CAAC,EAAE,KAAK,GAAG,eAAe,GAAG,SAAS,CAAC;IAEhD;;;;;;;;;;;;;;;;;;;;;;;;;OAyBG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAqND,wBAAgB,QAAQ,CAAC,EACvB,OAAoB,EACpB,MAAM,EACN,QAAQ,EACR,cAAc,EACd,aAAa,EAAE,UAAU,EACzB,MAAe,EACf,SAAS,EACT,OAAO,EACP,MAAM,EACN,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,IAAI,EACR,EAAE,aAAa,qBAykBf;yBAxlBe,QAAQ"}
@@ -31,6 +31,9 @@ import { LayoutContent } from "../Layout/LayoutContent.js";
31
31
  import { MobileNavToggle } from "../MobileNav/MobileNavToggle.js";
32
32
  import { MAX_CLOSE_DELAY_MS as MOBILE_NAV_MAX_CLOSE_DELAY_MS } from "../MobileNav/MobileNav.js";
33
33
  import { SideNavRenderContext } from "../SideNav/SideNavRenderContext.js";
34
+ import { SideNavShellContext } from "../SideNav/railMotion.js";
35
+ import { useAnimatedLayout } from "../hooks/useAnimatedLayout.js";
36
+ import { holdLayoutSwap, landLayoutGlide, layoutMotionFor, playLayoutFrames, playLayoutSwap, reportLayoutChange } from "../motion/animatedLayout.js";
34
37
  import { TopNavRenderContext } from "../TopNav/TopNavRenderContext.js";
35
38
  import { TopNavMobileContentContext } from "../TopNav/TopNavMobileContentContext.js";
36
39
  import { AppShellMobileContext } from "./AppShellMobileContext.js";
@@ -229,6 +232,18 @@ const styles = {
229
232
  * </AppShell>
230
233
  * ```
231
234
  */
235
+
236
+ /**
237
+ * The column beside the rail that holds `main`: its ancestor whose parent
238
+ * also holds the rail. The glide moves it; the rail's edge rides it.
239
+ */
240
+ function columnOf(main, rail) {
241
+ let column = main;
242
+ while (column.parentElement != null && !column.parentElement.contains(rail)) {
243
+ column = column.parentElement;
244
+ }
245
+ return column;
246
+ }
232
247
  export function AppShell({
233
248
  variant = 'elevated',
234
249
  banner,
@@ -437,6 +452,139 @@ export function AppShell({
437
452
  }) : undefined;
438
453
 
439
454
  // =========================================================================
455
+ // While the inline side nav collapses or expands, the content area holds
456
+ // its own animated layout handle (`component:AppShell` FR17): the column
457
+ // beside the rail glides from its old place, and the content swaps its old
458
+ // wrap for its new one in place (`spec:AST-105` FR8), on the rail's clock
459
+ // (`component:SideNav` FR6).
460
+ const railRef = useRef(null);
461
+ const mainRef = useRef(null);
462
+ const backdropRef = useRef(null);
463
+ const contentLayout = useAnimatedLayout({
464
+ containerRef: shellRef
465
+ });
466
+ const pendingContentRef = useRef(null);
467
+ // The running swap: when it started and its wraps' starting opacities, so a
468
+ // change made during it starts its cross-fade from what the content shows.
469
+ const lastSwapRef = useRef(null);
470
+ const sideNavShell = useMemo(() => ({
471
+ animatedLayout: contentLayout,
472
+ rail: () => railRef.current,
473
+ column: () => mainRef.current == null ? null : columnOf(mainRef.current, railRef.current),
474
+ landContent() {
475
+ if (mainRef.current != null) {
476
+ landLayoutGlide(columnOf(mainRef.current, railRef.current));
477
+ }
478
+ },
479
+ beforeRailChange() {
480
+ const main = mainRef.current;
481
+ if (main == null) {
482
+ return;
483
+ }
484
+ const motion = layoutMotionFor(main);
485
+ // Only a spring glides the column; under Reduce Motion the two wraps
486
+ // cross-fade over a steady surface (`design:reduced-motion` DR2).
487
+ let change = null;
488
+ if (motion.kind === 'spring') {
489
+ change = reportLayoutChange(contentLayout, railRef);
490
+ change.measureBefore();
491
+ }
492
+ // At rest the copy (the wrap shown now) starts opaque and the entering
493
+ // wrap unseen; mid-swap the wrap in the DOM is the entering one and
494
+ // the copy's wrap is the one entering next, each at what it shows.
495
+ let held = 1;
496
+ let entering = 0;
497
+ const last = lastSwapRef.current;
498
+ if (last != null && motion.kind === 'spring') {
499
+ const elapsed = Number(main.ownerDocument.timeline?.currentTime ?? 0) - last.startedAt;
500
+ if (elapsed < motion.progress.durationMs) {
501
+ const p = 1 - motion.progress.remaining(elapsed);
502
+ held = last.entering + (1 - last.entering) * p;
503
+ entering = last.held * (1 - p);
504
+ }
505
+ }
506
+ lastSwapRef.current = null;
507
+ pendingContentRef.current = {
508
+ change,
509
+ swap: holdLayoutSwap(contentLayout, main, {
510
+ isVisiblePart: true
511
+ }),
512
+ before: main.getBoundingClientRect(),
513
+ held,
514
+ entering
515
+ };
516
+ },
517
+ afterRailChange() {
518
+ const pending = pendingContentRef.current;
519
+ pendingContentRef.current = null;
520
+ const main = mainRef.current;
521
+ if (pending == null || main == null) {
522
+ return () => {};
523
+ }
524
+ pending.change?.animate();
525
+ // The column beside the rail, which the glide moves: the copy sits
526
+ // beside it, in its parent, and rides its glide.
527
+ const column = columnOf(main, railRef.current);
528
+ const after = main.getBoundingClientRect();
529
+ const isRtl = getComputedStyle(main).direction === 'rtl';
530
+ const travel = isRtl ? pending.before.right - after.right : pending.before.left - after.left;
531
+ // An expand slides the narrower column in from its old start, which
532
+ // opens a gap at its trailing edge: the content surface (the elevated
533
+ // backdrop, or the main element) reaches over it as it closes,
534
+ // whether or not the old wrap is held.
535
+ const cover = [];
536
+ const surface = backdropRef.current ?? main;
537
+ const color = getComputedStyle(surface).backgroundColor;
538
+ const isPainted = !/^rgba\(.*,\s*0\)$|^transparent$/.test(color);
539
+ const glides = layoutMotionFor(main).kind === 'spring';
540
+ if ((isRtl ? travel > 0 : travel < 0) && glides && isPainted) {
541
+ cover.push({
542
+ element: surface,
543
+ frames: p => ({
544
+ boxShadow: `${-travel * (1 - p)}px 0px 0px 0px ${color}`
545
+ })
546
+ });
547
+ }
548
+ if (pending.swap == null || column.parentElement == null) {
549
+ return playLayoutFrames(contentLayout, cover);
550
+ }
551
+ // Under Reduce Motion nothing glides: the old wrap's copy paints the
552
+ // surface it sat on, so that surface fades out with it where it was
553
+ // (`design:reduced-motion` DR2) instead of leaving a bare strip.
554
+ if (!glides && isPainted) {
555
+ pending.swap.copy.style.backgroundColor = color;
556
+ }
557
+ const {
558
+ held,
559
+ entering
560
+ } = pending;
561
+ lastSwapRef.current = {
562
+ startedAt: Number(main.ownerDocument.timeline?.currentTime ?? 0),
563
+ held,
564
+ entering
565
+ };
566
+ return playLayoutSwap(pending.swap, {
567
+ host: column.parentElement,
568
+ copy: p => ({
569
+ opacity: held * (1 - p)
570
+ }),
571
+ rideWith: {
572
+ element: column,
573
+ travel: {
574
+ x: travel,
575
+ y: 0
576
+ }
577
+ },
578
+ incoming: [...Array.from(main.children, element => ({
579
+ element,
580
+ frames: p => ({
581
+ opacity: entering + (1 - entering) * p
582
+ })
583
+ })), ...cover]
584
+ });
585
+ }
586
+ }), [contentLayout]);
587
+
440
588
  // Build sideNav content
441
589
  //
442
590
  // In auto mode, the sideNav panel is not internally scrollable (the page
@@ -445,6 +593,7 @@ export function AppShell({
445
593
  // the sticky behavior since LayoutPanel doesn't accept style/className.
446
594
  // =========================================================================
447
595
  const sideNavPanel = showSideNavInline ? /*#__PURE__*/_jsx(LayoutPanel, {
596
+ ref: railRef,
448
597
  padding: 0,
449
598
  hasDivider: navHasDividers,
450
599
  isScrollable: isFill,
@@ -452,7 +601,10 @@ export function AppShell({
452
601
  variant
453
602
  }),
454
603
  xstyle: [navAreaStyle, isAuto && stickyBgStyle, isAuto && styles.panelAutoFill],
455
- children: sideNav
604
+ children: /*#__PURE__*/_jsx(SideNavShellContext, {
605
+ value: sideNavShell,
606
+ children: sideNav
607
+ })
456
608
  }) : undefined;
457
609
  const sideNavContent = sideNavPanel != null && isAuto ? /*#__PURE__*/_jsx("div", {
458
610
  ...{
@@ -466,6 +618,7 @@ export function AppShell({
466
618
  // =========================================================================
467
619
  const shouldElevateWithCorner = isElevated && hasTopNav && showSideNavInline;
468
620
  const mainInner = /*#__PURE__*/_jsx(LayoutContent, {
621
+ ref: mainRef,
469
622
  padding: contentPadding ?? 0,
470
623
  role: "main",
471
624
  id: MAIN_CONTENT_ID
@@ -490,6 +643,7 @@ export function AppShell({
490
643
  }
491
644
  }[!!shouldElevateWithCorner << 0],
492
645
  children: [shouldElevateWithCorner && /*#__PURE__*/_jsx("div", {
646
+ ref: backdropRef,
493
647
  ...{
494
648
  className: "x10l6tqk x10a8y8t x10xzikg x183tx6i x47corl"
495
649
  }
@@ -8,6 +8,7 @@
8
8
  * - Banner frame (themeProps 'banner-frame'): owns the resting elevation and,
9
9
  * for elevated card banners, the outer radius that shapes that shadow
10
10
  * - Header area (themeProps 'banner'): colored status background with icon, title, description, actions, dismiss
11
+ * - End area restores the ordinary text context for consumer `endContent`; built-in controls opt back into the status foreground
11
12
  * - Content area (themeProps 'banner-content'): card background for additional content (children)
12
13
  * - Status icon (themeProps 'banner-icon'): the target rides on the default
13
14
  * <Icon> itself — the element that paints — so 'status:X' overrides reach
@@ -1 +1 @@
1
- {"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../src/Banner/Banner.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8CG;AAEH,OAAO,EAA0B,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAE9D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgB5C,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,+BAA+B,CAAC;AAErE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAI9C,OAAO,KAAK,EAAC,eAAe,EAAE,kBAAkB,EAAC,MAAM,SAAS,CAAC;AAMjE;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG,MAAM,eAAe,CAAC;AAEjD;;;;;;GAMG;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,kBAAkB,CAAC;AAEvD,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,MAAM,EAAE,YAAY,CAAC;IACrB;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;;;;;;;;OAWG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;;;;;;;;;;;;;;;OAkBG;IACH,WAAW,CAAC,EAAE,OAAO,GAAG,iBAAiB,CAAC;IAC1C;;;;OAIG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAwQD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoDG;AACH,wBAAgB,MAAM,CAAC,EACrB,MAAM,EACN,KAAK,EACL,WAAW,EACX,IAAI,EACJ,aAAqB,EACrB,SAAS,EACT,YAAY,EACZ,UAAU,EACV,SAAkB,EAClB,SAAkB,EAClB,WAAkB,EAClB,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,cAAc,EACd,oBAAoB,EACpB,GAAG,IAAI,EACR,EAAE,WAAW,sCAqQb;yBAzRe,MAAM"}
1
+ {"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../src/Banner/Banner.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;AAEH,OAAO,EAA0B,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAE9D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgB5C,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,+BAA+B,CAAC;AAErE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAI9C,OAAO,KAAK,EAAC,eAAe,EAAE,kBAAkB,EAAC,MAAM,SAAS,CAAC;AAMjE;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG,MAAM,eAAe,CAAC;AAEjD;;;;;;GAMG;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,kBAAkB,CAAC;AAEvD,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,MAAM,EAAE,YAAY,CAAC;IACrB;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;;;;;;;;OAWG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;;;;;;;;;;;;;;;OAkBG;IACH,WAAW,CAAC,EAAE,OAAO,GAAG,iBAAiB,CAAC;IAC1C;;;;OAIG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AA4QD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoDG;AACH,wBAAgB,MAAM,CAAC,EACrB,MAAM,EACN,KAAK,EACL,WAAW,EACX,IAAI,EACJ,aAAqB,EACrB,SAAS,EACT,YAAY,EACZ,UAAU,EACV,SAAkB,EAClB,SAAkB,EAClB,WAAkB,EAClB,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,cAAc,EACd,oBAAoB,EACpB,GAAG,IAAI,EACR,EAAE,WAAW,sCAqQb;yBAzRe,MAAM"}
@@ -12,6 +12,7 @@
12
12
  * - Banner frame (themeProps 'banner-frame'): owns the resting elevation and,
13
13
  * for elevated card banners, the outer radius that shapes that shadow
14
14
  * - Header area (themeProps 'banner'): colored status background with icon, title, description, actions, dismiss
15
+ * - End area restores the ordinary text context for consumer `endContent`; built-in controls opt back into the status foreground
15
16
  * - Content area (themeProps 'banner-content'): card background for additional content (children)
16
17
  * - Status icon (themeProps 'banner-icon'): the target rides on the default
17
18
  * <Icon> itself — the element that paints — so 'status:X' overrides reach
@@ -148,6 +149,7 @@ const styles = {
148
149
  kjj79g: "x13a6bvl",
149
150
  kOIVth: "x1txdalj",
150
151
  kmuXW: "x2lah0s",
152
+ kMwMTN: "x1tgivj0",
151
153
  ks0D6T: "x193iq5w",
152
154
  keTefX: "xvc5jky",
153
155
  kqGvvJ: "x81ka23",
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * @file BottomSheet.tsx
3
- * @input Uses React, StyleX, core hooks, shared layer dismissal, the modal outlet registry, the shared interaction modality, named BottomSheetPanel, BottomSheetSwitcherContext
3
+ * @input Uses React, StyleX, core hooks, shared layer dismissal, the modal outlet registry, the shared interaction modality, named BottomSheetPanel, BottomSheetSwitcherContext, BottomSheetHostContext, the private bottom-sheet stack registry
4
4
  * @output Exports BottomSheet component and BottomSheetProps
5
5
  * @position Public BottomSheet router plus private standalone/switcher hosts
6
6
  *
@@ -19,24 +19,57 @@
19
19
  * scroll is locked by the shared useScrollLock hook, as for Dialog: a
20
20
  * standalone sheet holds it while presented, a switcher holds one for the
21
21
  * whole modal flow. The remaining script is what no single dialog can
22
- * decide: gating `cancel` by `purpose` and the shared dismissal stack, and,
23
- * in a switcher, handing one scrim between two dialogs and keeping focus in
24
- * the active sheet when a retained dialog closes.
22
+ * decide: gating `cancel` by `purpose` and the shared dismissal stack, the
23
+ * stack of sheets below, and, in a switcher, handing one scrim between two
24
+ * dialogs and keeping focus in the active sheet when a retained dialog
25
+ * closes.
25
26
  *
26
- * While a standalone modal sheet is open, its dialog is the outlet that
27
- * app-global surfaces (toasts) render into (Layer/modalOutlet.ts).
27
+ * A standalone sheet also joins the private bottom-sheet stack
28
+ * (bottomSheetStack.ts) while it is presented. The stack is behaviour, not
29
+ * API: a modal sheet opened while another modal sheet is open stacks on top
30
+ * of it, the covered sheet recedes and is blocked, one scrim stays visible,
31
+ * and the native top layer is kept in open order even when several sheets
32
+ * open in one commit. A sheet rendered in another sheet's content leaves
33
+ * with its host and returns with it while its own `isOpen` is still true;
34
+ * its state is never written for it. A modal sheet on its own never
35
+ * notices the stack; when every sheet of a stack closes in one update, the
36
+ * registry returns focus once, to the bottom sheet's target, after the last
37
+ * dialog has closed.
38
+ *
39
+ * A standalone sheet closing in the same update as another standalone sheet
40
+ * opens, at the same level and from a control inside the closing sheet, is
41
+ * replaced by it: the two run the handoff a BottomSheetSwitcher runs between
42
+ * its steps (entering sheet above, retained sheet aligning down then fading,
43
+ * one steady scrim, focus into the new sheet and back to the flow's opener
44
+ * on close). The registry pairs them and drives the handoff; this host
45
+ * renders the retained panel state it reports, and reports its panel's
46
+ * motions back. Non-modal sheets (`hasScrim={false}`) are hosted as manual
47
+ * popovers so the top layer orders them, with `show()` below the Popover API
48
+ * floor; they never stack, but they replace each other the same way, and
49
+ * return focus to their opener on close only while the person is still in
50
+ * them.
51
+ *
52
+ * Every open standalone modal sheet supplies its dialog as an outlet for
53
+ * app-global surfaces (toasts) (Layer/modalOutlet.ts); the latest outlet,
54
+ * the one they render into, follows the sheet stack's order, so toasts land
55
+ * in the top sheet and return to the sheet beneath when it closes.
28
56
  *
29
57
  * SYNC: When modified, update these files to stay in sync:
30
58
  * - /packages/core/src/BottomSheet/BottomSheetPanel.tsx
31
59
  * - /packages/core/src/BottomSheet/BottomSheetEdgeTint.tsx
60
+ * - /packages/core/src/BottomSheet/BottomSheetHostContext.ts
61
+ * - /packages/core/src/BottomSheet/bottomSheetStack.ts
32
62
  * - /packages/core/src/BottomSheet/BottomSheet.doc.mjs
33
63
  * - /packages/core/src/BottomSheet/BottomSheet.test.tsx
64
+ * - /packages/core/src/BottomSheet/BottomSheetStacking.test.tsx
34
65
  * - /packages/core/src/BottomSheet/BottomSheetSwitcher.tsx
35
66
  * - /packages/core/src/BottomSheet/BottomSheetSwitcher.test.tsx
36
67
  * - /packages/core/src/Layer/layerDismissalFamilies.test.tsx
37
68
  * - /packages/core/src/Layer/layerDismissalInvariants.test.tsx
38
69
  * - /packages/core/src/Toast/ToastViewport.modalHost.test.tsx
39
70
  * - /apps/storybook/stories/BottomSheet.stories.tsx
71
+ * - /apps/storybook/stories/BottomSheetStacking.stories.tsx
72
+ * - /apps/storybook/stories/BottomSheetReplace.stories.tsx
40
73
  * - /packages/cli/assets/templates/blocks/components/BottomSheet/BottomSheetShowcase.tsx
41
74
  */
42
75
  import { type RefObject, type ReactNode } from 'react';
@@ -86,11 +119,22 @@ interface StandaloneBottomSheetProps extends BottomSheetSharedProps {
86
119
  isOpen: boolean;
87
120
  onOpenChange: (isOpen: boolean) => void;
88
121
  hasScrim?: boolean;
89
- /** Element that receives focus after the sheet closes. */
122
+ /**
123
+ * Element that receives focus after the sheet closes. For a sheet on its
124
+ * own, or the last sheet of a stack, it is always focused, wherever focus
125
+ * was. When the sheet closes with a modal sheet still open beneath it,
126
+ * focus returns into that sheet instead (to this element if it is inside
127
+ * it, else the revealed sheet's panel), because the page is still inert.
128
+ */
90
129
  finalFocusRef?: RefObject<HTMLElement | null>;
91
130
  sheetId?: never;
92
131
  }
93
132
  interface SwitcherBottomSheetProps extends BottomSheetSharedProps {
133
+ /**
134
+ * @deprecated `BottomSheetSwitcher` is deprecated; give each step its own
135
+ * standalone sheet with `isOpen` instead. Keeps working until a future
136
+ * minor release removes the switcher.
137
+ */
94
138
  sheetId: string;
95
139
  isOpen?: never;
96
140
  onOpenChange?: never;
@@ -1 +1 @@
1
- {"version":3,"file":"BottomSheet.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheet.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AAEH,OAAO,EAOL,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,WAAW,CAAC;AAC7C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAqBhD,YAAY,EAAC,iBAAiB,EAAE,oBAAoB,EAAC,MAAM,oBAAoB,CAAC;AAChF,OAAO,KAAK,EAAC,iBAAiB,EAAE,oBAAoB,EAAC,MAAM,oBAAoB,CAAC;AA2FhF,UAAU,sBAAuB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,qDAAqD;IACrD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC,sCAAsC;IACtC,KAAK,EAAE,MAAM,CAAC;IAEd,0EAA0E;IAC1E,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB,wGAAwG;IACxG,MAAM,CAAC,EAAE,iBAAiB,GAAG,MAAM,GAAG,MAAM,CAAC;IAE7C;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC,oBAAoB,CAAC,CAAC;IAEjD;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;CACzB;AAED,UAAU,0BAA2B,SAAQ,sBAAsB;IACjE,MAAM,EAAE,OAAO,CAAC;IAChB,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,0DAA0D;IAC1D,aAAa,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC9C,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB;AAED,UAAU,wBAAyB,SAAQ,sBAAsB;IAC/D,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC;CAClB;AAED,MAAM,MAAM,gBAAgB,GAC1B,0BAA0B,GAAG,wBAAwB,CAAC;AAukBxD;;;GAGG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,+BA6BlD;yBA7Be,WAAW"}
1
+ {"version":3,"file":"BottomSheet.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheet.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyEG;AAEH,OAAO,EAOL,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,WAAW,CAAC;AAC7C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAsDhD,YAAY,EAAC,iBAAiB,EAAE,oBAAoB,EAAC,MAAM,oBAAoB,CAAC;AAChF,OAAO,KAAK,EAAC,iBAAiB,EAAE,oBAAoB,EAAC,MAAM,oBAAoB,CAAC;AAsJhF,UAAU,sBAAuB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,qDAAqD;IACrD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC,sCAAsC;IACtC,KAAK,EAAE,MAAM,CAAC;IAEd,0EAA0E;IAC1E,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB,wGAAwG;IACxG,MAAM,CAAC,EAAE,iBAAiB,GAAG,MAAM,GAAG,MAAM,CAAC;IAE7C;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC,oBAAoB,CAAC,CAAC;IAEjD;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;CACzB;AAED,UAAU,0BAA2B,SAAQ,sBAAsB;IACjE,MAAM,EAAE,OAAO,CAAC;IAChB,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC9C,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB;AAED,UAAU,wBAAyB,SAAQ,sBAAsB;IAC/D;;;;OAIG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC;CAClB;AAED,MAAM,MAAM,gBAAgB,GAC1B,0BAA0B,GAAG,wBAAwB,CAAC;AAm0BxD;;;GAGG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,+BA6BlD;yBA7Be,WAAW"}