@wular/pnext 0.0.4 → 0.0.7

package/src/{api → client}/router/events.ts

@@ -2,27 +2,42 @@
 // compat hooks subscribe to, plus the post-navigation scroll action. All share one tier - an entry
 // that reads router state pulls this in at first paint, one that only has a <Link> gets it with the
 // runtime chunk - and none may sit in ./hub, which is a chunk shared with the runtime.
-import { locationKey, routerState } from './hub';
-import type { NavigationScrollAction, NavigationScrollOptions } from './types';
+import { locationKey, routerState } from './hub'
+import type { NavigationScrollAction, NavigationScrollOptions } from './types'
 
-export let navigationScrollAction: NavigationScrollAction | undefined;
+export let navigationScrollAction: NavigationScrollAction | undefined
 
 export function setNavigationScrollAction(action: NavigationScrollAction | undefined) {
-  navigationScrollAction = action;
+  navigationScrollAction = action
 }
 
 export function scheduleNavigationScroll(url: URL, options: NavigationScrollOptions = {}) {
-  navigationScrollAction?.(url, options);
+  navigationScrollAction?.(url, options)
 }
 
 export function locationListeners() {
-  window.__PNEXT_LOCATION_LISTENERS__ ??= new Set();
-  return window.__PNEXT_LOCATION_LISTENERS__;
+  window.__PNEXT_LOCATION_LISTENERS__ ??= new Set()
+  return window.__PNEXT_LOCATION_LISTENERS__
 }
 
 export function emitLocationChange() {
-  routerState.observedLocationKey = locationKey();
-  for (const listener of [...locationListeners()]) listener();
+  routerState.observedLocationKey = locationKey()
+  if (silentLocationDepth > 0) return
+  for (const listener of [...locationListeners()]) listener()
+}
+
+let silentLocationDepth = 0
+
+// Moves the address bar without waking usePathname/useParams subscribers: the pre-commit
+// optimistic push's URL is ahead of the tree, so broadcasting would desync URL and params.
+// observedLocationKey still advances, so a traversal off the pushed entry is a real move.
+export function withSilentLocationChange(move: () => void) {
+  silentLocationDepth++
+  try {
+    move()
+  } finally {
+    silentLocationDepth--
+  }
 }
 
 // Fires at the start of every soft navigation (link click, router.push,
@@ -30,24 +45,24 @@ export function emitLocationChange() {
 // different navigation supersedes it.
 // Annotated pure so an entry that subscribes to nothing (a link-only page)
 // shakes the whole seam out of its first-paint closure.
-export const navigationStartListeners = /* @__PURE__ */ new Set<() => void>();
+export const navigationStartListeners = /* @__PURE__ */ new Set<() => void>()
 
 export function onNavigationStart(listener: () => void) {
-  navigationStartListeners.add(listener);
-  return () => navigationStartListeners.delete(listener);
+  navigationStartListeners.add(listener)
+  return () => navigationStartListeners.delete(listener)
 }
 
 export function emitNavigationStart() {
-  for (const listener of [...navigationStartListeners]) listener();
+  for (const listener of [...navigationStartListeners]) listener()
 }
 
-export const navigationCommitListeners = /* @__PURE__ */ new Set<() => void>();
+export const navigationCommitListeners = /* @__PURE__ */ new Set<() => void>()
 
 export function onNavigationCommit(listener: () => void) {
-  navigationCommitListeners.add(listener);
-  return () => navigationCommitListeners.delete(listener);
+  navigationCommitListeners.add(listener)
+  return () => navigationCommitListeners.delete(listener)
 }
 
 export function emitNavigationCommit() {
-  for (const listener of [...navigationCommitListeners]) listener();
+  for (const listener of [...navigationCommitListeners]) listener()
 }

package/src/{api → client}/router/history.ts

@@ -5,32 +5,32 @@
 // page whose client graph reads router state (`api/client-navigation`) seeds at
 // first paint and pulls this in; a page that only has a <Link> never reads an id
 // before the navigation runtime lands, so this rides the idle chunk with it.
-import { routerState } from './hub';
+import { routerState } from './hub'
 
-export const HISTORY_BFCACHE_ID_KEY = '__pnextBfcacheId';
+export const HISTORY_BFCACHE_ID_KEY = '__pnextBfcacheId'
 
 export function historyState(): Record<string, unknown> {
-  const state = history.state as Record<string, unknown> | null;
-  return state && typeof state === 'object' ? state : {};
+  const state = history.state as Record<string, unknown> | null
+  return state && typeof state === 'object' ? state : {}
 }
 
 export function historyBfcacheId(
   state: Record<string, unknown> = historyState(),
 ): string | undefined {
-  const value = state[HISTORY_BFCACHE_ID_KEY];
-  return typeof value === 'string' ? value : undefined;
+  const value = state[HISTORY_BFCACHE_ID_KEY]
+  return typeof value === 'string' ? value : undefined
 }
 
 function newHistoryId(prefix: string) {
-  return `${prefix}${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 8)}`;
+  return `${prefix}${Date.now().toString(36)}_${Math.random().toString(36).slice(2, 8)}`
 }
 
 export function newBfcacheId() {
-  return newHistoryId('b_');
+  return newHistoryId('b_')
 }
 
 export function newEntryId() {
-  return newHistoryId('e');
+  return newHistoryId('e')
 }
 
 /**
@@ -48,12 +48,12 @@ export function newEntryId() {
  * before it can navigate away.
  */
 export function seedHistoryEntry() {
-  if (!process.browser && typeof window === 'undefined') return;
-  const state = historyState();
-  const entryId = state.__pnextEntry;
-  const hasEntryId = typeof entryId === 'string';
-  routerState.renderedEntryId = hasEntryId ? entryId : newEntryId();
-  if (historyBfcacheId(state) && hasEntryId) return;
+  if (!process.browser && typeof window === 'undefined') return
+  const state = historyState()
+  const entryId = state.__pnextEntry
+  const hasEntryId = typeof entryId === 'string'
+  routerState.renderedEntryId = hasEntryId ? entryId : newEntryId()
+  if (historyBfcacheId(state) && hasEntryId) return
   try {
     history.replaceState(
       {
@@ -63,7 +63,7 @@ export function seedHistoryEntry() {
       },
       '',
       location.href,
-    );
+    )
   } catch {
     // Without a stable id, bfcache-keyed subtrees fall back to remounting.
   }

package/src/{api → client}/router/hub.ts

@@ -8,7 +8,7 @@
 // out of an entry: this module is a chunk SHARED with the runtime chunk, so anything the runtime
 // imports from here is kept in the first-paint chunk regardless. ./policies, ./history, ./events and
 // the bfcache route key all ride the idle chunk for that reason.
-import type { EntryModule } from './types';
+import type { EntryModule } from './types'
 
 // Router-wide mutable state SHARED BY BOTH TIERS. Every field here is committed by more than one
 // region (install, soft nav, popstate), so it lives on one record: a module-level `let` can only be
@@ -28,24 +28,24 @@ export const routerState = {
   // same id — an app-level shallow pushState now carries the id forward — needs
   // no fetch and no swap: the DOM already is this entry's.
   renderedEntryId: undefined as string | undefined,
-};
+}
 
 export function locationKey() {
-  return typeof location === 'undefined' ? '' : location.pathname + location.search;
+  return typeof location === 'undefined' ? '' : location.pathname + location.search
 }
 
 // Installers that only the navigation runtime ever observes — compat's policy
 // seams (segment cache, prefetch windows, scroll, stylesheet order). Registering
 // one costs first paint a closure holding an `import()`; the facade runs them
 // while the runtime chunk loads, so a policy is in place before the first fetch.
-const deferredInstalls: (() => unknown)[] = [];
+const deferredInstalls: (() => unknown)[] = []
 
 export function registerDeferredInstall(install: () => unknown): void {
-  deferredInstalls.push(install);
+  deferredInstalls.push(install)
 }
 
 export function takeDeferredInstalls(): (() => unknown)[] {
-  return deferredInstalls.splice(0);
+  return deferredInstalls.splice(0)
 }
 
 // Compat-registered policy seams FIRST PAINT ITSELF READS. The rest (prefetch
@@ -55,55 +55,55 @@ export function takeDeferredInstalls(): (() => unknown)[] {
 // `javascript:` URLs are a navigation-time XSS vector; the router refuses them
 // at every entry point. The generic block lives in core; the user-facing
 // message is framework-specific, so compat supplies a reporter/thrower.
-export let blockedJsUrlReporter: ((url: string) => void) | undefined;
+export let blockedJsUrlReporter: ((url: string) => void) | undefined
 
 export function setBlockedJavascriptUrlReporter(reporter: (url: string) => void) {
-  blockedJsUrlReporter = reporter;
+  blockedJsUrlReporter = reporter
 }
 
 // basePath boundary: under a configured basePath a same-origin URL OUTSIDE the
 // basePath (a `basePath:false` target) must hard-navigate, not soft-swap. The
 // check is a next.config concern, so compat registers it; pure core returns
 // false (every same-origin URL stays soft-navigable).
-export let softNavBoundary: ((url: URL) => boolean) | undefined;
+export let softNavBoundary: ((url: URL) => boolean) | undefined
 
 /** Register the compat soft-nav boundary predicate (true → hard navigate). */
 export function setSoftNavBoundary(predicate: (url: URL) => boolean) {
-  softNavBoundary = predicate;
+  softNavBoundary = predicate
 }
 
 export function isJavascriptUrl(href: string) {
   // eslint-disable-next-line no-control-regex
-  return /^[\u0000-\u0020]*javascript:/i.test(href);
+  return /^[\u0000-\u0020]*javascript:/i.test(href)
 }
 
 /** True when the URL was a blocked javascript: URL (caller must not navigate). */
 export function blockJavascriptUrl(href: string): boolean {
-  if (!isJavascriptUrl(href)) return false;
-  if (blockedJsUrlReporter) blockedJsUrlReporter(href);
+  if (!isJavascriptUrl(href)) return false
+  if (blockedJsUrlReporter) blockedJsUrlReporter(href)
   else if (process.browser || typeof window !== 'undefined') {
-    window.dispatchEvent(new CustomEvent('pnext:blocked-javascript-url', { detail: href }));
+    window.dispatchEvent(new CustomEvent('pnext:blocked-javascript-url', { detail: href }))
   }
-  return true;
+  return true
 }
 
 // Whether a href is soft-navigable at all — the one navigation decision the
 // first-paint hub has to make synchronously, before the router chunk lands.
 
 export function resolveSoftUrl(href: string) {
-  let url: URL;
+  let url: URL
   try {
-    url = new URL(href, location.href);
+    url = new URL(href, location.href)
   } catch {
-    return null;
+    return null
   }
-  if (url.origin !== location.origin) return null;
+  if (url.origin !== location.origin) return null
   // Under a configured basePath, a same-origin URL that falls OUTSIDE the
   // basePath (a `basePath:false` target) is not part of the app — it must be a
   // real browser navigation, not a soft swap. Pure core / no-basePath: never
   // outside (predicate returns false), so behavior is unchanged.
-  if (softNavBoundary?.(url)) return null;
-  return url;
+  if (softNavBoundary?.(url)) return null
+  return url
 }
 
 // The synchronous half of link interception: everything a click's default
@@ -113,16 +113,16 @@ export function resolveSoftUrl(href: string) {
 // and commits immediately.
 
 export interface LinkClickTarget {
-  link: HTMLAnchorElement;
-  url: URL;
-  replace: boolean;
-  scroll: boolean;
+  link: HTMLAnchorElement
+  url: URL
+  replace: boolean
+  scroll: boolean
 }
 
 export function linkFromEvent(event: Event) {
-  const target = event.target;
-  if (!(target instanceof Element)) return null;
-  return target.closest<HTMLAnchorElement>('a[data-pnext-link]');
+  const target = event.target
+  if (!(target instanceof Element)) return null
+  return target.closest<HTMLAnchorElement>('a[data-pnext-link]')
 }
 
 /**
@@ -132,51 +132,51 @@ export function linkFromEvent(event: Event) {
  * link pointing outside the app (both return null having acted).
  */
 export function linkClickTarget(event: MouseEvent): LinkClickTarget | null {
-  if (event.defaultPrevented) return null;
+  if (event.defaultPrevented) return null
   if (event.button !== 0 || event.metaKey || event.ctrlKey || event.shiftKey || event.altKey)
-    return null;
-  const link = linkFromEvent(event);
-  if (!link) return null;
-  if (link.target && link.target !== '_self') return null;
-  if (link.hasAttribute('download')) return null;
-  const href = link.getAttribute('data-pnext-blocked-href') ?? link.getAttribute('href');
-  if (!href) return null;
+    return null
+  const link = linkFromEvent(event)
+  if (!link) return null
+  if (link.target && link.target !== '_self') return null
+  if (link.hasAttribute('download')) return null
+  const href = link.getAttribute('data-pnext-blocked-href') ?? link.getAttribute('href')
+  if (!href) return null
   // Refuse javascript: URLs before the browser can run them (the anchor's
   // default action is cancellable from this bubble-phase listener).
   if (blockJavascriptUrl(href)) {
-    event.preventDefault();
-    return null;
+    event.preventDefault()
+    return null
   }
-  const replace = link.getAttribute('data-pnext-replace') === 'true';
-  const url = resolveSoftUrl(href);
+  const replace = link.getAttribute('data-pnext-replace') === 'true'
+  const url = resolveSoftUrl(href)
   if (!url) {
     if (replace) {
-      event.preventDefault();
-      window.location.replace(href);
+      event.preventDefault()
+      window.location.replace(href)
     }
-    return null;
+    return null
   }
-  return { link, url, replace, scroll: link.getAttribute('data-pnext-scroll') !== 'false' };
+  return { link, url, replace, scroll: link.getAttribute('data-pnext-scroll') !== 'false' }
 }
 
 // Route entry modules: the cache of imported entries plus the guard that keeps
 // a router-triggered import from auto-mounting into the live document.
 
-export const entryModuleCache = new Map<string, EntryModule>();
+export const entryModuleCache = new Map<string, EntryModule>()
 
 // The document's own entry module registers itself at boot. Without this, the first history
 // traversal back to the hard-loaded route pays a real import() - one task yield - and a test reading
 // the DOM right after history.back() catches the DEPARTING page. With every step of the cached-entry
 // restore microtask-only, the commit lands before any post-traversal task can read.
 if (process.browser || typeof window !== 'undefined') {
-  (
+  ;(
     window as unknown as {
-      __PNEXT_REGISTER_ENTRY__?: (src: string, module: EntryModule) => void;
+      __PNEXT_REGISTER_ENTRY__?: (src: string, module: EntryModule) => void
     }
   ).__PNEXT_REGISTER_ENTRY__ = (src, module) => {
-    const href = entryModuleHref(src);
-    if (!entryModuleCache.has(href)) entryModuleCache.set(href, module);
-  };
+    const href = entryModuleHref(src)
+    if (!entryModuleCache.has(href)) entryModuleCache.set(href, module)
+  }
 }
 
 // Entries auto-mount when the browser loads them as the document's module
@@ -185,10 +185,9 @@ if (process.browser || typeof window !== 'undefined') {
 // counter is only ever non-zero while a router-triggered import is in flight,
 // and hard document loads can never overlap one.
 export function routerImportActive() {
-  return (window.__PNEXT_ROUTER_IMPORTS__ ?? 0) > 0;
+  return (window.__PNEXT_ROUTER_IMPORTS__ ?? 0) > 0
 }
 
 export function entryModuleHref(src: string) {
-  return new URL(src, location.href).href;
+  return new URL(src, location.href).href
 }
-

package/src/{api/router.ts → client/router/index.ts}

@@ -1,11 +1,11 @@
 // First-paint router hub. Generated client entries import this module, so every byte it statically
 // reaches is on the critical path of every route: keep it to link interception, history events and
-// the seams compat registers into, all of which live in ./router/hub. The navigation runtime itself
-// sits behind ./router/runtime and is import()ed on idle into its own chunk.
+// the seams compat registers into, all of which live in ./hub. The navigation runtime itself
+// sits behind ./runtime and is import()ed on idle into its own chunk.
 //
 // Everything routed through this file is a facade over that chunk. That is the point: a static
 // import of softNavigate anywhere in core or compat would otherwise pull the whole runtime back into
-// first paint. State BOTH tiers touch lives in ./router/hub and is imported by both, so a setter
+// first paint. State BOTH tiers touch lives in ./hub and is imported by both, so a setter
 // called before the chunk lands is not replayed - it is already in place when the runtime reads it.
 // Chunk membership is decided per module, so each seam is its own module.
 import {
@@ -14,9 +14,9 @@ import {
   resolveSoftUrl,
   routerState,
   takeDeferredInstalls,
-} from './router/hub';
-import type { LinkClickTarget } from './router/hub';
-import type { PrefetchOptions, SoftNavigateOptions } from './router/types';
+} from './hub'
+import type { LinkClickTarget } from './hub'
+import type { PrefetchOptions, SoftNavigateOptions } from './types'
 
 export {
   blockJavascriptUrl,
@@ -25,8 +25,8 @@ export {
   routerImportActive,
   setBlockedJavascriptUrlReporter,
   setSoftNavBoundary,
-} from './router/hub';
-// NOTE: ./router/policies, ./router/history and ./router/events are deliberately NOT re-exported
+} from './hub'
+// NOTE: ./policies, ./history and ./events are deliberately NOT re-exported
 // here. esbuild assigns a chunk per set-of-reaching-entries, computed on the module graph, so a
 // re-export edge from this file lands any of them in the first-paint chunk even though every symbol
 // tree-shakes away. Their consumers import them directly.
@@ -40,11 +40,11 @@ export type {
   SegmentCachePolicy,
   SegmentCacheRecord,
   StylesheetReconciler,
-} from './router/types';
+} from './types'
 
-type RouterRuntime = typeof import('./router/runtime');
+type RouterRuntime = typeof import('./runtime')
 
-let runtime: Promise<RouterRuntime> | undefined;
+let runtime: Promise<RouterRuntime> | undefined
 
 /**
  * Load (once) and run against the idle tier. Every facade export chains off
@@ -55,15 +55,15 @@ function withRouter<T>(use: (module: RouterRuntime) => T): Promise<Awaited<T>> {
   // Deferred installers land with the runtime chunk, before anything reads a
   // policy. Drained inside the chain (not at call time) so an installer any
   // entry registers after the first facade call still runs.
-  runtime ??= import('./router/runtime').then(async module => {
-    await Promise.all(takeDeferredInstalls().map(install => install()));
-    return module;
-  });
-  return runtime.then(use) as Promise<Awaited<T>>;
+  runtime ??= import('./runtime').then(async module => {
+    await Promise.all(takeDeferredInstalls().map(install => install()))
+    return module
+  })
+  return runtime.then(use) as Promise<Awaited<T>>
 }
 
 export function softNavigate(href: string, options?: SoftNavigateOptions) {
-  return withRouter(module => module.softNavigate(href, options));
+  return withRouter(module => module.softNavigate(href, options))
 }
 
 export function prefetchRoute(href: string, options?: PrefetchOptions) {
@@ -72,49 +72,49 @@ export function prefetchRoute(href: string, options?: PrefetchOptions) {
   // the runtime. The throw is spelled out here rather than in the hub because the hub is a chunk
   // shared with the runtime. Only an unparseable href throws - a cross-origin or out-of-basePath one
   // is a silent miss.
-  const url = resolveSoftUrl(href);
+  const url = resolveSoftUrl(href)
   if (!url) {
     if (options?.strict) {
       try {
-        new URL(href, location.href);
+        new URL(href, location.href)
       } catch {
-        throw new Error(`Cannot prefetch '${href}' because it cannot be converted to a URL.`);
+        throw new Error(`Cannot prefetch '${href}' because it cannot be converted to a URL.`)
       }
     }
-    return Promise.resolve(null);
+    return Promise.resolve(null)
   }
-  return withRouter(module => module.prefetchRoute(url.href, options));
+  return withRouter(module => module.prefetchRoute(url.href, options))
 }
 
 export function evictClientRouterCache(options?: { rearmVisiblePrefetches?: boolean }) {
-  return withRouter(module => module.evictClientRouterCache(options));
+  return withRouter(module => module.evictClientRouterCache(options))
 }
 
 export function rearmVisiblePrefetches() {
-  return withRouter(module => module.rearmVisiblePrefetches());
+  return withRouter(module => module.rearmVisiblePrefetches())
 }
 
 // A click intercepted before the runtime lands waits for it. The wait is
 // bounded: a chunk that never arrives (offline, a failed deploy) must still
 // navigate, so the queued click falls back to a real browser navigation rather
 // than leaving the user on a dead link.
-const QUEUED_CLICK_TIMEOUT_MS = 3_000;
+const QUEUED_CLICK_TIMEOUT_MS = 3_000
 
-let pendingClicks: LinkClickTarget[] = [];
-let pendingPop = false;
-let installedFull = false;
-let hardNavTimer: ReturnType<typeof setTimeout> | undefined;
+let pendingClicks: LinkClickTarget[] = []
+let pendingPop = false
+let installedFull = false
+let hardNavTimer: ReturnType<typeof setTimeout> | undefined
 
 function hubLinkClick(event: MouseEvent) {
-  const target = linkClickTarget(event);
-  if (!target) return;
-  event.preventDefault();
-  pendingClicks.push(target);
+  const target = linkClickTarget(event)
+  if (!target) return
+  event.preventDefault()
+  pendingClicks.push(target)
   hardNavTimer ??= setTimeout(() => {
-    const queued = pendingClicks[0];
-    if (queued) location.href = queued.url.href;
-  }, QUEUED_CLICK_TIMEOUT_MS);
-  void loadRuntime();
+    const queued = pendingClicks[0]
+    if (queued) location.href = queued.url.href
+  }, QUEUED_CLICK_TIMEOUT_MS)
+  void loadRuntime()
 }
 
 // The browser has already committed the traversal (URL and history state are
@@ -122,46 +122,47 @@ function hubLinkClick(event: MouseEvent) {
 // popstate; broadcasting here would move `observedLocationKey` and make that
 // handler read the traversal as a shallow one that needs no document.
 function hubPopState() {
-  pendingPop = true;
-  void loadRuntime();
+  pendingPop = true
+  void loadRuntime()
 }
 
 function loadRuntime() {
   return withRouter(module => {
     if (!installedFull) {
-      installedFull = true;
-      document.removeEventListener('click', hubLinkClick);
-      window.removeEventListener('popstate', hubPopState);
-      module.installRouterFull();
+      installedFull = true
+      document.removeEventListener('click', hubLinkClick)
+      window.removeEventListener('popstate', hubPopState)
+      module.installRouterFull()
     }
-    clearTimeout(hardNavTimer);
-    hardNavTimer = undefined;
-    const clicks = pendingClicks;
-    pendingClicks = [];
-    for (const click of clicks) module.commitLinkNavigation(click);
+    clearTimeout(hardNavTimer)
+    hardNavTimer = undefined
+    const clicks = pendingClicks
+    pendingClicks = []
+    for (const click of clicks) module.commitLinkNavigation(click)
     if (pendingPop) {
-      pendingPop = false;
-      module.onPopState();
+      pendingPop = false
+      module.onPopState()
     }
-  });
+  })
 }
 
 function whenIdle(run: () => void) {
-  if (typeof requestIdleCallback === 'function') requestIdleCallback(() => run(), { timeout: 1000 });
-  else setTimeout(run, 1);
+  if (typeof requestIdleCallback === 'function') requestIdleCallback(() => run(), { timeout: 1000 })
+  else setTimeout(run, 1)
 }
 
 export function installRouter() {
-  if ((!process.browser && typeof window === 'undefined') || window.__PNEXT_ROUTER_INSTALLED__) return;
-  window.__PNEXT_ROUTER_INSTALLED__ = true;
-  if ('scrollRestoration' in history) history.scrollRestoration = 'manual';
+  if ((!process.browser && typeof window === 'undefined') || window.__PNEXT_ROUTER_INSTALLED__)
+    return
+  window.__PNEXT_ROUTER_INSTALLED__ = true
+  if ('scrollRestoration' in history) history.scrollRestoration = 'manual'
   // Seed the bfcache departing key with the hard-loaded route so the first
   // navigation away stashes this route's island state under the right key.
   // `locationKey()` IS `bfRouteKey(location.pathname, location.search)` — the
   // hub's own definition — and it is already on the first-paint graph.
-  routerState.activeRouteKey = locationKey();
+  routerState.activeRouteKey = locationKey()
 
-  document.addEventListener('click', hubLinkClick);
-  window.addEventListener('popstate', hubPopState);
-  whenIdle(() => void loadRuntime());
+  document.addEventListener('click', hubLinkClick)
+  window.addEventListener('popstate', hubPopState)
+  whenIdle(() => void loadRuntime())
 }