@astryxdesign/core 0.1.4-canary.e67f422 → 0.1.4-canary.ec9f8b2

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 (576) hide show
  1. package/dist/AlertDialog/AlertDialog.d.ts +1 -1
  2. package/dist/AlertDialog/AlertDialog.d.ts.map +1 -1
  3. package/dist/AlertDialog/AlertDialog.js +20 -18
  4. package/dist/AlertDialog/useImperativeAlertDialog.js +3 -3
  5. package/dist/AppShell/AppShell.d.ts +1 -1
  6. package/dist/AppShell/AppShell.d.ts.map +1 -1
  7. package/dist/AppShell/AppShell.js +55 -53
  8. package/dist/AspectRatio/AspectRatio.d.ts +48 -10
  9. package/dist/AspectRatio/AspectRatio.d.ts.map +1 -1
  10. package/dist/AspectRatio/AspectRatio.js +33 -12
  11. package/dist/AspectRatio/index.d.ts +1 -1
  12. package/dist/AspectRatio/index.d.ts.map +1 -1
  13. package/dist/Avatar/Avatar.d.ts.map +1 -1
  14. package/dist/Avatar/Avatar.js +28 -26
  15. package/dist/Avatar/AvatarStatusDot.js +6 -6
  16. package/dist/AvatarGroup/AvatarGroup.js +6 -6
  17. package/dist/AvatarGroup/AvatarGroupOverflow.js +7 -7
  18. package/dist/Badge/Badge.js +3 -3
  19. package/dist/Banner/Banner.d.ts.map +1 -1
  20. package/dist/Banner/Banner.js +32 -25
  21. package/dist/Blockquote/Blockquote.js +7 -7
  22. package/dist/Breadcrumbs/BreadcrumbItem.js +17 -17
  23. package/dist/Breadcrumbs/Breadcrumbs.js +7 -7
  24. package/dist/Button/Button.js +19 -19
  25. package/dist/ButtonGroup/ButtonGroup.js +7 -7
  26. package/dist/Calendar/Calendar.js +48 -44
  27. package/dist/Calendar/dayCellUtils.d.ts.map +1 -1
  28. package/dist/Card/Card.d.ts +4 -2
  29. package/dist/Card/Card.d.ts.map +1 -1
  30. package/dist/Card/Card.js +18 -10
  31. package/dist/Carousel/Carousel.d.ts.map +1 -1
  32. package/dist/Carousel/Carousel.js +23 -21
  33. package/dist/Center/Center.js +3 -3
  34. package/dist/Chat/ChatComposer.js +23 -23
  35. package/dist/Chat/ChatComposerDrawer.js +14 -14
  36. package/dist/Chat/ChatComposerInput.d.ts +1 -1
  37. package/dist/Chat/ChatComposerInput.d.ts.map +1 -1
  38. package/dist/Chat/ChatComposerInput.js +27 -15
  39. package/dist/Chat/ChatDictationButton.d.ts +1 -1
  40. package/dist/Chat/ChatDictationButton.d.ts.map +1 -1
  41. package/dist/Chat/ChatDictationButton.js +13 -11
  42. package/dist/Chat/ChatLayout.js +17 -17
  43. package/dist/Chat/ChatLayoutScrollButton.d.ts +1 -1
  44. package/dist/Chat/ChatLayoutScrollButton.d.ts.map +1 -1
  45. package/dist/Chat/ChatLayoutScrollButton.js +12 -10
  46. package/dist/Chat/ChatMessage.js +12 -12
  47. package/dist/Chat/ChatMessageBubble.js +7 -7
  48. package/dist/Chat/ChatMessageList.js +14 -14
  49. package/dist/Chat/ChatMessageMetadata.d.ts +1 -1
  50. package/dist/Chat/ChatMessageMetadata.d.ts.map +1 -1
  51. package/dist/Chat/ChatMessageMetadata.js +14 -12
  52. package/dist/Chat/ChatPastedTextToken.js +13 -13
  53. package/dist/Chat/ChatSendButton.js +3 -3
  54. package/dist/Chat/ChatSystemMessage.d.ts +1 -1
  55. package/dist/Chat/ChatSystemMessage.d.ts.map +1 -1
  56. package/dist/Chat/ChatSystemMessage.js +17 -17
  57. package/dist/Chat/ChatTokenizedText.d.ts +1 -1
  58. package/dist/Chat/ChatTokenizedText.d.ts.map +1 -1
  59. package/dist/Chat/ChatTokenizedText.js +24 -15
  60. package/dist/Chat/ChatToolCalls.d.ts.map +1 -1
  61. package/dist/Chat/ChatToolCalls.js +81 -74
  62. package/dist/Chat/index.d.ts +1 -1
  63. package/dist/Chat/index.d.ts.map +1 -1
  64. package/dist/Chat/useTriggerMenu.d.ts.map +1 -1
  65. package/dist/Chat/useTriggerMenu.js +15 -15
  66. package/dist/CheckboxInput/CheckboxInput.d.ts +1 -1
  67. package/dist/CheckboxInput/CheckboxInput.d.ts.map +1 -1
  68. package/dist/CheckboxInput/CheckboxInput.js +25 -23
  69. package/dist/CheckboxList/CheckboxList.js +9 -9
  70. package/dist/CheckboxList/CheckboxListItem.d.ts +1 -1
  71. package/dist/CheckboxList/CheckboxListItem.d.ts.map +1 -1
  72. package/dist/CheckboxList/CheckboxListItem.js +8 -6
  73. package/dist/Citation/Citation.js +10 -10
  74. package/dist/ClickableCard/ClickableCard.d.ts.map +1 -1
  75. package/dist/ClickableCard/ClickableCard.js +32 -9
  76. package/dist/Code/Code.js +3 -3
  77. package/dist/CodeBlock/CodeBlock.d.ts.map +1 -1
  78. package/dist/CodeBlock/CodeBlock.js +83 -53
  79. package/dist/Collapsible/Collapsible.d.ts +3 -2
  80. package/dist/Collapsible/Collapsible.d.ts.map +1 -1
  81. package/dist/Collapsible/Collapsible.js +24 -16
  82. package/dist/Collapsible/CollapsibleGroup.d.ts +16 -18
  83. package/dist/Collapsible/CollapsibleGroup.d.ts.map +1 -1
  84. package/dist/Collapsible/CollapsibleGroup.js +27 -36
  85. package/dist/Collapsible/CollapsibleGroupContext.d.ts +2 -9
  86. package/dist/Collapsible/CollapsibleGroupContext.d.ts.map +1 -1
  87. package/dist/Collapsible/CollapsibleGroupContext.js +1 -8
  88. package/dist/Collapsible/index.d.ts +1 -1
  89. package/dist/Collapsible/index.d.ts.map +1 -1
  90. package/dist/Collapsible/useCollapsible.d.ts +4 -1
  91. package/dist/Collapsible/useCollapsible.d.ts.map +1 -1
  92. package/dist/Collapsible/useCollapsible.js +20 -6
  93. package/dist/CommandPalette/CommandPalette.d.ts.map +1 -1
  94. package/dist/CommandPalette/CommandPalette.js +36 -34
  95. package/dist/CommandPalette/CommandPaletteEmpty.js +3 -3
  96. package/dist/CommandPalette/CommandPaletteFooter.js +16 -16
  97. package/dist/CommandPalette/CommandPaletteGroup.js +5 -5
  98. package/dist/CommandPalette/CommandPaletteInput.js +13 -13
  99. package/dist/CommandPalette/CommandPaletteItem.js +3 -3
  100. package/dist/CommandPalette/CommandPaletteList.js +3 -3
  101. package/dist/ContextMenu/ContextMenu.d.ts +7 -2
  102. package/dist/ContextMenu/ContextMenu.d.ts.map +1 -1
  103. package/dist/ContextMenu/ContextMenu.js +76 -43
  104. package/dist/DateInput/DateInput.js +18 -18
  105. package/dist/DateRangeInput/DateRangeInput.js +21 -21
  106. package/dist/DateTimeInput/DateTimeInput.d.ts +5 -2
  107. package/dist/DateTimeInput/DateTimeInput.d.ts.map +1 -1
  108. package/dist/DateTimeInput/DateTimeInput.js +30 -26
  109. package/dist/DateTimeInput/index.d.ts +1 -1
  110. package/dist/DateTimeInput/index.d.ts.map +1 -1
  111. package/dist/Dialog/Dialog.js +9 -9
  112. package/dist/Dialog/DialogHeader.js +16 -16
  113. package/dist/Dialog/useImperativeDialog.js +3 -3
  114. package/dist/Divider/Divider.js +7 -7
  115. package/dist/DropdownMenu/DropdownMenu.js +10 -10
  116. package/dist/DropdownMenu/DropdownMenuItem.d.ts +2 -17
  117. package/dist/DropdownMenu/DropdownMenuItem.d.ts.map +1 -1
  118. package/dist/DropdownMenu/DropdownMenuItem.js +3 -3
  119. package/dist/DropdownMenu/renderDropdownItems.js +10 -10
  120. package/dist/EmptyState/EmptyState.js +9 -9
  121. package/dist/Field/Field.js +17 -17
  122. package/dist/Field/FieldLabel.js +15 -15
  123. package/dist/Field/InputClearButton.js +5 -5
  124. package/dist/FieldStatus/FieldStatus.js +3 -3
  125. package/dist/FileInput/FileInput.js +29 -29
  126. package/dist/FormLayout/FormLayout.js +5 -5
  127. package/dist/Grid/Grid.d.ts +4 -3
  128. package/dist/Grid/Grid.d.ts.map +1 -1
  129. package/dist/Grid/Grid.js +29 -12
  130. package/dist/Grid/GridSpan.js +3 -3
  131. package/dist/HStack/HStack.js +3 -3
  132. package/dist/Heading/Heading.js +10 -10
  133. package/dist/HoverCard/HoverCard.js +9 -9
  134. package/dist/HoverCard/useHoverCard.d.ts +5 -1
  135. package/dist/HoverCard/useHoverCard.d.ts.map +1 -1
  136. package/dist/HoverCard/useHoverCard.js +3 -3
  137. package/dist/Icon/Icon.d.ts.map +1 -1
  138. package/dist/Icon/Icon.js +16 -12
  139. package/dist/Icon/defaultIcons.js +116 -116
  140. package/dist/IconButton/IconButton.js +3 -3
  141. package/dist/InputGroup/InputGroup.js +11 -11
  142. package/dist/InputGroup/InputGroupText.js +3 -3
  143. package/dist/Item/Item.js +18 -18
  144. package/dist/Kbd/Kbd.js +5 -5
  145. package/dist/Layer/LayerProvider.js +7 -7
  146. package/dist/Layer/useLayer.d.ts +29 -2
  147. package/dist/Layer/useLayer.d.ts.map +1 -1
  148. package/dist/Layer/useLayer.js +44 -31
  149. package/dist/Layout/Layout.js +21 -21
  150. package/dist/Layout/LayoutContent.js +3 -3
  151. package/dist/Layout/LayoutFooter.js +5 -5
  152. package/dist/Layout/LayoutHeader.js +5 -5
  153. package/dist/Layout/LayoutPanel.js +3 -3
  154. package/dist/Lightbox/Lightbox.d.ts.map +1 -1
  155. package/dist/Lightbox/Lightbox.js +55 -31
  156. package/dist/Lightbox/useLightbox.js +3 -3
  157. package/dist/Link/Link.js +15 -15
  158. package/dist/Link/LinkProvider.js +3 -3
  159. package/dist/Link/useLinkify.js +3 -3
  160. package/dist/List/List.js +11 -11
  161. package/dist/List/ListItem.js +11 -11
  162. package/dist/Markdown/Markdown.d.ts.map +1 -1
  163. package/dist/Markdown/Markdown.js +102 -102
  164. package/dist/MetadataList/MetadataList.js +10 -10
  165. package/dist/MetadataList/MetadataListItem.js +15 -15
  166. package/dist/MobileNav/MobileNav.d.ts +1 -1
  167. package/dist/MobileNav/MobileNav.d.ts.map +1 -1
  168. package/dist/MobileNav/MobileNav.js +26 -23
  169. package/dist/MobileNav/MobileNavToggle.js +5 -5
  170. package/dist/MoreMenu/MoreMenu.js +3 -3
  171. package/dist/MultiSelector/MultiSelector.js +56 -56
  172. package/dist/NavIcon/NavIcon.js +3 -3
  173. package/dist/NavMenu/NavHeadingMenu.js +5 -5
  174. package/dist/NavMenu/NavHeadingMenuItem.js +8 -8
  175. package/dist/NumberInput/NumberInput.d.ts.map +1 -1
  176. package/dist/NumberInput/NumberInput.js +48 -32
  177. package/dist/Outline/Outline.js +15 -15
  178. package/dist/OverflowList/OverflowList.js +8 -8
  179. package/dist/Overlay/Overlay.js +3 -3
  180. package/dist/Overlay/OverlayScrim.js +5 -5
  181. package/dist/Overlay/useOverlay.js +3 -3
  182. package/dist/Pagination/Pagination.d.ts +1 -1
  183. package/dist/Pagination/Pagination.d.ts.map +1 -1
  184. package/dist/Pagination/Pagination.js +125 -72
  185. package/dist/Popover/Popover.js +16 -16
  186. package/dist/Popover/usePopover.js +7 -7
  187. package/dist/PowerSearch/PowerSearch.d.ts.map +1 -1
  188. package/dist/PowerSearch/PowerSearch.js +110 -92
  189. package/dist/PowerSearch/PowerSearchEditPopover.js +84 -84
  190. package/dist/PowerSearch/PowerSearchFilterEditor.js +3 -3
  191. package/dist/PowerSearch/PowerSearchToken.js +5 -5
  192. package/dist/PowerSearch/PowerSearchValueEditor.js +54 -54
  193. package/dist/ProgressBar/ProgressBar.d.ts.map +1 -1
  194. package/dist/ProgressBar/ProgressBar.js +25 -18
  195. package/dist/RadioList/RadioList.js +7 -7
  196. package/dist/RadioList/RadioListItem.d.ts +1 -1
  197. package/dist/RadioList/RadioListItem.d.ts.map +1 -1
  198. package/dist/RadioList/RadioListItem.js +24 -21
  199. package/dist/Resizable/ResizeHandle.d.ts.map +1 -1
  200. package/dist/Resizable/ResizeHandle.js +28 -10
  201. package/dist/Section/Section.js +5 -5
  202. package/dist/SegmentedControl/SegmentedControl.d.ts +1 -1
  203. package/dist/SegmentedControl/SegmentedControl.d.ts.map +1 -1
  204. package/dist/SegmentedControl/SegmentedControl.js +32 -10
  205. package/dist/SegmentedControl/SegmentedControlItem.d.ts +1 -1
  206. package/dist/SegmentedControl/SegmentedControlItem.d.ts.map +1 -1
  207. package/dist/SegmentedControl/SegmentedControlItem.js +18 -12
  208. package/dist/SelectableCard/SelectableCard.js +5 -5
  209. package/dist/Selector/Selector.js +46 -46
  210. package/dist/Selector/SelectorOption.js +3 -3
  211. package/dist/SideNav/SideNav.d.ts.map +1 -1
  212. package/dist/SideNav/SideNav.js +38 -34
  213. package/dist/SideNav/SideNavCollapseButton.d.ts +1 -1
  214. package/dist/SideNav/SideNavCollapseButton.d.ts.map +1 -1
  215. package/dist/SideNav/SideNavCollapseButton.js +8 -6
  216. package/dist/SideNav/SideNavHeading.js +87 -87
  217. package/dist/SideNav/SideNavItem.js +42 -42
  218. package/dist/SideNav/SideNavSection.d.ts +1 -1
  219. package/dist/SideNav/SideNavSection.d.ts.map +1 -1
  220. package/dist/SideNav/SideNavSection.js +18 -16
  221. package/dist/Skeleton/Skeleton.js +3 -3
  222. package/dist/Slider/Slider.js +23 -23
  223. package/dist/Spinner/Spinner.js +9 -9
  224. package/dist/StatusDot/StatusDot.js +5 -5
  225. package/dist/Switch/Switch.d.ts +8 -4
  226. package/dist/Switch/Switch.d.ts.map +1 -1
  227. package/dist/Switch/Switch.js +34 -29
  228. package/dist/TabList/Tab.js +18 -18
  229. package/dist/TabList/TabList.js +5 -5
  230. package/dist/TabList/TabMenu.d.ts.map +1 -1
  231. package/dist/TabList/TabMenu.js +57 -30
  232. package/dist/TabList/tab.markers.stylex.d.ts +1 -1
  233. package/dist/Table/BaseTable.d.ts.map +1 -1
  234. package/dist/Table/BaseTable.js +44 -39
  235. package/dist/Table/Table.js +7 -7
  236. package/dist/Table/TableBody.d.ts +1 -1
  237. package/dist/Table/TableBody.d.ts.map +1 -1
  238. package/dist/Table/TableBody.js +9 -5
  239. package/dist/Table/TableCell.js +3 -3
  240. package/dist/Table/TableFooter.d.ts +1 -1
  241. package/dist/Table/TableFooter.d.ts.map +1 -1
  242. package/dist/Table/TableFooter.js +9 -5
  243. package/dist/Table/TableHeader.d.ts +1 -1
  244. package/dist/Table/TableHeader.d.ts.map +1 -1
  245. package/dist/Table/TableHeader.js +9 -5
  246. package/dist/Table/TableHeaderCell.js +3 -3
  247. package/dist/Table/TableRow.js +5 -5
  248. package/dist/Table/plugins/columnResize/useTableColumnResize.js +9 -9
  249. package/dist/Table/plugins/filtering/useTableFiltering.js +71 -71
  250. package/dist/Table/plugins/pagination/paginateData.d.ts.map +1 -1
  251. package/dist/Table/plugins/pagination/paginateData.js +5 -1
  252. package/dist/Table/plugins/pagination/useTablePagination.js +7 -7
  253. package/dist/Table/plugins/rowExpansion/useTableRowExpansion.js +22 -22
  254. package/dist/Table/plugins/selection/useTableSelection.js +18 -18
  255. package/dist/Table/plugins/selection/useTableSelectionState.d.ts.map +1 -1
  256. package/dist/Table/plugins/selection/useTableSelectionState.js +11 -1
  257. package/dist/Table/plugins/sortable/useTableSortable.js +17 -17
  258. package/dist/Table/plugins/sortable/useTableSortableState.d.ts.map +1 -1
  259. package/dist/Table/plugins/sortable/useTableSortableState.js +8 -4
  260. package/dist/Table/tableContextMenu.js +9 -9
  261. package/dist/Text/Text.js +10 -10
  262. package/dist/TextArea/TextArea.js +14 -14
  263. package/dist/TextInput/TextInput.js +15 -15
  264. package/dist/Thumbnail/Thumbnail.js +29 -29
  265. package/dist/TimeInput/TimeInput.d.ts.map +1 -1
  266. package/dist/TimeInput/TimeInput.js +26 -21
  267. package/dist/Timestamp/Timestamp.d.ts +1 -1
  268. package/dist/Timestamp/Timestamp.d.ts.map +1 -1
  269. package/dist/Timestamp/Timestamp.js +37 -26
  270. package/dist/Toast/Toast.d.ts.map +1 -1
  271. package/dist/Toast/Toast.js +25 -17
  272. package/dist/Toast/ToastViewport.d.ts.map +1 -1
  273. package/dist/Toast/ToastViewport.js +23 -11
  274. package/dist/Toast/useToast.d.ts.map +1 -1
  275. package/dist/Toast/useToast.js +44 -4
  276. package/dist/ToggleButton/ToggleButton.js +12 -12
  277. package/dist/ToggleButton/ToggleButtonGroup.js +5 -5
  278. package/dist/Token/Token.js +21 -21
  279. package/dist/Tokenizer/Tokenizer.d.ts.map +1 -1
  280. package/dist/Tokenizer/Tokenizer.js +36 -34
  281. package/dist/Toolbar/Toolbar.js +18 -18
  282. package/dist/Tooltip/Tooltip.js +11 -11
  283. package/dist/Tooltip/useTooltip.d.ts +5 -1
  284. package/dist/Tooltip/useTooltip.d.ts.map +1 -1
  285. package/dist/Tooltip/useTooltip.js +3 -3
  286. package/dist/TopNav/TopNav.js +32 -32
  287. package/dist/TopNav/TopNavHeading.js +67 -67
  288. package/dist/TopNav/TopNavItem.js +5 -5
  289. package/dist/TopNav/TopNavMegaMenu.js +30 -30
  290. package/dist/TopNav/TopNavMegaMenuFeaturedCard.d.ts +1 -1
  291. package/dist/TopNav/TopNavMegaMenuFeaturedCard.d.ts.map +1 -1
  292. package/dist/TopNav/TopNavMegaMenuFeaturedCard.js +25 -14
  293. package/dist/TopNav/TopNavMegaMenuItem.js +16 -16
  294. package/dist/TopNav/TopNavMenu.js +32 -32
  295. package/dist/TreeList/TreeList.js +8 -8
  296. package/dist/TreeList/TreeListBranches.js +11 -11
  297. package/dist/TreeList/TreeListItem.js +30 -30
  298. package/dist/Typeahead/BaseTypeahead.d.ts.map +1 -1
  299. package/dist/Typeahead/BaseTypeahead.js +23 -20
  300. package/dist/Typeahead/Typeahead.js +12 -12
  301. package/dist/Typeahead/TypeaheadItem.js +10 -10
  302. package/dist/VStack/VStack.js +3 -3
  303. package/dist/astryx.css +6 -0
  304. package/dist/astryx.umd.js +60 -60
  305. package/dist/astryx.umd.js.map +4 -4
  306. package/dist/docs-types.d.ts +8 -2
  307. package/dist/docs-types.d.ts.map +1 -1
  308. package/dist/hooks/focusableSelector.d.ts +1 -1
  309. package/dist/hooks/focusableSelector.d.ts.map +1 -1
  310. package/dist/hooks/focusableSelector.js +1 -1
  311. package/dist/hooks/index.d.ts +2 -0
  312. package/dist/hooks/index.d.ts.map +1 -1
  313. package/dist/hooks/index.js +1 -0
  314. package/dist/hooks/useFocusTrap.d.ts +3 -0
  315. package/dist/hooks/useFocusTrap.d.ts.map +1 -1
  316. package/dist/hooks/useFocusTrap.js +38 -1
  317. package/dist/hooks/useHotkeys.d.ts +51 -0
  318. package/dist/hooks/useHotkeys.d.ts.map +1 -0
  319. package/dist/hooks/useHotkeys.js +160 -0
  320. package/dist/hooks/useInteractiveRole.d.ts +6 -2
  321. package/dist/hooks/useInteractiveRole.d.ts.map +1 -1
  322. package/dist/hooks/useInteractiveRole.js +6 -2
  323. package/dist/hooks/useKeyboardHint.js +9 -9
  324. package/dist/hooks/useStreamingText.d.ts +3 -1
  325. package/dist/hooks/useStreamingText.d.ts.map +1 -1
  326. package/dist/hooks/useStreamingText.js +14 -5
  327. package/dist/theme/MediaTheme.js +3 -3
  328. package/dist/theme/Theme.js +7 -7
  329. package/dist/theme/hct.d.ts +0 -15
  330. package/dist/theme/hct.d.ts.map +1 -1
  331. package/dist/theme/hct.js +9 -9
  332. package/dist/theme/syntax/SyntaxTheme.js +5 -5
  333. package/dist/theme/tokens.d.ts +10 -2
  334. package/dist/theme/tokens.d.ts.map +1 -1
  335. package/dist/theme/tokens.js +220 -4
  336. package/dist/theme/useTheme.d.ts +3 -2
  337. package/dist/theme/useTheme.d.ts.map +1 -1
  338. package/dist/theme/useTheme.js +73 -6
  339. package/dist/utils/color.d.ts +42 -0
  340. package/dist/utils/color.d.ts.map +1 -0
  341. package/dist/utils/color.js +150 -0
  342. package/dist/utils/composeEventHandlers.d.ts +30 -0
  343. package/dist/utils/composeEventHandlers.d.ts.map +1 -0
  344. package/dist/utils/composeEventHandlers.js +40 -0
  345. package/dist/utils/index.d.ts +3 -0
  346. package/dist/utils/index.d.ts.map +1 -1
  347. package/dist/utils/index.js +3 -1
  348. package/dist/utils/timeParser.d.ts.map +1 -1
  349. package/dist/utils/timeParser.js +8 -5
  350. package/package.json +3 -3
  351. package/src/AlertDialog/AlertDialog.doc.mjs +4 -0
  352. package/src/AlertDialog/AlertDialog.tsx +2 -0
  353. package/src/AppShell/AppShell.tsx +2 -0
  354. package/src/AspectRatio/AspectRatio.doc.mjs +28 -1
  355. package/src/AspectRatio/AspectRatio.test.tsx +142 -1
  356. package/src/AspectRatio/AspectRatio.tsx +70 -10
  357. package/src/AspectRatio/index.ts +5 -1
  358. package/src/Avatar/Avatar.doc.mjs +11 -0
  359. package/src/Avatar/Avatar.test.tsx +32 -1
  360. package/src/Avatar/Avatar.tsx +14 -22
  361. package/src/Avatar/AvatarStatusDot.tsx +2 -2
  362. package/src/AvatarGroup/AvatarGroup.doc.mjs +1 -0
  363. package/src/AvatarGroup/AvatarGroup.tsx +2 -2
  364. package/src/AvatarGroup/AvatarGroupOverflow.tsx +2 -2
  365. package/src/Banner/Banner.doc.mjs +8 -0
  366. package/src/Banner/Banner.test.tsx +38 -0
  367. package/src/Banner/Banner.tsx +8 -1
  368. package/src/Calendar/Calendar.test.tsx +31 -16
  369. package/src/Calendar/Calendar.tsx +3 -0
  370. package/src/Calendar/dayCellUtils.ts +3 -1
  371. package/src/Card/Card.doc.mjs +1 -1
  372. package/src/Card/Card.tsx +16 -6
  373. package/src/Carousel/Carousel.tsx +3 -2
  374. package/src/Chat/Chat.doc.mjs +1 -1
  375. package/src/Chat/ChatComposerInput.test.tsx +27 -1
  376. package/src/Chat/ChatComposerInput.tsx +20 -15
  377. package/src/Chat/ChatDictationButton.test.tsx +43 -0
  378. package/src/Chat/ChatDictationButton.tsx +4 -4
  379. package/src/Chat/ChatLayoutScrollButton.test.tsx +33 -0
  380. package/src/Chat/ChatLayoutScrollButton.tsx +3 -1
  381. package/src/Chat/ChatMessageMetadata.test.tsx +32 -0
  382. package/src/Chat/ChatMessageMetadata.tsx +4 -6
  383. package/src/Chat/ChatSystemMessage.test.tsx +26 -11
  384. package/src/Chat/ChatSystemMessage.tsx +7 -7
  385. package/src/Chat/ChatTokenizedText.test.tsx +29 -16
  386. package/src/Chat/ChatTokenizedText.tsx +15 -8
  387. package/src/Chat/ChatToolCalls.test.tsx +55 -0
  388. package/src/Chat/ChatToolCalls.tsx +10 -12
  389. package/src/Chat/index.ts +1 -4
  390. package/src/Chat/useTriggerMenu.tsx +1 -4
  391. package/src/CheckboxInput/CheckboxInput.doc.mjs +3 -3
  392. package/src/CheckboxInput/CheckboxInput.test.tsx +71 -4
  393. package/src/CheckboxInput/CheckboxInput.tsx +2 -0
  394. package/src/CheckboxList/CheckboxList.test.tsx +19 -0
  395. package/src/CheckboxList/CheckboxListItem.tsx +11 -2
  396. package/src/Citation/Citation.doc.mjs +5 -0
  397. package/src/ClickableCard/ClickableCard.tsx +45 -2
  398. package/src/CodeBlock/CodeBlock.doc.mjs +2 -2
  399. package/src/CodeBlock/CodeBlock.test.tsx +98 -2
  400. package/src/CodeBlock/CodeBlock.tsx +44 -2
  401. package/src/Collapsible/Collapsible.doc.mjs +8 -8
  402. package/src/Collapsible/Collapsible.test.tsx +403 -0
  403. package/src/Collapsible/Collapsible.tsx +21 -5
  404. package/src/Collapsible/CollapsibleGroup.doc.mjs +9 -9
  405. package/src/Collapsible/CollapsibleGroup.test.tsx +73 -31
  406. package/src/Collapsible/CollapsibleGroup.tsx +27 -37
  407. package/src/Collapsible/CollapsibleGroupContext.tsx +3 -11
  408. package/src/Collapsible/index.ts +1 -4
  409. package/src/Collapsible/useCollapsible.ts +20 -6
  410. package/src/CommandPalette/CommandPalette.doc.mjs +5 -0
  411. package/src/CommandPalette/CommandPalette.tsx +5 -3
  412. package/src/CommandPalette/CommandPaletteEmpty.doc.mjs +5 -0
  413. package/src/CommandPalette/CommandPaletteGroup.doc.mjs +10 -0
  414. package/src/CommandPalette/CommandPaletteInput.doc.mjs +6 -0
  415. package/src/CommandPalette/CommandPaletteItem.doc.mjs +6 -0
  416. package/src/CommandPalette/CommandPaletteList.doc.mjs +9 -0
  417. package/src/ContextMenu/ContextMenu.doc.mjs +15 -0
  418. package/src/ContextMenu/ContextMenu.test.tsx +87 -0
  419. package/src/ContextMenu/ContextMenu.tsx +87 -28
  420. package/src/ContextMenu/ContextMenuItem.doc.mjs +6 -0
  421. package/src/DateInput/DateInput.test.tsx +11 -20
  422. package/src/DateRangeInput/DateRangeInput.doc.mjs +9 -6
  423. package/src/DateRangeInput/DateRangeInput.test.tsx +31 -44
  424. package/src/DateTimeInput/DateTimeInput.doc.mjs +3 -2
  425. package/src/DateTimeInput/DateTimeInput.test.tsx +118 -16
  426. package/src/DateTimeInput/DateTimeInput.tsx +8 -2
  427. package/src/DateTimeInput/index.ts +1 -0
  428. package/src/Dialog/Dialog.doc.mjs +4 -0
  429. package/src/Dialog/DialogHeader.doc.mjs +45 -0
  430. package/src/DropdownMenu/DropdownMenu.doc.mjs +1 -1
  431. package/src/DropdownMenu/DropdownMenu.test.tsx +22 -2
  432. package/src/DropdownMenu/DropdownMenuItem.tsx +5 -17
  433. package/src/EmptyState/EmptyState.doc.mjs +1 -1
  434. package/src/Field/Field.test.tsx +1 -4
  435. package/src/Field/FieldLabel.test.tsx +2 -2
  436. package/src/FieldStatus/FieldStatus.test.tsx +282 -0
  437. package/src/Grid/Grid.test.tsx +43 -18
  438. package/src/Grid/Grid.tsx +26 -9
  439. package/src/HoverCard/HoverCard.doc.mjs +6 -6
  440. package/src/HoverCard/useHoverCard.doc.mjs +5 -5
  441. package/src/HoverCard/useHoverCard.tsx +9 -2
  442. package/src/Icon/Icon.test.tsx +41 -29
  443. package/src/Icon/Icon.tsx +6 -2
  444. package/src/InputGroup/InputGroup.doc.mjs +1 -0
  445. package/src/InputGroup/InputGroup.tsx +2 -2
  446. package/src/InteractiveRoleContext/InteractiveRoleContext.test.tsx +185 -0
  447. package/src/Item/Item.tsx +1 -1
  448. package/src/Layer/useLayer.doc.mjs +2 -2
  449. package/src/Layer/useLayer.test.tsx +221 -2
  450. package/src/Layer/useLayer.tsx +69 -30
  451. package/src/Layout/Layout.test.tsx +285 -0
  452. package/src/Layout/LayoutSlots.test.tsx +364 -0
  453. package/src/Lightbox/Lightbox.doc.mjs +5 -0
  454. package/src/Lightbox/Lightbox.test.tsx +123 -2
  455. package/src/Lightbox/Lightbox.tsx +29 -1
  456. package/src/Markdown/Markdown.tsx +9 -7
  457. package/src/Markdown/parser.perf.test.ts +34 -12
  458. package/src/MobileNav/MobileNav.test.tsx +56 -0
  459. package/src/MobileNav/MobileNav.tsx +13 -8
  460. package/src/NavMenu/NavMenu.doc.mjs +6 -0
  461. package/src/NumberInput/NumberInput.test.tsx +48 -3
  462. package/src/NumberInput/NumberInput.tsx +32 -15
  463. package/src/Outline/Outline.doc.mjs +2 -0
  464. package/src/Outline/parseOutlineFromMarkdown.test.ts +80 -0
  465. package/src/OverflowList/OverflowList.test.tsx +416 -0
  466. package/src/Overlay/Overlay.doc.mjs +6 -0
  467. package/src/Overlay/Overlay.test.tsx +356 -0
  468. package/src/Pagination/Pagination.test.tsx +162 -0
  469. package/src/Pagination/Pagination.tsx +80 -26
  470. package/src/Popover/Popover.doc.mjs +6 -6
  471. package/src/Popover/Popover.test.tsx +65 -0
  472. package/src/Popover/usePopover.doc.mjs +1 -1
  473. package/src/PowerSearch/PowerSearch.doc.mjs +2 -2
  474. package/src/PowerSearch/PowerSearch.test.tsx +109 -1
  475. package/src/PowerSearch/PowerSearch.tsx +37 -16
  476. package/src/ProgressBar/ProgressBar.doc.mjs +2 -0
  477. package/src/ProgressBar/ProgressBar.test.tsx +30 -0
  478. package/src/ProgressBar/ProgressBar.tsx +12 -5
  479. package/src/RadioList/RadioList.test.tsx +19 -0
  480. package/src/RadioList/RadioListItem.tsx +9 -4
  481. package/src/Resizable/ResizeHandle.test.tsx +218 -0
  482. package/src/Resizable/ResizeHandle.tsx +22 -4
  483. package/src/SegmentedControl/SegmentedControl.doc.mjs +1 -1
  484. package/src/SegmentedControl/SegmentedControl.test.tsx +192 -0
  485. package/src/SegmentedControl/SegmentedControl.tsx +27 -5
  486. package/src/SegmentedControl/SegmentedControlItem.tsx +9 -4
  487. package/src/SelectableCard/SelectableCard.doc.mjs +1 -1
  488. package/src/Selector/Selector.test.tsx +27 -1
  489. package/src/SideNav/SideNav.doc.mjs +1 -1
  490. package/src/SideNav/SideNav.test.tsx +66 -0
  491. package/src/SideNav/SideNav.tsx +6 -2
  492. package/src/SideNav/SideNavCollapseButton.tsx +4 -3
  493. package/src/SideNav/SideNavSection.tsx +6 -4
  494. package/src/SizeContext/SizeContext.test.tsx +226 -0
  495. package/src/Switch/Switch.doc.mjs +7 -7
  496. package/src/Switch/Switch.test.tsx +102 -3
  497. package/src/Switch/Switch.tsx +20 -7
  498. package/src/TabList/TabList.test.tsx +185 -1
  499. package/src/TabList/TabMenu.tsx +45 -9
  500. package/src/Table/BaseTable.tsx +7 -2
  501. package/src/Table/Table.doc.mjs +6 -1
  502. package/src/Table/Table.test.tsx +64 -0
  503. package/src/Table/TableBody.tsx +15 -2
  504. package/src/Table/TableFooter.tsx +15 -2
  505. package/src/Table/TableHeader.tsx +15 -2
  506. package/src/Table/plugins/pagination/paginateData.ts +5 -1
  507. package/src/Table/plugins/pagination/useTablePagination.test.tsx +13 -0
  508. package/src/Table/plugins/selection/useTableSelectionState.test.tsx +23 -0
  509. package/src/Table/plugins/selection/useTableSelectionState.tsx +11 -6
  510. package/src/Table/plugins/sortable/useTableSortableState.test.tsx +35 -1
  511. package/src/Table/plugins/sortable/useTableSortableState.tsx +8 -4
  512. package/src/TextArea/TextArea.test.tsx +3 -3
  513. package/src/TextInput/TextInput.test.tsx +3 -3
  514. package/src/TimeInput/TimeInput.test.tsx +37 -0
  515. package/src/TimeInput/TimeInput.tsx +11 -1
  516. package/src/Timestamp/Timestamp.doc.mjs +1 -1
  517. package/src/Timestamp/Timestamp.test.tsx +52 -0
  518. package/src/Timestamp/Timestamp.tsx +30 -16
  519. package/src/Toast/Toast.tsx +11 -3
  520. package/src/Toast/ToastViewport.test.tsx +64 -0
  521. package/src/Toast/ToastViewport.tsx +12 -0
  522. package/src/Toast/useToast.test.tsx +258 -0
  523. package/src/Toast/useToast.tsx +41 -0
  524. package/src/ToggleButton/ToggleButton.doc.mjs +1 -0
  525. package/src/Tokenizer/Tokenizer.doc.mjs +2 -2
  526. package/src/Tokenizer/Tokenizer.test.tsx +54 -0
  527. package/src/Tokenizer/Tokenizer.tsx +5 -4
  528. package/src/Tooltip/Tooltip.doc.mjs +6 -6
  529. package/src/Tooltip/useTooltip.doc.mjs +5 -5
  530. package/src/Tooltip/useTooltip.tsx +12 -2
  531. package/src/TopNav/TopNav.doc.mjs +1 -1
  532. package/src/TopNav/TopNav.test.tsx +23 -7
  533. package/src/TopNav/TopNavMegaMenuFeaturedCard.tsx +9 -2
  534. package/src/TreeList/TreeList.doc.mjs +2 -2
  535. package/src/Typeahead/BaseTypeahead.doc.mjs +13 -4
  536. package/src/Typeahead/BaseTypeahead.tsx +5 -2
  537. package/src/Typeahead/Typeahead.doc.mjs +1 -1
  538. package/src/Typeahead/Typeahead.test.tsx +45 -1
  539. package/src/__tests__/TestIcon.tsx +26 -0
  540. package/src/__tests__/fastRoleQueries.ts +66 -0
  541. package/src/docPropReferences.test.ts +2 -2
  542. package/src/docs-types.ts +9 -1
  543. package/src/hooks/focusableSelector.ts +1 -1
  544. package/src/hooks/index.ts +3 -0
  545. package/src/hooks/useFocusTrap.doc.mjs +4 -2
  546. package/src/hooks/useFocusTrap.test.tsx +149 -1
  547. package/src/hooks/useFocusTrap.ts +50 -1
  548. package/src/hooks/useHotkeys.doc.mjs +52 -0
  549. package/src/hooks/useHotkeys.test.ts +245 -0
  550. package/src/hooks/useHotkeys.ts +203 -0
  551. package/src/hooks/useInteractiveRole.ts +12 -4
  552. package/src/hooks/useStreamingText.test.ts +54 -19
  553. package/src/hooks/useStreamingText.ts +16 -5
  554. package/src/hooks/useTreeFocus.test.tsx +1 -3
  555. package/src/reset.css +29 -0
  556. package/src/theme/SyntaxTheme.doc.mjs +1 -1
  557. package/src/theme/derivedVarRegistry.test.ts +2 -2
  558. package/src/theme/hct.ts +9 -17
  559. package/src/theme/themingTargets.test.ts +353 -0
  560. package/src/theme/tokens.test.ts +182 -9
  561. package/src/theme/tokens.ts +239 -4
  562. package/src/theme/useTheme.test.tsx +126 -2
  563. package/src/theme/useTheme.ts +87 -6
  564. package/src/utils/color.test.ts +133 -0
  565. package/src/utils/color.ts +148 -0
  566. package/src/utils/composeEventHandlers.test.ts +71 -0
  567. package/src/utils/composeEventHandlers.ts +44 -0
  568. package/src/utils/index.ts +4 -0
  569. package/src/utils/mergeProps.test.ts +166 -0
  570. package/src/utils/sharedResizeObserver.test.ts +2 -2
  571. package/src/utils/timeParser.test.ts +13 -0
  572. package/src/utils/timeParser.ts +8 -5
  573. package/dist/Carousel/carousel.markers.stylex.d.ts +0 -7
  574. package/dist/Carousel/carousel.markers.stylex.d.ts.map +0 -1
  575. package/dist/Carousel/carousel.markers.stylex.js +0 -12
  576. package/src/Carousel/carousel.markers.stylex.ts +0 -10
@@ -89,7 +89,7 @@ export interface AlertDialogProps extends BaseProps<HTMLDialogElement> {
89
89
  * />
90
90
  * ```
91
91
  */
92
- export declare function AlertDialog({ ref, isOpen, isInline, onOpenChange, title, description, cancelLabel, actionLabel, actionVariant, isActionLoading, onAction, width, xstyle, className, style, 'data-testid': testId, }: AlertDialogProps): React.JSX.Element;
92
+ export declare function AlertDialog({ ref, isOpen, isInline, onOpenChange, title, description, cancelLabel, actionLabel, actionVariant, isActionLoading, onAction, width, xstyle, className, style, 'data-testid': testId, ...rest }: AlertDialogProps): React.JSX.Element;
93
93
  export declare namespace AlertDialog {
94
94
  var displayName: string;
95
95
  }
@@ -1 +1 @@
1
- {"version":3,"file":"AlertDialog.d.ts","sourceRoot":"","sources":["../../src/AlertDialog/AlertDialog.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAA2B,MAAM,OAAO,CAAC;AAQhD,OAAO,EAAS,KAAK,aAAa,EAAC,MAAM,WAAW,CAAC;AACrD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAI5C,MAAM,WAAW,gBAAiB,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IACpE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,OAAO,CAAC;IAE3C;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IAEpB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC;IAE9B;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;OAGG;IACH,QAAQ,EAAE,MAAM,OAAO,CAAC;IAExB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,WAAW,CAAC,EAC1B,GAAG,EACH,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,KAAK,EACL,WAAW,EACX,WAAsB,EACtB,WAAW,EACX,aAA6B,EAC7B,eAAe,EACf,QAAQ,EACR,KAAW,EACX,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,GACtB,EAAE,gBAAgB,qBAqDlB;yBAtEe,WAAW"}
1
+ {"version":3,"file":"AlertDialog.d.ts","sourceRoot":"","sources":["../../src/AlertDialog/AlertDialog.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAA2B,MAAM,OAAO,CAAC;AAQhD,OAAO,EAAS,KAAK,aAAa,EAAC,MAAM,WAAW,CAAC;AACrD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAI5C,MAAM,WAAW,gBAAiB,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IACpE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,OAAO,CAAC;IAE3C;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IAEpB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC;IAE9B;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;OAGG;IACH,QAAQ,EAAE,MAAM,OAAO,CAAC;IAExB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,WAAW,CAAC,EAC1B,GAAG,EACH,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,KAAK,EACL,WAAW,EACX,WAAsB,EACtB,WAAW,EACX,aAA6B,EAC7B,eAAe,EACf,QAAQ,EACR,KAAW,EACX,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,IAAI,EACR,EAAE,gBAAgB,qBAsDlB;yBAxEe,WAAW"}
@@ -26,7 +26,7 @@ import { Text } from "../Text/Text.js";
26
26
  import { Button } from "../Button/index.js";
27
27
  import { mergeProps } from "../utils/index.js";
28
28
  import { themeProps } from "../utils/themeProps.js";
29
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
29
+ import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
30
30
  /**
31
31
  * A confirmation dialog for destructive or irreversible actions.
32
32
  *
@@ -62,14 +62,16 @@ export function AlertDialog({
62
62
  xstyle,
63
63
  className,
64
64
  style,
65
- 'data-testid': testId
65
+ 'data-testid': testId,
66
+ ...rest
66
67
  }) {
67
68
  const titleId = useId();
68
69
  const descriptionId = useId();
69
70
  const handleCancel = useCallback(() => {
70
71
  onOpenChange(false);
71
72
  }, [onOpenChange]);
72
- return /*#__PURE__*/_jsx(Dialog, {
73
+ return /*#__PURE__*/_jsxDEV(Dialog, {
74
+ ...rest,
73
75
  ref: ref,
74
76
  isOpen: isOpen,
75
77
  isInline: isInline,
@@ -85,36 +87,36 @@ export function AlertDialog({
85
87
  }),
86
88
  xstyle: xstyle,
87
89
  "data-testid": testId,
88
- children: /*#__PURE__*/_jsx(Layout, {
89
- content: /*#__PURE__*/_jsxs(LayoutContent, {
90
- children: [/*#__PURE__*/_jsx(Heading, {
90
+ children: /*#__PURE__*/_jsxDEV(Layout, {
91
+ content: /*#__PURE__*/_jsxDEV(LayoutContent, {
92
+ children: [/*#__PURE__*/_jsxDEV(Heading, {
91
93
  level: 2,
92
94
  id: titleId,
93
95
  children: title
94
- }), /*#__PURE__*/_jsx(Text, {
96
+ }, void 0, false), /*#__PURE__*/_jsxDEV(Text, {
95
97
  type: "body",
96
98
  color: "secondary",
97
99
  id: descriptionId,
98
100
  children: description
99
- })]
100
- }),
101
- footer: /*#__PURE__*/_jsx(LayoutFooter, {
102
- children: /*#__PURE__*/_jsxs(HStack, {
101
+ }, void 0, false)]
102
+ }, void 0, true),
103
+ footer: /*#__PURE__*/_jsxDEV(LayoutFooter, {
104
+ children: /*#__PURE__*/_jsxDEV(HStack, {
103
105
  gap: 2,
104
106
  hAlign: "end",
105
- children: [/*#__PURE__*/_jsx(Button, {
107
+ children: [/*#__PURE__*/_jsxDEV(Button, {
106
108
  variant: "ghost",
107
109
  label: cancelLabel,
108
110
  onClick: handleCancel
109
- }), /*#__PURE__*/_jsx(Button, {
111
+ }, void 0, false), /*#__PURE__*/_jsxDEV(Button, {
110
112
  variant: actionVariant,
111
113
  label: actionLabel,
112
114
  onClick: onAction,
113
115
  isLoading: isActionLoading
114
- })]
115
- })
116
- })
117
- })
118
- });
116
+ }, void 0, false)]
117
+ }, void 0, true)
118
+ }, void 0, false)
119
+ }, void 0, false)
120
+ }, void 0, false);
119
121
  }
120
122
  AlertDialog.displayName = 'AlertDialog';
@@ -15,7 +15,7 @@
15
15
  */
16
16
  import { useState, useCallback, useMemo } from 'react';
17
17
  import { AlertDialog } from "./AlertDialog.js";
18
- import { jsx as _jsx } from "react/jsx-runtime";
18
+ import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
19
19
  /**
20
20
  * Imperative alert dialog — show/hide without managing state.
21
21
  *
@@ -54,7 +54,7 @@ export function useImperativeAlertDialog() {
54
54
  if (!options) {
55
55
  return null;
56
56
  }
57
- return /*#__PURE__*/_jsx(AlertDialog, {
57
+ return /*#__PURE__*/_jsxDEV(AlertDialog, {
58
58
  ...options,
59
59
  isOpen: isOpen,
60
60
  onOpenChange: open => {
@@ -62,7 +62,7 @@ export function useImperativeAlertDialog() {
62
62
  setIsOpen(false);
63
63
  }
64
64
  }
65
- });
65
+ }, void 0, false);
66
66
  }, [isOpen, options]);
67
67
  return {
68
68
  show,
@@ -214,7 +214,7 @@ export interface AppShellProps extends BaseProps<HTMLDivElement> {
214
214
  * </AppShell>
215
215
  * ```
216
216
  */
217
- export declare function AppShell({ variant, banner, children, contentPadding, 'data-testid': dataTestId, height, mobileNav, sideNav, topNav, xstyle, className, style, ref, }: AppShellProps): React.JSX.Element;
217
+ export declare function AppShell({ variant, banner, children, contentPadding, 'data-testid': dataTestId, height, mobileNav, sideNav, topNav, xstyle, className, style, ref, ...rest }: AppShellProps): React.JSX.Element;
218
218
  export declare namespace AppShell {
219
219
  var displayName: string;
220
220
  }
@@ -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,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAmBf,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAChD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAkC5C;;;;;;GAMG;AACH,MAAM,MAAM,kBAAkB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAE7D;;;;;;;GAOG;AACH;;;;;;;;;;;;GAYG;AACH,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,IAAI,CAAC;IACX,OAAO,EAAE,IAAI,CAAC;IACd,OAAO,EAAE,IAAI,CAAC;IACd,QAAQ,EAAE,IAAI,CAAC;CAChB;AAED;;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;;;OAGG;IACH,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAEhC;;;;;;;;;OASG;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;AAkKD;;;;;;;;;;;;;;;;;;;;;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,GACJ,EAAE,aAAa,qBA+Wf;yBA7Xe,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,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAmBf,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAChD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAkC5C;;;;;;GAMG;AACH,MAAM,MAAM,kBAAkB,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,MAAM,CAAC;AAE7D;;;;;;;GAOG;AACH;;;;;;;;;;;;GAYG;AACH,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,IAAI,CAAC;IACX,OAAO,EAAE,IAAI,CAAC;IACd,OAAO,EAAE,IAAI,CAAC;IACd,QAAQ,EAAE,IAAI,CAAC;CAChB;AAED;;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;;;OAGG;IACH,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAEhC;;;;;;;;;OASG;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;AAkKD;;;;;;;;;;;;;;;;;;;;;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,qBAgXf;yBA/Xe,QAAQ"}
@@ -37,19 +37,19 @@ import { mergeProps, mergeRefs, isRenderable } from "../utils/index.js";
37
37
  import { useMediaQuery } from "../hooks/useMediaQuery.js";
38
38
  import { observeResize, unobserveResize } from "../utils/sharedResizeObserver.js";
39
39
  import { themeProps } from "../utils/themeProps.js";
40
- import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
40
+ import { jsxDEV as _jsxDEV, Fragment as _Fragment } from "react/jsx-dev-runtime";
41
41
  const HasActivity = typeof React.Activity !== 'undefined';
42
42
  const ActivityWrapper = HasActivity ? ({
43
43
  mode,
44
44
  children
45
- }) => /*#__PURE__*/_jsx(React.Activity, {
45
+ }) => /*#__PURE__*/_jsxDEV(React.Activity, {
46
46
  mode: mode,
47
47
  children: children
48
- }) : ({
48
+ }, void 0, false) : ({
49
49
  children
50
- }) => /*#__PURE__*/_jsx(_Fragment, {
50
+ }) => /*#__PURE__*/_jsxDEV(_Fragment, {
51
51
  children: children
52
- });
52
+ }, void 0, false);
53
53
 
54
54
  // =============================================================================
55
55
  // Constants
@@ -218,7 +218,8 @@ export function AppShell({
218
218
  xstyle,
219
219
  className,
220
220
  style,
221
- ref
221
+ ref,
222
+ ...rest
222
223
  }) {
223
224
  // =========================================================================
224
225
  // Parse mobileNav prop — normalize to config, custom element, or disabled
@@ -327,39 +328,39 @@ export function AppShell({
327
328
  const mobileContentValue = hasSideNav && mobileNavHasToggle ?
328
329
  /*#__PURE__*/
329
330
  // eslint-disable-next-line @eslint-react/no-unstable-context-value -- context transports ReactNode; instability is inherent
330
- _jsx(SideNavRenderContext, {
331
+ _jsxDEV(SideNavRenderContext, {
331
332
  value: "drawer-content",
332
333
  children: sideNav
333
- }) : null;
334
+ }, void 0, false) : null;
334
335
  const drawerMobileContentValue = hasSideNav ?
335
336
  /*#__PURE__*/
336
337
  // eslint-disable-next-line @eslint-react/no-unstable-context-value -- context transports ReactNode; instability is inherent
337
- _jsx(SideNavRenderContext, {
338
+ _jsxDEV(SideNavRenderContext, {
338
339
  value: "drawer-content",
339
340
  children: sideNav
340
- }) : null;
341
- const topNavContent = hasTopNav ? isBelowBreakpoint && !mobileNavDisabled && mobileNavReactNode == null ? /*#__PURE__*/_jsx(TopNavMobileContentContext, {
341
+ }, void 0, false) : null;
342
+ const topNavContent = hasTopNav ? isBelowBreakpoint && !mobileNavDisabled && mobileNavReactNode == null ? /*#__PURE__*/_jsxDEV(TopNavMobileContentContext, {
342
343
  value: mobileContentValue,
343
- children: /*#__PURE__*/_jsx(TopNavRenderContext, {
344
+ children: /*#__PURE__*/_jsxDEV(TopNavRenderContext, {
344
345
  value: "mobile-bar",
345
346
  children: topNav
346
- })
347
- }) : topNav : null;
348
- const headerInner = hasTopNav || hasBanner ? /*#__PURE__*/_jsxs(LayoutHeader, {
347
+ }, void 0, false)
348
+ }, void 0, false) : topNav : null;
349
+ const headerInner = hasTopNav || hasBanner ? /*#__PURE__*/_jsxDEV(LayoutHeader, {
349
350
  padding: 0,
350
351
  hasDivider: navHasDividers && hasTopNav,
351
- children: [hasBanner && /*#__PURE__*/_jsx("div", {
352
+ children: [hasBanner && /*#__PURE__*/_jsxDEV("div", {
352
353
  ...stylex.props(styles.banner, navAreaStyle),
353
354
  children: banner
354
- }), hasTopNav && topNavContent]
355
- }) : undefined;
356
- const headerContent = headerInner != null ? /*#__PURE__*/_jsx("div", {
355
+ }, void 0, false), hasTopNav && topNavContent]
356
+ }, void 0, true) : undefined;
357
+ const headerContent = headerInner != null ? /*#__PURE__*/_jsxDEV("div", {
357
358
  ref: headerRef,
358
359
  ...mergeProps(themeProps('app-shell-header', {
359
360
  variant
360
361
  }), stylex.props(navAreaStyle, isAuto && styles.headerSticky)),
361
362
  children: headerInner
362
- }) : undefined;
363
+ }, void 0, false) : undefined;
363
364
 
364
365
  // =========================================================================
365
366
  // Build sideNav content
@@ -369,7 +370,7 @@ export function AppShell({
369
370
  // below the header while the main content scrolls. A wrapper div applies
370
371
  // the sticky behavior since LayoutPanel doesn't accept style/className.
371
372
  // =========================================================================
372
- const sideNavPanel = showSideNavInline ? /*#__PURE__*/_jsx(LayoutPanel, {
373
+ const sideNavPanel = showSideNavInline ? /*#__PURE__*/_jsxDEV(LayoutPanel, {
373
374
  padding: 0,
374
375
  hasDivider: navHasDividers,
375
376
  isScrollable: isFill,
@@ -378,36 +379,36 @@ export function AppShell({
378
379
  }),
379
380
  xstyle: [navAreaStyle, isAuto && stickyBgStyle, isAuto && styles.panelAutoFill],
380
381
  children: sideNav
381
- }) : undefined;
382
- const sideNavContent = sideNavPanel != null && isAuto ? /*#__PURE__*/_jsx("div", {
382
+ }, void 0, false) : undefined;
383
+ const sideNavContent = sideNavPanel != null && isAuto ? /*#__PURE__*/_jsxDEV("div", {
383
384
  ...{
384
385
  className: "x2lah0s x7giv3 x7wzq59 xepuwc7 x16zugyo x78zum5 xdt5ytf"
385
386
  },
386
387
  children: sideNavPanel
387
- }) : sideNavPanel;
388
+ }, void 0, false) : sideNavPanel;
388
389
 
389
390
  // =========================================================================
390
391
  // Build main content
391
392
  // =========================================================================
392
393
  const shouldElevateWithCorner = isElevated && hasTopNav && showSideNavInline;
393
- const mainInner = /*#__PURE__*/_jsx(LayoutContent, {
394
+ const mainInner = /*#__PURE__*/_jsxDEV(LayoutContent, {
394
395
  padding: contentPadding ?? 0,
395
396
  role: "main",
396
397
  id: MAIN_CONTENT_ID,
397
398
  isScrollable: isFill,
398
399
  xstyle: contentAreaStyle,
399
400
  children: children
400
- });
401
- const mainContent = shouldElevateWithCorner ? /*#__PURE__*/_jsxs("div", {
401
+ }, void 0, false);
402
+ const mainContent = shouldElevateWithCorner ? /*#__PURE__*/_jsxDEV("div", {
402
403
  ...{
403
404
  className: "x1n2onr6 x78zum5 x98rzlu x2lwn1j x5yr21d"
404
405
  },
405
- children: [/*#__PURE__*/_jsx("div", {
406
+ children: [/*#__PURE__*/_jsxDEV("div", {
406
407
  ...{
407
408
  className: "x10l6tqk x10a8y8t x10xzikg x183tx6i x47corl"
408
409
  }
409
- }), mainInner]
410
- }) : mainInner;
410
+ }, void 0, false), mainInner]
411
+ }, void 0, true) : mainInner;
411
412
 
412
413
  // =========================================================================
413
414
  // Render
@@ -423,63 +424,64 @@ export function AppShell({
423
424
 
424
425
  // For sidenav-only layouts with no TopNav, render the sideNav in topbar
425
426
  // mode — it shows heading + footer icons horizontally, with the hamburger
426
- const autoMobileTopBar = shouldShowAutoToggle && !hasTopNav && hasSideNav ? /*#__PURE__*/_jsx("div", {
427
+ const autoMobileTopBar = shouldShowAutoToggle && !hasTopNav && hasSideNav ? /*#__PURE__*/_jsxDEV("div", {
427
428
  ...mergeProps(themeProps('app-shell-header', {
428
429
  variant
429
430
  }), stylex.props(navAreaStyle, isAuto && styles.headerSticky)),
430
- children: /*#__PURE__*/_jsx(LayoutHeader, {
431
+ children: /*#__PURE__*/_jsxDEV(LayoutHeader, {
431
432
  padding: 0,
432
433
  hasDivider: navHasDividers,
433
- children: /*#__PURE__*/_jsxs("div", {
434
+ children: /*#__PURE__*/_jsxDEV("div", {
434
435
  ...{
435
436
  className: "x78zum5 x6s0dn4 x1k15mir xf314gf"
436
437
  },
437
438
  role: "navigation",
438
439
  "aria-label": "Mobile navigation",
439
- children: [/*#__PURE__*/_jsx(SideNavRenderContext, {
440
+ children: [/*#__PURE__*/_jsxDEV(SideNavRenderContext, {
440
441
  value: "topbar",
441
442
  children: sideNav
442
- }), /*#__PURE__*/_jsx(MobileNavToggle, {})]
443
- })
444
- })
445
- }) : undefined;
446
- return /*#__PURE__*/_jsx(AppShellMobileContext, {
443
+ }, void 0, false), /*#__PURE__*/_jsxDEV(MobileNavToggle, {}, void 0, false)]
444
+ }, void 0, true)
445
+ }, void 0, false)
446
+ }, void 0, false) : undefined;
447
+ return /*#__PURE__*/_jsxDEV(AppShellMobileContext, {
447
448
  value: mobileContextValue,
448
- children: /*#__PURE__*/_jsxs("div", {
449
+ children: /*#__PURE__*/_jsxDEV("div", {
450
+ ...rest,
449
451
  ref: mergeRefs(ref, shellRef),
450
452
  "data-testid": dataTestId,
451
453
  ...mergeProps(themeProps('app-shell', {
452
454
  variant
453
455
  }), stylex.props(styles.root, variant === 'wash' ? styles.variantWash : variant === 'surface' ? styles.variantSurface : variant === 'section' ? styles.variantSection : styles.variantElevated, isFill ? styles.rootFill : styles.rootAuto, xstyle), className, style),
454
- children: [/*#__PURE__*/_jsx("a", {
456
+ children: [/*#__PURE__*/_jsxDEV("a", {
455
457
  href: `#${MAIN_CONTENT_ID}`,
456
458
  ...{
457
459
  className: "x10l6tqk x1xrnuwo x1i1rx1s x1jqxupm xjm9jq1 x15cytp8 xt970qd xh2mrf5 xnjsko4 x1cf3d6k xkdpibf x1y5lnwp xb3r6kr xomzh7y x1hyvwdk x1rsz1da xuxw1ft x1hbpcn8 xc342km x13vifvy x1rw3289 x1o0tod xodanix x10xzikg xjse4m1 x1q2oy4v x1hl2dhg x2mo6ok xjm74w1"
458
460
  },
459
461
  "data-testid": "skip-to-content",
460
462
  children: "Skip to content"
461
- }), /*#__PURE__*/_jsx(Layout, {
463
+ }, void 0, false), /*#__PURE__*/_jsxDEV(Layout, {
462
464
  height: height,
463
465
  padding: 0,
464
- header: /*#__PURE__*/_jsxs(_Fragment, {
466
+ header: /*#__PURE__*/_jsxDEV(_Fragment, {
465
467
  children: [headerContent, autoMobileTopBar]
466
- }),
468
+ }, void 0, true),
467
469
  start: sideNavContent,
468
470
  content: mainContent
469
- }), shouldRenderMobileNavReactNode && mobileNavReactNode, shouldRenderConfigContent && mobileNavConfigContent, isBelowBreakpoint && !mobileNavDisabled && mobileNavReactNode == null && !mobileNavConfigContent && /*#__PURE__*/_jsxs(ActivityWrapper, {
471
+ }, void 0, false), shouldRenderMobileNavReactNode && mobileNavReactNode, shouldRenderConfigContent && mobileNavConfigContent, isBelowBreakpoint && !mobileNavDisabled && mobileNavReactNode == null && !mobileNavConfigContent && /*#__PURE__*/_jsxDEV(ActivityWrapper, {
470
472
  mode: isMobileNavOpen ? 'visible' : 'hidden',
471
- children: [hasSideNav && !hasTopNav && /*#__PURE__*/_jsx(SideNavRenderContext, {
473
+ children: [hasSideNav && !hasTopNav && /*#__PURE__*/_jsxDEV(SideNavRenderContext, {
472
474
  value: "drawer",
473
475
  children: sideNav
474
- }), hasTopNav && /*#__PURE__*/_jsx(TopNavMobileContentContext, {
476
+ }, void 0, false), hasTopNav && /*#__PURE__*/_jsxDEV(TopNavMobileContentContext, {
475
477
  value: drawerMobileContentValue,
476
- children: /*#__PURE__*/_jsx(TopNavRenderContext, {
478
+ children: /*#__PURE__*/_jsxDEV(TopNavRenderContext, {
477
479
  value: "drawer",
478
480
  children: topNav
479
- })
480
- })]
481
- })]
482
- })
483
- });
481
+ }, void 0, false)
482
+ }, void 0, false)]
483
+ }, void 0, true)]
484
+ }, void 0, true)
485
+ }, void 0, false);
484
486
  }
485
487
  AppShell.displayName = 'AppShell';
@@ -1,12 +1,13 @@
1
1
  /**
2
2
  * @file AspectRatio.tsx
3
3
  * @input Uses React, stylex
4
- * @output Exports AspectRatio component and AspectRatioProps
4
+ * @output Exports AspectRatio component, AspectRatioProps, AspectRatioShape, AspectRatioFit
5
5
  * @position AspectRatio component; maintains a specific aspect ratio for its children
6
6
  *
7
7
  * SYNC: When modified, update these files to stay in sync:
8
8
  * - /packages/core/src/AspectRatio/AspectRatio.doc.mjs
9
9
  * - /packages/core/src/AspectRatio/AspectRatio.test.tsx
10
+ * - /packages/core/src/reset.css (AspectRatio fit baseline rules)
10
11
  * - /apps/storybook/stories/AspectRatio.stories.tsx
11
12
  * - /packages/cli/templates/blocks/components/AspectRatio/ (showcase blocks)
12
13
  */
@@ -19,6 +20,15 @@ import type { BaseProps } from '../BaseProps';
19
20
  * this renders a circle at `ratio={1}` and an oval at non-square ratios.
20
21
  */
21
22
  export type AspectRatioShape = 'rectangle' | 'ellipse';
23
+ /**
24
+ * How the child is sized and positioned inside the ratio box.
25
+ * - `cover`: the child fills the box; media is cropped to preserve its own
26
+ * aspect ratio (`object-fit: cover`).
27
+ * - `contain`: the child fills the box; media is letterboxed to stay fully
28
+ * visible (`object-fit: contain`).
29
+ * - `center`: the child keeps its natural size and sits centered in the box.
30
+ */
31
+ export type AspectRatioFit = 'cover' | 'contain' | 'center';
22
32
  export interface AspectRatioProps extends BaseProps<HTMLDivElement> {
23
33
  /** Ref forwarded to the root element */
24
34
  ref?: React.Ref<HTMLDivElement>;
@@ -30,19 +40,43 @@ export interface AspectRatioProps extends BaseProps<HTMLDivElement> {
30
40
  * The shape of the container. Both shapes respect the provided `ratio`.
31
41
  * - `rectangle` (default): a standard rectangular container.
32
42
  * - `ellipse`: clips the container to an ellipse — a circle when `ratio={1}`,
33
- * or an oval at other ratios. Pair with a child that fills the container
34
- * (e.g. an image with `objectFit: 'cover'`).
43
+ * or an oval at other ratios. Pair with `fit="cover"` so the media fills
44
+ * the clipped container.
35
45
  *
36
46
  * @default 'rectangle'
37
47
  *
38
48
  * @example
39
49
  * ```
40
- * <AspectRatio ratio={1} shape="ellipse">
41
- * <img src="avatar.jpg" alt="" style={{objectFit: 'cover'}} />
50
+ * <AspectRatio ratio={1} shape="ellipse" fit="cover">
51
+ * <img src="avatar.jpg" alt="" />
42
52
  * </AspectRatio>
43
53
  * ```
44
54
  */
45
55
  shape?: AspectRatioShape;
56
+ /**
57
+ * How the child is laid out inside the ratio box, so the child does not
58
+ * have to declare `width`/`height`/`objectFit` itself.
59
+ * - `cover`: child fills the box; media is cropped (`object-fit: cover`).
60
+ * - `contain`: child fills the box; media is letterboxed
61
+ * (`object-fit: contain`).
62
+ * - `center`: child keeps its natural size, centered in the box.
63
+ *
64
+ * `cover`/`contain` child sizing ships as zero-specificity baseline rules
65
+ * in `reset.css`, keyed on the `data-astryx-aspect-ratio-override`
66
+ * attribute the component sets on the child's direct parent. Any styles
67
+ * the child sets itself still win, so children that already size
68
+ * themselves keep their behavior. When omitted, the child is left
69
+ * unstyled (the pre-existing contract). `fit` is structural, not visual,
70
+ * so it is not exposed on the theming surface.
71
+ *
72
+ * @example
73
+ * ```
74
+ * <AspectRatio ratio={16 / 9} fit="cover">
75
+ * <img src="image.jpg" alt="Widescreen image" />
76
+ * </AspectRatio>
77
+ * ```
78
+ */
79
+ fit?: AspectRatioFit;
46
80
  /**
47
81
  * Content to render inside the aspect ratio container.
48
82
  * The child element will be positioned absolutely to fill the container.
@@ -56,25 +90,29 @@ export interface AspectRatioProps extends BaseProps<HTMLDivElement> {
56
90
  * is positioned absolutely to fill the container, which is useful for images,
57
91
  * videos, embeds, and placeholders.
58
92
  *
93
+ * Use `fit` to let the component size the child: `cover`/`contain` stretch
94
+ * the child to fill the box (cropping or letterboxing media), `center` keeps
95
+ * the child at its natural size. Without `fit`, the child styles itself.
96
+ *
59
97
  * Use `shape="ellipse"` to clip the container into an ellipse — a circle at
60
98
  * `ratio={1}` or an oval at other ratios. Both shapes respect the provided
61
99
  * `ratio`.
62
100
  *
63
101
  * @example
64
102
  * ```
65
- * <AspectRatio ratio={16 / 9}>
66
- * <img src="image.jpg" alt="Widescreen image" style={{objectFit: 'cover'}} />
103
+ * <AspectRatio ratio={16 / 9} fit="cover">
104
+ * <img src="image.jpg" alt="Widescreen image" />
67
105
  * </AspectRatio>
68
106
  * ```
69
107
  *
70
108
  * @example
71
109
  * ```
72
- * <AspectRatio ratio={1} shape="ellipse">
73
- * <img src="avatar.jpg" alt="" style={{objectFit: 'cover'}} />
110
+ * <AspectRatio ratio={1} shape="ellipse" fit="cover">
111
+ * <img src="avatar.jpg" alt="" />
74
112
  * </AspectRatio>
75
113
  * ```
76
114
  */
77
- export declare function AspectRatio({ ratio, shape, children, xstyle, className, style, ref, ...props }: AspectRatioProps): import("react").JSX.Element;
115
+ export declare function AspectRatio({ ratio, shape, fit, children, xstyle, className, style, ref, ...props }: AspectRatioProps): import("react").JSX.Element;
78
116
  export declare namespace AspectRatio {
79
117
  var displayName: string;
80
118
  }
@@ -1 +1 @@
1
- {"version":3,"file":"AspectRatio.d.ts","sourceRoot":"","sources":["../../src/AspectRatio/AspectRatio.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAErC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAI5C;;;;;GAKG;AACH,MAAM,MAAM,gBAAgB,GAAG,WAAW,GAAG,SAAS,CAAC;AAEvD,MAAM,WAAW,gBAAiB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACjE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;;;;;;;;;;;;;OAeG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC;IAEzB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAwBD;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,KAAmB,EACnB,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,gBAAgB,+BAkBlB;yBA3Be,WAAW"}
1
+ {"version":3,"file":"AspectRatio.d.ts","sourceRoot":"","sources":["../../src/AspectRatio/AspectRatio.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAErC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAI5C;;;;;GAKG;AACH,MAAM,MAAM,gBAAgB,GAAG,WAAW,GAAG,SAAS,CAAC;AAEvD;;;;;;;GAOG;AACH,MAAM,MAAM,cAAc,GAAG,OAAO,GAAG,SAAS,GAAG,QAAQ,CAAC;AAE5D,MAAM,WAAW,gBAAiB,SAAQ,SAAS,CAAC,cAAc,CAAC;IACjE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;;;;;;;;;;;;;OAeG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC;IAEzB;;;;;;;;;;;;;;;;;;;;;;OAsBG;IACH,GAAG,CAAC,EAAE,cAAc,CAAC;IAErB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAkCD;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,KAAmB,EACnB,GAAG,EACH,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,gBAAgB,+BA2BlB;yBArCe,WAAW"}
@@ -5,12 +5,13 @@
5
5
  /**
6
6
  * @file AspectRatio.tsx
7
7
  * @input Uses React, stylex
8
- * @output Exports AspectRatio component and AspectRatioProps
8
+ * @output Exports AspectRatio component, AspectRatioProps, AspectRatioShape, AspectRatioFit
9
9
  * @position AspectRatio component; maintains a specific aspect ratio for its children
10
10
  *
11
11
  * SYNC: When modified, update these files to stay in sync:
12
12
  * - /packages/core/src/AspectRatio/AspectRatio.doc.mjs
13
13
  * - /packages/core/src/AspectRatio/AspectRatio.test.tsx
14
+ * - /packages/core/src/reset.css (AspectRatio fit baseline rules)
14
15
  * - /apps/storybook/stories/AspectRatio.stories.tsx
15
16
  * - /packages/cli/templates/blocks/components/AspectRatio/ (showcase blocks)
16
17
  */
@@ -24,7 +25,16 @@ import { themeProps } from "../utils/themeProps.js";
24
25
  * - `ellipse`: clips the container to an ellipse. Combined with the `ratio`,
25
26
  * this renders a circle at `ratio={1}` and an oval at non-square ratios.
26
27
  */
27
- import { jsx as _jsx } from "react/jsx-runtime";
28
+
29
+ /**
30
+ * How the child is sized and positioned inside the ratio box.
31
+ * - `cover`: the child fills the box; media is cropped to preserve its own
32
+ * aspect ratio (`object-fit: cover`).
33
+ * - `contain`: the child fills the box; media is letterboxed to stay fully
34
+ * visible (`object-fit: contain`).
35
+ * - `center`: the child keeps its natural size and sits centered in the box.
36
+ */
37
+ import { jsxDEV as _jsxDEV } from "react/jsx-dev-runtime";
28
38
  const styles = {
29
39
  container: {
30
40
  kVAEAm: "x1n2onr6",
@@ -47,27 +57,32 @@ const styles = {
47
57
  * is positioned absolutely to fill the container, which is useful for images,
48
58
  * videos, embeds, and placeholders.
49
59
  *
60
+ * Use `fit` to let the component size the child: `cover`/`contain` stretch
61
+ * the child to fill the box (cropping or letterboxing media), `center` keeps
62
+ * the child at its natural size. Without `fit`, the child styles itself.
63
+ *
50
64
  * Use `shape="ellipse"` to clip the container into an ellipse — a circle at
51
65
  * `ratio={1}` or an oval at other ratios. Both shapes respect the provided
52
66
  * `ratio`.
53
67
  *
54
68
  * @example
55
69
  * ```
56
- * <AspectRatio ratio={16 / 9}>
57
- * <img src="image.jpg" alt="Widescreen image" style={{objectFit: 'cover'}} />
70
+ * <AspectRatio ratio={16 / 9} fit="cover">
71
+ * <img src="image.jpg" alt="Widescreen image" />
58
72
  * </AspectRatio>
59
73
  * ```
60
74
  *
61
75
  * @example
62
76
  * ```
63
- * <AspectRatio ratio={1} shape="ellipse">
64
- * <img src="avatar.jpg" alt="" style={{objectFit: 'cover'}} />
77
+ * <AspectRatio ratio={1} shape="ellipse" fit="cover">
78
+ * <img src="avatar.jpg" alt="" />
65
79
  * </AspectRatio>
66
80
  * ```
67
81
  */
68
82
  export function AspectRatio({
69
83
  ratio,
70
84
  shape = 'rectangle',
85
+ fit,
71
86
  children,
72
87
  xstyle,
73
88
  className,
@@ -75,7 +90,7 @@ export function AspectRatio({
75
90
  ref,
76
91
  ...props
77
92
  }) {
78
- return /*#__PURE__*/_jsx("div", {
93
+ return /*#__PURE__*/_jsxDEV("div", {
79
94
  ref: ref,
80
95
  ...mergeProps(themeProps('aspect-ratio', {
81
96
  shape
@@ -84,12 +99,18 @@ export function AspectRatio({
84
99
  aspectRatio: ratio
85
100
  }),
86
101
  ...props,
87
- children: /*#__PURE__*/_jsx("div", {
102
+ children: /*#__PURE__*/_jsxDEV("div", {
103
+ "data-astryx-aspect-ratio-override": fit,
88
104
  ...{
89
- className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d"
90
- },
105
+ 0: {
106
+ className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d"
107
+ },
108
+ 1: {
109
+ className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d x78zum5 x6s0dn4 xl56j7k"
110
+ }
111
+ }[!!(fit === 'center') << 0],
91
112
  children: children
92
- })
93
- });
113
+ }, void 0, false)
114
+ }, void 0, false);
94
115
  }
95
116
  AspectRatio.displayName = 'AspectRatio';
@@ -7,5 +7,5 @@
7
7
  * SYNC: When modified, update /packages/core/src/AspectRatio/AspectRatio.doc.mjs
8
8
  */
9
9
  export { AspectRatio } from './AspectRatio';
10
- export type { AspectRatioProps, AspectRatioShape } from './AspectRatio';
10
+ export type { AspectRatioProps, AspectRatioShape, AspectRatioFit, } from './AspectRatio';
11
11
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/AspectRatio/index.ts"],"names":[],"mappings":"AAIA;;;;;;;GAOG;AAEH,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAC1C,YAAY,EAAC,gBAAgB,EAAE,gBAAgB,EAAC,MAAM,eAAe,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/AspectRatio/index.ts"],"names":[],"mappings":"AAIA;;;;;;;GAOG;AAEH,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAC1C,YAAY,EACV,gBAAgB,EAChB,gBAAgB,EAChB,cAAc,GACf,MAAM,eAAe,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/Avatar/Avatar.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAEH,OAAO,EAAoB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AACxD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAsC5C;;GAEG;AACH,KAAK,eAAe,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAExE;;GAEG;AACH,KAAK,iBAAiB,GAClB,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,EAAE,GACF,GAAG,GACH,GAAG,GACH,GAAG,CAAC;AAER;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,eAAe,GAAG,iBAAiB,CAAC;AAE7D;;GAEG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,UAAU,GAAG,MAAM,CAgBpD;AAqFD,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAsCD;;;;;;;;;;;;GAYG;AACH,wBAAgB,MAAM,CAAC,EACrB,GAAG,EACH,aAAa,EAAE,MAAM,EACrB,WAAW,EACX,IAAI,EACJ,IAAc,EACd,GAAG,EACH,MAAM,EACN,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,+BAmFb;yBAhGe,MAAM"}
1
+ {"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../src/Avatar/Avatar.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAEH,OAAO,EAAoB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AACxD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAsC5C;;GAEG;AACH,KAAK,eAAe,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAExE;;GAEG;AACH,KAAK,iBAAiB,GACpB,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;AAEzE;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,eAAe,GAAG,iBAAiB,CAAC;AAE7D;;GAEG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,UAAU,GAAG,MAAM,CAgBpD;AAqFD,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAsCD;;;;;;;;;;;;GAYG;AACH,wBAAgB,MAAM,CAAC,EACrB,GAAG,EACH,aAAa,EAAE,MAAM,EACrB,WAAW,EACX,IAAI,EACJ,IAAc,EACd,GAAG,EACH,MAAM,EACN,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,+BAwFb;yBArGe,MAAM"}