Merge branch 'develop' of https://github.com/starfederation/datastar …

…into develop

CHANGELOG.md

@@ -6,6 +6,10 @@ Each tagged version of Datastar is accompanied by a release note. Read the [rele
 
 ## v1.0.0-beta.7
 
+### Changed
+
+- Updated Idiomorph to version [0.7.1](https://github.com/bigskysoftware/idiomorph/blob/main/CHANGELOG.md#071---2025-02-13).
+
 ### Fixed
 
 - Fixed a bug in which `datastar-remove-fragments` events were not having any effect ([#664](https://github.com/starfederation/datastar/issues/664)).

README.md

@@ -10,7 +10,7 @@
 
 Datastar helps you build reactive web applications with the simplicity of server-side rendering and the power of a full-stack SPA framework.
 
-Getting started is as easy as adding a single 14.4 KiB script tag to your HTML.
+Getting started is as easy as adding a single 14.5 KiB script tag to your HTML.
 
 ```html
 <script type="module" src="https://cdn.jsdelivr.net/gh/starfederation/[email protected]/bundles/datastar.js"></script>

library/README.md

@@ -10,7 +10,7 @@
 
 Datastar helps you build reactive web applications with the simplicity of server-side rendering and the power of a full-stack SPA framework.
 
-Getting started is as easy as adding a single 14.4 KiB script tag to your HTML.
+Getting started is as easy as adding a single 14.5 KiB script tag to your HTML.
 
 ```html
 <script type="module" src="https://cdn.jsdelivr.net/gh/starfederation/[email protected]/bundles/datastar.js"></script>

library/src/vendored/idiomorph.esm.js

@@ -141,7 +141,7 @@ var Idiomorph = (function () {
       shouldRemove: noOp,
       afterHeadMorphed: noOp,
     },
-    restoreFocus: false,
+    restoreFocus: true,
   };
 
   /**
@@ -1056,26 +1056,28 @@ var Idiomorph = (function () {
      * argument and populates id sets for those nodes and all their parents, generating
      * a set of ids contained within all nodes for the entire hierarchy in the DOM
      *
-     * @param {Element|null} nodeParent
+     * @param {Element|null} root
      * @param {Element[]} nodes
      * @param {Set<string>} persistentIds
      * @param {Map<Node, Set<string>>} idMap
      */
-    function populateIdMapForNode(nodeParent, nodes, persistentIds, idMap) {
+    function populateIdMapForNode(root, nodes, persistentIds, idMap) {
       for (const elt of nodes) {
         if (persistentIds.has(elt.id)) {
           /** @type {Element|null} */
           let current = elt;
           // walk up the parent hierarchy of that element, adding the id
           // of element to the parent's id set
-          while (current && current !== nodeParent) {
+          while (current) {
             let idSet = idMap.get(current);
             // if the id set doesn't exist, create it and insert it in the  map
             if (idSet == null) {
               idSet = new Set();
               idMap.set(current, idSet);
             }
             idSet.add(elt.id);
+
+            if (current === root) break;
             current = current.parentElement;
           }
         }
@@ -1126,18 +1128,16 @@ var Idiomorph = (function () {
 
       /** @type {Map<Node, Set<string>>} */
       let idMap = new Map();
-      populateIdMapForNode(
-        oldContent.parentElement,
-        newElts,
-        persistentIds,
-        idMap,
-      );
-      populateIdMapForNode(
-        newContent.parentElement,
-        oldElts,
-        persistentIds,
-        idMap,
-      );
+      populateIdMapForNode(oldContent, oldElts, persistentIds, idMap);
+
+      let newRoot = newContent;
+      // if newContent is a duck-typed parent, pass its single child node as the root to halt upwards iteration
+      /** @ts-ignore */
+      if (newContent.__idiomorphDummyParent) {
+        newRoot = /** @type {Element} */ (newContent.childNodes[0]);
+      }
+      populateIdMapForNode(newRoot, newElts, persistentIds, idMap);
+
       return { persistentIds, idMap };
     }
 
@@ -1181,7 +1181,28 @@ var Idiomorph = (function () {
         return /** @type {Element} */ (newContent);
       } else if (newContent instanceof Node) {
         if (newContent.parentNode) {
-          return /** @type {Element} */ (newContent.parentNode);
+          // we can't use the parent directly because newContent may have siblings
+          // that we don't want in the morph. we can't reparent either, because we
+          // want to preserve hidden state. so we create a duck-typed parent.
+          return /** @type {Element} */ (
+            /** @type {unknown} */ ({
+              childNodes: [newContent],
+              /** @ts-ignore - cover your eyes for a minute, tsc */
+              querySelectorAll: (s) => {
+                /** @ts-ignore */
+                const elements = newContent.querySelectorAll(s);
+                /** @ts-ignore */
+                return newContent.matches(s)
+                  ? [newContent, ...elements]
+                  : elements;
+              },
+              /** @ts-ignore */
+              insertBefore: (n, r) => newContent.parentNode.insertBefore(n, r),
+              /** @ts-ignore */
+              moveBefore: (n, r) => newContent.parentNode.moveBefore(n, r),
+              __idiomorphDummyParent: true,
+            })
+          );
         } else {
           // a single node is added as a child to a dummy parent
           const dummyParent = document.createElement("div");