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

package/src/shared/providers/screen/gestures/pinch/pinch-release.ts

@@ -0,0 +1,183 @@
+import { clamp } from "react-native-reanimated";
+import {
+	getPinchReleaseHandoffVelocity,
+	normalizePinchScale,
+	shouldDismissFromPinch,
+} from "../shared/physics";
+import {
+	getProgressVelocityTowardTarget,
+	resolveGestureSnapTransitionSpec,
+} from "../shared/release";
+import {
+	primeRuntimeSnapPoint,
+	resolveRuntimeGestureSnapPoints,
+} from "../shared/snap-points";
+import { determineSnapTarget } from "../shared/targets";
+import type {
+	PinchGestureEvent,
+	PinchGestureRuntime,
+	PinchReleaseResult,
+} from "../types";
+
+const getPinchSnapDirection = (normalizedScale: number) => {
+	"worklet";
+	if (normalizedScale < 0) {
+		return "pinch-in";
+	}
+
+	if (normalizedScale > 0) {
+		return "pinch-out";
+	}
+
+	return null;
+};
+
+const getPinchSnapVelocity = (
+	event: PinchGestureEvent,
+	runtime: PinchGestureRuntime,
+	normalizedScale: number,
+) => {
+	"worklet";
+	const pinchDirection = getPinchSnapDirection(normalizedScale);
+	const snapDirections = runtime.policy.snapDirections;
+
+	if (!pinchDirection || !snapDirections) {
+		return 0;
+	}
+
+	return snapDirections.collapse === pinchDirection
+		? Math.abs(event.velocity)
+		: -Math.abs(event.velocity);
+};
+
+const getPinchSnapReleaseProgress = ({
+	runtime,
+	normalizedScale,
+	minSnapPoint,
+	maxSnapPoint,
+}: {
+	runtime: PinchGestureRuntime;
+	normalizedScale: number;
+	minSnapPoint: number;
+	maxSnapPoint: number;
+}) => {
+	"worklet";
+	const pinchDirection = getPinchSnapDirection(normalizedScale);
+	const snapDirections = runtime.policy.snapDirections;
+
+	if (!pinchDirection || !snapDirections) {
+		return runtime.stores.animations.progress.get();
+	}
+
+	const progressDelta =
+		snapDirections.collapse === pinchDirection
+			? -Math.abs(normalizedScale)
+			: Math.abs(normalizedScale);
+
+	return clamp(
+		runtime.gestureProgressBaseline.get() + progressDelta,
+		minSnapPoint,
+		maxSnapPoint,
+	);
+};
+
+export const primeSnapPinchRelease = (runtime: PinchGestureRuntime) => {
+	"worklet";
+	primeRuntimeSnapPoint(runtime);
+};
+
+export const resolvePinchRelease = (
+	event: PinchGestureEvent,
+	runtime: PinchGestureRuntime,
+): PinchReleaseResult => {
+	"worklet";
+	const {
+		participation,
+		policy,
+		gestureProgressBaseline,
+		stores: { animations },
+	} = runtime;
+	const normalizedScale = clamp(normalizePinchScale(event.scale), -1, 1);
+	const currentProgress = animations.progress.get();
+	const shouldDismiss =
+		participation.canDismiss &&
+		shouldDismissFromPinch(
+			normalizedScale,
+			policy.pinchInEnabled,
+			policy.pinchOutEnabled,
+		);
+	const target = shouldDismiss ? 0 : gestureProgressBaseline.get();
+
+	return {
+		target,
+		shouldDismiss,
+		initialVelocity: getProgressVelocityTowardTarget({
+			handoffVelocity: getPinchReleaseHandoffVelocity(
+				event.velocity,
+				policy.gestureReleaseVelocityScale,
+			),
+			target,
+			currentProgress,
+		}),
+		transitionSpec: policy.transitionSpec,
+		resetSpec: shouldDismiss
+			? policy.transitionSpec?.close
+			: policy.transitionSpec?.open,
+	};
+};
+
+export const resolveSnapPinchRelease = (
+	event: PinchGestureEvent,
+	runtime: PinchGestureRuntime,
+): PinchReleaseResult => {
+	"worklet";
+	const { participation, policy, lockedSnapPoint } = runtime;
+	const normalizedScale = clamp(normalizePinchScale(event.scale), -1, 1);
+
+	const { resolvedSnapPoints, resolvedMinSnapPoint, resolvedMaxSnapPoint } =
+		resolveRuntimeGestureSnapPoints(runtime);
+	const currentProgress = getPinchSnapReleaseProgress({
+		runtime,
+		normalizedScale,
+		minSnapPoint: resolvedMinSnapPoint,
+		maxSnapPoint: resolvedMaxSnapPoint,
+	});
+
+	const result = determineSnapTarget({
+		currentProgress,
+		snapPoints: policy.gestureSnapLocked
+			? [lockedSnapPoint.get()]
+			: resolvedSnapPoints,
+		velocity: getPinchSnapVelocity(event, runtime, normalizedScale),
+		dimension: 1,
+		velocityFactor: policy.gestureSnapVelocityImpact,
+		canDismiss: participation.canDismiss,
+	});
+
+	const shouldDismiss = participation.canDismiss && result.shouldDismiss;
+	const target = shouldDismiss ? 0 : result.targetProgress;
+
+	return {
+		target,
+		shouldDismiss,
+		initialVelocity: getProgressVelocityTowardTarget({
+			handoffVelocity: getPinchReleaseHandoffVelocity(
+				event.velocity,
+				policy.gestureReleaseVelocityScale,
+			),
+			target,
+			currentProgress,
+		}),
+		commitProgress: currentProgress,
+		resetValuesImmediately: policy.gestureProgressMode === "progress-driven",
+		transitionSpec: resolveGestureSnapTransitionSpec({
+			transitionSpec: policy.transitionSpec,
+			shouldDismiss,
+			target,
+			currentProgress,
+		}),
+		resetSpec: shouldDismiss
+			? policy.transitionSpec?.close
+			: policy.transitionSpec?.open,
+	};
+};

package/src/shared/providers/screen/gestures/pinch/pinch-reset.ts

@@ -0,0 +1,65 @@
+import { EPSILON, FALSE, TRUE } from "../../../../constants";
+import type { GestureStoreMap } from "../../../../stores/gesture.store";
+import type { AnimationConfig } from "../../../../types/animation.types";
+import {
+	animateResetValue,
+	clearGestureSettlingIfResting,
+	getGestureResetSpec,
+} from "../shared/reset";
+
+interface ResetPinchGestureValuesProps {
+	spec?: AnimationConfig;
+	gestures: GestureStoreMap;
+	shouldDismiss: boolean;
+	resetValuesImmediately?: boolean;
+}
+
+const clearPinchSettlingIfResting = (gestures: GestureStoreMap) => {
+	"worklet";
+
+	const isResting =
+		!gestures.dragging.get() &&
+		!gestures.dismissing.get() &&
+		Math.abs(gestures.scale.get() - 1) <= EPSILON &&
+		Math.abs(gestures.normScale.get()) <= EPSILON;
+
+	if (isResting) {
+		gestures.focalX.set(0);
+		gestures.focalY.set(0);
+	}
+
+	clearGestureSettlingIfResting(gestures, isResting);
+};
+
+export const resetPinchGestureValues = ({
+	spec,
+	gestures,
+	shouldDismiss,
+	resetValuesImmediately = false,
+}: ResetPinchGestureValuesProps) => {
+	"worklet";
+	const resetSpec = getGestureResetSpec(spec);
+
+	if (!shouldDismiss) {
+		gestures.raw.scale.set(1);
+		gestures.raw.normScale.set(0);
+	}
+
+	gestures.dragging.set(FALSE);
+	gestures.dismissing.set(shouldDismiss ? TRUE : FALSE);
+	gestures.settling.set(shouldDismiss ? FALSE : TRUE);
+
+	if (resetValuesImmediately) {
+		gestures.scale.set(1);
+		gestures.normScale.set(0);
+		clearPinchSettlingIfResting(gestures);
+		return;
+	}
+
+	animateResetValue(gestures.scale, 1, resetSpec, () =>
+		clearPinchSettlingIfResting(gestures),
+	);
+	animateResetValue(gestures.normScale, 0, resetSpec, () =>
+		clearPinchSettlingIfResting(gestures),
+	);
+};

package/src/shared/providers/screen/gestures/{behaviors → pinch}/use-pinch-behavior.ts

@@ -1,31 +1,24 @@
-import { useCallback } from "react";
+import { useCallback, useMemo } from "react";
 import type { SharedValue } from "react-native-reanimated";
 import { useNavigationHelpers } from "../../../../hooks/navigation/use-navigation-helpers";
 import type { ScreenOptionsContextValue } from "../../options";
-import {
-	finalizePinchRelease,
-	startPinchBase,
-	trackPinchGesture,
-} from "../helpers/pinch-phases";
-import { resolvePinchRuntime } from "../helpers/runtime-options";
 import { usePinchGestureSensitivity } from "../hooks/use-gesture-sensitivity";
+import { resolvePinchRuntime } from "../shared/runtime";
 import type {
 	PinchBehavior,
-	PinchBehaviorStrategy,
 	PinchGestureEvent,
 	PinchGestureRuntime,
 } from "../types";
-import { PinchStrategy } from "./strategies/pinch.strategy";
-import { SnapPinchStrategy } from "./strategies/pinch-snap.strategy";
-
-const getPinchStrategy = (
-	runtime: PinchGestureRuntime,
-): PinchBehaviorStrategy => {
-	"worklet";
-	return runtime.participation.effectiveSnapPoints.hasSnapPoints
-		? SnapPinchStrategy
-		: PinchStrategy;
-};
+import {
+	finalizePinchRelease,
+	startPinchBase,
+	trackPinchGesture,
+} from "./pinch-lifecycle";
+import {
+	primeSnapPinchRelease,
+	resolvePinchRelease,
+	resolveSnapPinchRelease,
+} from "./pinch-release";
 
 export const usePinchBehavior = (
 	runtime: SharedValue<PinchGestureRuntime>,
@@ -42,8 +35,9 @@ export const usePinchBehavior = (
 				runtime.get(),
 				screenOptions.get(),
 			);
-			const strategy = getPinchStrategy(latestRuntime);
-			strategy.primeStart(latestRuntime);
+			if (latestRuntime.participation.effectiveSnapPoints.hasSnapPoints) {
+				primeSnapPinchRelease(latestRuntime);
+			}
 			startPinchBase(latestRuntime, event);
 			resetSensitivity();
 		},
@@ -57,21 +51,8 @@ export const usePinchBehavior = (
 				runtime.get(),
 				screenOptions.get(),
 			);
-			const strategy = getPinchStrategy(latestRuntime);
 			const event = withSensitivity(rawEvent);
-			const track = trackPinchGesture(
-				event,
-				rawEvent,
-				latestRuntime.stores.gestures,
-			);
-
-			if (!latestRuntime.policy.gestureDrivesProgress) {
-				return;
-			}
-
-			latestRuntime.stores.animations.progress.set(
-				strategy.resolveProgress(latestRuntime, track),
-			);
+			trackPinchGesture(event, rawEvent, latestRuntime.stores.gestures);
 		},
 		[runtime, screenOptions, withSensitivity],
 	);
@@ -83,17 +64,22 @@ export const usePinchBehavior = (
 				runtime.get(),
 				screenOptions.get(),
 			);
-			const strategy = getPinchStrategy(latestRuntime);
 			const event = withSensitivity(rawEvent);
-			const release = strategy.resolveRelease(event, latestRuntime);
+			const release = latestRuntime.participation.effectiveSnapPoints
+				.hasSnapPoints
+				? resolveSnapPinchRelease(event, latestRuntime)
+				: resolvePinchRelease(event, latestRuntime);
 			finalizePinchRelease(release, latestRuntime, dismissScreen);
 		},
 		[runtime, screenOptions, dismissScreen, withSensitivity],
 	);
 
-	return {
-		onStart,
-		onUpdate,
-		onEnd,
-	};
+	return useMemo(
+		() => ({
+			onStart,
+			onUpdate,
+			onEnd,
+		}),
+		[onStart, onUpdate, onEnd],
+	);
 };

package/src/shared/providers/screen/gestures/{hooks/use-scroll-gesture-coordination → scroll-coordination}/update-scroll-gesture-state.ts

@@ -2,7 +2,7 @@ import type {
 	ScrollGestureAxis,
 	ScrollGestureAxisState,
 	ScrollGestureState,
-} from "../../types";
+} from "../types";
 
 const createScrollGestureState = (): ScrollGestureState => {
 	"worklet";

package/src/shared/providers/screen/gestures/{hooks/use-scroll-gesture-coordination → scroll-coordination}/use-scroll-gesture-coordination.ts

@@ -6,15 +6,15 @@ import {
 	useAnimatedScrollHandler,
 	useDerivedValue,
 } from "react-native-reanimated";
-import { useSharedValueState } from "../../../../../hooks/reanimated/use-shared-value-state";
-import useStableCallback from "../../../../../hooks/use-stable-callback";
-import { AnimationStore } from "../../../../../stores/animation.store";
-import { useGestureContext } from "../../gestures.provider";
+import { useSharedValueState } from "../../../../hooks/reanimated/use-shared-value-state";
+import useStableCallback from "../../../../hooks/use-stable-callback";
+import { AnimationStore } from "../../../../stores/animation.store";
+import { useGestureContext } from "../gestures.provider";
 import type {
 	ScrollGestureAxis,
 	ScrollGestureAxisState,
 	ScrollGestureState,
-} from "../../types";
+} from "../types";
 import { updateScrollGestureAxisState } from "./update-scroll-gesture-state";
 import { walkUpScrollGestureCoordination } from "./walk-up-scroll-gesture-coordination";
 

package/src/shared/providers/screen/gestures/{hooks/use-scroll-gesture-coordination → scroll-coordination}/walk-up-scroll-gesture-coordination.ts

@@ -1,13 +1,13 @@
 import type { SharedValue } from "react-native-reanimated";
-import type { Direction } from "../../../../../types/ownership.types";
-import { walkGestureAncestors } from "../../helpers/walk-gesture-ancestors";
+import type { Direction } from "../../../../types/ownership.types";
+import { walkGestureAncestors } from "../shared/ancestors";
 import type {
 	GestureContextType,
 	PanGesture,
 	PinchGesture,
 	ScrollGestureAxis,
 	ScrollGestureState,
-} from "../../types";
+} from "../types";
 
 /** Walks up the gesture tree until it finds the owner for a specific direction. */
 function findGestureOwnerForDirection(
@@ -21,28 +21,15 @@ function findGestureOwnerForDirection(
 	return null;
 }
 
-interface WalkUpScrollGestureCoordinationResult {
-	panGestures: PanGesture[];
-	pinchGestures: PinchGesture[];
-	scrollStates: SharedValue<ScrollGestureState | null>[];
-	ownerRouteKeys: string[];
-}
-
-export function walkUpScrollGestureCoordination(
-	context: GestureContextType | null,
+const getDirectionsForAxis = (
 	axis: ScrollGestureAxis,
-): WalkUpScrollGestureCoordinationResult {
-	const directions: readonly [Direction, Direction] =
-		axis === "vertical"
-			? ["vertical", "vertical-inverted"]
-			: ["horizontal", "horizontal-inverted"];
+): readonly [Direction, Direction] =>
+	axis === "vertical"
+		? ["vertical", "vertical-inverted"]
+		: ["horizontal", "horizontal-inverted"];
 
-	const seenOwners: GestureContextType[] = [];
-	const panGestures: GestureContextType["panGesture"][] = [];
+const collectAncestorPinchGestures = (ancestors: GestureContextType[]) => {
 	const pinchGestures: GestureContextType["pinchGesture"][] = [];
-	const scrollStates: GestureContextType["scrollState"][] = [];
-	const ownerRouteKeys: string[] = [];
-	const ancestors = walkGestureAncestors(context);
 
 	for (const ancestor of ancestors) {
 		if (!pinchGestures.includes(ancestor.pinchGesture)) {
@@ -50,6 +37,18 @@ export function walkUpScrollGestureCoordination(
 		}
 	}
 
+	return pinchGestures;
+};
+
+const collectAxisOwners = (
+	ancestors: GestureContextType[],
+	directions: readonly [Direction, Direction],
+) => {
+	const seenOwners: GestureContextType[] = [];
+	const panGestures: GestureContextType["panGesture"][] = [];
+	const scrollStates: GestureContextType["scrollState"][] = [];
+	const ownerRouteKeys: string[] = [];
+
 	for (const direction of directions) {
 		const owner = findGestureOwnerForDirection(ancestors, direction);
 
@@ -63,10 +62,27 @@ export function walkUpScrollGestureCoordination(
 		ownerRouteKeys.push(owner.routeKey);
 	}
 
+	return { panGestures, scrollStates, ownerRouteKeys };
+};
+
+interface WalkUpScrollGestureCoordinationResult {
+	panGestures: PanGesture[];
+	pinchGestures: PinchGesture[];
+	scrollStates: SharedValue<ScrollGestureState | null>[];
+	ownerRouteKeys: string[];
+}
+
+export function walkUpScrollGestureCoordination(
+	context: GestureContextType | null,
+	axis: ScrollGestureAxis,
+): WalkUpScrollGestureCoordinationResult {
+	const ancestors = walkGestureAncestors(context);
+	const axisOwners = collectAxisOwners(ancestors, getDirectionsForAxis(axis));
+
 	return {
-		panGestures,
-		pinchGestures,
-		scrollStates,
-		ownerRouteKeys,
+		panGestures: axisOwners.panGestures,
+		pinchGestures: collectAncestorPinchGestures(ancestors),
+		scrollStates: axisOwners.scrollStates,
+		ownerRouteKeys: axisOwners.ownerRouteKeys,
 	};
 }