@astryxdesign/core 0.4.5 → 0.4.6-canary.cea9ecd

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 (538) hide show
  1. package/CHANGELOG.md +134 -0
  2. package/dist/Avatar/Avatar.d.ts +10 -5
  3. package/dist/Avatar/Avatar.d.ts.map +1 -1
  4. package/dist/Avatar/Avatar.js +139 -30
  5. package/dist/Avatar/AvatarStatusDot.d.ts +2 -1
  6. package/dist/Avatar/AvatarStatusDot.d.ts.map +1 -1
  7. package/dist/Avatar/AvatarStatusDot.js +30 -4
  8. package/dist/Avatar/AvatarStatusLabelContext.d.ts +39 -0
  9. package/dist/Avatar/AvatarStatusLabelContext.d.ts.map +1 -0
  10. package/dist/Avatar/AvatarStatusLabelContext.js +41 -0
  11. package/dist/AvatarGroup/AvatarGroup.d.ts +3 -1
  12. package/dist/AvatarGroup/AvatarGroup.d.ts.map +1 -1
  13. package/dist/AvatarGroup/AvatarGroupOverflow.d.ts.map +1 -1
  14. package/dist/AvatarGroup/AvatarGroupOverflow.js +15 -9
  15. package/dist/Blockquote/Blockquote.d.ts +4 -3
  16. package/dist/Blockquote/Blockquote.d.ts.map +1 -1
  17. package/dist/Blockquote/Blockquote.js +9 -10
  18. package/dist/BottomSheet/BottomSheetPanel.d.ts.map +1 -1
  19. package/dist/BottomSheet/BottomSheetPanel.js +21 -5
  20. package/dist/Breadcrumbs/BreadcrumbItem.d.ts.map +1 -1
  21. package/dist/Breadcrumbs/BreadcrumbItem.js +47 -34
  22. package/dist/Button/Button.d.ts.map +1 -1
  23. package/dist/Button/Button.js +7 -7
  24. package/dist/Calendar/Calendar.d.ts.map +1 -1
  25. package/dist/Calendar/Calendar.js +21 -12
  26. package/dist/Calendar/hooks/useCalendarNavigation.d.ts.map +1 -1
  27. package/dist/Calendar/hooks/useCalendarNavigation.js +8 -4
  28. package/dist/Calendar/styles.d.ts +2 -2
  29. package/dist/Calendar/styles.d.ts.map +1 -1
  30. package/dist/Calendar/styles.js +5 -5
  31. package/dist/Center/Center.d.ts +23 -1
  32. package/dist/Center/Center.d.ts.map +1 -1
  33. package/dist/Center/Center.js +12 -6
  34. package/dist/Chat/ChatComposer.d.ts.map +1 -1
  35. package/dist/Chat/ChatComposer.js +3 -3
  36. package/dist/Chat/ChatComposerDrawer.d.ts.map +1 -1
  37. package/dist/Chat/ChatComposerDrawer.js +2 -2
  38. package/dist/Chat/ChatToolCalls.d.ts.map +1 -1
  39. package/dist/Chat/ChatToolCalls.js +2 -2
  40. package/dist/Chat/useChatDictation.d.ts +1 -1
  41. package/dist/Chat/useChatDictation.d.ts.map +1 -1
  42. package/dist/Chat/useSpeechRecognition.d.ts +1 -1
  43. package/dist/Chat/useSpeechRecognition.d.ts.map +1 -1
  44. package/dist/Chat/useSpeechRecognition.js +4 -3
  45. package/dist/Chat/useTriggerMenu.d.ts.map +1 -1
  46. package/dist/Chat/useTriggerMenu.js +2 -2
  47. package/dist/CheckboxInput/CheckboxInput.d.ts.map +1 -1
  48. package/dist/CheckboxInput/CheckboxInput.js +2 -2
  49. package/dist/Citation/Citation.d.ts.map +1 -1
  50. package/dist/Citation/Citation.js +5 -5
  51. package/dist/ClickableCard/ClickableCard.d.ts.map +1 -1
  52. package/dist/ClickableCard/ClickableCard.js +4 -4
  53. package/dist/CodeBlock/CodeBlock.d.ts.map +1 -1
  54. package/dist/CodeBlock/CodeBlock.js +1 -1
  55. package/dist/Collapsible/Collapsible.d.ts.map +1 -1
  56. package/dist/Collapsible/Collapsible.js +2 -2
  57. package/dist/CommandPalette/CommandPaletteItem.d.ts.map +1 -1
  58. package/dist/CommandPalette/CommandPaletteItem.js +3 -3
  59. package/dist/ComplexSelector/ComplexSelector.d.ts.map +1 -1
  60. package/dist/ComplexSelector/ComplexSelector.js +6 -6
  61. package/dist/DateInput/DateInput.d.ts +31 -2
  62. package/dist/DateInput/DateInput.d.ts.map +1 -1
  63. package/dist/DateInput/DateInput.js +90 -22
  64. package/dist/DateInput/MonthScroller.d.ts +35 -0
  65. package/dist/DateInput/MonthScroller.d.ts.map +1 -0
  66. package/dist/DateInput/MonthScroller.js +658 -0
  67. package/dist/DateInput/MonthYearWheels.d.ts +24 -0
  68. package/dist/DateInput/MonthYearWheels.d.ts.map +1 -0
  69. package/dist/DateInput/MonthYearWheels.js +114 -0
  70. package/dist/DateInput/TouchDateField.d.ts +10 -0
  71. package/dist/DateInput/TouchDateField.d.ts.map +1 -0
  72. package/dist/DateInput/TouchDateField.js +810 -0
  73. package/dist/DateInput/Wheel.d.ts +41 -0
  74. package/dist/DateInput/Wheel.d.ts.map +1 -0
  75. package/dist/DateInput/Wheel.js +315 -0
  76. package/dist/DateInput/monthGeometry.d.ts +65 -0
  77. package/dist/DateInput/monthGeometry.d.ts.map +1 -0
  78. package/dist/DateInput/monthGeometry.js +98 -0
  79. package/dist/DateInput/tokens.stylex.d.ts +63 -0
  80. package/dist/DateInput/tokens.stylex.d.ts.map +1 -0
  81. package/dist/DateInput/tokens.stylex.js +74 -0
  82. package/dist/DateInput/useOwnScrollGesture.d.ts +41 -0
  83. package/dist/DateInput/useOwnScrollGesture.d.ts.map +1 -0
  84. package/dist/DateInput/useOwnScrollGesture.js +202 -0
  85. package/dist/DateInput/usePointerDragScroll.d.ts +15 -0
  86. package/dist/DateInput/usePointerDragScroll.d.ts.map +1 -0
  87. package/dist/DateInput/usePointerDragScroll.js +216 -0
  88. package/dist/DateInput/useScrollSettle.d.ts +26 -0
  89. package/dist/DateInput/useScrollSettle.d.ts.map +1 -0
  90. package/dist/DateInput/useScrollSettle.js +149 -0
  91. package/dist/DateRangeInput/DateRangeInput.d.ts.map +1 -1
  92. package/dist/DateRangeInput/DateRangeInput.js +17 -14
  93. package/dist/DateTimeInput/DateTimeInput.d.ts.map +1 -1
  94. package/dist/DateTimeInput/DateTimeInput.js +17 -14
  95. package/dist/Dialog/Dialog.d.ts.map +1 -1
  96. package/dist/Dialog/Dialog.js +3 -3
  97. package/dist/DropdownMenu/DropdownMenuCheckboxItem.d.ts.map +1 -1
  98. package/dist/DropdownMenu/DropdownMenuCheckboxItem.js +2 -2
  99. package/dist/DropdownMenu/DropdownMenuItem.d.ts.map +1 -1
  100. package/dist/DropdownMenu/DropdownMenuItem.js +2 -2
  101. package/dist/DropdownMenu/DropdownMenuRadioItem.d.ts.map +1 -1
  102. package/dist/DropdownMenu/DropdownMenuRadioItem.js +2 -2
  103. package/dist/DropdownMenu/DropdownMenuSubMenu.d.ts.map +1 -1
  104. package/dist/DropdownMenu/DropdownMenuSubMenu.js +2 -2
  105. package/dist/Field/FieldLabel.d.ts.map +1 -1
  106. package/dist/Field/FieldLabel.js +4 -4
  107. package/dist/Field/InputClearButton.d.ts.map +1 -1
  108. package/dist/Field/InputClearButton.js +6 -0
  109. package/dist/Field/inputStyles.stylex.d.ts +1 -1
  110. package/dist/Field/inputStyles.stylex.d.ts.map +1 -1
  111. package/dist/Field/inputStyles.stylex.js +5 -5
  112. package/dist/FileInput/FileInput.d.ts.map +1 -1
  113. package/dist/FileInput/FileInput.js +6 -6
  114. package/dist/HoverCard/HoverCard.d.ts +13 -3
  115. package/dist/HoverCard/HoverCard.d.ts.map +1 -1
  116. package/dist/HoverCard/HoverCard.js +2 -0
  117. package/dist/HoverCard/index.d.ts +1 -1
  118. package/dist/HoverCard/index.d.ts.map +1 -1
  119. package/dist/HoverCard/useHoverCard.d.ts +17 -2
  120. package/dist/HoverCard/useHoverCard.d.ts.map +1 -1
  121. package/dist/HoverCard/useHoverCard.js +78 -9
  122. package/dist/InputGroup/InputGroup.js +1 -1
  123. package/dist/Item/Item.d.ts +9 -1
  124. package/dist/Item/Item.d.ts.map +1 -1
  125. package/dist/Item/Item.js +52 -14
  126. package/dist/Layer/index.d.ts +4 -2
  127. package/dist/Layer/index.d.ts.map +1 -1
  128. package/dist/Layer/index.js +2 -0
  129. package/dist/Layer/useLayer.d.ts.map +1 -1
  130. package/dist/Layer/useLayer.js +3 -2
  131. package/dist/Layer/useTouchTrigger.d.ts +113 -0
  132. package/dist/Layer/useTouchTrigger.d.ts.map +1 -0
  133. package/dist/Layer/useTouchTrigger.js +241 -0
  134. package/dist/Layout/container.stylex.d.ts +4 -2
  135. package/dist/Layout/container.stylex.d.ts.map +1 -1
  136. package/dist/Layout/container.stylex.js +19 -11
  137. package/dist/Layout/index.d.ts +1 -0
  138. package/dist/Layout/index.d.ts.map +1 -1
  139. package/dist/Layout/index.js +4 -0
  140. package/dist/Layout/padding.stylex.d.ts +315 -12
  141. package/dist/Layout/padding.stylex.d.ts.map +1 -1
  142. package/dist/Layout/padding.stylex.js +389 -12
  143. package/dist/Lightbox/Lightbox.d.ts.map +1 -1
  144. package/dist/Lightbox/Lightbox.js +5 -4
  145. package/dist/Link/Link.d.ts.map +1 -1
  146. package/dist/Link/Link.js +6 -6
  147. package/dist/MetadataList/MetadataList.d.ts.map +1 -1
  148. package/dist/MetadataList/MetadataList.js +1 -1
  149. package/dist/MobileNav/MobileNav.d.ts +1 -0
  150. package/dist/MobileNav/MobileNav.d.ts.map +1 -1
  151. package/dist/MobileNav/MobileNav.js +24 -6
  152. package/dist/MultiSelector/MultiSelector.d.ts.map +1 -1
  153. package/dist/MultiSelector/MultiSelector.js +8 -8
  154. package/dist/NavItem/navItemStyles.stylex.d.ts +4 -4
  155. package/dist/NavItem/navItemStyles.stylex.d.ts.map +1 -1
  156. package/dist/NavItem/navItemStyles.stylex.js +4 -4
  157. package/dist/NavMenu/NavHeadingMenuItem.d.ts.map +1 -1
  158. package/dist/NavMenu/NavHeadingMenuItem.js +3 -3
  159. package/dist/NumberInput/NumberInput.d.ts.map +1 -1
  160. package/dist/NumberInput/NumberInput.js +36 -8
  161. package/dist/Outline/Outline.d.ts.map +1 -1
  162. package/dist/Outline/Outline.js +3 -3
  163. package/dist/Pagination/Pagination.d.ts.map +1 -1
  164. package/dist/Pagination/Pagination.js +2 -2
  165. package/dist/PowerSearch/PowerSearch.d.ts.map +1 -1
  166. package/dist/PowerSearch/PowerSearch.js +11 -12
  167. package/dist/PowerSearch/PowerSearchToken.d.ts.map +1 -1
  168. package/dist/PowerSearch/PowerSearchToken.js +3 -1
  169. package/dist/PowerSearch/formatFilterValue.d.ts +11 -2
  170. package/dist/PowerSearch/formatFilterValue.d.ts.map +1 -1
  171. package/dist/PowerSearch/formatFilterValue.js +23 -8
  172. package/dist/RadioList/RadioListItem.d.ts +2 -2
  173. package/dist/RadioList/RadioListItem.d.ts.map +1 -1
  174. package/dist/RadioList/RadioListItem.js +70 -40
  175. package/dist/Resizable/ResizeHandle.d.ts.map +1 -1
  176. package/dist/Resizable/ResizeHandle.js +7 -7
  177. package/dist/Section/Section.d.ts +36 -1
  178. package/dist/Section/Section.d.ts.map +1 -1
  179. package/dist/Section/Section.js +12 -2
  180. package/dist/SegmentedControl/SegmentedControlItem.d.ts.map +1 -1
  181. package/dist/SegmentedControl/SegmentedControlItem.js +7 -2
  182. package/dist/SelectableCard/SelectableCard.d.ts.map +1 -1
  183. package/dist/SelectableCard/SelectableCard.js +3 -3
  184. package/dist/Selector/Selector.d.ts +26 -1
  185. package/dist/Selector/Selector.d.ts.map +1 -1
  186. package/dist/Selector/Selector.js +93 -20
  187. package/dist/Selector/SelectorOption.d.ts +14 -1
  188. package/dist/Selector/SelectorOption.d.ts.map +1 -1
  189. package/dist/Selector/SelectorOption.js +6 -0
  190. package/dist/Selector/SelectorRowLayoutContext.d.ts +8 -0
  191. package/dist/Selector/SelectorRowLayoutContext.d.ts.map +1 -0
  192. package/dist/Selector/SelectorRowLayoutContext.js +27 -0
  193. package/dist/Selector/types.d.ts +1 -0
  194. package/dist/Selector/types.d.ts.map +1 -1
  195. package/dist/SideNav/SideNavHeading.d.ts.map +1 -1
  196. package/dist/SideNav/SideNavHeading.js +4 -4
  197. package/dist/SideNav/SideNavItem.d.ts.map +1 -1
  198. package/dist/SideNav/SideNavItem.js +3 -3
  199. package/dist/Slider/Slider.d.ts.map +1 -1
  200. package/dist/Slider/Slider.js +7 -7
  201. package/dist/Stack/Stack.d.ts +23 -1
  202. package/dist/Stack/Stack.d.ts.map +1 -1
  203. package/dist/Stack/Stack.js +12 -6
  204. package/dist/Switch/Switch.d.ts.map +1 -1
  205. package/dist/Switch/Switch.js +2 -2
  206. package/dist/TabList/Tab.d.ts.map +1 -1
  207. package/dist/TabList/Tab.js +1 -1
  208. package/dist/TabList/TabMenu.d.ts.map +1 -1
  209. package/dist/TabList/TabMenu.js +3 -3
  210. package/dist/Table/TableRow.js +4 -4
  211. package/dist/Table/plugins/columnResize/useTableColumnResize.d.ts.map +1 -1
  212. package/dist/Table/plugins/columnResize/useTableColumnResize.js +1 -1
  213. package/dist/Table/plugins/filtering/useTableFiltering.d.ts.map +1 -1
  214. package/dist/Table/plugins/filtering/useTableFiltering.js +2 -2
  215. package/dist/Table/plugins/groupedRows/useTableGroupedRows.d.ts.map +1 -1
  216. package/dist/Table/plugins/groupedRows/useTableGroupedRows.js +2 -2
  217. package/dist/Table/plugins/rowExpansion/useTableRowExpansion.d.ts.map +1 -1
  218. package/dist/Table/plugins/rowExpansion/useTableRowExpansion.js +2 -2
  219. package/dist/Table/plugins/sortable/useTableSortable.d.ts.map +1 -1
  220. package/dist/Table/plugins/sortable/useTableSortable.js +1 -1
  221. package/dist/Table/plugins/sortable/useTableSortableState.d.ts +5 -3
  222. package/dist/Table/plugins/sortable/useTableSortableState.d.ts.map +1 -1
  223. package/dist/Table/plugins/sortable/useTableSortableState.js +12 -9
  224. package/dist/Table/plugins/tree/useTableTreeData.d.ts.map +1 -1
  225. package/dist/Table/plugins/tree/useTableTreeData.js +3 -3
  226. package/dist/TextArea/TextArea.js +1 -1
  227. package/dist/TextInput/TextInput.js +1 -1
  228. package/dist/Thumbnail/Thumbnail.d.ts.map +1 -1
  229. package/dist/Thumbnail/Thumbnail.js +3 -3
  230. package/dist/TimeInput/TimeInput.js +2 -2
  231. package/dist/Timestamp/Timestamp.d.ts.map +1 -1
  232. package/dist/Timestamp/Timestamp.js +6 -4
  233. package/dist/Timestamp/formatInstant.d.ts +3 -2
  234. package/dist/Timestamp/formatInstant.d.ts.map +1 -1
  235. package/dist/Timestamp/formatInstant.js +8 -8
  236. package/dist/Timestamp/tooltipEntries.d.ts +2 -1
  237. package/dist/Timestamp/tooltipEntries.d.ts.map +1 -1
  238. package/dist/Timestamp/tooltipEntries.js +5 -3
  239. package/dist/Toast/Toast.d.ts +4 -3
  240. package/dist/Toast/Toast.d.ts.map +1 -1
  241. package/dist/Toast/Toast.js +10 -7
  242. package/dist/Token/Token.d.ts.map +1 -1
  243. package/dist/Token/Token.js +6 -6
  244. package/dist/Tokenizer/Tokenizer.d.ts.map +1 -1
  245. package/dist/Tokenizer/Tokenizer.js +1 -1
  246. package/dist/Tooltip/Tooltip.d.ts +16 -3
  247. package/dist/Tooltip/Tooltip.d.ts.map +1 -1
  248. package/dist/Tooltip/Tooltip.js +2 -0
  249. package/dist/Tooltip/index.d.ts +1 -1
  250. package/dist/Tooltip/index.d.ts.map +1 -1
  251. package/dist/Tooltip/useTooltip.d.ts +21 -2
  252. package/dist/Tooltip/useTooltip.d.ts.map +1 -1
  253. package/dist/Tooltip/useTooltip.js +71 -13
  254. package/dist/TopNav/TopNavHeading.d.ts.map +1 -1
  255. package/dist/TopNav/TopNavHeading.js +4 -4
  256. package/dist/TopNav/TopNavItem.d.ts.map +1 -1
  257. package/dist/TopNav/TopNavItem.js +3 -3
  258. package/dist/TopNav/TopNavMegaMenu.d.ts.map +1 -1
  259. package/dist/TopNav/TopNavMegaMenu.js +2 -2
  260. package/dist/TopNav/TopNavMegaMenuItem.d.ts.map +1 -1
  261. package/dist/TopNav/TopNavMegaMenuItem.js +2 -2
  262. package/dist/TopNav/TopNavMenu.d.ts.map +1 -1
  263. package/dist/TopNav/TopNavMenu.js +4 -4
  264. package/dist/TreeList/TreeListItem.d.ts.map +1 -1
  265. package/dist/TreeList/TreeListItem.js +7 -7
  266. package/dist/Typeahead/BaseTypeahead.d.ts.map +1 -1
  267. package/dist/Typeahead/BaseTypeahead.js +2 -2
  268. package/dist/Typeahead/Typeahead.d.ts.map +1 -1
  269. package/dist/Typeahead/Typeahead.js +1 -1
  270. package/dist/astryx.css +124 -62
  271. package/dist/hooks/containerReveal.stylex.d.ts.map +1 -1
  272. package/dist/hooks/containerReveal.stylex.js +18 -18
  273. package/dist/hooks/scrollbarGutter.d.ts +28 -0
  274. package/dist/hooks/scrollbarGutter.d.ts.map +1 -0
  275. package/dist/hooks/scrollbarGutter.js +103 -0
  276. package/dist/hooks/useAutoMediaMode.d.ts +31 -0
  277. package/dist/hooks/useAutoMediaMode.d.ts.map +1 -0
  278. package/dist/hooks/useAutoMediaMode.js +201 -0
  279. package/dist/hooks/useInputStatusIcon.d.ts.map +1 -1
  280. package/dist/hooks/useInputStatusIcon.js +1 -1
  281. package/dist/hooks/useListFocus.d.ts +5 -2
  282. package/dist/hooks/useListFocus.d.ts.map +1 -1
  283. package/dist/hooks/useListFocus.js +12 -6
  284. package/dist/hooks/useScrollLock.d.ts +4 -0
  285. package/dist/hooks/useScrollLock.d.ts.map +1 -1
  286. package/dist/hooks/useScrollLock.js +13 -1
  287. package/dist/i18n/InternationalizationContext.d.ts.map +1 -1
  288. package/dist/i18n/InternationalizationContext.js +2 -0
  289. package/dist/i18n/index.d.ts +6 -0
  290. package/dist/i18n/index.d.ts.map +1 -1
  291. package/dist/i18n/index.js +6 -0
  292. package/dist/i18n/useCollator.d.ts +12 -0
  293. package/dist/i18n/useCollator.d.ts.map +1 -0
  294. package/dist/i18n/useCollator.js +40 -0
  295. package/dist/i18n/useLocale.d.ts +3 -0
  296. package/dist/i18n/useLocale.d.ts.map +1 -0
  297. package/dist/i18n/useLocale.js +31 -0
  298. package/dist/theme/MediaTheme.d.ts +25 -5
  299. package/dist/theme/MediaTheme.d.ts.map +1 -1
  300. package/dist/theme/MediaTheme.js +31 -6
  301. package/dist/theme/defineTheme.d.ts +5 -0
  302. package/dist/theme/defineTheme.d.ts.map +1 -1
  303. package/dist/theme/defineTheme.js +5 -0
  304. package/dist/theme/derivedVarRegistry.d.ts.map +1 -1
  305. package/dist/theme/derivedVarRegistry.js +7 -0
  306. package/dist/theme/generateThemeRules.d.ts.map +1 -1
  307. package/dist/theme/generateThemeRules.js +66 -5
  308. package/dist/theme/index.d.ts +1 -1
  309. package/dist/theme/index.d.ts.map +1 -1
  310. package/dist/theme/syntax/index.d.ts +6 -0
  311. package/dist/theme/syntax/index.d.ts.map +1 -1
  312. package/dist/theme/syntax/index.js +7 -2
  313. package/dist/utils/dateParser.d.ts +4 -3
  314. package/dist/utils/dateParser.d.ts.map +1 -1
  315. package/dist/utils/dateParser.js +8 -8
  316. package/dist/utils/index.d.ts +1 -1
  317. package/dist/utils/index.d.ts.map +1 -1
  318. package/dist/utils/index.js +1 -1
  319. package/dist/utils/plainDate.d.ts +5 -2
  320. package/dist/utils/plainDate.d.ts.map +1 -1
  321. package/dist/utils/plainDate.js +20 -4
  322. package/locales/en.json +28 -0
  323. package/locales/pseudo.json +21 -0
  324. package/package.json +3 -3
  325. package/src/Avatar/Avatar.doc.mjs +10 -6
  326. package/src/Avatar/Avatar.test.tsx +219 -1
  327. package/src/Avatar/Avatar.tsx +179 -37
  328. package/src/Avatar/AvatarStatusDot.tsx +30 -4
  329. package/src/Avatar/AvatarStatusLabelContext.ts +47 -0
  330. package/src/AvatarGroup/AvatarGroup.doc.mjs +10 -6
  331. package/src/AvatarGroup/AvatarGroup.test.tsx +62 -0
  332. package/src/AvatarGroup/AvatarGroup.tsx +3 -1
  333. package/src/AvatarGroup/AvatarGroupOverflow.tsx +31 -8
  334. package/src/Banner/Banner.doc.mjs +2 -0
  335. package/src/Blockquote/Blockquote.doc.mjs +30 -7
  336. package/src/Blockquote/Blockquote.test.tsx +34 -3
  337. package/src/Blockquote/Blockquote.tsx +11 -9
  338. package/src/BottomSheet/BottomSheet.doc.mjs +3 -3
  339. package/src/BottomSheet/BottomSheet.test.tsx +24 -0
  340. package/src/BottomSheet/BottomSheetPanel.test.tsx +91 -0
  341. package/src/BottomSheet/BottomSheetPanel.tsx +58 -3
  342. package/src/Breadcrumbs/BreadcrumbItem.tsx +36 -23
  343. package/src/Breadcrumbs/Breadcrumbs.doc.mjs +26 -2
  344. package/src/Breadcrumbs/Breadcrumbs.test.tsx +31 -0
  345. package/src/Button/Button.tsx +12 -9
  346. package/src/Calendar/Calendar.tsx +15 -9
  347. package/src/Calendar/hooks/useCalendarNavigation.ts +6 -4
  348. package/src/Calendar/styles.ts +8 -5
  349. package/src/Center/Center.doc.mjs +48 -0
  350. package/src/Center/Center.test.tsx +158 -0
  351. package/src/Center/Center.tsx +50 -9
  352. package/src/Chat/ChatComposer.tsx +11 -5
  353. package/src/Chat/ChatComposerDrawer.tsx +4 -1
  354. package/src/Chat/ChatToolCalls.tsx +13 -4
  355. package/src/Chat/{useChatDictation.test.ts → useChatDictation.test.tsx} +29 -14
  356. package/src/Chat/useChatDictation.ts +1 -1
  357. package/src/Chat/useSpeechRecognition.ts +5 -3
  358. package/src/Chat/useTriggerMenu.tsx +4 -1
  359. package/src/CheckboxInput/CheckboxInput.tsx +5 -2
  360. package/src/Citation/Citation.test.tsx +6 -1
  361. package/src/Citation/Citation.tsx +11 -5
  362. package/src/ClickableCard/ClickableCard.tsx +7 -4
  363. package/src/CodeBlock/CodeBlock.tsx +4 -1
  364. package/src/Collapsible/Collapsible.tsx +5 -2
  365. package/src/CommandPalette/CommandPaletteItem.tsx +6 -3
  366. package/src/ComplexSelector/ComplexSelector.doc.mjs +10 -0
  367. package/src/ComplexSelector/ComplexSelector.tsx +14 -7
  368. package/src/DateInput/DateInput.test.tsx +17 -1
  369. package/src/DateInput/DateInput.tsx +93 -21
  370. package/src/DateInput/DateInputTouch.test.tsx +2582 -0
  371. package/src/DateInput/MonthScroller.tsx +878 -0
  372. package/src/DateInput/MonthYearWheels.tsx +147 -0
  373. package/src/DateInput/TouchDateField.tsx +1223 -0
  374. package/src/DateInput/Wheel.tsx +473 -0
  375. package/src/DateInput/monthGeometry.ts +118 -0
  376. package/src/DateInput/tokens.stylex.ts +99 -0
  377. package/src/DateInput/useOwnScrollGesture.ts +227 -0
  378. package/src/DateInput/usePointerDragScroll.ts +220 -0
  379. package/src/DateInput/useScrollSettle.ts +164 -0
  380. package/src/DateRangeInput/DateRangeInput.doc.mjs +1 -1
  381. package/src/DateRangeInput/DateRangeInput.tsx +31 -13
  382. package/src/DateTimeInput/DateTimeInput.tsx +25 -9
  383. package/src/Dialog/Dialog.test.tsx +24 -0
  384. package/src/Dialog/Dialog.tsx +3 -0
  385. package/src/DropdownMenu/DropdownMenuCheckboxItem.tsx +5 -2
  386. package/src/DropdownMenu/DropdownMenuItem.tsx +5 -2
  387. package/src/DropdownMenu/DropdownMenuRadioItem.tsx +5 -2
  388. package/src/DropdownMenu/DropdownMenuSubMenu.tsx +5 -2
  389. package/src/Field/Field.doc.mjs +2 -0
  390. package/src/Field/FieldLabel.tsx +9 -3
  391. package/src/Field/InputClearButton.test.tsx +110 -3
  392. package/src/Field/InputClearButton.tsx +38 -0
  393. package/src/Field/inputStyles.stylex.ts +17 -13
  394. package/src/FileInput/FileInput.tsx +15 -8
  395. package/src/FormLayout/FormLayout.doc.mjs +1 -1
  396. package/src/HoverCard/HoverCard.doc.mjs +18 -0
  397. package/src/HoverCard/HoverCard.test.tsx +189 -0
  398. package/src/HoverCard/HoverCard.tsx +22 -2
  399. package/src/HoverCard/index.ts +1 -0
  400. package/src/HoverCard/useHoverCard.doc.mjs +2 -0
  401. package/src/HoverCard/useHoverCard.tsx +103 -7
  402. package/src/InputGroup/InputGroup.tsx +1 -1
  403. package/src/Item/Item.doc.mjs +1 -0
  404. package/src/Item/Item.test.tsx +50 -0
  405. package/src/Item/Item.tsx +54 -6
  406. package/src/Layer/index.ts +10 -0
  407. package/src/Layer/useLayer.tsx +13 -2
  408. package/src/Layer/useTouchTrigger.test.ts +70 -0
  409. package/src/Layer/useTouchTrigger.ts +366 -0
  410. package/src/Layout/Layout.doc.mjs +18 -0
  411. package/src/Layout/container.stylex.ts +11 -3
  412. package/src/Layout/index.ts +4 -0
  413. package/src/Layout/overlayPaddingReset.test.tsx +222 -0
  414. package/src/Layout/padding.stylex.ts +192 -12
  415. package/src/Lightbox/Lightbox.tsx +11 -3
  416. package/src/Link/Link.tsx +9 -6
  417. package/src/MetadataList/MetadataList.tsx +4 -1
  418. package/src/MobileNav/MobileNav.tsx +61 -5
  419. package/src/MobileNav/MobileNavEntryAnimation.test.tsx +212 -0
  420. package/src/MobileNav/MobileNavScrollbarGutter.test.tsx +109 -0
  421. package/src/MultiSelector/MultiSelector.test.tsx +1 -1
  422. package/src/MultiSelector/MultiSelector.tsx +26 -10
  423. package/src/NavItem/navItemStyles.stylex.ts +7 -4
  424. package/src/NavMenu/NavHeadingMenuItem.tsx +6 -3
  425. package/src/NumberInput/NumberInput.doc.mjs +24 -0
  426. package/src/NumberInput/NumberInput.test.tsx +138 -0
  427. package/src/NumberInput/NumberInput.tsx +47 -8
  428. package/src/Outline/Outline.tsx +5 -2
  429. package/src/Pagination/Pagination.tsx +5 -2
  430. package/src/Popover/Popover.test.tsx +27 -1
  431. package/src/PowerSearch/PowerSearch.tsx +17 -8
  432. package/src/PowerSearch/PowerSearchToken.tsx +3 -0
  433. package/src/PowerSearch/formatFilterValue.test.ts +22 -2
  434. package/src/PowerSearch/formatFilterValue.ts +31 -6
  435. package/src/RadioList/RadioList.doc.mjs +1 -1
  436. package/src/RadioList/RadioList.test.tsx +170 -2
  437. package/src/RadioList/RadioListItem.tsx +88 -53
  438. package/src/Resizable/ResizeHandle.test.tsx +22 -0
  439. package/src/Resizable/ResizeHandle.tsx +25 -7
  440. package/src/Section/Section.doc.mjs +55 -0
  441. package/src/Section/Section.test.tsx +201 -4
  442. package/src/Section/Section.tsx +69 -0
  443. package/src/SegmentedControl/SegmentedControl.test.tsx +31 -0
  444. package/src/SegmentedControl/SegmentedControlItem.tsx +15 -3
  445. package/src/SelectableCard/SelectableCard.tsx +6 -3
  446. package/src/Selector/Selector.doc.mjs +16 -2
  447. package/src/Selector/Selector.test.tsx +525 -1
  448. package/src/Selector/Selector.tsx +180 -25
  449. package/src/Selector/SelectorOption.doc.mjs +7 -0
  450. package/src/Selector/SelectorOption.tsx +21 -0
  451. package/src/Selector/SelectorRowLayoutContext.ts +32 -0
  452. package/src/Selector/types.ts +4 -4
  453. package/src/SideNav/SideNavHeading.tsx +14 -5
  454. package/src/SideNav/SideNavItem.tsx +9 -3
  455. package/src/Slider/Slider.tsx +25 -6
  456. package/src/Stack/Stack.doc.mjs +72 -0
  457. package/src/Stack/Stack.test.tsx +156 -0
  458. package/src/Stack/Stack.tsx +50 -8
  459. package/src/Switch/Switch.tsx +5 -2
  460. package/src/TabList/Tab.tsx +4 -1
  461. package/src/TabList/TabMenu.tsx +9 -3
  462. package/src/Table/TableRow.tsx +4 -4
  463. package/src/Table/plugins/columnResize/useTableColumnResize.tsx +6 -2
  464. package/src/Table/plugins/filtering/useTableFiltering.tsx +4 -1
  465. package/src/Table/plugins/groupedRows/useTableGroupedRows.tsx +10 -3
  466. package/src/Table/plugins/rowExpansion/useTableRowExpansion.tsx +6 -3
  467. package/src/Table/plugins/sortable/useTableSortable.tsx +4 -1
  468. package/src/Table/plugins/sortable/useTableSortableState.test.tsx +34 -0
  469. package/src/Table/plugins/sortable/useTableSortableState.tsx +26 -23
  470. package/src/Table/plugins/tree/useTableTreeData.tsx +10 -4
  471. package/src/TextArea/TextArea.doc.mjs +1 -1
  472. package/src/TextArea/TextArea.tsx +1 -1
  473. package/src/TextInput/TextInput.tsx +1 -1
  474. package/src/Thumbnail/Thumbnail.tsx +9 -3
  475. package/src/TimeInput/TimeInput.tsx +1 -1
  476. package/src/Timestamp/Timestamp.test.tsx +27 -7
  477. package/src/Timestamp/Timestamp.tsx +8 -4
  478. package/src/Timestamp/formatInstant.ts +9 -7
  479. package/src/Timestamp/tooltipEntries.test.ts +11 -6
  480. package/src/Timestamp/tooltipEntries.ts +6 -2
  481. package/src/Toast/Toast.tsx +9 -7
  482. package/src/Token/Token.tsx +14 -5
  483. package/src/Tokenizer/Tokenizer.tsx +4 -1
  484. package/src/Tooltip/Tooltip.doc.mjs +18 -0
  485. package/src/Tooltip/Tooltip.test.tsx +254 -1
  486. package/src/Tooltip/Tooltip.tsx +22 -2
  487. package/src/Tooltip/index.ts +1 -0
  488. package/src/Tooltip/useTooltip.doc.mjs +2 -0
  489. package/src/Tooltip/useTooltip.tsx +99 -21
  490. package/src/TopNav/TopNavHeading.tsx +13 -4
  491. package/src/TopNav/TopNavItem.tsx +6 -3
  492. package/src/TopNav/TopNavMegaMenu.tsx +5 -2
  493. package/src/TopNav/TopNavMegaMenuItem.tsx +5 -2
  494. package/src/TopNav/TopNavMenu.tsx +10 -4
  495. package/src/TreeList/TreeListItem.tsx +22 -7
  496. package/src/Typeahead/BaseTypeahead.tsx +5 -2
  497. package/src/Typeahead/Typeahead.tsx +4 -1
  498. package/src/hooks/containerReveal.stylex.ts +54 -18
  499. package/src/hooks/scrollbarGutter.test.ts +167 -0
  500. package/src/hooks/scrollbarGutter.ts +121 -0
  501. package/src/hooks/useAutoMediaMode.test.ts +109 -0
  502. package/src/hooks/useAutoMediaMode.ts +233 -0
  503. package/src/hooks/useInputStatusIcon.tsx +4 -1
  504. package/src/hooks/useListFocus.doc.mjs +2 -2
  505. package/src/hooks/useListFocus.test.tsx +65 -3
  506. package/src/hooks/useListFocus.ts +15 -7
  507. package/src/hooks/useScrollLock.doc.mjs +4 -4
  508. package/src/hooks/useScrollLock.test.ts +73 -0
  509. package/src/hooks/useScrollLock.ts +14 -0
  510. package/src/i18n/InternationalizationContext.ts +2 -0
  511. package/src/i18n/__tests__/e2e-powersearch.test.tsx +37 -1
  512. package/src/i18n/__tests__/useCollator.test.tsx +115 -0
  513. package/src/i18n/__tests__/useLocale.test.tsx +52 -0
  514. package/src/i18n/index.ts +6 -0
  515. package/src/i18n/useCollator.doc.mjs +84 -0
  516. package/src/i18n/useCollator.ts +44 -0
  517. package/src/i18n/useLocale.doc.mjs +70 -0
  518. package/src/i18n/useLocale.ts +34 -0
  519. package/src/i18n/useTranslator.doc.mjs +1 -1
  520. package/src/reset.css +9 -2
  521. package/src/reset.test.ts +22 -0
  522. package/src/theme/MediaTheme.doc.mjs +23 -4
  523. package/src/theme/MediaTheme.dom.test.tsx +97 -0
  524. package/src/theme/MediaTheme.tsx +42 -7
  525. package/src/theme/defineTheme.test.ts +9 -3
  526. package/src/theme/defineTheme.ts +5 -0
  527. package/src/theme/derivedVarRegistry.test.ts +19 -5
  528. package/src/theme/derivedVarRegistry.ts +4 -0
  529. package/src/theme/generateThemeRules.test.ts +118 -0
  530. package/src/theme/generateThemeRules.ts +83 -5
  531. package/src/theme/index.ts +1 -1
  532. package/src/theme/syntax/index.ts +6 -2
  533. package/src/theme/syntax/serverSafeSyntax.test.ts +68 -0
  534. package/src/utils/dateParser.test.ts +20 -0
  535. package/src/utils/dateParser.ts +14 -7
  536. package/src/utils/index.ts +2 -0
  537. package/src/utils/plainDate.test.ts +6 -0
  538. package/src/utils/plainDate.ts +21 -4
@@ -0,0 +1,241 @@
1
+ // Copyright (c) Meta Platforms, Inc. and affiliates.
2
+
3
+ 'use client';
4
+
5
+ /**
6
+ * @file useTouchTrigger.ts
7
+ * @input Touch trigger mode, layer open state, trigger ref, show/hide callbacks
8
+ * @output Exports useTouchTrigger hook, isActionTrigger, LayerTouchTrigger type
9
+ * @position Layer hook; shared touch behavior for useTooltip and useHoverCard
10
+ *
11
+ * SYNC: When modified, update:
12
+ * - /packages/core/src/Layer/index.ts
13
+ *
14
+ * Hover is the one trigger a touch screen cannot express. A tap synthesizes
15
+ * `mouseenter`, so an untreated hover layer either opens on every tap and
16
+ * lingers with nothing to close it, or swallows the tap the user aimed at the
17
+ * control underneath.
18
+ *
19
+ * What the trigger DOES decides which of those the tap deserves. A trigger
20
+ * that performs an action — a button, a link, a form control — keeps its tap:
21
+ * the layer stays shut, because the tap already has somewhere to go and a hint
22
+ * about a control the user just operated is noise. A trigger that performs no
23
+ * action — an info icon, an abbreviation, a truncated label — has nothing to
24
+ * lose, so the tap opens the layer and the next tap outside dismisses it. That
25
+ * is `auto`; `tap` and `none` state the choice outright, which is what an
26
+ * icon-button whose only job is to reveal the layer needs.
27
+ */
28
+ import { useCallback, useEffect, useRef } from 'react';
29
+ import { getInteractionModality, trackInteractionModality } from "../utils/interactionModality.js";
30
+
31
+ /**
32
+ * How a hover layer behaves on a touch pointer.
33
+ *
34
+ * - `auto`: tap-to-open, unless the trigger performs an action of its own
35
+ * - `tap`: always tap-to-open, even on a trigger that performs an action
36
+ * - `none`: never open on touch
37
+ */
38
+
39
+ /**
40
+ * Pointer types whose *press* is a tap rather than a click.
41
+ *
42
+ * A pen belongs here but not in the arrival path: in detection range it hovers
43
+ * — firing `pointerenter`/`pointermove` with no contact, exactly as a mouse
44
+ * does, on a device where `(hover: hover)` matches — and only becomes a tap
45
+ * once it lands. See `handlePointerEnter`.
46
+ */
47
+ const TOUCH_POINTER_TYPES = new Set(['touch', 'pen']);
48
+
49
+ /**
50
+ * ARIA roles that make an element do something when activated. An explicit
51
+ * role wins over the tag: `<button role="presentation">` is scenery, and a
52
+ * `<span role="button">` is a real control.
53
+ */
54
+ const ACTION_ROLES = new Set(['button', 'checkbox', 'combobox', 'link', 'menuitem', 'menuitemcheckbox', 'menuitemradio', 'option', 'radio', 'searchbox', 'slider', 'spinbutton', 'switch', 'tab', 'textbox']);
55
+
56
+ /**
57
+ * Whether activating this element does something other than reveal the layer.
58
+ *
59
+ * Deliberately narrower than "focusable": the wrapper a text-only Tooltip
60
+ * renders carries `tabindex=0` so keyboard users can reach the hint, and it
61
+ * still performs no action.
62
+ *
63
+ * True only decides that the layer stays shut — the tap itself is never
64
+ * swallowed. Nothing here calls `preventDefault` or `stopPropagation`, so an
65
+ * inert trigger that happens to carry its own `onClick` (a `<div onClick>`
66
+ * with no role) gets both: the layer opens and the handler runs.
67
+ */
68
+ export function isActionTrigger(element) {
69
+ const role = element.getAttribute('role');
70
+ if (role != null && role !== '') {
71
+ return ACTION_ROLES.has(role);
72
+ }
73
+ switch (element.tagName) {
74
+ case 'BUTTON':
75
+ case 'INPUT':
76
+ case 'LABEL':
77
+ case 'SELECT':
78
+ case 'SUMMARY':
79
+ case 'TEXTAREA':
80
+ return true;
81
+ case 'A':
82
+ case 'AREA':
83
+ return element.hasAttribute('href');
84
+ default:
85
+ return isEditable(element);
86
+ }
87
+ }
88
+
89
+ /**
90
+ * Whether typing into this element edits it. Reads the attribute as well as
91
+ * the property: jsdom does not implement `isContentEditable`, and an editor
92
+ * that is an action in the browser must not be inert under test.
93
+ */
94
+ function isEditable(element) {
95
+ if (element.isContentEditable === true) {
96
+ return true;
97
+ }
98
+ const attribute = element.getAttribute('contenteditable');
99
+ return attribute != null && attribute !== 'false';
100
+ }
101
+ /**
102
+ * Touch behavior shared by the hover layers.
103
+ *
104
+ * @example
105
+ * ```
106
+ * const touch = useTouchTrigger({
107
+ * touchTrigger,
108
+ * isEnabled,
109
+ * isControlled: isOpen !== undefined,
110
+ * isOpen: layer.isOpen,
111
+ * layerId: layer.id,
112
+ * triggerRef,
113
+ * show: showNow,
114
+ * hide: hideNow,
115
+ * });
116
+ * ```
117
+ */
118
+ export function useTouchTrigger(options) {
119
+ const {
120
+ touchTrigger,
121
+ isEnabled,
122
+ isControlled,
123
+ isOpen,
124
+ layerId,
125
+ triggerRef,
126
+ show,
127
+ hide
128
+ } = options;
129
+ const isTouchPointerRef = useRef(false);
130
+ // Mirrors `isOpen` for synchronous reads inside the pointer handler, which
131
+ // runs outside React's render and would otherwise close over a stale value.
132
+ const isOpenRef = useRef(isOpen);
133
+ isOpenRef.current = isOpen;
134
+
135
+ // Latest values for the document listener, which outlives the render that
136
+ // armed it.
137
+ const hideRef = useRef(hide);
138
+ hideRef.current = hide;
139
+ const layerIdRef = useRef(layerId);
140
+ layerIdRef.current = layerId;
141
+
142
+ // Whether a tap is what opened the layer. Only a tap-open owes the user an
143
+ // outside-tap dismissal: a hover-opened layer already closes on
144
+ // pointer-leave, and a controlled one is not ours to close.
145
+ const isTapOpenRef = useRef(false);
146
+ const outsideListenerRef = useRef(null);
147
+ useEffect(() => {
148
+ trackInteractionModality();
149
+ }, []);
150
+ const disarmOutsideDismiss = useCallback(() => {
151
+ isTapOpenRef.current = false;
152
+ const listener = outsideListenerRef.current;
153
+ if (listener == null) {
154
+ return;
155
+ }
156
+ outsideListenerRef.current = null;
157
+ document.removeEventListener('pointerdown', listener, true);
158
+ }, []);
159
+
160
+ // Capture phase, so a trigger that stops propagation cannot strand an open
161
+ // layer. The opening tap's own capture phase at the document has already
162
+ // passed by the time this runs, so the listener never sees it.
163
+ const armOutsideDismiss = useCallback(() => {
164
+ isTapOpenRef.current = true;
165
+ if (outsideListenerRef.current != null) {
166
+ return;
167
+ }
168
+ const handleOutsidePointerDown = event => {
169
+ const target = event.target;
170
+ if (target != null) {
171
+ // The trigger's own handler owns the toggle.
172
+ if (triggerRef.current?.contains(target) === true) {
173
+ return;
174
+ }
175
+ // Hover card content is interactive; a tap inside it is not a dismiss.
176
+ if (document.getElementById(layerIdRef.current)?.contains(target) === true) {
177
+ return;
178
+ }
179
+ }
180
+ disarmOutsideDismiss();
181
+ hideRef.current();
182
+ };
183
+ outsideListenerRef.current = handleOutsidePointerDown;
184
+ document.addEventListener('pointerdown', handleOutsidePointerDown, true);
185
+ }, [triggerRef, disarmOutsideDismiss]);
186
+ useEffect(() => disarmOutsideDismiss, [disarmOutsideDismiss]);
187
+ const isTouchInteraction = useCallback(() => isTouchPointerRef.current && getInteractionModality() === 'pointer', []);
188
+ const handlePointerEnter = useCallback(event => {
189
+ // Only a finger is hoverless on arrival. A pen in detection range hovers
190
+ // like a mouse, and treating its arrival as touch would bail out of the
191
+ // hover path and leave a stylus user with no tooltip at all. A pen that
192
+ // presses is a tap, and `handlePointerDown` still reads it as one.
193
+ isTouchPointerRef.current = event.pointerType === 'touch';
194
+ }, []);
195
+ const handlePointerDown = useCallback(event => {
196
+ const isTouch = TOUCH_POINTER_TYPES.has(event.pointerType);
197
+ isTouchPointerRef.current = isTouch;
198
+ if (!isTouch || isControlled) {
199
+ return false;
200
+ }
201
+ const trigger = triggerRef.current;
202
+ const mode = touchTrigger === 'auto' ? trigger != null && isActionTrigger(trigger) ? 'none' : 'tap' : touchTrigger;
203
+ if (mode === 'none' || !isEnabled) {
204
+ // A layer left open by an earlier tap must not survive the next one.
205
+ disarmOutsideDismiss();
206
+ hide();
207
+ return true;
208
+ }
209
+
210
+ // A lazily mounted layer reports `isOpen` a tick after `show()`, so the
211
+ // tap's own bookkeeping is what makes the second tap a close.
212
+ if (isOpenRef.current || isTapOpenRef.current) {
213
+ disarmOutsideDismiss();
214
+ hide();
215
+ return true;
216
+ }
217
+ armOutsideDismiss();
218
+ show();
219
+ return true;
220
+ }, [touchTrigger, isEnabled, isControlled, triggerRef, show, hide, armOutsideDismiss, disarmOutsideDismiss]);
221
+
222
+ // A layer closed by any other path (Escape, a consumer, the browser) leaves
223
+ // no tap-open to dismiss. Only a true open→closed transition counts: a
224
+ // lazily mounted layer still reports `false` for a tick after the tap asked
225
+ // it to open, and reading that as a close would disarm the dismissal the
226
+ // tap-open just armed.
227
+ const wasOpenRef = useRef(isOpen);
228
+ useEffect(() => {
229
+ if (wasOpenRef.current && !isOpen) {
230
+ disarmOutsideDismiss();
231
+ }
232
+ wasOpenRef.current = isOpen;
233
+ }, [isOpen, disarmOutsideDismiss]);
234
+ return {
235
+ isTouchPointerRef,
236
+ isTouchInteraction,
237
+ handlePointerEnter,
238
+ handlePointerDown,
239
+ clearTapOpen: disarmOutsideDismiss
240
+ };
241
+ }
@@ -26,8 +26,10 @@
26
26
  * }
27
27
  * ```
28
28
  *
29
- * Internal variables (`--layout-padding-inner-x`, `--container-padding-*`)
30
- * are implementation details and must not be referenced by themes.
29
+ * Internal variables (`--layout-padding-inner-x`, `--container-padding-*`,
30
+ * `--_section-padding-propagated`) are implementation details and must not be
31
+ * referenced by themes. They also do not cross an overlay boundary — see
32
+ * `overlayPaddingReset` in padding.stylex.ts.
31
33
  *
32
34
  * SYNC: When modified, update /packages/core/src/Layout/Layout.doc.mjs
33
35
  */
@@ -1 +1 @@
1
- {"version":3,"file":"container.stylex.d.ts","sourceRoot":"","sources":["../../src/Layout/container.stylex.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AAEH,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAG3C;;GAEG;AACH,MAAM,MAAM,YAAY,GACpB,UAAU,GACV,YAAY,GACZ,UAAU,GACV,YAAY,GACZ,UAAU,GACV,UAAU,GACV,UAAU,GACV,UAAU,GACV,UAAU,GACV,UAAU,GACV,UAAU,GACV,UAAU,GACV,WAAW,GACX,WAAW,GACX,WAAW,CAAC;AAoJhB;;;GAGG;AACH,QAAA,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAIvB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,MAAM,OAAO,kBAAkB,CAAC;AAuKjE,MAAM,WAAW,gBAAgB;IAC/B;;;;;OAKG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IAEvB;;;;OAIG;IACH,aAAa,CAAC,EAAE,YAAY,CAAC;IAE7B;;;;OAIG;IACH,aAAa,CAAC,EAAE,YAAY,CAAC;IAE7B;;;;OAIG;IACH,aAAa,CAAC,EAAE,YAAY,CAAC;IAE7B;;;;OAIG;IACH,aAAa,CAAC,EAAE,YAAY,CAAC;IAE7B;;;;;;;;;;;OAWG;IACH,eAAe,CAAC,EAAE,kBAAkB,CAAC;IAErC;;;;;OAKG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,wBAAgB,SAAS,CAAC,EACxB,OAAoB,EACpB,aAAa,EACb,aAAa,EACb,aAAa,EACb,aAAa,EACb,eAAe,EACf,SAAS,GACV,EAAE,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCAyClB"}
1
+ {"version":3,"file":"container.stylex.d.ts","sourceRoot":"","sources":["../../src/Layout/container.stylex.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AAEH,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAG3C;;GAEG;AACH,MAAM,MAAM,YAAY,GACpB,UAAU,GACV,YAAY,GACZ,UAAU,GACV,YAAY,GACZ,UAAU,GACV,UAAU,GACV,UAAU,GACV,UAAU,GACV,UAAU,GACV,UAAU,GACV,UAAU,GACV,UAAU,GACV,WAAW,GACX,WAAW,GACX,WAAW,CAAC;AA0JhB;;;GAGG;AACH,QAAA,MAAM,kBAAkB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAIvB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,MAAM,OAAO,kBAAkB,CAAC;AAuKjE,MAAM,WAAW,gBAAgB;IAC/B;;;;;OAKG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IAEvB;;;;OAIG;IACH,aAAa,CAAC,EAAE,YAAY,CAAC;IAE7B;;;;OAIG;IACH,aAAa,CAAC,EAAE,YAAY,CAAC;IAE7B;;;;OAIG;IACH,aAAa,CAAC,EAAE,YAAY,CAAC;IAE7B;;;;OAIG;IACH,aAAa,CAAC,EAAE,YAAY,CAAC;IAE7B;;;;;;;;;;;OAWG;IACH,eAAe,CAAC,EAAE,kBAAkB,CAAC;IAErC;;;;;OAKG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,wBAAgB,SAAS,CAAC,EACxB,OAAoB,EACpB,aAAa,EACb,aAAa,EACb,aAAa,EACb,aAAa,EACb,eAAe,EACf,SAAS,GACV,EAAE,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCAyClB"}
@@ -28,8 +28,10 @@
28
28
  * }
29
29
  * ```
30
30
  *
31
- * Internal variables (`--layout-padding-inner-x`, `--container-padding-*`)
32
- * are implementation details and must not be referenced by themes.
31
+ * Internal variables (`--layout-padding-inner-x`, `--container-padding-*`,
32
+ * `--_section-padding-propagated`) are implementation details and must not be
33
+ * referenced by themes. They also do not cross an overlay boundary — see
34
+ * `overlayPaddingReset` in padding.stylex.ts.
33
35
  *
34
36
  * SYNC: When modified, update /packages/core/src/Layout/Layout.doc.mjs
35
37
  */
@@ -91,7 +93,13 @@ const cardBlockEnd = `var(--astryx-card-padding-block-end, ${cardShorthand})`;
91
93
  // Section padding chains: --astryx-* then the next specificity level, terminating
92
94
  // at --spacing-4. Built as chained const strings (no function calls) so StyleX
93
95
  // can statically analyze them; see naming.ts for the prefix policy.
94
- const sectionShorthand = `var(--astryx-section-padding, ${SP4})`;
96
+ // `--_section-padding-propagated` (set by an ancestor Section with explicit
97
+ // padding) is read AHEAD of the public theme token, so a propagated value
98
+ // still wins over the theme for nested sections. Splitting the two names is
99
+ // what lets an overlay drop the inherited value at its boundary while keeping
100
+ // the theme's — see `overlayPaddingReset` in padding.stylex.ts.
101
+ const sectionThemeShorthand = `var(--astryx-section-padding, ${SP4})`;
102
+ const sectionShorthand = `var(--_section-padding-propagated, ${sectionThemeShorthand})`;
95
103
  const sectionInline = `var(--astryx-section-padding-inline, ${sectionShorthand})`;
96
104
  const sectionInlineStart = `var(--astryx-section-padding-inline-start, ${sectionInline})`;
97
105
  const sectionInlineEnd = `var(--astryx-section-padding-inline-end, ${sectionInline})`;
@@ -143,35 +151,35 @@ const cardDefaultPaddingStyles = {
143
151
  };
144
152
  const sectionDefaultPaddingStyles = {
145
153
  containerPaddingInlineStart: {
146
- "--container-padding-inline-start": "xrgx2ny",
154
+ "--container-padding-inline-start": "x19lemt0",
147
155
  $$css: true
148
156
  },
149
157
  containerPaddingInlineEnd: {
150
- "--container-padding-inline-end": "xyk0j9o",
158
+ "--container-padding-inline-end": "xu1wldr",
151
159
  $$css: true
152
160
  },
153
161
  containerPaddingBlockStart: {
154
- "--container-padding-block-start": "x876hks",
162
+ "--container-padding-block-start": "xnw7zt4",
155
163
  $$css: true
156
164
  },
157
165
  containerPaddingBlockEnd: {
158
- "--container-padding-block-end": "x1u89lk7",
166
+ "--container-padding-block-end": "xek4msv",
159
167
  $$css: true
160
168
  },
161
169
  layoutPaddingOuterX: {
162
- "--layout-padding-outer-x": "x12sptzx",
170
+ "--layout-padding-outer-x": "x15i0zw9",
163
171
  $$css: true
164
172
  },
165
173
  layoutPaddingOuterY: {
166
- "--layout-padding-outer-y": "xo78phr",
174
+ "--layout-padding-outer-y": "x1vw4zgg",
167
175
  $$css: true
168
176
  },
169
177
  layoutPaddingInnerX: {
170
- "--layout-padding-inner-x": "x1we69p7",
178
+ "--layout-padding-inner-x": "x1v3gmnx",
171
179
  $$css: true
172
180
  },
173
181
  layoutPaddingInnerY: {
174
- "--layout-padding-inner-y": "xsdnkbz",
182
+ "--layout-padding-inner-y": "x15yx5hm",
175
183
  $$css: true
176
184
  }
177
185
  };
@@ -8,6 +8,7 @@
8
8
  */
9
9
  export { container } from './container.stylex';
10
10
  export type { ContainerComponent, ContainerOptions, SpacingToken, } from './container.stylex';
11
+ export { overlayPaddingReset } from './padding.stylex';
11
12
  export { edgeCompSlot, EDGE_COMP_ATTR } from './edgeCompensation.stylex';
12
13
  export { stack } from '../Stack/stack.stylex';
13
14
  export type { StackOptions, StackDirection, StackCrossAlignment, StackMainAlignment, StackWrap, SpacingStep, } from '../Stack/stack.stylex';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Layout/index.ts"],"names":[],"mappings":"AAIA;;;;;;;GAOG;AAGH,OAAO,EAAC,SAAS,EAAC,MAAM,oBAAoB,CAAC;AAC7C,YAAY,EACV,kBAAkB,EAClB,gBAAgB,EAChB,YAAY,GACb,MAAM,oBAAoB,CAAC;AAG5B,OAAO,EAAC,YAAY,EAAE,cAAc,EAAC,MAAM,2BAA2B,CAAC;AAGvE,OAAO,EAAC,KAAK,EAAC,MAAM,uBAAuB,CAAC;AAC5C,YAAY,EACV,YAAY,EACZ,cAAc,EACd,mBAAmB,EACnB,kBAAkB,EAClB,SAAS,EACT,WAAW,GACZ,MAAM,uBAAuB,CAAC;AAE/B,OAAO,EAAC,SAAS,EAAC,MAAM,2BAA2B,CAAC;AACpD,YAAY,EACV,gBAAgB,EAChB,uBAAuB,EACvB,aAAa,GACd,MAAM,2BAA2B,CAAC;AAGnC,OAAO,EAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,EAAC,MAAM,UAAU,CAAC;AAC1D,YAAY,EACV,UAAU,EACV,cAAc,EACd,WAAW,EACX,WAAW,EACX,cAAc,GACf,MAAM,UAAU,CAAC;AAGlB,OAAO,EAAC,IAAI,EAAC,MAAM,SAAS,CAAC;AAC7B,YAAY,EAAC,SAAS,EAAC,MAAM,SAAS,CAAC;AAEvC,OAAO,EAAC,OAAO,EAAC,MAAM,YAAY,CAAC;AACnC,YAAY,EAAC,YAAY,EAAE,cAAc,EAAC,MAAM,YAAY,CAAC;AAE7D,YAAY,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAG9C,OAAO,EAAC,MAAM,EAAC,MAAM,UAAU,CAAC;AAChC,YAAY,EAAC,WAAW,EAAE,YAAY,EAAC,MAAM,UAAU,CAAC;AAExD,OAAO,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAC;AAC5C,YAAY,EAAC,iBAAiB,EAAC,MAAM,gBAAgB,CAAC;AAEtD,OAAO,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAC;AAC5C,YAAY,EAAC,iBAAiB,EAAC,MAAM,gBAAgB,CAAC;AAEtD,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAC9C,YAAY,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAExD,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAC1C,YAAY,EAAC,gBAAgB,EAAC,MAAM,eAAe,CAAC;AAEpD,OAAO,EAAC,iBAAiB,EAAC,MAAM,qBAAqB,CAAC;AACtD,YAAY,EAAC,UAAU,EAAC,MAAM,qBAAqB,CAAC;AAEpD,OAAO,EAAC,oBAAoB,EAAC,MAAM,wBAAwB,CAAC;AAC5D,YAAY,EAAC,yBAAyB,EAAC,MAAM,wBAAwB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Layout/index.ts"],"names":[],"mappings":"AAIA;;;;;;;GAOG;AAGH,OAAO,EAAC,SAAS,EAAC,MAAM,oBAAoB,CAAC;AAC7C,YAAY,EACV,kBAAkB,EAClB,gBAAgB,EAChB,YAAY,GACb,MAAM,oBAAoB,CAAC;AAI5B,OAAO,EAAC,mBAAmB,EAAC,MAAM,kBAAkB,CAAC;AAGrD,OAAO,EAAC,YAAY,EAAE,cAAc,EAAC,MAAM,2BAA2B,CAAC;AAGvE,OAAO,EAAC,KAAK,EAAC,MAAM,uBAAuB,CAAC;AAC5C,YAAY,EACV,YAAY,EACZ,cAAc,EACd,mBAAmB,EACnB,kBAAkB,EAClB,SAAS,EACT,WAAW,GACZ,MAAM,uBAAuB,CAAC;AAE/B,OAAO,EAAC,SAAS,EAAC,MAAM,2BAA2B,CAAC;AACpD,YAAY,EACV,gBAAgB,EAChB,uBAAuB,EACvB,aAAa,GACd,MAAM,2BAA2B,CAAC;AAGnC,OAAO,EAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,EAAC,MAAM,UAAU,CAAC;AAC1D,YAAY,EACV,UAAU,EACV,cAAc,EACd,WAAW,EACX,WAAW,EACX,cAAc,GACf,MAAM,UAAU,CAAC;AAGlB,OAAO,EAAC,IAAI,EAAC,MAAM,SAAS,CAAC;AAC7B,YAAY,EAAC,SAAS,EAAC,MAAM,SAAS,CAAC;AAEvC,OAAO,EAAC,OAAO,EAAC,MAAM,YAAY,CAAC;AACnC,YAAY,EAAC,YAAY,EAAE,cAAc,EAAC,MAAM,YAAY,CAAC;AAE7D,YAAY,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAG9C,OAAO,EAAC,MAAM,EAAC,MAAM,UAAU,CAAC;AAChC,YAAY,EAAC,WAAW,EAAE,YAAY,EAAC,MAAM,UAAU,CAAC;AAExD,OAAO,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAC;AAC5C,YAAY,EAAC,iBAAiB,EAAC,MAAM,gBAAgB,CAAC;AAEtD,OAAO,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAC;AAC5C,YAAY,EAAC,iBAAiB,EAAC,MAAM,gBAAgB,CAAC;AAEtD,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAC9C,YAAY,EAAC,kBAAkB,EAAC,MAAM,iBAAiB,CAAC;AAExD,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAC1C,YAAY,EAAC,gBAAgB,EAAC,MAAM,eAAe,CAAC;AAEpD,OAAO,EAAC,iBAAiB,EAAC,MAAM,qBAAqB,CAAC;AACtD,YAAY,EAAC,UAAU,EAAC,MAAM,qBAAqB,CAAC;AAEpD,OAAO,EAAC,oBAAoB,EAAC,MAAM,wBAAwB,CAAC;AAC5D,YAAY,EAAC,yBAAyB,EAAC,MAAM,wBAAwB,CAAC"}
@@ -13,6 +13,10 @@
13
13
 
14
14
  // Container utility
15
15
  export { container } from "./container.stylex.js";
16
+ // Overlay padding-variable reset (applied on overlay roots so the container
17
+ // padding system does not cross a fixed/top-layer boundary)
18
+ export { overlayPaddingReset } from "./padding.stylex.js";
19
+
16
20
  // Edge compensation utility
17
21
  export { edgeCompSlot, EDGE_COMP_ATTR } from "./edgeCompensation.stylex.js";
18
22