@astryxdesign/core 0.7.5-canary.dcdb356 → 0.7.5-canary.e4b225e
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 +10 -10
- package/README.md +3 -3
- package/dist/AppShell/AppShell.d.ts +0 -22
- package/dist/AppShell/AppShell.d.ts.map +1 -1
- package/dist/AppShell/AppShell.js +155 -1
- package/dist/Banner/Banner.d.ts +1 -0
- package/dist/Banner/Banner.d.ts.map +1 -1
- package/dist/Banner/Banner.js +2 -0
- package/dist/BottomSheet/BottomSheetPanel.d.ts.map +1 -1
- package/dist/BottomSheet/BottomSheetPanel.js +1 -1
- package/dist/BottomSheet/bottomSheetStack.d.ts.map +1 -1
- package/dist/BottomSheet/bottomSheetStack.js +27 -4
- package/dist/BottomSheet/useSheetGestures.d.ts +12 -0
- package/dist/BottomSheet/useSheetGestures.d.ts.map +1 -1
- package/dist/BottomSheet/useSheetGestures.js +30 -3
- package/dist/Breadcrumbs/BreadcrumbItem.d.ts.map +1 -1
- package/dist/Breadcrumbs/BreadcrumbItem.js +31 -3
- package/dist/Chat/ChatPastedTextToken.d.ts.map +1 -1
- package/dist/Chat/ChatPastedTextToken.js +7 -6
- package/dist/DropdownMenu/DropdownMenu.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenu.js +2 -10
- package/dist/DropdownMenu/DropdownMenuGroup.d.ts +7 -4
- package/dist/DropdownMenu/DropdownMenuGroup.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuGroup.js +10 -4
- package/dist/DropdownMenu/menuTouchAction.stylex.d.ts +25 -0
- package/dist/DropdownMenu/menuTouchAction.stylex.d.ts.map +1 -0
- package/dist/DropdownMenu/menuTouchAction.stylex.js +29 -0
- package/dist/FileInput/FileInput.d.ts.map +1 -1
- package/dist/FileInput/FileInput.js +19 -9
- package/dist/Icon/Icon.d.ts +31 -2
- package/dist/Icon/Icon.d.ts.map +1 -1
- package/dist/Icon/Icon.js +58 -8
- package/dist/Icon/IconSize.stylex.d.ts +16 -11
- package/dist/Icon/IconSize.stylex.d.ts.map +1 -1
- package/dist/Icon/IconSize.stylex.js +27 -11
- package/dist/Icon/globalIconRegistry.d.ts +71 -4
- package/dist/Icon/globalIconRegistry.d.ts.map +1 -1
- package/dist/Icon/globalIconRegistry.js +163 -23
- package/dist/Icon/index.d.ts +26 -2
- package/dist/Icon/index.d.ts.map +1 -1
- package/dist/Icon/index.js +24 -1
- package/dist/Icon/useIcon.d.ts +5 -1
- package/dist/Icon/useIcon.d.ts.map +1 -1
- package/dist/Icon/useIcon.js +5 -1
- package/dist/Item/Item.d.ts +5 -1
- package/dist/Item/Item.d.ts.map +1 -1
- package/dist/Item/Item.js +22 -6
- package/dist/Item/ItemMarkerColumns.a11y.chromium.spec.d.ts +2 -0
- package/dist/Item/ItemMarkerColumns.a11y.chromium.spec.d.ts.map +1 -0
- package/dist/Item/ItemMarkerColumns.a11y.chromium.spec.js +132 -0
- package/dist/Item/ItemMarkerColumnsContext.d.ts +14 -0
- package/dist/Item/ItemMarkerColumnsContext.d.ts.map +1 -0
- package/dist/Item/ItemMarkerColumnsContext.js +18 -0
- package/dist/Kbd/Kbd.d.ts +2 -2
- package/dist/Kbd/Kbd.d.ts.map +1 -1
- package/dist/Kbd/Kbd.js +18 -11
- package/dist/Layer/useLayer.d.ts.map +1 -1
- package/dist/Layer/useLayer.js +32 -2
- package/dist/List/List.d.ts +2 -1
- package/dist/List/List.d.ts.map +1 -1
- package/dist/List/List.js +9 -2
- package/dist/List/ListContext.d.ts +16 -4
- package/dist/List/ListContext.d.ts.map +1 -1
- package/dist/List/ListContext.js +10 -5
- package/dist/List/ListItem.d.ts +7 -1
- package/dist/List/ListItem.d.ts.map +1 -1
- package/dist/List/ListItem.js +52 -8
- package/dist/List/ListMarkers.a11y.chromium.spec.d.ts +2 -0
- package/dist/List/ListMarkers.a11y.chromium.spec.d.ts.map +1 -0
- package/dist/List/ListMarkers.a11y.chromium.spec.js +677 -0
- package/dist/Markdown/Markdown.d.ts.map +1 -1
- package/dist/Markdown/Markdown.js +18 -5
- package/dist/MobileNav/MobileNavToggle.d.ts +7 -3
- package/dist/MobileNav/MobileNavToggle.d.ts.map +1 -1
- package/dist/MobileNav/MobileNavToggle.js +11 -3
- package/dist/MultiSelector/CreateRow.a11y.chromium.spec.js +52 -6
- package/dist/NavMenu/NavHeadingMenu.d.ts +1 -1
- package/dist/NavMenu/NavHeadingMenu.d.ts.map +1 -1
- package/dist/NavMenu/NavHeadingMenu.js +29 -5
- package/dist/NavMenu/NavHeadingMenuItem.d.ts.map +1 -1
- package/dist/NavMenu/NavHeadingMenuItem.js +51 -7
- package/dist/NavMenu/NavMenuContext.d.ts +9 -0
- package/dist/NavMenu/NavMenuContext.d.ts.map +1 -1
- package/dist/NavMenu/NavMenuContext.js +9 -0
- package/dist/NumberInput/NumberInput.d.ts +3 -1
- package/dist/NumberInput/NumberInput.d.ts.map +1 -1
- package/dist/NumberInput/NumberInput.js +3 -3
- package/dist/Overlay/Overlay.d.ts +3 -3
- package/dist/Overlay/Overlay.d.ts.map +1 -1
- package/dist/Overlay/Overlay.js +12 -5
- package/dist/SegmentedControl/SegmentedControl.d.ts +1 -1
- package/dist/SegmentedControl/SegmentedControl.d.ts.map +1 -1
- package/dist/SegmentedControl/SegmentedControl.js +6 -2
- package/dist/Selector/Selector.d.ts.map +1 -1
- package/dist/Selector/Selector.js +11 -3
- package/dist/Selector/hooks.d.ts +52 -6
- package/dist/Selector/hooks.d.ts.map +1 -1
- package/dist/Selector/hooks.js +145 -2
- package/dist/SideNav/SideNav.d.ts.map +1 -1
- package/dist/SideNav/SideNav.js +58 -2
- package/dist/SideNav/SideNavHeading.d.ts.map +1 -1
- package/dist/SideNav/SideNavHeading.js +45 -3
- package/dist/SideNav/railMotion.d.ts +54 -0
- package/dist/SideNav/railMotion.d.ts.map +1 -0
- package/dist/SideNav/railMotion.js +253 -0
- package/dist/Slider/Slider.d.ts.map +1 -1
- package/dist/Slider/Slider.js +7 -3
- package/dist/TabList/TabMenu.d.ts.map +1 -1
- package/dist/TabList/TabMenu.js +24 -3
- package/dist/Table/TableCell.d.ts.map +1 -1
- package/dist/Table/TableCell.js +4 -1
- package/dist/Table/TableRow.d.ts.map +1 -1
- package/dist/Table/TableRow.js +3 -0
- package/dist/Table/glidingDivider.d.ts +96 -0
- package/dist/Table/glidingDivider.d.ts.map +1 -0
- package/dist/Table/glidingDivider.js +275 -0
- package/dist/Table/plugins/rowExpansion/useTableRowExpansion.d.ts +8 -0
- package/dist/Table/plugins/rowExpansion/useTableRowExpansion.d.ts.map +1 -1
- package/dist/Table/plugins/rowExpansion/useTableRowExpansion.js +274 -12
- package/dist/Table/plugins/stickyColumns/useTableStickyColumns.d.ts.map +1 -1
- package/dist/Table/plugins/stickyColumns/useTableStickyColumns.js +16 -5
- package/dist/TextInput/TextInput.d.ts +1 -1
- package/dist/TextInput/TextInput.d.ts.map +1 -1
- package/dist/TextInput/TextInput.js +8 -1
- package/dist/Toast/ToastViewport.d.ts.map +1 -1
- package/dist/Toast/ToastViewport.js +34 -4
- package/dist/TopNav/TopNavHeading.d.ts.map +1 -1
- package/dist/TopNav/TopNavHeading.js +26 -0
- package/dist/TopNav/TopNavMenu.d.ts.map +1 -1
- package/dist/TopNav/TopNavMenu.js +32 -4
- package/dist/TreeList/TreeListBranches.d.ts.map +1 -1
- package/dist/TreeList/TreeListBranches.js +7 -5
- package/dist/TreeList/TreeListItem.d.ts.map +1 -1
- package/dist/TreeList/TreeListItem.js +2 -2
- package/dist/Typeahead/BaseTypeahead.d.ts +1 -1
- package/dist/Typeahead/BaseTypeahead.d.ts.map +1 -1
- package/dist/Typeahead/BaseTypeahead.emptyState.a11y.chromium.spec.d.ts +2 -0
- package/dist/Typeahead/BaseTypeahead.emptyState.a11y.chromium.spec.d.ts.map +1 -0
- package/dist/Typeahead/BaseTypeahead.emptyState.a11y.chromium.spec.js +118 -0
- package/dist/Typeahead/BaseTypeahead.js +11 -7
- package/dist/astryx.css +54 -11
- package/dist/hooks/menuPressOnItems.d.ts +19 -0
- package/dist/hooks/menuPressOnItems.d.ts.map +1 -0
- package/dist/hooks/menuPressOnItems.js +32 -0
- package/dist/hooks/scrollGeometry.d.ts +28 -0
- package/dist/hooks/scrollGeometry.d.ts.map +1 -1
- package/dist/hooks/scrollGeometry.js +36 -2
- package/dist/hooks/useMenuHover.d.ts.map +1 -1
- package/dist/hooks/useMenuHover.js +6 -2
- package/dist/hooks/usePressFeedback.d.ts +5 -2
- package/dist/hooks/usePressFeedback.d.ts.map +1 -1
- package/dist/hooks/usePressFeedback.js +5 -2
- package/dist/hooks/useScrollableArea.d.ts +5 -0
- package/dist/hooks/useScrollableArea.d.ts.map +1 -1
- package/dist/hooks/useScrollableArea.js +67 -6
- package/dist/i18n/generated-locales/en.generated.d.ts.map +1 -1
- package/dist/i18n/generated-locales/en.generated.js +20 -0
- package/dist/i18n/generated-locales/pseudo.generated.d.ts.map +1 -1
- package/dist/i18n/generated-locales/pseudo.generated.js +20 -0
- package/dist/motion/animatedLayout.d.ts +99 -3
- package/dist/motion/animatedLayout.d.ts.map +1 -1
- package/dist/motion/animatedLayout.js +689 -56
- package/dist/motion/transientCopy.d.ts +33 -0
- package/dist/motion/transientCopy.d.ts.map +1 -0
- package/dist/motion/transientCopy.js +314 -0
- package/dist/theme/defineTheme.d.ts +111 -11
- package/dist/theme/defineTheme.d.ts.map +1 -1
- package/dist/theme/defineTheme.js +97 -7
- package/dist/theme/derivedVarRegistry.d.ts.map +1 -1
- package/dist/theme/derivedVarRegistry.js +9 -0
- package/dist/theme/syntax/SyntaxTheme.d.ts +1 -1
- package/dist/theme/syntax/SyntaxTheme.js +1 -1
- package/dist/theme/syntax/defineSyntaxTheme.js +1 -1
- package/dist/theme/syntax/presets.d.ts +1 -1
- package/dist/theme/syntax/presets.js +1 -1
- package/dist/theme/syntax/tokens.d.ts +1 -1
- package/dist/theme/syntax/tokens.js +1 -1
- package/dist/theme/tokens.stylex.d.ts +2 -0
- package/dist/theme/tokens.stylex.d.ts.map +1 -1
- package/dist/theme/tokens.stylex.js +7 -1
- package/dist/utils/interactionOverlay.stylex.d.ts +4 -1
- package/dist/utils/interactionOverlay.stylex.d.ts.map +1 -1
- package/dist/utils/interactionOverlay.stylex.js +4 -1
- package/dist/utils/pressFeedback.d.ts +5 -1
- package/dist/utils/pressFeedback.d.ts.map +1 -1
- package/dist/utils/pressFeedback.js +285 -54
- package/dist/utils/pressGesture.d.ts +13 -1
- package/dist/utils/pressGesture.d.ts.map +1 -1
- package/dist/utils/pressGesture.js +40 -1
- package/locales/af-ZA.json +1 -1
- package/locales/ar-SA.json +1 -1
- package/locales/ca-ES.json +1 -1
- package/locales/cs-CZ.json +1 -1
- package/locales/da-DK.json +1 -1
- package/locales/de-DE.json +1 -1
- package/locales/el-GR.json +1 -1
- package/locales/en.json +80 -0
- package/locales/es-ES.json +1 -1
- package/locales/fi-FI.json +1 -1
- package/locales/fr-FR.json +1 -1
- package/locales/he-IL.json +1 -1
- package/locales/hu-HU.json +1 -1
- package/locales/it-IT.json +1 -1
- package/locales/ja-JP.json +1 -1
- package/locales/ko-KR.json +1 -1
- package/locales/nl-NL.json +1 -1
- package/locales/no-NO.json +1 -1
- package/locales/pl-PL.json +1 -1
- package/locales/pseudo.json +60 -0
- package/locales/pt-BR.json +1 -1
- package/locales/pt-PT.json +1 -1
- package/locales/ro-RO.json +1 -1
- package/locales/ru-RU.json +1 -1
- package/locales/sr-SP.json +1 -1
- package/locales/sv-SE.json +1 -1
- package/locales/tr-TR.json +1 -1
- package/locales/uk-UA.json +1 -1
- package/locales/vi-VN.json +1 -1
- package/locales/zh-CN.json +1 -1
- package/locales/zh-TW.json +1 -1
- package/package.json +6 -6
- package/src/AlertDialog/AlertDialog.spec.md +85 -31
- package/src/AppShell/AppShell.spec.md +49 -44
- package/src/AppShell/AppShell.tsx +170 -2
- package/src/Banner/Banner.spec.md +4 -2
- package/src/Banner/Banner.test.tsx +36 -17
- package/src/Banner/Banner.tsx +5 -0
- package/src/BottomSheet/BottomSheet.spec.md +2 -0
- package/src/BottomSheet/BottomSheet.test.tsx +46 -0
- package/src/BottomSheet/BottomSheetPanel.test.tsx +52 -9
- package/src/BottomSheet/BottomSheetPanel.tsx +12 -6
- package/src/BottomSheet/BottomSheetReplace.test.tsx +118 -6
- package/src/BottomSheet/__tests__/BottomSheetKeyboard.a11y.browser.spec.ts +3 -1
- package/src/BottomSheet/bottomSheetStack.ts +29 -6
- package/src/BottomSheet/useSheetGestures.test.ts +52 -0
- package/src/BottomSheet/useSheetGestures.ts +37 -6
- package/src/Breadcrumbs/BreadcrumbItem.spec.md +19 -12
- package/src/Breadcrumbs/BreadcrumbItem.tsx +25 -1
- package/src/Breadcrumbs/Breadcrumbs.test.tsx +70 -2
- package/src/ButtonGroup/ButtonGroup.spec.md +4 -2
- package/src/Card/Card.spec.md +205 -0
- package/src/Center/Center.spec.md +104 -124
- package/src/Chat/ChatPastedTextToken.test.tsx +71 -0
- package/src/Chat/ChatPastedTextToken.tsx +8 -7
- package/src/Chat/__tests__/ChatLayoutScrollButton.a11y.chromium.spec.ts +21 -4
- package/src/CheckboxInput/CheckboxInput.spec.md +97 -66
- package/src/CheckboxList/CheckboxList.spec.md +92 -78
- package/src/CheckboxList/CheckboxListItem.spec.md +86 -60
- package/src/ClickableCard/ClickableCard.spec.md +124 -128
- package/src/CommandPalette/__tests__/CommandPaletteFooter.a11y.chromium.spec.ts +2 -2
- package/src/ContextMenu/ContextMenu.spec.md +30 -26
- package/src/DateTimeInput/DateTimeInput.spec.md +71 -48
- package/src/Dialog/Dialog.spec.md +20 -4
- package/src/Dialog/__tests__/Dialog.reduced-motion.a11y.browser.spec.ts +63 -2
- package/src/DropdownMenu/DropdownMenu.test.tsx +43 -0
- package/src/DropdownMenu/DropdownMenu.tsx +4 -13
- package/src/DropdownMenu/DropdownMenuGroup.doc.mjs +2 -2
- package/src/DropdownMenu/DropdownMenuGroup.tsx +12 -6
- package/src/DropdownMenu/menuTouchAction.stylex.ts +28 -0
- package/src/Field/Field.spec.md +57 -48
- package/src/Field/FieldLabel.spec.md +70 -59
- package/src/FileInput/FileInput.doc.mjs +1 -1
- package/src/FileInput/FileInput.test.tsx +102 -0
- package/src/FileInput/FileInput.tsx +15 -9
- package/src/FormLayout/FormLayout.spec.md +69 -51
- package/src/Grid/Grid.spec.md +72 -69
- package/src/Grid/GridSpan.spec.md +158 -0
- package/src/HoverCard/HoverCard.spec.md +244 -0
- package/src/Icon/Icon.doc.mjs +65 -3
- package/src/Icon/Icon.test.tsx +545 -9
- package/src/Icon/Icon.tsx +73 -12
- package/src/Icon/IconSize.stylex.ts +27 -11
- package/src/Icon/globalIconRegistry.test.tsx +395 -3
- package/src/Icon/globalIconRegistry.tsx +184 -36
- package/src/Icon/index.ts +29 -1
- package/src/Icon/useIcon.ts +5 -1
- package/src/IconButton/IconButton.test.tsx +5 -2
- package/src/Item/Item.test.tsx +40 -1
- package/src/Item/Item.tsx +37 -4
- package/src/Item/ItemMarkerColumns.a11y.chromium.spec.ts +211 -0
- package/src/Item/ItemMarkerColumnsContext.tsx +20 -0
- package/src/Kbd/Kbd.test.tsx +95 -0
- package/src/Kbd/Kbd.tsx +30 -23
- package/src/Layer/LayerProvider.spec.md +149 -0
- package/src/Layer/useLayer.test.tsx +107 -0
- package/src/Layer/useLayer.tsx +52 -5
- package/src/Lightbox/Lightbox.spec.md +9 -8
- package/src/List/List.spec.md +71 -33
- package/src/List/List.tsx +13 -1
- package/src/List/ListContext.tsx +19 -5
- package/src/List/ListItem.tsx +97 -28
- package/src/List/ListMarkers.a11y.chromium.spec.ts +904 -0
- package/src/Markdown/Markdown.test.tsx +50 -0
- package/src/Markdown/Markdown.tsx +29 -6
- package/src/MobileNav/MobileNav.doc.mjs +2 -2
- package/src/MobileNav/MobileNavToggle.test.tsx +63 -0
- package/src/MobileNav/MobileNavToggle.tsx +13 -5
- package/src/MultiSelector/CreateRow.a11y.chromium.spec.ts +66 -9
- package/src/NavMenu/NavHeadingMenu.spec.md +19 -17
- package/src/NavMenu/NavHeadingMenu.test.tsx +276 -2
- package/src/NavMenu/NavHeadingMenu.tsx +42 -4
- package/src/NavMenu/NavHeadingMenuItem.tsx +60 -6
- package/src/NavMenu/NavMenuContext.tsx +11 -0
- package/src/NavMenu/__tests__/NavMenusSlideSelection.a11y.chromium.spec.ts +137 -0
- package/src/NumberInput/NumberInput.doc.mjs +13 -7
- package/src/NumberInput/NumberInput.spec.md +59 -37
- package/src/NumberInput/NumberInput.tsx +13 -3
- package/src/NumberInput/__tests__/NumberInput.coarse-pointer.a11y.chromium.spec.ts +102 -0
- package/src/Overlay/Overlay.doc.mjs +2 -2
- package/src/Overlay/Overlay.test.tsx +72 -4
- package/src/Overlay/Overlay.tsx +18 -8
- package/src/Popover/Popover.spec.md +1 -1
- package/src/RadioList/RadioList.spec.md +227 -0
- package/src/RadioList/RadioListItem.spec.md +223 -0
- package/src/Section/Section.spec.md +102 -44
- package/src/SegmentedControl/SegmentedControl.spec.md +162 -53
- package/src/SegmentedControl/SegmentedControl.test.tsx +46 -0
- package/src/SegmentedControl/SegmentedControl.tsx +7 -3
- package/src/SegmentedControl/SegmentedControlItem.spec.md +206 -0
- package/src/SelectableCard/SelectableCard.spec.md +230 -0
- package/src/Selector/Selector.sheetActiveDescendant.test.tsx +95 -0
- package/src/Selector/Selector.tsx +11 -2
- package/src/Selector/__tests__/ComboboxField.a11y.chromium.spec.ts +458 -0
- package/src/Selector/hooks.ts +234 -10
- package/src/Selector/useCombobox.doc.mjs +156 -9
- package/src/Selector/useCombobox.public.test.tsx +89 -0
- package/src/Selector/useCombobox.test.tsx +444 -0
- package/src/SideNav/SideNav.spec.md +45 -27
- package/src/SideNav/SideNav.test.tsx +135 -0
- package/src/SideNav/SideNav.tsx +85 -1
- package/src/SideNav/SideNavHeading.spec.md +26 -19
- package/src/SideNav/SideNavHeading.tsx +61 -6
- package/src/SideNav/SideNavRailMotion.test.tsx +620 -0
- package/src/SideNav/__tests__/SideNavRailMotion.interaction.browser.spec.ts +417 -0
- package/src/SideNav/railMotion.ts +315 -0
- package/src/Slider/Slider.fr10.test.tsx +34 -0
- package/src/Slider/Slider.tsx +10 -2
- package/src/Stack/Stack.spec.md +104 -56
- package/src/Switch/Switch.spec.md +150 -66
- package/src/TabList/TabList.test.tsx +27 -0
- package/src/TabList/TabMenu.spec.md +3 -1
- package/src/TabList/TabMenu.tsx +22 -1
- package/src/Table/TableCell.tsx +3 -0
- package/src/Table/TableRow.tsx +3 -0
- package/src/Table/__tests__/TableRowGlide.a11y.browser.spec.ts +382 -0
- package/src/Table/glidingDivider.ts +336 -0
- package/src/Table/plugins/rowExpansion/useTableRowExpansion.glide.test.tsx +280 -0
- package/src/Table/plugins/rowExpansion/useTableRowExpansion.tsx +353 -7
- package/src/Table/plugins/rowStatus/useTableRowStatus.spec.md +4 -4
- package/src/Table/plugins/sortable/__tests__/useTableSortable.a11y.ts +1 -1
- package/src/Table/plugins/stickyColumns/useTableStickyColumns.tsx +24 -3
- package/src/Table/useTableRowExpansion.doc.mjs +8 -0
- package/src/TextInput/TextInput.spec.md +6 -4
- package/src/TextInput/TextInput.test.tsx +43 -0
- package/src/TextInput/TextInput.tsx +11 -1
- package/src/Toast/Toast.spec.md +300 -0
- package/src/Toast/ToastViewport.test.tsx +137 -0
- package/src/Toast/ToastViewport.tsx +36 -4
- package/src/ToggleButton/ToggleButtonGroup.spec.md +14 -13
- package/src/Tokenizer/Tokenizer.spec.md +2 -2
- package/src/Tokenizer/Tokenizer.ssr.test.tsx +59 -9
- package/src/Toolbar/Toolbar.spec.md +2 -1
- package/src/Tooltip/Tooltip.spec.md +161 -36
- package/src/Tooltip/__tests__/TooltipTallContent.a11y.browser.spec.ts +34 -7
- package/src/TopNav/TopNav.test.tsx +89 -0
- package/src/TopNav/TopNavHeading.spec.md +24 -17
- package/src/TopNav/TopNavHeading.tsx +35 -2
- package/src/TopNav/TopNavMenu.spec.md +27 -20
- package/src/TopNav/TopNavMenu.test.tsx +65 -1
- package/src/TopNav/TopNavMenu.tsx +30 -1
- package/src/TreeList/TreeList.spec.md +3 -0
- package/src/TreeList/TreeListBranches.tsx +8 -6
- package/src/TreeList/TreeListItem.tsx +0 -4
- package/src/TreeList/__tests__/TreeList.a11y.chromium.spec.ts +18 -6
- package/src/TreeList/__tests__/TreeListGuideAlignment.interaction.browser.spec.ts +127 -0
- package/src/Typeahead/BaseTypeahead.emptyState.a11y.chromium.spec.ts +138 -0
- package/src/Typeahead/BaseTypeahead.test.tsx +201 -4
- package/src/Typeahead/BaseTypeahead.tsx +12 -8
- package/src/__tests__/PressModality.a11y.chromium.spec.ts +392 -0
- package/src/__tests__/unthemedLength.ts +34 -0
- package/src/gestures/__tests__/VelocityTracker.streams.test.ts +243 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/README.md +82 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/android-chromium-fling.json +130 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/android-chromium-slow.json +860 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/android-chromium-stop-release.json +357 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/android-firefox-fling.json +66 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/android-firefox-slow.json +268 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/android-firefox-stop-release.json +128 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/capture.html +123 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-mouse-fling.json +64 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-mouse-slow.json +268 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-mouse-stop-release.json +124 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-pen-fling.json +64 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-pen-slow.json +268 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-pen-stop-release.json +124 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-touch-fling.json +84 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-touch-slow.json +381 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/desktop-chromium-touch-stop-release.json +171 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/ios-safari-fling.json +45 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/ios-safari-slow.json +101 -0
- package/src/gestures/__tests__/fixtures/pointer-streams/ios-safari-stop-release.json +130 -0
- package/src/hooks/__tests__/menuLinkClicks.ts +71 -0
- package/src/hooks/menuPressOnItems.ts +40 -0
- package/src/hooks/scrollGeometry.ts +71 -4
- package/src/hooks/useMenuHover.ts +6 -2
- package/src/hooks/usePressFeedback.doc.mjs +4 -4
- package/src/hooks/usePressFeedback.ts +5 -2
- package/src/hooks/useScrollableArea.test.tsx +185 -3
- package/src/hooks/useScrollableArea.ts +81 -7
- package/src/i18n/generated-locales/en.generated.ts +21 -0
- package/src/i18n/generated-locales/pseudo.generated.ts +23 -0
- package/src/motion/__tests__/animatedLayout.interaction.browser.spec.ts +572 -0
- package/src/motion/animatedLayout.boundary.test.ts +32 -10
- package/src/motion/animatedLayout.swap.test.ts +827 -0
- package/src/motion/animatedLayout.test.ts +442 -2
- package/src/motion/animatedLayout.ts +844 -58
- package/src/motion/transientCopy.ts +374 -0
- package/src/theme/defineTheme.test.ts +235 -2
- package/src/theme/defineTheme.ts +231 -19
- package/src/theme/derivedVarRegistry.test.ts +21 -0
- package/src/theme/derivedVarRegistry.ts +4 -0
- package/src/theme/extensibleAxes.test.ts +74 -29
- package/src/theme/syntax/SyntaxTheme.tsx +1 -1
- package/src/theme/syntax/defineSyntaxTheme.ts +1 -1
- package/src/theme/syntax/presets.ts +1 -1
- package/src/theme/syntax/tokens.ts +1 -1
- package/src/theme/tokens.stylex.ts +5 -0
- package/src/theme/tokens.test.ts +15 -0
- package/src/utils/interactionOverlay.stylex.ts +4 -1
- package/src/utils/pressFeedback.test.ts +310 -2
- package/src/utils/pressFeedback.ts +306 -54
- package/src/utils/pressGesture.test.ts +50 -0
- package/src/utils/pressGesture.ts +40 -2
package/CHANGELOG.md
CHANGED
|
@@ -58,7 +58,7 @@ Thanks to everyone who contributed to this release:
|
|
|
58
58
|
|
|
59
59
|
#### Fixes
|
|
60
60
|
|
|
61
|
-
- `TimeInput`'s arrow keys ignore a fractional increment instead of writing a malformed time such as "14:30.5": `adjustTime` returns the time unchanged for a fractional minute delta ([#7823](https://github.com/
|
|
61
|
+
- `TimeInput`'s arrow keys ignore a fractional increment instead of writing a malformed time such as "14:30.5": `adjustTime` returns the time unchanged for a fractional minute delta ([#7823](https://github.com/meta/astryx/pull/7823)).
|
|
62
62
|
- Screen readers now announce a `Button` that is first rendered with `isLoading` (for example after a remount). Its visually hidden loading live region mounts empty and gets "Loading" on the next frame, because screen readers skip a live region that already holds its text when it appears. A Button that becomes loading after it mounts is unchanged, and a Button mounted idle does no extra render.
|
|
63
63
|
- `ChatComposer`: screen readers now announce a status message, errors assertively and warnings politely, once per occasion: a rerender does not repeat it, and a status that clears and then returns is announced again. Before, the status bar mounted as a `role="alert"` or `role="status"` region already holding its text, which screen readers often skip. The message now goes through the shared announcement channel, and the visible bar no longer carries a live role. No API changes.
|
|
64
64
|
- `ChatSystemMessage`: a new chat notice inside a `ChatMessageList` now has one live region announcing it, the list's polite log, instead of also being a second live region nested in it (WCAG 2.2 SC 4.1.3). Its root no longer forces `role="status"`, in either variant, so date and divider rows are no longer presented as status messages, and a `role` passed to the component reaches its root. Tests that found a system message by the `status` role should query it by its text instead.
|
|
@@ -67,12 +67,12 @@ Thanks to everyone who contributed to this release:
|
|
|
67
67
|
- Keyboard and screen-reader users can now reach a disabled `ComplexSelector` and hear that it is unavailable (WCAG 2.2 SC 2.1.1 and 4.1.2). Before, its trigger rendered the native `disabled` attribute, so Tab skipped it and a focused trigger lost focus when disabled; now it exposes `aria-disabled="true"`, keeps focus, shows its keyboard focus outline, and still opens nothing. A press or key on it reaches no handler: not the toggle, not a caller's `onClick` or `onKeyDown`, and not an ancestor's click handler.
|
|
68
68
|
- Keyboard and screen-reader users can now reach a disabled `Calendar` day or `Pagination` dot and hear that it is disabled. Disabled `TreeList` rows' expand toggle and action button, disabled `Pagination` dots and disabled `Calendar` days expose `aria-disabled="true"` instead of the native `disabled` attribute, while clicks, Enter and Space still do nothing and arrow keys still skip disabled days as before. No API changes.
|
|
69
69
|
- `DateInput`: keyboard and screen-reader users can now reach a disabled date field and hear that it is disabled. A disabled or busy field no longer renders native `disabled`: its input and calendar button keep their place in the focus order and expose `aria-disabled`, while typing and opening stay blocked, and a focused disabled field shows its focus ring. Tests that query a disabled DateInput with `toBeDisabled()` or `:disabled` should check `aria-disabled="true"` instead.
|
|
70
|
-
- `DateRangeInput`: keyboard and screen-reader users can now reach a disabled field or preset and hear that it is disabled. A disabled or busy field and a disabled preset no longer render native `disabled`: the trigger, calendar button and presets keep their place in the focus order and expose `aria-disabled`, while opening and selecting stay blocked, and a focused disabled field shows its focus ring. Tests that query them with `toBeDisabled()` or `:disabled` should check `aria-disabled="true"` instead ([#7866](https://github.com/
|
|
70
|
+
- `DateRangeInput`: keyboard and screen-reader users can now reach a disabled field or preset and hear that it is disabled. A disabled or busy field and a disabled preset no longer render native `disabled`: the trigger, calendar button and presets keep their place in the focus order and expose `aria-disabled`, while opening and selecting stay blocked, and a focused disabled field shows its focus ring. Tests that query them with `toBeDisabled()` or `:disabled` should check `aria-disabled="true"` instead ([#7866](https://github.com/meta/astryx/pull/7866)).
|
|
71
71
|
- `DateTimeInput`: keyboard and screen-reader users can now reach a disabled or busy field and hear that it is disabled. It no longer renders native `disabled` on its text, native-picker or touch fields, or on its calendar and clock buttons: they keep their place in the focus order and expose `aria-disabled`, while typing, picking, opening and a caller's `onClick` stay blocked, and a focused disabled field shows its focus ring. `TimeInput`'s native picker button, which shares the time segment and stays out of the tab order, also moves from `disabled` to `aria-disabled` and stays inert. Tests that query a disabled DateTimeInput with `toBeDisabled()` or `:disabled` should check `aria-disabled="true"` instead.
|
|
72
72
|
- Apps that use Core's prebuilt CSS without a StyleX build step now get the default data colors: the prebuilt CSS defines the canonical `dataVars` defaults, so compiled imports and raw CSS references paint correctly.
|
|
73
73
|
- `Dialog`, `BottomSheet` and `BottomSheetSwitcher` stay open when a file picker inside them is dismissed. A file input fires a bubbling `cancel` event when its picker closes without a choice, and all three took that event for a close request of their own and closed (a switcher closed its whole flow). They now act only on a `cancel` aimed at their own `<dialog>`, so Escape and platform close requests (the Android back gesture) behave as before. No API changes.
|
|
74
74
|
- `DropdownMenuRadioGroup` now forwards `ref`, and its docs explain controlled selection, how to name the group, when the menu closes, and how it composes inside a `DropdownMenu`.
|
|
75
|
-
- `astryx init` writes the agent docs at the project root, in files the project commits, so Codex, Gemini CLI, Copilot CLI and Claude Code all read the block from the project root or any folder below it ([#7497](https://github.com/
|
|
75
|
+
- `astryx init` writes the agent docs at the project root, in files the project commits, so Codex, Gemini CLI, Copilot CLI and Claude Code all read the block from the project root or any folder below it ([#7497](https://github.com/meta/astryx/pull/7497)). It no longer writes agent docs into a project's subfolder, the home folder, or a settings folder in it such as `~/.gemini`.
|
|
76
76
|
- `AGENTS.md` holds the block, created when missing. Before, a project with only `CLAUDE.md` got the block only there, so Codex and Gemini CLI never saw it.
|
|
77
77
|
- Claude Code skips `AGENTS.md` in a folder that has a `CLAUDE.md` or `.claude/CLAUDE.md`, so the Claude Code file the project already has keeps a full copy: root `CLAUDE.md`, else `.claude/CLAUDE.md`. It keeps the copy even when it imports `AGENTS.md`, because Claude Code does not follow that import in a session started in a subfolder; started at the root, Claude Code then reads two. When both exist, the copy goes in root `CLAUDE.md`, which projects commit even when they ignore `.claude/`, and a block in `.claude/CLAUDE.md` is removed. Init creates no Claude file. `astryx upgrade` refreshes every copy, except in a project at the top of a home settings folder (see the next entry).
|
|
78
78
|
- Gemini CLI reads only `GEMINI.md`: init adds a one-line import, `@./AGENTS.md`, creating `GEMINI.md` when it is missing. It adds none when `GEMINI.md` already imports `AGENTS.md`, inline or on its own line. It adds the import even when the project's `.gemini/settings.json` has Gemini read `AGENTS.md` through `context.fileName`: Gemini loads those settings only when it starts at the project root, so a session started in a subfolder would otherwise get no copy. Started at the root, Gemini then reads two.
|
|
@@ -95,18 +95,18 @@ Thanks to everyone who contributed to this release:
|
|
|
95
95
|
- `Selector` options in a narrow list now shrink and truncate a long label with an ellipsis instead of being clipped past the list edge.
|
|
96
96
|
- `Switch`: a busy switch announces "Loading" once per busy start. Under React StrictMode the announcement used to be made twice.
|
|
97
97
|
- `TimeInput`: keyboard and screen-reader users can now reach a disabled field, or a busy bottom-sheet field, and hear that it is disabled. It no longer renders native `disabled` on its typed, native-picker or touch input or its picker button: they keep their place in the focus order and expose `aria-disabled`, while typing, arrow-key adjustment, opening, submitting a surrounding form with Enter, and a caller's `onClick` stay blocked, a draft typed before the field became disabled is dropped, and a focused disabled field shows its focus ring. Tests that query a disabled or busy TimeInput with `toBeDisabled()` or `:disabled` should check `aria-disabled="true"` instead.
|
|
98
|
-
- Pages that use `Timestamp` with an absolute format (`date`, `time`, `date_time` and the other fixed formats) now prerender in Next.js with `cacheComponents` turned on, where they used to fail the build: `Timestamp` no longer reads the current time while rendering on the server, and absolute formats never read the clock. `relative`, `relative_short` and `auto` read the clock on the client only: a server render or static prerender shows the full date and time in UTC, labelled, and the client switches to the format's normal output right after hydration, so server and client markup now always match. Client-only rendering is unchanged. No API changes ([#7883](https://github.com/
|
|
98
|
+
- Pages that use `Timestamp` with an absolute format (`date`, `time`, `date_time` and the other fixed formats) now prerender in Next.js with `cacheComponents` turned on, where they used to fail the build: `Timestamp` no longer reads the current time while rendering on the server, and absolute formats never read the clock. `relative`, `relative_short` and `auto` read the clock on the client only: a server render or static prerender shows the full date and time in UTC, labelled, and the client switches to the format's normal output right after hydration, so server and client markup now always match. Client-only rendering is unchanged. No API changes ([#7883](https://github.com/meta/astryx/pull/7883)).
|
|
99
99
|
- `Tooltip`: moving the pointer straight from the trigger onto the tooltip in one step no longer hides it, so it stays open while hovered (WCAG 2.2 SC 1.4.13).
|
|
100
|
-
- A `SideNavItem` in a collapsed `SideNav` now shows its tooltip on hover and gets `aria-describedby`, even when the item first appears inside an already-collapsed `SideNav`, the common case for saved collapse state. Before, only an item that collapsed after it appeared got a tooltip. Fixes [#7692](https://github.com/
|
|
100
|
+
- A `SideNavItem` in a collapsed `SideNav` now shows its tooltip on hover and gets `aria-describedby`, even when the item first appears inside an already-collapsed `SideNav`, the common case for saved collapse state. Before, only an item that collapsed after it appeared got a tooltip. Fixes [#7692](https://github.com/meta/astryx/issues/7692).
|
|
101
101
|
|
|
102
102
|
A `Tooltip` with an `anchorRef` that renders inside the very element the ref points at, as `SideNavItem` does, now attaches however it mounted. The effect now re-checks the anchor once the commit has finished attaching refs; event listeners and the `aria-describedby` merge and restore are unchanged.
|
|
103
103
|
|
|
104
104
|
- `TopNav` on narrow screens: a long `TopNavHeading` now gives way (it truncates with an ellipsis, or wraps when the heading is a link) instead of pushing the end content and the menu toggle past the edge of the bar, and the mobile drawer's close button is back on screen.
|
|
105
|
-
- `Typeahead`: clearing the value while editing it now empties the input and reports `onChangeQuery('')`, instead of leaving the old label in a field with no value. Fixes [#7038](https://github.com/
|
|
105
|
+
- `Typeahead`: clearing the value while editing it now empties the input and reports `onChangeQuery('')`, instead of leaving the old label in a field with no value. Fixes [#7038](https://github.com/meta/astryx/issues/7038).
|
|
106
106
|
|
|
107
107
|
#### Performance
|
|
108
108
|
|
|
109
|
-
- Pages with many code blocks, such as a long Markdown document, paint sooner on first load: `CodeBlock` inserts its syntax-highlight rules before the first layout read instead of after it, which cut first paint by 16–19% in 100–500 KB test documents ([#7875](https://github.com/
|
|
109
|
+
- Pages with many code blocks, such as a long Markdown document, paint sooner on first load: `CodeBlock` inserts its syntax-highlight rules before the first layout read instead of after it, which cut first paint by 16–19% in 100–500 KB test documents ([#7875](https://github.com/meta/astryx/pull/7875)). The rules and the highlighted output are unchanged.
|
|
110
110
|
- Pages that update around a long `Markdown` document stay responsive: Markdown skips re-rendering its document when a parent re-renders without changing the text or any rendering prop, and a link handler passed as a new function on each render no longer forces that work. The rendered output is unchanged.
|
|
111
111
|
|
|
112
112
|
#### Documentation
|
|
@@ -1362,7 +1362,7 @@ Thanks to everyone who contributed to this release:
|
|
|
1362
1362
|
|
|
1363
1363
|
**The horizontal clip mirrors under `dir="rtl"`.** `clip-path: inset()` is physical — top/right/bottom/left, no logical form — while the row itself reverses. Left unflipped, the leading segment sits to the _right_ of the node in RTL and still clipped its right edge, so the hole opened at the join between steps instead of at the indicator. Measured before the fix: `con0 x=622, indicator x=606, clips RIGHT edge`. After: `clips LEFT edge`, with LTR unchanged. The block axis needs no handling — `dir` does not reverse it.
|
|
1364
1364
|
|
|
1365
|
-
**One declaration covers both layers.** The gap has to reach the track (the segment's own background) and the accent fill (an absolutely placed `::before`). Spending it on each separately meant two declarations on two boxes, so a percentage resolved against a different containing block for each and stopped them ~1.2px apart. A single `clip-path: inset(…)` on the segment clips the element and its pseudo-element together against one reference box, so every accepted value behaves identically on both — which is what [#5824](https://github.com/
|
|
1365
|
+
**One declaration covers both layers.** The gap has to reach the track (the segment's own background) and the accent fill (an absolutely placed `::before`). Spending it on each separately meant two declarations on two boxes, so a percentage resolved against a different containing block for each and stopped them ~1.2px apart. A single `clip-path: inset(…)` on the segment clips the element and its pseudo-element together against one reference box, so every accepted value behaves identically on both — which is what [#5824](https://github.com/meta/astryx/pull/5824) requires of a public input across its full value domain. Clipping also cannot change layout, so the node the segment positions cannot move.
|
|
1366
1366
|
|
|
1367
1367
|
**No indicator, no gap.** `indicator="none"` renders no node, so a gap there is a hole in a track that is meant to be continuous.
|
|
1368
1368
|
|
|
@@ -1718,7 +1718,7 @@ Thanks to everyone who contributed to this release:
|
|
|
1718
1718
|
|
|
1719
1719
|
`MetadataListItem` targets its wrapper `<div>` when stacked and its `<dt>` when inline. A `TypeaheadItem` backed by caller-supplied `item.element` remains unchanged and does not receive forwarded props because that value may not be a cloneable element.
|
|
1720
1720
|
|
|
1721
|
-
This completes [#5254](https://github.com/
|
|
1721
|
+
This completes [#5254](https://github.com/meta/astryx/issues/5254) after [#5288](https://github.com/meta/astryx/pull/5288) by @lexs landed `List` and `Markdown` first, followed by [#5493](https://github.com/meta/astryx/pull/5493) by @gonzoblasco for `TreeList`.
|
|
1722
1722
|
|
|
1723
1723
|
- `Button` now reflects `elevation` as a theme target. The prop selected between four StyleX style objects but was missing from the sibling `themeProps('button')` call, so `data-elevation` never reached the DOM and no theme could style the axis — the same defect fixed on `Card` in #5491, and one `ButtonGroup` already had right. A button inside a `ButtonGroup` reports `none`, because the group owns the surface's elevation and the member paints flat. Every wrapper that forwards `ButtonProps` through to `Button` — `IconButton` — picks the reflection up with it. (`ToggleButton` does not: its props extend `BaseProps`, not `ButtonProps`, so it has no `elevation` to forward and keeps reporting `none`.) Nothing about the rendered button changes: 60 of 64 captured frames are byte-identical, and the four that differ do so only inside the loading spinner's own box. (#5552)
|
|
1724
1724
|
- Calendar: announce a cleared range in the provider locale, wrap the two-month layout instead of overflowing a narrow viewport, keep the selected date visible under forced colors (#5453)
|
|
@@ -3459,7 +3459,7 @@ Thanks to everyone who contributed to this release:
|
|
|
3459
3459
|
`height: '100%'`. With no sized parent, the skeleton collapsed to a zero-size
|
|
3460
3460
|
(invisible) element. The doc now sets a `playground.defaults` of
|
|
3461
3461
|
`width: 320` / `height: 80` so the shimmer placeholder renders visibly.
|
|
3462
|
-
- Update stale `facebookexperimental/xds` doc/JSDoc links to the current `facebook/astryx` namespace in source comments (theme/syntax `@see` references). The old org 301-redirects, so these weren't broken — just stale — and this matches the canonical org used elsewhere
|
|
3462
|
+
- Update stale `facebookexperimental/xds` doc/JSDoc links to the then-current `facebook/astryx` namespace in source comments (theme/syntax `@see` references). The old org 301-redirects, so these weren't broken — just stale — and this matches the canonical org used elsewhere
|
|
3463
3463
|
- Document Table's `verticalAlign` and `textOverflow` props, which were supported by the component but missing from the docsite properties tab
|
|
3464
3464
|
- Document TabList's `layout` prop ('hug' | 'fill') for tab sizing, which was supported by the component but missing from the docsite properties tab
|
|
3465
3465
|
- Document Text's `justify` prop, which was supported by the component but missing from the docsite properties tab (same omission previously fixed for Heading) (#2847-adjacent)
|
package/README.md
CHANGED
|
@@ -63,13 +63,13 @@ astryx gap-report # report a missing capability
|
|
|
63
63
|
|
|
64
64
|
| Package | Description |
|
|
65
65
|
| ----------------------------------------------------------------------------------------------------- | ------------------------------------------------------------- |
|
|
66
|
-
| [`@astryxdesign/cli`](https://github.com/
|
|
67
|
-
| [`@astryxdesign/theme-neutral`](https://github.com/
|
|
66
|
+
| [`@astryxdesign/cli`](https://github.com/meta/astryx/tree/main/packages/cli) | CLI tooling: component docs, templates, scaffolding, codemods |
|
|
67
|
+
| [`@astryxdesign/theme-neutral`](https://github.com/meta/astryx/tree/main/packages/themes/neutral) | Muted, minimal theme (Lucide icons) |
|
|
68
68
|
|
|
69
69
|
## Resources
|
|
70
70
|
|
|
71
71
|
- [Component Storybook](https://astryx.atmeta.com/storybook/)
|
|
72
|
-
- [GitHub Repository](https://github.com/
|
|
72
|
+
- [GitHub Repository](https://github.com/meta/astryx)
|
|
73
73
|
|
|
74
74
|
---
|
|
75
75
|
|
|
@@ -176,28 +176,6 @@ export interface AppShellProps extends BaseProps<HTMLDivElement> {
|
|
|
176
176
|
*/
|
|
177
177
|
topNav?: ReactNode;
|
|
178
178
|
}
|
|
179
|
-
/**
|
|
180
|
-
* Page shell for an application. Provides the structural frame for an app:
|
|
181
|
-
* top navigation, side navigation, and main content area.
|
|
182
|
-
*
|
|
183
|
-
* Slot-based API with `topNav`, `sideNav`, `banner`, and `children`.
|
|
184
|
-
* Supports two height modes (`fill` and `auto`), responsive side nav
|
|
185
|
-
* collapse, and mobile overlay with backdrop.
|
|
186
|
-
*
|
|
187
|
-
* @example
|
|
188
|
-
* ```
|
|
189
|
-
* <AppShell
|
|
190
|
-
* topNav={<TopNav label="Navigation" heading={<TopNavHeading heading="My App" />} />}
|
|
191
|
-
* sideNav={<SideNav>{navSections}</SideNav>}
|
|
192
|
-
* mobileNav={
|
|
193
|
-
* <MobileNav isOpen={mobileOpen} onOpenChange={(open) => setMobileOpen(open)} header="My App">
|
|
194
|
-
* {navSections}
|
|
195
|
-
* </MobileNav>
|
|
196
|
-
* }>
|
|
197
|
-
* <Content />
|
|
198
|
-
* </AppShell>
|
|
199
|
-
* ```
|
|
200
|
-
*/
|
|
201
179
|
export declare function AppShell({ variant, banner, children, contentPadding, 'data-testid': dataTestId, height, mobileNav, sideNav, topNav, xstyle, className, style, ref, ...rest }: AppShellProps): React.JSX.Element;
|
|
202
180
|
export declare namespace AppShell {
|
|
203
181
|
var displayName: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AppShell.d.ts","sourceRoot":"","sources":["../../src/AppShell/AppShell.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAQL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"AppShell.d.ts","sourceRoot":"","sources":["../../src/AppShell/AppShell.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAQL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAgCf,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAChD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAQ5C,OAAO,EAEL,KAAK,mBAAmB,EACzB,MAAM,2BAA2B,CAAC;AACnC,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,SAAS,CAAC;AAsChD;;;GAGG;AACH,MAAM,MAAM,kBAAkB,GAAG,mBAAmB,GAAG,MAAM,CAAC;AAE9D;;;;;;;GAOG;AAEH;;GAEG;AACH,MAAM,MAAM,eAAe,GAAG,MAAM,kBAAkB,CAAC;AAEvD;;;GAGG;AACH,MAAM,WAAW,eAAe;IAC9B;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;OAEG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAEzC;;;;OAIG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,kBAAkB,CAAC;IAEhC;;;;;;;;;;OAUG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B;AAED,MAAM,WAAW,aAAc,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC;;;;;;;OAOG;IACH,OAAO,CAAC,EAAE,eAAe,CAAC;IAE1B;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;;;;OAOG;IACH,cAAc,CAAC,EAAE,WAAW,CAAC;IAE7B;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAEzB;;;;;;;;;;;;;;;;;;;;;OAqBG;IACH,SAAS,CAAC,EAAE,KAAK,GAAG,eAAe,GAAG,SAAS,CAAC;IAEhD;;;;;;;;;;;;;;;;;;;;;;;;;OAyBG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IAEpB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAqND,wBAAgB,QAAQ,CAAC,EACvB,OAAoB,EACpB,MAAM,EACN,QAAQ,EACR,cAAc,EACd,aAAa,EAAE,UAAU,EACzB,MAAe,EACf,SAAS,EACT,OAAO,EACP,MAAM,EACN,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,IAAI,EACR,EAAE,aAAa,qBAykBf;yBAxlBe,QAAQ"}
|
|
@@ -31,6 +31,9 @@ import { LayoutContent } from "../Layout/LayoutContent.js";
|
|
|
31
31
|
import { MobileNavToggle } from "../MobileNav/MobileNavToggle.js";
|
|
32
32
|
import { MAX_CLOSE_DELAY_MS as MOBILE_NAV_MAX_CLOSE_DELAY_MS } from "../MobileNav/MobileNav.js";
|
|
33
33
|
import { SideNavRenderContext } from "../SideNav/SideNavRenderContext.js";
|
|
34
|
+
import { SideNavShellContext } from "../SideNav/railMotion.js";
|
|
35
|
+
import { useAnimatedLayout } from "../hooks/useAnimatedLayout.js";
|
|
36
|
+
import { holdLayoutSwap, landLayoutGlide, layoutMotionFor, playLayoutFrames, playLayoutSwap, reportLayoutChange } from "../motion/animatedLayout.js";
|
|
34
37
|
import { TopNavRenderContext } from "../TopNav/TopNavRenderContext.js";
|
|
35
38
|
import { TopNavMobileContentContext } from "../TopNav/TopNavMobileContentContext.js";
|
|
36
39
|
import { AppShellMobileContext } from "./AppShellMobileContext.js";
|
|
@@ -229,6 +232,18 @@ const styles = {
|
|
|
229
232
|
* </AppShell>
|
|
230
233
|
* ```
|
|
231
234
|
*/
|
|
235
|
+
|
|
236
|
+
/**
|
|
237
|
+
* The column beside the rail that holds `main`: its ancestor whose parent
|
|
238
|
+
* also holds the rail. The glide moves it; the rail's edge rides it.
|
|
239
|
+
*/
|
|
240
|
+
function columnOf(main, rail) {
|
|
241
|
+
let column = main;
|
|
242
|
+
while (column.parentElement != null && !column.parentElement.contains(rail)) {
|
|
243
|
+
column = column.parentElement;
|
|
244
|
+
}
|
|
245
|
+
return column;
|
|
246
|
+
}
|
|
232
247
|
export function AppShell({
|
|
233
248
|
variant = 'elevated',
|
|
234
249
|
banner,
|
|
@@ -437,6 +452,139 @@ export function AppShell({
|
|
|
437
452
|
}) : undefined;
|
|
438
453
|
|
|
439
454
|
// =========================================================================
|
|
455
|
+
// While the inline side nav collapses or expands, the content area holds
|
|
456
|
+
// its own animated layout handle (`component:AppShell` FR17): the column
|
|
457
|
+
// beside the rail glides from its old place, and the content swaps its old
|
|
458
|
+
// wrap for its new one in place (`spec:AST-105` FR8), on the rail's clock
|
|
459
|
+
// (`component:SideNav` FR6).
|
|
460
|
+
const railRef = useRef(null);
|
|
461
|
+
const mainRef = useRef(null);
|
|
462
|
+
const backdropRef = useRef(null);
|
|
463
|
+
const contentLayout = useAnimatedLayout({
|
|
464
|
+
containerRef: shellRef
|
|
465
|
+
});
|
|
466
|
+
const pendingContentRef = useRef(null);
|
|
467
|
+
// The running swap: when it started and its wraps' starting opacities, so a
|
|
468
|
+
// change made during it starts its cross-fade from what the content shows.
|
|
469
|
+
const lastSwapRef = useRef(null);
|
|
470
|
+
const sideNavShell = useMemo(() => ({
|
|
471
|
+
animatedLayout: contentLayout,
|
|
472
|
+
rail: () => railRef.current,
|
|
473
|
+
column: () => mainRef.current == null ? null : columnOf(mainRef.current, railRef.current),
|
|
474
|
+
landContent() {
|
|
475
|
+
if (mainRef.current != null) {
|
|
476
|
+
landLayoutGlide(columnOf(mainRef.current, railRef.current));
|
|
477
|
+
}
|
|
478
|
+
},
|
|
479
|
+
beforeRailChange() {
|
|
480
|
+
const main = mainRef.current;
|
|
481
|
+
if (main == null) {
|
|
482
|
+
return;
|
|
483
|
+
}
|
|
484
|
+
const motion = layoutMotionFor(main);
|
|
485
|
+
// Only a spring glides the column; under Reduce Motion the two wraps
|
|
486
|
+
// cross-fade over a steady surface (`design:reduced-motion` DR2).
|
|
487
|
+
let change = null;
|
|
488
|
+
if (motion.kind === 'spring') {
|
|
489
|
+
change = reportLayoutChange(contentLayout, railRef);
|
|
490
|
+
change.measureBefore();
|
|
491
|
+
}
|
|
492
|
+
// At rest the copy (the wrap shown now) starts opaque and the entering
|
|
493
|
+
// wrap unseen; mid-swap the wrap in the DOM is the entering one and
|
|
494
|
+
// the copy's wrap is the one entering next, each at what it shows.
|
|
495
|
+
let held = 1;
|
|
496
|
+
let entering = 0;
|
|
497
|
+
const last = lastSwapRef.current;
|
|
498
|
+
if (last != null && motion.kind === 'spring') {
|
|
499
|
+
const elapsed = Number(main.ownerDocument.timeline?.currentTime ?? 0) - last.startedAt;
|
|
500
|
+
if (elapsed < motion.progress.durationMs) {
|
|
501
|
+
const p = 1 - motion.progress.remaining(elapsed);
|
|
502
|
+
held = last.entering + (1 - last.entering) * p;
|
|
503
|
+
entering = last.held * (1 - p);
|
|
504
|
+
}
|
|
505
|
+
}
|
|
506
|
+
lastSwapRef.current = null;
|
|
507
|
+
pendingContentRef.current = {
|
|
508
|
+
change,
|
|
509
|
+
swap: holdLayoutSwap(contentLayout, main, {
|
|
510
|
+
isVisiblePart: true
|
|
511
|
+
}),
|
|
512
|
+
before: main.getBoundingClientRect(),
|
|
513
|
+
held,
|
|
514
|
+
entering
|
|
515
|
+
};
|
|
516
|
+
},
|
|
517
|
+
afterRailChange() {
|
|
518
|
+
const pending = pendingContentRef.current;
|
|
519
|
+
pendingContentRef.current = null;
|
|
520
|
+
const main = mainRef.current;
|
|
521
|
+
if (pending == null || main == null) {
|
|
522
|
+
return () => {};
|
|
523
|
+
}
|
|
524
|
+
pending.change?.animate();
|
|
525
|
+
// The column beside the rail, which the glide moves: the copy sits
|
|
526
|
+
// beside it, in its parent, and rides its glide.
|
|
527
|
+
const column = columnOf(main, railRef.current);
|
|
528
|
+
const after = main.getBoundingClientRect();
|
|
529
|
+
const isRtl = getComputedStyle(main).direction === 'rtl';
|
|
530
|
+
const travel = isRtl ? pending.before.right - after.right : pending.before.left - after.left;
|
|
531
|
+
// An expand slides the narrower column in from its old start, which
|
|
532
|
+
// opens a gap at its trailing edge: the content surface (the elevated
|
|
533
|
+
// backdrop, or the main element) reaches over it as it closes,
|
|
534
|
+
// whether or not the old wrap is held.
|
|
535
|
+
const cover = [];
|
|
536
|
+
const surface = backdropRef.current ?? main;
|
|
537
|
+
const color = getComputedStyle(surface).backgroundColor;
|
|
538
|
+
const isPainted = !/^rgba\(.*,\s*0\)$|^transparent$/.test(color);
|
|
539
|
+
const glides = layoutMotionFor(main).kind === 'spring';
|
|
540
|
+
if ((isRtl ? travel > 0 : travel < 0) && glides && isPainted) {
|
|
541
|
+
cover.push({
|
|
542
|
+
element: surface,
|
|
543
|
+
frames: p => ({
|
|
544
|
+
boxShadow: `${-travel * (1 - p)}px 0px 0px 0px ${color}`
|
|
545
|
+
})
|
|
546
|
+
});
|
|
547
|
+
}
|
|
548
|
+
if (pending.swap == null || column.parentElement == null) {
|
|
549
|
+
return playLayoutFrames(contentLayout, cover);
|
|
550
|
+
}
|
|
551
|
+
// Under Reduce Motion nothing glides: the old wrap's copy paints the
|
|
552
|
+
// surface it sat on, so that surface fades out with it where it was
|
|
553
|
+
// (`design:reduced-motion` DR2) instead of leaving a bare strip.
|
|
554
|
+
if (!glides && isPainted) {
|
|
555
|
+
pending.swap.copy.style.backgroundColor = color;
|
|
556
|
+
}
|
|
557
|
+
const {
|
|
558
|
+
held,
|
|
559
|
+
entering
|
|
560
|
+
} = pending;
|
|
561
|
+
lastSwapRef.current = {
|
|
562
|
+
startedAt: Number(main.ownerDocument.timeline?.currentTime ?? 0),
|
|
563
|
+
held,
|
|
564
|
+
entering
|
|
565
|
+
};
|
|
566
|
+
return playLayoutSwap(pending.swap, {
|
|
567
|
+
host: column.parentElement,
|
|
568
|
+
copy: p => ({
|
|
569
|
+
opacity: held * (1 - p)
|
|
570
|
+
}),
|
|
571
|
+
rideWith: {
|
|
572
|
+
element: column,
|
|
573
|
+
travel: {
|
|
574
|
+
x: travel,
|
|
575
|
+
y: 0
|
|
576
|
+
}
|
|
577
|
+
},
|
|
578
|
+
incoming: [...Array.from(main.children, element => ({
|
|
579
|
+
element,
|
|
580
|
+
frames: p => ({
|
|
581
|
+
opacity: entering + (1 - entering) * p
|
|
582
|
+
})
|
|
583
|
+
})), ...cover]
|
|
584
|
+
});
|
|
585
|
+
}
|
|
586
|
+
}), [contentLayout]);
|
|
587
|
+
|
|
440
588
|
// Build sideNav content
|
|
441
589
|
//
|
|
442
590
|
// In auto mode, the sideNav panel is not internally scrollable (the page
|
|
@@ -445,6 +593,7 @@ export function AppShell({
|
|
|
445
593
|
// the sticky behavior since LayoutPanel doesn't accept style/className.
|
|
446
594
|
// =========================================================================
|
|
447
595
|
const sideNavPanel = showSideNavInline ? /*#__PURE__*/_jsx(LayoutPanel, {
|
|
596
|
+
ref: railRef,
|
|
448
597
|
padding: 0,
|
|
449
598
|
hasDivider: navHasDividers,
|
|
450
599
|
isScrollable: isFill,
|
|
@@ -452,7 +601,10 @@ export function AppShell({
|
|
|
452
601
|
variant
|
|
453
602
|
}),
|
|
454
603
|
xstyle: [navAreaStyle, isAuto && stickyBgStyle, isAuto && styles.panelAutoFill],
|
|
455
|
-
children:
|
|
604
|
+
children: /*#__PURE__*/_jsx(SideNavShellContext, {
|
|
605
|
+
value: sideNavShell,
|
|
606
|
+
children: sideNav
|
|
607
|
+
})
|
|
456
608
|
}) : undefined;
|
|
457
609
|
const sideNavContent = sideNavPanel != null && isAuto ? /*#__PURE__*/_jsx("div", {
|
|
458
610
|
...{
|
|
@@ -466,6 +618,7 @@ export function AppShell({
|
|
|
466
618
|
// =========================================================================
|
|
467
619
|
const shouldElevateWithCorner = isElevated && hasTopNav && showSideNavInline;
|
|
468
620
|
const mainInner = /*#__PURE__*/_jsx(LayoutContent, {
|
|
621
|
+
ref: mainRef,
|
|
469
622
|
padding: contentPadding ?? 0,
|
|
470
623
|
role: "main",
|
|
471
624
|
id: MAIN_CONTENT_ID
|
|
@@ -490,6 +643,7 @@ export function AppShell({
|
|
|
490
643
|
}
|
|
491
644
|
}[!!shouldElevateWithCorner << 0],
|
|
492
645
|
children: [shouldElevateWithCorner && /*#__PURE__*/_jsx("div", {
|
|
646
|
+
ref: backdropRef,
|
|
493
647
|
...{
|
|
494
648
|
className: "x10l6tqk x10a8y8t x10xzikg x183tx6i x47corl"
|
|
495
649
|
}
|
package/dist/Banner/Banner.d.ts
CHANGED
|
@@ -8,6 +8,7 @@
|
|
|
8
8
|
* - Banner frame (themeProps 'banner-frame'): owns the resting elevation and,
|
|
9
9
|
* for elevated card banners, the outer radius that shapes that shadow
|
|
10
10
|
* - Header area (themeProps 'banner'): colored status background with icon, title, description, actions, dismiss
|
|
11
|
+
* - End area restores the ordinary text context for consumer `endContent`; built-in controls opt back into the status foreground
|
|
11
12
|
* - Content area (themeProps 'banner-content'): card background for additional content (children)
|
|
12
13
|
* - Status icon (themeProps 'banner-icon'): the target rides on the default
|
|
13
14
|
* <Icon> itself — the element that paints — so 'status:X' overrides reach
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../src/Banner/Banner.tsx"],"names":[],"mappings":"AAIA
|
|
1
|
+
{"version":3,"file":"Banner.d.ts","sourceRoot":"","sources":["../../src/Banner/Banner.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;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;AA4QD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoDG;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,sCAqQb;yBAzRe,MAAM"}
|
package/dist/Banner/Banner.js
CHANGED
|
@@ -12,6 +12,7 @@
|
|
|
12
12
|
* - Banner frame (themeProps 'banner-frame'): owns the resting elevation and,
|
|
13
13
|
* for elevated card banners, the outer radius that shapes that shadow
|
|
14
14
|
* - Header area (themeProps 'banner'): colored status background with icon, title, description, actions, dismiss
|
|
15
|
+
* - End area restores the ordinary text context for consumer `endContent`; built-in controls opt back into the status foreground
|
|
15
16
|
* - Content area (themeProps 'banner-content'): card background for additional content (children)
|
|
16
17
|
* - Status icon (themeProps 'banner-icon'): the target rides on the default
|
|
17
18
|
* <Icon> itself — the element that paints — so 'status:X' overrides reach
|
|
@@ -148,6 +149,7 @@ const styles = {
|
|
|
148
149
|
kjj79g: "x13a6bvl",
|
|
149
150
|
kOIVth: "x1txdalj",
|
|
150
151
|
kmuXW: "x2lah0s",
|
|
152
|
+
kMwMTN: "x1tgivj0",
|
|
151
153
|
ks0D6T: "x193iq5w",
|
|
152
154
|
keTefX: "xvc5jky",
|
|
153
155
|
kqGvvJ: "x81ka23",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BottomSheetPanel.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetPanel.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA8B5C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAGL,KAAK,oBAAoB,EAC1B,MAAM,eAAe,CAAC;AAIvB,QAAA,MAAM,cAAc;;;;CAIV,CAAC;AAEX,MAAM,MAAM,iBAAiB,GAAG,MAAM,OAAO,cAAc,CAAC;AAC5D,YAAY,EAAC,oBAAoB,EAAC,CAAC;AA+CnC,eAAO,MAAM,2BAA2B,2DACkB,CAAC;
|
|
1
|
+
{"version":3,"file":"BottomSheetPanel.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetPanel.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA8B5C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAGL,KAAK,oBAAoB,EAC1B,MAAM,eAAe,CAAC;AAIvB,QAAA,MAAM,cAAc;;;;CAIV,CAAC;AAEX,MAAM,MAAM,iBAAiB,GAAG,MAAM,OAAO,cAAc,CAAC;AAC5D,YAAY,EAAC,oBAAoB,EAAC,CAAC;AA+CnC,eAAO,MAAM,2BAA2B,2DACkB,CAAC;AAiN3D,MAAM,MAAM,sBAAsB,GAChC,UAAU,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;AAEjD,MAAM,MAAM,qBAAqB,GAC7B;IAAC,IAAI,EAAE,QAAQ,CAAA;CAAC,GAChB;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,QAAQ,EAAE,OAAO,CAAA;CAAC,GACjC;IACE,IAAI,EAAE,UAAU,CAAC;IACjB,MAAM,EAAE,SAAS,GAAG,UAAU,GAAG,QAAQ,CAAC;IAC1C,eAAe,EAAE,MAAM,CAAC;CACzB,GACD;IAAC,IAAI,EAAE,SAAS,CAAA;CAAC,CAAC;AAEtB,UAAU,qBAAsB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAC/D,+CAA+C;IAC/C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAChC,KAAK,EAAE,qBAAqB,CAAC;IAC7B;;;;;OAKG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,MAAM,EAAE,iBAAiB,GAAG,MAAM,GAAG,MAAM,CAAC;IAC5C,mEAAmE;IACnE,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,UAAU,CAAC,EAAE,aAAa,CAAC,oBAAoB,CAAC,CAAC;IACjD,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,gFAAgF;IAChF,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,cAAc,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAC;IAC3D,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,sBAAsB,KAAK,IAAI,CAAC;IACzD,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,sBAAsB,KAAK,IAAI,CAAC;CAC7D;AA4HD,4EAA4E;AAC5E,wBAAgB,gBAAgB,CAAC,EAC/B,GAAG,EACH,KAAK,EACL,eAAe,EACf,MAAM,EACN,KAAK,EACL,QAAQ,EACR,OAAO,EACP,UAAU,EACV,SAAS,EACT,KAAK,EACL,QAAQ,EACR,MAAM,EACN,qBAA4B,EAC5B,kBAA0B,EAC1B,SAAS,EACT,cAAc,EACd,eAAe,EACf,aAAa,EACb,gBAAgB,EAChB,GAAG,KAAK,EACT,EAAE,qBAAqB,+BAyXvB;yBA9Ye,gBAAgB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bottomSheetStack.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/bottomSheetStack.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"bottomSheetStack.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/bottomSheetStack.ts"],"names":[],"mappings":"AAyGA,MAAM,WAAW,oBAAoB;IACnC,2DAA2D;IAC3D,QAAQ,CAAC,SAAS,EAAE,OAAO,CAAC;IAC5B,mDAAmD;IACnD,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAC;IACxB,gEAAgE;IAChE,QAAQ,CAAC,SAAS,EAAE,OAAO,CAAC;IAC5B,oEAAoE;IACpE,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,uEAAuE;IACvE,QAAQ,CAAC,SAAS,EAAE,OAAO,CAAC;IAC5B;;;OAGG;IACH,QAAQ,CAAC,cAAc,EAAE,OAAO,CAAC;IACjC;;;OAGG;IACH,QAAQ,CAAC,SAAS,EAAE,OAAO,CAAC;IAC5B;;;;OAIG;IACH,QAAQ,CAAC,gBAAgB,EAAE,OAAO,CAAC;IACnC;;;;OAIG;IACH,QAAQ,CAAC,cAAc,EAAE,yBAAyB,GAAG,IAAI,CAAC;IAC1D,6EAA6E;IAC7E,QAAQ,CAAC,eAAe,EAAE,MAAM,CAAC;IACjC,6EAA6E;IAC7E,QAAQ,CAAC,WAAW,EAAE,OAAO,CAAC;CAC/B;AAED,MAAM,MAAM,yBAAyB,GAAG,SAAS,GAAG,UAAU,GAAG,QAAQ,CAAC;AAE1E,2EAA2E;AAC3E,MAAM,MAAM,wBAAwB,GAClC,UAAU,GAAG,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;AAEjD,eAAO,MAAM,+BAA+B,EAAE,oBAY7C,CAAC;AAEF;;;;;GAKG;AACH,MAAM,MAAM,sBAAsB,GAAG,MAAM,GAAG,QAAQ,GAAG,SAAS,CAAC;AAcnE,MAAM,WAAW,4BAA4B;IAC3C,sDAAsD;IACtD,GAAG,EAAE,MAAM,CAAC;IACZ,gCAAgC;IAChC,UAAU,EAAE,MAAM,iBAAiB,GAAG,IAAI,CAAC;IAC3C;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,MAAM,OAAO,GAAG,IAAI,CAAC;IACrC,8EAA8E;IAC9E,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,sEAAsE;IACtE,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,6EAA6E;IAC7E,KAAK,EAAE,CAAC,MAAM,EAAE,sBAAsB,KAAK,IAAI,CAAC;IAChD;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,WAAW,GAAG,IAAI,CAAC;IAC3C,oDAAoD;IACpD,MAAM,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAC7C;;;OAGG;IACH,WAAW,CAAC,EAAE,sBAAsB,CAAC;CACtC;AAED,MAAM,WAAW,sBAAsB;IACrC,mEAAmE;IACnE,QAAQ,EAAE,MAAM,WAAW,GAAG,IAAI,CAAC;IACnC,mEAAmE;IACnE,SAAS,EAAE,MAAM,WAAW,GAAG,IAAI,CAAC;IACpC,wEAAwE;IACxE,SAAS,EAAE,CAAC,MAAM,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IAChD,gFAAgF;IAChF,MAAM,EAAE,MAAM,IAAI,CAAC;CACpB;AAyMD;;;;GAIG;AACH,wBAAgB,oBAAoB,IAAI,IAAI,CAW3C;AAoDD;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAGtD;AAaD;;;;GAIG;AACH,wBAAgB,oBAAoB,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,CAOtD;AA4PD;;;;;;;;;;;;GAYG;AACH,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,iBAAiB,GAAG,IAAI,CAqBlE;AAED;;;;;GAKG;AACH,wBAAgB,qBAAqB,CAAC,MAAM,EAAE,iBAAiB,GAAG,IAAI,CAQrE;AAED,wEAAwE;AACxE,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,iBAAiB,CAC/B,MAAM,EAAE,iBAAiB,GAAG,IAAI,EAChC,OAAO,EAAE,GAAG,GAAG,GAAG,EAClB,OAAO,EAAE,qBAAqB,GAC7B,IAAI,CAoBN;AAED,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,qBAAqB,GAAG,IAAI,CAKrE;AAED;;;;GAIG;AACH,wBAAgB,oBAAoB,CAClC,MAAM,EAAE,iBAAiB,GAAG,IAAI,GAC/B,OAAO,CAaT;AAED;;;;GAIG;AACH,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,OAAO,GAAG,OAAO,CAE7D;AAwGD;;;;;GAKG;AACH,wBAAgB,uBAAuB,CAAC,GAAG,EAAE,QAAQ,GAAG,IAAI,CAoC3D;AAwBD;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,qBAAqB,CACnC,MAAM,EAAE,iBAAiB,EACzB,KAAK,EAAE,WAAW,GAAG,IAAI,GACxB,IAAI,CA8CN;AAgFD,+DAA+D;AAC/D,wBAAgB,aAAa,CAAC,MAAM,EAAE,iBAAiB,GAAG,IAAI,CAoB7D;AAED;;;;;;;GAOG;AACH,wBAAgB,uBAAuB,CACrC,MAAM,EAAE,iBAAiB,GAAG,IAAI,GAC/B,IAAI,CAcN;AA4ND;;;;;GAKG;AACH,wBAAgB,uBAAuB,CACrC,GAAG,EAAE,MAAM,EACX,KAAK,EAAE,OAAO,GAAG,UAAU,EAC3B,MAAM,EAAE,wBAAwB,GAC/B,IAAI,CA4DN;AAwID;;;;;GAKG;AACH,wBAAgB,mBAAmB,CACjC,YAAY,EAAE,4BAA4B,EAC1C,MAAM,EAAE,OAAO,EACf,OAAO,GAAE,OAAc,GACtB,MAAM,IAAI,CAmGZ;AAED;;;;;;;GAOG;AACH,wBAAgB,4BAA4B,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,CAe9D;AAED;;;;GAIG;AACH,wBAAgB,kBAAkB,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,GAAG,IAAI,CA8CrE;AAsBD;;;;GAIG;AACH,wBAAgB,qBAAqB,CACnC,GAAG,EAAE,MAAM,GACV;IAAC,OAAO,EAAE,iBAAiB,CAAC;IAAC,KAAK,EAAE,MAAM,IAAI,CAAA;CAAC,GAAG,IAAI,CAcxD;AAMD;;;;;;;;;GASG;AACH,wBAAgB,eAAe,CAC7B,KAAK,EAAE,WAAW,GAAG,IAAI,EACzB,MAAM,EAAE,sBAAsB,EAC9B,OAAO,EAAE,OAAO,GACf,IAAI,CA2CN;AAED,iFAAiF;AACjF,wBAAgB,2BAA2B,CACzC,GAAG,GAAE,QAAmB,EACxB,OAAO,GAAE,OAAc,GACtB,aAAa,CAAC;IACf,OAAO,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAClC,MAAM,EAAE,OAAO,CAAC;IAChB,IAAI,EAAE,oBAAoB,CAAC;CAC5B,CAAC,CAMD;AAED,sEAAsE;AACtE,wBAAgB,6BAA6B,IAAI,IAAI,CA+BpD;AAED,+FAA+F;AAC/F,eAAO,MAAM,kCAAkC;;;;sBAI3B,MAAM;IAExB,8DAA8D;iCACjC,QAAQ;CACtC,CAAC"}
|
|
@@ -1126,14 +1126,37 @@ function finishReplace(replaced) {
|
|
|
1126
1126
|
replaced.hide();
|
|
1127
1127
|
replaced.replaceable?.finish();
|
|
1128
1128
|
}
|
|
1129
|
+
|
|
1130
|
+
/**
|
|
1131
|
+
* The viewport top a panel rests at: its box without the translation it is
|
|
1132
|
+
* still travelling under (an entering panel rises from below the viewport).
|
|
1133
|
+
* Read from the panel itself, never from the element around it: a standalone
|
|
1134
|
+
* sheet's panel sits directly in its dialog, which spans the viewport, so a
|
|
1135
|
+
* parent's top is not where the panel rests.
|
|
1136
|
+
*/
|
|
1137
|
+
function restingTopOfPanel(panel) {
|
|
1138
|
+
const top = panel.getBoundingClientRect().top;
|
|
1139
|
+
const view = panel.ownerDocument.defaultView;
|
|
1140
|
+
if (view == null || typeof view.DOMMatrixReadOnly !== 'function') {
|
|
1141
|
+
return top;
|
|
1142
|
+
}
|
|
1143
|
+
const {
|
|
1144
|
+
transform
|
|
1145
|
+
} = view.getComputedStyle(panel);
|
|
1146
|
+
if (transform === '' || transform === 'none') {
|
|
1147
|
+
return top;
|
|
1148
|
+
}
|
|
1149
|
+
// A sheet panel only ever translates on the block axis (entrance, drag,
|
|
1150
|
+
// alignment); its computed matrix's `m42` is that translation.
|
|
1151
|
+
return top - new view.DOMMatrixReadOnly(transform).m42;
|
|
1152
|
+
}
|
|
1129
1153
|
function alignmentOffsetForPanels(enteringPanel, retainedPanel) {
|
|
1130
1154
|
if (enteringPanel == null || retainedPanel == null) {
|
|
1131
1155
|
return 0;
|
|
1132
1156
|
}
|
|
1133
|
-
// The
|
|
1134
|
-
//
|
|
1135
|
-
|
|
1136
|
-
return Math.max(0, enteringTop - retainedPanel.getBoundingClientRect().top);
|
|
1157
|
+
// The retained panel is at rest; the entering panel is measured where its
|
|
1158
|
+
// entrance will leave it.
|
|
1159
|
+
return Math.max(0, restingTopOfPanel(enteringPanel) - retainedPanel.getBoundingClientRect().top);
|
|
1137
1160
|
}
|
|
1138
1161
|
|
|
1139
1162
|
/**
|
|
@@ -66,6 +66,18 @@
|
|
|
66
66
|
* - /packages/core/src/BottomSheet/useSheetGestures.test.ts
|
|
67
67
|
*/
|
|
68
68
|
import { type CSSProperties, type MouseEvent as ReactMouseEvent, type PointerEvent as ReactPointerEvent, type RefObject, type TouchEvent as ReactTouchEvent, type UIEvent as ReactUIEvent } from 'react';
|
|
69
|
+
/**
|
|
70
|
+
* Whether a gesture that lands on `target` began inside another layer
|
|
71
|
+
* rendered in this sheet's content — a `<dialog>` between the target and the
|
|
72
|
+
* body. A sheet opened from inside a sheet's content, a Dialog opened there,
|
|
73
|
+
* renders its dialog as a descendant of the host's body, so its pointer and
|
|
74
|
+
* touch events bubble through the host's gesture listeners. That gesture is
|
|
75
|
+
* the layer's own: the host must neither arm a drag on it nor take pointer
|
|
76
|
+
* capture for it, which would cancel the drag the layer's own handle began
|
|
77
|
+
* (`component:BottomSheet` FR7: a swipe reaches only the top sheet of a
|
|
78
|
+
* stack; FR6: a covered sheet is blocked).
|
|
79
|
+
*/
|
|
80
|
+
export declare function isInsideNestedLayer(target: EventTarget | null, body: HTMLElement): boolean;
|
|
69
81
|
/**
|
|
70
82
|
* The scrollers a gesture that lands on `target` can scroll, innermost first
|
|
71
83
|
* and the body last: every scrollable box between the target and the body,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSheetGestures.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/useSheetGestures.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"useSheetGestures.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/useSheetGestures.ts"],"names":[],"mappings":"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"}
|
|
@@ -200,6 +200,26 @@ function isBlockScroller(element) {
|
|
|
200
200
|
return overflowY === 'auto' || overflowY === 'scroll';
|
|
201
201
|
}
|
|
202
202
|
|
|
203
|
+
/**
|
|
204
|
+
* Whether a gesture that lands on `target` began inside another layer
|
|
205
|
+
* rendered in this sheet's content — a `<dialog>` between the target and the
|
|
206
|
+
* body. A sheet opened from inside a sheet's content, a Dialog opened there,
|
|
207
|
+
* renders its dialog as a descendant of the host's body, so its pointer and
|
|
208
|
+
* touch events bubble through the host's gesture listeners. That gesture is
|
|
209
|
+
* the layer's own: the host must neither arm a drag on it nor take pointer
|
|
210
|
+
* capture for it, which would cancel the drag the layer's own handle began
|
|
211
|
+
* (`component:BottomSheet` FR7: a swipe reaches only the top sheet of a
|
|
212
|
+
* stack; FR6: a covered sheet is blocked).
|
|
213
|
+
*/
|
|
214
|
+
export function isInsideNestedLayer(target, body) {
|
|
215
|
+
for (let element = target instanceof Element ? target : null; element != null && element !== body; element = element.parentElement) {
|
|
216
|
+
if (element.localName === 'dialog') {
|
|
217
|
+
return true;
|
|
218
|
+
}
|
|
219
|
+
}
|
|
220
|
+
return false;
|
|
221
|
+
}
|
|
222
|
+
|
|
203
223
|
/**
|
|
204
224
|
* The scrollers a gesture that lands on `target` can scroll, innermost first
|
|
205
225
|
* and the body last: every scrollable box between the target and the body,
|
|
@@ -897,7 +917,13 @@ export function useSheetGestures({
|
|
|
897
917
|
if (event.button !== 0 || !event.isPrimary) {
|
|
898
918
|
return;
|
|
899
919
|
}
|
|
900
|
-
const
|
|
920
|
+
const body = event.currentTarget;
|
|
921
|
+
// A gesture inside a layer this sheet hosts belongs to that layer.
|
|
922
|
+
if (isInsideNestedLayer(event.target, body)) {
|
|
923
|
+
armedBodyRef.current = null;
|
|
924
|
+
return;
|
|
925
|
+
}
|
|
926
|
+
const scrollers = scrollChainUnder(event.target, body);
|
|
901
927
|
if (!chainAtTop(scrollers)) {
|
|
902
928
|
armedBodyRef.current = null;
|
|
903
929
|
return;
|
|
@@ -995,8 +1021,9 @@ export function useSheetGestures({
|
|
|
995
1021
|
// At the top, a pull DOWN hands off (collapse); at the bottom, a pull UP
|
|
996
1022
|
// hands off (expand). A gesture that starts mid-content is an ordinary
|
|
997
1023
|
// scroll, but it is tracked all the same: the scroller can run out of
|
|
998
|
-
// content while the finger is still down (see onTouchMove).
|
|
999
|
-
|
|
1024
|
+
// content while the finger is still down (see onTouchMove). A touch
|
|
1025
|
+
// inside a layer this sheet hosts is that layer's, never tracked here.
|
|
1026
|
+
if (!touch || isInsideNestedLayer(event.target, body)) {
|
|
1000
1027
|
touchDragRef.current = null;
|
|
1001
1028
|
return;
|
|
1002
1029
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BreadcrumbItem.d.ts","sourceRoot":"","sources":["../../src/Breadcrumbs/BreadcrumbItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,KAAK,EAAE,EAOZ,KAAK,SAAS,EACd,KAAK,UAAU,EAChB,MAAM,OAAO,CAAC;AAWf,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAErD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"BreadcrumbItem.d.ts","sourceRoot":"","sources":["../../src/Breadcrumbs/BreadcrumbItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,KAAK,EAAE,EAOZ,KAAK,SAAS,EACd,KAAK,UAAU,EAChB,MAAM,OAAO,CAAC;AAWf,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAErD,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAa5C,OAAO,EAIL,KAAK,gBAAgB,EACtB,MAAM,qCAAqC,CAAC;AAM7C,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,8BAA8B,CAAC;AAQrE,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAC/C,SAAS,CAAC,aAAa,CAAC,EACxB,SAAS,CACV;IACC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,aAAa,CAAC,CAAC;IAC/B;;;;OAIG;IACH,EAAE,CAAC,EAAE,iBAAiB,CAAC;IACvB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;IAC/C;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;;;;;;;;;;;OAaG;IACH,IAAI,CAAC,EAAE,kBAAkB,EAAE,GAAG,SAAS,CAAC;IACxC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,gBAAgB,CAAC;CAC7B;AAsID;;;;;;;;;;;;;GAaG;AACH,wBAAgB,cAAc,CAAC,EAC7B,GAAG,EACH,EAAE,EACF,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,SAAS,EAAE,aAAa,EACxB,SAAS,EACT,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,IAAI,EACR,EAAE,mBAAmB,qBAgMrB;yBA/Me,cAAc"}
|