react-native-screen-transitions 3.3.0 → 3.4.0-alpha.0

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

@@ -1,4 +1,8 @@
-import { makeMutable, type SharedValue } from "react-native-reanimated";
+import {
+	cancelAnimation,
+	makeMutable,
+	type SharedValue,
+} from "react-native-reanimated";
 import type { ScreenKey } from "../types/screen.types";
 
 export type AnimationStoreMap = {
@@ -11,39 +15,57 @@ export type AnimationStoreMap = {
 
 const store: Record<ScreenKey, AnimationStoreMap> = {};
 
-const ensure = (key: ScreenKey) => {
-	let bag = store[key];
+function createAnimationBag(): AnimationStoreMap {
+	return {
+		progress: makeMutable(0),
+		closing: makeMutable(0),
+		animating: makeMutable(0),
+		entering: makeMutable(1),
+		targetProgress: makeMutable(1),
+	};
+}
+
+function ensure(routeKey: ScreenKey): AnimationStoreMap {
+	let bag = store[routeKey];
 	if (!bag) {
-		bag = {
-			progress: makeMutable(0),
-			closing: makeMutable(0),
-			animating: makeMutable(0),
-			entering: makeMutable(1),
-			targetProgress: makeMutable(1),
-		} satisfies AnimationStoreMap;
-		store[key] = bag;
+		bag = createAnimationBag();
+		store[routeKey] = bag;
 	}
 	return bag;
-};
+}
 
-function getAnimation(
-	key: ScreenKey,
+function peekRouteAnimations(
+	routeKey: ScreenKey,
+): AnimationStoreMap | undefined {
+	return store[routeKey];
+}
+
+function getRouteAnimation(
+	routeKey: ScreenKey,
 	type: keyof AnimationStoreMap,
 ): SharedValue<number> {
-	return ensure(key)[type];
+	return ensure(routeKey)[type];
 }
 
-function getAll(key: ScreenKey) {
-	return ensure(key);
+function getRouteAnimations(routeKey: ScreenKey): AnimationStoreMap {
+	return ensure(routeKey);
 }
 
 function clear(routeKey: ScreenKey) {
-	"worklet";
+	const bag = store[routeKey];
+	if (bag) {
+		cancelAnimation(bag.progress);
+		cancelAnimation(bag.animating);
+		cancelAnimation(bag.closing);
+		cancelAnimation(bag.entering);
+		cancelAnimation(bag.targetProgress);
+	}
 	delete store[routeKey];
 }
 
 export const AnimationStore = {
-	getAnimation,
+	peekRouteAnimations,
+	getRouteAnimation,
+	getRouteAnimations,
 	clear,
-	getAll,
 };

package/src/shared/stores/bounds/helpers/apply-measured-bounds-writes.ts

@@ -0,0 +1,101 @@
+import type { MeasuredDimensions, StyleProps } from "react-native-reanimated";
+import { BoundStore } from "..";
+
+type ApplyMeasuredBoundsWritesParams = {
+	sharedBoundTag: string;
+	currentScreenKey: string;
+	measured: MeasuredDimensions;
+	preparedStyles: StyleProps;
+	ancestorKeys: string[];
+	navigatorKey?: string;
+	ancestorNavigatorKeys?: string[];
+	shouldRegisterSnapshot?: boolean;
+	shouldSetSource?: boolean;
+	shouldUpdateSource?: boolean;
+	shouldSetDestination?: boolean;
+	shouldUpdateDestination?: boolean;
+	expectedSourceScreenKey?: string;
+};
+
+export const applyMeasuredBoundsWrites = (
+	params: ApplyMeasuredBoundsWritesParams,
+) => {
+	"worklet";
+	const {
+		sharedBoundTag,
+		currentScreenKey,
+		measured,
+		preparedStyles,
+		ancestorKeys,
+		navigatorKey,
+		ancestorNavigatorKeys,
+		shouldRegisterSnapshot,
+		shouldSetSource,
+		shouldUpdateSource,
+		shouldSetDestination,
+		shouldUpdateDestination,
+		expectedSourceScreenKey,
+	} = params;
+
+	if (shouldRegisterSnapshot) {
+		BoundStore.registerSnapshot(
+			sharedBoundTag,
+			currentScreenKey,
+			measured,
+			preparedStyles,
+			ancestorKeys,
+			navigatorKey,
+			ancestorNavigatorKeys,
+		);
+	}
+
+	if (shouldSetSource) {
+		BoundStore.setLinkSource(
+			sharedBoundTag,
+			currentScreenKey,
+			measured,
+			preparedStyles,
+			ancestorKeys,
+			navigatorKey,
+			ancestorNavigatorKeys,
+		);
+	}
+
+	if (shouldUpdateSource) {
+		BoundStore.updateLinkSource(
+			sharedBoundTag,
+			currentScreenKey,
+			measured,
+			preparedStyles,
+			ancestorKeys,
+			navigatorKey,
+			ancestorNavigatorKeys,
+		);
+	}
+
+	if (shouldUpdateDestination) {
+		BoundStore.updateLinkDestination(
+			sharedBoundTag,
+			currentScreenKey,
+			measured,
+			preparedStyles,
+			ancestorKeys,
+			expectedSourceScreenKey,
+			navigatorKey,
+			ancestorNavigatorKeys,
+		);
+	}
+
+	if (shouldSetDestination) {
+		BoundStore.setLinkDestination(
+			sharedBoundTag,
+			currentScreenKey,
+			measured,
+			preparedStyles,
+			ancestorKeys,
+			expectedSourceScreenKey,
+			navigatorKey,
+			ancestorNavigatorKeys,
+		);
+	}
+};

package/src/shared/stores/bounds/helpers/keys.ts

@@ -0,0 +1,21 @@
+import type { ScreenIdentifier, ScreenKey } from "../types";
+
+export function collectIdentifierKeys(
+	identifier: ScreenIdentifier | null | undefined,
+): ScreenKey[] {
+	"worklet";
+	if (!identifier) return [];
+
+	const allKeys: ScreenKey[] = [identifier.screenKey];
+	const ancestors = identifier.ancestorKeys;
+	if (ancestors && ancestors.length > 0) {
+		for (let i = 0; i < ancestors.length; i++) {
+			const key = ancestors[i];
+			if (!allKeys.includes(key)) {
+				allKeys.push(key);
+			}
+		}
+	}
+
+	return allKeys;
+}

package/src/shared/stores/bounds/helpers/matching.ts

@@ -0,0 +1,25 @@
+import type { NavigatorKey, ScreenIdentifier, ScreenKey } from "../types";
+
+export function matchesScreenKey(
+	identifier: ScreenIdentifier | null | undefined,
+	key: ScreenKey,
+): boolean {
+	"worklet";
+	if (!identifier) return false;
+
+	if (identifier.screenKey === key) return true;
+
+	return identifier.ancestorKeys?.includes(key) ?? false;
+}
+
+export function matchesNavigatorKey(
+	identifier: ScreenIdentifier | null | undefined,
+	key: NavigatorKey,
+): boolean {
+	"worklet";
+	if (!identifier) return false;
+
+	if (identifier.navigatorKey === key) return true;
+
+	return identifier.ancestorNavigatorKeys?.includes(key) ?? false;
+}

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

@@ -0,0 +1,60 @@
+import { clear, clearByAncestor, clearByBranch } from "./internals/clear";
+import {
+	getBoundaryConfig,
+	getBoundaryPresence,
+	getGroupActiveId,
+	getGroups,
+	hasBoundaryPresence,
+	registerBoundaryPresence,
+	setGroupActiveId,
+	unregisterBoundaryPresence,
+} from "./internals/presence";
+import {
+	getActiveLink,
+	getLatestPendingSourceScreenKey,
+	getSnapshot,
+	hasDestinationLink,
+	hasPendingLink,
+	hasPendingLinkFromSource,
+	hasSourceLink,
+	registerSnapshot,
+	setLinkDestination,
+	setLinkSource,
+	updateLinkDestination,
+	updateLinkSource,
+} from "./internals/registry";
+import { resolveTransitionPair } from "./internals/resolver";
+
+export type {
+	BoundaryConfig,
+	ResolvedTransitionPair,
+	ResolveTransitionContext,
+	Snapshot,
+} from "./types";
+
+export const BoundStore = {
+	registerSnapshot,
+	setLinkSource,
+	setLinkDestination,
+	updateLinkSource,
+	updateLinkDestination,
+	getActiveLink,
+	registerBoundaryPresence,
+	unregisterBoundaryPresence,
+	hasBoundaryPresence,
+	getBoundaryPresence,
+	getBoundaryConfig,
+	hasPendingLink,
+	hasPendingLinkFromSource,
+	getLatestPendingSourceScreenKey,
+	hasSourceLink,
+	hasDestinationLink,
+	getSnapshot,
+	resolveTransitionPair,
+	setGroupActiveId,
+	getGroupActiveId,
+	clear,
+	clearByAncestor,
+	clearByBranch,
+	getGroups,
+};

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

@@ -0,0 +1,335 @@
+import { matchesNavigatorKey, matchesScreenKey } from "../helpers/matching";
+import type {
+	NavigatorKey,
+	PresenceState,
+	ScreenKey,
+	SnapshotEntry,
+	TagLink,
+} from "../types";
+import {
+	debugClearLog,
+	debugStoreSizeLog,
+	presence,
+	type RegistryState,
+	registry,
+} from "./state";
+
+const hasAnyKeys = (record: Record<string, unknown>) => {
+	"worklet";
+	for (const _key in record) {
+		return true;
+	}
+	return false;
+};
+
+const countRegistryMatches = (
+	screenKey: ScreenKey,
+	matchByAncestor: boolean,
+): { snapshots: number; links: number } => {
+	"worklet";
+	const currentRegistry = registry.value;
+	let snapshots = 0;
+	let links = 0;
+
+	for (const tag in currentRegistry) {
+		const tagState = currentRegistry[tag];
+
+		for (const snapshotKey in tagState.snapshots) {
+			const snapshot = tagState.snapshots[snapshotKey];
+			const matched = matchByAncestor
+				? snapshotKey === screenKey ||
+					(snapshot.ancestorKeys?.includes(screenKey) ?? false)
+				: snapshotKey === screenKey;
+			if (matched) snapshots++;
+		}
+
+		for (let i = 0; i < tagState.linkStack.length; i++) {
+			const link = tagState.linkStack[i];
+			if (
+				matchesScreenKey(link.source, screenKey) ||
+				matchesScreenKey(link.destination, screenKey)
+			) {
+				links++;
+			}
+		}
+	}
+
+	return { snapshots, links };
+};
+
+const countRegistryMatchesByBranch = (
+	branchNavigatorKey: NavigatorKey,
+): { snapshots: number; links: number } => {
+	"worklet";
+	const currentRegistry = registry.value;
+	let snapshots = 0;
+	let links = 0;
+
+	for (const tag in currentRegistry) {
+		const tagState = currentRegistry[tag];
+
+		for (const snapshotKey in tagState.snapshots) {
+			const snapshot = tagState.snapshots[snapshotKey];
+			const matched =
+				snapshot.navigatorKey === branchNavigatorKey ||
+				(snapshot.ancestorNavigatorKeys?.includes(branchNavigatorKey) ?? false);
+			if (matched) snapshots++;
+		}
+
+		for (let i = 0; i < tagState.linkStack.length; i++) {
+			const link = tagState.linkStack[i];
+			if (
+				matchesNavigatorKey(link.source, branchNavigatorKey) ||
+				matchesNavigatorKey(link.destination, branchNavigatorKey)
+			) {
+				links++;
+			}
+		}
+	}
+
+	return { snapshots, links };
+};
+
+const countPresenceMatches = (
+	screenKey: ScreenKey,
+	matchByAncestor: boolean,
+): number => {
+	"worklet";
+	const currentPresence = presence.value;
+	let matches = 0;
+
+	for (const tag in currentPresence) {
+		const tagEntries = currentPresence[tag];
+		for (const entryScreenKey in tagEntries) {
+			const entry = tagEntries[entryScreenKey];
+			const matched = matchByAncestor
+				? entryScreenKey === screenKey ||
+					(entry.ancestorKeys?.includes(screenKey) ?? false)
+				: entryScreenKey === screenKey;
+			if (matched) matches++;
+		}
+	}
+
+	return matches;
+};
+
+const countPresenceMatchesByBranch = (
+	branchNavigatorKey: NavigatorKey,
+): number => {
+	"worklet";
+	const currentPresence = presence.value;
+	let matches = 0;
+
+	for (const tag in currentPresence) {
+		const tagEntries = currentPresence[tag];
+		for (const entryScreenKey in tagEntries) {
+			const entry = tagEntries[entryScreenKey];
+			const matched =
+				entry.navigatorKey === branchNavigatorKey ||
+				(entry.ancestorNavigatorKeys?.includes(branchNavigatorKey) ?? false);
+			if (matched) matches++;
+		}
+	}
+
+	return matches;
+};
+
+const clearRegistry = (params: {
+	shouldRemoveSnapshot: (
+		screenKey: ScreenKey,
+		snapshot: SnapshotEntry,
+	) => boolean;
+	shouldRemoveLink: (link: TagLink) => boolean;
+}) => {
+	"worklet";
+	const { shouldRemoveSnapshot, shouldRemoveLink } = params;
+
+	registry.modify(<T extends RegistryState>(state: T): T => {
+		"worklet";
+		for (const tag in state) {
+			const tagState = state[tag];
+
+			for (const snapshotKey in tagState.snapshots) {
+				const snapshot = tagState.snapshots[snapshotKey];
+				if (shouldRemoveSnapshot(snapshotKey, snapshot)) {
+					delete tagState.snapshots[snapshotKey];
+				}
+			}
+
+			for (let i = tagState.linkStack.length - 1; i >= 0; i--) {
+				const link = tagState.linkStack[i];
+				if (shouldRemoveLink(link)) {
+					tagState.linkStack.splice(i, 1);
+				}
+			}
+
+			if (!hasAnyKeys(tagState.snapshots) && tagState.linkStack.length === 0) {
+				delete state[tag];
+			}
+		}
+
+		return state;
+	});
+};
+
+const clearPresenceDirect = (screenKey: ScreenKey) => {
+	"worklet";
+	presence.modify(<T extends PresenceState>(state: T): T => {
+		"worklet";
+		for (const tag in state) {
+			const tagEntries = state[tag];
+			if (!tagEntries[screenKey]) continue;
+
+			delete tagEntries[screenKey];
+
+			if (!hasAnyKeys(tagEntries)) {
+				delete state[tag];
+			}
+		}
+		return state;
+	});
+};
+
+const clearPresenceByAncestor = (ancestorKey: ScreenKey) => {
+	"worklet";
+	presence.modify(<T extends PresenceState>(state: T): T => {
+		"worklet";
+		for (const tag in state) {
+			const tagEntries = state[tag];
+
+			for (const entryScreenKey in tagEntries) {
+				const entry = tagEntries[entryScreenKey];
+				const shouldRemove =
+					entryScreenKey === ancestorKey ||
+					(entry.ancestorKeys?.includes(ancestorKey) ?? false);
+				if (shouldRemove) {
+					delete tagEntries[entryScreenKey];
+				}
+			}
+
+			if (!hasAnyKeys(tagEntries)) {
+				delete state[tag];
+			}
+		}
+		return state;
+	});
+};
+
+const clearPresenceByBranch = (branchNavigatorKey: NavigatorKey) => {
+	"worklet";
+	presence.modify(<T extends PresenceState>(state: T): T => {
+		"worklet";
+		for (const tag in state) {
+			const tagEntries = state[tag];
+
+			for (const entryScreenKey in tagEntries) {
+				const entry = tagEntries[entryScreenKey];
+				const shouldRemove =
+					entry.navigatorKey === branchNavigatorKey ||
+					(entry.ancestorNavigatorKeys?.includes(branchNavigatorKey) ?? false);
+
+				if (shouldRemove) {
+					delete tagEntries[entryScreenKey];
+				}
+			}
+
+			if (!hasAnyKeys(tagEntries)) {
+				delete state[tag];
+			}
+		}
+		return state;
+	});
+};
+
+function clear(screenKey: ScreenKey) {
+	"worklet";
+	const beforeMatches = countRegistryMatches(screenKey, false);
+	const beforePresenceMatches = countPresenceMatches(screenKey, false);
+
+	clearRegistry({
+		shouldRemoveSnapshot: (snapshotKey) => snapshotKey === screenKey,
+		shouldRemoveLink: (link) => {
+			return (
+				matchesScreenKey(link.source, screenKey) ||
+				matchesScreenKey(link.destination, screenKey)
+			);
+		},
+	});
+
+	clearPresenceDirect(screenKey);
+
+	const afterMatches = countRegistryMatches(screenKey, false);
+	const afterPresenceMatches = countPresenceMatches(screenKey, false);
+
+	debugClearLog(
+		`clear(${screenKey}) snapshots=${beforeMatches.snapshots}->${afterMatches.snapshots} links=${beforeMatches.links}->${afterMatches.links} presence=${beforePresenceMatches}->${afterPresenceMatches}`,
+	);
+	debugStoreSizeLog(`clear(${screenKey})`);
+}
+
+function clearByAncestor(ancestorKey: ScreenKey) {
+	"worklet";
+	const beforeMatches = countRegistryMatches(ancestorKey, true);
+	const beforePresenceMatches = countPresenceMatches(ancestorKey, true);
+
+	clearRegistry({
+		shouldRemoveSnapshot: (snapshotKey, snapshot) => {
+			return (
+				snapshotKey === ancestorKey ||
+				(snapshot.ancestorKeys?.includes(ancestorKey) ?? false)
+			);
+		},
+		shouldRemoveLink: (link) => {
+			return (
+				matchesScreenKey(link.source, ancestorKey) ||
+				matchesScreenKey(link.destination, ancestorKey)
+			);
+		},
+	});
+
+	clearPresenceByAncestor(ancestorKey);
+
+	const afterMatches = countRegistryMatches(ancestorKey, true);
+	const afterPresenceMatches = countPresenceMatches(ancestorKey, true);
+
+	debugClearLog(
+		`clearByAncestor(${ancestorKey}) snapshots=${beforeMatches.snapshots}->${afterMatches.snapshots} links=${beforeMatches.links}->${afterMatches.links} presence=${beforePresenceMatches}->${afterPresenceMatches}`,
+	);
+	debugStoreSizeLog(`clearByAncestor(${ancestorKey})`);
+}
+
+function clearByBranch(branchNavigatorKey: NavigatorKey) {
+	"worklet";
+	if (!branchNavigatorKey) return;
+
+	const beforeMatches = countRegistryMatchesByBranch(branchNavigatorKey);
+	const beforePresenceMatches =
+		countPresenceMatchesByBranch(branchNavigatorKey);
+
+	clearRegistry({
+		shouldRemoveSnapshot: (_snapshotKey, snapshot) => {
+			return (
+				snapshot.navigatorKey === branchNavigatorKey ||
+				(snapshot.ancestorNavigatorKeys?.includes(branchNavigatorKey) ?? false)
+			);
+		},
+		shouldRemoveLink: (link) => {
+			return (
+				matchesNavigatorKey(link.source, branchNavigatorKey) ||
+				matchesNavigatorKey(link.destination, branchNavigatorKey)
+			);
+		},
+	});
+
+	clearPresenceByBranch(branchNavigatorKey);
+
+	const afterMatches = countRegistryMatchesByBranch(branchNavigatorKey);
+	const afterPresenceMatches = countPresenceMatchesByBranch(branchNavigatorKey);
+
+	debugClearLog(
+		`clearByBranch(${branchNavigatorKey}) snapshots=${beforeMatches.snapshots}->${afterMatches.snapshots} links=${beforeMatches.links}->${afterMatches.links} presence=${beforePresenceMatches}->${afterPresenceMatches}`,
+	);
+	debugStoreSizeLog(`clearByBranch(${branchNavigatorKey})`);
+}
+
+export { clear, clearByAncestor, clearByBranch };