vinext 1.3.0 → 1.4.0

package/dist/server/app-page-route-wiring.js

@@ -1,21 +1,26 @@
 import { APP_RSC_RENDER_MODE_PREFETCH_EMPTY, APP_RSC_RENDER_MODE_PREFETCH_LOADING_SHELL } from "./app-rsc-render-mode.js";
 import { fnv1a64 } from "../utils/hash.js";
 import { createInlineScriptTag, escapeHtmlAttr } from "./html.js";
-import { createAppRenderDependency, registerAppElementRenderDependencies, renderAfterAppDependencies, renderAppComponentWithDependencyBarrier } from "./app-render-dependency.js";
-import { APP_LAYOUT_IDS_KEY, APP_ROOT_LAYOUT_KEY, APP_STATIC_SIBLINGS_KEY, AppElementsWire, normalizeAppElementsSlotBindings } from "./app-elements-wire.js";
-import { APP_PREFETCH_LOADING_SHELL_MARKER_KEY } from "./app-elements.js";
-import DefaultGlobalError from "../shims/default-global-error.js";
-import { ErrorBoundary, ForbiddenBoundary, GlobalErrorBoundary, NotFoundBoundary, RedirectBoundary, UnauthorizedBoundary } from "../shims/error-boundary.js";
+import { APP_LAYOUT_IDS_KEY, APP_ROOT_LAYOUT_KEY, APP_SKIPPED_LAYOUT_IDS_KEY, APP_STATIC_SIBLINGS_KEY, AppElementsWire, normalizeAppElementsSlotBindings } from "./app-elements-wire.js";
+import { APP_PREFETCH_LOADING_SHELL_MARKER_KEY, APP_STREAMING_METADATA_BODY_ID_PREFIX } from "./app-elements.js";
 import { AppRouterScrollTarget } from "../shims/app-router-scroll.js";
-import DefaultNotFound from "../shims/default-not-found.js";
+import { hashMountedLayoutIdentity } from "./app-mounted-layouts.js";
+import { BfcacheChildrenBoundary, BfcacheSegmentBoundary, Children as Children$1, ParallelSlot, Slot } from "../shims/slot.js";
+import { APP_PAGE_SEGMENT_KEY, isAppPageRouteGroupSegment, resolveAppPageChildSegments, resolveAppPageSegmentStateKey, resolveAppPageTemplateStateKey } from "./app-page-segment-state.js";
+import DefaultGlobalError from "../shims/default-global-error.js";
+import { ErrorBoundary, ForbiddenBoundary, GlobalErrorBoundary, HttpAccessFallbackPassthrough, NotFoundBoundary, RedirectBoundary, UnauthorizedBoundary } from "../shims/error-boundary.js";
 import { LayoutSegmentProvider } from "../shims/layout-segment-context.js";
 import { withUseCacheLayoutMarker } from "../shims/internal/app-page-props-cache-key.js";
 import { MetadataHead, ViewportHead, renderMetadataToHtml } from "../shims/metadata.js";
-import { BfcacheSegmentBoundary, Children as Children$1, ParallelSlot, Slot } from "../shims/slot.js";
+import { APP_PAGE_NOT_FOUND_BOUNDARY_ID, tagAppPageLayoutError, tagAppPageSlotError } from "./app-page-execution.js";
+import { resolveAppPageBranchParams, resolveAppPageSegmentParams } from "./app-page-params.js";
+import DefaultForbidden from "../shims/default-forbidden.js";
+import DefaultNotFound from "../shims/default-not-found.js";
+import DefaultUnauthorized from "../shims/default-unauthorized.js";
 import { StreamedIconsInsertion } from "../shims/streamed-icons.js";
-import { resolveAppPageBranchParams, resolveAppPageSegmentParamScopeKeys, resolveAppPageSegmentParams } from "./app-page-params.js";
+import { createAppRenderDependency, invokeAppComponentMappingErrors, isReactOwnedAppComponent, renderAfterAppDependencies, renderAppComponentWithDependencyBarrier } from "./app-render-dependency.js";
+import { createAppPageLayoutGate, registerAppPageLayoutGate } from "./app-page-layout-gate.js";
 import { probeReactServerSubtree } from "./app-page-probe.js";
-import { APP_PAGE_SEGMENT_KEY, resolveAppPageChildSegments, resolveAppPageSegmentStateKey, resolveAppPageTemplateStateKey } from "./app-page-segment-state.js";
 import { createAppPageSegmentPlan } from "./app-page-segment-plan.js";
 import { resolveAppPageModuleTraceSegment, traceGetLayoutOrPageModule } from "./app-page-tracing.js";
 import { Fragment, Suspense } from "react";
@@ -25,9 +30,37 @@ const APP_PAGE_SLOT_SEGMENT_KEY = "(__SLOT__)";
 const APP_PAGE_LAYOUT_PROBE_CHILD = /* @__PURE__ */ jsx(Fragment, {});
 const DEFAULT_GLOBAL_ERROR_COMPONENT = DefaultGlobalError;
 const DEFAULT_NOT_FOUND_COMPONENT = DefaultNotFound;
+const DEFAULT_FORBIDDEN_COMPONENT = DefaultForbidden;
+const DEFAULT_UNAUTHORIZED_COMPONENT = DefaultUnauthorized;
 function resolveSlotLayoutParams(routeSegments, treePosition, params) {
 	return resolveAppPageBranchParams(routeSegments, treePosition, params);
 }
+/**
+* A parallel slot's layout, whose notFound(), forbidden() and unauthorized()
+* are caught above the layout that renders the slot, as its page's are. Next.js
+* attaches the slot's own boundaries inside that layout, so they never catch it.
+* https://github.com/vercel/next.js/blob/canary/packages/next/src/server/app-render/create-component-tree.tsx
+*/
+function createSlotLayoutElement(LayoutComponent, props, slotLayoutIndex, notFoundBoundary) {
+	if (slotLayoutIndex === void 0 || isReactOwnedAppComponent(LayoutComponent)) return /* @__PURE__ */ jsx(LayoutComponent, { ...props });
+	const SlotLayoutInvoker = () => invokeAppComponentMappingErrors(LayoutComponent, props, (error) => tagAppPageSlotError(error, slotLayoutIndex, notFoundBoundary));
+	return /* @__PURE__ */ jsx(SlotLayoutInvoker, {});
+}
+/**
+* A route layout, whose notFound(), forbidden() and unauthorized() are caught
+* above it: its own boundaries wrap only its `children`. The layout's index
+* tags what it throws, so the response's fallback finds that boundary from the
+* render. `onSettled` hears how the layout rendered.
+* https://github.com/vercel/next.js/blob/canary/packages/next/src/server/app-render/create-component-tree.tsx
+*/
+function createRouteLayoutElement(LayoutComponent, props, layoutIndex, dependency, onSettled) {
+	const mapError = (error) => tagAppPageLayoutError(error, layoutIndex);
+	if (dependency) return renderAppComponentWithDependencyBarrier(LayoutComponent, props, dependency, mapError, onSettled);
+	if (isReactOwnedAppComponent(LayoutComponent)) return /* @__PURE__ */ jsx(LayoutComponent, { ...props });
+	const RouteLayoutInvoker = () => invokeAppComponentMappingErrors(LayoutComponent, props, mapError, onSettled);
+	RouteLayoutInvoker.displayName = LayoutComponent.displayName ?? LayoutComponent.name;
+	return /* @__PURE__ */ jsx(RouteLayoutInvoker, {});
+}
 function getDefaultExport(module) {
 	return module?.default ?? null;
 }
@@ -39,37 +72,19 @@ function createAppPageTreePath(routeSegments, treePosition) {
 	if (treePathSegments.length === 0) return "/";
 	return `/${treePathSegments.join("/")}`;
 }
-function readFiniteRevalidateSeconds(module) {
-	const revalidate = module?.revalidate;
-	return typeof revalidate === "number" && Number.isFinite(revalidate) && revalidate > 0 ? revalidate : null;
-}
-function recordLayoutSkipObservationScope(options) {
-	options.layoutParamAccess?.recordLayoutParamScope(options.layoutId, resolveAppPageSegmentParamScopeKeys(options.routeSegments, options.treePosition));
-	const revalidateSeconds = readFiniteRevalidateSeconds(options.layoutModule);
-	if (revalidateSeconds !== null) options.layoutParamAccess?.recordLayoutFiniteRevalidate(options.layoutId, revalidateSeconds);
-}
-function probeAppPageLayoutWithTracking(options) {
+/**
+* Renders the layout at `layoutIndex` with a placeholder for its children, so
+* whatever it or a component it renders throws comes out.
+*/
+function probeAppPageLayout(options) {
 	const treePosition = options.route.layoutTreePositions?.[options.layoutIndex] ?? 0;
-	const treePath = createAppPageTreePath(options.route.routeSegments, treePosition);
-	const layoutId = AppElementsWire.encodeLayoutId(treePath);
-	const probe = () => {
-		const layoutModule = options.route.layouts[options.layoutIndex];
-		const LayoutComponent = getDefaultExport(layoutModule);
-		if (!LayoutComponent) return null;
-		recordLayoutSkipObservationScope({
-			layoutId,
-			layoutModule,
-			layoutParamAccess: options.layoutParamAccess,
-			routeSegments: options.route.routeSegments,
-			treePosition
-		});
-		const layoutParams = resolveAppPageSegmentParams(options.route.routeSegments, treePosition, options.matchedParams);
-		return probeReactServerSubtree(/* @__PURE__ */ jsx(LayoutComponent, {
-			...withUseCacheLayoutMarker(LayoutComponent, { params: options.makeThenableParams(layoutParams, options.layoutParamAccess?.createThenableParamsObserver(layoutId)) }),
-			children: APP_PAGE_LAYOUT_PROBE_CHILD
-		}));
-	};
-	return options.layoutParamAccess ? options.layoutParamAccess.runLayoutProbe(layoutId, probe) : probe();
+	const LayoutComponent = getDefaultExport(options.route.layouts[options.layoutIndex]);
+	if (!LayoutComponent) return null;
+	const layoutParams = resolveAppPageSegmentParams(options.route.routeSegments, treePosition, options.matchedParams);
+	return probeReactServerSubtree(/* @__PURE__ */ jsx(LayoutComponent, {
+		...withUseCacheLayoutMarker(LayoutComponent, { params: options.makeThenableParams(layoutParams) }),
+		children: APP_PAGE_LAYOUT_PROBE_CHILD
+	}));
 }
 function createAppPageLayoutEntries(route) {
 	return route.layouts.map((layoutModule, index) => {
@@ -266,7 +281,7 @@ async function AppPageHead(props) {
 		metadata,
 		pathname: props.pathname,
 		trailingSlash: props.trailingSlash
-	}) : null, /* @__PURE__ */ jsx(ViewportHead, { viewport })] });
+	}) : null, viewport ? /* @__PURE__ */ jsx(ViewportHead, { viewport }) : null] });
 }
 AppPageHead.displayName = "Vinext.Head";
 function hasStreamedIcons(metadata) {
@@ -360,10 +375,58 @@ function buildAppPageElements(options) {
 	for (const templateEntry of templateEntries) templateEntriesByTreePosition.set(templateEntry.treePosition, templateEntry);
 	for (const loadingEntry of loadingEntries) loadingEntriesByTreePosition.set(loadingEntry.treePosition, loadingEntry);
 	for (const errorEntry of errorEntries) errorEntriesByTreePosition.set(errorEntry.treePosition, errorEntry);
+	const isOutermostEntryBelowLoading = (loadingTreePosition, treePosition, kind) => {
+		const enclosesEntry = (entryTreePosition, sameSegmentEncloses) => entryTreePosition > loadingTreePosition && (entryTreePosition < treePosition || sameSegmentEncloses && entryTreePosition === treePosition);
+		return !layoutEntries.some((entry) => getDefaultExport(entry.layoutModule) && enclosesEntry(entry.treePosition, kind !== "layout")) && !templateEntries.some((entry) => getDefaultExport(entry.templateModule) && enclosesEntry(entry.treePosition, kind === "page"));
+	};
 	const layoutIndicesByTreePosition = /* @__PURE__ */ new Map();
 	for (let index = 0; index < layoutEntries.length; index++) layoutIndicesByTreePosition.set(layoutEntries[index].treePosition, index);
+	const resolveAccessBoundaries = (segmentModules, segmentTreePositions, getLayoutModule, builtInComponent) => {
+		const files = /* @__PURE__ */ new Map();
+		if (segmentTreePositions) for (const [index, treePosition] of segmentTreePositions.entries()) {
+			const module = segmentModules?.[index];
+			if (module && getDefaultExport(module)) files.set(treePosition, module);
+		}
+		else for (const entry of layoutEntries) {
+			const module = getLayoutModule(entry);
+			if (module && getDefaultExport(module)) files.set(entry.treePosition, module);
+		}
+		const boundaries = /* @__PURE__ */ new Map();
+		for (const [treePosition, module] of files) {
+			const component = getDefaultExport(module);
+			if (component) boundaries.set(treePosition, {
+				component,
+				module
+			});
+		}
+		const rootTreePosition = layoutEntriesByTreePosition.has(0) ? 0 : layoutEntries[0]?.treePosition ?? null;
+		let rootModuleTreePosition = files.has(0) ? 0 : null;
+		for (const treePosition of files.keys()) if (rootTreePosition !== null && treePosition <= rootTreePosition && (rootModuleTreePosition === null || treePosition > rootModuleTreePosition)) rootModuleTreePosition = treePosition;
+		const rootModule = rootModuleTreePosition === null ? void 0 : files.get(rootModuleTreePosition);
+		const rootComponent = getDefaultExport(rootModule) ?? builtInComponent;
+		if (rootComponent) {
+			const rootBoundary = {
+				component: rootComponent,
+				module: rootModule ?? null
+			};
+			if (rootTreePosition !== null && !files.has(rootTreePosition)) boundaries.set(rootTreePosition, rootBoundary);
+			const firstSegment = routeSegments[0];
+			if (firstSegment !== void 0 && isAppPageRouteGroupSegment(firstSegment) && !files.has(1)) boundaries.set(1, rootBoundary);
+		}
+		for (const treePosition of boundaries.keys()) {
+			const hasLayout = layoutEntriesByTreePosition.has(treePosition);
+			if (rootTreePosition !== null && treePosition < rootTreePosition || !hasLayout && (treePosition === 0 || treePosition >= routeSegments.length)) boundaries.delete(treePosition);
+		}
+		return boundaries;
+	};
+	const rootNotFoundModule = options.route.segmentNotFoundTreePositions ? null : options.rootNotFoundModule;
+	const rootForbiddenModule = options.route.segmentForbiddenTreePositions ? null : options.rootForbiddenModule;
+	const rootUnauthorizedModule = options.route.segmentUnauthorizedTreePositions ? null : options.rootUnauthorizedModule;
+	const notFoundBoundaries = resolveAccessBoundaries(options.route.segmentNotFounds, options.route.segmentNotFoundTreePositions, (entry) => entry.notFoundModule, rootNotFoundModule ? null : DEFAULT_NOT_FOUND_COMPONENT);
+	const forbiddenBoundaries = resolveAccessBoundaries(options.route.segmentForbiddens, options.route.segmentForbiddenTreePositions, (entry) => entry.forbiddenModule, rootForbiddenModule ? null : DEFAULT_FORBIDDEN_COMPONENT);
+	const unauthorizedBoundaries = resolveAccessBoundaries(options.route.segmentUnauthorizeds, options.route.segmentUnauthorizedTreePositions, (entry) => entry.unauthorizedModule, rootUnauthorizedModule ? null : DEFAULT_UNAUTHORIZED_COMPONENT);
+	const layoutGate = createAppPageLayoutGate();
 	const layoutDependenciesByIndex = /* @__PURE__ */ new Map();
-	const renderDependenciesByElementId = /* @__PURE__ */ new Map();
 	const layoutDependenciesBefore = [];
 	const slotDependenciesByLayoutIndex = [];
 	const templateDependenciesById = /* @__PURE__ */ new Map();
@@ -379,7 +442,10 @@ function buildAppPageElements(options) {
 		...layoutEntries.map((entry) => entry.treePosition),
 		...templateEntries.map((entry) => entry.treePosition),
 		...loadingEntries.map((entry) => entry.treePosition),
-		...errorEntries.map((entry) => entry.treePosition)
+		...errorEntries.map((entry) => entry.treePosition),
+		...notFoundBoundaries.keys(),
+		...forbiddenBoundaries.keys(),
+		...unauthorizedBoundaries.keys()
 	])).sort((left, right) => left - right);
 	const resolveSlotOverride = (slotKey, slotName) => {
 		const overrideByKey = options.slotOverrides?.[slotKey];
@@ -398,7 +464,7 @@ function buildAppPageElements(options) {
 	}) : [];
 	const prefetchLoadingComponent = getDefaultExport(prefetchLoadingEntry?.loadingModule);
 	const shouldRenderPrefetchLoadingShell = isPrefetchLoadingShell && (prefetchLoadingComponent !== null || prefetchSlotLoadingEntries.length > 0);
-	const streamingMetadataBodyId = options.resolveHead && metadataPlacement === "body" && (!isPrefetchLoadingShell || shouldRenderPrefetchLoadingShell) ? `__vinext_streaming_metadata_body:${routeId}` : null;
+	const streamingMetadataBodyId = options.resolveHead && metadataPlacement === "body" && (!isPrefetchLoadingShell || shouldRenderPrefetchLoadingShell) ? `${APP_STREAMING_METADATA_BODY_ID_PREFIX}${routeId}` : null;
 	const prefetchCutoffTreePosition = isPrefetchLoadingShell ? prefetchLoadingEntry?.treePosition ?? prefetchSlotLoadingEntries.reduce((deepest, entry) => Math.max(deepest, entry.ownerTreePosition), 0) : null;
 	const includesPrefetchTreePosition = (treePosition) => prefetchCutoffTreePosition === null || treePosition <= prefetchCutoffTreePosition;
 	const segmentPlan = createAppPageSegmentPlan({
@@ -421,6 +487,13 @@ function buildAppPageElements(options) {
 		templateEntries
 	});
 	const routeResetKey = segmentPlan.routeResetKey;
+	const skippedLayoutIds = /* @__PURE__ */ new Set();
+	if (options.mountedLayouts && options.isRscRequest === true && options.isUncacheableRender === true && renderMode === "navigation" && interception === null) for (const layoutEntry of layoutEntries) {
+		const identity = segmentPlan.bfcacheSegmentIdentities[layoutEntry.id];
+		if (identity === void 0) break;
+		if (!options.mountedLayouts.has(hashMountedLayoutIdentity(identity))) break;
+		skippedLayoutIds.add(layoutEntry.id);
+	}
 	const slotPlansByKey = new Map(segmentPlan.slots.map((slot) => [slot.key, slot]));
 	const resolveRouteSegmentResetKey = (treePosition) => resolveAppPageSegmentStateKey(routeSegments, treePosition, options.matchedParams);
 	const metadataEntries = AppElementsWire.createMetadataEntries({
@@ -440,6 +513,12 @@ function buildAppPageElements(options) {
 		[pageElementId]: null,
 		[routeId]: null
 	};
+	if (isPrefetchLoadingShell && !shouldRenderPrefetchLoadingShell && options.isUncacheableRender === true) return {
+		...metadataEntries,
+		...options.route.staticSiblings && options.route.staticSiblings.length > 0 ? { [APP_STATIC_SIBLINGS_KEY]: options.route.staticSiblings } : {},
+		[pageElementId]: null,
+		[routeId]: null
+	};
 	const elements = {};
 	for (const slotPlan of segmentPlan.slots) for (const segment of slotPlan.nestedBfcacheSegments) elements[segment.id] = null;
 	if (options.route.staticSiblings && options.route.staticSiblings.length > 0) elements[APP_STATIC_SIBLINGS_KEY] = options.route.staticSiblings;
@@ -457,10 +536,9 @@ function buildAppPageElements(options) {
 		if (layoutIndex !== void 0) {
 			const layoutEntry = layoutEntries[layoutIndex];
 			layoutDependenciesBefore[layoutIndex] = [...pageDependencies];
-			if (getDefaultExport(layoutEntry.layoutModule)) {
+			if (!skippedLayoutIds.has(layoutEntry.id) && getDefaultExport(layoutEntry.layoutModule)) {
 				const layoutDependency = createAppRenderDependency();
 				layoutDependenciesByIndex.set(layoutIndex, layoutDependency);
-				renderDependenciesByElementId.set(layoutEntry.id, layoutDependency);
 				pageDependencies.push(layoutDependency);
 			}
 			slotDependenciesByLayoutIndex[layoutIndex] = [...pageDependencies];
@@ -476,11 +554,15 @@ function buildAppPageElements(options) {
 	const routeLoadingComponent = getDefaultExport(options.route.loading);
 	if (shouldRenderPrefetchLoadingShell) elements[APP_PREFETCH_LOADING_SHELL_MARKER_KEY] = "LoadingBoundary";
 	const pageLoadingModule = resolveAppPageLoadingModuleAtOrAbove(options.route, routeSegments.length);
-	const PageLoadingComponent = pageRenderDependency ? getDefaultExport(pageLoadingModule) : null;
+	const pageLoadingEntry = loadingEntries.find((entry) => entry.loadingModule === pageLoadingModule);
+	const PageLoadingComponent = pageRenderDependency && (!pageLoadingEntry || isOutermostEntryBelowLoading(pageLoadingEntry.treePosition, routeSegments.length, "page")) ? getDefaultExport(pageLoadingModule) : null;
+	const streamingMetadataOutlet = createAppPageStreamingMetadataOutlet(streamingMetadataOutletId, options.streamingMetadataOutletSuspended);
+	const renderElementWithMetadataOutlet = options.renderElementWithMetadataOutlet;
+	const pageContent = renderElementWithMetadataOutlet ? renderElementWithMetadataOutlet(streamingMetadataOutlet) : options.element;
 	const pageElement = PageLoadingComponent ? /* @__PURE__ */ jsx(Suspense, {
 		fallback: /* @__PURE__ */ jsx(PageLoadingComponent, {}),
-		children: options.element
-	}, routeResetKey) : options.element;
+		children: pageContent
+	}, routeResetKey) : pageContent;
 	elements[pageElementId] = isPrefetchLoadingShell ? null : pageRenderDependency ? pageElement : renderAfterAppDependencies(pageElement, pageDependencies);
 	for (const templateEntry of templateEntries) {
 		if (isPrefetchLoadingShell && !includesPrefetchTreePosition(templateEntry.treePosition)) continue;
@@ -491,7 +573,7 @@ function buildAppPageElements(options) {
 		let templateElement = templateDependency ? renderAppComponentWithDependencyBarrier(TemplateComponent, { children: /* @__PURE__ */ jsx(Children$1, {}) }, templateDependency) : /* @__PURE__ */ jsx(TemplateComponent, { children: /* @__PURE__ */ jsx(Children$1, {}) });
 		const ancestorLoadingEntry = findNearestAncestorLoadingEntry(templateEntry.treePosition);
 		const ancestorLoadingComponent = getDefaultExport(ancestorLoadingEntry?.loadingModule);
-		if (ancestorLoadingComponent && ancestorLoadingEntry) {
+		if (ancestorLoadingComponent && ancestorLoadingEntry && isOutermostEntryBelowLoading(ancestorLoadingEntry.treePosition, templateEntry.treePosition, "template")) {
 			const AncestorLoadingComponent = ancestorLoadingComponent;
 			const loadingResetKey = resolveRouteSegmentResetKey(ancestorLoadingEntry.treePosition);
 			templateElement = /* @__PURE__ */ jsx(Suspense, {
@@ -504,35 +586,31 @@ function buildAppPageElements(options) {
 	for (let index = 0; index < layoutEntries.length; index++) {
 		const layoutEntry = layoutEntries[index];
 		if (isPrefetchLoadingShell && !includesPrefetchTreePosition(layoutEntry.treePosition)) continue;
+		if (skippedLayoutIds.has(layoutEntry.id)) continue;
 		if (!layoutEntry.layoutModule) continue;
 		const layoutComponent = traceGetLayoutOrPageModule(resolveAppPageModuleTraceSegment(routeSegments, layoutEntry.treePosition), () => getDefaultExport(layoutEntry.layoutModule));
 		if (!layoutComponent) continue;
 		const layoutParams = resolveAppPageSegmentParams(options.route.routeSegments, layoutEntry.treePosition, options.matchedParams);
-		recordLayoutSkipObservationScope({
-			layoutId: layoutEntry.id,
-			layoutModule: layoutEntry.layoutModule,
-			layoutParamAccess: options.layoutParamAccess,
-			routeSegments: options.route.routeSegments,
-			treePosition: layoutEntry.treePosition
-		});
-		const layoutProps = { params: options.makeThenableParams(layoutParams, options.layoutParamAccess?.createThenableParamsObserver(layoutEntry.id)) };
+		const layoutProps = { params: options.makeThenableParams(layoutParams) };
 		for (const slot of Object.values(options.route.slots ?? {})) {
 			const slotName = slot.name;
 			if ((slot.layoutIndex >= 0 ? slot.layoutIndex : layoutEntries.length - 1) !== index) continue;
 			layoutProps[slotName] = /* @__PURE__ */ jsx(ParallelSlot, { name: slotName });
 		}
 		const LayoutComponent = layoutComponent;
-		const layoutDependency = layoutDependenciesByIndex.get(index);
-		let layoutElement = layoutDependency ? renderAppComponentWithDependencyBarrier(LayoutComponent, withUseCacheLayoutMarker(LayoutComponent, {
+		const ancestorLoadingEntry = findNearestAncestorLoadingEntry(layoutEntry.treePosition);
+		const holdsResponse = !ancestorLoadingEntry && !isReactOwnedAppComponent(LayoutComponent);
+		if (holdsResponse) layoutGate.hold(layoutEntry.id, index);
+		let layoutElement = createRouteLayoutElement(LayoutComponent, withUseCacheLayoutMarker(LayoutComponent, {
 			...layoutProps,
 			children: /* @__PURE__ */ jsx(Children$1, {})
-		}), layoutDependency) : /* @__PURE__ */ jsx(LayoutComponent, {
-			...withUseCacheLayoutMarker(LayoutComponent, layoutProps),
-			children: /* @__PURE__ */ jsx(Children$1, {})
+		}), index, layoutDependenciesByIndex.get(index), holdsResponse ? (failure) => layoutGate.settle(layoutEntry.id, failure) : void 0);
+		layoutElement = /* @__PURE__ */ jsx(RedirectBoundary, {
+			resetKey: resolveRouteSegmentResetKey(layoutEntry.treePosition),
+			children: layoutElement
 		});
-		const ancestorLoadingEntry = findNearestAncestorLoadingEntry(layoutEntry.treePosition);
 		const ancestorLoadingComponent = getDefaultExport(ancestorLoadingEntry?.loadingModule);
-		if (ancestorLoadingComponent && ancestorLoadingEntry) {
+		if (ancestorLoadingComponent && ancestorLoadingEntry && isOutermostEntryBelowLoading(ancestorLoadingEntry.treePosition, layoutEntry.treePosition, "layout")) {
 			const AncestorLoadingComponent = ancestorLoadingComponent;
 			const loadingResetKey = resolveRouteSegmentResetKey(ancestorLoadingEntry.treePosition);
 			layoutElement = /* @__PURE__ */ jsx(Suspense, {
@@ -561,6 +639,45 @@ function buildAppPageElements(options) {
 			elements[slotId] = AppElementsWire.unmatchedSlotValue;
 			continue;
 		}
+		const branchNotFounds = /* @__PURE__ */ new Map();
+		const slotNotFoundModules = !overrideOrPageComponent ? void 0 : hasSlotTreeOverride ? slotOverride?.notFoundModules : slot.notFounds;
+		const slotNotFoundTreePositions = hasSlotTreeOverride ? slotOverride?.notFoundTreePositions : slot.notFoundTreePositions;
+		for (const [index, notFoundModule] of (slotNotFoundModules ?? []).entries()) {
+			const component = getDefaultExport(notFoundModule);
+			const treePosition = slotNotFoundTreePositions?.[index];
+			if (component && treePosition !== void 0) branchNotFounds.set(treePosition, component);
+		}
+		const branchAccessBoundaries = /* @__PURE__ */ new Map();
+		if (overrideOrPageComponent && hasSlotTreeOverride) for (const [modules, treePositions, Boundary] of [[
+			slotOverride?.forbiddenModules,
+			slotOverride?.forbiddenTreePositions,
+			ForbiddenBoundary
+		], [
+			slotOverride?.unauthorizedModules,
+			slotOverride?.unauthorizedTreePositions,
+			UnauthorizedBoundary
+		]]) for (const [index, module] of (modules ?? []).entries()) {
+			const component = getDefaultExport(module);
+			const treePosition = treePositions?.[index];
+			if (!component || treePosition === void 0) continue;
+			const entries = branchAccessBoundaries.get(treePosition) ?? [];
+			entries.push({
+				component,
+				Boundary
+			});
+			branchAccessBoundaries.set(treePosition, entries);
+		}
+		const branchErrors = /* @__PURE__ */ new Map();
+		if (overrideOrPageComponent && hasSlotTreeOverride) for (const [index, errorModule] of (slotOverride?.errorModules ?? []).entries()) {
+			const component = getErrorBoundaryExport(errorModule);
+			const treePosition = slotOverride?.errorTreePositions?.[index];
+			if (component && treePosition !== void 0) branchErrors.set(treePosition, component);
+		}
+		const resolveSlotNotFoundBoundary = (treePosition) => {
+			let caughtAt;
+			for (const position of branchNotFounds.keys()) if (position < treePosition && (caughtAt === void 0 || position > caughtAt)) caughtAt = position;
+			return caughtAt === void 0 ? void 0 : `${slotId}:${caughtAt}`;
+		};
 		let slotElement;
 		if (prefetchSlotLoadingEntry) {
 			const PrefetchSlotLoadingComponent = getDefaultExport(prefetchSlotLoadingEntry.loadingModule);
@@ -569,10 +686,10 @@ function buildAppPageElements(options) {
 			const slotProps = { params: options.makeThenableParams(slotParams) };
 			if (options.searchParams !== void 0) slotProps.searchParams = options.searchParams;
 			if (slotOverride?.props) Object.assign(slotProps, slotOverride.props);
-			slotElement = options.createPageElement ? options.createPageElement(slotComponent, slotProps) : (() => {
+			slotElement = options.createPageElement ? options.createPageElement(slotComponent, slotProps, targetIndex >= 0 ? targetIndex : void 0, resolveSlotNotFoundBoundary(Number.POSITIVE_INFINITY)) : (() => {
 				return /* @__PURE__ */ jsx(slotComponent, { ...slotProps });
 			})();
-			if (overrideOrPageComponent) slotElement = /* @__PURE__ */ jsx(Fragment, { children: slotElement }, slotResetKey);
+			if (overrideOrPageComponent) slotElement = /* @__PURE__ */ jsxs(Fragment, { children: [slotElement, slotOverride?.metadataOutlet] }, slotResetKey);
 			slotElement = /* @__PURE__ */ jsx(RedirectBoundary, {
 				resetKey: slotResetKey,
 				children: slotElement
@@ -628,6 +745,9 @@ function buildAppPageElements(options) {
 			...branchLayouts.keys(),
 			...branchLoadings.keys(),
 			...slotErrorComponent ? [0] : [],
+			...branchNotFounds.keys(),
+			...branchAccessBoundaries.keys(),
+			...branchErrors.keys(),
 			...nestedBfcacheSegments.flatMap((segment) => segment.treePosition === null ? [] : [segment.treePosition])
 		])).filter((treePosition) => !prefetchSlotLoadingEntry || !isOwnedAtRoutePrefetchCutoff && treePosition <= prefetchSlotLoadingEntry.treePosition).sort((left, right) => left - right);
 		for (let index = branchTreePositions.length - 1; index >= 0; index--) {
@@ -647,19 +767,31 @@ function buildAppPageElements(options) {
 					children: slotElement
 				}, loadingResetKey || slotResetKey);
 			}
-			if (treePosition === 0 && slotErrorComponent) slotElement = /* @__PURE__ */ jsx(ErrorBoundary, {
-				resetKey: slotResetKey,
-				fallback: slotErrorComponent,
+			const SlotNotFoundComponent = branchNotFounds.get(treePosition);
+			if (SlotNotFoundComponent) slotElement = /* @__PURE__ */ jsx(NotFoundBoundary, {
+				resetKey: resolveAppPageTemplateStateKey(branchSegments, treePosition, slotParams),
+				fallback: /* @__PURE__ */ jsx(SlotNotFoundComponent, {}),
+				caughtId: `${slotId}:${treePosition}`,
+				children: slotElement
+			});
+			for (const { component: AccessComponent, Boundary } of branchAccessBoundaries.get(treePosition) ?? []) slotElement = /* @__PURE__ */ jsx(Boundary, {
+				resetKey: resolveAppPageTemplateStateKey(branchSegments, treePosition, slotParams),
+				fallback: /* @__PURE__ */ jsx(AccessComponent, {}),
+				children: slotElement
+			});
+			const SegmentErrorComponent = branchErrors.get(treePosition) ?? (treePosition === 0 ? slotErrorComponent : null);
+			if (SegmentErrorComponent) slotElement = /* @__PURE__ */ jsx(ErrorBoundary, {
+				resetKey: treePosition === 0 ? slotResetKey : resolveAppPageSegmentStateKey(branchSegments, treePosition, slotParams) || slotResetKey,
+				fallback: SegmentErrorComponent,
 				children: slotElement
 			});
 			const layoutEntriesAtPosition = branchLayouts.get(treePosition) ?? [];
 			for (let layoutIndex = layoutEntriesAtPosition.length - 1; layoutIndex >= 0; layoutIndex--) {
 				const layoutEntry = layoutEntriesAtPosition[layoutIndex];
-				const LayoutComponent = layoutEntry.component;
-				slotElement = /* @__PURE__ */ jsx(LayoutComponent, {
-					...withUseCacheLayoutMarker(LayoutComponent, { params: options.makeThenableParams(layoutEntry.params) }),
+				slotElement = createSlotLayoutElement(layoutEntry.component, withUseCacheLayoutMarker(layoutEntry.component, {
+					params: options.makeThenableParams(layoutEntry.params),
 					children: slotElement
-				});
+				}), targetIndex >= 0 ? targetIndex : void 0, prefetchSlotLoadingEntry ? void 0 : resolveSlotNotFoundBoundary(treePosition));
 			}
 		}
 		const unalignedBfcacheSegment = nestedBfcacheSegments.find((segment) => segment.treePosition === null);
@@ -670,7 +802,8 @@ function buildAppPageElements(options) {
 		});
 		const ownerLoadingEntry = isPrefetchLoadingShell ? void 0 : findNearestLoadingEntryAtOrAbove(ownerTreePosition);
 		const ownerLoadingComponent = getDefaultExport(ownerLoadingEntry?.loadingModule);
-		if (ownerLoadingComponent && ownerLoadingEntry) {
+		const slotLayoutTreePosition = layoutEntries[targetIndex]?.treePosition;
+		if (ownerLoadingComponent && ownerLoadingEntry && (slotLayoutTreePosition === void 0 || isOutermostEntryBelowLoading(ownerLoadingEntry.treePosition, slotLayoutTreePosition, "slot"))) {
 			const OwnerLoadingComponent = ownerLoadingComponent;
 			const ownerResetKey = resolveRouteSegmentResetKey(ownerLoadingEntry.treePosition);
 			slotElement = /* @__PURE__ */ jsx(Suspense, {
@@ -684,7 +817,7 @@ function buildAppPageElements(options) {
 		providerId: pageElementId,
 		segmentMap: { children: [APP_PAGE_SEGMENT_KEY] },
 		children: /* @__PURE__ */ jsx(Slot, { id: pageElementId })
-	}), createAppPageStreamingMetadataOutlet(streamingMetadataOutletId, options.streamingMetadataOutletSuspended)] });
+	}), renderElementWithMetadataOutlet ? null : streamingMetadataOutlet] });
 	if (isPrefetchLoadingShell) {
 		if (prefetchLoadingComponent === null) routeChildren = null;
 		else routeChildren = /* @__PURE__ */ jsx(prefetchLoadingComponent, {});
@@ -700,24 +833,41 @@ function buildAppPageElements(options) {
 		routeChildren = /* @__PURE__ */ jsx(AppRouterScrollTarget, { children: routeChildren });
 	}
 	const lastLayoutErrorModule = errorEntries.length > 0 ? errorEntries[errorEntries.length - 1].errorModule : null;
-	const configuredNotFoundComponent = getDefaultExport(options.route.notFound) ?? getDefaultExport(options.rootNotFoundModule);
-	const defaultNotFoundOwnerLayoutId = configuredNotFoundComponent === null ? layoutEntries[0]?.id ?? null : null;
-	const notFoundComponent = configuredNotFoundComponent ?? (defaultNotFoundOwnerLayoutId === null ? DEFAULT_NOT_FOUND_COMPONENT : null);
+	const resolveAccessBoundaryOwner = (boundaries, pageModule) => {
+		let deepest = null;
+		for (const treePosition of boundaries.keys()) if (treePosition < routeSegments.length && (deepest === null || treePosition > deepest)) deepest = treePosition;
+		return deepest !== null && boundaries.get(deepest)?.module === pageModule ? deepest : null;
+	};
+	const resolvePageAccessModule = (routeModule, rootModule) => (getDefaultExport(routeModule) ? routeModule : null) ?? (getDefaultExport(rootModule) ? rootModule : null) ?? null;
+	const notFoundPageModule = resolvePageAccessModule(options.route.notFound, rootNotFoundModule);
+	const forbiddenPageModule = resolvePageAccessModule(options.route.forbidden, rootForbiddenModule);
+	const unauthorizedPageModule = resolvePageAccessModule(options.route.unauthorized, rootUnauthorizedModule);
+	const notFoundOwnerTreePosition = resolveAccessBoundaryOwner(notFoundBoundaries, notFoundPageModule);
+	const forbiddenOwnerTreePosition = resolveAccessBoundaryOwner(forbiddenBoundaries, forbiddenPageModule);
+	const unauthorizedOwnerTreePosition = resolveAccessBoundaryOwner(unauthorizedBoundaries, unauthorizedPageModule);
+	const notFoundComponent = getDefaultExport(notFoundPageModule) ?? (layoutEntries.length === 0 ? DEFAULT_NOT_FOUND_COMPONENT : null);
+	const identifiesPageNotFoundCatcher = !renderElementWithMetadataOutlet;
+	const isPageNotFoundCaughtAtPage = identifiesPageNotFoundCatcher && notFoundComponent !== null && notFoundOwnerTreePosition === null;
+	let pageNotFoundCatcherTreePosition = null;
+	if (identifiesPageNotFoundCatcher && !isPageNotFoundCaughtAtPage) {
+		for (const treePosition of notFoundBoundaries.keys()) if (pageNotFoundCatcherTreePosition === null || treePosition > pageNotFoundCatcherTreePosition) pageNotFoundCatcherTreePosition = treePosition;
+	}
 	if (notFoundComponent) routeChildren = /* @__PURE__ */ jsx(NotFoundBoundary, {
 		resetKey: routeResetKey,
-		fallback: /* @__PURE__ */ jsx(notFoundComponent, {}),
+		caughtId: isPageNotFoundCaughtAtPage ? APP_PAGE_NOT_FOUND_BOUNDARY_ID : void 0,
+		fallback: notFoundOwnerTreePosition === null ? /* @__PURE__ */ jsx(notFoundComponent, {}) : /* @__PURE__ */ jsx(HttpAccessFallbackPassthrough, { status: 404 }),
 		children: routeChildren
 	});
-	const forbiddenComponent = getDefaultExport(options.route.forbidden) ?? getDefaultExport(options.rootForbiddenModule);
+	const forbiddenComponent = getDefaultExport(forbiddenPageModule);
 	if (forbiddenComponent) routeChildren = /* @__PURE__ */ jsx(ForbiddenBoundary, {
 		resetKey: routeResetKey,
-		fallback: /* @__PURE__ */ jsx(forbiddenComponent, {}),
+		fallback: forbiddenOwnerTreePosition === null ? /* @__PURE__ */ jsx(forbiddenComponent, {}) : /* @__PURE__ */ jsx(HttpAccessFallbackPassthrough, { status: 403 }),
 		children: routeChildren
 	});
-	const unauthorizedComponent = getDefaultExport(options.route.unauthorized) ?? getDefaultExport(options.rootUnauthorizedModule);
+	const unauthorizedComponent = getDefaultExport(unauthorizedPageModule);
 	if (unauthorizedComponent) routeChildren = /* @__PURE__ */ jsx(UnauthorizedBoundary, {
 		resetKey: routeResetKey,
-		fallback: /* @__PURE__ */ jsx(unauthorizedComponent, {}),
+		fallback: unauthorizedOwnerTreePosition === null ? /* @__PURE__ */ jsx(unauthorizedComponent, {}) : /* @__PURE__ */ jsx(HttpAccessFallbackPassthrough, { status: 401 }),
 		children: routeChildren
 	});
 	const pageErrorComponent = getErrorBoundaryExport(options.route.error);
@@ -727,6 +877,7 @@ function buildAppPageElements(options) {
 		children: routeChildren
 	});
 	const renderedTreePositions = isPrefetchLoadingShell ? orderedTreePositions.filter(includesPrefetchTreePosition) : orderedTreePositions;
+	let childSegmentElementId = pageElementId;
 	for (let index = renderedTreePositions.length - 1; index >= 0; index--) {
 		const treePosition = renderedTreePositions[index];
 		const segmentResetKey = resolveRouteSegmentResetKey(treePosition);
@@ -742,23 +893,24 @@ function buildAppPageElements(options) {
 				children: segmentChildren
 			}, segmentResetKey || routeResetKey);
 		}
-		if (layoutEntry) {
-			const layoutNotFoundComponent = getDefaultExport(layoutEntry.notFoundModule) ?? (layoutEntry.id === defaultNotFoundOwnerLayoutId ? DEFAULT_NOT_FOUND_COMPONENT : null);
-			if (layoutNotFoundComponent) segmentChildren = /* @__PURE__ */ jsx(NotFoundBoundary, {
-				resetKey: segmentResetKey,
-				fallback: /* @__PURE__ */ jsx(layoutNotFoundComponent, {}),
-				children: segmentChildren
-			});
-			const layoutForbiddenComponent = getDefaultExport(layoutEntry.forbiddenModule);
-			if (layoutForbiddenComponent) segmentChildren = /* @__PURE__ */ jsx(ForbiddenBoundary, {
-				resetKey: segmentResetKey,
-				fallback: /* @__PURE__ */ jsx(layoutForbiddenComponent, {}),
+		const accessBoundaries = [
+			[notFoundBoundaries, NotFoundBoundary],
+			[forbiddenBoundaries, ForbiddenBoundary],
+			[unauthorizedBoundaries, UnauthorizedBoundary]
+		];
+		const accessResetKey = resolveAppPageTemplateStateKey(routeSegments, treePosition, options.matchedParams);
+		for (const [boundaries, AccessBoundary] of accessBoundaries) {
+			const boundary = boundaries.get(treePosition);
+			if (!boundary) continue;
+			const BoundaryComponent = boundary.component;
+			segmentChildren = AccessBoundary === NotFoundBoundary && treePosition === pageNotFoundCatcherTreePosition ? /* @__PURE__ */ jsx(NotFoundBoundary, {
+				resetKey: accessResetKey,
+				fallback: /* @__PURE__ */ jsx(BoundaryComponent, {}),
+				caughtId: APP_PAGE_NOT_FOUND_BOUNDARY_ID,
 				children: segmentChildren
-			});
-			const layoutUnauthorizedComponent = getDefaultExport(layoutEntry.unauthorizedModule);
-			if (layoutUnauthorizedComponent) segmentChildren = /* @__PURE__ */ jsx(UnauthorizedBoundary, {
-				resetKey: segmentResetKey,
-				fallback: /* @__PURE__ */ jsx(layoutUnauthorizedComponent, {}),
+			}) : /* @__PURE__ */ jsx(AccessBoundary, {
+				resetKey: accessResetKey,
+				fallback: /* @__PURE__ */ jsx(BoundaryComponent, {}),
 				children: segmentChildren
 			});
 		}
@@ -797,9 +949,13 @@ function buildAppPageElements(options) {
 			children: layoutHasElement ? /* @__PURE__ */ jsx(Slot, {
 				id: layoutEntry.id,
 				parallelSlots: createAppPageParallelSlotEntries(layoutIndex, layoutEntries, options.route, getEffectiveSlotParams, resolveSlotOverride),
-				children: segmentChildren
+				children: /* @__PURE__ */ jsx(BfcacheChildrenBoundary, {
+					id: childSegmentElementId,
+					children: segmentChildren
+				})
 			}) : segmentChildren
 		});
+		if (layoutHasElement) childSegmentElementId = layoutEntry.id;
 	}
 	const globalErrorComponent = getErrorBoundaryExport(options.globalErrorModule);
 	routeChildren = /* @__PURE__ */ jsx(GlobalErrorBoundary, {
@@ -815,9 +971,9 @@ function buildAppPageElements(options) {
 		createAppPageStreamingMetadataBody(streamingMetadataBodyId)
 	] });
 	elements[routeId] = pageRenderDependency ? renderAfterAppDependencies(routeElement, [pageRenderDependency]) : routeElement;
-	Object.assign(elements, metadataEntries, options.route.staticSiblings && options.route.staticSiblings.length > 0 ? { [APP_STATIC_SIBLINGS_KEY]: options.route.staticSiblings } : {}, shouldRenderPrefetchLoadingShell ? { [APP_PREFETCH_LOADING_SHELL_MARKER_KEY]: "LoadingBoundary" } : {});
-	registerAppElementRenderDependencies(elements, renderDependenciesByElementId);
+	Object.assign(elements, metadataEntries, options.route.staticSiblings && options.route.staticSiblings.length > 0 ? { [APP_STATIC_SIBLINGS_KEY]: options.route.staticSiblings } : {}, shouldRenderPrefetchLoadingShell ? { [APP_PREFETCH_LOADING_SHELL_MARKER_KEY]: "LoadingBoundary" } : {}, skippedLayoutIds.size > 0 ? { [APP_SKIPPED_LAYOUT_IDS_KEY]: [...skippedLayoutIds] } : {});
+	registerAppPageLayoutGate(elements, layoutGate);
 	return elements;
 }
 //#endregion
-export { buildAppPageElements, createAppPageLayoutEntries, createAppPageRouteBodyMetadata, createAppPageSourcePage, createAppPageTreePath, probeAppPageLayoutWithTracking, resolveAppPageChildSegments, resolveAppPageLoadingModuleAtOrAbove };
+export { buildAppPageElements, createAppPageLayoutEntries, createAppPageRouteBodyMetadata, createAppPageSourcePage, createAppPageTreePath, probeAppPageLayout, resolveAppPageChildSegments, resolveAppPageLoadingModuleAtOrAbove };