@astryxdesign/core 0.1.4-canary.ff77e1c → 0.1.4
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.
- package/dist/AlertDialog/AlertDialog.d.ts +1 -1
- package/dist/AlertDialog/AlertDialog.d.ts.map +1 -1
- package/dist/AlertDialog/AlertDialog.js +18 -20
- package/dist/AlertDialog/useImperativeAlertDialog.js +3 -3
- package/dist/AppShell/AppShell.d.ts +1 -1
- package/dist/AppShell/AppShell.d.ts.map +1 -1
- package/dist/AppShell/AppShell.js +53 -55
- package/dist/AspectRatio/AspectRatio.d.ts +10 -48
- package/dist/AspectRatio/AspectRatio.d.ts.map +1 -1
- package/dist/AspectRatio/AspectRatio.js +12 -33
- package/dist/AspectRatio/index.d.ts +1 -1
- package/dist/AspectRatio/index.d.ts.map +1 -1
- package/dist/Avatar/Avatar.d.ts.map +1 -1
- package/dist/Avatar/Avatar.js +25 -27
- package/dist/Avatar/AvatarStatusDot.js +5 -5
- package/dist/AvatarGroup/AvatarGroup.js +5 -5
- package/dist/AvatarGroup/AvatarGroupOverflow.js +5 -5
- package/dist/Badge/Badge.js +3 -3
- package/dist/Banner/Banner.d.ts.map +1 -1
- package/dist/Banner/Banner.js +25 -32
- package/dist/Blockquote/Blockquote.js +7 -7
- package/dist/Breadcrumbs/BreadcrumbItem.js +17 -17
- package/dist/Breadcrumbs/Breadcrumbs.js +7 -7
- package/dist/Button/Button.js +19 -19
- package/dist/ButtonGroup/ButtonGroup.js +7 -7
- package/dist/Calendar/Calendar.d.ts.map +1 -1
- package/dist/Calendar/Calendar.js +48 -68
- package/dist/Calendar/dayCellUtils.d.ts.map +1 -1
- package/dist/Calendar/styles.d.ts +2 -2
- package/dist/Calendar/styles.d.ts.map +1 -1
- package/dist/Calendar/styles.js +2 -2
- package/dist/Card/Card.d.ts +2 -4
- package/dist/Card/Card.d.ts.map +1 -1
- package/dist/Card/Card.js +10 -18
- package/dist/Carousel/Carousel.d.ts.map +1 -1
- package/dist/Carousel/Carousel.js +21 -24
- package/dist/Carousel/carousel.markers.stylex.d.ts +7 -0
- package/dist/Carousel/carousel.markers.stylex.d.ts.map +1 -0
- package/dist/Carousel/carousel.markers.stylex.js +12 -0
- package/dist/Center/Center.js +3 -3
- package/dist/Chat/ChatComposer.js +23 -23
- package/dist/Chat/ChatComposerDrawer.js +14 -14
- package/dist/Chat/ChatComposerInput.d.ts +1 -1
- package/dist/Chat/ChatComposerInput.d.ts.map +1 -1
- package/dist/Chat/ChatComposerInput.js +15 -27
- package/dist/Chat/ChatDictationButton.d.ts +1 -1
- package/dist/Chat/ChatDictationButton.d.ts.map +1 -1
- package/dist/Chat/ChatDictationButton.js +11 -13
- package/dist/Chat/ChatLayout.js +17 -17
- package/dist/Chat/ChatLayoutScrollButton.d.ts +1 -1
- package/dist/Chat/ChatLayoutScrollButton.d.ts.map +1 -1
- package/dist/Chat/ChatLayoutScrollButton.js +10 -12
- package/dist/Chat/ChatMessage.js +12 -12
- package/dist/Chat/ChatMessageBubble.js +7 -7
- package/dist/Chat/ChatMessageList.js +14 -14
- package/dist/Chat/ChatMessageMetadata.d.ts +1 -1
- package/dist/Chat/ChatMessageMetadata.d.ts.map +1 -1
- package/dist/Chat/ChatMessageMetadata.js +12 -14
- package/dist/Chat/ChatPastedTextToken.js +13 -13
- package/dist/Chat/ChatSendButton.js +3 -3
- package/dist/Chat/ChatSystemMessage.d.ts +1 -1
- package/dist/Chat/ChatSystemMessage.d.ts.map +1 -1
- package/dist/Chat/ChatSystemMessage.js +17 -17
- package/dist/Chat/ChatTokenizedText.d.ts +1 -1
- package/dist/Chat/ChatTokenizedText.d.ts.map +1 -1
- package/dist/Chat/ChatTokenizedText.js +15 -24
- package/dist/Chat/ChatToolCalls.d.ts.map +1 -1
- package/dist/Chat/ChatToolCalls.js +74 -81
- package/dist/Chat/index.d.ts +1 -1
- package/dist/Chat/index.d.ts.map +1 -1
- package/dist/Chat/useTriggerMenu.d.ts.map +1 -1
- package/dist/Chat/useTriggerMenu.js +15 -15
- package/dist/CheckboxInput/CheckboxInput.d.ts +1 -1
- package/dist/CheckboxInput/CheckboxInput.d.ts.map +1 -1
- package/dist/CheckboxInput/CheckboxInput.js +23 -25
- package/dist/CheckboxList/CheckboxList.js +9 -9
- package/dist/CheckboxList/CheckboxListItem.d.ts +1 -1
- package/dist/CheckboxList/CheckboxListItem.d.ts.map +1 -1
- package/dist/CheckboxList/CheckboxListItem.js +6 -8
- package/dist/Citation/Citation.js +10 -10
- package/dist/ClickableCard/ClickableCard.d.ts.map +1 -1
- package/dist/ClickableCard/ClickableCard.js +9 -32
- package/dist/Code/Code.js +3 -3
- package/dist/CodeBlock/CodeBlock.d.ts +1 -10
- package/dist/CodeBlock/CodeBlock.d.ts.map +1 -1
- package/dist/CodeBlock/CodeBlock.js +52 -88
- package/dist/Collapsible/Collapsible.d.ts +3 -9
- package/dist/Collapsible/Collapsible.d.ts.map +1 -1
- package/dist/Collapsible/Collapsible.js +22 -110
- package/dist/Collapsible/CollapsibleGroup.d.ts +7 -39
- package/dist/Collapsible/CollapsibleGroup.d.ts.map +1 -1
- package/dist/Collapsible/CollapsibleGroup.js +12 -73
- package/dist/Collapsible/CollapsibleGroupContext.d.ts +0 -31
- package/dist/Collapsible/CollapsibleGroupContext.d.ts.map +1 -1
- package/dist/Collapsible/CollapsibleGroupContext.js +3 -33
- package/dist/Collapsible/index.d.ts +0 -1
- package/dist/Collapsible/index.d.ts.map +1 -1
- package/dist/Collapsible/useCollapsible.d.ts +1 -4
- package/dist/Collapsible/useCollapsible.d.ts.map +1 -1
- package/dist/Collapsible/useCollapsible.js +6 -20
- package/dist/CommandPalette/CommandPalette.d.ts.map +1 -1
- package/dist/CommandPalette/CommandPalette.js +34 -36
- package/dist/CommandPalette/CommandPaletteEmpty.js +3 -3
- package/dist/CommandPalette/CommandPaletteFooter.js +16 -16
- package/dist/CommandPalette/CommandPaletteGroup.js +5 -5
- package/dist/CommandPalette/CommandPaletteInput.js +13 -13
- package/dist/CommandPalette/CommandPaletteItem.js +3 -3
- package/dist/CommandPalette/CommandPaletteList.js +3 -3
- package/dist/ContextMenu/ContextMenu.d.ts +2 -7
- package/dist/ContextMenu/ContextMenu.d.ts.map +1 -1
- package/dist/ContextMenu/ContextMenu.js +43 -76
- package/dist/DateInput/DateInput.js +18 -18
- package/dist/DateRangeInput/DateRangeInput.js +21 -21
- package/dist/DateTimeInput/DateTimeInput.d.ts +2 -5
- package/dist/DateTimeInput/DateTimeInput.d.ts.map +1 -1
- package/dist/DateTimeInput/DateTimeInput.js +26 -30
- package/dist/DateTimeInput/index.d.ts +1 -1
- package/dist/DateTimeInput/index.d.ts.map +1 -1
- package/dist/Dialog/Dialog.js +9 -9
- package/dist/Dialog/DialogHeader.js +16 -16
- package/dist/Dialog/useImperativeDialog.js +3 -3
- package/dist/Divider/Divider.js +7 -7
- package/dist/DropdownMenu/DropdownMenu.js +10 -10
- package/dist/DropdownMenu/DropdownMenuItem.d.ts +17 -2
- package/dist/DropdownMenu/DropdownMenuItem.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuItem.js +3 -3
- package/dist/DropdownMenu/renderDropdownItems.js +10 -10
- package/dist/EmptyState/EmptyState.js +9 -9
- package/dist/Field/Field.js +17 -17
- package/dist/Field/FieldLabel.js +15 -15
- package/dist/Field/InputClearButton.js +5 -5
- package/dist/FieldStatus/FieldStatus.js +3 -3
- package/dist/FileInput/FileInput.js +29 -29
- package/dist/FormLayout/FormLayout.js +5 -5
- package/dist/Grid/Grid.d.ts +3 -4
- package/dist/Grid/Grid.d.ts.map +1 -1
- package/dist/Grid/Grid.js +12 -29
- package/dist/Grid/GridSpan.js +3 -3
- package/dist/HStack/HStack.js +3 -3
- package/dist/Heading/Heading.js +10 -10
- package/dist/HoverCard/HoverCard.js +9 -9
- package/dist/HoverCard/useHoverCard.d.ts +1 -5
- package/dist/HoverCard/useHoverCard.d.ts.map +1 -1
- package/dist/HoverCard/useHoverCard.js +3 -3
- package/dist/Icon/Icon.d.ts.map +1 -1
- package/dist/Icon/Icon.js +12 -16
- package/dist/Icon/defaultIcons.js +116 -116
- package/dist/IconButton/IconButton.js +3 -3
- package/dist/InputGroup/InputGroup.js +11 -11
- package/dist/InputGroup/InputGroupText.js +3 -3
- package/dist/Item/Item.js +18 -18
- package/dist/Kbd/Kbd.js +5 -5
- package/dist/Layer/LayerProvider.js +7 -7
- package/dist/Layer/useLayer.d.ts +2 -29
- package/dist/Layer/useLayer.d.ts.map +1 -1
- package/dist/Layer/useLayer.js +31 -44
- package/dist/Layout/Layout.js +21 -21
- package/dist/Layout/LayoutContent.js +3 -3
- package/dist/Layout/LayoutFooter.js +5 -5
- package/dist/Layout/LayoutHeader.js +5 -5
- package/dist/Layout/LayoutPanel.js +3 -3
- package/dist/Lightbox/Lightbox.d.ts.map +1 -1
- package/dist/Lightbox/Lightbox.js +31 -55
- package/dist/Lightbox/useLightbox.js +3 -3
- package/dist/Link/Link.js +15 -15
- package/dist/Link/LinkProvider.js +3 -3
- package/dist/Link/useLinkify.js +3 -3
- package/dist/List/List.js +11 -11
- package/dist/List/ListItem.js +11 -11
- package/dist/Markdown/Markdown.d.ts.map +1 -1
- package/dist/Markdown/Markdown.js +102 -102
- package/dist/MetadataList/MetadataList.js +10 -10
- package/dist/MetadataList/MetadataListItem.js +15 -15
- package/dist/MobileNav/MobileNav.d.ts +1 -1
- package/dist/MobileNav/MobileNav.d.ts.map +1 -1
- package/dist/MobileNav/MobileNav.js +23 -26
- package/dist/MobileNav/MobileNavToggle.js +5 -5
- package/dist/MoreMenu/MoreMenu.js +3 -3
- package/dist/MultiSelector/MultiSelector.js +56 -56
- package/dist/NavIcon/NavIcon.js +3 -3
- package/dist/NavMenu/NavHeadingMenu.js +5 -5
- package/dist/NavMenu/NavHeadingMenuItem.js +8 -8
- package/dist/NumberInput/NumberInput.d.ts.map +1 -1
- package/dist/NumberInput/NumberInput.js +32 -48
- package/dist/Outline/Outline.js +15 -15
- package/dist/OverflowList/OverflowList.js +8 -8
- package/dist/Overlay/Overlay.js +3 -3
- package/dist/Overlay/OverlayScrim.js +5 -5
- package/dist/Overlay/useOverlay.js +3 -3
- package/dist/Pagination/Pagination.d.ts +1 -1
- package/dist/Pagination/Pagination.d.ts.map +1 -1
- package/dist/Pagination/Pagination.js +72 -125
- package/dist/Popover/Popover.js +16 -16
- package/dist/Popover/usePopover.js +7 -7
- package/dist/PowerSearch/PowerSearch.d.ts.map +1 -1
- package/dist/PowerSearch/PowerSearch.js +92 -110
- package/dist/PowerSearch/PowerSearchEditPopover.js +84 -84
- package/dist/PowerSearch/PowerSearchFilterEditor.js +3 -3
- package/dist/PowerSearch/PowerSearchToken.js +5 -5
- package/dist/PowerSearch/PowerSearchValueEditor.js +54 -54
- package/dist/ProgressBar/ProgressBar.d.ts.map +1 -1
- package/dist/ProgressBar/ProgressBar.js +18 -25
- package/dist/RadioList/RadioList.js +7 -7
- package/dist/RadioList/RadioListItem.d.ts +1 -1
- package/dist/RadioList/RadioListItem.d.ts.map +1 -1
- package/dist/RadioList/RadioListItem.js +21 -24
- package/dist/Resizable/ResizeHandle.d.ts.map +1 -1
- package/dist/Resizable/ResizeHandle.js +10 -28
- package/dist/Section/Section.js +5 -5
- package/dist/SegmentedControl/SegmentedControl.d.ts +1 -1
- package/dist/SegmentedControl/SegmentedControl.d.ts.map +1 -1
- package/dist/SegmentedControl/SegmentedControl.js +10 -32
- package/dist/SegmentedControl/SegmentedControlItem.d.ts +1 -1
- package/dist/SegmentedControl/SegmentedControlItem.d.ts.map +1 -1
- package/dist/SegmentedControl/SegmentedControlItem.js +12 -18
- package/dist/SelectableCard/SelectableCard.js +5 -5
- package/dist/Selector/Selector.js +46 -46
- package/dist/Selector/SelectorOption.js +3 -3
- package/dist/SideNav/SideNav.d.ts.map +1 -1
- package/dist/SideNav/SideNav.js +34 -38
- package/dist/SideNav/SideNavCollapseButton.d.ts +1 -1
- package/dist/SideNav/SideNavCollapseButton.d.ts.map +1 -1
- package/dist/SideNav/SideNavCollapseButton.js +6 -8
- package/dist/SideNav/SideNavHeading.js +87 -87
- package/dist/SideNav/SideNavItem.js +42 -42
- package/dist/SideNav/SideNavSection.d.ts +1 -1
- package/dist/SideNav/SideNavSection.d.ts.map +1 -1
- package/dist/SideNav/SideNavSection.js +16 -18
- package/dist/Skeleton/Skeleton.js +3 -3
- package/dist/Slider/Slider.js +23 -23
- package/dist/Spinner/Spinner.js +9 -9
- package/dist/StatusDot/StatusDot.js +5 -5
- package/dist/Switch/Switch.d.ts +4 -8
- package/dist/Switch/Switch.d.ts.map +1 -1
- package/dist/Switch/Switch.js +29 -34
- package/dist/TabList/Tab.js +18 -18
- package/dist/TabList/TabList.js +5 -5
- package/dist/TabList/TabMenu.d.ts.map +1 -1
- package/dist/TabList/TabMenu.js +30 -57
- package/dist/TabList/tab.markers.stylex.d.ts +1 -1
- package/dist/Table/BaseTable.d.ts.map +1 -1
- package/dist/Table/BaseTable.js +39 -50
- package/dist/Table/Table.js +7 -7
- package/dist/Table/TableBody.d.ts +1 -1
- package/dist/Table/TableBody.d.ts.map +1 -1
- package/dist/Table/TableBody.js +5 -9
- package/dist/Table/TableCell.js +3 -3
- package/dist/Table/TableFooter.d.ts +1 -1
- package/dist/Table/TableFooter.d.ts.map +1 -1
- package/dist/Table/TableFooter.js +5 -9
- package/dist/Table/TableHeader.d.ts +1 -1
- package/dist/Table/TableHeader.d.ts.map +1 -1
- package/dist/Table/TableHeader.js +5 -9
- package/dist/Table/TableHeaderCell.js +3 -3
- package/dist/Table/TableRow.js +5 -5
- package/dist/Table/plugins/columnResize/useTableColumnResize.d.ts.map +1 -1
- package/dist/Table/plugins/columnResize/useTableColumnResize.js +11 -14
- package/dist/Table/plugins/filtering/useTableFiltering.js +71 -71
- package/dist/Table/plugins/pagination/paginateData.d.ts.map +1 -1
- package/dist/Table/plugins/pagination/paginateData.js +1 -5
- package/dist/Table/plugins/pagination/useTablePagination.js +7 -7
- package/dist/Table/plugins/rowExpansion/useTableRowExpansion.js +22 -22
- package/dist/Table/plugins/selection/useTableSelection.js +18 -18
- package/dist/Table/plugins/selection/useTableSelectionState.d.ts.map +1 -1
- package/dist/Table/plugins/selection/useTableSelectionState.js +1 -11
- package/dist/Table/plugins/sortable/useTableSortable.js +17 -17
- package/dist/Table/plugins/sortable/useTableSortableState.d.ts.map +1 -1
- package/dist/Table/plugins/sortable/useTableSortableState.js +4 -8
- package/dist/Table/tableContextMenu.js +9 -9
- package/dist/Text/Text.js +10 -10
- package/dist/TextArea/TextArea.js +14 -14
- package/dist/TextInput/TextInput.js +15 -15
- package/dist/Thumbnail/Thumbnail.d.ts +2 -3
- package/dist/Thumbnail/Thumbnail.d.ts.map +1 -1
- package/dist/Thumbnail/Thumbnail.js +29 -30
- package/dist/TimeInput/TimeInput.d.ts.map +1 -1
- package/dist/TimeInput/TimeInput.js +21 -26
- package/dist/Timestamp/Timestamp.d.ts +1 -1
- package/dist/Timestamp/Timestamp.d.ts.map +1 -1
- package/dist/Timestamp/Timestamp.js +26 -37
- package/dist/Toast/Toast.d.ts.map +1 -1
- package/dist/Toast/Toast.js +17 -25
- package/dist/Toast/ToastViewport.d.ts.map +1 -1
- package/dist/Toast/ToastViewport.js +11 -23
- package/dist/Toast/useToast.d.ts.map +1 -1
- package/dist/Toast/useToast.js +4 -44
- package/dist/ToggleButton/ToggleButton.js +12 -12
- package/dist/ToggleButton/ToggleButtonGroup.js +5 -5
- package/dist/Token/Token.js +21 -21
- package/dist/Tokenizer/Tokenizer.d.ts.map +1 -1
- package/dist/Tokenizer/Tokenizer.js +34 -36
- package/dist/Toolbar/Toolbar.js +18 -18
- package/dist/Tooltip/Tooltip.js +11 -11
- package/dist/Tooltip/useTooltip.d.ts +1 -5
- package/dist/Tooltip/useTooltip.d.ts.map +1 -1
- package/dist/Tooltip/useTooltip.js +3 -3
- package/dist/TopNav/TopNav.js +32 -32
- package/dist/TopNav/TopNavHeading.js +67 -67
- package/dist/TopNav/TopNavItem.js +5 -5
- package/dist/TopNav/TopNavMegaMenu.js +30 -30
- package/dist/TopNav/TopNavMegaMenuFeaturedCard.d.ts +1 -1
- package/dist/TopNav/TopNavMegaMenuFeaturedCard.d.ts.map +1 -1
- package/dist/TopNav/TopNavMegaMenuFeaturedCard.js +14 -25
- package/dist/TopNav/TopNavMegaMenuItem.js +16 -16
- package/dist/TopNav/TopNavMenu.js +32 -32
- package/dist/TreeList/TreeList.js +8 -8
- package/dist/TreeList/TreeListBranches.js +11 -11
- package/dist/TreeList/TreeListItem.js +30 -30
- package/dist/Typeahead/BaseTypeahead.d.ts.map +1 -1
- package/dist/Typeahead/BaseTypeahead.js +20 -23
- package/dist/Typeahead/Typeahead.js +12 -12
- package/dist/Typeahead/TypeaheadItem.js +10 -10
- package/dist/VStack/VStack.js +3 -3
- package/dist/astryx.css +0 -7
- package/dist/astryx.umd.js +59 -59
- package/dist/astryx.umd.js.map +4 -4
- package/dist/docs-types.d.ts +2 -8
- package/dist/docs-types.d.ts.map +1 -1
- package/dist/hooks/focusableSelector.d.ts +1 -1
- package/dist/hooks/focusableSelector.d.ts.map +1 -1
- package/dist/hooks/focusableSelector.js +1 -1
- package/dist/hooks/index.d.ts +0 -2
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/index.js +0 -1
- package/dist/hooks/useFocusTrap.d.ts +0 -3
- package/dist/hooks/useFocusTrap.d.ts.map +1 -1
- package/dist/hooks/useFocusTrap.js +1 -38
- package/dist/hooks/useInteractiveRole.d.ts +2 -6
- package/dist/hooks/useInteractiveRole.d.ts.map +1 -1
- package/dist/hooks/useInteractiveRole.js +2 -6
- package/dist/hooks/useKeyboardHint.js +9 -9
- package/dist/hooks/useStreamingText.d.ts +1 -3
- package/dist/hooks/useStreamingText.d.ts.map +1 -1
- package/dist/hooks/useStreamingText.js +5 -14
- package/dist/theme/MediaTheme.js +3 -3
- package/dist/theme/Theme.js +7 -7
- package/dist/theme/defineTheme.d.ts +1 -1
- package/dist/theme/defineTheme.d.ts.map +1 -1
- package/dist/theme/expandColorScale.d.ts.map +1 -1
- package/dist/theme/expandColorScale.js +3 -10
- package/dist/theme/hct.d.ts +15 -0
- package/dist/theme/hct.d.ts.map +1 -1
- package/dist/theme/hct.js +9 -9
- package/dist/theme/syntax/SyntaxTheme.js +5 -5
- package/dist/theme/tokens.d.ts +2 -10
- package/dist/theme/tokens.d.ts.map +1 -1
- package/dist/theme/tokens.js +4 -220
- package/dist/theme/useTheme.d.ts +2 -3
- package/dist/theme/useTheme.d.ts.map +1 -1
- package/dist/theme/useTheme.js +6 -73
- package/dist/utils/index.d.ts +0 -3
- package/dist/utils/index.d.ts.map +1 -1
- package/dist/utils/index.js +1 -3
- package/dist/utils/timeParser.d.ts.map +1 -1
- package/dist/utils/timeParser.js +5 -8
- package/package.json +3 -3
- package/src/AlertDialog/AlertDialog.doc.mjs +0 -4
- package/src/AlertDialog/AlertDialog.tsx +0 -2
- package/src/AppShell/AppShell.tsx +0 -2
- package/src/AspectRatio/AspectRatio.doc.mjs +1 -28
- package/src/AspectRatio/AspectRatio.test.tsx +1 -142
- package/src/AspectRatio/AspectRatio.tsx +10 -70
- package/src/AspectRatio/index.ts +1 -5
- package/src/Avatar/Avatar.doc.mjs +0 -11
- package/src/Avatar/Avatar.test.tsx +1 -32
- package/src/Avatar/Avatar.tsx +20 -12
- package/src/AvatarGroup/AvatarGroup.doc.mjs +0 -1
- package/src/Banner/Banner.doc.mjs +0 -8
- package/src/Banner/Banner.test.tsx +0 -38
- package/src/Banner/Banner.tsx +1 -8
- package/src/Calendar/Calendar.doc.mjs +1 -1
- package/src/Calendar/Calendar.test.tsx +17 -122
- package/src/Calendar/Calendar.tsx +5 -26
- package/src/Calendar/dayCellUtils.ts +1 -3
- package/src/Calendar/styles.ts +2 -12
- package/src/Card/Card.doc.mjs +1 -1
- package/src/Card/Card.tsx +6 -16
- package/src/Carousel/Carousel.doc.mjs +12 -12
- package/src/Carousel/Carousel.test.tsx +0 -13
- package/src/Carousel/Carousel.tsx +2 -4
- package/src/Carousel/carousel.markers.stylex.ts +10 -0
- package/src/Chat/Chat.doc.mjs +1 -1
- package/src/Chat/ChatComposerInput.test.tsx +1 -27
- package/src/Chat/ChatComposerInput.tsx +15 -20
- package/src/Chat/ChatDictationButton.tsx +4 -4
- package/src/Chat/ChatLayoutScrollButton.tsx +1 -3
- package/src/Chat/ChatMessageMetadata.tsx +6 -4
- package/src/Chat/ChatSystemMessage.test.tsx +11 -26
- package/src/Chat/ChatSystemMessage.tsx +7 -7
- package/src/Chat/ChatTokenizedText.test.tsx +16 -29
- package/src/Chat/ChatTokenizedText.tsx +8 -15
- package/src/Chat/ChatToolCalls.test.tsx +0 -55
- package/src/Chat/ChatToolCalls.tsx +12 -10
- package/src/Chat/index.ts +4 -1
- package/src/Chat/useTriggerMenu.tsx +4 -1
- package/src/CheckboxInput/CheckboxInput.doc.mjs +3 -3
- package/src/CheckboxInput/CheckboxInput.test.tsx +4 -71
- package/src/CheckboxInput/CheckboxInput.tsx +0 -2
- package/src/CheckboxList/CheckboxList.test.tsx +0 -19
- package/src/CheckboxList/CheckboxListItem.tsx +2 -11
- package/src/Citation/Citation.doc.mjs +0 -5
- package/src/ClickableCard/ClickableCard.tsx +2 -45
- package/src/CodeBlock/CodeBlock.doc.mjs +2 -7
- package/src/CodeBlock/CodeBlock.test.tsx +3 -122
- package/src/CodeBlock/CodeBlock.tsx +4 -62
- package/src/Collapsible/Collapsible.doc.mjs +4 -8
- package/src/Collapsible/Collapsible.tsx +10 -86
- package/src/Collapsible/CollapsibleGroup.doc.mjs +3 -27
- package/src/Collapsible/CollapsibleGroup.test.tsx +0 -318
- package/src/Collapsible/CollapsibleGroup.tsx +9 -107
- package/src/Collapsible/CollapsibleGroupContext.tsx +2 -42
- package/src/Collapsible/index.ts +0 -4
- package/src/Collapsible/useCollapsible.ts +6 -20
- package/src/CommandPalette/CommandPalette.doc.mjs +0 -5
- package/src/CommandPalette/CommandPalette.tsx +3 -5
- package/src/CommandPalette/CommandPaletteEmpty.doc.mjs +0 -5
- package/src/CommandPalette/CommandPaletteGroup.doc.mjs +0 -10
- package/src/CommandPalette/CommandPaletteInput.doc.mjs +0 -6
- package/src/CommandPalette/CommandPaletteItem.doc.mjs +0 -6
- package/src/CommandPalette/CommandPaletteList.doc.mjs +0 -9
- package/src/ContextMenu/ContextMenu.doc.mjs +0 -15
- package/src/ContextMenu/ContextMenu.test.tsx +0 -87
- package/src/ContextMenu/ContextMenu.tsx +28 -87
- package/src/ContextMenu/ContextMenuItem.doc.mjs +0 -6
- package/src/DateInput/DateInput.test.tsx +20 -11
- package/src/DateRangeInput/DateRangeInput.test.tsx +44 -31
- package/src/DateTimeInput/DateTimeInput.doc.mjs +2 -3
- package/src/DateTimeInput/DateTimeInput.test.tsx +16 -118
- package/src/DateTimeInput/DateTimeInput.tsx +2 -8
- package/src/DateTimeInput/index.ts +0 -1
- package/src/Dialog/Dialog.doc.mjs +0 -4
- package/src/Dialog/DialogHeader.doc.mjs +0 -45
- package/src/DropdownMenu/DropdownMenu.doc.mjs +1 -1
- package/src/DropdownMenu/DropdownMenu.test.tsx +2 -22
- package/src/DropdownMenu/DropdownMenuItem.tsx +17 -5
- package/src/EmptyState/EmptyState.doc.mjs +1 -1
- package/src/Field/Field.test.tsx +4 -1
- package/src/Field/FieldLabel.test.tsx +2 -2
- package/src/FormLayout/__snapshots__/FormLayout.test.tsx.snap +3 -0
- package/src/Grid/Grid.test.tsx +18 -43
- package/src/Grid/Grid.tsx +9 -26
- package/src/HoverCard/HoverCard.doc.mjs +6 -6
- package/src/HoverCard/useHoverCard.doc.mjs +5 -5
- package/src/HoverCard/useHoverCard.tsx +2 -9
- package/src/Icon/Icon.test.tsx +29 -41
- package/src/Icon/Icon.tsx +2 -6
- package/src/InputGroup/InputGroup.doc.mjs +0 -1
- package/src/InputGroup/InputGroup.tsx +2 -2
- package/src/Item/Item.tsx +1 -1
- package/src/Layer/useLayer.doc.mjs +2 -2
- package/src/Layer/useLayer.test.tsx +2 -221
- package/src/Layer/useLayer.tsx +30 -69
- package/src/Layout/LayoutContent.doc.mjs +0 -12
- package/src/Layout/LayoutPanel.doc.mjs +0 -40
- package/src/Lightbox/Lightbox.doc.mjs +0 -5
- package/src/Lightbox/Lightbox.test.tsx +2 -123
- package/src/Lightbox/Lightbox.tsx +1 -29
- package/src/Markdown/Markdown.tsx +7 -9
- package/src/Markdown/parser.perf.test.ts +12 -34
- package/src/MobileNav/MobileNav.test.tsx +0 -56
- package/src/MobileNav/MobileNav.tsx +8 -13
- package/src/NavMenu/NavMenu.doc.mjs +0 -15
- package/src/NumberInput/NumberInput.test.tsx +3 -48
- package/src/NumberInput/NumberInput.tsx +15 -32
- package/src/Outline/Outline.doc.mjs +0 -2
- package/src/Overlay/Overlay.doc.mjs +0 -6
- package/src/Pagination/Pagination.test.tsx +0 -162
- package/src/Pagination/Pagination.tsx +26 -80
- package/src/Popover/Popover.doc.mjs +6 -6
- package/src/Popover/Popover.test.tsx +0 -65
- package/src/Popover/usePopover.doc.mjs +1 -1
- package/src/PowerSearch/PowerSearch.doc.mjs +2 -2
- package/src/PowerSearch/PowerSearch.test.tsx +1 -109
- package/src/PowerSearch/PowerSearch.tsx +16 -37
- package/src/ProgressBar/ProgressBar.doc.mjs +0 -2
- package/src/ProgressBar/ProgressBar.test.tsx +0 -30
- package/src/ProgressBar/ProgressBar.tsx +5 -12
- package/src/RadioList/RadioList.test.tsx +0 -19
- package/src/RadioList/RadioListItem.tsx +4 -9
- package/src/Resizable/ResizeHandle.tsx +4 -22
- package/src/SegmentedControl/SegmentedControl.doc.mjs +1 -1
- package/src/SegmentedControl/SegmentedControl.test.tsx +0 -192
- package/src/SegmentedControl/SegmentedControl.tsx +5 -27
- package/src/SegmentedControl/SegmentedControlItem.tsx +4 -9
- package/src/SelectableCard/SelectableCard.doc.mjs +1 -1
- package/src/Selector/Selector.test.tsx +1 -27
- package/src/SideNav/SideNav.doc.mjs +1 -7
- package/src/SideNav/SideNav.test.tsx +0 -66
- package/src/SideNav/SideNav.tsx +2 -6
- package/src/SideNav/SideNavCollapseButton.tsx +3 -4
- package/src/SideNav/SideNavSection.tsx +4 -6
- package/src/Switch/Switch.doc.mjs +7 -7
- package/src/Switch/Switch.test.tsx +3 -102
- package/src/Switch/Switch.tsx +7 -20
- package/src/TabList/TabList.test.tsx +1 -185
- package/src/TabList/TabMenu.tsx +9 -45
- package/src/Table/BaseTable.tsx +2 -13
- package/src/Table/Table.doc.mjs +0 -5
- package/src/Table/Table.test.tsx +0 -87
- package/src/Table/TableBody.tsx +2 -15
- package/src/Table/TableFooter.tsx +2 -15
- package/src/Table/TableHeader.tsx +2 -15
- package/src/Table/plugins/columnResize/useTableColumnResize.test.tsx +0 -13
- package/src/Table/plugins/columnResize/useTableColumnResize.tsx +1 -3
- package/src/Table/plugins/pagination/paginateData.ts +1 -5
- package/src/Table/plugins/pagination/useTablePagination.test.tsx +0 -13
- package/src/Table/plugins/selection/useTableSelectionState.test.tsx +0 -23
- package/src/Table/plugins/selection/useTableSelectionState.tsx +6 -11
- package/src/Table/plugins/sortable/useTableSortableState.test.tsx +1 -35
- package/src/Table/plugins/sortable/useTableSortableState.tsx +4 -8
- package/src/TextArea/TextArea.test.tsx +3 -3
- package/src/TextInput/TextInput.test.tsx +3 -3
- package/src/Thumbnail/Thumbnail.test.tsx +2 -36
- package/src/Thumbnail/Thumbnail.tsx +2 -4
- package/src/TimeInput/TimeInput.test.tsx +0 -37
- package/src/TimeInput/TimeInput.tsx +1 -11
- package/src/Timestamp/Timestamp.doc.mjs +1 -1
- package/src/Timestamp/Timestamp.test.tsx +0 -52
- package/src/Timestamp/Timestamp.tsx +16 -30
- package/src/Toast/Toast.tsx +3 -11
- package/src/Toast/ToastViewport.test.tsx +0 -64
- package/src/Toast/ToastViewport.tsx +0 -12
- package/src/Toast/useToast.tsx +0 -41
- package/src/ToggleButton/ToggleButton.doc.mjs +0 -1
- package/src/Tokenizer/Tokenizer.doc.mjs +2 -2
- package/src/Tokenizer/Tokenizer.test.tsx +0 -54
- package/src/Tokenizer/Tokenizer.tsx +4 -5
- package/src/Tooltip/Tooltip.doc.mjs +6 -6
- package/src/Tooltip/useTooltip.doc.mjs +5 -5
- package/src/Tooltip/useTooltip.tsx +2 -12
- package/src/TopNav/TopNav.doc.mjs +1 -1
- package/src/TopNav/TopNav.test.tsx +7 -23
- package/src/TopNav/TopNavMegaMenuFeaturedCard.tsx +2 -9
- package/src/TreeList/TreeList.doc.mjs +2 -2
- package/src/Typeahead/BaseTypeahead.doc.mjs +0 -19
- package/src/Typeahead/BaseTypeahead.tsx +2 -5
- package/src/Typeahead/Typeahead.doc.mjs +1 -1
- package/src/Typeahead/Typeahead.test.tsx +1 -45
- package/src/docs-types.ts +1 -9
- package/src/hooks/focusableSelector.ts +1 -1
- package/src/hooks/index.ts +0 -3
- package/src/hooks/useFocusTrap.doc.mjs +2 -4
- package/src/hooks/useFocusTrap.test.tsx +1 -149
- package/src/hooks/useFocusTrap.ts +1 -50
- package/src/hooks/useInteractiveRole.ts +4 -12
- package/src/hooks/useStreamingText.test.ts +19 -54
- package/src/hooks/useStreamingText.ts +5 -16
- package/src/hooks/useTreeFocus.test.tsx +3 -1
- package/src/reset.css +0 -29
- package/src/theme/SyntaxTheme.doc.mjs +4 -4
- package/src/theme/defineTheme.ts +13 -4
- package/src/theme/derivedVarRegistry.test.ts +2 -2
- package/src/theme/expandColorScale.test.ts +0 -29
- package/src/theme/expandColorScale.ts +6 -11
- package/src/theme/hct.ts +17 -9
- package/src/theme/tokens.test.ts +9 -182
- package/src/theme/tokens.ts +4 -239
- package/src/theme/useTheme.test.tsx +2 -126
- package/src/theme/useTheme.ts +6 -87
- package/src/utils/index.ts +0 -4
- package/src/utils/sharedResizeObserver.test.ts +2 -2
- package/src/utils/timeParser.test.ts +0 -13
- package/src/utils/timeParser.ts +5 -8
- package/dist/hooks/useHotkeys.d.ts +0 -51
- package/dist/hooks/useHotkeys.d.ts.map +0 -1
- package/dist/hooks/useHotkeys.js +0 -160
- package/dist/utils/color.d.ts +0 -42
- package/dist/utils/color.d.ts.map +0 -1
- package/dist/utils/color.js +0 -150
- package/dist/utils/composeEventHandlers.d.ts +0 -30
- package/dist/utils/composeEventHandlers.d.ts.map +0 -1
- package/dist/utils/composeEventHandlers.js +0 -40
- package/src/Chat/ChatDictationButton.test.tsx +0 -43
- package/src/Chat/ChatLayoutScrollButton.test.tsx +0 -33
- package/src/Chat/ChatMessageMetadata.test.tsx +0 -32
- package/src/Collapsible/Collapsible.test.tsx +0 -405
- package/src/FieldStatus/FieldStatus.test.tsx +0 -282
- package/src/InteractiveRoleContext/InteractiveRoleContext.test.tsx +0 -185
- package/src/Layout/Layout.test.tsx +0 -285
- package/src/Layout/LayoutSlots.test.tsx +0 -364
- package/src/Outline/parseOutlineFromMarkdown.test.ts +0 -80
- package/src/OverflowList/OverflowList.test.tsx +0 -416
- package/src/Overlay/Overlay.test.tsx +0 -356
- package/src/Resizable/ResizeHandle.test.tsx +0 -218
- package/src/SizeContext/SizeContext.test.tsx +0 -226
- package/src/Toast/useToast.test.tsx +0 -258
- package/src/__tests__/TestIcon.tsx +0 -26
- package/src/__tests__/fastRoleQueries.ts +0 -66
- package/src/docPropReferences.test.ts +0 -178
- package/src/hooks/useHotkeys.doc.mjs +0 -52
- package/src/hooks/useHotkeys.test.ts +0 -245
- package/src/hooks/useHotkeys.ts +0 -203
- package/src/theme/themingTargets.test.ts +0 -353
- package/src/utils/color.test.ts +0 -133
- package/src/utils/color.ts +0 -148
- package/src/utils/composeEventHandlers.test.ts +0 -71
- package/src/utils/composeEventHandlers.ts +0 -44
- package/src/utils/mergeProps.test.ts +0 -166
|
@@ -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,
|
|
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;
|
|
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,
|
|
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"}
|
|
@@ -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 {
|
|
29
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
30
30
|
/**
|
|
31
31
|
* A confirmation dialog for destructive or irreversible actions.
|
|
32
32
|
*
|
|
@@ -62,16 +62,14 @@ export function AlertDialog({
|
|
|
62
62
|
xstyle,
|
|
63
63
|
className,
|
|
64
64
|
style,
|
|
65
|
-
'data-testid': testId
|
|
66
|
-
...rest
|
|
65
|
+
'data-testid': testId
|
|
67
66
|
}) {
|
|
68
67
|
const titleId = useId();
|
|
69
68
|
const descriptionId = useId();
|
|
70
69
|
const handleCancel = useCallback(() => {
|
|
71
70
|
onOpenChange(false);
|
|
72
71
|
}, [onOpenChange]);
|
|
73
|
-
return /*#__PURE__*/
|
|
74
|
-
...rest,
|
|
72
|
+
return /*#__PURE__*/_jsx(Dialog, {
|
|
75
73
|
ref: ref,
|
|
76
74
|
isOpen: isOpen,
|
|
77
75
|
isInline: isInline,
|
|
@@ -87,36 +85,36 @@ export function AlertDialog({
|
|
|
87
85
|
}),
|
|
88
86
|
xstyle: xstyle,
|
|
89
87
|
"data-testid": testId,
|
|
90
|
-
children: /*#__PURE__*/
|
|
91
|
-
content: /*#__PURE__*/
|
|
92
|
-
children: [/*#__PURE__*/
|
|
88
|
+
children: /*#__PURE__*/_jsx(Layout, {
|
|
89
|
+
content: /*#__PURE__*/_jsxs(LayoutContent, {
|
|
90
|
+
children: [/*#__PURE__*/_jsx(Heading, {
|
|
93
91
|
level: 2,
|
|
94
92
|
id: titleId,
|
|
95
93
|
children: title
|
|
96
|
-
}
|
|
94
|
+
}), /*#__PURE__*/_jsx(Text, {
|
|
97
95
|
type: "body",
|
|
98
96
|
color: "secondary",
|
|
99
97
|
id: descriptionId,
|
|
100
98
|
children: description
|
|
101
|
-
}
|
|
102
|
-
}
|
|
103
|
-
footer: /*#__PURE__*/
|
|
104
|
-
children: /*#__PURE__*/
|
|
99
|
+
})]
|
|
100
|
+
}),
|
|
101
|
+
footer: /*#__PURE__*/_jsx(LayoutFooter, {
|
|
102
|
+
children: /*#__PURE__*/_jsxs(HStack, {
|
|
105
103
|
gap: 2,
|
|
106
104
|
hAlign: "end",
|
|
107
|
-
children: [/*#__PURE__*/
|
|
105
|
+
children: [/*#__PURE__*/_jsx(Button, {
|
|
108
106
|
variant: "ghost",
|
|
109
107
|
label: cancelLabel,
|
|
110
108
|
onClick: handleCancel
|
|
111
|
-
}
|
|
109
|
+
}), /*#__PURE__*/_jsx(Button, {
|
|
112
110
|
variant: actionVariant,
|
|
113
111
|
label: actionLabel,
|
|
114
112
|
onClick: onAction,
|
|
115
113
|
isLoading: isActionLoading
|
|
116
|
-
}
|
|
117
|
-
}
|
|
118
|
-
}
|
|
119
|
-
}
|
|
120
|
-
}
|
|
114
|
+
})]
|
|
115
|
+
})
|
|
116
|
+
})
|
|
117
|
+
})
|
|
118
|
+
});
|
|
121
119
|
}
|
|
122
120
|
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 {
|
|
18
|
+
import { jsx as _jsx } from "react/jsx-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__*/
|
|
57
|
+
return /*#__PURE__*/_jsx(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
|
+
});
|
|
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,
|
|
217
|
+
export declare function AppShell({ variant, banner, children, contentPadding, 'data-testid': dataTestId, height, mobileNav, sideNav, topNav, xstyle, className, style, ref, }: 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,
|
|
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"}
|
|
@@ -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 {
|
|
40
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
41
41
|
const HasActivity = typeof React.Activity !== 'undefined';
|
|
42
42
|
const ActivityWrapper = HasActivity ? ({
|
|
43
43
|
mode,
|
|
44
44
|
children
|
|
45
|
-
}) => /*#__PURE__*/
|
|
45
|
+
}) => /*#__PURE__*/_jsx(React.Activity, {
|
|
46
46
|
mode: mode,
|
|
47
47
|
children: children
|
|
48
|
-
}
|
|
48
|
+
}) : ({
|
|
49
49
|
children
|
|
50
|
-
}) => /*#__PURE__*/
|
|
50
|
+
}) => /*#__PURE__*/_jsx(_Fragment, {
|
|
51
51
|
children: children
|
|
52
|
-
}
|
|
52
|
+
});
|
|
53
53
|
|
|
54
54
|
// =============================================================================
|
|
55
55
|
// Constants
|
|
@@ -218,8 +218,7 @@ export function AppShell({
|
|
|
218
218
|
xstyle,
|
|
219
219
|
className,
|
|
220
220
|
style,
|
|
221
|
-
ref
|
|
222
|
-
...rest
|
|
221
|
+
ref
|
|
223
222
|
}) {
|
|
224
223
|
// =========================================================================
|
|
225
224
|
// Parse mobileNav prop — normalize to config, custom element, or disabled
|
|
@@ -328,39 +327,39 @@ export function AppShell({
|
|
|
328
327
|
const mobileContentValue = hasSideNav && mobileNavHasToggle ?
|
|
329
328
|
/*#__PURE__*/
|
|
330
329
|
// eslint-disable-next-line @eslint-react/no-unstable-context-value -- context transports ReactNode; instability is inherent
|
|
331
|
-
|
|
330
|
+
_jsx(SideNavRenderContext, {
|
|
332
331
|
value: "drawer-content",
|
|
333
332
|
children: sideNav
|
|
334
|
-
}
|
|
333
|
+
}) : null;
|
|
335
334
|
const drawerMobileContentValue = hasSideNav ?
|
|
336
335
|
/*#__PURE__*/
|
|
337
336
|
// eslint-disable-next-line @eslint-react/no-unstable-context-value -- context transports ReactNode; instability is inherent
|
|
338
|
-
|
|
337
|
+
_jsx(SideNavRenderContext, {
|
|
339
338
|
value: "drawer-content",
|
|
340
339
|
children: sideNav
|
|
341
|
-
}
|
|
342
|
-
const topNavContent = hasTopNav ? isBelowBreakpoint && !mobileNavDisabled && mobileNavReactNode == null ? /*#__PURE__*/
|
|
340
|
+
}) : null;
|
|
341
|
+
const topNavContent = hasTopNav ? isBelowBreakpoint && !mobileNavDisabled && mobileNavReactNode == null ? /*#__PURE__*/_jsx(TopNavMobileContentContext, {
|
|
343
342
|
value: mobileContentValue,
|
|
344
|
-
children: /*#__PURE__*/
|
|
343
|
+
children: /*#__PURE__*/_jsx(TopNavRenderContext, {
|
|
345
344
|
value: "mobile-bar",
|
|
346
345
|
children: topNav
|
|
347
|
-
}
|
|
348
|
-
}
|
|
349
|
-
const headerInner = hasTopNav || hasBanner ? /*#__PURE__*/
|
|
346
|
+
})
|
|
347
|
+
}) : topNav : null;
|
|
348
|
+
const headerInner = hasTopNav || hasBanner ? /*#__PURE__*/_jsxs(LayoutHeader, {
|
|
350
349
|
padding: 0,
|
|
351
350
|
hasDivider: navHasDividers && hasTopNav,
|
|
352
|
-
children: [hasBanner && /*#__PURE__*/
|
|
351
|
+
children: [hasBanner && /*#__PURE__*/_jsx("div", {
|
|
353
352
|
...stylex.props(styles.banner, navAreaStyle),
|
|
354
353
|
children: banner
|
|
355
|
-
}
|
|
356
|
-
}
|
|
357
|
-
const headerContent = headerInner != null ? /*#__PURE__*/
|
|
354
|
+
}), hasTopNav && topNavContent]
|
|
355
|
+
}) : undefined;
|
|
356
|
+
const headerContent = headerInner != null ? /*#__PURE__*/_jsx("div", {
|
|
358
357
|
ref: headerRef,
|
|
359
358
|
...mergeProps(themeProps('app-shell-header', {
|
|
360
359
|
variant
|
|
361
360
|
}), stylex.props(navAreaStyle, isAuto && styles.headerSticky)),
|
|
362
361
|
children: headerInner
|
|
363
|
-
}
|
|
362
|
+
}) : undefined;
|
|
364
363
|
|
|
365
364
|
// =========================================================================
|
|
366
365
|
// Build sideNav content
|
|
@@ -370,7 +369,7 @@ export function AppShell({
|
|
|
370
369
|
// below the header while the main content scrolls. A wrapper div applies
|
|
371
370
|
// the sticky behavior since LayoutPanel doesn't accept style/className.
|
|
372
371
|
// =========================================================================
|
|
373
|
-
const sideNavPanel = showSideNavInline ? /*#__PURE__*/
|
|
372
|
+
const sideNavPanel = showSideNavInline ? /*#__PURE__*/_jsx(LayoutPanel, {
|
|
374
373
|
padding: 0,
|
|
375
374
|
hasDivider: navHasDividers,
|
|
376
375
|
isScrollable: isFill,
|
|
@@ -379,36 +378,36 @@ export function AppShell({
|
|
|
379
378
|
}),
|
|
380
379
|
xstyle: [navAreaStyle, isAuto && stickyBgStyle, isAuto && styles.panelAutoFill],
|
|
381
380
|
children: sideNav
|
|
382
|
-
}
|
|
383
|
-
const sideNavContent = sideNavPanel != null && isAuto ? /*#__PURE__*/
|
|
381
|
+
}) : undefined;
|
|
382
|
+
const sideNavContent = sideNavPanel != null && isAuto ? /*#__PURE__*/_jsx("div", {
|
|
384
383
|
...{
|
|
385
384
|
className: "x2lah0s x7giv3 x7wzq59 xepuwc7 x16zugyo x78zum5 xdt5ytf"
|
|
386
385
|
},
|
|
387
386
|
children: sideNavPanel
|
|
388
|
-
}
|
|
387
|
+
}) : sideNavPanel;
|
|
389
388
|
|
|
390
389
|
// =========================================================================
|
|
391
390
|
// Build main content
|
|
392
391
|
// =========================================================================
|
|
393
392
|
const shouldElevateWithCorner = isElevated && hasTopNav && showSideNavInline;
|
|
394
|
-
const mainInner = /*#__PURE__*/
|
|
393
|
+
const mainInner = /*#__PURE__*/_jsx(LayoutContent, {
|
|
395
394
|
padding: contentPadding ?? 0,
|
|
396
395
|
role: "main",
|
|
397
396
|
id: MAIN_CONTENT_ID,
|
|
398
397
|
isScrollable: isFill,
|
|
399
398
|
xstyle: contentAreaStyle,
|
|
400
399
|
children: children
|
|
401
|
-
}
|
|
402
|
-
const mainContent = shouldElevateWithCorner ? /*#__PURE__*/
|
|
400
|
+
});
|
|
401
|
+
const mainContent = shouldElevateWithCorner ? /*#__PURE__*/_jsxs("div", {
|
|
403
402
|
...{
|
|
404
403
|
className: "x1n2onr6 x78zum5 x98rzlu x2lwn1j x5yr21d"
|
|
405
404
|
},
|
|
406
|
-
children: [/*#__PURE__*/
|
|
405
|
+
children: [/*#__PURE__*/_jsx("div", {
|
|
407
406
|
...{
|
|
408
407
|
className: "x10l6tqk x10a8y8t x10xzikg x183tx6i x47corl"
|
|
409
408
|
}
|
|
410
|
-
}
|
|
411
|
-
}
|
|
409
|
+
}), mainInner]
|
|
410
|
+
}) : mainInner;
|
|
412
411
|
|
|
413
412
|
// =========================================================================
|
|
414
413
|
// Render
|
|
@@ -424,64 +423,63 @@ export function AppShell({
|
|
|
424
423
|
|
|
425
424
|
// For sidenav-only layouts with no TopNav, render the sideNav in topbar
|
|
426
425
|
// mode — it shows heading + footer icons horizontally, with the hamburger
|
|
427
|
-
const autoMobileTopBar = shouldShowAutoToggle && !hasTopNav && hasSideNav ? /*#__PURE__*/
|
|
426
|
+
const autoMobileTopBar = shouldShowAutoToggle && !hasTopNav && hasSideNav ? /*#__PURE__*/_jsx("div", {
|
|
428
427
|
...mergeProps(themeProps('app-shell-header', {
|
|
429
428
|
variant
|
|
430
429
|
}), stylex.props(navAreaStyle, isAuto && styles.headerSticky)),
|
|
431
|
-
children: /*#__PURE__*/
|
|
430
|
+
children: /*#__PURE__*/_jsx(LayoutHeader, {
|
|
432
431
|
padding: 0,
|
|
433
432
|
hasDivider: navHasDividers,
|
|
434
|
-
children: /*#__PURE__*/
|
|
433
|
+
children: /*#__PURE__*/_jsxs("div", {
|
|
435
434
|
...{
|
|
436
435
|
className: "x78zum5 x6s0dn4 x1k15mir xf314gf"
|
|
437
436
|
},
|
|
438
437
|
role: "navigation",
|
|
439
438
|
"aria-label": "Mobile navigation",
|
|
440
|
-
children: [/*#__PURE__*/
|
|
439
|
+
children: [/*#__PURE__*/_jsx(SideNavRenderContext, {
|
|
441
440
|
value: "topbar",
|
|
442
441
|
children: sideNav
|
|
443
|
-
}
|
|
444
|
-
}
|
|
445
|
-
}
|
|
446
|
-
}
|
|
447
|
-
return /*#__PURE__*/
|
|
442
|
+
}), /*#__PURE__*/_jsx(MobileNavToggle, {})]
|
|
443
|
+
})
|
|
444
|
+
})
|
|
445
|
+
}) : undefined;
|
|
446
|
+
return /*#__PURE__*/_jsx(AppShellMobileContext, {
|
|
448
447
|
value: mobileContextValue,
|
|
449
|
-
children: /*#__PURE__*/
|
|
450
|
-
...rest,
|
|
448
|
+
children: /*#__PURE__*/_jsxs("div", {
|
|
451
449
|
ref: mergeRefs(ref, shellRef),
|
|
452
450
|
"data-testid": dataTestId,
|
|
453
451
|
...mergeProps(themeProps('app-shell', {
|
|
454
452
|
variant
|
|
455
453
|
}), 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),
|
|
456
|
-
children: [/*#__PURE__*/
|
|
454
|
+
children: [/*#__PURE__*/_jsx("a", {
|
|
457
455
|
href: `#${MAIN_CONTENT_ID}`,
|
|
458
456
|
...{
|
|
459
457
|
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"
|
|
460
458
|
},
|
|
461
459
|
"data-testid": "skip-to-content",
|
|
462
460
|
children: "Skip to content"
|
|
463
|
-
}
|
|
461
|
+
}), /*#__PURE__*/_jsx(Layout, {
|
|
464
462
|
height: height,
|
|
465
463
|
padding: 0,
|
|
466
|
-
header: /*#__PURE__*/
|
|
464
|
+
header: /*#__PURE__*/_jsxs(_Fragment, {
|
|
467
465
|
children: [headerContent, autoMobileTopBar]
|
|
468
|
-
}
|
|
466
|
+
}),
|
|
469
467
|
start: sideNavContent,
|
|
470
468
|
content: mainContent
|
|
471
|
-
}
|
|
469
|
+
}), shouldRenderMobileNavReactNode && mobileNavReactNode, shouldRenderConfigContent && mobileNavConfigContent, isBelowBreakpoint && !mobileNavDisabled && mobileNavReactNode == null && !mobileNavConfigContent && /*#__PURE__*/_jsxs(ActivityWrapper, {
|
|
472
470
|
mode: isMobileNavOpen ? 'visible' : 'hidden',
|
|
473
|
-
children: [hasSideNav && !hasTopNav && /*#__PURE__*/
|
|
471
|
+
children: [hasSideNav && !hasTopNav && /*#__PURE__*/_jsx(SideNavRenderContext, {
|
|
474
472
|
value: "drawer",
|
|
475
473
|
children: sideNav
|
|
476
|
-
}
|
|
474
|
+
}), hasTopNav && /*#__PURE__*/_jsx(TopNavMobileContentContext, {
|
|
477
475
|
value: drawerMobileContentValue,
|
|
478
|
-
children: /*#__PURE__*/
|
|
476
|
+
children: /*#__PURE__*/_jsx(TopNavRenderContext, {
|
|
479
477
|
value: "drawer",
|
|
480
478
|
children: topNav
|
|
481
|
-
}
|
|
482
|
-
}
|
|
483
|
-
}
|
|
484
|
-
}
|
|
485
|
-
}
|
|
479
|
+
})
|
|
480
|
+
})]
|
|
481
|
+
})]
|
|
482
|
+
})
|
|
483
|
+
});
|
|
486
484
|
}
|
|
487
485
|
AppShell.displayName = 'AppShell';
|
|
@@ -1,13 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @file AspectRatio.tsx
|
|
3
3
|
* @input Uses React, stylex
|
|
4
|
-
* @output Exports AspectRatio component
|
|
4
|
+
* @output Exports AspectRatio component and AspectRatioProps
|
|
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)
|
|
11
10
|
* - /apps/storybook/stories/AspectRatio.stories.tsx
|
|
12
11
|
* - /packages/cli/templates/blocks/components/AspectRatio/ (showcase blocks)
|
|
13
12
|
*/
|
|
@@ -20,15 +19,6 @@ import type { BaseProps } from '../BaseProps';
|
|
|
20
19
|
* this renders a circle at `ratio={1}` and an oval at non-square ratios.
|
|
21
20
|
*/
|
|
22
21
|
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';
|
|
32
22
|
export interface AspectRatioProps extends BaseProps<HTMLDivElement> {
|
|
33
23
|
/** Ref forwarded to the root element */
|
|
34
24
|
ref?: React.Ref<HTMLDivElement>;
|
|
@@ -40,43 +30,19 @@ export interface AspectRatioProps extends BaseProps<HTMLDivElement> {
|
|
|
40
30
|
* The shape of the container. Both shapes respect the provided `ratio`.
|
|
41
31
|
* - `rectangle` (default): a standard rectangular container.
|
|
42
32
|
* - `ellipse`: clips the container to an ellipse — a circle when `ratio={1}`,
|
|
43
|
-
* or an oval at other ratios. Pair with
|
|
44
|
-
*
|
|
33
|
+
* or an oval at other ratios. Pair with a child that fills the container
|
|
34
|
+
* (e.g. an image with `objectFit: 'cover'`).
|
|
45
35
|
*
|
|
46
36
|
* @default 'rectangle'
|
|
47
37
|
*
|
|
48
38
|
* @example
|
|
49
39
|
* ```
|
|
50
|
-
* <AspectRatio ratio={1} shape="ellipse"
|
|
51
|
-
* <img src="avatar.jpg" alt="" />
|
|
40
|
+
* <AspectRatio ratio={1} shape="ellipse">
|
|
41
|
+
* <img src="avatar.jpg" alt="" style={{objectFit: 'cover'}} />
|
|
52
42
|
* </AspectRatio>
|
|
53
43
|
* ```
|
|
54
44
|
*/
|
|
55
45
|
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;
|
|
80
46
|
/**
|
|
81
47
|
* Content to render inside the aspect ratio container.
|
|
82
48
|
* The child element will be positioned absolutely to fill the container.
|
|
@@ -90,29 +56,25 @@ export interface AspectRatioProps extends BaseProps<HTMLDivElement> {
|
|
|
90
56
|
* is positioned absolutely to fill the container, which is useful for images,
|
|
91
57
|
* videos, embeds, and placeholders.
|
|
92
58
|
*
|
|
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
|
-
*
|
|
97
59
|
* Use `shape="ellipse"` to clip the container into an ellipse — a circle at
|
|
98
60
|
* `ratio={1}` or an oval at other ratios. Both shapes respect the provided
|
|
99
61
|
* `ratio`.
|
|
100
62
|
*
|
|
101
63
|
* @example
|
|
102
64
|
* ```
|
|
103
|
-
* <AspectRatio ratio={16 / 9}
|
|
104
|
-
* <img src="image.jpg" alt="Widescreen image" />
|
|
65
|
+
* <AspectRatio ratio={16 / 9}>
|
|
66
|
+
* <img src="image.jpg" alt="Widescreen image" style={{objectFit: 'cover'}} />
|
|
105
67
|
* </AspectRatio>
|
|
106
68
|
* ```
|
|
107
69
|
*
|
|
108
70
|
* @example
|
|
109
71
|
* ```
|
|
110
|
-
* <AspectRatio ratio={1} shape="ellipse"
|
|
111
|
-
* <img src="avatar.jpg" alt="" />
|
|
72
|
+
* <AspectRatio ratio={1} shape="ellipse">
|
|
73
|
+
* <img src="avatar.jpg" alt="" style={{objectFit: 'cover'}} />
|
|
112
74
|
* </AspectRatio>
|
|
113
75
|
* ```
|
|
114
76
|
*/
|
|
115
|
-
export declare function AspectRatio({ ratio, shape,
|
|
77
|
+
export declare function AspectRatio({ ratio, shape, children, xstyle, className, style, ref, ...props }: AspectRatioProps): import("react").JSX.Element;
|
|
116
78
|
export declare namespace AspectRatio {
|
|
117
79
|
var displayName: string;
|
|
118
80
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AspectRatio.d.ts","sourceRoot":"","sources":["../../src/AspectRatio/AspectRatio.tsx"],"names":[],"mappings":"AAIA
|
|
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"}
|
|
@@ -5,13 +5,12 @@
|
|
|
5
5
|
/**
|
|
6
6
|
* @file AspectRatio.tsx
|
|
7
7
|
* @input Uses React, stylex
|
|
8
|
-
* @output Exports AspectRatio component
|
|
8
|
+
* @output Exports AspectRatio component and AspectRatioProps
|
|
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)
|
|
15
14
|
* - /apps/storybook/stories/AspectRatio.stories.tsx
|
|
16
15
|
* - /packages/cli/templates/blocks/components/AspectRatio/ (showcase blocks)
|
|
17
16
|
*/
|
|
@@ -25,16 +24,7 @@ import { themeProps } from "../utils/themeProps.js";
|
|
|
25
24
|
* - `ellipse`: clips the container to an ellipse. Combined with the `ratio`,
|
|
26
25
|
* this renders a circle at `ratio={1}` and an oval at non-square ratios.
|
|
27
26
|
*/
|
|
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";
|
|
27
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
38
28
|
const styles = {
|
|
39
29
|
container: {
|
|
40
30
|
kVAEAm: "x1n2onr6",
|
|
@@ -57,32 +47,27 @@ const styles = {
|
|
|
57
47
|
* is positioned absolutely to fill the container, which is useful for images,
|
|
58
48
|
* videos, embeds, and placeholders.
|
|
59
49
|
*
|
|
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
|
-
*
|
|
64
50
|
* Use `shape="ellipse"` to clip the container into an ellipse — a circle at
|
|
65
51
|
* `ratio={1}` or an oval at other ratios. Both shapes respect the provided
|
|
66
52
|
* `ratio`.
|
|
67
53
|
*
|
|
68
54
|
* @example
|
|
69
55
|
* ```
|
|
70
|
-
* <AspectRatio ratio={16 / 9}
|
|
71
|
-
* <img src="image.jpg" alt="Widescreen image" />
|
|
56
|
+
* <AspectRatio ratio={16 / 9}>
|
|
57
|
+
* <img src="image.jpg" alt="Widescreen image" style={{objectFit: 'cover'}} />
|
|
72
58
|
* </AspectRatio>
|
|
73
59
|
* ```
|
|
74
60
|
*
|
|
75
61
|
* @example
|
|
76
62
|
* ```
|
|
77
|
-
* <AspectRatio ratio={1} shape="ellipse"
|
|
78
|
-
* <img src="avatar.jpg" alt="" />
|
|
63
|
+
* <AspectRatio ratio={1} shape="ellipse">
|
|
64
|
+
* <img src="avatar.jpg" alt="" style={{objectFit: 'cover'}} />
|
|
79
65
|
* </AspectRatio>
|
|
80
66
|
* ```
|
|
81
67
|
*/
|
|
82
68
|
export function AspectRatio({
|
|
83
69
|
ratio,
|
|
84
70
|
shape = 'rectangle',
|
|
85
|
-
fit,
|
|
86
71
|
children,
|
|
87
72
|
xstyle,
|
|
88
73
|
className,
|
|
@@ -90,7 +75,7 @@ export function AspectRatio({
|
|
|
90
75
|
ref,
|
|
91
76
|
...props
|
|
92
77
|
}) {
|
|
93
|
-
return /*#__PURE__*/
|
|
78
|
+
return /*#__PURE__*/_jsx("div", {
|
|
94
79
|
ref: ref,
|
|
95
80
|
...mergeProps(themeProps('aspect-ratio', {
|
|
96
81
|
shape
|
|
@@ -99,18 +84,12 @@ export function AspectRatio({
|
|
|
99
84
|
aspectRatio: ratio
|
|
100
85
|
}),
|
|
101
86
|
...props,
|
|
102
|
-
children: /*#__PURE__*/
|
|
103
|
-
"data-astryx-aspect-ratio-override": fit,
|
|
87
|
+
children: /*#__PURE__*/_jsx("div", {
|
|
104
88
|
...{
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
},
|
|
108
|
-
1: {
|
|
109
|
-
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d x78zum5 x6s0dn4 xl56j7k"
|
|
110
|
-
}
|
|
111
|
-
}[!!(fit === 'center') << 0],
|
|
89
|
+
className: "x10l6tqk x13vifvy x1o0tod xh8yej3 x5yr21d"
|
|
90
|
+
},
|
|
112
91
|
children: children
|
|
113
|
-
}
|
|
114
|
-
}
|
|
92
|
+
})
|
|
93
|
+
});
|
|
115
94
|
}
|
|
116
95
|
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
|
|
10
|
+
export type { AspectRatioProps, AspectRatioShape } 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,
|
|
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 +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,
|
|
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"}
|