@abide/abide 0.40.0 → 0.40.2

package/src/lib/ui/compile/renameSignalRefs.ts

@@ -1,4 +1,5 @@
 import ts from 'typescript'
+import { TS_PRINTER } from './TS_PRINTER.ts'
 
 /*
 Rewrites references to a component's signal bindings into the document form the
@@ -24,104 +25,177 @@ export function renameSignalRefs(
     computedNames: ReadonlySet<string> = new Set(),
 ): string {
     const source = ts.createSourceFile('component.ts', code, ts.ScriptTarget.Latest, true)
+    const result = ts.transform(source, [
+        signalRefsTransformer(stateNames, derivedNames, computedNames),
+    ])
+    const output = TS_PRINTER.printFile(result.transformed[0] as ts.SourceFile)
+    result.dispose()
+    return output
+}
 
+/*
+The signal-rewrite as a `ts.TransformerFactory`, so the script pipeline can chain it
+with `docAccessTransformer` over a SINGLE parsed tree (see `lowerScript`) instead of
+print-then-reparse between passes. `renameSignalRefs` is the standalone string wrapper
+kept for per-expression callers (`lowerContext`).
+*/
+export function signalRefsTransformer(
+    stateNames: ReadonlySet<string>,
+    derivedNames: ReadonlySet<string>,
+    computedNames: ReadonlySet<string> = new Set(),
+): ts.TransformerFactory<ts.SourceFile> {
     /* The signal names that a nested binding can shadow — only these matter for
        scope tracking, so we ignore every other local binding. */
     const signalNames = new Set<string>([...stateNames, ...derivedNames, ...computedNames])
-
-    /* Identifier nodes that are names, not value reads — never rewritten. */
-    const skip = new Set<ts.Node>()
-    const collect = (node: ts.Node): void => {
-        if (ts.isPropertyAccessExpression(node)) {
-            skip.add(node.name)
-        }
-        /* A declaration name is a binding, not a value read. A plain identifier is
-           skipped directly; a destructuring pattern's leaf names are collected so a
-           bound name shadowing a signal (`const { count } = …`) is never rewritten. */
-        if (ts.isVariableDeclaration(node)) {
-            if (ts.isIdentifier(node.name)) {
-                skip.add(node.name)
-            } else {
-                collectBindingIdentifiers(node.name, skip)
+    return (context) => (root) => {
+        /* The identifier nodes that are names, not value reads — collected by walking
+           each parent and recording its name children (`parent.name`, a label, a
+           specifier). Read structurally, NOT via `child.parent`, so it holds on
+           synthesized nodes too — `desugar`'s rewritten declarations carry no parent
+           pointers, and chaining this transformer after `desugarTransformer` over one
+           tree must still classify their refs correctly. */
+        const nameSlots = collectNameSlots(root)
+        /* Each visitor carries the set of signal names shadowed by the scopes it sits
+           inside; entering a scope that re-binds a signal name produces a fresh visitor
+           with that name added, so shadowing is per-branch (a sibling scope is unaffected). */
+        const makeVisitor = (shadowed: ReadonlySet<string>): ts.Visitor => {
+            const visit = (node: ts.Node): ts.Node => {
+                /* Type space never holds a value read. A type alias, an interface, or any
+                   type annotation can name a signal — a prop-type member `option?: …`, a
+                   `typeof x` — without it being a runtime reference. Leave the whole type
+                   subtree untouched so it isn't rewritten into a call/access (`option()`)
+                   and emitted as broken code (types erase at build anyway). */
+                if (
+                    ts.isTypeAliasDeclaration(node) ||
+                    ts.isInterfaceDeclaration(node) ||
+                    ts.isTypeNode(node)
+                ) {
+                    return node
+                }
+                /* Import/export specifiers are binding/module names, never value reads.
+                   An aliased import whose original name collides with a signal
+                   (`import { pending as p }` next to a `pending` prop) would otherwise
+                   have its `pending` specifier rewritten to the reader form, corrupting
+                   the declaration. Leave the whole subtree untouched. */
+                if (ts.isImportDeclaration(node) || ts.isExportDeclaration(node)) {
+                    return node
+                }
+                /* Shorthand `{ count }` → `{ count: model.count }` / `{ total: total.value }`,
+                   unless a nearer scope shadows the name. */
+                if (ts.isShorthandPropertyAssignment(node) && !shadowed.has(node.name.text)) {
+                    const replacement = referenceFor(
+                        node.name.text,
+                        stateNames,
+                        derivedNames,
+                        computedNames,
+                    )
+                    if (replacement !== undefined) {
+                        return ts.factory.createPropertyAssignment(node.name.text, replacement)
+                    }
+                }
+                if (ts.isIdentifier(node) && !nameSlots.has(node) && !shadowed.has(node.text)) {
+                    const replacement = referenceFor(
+                        node.text,
+                        stateNames,
+                        derivedNames,
+                        computedNames,
+                    )
+                    if (replacement !== undefined) {
+                        return replacement
+                    }
+                }
+                /* Recurse with the scope this node introduces folded in (same visitor when
+                   it adds no shadowing name, so unscoped subtrees allocate nothing extra). */
+                const inner = extendShadowed(node, shadowed, signalNames)
+                return ts.visitEachChild(
+                    node,
+                    inner === shadowed ? visit : makeVisitor(inner),
+                    context,
+                )
             }
+            return visit
         }
-        if (ts.isParameter(node) && ts.isIdentifier(node.name)) {
-            skip.add(node.name)
+        return ts.visitNode(root, makeVisitor(new Set())) as ts.SourceFile
+    }
+}
+
+/*
+Collects every identifier NODE that occupies a name/label/specifier slot — a position
+that DECLARES, NAMES, or LABELS rather than READS. Walks each PARENT and records its
+name children (`parent.name`, a label, a specifier), so it reads structure top-down
+and never touches `child.parent` — it therefore holds on synthesized nodes (e.g.
+`desugar`'s rewritten declarations), which carry no parent pointers. The visitor then
+rewrites any identifier NOT in this set (rewrite is the default — value reads appear
+under almost any expression parent and can't be allow-listed), so this set is the
+exhaustive list of non-read slots. It is positional, so `pending` in
+`import { pending as p }` and `pending` in `pending(query)` are told apart by where
+they sit. A non-read slot missing here would be misread as a value read and rewritten
+into broken syntax, so completeness is NOT self-evident — it is guarded empirically by
+the syntax fuzz corpus (`uiCompileSyntaxFuzz.test.ts`), which transpiles each pass's
+output and fails on any corruption.
+*/
+function collectNameSlots(root: ts.Node): Set<ts.Node> {
+    const slots = new Set<ts.Node>()
+    const add = (name: ts.Node | undefined): void => {
+        if (name !== undefined && ts.isIdentifier(name)) {
+            slots.add(name)
         }
-        if (ts.isPropertyAssignment(node) && ts.isIdentifier(node.name)) {
-            skip.add(node.name)
+    }
+    const visit = (node: ts.Node): void => {
+        /* `obj.NAME` — the member name; the object side (`.expression`) is the read. */
+        if (ts.isPropertyAccessExpression(node)) {
+            add(node.name)
         }
+        /* `NAME: value`, and method/property/accessor/enum-member names in classes,
+           object literals, and type members. */
         if (
-            (ts.isFunctionDeclaration(node) || ts.isFunctionExpression(node)) &&
-            node.name !== undefined
+            ts.isPropertyAssignment(node) ||
+            ts.isMethodDeclaration(node) ||
+            ts.isPropertyDeclaration(node) ||
+            ts.isGetAccessorDeclaration(node) ||
+            ts.isSetAccessorDeclaration(node) ||
+            ts.isMethodSignature(node) ||
+            ts.isPropertySignature(node) ||
+            ts.isEnumMember(node)
+        ) {
+            add(node.name)
+        }
+        /* Declaration names: const/let/var, parameters, named functions and classes. */
+        if (
+            ts.isVariableDeclaration(node) ||
+            ts.isParameter(node) ||
+            ts.isFunctionDeclaration(node) ||
+            ts.isFunctionExpression(node) ||
+            ts.isClassDeclaration(node) ||
+            ts.isClassExpression(node)
         ) {
-            skip.add(node.name)
+            add(node.name)
+        }
+        /* A destructure element binds (`{ a }` / `[a]`) or renames (`{ a: b }`): both
+           the bound name and the source key are names, not reads. */
+        if (ts.isBindingElement(node)) {
+            add(node.name)
+            add(node.propertyName)
+        }
+        /* Labels: `NAME:` and `break NAME` / `continue NAME`. */
+        if (ts.isLabeledStatement(node)) {
+            add(node.label)
+        }
+        if (ts.isBreakStatement(node) || ts.isContinueStatement(node)) {
+            add(node.label)
+        }
+        /* Import/export specifier and clause names. */
+        if (ts.isImportSpecifier(node) || ts.isExportSpecifier(node)) {
+            add(node.name)
+            add(node.propertyName)
         }
-        ts.forEachChild(node, collect)
+        if (ts.isImportClause(node) || ts.isNamespaceImport(node) || ts.isNamespaceExport(node)) {
+            add(node.name)
+        }
+        ts.forEachChild(node, visit)
     }
-    collect(source)
-
-    const result = ts.transform(source, [
-        (context) => (root) => {
-            /* Each visitor carries the set of signal names shadowed by the scopes it sits
-               inside; entering a scope that re-binds a signal name produces a fresh visitor
-               with that name added, so shadowing is per-branch (a sibling scope is unaffected). */
-            const makeVisitor = (shadowed: ReadonlySet<string>): ts.Visitor => {
-                const visit = (node: ts.Node): ts.Node => {
-                    /* Type space never holds a value read. A type alias, an interface, or any
-                       type annotation can name a signal — a prop-type member `option?: …`, a
-                       `typeof x` — without it being a runtime reference. Leave the whole type
-                       subtree untouched so it isn't rewritten into a call/access (`option()`)
-                       and emitted as broken code (types erase at build anyway). */
-                    if (
-                        ts.isTypeAliasDeclaration(node) ||
-                        ts.isInterfaceDeclaration(node) ||
-                        ts.isTypeNode(node)
-                    ) {
-                        return node
-                    }
-                    /* Shorthand `{ count }` → `{ count: model.count }` / `{ total: total.value }`,
-                       unless a nearer scope shadows the name. */
-                    if (ts.isShorthandPropertyAssignment(node) && !shadowed.has(node.name.text)) {
-                        const replacement = referenceFor(
-                            node.name.text,
-                            stateNames,
-                            derivedNames,
-                            computedNames,
-                        )
-                        if (replacement !== undefined) {
-                            return ts.factory.createPropertyAssignment(node.name.text, replacement)
-                        }
-                    }
-                    if (ts.isIdentifier(node) && !skip.has(node) && !shadowed.has(node.text)) {
-                        const replacement = referenceFor(
-                            node.text,
-                            stateNames,
-                            derivedNames,
-                            computedNames,
-                        )
-                        if (replacement !== undefined) {
-                            return replacement
-                        }
-                    }
-                    /* Recurse with the scope this node introduces folded in (same visitor when
-                       it adds no shadowing name, so unscoped subtrees allocate nothing extra). */
-                    const inner = extendShadowed(node, shadowed, signalNames)
-                    return ts.visitEachChild(
-                        node,
-                        inner === shadowed ? visit : makeVisitor(inner),
-                        context,
-                    )
-                }
-                return visit
-            }
-            return ts.visitNode(root, makeVisitor(new Set())) as ts.SourceFile
-        },
-    ])
-    const printer = ts.createPrinter({ newLine: ts.NewLineKind.LineFeed })
-    const output = printer.printFile(result.transformed[0] as ts.SourceFile)
-    result.dispose()
-    return output
+    visit(root)
+    return slots
 }
 
 /* The shadowed-name set for `node`'s children: the parent set plus any signal name
@@ -199,22 +273,6 @@ function collectStatementBindings(statement: ts.Statement, into: Set<string>): v
     }
 }
 
-/* The identifier NODES a binding name binds — a plain identifier or the leaves of a
-   destructuring pattern (object/array, including nested patterns and rest elements).
-   For `{ a: b }` only the bound name `b` is a binding; `a` is the source property.
-   Feeds the skip set so a destructured name shadowing a signal is never rewritten. */
-function collectBindingIdentifiers(name: ts.BindingName, into: Set<ts.Node>): void {
-    if (ts.isIdentifier(name)) {
-        into.add(name)
-        return
-    }
-    for (const element of name.elements) {
-        if (ts.isBindingElement(element)) {
-            collectBindingIdentifiers(element.name, into)
-        }
-    }
-}
-
 /* Every identifier bound by a binding name — a plain identifier or the leaves of a
    destructuring pattern (object/array, including rest elements). */
 function collectBindingNames(name: ts.BindingName, into: Set<string>): void {

package/src/lib/ui/compile/stripEffects.ts

@@ -1,4 +1,5 @@
 import ts from 'typescript'
+import { TS_PRINTER } from './TS_PRINTER.ts'
 
 /*
 Removes `effect(...)` calls from a script for the SSR back-end. Effects are client
@@ -10,23 +11,27 @@ binding keeps a defined (unused) name. Client compilation keeps effects untouche
 */
 export function stripEffects(code: string): string {
     const source = ts.createSourceFile('script.ts', code, ts.ScriptTarget.Latest, true)
-    const result = ts.transform(source, [
-        (context) => (root) => {
-            const visit = (node: ts.Node): ts.Node => {
-                if (
-                    ts.isCallExpression(node) &&
-                    ts.isIdentifier(node.expression) &&
-                    node.expression.text === 'effect'
-                ) {
-                    return ts.factory.createIdentifier('undefined')
-                }
-                return ts.visitEachChild(node, visit, context)
-            }
-            return ts.visitNode(root, visit) as ts.SourceFile
-        },
-    ])
-    const printer = ts.createPrinter({ newLine: ts.NewLineKind.LineFeed })
-    const output = printer.printFile(result.transformed[0] as ts.SourceFile)
+    const result = ts.transform(source, [stripEffectsTransformer()])
+    const output = TS_PRINTER.printFile(result.transformed[0] as ts.SourceFile)
     result.dispose()
     return output
 }
+
+/* The effect-stripping as a `ts.TransformerFactory`, so the SSR script path can run it
+   over the tree `lowerScript` already built (one extra print, no reparse). `stripEffects`
+   is the standalone string wrapper kept for the per-nested-`<script>` SSR callers. */
+export function stripEffectsTransformer(): ts.TransformerFactory<ts.SourceFile> {
+    return (context) => (root) => {
+        const visit = (node: ts.Node): ts.Node => {
+            if (
+                ts.isCallExpression(node) &&
+                ts.isIdentifier(node.expression) &&
+                node.expression.text === 'effect'
+            ) {
+                return ts.factory.createIdentifier('undefined')
+            }
+            return ts.visitEachChild(node, visit, context)
+        }
+        return ts.visitNode(root, visit) as ts.SourceFile
+    }
+}

package/src/lib/ui/compile/types/AnalyzedComponent.ts

@@ -7,7 +7,12 @@ The shared front-end result for a component, consumed by both the client
 (so template expressions rewrite consistently), and the parsed template tree.
 */
 export type AnalyzedComponent = {
+    /* The lowered client script — keeps `effect(...)` calls (client lifecycle). */
     script: string
+    /* The same lowered script with `effect(...)` calls stripped, for the SSR render
+       (effects emit no HTML and must not run on the server). Produced from the one
+       parse `script` came from, not a downstream re-parse. */
+    ssrScript: string
     /* Top-level import statements hoisted out of the script (e.g. child
        components), placed at module scope by the module wrapper. */
     imports: string

package/src/lib/ui/dom/awaitBlock.ts

@@ -223,7 +223,14 @@ export function awaitBlock(
            subscribes to its reactive source (a cache key). A cache-remote read is warm
            on resume — it serves the snapshot without a network round-trip, so adoption
            stays no-flash AND a later cache.invalidate re-runs the block. Without this
-           read a resume-adopted block has no deps and invalidate is a no-op. */
+           read a resume-adopted block has no deps and invalidate is a no-op.
+
+           ONLY the promise read is tracked. The warm-sync resolve, the hydration adopt,
+           and the pending render all BUILD the branch through `scope`, which builds
+           untracked — so the branch's own reactive reads don't subscribe THIS effect
+           (otherwise the whole block re-runs and re-suspends on any branch-state change,
+           e.g. a sibling route param updating in place). The branch's own child effects
+           still track normally; the block re-runs only when the promise source does. */
         const result = promiseThunk()
         if (first) {
             first = false

package/src/lib/ui/dom/each.ts

@@ -45,6 +45,10 @@ export function each<T>(
        claim): claim the start marker, build content in place, claim the end marker.
        Create mode: markers + content in a fragment, held in `pending` until placement
        inserts it. */
+    /* Reconcile runs inside the effect below; the row build doesn't subscribe it
+       (`scope` builds untracked), so a raw reactive read in the row content — e.g. a
+       nested `<script>` body — can't re-reconcile the whole list. Only `items()` drives
+       the each; each row's own interpolations track through their own effects. */
     const buildRow = (item: T): EachRow => {
         const hydration = RENDER.hydration
         if (hydration !== undefined) {

package/src/lib/ui/dom/switchBlock.ts

@@ -42,6 +42,10 @@ export function switchBlock(
     }
     const caseAt = (index: number): SwitchCase | undefined =>
         index === -1 ? undefined : cases[index]
+    /* The chosen case builds through `scope` (directly on hydrate, via `fillBefore` on a
+       swap), which builds untracked — so a raw reactive read in the case content doesn't
+       subscribe the swap effect below; only `subject()` (and each case's `match()`) drives
+       the swap. The case's own interpolations still track, each through its own effect. */
 
     /* `before` places the range among static siblings on create (block before a suffix);
        hydrate ignores it and uses the parked claim cursor. */

package/src/lib/ui/dom/when.ts

@@ -28,6 +28,10 @@ export function when(
     before: Node | null = null,
 ): void {
     const hydration = RENDER.hydration
+    /* The chosen branch builds through `scope` (directly on hydrate, via `fillBefore`
+       on a swap), which builds untracked — so a raw reactive read in the branch content
+       doesn't subscribe the swap effect below; only `condition()` drives the toggle. The
+       branch's own interpolations still track, each through its own effect. */
     const chosenFor = (branch: 'then' | 'else') => (branch === 'then' ? render : renderElse)
     /* The live branch's scope, registered with the owner so it disposes on owner
        teardown — not only on a branch flip via clearBetween. */

package/src/lib/ui/installInspectorBridge.ts

@@ -49,7 +49,9 @@ function routerState() {
     return {
         path: runtimePath.value,
         route: page.route,
-        params: page.params,
+        /* `page.params` is a reactive Proxy — structuredClone (postMessage) can't carry
+           a Proxy and throws, dropping every router frame. Spread to a plain object. */
+        params: { ...page.params },
         navigating: page.navigating,
         url: page.url.href,
         entry: historyEntries.current,

package/src/lib/ui/router.ts

@@ -36,6 +36,47 @@ const resolveUrl = (path: string): URL =>
         ? new URL(`http://localhost${path}`)
         : new URL(path, location.origin)
 
+/* A full browser load is the recovery for an import/probe failure — offline, a hashed
+   chunk name rotated by a deploy, a transient 5xx. But a DETERMINISTIC failure (a chunk
+   that throws every load) would reload forever. Bound it per destination: after
+   MAX_RECOVERY_RELOADS consecutive reloads of the same URL, stop and leave the error
+   visible instead of thrashing. `sessionStorage` so the count survives the reload it
+   triggers (and clears with the tab); absent it (SSR / privacy mode), fall back to a
+   single reload. `clearRecoveryReloads` resets the count once that URL mounts cleanly,
+   so a later genuine blip gets its reload again. */
+const MAX_RECOVERY_RELOADS = 2
+const reloadCountKey = (url: string): string => `abide:reload:${url}`
+
+function boundedReload(url: string): void {
+    if (typeof location === 'undefined') {
+        return
+    }
+    let count = 0
+    try {
+        count = Number(sessionStorage.getItem(reloadCountKey(url)) ?? '0')
+        sessionStorage.setItem(reloadCountKey(url), String(count + 1))
+    } catch {
+        /* sessionStorage blocked — proceed with an unbounded single reload. */
+    }
+    if (count >= MAX_RECOVERY_RELOADS) {
+        console.error(
+            `[abide] gave up reloading ${url} after ${count} attempts — the page keeps failing to load. See the error above.`,
+        )
+        return
+    }
+    location.href = url
+}
+
+/* A URL mounted cleanly — forget its reload history so a future transient failure there
+   is allowed to recover by reloading again. */
+function clearRecoveryReloads(url: string): void {
+    try {
+        sessionStorage.removeItem(reloadCountKey(url))
+    } catch {
+        /* nothing persisted — nothing to clear. */
+    }
+}
+
 /*
 A minimal client router on the History API. `router` matches the current path
 against the route patterns (literal / `[name]` / `[...rest]`, via matchRoute),
@@ -73,6 +114,11 @@ export function router(
     /* The mounted layout chain (outermost first) + the page disposer. */
     const mountedLayouts: MountedLayout[] = []
     let disposePage: (() => void) | undefined
+    /* The route key of the currently mounted leaf page — its identity for the
+       same-page in-place diff: when a navigation resolves to this same key with an
+       unchanged layout chain, only params/url differ, so the page stays mounted and
+       updates through the reactive `page` proxy (no teardown). */
+    let mountedPageKey: string | undefined
     /* The root outlet boundary in `host` (`#app`) the outermost layer fills — established
        once on the first mount (claimed from the SSR DOM when hydrating, created otherwise)
        and reused across navigations, since `#app` itself never re-mounts. */
@@ -167,6 +213,7 @@ export function router(
                 boundary = slot
             }
             if (pageView === undefined) {
+                mountedPageKey = undefined
                 return
             }
             disposePage = fillBoundary(
@@ -177,6 +224,7 @@ export function router(
                 /* The page's route key names its scope in the inspector (see above). */
                 pageKey,
             ).dispose
+            mountedPageKey = pageKey
         }
         if (hydrating) {
             const previous = RENDER.hydration
@@ -357,9 +405,7 @@ export function router(
                     /* handle() blocked it / redirected off-origin / the probe failed:
                    let the browser load the server's real response. */
                     if (decision.kind === 'reload') {
-                        if (typeof location !== 'undefined') {
-                            location.href = decision.url
-                        }
+                        boundedReload(decision.url)
                         return
                     }
                     const layoutViews = resolvedLayouts.filter(
@@ -377,6 +423,36 @@ export function router(
                     }
                     const hydrating = first && pageView?.hydratable === true
                     first = false
+                    /* Same page, same layout chain — only params/url differ (e.g. stepping
+                       between episodes on one detail page). The whole structure survives, so
+                       publish the new snapshot on the reactive `page` proxy and let the mounted
+                       page + layouts re-derive in place — no teardown, no rebuild, so local
+                       state, scroll, and DOM are kept (the persistence layouts already get,
+                       now extended to the leaf). A reader keyed on an *unchanged* param (a page
+                       whose data is `cache(...)({ id: page.params.id })`) doesn't re-fire at
+                       all — value-memoised computeds stop the equal id from waking it — so the
+                       page's blocking await never re-suspends. No view transition: nothing
+                       structurally swaps. */
+                    const targetUrl = resolveUrl(path)
+                    const samePageInPlace =
+                        pageView !== undefined &&
+                        key === mountedPageKey &&
+                        divergence === mountedLayouts.length &&
+                        divergence === chainKeys.length &&
+                        /* A differing query is page data — it still rebuilds, matching the
+                           hash-only fast path's guard. Only path-param changes within the same
+                           route key (e.g. the episode segment) take the in-place route. */
+                        clientPage.value.url.search === targetUrl.search
+                    if (samePageInPlace) {
+                        clientPage.value = {
+                            route: chainRoute,
+                            params,
+                            url: targetUrl,
+                            navigating: false,
+                        }
+                        historyEntries.restore(targetUrl.hash)
+                        return
+                    }
                     /* The DOM mutation a navigation makes: tear the divergent chain down
                    (clearing its content from its boundary) and rebuild into the same
                    boundary (hydration adopts in place). */
@@ -413,6 +489,23 @@ export function router(
                        (a fresh load with no persisted offset falls through to hash/top). */
                         historyEntries.restore(url.hash)
                     }
+                    /* Build / hydrate is the deterministic surface — a codegen defect or a
+                       throw in user render code fails the SAME way every load, so reloading
+                       would loop forever. Catch it HERE (not in the outer `.catch`, which a
+                       hydrating swap's synchronous throw would otherwise reach): surface the
+                       error and stop, never reload. A clean mount clears any prior recovery
+                       reloads for this URL so a later transient failure can recover again. */
+                    const commit = (): void => {
+                        try {
+                            swap()
+                            clearRecoveryReloads(resolveUrl(path).href)
+                        } catch (error) {
+                            console.error(
+                                `[abide] page at ${path} threw while mounting — not reloading (a reload would re-run the same failure):`,
+                                error,
+                            )
+                        }
+                    }
                     /* Wrap the swap in a View Transition where the browser supports it, so
                    the page change cross-fades (and shared `view-transition-name` elements
                    morph) — the synchronous swap is exactly the mutation the API snapshots
@@ -423,23 +516,23 @@ export function router(
                         typeof document !== 'undefined' &&
                         'startViewTransition' in document
                     ) {
-                        document.startViewTransition(swap)
+                        document.startViewTransition(commit)
                     } else {
-                        swap()
+                        commit()
                     }
                 })
-                .catch(() => {
-                    /* A page/layout chunk import (or the probe) rejected — offline, a hashed
-                   chunk filename rotated by a deploy, or a transient asset 5xx. Without
-                   this the navigating:true latched above never clears (a bound spinner
-                   spins forever) and the rejection surfaces as an unhandledrejection.
-                   Fall back to a full browser load so the server serves the target. */
+                .catch((error) => {
+                    /* A page/layout chunk IMPORT (or the probe) rejected — offline, a hashed
+                   chunk filename rotated by a deploy, or a transient asset 5xx: recoverable,
+                   so a full browser load is the right fallback (and clears the latched
+                   navigating:true, so a bound spinner doesn't spin forever). Bounded, so a
+                   chunk that fails to import every time can't reload-loop. Deterministic
+                   render throws don't land here — `commit` swallows them above. */
                     if (token !== sequence || disposed) {
                         return
                     }
-                    if (typeof location !== 'undefined') {
-                        location.href = resolveUrl(path).href
-                    }
+                    console.error(`[abide] failed to load page at ${path} — reloading:`, error)
+                    boundedReload(resolveUrl(path).href)
                 })
         })
     })

package/src/lib/ui/runtime/NODE_STATE.ts

@@ -0,0 +1,22 @@
+/*
+The three settle-states a reactive node moves through, for value-memoised
+(push-pull) propagation. CLEAN: the value is current. CHECK: a *transitive*
+dependency may have changed — the value can't be trusted until the direct deps are
+refreshed. DIRTY: a *direct* dependency changed — recompute.
+
+A signal write marks its direct subscribers DIRTY and the rest of their cone
+CHECK; a read then settles a node by refreshing only the deps that the check walk
+finds actually changed. A computed that recomputes to an `Object.is`-equal value
+leaves its subscribers untouched, so an unchanged value never wakes downstream —
+the memoisation a single bare boolean `dirty` flag (no CHECK tier, no value
+compare) couldn't express.
+*/
+/* Typed as `number` (not `as const` literals) so a `node.status === CHECK` guard
+   doesn't narrow the field to the literal `1` — the recursive `updateIfNecessary`
+   call mutates `status` out of band, which TS can't see, and a literal narrowing
+   would make the following `=== DIRTY` check a "no overlap" error. */
+export const NODE_STATE: {
+    readonly CLEAN: number
+    readonly CHECK: number
+    readonly DIRTY: number
+} = { CLEAN: 0, CHECK: 1, DIRTY: 2 }