@wular/pnext 0.0.19 → 0.0.21

package/src/compat/react/style-values.ts

@@ -0,0 +1,68 @@
+// React's dangerousStyleValue, which preact does not implement: a numeric 0 is unitless for EVERY
+// property, booleans render nothing at all, and React's unitless set is wider than preact's (aspect
+// ratio, columns, grid placement, scale, font weight). preact appends `px` in each of those cases, so
+// the same style object serializes differently from React's - `width:0px` where React writes `width:0`.
+// Numbers are resolved to React's exact string in the vnode pass, before preact (DOM setStyle or
+// render-to-string) ever formats them, so both the served markup and the hydrated DOM match React.
+//
+// Not gated on the react-compat flag like ./parity's passes: this changes how a value the app already
+// wrote is spelled, never what it means, and pnext's own render API is React-shaped either way.
+import { options, type VNode } from 'preact'
+
+// A space-delimited string rather than a Set: same lookup for a list this size, no construction at
+// module init, and fewer bytes in every client bundle that ships the shim.
+const UNITLESS =
+  ' animationIterationCount aspectRatio borderImageOutset borderImageSlice borderImageWidth boxFlex' +
+  ' boxFlexGroup boxOrdinalGroup columnCount columns flex flexGrow flexPositive flexShrink flexNegative' +
+  ' flexOrder fontWeight gridArea gridColumn gridColumnEnd gridColumnSpan gridColumnStart gridRow' +
+  ' gridRowEnd gridRowSpan gridRowStart lineClamp lineHeight opacity order orphans scale tabSize widows' +
+  ' zIndex zoom fillOpacity floodOpacity stopOpacity strokeDasharray strokeDashoffset strokeMiterlimit' +
+  ' strokeOpacity strokeWidth '
+
+// React registers a vendor-prefixed twin of every unitless property; unprefixing the name keeps the
+// list at one entry per property instead of five.
+const VENDOR_PREFIX = /^(?:Webkit|Moz|ms|O)(?=[A-Z])/
+
+function unitless(name: string) {
+  if (UNITLESS.includes(` ${name} `)) return true
+  const base = name.replace(VENDOR_PREFIX, '')
+  return base !== name && UNITLESS.includes(` ${base[0]!.toLowerCase()}${base.slice(1)} `)
+}
+
+/** React's spelling of one style value, or undefined when preact already agrees. */
+export function reactStyleValue(name: string, value: unknown): string | undefined {
+  // React drops boolean declarations entirely; an empty string is what drops them in preact.
+  if (typeof value === 'boolean') return ''
+  if (typeof value !== 'number') return undefined
+  if (value !== 0 && !name.startsWith('--') && !unitless(name)) return undefined
+  return String(value)
+}
+
+export function applyReactStyleValues(vnode: VNode): void {
+  if (typeof vnode.type !== 'string') return
+  const props = vnode.props as Record<string, unknown> | null
+  const style = props?.style
+  if (!style || typeof style !== 'object' || Array.isArray(style)) return
+
+  // The app's object is never mutated - it may be a module-level constant reused across renders.
+  let normalized: Record<string, unknown> | undefined
+  for (const name in style) {
+    const resolved = reactStyleValue(name, (style as Record<string, unknown>)[name])
+    if (resolved === undefined) continue
+    normalized ??= { ...style }
+    normalized[name] = resolved
+  }
+  if (normalized) props.style = normalized
+}
+
+const installed = Symbol.for('pnext.react-style-values-installed')
+const styleOptions = options as typeof options & { [installed]?: true }
+
+if (!styleOptions[installed]) {
+  const previousVNode = options.vnode?.bind(options)
+  options.vnode = vnode => {
+    previousVNode?.(vnode)
+    applyReactStyleValues(vnode)
+  }
+  styleOptions[installed] = true
+}

package/src/compat/register/proxy.ts

@@ -8,6 +8,7 @@ import { recordRewrite } from '../protocol'
 import { recordCanonicalUrl } from '../next/canonical-url'
 import { getNextConfig } from '../next/config-loader'
 import { activateTestProxy } from '../lifecycle/testmode'
+import { legacyRequestAPIs } from '../../request/context'
 
 export function registerProxyExtensions(_config: ResolvedConfig): void {
   setProxyResponseProtocol({
@@ -72,7 +73,8 @@ async function validateNextProxyFiles(config: ResolvedConfig) {
       `Both middleware file "${relativeProxyPath(config, middleware)}" and proxy file "${relativeProxyPath(config, proxy)}" are detected. Please use "${relativeProxyPath(config, proxy)}" only.`,
     )
   }
-  if (middleware && !proxy) {
+  // Proxy is a Next 16 migration; legacy request APIs explicitly target the middleware era.
+  if (middleware && !proxy && !legacyRequestAPIs()) {
     console.warn('The "middleware" file convention is deprecated. Please use "proxy" instead.')
   }
   await Promise.all(files.map(file => validateNextProxyFile(config, file)))

package/src/compat/register/render.ts

@@ -41,6 +41,7 @@ import { invokeServerComponentWithUse } from '../react/server-component-use'
 import {
   fontAssets,
   fontPreloadDomScript,
+  fontSizeAdjustMeta,
   prewarmFonts,
   runWithFontScope,
 } from '../next/font/runtime'
@@ -52,10 +53,11 @@ import {
 } from '../metadata'
 import { aliasGenerateStaticParams } from '../static-params'
 import { getNextConfig } from '../next/config-loader'
+import { withSyncProps } from '../next/legacy-request-apis'
 import { renderServerInsertedHTML, setServerInsertedHTMLScope } from '../react/server-inserted-html'
 import { nextClientRouteState } from '../next/route-state'
 import { earlySubmitCaptureScript } from '../actions/early-submit'
-import { getWorkUnit } from '../../request/context'
+import { getWorkUnit, legacyRequestAPIs } from '../../request/context'
 import {
   createVaryParamsAccumulator,
   createVaryingParams,
@@ -102,6 +104,7 @@ export function registerRenderExtensions(config: ResolvedConfig): void {
     setRenderExtensions({
       clientRouteState: nextClientRouteState,
       trackVaryParams: trackRenderVaryParams,
+      legacySyncProps: withSyncProps,
       // Next asserts structural selectors (`body > p`) against the live DOM, so
       // island hosts and the page slot travel as comment pairs and the inline
       // bootstrap materializes them. Core ships the elements as final.
@@ -117,8 +120,9 @@ export function registerRenderExtensions(config: ResolvedConfig): void {
     })
     setDocumentScriptExtensions({
       documentBodyScripts: cfg =>
-        `${flightDataBootstrapScript()}${renderPartytownHeadScripts()}${basePathScript(cfg.basePath)}${trailingSlashScript(cfg.trailingSlash)}${skipTrailingSlashScript(cfg.skipTrailingSlashRedirect)}${staleTimesScript()}${segmentSchedulerScript()}${appShellsScript()}${optimisticRoutingScript()}${nextRouterShimScript()}<script>${earlySubmitCaptureScript()}</script>${fontPreloadDomScript()}`,
-      documentHeadTags: () => `${polyfillsScript(config)}${renderServerInsertedHTML()}`,
+        `${flightDataBootstrapScript()}${renderPartytownHeadScripts()}${basePathScript(cfg.basePath)}${trailingSlashScript(cfg.trailingSlash)}${skipTrailingSlashScript(cfg.skipTrailingSlashRedirect)}${staleTimesScript()}${segmentSchedulerScript()}${legacySyncPropsScript()}${appShellsScript()}${optimisticRoutingScript()}${nextRouterShimScript()}<script>${earlySubmitCaptureScript()}</script>${fontPreloadDomScript()}`,
+      documentHeadTags: () =>
+        `${polyfillsScript(config)}${fontSizeAdjustMeta()}${renderServerInsertedHTML()}`,
       streamInsertedHTML: renderServerInsertedHTML,
     })
   }
@@ -227,6 +231,13 @@ function segmentSchedulerScript(): string {
 // per params-reading route to prime that route's shared App Shell (compat/
 // client/segment-prefetch.ts). Strictly opt-in — without the flag the extra
 // request would break the request-count contracts of every other suite.
+// Under compat.next.legacyRequestAPIs the server's params/searchParams promises also carry the
+// resolved object's own keys (withSyncProps). Those keys cannot travel on the wire, so the client
+// rebuilds them - but only if it knows the surface existed, or a strict app would grow one.
+function legacySyncPropsScript(): string {
+  return legacyRequestAPIs() ? `<script>window.__PNEXT_SYNC_PROPS__=1;</script>` : ''
+}
+
 function appShellsScript(): string {
   const experimental = getNextConfig().experimental as { appShells?: unknown } | undefined
   return experimental?.appShells === true

package/src/compat/register/routing.ts

@@ -235,11 +235,14 @@ function maskSource(source: string): string {
 
 // A source that declares a server action needs the client action runtime, even
 // when the <form> itself lives in a client component the page hands the action
-// to. Matched on the RAW source: stripComments also blanks string literals,
-// which would erase the directive being looked for.
+// to. Preserve string literals so module and inline directives remain visible,
+// but discard comments: framework/user documentation mentioning `'use server'`
+// is not executable and must not pull the action runtime into every importing route.
 function usesServerActionForm(source: string): boolean {
-  if (source.includes('use server') && /(['"])use server\1/.test(source)) return true
-  return usesClientFunctionFormAction(source)
+  return (
+    (source.includes('use server') && /(['"])use server\1/.test(stripComments(source))) ||
+    usesClientFunctionFormAction(source)
+  )
 }
 
 // React runs a FUNCTION passed to `<form action>` / `<button formAction>` on the client with the form's
@@ -408,6 +411,53 @@ const stripCommentsAndStrings = memoizeBySource(source =>
   stripComments(source).replace(/(['"`])(?:\\[\s\S]|(?!\1)[^\\])*\1/g, ''),
 )
 
-const stripComments = memoizeBySource(source =>
-  source.replace(/\/\*[\s\S]*?\*\//g, '').replace(/(^|[^:])\/\/.*$/gm, '$1'),
-)
+// Keep literal contents intact: consumers use this to find directive literals
+// and import specifiers. A regex-only stripper mistakes the second slash in
+// `"https://..."` for a line comment, erasing every real directive later on
+// that line or below it. Scan the lexical states instead, so every source
+// shape follows the same rule.
+const stripComments = memoizeBySource(source => {
+  const chars = [...source]
+  let quote: string | undefined
+  let lineComment = false
+  let blockComment = false
+  for (let index = 0; index < chars.length; index++) {
+    const char = chars[index]!
+    const next = chars[index + 1]
+    if (lineComment) {
+      if (char === '\n') lineComment = false
+      else chars[index] = ' '
+      continue
+    }
+    if (blockComment) {
+      chars[index] = char === '\n' ? '\n' : ' '
+      if (char === '*' && next === '/') {
+        chars[index + 1] = ' '
+        blockComment = false
+        index++
+      }
+      continue
+    }
+    if (quote) {
+      if (char === '\\') index++
+      else if (char === quote) quote = undefined
+      continue
+    }
+    if (char === '"' || char === "'" || char === '`') {
+      quote = char
+      continue
+    }
+    if (char === '/' && next === '/') {
+      chars[index] = chars[index + 1] = ' '
+      lineComment = true
+      index++
+      continue
+    }
+    if (char === '/' && next === '*') {
+      chars[index] = chars[index + 1] = ' '
+      blockComment = true
+      index++
+    }
+  }
+  return chars.join('')
+})

package/src/compat/register/typed-routes.ts

@@ -11,7 +11,6 @@ import {
 } from '../../extensions'
 import type { RouteManifestEntry } from '../../types'
 import { nextCompatEnabled } from '../aliases'
-import { writeTsconfigDefaults } from '../tsconfig-defaults'
 import { typecheckDisabled, validateTypesOffThread } from '../typecheck/check'
 import { generateTypedRoutes } from '../typed-routes/generate'
 
@@ -21,7 +20,6 @@ export function registerTypedRoutesExtensions(_config: ResolvedConfig): void {
 
 async function runTypedRoutesBuildStep(ctx: BuildStepContext): Promise<void> {
   if (!nextCompatEnabled(ctx.config)) return
-  await writeTsconfigDefaults(ctx.config)
   await generateTypedRoutes(ctx.config, ctx.routes as RouteManifestEntry[])
   // The typecheck reads only files that already exist on disk, so it runs on a worker thread
   // alongside client bundling and prerendering rather than ahead of them; the CLI awaits it before

package/src/compat/tsconfig-defaults.ts

@@ -144,7 +144,11 @@ function getDesiredCompilerOptions(
       ? {}
       : { isolatedModules: { value: true, reason: 'requirement for SWC / Babel' } }),
     jsx: {
+      // A missing value follows Next's automatic-runtime default, while an app
+      // that explicitly owns JSX emission keeps preserve. PNext's private
+      // typecheck project can analyze either without rewriting user intent.
       parsedValue: 'react-jsx',
+      parsedValues: ['preserve', 'react-jsx'],
       value: 'react-jsx',
       reason: 'next.js uses the React automatic runtime',
     },

package/src/compat/typecheck/check.ts

@@ -42,6 +42,7 @@ export function typecheckDisabled(): boolean {
 export interface TypecheckWorkerInput {
   root: string
   outPath: string
+  compat: ResolvedConfig['compat']
   nextConfig: NextConfigObject
 }
 
@@ -63,6 +64,7 @@ export async function validateTypesOffThread(config: ResolvedConfig): Promise<vo
   const input: TypecheckWorkerInput = {
     root: config.root,
     outPath: config.outPath,
+    compat: config.compat,
     nextConfig: cloneable({
       typescript: next.typescript,
       typedRoutes: next.typedRoutes,
@@ -300,10 +302,13 @@ async function writeTypecheckProject(
   // `next/*` shims would shadow those and mask the typed-route errors the suite asserts. When the real next
   // package is resolvable from the app, drop the next-module shims and let real next plus the generated
   // files drive the check - exactly what `next build` does.
-  const omitNextModuleShims = typedRoutesEnabled() && realNextResolvable(config.root)
+  const hasRealNext = realNextResolvable(config.root)
+  const omitNextModuleShims = typedRoutesEnabled() && hasRealNext
+  const legacyRequestTypes =
+    typeof config.compat?.next === 'object' && config.compat.next.legacyRequestAPIs === true
   await writeFile(
     path.join(dir, 'next-shims.d.ts'),
-    nextShims(hasReactTypes, rootParams, omitNextModuleShims),
+    nextShims(hasReactTypes, rootParams, omitNextModuleShims, legacyRequestTypes, hasRealNext),
   )
   const preact = resolvePackageDir('preact', config.root)
   if (reactTypes && preact) {
@@ -349,12 +354,10 @@ async function writeTypecheckProject(
           allowJs: true,
           resolveJsonModule: true,
           isolatedModules: true,
-          jsx: 'react-jsx',
-          // Runtime JSX targets Preact, but compat typechecking validates the
-          // React/Next contract: an inherited `jsxImportSource: 'preact'` would
-          // make app components return Preact VNodes, which the React validator
-          // rejects. 'react' is TS's own default for react-jsx.
-          jsxImportSource: 'react',
+          // Next owns the JSX transform and typechecks the source form. Besides
+          // matching its required tsconfig option, `preserve` keeps a legacy
+          // `import React` semantically used when noUnusedLocals is enabled.
+          jsx: 'preserve',
           // `paths` only, never `baseUrl` — TS 7 removed it (TS5102). The
           // mappings are absolutized above so they resolve the same from here.
           ...(paths ? { paths } : {}),
@@ -375,7 +378,7 @@ async function writeTypecheckProject(
           // before this typecheck. Next includes it in the program so invalid exports fail the build with a
           // constraint type error; include it here too. It lives outside the `.pnext` outPath, so its
           // diagnostics survive appDiagnostic's scoping.
-          ...(existsSync(path.join(config.root, '.next/types/validator.ts'))
+          ...(!legacyRequestTypes && existsSync(path.join(config.root, '.next/types/validator.ts'))
             ? [path.join(config.root, '.next/types/validator.ts')]
             : []),
           path.join(config.root, 'middleware.*'),
@@ -619,6 +622,8 @@ function nextShims(
   hasReactTypes: boolean,
   rootParams: Map<string, Set<RootParamValueType>>,
   omitNextModuleShims = false,
+  legacyRequestTypes = false,
+  hasRealNext = false,
 ): string {
   // Ambient module declarations override real module resolution, so the react
   // fallbacks below must only exist when no real `@types/react` was found —
@@ -653,6 +658,16 @@ declare module 'react/jsx-runtime' {
   export const jsxs: any
   export const Fragment: any
 }
+`
+  const requestType = (type: string) =>
+    legacyRequestTypes ? `Promise<${type}> & ${type}` : `Promise<${type}>`
+  const requestShims = `declare module 'next/headers'{interface CookieSetOptions{name?:string;value?:string;path?:string;maxAge?:number;expires?:Date|number;httpOnly?:boolean;secure?:boolean;sameSite?:'strict'|'lax'|'none'|boolean;domain?:string}interface CookieStore{get(name:string):{name:string;value:string}|undefined;get(options:{name:string;value?:string}):{name:string;value:string}|undefined;getAll(name?:string):{name:string;value:string}[];getAll(options:{name:string;value?:string}):{name:string;value:string}[];has(name:string):boolean;readonly size:number;set(name:string,value:string,options?:CookieSetOptions):CookieStore;set(options:CookieSetOptions):CookieStore;delete(name:string):boolean;clear():CookieStore;[Symbol.iterator]():IterableIterator<readonly[string,{name?:string;value:string}]>}export function cookies():${requestType('CookieStore')};export function headers():${requestType('Headers')};export function draftMode():${requestType(`{isEnabled:boolean;enable():void;disable():void}`)}}
+`
+  const fontShims = hasRealNext
+    ? ''
+    : `declare module 'next/font'{export interface FontModule{className:string;style:{fontFamily:string;fontWeight?:number;fontStyle?:string};variable:string}}
+declare module 'next/font/local'{import type{FontModule}from'next/font';export default function localFont(options:any):FontModule}
+declare module 'next/font/google'{import type{FontModule}from'next/font';type FontLoader=(options?:any)=>FontModule;const font:FontLoader;export default font;export const Inter:FontLoader,Geist:FontLoader,Geist_Mono:FontLoader,Roboto:FontLoader,Roboto_Mono:FontLoader,Open_Sans:FontLoader,Lato:FontLoader,Montserrat:FontLoader,Poppins:FontLoader,Noto_Sans:FontLoader}
 `
   const source = `${reactShims}
 declare const process: {
@@ -831,39 +846,7 @@ declare module 'next/cache' {
   export const unstable_cacheLife: (...args: any[]) => void
 }
 
-declare module 'next/headers' {
-  interface CookieSetOptions {
-    name?: string
-    value?: string
-    path?: string
-    maxAge?: number
-    expires?: Date | number
-    httpOnly?: boolean
-    secure?: boolean
-    sameSite?: 'strict' | 'lax' | 'none' | boolean
-    domain?: string
-  }
-  interface CookieStore {
-    get(name: string): { name: string; value: string } | undefined
-    get(options: { name: string; value?: string }): { name: string; value: string } | undefined
-    getAll(name?: string): { name: string; value: string }[]
-    getAll(options: { name: string; value?: string }): { name: string; value: string }[]
-    has(name: string): boolean
-    readonly size: number
-    set(name: string, value: string, options?: CookieSetOptions): CookieStore
-    set(options: CookieSetOptions): CookieStore
-    delete(name: string): boolean
-    clear(): CookieStore
-    [Symbol.iterator](): IterableIterator<readonly [string, { name?: string; value: string }]>
-  }
-  export function cookies(): Promise<CookieStore>
-  export function headers(): Promise<Headers>
-  export function draftMode(): Promise<{
-    isEnabled: boolean
-    enable(): void
-    disable(): void
-  }>
-}
+${requestShims}
 
 declare module 'next/server' {
   interface NextURL extends URL {
@@ -1096,35 +1079,7 @@ declare module 'next/error' {
   ): ComponentType<P & { children?: ReactNode; clearError?: () => void }>
 }
 
-declare module 'next/font' {
-  export interface FontModule {
-    className: string
-    style: { fontFamily: string; fontWeight?: number; fontStyle?: string }
-    variable: string
-  }
-}
-
-declare module 'next/font/local' {
-  import type { FontModule } from 'next/font'
-  export default function localFont(options: any): FontModule
-}
-
-declare module 'next/font/google' {
-  import type { FontModule } from 'next/font'
-  type FontLoader = (options?: any) => FontModule
-  const font: FontLoader
-  export default font
-  export const Inter: FontLoader
-  export const Geist: FontLoader
-  export const Geist_Mono: FontLoader
-  export const Roboto: FontLoader
-  export const Roboto_Mono: FontLoader
-  export const Open_Sans: FontLoader
-  export const Lato: FontLoader
-  export const Montserrat: FontLoader
-  export const Poppins: FontLoader
-  export const Noto_Sans: FontLoader
-}
+${fontShims}
 
 declare module 'next/script' {
   import type { ComponentType } from 'react'

package/src/compat/typecheck/worker.ts

@@ -11,11 +11,12 @@ import { PnextTypecheckError, validateTypes } from './check'
 import type { TypecheckWorkerInput, TypecheckWorkerResult } from './check'
 
 const input = workerData as TypecheckWorkerInput
-setNextConfig(input.nextConfig)
+const { nextConfig, ...config } = input
+setNextConfig(nextConfig)
 
 let result: TypecheckWorkerResult
 try {
-  await validateTypes({ root: input.root, outPath: input.outPath } as ResolvedConfig)
+  await validateTypes(config as ResolvedConfig)
   result = { ok: true }
 } catch (error) {
   result =

package/src/compat/validation/validate.ts

@@ -15,6 +15,7 @@ import path from 'node:path'
 import type { ResolvedConfig } from '../../config'
 import { extraPageExtensions } from '../../extensions'
 import type { RouteManifestEntry } from '../../types'
+import { legacyRequestAPIs } from '../../request/context'
 import { getNextConfig } from '../next/config-loader'
 import { stripComments } from '../../utils/code'
 import {
@@ -271,6 +272,7 @@ function warnBuildDiagnostics(config: ResolvedConfig, routes: RouteManifestEntry
     console.warn('Disabled SWC as replacement for Babel because of custom Babel configuration')
   }
   if (
+    !legacyRequestAPIs() &&
     typeof nextConfig.outputFileTracingRoot !== 'string' &&
     !(
       nextConfig.turbopack &&

package/src/compat-bootstrap.ts

@@ -20,6 +20,7 @@
 
 import type { ResolvedConfig } from './config'
 import { onExtensionHostReset } from './extensions'
+import { installFetchHostNormalization } from './runtime/fetch-host'
 
 /** True when either Next or React compatibility (or the React compiler) is on. */
 function compatEnabled(config: ResolvedConfig): boolean {
@@ -43,6 +44,8 @@ onExtensionHostReset(() => {
  * compile. No-op (and no compat code loaded) for a pure-core app.
  */
 export function bootstrapCompatBoot(config: ResolvedConfig): Promise<void> {
+  // Core Bun-vs-undici runtime shim, not compat: every app needs it, gated or not.
+  installFetchHostNormalization()
   if (!compatEnabled(config)) return Promise.resolve()
   bootRegistration ??= import('./compat/register/boot').then(module =>
     module.registerCompatBootExtensions(config),
@@ -59,6 +62,7 @@ export function bootstrapCompat(
   config: ResolvedConfig,
   options: { serve?: boolean } = {},
 ): Promise<void> {
+  installFetchHostNormalization()
   if (!compatEnabled(config)) return Promise.resolve()
   registration ??= bootstrapCompatBoot(config)
     .then(() => import('./compat/register/index'))