@zoijs/core 1.3.1 → 1.3.2

package/CHANGELOG.md

@@ -4,6 +4,16 @@ All notable changes to Zoijs are documented here. The format is based on
 [Keep a Changelog](https://keepachangelog.com/), and Zoijs follows
 [Semantic Versioning](https://semver.org/) (see `VERSIONING.md`).
 
+## [1.3.2] — 2026-06-26
+
+### Fixed
+- **Focus is preserved across a keyed reorder.** The 1.3.1 minimal-move change can
+  move the subtree that holds the focused element, which blurs it in browsers.
+  `each` now captures focus + caret position before reordering and restores them
+  after, so reordering a list never steals focus or selection — whichever nodes
+  happen to move. Verified in Chromium, Firefox, and WebKit
+  (`browser-tests/regression.spec.js`).
+
 ## [1.3.1] — 2026-06-26
 
 ### Performance

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zoijs/core",
-  "version": "1.3.1",
+  "version": "1.3.2",
   "description": "Zoijs — a beginner-friendly, no-build, no-Virtual-DOM frontend framework. Plain HTML, CSS, and JavaScript.",
   "type": "module",
   "main": "src/index.js",

package/src/core/renderer.js

@@ -343,6 +343,23 @@ function setupKeyedList(anchor, marker) {
       for (const n of rec.nodes) n.remove();
     }
 
+    // Moving the subtree that holds the focused element blurs it in some browsers,
+    // so capture focus (and caret) before the moves and restore it after — a
+    // reorder must never steal focus or selection, whichever nodes happen to move.
+    const doc = anchor.ownerDocument;
+    const active = doc && doc.activeElement;
+    const refocus = active && active !== doc.body && parent.contains(active);
+    let selStart = null;
+    let selEnd = null;
+    if (refocus) {
+      try {
+        selStart = active.selectionStart;
+        selEnd = active.selectionEnd;
+      } catch {
+        selStart = null; // not a text field — focus only, no caret to restore
+      }
+    }
+
     // Items in the longest increasing subsequence of old positions are already in
     // the right relative order — leave them put (minimal DOM moves). Everything
     // else (moved or new) is inserted before the running cursor, walking from the
@@ -362,6 +379,17 @@ function setupKeyedList(anchor, marker) {
       cursor = rec.nodes[0] || cursor;
     }
 
+    if (refocus && doc.activeElement !== active) {
+      active.focus();
+      if (selStart !== null && active.setSelectionRange) {
+        try {
+          active.setSelectionRange(selStart, selEnd);
+        } catch {
+          /* element no longer supports selection — focus alone is enough */
+        }
+      }
+    }
+
     records = newRecords;
     currentList = ordered;
   };