@astryxdesign/core 0.5.0-canary.8985bb9 → 0.5.0-canary.8bb01b1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/AlertDialog/AlertDialog.d.ts +1 -1
- package/dist/AlertDialog/AlertDialog.d.ts.map +1 -1
- package/dist/AlertDialog/AlertDialog.js +45 -20
- package/dist/AspectRatio/AspectRatio.d.ts +6 -6
- package/dist/AvatarGroup/AvatarGroupOverflow.d.ts.map +1 -1
- package/dist/AvatarGroup/AvatarGroupOverflow.js +2 -2
- package/dist/Badge/Badge.d.ts.map +1 -1
- package/dist/Badge/Badge.js +26 -2
- package/dist/Banner/Banner.d.ts +10 -1
- package/dist/Banner/Banner.d.ts.map +1 -1
- package/dist/Banner/Banner.js +11 -2
- package/dist/Button/Button.d.ts.map +1 -1
- package/dist/Button/Button.js +8 -7
- package/dist/Calendar/Calendar.d.ts +4 -2
- package/dist/Calendar/Calendar.d.ts.map +1 -1
- package/dist/Calendar/Calendar.js +9 -9
- package/dist/Calendar/styles.d.ts +0 -6
- package/dist/Calendar/styles.d.ts.map +1 -1
- package/dist/Calendar/styles.js +0 -2
- package/dist/Card/Card.d.ts +12 -12
- package/dist/Card/Card.d.ts.map +1 -1
- package/dist/Card/Card.js +17 -9
- package/dist/Card/index.d.ts +35 -1
- package/dist/Card/index.d.ts.map +1 -1
- package/dist/Card/index.js +21 -1
- package/dist/CommandPalette/CommandPaletteItem.d.ts.map +1 -1
- package/dist/CommandPalette/CommandPaletteItem.js +2 -7
- package/dist/ComplexSelector/ComplexSelector.d.ts +10 -2
- package/dist/ComplexSelector/ComplexSelector.d.ts.map +1 -1
- package/dist/ComplexSelector/ComplexSelector.js +14 -7
- package/dist/DateInput/TouchDateField.d.ts.map +1 -1
- package/dist/DateInput/TouchDateField.js +47 -21
- package/dist/DateRangeInput/DateRangeInput.d.ts +4 -2
- package/dist/DateRangeInput/DateRangeInput.d.ts.map +1 -1
- package/dist/Dialog/Dialog.d.ts +16 -2
- package/dist/Dialog/Dialog.d.ts.map +1 -1
- package/dist/Dialog/Dialog.js +28 -7
- package/dist/DropdownMenu/DropdownMenu.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenu.js +4 -13
- package/dist/Field/InputClearButton.d.ts +9 -3
- package/dist/Field/InputClearButton.d.ts.map +1 -1
- package/dist/Field/InputClearButton.js +14 -3
- package/dist/Heading/Heading.d.ts.map +1 -1
- package/dist/Heading/Heading.js +0 -1
- package/dist/HoverCard/HoverCard.d.ts.map +1 -1
- package/dist/HoverCard/HoverCard.js +55 -3
- package/dist/HoverCard/useHoverCard.d.ts +4 -1
- package/dist/HoverCard/useHoverCard.d.ts.map +1 -1
- package/dist/Icon/Icon.d.ts +4 -2
- package/dist/Icon/Icon.d.ts.map +1 -1
- package/dist/Icon/defaultIcons.d.ts +3 -2
- package/dist/Icon/defaultIcons.d.ts.map +1 -1
- package/dist/Icon/defaultIcons.js +7 -0
- package/dist/Icon/globalIconRegistry.d.ts +13 -0
- package/dist/Icon/globalIconRegistry.d.ts.map +1 -1
- package/dist/Icon/globalIconRegistry.js +34 -6
- package/dist/Icon/index.d.ts +1 -1
- package/dist/Icon/index.d.ts.map +1 -1
- package/dist/Icon/useIcon.d.ts +5 -2
- package/dist/Icon/useIcon.d.ts.map +1 -1
- package/dist/Icon/useIcon.js +3 -0
- package/dist/Item/Item.d.ts.map +1 -1
- package/dist/Item/Item.js +2 -2
- package/dist/Layer/gestureCounter.d.ts +8 -0
- package/dist/Layer/gestureCounter.d.ts.map +1 -0
- package/dist/Layer/gestureCounter.js +53 -0
- package/dist/Layer/useLayer.d.ts +23 -13
- package/dist/Layer/useLayer.d.ts.map +1 -1
- package/dist/Layer/useLayer.js +128 -8
- package/dist/List/List.d.ts +1 -1
- package/dist/List/List.d.ts.map +1 -1
- package/dist/List/List.js +15 -4
- package/dist/Markdown/Markdown.d.ts +1 -1
- package/dist/Markdown/Markdown.d.ts.map +1 -1
- package/dist/Markdown/Markdown.js +20 -7
- package/dist/Markdown/parser.d.ts.map +1 -1
- package/dist/Markdown/parser.js +5 -3
- package/dist/MetadataList/MetadataListItem.d.ts +1 -1
- package/dist/MetadataList/MetadataListItem.d.ts.map +1 -1
- package/dist/MetadataList/MetadataListItem.js +4 -1
- package/dist/MultiSelector/MultiSelector.d.ts.map +1 -1
- package/dist/MultiSelector/MultiSelector.js +12 -6
- package/dist/MultiSelector/hooks.d.ts +7 -1
- package/dist/MultiSelector/hooks.d.ts.map +1 -1
- package/dist/MultiSelector/hooks.js +3 -2
- package/dist/NavItem/navItemStyles.stylex.d.ts +0 -8
- package/dist/NavItem/navItemStyles.stylex.d.ts.map +1 -1
- package/dist/NavItem/navItemStyles.stylex.js +0 -2
- package/dist/NavMenu/NavHeadingMenu.d.ts +1 -1
- package/dist/NavMenu/NavHeadingMenu.d.ts.map +1 -1
- package/dist/NavMenu/NavHeadingMenu.js +7 -4
- package/dist/NumberInput/NumberInput.d.ts +5 -1
- package/dist/NumberInput/NumberInput.d.ts.map +1 -1
- package/dist/NumberInput/NumberInput.js +80 -101
- package/dist/NumberInput/numberInputCommit.d.ts +34 -0
- package/dist/NumberInput/numberInputCommit.d.ts.map +1 -0
- package/dist/NumberInput/numberInputCommit.js +71 -0
- package/dist/Outline/Outline.d.ts.map +1 -1
- package/dist/Outline/Outline.js +2 -3
- package/dist/OverflowList/OverflowList.d.ts +41 -1
- package/dist/OverflowList/OverflowList.d.ts.map +1 -1
- package/dist/OverflowList/OverflowList.js +43 -2
- package/dist/Popover/Popover.d.ts.map +1 -1
- package/dist/Popover/Popover.js +8 -14
- package/dist/Popover/usePopover.d.ts +15 -41
- package/dist/Popover/usePopover.d.ts.map +1 -1
- package/dist/Popover/usePopover.js +26 -7
- package/dist/PowerSearch/PowerSearchValueEditor.d.ts.map +1 -1
- package/dist/PowerSearch/PowerSearchValueEditor.js +91 -18
- package/dist/Resizable/useResizable.d.ts +19 -1
- package/dist/Resizable/useResizable.d.ts.map +1 -1
- package/dist/Resizable/useResizable.js +101 -37
- package/dist/SelectableCard/SelectableCard.d.ts.map +1 -1
- package/dist/SelectableCard/SelectableCard.js +9 -0
- package/dist/Selector/Selector.d.ts +1 -1
- package/dist/Selector/Selector.d.ts.map +1 -1
- package/dist/Selector/Selector.js +21 -8
- package/dist/Selector/hooks.d.ts +7 -1
- package/dist/Selector/hooks.d.ts.map +1 -1
- package/dist/Selector/hooks.js +3 -2
- package/dist/SideNav/SideNav.d.ts +6 -1
- package/dist/SideNav/SideNav.d.ts.map +1 -1
- package/dist/SideNav/SideNav.js +57 -27
- package/dist/SideNav/SideNavHeading.d.ts.map +1 -1
- package/dist/SideNav/SideNavHeading.js +3 -2
- package/dist/SideNav/SideNavItem.d.ts.map +1 -1
- package/dist/SideNav/SideNavItem.js +4 -5
- package/dist/Spinner/Spinner.d.ts +3 -1
- package/dist/Spinner/Spinner.d.ts.map +1 -1
- package/dist/Spinner/Spinner.js +199 -20
- package/dist/Stepper/Step.d.ts.map +1 -1
- package/dist/Stepper/Step.js +7 -6
- package/dist/Table/plugins/filtering/useTableFiltering.d.ts.map +1 -1
- package/dist/Table/plugins/filtering/useTableFiltering.js +73 -4
- package/dist/Table/plugins/groupedRows/useTableGroupedRows.d.ts +26 -0
- package/dist/Table/plugins/groupedRows/useTableGroupedRows.d.ts.map +1 -1
- package/dist/Table/plugins/groupedRows/useTableGroupedRows.js +34 -3
- package/dist/Table/plugins/selection/useTableSelection.d.ts.map +1 -1
- package/dist/Table/plugins/selection/useTableSelection.js +25 -1
- package/dist/Text/Text.d.ts.map +1 -1
- package/dist/Text/Text.js +0 -1
- package/dist/TextArea/TextArea.d.ts.map +1 -1
- package/dist/TextArea/TextArea.js +7 -7
- package/dist/Timestamp/Timestamp.d.ts +1 -1
- package/dist/Timestamp/Timestamp.d.ts.map +1 -1
- package/dist/Timestamp/Timestamp.js +10 -18
- package/dist/Toast/Toast.d.ts.map +1 -1
- package/dist/Toast/Toast.js +22 -7
- package/dist/Toast/ToastViewport.d.ts +1 -0
- package/dist/Toast/ToastViewport.d.ts.map +1 -1
- package/dist/Toast/ToastViewport.js +47 -13
- package/dist/Token/Token.d.ts +1 -1
- package/dist/Token/Token.d.ts.map +1 -1
- package/dist/Token/Token.js +23 -12
- package/dist/Token/TokenLink.d.ts +1 -1
- package/dist/Token/TokenLink.d.ts.map +1 -1
- package/dist/Token/TokenLink.js +5 -2
- package/dist/Tokenizer/Tokenizer.d.ts +12 -1
- package/dist/Tokenizer/Tokenizer.d.ts.map +1 -1
- package/dist/Tokenizer/Tokenizer.js +31 -21
- package/dist/TopNav/TopNavItem.d.ts.map +1 -1
- package/dist/TopNav/TopNavItem.js +3 -3
- package/dist/TopNav/TopNavMegaMenu.d.ts +1 -1
- package/dist/TopNav/TopNavMegaMenu.d.ts.map +1 -1
- package/dist/TopNav/TopNavMegaMenu.js +30 -9
- package/dist/TopNav/TopNavMegaMenuItem.d.ts.map +1 -1
- package/dist/TopNav/TopNavMegaMenuItem.js +3 -3
- package/dist/TopNav/TopNavMenu.d.ts +1 -1
- package/dist/TopNav/TopNavMenu.d.ts.map +1 -1
- package/dist/TopNav/TopNavMenu.js +21 -6
- package/dist/TreeList/TreeList.d.ts +1 -1
- package/dist/TreeList/TreeList.d.ts.map +1 -1
- package/dist/TreeList/TreeList.js +7 -2
- package/dist/TreeList/TreeListItem.d.ts.map +1 -1
- package/dist/TreeList/TreeListItem.js +2 -2
- package/dist/Typeahead/BaseTypeahead.d.ts +33 -0
- package/dist/Typeahead/BaseTypeahead.d.ts.map +1 -1
- package/dist/Typeahead/BaseTypeahead.js +51 -8
- package/dist/Typeahead/Typeahead.d.ts +8 -1
- package/dist/Typeahead/Typeahead.d.ts.map +1 -1
- package/dist/Typeahead/Typeahead.js +2 -0
- package/dist/Typeahead/TypeaheadItem.d.ts +1 -1
- package/dist/Typeahead/TypeaheadItem.d.ts.map +1 -1
- package/dist/Typeahead/TypeaheadItem.js +7 -2
- package/dist/astryx.css +52 -17
- package/dist/hooks/useOverflow.d.ts.map +1 -1
- package/dist/hooks/useOverflow.js +14 -4
- package/dist/theme/Theme.d.ts.map +1 -1
- package/dist/theme/Theme.js +46 -10
- package/dist/theme/defineTheme.d.ts +9 -3
- package/dist/theme/defineTheme.d.ts.map +1 -1
- package/dist/theme/defineTheme.js +5 -0
- package/dist/theme/generateThemeRules.d.ts +21 -0
- package/dist/theme/generateThemeRules.d.ts.map +1 -1
- package/dist/theme/generateThemeRules.js +26 -0
- package/dist/utils/interactionOverlay.stylex.d.ts +26 -0
- package/dist/utils/interactionOverlay.stylex.d.ts.map +1 -0
- package/dist/utils/interactionOverlay.stylex.js +42 -0
- package/locales/af-ZA.json +6 -6
- package/locales/ar-SA.json +6 -6
- package/locales/ca-ES.json +5 -5
- package/locales/cs-CZ.json +6 -6
- package/locales/da-DK.json +6 -6
- package/locales/de-DE.json +6 -6
- package/locales/el-GR.json +6 -6
- package/locales/en.json +122 -2
- package/locales/es-ES.json +5 -5
- package/locales/fi-FI.json +6 -6
- package/locales/fr-FR.json +6 -6
- package/locales/he-IL.json +6 -6
- package/locales/hu-HU.json +6 -6
- package/locales/it-IT.json +6 -6
- package/locales/ja-JP.json +6 -6
- package/locales/ko-KR.json +6 -6
- package/locales/nl-NL.json +6 -6
- package/locales/no-NO.json +6 -6
- package/locales/pl-PL.json +6 -6
- package/locales/pseudo.json +90 -0
- package/locales/pt-BR.json +6 -6
- package/locales/pt-PT.json +6 -6
- package/locales/ro-RO.json +6 -6
- package/locales/ru-RU.json +6 -6
- package/locales/sr-SP.json +6 -6
- package/locales/sv-SE.json +6 -6
- package/locales/tr-TR.json +6 -6
- package/locales/uk-UA.json +6 -6
- package/locales/vi-VN.json +6 -6
- package/locales/zh-CN.json +6 -6
- package/locales/zh-TW.json +6 -6
- package/package.json +2 -2
- package/src/AlertDialog/AlertDialog.doc.mjs +114 -30
- package/src/AlertDialog/AlertDialog.test.tsx +211 -2
- package/src/AlertDialog/AlertDialog.tsx +62 -20
- package/src/AspectRatio/AspectRatio.doc.mjs +3 -3
- package/src/AspectRatio/AspectRatio.tsx +6 -6
- package/src/AvatarGroup/AvatarGroupOverflow.tsx +2 -8
- package/src/Badge/Badge.doc.mjs +3 -2
- package/src/Badge/Badge.test.tsx +32 -3
- package/src/Badge/Badge.tsx +42 -1
- package/src/Banner/Banner.doc.mjs +9 -0
- package/src/Banner/Banner.test.tsx +76 -11
- package/src/Banner/Banner.tsx +21 -2
- package/src/Button/Button.doc.mjs +2 -1
- package/src/Button/Button.test.tsx +19 -4
- package/src/Button/Button.tsx +9 -29
- package/src/ButtonGroup/ButtonGroup.doc.mjs +2 -2
- package/src/ButtonGroup/ButtonGroup.test.tsx +13 -0
- package/src/Calendar/Calendar.doc.mjs +3 -3
- package/src/Calendar/Calendar.test.tsx +40 -0
- package/src/Calendar/Calendar.tsx +13 -10
- package/src/Calendar/styles.ts +0 -12
- package/src/Card/Card.doc.mjs +10 -7
- package/src/Card/Card.test.tsx +113 -19
- package/src/Card/Card.tsx +67 -89
- package/src/Card/index.ts +36 -1
- package/src/CommandPalette/CommandPaletteItem.tsx +2 -12
- package/src/ComplexSelector/ComplexSelector.doc.mjs +7 -0
- package/src/ComplexSelector/ComplexSelector.test.tsx +183 -0
- package/src/ComplexSelector/ComplexSelector.tsx +22 -12
- package/src/DateInput/DateInput.doc.mjs +2 -2
- package/src/DateInput/DateInputTouch.test.tsx +85 -30
- package/src/DateInput/TouchDateField.tsx +77 -30
- package/src/DateRangeInput/DateRangeInput.doc.mjs +2 -2
- package/src/DateRangeInput/DateRangeInput.test.tsx +22 -0
- package/src/DateRangeInput/DateRangeInput.tsx +4 -2
- package/src/Dialog/Dialog.test.tsx +185 -18
- package/src/Dialog/Dialog.tsx +35 -11
- package/src/DropdownMenu/DropdownMenu.test.tsx +44 -10
- package/src/DropdownMenu/DropdownMenu.tsx +4 -13
- package/src/Field/InputClearButton.test.tsx +15 -1
- package/src/Field/InputClearButton.tsx +28 -4
- package/src/Heading/Heading.tsx +0 -1
- package/src/HoverCard/HoverCard.test.tsx +54 -1
- package/src/HoverCard/HoverCard.tsx +74 -2
- package/src/HoverCard/useHoverCard.tsx +4 -1
- package/src/Icon/Icon.test.tsx +55 -1
- package/src/Icon/Icon.tsx +5 -3
- package/src/Icon/defaultIcons.tsx +11 -2
- package/src/Icon/globalIconRegistry.test.tsx +16 -3
- package/src/Icon/globalIconRegistry.tsx +37 -6
- package/src/Icon/index.ts +1 -0
- package/src/Icon/useIcon.ts +9 -2
- package/src/Item/Item.tsx +2 -7
- package/src/Layer/gestureCounter.ts +57 -0
- package/src/Layer/useLayer.test.tsx +324 -15
- package/src/Layer/useLayer.tsx +164 -8
- package/src/Layout/__tests__/edgeCompensation.test.tsx +1 -1
- package/src/List/List.test.tsx +38 -0
- package/src/List/List.tsx +8 -1
- package/src/Markdown/Markdown.test.tsx +37 -0
- package/src/Markdown/Markdown.tsx +16 -5
- package/src/Markdown/parser.test.ts +33 -0
- package/src/Markdown/parser.ts +9 -3
- package/src/MetadataList/MetadataList.test.tsx +75 -2
- package/src/MetadataList/MetadataListItem.tsx +5 -2
- package/src/MultiSelector/MultiSelector.test.tsx +34 -0
- package/src/MultiSelector/MultiSelector.tsx +11 -11
- package/src/MultiSelector/hooks.ts +9 -2
- package/src/NavItem/navItemStyles.stylex.ts +0 -8
- package/src/NavMenu/NavHeadingMenu.test.tsx +30 -0
- package/src/NavMenu/NavHeadingMenu.tsx +7 -4
- package/src/NumberInput/NumberInput.doc.mjs +11 -7
- package/src/NumberInput/NumberInput.test.tsx +563 -8
- package/src/NumberInput/NumberInput.tsx +63 -116
- package/src/NumberInput/numberInputCommit.test.ts +72 -0
- package/src/NumberInput/numberInputCommit.ts +103 -0
- package/src/Outline/Outline.tsx +2 -4
- package/src/OverflowList/OverflowList.doc.mjs +102 -21
- package/src/OverflowList/OverflowList.test.tsx +550 -4
- package/src/OverflowList/OverflowList.tsx +100 -2
- package/src/Pagination/Pagination.test.tsx +3 -2
- package/src/Popover/Popover.doc.mjs +2 -2
- package/src/Popover/Popover.test.tsx +38 -0
- package/src/Popover/Popover.tsx +28 -66
- package/src/Popover/usePopover.tsx +44 -5
- package/src/PowerSearch/PowerSearchEditPopover.test.tsx +87 -0
- package/src/PowerSearch/PowerSearchValueEditor.test.tsx +64 -0
- package/src/PowerSearch/PowerSearchValueEditor.tsx +109 -10
- package/src/Resizable/Resizable.doc.mjs +2 -2
- package/src/Resizable/useResizable.doc.mjs +21 -2
- package/src/Resizable/useResizable.test.ts +402 -0
- package/src/Resizable/useResizable.ts +130 -47
- package/src/SelectableCard/SelectableCard.doc.mjs +3 -0
- package/src/SelectableCard/SelectableCard.tsx +16 -0
- package/src/Selector/Selector.source-build.test.mjs +65 -0
- package/src/Selector/Selector.test.tsx +84 -0
- package/src/Selector/Selector.tsx +22 -18
- package/src/Selector/hooks.ts +17 -2
- package/src/SideNav/SideNav.doc.mjs +2 -2
- package/src/SideNav/SideNav.test.tsx +364 -1
- package/src/SideNav/SideNav.tsx +109 -38
- package/src/SideNav/SideNavHeading.tsx +3 -0
- package/src/SideNav/SideNavItem.tsx +7 -9
- package/src/Spinner/Spinner.doc.mjs +17 -5
- package/src/Spinner/Spinner.test.tsx +164 -0
- package/src/Spinner/Spinner.tsx +252 -22
- package/src/Stepper/Step.doc.mjs +1 -1
- package/src/Stepper/Step.tsx +7 -14
- package/src/Table/Table.doc.mjs +2 -2
- package/src/Table/TableBody.doc.mjs +2 -2
- package/src/Table/TableFooter.doc.mjs +1 -1
- package/src/Table/TableHeader.doc.mjs +1 -1
- package/src/Table/plugins/filtering/useTableFiltering.test.tsx +44 -6
- package/src/Table/plugins/filtering/useTableFiltering.tsx +100 -4
- package/src/Table/plugins/groupedRows/useTableGroupedRows.tsx +50 -4
- package/src/Table/plugins/selection/useTableSelection.test.tsx +62 -0
- package/src/Table/plugins/selection/useTableSelection.tsx +25 -2
- package/src/Table/useTableGroupedRows.doc.mjs +3 -3
- package/src/Table/useTablePagination.doc.mjs +1 -1
- package/src/Table/useTableSelection.doc.mjs +1 -1
- package/src/Text/Text.test.tsx +44 -0
- package/src/Text/Text.tsx +0 -1
- package/src/TextArea/TextArea.doc.mjs +4 -0
- package/src/TextArea/TextArea.tsx +22 -16
- package/src/Timestamp/Timestamp.test.tsx +58 -0
- package/src/Timestamp/Timestamp.tsx +8 -8
- package/src/Toast/Toast.doc.mjs +20 -12
- package/src/Toast/Toast.tsx +28 -4
- package/src/Toast/ToastViewport.test.tsx +536 -8
- package/src/Toast/ToastViewport.tsx +72 -19
- package/src/Token/Token.test.tsx +95 -0
- package/src/Token/Token.tsx +19 -17
- package/src/Token/TokenLink.tsx +12 -3
- package/src/Tokenizer/Tokenizer.doc.mjs +16 -3
- package/src/Tokenizer/Tokenizer.test.tsx +161 -0
- package/src/Tokenizer/Tokenizer.tsx +49 -24
- package/src/TopNav/TopNavItem.tsx +3 -7
- package/src/TopNav/TopNavMegaMenu.test.tsx +104 -0
- package/src/TopNav/TopNavMegaMenu.tsx +47 -4
- package/src/TopNav/TopNavMegaMenuItem.tsx +10 -9
- package/src/TopNav/TopNavMenu.test.tsx +133 -1
- package/src/TopNav/TopNavMenu.tsx +38 -5
- package/src/TreeList/TreeList.test.tsx +49 -0
- package/src/TreeList/TreeList.tsx +7 -2
- package/src/TreeList/TreeListItem.tsx +2 -7
- package/src/Typeahead/BaseTypeahead.doc.mjs +13 -0
- package/src/Typeahead/BaseTypeahead.tsx +96 -6
- package/src/Typeahead/Typeahead.doc.mjs +6 -0
- package/src/Typeahead/Typeahead.test.tsx +154 -0
- package/src/Typeahead/Typeahead.tsx +9 -0
- package/src/Typeahead/TypeaheadItem.test.tsx +43 -0
- package/src/Typeahead/TypeaheadItem.tsx +8 -1
- package/src/hooks/useAnnounce.doc.mjs +96 -0
- package/src/hooks/useDevWarning.doc.mjs +96 -0
- package/src/hooks/useIndicatorFocusRing.doc.mjs +104 -0
- package/src/hooks/useInputStatusIcon.doc.mjs +142 -0
- package/src/hooks/useInteractiveRole.doc.mjs +119 -0
- package/src/hooks/useLongPress.doc.mjs +123 -0
- package/src/hooks/useOverflow.doc.mjs +58 -17
- package/src/hooks/useOverflow.ts +16 -4
- package/src/hooks/useTypeahead.doc.mjs +153 -0
- package/src/theme/Theme.test.tsx +104 -2
- package/src/theme/Theme.tsx +49 -14
- package/src/theme/defineTheme.test.ts +23 -0
- package/src/theme/defineTheme.ts +12 -3
- package/src/theme/derivedVarRegistry.test.ts +64 -0
- package/src/theme/generateThemeRules.test.ts +62 -1
- package/src/theme/generateThemeRules.ts +28 -0
- package/src/utils/interactionOverlay.stylex.ts +74 -0
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @file AlertDialog.tsx
|
|
3
|
-
* @input Uses React, Dialog, Layout, Heading, Text, Button
|
|
3
|
+
* @input Uses React, StyleX, Dialog, Layout, Heading, Text, Button
|
|
4
4
|
* @output Exports AlertDialog component, AlertDialogProps type
|
|
5
5
|
* @position Core implementation; consumed by index.ts, tested by AlertDialog.test.tsx
|
|
6
6
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AlertDialog.d.ts","sourceRoot":"","sources":["../../src/AlertDialog/AlertDialog.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAA2B,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"AlertDialog.d.ts","sourceRoot":"","sources":["../../src/AlertDialog/AlertDialog.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAA2B,MAAM,OAAO,CAAC;AAShD,OAAO,EAAS,KAAK,aAAa,EAAC,MAAM,WAAW,CAAC;AACrD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAkB5C,MAAM,WAAW,gBAAiB,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IACpE,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAEhB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,OAAO,CAAC;IAE3C;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IAEpB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC;IAE9B;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;OAGG;IACH,QAAQ,EAAE,MAAM,OAAO,CAAC;IAExB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CACzB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,WAAW,CAAC,EAC1B,GAAG,EACH,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,KAAK,EACL,WAAW,EACX,WAAW,EAAE,oBAAoB,EACjC,WAAW,EACX,aAA6B,EAC7B,eAAe,EACf,QAAQ,EACR,KAAW,EACX,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,IAAI,EACR,EAAE,gBAAgB,qBA8FlB;yBAhHe,WAAW"}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* @file AlertDialog.tsx
|
|
7
|
-
* @input Uses React, Dialog, Layout, Heading, Text, Button
|
|
7
|
+
* @input Uses React, StyleX, Dialog, Layout, Heading, Text, Button
|
|
8
8
|
* @output Exports AlertDialog component, AlertDialogProps type
|
|
9
9
|
* @position Core implementation; consumed by index.ts, tested by AlertDialog.test.tsx
|
|
10
10
|
*
|
|
@@ -16,18 +16,32 @@
|
|
|
16
16
|
* - /packages/cli/assets/templates/blocks/components/AlertDialog/ (showcase blocks)
|
|
17
17
|
*/
|
|
18
18
|
import React, { useId, useCallback } from 'react';
|
|
19
|
+
import * as stylex from '@stylexjs/stylex';
|
|
19
20
|
import { Dialog } from "../Dialog/index.js";
|
|
20
21
|
import { Layout } from "../Layout/Layout.js";
|
|
21
22
|
import { LayoutContent } from "../Layout/LayoutContent.js";
|
|
22
23
|
import { LayoutFooter } from "../Layout/LayoutFooter.js";
|
|
23
|
-
import {
|
|
24
|
+
import { Stack } from "../Stack/index.js";
|
|
24
25
|
import { Heading } from "../Heading/Heading.js";
|
|
25
26
|
import { Text } from "../Text/Text.js";
|
|
26
27
|
import { Button } from "../Button/index.js";
|
|
27
28
|
import { mergeProps } from "../utils/index.js";
|
|
28
29
|
import { themeProps } from "../utils/themeProps.js";
|
|
29
30
|
import { useTranslator } from "../i18n/index.js";
|
|
31
|
+
import { useMediaQuery } from "../hooks/index.js";
|
|
30
32
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
33
|
+
const SMALL_SCREEN_QUERY = '(max-width: 640px)';
|
|
34
|
+
const styles = {
|
|
35
|
+
action: {
|
|
36
|
+
ks0D6T: "x193iq5w",
|
|
37
|
+
k7Eaqz: "xeuugli",
|
|
38
|
+
$$css: true
|
|
39
|
+
},
|
|
40
|
+
stackedAction: {
|
|
41
|
+
kzqmXN: "xh8yej3",
|
|
42
|
+
$$css: true
|
|
43
|
+
}
|
|
44
|
+
};
|
|
31
45
|
/**
|
|
32
46
|
* A confirmation dialog for destructive or irreversible actions.
|
|
33
47
|
*
|
|
@@ -77,9 +91,33 @@ export function AlertDialog({
|
|
|
77
91
|
const cancelLabel = cancelLabelFromProps ?? t('@astryx.alertDialog.cancel');
|
|
78
92
|
const titleId = useId();
|
|
79
93
|
const descriptionId = useId();
|
|
94
|
+
// Width stays delegated to Dialog: this query exists only so AlertDialog can
|
|
95
|
+
// keep narrow visual, DOM, and tab order aligned for its destructive/cancel
|
|
96
|
+
// semantics without coupling action order to pointer or hover capability.
|
|
97
|
+
const isSmallScreen = useMediaQuery(SMALL_SCREEN_QUERY);
|
|
80
98
|
const handleCancel = useCallback(() => {
|
|
81
99
|
onOpenChange(false);
|
|
82
100
|
}, [onOpenChange]);
|
|
101
|
+
const buttonActionStyle = [styles.action, isSmallScreen && styles.stackedAction];
|
|
102
|
+
const cancelButton = /*#__PURE__*/_jsx(Button, {
|
|
103
|
+
variant: "ghost",
|
|
104
|
+
label: cancelLabel,
|
|
105
|
+
onClick: handleCancel,
|
|
106
|
+
xstyle: buttonActionStyle
|
|
107
|
+
// Dialog focuses [data-autofocus] itself after showModal(), because
|
|
108
|
+
// React's autoFocus runs during commit while the dialog is invisible.
|
|
109
|
+
// Cancel is least destructive, so it remains the autofocus target even
|
|
110
|
+
// when small-screen visual order places the destructive action above it.
|
|
111
|
+
,
|
|
112
|
+
"data-autofocus": true
|
|
113
|
+
}, "cancel");
|
|
114
|
+
const actionButton = /*#__PURE__*/_jsx(Button, {
|
|
115
|
+
variant: actionVariant,
|
|
116
|
+
label: actionLabel,
|
|
117
|
+
onClick: onAction,
|
|
118
|
+
isLoading: isActionLoading,
|
|
119
|
+
xstyle: buttonActionStyle
|
|
120
|
+
}, "action");
|
|
83
121
|
return /*#__PURE__*/_jsx(Dialog, {
|
|
84
122
|
...rest,
|
|
85
123
|
ref: ref,
|
|
@@ -117,25 +155,12 @@ export function AlertDialog({
|
|
|
117
155
|
})]
|
|
118
156
|
}),
|
|
119
157
|
footer: /*#__PURE__*/_jsx(LayoutFooter, {
|
|
120
|
-
children: /*#__PURE__*/
|
|
158
|
+
children: /*#__PURE__*/_jsx(Stack, {
|
|
159
|
+
direction: isSmallScreen ? 'vertical' : 'horizontal',
|
|
121
160
|
gap: 2,
|
|
122
|
-
hAlign:
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
label: cancelLabel,
|
|
126
|
-
onClick: handleCancel
|
|
127
|
-
// Dialog focuses [data-autofocus] itself after showModal(),
|
|
128
|
-
// because React's autoFocus runs during commit while the
|
|
129
|
-
// dialog is still invisible. Cancel is the least destructive
|
|
130
|
-
// choice, so it is the one that should be preselected.
|
|
131
|
-
,
|
|
132
|
-
"data-autofocus": true
|
|
133
|
-
}), /*#__PURE__*/_jsx(Button, {
|
|
134
|
-
variant: actionVariant,
|
|
135
|
-
label: actionLabel,
|
|
136
|
-
onClick: onAction,
|
|
137
|
-
isLoading: isActionLoading
|
|
138
|
-
})]
|
|
161
|
+
hAlign: isSmallScreen ? 'stretch' : 'end',
|
|
162
|
+
wrap: isSmallScreen ? 'nowrap' : 'wrap',
|
|
163
|
+
children: isSmallScreen ? [actionButton, cancelButton] : [cancelButton, actionButton]
|
|
139
164
|
})
|
|
140
165
|
})
|
|
141
166
|
})
|
|
@@ -44,14 +44,14 @@ export interface AspectRatioProps extends BaseProps<HTMLDivElement> {
|
|
|
44
44
|
* `astryx-base` cascade layer, and unlayered CSS wins over layered
|
|
45
45
|
* rules regardless of specificity.
|
|
46
46
|
*
|
|
47
|
+
* A responsive ratio is set in CSS, not on the component. For example, a 3:1
|
|
48
|
+
* hero can become 3:2 when its container narrows by targeting the element's
|
|
49
|
+
* class from a container query:
|
|
50
|
+
* `@container gallery (max-width: 720px) { .gallery-hero { aspect-ratio: 3 / 2; } }`.
|
|
51
|
+
*
|
|
47
52
|
* @example
|
|
48
53
|
* ```
|
|
49
|
-
*
|
|
50
|
-
* <AspectRatio ratio={3 / 1} className="gallery-hero">…</AspectRatio>
|
|
51
|
-
*
|
|
52
|
-
* // CSS: @container gallery (max-width: 720px) {
|
|
53
|
-
* // .gallery-hero { aspect-ratio: 3 / 2; }
|
|
54
|
-
* // }
|
|
54
|
+
* <AspectRatio ratio={3 / 1} className="gallery-hero">...</AspectRatio>
|
|
55
55
|
* ```
|
|
56
56
|
*/
|
|
57
57
|
ratio: number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarGroupOverflow.d.ts","sourceRoot":"","sources":["../../src/AvatarGroup/AvatarGroupOverflow.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAa5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"AvatarGroupOverflow.d.ts","sourceRoot":"","sources":["../../src/AvatarGroup/AvatarGroupOverflow.tsx"],"names":[],"mappings":"AAGA;;;;;;;;;;GAUG;AAEH,OAAO,KAAK,EAAE,EAAC,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAa5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAS5C,MAAM,WAAW,wBAAyB,SAAQ,IAAI,CACpD,SAAS,CAAC,WAAW,CAAC,EACtB,SAAS,CACV;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAC7B;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IAErB;;OAEG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAgFD;;;;;;;;;;;;;GAaG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,GAAG,EACH,KAAK,EACL,OAAO,EACP,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,wBAAwB,GAAG,SAAS,CAmEtC;yBA5Ee,mBAAmB"}
|
|
@@ -22,6 +22,7 @@ import { resolveSize } from "../Avatar/index.js";
|
|
|
22
22
|
import { useAvatarGroup } from "./AvatarGroupContext.js";
|
|
23
23
|
import { themeProps } from "../utils/themeProps.js";
|
|
24
24
|
import { focusOutlineProps } from "../utils/focusOutline.stylex.js";
|
|
25
|
+
import { interactionOverlayStyles } from "../utils/interactionOverlay.stylex.js";
|
|
25
26
|
import { useTranslator } from "../i18n/index.js";
|
|
26
27
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
27
28
|
const BORDER_WIDTH = 2;
|
|
@@ -49,7 +50,6 @@ const styles = {
|
|
|
49
50
|
button: {
|
|
50
51
|
kkrTdU: "x1ypdohk x16khyan",
|
|
51
52
|
k8WAf4: "xt970qd",
|
|
52
|
-
kKwaWg: "x14bno8m x1otsd3y x1nocapi",
|
|
53
53
|
$$css: true
|
|
54
54
|
},
|
|
55
55
|
overlap: {
|
|
@@ -133,7 +133,7 @@ export function AvatarGroupOverflow({
|
|
|
133
133
|
...mergeProps(themeProps('avatar-group-overflow', {
|
|
134
134
|
size,
|
|
135
135
|
shape
|
|
136
|
-
}), focusOutlineProps.focusVisible(styles.base, styles.button, styles.overlap, dynamicStyles.size(numericSize), dynamicStyles.fontSize(numericSize), dynamicStyles.overlap(-overlap), shapeStyles[shape], xstyle), className, style),
|
|
136
|
+
}), focusOutlineProps.focusVisible(styles.base, styles.button, interactionOverlayStyles.backgroundImageOnNeutral, styles.overlap, dynamicStyles.size(numericSize), dynamicStyles.fontSize(numericSize), dynamicStyles.overlap(-overlap), shapeStyles[shape], xstyle), className, style),
|
|
137
137
|
children: content
|
|
138
138
|
});
|
|
139
139
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../src/Badge/Badge.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAW5C,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../src/Badge/Badge.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;;GAYG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAW5C,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,SAAS,CAAC;AA0G7C;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG,MAAM,eAAe,CAAC;AAEjD,MAAM,WAAW,UAAW,SAAQ,SAAS,CAAC,eAAe,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC;;;OAGG;IACH,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IAEjB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;CAClB;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,KAAK,CAAC,EACpB,OAAmB,EACnB,KAAK,EACL,IAAI,EACJ,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,UAAU,+BAsCZ;yBA/Ce,KAAK"}
|
package/dist/Badge/Badge.js
CHANGED
|
@@ -19,7 +19,7 @@ import "../theme/tokens.stylex.js";
|
|
|
19
19
|
import { colorVars, spacingVars, radiusVars, fontWeightVars, typeScaleVars } from "../theme/tokens.stylex.js";
|
|
20
20
|
import { mergeProps } from "../utils/index.js";
|
|
21
21
|
import { themeProps } from "../utils/themeProps.js";
|
|
22
|
-
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
22
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
23
23
|
/**
|
|
24
24
|
* Base badge styles
|
|
25
25
|
*/
|
|
@@ -38,6 +38,8 @@ const styles = {
|
|
|
38
38
|
kLWn49: "x1ltkj2j",
|
|
39
39
|
k63SB2: "x1e4wzip",
|
|
40
40
|
khDVqt: "xuxw1ft",
|
|
41
|
+
ks0D6T: "x193iq5w",
|
|
42
|
+
k7Eaqz: "xeuugli",
|
|
41
43
|
$$css: true
|
|
42
44
|
}
|
|
43
45
|
};
|
|
@@ -148,13 +150,35 @@ export function Badge({
|
|
|
148
150
|
ref,
|
|
149
151
|
...props
|
|
150
152
|
}) {
|
|
153
|
+
// Clipping a label makes its tail unrecoverable, so the full text has to
|
|
154
|
+
// stay reachable somewhere. `title` is the half of that answer which costs
|
|
155
|
+
// nothing: no measurement, no hook, so `Badge` renders the same on the
|
|
156
|
+
// server and stays usable in a server component. It follows the shape
|
|
157
|
+
// `BaseTable` already uses for a truncated header cell (BaseTable.tsx) —
|
|
158
|
+
// string content only, and only when there is something to show.
|
|
159
|
+
//
|
|
160
|
+
// A rich label is left alone: it is a subtree whose text would have to be
|
|
161
|
+
// flattened to a string, and flattening renders a guess — an icon, a
|
|
162
|
+
// `<strong>`, a nested element all read differently.
|
|
163
|
+
//
|
|
164
|
+
// It is set whether or not the label actually fits, because knowing that
|
|
165
|
+
// requires measuring. The refinement — a tooltip only when the text is
|
|
166
|
+
// really cut, reachable by hover and by focus — needs that measurement and
|
|
167
|
+
// a client component, so it is tracked in #5585.
|
|
168
|
+
const labelTitle = typeof label === 'number' ? String(label) : typeof label === 'string' && label.length > 0 ? label : undefined;
|
|
151
169
|
return /*#__PURE__*/_jsxs("span", {
|
|
152
170
|
ref: ref,
|
|
153
171
|
...mergeProps(themeProps('badge', {
|
|
154
172
|
variant
|
|
155
173
|
}), stylex.props(styles.base, variants[variant], xstyle), className, style),
|
|
174
|
+
title: labelTitle,
|
|
156
175
|
...props,
|
|
157
|
-
children: [icon,
|
|
176
|
+
children: [icon, /*#__PURE__*/_jsx("span", {
|
|
177
|
+
...{
|
|
178
|
+
className: "xb3r6kr xlyipyv xeuugli"
|
|
179
|
+
},
|
|
180
|
+
children: label
|
|
181
|
+
})]
|
|
158
182
|
});
|
|
159
183
|
}
|
|
160
184
|
Badge.displayName = 'Badge';
|
package/dist/Banner/Banner.d.ts
CHANGED
|
@@ -86,6 +86,15 @@ export interface BannerProps extends BaseProps<HTMLDivElement> {
|
|
|
86
86
|
* The banner will hide itself regardless of whether this callback is provided.
|
|
87
87
|
*/
|
|
88
88
|
onDismiss?: () => void;
|
|
89
|
+
/**
|
|
90
|
+
* Accessible name and visible tooltip for the dismiss button, replacing the default.
|
|
91
|
+
* Pass an already-translated string.
|
|
92
|
+
*
|
|
93
|
+
* The default is "Dismiss {title}" when `title` is a string, so stacked
|
|
94
|
+
* banners are told apart by a screen reader; a non-string `title` falls back
|
|
95
|
+
* to "Dismiss" and should set this.
|
|
96
|
+
*/
|
|
97
|
+
dismissLabel?: string;
|
|
89
98
|
/**
|
|
90
99
|
* Action button rendered in the header area (end-aligned).
|
|
91
100
|
* Typically an Button with a secondary or ghost variant.
|
|
@@ -191,7 +200,7 @@ export interface BannerProps extends BaseProps<HTMLDivElement> {
|
|
|
191
200
|
* </Banner>
|
|
192
201
|
* ```
|
|
193
202
|
*/
|
|
194
|
-
export declare function Banner({ status, title, description, icon, isDismissable, onDismiss, endContent, container, elevation, collapsible, children, xstyle, className, style, ref, onFocusCapture, onPointerDownCapture, ...rest }: BannerProps): import("react").JSX.Element | null;
|
|
203
|
+
export declare function Banner({ status, title, description, icon, isDismissable, onDismiss, dismissLabel, endContent, container, elevation, collapsible, children, xstyle, className, style, ref, onFocusCapture, onPointerDownCapture, ...rest }: BannerProps): import("react").JSX.Element | null;
|
|
195
204
|
export declare namespace Banner {
|
|
196
205
|
var displayName: string;
|
|
197
206
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../src/Banner/Banner.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AAEH,OAAO,EAA0B,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAE9D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgB5C,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,+BAA+B,CAAC;AAErE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAI9C,OAAO,KAAK,EAAC,eAAe,EAAE,kBAAkB,EAAC,MAAM,SAAS,CAAC;AAMjE;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG,MAAM,eAAe,CAAC;AAEjD;;;;;;GAMG;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,kBAAkB,CAAC;AAEvD,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,MAAM,EAAE,YAAY,CAAC;IACrB;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB;;;;;;;;;;;OAWG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;;;;;;;;;;;;;;;OAkBG;IACH,WAAW,CAAC,EAAE,OAAO,GAAG,iBAAiB,CAAC;IAC1C;;;;OAIG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAmND;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkDG;AACH,wBAAgB,MAAM,CAAC,EACrB,MAAM,EACN,KAAK,EACL,WAAW,EACX,IAAI,EACJ,aAAqB,EACrB,SAAS,EACT,UAAU,EACV,SAAkB,EAClB,SAAkB,EAClB,WAAkB,EAClB,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,cAAc,EACd,oBAAoB,EACpB,GAAG,IAAI,EACR,EAAE,WAAW,
|
|
1
|
+
{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../src/Banner/Banner.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AAEH,OAAO,EAA0B,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAE9D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgB5C,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,+BAA+B,CAAC;AAErE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAI9C,OAAO,KAAK,EAAC,eAAe,EAAE,kBAAkB,EAAC,MAAM,SAAS,CAAC;AAMjE;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG,MAAM,eAAe,CAAC;AAEjD;;;;;;GAMG;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,kBAAkB,CAAC;AAEvD,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC5D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;OAEG;IACH,MAAM,EAAE,YAAY,CAAC;IACrB;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;;;;;;;;OAWG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;;;;;;;;;;;;;;;OAkBG;IACH,WAAW,CAAC,EAAE,OAAO,GAAG,iBAAiB,CAAC;IAC1C;;;;OAIG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAmND;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkDG;AACH,wBAAgB,MAAM,CAAC,EACrB,MAAM,EACN,KAAK,EACL,WAAW,EACX,IAAI,EACJ,aAAqB,EACrB,SAAS,EACT,YAAY,EACZ,UAAU,EACV,SAAkB,EAClB,SAAkB,EAClB,WAAkB,EAClB,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,cAAc,EACd,oBAAoB,EACpB,GAAG,IAAI,EACR,EAAE,WAAW,sCA6Ob;yBAjQe,MAAM"}
|
package/dist/Banner/Banner.js
CHANGED
|
@@ -279,6 +279,7 @@ export function Banner({
|
|
|
279
279
|
icon,
|
|
280
280
|
isDismissable = false,
|
|
281
281
|
onDismiss,
|
|
282
|
+
dismissLabel,
|
|
282
283
|
endContent,
|
|
283
284
|
container = 'card',
|
|
284
285
|
elevation = 'none',
|
|
@@ -328,6 +329,14 @@ export function Banner({
|
|
|
328
329
|
const role = statusRole[status] ?? FALLBACK_ROLE;
|
|
329
330
|
const iconColor = statusIconColor[status];
|
|
330
331
|
const hasChildren = isRenderable(children);
|
|
332
|
+
// Keep the default tooltip concise while the accessible name identifies
|
|
333
|
+
// the banner; an explicit translated override names both surfaces.
|
|
334
|
+
const dismiss = t('@astryx.banner.dismiss');
|
|
335
|
+
const dismissTooltip = dismissLabel ?? dismiss;
|
|
336
|
+
const dismissName = dismissLabel ?? (typeof title === 'string' ? t('@astryx.banner.dismissTitled', {
|
|
337
|
+
dismiss,
|
|
338
|
+
title
|
|
339
|
+
}) : dismiss);
|
|
331
340
|
if (isDismissed) {
|
|
332
341
|
return null;
|
|
333
342
|
}
|
|
@@ -445,8 +454,8 @@ export function Banner({
|
|
|
445
454
|
}), isDismissable && /*#__PURE__*/_jsx(Button, {
|
|
446
455
|
variant: "ghost",
|
|
447
456
|
size: "sm",
|
|
448
|
-
label:
|
|
449
|
-
tooltip:
|
|
457
|
+
label: dismissName,
|
|
458
|
+
tooltip: dismissTooltip,
|
|
450
459
|
icon: /*#__PURE__*/_jsx(Icon, {
|
|
451
460
|
icon: "close",
|
|
452
461
|
size: "sm",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAAwB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAC5D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAE,SAAS,EAAC,MAAM,gBAAgB,CAAC;AACzD,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAwB3C,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/Button/Button.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAAwB,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAC5D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,SAAS,EAAE,SAAS,EAAC,MAAM,gBAAgB,CAAC;AACzD,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAwB3C,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAKrD,OAAO,KAAK,EAAC,gBAAgB,EAAC,MAAM,SAAS,CAAC;AA0G9C,QAAA,MAAM,UAAU;;;;;;;;;;EAUd,CAAC;AAsDH;;;GAGG;AACH,MAAM,MAAM,aAAa,GAAG,MAAM,gBAAgB,CAAC;AAEnD;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,UAAU,CAAC;AAEjD,MAAM,WAAW,WAAY,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IAC/D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC,oDAAoD;IACpD,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;IACrC,+CAA+C;IAC/C,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,gDAAgD;IAChD,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC;IAChD,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;IACxB;;;OAGG;IACH,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;OAGG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;;;;OAQG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;OAGG;IACH,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACrD;;OAEG;IACH,WAAW,CAAC,EAAE,CACZ,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,iBAAiB,CAAC,KACnC,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC1B;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;OAIG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,EAAE,CAAC,EAAE,iBAAiB,CAAC;IACvB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;CACd;AAuJD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,MAAM,CAAC,EACrB,KAAK,EACL,OAAqB,EACrB,IAAI,EAAE,QAAQ,EACd,IAAe,EACf,UAAkB,EAClB,SAAiB,EACjB,eAAuB,EACvB,WAAW,EACX,IAAI,EACJ,UAAkB,EAClB,KAAK,EACL,SAAkB,EAClB,QAAQ,EACR,UAAU,EACV,OAAO,EACP,IAAI,EACJ,EAAE,EACF,MAAM,EACN,GAAG,EACH,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,WAAW,GAAG,SAAS,CAoPzB;yBA7Qe,MAAM"}
|
package/dist/Button/Button.js
CHANGED
|
@@ -32,6 +32,7 @@ import { useMergedRefs } from "../hooks/useMergedRefs.js";
|
|
|
32
32
|
import { useLinkComponent } from "../Link/useLinkComponent.js";
|
|
33
33
|
import { themeProps } from "../utils/themeProps.js";
|
|
34
34
|
import { focusOutlineProps } from "../utils/focusOutline.stylex.js";
|
|
35
|
+
import { interactionOverlayStyles } from "../utils/interactionOverlay.stylex.js";
|
|
35
36
|
import { useTranslator } from "../i18n/index.js";
|
|
36
37
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
37
38
|
/**
|
|
@@ -188,26 +189,22 @@ const variants = {
|
|
|
188
189
|
primary: {
|
|
189
190
|
kWkggS: "x1ewilqj",
|
|
190
191
|
kMwMTN: "x17wrial",
|
|
191
|
-
kKwaWg: "xmvprkv xq8i9tn",
|
|
192
192
|
$$css: true
|
|
193
193
|
},
|
|
194
194
|
secondary: {
|
|
195
195
|
kWkggS: "x17x4s8c",
|
|
196
196
|
kMwMTN: "x1tgivj0",
|
|
197
|
-
kKwaWg: "xmvprkv xq8i9tn",
|
|
198
197
|
$$css: true
|
|
199
198
|
},
|
|
200
199
|
ghost: {
|
|
201
200
|
kWkggS: "xjbqb8w",
|
|
202
201
|
kMwMTN: "x1tgivj0",
|
|
203
|
-
kKwaWg: "xmvprkv xq8i9tn",
|
|
204
202
|
$$css: true
|
|
205
203
|
},
|
|
206
204
|
destructive: {
|
|
207
205
|
kWkggS: "x1pjz0fi",
|
|
208
206
|
kMwMTN: "x1m024r3",
|
|
209
207
|
kjBf7l: "x1e0x2sz",
|
|
210
|
-
kKwaWg: "xmvprkv xq8i9tn",
|
|
211
208
|
$$css: true
|
|
212
209
|
}
|
|
213
210
|
};
|
|
@@ -437,7 +434,7 @@ export function Button({
|
|
|
437
434
|
} : null;
|
|
438
435
|
|
|
439
436
|
// Shared StyleX props for both button and link rendering
|
|
440
|
-
const sharedStylexProps = focusOutlineProps.focusVisible(styles.base, sizeStyles[size], isIconOnly && styles.iconOnly, buttonDisabled && styles.disabled, useAriaDisabled && styles.ariaDisabled, renderAsLink && styles.link, !buttonGroup && styles.pressable, buttonGroup && (buttonGroup.orientation === 'horizontal' ? groupStyles.horizontal : groupStyles.vertical), buttonGroup && (variant === 'primary' || variant === 'destructive') && (buttonGroup.orientation === 'horizontal' ? groupStyles.onSolidHorizontal : groupStyles.onSolidVertical),
|
|
437
|
+
const sharedStylexProps = focusOutlineProps.focusVisible(styles.base, sizeStyles[size], isIconOnly && styles.iconOnly, interactionOverlayStyles.backgroundImage, buttonDisabled && styles.disabled, useAriaDisabled && styles.ariaDisabled, renderAsLink && styles.link, !buttonGroup && styles.pressable, buttonGroup && (buttonGroup.orientation === 'horizontal' ? groupStyles.horizontal : groupStyles.vertical), buttonGroup && (variant === 'primary' || variant === 'destructive') && (buttonGroup.orientation === 'horizontal' ? groupStyles.onSolidHorizontal : groupStyles.onSolidVertical),
|
|
441
438
|
// Standalone floating buttons only — a grouped button's elevation is owned
|
|
442
439
|
// by the ButtonGroup so the shared surface lifts as one unit.
|
|
443
440
|
!buttonGroup && elevationStyles[elevation], width != null && dynamicStyles.width(width),
|
|
@@ -445,9 +442,13 @@ export function Button({
|
|
|
445
442
|
// for every variant, and `destructive` re-colors just the ring to match
|
|
446
443
|
// its own surface. Ordering is the mechanism — StyleX is last-wins.
|
|
447
444
|
variants[variant], xstyle);
|
|
448
|
-
const sharedMergedProps = mergeProps(
|
|
445
|
+
const sharedMergedProps = mergeProps(
|
|
446
|
+
// Inside a group the group owns the surface's elevation, so the button
|
|
447
|
+
// reflects the tier it actually paints rather than the prop it was handed.
|
|
448
|
+
themeProps('button', {
|
|
449
449
|
variant,
|
|
450
|
-
size
|
|
450
|
+
size,
|
|
451
|
+
elevation: buttonGroup ? 'none' : elevation
|
|
451
452
|
}), sharedStylexProps, className, style);
|
|
452
453
|
const buttonContent = /*#__PURE__*/_jsxs(_Fragment, {
|
|
453
454
|
children: [isLoadingState && /*#__PURE__*/_jsx("span", {
|
|
@@ -35,8 +35,10 @@ interface CalendarBaseProps extends Omit<BaseProps<HTMLDivElement>, 'onChange' |
|
|
|
35
35
|
* Range mode only. Minimum number of days a selected range must span,
|
|
36
36
|
* counting both endpoints — `minRangeSpan={2}` forbids a single-day range.
|
|
37
37
|
* Once a start date is picked, days closer than this to it are disabled —
|
|
38
|
-
* except the start itself, which stays selectable
|
|
39
|
-
*
|
|
38
|
+
* except the start itself, which stays selectable. Clicking the start again
|
|
39
|
+
* commits a one-day range when the minimum allows it; otherwise it cancels
|
|
40
|
+
* the in-progress selection so the start can be moved. Defaults to 1 (a
|
|
41
|
+
* same-day start and end is allowed).
|
|
40
42
|
*/
|
|
41
43
|
minRangeSpan?: number;
|
|
42
44
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Calendar.d.ts","sourceRoot":"","sources":["../../src/Calendar/Calendar.tsx"],"names":[],"mappings":"AA6BA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"Calendar.d.ts","sourceRoot":"","sources":["../../src/Calendar/Calendar.tsx"],"names":[],"mappings":"AA6BA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAiD5C,YAAY,EACV,aAAa,EACb,SAAS,EACT,aAAa,EACb,SAAS,GACV,MAAM,oBAAoB,CAAC;AAC5B,OAAO,KAAK,EACV,aAAa,EACb,SAAS,EACT,aAAa,EACb,SAAS,EACV,MAAM,oBAAoB,CAAC;AAK5B,+CAA+C;AAE/C,MAAM,WAAW,cAAc;IAC7B,wEAAwE;IACxE,UAAU,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,IAAI,CAAC;CAC3C;AAID,UAAU,iBAAkB,SAAQ,IAAI,CACtC,SAAS,CAAC,cAAc,CAAC,EACzB,UAAU,GAAG,cAAc,CAC5B;IACC,kDAAkD;IAClD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,qDAAqD;IACrD,SAAS,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IACtC,+CAA+C;IAC/C,cAAc,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;IAEvB,4CAA4C;IAC5C,GAAG,CAAC,EAAE,aAAa,CAAC;IAEpB,4CAA4C;IAC5C,GAAG,CAAC,EAAE,aAAa,CAAC;IAEpB;;;OAGG;IACH,eAAe,CAAC,EAAE,aAAa,CAAC,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC,CAAC;IAEzD;;;;;;;OAOG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;;;;;;OAQG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,aAAa,CAAC;IAE1B,yDAAyD;IACzD,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,aAAa,KAAK,IAAI,CAAC;IAEvD;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;;;OAIG;IACH,YAAY,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC;CAC1C;AAID,UAAU,mBAAoB,SAAQ,iBAAiB;IACrD,qBAAqB;IACrB,IAAI,CAAC,EAAE,QAAQ,CAAC;IAEhB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,aAAa,CAAC;IAEtB,0CAA0C;IAC1C,YAAY,CAAC,EAAE,aAAa,CAAC;IAE7B,qCAAqC;IACrC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,EAAE,WAAW,EAAE,IAAI,KAAK,IAAI,CAAC;CAC9D;AAED,UAAU,kBAAmB,SAAQ,iBAAiB;IACpD,qBAAqB;IACrB,IAAI,EAAE,OAAO,CAAC;IAEd,0BAA0B;IAC1B,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,0CAA0C;IAC1C,YAAY,CAAC,EAAE,SAAS,CAAC;IAEzB,sCAAsC;IACtC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;CACvC;AAED,MAAM,MAAM,aAAa,GAAG,mBAAmB,GAAG,kBAAkB,CAAC;AAMrE;;;;;;;GAOG;AACH,wBAAgB,QAAQ,CAAC,EAAC,GAAG,EAAE,GAAG,KAAK,EAAC,EAAE,aAAa,+BAqXtD;yBArXe,QAAQ"}
|
|
@@ -27,6 +27,7 @@ import { calendarStyles, monthGridStyles, dayCellStyles, dayCellTheme } from "./
|
|
|
27
27
|
import { plainDateFromISO, plainDateToISO, plainDateToDate, plainDateToday, plainDateSetFirstOfMonth, plainDateAddMonths, plainDateAddDays, plainDateIsBefore, plainDateIsEqual, plainDateGetWeekNumber, plainDateFormat, DATE_FORMAT_WITH_WEEKDAY, DATE_FORMAT_MONTH_YEAR } from "../utils/plainDate.js";
|
|
28
28
|
import { mergeProps, composeEventHandlers, rtlStyles } from "../utils/index.js";
|
|
29
29
|
import { focusOutlineProps } from "../utils/focusOutline.stylex.js";
|
|
30
|
+
import { interactionOverlayStyles } from "../utils/interactionOverlay.stylex.js";
|
|
30
31
|
import { getInitialFocusDate } from "./getInitialFocusDate.js";
|
|
31
32
|
import { computeDayCellState, computeRangeRounding, computePreviewRounding, computeDayNeighborContinuity, isEndpoint } from "./dayCellUtils.js";
|
|
32
33
|
|
|
@@ -252,13 +253,12 @@ export function Calendar({
|
|
|
252
253
|
// Second click - complete the range
|
|
253
254
|
const startPd = plainDateFromISO(rangeSelectionStart);
|
|
254
255
|
|
|
255
|
-
// Clicking the anchor again
|
|
256
|
-
//
|
|
257
|
-
//
|
|
258
|
-
//
|
|
259
|
-
//
|
|
260
|
-
|
|
261
|
-
if (plainDateIsEqual(date, startPd)) {
|
|
256
|
+
// Clicking the anchor again commits a one-day range when the minimum
|
|
257
|
+
// span allows it. For longer minimum spans, the repeated click clears
|
|
258
|
+
// the in-progress start instead: the anchor is the only nearby day
|
|
259
|
+
// that remains enabled, so this preserves an escape hatch for moving
|
|
260
|
+
// the start without violating the configured minimum.
|
|
261
|
+
if (plainDateIsEqual(date, startPd) && (minRangeSpan ?? 1) > 1) {
|
|
262
262
|
setRangeSelectionStart(null);
|
|
263
263
|
announce(t('@astryx.calendar.rangeClearedAnnounce', {
|
|
264
264
|
date: plainDateFormat(date, DATE_FORMAT_WITH_WEEKDAY, locale)
|
|
@@ -291,7 +291,7 @@ export function Calendar({
|
|
|
291
291
|
}));
|
|
292
292
|
}
|
|
293
293
|
}
|
|
294
|
-
}, [mode, onChange, rangeSelectionStart, announce, t, locale]);
|
|
294
|
+
}, [mode, onChange, rangeSelectionStart, minRangeSpan, announce, t, locale]);
|
|
295
295
|
return /*#__PURE__*/_jsxs("div", {
|
|
296
296
|
ref: ref,
|
|
297
297
|
...rest,
|
|
@@ -808,7 +808,7 @@ function DayCell({
|
|
|
808
808
|
// `marker` mirrors the StyleX conditions below exactly, preserving
|
|
809
809
|
// the default rendering.
|
|
810
810
|
marker: markerState
|
|
811
|
-
}), focusOutlineProps.focusVisible(dayCellStyles.day, dayCellTheme.day, isOutside && dayCellStyles.dayOutside, isOutside && dayCellTheme.dayOutside, showsTodayRing && dayCellStyles.dayToday, showsTodayRing && dayCellTheme.dayToday, showsTodayInRangeRing && dayCellStyles.dayTodayInRange, showsTodayInRangeRing && dayCellTheme.dayTodayInRange, endpoint && dayCellStyles.daySelected, endpoint && dayCellTheme.daySelected, state.effectivelyDisabled && dayCellStyles.dayDisabled, state.effectivelyDisabled && dayCellTheme.dayDisabled)),
|
|
811
|
+
}), focusOutlineProps.focusVisible(dayCellStyles.day, dayCellTheme.day, interactionOverlayStyles.backgroundImage, isOutside && dayCellStyles.dayOutside, isOutside && dayCellTheme.dayOutside, showsTodayRing && dayCellStyles.dayToday, showsTodayRing && dayCellTheme.dayToday, showsTodayInRangeRing && dayCellStyles.dayTodayInRange, showsTodayInRangeRing && dayCellTheme.dayTodayInRange, endpoint && dayCellStyles.daySelected, endpoint && dayCellTheme.daySelected, state.effectivelyDisabled && dayCellStyles.dayDisabled, state.effectivelyDisabled && dayCellTheme.dayDisabled)),
|
|
812
812
|
children: dayNumber
|
|
813
813
|
})]
|
|
814
814
|
});
|
|
@@ -185,9 +185,6 @@ export declare const dayCellTheme: Readonly<{
|
|
|
185
185
|
readonly day: Readonly<{
|
|
186
186
|
readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#0A1317, #DFE2E5)">;
|
|
187
187
|
readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "transparent">;
|
|
188
|
-
readonly backgroundImage: stylex.StyleXClassNameFor<"backgroundImage", {
|
|
189
|
-
readonly '@media (hover: hover)': `linear-gradient(${stylex.StyleXVar<"light-dark(#0536590C, #FFFFFF0C)">}, ${stylex.StyleXVar<"light-dark(#0536590C, #FFFFFF0C)">})`;
|
|
190
|
-
} | null>;
|
|
191
188
|
}>;
|
|
192
189
|
readonly dayOutside: Readonly<{
|
|
193
190
|
readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#4E606F, #AAAFB5)">;
|
|
@@ -202,9 +199,6 @@ export declare const dayCellTheme: Readonly<{
|
|
|
202
199
|
readonly forcedColorAdjust: stylex.StyleXClassNameFor<"forcedColorAdjust", "none">;
|
|
203
200
|
readonly backgroundColor: stylex.StyleXClassNameFor<"backgroundColor", "light-dark(#0064E0, #2694FE)" | "Highlight">;
|
|
204
201
|
readonly color: stylex.StyleXClassNameFor<"color", "light-dark(#FFFFFF, #FFFFFF)" | "HighlightText">;
|
|
205
|
-
readonly backgroundImage: stylex.StyleXClassNameFor<"backgroundImage", {
|
|
206
|
-
readonly '@media (hover: hover)': `linear-gradient(${stylex.StyleXVar<"light-dark(#0536590C, #FFFFFF0C)">}, ${stylex.StyleXVar<"light-dark(#0536590C, #FFFFFF0C)">})`;
|
|
207
|
-
} | null>;
|
|
208
202
|
}>;
|
|
209
203
|
readonly dayDisabled: Readonly<{
|
|
210
204
|
readonly opacity: stylex.StyleXClassNameFor<"opacity", 0.3>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/Calendar/styles.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAgB3C,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoCzB,CAAC;AAMH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuC1B,CAAC;AAiBH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+GxB,CAAC;AAMH,eAAO,MAAM,YAAY
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/Calendar/styles.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,MAAM,MAAM,kBAAkB,CAAC;AAgB3C,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoCzB,CAAC;AAMH,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAuC1B,CAAC;AAiBH,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+GxB,CAAC;AAMH,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8DvB,CAAC"}
|
package/dist/Calendar/styles.js
CHANGED
|
@@ -252,7 +252,6 @@ export const dayCellTheme = {
|
|
|
252
252
|
day: {
|
|
253
253
|
kMwMTN: "x1tgivj0",
|
|
254
254
|
kWkggS: "xjbqb8w",
|
|
255
|
-
kKwaWg: "xmvprkv",
|
|
256
255
|
$$css: true
|
|
257
256
|
},
|
|
258
257
|
dayOutside: {
|
|
@@ -271,7 +270,6 @@ export const dayCellTheme = {
|
|
|
271
270
|
kAXs8y: "x1kzknox",
|
|
272
271
|
kWkggS: "x1ewilqj x1jzqe4",
|
|
273
272
|
kMwMTN: "x17wrial x1k5gbb1",
|
|
274
|
-
kKwaWg: "xmvprkv",
|
|
275
273
|
$$css: true
|
|
276
274
|
},
|
|
277
275
|
dayDisabled: {
|
package/dist/Card/Card.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @file Card.tsx
|
|
3
3
|
* @input Uses container utility, StyleX
|
|
4
|
-
* @output Exports Card component
|
|
4
|
+
* @output Exports Card component, CardProps, CardVariant types
|
|
5
5
|
* @position Core card container component
|
|
6
6
|
*
|
|
7
7
|
* SYNC: When modified, update these files to stay in sync:
|
|
@@ -13,8 +13,11 @@
|
|
|
13
13
|
import type { ReactNode } from 'react';
|
|
14
14
|
import type { Elevation, SizeValue, SpacingStep } from '../utils/types';
|
|
15
15
|
import type { BaseProps } from '../BaseProps';
|
|
16
|
+
import type { CardVariantMap } from './index';
|
|
16
17
|
/**
|
|
17
|
-
* Background color variant for Card.
|
|
18
|
+
* Background color variant for Card, derived from CardVariantMap.
|
|
19
|
+
* Extensible via module augmentation of CardVariantMap.
|
|
20
|
+
*
|
|
18
21
|
* - `default`: standard card background with visible border
|
|
19
22
|
* - `transparent`: no background, no visible border — for grouping content without visual weight
|
|
20
23
|
* - `muted`: subtle muted background for de-emphasised cards
|
|
@@ -26,18 +29,10 @@ import type { BaseProps } from '../BaseProps';
|
|
|
26
29
|
* keeping content geometry faithful to the spacing scale and identical to the
|
|
27
30
|
* borderless variants. Themes can override borderWidth/borderColor.
|
|
28
31
|
*/
|
|
29
|
-
export type CardVariant =
|
|
32
|
+
export type CardVariant = keyof CardVariantMap;
|
|
30
33
|
export type { SizeValue } from '../utils/types';
|
|
31
34
|
export interface CardProps extends BaseProps<HTMLDivElement> {
|
|
32
35
|
ref?: React.Ref<HTMLDivElement>;
|
|
33
|
-
/**
|
|
34
|
-
* CSS class name(s) appended to the root element.
|
|
35
|
-
*/
|
|
36
|
-
className?: string;
|
|
37
|
-
/**
|
|
38
|
-
* Inline styles to apply to the root element.
|
|
39
|
-
*/
|
|
40
|
-
style?: React.CSSProperties;
|
|
41
36
|
/**
|
|
42
37
|
* Width of the card.
|
|
43
38
|
* Numbers are treated as pixels, strings are used as-is.
|
|
@@ -66,7 +61,12 @@ export interface CardProps extends BaseProps<HTMLDivElement> {
|
|
|
66
61
|
/**
|
|
67
62
|
* Internal padding of the card using the spacing scale.
|
|
68
63
|
* Accepts numeric spacing steps: 0, 0.5, 1, 1.5, 2, 3, 4, 5, 6, 8, 10.
|
|
69
|
-
*
|
|
64
|
+
*
|
|
65
|
+
* Omit it and the card takes the theme's card padding rather than a step, so
|
|
66
|
+
* passing a step is a decision to override the theme, not a way to restate
|
|
67
|
+
* the default.
|
|
68
|
+
*
|
|
69
|
+
* @default the theme's card padding (spacing step 4 with no theme)
|
|
70
70
|
*/
|
|
71
71
|
padding?: SpacingStep;
|
|
72
72
|
/**
|
package/dist/Card/Card.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../src/Card/Card.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../src/Card/Card.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;;GAWG;AAEH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAYrC,OAAO,KAAK,EAAC,SAAS,EAAE,SAAS,EAAE,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAEtE,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAE5C,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,SAAS,CAAC;AAM5C;;;;;;;;;;;;;;GAcG;AACH,MAAM,MAAM,WAAW,GAAG,MAAM,cAAc,CAAC;AAgH/C,YAAY,EAAC,SAAS,EAAC,MAAM,gBAAgB,CAAC;AAE9C,MAAM,WAAW,SAAU,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC1D,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;OAGG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;OAGG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;;;;;;;OASG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,wBAAgB,IAAI,CAAC,EACnB,KAAK,EACL,MAAM,EACN,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,OAAO,EACP,OAAmB,EACnB,SAAkB,EAClB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,SAAS,+BAkDX;yBAhEe,IAAI"}
|