@lmjs/core 2.5.3 → 2.5.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lmjs/core",
-  "version": "2.5.3",
+  "version": "2.5.5",
   "description": "LumenJS reactive core runtime — the reactive engine, HTML/JS AST compiler, realtime socket client, and delegated event listeners powering LumenJS applications.",
   "files": [
     "dist/",

package/src/_re.js

@@ -668,6 +668,14 @@ function _evalEventScopedExpr(ownerRe, expr, locals) {
         }
         return undefined;
     }
+    // `ev` and `el` are the handler's documented locals. The others evalEvAttr passes (`n`, the event's name, and
+    // `arg1`..`arg3`) are internal, so a page or loop variable with that name wins: `:for="names as n"` with
+    // `@click="n = n + '!'"` used to read and write the event name instead of the row's `n` (2026-10-08).
+    function isLocal(key) {
+        if (!locals.hasOwnProperty(key)) return false;
+        if (key === 'ev' || key === 'el' || key.indexOf('__lm') === 0 || !hasOwner) return true;
+        return !(levelOf(key) || ownFn(key));
+    }
     let scopeProxy = new Proxy({}, {
         has(target, key) {
             if (typeof key === 'symbol') return false;
@@ -677,7 +685,7 @@ function _evalEventScopedExpr(ownerRe, expr, locals) {
             return !!levelOf(key) || widgetsVars.hasOwnProperty(key) || _vt.Global.vars.hasOwnProperty(key);
         },
         get(target, key) {
-            if (locals.hasOwnProperty(key)) return locals[key];
+            if (isLocal(key)) return locals[key];
             const f = ownFn(key);
             if (f) return f;
             const lv = levelOf(key);
@@ -688,7 +696,7 @@ function _evalEventScopedExpr(ownerRe, expr, locals) {
             return _vt.Global.vars[key];
         },
         set(target, key, value) {
-            if (locals.hasOwnProperty(key)) { locals[key] = value; return true; }
+            if (isLocal(key)) { locals[key] = value; return true; }
             try {
                 const lv = levelOf(key);
                 if (lv) {
@@ -711,7 +719,112 @@ function _evalEventScopedExpr(ownerRe, expr, locals) {
     function _runWithScope(expr) {
         with (scopeProxy) { return eval(expr); }
     }
-    return _runWithScope(expr);
+    if (locals.__lmNoWriteBack) return _runWithScope(expr);
+    let rows = _lmRowSnapshots(levels);
+    let result = _runWithScope(expr);
+    if (rows.length) {
+        _lmRowWriteBack(rows);
+        // `@click="save(t)"` with an async save(): changes made after its first await are saved when it settles.
+        if (result && typeof result.then === 'function') result.then(function () { _lmRowWriteBack(rows); }, function () { _lmRowWriteBack(rows); });
+    }
+    return result;
+}
+
+// 2026-10-08: a :for row's variables are copies of the list's items (the loop renders from a clone, which its
+// diff needs). `@click="t.done = !t.done"`, `@click="toggle(t)"` or, in a bare `:for="todos"`, `done = !done` used
+// to change only that copy, so nothing happened. V1 behaved the same; V2 now saves the change into the real item,
+// as a Vue developer would expect: after a row's handler runs, each property of the row's item (alias, or a spread
+// key) that changed is written to `<list>[index].<prop>` in the scope that owns the list, which re-renders it.
+// Only changed properties are written, so values a copy can't carry (Dates, class instances) stay intact. A list
+// that isn't a plain variable path (`todos.filter(...)`, a number) can't be written to; a dev-mode warning says so.
+var _lmRowPathRe = /^\s*[A-Za-z_$][\w$]*(?:\s*\.\s*[A-Za-z_$][\w$]*|\[\s*\d+\s*\])*\s*$/;
+var _lmRowWarned = {};
+function _lmRowJson(v) {
+    try { return JSON.stringify(v === undefined ? null : v); } catch (e) { return null; }
+}
+function _lmRowSnapshots(levels) {
+    let rows = [];
+    for (let i = 0; i < levels.length; i++) {
+        let re = levels[i].re, info = re && re._lmRow;
+        if (!info) continue;
+        let vars = levels[i].vars, forX = info.forX || {}, as = forX.as || {};
+        let names = [];
+        if (info.isObj) {
+            let vName = as.v ? as.v : (as.k ? '' : 'value');
+            if (vName) names.push({ name: vName, whole: true });
+        } else {
+            if (as.k) names.push({ name: as.k, whole: true });
+            // The item's own keys are spread into the row's scope as well.
+            let item = as.k ? vars[as.k] : null;
+            let src = item && typeof item === 'object' && !Array.isArray(item) ? item : null;
+            for (let k in vars) {
+                if (!Object.prototype.hasOwnProperty.call(vars, k) || k === as.k || k === forX.dx || k === 'index' || k === 'key' || k === 'value') continue;
+                if (src ? Object.prototype.hasOwnProperty.call(src, k) : !as.k) names.push({ name: k, whole: false });
+            }
+        }
+        let snap = {};
+        for (let n = 0; n < names.length; n++) snap[names[n].name] = _lmRowJson(vars[names[n].name]);
+        rows.push({ re: re, vars: vars, info: info, names: names, snap: snap });
+    }
+    return rows;
+}
+function _lmRowWriteBack(rows) {
+    for (let r = 0; r < rows.length; r++) {
+        let row = rows[r], vars = row.vars, info = row.info, js = info.forX && info.forX.js;
+        let owner = row.re.view && row.re.view._pv;
+        let pos = info.isObj ? vars.key : vars.index;
+        for (let n = 0; n < row.names.length; n++) {
+            let name = row.names[n].name, now = _lmRowJson(vars[name]);
+            if (now === row.snap[name]) continue;
+            let before = row.snap[name];
+            row.snap[name] = now;
+            if (!owner || typeof js !== 'string' || !_lmRowPathRe.test(js) || pos === undefined) {
+                if (_lumenDevMode && !_lmRowWarned[js]) {
+                    _lmRowWarned[js] = true;
+                    console.warn('[LumenJS] A change to a row of :for="' + js + '" was not saved: the list is not a variable. ' +
+                        'Loop over a variable, or change the item in the list itself (list[i].prop = value).');
+                }
+                continue;
+            }
+            let value = vars[name];
+            try {
+                if (!row.names[n].whole) {
+                    _evalEventScopedExpr(owner, '(' + js + ')[__lmPos][__lmProp] = __lmVal', { __lmPos: pos, __lmProp: name, __lmVal: clone(value), __lmNoWriteBack: true });
+                } else if (value && typeof value === 'object' && !Array.isArray(value)) {
+                    let old = null;
+                    try { old = JSON.parse(before); } catch (e) { old = null; }
+                    if (!old || typeof old !== 'object' || Array.isArray(old)) {
+                        _evalEventScopedExpr(owner, '(' + js + ')[__lmPos] = __lmVal', { __lmPos: pos, __lmVal: clone(value), __lmNoWriteBack: true });
+                        continue;
+                    }
+                    for (let k in value) {
+                        if (!Object.prototype.hasOwnProperty.call(value, k)) continue;
+                        if (_lmRowJson(value[k]) === _lmRowJson(old[k])) continue;
+                        _evalEventScopedExpr(owner, '(' + js + ')[__lmPos][__lmProp] = __lmVal', { __lmPos: pos, __lmProp: k, __lmVal: clone(value[k]), __lmNoWriteBack: true });
+                    }
+                    for (let k in old) {
+                        if (Object.prototype.hasOwnProperty.call(old, k) && !Object.prototype.hasOwnProperty.call(value, k))
+                            _evalEventScopedExpr(owner, 'delete (' + js + ')[__lmPos][__lmProp]', { __lmPos: pos, __lmProp: k, __lmNoWriteBack: true });
+                    }
+                } else {
+                    _evalEventScopedExpr(owner, '(' + js + ')[__lmPos] = __lmVal', { __lmPos: pos, __lmVal: clone(value), __lmNoWriteBack: true });
+                }
+                _lmRowTouch(owner, js);
+            } catch (e) { cl(e); }
+        }
+    }
+}
+// A nested write is re-rendered by the reactive proxy when the list lives in a view; a list held by an enclosing
+// :for row (a nested loop) is a plain copy, so that row is told to update.
+function _lmRowTouch(owner, js) {
+    let root = /^\s*([A-Za-z_$][\w$]*)/.exec(js);
+    if (!root) return;
+    root = root[1];
+    for (let e = owner, n = 0; e && e.view && n < 50; e = e.view._pv, n++) {
+        if (!e.view.vars || !Object.prototype.hasOwnProperty.call(e.view.vars, root)) continue;
+        if (e._lmRow) { try { e.update(root); } catch (err) { cl(err); } }
+        return;
+    }
 }
 
 // concatVarsAtLevel() below merges via object spread, not the loop-with-
@@ -1374,8 +1487,11 @@ class _lm {
                     if (myLimit == limit * 1) break;
                     try {
                         let vx = {}; //clone(_vt.View.vars);
-                        vx['index'] = myLimit;
-                        if (forX['dx'] != "") vx[forX['dx']] = myLimit;
+                        // 2026-10-08: the row index is the item's position in the array (plus :for-offset), as in
+                        // V1 — not its position among the rows shown. With :for-if / :for + :if filtering rows out,
+                        // `items[i]` in a handler used to address a different item than the row clicked.
+                        vx['index'] = offset * 1 + index * 1;
+                        if (forX['dx'] != "") vx[forX['dx']] = offset * 1 + index * 1;
                         if (isObj) {
                             if (forX['as']['v'] != "") {
                                 if (forX['as']['k']) vx[forX['as']['k']] = marray[index]['key'];
@@ -1553,7 +1669,7 @@ class _lm {
                 if (addActions.length) {
                     let createdSections = await Promise.all(addActions.map((actn) => {
                         let vx = arrayToRenderVXs[actn.index];
-                        return this.createSection(cx, vx, isObj, forX);
+                        return this.createSection(cx, vx, isObj, forX, actn.index);
                     }));
                     for (let ci = 0; ci < createdSections.length; ci++) {
                         let cln = createdSections[ci];
@@ -2214,7 +2330,7 @@ class _lm {
         // 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, {});
+            _queueMountHook(doc, _el);
         }
 
         // 2026-09-16: V1's real automatic plugin-init pass, ported
@@ -2774,8 +2890,10 @@ class _lm {
         });
     }
 
-    async createSection(cx, vx, isObj, forX) {
-        var keyed = cx.key + '_' + vx.index;
+    async createSection(cx, vx, isObj, forX, pos) {
+        // A row's DOM key is its position among the rows rendered (what the remove/update actions use), which differs
+        // from vx.index (the item's array position) when :for-if / :for-offset skip items.
+        var keyed = cx.key + '_' + (pos !== undefined ? pos : vx.index);
         // cl("DD", cx, vx, keyed);
         var tx = document.createTextNode("");
         var typeN = null;
@@ -2821,6 +2939,8 @@ class _lm {
         // The row element was created by the loop's owner (above); its @-handlers must resolve against THIS row's
         // engine (row alias, index) and fall back to the enclosing view through the engine chain.
         if (el && scsc) Object.defineProperty(el, '_ownerRe', { value: scsc, enumerable: false, configurable: true, writable: true });
+        // Which list this row comes from, so a handler's change to the row's copy is saved into it (_lmRowWriteBack).
+        if (scsc && typeN === 'for' && forX) scsc._lmRow = { forX: forX, isObj: isObj };
         // cl(23);
         // cl(scsc);
         scsc._re = scsc;
@@ -3055,6 +3175,44 @@ async function fireRenderHook(cx, n, containerEl, extra) {
     return result;
 }
 
+// 2026-10-08: a mount `@after-render` used to fire inside createEl(), while the element was still detached and
+// before the view's own <script> had run, so `@after-render="setup"` found no `setup` and was silently skipped (and
+// `el.offsetWidth`, a chart or a slider saw a detached node). It now fires once the element is in the document and,
+// for a plain function name, once that function exists: checked on the next tasks, for up to ~2s.
+var _pendingMountHooks = [];
+var _mountHookTimer = null;
+function _mountHookReady(doc, el) {
+    if (!el.isConnected) return false;
+    let v = doc && doc.evs && doc.evs['@after-render'];
+    if (typeof v !== 'string' || !/^\s*[A-Za-z_$][\w$]*\s*$/.test(v)) return true;
+    v = v.trim();
+    if (typeof window[v] === 'function') return true;
+    for (let e = el._ownerRe, n = 0; e && e.view && n < 50; e = e.view._pv, n++) {
+        if (e.view.fns && typeof e.view.fns[v] === 'function') return true;
+    }
+    return false;
+}
+function _queueMountHook(doc, el) {
+    _pendingMountHooks.push([doc, el, 0]);
+    if (!_mountHookTimer) _mountHookTimer = setTimeout(_flushMountHooks, 0);
+}
+function _flushMountHooks() {
+    _mountHookTimer = null;
+    let waiting = [];
+    let due = _pendingMountHooks;
+    _pendingMountHooks = [];
+    for (let i = 0; i < due.length; i++) {
+        let doc = due[i][0], el = due[i][1], tries = due[i][2];
+        if (_mountHookReady(doc, el)) fireRenderHook({ doc: doc }, 'after-render', el, {});
+        else if (tries < 40) waiting.push([doc, el, tries + 1]);
+        // Still not ready after ~2s: connected means the name is not a function (fire, so the usual error shows);
+        // detached means the element was thrown away before it was ever shown.
+        else if (el.isConnected) fireRenderHook({ doc: doc }, 'after-render', el, {});
+    }
+    for (let i = 0; i < waiting.length; i++) _pendingMountHooks.push(waiting[i]);
+    if (_pendingMountHooks.length && !_mountHookTimer) _mountHookTimer = setTimeout(_flushMountHooks, waiting.length === _pendingMountHooks.length ? 50 : 0);
+}
+
 // 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
@@ -3504,7 +3662,7 @@ async function renderView(n, isSub, d, type = 'views', viewsArr, scopeBase = ["V
     let fileKey = btoa(filePath);
     if (!isSub) {
         View.props = d ?? {};
-        var _queryParams = window.location.href.split("?");
+        var _queryParams = window.location.href.split("#")[0].split("?");
         var nn = _queryParams.shift();
         View.params = paraToObj(_queryParams) ?? {};
     }

package/src/lstnrs.js

@@ -1221,10 +1221,14 @@ $("body").on("click touch", "a,area", function (e) {
     // alert(url);
 
     if (local && !cntrlon) {
+      // 2026-10-08: a link to a #fragment of the page already showing
+      // (`href="#faq"`, or `/guide#faq` while on /guide) is left to the
+      // browser: it scrolls, and the view is not re-rendered.
+      if (l.hash && l.pathname == location.pathname && l.search == location.search) return;
       e.preventDefault();
       if (el.hasAttr("stop")) e.stopPropagation();
 
-      pushURL(url + (l.search != "" ? l.search : "") ?? "home");
+      pushURL(url + (l.search != "" ? l.search : "") + (l.hash || "") ?? "home");
     } else {
     }
   }

package/vendor/reconnecting-websocket.js

@@ -552,6 +552,30 @@ var miniTB = [
 // })();
 
 var XHRs = new Array();
+// 2026-10-08: where web storage is blocked (a sandboxed iframe such as lumenjs.com's playground or an embed,
+// cookies disabled, some privacy modes) reading `localStorage` throws, and the line below used to stop the whole
+// runtime before anything rendered. Fall back to in-memory storage for that page load instead: `globals` and the
+// app's own storage calls keep working, they just aren't kept after a reload.
+(function () {
+    function memoryStorage() {
+        var d = {};
+        return {
+            getItem: function (k) { return Object.prototype.hasOwnProperty.call(d, k) ? d[k] : null; },
+            setItem: function (k, v) { d[k] = String(v); },
+            removeItem: function (k) { delete d[k]; },
+            clear: function () { d = {}; },
+            key: function (i) { return Object.keys(d)[i] || null; },
+            get length() { return Object.keys(d).length; }
+        };
+    }
+    ["localStorage", "sessionStorage"].forEach(function (name) {
+        try {
+            var s = window[name];
+            if (s) { s.getItem("globals"); return; }
+        } catch (e) { }
+        try { Object.defineProperty(window, name, { value: memoryStorage(), configurable: true }); } catch (e) { }
+    });
+})();
 if (localStorage.getItem("globals") === null)
     localStorage.setItem("globals", JSON.stringify({}));
 if (localStorage.getItem("_rx") === null)
@@ -1294,8 +1318,31 @@ function getFormData(form) {
     return indexed_array;
 }
 
+// 2026-10-08: a URL's #fragment is not part of the route. `/page#part` renders
+// `page`, and once it has rendered the browser is asked to scroll to `#part`.
+// A popstate that changes only the fragment (an in-page anchor, or Back to
+// one) leaves the view alone, as a normal web page would, instead of
+// re-rendering it from scratch. V1 read the fragment as part of the view name.
+var _lumenRouteKey = null;
+function _lumenScrollToHash() {
+    var h = location.hash;
+    if (!h || h.length < 2) return;
+    var id;
+    try { id = decodeURIComponent(h.slice(1)); } catch (e) { id = h.slice(1); }
+    var tries = 0;
+    (function go() {
+        var t = document.getElementById(id) || document.getElementsByName(id)[0];
+        if (t) t.scrollIntoView();
+        else if (++tries < 40) setTimeout(go, 50);
+    })();
+}
 $(window).on("popstate", function () {
-    if (history && history.pushState) goToNode();
+    if (!(history && history.pushState)) return;
+    if (_lumenRouteKey !== null && location.pathname + location.search === _lumenRouteKey) {
+        _lumenScrollToHash();
+        return;
+    }
+    goToNode();
 });
 
 var getLocation = function (href) {
@@ -1325,12 +1372,14 @@ function getURLNodes() {
                 .split(appSettings.Base)
                 .join("")
                 .replace(new RegExp("^[" + "/" + "]+"), "")
+                .split("#")[0]
                 .split("?")[0]
                 .split("/");
 
     // let authFunc = (appSettings.auth && typeof appSettings.auth === "function") ? appSettings.auth : (typeof Auth === "function" ? Auth : null);
     // if (typeof authFunc === 'function') authFunc();
     if (!_nodes[0]) _nodes[0] = appSettings.defaultView ?? "home";
+    _lumenRouteKey = location.pathname + location.search;
 
     if (historyStack[historyStack.length - 1]?.url != window.location.href)
         historyStack.push({
@@ -1346,7 +1395,7 @@ function goToNode(d) {
     if (_initialized) {
         prevNodes = clone(nodes);
         nodes = getURLNodes();
-        renderView(nodes[0], null, d);
+        Promise.resolve(renderView(nodes[0], null, d)).then(_lumenScrollToHash);
     } else {
         setTimeout(function () {
             goToNode(d);