vinext 1.0.0-beta.1 → 1.0.0-beta.2

package/dist/shims/dynamic.d.ts

@@ -1,28 +1,7 @@
-import { ComponentType } from "react";
+import React, { ComponentType } from "react";
+import { DynamicOptions, DynamicOptionsLoadingProps, LoadableComponent, LoadableFn, LoadableGeneratedOptions, LoadableOptions, Loader, LoaderComponent, LoaderMap } from "@vinext/types/next/upstream/dynamic";
 
 //#region src/shims/dynamic.d.ts
-type DynamicLoadingProps = {
-  error?: Error | null;
-  isLoading?: boolean;
-  pastDelay?: boolean;
-  retry?: () => void;
-  timedOut?: boolean;
-};
-type ComponentModule<P> = {
-  default: ComponentType<P>;
-};
-type LoaderComponent<P> = Promise<ComponentModule<P> | ComponentType<P>>;
-type LoaderFn<P> = () => LoaderComponent<P>;
-type DynamicOptions<P> = {
-  loading?: ComponentType<DynamicLoadingProps>;
-  loader?: Loader<P>;
-  loadableGenerated?: {
-    modules?: readonly string[];
-  };
-  modules?: readonly string[];
-  ssr?: boolean;
-};
-type Loader<P> = LoaderFn<P> | LoaderComponent<P>;
 type DynamicInput<P> = DynamicOptions<P> | Loader<P>;
 /**
  * Wait for all pending dynamic() preloads to resolve, then clear the queue.
@@ -30,6 +9,7 @@ type DynamicInput<P> = DynamicOptions<P> | Loader<P>;
  * No-op for the App Router path which uses React.lazy + Suspense.
  */
 declare function flushPreloads(): Promise<void[]>;
-declare function dynamic<P extends object = object>(dynamicInput: DynamicInput<P>, options?: DynamicOptions<P>): ComponentType<P>;
+declare function dynamic<P = {}>(dynamicInput: DynamicInput<P>, options?: DynamicOptions<P>): ComponentType<P>;
+declare function noSSR<P = {}>(LoadableInitializer: LoadableFn<P>, loadableOptions: DynamicOptions<P>): React.ComponentType<P>;
 //#endregion
-export { dynamic as default, flushPreloads };
+export { type DynamicOptions, type DynamicOptionsLoadingProps, type LoadableComponent, type LoadableFn, type LoadableGeneratedOptions, type LoadableOptions, type Loader, type LoaderComponent, type LoaderMap, dynamic as default, flushPreloads, noSSR };

package/dist/shims/dynamic.js

@@ -68,6 +68,9 @@ function useRetryableLazyComponent(loader, initialLazyComponent) {
 		retryKey
 	};
 }
+function createElementWithProps(Component, props) {
+	return React.createElement(Component, props);
+}
 /**
 * Lightweight error boundary that renders the loading component with the error
 * when a dynamic() loader rejects. Without this, loader failures would propagate
@@ -122,9 +125,14 @@ function flushPreloads() {
 	return Promise.all(pending);
 }
 function dynamic(dynamicInput, options) {
-	const { loader: dynamicLoader, loadableGenerated, loading: LoadingComponent, modules, ssr = true } = normalizeDynamicOptions(dynamicInput, options);
+	const normalizedOptions = normalizeDynamicOptions(dynamicInput, options);
+	const { loader: dynamicLoader, loadableGenerated, loading: LoadingComponent, ssr = true } = normalizedOptions;
+	if (dynamicLoader && typeof dynamicLoader === "object" && !(dynamicLoader instanceof Promise)) throw new Error("next/dynamic loader maps are not supported by vinext");
 	const loader = dynamicLoader ? normalizeLoader(dynamicLoader) : () => Promise.resolve(() => null);
-	const preloadModuleIds = loadableGenerated?.modules ?? modules;
+	const generatedModules = loadableGenerated?.modules;
+	const optionModules = normalizedOptions.modules;
+	const configuredModules = generatedModules ?? optionModules;
+	const preloadModuleIds = typeof configuredModules === "function" ? Object.keys(configuredModules()) : configuredModules;
 	if (!ssr) {
 		if (isServer) {
 			const SSRFalse = (_props) => LoadingComponent ? React.createElement(LoadingComponent, createDynamicLoadingProps()) : null;
@@ -138,7 +146,7 @@ function dynamic(dynamicInput, options) {
 			React.useEffect(() => setMounted(true), []);
 			if (!mounted) return LoadingComponent ? React.createElement(LoadingComponent, createDynamicLoadingProps({ retry })) : null;
 			const fallback = LoadingComponent ? React.createElement(LoadingComponent, createDynamicLoadingProps({ retry })) : null;
-			const lazyElement = React.createElement(LazyComponent, props);
+			const lazyElement = createElementWithProps(LazyComponent, props);
 			let content = lazyElement;
 			if (LoadingComponent) {
 				const ErrorBoundary = getDynamicErrorBoundary();
@@ -157,8 +165,7 @@ function dynamic(dynamicInput, options) {
 		if (typeof React.lazy !== "function") {
 			const AsyncServerDynamic = async (props) => {
 				const mod = await loader();
-				const Component = "default" in mod ? mod.default : mod;
-				return React.createElement(Component, props);
+				return createElementWithProps("default" in mod ? mod.default : mod, props);
 			};
 			AsyncServerDynamic.displayName = "DynamicAsyncServer";
 			return AsyncServerDynamic;
@@ -166,7 +173,7 @@ function dynamic(dynamicInput, options) {
 		const LazyServer = createLazyComponent(loader);
 		const ServerDynamic = (props) => {
 			const fallback = LoadingComponent ? React.createElement(LoadingComponent, createDynamicLoadingProps()) : null;
-			const lazyElement = React.createElement(LazyServer, props);
+			const lazyElement = createElementWithProps(LazyServer, props);
 			let content = lazyElement;
 			if (LoadingComponent) {
 				const ErrorBoundary = getDynamicErrorBoundary();
@@ -185,7 +192,7 @@ function dynamic(dynamicInput, options) {
 	const ClientDynamic = (props) => {
 		const { LazyComponent, retry, retryKey } = useRetryableLazyComponent(loader, InitialLazyComponent);
 		const fallback = LoadingComponent ? React.createElement(LoadingComponent, createDynamicLoadingProps({ retry })) : null;
-		const lazyElement = React.createElement(LazyComponent, props);
+		const lazyElement = createElementWithProps(LazyComponent, props);
 		let content = lazyElement;
 		if (LoadingComponent) {
 			const ErrorBoundary = getDynamicErrorBoundary();
@@ -200,5 +207,19 @@ function dynamic(dynamicInput, options) {
 	ClientDynamic.displayName = "DynamicClient";
 	return ClientDynamic;
 }
+function noSSR(LoadableInitializer, loadableOptions) {
+	delete loadableOptions.webpack;
+	delete loadableOptions.modules;
+	if (!isServer) return LoadableInitializer(loadableOptions);
+	const Loading = loadableOptions.loading;
+	const NoSSR = () => React.createElement(Loading, {
+		error: null,
+		isLoading: true,
+		pastDelay: false,
+		timedOut: false
+	});
+	NoSSR.displayName = "NoSSR";
+	return NoSSR;
+}
 //#endregion
-export { dynamic as default, flushPreloads };
+export { dynamic as default, flushPreloads, noSSR };

package/dist/shims/error.d.ts

@@ -27,7 +27,7 @@ declare class ErrorComponent<P = {}> extends React.Component<P & ErrorProps> {
   render(): React.ReactElement;
 }
 type ErrorInfo = {
-  error: unknown;
+  error: Error;
   reset: () => void;
   unstable_retry: () => void;
 };

package/dist/shims/error.js

@@ -119,7 +119,7 @@ var _CatchError = class extends React.Component {
 		if (this.state.error) {
 			const Fallback = this.props.fallback;
 			const errorInfo = {
-				error: this.state.error.thrownValue,
+				error: this.state.error.thrownValue instanceof Error ? this.state.error.thrownValue : new Error(String(this.state.error.thrownValue)),
 				reset: this.reset,
 				unstable_retry: this.unstable_retry
 			};

package/dist/shims/fetch-cache.js

@@ -3,7 +3,7 @@ import { getRequestContext, isInsideUnifiedScope, runWithUnifiedStateMutation }
 import { getRequestExecutionContext } from "./request-context.js";
 import { getDataCacheHandler } from "./cache-handler.js";
 import { markDynamicUsage } from "./headers.js";
-import { _setRequestScopedCacheLife } from "./cache-request-state.js";
+import { _hasPendingRevalidatedTag, _setRequestScopedCacheLife } from "./cache-request-state.js";
 import { encodeCacheTags } from "../utils/encode-cache-tag.js";
 //#region src/shims/fetch-cache.ts
 /**
@@ -639,13 +639,22 @@ function createPatchedFetch() {
 			throw err;
 		}
 		const handler = getDataCacheHandler();
+		let mustBypassPendingRevalidation = _hasPendingRevalidatedTag([...tags, ...softTags]);
 		try {
-			const cached = await handler.get(cacheKey, {
+			let cached = mustBypassPendingRevalidation ? null : await handler.get(cacheKey, {
 				kind: "FETCH",
 				tags,
 				softTags,
 				revalidate: revalidateSeconds
 			});
+			if (cached?.value?.kind === "FETCH" && _hasPendingRevalidatedTag([
+				...cached.value.tags ?? [],
+				...tags,
+				...softTags
+			])) {
+				mustBypassPendingRevalidation = true;
+				cached = null;
+			}
 			if (cached?.value && cached.value.kind === "FETCH" && cached.cacheState !== "stale") {
 				await lowerFetchCacheRevalidateIfNeeded(handler, cacheKey, cached.value, tags, revalidateSeconds);
 				const cachedData = cached.value.data;
@@ -679,7 +688,7 @@ function createPatchedFetch() {
 		} catch (cacheErr) {
 			console.error("[vinext] fetch cache read error:", cacheErr);
 		}
-		const response = await dedupeFetch(input, fetchInit);
+		const response = await (mustBypassPendingRevalidation ? originalFetch(input, fetchInit) : dedupeFetch(input, fetchInit));
 		const cacheValue = await buildFetchCacheValue(response, tags, revalidateSeconds);
 		if (cacheValue) handler.set(cacheKey, cacheValue, {
 			fetchCache: true,

package/dist/shims/font-google-base.d.ts

@@ -1,7 +1,8 @@
 import { FontStyle } from "./font-utils.js";
 
 //#region src/shims/font-google-base.d.ts
-type FontOptions = {
+type CssVariable = `--${string}`;
+type FontOptions<T extends CssVariable | undefined = CssVariable | undefined> = {
   weight?: string | string[];
   style?: string | string[];
   subsets?: string[];
@@ -9,7 +10,7 @@ type FontOptions = {
   preload?: boolean;
   fallback?: string[];
   adjustFontFallback?: boolean | string;
-  variable?: string;
+  variable?: T;
   axes?: string[];
 };
 type FontResult = {
@@ -24,7 +25,7 @@ type InternalGoogleFontRuntimeOptions = {
   fontWeight?: number;
   fontStyle?: "normal" | "italic";
 };
-type FontLoaderOptions = FontOptions & {
+type FontLoaderOptions<T extends CssVariable | undefined = CssVariable | undefined> = FontOptions<T> & {
   /**
    * Internal payload injected by the vinext:google-fonts transform after
    * metadata validation. Runtime must prefer these values over user options
@@ -76,7 +77,13 @@ declare function getSSRFontPreloads(): Array<{
   href: string;
   type: string;
 }>;
-type FontLoader = (options?: FontLoaderOptions) => FontResult;
+type NextFont = Omit<FontResult, "variable"> & {
+  variable?: undefined;
+};
+type NextFontWithVariable = Omit<NextFont, "variable"> & {
+  variable: string;
+};
+type FontLoader = <T extends CssVariable | undefined = undefined>(options?: FontLoaderOptions<T>) => T extends undefined ? NextFont : NextFontWithVariable;
 declare function createFontLoader(family: string): FontLoader;
 declare const googleFonts: Record<string, FontLoader>;
 //#endregion

package/dist/shims/font-local.d.ts

@@ -6,14 +6,15 @@ type LocalFontSrc = {
   weight?: string;
   style?: string;
 };
-type LocalFontOptions = {
+type CssVariable = `--${string}`;
+type LocalFontOptions<T extends CssVariable | undefined = CssVariable | undefined> = {
   src: string | LocalFontSrc | LocalFontSrc[];
   display?: string;
   weight?: string;
   style?: string;
   fallback?: string[];
   preload?: boolean;
-  variable?: string;
+  variable?: T;
   adjustFontFallback?: boolean | string;
   declarations?: Array<{
     prop: string;
@@ -30,6 +31,12 @@ type FontResult = {
   style: FontStyle;
   variable?: string;
 };
+type NextFont = Omit<FontResult, "variable"> & {
+  variable?: undefined;
+};
+type NextFontWithVariable = Omit<NextFont, "variable"> & {
+  variable: string;
+};
 /**
  * Get collected SSR font styles (used by the renderer).
  * Note: We don't clear the arrays because fonts are loaded at module import
@@ -45,6 +52,6 @@ declare function getSSRFontPreloads(): Array<{
   href: string;
   type: string;
 }>;
-declare function localFont(options: LocalFontOptions): FontResult;
+declare function localFont<T extends CssVariable | undefined = undefined>(options: LocalFontOptions<T>): T extends undefined ? NextFont : NextFontWithVariable;
 //#endregion
 export { localFont as default, getSSRFontPreloads, getSSRFontStyles };

package/dist/shims/head.d.ts

@@ -28,6 +28,17 @@ declare function resetSSRHead(): void;
  * Pass an empty array (or simply don't call this) to skip the merge.
  */
 declare function setDocumentInitialHead(head: React.ReactNode[]): void;
+/**
+ * Default head tags emitted alongside every Pages Router render — charset
+ * first, then viewport. Mirrors Next.js's `defaultHead()` in
+ * `packages/next/src/shared/lib/head.tsx`, which seeds the head array used
+ * by `HeadManagerContext` before any user `<Head>` reduces over it.
+ *
+ * The canonical Next.js order is `<meta charset>` then `<meta viewport>`
+ * then user tags, all with `data-next-head=""`. See assertion in
+ * `test/e2e/next-head/index.test.ts`.
+ */
+declare function defaultHead(): React.ReactElement[];
 /** Get collected head HTML. Call after render. */
 declare function getSSRHeadHTML(): string;
 type HeadDOMElement = Pick<HTMLElement, "innerHTML" | "setAttribute" | "textContent">;
@@ -68,6 +79,6 @@ declare function _applyHeadPropsToElement(domEl: HeadDOMElement, props: Record<s
 declare function _syncClientHead(): void;
 declare function Head({
   children
-}: HeadProps): null;
+}: HeadProps): React.ReactElement;
 //#endregion
-export { _applyHeadPropsToElement, _clientHeadChildren, _registerHeadStateAccessors, _syncClientHead, Head as default, escapeAttr, escapeInlineContent, getSSRHeadHTML, isSafeAttrName, reduceHeadChildren, resetSSRHead, setDocumentInitialHead };
+export { _applyHeadPropsToElement, _clientHeadChildren, _registerHeadStateAccessors, _syncClientHead, Head as default, defaultHead, escapeAttr, escapeInlineContent, getSSRHeadHTML, isSafeAttrName, reduceHeadChildren, resetSSRHead, setDocumentInitialHead };

package/dist/shims/head.js

@@ -323,7 +323,7 @@ function Head({ children }) {
 	if (headInstanceIdRef.current === null) headInstanceIdRef.current = Symbol("vinext-head");
 	if (typeof window === "undefined") {
 		_getSSRHeadChildren().push(children);
-		return null;
+		return React.createElement(React.Fragment);
 	}
 	useEffect(() => {
 		const instanceId = headInstanceIdRef.current;
@@ -334,7 +334,7 @@ function Head({ children }) {
 			_syncClientHead();
 		};
 	}, [children]);
-	return null;
+	return React.createElement(React.Fragment);
 }
 //#endregion
-export { _applyHeadPropsToElement, _clientHeadChildren, _registerHeadStateAccessors, _syncClientHead, Head as default, escapeAttr, escapeInlineContent, getSSRHeadHTML, isSafeAttrName, reduceHeadChildren, resetSSRHead, setDocumentInitialHead };
+export { _applyHeadPropsToElement, _clientHeadChildren, _registerHeadStateAccessors, _syncClientHead, Head as default, defaultHead, escapeAttr, escapeInlineContent, getSSRHeadHTML, isSafeAttrName, reduceHeadChildren, resetSSRHead, setDocumentInitialHead };

package/dist/shims/headers.d.ts

@@ -1,4 +1,6 @@
 import { RenderRequestApiKind } from "../server/cache-proof.js";
+import { ReadonlyRequestCookies } from "@vinext/types/next/upstream/dist/server/web/spec-extension/adapters/request-cookies";
+import { ResponseCookie } from "@vinext/types/next/upstream/dist/compiled/@edge-runtime/cookies/index";
 
 //#region src/shims/headers.d.ts
 type HeadersContext = {
@@ -27,6 +29,8 @@ type VinextHeadersShimState = {
   phase: HeadersAccessPhase;
 };
 type ConnectionProbeState = {
+  active: boolean;
+  dynamicUsageTarget: VinextHeadersShimState;
   interrupted: boolean;
   interrupt: () => void;
   pending: Promise<never>;
@@ -47,6 +51,16 @@ type ConnectionProbeResult<T> = {
  * Called by connection(), cookies(), headers(), and noStore().
  */
 declare function markDynamicUsage(): void;
+/**
+ * Measure dynamic usage in a child async scope without clearing the parent.
+ * Concurrent work that already belongs to the request (such as deferred
+ * metadata) keeps writing to the parent state and therefore remains visible
+ * to the final cache policy.
+ */
+declare function runWithIsolatedDynamicUsage<T>(fn: () => T | Promise<T>): Promise<{
+  result: T;
+  dynamicDetected: boolean;
+}>;
 declare function markRenderRequestApiUsage(kind: RenderRequestApiKind): void;
 declare function throwIfStaticGenerationAccessError(): void;
 declare function runWithConnectionProbe<T>(fn: () => T | Promise<T>): Promise<ConnectionProbeResult<T>>;
@@ -162,11 +176,8 @@ declare function headersContextFromRequest(request: Request, options?: HeadersCo
  * the context is already available).
  */
 declare function headers(): Promise<Headers> & Headers;
-/**
- * Cookie jar from the incoming request.
- * Returns a ReadonlyRequestCookies-like object.
- */
-declare function cookies(): Promise<RequestCookies> & RequestCookies;
+type VinextReadonlyRequestCookies = Omit<ReadonlyRequestCookies, keyof RequestCookies> & RequestCookies;
+declare function cookies(): Promise<VinextReadonlyRequestCookies> & VinextReadonlyRequestCookies;
 /** Accumulated Set-Cookie headers from cookies().set() / .delete() calls */
 /**
  * Get and clear all pending Set-Cookie headers generated by cookies().set()/delete().
@@ -179,6 +190,12 @@ declare function getAndClearPendingCookies(): string[];
  */
 declare function getDraftModeCookieHeader(): string | null;
 declare function isDraftModeRequest(request: Request, draftModeSecret: string): boolean;
+/**
+ * Read draft mode from the live request context without recording request API
+ * usage. `null` means there is no active request context, which lets framework
+ * callers fall back to an explicitly supplied request when needed.
+ */
+declare function getActiveDraftModeState(): boolean | null;
 /**
  * Read the active request's draft-mode state without recording request API usage.
  * Internal cache implementations use this to bypass persistent reads and writes,
@@ -223,39 +240,19 @@ declare class RequestCookies {
    * Set a cookie. In Route Handlers and Server Actions, this produces
    * a Set-Cookie header on the response.
    */
-  set(nameOrOptions: string | {
-    name: string;
-    value: string;
-    path?: string;
-    domain?: string;
-    maxAge?: number;
-    expires?: Date;
-    httpOnly?: boolean;
-    secure?: boolean;
-    sameSite?: "Strict" | "Lax" | "None";
-  }, value?: string, options?: {
-    path?: string;
-    domain?: string;
-    maxAge?: number;
-    expires?: Date;
-    httpOnly?: boolean;
-    secure?: boolean;
-    sameSite?: "Strict" | "Lax" | "None";
-  }): this;
+  set(options: ResponseCookie): this;
+  set(key: string, value: string, cookie?: Partial<ResponseCookie>): this;
   /**
    * Delete a cookie by emitting an expired Set-Cookie header.
    */
-  delete(nameOrOptions: string | {
-    name: string;
-    path?: string;
-    domain?: string;
-  }): this;
+  delete(name: string): this;
+  delete(options: Omit<ResponseCookie, "value" | "expires">): this;
   get size(): number;
-  [Symbol.iterator](): IterableIterator<[string, {
+  [Symbol.iterator](): MapIterator<[string, {
     name: string;
     value: string;
   }]>;
   toString(): string;
 }
 //#endregion
-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 };
+export { HeadersAccessPhase, HeadersContext, type RequestCookies, VinextHeadersShimState, applyMiddlewareRequestHeaders, consumeDynamicUsage, consumeInvalidDynamicUsageError, consumeRenderRequestApiUsage, cookies, draftMode, getActiveDraftModeState, getAndClearPendingCookies, getDraftModeCookieHeader, getHeadersAccessPhase, getHeadersContext, headers, headersContextFromRequest, isDraftModeEnabled, isDraftModeRequest, markDynamicUsage, markRenderRequestApiUsage, peekDynamicUsage, peekRenderRequestApiUsage, runWithConnectionProbe, runWithHeadersContext, runWithIsolatedDynamicUsage, setHeadersAccessPhase, setHeadersContext, suspendConnectionProbe, throwIfInsideCacheScope, throwIfStaticGenerationAccessError };