@wular/pnext 0.1.3 → 0.1.5

package/src/css/build.ts

@@ -4,7 +4,7 @@ import path from 'node:path'
 import type { Plugin } from 'esbuild'
 import { hashedAssetName } from '../utils/asset-hash'
 import { build } from '../utils/esbuild'
-import { ensureDir, readText } from '../utils/fs'
+import { cssModuleScopePath, ensureDir, readText } from '../utils/fs'
 import { postcssConfigFile, runPostcss } from './postcss'
 import { extraPageExtensions, getCssExtensions } from '../extensions'
 import { nextCompatEnabled } from '../render/hooks'
@@ -132,8 +132,10 @@ export function globalCssSource(config: ResolvedConfig) {
   return globalCssSources(config)[0]
 }
 
-export function globalCssSources(config: Pick<ResolvedConfig, 'root' | 'appPath'>) {
-  return globalCssSourcesForPaths(config.root, config.appPath)
+export function globalCssSources(
+  config: Pick<ResolvedConfig, 'root' | 'appPath'> & Partial<Pick<ResolvedConfig, 'workspaceRoot'>>,
+) {
+  return globalCssSourcesForPaths(config.root, config.appPath, config.workspaceRoot)
 }
 
 // The walk below reads and resolves the ROOT LAYOUT'S WHOLE IMPORT GRAPH, and every render asks it
@@ -157,8 +159,8 @@ export function setGlobalCssSourceStore(store: GlobalCssSourceStore | undefined)
   globalCssStore = store
 }
 
-export function globalCssSourcesForPaths(root: string, appPath: string) {
-  const key = `${root}\0${appPath}`
+export function globalCssSourcesForPaths(root: string, appPath: string, workspaceRoot?: string) {
+  const key = `${root}\0${appPath}\0${workspaceRoot ?? ''}`
   const cached = globalCssSourceCache.get(key)
   if (cached) return cached
 
@@ -171,7 +173,14 @@ export function globalCssSourcesForPaths(root: string, appPath: string) {
   const sources = new Set<string>()
   const visited = new Set<string>()
   const missing = new Set<string>()
-  collectGlobalCssSources(root, rootLayoutFile(appPath, missing), sources, visited, missing)
+  collectGlobalCssSources(
+    root,
+    rootLayoutFile(appPath, missing),
+    sources,
+    visited,
+    missing,
+    workspaceRoot,
+  )
 
   const resolved = [...sources].map(file => path.resolve(file))
   globalCssSourceCache.set(key, resolved)
@@ -194,6 +203,7 @@ function collectGlobalCssSources(
   sources: Set<string>,
   visited: Set<string>,
   missing?: Set<string>,
+  workspaceRoot?: string,
 ) {
   const resolvedFile = path.resolve(file)
   if (visited.has(resolvedFile)) return
@@ -204,12 +214,12 @@ function collectGlobalCssSources(
   visited.add(resolvedFile)
 
   for (const specifier of moduleSpecifiers(readFileSync(resolvedFile, 'utf8'))) {
-    const resolved = resolveImport(root, resolvedFile, specifier)
+    const resolved = resolveImport(root, resolvedFile, specifier, workspaceRoot)
     if (!resolved) continue
     if (isCssFile(resolved)) {
       sources.add(resolved)
     } else {
-      collectGlobalCssSources(root, resolved, sources, visited, missing)
+      collectGlobalCssSources(root, resolved, sources, visited, missing, workspaceRoot)
     }
   }
 }
@@ -898,13 +908,6 @@ function cssModuleClassName(file: string, className: string) {
   return `${base}_${className}_${hash}`
 }
 
-function cssModuleScopePath(file: string) {
-  const normalized = file.split(path.sep).join('/')
-  const appIndex = normalized.lastIndexOf('/app/')
-  if (appIndex !== -1) return normalized.slice(appIndex + 1)
-  return normalized.split('/').slice(-3).join('/')
-}
-
 function rewriteClassSelector(css: string, scopedClassName: string, originalClassName: string) {
   const esbuildNamePattern = new RegExp(
     `\\.${escapeRegex(originalClassName)}(?![-_a-zA-Z0-9])`,

package/src/dev/server.ts

@@ -285,7 +285,7 @@ export async function startDevServer(options: DevServerOptions) {
   // stylesheet, and both the warm tier and the render force it at Ready+0.
   installGlobalCssCache(config)
   markBoot('boot:registry')
-  let routes = await scanRoutes(config.appPath)
+  let routes = await scanRoutes(config.appPath, config.workspaceRoot)
   setDevClientRoutes(config, routes)
   markBoot('boot:scanRoutes')
   await validateProxyFiles(config)
@@ -359,7 +359,7 @@ export async function startDevServer(options: DevServerOptions) {
     // The route table is built from file paths only, so only an added, removed
     // or renamed file can change it — a plain save never does.
     if (structural) {
-      routes = await scanRoutes(config.appPath)
+      routes = await scanRoutes(config.appPath, config.workspaceRoot)
       setDevClientRoutes(config, routes)
     }
     await validateProxyFiles(config)

package/src/index.ts

@@ -1,3 +1,5 @@
+// eslint-disable-next-line @typescript-eslint/triple-slash-reference -- Ambient CSS declarations have no runtime module.
+/// <reference path="./styles.d.ts" />
 export type {
   LayoutProps,
   Metadata,

package/src/render/renderer.ts

@@ -286,6 +286,10 @@ const renderBufferScope = ((globalThis as Record<PropertyKey, unknown>)[RENDER_B
   new AsyncLocalStorage<RenderBufferFrame>()) as AsyncLocalStorage<RenderBufferFrame>
 /** True while a render that SUSPENDS in place is running; see installRawTextRendering. */
 const suspendingStreamScope = new AsyncLocalStorage<boolean>()
+/** The shell body's hoisted resource links; see applyHoistable. */
+const hoistScope = new AsyncLocalStorage<{ nodes?: VNode<Record<string, unknown>>[] }>()
+/** The segment that renders the islands resolved inside it; see islandIdSeed. */
+const islandOwnerScope = new AsyncLocalStorage<string>()
 
 type PNextPreactOptions = typeof preactOptions & {
   [rawTextRenderingInstalled]?: true
@@ -315,8 +319,100 @@ function installRawTextRendering() {
     applyServerActionFormVNode(vnode)
     applyLayoutSegmentSnapshot(vnode)
   }
+  // `__b` is preact's mangled diff hook: render-to-string calls it with parents linked.
+  const diffOptions = preactOptions as { __b?: (vnode: VNode) => void }
+  const previousDiff = diffOptions.__b
+  diffOptions.__b = vnode => {
+    applyHoistable(vnode)
+    previousDiff?.(vnode)
+  }
+}
+
+// React 19 hoists resource links rendered in the body into `<head>`, once per resource. Hydrating
+// trees keep theirs in place, as do head, svg and noscript content and Suspense fallbacks.
+const HOIST_BARRIERS = new Set([
+  'head',
+  'svg',
+  'noscript',
+  'template',
+  'pnext-client',
+  'pnext-suspense',
+])
+const RESOURCE_LINKS = new Set([
+  'stylesheet',
+  'preload',
+  'modulepreload',
+  'preconnect',
+  'dns-prefetch',
+])
+
+function applyHoistable(vnode: VNode) {
+  if (vnode.type !== 'link') return
+  const nodes = hoistScope.getStore()?.nodes
+  if (!nodes) return
+  const { precedence, ...props } = vnode.props as Record<string, unknown>
+  if (
+    !RESOURCE_LINKS.has(props.rel as string) ||
+    typeof props.href !== 'string' ||
+    !props.href ||
+    props.itemProp != null ||
+    props.disabled != null ||
+    props.onLoad ||
+    props.onError ||
+    (props.rel === 'stylesheet' && typeof precedence !== 'string')
+  )
+    return
+  for (let parent = (vnode as HoistVNode).__; parent; parent = parent.__) {
+    const host = parent.type
+    if (
+      typeof host === 'string'
+        ? HOIST_BARRIERS.has(host)
+        : host === SuspenseFallback || isClientPageComponent(host)
+    )
+      return
+  }
+  const key = resourceKey(props)
+  if (!nodes.some(node => resourceKey(node.props) === key)) {
+    if (precedence != null) props['data-precedence'] = precedence
+    nodes.push(h('link', props))
+  }
+  vnode.props = { vnode, type: vnode.type, props: vnode.props } as never
+  vnode.type = RestoreHoisted as VNode['type']
+}
+
+// Renders nothing in the hoisted link's place and restores the vnode, which may be module-shared.
+function RestoreHoisted({
+  vnode,
+  type,
+  props,
+}: {
+  vnode: VNode
+  type: VNode['type']
+  props: VNode['props']
+}) {
+  vnode.type = type
+  vnode.props = props
+  return null
+}
+
+// React keys a stylesheet by href, a hint also by what picks its fetched variant.
+function resourceKey(props: Record<string, unknown>) {
+  const key = [props.rel, props.href]
+  const cors = props.crossOrigin ?? props.crossorigin
+  if (props.rel !== 'stylesheet')
+    key.push(
+      props.as,
+      props.imageSrcSet ?? props.imagesrcset,
+      props.imageSizes ?? props.imagesizes,
+      props.media,
+      // React's CORS buckets: absent, use-credentials, anonymous for any other value.
+      cors == null || cors === 'use-credentials' ? cors : 'anonymous',
+    )
+  return key.join('\n')
 }
 
+type HoistVNode = VNode & { __?: HoistVNode }
+
 const LAYOUT_SCOPE_PROP = '__pnextLayoutScope'
 // Rides a client template's stub vnode into clientIslandVNode, which strips it
 // and stamps the island host with `data-pnext-template` (see ClientIsland).
@@ -551,6 +647,7 @@ interface PageRender {
   hasClientMounts?: boolean
   devScript: string
   streamChunks: Promise<string>[]
+  shellTime?: boolean
   /** Chunks written AFTER `</html>` (late metadata); no document consumer waits on them. */
   lateChunks?: Promise<string>[]
   status?: number
@@ -802,6 +899,8 @@ interface DocumentPage extends MetadataRenderPage {
   documentHeadTags?: string
   deferredScripts?: string
   nonce?: string
+  /** A streamed document load: stamp the shell's first frame for PROMO_RUNTIME. */
+  shellTime?: boolean
 }
 
 interface RenderTreeExtra {
@@ -894,7 +993,7 @@ function renderDocumentStart(page: DocumentPage) {
     ${page.routeScript}
     ${page.clientScript}
     ${page.deferredScripts ?? ''}
-    ${page.devScript}`
+    ${page.devScript}${page.shellTime ? `<script>${SHELL_TIME_SCRIPT}</script>` : ''}`
   return dropLoadingDepthMarkers(stampDocumentNonce(html, page.nonce))
 }
 
@@ -2087,6 +2186,11 @@ export function renderPprResponse(options: RenderOptions, prebuilt: PrebuiltShel
       if (process.env.__NEXT_TEST_MODE) {
         controller.enqueue(encoder.encode('<!-- PPR_BOUNDARY_SENTINEL -->'))
       }
+      if (!routerPayload(options)) {
+        const nonce = documentNonce(options.request)
+        const stamp = `<script${nonce ? ` nonce="${escapeHtml(nonce)}"` : ''}>${SHELL_TIME_SCRIPT}</script>`
+        controller.enqueue(encoder.encode(stamp))
+      }
       schedulePprShellUpgrade(options)
       void (async () => {
         try {
@@ -3327,6 +3431,11 @@ function normalizeRenderOptions(options: RenderOptions): RenderOptions {
 // Streaming isolates each Suspense boundary, dropping client-provider context
 // from ancestor layouts. Compat can narrow this through the streamRoute hook;
 // core routes stream by default.
+/** A response the client router fetched, not a document load. */
+function routerPayload(options: RenderOptions) {
+  return Boolean(options.nav?.soft) || options.request?.headers.get('rsc') === '1'
+}
+
 function canStreamRoute(options: RenderOptions) {
   return getStreamRouteExtensions().canStreamRoute({
     config: options.config,
@@ -3551,10 +3660,13 @@ async function renderTreeInFrame(
           : await resolveServerTree(layoutRender.tree, resolveState)
       : layoutRender.tree,
   )
-  const renderBody =
-    stream && (options.route.client || streamState.inlineSuspense)
-      ? (vnode: VNode) => renderClientPageStreamShell(vnode, streamState)
-      : renderVNodeToString
+  const hoist: { nodes?: VNode<Record<string, unknown>>[] } = { nodes: [] }
+  const renderBody = (vnode: VNode, state?: ActionSerializeState) =>
+    hoistScope.run(hoist, () =>
+      stream && (options.route.client || streamState.inlineSuspense)
+        ? renderClientPageStreamShell(vnode, streamState)
+        : renderVNodeToString(vnode, state),
+    )
   const document = await profileRenderStep(profile, 'render document body', async () =>
     layoutRender.documentLayoutFile
       ? await readDocumentLayout(
@@ -3571,6 +3683,10 @@ async function renderTreeInFrame(
           body: await renderBody(h(Fragment, null, resolved), resolveState),
         },
   )
+  // Later streamed renders keep theirs in place: the head has gone out by then.
+  const hoisted = hoist.nodes!
+  hoist.nodes = undefined
+  if (hoisted.length) document.head += renderToString(h(Fragment, null, hoisted))
   // Stable per-root-layout id so the client router can detect root-layout
   // switches and fall back to an MPA navigation (rootLayoutChanged).
   if (layoutRender.documentLayoutFile) {
@@ -3613,8 +3729,7 @@ async function renderTreeInFrame(
   // render and only metadata that misses the flush stays below it (conformance "metadata body
   // placement matches Next" vs metadata-streaming "should delay the metadata render to body").
   // A router payload has no head to hoist into, so it always rides the body.
-  const navMetadataRender =
-    Boolean(options.nav?.soft) || options.request?.headers.get('rsc') === '1'
+  const navMetadataRender = routerPayload(options)
   const startedPageMetadata =
     metadataMayStream && !navMetadataRender && typeof pageMetadata === 'function'
       ? runInCacheScope(() => pageMetadata(mergeMetadataEntries(layoutRender.metadata)))
@@ -3978,6 +4093,7 @@ async function renderTreeInFrame(
     hasClientMounts: pageSlotIsMountTarget(options),
     devScript,
     streamChunks: streamState.deferred,
+    shellTime: streamState.deferred.length > 0 && !routerPayload(options),
     lateChunks,
     status: extra.status,
     viewport,
@@ -4867,6 +4983,7 @@ function ClientIsland(
     __pnextComponent?: ComponentType<Record<string, unknown>>
     __pnextSerializedProps?: string
     __pnextLayoutScope?: LayoutSegmentSnapshot
+    __pnextOwner?: string
     __pnextParamsScope?: RouteParamsSnapshot
     __pnextTemplate?: boolean
     __pnextSkipSsr?: boolean
@@ -4878,6 +4995,7 @@ function ClientIsland(
     __pnextComponent,
     __pnextSerializedProps,
     __pnextLayoutScope,
+    __pnextOwner,
     __pnextParamsScope,
     __pnextTemplate,
     __pnextSkipSsr,
@@ -4928,6 +5046,12 @@ function ClientIsland(
     islandProps['data-pnext-params'] = serializeProps(__pnextParamsScope)
   }
   const staticChildren = islandStaticChildren(__pnextClient.id, islandChildren)
+  const seed = islandIdSeed(
+    __pnextOwner ?? '',
+    __pnextClient.id,
+    islandProps['data-pnext-props'] as string,
+  )
+  islandProps['data-pnext-id'] = seed
 
   if (__pnextSkipSsr) {
     return staticChildren
@@ -4964,6 +5088,8 @@ function ClientIsland(
     revivePromiseProps(ssrProps),
     plainChildren !== undefined ? islandChildren : probedChildren,
   )
+  // useId's mask (preact's mangled `_mask`): the client seeds the island root from data-pnext-id.
+  ;(island as { __m?: unknown }).__m = [seed, 0]
   if (__pnextLayoutScope) {
     island = h(
       LayoutSegmentContext.Provider,
@@ -5007,6 +5133,36 @@ function ClientIsland(
   })
 }
 
+// React numbers useId across its one root; each island root here seeds its own id space from its
+// owning segment and identity, so ids stay unique across islands and across documents that keep a
+// layout's islands. Identical islands of one owner in one render take the next copy suffix.
+function islandIdSeed(owner: string, id: string, props: string) {
+  let hash = 0
+  for (const text of [owner, id, props])
+    for (let index = 0; index < text.length; index++)
+      hash = (Math.imul(31, hash) + text.charCodeAt(index)) | 0
+  const seed = (hash >>> 0).toString(36)
+  const frame = renderBufferScope.getStore()
+  const seeds = frame
+    ? (frame.islandSeeds ??= new Map<string, number>())
+    : new Map<string, number>()
+  const copies = seeds.get(seed) ?? 0
+  seeds.set(seed, copies + 1)
+  return copies ? `${seed}_${copies}` : seed
+}
+
+// Layout and template markers own the islands they render, the page slot owns the route's.
+function inIslandOwner<T>(node: VNode, options: RenderOptions, resolve: () => T): T {
+  const props = node.props as Record<string, unknown>
+  const owner =
+    node.type === 'pnext-layout'
+      ? (props['data-pnext-segment'] as string)
+      : props.id === 'pnext-page'
+        ? `page${options.route.route}`
+        : undefined
+  return owner === undefined ? resolve() : islandOwnerScope.run(owner, resolve)
+}
+
 // Marks the island's static-children wrapper as rendered when the component
 // actually renders its children (depth-first stringification reaches this
 // probe before the fallback sibling below).
@@ -5257,7 +5413,10 @@ async function resolveServerTree(node: unknown, state: ResolveState): Promise<Co
     if (state.partial?.shellPending && node.type === 'html') {
       state.partial.shellPending = false
     }
-    return elementVNode(node, await resolveServerTree(node.props.children, state), state)
+    const children = await inIslandOwner(node, state.options, () =>
+      resolveServerTree(node.props.children, state),
+    )
+    return elementVNode(node, children, state)
   }
 
   const component = node.type
@@ -5708,14 +5867,18 @@ async function inlineSuspenseBoundary(
   const fallback = await resolveServerTreeForStream(node.props.fallback, state)
   // The fallback must be a single vnode: the stream renderer renders it with no
   // parent vnode, and its array branch would crash on one (swallowing the
-  // fallback entirely). A Fragment wrapper is byte-neutral.
+  // fallback entirely). The wrapper is byte-neutral and marks it for applyHoistable.
   return h(
     boundaryType,
-    { ...node.props, fallback: h(Fragment, null, fallback) },
+    { ...node.props, fallback: h(SuspenseFallback, null, fallback) },
     h(Suspended, null),
   )
 }
 
+function SuspenseFallback(props: { children?: ComponentChildren }) {
+  return props.children
+}
+
 // Wraps a pending subtree as a suspending component. A throw AFTER the boundary suspended can only
 // ride the boundary's own replacement (the shell and its status already flushed), so it maps to the
 // same markup deferSuspenseBoundary emits. A throw that lands BEFORE the boundary ever suspended -
@@ -5934,7 +6097,9 @@ function resolveServerTreeForStream(
     // component) wrongly takes the doc-shell blocking branch and awaits its slow
     // content before the shell can flush. Mirrors resolveServerTree's html flip.
     if (isDocument) state.shellPending = false
-    const children = resolveServerTreeForStream(node.props.children, state)
+    const children = inIslandOwner(node, state.options, () =>
+      resolveServerTreeForStream(node.props.children, state),
+    )
     if (isPromise(children)) {
       return children.then(resolved => elementVNode(node, resolved, state))
     }
@@ -6375,7 +6540,15 @@ function dynamicTargetReference(
 ) {
   const target = dynamicReference.target
   if (!target) return undefined
-  return state.clientReferences.get(`c-${clientReferenceId(target.file, target.exportName)}`)
+  const stored = state.clientReferences.get(
+    `c-${clientReferenceId(target.file, target.exportName)}`,
+  )
+  if (stored) return stored
+  for (const reference of state.clientReferences.values()) {
+    if (reference.file === target.file && reference.exportName === target.exportName)
+      return reference
+  }
+  return undefined
 }
 
 function clientIslandVNode(
@@ -6424,6 +6597,7 @@ function clientIslandVNode(
       __pnextComponent: component,
       __pnextTemplate: templateMarker === true,
       __pnextLayoutScope: layoutScope as LayoutSegmentSnapshot | undefined,
+      __pnextOwner: islandOwnerScope.getStore(),
       // Params visible at this island's position in the route (route params plus
       // any enclosing parallel-route slot's own dynamic/catch-all captures). Read
       // from the active params scope (render/slots.ts) so a slot island's
@@ -7279,10 +7453,11 @@ const PROMO_RUNTIME =
   'if(d.nodeType===8){var mm=/^\\$ps:(\\d+)$/.exec(d.data);if(mm){cur=m[mm[1]]=[];continue}' +
   'if(/^\\/\\$ps:\\d+$/.test(d.data)){cur=null;continue}}' +
   'if(cur)cur.push(d);}return m}' +
+  "function B(i){return document.querySelector('pnext-suspense[data-pnext-suspense=\"'+i+'\"]')}" +
   'function tryPromote(i){' +
   "var t=document.querySelector('[data-pnext-stream=\"'+i+'\"]');" +
   'if(!t){delete P[i];return true;}' +
-  "var e=document.querySelector('pnext-suspense[data-pnext-suspense=\"'+i+'\"]');" +
+  'var e=B(i);' +
   'if(!e){P[i]=1;return false;}' +
   // A boundary inside a client island: this promotion rewrites DOM the island's mounted
   // preact tree adopted at hydration, which still names the fallback. Mark the root so the
@@ -7304,17 +7479,23 @@ const PROMO_RUNTIME =
   '}else{while(t.firstChild)f.appendChild(t.firstChild);}' +
   'e.replaceWith(f);t.remove();delete P[i];return true;' +
   '}' +
-  'function drain(){var changed=true;while(changed){changed=false;var k=Object.keys(P);for(var j=0;j<k.length;j++){if(P[k[j]]&&tryPromote(k[j]))changed=true;}}}' +
-  'if(document.addEventListener)document.addEventListener("DOMContentLoaded",drain);' +
+  'function drain(){var any,changed=true;while(changed){changed=false;var k=Object.keys(P);for(var j=0;j<k.length;j++){if(P[k[j]]&&tryPromote(k[j]))changed=any=true;}}return any}' +
+  // Islands in a promoted chunk hydrate only now: the entry's scan skips unrevealed chunks.
+  'function M(){window.__PNEXT_MATERIALIZE_CLIENT_ISLANDS__&&window.__PNEXT_MATERIALIZE_CLIENT_ISLANDS__(document);' +
+  'window.__PNEXT_MOUNT_ISLANDS__&&window.__PNEXT_MOUNT_ISLANDS__();}' +
+  'if(document.addEventListener)document.addEventListener("DOMContentLoaded",function(){drain()&&M()});' +
   'return function(i){' +
-  'var ok=tryPromote(i);' +
-  'window.__PNEXT_MATERIALIZE_CLIENT_ISLANDS__&&window.__PNEXT_MATERIALIZE_CLIENT_ISLANDS__(document);' +
-  'window.__PNEXT_MOUNT_ISLANDS__&&window.__PNEXT_MOUNT_ISLANDS__();' +
-  'if(ok)drain();' +
-  '};' +
+  // React's $RC: reveal in the shell's first frame, else no sooner than 300 ms after the last reveal.
+  // Inside an island at once: a held reveal lands after hydration, under the island's adopted tree.
+  '(B(i)?.closest("pnext-client")?f=>f():self.$RT?setTimeout:requestAnimationFrame)(function(){$RT=performance.now();' +
+  'if(tryPromote(i))drain();M();' +
+  '},self.$RT+300-performance.now())};' +
   '}'
 
-function suspenseReplaceScript(id: string) {
+// React Fizz's shell-time stamp: PROMO_RUNTIME reveals no sooner than 300 ms after this frame.
+const SHELL_TIME_SCRIPT = 'requestAnimationFrame(()=>$RT=performance.now())'
+
+export function suspenseReplaceScript(id: string) {
   return `(function(){(window.__PNEXT_PROMO__=window.__PNEXT_PROMO__||(${PROMO_RUNTIME})())(${JSON.stringify(id)});var s=document.currentScript;if(s)s.remove();}())`
 }
 
@@ -7595,7 +7776,7 @@ async function applyLayouts(
       tree = h(
         'pnext-layout',
         {
-          'data-pnext-segment': segmentIdentityToken(file),
+          'data-pnext-segment': segmentIdentityToken(relative(options.config.root, file)),
           'data-pnext-skip': '',
           ...(scope !== undefined ? { 'data-pnext-scope': scope } : {}),
           style: { display: 'contents' },
@@ -7728,7 +7909,11 @@ async function wrapSegment(
   })
   return (component as ClientComponent)[clientReferenceSymbol]
     ? segment
-    : serverSegment(layoutFile, segment, segmentScopeFor(options, dir))
+    : serverSegment(
+        relative(options.config.root, layoutFile),
+        segment,
+        segmentScopeFor(options, dir),
+      )
 }
 
 // An explicit `@children` parallel-route slot directory is Next's way to supply
@@ -7769,7 +7954,7 @@ async function wrapInTemplate(
   const Template = markServerReference(module.default)
   if (!Template) return tree
   return serverSegment(
-    templateFile,
+    relative(options.config.root, templateFile),
     h(Template as ComponentType<ServerVNodeProps>, { children: tree }),
     segmentScopeFor(options, dirname(templateFile)),
   )

package/src/render/resource-hints.ts

@@ -21,7 +21,10 @@ export const RENDER_BUFFER_SCOPE = Symbol.for('pnext.renderBufferScope')
 const RENDER_BUFFER_STRAYS = Symbol.for('pnext.renderBufferStrays')
 
 export type RenderBufferKind = 'hints' | 'head' | 'deferred'
-export type RenderBufferFrame = Record<RenderBufferKind, unknown[]>
+export type RenderBufferFrame = Record<RenderBufferKind, unknown[]> & {
+  /** Islands rendered per useId seed, so identical islands get distinct seeds. */
+  islandSeeds?: Map<string, number>
+}
 
 export const newRenderBufferFrame = (): RenderBufferFrame => ({ hints: [], head: [], deferred: [] })
 

package/src/resolve/imports.ts

@@ -189,7 +189,12 @@ export function resolveModuleAlias(specifier: string): string | undefined {
  * Resolve a specifier to a LOCAL source file, or undefined when it belongs to
  * an external package. Callers read undefined as "leave this to node/esbuild".
  */
-export function resolveImport(root: string, fromFile: string, specifier: string) {
+export function resolveImport(
+  root: string,
+  fromFile: string,
+  specifier: string,
+  workspaceRoot?: string,
+) {
   // A `?query`/`#fragment` resource belongs to its loader chain (turbopack
   // rules, `.wasm?module`): those plugins strip the suffix and resolve the base
   // themselves, and the query is part of the module's identity — so it is never
@@ -215,7 +220,7 @@ export function resolveImport(root: string, fromFile: string, specifier: string)
     return resolved ? realImportPath(resolved) : undefined
   }
 
-  const workspaceResolved = resolveWorkspacePackageImport(root, specifier)
+  const workspaceResolved = resolveWorkspacePackageImport(root, specifier, workspaceRoot)
   if (workspaceResolved) return workspaceResolved
 
   return resolveAppTreePackage(resolutionRoot, root, fromFile, specifier)
@@ -344,8 +349,8 @@ type PackageExport = unknown
  * on-disk subpath fallback no standard resolver takes, because the published `exports` point at build output
  * that does not exist in a checkout.
  */
-function resolveWorkspacePackageImport(root: string, specifier: string) {
-  const workspaceRoot = findWorkspaceRoot(root)
+function resolveWorkspacePackageImport(root: string, specifier: string, boundary?: string) {
+  const workspaceRoot = boundary ? path.resolve(boundary) : findWorkspaceRoot(root)
   if (!workspaceRoot) return undefined
 
   const packageName = packageNameFromSpecifier(specifier)
@@ -999,14 +1004,14 @@ const workspaceMembershipCache = new Map<string, boolean>()
  * dependency. An app outside the workspace (a checkout linked into it) sees the package only through
  * node_modules, so the package's own real dir is asked about its manifest too.
  */
-export function isWorkspacePackage(root: string, name: string): boolean {
-  const key = `${path.resolve(root)}\0${name}`
+export function isWorkspacePackage(root: string, name: string, boundary?: string): boolean {
+  const key = `${path.resolve(root)}\0${name}\0${boundary ?? ''}`
   const cached = workspaceMembershipCache.get(key)
   if (cached !== undefined) return cached
 
-  const workspaceRoot = findWorkspaceRoot(root)
+  const workspaceRoot = boundary ? path.resolve(boundary) : findWorkspaceRoot(root)
   let member = Boolean(workspaceRoot && workspacePackages(workspaceRoot).has(name))
-  if (!member) {
+  if (!member && !boundary) {
     const packageRoot = findNodePackageRoot(path.resolve(root), name)
     const real = packageRoot ? realImportPath(packageRoot) : undefined
     const linkedRoot = real ? findWorkspaceRoot(real) : undefined