@lmjs/core 1.0.7 → 2.0.2

package/src/_re.js

@@ -0,0 +1,2709 @@
+// `cl` is normally aliased in vendor/reconnecting-websocket.js (`var cl =
+// console.log;`), but that file is concatenated AFTER this one (see
+// build/bundle.js) — and this file's own Proxy traps below call `cl(e)` in
+// their catch handlers. That's reachable before the vendor file ever runs:
+// index-bootstrap.js (also after this file, before the vendor one) can
+// trigger _x()'s `set` trap (e.g. `_vt.Global.vars["x"] = ...` from a
+// compiled index.js) before any view exists, which throws internally
+// (`_vt.View._re` is undefined) and get caught right here — if `cl` isn't
+// defined yet at that point, the catch handler itself throws, aborting
+// whatever script called it (found 2026-09-14 testing against a real
+// running dev server). Harmless if vendor/reconnecting-websocket.js's own
+// `var cl = console.log;` runs later too — same value, redeclaration is a
+// no-op.
+var cl = console.log;
+
+class _v {
+    static name;
+    static type;
+    static vars;
+    static fns;
+    static rvs;
+    static _pv;
+    static mx;
+    static views;
+    static hst;
+    static settings;
+    constructor(obj) {
+        this.name = obj.name ?? 'home';
+        this.type = obj.type ?? 'main';
+        this.hst = obj.hst ?? [];
+        this.views = obj.views ?? [];
+        this.vars = obj.vars ?? {};
+        // 2026-09-17: per-instance event-handler functions (see walk.js's
+        // matching addition, and lstnrs.js's evalEvAttr) — a subview's own
+        // `function bump(){}` still becomes a real `window.bump` too (plain
+        // <script>-tag semantics, unchanged), but multiple mounted
+        // instances of the same subview file all define a same-named
+        // function, so window.bump silently becomes whichever instance's
+        // script ran last — every instance's @click ended up calling THAT
+        // one instance's handler regardless of which was actually clicked.
+        // .fns is this instance's own, unambiguous copy.
+        this.fns = obj.fns ?? {};
+        this.rvs = obj.rvs ?? {};
+        this._pv = obj._pv ?? null;
+        this.mx = obj.mx ?? [];
+        this.settings = obj.settings ?? {
+            layout: "default",
+            requireAuth: false,
+        };
+    }
+}
+
+// Override console.log
+const consoleLogOriginal = console.log;
+console.log = function () {
+    for (let i = 0; i < arguments.length; i++) {
+        const arg = arguments[i];
+        if (arg && arg.hasOwnProperty('__isProxy') || arg?.target) {
+            arguments[i] = arguments[i].target;
+        }
+    }
+    consoleLogOriginal.apply(console, arguments);
+};
+
+// ---- Central error reporting (2026-09-13) ----------------------------------
+// Replaces scattered `catch(e){cl(e)}` sites that silently swallowed errors.
+// Wired into a representative, developer-facing subset for now: expression
+// evaluation (scopedEval/lookup/evalExp), the pre-rewrite validator in
+// walk.js, and a compiled <script> block's own runtime errors. Not yet wired
+// into every catch site in this file — that's a deliberate, incremental scope,
+// not an oversight; the ones above are where a developer's own .view mistake
+// actually surfaces, which is what this phase set out to fix.
+//
+// _lumenDevMode is a plain constant for now, not wired to a real build/env
+// flag yet — flip it by hand until that decision is made.
+var _lumenDevMode = true;
+var _lumenErrorLog = [];
+
+// HST wire-format version this runtime expects (2026-09-15) — must be
+// bumped in lockstep with packages/cli/lib/fcs.js's HST_FORMAT_VERSION
+// whenever this file's walk()/renderHST() changes what fields it reads
+// from the parser's output. See renderView()'s version check and fcs.js's
+// own HST_FORMAT_VERSION comment for the full rationale.
+var EXPECTED_HST_FORMAT_VERSION = 1;
+
+// `_vt.View.vars["x"]` is what a runtime error will mention after the
+// walk.js rewrite — this recovers the developer's original name `x` so the
+// message reads the way the developer would expect, not the compiled form.
+function _translateLumenError(message) {
+    if (!message) return message;
+    return message.replace(/_vt\.View\.vars\[["'`]([^"'`\]]+)["'`]\]/g, '$1');
+}
+
+function reportLumenError(info) {
+    info = info || {};
+    var rawMessage = info.message || (info.error && info.error.message) || 'Unknown error';
+    var entry = {
+        time: new Date().toISOString(),
+        stage: info.stage || 'runtime',
+        view: info.view || (typeof _vt !== 'undefined' && _vt.View ? _vt.View.name : undefined),
+        expr: info.expr,
+        message: _translateLumenError(rawMessage),
+        hint: info.hint
+    };
+    _lumenErrorLog.push(entry);
+
+    if (_lumenDevMode) {
+        console.error(
+            '[LumenJS] ' + entry.stage + ' error in "' + (entry.view || 'unknown') + '"' +
+            (entry.expr ? ' — ' + entry.expr : '') +
+            ': ' + entry.message +
+            (entry.hint ? '\n  ' + entry.hint : '')
+        );
+    }
+    // Production stays quiet on-screen by design (point 6: don't crash the
+    // page the way V1's uncaught errors did) — the entry is still kept in
+    // _lumenErrorLog for later inspection; no telemetry hook wired yet.
+    return entry;
+}
+
+
+function _x(_x) {
+    var currPath = [];
+    // 2026-09-17: generalized from a position-specific check
+    // (`currPath[1] == "vars"`, only ever matched a flat `_vt.<root>.vars`
+    // write) to a real owner-walk — needed for per-instance subview
+    // scoping (`_vt.View.views[i].vars`, and its nested form
+    // `_vt.View.views[0].views[2].vars`), where "vars" can sit at any
+    // depth. `path` is currPath *without* the trailing "vars" segment.
+    // `Global` is a real special case, not a bug in this generalization:
+    // it has no `._re` of its own (see the object literal below — just
+    // `{vars:{}}`) since Global-var writes need to re-render whichever
+    // view is *currently* looking at that value, exactly like the
+    // pre-existing behavior this preserves. Everything else (View itself,
+    // or any views[i]/views[i].views[j]/... chain) is walked against the
+    // raw (non-proxied) tree — using the outer `_x` param directly, not
+    // the `_vt` proxy — so this traversal itself can't re-enter these
+    // traps and corrupt the in-flight currPath.
+    function _dispatchVarsUpdate(key) {
+        // "vars" can be anywhere in currPath, not just at index 1 — find
+        // it. The var name to update() is whatever comes right after it
+        // in currPath (e.g. `_vt.View.vars["obj"].nested = x` — the write
+        // itself is on "obj"'s own proxy, so `key` here is "nested", but
+        // the reactive var is "obj", one segment before it in currPath);
+        // if "vars" is the *last* segment, there's no next segment yet —
+        // that means this write IS the var (`_vt.View.vars["x"] = ...`),
+        // so `key` itself (the set() trap's own key) is the var name.
+        let varsIdx = currPath.indexOf("vars");
+        if (varsIdx === -1) return;
+        let varName = varsIdx < currPath.length - 1 ? currPath[varsIdx + 1] : key;
+        let rootPath = currPath.slice(0, varsIdx);
+        // Global has no ._re of its own (see its plain {vars:{}} literal
+        // below) — a Global write always re-renders whichever view is
+        // currently looking at it, exactly like the pre-existing behavior
+        // this preserves, for both the flat and nested-property case.
+        if (rootPath[0] === "Global") {
+            // 2026-09-18, real gap found and fixed: this file's own design
+            // comment above _vt's declaration says a Global var should be
+            // usable by "ordinary view code" just by referencing the
+            // name — but nothing ever made that true for a VIEW's own
+            // <script> statements (as opposed to mustaches/:if conditions,
+            // which already fall back to _vt.Global.vars via getVal()/
+            // evalExp()'s own merge). A view's compiled script only
+            // rewrites references to names IT ITSELF declares — it has no
+            // way to know index.js declared some other name as Global, so
+            // a bare reference to it (e.g. `rx.post(...)` where `rx =
+            // new RX(...)` was set in index.js's init()) resolved via the
+            // real JS scope chain, which only ever finds a real `window.rx`
+            // if something put it there — nothing did. Mirroring every
+            // Global write onto `window[varName]` too makes plain bare-
+            // identifier references resolve correctly and naturally,
+            // with zero per-script rewriting needed.
+            try {
+                if (typeof window !== 'undefined') window[varName] = _x.Global.vars[varName];
+            } catch (e) { }
+            if (_vt.View._re) _vt.View._re.update(varName);
+            return;
+        }
+        let owner = _x;
+        for (let i = 0; i < rootPath.length && owner; i++) {
+            owner = owner[rootPath[i]];
+        }
+        if (owner && owner._re) owner._re.update(varName);
+    }
+    const handler = {
+        get(target, key) {
+            if (key == "__isProxy") return true;
+            // 2026-09-14: reset must fire on ANY root key, not just "View" —
+            // this closure's currPath is shared by the whole _vt proxy tree,
+            // so a stale tail from a prior _vt.Global read (which never hit
+            // "View" to reset it) would otherwise get prepended to the next
+            // chain and corrupt which key set()'s update(key) fires for.
+            if (key == "View" || key == "Global") currPath = [];
+            currPath.push(key);
+            if (typeof target[key] === 'object' && target[key] !== null && key != "_re") {
+                // cl("salsaa", target, key)
+                return new Proxy(target[key], handler);
+            } else {
+                // cl("tartat", target, key);
+                return target[key] ?? (key == 'target' ? target : undefined) ?? undefined;
+            }
+        },
+        set(target, key, value) {
+
+            // cl(["hiiiiii", key, value]);
+            // console.log(`${key} set from ${target[key]} to ${value}`, target, Object.keys({ target })[0]);
+            target[key] = value;
+            // var _View = currPath[1] == "views" ? currPath[2] : "";
+
+            try {
+                // `_vt.View._re` genuinely doesn't exist yet during
+                // index.js's own bootstrap (before any view has mounted —
+                // see index-bootstrap.js) — that's the normal case now,
+                // not an error, so it's guarded (inside _dispatchVarsUpdate)
+                // rather than left to throw into the catch below.
+                _dispatchVarsUpdate(key);
+            } catch (e) {
+                cl(e);
+            }
+
+            currPath = [];
+            return true;
+        },
+        deleteProperty(target, key) {
+            if (!(key in target)) {
+                return false;
+            }
+            delete target[key];
+
+            try {
+                _dispatchVarsUpdate(key);
+            } catch (e) {
+                cl(e);
+            }
+            return true;
+        },
+        ownKeys(target) {
+            return Reflect.ownKeys(target);
+        },
+        has(target, key) {
+            return key in target;
+        },
+        defineProperty(target, key, descriptor) {
+            if (descriptor && "value" in descriptor) {
+                target[key] = descriptor.value;
+            }
+            return target;
+        },
+        getOwnPropertyDescriptor(target, key) {
+            const value = target[key];
+            return key in target
+                ? {
+                    value,
+                    enumerable: true,
+                    configurable: true,
+                }
+                : undefined;
+        },
+    };
+    var x = new Proxy(_x, handler);
+    return x;
+}
+
+// "Global" (2026-09-14): a second, permanent root next to "View" — unlike
+// _vt.View (replaced wholesale by a fresh _v() on every main-view navigation,
+// see _lm's constructor below), this object is never reassigned, so state
+// written here survives navigation. This is the target walk.js now rewrites
+// index.js's top-level vars into, since index.js runs once at bootstrap and
+// its vars (V1's documented convention for app-wide state like `isAdmin`)
+// need to outlive any single view. concatVarsAtLevel() below merges it into
+// every scope lookup so ordinary view code can just reference the name.
+// 2026-09-17, real bug found and fixed: `.fns` was missing here (only
+// `.vars` existed) — `walk.js`'s `_fnRegisterStatement()` (added for
+// per-instance subview scoping, see the per-instance-scoping work above)
+// unconditionally builds `<targetRoot>.fns["name"] = name;` for EVERY
+// top-level function declaration, regardless of target — including
+// `targetKey: "Global"`, used to compile index.js/project scripts. Any
+// real project with so much as one function declaration in index.js (an
+// extremely common pattern) crashed with "Cannot set properties of
+// undefined (setting '<fnName>')" the moment that line ran. Nearly
+// invisible in `lm serve` dev mode — index-bootstrap.js's synchronous XHR
+// fetch-and-eval of the compiled index.js is wrapped in a try/catch that
+// only `console.log`s the failure (never `console.error`/throws), so nothing
+// looked broken as long as the crash landed after anything load-bearing
+// (Reactor()) in that same script. Fatal in a real `lm build` production
+// bundle, where the compiled index.js is concatenated inline, unguarded —
+// an uncaught exception there aborts every remaining statement in the
+// whole bundle file, breaking the entire app on every real production
+// site with this pattern. Found deploying lumenjs.com's own real build.
+let _vt = _x({
+    "View": new _v({}),
+    "Global": { "vars": {}, "fns": {} }
+});
+
+class _lm {
+    _RealDOM = [];
+    _effects = {};
+    _cc = {};
+    _jj = {};
+    _ready = false;
+    view = undefined;
+    sbscrbs = [];
+    reactiveVariables = [];
+    vrs = {};
+    _CXR = [];
+    _LXR = [];
+
+    constructor(view) {
+        this.view = view;
+        this.view._re = this;
+        this.reactiveVariables = view?.rvs ?? {};
+        this.init();
+        if (this.view.type == "main") _vt.View = this.view;
+
+        // this.reactiveVariables = this.view.vars ?? _vt.View.vars ?? [];
+
+        if (this.view._pv) {
+            // cl("Subscribing to " , this.view);
+            this.view._pv.subscribe(this.view);
+        }
+
+        return this;
+    }
+
+    init() {
+        var par = this;
+        this.view.hst.forEach(function (doc) {
+            par.walk(doc, null);
+        });
+    }
+
+    subscribe(view) {
+        this.sbscrbs.push(view);
+    }
+
+    scopedEval(context, expr, kk) {
+        // cl("Cleaning", expr, kk, context);
+        // 2026-09-14: `ctx` was read/deleted here before its own `let ctx =`
+        // declaration a few lines down — a real TDZ bug (ReferenceError:
+        // Cannot access 'ctx' before initialization), not something either
+        // of us introduced. Only triggers on the TypeError-retry path (a
+        // failed eval retrying with the offending property stripped), which
+        // is common enough — any expression touching a property of
+        // something momentarily undefined hits it. Fixed by computing `ctx`
+        // first, same effect, no TDZ violation.
+        let ctx = this.concatVarsAtLevel(context, this);
+        if (kk) {
+            if (!ctx.hasOwnProperty(kk)) return undefined;
+            delete ctx[kk];
+        }
+        // cl("CONTEXT");
+        // cl(context);
+        // cl(ctx);
+        try {
+            // cl(["LopIsMissing???", context, expr]);
+            const evaluator = Function.apply(null, [
+                ...Object.keys(ctx),
+                "expr",
+                "return eval(expr)",
+            ]);
+            // cl(evaluator.apply(null, [...Object.values(context), expr]));
+            // if(expr=="patientProfile['Gender']") alert([evaluator.apply(null, [...Object.values(context), expr]), expr, Object.keys(context), context['patientProfile'], Object.keys(context.patientProfile)]);
+            return evaluator.apply(null, [...Object.values(ctx), expr]);
+        } catch (e) {
+            // if (_debugMode)
+            // cl([expr, context, e]);
+            if (e instanceof TypeError) {
+                return this.scopedEval(ctx, expr, e.message.split(" ")[0]);
+            }
+            reportLumenError({ stage: 'expression', expr: expr, error: e });
+            return undefined;
+        }
+    }
+
+    getVals(effect) {
+        let val = '';
+        // let mss = [];
+        if (effect.type == "text") {
+            if (!effect.isSplit) {
+                for (let i = 0; i < effect.splits.length; i++) {
+                    let split = effect.splits[i];
+                    if (split.type == 'mustache') {
+                        val += this.getVal(split.content);
+                    } else {
+                        val += split.content;
+                    }
+                }
+            } else {
+                val = this.getVal(effect.content);
+            }
+        } else if (effect.type == "attr" || effect.type == "event") {
+            for (let i = 0; i < effect.splits.length; i++) {
+                let split = effect.splits[i];
+                if (split.type == 'mustache') {
+                    val += this.getVal(split.content);
+                } else {
+                    val += split.content;
+                }
+            }
+            // mss = effect.mss[effect.name];
+        }
+
+        // for (let i = 0; i < mss.length; i++) {
+        // const ms = "{{" + mss[i] + "}}";
+        // cl(ms, this.getVal(ms, _.cloneDeep(_vt.View.vars)));
+        // val = val.split(ms).join(this.getVal(ms, _.cloneDeep(this.reactiveVariables)));
+        // }
+
+        return val;
+    }
+
+    renderAll() {
+        if (this._ready) return; //CHECK APPLICABILITY
+        this._ready = true;
+
+
+        for (const rv in this._effects) {
+            if (Object.prototype.hasOwnProperty.call(this._effects, rv)) {
+                const effects = this._effects[rv];
+                for (let ei = 0; ei < effects.length; ei++) {
+                    const effect = effects[ei];
+                    // cl("Effect for " + rv, effect);
+                    // effect.nd.textContent = "1234";
+
+                    if (!effect.nd) continue;
+                    // if (!effect.nd.isConnected) continue;
+                    try {
+                        if (effect.type == "text") {
+                            // cl(k, effect);
+                            effect.nd.textContent = this.render(effect);
+                        } else if (effect.type == "attr") {
+                            // cl("Setting Attr", k, effect, effect.name, this.render(effect));
+                            if (effect.name == "value") {
+                                effect.nd.value = this.render(effect);
+                            } else {
+                                effect.nd.setAttribute(effect.name, this.render(effect));
+                                if (effect.name == "view") {
+                                    effect.nd.subPath = this.render(effect);
+                                    renderView(this.render(effect), true, {});
+                                }
+                            }
+                        } else if (effect.type == "event") {
+                            effect.nd.events[effect.name] = this.render(effect);
+                        }
+                    } catch (e) {
+                        cl("Eeeeee", e);
+                    }
+                }
+            }
+        }
+
+
+        this.updateCXRs();
+        this.updateLXRs();
+        this.updateVXRs();
+
+        // 2026-09-18: same Reactor({tick}) fix as update() below — also
+        // fired on the very first render (not just subsequent reactive
+        // updates), since a real tick() use (e.g. hljs.highlightAll())
+        // needs to run on initial content too, not just after the first
+        // change.
+        if (typeof appSettings !== 'undefined' && appSettings && typeof appSettings.tick === 'function') {
+            try {
+                appSettings.tick();
+            } catch (e) {
+                cl(e);
+            }
+        }
+    }
+
+    chainConnected(cx) {
+        for (let i = cx.chain.length - 1; i >= 0; i--) {
+            const cxs = cx.chain[i];
+            if (cxs.ref.isPreConnected) {
+                return true;
+            }
+        }
+        return false;
+    }
+
+    async updateVXRs(k) {
+        let subsNames = [];
+        for (let i = 0; i < this.view.views.length; i++) {
+            const _view = this.view.views[i];
+            if (!subsNames.includes(_view.subPath)) subsNames.push(_view.subPath);
+        }
+        // cl(subsNames);
+        // 2026-09-17: real bug found and fixed — this used to always call
+        // the plain, no-args renderView(n, true, {}), which only ever
+        // searches _vt.View.views (the MAIN view's own array). That's
+        // correct when `this` IS the main view, but updateVXRs() also
+        // runs on every SUBVIEW instance's own _re (renderAll() calls it
+        // unconditionally) — for a subview that itself hosts further
+        // subviews, `this.view.views` holds THOSE, not the main view's,
+        // so the old call could never find them: nested subviews never
+        // rendered at all. Passing this.view.views + this.view.scopePath
+        // (set once, in renderHST(), when this instance itself was
+        // rendered — ["View"] for the main view, unchanged) lets
+        // renderView() search the RIGHT array and address the RIGHT
+        // nested scope regardless of how deep this instance is.
+        for (let i = 0; i < subsNames.length; i++) {
+            const n = subsNames[i];
+            renderView(n, true, {}, 'views', this.view.views, this.view.scopePath || ["View"]);
+        }
+    }
+
+    async updateCXRs(k) {
+        for (let i = 0; i < this._CXR.length; i++) {
+            const cx = this._CXR[i];
+            if (cx.name == "if") {
+                let isTrue = this.evalExp(cx.content, this.reactiveVariables);
+                // cl("IF", isTrue, cx.content, this.reactiveVariables, cx);
+                if (isTrue) {
+                    await this.showSectionCX(cx, k);
+                } else {
+                    await this.hideSectionCX(cx);
+                }
+            } else if (cx.name == "else-if") {
+                if (!this.chainConnected(cx)) {
+                    let isTrue = this.evalExp(cx.content, this.reactiveVariables);
+                    // cl("ELSE-IF", isTrue, cx.content, this.reactiveVariables, cx);
+                    if (isTrue) {
+                        await this.showSectionCX(cx, k);
+                    } else {
+                        await this.hideSectionCX(cx);
+                    }
+                } else {
+                    await this.hideSectionCX(cx);
+                }
+            } else if (cx.name == "else") {
+                // cl("ELSE", !this.chainConnected(cx), cx);
+                if (!this.chainConnected(cx)) {
+                    await this.showSectionCX(cx, k);
+                } else {
+                    await this.hideSectionCX(cx);
+                }
+            }
+
+        }
+    }
+
+    // @before-render / @after-render for :if/:else-if/:else (2026-09-14) —
+    // shared by all three updateCXRs() branches above. This runs on EVERY
+    // reactive update those branches are eligible for, not just when the
+    // condition actually flips — `cx.ref.node.isConnected` (a real, always-
+    // accurate DOM property) is what gates hook firing to genuine
+    // hidden->visible / visible->hidden transitions, not `isPreConnected`
+    // (an internal bookkeeping flag with more edge cases across the
+    // if/else-if/else chain than is worth relying on here).
+    async showSectionCX(cx, k) {
+        let wasConnected = cx.ref.node.isConnected;
+        cx.ref.isPreConnected = true;
+        await renderSection(cx.ref, cx.doc, this, k);
+        if (!wasConnected) await fireRenderHook(cx, 'after-render', cx.ref.node, { visible: true });
+    }
+
+    async hideSectionCX(cx) {
+        if (cx.ref.node.isConnected) await fireRenderHook(cx, 'before-render', cx.ref.node, { visible: false });
+        cx.ref.isPreConnected = false;
+        cx.ref.node.replaceWith(cx.ref);
+    }
+
+    render(effect) {
+        let x = "";
+
+        try {
+            if (effect.type == "text" || effect.type == "attr" || effect.type == "event") {
+                x = this.getVals(effect);
+            }
+        } catch (e) {
+            cl(e);
+        }
+
+        return x;
+    }
+
+    update(k) {
+        if (!this._ready) return;
+        // cl("Hello", k);
+
+
+        // cl(k, this._effects.hasOwnProperty(k));
+
+        if (this._effects.hasOwnProperty(k)) {
+            const effects = this._effects[k];
+            // cl(effects);
+            for (let ei = 0; ei < effects.length; ei++) {
+                const effect = effects[ei];
+                // cl("Effect for " + k, effect);
+                // effect.nd.textContent = "1234";
+
+                if (!effect.nd) continue;
+                // if (!effect.nd.isConnected) continue;
+                try {
+                    if (effect.type == "text") {
+                        // cl(k, effect);
+                        effect.nd.textContent = this.render(effect);
+                    } else if (effect.type == "attr") {
+                        // cl("Setting Attr", k, effect, effect.name, this.render(effect));
+                        if (effect.name == "value") {
+                            effect.nd.value = this.render(effect);
+                        } else {
+                            effect.nd.setAttribute(effect.name, this.render(effect));
+                            if (effect.name == "view") {
+                                effect.nd.subPath = this.render(effect);
+                                renderView(this.render(effect), true, {});
+                            }
+                        }
+                    } else if (effect.type == "event") {
+                        effect.nd.events[effect.name] = this.render(effect);
+                    }
+                } catch (e) {
+                    cl("Eeeeee", e);
+                }
+            }
+        }
+
+        this.updateCXRs(k);
+        this.updateLXRs(k);
+        for (let sbscsi = 0; sbscsi < this.sbscrbs.length; sbscsi++) {
+            const sbscr = this.sbscrbs[sbscsi];
+            sbscr._re.update(k);
+        }
+
+        // 2026-09-18: Reactor({tick}) — documented ("runs after every
+        // re-render, anywhere", lumenjs-spec.md §5.4/llms.md §3) but never
+        // actually called anywhere in this runtime — see this fix's fuller
+        // comment at Reactor()'s own definition (vendor/reconnecting-
+        // websocket.js) for how this was found. update() is the real
+        // per-reactive-change render point (unlike renderAll(), which only
+        // ever runs once per _lm instance, at initial mount) — this is
+        // where "after every re-render, anywhere" actually lives. Guarded
+        // on appSettings existing since update() can fire during index.js's
+        // own bootstrap, before Reactor() has run.
+        if (typeof appSettings !== 'undefined' && appSettings && typeof appSettings.tick === 'function') {
+            try {
+                appSettings.tick();
+            } catch (e) {
+                cl(e);
+            }
+        }
+    }
+
+    async updateLXRs(k) {
+        for (let i = 0; i < this._LXR.length; i++) {
+            var cx = this._LXR[i];
+
+            var forX = cx.forX;
+
+            if (k && k != forX['js']) continue;
+
+            var val = this.getVal(forX['js'], "");
+
+            // cl("FORR", cx, val);
+
+            var tempVal = [];
+            if (this.typeStr(val) == "number") {
+                for (let i = 0; i < val; i++) {
+                    tempVal.push(i);
+                }
+                val = tempVal;
+            }
+
+
+            let vals = [];
+            let isObj = false;
+            if (this.typeStr(val) == "object") {
+                isObj = true;
+
+                for (const oKey in val) {
+                    if (Object.hasOwnProperty.call(val, oKey)) {
+                        const item = val[oKey];
+                        let objj = {
+                            key: oKey,
+                            value: item,
+                        };
+                        vals.push(objj);
+                    }
+                }
+            } else vals = clone(val);
+
+            if (this.typeStr(vals) == "array" && vals.length > 0) {
+                // cl("ARRAY", cx.ref, vals);
+                let forIf = cx.cond;
+                let limit = vals.length;
+                let offset = 0;
+                if (cx.limit) limit = (isNaN(cx.limit) ? cx.limit : limit) > vals.length ? vals.length : cx.limit * 1;
+                if (cx.offset) offset = (isNaN(cx.offset) ? cx.offset : offset) < 0 ? 0 : cx.offset * 1;
+
+
+                let marray = [];
+                if (forIf) {
+                    marray = vals.slice(offset * 1, vals.length);
+                } else {
+                    marray = vals.slice(offset * 1, limit * 1 + offset * 1);
+                }
+
+                // cl(cx, vals, limit, offset, forIf, marray);
+
+                let myLimit = 0;
+                // let myClones = [];
+
+                let arrayToRender = [];
+                let arrayToRenderVXs = [];
+
+                for (var index = 0; index < marray.length; index++) {
+                    if (myLimit == limit * 1) break;
+                    try {
+                        let vx = {}; //clone(_vt.View.vars);
+                        vx['index'] = myLimit;
+                        if (forX['dx'] != "") vx[forX['dx']] = myLimit;
+                        if (isObj) {
+                            if (forX['as']['v'] != "") {
+                                if (forX['as']['k']) vx[forX['as']['k']] = marray[index]['key'];
+                                if (forX['as']['v']) vx[forX['as']['v']] = marray[index]['value'];
+                            } else {
+                                if (forX['as']['k']) vx[forX['as']['k']] = marray[index];
+                            }
+                            vx['key'] = marray[index]['key'];
+                            vx['value'] = marray[index]['value'];
+                        } else {
+                            if (forX['as']['k']) vx[forX['as']['k']] = marray[index];
+                            // 2026-09-17, real bug found and fixed: a bare
+                            // `:for="items"` (no `as item` alias) is
+                            // documented — and was V1's real, working
+                            // behavior — to spread each item's own object
+                            // keys directly into loop scope, so
+                            // `items = [{number:1}]` lets a mustache read
+                            // `{{number}}` with no alias at all. Nothing in
+                            // this branch ever did that spread — `vx` had
+                            // no alias key AND no spread keys, so a bare
+                            // mustache like this always evaluated as an
+                            // undefined identifier and silently rendered
+                            // blank. Only spread for a plain-object item —
+                            // a primitive (string/number) array item has no
+                            // keys to spread and is read via the untouched
+                            // alias path instead.
+                            else if (marray[index] && typeof marray[index] === 'object') {
+                                for (const k2 in marray[index]) {
+                                    if (Object.prototype.hasOwnProperty.call(marray[index], k2)) {
+                                        vx[k2] = marray[index][k2];
+                                    }
+                                }
+                            }
+                        }
+                        // cl(forX, vx);
+                        // cl("VXXXX", vx, this);
+
+                        if (forIf) {
+                            // 2026-09-17, real bug found and fixed:
+                            // evalExp()'s 2nd param is a NAMES array to
+                            // look up in _vt.View.vars/_vt.Global.vars (see
+                            // its other real call site, `this.evalExp(cx.content,
+                            // this.reactiveVariables)`) — but `vx` here is
+                            // a VALUES object (the just-built loop-item
+                            // scope), not a names array. `vars.length` on a
+                            // plain object is undefined, so evalExp's own
+                            // `for (i=0; i<vars.length; i++)` loop never
+                            // ran even once — every `:for-if` condition
+                            // referencing the loop item (`item.value > 10`,
+                            // the exact documented example) always
+                            // evaluated against an empty scope and either
+                            // threw (caught, filtered out) or read
+                            // `undefined`. evalExp() already has a real,
+                            // working mechanism for exactly this — it
+                            // merges `this.vrs` (the loop-scope override
+                            // object) at the highest priority — so route
+                            // through that instead of a second, broken
+                            // parameter shape.
+                            let _prevVrs = this.vrs;
+                            this.vrs = vx;
+                            let isTrue;
+                            try {
+                                isTrue = this.evalExp(forIf, []);
+                            } finally {
+                                this.vrs = _prevVrs;
+                            }
+                            if (!isTrue) continue;
+                        }
+
+                        let miIndexx = offset * 1 + index * 1;
+
+
+                        // let cln = this.createSection(cx, vx, forX, k);
+                        arrayToRender.push(marray[index]);
+                        arrayToRenderVXs.push(vx);
+                        // let basket = await renderSection(cx.ref, cx.doc, this, k, {
+                        //     cx, vx, forX, miIndexx
+                        // });
+                        // cl(basket);
+                        // cl([
+                        //     cx.ref.isConnected,
+                        //     cx.ref.node.isConnected,
+                        //     cx,
+                        //     "REAL INDEX: " + myLimit,
+                        //     miIndexx,
+                        //     forIf,
+                        //     isObj,
+                        //     forX,
+                        //     vx
+                        // ]);
+                        myLimit++;
+                    } catch (e) {
+                        cl(e);
+                    }
+                }
+
+                // cl("ATR", arrayToRender);
+                let oldATR = cx.atr;
+                // 2026-09-17, real bug found and fixed: cx.atr used to
+                // store a reference to arrayToRender's own item objects,
+                // not an independent snapshot — arrayToRender's items are
+                // the actual current elements of the reactive array (e.g.
+                // _vt.View.vars["features"]), so a completely ordinary
+                // update pattern (mutate an item in place inside .map(),
+                // return the same reference — `f.done = !f.done; return
+                // f;`, not "rebuild a new object") left oldATR and the
+                // next render's arrayToRender pointing at the exact same,
+                // already-mutated objects by the time compareArrays()
+                // ran. deepCompare()'s JSON.stringify comparison was
+                // never wrong — it was comparing an object against
+                // itself, so every 'update' action was silently lost and
+                // the DOM never re-rendered. clone() (already used a few
+                // lines above for `vals`) gives cx.atr a true independent
+                // snapshot instead. Found clicking a real @click-toggled
+                // :for item on lumenjs.com's own real V2 homepage — no
+                // existing test used an in-place item mutation, only
+                // whole-array reassignment with new items (see render-
+                // hooks.integration.test.js's `images = [...,'c']`),
+                // which never exposed this since a length change always
+                // hits compareArrays()'s add/remove branches regardless.
+                cx.atr = clone(arrayToRender);
+                // cl(oldATR, arrayToRender);
+
+                const actions = this.compareArrays(oldATR, arrayToRender);
+                // cl("ACTNS", actions);
+
+                // @before-render / @after-render (2026-09-14) — lets a
+                // developer tear down and re-initialize a DOM-owning plugin
+                // (a slider, for instance) around this :for loop's own
+                // diff-and-patch pass, instead of it silently breaking the
+                // next time the underlying data changes. Skipped entirely
+                // when nothing actually changed. Fires on the very first
+                // render too (`actions` is all "add" then), so one
+                // @after-render handler covers both "initialize" and
+                // "re-initialize after data changed" — no separate manual
+                // bootstrap call needed. See fireRenderHook()'s own comment.
+                if (actions.length) await fireRenderHook(cx, 'before-render', cx.ref.parentElement, { items: arrayToRender, actions });
+
+                for (let ai = 0; ai < actions.length; ai++) {
+                    const actn = actions[ai];
+                    if (actn.action == 'add') {
+                        //Add Items To The DOM at Index
+                        // actn = {
+                        //     "action": "add",
+                        //     "index": 0,
+                        //     "element": {
+                        //         "key": "Name",
+                        //         "value": "Abdul Rahman"
+                        //     }
+                        // };
+                        let vx = arrayToRenderVXs[actn.index];
+                        // cl([cx, vx, isObj, forX])
+                        let cln = await this.createSection(cx, vx, isObj, forX);
+                        cx.ref.before(cln);
+
+
+                        cln.replaceWith(cln.node);
+                        // cln.node.innerHTML = "";
+                        // cln.node.append(...cln._re._RealDOM);
+                        // cl(cln);
+
+                    } else if (actn.action == 'remove') {
+
+                        // cl("Remove", actn);
+                        // let vx = arrayToRenderVXs[actn.index];
+                        // let cln = await this.createSection(cx, vx);
+                        // cx.ref.before(cln);
+
+                        var keyed = cx.key + '_' + actn.index;
+
+                        let tx = cx.ref?.nodes[keyed];
+
+                        if (tx) {
+                            tx.remove();
+                            tx.node.remove();
+                            delete cx.tx?.nodes[keyed];
+                            // if(ref.isConnected){
+                            // } else if(ref.node.isConnected){
+
+                            // }
+                        }
+
+                        // cln.replaceWith(cln.node);
+                        // cln.node.innerHTML = "";
+                        // cln.node.append(...cln._re._RealDOM);
+                        // cl(cln);
+                    } else {
+                        // let vx = arrayToRenderVXs[actn.index];
+                        // let cln = await this.createSection(cx, vx);
+                        // cx.ref.before(cln);
+
+                        var keyed = cx.key + '_' + actn.index;
+
+                        let tx = cx.ref?.nodes[keyed];
+
+                        let vx = arrayToRenderVXs[actn.index];
+                        if (tx) {
+                            // tx._re.reactiveVariables = [...tx._re.reactiveVariables, ...Object.keys(vx)];
+                            // cl("UPDATE", [tx], vx, tx._re);
+                            tx._re.vrs = vx;
+                            if (tx.isObj) {
+                                if (tx.forX.as['k'] != "") tx._re.update(tx.forX.as['k']);
+                                else tx._re.update(tx.forX.js);
+                                if (tx.forX.as['v'] != "") tx._re.update(tx.forX.as['v']);
+                                // cl("Updating", tx.forX.as['k'], tx.forX.as['v']);
+                                for (let actnsi = 0; actnsi < actn.updates.length; actnsi++) {
+                                    const actnu = actn.updates[actnsi];
+                                    tx._re.update(actnu.property);
+                                }
+                            } else {
+                                if (tx.forX.as['k'] != "") tx._re.update(tx.forX.as['k']);
+                                else tx._re.update(tx.forX.js);
+                                // cl("Updating", tx.forX);
+                            }
+
+                            // tx._re.renderAll();
+                            // if(ref.isConnected){
+                            // } else if(ref.node.isConnected){
+
+                            // }
+                        }
+
+                        // cln.replaceWith(cln.node);
+
+                    }
+                }
+
+                if (actions.length) await fireRenderHook(cx, 'after-render', cx.ref.parentElement, { items: arrayToRender, actions });
+
+            } else {
+                // cl("NO ARRAY", cx.ref);
+                cx.nodes = [];
+            }
+            // if (cx.name == "if") {
+            //     let isTrue = this.evalExp(cx.value, this.reactiveVariables);
+            //     if (isTrue) {
+            //         await renderSection(cx.ref, cx.doc, this, k);
+            //     } else {
+            //         cx.ref.node.replaceWith(cx.ref);
+            //     }
+            // }
+
+        }
+    }
+
+
+    compareLogic(array1, array2) {
+        if (array1.length === array2.length) {
+            // Perform update-only algorithm when arrays have the same length
+            // ...
+            return 1;
+        } else {
+            if (array1.length > array2.length) {
+                // Array1 has more elements, indicating there are deleted items
+                // Use two-way comparison to find deleted indexes
+                // If successful, perform the necessary removals
+                // Otherwise, proceed with update and removal comparisons
+                // ...
+                return 2;
+            } else {
+                // Array2 has more elements, indicating there are added items
+                // Use two-way comparison to find added indexes
+                // If successful, perform the necessary additions
+                // Otherwise, proceed with update and addition comparisons
+                // ...
+                return 3;
+            }
+        }
+    }
+
+    compareArrays(array1, array2) {
+        const actions = [];
+        // let cpl = this.compareLogic(array1, array2);
+
+        // if (cpl == 2) {
+        //     cl("Deleted", this.findDeletedIndexes(array1, array2));
+        // } else if (cpl == 3) {
+        //     cl("Added", this.findAddedIndexes(array1, array2));
+        // }
+
+        const maxLength = Math.max(array1.length, array2.length);
+        for (let i = 0; i < maxLength; i++) {
+            const element1 = array1[i];
+            const element2 = array2[i];
+
+            if (!element2) {
+                actions.push({
+                    action: 'remove',
+                    index: i
+                });
+            } else if (!element1) {
+                actions.push({
+                    action: 'add',
+                    index: i,
+                    element: element2
+                });
+            } else if (!this.deepCompare(element1, element2)) {
+                actions.push({
+                    action: 'update',
+                    index: i,
+                    updates: this.getUpdates(element1, element2)
+                });
+            }
+        }
+
+        return actions;
+    }
+
+    findDeletedIndexes(array1, array2) {
+        const deletedIndexes = [];
+        let par = this;
+
+        array1.forEach((item, index) => {
+            const foundIndex = array2.findIndex((el) => par.deepCompare(el, item));
+            if (foundIndex === -1) {
+                deletedIndexes.push(index);
+            }
+        });
+
+        return deletedIndexes;
+    }
+
+    findAddedIndexes(array1, array2) {
+        const addedIndexes = [];
+        let par = this;
+
+        array2.forEach((item, index) => {
+            const foundIndex = array1.findIndex((el) => par.deepCompare(el, item));
+            if (foundIndex === -1) {
+                addedIndexes.push(index);
+            }
+        });
+
+        return addedIndexes;
+    }
+
+    deepCompare(obj1, obj2) {
+        // Compare objects by stringifying and comparing their JSON representation
+        return JSON.stringify(obj1) === JSON.stringify(obj2);
+    }
+
+    getUpdates(oldObj, newObj) {
+        const updates = [];
+        for (const key in newObj) {
+            if (newObj.hasOwnProperty(key) && newObj[key] !== oldObj[key]) {
+                updates.push({ property: key, value: newObj[key] });
+            }
+        }
+        return updates;
+    }
+
+
+    getVal(mo, indexName) {
+        let vars = {};
+        try {
+            for (let i = 0; i < this.reactiveVariables.length; i++) {
+                // 2026-09-14: fall back to _vt.Global.vars when a view
+                // doesn't declare this var itself — the real-world case of
+                // a mustache/:if referencing an index.js global (e.g.
+                // `isAdmin`) that this view's own script never assigns.
+                // concatVarsAtLevel() already does this merge for
+                // lookup()/scopedEval(); getVal() (what mustache text nodes
+                // actually call) had its own separate, unmerged read here
+                // and was silently rendering these as empty.
+                let __name = this.reactiveVariables[i];
+                vars[__name] = _vt.View.vars.hasOwnProperty(__name)
+                    ? _vt.View.vars[__name]
+                    : _vt.Global.vars[__name];
+            }
+            for (const ky in this.vrs) {
+                if (Object.prototype.hasOwnProperty.call(this.vrs, ky)) {
+                    vars[ky] = this.vrs[ky]
+                }
+            }
+            // 2026-09-17: per-instance subview scoping — a subview's own
+            // declared vars live on `this.view.vars` (wired up in
+            // renderHST()/renderView() to be the SAME object its compiled
+            // script's `_vt.View.views[i].vars[...]` writes reach), not
+            // in the flat `_vt.View.vars` checked above (that's still
+            // only ever the MAIN view). Checked last/highest-priority,
+            // same shadowing shape as the `this.vrs` merge just above —
+            // an instance's own var wins over anything it inherited.
+            if (this.view && this.view.vars) {
+                for (const ky in this.view.vars) {
+                    if (Object.prototype.hasOwnProperty.call(this.view.vars, ky)) {
+                        vars[ky] = this.view.vars[ky];
+                    }
+                }
+            }
+        } catch (e) {
+            cl(e);
+        }
+
+        mo = (mo).trim();
+        // cl(["getVal", mo, vars, indexName]);
+        // if (mo == "patientProfile['Gender']") {
+        //   cl(["getVal", mo, vars, indexName]);
+        // }
+        if (mo.slice(0, 2) == "{{") {
+            mo = mo.slice(2, -2);
+        }
+        // if (mo == 'new Date(article.createdAt.split("T")[0]).getDate()')
+        // if(mo=="genders[`patientProfile['Gender']`]") cl(["getVal", mo, vars, indexName]);
+        let value = "";
+        let _mo = mo;
+
+        if (mo.indexOf("`") > -1) {
+            var matchesVal = _mo.match(/\.`[\s\S]*?`/g);
+            // cl(["shuuuu", matchesVal, _mo]);
+            if (matchesVal)
+                for (var y = 0; y < matchesVal.length; y++) {
+                    _mo = _mo
+                        .split(matchesVal[y])
+                        .join(
+                            "." +
+                            this.getVal(
+                                matchesVal[y].substr(1).slice(1, -1),
+                                indexName
+                            )
+                        );
+                }
+
+            var matchesVal = _mo.match(/`[\s\S]*?`/g);
+            // cl(["suuuu", matchesVal, _mo]);
+            if (matchesVal)
+                for (var y = 0; y < matchesVal.length; y++) {
+                    // cl([
+                    //   "3uuu",
+                    //   this.getVal(matchesVal[y].slice(1, -1), vars, indexName),
+                    //   matchesVal,
+                    //   y,
+                    //   matchesVal[y].slice(1, -1),
+                    //   vars,
+                    //   indexName,
+                    // ]);
+                    _mo = _mo
+                        .split(matchesVal[y])
+                        .join(
+                            "'" +
+                            this.getVal(matchesVal[y].slice(1, -1), indexName) +
+                            "'"
+                        );
+                }
+
+            // cl([this.getVal(_mo, vars, indexName), "kuuuuk", _mo, vars, indexName]);
+            return this.getVal(_mo, indexName);
+        }
+
+        if (mo.indexOf(";") > -1) {
+            let zxx = mo.split(";");
+            mo = $.trim(zxx[0]);
+        }
+
+        if (mo.indexOf(" as ") > -1) {
+            mo = mo.split(" as ");
+            return this.getVal(mo[0], indexName);
+        }
+
+        if (indexName) {
+            indexName = indexName.toString();
+            if (
+                mo.indexOf(indexName) > -1 &&
+                mo != indexName &&
+                vars.hasOwnProperty(indexName) &&
+                mo != "index"
+            ) {
+                mo = mo.split(indexName).join(vars[indexName]);
+                return this.getVal(mo, indexName);
+            }
+        }
+
+        var Ondex = mo.match(/\bindex\b/g);
+        if (Ondex && mo != "index" && vars.hasOwnProperty("index")) {
+            _mo = mo.replace(/\bindex\b/g, vars["index"]);
+            // cl(["Hassss",mo,vars["index"], vars, this.getVal(_mo, vars, indexName)]);
+            return this.getVal(_mo, indexName);
+        }
+
+        // if (this.isJS(mo, vars)) {
+        // cl("get",mo);
+        value = this.lookup(mo, vars);
+        // } else {
+        //     value = this.lookup(mo, vars);
+        //     // if (mo == "index") cl("kiki", value);
+        // }
+
+        // cl(["VALZZZZZZZZ", mo, vars, value, value ?? ""]);
+        return value ?? "";
+    }
+
+    concatVarsAtLevel(levelVars, parent) {
+
+        if (!parent.view._pv) {
+            var concatenatedVars = { ...levelVars };
+            if (parent.view.vars) {
+                // Global vars (index.js's top-level state, see _vt.Global
+                // above) sit at the lowest priority here — a view or a
+                // narrower scope declaring the same name shadows it, same
+                // as real JS scoping would.
+                concatenatedVars = { ..._vt.Global.vars, ...parent.view.vars, ...concatenatedVars };
+            }
+            return concatenatedVars;
+        }
+
+        var concatenatedVars = { ...levelVars };
+        if (parent.view.vars) {
+            // Object.assign(concatenatedVars, parent.view.vars);
+            concatenatedVars = { ...parent.view.vars, ...concatenatedVars };
+        }
+
+        return this.concatVarsAtLevel(concatenatedVars, parent.view._pv);
+    }
+
+    lookup(name, vaz) {
+
+        // for (const key in _vt.View.vars) {
+        //     if (Object.prototype.hasOwnProperty.call(_vt.View.vars, key)) {
+        //         vaz[key] = _vt.View.vars[key];
+        //     }
+        // }
+        // if(name == '{{new Date(article.createdAt.split("T")[0]).getDate()}}') 
+        // cl(["lookup", name, vaz]);
+        // cl(vaz);
+        // cl(this.concatVarsAtLevel(vaz, this));
+
+        let vars = this.concatVarsAtLevel(vaz, this);
+        // cl("VAAZZZ");
+        // cl(vaz);
+        // cl(vars);
+
+        try {
+            var value;
+            var names,
+                index,
+                lookupHit = false;
+
+            if (this.hasProperty(vars, name)) {
+                value = vars[name];
+                // cl(["luuuu", vars, name, value]);
+            } else if (name.indexOf(".") > -1 && name.indexOf("[") == -1) {
+                // cl(["laaaaaa", vars, name, value]);
+                var value = this.scopedEval(vars, name);
+                // cl(["liiii", vars, name, value]);
+                if (!(value || value == 0)) {
+                    value = vars;
+                    names = name.split(".");
+                    index = 0;
+                    while (value != null && index < names.length) {
+                        if (index === names.length - 1)
+                            lookupHit = this.hasProperty(value, names[index]);
+                        value = value[names[index++]];
+                        //{{v.0.kuku}} v then v.0 then v.0.kuku ...... iterate through nested chains
+                    }
+                }
+            } else {
+                var value = this.scopedEval(vars, name);
+                // if (name == "patientProfile['Gender']") {
+                // cl(["==zzzzzlookup", name, vaz, value, vars, name]);
+                // }
+                // if (name == 'new Date(article.createdAt.split("T")[0]).getDate()') cl(["laaa", vars, name, value]);
+                if (!(value || value == 0)) {
+                    if (name.indexOf(".") == -1 && name.indexOf("[") > -1) {
+                        let _name = name;
+                        var matchesVal = _name.match(/\[[\s\S]*?\]/g);
+                        for (var y = 0; y < matchesVal.length; y++) {
+                            if (
+                                matchesVal[y].indexOf("'") == -1 &&
+                                matchesVal[y].indexOf('"') == -1
+                            )
+                                _name = _name
+                                    .split(matchesVal[y])
+                                    .join("['" + matchesVal[y].slice(1, -1) + "']");
+                        }
+                        var value = this.scopedEval(vars, _name);
+                    }
+                }
+            }
+
+            if (this.isFunction(value)) value = value.call(value);
+
+            // if (name == "patientProfile['Gender']") {
+            // cl(["===========lookup", name, vaz, value]);
+            // }
+
+            // if (name == 'new Date(article.createdAt.split("T")[0]).getDate()') cl(["lookup", name, vaz, value]);
+
+            // if (value || value==0) return value;
+
+            // else {
+            //     value = this.scopedEval(vars, name);
+            // }
+
+            // cl("n: ",name," val: ",value," v: ",vaz)
+        } catch (e) {
+            reportLumenError({ stage: 'lookup', expr: name, error: e });
+            return "";
+        }
+        // if (name == 'new Date(article.createdAt.split("T")[0]).getDate()') cl("halaaaaaa", value);
+        // cl("halaaaaaa", value);
+        return value;
+    }
+
+
+    objectToString = Object.prototype.toString;
+    isArray =
+        Array.isArray ||
+        function isArrayPolyfill(object) {
+            return objectToString.call(object) === "[object Array]";
+        };
+    isFunction(object) {
+        return typeof object === "function";
+    }
+    typeStr(obj) {
+        return this.isArray(obj) ? "array" : typeof obj;
+    }
+    hasProperty(obj, propName) {
+        return obj != null && typeof obj === "object" && propName in obj;
+    }
+
+    createEl(tag, attrs, children, events, doc) {
+        const _el = document.createElement(tag);
+
+        // 2026-09-17: every element knows which _lm instance rendered it —
+        // needed so a click on it can resolve its @click handler against
+        // the RIGHT instance's own .fns (see lstnrs.js's evalEvAttr), and
+        // (below) so an @init handler on a subview mount resolves against
+        // ITS creator's own functions/scope, not window. Stamped before
+        // anything below that might need it. Non-enumerable: real bug
+        // found and fixed — an ordinary DOM element has no own enumerable
+        // properties by default, so JSON.stringify(someElement) safely
+        // produced "{}" everywhere this codebase already did that (e.g. a
+        // real test asserting on JSON.stringify(view._slots), real DOM
+        // nodes). An ENUMERABLE back-reference here closes a genuine
+        // cycle (element -> _ownerRe -> that instance's own _RealDOM ->
+        // the same element) and breaks every one of those call sites. Defined this way
+        // instead of a plain `=` assignment so it's reachable
+        // (`el._ownerRe`) but invisible to JSON.stringify/for-in/
+        // Object.keys, matching how a parent-pointer is normally done.
+        Object.defineProperty(_el, '_ownerRe', { value: this, enumerable: false, configurable: true, writable: true });
+
+        _el.isSub = false;
+        if (attrs.hasOwnProperty('view')) {
+            _el.isSub = true;
+            _el.subPath = attrs['view'];
+            // 2026-09-17: per-instance subview scoping. `views[]` used to
+            // hold just the raw element — every instance of the same
+            // subview file shared one flat _vt.View.vars, so two mounts of
+            // the same .view file collided on the same variable slots (a
+            // real, confirmed bug — clicking one instance changed a value
+            // neither instance's DOM reflected). DOM elements already
+            // carry arbitrary extra JS properties throughout this file
+            // (.isSub, .subPath, .events) — .vars/.views here follow that
+            // same convention rather than a new parallel structure. .vars
+            // is this instance's own scope, addressed at
+            // _vt.View.views[i].vars once renderHST() wires up the path
+            // (see renderView()); .views lets this instance itself host
+            // further nested subviews the same way.
+            _el.vars = {};
+            _el.views = [];
+            _el.fns = {};
+            // 2026-09-17: `@init="fn"` — the actual, decided mechanism
+            // for giving a subview mount its own data at creation time
+            // (replaces an earlier, narrower `:data="name"` attempt —
+            // reusing the existing @before-render/@after-render hook
+            // machinery instead of a bespoke attribute, per real
+            // discussion of real use cases: a subview file mounted
+            // multiple times needing distinct config per instance — the
+            // same widget showing a different crypto coin per mount, or
+            // a :for item needing its own data slice). `fn`'s return
+            // value (a plain object) is merged into this instance's own
+            // `.vars`, so it can hand over multiple named values at once
+            // — not tied to matching a parent variable's name the way
+            // `:data` was. Reads an ancestor's own variable by name
+            // still needs no special syntax at all (getVal()/evalExp()'s
+            // existing fallthrough already covers that); @init is for
+            // data that's computed/selected specifically for this one
+            // mount. fireRenderHook() needed a real fix first (used to
+            // discard its handler's return value entirely) — see its own
+            // comment. Deliberately one-way — a subview writing back to
+            // a PARENT variable (a steps-form wizard sharing accumulated
+            // state across steps, for instance) is a real, different,
+            // not-yet-designed mechanism, not what this covers.
+            //
+            // Calls evalEvAttr() directly rather than fireRenderHook()
+            // (which every other @before-render/@after-render call site
+            // uses): createEl() itself isn't async, and this result has
+            // to be ready synchronously, before the subview actually
+            // renders (a later, separate, real async call). An @init
+            // handler that returns a Promise can't be awaited here —
+            // deliberately unsupported for now, not silently broken:
+            // only a plain object return is used.
+            if (doc && doc.evs && doc.evs.hasOwnProperty('@init')) {
+                let _initAttr = doc.evs['@init'];
+                if (_initAttr) {
+                    // 3rd arg: the CALLING scope's own loop-local bindings
+                    // (e.g. `item` from `:for="items as item"`) — these
+                    // aren't real JS variables an @init handler could
+                    // otherwise close over (it's an ordinary top-level
+                    // function, not defined inside the loop), so without
+                    // this there'd be no way for it to know which
+                    // iteration it's being called for at all.
+                    let _initResult = evalEvAttr(_initAttr, { cType: 'init' }, $(_el), 'init', this.vrs);
+                    if (_initResult && typeof _initResult === 'object' && typeof _initResult.then !== 'function') {
+                        Object.assign(_el.vars, _initResult);
+                    }
+                }
+            }
+            this.view.views.push(_el);
+        }
+
+        _el.events = {};
+        for (const prop in attrs) {
+            if (prop == "view" || prop == ":data" || prop == ":if" || prop == ":else-if" || prop == ":else" || prop == ":for" || prop == ":for-limit" || prop == ":for-offset" || prop == ":for-if") continue;
+            try {
+                // cl("DD", doc);
+                let val = (doc && doc.ax.hasOwnProperty(prop)) ? "" : attrs[prop];
+                if (prop == "value") {
+                    _el.value = val;
+                } else _el.setAttribute(prop, val);
+            } catch (e) {
+                cl(e);
+            }
+        }
+        for (const prop in events) {
+            try {
+                _el.events[prop] = events[prop];
+            } catch (e) {
+                cl(e);
+            }
+        }
+        if (children.length) _el.append(...children);
+
+        // 2026-09-16: @after-render generalized to fire on MOUNT for every
+        // element, not just :for items / :if sections. Those two already
+        // get their own batch-level hook fired elsewhere (updateLXRs() /
+        // showSectionCX() / hideSectionCX()) — with :items/:visible extra
+        // data a per-element mount fire here can't provide, and firing
+        // both would double-fire for them — so they're explicitly
+        // excluded here via the same directive-attribute check createEl()
+        // already does above. No @before-render equivalent for a generic
+        // mount: there's no prior DOM state to act on before an element
+        // exists for the first time (unlike :for/:if's before-render,
+        // which runs against DOM that's already connected).
+        if (events && events['@after-render'] && !(attrs && (attrs.hasOwnProperty(':for') || attrs.hasOwnProperty(':if') || attrs.hasOwnProperty(':else-if') || attrs.hasOwnProperty(':else')))) {
+            fireRenderHook({ doc: doc }, 'after-render', _el, {});
+        }
+
+        // 2026-09-16: V1's real automatic plugin-init pass, ported
+        // faithfully from bea.js's own renderPlugins()/dtp() (real source:
+        // SBEACDN/s.beacdn.com/beajs/core.js, not reverse-engineered from
+        // minified code) — [sl]/[color]/[time]/[date]/[datetime] elements
+        // become their respective widgets on mount, no explicit script
+        // call needed, matching V1's documented behavior (lumenjs-
+        // spec.md §5.6/§6.7). Built into core directly rather than living
+        // only in the --with-plugins bundle (explicit choice, 2026-09-16)
+        // — autoInitPlugins() itself guards every call on the matching
+        // $.fn.* method actually existing, so a plain (no --with-plugins)
+        // project's dom-shim-based bundle silently no-ops instead of
+        // throwing when it encounters one of these attributes.
+        autoInitPlugins(_el, attrs);
+
+        return _el;
+    }
+
+    // processAttr(n, v, res) {
+    //     if (n == 'scoped') {
+
+    //     } else if (n == 'binds') {
+    //         res.domNode.mxs = v.split(",").map((s) => s.trim());
+    //     } else {
+    //         if (n.substr(0, 1) == "@") {
+    //             res.domNode.setAttribute(n.substr(0,1), v);
+    //         } else res.domNode.setAttribute(n, v);
+    //     }
+    // }
+
+    // getPVsScope(par) {
+    //     let _vz = {};
+
+    //     if (par) {
+    //         cl("VZZZZ", par.view.vars);
+    //         _vz = this.getPVsScope(par.view._pv);
+    //     }
+
+    //     return _vz;
+    // }
+
+    // getScope() {
+    //     let vz = clone(_vt.View.vars) ?? {};
+    //     let _vz = this.getPVsScope(this.view._pv);
+    //     cl("VXXXX", vz, _vz);
+
+    //     return vz;
+    // }
+
+    evalExp(expr, vars) {
+        // let svs = this.getScope();
+        // cl("SVS", svs);
+        // cl("SVS", expr, vars);
+        let rvars = {};
+        try {
+            for (let i = 0; i < vars.length; i++) {
+                // 2026-09-14: same Global-vars fallback as getVal() above —
+                // without it this object always carries an explicit
+                // `name: undefined` for anything index.js declares (since
+                // it's never in _vt.View.vars), and because it's spread
+                // LAST in concatVarsAtLevel()'s merge (highest priority),
+                // that explicit undefined would silently clobber the real
+                // value scopedEval() would otherwise have found in
+                // _vt.Global.vars — breaking :if/:for conditions on any
+                // index.js-declared var, not just mustache text (getVal()).
+                let __name = vars[i];
+                rvars[__name] = _vt.View.vars.hasOwnProperty(__name)
+                    ? _vt.View.vars[__name]
+                    : _vt.Global.vars[__name];
+            }
+            // 2026-09-17, real bug found and fixed: getVal() (mustache
+            // text, e.g. {{f.name}}) has always merged this.vrs in after
+            // the View/Global loop above — the local :for-loop-scoped
+            // binding (f, k, v, index — set via tx._re.vrs = vx, see the
+            // :for update path above) correctly shadows/supplies names a
+            // view's own script never declares. evalExp() (used for
+            // :if="f.done"/:else-if conditions) never had the same merge
+            // — any :if/:else-if condition referencing a :for loop
+            // variable's property could never evaluate correctly, in any
+            // LumenJS V2 project, not just this page. It "looked" correct
+            // on first render only by coincidence: :else isn't gated by
+            // evalExp at all, so an all-false-by-default loop (every item
+            // starting unchecked) rendered the same whether the condition
+            // genuinely evaluated false or silently threw and was caught
+            // below. Found clicking a real @click-toggled :for item on
+            // lumenjs.com's own real V2 homepage.
+            for (const ky in this.vrs) {
+                if (Object.prototype.hasOwnProperty.call(this.vrs, ky)) {
+                    rvars[ky] = this.vrs[ky];
+                }
+            }
+            // 2026-09-17: same per-instance subview merge as getVal()
+            // above — a subview's own vars live on this.view.vars, not
+            // the flat _vt.View.vars checked above (always the main
+            // view). See getVal()'s matching comment for the full
+            // rationale.
+            if (this.view && this.view.vars) {
+                for (const ky in this.view.vars) {
+                    if (Object.prototype.hasOwnProperty.call(this.view.vars, ky)) {
+                        rvars[ky] = this.view.vars[ky];
+                    }
+                }
+            }
+        } catch (e) {
+            cl(e);
+        }
+        //If Lookaup
+        // let value = this.lookup(expr, vars);
+        // if (value || value == 0) return false;
+        try {
+            var value = this.scopedEval(rvars, expr);
+            // cl("VV", value);
+            if (value && value != 0) return true;
+        } catch (e) {
+            reportLumenError({ stage: 'condition', expr: expr, error: e });
+            return false;
+        }
+        return false;
+    }
+
+    splitTextWithMustaches(text, mustaches) {
+        // Sort mustaches by start index to process in order
+        mustaches.sort((a, b) => a.start - b.start);
+
+        const elements = [];
+        let currentIndex = 0;
+
+        for (const mustache of mustaches) {
+            // Add static text before mustache if any
+            if (currentIndex < mustache.start) {
+                elements.push({
+                    type: 'static',
+                    content: text.substring(currentIndex, mustache.start)
+                });
+            }
+
+            // Add the mustache
+            elements.push({
+                type: 'mustache',
+                jst: mustache.jst,
+                rvs: mustache.rvs,
+                content: text.substring(mustache.start, mustache.end)
+            });
+
+            // Update current index
+            currentIndex = mustache.end;
+        }
+
+        // Add any remaining static text after the last mustache
+        if (currentIndex < text.length) {
+            elements.push({
+                type: 'static',
+                content: text.substring(currentIndex)
+            });
+        }
+
+        return elements;
+    }
+
+
+    walk(doc, parent) {
+        var par = this;
+        var tx, el;
+        switch (doc.type) {
+            case 'text':
+
+                if (doc.mss.length) {
+
+                    let splitIt = true;
+
+                    if (doc.tag == "textarea") {
+                        splitIt = false;
+                    }
+
+                    if (splitIt) {
+                        let splits = this.splitTextWithMustaches(doc.content, doc.mss);
+                        // cl(splits);
+                        for (let si = 0; si < splits.length; si++) {
+                            const split = splits[si];
+                            if (split.type == 'static') {
+                                let txnd = document.createTextNode(split.content);
+                                if (!parent) par._RealDOM.push(txnd);
+                                (tx ?? (tx = [])).push(txnd);
+                            } else {
+                                let txnd = document.createTextNode("");
+                                for (let ri = 0; ri < split.rvs.length; ri++) {
+                                    const element = split.rvs[ri];
+                                    (this._effects[element] ?? (this._effects[element] = [])).push({
+                                        "type": "text",
+                                        "content": split.content,
+                                        "jst": split.jst,
+                                        "rvs": split.rvs,
+                                        "isSplit": true,
+                                        "nd": txnd,
+                                        "tag": doc.tag
+                                    });
+                                }
+                                if (!parent) par._RealDOM.push(txnd);
+                                (tx ?? (tx = [])).push(txnd);
+                            }
+                        }
+                        return tx;
+                    } else {
+                        tx = document.createTextNode("");
+                        for (let mui = 0; mui < doc.mss.length; mui++) {
+                            const mus = doc.mss[mui];
+
+                            for (let ri = 0; ri < mus.rvs.length; ri++) {
+                                const element = mus.rvs[ri];
+                                (this._effects[element] ?? (this._effects[element] = [])).push({
+                                    "type": "text",
+                                    "content": doc.content,
+                                    "splits": this.splitTextWithMustaches(doc.content, doc.mss),
+                                    "jst": mus.jst,
+                                    "rvs": mus.rvs,
+                                    "isSplit": false,
+                                    "nd": tx,
+                                    "tag": doc.tag
+                                });
+                            }
+                        }
+
+                        if (!parent) par._RealDOM.push(tx);
+                        return tx;
+                    }
+
+
+                } else {
+                    tx = document.createTextNode(doc.content);
+                    if (!parent) par._RealDOM.push(tx);
+                    return tx;
+                }
+                break;
+            case 'sections':
+            case 'section':
+                var _dd = md5(new Date().getTime() / 1000 + "::" + Math.random());
+                tx = document.createTextNode("");
+                var typeN = null;
+                if (doc.attrs.hasOwnProperty(":else")) typeN = "else";
+                else if (doc.attrs.hasOwnProperty(":else-if")) typeN = "else-if";
+                else if (doc.attrs.hasOwnProperty(":if")) typeN = "if";
+                else typeN = 'for';
+
+                if (doc.type == "section") {
+
+                    var chain = [];
+                    if (typeN == "else-if" || typeN == "else") {
+                        try {
+                            let lastInChain = this._CXR.at(-1);
+                            if (lastInChain) {
+                                _dd = lastInChain.key;
+                                chain.push(...lastInChain.chain, lastInChain);
+                            }
+                        } catch (e) {
+
+                        }
+                    }
+
+                    el = par.createEl(doc.name, doc.attrs, [], doc.evs, doc);
+                    tx.node = el;
+
+                    // cl("SECCCCC", doc);
+                    // return;
+                    this._CXR.push({
+                        "type": "section",
+                        "name": typeN,
+                        "content": doc.cond,
+                        "doc": doc,
+                        "key": _dd,
+                        "chain": chain,
+                        "ref": tx
+                    });
+
+                    this.setEffects(doc, el);
+
+                } else if (doc.type == "sections") {
+
+                    tx.key = _dd;
+                    tx.node = null;
+                    tx.nodes = {};
+
+                    let docRaw = doc;
+                    // delete docRaw.attrs[':for'];
+                    // delete docRaw.attrs[':for-limit'];
+                    // delete docRaw.attrs[':for-if'];
+                    // delete docRaw.attrs[':for-offset'];
+                    // docRaw.type = 'tag';
+
+                    // cl("SECCCCCSSS", doc);
+                    // return;
+
+                    this._LXR.push({
+                        "type": "sections",
+                        "name": typeN,
+                        "cond": doc.attrs.hasOwnProperty(":for-if") ? doc.attrs[':for-if'] : null,
+                        "limit": doc.attrs.hasOwnProperty(":for-limit") ? doc.attrs[':for-limit'] : 0,
+                        "offset": doc.attrs.hasOwnProperty(":for-offset") ? doc.attrs[':for-offset'] : 0,
+                        "content": doc.content,
+                        "forX": doc.forX,
+                        "doc": docRaw,
+                        "key": _dd,
+                        "atr": [],
+                        "ref": tx
+                    });
+
+                    // cl(tx, doc);
+                }
+
+
+                if (!parent) par._RealDOM.push(tx);
+                return tx;
+                break;
+            case 'tag':
+                var _dd = md5(new Date().getTime() / 1000 + "::" + Math.random());
+
+                // cl("DOC", doc);
+
+                if (doc.name.toLowerCase() == "settings") {
+                    if (par.view.type == "main") {
+                        var defaultSettings = {
+                            layout: "default",
+                            requireAuth: false,
+                        };
+                        try {
+                            let settingsC = doc.children[0].content;
+                            let settings = {};
+                            eval("settings = " + settingsC + ";");
+                            if (settings) {
+                                if (settings.layout == null) settings.layout = "default";
+                                if (settings.requireAuth == null) settings.requireAuth = false;
+                                par.view.settings = settings;
+                            } else {
+                                par.view.settings = defaultSettings;
+                            }
+
+                        } catch (e) {
+                            setError(e, "Error in your settings tag inside the '" + par.view.name.toLowerCase() + "' main view!");
+                            par.view.settings = defaultSettings;
+                        }
+                    }
+                } else if (doc.name.toLowerCase() == "script" || doc.name.toLowerCase() == "js") {
+                    let child = doc.children[0];
+                    let js = child.content;
+                    let jst = child.jst;
+                    let isScoped = false;
+                    if (doc.attrs.hasOwnProperty('scoped')) {
+                        delete doc.attrs['scoped'];
+                        isScoped = true;
+                    }
+                    el = par.createEl("script", doc.attrs, [], doc.evs, doc);
+                    el._sc = isScoped;
+                    el._dd = _dd;
+                    // el._js = js;
+                    el._jst = jst;
+                    // cl(child);
+                    // _jswacrk.trigger('msg', {
+                    //     "code": js,
+                    //     "type": par.view.type,
+                    //     "key": _dd
+                    // });
+                    // _jsuid[_dd] = el;
+                    (par._jj[_dd] ?? (par._jj[_dd] = [])).push({
+                        "nd": el,
+                    });
+
+                } else if (doc.name.toLowerCase() == "style") {
+                    let css = doc.children[0].content;
+                    let isScoped = false;
+
+                    el = par.createEl("style", {}, [], doc.evs, doc);
+
+                    if (doc.attrs.hasOwnProperty('scoped')) {
+                        if (!parent) {
+                            if (par.view._dd) _dd = par.view._dd;
+                            else {
+                                par.view._dd = _dd;
+                                if (par.view.type == "main") $('[body]')[0].setAttribute('vuid', _dd);
+                            }
+                        } else {
+                            if (parent._dd) _dd = parent._dd;
+                            else {
+                                parent._dd = _dd;
+                                parent.setAttribute('vuid', _dd);
+                            }
+                        }
+                        delete doc.attrs['scoped'];
+                        isScoped = true;
+                        el._sc = isScoped;
+                        el._dd = _dd;
+                        el._css = css;
+                        (par._cc[_dd] ?? (par._cc[_dd] = [])).push({
+                            "nd": el,
+                            "_css": css
+                        });
+                    } else {
+                        el._sc = isScoped;
+                        el._dd = _dd;
+                        el.textContent = css;
+                    }
+
+
+                    for (const prop in doc.attrs) {
+                        try {
+                            _el.setAttribute(prop, doc.attrs[prop]);
+                        } catch (e) {
+                            cl(e);
+                        }
+                    }
+                } else if (doc.name.toLowerCase() == "icon") {
+                    let child = par.createEl("span", {
+                        "class": "iconify",
+                        "data-icon": doc?.icon ?? "mdi:home"
+                    }, [], {}, null);
+
+                    el = par.createEl("span", doc.attrs, [child], doc.evs, doc);
+
+                } else if (doc.name.toLowerCase() == "slot") {
+                    // Layout slot content (2026-09-15) — a view wraps
+                    // content meant for a named layout region (anything
+                    // other than the default `[body]` target) in
+                    // <slot name="...">...</slot>. Collected onto
+                    // par.view._slots[name] (an array of real, walked DOM
+                    // nodes) instead of being pushed into _RealDOM —
+                    // renderView() injects each populated slot into its
+                    // matching `[slot="name"]` layout element, after the
+                    // default content. Same non-participating-in-_RealDOM
+                    // shape as the `settings` branch above (no `el` gets
+                    // set here either) — but slot content needs to be
+                    // walked/rendered, unlike settings' raw config text, so
+                    // this uses a throwaway wrapper purely as a real DOM
+                    // parent for that walk; it's never attached anywhere.
+                    let slotName = doc.attrs && doc.attrs.name;
+                    if (slotName) {
+                        let tempWrapper = document.createElement('div');
+                        let childs = [];
+                        for (let i = 0; i < doc.children.length; i++) {
+                            const dc = doc.children[i];
+                            let chils = par.walk(dc, tempWrapper);
+                            if (chils) {
+                                if (Array.isArray(chils)) {
+                                    if (chils.length) childs = [...childs, ...chils];
+                                } else {
+                                    childs.push(chils);
+                                }
+                            }
+                        }
+                        (par.view._slots ?? (par.view._slots = {}))[slotName] = childs;
+                    }
+                } else if (doc.attrs && doc.attrs.hasOwnProperty('tpl') && !doc.attrs.hasOwnProperty(':for')) {
+                    // 2026-09-17: `tpl="name"` used WITHOUT `:for=` on the
+                    // same element — the real, documented (lumenjs-
+                    // spec.md §4.3) shape always pairs the two, and only
+                    // makes sense paired: a template renders inside
+                    // whatever repeated context it's used from (see
+                    // renderSection()'s own tpl handling, for the
+                    // WITH-:for case — an element carrying both never
+                    // reaches this branch at all, since :for makes it a
+                    // 'sections'-type node the switch above already
+                    // dispatched elsewhere). Reported as a real error
+                    // rather than silently rendering nothing.
+                    reportLumenError({
+                        stage: 'tpl',
+                        error: new Error('tpl="' + doc.attrs['tpl'] + '" must be used together with :for on the same element — templates only render inside a repeated/list context.'),
+                    });
+                } else {
+                    el = par.createEl(doc.name, doc.attrs, [], doc.evs, doc);
+
+                    if (!doc.isV && !el.isSub) {
+                        let childs = [];
+                        for (let i = 0; i < doc.children.length; i++) {
+                            const dc = doc.children[i];
+                            let chils = par.walk(dc, el);
+                            if (chils) {
+                                if (Array.isArray(chils)) {
+                                    if (chils.length) childs = [...childs, ...chils];
+                                } else {
+                                    childs.push(chils);
+                                }
+                            }
+                        }
+                        childs.length ? el.append(...childs) : null;
+                    }
+                }
+
+                this.setEffects(doc, el);
+
+                if (el) {
+                    if (!parent) par._RealDOM.push(el);
+                }
+                return el;
+
+                break;
+            case 'comment':
+
+                break;
+            default:
+                break;
+        }
+    }
+
+    setEffects(doc, el) {
+        let rvs = [];
+        if (Object.keys(doc.ax).length) {
+            for (const attrName in doc.ax) {
+                if (Object.hasOwnProperty.call(doc.ax, attrName)) {
+                    const attrMustaches = doc.ax[attrName];
+                    for (let i = 0; i < attrMustaches.length; i++) {
+                        const mus = attrMustaches[i];
+                        for (let ri = 0; ri < mus.rvs.length; ri++) {
+                            const element = mus.rvs[ri];
+                            rvs.push(element);
+                            (this._effects[element] ?? (this._effects[element] = [])).push({
+                                "type": "attr",
+                                "name": attrName,
+                                "content": doc.attrs[attrName],
+                                "splits": this.splitTextWithMustaches(doc.attrs[attrName], doc.ax[attrName]),
+                                "jst": mus.jst,
+                                "rvs": mus.rvs,
+                                "nd": el
+                            });
+                        }
+                    }
+                }
+            }
+        }
+
+        if (Object.keys(doc.ex).length) {
+            for (const ky in doc.ex) {
+                if (Object.hasOwnProperty.call(doc.ex, ky)) {
+                    const mss = doc.ex[ky];
+                    for (let i = 0; i < mss.length; i++) {
+                        const mus = mss[i];
+                        for (let ri = 0; ri < mus.rvs.length; ri++) {
+                            const element = mus.rvs[ri];
+                            rvs.push(element);
+                            (this._effects[element] ?? (this._effects[element] = [])).push({
+                                "type": "event",
+                                "name": ky,
+                                "content": doc.evs[ky],
+                                "splits": this.splitTextWithMustaches(doc.evs[ky], doc.ex[ky]),
+                                "jst": mus.jst,
+                                "rvs": mus.rvs,
+                                "nd": el
+                            });
+                        }
+                    }
+                }
+            }
+        }
+
+        return rvs.filter((value, index, self) => {
+            return self.indexOf(value) === index;
+        });
+    }
+
+    async createSection(cx, vx, isObj, forX) {
+        var keyed = cx.key + '_' + vx.index;
+        // cl("DD", cx, vx, keyed);
+        var tx = document.createTextNode("");
+        var typeN = null;
+        if (cx.doc.attrs.hasOwnProperty(":else")) typeN = "else";
+        else if (cx.doc.attrs.hasOwnProperty(":else-if")) typeN = "else-if";
+        else if (cx.doc.attrs.hasOwnProperty(":if")) typeN = "if";
+        else typeN = 'for';
+
+        // cl("CREATE", cx.doc.name, cx.doc.attrs, [], cx.doc.evs, cx.doc);
+
+        let el = this.createEl(cx.doc.name, cx.doc.attrs, [], cx.doc.evs, cx.doc);
+        tx.node = el;
+        tx.key = cx.key;
+        tx.keyed = keyed;
+        tx.isObj = isObj;
+        tx.forX = forX;
+        tx.vx = vx;
+
+        // cl("RENDERSECTION", tx, cx.doc, this, cx.key);
+
+        // this._CXR.push({
+        //     "type": "section",
+        //     "name": typeN,
+        //     "value": doc.cond,
+        //     "doc": doc,
+        //     "key": _dd,
+        //     "chain": chain,
+        //     "ref": tx
+        // });
+
+
+        let scsc = await renderSection(tx, cx.doc, this, cx.key);
+        // cl(23);
+        // cl(scsc);
+        scsc._re = scsc;
+
+
+
+        // let rvs = scsc._re.setEffects(cx.doc, el);
+        // // scsc._re.rvs = _vt.View.vars;
+        // // scsc._re.reactiveVariables = rvs;
+
+        // scsc._re.renderAll('sections');
+
+        cx.ref.nodes[keyed] = tx;
+
+
+        return tx;
+    }
+
+
+    attrString(attrs) {
+        var buff = [];
+        for (var key in attrs) {
+            // if(key != "@click") 
+            buff.push(key + '="' + attrs[key] + '"');
+        }
+        if (!buff.length) return '';
+        return ' ' + buff.join(' ');
+    }
+    _stringify(buff, doc) {
+        var par = this;
+        switch (doc.type) {
+            case 'text':
+                return buff + doc.content;
+            case 'tag':
+                buff += '<' + doc.name + (doc.attrs ? par.attrString(doc.attrs) : '') + (doc.isV ? '/>' : '>');
+                if (doc.isV) return buff;
+                for (let i = 0; i < doc.children.length; i++) {
+                    const dc = doc.children[i];
+                    buff = buff + (par._stringify('', dc));
+                }
+                return buff + '</' + doc.name + '>';
+            case 'comment':
+                // buff += '<!--' + doc.comment + '-->';
+                return buff;
+            default:
+                return '';
+        }
+    }
+    stringify(doc) {
+        var par = this;
+        return doc.reduce(function (token, rootEl) {
+            return token + par._stringify('', rootEl);
+        }, '');
+    };
+}
+
+
+// 2026-09-17: `scopePath` (new) — where in the _vt tree THIS render's own
+// compiled <script> should write/read its reactive vars. Defaults to
+// ["View"] (the main view, unchanged behavior for every existing caller).
+// A subview mount passes its own ["View","views",i] (or the nested form
+// for a subview hosting a subview) — see renderView()'s isSub branch.
+// `ownVars`/`ownFns`/`ownViews` (new): for a subview render, the SAME
+// objects the mount element's `.vars`/`.fns`/`.views` already point to
+// (not fresh `{}`/`[]`s) — so a write through the compiled script's
+// `_vt.View.views[i].vars[...]`/`.fns[...]` path (which resolves to that
+// element's `.vars`/`.fns`) and a read through this instance's own
+// `getVal()`/`evalExp()` (`this.view.vars`) or `evalEvAttr()`
+// (`this.view.fns`) see the exact same data. `ownViews` matters for
+// NESTED subviews specifically: createEl() pushes onto `this.view.views`
+// while THIS instance is rendering — without linking that to the mount
+// element's own `.views`, a subview hosting further subviews pushed them
+// into a freshly-constructed, orphaned array nothing else could ever
+// find (real bug found testing exactly this — nested subviews mounted
+// and rendered their own content correctly, but their OWN vars/state
+// were unreachable from outside, landing in a throwaway array).
+async function renderHST(hst, n, type = 'main', tx, _pv = null, scopePath = ["View"], ownVars, ownFns, ownViews) {
+
+    var reactiveVariables = hst.reactiveVars;
+    hst = hst.hst;
+
+    let _re = new _lm(new _v({
+        "name": n,
+        "type": type,
+        "hst": hst,
+        "vars": ownVars ?? tx?.vx,
+        "fns": ownFns,
+        "views": ownViews,
+        "rvs": reactiveVariables,
+        "_pv": _pv
+    }));
+    // 2026-09-17: persisted so THIS instance can later render ITS OWN
+    // subviews (updateVXRs() -> renderView()) at the right nested path —
+    // see both of those for the other half of this.
+    _re.view.scopePath = scopePath;
+
+    if (Object.keys(_re._cc).length) {
+
+        // let cssObjs = {};
+        // for (const ky in _re._cc) {
+        //     if (Object.hasOwnProperty.call(_re._cc, ky)) {
+        //         const csses = _re._cc[ky];
+        //         for (let inde = 0; inde < csses.length; inde++) {
+        //             const css = csses[inde];
+        //             let myKey = ky + "_::" + inde;
+        //             cssObjs[myKey] = css._css;
+        //         }
+        //     }
+        // }
+
+
+
+
+        for (const ky in _re._cc) {
+            if (Object.hasOwnProperty.call(_re._cc, ky)) {
+                const csses = _re._cc[ky];
+                for (let inde = 0; inde < csses.length; inde++) {
+                    let prom = new defer();
+                    const css = csses[inde];
+                    _csswrk.trigger('css-ready', {
+                        "csses": [css._css],
+                        "pre": "[vuid='" + ky + "']",
+                        "key": ky
+                    });
+                    _vuid[ky] = prom;
+                    let _csses = await prom;
+                    css.nd.textContent = _csses[0];
+
+                    // _jsuid[_dd] = el;
+                    // prom
+                }
+            }
+        }
+
+
+
+        // let prom = new defer();
+        // var _dd = md5(new Date().getTime() / 1000 + "::" + Math.random());
+        // _csswrk.trigger('css-ready', {
+        //     "csses": cssObjs,
+        //     "key": _dd,
+        //     "pre": _dd
+        // });
+        // _vuid[_dd] = prom;
+        // let _csses = await prom;
+
+        // cl(_csses);
+
+        // for (const ky in _re._cc) {
+        //     if (Object.hasOwnProperty.call(_re._cc, ky)) {
+        //         const csses = _re._cc[ky];
+        //         for (let inde = 0; inde < csses.length; inde++) {
+        //             const css = csses[inde];
+        //             let myKey = ky + "_::" + inde;
+        //             css.nd.textContent = _csses[myKey];
+        //         }
+        //     }
+        // }
+
+    }
+
+    if (Object.keys(_re._jj).length) {
+        for (const ky in _re._jj) {
+            if (Object.hasOwnProperty.call(_re._jj, ky)) {
+                const jses = _re._jj[ky];
+                for (let inde = 0; inde < jses.length; inde++) {
+                    const nd = jses[inde].nd;
+                    let code = getWatcher(nd._jst, _re.view, reactiveVariables, scopePath).code;
+                    code = `try { ` + code + ` } catch (e) { reportLumenError({ stage: 'script', error: e }); }`;
+                    // sourceURL: DevTools shows this <script>'s errors against
+                    // "<viewname>.view" instead of an anonymous VM context.
+                    // 2026-09-14, real bug found testing a real project
+                    // end-to-end: this used to be appended BEFORE the
+                    // try/catch wrap above, landing the comment — and
+                    // everything after it on the same line, including the
+                    // wrap's own closing brace and catch clause — inside
+                    // the try block. A `//` comment eats the rest of its
+                    // line, so that silently commented out the catch
+                    // entirely and left an unterminated `try`, throwing
+                    // "Unexpected end of input" the moment any real
+                    // <script> block actually ran (about.view's real
+                    // script on roxyon.com, in this case). Must come after
+                    // the wrap, on its own trailing line.
+                    code = code + `\n//# sourceURL=` + (_re.view?.name || 'view') + `.view.generated.js`;
+                    nd.textContent = code;
+                }
+            }
+        }
+    }
+
+    return _re;
+}
+
+// @before-render / @after-render (2026-09-14) — a developer-facing
+// lifecycle hook fired around a :for loop's diff-and-patch pass
+// (updateLXRs) or a :if/:else-if/:else section's show/hide transition
+// (updateCXRs' showSectionCX/hideSectionCX), letting a DOM-owning plugin
+// (a slider, for instance) safely tear down before its content is
+// replaced and re-initialize once it's settled — instead of silently
+// breaking the next time the underlying data or condition changes.
+// Reuses lstnrs.js's own evalEvAttr() — the same handler-resolution logic
+// every other @-attribute already goes through (@click, @sl-select, ...:
+// a plain function name calls window[name](ev, el, ...), anything else is
+// eval'd as an inline expression) — rather than inventing a second one;
+// the only new part is WHEN this gets called. Errors inside the handler
+// itself are already swallowed by evalEvAttr — matches the established,
+// silent-on-error precedent every other @-attribute handler already has;
+// not changed here to keep this hook's error behavior consistent with them.
+async function fireRenderHook(cx, n, containerEl, extra) {
+    if (!containerEl) return;
+    let attrKey = '@' + n;
+    // The parser lifts @-prefixed attributes into `doc.evs` (its events
+    // map) at compile time, same as @click/@sl-select/etc — NOT into
+    // `doc.attrs` alongside plain attributes like :for/:if. Verified
+    // against real parser output (fcs.js's getAllFiles), not assumed.
+    if (!cx.doc || !cx.doc.evs || !cx.doc.evs.hasOwnProperty(attrKey)) return;
+    let attrVal = cx.doc.evs[attrKey];
+    if (!attrVal) return;
+    let ev = Object.assign({ cType: n }, extra || {});
+    let result = evalEvAttr(attrVal, ev, $(containerEl), n);
+    if (result && typeof result.then === 'function') {
+        // 2026-09-17: this used to just await-and-discard. @init (new,
+        // subview mounts) needs the handler's actual return value — its
+        // whole purpose is "compute this instance's own initial data" —
+        // so a Promise result is now awaited AND returned, not thrown
+        // away. Every existing @before-render/@after-render caller
+        // already ignores this function's return value (none of them
+        // needed it), so this is additive, not a behavior change for them.
+        try { return await result; } catch (e) { return undefined; }
+    }
+    return result;
+}
+
+// 2026-09-16: V1's real automatic plugin-init pass — [sl] (Select2),
+// [color] (bootstrap-colorpicker), [time]/[date]/[datetime]
+// (bootstrap-datetimepicker via dtp()) — ported faithfully from bea.js's
+// own real, un-minified renderPlugins()/dtp() source
+// (SBEACDN/s.beacdn.com/beajs/core.js:2846/3834, confirmed against the
+// real V1 build root this session already located, not reverse-engineered
+// from minified code). Called from createEl() on every element's mount.
+// Deliberately built into packages/core's own engine rather than kept
+// inside the --with-plugins bundle only — every call below is guarded on
+// the matching $.fn.* method actually existing, so a plain project (no
+// --with-plugins, dom-shim-based, none of these libraries loaded) safely
+// no-ops instead of throwing when a view happens to use one of these
+// attributes.
+function autoInitPlugins(el, attrs) {
+    if (!attrs) return;
+    try {
+        if (attrs.hasOwnProperty('sl') && typeof $.fn.select2 === 'function') {
+            initSl($(el));
+        }
+        if (attrs.hasOwnProperty('color') && typeof $.fn.colorpicker === 'function') {
+            $(el).removeAttr('color').colorpicker({ format: 'rgba' });
+        }
+        if (typeof $.fn.datetimepicker === 'function') {
+            if (attrs.hasOwnProperty('time')) dtp($(el), 'time');
+            if (attrs.hasOwnProperty('date')) dtp($(el), 'date');
+            if (attrs.hasOwnProperty('datetime')) dtp($(el), 'datetime');
+        }
+    } catch (e) { cl(e); }
+}
+
+// Real V1 source, ported as-is (SBEACDN core.js:3404-3518) — the `sl-*`
+// attribute family is documented in lumenjs-spec.md §6.7. `:not(.select2-
+// hidden-accessible)`-equivalent guard kept even though this only ever
+// runs once per element (on mount, never re-checked) — matches V1's own
+// idempotency guard exactly, cheap insurance if this is ever called from
+// anywhere else in the future.
+function initSl(t) {
+    if (t.hasClass('select2-hidden-accessible')) return;
+    try {
+        var plchldr = t.attr("placeholder") ? t.attr("placeholder") : "";
+        var dir = $("body").hasClass("rtl") ? "rtl" : "ltr";
+        var nr = t.attr("sl-nrmsg") ? t.attr("sl-nrmsg") : "No results found";
+        var minResultsForSearch = t.attr("sl-mins") ? t.attr("sl-mins") : 10;
+        var allowNewTags = t.attr("sl-ntgs") ? true : false;
+        var dropdownParent = t.attr("sl-prt") ? t.attr("sl-prt") : "body";
+        if (dropdownParent == "self") dropdownParent = t.parent();
+        else dropdownParent = $(dropdownParent);
+
+        var query = t.attr("sl-query") ? t.attr("sl-query") : null;
+        var uniquer = Date.now();
+
+        if (typeof window[query] === "function") {
+            t.select2.amd.define(
+                "adapt_" + uniquer,
+                ["select2/data/array", "select2/utils"],
+                function (ArrayAdapter, Utils) {
+                    function CustomDataAdapter($element, options) {
+                        CustomDataAdapter.__super__.constructor.call(this, $element, options);
+                    }
+                    Utils.Extend(CustomDataAdapter, ArrayAdapter);
+                    CustomDataAdapter.prototype.query = function (params, callback) {
+                        clearTimeout(_dbcrs[uniquer]);
+                        let _t = t;
+                        _dbcrs[uniquer] = setTimeout(function () {
+                            window[query](params, callback, _t);
+                        }, !_dbcrs.hasOwnProperty(uniquer) ? 0 : _dbcrsTime);
+                    };
+                    return CustomDataAdapter;
+                }
+            );
+
+            t.select2({
+                dropdownParent: dropdownParent,
+                minimumResultsForSearch: minResultsForSearch,
+                placeholder: plchldr,
+                dir: dir,
+                tags: allowNewTags,
+                allowClear: true,
+                language: { noResults: function () { return nr; } },
+                ...(t.select2.amd.require("adapt_" + uniquer)
+                    ? { ajax: {}, dataAdapter: t.select2.amd.require("adapt_" + uniquer) }
+                    : {}),
+            });
+        } else {
+            t.select2({
+                dropdownParent: dropdownParent,
+                minimumResultsForSearch: minResultsForSearch,
+                placeholder: plchldr,
+                dir: dir,
+                tags: allowNewTags,
+                allowClear: true,
+                language: { noResults: function () { return nr; } },
+            });
+        }
+
+        if (t.attr("sl-nosrch"))
+            t.on("select2:opening select2:closing", function (event) {
+                $(this).parent().find(".select2-search__field").prop("disabled", true);
+            });
+        if (t.attr("sl-class")) {
+            t.on("select2:opening", function (event) { dropdownParent.addClass(t.attr("sl-class")); });
+            t.on("select2:closing", function (event) { dropdownParent.removeClass(t.attr("sl-class")); });
+        }
+
+        if (t.attr("sl-id") || t.attr("sl-text")) {
+            let text = t.attr("sl-text");
+            let id = t.attr("sl-id");
+            if (!text) text = id;
+            if (!id) id = text;
+            let newOption = new Option(text, id, true, true);
+            t.append(newOption).trigger('select');
+        } else {
+            t.select2("val", "");
+        }
+
+        if (t.attr("sl-value")) t.val(t.attr("sl-value")).trigger('change');
+    } catch (e) { cl(e); }
+}
+var _dbcrs = {};
+var _dbcrsTime = 250;
+
+// Real V1 source, ported as-is (SBEACDN core.js:3834-3891) — bootstrap-
+// datetimepicker option builder + optional start/end date-linking. Not
+// documented in lumenjs-spec.md (see PROVENANCE.md's --with-plugins
+// section); this exact option shape was confirmed directly against V1's
+// real source once it was located this session, not reverse-engineered.
+function dtp(el, t) {
+    el.removeAttr(t);
+    let opts = {
+        format: t == "date" ? "yyyy-mm-dd" : t == "time" ? "hh:ii" : "yyyy-mm-dd hh:ii",
+        weekStart: el.attr("date-week-start") ?? 1,
+        startView: t == "time" ? 1 : (el.attr("startview") ? el.attr("startview") : 2),
+        minView: el.attr("minview") ? el.attr("minview") : t == "time" ? 0 : t == "datetime" ? 0 : 2,
+        maxView: el.attr("maxview") ? el.attr("maxview") : t == "time" ? 1 : 4,
+        todayBtn: t == "time" ? 0 : el.attr("date-today") == "false" ? 0 : 1,
+        todayHighlight: t == "time" ? 0 : el.attr("date-today") == "false" ? 0 : 1,
+        language: el.attr("date-lang") ?? "en",
+        minuteStep: el.attr("date-minute-step") ?? 5,
+        pickerPosition: el.attr("date-position") ?? "top-right",
+        autoclose: 1,
+        showMeridian: false,
+    };
+    if (el.attr("date-start")) opts["startDate"] = el.attr("date-start");
+    if (el.attr("date-end")) opts["endDate"] = el.attr("date-end");
+    if (el.attr("date-value")) opts["date"] = el.attr("date-value");
+
+    el.datetimepicker(opts);
+
+    if (t == "time") {
+        el.on("show", function (ev) {
+            $(".table-condensed > thead, .table-condensed > thead > tr > th, .table-condensed > thead > tr > th > i")
+                .attr("style", "visibility: hidden; font-size:0px !important; overflow: hidden; height: 0px;");
+        }).on("hide", function (ev) {
+            $(".table-condensed > thead, .table-condensed > thead > tr > th, .table-condensed > thead > tr > th > i")
+                .attr("style", "visibility: visible;");
+        });
+    }
+    if (el.attr("date-link-start")) {
+        el.on("change", function (e) {
+            let dp1 = el.data("datetimepicker");
+            let dp2 = $(el.attr("date-link-start")).data("datetimepicker");
+            dp2.setStartDate(dp1.getFormattedDate());
+            if (dp2.getFormattedDate() < dp1.getFormattedDate() || dp2.getFormattedDate() == "")
+                $(el.attr("date-link-start")).val(dp1.getFormattedDate());
+        });
+    } else if (el.attr("date-link-end")) {
+        el.on("change", function (e) {
+            let dp1 = $(el.attr("date-link-end")).data("datetimepicker");
+            let dp2 = el.data("datetimepicker");
+            dp1.setEndDate(dp2.getFormattedDate());
+        });
+        opts["useCurrent"] = false;
+    }
+}
+
+async function renderSection(tx, doc, par, k, sectionsData) {
+    if (tx.node.isConnected) {
+        if (k) {
+            tx._re.update(k);
+        }
+        return tx._re;
+    }
+
+
+    var hst = doc.children;
+
+    // 2026-09-17: `tpl="name"` on a :for element (`<li :for="items as
+    // item" tpl="row"></li>`, the real, documented — lumenjs-spec.md
+    // §4.3 — shape; never built in V2 until now). A :for element's own
+    // `doc.children` is empty (there's nothing between its tags in the
+    // source), which is exactly what's rendered per item above — so
+    // this substitutes the template file's own HST as this section's
+    // children instead, walked by the SAME engine instance rendering
+    // everything else here (this section already has its own vx/vrs —
+    // no separate scope, no isolated instance, just this item's content).
+    if (doc.attrs && doc.attrs.hasOwnProperty('tpl')) {
+        let _payload = (typeof _vcD !== 'undefined' && _vcD) || (typeof _vcData !== 'undefined' ? _vcData : undefined);
+        let _tplName = doc.attrs['tpl'];
+        let _tplKey = btoa("src/tpls/" + _tplName + ".tpl");
+        let _tplEntry = _payload && _payload.tpls && _payload.tpls[_tplKey];
+        if (_tplEntry) {
+            hst = _tplEntry.hst;
+        } else {
+            reportLumenError({
+                stage: 'tpl',
+                error: new Error('tpl="' + _tplName + '" — no such file at src/tpls/' + _tplName + '.tpl'),
+            });
+        }
+    }
+
+    // 2026-09-17: real bug found and fixed — a subview mounted INSIDE a
+    // :for item (e.g. <div :for="items as item"><div view="widgets/
+    // card"></div></div>) never worked at all: renderHST() used to always
+    // build a fresh, empty `.views` array for whatever it constructs
+    // (see _v's constructor), so createEl() calls made while rendering
+    // THIS item's own content pushed the subview's mount element onto a
+    // throwaway array nothing else could ever find — renderView()'s
+    // isSub search only ever looks at the ENCLOSING view's real `.views`
+    // (or a nested subview's own, itself wired the same way). Passing
+    // par's own `.view.views`/`.scopePath` through here makes every
+    // loop item share the SAME real registry as its enclosing view, so
+    // subview mounts inside a loop accumulate into one addressable array
+    // (sequential index, in render order) exactly like a static mount —
+    // same mechanism either way, just a dynamically-arriving index.
+    let _re = await renderHST({ hst, mxes: [] }, tx.key, 'section', tx, par, par?.view?.scopePath || ["View"], undefined, undefined, par?.view?.views);
+    // if(par) {
+    //     _re.reactiveVariables = par.reactiveVariables;
+    // }
+    tx._re = _re;
+
+    // if (doc.type == "sections") {
+
+    //     return _re;
+    // }
+    // cl(tx.key);
+    // cl(par);
+    // cl(hst);
+    // cl(tx);
+    // cl(doc);
+    // cl(_re);
+
+    // cl("section", _re, par);
+
+    if (tx.node) {
+        tx.replaceWith(tx.node);
+        tx.node.innerHTML = "";
+        tx.node.append(..._re._RealDOM);
+
+        _re.setEffects(doc, tx.node);
+
+        _re.renderAll('section');
+    }
+    return _re;
+}
+
+// `viewsArr`/`scopeBase` (2026-09-17): which subview registry to search
+// and which scope path to address matches under — default to the main
+// view's own (_vt.View.views / ["View"]) for the top-level, non-recursive
+// caller (ws.js's real navigation, index-bootstrap.js, etc. — all
+// unaffected, still work exactly as before). A subview instance rendering
+// ITS OWN subviews (updateVXRs(), above) passes its own `.views`/
+// `.scopePath` instead, so nested subviews resolve against the RIGHT
+// array at the RIGHT nested address instead of always the main view's.
+async function renderView(n, isSub, d, type = 'views', viewsArr, scopeBase = ["View"]) {
+    let filePath = "src/views/" + n + ".view"
+    if (type == 'layouts') filePath = "src/layouts/" + n + ".layout";
+
+    cl(arguments);
+    let fileKey = btoa(filePath);
+    if (!isSub) {
+        View.props = d ?? {};
+        var _queryParams = window.location.href.split("?");
+        var nn = _queryParams.shift();
+        View.params = paraToObj(_queryParams) ?? {};
+    }
+    n = prepareNode(n);
+    var _queryParams = n.split("?");
+    n = _queryParams.shift();
+
+    // 2026-09-15, real bug found implementing HST versioning: `_vcD` is
+    // only ever assigned by ws.js's syncViewFiles() (dev-only, gated on
+    // `!_beaTn`) — production never runs that, so `_vcD` itself stays
+    // undefined forever in a real prod build, even though the SAME data
+    // (views/layouts) is already sitting in the embedded `_vcData` global
+    // (baked directly into the bundle at build time — see fcs.js's `vt`).
+    // Resolved fresh on every call, not cached at module-load time: fcs.js
+    // hands `vt` (which declares `_vcData`) to a remote endpoint that
+    // weaves it into the final bundle at a position this code can't see or
+    // control, so there's no reliable "by now it's definitely defined"
+    // point earlier than an actual function call like this one — by the
+    // time any event-driven code (this function) runs, all synchronous
+    // top-level script content, wherever the remote endpoint placed it,
+    // has already executed.
+    let _payload = _vcD || (typeof _vcData !== 'undefined' ? _vcData : undefined);
+
+    // HST wire-format version check (2026-09-15) — see fcs.js's own
+    // HST_FORMAT_VERSION comment for the full rationale. Checked once per
+    // payload object (not once per call) via a property stamped directly
+    // onto it, so a hot-reloaded payload during dev gets re-checked too.
+    if (_payload && !_payload.__hstVersionChecked) {
+        _payload.__hstVersionChecked = true;
+        if (_payload.hstFormatVersion !== undefined && _payload.hstFormatVersion !== EXPECTED_HST_FORMAT_VERSION) {
+            reportLumenError({
+                stage: 'hst-version-mismatch',
+                error: new Error('This project was compiled for HST format v' + _payload.hstFormatVersion + ', but this LumenJS runtime expects v' + EXPECTED_HST_FORMAT_VERSION + '. @lmjs/cli and @lmjs/core are out of sync — reinstall/upgrade both together.'),
+            });
+            return;
+        }
+    }
+
+    if ((_payload && _payload[type].hasOwnProperty(fileKey)) /*&& _jswacrk.isStarted()*/ && _csswrk.isStarted()) {
+        if (isSub) cl("Rendering", n, fileKey);
+        var hst = _payload[type][fileKey];
+        // var mxes = hst.mxes;
+        // hst = hst.hst;
+        // cl("HHHSSSTTT", hst);
+        // return;
+
+        if (isSub) {
+            // 2026-09-17: per-instance subview scoping — each matched
+            // element needs ITS OWN index within the search array (not its
+            // position in this filtered-by-subPath list) so its compiled
+            // script rewrites into `<scopeBase>.views[<that exact index>].vars`,
+            // not the flat `_vt.View.vars` every subview used to collide on.
+            // Searches viewsArr (this main view's _vt.View.views by
+            // default — unchanged for the top-level caller) or, when
+            // called recursively from a subview instance's own
+            // updateVXRs(), THAT instance's own `.views` — see
+            // updateVXRs() for why nested subviews need this.
+            let searchArr = viewsArr || _vt.View.views;
+            let els = [];
+            for (let i = 0; i < searchArr.length; i++) {
+                let _el = searchArr[i];
+                if (_el.__isProxy) _el = _el.target;
+                if (_el.subPath == n) els.push({ el: _el, viewsIndex: i });
+            }
+            if (els.length) {
+                // cl(els);
+                for (let i = 0; i < els.length; i++) {
+                    const { el, viewsIndex } = els[i];
+                    // Create/reuse el.vars BEFORE rendering, so the fresh
+                    // _v instance renderHST() constructs uses this EXACT
+                    // object as its own .vars — see renderHST()'s ownVars
+                    // param comment for why that identity matters.
+                    el.vars = el.vars || {};
+                    el.views = el.views || [];
+                    el.fns = el.fns || {};
+                    let _re = await renderHST(hst, n, 'sub', undefined, null, scopeBase.concat(["views", viewsIndex]), el.vars, el.fns, el.views);
+                    el._re = _re;
+                    el.innerHTML = "";
+                    // cl(el);
+                    el.append(..._re._RealDOM);
+                    _re.renderAll();
+                }
+                // _re._RealDOM.forEach(_el => el[0].appendChild(_el))
+                // cl(_re);
+            }
+        } else {
+            if (type == 'layouts') {
+                let appSelector = appSettings.App ?? "[app]";
+                var appContainer = $(appSelector);
+                if (appContainer.length) {
+                    let _rel = await renderHST(hst, n, 'layout');
+                    appContainer.data('layout', n).html(_rel._RealDOM);
+                    _rel.renderAll();
+                    goToNode();
+                }
+            } else {
+                let _re = await renderHST(hst, n, 'main');
+                // cl("RRR", _re);
+                let layout = _re.view.settings.layout;
+
+                let filePathL = "src/layouts/" + layout + ".layout";
+                let fileKeyL = btoa(filePathL);
+                let hstL = _payload['layouts'][fileKeyL];
+                // cl(_rel);
+
+
+                let appSelector = appSettings.App ?? "[app]";
+                var appContainer = $(appSelector);
+                if (appContainer.length) {
+                    let currentLayout = $(appSelector).data('layout');
+                    if (currentLayout != layout) {
+                        let _rel = await renderHST(hstL, layout, 'layout');
+                        appContainer.data('layout', layout).html(_rel._RealDOM);
+                        _rel.renderAll();
+                    } else {
+                        // cl("Same Layout");
+                    }
+                } else {
+                    $("body").prepend("<div " + (appSelector) + "></div>");
+                    let _rel = await renderHST(hstL, layout, 'layout');
+                    appContainer = $(appSelector);
+                    appContainer.data('layout', layout).html(_rel._RealDOM);
+                    _rel.renderAll();
+                }
+
+                // return;
+                // setLayout();
+                $('[body]').html(_re._RealDOM);
+
+                // Layout slots (2026-09-15) — see walk()'s "slot" branch
+                // above for how _re.view._slots gets populated. Injected
+                // the same way [body] is, right above — .html() moves the
+                // already-walked real DOM nodes (doesn't clone them), so
+                // this can run before or after renderAll() without
+                // affecting which node each reactive effect targets;
+                // matching [body]'s own ordering here just for consistency.
+                // A view targeting a slot name no loaded layout declares
+                // is a legitimate, silent no-op (the layout may simply not
+                // have that optional region) — $('[slot="x"]') matching
+                // nothing is real jQuery/dom-shim behavior already, not a
+                // new case to handle.
+                if (_re.view._slots) {
+                    for (const slotName in _re.view._slots) {
+                        if (Object.prototype.hasOwnProperty.call(_re.view._slots, slotName)) {
+                            $('[slot="' + slotName + '"]').html(_re.view._slots[slotName]);
+                        }
+                    }
+                }
+
+                _re.renderAll();
+            }
+        }
+    } else {
+        setTimeout(() => {
+            renderView(n, isSub, d);
+        }, 10);
+    }
+}