@astryxdesign/core 0.1.8 → 0.1.9-canary.75d2d03
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/CHANGELOG.md +100 -0
- package/dist/AppShell/AppShell.d.ts.map +1 -1
- package/dist/AppShell/AppShell.js +6 -2
- package/dist/AppShell/AppShellMobileContext.d.ts +8 -0
- package/dist/AppShell/AppShellMobileContext.d.ts.map +1 -1
- package/dist/Avatar/Avatar.d.ts +18 -2
- package/dist/Avatar/Avatar.d.ts.map +1 -1
- package/dist/Avatar/Avatar.js +63 -7
- package/dist/Avatar/AvatarStatusDot.d.ts +33 -5
- package/dist/Avatar/AvatarStatusDot.d.ts.map +1 -1
- package/dist/Avatar/AvatarStatusDot.js +144 -19
- package/dist/Banner/Banner.d.ts +9 -1
- package/dist/Banner/Banner.d.ts.map +1 -1
- package/dist/Banner/Banner.js +31 -2
- package/dist/Breadcrumbs/BreadcrumbItem.d.ts +31 -2
- package/dist/Breadcrumbs/BreadcrumbItem.d.ts.map +1 -1
- package/dist/Breadcrumbs/BreadcrumbItem.js +208 -6
- package/dist/Breadcrumbs/index.d.ts +5 -0
- package/dist/Breadcrumbs/index.d.ts.map +1 -1
- package/dist/Breadcrumbs/index.js +9 -1
- package/dist/Button/Button.d.ts +8 -2
- package/dist/Button/Button.d.ts.map +1 -1
- package/dist/Button/Button.js +31 -2
- package/dist/ButtonGroup/ButtonGroup.d.ts +9 -1
- package/dist/ButtonGroup/ButtonGroup.d.ts.map +1 -1
- package/dist/ButtonGroup/ButtonGroup.js +30 -1
- package/dist/Calendar/Calendar.d.ts.map +1 -1
- package/dist/Calendar/Calendar.js +30 -2
- package/dist/Calendar/dayCellUtils.js +1 -1
- package/dist/Card/Card.d.ts +8 -2
- package/dist/Card/Card.d.ts.map +1 -1
- package/dist/Card/Card.js +28 -2
- package/dist/Carousel/Carousel.d.ts +4 -1
- package/dist/Carousel/Carousel.d.ts.map +1 -1
- package/dist/Carousel/Carousel.js +24 -4
- package/dist/Chat/ChatComposer.d.ts +8 -0
- package/dist/Chat/ChatComposer.d.ts.map +1 -1
- package/dist/Chat/ChatComposer.js +46 -7
- package/dist/Chat/ChatComposerDrawer.d.ts +2 -0
- package/dist/Chat/ChatComposerDrawer.d.ts.map +1 -1
- package/dist/Chat/ChatComposerDrawer.js +11 -1
- package/dist/Chat/ChatComposerInput.d.ts +20 -3
- package/dist/Chat/ChatComposerInput.d.ts.map +1 -1
- package/dist/Chat/ChatComposerInput.js +35 -3
- package/dist/Chat/ChatContext.d.ts +33 -0
- package/dist/Chat/ChatContext.d.ts.map +1 -1
- package/dist/Chat/ChatContext.js +16 -2
- package/dist/Chat/ChatDictationButton.d.ts.map +1 -1
- package/dist/Chat/ChatDictationButton.js +1 -1
- package/dist/Chat/ChatLayout.d.ts.map +1 -1
- package/dist/Chat/ChatLayoutScrollButton.d.ts.map +1 -1
- package/dist/Chat/ChatLayoutScrollButton.js +4 -4
- package/dist/Chat/ChatMessageMetadata.d.ts.map +1 -1
- package/dist/Chat/ChatSendButton.d.ts.map +1 -1
- package/dist/Chat/ChatSendButton.js +7 -1
- package/dist/Chat/ChatToolCalls.d.ts +5 -1
- package/dist/Chat/ChatToolCalls.d.ts.map +1 -1
- package/dist/Chat/ChatToolCalls.js +18 -9
- package/dist/Chat/index.d.ts +2 -1
- package/dist/Chat/index.d.ts.map +1 -1
- package/dist/Chat/index.js +1 -1
- package/dist/Chat/useChatStreamScroll.d.ts +2 -1
- package/dist/Chat/useChatStreamScroll.d.ts.map +1 -1
- package/dist/Chat/useChatStreamScroll.js +22 -8
- package/dist/Chat/useSpeechRecognition.d.ts +0 -1
- package/dist/Chat/useSpeechRecognition.d.ts.map +1 -1
- package/dist/Chat/useSpeechRecognition.js +1 -1
- package/dist/Chat/useTriggerMenu.d.ts.map +1 -1
- package/dist/CheckboxInput/CheckboxInput.js +1 -1
- package/dist/CheckboxList/CheckboxListItem.d.ts +20 -1
- package/dist/CheckboxList/CheckboxListItem.d.ts.map +1 -1
- package/dist/CheckboxList/CheckboxListItem.js +11 -1
- package/dist/ClickableCard/ClickableCard.d.ts +9 -2
- package/dist/ClickableCard/ClickableCard.d.ts.map +1 -1
- package/dist/ClickableCard/ClickableCard.js +5 -2
- package/dist/CodeBlock/CodeBlock.d.ts.map +1 -1
- package/dist/CodeBlock/CodeBlock.js +8 -1
- package/dist/CommandPalette/CommandPalette.d.ts +1 -1
- package/dist/CommandPalette/CommandPalette.d.ts.map +1 -1
- package/dist/CommandPalette/CommandPalette.js +3 -1
- package/dist/CommandPalette/CommandPaletteGroup.d.ts.map +1 -1
- package/dist/CommandPalette/CommandPaletteGroup.js +9 -2
- package/dist/CommandPalette/CommandPaletteInput.d.ts +7 -1
- package/dist/CommandPalette/CommandPaletteInput.d.ts.map +1 -1
- package/dist/CommandPalette/CommandPaletteInput.js +6 -1
- package/dist/DateInput/DateInput.d.ts +47 -1
- package/dist/DateInput/DateInput.d.ts.map +1 -1
- package/dist/DateInput/DateInput.js +26 -2
- package/dist/DateInput/index.d.ts +1 -1
- package/dist/DateInput/index.d.ts.map +1 -1
- package/dist/DateTimeInput/DateTimeInput.d.ts.map +1 -1
- package/dist/DateTimeInput/DateTimeInput.js +10 -1
- package/dist/Dialog/Dialog.d.ts +3 -0
- package/dist/Dialog/Dialog.d.ts.map +1 -1
- package/dist/Dialog/Dialog.js +57 -6
- package/dist/Dialog/DialogContext.d.ts +7 -0
- package/dist/Dialog/DialogContext.d.ts.map +1 -1
- package/dist/Dialog/DialogContext.js +2 -2
- package/dist/Dialog/DialogHeader.d.ts +5 -2
- package/dist/Dialog/DialogHeader.d.ts.map +1 -1
- package/dist/Dialog/DialogHeader.js +6 -1
- package/dist/Divider/Divider.js +1 -1
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.d.ts +1 -2
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.js +1 -2
- package/dist/DropdownMenu/DropdownMenuRadioGroup.d.ts +1 -2
- package/dist/DropdownMenu/DropdownMenuRadioGroup.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuRadioGroup.js +1 -2
- package/dist/Field/Field.d.ts.map +1 -1
- package/dist/Field/Field.js +2 -3
- package/dist/Field/FieldLabel.d.ts +1 -1
- package/dist/Field/FieldLabel.d.ts.map +1 -1
- package/dist/Field/FieldLabel.js +42 -15
- package/dist/FieldStatus/FieldStatus.d.ts +8 -0
- package/dist/FieldStatus/FieldStatus.d.ts.map +1 -1
- package/dist/FieldStatus/FieldStatus.js +22 -4
- package/dist/FileInput/FileInput.d.ts.map +1 -1
- package/dist/FileInput/FileInput.js +10 -2
- package/dist/HoverCard/HoverCard.d.ts +9 -1
- package/dist/HoverCard/HoverCard.d.ts.map +1 -1
- package/dist/HoverCard/HoverCard.js +2 -0
- package/dist/HoverCard/useHoverCard.d.ts +8 -0
- package/dist/HoverCard/useHoverCard.d.ts.map +1 -1
- package/dist/HoverCard/useHoverCard.js +7 -2
- package/dist/Icon/Icon.d.ts +7 -2
- package/dist/Icon/Icon.d.ts.map +1 -1
- package/dist/Item/Item.d.ts +6 -1
- package/dist/Item/Item.d.ts.map +1 -1
- package/dist/Item/Item.js +22 -1
- package/dist/Layer/useLayer.d.ts +6 -0
- package/dist/Layer/useLayer.d.ts.map +1 -1
- package/dist/Layer/useLayer.js +2 -0
- package/dist/MobileNav/MobileNav.d.ts.map +1 -1
- package/dist/MobileNav/MobileNav.js +6 -1
- package/dist/MobileNav/MobileNavToggle.d.ts.map +1 -1
- package/dist/MobileNav/MobileNavToggle.js +4 -0
- package/dist/MultiSelector/MultiSelector.d.ts.map +1 -1
- package/dist/MultiSelector/MultiSelector.js +39 -12
- package/dist/MultiSelector/hooks.d.ts.map +1 -1
- package/dist/MultiSelector/hooks.js +16 -0
- package/dist/NumberInput/NumberInput.d.ts.map +1 -1
- package/dist/Outline/Outline.d.ts +0 -1
- package/dist/Outline/Outline.d.ts.map +1 -1
- package/dist/Outline/Outline.js +0 -1
- package/dist/OverflowList/OverflowList.d.ts +20 -3
- package/dist/OverflowList/OverflowList.d.ts.map +1 -1
- package/dist/OverflowList/OverflowList.js +29 -4
- package/dist/Pagination/Pagination.d.ts.map +1 -1
- package/dist/Pagination/Pagination.js +11 -3
- package/dist/Popover/Popover.d.ts.map +1 -1
- package/dist/Popover/Popover.js +3 -2
- package/dist/Popover/usePopover.d.ts.map +1 -1
- package/dist/Popover/usePopover.js +3 -9
- package/dist/PowerSearch/PowerSearchEditPopover.js +1 -1
- package/dist/PowerSearch/usePowerSearchSource.d.ts.map +1 -1
- package/dist/SelectableCard/SelectableCard.d.ts +9 -2
- package/dist/SelectableCard/SelectableCard.d.ts.map +1 -1
- package/dist/SelectableCard/SelectableCard.js +16 -13
- package/dist/Selector/Selector.d.ts.map +1 -1
- package/dist/Selector/Selector.js +4 -2
- package/dist/Selector/hooks.d.ts.map +1 -1
- package/dist/Selector/hooks.js +16 -0
- package/dist/SideNav/SideNavCollapseButton.d.ts.map +1 -1
- package/dist/SideNav/SideNavHeading.d.ts.map +1 -1
- package/dist/SideNav/SideNavHeading.js +21 -8
- package/dist/SideNav/SideNavItem.d.ts.map +1 -1
- package/dist/Slider/Slider.d.ts.map +1 -1
- package/dist/Slider/Slider.js +19 -2
- package/dist/Stack/stack.stylex.d.ts +9 -9
- package/dist/Table/BaseTable.d.ts.map +1 -1
- package/dist/Table/BaseTable.js +3 -2
- package/dist/Table/index.d.ts +2 -0
- package/dist/Table/index.d.ts.map +1 -1
- package/dist/Table/index.js +1 -0
- package/dist/Table/plugins/groupedRows/useTableGroupedRows.d.ts.map +1 -1
- package/dist/Table/plugins/rowStatus/index.d.ts +3 -0
- package/dist/Table/plugins/rowStatus/index.d.ts.map +1 -0
- package/dist/Table/plugins/rowStatus/index.js +3 -0
- package/dist/Table/plugins/rowStatus/useTableRowStatus.d.ts +60 -0
- package/dist/Table/plugins/rowStatus/useTableRowStatus.d.ts.map +1 -0
- package/dist/Table/plugins/rowStatus/useTableRowStatus.js +145 -0
- package/dist/Table/plugins/selection/useTableSelection.d.ts +13 -0
- package/dist/Table/plugins/selection/useTableSelection.d.ts.map +1 -1
- package/dist/Table/plugins/selection/useTableSelection.js +4 -1
- package/dist/Table/plugins/tree/useTableTreeData.d.ts +16 -0
- package/dist/Table/plugins/tree/useTableTreeData.d.ts.map +1 -1
- package/dist/Table/plugins/tree/useTableTreeData.js +87 -0
- package/dist/Table/plugins/tree/useTableTreeState.d.ts +6 -0
- package/dist/Table/plugins/tree/useTableTreeState.d.ts.map +1 -1
- package/dist/Table/plugins/tree/useTableTreeState.js +22 -1
- package/dist/Table/useBaseTablePlugins.d.ts.map +1 -1
- package/dist/Table/useBaseTablePlugins.js +5 -3
- package/dist/Thumbnail/Thumbnail.d.ts +26 -5
- package/dist/Thumbnail/Thumbnail.d.ts.map +1 -1
- package/dist/Thumbnail/Thumbnail.js +97 -54
- package/dist/Thumbnail/thumbnail.markers.stylex.d.ts +9 -0
- package/dist/Thumbnail/thumbnail.markers.stylex.d.ts.map +1 -0
- package/dist/Thumbnail/thumbnail.markers.stylex.js +14 -0
- package/dist/TimeInput/TimeInput.d.ts.map +1 -1
- package/dist/TimeInput/TimeInput.js +15 -4
- package/dist/Timestamp/Timestamp.d.ts +3 -1
- package/dist/Timestamp/Timestamp.d.ts.map +1 -1
- package/dist/Timestamp/Timestamp.js +8 -6
- package/dist/Toast/useToast.d.ts.map +1 -1
- package/dist/Toast/useToast.js +2 -5
- package/dist/ToggleButton/ToggleButtonGroup.d.ts +0 -1
- package/dist/ToggleButton/ToggleButtonGroup.d.ts.map +1 -1
- package/dist/ToggleButton/ToggleButtonGroup.js +1 -1
- package/dist/Tokenizer/Tokenizer.d.ts +1 -1
- package/dist/Tokenizer/Tokenizer.d.ts.map +1 -1
- package/dist/Tokenizer/Tokenizer.js +16 -4
- package/dist/TopNav/TopNavHeading.d.ts.map +1 -1
- package/dist/TopNav/TopNavHeading.js +18 -8
- package/dist/TopNav/TopNavMegaMenu.js +10 -4
- package/dist/TopNav/TopNavMegaMenuFeaturedCard.d.ts +9 -1
- package/dist/TopNav/TopNavMegaMenuFeaturedCard.d.ts.map +1 -1
- package/dist/TopNav/TopNavMegaMenuFeaturedCard.js +8 -1
- package/dist/TopNav/TopNavMenu.d.ts +2 -1
- package/dist/TopNav/TopNavMenu.d.ts.map +1 -1
- package/dist/TopNav/TopNavMenu.js +68 -6
- package/dist/TreeList/TreeList.d.ts +12 -3
- package/dist/TreeList/TreeList.d.ts.map +1 -1
- package/dist/TreeList/TreeList.js +2 -0
- package/dist/TreeList/TreeListBranches.d.ts +5 -0
- package/dist/TreeList/TreeListBranches.d.ts.map +1 -1
- package/dist/TreeList/TreeListBranches.js +10 -4
- package/dist/TreeList/TreeListItem.d.ts +8 -2
- package/dist/TreeList/TreeListItem.d.ts.map +1 -1
- package/dist/TreeList/TreeListItem.js +27 -7
- package/dist/TreeList/TreeListTypes.d.ts +25 -1
- package/dist/TreeList/TreeListTypes.d.ts.map +1 -1
- package/dist/TreeList/index.d.ts +2 -2
- package/dist/TreeList/index.d.ts.map +1 -1
- package/dist/astryx.css +28 -18
- package/dist/astryx.umd.js +51 -51
- package/dist/astryx.umd.js.map +4 -4
- package/dist/authoring/doc.d.ts.map +1 -1
- package/dist/docs-types.d.ts +8 -0
- package/dist/docs-types.d.ts.map +1 -1
- package/dist/hooks/computeOverflow.d.ts +47 -0
- package/dist/hooks/computeOverflow.d.ts.map +1 -0
- package/dist/hooks/computeOverflow.js +213 -0
- package/dist/hooks/index.d.ts +1 -0
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/index.js +2 -1
- package/dist/hooks/useDevWarning.d.ts +18 -0
- package/dist/hooks/useDevWarning.d.ts.map +1 -0
- package/dist/hooks/useDevWarning.js +49 -0
- package/dist/hooks/useOverflow.d.ts +19 -0
- package/dist/hooks/useOverflow.d.ts.map +1 -1
- package/dist/hooks/useOverflow.js +36 -25
- package/dist/i18n/InternationalizationContext.d.ts +1 -0
- package/dist/i18n/InternationalizationContext.d.ts.map +1 -1
- package/dist/i18n/InternationalizationContext.js +3 -0
- package/dist/i18n/InternationalizationProvider.d.ts +8 -1
- package/dist/i18n/InternationalizationProvider.d.ts.map +1 -1
- package/dist/i18n/InternationalizationProvider.js +5 -1
- package/dist/i18n/getLocaleDirection.d.ts +18 -0
- package/dist/i18n/getLocaleDirection.d.ts.map +1 -0
- package/dist/i18n/getLocaleDirection.js +29 -0
- package/dist/i18n/index.d.ts +6 -0
- package/dist/i18n/index.d.ts.map +1 -1
- package/dist/i18n/index.js +7 -1
- package/dist/i18n/resolve.d.ts.map +1 -1
- package/dist/i18n/resolve.js +7 -18
- package/dist/i18n/useDirection.d.ts +2 -0
- package/dist/i18n/useDirection.d.ts.map +1 -0
- package/dist/i18n/useDirection.js +27 -0
- package/dist/theme/Theme.d.ts.map +1 -1
- package/dist/theme/Theme.js +2 -7
- package/dist/theme/generateThemeRules.d.ts.map +1 -1
- package/dist/theme/generateThemeRules.js +51 -0
- package/dist/theme/hct.d.ts +0 -1
- package/dist/theme/hct.d.ts.map +1 -1
- package/dist/theme/hct.js +1 -1
- package/dist/theme/syntax/defineSyntaxTheme.d.ts.map +1 -1
- package/dist/theme/syntax/defineSyntaxTheme.js +2 -1
- package/dist/utils/devWarning.d.ts +42 -0
- package/dist/utils/devWarning.d.ts.map +1 -0
- package/dist/utils/devWarning.js +88 -0
- package/dist/utils/index.d.ts +3 -1
- package/dist/utils/index.d.ts.map +1 -1
- package/dist/utils/index.js +3 -2
- package/dist/utils/plainDate.d.ts +30 -0
- package/dist/utils/plainDate.d.ts.map +1 -1
- package/dist/utils/plainDate.js +53 -0
- package/dist/utils/types.d.ts +13 -0
- package/dist/utils/types.d.ts.map +1 -1
- package/locales/en.json +24 -0
- package/locales/fr-FR.json +14 -0
- package/locales/pseudo.json +18 -0
- package/package.json +1 -1
- package/src/AppShell/AppShell.tsx +6 -0
- package/src/AppShell/AppShellMobileContext.tsx +8 -0
- package/src/AppShell/useAppShellMobile.doc.mjs +8 -0
- package/src/Avatar/Avatar.doc.mjs +15 -3
- package/src/Avatar/Avatar.test.tsx +156 -1
- package/src/Avatar/Avatar.tsx +96 -4
- package/src/Avatar/AvatarStatusDot.doc.mjs +23 -12
- package/src/Avatar/AvatarStatusDot.test.tsx +284 -0
- package/src/Avatar/AvatarStatusDot.tsx +178 -21
- package/src/Banner/Banner.doc.mjs +9 -0
- package/src/Banner/Banner.test.tsx +30 -0
- package/src/Banner/Banner.tsx +47 -3
- package/src/Breadcrumbs/BreadcrumbItem.doc.mjs +26 -0
- package/src/Breadcrumbs/BreadcrumbItem.tsx +333 -14
- package/src/Breadcrumbs/Breadcrumbs.doc.mjs +2 -0
- package/src/Breadcrumbs/Breadcrumbs.test.tsx +284 -2
- package/src/Breadcrumbs/index.ts +27 -0
- package/src/Button/Button.doc.mjs +9 -0
- package/src/Button/Button.test.tsx +49 -0
- package/src/Button/Button.tsx +25 -1
- package/src/ButtonGroup/ButtonGroup.doc.mjs +3 -0
- package/src/ButtonGroup/ButtonGroup.test.tsx +37 -0
- package/src/ButtonGroup/ButtonGroup.tsx +32 -0
- package/src/Calendar/Calendar.doc.mjs +12 -1
- package/src/Calendar/Calendar.test.tsx +193 -0
- package/src/Calendar/Calendar.tsx +38 -16
- package/src/Calendar/dayCellUtils.test.ts +5 -0
- package/src/Calendar/dayCellUtils.ts +1 -1
- package/src/Card/Card.doc.mjs +9 -0
- package/src/Card/Card.test.tsx +21 -3
- package/src/Card/Card.tsx +35 -2
- package/src/Carousel/Carousel.doc.mjs +1 -0
- package/src/Carousel/Carousel.test.tsx +53 -0
- package/src/Carousel/Carousel.tsx +34 -4
- package/src/Chat/ChatComposer.doc.mjs +12 -3
- package/src/Chat/ChatComposer.test.tsx +115 -0
- package/src/Chat/ChatComposer.tsx +73 -9
- package/src/Chat/ChatComposerDrawer.test.tsx +61 -0
- package/src/Chat/ChatComposerDrawer.tsx +11 -1
- package/src/Chat/ChatComposerInput.doc.mjs +7 -0
- package/src/Chat/ChatComposerInput.test.tsx +103 -0
- package/src/Chat/ChatComposerInput.tsx +49 -3
- package/src/Chat/ChatContext.tsx +37 -10
- package/src/Chat/ChatDictationButton.tsx +4 -1
- package/src/Chat/ChatLayout.tsx +3 -1
- package/src/Chat/ChatLayoutScrollButton.tsx +7 -2
- package/src/Chat/ChatMessageMetadata.tsx +1 -2
- package/src/Chat/ChatSendButton.tsx +11 -1
- package/src/Chat/ChatToolCalls.test.tsx +64 -0
- package/src/Chat/ChatToolCalls.tsx +25 -4
- package/src/Chat/index.ts +5 -1
- package/src/Chat/useChatStreamScroll.test.tsx +49 -0
- package/src/Chat/useChatStreamScroll.ts +27 -10
- package/src/Chat/useSpeechRecognition.ts +1 -1
- package/src/Chat/useTriggerMenu.tsx +3 -1
- package/src/CheckboxInput/CheckboxInput.test.tsx +32 -1
- package/src/CheckboxInput/CheckboxInput.tsx +1 -1
- package/src/CheckboxList/CheckboxList.test.tsx +81 -3
- package/src/CheckboxList/CheckboxListItem.doc.mjs +33 -5
- package/src/CheckboxList/CheckboxListItem.tsx +41 -5
- package/src/ClickableCard/ClickableCard.doc.mjs +2 -0
- package/src/ClickableCard/ClickableCard.test.tsx +34 -0
- package/src/ClickableCard/ClickableCard.tsx +13 -3
- package/src/CodeBlock/CodeBlock.test.tsx +56 -0
- package/src/CodeBlock/CodeBlock.tsx +9 -1
- package/src/CommandPalette/CommandPalette.doc.mjs +1 -0
- package/src/CommandPalette/CommandPalette.tsx +3 -1
- package/src/CommandPalette/CommandPaletteGroup.test.tsx +71 -0
- package/src/CommandPalette/CommandPaletteGroup.tsx +12 -1
- package/src/CommandPalette/CommandPaletteInput.doc.mjs +26 -9
- package/src/CommandPalette/CommandPaletteInput.test.tsx +34 -0
- package/src/CommandPalette/CommandPaletteInput.tsx +11 -0
- package/src/ContextMenu/ContextMenu.test.tsx +193 -0
- package/src/DateInput/DateInput.doc.mjs +16 -0
- package/src/DateInput/DateInput.test.tsx +108 -0
- package/src/DateInput/DateInput.tsx +68 -3
- package/src/DateInput/index.ts +1 -0
- package/src/DateTimeInput/DateTimeInput.test.tsx +35 -0
- package/src/DateTimeInput/DateTimeInput.tsx +14 -2
- package/src/Dialog/Dialog.doc.mjs +2 -2
- package/src/Dialog/Dialog.test.tsx +77 -4
- package/src/Dialog/Dialog.tsx +89 -5
- package/src/Dialog/DialogContext.ts +9 -2
- package/src/Dialog/DialogHeader.doc.mjs +2 -2
- package/src/Dialog/DialogHeader.tsx +9 -2
- package/src/Divider/Divider.tsx +2 -2
- package/src/DropdownMenu/DropdownMenu.test.tsx +169 -0
- package/src/DropdownMenu/DropdownMenuCheckboxItem.tsx +1 -2
- package/src/DropdownMenu/DropdownMenuRadioGroup.tsx +1 -2
- package/src/Field/Field.test.tsx +57 -12
- package/src/Field/Field.tsx +6 -5
- package/src/Field/FieldLabel.tsx +8 -0
- package/src/FieldStatus/FieldStatus.doc.mjs +17 -5
- package/src/FieldStatus/FieldStatus.test.tsx +78 -40
- package/src/FieldStatus/FieldStatus.tsx +22 -4
- package/src/FileInput/FileInput.test.tsx +52 -3
- package/src/FileInput/FileInput.tsx +13 -2
- package/src/HoverCard/HoverCard.doc.mjs +13 -0
- package/src/HoverCard/HoverCard.test.tsx +21 -2
- package/src/HoverCard/HoverCard.tsx +11 -0
- package/src/HoverCard/useHoverCard.doc.mjs +2 -0
- package/src/HoverCard/useHoverCard.tsx +24 -2
- package/src/Icon/Icon.doc.mjs +3 -2
- package/src/Icon/Icon.tsx +7 -2
- package/src/IconButton/IconButton.doc.mjs +8 -0
- package/src/IconButton/IconButton.test.tsx +15 -18
- package/src/Item/Item.test.tsx +40 -18
- package/src/Item/Item.tsx +38 -2
- package/src/Layer/useLayer.tsx +8 -0
- package/src/List/List.test.tsx +9 -8
- package/src/MobileNav/MobileNav.tsx +12 -1
- package/src/MobileNav/MobileNavToggle.test.tsx +116 -0
- package/src/MobileNav/MobileNavToggle.tsx +9 -1
- package/src/MultiSelector/MultiSelector.doc.mjs +4 -2
- package/src/MultiSelector/MultiSelector.test.tsx +172 -3
- package/src/MultiSelector/MultiSelector.tsx +55 -12
- package/src/MultiSelector/hooks.ts +17 -0
- package/src/NumberInput/NumberInput.test.tsx +11 -7
- package/src/NumberInput/NumberInput.tsx +1 -2
- package/src/Outline/Outline.tsx +0 -1
- package/src/OverflowList/OverflowList.doc.mjs +39 -6
- package/src/OverflowList/OverflowList.test.tsx +111 -0
- package/src/OverflowList/OverflowList.tsx +48 -8
- package/src/Pagination/Pagination.tsx +11 -3
- package/src/Popover/Popover.tsx +7 -4
- package/src/Popover/usePopover.tsx +9 -13
- package/src/PowerSearch/PowerSearch.doc.mjs +14 -0
- package/src/PowerSearch/PowerSearch.test.tsx +20 -0
- package/src/PowerSearch/PowerSearchEditPopover.test.tsx +67 -0
- package/src/PowerSearch/PowerSearchEditPopover.tsx +1 -1
- package/src/PowerSearch/usePowerSearchSource.ts +1 -2
- package/src/SelectableCard/SelectableCard.doc.mjs +2 -0
- package/src/SelectableCard/SelectableCard.test.tsx +46 -4
- package/src/SelectableCard/SelectableCard.tsx +29 -16
- package/src/Selector/Selector.test.tsx +69 -0
- package/src/Selector/Selector.tsx +5 -1
- package/src/Selector/hooks.ts +17 -0
- package/src/SideNav/SideNav.test.tsx +119 -3
- package/src/SideNav/SideNavCollapseButton.tsx +6 -1
- package/src/SideNav/SideNavHeading.tsx +24 -8
- package/src/SideNav/SideNavItem.tsx +5 -1
- package/src/Slider/Slider.test.tsx +75 -2
- package/src/Slider/Slider.tsx +21 -5
- package/src/Switch/Switch.test.tsx +32 -1
- package/src/Table/BaseTable.tsx +3 -5
- package/src/Table/index.ts +5 -0
- package/src/Table/plugins/groupedRows/useTableGroupedRows.tsx +6 -2
- package/src/Table/plugins/rowStatus/index.ts +7 -0
- package/src/Table/plugins/rowStatus/useTableRowStatus.test.tsx +138 -0
- package/src/Table/plugins/rowStatus/useTableRowStatus.tsx +189 -0
- package/src/Table/plugins/selection/useTableSelection.test.tsx +16 -0
- package/src/Table/plugins/selection/useTableSelection.tsx +19 -1
- package/src/Table/plugins/tree/useTableTreeData.test.tsx +135 -3
- package/src/Table/plugins/tree/useTableTreeData.tsx +128 -1
- package/src/Table/plugins/tree/useTableTreeState.test.tsx +104 -0
- package/src/Table/plugins/tree/useTableTreeState.tsx +46 -2
- package/src/Table/useBaseTablePlugins.ts +10 -6
- package/src/Table/useTableRowStatus.doc.mjs +30 -0
- package/src/Table/useTableSelection.doc.mjs +65 -14
- package/src/Table/useTableTreeData.doc.mjs +29 -0
- package/src/Table/useTableTreeState.doc.mjs +2 -2
- package/src/TextArea/TextArea.test.tsx +9 -1
- package/src/Thumbnail/Thumbnail.doc.mjs +19 -10
- package/src/Thumbnail/Thumbnail.test.tsx +98 -7
- package/src/Thumbnail/Thumbnail.tsx +141 -41
- package/src/Thumbnail/thumbnail.markers.stylex.ts +12 -0
- package/src/TimeInput/TimeInput.test.tsx +76 -1
- package/src/TimeInput/TimeInput.tsx +19 -6
- package/src/Timestamp/Timestamp.doc.mjs +4 -4
- package/src/Timestamp/Timestamp.test.tsx +32 -0
- package/src/Timestamp/Timestamp.tsx +28 -8
- package/src/Toast/useToast.tsx +7 -8
- package/src/ToggleButton/ToggleButtonGroup.tsx +1 -1
- package/src/Tokenizer/Tokenizer.doc.mjs +15 -1
- package/src/Tokenizer/Tokenizer.test.tsx +183 -2
- package/src/Tokenizer/Tokenizer.tsx +16 -4
- package/src/TopNav/TopNav.test.tsx +125 -1
- package/src/TopNav/TopNavHeading.tsx +24 -8
- package/src/TopNav/TopNavMegaMenu.test.tsx +149 -1
- package/src/TopNav/TopNavMegaMenu.tsx +10 -4
- package/src/TopNav/TopNavMegaMenuFeaturedCard.doc.mjs +3 -3
- package/src/TopNav/TopNavMegaMenuFeaturedCard.tsx +19 -2
- package/src/TopNav/TopNavMenu.test.tsx +118 -4
- package/src/TopNav/TopNavMenu.tsx +83 -5
- package/src/TreeList/TreeList.doc.mjs +22 -0
- package/src/TreeList/TreeList.test.tsx +232 -0
- package/src/TreeList/TreeList.tsx +18 -2
- package/src/TreeList/TreeListBranches.tsx +16 -2
- package/src/TreeList/TreeListItem.tsx +51 -11
- package/src/TreeList/TreeListTypes.ts +27 -1
- package/src/TreeList/index.ts +2 -2
- package/src/authoring/doc.ts +1 -3
- package/src/docs-types.ts +5 -0
- package/src/hooks/computeOverflow.test.ts +422 -0
- package/src/hooks/computeOverflow.ts +290 -0
- package/src/hooks/index.ts +2 -0
- package/src/hooks/useDevWarning.test.tsx +45 -0
- package/src/hooks/useDevWarning.ts +54 -0
- package/src/hooks/useOverflow.test.ts +96 -4
- package/src/hooks/useOverflow.ts +74 -33
- package/src/i18n/InternationalizationContext.ts +4 -0
- package/src/i18n/InternationalizationProvider.doc.mjs +99 -2
- package/src/i18n/InternationalizationProvider.tsx +12 -2
- package/src/i18n/__tests__/getLocaleDirection.test.ts +40 -0
- package/src/i18n/__tests__/useDirection.test.tsx +66 -0
- package/src/i18n/getLocaleDirection.ts +29 -0
- package/src/i18n/index.ts +6 -0
- package/src/i18n/resolve.ts +9 -21
- package/src/i18n/useDirection.ts +29 -0
- package/src/theme/Theme.tsx +11 -14
- package/src/theme/generateThemeRules.test.ts +65 -0
- package/src/theme/generateThemeRules.ts +56 -0
- package/src/theme/hct.ts +1 -1
- package/src/theme/syntax/defineSyntaxTheme.ts +5 -6
- package/src/utils/devWarning.test.ts +56 -0
- package/src/utils/devWarning.ts +102 -0
- package/src/utils/index.ts +6 -0
- package/src/utils/plainDate.test.ts +22 -0
- package/src/utils/plainDate.ts +61 -0
- package/src/utils/types.ts +14 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Timestamp.d.ts","sourceRoot":"","sources":["../../src/Timestamp/Timestamp.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAC,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"Timestamp.d.ts","sourceRoot":"","sources":["../../src/Timestamp/Timestamp.tsx"],"names":[],"mappings":"AAqBA,OAAO,KAAK,EAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,EAAE,UAAU,EAAC,MAAM,gBAAgB,CAAC;AAG9E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAa5C,MAAM,MAAM,eAAe,GACvB,UAAU,GACV,MAAM,GACN,MAAM,GACN,WAAW,GACX,cAAc,GACd,WAAW,GACX,MAAM,GACN,aAAa,GACb,kBAAkB,GAClB,aAAa,CAAC;AAElB,MAAM,WAAW,cAAe,SAAQ,SAAS,CAAC,eAAe,CAAC;IAChE,kDAAkD;IAClD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC,uFAAuF;IACvF,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB;;;;;;;;;;;;;OAaG;IACH,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;OAEG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,sCAAsC;IACtC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAqPD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,MAAe,EACf,aAAsC,EACtC,UAAiB,EACjB,eAAuB,EACvB,MAAc,EACd,IAAmB,EACnB,IAAI,EACJ,KAAmB,EACnB,MAAM,EACN,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,aAAa,EAAE,MAAM,GACtB,EAAE,cAAc,sCA6GhB;yBA7He,SAAS"}
|
|
@@ -19,9 +19,11 @@ import { useEffect, useRef, useState, lazy, Suspense } from 'react';
|
|
|
19
19
|
import * as stylex from '@stylexjs/stylex';
|
|
20
20
|
import { Text } from "../Text/index.js";
|
|
21
21
|
import { mergeProps, mergeRefs } from "../utils/index.js";
|
|
22
|
+
import { useDevWarning } from "../hooks/useDevWarning.js";
|
|
22
23
|
import { themeProps } from "../utils/themeProps.js";
|
|
23
24
|
import "../theme/tokens.stylex.js";
|
|
24
25
|
import { colorVars } from "../theme/tokens.stylex.js";
|
|
26
|
+
import { SHARED_DATE_FORMAT_OPTIONS } from "../utils/plainDate.js";
|
|
25
27
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
26
28
|
const LazyXDSTooltip = /*#__PURE__*/lazy(async () => import('../Tooltip/Tooltip').then(mod => ({
|
|
27
29
|
default: mod.Tooltip
|
|
@@ -141,11 +143,11 @@ function pad(n) {
|
|
|
141
143
|
function formatTimestamp(date, format, isTimezoneShown) {
|
|
142
144
|
switch (format) {
|
|
143
145
|
case 'date':
|
|
144
|
-
return new Intl.DateTimeFormat(undefined,
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
146
|
+
return new Intl.DateTimeFormat(undefined, SHARED_DATE_FORMAT_OPTIONS.date).format(date);
|
|
147
|
+
case 'date_long':
|
|
148
|
+
return new Intl.DateTimeFormat(undefined, SHARED_DATE_FORMAT_OPTIONS.date_long).format(date);
|
|
149
|
+
case 'date_weekday':
|
|
150
|
+
return new Intl.DateTimeFormat(undefined, SHARED_DATE_FORMAT_OPTIONS.date_weekday).format(date);
|
|
149
151
|
case 'date_time':
|
|
150
152
|
return new Intl.DateTimeFormat(undefined, {
|
|
151
153
|
year: 'numeric',
|
|
@@ -291,10 +293,10 @@ export function Timestamp({
|
|
|
291
293
|
}, interval);
|
|
292
294
|
return () => clearInterval(timer);
|
|
293
295
|
}, [isLive, isValidDate, effectiveFormat, diffSeconds]);
|
|
296
|
+
useDevWarning('Timestamp', `could not parse value ${JSON.stringify(value)} as a date. Rendering nothing.`, !isValidDate);
|
|
294
297
|
|
|
295
298
|
// Placed after all hooks so the hook order stays stable across renders.
|
|
296
299
|
if (!isValidDate) {
|
|
297
|
-
console.warn(`Timestamp: could not parse value ${JSON.stringify(value)} as a date. Rendering nothing.`);
|
|
298
300
|
return null;
|
|
299
301
|
}
|
|
300
302
|
const showTooltip = hasTooltip && effectiveFormat === 'relative';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useToast.d.ts","sourceRoot":"","sources":["../../src/Toast/useToast.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useToast.d.ts","sourceRoot":"","sources":["../../src/Toast/useToast.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAGV,WAAW,EAEZ,MAAM,SAAS,CAAC;AAoIjB;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,QAAQ,IAAI,WAAW,CAetC"}
|
package/dist/Toast/useToast.js
CHANGED
|
@@ -7,11 +7,11 @@ import { createRoot } from 'react-dom/client';
|
|
|
7
7
|
import { dataAttr } from "../naming.js";
|
|
8
8
|
import { ToastContext } from "./ToastContext.js";
|
|
9
9
|
import { ToastViewport } from "./ToastViewport.js";
|
|
10
|
+
import { warnOnce } from "../utils/devWarning.js";
|
|
10
11
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
11
12
|
// Fallback singleton
|
|
12
13
|
let fallbackContext = null;
|
|
13
14
|
let fallbackRoot = null;
|
|
14
|
-
let fallbackWarned = false;
|
|
15
15
|
const ROOT_THEME_ATTRS = ['data-theme', dataAttr('theme')];
|
|
16
16
|
|
|
17
17
|
// The fallback container is a detached tree with no ThemeContext, so this
|
|
@@ -57,10 +57,7 @@ function getFallbackContext() {
|
|
|
57
57
|
if (typeof document === 'undefined') {
|
|
58
58
|
throw new Error('useToast: Cannot create fallback viewport during SSR. ' + 'Wrap your app with <LayerProvider> or <AppShell>.');
|
|
59
59
|
}
|
|
60
|
-
|
|
61
|
-
fallbackWarned = true;
|
|
62
|
-
console.warn('useToast: No LayerProvider found. Using fallback viewport. ' + 'Wrap your app with <LayerProvider> or <AppShell> for full control.');
|
|
63
|
-
}
|
|
60
|
+
warnOnce('toast-fallback-viewport', 'useToast', 'No LayerProvider found. Using fallback viewport. ' + 'Wrap your app with <LayerProvider> or <AppShell> for full control.');
|
|
64
61
|
const container = document.createElement('div');
|
|
65
62
|
container.setAttribute('data-astryx-toast-fallback', '');
|
|
66
63
|
document.body.appendChild(container);
|
|
@@ -26,7 +26,6 @@ interface ToggleButtonGroupContextValue {
|
|
|
26
26
|
/** Group disabled state. */
|
|
27
27
|
isDisabled?: boolean;
|
|
28
28
|
}
|
|
29
|
-
export declare const ToggleButtonGroupContext: import("react").Context<ToggleButtonGroupContextValue | null>;
|
|
30
29
|
/**
|
|
31
30
|
* Hook for ToggleButton to read group context.
|
|
32
31
|
* Returns null when used outside a group.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ToggleButtonGroup.d.ts","sourceRoot":"","sources":["../../src/ToggleButton/ToggleButtonGroup.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAA2C,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAG/E,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,WAAW,CAAC;AAE1C,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AAOnD,UAAU,6BAA6B;IACrC,mCAAmC;IACnC,cAAc,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC5B,6BAA6B;IAC7B,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,4DAA4D;IAC5D,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,4BAA4B;IAC5B,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;
|
|
1
|
+
{"version":3,"file":"ToggleButtonGroup.d.ts","sourceRoot":"","sources":["../../src/ToggleButton/ToggleButtonGroup.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAA2C,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAG/E,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,WAAW,CAAC;AAE1C,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AAOnD,UAAU,6BAA6B;IACrC,mCAAmC;IACnC,cAAc,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;IAC5B,6BAA6B;IAC7B,MAAM,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,4DAA4D;IAC5D,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,4BAA4B;IAC5B,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAMD;;;GAGG;AACH,wBAAgB,oBAAoB,IAAI,6BAA6B,GAAG,IAAI,CAE3E;AAsBD,UAAU,0BAA0B;IAClC,8BAA8B;IAC9B,QAAQ,EAAE,SAAS,CAAC;IAEpB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IAExC;;;;OAIG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAElB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IAEtB,sCAAsC;IACtC,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;GAIG;AACH,MAAM,WAAW,4BAA6B,SAAQ,0BAA0B;IAC9E;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAEhB,0DAA0D;IAC1D,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAErB,qCAAqC;IACrC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC1C;AAED;;;GAGG;AACH,MAAM,WAAW,8BAA+B,SAAQ,0BAA0B;IAChF,+BAA+B;IAC/B,IAAI,EAAE,UAAU,CAAC;IAEjB,iCAAiC;IACjC,KAAK,EAAE,MAAM,EAAE,CAAC;IAEhB,qCAAqC;IACrC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACrC;AAED,8DAA8D;AAC9D,MAAM,MAAM,sBAAsB,GAC9B,4BAA4B,GAC5B,8BAA8B,CAAC;AAMnC;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,iBAAiB,CAC/B,KAAK,EAAE,sBAAsB,GAC5B,SAAS,CAgEX;yBAlEe,iBAAiB"}
|
|
@@ -28,7 +28,7 @@ import { themeProps } from "../utils/themeProps.js";
|
|
|
28
28
|
// Context
|
|
29
29
|
// =============================================================================
|
|
30
30
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
31
|
-
|
|
31
|
+
const ToggleButtonGroupContext = /*#__PURE__*/createContext(null);
|
|
32
32
|
ToggleButtonGroupContext.displayName = 'ToggleButtonGroupContext';
|
|
33
33
|
|
|
34
34
|
/**
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @file Tokenizer.tsx
|
|
3
|
-
* @input Uses React, BaseTypeahead, Field, Token
|
|
3
|
+
* @input Uses React, BaseTypeahead, Field, Token, useAnnounce
|
|
4
4
|
* @output Exports Tokenizer multi-select typeahead component
|
|
5
5
|
* @position Composed component; forwards DOM ref and exposes focus control via
|
|
6
6
|
* handleRef
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Tokenizer.d.ts","sourceRoot":"","sources":["../../src/Tokenizer/Tokenizer.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAE,EAOZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAG9C,OAAO,EAGL,KAAK,WAAW,EAKjB,MAAM,UAAU,CAAC;AAElB,OAAO,EAAiB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"Tokenizer.d.ts","sourceRoot":"","sources":["../../src/Tokenizer/Tokenizer.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAE,EAOZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAG9C,OAAO,EAGL,KAAK,WAAW,EAKjB,MAAM,UAAU,CAAC;AAElB,OAAO,EAAiB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAWtD,OAAO,KAAK,EAAC,cAAc,EAAE,YAAY,EAAC,MAAM,oBAAoB,CAAC;AAMrE,YAAY,EACV,WAAW,IAAI,eAAe,EAC9B,eAAe,IAAI,mBAAmB,GACvC,MAAM,UAAU,CAAC;AAMlB;;GAEG;AACH,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,cAAc,IAChD;IAAC,IAAI,EAAE,CAAC,CAAC;IAAC,IAAI,EAAE,KAAK,CAAA;CAAC,GACtB;IAAC,IAAI,EAAE,CAAC,CAAC;IAAC,IAAI,EAAE,QAAQ,CAAA;CAAC,GACzB;IAAC,IAAI,EAAE,CAAC,CAAC;IAAC,IAAI,EAAE,QAAQ,CAAA;CAAC,GACzB;IAAC,IAAI,EAAE,SAAS,CAAA;CAAC,CAAC;AAEtB,MAAM,MAAM,aAAa,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE/C;;;;;GAKG;AACH,MAAM,MAAM,yBAAyB,GACnC,MAAM,GAAG,iBAAiB,GAAG,gBAAgB,CAAC;AAEhD;;GAEG;AACH,MAAM,WAAW,eAAe;IAC9B,iCAAiC;IACjC,KAAK,IAAI,IAAI,CAAC;IACd,gCAAgC;IAChC,IAAI,IAAI,IAAI,CAAC;CACd;AAED,MAAM,WAAW,cAAc,CAAC,CAAC,SAAS,cAAc,CAAE,SAAQ,IAAI,CACpE,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,CACX;IACC,mCAAmC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,8CAA8C;IAC9C,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,mBAAmB;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,qCAAqC;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,qCAAqC;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,yBAAyB;IACzB,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IACjC;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,qBAAqB;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,qCAAqC;IACrC,YAAY,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC;IAC9B,gCAAgC;IAChC,KAAK,EAAE,CAAC,EAAE,CAAC;IAEX;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iEAAiE;IACjE,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,eAAe,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAC3D,kEAAkE;IAClE,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,KAAK,SAAS,CAAC;IACpC,iFAAiF;IACjF,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,QAAQ,EAAE,MAAM,IAAI,KAAK,SAAS,CAAC;IAC3D,gCAAgC;IAChC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,wDAAwD;IACxD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,0DAA0D;IAC1D,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,sCAAsC;IACtC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,oEAAoE;IACpE,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,oDAAoD;IACpD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;;;;;OASG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,4DAA4D;IAC5D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,0CAA0C;IAC1C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,gCAAgC;IAChC,IAAI,CAAC,EAAE,aAAa,CAAC;IACrB;;;;;;OAMG;IACH,qBAAqB,CAAC,EAAE,yBAAyB,CAAC;IAClD;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,6BAA6B;IAC7B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,0DAA0D;IAC1D,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACxC,sDAAsD;IACtD,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACvC,+CAA+C;IAC/C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,oDAAoD;IACpD,SAAS,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;CACxC;AAwHD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AACH,wBAAgB,SAAS,CAAC,CAAC,SAAS,cAAc,EAAE,EAClD,KAAK,EACL,aAAqB,EACrB,WAAW,EACX,UAAkB,EAClB,UAAkB,EAClB,MAAM,EACN,SAAS,EACT,YAAY,EACZ,YAAY,EACZ,KAAK,EACL,QAAQ,EACR,UAAU,EACV,WAAW,EACX,UAAU,EACV,WAAW,EACX,iBAAiB,EACjB,YAAY,EACZ,sBAAsB,EACtB,UAAkB,EAClB,QAAQ,EACR,eAAe,EACf,QAAgB,EAChB,UAAU,EACV,YAAY,EACZ,IAAI,EAAE,QAAQ,EACd,qBAA8B,EAC9B,UAAU,EACV,SAAiB,EACjB,aAAa,EACb,OAAO,EACP,MAAM,EACN,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,SAAS,GACV,EAAE,cAAc,CAAC,CAAC,CAAC,qBAmfnB;yBA1hBe,SAAS"}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* @file Tokenizer.tsx
|
|
7
|
-
* @input Uses React, BaseTypeahead, Field, Token
|
|
7
|
+
* @input Uses React, BaseTypeahead, Field, Token, useAnnounce
|
|
8
8
|
* @output Exports Tokenizer multi-select typeahead component
|
|
9
9
|
* @position Composed component; forwards DOM ref and exposes focus control via
|
|
10
10
|
* handleRef
|
|
@@ -24,6 +24,7 @@ import { renderIconSlot } from "../Icon/index.js";
|
|
|
24
24
|
import { OverflowList } from "../OverflowList/index.js";
|
|
25
25
|
import { useLayer } from "../Layer/useLayer.js";
|
|
26
26
|
import { useTooltip } from "../Tooltip/index.js";
|
|
27
|
+
import { useAnnounce } from "../hooks/useAnnounce.js";
|
|
27
28
|
import "../theme/tokens.stylex.js";
|
|
28
29
|
import { colorVars, spacingVars, sizeVars, typeScaleVars } from "../theme/tokens.stylex.js";
|
|
29
30
|
import { mergeProps } from "../utils/index.js";
|
|
@@ -385,6 +386,12 @@ export function Tokenizer({
|
|
|
385
386
|
bootstrap: async () => []
|
|
386
387
|
}), []);
|
|
387
388
|
|
|
389
|
+
// Announce token add/remove politely via the persistent live region.
|
|
390
|
+
// Tokens previously appeared and disappeared silently — Backspace on an
|
|
391
|
+
// empty input removes the trailing token, and the per-token remove buttons
|
|
392
|
+
// gave no audible feedback either.
|
|
393
|
+
const announce = useAnnounce();
|
|
394
|
+
|
|
388
395
|
// Handle adding an item — detect creatable synthetic items
|
|
389
396
|
const handleAdd = useCallback(item => {
|
|
390
397
|
if (!item) {
|
|
@@ -410,6 +417,7 @@ export function Tokenizer({
|
|
|
410
417
|
item: realItem,
|
|
411
418
|
type: 'create'
|
|
412
419
|
});
|
|
420
|
+
announce(`Added ${createdValue}`);
|
|
413
421
|
return;
|
|
414
422
|
}
|
|
415
423
|
if (selectedIds.has(item.id)) {
|
|
@@ -420,17 +428,21 @@ export function Tokenizer({
|
|
|
420
428
|
item,
|
|
421
429
|
type: 'add'
|
|
422
430
|
});
|
|
423
|
-
|
|
431
|
+
announce(`Added ${item.label}`);
|
|
432
|
+
}, [value, onChange, isAtMax, selectedIds, hasCreate, announce]);
|
|
424
433
|
|
|
425
|
-
// Handle removing an item
|
|
434
|
+
// Handle removing an item. Single removal path: both Backspace on an empty
|
|
435
|
+
// input and the per-token remove buttons route through here, so the
|
|
436
|
+
// announcement covers both.
|
|
426
437
|
const handleRemove = useCallback(item => {
|
|
427
438
|
const newItems = value.filter(v => v.id !== item.id);
|
|
428
439
|
onChange(newItems, {
|
|
429
440
|
item,
|
|
430
441
|
type: 'remove'
|
|
431
442
|
});
|
|
443
|
+
announce(`Removed ${item.label}`);
|
|
432
444
|
inputRef.current?.focus();
|
|
433
|
-
}, [value, onChange]);
|
|
445
|
+
}, [value, onChange, announce]);
|
|
434
446
|
|
|
435
447
|
// Handle clearing all items
|
|
436
448
|
const handleClearAll = useCallback(() => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TopNavHeading.d.ts","sourceRoot":"","sources":["../../src/TopNav/TopNavHeading.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;GAgBG;AAEH,OAAO,EAAkB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAatD,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAErD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA4K5C,MAAM,WAAW,kBAAmB,SAAQ,SAAS,CAAC,WAAW,CAAC;IAChE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,gBAAgB,CAAC,EAAE,SAAS,CAAC;IAC7B;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;OAIG;IACH,EAAE,CAAC,EAAE,iBAAiB,CAAC;CACxB;AAMD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,aAAa,CAAC,EAC5B,EAAE,EACF,IAAI,EACJ,SAAS,EACT,OAAO,EACP,WAAW,EAAE,eAAe,EAC5B,IAAI,EACJ,YAAY,EACZ,gBAAgB,EAChB,UAAU,EACV,cAAc,EACd,gBAAgB,EAChB,IAAI,EACJ,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,KAAK,EACT,EAAE,kBAAkB,+
|
|
1
|
+
{"version":3,"file":"TopNavHeading.d.ts","sourceRoot":"","sources":["../../src/TopNav/TopNavHeading.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;GAgBG;AAEH,OAAO,EAAkB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAatD,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAErD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA4K5C,MAAM,WAAW,kBAAmB,SAAQ,SAAS,CAAC,WAAW,CAAC;IAChE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,gBAAgB,CAAC,EAAE,SAAS,CAAC;IAC7B;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;OAIG;IACH,EAAE,CAAC,EAAE,iBAAiB,CAAC;CACxB;AAMD;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,wBAAgB,aAAa,CAAC,EAC5B,EAAE,EACF,IAAI,EACJ,SAAS,EACT,OAAO,EACP,WAAW,EAAE,eAAe,EAC5B,IAAI,EACJ,YAAY,EACZ,gBAAgB,EAChB,UAAU,EACV,cAAc,EACd,gBAAgB,EAChB,IAAI,EACJ,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,KAAK,EACT,EAAE,kBAAkB,+BA4WpB;yBA/Xe,aAAa"}
|
|
@@ -135,6 +135,10 @@ export function TopNavHeading({
|
|
|
135
135
|
const rootRef = useRef(null);
|
|
136
136
|
const popover = usePopover({
|
|
137
137
|
dialogLabel: t('@astryx.topNav.heading.dialogLabel'),
|
|
138
|
+
// The popup exposes its own role="menu" semantics; a role="dialog"
|
|
139
|
+
// aria-modal wrapper would announce "dialog, Navigation menu" around a
|
|
140
|
+
// menu (the anti-pattern removed in a478a3dcf).
|
|
141
|
+
role: 'none',
|
|
138
142
|
hasCloseButton: false
|
|
139
143
|
});
|
|
140
144
|
const closeMenuCtx = useMemo(() => ({
|
|
@@ -304,14 +308,17 @@ export function TopNavHeading({
|
|
|
304
308
|
})), headerEndContentElement]
|
|
305
309
|
}), popover.render(/*#__PURE__*/_jsxs("div", {
|
|
306
310
|
ref: menuRef,
|
|
307
|
-
role: "menu",
|
|
308
311
|
...{
|
|
309
312
|
className: "x9epnlk xb3r6kr"
|
|
310
313
|
},
|
|
311
314
|
...contentProps,
|
|
312
|
-
children: [popoverHeadingContent, /*#__PURE__*/_jsx(
|
|
313
|
-
|
|
314
|
-
|
|
315
|
+
children: [popoverHeadingContent, /*#__PURE__*/_jsx("div", {
|
|
316
|
+
role: "menu",
|
|
317
|
+
"aria-label": heading ?? t('@astryx.topNav.heading.dialogLabel'),
|
|
318
|
+
children: /*#__PURE__*/_jsx(NavHeadingCloseContext, {
|
|
319
|
+
value: closeMenuCtx,
|
|
320
|
+
children: menu
|
|
321
|
+
})
|
|
315
322
|
})]
|
|
316
323
|
}), {
|
|
317
324
|
placement: 'below',
|
|
@@ -357,14 +364,17 @@ export function TopNavHeading({
|
|
|
357
364
|
}) : undefined), headerEndContentElement]
|
|
358
365
|
}), popover.render(/*#__PURE__*/_jsxs("div", {
|
|
359
366
|
ref: menuRef,
|
|
360
|
-
role: "menu",
|
|
361
367
|
...{
|
|
362
368
|
className: "x9epnlk xb3r6kr"
|
|
363
369
|
},
|
|
364
370
|
...contentProps,
|
|
365
|
-
children: [popoverHeadingContent, /*#__PURE__*/_jsx(
|
|
366
|
-
|
|
367
|
-
|
|
371
|
+
children: [popoverHeadingContent, /*#__PURE__*/_jsx("div", {
|
|
372
|
+
role: "menu",
|
|
373
|
+
"aria-label": heading ?? t('@astryx.topNav.heading.dialogLabel'),
|
|
374
|
+
children: /*#__PURE__*/_jsx(NavHeadingCloseContext, {
|
|
375
|
+
value: closeMenuCtx,
|
|
376
|
+
children: menu
|
|
377
|
+
})
|
|
368
378
|
})]
|
|
369
379
|
}), {
|
|
370
380
|
placement: 'below',
|
|
@@ -179,7 +179,11 @@ function DefaultMegaMenu({
|
|
|
179
179
|
onOpenChange?.(false);
|
|
180
180
|
}, [onOpenChange]);
|
|
181
181
|
const popover = usePopover({
|
|
182
|
-
|
|
182
|
+
// role: 'none' — the panel exposes its own role="group" labeled by
|
|
183
|
+
// `label`. Focus stays on the trigger while the panel is open, so a
|
|
184
|
+
// role="dialog" aria-modal="true" wrapper would announce an unnamed
|
|
185
|
+
// modal dialog around a grid of links.
|
|
186
|
+
role: 'none',
|
|
183
187
|
// hasSurface: false — mega menu provides its own surface (panelContainer)
|
|
184
188
|
// with border-top and custom overflow. Animation is applied via the
|
|
185
189
|
// render() call's xstyle prop (panelAnimation), not the hook options.
|
|
@@ -252,8 +256,7 @@ function DefaultMegaMenu({
|
|
|
252
256
|
children: [/*#__PURE__*/_jsxs("button", {
|
|
253
257
|
ref: mergeRefs(triggerButtonRef, ref),
|
|
254
258
|
type: "button",
|
|
255
|
-
|
|
256
|
-
"aria-expanded": popover.isOpen,
|
|
259
|
+
...popover.triggerProps,
|
|
257
260
|
onClick: handleClick,
|
|
258
261
|
onMouseEnter: handleMouseEnter,
|
|
259
262
|
onMouseLeave: handleMouseLeave,
|
|
@@ -277,7 +280,10 @@ function DefaultMegaMenu({
|
|
|
277
280
|
children: getIcon('chevronDown')
|
|
278
281
|
})]
|
|
279
282
|
}), popover.render(/*#__PURE__*/_jsx("div", {
|
|
280
|
-
role
|
|
283
|
+
// role="group" — a mega menu is a browsing grid of links, not an
|
|
284
|
+
// ARIA menu of menuitems (per the WAI-ARIA APG, the menu role is
|
|
285
|
+
// for action menus; link mega menus are the documented anti-case).
|
|
286
|
+
role: "group",
|
|
281
287
|
"aria-label": label,
|
|
282
288
|
onMouseEnter: handleMouseEnter,
|
|
283
289
|
onMouseLeave: handleMouseLeave,
|
|
@@ -23,7 +23,15 @@ export interface TopNavMegaMenuFeaturedCardProps extends BaseProps<HTMLDivElemen
|
|
|
23
23
|
description?: string;
|
|
24
24
|
/** Optional image URL displayed above the body. */
|
|
25
25
|
image?: string;
|
|
26
|
-
/**
|
|
26
|
+
/**
|
|
27
|
+
* Alt text for the image.
|
|
28
|
+
*
|
|
29
|
+
* When omitted, the image is explicitly decorative (`alt=""` +
|
|
30
|
+
* `role="presentation"` + `aria-hidden`, matching Avatar) and hidden from
|
|
31
|
+
* assistive technology. Since the card already has a visible `title`, a
|
|
32
|
+
* decorative image is usually correct; pass `imageAlt` only when the image
|
|
33
|
+
* conveys information beyond the title and description.
|
|
34
|
+
*/
|
|
27
35
|
imageAlt?: string;
|
|
28
36
|
/** CTA link text. */
|
|
29
37
|
linkLabel?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TopNavMegaMenuFeaturedCard.d.ts","sourceRoot":"","sources":["../../src/TopNav/TopNavMegaMenuFeaturedCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAS5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAiD5C,MAAM,WAAW,+BAAgC,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChF,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,kBAAkB;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,wCAAwC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mDAAmD;IACnD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf
|
|
1
|
+
{"version":3,"file":"TopNavMegaMenuFeaturedCard.d.ts","sourceRoot":"","sources":["../../src/TopNav/TopNavMegaMenuFeaturedCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAS5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAiD5C,MAAM,WAAW,+BAAgC,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChF,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,kBAAkB;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,wCAAwC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,mDAAmD;IACnD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;OAQG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qBAAqB;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oBAAoB;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,uDAAuD;IACvD,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAMD;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,0BAA0B,CAAC,EACzC,GAAG,EACH,KAAK,EACL,WAAW,EACX,KAAK,EACL,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,+BAA+B,qBAsCjC;yBAnDe,0BAA0B"}
|
|
@@ -89,9 +89,16 @@ export function TopNavMegaMenuFeaturedCard({
|
|
|
89
89
|
ref: ref,
|
|
90
90
|
...mergeProps(themeProps('top-nav-mega-menu-featured-card'), stylex.props(styles.root, xstyle), className, style),
|
|
91
91
|
...rest,
|
|
92
|
-
children: [image &&
|
|
92
|
+
children: [image &&
|
|
93
|
+
/*#__PURE__*/
|
|
94
|
+
// Without `imageAlt`, the image is explicitly decorative rather than
|
|
95
|
+
// silently empty-alt, matching Avatar's handling of unnamed images.
|
|
96
|
+
// Usually correct here: the card already has a visible title.
|
|
97
|
+
_jsx("img", {
|
|
93
98
|
src: image,
|
|
94
99
|
alt: imageAlt ?? '',
|
|
100
|
+
role: imageAlt ? undefined : 'presentation',
|
|
101
|
+
"aria-hidden": imageAlt ? undefined : true,
|
|
95
102
|
...{
|
|
96
103
|
className: "xh8yej3 xhjk10j xl1xv1r x1lliihq"
|
|
97
104
|
}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @file TopNavMenu.tsx
|
|
3
|
-
* @input Uses React, StyleX,
|
|
3
|
+
* @input Uses React, StyleX, usePopover, useMenuHover, useListFocus,
|
|
4
|
+
* useTypeahead, TopNavItem tokens
|
|
4
5
|
* @output Exports TopNavMenu component and related types
|
|
5
6
|
* @position Navigation item with hover-triggered overflow menu for TopNav
|
|
6
7
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TopNavMenu.d.ts","sourceRoot":"","sources":["../../src/TopNav/TopNavMenu.tsx"],"names":[],"mappings":"AAIA
|
|
1
|
+
{"version":3,"file":"TopNavMenu.d.ts","sourceRoot":"","sources":["../../src/TopNav/TopNavMenu.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAE,EAKZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAQf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAmM5C;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAMD,MAAM,WAAW,eAAgB,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IACnE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,KAAK,EAAE,kBAAkB,EAAE,CAAC;IAE5B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AAEH,wBAAgB,UAAU,CAAC,EACzB,GAAG,EACH,KAAK,EACL,KAAK,EACL,KAAW,EACX,SAAe,GAChB,EAAE,eAAe,4BA+NjB;yBArOe,UAAU"}
|
|
@@ -4,7 +4,8 @@
|
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* @file TopNavMenu.tsx
|
|
7
|
-
* @input Uses React, StyleX,
|
|
7
|
+
* @input Uses React, StyleX, usePopover, useMenuHover, useListFocus,
|
|
8
|
+
* useTypeahead, TopNavItem tokens
|
|
8
9
|
* @output Exports TopNavMenu component and related types
|
|
9
10
|
* @position Navigation item with hover-triggered overflow menu for TopNav
|
|
10
11
|
*
|
|
@@ -14,10 +15,12 @@
|
|
|
14
15
|
* - /packages/core/src/TopNav/index.ts
|
|
15
16
|
* - /packages/cli/templates/blocks/components/TopNav/ (showcase blocks)
|
|
16
17
|
*/
|
|
17
|
-
import React, { useId, useRef, useState } from 'react';
|
|
18
|
+
import React, { useCallback, useId, useRef, useState } from 'react';
|
|
18
19
|
import * as stylex from '@stylexjs/stylex';
|
|
19
20
|
import { usePopover } from "../Popover/usePopover.js";
|
|
20
21
|
import { useMenuHover } from "../hooks/useMenuHover.js";
|
|
22
|
+
import { useListFocus } from "../hooks/useListFocus.js";
|
|
23
|
+
import { useTypeahead } from "../hooks/useTypeahead.js";
|
|
21
24
|
import { getIcon } from "../Icon/globalIconRegistry.js";
|
|
22
25
|
import { mergeProps, mergeRefs } from "../utils/index.js";
|
|
23
26
|
import { navItemStyles } from "../NavItem/navItemStyles.stylex.js";
|
|
@@ -119,7 +122,10 @@ export function TopNavMenu({
|
|
|
119
122
|
const slot = useTopNavSlot();
|
|
120
123
|
const triggerButtonRef = useRef(null);
|
|
121
124
|
const popover = usePopover({
|
|
122
|
-
|
|
125
|
+
// The popup's own role="menu" is the exposed semantics; a modal dialog
|
|
126
|
+
// wrapper would announce an unnamed dialog around the menu and make the
|
|
127
|
+
// trigger claim aria-haspopup="dialog" for menu content (see TabMenu).
|
|
128
|
+
role: 'none',
|
|
123
129
|
xstyle: styles.menuOffset
|
|
124
130
|
});
|
|
125
131
|
const {
|
|
@@ -137,6 +143,54 @@ export function TopNavMenu({
|
|
|
137
143
|
});
|
|
138
144
|
const setTriggerRef = mergeRefs(triggerButtonRef, popover.triggerRef, setTriggerEl, ref);
|
|
139
145
|
|
|
146
|
+
// The desktop popup is a composite menu widget per the APG menu pattern:
|
|
147
|
+
// a single roving tab stop with ArrowUp/ArrowDown traversal (wrapping),
|
|
148
|
+
// Home/End, and first-character typeahead. The hook owns item tabindex —
|
|
149
|
+
// items render tabIndex={-1} and exactly one is promoted to 0. The
|
|
150
|
+
// composition mirrors NavHeadingMenu.
|
|
151
|
+
const {
|
|
152
|
+
listRef,
|
|
153
|
+
handleKeyDown,
|
|
154
|
+
handleFocus,
|
|
155
|
+
focusItem
|
|
156
|
+
} = useListFocus({
|
|
157
|
+
itemSelector: '[role="menuitem"]',
|
|
158
|
+
hasRovingTabIndex: true,
|
|
159
|
+
onEscape: popover.hide
|
|
160
|
+
});
|
|
161
|
+
|
|
162
|
+
// First-character typeahead over the menu items (menus-11).
|
|
163
|
+
const getMenuItems = useCallback(() => listRef.current ? Array.from(listRef.current.querySelectorAll('[role="menuitem"]')) : [], [listRef]);
|
|
164
|
+
const typeahead = useTypeahead({
|
|
165
|
+
getItemLabels: () => getMenuItems().map(el => el.textContent),
|
|
166
|
+
onMatch: focusItem,
|
|
167
|
+
getCurrentIndex: () => getMenuItems().findIndex(el => el === document.activeElement || el.contains(document.activeElement))
|
|
168
|
+
});
|
|
169
|
+
|
|
170
|
+
// Extend useListFocus with Enter/Space activation. Items rendered without an
|
|
171
|
+
// `href` are `<div role="menuitem">` elements, which have no native keyboard
|
|
172
|
+
// activation — without this, Enter/Space on a focused onClick-only item does
|
|
173
|
+
// nothing. Anchor items (with `href`) already activate on Enter natively.
|
|
174
|
+
const menuKeyDown = useCallback(e => {
|
|
175
|
+
if (e.key === 'Enter' || e.key === ' ') {
|
|
176
|
+
const focused = document.activeElement;
|
|
177
|
+
if (focused?.getAttribute('role') === 'menuitem') {
|
|
178
|
+
e.preventDefault();
|
|
179
|
+
focused.click();
|
|
180
|
+
return;
|
|
181
|
+
}
|
|
182
|
+
}
|
|
183
|
+
if (typeahead.onKeyDown(e)) {
|
|
184
|
+
e.preventDefault();
|
|
185
|
+
return;
|
|
186
|
+
}
|
|
187
|
+
handleKeyDown(e);
|
|
188
|
+
}, [handleKeyDown, typeahead]);
|
|
189
|
+
|
|
190
|
+
// Menu container carries both the hover hook's ref (for its open/close
|
|
191
|
+
// focus management) and the list-focus ref (for roving tabindex/typeahead).
|
|
192
|
+
const setMenuRef = mergeRefs(menuRef, listRef);
|
|
193
|
+
|
|
140
194
|
// Mobile bar: hide menus entirely
|
|
141
195
|
if (renderMode === 'mobile-bar') {
|
|
142
196
|
return null;
|
|
@@ -235,18 +289,26 @@ export function TopNavMenu({
|
|
|
235
289
|
children: getIcon('chevronDown')
|
|
236
290
|
})]
|
|
237
291
|
}), popover.render(/*#__PURE__*/_jsx("div", {
|
|
238
|
-
ref:
|
|
292
|
+
ref: setMenuRef,
|
|
239
293
|
role: "menu",
|
|
240
294
|
"aria-label": label,
|
|
241
295
|
...contentProps,
|
|
296
|
+
// After the contentProps spread so the full APG composition (roving
|
|
297
|
+
// tabindex + typeahead + Enter/Space activation) replaces the hover
|
|
298
|
+
// hook's basic arrow-key handler.
|
|
299
|
+
onKeyDown: menuKeyDown,
|
|
300
|
+
onFocus: handleFocus,
|
|
242
301
|
...{
|
|
243
302
|
className: "x78zum5 xdt5ytf xzye2dw x1u2d2a2 x9epnlk"
|
|
244
303
|
},
|
|
245
304
|
children: items.map(item => {
|
|
246
305
|
const Element = item.href ? 'a' : 'div';
|
|
247
306
|
return /*#__PURE__*/_jsxs(Element, {
|
|
248
|
-
role: "menuitem"
|
|
249
|
-
|
|
307
|
+
role: "menuitem"
|
|
308
|
+
// Single tab stop: useListFocus owns the roving tabindex and
|
|
309
|
+
// promotes exactly one item to 0.
|
|
310
|
+
,
|
|
311
|
+
tabIndex: -1,
|
|
250
312
|
href: item.href,
|
|
251
313
|
onClick: item.onClick,
|
|
252
314
|
...{
|
|
@@ -12,8 +12,8 @@
|
|
|
12
12
|
*/
|
|
13
13
|
import { type ReactNode } from 'react';
|
|
14
14
|
import type { BaseProps } from '../BaseProps';
|
|
15
|
-
import type { TreeListItemData, TreeListDensity } from './TreeListTypes';
|
|
16
|
-
export { type TreeListDensity } from './TreeListTypes';
|
|
15
|
+
import type { TreeListItemData, TreeListDensity, TreeListVariant } from './TreeListTypes';
|
|
16
|
+
export { type TreeListDensity, type TreeListVariant } from './TreeListTypes';
|
|
17
17
|
export interface TreeListProps extends BaseProps<HTMLDivElement> {
|
|
18
18
|
/** Ref forwarded to the root element */
|
|
19
19
|
ref?: React.Ref<HTMLDivElement>;
|
|
@@ -30,6 +30,15 @@ export interface TreeListProps extends BaseProps<HTMLDivElement> {
|
|
|
30
30
|
* @default 'balanced'
|
|
31
31
|
*/
|
|
32
32
|
density?: TreeListDensity;
|
|
33
|
+
/**
|
|
34
|
+
* Visual treatment of the hierarchy guide (connector) lines.
|
|
35
|
+
* - `lineGuides`: connector lines between parent and child rows
|
|
36
|
+
* - `noGuides`: no connector lines; indentation alone conveys nesting
|
|
37
|
+
*
|
|
38
|
+
* Orthogonal to `density` (which controls spacing) — the two compose.
|
|
39
|
+
* @default 'lineGuides'
|
|
40
|
+
*/
|
|
41
|
+
variant?: TreeListVariant;
|
|
33
42
|
/**
|
|
34
43
|
* Header content rendered above the tree list.
|
|
35
44
|
* Semantically associated via aria-labelledby.
|
|
@@ -62,7 +71,7 @@ export interface TreeListProps extends BaseProps<HTMLDivElement> {
|
|
|
62
71
|
* />
|
|
63
72
|
* ```
|
|
64
73
|
*/
|
|
65
|
-
export declare function TreeList({ items, density, header, xstyle, className, style, 'data-testid': testId, ref, }: TreeListProps): import("react").JSX.Element;
|
|
74
|
+
export declare function TreeList({ items, density, variant, header, xstyle, className, style, 'data-testid': testId, ref, }: TreeListProps): import("react").JSX.Element;
|
|
66
75
|
export declare namespace TreeList {
|
|
67
76
|
var displayName: string;
|
|
68
77
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TreeList.d.ts","sourceRoot":"","sources":["../../src/TreeList/TreeList.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAEH,OAAO,EAAwC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAI5E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAE5C,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"TreeList.d.ts","sourceRoot":"","sources":["../../src/TreeList/TreeList.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAEH,OAAO,EAAwC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAI5E,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAE5C,OAAO,KAAK,EACV,gBAAgB,EAChB,eAAe,EACf,eAAe,EAChB,MAAM,iBAAiB,CAAC;AAQzB,OAAO,EAAC,KAAK,eAAe,EAAE,KAAK,eAAe,EAAC,MAAM,iBAAiB,CAAC;AAE3E,MAAM,WAAW,aAAc,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC;;;OAGG;IACH,KAAK,EAAE,gBAAgB,EAAE,CAAC;IAE1B;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC;IAE1B;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC;IAE1B;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAuED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,OAAoB,EACpB,OAAsB,EACtB,MAAM,EACN,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,GACJ,EAAE,aAAa,+BAqJf;yBA/Je,QAAQ"}
|
|
@@ -114,6 +114,7 @@ function findInitialTabbableId(items) {
|
|
|
114
114
|
export function TreeList({
|
|
115
115
|
items,
|
|
116
116
|
density = 'balanced',
|
|
117
|
+
variant = 'lineGuides',
|
|
117
118
|
header,
|
|
118
119
|
xstyle,
|
|
119
120
|
className,
|
|
@@ -199,6 +200,7 @@ export function TreeList({
|
|
|
199
200
|
isExpanded: isExpanded,
|
|
200
201
|
onToggle: handleToggle,
|
|
201
202
|
density: density,
|
|
203
|
+
variant: variant,
|
|
202
204
|
renderedChildren: renderedChildren,
|
|
203
205
|
posInSet: index + 1,
|
|
204
206
|
setSize: items.length,
|
|
@@ -6,6 +6,11 @@ interface TreeListBranchesProps {
|
|
|
6
6
|
/**
|
|
7
7
|
* Renders vertical lines showing parent-child relationships in the tree.
|
|
8
8
|
* Positioned in a full-height container to span the entire item including children.
|
|
9
|
+
*
|
|
10
|
+
* The line element carries the stable `astryx-tree-list-guide` theme target so a
|
|
11
|
+
* theme can recolor or hide the connectors via `defineTheme` (e.g.
|
|
12
|
+
* `backgroundColor` or `display: 'none'`) instead of hiding the built-in guides
|
|
13
|
+
* and reimplementing them.
|
|
9
14
|
*/
|
|
10
15
|
export declare function TreeListBranches({ ancestorsIsLast, isLast: _isLast, nestedLevel, }: TreeListBranchesProps): import("react").JSX.Element;
|
|
11
16
|
export declare namespace TreeListBranches {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TreeListBranches.d.ts","sourceRoot":"","sources":["../../src/TreeList/TreeListBranches.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"TreeListBranches.d.ts","sourceRoot":"","sources":["../../src/TreeList/TreeListBranches.tsx"],"names":[],"mappings":"AAuDA,UAAU,qBAAqB;IAC7B,eAAe,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IACxC,MAAM,EAAE,OAAO,CAAC;IAChB,WAAW,EAAE,MAAM,CAAC;CACrB;AAMD;;;;;;;;GAQG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,eAAe,EACf,MAAM,EAAE,OAAO,EACf,WAAW,GACZ,EAAE,qBAAqB,+BA8CvB;yBAlDe,gBAAgB"}
|
|
@@ -16,6 +16,7 @@ import * as stylex from '@stylexjs/stylex';
|
|
|
16
16
|
import "../theme/tokens.stylex.js";
|
|
17
17
|
import { colorVars, spacingVars } from "../theme/tokens.stylex.js";
|
|
18
18
|
import { mergeProps } from "../utils/index.js";
|
|
19
|
+
import { themeProps } from "../utils/themeProps.js";
|
|
19
20
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
20
21
|
const LINE_WIDTH = 1;
|
|
21
22
|
|
|
@@ -38,6 +39,11 @@ const LEVEL_INDENT = spacingVars['--spacing-4'];
|
|
|
38
39
|
/**
|
|
39
40
|
* Renders vertical lines showing parent-child relationships in the tree.
|
|
40
41
|
* Positioned in a full-height container to span the entire item including children.
|
|
42
|
+
*
|
|
43
|
+
* The line element carries the stable `astryx-tree-list-guide` theme target so a
|
|
44
|
+
* theme can recolor or hide the connectors via `defineTheme` (e.g.
|
|
45
|
+
* `backgroundColor` or `display: 'none'`) instead of hiding the built-in guides
|
|
46
|
+
* and reimplementing them.
|
|
41
47
|
*/
|
|
42
48
|
export function TreeListBranches({
|
|
43
49
|
ancestorsIsLast,
|
|
@@ -60,9 +66,9 @@ export function TreeListBranches({
|
|
|
60
66
|
}
|
|
61
67
|
}),
|
|
62
68
|
children: /*#__PURE__*/_jsx("div", {
|
|
63
|
-
...{
|
|
69
|
+
...mergeProps(themeProps('tree-list-guide'), {
|
|
64
70
|
className: "x1nj7uno xu96u03 x1bpp3o7 x10l6tqk x3m8u43 x1i1rx1s x7njt3n xs02d24"
|
|
65
|
-
}
|
|
71
|
+
})
|
|
66
72
|
})
|
|
67
73
|
}, level)
|
|
68
74
|
);
|
|
@@ -75,9 +81,9 @@ export function TreeListBranches({
|
|
|
75
81
|
}
|
|
76
82
|
}),
|
|
77
83
|
children: /*#__PURE__*/_jsx("div", {
|
|
78
|
-
...{
|
|
84
|
+
...mergeProps(themeProps('tree-list-guide'), {
|
|
79
85
|
className: "x1nj7uno xu96u03 x1bpp3o7 x10l6tqk x3m8u43 x1i1rx1s x7njt3n xs02d24"
|
|
80
|
-
}
|
|
86
|
+
})
|
|
81
87
|
})
|
|
82
88
|
})]
|
|
83
89
|
});
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
* - /packages/cli/templates/blocks/components/TreeList/ (showcase blocks)
|
|
11
11
|
*/
|
|
12
12
|
import { type ReactNode } from 'react';
|
|
13
|
-
import type { TreeListDensity } from './TreeListTypes';
|
|
13
|
+
import type { TreeListDensity, TreeListVariant } from './TreeListTypes';
|
|
14
14
|
export interface TreeListItemInternalProps {
|
|
15
15
|
id: string;
|
|
16
16
|
label: React.ReactNode;
|
|
@@ -29,6 +29,12 @@ export interface TreeListItemInternalProps {
|
|
|
29
29
|
isExpanded: boolean;
|
|
30
30
|
onToggle?: (id: string) => void;
|
|
31
31
|
density: TreeListDensity;
|
|
32
|
+
/**
|
|
33
|
+
* Guide-line visual treatment. `noGuides` suppresses the connector lines;
|
|
34
|
+
* indentation is unaffected (it lives on the row's `marginLeft`, not the
|
|
35
|
+
* guide element).
|
|
36
|
+
*/
|
|
37
|
+
variant: TreeListVariant;
|
|
32
38
|
/** Pre-rendered children subtree (rendered by the parent recursion) */
|
|
33
39
|
renderedChildren?: ReactNode;
|
|
34
40
|
/** 1-based position of this item among its siblings (aria-posinset). */
|
|
@@ -42,7 +48,7 @@ export interface TreeListItemInternalProps {
|
|
|
42
48
|
*/
|
|
43
49
|
isTabbable: boolean;
|
|
44
50
|
}
|
|
45
|
-
export declare function TreeListItem({ id, label, description, startContent, endContent, onClick, href, target, isDisabled, isSelected, hasChildren, nestedLevel, isLast, ancestorsIsLast, isExpanded, onToggle, density, renderedChildren, posInSet, setSize, isTabbable, }: TreeListItemInternalProps): import("react").JSX.Element;
|
|
51
|
+
export declare function TreeListItem({ id, label, description, startContent, endContent, onClick, href, target, isDisabled, isSelected, hasChildren, nestedLevel, isLast, ancestorsIsLast, isExpanded, onToggle, density, variant, renderedChildren, posInSet, setSize, isTabbable, }: TreeListItemInternalProps): import("react").JSX.Element;
|
|
46
52
|
export declare namespace TreeListItem {
|
|
47
53
|
var displayName: string;
|
|
48
54
|
}
|