sygnal 5.3.7 → 6.0.0

package/dist/devtools.esm.js

@@ -0,0 +1,1419 @@
+import { getDiagnostics } from 'sygnal';
+
+/*
+ * Tiny helpers shared by the core and the helper modules (behaviors, undo, the dev entry), kept
+ * out of the core so importing them never pulls it in.
+ */
+/** The "no change / send nothing" sentinel (a registered symbol: the same in every copy) */
+/**
+ * Whether a value is ABORT. Compares the description, not the identity, in case bundlers (e.g.
+ * Vite) create duplicate module instances with separate Symbol.for() registries. (G-214: the
+ * one copy, for the core, behaviors, undo and the action log)
+ */
+const isAbort = (v) => typeof v == 'symbol' && v.description == 'sygnal.ABORT';
+/**
+ * Set on a dev-only wrapper of a model function (SYG222's) to the function it wraps, so the
+ * action log and t.explain() show the user's reducer (G-214 follow-up)
+ */
+const ORIGINAL = Symbol.for('sygnal.original');
+
+/**
+ * PLAN-4 2-C (GS-10): the action log. Records every action a component instance runs as
+ *   { type, data, component, instance, sinks, cause, time }
+ * for renderComponent's t.actions / t.explain() (src/extra/testing.ts), inspect({ actions }) in
+ * the 'sygnal/diagnostics' dev entry (./inspect.ts) and the DevTools action log
+ * (src/extra/devtoolsActions.ts).
+ *
+ * 0 B in apps: nothing in the core calls this. actionHooks() is a hook layer of the core
+ * (04-hooks-contract §3.3): onAction opens the record (the core passes the cause: 'intent',
+ * 'next', 'reply', 'built-in', 'simulateAction'; an intent action a behavior owns is
+ * 'behavior'), wrapHandler sees which sinks produced a value. (The old core's version patched
+ * each instance; R5 removed it.)
+ *
+ * Sinks: a function reducer counts when it returns a value: not ABORT (or another symbol, which
+ * the core drops), and for STATE not the state it was given (GS-4: no change); EFFECT counts when
+ * the handler ran without ABORT. A constant / `true` entry always sends. A throwing reducer
+ * sends nothing.
+ */
+const BUILT_IN = /^(BOOTSTRAP|INITIALIZE|DISPOSE|RESOURCE)$/;
+/** now on the test's fake clock when there is one (vi.useFakeTimers()), else Date.now() */
+const clockNow = () => {
+    const c = setTimeout.clock;
+    return c ? c.now : Date.now();
+};
+/**
+ * PLAN-4.6 R4: the same log on the core, from its hooks (04 §3.3) instead of instance
+ * patches: onAction opens the record (the core passes the cause: 'intent', 'next', 'reply',
+ * 'built-in', 'simulateAction'), wrapHandler sees which sinks produced a value. Same records,
+ * same cause rules: a built-in type is 'built-in' unless simulated; an intent action a behavior
+ * owns is 'behavior'. `only(inst)`: the instances to record (renderComponent: its own tree).
+ */
+function actionHooks(listener, only) {
+    const cur = new WeakMap();
+    // INITIALIZE: the core writes the initial state at creation (no action, unless the model
+    // has an INITIALIZE entry); today's log has an INITIALIZE record with STATE, so it is opened here
+    const init = new WeakMap();
+    return {
+        onCreate(inst) {
+            const d = inst.def;
+            if ((only && !only(inst)) || d.initialState === undefined || !(inst.isRoot || d.isolated))
+                return;
+            const rec = { type: 'INITIALIZE', data: d.initialState, component: inst.name, instance: String(inst.id), sinks: [], cause: 'built-in', time: clockNow() };
+            init.set(inst, rec);
+            try {
+                listener.action(rec, inst);
+            }
+            catch (_) { /* ignore */ }
+            addSink(listener, rec, ['STATE'], 'STATE', undefined);
+        },
+        onAction(inst, a) {
+            if (only && !only(inst))
+                return;
+            const type = String(a.type), owned = inst.def.behaviorActions;
+            const hs = inst.def.handlers.get(type) || [], order = hs.map((h) => h[0]);
+            const opened = type == 'INITIALIZE' && init.get(inst);
+            if (opened) {
+                init.delete(inst);
+                cur.set(inst, [opened, order]);
+                return;
+            }
+            const cause = a.cause == 'simulateAction' ? a.cause : BUILT_IN.test(type) ? 'built-in'
+                : a.cause == 'next' || a.cause == 'reply' ? a.cause
+                    : owned && Object.prototype.hasOwnProperty.call(owned, type) ? 'behavior' : 'intent';
+            const rec = { type, data: a.data, component: inst.name, instance: String(inst.id), sinks: [], cause, time: clockNow(), ...(a.source !== undefined && { source: a.source }) };
+            cur.set(inst, [rec, order]);
+            try {
+                listener.action(rec, inst);
+            }
+            catch (_) { /* a listener never breaks the app */ }
+            // a constant / `true` entry always sends (EFFECT runs functions only)
+            for (const [sink, h] of hs)
+                if (typeof h != 'function' && sink != 'EFFECT')
+                    addSink(listener, rec, order, sink, undefined);
+        },
+        wrapHandler(inst, type, sink, fn) {
+            const c = cur.get(inst);
+            if (!c || c[0].type !== type || typeof fn != 'function')
+                return;
+            const [rec, order] = c, isState = sink == 'STATE', isEffect = sink == 'EFFECT';
+            return function (state) {
+                const r = fn.apply(this, arguments);
+                if (!isAbort(r) && (isEffect || typeof r != 'symbol') && !(isState && r === state))
+                    addSink(listener, rec, order, sink, fn[ORIGINAL] || fn);
+                return r;
+            };
+        },
+    };
+}
+function addSink(l, rec, order, sink, reducer) {
+    if (!rec.sinks.includes(sink)) {
+        rec.sinks.push(sink);
+        rec.sinks.sort((a, b) => order.indexOf(a) - order.indexOf(b));
+    }
+    try {
+        l.sink?.(rec, sink, reducer);
+    }
+    catch (_) { /* ignore */ }
+}
+
+/**
+ * PLAN-4.6 R4: 'sygnal/devtools' on the next component core (04 §3.5).
+ *
+ * The core calls no `window.__SYGNAL_DEVTOOLS__` method itself: each app reads the dev
+ * entries' hook layers once (`__SYGNAL_DIAGNOSTICS__.layers`), and this file's layer maps the
+ * hooks onto the bridge's existing methods (onComponentCreated, onStateChanged, ...). The bridge
+ * keeps a facade per instance with the fields it reads from today's instances (currentState,
+ * model, sourceNames, ...); time travel and the debug toggle go through the app's runtime API
+ * (`setState`, `setDebug`) instead of `sinks.STATE.shamefullySendNext` and `instance._debug`.
+ */
+const facades = new WeakMap();
+/** the bridge's view of a core instance (an InstanceView + its app's runtime API) */
+function devFacade(iv, api) {
+    let f = facades.get(iv);
+    if (f)
+        return f;
+    f = {
+        __next: iv,
+        __api: api,
+        get _componentNumber() { return iv.id; },
+        get name() { return iv.name; },
+        get isSubComponent() { return !iv.isRoot; },
+        get parentId() { return iv.parentId; },
+        get view() { return iv.def.view; },
+        get model() {
+            const m = {};
+            iv.def.handlers.forEach((hs, a) => { const e = m[a] = {}; for (const [s, fn] of hs)
+                e[s] = fn; });
+            return m;
+        },
+        get intent() { return iv.def.intent; },
+        get context() { return iv.def.view.context; },
+        get calculated() { return iv.def.view.calculated; },
+        get _behaviorActions() { return iv.def.behaviorActions; },
+        get currentState() { return iv.state; },
+        get currentContext() { return iv.context; },
+        get currentProps() { return iv.props; },
+        get sources() { return iv.sources; },
+        get sourceNames() { return Object.keys(iv.sources); },
+        stateSourceName: 'STATE',
+        get _debug() { return false; },
+        /** the state without its calculated fields (as today's cleanupCalculated) */
+        cleanupCalculated(s) {
+            const c = iv.def.calcNames;
+            if (!c || !s || typeof s != 'object' || Array.isArray(s))
+                return s;
+            const out = { ...s };
+            c.forEach((k) => { delete out[k]; });
+            return out;
+        },
+    };
+    facades.set(iv, f);
+    return f;
+}
+/** the hook layer of the DevTools bridge `dt` for one app */
+function devtoolsHooks(dt, api) {
+    const mounted = new WeakSet();
+    return {
+        onCreate(iv) {
+            const f = devFacade(iv, api);
+            dt.onComponentCreated(iv.id, iv.name, f);
+            if (iv.parentId !== undefined)
+                dt.onSubComponentRegistered(iv.parentId, iv.id);
+            // a Collection's first item (today's onCollectionMounted)
+            if (iv.kind == 'item' && iv.parentId !== undefined) {
+                const p = api.get(iv.parentId);
+                if (p && !mounted.has(p)) {
+                    mounted.add(p);
+                    dt.onCollectionMounted(p.id, p.name, iv.name, null);
+                }
+            }
+        },
+        onStateChanged(iv, s) { dt.connected && dt.onStateChanged(iv.id, iv.name, s); },
+        onPropsChanged(iv, p) { dt.connected && dt.onPropsChanged(iv.id, iv.name, p); },
+        onContextChanged(iv, c) { dt.connected && dt.onContextChanged(iv.id, iv.name, c); },
+        onAction(iv, a) { dt.connected && dt.onActionDispatched(iv.id, iv.name, a.type, a.data); },
+        onReady(p, c, ready) { dt.connected && dt.onReadyChanged(p.id, p.name, c.name, ready); },
+        onDispose(iv) { dt.onComponentDisposed(iv.id, iv.name); },
+    };
+}
+/** register a hook layer factory with the core (read by each app at its start) */
+function addLayer(f) {
+    const core = globalThis.__SYGNAL_DIAGNOSTICS__;
+    if (!core)
+        return () => { };
+    (core.layers || (core.layers = new Set())).add(f);
+    return () => { core.layers?.delete(f); };
+}
+
+/**
+ * PLAN-4 3-E (GS-10): the DevTools action log, in the dev-only 'sygnal/devtools' entry (0 B in
+ * apps: nothing in the core calls it).
+ *
+ * It records every action of every component instance through 2-C's recorder
+ * (./diagnostics/checks/actionLog: actionHooks), a hook layer every app reads from the core's
+ * diagnostics bridge (globalThis.__SYGNAL_DIAGNOSTICS__.layers), so it records with diagnostics
+ * off too. On top of 2-C's record it keeps:
+ *   seq, at        a sequence number, ms since the session started
+ *   parent         the parent instance id (null: a root)
+ *   before, after  the instance's state around the action's STATE reducer (onReducer), when it
+ *                  changed the state (`after` without calculated fields)
+ *   replySink      for a reply action (and RESOURCE): the source that delivered it, and
+ *   replyKind      'fetch' when that source is makeFetchDriver's (renderComponent fakes it)
+ *
+ * A session runs from the recorder's start (or the last clearActions()) to now. getSession()
+ * turns it into a SessionRecording for one instance (./copyAsTest generates the test).
+ */
+const MAX = 5000;
+const STANDARD = /^(DOM|EVENTS|LOG|CHILD|PARENT|READY|props\$|children\$|dispose\$)$/;
+let actions = [];
+let seq = 0;
+let epoch = clockNow();
+let truncated = false;
+let created = 0;
+const insts = new Map();
+const byRec = new WeakMap();
+/** instance -> the action whose STATE reducer just produced a value (its onReducer follows) */
+const pendingState = new WeakMap();
+const subscribers = new Set();
+const notify = (a, kind) => {
+    for (const s of subscribers)
+        try {
+            s(a, kind);
+        }
+        catch (_) { /* a subscriber never breaks the app */ }
+};
+const idOf = (c) => String(c && c._componentNumber);
+function ensure(c) {
+    const id = idOf(c);
+    let i = insts.get(id);
+    if (!i || i.c !== c) {
+        const p = c && c.__next && c.__next.parentId;
+        i = { c, id, name: c && c.name, parent: typeof p == 'number' ? String(p) : null, stateName: (c && c.stateSourceName) || 'STATE',
+            inSession: true, hasInitial: false, disposed: false };
+        i.order = ++created;
+        insts.set(id, i);
+    }
+    return i;
+}
+function clean(c, s) {
+    try {
+        return typeof c.cleanupCalculated == 'function' ? c.cleanupCalculated(s) : s;
+    }
+    catch (_) {
+        return s;
+    }
+}
+const listener = {
+    action(r, c) {
+        const info = ensure(c);
+        // the instance's state when its session started: INITIALIZE's data (its initial state), else
+        // the state it had at its first action
+        if (r.type == 'INITIALIZE' && info.inSession) {
+            info.initial = r.data;
+            info.hasInitial = true;
+        }
+        else if (!info.hasInitial) {
+            info.initial = c.currentState;
+            info.hasInitial = true;
+        }
+        const a = { seq: ++seq, type: r.type, data: r.data, component: r.component, instance: r.instance,
+            parent: info.parent, sinks: r.sinks, cause: r.cause, at: r.time - epoch };
+        const slot = r.source;
+        if (slot !== undefined && (r.cause == 'reply' || r.type == 'RESOURCE')) {
+            a.replySink = slot;
+            a.replyKind = c.sources && c.sources[slot] && c.sources[slot].__sygnalStatic === 'resources' ? 'fetch' : 'other';
+        }
+        if (r.cause == 'intent' && isStateEcho(r.data, c.currentState))
+            a.echo = true;
+        byRec.set(r, a);
+        actions.push(a);
+        if (actions.length > MAX) {
+            actions.shift();
+            truncated = true;
+        }
+        notify(a, 'add');
+    },
+    sink(r, sink) {
+        const a = byRec.get(r);
+        if (!a)
+            return;
+        const info = insts.get(r.instance);
+        if (info && info.c && sink == info.stateName)
+            pendingState.set(info.c, a);
+        notify(a, 'update');
+    },
+};
+function onReducer(c, name, prev, next) {
+    const a = pendingState.get(c);
+    if (!a || a.type !== name || 'after' in a)
+        return;
+    pendingState.delete(c);
+    a.before = prev;
+    a.after = clean(c, next);
+    notify(a, 'update');
+}
+function onDispose(c) {
+    const i = insts.get(idOf(c));
+    if (i && i.c === c) {
+        i.disposed = true;
+        i.c = undefined;
+    }
+}
+let unregister;
+/** PLAN-4.6 R4: the same recorder on the core, from its hooks (per app; a facade per instance) */
+function nextLayer(api) {
+    const L = {
+        action: (r, iv) => listener.action(r, devFacade(iv, api)),
+        sink: (r, sink, reducer) => listener.sink(r, sink, reducer),
+    };
+    const log = actionHooks(L);
+    return {
+        ...log,
+        onCreate(iv) { ensure(devFacade(iv, api)); log.onCreate(iv); },
+        onReducer(iv, name, prev, next) { onReducer(devFacade(iv, api), name, prev, next); },
+        onDispose(iv) { onDispose(devFacade(iv, api)); },
+    };
+}
+/**
+ * Start recording actions (idempotent; 'sygnal/devtools' does it on import in a browser). Only
+ * components created afterwards are recorded. Returns a function that stops recording.
+ */
+function recordActions() {
+    if (!unregister) {
+        const core = globalThis.__SYGNAL_DIAGNOSTICS__;
+        if (!core)
+            return () => { };
+        unregister = addLayer(nextLayer);
+    }
+    return stopRecording;
+}
+function stopRecording() {
+    if (unregister) {
+        unregister();
+        unregister = undefined;
+    }
+}
+const isRecording = () => !!unregister;
+/** Start a new session: forget the recorded actions; each live instance's state is its new initial state. */
+function clearActions() {
+    actions = [];
+    epoch = clockNow();
+    truncated = false;
+    for (const [id, i] of insts) {
+        if (i.disposed) {
+            insts.delete(id);
+            continue;
+        }
+        i.inSession = false;
+        i.initial = i.c && i.c.currentState;
+        i.hasInitial = true;
+    }
+    notify(null, 'reset');
+}
+const matches = (a, f) => (f.component === undefined || a.component === f.component) &&
+    (f.instance === undefined || a.instance === String(f.instance)) &&
+    (f.type === undefined || (typeof f.type == 'string' ? a.type === f.type : f.type.test(a.type))) &&
+    (f.cause === undefined || [].concat(f.cause).includes(a.cause));
+/** The session's actions (oldest first), optionally filtered by component, instance, type or cause. */
+function getActions(filter) {
+    return filter ? actions.filter(a => matches(a, filter)) : actions.slice();
+}
+/** Subscribe to the log: (action, 'add' | 'update') and (null, 'reset'). Returns unsubscribe. */
+function onAction(fn) {
+    subscribers.add(fn);
+    return () => { subscribers.delete(fn); };
+}
+/** the live instances, newest first */
+const live = () => [...insts.values()].filter(i => !i.disposed && i.c).sort((a, b) => b.order - a.order);
+/**
+ * The instance a session target names: undefined (the newest live root), an instance id, a
+ * component function (its newest live instance) or run()'s result (its root, by DOM source).
+ */
+function resolveInstance(target) {
+    const all = live();
+    if (target === undefined || target === null)
+        return all.find(i => i.parent === null);
+    if (typeof target == 'string' || typeof target == 'number')
+        return insts.get(String(target));
+    if (typeof target == 'function')
+        return all.find(i => i.c.view === target);
+    if (typeof target == 'object') {
+        const s = target.sources;
+        if (s && typeof s == 'object') {
+            return all.find(i => i.parent === null && Object.keys(s).some(k => k != 'STATE' && s[k] && i.c.sources && i.c.sources[k] === s[k])) ||
+                all.find(i => i.parent === null);
+        }
+    }
+    return undefined;
+}
+function descendants(id) {
+    const out = new Set();
+    let grew = true;
+    while (grew) {
+        grew = false;
+        for (const i of insts.values())
+            if (i.parent !== null && (i.parent === id || out.has(i.parent)) && !out.has(i.id)) {
+                out.add(i.id);
+                grew = true;
+            }
+    }
+    // instances already pruned: their actions still name their parent
+    for (const a of actions)
+        if (a.parent !== null && (a.parent === id || out.has(a.parent)))
+            out.add(a.instance);
+    return out;
+}
+const REPLAYED = new Set(['intent', 'simulateAction', 'behavior', 'reply']);
+/**
+ * The session of one instance (see resolveInstance for `target`) as plain data: its initial
+ * and final state, its own actions, and the state changes of its descendants (a replay at this
+ * instance can't reproduce them).
+ */
+function getSession(target) {
+    const info = resolveInstance(target);
+    if (!info)
+        throw new Error('[Sygnal DevTools] getSession: no live component instance matches' + (target === undefined ? ' (no root recorded: import sygnal/devtools before run())' : ''));
+    const c = info.c;
+    const desc = descendants(info.id);
+    const stateNameOf = (id) => insts.get(id)?.stateName || 'STATE';
+    const model = c.model && typeof c.model == 'object' ? Object.keys(c.model).map(k => k.split('|')[0].trim()) : undefined;
+    const behaviors = c._behaviorActions && typeof c._behaviorActions == 'object' ? Object.keys(c._behaviorActions) : [];
+    const sources = c.sources || {};
+    const drivers = (c.sourceNames || Object.keys(sources)).filter((n) => !STANDARD.test(n) && n !== info.stateName && n != 'STATE' && n != 'state' && !n.startsWith('__'));
+    return {
+        version: 1,
+        component: info.name,
+        instance: info.id,
+        initialState: info.hasInitial ? info.initial : undefined,
+        definitionInitialState: c.view ? c.view.initialState : undefined,
+        finalState: c.currentState,
+        actionNames: model ? [...model, ...behaviors] : undefined,
+        drivers,
+        fakeable: drivers.filter((n) => sources[n] && sources[n].__sygnalStatic === 'resources'),
+        actions: actions.filter(a => a.instance === info.id).map(a => ({
+            type: a.type, data: a.data, cause: a.cause, sinks: [...a.sinks], at: a.at,
+            ...(a.replySink !== undefined ? { replySink: a.replySink, replyKind: a.replyKind } : {}),
+            ...(a.echo ? { echo: true } : {}),
+        })),
+        foreign: actions.filter(a => desc.has(a.instance) && REPLAYED.has(a.cause) && a.sinks.includes(stateNameOf(a.instance)))
+            .map(a => ({ type: a.type, component: a.component, instance: a.instance, cause: a.cause })),
+        ...(truncated ? { truncated: true } : {}),
+    };
+}
+/** A JSON-safe copy for the panel: DOM elements and events become short descriptions. */
+function preview(v) {
+    if (v === undefined)
+        return undefined;
+    const seen = new WeakSet();
+    try {
+        return JSON.parse(JSON.stringify(v, (_k, x) => {
+            if (typeof x == 'function')
+                return `[Function ${x.name || 'anonymous'}]`;
+            if (typeof x == 'symbol')
+                return String(x);
+            if (typeof x == 'bigint')
+                return `${x}n`;
+            if (x && typeof x == 'object') {
+                if (isElement(x))
+                    return describeElement(x);
+                if (isEvent(x))
+                    return `[${x.constructor && x.constructor.name || 'Event'} ${x.type}]`;
+                if (x instanceof Map)
+                    return { '[Map]': [...x.entries()] };
+                if (x instanceof Set)
+                    return { '[Set]': [...x.values()] };
+                if (seen.has(x))
+                    return '[Circular]';
+                seen.add(x);
+            }
+            return x;
+        }));
+    }
+    catch (_) {
+        return '[unserializable]';
+    }
+}
+const isPlain = (x) => !!x && typeof x == 'object' && (Object.getPrototypeOf(x) === Object.prototype || Object.getPrototypeOf(x) === null);
+function deepEqual(a, b) {
+    if (Object.is(a, b))
+        return true;
+    if (!a || !b || typeof a != 'object' || typeof b != 'object')
+        return false;
+    if (Array.isArray(a) !== Array.isArray(b))
+        return false;
+    const ka = Object.keys(a).filter(k => a[k] !== undefined), kb = Object.keys(b).filter(k => b[k] !== undefined);
+    return ka.length == kb.length && ka.every(k => deepEqual(a[k], b[k]));
+}
+/**
+ * The data is the state itself (STATE.stream in the intent; calculated fields may be added): the
+ * replay sends it again by itself, so it isn't replayed.
+ */
+function isStateEcho(data, state) {
+    if (!isPlain(data) || !isPlain(state))
+        return false;
+    const keys = Object.keys(state);
+    return keys.length > 0 && (data === state || keys.every(k => deepEqual(data[k], state[k])));
+}
+const isElement = (x) => !!x && typeof x == 'object' && x.nodeType === 1 && typeof x.tagName == 'string';
+const isEvent = (x) => !!x && typeof x == 'object' && typeof x.type == 'string' && typeof x.preventDefault == 'function' && 'target' in x;
+const describeElement = (el) => {
+    const cls = typeof el.className == 'string' && el.className.trim() ? '.' + el.className.trim().split(/\s+/).join('.') : '';
+    return `<${String(el.tagName).toLowerCase()}${el.id ? '#' + el.id : ''}${cls}>`;
+};
+
+const REPLAY = new Set(['intent', 'simulateAction', 'behavior']);
+const IDENT = /^[A-Za-z_$][\w$]*$/;
+class Unserializable extends Error {
+}
+/** a single-quoted JS string literal */
+const str = (s) => `'${JSON.stringify(s).slice(1, -1).replace(/\\"/g, '"').replace(/'/g, "\\'")}'`;
+/** `v` as a JS literal. mode 'data' turns DOM events / elements into stubs; 'state' refuses them. */
+function literal(v, mode = 'data', indent = '') {
+    const flag = { stubbed: false };
+    const code = lit(v, mode, indent, new Set(), flag);
+    return { code, stubbed: flag.stubbed };
+}
+function elementStub(el) {
+    const out = {};
+    const ds = el.dataset && typeof el.dataset == 'object' ? { ...el.dataset } : {};
+    if (Object.keys(ds).length)
+        out.dataset = ds;
+    if (el.id)
+        out.id = el.id;
+    const tag = String(el.tagName).toUpperCase();
+    if (/^(INPUT|SELECT|TEXTAREA)$/.test(tag) && typeof el.value == 'string')
+        out.value = el.value;
+    if (tag == 'INPUT' && /^(checkbox|radio)$/i.test(el.type || ''))
+        out.checked = !!el.checked;
+    return out;
+}
+function eventStub(e) {
+    const out = { type: e.type };
+    if (typeof e.key == 'string')
+        out.key = e.key;
+    if (isElement(e.target)) {
+        const t = elementStub(e.target);
+        if (Object.keys(t).length)
+            out.target = t;
+    }
+    return out;
+}
+function lit(v, mode, ind, seen, flag) {
+    if (v === null)
+        return 'null';
+    switch (typeof v) {
+        case 'undefined': return 'undefined';
+        case 'boolean': return String(v);
+        case 'string': return str(v);
+        case 'number': return Object.is(v, -0) ? '-0' : String(v);
+        case 'bigint': return `${v}n`;
+        case 'function': throw new Unserializable(`a function (${v.name || 'anonymous'})`);
+        case 'symbol': throw new Unserializable(`a symbol (${String(v)})`);
+    }
+    if (seen.has(v))
+        throw new Unserializable('a circular reference');
+    if (isEvent(v) || isElement(v)) {
+        if (mode == 'state')
+            throw new Unserializable(isEvent(v) ? `a DOM ${v.type} event` : 'a DOM element');
+        flag.stubbed = true;
+        return lit(isEvent(v) ? eventStub(v) : elementStub(v), mode, ind, seen, flag);
+    }
+    seen.add(v);
+    try {
+        const inner = ind + '  ';
+        const list = (items, open, close) => {
+            if (!items.length)
+                return open + close;
+            const one = open + (open == '{' ? ' ' : '') + items.join(', ') + (open == '{' ? ' ' : '') + close;
+            if (one.length + ind.length <= 100 && !one.includes('\n'))
+                return one;
+            return open + '\n' + items.map(s => inner + s).join(',\n') + ',\n' + ind + close;
+        };
+        if (Array.isArray(v))
+            return list(Array.from(v, x => lit(x, mode, inner, seen, flag)), '[', ']');
+        if (v instanceof Date)
+            return `new Date(${str(isNaN(+v) ? 'Invalid Date' : v.toISOString())})`;
+        if (v instanceof Map)
+            return `new Map(${list([...v].map(([k, x]) => list([lit(k, mode, inner + '  ', seen, flag), lit(x, mode, inner + '  ', seen, flag)], '[', ']')), '[', ']')})`;
+        if (v instanceof Set)
+            return `new Set(${list([...v].map(x => lit(x, mode, inner, seen, flag)), '[', ']')})`;
+        const proto = Object.getPrototypeOf(v);
+        // G-265: a vnode of the JSX pragma (its own constructor, flagged $p) is a plain object
+        if (proto !== Object.prototype && proto !== null && !v.$p)
+            throw new Unserializable(`a ${(v.constructor && v.constructor.name) || 'class instance'}`);
+        const items = [];
+        for (const k of Object.keys(v)) {
+            if (v[k] === undefined)
+                continue;
+            items.push(`${IDENT.test(k) ? k : str(k)}: ${lit(v[k], mode, inner, seen, flag)}`);
+        }
+        return list(items, '{', '}');
+    }
+    finally {
+        seen.delete(v);
+    }
+}
+const q = str;
+const tryLit = (v, mode, ind) => {
+    try {
+        return literal(v, mode, ind);
+    }
+    catch (e) {
+        if (e instanceof Unserializable)
+            return { error: e.message };
+        throw e;
+    }
+};
+/** an error reply from makeFetchDriver: { error, request, status?, body? } for the request's `error` action */
+const isErrorReply = (a) => a.data && typeof a.data == 'object' && 'error' in a.data && a.data.request && typeof a.data.request == 'object' && a.data.request.error === a.type;
+/** The test for a recorded session (see the module comment), with what it left out. */
+function sessionToTest(rec, options = {}) {
+    const name = options.componentName || (IDENT.test(rec.component) ? rec.component : 'Component');
+    const warnings = [];
+    const incomplete = [];
+    const body = [];
+    const I = '    ';
+    const drivers = options.drivers || {};
+    let replayed = 0;
+    if (rec.truncated)
+        incomplete.push('the session lost its oldest actions (clear the log, then record a shorter session)');
+    // render options
+    const opts = [];
+    if (rec.initialState !== undefined && !deepEqual(rec.initialState, rec.definitionInitialState)) {
+        const l = tryLit(rec.initialState, 'state', I);
+        if ('error' in l) {
+            warnings.push(`the initial state holds ${l.error}: rendering with the component's own initialState`);
+            incomplete.push('the initial state could not be written');
+        }
+        else
+            opts.push(`initialState: ${l.code}`);
+    }
+    const fakeable = new Set(rec.fakeable);
+    const driverNames = [...new Set([...rec.drivers.filter(n => !fakeable.has(n)), ...Object.keys(drivers)])];
+    const given = driverNames.filter(n => drivers[n] !== undefined);
+    const missing = driverNames.filter(n => drivers[n] === undefined);
+    if (given.length)
+        opts.push(`drivers: { ${given.map(n => `${IDENT.test(n) ? n : q(n)}: ${drivers[n]}`).join(', ')} }`);
+    if (missing.length)
+        warnings.push(`the app had ${missing.length == 1 ? 'a driver' : 'drivers'} for ${missing.join(', ')}: pass ${missing.length == 1 ? 'it' : 'them'} with copyAsTest(..., { drivers: { ${missing[0]}: '...' } }) if the component reads ${missing.length == 1 ? 'it' : 'them'}`);
+    if (options.renderOptions)
+        opts.push(options.renderOptions);
+    const names = rec.actionNames && new Set(rec.actionNames);
+    // (G-218: t.respond / t.fail right after queued simulateAction calls wait for the request
+    // those calls send, so no settle() is needed before them)
+    const answer = (line) => body.push(line);
+    for (const a of rec.actions) {
+        const changes = a.sinks.includes('STATE') || a.sinks.includes('state');
+        if (REPLAY.has(a.cause)) {
+            // an intent over the component's own STATE stream: the replay produces it again
+            if (a.echo)
+                continue;
+            // an intent action with no model entry does nothing (renderComponent can't send it)
+            if (names && !names.has(a.type) && a.cause != 'behavior')
+                continue;
+            replayed++;
+            if (a.data === undefined) {
+                body.push(`${I}t.simulateAction(${q(a.type)})`);
+                continue;
+            }
+            const l = tryLit(a.data, 'data', I);
+            if ('error' in l) {
+                body.push(`${I}t.simulateAction(${q(a.type)}) // data left out: it held ${l.error}`);
+                if (changes)
+                    incomplete.push(`${a.type}'s data could not be written (${l.error})`);
+                continue;
+            }
+            if (l.stubbed)
+                body.push(`${I}// ${a.type}: DOM event/element data as a stub (type, key, target dataset/value/checked/id)`);
+            body.push(`${I}t.simulateAction(${q(a.type)}, ${l.code})`);
+        }
+        else if (a.cause == 'reply') {
+            const sink = a.replySink;
+            if (!sink || a.replyKind != 'fetch' || drivers[sink] !== undefined) {
+                body.push(`${I}// reply ${a.type}${sink ? ` from ${sink}` : ''}: not replayed (renderComponent fakes makeFetchDriver sources only)`);
+                if (changes)
+                    incomplete.push(`the ${a.type} reply could not be replayed`);
+                continue;
+            }
+            if (isErrorReply(a)) {
+                const err = a.data.error, status = a.data.status ?? (err && err.status), errBody = a.data.body ?? (err && err.body);
+                if (typeof status == 'number') {
+                    if (errBody === undefined)
+                        answer(`${I}await t.fail(${q(sink)}, ${status}, ${q(a.type)})`);
+                    else {
+                        const l = tryLit(errBody, 'state', I);
+                        if ('error' in l) {
+                            answer(`${I}await t.fail(${q(sink)}, ${status}, ${q(a.type)}) // body left out: it held ${l.error}`);
+                            if (changes)
+                                incomplete.push(`the ${a.type} error body could not be written`);
+                        }
+                        else
+                            answer(`${I}await t.fail(${q(sink)}, ${status}, { request: (r) => r.error === ${q(a.type)}, body: ${l.code} })`);
+                    }
+                }
+                else if (a.data.issues) {
+                    body.push(`${I}// reply ${a.type}: a validation failure, not replayed`);
+                    if (changes)
+                        incomplete.push(`the ${a.type} validation failure could not be replayed`);
+                    continue;
+                }
+                else {
+                    answer(`${I}await t.fail(${q(sink)}, new Error(${str(String(err && err.message || err))}), ${q(a.type)})`);
+                }
+                replayed++;
+                continue;
+            }
+            const l = tryLit(a.data, 'state', I);
+            if ('error' in l) {
+                body.push(`${I}// reply ${a.type} from ${sink}: its data held ${l.error}, not replayed`);
+                if (changes)
+                    incomplete.push(`the ${a.type} reply's data could not be written`);
+                continue;
+            }
+            answer(`${I}await t.respond(${q(sink)}, ${l.code}, ${q(a.type)})`);
+            replayed++;
+        }
+        else if (a.type == 'RESOURCE' && a.data && (a.data.status == 'success' || a.data.status == 'error')) {
+            body.push(`${I}// RESOURCE ${a.data.name}: ${a.data.status}, not replayed (answer it with t.respond / t.fail)`);
+            if (changes)
+                incomplete.push(`resource '${a.data.name}' was answered`);
+        }
+        // 'next' and 'built-in': consequences, produced again by the replay
+    }
+    if (rec.foreign.length) {
+        const list = rec.foreign.slice(0, 5).map(f => `${f.component}#${f.instance} ${f.type}`).join(', ') + (rec.foreign.length > 5 ? ', ...' : '');
+        incomplete.push(`child components changed the state through their own actions (${list}): copy the test from that component instance instead`);
+    }
+    let assertion;
+    if (!incomplete.length) {
+        const l = tryLit(rec.finalState, 'state', I);
+        if ('error' in l)
+            incomplete.push(`the final state holds ${l.error}`);
+        else
+            assertion = [`${I}expect(t.state).toEqual(${l.code})`];
+    }
+    if (incomplete.length) {
+        warnings.push(...incomplete.map(s => 'no final-state assertion: ' + s));
+        assertion = [`${I}// No final-state assertion: ${incomplete.join('; ')}`];
+    }
+    const head = [];
+    if (options.environment)
+        head.push(`// @vitest-environment ${options.environment}`);
+    head.push(`// Copied from a sygnal/devtools session of ${rec.component} (${rec.actions.length} recorded actions, ${replayed} replayed)`);
+    for (const w of warnings)
+        head.push(`// NOTE: ${w}`);
+    head.push(`import { it, expect } from 'vitest'`, `import { renderComponent } from 'sygnal'`);
+    head.push(...(options.imports || []));
+    head.push(options.componentImport || `import ${name} from './${name}.js'`);
+    const testName = options.testName || `${rec.component} session (copied from sygnal/devtools)`;
+    const render = opts.length ? `renderComponent(${name}, {\n${opts.map(o => `${I}${o},`).join('\n')}\n  })` : `renderComponent(${name})`;
+    const code = [
+        ...head,
+        '',
+        `it(${q(testName)}, async () => {`,
+        `  const t = ${render}`,
+        '  try {',
+        `${I}await t.ready()`,
+        ...body,
+        `${I}await t.settle()`,
+        ...assertion,
+        '  } finally {',
+        `${I}t.dispose()`,
+        '  }',
+        '})',
+        '',
+    ].join('\n');
+    return { code, complete: !incomplete.length, warnings, replayed };
+}
+
+const DEVTOOLS_SOURCE = '__SYGNAL_DEVTOOLS_PAGE__';
+const EXTENSION_SOURCE = '__SYGNAL_DEVTOOLS_EXTENSION__';
+const DEFAULT_MAX_HISTORY = 200;
+class SygnalDevTools {
+    constructor() {
+        this._initialized = false;
+        /** PLAN-4 3-E: actions changed since the last ACTIONS post (flushed on a timeout) */
+        this._dirty = new Set();
+        this._flush = null;
+        this._copyOptions = {};
+        this._connected = false;
+        this._components = new Map();
+        this._stateHistory = [];
+        this._maxHistory = DEFAULT_MAX_HISTORY;
+    }
+    /** Diagnostics collected by the shared diagnostics core (see src/extra/diagnostics). */
+    getDiagnostics() {
+        return getDiagnostics();
+    }
+    get connected() {
+        return this._connected && typeof window !== 'undefined';
+    }
+    /** Publish the bridge on window and listen for the extension. Idempotent (D77: called once, by 'sygnal/devtools'). */
+    init() {
+        if (typeof window === 'undefined' || this._initialized)
+            return;
+        this._initialized = true;
+        window.__SYGNAL_DEVTOOLS__ = this;
+        // PLAN-4 3-E (GS-10): the action log (recorded from now on, connected or not)
+        recordActions();
+        // PLAN-4.6 R4: the apps read this bridge's hooks (devtoolsNext.ts)
+        addLayer((api) => devtoolsHooks(this, api));
+        onAction((a, kind) => {
+            if (!this.connected)
+                return;
+            if (kind == 'reset') {
+                this._dirty.clear();
+                this._post('ACTIONS_RESET', { actions: [] });
+                return;
+            }
+            this._dirty.add(a);
+            if (this._flush === null)
+                this._flush = setTimeout(() => this._flushActions(), 0);
+        });
+        window.addEventListener('message', (event) => {
+            if (event.source !== window)
+                return;
+            if (event.data?.source === EXTENSION_SOURCE) {
+                this._handleExtensionMessage(event.data);
+            }
+        });
+    }
+    _handleExtensionMessage(msg) {
+        switch (msg.type) {
+            case 'CONNECT':
+                this._connected = true;
+                if (msg.payload?.maxHistory)
+                    this._maxHistory = msg.payload.maxHistory;
+                this._sendFullTree();
+                this._post('ACTIONS_RESET', { actions: getActions().slice(-500).map(a => this._serializeAction(a)) });
+                break;
+            case 'CLEAR_ACTIONS':
+                clearActions();
+                break;
+            case 'COPY_AS_TEST':
+                this._post('COPY_AS_TEST_RESULT', this._copyAsTest(msg.payload?.instance));
+                break;
+            case 'DISCONNECT':
+                this._connected = false;
+                break;
+            case 'SET_DEBUG':
+                this._setDebug(msg.payload);
+                break;
+            case 'TIME_TRAVEL':
+                this._timeTravel(msg.payload);
+                break;
+            case 'SNAPSHOT':
+                this._takeSnapshot();
+                break;
+            case 'RESTORE_SNAPSHOT':
+                this._restoreSnapshot(msg.payload);
+                break;
+            case 'GET_STATE':
+                this._sendComponentState(msg.payload.componentId);
+                break;
+        }
+    }
+    onComponentCreated(componentNumber, name, instance) {
+        const meta = {
+            id: componentNumber,
+            name: name,
+            isSubComponent: instance.isSubComponent,
+            hasModel: !!instance.model,
+            hasIntent: !!instance.intent,
+            hasContext: !!instance.context,
+            hasCalculated: !!instance.calculated,
+            components: [],
+            parentId: null,
+            children: [],
+            debug: instance._debug,
+            createdAt: Date.now(),
+            mviGraph: this._extractMviGraph(instance),
+            _instanceRef: new WeakRef(instance),
+        };
+        this._components.set(componentNumber, meta);
+        if (!this.connected)
+            return;
+        this._post('COMPONENT_CREATED', this._serializeMeta(meta));
+    }
+    onStateChanged(componentNumber, name, state) {
+        if (!this.connected)
+            return;
+        const entry = {
+            componentId: componentNumber,
+            componentName: name,
+            timestamp: Date.now(),
+            state: this._safeClone(state),
+        };
+        this._stateHistory.push(entry);
+        if (this._stateHistory.length > this._maxHistory) {
+            this._stateHistory.shift();
+        }
+        this._post('STATE_CHANGED', {
+            componentId: componentNumber,
+            componentName: name,
+            state: entry.state,
+        });
+    }
+    onActionDispatched(componentNumber, name, actionType, data) {
+        if (!this.connected)
+            return;
+        this._post('ACTION_DISPATCHED', {
+            componentId: componentNumber,
+            componentName: name,
+            actionType: actionType,
+            data: this._safeClone(data),
+            timestamp: Date.now(),
+        });
+    }
+    onSubComponentRegistered(parentNumber, childNumber) {
+        const parent = this._components.get(parentNumber);
+        const child = this._components.get(childNumber);
+        if (parent && child) {
+            child.parentId = parentNumber;
+            if (!parent.children.includes(childNumber)) {
+                parent.children.push(childNumber);
+            }
+        }
+        if (!this.connected)
+            return;
+        this._post('TREE_UPDATED', {
+            parentId: parentNumber,
+            childId: childNumber,
+        });
+    }
+    onContextChanged(componentNumber, name, context) {
+        if (!this.connected)
+            return;
+        this._post('CONTEXT_CHANGED', {
+            componentId: componentNumber,
+            componentName: name,
+            context: this._safeClone(context),
+            contextTrace: this._buildContextTrace(componentNumber, context),
+        });
+    }
+    onPropsChanged(componentNumber, name, props) {
+        if (!this.connected)
+            return;
+        this._post('PROPS_CHANGED', {
+            componentId: componentNumber,
+            componentName: name,
+            props: this._safeClone(props),
+        });
+    }
+    onBusEvent(event) {
+        if (!this.connected)
+            return;
+        this._post('BUS_EVENT', {
+            type: event.type,
+            data: this._safeClone(event.data),
+            componentId: event.__emitterId ?? null,
+            componentName: event.__emitterName ?? null,
+            timestamp: Date.now(),
+        });
+    }
+    onCommandSent(type, data, targetComponentId, targetComponentName) {
+        if (!this.connected)
+            return;
+        this._post('COMMAND_SENT', {
+            type,
+            data: this._safeClone(data),
+            targetComponentName: targetComponentName ?? null,
+            timestamp: Date.now(),
+        });
+    }
+    onReadyChanged(parentId, parentName, childKey, ready) {
+        if (!this.connected)
+            return;
+        this._post('READY_CHANGED', {
+            parentId,
+            parentName,
+            childKey,
+            ready,
+            timestamp: Date.now(),
+        });
+    }
+    onCollectionMounted(parentId, parentName, itemComponentName, stateField) {
+        const meta = this._components.get(parentId);
+        if (meta) {
+            meta.collection = { itemComponent: itemComponentName, stateField };
+        }
+        if (!this.connected)
+            return;
+        this._post('COLLECTION_MOUNTED', {
+            parentId,
+            parentName,
+            itemComponent: itemComponentName,
+            stateField,
+        });
+    }
+    onComponentDisposed(componentNumber, name) {
+        const meta = this._components.get(componentNumber);
+        if (meta) {
+            meta.disposed = true;
+            meta.disposedAt = Date.now();
+        }
+        if (!this.connected)
+            return;
+        this._post('COMPONENT_DISPOSED', {
+            componentId: componentNumber,
+            componentName: name,
+            timestamp: Date.now(),
+        });
+    }
+    onDebugLog(componentNumber, message) {
+        if (!this.connected)
+            return;
+        this._post('DEBUG_LOG', {
+            componentId: componentNumber,
+            message: message,
+            timestamp: Date.now(),
+        });
+    }
+    /** PLAN-4 3-E: post the actions added or changed since the last flush */
+    _flushActions() {
+        this._flush = null;
+        if (!this.connected || !this._dirty.size) {
+            this._dirty.clear();
+            return;
+        }
+        const list = [...this._dirty].sort((a, b) => a.seq - b.seq).map(a => this._serializeAction(a));
+        this._dirty.clear();
+        this._post('ACTIONS', { actions: list });
+    }
+    _serializeAction(a) {
+        return {
+            seq: a.seq, type: a.type, data: preview(a.data), component: a.component, instance: a.instance, parent: a.parent,
+            sinks: [...a.sinks], cause: a.cause, at: a.at,
+            ...('after' in a ? { before: this._safeClone(a.before), after: this._safeClone(a.after) } : {}),
+        };
+    }
+    /** "Copy as test" for the panel: the session of `instance` (default: the root) */
+    _copyAsTest(instance) {
+        try {
+            return sessionToTest(getSession(instance ?? undefined), this._copyOptions);
+        }
+        catch (e) {
+            return { error: String(e?.message || e) };
+        }
+    }
+    /** Defaults for "Copy as test" from the panel (componentImport, drivers, imports, ...) */
+    configureCopyAsTest(options) {
+        this._copyOptions = { ...this._copyOptions, ...options };
+    }
+    /** The recorded session of an instance (see sygnal/devtools getSession) */
+    getSession(target) {
+        return getSession(target);
+    }
+    _setDebug({ componentId, enabled }) {
+        if (typeof componentId === 'undefined' || componentId === null) {
+            if (typeof window !== 'undefined')
+                window.SYGNAL_DEBUG = enabled ? 'true' : false;
+            this._post('DEBUG_TOGGLED', { global: true, enabled });
+            return;
+        }
+        const meta = this._components.get(componentId);
+        if (meta && meta._instanceRef) {
+            const instance = meta._instanceRef.deref();
+            if (instance) {
+                // (through the app's runtime API)
+                instance.__api?.setDebug(componentId, enabled);
+                meta.debug = enabled;
+                this._post('DEBUG_TOGGLED', { componentId, enabled });
+            }
+        }
+    }
+    _timeTravel({ componentId, componentName, state }) {
+        if (componentId == null || !state) {
+            console.warn('[Sygnal DevTools] _timeTravel: missing componentId or state', { componentId, hasState: !!state });
+            return;
+        }
+        if (typeof window === 'undefined')
+            return;
+        const newState = this._safeClone(state);
+        // Per-component time travel through the app's runtime API
+        const meta = this._components.get(componentId);
+        if (meta) {
+            const instance = meta._instanceRef?.deref();
+            if (!instance) {
+                console.warn(`[Sygnal DevTools] _timeTravel: WeakRef for component #${componentId} (${componentName}) has been GC'd`);
+            }
+            else if (instance.__api) {
+                // the runtime's setState (a queued action, one patch)
+                instance.__api.setState(componentId, () => ({ ...newState }));
+                this._post('TIME_TRAVEL_APPLIED', { componentId, componentName, state: newState });
+                return;
+            }
+        }
+        else {
+            console.warn(`[Sygnal DevTools] _timeTravel: no meta for componentId ${componentId}`);
+        }
+        // Fall back to the root's state
+        const app = window.__SYGNAL_DEVTOOLS_APP__;
+        if (app?.__runtime) {
+            app.__runtime.setState('root', () => ({ ...newState }));
+            this._post('TIME_TRAVEL_APPLIED', { componentId, componentName, state: newState });
+        }
+        else {
+            console.warn(`[Sygnal DevTools] _timeTravel: no fallback root STATE sink available`);
+        }
+    }
+    _takeSnapshot() {
+        const entries = [];
+        for (const [id, meta] of this._components) {
+            if (meta.disposed)
+                continue;
+            const instance = meta._instanceRef?.deref();
+            if (instance?.currentState != null) {
+                entries.push({
+                    componentId: id,
+                    componentName: meta.name,
+                    state: this._safeClone(instance.currentState),
+                });
+            }
+        }
+        this._post('SNAPSHOT_TAKEN', {
+            entries,
+            timestamp: Date.now(),
+        });
+    }
+    _restoreSnapshot(snapshot) {
+        if (!snapshot?.entries)
+            return;
+        for (const entry of snapshot.entries) {
+            this._timeTravel(entry);
+        }
+    }
+    _sendComponentState(componentId) {
+        const meta = this._components.get(componentId);
+        if (meta && meta._instanceRef) {
+            const instance = meta._instanceRef.deref();
+            if (instance) {
+                this._post('COMPONENT_STATE', {
+                    componentId,
+                    state: this._safeClone(instance.currentState),
+                    context: this._safeClone(instance.currentContext),
+                    contextTrace: this._buildContextTrace(componentId, instance.currentContext),
+                    props: this._safeClone(instance.currentProps),
+                });
+            }
+        }
+    }
+    _buildContextTrace(componentId, context) {
+        if (!context || typeof context !== 'object')
+            return [];
+        const trace = [];
+        const fields = Object.keys(context);
+        for (const field of fields) {
+            // Walk up parent chain to find which component provides this field
+            let currentId = componentId;
+            let found = false;
+            while (currentId != null) {
+                const meta = this._components.get(currentId);
+                if (!meta)
+                    break;
+                if (meta.mviGraph?.contextProvides?.includes(field)) {
+                    trace.push({ field, providerId: meta.id, providerName: meta.name });
+                    found = true;
+                    break;
+                }
+                currentId = meta.parentId;
+            }
+            if (!found) {
+                trace.push({ field, providerId: -1, providerName: 'unknown' });
+            }
+        }
+        return trace;
+    }
+    _sendFullTree() {
+        const tree = [];
+        for (const [, meta] of this._components) {
+            const instance = meta._instanceRef?.deref();
+            tree.push({
+                ...this._serializeMeta(meta),
+                state: instance ? this._safeClone(instance.currentState) : null,
+                context: instance ? this._safeClone(instance.currentContext) : null,
+            });
+        }
+        this._post('FULL_TREE', {
+            components: tree,
+            history: this._stateHistory,
+        });
+    }
+    _post(type, payload) {
+        if (typeof window === 'undefined')
+            return;
+        window.postMessage({
+            source: DEVTOOLS_SOURCE,
+            type,
+            payload,
+        }, '*');
+    }
+    _safeClone(obj) {
+        if (obj === undefined || obj === null)
+            return obj;
+        try {
+            return JSON.parse(JSON.stringify(obj));
+        }
+        catch (e) {
+            return '[unserializable]';
+        }
+    }
+    _extractMviGraph(instance) {
+        if (!instance.model)
+            return null;
+        try {
+            const sources = instance.sourceNames ? [...instance.sourceNames] : [];
+            const actions = [];
+            const model = instance.model;
+            for (const key of Object.keys(model)) {
+                let actionName = key;
+                let entry = model[key];
+                // Handle shorthand 'ACTION | SINK'
+                if (key.includes('|')) {
+                    const parts = key.split('|').map((s) => s.trim());
+                    if (parts.length === 2 && parts[0] && parts[1]) {
+                        actionName = parts[0];
+                        actions.push({ name: actionName, sinks: [parts[1]] });
+                        continue;
+                    }
+                }
+                // Function → targets STATE
+                if (typeof entry === 'function') {
+                    actions.push({ name: actionName, sinks: [instance.stateSourceName || 'STATE'] });
+                    continue;
+                }
+                // Object → keys are sink names
+                if (entry && typeof entry === 'object') {
+                    actions.push({ name: actionName, sinks: Object.keys(entry) });
+                    continue;
+                }
+            }
+            const contextProvides = instance.context && typeof instance.context === 'object'
+                ? Object.keys(instance.context) : [];
+            return { sources, actions, contextProvides };
+        }
+        catch (e) {
+            return null;
+        }
+    }
+    _serializeMeta(meta) {
+        const { _instanceRef, ...rest } = meta;
+        return rest;
+    }
+}
+let instance = null;
+/**
+ * The bridge singleton of the 'sygnal/devtools' entry. Not part of the core
+ * (D77): the core only calls the hooks of window.__SYGNAL_DEVTOOLS__ when it exists.
+ */
+function getDevTools() {
+    if (!instance)
+        instance = new SygnalDevTools();
+    return instance;
+}
+/**
+ * Install the bridge (what run() did before 6.0): window.__SYGNAL_DEVTOOLS__ is
+ * set and the extension can connect. A bridge already on window (e.g. a second
+ * copy of this entry) is kept. Nothing happens outside a browser.
+ */
+function installDevTools() {
+    if (typeof window === 'undefined')
+        return undefined;
+    const existing = window.__SYGNAL_DEVTOOLS__;
+    if (existing)
+        return existing;
+    const dt = getDevTools();
+    dt.init();
+    return dt;
+}
+
+/**
+ * PLAN-4 3-E (GS-10 stretch): a dev-only bridge to the Redux DevTools extension
+ * (window.__REDUX_DEVTOOLS_EXTENSION__), in 'sygnal/devtools'. Sends each recorded action
+ * (./devtoolsActions; built-in ones left out) with the root's state after it, as
+ * `{ type: '<Component>/<ACTION>', payload, cause, instance }`. Jump to state / action in the
+ * extension replaces the root's state (the Sygnal DevTools time-travel path). sygnal/vite calls it
+ * in dev with sygnal({ devtools: { redux: true } }).
+ */
+const clone = (s) => preview(s);
+let shared;
+/**
+ * Connect the app's root (run()'s result, a component, an instance id; default: the newest root)
+ * to the Redux DevTools extension. Returns a disconnect function; does nothing without the
+ * extension.
+ */
+function connectReduxDevtools(target, options) {
+    // the default connection (sygnal/vite may inject the call in several files) is made once
+    if (target === undefined && options === undefined) {
+        if (!shared) {
+            const off = connect(undefined, {});
+            shared = () => { off(); shared = undefined; };
+        }
+        return shared;
+    }
+    return connect(target, options || {});
+}
+function connect(target, options) {
+    const ext = typeof window != 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__;
+    if (!ext || typeof ext.connect != 'function')
+        return () => { };
+    recordActions();
+    const conn = ext.connect({ name: options.name || 'Sygnal', features: { jump: true, pause: true, export: true } });
+    const keep = options.filter || ((a) => a.cause != 'built-in');
+    let root, started = false, timer = null;
+    const queue = [];
+    const rootOf = () => {
+        if (!root || root.disposed || !root.c)
+            root = resolveInstance(target);
+        return root;
+    };
+    const flush = () => {
+        timer = null;
+        const r = start();
+        if (!r)
+            return;
+        for (const a of queue.splice(0)) {
+            const state = a.instance === r.id && 'after' in a ? a.after : r.c.currentState;
+            conn.send({ type: `${a.component}/${a.type}`, payload: preview(a.data), cause: a.cause, instance: a.instance }, clone(state));
+        }
+    };
+    const start = () => {
+        const r = rootOf();
+        if (r && !started) {
+            started = true;
+            conn.init(clone(r.c.currentState));
+        }
+        return r;
+    };
+    start();
+    const off = onAction((a, kind) => {
+        if (kind == 'reset') {
+            queue.length = 0;
+            started = false;
+            start();
+            return;
+        }
+        if (kind != 'add')
+            return;
+        // connected before run() (sygnal/vite): the root's first action, its state still the initial one
+        if (!started)
+            start();
+        if (!keep(a))
+            return;
+        queue.push(a);
+        if (timer === null)
+            timer = setTimeout(flush, 0);
+    });
+    const unsubscribe = conn.subscribe((msg) => {
+        if (msg?.type !== 'DISPATCH' || !msg.state)
+            return;
+        const t = msg.payload?.type;
+        if (t !== 'JUMP_TO_STATE' && t !== 'JUMP_TO_ACTION')
+            return;
+        const r = rootOf();
+        const dt = window.__SYGNAL_DEVTOOLS__;
+        if (!r || !dt || typeof dt._timeTravel != 'function')
+            return;
+        try {
+            dt._timeTravel({ componentId: Number(r.id), componentName: r.name, state: JSON.parse(msg.state) });
+        }
+        catch (_) { /* a bad state from the extension */ }
+    });
+    return () => {
+        off();
+        if (timer !== null)
+            clearTimeout(timer);
+        if (typeof unsubscribe == 'function')
+            unsubscribe();
+        try {
+            ext.disconnect?.();
+        }
+        catch (_) { /* ignore */ }
+    };
+}
+
+// 'sygnal/devtools' (D77): the DevTools bridge for the browser extension, a dev-only
+// entry. Importing it installs window.__SYGNAL_DEVTOOLS__ (run() did this before 6.0),
+// so import it before run(): components created earlier are not in the tree.
+// sygnal/vite injects it in dev (`vite`, not `vite build`); opt out with
+// sygnal({ devtools: false }). Production builds never contain it.
+// PLAN-4 3-E (GS-10): it also records the action log (in a browser on import; elsewhere
+// after recordActions()), and turns a session into a renderComponent test (copyAsTest).
+installDevTools();
+const isSession = (x) => !!x && typeof x == 'object' && x.version === 1 && Array.isArray(x.actions);
+/**
+ * "Copy as test", with what was left out: the session of `target` (undefined: the newest root;
+ * an instance id; a component; run()'s result; or a SessionRecording from getSession()).
+ */
+function copyAsTestResult(target, options) {
+    if (!isSession(target) && !isRecording())
+        throw new Error('[Sygnal DevTools] copyAsTest: nothing was recorded: import sygnal/devtools before run() (in a browser), or call recordActions() first');
+    return sessionToTest(isSession(target) ? target : getSession(target), options);
+}
+/** "Copy as test": a Vitest + renderComponent test replaying the recorded session (see copyAsTestResult). */
+function copyAsTest(target, options) {
+    return copyAsTestResult(target, options).code;
+}
+
+export { clearActions, connectReduxDevtools, copyAsTest, copyAsTestResult, getActions, getDevTools, getSession, installDevTools, isRecording, onAction, recordActions };
+//# sourceMappingURL=devtools.esm.js.map