@astryxdesign/core 0.7.7 → 0.7.8-canary.30b1896
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 +4 -1
- package/dist/AlertDialog/AlertDialog.d.ts.map +1 -1
- package/dist/AlertDialog/AlertDialog.js +46 -6
- package/dist/AppShell/AppShell.d.ts.map +1 -1
- package/dist/AppShell/AppShell.js +5 -0
- package/dist/BottomSheet/BottomSheet.d.ts.map +1 -1
- package/dist/BottomSheet/BottomSheet.js +1 -0
- package/dist/BottomSheet/BottomSheetPanel.d.ts.map +1 -1
- package/dist/BottomSheet/BottomSheetPanel.js +25 -4
- package/dist/BottomSheet/BottomSheetSwitcher.d.ts.map +1 -1
- package/dist/BottomSheet/BottomSheetSwitcher.js +5 -0
- package/dist/BottomSheet/useMobileKeyboard.d.ts.map +1 -1
- package/dist/BottomSheet/useMobileKeyboard.js +6 -0
- package/dist/BottomSheet/useSheetGestures.d.ts.map +1 -1
- package/dist/BottomSheet/useSheetGestures.js +12 -1
- package/dist/Button/Button.d.ts.map +1 -1
- package/dist/Button/Button.js +17 -1
- package/dist/Calendar/Calendar.d.ts.map +1 -1
- package/dist/Calendar/Calendar.js +15 -16
- package/dist/Carousel/Carousel.d.ts.map +1 -1
- package/dist/Carousel/Carousel.js +2 -0
- package/dist/Chat/ChatComposerInput.d.ts.map +1 -1
- package/dist/Chat/ChatComposerInput.js +4 -0
- package/dist/Chat/ChatMessageList.d.ts.map +1 -1
- package/dist/Chat/ChatMessageList.js +2 -1
- package/dist/Chat/useChatDictation.d.ts.map +1 -1
- package/dist/Chat/useChatDictation.js +2 -0
- package/dist/Chat/useChatNewMessages.js +1 -1
- package/dist/Chat/useChatStreamScroll.d.ts.map +1 -1
- package/dist/Chat/useChatStreamScroll.js +2 -0
- package/dist/Chat/useSpeechRecognition.d.ts.map +1 -1
- package/dist/Chat/useSpeechRecognition.js +3 -0
- package/dist/Chat/useTriggerMenu.js +1 -1
- package/dist/CheckboxInput/CheckboxInput.d.ts.map +1 -1
- package/dist/CheckboxInput/CheckboxInput.js +17 -12
- package/dist/CodeBlock/CodeBlock.d.ts +10 -1
- package/dist/CodeBlock/CodeBlock.d.ts.map +1 -1
- package/dist/CodeBlock/CodeBlock.js +28 -11
- package/dist/CommandPalette/CommandPalette.d.ts.map +1 -1
- package/dist/CommandPalette/CommandPalette.js +2 -0
- package/dist/CommandPalette/CommandPaletteItem.d.ts.map +1 -1
- package/dist/CommandPalette/CommandPaletteItem.js +2 -0
- package/dist/ComplexSelector/ComplexSelector.d.ts +4 -1
- package/dist/ComplexSelector/ComplexSelector.d.ts.map +1 -1
- package/dist/ComplexSelector/ComplexSelector.js +14 -4
- package/dist/ContextMenu/ContextMenu.js +2 -2
- package/dist/DateInput/MonthScroller.d.ts.map +1 -1
- package/dist/DateInput/MonthScroller.js +5 -2
- package/dist/DateInput/TouchDateField.d.ts.map +1 -1
- package/dist/DateInput/TouchDateField.js +1 -0
- package/dist/DateInput/Wheel.d.ts.map +1 -1
- package/dist/DateInput/Wheel.js +4 -0
- package/dist/DateInput/useOwnScrollGesture.d.ts.map +1 -1
- package/dist/DateInput/useOwnScrollGesture.js +3 -0
- package/dist/DateInput/usePointerDragScroll.d.ts.map +1 -1
- package/dist/DateInput/usePointerDragScroll.js +2 -0
- package/dist/DateInput/useScrollSettle.d.ts.map +1 -1
- package/dist/DateInput/useScrollSettle.js +3 -0
- package/dist/Dialog/Dialog.d.ts.map +1 -1
- package/dist/Dialog/Dialog.js +9 -32
- package/dist/Drawer/useDrawerDialogPresence.d.ts.map +1 -1
- package/dist/Drawer/useDrawerDialogPresence.js +3 -0
- package/dist/DropdownMenu/useMenuOverflow.d.ts.map +1 -1
- package/dist/DropdownMenu/useMenuOverflow.js +5 -0
- package/dist/Field/Field.js +2 -2
- package/dist/FieldStatus/useFieldStatusAnnouncement.d.ts.map +1 -1
- package/dist/FieldStatus/useFieldStatusAnnouncement.js +1 -0
- package/dist/FormLayout/FormLayout.d.ts +5 -1
- package/dist/FormLayout/FormLayout.d.ts.map +1 -1
- package/dist/HoverCard/HoverCard.d.ts +6 -4
- package/dist/HoverCard/HoverCard.d.ts.map +1 -1
- package/dist/HoverCard/HoverCard.js +48 -3
- package/dist/HoverCard/useHoverCard.d.ts +5 -4
- package/dist/HoverCard/useHoverCard.d.ts.map +1 -1
- package/dist/HoverCard/useHoverCard.js +20 -33
- package/dist/Icon/Icon.d.ts +5 -1
- package/dist/Icon/Icon.d.ts.map +1 -1
- package/dist/Icon/Icon.js +5 -2
- package/dist/Item/useSwipeAction.d.ts.map +1 -1
- package/dist/Item/useSwipeAction.js +3 -0
- package/dist/Layer/modalOutlet.d.ts.map +1 -1
- package/dist/Layer/modalOutlet.js +2 -0
- package/dist/Layer/outsidePress.d.ts.map +1 -1
- package/dist/Layer/outsidePress.js +1 -0
- package/dist/Layer/useLayer.d.ts.map +1 -1
- package/dist/Layer/useLayer.js +3 -0
- package/dist/Layer/useLayerDismissal.d.ts.map +1 -1
- package/dist/Layer/useLayerDismissal.js +3 -0
- package/dist/Layer/usePressPin.d.ts +17 -5
- package/dist/Layer/usePressPin.d.ts.map +1 -1
- package/dist/Layer/usePressPin.js +62 -12
- package/dist/Layer/useTouchTrigger.d.ts.map +1 -1
- package/dist/Layer/useTouchTrigger.js +3 -0
- package/dist/Lightbox/Lightbox.d.ts.map +1 -1
- package/dist/Lightbox/Lightbox.js +19 -0
- package/dist/MobileNav/MobileNav.d.ts +3 -2
- package/dist/MobileNav/MobileNav.d.ts.map +1 -1
- package/dist/MobileNav/MobileNav.js +9 -25
- package/dist/Outline/useOutlineFromDOM.d.ts.map +1 -1
- package/dist/Outline/useOutlineFromDOM.js +3 -0
- package/dist/Outline/useScrollSpy.d.ts.map +1 -1
- package/dist/Outline/useScrollSpy.js +3 -0
- package/dist/OverflowList/OverflowList.d.ts.map +1 -1
- package/dist/OverflowList/OverflowList.js +3 -0
- package/dist/Popover/Popover.d.ts.map +1 -1
- package/dist/Popover/Popover.js +6 -0
- package/dist/PowerSearch/PowerSearch.d.ts +43 -4
- package/dist/PowerSearch/PowerSearch.d.ts.map +1 -1
- package/dist/PowerSearch/PowerSearch.js +445 -134
- package/dist/PowerSearch/PowerSearchBottomSheet.d.ts +102 -0
- package/dist/PowerSearch/PowerSearchBottomSheet.d.ts.map +1 -0
- package/dist/PowerSearch/PowerSearchBottomSheet.js +1919 -0
- package/dist/PowerSearch/PowerSearchEditPopover.d.ts +35 -2
- package/dist/PowerSearch/PowerSearchEditPopover.d.ts.map +1 -1
- package/dist/PowerSearch/PowerSearchEditPopover.js +25 -6
- package/dist/PowerSearch/PowerSearchFilterEditor.d.ts +1 -1
- package/dist/PowerSearch/PowerSearchFilterEditor.d.ts.map +1 -1
- package/dist/PowerSearch/PowerSearchFilterEditor.js +4 -2
- package/dist/PowerSearch/PowerSearchToken.d.ts +1 -1
- package/dist/PowerSearch/PowerSearchToken.d.ts.map +1 -1
- package/dist/PowerSearch/PowerSearchToken.js +7 -2
- package/dist/PowerSearch/PowerSearchValueEditor.d.ts +38 -3
- package/dist/PowerSearch/PowerSearchValueEditor.d.ts.map +1 -1
- package/dist/PowerSearch/PowerSearchValueEditor.js +193 -83
- package/dist/PowerSearch/formatFilterValue.d.ts +18 -6
- package/dist/PowerSearch/formatFilterValue.d.ts.map +1 -1
- package/dist/PowerSearch/formatFilterValue.js +33 -12
- package/dist/PowerSearch/formatTokenValue.d.ts +28 -0
- package/dist/PowerSearch/formatTokenValue.d.ts.map +1 -0
- package/dist/PowerSearch/formatTokenValue.js +162 -0
- package/dist/PowerSearch/powerSearchDateZone.d.ts +21 -0
- package/dist/PowerSearch/powerSearchDateZone.d.ts.map +1 -0
- package/dist/PowerSearch/powerSearchDateZone.js +37 -0
- package/dist/PowerSearch/powerSearchSheetUtils.d.ts +65 -0
- package/dist/PowerSearch/powerSearchSheetUtils.d.ts.map +1 -0
- package/dist/PowerSearch/powerSearchSheetUtils.js +168 -0
- package/dist/PowerSearch/types.d.ts +2 -0
- package/dist/PowerSearch/types.d.ts.map +1 -1
- package/dist/ProgressBar/ProgressBarTouch.d.ts.map +1 -1
- package/dist/ProgressBar/ProgressBarTouch.js +2 -0
- package/dist/RadioList/RadioList.d.ts.map +1 -1
- package/dist/RadioList/RadioList.js +3 -2
- package/dist/RadioList/RadioListItem.d.ts +1 -1
- package/dist/RadioList/RadioListItem.d.ts.map +1 -1
- package/dist/RadioList/RadioListItem.js +5 -3
- package/dist/Resizable/ResizeHandle.d.ts +2 -1
- package/dist/Resizable/ResizeHandle.d.ts.map +1 -1
- package/dist/Resizable/ResizeHandle.js +101 -77
- package/dist/Resizable/createResizable.d.ts +145 -0
- package/dist/Resizable/createResizable.d.ts.map +1 -0
- package/dist/Resizable/createResizable.js +575 -0
- package/dist/Resizable/useResizable.d.ts +3 -3
- package/dist/Resizable/useResizable.d.ts.map +1 -1
- package/dist/Resizable/useResizable.js +252 -459
- package/dist/SegmentedControl/useSegmentedSelectionMotion.d.ts.map +1 -1
- package/dist/SegmentedControl/useSegmentedSelectionMotion.js +3 -3
- package/dist/SelectableCard/SelectableCard.d.ts +2 -0
- package/dist/SelectableCard/SelectableCard.d.ts.map +1 -1
- package/dist/SelectableCard/SelectableCard.js +36 -11
- package/dist/SelectableCard/selectableCardInput.d.ts +12 -0
- package/dist/SelectableCard/selectableCardInput.d.ts.map +1 -0
- package/dist/SelectableCard/selectableCardInput.js +20 -0
- package/dist/Selector/Selector.d.ts.map +1 -1
- package/dist/Selector/Selector.js +5 -8
- 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 +60 -58
- package/dist/Switch/Switch.d.ts.map +1 -1
- package/dist/Switch/Switch.js +4 -10
- package/dist/Switch/useSwitchTouch.js +4 -4
- package/dist/Table/BaseTable.d.ts.map +1 -1
- package/dist/Table/BaseTable.js +29 -8
- package/dist/Table/plugins/columnResize/useTableColumnResize.d.ts.map +1 -1
- package/dist/Table/plugins/columnResize/useTableColumnResize.js +3 -1
- package/dist/Table/plugins/filtering/useTableFiltering.d.ts.map +1 -1
- package/dist/Table/plugins/filtering/useTableFiltering.js +2 -1
- package/dist/Table/plugins/rowExpansion/useTableRowExpansion.d.ts.map +1 -1
- package/dist/Table/plugins/rowExpansion/useTableRowExpansion.js +4 -0
- package/dist/Table/plugins/stickyColumns/useTableStickyColumns.d.ts.map +1 -1
- package/dist/Table/plugins/stickyColumns/useTableStickyColumns.js +2 -0
- package/dist/TextInput/TextInput.d.ts +2 -2
- package/dist/TextInput/TextInput.d.ts.map +1 -1
- package/dist/TextInput/TextInput.js +10 -7
- package/dist/TimeInput/TimeInput.d.ts.map +1 -1
- package/dist/TimeInput/TimeInput.js +2 -0
- package/dist/Timer/Timer.d.ts.map +1 -1
- package/dist/Timer/Timer.js +2 -0
- package/dist/Timestamp/Timestamp.js +1 -1
- package/dist/Toast/Toast.d.ts +11 -1
- package/dist/Toast/Toast.d.ts.map +1 -1
- package/dist/Toast/Toast.js +25 -15
- package/dist/Toast/ToastViewport.d.ts.map +1 -1
- package/dist/Toast/ToastViewport.js +97 -34
- package/dist/Toast/types.d.ts +9 -3
- package/dist/Toast/types.d.ts.map +1 -1
- package/dist/Toast/useToast.d.ts.map +1 -1
- package/dist/Toast/useToast.js +1 -0
- package/dist/Tokenizer/Tokenizer.d.ts +49 -37
- package/dist/Tokenizer/Tokenizer.d.ts.map +1 -1
- package/dist/Tokenizer/Tokenizer.js +22 -19
- package/dist/Tokenizer/TokenizerBottomSheet.d.ts +1 -1
- package/dist/Tokenizer/TokenizerBottomSheet.js +1 -1
- package/dist/Tokenizer/index.d.ts +1 -1
- package/dist/Tokenizer/index.d.ts.map +1 -1
- package/dist/Tooltip/useTooltip.d.ts +19 -1
- package/dist/Tooltip/useTooltip.d.ts.map +1 -1
- package/dist/Tooltip/useTooltip.js +34 -53
- package/dist/Typeahead/BaseTypeahead.d.ts.map +1 -1
- package/dist/Typeahead/BaseTypeahead.js +27 -18
- package/dist/Typeahead/TypeaheadItem.d.ts +2 -1
- package/dist/Typeahead/TypeaheadItem.d.ts.map +1 -1
- package/dist/animator/createAnimator.d.ts +98 -0
- package/dist/animator/createAnimator.d.ts.map +1 -0
- package/dist/animator/createAnimator.js +259 -0
- package/dist/astryx.css +36 -6
- package/dist/gestures/PressTracker.d.ts.map +1 -1
- package/dist/gestures/PressTracker.js +4 -3
- package/dist/hooks/ModalAnnounceProvider.d.ts.map +1 -1
- package/dist/hooks/ModalAnnounceProvider.js +1 -0
- package/dist/hooks/actionGroupTracker.d.ts +4 -1
- package/dist/hooks/actionGroupTracker.d.ts.map +1 -1
- package/dist/hooks/actionGroupTracker.js +13 -3
- package/dist/hooks/index.d.ts +1 -0
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/hooks/index.js +1 -0
- package/dist/hooks/longPressDetector.d.ts +66 -0
- package/dist/hooks/longPressDetector.d.ts.map +1 -0
- package/dist/hooks/longPressDetector.js +200 -0
- package/dist/hooks/pressGroupContext.d.ts +6 -0
- package/dist/hooks/pressGroupContext.d.ts.map +1 -0
- package/dist/hooks/pressGroupContext.js +20 -0
- package/dist/hooks/rootScrollStyles.d.ts +48 -0
- package/dist/hooks/rootScrollStyles.d.ts.map +1 -0
- package/dist/hooks/rootScrollStyles.js +207 -0
- package/dist/hooks/scrollLockTouchGuard.d.ts +13 -0
- package/dist/hooks/scrollLockTouchGuard.d.ts.map +1 -0
- package/dist/hooks/scrollLockTouchGuard.js +134 -0
- package/dist/hooks/scrollbarGutter.d.ts +4 -4
- package/dist/hooks/scrollbarGutter.d.ts.map +1 -1
- package/dist/hooks/scrollbarGutter.js +36 -23
- package/dist/hooks/useActionGroupTracking.d.ts +53 -0
- package/dist/hooks/useActionGroupTracking.d.ts.map +1 -0
- package/dist/hooks/useActionGroupTracking.js +174 -0
- package/dist/hooks/useAnimator.d.ts +41 -0
- package/dist/hooks/useAnimator.d.ts.map +1 -0
- package/dist/hooks/useAnimator.js +70 -0
- package/dist/hooks/useAnnounceRenderedText.d.ts.map +1 -1
- package/dist/hooks/useAnnounceRenderedText.js +1 -0
- package/dist/hooks/useAttachment.d.ts +1 -1
- package/dist/hooks/useAttachment.js +1 -1
- package/dist/hooks/useAutoMediaMode.d.ts.map +1 -1
- package/dist/hooks/useAutoMediaMode.js +1 -0
- package/dist/hooks/useBusyAnnouncement.d.ts.map +1 -1
- package/dist/hooks/useBusyAnnouncement.js +2 -0
- package/dist/hooks/useDevWarning.d.ts.map +1 -1
- package/dist/hooks/useDevWarning.js +2 -0
- package/dist/hooks/useFocusTrap.d.ts.map +1 -1
- package/dist/hooks/useFocusTrap.js +2 -0
- package/dist/hooks/useGridFocus.d.ts +8 -5
- package/dist/hooks/useGridFocus.d.ts.map +1 -1
- package/dist/hooks/useGridFocus.js +4 -3
- package/dist/hooks/useHotkeys.d.ts.map +1 -1
- package/dist/hooks/useHotkeys.js +3 -0
- package/dist/hooks/useImageMode.d.ts.map +1 -1
- package/dist/hooks/useImageMode.js +3 -0
- package/dist/hooks/useInputStatusIcon.d.ts +1 -1
- package/dist/hooks/useInputStatusIcon.d.ts.map +1 -1
- package/dist/hooks/useInputStatusIcon.js +2 -2
- package/dist/hooks/useKeyboardHint.js +1 -1
- package/dist/hooks/useLongPress.d.ts +8 -9
- package/dist/hooks/useLongPress.d.ts.map +1 -1
- package/dist/hooks/useLongPress.js +23 -106
- package/dist/hooks/useMenuHover.d.ts.map +1 -1
- package/dist/hooks/useMenuHover.js +2 -0
- package/dist/hooks/useMenuPress.d.ts.map +1 -1
- package/dist/hooks/useMenuPress.js +3 -0
- package/dist/hooks/useOverflow.d.ts.map +1 -1
- package/dist/hooks/useOverflow.js +2 -1
- package/dist/hooks/usePressFeedback.d.ts.map +1 -1
- package/dist/hooks/usePressFeedback.js +1 -0
- package/dist/hooks/useResolvedRequired.d.ts +3 -0
- package/dist/hooks/useResolvedRequired.d.ts.map +1 -1
- package/dist/hooks/useResolvedRequired.js +3 -0
- package/dist/hooks/useScrollLock.d.ts +7 -9
- package/dist/hooks/useScrollLock.d.ts.map +1 -1
- package/dist/hooks/useScrollLock.js +55 -48
- package/dist/hooks/useScrollableArea.d.ts.map +1 -1
- package/dist/hooks/useScrollableArea.js +5 -0
- package/dist/hooks/useStreamingText.d.ts.map +1 -1
- package/dist/hooks/useStreamingText.js +3 -0
- package/dist/i18n/generated-english/PowerSearch/PowerSearchBottomSheet.generated.d.ts +8 -0
- package/dist/i18n/generated-english/PowerSearch/PowerSearchBottomSheet.generated.d.ts.map +1 -0
- package/dist/i18n/generated-english/PowerSearch/PowerSearchBottomSheet.generated.js +42 -0
- package/dist/i18n/generated-english/PowerSearch/PowerSearchValueEditor.generated.d.ts.map +1 -1
- package/dist/i18n/generated-english/PowerSearch/PowerSearchValueEditor.generated.js +6 -0
- package/dist/i18n/generated-english/PowerSearch/formatTokenValue.generated.d.ts +8 -0
- package/dist/i18n/generated-english/PowerSearch/formatTokenValue.generated.d.ts.map +1 -0
- package/dist/i18n/generated-english/PowerSearch/formatTokenValue.generated.js +14 -0
- package/dist/i18n/generated-locales/en.generated.d.ts.map +1 -1
- package/dist/i18n/generated-locales/en.generated.js +30 -0
- package/dist/i18n/generated-locales/pseudo.generated.d.ts.map +1 -1
- package/dist/i18n/generated-locales/pseudo.generated.js +30 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +4 -0
- package/dist/internal/indicatorPress.stylex.d.ts +20 -0
- package/dist/internal/indicatorPress.stylex.d.ts.map +1 -0
- package/dist/internal/indicatorPress.stylex.js +26 -0
- package/dist/internal/selectable-card.d.ts +21 -0
- package/dist/internal/selectable-card.d.ts.map +1 -0
- package/dist/internal/selectable-card.js +20 -0
- package/dist/internal/sheetDraft.d.ts +2 -2
- package/dist/internal/sheetDraft.js +2 -2
- package/dist/motion/animatedLayout.d.ts.map +1 -1
- package/dist/motion/animatedLayout.js +7 -7
- package/dist/motion/animator.d.ts +14 -14
- package/dist/motion/animator.d.ts.map +1 -1
- package/dist/motion/animator.js +45 -20
- package/dist/motion/progress.d.ts +88 -0
- package/dist/motion/progress.d.ts.map +1 -0
- package/dist/motion/progress.js +128 -0
- package/dist/motion/reducedMotion.d.ts.map +1 -1
- package/dist/motion/reducedMotion.js +3 -1
- package/dist/motion/uikit/alert.d.ts +41 -0
- package/dist/motion/uikit/alert.d.ts.map +1 -0
- package/dist/motion/uikit/alert.js +43 -0
- package/dist/privateAttributes/pressGroupItem.stylex.d.ts +22 -0
- package/dist/privateAttributes/pressGroupItem.stylex.d.ts.map +1 -0
- package/dist/privateAttributes/pressGroupItem.stylex.js +36 -0
- package/dist/privateAttributes/reducedMotion.stylex.d.ts +23 -0
- package/dist/privateAttributes/reducedMotion.stylex.d.ts.map +1 -0
- package/dist/privateAttributes/reducedMotion.stylex.js +40 -0
- package/dist/theme/Theme.d.ts.map +1 -1
- package/dist/theme/Theme.js +29 -4
- package/dist/theme/motionKnobs.d.ts +4 -3
- package/dist/theme/motionKnobs.d.ts.map +1 -1
- package/dist/theme/motionKnobs.js +3 -2
- package/dist/theme/themeMotion.d.ts +6 -0
- package/dist/theme/themeMotion.d.ts.map +1 -1
- package/dist/theme/themeMotion.js +7 -0
- package/dist/utils/dateParser.d.ts.map +1 -1
- package/dist/utils/dateParser.js +12 -0
- package/dist/utils/focusReturn.d.ts +15 -0
- package/dist/utils/focusReturn.d.ts.map +1 -1
- package/dist/utils/focusReturn.js +28 -0
- package/dist/utils/interactionModality.d.ts.map +1 -1
- package/dist/utils/interactionModality.js +4 -0
- package/dist/utils/interactionOverlay.stylex.d.ts +3 -2
- package/dist/utils/interactionOverlay.stylex.d.ts.map +1 -1
- package/dist/utils/interactionOverlay.stylex.js +3 -2
- package/dist/utils/plainDate.d.ts +8 -0
- package/dist/utils/plainDate.d.ts.map +1 -1
- package/dist/utils/plainDate.js +19 -0
- package/dist/utils/pressFeedback.d.ts.map +1 -1
- package/dist/utils/pressFeedback.js +20 -6
- package/dist/utils/triggerFocus.d.ts +36 -0
- package/dist/utils/triggerFocus.d.ts.map +1 -0
- package/dist/utils/triggerFocus.js +65 -0
- package/locales/en.json +120 -0
- package/locales/pseudo.json +90 -0
- package/package.json +14 -9
- package/src/AlertDialog/AlertDialog.doc.mjs +2 -2
- package/src/AlertDialog/AlertDialog.tsx +46 -5
- package/src/AppShell/AppShell.tsx +4 -0
- package/src/BottomSheet/BottomSheet.tsx +1 -0
- package/src/BottomSheet/BottomSheetPanel.tsx +39 -3
- package/src/BottomSheet/BottomSheetSwitcher.tsx +5 -0
- package/src/BottomSheet/useMobileKeyboard.ts +4 -0
- package/src/BottomSheet/useSheetGestures.ts +10 -1
- package/src/Button/Button.tsx +26 -4
- package/src/Calendar/Calendar.tsx +36 -25
- package/src/Carousel/Carousel.tsx +1 -0
- package/src/Chat/ChatComposerInput.tsx +2 -0
- package/src/Chat/ChatMessageList.tsx +2 -1
- package/src/Chat/useChatDictation.ts +1 -0
- package/src/Chat/useChatNewMessages.ts +1 -1
- package/src/Chat/useChatStreamScroll.ts +2 -0
- package/src/Chat/useSpeechRecognition.ts +2 -0
- package/src/Chat/useTriggerMenu.tsx +1 -1
- package/src/CheckboxInput/CheckboxInput.doc.mjs +18 -0
- package/src/CheckboxInput/CheckboxInput.tsx +38 -15
- package/src/CodeBlock/CodeBlock.doc.mjs +9 -1
- package/src/CodeBlock/CodeBlock.tsx +41 -4
- package/src/CommandPalette/CommandPalette.tsx +1 -0
- package/src/CommandPalette/CommandPaletteItem.tsx +1 -0
- package/src/ComplexSelector/ComplexSelector.tsx +20 -5
- package/src/ContextMenu/ContextMenu.tsx +2 -2
- package/src/DateInput/MonthScroller.tsx +8 -2
- package/src/DateInput/TouchDateField.tsx +1 -0
- package/src/DateInput/Wheel.tsx +4 -0
- package/src/DateInput/useOwnScrollGesture.ts +2 -0
- package/src/DateInput/usePointerDragScroll.ts +1 -0
- package/src/DateInput/useScrollSettle.ts +2 -0
- package/src/Dialog/Dialog.tsx +12 -32
- package/src/Drawer/useDrawerDialogPresence.ts +2 -0
- package/src/DropdownMenu/useMenuOverflow.ts +3 -0
- package/src/Field/Field.tsx +2 -2
- package/src/FieldStatus/useFieldStatusAnnouncement.ts +1 -0
- package/src/FormLayout/FormLayout.doc.mjs +181 -46
- package/src/FormLayout/FormLayout.tsx +5 -1
- package/src/HoverCard/HoverCard.doc.mjs +10 -8
- package/src/HoverCard/HoverCard.tsx +58 -6
- package/src/HoverCard/useHoverCard.doc.mjs +178 -36
- package/src/HoverCard/useHoverCard.tsx +49 -54
- package/src/Icon/Icon.doc.mjs +49 -8
- package/src/Icon/Icon.tsx +15 -7
- package/src/IconButton/IconButton.doc.mjs +141 -21
- package/src/Item/useSwipeAction.ts +2 -0
- package/src/Layer/modalOutlet.ts +2 -0
- package/src/Layer/outsidePress.ts +1 -0
- package/src/Layer/useLayer.tsx +2 -0
- package/src/Layer/useLayerDismissal.ts +2 -0
- package/src/Layer/usePressPin.ts +81 -15
- package/src/Layer/useTouchTrigger.ts +2 -0
- package/src/Lightbox/Lightbox.tsx +19 -0
- package/src/MobileNav/MobileNav.tsx +9 -30
- package/src/Outline/useOutlineFromDOM.ts +2 -0
- package/src/Outline/useScrollSpy.ts +2 -0
- package/src/OverflowList/OverflowList.tsx +2 -0
- package/src/Popover/Popover.tsx +4 -0
- package/src/PowerSearch/PowerSearch.doc.mjs +60 -8
- package/src/PowerSearch/PowerSearch.tsx +627 -157
- package/src/PowerSearch/PowerSearchBottomSheet.tsx +2525 -0
- package/src/PowerSearch/PowerSearchEditPopover.tsx +39 -6
- package/src/PowerSearch/PowerSearchFilterEditor.tsx +2 -0
- package/src/PowerSearch/PowerSearchToken.tsx +7 -0
- package/src/PowerSearch/PowerSearchValueEditor.tsx +244 -58
- package/src/PowerSearch/formatFilterValue.ts +55 -17
- package/src/PowerSearch/formatTokenValue.ts +222 -0
- package/src/PowerSearch/powerSearchDateZone.ts +64 -0
- package/src/PowerSearch/powerSearchSheetUtils.ts +224 -0
- package/src/PowerSearch/types.ts +2 -0
- package/src/ProgressBar/ProgressBarTouch.ts +2 -0
- package/src/RadioList/RadioList.tsx +3 -2
- package/src/RadioList/RadioListItem.tsx +5 -3
- package/src/Resizable/Resizable.doc.mjs +5 -4
- package/src/Resizable/ResizeHandle.tsx +169 -109
- package/src/Resizable/createResizable.ts +831 -0
- package/src/Resizable/useResizable.ts +292 -623
- package/src/SegmentedControl/useSegmentedSelectionMotion.ts +6 -3
- package/src/SelectableCard/SelectableCard.tsx +39 -10
- package/src/SelectableCard/selectableCardInput.ts +30 -0
- package/src/Selector/Selector.tsx +5 -12
- package/src/Slider/sliderTouchController.ts +2 -2
- package/src/Spinner/Spinner.tsx +77 -63
- package/src/Switch/Switch.tsx +2 -6
- package/src/Switch/useSwitchTouch.ts +4 -4
- package/src/Table/BaseTable.tsx +46 -12
- package/src/Table/plugins/columnResize/useTableColumnResize.tsx +2 -1
- package/src/Table/plugins/filtering/useTableFiltering.tsx +1 -0
- package/src/Table/plugins/rowExpansion/useTableRowExpansion.tsx +4 -0
- package/src/Table/plugins/stickyColumns/useTableStickyColumns.tsx +2 -0
- package/src/TextInput/TextInput.tsx +11 -10
- package/src/TimeInput/TimeInput.tsx +2 -0
- package/src/Timer/Timer.tsx +1 -0
- package/src/Timestamp/Timestamp.tsx +1 -1
- package/src/Toast/Toast.doc.mjs +4 -3
- package/src/Toast/Toast.tsx +52 -32
- package/src/Toast/ToastViewport.tsx +123 -35
- package/src/Toast/types.ts +9 -3
- package/src/Toast/useToast.tsx +1 -0
- package/src/Tokenizer/Tokenizer.doc.mjs +19 -3
- package/src/Tokenizer/Tokenizer.tsx +73 -51
- package/src/Tokenizer/TokenizerBottomSheet.tsx +1 -1
- package/src/Tokenizer/index.ts +1 -0
- package/src/Tooltip/useTooltip.doc.mjs +24 -0
- package/src/Tooltip/useTooltip.tsx +61 -56
- package/src/Typeahead/BaseTypeahead.tsx +27 -17
- package/src/Typeahead/TypeaheadItem.doc.mjs +6 -3
- package/src/Typeahead/TypeaheadItem.tsx +2 -1
- package/src/animator/createAnimator.doc.mjs +153 -0
- package/src/animator/createAnimator.ts +324 -0
- package/src/gestures/PressTracker.ts +4 -3
- package/src/gestures/README.md +10 -4
- package/src/hooks/ModalAnnounceProvider.tsx +1 -0
- package/src/hooks/actionGroupTracker.ts +20 -5
- package/src/hooks/index.ts +2 -0
- package/src/hooks/longPressDetector.ts +273 -0
- package/src/hooks/pressGroupContext.ts +21 -0
- package/src/hooks/rootScrollStyles.ts +247 -0
- package/src/hooks/scrollLockTouchGuard.ts +182 -0
- package/src/hooks/scrollbarGutter.ts +41 -26
- package/src/hooks/useActionGroupTracking.ts +224 -0
- package/src/hooks/useAnimator.doc.mjs +109 -0
- package/src/hooks/useAnimator.ts +67 -0
- package/src/hooks/useAnnounceRenderedText.ts +1 -0
- package/src/hooks/useAttachment.ts +1 -1
- package/src/hooks/useAutoMediaMode.ts +1 -0
- package/src/hooks/useBusyAnnouncement.ts +2 -0
- package/src/hooks/useDevWarning.ts +2 -0
- package/src/hooks/useFocusTrap.ts +2 -0
- package/src/hooks/useGridFocus.doc.mjs +6 -6
- package/src/hooks/useGridFocus.ts +10 -7
- package/src/hooks/useHotkeys.ts +2 -0
- package/src/hooks/useImageMode.ts +2 -0
- package/src/hooks/useInputStatusIcon.tsx +3 -2
- package/src/hooks/useKeyboardHint.tsx +1 -1
- package/src/hooks/useLongPress.doc.mjs +2 -2
- package/src/hooks/useLongPress.ts +32 -122
- package/src/hooks/useMenuHover.ts +1 -0
- package/src/hooks/useMenuPress.ts +2 -0
- package/src/hooks/useOverflow.ts +2 -1
- package/src/hooks/usePressFeedback.ts +1 -0
- package/src/hooks/useResolvedRequired.ts +3 -0
- package/src/hooks/useScrollLock.doc.mjs +51 -12
- package/src/hooks/useScrollLock.ts +57 -60
- package/src/hooks/useScrollableArea.ts +4 -0
- package/src/hooks/useStreamingText.ts +2 -0
- package/src/i18n/generated-english/PowerSearch/PowerSearchBottomSheet.generated.ts +43 -0
- package/src/i18n/generated-english/PowerSearch/PowerSearchValueEditor.generated.ts +6 -0
- package/src/i18n/generated-english/PowerSearch/formatTokenValue.generated.ts +15 -0
- package/src/i18n/generated-locales/en.generated.ts +41 -0
- package/src/i18n/generated-locales/pseudo.generated.ts +42 -0
- package/src/index.ts +13 -0
- package/src/internal/indicatorPress.stylex.ts +24 -0
- package/src/internal/selectable-card.ts +21 -0
- package/src/internal/sheetDraft.ts +2 -2
- package/src/motion/README.md +9 -5
- package/src/motion/animatedLayout.ts +10 -5
- package/src/motion/animator.ts +66 -31
- package/src/motion/progress.ts +155 -0
- package/src/motion/reducedMotion.ts +3 -1
- package/src/motion/uikit/alert.ts +43 -0
- package/src/privateAttributes/pressGroupItem.stylex.ts +44 -0
- package/src/privateAttributes/reducedMotion.stylex.ts +45 -0
- package/src/theme/Theme.tsx +37 -3
- package/src/theme/motionKnobs.ts +4 -3
- package/src/theme/themeMotion.ts +7 -0
- package/src/utils/dateParser.ts +16 -0
- package/src/utils/focusReturn.ts +30 -0
- package/src/utils/interactionModality.ts +4 -0
- package/src/utils/interactionOverlay.stylex.ts +3 -2
- package/src/utils/plainDate.ts +21 -0
- package/src/utils/pressFeedback.ts +24 -6
- package/src/utils/triggerFocus.ts +80 -0
- package/dist/internal/touch-sheet.d.ts +0 -21
- package/dist/internal/touch-sheet.d.ts.map +0 -1
- package/dist/internal/touch-sheet.js +0 -19
- package/src/internal/touch-sheet.ts +0 -21
|
@@ -2,8 +2,9 @@
|
|
|
2
2
|
* @file usePressPin.ts
|
|
3
3
|
* @input A hover layer's trigger, open state, show and hide, and its
|
|
4
4
|
* `triggerBehavior` and `touchTrigger` options
|
|
5
|
-
* @output usePressPin, the press toggle that pins a hover layer open
|
|
6
|
-
*
|
|
5
|
+
* @output usePressPin, the press toggle that pins a hover layer open, and
|
|
6
|
+
* the app hold behind useTooltip's show() and hide(); isPressPinTrigger;
|
|
7
|
+
* stopPressPinClick; the LayerTriggerBehavior type
|
|
7
8
|
* @position Core-internal: one call per hover layer, useTooltip's. It owns
|
|
8
9
|
* the layer's touch trigger, so the host makes no second touch-trigger call.
|
|
9
10
|
*
|
|
@@ -66,8 +67,18 @@ export interface UsePressPinReturn {
|
|
|
66
67
|
isHeldOpen: () => boolean;
|
|
67
68
|
/** Wires the trigger element, or unwires it with `null`. */
|
|
68
69
|
attach: (element: HTMLElement | null) => void;
|
|
69
|
-
/** Drops the pin: Escape, or a hide
|
|
70
|
+
/** Drops the pin and the app hold: Escape, or a hide from elsewhere. */
|
|
70
71
|
unpin: () => void;
|
|
72
|
+
/**
|
|
73
|
+
* The app's `show()`: shows the layer and holds it open, as a pin does,
|
|
74
|
+
* until `release`, Escape, a press outside, or focus leaving the trigger
|
|
75
|
+
* and the layer. A controlled layer reports the request instead.
|
|
76
|
+
*/
|
|
77
|
+
hold: () => void;
|
|
78
|
+
/** The app's `hide()`: drops the hold and hides the layer. */
|
|
79
|
+
release: () => void;
|
|
80
|
+
/** Whether the app's `show()` holds the layer open now. */
|
|
81
|
+
isAppHeld: () => boolean;
|
|
71
82
|
/**
|
|
72
83
|
* While pinned, focus moving onto an element outside the trigger and the
|
|
73
84
|
* layer closes it. Returns whether the pin decided. The pin calls it for its
|
|
@@ -75,8 +86,9 @@ export interface UsePressPinReturn {
|
|
|
75
86
|
*/
|
|
76
87
|
handleFocusLeave: (event: FocusEvent) => boolean;
|
|
77
88
|
/**
|
|
78
|
-
* Whether the layer shows pinned on a wired trigger
|
|
79
|
-
* its rendered text, unless the layer has
|
|
89
|
+
* Whether the layer shows pinned on a wired trigger, or held by the app's
|
|
90
|
+
* `show()`. The host then announces its rendered text, unless the layer has
|
|
91
|
+
* a `label`.
|
|
80
92
|
*/
|
|
81
93
|
isPinShown: boolean;
|
|
82
94
|
/** The layer's touch trigger (useTouchTriggerInternal), wired to the pin. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePressPin.d.ts","sourceRoot":"","sources":["../../src/Layer/usePressPin.ts"],"names":[],"mappings":"AAIA
|
|
1
|
+
{"version":3,"file":"usePressPin.d.ts","sourceRoot":"","sources":["../../src/Layer/usePressPin.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAKL,KAAK,UAAU,IAAI,eAAe,EAClC,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAIf,OAAO,EAEL,KAAK,iBAAiB,EACtB,KAAK,qBAAqB,EAC3B,MAAM,mBAAmB,CAAC;AAE3B;;;;GAIG;AACH,MAAM,MAAM,oBAAoB,GAAG,UAAU,GAAG,QAAQ,CAAC;AAKzD;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,eAAe,GAAG,IAAI,CAI9D;AAED,0EAA0E;AAC1E,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,OAAO,GAAG,OAAO,CAM3D;AAED,MAAM,WAAW,kBAAkB;IACjC,qCAAqC;IACrC,eAAe,EAAE,oBAAoB,CAAC;IACtC,oDAAoD;IACpD,SAAS,EAAE,OAAO,CAAC;IACnB,mEAAmE;IACnE,MAAM,EAAE,OAAO,GAAG,SAAS,CAAC;IAC5B,mCAAmC;IACnC,WAAW,EAAE,OAAO,CAAC;IACrB,sCAAsC;IACtC,OAAO,EAAE,MAAM,CAAC;IAChB,mDAAmD;IACnD,SAAS,EAAE,MAAM,CAAC;IAClB,0CAA0C;IAC1C,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,2BAA2B;IAC3B,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,sEAAsE;IACtE,MAAM,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAClC,2FAA2F;IAC3F,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,4EAA4E;IAC5E,YAAY,EAAE,iBAAiB,CAAC;IAChC,iEAAiE;IACjE,UAAU,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CAC3C;AAED,MAAM,WAAW,iBAAiB;IAChC,+EAA+E;IAC/E,eAAe,EAAE,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,KAAK,OAAO,CAAC;IAC1D;;;;OAIG;IACH,UAAU,EAAE,MAAM,OAAO,CAAC;IAC1B,4DAA4D;IAC5D,MAAM,EAAE,CAAC,OAAO,EAAE,WAAW,GAAG,IAAI,KAAK,IAAI,CAAC;IAC9C,wEAAwE;IACxE,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB;;;;OAIG;IACH,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,8DAA8D;IAC9D,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,2DAA2D;IAC3D,SAAS,EAAE,MAAM,OAAO,CAAC;IACzB;;;;OAIG;IACH,gBAAgB,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,OAAO,CAAC;IACjD;;;;OAIG;IACH,UAAU,EAAE,OAAO,CAAC;IACpB,6EAA6E;IAC7E,KAAK,EAAE,IAAI,CACT,qBAAqB,EACnB,mBAAmB,GACnB,oBAAoB,GACpB,oBAAoB,GACpB,mBAAmB,GACnB,cAAc,CACjB,CAAC;CACH;AAwBD;;;;;;GAMG;AACH,wBAAgB,WAAW,CAAC,OAAO,EAAE,kBAAkB,GAAG,iBAAiB,CAqZ1E"}
|
|
@@ -6,8 +6,9 @@
|
|
|
6
6
|
* @file usePressPin.ts
|
|
7
7
|
* @input A hover layer's trigger, open state, show and hide, and its
|
|
8
8
|
* `triggerBehavior` and `touchTrigger` options
|
|
9
|
-
* @output usePressPin, the press toggle that pins a hover layer open
|
|
10
|
-
*
|
|
9
|
+
* @output usePressPin, the press toggle that pins a hover layer open, and
|
|
10
|
+
* the app hold behind useTooltip's show() and hide(); isPressPinTrigger;
|
|
11
|
+
* stopPressPinClick; the LayerTriggerBehavior type
|
|
11
12
|
* @position Core-internal: one call per hover layer, useTooltip's. It owns
|
|
12
13
|
* the layer's touch trigger, so the host makes no second touch-trigger call.
|
|
13
14
|
*
|
|
@@ -94,8 +95,19 @@ export function usePressPin(options) {
|
|
|
94
95
|
setIsPinnedState(next);
|
|
95
96
|
}, []);
|
|
96
97
|
|
|
98
|
+
// The app's show() holds the layer on any trigger, in any mode.
|
|
99
|
+
const isAppHeldRef = useRef(false);
|
|
100
|
+
const [isAppHeldState, setIsAppHeldState] = useState(false);
|
|
101
|
+
const setAppHeld = useCallback(next => {
|
|
102
|
+
isAppHeldRef.current = next;
|
|
103
|
+
setIsAppHeldState(next);
|
|
104
|
+
}, []);
|
|
105
|
+
|
|
97
106
|
// The last offered element lets a `triggerBehavior` change rewire it.
|
|
98
107
|
const triggerRef = useRef(null);
|
|
108
|
+
// Every offered trigger, in any mode, so focus leaving ends a pin or an
|
|
109
|
+
// app hold.
|
|
110
|
+
const focusTargetRef = useRef(null);
|
|
99
111
|
const offeredRef = useRef(null);
|
|
100
112
|
// A primitive: re-attaching the same trigger renders nothing.
|
|
101
113
|
const [offeredKind, setOfferedKind] = useState('none');
|
|
@@ -106,6 +118,13 @@ export function usePressPin(options) {
|
|
|
106
118
|
// a pinned layer through the pin, so the pin drops with it.
|
|
107
119
|
const hideFromTouch = useCallback(() => {
|
|
108
120
|
const current = optionsRef.current;
|
|
121
|
+
if (isAppHeldRef.current) {
|
|
122
|
+
setAppHeld(false);
|
|
123
|
+
if (current.isOpen !== undefined) {
|
|
124
|
+
current.report(false);
|
|
125
|
+
return;
|
|
126
|
+
}
|
|
127
|
+
}
|
|
109
128
|
if (current.triggerBehavior === 'toggle' && triggerRef.current != null) {
|
|
110
129
|
if (current.isOpen !== undefined) {
|
|
111
130
|
current.report(false);
|
|
@@ -116,7 +135,7 @@ export function usePressPin(options) {
|
|
|
116
135
|
}
|
|
117
136
|
}
|
|
118
137
|
current.hide();
|
|
119
|
-
}, [setPinned]);
|
|
138
|
+
}, [setPinned, setAppHeld]);
|
|
120
139
|
const {
|
|
121
140
|
isTouchPointerRef,
|
|
122
141
|
isTouchInteraction,
|
|
@@ -138,13 +157,14 @@ export function usePressPin(options) {
|
|
|
138
157
|
const close = useCallback(() => {
|
|
139
158
|
const current = optionsRef.current;
|
|
140
159
|
clearTapOpen();
|
|
160
|
+
setAppHeld(false);
|
|
141
161
|
if (current.isOpen !== undefined) {
|
|
142
162
|
current.report(false);
|
|
143
163
|
return;
|
|
144
164
|
}
|
|
145
165
|
setPinned(false);
|
|
146
166
|
current.hide();
|
|
147
|
-
}, [setPinned, clearTapOpen]);
|
|
167
|
+
}, [setPinned, setAppHeld, clearTapOpen]);
|
|
148
168
|
const announceName = useCallback(() => {
|
|
149
169
|
const current = optionsRef.current;
|
|
150
170
|
const name = current.label?.trim() ?? '';
|
|
@@ -233,6 +253,9 @@ export function usePressPin(options) {
|
|
|
233
253
|
}, [pressFromKey]);
|
|
234
254
|
const isHeldOpen = useCallback(() => {
|
|
235
255
|
const current = optionsRef.current;
|
|
256
|
+
if (isAppHeldRef.current && current.isLayerOpen) {
|
|
257
|
+
return current.isOpen !== false;
|
|
258
|
+
}
|
|
236
259
|
if (current.triggerBehavior !== 'toggle' || triggerRef.current == null) {
|
|
237
260
|
return false;
|
|
238
261
|
}
|
|
@@ -245,7 +268,7 @@ export function usePressPin(options) {
|
|
|
245
268
|
return false;
|
|
246
269
|
}
|
|
247
270
|
const next = event.relatedTarget;
|
|
248
|
-
const trigger =
|
|
271
|
+
const trigger = focusTargetRef.current;
|
|
249
272
|
// Focus that leaves for no element is a press's to decide. The trigger
|
|
250
273
|
// can sit in another document, so the check uses its own window.
|
|
251
274
|
const view = trigger?.ownerDocument.defaultView;
|
|
@@ -260,6 +283,8 @@ export function usePressPin(options) {
|
|
|
260
283
|
return true;
|
|
261
284
|
}, [isHeldOpen, close]);
|
|
262
285
|
const unwire = useCallback(() => {
|
|
286
|
+
focusTargetRef.current?.removeEventListener('focusout', handleFocusLeave);
|
|
287
|
+
focusTargetRef.current = null;
|
|
263
288
|
const previous = triggerRef.current;
|
|
264
289
|
if (previous == null) {
|
|
265
290
|
return;
|
|
@@ -267,7 +292,6 @@ export function usePressPin(options) {
|
|
|
267
292
|
previous.removeEventListener('click', handlePress);
|
|
268
293
|
previous.removeEventListener('keydown', handleKeyDown);
|
|
269
294
|
previous.removeEventListener('keyup', handleKeyUp);
|
|
270
|
-
previous.removeEventListener('focusout', handleFocusLeave);
|
|
271
295
|
const own = ownStateRef.current;
|
|
272
296
|
if (own != null) {
|
|
273
297
|
restoreAttribute(previous, 'aria-expanded', own.expanded);
|
|
@@ -290,10 +314,14 @@ export function usePressPin(options) {
|
|
|
290
314
|
mode: current.triggerBehavior
|
|
291
315
|
};
|
|
292
316
|
unwire();
|
|
293
|
-
if (element == null
|
|
317
|
+
if (element == null) {
|
|
294
318
|
return;
|
|
295
319
|
}
|
|
296
|
-
|
|
320
|
+
// Its own focus-leave listener, in any mode: `focusTrigger="never"`
|
|
321
|
+
// attaches none, and an app hold needs it on any trigger.
|
|
322
|
+
element.addEventListener('focusout', handleFocusLeave);
|
|
323
|
+
focusTargetRef.current = element;
|
|
324
|
+
if (current.triggerBehavior !== 'toggle' || !isPressPinTrigger(element)) {
|
|
297
325
|
return;
|
|
298
326
|
}
|
|
299
327
|
element.addEventListener('click', handlePress);
|
|
@@ -301,8 +329,6 @@ export function usePressPin(options) {
|
|
|
301
329
|
element.addEventListener('keydown', handleKeyDown);
|
|
302
330
|
element.addEventListener('keyup', handleKeyUp);
|
|
303
331
|
}
|
|
304
|
-
// Its own focus-leave listener: `focusTrigger="never"` attaches none.
|
|
305
|
-
element.addEventListener('focusout', handleFocusLeave);
|
|
306
332
|
ownStateRef.current = {
|
|
307
333
|
expanded: element.getAttribute('aria-expanded'),
|
|
308
334
|
controls: element.getAttribute('aria-controls')
|
|
@@ -328,7 +354,28 @@ export function usePressPin(options) {
|
|
|
328
354
|
if (isPinnedRef.current) {
|
|
329
355
|
setPinned(false);
|
|
330
356
|
}
|
|
331
|
-
|
|
357
|
+
if (isAppHeldRef.current) {
|
|
358
|
+
setAppHeld(false);
|
|
359
|
+
}
|
|
360
|
+
}, [setPinned, setAppHeld]);
|
|
361
|
+
const hold = useCallback(() => {
|
|
362
|
+
const current = optionsRef.current;
|
|
363
|
+
if (!current.isEnabled) {
|
|
364
|
+
return;
|
|
365
|
+
}
|
|
366
|
+
setAppHeld(true);
|
|
367
|
+
armOutsideDismiss();
|
|
368
|
+
announceName();
|
|
369
|
+
if (current.isOpen !== undefined) {
|
|
370
|
+
current.report(true);
|
|
371
|
+
return;
|
|
372
|
+
}
|
|
373
|
+
current.show();
|
|
374
|
+
}, [setAppHeld, armOutsideDismiss, announceName]);
|
|
375
|
+
const release = useCallback(() => {
|
|
376
|
+
close();
|
|
377
|
+
}, [close]);
|
|
378
|
+
const isAppHeld = useCallback(() => isAppHeldRef.current, []);
|
|
332
379
|
|
|
333
380
|
// Each path that hides a pinned layer drops the pin itself, so a layer that
|
|
334
381
|
// does not show is never reported expanded.
|
|
@@ -344,12 +391,15 @@ export function usePressPin(options) {
|
|
|
344
391
|
writeAttribute(trigger, 'aria-expanded', isExpanded ? 'true' : 'false');
|
|
345
392
|
writeAttribute(trigger, 'aria-controls', isLayerOpen ? layerId : null);
|
|
346
393
|
});
|
|
347
|
-
const isPinShown = isToggleMode && isWired && isExpanded;
|
|
394
|
+
const isPinShown = isToggleMode && isWired && isExpanded || isAppHeldState && isLayerOpen && isOpen !== false;
|
|
348
395
|
return {
|
|
349
396
|
isToggleTrigger,
|
|
350
397
|
isHeldOpen,
|
|
351
398
|
attach,
|
|
352
399
|
unpin,
|
|
400
|
+
hold,
|
|
401
|
+
release,
|
|
402
|
+
isAppHeld,
|
|
353
403
|
handleFocusLeave,
|
|
354
404
|
isPinShown,
|
|
355
405
|
touch: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTouchTrigger.d.ts","sourceRoot":"","sources":["../../src/Layer/useTouchTrigger.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AAEH,OAAO,EAIL,KAAK,UAAU,IAAI,eAAe,EAClC,KAAK,YAAY,IAAI,iBAAiB,EACtC,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AASf;;;;;;GAMG;AACH,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,KAAK,GAAG,MAAM,CAAC;AAExD;;;;;;;GAOG;AACH,eAAO,MAAM,mBAAmB,aAA4B,CAAC;AAE7D,wBAAgB,UAAU,CAAC,KAAK,EAAE,OAAO,GAAG;IAC1C,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;IAC3D,OAAO,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;CACpD,CAAC;AACF,wBAAgB,UAAU,CAAC,KAAK,EAAE,WAAW,GAAG;IAC9C,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;IAC3D,WAAW,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;CACxD,CAAC;AAwCF;;;;;;;;;;;GAWG;AACH,wBAAgB,eAAe,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO,CA8B7D;AAiBD;;;;;;;GAOG;AACH,wBAAgB,yBAAyB,CAAC,MAAM,EAAE,OAAO,GAAG,OAAO,CAUlE;AAeD,MAAM,WAAW,sBAAsB;IACrC,sDAAsD;IACtD,YAAY,EAAE,iBAAiB,CAAC;IAEhC,oDAAoD;IACpD,SAAS,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,YAAY,EAAE,OAAO,CAAC;IAEtB,2CAA2C;IAC3C,MAAM,EAAE,OAAO,CAAC;IAEhB,0EAA0E;IAC1E,OAAO,EAAE,MAAM,CAAC;IAEhB,oDAAoD;IACpD,UAAU,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAE1C,uDAAuD;IACvD,IAAI,EAAE,MAAM,IAAI,CAAC;IAEjB,mCAAmC;IACnC,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB;AAED,MAAM,WAAW,qBAAqB;IACpC;;;;OAIG;IACH,iBAAiB,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAEtC;;;;OAIG;IACH,kBAAkB,EAAE,MAAM,OAAO,CAAC;IAElC;;;;OAIG;IACH,kBAAkB,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IAElD;;;;;;OAMG;IACH,iBAAiB,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,OAAO,CAAC;IAEpD,gFAAgF;IAChF,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED;;;;;GAKG;AACH,MAAM,WAAW,6BAA8B,SAAQ,qBAAqB;IAC1E;;;;OAIG;IACH,iBAAiB,EAAE,MAAM,IAAI,CAAC;CAC/B;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,eAAe,CAC7B,OAAO,EAAE,sBAAsB,GAC9B,qBAAqB,CASvB;AAED;;;;;GAKG;AACH,wBAAgB,uBAAuB,CACrC,OAAO,EAAE,sBAAsB,GAC9B,6BAA6B,
|
|
1
|
+
{"version":3,"file":"useTouchTrigger.d.ts","sourceRoot":"","sources":["../../src/Layer/useTouchTrigger.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AAEH,OAAO,EAIL,KAAK,UAAU,IAAI,eAAe,EAClC,KAAK,YAAY,IAAI,iBAAiB,EACtC,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AASf;;;;;;GAMG;AACH,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,KAAK,GAAG,MAAM,CAAC;AAExD;;;;;;;GAOG;AACH,eAAO,MAAM,mBAAmB,aAA4B,CAAC;AAE7D,wBAAgB,UAAU,CAAC,KAAK,EAAE,OAAO,GAAG;IAC1C,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;IAC3D,OAAO,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;CACpD,CAAC;AACF,wBAAgB,UAAU,CAAC,KAAK,EAAE,WAAW,GAAG;IAC9C,aAAa,EAAE,CAAC,KAAK,EAAE,iBAAiB,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;IAC3D,WAAW,EAAE,CAAC,KAAK,EAAE,eAAe,CAAC,OAAO,CAAC,KAAK,IAAI,CAAC;CACxD,CAAC;AAwCF;;;;;;;;;;;GAWG;AACH,wBAAgB,eAAe,CAAC,OAAO,EAAE,WAAW,GAAG,OAAO,CA8B7D;AAiBD;;;;;;;GAOG;AACH,wBAAgB,yBAAyB,CAAC,MAAM,EAAE,OAAO,GAAG,OAAO,CAUlE;AAeD,MAAM,WAAW,sBAAsB;IACrC,sDAAsD;IACtD,YAAY,EAAE,iBAAiB,CAAC;IAEhC,oDAAoD;IACpD,SAAS,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,YAAY,EAAE,OAAO,CAAC;IAEtB,2CAA2C;IAC3C,MAAM,EAAE,OAAO,CAAC;IAEhB,0EAA0E;IAC1E,OAAO,EAAE,MAAM,CAAC;IAEhB,oDAAoD;IACpD,UAAU,EAAE,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAE1C,uDAAuD;IACvD,IAAI,EAAE,MAAM,IAAI,CAAC;IAEjB,mCAAmC;IACnC,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB;AAED,MAAM,WAAW,qBAAqB;IACpC;;;;OAIG;IACH,iBAAiB,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC;IAEtC;;;;OAIG;IACH,kBAAkB,EAAE,MAAM,OAAO,CAAC;IAElC;;;;OAIG;IACH,kBAAkB,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,IAAI,CAAC;IAElD;;;;;;OAMG;IACH,iBAAiB,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,OAAO,CAAC;IAEpD,gFAAgF;IAChF,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED;;;;;GAKG;AACH,MAAM,WAAW,6BAA8B,SAAQ,qBAAqB;IAC1E;;;;OAIG;IACH,iBAAiB,EAAE,MAAM,IAAI,CAAC;CAC/B;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,eAAe,CAC7B,OAAO,EAAE,sBAAsB,GAC9B,qBAAqB,CASvB;AAED;;;;;GAKG;AACH,wBAAgB,uBAAuB,CACrC,OAAO,EAAE,sBAAsB,GAC9B,6BAA6B,CA6N/B"}
|
|
@@ -304,7 +304,10 @@ export function useTouchTriggerInternal(options) {
|
|
|
304
304
|
doc.addEventListener('pointercancel', handleOutsidePointerEnd, true);
|
|
305
305
|
}
|
|
306
306
|
}, [triggerRef, disarmOutsideDismiss]);
|
|
307
|
+
|
|
308
|
+
// Releases the outside-dismiss listener on unmount.
|
|
307
309
|
useEffect(() => disarmOutsideDismiss, [disarmOutsideDismiss]);
|
|
310
|
+
// Releases a pending tap on unmount.
|
|
308
311
|
useEffect(() => () => forgetPendingTapRef.current?.(), []);
|
|
309
312
|
const isTouchInteraction = useCallback(() => isTouchPointerRef.current && readModality() === 'pointer', [readModality]);
|
|
310
313
|
const handlePointerEnter = useCallback(event => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Lightbox.d.ts","sourceRoot":"","sources":["../../src/Lightbox/Lightbox.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AASf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"Lightbox.d.ts","sourceRoot":"","sources":["../../src/Lightbox/Lightbox.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EAOL,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AASf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAuB5C;;GAEG;AACH,MAAM,MAAM,iBAAiB,GAAG,OAAO,GAAG,OAAO,CAAC;AAElD;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B,uBAAuB;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,gEAAgE;IAChE,GAAG,EAAE,MAAM,CAAC;IACZ,iDAAiD;IACjD,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,IAAI,CAAC,EAAE,iBAAiB,CAAC;CAC1B;AAED,MAAM,WAAW,aAAc,SAAQ,SAAS,CAAC,iBAAiB,CAAC;IACjE,+CAA+C;IAC/C,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;OAEG;IACH,MAAM,EAAE,OAAO,CAAC;IAChB;;;OAGG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IACxC;;;OAGG;IACH,KAAK,EAAE,aAAa,GAAG,aAAa,EAAE,CAAC;IACvC;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAmKD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,wBAAgB,QAAQ,CAAC,EACvB,MAAM,EACN,YAAY,EACZ,KAAK,EACL,KAAK,EAAE,eAAe,EACtB,YAAgB,EAChB,aAAa,EACb,OAAe,EACf,WAAmB,EACnB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,OAAO,EAAE,WAAW,EACpB,SAAS,EAAE,aAAa,EACxB,GAAG,KAAK,EACT,EAAE,aAAa,sCAwef;yBAxfe,QAAQ"}
|
|
@@ -42,6 +42,7 @@ import { isRtlElement } from "../hooks/isRtlElement.js";
|
|
|
42
42
|
import { registerEnglishFallback, useComponentTranslator } from "../i18n/useComponentTranslator.js";
|
|
43
43
|
import english from "../i18n/generated-english/Lightbox/Lightbox.generated.js";
|
|
44
44
|
import { isRenderable } from "../utils/isRenderable.js";
|
|
45
|
+
import { prepareFocusReturnOnRemoval } from "../utils/focusReturn.js";
|
|
45
46
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
46
47
|
registerEnglishFallback(english);
|
|
47
48
|
/**
|
|
@@ -311,6 +312,7 @@ export function Lightbox({
|
|
|
311
312
|
// Open/close dialog. The dialog renders only with an item, so a viewer
|
|
312
313
|
// opened before its first item arrives opens when that item does.
|
|
313
314
|
const hasItem = currentItem != null;
|
|
315
|
+
// Syncs the native dialog with `isOpen` through `showModal()` and `close()`.
|
|
314
316
|
useIsomorphicLayoutEffect(() => {
|
|
315
317
|
const dialog = dialogRef.current;
|
|
316
318
|
if (!dialog || !hasItem) {
|
|
@@ -326,6 +328,23 @@ export function Lightbox({
|
|
|
326
328
|
}
|
|
327
329
|
}
|
|
328
330
|
}, [isOpen, hasItem]);
|
|
331
|
+
|
|
332
|
+
// A viewer that unmounts while open (rendered only while open, or removed
|
|
333
|
+
// with the rest of a view) never runs the close branch above. Focus the
|
|
334
|
+
// removal lost goes back to the opener while the opener is still on the
|
|
335
|
+
// page.
|
|
336
|
+
useEffect(() => {
|
|
337
|
+
const dialog = dialogRef.current;
|
|
338
|
+
if (dialog == null) {
|
|
339
|
+
return;
|
|
340
|
+
}
|
|
341
|
+
const returnFocusOnRemoval = prepareFocusReturnOnRemoval(dialog);
|
|
342
|
+
return () => {
|
|
343
|
+
if (dialog.open) {
|
|
344
|
+
returnFocusOnRemoval(triggerElementRef.current);
|
|
345
|
+
}
|
|
346
|
+
};
|
|
347
|
+
}, [hasItem]);
|
|
329
348
|
const handleClose = useCallback(() => {
|
|
330
349
|
onOpenChange(false);
|
|
331
350
|
}, [onOpenChange]);
|
|
@@ -14,9 +14,10 @@
|
|
|
14
14
|
* without manual z-index management. The browser provides:
|
|
15
15
|
* - Top layer promotion (no z-index needed)
|
|
16
16
|
* - `::backdrop` pseudo-element
|
|
17
|
-
* - Body scroll lock
|
|
18
17
|
* - Focus trapping
|
|
19
18
|
*
|
|
19
|
+
* The page behind takes `useScrollLock`, the same lock as every other modal.
|
|
20
|
+
*
|
|
20
21
|
* Escape is owned by the shared dismissal stack (`useLayerDismissal`), so a
|
|
21
22
|
* drawer opened over another layer takes the press and nothing behind it
|
|
22
23
|
* closes. The native `cancel` event still handles the dismissals the browser
|
|
@@ -32,7 +33,7 @@
|
|
|
32
33
|
* SYNC: When modified, update these files to stay in sync:
|
|
33
34
|
* - /packages/core/src/MobileNav/index.ts (exports if types change)
|
|
34
35
|
* - /packages/core/src/Layer/useLayerDismissal.ts (dismissal stack)
|
|
35
|
-
* - /packages/core/src/hooks/
|
|
36
|
+
* - /packages/core/src/hooks/useScrollLock.ts (the page's scroll lock)
|
|
36
37
|
* - /packages/cli/assets/templates/blocks/components/MobileNav/ (showcase blocks)
|
|
37
38
|
*/
|
|
38
39
|
import { type ReactNode } from 'react';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MobileNav.d.ts","sourceRoot":"","sources":["../../src/MobileNav/MobileNav.tsx"],"names":[],"mappings":"AAIA
|
|
1
|
+
{"version":3,"file":"MobileNav.d.ts","sourceRoot":"","sources":["../../src/MobileNav/MobileNav.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqCG;AAEH,OAAO,EAOL,KAAK,SAAS,EAEf,MAAM,OAAO,CAAC;AAsBf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAyM5C;;;;;;;GAOG;AACH,eAAO,MAAM,kBAAkB,MAAM,CAAC;AAItC;;;;;;;;;;GAUG;AACH,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAkBpE;AA+DD,MAAM,WAAW,cAAe,SAAQ,IAAI,CAAC,SAAS,EAAE,OAAO,CAAC;IAC9D,wCAAwC;IACxC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,iBAAiB,CAAC,CAAC;IACnC;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;;;;OAMG;IACH,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAEzC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;OAIG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;;;;;;OAQG;IACH,IAAI,CAAC,EAAE,OAAO,GAAG,KAAK,GAAG,MAAM,CAAC;IAEhC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAMD;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,SAAS,CAAC,EACxB,MAAM,EAAE,UAAU,EAClB,YAAY,EAAE,gBAAgB,EAC9B,QAAQ,EACR,MAAM,EACN,KAAW,EACX,IAAa,EACb,KAAK,EACL,aAAa,EAAE,MAAM,EACrB,MAAM,EACN,SAAS,EACT,KAAK,EACL,OAAO,EAAE,WAAW,EACpB,GAAG,EACH,GAAG,IAAI,EACR,EAAE,cAAc,+BAsQhB;yBArRe,SAAS"}
|
|
@@ -18,9 +18,10 @@
|
|
|
18
18
|
* without manual z-index management. The browser provides:
|
|
19
19
|
* - Top layer promotion (no z-index needed)
|
|
20
20
|
* - `::backdrop` pseudo-element
|
|
21
|
-
* - Body scroll lock
|
|
22
21
|
* - Focus trapping
|
|
23
22
|
*
|
|
23
|
+
* The page behind takes `useScrollLock`, the same lock as every other modal.
|
|
24
|
+
*
|
|
24
25
|
* Escape is owned by the shared dismissal stack (`useLayerDismissal`), so a
|
|
25
26
|
* drawer opened over another layer takes the press and nothing behind it
|
|
26
27
|
* closes. The native `cancel` event still handles the dismissals the browser
|
|
@@ -36,7 +37,7 @@
|
|
|
36
37
|
* SYNC: When modified, update these files to stay in sync:
|
|
37
38
|
* - /packages/core/src/MobileNav/index.ts (exports if types change)
|
|
38
39
|
* - /packages/core/src/Layer/useLayerDismissal.ts (dismissal stack)
|
|
39
|
-
* - /packages/core/src/hooks/
|
|
40
|
+
* - /packages/core/src/hooks/useScrollLock.ts (the page's scroll lock)
|
|
40
41
|
* - /packages/cli/assets/templates/blocks/components/MobileNav/ (showcase blocks)
|
|
41
42
|
*/
|
|
42
43
|
import { useCallback, useEffect, useId, useMemo, useRef, useState } from 'react';
|
|
@@ -47,7 +48,6 @@ import { Button } from "../Button/index.js";
|
|
|
47
48
|
import { Icon } from "../Icon/index.js";
|
|
48
49
|
import { Heading } from "../Heading/Heading.js";
|
|
49
50
|
import { useAppShellMobile } from "../AppShell/AppShellMobileContext.js";
|
|
50
|
-
import { holdScrollbarGutter } from "../hooks/scrollbarGutter.js";
|
|
51
51
|
import { mergeProps, composeEventHandlers } from "../utils/index.js";
|
|
52
52
|
import { layerTextReset } from "../Layer/layerTextReset.stylex.js";
|
|
53
53
|
import { layerStructureReset } from "../Layer/layerStructureReset.stylex.js";
|
|
@@ -59,6 +59,7 @@ import { ModalAnnounceProvider } from "../hooks/ModalAnnounceProvider.js";
|
|
|
59
59
|
import { useLayerDismissal } from "../Layer/useLayerDismissal.js";
|
|
60
60
|
import { themeProps } from "../utils/themeProps.js";
|
|
61
61
|
import { useMergedRefs } from "../hooks/useMergedRefs.js";
|
|
62
|
+
import { useScrollLock } from "../hooks/useScrollLock.js";
|
|
62
63
|
import { registerEnglishFallback, useComponentTranslator } from "../i18n/useComponentTranslator.js";
|
|
63
64
|
import english from "../i18n/generated-english/MobileNav/MobileNav.generated.js";
|
|
64
65
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
@@ -335,15 +336,10 @@ export function MobileNav({
|
|
|
335
336
|
setWasOpen(isOpen);
|
|
336
337
|
setIsCloseHeld(!isOpen);
|
|
337
338
|
}
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
//
|
|
341
|
-
|
|
342
|
-
if (gutterRef.current) {
|
|
343
|
-
gutterRef.current.release();
|
|
344
|
-
gutterRef.current = null;
|
|
345
|
-
}
|
|
346
|
-
}, []);
|
|
339
|
+
// The same page lock as every other modal. Its effect runs before the
|
|
340
|
+
// open/close effect below, so it measures the scrollbar gutter before
|
|
341
|
+
// showModal() can hide the scrollbar.
|
|
342
|
+
useScrollLock(isOpen);
|
|
347
343
|
// Resolved side — computed from trigger position when side='auto'
|
|
348
344
|
const [resolvedSide, setResolvedSide] = useState(side === 'auto' ? 'end' : side);
|
|
349
345
|
|
|
@@ -380,9 +376,6 @@ export function MobileNav({
|
|
|
380
376
|
return;
|
|
381
377
|
}
|
|
382
378
|
if (isOpen) {
|
|
383
|
-
// Taken first: every mutation below is one that can hide the scrollbar,
|
|
384
|
-
// and the gutter has to be measured while it is still there.
|
|
385
|
-
gutterRef.current ??= holdScrollbarGutter(document.documentElement);
|
|
386
379
|
if (!dialog.open) {
|
|
387
380
|
// Capture the opener before showModal() pulls focus into the top
|
|
388
381
|
// layer. Only on the transition into open: a reopen while the delayed
|
|
@@ -391,14 +384,7 @@ export function MobileNav({
|
|
|
391
384
|
triggerElementRef.current = document.activeElement;
|
|
392
385
|
dialog.showModal();
|
|
393
386
|
}
|
|
394
|
-
// Prevent background scrolling and iOS pull-to-refresh.
|
|
395
|
-
// overflow: clip avoids creating a scroll container (unlike hidden),
|
|
396
|
-
// so there's no scroll bounce and no need to save/restore scroll position.
|
|
397
|
-
document.documentElement.style.overflow = 'clip';
|
|
398
|
-
gutterRef.current.settle();
|
|
399
387
|
} else if (dialog.open) {
|
|
400
|
-
document.documentElement.style.overflow = '';
|
|
401
|
-
releaseGutter();
|
|
402
388
|
closeTimeoutRef.current = setTimeout(() => {
|
|
403
389
|
closeAndRestoreFocus(dialog, triggerElementRef);
|
|
404
390
|
setIsCloseHeld(false);
|
|
@@ -413,10 +399,8 @@ export function MobileNav({
|
|
|
413
399
|
clearTimeout(closeTimeoutRef.current);
|
|
414
400
|
closeTimeoutRef.current = null;
|
|
415
401
|
}
|
|
416
|
-
document.documentElement.style.overflow = '';
|
|
417
|
-
releaseGutter();
|
|
418
402
|
};
|
|
419
|
-
}, [isOpen
|
|
403
|
+
}, [isOpen]);
|
|
420
404
|
|
|
421
405
|
// Close the native dialog on unmount if it's still open. Inside AppShell the
|
|
422
406
|
// drawer is mounted in an <Activity> that switches to mode="hidden" when the
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useOutlineFromDOM.d.ts","sourceRoot":"","sources":["../../src/Outline/useOutlineFromDOM.ts"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,SAAS,CAAC;AAoBzC,sEAAsE;AACtE,wBAAgB,iBAAiB,CAC/B,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,GAChD,WAAW,EAAE,
|
|
1
|
+
{"version":3,"file":"useOutlineFromDOM.d.ts","sourceRoot":"","sources":["../../src/Outline/useOutlineFromDOM.ts"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,SAAS,CAAC;AAoBzC,sEAAsE;AACtE,wBAAgB,iBAAiB,CAC/B,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,GAChD,WAAW,EAAE,CAgCf"}
|
|
@@ -31,6 +31,9 @@ function collectOutlineItems(container) {
|
|
|
31
31
|
/** Build outline items from h1-h6 elements inside a DOM container. */
|
|
32
32
|
export function useOutlineFromDOM(containerRef) {
|
|
33
33
|
const [items, setItems] = useState(() => collectOutlineItems(containerRef.current));
|
|
34
|
+
|
|
35
|
+
// Syncs the outline items with the container's DOM through a
|
|
36
|
+
// MutationObserver.
|
|
34
37
|
useEffect(() => {
|
|
35
38
|
const container = containerRef.current;
|
|
36
39
|
setItems(collectOutlineItems(container));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useScrollSpy.d.ts","sourceRoot":"","sources":["../../src/Outline/useScrollSpy.ts"],"names":[],"mappings":"AAqCA,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,SAAS,CAAC;AAsJzC,UAAU,mBAAmB;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,gBAAgB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC7C;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,6EAA6E;IAC7E,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACzD,8EAA8E;IAC9E,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,iEAAiE;IACjE,eAAe,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,6EAA6E;IAC7E,aAAa,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC;AAED,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B,+EAA+E;IAC/E,WAAW,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC;;;;;;;;;;;;OAYG;IACH,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAC;CACnC;AAED,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,KAAK,EACL,gBAAgB,EAChB,OAAO,EACP,MAAU,EACV,kBAAkB,EAClB,gBAAuB,EACvB,eAAe,EACf,aAAa,GACd,EAAE,mBAAmB,GAAG,kBAAkB,
|
|
1
|
+
{"version":3,"file":"useScrollSpy.d.ts","sourceRoot":"","sources":["../../src/Outline/useScrollSpy.ts"],"names":[],"mappings":"AAqCA,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,SAAS,CAAC;AAsJzC,UAAU,mBAAmB;IAC3B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,WAAW,EAAE,CAAC;IACrB,gBAAgB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IAC7C;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,6EAA6E;IAC7E,kBAAkB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACzD,8EAA8E;IAC9E,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,iEAAiE;IACjE,eAAe,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,6EAA6E;IAC7E,aAAa,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC;AAED,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B,+EAA+E;IAC/E,WAAW,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC;;;;;;;;;;;;OAYG;IACH,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,OAAO,CAAC;CACnC;AAED,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,KAAK,EACL,gBAAgB,EAChB,OAAO,EACP,MAAU,EACV,kBAAkB,EAClB,gBAAuB,EACvB,eAAe,EACf,aAAa,GACd,EAAE,mBAAmB,GAAG,kBAAkB,CAsN1C"}
|
|
@@ -181,6 +181,9 @@ export function useScrollSpy({
|
|
|
181
181
|
const getScrollRoot = useCallback(() => {
|
|
182
182
|
return scrollContainerRef?.current ?? getScrollableAncestor(rootRef.current);
|
|
183
183
|
}, [rootRef, scrollContainerRef]);
|
|
184
|
+
|
|
185
|
+
// Syncs a scroll listener on the scroll root and a window resize listener
|
|
186
|
+
// with the items and offset. They choose the active outline item.
|
|
184
187
|
useEffect(() => {
|
|
185
188
|
if (isControlled || typeof window === 'undefined') {
|
|
186
189
|
return;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OverflowList.d.ts","sourceRoot":"","sources":["../../src/OverflowList/OverflowList.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EACL,KAAK,SAAS,EACd,KAAK,YAAY,EAKlB,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAE5C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAgFhD,MAAM,WAAW,YAAY;IAC3B,sCAAsC;IACtC,KAAK,EAAE,YAAY,CAAC;IACpB,2DAA2D;IAC3D,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,iBAAkB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAClE,qDAAqD;IACrD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;OAIG;IACH,GAAG,CAAC,EAAE,WAAW,CAAC;IAElB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;;;;;OAMG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IAE/B;;;;;;;;;OASG;IACH,QAAQ,CAAC,EAAE,eAAe,GAAG,aAAa,CAAC;IAE3C;;;;;;;;;;;;;;;;;;;;;OAqBG;IACH,gBAAgB,CAAC,EAAE,CAAC,aAAa,EAAE,YAAY,EAAE,KAAK,SAAS,CAAC;IAEhE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAsCG;IACH,gBAAgB,CAAC,EAAE,CAAC,aAAa,EAAE,YAAY,EAAE,KAAK,IAAI,CAAC;CAC5D;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,GAAO,EACP,eAAmB,EACnB,eAAe,EACf,OAAO,EACP,YAAoB,EACpB,QAAwB,EACxB,gBAAgB,EAChB,gBAAgB,EAChB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,iBAAiB,+
|
|
1
|
+
{"version":3,"file":"OverflowList.d.ts","sourceRoot":"","sources":["../../src/OverflowList/OverflowList.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,EACL,KAAK,SAAS,EACd,KAAK,YAAY,EAKlB,MAAM,OAAO,CAAC;AACf,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AAE5C,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,gBAAgB,CAAC;AAgFhD,MAAM,WAAW,YAAY;IAC3B,sCAAsC;IACtC,KAAK,EAAE,YAAY,CAAC;IACpB,2DAA2D;IAC3D,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,iBAAkB,SAAQ,SAAS,CAAC,cAAc,CAAC;IAClE,qDAAqD;IACrD,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,cAAc,CAAC,CAAC;IAEhC;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;IAEpB;;;;OAIG;IACH,GAAG,CAAC,EAAE,WAAW,CAAC;IAElB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;;;;;OAMG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;;OAGG;IACH,YAAY,CAAC,EAAE,OAAO,GAAG,KAAK,CAAC;IAE/B;;;;;;;;;OASG;IACH,QAAQ,CAAC,EAAE,eAAe,GAAG,aAAa,CAAC;IAE3C;;;;;;;;;;;;;;;;;;;;;OAqBG;IACH,gBAAgB,CAAC,EAAE,CAAC,aAAa,EAAE,YAAY,EAAE,KAAK,SAAS,CAAC;IAEhE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAsCG;IACH,gBAAgB,CAAC,EAAE,CAAC,aAAa,EAAE,YAAY,EAAE,KAAK,IAAI,CAAC;CAC5D;AAED;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,GAAO,EACP,eAAmB,EACnB,eAAe,EACf,OAAO,EACP,YAAoB,EACpB,QAAwB,EACxB,gBAAgB,EAChB,gBAAgB,EAChB,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,EACH,GAAG,KAAK,EACT,EAAE,iBAAiB,+BAsInB;yBArJe,YAAY"}
|
|
@@ -239,6 +239,9 @@ export function OverflowList({
|
|
|
239
239
|
const reportedKeyRef = useRef('[]');
|
|
240
240
|
const overflowItemsRef = useRef(overflowItems);
|
|
241
241
|
overflowItemsRef.current = overflowItems;
|
|
242
|
+
|
|
243
|
+
// Reports the measured overflow to `onOverflowChange`. A ResizeObserver
|
|
244
|
+
// drives the measurement, so no event handler can report it.
|
|
242
245
|
useIsomorphicLayoutEffect(() => {
|
|
243
246
|
if (!onOverflowChange || measuredKey !== measurementKey || reportedKeyRef.current === overflowKey) {
|
|
244
247
|
return;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Popover.d.ts","sourceRoot":"","sources":["../../src/Popover/Popover.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"Popover.d.ts","sourceRoot":"","sources":["../../src/Popover/Popover.tsx"],"names":[],"mappings":"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"}
|
package/dist/Popover/Popover.js
CHANGED
|
@@ -396,6 +396,9 @@ export function Popover({
|
|
|
396
396
|
})
|
|
397
397
|
};
|
|
398
398
|
}, [measureOverflow, popover.contentRef]);
|
|
399
|
+
|
|
400
|
+
// Syncs the overflow measurement with the open surface. It measures, then
|
|
401
|
+
// observes resize and DOM changes until the surface closes.
|
|
399
402
|
useIsomorphicLayoutEffect(() => {
|
|
400
403
|
if (!popover.isOpen) {
|
|
401
404
|
return;
|
|
@@ -434,6 +437,9 @@ export function Popover({
|
|
|
434
437
|
}
|
|
435
438
|
};
|
|
436
439
|
}, [measureOverflow, popover.isOpen, scheduleOverflowMeasurement]);
|
|
440
|
+
|
|
441
|
+
// Measures overflow again after the content changes while the surface is
|
|
442
|
+
// open.
|
|
437
443
|
useIsomorphicLayoutEffect(() => {
|
|
438
444
|
if (!popover.isOpen) {
|
|
439
445
|
return;
|
|
@@ -1,12 +1,15 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* @file PowerSearch.tsx
|
|
3
|
-
* @input PowerSearchConfig, filters, onChange
|
|
3
|
+
* @input PowerSearchConfig, filters, onChange; Tokenizer, Field parts, Token,
|
|
4
|
+
* useAdaptivePresentation, and PowerSearchBottomSheet (lazy)
|
|
4
5
|
* @output Structured filter bar with token-based filter management
|
|
5
6
|
* @position Main component; forwards DOM ref and exposes tokenizer control via
|
|
6
|
-
* handleRef
|
|
7
|
+
* handleRef. The experimental `presentation` option swaps the tokenizer
|
|
8
|
+
* field and editor popover for one trigger that opens PowerSearchBottomSheet.
|
|
7
9
|
*
|
|
8
10
|
* SYNC: When modified, update:
|
|
9
11
|
* - /packages/core/src/PowerSearch/index.ts
|
|
12
|
+
* - /packages/core/src/PowerSearch/PowerSearchBottomSheet.tsx (sheet presentation)
|
|
10
13
|
* - /packages/cli/assets/templates/blocks/components/PowerSearch/ (showcase blocks)
|
|
11
14
|
*/
|
|
12
15
|
import React, { type ReactNode } from 'react';
|
|
@@ -80,7 +83,13 @@ export interface PowerSearchProps extends Omit<BaseProps<HTMLElement>, 'onChange
|
|
|
80
83
|
maxSearchResults?: number;
|
|
81
84
|
/** Label for the save button in edit popover. @default 'Apply' */
|
|
82
85
|
popoverSaveButtonLabel?: string;
|
|
83
|
-
/**
|
|
86
|
+
/**
|
|
87
|
+
* IANA zone a date-only `date_absolute` value, and each absolute part of a
|
|
88
|
+
* `date_range`, is read and written in: the token, the label and the editor
|
|
89
|
+
* show its day there, and a picked day stores as that midnight. Unset, a
|
|
90
|
+
* day is its UTC day. A `date_absolute` with `isDateOnly: false` formats
|
|
91
|
+
* its label in it.
|
|
92
|
+
*/
|
|
84
93
|
timezoneID?: string;
|
|
85
94
|
/**
|
|
86
95
|
* Controls how tokens overflow when the container is too narrow.
|
|
@@ -112,6 +121,36 @@ export interface PowerSearchProps extends Omit<BaseProps<HTMLElement>, 'onChange
|
|
|
112
121
|
* Keys are operator value types (e.g. 'string', 'enum', 'date_absolute').
|
|
113
122
|
*/
|
|
114
123
|
components?: PowerSearchComponents;
|
|
124
|
+
/**
|
|
125
|
+
* Experimental options, outside the stable compatibility promise: anything
|
|
126
|
+
* in this object may change or be removed in a patch release. Omit it for
|
|
127
|
+
* the stable behavior.
|
|
128
|
+
* @experimental
|
|
129
|
+
*/
|
|
130
|
+
experimental?: {
|
|
131
|
+
/**
|
|
132
|
+
* How the field presents filter editing.
|
|
133
|
+
* - `'popover'`: the tokenizer field with its typeahead and the editor
|
|
134
|
+
* popover — the stable behavior.
|
|
135
|
+
* - `'bottom-sheet'`: the whole field is one trigger showing display-only
|
|
136
|
+
* filter tokens; it opens a stack of sheets. Filters lists the filters
|
|
137
|
+
* as rows that edit or remove one, with Add filter, Done, and Clear
|
|
138
|
+
* all, which asks first and keeps read-only filters. Add filter opens
|
|
139
|
+
* above it with the fields (or the content search with inline
|
|
140
|
+
* suggestions), and a value step opens above that, stages operator →
|
|
141
|
+
* value, and confirms from its footer. Dismissing a step reveals the
|
|
142
|
+
* one beneath. Suited to compact touch screens, where the editor
|
|
143
|
+
* popover competes with the software keyboard.
|
|
144
|
+
* - `'adaptive'`: the bottom sheet on compact coarse-pointer screens,
|
|
145
|
+
* otherwise the popover — the same resolution Selector uses.
|
|
146
|
+
*
|
|
147
|
+
* In the sheet presentation `menuWidth` and `tokenOverflowBehavior` have
|
|
148
|
+
* no surface to act on and warn in development.
|
|
149
|
+
* @experimental
|
|
150
|
+
* @default 'popover'
|
|
151
|
+
*/
|
|
152
|
+
presentation?: 'popover' | 'bottom-sheet' | 'adaptive';
|
|
153
|
+
};
|
|
115
154
|
}
|
|
116
155
|
/**
|
|
117
156
|
* Structured filter bar where each token represents a filter (field + operator + value).
|
|
@@ -179,7 +218,7 @@ export interface PowerSearchProps extends Omit<BaseProps<HTMLElement>, 'onChange
|
|
|
179
218
|
* };
|
|
180
219
|
* ```
|
|
181
220
|
*/
|
|
182
|
-
export declare function PowerSearch({ config: configProp, filters, onChange, label: labelFromProps, isLabelHidden, placeholder: placeholderFromProps, hasAutoFocus, hasClear, isReadOnly, isDisabled, disabledMessage, startIcon, onFocus, onBlur, status, statusVariant, menuWidth, maxTokenLength, maxOperatorMenuItems, maxSearchResults, popoverSaveButtonLabel: popoverSaveButtonLabelFromProps, timezoneID, tokenOverflowBehavior, endContent, resultCount, ref, handleRef, size: sizeProp, 'data-testid': testId, xstyle, className, style, components: componentOverrides, }: PowerSearchProps): React.JSX.Element;
|
|
221
|
+
export declare function PowerSearch({ config: configProp, filters, onChange, label: labelFromProps, isLabelHidden, placeholder: placeholderFromProps, hasAutoFocus, hasClear, isReadOnly, isDisabled, disabledMessage, startIcon, onFocus, onBlur, status, statusVariant, menuWidth, maxTokenLength, maxOperatorMenuItems, maxSearchResults, popoverSaveButtonLabel: popoverSaveButtonLabelFromProps, timezoneID, tokenOverflowBehavior, endContent, resultCount, ref, handleRef, size: sizeProp, 'data-testid': testId, xstyle, className, style, components: componentOverrides, experimental, }: PowerSearchProps): React.JSX.Element;
|
|
183
222
|
export declare namespace PowerSearch {
|
|
184
223
|
var displayName: string;
|
|
185
224
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PowerSearch.d.ts","sourceRoot":"","sources":["../../src/PowerSearch/PowerSearch.tsx"],"names":[],"mappings":"AAIA
|
|
1
|
+
{"version":3,"file":"PowerSearch.d.ts","sourceRoot":"","sources":["../../src/PowerSearch/PowerSearch.tsx"],"names":[],"mappings":"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"}
|