react-native-screen-transitions 3.12.0 → 3.13.0-beta.0

package/src/shared/components/boundary/hooks/lifecycles/use-boundary-measurement-request.ts

@@ -0,0 +1,102 @@
+import { useCallback, useEffect } from "react";
+import {
+	cancelAnimation,
+	useAnimatedReaction,
+	useSharedValue,
+	withDelay,
+	withTiming,
+} from "react-native-reanimated";
+import {
+	abandonBoundaryMeasurement,
+	getBoundaryMeasurementRequest,
+} from "../../../../stores/bounds/internals/coordinator";
+import { pairs } from "../../../../stores/bounds/internals/state";
+import type { BoundTag } from "../../../../stores/bounds/types";
+import { logger } from "../../../../utils/logger";
+import type { MeasureBoundary, MeasureTarget } from "../../types";
+
+const RETRY_DELAY_MS = 16;
+const MAX_RETRIES = 20;
+
+export const useBoundaryMeasurementRequest = (params: {
+	enabled: boolean;
+	boundTag: BoundTag;
+	currentScreenKey: string;
+	measureBoundary: MeasureBoundary;
+}) => {
+	const { enabled, boundTag, currentScreenKey, measureBoundary } = params;
+	const retryClock = useSharedValue(0);
+
+	const fulfillRequest = useCallback(
+		function retry(request: MeasureTarget, attempt: number) {
+			"worklet";
+			if (!enabled) return;
+
+			const pending = getBoundaryMeasurementRequest(
+				boundTag.tag,
+				currentScreenKey,
+				pairs.get(),
+			);
+			if (
+				pending?.type !== request.type ||
+				pending.pairKey !== request.pairKey
+			) {
+				return;
+			}
+
+			if (measureBoundary(request)) return;
+
+			if (attempt >= MAX_RETRIES) {
+				abandonBoundaryMeasurement({ ...request, tag: boundTag.tag });
+				logger.warn(
+					`Boundary "${boundTag.tag}" on screen "${currentScreenKey}" could not complete its ${request.type} measurement after ${MAX_RETRIES} attempts; continuing without it.`,
+				);
+				return;
+			}
+
+			cancelAnimation(retryClock);
+			retryClock.set(
+				withDelay(
+					RETRY_DELAY_MS,
+					withTiming(retryClock.get() + 1, { duration: 0 }, (finished) => {
+						if (finished) retry(request, attempt + 1);
+					}),
+				),
+			);
+		},
+		[boundTag.tag, currentScreenKey, enabled, measureBoundary, retryClock],
+	);
+
+	useEffect(() => {
+		return () => {
+			cancelAnimation(retryClock);
+		};
+	}, [retryClock]);
+
+	useAnimatedReaction(
+		() => {
+			"worklet";
+			if (!enabled) return null;
+			// Read the mutable in the reaction itself. Hiding this read behind an
+			// imported helper prevented the mapper from subscribing to pair changes,
+			// so requests were only observed after a React refresh/remount.
+			return getBoundaryMeasurementRequest(
+				boundTag.tag,
+				currentScreenKey,
+				pairs.get(),
+			);
+		},
+		(request, previousRequest) => {
+			"worklet";
+			if (
+				!request ||
+				(request.type === previousRequest?.type &&
+					request.pairKey === previousRequest.pairKey)
+			) {
+				return;
+			}
+
+			fulfillRequest(request, 0);
+		},
+	);
+};

package/src/shared/components/boundary/hooks/lifecycles/use-boundary-presence.ts

@@ -1,9 +1,9 @@
 import { useLayoutEffect } from "react";
 import { runOnUI } from "react-native-reanimated";
 import {
-	removeEntry,
-	setEntry,
-} from "../../../../stores/bounds/internals/entries";
+	registerBoundary,
+	unregisterBoundary,
+} from "../../../../stores/bounds/internals/coordinator";
 import type { BoundTag } from "../../../../stores/bounds/types";
 import type { BoundaryConfigProps } from "../../types";
 
@@ -23,19 +23,28 @@ export const useBoundaryPresence = (params: {
 		handoff,
 		escapeClipping,
 	} = params;
-	const { tag } = boundTag;
-
 	useLayoutEffect(() => {
 		if (!enabled) return;
 
-		runOnUI(setEntry)(tag, currentScreenKey, {
-			boundaryConfig,
-			handoff: handoff ? true : null,
-			escapeClipping: escapeClipping ? true : null,
+		runOnUI(registerBoundary)({
+			boundTag,
+			screenKey: currentScreenKey,
+			entry: {
+				boundaryConfig,
+				handoff: handoff ? true : null,
+				escapeClipping: escapeClipping ? true : null,
+			},
 		});
 
 		return () => {
-			runOnUI(removeEntry)(tag, currentScreenKey);
+			runOnUI(unregisterBoundary)(boundTag, currentScreenKey);
 		};
-	}, [enabled, tag, currentScreenKey, boundaryConfig, handoff, escapeClipping]);
+	}, [
+		enabled,
+		boundTag,
+		currentScreenKey,
+		boundaryConfig,
+		handoff,
+		escapeClipping,
+	]);
 };

package/src/shared/components/boundary/hooks/use-boundary-measurement.ts

@@ -7,18 +7,14 @@ import type {
 	BoundaryConfigProps,
 	BoundaryLocalMeasurementValue,
 } from "../types";
+import { useBoundaryMeasurementRequest } from "./lifecycles/use-boundary-measurement-request";
 import { useBoundaryPresence } from "./lifecycles/use-boundary-presence";
-import { useInitialDestinationMeasurement } from "./lifecycles/use-initial-destination-measurement";
-import { useInitialSourceMeasurement } from "./lifecycles/use-initial-source-measurement";
-import { useRefreshBoundary } from "./lifecycles/use-refresh-boundary";
 import { useMeasurer } from "./use-measurer";
 
 interface UseBoundaryMeasurementParams {
 	boundTag: BoundTag;
 	/** Raw `enabled` prop — drives the measurer and the passive-source gate. */
 	enabled: boolean;
-	/** `enabled && hasConfiguredInterpolator` — gates presence + lifecycle. */
-	runtimeEnabled: boolean;
 	currentScreenKey: string;
 	/** Surface to measure: a nested target's placeholder, else the root. */
 	measuredRef: AnimatedRef<View>;
@@ -38,7 +34,6 @@ interface UseBoundaryMeasurementParams {
 export const useBoundaryMeasurement = ({
 	boundTag,
 	enabled,
-	runtimeEnabled,
 	currentScreenKey,
 	measuredRef,
 	style,
@@ -66,9 +61,6 @@ export const useBoundaryMeasurement = ({
 		localMeasurement,
 	});
 
-	// Presence and source capture must not depend on this screen owning an
-	// interpolator: a nested source can participate in a transition owned by a
-	// different navigator.
 	useBoundaryPresence({
 		enabled,
 		boundTag,
@@ -78,21 +70,10 @@ export const useBoundaryMeasurement = ({
 		escapeClipping,
 	});
 
-	useInitialSourceMeasurement({
+	useBoundaryMeasurementRequest({
 		enabled,
-		measureBoundary,
-		boundTag,
-	});
-
-	useInitialDestinationMeasurement({
-		boundTag,
-		enabled: runtimeEnabled,
-		measureBoundary,
-	});
-
-	useRefreshBoundary({
-		enabled: runtimeEnabled,
 		boundTag,
+		currentScreenKey,
 		measureBoundary,
 	});
 };

package/src/shared/components/boundary/hooks/use-measurer.ts

@@ -6,7 +6,6 @@ import { applyMeasuredBoundsWrites } from "../../../providers/helpers/measured-b
 import { useScreenSlots } from "../../../providers/screen/styles";
 import type { BoundTag } from "../../../stores/bounds/types";
 import { ScrollStore } from "../../../stores/scroll.store";
-import { SystemStore } from "../../../stores/system.store";
 import { getVisibilityBlockOffset } from "../../../utils/visibility-block-offset";
 import type { BoundaryLocalMeasurementValue, MeasureBoundary } from "../types";
 import {
@@ -42,23 +41,19 @@ export const useMeasurer = ({
 
 	const scrollState = ScrollStore.getValue(currentScreenKey, "coordination");
 	const scrollMetadata = ScrollStore.getValue(currentScreenKey, "metadata");
-	const pendingLifecycleStartBlockCount = SystemStore.getValue(
-		currentScreenKey,
-		"pendingLifecycleStartBlockCount",
-	);
 	const { visibilityBlocked } = useScreenSlots();
 
 	return useCallback(
 		(target) => {
 			"worklet";
-			if (!enabled) return;
+			if (!enabled) return false;
 
 			const measured = measureWithOverscrollAwareness(
 				measuredAnimatedRef,
 				scrollState.get(),
 			);
 
-			if (!measured) return;
+			if (!measured) return false;
 
 			const correctedMeasured = correctMeasuredBoundsForVisibilityGate({
 				measured,
@@ -75,26 +70,15 @@ export const useMeasurer = ({
 				});
 			}
 
-			/**
-			 * - Destination Pass -
-			 * Be strict while lifecycle start is blocked for destination capture.
-			 * This is the initial attach window: the transition has not started yet,
-			 * and malformed off-screen destination measurements should keep the
-			 * lifecycle blocked until a valid retry lands.
-			 */
-			const shouldGuardDestinationViewport =
-				pendingLifecycleStartBlockCount.get() > 0 || !!boundTag.group;
-
 			const viewportAllowsDestinationWrite =
 				target.type !== "destination" ||
-				!shouldGuardDestinationViewport ||
 				isMeasurementInViewport(
 					correctedMeasured,
 					viewportWidth,
 					viewportHeight,
 				);
 
-			if (!viewportAllowsDestinationWrite) return;
+			if (!viewportAllowsDestinationWrite) return false;
 
 			const measuredWithScroll = attachScrollSnapshotToMeasuredBounds(
 				correctedMeasured,
@@ -112,6 +96,8 @@ export const useMeasurer = ({
 				handoff,
 				escapeClipping,
 			});
+
+			return true;
 		},
 		[
 			enabled,
@@ -126,7 +112,6 @@ export const useMeasurer = ({
 			viewportHeight,
 			scrollState,
 			scrollMetadata,
-			pendingLifecycleStartBlockCount,
 			visibilityBlocked,
 		],
 	);

package/src/shared/components/boundary/portal/components/boundary-content-portal/helpers/active-handoff-receiver.ts

@@ -13,6 +13,23 @@ type ResolveActiveHandoffReceiverParams = {
 	scenes: ReceiverScene[];
 };
 
+export const hasNestedHandoffTopology = ({
+	inheritedSourcePair,
+	pairDestinationScreenKey,
+	transitionDestinationScreenKey,
+}: {
+	inheritedSourcePair: boolean;
+	pairDestinationScreenKey: string | null;
+	transitionDestinationScreenKey?: string;
+}) => {
+	"worklet";
+	return (
+		inheritedSourcePair ||
+		(!!pairDestinationScreenKey &&
+			pairDestinationScreenKey !== transitionDestinationScreenKey)
+	);
+};
+
 export const resolveActiveHandoffReceiver = ({
 	focusedIndex,
 	routes,
@@ -101,3 +118,26 @@ export const resolveHandoffAttachmentCandidate = ({
 
 	return activeReceiverScreenKey;
 };
+
+export const resolveNestedHandoffAttachmentCandidate = ({
+	attachedReceiverScreenKey,
+	currentScreenKey,
+	hasActiveCloseFinished,
+	interpolatorReady,
+	pairDestinationScreenKey,
+}: {
+	attachedReceiverScreenKey: string;
+	currentScreenKey: string;
+	hasActiveCloseFinished: boolean;
+	interpolatorReady: boolean;
+	pairDestinationScreenKey: string | null;
+}) => {
+	"worklet";
+
+	if (hasActiveCloseFinished) return currentScreenKey;
+	if (interpolatorReady && pairDestinationScreenKey) {
+		return pairDestinationScreenKey;
+	}
+
+	return attachedReceiverScreenKey;
+};

package/src/shared/components/boundary/portal/components/boundary-content-portal/hooks/use-boundary-content-portal-attachment.ts

@@ -11,8 +11,10 @@ import { SystemStore } from "../../../../../../stores/system.store";
 import { PORTAL_HOST_NAME_RESET_VALUE } from "../../../utils/naming";
 import { isTeleportEnabled } from "../../../utils/teleport-control";
 import {
+	hasNestedHandoffTopology,
 	resolveActiveHandoffReceiver,
 	resolveHandoffAttachmentCandidate,
+	resolveNestedHandoffAttachmentCandidate,
 	resolvePreviousHandoffReceiver,
 } from "../helpers/active-handoff-receiver";
 import { createBoundaryContentPortalHostName } from "../helpers/host-name";
@@ -31,7 +33,19 @@ export const useBoundaryContentPortalAttachment = ({
 	);
 	const nextScreenKey = useDescriptorsStore((s) => s.derivations.nextScreenKey);
 	const sourcePairKey = useDescriptorsStore((s) => s.derivations.sourcePairKey);
-	const destinationSlots = useScreenSlots(nextScreenKey ?? currentScreenKey);
+	const transitionSourcePairKey = useDescriptorsStore(
+		(s) => s.derivations.transitionSourcePairKey,
+	);
+	const transitionDestinationScreenKey = useDescriptorsStore(
+		(s) => s.derivations.transitionDestinationScreenKey,
+	);
+	const isNestedSource = !sourcePairKey && !!transitionSourcePairKey;
+	const resolvedSourcePairKey = sourcePairKey ?? transitionSourcePairKey;
+	const resolvedDestinationScreenKey =
+		nextScreenKey ?? transitionDestinationScreenKey;
+	const destinationSlots = useScreenSlots(
+		resolvedDestinationScreenKey ?? currentScreenKey,
+	);
 	const unavailableInterpolatorReady = useSharedValue(0);
 	const interpolatorReady =
 		destinationSlots?.interpolatorReady ?? unavailableInterpolatorReady;
@@ -48,6 +62,18 @@ export const useBoundaryContentPortalAttachment = ({
 		activeReceiverScreenKey ?? currentScreenKey,
 		"closing",
 	);
+	const nestedDestinationAnimationProgress = SystemStore.getValue(
+		isNestedSource && resolvedDestinationScreenKey
+			? resolvedDestinationScreenKey
+			: currentScreenKey,
+		"animationProgress",
+	);
+	const nestedDestinationClosing = AnimationStore.getValue(
+		isNestedSource && resolvedDestinationScreenKey
+			? resolvedDestinationScreenKey
+			: currentScreenKey,
+		"closing",
+	);
 
 	const attachedReceiverScreenKey = useSharedValue(currentScreenKey);
 	const sourcePairBeforeClose = useSharedValue<string | null>(null);
@@ -63,24 +89,30 @@ export const useBoundaryContentPortalAttachment = ({
 		} = slot?.props ?? {};
 
 		const shouldTeleport = isTeleportEnabled(teleport);
-		const closing = activeReceiverClosing.get();
-		const animationProgress = activeReceiverAnimationProgress.get();
+		const closing = isNestedSource
+			? nestedDestinationClosing.get()
+			: activeReceiverClosing.get();
+		const animationProgress = isNestedSource
+			? nestedDestinationAnimationProgress.get()
+			: activeReceiverAnimationProgress.get();
 
 		if (!closing) {
-			sourcePairBeforeClose.set(sourcePairKey ?? null);
+			sourcePairBeforeClose.set(resolvedSourcePairKey ?? null);
 		}
 
 		const pairChangedDuringClose =
 			!!closing &&
-			!!sourcePairKey &&
-			sourcePairKey !== sourcePairBeforeClose.get();
+			!!resolvedSourcePairKey &&
+			resolvedSourcePairKey !== sourcePairBeforeClose.get();
 
 		const hasActiveCloseFinished = hasCloseTransitionFinished({
 			closing,
 			animationProgress,
 		});
 
-		const pair = sourcePairKey ? pairs.get()[sourcePairKey] : null;
+		const pair = resolvedSourcePairKey
+			? pairs.get()[resolvedSourcePairKey]
+			: null;
 		const link = pair?.links[getLinkKeyFromTag(boundaryId)];
 
 		const pairDestination =
@@ -92,18 +124,31 @@ export const useBoundaryContentPortalAttachment = ({
 
 		const isInterpolatorReady = interpolatorReady.get();
 		const attachedScreenKey = attachedReceiverScreenKey.get();
-
-		const nextReceiverScreenKey = resolveHandoffAttachmentCandidate({
-			activeReceiverClosing: !!closing,
-			activeReceiverScreenKey,
-			attachedReceiverScreenKey: attachedScreenKey,
-			hasActiveCloseFinished,
-			interpolatorReady: !!isInterpolatorReady,
-			pairChangedDuringClose,
+		const usesNestedReceiver = hasNestedHandoffTopology({
+			inheritedSourcePair: isNestedSource,
 			pairDestinationScreenKey: pairDestination,
-			previousReceiverScreenKey,
+			transitionDestinationScreenKey: resolvedDestinationScreenKey,
 		});
 
+		const nextReceiverScreenKey = usesNestedReceiver
+			? resolveNestedHandoffAttachmentCandidate({
+					attachedReceiverScreenKey: attachedScreenKey,
+					currentScreenKey,
+					hasActiveCloseFinished,
+					interpolatorReady: !!isInterpolatorReady,
+					pairDestinationScreenKey: pairDestination,
+				})
+			: resolveHandoffAttachmentCandidate({
+					activeReceiverClosing: !!closing,
+					activeReceiverScreenKey,
+					attachedReceiverScreenKey: attachedScreenKey,
+					hasActiveCloseFinished,
+					interpolatorReady: !!isInterpolatorReady,
+					pairChangedDuringClose,
+					pairDestinationScreenKey: pairDestination,
+					previousReceiverScreenKey,
+				});
+
 		const receiverEntry = nextReceiverScreenKey
 			? getEntry(boundaryId, nextReceiverScreenKey)
 			: null;
@@ -118,10 +163,13 @@ export const useBoundaryContentPortalAttachment = ({
 			!!isInterpolatorReady &&
 			nextReceiverScreenKey === pairDestination;
 
-		const canActivateReceiver =
-			returningFromActiveClose ||
-			activatingPairDestination ||
-			animationProgress > 0;
+		const canActivateReceiver = usesNestedReceiver
+			? nextReceiverScreenKey === attachedScreenKey ||
+				hasActiveCloseFinished ||
+				activatingPairDestination
+			: returningFromActiveClose ||
+				activatingPairDestination ||
+				animationProgress > 0;
 
 		if (nextReceiverScreenKey && receiverReady && canActivateReceiver) {
 			attachedReceiverScreenKey.set(nextReceiverScreenKey);

package/src/shared/components/boundary/portal/components/boundary-portal/components/portal-boundary-host.tsx

@@ -13,7 +13,9 @@ import Animated, {
 } from "react-native-reanimated";
 import { NO_STYLES } from "../../../../../../constants";
 import { composeSlotStyleWithLocalTransform } from "../../../../../../providers/screen/styles/helpers/compose-slot-style";
+import { markBoundaryPortalReady } from "../../../../../../stores/bounds/internals/coordinator";
 import { NativePortalHost, PORTAL_POINTER_EVENTS } from "../../../teleport";
+import { resolveReadyPortalHostName } from "../helpers/host-readiness";
 import { resolveBoundaryLocalMeasurement } from "../helpers/local-measurement";
 import { resolvePortalOffsetStyle } from "../helpers/offset-style";
 import type { ActivePortalBoundaryHost } from "../stores/portal-boundary-host.store";
@@ -57,8 +59,15 @@ export const PortalBoundaryHost = memo(function PortalBoundaryHost({
 		},
 		(ready) => {
 			"worklet";
+			host.portalHostReady.set(
+				resolveReadyPortalHostName({
+					currentReadyHostName: host.portalHostReady.get(),
+					hostName: host.portalHostName,
+					ready,
+				}),
+			);
 			if (ready) {
-				host.portalHostReady.set(true);
+				markBoundaryPortalReady(host.pairKey, host.boundaryId);
 			}
 		},
 	);

package/src/shared/components/boundary/portal/components/boundary-portal/helpers/attachment.ts

@@ -0,0 +1,19 @@
+import type { BoundaryTeleportControl } from "../../../../../../types/animation.types";
+import { isTeleportEnabled } from "../../../utils/teleport-control";
+
+export const shouldAttachBoundaryPortal = ({
+	focused,
+	portalHostReady,
+	slotActive,
+	teleport,
+}: {
+	focused: boolean;
+	portalHostReady: boolean;
+	slotActive: boolean;
+	teleport?: BoundaryTeleportControl;
+}) => {
+	"worklet";
+	return (
+		slotActive && !focused && portalHostReady && isTeleportEnabled(teleport)
+	);
+};

package/src/shared/components/boundary/portal/components/boundary-portal/helpers/host-readiness.ts

@@ -0,0 +1,14 @@
+export const resolveReadyPortalHostName = ({
+	currentReadyHostName,
+	hostName,
+	ready,
+}: {
+	currentReadyHostName: string | null;
+	hostName: string;
+	ready: boolean;
+}) => {
+	"worklet";
+
+	if (ready) return hostName;
+	return currentReadyHostName === hostName ? null : currentReadyHostName;
+};

package/src/shared/components/boundary/portal/components/boundary-portal/helpers/local-measurement.ts

@@ -1,5 +1,40 @@
-import type { ScreenPairKey } from "../../../../../../stores/bounds/types";
+import {
+	getGroupKeyFromTag,
+	getLinkKeyFromTag,
+} from "../../../../../../stores/bounds/helpers/link-pairs.helpers";
+import type {
+	LinkPairsState,
+	ScreenPairKey,
+} from "../../../../../../stores/bounds/types";
+import type { NormalizedTransitionSlotStyle } from "../../../../../../types/animation.types";
 import type { BoundaryLocalMeasurement } from "../../../../types";
+import { isTeleportEnabled } from "../../../utils/teleport-control";
+
+export const resolveBoundaryPortalPairKey = (
+	measurement: BoundaryLocalMeasurement | null,
+): ScreenPairKey | null => {
+	"worklet";
+	return measurement?.pairKey ?? null;
+};
+
+export const resolveActiveBoundaryPortalPairKey = (
+	measurement: BoundaryLocalMeasurement | null,
+	slot: NormalizedTransitionSlotStyle | undefined,
+	boundaryId: string,
+	pairsState: LinkPairsState,
+): ScreenPairKey | null => {
+	"worklet";
+	if (!measurement) return null;
+
+	const group = getGroupKeyFromTag(boundaryId);
+	if (group) {
+		const activeId = pairsState[measurement.pairKey]?.groups[group]?.activeId;
+		if (activeId !== getLinkKeyFromTag(boundaryId)) return null;
+	}
+
+	if (slot && !isTeleportEnabled(slot.props?.teleport)) return null;
+	return measurement.pairKey;
+};
 
 export const resolveBoundaryLocalMeasurement = (
 	measurement: BoundaryLocalMeasurement | null,

package/src/shared/components/boundary/portal/components/boundary-portal/hooks/use-active-portal-boundary-host.ts

@@ -4,11 +4,13 @@ import {
 	type SharedValue,
 	useAnimatedReaction,
 } from "react-native-reanimated";
-import { getPairKeyForSource } from "../../../../../../stores/bounds/internals/links";
+import { pairs } from "../../../../../../stores/bounds/internals/state";
 import type { ScreenPairKey } from "../../../../../../stores/bounds/types";
 import type { NormalizedTransitionInterpolatedStyle } from "../../../../../../types/animation.types";
 import type { BoundaryLocalMeasurementValue } from "../../../../types";
 import { createBoundaryPortalHostName } from "../../../utils/naming";
+import { isTeleportEnabled } from "../../../utils/teleport-control";
+import { resolveActiveBoundaryPortalPairKey } from "../helpers/local-measurement";
 import {
 	mountPortalBoundaryHost,
 	unmountPortalBoundaryHostByName,
@@ -16,17 +18,15 @@ import {
 
 type UseActivePortalBoundaryHostParams = {
 	boundaryId: string;
-	currentScreenKey: string;
 	escapeHostKey?: string;
 	localMeasurement: BoundaryLocalMeasurementValue;
 	portalHostName: SharedValue<string | null>;
-	portalHostReady: SharedValue<boolean>;
+	portalHostReady: SharedValue<string | null>;
 	slotsMap: SharedValue<NormalizedTransitionInterpolatedStyle>;
 };
 
 export const useActivePortalBoundaryHost = ({
 	boundaryId,
-	currentScreenKey,
 	escapeHostKey,
 	localMeasurement,
 	portalHostName,
@@ -44,13 +44,12 @@ export const useActivePortalBoundaryHost = ({
 	useAnimatedReaction(
 		() => {
 			"worklet";
-			const pairKey = getPairKeyForSource(boundaryId, currentScreenKey);
-			const measurement = localMeasurement.get();
-			if (!pairKey || measurement?.pairKey !== pairKey) {
-				return null;
-			}
-
-			return pairKey;
+			return resolveActiveBoundaryPortalPairKey(
+				localMeasurement.get(),
+				slotsMap.get()[boundaryId],
+				boundaryId,
+				pairs.get(),
+			);
 		},
 		(pairKey, previousPairKey) => {
 			"worklet";
@@ -58,6 +57,16 @@ export const useActivePortalBoundaryHost = ({
 				return;
 			}
 
+			const slot = slotsMap.get()[boundaryId];
+			if (
+				pairKey === null &&
+				localMeasurement.get() !== null &&
+				slot &&
+				!isTeleportEnabled(slot.props?.teleport)
+			) {
+				localMeasurement.set(null);
+			}
+
 			runOnJS(updateActivePairKey)(pairKey);
 		},
 	);
@@ -65,7 +74,7 @@ export const useActivePortalBoundaryHost = ({
 	useLayoutEffect(() => {
 		if (!activePairKey || !escapeHostKey) {
 			portalHostName.set(null);
-			portalHostReady.set(false);
+			portalHostReady.set(null);
 			return;
 		}
 
@@ -88,7 +97,7 @@ export const useActivePortalBoundaryHost = ({
 
 		return () => {
 			portalHostName.set(null);
-			portalHostReady.set(false);
+			portalHostReady.set(null);
 			unmountPortalBoundaryHostByName(nextPortalHostName);
 		};
 	}, [