react-native-screen-transitions 3.11.3 → 3.13.0-beta.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";
@@ -24,12 +26,29 @@ interface UseBoundaryContentPortalAttachmentParams {
 export const useBoundaryContentPortalAttachment = ({
 	boundaryId,
 }: UseBoundaryContentPortalAttachmentParams) => {
-	const { nextInterpolatorReady, slotsMap } = useScreenSlots();
+	const { slotsMap } = useScreenSlots();
 
 	const currentScreenKey = useDescriptorsStore(
 		(s) => s.derivations.currentScreenKey,
 	);
+	const nextScreenKey = useDescriptorsStore((s) => s.derivations.nextScreenKey);
 	const sourcePairKey = useDescriptorsStore((s) => s.derivations.sourcePairKey);
+	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;
 
 	const activeReceiverScreenKey = useStack(resolveActiveHandoffReceiver);
 	const previousReceiverScreenKey = useStack(resolvePreviousHandoffReceiver);
@@ -43,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);
@@ -58,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 =
@@ -85,20 +122,33 @@ export const useBoundaryContentPortalAttachment = ({
 				? link.destination.screenKey
 				: null;
 
-		const interpolatorReady = nextInterpolatorReady.get();
+		const isInterpolatorReady = interpolatorReady.get();
 		const attachedScreenKey = attachedReceiverScreenKey.get();
-
-		const nextReceiverScreenKey = resolveHandoffAttachmentCandidate({
-			activeReceiverClosing: !!closing,
-			activeReceiverScreenKey,
-			attachedReceiverScreenKey: attachedScreenKey,
-			hasActiveCloseFinished,
-			interpolatorReady: !!interpolatorReady,
-			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;
@@ -110,13 +160,16 @@ export const useBoundaryContentPortalAttachment = ({
 
 		const activatingPairDestination =
 			!!pairDestination &&
-			!!interpolatorReady &&
+			!!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);
 		};
 	}, [

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

@@ -1,9 +1,12 @@
+import { useIsFocused } from "@react-navigation/native";
 import { useAnimatedProps, useSharedValue } from "react-native-reanimated";
 import { useDescriptorsStore } from "../../../../../../providers/screen/descriptors";
 import { useScreenSlots } from "../../../../../../providers/screen/styles";
+import { pairs } from "../../../../../../stores/bounds/internals/state";
 import { useBoundaryRootStore } from "../../../../providers/boundary-root.provider";
 import { PORTAL_HOST_NAME_RESET_VALUE } from "../../../utils/naming";
-import { isTeleportEnabled } from "../../../utils/teleport-control";
+import { shouldAttachBoundaryPortal } from "../helpers/attachment";
+import { resolveActiveBoundaryPortalPairKey } from "../helpers/local-measurement";
 import { useActiveHostKey } from "../stores/host-registry.store";
 import { useActivePortalBoundaryHost } from "./use-active-portal-boundary-host";
 
@@ -24,14 +27,17 @@ export const useBoundaryPortalAttachment = ({
 	const currentScreenKey = useDescriptorsStore(
 		(s) => s.derivations.currentScreenKey,
 	);
+	// React Navigation resolves focus through the entire parent navigator chain.
+	// A leaf that is still selected in its own one-screen stack becomes unfocused
+	// when any ancestor route is covered.
+	const focused = useIsFocused();
 	const { slotsMap } = useScreenSlots();
 	const portalHostName = useSharedValue<string | null>(null);
-	const portalHostReady = useSharedValue(false);
+	const portalHostReady = useSharedValue<string | null>(null);
 	const escapeHostKey = useActiveHostKey(currentScreenKey);
 
 	useActivePortalBoundaryHost({
 		boundaryId,
-		currentScreenKey,
 		escapeHostKey,
 		localMeasurement,
 		portalHostName,
@@ -49,20 +55,31 @@ export const useBoundaryPortalAttachment = ({
 			...slotProps
 		} = slot?.props ?? {};
 
-		const shouldAttach =
-			slot !== undefined &&
-			isTeleportEnabled(teleport) &&
-			portalHostReady.get();
+		const activePortalHostName = portalHostName.get();
+		const shouldAttach = shouldAttachBoundaryPortal({
+			focused,
+			portalHostReady:
+				activePortalHostName !== null &&
+				portalHostReady.get() === activePortalHostName,
+			slotActive:
+				resolveActiveBoundaryPortalPairKey(
+					localMeasurement.get(),
+					slot,
+					boundaryId,
+					pairs.get(),
+				) !== null && slot !== undefined,
+			teleport,
+		});
 
 		const hostName = shouldAttach
-			? portalHostName.get()
+			? activePortalHostName
 			: PORTAL_HOST_NAME_RESET_VALUE;
 
 		return {
 			...slotProps,
 			hostName,
 		};
-	});
+	}, [focused]);
 
 	return { teleportProps };
 };

package/src/shared/components/boundary/portal/components/boundary-portal/stores/portal-boundary-host.store.ts

@@ -9,7 +9,7 @@ export type ActivePortalBoundaryHost = {
 	localMeasurement: BoundaryLocalMeasurementValue;
 	pairKey: string;
 	portalHostName: string;
-	portalHostReady: SharedValue<boolean>;
+	portalHostReady: SharedValue<string | null>;
 	slotsMap: SharedValue<NormalizedTransitionInterpolatedStyle>;
 };