vinext 0.1.7 → 0.2.0

package/dist/shims/app-router-scroll-state.js

@@ -14,6 +14,7 @@ function beginAppRouterScrollIntent(hash) {
 	const intent = {
 		commitId: null,
 		hash,
+		headElements: typeof document === "undefined" ? null : new Set(document.head?.children ?? []),
 		id: store.nextId,
 		targetHoistedInHead: false
 	};

package/dist/shims/app-router-scroll.js

@@ -99,7 +99,8 @@ var AppRouterScrollTargetInner = class extends React$1.Component {
 		else node = null;
 		if (node === null) {
 			node = findDOMNode(this);
-			if (node !== null && isInDocumentHead(node)) {
+			const headElement = node instanceof Element ? node : node?.parentElement;
+			if (node !== null && headElement != null && isInDocumentHead(node) && !intent.headElements?.has(headElement)) {
 				markAppRouterScrollIntentHeadHoisted(intent, this.props.commitId);
 				return;
 			}

package/dist/shims/cache.js

@@ -5,7 +5,7 @@ import { MemoryCacheHandler, NoOpCacheHandler, configureMemoryCacheHandler, getC
 import { getCdnCacheAdapter } from "./cdn-cache.js";
 import { fnv1a64 } from "../utils/hash.js";
 import { makeHangingPromise } from "./internal/make-hanging-promise.js";
-import { getHeadersAccessPhase, markDynamicUsage } from "./headers.js";
+import { getHeadersAccessPhase, isDraftModeEnabled, markDynamicUsage } from "./headers.js";
 import { ACTION_DID_REVALIDATE_DYNAMIC_ONLY, ACTION_DID_REVALIDATE_STATIC_AND_DYNAMIC, _consumeRequestScopedCacheLife, _initRequestScopedCacheState, _peekRequestScopedCacheLife, _peekUnstableCacheObservations, _registerCacheContextAccessor, _runWithCacheState, _setRequestScopedCacheLife, cacheLifeProfiles, getAndClearActionRevalidationKind, getRegisteredCacheContext, markActionRevalidation, recordUnstableCacheObservation, shouldServeStaleUnstableCacheEntry } from "./cache-request-state.js";
 import { encodeCacheTag, encodeCacheTags } from "../utils/encode-cache-tag.js";
 import { workUnitAsyncStorage } from "./internal/work-unit-async-storage.js";
@@ -110,10 +110,10 @@ function refresh() {
 *
 * @see https://nextjs.org/docs/app/api-reference/functions/updateTag
 */
-async function updateTag(tag) {
+function updateTag(tag) {
 	if (getHeadersAccessPhase() !== "action") throw new Error("updateTag can only be called from within a Server Action. To invalidate cache tags in Route Handlers or other contexts, use revalidateTag instead. See more info here: https://nextjs.org/docs/app/api-reference/functions/updateTag");
 	markActionRevalidation(1);
-	await _invalidateEncodedTag(encodeCacheTag(tag));
+	return _invalidateEncodedTag(encodeCacheTag(tag));
 }
 /**
 * Opt out of static rendering and indicate a particular component should not be cached.
@@ -380,19 +380,23 @@ function unstable_cache(fn, keyParts, options) {
 			tagCount: tags.length,
 			tagHash: tags.length > 0 ? fnv1a64(JSON.stringify(tags)) : null
 		});
-		const existing = await getDataCacheHandler().get(cacheKey, {
-			kind: "FETCH",
-			tags
-		});
-		if (existing?.value && existing.value.kind === "FETCH") {
-			const cached = tryDeserializeUnstableCacheResult(existing.value.data.body);
-			if (cached.ok) if (existing.cacheState === "stale") {
-				if (shouldServeStaleUnstableCacheEntry()) {
-					scheduleUnstableCacheBackgroundRevalidation(cacheKey, () => refreshUnstableCacheResult(fn, args, cacheKey, tags, revalidateSeconds));
-					return cached.value;
-				}
-			} else return cached.value;
+		const isDraftMode = isDraftModeEnabled();
+		if (!isDraftMode) {
+			const existing = await getDataCacheHandler().get(cacheKey, {
+				kind: "FETCH",
+				tags
+			});
+			if (existing?.value && existing.value.kind === "FETCH") {
+				const cached = tryDeserializeUnstableCacheResult(existing.value.data.body);
+				if (cached.ok) if (existing.cacheState === "stale") {
+					if (shouldServeStaleUnstableCacheEntry()) {
+						scheduleUnstableCacheBackgroundRevalidation(cacheKey, () => refreshUnstableCacheResult(fn, args, cacheKey, tags, revalidateSeconds));
+						return cached.value;
+					}
+				} else return cached.value;
+			}
 		}
+		if (isDraftMode) return await _unstableCacheAls.run(true, () => fn(...args));
 		return await refreshUnstableCacheResult(fn, args, cacheKey, tags, revalidateSeconds);
 	};
 	return cachedFn;

package/dist/shims/cdn-cache.js

@@ -1,6 +1,6 @@
 import { getRequestExecutionContext } from "./request-context.js";
 import { getDataCacheHandler } from "./cache-handler.js";
-import { CloudflareCdnCacheAdapter } from "../cloudflare/src/cache/cdn-adapter.runtime.js";
+import { CloudflareCdnCacheAdapter } from "../packages/cloudflare/src/cache/cdn-adapter.runtime.js";
 //#region src/shims/cdn-cache.ts
 /**
 * CDN cache adapter — owns the *page-level ISR serving strategy*.

package/dist/shims/dynamic-preload-chunks.js

@@ -3,6 +3,7 @@ import { appendAssetDeploymentIdQuery } from "../utils/deployment-id.js";
 import { useScriptNonce } from "./script-nonce-context.js";
 import React from "react";
 import * as ReactDOM from "react-dom";
+import { getPagesClientAssets } from "vinext/server/pages-client-assets";
 //#region src/shims/dynamic-preload-chunks.tsx
 /**
 * Preload links for rendered next/dynamic() boundaries.
@@ -34,7 +35,7 @@ function dynamicPreloadHref(file) {
 }
 function resolveDynamicPreloadFiles(moduleIds) {
 	if (!moduleIds || moduleIds.length === 0) return [];
-	const preloadMap = globalThis.__VINEXT_DYNAMIC_PRELOADS__;
+	const preloadMap = getPagesClientAssets().dynamicPreloads;
 	if (!preloadMap) return [];
 	const files = [];
 	const seen = /* @__PURE__ */ new Set();

package/dist/shims/error-boundary.d.ts

@@ -9,6 +9,24 @@ type ErrorBoundaryProps = {
   children: React.ReactNode;
   resetKey?: string | null;
 };
+type SerializedBoundaryError = {
+  digest?: string;
+  message: string;
+  name?: string;
+  stack?: string;
+};
+declare function SerializedErrorBoundary({
+  fallback: Fallback,
+  error
+}: {
+  fallback: React.ComponentType<{
+    error: Error & {
+      digest?: string;
+    };
+    reset: () => void;
+  }>;
+  error: SerializedBoundaryError;
+}): React.JSX.Element;
 type CapturedError = {
   thrownValue: unknown;
 };
@@ -152,4 +170,4 @@ declare class DevRecoveryBoundary extends React.Component<DevRecoveryBoundaryPro
   render(): React.ReactNode;
 }
 //#endregion
-export { DevRecoveryBoundary, DevRecoveryBoundaryProps, ErrorBoundary, ErrorBoundaryInner, ErrorBoundaryProps, ErrorBoundaryState, ForbiddenBoundary, ForbiddenBoundaryInner, GlobalErrorBoundary, NotFoundBoundary, RedirectBoundary, RedirectErrorBoundary, UnauthorizedBoundary, UnauthorizedBoundaryInner };
+export { DevRecoveryBoundary, DevRecoveryBoundaryProps, ErrorBoundary, ErrorBoundaryInner, ErrorBoundaryProps, ErrorBoundaryState, ForbiddenBoundary, ForbiddenBoundaryInner, GlobalErrorBoundary, NotFoundBoundary, RedirectBoundary, RedirectErrorBoundary, SerializedBoundaryError, SerializedErrorBoundary, UnauthorizedBoundary, UnauthorizedBoundaryInner };

package/dist/shims/error-boundary.js

@@ -9,6 +9,16 @@ import { isNavigationSignalError } from "../utils/navigation-signal.js";
 import React from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 //#region src/shims/error-boundary.tsx
+function SerializedErrorBoundary({ fallback: Fallback, error }) {
+	return /* @__PURE__ */ jsx(Fallback, {
+		error: Object.assign(new Error(error.message), {
+			digest: error.digest,
+			name: error.name ?? "Error",
+			stack: error.stack
+		}),
+		reset: () => globalThis.location?.reload()
+	});
+}
 function normalizeBoundaryResetKey(resetKey) {
 	return resetKey === void 0 || resetKey === null || resetKey === "" ? null : resetKey;
 }
@@ -339,4 +349,4 @@ var DevRecoveryBoundary = class extends React.Component {
 	}
 };
 //#endregion
-export { DevRecoveryBoundary, ErrorBoundary, ErrorBoundaryInner, ForbiddenBoundary, ForbiddenBoundaryInner, GlobalErrorBoundary, NotFoundBoundary, RedirectBoundary, RedirectErrorBoundary, UnauthorizedBoundary, UnauthorizedBoundaryInner };
+export { DevRecoveryBoundary, ErrorBoundary, ErrorBoundaryInner, ForbiddenBoundary, ForbiddenBoundaryInner, GlobalErrorBoundary, NotFoundBoundary, RedirectBoundary, RedirectErrorBoundary, SerializedErrorBoundary, UnauthorizedBoundary, UnauthorizedBoundaryInner };

package/dist/shims/form.d.ts

@@ -1,6 +1,8 @@
 import { FormHTMLAttributes, useActionState } from "react";
 
 //#region src/shims/form.d.ts
+type FormSubmitter = HTMLButtonElement | HTMLInputElement;
+declare function createFormSubmitDestinationUrl(action: string, form: HTMLFormElement, submitter: FormSubmitter | null): string;
 declare const Form: import("react").ForwardRefExoticComponent<{
   /** Target URL for GET forms, or server action for POST forms */action: string | ((formData: FormData) => void | Promise<void>); /** Replace instead of push in history (default: false) */
   replace?: boolean; /** Scroll to top after navigation (default: true) */
@@ -16,4 +18,4 @@ declare const Form: import("react").ForwardRefExoticComponent<{
   prefetch?: false | null;
 } & Omit<FormHTMLAttributes<HTMLFormElement>, "method" | "encType" | "target"> & import("react").RefAttributes<HTMLFormElement>>;
 //#endregion
-export { Form as default, useActionState };
+export { createFormSubmitDestinationUrl, Form as default, useActionState };

package/dist/shims/form.js

@@ -1,9 +1,11 @@
 "use client";
 import { VINEXT_MOUNTED_SLOTS_HEADER } from "../server/headers.js";
-import { isDangerousScheme } from "./url-safety.js";
+import { assertSafeNavigationUrl } from "./url-safety.js";
 import { AppElementsWire } from "../server/app-elements-wire.js";
+import { APP_RSC_RENDER_MODE_PREFETCH_LOADING_SHELL } from "../server/app-rsc-render-mode.js";
 import "../server/app-elements.js";
-import { toSameOriginPath, withBasePath } from "./url-utils.js";
+import { withBasePath } from "./url-utils.js";
+import { isBotUserAgent } from "../utils/html-limited-bots.js";
 import { createRscRequestHeaders, createRscRequestUrl } from "../server/app-rsc-cache-busting.js";
 import { hasAppNavigationRuntime } from "../client/navigation-runtime.js";
 import { getMountedSlotsHeader, getPrefetchInterceptionContext, getPrefetchedUrls, hasPrefetchCacheEntryForNavigation, navigateClientSide, prefetchRscResponse } from "./navigation.js";
@@ -37,18 +39,13 @@ const DISALLOWED_FORM_PROPS = [
 const SUPPORTED_FORM_ENCTYPE = "application/x-www-form-urlencoded";
 const SUPPORTED_FORM_METHOD = "GET";
 const SUPPORTED_FORM_TARGET = "_self";
-function isSafeAction(action) {
-	if (isDangerousScheme(action)) return false;
-	if (action.startsWith("//")) return false;
-	if (/^https?:\/\//i.test(action)) {
-		if (typeof window !== "undefined") try {
-			return new URL(action).origin === window.location.origin;
-		} catch {
-			return false;
-		}
+function isPrefetchableAction(action) {
+	try {
+		const actionUrl = new URL(action, window.location.href);
+		return (actionUrl.protocol === "http:" || actionUrl.protocol === "https:") && actionUrl.origin === window.location.origin;
+	} catch {
 		return false;
 	}
-	return true;
 }
 function getSubmitter(nativeEvent) {
 	const submitter = nativeEvent && typeof nativeEvent === "object" && "submitter" in nativeEvent && nativeEvent.submitter instanceof Element ? nativeEvent.submitter : null;
@@ -103,7 +100,7 @@ function createFormSubmitDestinationUrl(action, form, submitter) {
 		if (process.env.NODE_ENV !== "production") console.warn("<Form> only supports file inputs if `action` is a function. File inputs cannot be used if `action` is a string, because files cannot be encoded as search params.");
 		targetUrl.searchParams.append(name, value.name);
 	} else targetUrl.searchParams.append(name, value);
-	return toSameOriginPath(targetUrl.href) ?? targetUrl.href;
+	return targetUrl.href;
 }
 function buildFormData(form, submitter) {
 	if (!submitter) return new FormData(form);
@@ -137,7 +134,7 @@ const Form = forwardRef(function Form(props, ref) {
 	useEffect(() => {
 		if (typeof action !== "string") return;
 		if (prefetch === false || process.env.NODE_ENV !== "production") return;
-		if (!isSafeAction(action)) return;
+		if (!isPrefetchableAction(actionHref)) return;
 		if (!hasAppNavigationRuntime()) return;
 		const node = formRef.current;
 		if (!node) return;
@@ -145,9 +142,13 @@ const Form = forwardRef(function Form(props, ref) {
 		const observer = new IntersectionObserver((entries) => {
 			for (const entry of entries) if (entry.isIntersecting || entry.intersectionRatio > 0) {
 				(async () => {
+					if (isBotUserAgent(window.navigator?.userAgent ?? "")) return;
 					const interceptionContext = getPrefetchInterceptionContext(actionHref);
 					const mountedSlotsHeader = getMountedSlotsHeader();
-					const headers = createRscRequestHeaders({ interceptionContext });
+					const headers = createRscRequestHeaders({
+						interceptionContext,
+						renderMode: APP_RSC_RENDER_MODE_PREFETCH_LOADING_SHELL
+					});
 					if (mountedSlotsHeader) headers.set(VINEXT_MOUNTED_SLOTS_HEADER, mountedSlotsHeader);
 					const rscUrl = await createRscRequestUrl(actionHref, headers);
 					const cacheKey = AppElementsWire.encodeCacheKey(rscUrl, interceptionContext);
@@ -161,8 +162,8 @@ const Form = forwardRef(function Form(props, ref) {
 						priority: "low",
 						purpose: "prefetch"
 					}), interceptionContext, mountedSlotsHeader, void 0, {
-						cacheForNavigation: true,
-						optimisticRouteShell: false
+						cacheForNavigation: false,
+						optimisticRouteShell: true
 					});
 				})();
 				observer.unobserve(node);
@@ -183,15 +184,7 @@ const Form = forwardRef(function Form(props, ref) {
 		onSubmit,
 		...cleanRest
 	});
-	if (!isSafeAction(action)) {
-		if (process.env.NODE_ENV !== "production") console.warn(`<Form> blocked unsafe action: ${action}`);
-		return /* @__PURE__ */ jsx("form", {
-			ref: setRefs,
-			onSubmit,
-			...cleanRest
-		});
-	}
-	async function handleSubmit(e) {
+	function handleSubmit(e) {
 		if (onSubmit) {
 			onSubmit(e);
 			if (e.defaultPrevented) return;
@@ -204,23 +197,24 @@ const Form = forwardRef(function Form(props, ref) {
 		}
 		const effectiveAction = getEffectiveAction(submitter, actionHref);
 		if (process.env.NODE_ENV !== "production" && submitter?.getAttribute("formaction") !== null) checkFormActionUrl(effectiveAction, "formAction");
-		if (!isSafeAction(effectiveAction)) {
-			if (process.env.NODE_ENV !== "production") console.warn(`<Form> blocked unsafe action: ${effectiveAction}`);
-			e.preventDefault();
-			return;
-		}
-		e.preventDefault();
 		const url = createFormSubmitDestinationUrl(effectiveAction, e.currentTarget, submitter);
-		if (hasAppNavigationRuntime()) await navigateClientSide(url, replace ? "replace" : "push", scroll);
-		else try {
-			const Router = (await import("./router.js")).default;
-			if (replace) await Router.replace(url, void 0, { scroll });
-			else await Router.push(url, void 0, { scroll });
-		} catch {
-			if (replace) window.history.replaceState({}, "", url);
-			else window.history.pushState({}, "", url);
-			window.dispatchEvent(new PopStateEvent("popstate"));
-			if (scroll) window.scrollTo(0, 0);
+		e.preventDefault();
+		if (hasAppNavigationRuntime()) {
+			assertSafeNavigationUrl(url);
+			navigateClientSide(url, replace ? "replace" : "push", scroll);
+		} else {
+			assertSafeNavigationUrl(url);
+			(async () => {
+				let Router;
+				try {
+					Router = (await import("./router.js")).default;
+					if (replace) await Router.replace(url, void 0, { scroll });
+					else await Router.push(url, void 0, { scroll });
+				} catch {
+					if (replace) window.location.replace(url);
+					else window.location.assign(url);
+				}
+			})();
 		}
 	}
 	return /* @__PURE__ */ jsx("form", {
@@ -233,4 +227,4 @@ const Form = forwardRef(function Form(props, ref) {
 	});
 });
 //#endregion
-export { Form as default, useActionState };
+export { createFormSubmitDestinationUrl, Form as default, useActionState };

package/dist/shims/headers.d.ts

@@ -5,6 +5,7 @@ type HeadersContext = {
   headers: Headers;
   cookies: Map<string, string>;
   accessError?: Error;
+  draftModeEnabled?: boolean;
   forceStatic?: boolean;
   mutableCookies?: RequestCookies;
   readonlyCookies?: RequestCookies;
@@ -47,6 +48,7 @@ type ConnectionProbeResult<T> = {
  */
 declare function markDynamicUsage(): void;
 declare function markRenderRequestApiUsage(kind: RenderRequestApiKind): void;
+declare function throwIfStaticGenerationAccessError(): void;
 declare function runWithConnectionProbe<T>(fn: () => T | Promise<T>): Promise<ConnectionProbeResult<T>>;
 declare function suspendConnectionProbe(): Promise<never> | null;
 declare function peekRenderRequestApiUsage(): RenderRequestApiKind[];
@@ -177,6 +179,12 @@ declare function getAndClearPendingCookies(): string[];
  */
 declare function getDraftModeCookieHeader(): string | null;
 declare function isDraftModeRequest(request: Request, draftModeSecret: string): boolean;
+/**
+ * Read the active request's draft-mode state without recording request API usage.
+ * Internal cache implementations use this to bypass persistent reads and writes,
+ * matching Next.js's request-level `workStore.isDraftMode` guard.
+ */
+declare function isDraftModeEnabled(): boolean;
 type DraftModeResult = {
   readonly isEnabled: boolean;
   enable(): void;
@@ -250,4 +258,4 @@ declare class RequestCookies {
   toString(): string;
 }
 //#endregion
-export { HeadersAccessPhase, HeadersContext, type RequestCookies, VinextHeadersShimState, applyMiddlewareRequestHeaders, consumeDynamicUsage, consumeInvalidDynamicUsageError, consumeRenderRequestApiUsage, cookies, draftMode, getAndClearPendingCookies, getDraftModeCookieHeader, getHeadersAccessPhase, getHeadersContext, headers, headersContextFromRequest, isDraftModeRequest, markDynamicUsage, markRenderRequestApiUsage, peekDynamicUsage, peekRenderRequestApiUsage, runWithConnectionProbe, runWithHeadersContext, setHeadersAccessPhase, setHeadersContext, suspendConnectionProbe, throwIfInsideCacheScope };
+export { HeadersAccessPhase, HeadersContext, type RequestCookies, VinextHeadersShimState, applyMiddlewareRequestHeaders, consumeDynamicUsage, consumeInvalidDynamicUsageError, consumeRenderRequestApiUsage, cookies, draftMode, getAndClearPendingCookies, getDraftModeCookieHeader, getHeadersAccessPhase, getHeadersContext, headers, headersContextFromRequest, isDraftModeEnabled, isDraftModeRequest, markDynamicUsage, markRenderRequestApiUsage, peekDynamicUsage, peekRenderRequestApiUsage, runWithConnectionProbe, runWithHeadersContext, setHeadersAccessPhase, setHeadersContext, suspendConnectionProbe, throwIfInsideCacheScope, throwIfStaticGenerationAccessError };

package/dist/shims/headers.js

@@ -1,7 +1,8 @@
 import { getOrCreateAls } from "./internal/als-registry.js";
 import { getRequestContext, isInsideUnifiedScope, runWithUnifiedStateMutation } from "./unified-request-context.js";
-import { MIDDLEWARE_SET_COOKIE_HEADER } from "../server/headers.js";
-import { buildRequestHeadersFromMiddlewareResponse } from "../server/middleware-request-headers.js";
+import { MIDDLEWARE_SET_COOKIE_HEADER } from "../utils/protocol-headers.js";
+import { FLIGHT_HEADERS, NEXT_HTML_REQUEST_ID_HEADER, NEXT_REQUEST_ID_HEADER } from "../server/headers.js";
+import { buildRequestHeadersFromMiddlewareResponse } from "../utils/middleware-request-headers.js";
 import { serializeSetCookie, validateCookieAttributeValue, validateCookieName } from "./internal/cookie-serialize.js";
 import { parseEdgeRequestCookieHeader } from "../utils/parse-cookie.js";
 import { createPprFallbackShellSuspensePromise } from "./ppr-fallback-shell.js";
@@ -117,6 +118,10 @@ function markDynamicUsage() {
 function markRenderRequestApiUsage(kind) {
 	_getState().renderRequestApiUsage.add(kind);
 }
+function throwIfStaticGenerationAccessError() {
+	const accessError = _getState().headersContext?.accessError;
+	if (accessError) throw accessError;
+}
 async function runWithConnectionProbe(fn) {
 	const state = _getState();
 	const previousProbe = state.connectionProbe;
@@ -468,7 +473,13 @@ function _getReadonlyCookies(ctx) {
 	return ctx.readonlyCookies;
 }
 function _getReadonlyHeaders(ctx) {
-	if (!ctx.readonlyHeaders) ctx.readonlyHeaders = _sealHeaders(ctx.headers);
+	if (!ctx.readonlyHeaders) {
+		const cleaned = new Headers(ctx.headers);
+		for (const header of FLIGHT_HEADERS) cleaned.delete(header);
+		cleaned.delete(NEXT_REQUEST_ID_HEADER);
+		cleaned.delete(NEXT_HTML_REQUEST_ID_HEADER);
+		ctx.readonlyHeaders = _sealHeaders(cleaned);
+	}
 	return ctx.readonlyHeaders;
 }
 /**
@@ -599,6 +610,19 @@ function isDraftModeRequest(request, draftModeSecret) {
 	if (!cookieHeader) return false;
 	return parseEdgeRequestCookieHeader(cookieHeader).get(DRAFT_MODE_COOKIE) === validateDraftModeSecret(draftModeSecret);
 }
+/**
+* Read the active request's draft-mode state without recording request API usage.
+* Internal cache implementations use this to bypass persistent reads and writes,
+* matching Next.js's request-level `workStore.isDraftMode` guard.
+*/
+function isDraftModeEnabled() {
+	const context = _getState().headersContext;
+	if (!context) return false;
+	if (context.draftModeEnabled !== void 0) return context.draftModeEnabled;
+	const secret = context.draftModeSecret;
+	if (secret === void 0) return false;
+	return context.cookies.get(DRAFT_MODE_COOKIE) === validateDraftModeSecret(secret);
+}
 function draftModeCookieAttributes() {
 	if (typeof process !== "undefined" && process.env?.NODE_ENV === "development") return "Path=/; HttpOnly; SameSite=Lax";
 	return "Path=/; HttpOnly; SameSite=None; Secure";
@@ -631,16 +655,16 @@ async function draftMode() {
 	const state = _getState();
 	const context = state.headersContext;
 	if (!context) throw createDraftModeScopeError("draftMode()");
-	if (context.accessError) throw context.accessError;
 	const secret = ensureContextDraftModeSecret(context);
 	return {
 		get isEnabled() {
-			return context.cookies.get(DRAFT_MODE_COOKIE) === secret;
+			return context.draftModeEnabled ?? context.cookies.get(DRAFT_MODE_COOKIE) === secret;
 		},
 		enable() {
 			throwIfInsideCacheScope("draftMode().enable()");
 			const activeContext = requireActiveDraftModeContext(state, context, "draftMode().enable()");
 			markDynamicUsage();
+			activeContext.draftModeEnabled = true;
 			activeContext.cookies.set(DRAFT_MODE_COOKIE, secret);
 			state.draftModeCookieHeader = `${DRAFT_MODE_COOKIE}=${secret}; ${draftModeCookieAttributes()}`;
 		},
@@ -648,6 +672,7 @@ async function draftMode() {
 			throwIfInsideCacheScope("draftMode().disable()");
 			const activeContext = requireActiveDraftModeContext(state, context, "draftMode().disable()");
 			markDynamicUsage();
+			activeContext.draftModeEnabled = false;
 			activeContext.cookies.delete(DRAFT_MODE_COOKIE);
 			state.draftModeCookieHeader = `${DRAFT_MODE_COOKIE}=; ${draftModeCookieAttributes()}; Expires=${DRAFT_MODE_EXPIRED_DATE}`;
 		}
@@ -751,4 +776,4 @@ var RequestCookies = class {
 	}
 };
 //#endregion
-export { applyMiddlewareRequestHeaders, consumeDynamicUsage, consumeInvalidDynamicUsageError, consumeRenderRequestApiUsage, cookies, draftMode, getAndClearPendingCookies, getDraftModeCookieHeader, getHeadersAccessPhase, getHeadersContext, headers, headersContextFromRequest, isDraftModeRequest, markDynamicUsage, markRenderRequestApiUsage, peekDynamicUsage, peekRenderRequestApiUsage, runWithConnectionProbe, runWithHeadersContext, setHeadersAccessPhase, setHeadersContext, suspendConnectionProbe, throwIfInsideCacheScope };
+export { applyMiddlewareRequestHeaders, consumeDynamicUsage, consumeInvalidDynamicUsageError, consumeRenderRequestApiUsage, cookies, draftMode, getAndClearPendingCookies, getDraftModeCookieHeader, getHeadersAccessPhase, getHeadersContext, headers, headersContextFromRequest, isDraftModeEnabled, isDraftModeRequest, markDynamicUsage, markRenderRequestApiUsage, peekDynamicUsage, peekRenderRequestApiUsage, runWithConnectionProbe, runWithHeadersContext, setHeadersAccessPhase, setHeadersContext, suspendConnectionProbe, throwIfInsideCacheScope, throwIfStaticGenerationAccessError };

package/dist/shims/image.js

@@ -1,4 +1,5 @@
 "use client";
+import { getDeploymentId } from "../utils/deployment-id.js";
 import { useMergedRef } from "./use-merged-ref.js";
 import { hasRemoteMatch, isPrivateIp } from "./image-config.js";
 import { forwardRef, useEffect, useLayoutEffect, useRef, useState } from "react";
@@ -54,6 +55,22 @@ const __imageDeviceSizes = (() => {
 		];
 	}
 })();
+const __imageSizes = (() => {
+	try {
+		return JSON.parse(process.env.__VINEXT_IMAGE_SIZES ?? "[16,32,48,64,96,128,256,384]");
+	} catch {
+		return [
+			16,
+			32,
+			48,
+			64,
+			96,
+			128,
+			256,
+			384
+		];
+	}
+})();
 /**
 * Whether dangerouslyAllowSVG is enabled in next.config.js.
 * When false (default), .svg sources auto-skip the optimization endpoint
@@ -68,6 +85,7 @@ const __dangerouslyAllowSVG = process.env.__VINEXT_IMAGE_DANGEROUSLY_ALLOW_SVG =
 * are blocked to mitigate SSRF risk.
 */
 const __dangerouslyAllowLocalIP = process.env.__VINEXT_IMAGE_DANGEROUSLY_ALLOW_LOCAL_IP === "true";
+const __globallyUnoptimized = process.env.__VINEXT_IMAGE_UNOPTIMIZED === "true";
 /**
 * Validate that a remote URL is allowed by the configured remote patterns.
 * Returns true if the URL is allowed, false otherwise.
@@ -210,7 +228,33 @@ function resolveImageSource(v) {
 * These are the breakpoints used for srcSet generation.
 * Configurable via `images.deviceSizes` in next.config.js.
 */
-const RESPONSIVE_WIDTHS = __imageDeviceSizes;
+const RESPONSIVE_WIDTHS = [...__imageDeviceSizes].sort((left, right) => left - right);
+const ALL_IMAGE_WIDTHS = [...RESPONSIVE_WIDTHS, ...__imageSizes].sort((left, right) => left - right);
+function extractLocalDeploymentId(src) {
+	let deploymentId = getDeploymentId();
+	if (!src.startsWith("/") || src.startsWith("//")) return {
+		src,
+		deploymentId
+	};
+	const queryIndex = src.indexOf("?");
+	if (queryIndex === -1) return {
+		src,
+		deploymentId
+	};
+	const params = new URLSearchParams(src.slice(queryIndex + 1));
+	const sourceDeploymentId = params.get("dpl");
+	if (!sourceDeploymentId) return {
+		src,
+		deploymentId
+	};
+	deploymentId = sourceDeploymentId;
+	params.delete("dpl");
+	const remainingQuery = params.toString();
+	return {
+		src: src.slice(0, queryIndex) + (remainingQuery ? `?${remainingQuery}` : ""),
+		deploymentId
+	};
+}
 /**
 * Build a `/_next/image` optimization URL.
 *
@@ -219,7 +263,9 @@ const RESPONSIVE_WIDTHS = __imageDeviceSizes;
 * server handles it as a passthrough (serves the original file).
 */
 function imageOptimizationUrl(src, width, quality = 75) {
-	return `/_next/image?url=${encodeURIComponent(src)}&w=${width}&q=${quality}`;
+	const source = extractLocalDeploymentId(src);
+	const deploymentQuery = source.src.startsWith("/") && source.deploymentId ? `&dpl=${source.deploymentId}` : "";
+	return `/_next/image?url=${encodeURIComponent(source.src)}&w=${width}&q=${quality}${deploymentQuery}`;
 }
 function preloadImageResource(input) {
 	if (!input.shouldPreload) return;
@@ -235,13 +281,26 @@ function preloadImageResource(input) {
 * Generate a srcSet string for responsive images.
 *
 * Each width points to the `/_next/image` optimization endpoint so the
-* server can resize and transcode the image. Only includes widths that are
-* <= 2x the original image width to avoid pointless upscaling.
+* server can resize and transcode the image.
 */
-function generateSrcSet(src, originalWidth, quality = 75) {
-	const widths = RESPONSIVE_WIDTHS.filter((w) => w <= originalWidth * 2);
-	if (widths.length === 0) return `${imageOptimizationUrl(src, originalWidth, quality)} ${originalWidth}w`;
-	return widths.map((w) => `${imageOptimizationUrl(src, w, quality)} ${w}w`).join(", ");
+function getImageWidths(width) {
+	return [...new Set([width, width * 2].map((targetWidth) => ALL_IMAGE_WIDTHS.find((configuredWidth) => configuredWidth >= targetWidth) ?? ALL_IMAGE_WIDTHS[ALL_IMAGE_WIDTHS.length - 1]))];
+}
+function generateImageAttributes(src, width, quality = 75, sizes) {
+	if (sizes) {
+		const viewportPercentages = Array.from(sizes.matchAll(/(^|\s)(1?\d?\d)vw/g), (match) => Number.parseInt(match[2], 10));
+		const minimumWidth = viewportPercentages.length > 0 ? RESPONSIVE_WIDTHS[0] * (Math.min(...viewportPercentages) * .01) : 0;
+		const candidates = ALL_IMAGE_WIDTHS.filter((candidateWidth) => candidateWidth >= minimumWidth);
+		return {
+			src: imageOptimizationUrl(src, candidates[candidates.length - 1], quality),
+			srcSet: candidates.map((candidateWidth) => `${imageOptimizationUrl(src, candidateWidth, quality)} ${candidateWidth}w`).join(", ")
+		};
+	}
+	const widths = getImageWidths(width);
+	return {
+		src: imageOptimizationUrl(src, widths[widths.length - 1], quality),
+		srcSet: widths.map((candidateWidth, index) => `${imageOptimizationUrl(src, candidateWidth, quality)} ${index + 1}x`).join(", ")
+	};
 }
 const Image = forwardRef(function Image({ src: srcProp, alt, width, height, fill, preload, priority, quality, placeholder, blurDataURL, loader, sizes, className, style, onLoad, onLoadingComplete, onError, unoptimized: _unoptimized, overrideSrc, loading, ...rest }, ref) {
 	const lastLoadedSrcRef = useRef(void 0);
@@ -326,7 +385,7 @@ const Image = forwardRef(function Image({ src: srcProp, alt, width, height, fill
 		lastErrorSrcRef.current = src;
 		markBlurComplete();
 	} : void 0;
-	if (_unoptimized === true) {
+	if (_unoptimized === true || __globallyUnoptimized) {
 		const renderedSrc = overrideSrc || src;
 		const sanitizedBlur = imgBlurDataURL ? sanitizeBlurDataURL(imgBlurDataURL) : void 0;
 		const blurStyle = !blurComplete && placeholder === "blur" && sanitizedBlur ? {
@@ -456,8 +515,9 @@ const Image = forwardRef(function Image({ src: srcProp, alt, width, height, fill
 	}
 	const imgQuality = quality ?? 75;
 	const skipOptimization = isSvgUrl(src) && !__dangerouslyAllowSVG;
-	const srcSet = imgWidth && !fill && !skipOptimization ? generateSrcSet(src, imgWidth, imgQuality) : imgWidth && !fill ? RESPONSIVE_WIDTHS.filter((w) => w <= imgWidth * 2).map((w) => `${src} ${w}w`).join(", ") || `${src} ${imgWidth}w` : void 0;
-	const optimizedSrc = skipOptimization ? src : imgWidth ? imageOptimizationUrl(src, imgWidth, imgQuality) : imageOptimizationUrl(src, RESPONSIVE_WIDTHS[0], imgQuality);
+	const optimizedAttributes = imgWidth && !fill && !skipOptimization ? generateImageAttributes(src, imgWidth, imgQuality, sizes) : void 0;
+	const srcSet = optimizedAttributes ? optimizedAttributes.srcSet : imgWidth && !fill ? RESPONSIVE_WIDTHS.filter((w) => w <= imgWidth * 2).map((w) => `${src} ${w}w`).join(", ") || `${src} ${imgWidth}w` : void 0;
+	const optimizedSrc = skipOptimization ? src : optimizedAttributes ? optimizedAttributes.src : imageOptimizationUrl(src, RESPONSIVE_WIDTHS[0], imgQuality);
 	const sanitizedLocalBlur = imgBlurDataURL ? sanitizeBlurDataURL(imgBlurDataURL) : void 0;
 	const blurStyle = !blurComplete && placeholder === "blur" && sanitizedLocalBlur ? {
 		backgroundImage: `url(${sanitizedLocalBlur})`,
@@ -508,7 +568,7 @@ function getImageProps(props) {
 		blurDataURL: blurDataURLProp
 	});
 	const shouldPreload = _preload === true || priority === true;
-	if (_unoptimized === true) {
+	if (_unoptimized === true || __globallyUnoptimized) {
 		const renderedSrc = overrideSrc || src;
 		const sanitizedBlurURL = imgBlurDataURL ? sanitizeBlurDataURL(imgBlurDataURL) : void 0;
 		const blurStyle = placeholder === "blur" && sanitizedBlurURL ? {
@@ -550,8 +610,9 @@ function getImageProps(props) {
 		quality: imgQuality
 	}) : src;
 	const skipOpt = isSvgUrl(resolvedSrc) && !__dangerouslyAllowSVG || blockedInProd || !!loader || isRemoteUrl(resolvedSrc);
-	const optimizedSrc = skipOpt ? resolvedSrc : imgWidth ? imageOptimizationUrl(resolvedSrc, imgWidth, imgQuality) : imageOptimizationUrl(resolvedSrc, RESPONSIVE_WIDTHS[0], imgQuality);
-	const srcSet = imgWidth && !fill && !isRemoteUrl(resolvedSrc) && !loader && !skipOpt ? generateSrcSet(resolvedSrc, imgWidth, imgQuality) : void 0;
+	const optimizedAttributes = imgWidth && !fill && !skipOpt ? generateImageAttributes(resolvedSrc, imgWidth, imgQuality, sizes) : null;
+	const optimizedSrc = skipOpt ? resolvedSrc : optimizedAttributes ? optimizedAttributes.src : imageOptimizationUrl(resolvedSrc, RESPONSIVE_WIDTHS[0], imgQuality);
+	const srcSet = optimizedAttributes?.srcSet;
 	const sanitizedBlurURL = imgBlurDataURL ? sanitizeBlurDataURL(imgBlurDataURL) : void 0;
 	const blurStyle = placeholder === "blur" && sanitizedBlurURL ? {
 		backgroundImage: `url(${sanitizedBlurURL})`,

package/dist/shims/internal/app-route-detection.d.ts

@@ -1,4 +1,5 @@
 import { VinextLinkPrefetchRoute } from "../../client/vinext-next-data.js";
+import { getPagesRouterComponentsMap } from "./pages-router-components.js";
 
 //#region src/shims/internal/app-route-detection.d.ts
 declare global {
@@ -6,22 +7,6 @@ declare global {
     __VINEXT_LINK_PREFETCH_ROUTES__?: VinextLinkPrefetchRoute[];
   }
 }
-/**
- * Pages Router `components` map shape. Next.js types this loosely (route
- * pattern → `PrivateRouteInfo`), but for the App Router-detected case it
- * stores `{ __appRouter: true }` as a marker (see Next.js source link above).
- * Vinext only writes the marker variant; reads are by test code that checks
- * for `__appRouter: true`.
- */
-type PagesRouterComponentsMap = Record<string, {
-  __appRouter: true;
-} | Record<string, unknown>>;
-/**
- * Get-or-create the Pages Router `components` map. Returns the same object
- * on every call so `router.components` and `window.next.router.components`
- * have referential identity.
- */
-declare function getPagesRouterComponentsMap(): PagesRouterComponentsMap;
 /**
  * Record `components[pathname] = { __appRouter: true }` on the shared
  * Pages Router map when the href matches an App Router route. No-op when the
@@ -34,6 +19,6 @@ declare function getPagesRouterComponentsMap(): PagesRouterComponentsMap;
  * first (e.g. `link.tsx` normalises to match `trailingSlash` config before
  * calling, while `router.prefetch()` passes the raw user-supplied URL).
  */
-declare function markAppRouteDetectedOnPrefetch(href: string, basePath: string): void;
+declare function markAppRouteDetectedOnPrefetch(href: string, basePath: string): Promise<void>;
 //#endregion
 export { getPagesRouterComponentsMap, markAppRouteDetectedOnPrefetch };