@jobber/components 8.26.3 → 8.27.1

package/dist/unstyledPrimitives/index.cjs

@@ -10,18 +10,19 @@ var DrawerDescription = require('../DrawerDescription-cjs.js');
 var DrawerTitle = require('../DrawerTitle-cjs.js');
 var ScrollAreaViewport = require('../ScrollAreaViewport-cjs.js');
 var useRenderElement = require('../useRenderElement-cjs.js');
+var useScrollLock = require('../useScrollLock-cjs.js');
 var floatingUi_utils_dom = require('../floating-ui.utils.dom-cjs.js');
 var clamp = require('../clamp-cjs.js');
-var useScrollLock = require('../useScrollLock-cjs.js');
-var ReactDOM = require('react-dom');
 var MenuSubmenuTrigger = require('../MenuSubmenuTrigger-cjs.js');
 var useCompositeListItem = require('../useCompositeListItem-cjs.js');
+var ReactDOM = require('react-dom');
 var SelectGroupLabel = require('../SelectGroupLabel-cjs.js');
 var floatingUi_utils = require('../floating-ui.utils-cjs.js');
 var NumberFieldInput = require('../NumberFieldInput-cjs.js');
 var useLabelableId = require('../useLabelableId-cjs.js');
 var useLabel = require('../useLabel-cjs.js');
 var scrollEdges = require('../scrollEdges-cjs.js');
+require('../stringifyLocale-cjs.js');
 require('../isElementDisabled-cjs.js');
 require('../floating-ui.react-dom-cjs.js');
 
@@ -216,7 +217,7 @@ var index_parts$6 = /*#__PURE__*/Object.freeze({
   Root: ScrollAreaViewport.DialogRoot,
   Title: DrawerTitle.DialogTitle,
   Trigger: ScrollAreaViewport.DialogTrigger,
-  Viewport: DrawerDescription.DialogViewport,
+  Viewport: ScrollAreaViewport.DialogViewport,
   createHandle: DrawerDescription.createDialogHandle
 });
 
@@ -419,1198 +420,188 @@ function createVisualStateStore() {
   };
 }
 
-function isScrollable(element, axis,
-// When true, a container that overflows only once extra space is added (e.g. drawer
-// keyboard scroll slack) still counts, as long as it has layout size on the axis.
-allowOverflowIntent = false) {
-  const style = floatingUi_utils_dom.getComputedStyle(element);
-  if (axis === 'vertical') {
-    const overflowY = style.overflowY;
-    if (overflowY !== 'auto' && overflowY !== 'scroll') {
-      return false;
-    }
-    return allowOverflowIntent ? element.clientHeight > 0 : element.scrollHeight > element.clientHeight;
-  }
-  const overflowX = style.overflowX;
-  if (overflowX !== 'auto' && overflowX !== 'scroll') {
-    return false;
-  }
-  return allowOverflowIntent ? element.clientWidth > 0 : element.scrollWidth > element.clientWidth;
-}
-function hasScrollableAncestor(target, root, axes) {
-  // `getParentNode` crosses shadow boundaries (and slots), so a target inside a shadow root
-  // still walks up to scrollable ancestors in the light DOM.
-  let node = target;
-  while (floatingUi_utils_dom.isHTMLElement(node) && node !== root && !floatingUi_utils_dom.isLastTraversableNode(node)) {
-    for (const axis of axes) {
-      if (isScrollable(node, axis)) {
-        return true;
-      }
-    }
-    node = floatingUi_utils_dom.getParentNode(node);
-  }
-  return false;
-}
-function findScrollableTouchTarget(target, root, axis = 'vertical', allowOverflowIntent = false) {
-  // `getParentNode` crosses shadow boundaries (and slots), so a target inside a shadow root
-  // still reaches a scrollable ancestor in the light DOM.
-  let node = floatingUi_utils_dom.isHTMLElement(target) ? target : null;
-  while (floatingUi_utils_dom.isHTMLElement(node) && node !== root && !floatingUi_utils_dom.isLastTraversableNode(node)) {
-    if (isScrollable(node, axis, allowOverflowIntent)) {
-      return node;
-    }
-    node = floatingUi_utils_dom.getParentNode(node);
-  }
-  return isScrollable(root, axis, allowOverflowIntent) ? root : null;
-}
-
-function getElementAtPoint(doc, x, y) {
-  return typeof doc?.elementFromPoint === 'function' ? doc.elementFromPoint(x, y) : null;
-}
+let DrawerSwipeAreaDataAttributes = function (DrawerSwipeAreaDataAttributes) {
+  /**
+   * Present when the drawer is open.
+   */
+  DrawerSwipeAreaDataAttributes[DrawerSwipeAreaDataAttributes["open"] = useScrollLock.CommonPopupDataAttributes.open] = "open";
+  /**
+   * Present when the drawer is closed.
+   */
+  DrawerSwipeAreaDataAttributes[DrawerSwipeAreaDataAttributes["closed"] = useScrollLock.CommonPopupDataAttributes.closed] = "closed";
+  /**
+   * Present when the swipe area is disabled.
+   */
+  DrawerSwipeAreaDataAttributes["disabled"] = "data-disabled";
+  /**
+   * Indicates the swipe direction.
+   * @type {'up' | 'down' | 'left' | 'right'}
+   */
+  DrawerSwipeAreaDataAttributes["swipeDirection"] = "data-swipe-direction";
+  /**
+   * Present when the drawer is being swiped.
+   */
+  DrawerSwipeAreaDataAttributes["swiping"] = "data-swiping";
+  return DrawerSwipeAreaDataAttributes;
+}({});
 
-const DEFAULT_SWIPE_THRESHOLD = 40;
-const REVERSE_CANCEL_THRESHOLD = 10;
-const MIN_DRAG_THRESHOLD = 1;
-const MIN_VELOCITY_DURATION_MS = 50;
-const MIN_RELEASE_VELOCITY_DURATION_MS = 16;
-const MAX_RELEASE_VELOCITY_AGE_MS = 80;
-const DEFAULT_IGNORE_SELECTOR = 'button,a,input,select,textarea,label,[role="button"]';
-function getDisplacement(direction, deltaX, deltaY) {
-  switch (direction) {
-    case 'up':
-      return -deltaY;
-    case 'down':
-      return deltaY;
-    case 'left':
-      return -deltaX;
-    case 'right':
-      return deltaX;
-    default:
-      return 0;
-  }
-}
-function getElementTransform(element) {
-  const computedStyle = floatingUi_utils_dom.getWindow(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;
-}
-function getDragTransform(dragOffset, scale) {
-  return `translate3d(${dragOffset.x}px,${dragOffset.y}px,0) scale(${scale})`;
-}
-function hasPrimaryMouseButton(buttons) {
-  return buttons % 2 === 1;
-}
-function safelyChangePointerCapture(element, pointerId, method) {
-  const pointerCaptureMethod = element[method];
-  if (typeof pointerCaptureMethod !== 'function') {
-    return;
-  }
-  try {
-    pointerCaptureMethod.call(element, pointerId);
-  } catch (error) {
-    if (error && typeof error === 'object' && 'name' in error && error.name === 'NotFoundError') {
-      return;
-    }
-    throw error;
+const DEFAULT_SWIPE_OPEN_RATIO = 0.5;
+const MIN_SWIPE_START_DISTANCE = 1;
+const VELOCITY_THRESHOLD = 0.1;
+const FALLBACK_SWIPE_OPEN_THRESHOLD = 40;
+const SWIPE_AREA_OPEN_HOOK = {
+  [DrawerSwipeAreaDataAttributes.open]: ''
+};
+const SWIPE_AREA_CLOSED_HOOK = {
+  [DrawerSwipeAreaDataAttributes.closed]: ''
+};
+const SWIPE_AREA_SWIPING_HOOK = {
+  [DrawerSwipeAreaDataAttributes.swiping]: ''
+};
+const SWIPE_AREA_DISABLED_HOOK = {
+  [DrawerSwipeAreaDataAttributes.disabled]: ''
+};
+const stateAttributesMapping$3 = {
+  open(value) {
+    return value ? SWIPE_AREA_OPEN_HOOK : SWIPE_AREA_CLOSED_HOOK;
+  },
+  swiping(value) {
+    return value ? SWIPE_AREA_SWIPING_HOOK : null;
+  },
+  swipeDirection(value) {
+    return value ? {
+      [DrawerSwipeAreaDataAttributes.swipeDirection]: value
+    } : null;
+  },
+  disabled(value) {
+    return value ? SWIPE_AREA_DISABLED_HOOK : null;
   }
+};
+const oppositeSwipeDirection = {
+  up: 'down',
+  down: 'up',
+  left: 'right',
+  right: 'left'
+};
+function resolveTouchAction(direction) {
+  return direction === 'left' || direction === 'right' ? 'pan-y' : 'pan-x';
 }
-function useSwipeDismiss(options) {
+
+/**
+ * An invisible area that listens for swipe gestures to open the drawer.
+ * Renders a `<div>` element.
+ *
+ * Documentation: [Base UI Drawer](https://base-ui.com/react/components/drawer)
+ */
+const DrawerSwipeArea = /*#__PURE__*/React__namespace.forwardRef(function DrawerSwipeArea(componentProps, forwardedRef) {
   const {
-    enabled,
-    directions,
-    elementRef,
-    movementCssVars,
-    canStart,
-    ignoreSelectorWhenTouch = true,
-    ignoreScrollableAncestors = false,
-    swipeThreshold: swipeThresholdProp,
-    onDismiss,
-    onProgress,
-    onCancel,
-    onSwipeStart,
-    onRelease,
-    onSwipingChange,
-    trackDrag = true
-  } = options;
-  const ignoreSelector = DEFAULT_IGNORE_SELECTOR;
-  const primaryDirection = directions.length === 1 ? directions[0] : undefined;
-  const swipeThresholdDefault = Math.max(0, typeof swipeThresholdProp === 'number' ? swipeThresholdProp : DEFAULT_SWIPE_THRESHOLD);
-  const allowLeft = directions.includes('left');
-  const allowRight = directions.includes('right');
-  const allowUp = directions.includes('up');
-  const allowDown = directions.includes('down');
-  const hasHorizontal = allowLeft || allowRight;
-  const hasVertical = allowUp || allowDown;
-  const scrollAxes = React__namespace.useMemo(() => {
-    const axes = [];
-    if (hasVertical) {
-      axes.push('vertical');
-    }
-    if (hasHorizontal) {
-      axes.push('horizontal');
-    }
-    return axes;
-  }, [hasHorizontal, hasVertical]);
-  const [currentSwipeDirection, setCurrentSwipeDirection] = React__namespace.useState(undefined);
-  const [isSwiping, setIsSwiping] = React__namespace.useState(false);
-  const [dragDismissed, setDragDismissed] = React__namespace.useState(false);
-  const dragStartPosRef = React__namespace.useRef({
-    x: 0,
-    y: 0
-  });
-  const dragOffsetRef = React__namespace.useRef({
-    x: 0,
-    y: 0
-  });
-  const lastMovePosRef = React__namespace.useRef(null);
-  const initialTransformRef = React__namespace.useRef({
-    x: 0,
-    y: 0,
-    scale: 1
-  });
-  const intendedSwipeDirectionRef = React__namespace.useRef(undefined);
-  const maxSwipeDisplacementRef = React__namespace.useRef(0);
-  const cancelledSwipeRef = React__namespace.useRef(false);
-  const swipeCancelBaselineRef = React__namespace.useRef({
-    x: 0,
-    y: 0
-  });
-  const lockedDirectionRef = React__namespace.useRef(null);
-  const isFirstPointerMoveRef = React__namespace.useRef(false);
-  const pendingSwipeRef = React__namespace.useRef(false);
-  const pendingSwipeStartPosRef = React__namespace.useRef(null);
-  const swipeFromScrollableRef = React__namespace.useRef(false);
-  const sawPrimaryButtonsOnMoveRef = React__namespace.useRef(false);
-  const elementSizeRef = React__namespace.useRef({
-    width: 0,
-    height: 0
-  });
-  const swipeProgressRef = React__namespace.useRef(0);
-  const swipeThresholdRef = React__namespace.useRef(swipeThresholdDefault);
-  const swipeStartTimeRef = React__namespace.useRef(null);
-  const lastDragSampleRef = React__namespace.useRef(null);
-  const lastDragVelocityRef = React__namespace.useRef({
+    render,
+    className,
+    style,
+    disabled = false,
+    swipeDirection: swipeDirectionProp,
+    ...elementProps
+  } = componentProps;
+  const {
+    store
+  } = ScrollAreaViewport.useDialogRootContext();
+  const {
+    swipeDirection,
+    frontmostHeight
+  } = ScrollAreaViewport.useDrawerRootContext();
+  const providerContext = ScrollAreaViewport.useDrawerProviderContext();
+  const [swipeActive, setSwipeActive] = React__namespace.useState(false);
+  const releaseDismissTimeout = useButton.useTimeout();
+  const swipeAreaRef = React__namespace.useRef(null);
+  const swipeStartEventRef = React__namespace.useRef(null);
+  const openedBySwipeRef = React__namespace.useRef(false);
+  const dragDeltaRef = React__namespace.useRef({
     x: 0,
     y: 0
   });
-  const lastProgressDetailsRef = React__namespace.useRef(null);
-  const isSwipingRef = React__namespace.useRef(false);
-  const dragStyleSnapshotRef = React__namespace.useRef(null);
-  const setSwiping = useButton.useStableCallback(nextSwiping => {
-    if (isSwipingRef.current === nextSwiping) {
-      return;
-    }
-    isSwipingRef.current = nextSwiping;
-    setIsSwiping(nextSwiping);
-    onSwipingChange?.(nextSwiping);
+  const closedOffsetRef = React__namespace.useRef(null);
+  const appliedSwipeStylesRef = React__namespace.useRef(false);
+  const popupTransitionRef = React__namespace.useRef(null);
+  const swipeAreaId = useButton.useBaseUiId(componentProps.id);
+  const registerTrigger = useScrollLock.useTriggerRegistration(swipeAreaId, store);
+  const open = store.useState('open');
+  const resetDragDelta = useButton.useStableCallback(() => {
+    dragDeltaRef.current.x = 0;
+    dragDeltaRef.current.y = 0;
   });
-  function resolveSwipeThreshold(direction) {
-    if (!direction) {
-      return;
-    }
-    if (typeof swipeThresholdProp !== 'function') {
-      swipeThresholdRef.current = swipeThresholdDefault;
-      return;
-    }
-    const element = elementRef.current;
-    if (!element) {
-      return;
-    }
-    const value = swipeThresholdProp({
-      element,
-      direction
+  const resolvedSwipeDirection = swipeDirectionProp ?? oppositeSwipeDirection[swipeDirection];
+  const dismissDirection = oppositeSwipeDirection[resolvedSwipeDirection];
+  const enabled = !disabled && (!open || swipeActive);
+  function disableDismissForSwipe() {
+    releaseDismissTimeout.clear();
+    store.context.outsidePressEnabledRef.current = false;
+  }
+  function enableDismissAfterRelease() {
+    // Safari can dispatch outside-press for the same swipe-open gesture
+    // after release, so defer re-enabling dismissal to the next macrotask.
+    releaseDismissTimeout.start(0, () => {
+      store.context.outsidePressEnabledRef.current = true;
     });
-    swipeThresholdRef.current = Math.max(0, value);
   }
-  const updateSwipeProgress = useButton.useStableCallback((progress, details) => {
-    const nextProgress = Number.isFinite(progress) ? clamp.clamp(progress, 0, 1) : 0;
-    const progressChanged = nextProgress !== swipeProgressRef.current;
-    let detailsChanged = false;
-    if (details) {
-      const lastDetails = lastProgressDetailsRef.current;
-      detailsChanged = !lastDetails || lastDetails.deltaX !== details.deltaX || lastDetails.deltaY !== details.deltaY || lastDetails.direction !== details.direction;
-    }
-    if (!progressChanged && !detailsChanged) {
-      return;
-    }
-    swipeProgressRef.current = nextProgress;
-    if (details) {
-      lastProgressDetailsRef.current = details;
-    } else if (progressChanged) {
-      lastProgressDetailsRef.current = null;
-    }
-    onProgress?.(nextProgress, details);
-  });
-  const syncDragStyles = useButton.useStableCallback(swiping => {
-    const element = elementRef.current;
-    if (!trackDrag || !element) {
-      if (!swiping) {
-        dragStyleSnapshotRef.current = null;
-      }
-      return;
-    }
-    const style = element.style;
-    const dragStyleSnapshot = dragStyleSnapshotRef.current;
-    if (swiping) {
-      if (!dragStyleSnapshot) {
-        dragStyleSnapshotRef.current = [style.transition, style.transform];
-      }
-      style.transition = 'none';
-    } else if (dragStyleSnapshot) {
-      [style.transition, style.transform] = dragStyleSnapshot;
-      dragStyleSnapshotRef.current = null;
-    }
-    const dragOffset = dragOffsetRef.current;
-    const initialTransform = initialTransformRef.current;
-    const deltaX = dragOffset.x - initialTransform.x;
-    const deltaY = dragOffset.y - initialTransform.y;
-    if (swiping) {
-      style.transform = getDragTransform(dragOffset, initialTransform.scale);
-    }
-    style.setProperty(movementCssVars.x, `${deltaX}px`);
-    style.setProperty(movementCssVars.y, `${deltaY}px`);
-  });
-  function recordDragSample(offset, timeStamp) {
-    if (timeStamp === null) {
-      return;
+  function resolvePopupSize() {
+    const popupElement = store.context.popupRef.current;
+    if (!popupElement) {
+      return null;
     }
-    const lastSample = lastDragSampleRef.current;
-    if (lastSample && timeStamp > lastSample.time) {
-      const durationMs = Math.max(timeStamp - lastSample.time, MIN_RELEASE_VELOCITY_DURATION_MS);
-      lastDragVelocityRef.current = {
-        x: (offset.x - lastSample.x) / durationMs,
-        y: (offset.y - lastSample.y) / durationMs
-      };
+    const isHorizontal = dismissDirection === 'left' || dismissDirection === 'right';
+    const size = isHorizontal ? popupElement.offsetWidth : popupElement.offsetHeight;
+    if (size <= 0) {
+      return null;
     }
-    lastDragSampleRef.current = {
-      x: offset.x,
-      y: offset.y,
-      time: timeStamp
-    };
+    return size;
   }
-  const reset = React__namespace.useCallback(() => {
-    setCurrentSwipeDirection(undefined);
-    setSwiping(false);
-    setDragDismissed(false);
-    updateSwipeProgress(0);
-    swipeThresholdRef.current = swipeThresholdDefault;
-    dragStartPosRef.current = {
-      x: 0,
-      y: 0
-    };
-    dragOffsetRef.current = {
-      x: 0,
-      y: 0
-    };
-    initialTransformRef.current = {
-      x: 0,
-      y: 0,
-      scale: 1
-    };
-    intendedSwipeDirectionRef.current = undefined;
-    maxSwipeDisplacementRef.current = 0;
-    cancelledSwipeRef.current = false;
-    swipeCancelBaselineRef.current = {
-      x: 0,
-      y: 0
-    };
-    lockedDirectionRef.current = null;
-    isFirstPointerMoveRef.current = false;
-    lastMovePosRef.current = null;
-    pendingSwipeRef.current = false;
-    pendingSwipeStartPosRef.current = null;
-    swipeFromScrollableRef.current = false;
-    sawPrimaryButtonsOnMoveRef.current = false;
-    elementSizeRef.current = {
-      width: 0,
-      height: 0
-    };
-    swipeStartTimeRef.current = null;
-    lastDragSampleRef.current = null;
-    lastDragVelocityRef.current = {
-      x: 0,
-      y: 0
-    };
-    lastProgressDetailsRef.current = null;
-    syncDragStyles(false);
-  }, [setSwiping, swipeThresholdDefault, syncDragStyles, updateSwipeProgress]);
-  React__namespace.useEffect(() => {
-    if (typeof swipeThresholdProp !== 'function') {
-      swipeThresholdRef.current = swipeThresholdDefault;
+  function resolveClosedOffset() {
+    const offset = resolvePopupSize();
+    if (offset == null) {
+      return null;
     }
-  }, [swipeThresholdDefault, swipeThresholdProp]);
-  function getPrimaryPointerPosition(event) {
-    if ('touches' in event) {
-      const touch = event.touches[0];
-      return touch ? {
-        x: touch.clientX,
-        y: touch.clientY
-      } : null;
+    const popupElement = store.context.popupRef.current;
+    if (!popupElement) {
+      return offset;
     }
-    return {
-      x: event.clientX,
-      y: event.clientY
-    };
-  }
-  function isTouchLikeEvent(event) {
-    if ('touches' in event) {
-      return true;
+    const isHorizontal = dismissDirection === 'left' || dismissDirection === 'right';
+    const transform = ScrollAreaViewport.getElementTransform(popupElement);
+    const transformOffset = isHorizontal ? transform.x : transform.y;
+    if (Number.isFinite(transformOffset) && Math.abs(transformOffset) > 0.5) {
+      return Math.min(offset, Math.abs(transformOffset));
     }
-    return event.pointerType === 'touch';
-  }
-  function getTargetAtPoint(position, nativeEvent) {
-    const doc = useButton.ownerDocument(elementRef.current);
-    const elementAtPoint = getElementAtPoint(doc, position.x, position.y);
-    const target = elementAtPoint ?? useButton.getTarget(nativeEvent);
-    return target;
+    return offset;
   }
-  function findGestureScrollableTouchTarget(target, root) {
-    if (hasHorizontal && !hasVertical) {
-      return findScrollableTouchTarget(target, root, 'horizontal');
-    }
-    if (hasVertical && !hasHorizontal) {
-      return findScrollableTouchTarget(target, root, 'vertical');
+  function resolveSwipeOpenThreshold() {
+    const popupSize = resolvePopupSize();
+    if (popupSize == null) {
+      return FALLBACK_SWIPE_OPEN_THRESHOLD;
     }
-    return findScrollableTouchTarget(target, root, 'vertical') ?? findScrollableTouchTarget(target, root, 'horizontal');
+    return popupSize * DEFAULT_SWIPE_OPEN_RATIO;
   }
-  function startSwipeAtPosition(event, position, startOptions) {
-    swipeFromScrollableRef.current = false;
-    const touchLike = isTouchLikeEvent(event);
-    const target = getTargetAtPoint(position, event.nativeEvent);
-    const doc = useButton.ownerDocument(elementRef.current);
-    const body = doc.body;
-    const scrollableTarget = touchLike && body ? findGestureScrollableTouchTarget(target, body) : null;
-    const ignoreScrollableTarget = startOptions?.ignoreScrollableTarget ?? false;
-    if (scrollableTarget && !ignoreScrollableTarget) {
-      return false;
+  function applySwipeMovement() {
+    if (!swipeActive) {
+      return;
     }
-    swipeFromScrollableRef.current = Boolean(scrollableTarget && ignoreScrollableTarget);
-    const isInteractiveElement = target ? target.closest(ignoreSelector) : false;
-    if (isInteractiveElement && (!touchLike || ignoreSelectorWhenTouch)) {
-      return false;
+    const popupElement = store.context.popupRef.current;
+    if (!popupElement) {
+      return;
     }
-    const element = elementRef.current;
-    if (ignoreScrollableAncestors && element && target && scrollAxes.length > 0) {
-      const ignoreAncestors = startOptions?.ignoreScrollableAncestors ?? false;
-      if (!ignoreAncestors && hasScrollableAncestor(target, element, scrollAxes)) {
-        return false;
-      }
+    if (!store.select('open') || !store.select('mounted')) {
+      return;
     }
-    cancelledSwipeRef.current = false;
-    intendedSwipeDirectionRef.current = undefined;
-    maxSwipeDisplacementRef.current = 0;
-    dragStartPosRef.current = position;
-    swipeStartTimeRef.current = getValidTimeStamp(event.timeStamp);
-    swipeCancelBaselineRef.current = position;
-    lastMovePosRef.current = position;
-    if (element) {
-      elementSizeRef.current = {
-        width: element.offsetWidth,
-        height: element.offsetHeight
-      };
-      resolveSwipeThreshold(primaryDirection);
-      const transform = getElementTransform(element);
-      initialTransformRef.current = transform;
-      dragOffsetRef.current = {
-        x: transform.x,
-        y: transform.y
-      };
-      recordDragSample({
-        x: transform.x,
-        y: transform.y
-      }, swipeStartTimeRef.current);
-      if (!('touches' in event)) {
-        safelyChangePointerCapture(element, event.pointerId, 'setPointerCapture');
-      }
+    if (closedOffsetRef.current == null) {
+      closedOffsetRef.current = resolveClosedOffset();
     }
-    onSwipeStart?.(event.nativeEvent);
-    setSwiping(true);
-    lockedDirectionRef.current = null;
-    isFirstPointerMoveRef.current = true;
-    updateSwipeProgress(0);
-    syncDragStyles(true);
-    return true;
-  }
-  function resetPendingSwipeState() {
-    clearPendingSwipeStartState();
-    swipeFromScrollableRef.current = false;
-    lastMovePosRef.current = null;
-  }
-  function clearPendingSwipeStartState() {
-    pendingSwipeRef.current = false;
-    pendingSwipeStartPosRef.current = null;
-  }
-  function cancelSwipeInteraction(event) {
-    resetPendingSwipeState();
-    if (!isSwipingRef.current) {
-      return;
-    }
-    setSwiping(false);
-    lockedDirectionRef.current = null;
-    const resolvedInitialTransform = initialTransformRef.current;
-    dragOffsetRef.current = {
-      x: resolvedInitialTransform.x,
-      y: resolvedInitialTransform.y
-    };
-    setCurrentSwipeDirection(undefined);
-    sawPrimaryButtonsOnMoveRef.current = false;
-    syncDragStyles(false);
-    const element = elementRef.current;
-    if (element) {
-      safelyChangePointerCapture(element, event.pointerId, 'releasePointerCapture');
-    }
-    updateSwipeProgress(0, {
-      deltaX: 0,
-      deltaY: 0,
-      direction: undefined
-    });
-    onCancel?.(event.nativeEvent);
-  }
-  function applyDirectionalDamping(deltaX, deltaY) {
-    const exponent = value => value >= 0 ? value ** 0.5 : -(Math.abs(value) ** 0.5);
-    const dampAxis = (delta, allowNegative, allowPositive) => {
-      if (!allowNegative && delta < 0) {
-        return exponent(delta);
-      }
-      if (!allowPositive && delta > 0) {
-        return exponent(delta);
-      }
-      return delta;
-    };
-    const newDeltaX = hasHorizontal ? dampAxis(deltaX, allowLeft, allowRight) : exponent(deltaX);
-    const newDeltaY = hasVertical ? dampAxis(deltaY, allowUp, allowDown) : exponent(deltaY);
-    return {
-      x: newDeltaX,
-      y: newDeltaY
-    };
-  }
-  function canSwipeFromScrollEdgeOnPendingMove(scrollTarget, deltaX, deltaY) {
-    const absDeltaX = Math.abs(deltaX);
-    const absDeltaY = Math.abs(deltaY);
-    const useVerticalAxis = hasVertical && deltaY !== 0 && (!hasHorizontal || absDeltaY >= absDeltaX);
-    if (useVerticalAxis) {
-      const maxScrollTop = Math.max(0, scrollTarget.scrollHeight - scrollTarget.clientHeight);
-      const atTop = scrollTarget.scrollTop <= 0;
-      const atBottom = scrollTarget.scrollTop >= maxScrollTop;
-      const movingDown = deltaY > 0;
-      const movingUp = deltaY < 0;
-      const canSwipeDown = movingDown && atTop && allowDown;
-      const canSwipeUp = movingUp && atBottom && allowUp;
-      return canSwipeDown || canSwipeUp;
-    }
-    const useHorizontalAxis = hasHorizontal && deltaX !== 0 && (!hasVertical || absDeltaX > absDeltaY);
-    if (useHorizontalAxis) {
-      const maxScrollLeft = Math.max(0, scrollTarget.scrollWidth - scrollTarget.clientWidth);
-      const atLeft = scrollTarget.scrollLeft <= 0;
-      const atRight = scrollTarget.scrollLeft >= maxScrollLeft;
-      const movingRight = deltaX > 0;
-      const movingLeft = deltaX < 0;
-      const canSwipeRight = movingRight && atLeft && allowRight;
-      const canSwipeLeft = movingLeft && atRight && allowLeft;
-      return canSwipeRight || canSwipeLeft;
-    }
-    return null;
-  }
-  const handleStart = useButton.useStableCallback(event => {
-    if (!enabled) {
-      return;
-    }
-    if (event.defaultPrevented || event.nativeEvent.defaultPrevented) {
-      return;
-    }
-    if (!('touches' in event) && event.button !== 0) {
-      return;
-    }
-    const startPos = getPrimaryPointerPosition(event);
-    if (!startPos) {
-      return;
-    }
-    pendingSwipeRef.current = true;
-    pendingSwipeStartPosRef.current = startPos;
-    swipeFromScrollableRef.current = false;
-    sawPrimaryButtonsOnMoveRef.current = false;
-    const allowedToStart = canStart ? canStart(startPos, {
-      nativeEvent: event.nativeEvent,
-      direction: primaryDirection
-    }) : true;
-    if (!allowedToStart) {
-      return;
-    }
-    if (startSwipeAtPosition(event, startPos)) {
-      clearPendingSwipeStartState();
-    }
-  });
-  function handleMoveCore(event, position, movement) {
-    if (!enabled || !isSwipingRef.current) {
-      return;
-    }
-    const target = useButton.getTarget(event.nativeEvent);
-    if (isTouchLikeEvent(event) && !swipeFromScrollableRef.current) {
-      const boundaryElement = event.currentTarget;
-      if (findGestureScrollableTouchTarget(target, boundaryElement)) {
-        return;
-      }
-    }
-    if (!('touches' in event)) {
-      // Prevent text selection on Safari
-      event.preventDefault();
-    }
-    if (isFirstPointerMoveRef.current) {
-      // Adjust the starting position to the current position on the first move
-      // to account for the delay between pointerdown and the first pointermove on iOS.
-      dragStartPosRef.current = position;
-      const moveTime = getValidTimeStamp(event.timeStamp);
-      if (moveTime !== null) {
-        swipeStartTimeRef.current = moveTime;
-      }
-      isFirstPointerMoveRef.current = false;
-    }
-    const clientX = position.x;
-    const clientY = position.y;
-    const movementX = movement.x;
-    const movementY = movement.y;
-    if (movementY < 0 && clientY > swipeCancelBaselineRef.current.y || movementY > 0 && clientY < swipeCancelBaselineRef.current.y) {
-      swipeCancelBaselineRef.current = {
-        x: swipeCancelBaselineRef.current.x,
-        y: clientY
-      };
-    }
-    if (movementX < 0 && clientX > swipeCancelBaselineRef.current.x || movementX > 0 && clientX < swipeCancelBaselineRef.current.x) {
-      swipeCancelBaselineRef.current = {
-        x: clientX,
-        y: swipeCancelBaselineRef.current.y
-      };
-    }
-    const deltaX = clientX - dragStartPosRef.current.x;
-    const deltaY = clientY - dragStartPosRef.current.y;
-    const cancelDeltaY = clientY - swipeCancelBaselineRef.current.y;
-    const cancelDeltaX = clientX - swipeCancelBaselineRef.current.x;
-    let lockedDirection = lockedDirectionRef.current;
-    if (lockedDirection === null && hasHorizontal && hasVertical) {
-      const movementDistance = Math.sqrt(deltaX * deltaX + deltaY * deltaY);
-      if (movementDistance >= MIN_DRAG_THRESHOLD) {
-        lockedDirection = Math.abs(deltaX) > Math.abs(deltaY) ? 'horizontal' : 'vertical';
-        lockedDirectionRef.current = lockedDirection;
-      }
-    }
-    let candidate;
-    if (!intendedSwipeDirectionRef.current) {
-      if (lockedDirection === 'vertical') {
-        if (deltaY > 0) {
-          candidate = 'down';
-        } else if (deltaY < 0) {
-          candidate = 'up';
-        }
-      } else if (lockedDirection === 'horizontal') {
-        if (deltaX > 0) {
-          candidate = 'right';
-        } else if (deltaX < 0) {
-          candidate = 'left';
-        }
-      } else if (Math.abs(deltaX) >= Math.abs(deltaY)) {
-        candidate = deltaX > 0 ? 'right' : 'left';
-      } else {
-        candidate = deltaY > 0 ? 'down' : 'up';
-      }
-      if (candidate) {
-        const isAllowed = candidate === 'left' && allowLeft || candidate === 'right' && allowRight || candidate === 'up' && allowUp || candidate === 'down' && allowDown;
-        if (isAllowed) {
-          intendedSwipeDirectionRef.current = candidate;
-          maxSwipeDisplacementRef.current = getDisplacement(candidate, deltaX, deltaY);
-          setCurrentSwipeDirection(candidate);
-          resolveSwipeThreshold(candidate);
-        }
-      }
-    } else {
-      const direction = intendedSwipeDirectionRef.current;
-      const currentDisplacement = getDisplacement(direction, cancelDeltaX, cancelDeltaY);
-      if (currentDisplacement > swipeThresholdRef.current) {
-        cancelledSwipeRef.current = false;
-        setCurrentSwipeDirection(direction);
-      } else if (!(allowLeft && allowRight) && !(allowUp && allowDown) && maxSwipeDisplacementRef.current - currentDisplacement >= REVERSE_CANCEL_THRESHOLD) {
-        // Mark that a change-of-mind has occurred
-        cancelledSwipeRef.current = true;
-      }
-    }
-    const dampedDelta = applyDirectionalDamping(deltaX, deltaY);
-    let newOffsetX = initialTransformRef.current.x;
-    let newOffsetY = initialTransformRef.current.y;
-    if (lockedDirection === 'horizontal') {
-      if (hasHorizontal) {
-        newOffsetX += dampedDelta.x;
-      }
-    } else if (lockedDirection === 'vertical') {
-      if (hasVertical) {
-        newOffsetY += dampedDelta.y;
-      }
-    } else {
-      if (hasHorizontal) {
-        newOffsetX += dampedDelta.x;
-      }
-      if (hasVertical) {
-        newOffsetY += dampedDelta.y;
-      }
-    }
-    dragOffsetRef.current = {
-      x: newOffsetX,
-      y: newOffsetY
-    };
-    syncDragStyles(true);
-    recordDragSample({
-      x: newOffsetX,
-      y: newOffsetY
-    }, getValidTimeStamp(event.timeStamp));
-    const dragDeltaX = newOffsetX - initialTransformRef.current.x;
-    const dragDeltaY = newOffsetY - initialTransformRef.current.y;
-    const swipeDirectionDetails = intendedSwipeDirectionRef.current;
-    const progressDirection = primaryDirection ?? intendedSwipeDirectionRef.current;
-    if (!progressDirection) {
-      updateSwipeProgress(0, {
-        deltaX: dragDeltaX,
-        deltaY: dragDeltaY,
-        direction: swipeDirectionDetails
-      });
-      return;
-    }
-    const size = progressDirection === 'left' || progressDirection === 'right' ? elementSizeRef.current.width : elementSizeRef.current.height;
-    const scale = initialTransformRef.current.scale || 1;
-    if (size <= 0 || scale <= 0) {
-      updateSwipeProgress(0, {
-        deltaX: dragDeltaX,
-        deltaY: dragDeltaY,
-        direction: swipeDirectionDetails
-      });
-      return;
-    }
-    const progressDisplacement = getDisplacement(progressDirection, newOffsetX - initialTransformRef.current.x, newOffsetY - initialTransformRef.current.y);
-    if (progressDisplacement <= 0) {
-      updateSwipeProgress(0, {
-        deltaX: dragDeltaX,
-        deltaY: dragDeltaY,
-        direction: swipeDirectionDetails
-      });
-      return;
-    }
-    updateSwipeProgress(progressDisplacement / (size * scale), {
-      deltaX: dragDeltaX,
-      deltaY: dragDeltaY,
-      direction: swipeDirectionDetails
-    });
-  }
-  const handleEnd = useButton.useStableCallback(event => {
-    if (!enabled) {
-      return;
-    }
-    const resolvedDragOffset = dragOffsetRef.current;
-    const resolvedInitialTransform = initialTransformRef.current;
-    const releaseDeltaX = resolvedDragOffset.x - resolvedInitialTransform.x;
-    const releaseDeltaY = resolvedDragOffset.y - resolvedInitialTransform.y;
-    const progressDetails = {
-      deltaX: releaseDeltaX,
-      deltaY: releaseDeltaY,
-      direction: intendedSwipeDirectionRef.current
-    };
-    if (!isSwipingRef.current) {
-      resetPendingSwipeState();
-      updateSwipeProgress(0, progressDetails);
-      return;
-    }
-    setSwiping(false);
-    lockedDirectionRef.current = null;
-    resetPendingSwipeState();
-    sawPrimaryButtonsOnMoveRef.current = false;
-    const element = elementRef.current;
-    if (element) {
-      if (!('touches' in event)) {
-        safelyChangePointerCapture(element, event.pointerId, 'releasePointerCapture');
-      }
-    }
-    const deltaX = releaseDeltaX;
-    const deltaY = releaseDeltaY;
-    const startTime = swipeStartTimeRef.current;
-    const endTime = getValidTimeStamp(event.timeStamp);
-    const durationMs = startTime !== null && endTime !== null && endTime > startTime ? endTime - startTime : 0;
-    const velocityDurationMs = durationMs > 0 ? Math.max(durationMs, MIN_VELOCITY_DURATION_MS) : 0;
-    const velocityX = velocityDurationMs > 0 ? deltaX / velocityDurationMs : 0;
-    const velocityY = velocityDurationMs > 0 ? deltaY / velocityDurationMs : 0;
-    let releaseVelocityX = lastDragVelocityRef.current.x;
-    let releaseVelocityY = lastDragVelocityRef.current.y;
-    const lastSample = lastDragSampleRef.current;
-    if (lastSample && endTime !== null && endTime >= lastSample.time) {
-      const ageMs = endTime - lastSample.time;
-      if (ageMs <= MAX_RELEASE_VELOCITY_AGE_MS) {
-        const sampleDurationMs = Math.max(ageMs, MIN_RELEASE_VELOCITY_DURATION_MS);
-        const deltaFromLastSampleX = resolvedDragOffset.x - lastSample.x;
-        const deltaFromLastSampleY = resolvedDragOffset.y - lastSample.y;
-        const sampleVelocityX = deltaFromLastSampleX / sampleDurationMs;
-        const sampleVelocityY = deltaFromLastSampleY / sampleDurationMs;
-        if (sampleVelocityX !== 0) {
-          releaseVelocityX = sampleVelocityX;
-        }
-        if (sampleVelocityY !== 0) {
-          releaseVelocityY = sampleVelocityY;
-        }
-      } else {
-        releaseVelocityX = 0;
-        releaseVelocityY = 0;
-      }
-    }
-    const releaseDecision = onRelease?.({
-      event: event.nativeEvent,
-      direction: intendedSwipeDirectionRef.current,
-      deltaX,
-      deltaY,
-      velocityX,
-      velocityY,
-      releaseVelocityX,
-      releaseVelocityY
-    });
-    const hasReleaseDecision = typeof releaseDecision === 'boolean';
-    if (cancelledSwipeRef.current && !hasReleaseDecision) {
-      dragOffsetRef.current = {
-        x: resolvedInitialTransform.x,
-        y: resolvedInitialTransform.y
-      };
-      setCurrentSwipeDirection(undefined);
-      syncDragStyles(false);
-      updateSwipeProgress(0, progressDetails);
-      return;
-    }
-    let shouldClose = false;
-    let dismissDirection;
-    if (hasReleaseDecision) {
-      shouldClose = releaseDecision;
-      dismissDirection = intendedSwipeDirectionRef.current ?? primaryDirection;
-    } else {
-      for (const direction of directions) {
-        switch (direction) {
-          case 'right':
-            if (deltaX > swipeThresholdRef.current) {
-              shouldClose = true;
-              dismissDirection = 'right';
-            }
-            break;
-          case 'left':
-            if (deltaX < -swipeThresholdRef.current) {
-              shouldClose = true;
-              dismissDirection = 'left';
-            }
-            break;
-          case 'down':
-            if (deltaY > swipeThresholdRef.current) {
-              shouldClose = true;
-              dismissDirection = 'down';
-            }
-            break;
-          case 'up':
-            if (deltaY < -swipeThresholdRef.current) {
-              shouldClose = true;
-              dismissDirection = 'up';
-            }
-            break;
-        }
-        if (shouldClose) {
-          break;
-        }
-      }
-    }
-    if (shouldClose && dismissDirection) {
-      setCurrentSwipeDirection(dismissDirection);
-      setDragDismissed(true);
-      syncDragStyles(false);
-      onDismiss?.(event.nativeEvent, {
-        direction: dismissDirection
-      });
-    } else {
-      dragOffsetRef.current = {
-        x: resolvedInitialTransform.x,
-        y: resolvedInitialTransform.y
-      };
-      setCurrentSwipeDirection(undefined);
-      syncDragStyles(false);
-      updateSwipeProgress(0, progressDetails);
-    }
-  });
-  const handleMove = useButton.useStableCallback(event => {
-    const currentPos = getPrimaryPointerPosition(event);
-    if (!currentPos) {
-      return;
-    }
-    let endAfterMove = false;
-    if (!('touches' in event)) {
-      const hasPrimaryButton = hasPrimaryMouseButton(event.buttons);
-      if (hasPrimaryButton) {
-        sawPrimaryButtonsOnMoveRef.current = true;
-      }
-
-      // Cancel the swipe if a non-primary button takes over the interaction.
-      // This handles cases where a right-click interrupts dragging.
-      if (event.buttons !== 0 && !hasPrimaryButton) {
-        cancelSwipeInteraction(event);
-        return;
-      }
-
-      // A `buttons: 0` pointermove means the primary button was already released, so the gesture is
-      // over even if no pointerup reached us. On fast trackpad flicks this trailing move is
-      // dispatched just before pointerup; treat it as the release (mirroring touchend) instead of
-      // cancelling and snapping the element back.
-      if (event.buttons === 0 && sawPrimaryButtonsOnMoveRef.current) {
-        if (!isSwipingRef.current) {
-          // The gesture never activated — discard it.
-          handleEnd(event);
-          return;
-        }
-        // This release move can itself carry the threshold-crossing displacement (and the peak
-        // release velocity), so let it flow through `handleMoveCore` below to update the drag
-        // offset / velocity sample, then commit the release afterwards.
-        endAfterMove = true;
-      }
-    }
-    if (!isSwiping && pendingSwipeRef.current) {
-      if (!isTouchLikeEvent(event) && (event.defaultPrevented || event.nativeEvent.defaultPrevented)) {
-        resetPendingSwipeState();
-        return;
-      }
-      const allowedToStart = canStart ? canStart(currentPos, {
-        nativeEvent: event.nativeEvent,
-        direction: primaryDirection
-      }) : true;
-      if (allowedToStart) {
-        const pendingStartPos = pendingSwipeStartPosRef.current;
-        let ignoreScrollableOnStart = false;
-        if (isTouchLikeEvent(event)) {
-          const element = elementRef.current;
-          if (pendingStartPos && element) {
-            const target = getTargetAtPoint(currentPos, event.nativeEvent);
-            const doc = useButton.ownerDocument(element);
-            const body = doc.body;
-            const scrollTarget = body ? findGestureScrollableTouchTarget(target, body) : null;
-            if (scrollTarget && (useButton.contains(element, scrollTarget) || useButton.contains(scrollTarget, element))) {
-              const deltaX = currentPos.x - pendingStartPos.x;
-              const deltaY = currentPos.y - pendingStartPos.y;
-              const canSwipeFromEdge = canSwipeFromScrollEdgeOnPendingMove(scrollTarget, deltaX, deltaY);
-              if (canSwipeFromEdge === false) {
-                return;
-              }
-              if (canSwipeFromEdge === true) {
-                ignoreScrollableOnStart = true;
-              }
-            }
-          }
-        }
-        const started = startSwipeAtPosition(event, currentPos, {
-          ignoreScrollableTarget: ignoreScrollableOnStart,
-          ignoreScrollableAncestors: ignoreScrollableOnStart
-        });
-        if (started) {
-          if (pendingStartPos && ignoreScrollableOnStart) {
-            // Preserve displacement between touchstart and the move that activates swipe from
-            // a scroll-edge so quick flicks can dismiss.
-            clearPendingSwipeStartState();
-            dragStartPosRef.current = pendingStartPos;
-            swipeCancelBaselineRef.current = pendingStartPos;
-            lastMovePosRef.current = pendingStartPos;
-            isFirstPointerMoveRef.current = false;
-          } else {
-            // Start from the current in-bounds position without dropping follow-up move
-            // displacement; this avoids jumps when entering from outside the element while
-            // keeping swipe tracking responsive on the next move.
-            clearPendingSwipeStartState();
-            swipeFromScrollableRef.current = false;
-          }
-        }
-      }
-    }
-    const previousPos = lastMovePosRef.current;
-    const movement = previousPos === null ? {
-      x: 0,
-      y: 0
-    } : {
-      x: currentPos.x - previousPos.x,
-      y: currentPos.y - previousPos.y
-    };
-    lastMovePosRef.current = currentPos;
-    handleMoveCore(event, currentPos, movement);
-
-    // `endAfterMove` is only set in the non-touch branch above; the `'touches'` guard re-narrows the
-    // event type for `handleEnd` after the shared move handling has run.
-    if (endAfterMove && !('touches' in event)) {
-      handleEnd(event);
-    }
-  });
-
-  // Feeds a native touchmove into the swipe pipeline. Used by consumers that claim the gesture
-  // in a capture-phase listener and stop it from reaching React's delegated touch handlers.
-  const moveNative = useButton.useStableCallback((nativeEvent, currentTarget) => {
-    handleMove({
-      touches: nativeEvent.touches,
-      currentTarget,
-      nativeEvent,
-      defaultPrevented: nativeEvent.defaultPrevented,
-      timeStamp: nativeEvent.timeStamp
-    });
-  });
-  const getDragStyles = React__namespace.useCallback(() => {
-    const dragOffset = dragOffsetRef.current;
-    const initialTransform = initialTransformRef.current;
-    const deltaX = dragOffset.x - initialTransform.x;
-    const deltaY = dragOffset.y - initialTransform.y;
-    if (!isSwiping && deltaX === 0 && deltaY === 0 && !dragDismissed) {
-      return {
-        [movementCssVars.x]: '0px',
-        [movementCssVars.y]: '0px'
-      };
-    }
-    return {
-      transition: isSwiping ? 'none' : undefined,
-      // While swiping, freeze the element at its current visual transform so it doesn't snap to the
-      // end position.
-      transform: isSwiping ? getDragTransform(dragOffset, initialTransform.scale) : undefined,
-      [movementCssVars.x]: `${deltaX}px`,
-      [movementCssVars.y]: `${deltaY}px`
-    };
-  }, [dragDismissed, isSwiping, movementCssVars]);
-  const getPointerProps = React__namespace.useCallback(() => {
-    if (!enabled) {
-      return {};
-    }
-    return {
-      onPointerDown: handleStart,
-      onPointerMove: handleMove,
-      onPointerUp: handleEnd,
-      onPointerCancel: handleEnd
-    };
-  }, [enabled, handleEnd, handleMove, handleStart]);
-  const getTouchProps = React__namespace.useCallback(() => {
-    if (!enabled) {
-      return {};
-    }
-    return {
-      onTouchStart: handleStart,
-      onTouchMove: handleMove,
-      onTouchEnd: handleEnd,
-      onTouchCancel: handleEnd
-    };
-  }, [enabled, handleEnd, handleMove, handleStart]);
-  return {
-    swiping: isSwiping,
-    swipeDirection: currentSwipeDirection,
-    dragDismissed,
-    getPointerProps,
-    getTouchProps,
-    moveNative,
-    getDragStyles,
-    reset
-  };
-}
-
-let DrawerSwipeAreaDataAttributes = function (DrawerSwipeAreaDataAttributes) {
-  /**
-   * Present when the drawer is open.
-   */
-  DrawerSwipeAreaDataAttributes[DrawerSwipeAreaDataAttributes["open"] = useScrollLock.CommonPopupDataAttributes.open] = "open";
-  /**
-   * Present when the drawer is closed.
-   */
-  DrawerSwipeAreaDataAttributes[DrawerSwipeAreaDataAttributes["closed"] = useScrollLock.CommonPopupDataAttributes.closed] = "closed";
-  /**
-   * Present when the swipe area is disabled.
-   */
-  DrawerSwipeAreaDataAttributes["disabled"] = "data-disabled";
-  /**
-   * Indicates the swipe direction.
-   * @type {'up' | 'down' | 'left' | 'right'}
-   */
-  DrawerSwipeAreaDataAttributes["swipeDirection"] = "data-swipe-direction";
-  /**
-   * Present when the drawer is being swiped.
-   */
-  DrawerSwipeAreaDataAttributes["swiping"] = "data-swiping";
-  return DrawerSwipeAreaDataAttributes;
-}({});
-
-const DEFAULT_SWIPE_OPEN_RATIO = 0.5;
-const MIN_SWIPE_START_DISTANCE = 1;
-const VELOCITY_THRESHOLD = 0.1;
-const FALLBACK_SWIPE_OPEN_THRESHOLD = 40;
-const SWIPE_AREA_OPEN_HOOK = {
-  [DrawerSwipeAreaDataAttributes.open]: ''
-};
-const SWIPE_AREA_CLOSED_HOOK = {
-  [DrawerSwipeAreaDataAttributes.closed]: ''
-};
-const SWIPE_AREA_SWIPING_HOOK = {
-  [DrawerSwipeAreaDataAttributes.swiping]: ''
-};
-const SWIPE_AREA_DISABLED_HOOK = {
-  [DrawerSwipeAreaDataAttributes.disabled]: ''
-};
-const stateAttributesMapping$3 = {
-  open(value) {
-    return value ? SWIPE_AREA_OPEN_HOOK : SWIPE_AREA_CLOSED_HOOK;
-  },
-  swiping(value) {
-    return value ? SWIPE_AREA_SWIPING_HOOK : null;
-  },
-  swipeDirection(value) {
-    return value ? {
-      [DrawerSwipeAreaDataAttributes.swipeDirection]: value
-    } : null;
-  },
-  disabled(value) {
-    return value ? SWIPE_AREA_DISABLED_HOOK : null;
-  }
-};
-const oppositeSwipeDirection = {
-  up: 'down',
-  down: 'up',
-  left: 'right',
-  right: 'left'
-};
-function resolveTouchAction(direction) {
-  return direction === 'left' || direction === 'right' ? 'pan-y' : 'pan-x';
-}
-
-/**
- * An invisible area that listens for swipe gestures to open the drawer.
- * Renders a `<div>` element.
- *
- * Documentation: [Base UI Drawer](https://base-ui.com/react/components/drawer)
- */
-const DrawerSwipeArea = /*#__PURE__*/React__namespace.forwardRef(function DrawerSwipeArea(componentProps, forwardedRef) {
-  const {
-    render,
-    className,
-    style,
-    disabled = false,
-    swipeDirection: swipeDirectionProp,
-    ...elementProps
-  } = componentProps;
-  const {
-    store
-  } = ScrollAreaViewport.useDialogRootContext();
-  const {
-    swipeDirection,
-    frontmostHeight
-  } = ScrollAreaViewport.useDrawerRootContext();
-  const providerContext = ScrollAreaViewport.useDrawerProviderContext();
-  const [swipeActive, setSwipeActive] = React__namespace.useState(false);
-  const releaseDismissTimeout = useButton.useTimeout();
-  const swipeAreaRef = React__namespace.useRef(null);
-  const swipeStartEventRef = React__namespace.useRef(null);
-  const openedBySwipeRef = React__namespace.useRef(false);
-  const dragDeltaRef = React__namespace.useRef({
-    x: 0,
-    y: 0
-  });
-  const closedOffsetRef = React__namespace.useRef(null);
-  const appliedSwipeStylesRef = React__namespace.useRef(false);
-  const popupTransitionRef = React__namespace.useRef(null);
-  const swipeAreaId = useButton.useBaseUiId(componentProps.id);
-  const registerTrigger = useScrollLock.useTriggerRegistration(swipeAreaId, store);
-  const open = store.useState('open');
-  const resetDragDelta = useButton.useStableCallback(() => {
-    dragDeltaRef.current.x = 0;
-    dragDeltaRef.current.y = 0;
-  });
-  const resolvedSwipeDirection = swipeDirectionProp ?? oppositeSwipeDirection[swipeDirection];
-  const dismissDirection = oppositeSwipeDirection[resolvedSwipeDirection];
-  const enabled = !disabled && (!open || swipeActive);
-  function disableDismissForSwipe() {
-    releaseDismissTimeout.clear();
-    store.context.outsidePressEnabledRef.current = false;
-  }
-  function enableDismissAfterRelease() {
-    // Safari can dispatch outside-press for the same swipe-open gesture
-    // after release, so defer re-enabling dismissal to the next macrotask.
-    releaseDismissTimeout.start(0, () => {
-      store.context.outsidePressEnabledRef.current = true;
-    });
-  }
-  function resolvePopupSize() {
-    const popupElement = store.context.popupRef.current;
-    if (!popupElement) {
-      return null;
-    }
-    const isHorizontal = dismissDirection === 'left' || dismissDirection === 'right';
-    const size = isHorizontal ? popupElement.offsetWidth : popupElement.offsetHeight;
-    if (size <= 0) {
-      return null;
-    }
-    return size;
-  }
-  function resolveClosedOffset() {
-    const offset = resolvePopupSize();
-    if (offset == null) {
-      return null;
-    }
-    const popupElement = store.context.popupRef.current;
-    if (!popupElement) {
-      return offset;
-    }
-    const isHorizontal = dismissDirection === 'left' || dismissDirection === 'right';
-    const transform = getElementTransform(popupElement);
-    const transformOffset = isHorizontal ? transform.x : transform.y;
-    if (Number.isFinite(transformOffset) && Math.abs(transformOffset) > 0.5) {
-      return Math.min(offset, Math.abs(transformOffset));
-    }
-    return offset;
-  }
-  function resolveSwipeOpenThreshold() {
-    const popupSize = resolvePopupSize();
-    if (popupSize == null) {
-      return FALLBACK_SWIPE_OPEN_THRESHOLD;
-    }
-    return popupSize * DEFAULT_SWIPE_OPEN_RATIO;
-  }
-  function applySwipeMovement() {
-    if (!swipeActive) {
-      return;
-    }
-    const popupElement = store.context.popupRef.current;
-    if (!popupElement) {
-      return;
-    }
-    if (!store.select('open') || !store.select('mounted')) {
-      return;
-    }
-    if (closedOffsetRef.current == null) {
-      closedOffsetRef.current = resolveClosedOffset();
-    }
-    const closedOffset = closedOffsetRef.current;
-    if (!closedOffset || !Number.isFinite(closedOffset) || closedOffset <= 0) {
+    const closedOffset = closedOffsetRef.current;
+    if (!closedOffset || !Number.isFinite(closedOffset) || closedOffset <= 0) {
       return;
     }
     const {
       x,
       y
     } = dragDeltaRef.current;
-    const displacement = getDisplacement(resolvedSwipeDirection, x, y);
+    const displacement = ScrollAreaViewport.getDisplacement(resolvedSwipeDirection, x, y);
     const clampedDisplacement = Math.max(0, displacement);
     const dampedDisplacement = clampedDisplacement > closedOffset ? closedOffset + Math.sqrt(clampedDisplacement - closedOffset) : clampedDisplacement;
     const remaining = closedOffset - dampedDisplacement;
@@ -1692,7 +683,7 @@ const DrawerSwipeArea = /*#__PURE__*/React__namespace.forwardRef(function Drawer
     resetDragDelta();
     clearSwipeStyles();
   }
-  const swipe = useSwipeDismiss({
+  const swipe = ScrollAreaViewport.useSwipeDismiss({
     enabled,
     directions: [resolvedSwipeDirection],
     elementRef: swipeAreaRef,
@@ -1715,856 +706,89 @@ const DrawerSwipeArea = /*#__PURE__*/React__namespace.forwardRef(function Drawer
       if (!swipeStartEventRef.current) {
         return;
       }
-      dragDeltaRef.current.x = details.deltaX;
-      dragDeltaRef.current.y = details.deltaY;
-      if (details.direction !== resolvedSwipeDirection) {
-        return;
-      }
-      const displacement = getDisplacement(resolvedSwipeDirection, details.deltaX, details.deltaY);
-      if (displacement < MIN_SWIPE_START_DISTANCE && !openedBySwipeRef.current) {
-        return;
-      }
-      if (!openedBySwipeRef.current) {
-        openDrawer(swipeStartEventRef.current);
-      }
-      applySwipeMovement();
-    },
-    onRelease({
-      event,
-      direction,
-      deltaX,
-      deltaY,
-      releaseVelocityX,
-      releaseVelocityY
-    }) {
-      const displacement = getDisplacement(resolvedSwipeDirection, deltaX, deltaY);
-      const releaseVelocity = getDisplacement(resolvedSwipeDirection, releaseVelocityX, releaseVelocityY);
-      const threshold = resolveSwipeOpenThreshold();
-      const hasEnoughDistance = threshold != null && displacement >= threshold;
-      const hasEnoughVelocity = releaseVelocity >= VELOCITY_THRESHOLD;
-      const shouldOpen = threshold != null && direction === resolvedSwipeDirection && (hasEnoughDistance || hasEnoughVelocity) && !disabled;
-      if (shouldOpen) {
-        if (!store.select('open')) {
-          openDrawer(event);
-        }
-      } else if (openedBySwipeRef.current) {
-        closeDrawer(event);
-      }
-      finishSwipeInteraction();
-      return false;
-    },
-    onCancel: finishSwipeInteraction
-  });
-  const swipePointerProps = swipe.getPointerProps();
-  const swipeTouchProps = swipe.getTouchProps();
-  const resetSwipe = swipe.reset;
-  React__namespace.useEffect(() => {
-    if (!enabled) {
-      resetSwipe();
-      resetDragDelta();
-      clearSwipeStyles();
-      resetSwipeInteractionState();
-    }
-  }, [clearSwipeStyles, enabled, resetDragDelta, resetSwipe]);
-  React__namespace.useEffect(() => {
-    return () => {
-      store.context.outsidePressEnabledRef.current = true;
-    };
-  }, [store]);
-  const state = {
-    open,
-    swiping: swipe.swiping,
-    swipeDirection: resolvedSwipeDirection,
-    disabled
-  };
-  return useRenderElement.useRenderElement('div', componentProps, {
-    state,
-    ref: [forwardedRef, swipeAreaRef, registerTrigger],
-    stateAttributesMapping: stateAttributesMapping$3,
-    props: [{
-      role: 'presentation',
-      'aria-hidden': true,
-      style: {
-        pointerEvents: !enabled ? 'none' : undefined,
-        touchAction: resolveTouchAction(resolvedSwipeDirection)
-      },
-      onPointerDown(event) {
-        if (event.pointerType === 'touch') {
-          return;
-        }
-        swipePointerProps.onPointerDown?.(event);
-
-        // Prevent native text selection/drag gestures from competing with swipe-open dragging.
-        if (event.cancelable) {
-          event.preventDefault();
-        }
-      },
-      onPointerMove(event) {
-        if (event.pointerType === 'touch') {
-          return;
-        }
-        swipePointerProps.onPointerMove?.(event);
-      },
-      onPointerUp(event) {
-        if (event.pointerType === 'touch') {
-          return;
-        }
-        swipePointerProps.onPointerUp?.(event);
-      },
-      onPointerCancel(event) {
-        if (event.pointerType === 'touch') {
-          return;
-        }
-        swipePointerProps.onPointerCancel?.(event);
-      }
-    }, swipeTouchProps, swipeAreaId ? {
-      id: swipeAreaId
-    } : undefined, elementProps]
-  });
-});
-if (process.env.NODE_ENV !== "production") DrawerSwipeArea.displayName = "DrawerSwipeArea";
-
-const DrawerVirtualKeyboardContext = /*#__PURE__*/React__namespace.createContext(undefined);
-if (process.env.NODE_ENV !== "production") DrawerVirtualKeyboardContext.displayName = "DrawerVirtualKeyboardContext";
-function useDrawerVirtualKeyboardContext() {
-  return React__namespace.useContext(DrawerVirtualKeyboardContext);
-}
-
-const MIN_SWIPE_THRESHOLD = 10;
-const FAST_SWIPE_VELOCITY = 0.5;
-const SNAP_VELOCITY_THRESHOLD = 0.5;
-const SNAP_VELOCITY_MULTIPLIER = 300;
-const MAX_SNAP_VELOCITY = 4;
-const MIN_SWIPE_RELEASE_VELOCITY = 0.2;
-const MAX_SWIPE_RELEASE_VELOCITY = 4;
-const MIN_SWIPE_RELEASE_DURATION_MS = 80;
-const MAX_SWIPE_RELEASE_DURATION_MS = 360;
-const MIN_SWIPE_RELEASE_SCALAR = 0.1;
-const MAX_SWIPE_RELEASE_SCALAR = 1;
-const DRAWER_CONTENT_SELECTOR = `[${ScrollAreaViewport.DRAWER_CONTENT_ATTRIBUTE}]`;
-/**
- * A positioning container for the drawer popup that can be made scrollable.
- * Renders a `<div>` element.
- *
- * Documentation: [Base UI Drawer](https://base-ui.com/react/components/drawer)
- */
-const DrawerViewport = /*#__PURE__*/React__namespace.forwardRef(function DrawerViewport(props, forwardedRef) {
-  const {
-    render,
-    className,
-    style,
-    children,
-    ...elementProps
-  } = props;
-  const {
-    store
-  } = ScrollAreaViewport.useDialogRootContext();
-  const popupRef = store.context.popupRef;
-  const backdropRef = store.context.backdropRef;
-  const {
-    swipeDirection,
-    notifyParentSwipingChange,
-    notifyParentSwipeProgressChange,
-    frontmostHeight,
-    snapToSequentialPoints
-  } = ScrollAreaViewport.useDrawerRootContext();
-  const providerContext = ScrollAreaViewport.useDrawerProviderContext();
-  const {
-    snapPoints,
-    resolvedSnapPoints,
-    activeSnapPoint,
-    activeSnapPointOffset,
-    setActiveSnapPoint,
-    popupHeight
-  } = ScrollAreaViewport.useDrawerSnapPoints();
-  const open = store.useState('open');
-  const mounted = store.useState('mounted');
-  const nested = store.useState('nested');
-  const nestedOpenDrawerCount = store.useState('nestedOpenDrawerCount');
-  const viewportElement = store.useState('viewportElement');
-  const popupElementState = store.useState('popupElement');
-  const visualStateStore = providerContext?.visualStateStore;
-  const nestedDrawerOpen = nestedOpenDrawerCount > 0;
-  const scrollAxis = swipeDirection === 'left' || swipeDirection === 'right' ? 'horizontal' : 'vertical';
-  const isVerticalScrollAxis = scrollAxis === 'vertical';
-  const crossScrollAxis = isVerticalScrollAxis ? 'horizontal' : 'vertical';
-  const [swipeRelease, setSwipeRelease] = React__namespace.useState(null);
-  const pendingSwipeCloseSnapPointRef = React__namespace.useRef(undefined);
-  const resetSwipeRef = React__namespace.useRef(null);
-  const controlledDismissFrame = useButton.useAnimationFrame();
-  const swipingRef = React__namespace.useRef(false);
-  const nestedSwipeActiveRef = React__namespace.useRef(false);
-  const lastPointerTypeRef = React__namespace.useRef('');
-  const ignoreNextTouchStartFromPenRef = React__namespace.useRef(false);
-  const ignoreTouchSwipeRef = React__namespace.useRef(false);
-  const touchScrollStateRef = React__namespace.useRef(null);
-  const virtualKeyboard = useDrawerVirtualKeyboardContext();
-  const snapPointRange = React__namespace.useMemo(() => {
-    if (!snapPoints || snapPoints.length < 2) {
-      return null;
-    }
-    if (swipeDirection !== 'down' && swipeDirection !== 'up') {
-      return null;
-    }
-    if (resolvedSnapPoints.length < 2) {
-      return null;
-    }
-    const offsets = resolvedSnapPoints.map(point => point.offset).filter(offset => Number.isFinite(offset)).sort((a, b) => a - b);
-    if (offsets.length < 2) {
-      return null;
-    }
-    const minOffset = offsets[0];
-    const nextOffset = offsets[1];
-    const maxOffset = offsets[offsets.length - 1];
-    let range = nextOffset - minOffset;
-    if (!Number.isFinite(range) || range <= 0) {
-      const fallbackRange = maxOffset - minOffset;
-      if (!Number.isFinite(fallbackRange) || fallbackRange <= 0) {
-        return null;
-      }
-      range = fallbackRange;
-    }
-    return {
-      minOffset,
-      range
-    };
-  }, [resolvedSnapPoints, snapPoints, swipeDirection]);
-  const snapPointProgress = React__namespace.useMemo(() => {
-    if (!snapPointRange || activeSnapPointOffset === null) {
-      return null;
-    }
-    return clamp.clamp((activeSnapPointOffset - snapPointRange.minOffset) / snapPointRange.range, 0, 1);
-  }, [activeSnapPointOffset, snapPointRange]);
-  const swipeDirections = React__namespace.useMemo(() => {
-    if (snapPoints && snapPoints.length > 0 && (swipeDirection === 'down' || swipeDirection === 'up')) {
-      return swipeDirection === 'down' ? ['down', 'up'] : ['up', 'down'];
-    }
-    return [swipeDirection];
-  }, [snapPoints, swipeDirection]);
-  const setSwipeDismissed = useButton.useStableCallback(dismissed => {
-    setSwipeDismissedElements(popupRef.current, backdropRef.current, dismissed);
-  });
-  const clearSwipeRelease = useButton.useStableCallback(() => {
-    setSwipeDismissed(false);
-    popupRef.current?.removeAttribute(useButton.TransitionStatusDataAttributes.endingStyle);
-    setSwipeRelease(null);
-  });
-  const finishNestedSwipe = useButton.useStableCallback(() => {
-    if (!nestedSwipeActiveRef.current) {
-      return;
-    }
-    nestedSwipeActiveRef.current = false;
-    notifyParentSwipingChange?.(false);
-  });
-  const applySwipeProgress = useButton.useStableCallback(({
-    resolvedProgress,
-    shouldTrackProgress,
-    notifyParent
-  }) => {
-    const isActive = open && !nested && shouldTrackProgress;
-    const swipeProgress = isActive ? resolvedProgress : 0;
-    const nestedSwipeProgress = open && shouldTrackProgress ? resolvedProgress : 0;
-    if (notifyParent && notifyParentSwipeProgressChange) {
-      notifyParentSwipeProgressChange(nestedSwipeProgress);
-      if (nestedSwipeProgress <= 0) {
-        finishNestedSwipe();
-      }
-    }
-    visualStateStore?.set({
-      swipeProgress,
-      frontmostHeight: swipeProgress > 0 ? frontmostHeight : 0
-    });
-    const backdropElement = backdropRef.current;
-    if (!backdropElement) {
-      return;
-    }
-    if (!isActive || swipeProgress <= 0) {
-      backdropElement.style.setProperty(ScrollAreaViewport.DrawerBackdropCssVars.swipeProgress, '0');
-      backdropElement.style.removeProperty(ScrollAreaViewport.DrawerPopupCssVars.height);
-      return;
-    }
-    backdropElement.style.setProperty(ScrollAreaViewport.DrawerBackdropCssVars.swipeProgress, `${swipeProgress}`);
-    if (frontmostHeight > 0) {
-      backdropElement.style.setProperty(ScrollAreaViewport.DrawerPopupCssVars.height, `${frontmostHeight}px`);
-    } else {
-      backdropElement.style.removeProperty(ScrollAreaViewport.DrawerPopupCssVars.height);
-    }
-  });
-  function resolveSwipeRelease({
-    direction,
-    deltaX,
-    deltaY,
-    velocityX,
-    velocityY,
-    releaseVelocityX,
-    releaseVelocityY
-  }) {
-    if (!direction) {
-      return null;
-    }
-    const popupElement = store.context.popupRef.current;
-    if (!popupElement) {
-      return null;
-    }
-    const size = direction === 'left' || direction === 'right' ? popupElement.offsetWidth : popupElement.offsetHeight;
-    if (!Number.isFinite(size) || size <= 0) {
-      return null;
-    }
-    const axisDelta = direction === 'left' || direction === 'right' ? deltaX : deltaY;
-    const snapPointBaseOffset = snapPoints && snapPoints.length > 0 ? activeSnapPointOffset ?? 0 : 0;
-    let baseOffset = 0;
-    if (direction === 'down') {
-      baseOffset = snapPointBaseOffset;
-    } else if (direction === 'up') {
-      baseOffset = -snapPointBaseOffset;
-    }
-    const translation = baseOffset + axisDelta;
-    const translationAlongDirection = direction === 'left' || direction === 'up' ? -translation : translation;
-    const remainingDistance = Math.max(0, size - translationAlongDirection);
-    if (!Number.isFinite(remainingDistance) || remainingDistance <= 0) {
-      return null;
-    }
-    const axisVelocity = direction === 'left' || direction === 'right' ? releaseVelocityX : releaseVelocityY;
-    const fallbackVelocity = direction === 'left' || direction === 'right' ? velocityX : velocityY;
-    const resolvedVelocity = Math.abs(axisVelocity) > 0 && Number.isFinite(axisVelocity) ? axisVelocity : fallbackVelocity;
-    const directionalVelocity = direction === 'left' || direction === 'up' ? -resolvedVelocity : resolvedVelocity;
-    if (!Number.isFinite(directionalVelocity) || directionalVelocity <= MIN_SWIPE_RELEASE_VELOCITY) {
-      return null;
-    }
-    const clampedVelocity = clamp.clamp(directionalVelocity, MIN_SWIPE_RELEASE_VELOCITY, MAX_SWIPE_RELEASE_VELOCITY);
-    const durationMs = clamp.clamp(remainingDistance / clampedVelocity, MIN_SWIPE_RELEASE_DURATION_MS, MAX_SWIPE_RELEASE_DURATION_MS);
-    if (!Number.isFinite(durationMs)) {
-      return null;
-    }
-    const normalizedDuration = (durationMs - MIN_SWIPE_RELEASE_DURATION_MS) / (MAX_SWIPE_RELEASE_DURATION_MS - MIN_SWIPE_RELEASE_DURATION_MS);
-    const durationScalar = clamp.clamp(MIN_SWIPE_RELEASE_SCALAR + normalizedDuration * (MAX_SWIPE_RELEASE_SCALAR - MIN_SWIPE_RELEASE_SCALAR), MIN_SWIPE_RELEASE_SCALAR, MAX_SWIPE_RELEASE_SCALAR);
-    if (!Number.isFinite(durationScalar) || durationScalar <= 0) {
-      return null;
-    }
-    return durationScalar;
-  }
-  function updateNestedSwipeActive(details) {
-    if (nestedSwipeActiveRef.current || !details) {
-      return;
-    }
-    const direction = details.direction ?? swipeDirection;
-    const delta = direction === 'left' || direction === 'right' ? details.deltaX : details.deltaY;
-    if (!Number.isFinite(delta) || Math.abs(delta) < MIN_SWIPE_THRESHOLD) {
-      return;
-    }
-    nestedSwipeActiveRef.current = true;
-    notifyParentSwipingChange?.(true);
-  }
-  const swipe = useSwipeDismiss({
-    enabled: mounted && !nestedDrawerOpen,
-    directions: swipeDirections,
-    elementRef: store.context.popupRef,
-    ignoreSelectorWhenTouch: false,
-    ignoreScrollableAncestors: true,
-    movementCssVars: {
-      x: ScrollAreaViewport.DrawerPopupCssVars.swipeMovementX,
-      y: ScrollAreaViewport.DrawerPopupCssVars.swipeMovementY
-    },
-    onSwipeStart(event) {
-      if ('touches' in event || 'pointerType' in event && event.pointerType === 'touch') {
-        return;
-      }
-      const popupElement = popupRef.current;
-      if (!popupElement) {
-        return;
-      }
-      const doc = useButton.ownerDocument(popupElement);
-      const selection = doc.getSelection?.();
-      if (!selection || selection.isCollapsed) {
+      dragDeltaRef.current.x = details.deltaX;
+      dragDeltaRef.current.y = details.deltaY;
+      if (details.direction !== resolvedSwipeDirection) {
         return;
       }
-      const anchorElement = floatingUi_utils_dom.isElement(selection.anchorNode) ? selection.anchorNode : selection.anchorNode?.parentElement;
-      const focusElement = floatingUi_utils_dom.isElement(selection.focusNode) ? selection.focusNode : selection.focusNode?.parentElement;
-      if (!useButton.contains(popupElement, anchorElement) && !useButton.contains(popupElement, focusElement)) {
+      const displacement = ScrollAreaViewport.getDisplacement(resolvedSwipeDirection, details.deltaX, details.deltaY);
+      if (displacement < MIN_SWIPE_START_DISTANCE && !openedBySwipeRef.current) {
         return;
       }
-      selection.removeAllRanges();
-    },
-    onSwipingChange(swiping) {
-      swipingRef.current = swiping;
-      setBackdropSwipingAttribute(store.context.backdropRef.current, swiping);
-      if (!swiping && !notifyParentSwipeProgressChange) {
-        finishNestedSwipe();
-      }
-    },
-    swipeThreshold({
-      element,
-      direction
-    }) {
-      return getBaseSwipeThreshold(element, direction);
-    },
-    canStart(position, details) {
-      const popupElement = store.context.popupRef.current;
-      if (!popupElement) {
-        return false;
-      }
-      const doc = popupElement.ownerDocument;
-      const elementAtPoint = getElementAtPoint(doc, position.x, position.y);
-      if (!elementAtPoint || !useButton.contains(popupElement, elementAtPoint)) {
-        return false;
-      }
-      const nativeEvent = details.nativeEvent;
-      const touchLike = 'touches' in nativeEvent || 'pointerType' in nativeEvent && nativeEvent.pointerType === 'touch';
-      if (touchLike && shouldIgnoreSwipeForTextSelection(doc, popupElement)) {
-        return false;
-      }
-      if (nativeEvent.type === 'touchstart' && isSwipeIgnoredTarget(elementAtPoint)) {
-        return false;
-      }
-      return true;
-    },
-    onProgress(progress, details) {
-      updateNestedSwipeActive(details);
-      const hasSnapPoints = Boolean(snapPoints && snapPoints.length > 0);
-      if (swipingRef.current && swipeDirection === 'down' && hasSnapPoints && details && Number.isFinite(details.deltaY)) {
-        const popupElement = store.context.popupRef.current;
-        if (popupElement) {
-          popupElement.style.removeProperty('transform');
-          popupElement.style.setProperty(ScrollAreaViewport.DrawerPopupCssVars.swipeMovementY, `${ScrollAreaViewport.getSnapPointSwipeMovement(activeSnapPointOffset ?? 0, details.deltaY)}px`);
-        }
-      }
-      const currentDirection = details?.direction ?? swipe.swipeDirection;
-      const isDismissSwipe = currentDirection === undefined || currentDirection === swipeDirection;
-      const isVerticalSwipe = swipeDirection === 'down' || swipeDirection === 'up';
-      const shouldTrackProgress = hasSnapPoints && isVerticalSwipe || !hasSnapPoints || swipeDirection === 'left' || swipeDirection === 'right' || isDismissSwipe;
-      let resolvedProgress = progress;
-      if (snapPointRange && popupHeight > 0) {
-        if (details && Number.isFinite(details.deltaY)) {
-          const baseOffset = activeSnapPointOffset ?? snapPointRange.minOffset;
-          const nextOffset = clamp.clamp(baseOffset + details.deltaY, 0, popupHeight);
-          resolvedProgress = clamp.clamp((nextOffset - snapPointRange.minOffset) / snapPointRange.range, 0, 1);
-        } else if (snapPointProgress !== null) {
-          resolvedProgress = snapPointProgress;
-        } else if (currentDirection === 'down' || currentDirection === 'up') {
-          const displacement = progress * popupHeight;
-          const baseOffset = activeSnapPointOffset ?? snapPointRange.minOffset;
-          const nextOffset = currentDirection === 'down' ? baseOffset + displacement : baseOffset - displacement;
-          resolvedProgress = clamp.clamp((nextOffset - snapPointRange.minOffset) / snapPointRange.range, 0, 1);
-        }
+      if (!openedBySwipeRef.current) {
+        openDrawer(swipeStartEventRef.current);
       }
-      applySwipeProgress({
-        resolvedProgress,
-        shouldTrackProgress,
-        notifyParent: true
-      });
+      applySwipeMovement();
     },
     onRelease({
       event,
+      direction,
       deltaX,
       deltaY,
-      direction,
-      velocityX,
-      velocityY,
       releaseVelocityX,
       releaseVelocityY
     }) {
-      const swipeReleasePayload = {
-        deltaX,
-        deltaY,
-        velocityX,
-        velocityY,
-        releaseVelocityX,
-        releaseVelocityY
-      };
-      function startSwipeRelease(resolvedDirection) {
-        // Start ending transition styles earlier and synchronously to prevent a period where
-        // the popup appears stuck on release before the actual closing animation starts.
-        const popupElement = store.context.popupRef.current;
-        if (!popupElement) {
-          return;
-        }
-        finishNestedSwipe();
-        setSwipeDismissed(true);
-        popupElement.style.removeProperty('transition');
-        popupElement.setAttribute(useButton.TransitionStatusDataAttributes.endingStyle, '');
-        ReactDOM__namespace.flushSync(() => {
-          setSwipeRelease(resolveSwipeRelease({
-            direction: resolvedDirection,
-            ...swipeReleasePayload
-          }));
-        });
-      }
-      if (!snapPoints || snapPoints.length === 0) {
-        if (!direction) {
-          clearSwipeRelease();
-          return undefined;
-        }
-        const element = store.context.popupRef.current;
-        if (!element) {
-          clearSwipeRelease();
-          return undefined;
-        }
-        const baseThreshold = getBaseSwipeThreshold(element, direction);
-        const delta = direction === 'left' || direction === 'right' ? deltaX : deltaY;
-        if (!Number.isFinite(delta)) {
-          clearSwipeRelease();
-          return undefined;
-        }
-        const directionalDelta = direction === 'left' || direction === 'up' ? -delta : delta;
-        if (directionalDelta <= 0) {
-          clearSwipeRelease();
-          return false;
-        }
-        const velocity = direction === 'left' || direction === 'right' ? velocityX : velocityY;
-        const directionalVelocity = direction === 'left' || direction === 'up' ? -velocity : velocity;
-        if (directionalVelocity >= FAST_SWIPE_VELOCITY && directionalDelta > 0) {
-          startSwipeRelease(direction);
-          return true;
-        }
-        const shouldClose = directionalDelta > baseThreshold;
-        if (shouldClose) {
-          startSwipeRelease(direction);
-        } else {
-          clearSwipeRelease();
-        }
-        return shouldClose;
-      }
-      if (swipeDirection !== 'down' && swipeDirection !== 'up') {
-        clearSwipeRelease();
-        return undefined;
-      }
-      if (!popupHeight || resolvedSnapPoints.length === 0) {
-        clearSwipeRelease();
-        return undefined;
-      }
-      const dragDelta = swipeDirection === 'down' ? deltaY : -deltaY;
-      if (!Number.isFinite(dragDelta)) {
-        clearSwipeRelease();
-        return undefined;
-      }
-      const dragDirection = Math.sign(dragDelta);
-      const releaseDirectionalVelocity = swipeDirection === 'down' ? releaseVelocityY : -releaseVelocityY;
-      const fallbackDirectionalVelocity = swipeDirection === 'down' ? velocityY : -velocityY;
-      let resolvedDirectionalVelocity = Number.isFinite(releaseDirectionalVelocity) ? releaseDirectionalVelocity : fallbackDirectionalVelocity;
-      if (dragDirection !== 0 && Math.abs(dragDelta) >= MIN_SWIPE_THRESHOLD && Number.isFinite(resolvedDirectionalVelocity)) {
-        const velocityDirection = Math.sign(resolvedDirectionalVelocity);
-        if (velocityDirection !== 0 && velocityDirection !== dragDirection) {
-          // Ignore touch reversals that would otherwise flip the snap decision.
-          resolvedDirectionalVelocity = fallbackDirectionalVelocity;
-        }
-      }
-      const currentOffset = activeSnapPointOffset ?? 0;
-      const dragTargetOffset = clamp.clamp(currentOffset + dragDelta, 0, popupHeight);
-      const velocityOffset = Number.isFinite(resolvedDirectionalVelocity) && Math.abs(resolvedDirectionalVelocity) >= SNAP_VELOCITY_THRESHOLD ? clamp.clamp(resolvedDirectionalVelocity, -MAX_SNAP_VELOCITY, MAX_SNAP_VELOCITY) * SNAP_VELOCITY_MULTIPLIER : 0;
-      const targetOffset = snapToSequentialPoints ? dragTargetOffset : clamp.clamp(dragTargetOffset + velocityOffset, 0, popupHeight);
-      const snapPointEventDetails = useButton.createChangeEventDetails(useButton.swipe, event);
-      const closeFromSnapPoints = () => {
-        pendingSwipeCloseSnapPointRef.current = activeSnapPoint;
-        setActiveSnapPoint?.(null, snapPointEventDetails);
-        startSwipeRelease(swipeDirection);
-        return true;
-      };
-      if (snapToSequentialPoints) {
-        const orderedSnapPoints = [...resolvedSnapPoints].sort((first, second) => first.offset - second.offset);
-        if (orderedSnapPoints.length === 0) {
-          clearSwipeRelease();
-          return false;
-        }
-        let currentIndex = 0;
-        let closestDistance = Math.abs(currentOffset - orderedSnapPoints[0].offset);
-        for (let index = 1; index < orderedSnapPoints.length; index += 1) {
-          const distance = Math.abs(currentOffset - orderedSnapPoints[index].offset);
-          if (distance < closestDistance) {
-            closestDistance = distance;
-            currentIndex = index;
-          }
-        }
-        let targetSnapPoint = orderedSnapPoints[0];
-        closestDistance = Math.abs(targetOffset - targetSnapPoint.offset);
-        for (const snapPoint of orderedSnapPoints) {
-          const distance = Math.abs(targetOffset - snapPoint.offset);
-          if (distance < closestDistance) {
-            closestDistance = distance;
-            targetSnapPoint = snapPoint;
-          }
-        }
-        const velocityDirection = Math.sign(resolvedDirectionalVelocity);
-        const shouldAdvance = dragDirection !== 0 && velocityDirection !== 0 && velocityDirection === dragDirection && Math.abs(resolvedDirectionalVelocity) >= SNAP_VELOCITY_THRESHOLD;
-        let effectiveTargetOffset = targetOffset;
-        if (shouldAdvance) {
-          const adjacentIndex = clamp.clamp(currentIndex + dragDirection, 0, orderedSnapPoints.length - 1);
-          if (adjacentIndex !== currentIndex) {
-            const adjacentPoint = orderedSnapPoints[adjacentIndex];
-            const shouldForceAdjacent = dragDirection > 0 ? targetOffset < adjacentPoint.offset : targetOffset > adjacentPoint.offset;
-            if (shouldForceAdjacent) {
-              targetSnapPoint = adjacentPoint;
-              effectiveTargetOffset = adjacentPoint.offset;
-            }
-          } else if (dragDirection > 0) {
-            return closeFromSnapPoints();
-          }
-        }
-        const closeOffset = popupHeight;
-        const closeDistance = Math.abs(effectiveTargetOffset - closeOffset);
-        const snapDistance = Math.abs(effectiveTargetOffset - targetSnapPoint.offset);
-        if (closeDistance < snapDistance) {
-          return closeFromSnapPoints();
-        }
-        setActiveSnapPoint?.(targetSnapPoint.value, snapPointEventDetails);
-        clearSwipeRelease();
-        return false;
-      }
-      if (resolvedDirectionalVelocity >= FAST_SWIPE_VELOCITY && dragDelta > 0) {
-        return closeFromSnapPoints();
-      }
-      let closestSnapPoint = resolvedSnapPoints[0];
-      let closestDistance = Math.abs(targetOffset - closestSnapPoint.offset);
-      for (const snapPoint of resolvedSnapPoints) {
-        const distance = Math.abs(targetOffset - snapPoint.offset);
-        if (distance < closestDistance) {
-          closestDistance = distance;
-          closestSnapPoint = snapPoint;
+      const displacement = ScrollAreaViewport.getDisplacement(resolvedSwipeDirection, deltaX, deltaY);
+      const releaseVelocity = ScrollAreaViewport.getDisplacement(resolvedSwipeDirection, releaseVelocityX, releaseVelocityY);
+      const threshold = resolveSwipeOpenThreshold();
+      const hasEnoughDistance = threshold != null && displacement >= threshold;
+      const hasEnoughVelocity = releaseVelocity >= VELOCITY_THRESHOLD;
+      const shouldOpen = threshold != null && direction === resolvedSwipeDirection && (hasEnoughDistance || hasEnoughVelocity) && !disabled;
+      if (shouldOpen) {
+        if (!store.select('open')) {
+          openDrawer(event);
         }
+      } else if (openedBySwipeRef.current) {
+        closeDrawer(event);
       }
-      const closeOffset = popupHeight;
-      const closeDistance = Math.abs(targetOffset - closeOffset);
-      if (closeDistance < closestDistance) {
-        return closeFromSnapPoints();
-      }
-      setActiveSnapPoint?.(closestSnapPoint.value, snapPointEventDetails);
-      clearSwipeRelease();
+      finishSwipeInteraction();
       return false;
     },
-    onDismiss(event) {
-      visualStateStore?.set({
-        swipeProgress: 0,
-        frontmostHeight: 0
-      });
-      const backdropElement = store.context.backdropRef.current;
-      if (backdropElement) {
-        backdropElement.style.setProperty(ScrollAreaViewport.DrawerBackdropCssVars.swipeProgress, '0');
-        backdropElement.style.removeProperty(ScrollAreaViewport.DrawerPopupCssVars.height);
-      }
-      const dismissEventDetails = useButton.createChangeEventDetails(useButton.swipe, event);
-      store.setOpen(false, dismissEventDetails);
-      if (dismissEventDetails.isCanceled) {
-        const pendingSnapPoint = pendingSwipeCloseSnapPointRef.current;
-        if (pendingSnapPoint !== undefined) {
-          setActiveSnapPoint?.(pendingSnapPoint, useButton.createChangeEventDetails(useButton.swipe, event));
-        }
-        pendingSwipeCloseSnapPointRef.current = undefined;
-        resetSwipeRef.current?.();
-        clearSwipeRelease();
-        return;
-      }
-
-      // In controlled mode, the effective open state may not have changed yet
-      // (openProp takes precedence over state.open). Proceed optimistically with the
-      // dismiss animation — React's Scheduler flushes before the next rAF, so we can
-      // reliably check whether the parent accepted or rejected the close.
-      // Note: if onOpenChange is asynchronous (e.g., closes the drawer after a network
-      // call), the rAF check will see open === true, revert the animation, and the
-      // drawer will close without animation when the parent eventually sets open={false}.
-      if (store.select('open')) {
-        const savedEvent = event;
-        controlledDismissFrame.request(() => {
-          if (store.select('open')) {
-            // Parent rejected: revert animation and restore snap point.
-            const pendingSnapPoint = pendingSwipeCloseSnapPointRef.current;
-            if (pendingSnapPoint !== undefined) {
-              setActiveSnapPoint?.(pendingSnapPoint, useButton.createChangeEventDetails(useButton.swipe, savedEvent));
-            }
-            pendingSwipeCloseSnapPointRef.current = undefined;
-            clearSwipeRelease();
-            resetSwipeRef.current?.();
-          } else {
-            // Parent accepted: clean up the ref.
-            pendingSwipeCloseSnapPointRef.current = undefined;
-          }
-        });
-        return;
-      }
-      pendingSwipeCloseSnapPointRef.current = undefined;
-      setSwipeDismissed(true);
-    }
+    onCancel: finishSwipeInteraction
   });
   const swipePointerProps = swipe.getPointerProps();
   const swipeTouchProps = swipe.getTouchProps();
-  const {
-    moveNative: moveSwipeNative,
-    reset: resetSwipe
-  } = swipe;
-  resetSwipeRef.current = resetSwipe;
-  React__namespace.useEffect(() => {
-    const rootElement = viewportElement ?? popupElementState;
-    if (!rootElement) {
-      return undefined;
-    }
-    const resolvedRootElement = rootElement;
-    const doc = useButton.ownerDocument(resolvedRootElement);
-    const win = floatingUi_utils_dom.getWindow(doc);
-    function handleNativeTouchMove(event) {
-      // The virtual keyboard provider observes the move to tell a tap apart from a drag.
-      // It must run even when the swipe gesture below claims the event with
-      // `stopPropagation()`, which would otherwise prevent React's delegated handlers
-      // (and the provider) from ever seeing the move.
-      virtualKeyboard?.onTouchMove(event);
-      if (ignoreTouchSwipeRef.current) {
-        return;
-      }
-      const touchState = touchScrollStateRef.current;
-      const touch = event.touches[0];
-      if (!touch || !touchState) {
-        return;
-      }
-      const drawerAxisDelta = isVerticalScrollAxis ? touch.clientY - touchState.lastY : touch.clientX - touchState.lastX;
-
-      // Preserve native range interaction by never locking touchmove for range inputs.
-      if (isEventOnRangeInput(event, win)) {
-        touchState.allowSwipe = false;
-        updateTouchScrollPosition(touchState, touch);
-        return;
-      }
-
-      // Avoid blocking pinch zoom or text selection adjustments on iOS Safari.
-      if (event.touches.length === 2) {
-        updateTouchScrollPosition(touchState, touch);
-        return;
-      }
-      const allowTouchMove = shouldIgnoreSwipeForTextSelection(doc, resolvedRootElement);
-      if (allowTouchMove || !open || !mounted || nestedDrawerOpen) {
-        updateTouchScrollPosition(touchState, touch);
-        return;
-      }
-      if (preserveNativeCrossAxisScrollOnMove(touchState, touch, isVerticalScrollAxis)) {
-        updateTouchScrollPosition(touchState, touch);
-        return;
-      }
-      const scrollTarget = touchState.scrollTarget;
-      if (!scrollTarget || scrollTarget === doc.documentElement || scrollTarget === doc.body) {
-        if (event.cancelable) {
-          event.preventDefault();
-        }
-        // Claim the gesture before React's delegated touch handlers see it; dispatching the
-        // move through React re-rasterizes the popup content on every frame.
-        event.stopPropagation();
-        moveSwipeNative(event, resolvedRootElement);
-        updateTouchScrollPosition(touchState, touch);
-        return;
-      }
-      const hasScrollableContent = hasScrollableContentOnAxis(scrollTarget, scrollAxis);
-      if (!hasScrollableContent) {
-        // If the scroll container doesn't overflow on the drawer axis, prevent the window from
-        // scrolling instead.
-        if (event.cancelable) {
-          event.preventDefault();
-        }
-        event.stopPropagation();
-        updateTouchScrollPosition(touchState, touch);
-        return;
-      }
-      const delta = drawerAxisDelta;
-      if (delta !== 0) {
-        const canSwipeFromScrollEdge = canSwipeFromScrollEdgeOnMove(scrollTarget, scrollAxis, swipeDirection, delta);
-        if (!touchState.allowSwipe) {
-          if (!event.cancelable) {
-            touchState.allowSwipe = false;
-          } else if (canSwipeFromScrollEdge) {
-            touchState.allowSwipe = true;
-            event.preventDefault();
-          } else {
-            touchState.allowSwipe = false;
-          }
-        } else if (event.cancelable) {
-          event.preventDefault();
-        }
-      }
-      if (touchState.allowSwipe === true) {
-        event.stopPropagation();
-        moveSwipeNative(event, resolvedRootElement);
-      }
-      updateTouchScrollPosition(touchState, touch);
-    }
-    return useButton.addEventListener(doc, 'touchmove', handleNativeTouchMove, {
-      passive: false,
-      capture: true
-    });
-  }, [mounted, nestedDrawerOpen, open, popupElementState, isVerticalScrollAxis, scrollAxis, swipeDirection, moveSwipeNative, viewportElement, virtualKeyboard]);
-  React__namespace.useEffect(() => {
-    if (!snapPointRange || swipe.swiping) {
-      return;
-    }
-    const resolvedProgress = !open || nested ? 0 : snapPointProgress ?? 0;
-    applySwipeProgress({
-      resolvedProgress,
-      shouldTrackProgress: true,
-      notifyParent: false
-    });
-  }, [applySwipeProgress, frontmostHeight, nested, notifyParentSwipeProgressChange, open, snapPointProgress, snapPointRange, swipe.swiping, store, visualStateStore]);
-  React__namespace.useEffect(() => {
-    if (!notifyParentSwipeProgressChange) {
-      return undefined;
-    }
-    if (!open) {
-      notifyParentSwipeProgressChange(0);
-    }
-    return () => {
-      notifyParentSwipeProgressChange(0);
-    };
-  }, [notifyParentSwipeProgressChange, open]);
+  const resetSwipe = swipe.reset;
   React__namespace.useEffect(() => {
-    if (open) {
+    if (!enabled) {
       resetSwipe();
-      clearSwipeRelease();
+      resetDragDelta();
+      clearSwipeStyles();
+      resetSwipeInteractionState();
     }
-  }, [clearSwipeRelease, open, resetSwipe]);
+  }, [clearSwipeStyles, enabled, resetDragDelta, resetSwipe]);
   React__namespace.useEffect(() => {
-    const backdropElement = backdropRef.current;
     return () => {
-      visualStateStore?.set({
-        swipeProgress: 0,
-        frontmostHeight: 0
-      });
-      setBackdropSwipingAttribute(backdropElement, false);
-      // `data-swiping` is set on whichever backdrop is current when a swipe starts, which can
-      // differ from the captured element if the backdrop mounted late or changed identity.
-      // Reading the live ref here is intentional so the current backdrop is cleared too.
-      // eslint-disable-next-line react-hooks/exhaustive-deps
-      const currentBackdrop = backdropRef.current;
-      if (currentBackdrop !== backdropElement) {
-        setBackdropSwipingAttribute(currentBackdrop, false);
-      }
-      finishNestedSwipe();
+      store.context.outsidePressEnabledRef.current = true;
     };
-  }, [backdropRef, finishNestedSwipe, visualStateStore]);
-  const swipeProviderValue = React__namespace.useMemo(() => ({
+  }, [store]);
+  const state = {
+    open,
     swiping: swipe.swiping,
-    getDragStyles: swipe.getDragStyles,
-    swipeStrength: swipeRelease ?? null,
-    setSwipeDismissed
-  }), [setSwipeDismissed, swipe.getDragStyles, swipe.swiping, swipeRelease]);
-  function resetTouchTrackingState() {
-    ignoreTouchSwipeRef.current = false;
-    touchScrollStateRef.current = null;
-    lastPointerTypeRef.current = '';
-    ignoreNextTouchStartFromPenRef.current = false;
-  }
-  return /*#__PURE__*/jsxRuntime.jsx(DrawerDescription.DialogViewport, {
-    ref: forwardedRef,
-    className: className,
-    style: style,
-    render: render,
-    ...useRenderElement.mergeProps(elementProps, {
+    swipeDirection: resolvedSwipeDirection,
+    disabled
+  };
+  return useRenderElement.useRenderElement('div', componentProps, {
+    state,
+    ref: [forwardedRef, swipeAreaRef, registerTrigger],
+    stateAttributesMapping: stateAttributesMapping$3,
+    props: [{
+      role: 'presentation',
+      'aria-hidden': true,
+      style: {
+        pointerEvents: !enabled ? 'none' : undefined,
+        touchAction: resolveTouchAction(resolvedSwipeDirection)
+      },
       onPointerDown(event) {
-        lastPointerTypeRef.current = event.pointerType;
-        ignoreNextTouchStartFromPenRef.current = event.pointerType === 'pen';
-        if (!open || !mounted || nestedDrawerOpen) {
-          return;
-        }
-        const doc = useButton.ownerDocument(event.currentTarget);
-        const elementAtPoint = getElementAtPoint(doc, event.clientX, event.clientY);
-        if (isSwipeIgnoredTarget(elementAtPoint) || isDrawerContentTarget(elementAtPoint)) {
-          return;
-        }
         if (event.pointerType === 'touch') {
           return;
         }
         swipePointerProps.onPointerDown?.(event);
+
+        // Prevent native text selection/drag gestures from competing with swipe-open dragging.
+        if (event.cancelable) {
+          event.preventDefault();
+        }
       },
       onPointerMove(event) {
         if (event.pointerType === 'touch') {
@@ -2573,258 +797,23 @@ const DrawerViewport = /*#__PURE__*/React__namespace.forwardRef(function DrawerV
         swipePointerProps.onPointerMove?.(event);
       },
       onPointerUp(event) {
-        if (lastPointerTypeRef.current === event.pointerType) {
-          lastPointerTypeRef.current = '';
-        }
         if (event.pointerType === 'touch') {
           return;
         }
         swipePointerProps.onPointerUp?.(event);
       },
       onPointerCancel(event) {
-        if (lastPointerTypeRef.current === event.pointerType) {
-          lastPointerTypeRef.current = '';
-        }
         if (event.pointerType === 'touch') {
           return;
         }
         swipePointerProps.onPointerCancel?.(event);
-      },
-      onTouchStart(event) {
-        const startedFromPenPointerDown = lastPointerTypeRef.current === 'pen' && ignoreNextTouchStartFromPenRef.current;
-        if (startedFromPenPointerDown) {
-          ignoreNextTouchStartFromPenRef.current = false;
-          ignoreTouchSwipeRef.current = false;
-          touchScrollStateRef.current = null;
-          return;
-        }
-        if (!open || !mounted || nestedDrawerOpen) {
-          ignoreTouchSwipeRef.current = false;
-          touchScrollStateRef.current = null;
-          return;
-        }
-        const touch = event.touches[0];
-        if (!touch) {
-          return;
-        }
-        if (isReactTouchEventOnRangeInput(event)) {
-          ignoreTouchSwipeRef.current = false;
-          touchScrollStateRef.current = null;
-          return;
-        }
-        const doc = useButton.ownerDocument(event.currentTarget);
-        const elementAtPoint = getElementAtPoint(doc, touch.clientX, touch.clientY);
-        const rootElement = viewportElement ?? popupElementState;
-        const eventTarget = useButton.getTarget(event.nativeEvent);
-        const target = floatingUi_utils_dom.isElement(eventTarget) ? eventTarget : null;
-        if (rootElement && target && !useButton.contains(rootElement, target)) {
-          ignoreTouchSwipeRef.current = true;
-          touchScrollStateRef.current = null;
-          return;
-        }
-        virtualKeyboard?.onTouchStart(event);
-        ignoreTouchSwipeRef.current = isSwipeIgnoredTarget(elementAtPoint);
-        if (ignoreTouchSwipeRef.current) {
-          touchScrollStateRef.current = null;
-          return;
-        }
-        let scrollTarget = null;
-        let hasCrossAxisScrollableContent = false;
-        if (rootElement && target) {
-          scrollTarget = findScrollableTouchTarget(target, rootElement, scrollAxis);
-          hasCrossAxisScrollableContent = findScrollableTouchTarget(target, rootElement, crossScrollAxis) != null;
-        }
-        let allowSwipe = null;
-        if (scrollTarget) {
-          const canSwipeFromEdge = isAtSwipeStartEdge(scrollTarget, scrollAxis, swipeDirection);
-          allowSwipe = canSwipeFromEdge ? null : false;
-        }
-        touchScrollStateRef.current = {
-          startX: touch.clientX,
-          startY: touch.clientY,
-          lastX: touch.clientX,
-          lastY: touch.clientY,
-          scrollTarget,
-          hasCrossAxisScrollableContent,
-          allowSwipe,
-          preserveNativeCrossAxisScroll: false
-        };
-        swipeTouchProps.onTouchStart?.(event);
-      },
-      onTouchEnd(event) {
-        virtualKeyboard?.onTouchEnd(event);
-        resetTouchTrackingState();
-        swipeTouchProps.onTouchEnd?.(event);
-      },
-      onTouchCancel(event) {
-        virtualKeyboard?.onTouchCancel();
-        resetTouchTrackingState();
-        swipeTouchProps.onTouchCancel?.(event);
-      },
-      // Drawer popups use drawer-specific nested state attributes.
-      // Suppress DialogViewport's generic nested dialog attribute.
-      ['data-nested-dialog-open']: undefined
-    }),
-    children: /*#__PURE__*/jsxRuntime.jsx(ScrollAreaViewport.DrawerViewportContext.Provider, {
-      value: swipeProviderValue,
-      children: children
-    })
+      }
+    }, swipeTouchProps, swipeAreaId ? {
+      id: swipeAreaId
+    } : undefined, elementProps]
   });
 });
-if (process.env.NODE_ENV !== "production") DrawerViewport.displayName = "DrawerViewport";
-function setSwipeDismissedElements(popupElement, backdropElement, dismissed) {
-  if (dismissed) {
-    popupElement?.setAttribute(ScrollAreaViewport.DrawerPopupDataAttributes.swipeDismiss, '');
-    backdropElement?.setAttribute(ScrollAreaViewport.DrawerPopupDataAttributes.swipeDismiss, '');
-    return;
-  }
-  popupElement?.removeAttribute(ScrollAreaViewport.DrawerPopupDataAttributes.swipeDismiss);
-  backdropElement?.removeAttribute(ScrollAreaViewport.DrawerPopupDataAttributes.swipeDismiss);
-}
-function setBackdropSwipingAttribute(backdropElement, swiping) {
-  if (!backdropElement) {
-    return;
-  }
-  if (swiping) {
-    backdropElement.setAttribute(ScrollAreaViewport.DrawerPopupDataAttributes.swiping, '');
-    return;
-  }
-  backdropElement.removeAttribute(ScrollAreaViewport.DrawerPopupDataAttributes.swiping);
-}
-function isSwipeIgnoredTarget(target) {
-  return Boolean(target?.closest(useScrollLock.BASE_UI_SWIPE_IGNORE_SELECTOR));
-}
-function isDrawerContentTarget(target) {
-  return Boolean(target?.closest(DRAWER_CONTENT_SELECTOR));
-}
-function getBaseSwipeThreshold(element, direction) {
-  const size = direction === 'left' || direction === 'right' ? element.offsetWidth : element.offsetHeight;
-  return Math.max(size * 0.5, MIN_SWIPE_THRESHOLD);
-}
-function isRangeInput(target, win) {
-  return target instanceof win.HTMLInputElement && target.type === 'range';
-}
-function isTextSelectionControl(target) {
-  if (!floatingUi_utils_dom.isElement(target)) {
-    return false;
-  }
-  return target.tagName === 'INPUT' || target.tagName === 'TEXTAREA';
-}
-function hasExpandedSelectionWithinTarget(selection, target) {
-  const anchorElement = floatingUi_utils_dom.isElement(selection.anchorNode) ? selection.anchorNode : selection.anchorNode?.parentElement;
-  const focusElement = floatingUi_utils_dom.isElement(selection.focusNode) ? selection.focusNode : selection.focusNode?.parentElement;
-  return selection.containsNode(target, true) || useButton.contains(target, anchorElement) || useButton.contains(target, focusElement);
-}
-function shouldIgnoreSwipeForTextSelection(doc, rootElement) {
-  const activeEl = useButton.activeElement(doc);
-  const activeElementWithinRoot = Boolean(activeEl && useButton.contains(rootElement, activeEl));
-  if (activeElementWithinRoot && isTextSelectionControl(activeEl)) {
-    const {
-      selectionStart,
-      selectionEnd
-    } = activeEl;
-    if (selectionStart != null && selectionEnd != null && selectionStart < selectionEnd) {
-      return true;
-    }
-  }
-  const selection = doc.getSelection?.();
-  if (!selection || selection.isCollapsed) {
-    return false;
-  }
-  return hasExpandedSelectionWithinTarget(selection, rootElement);
-}
-function isEventOnRangeInput(event, win) {
-  const composedPath = event.composedPath();
-  if (composedPath) {
-    return composedPath.some(pathTarget => isRangeInput(pathTarget, win));
-  }
-  return isRangeInput(useButton.getTarget(event), win);
-}
-function isReactTouchEventOnRangeInput(event) {
-  return isEventOnRangeInput(event.nativeEvent, floatingUi_utils_dom.getWindow(event.currentTarget));
-}
-function updateTouchScrollPosition(touchState, touch) {
-  touchState.lastX = touch.clientX;
-  touchState.lastY = touch.clientY;
-}
-function preserveNativeCrossAxisScrollOnMove(touchState, touch, isVerticalScrollAxis) {
-  if (touchState.preserveNativeCrossAxisScroll) {
-    return true;
-  }
-  if (touchState.allowSwipe === true || !touchState.hasCrossAxisScrollableContent) {
-    return false;
-  }
-  const drawerAxisGestureDelta = isVerticalScrollAxis ? touch.clientY - touchState.startY : touch.clientX - touchState.startX;
-  const crossAxisGestureDelta = isVerticalScrollAxis ? touch.clientX - touchState.startX : touch.clientY - touchState.startY;
-  const absDrawerAxisGestureDelta = Math.abs(drawerAxisGestureDelta);
-  const absCrossAxisGestureDelta = Math.abs(crossAxisGestureDelta);
-  if (absCrossAxisGestureDelta < 6 || absCrossAxisGestureDelta <= absDrawerAxisGestureDelta + 2) {
-    return false;
-  }
-  touchState.preserveNativeCrossAxisScroll = true;
-  return true;
-}
-function hasScrollableContentOnAxis(scrollTarget, axis) {
-  return axis === 'vertical' ? scrollTarget.scrollHeight > scrollTarget.clientHeight : scrollTarget.scrollWidth > scrollTarget.clientWidth;
-}
-function getScrollMetrics(scrollTarget, axis) {
-  if (axis === 'vertical') {
-    const max = Math.max(0, scrollTarget.scrollHeight - scrollTarget.clientHeight);
-    return {
-      offset: scrollTarget.scrollTop,
-      max
-    };
-  }
-  const max = Math.max(0, scrollTarget.scrollWidth - scrollTarget.clientWidth);
-  return {
-    offset: scrollTarget.scrollLeft,
-    max
-  };
-}
-function isAtSwipeStartEdge(scrollTarget, axis, direction) {
-  const {
-    offset,
-    max
-  } = getScrollMetrics(scrollTarget, axis);
-  const dismissFromStartEdge = shouldDismissFromStartEdge(direction, axis);
-  if (dismissFromStartEdge === null) {
-    return false;
-  }
-  return dismissFromStartEdge ? offset <= 0 : offset >= max;
-}
-function canSwipeFromScrollEdgeOnMove(scrollTarget, axis, direction, delta) {
-  const {
-    offset,
-    max
-  } = getScrollMetrics(scrollTarget, axis);
-  const dismissFromStartEdge = shouldDismissFromStartEdge(direction, axis);
-  if (dismissFromStartEdge === null) {
-    return false;
-  }
-  const movingTowardDismiss = dismissFromStartEdge ? delta > 0 : delta < 0;
-  if (!movingTowardDismiss) {
-    return false;
-  }
-  return dismissFromStartEdge ? offset <= 0 : offset >= max;
-}
-function shouldDismissFromStartEdge(direction, axis) {
-  if (axis === 'vertical') {
-    if (direction === 'down') {
-      return true;
-    }
-    if (direction === 'up') {
-      return false;
-    }
-    return null;
-  }
-  if (direction === 'right') {
-    return true;
-  }
-  if (direction === 'left') {
-    return false;
-  }
-  return null;
-}
+if (process.env.NODE_ENV !== "production") DrawerSwipeArea.displayName = "DrawerSwipeArea";
 
 let DrawerViewportCssVars = /*#__PURE__*/function (DrawerViewportCssVars) {
   /**
@@ -3147,7 +1136,7 @@ function DrawerVirtualKeyboardProvider(props) {
     onTouchEnd,
     onTouchCancel: resetTouchTrackingState
   }), [onTouchEnd, onTouchMove, onTouchStart, resetTouchTrackingState]);
-  return /*#__PURE__*/jsxRuntime.jsx(DrawerVirtualKeyboardContext.Provider, {
+  return /*#__PURE__*/jsxRuntime.jsx(ScrollAreaViewport.DrawerVirtualKeyboardContext.Provider, {
     value: contextValue,
     children: children
   });
@@ -3196,7 +1185,7 @@ function getContentEditableHost(element) {
   return host;
 }
 function resolveKeyboardTouchTargetFromPoint(doc, clientX, clientY) {
-  const exactTarget = getElementAtPoint(doc, clientX, clientY);
+  const exactTarget = ScrollAreaViewport.getElementAtPoint(doc, clientX, clientY);
   const exactKeyboardTarget = resolveKeyboardInputTarget(exactTarget);
   if (exactKeyboardTarget) {
     return {
@@ -3215,7 +1204,7 @@ function resolveKeyboardTouchTargetFromPoint(doc, clientX, clientY) {
     return KEYBOARD_TAP_BLOCKED;
   }
   for (const [offsetX, offsetY] of [[0, INPUT_TAP_HIT_SLOP], [0, -INPUT_TAP_HIT_SLOP], [INPUT_TAP_HIT_SLOP, 0], [-INPUT_TAP_HIT_SLOP, 0]]) {
-    const keyboardTarget = resolveKeyboardInputTarget(getElementAtPoint(doc, clientX + offsetX, clientY + offsetY));
+    const keyboardTarget = resolveKeyboardInputTarget(ScrollAreaViewport.getElementAtPoint(doc, clientX + offsetX, clientY + offsetY));
     if (keyboardTarget) {
       return {
         focusTarget: keyboardTarget,
@@ -3269,7 +1258,7 @@ function findKeyboardScrollTarget(target, root) {
   // that only becomes scrollable once keyboard slack is added (overflow intent without
   // current overflow).
   const scrollStart = floatingUi_utils_dom.getParentNode(target);
-  return findScrollableTouchTarget(scrollStart, root, 'vertical') ?? findScrollableTouchTarget(scrollStart, root, 'vertical', true);
+  return ScrollAreaViewport.findScrollableTouchTarget(scrollStart, root, 'vertical') ?? ScrollAreaViewport.findScrollableTouchTarget(scrollStart, root, 'vertical', true);
 }
 function getKeyboardVisualViewport(win) {
   const visualViewport = win.visualViewport;
@@ -3310,7 +1299,7 @@ var index_parts$5 = /*#__PURE__*/Object.freeze({
   SwipeArea: DrawerSwipeArea,
   Title: DrawerTitle.DrawerTitle,
   Trigger: ScrollAreaViewport.DrawerTrigger,
-  Viewport: DrawerViewport,
+  Viewport: ScrollAreaViewport.DrawerViewport,
   VirtualKeyboardProvider: DrawerVirtualKeyboardProvider,
   createHandle: DrawerDescription.createDialogHandle
 });