react-native-screen-transitions 3.6.0-alpha.1 → 3.6.0-alpha.3

package/src/shared/providers/register-bounds.provider.tsx

@@ -11,25 +11,24 @@ import {
 	useSharedValue,
 } from "react-native-reanimated";
 import type { SharedValue } from "react-native-reanimated/lib/typescript/commonTypes";
-import { applyMeasuredBoundsWrites } from "../components/create-boundary-component/helpers/apply-measured-bounds-writes";
 import useStableCallback from "../hooks/use-stable-callback";
 import useStableCallbackValue from "../hooks/use-stable-callback-value";
 import { AnimationStore } from "../stores/animation.store";
-import { getEntry } from "../stores/bounds/internals/entries";
 import {
-	getPendingLink,
-	hasDestinationLink,
-	hasSourceLink,
-} from "../stores/bounds/internals/links";
+	createPendingPairKey,
+	createScreenPairKey,
+} from "../stores/bounds/helpers/link-pairs.helpers";
+import { getEntry } from "../stores/bounds/internals/entries";
+import { getDestination, getSource } from "../stores/bounds/internals/links";
 import { prepareStyleForBounds } from "../utils/bounds/helpers/styles/styles";
 import createProvider from "../utils/create-provider";
+import { applyMeasuredBoundsWrites } from "./helpers/measured-bounds-writes";
 import { useDescriptorDerivations, useDescriptors } from "./screen/descriptors";
 
 interface MaybeMeasureAndStoreParams {
 	onPress?: ((...args: unknown[]) => void) | undefined;
 	shouldSetSource?: boolean;
 	shouldSetDestination?: boolean;
-	shouldUpdateSource?: boolean;
 }
 
 interface RegisterBoundsRenderProps {
@@ -208,48 +207,14 @@ const useParentSyncReaction = (params: {
 	);
 };
 
-const CloseRemeasureReactionEffect = (params: {
-	sharedBoundTag: string;
-	remeasureOnFocus: boolean;
-	nextClosing: SharedValue<number>;
-	maybeMeasureAndStore: (options: MaybeMeasureAndStoreParams) => void;
-}) => {
-	const {
-		sharedBoundTag,
-		remeasureOnFocus,
-		nextClosing,
-		maybeMeasureAndStore,
-	} = params;
-
-	useAnimatedReaction(
-		() => nextClosing.get(),
-		(closing, prevClosing) => {
-			"worklet";
-			if (closing === 1 && (prevClosing === 0 || prevClosing === null)) {
-				maybeMeasureAndStore({ shouldUpdateSource: true });
-			}
-		},
-		[sharedBoundTag, remeasureOnFocus, nextClosing],
-	);
-
-	return null;
-};
-
 let useRegisterBoundsContext: () => RegisterBoundsContextValue | null;
 
 const registerBoundsBundle = createProvider("RegisterBounds", {
 	guarded: false,
 })<RegisterBoundsProviderProps, RegisterBoundsContextValue>(
-	({
-		style,
-		onPress,
-		sharedBoundTag,
-		animatedRef,
-		remeasureOnFocus,
-		children,
-	}) => {
+	({ style, onPress, sharedBoundTag, animatedRef, children }) => {
 		const { current, next } = useDescriptors();
-		const { ancestorKeys } = useDescriptorDerivations();
+		const { ancestorKeys, previousScreenKey } = useDescriptorDerivations();
 		const currentScreenKey = current.route.key;
 		const selectedNextRouteId = getRouteParamId(next?.route);
 
@@ -277,7 +242,6 @@ const registerBoundsBundle = createProvider("RegisterBounds", {
 				onPress,
 				shouldSetSource,
 				shouldSetDestination,
-				shouldUpdateSource,
 			}: MaybeMeasureAndStoreParams = {}) => {
 				"worklet";
 				if (!sharedBoundTag) {
@@ -285,15 +249,27 @@ const registerBoundsBundle = createProvider("RegisterBounds", {
 					return;
 				}
 
+				const sourcePairKey = createPendingPairKey(currentScreenKey);
+				const destinationPairKey = previousScreenKey
+					? createScreenPairKey(previousScreenKey, currentScreenKey)
+					: undefined;
+				const pendingSourcePairKey = previousScreenKey
+					? createPendingPairKey(previousScreenKey)
+					: undefined;
+
 				if (shouldSetSource && isAnimating.get()) {
 					const existing = getEntry(sharedBoundTag, currentScreenKey);
 					if (existing?.bounds) {
 						applyMeasuredBoundsWrites({
-							sharedBoundTag,
+							entryTag: sharedBoundTag,
+							linkId: sharedBoundTag,
 							currentScreenKey,
 							measured: existing.bounds,
 							preparedStyles,
-							shouldSetSource: true,
+							linkWrite: {
+								type: "source",
+								pairKey: sourcePairKey,
+							},
 						});
 					}
 
@@ -301,31 +277,30 @@ const registerBoundsBundle = createProvider("RegisterBounds", {
 					return;
 				}
 
-				const hasPending = getPendingLink(sharedBoundTag) !== null;
-				const hasSource = hasSourceLink(sharedBoundTag, currentScreenKey);
-				const hasDestination = hasDestinationLink(
-					sharedBoundTag,
-					currentScreenKey,
-				);
+				const hasPendingSource = pendingSourcePairKey
+					? getSource(pendingSourcePairKey, sharedBoundTag) !== null
+					: false;
+				const hasSource =
+					getSource(sourcePairKey, sharedBoundTag) !== null ||
+					(destinationPairKey
+						? getSource(destinationPairKey, sharedBoundTag) !== null
+						: false);
+				const hasDestination = destinationPairKey
+					? getDestination(destinationPairKey, sharedBoundTag) !== null
+					: false;
 
 				const wantsSetSource = !!shouldSetSource;
 				const wantsSetDestination = !!shouldSetDestination;
-				const wantsUpdateSource = !!shouldUpdateSource;
-				const wantsSnapshotOnly =
-					!wantsSetSource && !wantsSetDestination && !wantsUpdateSource;
+				const wantsSnapshotOnly = !wantsSetSource && !wantsSetDestination;
 
 				const canSetSource = wantsSetSource;
-				const canSetDestination = wantsSetDestination && hasPending;
-				const canUpdateSource = wantsUpdateSource && hasSource;
+				const canSetDestination =
+					wantsSetDestination && (hasPendingSource || hasSource);
 				const canSnapshotOnly =
-					wantsSnapshotOnly && (hasPending || hasSource || hasDestination);
-
-				if (
-					!canSetSource &&
-					!canSetDestination &&
-					!canUpdateSource &&
-					!canSnapshotOnly
-				) {
+					wantsSnapshotOnly &&
+					(hasPendingSource || hasSource || hasDestination);
+
+				if (!canSetSource && !canSetDestination && !canSnapshotOnly) {
 					if (onPress) runOnJS(onPress)();
 					return;
 				}
@@ -339,15 +314,38 @@ const registerBoundsBundle = createProvider("RegisterBounds", {
 				emitUpdate();
 
 				applyMeasuredBoundsWrites({
-					sharedBoundTag,
+					entryTag: sharedBoundTag,
+					linkId: sharedBoundTag,
 					currentScreenKey,
 					measured,
 					preparedStyles,
-					shouldSetSource: canSetSource,
-					shouldUpdateSource: canUpdateSource,
-					shouldSetDestination: canSetDestination,
+					linkWrite: canSetSource
+						? {
+								type: "source",
+								pairKey: sourcePairKey,
+							}
+						: canSetDestination && destinationPairKey
+							? {
+									type: "destination",
+									pairKey: destinationPairKey,
+								}
+							: undefined,
 				});
 
+				if (canSetSource && canSetDestination && destinationPairKey) {
+					applyMeasuredBoundsWrites({
+						entryTag: sharedBoundTag,
+						linkId: sharedBoundTag,
+						currentScreenKey,
+						measured,
+						preparedStyles,
+						linkWrite: {
+							type: "destination",
+							pairKey: destinationPairKey,
+						},
+					});
+				}
+
 				if (onPress) runOnJS(onPress)();
 			},
 		);
@@ -368,15 +366,6 @@ const registerBoundsBundle = createProvider("RegisterBounds", {
 			ancestorKeys,
 		});
 
-		// Re-measure source bounds when the destination screen (next in stack)
-		// starts closing. This fires at the instant the back animation begins,
-		// unlike useFocusEffect which fires too late (after the screen is removed
-		// from state).
-		const nextScreenKey = next?.route.key;
-		const nextClosing = nextScreenKey
-			? AnimationStore.getValue(nextScreenKey, "closing")
-			: null;
-
 		useParentSyncReaction({ parentContext, maybeMeasureAndStore });
 
 		const captureActiveOnPress = useStableCallback(() => {
@@ -390,19 +379,7 @@ const registerBoundsBundle = createProvider("RegisterBounds", {
 
 		return {
 			value: { updateSignal },
-			children: (
-				<>
-					{sharedBoundTag && remeasureOnFocus && nextClosing ? (
-						<CloseRemeasureReactionEffect
-							sharedBoundTag={sharedBoundTag}
-							remeasureOnFocus={remeasureOnFocus}
-							nextClosing={nextClosing}
-							maybeMeasureAndStore={maybeMeasureAndStore}
-						/>
-					) : null}
-					{children({ handleInitialLayout, captureActiveOnPress })}
-				</>
-			),
+			children: <>{children({ handleInitialLayout, captureActiveOnPress })}</>,
 		};
 	},
 );

package/src/shared/providers/screen/animation/helpers/accessors/use-build-transition-accessor.ts

@@ -72,20 +72,6 @@ export const createTransitionAccessor = (
 		return {
 			...frame,
 			bounds: source.boundsAccessor,
-			transition: (target?: ScreenTransitionTarget) => {
-				"worklet";
-				const targetIndex = resolveTargetIndex(
-					target,
-					sourceIndex,
-					currentSources.length,
-				);
-
-				if (targetIndex === -1) {
-					return null;
-				}
-
-				return buildScope(targetIndex);
-			},
 		};
 	};
 

package/src/shared/providers/screen/animation/helpers/build-screen-transition-options.ts

@@ -38,6 +38,7 @@ export const buildScreenTransitionOptions = (
 		: undefined;
 
 	return {
+		navigationMaskEnabled: options.navigationMaskEnabled,
 		gestureEnabled: options.gestureEnabled,
 		experimental_allowDisabledGestureTracking:
 			options.experimental_allowDisabledGestureTracking,

package/src/shared/providers/screen/animation/helpers/hydrate-transition-state/index.ts

@@ -18,11 +18,51 @@ import {
 } from "./snap-points";
 import type { BuiltState } from "./types";
 
-export { computeLogicallySettled } from "./settle";
-
 const LOGICAL_SETTLE_STICKY_PROGRESS_THRESHOLD =
 	LOGICAL_SETTLE_PROGRESS_THRESHOLD * 10;
 
+const mergeTransitionOptions = (
+	base: ScreenTransitionOptions,
+	effective: ScreenTransitionOptions | undefined,
+	slot: ScreenTransitionOptions,
+): ScreenTransitionOptions => {
+	"worklet";
+	if (!effective) {
+		return base;
+	}
+
+	slot.navigationMaskEnabled =
+		effective.navigationMaskEnabled ?? base.navigationMaskEnabled;
+	slot.gestureEnabled = effective.gestureEnabled ?? base.gestureEnabled;
+	slot.experimental_allowDisabledGestureTracking =
+		effective.experimental_allowDisabledGestureTracking ??
+		base.experimental_allowDisabledGestureTracking;
+	slot.gestureDirection = effective.gestureDirection ?? base.gestureDirection;
+	slot.gestureSensitivity =
+		effective.gestureSensitivity ?? base.gestureSensitivity;
+	slot.gestureVelocityImpact =
+		effective.gestureVelocityImpact ?? base.gestureVelocityImpact;
+	slot.gestureSnapVelocityImpact =
+		effective.gestureSnapVelocityImpact ?? base.gestureSnapVelocityImpact;
+	slot.gestureReleaseVelocityScale =
+		effective.gestureReleaseVelocityScale ?? base.gestureReleaseVelocityScale;
+	slot.gestureResponseDistance =
+		effective.gestureResponseDistance ?? base.gestureResponseDistance;
+	slot.gestureProgressMode =
+		effective.gestureProgressMode ?? base.gestureProgressMode;
+	slot.gestureDrivesProgress =
+		effective.gestureDrivesProgress ?? base.gestureDrivesProgress;
+	slot.gestureActivationArea =
+		effective.gestureActivationArea ?? base.gestureActivationArea;
+	slot.gestureSnapLocked =
+		effective.gestureSnapLocked ?? base.gestureSnapLocked;
+	slot.sheetScrollGestureBehavior =
+		effective.sheetScrollGestureBehavior ?? base.sheetScrollGestureBehavior;
+	slot.backdropBehavior = effective.backdropBehavior ?? base.backdropBehavior;
+
+	return slot;
+};
+
 export const hydrateTransitionState = (
 	s: BuiltState,
 	dimensions: Layout,
@@ -31,6 +71,11 @@ export const hydrateTransitionState = (
 	"worklet";
 	const out = s.unwrapped;
 	const baseProgress = s.progress.get();
+	const options = mergeTransitionOptions(
+		s.options,
+		effectiveOptions,
+		s.optionsSlot,
+	);
 	out.willAnimate = s.willAnimate.get();
 	out.closing = s.closing.get();
 	out.entering = s.entering.get();
@@ -38,6 +83,7 @@ export const hydrateTransitionState = (
 	out.gesture.y = s.gesture.y.get();
 	out.gesture.normX = s.gesture.normX.get();
 	out.gesture.normY = s.gesture.normY.get();
+	out.gesture.velocity = s.gesture.velocity.get();
 	out.gesture.scale = s.gesture.scale.get();
 	out.gesture.normScale = s.gesture.normScale.get();
 	out.gesture.focalX = s.gesture.focalX.get();
@@ -124,11 +170,10 @@ export const hydrateTransitionState = (
 		computedLogicallySettled || shouldPreserveLogicalSettle ? 1 : 0;
 
 	out.meta = s.meta;
-	out.options = s.options;
+	out.options = options;
 	out.route = s.route;
 	out.layouts.screen.width = dimensions.width;
 	out.layouts.screen.height = dimensions.height;
-	out.layouts.navigationMaskEnabled = s.navigationMaskEnabled;
 
 	const content = s.measuredContentLayout.get();
 

package/src/shared/providers/screen/animation/helpers/hydrate-transition-state/types.ts

@@ -17,7 +17,7 @@ export type BuiltState = {
 	route: BaseStackRoute;
 	meta?: Record<string, unknown>;
 	options: ScreenTransitionOptions;
-	navigationMaskEnabled: boolean;
+	optionsSlot: ScreenTransitionOptions;
 	targetProgress: SharedValue<number>;
 	logicalSettleFrameCount: SharedValue<number>;
 	resolvedAutoSnapPoint: SharedValue<number>;

package/src/shared/providers/screen/animation/helpers/pipeline.ts

@@ -20,10 +20,7 @@ import { hydrateTransitionState } from "./hydrate-transition-state";
 import type { SelectedInterpolatorOptions } from "./selected-interpolator-options";
 import { useBuildTransitionState } from "./use-build-transition-state";
 
-export type ScreenInterpolatorFrame = Omit<
-	ScreenInterpolationProps,
-	"bounds" | "transition"
->;
+export type ScreenInterpolatorFrame = Omit<ScreenInterpolationProps, "bounds">;
 
 interface ScreenAnimationPipeline {
 	screenInterpolatorProps: SharedValue<ScreenInterpolatorFrame>;
@@ -39,7 +36,7 @@ const createInitialBaseInterpolatorProps = (
 ): ScreenInterpolatorFrame => {
 	const current = {
 		...DEFAULT_SCREEN_TRANSITION_STATE,
-		layouts: { screen: dimensions, navigationMaskEnabled: false },
+		layouts: { screen: dimensions },
 	};
 
 	return {

package/src/shared/providers/screen/animation/helpers/selected-interpolator-options.ts

@@ -59,6 +59,7 @@ const areInterpolatorOptionsEqual = (
 	if (!left || !right) return false;
 
 	return (
+		left.navigationMaskEnabled === right.navigationMaskEnabled &&
 		left.gestureEnabled === right.gestureEnabled &&
 		left.experimental_allowDisabledGestureTracking ===
 			right.experimental_allowDisabledGestureTracking &&

package/src/shared/providers/screen/animation/helpers/use-build-transition-state.ts

@@ -27,7 +27,7 @@ type BuiltState = {
 	route: BaseStackRoute;
 	meta?: Record<string, unknown>;
 	options: ScreenTransitionOptions;
-	navigationMaskEnabled: boolean;
+	optionsSlot: ScreenTransitionOptions;
 	targetProgress: SharedValue<number>;
 	logicalSettleFrameCount: SharedValue<number>;
 	resolvedAutoSnapPoint: SharedValue<number>;
@@ -44,7 +44,6 @@ export const useBuildTransitionState = (
 	const key = descriptor?.route?.key;
 	const meta = descriptor?.options?.meta;
 	const route = descriptor?.route;
-	const navigationMaskEnabled = !!descriptor?.options?.navigationMaskEnabled;
 	const snapPoints = descriptor?.options?.snapPoints;
 
 	return useMemo(() => {
@@ -81,20 +80,12 @@ export const useBuildTransitionState = (
 			route: plainRoute,
 			meta: plainMeta,
 			options: transitionOptions,
-			navigationMaskEnabled,
+			optionsSlot: {},
 			unwrapped: createScreenTransitionState(
 				plainRoute,
 				plainMeta,
-				navigationMaskEnabled,
 				transitionOptions,
 			),
 		};
-	}, [
-		key,
-		meta,
-		route,
-		snapPoints,
-		navigationMaskEnabled,
-		descriptor?.options,
-	]);
+	}, [key, meta, route, snapPoints, descriptor?.options]);
 };

package/src/shared/providers/screen/gestures/pan/pan-activation.ts

@@ -128,5 +128,8 @@ export const usePanActivation = ({
 		],
 	);
 
-	return { onTouchesDown, onTouchesMove };
+	return useMemo(
+		() => ({ onTouchesDown, onTouchesMove }),
+		[onTouchesDown, onTouchesMove],
+	);
 };

package/src/shared/providers/screen/gestures/pan/pan-lifecycle.ts

@@ -2,7 +2,10 @@ import { clamp } from "react-native-reanimated";
 import { EPSILON, FALSE, TRUE } from "../../../../constants";
 import { animateToProgress } from "../../../../utils/animation/animate-to-progress";
 import { emit } from "../../../../utils/animation/emit";
-import { normalizeGestureTranslation } from "../shared/physics";
+import {
+	normalizeGestureTranslation,
+	resolveGestureVelocity,
+} from "../shared/physics";
 import type {
 	GestureDimensions,
 	PanGestureEvent,
@@ -36,6 +39,7 @@ export const startPanBase = (runtime: PanGestureRuntime) => {
 	gestures.y.set(0);
 	gestures.normX.set(0);
 	gestures.normY.set(0);
+	gestures.velocity.set(0);
 	gestures.raw.x.set(0);
 	gestures.raw.y.set(0);
 	gestures.raw.normX.set(0);
@@ -51,18 +55,28 @@ export const trackPanGesture = (
 ): PanTrackState => {
 	"worklet";
 	const { translationX: x, translationY: y } = event;
-	const { translationX: rawX, translationY: rawY } = rawEvent;
+	const {
+		translationX: rawX,
+		translationY: rawY,
+		velocityX,
+		velocityY,
+	} = rawEvent;
 	const { width, height } = dimensions;
 
 	const normX = clamp(normalizeGestureTranslation(x, width), -1, 1);
 	const normY = clamp(normalizeGestureTranslation(y, height), -1, 1);
 	const rawNormX = clamp(normalizeGestureTranslation(rawX, width), -1, 1);
 	const rawNormY = clamp(normalizeGestureTranslation(rawY, height), -1, 1);
+	const velocity = resolveGestureVelocity(
+		velocityX / Math.max(1, width),
+		velocityY / Math.max(1, height),
+	);
 
 	gestures.x.set(x);
 	gestures.y.set(y);
 	gestures.normX.set(normX);
 	gestures.normY.set(normY);
+	gestures.velocity.set(velocity);
 	gestures.raw.x.set(rawX);
 	gestures.raw.y.set(rawY);
 	gestures.raw.normX.set(rawNormX);
@@ -73,6 +87,7 @@ export const trackPanGesture = (
 		y,
 		normX,
 		normY,
+		velocity,
 	};
 };
 
@@ -102,6 +117,7 @@ export const finalizePanRelease = (
 		velocityY: plan.resetVelocityY,
 		velocityNormX: plan.resetVelocityNormX,
 		velocityNormY: plan.resetVelocityNormY,
+		releaseVelocity: plan.releaseVelocity,
 		resetNormalizedValues: plan.resetNormalizedValues,
 		resetNormalizedValuesImmediately: plan.resetNormalizedValuesImmediately,
 		preserveRawValues: plan.preserveRawValues,

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

@@ -6,6 +6,7 @@ import {
 import {
 	getPanReleaseHandoffVelocity,
 	getPanReleaseProgressVelocity,
+	resolveGestureVelocity,
 } from "../shared/physics";
 import {
 	getProgressVelocityTowardTarget,
@@ -24,6 +25,26 @@ import type {
 	PanReleaseResult,
 } from "../types";
 
+const resolvePanReleaseVelocity = (
+	runtime: PanGestureRuntime,
+	velocityNormX: number,
+	velocityNormY: number,
+) => {
+	"worklet";
+	const activeGesture = runtime.stores.gestures.active.get();
+
+	switch (activeGesture) {
+		case "horizontal":
+		case "horizontal-inverted":
+			return resolveGestureVelocity(velocityNormX, 0);
+		case "vertical":
+		case "vertical-inverted":
+			return resolveGestureVelocity(0, velocityNormY);
+		default:
+			return resolveGestureVelocity(velocityNormX, velocityNormY);
+	}
+};
+
 const resolveActivePanSnapAxis = (runtime: PanGestureRuntime) => {
 	"worklet";
 	const activeGesture = runtime.stores.gestures.active.get();
@@ -226,6 +247,17 @@ export const buildPanReleasePlan = (
 		resetVelocityScale === 0 ? 0 : rawEvent.velocityX * resetVelocityScale;
 	const resetVelocityY =
 		resetVelocityScale === 0 ? 0 : rawEvent.velocityY * resetVelocityScale;
+	const releaseVelocityNormX =
+		rawEvent.velocityX / Math.max(1, dimensions.width);
+	const releaseVelocityNormY =
+		rawEvent.velocityY / Math.max(1, dimensions.height);
+	const releaseVelocity = release.shouldDismiss
+		? resolvePanReleaseVelocity(
+				runtime,
+				releaseVelocityNormX,
+				releaseVelocityNormY,
+			)
+		: 0;
 
 	return {
 		target: release.target,
@@ -235,6 +267,7 @@ export const buildPanReleasePlan = (
 		resetVelocityY,
 		resetVelocityNormX: resetVelocityX / Math.max(1, dimensions.width),
 		resetVelocityNormY: resetVelocityY / Math.max(1, dimensions.height),
+		releaseVelocity,
 		resetNormalizedValues: !release.shouldDismiss || progressDriven,
 		resetNormalizedValuesImmediately:
 			release.resetNormalizedValuesImmediately === true,

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

@@ -15,6 +15,7 @@ interface ResetPanGestureValuesProps {
 	velocityY?: number;
 	velocityNormX?: number;
 	velocityNormY?: number;
+	releaseVelocity?: number;
 	resetNormalizedValues?: boolean;
 	resetNormalizedValuesImmediately?: boolean;
 	preserveRawValues?: boolean;
@@ -42,6 +43,7 @@ export const resetPanGestureValues = ({
 	velocityY,
 	velocityNormX,
 	velocityNormY,
+	releaseVelocity,
 	resetNormalizedValues = true,
 	resetNormalizedValuesImmediately = false,
 	preserveRawValues = shouldDismiss,
@@ -58,6 +60,7 @@ export const resetPanGestureValues = ({
 	gestures.dragging.set(FALSE);
 	gestures.dismissing.set(shouldDismiss ? TRUE : FALSE);
 	gestures.settling.set(shouldDismiss ? FALSE : TRUE);
+	gestures.velocity.set(shouldDismiss ? (releaseVelocity ?? 0) : 0);
 
 	animateResetValue(gestures.x, 0, getGestureResetSpec(spec, velocityX), () =>
 		clearPanSettlingIfResting(gestures),

package/src/shared/providers/screen/gestures/pan/use-pan-behavior.ts

@@ -1,4 +1,4 @@
-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";
@@ -81,9 +81,12 @@ export const usePanBehavior = (
 		[runtime, screenOptions, dimensions, dismissScreen, withSensitivity],
 	);
 
-	return {
-		onStart,
-		onUpdate,
-		onEnd,
-	};
+	return useMemo(
+		() => ({
+			onStart,
+			onUpdate,
+			onEnd,
+		}),
+		[onStart, onUpdate, onEnd],
+	);
 };

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

@@ -1,4 +1,4 @@
-import { useCallback } from "react";
+import { useCallback, useMemo } from "react";
 import type {
 	GestureStateManager,
 	GestureTouchEvent,
@@ -68,5 +68,8 @@ export const usePinchActivation = ({
 		[runtime, screenOptions],
 	);
 
-	return { onTouchesDown, onTouchesMove };
+	return useMemo(
+		() => ({ onTouchesDown, onTouchesMove }),
+		[onTouchesDown, onTouchesMove],
+	);
 };

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

@@ -33,6 +33,7 @@ export const startPinchBase = (
 	gestures.settling.set(0);
 	gestures.active.set(null);
 	gestures.direction.set(null);
+	gestures.velocity.set(0);
 	gestures.scale.set(1);
 	gestures.normScale.set(0);
 	gestures.raw.scale.set(1);

package/src/shared/providers/screen/gestures/pinch/use-pinch-behavior.ts

@@ -1,4 +1,4 @@
-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";
@@ -74,9 +74,12 @@ export const usePinchBehavior = (
 		[runtime, screenOptions, dismissScreen, withSensitivity],
 	);
 
-	return {
-		onStart,
-		onUpdate,
-		onEnd,
-	};
+	return useMemo(
+		() => ({
+			onStart,
+			onUpdate,
+			onEnd,
+		}),
+		[onStart, onUpdate, onEnd],
+	);
 };