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

package/src/shared/components/create-boundary-component/utils/build-boundary-match-key.ts

@@ -5,9 +5,6 @@ type BuildBoundaryMatchKeyParams = {
 	id: BoundaryId;
 };
 
-export function buildBoundaryMatchKey(
-	params: BuildBoundaryMatchKeyParams,
-): string;
 export function buildBoundaryMatchKey(
 	params: BuildBoundaryMatchKeyParams,
 ): string {

package/src/shared/components/create-transition-aware-component.tsx

@@ -11,8 +11,8 @@ import Animated, {
 	useComposedEventHandler,
 } from "react-native-reanimated";
 import { NO_PROPS, NO_STYLES } from "../constants";
-import { useScrollRegistry } from "../hooks/gestures/use-scroll-registry";
 import { RegisterBoundsProvider } from "../providers/register-bounds.provider";
+import { useScrollGestureCoordination } from "../providers/screen/gestures/hooks/use-scroll-gesture-coordination";
 import { useScreenStyles } from "../providers/screen/styles";
 import type { TransitionAwareProps } from "../types/screen.types";
 
@@ -49,12 +49,17 @@ export function createTransitionAwareComponent<P extends object>(
 			: "vertical";
 
 		// Get scroll handlers and the gesture owner's nativeGesture for this axis
-		const { scrollHandler, onContentSizeChange, onLayout, nativeGesture } =
-			useScrollRegistry({
-				onContentSizeChange: scrollableProps.onContentSizeChange,
-				onLayout: scrollableProps.onLayout,
-				direction: scrollDirection,
-			});
+		const {
+			scrollHandler,
+			scrollEventsEnabled,
+			onContentSizeChange,
+			onLayout,
+			nativeGesture,
+		} = useScrollGestureCoordination({
+			onContentSizeChange: scrollableProps.onContentSizeChange,
+			onLayout: scrollableProps.onLayout,
+			direction: scrollDirection,
+		});
 
 		const composedScrollHandler = useComposedEventHandler([
 			scrollHandler,
@@ -65,12 +70,22 @@ export function createTransitionAwareComponent<P extends object>(
 			<AnimatedComponent
 				{...(scrollableProps as any)}
 				ref={ref}
-				onScroll={composedScrollHandler}
+				/**
+				 * Keep the scroll listener detached while the owning gesture screen is
+				 * closing. On iOS, a bounced ScrollView can keep sending native scroll
+				 * events after the transition gesture activates, which competes with
+				 * close animation work on the UI thread.
+				 */
+				onScroll={scrollEventsEnabled ? composedScrollHandler : undefined}
 				onMomentumScrollEnd={userOnMomentumScrollEnd}
 				onScrollEndDrag={userOnScrollEndDrag}
 				onContentSizeChange={onContentSizeChange}
 				onLayout={onLayout}
-				scrollEventThrottle={scrollableProps.scrollEventThrottle || 16}
+				scrollEventThrottle={
+					scrollEventsEnabled
+						? scrollableProps.scrollEventThrottle || 16
+						: undefined
+				}
 			/>
 		);
 
@@ -78,7 +93,6 @@ export function createTransitionAwareComponent<P extends object>(
 			return scrollableComponent;
 		}
 
-		// If no gesture owner found for this axis, render without GestureDetector
 		return (
 			<GestureDetector gesture={nativeGesture}>
 				{scrollableComponent}

package/src/shared/components/native-screen.tsx

@@ -74,7 +74,7 @@ export const NativeScreen = ({
 			return;
 		}
 
-		const focusedIndex = optimisticFocusedIndex.value;
+		const focusedIndex = optimisticFocusedIndex.get();
 		const topIsClosing =
 			topSceneClosing.get() > 0 && focusedIndex >= 0 && focusedIndex < topIndex;
 
@@ -120,7 +120,7 @@ export const NativeScreen = ({
 	const animatedProps = useAnimatedProps(() => {
 		const activity = screenActivity.get();
 		const isClosing = sceneClosing.get() > 0;
-		const activeIndex = optimisticFocusedIndex.value;
+		const activeIndex = optimisticFocusedIndex.get();
 		const isActive = index === activeIndex;
 
 		// Check if the active screen allows passthrough to the screen below

package/src/shared/components/overlay/variations/overlay-host.tsx

@@ -27,7 +27,7 @@ export const OverlayHost = memo(function OverlayHost({
 	const screenAnimation = useScreenAnimation();
 	const relativeProgress = useDerivedValue(() => {
 		"worklet";
-		return screenAnimation.value.stackProgress;
+		return screenAnimation.get().stackProgress;
 	});
 
 	const overlayProps: OverlayProps<BaseDescriptor["navigation"]> = useMemo(
@@ -45,11 +45,14 @@ export const OverlayHost = memo(function OverlayHost({
 	return (
 		<Animated.View
 			pointerEvents="box-none"
-			style={[styles.container, styles.floating, styles.absolute]}
+			style={[styles.container, styles.floating, StyleSheet.absoluteFill]}
 		>
 			<NavigationContext.Provider value={scene.descriptor.navigation as any}>
 				<NavigationRouteContext.Provider value={scene.route}>
-					<View pointerEvents="box-none" style={styles.overlay}>
+					<View
+						pointerEvents="box-none"
+						style={[StyleSheet.absoluteFill, styles.overlay]}
+					>
 						<OverlayComponent {...overlayProps} />
 					</View>
 				</NavigationRouteContext.Provider>
@@ -60,13 +63,11 @@ export const OverlayHost = memo(function OverlayHost({
 
 const styles = StyleSheet.create({
 	overlay: {
-		...StyleSheet.absoluteFillObject,
 		zIndex: 1,
 	},
 	container: {
 		flex: 1,
 	},
-	absolute: StyleSheet.absoluteFillObject,
 	floating: {
 		zIndex: 1000,
 	},

package/src/shared/{utils/gesture → components/screen-container/helpers}/find-collapse-target.ts

@@ -1,5 +1,5 @@
-import { EPSILON } from "../../constants";
-import { sanitizeSnapPoints } from "./validate-snap-points";
+import { EPSILON } from "../../../constants";
+import { sanitizeSnapPoints } from "../../../providers/screen/gestures/helpers/validate-snap-points";
 
 interface FindCollapseTargetResult {
 	target: number;

package/src/shared/components/screen-container/hooks/use-backdrop-pointer-events.ts

@@ -1,4 +1,7 @@
+import { useState } from "react";
+import { runOnJS, useAnimatedReaction } from "react-native-reanimated";
 import { useDescriptors } from "../../../providers/screen/descriptors";
+import { useScreenOptionsContext } from "../../../providers/screen/options";
 import { useStackCoreContext } from "../../../providers/stack/core.provider";
 import type { BackdropBehavior } from "../../../types/screen.types";
 import { StackType } from "../../../types/stack.types";
@@ -12,16 +15,33 @@ interface BackdropPointerEventsResult {
 /**
  * Returns pointer events and backdrop behavior based on screen options.
  *
- * - Explicit `backdropBehavior` option takes precedence
+ * - Runtime interpolator `backdropBehavior` takes precedence
+ * - Explicit descriptor `backdropBehavior` option is next
  * - Component stacks default to 'passthrough' (box-none)
  * - Other stacks default to 'block' (undefined = normal touch handling)
  */
 export function useBackdropPointerEvents(): BackdropPointerEventsResult {
 	const { current } = useDescriptors();
+	const screenOptions = useScreenOptionsContext();
 	const { flags } = useStackCoreContext();
+	const [runtimeBackdropBehavior, setRuntimeBackdropBehavior] = useState<
+		BackdropBehavior | undefined
+	>(undefined);
+
+	useAnimatedReaction(
+		() => screenOptions.get().backdropBehavior,
+		(next, previous) => {
+			"worklet";
+			if (next !== previous) {
+				runOnJS(setRuntimeBackdropBehavior)(next);
+			}
+		},
+		[screenOptions],
+	);
 
 	const isComponentStack = flags.STACK_TYPE === StackType.COMPONENT;
 	const backdropBehavior: BackdropBehavior =
+		runtimeBackdropBehavior ??
 		current.options.backdropBehavior ??
 		(isComponentStack ? "passthrough" : "block");
 

package/src/shared/components/screen-container/hooks/use-content-layout.ts

@@ -35,25 +35,25 @@ export function useContentLayout() {
 
 			runOnUI((nextWidth: number, nextHeight: number, nextFraction: number) => {
 				"worklet";
-				measuredContentLayout.value = {
+				measuredContentLayout.set({
 					width: nextWidth,
 					height: nextHeight,
-				};
+				});
 
-				const isFirstMeasurement = resolvedAutoSnapPoint.value <= 0;
-				resolvedAutoSnapPoint.value = nextFraction;
+				const isFirstMeasurement = resolvedAutoSnapPoint.get() <= 0;
+				resolvedAutoSnapPoint.set(nextFraction);
 
 				if (
 					!isFirstMeasurement ||
-					animations.progress.value !== 0 ||
-					animations.animating.value !== 0
+					animations.progress.get() !== 0 ||
+					animations.animating.get() !== 0
 				) {
 					return;
 				}
 
 				if (isFirstKey && !experimental_animateOnInitialMount) {
-					targetProgress.value = nextFraction;
-					animations.progress.value = nextFraction;
+					targetProgress.set(nextFraction);
+					animations.progress.set(nextFraction);
 					return;
 				}
 

package/src/shared/components/screen-container/layers/backdrop.tsx

@@ -15,7 +15,7 @@ import { GestureStore } from "../../../stores/gesture.store";
 import { SystemStore } from "../../../stores/system.store";
 import type { BackdropBehavior } from "../../../types/screen.types";
 import { animateToProgress } from "../../../utils/animation/animate-to-progress";
-import { findCollapseTarget } from "../../../utils/gesture/find-collapse-target";
+import { findCollapseTarget } from "../helpers/find-collapse-target";
 
 export const BackdropLayer = memo(function BackdropLayer({
 	backdropBehavior,
@@ -65,20 +65,20 @@ export const BackdropLayer = memo(function BackdropLayer({
 				"worklet";
 				const resolvedSnaps = rawSnapPoints
 					.map((point) =>
-						point === "auto" ? resolvedAutoSnapPoint.value : point,
+						point === "auto" ? resolvedAutoSnapPoint.get() : point,
 					)
 					.filter((point): point is number => typeof point === "number");
 
 				const { target, shouldDismiss } = findCollapseTarget(
-					animations.progress.value,
+					animations.progress.get(),
 					resolvedSnaps,
 					canDismiss,
 				);
 
 				// If already dismissing, skip
-				if (gestures.dismissing.value) return;
+				if (gestures.dismissing.get()) return;
 
-				gestures.dismissing.value = shouldDismiss ? 1 : 0;
+				gestures.dismissing.set(shouldDismiss ? 1 : 0);
 
 				const spec = shouldDismiss
 					? transitionSpec
@@ -118,7 +118,7 @@ export const BackdropLayer = memo(function BackdropLayer({
 
 	return (
 		<Pressable
-			style={StyleSheet.absoluteFillObject}
+			style={StyleSheet.absoluteFill}
 			pointerEvents={isBackdropActive ? "auto" : "none"}
 			onPress={isBackdropActive ? handleBackdropPress : undefined}
 		>
@@ -127,13 +127,11 @@ export const BackdropLayer = memo(function BackdropLayer({
 			 * animated style with animatedProps can break intensity updates. */}
 			{AnimatedBackdropComponent && (
 				<AnimatedBackdropComponent
-					style={[StyleSheet.absoluteFillObject]}
+					style={[StyleSheet.absoluteFill]}
 					animatedProps={animatedBackdropProps}
 				/>
 			)}
-			<Animated.View
-				style={[StyleSheet.absoluteFillObject, animatedBackdropStyle]}
-			/>
+			<Animated.View style={[StyleSheet.absoluteFill, animatedBackdropStyle]} />
 		</Pressable>
 	);
 });

package/src/shared/components/screen-container/layers/content.tsx

@@ -7,8 +7,8 @@ import Animated, {
 	useAnimatedStyle,
 } from "react-native-reanimated";
 import { NO_PROPS, NO_STYLES } from "../../../constants";
-import { useGestureContext } from "../../../providers/gestures";
 import { useDescriptors } from "../../../providers/screen/descriptors";
+import { useGestureContext } from "../../../providers/screen/gestures";
 import { useScreenStyles } from "../../../providers/screen/styles";
 import { useContentLayout } from "../hooks/use-content-layout";
 import { MaybeMaskedNavigationContainer } from "./maybe-masked-navigation-container";
@@ -45,7 +45,7 @@ export const ContentLayer = memo(
 		});
 
 		return (
-			<GestureDetector gesture={gestureContext!.panGesture}>
+			<GestureDetector gesture={gestureContext!.detectorGesture}>
 				<Animated.View
 					style={[styles.content, animatedContentStyle]}
 					animatedProps={animatedContentProps}

package/src/shared/components/screen-container/layers/maybe-masked-navigation-container.tsx

@@ -76,7 +76,6 @@ export const MaybeMaskedNavigationContainer = memo(
 						styles.navigationContainer,
 						animatedNavigationMaskContainerStyle,
 					]}
-					pointerEvents={pointerEvents}
 					collapsable={false}
 				>
 					{children}

package/src/shared/components/screen-lifecycle/hooks/helpers/reset-stores-for-screen.ts

@@ -6,6 +6,7 @@ import {
 	clearByBranch,
 } from "../../../../stores/bounds/internals/clear";
 import { GestureStore } from "../../../../stores/gesture.store";
+import { ScrollStore } from "../../../../stores/scroll.store";
 import { SystemStore } from "../../../../stores/system.store";
 
 export function resetStoresForScreen(
@@ -15,6 +16,7 @@ export function resetStoresForScreen(
 ) {
 	AnimationStore.clearBag(routeKey);
 	GestureStore.clearBag(routeKey);
+	ScrollStore.clearBag(routeKey);
 	SystemStore.clearBag(routeKey);
 
 	runOnUI(() => {

package/src/shared/components/screen-lifecycle/hooks/use-close-transition-intent.ts

@@ -47,7 +47,7 @@ const useManagedClose = ({
 
 	useAnimatedReaction(
 		() => {
-			const keys = closingRouteKeysShared.value;
+			const keys = closingRouteKeysShared.get();
 			return keys?.includes(routeKey) ?? false;
 		},
 		(isClosing, wasClosing) => {

package/src/shared/configs/presets.ts

@@ -407,18 +407,18 @@ export const SharedAppleMusic = ({
 
 			const normX = active.gesture.normX;
 			const normY = active.gesture.normY;
-			const initialDirection = active.gesture.direction;
+			const initialGesture = active.gesture.active ?? active.gesture.direction;
 
 			/**
 			 * ===============================
 			 * Animations for both bounds
 			 * ===============================
 			 */
-			const xResistance = initialDirection === "horizontal" ? 0.7 : 0.4;
-			const yResistance = initialDirection === "vertical" ? 0.7 : 0.4;
+			const xResistance = initialGesture === "horizontal" ? 0.7 : 0.4;
+			const yResistance = initialGesture === "vertical" ? 0.7 : 0.4;
 
-			const xScaleOuput = initialDirection === "horizontal" ? [1, 0.5] : [1, 1];
-			const yScaleOuput = initialDirection === "vertical" ? [1, 0.5] : [1, 1];
+			const xScaleOuput = initialGesture === "horizontal" ? [1, 0.5] : [1, 1];
+			const yScaleOuput = initialGesture === "vertical" ? [1, 0.5] : [1, 1];
 
 			const dragX = interpolate(
 				normX,

package/src/shared/configs/specs.ts

@@ -4,8 +4,8 @@ export const DefaultSpec: WithSpringConfig = {
 	stiffness: 1000,
 	damping: 500,
 	mass: 3,
-	overshootClamping: true,
-	// @ts-expect-error
+	overshootClamping: false,
+	// @ts-expect-error Reanimated v3 spring config support.
 	restSpeedThreshold: 0.02,
 };
 

package/src/shared/constants.ts

@@ -1,9 +1,12 @@
 import type { ParamListBase, RouteProp } from "@react-navigation/native";
 import { Platform } from "react-native";
 import type { MeasuredDimensions } from "react-native-reanimated";
-import type { ScreenTransitionState } from "./types/animation.types";
+import type {
+	ScreenTransitionOptions,
+	ScreenTransitionState,
+} from "./types/animation.types";
 import type { ActivationArea } from "./types/gesture.types";
-import type { Layout } from "./types/screen.types";
+import type { Layout, SheetScrollGestureBehavior } from "./types/screen.types";
 import type { BaseStackRoute } from "./types/stack.types";
 
 /**
@@ -31,13 +34,24 @@ export const NO_PROPS = Object.freeze({});
 /**
  * Default gesture values
  */
-const DEFAULT_GESTURE_VALUES = {
+const DEFAULT_RAW_GESTURE_VALUES = {
 	x: 0,
 	y: 0,
 	normX: 0,
 	normY: 0,
+	scale: 1,
+	normScale: 0,
+} as const;
+
+const DEFAULT_GESTURE_VALUES = {
+	...DEFAULT_RAW_GESTURE_VALUES,
+	focalX: 0,
+	focalY: 0,
+	raw: DEFAULT_RAW_GESTURE_VALUES,
 	dismissing: 0,
 	dragging: 0,
+	settling: 0,
+	active: null,
 	direction: null,
 
 	// Deprecated aliases
@@ -47,6 +61,14 @@ const DEFAULT_GESTURE_VALUES = {
 	isDragging: 0,
 } as const;
 
+const createDefaultGestureValues = () => ({
+	...DEFAULT_GESTURE_VALUES,
+	raw: { ...DEFAULT_RAW_GESTURE_VALUES },
+});
+
+export const DEFAULT_SCREEN_TRANSITION_OPTIONS: ScreenTransitionOptions =
+	Object.freeze({});
+
 /**
  * Creates a new screen transition state object
  */
@@ -54,6 +76,7 @@ export const createScreenTransitionState = (
 	route: BaseStackRoute,
 	meta?: Record<string, unknown>,
 	navigationMaskEnabled = false,
+	options: ScreenTransitionOptions = DEFAULT_SCREEN_TRANSITION_OPTIONS,
 ): ScreenTransitionState => ({
 	progress: 0,
 	closing: 0,
@@ -62,9 +85,10 @@ export const createScreenTransitionState = (
 	settled: 1,
 	logicallySettled: 1,
 	entering: 0,
-	gesture: { ...DEFAULT_GESTURE_VALUES },
+	gesture: createDefaultGestureValues(),
 	route,
 	meta,
+	options,
 	layouts: {
 		screen: {
 			width: 0,
@@ -72,6 +96,7 @@ export const createScreenTransitionState = (
 		},
 		navigationMaskEnabled,
 	},
+	animatedSnapIndex: -1,
 	snapIndex: -1,
 });
 
@@ -87,8 +112,9 @@ export const DEFAULT_SCREEN_TRANSITION_STATE: ScreenTransitionState =
 		settled: 1,
 		logicallySettled: 1,
 		entering: 0,
-		gesture: DEFAULT_GESTURE_VALUES,
+		gesture: createDefaultGestureValues(),
 		route: {} as RouteProp<ParamListBase>,
+		options: DEFAULT_SCREEN_TRANSITION_OPTIONS,
 		layouts: {
 			screen: {
 				width: 0,
@@ -96,6 +122,7 @@ export const DEFAULT_SCREEN_TRANSITION_STATE: ScreenTransitionState =
 			},
 			navigationMaskEnabled: false,
 		},
+		animatedSnapIndex: -1,
 		snapIndex: -1,
 	});
 
@@ -131,11 +158,14 @@ export const FULLSCREEN_DIMENSIONS = (
 export const DEFAULT_GESTURE_VELOCITY_IMPACT = 0.3;
 export const DEFAULT_GESTURE_SNAP_VELOCITY_IMPACT = 0.1;
 export const DEFAULT_GESTURE_RELEASE_VELOCITY_MAX = 3.2;
+export const DEFAULT_GESTURE_SENSITIVITY = 1;
 export const DEFAULT_GESTURE_RELEASE_VELOCITY_SCALE = 1;
 export const DEFAULT_GESTURE_DIRECTION = "horizontal";
 export const DEFAULT_GESTURE_DRIVES_PROGRESS = true;
 export const DEFAULT_GESTURE_SNAP_LOCKED = false;
 export const DEFAULT_GESTURE_ACTIVATION_AREA: ActivationArea = "screen";
+export const DEFAULT_SHEET_SCROLL_GESTURE_BEHAVIOR: SheetScrollGestureBehavior =
+	"expand-and-collapse";
 
 export const IS_WEB = Platform.OS === "web";
 

package/src/shared/hooks/reanimated/use-animated-debounce.ts

@@ -28,10 +28,7 @@ export function useAnimatedDebounce(
 	const trigger = () => {
 		"worklet";
 		cancelAnimation(token);
-		token.value = withDelay(
-			delayMs,
-			withTiming(token.value + 1, { duration: 0 }),
-		);
+		token.set(withDelay(delayMs, withTiming(token.get() + 1, { duration: 0 })));
 	};
 
 	const cancel = () => {
@@ -40,7 +37,7 @@ export function useAnimatedDebounce(
 	};
 
 	useAnimatedReaction(
-		() => token.value,
+		() => token.get(),
 		(nextToken, previousToken) => {
 			"worklet";
 			if (nextToken === 0 || nextToken === previousToken) {

package/src/shared/hooks/reanimated/use-shared-value-ref.ts

@@ -9,11 +9,11 @@ import { IS_WEB } from "../../constants";
 
 export function readInitialValue<T>(sharedValue: SharedValue<T>): T {
 	if (IS_WEB) {
-		return sharedValue.value;
+		return sharedValue.get();
 	}
 	const readOnUI = executeOnUIRuntimeSync((sv: SharedValue<T>) => {
 		"worklet";
-		return sv.value;
+		return sv.get();
 	});
 	return readOnUI(sharedValue);
 }
@@ -32,7 +32,7 @@ export function useSharedValueRef<T>(
 	}, []);
 
 	useAnimatedReaction(
-		() => sharedValue.value,
+		() => sharedValue.get(),
 		(value, previousValue) => {
 			if (Object.is(value, previousValue)) return;
 			runOnJS(updateRef)(value);

package/src/shared/hooks/reanimated/use-shared-value-state.ts

@@ -14,7 +14,7 @@ export function useSharedValueState<T>(sharedValue: SharedValue<T>): T {
 	const [state, setState] = useState<T>(() => readInitialValue(sharedValue));
 
 	useAnimatedReaction(
-		() => sharedValue.value,
+		() => sharedValue.get(),
 		(value, previousValue) => {
 			if (Object.is(value, previousValue)) return;
 			runOnJS(setState)(value);

package/src/shared/hooks/use-stable-callback-value.ts

@@ -60,16 +60,16 @@ export default function useStableCallbackValue<C extends AnyFunction>(
 
 	useEffect(() => {
 		if (callback) {
-			stableCallback.value = wrap(callback);
+			stableCallback.set(wrap(callback));
 		} else {
-			stableCallback.value = null;
+			stableCallback.set(null);
 		}
 	}, [callback, stableCallback]);
 
 	return useCallback(
 		(...args: Parameters<C>) => {
 			"worklet";
-			stableCallback.value?.call(...args);
+			stableCallback.get()?.call(...args);
 		},
 		[stableCallback],
 	);

package/src/shared/index.ts

@@ -30,10 +30,6 @@ export {
 	NAVIGATION_MASK_ELEMENT_STYLE_ID,
 	TRANSFORM_RESET,
 } from "./constants";
-export {
-	type ScreenGestureTarget,
-	useScreenGesture,
-} from "./hooks/gestures/use-screen-gesture";
 export { useHistory } from "./hooks/navigation/use-history";
 export {
 	type ScreenState,
@@ -43,11 +39,16 @@ export {
 	type ScreenAnimationTarget,
 	useScreenAnimation,
 } from "./providers/screen/animation";
+export {
+	type ScreenGestureTarget,
+	useScreenGesture,
+} from "./providers/screen/gestures/hooks/use-screen-gesture";
 
 export type {
 	AnimatedViewStyle,
 	AnimationConfig,
 	BoundsNavigationAccessor,
+	BoundsNavigationRevealStyle,
 	BoundsNavigationZoomOpacityRange,
 	BoundsNavigationZoomOpacityRanges,
 	BoundsNavigationZoomOptions,

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

@@ -11,16 +11,16 @@ 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 { applyMeasuredBoundsWrites } from "../stores/bounds/helpers/apply-measured-bounds-writes";
+import { getEntry } from "../stores/bounds/internals/entries";
 import {
-	getMeasuredEntry,
 	getPendingLink,
 	hasDestinationLink,
 	hasSourceLink,
-} from "../stores/bounds/internals/registry";
+} from "../stores/bounds/internals/links";
 import { prepareStyleForBounds } from "../utils/bounds/helpers/styles/styles";
 import createProvider from "../utils/create-provider";
 import { useDescriptorDerivations, useDescriptors } from "./screen/descriptors";
@@ -281,8 +281,8 @@ const registerBoundsBundle = createProvider("RegisterBounds", {
 				}
 
 				if (shouldSetSource && isAnimating.get()) {
-					const existing = getMeasuredEntry(sharedBoundTag, currentScreenKey);
-					if (existing) {
+					const existing = getEntry(sharedBoundTag, currentScreenKey);
+					if (existing?.bounds) {
 						applyMeasuredBoundsWrites({
 							sharedBoundTag,
 							ancestorKeys,
@@ -344,7 +344,6 @@ const registerBoundsBundle = createProvider("RegisterBounds", {
 					ancestorKeys,
 					navigatorKey,
 					ancestorNavigatorKeys,
-					shouldWriteEntry: true,
 					shouldSetSource: canSetSource,
 					shouldUpdateSource: canUpdateSource,
 					shouldSetDestination: canSetDestination,

package/src/shared/providers/screen/animation/animation.provider.tsx

@@ -28,6 +28,7 @@ export const {
 
 	const {
 		screenInterpolatorProps,
+		screenInterpolatorFrameUpdater,
 		nextInterpolator,
 		currentInterpolator,
 		boundsAccessor,
@@ -37,6 +38,8 @@ export const {
 		? [
 				{
 					screenInterpolatorProps: parentContext.screenInterpolatorProps,
+					screenInterpolatorFrameUpdater:
+						parentContext.screenInterpolatorFrameUpdater,
 					boundsAccessor: parentContext.boundsAccessor,
 				},
 				...parentContext.ancestorScreenAnimationSources,
@@ -46,6 +49,7 @@ export const {
 	return {
 		value: {
 			screenInterpolatorProps,
+			screenInterpolatorFrameUpdater,
 			nextInterpolator,
 			currentInterpolator,
 			boundsAccessor,