react-native-screen-transitions 3.5.2 → 3.6.0-alpha.0

package/src/shared/hooks/gestures/use-scroll-registry.ts

@@ -1,265 +0,0 @@
-/**
- * Connects ScrollViews to the gesture ownership system.
- *
- * Per the spec, ownership is per-direction (not per-axis):
- * - `vertical` and `vertical-inverted` are independent
- * - `horizontal` and `horizontal-inverted` are independent
- *
- * This means a ScrollView on a vertical axis may need to coordinate with
- * multiple gesture owners: one for `vertical` and another for `vertical-inverted`.
- *
- * Example: Settings screen claims `vertical-inverted`, parent workout layout claims `vertical`.
- * The ScrollView should yield to settings for swipe-up at bottom, and to workout for swipe-down at top.
- */
-
-import { useMemo } from "react";
-import type { LayoutChangeEvent } from "react-native";
-import { Gesture, type GestureType } from "react-native-gesture-handler";
-import type { SharedValue } from "react-native-reanimated";
-import { useAnimatedScrollHandler } from "react-native-reanimated";
-import {
-	type GestureContextType,
-	type ScrollConfig,
-	useGestureContext,
-} from "../../providers/gestures";
-import type { Direction } from "../../types/ownership.types";
-import useStableCallback from "../use-stable-callback";
-
-/** Walks up context tree to find the screen that owns a specific direction. */
-function findGestureOwnerForDirection(
-	context: GestureContextType | null | undefined,
-	direction: Direction,
-): GestureContextType | null {
-	let current = context;
-	const startIsolated = context?.isIsolated;
-
-	while (current) {
-		if (startIsolated !== undefined && current.isIsolated !== startIsolated) {
-			break;
-		}
-
-		if (current.claimedDirections?.[direction]) {
-			return current;
-		}
-
-		current = current.ancestorContext;
-	}
-
-	return null;
-}
-
-/**
- * Finds all gesture owners for a scroll axis (both directions).
- * Returns deduplicated list of owners - a snap-point sheet claiming both
- * directions will only appear once.
- */
-function findGestureOwnersForAxis(
-	context: GestureContextType | null | undefined,
-	axis: "vertical" | "horizontal",
-): GestureContextType[] {
-	const directions: [Direction, Direction] =
-		axis === "vertical"
-			? ["vertical", "vertical-inverted"]
-			: ["horizontal", "horizontal-inverted"];
-
-	const owners: GestureContextType[] = [];
-
-	for (const dir of directions) {
-		const owner = findGestureOwnerForDirection(context, dir);
-		if (owner && !owners.includes(owner)) {
-			owners.push(owner);
-		}
-	}
-
-	return owners;
-}
-
-interface ScrollProgressHookProps {
-	onContentSizeChange?: (width: number, height: number) => void;
-	onLayout?: (event: LayoutChangeEvent) => void;
-	direction?: "vertical" | "horizontal";
-}
-
-/**
- * Returns scroll handlers and a native gesture for ScrollView coordination.
- *
- * Finds ALL gesture owners for the scroll axis (both directions) and coordinates
- * with each of them. This ensures that:
- * - A screen claiming `vertical-inverted` can handle swipe-up at bottom boundary
- * - An ancestor claiming `vertical` can handle swipe-down at top boundary
- * - Both work correctly with the same ScrollView
- */
-export const useScrollRegistry = (props: ScrollProgressHookProps) => {
-	const context = useGestureContext();
-	const scrollDirection = props.direction ?? "vertical";
-
-	// Find all owners for both directions on this axis
-	const owners = useMemo(
-		() => findGestureOwnersForAxis(context, scrollDirection),
-		[context, scrollDirection],
-	);
-
-	// Extract scrollConfigs and panGestures from owners
-	const scrollConfigs = useMemo(
-		() =>
-			owners
-				.map((o) => o.scrollConfig)
-				.filter((c): c is SharedValue<ScrollConfig | null> => c !== null),
-		[owners],
-	);
-
-	const panGestures = useMemo(
-		() =>
-			owners
-				.map((o) => o.panGesture)
-				.filter((g): g is GestureType => g !== null),
-		[owners],
-	);
-
-	const nativeGesture = useMemo(() => {
-		if (panGestures.length === 0 || scrollConfigs.length === 0) return null;
-
-		// Update isTouched on ALL registered scrollConfigs
-		const setIsTouched = () => {
-			"worklet";
-			for (const scrollConfig of scrollConfigs) {
-				scrollConfig.modify((v) => {
-					"worklet";
-					if (v) v.isTouched = true;
-					return v;
-				});
-			}
-		};
-
-		const clearIsTouched = () => {
-			"worklet";
-			for (const scrollConfig of scrollConfigs) {
-				scrollConfig.modify((v) => {
-					"worklet";
-					if (v) v.isTouched = false;
-					return v;
-				});
-			}
-		};
-
-		// Native gesture must require ALL pan gestures to fail
-		// This allows any direction owner to take control at the appropriate boundary
-		let gesture = Gesture.Native()
-			.onTouchesDown(setIsTouched)
-			.onTouchesUp(clearIsTouched)
-			.onTouchesCancelled(clearIsTouched);
-
-		for (const panGesture of panGestures) {
-			gesture = gesture.requireExternalGestureToFail(panGesture);
-		}
-
-		return gesture;
-	}, [panGestures, scrollConfigs]);
-
-	const isHorizontal = scrollDirection === "horizontal";
-
-	const scrollHandler = useAnimatedScrollHandler({
-		onScroll: (event) => {
-			if (scrollConfigs.length === 0) return;
-
-			const update = (v: any) => {
-				"worklet";
-				if (v === null) {
-					return {
-						x: isHorizontal ? event.contentOffset.x : 0,
-						y: isHorizontal ? 0 : event.contentOffset.y,
-						contentHeight: 0,
-						contentWidth: 0,
-						layoutHeight: 0,
-						layoutWidth: 0,
-						isTouched: true,
-					};
-				}
-				if (isHorizontal) {
-					v.x = event.contentOffset.x;
-				} else {
-					v.y = event.contentOffset.y;
-				}
-				return v;
-			};
-
-			// Update ALL registered scrollConfigs
-			for (const scrollConfig of scrollConfigs) {
-				scrollConfig.modify(update);
-			}
-		},
-	});
-
-	const onContentSizeChange = useStableCallback(
-		(width: number, height: number) => {
-			props.onContentSizeChange?.(width, height);
-			if (scrollConfigs.length === 0) return;
-
-			const update = (v: any) => {
-				"worklet";
-				if (v === null) {
-					return {
-						x: 0,
-						y: 0,
-						layoutHeight: 0,
-						layoutWidth: 0,
-						contentWidth: isHorizontal ? width : 0,
-						contentHeight: isHorizontal ? 0 : height,
-						isTouched: false,
-					};
-				}
-				if (isHorizontal) {
-					v.contentWidth = width;
-				} else {
-					v.contentHeight = height;
-				}
-				return v;
-			};
-
-			// Update ALL registered scrollConfigs
-			for (const scrollConfig of scrollConfigs) {
-				scrollConfig.modify(update);
-			}
-		},
-	);
-
-	const onLayout = useStableCallback((event: LayoutChangeEvent) => {
-		props.onLayout?.(event);
-		if (scrollConfigs.length === 0) return;
-
-		const { width, height } = event.nativeEvent.layout;
-
-		const update = (v: any) => {
-			"worklet";
-			if (v === null) {
-				return {
-					x: 0,
-					y: 0,
-					contentHeight: 0,
-					contentWidth: 0,
-					layoutHeight: isHorizontal ? 0 : height,
-					layoutWidth: isHorizontal ? width : 0,
-					isTouched: false,
-				};
-			}
-			if (isHorizontal) {
-				v.layoutWidth = width;
-			} else {
-				v.layoutHeight = height;
-			}
-			return v;
-		};
-
-		// Update ALL registered scrollConfigs
-		for (const scrollConfig of scrollConfigs) {
-			scrollConfig.modify(update);
-		}
-	});
-
-	return {
-		scrollHandler,
-		onContentSizeChange,
-		onLayout,
-		nativeGesture,
-	};
-};

package/src/shared/providers/gestures/gestures.provider.tsx

@@ -1,127 +0,0 @@
-/**
- * Gesture System - Core Provider
- *
- * Each screen gets a GestureContext containing:
- * - panGesture: Pan gesture handler for dismiss/snap
- * - scrollConfig: Scroll state for boundary detection
- * - claimedDirections: Which directions this screen handles
- * - childDirectionClaims: Claims registered by descendant screens
- *
- * ScrollView coordination is handled by useScrollRegistry, which finds the
- * gesture owner for the scroll axis and creates appropriate Native gestures.
- */
-
-import { useMemo } from "react";
-import { useSharedValue } from "react-native-reanimated";
-import { StackType } from "../../types/stack.types";
-import createProvider from "../../utils/create-provider";
-import { computeClaimedDirections } from "../../utils/gesture/compute-claimed-directions";
-import { validateSnapPoints } from "../../utils/gesture/validate-snap-points";
-import {
-	useDescriptorDerivations,
-	useDescriptors,
-} from "../screen/descriptors";
-import { useStackCoreContext } from "../stack/core.provider";
-import { useRegisterDirectionClaims } from "./helpers/register-direction-claims";
-import {
-	type DirectionClaimMap,
-	type GestureContextType,
-	NO_CLAIMS,
-	type ScrollConfig,
-} from "./types";
-import { useBuildGestures } from "./use-build-gestures";
-
-interface ScreenGestureProviderProps {
-	children: React.ReactNode;
-}
-
-export const {
-	ScreenGestureProvider,
-	useScreenGestureContext: useGestureContext,
-} = createProvider("ScreenGesture", { guarded: false })<
-	ScreenGestureProviderProps,
-	GestureContextType
->(({ children }): { value: GestureContextType; children: React.ReactNode } => {
-	const { current } = useDescriptors();
-	const { isFirstKey, isTopMostScreen } = useDescriptorDerivations();
-	const { flags } = useStackCoreContext();
-
-	const ancestorContext: GestureContextType | null = useGestureContext();
-	const isIsolated = flags.STACK_TYPE === StackType.COMPONENT;
-	const routeKey = current.route.key;
-
-	const canDismiss = Boolean(
-		isFirstKey ? false : current.options.gestureEnabled,
-	);
-
-	const { hasSnapPoints } = useMemo(
-		() =>
-			validateSnapPoints({
-				snapPoints: current.options.snapPoints,
-				canDismiss,
-			}),
-		[current.options.snapPoints, canDismiss],
-	);
-
-	const gestureEnabled = canDismiss || hasSnapPoints;
-
-	const claimedDirections = useMemo(
-		() =>
-			computeClaimedDirections(
-				gestureEnabled,
-				current.options.gestureDirection,
-				hasSnapPoints,
-			),
-		[gestureEnabled, current.options.gestureDirection, hasSnapPoints],
-	);
-
-	const scrollConfig = useSharedValue<ScrollConfig | null>(null);
-	const childDirectionClaims = useSharedValue<DirectionClaimMap>(NO_CLAIMS);
-
-	useRegisterDirectionClaims(
-		ancestorContext,
-		claimedDirections,
-		routeKey,
-		isIsolated,
-		isTopMostScreen,
-	);
-
-	const { panGesture, panGestureRef, gestureAnimationValues } =
-		useBuildGestures({
-			scrollConfig,
-			ancestorContext,
-			claimedDirections,
-			childDirectionClaims,
-			isIsolated,
-		});
-
-	const value = useMemo<GestureContextType>(
-		() => ({
-			panGesture,
-			panGestureRef,
-			scrollConfig,
-			gestureAnimationValues,
-			ancestorContext,
-			gestureEnabled,
-			isIsolated,
-			claimedDirections,
-			childDirectionClaims,
-		}),
-		[
-			panGesture,
-			panGestureRef,
-			scrollConfig,
-			gestureAnimationValues,
-			ancestorContext,
-			gestureEnabled,
-			isIsolated,
-			claimedDirections,
-			childDirectionClaims,
-		],
-	);
-
-	return {
-		value,
-		children,
-	};
-});