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

package/src/shared/stores/bounds/internals/links.ts

@@ -0,0 +1,171 @@
+import type { MeasuredDimensions, StyleProps } from "react-native-reanimated";
+import {
+	findLatestPendingSourceLinkIndex,
+	findLinkIndexForDestinationWrite,
+	hasLinkSide,
+	isCompletedLinkForScreenKey,
+	isSameScreenFamily,
+	selectSourceUpdateTargetIndex,
+} from "../helpers/link.helpers";
+import { ensureTagState } from "../helpers/tag-state.helpers";
+import type { ScreenKey, TagID, TagLink } from "../types";
+import { type RegistryState, registry } from "./state";
+
+type LinkSourceWriteMode = "capture" | "refresh";
+type LinkDestinationWriteMode = "attach" | "refresh";
+
+function setSource(
+	mode: LinkSourceWriteMode,
+	tag: TagID,
+	screenKey: ScreenKey,
+	bounds: MeasuredDimensions,
+	styles: StyleProps = {},
+) {
+	"worklet";
+	registry.modify(<T extends RegistryState>(state: T): T => {
+		"worklet";
+		const source = {
+			screenKey,
+			bounds,
+			styles,
+		};
+
+		if (mode === "capture") {
+			const tagState = ensureTagState(state, tag);
+			const stack = tagState.linkStack;
+			const topIndex = stack.length - 1;
+			const topLink = topIndex >= 0 ? stack[topIndex] : null;
+
+			if (
+				topLink &&
+				topLink.destination === null &&
+				isSameScreenFamily(topLink.source, source)
+			) {
+				topLink.source = source;
+				if (!topLink.initialSource) {
+					topLink.initialSource = source;
+				}
+				return state;
+			}
+
+			stack.push({
+				source,
+				destination: null,
+				initialSource: source,
+			});
+
+			return state;
+		}
+
+		const stack = state[tag]?.linkStack;
+		if (!stack || stack.length === 0) return state;
+		const targetIndex = selectSourceUpdateTargetIndex(stack, screenKey);
+		if (targetIndex === -1) return state;
+
+		const link = stack[targetIndex];
+
+		link.source = source;
+		if (!link.initialSource) {
+			link.initialSource = source;
+		}
+
+		return state;
+	});
+}
+
+function setDestination(
+	mode: LinkDestinationWriteMode,
+	tag: TagID,
+	screenKey: ScreenKey,
+	bounds: MeasuredDimensions,
+	styles: StyleProps = {},
+	expectedSourceScreenKey?: ScreenKey,
+) {
+	"worklet";
+	registry.modify(<T extends RegistryState>(state: T): T => {
+		"worklet";
+		const stack = state[tag]?.linkStack;
+		if (!stack || stack.length === 0) return state;
+
+		const targetIndex = findLinkIndexForDestinationWrite(
+			stack,
+			mode === "refresh" ? screenKey : undefined,
+			expectedSourceScreenKey,
+		);
+
+		if (targetIndex === -1) return state;
+
+		const link = stack[targetIndex];
+		const destination = {
+			screenKey,
+			bounds,
+			styles,
+		};
+
+		link.destination = destination;
+		if (!link.initialDestination) {
+			link.initialDestination = destination;
+		}
+
+		return state;
+	});
+}
+
+function getMatchedLink(tag: TagID, screenKey?: ScreenKey): TagLink | null {
+	"worklet";
+	const tagState = registry.get()[tag];
+	const stack = tagState?.linkStack;
+	if (!stack || stack.length === 0) {
+		return null;
+	}
+
+	if (!screenKey) {
+		const lastLink = stack[stack.length - 1];
+		return lastLink ?? null;
+	}
+
+	for (let i = stack.length - 1; i >= 0; i--) {
+		const link = stack[i];
+		if (isCompletedLinkForScreenKey(link, screenKey)) {
+			return link;
+		}
+	}
+
+	return null;
+}
+
+function getPendingLink(
+	tag: TagID,
+	sourceScreenKey?: ScreenKey,
+): TagLink | null {
+	"worklet";
+	const tagState = registry.get()[tag];
+	const stack = tagState?.linkStack;
+	if (!stack || stack.length === 0) return null;
+
+	const pendingSourceLinkIndex = findLatestPendingSourceLinkIndex(
+		stack,
+		sourceScreenKey,
+	);
+	if (pendingSourceLinkIndex === -1) return null;
+	return stack[pendingSourceLinkIndex] ?? null;
+}
+
+function hasSourceLink(tag: TagID, screenKey: ScreenKey): boolean {
+	"worklet";
+	return hasLinkSide(registry.get()[tag]?.linkStack, screenKey, "source");
+}
+
+function hasDestinationLink(tag: TagID, screenKey: ScreenKey): boolean {
+	"worklet";
+	return hasLinkSide(registry.get()[tag]?.linkStack, screenKey, "destination");
+}
+
+export {
+	getMatchedLink,
+	getPendingLink,
+	hasDestinationLink,
+	hasSourceLink,
+	setDestination,
+	setSource,
+};

package/src/shared/stores/bounds/internals/resolver.ts

@@ -1,3 +1,4 @@
+import { findLatest } from "../helpers/find-latest";
 import { matchesScreenKey } from "../helpers/matching";
 import type {
 	ResolvedTransitionPair,
@@ -5,66 +6,74 @@ import type {
 	ScreenKey,
 	TagID,
 	TagLink,
-	TagState,
 } from "../types";
 import { registry } from "./state";
 
-const findLatestLink = (
-	tagState: TagState,
-	predicate: (link: TagLink) => boolean,
-): TagLink | null => {
-	"worklet";
-	const stack = tagState.linkStack;
-	for (let i = stack.length - 1; i >= 0; i--) {
-		const link = stack[i];
-		if (predicate(link)) {
-			return link;
-		}
-	}
-	return null;
-};
-
 function findCompletedLinkByDestination(
-	tagState: TagState,
+	stack: TagLink[],
 	screenKey?: ScreenKey,
 ): TagLink | null {
 	"worklet";
 	if (!screenKey) return null;
 
-	return findLatestLink(
-		tagState,
+	return findLatest(
+		stack,
 		(link) =>
 			!!link.destination && matchesScreenKey(link.destination, screenKey),
 	);
 }
 
 function findCompletedLinkBySource(
-	tagState: TagState,
+	stack: TagLink[],
 	screenKey?: ScreenKey,
 ): TagLink | null {
 	"worklet";
 	if (!screenKey) return null;
 
-	return findLatestLink(
-		tagState,
+	return findLatest(
+		stack,
 		(link) => !!link.destination && matchesScreenKey(link.source, screenKey),
 	);
 }
 
 function findPendingLinkBySource(
-	tagState: TagState,
+	stack: TagLink[],
 	screenKey?: ScreenKey,
 ): TagLink | null {
 	"worklet";
 	if (!screenKey) return null;
 
-	return findLatestLink(
-		tagState,
+	return findLatest(
+		stack,
 		(link) =>
 			link.destination === null && matchesScreenKey(link.source, screenKey),
 	);
 }
 
+function findEnteringTransitionLink(
+	stack: TagLink[],
+	context: ResolveTransitionContext,
+): TagLink | null {
+	"worklet";
+	return (
+		findCompletedLinkByDestination(stack, context.currentScreenKey) ??
+		findPendingLinkBySource(stack, context.previousScreenKey) ??
+		findCompletedLinkBySource(stack, context.previousScreenKey)
+	);
+}
+
+function findExitingTransitionLink(
+	stack: TagLink[],
+	context: ResolveTransitionContext,
+): TagLink | null {
+	"worklet";
+	return (
+		findCompletedLinkBySource(stack, context.currentScreenKey) ??
+		findCompletedLinkByDestination(stack, context.nextScreenKey) ??
+		findPendingLinkBySource(stack, context.currentScreenKey)
+	);
+}
+
 function resolveTransitionPair(
 	tag: TagID,
 	context: ResolveTransitionContext,
@@ -73,56 +82,12 @@ function resolveTransitionPair(
 	const tagState = registry.get()[tag];
 	const stack = tagState?.linkStack;
 
-	let matchedLink: TagLink | null = null;
-
-	if (tagState && stack && stack.length > 0) {
-		if (context.entering) {
-			matchedLink = findCompletedLinkByDestination(
-				tagState,
-				context.currentScreenKey,
-			);
-
-			if (!matchedLink) {
-				matchedLink = findPendingLinkBySource(
-					tagState,
-					context.previousScreenKey,
-				);
-			}
-
-			if (!matchedLink) {
-				matchedLink = findCompletedLinkBySource(
-					tagState,
-					context.previousScreenKey,
-				);
-			}
-
-			if (!matchedLink) {
-				matchedLink = findCompletedLinkByDestination(
-					tagState,
-					context.nextScreenKey,
-				);
-			}
-		} else {
-			matchedLink = findCompletedLinkBySource(
-				tagState,
-				context.currentScreenKey,
-			);
-
-			if (!matchedLink) {
-				matchedLink = findCompletedLinkByDestination(
-					tagState,
-					context.nextScreenKey,
-				);
-			}
-
-			if (!matchedLink) {
-				matchedLink = findPendingLinkBySource(
-					tagState,
-					context.currentScreenKey,
-				);
-			}
-		}
-	}
+	const matchedLink =
+		stack && stack.length > 0
+			? context.entering
+				? findEnteringTransitionLink(stack, context)
+				: findExitingTransitionLink(stack, context)
+			: null;
 
 	const sourceBounds = matchedLink?.source?.bounds ?? null;
 	const destinationBounds = matchedLink?.destination?.bounds ?? null;
@@ -130,7 +95,6 @@ function resolveTransitionPair(
 	const destinationStyles = matchedLink?.destination?.styles ?? null;
 	const sourceScreenKey = matchedLink?.source?.screenKey ?? null;
 	const destinationScreenKey = matchedLink?.destination?.screenKey ?? null;
-	const usedPending = matchedLink ? matchedLink.destination === null : false;
 
 	return {
 		sourceBounds,
@@ -139,7 +103,6 @@ function resolveTransitionPair(
 		destinationStyles,
 		sourceScreenKey,
 		destinationScreenKey,
-		usedPending,
 	};
 }
 

package/src/shared/stores/bounds/internals/state.ts

@@ -1,14 +1,6 @@
 import { makeMutable } from "react-native-reanimated";
 import type { GroupState, TagID, TagState } from "../types";
 
-export const createEmptyTagState = (): TagState => {
-	"worklet";
-	return {
-		screens: {},
-		linkStack: [],
-	};
-};
-
 export type RegistryState = Record<TagID, TagState>;
 export type GroupsState = Record<string, GroupState>;
 

package/src/shared/stores/bounds/types.ts

@@ -1,13 +1,13 @@
 import type { MeasuredDimensions, StyleProps } from "react-native-reanimated";
 import type { BoundsMethod } from "../../types/bounds.types";
+import type { ScreenKey } from "../../types/screen.types";
 import type {
 	BoundsAnchor,
 	BoundsScaleMode,
 } from "../../utils/bounds/types/options";
 
 export type TagID = string;
-export type ScreenKey = string;
-export type NavigatorKey = string;
+export type { ScreenKey } from "../../types/screen.types";
 
 export type BoundaryConfig = {
 	anchor?: BoundsAnchor;
@@ -20,10 +20,6 @@ export type Entry = {
 	bounds: MeasuredDimensions | null;
 	styles: StyleProps;
 	boundaryConfig?: BoundaryConfig;
-	ancestorKeys?: ScreenKey[];
-	navigatorKey?: NavigatorKey;
-	ancestorNavigatorKeys?: NavigatorKey[];
-	presenceCount?: number;
 };
 
 export type MeasuredEntry = Entry & {
@@ -34,22 +30,20 @@ export type EntryPatch = {
 	bounds?: MeasuredDimensions | null;
 	styles?: StyleProps | null;
 	boundaryConfig?: BoundaryConfig | null;
-	ancestorKeys?: ScreenKey[] | null;
-	navigatorKey?: NavigatorKey | null;
-	ancestorNavigatorKeys?: NavigatorKey[] | null;
-	presenceCount?: number | null;
 };
 
 export type ScreenIdentifier = {
 	screenKey: ScreenKey;
-	ancestorKeys?: ScreenKey[];
-	navigatorKey?: NavigatorKey;
-	ancestorNavigatorKeys?: NavigatorKey[];
 };
 
 export type TagLink = {
 	source: ScreenIdentifier & MeasuredEntry;
+	/** Destination side once attached; null while the source is still pending. */
 	destination: (ScreenIdentifier & MeasuredEntry) | null;
+	/** First captured source side exposed for public link inspection. */
+	initialSource?: ScreenIdentifier & MeasuredEntry;
+	/** First attached destination side, used to compensate reveal closes after destination refreshes. */
+	initialDestination?: ScreenIdentifier & MeasuredEntry;
 };
 
 export type ResolveTransitionContext = {
@@ -66,7 +60,6 @@ export type ResolvedTransitionPair = {
 	destinationStyles: StyleProps | null;
 	sourceScreenKey: ScreenKey | null;
 	destinationScreenKey: ScreenKey | null;
-	usedPending: boolean;
 };
 
 export type ScreenEntry = Entry;
@@ -77,5 +70,8 @@ export type TagState = {
 };
 
 export type GroupState = {
+	/** Latest requested group member id from mounted grouped bounds. */
 	activeId: string;
+	/** Group member id that started the current linked transition. */
+	initialId?: string;
 };

package/src/shared/stores/gesture.store.ts

@@ -3,17 +3,37 @@ import {
 	makeMutable,
 	type SharedValue,
 } from "react-native-reanimated";
-import type { GestureDirection } from "../types/gesture.types";
+import type {
+	ActiveGesture,
+	ResolvedPanGestureDirection,
+} from "../types/gesture.types";
 import { createStore } from "../utils/create-store";
 
+type GestureRawStoreMap = {
+	x: SharedValue<number>;
+	y: SharedValue<number>;
+	normX: SharedValue<number>;
+	normY: SharedValue<number>;
+	scale: SharedValue<number>;
+	normScale: SharedValue<number>;
+};
+
 export type GestureStoreMap = {
 	x: SharedValue<number>;
 	y: SharedValue<number>;
 	normX: SharedValue<number>;
 	normY: SharedValue<number>;
+	scale: SharedValue<number>;
+	normScale: SharedValue<number>;
+	focalX: SharedValue<number>;
+	focalY: SharedValue<number>;
+	raw: GestureRawStoreMap;
 	dismissing: SharedValue<number>;
 	dragging: SharedValue<number>;
-	direction: SharedValue<Omit<GestureDirection, "bidirectional"> | null>;
+	settling: SharedValue<number>;
+	active: SharedValue<ActiveGesture | null>;
+	/** @deprecated Use `active` instead. */
+	direction: SharedValue<ResolvedPanGestureDirection | null>;
 
 	/**
 	 * @deprecated Use `normX` instead.
@@ -36,19 +56,35 @@ export type GestureStoreMap = {
 function createGestureBag(): GestureStoreMap {
 	const normX = makeMutable(0);
 	const normY = makeMutable(0);
+	const scale = makeMutable(1);
+	const normScale = makeMutable(0);
 	const dismissing = makeMutable(0);
 	const dragging = makeMutable(0);
+	const settling = makeMutable(0);
+	const active = makeMutable<ActiveGesture | null>(null);
 
 	return {
 		x: makeMutable(0),
 		y: makeMutable(0),
 		normX,
 		normY,
+		scale,
+		normScale,
+		focalX: makeMutable(0),
+		focalY: makeMutable(0),
+		raw: {
+			x: makeMutable(0),
+			y: makeMutable(0),
+			normX: makeMutable(0),
+			normY: makeMutable(0),
+			scale: makeMutable(1),
+			normScale: makeMutable(0),
+		},
 		dismissing,
 		dragging,
-		direction: makeMutable<Omit<GestureDirection, "bidirectional"> | null>(
-			null,
-		),
+		settling,
+		active,
+		direction: makeMutable<ResolvedPanGestureDirection | null>(null),
 
 		// Deprecated aliases (same underlying SharedValue)
 		normalizedX: normX,
@@ -61,7 +97,7 @@ function createGestureBag(): GestureStoreMap {
 /**
  * Route-keyed gesture state used by the transition system while a screen is
  * being dragged or dismissed. It stores raw and normalized gesture values,
- * dismissal flags, and the active gesture direction. `getCachedBag()` provides
+ * dismissal flags, and the active gesture. `getCachedBag()` provides
  * a stable neutral fallback bag for cases where a route should not own live
  * gesture state.
  */
@@ -72,8 +108,20 @@ export const GestureStore = createStore<GestureStoreMap>({
 		cancelAnimation(bag.y);
 		cancelAnimation(bag.normX);
 		cancelAnimation(bag.normY);
+		cancelAnimation(bag.scale);
+		cancelAnimation(bag.normScale);
+		cancelAnimation(bag.focalX);
+		cancelAnimation(bag.focalY);
+		cancelAnimation(bag.raw.x);
+		cancelAnimation(bag.raw.y);
+		cancelAnimation(bag.raw.normX);
+		cancelAnimation(bag.raw.normY);
+		cancelAnimation(bag.raw.scale);
+		cancelAnimation(bag.raw.normScale);
 		cancelAnimation(bag.dismissing);
 		cancelAnimation(bag.dragging);
+		cancelAnimation(bag.settling);
+		cancelAnimation(bag.active);
 		cancelAnimation(bag.direction);
 	},
 });

package/src/shared/stores/scroll.store.ts

@@ -0,0 +1,25 @@
+import {
+	cancelAnimation,
+	makeMutable,
+	type SharedValue,
+} from "react-native-reanimated";
+import type { ScrollGestureState } from "../types/gesture.types";
+import { createStore } from "../utils/create-store";
+
+export type ScrollStoreMap = {
+	state: SharedValue<ScrollGestureState | null>;
+};
+
+/**
+ * Route-keyed scroll geometry used by gesture activation and bounds measurement.
+ * The state tracks coordinated ScrollView offsets and dimensions so consumers
+ * can reason about overscroll without coupling to a specific scroll component.
+ */
+export const ScrollStore = createStore<ScrollStoreMap>({
+	createBag: () => ({
+		state: makeMutable<ScrollGestureState | null>(null),
+	}),
+	disposeBag: (bag) => {
+		cancelAnimation(bag.state);
+	},
+});

package/src/shared/stores/system.store.ts

@@ -3,6 +3,7 @@ import {
 	makeMutable,
 	type SharedValue,
 } from "react-native-reanimated";
+import { LOGICAL_SETTLE_REQUIRED_FRAMES } from "../constants";
 import type { Layout } from "../types/screen.types";
 import { createStore } from "../utils/create-store";
 
@@ -36,6 +37,11 @@ type SystemStoreState = {
 	 */
 	pendingLifecycleRequestTarget: SharedValue<number>;
 
+	/**
+	 * Number of consecutive frames progress has stayed near its target.
+	 */
+	logicalSettleFrameCount: SharedValue<number>;
+
 	/**
 	 * Number of active blockers preventing a pending lifecycle request from
 	 * starting immediately.
@@ -72,6 +78,7 @@ export const SystemStore = createStore<SystemStoreState, SystemStoreActions>({
 			LifecycleTransitionRequestKind.None,
 		),
 		pendingLifecycleRequestTarget: makeMutable<number>(0),
+		logicalSettleFrameCount: makeMutable(LOGICAL_SETTLE_REQUIRED_FRAMES),
 		pendingLifecycleStartBlockCount: makeMutable<number>(0),
 	}),
 	disposeBag: (bag) => {
@@ -80,6 +87,7 @@ export const SystemStore = createStore<SystemStoreState, SystemStoreActions>({
 		cancelAnimation(bag.measuredContentLayout);
 		cancelAnimation(bag.pendingLifecycleRequestKind);
 		cancelAnimation(bag.pendingLifecycleRequestTarget);
+		cancelAnimation(bag.logicalSettleFrameCount);
 		cancelAnimation(bag.pendingLifecycleStartBlockCount);
 	},
 	actions: (bag) => ({