react-native-screen-transitions 4.1.0-alpha.0 → 4.1.0-beta.0

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

@@ -1,167 +0,0 @@
-import { clamp, type SharedValue } from "react-native-reanimated";
-import { scheduleOnRN } from "react-native-worklets";
-import { EPSILON, TRUE } from "../../../../../constants";
-import { emitMotionStart } from "../../../../../stores/animation.store";
-import { animateToProgress } from "../../../../../utils/animation/animate-to-progress";
-import {
-	normalizeGestureTranslation,
-	resolveGestureVelocity,
-} from "../../shared/physics";
-import { snapshotGestureHandoff } from "../../shared/snapshot";
-import {
-	clearFocalPoint,
-	clearPanTrackingValues,
-	clearTransformTrackingValues,
-} from "../../shared/values";
-import type {
-	GestureCompositionOwner,
-	GestureDimensions,
-	PanGestureEvent,
-	PanGestureRuntime,
-	PanReleaseResult,
-	PanTrackState,
-} from "../../types";
-import { buildPanReleasePlan } from "./pan-release";
-import { resetPanGestureValues } from "./pan-reset";
-
-export const startPanBase = (runtime: PanGestureRuntime) => {
-	"worklet";
-	const {
-		stores: { gestures, animations },
-	} = runtime;
-
-	emitMotionStart(animations);
-
-	gestures.dragging.set(TRUE);
-	gestures.dismissing.set(0);
-	gestures.settling.set(0);
-	clearPanTrackingValues(gestures);
-	clearTransformTrackingValues(gestures);
-	clearFocalPoint(gestures);
-	gestures.internal.progressBaseline.set(animations.transitionProgress.get());
-};
-
-export const trackPanGesture = (
-	event: PanGestureEvent,
-	rawEvent: PanGestureEvent,
-	gestures: PanGestureRuntime["stores"]["gestures"],
-	dimensions: GestureDimensions,
-): PanTrackState => {
-	"worklet";
-	const { translationX: x, translationY: y } = event;
-	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.internal.progressDeltaX.set(normX);
-	gestures.internal.progressDeltaY.set(normY);
-	gestures.velocity.set(velocity);
-	gestures.raw.x.set(rawX);
-	gestures.raw.y.set(rawY);
-	gestures.raw.normX.set(rawNormX);
-	gestures.raw.normY.set(rawNormY);
-
-	return {
-		x,
-		y,
-		normX,
-		normY,
-		velocity,
-	};
-};
-
-export const finalizePanRelease = (
-	release: PanReleaseResult,
-	runtime: PanGestureRuntime,
-	dimensions: GestureDimensions,
-	rawEvent: PanGestureEvent,
-	requestDismiss?: () => void,
-	gestureCompositionOwner?: SharedValue<GestureCompositionOwner>,
-) => {
-	"worklet";
-	const {
-		policy,
-		stores: { gestures, animations, system },
-	} = runtime;
-
-	const canDriveRelease =
-		!gestureCompositionOwner || gestureCompositionOwner.get() === "pan";
-
-	const plan = buildPanReleasePlan(
-		canDriveRelease
-			? release
-			: {
-					target: animations.transitionProgress.get(),
-					shouldDismiss: false,
-					initialVelocity: 0,
-					transitionSpec: undefined,
-					resetSpec: policy.transitionSpec?.open,
-				},
-		runtime,
-		dimensions,
-		rawEvent,
-	);
-
-	if (typeof plan.commitProgress === "number") {
-		animations.transitionProgress.set(plan.commitProgress);
-		system.targetProgress.set(plan.commitProgress);
-	}
-
-	const progressAlreadyAtTarget =
-		Math.abs(animations.transitionProgress.get() - plan.target) <= EPSILON;
-
-	if (canDriveRelease && plan.shouldDismiss) {
-		snapshotGestureHandoff(gestures, {
-			velocity: plan.handoffVelocity,
-		});
-	}
-
-	resetPanGestureValues({
-		plan,
-		gestures,
-		animations,
-		completeMotion: !plan.shouldDismiss && progressAlreadyAtTarget,
-		updateLifecycle: canDriveRelease,
-	});
-
-	if (!canDriveRelease) {
-		return;
-	}
-
-	if (!plan.shouldDismiss && progressAlreadyAtTarget) {
-		system.targetProgress.set(plan.target);
-		return;
-	}
-
-	animateToProgress({
-		target: plan.target,
-		spec: plan.transitionSpec,
-		emitWillAnimate: false,
-		markEntering: false,
-		targetProgress: system.targetProgress,
-		animationProgress: system.animationProgress,
-		animations,
-		initialVelocity: plan.progressVelocity,
-	});
-
-	if (plan.shouldDismiss && requestDismiss) {
-		scheduleOnRN(requestDismiss);
-	}
-};

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

@@ -1,86 +0,0 @@
-import { FALSE, TRUE } from "../../../../../constants";
-import type { AnimationStoreMap } from "../../../../../stores/animation.store";
-import type { GestureStoreMap } from "../../../../../stores/gesture.store";
-import { animateMany } from "../../shared/reset";
-import {
-	clearPanProgressDeltaValues,
-	clearRawPanValues,
-} from "../../shared/values";
-import type { PanReleasePlan } from "../../types";
-
-interface ResetPanGestureValuesProps {
-	plan: PanReleasePlan;
-	gestures: GestureStoreMap;
-	animations?: AnimationStoreMap;
-	completeMotion?: boolean;
-	updateLifecycle?: boolean;
-}
-
-export const resetPanGestureValues = ({
-	plan,
-	gestures,
-	animations,
-	completeMotion = false,
-	updateLifecycle = true,
-}: ResetPanGestureValuesProps) => {
-	"worklet";
-	const finishPanReset = () => {
-		"worklet";
-		if (!updateLifecycle || plan.shouldDismiss) {
-			return;
-		}
-
-		gestures.initiator.set(null);
-		gestures.settling.set(FALSE);
-		if (completeMotion) {
-			animations?.progressAnimating.set(FALSE);
-			animations?.progressSettled.set(TRUE);
-		}
-	};
-
-	if (animations && updateLifecycle && !plan.shouldDismiss) {
-		animations.progressAnimating.set(TRUE);
-		animations.progressSettled.set(FALSE);
-	}
-
-	clearRawPanValues(gestures);
-
-	if (updateLifecycle) {
-		gestures.dragging.set(FALSE);
-		gestures.dismissing.set(plan.shouldDismiss ? TRUE : FALSE);
-		gestures.settling.set(plan.shouldDismiss ? FALSE : TRUE);
-	}
-
-	gestures.velocity.set(0);
-
-	const progressDeltaWasCommitted = typeof plan.commitProgress === "number";
-
-	if (progressDeltaWasCommitted) {
-		clearPanProgressDeltaValues(gestures);
-	}
-
-	animateMany(
-		[
-			{ value: gestures.x, toValue: 0, velocity: plan.resetVelocityX },
-			{ value: gestures.y, toValue: 0, velocity: plan.resetVelocityY },
-			{ value: gestures.normX, toValue: 0, velocity: plan.resetVelocityNormX },
-			{ value: gestures.normY, toValue: 0, velocity: plan.resetVelocityNormY },
-			...(progressDeltaWasCommitted
-				? []
-				: [
-						{
-							value: gestures.internal.progressDeltaX,
-							toValue: 0,
-							velocity: plan.resetVelocityNormX,
-						},
-						{
-							value: gestures.internal.progressDeltaY,
-							toValue: 0,
-							velocity: plan.resetVelocityNormY,
-						},
-					]),
-		],
-		plan.resetSpec,
-		finishPanReset,
-	);
-};

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

@@ -1,139 +0,0 @@
-import { useCallback, useMemo } from "react";
-import type { SharedValue } from "react-native-reanimated";
-import { useNavigationHelpers } from "../../../../../hooks/navigation/use-navigation-helpers";
-import type { Direction } from "../../../../../types/ownership.types";
-import type { ScreenOptionsContextValue } from "../../../options";
-import { usePanGestureSensitivity } from "../../hooks/use-gesture-sensitivity";
-import { resolvePanRuntime } from "../../shared/runtime";
-import { clearPanTrackingValues } from "../../shared/values";
-import type {
-	GestureCompositionOwner,
-	GestureDimensions,
-	PanBehavior,
-	PanGestureEvent,
-	PanGestureRuntime,
-} from "../../types";
-import {
-	finalizePanRelease,
-	startPanBase,
-	trackPanGesture,
-} from "./pan-lifecycle";
-import {
-	primeSnapPanRelease,
-	resolvePanRelease,
-	resolveSnapPanRelease,
-} from "./pan-release";
-
-export const usePanBehavior = (
-	runtime: SharedValue<PanGestureRuntime>,
-	screenOptions: ScreenOptionsContextValue,
-	dimensions: GestureDimensions,
-	gestureCompositionOwner: SharedValue<GestureCompositionOwner>,
-	pendingDirection: SharedValue<Direction | null>,
-): PanBehavior => {
-	const { requestDismiss } = useNavigationHelpers();
-	const { withSensitivity, resetSensitivity } =
-		usePanGestureSensitivity(screenOptions);
-
-	const onStart = useCallback(() => {
-		"worklet";
-		const latestRuntime = resolvePanRuntime(runtime.get(), screenOptions.get());
-		if (gestureCompositionOwner.get() === "pinch") {
-			clearPanTrackingValues(latestRuntime.stores.gestures);
-			pendingDirection.set(null);
-			resetSensitivity();
-			return;
-		}
-
-		const direction = pendingDirection.get();
-		if (direction) {
-			latestRuntime.stores.gestures.initiator.set(direction);
-		}
-		pendingDirection.set(null);
-		gestureCompositionOwner.set("pan");
-
-		if (latestRuntime.participation.effectiveSnapPoints.hasSnapPoints) {
-			primeSnapPanRelease(latestRuntime);
-		}
-		startPanBase(latestRuntime);
-		resetSensitivity();
-	}, [
-		runtime,
-		screenOptions,
-		resetSensitivity,
-		gestureCompositionOwner,
-		pendingDirection,
-	]);
-
-	const onUpdate = useCallback(
-		(rawEvent: PanGestureEvent) => {
-			"worklet";
-			const latestRuntime = resolvePanRuntime(
-				runtime.get(),
-				screenOptions.get(),
-			);
-			const event = withSensitivity(rawEvent);
-			trackPanGesture(
-				event,
-				rawEvent,
-				latestRuntime.stores.gestures,
-				dimensions,
-			);
-		},
-		[runtime, screenOptions, dimensions, withSensitivity],
-	);
-
-	const onEnd = useCallback(
-		(rawEvent: PanGestureEvent) => {
-			"worklet";
-			const latestRuntime = resolvePanRuntime(
-				runtime.get(),
-				screenOptions.get(),
-			);
-			const event = withSensitivity(rawEvent);
-
-			const release = !latestRuntime.policy.enabled
-				? {
-						target: latestRuntime.stores.animations.transitionProgress.get(),
-						shouldDismiss: false,
-						initialVelocity: 0,
-						transitionSpec: undefined,
-						resetSpec: latestRuntime.policy.transitionSpec?.open,
-					}
-				: latestRuntime.participation.effectiveSnapPoints.hasSnapPoints
-					? resolveSnapPanRelease(event, latestRuntime, dimensions)
-					: resolvePanRelease(event, latestRuntime, dimensions);
-			const isPanCompositionOwner = gestureCompositionOwner.get() === "pan";
-
-			finalizePanRelease(
-				release,
-				latestRuntime,
-				dimensions,
-				rawEvent,
-				requestDismiss,
-				gestureCompositionOwner,
-			);
-
-			if (isPanCompositionOwner) {
-				gestureCompositionOwner.set(null);
-			}
-		},
-		[
-			runtime,
-			screenOptions,
-			dimensions,
-			requestDismiss,
-			withSensitivity,
-			gestureCompositionOwner,
-		],
-	);
-
-	return useMemo(
-		() => ({
-			onStart,
-			onUpdate,
-			onEnd,
-		}),
-		[onStart, onUpdate, onEnd],
-	);
-};

package/src/providers/screen/gestures/pan/use-build-pan-gesture.ts

@@ -1,69 +0,0 @@
-import { useMemo } from "react";
-import { useWindowDimensions } from "react-native";
-import { Gesture } from "react-native-gesture-handler";
-import type { SharedValue } from "react-native-reanimated";
-import { useScreenOptionsStore } from "../../options";
-import { useStableRuntimeConfig } from "../hooks/use-stable-runtime-config";
-import type {
-	GestureCompositionOwner,
-	GestureOwnerMap,
-	PanGesture,
-	ScreenGestureConfig,
-	ScrollGestureState,
-} from "../types";
-import { usePanActivation } from "./activation/use-pan-activation";
-import { usePanBehavior } from "./behavior/use-pan-behavior";
-
-interface UseBuildPanGestureProps {
-	scrollState: SharedValue<ScrollGestureState | null>;
-	gestureConfig: ScreenGestureConfig;
-	gestureOwners: SharedValue<GestureOwnerMap>;
-	gestureCompositionOwner: SharedValue<GestureCompositionOwner>;
-}
-
-export const useBuildPanGesture = ({
-	scrollState,
-	gestureConfig,
-	gestureOwners,
-	gestureCompositionOwner,
-}: UseBuildPanGestureProps): PanGesture => {
-	const dimensions = useWindowDimensions();
-	const { participation, pan: policy } = gestureConfig;
-	const screenOptions = useScreenOptionsStore();
-
-	const runtime = useStableRuntimeConfig({
-		participation,
-		policy,
-	});
-
-	const activation = usePanActivation({
-		scrollState,
-		gestureOwners,
-		runtime,
-		screenOptions,
-		dimensions,
-		gestureCompositionOwner,
-	});
-
-	const behavior = usePanBehavior(
-		runtime,
-		screenOptions,
-		dimensions,
-		gestureCompositionOwner,
-		activation.pendingDirection,
-	);
-
-	const panGesture = useMemo(() => {
-		return Gesture.Pan()
-			.enabled(true)
-			.manualActivation(true)
-			.averageTouches(true)
-			.onTouchesDown(activation.onTouchesDown)
-			.onTouchesMove(activation.onTouchesMove)
-			.onStart(behavior.onStart)
-			.onUpdate(behavior.onUpdate)
-			.onEnd(behavior.onEnd);
-	}, [activation, behavior]);
-
-	return panGesture;
-};

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

@@ -1,194 +0,0 @@
-import { useCallback, useMemo } from "react";
-import type {
-	GestureStateManager,
-	GestureTouchEvent,
-} from "react-native-gesture-handler";
-import { type SharedValue, useSharedValue } from "react-native-reanimated";
-import type { GestureStoreMap } from "../../../../../stores/gesture.store";
-import type { ScreenOptionsContextValue } from "../../../options";
-import { resolvePinchRuntime } from "../../shared/runtime";
-import type { GestureCompositionOwner, PinchGestureRuntime } from "../../types";
-
-export const updateAbsolutePinchFocalPoint = (
-	event: GestureTouchEvent,
-	gestures: GestureStoreMap,
-	captureOrigin: boolean,
-) => {
-	"worklet";
-	const firstTouch = event.allTouches[0];
-	const secondTouch = event.allTouches[1];
-
-	if (!firstTouch || !secondTouch) {
-		return;
-	}
-
-	const focalX = (firstTouch.absoluteX + secondTouch.absoluteX) / 2;
-	const focalY = (firstTouch.absoluteY + secondTouch.absoluteY) / 2;
-
-	gestures.focalX.set(focalX);
-	gestures.focalY.set(focalY);
-
-	if (captureOrigin) {
-		gestures.pinchOriginX.set(focalX);
-		gestures.pinchOriginY.set(focalY);
-	}
-};
-
-export const updatePinchRotation = (
-	event: GestureTouchEvent,
-	gestures: GestureStoreMap,
-	lastAngle: SharedValue<number>,
-	accumulatedRotation: SharedValue<number>,
-	captureOrigin: boolean,
-) => {
-	"worklet";
-	const firstTouch = event.allTouches[0];
-	const secondTouch = event.allTouches[1];
-
-	if (!firstTouch || !secondTouch) {
-		return;
-	}
-
-	const angle = Math.atan2(
-		secondTouch.absoluteY - firstTouch.absoluteY,
-		secondTouch.absoluteX - firstTouch.absoluteX,
-	);
-
-	if (captureOrigin) {
-		lastAngle.set(angle);
-		accumulatedRotation.set(0);
-		gestures.rotation.set(0);
-		gestures.raw.rotation.set(0);
-		return;
-	}
-
-	let angleDelta = angle - lastAngle.get();
-	if (angleDelta > Math.PI) {
-		angleDelta -= 2 * Math.PI;
-	} else if (angleDelta < -Math.PI) {
-		angleDelta += 2 * Math.PI;
-	}
-
-	const rotation = accumulatedRotation.get() + angleDelta;
-	lastAngle.set(angle);
-	accumulatedRotation.set(rotation);
-	gestures.rotation.set(rotation);
-	gestures.raw.rotation.set(rotation);
-};
-
-interface UsePinchActivationProps {
-	runtime: SharedValue<PinchGestureRuntime>;
-	screenOptions: ScreenOptionsContextValue;
-	gestureCompositionOwner: SharedValue<GestureCompositionOwner>;
-}
-
-export const usePinchActivation = ({
-	runtime,
-	screenOptions,
-	gestureCompositionOwner,
-}: UsePinchActivationProps) => {
-	const lastAngle = useSharedValue(0);
-	const accumulatedRotation = useSharedValue(0);
-
-	const onTouchesDown = useCallback(
-		(
-			event: GestureTouchEvent,
-			stateManager: GestureStateManager | undefined,
-		) => {
-			"worklet";
-			const latestRuntime = resolvePinchRuntime(
-				runtime.get(),
-				screenOptions.get(),
-			);
-			const { participation, policy } = latestRuntime;
-
-			if (!participation.canTrackGesture || !policy.enabled) {
-				stateManager?.fail();
-				return;
-			}
-
-			if (event.numberOfTouches === 2) {
-				updateAbsolutePinchFocalPoint(
-					event,
-					latestRuntime.stores.gestures,
-					true,
-				);
-				updatePinchRotation(
-					event,
-					latestRuntime.stores.gestures,
-					lastAngle,
-					accumulatedRotation,
-					true,
-				);
-				if (gestureCompositionOwner.get() === null) {
-					gestureCompositionOwner.set("pinch");
-				}
-				stateManager?.activate();
-				return;
-			}
-
-			if (event.numberOfTouches > 2) {
-				stateManager?.fail();
-			}
-		},
-		[
-			runtime,
-			screenOptions,
-			gestureCompositionOwner,
-			lastAngle,
-			accumulatedRotation,
-		],
-	);
-
-	const onTouchesMove = useCallback(
-		(event: GestureTouchEvent, stateManager: GestureStateManager) => {
-			"worklet";
-			const latestRuntime = resolvePinchRuntime(
-				runtime.get(),
-				screenOptions.get(),
-			);
-			const { participation, policy } = latestRuntime;
-
-			if (!participation.canTrackGesture || !policy.enabled) {
-				stateManager.fail();
-				return;
-			}
-
-			if (event.numberOfTouches === 2) {
-				updateAbsolutePinchFocalPoint(
-					event,
-					latestRuntime.stores.gestures,
-					false,
-				);
-				updatePinchRotation(
-					event,
-					latestRuntime.stores.gestures,
-					lastAngle,
-					accumulatedRotation,
-					false,
-				);
-				if (gestureCompositionOwner.get() === null) {
-					gestureCompositionOwner.set("pinch");
-				}
-				stateManager.activate();
-				return;
-			}
-
-			if (event.numberOfTouches > 2) {
-				stateManager.fail();
-			}
-		},
-		[
-			runtime,
-			screenOptions,
-			gestureCompositionOwner,
-			lastAngle,
-			accumulatedRotation,
-		],
-	);
-
-	return useMemo(
-		() => ({ onTouchesDown, onTouchesMove }),
-		[onTouchesDown, onTouchesMove],
-	);
-};