@astryxdesign/core 0.3.0 → 0.4.0
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 +156 -0
- package/dist/AlertDialog/AlertDialog.d.ts +10 -2
- package/dist/AlertDialog/AlertDialog.d.ts.map +1 -1
- package/dist/AlertDialog/AlertDialog.js +22 -3
- package/dist/AppShell/AppShell.d.ts +2 -2
- package/dist/AppShell/AppShell.d.ts.map +1 -1
- package/dist/AppShell/AppShell.js +40 -9
- package/dist/AspectRatio/AspectRatio.d.ts +13 -0
- package/dist/AspectRatio/AspectRatio.d.ts.map +1 -1
- package/dist/AspectRatio/AspectRatio.js +9 -0
- package/dist/Avatar/Avatar.d.ts.map +1 -1
- package/dist/Avatar/Avatar.js +33 -20
- package/dist/AvatarGroup/AvatarGroupOverflow.d.ts.map +1 -1
- package/dist/AvatarGroup/AvatarGroupOverflow.js +2 -3
- package/dist/Banner/Banner.d.ts.map +1 -1
- package/dist/Banner/Banner.js +15 -14
- package/dist/Breadcrumbs/BreadcrumbItem.d.ts.map +1 -1
- package/dist/Breadcrumbs/BreadcrumbItem.js +21 -8
- package/dist/Breadcrumbs/index.d.ts +2 -1
- package/dist/Breadcrumbs/index.d.ts.map +1 -1
- package/dist/Breadcrumbs/index.js +1 -0
- package/dist/Button/Button.d.ts.map +1 -1
- package/dist/Button/Button.js +11 -15
- package/dist/Calendar/Calendar.d.ts.map +1 -1
- package/dist/Calendar/Calendar.js +2 -1
- package/dist/Calendar/styles.d.ts +0 -2
- package/dist/Calendar/styles.d.ts.map +1 -1
- package/dist/Calendar/styles.js +0 -2
- package/dist/Carousel/Carousel.d.ts.map +1 -1
- package/dist/Carousel/Carousel.js +8 -12
- package/dist/Chat/ChatDictationButton.d.ts.map +1 -1
- package/dist/Chat/ChatDictationButton.js +2 -1
- package/dist/Chat/ChatLayoutScrollButton.d.ts.map +1 -1
- package/dist/Chat/ChatLayoutScrollButton.js +3 -1
- package/dist/Chat/ChatSendButton.d.ts.map +1 -1
- package/dist/Chat/ChatSendButton.js +4 -3
- package/dist/Chat/ChatToolCalls.d.ts.map +1 -1
- package/dist/Chat/ChatToolCalls.js +17 -17
- package/dist/Chat/useTriggerMenu.d.ts.map +1 -1
- package/dist/Chat/useTriggerMenu.js +2 -6
- package/dist/CheckboxInput/CheckboxInput.d.ts.map +1 -1
- package/dist/CheckboxInput/CheckboxInput.js +36 -125
- package/dist/ClickableCard/ClickableCard.d.ts.map +1 -1
- package/dist/ClickableCard/ClickableCard.js +3 -11
- package/dist/CodeBlock/CodeBlock.d.ts.map +1 -1
- package/dist/CodeBlock/CodeBlock.js +84 -67
- package/dist/Collapsible/Collapsible.d.ts.map +1 -1
- package/dist/Collapsible/Collapsible.js +35 -15
- package/dist/CommandPalette/CommandPaletteItem.d.ts +1 -1
- package/dist/CommandPalette/CommandPaletteItem.d.ts.map +1 -1
- package/dist/CommandPalette/CommandPaletteItem.js +6 -3
- package/dist/CommandPalette/CommandPaletteList.js +1 -1
- package/dist/ComplexSelector/ComplexSelector.d.ts +1 -1
- package/dist/ComplexSelector/ComplexSelector.d.ts.map +1 -1
- package/dist/ComplexSelector/ComplexSelector.js +35 -33
- package/dist/ContextMenu/ContextMenu.d.ts +2 -2
- package/dist/ContextMenu/ContextMenu.d.ts.map +1 -1
- package/dist/ContextMenu/ContextMenu.js +1 -1
- package/dist/ContextMenu/index.d.ts +2 -1
- package/dist/ContextMenu/index.d.ts.map +1 -1
- package/dist/ContextMenu/index.js +1 -0
- package/dist/DateInput/DateInput.d.ts +9 -2
- package/dist/DateInput/DateInput.d.ts.map +1 -1
- package/dist/DateInput/DateInput.js +24 -23
- package/dist/DateRangeInput/DateRangeInput.d.ts +9 -2
- package/dist/DateRangeInput/DateRangeInput.d.ts.map +1 -1
- package/dist/DateRangeInput/DateRangeInput.js +11 -16
- package/dist/DateTimeInput/DateTimeInput.d.ts +9 -1
- package/dist/DateTimeInput/DateTimeInput.d.ts.map +1 -1
- package/dist/DateTimeInput/DateTimeInput.js +22 -17
- package/dist/Dialog/Dialog.d.ts.map +1 -1
- package/dist/Dialog/Dialog.js +4 -4
- package/dist/DropdownMenu/DropdownMenu.d.ts +33 -8
- package/dist/DropdownMenu/DropdownMenu.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenu.js +62 -20
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.d.ts +8 -11
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.js +32 -31
- package/dist/DropdownMenu/DropdownMenuDivider.d.ts +25 -0
- package/dist/DropdownMenu/DropdownMenuDivider.d.ts.map +1 -0
- package/dist/DropdownMenu/DropdownMenuDivider.js +66 -0
- package/dist/DropdownMenu/DropdownMenuItem.d.ts +15 -2
- package/dist/DropdownMenu/DropdownMenuItem.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuItem.js +20 -8
- package/dist/DropdownMenu/DropdownMenuRadioItem.d.ts +5 -5
- package/dist/DropdownMenu/DropdownMenuRadioItem.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuRadioItem.js +24 -67
- package/dist/DropdownMenu/DropdownMenuSubMenu.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuSubMenu.js +2 -8
- package/dist/DropdownMenu/index.d.ts +2 -1
- package/dist/DropdownMenu/index.d.ts.map +1 -1
- package/dist/DropdownMenu/index.js +4 -0
- package/dist/DropdownMenu/renderDropdownItems.d.ts.map +1 -1
- package/dist/DropdownMenu/renderDropdownItems.js +35 -27
- package/dist/EmptyState/EmptyState.d.ts.map +1 -1
- package/dist/EmptyState/EmptyState.js +9 -5
- package/dist/Field/InputClearButton.d.ts +16 -3
- package/dist/Field/InputClearButton.d.ts.map +1 -1
- package/dist/Field/InputClearButton.js +15 -4
- package/dist/HoverCard/useHoverCard.d.ts.map +1 -1
- package/dist/HoverCard/useHoverCard.js +3 -19
- package/dist/Indicator/CheckIndicator.d.ts +25 -0
- package/dist/Indicator/CheckIndicator.d.ts.map +1 -0
- package/dist/Indicator/CheckIndicator.js +155 -0
- package/dist/Indicator/CheckboxIndicator.d.ts +22 -0
- package/dist/Indicator/CheckboxIndicator.d.ts.map +1 -0
- package/dist/Indicator/CheckboxIndicator.js +173 -0
- package/dist/Indicator/RadioIndicator.d.ts +23 -0
- package/dist/Indicator/RadioIndicator.d.ts.map +1 -0
- package/dist/Indicator/RadioIndicator.js +137 -0
- package/dist/Indicator/index.d.ts +24 -0
- package/dist/Indicator/index.d.ts.map +1 -0
- package/dist/Indicator/index.js +26 -0
- package/dist/Indicator/indicator.markers.stylex.d.ts +16 -0
- package/dist/Indicator/indicator.markers.stylex.d.ts.map +1 -0
- package/dist/Indicator/indicator.markers.stylex.js +21 -0
- package/dist/Indicator/indicatorRegistry.d.ts +71 -0
- package/dist/Indicator/indicatorRegistry.d.ts.map +1 -0
- package/dist/Indicator/indicatorRegistry.js +93 -0
- package/dist/Indicator/types.d.ts +167 -0
- package/dist/Indicator/types.d.ts.map +1 -0
- package/dist/Indicator/types.js +1 -0
- package/dist/Indicator/useIndicator.d.ts +18 -0
- package/dist/Indicator/useIndicator.d.ts.map +1 -0
- package/dist/Indicator/useIndicator.js +30 -0
- package/dist/Item/Item.d.ts.map +1 -1
- package/dist/Item/Item.js +4 -8
- package/dist/Layer/useLayer.d.ts +14 -0
- package/dist/Layer/useLayer.d.ts.map +1 -1
- package/dist/Layer/useLayer.js +25 -2
- package/dist/Lightbox/Lightbox.d.ts.map +1 -1
- package/dist/Lightbox/Lightbox.js +56 -53
- package/dist/Link/Link.d.ts.map +1 -1
- package/dist/Link/Link.js +4 -5
- package/dist/MobileNav/MobileNav.js +8 -8
- package/dist/MoreMenu/MoreMenu.d.ts +14 -1
- package/dist/MoreMenu/MoreMenu.d.ts.map +1 -1
- package/dist/MoreMenu/MoreMenu.js +4 -0
- package/dist/MultiSelector/MultiSelector.d.ts.map +1 -1
- package/dist/MultiSelector/MultiSelector.js +78 -75
- package/dist/NumberInput/NumberInput.d.ts +27 -1
- package/dist/NumberInput/NumberInput.d.ts.map +1 -1
- package/dist/NumberInput/NumberInput.js +230 -42
- package/dist/Outline/Outline.d.ts.map +1 -1
- package/dist/Outline/Outline.js +2 -3
- package/dist/Pagination/Pagination.d.ts.map +1 -1
- package/dist/Pagination/Pagination.js +61 -63
- package/dist/Popover/Popover.d.ts.map +1 -1
- package/dist/Popover/Popover.js +6 -8
- package/dist/PowerSearch/PowerSearch.d.ts.map +1 -1
- package/dist/PowerSearch/PowerSearch.js +1 -1
- package/dist/PowerSearch/PowerSearchEditPopover.d.ts.map +1 -1
- package/dist/PowerSearch/PowerSearchEditPopover.js +7 -0
- package/dist/ProgressBar/ProgressBar.d.ts +11 -4
- package/dist/ProgressBar/ProgressBar.d.ts.map +1 -1
- package/dist/ProgressBar/ProgressBar.js +96 -6
- package/dist/RadioList/RadioListItem.d.ts.map +1 -1
- package/dist/RadioList/RadioListItem.js +29 -84
- package/dist/Resizable/ResizeHandle.d.ts.map +1 -1
- package/dist/Resizable/ResizeHandle.js +2 -3
- package/dist/SegmentedControl/SegmentedControlItem.d.ts.map +1 -1
- package/dist/SegmentedControl/SegmentedControlItem.js +2 -3
- package/dist/SelectableCard/SelectableCard.d.ts.map +1 -1
- package/dist/SelectableCard/SelectableCard.js +3 -11
- package/dist/Selector/Selector.d.ts +2 -1
- package/dist/Selector/Selector.d.ts.map +1 -1
- package/dist/Selector/Selector.js +164 -94
- package/dist/Selector/hooks.d.ts +18 -6
- package/dist/Selector/hooks.d.ts.map +1 -1
- package/dist/Selector/hooks.js +57 -40
- package/dist/SideNav/SideNav.d.ts.map +1 -1
- package/dist/SideNav/SideNav.js +1 -1
- package/dist/SideNav/SideNavCollapseButton.d.ts +1 -1
- package/dist/SideNav/SideNavCollapseButton.d.ts.map +1 -1
- package/dist/SideNav/SideNavCollapseButton.js +29 -14
- package/dist/SideNav/SideNavHeading.d.ts.map +1 -1
- package/dist/SideNav/SideNavHeading.js +56 -20
- package/dist/SideNav/SideNavItem.d.ts.map +1 -1
- package/dist/SideNav/SideNavItem.js +28 -22
- package/dist/Stack/stack.stylex.d.ts +3 -3
- package/dist/Switch/Switch.js +11 -10
- package/dist/TabList/Tab.d.ts.map +1 -1
- package/dist/TabList/Tab.js +2 -3
- package/dist/TabList/TabMenu.d.ts.map +1 -1
- package/dist/TabList/TabMenu.js +41 -19
- package/dist/Table/BaseTable.d.ts.map +1 -1
- package/dist/Table/BaseTable.js +8 -0
- package/dist/Table/index.d.ts +1 -1
- package/dist/Table/index.d.ts.map +1 -1
- package/dist/Table/index.js +1 -1
- package/dist/Table/plugins/groupedRows/useTableGroupedRows.d.ts +1 -1
- package/dist/Table/plugins/groupedRows/useTableGroupedRows.d.ts.map +1 -1
- package/dist/Table/plugins/groupedRows/useTableGroupedRows.js +22 -18
- package/dist/Table/plugins/rowExpansion/index.d.ts +1 -1
- package/dist/Table/plugins/rowExpansion/index.d.ts.map +1 -1
- package/dist/Table/plugins/rowExpansion/index.js +1 -1
- package/dist/Table/plugins/rowExpansion/useTableRowExpansion.d.ts +41 -76
- package/dist/Table/plugins/rowExpansion/useTableRowExpansion.d.ts.map +1 -1
- package/dist/Table/plugins/rowExpansion/useTableRowExpansion.js +94 -345
- package/dist/Table/plugins/sortable/useTableSortable.d.ts.map +1 -1
- package/dist/Table/plugins/sortable/useTableSortable.js +23 -4
- package/dist/Table/plugins/tree/useTableTreeData.d.ts.map +1 -1
- package/dist/Table/plugins/tree/useTableTreeData.js +29 -33
- package/dist/Table/tableContextMenu.d.ts.map +1 -1
- package/dist/Table/tableContextMenu.js +2 -1
- package/dist/Table/types.d.ts +11 -0
- package/dist/Table/types.d.ts.map +1 -1
- package/dist/TextArea/TextArea.d.ts +10 -1
- package/dist/TextArea/TextArea.d.ts.map +1 -1
- package/dist/TextArea/TextArea.js +16 -6
- package/dist/TextInput/TextInput.d.ts +10 -1
- package/dist/TextInput/TextInput.d.ts.map +1 -1
- package/dist/TextInput/TextInput.js +13 -19
- package/dist/Thumbnail/Thumbnail.d.ts.map +1 -1
- package/dist/Thumbnail/Thumbnail.js +32 -26
- package/dist/TimeInput/TimeInput.d.ts.map +1 -1
- package/dist/TimeInput/TimeInput.js +7 -15
- package/dist/Timestamp/TimestampHoverCard.d.ts.map +1 -1
- package/dist/Timestamp/TimestampHoverCard.js +16 -34
- package/dist/Token/Token.d.ts.map +1 -1
- package/dist/Token/Token.js +20 -11
- package/dist/Tokenizer/Tokenizer.d.ts.map +1 -1
- package/dist/Tokenizer/Tokenizer.js +4 -2
- package/dist/Tooltip/useTooltip.d.ts.map +1 -1
- package/dist/Tooltip/useTooltip.js +3 -19
- package/dist/TopNav/TopNav.d.ts.map +1 -1
- package/dist/TopNav/TopNav.js +6 -5
- package/dist/TopNav/TopNavHeading.d.ts.map +1 -1
- package/dist/TopNav/TopNavHeading.js +54 -16
- package/dist/TopNav/TopNavItem.d.ts.map +1 -1
- package/dist/TopNav/TopNavItem.js +3 -9
- package/dist/TopNav/TopNavMegaMenu.d.ts +7 -0
- package/dist/TopNav/TopNavMegaMenu.d.ts.map +1 -1
- package/dist/TopNav/TopNavMegaMenu.js +146 -60
- package/dist/TopNav/TopNavMegaMenuItem.d.ts.map +1 -1
- package/dist/TopNav/TopNavMegaMenuItem.js +22 -3
- package/dist/TopNav/TopNavMenu.d.ts.map +1 -1
- package/dist/TopNav/TopNavMenu.js +83 -38
- package/dist/TreeList/TreeList.d.ts.map +1 -1
- package/dist/TreeList/TreeList.js +13 -0
- package/dist/TreeList/TreeListBranches.d.ts +1 -1
- package/dist/TreeList/TreeListBranches.d.ts.map +1 -1
- package/dist/TreeList/TreeListBranches.js +14 -4
- package/dist/TreeList/TreeListItem.d.ts +11 -1
- package/dist/TreeList/TreeListItem.d.ts.map +1 -1
- package/dist/TreeList/TreeListItem.js +57 -30
- package/dist/Typeahead/BaseTypeahead.d.ts.map +1 -1
- package/dist/Typeahead/BaseTypeahead.js +16 -8
- package/dist/astryx.css +74 -85
- package/dist/astryx.umd.js +56 -56
- package/dist/astryx.umd.js.map +4 -4
- package/dist/hooks/containerReveal.stylex.d.ts +61 -0
- package/dist/hooks/containerReveal.stylex.d.ts.map +1 -0
- package/dist/hooks/containerReveal.stylex.js +63 -0
- package/dist/hooks/index.d.ts +3 -0
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/index.js +2 -0
- package/dist/hooks/useClipboard.d.ts +59 -0
- package/dist/hooks/useClipboard.d.ts.map +1 -0
- package/dist/hooks/useClipboard.js +106 -0
- package/dist/hooks/useContainerReveal.d.ts +14 -8
- package/dist/hooks/useContainerReveal.d.ts.map +1 -1
- package/dist/hooks/useContainerReveal.js +28 -69
- package/dist/hooks/useIndicatorFocusRing.d.ts +28 -0
- package/dist/hooks/useIndicatorFocusRing.d.ts.map +1 -0
- package/dist/hooks/useIndicatorFocusRing.js +96 -0
- package/dist/hooks/useLongPress.d.ts.map +1 -1
- package/dist/hooks/useLongPress.js +12 -2
- package/dist/hooks/useScrollLock.d.ts.map +1 -1
- package/dist/hooks/useScrollLock.js +33 -18
- package/dist/hooks/useStreamingText.d.ts +18 -3
- package/dist/hooks/useStreamingText.d.ts.map +1 -1
- package/dist/hooks/useStreamingText.js +47 -7
- package/dist/hooks/useTreeFocus.d.ts.map +1 -1
- package/dist/hooks/useTreeFocus.js +9 -3
- package/dist/hooks/useTypeahead.d.ts +3 -2
- package/dist/hooks/useTypeahead.d.ts.map +1 -1
- package/dist/hooks/useTypeahead.js +19 -7
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/theme/defineTheme.d.ts +16 -0
- package/dist/theme/defineTheme.d.ts.map +1 -1
- package/dist/theme/defineTheme.js +8 -0
- package/dist/theme/derivedVarRegistry.d.ts +8 -0
- package/dist/theme/derivedVarRegistry.d.ts.map +1 -1
- package/dist/theme/derivedVarRegistry.js +14 -13
- package/dist/theme/expandColorScale.d.ts +3 -1
- package/dist/theme/expandColorScale.d.ts.map +1 -1
- package/dist/theme/expandColorScale.js +17 -7
- package/dist/theme/expandTypeScale.d.ts.map +1 -1
- package/dist/theme/expandTypeScale.js +17 -0
- package/dist/theme/generateThemeRules.d.ts.map +1 -1
- package/dist/theme/generateThemeRules.js +11 -0
- package/dist/theme/index.d.ts +1 -0
- package/dist/theme/index.d.ts.map +1 -1
- package/dist/utils/focusOutline.stylex.d.ts +107 -0
- package/dist/utils/focusOutline.stylex.d.ts.map +1 -0
- package/dist/utils/focusOutline.stylex.js +130 -0
- package/dist/utils/focusReturn.d.ts +24 -0
- package/dist/utils/focusReturn.d.ts.map +1 -0
- package/dist/utils/focusReturn.js +29 -0
- package/dist/utils/index.d.ts +1 -0
- package/dist/utils/index.d.ts.map +1 -1
- package/dist/utils/index.js +1 -0
- package/dist/utils/mergeRefs.d.ts.map +1 -1
- package/dist/utils/mergeRefs.js +7 -5
- package/dist/utils/rtlStyles.d.ts +2 -2
- package/dist/utils/rtlStyles.js +2 -2
- package/dist/utils/themeProps.d.ts +20 -1
- package/dist/utils/themeProps.d.ts.map +1 -1
- package/dist/utils/themeProps.js +8 -2
- package/locales/en.json +12 -0
- package/locales/pseudo.json +9 -0
- package/package.json +7 -2
- package/src/AlertDialog/AlertDialog.doc.mjs +16 -3
- package/src/AlertDialog/AlertDialog.test.tsx +208 -1
- package/src/AlertDialog/AlertDialog.tsx +21 -3
- package/src/AppShell/AppShell.doc.mjs +11 -0
- package/src/AppShell/AppShell.test.tsx +139 -0
- package/src/AppShell/AppShell.tsx +32 -22
- package/src/AspectRatio/AspectRatio.doc.mjs +27 -3
- package/src/AspectRatio/AspectRatio.test.tsx +30 -0
- package/src/AspectRatio/AspectRatio.tsx +13 -0
- package/src/Avatar/Avatar.doc.mjs +2 -13
- package/src/Avatar/Avatar.test.tsx +33 -8
- package/src/Avatar/Avatar.tsx +52 -50
- package/src/AvatarGroup/AvatarGroupOverflow.tsx +2 -9
- package/src/Banner/Banner.tsx +9 -6
- package/src/Breadcrumbs/BreadcrumbItem.tsx +16 -6
- package/src/Breadcrumbs/index.ts +5 -1
- package/src/Button/Button.tsx +21 -41
- package/src/Calendar/Calendar.tsx +2 -1
- package/src/Calendar/styles.ts +0 -8
- package/src/Carousel/Carousel.doc.mjs +3 -0
- package/src/Carousel/Carousel.tsx +10 -6
- package/src/Chat/Chat.doc.mjs +2 -0
- package/src/Chat/ChatDictationButton.tsx +7 -1
- package/src/Chat/ChatLayoutScrollButton.test.tsx +22 -0
- package/src/Chat/ChatLayoutScrollButton.tsx +8 -1
- package/src/Chat/ChatSendButton.tsx +2 -3
- package/src/Chat/ChatToolCalls.test.tsx +35 -0
- package/src/Chat/ChatToolCalls.tsx +36 -16
- package/src/Chat/useTriggerMenu.tsx +2 -5
- package/src/CheckboxInput/CheckboxInput.doc.mjs +4 -2
- package/src/CheckboxInput/CheckboxInput.test.tsx +115 -0
- package/src/CheckboxInput/CheckboxInput.tsx +45 -202
- package/src/ClickableCard/ClickableCard.tsx +6 -11
- package/src/CodeBlock/CodeBlock.doc.mjs +3 -0
- package/src/CodeBlock/CodeBlock.test.tsx +91 -0
- package/src/CodeBlock/CodeBlock.tsx +57 -80
- package/src/Collapsible/Collapsible.tsx +22 -18
- package/src/CommandPalette/CommandPalette.test.tsx +29 -0
- package/src/CommandPalette/CommandPaletteItem.tsx +7 -4
- package/src/CommandPalette/CommandPaletteList.tsx +2 -2
- package/src/ComplexSelector/ComplexSelector.doc.mjs +42 -0
- package/src/ComplexSelector/ComplexSelector.test.tsx +64 -0
- package/src/ComplexSelector/ComplexSelector.tsx +46 -29
- package/src/ContextMenu/ContextMenu.doc.mjs +1 -1
- package/src/ContextMenu/ContextMenu.test.tsx +41 -0
- package/src/ContextMenu/ContextMenu.tsx +3 -3
- package/src/ContextMenu/index.ts +5 -1
- package/src/DateInput/DateInput.doc.mjs +18 -3
- package/src/DateInput/DateInput.test.tsx +93 -11
- package/src/DateInput/DateInput.tsx +41 -19
- package/src/DateRangeInput/DateRangeInput.doc.mjs +10 -2
- package/src/DateRangeInput/DateRangeInput.test.tsx +110 -14
- package/src/DateRangeInput/DateRangeInput.tsx +24 -12
- package/src/DateTimeInput/DateTimeInput.doc.mjs +16 -2
- package/src/DateTimeInput/DateTimeInput.test.tsx +75 -0
- package/src/DateTimeInput/DateTimeInput.tsx +35 -8
- package/src/Dialog/Dialog.tsx +2 -9
- package/src/DropdownMenu/DropdownMenu.doc.mjs +5 -9
- package/src/DropdownMenu/DropdownMenu.test.tsx +534 -4
- package/src/DropdownMenu/DropdownMenu.tsx +113 -52
- package/src/DropdownMenu/DropdownMenuCheckboxItem.tsx +27 -30
- package/src/DropdownMenu/DropdownMenuDivider.doc.mjs +34 -0
- package/src/DropdownMenu/DropdownMenuDivider.tsx +81 -0
- package/src/DropdownMenu/DropdownMenuItem.doc.mjs +39 -4
- package/src/DropdownMenu/DropdownMenuItem.tsx +48 -10
- package/src/DropdownMenu/DropdownMenuRadioItem.tsx +30 -76
- package/src/DropdownMenu/DropdownMenuSelectable.test.tsx +25 -19
- package/src/DropdownMenu/DropdownMenuSubMenu.test.tsx +44 -14
- package/src/DropdownMenu/DropdownMenuSubMenu.tsx +1 -5
- package/src/DropdownMenu/index.ts +8 -1
- package/src/DropdownMenu/renderDropdownItems.tsx +33 -34
- package/src/EmptyState/EmptyState.doc.mjs +4 -0
- package/src/EmptyState/EmptyState.test.tsx +62 -0
- package/src/EmptyState/EmptyState.tsx +16 -6
- package/src/Field/Field.doc.mjs +1 -0
- package/src/Field/InputClearButton.test.tsx +117 -0
- package/src/Field/InputClearButton.tsx +30 -3
- package/src/HoverCard/useHoverCard.tsx +2 -23
- package/src/Icon/Icon.doc.mjs +2 -1
- package/src/Indicator/CheckIndicator.tsx +174 -0
- package/src/Indicator/CheckboxIndicator.tsx +257 -0
- package/src/Indicator/Indicator.doc.mjs +344 -0
- package/src/Indicator/Indicator.test.tsx +393 -0
- package/src/Indicator/RadioIndicator.tsx +206 -0
- package/src/Indicator/index.ts +45 -0
- package/src/Indicator/indicator.markers.stylex.ts +19 -0
- package/src/Indicator/indicatorRegistry.test.tsx +106 -0
- package/src/Indicator/indicatorRegistry.ts +120 -0
- package/src/Indicator/types.ts +186 -0
- package/src/Indicator/useIndicator.ts +39 -0
- package/src/Item/Item.doc.mjs +1 -1
- package/src/Item/Item.tsx +7 -14
- package/src/Layer/useLayer.doc.mjs +2 -2
- package/src/Layer/useLayer.test.tsx +85 -0
- package/src/Layer/useLayer.tsx +39 -1
- package/src/Lightbox/Lightbox.doc.mjs +1 -1
- package/src/Lightbox/Lightbox.tsx +43 -38
- package/src/Link/Link.tsx +4 -11
- package/src/MobileNav/MobileNav.tsx +3 -3
- package/src/MoreMenu/MoreMenu.doc.mjs +31 -0
- package/src/MoreMenu/MoreMenu.test.tsx +68 -1
- package/src/MoreMenu/MoreMenu.tsx +19 -0
- package/src/MultiSelector/MultiSelector.doc.mjs +9 -1
- package/src/MultiSelector/MultiSelector.test.tsx +255 -16
- package/src/MultiSelector/MultiSelector.tsx +103 -99
- package/src/NumberInput/NumberInput.doc.mjs +265 -50
- package/src/NumberInput/NumberInput.test.tsx +726 -21
- package/src/NumberInput/NumberInput.tsx +353 -59
- package/src/Outline/Outline.tsx +2 -5
- package/src/Pagination/Pagination.doc.mjs +1 -1
- package/src/Pagination/Pagination.test.tsx +22 -7
- package/src/Pagination/Pagination.tsx +38 -35
- package/src/Popover/Popover.tsx +6 -7
- package/src/PowerSearch/PowerSearch.tsx +1 -1
- package/src/PowerSearch/PowerSearchEditPopover.test.tsx +42 -0
- package/src/PowerSearch/PowerSearchEditPopover.tsx +7 -0
- package/src/ProgressBar/ProgressBar.doc.mjs +27 -5
- package/src/ProgressBar/ProgressBar.test.tsx +224 -1
- package/src/ProgressBar/ProgressBar.tsx +124 -22
- package/src/RadioList/RadioList.doc.mjs +4 -2
- package/src/RadioList/RadioListItem.tsx +31 -130
- package/src/Resizable/ResizeHandle.tsx +2 -9
- package/src/SegmentedControl/SegmentedControlItem.tsx +2 -9
- package/src/SelectableCard/SelectableCard.tsx +4 -9
- package/src/Selector/Selector.doc.mjs +7 -4
- package/src/Selector/Selector.test.tsx +935 -25
- package/src/Selector/Selector.tsx +189 -106
- package/src/Selector/hooks.ts +77 -50
- package/src/SideNav/SideNav.test.tsx +46 -0
- package/src/SideNav/SideNav.tsx +1 -0
- package/src/SideNav/SideNavCollapseButton.tsx +15 -10
- package/src/SideNav/SideNavHeading.tsx +48 -10
- package/src/SideNav/SideNavItem.tsx +20 -12
- package/src/Stack/Stack.doc.mjs +110 -0
- package/src/StatusDot/StatusDot.doc.mjs +12 -3
- package/src/Switch/Switch.test.tsx +32 -0
- package/src/Switch/Switch.tsx +8 -8
- package/src/TabList/Tab.tsx +2 -9
- package/src/TabList/TabMenu.tsx +14 -21
- package/src/Table/BaseTable.tsx +11 -0
- package/src/Table/index.ts +1 -4
- package/src/Table/plugins/groupedRows/useTableGroupedRows.tsx +30 -14
- package/src/Table/plugins/rowExpansion/index.ts +1 -4
- package/src/Table/plugins/rowExpansion/useTableRowExpansion.test.tsx +125 -175
- package/src/Table/plugins/rowExpansion/useTableRowExpansion.tsx +115 -458
- package/src/Table/plugins/sortable/useTableSortable.tsx +2 -6
- package/src/Table/plugins/tree/useTableTreeData.tsx +43 -24
- package/src/Table/tableContextMenu.test.tsx +27 -0
- package/src/Table/tableContextMenu.tsx +1 -0
- package/src/Table/types.ts +11 -0
- package/src/Table/useTableGroupedRows.doc.mjs +1 -1
- package/src/Table/useTableRowExpansion.doc.mjs +43 -66
- package/src/TextArea/TextArea.doc.mjs +42 -2
- package/src/TextArea/TextArea.test.tsx +219 -0
- package/src/TextArea/TextArea.tsx +34 -7
- package/src/TextInput/TextInput.doc.mjs +18 -2
- package/src/TextInput/TextInput.test.tsx +189 -0
- package/src/TextInput/TextInput.tsx +25 -31
- package/src/Thumbnail/Thumbnail.tsx +2 -9
- package/src/TimeInput/TimeInput.doc.mjs +2 -2
- package/src/TimeInput/TimeInput.test.tsx +30 -3
- package/src/TimeInput/TimeInput.tsx +9 -26
- package/src/Timestamp/Timestamp.doc.mjs +4 -3
- package/src/Timestamp/TimestampHoverCard.tsx +13 -35
- package/src/Token/Token.tsx +5 -28
- package/src/Tokenizer/Tokenizer.doc.mjs +2 -2
- package/src/Tokenizer/Tokenizer.test.tsx +45 -3
- package/src/Tokenizer/Tokenizer.tsx +10 -2
- package/src/Tooltip/useTooltip.tsx +2 -23
- package/src/TopNav/TopNav.tsx +1 -3
- package/src/TopNav/TopNavHeading.tsx +42 -13
- package/src/TopNav/TopNavItem.tsx +3 -21
- package/src/TopNav/TopNavMegaMenu.test.tsx +433 -33
- package/src/TopNav/TopNavMegaMenu.tsx +118 -53
- package/src/TopNav/TopNavMegaMenuItem.tsx +2 -9
- package/src/TopNav/TopNavMenu.tsx +34 -37
- package/src/TreeList/TreeList.doc.mjs +5 -0
- package/src/TreeList/TreeList.test.tsx +206 -7
- package/src/TreeList/TreeList.tsx +22 -0
- package/src/TreeList/TreeListBranches.tsx +25 -2
- package/src/TreeList/TreeListItem.tsx +89 -52
- package/src/Typeahead/BaseTypeahead.tsx +19 -6
- package/src/Typeahead/Typeahead.doc.mjs +1 -0
- package/src/Typeahead/Typeahead.test.tsx +76 -3
- package/src/hooks/containerReveal.stylex.ts +102 -0
- package/src/hooks/index.ts +4 -0
- package/src/hooks/useClipboard.doc.mjs +87 -0
- package/src/hooks/useClipboard.test.tsx +151 -0
- package/src/hooks/useClipboard.ts +135 -0
- package/src/hooks/useContainerReveal.doc.mjs +7 -7
- package/src/hooks/useContainerReveal.test.tsx +42 -62
- package/src/hooks/useContainerReveal.ts +36 -91
- package/src/hooks/useImageMode.test.ts +1 -1
- package/src/hooks/useIndicatorFocusRing.tsx +120 -0
- package/src/hooks/useLongPress.test.tsx +18 -0
- package/src/hooks/useLongPress.ts +12 -2
- package/src/hooks/useScrollLock.test.ts +72 -0
- package/src/hooks/useScrollLock.ts +51 -19
- package/src/hooks/useStreamingText.test.ts +46 -1
- package/src/hooks/useStreamingText.ts +49 -7
- package/src/hooks/useTreeFocus.test.tsx +50 -0
- package/src/hooks/useTreeFocus.ts +14 -3
- package/src/hooks/useTypeahead.test.tsx +150 -0
- package/src/hooks/useTypeahead.ts +24 -9
- package/src/i18n/InternationalizationProvider.doc.mjs +7 -2
- package/src/index.ts +1 -0
- package/src/theme/defineTheme.ts +24 -0
- package/src/theme/derivedVarRegistry.test.ts +21 -1
- package/src/theme/derivedVarRegistry.ts +19 -6
- package/src/theme/expandColorScale.test.ts +14 -0
- package/src/theme/expandColorScale.ts +24 -9
- package/src/theme/expandTypeScale.test.ts +43 -0
- package/src/theme/expandTypeScale.ts +17 -0
- package/src/theme/generateThemeRules.test.ts +61 -20
- package/src/theme/generateThemeRules.ts +11 -0
- package/src/theme/index.ts +13 -0
- package/src/utils/focusOutline.stylex.ts +163 -0
- package/src/utils/focusReturn.test.ts +42 -0
- package/src/utils/focusReturn.ts +31 -0
- package/src/utils/index.ts +1 -0
- package/src/utils/mergeRefs.test.ts +48 -0
- package/src/utils/mergeRefs.ts +12 -6
- package/src/utils/rtlStyles.ts +2 -2
- package/src/utils/themeProps.ts +26 -4
- package/dist/CheckboxInput/checkbox.markers.stylex.d.ts +0 -9
- package/dist/CheckboxInput/checkbox.markers.stylex.d.ts.map +0 -1
- package/dist/CheckboxInput/checkbox.markers.stylex.js +0 -14
- package/dist/RadioList/radio.markers.stylex.d.ts +0 -7
- package/dist/RadioList/radio.markers.stylex.d.ts.map +0 -1
- package/dist/RadioList/radio.markers.stylex.js +0 -12
- package/dist/hooks/containerReveal.pool.stylex.d.ts +0 -303
- package/dist/hooks/containerReveal.pool.stylex.d.ts.map +0 -1
- package/dist/hooks/containerReveal.pool.stylex.js +0 -292
- package/src/CheckboxInput/checkbox.markers.stylex.ts +0 -12
- package/src/RadioList/radio.markers.stylex.ts +0 -10
- package/src/hooks/containerReveal.pool.stylex.ts +0 -571
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuItem.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAiC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAErE,OAAO,EAAiB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAStD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"DropdownMenuItem.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAiC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAErE,OAAO,EAAiB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAStD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAkD5C,MAAM,WAAW,qBAAsB,SAAQ,IAAI,CACjD,SAAS,EACT,QAAQ,GAAG,WAAW,GAAG,OAAO,CACjC;IACC,wCAAwC;IACxC,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B,0BAA0B;IAC1B,KAAK,EAAE,SAAS,CAAC;IACjB,4DAA4D;IAC5D,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,0CAA0C;IAC1C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,mDAAmD;IACnD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,gEAAgE;IAChE,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;;;;;OAMG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC;CACrC;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,gBAAgB,CAAC,EAC/B,IAAI,EACJ,KAAK,EACL,WAAW,EACX,OAAO,EACP,UAAkB,EAClB,UAAU,EACV,gBAAuB,EACvB,OAAmB,EACnB,MAAM,EACN,SAAS,EACT,KAAK,GACN,EAAE,qBAAqB,+BA0DvB;yBAtEe,gBAAgB"}
|
|
@@ -53,6 +53,12 @@ const menuItemStyles = {
|
|
|
53
53
|
kSiTet: "xbyyjgo",
|
|
54
54
|
kkrTdU: "x1h6gzvc",
|
|
55
55
|
$$css: true
|
|
56
|
+
},
|
|
57
|
+
destructive: {
|
|
58
|
+
kMwMTN: "xjt36v0",
|
|
59
|
+
"--_item-label-color": "xufyqxy",
|
|
60
|
+
"--_item-description-color": "xqlix59",
|
|
61
|
+
$$css: true
|
|
56
62
|
}
|
|
57
63
|
};
|
|
58
64
|
const itemSizeStyles = {
|
|
@@ -79,7 +85,7 @@ const itemSizeStyles = {
|
|
|
79
85
|
* ```
|
|
80
86
|
* <DropdownMenu button={{ label: 'Actions' }}>
|
|
81
87
|
* <DropdownMenuItem icon={PencilIcon} label="Edit" onClick={handleEdit} />
|
|
82
|
-
* <DropdownMenuItem label="Delete"
|
|
88
|
+
* <DropdownMenuItem label="Delete" variant="destructive" onClick={handleDelete} />
|
|
83
89
|
* </DropdownMenu>
|
|
84
90
|
* ```
|
|
85
91
|
*/
|
|
@@ -90,6 +96,8 @@ export function DropdownMenuItem({
|
|
|
90
96
|
onClick,
|
|
91
97
|
isDisabled = false,
|
|
92
98
|
endContent,
|
|
99
|
+
hasCloseOnSelect = true,
|
|
100
|
+
variant = 'default',
|
|
93
101
|
xstyle,
|
|
94
102
|
className,
|
|
95
103
|
style
|
|
@@ -97,29 +105,33 @@ export function DropdownMenuItem({
|
|
|
97
105
|
const ctx = useDropdownMenuContext();
|
|
98
106
|
const menuSize = ctx?.menuSize ?? 'md';
|
|
99
107
|
const handleClick = useCallback(() => {
|
|
100
|
-
if (isDisabled
|
|
108
|
+
if (isDisabled) {
|
|
101
109
|
return;
|
|
102
110
|
}
|
|
103
|
-
onClick();
|
|
104
|
-
|
|
105
|
-
|
|
111
|
+
onClick?.();
|
|
112
|
+
if (hasCloseOnSelect) {
|
|
113
|
+
ctx?.closeMenu();
|
|
114
|
+
}
|
|
115
|
+
}, [isDisabled, onClick, hasCloseOnSelect, ctx]);
|
|
106
116
|
const handlePointerMove = useCallback(e => focusMenuItemOnHover(e, isDisabled), [isDisabled]);
|
|
117
|
+
const isDestructive = variant === 'destructive';
|
|
107
118
|
return /*#__PURE__*/_jsx(Item, {
|
|
108
119
|
role: "menuitem",
|
|
109
120
|
tabIndex: isDisabled ? undefined : -1,
|
|
110
121
|
onPointerMove: handlePointerMove,
|
|
111
122
|
startContent: icon ? renderIconSlot(icon, {
|
|
112
123
|
size: 'sm',
|
|
113
|
-
color: 'secondary'
|
|
124
|
+
color: isDestructive ? 'error' : 'secondary'
|
|
114
125
|
}) : undefined,
|
|
115
126
|
label: label,
|
|
116
127
|
description: description,
|
|
117
128
|
endContent: endContent,
|
|
118
129
|
onClick: handleClick,
|
|
119
130
|
isDisabled: isDisabled,
|
|
120
|
-
xstyle: [menuItemStyles.root, itemSizeStyles[menuSize], isDisabled && menuItemStyles.disabled, xstyle],
|
|
131
|
+
xstyle: [menuItemStyles.root, itemSizeStyles[menuSize], isDestructive && menuItemStyles.destructive, isDisabled && menuItemStyles.disabled, xstyle],
|
|
121
132
|
...mergeProps(themeProps('dropdown-menu-item', {
|
|
122
|
-
size: menuSize
|
|
133
|
+
size: menuSize,
|
|
134
|
+
variant: isDestructive ? 'destructive' : null
|
|
123
135
|
}), {
|
|
124
136
|
className,
|
|
125
137
|
style
|
|
@@ -10,11 +10,11 @@
|
|
|
10
10
|
* state + onChange come from DropdownMenuRadioGroupContext. Keyboard nav +
|
|
11
11
|
* Enter/Space activation come from the parent DropdownMenu.
|
|
12
12
|
*
|
|
13
|
-
* The round radio visual
|
|
14
|
-
* the row owns the checked state
|
|
15
|
-
*
|
|
16
|
-
*
|
|
17
|
-
*
|
|
13
|
+
* The round radio visual is the shared radio indicator, decorative
|
|
14
|
+
* (aria-hidden) — the row owns the checked state, and menu radios pick up the
|
|
15
|
+
* same `radio` theming (and any theme replacement) as RadioList. This row keeps
|
|
16
|
+
* the marker box: its size is derived from the menu's item size and it swaps to
|
|
17
|
+
* the inline-end of the row on coarse-pointer (touch) devices via CSS `order`.
|
|
18
18
|
*/
|
|
19
19
|
import { type ReactNode } from 'react';
|
|
20
20
|
import { type IconType } from '../Icon';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuRadioItem.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuRadioItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;GAiBG;AAEH,OAAO,EAAiC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAErE,OAAO,EAAiB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"DropdownMenuRadioItem.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuRadioItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;GAiBG;AAEH,OAAO,EAAiC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAErE,OAAO,EAAiB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAOtD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAyC5C,MAAM,WAAW,0BAA2B,SAAQ,IAAI,CACtD,SAAS,EACT,MAAM,GAAG,cAAc,GAAG,UAAU,CACrC;IACC;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,qBAAqB,CAAC,EACpC,KAAK,EACL,KAAK,EACL,WAAW,EACX,IAAI,EACJ,UAAkB,EAClB,UAAU,EACV,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,0BAA0B,+BAmE5B;yBA9Ee,qBAAqB"}
|
|
@@ -14,20 +14,21 @@
|
|
|
14
14
|
* state + onChange come from DropdownMenuRadioGroupContext. Keyboard nav +
|
|
15
15
|
* Enter/Space activation come from the parent DropdownMenu.
|
|
16
16
|
*
|
|
17
|
-
* The round radio visual
|
|
18
|
-
* the row owns the checked state
|
|
19
|
-
*
|
|
20
|
-
*
|
|
21
|
-
*
|
|
17
|
+
* The round radio visual is the shared radio indicator, decorative
|
|
18
|
+
* (aria-hidden) — the row owns the checked state, and menu radios pick up the
|
|
19
|
+
* same `radio` theming (and any theme replacement) as RadioList. This row keeps
|
|
20
|
+
* the marker box: its size is derived from the menu's item size and it swaps to
|
|
21
|
+
* the inline-end of the row on coarse-pointer (touch) devices via CSS `order`.
|
|
22
22
|
*/
|
|
23
23
|
import { useCallback } from 'react';
|
|
24
24
|
import * as stylex from '@stylexjs/stylex';
|
|
25
25
|
import { renderIconSlot } from "../Icon/index.js";
|
|
26
|
+
import { useIndicator } from "../Indicator/index.js";
|
|
26
27
|
import { Item } from "../Item/index.js";
|
|
27
28
|
import { useDropdownMenuContext } from "./DropdownMenuContext.js";
|
|
28
29
|
import { focusMenuItemOnHover } from "./menuItemHover.js";
|
|
29
30
|
import "../theme/tokens.stylex.js";
|
|
30
|
-
import { colorVars, spacingVars
|
|
31
|
+
import { colorVars, spacingVars } from "../theme/tokens.stylex.js";
|
|
31
32
|
import { mergeProps, themeProps } from "../utils/index.js";
|
|
32
33
|
import { useDropdownMenuRadioGroupContext } from "./DropdownMenuContext.js";
|
|
33
34
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
@@ -46,62 +47,17 @@ const styles = {
|
|
|
46
47
|
kkrTdU: "x1h6gzvc",
|
|
47
48
|
$$css: true
|
|
48
49
|
},
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
kGNEyG: "x6s0dn4",
|
|
52
|
-
kjj79g: "xl56j7k",
|
|
53
|
-
kmuXW: "x2lah0s",
|
|
54
|
-
kB7OPa: "x9f619",
|
|
55
|
-
kMzoRj: "x1litavf",
|
|
56
|
-
ksu8eU: "x1y0btm7",
|
|
57
|
-
kaIpWk: "x16rqkct",
|
|
58
|
-
k1ekBW: "xts7igz",
|
|
59
|
-
kIyJzY: "xuedmi6 x12w9bfk",
|
|
60
|
-
kAMwcw: "xlr8y92",
|
|
50
|
+
marker: {
|
|
51
|
+
kfzvcC: "x47corl",
|
|
61
52
|
kayTVb: "x1g77sc7 xozvky",
|
|
62
53
|
keTefX: "x1lziwak x1jymrmb",
|
|
63
54
|
$$css: true
|
|
64
|
-
},
|
|
65
|
-
unchecked: {
|
|
66
|
-
kVAM5u: "xvy26l8",
|
|
67
|
-
kWkggS: "x10xzikg",
|
|
68
|
-
$$css: true
|
|
69
|
-
},
|
|
70
|
-
checked: {
|
|
71
|
-
kVAM5u: "xad5do",
|
|
72
|
-
kWkggS: "x1ewilqj",
|
|
73
|
-
$$css: true
|
|
74
|
-
},
|
|
75
|
-
dot: {
|
|
76
|
-
kaIpWk: "x16rqkct",
|
|
77
|
-
kWkggS: "x1azo05",
|
|
78
|
-
$$css: true
|
|
79
|
-
}
|
|
80
|
-
};
|
|
81
|
-
const circleSizeStyles = {
|
|
82
|
-
sm: {
|
|
83
|
-
kzqmXN: "x1xp8n7a",
|
|
84
|
-
kZKoxP: "xmix8c7",
|
|
85
|
-
$$css: true
|
|
86
|
-
},
|
|
87
|
-
md: {
|
|
88
|
-
kzqmXN: "x17z2i9w",
|
|
89
|
-
kZKoxP: "x17rw0jw",
|
|
90
|
-
$$css: true
|
|
91
|
-
}
|
|
92
|
-
};
|
|
93
|
-
const dotSizeStyles = {
|
|
94
|
-
sm: {
|
|
95
|
-
kzqmXN: "x1v4s8kt",
|
|
96
|
-
kZKoxP: "xols6we",
|
|
97
|
-
$$css: true
|
|
98
|
-
},
|
|
99
|
-
md: {
|
|
100
|
-
kzqmXN: "x1xc55vz",
|
|
101
|
-
kZKoxP: "xdk7pt",
|
|
102
|
-
$$css: true
|
|
103
55
|
}
|
|
104
56
|
};
|
|
57
|
+
|
|
58
|
+
// Matches the control sizes RadioList uses, so a radio reads the same in a
|
|
59
|
+
// menu row as it does in a radio group.
|
|
60
|
+
|
|
105
61
|
/**
|
|
106
62
|
* A single option in a DropdownMenuRadioGroup (role="menuitemradio").
|
|
107
63
|
*
|
|
@@ -133,6 +89,7 @@ export function DropdownMenuRadioItem({
|
|
|
133
89
|
const menuSize = menuCtx?.menuSize ?? 'md';
|
|
134
90
|
const controlSize = menuSize === 'sm' ? 'sm' : 'md';
|
|
135
91
|
const isChecked = groupCtx.value === value;
|
|
92
|
+
const RadioControl = useIndicator('radio');
|
|
136
93
|
const handleClick = useCallback(() => {
|
|
137
94
|
if (isDisabled) {
|
|
138
95
|
return;
|
|
@@ -149,19 +106,19 @@ export function DropdownMenuRadioItem({
|
|
|
149
106
|
"aria-checked": isChecked,
|
|
150
107
|
tabIndex: isDisabled ? undefined : -1,
|
|
151
108
|
onPointerMove: handlePointerMove,
|
|
152
|
-
marker:
|
|
153
|
-
|
|
154
|
-
|
|
109
|
+
marker:
|
|
110
|
+
/*#__PURE__*/
|
|
111
|
+
// No wrapper — see DropdownMenuCheckboxItem: the target belongs on the
|
|
112
|
+
// visible circle, and the indicator already owns its control size.
|
|
113
|
+
_jsx(RadioControl, {
|
|
114
|
+
state: isChecked ? 'checked' : 'unchecked',
|
|
115
|
+
size: controlSize,
|
|
116
|
+
isDisabled: isDisabled,
|
|
117
|
+
xstyle: styles.marker,
|
|
118
|
+
...themeProps('dropdown-menu-radio', {
|
|
155
119
|
size: controlSize,
|
|
156
120
|
checked: isChecked ? 'checked' : null,
|
|
157
121
|
disabled: isDisabled ? 'disabled' : null
|
|
158
|
-
}), stylex.props(styles.circle, circleSizeStyles[controlSize], isChecked ? styles.checked : styles.unchecked)),
|
|
159
|
-
children: isChecked && /*#__PURE__*/_jsx("span", {
|
|
160
|
-
...mergeProps(themeProps('dropdown-menu-radio-dot', {
|
|
161
|
-
size: controlSize,
|
|
162
|
-
checked: 'checked',
|
|
163
|
-
disabled: isDisabled ? 'disabled' : null
|
|
164
|
-
}), stylex.props(styles.dot, dotSizeStyles[controlSize]))
|
|
165
122
|
})
|
|
166
123
|
}),
|
|
167
124
|
startContent: icon ? renderIconSlot(icon, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DropdownMenuSubMenu.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuSubMenu.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AAEH,OAAc,EAOZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,EAAuB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAoB5D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"DropdownMenuSubMenu.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuSubMenu.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AAEH,OAAc,EAOZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,EAAuB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAoB5D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAqF5C,UAAU,4BAA6B,SAAQ,IAAI,CACjD,SAAS,EACT,QAAQ,GAAG,WAAW,GAAG,OAAO,CACjC;IACC,2DAA2D;IAC3D,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B,8CAA8C;IAC9C,KAAK,EAAE,SAAS,CAAC;IACjB,4DAA4D;IAC5D,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,yEAAyE;IACzE,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B,8CAA8C;IAC9C,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,mCAAmC;IACnC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,mCAAmC;IACnC,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,MAAM,WAAW,wBAAyB,SAAQ,4BAA4B;IAC5E;;;;;;;;OAQG;IACH,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,wBAAwB,GAC9B,SAAS,CAoVX;yBAtVe,mBAAmB"}
|
|
@@ -95,19 +95,12 @@ const triggerSizeStyles = {
|
|
|
95
95
|
$$css: true
|
|
96
96
|
}
|
|
97
97
|
};
|
|
98
|
-
const _temp = {
|
|
99
|
-
keTefX: "x11g1kdw",
|
|
100
|
-
k71WvV: "xnur1sd",
|
|
101
|
-
"$$css": true
|
|
102
|
-
};
|
|
103
98
|
const flyoutStyles = {
|
|
104
99
|
popover: {
|
|
105
100
|
k7Eaqz: "x5w4yej",
|
|
106
|
-
keTefX: "x11g1kdw",
|
|
107
|
-
k71WvV: "xnur1sd",
|
|
108
101
|
$$css: true
|
|
109
102
|
},
|
|
110
|
-
popoverCustomWidth: width => [
|
|
103
|
+
popoverCustomWidth: width => [{
|
|
111
104
|
k7Eaqz: (typeof width === 'number' ? `${width}px` : width) != null ? "xkj4a21" : typeof width === 'number' ? `${width}px` : width,
|
|
112
105
|
$$css: true
|
|
113
106
|
}, {
|
|
@@ -428,6 +421,7 @@ export function DropdownMenuSubMenu(props) {
|
|
|
428
421
|
}), {
|
|
429
422
|
placement: 'end',
|
|
430
423
|
alignment: 'start',
|
|
424
|
+
offset: spacingVars['--spacing-1'],
|
|
431
425
|
xstyle: [popoverXstyle, layerAnimations.end]
|
|
432
426
|
})]
|
|
433
427
|
});
|
|
@@ -12,8 +12,9 @@
|
|
|
12
12
|
* DropdownMenuContext + useListFocus path, so a new item type (e.g. a submenu)
|
|
13
13
|
* only shows up in their public API once it's aliased there too.
|
|
14
14
|
*/
|
|
15
|
-
export { DropdownMenu, type DropdownMenuProps, type DropdownMenuButtonProps, type DropdownMenuItemData, type
|
|
15
|
+
export { DropdownMenu, type DropdownMenuProps, type DropdownMenuButtonProps, type DropdownMenuItemData, type DropdownMenuDividerData, type DropdownMenuSection, type DropdownMenuOption, } from './DropdownMenu';
|
|
16
16
|
export { DropdownMenuItem, type DropdownMenuItemProps } from './DropdownMenuItem';
|
|
17
|
+
export { DropdownMenuDivider, type DropdownMenuDividerProps, } from './DropdownMenuDivider';
|
|
17
18
|
export { DropdownMenuCheckboxItem, type DropdownMenuCheckboxItemProps, } from './DropdownMenuCheckboxItem';
|
|
18
19
|
export { DropdownMenuRadioGroup, type DropdownMenuRadioGroupProps, } from './DropdownMenuRadioGroup';
|
|
19
20
|
export { DropdownMenuRadioItem, type DropdownMenuRadioItemProps, } from './DropdownMenuRadioItem';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/index.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EACL,YAAY,EACZ,KAAK,iBAAiB,EACtB,KAAK,uBAAuB,EAC5B,KAAK,oBAAoB,EACzB,KAAK,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/index.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EACL,YAAY,EACZ,KAAK,iBAAiB,EACtB,KAAK,uBAAuB,EAC5B,KAAK,oBAAoB,EACzB,KAAK,uBAAuB,EAC5B,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,GACxB,MAAM,gBAAgB,CAAC;AAExB,OAAO,EAAC,gBAAgB,EAAE,KAAK,qBAAqB,EAAC,MAAM,oBAAoB,CAAC;AAIhF,OAAO,EACL,mBAAmB,EACnB,KAAK,wBAAwB,GAC9B,MAAM,uBAAuB,CAAC;AAG/B,OAAO,EACL,wBAAwB,EACxB,KAAK,6BAA6B,GACnC,MAAM,4BAA4B,CAAC;AACpC,OAAO,EACL,sBAAsB,EACtB,KAAK,2BAA2B,GACjC,MAAM,0BAA0B,CAAC;AAClC,OAAO,EACL,qBAAqB,EACrB,KAAK,0BAA0B,GAChC,MAAM,yBAAyB,CAAC;AAIjC,OAAO,EACL,mBAAmB,EACnB,KAAK,wBAAwB,GAC9B,MAAM,uBAAuB,CAAC;AAI/B,OAAO,EACL,mBAAmB,EACnB,sBAAsB,EACtB,KAAK,wBAAwB,EAC7B,KAAK,gBAAgB,GACtB,MAAM,uBAAuB,CAAC"}
|
|
@@ -19,6 +19,10 @@
|
|
|
19
19
|
export { DropdownMenu } from "./DropdownMenu.js";
|
|
20
20
|
export { DropdownMenuItem } from "./DropdownMenuItem.js";
|
|
21
21
|
|
|
22
|
+
// Divider — the compound peer of the data API's `{type: 'divider'}`. Both
|
|
23
|
+
// modes render this component, so they cannot drift.
|
|
24
|
+
export { DropdownMenuDivider } from "./DropdownMenuDivider.js";
|
|
25
|
+
|
|
22
26
|
// Selectable items — checkbox (independent) and radio (single-select group).
|
|
23
27
|
export { DropdownMenuCheckboxItem } from "./DropdownMenuCheckboxItem.js";
|
|
24
28
|
export { DropdownMenuRadioGroup } from "./DropdownMenuRadioGroup.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"renderDropdownItems.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/renderDropdownItems.tsx"],"names":[],"mappings":"AAEA;;;;GAIG;AAEH,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"renderDropdownItems.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/renderDropdownItems.tsx"],"names":[],"mappings":"AAEA;;;;GAIG;AAEH,OAAO,KAAK,EAAe,SAAS,EAAC,MAAM,OAAO,CAAC;AAYnD,OAAO,KAAK,EAEV,kBAAkB,EAEnB,MAAM,gBAAgB,CAAC;AA8CxB;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,kBAAkB,EAAE,GAAG,SAAS,CAkD1E"}
|
|
@@ -7,24 +7,45 @@
|
|
|
7
7
|
*/
|
|
8
8
|
|
|
9
9
|
import * as stylex from '@stylexjs/stylex';
|
|
10
|
-
import { Divider } from "../Divider/index.js";
|
|
11
10
|
import { DropdownMenuItem } from "./DropdownMenuItem.js";
|
|
11
|
+
import { DropdownMenuDivider } from "./DropdownMenuDivider.js";
|
|
12
12
|
import { DropdownMenuSubMenu } from "./DropdownMenuSubMenu.js";
|
|
13
13
|
import "../theme/tokens.stylex.js";
|
|
14
14
|
import { spacingVars, typographyVars, typeScaleVars, colorVars } from "../theme/tokens.stylex.js";
|
|
15
15
|
import { mergeProps, themeProps } from "../utils/index.js";
|
|
16
16
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
kqGvvJ: "xsq74q5",
|
|
20
|
-
$$css: true
|
|
21
|
-
}
|
|
22
|
-
};
|
|
23
|
-
function getItemKey(item) {
|
|
24
|
-
return `item-${item.label}`;
|
|
17
|
+
function getItemKey(item, index) {
|
|
18
|
+
return `item-${item.id ?? index}`;
|
|
25
19
|
}
|
|
26
20
|
function getSectionKey(section, index) {
|
|
27
|
-
return `section-${section.
|
|
21
|
+
return `section-${section.id ?? index}`;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
/**
|
|
25
|
+
* Renders one leaf row as a `DropdownMenuItem`.
|
|
26
|
+
*
|
|
27
|
+
* Keyed by `item.id` when the caller supplies one, else by position. NOT by
|
|
28
|
+
* label: an item that reports its own result (a copy row swapping to "Copied")
|
|
29
|
+
* would change key mid-interaction, remounting the row and dropping keyboard
|
|
30
|
+
* focus. Position is the safe default because a menu's rows are usually fixed;
|
|
31
|
+
* a menu whose items reorder or filter needs `id` for the same reason.
|
|
32
|
+
*
|
|
33
|
+
* `items` selects the submenu shape rather than being an item prop, and `id` is
|
|
34
|
+
* identity for React rather than something `DropdownMenuItem` renders, so both
|
|
35
|
+
* are stripped. Every remaining field of `DropdownMenuItemData` is a
|
|
36
|
+
* `DropdownMenuItem` prop by construction (the type is `Pick`ed from
|
|
37
|
+
* `DropdownMenuItemProps`), so the data path forwards them wholesale and can't
|
|
38
|
+
* silently drop a field the data API advertises.
|
|
39
|
+
*/
|
|
40
|
+
function renderLeafItem(item, index) {
|
|
41
|
+
const {
|
|
42
|
+
items: _submenuItems,
|
|
43
|
+
id: _id,
|
|
44
|
+
...itemProps
|
|
45
|
+
} = item;
|
|
46
|
+
return /*#__PURE__*/_jsx(DropdownMenuItem, {
|
|
47
|
+
...itemProps
|
|
48
|
+
}, getItemKey(item, index));
|
|
28
49
|
}
|
|
29
50
|
|
|
30
51
|
/**
|
|
@@ -36,10 +57,7 @@ export function renderDropdownItems(items) {
|
|
|
36
57
|
for (let i = 0; i < items.length; i++) {
|
|
37
58
|
const option = items[i];
|
|
38
59
|
if ('type' in option && option.type === 'divider') {
|
|
39
|
-
elements.push(/*#__PURE__*/_jsx(
|
|
40
|
-
xstyle: styles.divider,
|
|
41
|
-
...themeProps('dropdown-menu-divider')
|
|
42
|
-
}, `divider-${i}`));
|
|
60
|
+
elements.push(/*#__PURE__*/_jsx(DropdownMenuDivider, {}, `divider-${i}`));
|
|
43
61
|
} else if ('type' in option && option.type === 'section') {
|
|
44
62
|
elements.push(/*#__PURE__*/_jsxs("div", {
|
|
45
63
|
role: "group",
|
|
@@ -50,12 +68,7 @@ export function renderDropdownItems(items) {
|
|
|
50
68
|
className: "xu0wf1k xf314gf x9ynric x141an7d x1ltkj2j xv1l7n4 x87ps6o"
|
|
51
69
|
}),
|
|
52
70
|
children: option.title
|
|
53
|
-
}), option.items.map(
|
|
54
|
-
icon: item.icon,
|
|
55
|
-
label: item.label,
|
|
56
|
-
onClick: item.onClick,
|
|
57
|
-
isDisabled: item.isDisabled
|
|
58
|
-
}, getItemKey(item)))]
|
|
71
|
+
}), option.items.map(renderLeafItem)]
|
|
59
72
|
}, getSectionKey(option, i)));
|
|
60
73
|
} else if (!('type' in option)) {
|
|
61
74
|
// A plain item that declares nested `items` becomes a submenu (data-mode
|
|
@@ -69,14 +82,9 @@ export function renderDropdownItems(items) {
|
|
|
69
82
|
label: option.label,
|
|
70
83
|
isDisabled: option.isDisabled,
|
|
71
84
|
children: renderDropdownItems(option.items)
|
|
72
|
-
}, getItemKey(option)));
|
|
85
|
+
}, getItemKey(option, i)));
|
|
73
86
|
} else {
|
|
74
|
-
elements.push(
|
|
75
|
-
icon: option.icon,
|
|
76
|
-
label: option.label,
|
|
77
|
-
onClick: option.onClick,
|
|
78
|
-
isDisabled: option.isDisabled
|
|
79
|
-
}, getItemKey(option)));
|
|
87
|
+
elements.push(renderLeafItem(option, i));
|
|
80
88
|
}
|
|
81
89
|
}
|
|
82
90
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../src/EmptyState/EmptyState.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAgB,MAAM,OAAO,CAAC;AAQpD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA4D5C,MAAM,WAAW,eAAgB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACrC;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,OAAO,EACP,YAAgB,EAChB,SAAiB,EACjB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,eAAe,+
|
|
1
|
+
{"version":3,"file":"EmptyState.d.ts","sourceRoot":"","sources":["../../src/EmptyState/EmptyState.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAC,KAAK,SAAS,EAAgB,MAAM,OAAO,CAAC;AAQpD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA4D5C,MAAM,WAAW,eAAgB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACrC;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,UAAU,CAAC,EACzB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,OAAO,EACP,YAAgB,EAChB,SAAiB,EACjB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,eAAe,+BAwDjB;yBApEe,UAAU"}
|
|
@@ -77,11 +77,11 @@ export function EmptyState({
|
|
|
77
77
|
const HeadingTag = `h${headingLevel}`;
|
|
78
78
|
return /*#__PURE__*/_jsxs("div", {
|
|
79
79
|
ref: ref,
|
|
80
|
+
...props,
|
|
80
81
|
role: "status",
|
|
81
82
|
...mergeProps(themeProps('empty-state', {
|
|
82
83
|
variant: isCompact ? 'compact' : null
|
|
83
84
|
}), stylex.props(styles.container, isCompact && styles.containerCompact, xstyle), className, style),
|
|
84
|
-
...props,
|
|
85
85
|
children: [icon != null && /*#__PURE__*/_jsx("div", {
|
|
86
86
|
"aria-hidden": "true",
|
|
87
87
|
children: icon
|
|
@@ -89,28 +89,32 @@ export function EmptyState({
|
|
|
89
89
|
...{
|
|
90
90
|
className: "x78zum5 xdt5ytf x6s0dn4 xxc7z9f"
|
|
91
91
|
},
|
|
92
|
-
children: [/*#__PURE__*/createElement(HeadingTag, {
|
|
92
|
+
children: [/*#__PURE__*/createElement(HeadingTag, mergeProps(themeProps('empty-state-title', {
|
|
93
|
+
variant: isCompact ? 'compact' : null
|
|
94
|
+
}), {
|
|
93
95
|
0: {
|
|
94
96
|
className: "x1ghz6dp xjb2p0i x18juvz8 x2mo6ok xf74fhv x1tgivj0"
|
|
95
97
|
},
|
|
96
98
|
1: {
|
|
97
99
|
className: "x1ghz6dp xjb2p0i x2mo6ok xf74fhv x1tgivj0 xcr08ib"
|
|
98
100
|
}
|
|
99
|
-
}[!!isCompact << 0], title), description != null &&
|
|
101
|
+
}[!!isCompact << 0]), title), description != null &&
|
|
100
102
|
/*#__PURE__*/
|
|
101
103
|
// Rendered as <div> (not <p>): description accepts ReactNode and a
|
|
102
104
|
// <p> cannot legally contain block children, which causes hydration
|
|
103
105
|
// mismatches. The StyleX style sets margin: 0, so appearance is
|
|
104
106
|
// unchanged.
|
|
105
107
|
_jsx("div", {
|
|
106
|
-
...{
|
|
108
|
+
...mergeProps(themeProps('empty-state-description', {
|
|
109
|
+
variant: isCompact ? 'compact' : null
|
|
110
|
+
}), {
|
|
107
111
|
0: {
|
|
108
112
|
className: "x1ghz6dp xjb2p0i xjm74w1 x1sodnla xw6l6zx xv1l7n4"
|
|
109
113
|
},
|
|
110
114
|
1: {
|
|
111
115
|
className: "x1ghz6dp xjb2p0i x1sodnla xw6l6zx xv1l7n4 x141an7d"
|
|
112
116
|
}
|
|
113
|
-
}[!!isCompact << 0],
|
|
117
|
+
}[!!isCompact << 0]),
|
|
114
118
|
children: description
|
|
115
119
|
})]
|
|
116
120
|
}), actions != null && /*#__PURE__*/_jsx("div", {
|
|
@@ -1,8 +1,13 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @file InputClearButton.tsx
|
|
3
3
|
* @input Uses React, Button, Icon
|
|
4
|
-
* @output Exports InputClearButton shared clear button
|
|
5
|
-
*
|
|
4
|
+
* @output Exports InputClearButton, the shared clear (✕) button rendered by
|
|
5
|
+
* every clearable input in the family.
|
|
6
|
+
* @position Shared primitive. Every input that renders a clear affordance —
|
|
7
|
+
* TextInput, NumberInput, TimeInput, DateInput, DateTimeInput,
|
|
8
|
+
* DateRangeInput, Selector, MultiSelector, Typeahead, Tokenizer, FileInput —
|
|
9
|
+
* routes it through here, so the glyph is themed in one place via the
|
|
10
|
+
* `astryx-input-clear-icon` target.
|
|
6
11
|
*/
|
|
7
12
|
import type { ReactNode } from 'react';
|
|
8
13
|
import * as stylex from '@stylexjs/stylex';
|
|
@@ -10,8 +15,16 @@ export interface InputClearButtonProps {
|
|
|
10
15
|
label: string;
|
|
11
16
|
onClick: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
|
12
17
|
xstyle?: stylex.StyleXStyles;
|
|
18
|
+
/**
|
|
19
|
+
* Extra class(es) for the clear glyph itself, merged onto the shared
|
|
20
|
+
* `astryx-input-clear-icon` target. Used by inputs that shipped a
|
|
21
|
+
* component-specific clear-icon target before the family converged here
|
|
22
|
+
* (e.g. `astryx-date-input-clear-icon`) to keep emitting it for a
|
|
23
|
+
* deprecation window; new callers don't need it.
|
|
24
|
+
*/
|
|
25
|
+
iconClassName?: string;
|
|
13
26
|
}
|
|
14
|
-
export declare function InputClearButton({ label, onClick, xstyle, }: InputClearButtonProps): ReactNode;
|
|
27
|
+
export declare function InputClearButton({ label, onClick, xstyle, iconClassName, }: InputClearButtonProps): ReactNode;
|
|
15
28
|
export declare namespace InputClearButton {
|
|
16
29
|
var displayName: string;
|
|
17
30
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InputClearButton.d.ts","sourceRoot":"","sources":["../../src/Field/InputClearButton.tsx"],"names":[],"mappings":"AAIA
|
|
1
|
+
{"version":3,"file":"InputClearButton.d.ts","sourceRoot":"","sources":["../../src/Field/InputClearButton.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAY3C,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC1D,MAAM,CAAC,EAAE,MAAM,CAAC,YAAY,CAAC;IAC7B;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,KAAK,EACL,OAAO,EACP,MAAM,EACN,aAAa,GACd,EAAE,qBAAqB,GAAG,SAAS,CAwBnC;yBA7Be,gBAAgB"}
|
|
@@ -5,12 +5,18 @@
|
|
|
5
5
|
/**
|
|
6
6
|
* @file InputClearButton.tsx
|
|
7
7
|
* @input Uses React, Button, Icon
|
|
8
|
-
* @output Exports InputClearButton shared clear button
|
|
9
|
-
*
|
|
8
|
+
* @output Exports InputClearButton, the shared clear (✕) button rendered by
|
|
9
|
+
* every clearable input in the family.
|
|
10
|
+
* @position Shared primitive. Every input that renders a clear affordance —
|
|
11
|
+
* TextInput, NumberInput, TimeInput, DateInput, DateTimeInput,
|
|
12
|
+
* DateRangeInput, Selector, MultiSelector, Typeahead, Tokenizer, FileInput —
|
|
13
|
+
* routes it through here, so the glyph is themed in one place via the
|
|
14
|
+
* `astryx-input-clear-icon` target.
|
|
10
15
|
*/
|
|
11
16
|
import * as stylex from '@stylexjs/stylex';
|
|
12
17
|
import { Button } from "../Button/index.js";
|
|
13
18
|
import { Icon } from "../Icon/index.js";
|
|
19
|
+
import { themeProps } from "../utils/themeProps.js";
|
|
14
20
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
15
21
|
const styles = {
|
|
16
22
|
button: {
|
|
@@ -22,8 +28,12 @@ const styles = {
|
|
|
22
28
|
export function InputClearButton({
|
|
23
29
|
label,
|
|
24
30
|
onClick,
|
|
25
|
-
xstyle
|
|
31
|
+
xstyle,
|
|
32
|
+
iconClassName
|
|
26
33
|
}) {
|
|
34
|
+
const {
|
|
35
|
+
className: iconTargetClassName
|
|
36
|
+
} = themeProps('input-clear-icon');
|
|
27
37
|
return /*#__PURE__*/_jsx(Button, {
|
|
28
38
|
variant: "ghost",
|
|
29
39
|
size: "sm",
|
|
@@ -31,7 +41,8 @@ export function InputClearButton({
|
|
|
31
41
|
icon: /*#__PURE__*/_jsx(Icon, {
|
|
32
42
|
icon: "close",
|
|
33
43
|
size: "sm",
|
|
34
|
-
color: "
|
|
44
|
+
color: "secondary",
|
|
45
|
+
className: iconClassName != null ? `${iconTargetClassName} ${iconClassName}` : iconTargetClassName
|
|
35
46
|
}),
|
|
36
47
|
onClick: onClick,
|
|
37
48
|
isIconOnly: true,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useHoverCard.d.ts","sourceRoot":"","sources":["../../src/HoverCard/useHoverCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;GAQG;AAEH,OAAO,
|
|
1
|
+
{"version":3,"file":"useHoverCard.d.ts","sourceRoot":"","sources":["../../src/HoverCard/useHoverCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;GAQG;AAEH,OAAO,EAIL,KAAK,SAAS,EACd,KAAK,WAAW,EACjB,MAAM,OAAO,CAAC;AAEf,OAAO,EAEL,KAAK,kBAAkB,EACvB,KAAK,cAAc,EACnB,KAAK,cAAc,EACpB,MAAM,mBAAmB,CAAC;AAgC3B;;GAEG;AACH,MAAM,MAAM,qBAAqB,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEhE,MAAM,WAAW,gBAAgB;IAC/B;;;OAGG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B;;;OAGG;IACH,SAAS,CAAC,EAAE,cAAc,CAAC;IAE3B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,qBAAqB,CAAC;IAErC;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;;;OAMG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;OAKG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IAEpB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAED,MAAM,WAAW,eAAe;IAC9B;;;OAGG;IACH,GAAG,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;IAE9B;;;OAGG;IACH,WAAW,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;IAEtC;;;;OAIG;IACH,cAAc,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;IAEzC;;;OAGG;IACH,QAAQ,EAAE,MAAM,CAAC;IAEjB;;;OAGG;IACH,WAAW,EAAE,MAAM,CAAC;IAEpB;;;;;;;OAOG;IACH,eAAe,EAAE,CACf,QAAQ,EAAE,SAAS,EACnB,KAAK,CAAC,EAAE,IAAI,CAAC,kBAAkB,EAAE,aAAa,CAAC,KAC5C,SAAS,CAAC;IAEf;;OAEG;IACH,IAAI,EAAE,MAAM,IAAI,CAAC;IAEjB;;OAEG;IACH,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB;AAyBD;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,YAAY,CAAC,OAAO,GAAE,gBAAqB,GAAG,eAAe,CAiT5E"}
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
* SYNC: When modified, update:
|
|
12
12
|
* - /packages/core/src/HoverCard/index.ts
|
|
13
13
|
*/
|
|
14
|
-
import { useCallback, useEffect,
|
|
14
|
+
import { useCallback, useEffect, useRef } from 'react';
|
|
15
15
|
import * as stylex from '@stylexjs/stylex';
|
|
16
16
|
import { useLayer } from "../Layer/useLayer.js";
|
|
17
17
|
import { layerAnimations } from "../Layer/layerAnimations.stylex.js";
|
|
@@ -26,20 +26,6 @@ const styles = {
|
|
|
26
26
|
kaIpWk: "x7a53xk",
|
|
27
27
|
kGVxlE: "x14hfi27",
|
|
28
28
|
$$css: true
|
|
29
|
-
},
|
|
30
|
-
marginBlock: {
|
|
31
|
-
keoZOQ: "xcsaf9d",
|
|
32
|
-
k1K539: "x14cgwvg",
|
|
33
|
-
keTefX: "x1lziwak",
|
|
34
|
-
k71WvV: "x14z9mp",
|
|
35
|
-
$$css: true
|
|
36
|
-
},
|
|
37
|
-
marginInline: {
|
|
38
|
-
keoZOQ: "xdj266r",
|
|
39
|
-
k1K539: "xat24cr",
|
|
40
|
-
keTefX: "x11g1kdw",
|
|
41
|
-
k71WvV: "xnur1sd",
|
|
42
|
-
$$css: true
|
|
43
29
|
}
|
|
44
30
|
};
|
|
45
31
|
|
|
@@ -100,15 +86,12 @@ export function useHoverCard(options = {}) {
|
|
|
100
86
|
onShow,
|
|
101
87
|
onHide
|
|
102
88
|
} = options;
|
|
103
|
-
|
|
104
|
-
// Select margin style based on placement axis
|
|
105
|
-
const marginStyle = placement === 'above' || placement === 'below' ? styles.marginBlock : styles.marginInline;
|
|
106
89
|
const layer = useLayer({
|
|
107
90
|
mode: 'context',
|
|
108
91
|
onShow,
|
|
109
92
|
onHide
|
|
110
93
|
});
|
|
111
|
-
const popoverXstyle =
|
|
94
|
+
const popoverXstyle = styles.container;
|
|
112
95
|
const showTimeoutRef = useRef(null);
|
|
113
96
|
const hideTimeoutRef = useRef(null);
|
|
114
97
|
const triggerRef = useRef(null);
|
|
@@ -262,6 +245,7 @@ export function useHoverCard(options = {}) {
|
|
|
262
245
|
const renderProps = {
|
|
263
246
|
placement: renderPlacement,
|
|
264
247
|
alignment: props?.alignment ?? alignment,
|
|
248
|
+
offset: spacingVars['--spacing-1'],
|
|
265
249
|
// A named dialog when a label is provided; otherwise a group. A group
|
|
266
250
|
// may validly be unnamed, an unnamed dialog may not — and hover cards
|
|
267
251
|
// are non-modal, so group is honest semantics without a name.
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import type { IndicatorProps } from './types';
|
|
2
|
+
/**
|
|
3
|
+
* The default single-selection mark: a checkmark when chosen, nothing when not.
|
|
4
|
+
*
|
|
5
|
+
* Decorative and non-interactive — it renders `aria-hidden` and owns no role,
|
|
6
|
+
* state, or focus behavior; the option or row that hosts it keeps all of that.
|
|
7
|
+
*
|
|
8
|
+
* @example
|
|
9
|
+
* ```
|
|
10
|
+
* <CheckIndicator state={isSelected ? 'checked' : 'unchecked'} size="sm" />
|
|
11
|
+
* ```
|
|
12
|
+
*
|
|
13
|
+
* Swap every single-selection mark for a radio:
|
|
14
|
+
*
|
|
15
|
+
* @example
|
|
16
|
+
* ```
|
|
17
|
+
* import {RadioIndicator} from '@astryxdesign/core/Indicator';
|
|
18
|
+
* defineTheme({name: 'brand', indicators: {check: RadioIndicator}});
|
|
19
|
+
* ```
|
|
20
|
+
*/
|
|
21
|
+
export declare function CheckIndicator({ state, size, isDisabled, children, ref, className, style, xstyle, ...rest }: IndicatorProps<'singleSelection'>): import("react").JSX.Element | null;
|
|
22
|
+
export declare namespace CheckIndicator {
|
|
23
|
+
var displayName: string;
|
|
24
|
+
}
|
|
25
|
+
//# sourceMappingURL=CheckIndicator.d.ts.map
|