package.dist.idiomorph-ext.min.js Maven / Gradle / Ivy

Go to download
Show more of this group Show more artifacts with this name
Show all versions of idiomorph Show documentation
an id-based DOM morphing library
The newest version!
var Idiomorph=function(){"use strict";let o=new Set;let n={morphStyle:"outerHTML",callbacks:{beforeNodeAdded:t,afterNodeAdded:t,beforeNodeMorphed:t,afterNodeMorphed:t,beforeNodeRemoved:t,afterNodeRemoved:t,beforeAttributeUpdated:t,beforeNodePantried:t},head:{style:"merge",shouldPreserve:function(e){return e.getAttribute("im-preserve")==="true"},shouldReAppend:function(e){return e.getAttribute("im-re-append")==="true"},shouldRemove:t,afterHeadMorphed:t}};function e(e,t,n={}){if(e instanceof Document){e=e.documentElement}if(typeof t==="string"){t=M(t)}let l=w(t);let r=p(e,l,n);return f(e,l,r)}function f(r,i,o){if(o.head.block){let t=r.querySelector("head");let n=i.querySelector("head");if(t&&n){let e=h(n,t,o);Promise.all(e).then(function(){f(r,i,Object.assign(o,{head:{block:false,ignore:true}}))});return}}if(o.morphStyle==="innerHTML"){l(i,r,o);if(o.config.twoPass){C(r,o)}return Array.from(r.children)}else if(o.morphStyle==="outerHTML"||o.morphStyle==null){let e=k(i,r,o);let t=e?.previousSibling??null;let n=e?.nextSibling??null;let l=d(r,e,o);if(e){if(l){const a=E(t,l,n);if(o.config.twoPass){C(l.parentNode,o)}return a}}else{return[]}}else{throw"Do not understand how to morph style "+o.morphStyle}}function u(e,t){return!!t.ignoreActiveValue&&e===document.activeElement&&e!==document.body}function d(e,t,n){if(n.ignoreActive&&e===document.activeElement){}else if(t==null){if(n.callbacks.beforeNodeRemoved(e)===false)return e;e.parentNode?.removeChild(e);n.callbacks.afterNodeRemoved(e);return null}else if(!g(e,t)){if(n.callbacks.beforeNodeRemoved(e)===false)return e;if(n.callbacks.beforeNodeAdded(t)===false)return e;e.parentNode?.replaceChild(t,e);n.callbacks.afterNodeAdded(t);n.callbacks.afterNodeRemoved(e);return t}else{if(n.callbacks.beforeNodeMorphed(e,t)===false)return e;if(e instanceof HTMLHeadElement&&n.head.ignore){}else if(e instanceof HTMLHeadElement&&n.head.style!=="morph"){h(t,e,n)}else{r(t,e,n);if(!u(e,n)){l(t,e,n)}}n.callbacks.afterNodeMorphed(e,t);return e}return null}function l(n,l,r){if(n instanceof HTMLTemplateElement&&l instanceof HTMLTemplateElement){n=n.content;l=l.content}let i=n.firstChild;let o=l.firstChild;let a;while(i){a=i;i=a.nextSibling;if(o==null){if(r.config.twoPass&&r.persistentIds.has(a.id)){l.appendChild(a)}else{if(r.callbacks.beforeNodeAdded(a)===false)continue;l.appendChild(a);r.callbacks.afterNodeAdded(a)}R(r,a);continue}if(v(a,o,r)){d(o,a,r);o=o.nextSibling;R(r,a);continue}let e=S(n,l,a,o,r);if(e){o=N(o,e,r);d(e,a,r);R(r,a);continue}let t=y(n,l,a,o,r);if(t){o=N(o,t,r);d(t,a,r);R(r,a);continue}if(r.config.twoPass&&r.persistentIds.has(a.id)){l.insertBefore(a,o)}else{if(r.callbacks.beforeNodeAdded(a)===false)continue;l.insertBefore(a,o);r.callbacks.afterNodeAdded(a)}R(r,a)}while(o!==null){let e=o;o=o.nextSibling;H(e,r)}}function s(e,t,n,l){if(e==="value"&&l.ignoreActiveValue&&t===document.activeElement){return true}return l.callbacks.beforeAttributeUpdated(e,t,n)===false}function r(e,t,n){let l=e.nodeType;if(l===1){const r=e;const i=t;const o=r.attributes;const a=i.attributes;for(const f of o){if(s(f.name,i,"update",n)){continue}if(i.getAttribute(f.name)!==f.value){i.setAttribute(f.name,f.value)}}for(let e=a.length-1;0<=e;e--){const d=a[e];if(!d)continue;if(!r.hasAttribute(d.name)){if(s(d.name,i,"remove",n)){continue}i.removeAttribute(d.name)}}}if(l===8||l===3){if(t.nodeValue!==e.nodeValue){t.nodeValue=e.nodeValue}}if(!u(t,n)){c(e,t,n)}}function i(t,n,l,r){if(!(t instanceof Element&&n instanceof Element))return;const i=t[l],e=n[l];if(i!==e){let e=s(l,n,"update",r);if(!e){n[l]=t[l]}if(i){if(!e){n.setAttribute(l,i)}}else{if(!s(l,n,"remove",r)){n.removeAttribute(l)}}}}function c(n,l,r){if(n instanceof HTMLInputElement&&l instanceof HTMLInputElement&&n.type!=="file"){let e=n.value;let t=l.value;i(n,l,"checked",r);i(n,l,"disabled",r);if(!n.hasAttribute("value")){if(!s("value",l,"remove",r)){l.value="";l.removeAttribute("value")}}else if(e!==t){if(!s("value",l,"update",r)){l.setAttribute("value",e);l.value=e}}}else if(n instanceof HTMLOptionElement&&l instanceof HTMLOptionElement){i(n,l,"selected",r)}else if(n instanceof HTMLTextAreaElement&&l instanceof HTMLTextAreaElement){let e=n.value;let t=l.value;if(s("value",l,"update",r)){return}if(e!==t){l.value=e}if(l.firstChild&&l.firstChild.nodeValue!==e){l.firstChild.nodeValue=e}}}function h(e,t,l){let r=[];let i=[];let o=[];let a=[];let f=l.head.style;let d=new Map;for(const n of e.children){d.set(n.outerHTML,n)}for(const s of t.children){let e=d.has(s.outerHTML);let t=l.head.shouldReAppend(s);let n=l.head.shouldPreserve(s);if(e||n){if(t){i.push(s)}else{d.delete(s.outerHTML);o.push(s)}}else{if(f==="append"){if(t){i.push(s);a.push(s)}}else{if(l.head.shouldRemove(s)!==false){i.push(s)}}}}a.push(...d.values());m("to append: ",a);let u=[];for(const c of a){m("adding: ",c);let n=document.createRange().createContextualFragment(c.outerHTML).firstChild;m(n);if(l.callbacks.beforeNodeAdded(n)!==false){if("href"in n&&n.href||"src"in n&&n.src){let t;let e=new Promise(function(e){t=e});n.addEventListener("load",function(){t()});u.push(e)}t.appendChild(n);l.callbacks.afterNodeAdded(n);r.push(n)}}for(const h of i){if(l.callbacks.beforeNodeRemoved(h)!==false){t.removeChild(h);l.callbacks.afterNodeRemoved(h)}}l.head.afterHeadMorphed(t,{added:r,kept:o,removed:i});return u}function m(...e){}function t(){}function a(e){let t=Object.assign({},n);Object.assign(t,e);t.callbacks=Object.assign({},n.callbacks,e.callbacks);t.head=Object.assign({},n.head,e.head);return t}function p(e,t,n){const l=a(n);return{target:e,newContent:t,config:l,morphStyle:l.morphStyle,ignoreActive:l.ignoreActive,ignoreActiveValue:l.ignoreActiveValue,idMap:j(e,t),deadIds:new Set,persistentIds:l.twoPass?q(e,t):new Set,pantry:l.twoPass?b():document.createElement("div"),callbacks:l.callbacks,head:l.head}}function b(){const e=document.createElement("div");e.hidden=true;document.body.insertAdjacentElement("afterend",e);return e}function v(e,t,n){if(e==null||t==null){return false}if(e instanceof Element&&t instanceof Element&&e.tagName===t.tagName){if(e.id!==""&&e.id===t.id){return true}else{return P(n,e,t)>0}}return false}function g(e,t){if(e==null||t==null){return false}if(e.id&&e.id!==t.id){return false}return e.nodeType===t.nodeType&&e.tagName===t.tagName}function N(e,t,n){let l=e;while(l!==t){let e=l;l=e.nextSibling;H(e,n)}R(n,t);return t.nextSibling}function S(t,e,n,l,r){let i=P(r,n,e);let o=null;if(i>0){o=l;let e=0;while(o!=null){if(v(n,o,r)){return o}e+=P(r,o,t);if(e>i){return null}o=o.nextSibling}}return o}function y(e,t,n,l,r){let i=l;let o=n.nextSibling;let a=0;while(i!=null){if(P(r,i,e)>0){return null}if(g(i,n)){return i}if(g(i,o)){a++;o=o.nextSibling;if(a>=2){return null}}i=i.nextSibling}return i}const A=new WeakSet;function M(n){let l=new DOMParser;let e=n.replace(/]*>|>)([\s\S]*?)<\/svg>/gim,"");if(e.match(/<\/html>/)||e.match(/<\/head>/)||e.match(/<\/body>/)){let t=l.parseFromString(n,"text/html");if(e.match(/<\/html>/)){A.add(t);return t}else{let e=t.firstChild;if(e){A.add(e);return e}else{return null}}}else{let e=l.parseFromString("","text/html");let t=e.body.querySelector("template").content;A.add(t);return t}}function w(e){if(e==null){const t=document.createElement("div");return t}else if(A.has(e)){return e}else if(e instanceof Node){const t=document.createElement("div");t.append(e);return t}else{const t=document.createElement("div");for(const n of[...e]){t.append(n)}return t}}function E(e,t,n){let l=[];let r=[];while(e!=null){l.push(e);e=e.previousSibling}let i=l.pop();while(i!==undefined){r.push(i);t.parentElement?.insertBefore(i,t);i=l.pop()}r.push(t);while(n!=null){l.push(n);r.push(n);n=n.nextSibling}while(l.length>0){const i=l.pop();t.parentElement?.insertBefore(i,t.nextSibling)}return r}function k(e,t,n){let l;l=e.firstChild;let r=l;let i=0;while(l){let e=T(l,t,n);if(e>i){r=l;i=e}l=l.nextSibling}return r}function T(e,t,n){if(g(t,e)){return.5+P(n,e,t)}return 0}function H(e,t){R(t,e);if(t.config.twoPass&&O(t,e)&&e instanceof Element){L(e,t)}else{if(t.callbacks.beforeNodeRemoved(e)===false)return;e.parentNode?.removeChild(e);t.callbacks.afterNodeRemoved(e)}}function L(e,t){if(t.callbacks.beforeNodePantried(e)===false)return;Array.from(e.childNodes).forEach(e=>{L(e,t)});if(t.persistentIds.has(e.id)){if(t.pantry.moveBefore){t.pantry.moveBefore(e,null)}else{t.pantry.insertBefore(e,null)}}else{if(t.callbacks.beforeNodeRemoved(e)===false)return;e.parentNode?.removeChild(e);t.callbacks.afterNodeRemoved(e)}}function C(n,l){if(n instanceof Element){Array.from(l.pantry.children).reverse().forEach(e=>{const t=n.querySelector(`#${e.id}`);if(t){if(t.parentElement?.moveBefore){t.parentElement.moveBefore(e,t);while(t.hasChildNodes()){e.moveBefore(t.firstChild,null)}}else{t.before(e);while(t.firstChild){e.insertBefore(t.firstChild,null)}}if(l.callbacks.beforeNodeMorphed(e,t)!==false){r(t,e,l);l.callbacks.afterNodeMorphed(e,t)}t.remove()}});l.pantry.remove()}}function x(e,t){return!e.deadIds.has(t)}function V(e,t,n){let l=e.idMap.get(n)||o;return l.has(t)}function R(e,t){let n=e.idMap.get(t)||o;for(const l of n){e.deadIds.add(l)}}function O(e,t){for(const n of e.idMap.get(t)||o){if(e.persistentIds.has(n)){return true}}return false}function P(e,t,n){let l=e.idMap.get(t)||o;let r=0;for(const i of l){if(x(e,i)&&V(e,i,n)){++r}}return r}function I(e){let t=Array.from(e.querySelectorAll("[id]"));if(e.id){t.push(e)}return t}function B(e,n){let l=e.parentElement;for(const r of I(e)){let t=r;while(t!==l&&t!=null){let e=n.get(t);if(e==null){e=new Set;n.set(t,e)}e.add(r.id);t=t.parentElement}}}function j(e,t){let n=new Map;B(e,n);B(t,n);return n}function q(e,t){const n=e=>e.tagName+"#"+e.id;const l=new Set(I(e).map(n));let r=new Set;for(const i of I(t)){if(l.has(n(i))){r.add(i.id)}}return r}return{morph:e,defaults:n}}();(function(){function r(e){if(e==="morph"||e==="morph:outerHTML"){return{morphStyle:"outerHTML"}}else if(e==="morph:innerHTML"){return{morphStyle:"innerHTML"}}else if(e.startsWith("morph:")){return Function("return ("+e.slice(6)+")")()}}htmx.defineExtension("morph",{isInlineSwap:function(e){let t=r(e);return t?.morphStyle==="outerHTML"||t?.morphStyle==null},handleSwap:function(e,t,n){let l=r(e);if(l){return Idiomorph.morph(t,n.children,l)}}})})();