@astryxdesign/core 0.7.8 → 0.7.9-canary.0236bb8
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/AppShell/observeMainOverflow.d.ts.map +1 -1
- package/dist/AppShell/observeMainOverflow.js +9 -6
- package/dist/BottomSheet/BottomSheet.d.ts.map +1 -1
- package/dist/BottomSheet/BottomSheet.js +7 -2
- 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 +61 -21
- 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/Calendar/styles.d.ts +1 -1
- package/dist/CheckboxInput/CheckboxInput.d.ts +2 -1
- package/dist/CheckboxInput/CheckboxInput.d.ts.map +1 -1
- package/dist/CheckboxInput/CheckboxInput.js +74 -18
- 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 +40 -14
- package/dist/ClickableCard/ClickableCard.d.ts +1 -1
- package/dist/ClickableCard/ClickableCard.d.ts.map +1 -1
- package/dist/ClickableCard/ClickableCard.js +5 -1
- package/dist/ContextMenu/ContextMenu.d.ts.map +1 -1
- package/dist/ContextMenu/ContextMenu.js +2 -0
- 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/PickerWheel.d.ts.map +1 -1
- package/dist/DateInput/PickerWheel.js +7 -1
- 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/DateRangeInput/DateRangeInput.d.ts +17 -1
- package/dist/DateRangeInput/DateRangeInput.d.ts.map +1 -1
- package/dist/DateRangeInput/DateRangeInput.js +15 -8
- package/dist/DateTimeInput/DateTimeInput.d.ts +26 -3
- package/dist/DateTimeInput/DateTimeInput.d.ts.map +1 -1
- package/dist/DateTimeInput/DateTimeInput.js +92 -88
- 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 +2 -1
- package/dist/Dialog/Dialog.d.ts.map +1 -1
- package/dist/Dialog/Dialog.js +14 -3
- package/dist/Drawer/useDrawerDialogPresence.d.ts +2 -1
- package/dist/Drawer/useDrawerDialogPresence.d.ts.map +1 -1
- package/dist/Drawer/useDrawerDialogPresence.js +11 -2
- package/dist/DropdownMenu/DropdownMenu.d.ts +9 -1
- package/dist/DropdownMenu/DropdownMenu.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenu.js +11 -8
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuCheckboxItem.js +3 -2
- package/dist/DropdownMenu/DropdownMenuItem.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuItem.js +3 -2
- package/dist/DropdownMenu/DropdownMenuRadioItem.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuRadioItem.js +3 -2
- package/dist/DropdownMenu/DropdownMenuSubMenu.d.ts.map +1 -1
- package/dist/DropdownMenu/DropdownMenuSubMenu.js +3 -2
- package/dist/Field/inputDisabledFocus.d.ts +4 -4
- package/dist/Field/inputStyles.stylex.d.ts +1 -1
- package/dist/FileInput/FileInput.d.ts.map +1 -1
- package/dist/FileInput/FileInput.js +16 -2
- package/dist/HoverCard/useHoverCard.d.ts +3 -1
- package/dist/HoverCard/useHoverCard.d.ts.map +1 -1
- package/dist/Icon/Icon.d.ts +1 -1
- package/dist/InfoTip/InfoTip.d.ts +1 -0
- package/dist/InfoTip/InfoTip.d.ts.map +1 -1
- package/dist/InfoTip/InfoTip.js +6 -18
- package/dist/InputGroup/InputGroup.d.ts +4 -3
- package/dist/InputGroup/InputGroup.d.ts.map +1 -1
- package/dist/InputGroup/InputGroup.js +2 -2
- package/dist/InputGroup/groupStyles.d.ts +1 -1
- package/dist/InputGroup/groupStyles.d.ts.map +1 -1
- package/dist/InputGroup/groupStyles.js +1 -1
- package/dist/Item/Item.d.ts +20 -1
- package/dist/Item/Item.d.ts.map +1 -1
- package/dist/Item/Item.js +97 -29
- 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/holdEntranceInput.d.ts +24 -0
- package/dist/Layer/holdEntranceInput.d.ts.map +1 -0
- package/dist/Layer/holdEntranceInput.js +65 -0
- package/dist/Layer/inputHold.d.ts +49 -0
- package/dist/Layer/inputHold.d.ts.map +1 -0
- package/dist/Layer/inputHold.js +636 -0
- 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/preserveAnimations.d.ts +1 -5
- package/dist/Layer/preserveAnimations.d.ts.map +1 -1
- package/dist/Layer/preserveAnimations.js +12 -214
- 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 +64 -4
- package/dist/Layer/useTouchTrigger.d.ts.map +1 -1
- package/dist/Layer/useTouchTrigger.js +4 -0
- package/dist/Layout/LayoutContent.d.ts +3 -1
- package/dist/Layout/LayoutContent.d.ts.map +1 -1
- package/dist/Layout/LayoutContent.js +12 -4
- package/dist/Layout/LayoutPanel.d.ts +13 -10
- package/dist/Layout/LayoutPanel.d.ts.map +1 -1
- package/dist/Layout/LayoutPanel.js +70 -9
- package/dist/Lightbox/Lightbox.d.ts.map +1 -1
- package/dist/Lightbox/Lightbox.js +4 -0
- 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/MetadataList/MetadataList.js +1 -1
- package/dist/MobileNav/MobileNav.d.ts +11 -1
- package/dist/MobileNav/MobileNav.d.ts.map +1 -1
- package/dist/MobileNav/MobileNav.js +39 -1
- package/dist/MoreMenu/MoreMenu.d.ts +5 -3
- package/dist/MoreMenu/MoreMenu.d.ts.map +1 -1
- package/dist/MultiSelector/MultiSelector.d.ts.map +1 -1
- package/dist/MultiSelector/MultiSelector.js +6 -9
- 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/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 +12 -5
- 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 +16 -3
- 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/SelectableCard/SelectableCard.d.ts +1 -1
- package/dist/SelectableCard/SelectableCard.d.ts.map +1 -1
- package/dist/SelectableCard/SelectableCard.js +5 -1
- package/dist/Selector/Selector.d.ts.map +1 -1
- package/dist/Selector/Selector.js +51 -10
- 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/Spinner/Spinner.d.ts.map +1 -1
- package/dist/Spinner/Spinner.js +14 -71
- 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/Stack/StackItem.d.ts +8 -4
- package/dist/Stack/StackItem.d.ts.map +1 -1
- package/dist/Stack/StackItem.js +17 -4
- package/dist/Switch/Switch.d.ts.map +1 -1
- package/dist/Switch/Switch.js +13 -10
- package/dist/TabList/Tab.d.ts.map +1 -1
- package/dist/TabList/Tab.js +5 -1
- package/dist/Table/plugins/sortable/useTableSortable.js +1 -1
- package/dist/Timestamp/Timestamp.d.ts.map +1 -1
- package/dist/Timestamp/Timestamp.js +14 -8
- 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/Token/Token.d.ts.map +1 -1
- package/dist/Token/Token.js +9 -0
- package/dist/Token/TokenLink.d.ts +1 -1
- package/dist/Token/TokenLink.d.ts.map +1 -1
- package/dist/Token/TokenLink.js +4 -1
- package/dist/Tokenizer/Tokenizer.d.ts +14 -10
- package/dist/Tokenizer/Tokenizer.d.ts.map +1 -1
- package/dist/Tokenizer/Tokenizer.js +189 -89
- package/dist/Tooltip/useTooltip.d.ts +3 -1
- package/dist/Tooltip/useTooltip.d.ts.map +1 -1
- package/dist/Tooltip/useTooltip.js +164 -59
- package/dist/TreeList/TreeListItem.d.ts +2 -1
- package/dist/TreeList/TreeListItem.d.ts.map +1 -1
- package/dist/TreeList/TreeListItem.js +27 -3
- package/dist/Typeahead/BaseTypeahead.d.ts.map +1 -1
- package/dist/Typeahead/BaseTypeahead.js +2 -1
- package/dist/astryx.css +362 -325
- package/dist/gestures/GestureHost.d.ts +2 -2
- package/dist/gestures/GestureHost.d.ts.map +1 -1
- package/dist/gestures/GestureHost.js +21 -6
- package/dist/gestures/PanGestureRecognizer.d.ts +11 -1
- package/dist/gestures/PanGestureRecognizer.d.ts.map +1 -1
- package/dist/gestures/PanGestureRecognizer.js +15 -1
- package/dist/gestures/ScreenEdgePanGestureRecognizer.d.ts +6 -1
- package/dist/gestures/ScreenEdgePanGestureRecognizer.d.ts.map +1 -1
- package/dist/gestures/nativeScroll.d.ts +3 -6
- package/dist/gestures/nativeScroll.d.ts.map +1 -1
- package/dist/gestures/nativeScroll.js +7 -52
- package/dist/gestures/wheelSegmenter.d.ts +68 -1
- package/dist/gestures/wheelSegmenter.d.ts.map +1 -1
- package/dist/gestures/wheelSegmenter.js +199 -10
- package/dist/hooks/StackItemScrollRegion.d.ts +31 -0
- package/dist/hooks/StackItemScrollRegion.d.ts.map +1 -0
- package/dist/hooks/StackItemScrollRegion.js +40 -0
- 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/menuPressGesture.d.ts +133 -21
- package/dist/hooks/menuPressGesture.d.ts.map +1 -1
- package/dist/hooks/menuPressGesture.js +155 -30
- package/dist/hooks/menuPressValues.d.ts +16 -0
- package/dist/hooks/menuPressValues.d.ts.map +1 -0
- package/dist/hooks/menuPressValues.js +18 -0
- package/dist/hooks/useClickableContainer.d.ts +36 -7
- package/dist/hooks/useClickableContainer.d.ts.map +1 -1
- package/dist/hooks/useClickableContainer.js +63 -14
- package/dist/hooks/useFocusTrap.d.ts +10 -0
- package/dist/hooks/useFocusTrap.d.ts.map +1 -1
- package/dist/hooks/useFocusTrap.js +225 -132
- 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 +34 -1
- package/dist/hooks/useMenuPress.d.ts.map +1 -1
- package/dist/hooks/useMenuPress.js +93 -5
- package/dist/hooks/useOverflow.d.ts.map +1 -1
- package/dist/hooks/useOverflow.js +190 -21
- package/dist/hooks/usePressFeedback.d.ts +6 -6
- package/dist/hooks/usePressFeedback.js +6 -6
- package/dist/hooks/useScrollRegionProps.d.ts +35 -0
- package/dist/hooks/useScrollRegionProps.d.ts.map +1 -0
- package/dist/hooks/useScrollRegionProps.js +51 -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-english/hooks/useScrollRegionProps.generated.d.ts +8 -0
- package/dist/i18n/generated-english/hooks/useScrollRegionProps.generated.d.ts.map +1 -0
- package/dist/i18n/generated-english/hooks/useScrollRegionProps.generated.js +12 -0
- package/dist/i18n/generated-locales/en.generated.d.ts.map +1 -1
- package/dist/i18n/generated-locales/en.generated.js +5 -0
- package/dist/i18n/generated-locales/pseudo.generated.d.ts.map +1 -1
- package/dist/i18n/generated-locales/pseudo.generated.js +5 -0
- 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/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 +14 -1
- package/dist/internal/touch.d.ts.map +1 -1
- package/dist/internal/touch.js +20 -2
- package/dist/motion/carryAnimations.d.ts +58 -0
- package/dist/motion/carryAnimations.d.ts.map +1 -0
- package/dist/motion/carryAnimations.js +305 -0
- package/dist/motion/transientCopy.d.ts +4 -2
- package/dist/motion/transientCopy.d.ts.map +1 -1
- package/dist/motion/transientCopy.js +34 -5
- package/dist/motion/uikit/gestures.d.ts +41 -0
- package/dist/motion/uikit/gestures.d.ts.map +1 -1
- package/dist/motion/uikit/gestures.js +25 -0
- package/dist/motion/uikit/index.d.ts +1 -1
- package/dist/motion/uikit/index.d.ts.map +1 -1
- package/dist/motion/uikit/index.js +1 -1
- package/dist/motion/uikit/timing.d.ts +14 -10
- package/dist/motion/uikit/timing.d.ts.map +1 -1
- package/dist/motion/uikit/timing.js +7 -5
- package/dist/privateAttributes/menuPressLit.stylex.d.ts +52 -0
- package/dist/privateAttributes/menuPressLit.stylex.d.ts.map +1 -0
- package/dist/privateAttributes/menuPressLit.stylex.js +99 -0
- package/dist/privateAttributes/press.stylex.d.ts +142 -0
- package/dist/privateAttributes/press.stylex.d.ts.map +1 -0
- package/dist/privateAttributes/press.stylex.js +101 -0
- package/dist/theme/themeMotion.d.ts +3 -2
- package/dist/theme/themeMotion.d.ts.map +1 -1
- package/dist/theme/themeMotion.js +3 -2
- package/dist/theme/tokens.stylex.d.ts +2 -2
- package/dist/theme/tokens.stylex.js +1 -1
- 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/flatTree.d.ts +6 -3
- package/dist/utils/flatTree.d.ts.map +1 -1
- package/dist/utils/flatTree.js +13 -3
- package/dist/utils/focusReturn.d.ts +10 -2
- package/dist/utils/focusReturn.d.ts.map +1 -1
- package/dist/utils/focusReturn.js +16 -3
- package/dist/utils/hitArea.d.ts +8 -1
- package/dist/utils/hitArea.d.ts.map +1 -1
- package/dist/utils/hitArea.js +99 -9
- 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/inputStream.d.ts +14 -1
- package/dist/utils/inputStream.d.ts.map +1 -1
- package/dist/utils/inputStream.js +40 -9
- package/dist/utils/interactionOverlay.stylex.d.ts +5 -9
- package/dist/utils/interactionOverlay.stylex.d.ts.map +1 -1
- package/dist/utils/interactionOverlay.stylex.js +29 -31
- 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/pressFeedback.d.ts +10 -2
- package/dist/utils/pressFeedback.d.ts.map +1 -1
- package/dist/utils/pressFeedback.js +40 -15
- package/dist/utils/pressGesture.d.ts +12 -6
- package/dist/utils/pressGesture.d.ts.map +1 -1
- package/dist/utils/pressGesture.js +26 -8
- package/dist/utils/scrollView.d.ts +25 -0
- package/dist/utils/scrollView.d.ts.map +1 -0
- package/dist/utils/scrollView.js +108 -0
- package/dist/utils/selectionLock.d.ts.map +1 -1
- package/dist/utils/selectionLock.js +1 -10
- package/dist/utils/touchHitArea.d.ts +30 -0
- package/dist/utils/touchHitArea.d.ts.map +1 -0
- package/dist/utils/touchHitArea.js +167 -0
- package/dist/utils/touchHitArea.stylex.d.ts +38 -0
- package/dist/utils/touchHitArea.stylex.d.ts.map +1 -0
- package/dist/utils/touchHitArea.stylex.js +48 -0
- package/dist/utils/triggerFocus.d.ts +5 -0
- package/dist/utils/triggerFocus.d.ts.map +1 -1
- package/dist/utils/triggerFocus.js +9 -2
- package/locales/en.json +21 -1
- package/locales/pseudo.json +15 -0
- package/package.json +15 -4
- package/src/AppShell/observeMainOverflow.ts +9 -6
- package/src/BottomSheet/BottomSheet.tsx +7 -2
- package/src/BottomSheet/BottomSheetPanel.tsx +64 -7
- package/src/BottomSheet/bottomSheetStack.ts +4 -3
- package/src/BottomSheet/useSheetGestures.ts +83 -20
- 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/CheckboxInput/CheckboxInput.doc.mjs +5 -4
- package/src/CheckboxInput/CheckboxInput.tsx +105 -20
- 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 +35 -14
- package/src/ClickableCard/ClickableCard.tsx +8 -1
- package/src/ContextMenu/ContextMenu.tsx +2 -0
- 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/PickerWheel.tsx +7 -2
- 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/DateRangeInput/DateRangeInput.doc.mjs +9 -0
- package/src/DateRangeInput/DateRangeInput.tsx +43 -9
- package/src/DateTimeInput/DateTimeInput.doc.mjs +42 -9
- package/src/DateTimeInput/DateTimeInput.tsx +138 -148
- package/src/DateTimeInput/TouchDateTimeField.tsx +31 -16
- package/src/Dialog/Dialog.doc.mjs +1 -1
- package/src/Dialog/Dialog.tsx +14 -2
- package/src/Drawer/Drawer.doc.mjs +1 -1
- package/src/Drawer/useDrawerDialogPresence.ts +9 -2
- package/src/DropdownMenu/DropdownMenu.doc.mjs +1 -2
- package/src/DropdownMenu/DropdownMenu.tsx +31 -7
- package/src/DropdownMenu/DropdownMenuCheckboxItem.tsx +5 -1
- package/src/DropdownMenu/DropdownMenuItem.tsx +8 -4
- package/src/DropdownMenu/DropdownMenuRadioItem.tsx +5 -1
- package/src/DropdownMenu/DropdownMenuSubMenu.tsx +5 -1
- package/src/FileInput/FileInput.tsx +16 -2
- package/src/HoverCard/useHoverCard.tsx +3 -1
- package/src/InfoTip/InfoTip.doc.mjs +26 -2
- package/src/InfoTip/InfoTip.tsx +6 -27
- package/src/InputGroup/InputGroup.doc.mjs +4 -3
- package/src/InputGroup/InputGroup.tsx +4 -3
- package/src/InputGroup/groupStyles.ts +3 -1
- package/src/Item/Item.tsx +139 -35
- package/src/Item/ItemListRowContext.tsx +18 -0
- package/src/Layer/holdEntranceInput.ts +84 -0
- package/src/Layer/inputHold.ts +734 -0
- package/src/Layer/outsidePress.ts +18 -1
- package/src/Layer/preserveAnimations.ts +12 -275
- package/src/Layer/useBackdropPress.ts +41 -1
- package/src/Layer/useLayer.tsx +77 -4
- package/src/Layer/useTouchTrigger.ts +4 -0
- package/src/Layout/LayoutContent.doc.mjs +6 -3
- package/src/Layout/LayoutContent.tsx +10 -4
- package/src/Layout/LayoutPanel.doc.mjs +14 -11
- package/src/Layout/LayoutPanel.tsx +98 -15
- package/src/Lightbox/Lightbox.tsx +4 -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/MetadataList/MetadataList.tsx +1 -1
- package/src/MobileNav/MobileNav.doc.mjs +3 -3
- package/src/MobileNav/MobileNav.tsx +39 -1
- package/src/MoreMenu/MoreMenu.doc.mjs +2 -4
- package/src/MoreMenu/MoreMenu.tsx +5 -3
- package/src/MultiSelector/MultiSelector.tsx +7 -17
- package/src/NumberInput/NumberInput.doc.mjs +1 -1
- package/src/NumberInput/NumberInput.tsx +259 -11
- package/src/Popover/usePopover.tsx +1 -0
- package/src/PowerSearch/PowerSearch.doc.mjs +3 -3
- package/src/PowerSearch/PowerSearch.tsx +20 -3
- 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.doc.mjs +3 -2
- package/src/RadioList/RadioListItem.tsx +16 -6
- 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/SelectableCard/SelectableCard.tsx +8 -1
- package/src/Selector/Selector.tsx +83 -8
- package/src/SideNav/SideNav.doc.mjs +2 -2
- package/src/SideNav/SideNav.tsx +87 -12
- package/src/Spinner/Spinner.tsx +7 -89
- package/src/Spinner/index.ts +1 -5
- package/src/Spinner/spinnerRotor.ts +113 -0
- package/src/Stack/Stack.doc.mjs +1 -1
- package/src/Stack/StackItem.tsx +27 -13
- package/src/Switch/Switch.tsx +7 -6
- package/src/TabList/Tab.tsx +5 -1
- package/src/Table/plugins/sortable/useTableSortable.tsx +1 -1
- package/src/Timestamp/Timestamp.doc.mjs +3 -3
- package/src/Timestamp/Timestamp.tsx +13 -8
- package/src/Timestamp/formatInstant.ts +49 -28
- package/src/Timestamp/tooltipEntries.ts +7 -3
- package/src/Token/Token.tsx +18 -1
- package/src/Token/TokenLink.tsx +7 -1
- package/src/Tokenizer/Tokenizer.doc.mjs +3 -3
- package/src/Tokenizer/Tokenizer.tsx +252 -115
- package/src/Tooltip/useTooltip.tsx +180 -80
- package/src/TreeList/TreeListItem.tsx +36 -2
- package/src/Typeahead/BaseTypeahead.tsx +2 -0
- package/src/gestures/GestureHost.ts +21 -5
- package/src/gestures/PanGestureRecognizer.ts +19 -2
- package/src/gestures/README.md +14 -5
- package/src/gestures/ScreenEdgePanGestureRecognizer.ts +6 -1
- package/src/gestures/nativeScroll.ts +12 -68
- package/src/gestures/wheelSegmenter.ts +243 -10
- package/src/hooks/StackItemScrollRegion.tsx +57 -0
- package/src/hooks/computeOverflow.ts +1 -1
- package/src/hooks/menuPressGesture.ts +244 -38
- package/src/hooks/menuPressValues.ts +18 -0
- package/src/hooks/useClickableContainer.doc.mjs +8 -2
- package/src/hooks/useClickableContainer.ts +93 -15
- package/src/hooks/useFocusTrap.ts +268 -151
- package/src/hooks/useKeyboardHighlight.ts +71 -0
- package/src/hooks/useMediaQuery.ts +41 -12
- package/src/hooks/useMenuPress.ts +118 -11
- package/src/hooks/useOverflow.ts +297 -73
- package/src/hooks/usePressFeedback.doc.mjs +3 -3
- package/src/hooks/usePressFeedback.ts +6 -6
- package/src/hooks/useScrollRegionProps.ts +76 -0
- 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-english/hooks/useScrollRegionProps.generated.ts +13 -0
- 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/internal/calendar-system.ts +26 -0
- package/src/internal/spinner-rotor.ts +20 -0
- package/src/internal/touch.ts +34 -1
- package/src/motion/MEASUREMENTS.md +11 -0
- package/src/motion/carryAnimations.ts +389 -0
- package/src/motion/transientCopy.ts +45 -5
- package/src/motion/uikit/gestures.ts +22 -0
- package/src/motion/uikit/index.ts +1 -0
- package/src/motion/uikit/timing.ts +7 -5
- package/src/privateAttributes/menuPressLit.stylex.ts +104 -0
- package/src/privateAttributes/press.stylex.ts +261 -0
- package/src/theme/themeMotion.ts +3 -2
- package/src/theme/tokens.stylex.ts +1 -1
- package/src/utils/calendarDateParser.ts +1385 -0
- package/src/utils/calendarSystem.ts +832 -0
- package/src/utils/coarsePointer.ts +27 -14
- package/src/utils/flatTree.ts +15 -3
- package/src/utils/focusReturn.ts +17 -3
- package/src/utils/hitArea.ts +138 -9
- package/src/utils/inputPresentation.ts +21 -1
- package/src/utils/inputStream.ts +47 -10
- package/src/utils/interactionOverlay.stylex.ts +19 -22
- package/src/utils/plainDate.ts +130 -19
- package/src/utils/pressFeedback.ts +46 -14
- package/src/utils/pressGesture.ts +35 -9
- package/src/utils/scrollView.ts +135 -0
- package/src/utils/selectionLock.ts +5 -10
- package/src/utils/touchHitArea.stylex.ts +56 -0
- package/src/utils/touchHitArea.ts +177 -0
- package/src/utils/triggerFocus.ts +17 -4
|
@@ -0,0 +1,137 @@
|
|
|
1
|
+
// Copyright (c) Meta Platforms, Inc. and affiliates.
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* @file resizablePane.ts
|
|
5
|
+
* @input A LayoutPanel's element, and the collapse state the ResizeHandle
|
|
6
|
+
* beside it reports
|
|
7
|
+
* @output The internal channel through which a LayoutPanel at a region's size
|
|
8
|
+
* lends its element to the ResizeHandle beside it, and the ResizeHandle a
|
|
9
|
+
* collapsing panel hands focus to
|
|
10
|
+
* @position Internal to Resizable and Layout; no entry point exports it. No
|
|
11
|
+
* React, and no DOM work on import
|
|
12
|
+
*/
|
|
13
|
+
|
|
14
|
+
/** What a LayoutPanel lends the ResizeHandle beside it. */
|
|
15
|
+
|
|
16
|
+
const lent = new WeakMap();
|
|
17
|
+
const watchers = new Set();
|
|
18
|
+
// The elements ResizeHandle renders, for a panel beside one to find it.
|
|
19
|
+
const resizeHandles = new WeakSet();
|
|
20
|
+
|
|
21
|
+
/** ResizeHandle registers the element it renders; returns the unregister. */
|
|
22
|
+
export function registerResizeHandle(element) {
|
|
23
|
+
resizeHandles.add(element);
|
|
24
|
+
return () => {
|
|
25
|
+
resizeHandles.delete(element);
|
|
26
|
+
};
|
|
27
|
+
}
|
|
28
|
+
function notifyWatchers() {
|
|
29
|
+
for (const watcher of [...watchers]) {
|
|
30
|
+
watcher();
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
/**
|
|
35
|
+
* Calls `listener` whenever a panel is lent beside a handle or taken back, so
|
|
36
|
+
* a handle looks for its pane again. Returns the function that stops it.
|
|
37
|
+
*/
|
|
38
|
+
export function watchResizablePanes(listener) {
|
|
39
|
+
watchers.add(listener);
|
|
40
|
+
return () => {
|
|
41
|
+
watchers.delete(listener);
|
|
42
|
+
};
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
/**
|
|
46
|
+
* The pane a resize handle resizes: the lent LayoutPanel just before it, or
|
|
47
|
+
* just after it when the region is reversed.
|
|
48
|
+
*/
|
|
49
|
+
export function resizablePaneFor(handle, isReversed) {
|
|
50
|
+
const sibling = isReversed ? handle.nextElementSibling : handle.previousElementSibling;
|
|
51
|
+
return sibling == null ? null : lent.get(sibling) ?? null;
|
|
52
|
+
}
|
|
53
|
+
|
|
54
|
+
/**
|
|
55
|
+
* Moves a handle's hold from `held` to `next`, and returns `next`. A pane the
|
|
56
|
+
* handle no longer holds opens. The held pane takes the region's collapse
|
|
57
|
+
* state, and focus inside it moves to `handle` as it collapses.
|
|
58
|
+
*/
|
|
59
|
+
export function handOverPane(held, next, isCollapsed, handle) {
|
|
60
|
+
if (next !== held) {
|
|
61
|
+
held?.setCollapsed(false, null);
|
|
62
|
+
}
|
|
63
|
+
next?.setCollapsed(isCollapsed, handle);
|
|
64
|
+
return next;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
/**
|
|
68
|
+
* The ResizeHandle beside a panel, on the side that faces the content. It is
|
|
69
|
+
* after a start panel, before an end panel, and on either side elsewhere.
|
|
70
|
+
*/
|
|
71
|
+
export function resizeHandleBeside(panel, area) {
|
|
72
|
+
const candidates = area === 'start' ? [panel.nextElementSibling] : area === 'end' ? [panel.previousElementSibling] : [panel.nextElementSibling, panel.previousElementSibling];
|
|
73
|
+
for (const candidate of candidates) {
|
|
74
|
+
if (candidate instanceof HTMLElement && resizeHandles.has(candidate)) {
|
|
75
|
+
return candidate;
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
return null;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
/** LayoutPanel's side of the channel, one per panel. */
|
|
82
|
+
|
|
83
|
+
export function createResizablePaneLink() {
|
|
84
|
+
let isCollapsed = false;
|
|
85
|
+
let focusTarget = null;
|
|
86
|
+
let attached = null;
|
|
87
|
+
const listeners = new Set();
|
|
88
|
+
const setCollapsed = next => {
|
|
89
|
+
if (next === isCollapsed) {
|
|
90
|
+
return;
|
|
91
|
+
}
|
|
92
|
+
isCollapsed = next;
|
|
93
|
+
for (const notify of [...listeners]) {
|
|
94
|
+
notify();
|
|
95
|
+
}
|
|
96
|
+
};
|
|
97
|
+
return {
|
|
98
|
+
subscribe(notify) {
|
|
99
|
+
listeners.add(notify);
|
|
100
|
+
return () => {
|
|
101
|
+
listeners.delete(notify);
|
|
102
|
+
};
|
|
103
|
+
},
|
|
104
|
+
isCollapsed: () => isCollapsed,
|
|
105
|
+
focusTarget: () => focusTarget,
|
|
106
|
+
attach(element) {
|
|
107
|
+
if (attached?.element === element) {
|
|
108
|
+
return;
|
|
109
|
+
}
|
|
110
|
+
const wasLent = attached != null;
|
|
111
|
+
if (attached != null && lent.get(attached.element) === attached) {
|
|
112
|
+
lent.delete(attached.element);
|
|
113
|
+
}
|
|
114
|
+
attached = null;
|
|
115
|
+
if (element == null) {
|
|
116
|
+
// Taken back: no handle holds it collapsed any more.
|
|
117
|
+
focusTarget = null;
|
|
118
|
+
setCollapsed(false);
|
|
119
|
+
} else {
|
|
120
|
+
const pane = {
|
|
121
|
+
element,
|
|
122
|
+
setCollapsed(next, nextFocusTarget) {
|
|
123
|
+
if (attached === pane) {
|
|
124
|
+
focusTarget = nextFocusTarget;
|
|
125
|
+
setCollapsed(next);
|
|
126
|
+
}
|
|
127
|
+
}
|
|
128
|
+
};
|
|
129
|
+
attached = pane;
|
|
130
|
+
lent.set(element, pane);
|
|
131
|
+
}
|
|
132
|
+
if (wasLent || element != null) {
|
|
133
|
+
notifyWatchers();
|
|
134
|
+
}
|
|
135
|
+
}
|
|
136
|
+
};
|
|
137
|
+
}
|
|
@@ -179,6 +179,13 @@ type CollapseControls = {
|
|
|
179
179
|
collapse: () => void;
|
|
180
180
|
expand: () => void;
|
|
181
181
|
};
|
|
182
|
+
/**
|
|
183
|
+
* The props behind a component's `resizable` slot. It takes useResizable's
|
|
184
|
+
* output directly, and still takes that output's `props`.
|
|
185
|
+
*/
|
|
186
|
+
export declare function resizablePropsOf(value: ResizableRegion | ResizableProps): ResizableProps;
|
|
187
|
+
/** Whether a `resizable` value is useResizable's output for one region. */
|
|
188
|
+
export declare function isResizableRegion(value: unknown): value is ResizableRegion;
|
|
182
189
|
/** The reported maximum for `props`, or `undefined` for a hand-built object. */
|
|
183
190
|
export declare function getEffectiveMaxPx(props: ResizableProps): number | undefined;
|
|
184
191
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useResizable.d.ts","sourceRoot":"","sources":["../../src/Resizable/useResizable.ts"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"useResizable.d.ts","sourceRoot":"","sources":["../../src/Resizable/useResizable.ts"],"names":[],"mappings":"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"}
|
|
@@ -176,6 +176,19 @@ const collapseControls = new WeakMap();
|
|
|
176
176
|
*/
|
|
177
177
|
const effectiveMaxima = new WeakMap();
|
|
178
178
|
|
|
179
|
+
/**
|
|
180
|
+
* The props behind a component's `resizable` slot. It takes useResizable's
|
|
181
|
+
* output directly, and still takes that output's `props`.
|
|
182
|
+
*/
|
|
183
|
+
export function resizablePropsOf(value) {
|
|
184
|
+
return 'props' in value ? value.props : value;
|
|
185
|
+
}
|
|
186
|
+
|
|
187
|
+
/** Whether a `resizable` value is useResizable's output for one region. */
|
|
188
|
+
export function isResizableRegion(value) {
|
|
189
|
+
return typeof value === 'object' && value !== null && 'props' in value;
|
|
190
|
+
}
|
|
191
|
+
|
|
179
192
|
/** The reported maximum for `props`, or `undefined` for a hand-built object. */
|
|
180
193
|
export function getEffectiveMaxPx(props) {
|
|
181
194
|
return effectiveMaxima.get(props);
|
|
@@ -104,7 +104,7 @@ export interface SelectableCardProps extends Omit<BaseProps, 'onChange'> {
|
|
|
104
104
|
* </SelectableCard>
|
|
105
105
|
* ```
|
|
106
106
|
*/
|
|
107
|
-
export declare function SelectableCard({ label, isSelected, onChange, onClick: onClickProp, onMouseUp: onMouseUpProp, isDisabled, children, padding, variant, elevation, width, height, maxWidth, ref, xstyle: xstyleProp, className: classNameProp, style, ...props }: SelectableCardProps): import("react").JSX.Element;
|
|
107
|
+
export declare function SelectableCard({ label, isSelected, onChange, onClick: onClickProp, onMouseUp: onMouseUpProp, onPointerDown: onPointerDownProp, isDisabled, children, padding, variant, elevation, width, height, maxWidth, ref, xstyle: xstyleProp, className: classNameProp, style, ...props }: SelectableCardProps): import("react").JSX.Element;
|
|
108
108
|
export declare namespace SelectableCard {
|
|
109
109
|
var displayName: string;
|
|
110
110
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectableCard.d.ts","sourceRoot":"","sources":["../../src/SelectableCard/SelectableCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AAEH,OAAO,EACL,KAAK,SAAS,EAMd,KAAK,GAAG,EACT,MAAM,OAAO,CAAC;AAIf,OAAO,KAAK,EAAC,SAAS,EAAE,SAAS,EAAE,WAAW,EAAC,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"SelectableCard.d.ts","sourceRoot":"","sources":["../../src/SelectableCard/SelectableCard.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AAEH,OAAO,EACL,KAAK,SAAS,EAMd,KAAK,GAAG,EACT,MAAM,OAAO,CAAC;AAIf,OAAO,KAAK,EAAC,SAAS,EAAE,SAAS,EAAE,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAItE,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,cAAc,CAAC;AAG9C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAuN5C,MAAM,WAAW,mBAAoB,SAAQ,IAAI,CAAC,SAAS,EAAE,UAAU,CAAC;IACtE,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;IAE1B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,UAAU,EAAE,OAAO,CAAC;IAEpB;;;OAGG;IACH,QAAQ,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;IAExC;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,yCAAyC;IACzC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAErB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;OAGG;IACH,OAAO,CAAC,EAAE,WAAW,CAAC;IAEtB;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,yBAAyB;IACzB,KAAK,CAAC,EAAE,SAAS,CAAC;IAElB,0BAA0B;IAC1B,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,iCAAiC;IACjC,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AA4CD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,UAAU,EACV,QAAQ,EACR,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,aAAa,EAAE,iBAAiB,EAChC,UAAkB,EAClB,QAAQ,EACR,OAAO,EACP,OAAmB,EACnB,SAAkB,EAClB,KAAK,EACL,MAAM,EACN,QAAQ,EACR,GAAG,EACH,MAAM,EAAE,UAAU,EAClB,SAAS,EAAE,aAAa,EACxB,KAAK,EACL,GAAG,KAAK,EACT,EAAE,mBAAmB,+BAkKrB;yBAtLe,cAAc"}
|
|
@@ -34,6 +34,7 @@ import * as stylex from '@stylexjs/stylex';
|
|
|
34
34
|
import "../theme/tokens.stylex.js";
|
|
35
35
|
import { colorVars, durationVars, easeVars } from "../theme/tokens.stylex.js";
|
|
36
36
|
import { isImeKeyEvent, mergeProps } from "../utils/index.js";
|
|
37
|
+
import { chainEventHandlers } from "../utils/chainEventHandlers.js";
|
|
37
38
|
import { Card } from "../Card/Card.js";
|
|
38
39
|
import { useClickableContainer } from "../hooks/useClickableContainer.js";
|
|
39
40
|
import { closestLayerRoot } from "../privateAttributes/layerRoot.stylex.js";
|
|
@@ -257,6 +258,7 @@ export function SelectableCard({
|
|
|
257
258
|
onChange,
|
|
258
259
|
onClick: onClickProp,
|
|
259
260
|
onMouseUp: onMouseUpProp,
|
|
261
|
+
onPointerDown: onPointerDownProp,
|
|
260
262
|
isDisabled = false,
|
|
261
263
|
children,
|
|
262
264
|
padding,
|
|
@@ -311,7 +313,8 @@ export function SelectableCard({
|
|
|
311
313
|
}, [isDisabled, requestChange]);
|
|
312
314
|
const {
|
|
313
315
|
onClick,
|
|
314
|
-
onMouseUp
|
|
316
|
+
onMouseUp,
|
|
317
|
+
onPointerDown
|
|
315
318
|
} = useClickableContainer({
|
|
316
319
|
containerRef,
|
|
317
320
|
interactiveRef,
|
|
@@ -361,6 +364,7 @@ export function SelectableCard({
|
|
|
361
364
|
!isDisabled && interactionOverlayStyles.pressedAlpha, isDisabled && styles.disabled, xstyleProp],
|
|
362
365
|
onClick: !isDisabled ? composedOnClick : undefined,
|
|
363
366
|
onMouseUp: !isDisabled ? composedOnMouseUp : undefined,
|
|
367
|
+
onPointerDown: !isDisabled ? chainEventHandlers(onPointerDown, onPointerDownProp) : onPointerDownProp,
|
|
364
368
|
...props,
|
|
365
369
|
onClickCapture: !isDisabled && handleLayerClickCapture ? e => {
|
|
366
370
|
handleLayerClickCapture(e);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Selector.d.ts","sourceRoot":"","sources":["../../src/Selector/Selector.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,KAAK,EAAE,EAWZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAIf,OAAO,EAAuB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAE5D,OAAO,KAAK,EAAC,iBAAiB,EAAC,MAAM,cAAc,CAAC;AAYpD,OAAO,EAAwB,KAAK,cAAc,EAAC,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"Selector.d.ts","sourceRoot":"","sources":["../../src/Selector/Selector.tsx"],"names":[],"mappings":"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"}
|
|
@@ -33,10 +33,11 @@ import { useKeepLayerOpenProps } from "../Layer/useLayer.js";
|
|
|
33
33
|
import { InternalInputClearButton } from "../Field/InputClearButton.js";
|
|
34
34
|
import { Spinner } from "../Spinner/index.js";
|
|
35
35
|
import { PanelSearchInput } from "../Field/PanelSearchInput.js";
|
|
36
|
+
import { useKeyboardHighlight } from "../hooks/useKeyboardHighlight.js";
|
|
36
37
|
import { useAnnounce } from "../hooks/useAnnounce.js";
|
|
37
38
|
import { useAnnounceRenderedText } from "../hooks/useAnnounceRenderedText.js";
|
|
38
39
|
import "../theme/tokens.stylex.js";
|
|
39
|
-
import { colorVars, sizeVars, spacingVars, radiusVars, durationVars, easeVars, typographyVars, fontWeightVars, typeScaleVars, borderVars } from "../theme/tokens.stylex.js";
|
|
40
|
+
import { colorVars, sizeVars, spacingVars, radiusVars, durationVars, easeVars, typographyVars, fontWeightVars, typeScaleVars, borderVars, focusVars } from "../theme/tokens.stylex.js";
|
|
40
41
|
import { isOptionData, isDivider, isSection, normalizeOption } from "./utils.js";
|
|
41
42
|
import { getSelectableOptionEntries } from "./selectableOptionEntries.js";
|
|
42
43
|
import { useCombobox, useSelectedItemOffset } from "./hooks.js";
|
|
@@ -199,13 +200,20 @@ const styles = {
|
|
|
199
200
|
ksu8eU: "xng3xce",
|
|
200
201
|
kkrTdU: "x1ypdohk x16khyan",
|
|
201
202
|
k9WMMc: "x1yc453h",
|
|
202
|
-
|
|
203
|
+
k3XXqK: "x1t137rt",
|
|
203
204
|
$$css: true
|
|
204
205
|
},
|
|
205
206
|
itemHighlighted: {
|
|
206
207
|
kWkggS: "x1lmrjuc",
|
|
207
208
|
$$css: true
|
|
208
209
|
},
|
|
210
|
+
itemKeyboardHighlighted: {
|
|
211
|
+
kMeerF: "xak0ai5",
|
|
212
|
+
k3XXqK: "x9ssot5",
|
|
213
|
+
kjBf7l: "x19bwoy8",
|
|
214
|
+
kInvED: "x1c097ug",
|
|
215
|
+
$$css: true
|
|
216
|
+
},
|
|
209
217
|
itemSelected: {
|
|
210
218
|
k63SB2: "x1e4wzip",
|
|
211
219
|
$$css: true
|
|
@@ -321,6 +329,7 @@ const SelectorOptionRow = /*#__PURE__*/memo(function SelectorOptionRow({
|
|
|
321
329
|
flatIndex,
|
|
322
330
|
id,
|
|
323
331
|
isHighlighted,
|
|
332
|
+
isKeyboardHighlighted,
|
|
324
333
|
isSelected,
|
|
325
334
|
size,
|
|
326
335
|
indicatorPosition,
|
|
@@ -363,7 +372,7 @@ const SelectorOptionRow = /*#__PURE__*/memo(function SelectorOptionRow({
|
|
|
363
372
|
"aria-selected": isSelected,
|
|
364
373
|
"aria-disabled": item.disabled,
|
|
365
374
|
onClick: () => onSelect(item),
|
|
366
|
-
onMouseEnter: () => onHover(item, flatIndex),
|
|
375
|
+
onMouseEnter: () => onHover(item, flatIndex, isHighlighted),
|
|
367
376
|
...mergeProps(
|
|
368
377
|
// Stable theme target on the option row itself, mirroring
|
|
369
378
|
// `multi-selector-option`: it carries the row's size and runtime
|
|
@@ -377,7 +386,7 @@ const SelectorOptionRow = /*#__PURE__*/memo(function SelectorOptionRow({
|
|
|
377
386
|
size,
|
|
378
387
|
selected: isSelected ? 'selected' : null,
|
|
379
388
|
disabled: item.disabled ? 'disabled' : null
|
|
380
|
-
}), stylex.props(styles.item, itemSizeStyles[size], isHighlighted && styles.itemHighlighted, isSelected && styles.itemSelected, item.disabled && styles.itemDisabled)),
|
|
389
|
+
}), stylex.props(styles.item, itemSizeStyles[size], isHighlighted && styles.itemHighlighted, isKeyboardHighlighted && styles.itemKeyboardHighlighted, isSelected && styles.itemSelected, item.disabled && styles.itemDisabled)),
|
|
381
390
|
children: indicatorPosition === 'start' ? /*#__PURE__*/_jsxs(_Fragment, {
|
|
382
391
|
children: [mark, optionContent]
|
|
383
392
|
}) : /*#__PURE__*/_jsxs(_Fragment, {
|
|
@@ -781,10 +790,10 @@ export function Selector(props) {
|
|
|
781
790
|
highlightedIndex,
|
|
782
791
|
setHighlightedIndex,
|
|
783
792
|
getItemId,
|
|
784
|
-
onTriggerClick,
|
|
785
|
-
onKeyDown,
|
|
793
|
+
onTriggerClick: comboboxTriggerClick,
|
|
794
|
+
onKeyDown: comboboxKeyDown,
|
|
786
795
|
onItemSelect,
|
|
787
|
-
onItemMouseEnter
|
|
796
|
+
onItemMouseEnter: comboboxItemMouseEnter
|
|
788
797
|
} = useCombobox({
|
|
789
798
|
selectableItems: filteredItems,
|
|
790
799
|
// The optimistic value, not the raw prop: with a pending changeAction the
|
|
@@ -803,6 +812,34 @@ export function Selector(props) {
|
|
|
803
812
|
listboxId
|
|
804
813
|
});
|
|
805
814
|
|
|
815
|
+
// Only after keyboard input does the active option draw the focus ring; a
|
|
816
|
+
// pointer highlight keeps the fill alone, as a focused menu row does.
|
|
817
|
+
// Modality changes only on a key or a press, so a hover alone still reads
|
|
818
|
+
// as keyboard. The option the mouse enters therefore draws no ring until a
|
|
819
|
+
// key moves the highlight again. Entering the option that is already
|
|
820
|
+
// active, as when a key scrolls it under a still mouse, changes nothing.
|
|
821
|
+
const [hoveredIndex, setHoveredIndex] = useState(null);
|
|
822
|
+
const keyDownAfterHover = useCallback(e => {
|
|
823
|
+
setHoveredIndex(null);
|
|
824
|
+
comboboxKeyDown(e);
|
|
825
|
+
}, [comboboxKeyDown]);
|
|
826
|
+
const mouseEnterOption = useCallback((item, index, isActive) => {
|
|
827
|
+
if (!isActive) {
|
|
828
|
+
setHoveredIndex(index);
|
|
829
|
+
}
|
|
830
|
+
comboboxItemMouseEnter(item, index);
|
|
831
|
+
}, [comboboxItemMouseEnter]);
|
|
832
|
+
const {
|
|
833
|
+
isKeyboardHighlight: isHighlightFromKeyboard,
|
|
834
|
+
noteHighlightMove,
|
|
835
|
+
onKeyDown,
|
|
836
|
+
onItemMouseEnter
|
|
837
|
+
} = useKeyboardHighlight(triggerModality.readModality, keyDownAfterHover, mouseEnterOption);
|
|
838
|
+
const onTriggerClick = useCallback(() => {
|
|
839
|
+
comboboxTriggerClick();
|
|
840
|
+
noteHighlightMove();
|
|
841
|
+
}, [comboboxTriggerClick, noteHighlightMove]);
|
|
842
|
+
|
|
806
843
|
// Type-to-select, shared with the other collections (menus, listboxes).
|
|
807
844
|
// Open, it walks the highlight — aria-activedescendant announces each match.
|
|
808
845
|
// Closed, it commits the match like a native select, which changes the value
|
|
@@ -856,7 +893,8 @@ export function Selector(props) {
|
|
|
856
893
|
const index = optionIndexFromRow(row);
|
|
857
894
|
const item = filteredItems[index];
|
|
858
895
|
if (item != null) {
|
|
859
|
-
|
|
896
|
+
// A press is pointer input, even on the active option.
|
|
897
|
+
onItemMouseEnter(item, index, false);
|
|
860
898
|
}
|
|
861
899
|
},
|
|
862
900
|
onActivate: row => {
|
|
@@ -871,13 +909,15 @@ export function Selector(props) {
|
|
|
871
909
|
if (isDisabled || isEffectivelyReadOnly) {
|
|
872
910
|
return;
|
|
873
911
|
}
|
|
912
|
+
noteHighlightMove();
|
|
913
|
+
setHoveredIndex(null);
|
|
874
914
|
// With hasSearch the query input owns typing, so type-to-select is off.
|
|
875
915
|
if (!hasSearch && typeahead.onKeyDown(e)) {
|
|
876
916
|
e.preventDefault();
|
|
877
917
|
return;
|
|
878
918
|
}
|
|
879
919
|
onKeyDown(e);
|
|
880
|
-
}, [isDisabled, isEffectivelyReadOnly, hasSearch, typeahead, onKeyDown]);
|
|
920
|
+
}, [isDisabled, isEffectivelyReadOnly, hasSearch, typeahead, onKeyDown, noteHighlightMove]);
|
|
881
921
|
|
|
882
922
|
// Highlight scrolling (and its hover/keyboard split) lives in useCombobox.
|
|
883
923
|
|
|
@@ -983,6 +1023,7 @@ export function Selector(props) {
|
|
|
983
1023
|
flatIndex: flatIndex,
|
|
984
1024
|
id: getItemId(flatIndex),
|
|
985
1025
|
isHighlighted: flatIndex === highlightedIndex,
|
|
1026
|
+
isKeyboardHighlighted: flatIndex === highlightedIndex && isHighlightFromKeyboard && flatIndex !== hoveredIndex,
|
|
986
1027
|
isSelected: item.value === normalizedValue,
|
|
987
1028
|
size: size,
|
|
988
1029
|
indicatorPosition: indicatorPosition,
|
|
@@ -990,7 +1031,7 @@ export function Selector(props) {
|
|
|
990
1031
|
SelectionMark: SelectionMark,
|
|
991
1032
|
onSelect: onItemSelect,
|
|
992
1033
|
onHover: onItemMouseEnter
|
|
993
|
-
}, item.value), [renderOption, indicatorPosition, highlightedIndex, size, normalizedValue, getItemId, onItemSelect, onItemMouseEnter, SelectionMark]);
|
|
1034
|
+
}, item.value), [renderOption, indicatorPosition, highlightedIndex, isHighlightFromKeyboard, hoveredIndex, size, normalizedValue, getItemId, onItemSelect, onItemMouseEnter, SelectionMark]);
|
|
994
1035
|
|
|
995
1036
|
// Render all options (handling sections/dividers)
|
|
996
1037
|
const renderOptions = useCallback(() => {
|
|
@@ -21,7 +21,7 @@ import { type ReactNode } from 'react';
|
|
|
21
21
|
import type { BaseProps } from '../BaseProps.js';
|
|
22
22
|
import type { StyleXStyles } from '@stylexjs/stylex';
|
|
23
23
|
import { type SideNavCollapsibleConfig, type SideNavImperativeCollapseHandle } from './SideNavCollapseContext.js';
|
|
24
|
-
import type
|
|
24
|
+
import { type ResizableConfig, type ResizableRegion } from '../Resizable/useResizable.js';
|
|
25
25
|
export interface SideNavProps extends BaseProps<HTMLElement> {
|
|
26
26
|
/** Ref forwarded to the root element */
|
|
27
27
|
ref?: React.Ref<HTMLElement>;
|
|
@@ -94,12 +94,18 @@ export interface SideNavProps extends BaseProps<HTMLElement> {
|
|
|
94
94
|
* - `defaultIsCollapsed` / `isCollapsed` / `onCollapseChange` — collapse
|
|
95
95
|
* state, when `resizable` should own it rather than `collapsible`
|
|
96
96
|
*
|
|
97
|
+
* - `useResizable()`'s output — the caller's region owns the width and the
|
|
98
|
+
* collapse state. The rail follows its `isCollapsed`, the toggle calls
|
|
99
|
+
* its `collapse` and `expand`, and its `autoSaveId` saves the width.
|
|
100
|
+
* The region's own `collapsible` option also decides whether the rail
|
|
101
|
+
* collapses
|
|
102
|
+
*
|
|
97
103
|
* When both props carry collapse state, `resizable` wins and a dev warning
|
|
98
104
|
* names the conflicting keys.
|
|
99
105
|
*
|
|
100
106
|
* @default false
|
|
101
107
|
*/
|
|
102
|
-
resizable?: boolean | ResizableConfig;
|
|
108
|
+
resizable?: boolean | ResizableConfig | ResizableRegion;
|
|
103
109
|
/**
|
|
104
110
|
* Enables collapse behavior. The sidebar can be collapsed to a narrow
|
|
105
111
|
* icon-only toolbar.
|
|
@@ -134,7 +140,7 @@ export interface SideNavProps extends BaseProps<HTMLElement> {
|
|
|
134
140
|
* </SideNav>
|
|
135
141
|
* ```
|
|
136
142
|
*/
|
|
137
|
-
export declare function SideNav({ header, topContent, children, footer, footerIcons, collapsible, resizable, xstyle, className, style, 'data-testid': testId, ref, handleRef, ...props }: SideNavProps): import("react").JSX.Element;
|
|
143
|
+
export declare function SideNav({ header, topContent, children, footer, footerIcons, collapsible: collapsibleProp, resizable, xstyle, className, style, 'data-testid': testId, ref, handleRef, ...props }: SideNavProps): import("react").JSX.Element;
|
|
138
144
|
export declare namespace SideNav {
|
|
139
145
|
var displayName: string;
|
|
140
146
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SideNav.d.ts","sourceRoot":"","sources":["../../src/SideNav/SideNav.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAO,EAQL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAE5C,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AAGnD,OAAO,EAGL,KAAK,wBAAwB,EAC7B,KAAK,+BAA+B,EACrC,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"SideNav.d.ts","sourceRoot":"","sources":["../../src/SideNav/SideNav.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;GAkBG;AAEH,OAAO,EAQL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAE5C,OAAO,KAAK,EAAC,YAAY,EAAC,MAAM,kBAAkB,CAAC;AAGnD,OAAO,EAGL,KAAK,wBAAwB,EAC7B,KAAK,+BAA+B,EACrC,MAAM,0BAA0B,CAAC;AAIlC,OAAO,EAGL,KAAK,eAAe,EACpB,KAAK,eAAe,EACrB,MAAM,2BAA2B,CAAC;AAmUnC,MAAM,WAAW,YAAa,SAAQ,SAAS,CAAC,WAAW,CAAC;IAC1D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,WAAW,CAAC,CAAC;IAE7B;;;;;;;OAOG;IACH,SAAS,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,+BAA+B,CAAC,CAAC;IAEvD;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;OAEG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;;;;;;;OASG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;;;;;;;;;;;;;;;;;;;;;;;;OAyBG;IACH,SAAS,CAAC,EAAE,OAAO,GAAG,eAAe,GAAG,eAAe,CAAC;IAExD;;;;;;;;;;;;;OAaG;IACH,WAAW,CAAC,EAAE,OAAO,GAAG,wBAAwB,CAAC;CAClD;AAyBD;;;;;;;;;;;;;;;;;GAiBG;AAEH,wBAAgB,OAAO,CAAC,EACtB,MAAM,EACN,UAAU,EACV,QAAQ,EACR,MAAM,EACN,WAAW,EACX,WAAW,EAAE,eAAe,EAC5B,SAAiB,EACjB,MAAM,EACN,SAAS,EACT,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,SAAS,EACT,GAAG,KAAK,EACT,EAAE,YAAY,+BA+gBd;yBA9hBe,OAAO"}
|
package/dist/SideNav/SideNav.js
CHANGED
|
@@ -30,7 +30,7 @@ import { SideNavCollapseContext } from "./SideNavCollapseContext.js";
|
|
|
30
30
|
import { SideNavCollapseButton } from "./SideNavCollapseButton.js";
|
|
31
31
|
import { useSideNavRenderMode } from "./SideNavRenderContext.js";
|
|
32
32
|
import { MobileNav } from "../MobileNav/MobileNav.js";
|
|
33
|
-
import { useResizable } from "../Resizable/useResizable.js";
|
|
33
|
+
import { isResizableRegion, useResizable } from "../Resizable/useResizable.js";
|
|
34
34
|
import { ResizeHandle } from "../Resizable/ResizeHandle.js";
|
|
35
35
|
import { themeProps } from "../utils/themeProps.js";
|
|
36
36
|
import { SizeProvider } from "../SizeContext/SizeContext.js";
|
|
@@ -93,6 +93,33 @@ function describeCollapseConflict(collapsible, resizable) {
|
|
|
93
93
|
return `${collapsibleKeys.map(key => `collapsible.${key}`).join(', ')} and ` + `${resizableKeys.map(key => `resizable.${key}`).join(', ')} address the ` + `same collapse state. resizable wins; the collapsible ` + `${collapsibleKeys.length === 1 ? 'value is' : 'values are'} ignored.`;
|
|
94
94
|
}
|
|
95
95
|
|
|
96
|
+
/**
|
|
97
|
+
* The collapse config when `resizable` is useResizable's output. The region
|
|
98
|
+
* owns the collapse state and decides whether the rail collapses. A
|
|
99
|
+
* `collapsible` prop that sets state or disagrees is ignored and named in a
|
|
100
|
+
* development warning.
|
|
101
|
+
*/
|
|
102
|
+
function resolveRegionCollapseConfig(collapsible, region) {
|
|
103
|
+
const fromCollapsible = typeof collapsible === 'object' ? collapsible : {};
|
|
104
|
+
const ignoredKeys = [fromCollapsible.defaultIsCollapsed !== undefined && 'defaultIsCollapsed', fromCollapsible.isCollapsed !== undefined && 'isCollapsed', fromCollapsible.onCollapsedChange !== undefined && 'onCollapsedChange'].filter(key => key !== false);
|
|
105
|
+
// The region's own `collapsible` option decides whether the rail collapses.
|
|
106
|
+
const isRegionCollapsible = region.props._collapsible ?? false;
|
|
107
|
+
const conflicts = [];
|
|
108
|
+
if (ignoredKeys.length > 0) {
|
|
109
|
+
conflicts.push(`\`collapsible\` sets ${ignoredKeys.map(key => `\`${key}\``).join(', ')}, ` + 'which the rail ignores: it follows the region.');
|
|
110
|
+
}
|
|
111
|
+
if (collapsible !== undefined && Boolean(collapsible) !== isRegionCollapsible) {
|
|
112
|
+
conflicts.push(isRegionCollapsible ? '`collapsible` is false, but the region is collapsible, so the rail still collapses.' : '`collapsible` turns collapse on, but the region is not collapsible, so the rail never collapses.');
|
|
113
|
+
}
|
|
114
|
+
return {
|
|
115
|
+
isCollapsible: isRegionCollapsible,
|
|
116
|
+
defaultIsCollapsed: region.isCollapsed,
|
|
117
|
+
isCollapsed: undefined,
|
|
118
|
+
onCollapsedChange: undefined,
|
|
119
|
+
conflict: conflicts.length === 0 ? null : "`resizable` is useResizable's output, which owns the collapse " + `state and decides whether the rail collapses. ${conflicts.join(' ')}`
|
|
120
|
+
};
|
|
121
|
+
}
|
|
122
|
+
|
|
96
123
|
// =============================================================================
|
|
97
124
|
// Styles
|
|
98
125
|
// =============================================================================
|
|
@@ -178,7 +205,7 @@ export function SideNav({
|
|
|
178
205
|
children,
|
|
179
206
|
footer,
|
|
180
207
|
footerIcons,
|
|
181
|
-
collapsible
|
|
208
|
+
collapsible: collapsibleProp,
|
|
182
209
|
resizable = false,
|
|
183
210
|
xstyle,
|
|
184
211
|
className,
|
|
@@ -189,14 +216,19 @@ export function SideNav({
|
|
|
189
216
|
...props
|
|
190
217
|
}) {
|
|
191
218
|
const t = useComponentTranslator();
|
|
219
|
+
// Only a left-out `collapsible` becomes false, as before; `??` would also
|
|
220
|
+
// turn null into false.
|
|
221
|
+
const collapsible = collapsibleProp === undefined ? false : collapsibleProp;
|
|
192
222
|
// Parse collapsible prop
|
|
193
223
|
const collapsibleConfig = typeof collapsible === 'object' ? collapsible : {};
|
|
194
224
|
const hasCollapseButton = collapsibleConfig.hasButton ?? true;
|
|
195
225
|
|
|
226
|
+
// useResizable's output: the caller's region owns the width and collapse.
|
|
227
|
+
const ownerRegion = isResizableRegion(resizable) ? resizable : null;
|
|
196
228
|
// Resizable config
|
|
197
|
-
const resizableConfig = typeof resizable === 'object' ? resizable : {};
|
|
229
|
+
const resizableConfig = typeof resizable === 'object' && !isResizableRegion(resizable) ? resizable : {};
|
|
198
230
|
const isResizable = !!resizable;
|
|
199
|
-
const collapseConfig = resolveCollapseConfig(collapsible, resizable);
|
|
231
|
+
const collapseConfig = ownerRegion == null ? resolveCollapseConfig(collapsible, isResizableRegion(resizable) ? false : resizable) : resolveRegionCollapseConfig(collapsibleProp, ownerRegion);
|
|
200
232
|
const {
|
|
201
233
|
isCollapsible,
|
|
202
234
|
onCollapsedChange
|
|
@@ -236,6 +268,8 @@ export function SideNav({
|
|
|
236
268
|
|
|
237
269
|
// useResizable is the sole collapse owner in every SideNav mode. Keeping that
|
|
238
270
|
// owner mounted when resize is toggled preserves the current collapse state.
|
|
271
|
+
// Given the hook's output, the caller's region is the owner, and this one
|
|
272
|
+
// stays idle.
|
|
239
273
|
const resizableHook = useResizable({
|
|
240
274
|
defaultSize: resizableConfig.defaultWidth ?? 260,
|
|
241
275
|
minSize: resizableConfig.minWidth ?? 180,
|
|
@@ -248,7 +282,8 @@ export function SideNav({
|
|
|
248
282
|
onSizeChange: resizableConfig.onWidthChange,
|
|
249
283
|
onCollapseChange: onCollapsedChange
|
|
250
284
|
});
|
|
251
|
-
const
|
|
285
|
+
const region = ownerRegion ?? resizableHook;
|
|
286
|
+
const collapsed = region.isCollapsed;
|
|
252
287
|
|
|
253
288
|
// A collapse or expand plays the rail's motion, except an app's change
|
|
254
289
|
// before the rail's first paint. It is measured in the commit before the
|
|
@@ -404,11 +439,11 @@ export function SideNav({
|
|
|
404
439
|
isCollapsed: next
|
|
405
440
|
};
|
|
406
441
|
if (next) {
|
|
407
|
-
|
|
442
|
+
region.collapse();
|
|
408
443
|
} else {
|
|
409
|
-
|
|
444
|
+
region.expand();
|
|
410
445
|
}
|
|
411
|
-
}, [collapsed,
|
|
446
|
+
}, [collapsed, region]);
|
|
412
447
|
const showResizeHandle = isResizable && !collapsed;
|
|
413
448
|
collapseStateRef.current = {
|
|
414
449
|
isCollapsed: collapsed,
|
|
@@ -515,7 +550,7 @@ export function SideNav({
|
|
|
515
550
|
// When resizable, override the nav width via inline style
|
|
516
551
|
const resizableNavStyle = isResizable ? {
|
|
517
552
|
...(style ?? {}),
|
|
518
|
-
width: collapsed ? undefined :
|
|
553
|
+
width: collapsed ? undefined : region.size
|
|
519
554
|
} : style;
|
|
520
555
|
const navElement = /*#__PURE__*/_jsxs("nav", {
|
|
521
556
|
ref: mergedNavRef,
|
|
@@ -613,7 +648,7 @@ export function SideNav({
|
|
|
613
648
|
pillPlacement: "end",
|
|
614
649
|
isAlwaysVisible: false,
|
|
615
650
|
xstyle: styles.resizableHandle,
|
|
616
|
-
resizable: resizableHook.props,
|
|
651
|
+
resizable: ownerRegion ?? resizableHook.props,
|
|
617
652
|
label: t('@astryx.sideNav.resizeSidebar'),
|
|
618
653
|
"aria-controls": navId
|
|
619
654
|
})]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../src/Spinner/Spinner.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAQ,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAG5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"Spinner.d.ts","sourceRoot":"","sources":["../../src/Spinner/Spinner.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;GAYG;AAEH,OAAO,EAAQ,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAG5C,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA8B5C,QAAA,MAAM,KAAK;;;;;;;;;;;;;;;;;CAKV,CAAC;AA2SF,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,KAAK,CAAC;AAE7C,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,CAAC;AAExE,MAAM,WAAW,YAAa,SAAQ,SAAS,CAAC,eAAe,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,eAAe,CAAC,CAAC;IACjC;;;;;;;;;OASG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;;;;;;OASG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB;;;;;;;;;;;;;OAaG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAMD;;;;;;;;;;;GAWG;AACH,wBAAgB,OAAO,CAAC,EACtB,IAAW,EACX,KAAiB,EACjB,KAAK,EACL,MAAM,EACN,SAAS,EACT,KAAK,EACL,YAAY,EAAE,SAAS,EACvB,aAAa,EAAE,MAAM,EACrB,GAAG,EACH,GAAG,SAAS,EACb,EAAE,YAAY,+BAqId;yBAhJe,OAAO"}
|