Method morph

src/core/runtime/morph.js:23–57

* Morph oldNode to match content. * @param {Element} oldNode - The existing DOM element to morph * @param {string|Element|DocumentFragment} content - The new content * @param {MorphCallbacks} [callbacks] - Optional lifecycle callbacks

(oldNode, content, callbacks = {})

     * @param {MorphCallbacks} [callbacks] - Optional lifecycle callbacks
     */
    morph(oldNode, content, callbacks = {}) {
        var fragment;
        if (typeof content === "string") {
            var temp = document.createElement("template");
            temp.innerHTML = content;
            fragment = temp.content;
        } else if (content instanceof DocumentFragment) {
            fragment = content;
        } else if (content instanceof Element) {
            fragment = document.createDocumentFragment();
            fragment.append(content.cloneNode(true));
        } else {
            throw new Error("morph requires an HTML string, element, or document fragment");
        }

        // If the fragment has a single root element matching the target tag,
        // treat as outer morph: sync attributes, then morph children
        var newRoot = fragment.firstElementChild;
        if (newRoot && !newRoot.nextElementSibling && newRoot.tagName === oldNode.tagName) {
            _copyAttributes(oldNode, newRoot);
            fragment = newRoot;
        }

        var { persistentIds, idMap } = _createIdMaps(oldNode, fragment);
        var pantry = document.createElement("div");
        pantry.hidden = true;
        (document.body || oldNode.parentElement).after(pantry);
        var ctx = { target: oldNode, idMap, persistentIds, pantry, futureMatches: new WeakSet(), callbacks };

        _morphChildren(ctx, oldNode, fragment);

        // clean up orphaned nodes in pantry
        callbacks.beforeNodeRemoved?.(pantry);
        pantry.remove();
    }
}

function _morphChildren(ctx, oldParent, newParent, insertionPoint = null, endPoint = null) {