@astryxdesign/core 0.7.9-canary.d0cf29a → 0.7.9-canary.d6efbde
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 +3 -2
- package/dist/AlertDialog/AlertDialog.d.ts.map +1 -1
- package/dist/AlertDialog/AlertDialog.js +11 -14
- package/dist/BottomSheet/BottomSheet.d.ts.map +1 -1
- package/dist/BottomSheet/BottomSheet.js +32 -3
- package/dist/BottomSheet/BottomSheetPanel.d.ts.map +1 -1
- package/dist/BottomSheet/BottomSheetPanel.js +40 -8
- package/dist/BottomSheet/bottomSheetStack.d.ts.map +1 -1
- package/dist/BottomSheet/bottomSheetStack.js +4 -3
- package/dist/BottomSheet/useSheetGestures.d.ts.map +1 -1
- package/dist/BottomSheet/useSheetGestures.js +97 -30
- package/dist/Breadcrumbs/BreadcrumbItem.d.ts.map +1 -1
- package/dist/Breadcrumbs/BreadcrumbItem.js +3 -1
- package/dist/Button/Button.d.ts.map +1 -1
- package/dist/Button/Button.js +11 -2
- package/dist/ButtonGroup/ButtonGroup.d.ts +2 -1
- package/dist/ButtonGroup/ButtonGroup.d.ts.map +1 -1
- package/dist/ButtonGroup/ButtonGroup.js +28 -5
- package/dist/Calendar/Calendar.d.ts +14 -2
- package/dist/Calendar/Calendar.d.ts.map +1 -1
- package/dist/Calendar/Calendar.js +63 -74
- package/dist/Calendar/getInitialFocusDate.d.ts +4 -1
- package/dist/Calendar/getInitialFocusDate.d.ts.map +1 -1
- package/dist/Calendar/getInitialFocusDate.js +7 -5
- package/dist/Calendar/hooks/useCalendarDays.d.ts +19 -2
- package/dist/Calendar/hooks/useCalendarDays.d.ts.map +1 -1
- package/dist/Calendar/hooks/useCalendarDays.js +57 -64
- package/dist/Calendar/hooks/useCalendarNavigation.d.ts +28 -3
- package/dist/Calendar/hooks/useCalendarNavigation.d.ts.map +1 -1
- package/dist/Calendar/hooks/useCalendarNavigation.js +33 -22
- package/dist/Chat/ChatMessageList.d.ts.map +1 -1
- package/dist/Chat/ChatMessageList.js +10 -2
- package/dist/CheckboxInput/CheckboxInput.d.ts +2 -1
- package/dist/CheckboxInput/CheckboxInput.d.ts.map +1 -1
- package/dist/CheckboxInput/CheckboxInput.js +31 -17
- package/dist/CheckboxInput/CheckboxRowPressContext.d.ts +2 -0
- package/dist/CheckboxInput/CheckboxRowPressContext.d.ts.map +1 -0
- package/dist/CheckboxInput/CheckboxRowPressContext.js +20 -0
- package/dist/CheckboxList/CheckboxListItem.d.ts +2 -1
- package/dist/CheckboxList/CheckboxListItem.d.ts.map +1 -1
- package/dist/CheckboxList/CheckboxListItem.js +47 -14
- package/dist/CodeBlock/CodeBlock.d.ts.map +1 -1
- package/dist/CodeBlock/CodeBlock.js +12 -4
- package/dist/ComplexSelector/ComplexSelector.d.ts.map +1 -1
- package/dist/ComplexSelector/ComplexSelector.js +21 -12
- package/dist/ContextMenu/ContextMenu.d.ts.map +1 -1
- package/dist/ContextMenu/ContextMenu.js +5 -1
- package/dist/DateInput/DateInput.d.ts +37 -6
- package/dist/DateInput/DateInput.d.ts.map +1 -1
- package/dist/DateInput/DateInput.js +97 -124
- package/dist/DateInput/MonthScroller.d.ts +5 -2
- package/dist/DateInput/MonthScroller.d.ts.map +1 -1
- package/dist/DateInput/MonthScroller.js +26 -29
- package/dist/DateInput/MonthYearWheels.d.ts +10 -1
- package/dist/DateInput/MonthYearWheels.d.ts.map +1 -1
- package/dist/DateInput/MonthYearWheels.js +54 -42
- package/dist/DateInput/TouchDateField.d.ts +1 -1
- package/dist/DateInput/TouchDateField.d.ts.map +1 -1
- package/dist/DateInput/TouchDateField.js +26 -21
- package/dist/DateInput/monthGeometry.d.ts +42 -8
- package/dist/DateInput/monthGeometry.d.ts.map +1 -1
- package/dist/DateInput/monthGeometry.js +81 -7
- package/dist/DateInput/useCalendarPresentation.d.ts +10 -0
- package/dist/DateInput/useCalendarPresentation.d.ts.map +1 -0
- package/dist/DateInput/useCalendarPresentation.js +32 -0
- package/dist/DateInput/useTypedDate.d.ts +92 -0
- package/dist/DateInput/useTypedDate.d.ts.map +1 -0
- package/dist/DateInput/useTypedDate.js +269 -0
- package/dist/DateInput/wheelStrip.js +2 -2
- package/dist/DateRangeInput/DateRangeInput.d.ts +17 -1
- package/dist/DateRangeInput/DateRangeInput.d.ts.map +1 -1
- package/dist/DateRangeInput/DateRangeInput.js +14 -7
- package/dist/DateTimeInput/DateTimeInput.d.ts +26 -3
- package/dist/DateTimeInput/DateTimeInput.d.ts.map +1 -1
- package/dist/DateTimeInput/DateTimeInput.js +125 -97
- package/dist/DateTimeInput/TouchDateTimeField.d.ts +1 -1
- package/dist/DateTimeInput/TouchDateTimeField.d.ts.map +1 -1
- package/dist/DateTimeInput/TouchDateTimeField.js +26 -20
- package/dist/Dialog/Dialog.d.ts.map +1 -1
- package/dist/Dialog/Dialog.js +2 -2
- package/dist/Drawer/Drawer.d.ts.map +1 -1
- package/dist/Drawer/Drawer.js +3 -1
- package/dist/DropdownMenu/DropdownMenu.d.ts +2 -1
- package/dist/DropdownMenu/DropdownMenu.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenu.js +44 -12
- package/dist/HoverCard/HoverCard.d.ts.map +1 -1
- package/dist/HoverCard/HoverCard.js +19 -9
- package/dist/HoverCard/useHoverCard.d.ts +3 -1
- package/dist/HoverCard/useHoverCard.d.ts.map +1 -1
- package/dist/Icon/ComponentIcon.d.ts +33 -0
- package/dist/Icon/ComponentIcon.d.ts.map +1 -0
- package/dist/Icon/ComponentIcon.js +56 -0
- package/dist/Icon/globalIconRegistry.d.ts +45 -4
- package/dist/Icon/globalIconRegistry.d.ts.map +1 -1
- package/dist/Icon/globalIconRegistry.js +137 -3
- package/dist/Icon/index.d.ts +73 -2
- package/dist/Icon/index.d.ts.map +1 -1
- package/dist/Icon/index.js +42 -3
- package/dist/Icon/useIcon.d.ts +13 -4
- package/dist/Icon/useIcon.d.ts.map +1 -1
- package/dist/Icon/useIcon.js +16 -5
- package/dist/InfoTip/InfoTip.d.ts.map +1 -1
- package/dist/InfoTip/InfoTip.js +5 -18
- package/dist/InputGroup/InputGroupText.d.ts +2 -1
- package/dist/InputGroup/InputGroupText.d.ts.map +1 -1
- package/dist/InputGroup/InputGroupText.js +2 -1
- package/dist/Item/Item.d.ts +18 -0
- package/dist/Item/Item.d.ts.map +1 -1
- package/dist/Item/Item.js +83 -28
- package/dist/Item/ItemListRowContext.d.ts +2 -0
- package/dist/Item/ItemListRowContext.d.ts.map +1 -0
- package/dist/Item/ItemListRowContext.js +16 -0
- package/dist/Layer/LayerProvider.d.ts.map +1 -1
- package/dist/Layer/LayerProvider.js +8 -7
- package/dist/Layer/LayerTouch.d.ts +13 -0
- package/dist/Layer/LayerTouch.d.ts.map +1 -0
- package/dist/Layer/LayerTouch.js +16 -0
- package/dist/Layer/holdEntranceInput.d.ts.map +1 -1
- package/dist/Layer/holdEntranceInput.js +4 -2
- package/dist/Layer/layerKeyboardClearance.d.ts +41 -0
- package/dist/Layer/layerKeyboardClearance.d.ts.map +1 -0
- package/dist/Layer/layerKeyboardClearance.js +51 -0
- package/dist/Layer/layerViewportInset.stylex.d.ts +5 -1
- package/dist/Layer/layerViewportInset.stylex.d.ts.map +1 -1
- package/dist/Layer/layerViewportInset.stylex.js +11 -4
- package/dist/Layer/outsidePress.d.ts +4 -0
- package/dist/Layer/outsidePress.d.ts.map +1 -1
- package/dist/Layer/outsidePress.js +18 -1
- package/dist/Layer/settledBox.d.ts +16 -0
- package/dist/Layer/settledBox.d.ts.map +1 -0
- package/dist/Layer/settledBox.js +117 -0
- package/dist/Layer/toastHost.d.ts +77 -0
- package/dist/Layer/toastHost.d.ts.map +1 -0
- package/dist/Layer/toastHost.js +172 -0
- package/dist/Layer/useBackdropPress.d.ts +8 -0
- package/dist/Layer/useBackdropPress.d.ts.map +1 -1
- package/dist/Layer/useBackdropPress.js +31 -2
- package/dist/Layer/useLayer.d.ts +3 -1
- package/dist/Layer/useLayer.d.ts.map +1 -1
- package/dist/Layer/useLayer.js +95 -105
- package/dist/Layer/useLayerKeyboardClearance.d.ts +54 -0
- package/dist/Layer/useLayerKeyboardClearance.d.ts.map +1 -0
- package/dist/Layer/useLayerKeyboardClearance.js +330 -0
- package/dist/Layer/useTouchTrigger.d.ts.map +1 -1
- package/dist/Layer/useTouchTrigger.js +4 -0
- package/dist/Layout/LayoutPanel.d.ts +10 -10
- package/dist/Layout/LayoutPanel.d.ts.map +1 -1
- package/dist/Layout/LayoutPanel.js +71 -10
- package/dist/Link/Link.d.ts.map +1 -1
- package/dist/Link/Link.js +5 -1
- package/dist/List/List.d.ts.map +1 -1
- package/dist/List/List.js +1 -0
- package/dist/List/ListItem.d.ts +5 -4
- package/dist/List/ListItem.d.ts.map +1 -1
- package/dist/List/ListItem.js +45 -9
- package/dist/Markdown/parser.d.ts.map +1 -1
- package/dist/Markdown/parser.js +56 -39
- package/dist/MultiSelector/MultiSelector.d.ts.map +1 -1
- package/dist/MultiSelector/MultiSelector.js +13 -11
- package/dist/MultiSelector/hooks.d.ts.map +1 -1
- package/dist/MultiSelector/hooks.js +28 -28
- package/dist/NumberInput/NumberInput.d.ts +4 -2
- package/dist/NumberInput/NumberInput.d.ts.map +1 -1
- package/dist/NumberInput/NumberInput.js +244 -11
- package/dist/OverflowList/OverflowList.d.ts.map +1 -1
- package/dist/OverflowList/OverflowList.js +7 -2
- package/dist/Pagination/Pagination.d.ts.map +1 -1
- package/dist/Pagination/Pagination.js +28 -10
- package/dist/Popover/Popover.d.ts.map +1 -1
- package/dist/Popover/Popover.js +1 -0
- package/dist/Popover/usePopover.d.ts +1 -0
- package/dist/Popover/usePopover.d.ts.map +1 -1
- package/dist/PowerSearch/PowerSearch.d.ts.map +1 -1
- package/dist/PowerSearch/PowerSearch.js +6 -4
- package/dist/PowerSearch/PowerSearchBottomSheet.d.ts.map +1 -1
- package/dist/PowerSearch/PowerSearchBottomSheet.js +4 -2
- package/dist/PowerSearch/PowerSearchToken.d.ts.map +1 -1
- package/dist/PowerSearch/PowerSearchToken.js +3 -1
- package/dist/PowerSearch/formatFilterValue.d.ts +9 -3
- package/dist/PowerSearch/formatFilterValue.d.ts.map +1 -1
- package/dist/PowerSearch/formatFilterValue.js +14 -11
- package/dist/PowerSearch/formatTokenValue.d.ts +6 -2
- package/dist/PowerSearch/formatTokenValue.d.ts.map +1 -1
- package/dist/PowerSearch/formatTokenValue.js +6 -3
- package/dist/RadioList/RadioListItem.d.ts.map +1 -1
- package/dist/RadioList/RadioListItem.js +5 -10
- package/dist/Resizable/ResizeHandle.d.ts +5 -5
- package/dist/Resizable/ResizeHandle.d.ts.map +1 -1
- package/dist/Resizable/ResizeHandle.js +44 -5
- package/dist/Resizable/resizablePane.d.ts +58 -0
- package/dist/Resizable/resizablePane.d.ts.map +1 -0
- package/dist/Resizable/resizablePane.js +137 -0
- package/dist/Resizable/useResizable.d.ts +7 -0
- package/dist/Resizable/useResizable.d.ts.map +1 -1
- package/dist/Resizable/useResizable.js +13 -0
- package/dist/SegmentedControl/useSegmentedSelectionMotion.d.ts.map +1 -1
- package/dist/SegmentedControl/useSegmentedSelectionMotion.js +16 -56
- package/dist/Selector/Selector.d.ts.map +1 -1
- package/dist/Selector/Selector.js +74 -23
- package/dist/SideNav/SideNav.d.ts +9 -3
- package/dist/SideNav/SideNav.d.ts.map +1 -1
- package/dist/SideNav/SideNav.js +45 -10
- package/dist/SideNav/SideNavItem.d.ts.map +1 -1
- package/dist/SideNav/SideNavItem.js +7 -4
- package/dist/Slider/sliderTouchController.js +2 -2
- package/dist/Spinner/Spinner.d.ts +1 -1
- package/dist/Spinner/Spinner.d.ts.map +1 -1
- package/dist/Spinner/Spinner.js +41 -86
- package/dist/Spinner/SpinnerOwnerContext.d.ts +2 -0
- package/dist/Spinner/SpinnerOwnerContext.d.ts.map +1 -0
- package/dist/Spinner/SpinnerOwnerContext.js +20 -0
- package/dist/Spinner/index.d.ts +1 -1
- package/dist/Spinner/index.d.ts.map +1 -1
- package/dist/Spinner/spinnerRotor.d.ts +28 -0
- package/dist/Spinner/spinnerRotor.d.ts.map +1 -0
- package/dist/Spinner/spinnerRotor.js +98 -0
- package/dist/Switch/useSwitchTouch.d.ts.map +1 -1
- package/dist/Switch/useSwitchTouch.js +13 -9
- package/dist/TabList/Tab.d.ts.map +1 -1
- package/dist/TabList/Tab.js +5 -1
- package/dist/TabList/TabList.d.ts.map +1 -1
- package/dist/TabList/TabList.js +1 -0
- package/dist/Table/plugins/rowExpansion/useTableRowExpansion.d.ts +2 -1
- package/dist/Table/plugins/rowExpansion/useTableRowExpansion.d.ts.map +1 -1
- package/dist/Table/plugins/rowExpansion/useTableRowExpansion.js +27 -5
- package/dist/Table/plugins/sortable/useTableSortable.d.ts.map +1 -1
- package/dist/Table/plugins/sortable/useTableSortable.js +16 -8
- package/dist/Timestamp/Timestamp.d.ts.map +1 -1
- package/dist/Timestamp/Timestamp.js +14 -8
- package/dist/Timestamp/TimestampHoverCard.d.ts +2 -1
- package/dist/Timestamp/TimestampHoverCard.d.ts.map +1 -1
- package/dist/Timestamp/TimestampHoverCard.js +12 -5
- package/dist/Timestamp/formatInstant.d.ts +10 -1
- package/dist/Timestamp/formatInstant.d.ts.map +1 -1
- package/dist/Timestamp/formatInstant.js +13 -27
- package/dist/Timestamp/tooltipEntries.d.ts +5 -3
- package/dist/Timestamp/tooltipEntries.d.ts.map +1 -1
- package/dist/Timestamp/tooltipEntries.js +6 -4
- package/dist/Toast/Toast.js +4 -4
- package/dist/Toast/ToastContext.d.ts +6 -13
- package/dist/Toast/ToastContext.d.ts.map +1 -1
- package/dist/Toast/ToastContext.js +6 -8
- package/dist/Toast/ToastViewport.d.ts.map +1 -1
- package/dist/Toast/ToastViewport.js +75 -10
- package/dist/Toast/useToast.d.ts.map +1 -1
- package/dist/Toast/useToast.js +10 -50
- package/dist/Tokenizer/Tokenizer.d.ts.map +1 -1
- package/dist/Tokenizer/Tokenizer.js +17 -10
- package/dist/Tooltip/Tooltip.d.ts.map +1 -1
- package/dist/Tooltip/Tooltip.js +19 -9
- package/dist/Tooltip/useTooltip.d.ts +3 -1
- package/dist/Tooltip/useTooltip.d.ts.map +1 -1
- package/dist/Tooltip/useTooltip.js +2 -0
- package/dist/TopNav/TopNavItem.d.ts.map +1 -1
- package/dist/TopNav/TopNavItem.js +7 -2
- package/dist/Typeahead/BaseTypeahead.d.ts.map +1 -1
- package/dist/Typeahead/BaseTypeahead.js +18 -7
- package/dist/Typeahead/Typeahead.d.ts.map +1 -1
- package/dist/Typeahead/Typeahead.js +11 -4
- package/dist/animator/createAnimator.js +2 -2
- package/dist/astryx.css +371 -341
- package/dist/gestures/createPanGesture.d.ts +49 -0
- package/dist/gestures/createPanGesture.d.ts.map +1 -0
- package/dist/gestures/createPanGesture.js +80 -0
- package/dist/hooks/actionGroupTracker.d.ts +9 -0
- package/dist/hooks/actionGroupTracker.d.ts.map +1 -1
- package/dist/hooks/actionGroupTracker.js +38 -24
- package/dist/hooks/computeOverflow.d.ts +2 -0
- package/dist/hooks/computeOverflow.d.ts.map +1 -1
- package/dist/hooks/computeOverflow.js +1 -1
- package/dist/hooks/index.d.ts +2 -0
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/index.js +2 -1
- package/dist/hooks/pressGroupContext.d.ts +5 -3
- package/dist/hooks/pressGroupContext.d.ts.map +1 -1
- package/dist/hooks/pressGroupContext.js +17 -9
- package/dist/hooks/useActionGroupTracking.d.ts +29 -4
- package/dist/hooks/useActionGroupTracking.d.ts.map +1 -1
- package/dist/hooks/useActionGroupTracking.js +92 -14
- package/dist/hooks/useAnnounceRenderedText.d.ts +10 -2
- package/dist/hooks/useAnnounceRenderedText.d.ts.map +1 -1
- package/dist/hooks/useAnnounceRenderedText.js +45 -8
- package/dist/hooks/useClickableContainer.d.ts +10 -3
- package/dist/hooks/useClickableContainer.d.ts.map +1 -1
- package/dist/hooks/useClickableContainer.js +23 -10
- package/dist/hooks/useGroupPressTracking.d.ts +34 -0
- package/dist/hooks/useGroupPressTracking.d.ts.map +1 -0
- package/dist/hooks/useGroupPressTracking.js +122 -0
- package/dist/hooks/useKeyboardHighlight.d.ts +17 -0
- package/dist/hooks/useKeyboardHighlight.d.ts.map +1 -0
- package/dist/hooks/useKeyboardHighlight.js +38 -0
- package/dist/hooks/useMediaQuery.d.ts +2 -1
- package/dist/hooks/useMediaQuery.d.ts.map +1 -1
- package/dist/hooks/useMediaQuery.js +37 -12
- package/dist/hooks/useMenuPress.d.ts.map +1 -1
- package/dist/hooks/useMenuPress.js +7 -0
- package/dist/hooks/useOverflow.d.ts +10 -0
- package/dist/hooks/useOverflow.d.ts.map +1 -1
- package/dist/hooks/useOverflow.js +214 -23
- package/dist/hooks/usePanGesture.d.ts +32 -0
- package/dist/hooks/usePanGesture.d.ts.map +1 -0
- package/dist/hooks/usePanGesture.js +67 -0
- package/dist/i18n/InternationalizationContext.d.ts +6 -0
- package/dist/i18n/InternationalizationContext.d.ts.map +1 -1
- package/dist/i18n/InternationalizationProvider.d.ts +23 -3
- package/dist/i18n/InternationalizationProvider.d.ts.map +1 -1
- package/dist/i18n/InternationalizationProvider.js +8 -3
- package/dist/i18n/generated-english/DateInput/DateInput.generated.d.ts.map +1 -1
- package/dist/i18n/generated-english/DateInput/DateInput.generated.js +0 -1
- package/dist/i18n/generated-english/DateInput/useTypedDate.generated.d.ts +8 -0
- package/dist/i18n/generated-english/DateInput/useTypedDate.generated.d.ts.map +1 -0
- package/dist/i18n/generated-english/DateInput/useTypedDate.generated.js +16 -0
- package/dist/i18n/generated-english/DateTimeInput/DateTimeInput.generated.d.ts.map +1 -1
- package/dist/i18n/generated-english/DateTimeInput/DateTimeInput.generated.js +0 -1
- package/dist/i18n/generated-locales/en.generated.d.ts.map +1 -1
- package/dist/i18n/generated-locales/en.generated.js +6 -1
- package/dist/i18n/generated-locales/pseudo.generated.d.ts.map +1 -1
- package/dist/i18n/generated-locales/pseudo.generated.js +6 -1
- package/dist/i18n/index.d.ts +2 -0
- package/dist/i18n/index.d.ts.map +1 -1
- package/dist/i18n/index.js +1 -0
- package/dist/i18n/useCalendarSystem.d.ts +19 -0
- package/dist/i18n/useCalendarSystem.d.ts.map +1 -0
- package/dist/i18n/useCalendarSystem.js +61 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/dist/internal/calendar-system.d.ts +18 -0
- package/dist/internal/calendar-system.d.ts.map +1 -0
- package/dist/internal/calendar-system.js +19 -0
- package/dist/internal/spinner-rotor.d.ts +16 -0
- package/dist/internal/spinner-rotor.d.ts.map +1 -0
- package/dist/internal/spinner-rotor.js +16 -0
- package/dist/internal/touch.d.ts +28 -2
- package/dist/internal/touch.d.ts.map +1 -1
- package/dist/internal/touch.js +38 -3
- package/dist/motion/animatedLayout.d.ts.map +1 -1
- package/dist/motion/animatedLayout.js +10 -7
- package/dist/motion/animator.d.ts +5 -5
- package/dist/motion/animator.d.ts.map +1 -1
- package/dist/motion/animator.js +10 -8
- package/dist/motion/resolveMotion.d.ts +6 -27
- package/dist/motion/resolveMotion.d.ts.map +1 -1
- package/dist/motion/resolveMotion.js +82 -16
- package/dist/motion/themeTempo.d.ts +7 -0
- package/dist/motion/themeTempo.d.ts.map +1 -0
- package/dist/motion/themeTempo.js +38 -0
- package/dist/motion/themeTiming.d.ts +63 -0
- package/dist/motion/themeTiming.d.ts.map +1 -0
- package/dist/motion/themeTiming.js +173 -0
- package/dist/privateAttributes/focusOwner.stylex.d.ts +22 -0
- package/dist/privateAttributes/focusOwner.stylex.d.ts.map +1 -0
- package/dist/privateAttributes/focusOwner.stylex.js +39 -0
- package/dist/privateAttributes/press.stylex.d.ts +18 -11
- package/dist/privateAttributes/press.stylex.d.ts.map +1 -1
- package/dist/privateAttributes/press.stylex.js +20 -11
- package/dist/privateAttributes/pressGroupItem.stylex.d.ts +8 -5
- package/dist/privateAttributes/pressGroupItem.stylex.d.ts.map +1 -1
- package/dist/privateAttributes/pressGroupItem.stylex.js +11 -5
- package/dist/theme/defineTheme.d.ts +42 -3
- package/dist/theme/defineTheme.d.ts.map +1 -1
- package/dist/theme/defineTheme.js +48 -0
- package/dist/theme/generateThemeRules.d.ts.map +1 -1
- package/dist/theme/generateThemeRules.js +4 -1
- package/dist/theme/resolveThemeValues.d.ts.map +1 -1
- package/dist/theme/resolveThemeValues.js +12 -4
- package/dist/theme/themeMotion.d.ts +7 -5
- package/dist/theme/themeMotion.d.ts.map +1 -1
- package/dist/theme/themeMotion.js +7 -5
- package/dist/utils/calendarDateParser.d.ts +110 -0
- package/dist/utils/calendarDateParser.d.ts.map +1 -0
- package/dist/utils/calendarDateParser.js +1225 -0
- package/dist/utils/calendarSystem.d.ts +176 -0
- package/dist/utils/calendarSystem.d.ts.map +1 -0
- package/dist/utils/calendarSystem.js +569 -0
- package/dist/utils/coarsePointer.d.ts +5 -0
- package/dist/utils/coarsePointer.d.ts.map +1 -1
- package/dist/utils/coarsePointer.js +22 -13
- package/dist/utils/focusReturn.d.ts +34 -13
- package/dist/utils/focusReturn.d.ts.map +1 -1
- package/dist/utils/focusReturn.js +64 -17
- package/dist/utils/hitArea.d.ts +35 -2
- package/dist/utils/hitArea.d.ts.map +1 -1
- package/dist/utils/hitArea.js +65 -14
- package/dist/utils/inputPresentation.d.ts +9 -1
- package/dist/utils/inputPresentation.d.ts.map +1 -1
- package/dist/utils/inputPresentation.js +15 -1
- package/dist/utils/plainDate.d.ts +38 -7
- package/dist/utils/plainDate.d.ts.map +1 -1
- package/dist/utils/plainDate.js +92 -18
- package/dist/utils/touchHitArea.d.ts +49 -0
- package/dist/utils/touchHitArea.d.ts.map +1 -0
- package/dist/utils/touchHitArea.js +177 -0
- package/dist/utils/touchHitArea.stylex.d.ts +31 -4
- package/dist/utils/touchHitArea.stylex.d.ts.map +1 -1
- package/dist/utils/touchHitArea.stylex.js +51 -4
- package/locales/en.json +21 -1
- package/locales/pseudo.json +15 -0
- package/package.json +16 -5
- package/src/AlertDialog/AlertDialog.tsx +9 -13
- package/src/BottomSheet/BottomSheet.tsx +40 -3
- package/src/BottomSheet/BottomSheetPanel.tsx +64 -7
- package/src/BottomSheet/bottomSheetStack.ts +4 -3
- package/src/BottomSheet/useSheetGestures.ts +124 -30
- package/src/Breadcrumbs/BreadcrumbItem.tsx +7 -1
- package/src/Button/Button.tsx +17 -2
- package/src/ButtonGroup/ButtonGroup.doc.mjs +3 -2
- package/src/ButtonGroup/ButtonGroup.tsx +28 -4
- package/src/Calendar/Calendar.doc.mjs +76 -6
- package/src/Calendar/Calendar.tsx +123 -104
- package/src/Calendar/getInitialFocusDate.ts +22 -8
- package/src/Calendar/hooks/useCalendarDays.ts +89 -63
- package/src/Calendar/hooks/useCalendarNavigation.ts +68 -26
- package/src/Calendar/useCalendarDays.doc.mjs +158 -0
- package/src/Chat/ChatMessageList.tsx +18 -2
- package/src/CheckboxInput/CheckboxInput.doc.mjs +2 -2
- package/src/CheckboxInput/CheckboxInput.tsx +51 -24
- package/src/CheckboxInput/CheckboxRowPressContext.ts +22 -0
- package/src/CheckboxList/CheckboxList.doc.mjs +9 -0
- package/src/CheckboxList/CheckboxListItem.doc.mjs +3 -3
- package/src/CheckboxList/CheckboxListItem.tsx +42 -18
- package/src/CodeBlock/CodeBlock.doc.mjs +17 -0
- package/src/CodeBlock/CodeBlock.tsx +11 -2
- package/src/ComplexSelector/ComplexSelector.doc.mjs +2 -2
- package/src/ComplexSelector/ComplexSelector.tsx +39 -31
- package/src/ContextMenu/ContextMenu.tsx +9 -1
- package/src/DateInput/DateInput.doc.mjs +45 -12
- package/src/DateInput/DateInput.tsx +165 -179
- package/src/DateInput/MonthScroller.tsx +39 -37
- package/src/DateInput/MonthYearWheels.tsx +68 -47
- package/src/DateInput/TouchDateField.tsx +45 -17
- package/src/DateInput/monthGeometry.ts +110 -8
- package/src/DateInput/useCalendarPresentation.ts +64 -0
- package/src/DateInput/useTypedDate.ts +469 -0
- package/src/DateInput/wheelStrip.ts +2 -2
- package/src/DateRangeInput/DateRangeInput.doc.mjs +9 -0
- package/src/DateRangeInput/DateRangeInput.tsx +42 -8
- package/src/DateTimeInput/DateTimeInput.doc.mjs +42 -9
- package/src/DateTimeInput/DateTimeInput.tsx +173 -161
- package/src/DateTimeInput/TouchDateTimeField.tsx +31 -16
- package/src/Dialog/Dialog.tsx +2 -1
- package/src/Drawer/Drawer.tsx +3 -1
- package/src/DropdownMenu/DropdownMenu.tsx +50 -12
- package/src/HoverCard/HoverCard.tsx +4 -1
- package/src/HoverCard/useHoverCard.tsx +3 -1
- package/src/Icon/ComponentIcon.tsx +71 -0
- package/src/Icon/globalIconRegistry.tsx +181 -4
- package/src/Icon/index.ts +85 -2
- package/src/Icon/useIcon.doc.mjs +94 -0
- package/src/Icon/useIcon.ts +24 -3
- package/src/InfoTip/InfoTip.tsx +5 -27
- package/src/InputGroup/InputGroupText.doc.mjs +45 -3
- package/src/InputGroup/InputGroupText.tsx +2 -1
- package/src/Item/Item.doc.mjs +19 -4
- package/src/Item/Item.tsx +113 -32
- package/src/Item/ItemListRowContext.tsx +18 -0
- package/src/Layer/LayerProvider.tsx +9 -8
- package/src/Layer/LayerTouch.ts +17 -0
- package/src/Layer/holdEntranceInput.ts +4 -2
- package/src/Layer/layerKeyboardClearance.ts +55 -0
- package/src/Layer/layerViewportInset.stylex.ts +16 -5
- package/src/Layer/outsidePress.ts +18 -1
- package/src/Layer/settledBox.ts +138 -0
- package/src/Layer/toastHost.tsx +212 -0
- package/src/Layer/useBackdropPress.ts +41 -1
- package/src/Layer/useLayer.tsx +113 -122
- package/src/Layer/useLayerKeyboardClearance.ts +371 -0
- package/src/Layer/useTouchTrigger.ts +4 -0
- package/src/Layout/LayoutPanel.doc.mjs +8 -8
- package/src/Layout/LayoutPanel.tsx +105 -15
- package/src/Link/Link.tsx +5 -1
- package/src/Link/useLinkComponent.doc.mjs +95 -0
- package/src/List/List.doc.mjs +10 -1
- package/src/List/List.tsx +5 -0
- package/src/List/ListItem.tsx +63 -8
- package/src/Markdown/parser.ts +65 -42
- package/src/MultiSelector/MultiSelector.tsx +31 -19
- package/src/MultiSelector/hooks.ts +28 -35
- package/src/MultiSelector/useMultiCombobox.doc.mjs +2 -2
- package/src/NumberInput/NumberInput.doc.mjs +1 -1
- package/src/NumberInput/NumberInput.tsx +259 -11
- package/src/OverflowList/OverflowList.tsx +15 -9
- package/src/Overlay/useOverlay.doc.mjs +176 -0
- package/src/Pagination/Pagination.tsx +23 -9
- package/src/Popover/Popover.tsx +5 -0
- package/src/Popover/usePopover.tsx +1 -0
- package/src/PowerSearch/PowerSearch.doc.mjs +3 -3
- package/src/PowerSearch/PowerSearch.tsx +6 -2
- package/src/PowerSearch/PowerSearchBottomSheet.tsx +4 -1
- package/src/PowerSearch/PowerSearchToken.tsx +3 -0
- package/src/PowerSearch/formatFilterValue.ts +21 -11
- package/src/PowerSearch/formatTokenValue.ts +7 -1
- package/src/RadioList/RadioListItem.tsx +5 -13
- package/src/Resizable/Resizable.doc.mjs +40 -12
- package/src/Resizable/ResizeHandle.tsx +68 -6
- package/src/Resizable/resizablePane.ts +179 -0
- package/src/Resizable/useResizable.ts +15 -0
- package/src/SegmentedControl/useSegmentedSelectionMotion.ts +15 -62
- package/src/Selector/Selector.tsx +117 -11
- package/src/SideNav/SideNav.doc.mjs +2 -2
- package/src/SideNav/SideNav.tsx +87 -12
- package/src/SideNav/SideNavItem.tsx +8 -6
- package/src/Slider/sliderTouchController.ts +2 -2
- package/src/Spinner/Spinner.doc.mjs +150 -36
- package/src/Spinner/Spinner.tsx +41 -105
- package/src/Spinner/SpinnerOwnerContext.ts +22 -0
- package/src/Spinner/index.ts +1 -5
- package/src/Spinner/spinnerRotor.ts +113 -0
- package/src/Switch/useSwitchTouch.ts +17 -9
- package/src/TabList/Tab.tsx +5 -1
- package/src/TabList/TabList.tsx +1 -0
- package/src/Table/Table.doc.mjs +34 -0
- package/src/Table/plugins/rowExpansion/useTableRowExpansion.tsx +32 -7
- package/src/Table/plugins/sortable/useTableSortable.tsx +19 -12
- package/src/Table/plugins/sortable/useTableSortableState.doc.mjs +173 -0
- package/src/Timestamp/Timestamp.doc.mjs +20 -3
- package/src/Timestamp/Timestamp.tsx +13 -8
- package/src/Timestamp/TimestampHoverCard.tsx +11 -3
- package/src/Timestamp/formatInstant.ts +49 -28
- package/src/Timestamp/tooltipEntries.ts +7 -3
- package/src/Toast/Toast.doc.mjs +14 -0
- package/src/Toast/Toast.tsx +2 -2
- package/src/Toast/ToastContext.ts +7 -17
- package/src/Toast/ToastViewport.tsx +53 -9
- package/src/Toast/useToast.tsx +7 -52
- package/src/Tokenizer/Tokenizer.tsx +14 -10
- package/src/Tooltip/Tooltip.tsx +4 -1
- package/src/Tooltip/useTooltip.tsx +5 -1
- package/src/TopNav/TopNavItem.tsx +7 -2
- package/src/Typeahead/BaseTypeahead.tsx +34 -8
- package/src/Typeahead/Typeahead.tsx +7 -1
- package/src/animator/createAnimator.doc.mjs +1 -1
- package/src/animator/createAnimator.ts +3 -3
- package/src/gestures/README.md +2 -1
- package/src/gestures/createPanGesture.doc.mjs +145 -0
- package/src/gestures/createPanGesture.ts +107 -0
- package/src/hooks/actionGroupTracker.ts +33 -24
- package/src/hooks/computeOverflow.ts +1 -1
- package/src/hooks/index.ts +8 -0
- package/src/hooks/pressGroupContext.ts +18 -9
- package/src/hooks/useActionGroupTracking.ts +139 -19
- package/src/hooks/useAnimatedLayout.doc.mjs +1 -1
- package/src/hooks/useAnimator.doc.mjs +1 -1
- package/src/hooks/useAnnounceRenderedText.ts +59 -8
- package/src/hooks/useClickableContainer.ts +22 -10
- package/src/hooks/useEntryAnimation.doc.mjs +1 -1
- package/src/hooks/useGroupPressTracking.ts +154 -0
- package/src/hooks/useKeyboardHighlight.ts +71 -0
- package/src/hooks/useMediaQuery.ts +41 -12
- package/src/hooks/useMenuPress.ts +14 -1
- package/src/hooks/useOverflow.ts +321 -75
- package/src/hooks/usePanGesture.doc.mjs +158 -0
- package/src/hooks/usePanGesture.ts +75 -0
- package/src/hooks/usePressFeedback.doc.mjs +1 -1
- package/src/i18n/InternationalizationContext.ts +6 -0
- package/src/i18n/InternationalizationProvider.doc.mjs +29 -1
- package/src/i18n/InternationalizationProvider.tsx +35 -3
- package/src/i18n/generated-english/DateInput/DateInput.generated.ts +0 -1
- package/src/i18n/generated-english/DateInput/useTypedDate.generated.ts +17 -0
- package/src/i18n/generated-english/DateTimeInput/DateTimeInput.generated.ts +0 -1
- package/src/i18n/generated-locales/en.generated.ts +7 -0
- package/src/i18n/generated-locales/pseudo.generated.ts +7 -0
- package/src/i18n/index.ts +2 -0
- package/src/i18n/useCalendarSystem.ts +95 -0
- package/src/index.ts +2 -0
- package/src/internal/calendar-system.ts +26 -0
- package/src/internal/spinner-rotor.ts +20 -0
- package/src/internal/touch.ts +58 -2
- package/src/motion/README.md +6 -5
- package/src/motion/animatedLayout.ts +10 -7
- package/src/motion/animator.ts +10 -9
- package/src/motion/resolveMotion.ts +89 -18
- package/src/motion/themeTempo.ts +41 -0
- package/src/motion/themeTiming.ts +198 -0
- package/src/privateAttributes/focusOwner.stylex.ts +51 -0
- package/src/privateAttributes/press.stylex.ts +49 -11
- package/src/privateAttributes/pressGroupItem.stylex.ts +11 -5
- package/src/theme/defineTheme.ts +99 -2
- package/src/theme/generateThemeRules.ts +3 -0
- package/src/theme/resolveThemeValues.ts +12 -3
- package/src/theme/themeMotion.ts +7 -5
- package/src/utils/calendarDateParser.ts +1385 -0
- package/src/utils/calendarSystem.ts +832 -0
- package/src/utils/coarsePointer.ts +27 -14
- package/src/utils/focusReturn.ts +78 -18
- package/src/utils/hitArea.ts +119 -12
- package/src/utils/inputPresentation.ts +21 -1
- package/src/utils/plainDate.ts +130 -19
- package/src/utils/touchHitArea.stylex.ts +41 -16
- package/src/utils/touchHitArea.ts +225 -0
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @file AlertDialog.tsx
|
|
3
3
|
* @input Uses React, StyleX, Dialog, Layout, Heading, Text, Button, the
|
|
4
|
-
* action-group tracking (hooks/useActionGroupTracking)
|
|
5
|
-
*
|
|
4
|
+
* action-group tracking (hooks/useActionGroupTracking), the press-group
|
|
5
|
+
* context (hooks/pressGroupContext) and the group pointers
|
|
6
|
+
* (hooks/useGroupPressTracking)
|
|
6
7
|
* @output Exports AlertDialog component, AlertDialogProps type
|
|
7
8
|
* @position Core implementation; consumed by index.ts, tested by AlertDialog.test.tsx
|
|
8
9
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AlertDialog.d.ts","sourceRoot":"","sources":["../../src/AlertDialog/AlertDialog.tsx"],"names":[],"mappings":"AAIA
|
|
1
|
+
{"version":3,"file":"AlertDialog.d.ts","sourceRoot":"","sources":["../../src/AlertDialog/AlertDialog.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;GAgBG;AAEH,OAAO,KAAmC,MAAM,OAAO,CAAC;AAUxD,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,WAAW,CAAC;AAC7C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAmC5C,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,qBAoHlB;yBAtIe,WAAW"}
|
|
@@ -5,8 +5,9 @@
|
|
|
5
5
|
/**
|
|
6
6
|
* @file AlertDialog.tsx
|
|
7
7
|
* @input Uses React, StyleX, Dialog, Layout, Heading, Text, Button, the
|
|
8
|
-
* action-group tracking (hooks/useActionGroupTracking)
|
|
9
|
-
*
|
|
8
|
+
* action-group tracking (hooks/useActionGroupTracking), the press-group
|
|
9
|
+
* context (hooks/pressGroupContext) and the group pointers
|
|
10
|
+
* (hooks/useGroupPressTracking)
|
|
10
11
|
* @output Exports AlertDialog component, AlertDialogProps type
|
|
11
12
|
* @position Core implementation; consumed by index.ts, tested by AlertDialog.test.tsx
|
|
12
13
|
*
|
|
@@ -36,12 +37,10 @@ import { registerEnglishFallback, useComponentTranslator } from "../i18n/useComp
|
|
|
36
37
|
import english from "../i18n/generated-english/AlertDialog/AlertDialog.generated.js";
|
|
37
38
|
import { useActionGroupTracking } from "../hooks/useActionGroupTracking.js";
|
|
38
39
|
import { PressGroupContext } from "../hooks/pressGroupContext.js";
|
|
40
|
+
import { GROUP_PRESS_POINTERS } from "../hooks/useGroupPressTracking.js";
|
|
39
41
|
import { alertController } from "../motion/uikit/alert.js";
|
|
40
|
-
import { pressGroupItemProps } from "../privateAttributes/pressGroupItem.stylex.js";
|
|
41
42
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
42
43
|
registerEnglishFallback(english);
|
|
43
|
-
const SLIDING_POINTERS = ['touch', 'pen'];
|
|
44
|
-
const ACTION_TRACKING_PROPS = pressGroupItemProps(SLIDING_POINTERS);
|
|
45
44
|
const SMALL_SCREEN_QUERY = '(max-width: 640px)';
|
|
46
45
|
const styles = {
|
|
47
46
|
trackingRow: {
|
|
@@ -115,8 +114,8 @@ export function AlertDialog({
|
|
|
115
114
|
onOpenChange(false);
|
|
116
115
|
}, [onOpenChange]);
|
|
117
116
|
|
|
118
|
-
//
|
|
119
|
-
// tracker is its only painter.
|
|
117
|
+
// Through the group's context, each action's Button writes the press-group
|
|
118
|
+
// marker from its first render. So the tracker is its only painter.
|
|
120
119
|
const actionsRef = useRef(null);
|
|
121
120
|
// Only under the touch presentation does a press slide across the
|
|
122
121
|
// actions. A desktop press stays the native button's.
|
|
@@ -130,21 +129,20 @@ export function AlertDialog({
|
|
|
130
129
|
highlightOnsetMs: alertController.actions.highlightOnsetMs,
|
|
131
130
|
highlightExpansion: alertController.actions.highlightExpansion,
|
|
132
131
|
// A mouse press acts as a native button's under any presentation.
|
|
133
|
-
pointerTypes:
|
|
132
|
+
pointerTypes: GROUP_PRESS_POINTERS,
|
|
134
133
|
isEnabled: isTracking
|
|
135
134
|
});
|
|
136
|
-
const actionTrackingProps = isTracking ? ACTION_TRACKING_PROPS : undefined;
|
|
137
135
|
const buttonActionStyle = [styles.action, isSmallScreen && styles.stackedAction];
|
|
138
136
|
const cancelButton = /*#__PURE__*/_jsx(Button, {
|
|
139
137
|
variant: "ghost",
|
|
140
138
|
label: cancelLabel,
|
|
141
139
|
onClick: handleCancel,
|
|
142
|
-
xstyle: buttonActionStyle
|
|
143
|
-
...actionTrackingProps,
|
|
140
|
+
xstyle: buttonActionStyle
|
|
144
141
|
// Dialog focuses [data-autofocus] itself after showModal(), because
|
|
145
142
|
// React's autoFocus runs during commit while the dialog is invisible.
|
|
146
143
|
// Cancel is least destructive, so it remains the autofocus target even
|
|
147
144
|
// when small-screen visual order places the destructive action above it.
|
|
145
|
+
,
|
|
148
146
|
"data-autofocus": true
|
|
149
147
|
}, "cancel");
|
|
150
148
|
const actionButton = /*#__PURE__*/_jsx(Button, {
|
|
@@ -152,8 +150,7 @@ export function AlertDialog({
|
|
|
152
150
|
label: actionLabel,
|
|
153
151
|
onClick: onAction,
|
|
154
152
|
isLoading: isActionLoading,
|
|
155
|
-
xstyle: buttonActionStyle
|
|
156
|
-
...actionTrackingProps
|
|
153
|
+
xstyle: buttonActionStyle
|
|
157
154
|
}, "action");
|
|
158
155
|
return /*#__PURE__*/_jsx(Dialog, {
|
|
159
156
|
...rest,
|
|
@@ -200,7 +197,7 @@ export function AlertDialog({
|
|
|
200
197
|
hAlign: isSmallScreen ? 'stretch' : 'end',
|
|
201
198
|
wrap: isSmallScreen ? 'nowrap' : 'wrap',
|
|
202
199
|
children: /*#__PURE__*/_jsx(PressGroupContext, {
|
|
203
|
-
value: isTracking,
|
|
200
|
+
value: isTracking ? GROUP_PRESS_POINTERS : null,
|
|
204
201
|
children: isSmallScreen ? [actionButton, cancelButton] : [cancelButton, actionButton]
|
|
205
202
|
})
|
|
206
203
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BottomSheet.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheet.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAuBH,OAAO,EAOL,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAIf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,WAAW,CAAC;AAC7C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"BottomSheet.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheet.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AAuBH,OAAO,EAOL,KAAK,SAAS,EACd,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAIf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAC5C,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,WAAW,CAAC;AAC7C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AA4DhD,YAAY,EAAC,iBAAiB,EAAE,oBAAoB,EAAC,MAAM,oBAAoB,CAAC;AAChF,OAAO,KAAK,EAAC,iBAAiB,EAAE,oBAAoB,EAAC,MAAM,oBAAoB,CAAC;AAmLhF,UAAU,sBAAuB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAChE,qDAAqD;IACrD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC,sCAAsC;IACtC,KAAK,EAAE,MAAM,CAAC;IAEd,0EAA0E;IAC1E,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB,wGAAwG;IACxG,MAAM,CAAC,EAAE,iBAAiB,GAAG,MAAM,GAAG,MAAM,CAAC;IAE7C;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,aAAa,CAAC,oBAAoB,CAAC,CAAC;IAEjD;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,aAAa,CAAC;CACzB;AAED,UAAU,0BAA2B,SAAQ,sBAAsB;IACjE,MAAM,EAAE,OAAO,CAAC;IAChB,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC9C,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB;AAED,UAAU,wBAAyB,SAAQ,sBAAsB;IAC/D;;;;OAIG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,QAAQ,CAAC,EAAE,KAAK,CAAC;CAClB;AAED,MAAM,MAAM,gBAAgB,GAC1B,0BAA0B,GAAG,wBAAwB,CAAC;AA27BxD;;;GAGG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,+BA6BlD;yBA7Be,WAAW"}
|
|
@@ -65,7 +65,7 @@ import { ModalAnnounceProvider } from "../hooks/ModalAnnounceProvider.js";
|
|
|
65
65
|
import { useModalOutlet } from "../Layer/modalOutlet.js";
|
|
66
66
|
import { useLayerDismissal } from "../Layer/useLayerDismissal.js";
|
|
67
67
|
import { useFocusRegionContainment } from "../hooks/useFocusTrap.js";
|
|
68
|
-
import {
|
|
68
|
+
import { prepareFocusRepairOnRemoval, returnFocusForLastInput } from "../utils/focusReturn.js";
|
|
69
69
|
import { useInteractionModalityTracking } from "../utils/interactionModality.js";
|
|
70
70
|
import { BottomSheetPanel } from "./BottomSheetPanel.js";
|
|
71
71
|
import { BottomSheetEdgeTint } from "./BottomSheetEdgeTint.js";
|
|
@@ -387,7 +387,14 @@ function StandaloneBottomSheet({
|
|
|
387
387
|
return;
|
|
388
388
|
}
|
|
389
389
|
const key = stackKeyRef.current;
|
|
390
|
-
|
|
390
|
+
const dialog = dialogRef.current;
|
|
391
|
+
// Removing an open dialog runs no close, so focus would drop to the page.
|
|
392
|
+
// After the commit, the repair sends focus where a close would, if the
|
|
393
|
+
// removal lost focus.
|
|
394
|
+
const repairOnRemoval = dialog == null ? null : prepareFocusRepairOnRemoval(dialog, {
|
|
395
|
+
keepRestingFocus: true
|
|
396
|
+
});
|
|
397
|
+
const leave = registerBottomSheet({
|
|
391
398
|
key,
|
|
392
399
|
getElement: () => dialogRef.current,
|
|
393
400
|
show: () => {
|
|
@@ -437,6 +444,28 @@ function StandaloneBottomSheet({
|
|
|
437
444
|
}
|
|
438
445
|
}
|
|
439
446
|
}, isOpenRef.current, hasScrim);
|
|
447
|
+
return () => {
|
|
448
|
+
// Read before the registry lets go of the sheet beneath. Focus the
|
|
449
|
+
// person had already moved out of the sheet to the page body stays
|
|
450
|
+
// there: the removal did not lose it.
|
|
451
|
+
if (repairOnRemoval != null && isSheetHostPresented(dialog)) {
|
|
452
|
+
const returnTarget = finalFocusRefRef.current?.current ?? triggerRef.current;
|
|
453
|
+
const revealed = hasScrim ? getBottomSheetBeneath(key) : null;
|
|
454
|
+
repairOnRemoval(() => {
|
|
455
|
+
// The sheet beneath left too. Its own repair returns focus for the
|
|
456
|
+
// stack.
|
|
457
|
+
if (revealed != null && !revealed.element.isConnected) {
|
|
458
|
+
return;
|
|
459
|
+
}
|
|
460
|
+
if (revealed != null && (returnTarget == null || !revealed.element.contains(returnTarget))) {
|
|
461
|
+
revealed.focus();
|
|
462
|
+
} else if (returnTarget != null && returnTarget.isConnected) {
|
|
463
|
+
returnFocusForLastInput(returnTarget);
|
|
464
|
+
}
|
|
465
|
+
});
|
|
466
|
+
}
|
|
467
|
+
leave();
|
|
468
|
+
};
|
|
440
469
|
}, [hasScrim, shouldPresent, writeScrim]);
|
|
441
470
|
useLayoutEffect(() => {
|
|
442
471
|
if (!isOpen) {
|
|
@@ -533,7 +562,7 @@ function StandaloneBottomSheet({
|
|
|
533
562
|
if (revealed != null && (returnTarget == null || !revealed.element.contains(returnTarget))) {
|
|
534
563
|
revealed.focus();
|
|
535
564
|
} else if (returnTarget != null) {
|
|
536
|
-
|
|
565
|
+
returnFocusForLastInput(returnTarget);
|
|
537
566
|
}
|
|
538
567
|
triggerRef.current = null;
|
|
539
568
|
}, [finalFocusRef, hasScrim, isOpen]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BottomSheetPanel.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetPanel.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,
|
|
1
|
+
{"version":3,"file":"BottomSheetPanel.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/BottomSheetPanel.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,EAQL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAgC5C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAChD,OAAO,EAGL,KAAK,oBAAoB,EAC1B,MAAM,eAAe,CAAC;AAQvB,QAAA,MAAM,cAAc;;;;CAIV,CAAC;AAEX,MAAM,MAAM,iBAAiB,GAAG,MAAM,OAAO,cAAc,CAAC;AAC5D,YAAY,EAAC,oBAAoB,EAAC,CAAC;AAgFnC,eAAO,MAAM,2BAA2B,2DACkB,CAAC;AA+N3D,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;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B;;;;;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;AAyJD,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,cAAsB,EACtB,cAAc,EACd,eAAe,EACf,qBAA4B,EAC5B,kBAA0B,EAC1B,SAAS,EACT,cAAc,EACd,eAAe,EACf,aAAa,EACb,gBAAgB,EAChB,GAAG,KAAK,EACT,EAAE,qBAAqB,+BA0bvB;yBAlde,gBAAgB"}
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
* - /packages/core/src/BottomSheet/useSheetGestures.ts
|
|
19
19
|
* - /packages/core/src/Layout/container.stylex.ts (bottom-sheet padding chain)
|
|
20
20
|
*/
|
|
21
|
-
import { useCallback, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useRef } from 'react';
|
|
21
|
+
import { useCallback, useEffect, useImperativeHandle, useLayoutEffect, useMemo, useRef, useSyncExternalStore } from 'react';
|
|
22
22
|
import * as stylex from '@stylexjs/stylex';
|
|
23
23
|
import { useDevWarning } from "../hooks/useDevWarning.js";
|
|
24
24
|
import { useMediaQuery } from "../hooks/useMediaQuery.js";
|
|
@@ -33,6 +33,7 @@ import { layerStructureReset } from "../Layer/layerStructureReset.stylex.js";
|
|
|
33
33
|
import { LayerContentBoundary } from "../Layer/layerScopedContext.js";
|
|
34
34
|
import { container } from "../Layout/container.stylex.js";
|
|
35
35
|
import { containerPaddingBlockEndVarStyles, containerPaddingBlockStartVarStyles, containerPaddingInlineVarStyles, overlayPaddingReset, paddingStyles, spacingStepToToken } from "../Layout/padding.stylex.js";
|
|
36
|
+
import { subscribeInput } from "../utils/inputStream.js";
|
|
36
37
|
import { isValidSnapPoint, resolveSnapPoints } from "./snapOffsets.js";
|
|
37
38
|
import { useMobileKeyboard } from "../keyboard/useMobileKeyboard.js";
|
|
38
39
|
import { scrollPreservationPadding, sheetLayoutHeight, useSheetGestures } from "./useSheetGestures.js";
|
|
@@ -42,8 +43,16 @@ const HEIGHT_BUDGETS = {
|
|
|
42
43
|
capped: '62dvh',
|
|
43
44
|
tall: '92dvh'
|
|
44
45
|
};
|
|
45
|
-
//
|
|
46
|
-
|
|
46
|
+
// The reserve: how far the sheet's surface reaches below the screen, so a
|
|
47
|
+
// pull past the top never shows the page under it.
|
|
48
|
+
// SYNC: OVERSCROLL_MAX in useSheetGestures.ts must not exceed MIN_RESERVE.
|
|
49
|
+
const MIN_RESERVE = 48;
|
|
50
|
+
// A finger can pull past the top by at most the viewport's height. The rubber
|
|
51
|
+
// band over a sheet as tall as the viewport then shows 35.5% of it.
|
|
52
|
+
const RESERVE_VIEWPORT_SHARE = 0.4;
|
|
53
|
+
function sheetReserve(viewportHeight) {
|
|
54
|
+
return Math.max(MIN_RESERVE, Math.ceil(viewportHeight * RESERVE_VIEWPORT_SHARE));
|
|
55
|
+
}
|
|
47
56
|
const MOBILE_KEYBOARD_BOTTOM_CLEARANCE = 48;
|
|
48
57
|
const TRANSITION_BACKSTOP_BUFFER_MS = 50;
|
|
49
58
|
// The floating handle bar's height. The bar is out of flow, so this is not
|
|
@@ -51,6 +60,12 @@ const TRANSITION_BACKSTOP_BUFFER_MS = 50;
|
|
|
51
60
|
// from the sheet's top edge, inside the space a content wrapper's own top
|
|
52
61
|
// padding already provides.
|
|
53
62
|
const HANDLE_BAR_HEIGHT = spacingVars['--spacing-6'];
|
|
63
|
+
const BLOCK_SIZE_PROPERTIES = ['height', 'minHeight', 'maxHeight', 'blockSize', 'minBlockSize', 'maxBlockSize'];
|
|
64
|
+
|
|
65
|
+
/** Whether StyleX styles hold any style: they can nest in arrays. */
|
|
66
|
+
function hasStyles(xstyle) {
|
|
67
|
+
return Array.isArray(xstyle) ? xstyle.some(hasStyles) : xstyle != null && typeof xstyle === 'object';
|
|
68
|
+
}
|
|
54
69
|
|
|
55
70
|
// Measure the viewport that the height budgets use. They are `dvh`, which
|
|
56
71
|
// the virtual keyboard does not shrink, so `visualViewport` would differ by
|
|
@@ -59,6 +74,12 @@ const HANDLE_BAR_HEIGHT = spacingVars['--spacing-6'];
|
|
|
59
74
|
function layoutViewportHeight() {
|
|
60
75
|
return typeof window === 'undefined' ? 0 : window.innerHeight;
|
|
61
76
|
}
|
|
77
|
+
function subscribeToResize(onChange) {
|
|
78
|
+
return subscribeInput(window, 'resize', onChange);
|
|
79
|
+
}
|
|
80
|
+
function subscribeToNothing() {
|
|
81
|
+
return () => {};
|
|
82
|
+
}
|
|
62
83
|
|
|
63
84
|
/**
|
|
64
85
|
* A stable identity for a set of snap points. Type-tagged, so the fraction
|
|
@@ -112,8 +133,8 @@ const styles = {
|
|
|
112
133
|
kGVxlE: "x1kcpxr7",
|
|
113
134
|
kI3sdo: "x1a2a7pz",
|
|
114
135
|
kVQacm: "xb3r6kr",
|
|
115
|
-
kGO01o: "
|
|
116
|
-
k1K539: "
|
|
136
|
+
kGO01o: "x5559hn",
|
|
137
|
+
k1K539: "xgwt18o",
|
|
117
138
|
k3aq6I: "xnn1q72 xhbqy3z xspp5ug",
|
|
118
139
|
kSiTet: "x1hc1fzr x1igigxu xgo67oj",
|
|
119
140
|
k1ekBW: "xwcsmn1",
|
|
@@ -178,12 +199,12 @@ const styles = {
|
|
|
178
199
|
"--x-nsbhg8": (val => typeof val === "number" ? val + "px" : val != null ? val : undefined)(inset)
|
|
179
200
|
}],
|
|
180
201
|
budget: {
|
|
181
|
-
kZKoxP: "
|
|
202
|
+
kZKoxP: "x1fqcpoh",
|
|
182
203
|
$$css: true
|
|
183
204
|
},
|
|
184
205
|
hugHeight: {
|
|
185
206
|
kZKoxP: "xg7h5cd",
|
|
186
|
-
kskxy: "
|
|
207
|
+
kskxy: "xkche18",
|
|
187
208
|
$$css: true
|
|
188
209
|
}
|
|
189
210
|
};
|
|
@@ -390,6 +411,16 @@ export function BottomSheetPanel({
|
|
|
390
411
|
|
|
391
412
|
// A caller's height owns the element's height: the drag never writes it.
|
|
392
413
|
const consumerHeight = style?.height;
|
|
414
|
+
// StyleX styles and a class name can size the sheet too. Their rules are
|
|
415
|
+
// only class names here, so any of them counts as a size.
|
|
416
|
+
const isSizedByCaller = BLOCK_SIZE_PROPERTIES.some(property => style?.[property] != null) || hasStyles(xstyle) || className != null && className !== '';
|
|
417
|
+
// Only a finger stretches the sheet past MIN_RESERVE, so a device with no
|
|
418
|
+
// touch pointer keeps the smallest reserve. So does a sheet the caller
|
|
419
|
+
// sizes, which nothing extends by the reserve; the stretch stops at it.
|
|
420
|
+
const hasTouchPointer = useMediaQuery('(any-pointer: coarse)');
|
|
421
|
+
const tracksViewport = isPresented && hasTouchPointer && !isSizedByCaller;
|
|
422
|
+
const viewportHeight = useSyncExternalStore(tracksViewport ? subscribeToResize : subscribeToNothing, () => tracksViewport ? layoutViewportHeight() : 0, () => 0);
|
|
423
|
+
const reserve = viewportHeight > 0 ? sheetReserve(viewportHeight) : MIN_RESERVE;
|
|
393
424
|
const {
|
|
394
425
|
contentProps,
|
|
395
426
|
handleProps,
|
|
@@ -409,7 +440,7 @@ export function BottomSheetPanel({
|
|
|
409
440
|
isOpen: isInteractive,
|
|
410
441
|
isOpenRequested: isOpenRequested ?? isInteractive,
|
|
411
442
|
canDismiss: isSwipeDismissAllowed,
|
|
412
|
-
offscreenBlockEndInset:
|
|
443
|
+
offscreenBlockEndInset: reserve,
|
|
413
444
|
onDismiss,
|
|
414
445
|
snapHeights,
|
|
415
446
|
onTravelStart: () => {
|
|
@@ -624,6 +655,7 @@ export function BottomSheetPanel({
|
|
|
624
655
|
},
|
|
625
656
|
...mergeProps(themeProps('bottom-sheet'), stylex.props(layerTextReset.reset, layerStructureReset.reset, styles.sheet, overlayPaddingReset.reset, height === 'hug' ? styles.hugHeight : styles.budget, isClosing && styles.sheetClosing, isClosing && isCrossFade && styles.sheetClosingCrossFade, isFading && styles.sheetFading, isInactive && styles.sheetInactive, isEntrySettled && styles.sheetSettled, xstyle), className, {
|
|
626
657
|
['--_sheet-budget']: budget,
|
|
658
|
+
['--_sheet-reserve']: `${reserve}px`,
|
|
627
659
|
...(isInteractive ? gestureStyle : isRetained || isClosing ? {
|
|
628
660
|
height: hostHeight
|
|
629
661
|
} : {}),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bottomSheetStack.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/bottomSheetStack.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"bottomSheetStack.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/bottomSheetStack.ts"],"names":[],"mappings":"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"}
|
|
@@ -4,7 +4,8 @@
|
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
6
|
* @file bottomSheetStack.ts
|
|
7
|
-
* @input The DOM (dialog elements, document order) and
|
|
7
|
+
* @input The DOM (dialog elements, document order) and the focus-return
|
|
8
|
+
* utilities
|
|
8
9
|
* @output The private bottom-sheet stack registry: host registration,
|
|
9
10
|
* open-order ranking, top-layer reconciliation, one view per host, the
|
|
10
11
|
* replace handoff, and the shared native show/hide and focus helpers
|
|
@@ -49,7 +50,7 @@
|
|
|
49
50
|
// two copies of this module on one page share one stack. A copy on another
|
|
50
51
|
// version keeps its own stack. Each document is its own stack.
|
|
51
52
|
import { notifyTopLayerEntry } from "../Layer/modalOutlet.js";
|
|
52
|
-
import { focusForLastInput } from "../utils/focusReturn.js";
|
|
53
|
+
import { focusForLastInput, returnFocusForLastInput } from "../utils/focusReturn.js";
|
|
53
54
|
|
|
54
55
|
/** The motions a host's panel reports to the registry during a replace. */
|
|
55
56
|
|
|
@@ -240,7 +241,7 @@ function completeClosingGroup(group) {
|
|
|
240
241
|
group.reported = true;
|
|
241
242
|
const target = group.returnTarget;
|
|
242
243
|
if (target != null && target.isConnected) {
|
|
243
|
-
|
|
244
|
+
returnFocusForLastInput(target);
|
|
244
245
|
}
|
|
245
246
|
}
|
|
246
247
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSheetGestures.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/useSheetGestures.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;GAWG;AAoCH,OAAO,EAOL,KAAK,aAAa,EAClB,KAAK,UAAU,IAAI,eAAe,EAClC,KAAK,YAAY,IAAI,iBAAiB,EACtC,KAAK,SAAS,EACd,KAAK,UAAU,IAAI,eAAe,EAClC,KAAK,OAAO,IAAI,YAAY,EAC7B,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"useSheetGestures.d.ts","sourceRoot":"","sources":["../../src/BottomSheet/useSheetGestures.ts"],"names":[],"mappings":"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"}
|
|
@@ -49,6 +49,8 @@
|
|
|
49
49
|
// finger ends any drag (yieldToPinch). There is no module-scope DOM access,
|
|
50
50
|
// so the hook is SSR-safe. Reduced motion skips the settle transition.
|
|
51
51
|
import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
|
|
52
|
+
import { rubberBand } from "../motion/rubberBand.js";
|
|
53
|
+
import { scroll } from "../motion/uikit/scroll.js";
|
|
52
54
|
import { computeDetentOffsets, peekOffsetFor, resolveSettleOffset, scrimOpacityForOffset } from "./snapOffsets.js";
|
|
53
55
|
|
|
54
56
|
/**
|
|
@@ -86,13 +88,17 @@ const MAGNET_RANGE = 40;
|
|
|
86
88
|
function isSyntheticTouch(event) {
|
|
87
89
|
return event.syntheticTouch === true;
|
|
88
90
|
}
|
|
91
|
+
// An Apple Pencil raises touch events too, marked `stylus`. Its drag is a
|
|
92
|
+
// pen's, as on the grabber, where WebKit reports it as a pen.
|
|
93
|
+
function touchPointerType(touch) {
|
|
94
|
+
return touch.touchType === 'stylus' ? 'pen' : 'touch';
|
|
95
|
+
}
|
|
89
96
|
|
|
90
|
-
//
|
|
91
|
-
//
|
|
97
|
+
// A mouse's or a pen's stretch past fully open: a resisted fraction of the
|
|
98
|
+
// drag, capped at OVERSCROLL_MAX.
|
|
92
99
|
const OVERSCROLL_RESISTANCE = 0.35;
|
|
93
|
-
// SYNC: must
|
|
94
|
-
//
|
|
95
|
-
// import so it can be used inside stylex.create there.
|
|
100
|
+
// SYNC: must not exceed MIN_RESERVE in BottomSheetPanel.tsx, the smallest
|
|
101
|
+
// reserve the sheet keeps below the screen.
|
|
96
102
|
const OVERSCROLL_MAX = 48;
|
|
97
103
|
// Travel past the point where a scrolling gesture ran out of content before it
|
|
98
104
|
// hands the sheet the rest of the pull. Small enough to feel continuous with
|
|
@@ -253,6 +259,32 @@ function chainAtTop(chain) {
|
|
|
253
259
|
function chainAtBottom(chain) {
|
|
254
260
|
return chain.every(elementAtBottom);
|
|
255
261
|
}
|
|
262
|
+
function chainScrolls(chain) {
|
|
263
|
+
return chain.some(element => element.scrollHeight - element.clientHeight > 1);
|
|
264
|
+
}
|
|
265
|
+
|
|
266
|
+
/**
|
|
267
|
+
* iOS rubber-bands a scroller past its end even under `overscroll-behavior:
|
|
268
|
+
* contain`. While the content sits at its end mid-pull, `none` holds it still,
|
|
269
|
+
* so only the sheet moves. Returns the undo.
|
|
270
|
+
*/
|
|
271
|
+
function holdAtEnd(chain) {
|
|
272
|
+
const previous = chain.map(element => element.style.overscrollBehaviorY);
|
|
273
|
+
for (const element of chain) {
|
|
274
|
+
element.style.overscrollBehaviorY = 'none';
|
|
275
|
+
}
|
|
276
|
+
return () => {
|
|
277
|
+
chain.forEach((element, index) => {
|
|
278
|
+
element.style.overscrollBehaviorY = previous[index];
|
|
279
|
+
});
|
|
280
|
+
};
|
|
281
|
+
}
|
|
282
|
+
function releaseContentHold(armed) {
|
|
283
|
+
if (armed?.releaseContentHold != null) {
|
|
284
|
+
armed.releaseContentHold();
|
|
285
|
+
armed.releaseContentHold = null;
|
|
286
|
+
}
|
|
287
|
+
}
|
|
256
288
|
function visibleHeightForOffset(sheetHeight, offset, offscreenBlockEndInset) {
|
|
257
289
|
return Math.max(0, sheetHeight - offscreenBlockEndInset - offset);
|
|
258
290
|
}
|
|
@@ -301,18 +333,26 @@ export function useSheetGestures({
|
|
|
301
333
|
// onDismiss() and sets `pending`; the host answers in the same update, so
|
|
302
334
|
// the first render afterwards says whether it took the close (its
|
|
303
335
|
// controlled state now says closed: the exit under way is the drag's) or
|
|
304
|
-
// refused it (a guarded onOpenChange left it open: the sheet snaps back
|
|
305
|
-
// the request is spent). Either way the flag is
|
|
306
|
-
// prev-prop pattern, and derived back to false
|
|
307
|
-
// again — so a later close from a control, Escape
|
|
308
|
-
// mistaken for a drag.
|
|
336
|
+
// refused it (a guarded onOpenChange left it open: the sheet snaps back,
|
|
337
|
+
// its scrim with it, and the request is spent). Either way the flag is
|
|
338
|
+
// settled during render, the prev-prop pattern, and derived back to false
|
|
339
|
+
// once the sheet is open again — so a later close from a control, Escape
|
|
340
|
+
// or code is never mistaken for a drag.
|
|
309
341
|
const [touchDragDismissal, setTouchDragDismissal] = useState(null);
|
|
342
|
+
// The render that spends a refused request counts it. The layout effect
|
|
343
|
+
// below answers each count.
|
|
344
|
+
const [refusedDismissalCount, setRefusedDismissalCount] = useState(0);
|
|
310
345
|
if (touchDragDismissal != null) {
|
|
311
346
|
if (touchDragDismissal.pending) {
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
}
|
|
347
|
+
if (isOpenRequested) {
|
|
348
|
+
setTouchDragDismissal(null);
|
|
349
|
+
setRefusedDismissalCount(count => count + 1);
|
|
350
|
+
} else {
|
|
351
|
+
setTouchDragDismissal({
|
|
352
|
+
isTouch: touchDragDismissal.isTouch,
|
|
353
|
+
pending: false
|
|
354
|
+
});
|
|
355
|
+
}
|
|
316
356
|
} else if (isOpenRequested) {
|
|
317
357
|
setTouchDragDismissal(null);
|
|
318
358
|
}
|
|
@@ -420,6 +460,24 @@ export function useSheetGestures({
|
|
|
420
460
|
hasFixedHeightRef.current = hasFixedHeight;
|
|
421
461
|
});
|
|
422
462
|
|
|
463
|
+
// The release cannot know whether the host takes the close. The host
|
|
464
|
+
// answers through `isOpenRequested` in the next render. Keep the left
|
|
465
|
+
// detent's scrim until then.
|
|
466
|
+
const restingScrimOpacityRef = useRef(null);
|
|
467
|
+
// Syncs the host's scrim (its backdrop, written through `onScrimOpacity`)
|
|
468
|
+
// with the panel's return to rest after a refusal: the panel rests on that
|
|
469
|
+
// detent again, so the scrim the drag thinned toward the dismiss line rests
|
|
470
|
+
// with it. The refusal changes none of the host's own scrim inputs, so the
|
|
471
|
+
// drag's last value would otherwise stand.
|
|
472
|
+
useLayoutEffect(() => {
|
|
473
|
+
const restingScrimOpacity = restingScrimOpacityRef.current;
|
|
474
|
+
if (refusedDismissalCount === 0 || restingScrimOpacity == null) {
|
|
475
|
+
return;
|
|
476
|
+
}
|
|
477
|
+
restingScrimOpacityRef.current = null;
|
|
478
|
+
onScrimOpacityRef.current?.(restingScrimOpacity);
|
|
479
|
+
}, [refusedDismissalCount]);
|
|
480
|
+
|
|
423
481
|
// Live drag bookkeeping (refs so pointermove doesn't churn renders).
|
|
424
482
|
const dragStateRef = useRef(null);
|
|
425
483
|
|
|
@@ -738,6 +796,7 @@ export function useSheetGestures({
|
|
|
738
796
|
if (dir > 0 && projected > dismissOffset) {
|
|
739
797
|
if (canDismissRef.current) {
|
|
740
798
|
prepareScrollAreaSettle(baseLayoutOffset, baseOffset, baseLayoutOffset, baseLayoutOffset, baseLayoutOffset, naturalEndGap, false);
|
|
799
|
+
restingScrimOpacityRef.current = scrimOpacityForOffset(baseOffset, offsets, dismissOffset, peekOffset);
|
|
741
800
|
setTouchDragDismissal({
|
|
742
801
|
isTouch,
|
|
743
802
|
pending: true
|
|
@@ -775,7 +834,7 @@ export function useSheetGestures({
|
|
|
775
834
|
const baseLayoutOffset = settledLayoutOffsetRef.current;
|
|
776
835
|
dragStateRef.current = {
|
|
777
836
|
syntheticTouch,
|
|
778
|
-
pointerType:
|
|
837
|
+
pointerType: event.pointerType,
|
|
779
838
|
pointerId: event.pointerId,
|
|
780
839
|
startCoord: start,
|
|
781
840
|
lastCoord: event.clientY,
|
|
@@ -786,6 +845,7 @@ export function useSheetGestures({
|
|
|
786
845
|
}],
|
|
787
846
|
velocity: 0,
|
|
788
847
|
height: sheetHeight,
|
|
848
|
+
reserve: offscreenBlockEndInsetRef.current,
|
|
789
849
|
baseOffset: settledOffset,
|
|
790
850
|
baseLayoutOffset,
|
|
791
851
|
renderedOffset: settledOffset,
|
|
@@ -866,8 +926,9 @@ export function useSheetGestures({
|
|
|
866
926
|
const maxDetentOffset = offsets[offsets.length - 1];
|
|
867
927
|
let next;
|
|
868
928
|
if (raw < 0) {
|
|
869
|
-
//
|
|
870
|
-
|
|
929
|
+
// A touch device's reserve covers the whole stretch. The clamp binds
|
|
930
|
+
// only where the reserve is short.
|
|
931
|
+
next = state.pointerType === 'touch' ? Math.max(-state.reserve, rubberBand(raw, state.height - state.reserve, scroll.rubberBand.coefficient)) : Math.max(-OVERSCROLL_MAX, raw * OVERSCROLL_RESISTANCE);
|
|
871
932
|
} else if (raw > maxDetentOffset) {
|
|
872
933
|
// In the dismiss zone: no magnet, so it doesn't fight a drag-to-close.
|
|
873
934
|
next = raw;
|
|
@@ -1008,6 +1069,7 @@ export function useSheetGestures({
|
|
|
1008
1069
|
// hand-off and any drag in flight so nothing claims (or preventDefault()s)
|
|
1009
1070
|
// the gesture; the sheet returns to its detent.
|
|
1010
1071
|
const yieldToPinch = useCallback(target => {
|
|
1072
|
+
releaseContentHold(touchDragRef.current);
|
|
1011
1073
|
touchDragRef.current = null;
|
|
1012
1074
|
armedBodyRef.current = null;
|
|
1013
1075
|
cancelDrag(target);
|
|
@@ -1030,6 +1092,7 @@ export function useSheetGestures({
|
|
|
1030
1092
|
const asPointer = (touch, target) => ({
|
|
1031
1093
|
syntheticTouch: true,
|
|
1032
1094
|
pointerId: touch.identifier,
|
|
1095
|
+
pointerType: touchPointerType(touch),
|
|
1033
1096
|
clientY: touch.clientY,
|
|
1034
1097
|
timeStamp: Date.now(),
|
|
1035
1098
|
currentTarget: target,
|
|
@@ -1049,21 +1112,19 @@ export function useSheetGestures({
|
|
|
1049
1112
|
// scroll, but it is tracked all the same: the scroller can run out of
|
|
1050
1113
|
// content while the finger is still down (see onTouchMove). A touch
|
|
1051
1114
|
// inside a layer this sheet hosts is that layer's, never tracked here.
|
|
1115
|
+
releaseContentHold(touchDragRef.current);
|
|
1052
1116
|
if (!touch || isInsideNestedLayer(event.target, body)) {
|
|
1053
1117
|
touchDragRef.current = null;
|
|
1054
1118
|
return;
|
|
1055
1119
|
}
|
|
1056
1120
|
const scrollers = scrollChainUnder(event.target, body);
|
|
1057
1121
|
const top = chainAtTop(scrollers);
|
|
1058
|
-
//
|
|
1059
|
-
//
|
|
1060
|
-
//
|
|
1061
|
-
//
|
|
1062
|
-
//
|
|
1063
|
-
|
|
1064
|
-
// downward to scroll back would collapse the sheet instead. Leave the
|
|
1065
|
-
// gesture with the content.
|
|
1066
|
-
const bottom = chainAtBottom(scrollers) && activeOffsetRef.current > 0;
|
|
1122
|
+
// Claiming a pull up from its first move blocks the content's scroll for
|
|
1123
|
+
// the whole touch. So it is claimed here only below the tallest detent,
|
|
1124
|
+
// or over content that cannot scroll. At the tallest detent, a list at
|
|
1125
|
+
// its end keeps its touch. Its pull reaches the sheet through the
|
|
1126
|
+
// content-end hand-off below, and a reversal hands it back.
|
|
1127
|
+
const bottom = chainAtBottom(scrollers) && (activeOffsetRef.current > 0 || !chainScrolls(scrollers));
|
|
1067
1128
|
touchDragRef.current = {
|
|
1068
1129
|
id: touch.identifier,
|
|
1069
1130
|
startY: touch.clientY,
|
|
@@ -1071,7 +1132,8 @@ export function useSheetGestures({
|
|
|
1071
1132
|
top,
|
|
1072
1133
|
bottom,
|
|
1073
1134
|
contentEndY: null,
|
|
1074
|
-
promotedAtContentEnd: false
|
|
1135
|
+
promotedAtContentEnd: false,
|
|
1136
|
+
releaseContentHold: null
|
|
1075
1137
|
};
|
|
1076
1138
|
};
|
|
1077
1139
|
const onTouchMove = event => {
|
|
@@ -1098,6 +1160,7 @@ export function useSheetGestures({
|
|
|
1098
1160
|
// at once; a later pull past the end promotes again.
|
|
1099
1161
|
armed.contentEndY = null;
|
|
1100
1162
|
armed.promotedAtContentEnd = false;
|
|
1163
|
+
releaseContentHold(armed);
|
|
1101
1164
|
cancelDragRef.current(scroller);
|
|
1102
1165
|
return;
|
|
1103
1166
|
}
|
|
@@ -1127,6 +1190,7 @@ export function useSheetGestures({
|
|
|
1127
1190
|
const pullUpAtBottom = armed.bottom && delta < -DRAG_PROMOTION_SLOP && chainAtBottom(armed.scrollers);
|
|
1128
1191
|
if (pullDownAtTop || pullUpAtBottom) {
|
|
1129
1192
|
event.preventDefault();
|
|
1193
|
+
releaseContentHold(armed);
|
|
1130
1194
|
touchDragRef.current = null;
|
|
1131
1195
|
beginDragRef.current(asPointer(t, scroller), measureHeightRef.current(), armed.startY);
|
|
1132
1196
|
pointerMoveRef.current(asPointer(t, scroller));
|
|
@@ -1142,13 +1206,14 @@ export function useSheetGestures({
|
|
|
1142
1206
|
// cannot see this, and re-arming for a preventDefault() promotion would
|
|
1143
1207
|
// be useless anyway: once the browser has committed the gesture to
|
|
1144
1208
|
// scrolling, every remaining touchmove is non-cancelable. Nothing needs
|
|
1145
|
-
// cancelling either
|
|
1146
|
-
// upward travel scrolls nothing. Anchor at the point where the content
|
|
1209
|
+
// cancelling either: the hold clamps the scroller at its maximum, so
|
|
1210
|
+
// further upward travel scrolls nothing. Anchor at the point where the content
|
|
1147
1211
|
// ran out and give the sheet everything past it, so the pull continues
|
|
1148
1212
|
// into the sheet with no jump and no lost scrolling.
|
|
1149
|
-
if (
|
|
1213
|
+
if (chainAtBottom(armed.scrollers)) {
|
|
1150
1214
|
if (armed.contentEndY == null) {
|
|
1151
1215
|
armed.contentEndY = t.clientY;
|
|
1216
|
+
armed.releaseContentHold ??= holdAtEnd(armed.scrollers);
|
|
1152
1217
|
} else if (armed.contentEndY - t.clientY >= CONTENT_END_HANDOFF_SLOP) {
|
|
1153
1218
|
armed.promotedAtContentEnd = true;
|
|
1154
1219
|
beginDragRef.current(asPointer(t, scroller), measureHeightRef.current(), armed.contentEndY);
|
|
@@ -1156,9 +1221,11 @@ export function useSheetGestures({
|
|
|
1156
1221
|
}
|
|
1157
1222
|
} else {
|
|
1158
1223
|
armed.contentEndY = null;
|
|
1224
|
+
releaseContentHold(armed);
|
|
1159
1225
|
}
|
|
1160
1226
|
};
|
|
1161
1227
|
const onTouchEnd = event => {
|
|
1228
|
+
releaseContentHold(touchDragRef.current);
|
|
1162
1229
|
touchDragRef.current = null;
|
|
1163
1230
|
const pointerId = dragStateRef.current?.pointerId;
|
|
1164
1231
|
if (pointerId == null) {
|