@base-ui/react 1.7.0 → 1.8.0

package/utils/popups/store.d.mts

@@ -73,8 +73,7 @@ export type PopupStoreState<Payload> = {
    */
   popupProps: HTMLProps;
 };
-export declare function createInitialPopupStoreState<Payload>(): PopupStoreState<Payload>;
-export declare function createPopupFloatingRootContext(triggerElements: PopupTriggerMap, floatingId?: string | undefined, nested?: boolean): FloatingRootStore;
+export declare function createInitialPopupStoreState<Payload>(triggerElements: PopupTriggerMap, floatingId?: string | undefined, nested?: boolean): PopupStoreState<Payload>;
 export type PopupStoreContext<ChangeEventDetails> = {
   /**
    * Map of registered trigger elements.
@@ -94,17 +93,20 @@ export type PopupStoreContext<ChangeEventDetails> = {
   onOpenChangeComplete: ((open: boolean) => void) | undefined;
 };
 type S = PopupStoreState<unknown>;
+declare const activeTriggerIdSelector: (state: S) => string | null;
+declare const openSelector: (state: S) => boolean;
+declare const popupIdSelector: (state: S) => string | undefined;
 export declare const popupStoreSelectors: {
-  open: (state: S) => boolean;
+  open: typeof openSelector;
   mounted: (state: S) => boolean;
   transitionStatus: (state: S) => TransitionStatus;
   floatingRootContext: (state: S) => FloatingRootStore;
   triggerCount: (state: S) => number;
   preventUnmountingOnClose: (state: S) => boolean;
   payload: (state: S) => unknown;
-  activeTriggerId: (state: S) => string | null;
+  activeTriggerId: typeof activeTriggerIdSelector;
   activeTriggerElement: (state: S) => Element | null;
-  popupId: (state: S) => string | undefined;
+  popupId: typeof popupIdSelector;
   /**
    * Whether the trigger with the given ID was used to open the popup.
    */

package/utils/popups/store.d.ts

@@ -73,8 +73,7 @@ export type PopupStoreState<Payload> = {
    */
   popupProps: HTMLProps;
 };
-export declare function createInitialPopupStoreState<Payload>(): PopupStoreState<Payload>;
-export declare function createPopupFloatingRootContext(triggerElements: PopupTriggerMap, floatingId?: string | undefined, nested?: boolean): FloatingRootStore;
+export declare function createInitialPopupStoreState<Payload>(triggerElements: PopupTriggerMap, floatingId?: string | undefined, nested?: boolean): PopupStoreState<Payload>;
 export type PopupStoreContext<ChangeEventDetails> = {
   /**
    * Map of registered trigger elements.
@@ -94,17 +93,20 @@ export type PopupStoreContext<ChangeEventDetails> = {
   onOpenChangeComplete: ((open: boolean) => void) | undefined;
 };
 type S = PopupStoreState<unknown>;
+declare const activeTriggerIdSelector: (state: S) => string | null;
+declare const openSelector: (state: S) => boolean;
+declare const popupIdSelector: (state: S) => string | undefined;
 export declare const popupStoreSelectors: {
-  open: (state: S) => boolean;
+  open: typeof openSelector;
   mounted: (state: S) => boolean;
   transitionStatus: (state: S) => TransitionStatus;
   floatingRootContext: (state: S) => FloatingRootStore;
   triggerCount: (state: S) => number;
   preventUnmountingOnClose: (state: S) => boolean;
   payload: (state: S) => unknown;
-  activeTriggerId: (state: S) => string | null;
+  activeTriggerId: typeof activeTriggerIdSelector;
   activeTriggerElement: (state: S) => Element | null;
-  popupId: (state: S) => string | undefined;
+  popupId: typeof popupIdSelector;
   /**
    * Whether the trigger with the given ID was used to open the popup.
    */

package/utils/popups/store.js

@@ -4,23 +4,31 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.createInitialPopupStoreState = createInitialPopupStoreState;
-exports.createPopupFloatingRootContext = createPopupFloatingRootContext;
 exports.popupStoreSelectors = void 0;
 var _empty = require("@base-ui/utils/empty");
 var _FloatingRootStore = require("../../floating-ui-react/components/FloatingRootStore");
-var _getEmptyRootContext = require("../../floating-ui-react/utils/getEmptyRootContext");
 /**
  * State common to all popup stores.
  */
 
-function createInitialPopupStoreState() {
+function createInitialPopupStoreState(triggerElements, floatingId, nested = false) {
   return {
     open: false,
     openProp: undefined,
     mounted: false,
     transitionStatus: undefined,
-    floatingRootContext: (0, _getEmptyRootContext.getEmptyRootContext)(),
-    floatingId: undefined,
+    floatingRootContext: new _FloatingRootStore.FloatingRootStore({
+      open: false,
+      transitionStatus: undefined,
+      floatingElement: null,
+      referenceElement: null,
+      triggerElements,
+      floatingId,
+      syncOnly: true,
+      nested,
+      onOpenChange: undefined
+    }),
+    floatingId,
     triggerCount: 0,
     preventUnmountingOnClose: false,
     payload: undefined,
@@ -34,19 +42,6 @@ function createInitialPopupStoreState() {
     popupProps: _empty.EMPTY_OBJECT
   };
 }
-function createPopupFloatingRootContext(triggerElements, floatingId, nested = false) {
-  return new _FloatingRootStore.FloatingRootStore({
-    open: false,
-    transitionStatus: undefined,
-    floatingElement: null,
-    referenceElement: null,
-    triggerElements,
-    floatingId,
-    syncOnly: true,
-    nested,
-    onOpenChange: undefined
-  });
-}
 const activeTriggerIdSelector = state => state.triggerIdProp ?? state.activeTriggerId;
 const openSelector = state => state.openProp ?? state.open;
 const popupIdSelector = state => {

package/utils/popups/store.mjs

@@ -1,19 +1,28 @@
 import { EMPTY_OBJECT } from '@base-ui/utils/empty';
 import { FloatingRootStore } from "../../floating-ui-react/components/FloatingRootStore.mjs";
-import { getEmptyRootContext } from "../../floating-ui-react/utils/getEmptyRootContext.mjs";
 
 /**
  * State common to all popup stores.
  */
 
-export function createInitialPopupStoreState() {
+export function createInitialPopupStoreState(triggerElements, floatingId, nested = false) {
   return {
     open: false,
     openProp: undefined,
     mounted: false,
     transitionStatus: undefined,
-    floatingRootContext: getEmptyRootContext(),
-    floatingId: undefined,
+    floatingRootContext: new FloatingRootStore({
+      open: false,
+      transitionStatus: undefined,
+      floatingElement: null,
+      referenceElement: null,
+      triggerElements,
+      floatingId,
+      syncOnly: true,
+      nested,
+      onOpenChange: undefined
+    }),
+    floatingId,
     triggerCount: 0,
     preventUnmountingOnClose: false,
     payload: undefined,
@@ -27,19 +36,6 @@ export function createInitialPopupStoreState() {
     popupProps: EMPTY_OBJECT
   };
 }
-export function createPopupFloatingRootContext(triggerElements, floatingId, nested = false) {
-  return new FloatingRootStore({
-    open: false,
-    transitionStatus: undefined,
-    floatingElement: null,
-    referenceElement: null,
-    triggerElements,
-    floatingId,
-    syncOnly: true,
-    nested,
-    onOpenChange: undefined
-  });
-}
 const activeTriggerIdSelector = state => state.triggerIdProp ?? state.activeTriggerId;
 const openSelector = state => state.openProp ?? state.open;
 const popupIdSelector = state => {

package/utils/scrollEdges.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.SCROLL_EDGE_TOLERANCE_PX = void 0;
 exports.getMaxScrollOffset = getMaxScrollOffset;
 exports.normalizeScrollOffset = normalizeScrollOffset;
-var _clamp = require("../internals/clamp");
+var _clamp = require("@base-ui/utils/clamp");
 const SCROLL_EDGE_TOLERANCE_PX = exports.SCROLL_EDGE_TOLERANCE_PX = 1;
 function getMaxScrollOffset(scrollSize, clientSize) {
   return Math.max(0, scrollSize - clientSize);

package/utils/scrollEdges.mjs

@@ -1,4 +1,4 @@
-import { clamp } from "../internals/clamp.mjs";
+import { clamp } from '@base-ui/utils/clamp';
 export const SCROLL_EDGE_TOLERANCE_PX = 1;
 export function getMaxScrollOffset(scrollSize, clientSize) {
   return Math.max(0, scrollSize - clientSize);

package/utils/styles.d.mts

@@ -1,4 +1,4 @@
 export declare const styleDisableScrollbar: {
   className: string;
-  getElement(nonce?: string): import("react/jsx-runtime").JSX.Element;
+  getElement(nonce?: string): import("react").JSX.Element;
 };

package/utils/styles.d.ts

@@ -1,4 +1,4 @@
 export declare const styleDisableScrollbar: {
   className: string;
-  getElement(nonce?: string): import("react/jsx-runtime").JSX.Element;
+  getElement(nonce?: string): import("react").JSX.Element;
 };

package/utils/usePopupAutoResize.js

@@ -13,6 +13,8 @@ var _useStableCallback = require("@base-ui/utils/useStableCallback");
 var _empty = require("@base-ui/utils/empty");
 var _useAnimationsFinished = require("../internals/useAnimationsFinished");
 var _getCssDimensions = require("./getCssDimensions");
+var CommonPopupCssVars = _interopRequireWildcard(require("./CommonPopupCssVars"));
+var CommonPositionerCssVars = _interopRequireWildcard(require("./CommonPositionerCssVars"));
 /**
  * Allows the element to automatically resize based on its content while supporting animations.
  */
@@ -54,8 +56,8 @@ function usePopupAutoResize(parameters) {
     const restorePopupTransform = overrideElementStyle(popupElement, 'transform', 'none');
     const restorePopupScale = overrideElementStyle(popupElement, 'scale', '1');
     const restorePositionerAvailableSize = applyElementStyles(positionerElement, {
-      '--available-width': 'max-content',
-      '--available-height': 'max-content'
+      [CommonPositionerCssVars.availableWidth]: 'max-content',
+      [CommonPositionerCssVars.availableHeight]: 'max-content'
     });
     function restoreMeasurementOverrides() {
       restorePopupPosition();
@@ -98,8 +100,8 @@ function usePopupAutoResize(parameters) {
     animationFrame.request(() => {
       setPopupCssSize(popupElement, newDimensions);
       runOnceAnimationsFinish(() => {
-        popupElement.style.setProperty('--popup-width', 'auto');
-        popupElement.style.setProperty('--popup-height', 'auto');
+        popupElement.style.setProperty(CommonPopupCssVars.popupWidth, 'auto');
+        popupElement.style.setProperty(CommonPopupCssVars.popupHeight, 'auto');
       }, abortController.signal);
     });
     return () => {
@@ -142,12 +144,12 @@ function applyElementStyles(element, styles) {
 function setPopupCssSize(popupElement, size) {
   const width = size === 'auto' ? 'auto' : `${size.width}px`;
   const height = size === 'auto' ? 'auto' : `${size.height}px`;
-  popupElement.style.setProperty('--popup-width', width);
-  popupElement.style.setProperty('--popup-height', height);
+  popupElement.style.setProperty(CommonPopupCssVars.popupWidth, width);
+  popupElement.style.setProperty(CommonPopupCssVars.popupHeight, height);
 }
 function setPositionerCssSize(positionerElement, size) {
   const width = size === 'max-content' ? 'max-content' : `${size.width}px`;
   const height = size === 'max-content' ? 'max-content' : `${size.height}px`;
-  positionerElement.style.setProperty('--positioner-width', width);
-  positionerElement.style.setProperty('--positioner-height', height);
+  positionerElement.style.setProperty(CommonPositionerCssVars.positionerWidth, width);
+  positionerElement.style.setProperty(CommonPositionerCssVars.positionerHeight, height);
 }

package/utils/usePopupAutoResize.mjs

@@ -7,6 +7,9 @@ import { useStableCallback } from '@base-ui/utils/useStableCallback';
 import { NOOP, EMPTY_OBJECT } from '@base-ui/utils/empty';
 import { useAnimationsFinished } from "../internals/useAnimationsFinished.mjs";
 import { getCssDimensions } from "./getCssDimensions.mjs";
+import * as CommonPopupCssVars from "./CommonPopupCssVars.mjs";
+import * as CommonPositionerCssVars from "./CommonPositionerCssVars.mjs";
+
 /**
  * Allows the element to automatically resize based on its content while supporting animations.
  */
@@ -48,8 +51,8 @@ export function usePopupAutoResize(parameters) {
     const restorePopupTransform = overrideElementStyle(popupElement, 'transform', 'none');
     const restorePopupScale = overrideElementStyle(popupElement, 'scale', '1');
     const restorePositionerAvailableSize = applyElementStyles(positionerElement, {
-      '--available-width': 'max-content',
-      '--available-height': 'max-content'
+      [CommonPositionerCssVars.availableWidth]: 'max-content',
+      [CommonPositionerCssVars.availableHeight]: 'max-content'
     });
     function restoreMeasurementOverrides() {
       restorePopupPosition();
@@ -92,8 +95,8 @@ export function usePopupAutoResize(parameters) {
     animationFrame.request(() => {
       setPopupCssSize(popupElement, newDimensions);
       runOnceAnimationsFinish(() => {
-        popupElement.style.setProperty('--popup-width', 'auto');
-        popupElement.style.setProperty('--popup-height', 'auto');
+        popupElement.style.setProperty(CommonPopupCssVars.popupWidth, 'auto');
+        popupElement.style.setProperty(CommonPopupCssVars.popupHeight, 'auto');
       }, abortController.signal);
     });
     return () => {
@@ -136,12 +139,12 @@ function applyElementStyles(element, styles) {
 function setPopupCssSize(popupElement, size) {
   const width = size === 'auto' ? 'auto' : `${size.width}px`;
   const height = size === 'auto' ? 'auto' : `${size.height}px`;
-  popupElement.style.setProperty('--popup-width', width);
-  popupElement.style.setProperty('--popup-height', height);
+  popupElement.style.setProperty(CommonPopupCssVars.popupWidth, width);
+  popupElement.style.setProperty(CommonPopupCssVars.popupHeight, height);
 }
 function setPositionerCssSize(positionerElement, size) {
   const width = size === 'max-content' ? 'max-content' : `${size.width}px`;
   const height = size === 'max-content' ? 'max-content' : `${size.height}px`;
-  positionerElement.style.setProperty('--positioner-width', width);
-  positionerElement.style.setProperty('--positioner-height', height);
+  positionerElement.style.setProperty(CommonPositionerCssVars.positionerWidth, width);
+  positionerElement.style.setProperty(CommonPositionerCssVars.positionerHeight, height);
 }

package/utils/usePopupViewport.js

@@ -19,10 +19,12 @@ var _useAnimationsFinished = require("../internals/useAnimationsFinished");
 var _usePopupAutoResize = require("./usePopupAutoResize");
 var _directionProvider = require("../direction-provider");
 var _adaptiveOriginMiddleware = require("./adaptiveOriginMiddleware");
+var CommonPopupCssVars = _interopRequireWildcard(require("./CommonPopupCssVars"));
+var CommonViewportDataAttributes = _interopRequireWildcard(require("./CommonViewportDataAttributes"));
 var _jsxRuntime = require("react/jsx-runtime");
 const popupViewportStateMapping = exports.popupViewportStateMapping = {
   activationDirection: value => value ? {
-    'data-activation-direction': value
+    [CommonViewportDataAttributes.activationDirection]: value
   } : null
 };
 /**
@@ -166,8 +168,8 @@ function usePopupViewport(parameters) {
         ref: previousContainerRef,
         style: {
           ...(previousContentDimensions ? {
-            '--popup-width': `${previousContentDimensions.width}px`,
-            '--popup-height': `${previousContentDimensions.height}px`
+            [CommonPopupCssVars.popupWidth]: `${previousContentDimensions.width}px`,
+            [CommonPopupCssVars.popupHeight]: `${previousContentDimensions.height}px`
           } : null),
           position: 'absolute'
         },

package/utils/usePopupViewport.mjs

@@ -12,10 +12,12 @@ import { useAnimationsFinished } from "../internals/useAnimationsFinished.mjs";
 import { usePopupAutoResize } from "./usePopupAutoResize.mjs";
 import { useDirection } from "../direction-provider/index.mjs";
 import { adaptiveOrigin } from "./adaptiveOriginMiddleware.mjs";
+import * as CommonPopupCssVars from "./CommonPopupCssVars.mjs";
+import * as CommonViewportDataAttributes from "./CommonViewportDataAttributes.mjs";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export const popupViewportStateMapping = {
   activationDirection: value => value ? {
-    'data-activation-direction': value
+    [CommonViewportDataAttributes.activationDirection]: value
   } : null
 };
 /**
@@ -159,8 +161,8 @@ export function usePopupViewport(parameters) {
         ref: previousContainerRef,
         style: {
           ...(previousContentDimensions ? {
-            '--popup-width': `${previousContentDimensions.width}px`,
-            '--popup-height': `${previousContentDimensions.height}px`
+            [CommonPopupCssVars.popupWidth]: `${previousContentDimensions.width}px`,
+            [CommonPopupCssVars.popupHeight]: `${previousContentDimensions.height}px`
           } : null),
           position: 'absolute'
         },

package/utils/useSwipeDismiss.d.mts

@@ -6,11 +6,6 @@ type SwipeProgressDetailsInternal = {
   direction: SwipeDirection | undefined;
 };
 export declare function getDisplacement(direction: SwipeDirection, deltaX: number, deltaY: number): number;
-export declare function getElementTransform(element: HTMLElement): {
-  x: number;
-  y: number;
-  scale: number;
-};
 export declare function useSwipeDismiss(options: UseSwipeDismissOptions): UseSwipeDismissReturnValue;
 export interface UseSwipeDismissState {}
 export interface UseSwipeDismissDetails {

package/utils/useSwipeDismiss.d.ts

@@ -6,11 +6,6 @@ type SwipeProgressDetailsInternal = {
   direction: SwipeDirection | undefined;
 };
 export declare function getDisplacement(direction: SwipeDirection, deltaX: number, deltaY: number): number;
-export declare function getElementTransform(element: HTMLElement): {
-  x: number;
-  y: number;
-  scale: number;
-};
 export declare function useSwipeDismiss(options: UseSwipeDismissOptions): UseSwipeDismissReturnValue;
 export interface UseSwipeDismissState {}
 export interface UseSwipeDismissDetails {

package/utils/useSwipeDismiss.js

@@ -6,15 +6,15 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getDisplacement = getDisplacement;
-exports.getElementTransform = getElementTransform;
 exports.useSwipeDismiss = useSwipeDismiss;
 var React = _interopRequireWildcard(require("react"));
 var _useStableCallback = require("@base-ui/utils/useStableCallback");
 var _owner = require("@base-ui/utils/owner");
+var _clamp = require("@base-ui/utils/clamp");
 var _utils = require("../floating-ui-react/utils");
 var _scrollable = require("./scrollable");
-var _clamp = require("../internals/clamp");
 var _getElementAtPoint = require("./getElementAtPoint");
+var _getElementTransform = require("./getElementTransform");
 const DEFAULT_SWIPE_THRESHOLD = 40;
 const REVERSE_CANCEL_THRESHOLD = 10;
 const MIN_DRAG_THRESHOLD = 1;
@@ -36,33 +36,6 @@ function getDisplacement(direction, deltaX, deltaY) {
       return 0;
   }
 }
-function getElementTransform(element) {
-  const computedStyle = (0, _owner.ownerWindow)(element).getComputedStyle(element);
-  const transform = computedStyle.transform;
-  let translateX = 0;
-  let translateY = 0;
-  let scale = 1;
-  if (transform && transform !== 'none') {
-    const matrix = transform.match(/matrix(?:3d)?\(([^)]+)\)/);
-    if (matrix) {
-      const values = matrix[1].split(', ').map(parseFloat);
-      if (values.length === 6) {
-        translateX = values[4];
-        translateY = values[5];
-        scale = Math.sqrt(values[0] * values[0] + values[1] * values[1]);
-      } else if (values.length === 16) {
-        translateX = values[12];
-        translateY = values[13];
-        scale = values[0];
-      }
-    }
-  }
-  return {
-    x: translateX,
-    y: translateY,
-    scale
-  };
-}
 function getValidTimeStamp(timeStamp) {
   return Number.isFinite(timeStamp) && timeStamp > 0 ? timeStamp : null;
 }
@@ -331,13 +304,21 @@ function useSwipeDismiss(options) {
     return target;
   }
   function findGestureScrollableTouchTarget(target, root) {
+    // The swiped element is positioned relative to the viewport, so the page scroller must not
+    // gate the gesture (a reset like `html, body { height: 100%; overflow: auto }` makes `body`
+    // a real scroll container). The drawer viewport's native touchmove handler already ignores it.
+    const find = axis => {
+      const scrollTarget = (0, _scrollable.findScrollableTouchTarget)(target, root, axis);
+      const doc = (0, _owner.ownerDocument)(scrollTarget);
+      return scrollTarget === doc.body || scrollTarget === doc.documentElement ? null : scrollTarget;
+    };
     if (hasHorizontal && !hasVertical) {
-      return (0, _scrollable.findScrollableTouchTarget)(target, root, 'horizontal');
+      return find('horizontal');
     }
     if (hasVertical && !hasHorizontal) {
-      return (0, _scrollable.findScrollableTouchTarget)(target, root, 'vertical');
+      return find('vertical');
     }
-    return (0, _scrollable.findScrollableTouchTarget)(target, root, 'vertical') ?? (0, _scrollable.findScrollableTouchTarget)(target, root, 'horizontal');
+    return find('vertical') ?? find('horizontal');
   }
   function startSwipeAtPosition(event, position, startOptions) {
     swipeFromScrollableRef.current = false;
@@ -377,7 +358,7 @@ function useSwipeDismiss(options) {
         height: element.offsetHeight
       };
       resolveSwipeThreshold(primaryDirection);
-      const transform = getElementTransform(element);
+      const transform = (0, _getElementTransform.getElementTransform)(element);
       initialTransformRef.current = transform;
       dragOffsetRef.current = {
         x: transform.x,

package/utils/useSwipeDismiss.mjs

@@ -2,11 +2,12 @@
 
 import * as React from 'react';
 import { useStableCallback } from '@base-ui/utils/useStableCallback';
-import { ownerDocument, ownerWindow } from '@base-ui/utils/owner';
+import { ownerDocument } from '@base-ui/utils/owner';
+import { clamp } from '@base-ui/utils/clamp';
 import { contains, getTarget } from "../floating-ui-react/utils.mjs";
 import { findScrollableTouchTarget, hasScrollableAncestor } from "./scrollable.mjs";
-import { clamp } from "../internals/clamp.mjs";
 import { getElementAtPoint } from "./getElementAtPoint.mjs";
+import { getElementTransform } from "./getElementTransform.mjs";
 const DEFAULT_SWIPE_THRESHOLD = 40;
 const REVERSE_CANCEL_THRESHOLD = 10;
 const MIN_DRAG_THRESHOLD = 1;
@@ -28,33 +29,6 @@ export function getDisplacement(direction, deltaX, deltaY) {
       return 0;
   }
 }
-export function getElementTransform(element) {
-  const computedStyle = ownerWindow(element).getComputedStyle(element);
-  const transform = computedStyle.transform;
-  let translateX = 0;
-  let translateY = 0;
-  let scale = 1;
-  if (transform && transform !== 'none') {
-    const matrix = transform.match(/matrix(?:3d)?\(([^)]+)\)/);
-    if (matrix) {
-      const values = matrix[1].split(', ').map(parseFloat);
-      if (values.length === 6) {
-        translateX = values[4];
-        translateY = values[5];
-        scale = Math.sqrt(values[0] * values[0] + values[1] * values[1]);
-      } else if (values.length === 16) {
-        translateX = values[12];
-        translateY = values[13];
-        scale = values[0];
-      }
-    }
-  }
-  return {
-    x: translateX,
-    y: translateY,
-    scale
-  };
-}
 function getValidTimeStamp(timeStamp) {
   return Number.isFinite(timeStamp) && timeStamp > 0 ? timeStamp : null;
 }
@@ -323,13 +297,21 @@ export function useSwipeDismiss(options) {
     return target;
   }
   function findGestureScrollableTouchTarget(target, root) {
+    // The swiped element is positioned relative to the viewport, so the page scroller must not
+    // gate the gesture (a reset like `html, body { height: 100%; overflow: auto }` makes `body`
+    // a real scroll container). The drawer viewport's native touchmove handler already ignores it.
+    const find = axis => {
+      const scrollTarget = findScrollableTouchTarget(target, root, axis);
+      const doc = ownerDocument(scrollTarget);
+      return scrollTarget === doc.body || scrollTarget === doc.documentElement ? null : scrollTarget;
+    };
     if (hasHorizontal && !hasVertical) {
-      return findScrollableTouchTarget(target, root, 'horizontal');
+      return find('horizontal');
     }
     if (hasVertical && !hasHorizontal) {
-      return findScrollableTouchTarget(target, root, 'vertical');
+      return find('vertical');
     }
-    return findScrollableTouchTarget(target, root, 'vertical') ?? findScrollableTouchTarget(target, root, 'horizontal');
+    return find('vertical') ?? find('horizontal');
   }
   function startSwipeAtPosition(event, position, startOptions) {
     swipeFromScrollableRef.current = false;

package/internals/areArraysEqual.d.mts

@@ -1,3 +0,0 @@
-type ItemComparer<Item> = (a: Item, b: Item) => boolean;
-export declare function areArraysEqual<Item>(array1: ReadonlyArray<Item>, array2: ReadonlyArray<Item>, itemComparer?: ItemComparer<Item>): boolean;
-export {};

package/internals/areArraysEqual.d.ts

@@ -1,3 +0,0 @@
-type ItemComparer<Item> = (a: Item, b: Item) => boolean;
-export declare function areArraysEqual<Item>(array1: ReadonlyArray<Item>, array2: ReadonlyArray<Item>, itemComparer?: ItemComparer<Item>): boolean;
-export {};

package/internals/areArraysEqual.js

@@ -1,9 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.areArraysEqual = areArraysEqual;
-function areArraysEqual(array1, array2, itemComparer = (a, b) => a === b) {
-  return array1.length === array2.length && array1.every((value, index) => itemComparer(value, array2[index]));
-}

package/internals/areArraysEqual.mjs

@@ -1,3 +0,0 @@
-export function areArraysEqual(array1, array2, itemComparer = (a, b) => a === b) {
-  return array1.length === array2.length && array1.every((value, index) => itemComparer(value, array2[index]));
-}

package/internals/clamp.d.mts

@@ -1 +0,0 @@
-export declare function clamp(val: number, min?: number, max?: number): number;

package/internals/clamp.d.ts

@@ -1 +0,0 @@
-export declare function clamp(val: number, min?: number, max?: number): number;

package/internals/clamp.js

@@ -1,9 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.clamp = clamp;
-function clamp(val, min = Number.MIN_SAFE_INTEGER, max = Number.MAX_SAFE_INTEGER) {
-  return Math.max(min, Math.min(val, max));
-}

package/internals/clamp.mjs

@@ -1,3 +0,0 @@
-export function clamp(val, min = Number.MIN_SAFE_INTEGER, max = Number.MAX_SAFE_INTEGER) {
-  return Math.max(min, Math.min(val, max));
-}

package/internals/shadowDom.d.mts

@@ -1,3 +0,0 @@
-export declare function activeElement(doc: Document): Element | null;
-export declare function contains(parent?: Element | null, child?: Element | null): boolean;
-export declare function getTarget(event: Event): EventTarget | null;

package/internals/shadowDom.d.ts

@@ -1,3 +0,0 @@
-export declare function activeElement(doc: Document): Element | null;
-export declare function contains(parent?: Element | null, child?: Element | null): boolean;
-export declare function getTarget(event: Event): EventTarget | null;

package/internals/shadowDom.js

@@ -1,48 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.activeElement = activeElement;
-exports.contains = contains;
-exports.getTarget = getTarget;
-var _dom = require("@floating-ui/utils/dom");
-function activeElement(doc) {
-  let element = doc.activeElement;
-  while (element?.shadowRoot?.activeElement != null) {
-    element = element.shadowRoot.activeElement;
-  }
-  return element;
-}
-function contains(parent, child) {
-  if (!parent || !child) {
-    return false;
-  }
-  const rootNode = child.getRootNode?.();
-
-  // First, attempt with the faster native method.
-  if (parent.contains(child)) {
-    return true;
-  }
-
-  // Then fall back to traversing out of shadow roots when needed.
-  if (rootNode && (0, _dom.isShadowRoot)(rootNode)) {
-    let next = child;
-    while (next) {
-      if (parent === next) {
-        return true;
-      }
-      next = next.parentNode || next.host;
-    }
-  }
-  return false;
-}
-function getTarget(event) {
-  if ('composedPath' in event) {
-    return event.composedPath()[0];
-  }
-
-  // TS assumes `composedPath()` always exists, but older browsers without
-  // shadow DOM support still fall back to `target`.
-  return event.target;
-}