sygnal 7.0.0 → 7.1.0

package/dist/guide/accessibility.md

@@ -218,7 +218,7 @@ Sizes.model = { SIZE: (state, size) => ({ ...state, size }) }
 An intent action comes only from `mouseenter` or `mouseover` (also `pointerenter` / `pointerover`), nothing else sends it, and it changes the state. Keyboard users never hover, and touch screens hover only on a tap, so a tooltip, preview or menu shown this way is out of their reach. Trigger it from focus too, and close it on blur as on mouse leave:
 
 ```jsx
-import xs from 'xstream'
+import { xs } from 'sygnal'
 
 // Flagged: SHOW: DOM.mouseenter('.info'), with nothing else sending SHOW
 

package/dist/guide/resources.md

@@ -56,6 +56,7 @@ Quote.model = {
 - **A refetch of the same request keeps what is shown.** `{ refresh: 'quote' }`, an [invalidation](#invalidation), a [focus or reconnect refetch](#focus-reconnect-and-polling), polling, or the same request declared again after a pause keep `status`, `data` and `error`, and set `refreshing: true` until the reply lands. Show a spinner next to the data, or treat `refreshing` like loading when the old data must not be visible.
 - **A new request clears it.** When the derived request changes (another id), the resource goes to `'loading'` with no data, and the earlier request is aborted: its reply never lands. For pagination, where the previous page should stay visible, set `keepPrevious: true` on the request: the old `data` stays (with `refreshing: true`) until the new page arrives.
 - **Change detection is by value.** A state change that derives an equal request (by JSON) sends nothing.
+- **An entry gets the context too**: `(state, context)`. A routed page reads `route` from context (`(state, { route }) => `/api/tasks/${route.params.id}``) instead of keeping a copy of it; the entries are computed again when the context changes ([Router](https://sygnal.js.org/guide/router/)).
 - `ok` / `error` on the request also dispatch those actions after the write, for side work such as appending pages.
 - A Collection item, or any component instance, has its own resources. Removing it aborts them.
 - In a hidden [Switchable](https://sygnal.js.org/guide/switchable/#hidden-pages-pause-connections-and-resources) page, resources pause: the request in flight is aborted and the resource keeps its last result (`refreshing` off; `'idle'` if nothing had arrived yet). When the page is shown again, the same request is refetched, keeping data. Mark an entry `background: true` to keep it live while hidden.
@@ -207,6 +208,7 @@ QuoteEditor.model = {
 - The value is a tag (`'quotes'`), a URL prefix of the request's `url` (a string starting with `/`: `'/api/quotes'`), an array of them, or a predicate `(request) => boolean`. Tags are explicit: nothing is derived from the URL.
 - Matching **mounted** resources refetch, keeping their data (`refreshing: true`); matching cache entries are marked stale, so the next use refetches. Invalidation works with or without the cache.
 - **Invalidation aborts older reads.** A refetch aborts the resource's read already in flight, so a reply sent before the save never lands after it: no request ids or sequence numbers. A shared cache fetch in flight for a matching entry still answers the requests waiting on it, but never writes the cache.
+- **An `ok` action that navigates is fine.** When the `ok` action changes the resource's request (a `ROUTER` move to the next record), the new request is sent and the invalidation never resends the old one after it.
 - An `invalidate` that matches nothing is reported as [SYG632](https://sygnal.js.org/reference/errors/#syg632) (info).
 
 ## Writing a reply into the cache

package/dist/guide/timers.md

@@ -24,7 +24,7 @@ The key is yours to choose (`TIMER` by convention): Sygnal finds the driver by t
 
 ## The timers static
 
-`timers` takes the state (with its calculated fields) and returns an object of named timers. Each value is a timer spec, or a falsy value for "not now":
+`timers` takes the state (with its calculated fields) and the component's context (its second argument, as for every declaration static) and returns an object of named timers. Each value is a timer spec, or a falsy value for "not now":
 
 ```jsx
 Game.timers = (state) => ({
@@ -42,7 +42,7 @@ Game.timers = (state) => ({
 
 Any spec can add `background: true` (see [hidden pages](#hidden-pages)). The action is one of the component's own actions: it goes to the instance that declared the timer, and every sink of its model entry runs, as for an intent action.
 
-Sygnal compares the result with the previous one, name by name, whenever the state changes:
+Sygnal compares the result with the previous one, name by name, whenever the state or the context changes:
 
 - a new name starts its timer;
 - a name that is gone, or now falsy, stops its timer;
@@ -55,7 +55,7 @@ So `timers` is a description, not a command: return what should be running now.
 
 An `every` timer schedules each tick from the moment it started, not from the previous tick: tick `n` is due at start + n × `every`. A late tick doesn't push the later ones back, so 1,000 ticks of 100 ms end 100 s after the start. Use the `t` in the data (or `Date.now()` in the intent) for elapsed time rather than counting ticks.
 
-When a tick comes very late (a browser throttles timers in a background tab), the missed ticks are not delivered one by one: they are coalesced into the next one, and `n` jumps over them.
+When a tick comes very late (a browser throttles timers in a background tab), the missed ticks are not delivered one by one: they are coalesced into the next one, and `n` jumps over them. A delay is never longer than `every`, so a test clock that fixes `Date.now()` while timers keep running (Playwright's `clock.setFixedTime()`) still gets one tick per interval.
 
 ## A stopwatch
 

package/dist/index.cjs.js

@@ -714,6 +714,7 @@ const DEV_CODE_SEVERITY = {
     SYG112: 'error',
     SYG115: 'warn',
     SYG116: 'error',
+    SYG117: 'warn',
     // PLAN-4 1-D: controls, static (sygnal-check)
     SYG124: 'error',
     SYG125: 'error',
@@ -725,6 +726,10 @@ const DEV_CODE_SEVERITY = {
     SYG129: 'warn',
     // PLAN-10 X-1: static only (sygnal-check)
     SYG170: 'warn',
+    // PLAN-13 X-1: static only (sygnal-check)
+    SYG302: 'info',
+    // PLAN-13 F-3 (checks/next.ts)
+    SYG429: 'warn',
     SYG171: 'warn',
     SYG221: 'error',
     // PLAN-4 GS-4 (state.ts)
@@ -1811,23 +1816,24 @@ const shownOf = (inst) => {
 function checkStatics(inst) {
     if (inst.disposed)
         return;
-    const s = inst.cell.get(), shown = shownOf(inst);
+    const s = inst.cell.get(), shown = shownOf(inst), c = inst.context();
     // no state yet: nothing declared (as the state stream, which skips undefined)
-    if (s === undefined || (s === inst.sS && shown === inst.sH))
+    if (s === undefined || (s === inst.sS && shown === inst.sH && c === inst.sC))
         return;
     inst.sS = s;
     inst.sH = shown;
+    inst.sC = c;
     const view = inst.def.view, sv = inst.sv;
     for (const [n, k] of inst.st) {
         const f = view[k];
         let v = f;
         try {
             if (typeof f == 'function')
-                v = f(s);
+                v = f(s, c);
             else if (f && typeof f == 'object') {
                 v = {};
                 for (const r in f)
-                    v[r] = f[r](s);
+                    v[r] = f[r](s, c);
             }
         }
         catch (e) {
@@ -2238,6 +2244,14 @@ function bindingChanged(a, b) {
     return x && y ? !x.every((v, i) => Object.is(v, y[i]))
         : !!(x || y || typeof a == 'string' || typeof b == 'string' || a === undefined || b === undefined);
 }
+/** a binding whose target is known (a key, a byId selection): its deletion ends the child */
+const known$1 = (b) => typeof b == 'string' || b?.[BINDING];
+/** F-3: `owner` watches child (or Switchable page) `k`'s target: notify() disposes it when deleted */
+function watch(owner, k) {
+    k.bs = bindingState(k);
+    (owner.bound || (owner.bound = new Set())).add(k);
+    owner.app.watchers.add(owner);
+}
 function bindingState(k) {
     const c = k.base || k.cell || k.arr;
     return c && (c.has?.() ?? c.get() !== undefined) ? (k.cell || k.arr).get() : undefined;
@@ -2824,11 +2838,8 @@ class Inst {
                     k.setProps(props, children, n, id);
                 else
                     this.kids.set(id, k = host ? this.host(host, props, children, id, n) : this.child(view, props, children, id, !!data.props?.resetState));
-                if (typeof props[binding] == 'string' || props[binding]?.[BINDING]) {
-                    k.bs = bindingState(k);
-                    (this.bound || (this.bound = new Set())).add(k);
-                    this.app.watchers.add(this);
-                }
+                if (known$1(props[binding]))
+                    watch(this, k);
                 return;
             }
             if (posts[sel] && !(ps || (ps = [])).includes(sel))
@@ -4237,6 +4248,8 @@ function check$3(owner, props) {
     if (!(cur in of))
         fail$2('SYG416', owner, `Switchable 'current' '${cur}' is not a key of 'of'`, CUR_FIX);
 }
+/** F-3: a per-page map (an object that is not a lens or a byId selection: no `get`), or null */
+const mapOf = (st) => isObj$2(st) && typeof st.get != 'function' ? st : null;
 /** a page's props: the Switchable's, kept by identity while equal (`of` compared shallowly) */
 function sameProps(a, b) {
     if (!a || !b)
@@ -4258,10 +4271,11 @@ class SwitchableHost {
         this.lr = true;
         this.kids = [];
         check$3(owner, props);
-        const st = props.state, calc = typeof st == 'string' && owner.def.calcNames?.has(pathOf$1(st)[0]);
-        this.cell = typeof st == 'string' ? keyCell(owner.cell, st, calc && owner.def.name, undefined, 'Switchable sub-component')
-            : st !== undefined ? lensCell(owner.cell, st, owner.def.name, (e) => owner.app.appError(owner, e, 'view'))
-                : owner.cell;
+        const st = props.state;
+        // F-3: `state={{ page: key | lens | byId }}` (not a lens, not a byId selection): each listed
+        // page binds its own target, with a tag child's lifetime rules; the others share the owner's state
+        this.map = mapOf(st);
+        this.cell = this.bind(this.map ? undefined : st);
         this.uidBase = owner.uid(uidPart(id.replace(/.*::(r\.)?/, '')));
         this.props = props;
         this.kids = children;
@@ -4271,9 +4285,16 @@ class SwitchableHost {
         }
         this.setProps(props, children);
     }
+    bind(st) {
+        const owner = this.owner, calc = typeof st == 'string' && owner.def.calcNames?.has(pathOf$1(st)[0]);
+        return typeof st == 'string' ? keyCell(owner.cell, st, calc && owner.def.name, undefined, 'Switchable sub-component')
+            : st !== undefined ? lensCell(owner.cell, st, owner.def.name, (e) => owner.app.appError(owner, e, 'view'))
+                : owner.cell;
+    }
     make(name, view) {
         const o = this.owner, app = o.app, def = app.def(view), scope = app.scope();
-        const inst = new Inst(app, def, o, def.isolated ? localCell(app, this.cell) : this.cell, o.dom && o.dom.isolateSource(o.dom, scope), this.props, this.kids, scope, this.uidBase + '-' + uidPart(name), 'page');
+        const c = this.map ? this.bind(this.map[name]) : this.cell;
+        const inst = new Inst(app, def, o, def.isolated ? localCell(app, c) : c, o.dom && o.dom.isolateSource(o.dom, scope), this.props, this.kids, scope, this.uidBase + '-' + uidPart(name), 'page');
         inst.shown = false;
         return inst;
     }
@@ -4290,15 +4311,21 @@ class SwitchableHost {
             for (const n in this.pages)
                 this.pages[n].inst.setProps(props, children);
         }
+        // F-3: a page whose own binding target changed (7.0's rule, per page), or that the owner
+        // disposed because its target was deleted, is made again
+        const m = this.map, nm = this.map = mapOf(props.state);
         // G-317: a lazy() page that has loaded is made again with the loaded component
         for (const n in this.pages) {
             const p = this.pages[n], fn = resolve$2(p.view, this.owner);
-            if (fn !== p.fn) {
+            if (fn !== p.fn || p.inst.disposed || m && nm && bindingChanged(m[n], nm[n])) {
                 const shown = p.inst.shown;
-                p.inst.dispose();
+                p.inst.disposed || p.inst.dispose();
                 p.inst = this.make(n, p.fn = fn);
                 p.inst.shown = shown;
             }
+            // the owner disposes a page whose target is deleted, as a tag child; it is made again above
+            if (nm && known$1(nm[n]))
+                watch(this.owner, p.inst);
         }
         const page = this.pages[cur];
         if (page) {
@@ -5910,6 +5937,10 @@ function makeFetchDriver(options = {}) {
                 write(s, n, R, L.status, L.data, L.error, true);
             else
                 write(s, n, R, 'loading');
+            // R-1: the write is dispatched synchronously; when it changed the request (a navigation
+            // recomputed the statics and a nested load sent the new one) or paused it, q is stale
+            if (R.q !== q || R.p)
+                return;
             if (go || q.validate)
                 R.i = send(q, s, n, after, R);
         };
@@ -6374,6 +6405,9 @@ async function* sse(res, meta) {
     try {
         for (;;) {
             const r = await reader.read();
+            // PLAN-13 S-1: any bytes (a heartbeat comment too) show the stream is alive
+            if (!r.done)
+                meta?.beat?.();
             // line ends -> \n (a \r at a chunk's end waits: it may be half of a \r\n)
             let s = cr + (r.done ? '\n\n' : dec.decode(r.value, { stream: true }));
             cr = !r.done && s.endsWith('\r') ? '\r' : '';
@@ -6455,6 +6489,8 @@ const dev$8 = (...a) => g$6.__SYGNAL_DIAGNOSTICS__?.chat?.(...a);
  * - a non-2xx status or another content type: `error` with readyState CLOSED (no retry; the
  *   driver's reconnect policy decides);
  * - `close()` aborts the request and stops retrying.
+ * - PLAN-13 S-1: `init.lastEventId` seeds the id sent as `Last-Event-ID` (a driver reconnect that
+ *   resumes); `onbeat` (not EventSource's) is called for any bytes read, heartbeat comments too.
  */
 const NAMES = ['CONNECTING', 'OPEN', 'CLOSED'];
 class FetchEventSource {
@@ -6463,11 +6499,14 @@ class FetchEventSource {
         this.onopen = null;
         this.onmessage = null;
         this.onerror = null;
+        this.onbeat = null;
         this.ls = new Map();
-        this.meta = { id: '', retry: 3000 };
+        this.meta = { id: '', retry: 3000, beat: () => this.onbeat?.() };
         this.url = url;
         this.withCredentials = !!init.withCredentials;
         this.init = init;
+        if (init.lastEventId)
+            this.meta.id = init.lastEventId;
         queueMicrotask(() => this.connect());
     }
     addEventListener(type, f) {
@@ -6603,6 +6642,12 @@ FetchEventSource.CLOSED = 2;
  *   changed header reconnects) is read with FetchEventSource (fetch, `options.fetch` if given),
  *   since EventSource can't send headers. An `options.EventSource` (a polyfill, the test fake)
  *   still wins and gets the headers in its init.
+ * - PLAN-13 S-1: SSE `meta: true`: message and `events` actions get `{ data, id, event }`. `resume:
+ *   true | 'param'`: the transport keeps the last event id, and a reconnect the driver makes (after
+ *   EventSource gave up) asks to resume from it: `?lastEventId=` (or `?param=`) on the URL, or
+ *   `Last-Event-ID` on the fetch path (`init.lastEventId`). `staleAfterMs` (SSE and WebSocket): no
+ *   event for that long (over fetch: no bytes, heartbeat comments count) closes the connection as a
+ *   drop (`close` gets `stale: true`), so the reconnect policy applies.
  */
 const SCOPE$1 = '__sygnalScope';
 const scopeOf = (v) => v[SCOPE$1] || [];
@@ -6672,20 +6717,48 @@ function makeSocketDriver(options = {}) {
                 deliver(e, 'error', { error });
             }
         };
+        // S-1: an SSE event as a subscriber gets it (`meta`: with its id and type); the transport
+        // keeps the last id (resume) and counts it as life (staleAfterMs)
+        const got = (t, m, e) => e.sse && e.spec.meta ? { data: parse(m.data), id: m.lastEventId ?? '', event: m.type || 'message' } : parse(m.data);
+        const seen = (t, m) => { if (m.lastEventId)
+            t.id = m.lastEventId; alive(t); };
         // SSE named events: one listener per name across the subscribers
         const listen = (t) => t.s && t.sse && each(t, e => Object.keys(e.spec.events || {}).forEach(name => {
             if (t.on.has(name))
                 return;
             t.on.add(name);
             const s = t.s;
-            s.addEventListener(name, (m) => t.s === s && each(t, x => {
-                const a = x.spec.events?.[name];
-                if (typeof a == 'string' && x.sender !== undefined)
-                    reply(x.sender, a, parse(m.data));
-            }));
+            s.addEventListener(name, (m) => {
+                if (t.s !== s)
+                    return;
+                seen(t, m);
+                each(t, x => {
+                    const a = x.spec.events?.[name];
+                    if (typeof a == 'string' && x.sender !== undefined)
+                        reply(x.sender, a, got(t, m, x));
+                });
+            });
         }));
+        // S-1: staleAfterMs (the smallest of the subscribers'): re-armed by every event; when it fires
+        // the connection is dropped (as if the server had gone) and the reconnect policy applies
+        const alive = (t) => {
+            clearTimeout(t.st);
+            const ms = Math.min(...[...t.subs].map(e => e.spec.staleAfterMs).filter(x => x > 0));
+            const s = t.s;
+            if (s && ms < 1 / 0)
+                t.st = setTimeout(() => {
+                    if (t.s !== s)
+                        return;
+                    try {
+                        s.close();
+                    }
+                    catch (_) { }
+                    gone(t, t.sse ? { stale: true } : { code: 1006, reason: 'stale', stale: true });
+                }, ms);
+        };
         // the socket closed (or failed to open) without the driver closing it
         const gone = (t, info) => {
+            clearTimeout(t.st);
             t.s = null;
             t.open = false;
             let again;
@@ -6706,9 +6779,19 @@ function makeSocketDriver(options = {}) {
             const C = t.sse ? options.EventSource ?? (hdr && typeof g.fetch == 'function' ? FetchEventSource : g.EventSource) : options.WebSocket ?? g.WebSocket;
             if (typeof C != 'function')
                 return;
+            // S-1: resume from the last event id: Last-Event-ID on the fetch path (init.lastEventId, which
+            // a polyfill or the test fake gets too), else a URL parameter
+            // (a parameter the URL already has is replaced, not added again)
+            const r = t.sse && t.id && [...t.subs].map(e => e.spec.resume).find(x => x);
+            let url = t.url;
+            if (r && !hdr) {
+                const p = encodeURIComponent(r === true ? 'lastEventId' : r) + '=', v = p + encodeURIComponent(t.id);
+                const re = new RegExp('([?&])' + p.replace(/[.*+?^${}()|[\]\\]/g, '\\$&') + '[^&#]*');
+                url = re.test(url) ? url.replace(re, '$1' + v) : url + (url.includes('?') ? '&' : '?') + v;
+            }
             let s;
             try {
-                s = t.sse ? new C(t.url, { withCredentials: !!t.spec.withCredentials, ...(hdr && { headers: hdr, fetch: options.fetch }) }) : new C(t.url, t.spec.protocols);
+                s = t.sse ? new C(url, { withCredentials: !!t.spec.withCredentials, ...(hdr && { headers: hdr, fetch: options.fetch }), ...(r && { lastEventId: t.id }) }) : new C(t.url, t.spec.protocols);
             }
             catch (error) {
                 // a URL the constructor rejects never opens: no retry
@@ -6723,12 +6806,22 @@ function makeSocketDriver(options = {}) {
             s.onopen = mine(() => {
                 t.n = 0;
                 t.open = true;
+                alive(t);
                 each(t, e => { deliver(e, 'open', { reconnected: !!e.opened }); e.opened = true; });
                 const q = t.queue;
                 t.queue = [];
                 q.forEach((x) => t.s === s && out(t, x.data, x.e));
             });
-            s.onmessage = mine((m) => { const d = parse(m.data); each(t, e => deliver(e, 'message', d)); });
+            s.onmessage = mine((m) => {
+                if (t.sse)
+                    seen(t, m);
+                else
+                    alive(t);
+                const d = parse(m.data);
+                each(t, e => deliver(e, 'message', e.spec.meta && t.sse ? got(t, m, e) : d));
+            });
+            // S-1: FetchEventSource's bytes (heartbeat comments) count as life
+            s.onbeat = mine(() => alive(t));
             s.onerror = mine((error) => {
                 each(t, e => deliver(e, 'error', { error }));
                 if (t.sse) {
@@ -6750,6 +6843,7 @@ function makeSocketDriver(options = {}) {
         // closes the driver makes: no `close` action, late events ignored, retry cancelled
         const end = (t) => {
             clearTimeout(t.timer);
+            clearTimeout(t.st);
             transports.delete(t.key);
             const s = t.s;
             t.s = null;
@@ -8548,7 +8642,8 @@ function makeHeadDriver(options = {}) {
  *   falsy one stops, a changed spec restarts (an equal one keeps running).
  * - `every`: drift-free; tick n is due at start + n * every (each delay is computed from the
  *   start, not chained). A late tick (a throttled background tab) coalesces the missed ones:
- *   n jumps. Data `{ n, t }`: the tick number from 1, `t` = Date.now().
+ *   n jumps. A delay is at most `every`, so a frozen Date.now() (a test clock that fixes the time
+ *   while timers run) ticks once per interval. Data `{ n, t }`: the tick number from 1, `t` = Date.now().
  * - `after`: fires once, data `{ t }`. It doesn't fire again while the same spec stays declared.
  * - `frame`: every animation frame (requestAnimationFrame; setTimeout 16 ms without it), data
  *   `{ t, dt }`: Date.now() and the ms since the previous frame (0 on the first).
@@ -8580,7 +8675,9 @@ const start$1 = (s, send, e) => {
         }
         else if (every) {
             n = Math.max(n + 1, Math.floor((t - t0) / every));
-            later(t0 + (n + 1) * every - t);
+            // never more than one interval: under a frozen Date.now() (Playwright's setFixedTime: Date is
+            // fixed, timers run) the drift-free delay grew by one interval per tick
+            later(Math.min(every, t0 + (n + 1) * every - t));
             send(s.action, { n, t });
         }
         else {
@@ -10653,13 +10750,13 @@ const addTimers = (v) => {
         return;
     timed.add(v);
     let own = v.timers;
-    const all = (st) => {
+    const all = (st, c) => {
         const o = {}, f = own;
         if (typeof f == 'function')
-            Object.assign(o, f(st));
+            Object.assign(o, f(st, c));
         else if (f && typeof f == 'object')
             for (const r in f)
-                o[r] = f[r](st);
+                o[r] = f[r](st, c);
         const u = v.uses;
         for (const k in u) {
             const b = u[k], t = b?.timers?.(st?.[k] ?? b.state, b.options, k), rn = (a) => a in (b.model || {}) ? k + '.' + a : a;
@@ -12293,7 +12390,7 @@ function withUses(def, state) {
  * state reads from the cache ('success' with the cached data), else 'loading' ('idle' for a
  * falsy request), as the client's first paint does with the same (hydrated) cache
  */
-function withResources(def, state) {
+function withResources(def, state, ctx) {
     state = withUses(def, state);
     const res = def && def.resources;
     if (!res || !state || typeof state !== 'object' || Array.isArray(state))
@@ -12304,7 +12401,7 @@ function withResources(def, state) {
             continue;
         let q;
         try {
-            q = typeof res[n] === 'function' ? res[n](state) : res[n];
+            q = typeof res[n] === 'function' ? res[n](state, ctx) : res[n];
         }
         catch (_) { }
         const E = q && ssrCache ? ssrCache.get(ssrCache.key(q, 1)) : undefined;
@@ -12351,15 +12448,33 @@ function viewFailed(def, err, name) {
     }
     return vnode;
 }
-function collectHead(def, state) {
+function collectHead(def, state, ctx) {
     const h = def && def.head;
     if (!heads || !h)
         return;
     try {
-        heads.push(typeof h === 'function' ? h(state) : h);
+        heads.push(typeof h === 'function' ? h(state, ctx) : h);
     }
     catch (_) { }
 }
+/**
+ * PLAN-13 F-1: the context a component sees (its parent's, plus its own entries computed on
+ * `state`). The statics get it as on the client; for `resources` it is computed on the state
+ * before the resources are filled in (a context entry can't read the component's own resource)
+ */
+function contextOf(def, state, parent) {
+    const own = def.context || {}, out = { ...parent };
+    for (const key of Object.keys(own)) {
+        const f = own[key];
+        if (typeof f === 'function' && state != null) {
+            try {
+                out[key] = f(state);
+            }
+            catch (_) { }
+        }
+    }
+    return out;
+}
 /**
  * Render a Sygnal component to an HTML string.
  *
@@ -12400,20 +12515,10 @@ function renderRoot(componentDef, options) {
     const uid = (options.uid || 'u').replace(/[^\w-]+/g, '_');
     const ownState = state !== undefined ? state : componentDef.initialState;
     // 5-5: the view sees its resources; the hydration script keeps the state as it was given
-    const resolvedState = withResources(componentDef, ownState);
-    collectHead(componentDef, resolvedState);
+    const resolvedState = withResources(componentDef, ownState, contextOf(componentDef, ownState, context));
     // Build context: merge parent context with component's own context definitions
-    const componentContext = componentDef.context || {};
-    const mergedContext = { ...context };
-    for (const key of Object.keys(componentContext)) {
-        const contextFn = componentContext[key];
-        if (typeof contextFn === 'function' && resolvedState != null) {
-            try {
-                mergedContext[key] = contextFn(resolvedState);
-            }
-            catch (_) { }
-        }
-    }
+    const mergedContext = contextOf(componentDef, resolvedState, context);
+    collectHead(componentDef, resolvedState, mergedContext);
     // Call the view function
     let vnode;
     try {
@@ -12624,19 +12729,9 @@ function renderSubComponent(vnode, context, parentState, uid) {
         // State passed directly
         childState = stateProp;
     }
-    childState = withResources(componentDef, childState);
+    childState = withResources(componentDef, childState, contextOf(componentDef, childState, context));
     // Build child context
-    const childContext = { ...context };
-    const componentContext = componentDef.context || {};
-    for (const key of Object.keys(componentContext)) {
-        const contextFn = componentContext[key];
-        if (typeof contextFn === 'function' && childState != null) {
-            try {
-                childContext[key] = contextFn(childState);
-            }
-            catch (_) { }
-        }
-    }
+    const childContext = contextOf(componentDef, childState, context);
     // Extract slots from children
     const slots = {};
     const defaultSlotChildren = [];
@@ -12658,7 +12753,7 @@ function renderSubComponent(vnode, context, parentState, uid) {
             slots.default = [];
         slots.default.push(...defaultSlotChildren);
     }
-    collectHead(componentDef, childState);
+    collectHead(componentDef, childState, childContext);
     // Call the view function
     let result;
     try {
@@ -12875,19 +12970,10 @@ function renderSwitchable(vnode, context, parentState, uid) {
  * Internal helper: render a component def to a VNode (not HTML string).
  */
 function renderToStringInternal(componentDef, state, context, uid) {
-    const resolvedState = withResources(componentDef, state !== undefined ? state : componentDef.initialState);
-    const componentContext = componentDef.context || {};
-    const mergedContext = { ...context };
-    for (const key of Object.keys(componentContext)) {
-        const contextFn = componentContext[key];
-        if (typeof contextFn === 'function' && resolvedState != null) {
-            try {
-                mergedContext[key] = contextFn(resolvedState);
-            }
-            catch (_) { }
-        }
-    }
-    collectHead(componentDef, resolvedState);
+    const own = state !== undefined ? state : componentDef.initialState;
+    const resolvedState = withResources(componentDef, own, contextOf(componentDef, own, context));
+    const mergedContext = contextOf(componentDef, resolvedState, context);
+    collectHead(componentDef, resolvedState, mergedContext);
     let vnode;
     try {
         vnode = componentDef({
@@ -15659,6 +15745,8 @@ const sockKey = (sse, url, arg) => (sse ? 'e' + !!(arg && arg.withCredentials) :
  * PLAN-3 2-C: the in-memory WebSocket / EventSource the fake's makeSocketDriver opens. The
  * harness drives it (t.open / t.push / t.drop); the driver's own close() is the app's close.
  */
+/** `url` without its query parameter `name` (PLAN-13 S-1: a resumed reconnect's id parameter) */
+const withoutParam = (url, name) => url.replace(new RegExp('([?&])' + name.replace(/[.*+?^${}()|[\]\\]/g, '\\$&') + '=[^&#]*&?'), '$1').replace(/[?&](#|$)/, '$1');
 const fakeSocketClass = (sse, made) => class {
     constructor(url, arg) {
         this.readyState = 0;
@@ -15666,7 +15754,14 @@ const fakeSocketClass = (sse, made) => class {
         this.byApp = false;
         this.ls = {};
         this.url = String(url);
-        this.k = sockKey(sse, this.url, arg);
+        // PLAN-13 S-1: a resumed SSE reconnect's URL has the id parameter (added, or replacing the
+        // declared one): its key leaves that parameter out (`rn`: its name; made() compares the
+        // connections' URLs without it too)
+        const id = sse && arg?.lastEventId;
+        const m = id && new RegExp('[?&]([^?&=]+)=' + encodeURIComponent(id).replace(/[.*+?^${}()|[\]\\]/g, '\\$&') + '(?=&|#|$)').exec(this.url);
+        if (m)
+            this.rn = m[1];
+        this.k = sockKey(sse, m ? withoutParam(this.url, m[1]) : this.url, arg);
         made(this);
     }
     send() { }
@@ -16265,7 +16360,7 @@ function renderComponent(componentDef, options = {}) {
         const w = { src: null, in$: xs$1.create(), conns: new Map(), sockets: [], sent: [], declaring: null };
         const made = (s) => {
             w.sockets.push(s);
-            const all = [...w.conns.values()].flatMap(m => [...m.values()]).filter(c => c.k == s.k);
+            const all = [...w.conns.values()].flatMap(m => [...m.values()]).filter(c => (s.rn ? sockKey(true, withoutParam(c.url, s.rn), c.spec) : c.k) == s.k);
             if (w.declaring) {
                 // a declaration opened it: the first new connection with its key (and, shared, the
                 // other new shared ones)
@@ -16402,7 +16497,7 @@ function renderComponent(componentDef, options = {}) {
             names.push(k + '.' + a);
     // G-275: the caller's initialState is owned (the dev statics freeze leaves it alone). G-289: a
     // copy is marked, not the caller's object
-    const init = initialState !== undefined ? ownedCopy(initialState) : componentDef.initialState;
+    let init = initialState !== undefined ? ownedCopy(initialState) : componentDef.initialState;
     // G-028: with no intent, model or initialState nothing would ever emit state, so the view
     // never renders. Leave intent/model unset so the component falls back to the same no-op
     // model run() uses, and renders.
@@ -16694,6 +16789,18 @@ function renderComponent(componentDef, options = {}) {
             },
         };
     };
+    // PLAN-13 F-2: a root that declares `route` starts from the test URL's route: its initialState's
+    // router.current() ran at module load, before the test's URL existed. The route entry's STATE
+    // reducer is applied to the initial state (its other sinks, a guard's redirect, run once when the
+    // router answers the declaration), so the first render and the statics see the page the test
+    // starts on: no render of '/' and no request for it
+    const re = rt && typeof componentDef.route == 'string' && model[componentDef.route];
+    const seed = typeof re == 'function' ? re : re && typeof re == 'object' && typeof re.STATE == 'function' && re.STATE;
+    if (seed && init !== undefined) {
+        const v = seed(init, rt.r.current(), noop, { state: init, previousState: init });
+        if (v !== undefined && !isAbort(v))
+            init = v;
+    }
     let sources, sinks;
     try {
         // the root runs with the test intent, model, initial state and name, and the drivers above.
@@ -17402,11 +17509,14 @@ function renderComponent(componentDef, options = {}) {
     };
     const open = (name, target) => sockCall('open', name, target, [0], sockOpen);
     const push = (name, data, target) => {
-        const o = target && typeof target == 'object' && !Array.isArray(target) && Object.keys(target).length && Object.keys(target).every(k => k == 'event' || k == 'connection') ? target : { connection: target };
+        const o = target && typeof target == 'object' && !Array.isArray(target) && Object.keys(target).length && Object.keys(target).every(k => k == 'event' || k == 'connection' || k == 'id') ? target : { connection: target };
         const raw = typeof data == 'string' || (data && typeof data == 'object' && (data instanceof ArrayBuffer || ArrayBuffer.isView(data) || (typeof Blob != 'undefined' && data instanceof Blob))) ? data : JSON.stringify(data);
         const ev = o.event;
         return sockCall('push', name, o.connection, [1], s => {
-            const m = { type: ev || 'message', data: raw };
+            // PLAN-13 S-1: `id` sets the event id; as in EventSource, lastEventId keeps the last one
+            if (s.sse && o.id != null)
+                s.lastId = String(o.id);
+            const m = { type: ev || 'message', data: raw, ...(s.sse && { lastEventId: s.lastId ?? '' }) };
             if (!ev || ev == 'message')
                 sockFire(s, 'message', m);
             if (s.sse)
@@ -26488,6 +26598,7 @@ exports.makeDragDriver = makeDragDriver;
 exports.makeFetchDriver = makeFetchDriver;
 exports.makeHeadDriver = makeHeadDriver;
 exports.makeMcpAppDriver = makeMcpAppDriver;
+exports.makeReplies = makeReplies;
 exports.makeRouter = makeRouter;
 exports.makeRouterDriver = makeRouterDriver;
 exports.makeServiceWorkerDriver = makeServiceWorkerDriver;
@@ -26521,6 +26632,7 @@ exports.run = run;
 exports.sampleCombine = sampleCombine;
 exports.score = score;
 exports.selection = selection;
+exports.senderOf = senderOf;
 exports.set = set;
 exports.setField = setField;
 exports.sortable = sortable;