malevic/umd/dom.min.js

Malevič.js - minimalistic reactive UI library

!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e(((t="undefined"!=typeof globalThis?globalThis:t||self).Malevic=t.Malevic||{},t.Malevic.DOM={}))}(this,(function(t){"use strict";function e(){var t=[];return{add:function(e){return t.push(e),this},apply:function(e){for(var n,r,o=new Set,i=t.length-1;i>=0;i--)if(r=t[i],!o.has(r)){if(null!=(n=r(e)))return n;o.add(r)}return null},delete:function(e){for(var n=t.length-1;n>=0;n--)if(t[n]===e){t.splice(n,1);break}return this},empty:function(){return 0===t.length}}}function n(t,e,n){e.filter((function(e){var n=e[0];return t[n]})).forEach((function(e){var r=e[0],o=e[1];return t[r].forEach((function(t){return n(o,t)}))}))}function r(t){var e={add:function(n,r){return n[t]||(n[t]=[]),n[t].push(r),e}};return e}var o="http://www.w3.org/1999/xhtml",i=Symbol(),u=e();function s(){for(var t=[],e=0;e<arguments.length;e++)t[e]=arguments[e];var n=[],r=function(t){t&&("string"==typeof t?n.push(t):Array.isArray(t)?t.forEach(r):"object"==typeof t&&n.push.apply(n,Object.keys(t).filter((function(e){return Boolean(t[e])}))))};return t.forEach(r),n.join(" ")}function a(t){return null!=t&&"object"==typeof t}var c=new WeakMap;function p(t,e){var n=new Map,r=new Set(Object.keys(t));return Object.keys(e).filter((function(t){return!r.has(t)})).forEach((function(t){return n.set(t,null)})),r.forEach((function(e){return n.set(e,t[e])})),n}function f(t,e,n){var r;a(n)?r=n:(r={},t.removeAttribute("style")),p(e,r).forEach((function(e,n){return function(t,e,n){if(null!=n&&""!==n){var r=String(n),o="";r.endsWith("!important")&&(r=r.substring(0,r.length-10),o="important"),t.style.setProperty(e,r,o)}else t.style.removeProperty(e)}(t,n,e)}))}function l(t,e,n){"function"==typeof n?function(t,e,n){var r;c.has(t)?r=c.get(t):(r=new Map,c.set(t,r)),r.get(e)!==n&&(r.has(e)&&t.removeEventListener(e,r.get(e)),t.addEventListener(e,n),r.set(e,n))}(t,e,n):function(t,e){if(c.has(t)){var n=c.get(t);t.removeEventListener(e,n.get(e)),n.delete(e)}}(t,e)}var h=new Set(["key","oncreate","onupdate","onrender","onremove"]),d=Symbol(),v=e();function y(t,e){return t&&t.hasOwnProperty(e)?t[e]:null}function g(t,e,n){p(e,n||{}).forEach((function(e,r){if(!v.empty()&&null!=v.apply({element:t,attr:r,value:e,get prev(){return y(n,r)}}))return;if("class"===r&&a(e))!function(t,e){var n=Array.isArray(e)?s.apply(void 0,e):s(e);n?t.setAttribute("class",n):t.removeAttribute("class")}(t,e);else if("style"===r&&a(e)){var o=y(n,r);f(t,e,o)}else if(r.startsWith("on")){var i=r.substring(2);l(t,i,e)}else h.has(r)||(null==e||!1===e?t.removeAttribute(r):t.setAttribute(r,!0===e?"":String(e)))}))}var m=function(){function t(){for(var t=[],e=0;e<arguments.length;e++)t[e]=arguments[e];var n=this;this.nexts=new WeakMap,this.prevs=new WeakMap,this.first=null,this.last=null,t.forEach((function(t){return n.push(t)}))}return t.prototype.empty=function(){return null==this.first},t.prototype.push=function(t){this.empty()?(this.first=t,this.last=t):(this.nexts.set(this.last,t),this.prevs.set(t,this.last),this.last=t)},t.prototype.insertBefore=function(t,e){var n=this.before(e);this.prevs.set(t,n),this.nexts.set(t,e),this.prevs.set(e,t),n&&this.nexts.set(n,t),e===this.first&&(this.first=t)},t.prototype.delete=function(t){var e=this.before(t),n=this.after(t);e&&this.nexts.set(e,n),n&&this.prevs.set(n,e),t===this.first&&(this.first=n),t===this.last&&(this.last=e)},t.prototype.before=function(t){return this.prevs.get(t)||null},t.prototype.after=function(t){return this.nexts.get(t)||null},t.prototype.loop=function(t){if(!this.empty()){var e=this.first;do{if(t(e))break}while(e=this.after(e))}},t.prototype.copy=function(){var e=new t;return this.loop((function(t){return e.push(t),!1})),e},t.prototype.forEach=function(t){this.loop((function(e){return t(e),!1}))},t.prototype.find=function(t){var e=null;return this.loop((function(n){return!!t(n)&&(e=n,!0)})),e},t.prototype.map=function(t){var e=[];return this.loop((function(n){return e.push(t(n)),!1})),e},t}();function E(t,e,n){var r=t&&e&&t.matches(e);r&&t.parent()===e.parent()?n.replaceVNode(e,t):t&&n.addVNode(t);var o=n.getVNodeContext(t),i=n.getVNodeContext(e);if((e&&!r&&(e.detach(i),e.children().forEach((function(t){return E(null,t,n)})),e.detached(i)),t&&!r&&(t.attach(o),t.children().forEach((function(t){return E(t,null,n)})),t.attached(o)),r)&&t.update(e,o)!==n.LEAVE){var u=function(t,e){var n=e.children(),r=new Map,o=[];n.forEach((function(t){var e=t.key();null==e?o.push(t):r.set(e,t)}));var i=t.children(),u=[],s=new Set(n),a=new Set;return i.forEach((function(t){var e=null,n=null,i=t.key();if(null!=i){if(a.has(i))throw new Error("Duplicate key");a.add(i),r.has(i)&&(n=r.get(i))}else o.length>0&&(n=o.shift());t.matches(n)&&(e=n),u.push([t,e]),e&&s.delete(e)})),{matches:u,unmatched:s}}(t,e),s=u.matches;u.unmatched.forEach((function(t){return E(null,t,n)})),s.forEach((function(t){return E(t[0],t[1],n)})),t.updated(o)}}var w=function(t,e){return w=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n])},w(t,e)};function x(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Class extends value "+String(e)+" is not a constructor or null");function n(){this.constructor=t}w(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}function N(t,e,n){if(n||2===arguments.length)for(var r,o=0,i=e.length;o<i;o++)!r&&o in e||(r||(r=Array.prototype.slice.call(e,0,o)),r[o]=e[o]);return t.concat(r||Array.prototype.slice.call(e))}function b(t,e){for(var n=[],r=2;r<arguments.length;r++)n[r-2]=arguments[r];if(e=e||{},"string"==typeof t)return{type:t,props:e,children:n};if("function"==typeof t)return{type:t,props:e,children:n};throw new Error("Unsupported spec type")}function S(t){return a(t)&&null!=t.type&&null==t.nodeType}"function"==typeof SuppressedError&&SuppressedError;var A=function(){function t(t){this.parentVNode=t}return t.prototype.key=function(){return null},t.prototype.parent=function(t){if(!t)return this.parentVNode;this.parentVNode=t},t.prototype.children=function(){return[]},t.prototype.attach=function(t){},t.prototype.detach=function(t){},t.prototype.update=function(t,e){return null},t.prototype.attached=function(t){},t.prototype.detached=function(t){},t.prototype.updated=function(t){},t}();function C(t,e){return t instanceof Element&&(t.namespaceURI===o&&e.type===t.tagName.toLocaleLowerCase()||t.namespaceURI!==o&&e.type===t.tagName)}var k=new WeakMap;function D(t,e){var n;k.has(e)?n=k.get(e):(n=new WeakSet,k.set(e,n)),n.add(t)}function V(t,e){return k.has(e)&&k.get(e).has(t)}var M=function(t){function e(e,n){var r=t.call(this,n)||this;return r.spec=e,r}return x(e,t),e.prototype.matches=function(t){return t instanceof e&&this.spec.type===t.spec.type},e.prototype.key=function(){return this.spec.props.key},e.prototype.children=function(){return[this.child]},e.prototype.getExistingElement=function(t){var e,n=t.parent,r=t.node;if(C(r,this.spec))e=r;else if(!V(n,t.vdom)&&t.vdom.isDOMNodeCaptured(n)){var o=t.sibling,i=o?o.nextElementSibling:n.firstElementChild;i&&!t.vdom.isDOMNodeCaptured(i)&&(C(i,this.spec)?e=i:n.removeChild(i))}return e},e.prototype.attach=function(t){var e,n=this.getExistingElement(t);n?e=n:D(e=function(t,e){var n=u.apply({spec:t,parent:e});if(n)return n;var r=t.type;if("svg"===r)return document.createElementNS("http://www.w3.org/2000/svg","svg");var i=e.namespaceURI;return i===o||null==i?document.createElement(r):document.createElementNS(i,r)}(this.spec,t.parent),t.vdom),g(e,this.spec.props,null),this.child=_(e,this.spec.children,this,!1)},e.prototype.update=function(t,e){var n=e.vdom.getVNodeContext(t).node;g(n,this.spec.props,t.spec.props),this.child=_(n,this.spec.children,this,!1)},e.prototype.attached=function(t){var e=this.spec.props,n=e.oncreate,r=e.onrender;n&&n(t.node),r&&r(t.node)},e.prototype.detached=function(t){var e=this.spec.props.onremove;e&&e(t.node)},e.prototype.updated=function(t){var e=this.spec.props,n=e.onupdate,r=e.onrender;n&&n(t.node),r&&r(t.node)},e}(A),O={CREATED:Symbol(),REMOVED:Symbol(),UPDATED:Symbol(),RENDERED:Symbol(),ACTIVE:Symbol(),DEFAULTS_ASSIGNED:Symbol()},T=[[i,u],[d,v]],R=function(t){function e(e,n){var r=t.call(this,n)||this;return r.lock=!1,r.spec=e,r.prev=null,r.store={},r.store[O.ACTIVE]=r,r}return x(e,t),e.prototype.matches=function(t){return t instanceof e&&this.spec.type===t.spec.type},e.prototype.key=function(){return this.spec.props.key},e.prototype.children=function(){return[this.child]},e.prototype.createContext=function(t){var e=t.parent,n=this,r=n.spec,o=n.prev,i=n.store;return{spec:r,prev:o,store:i,get node(){return t.node},get nodes(){return t.nodes},parent:e,onCreate:function(t){return i[O.CREATED]=t},onUpdate:function(t){return i[O.UPDATED]=t},onRemove:function(t){return i[O.REMOVED]=t},onRender:function(t){return i[O.RENDERED]=t},refresh:function(){i[O.ACTIVE].refresh(t)},leave:function(){return t.vdom.LEAVE},getStore:function(t){return t&&!i[O.DEFAULTS_ASSIGNED]&&(Object.entries(t).forEach((function(t){var e=t[0],n=t[1];i[e]=n})),i[O.DEFAULTS_ASSIGNED]=!0),i}}},e.prototype.unbox=function(t){var n=this.spec.type,r=this.spec.props,o=this.spec.children;this.lock=!0;var i=e.context;e.context=this.createContext(t);var u=null;try{u=n.apply(void 0,N([r],o,!1))}finally{e.context=i,this.lock=!1}return u},e.prototype.refresh=function(t){if(this.lock)throw new Error("Calling refresh during unboxing causes infinite loop");this.prev=this.spec;var e=t.vdom.getVNodeContext(this),n=this.unbox(e);if(n!==t.vdom.LEAVE){var r=this.child;this.child=F(n,this),t.vdom.execute(this.child,r),this.updated(t)}},e.prototype.addPlugins=function(){n(this.spec.type,T,(function(t,e){return t.add(e)}))},e.prototype.deletePlugins=function(){n(this.spec.type,T,(function(t,e){return t.delete(e)}))},e.prototype.attach=function(t){this.addPlugins();var e=this.unbox(t),n=e===t.vdom.LEAVE?null:e;this.child=F(n,this)},e.prototype.update=function(t,e){this.store=t.store,this.prev=t.spec,this.store[O.ACTIVE]=this;var n=e.vdom.getVNodeContext(t);this.addPlugins();var r=this.unbox(n),o=null;return r===e.vdom.LEAVE?(o=r,this.child=t.child,e.vdom.adoptVNode(this.child,this)):this.child=F(r,this),o},e.prototype.handle=function(t,e){var n=this.store[t];if(n){var r=0===e.nodes.length?[null]:e.nodes;n.apply(void 0,r)}},e.prototype.attached=function(t){this.deletePlugins(),this.handle(O.CREATED,t),this.handle(O.RENDERED,t)},e.prototype.detached=function(t){this.handle(O.REMOVED,t)},e.prototype.updated=function(t){this.deletePlugins(),this.handle(O.UPDATED,t),this.handle(O.RENDERED,t)},e.context=null,e}(A);function L(){return R.context}var P=function(t){function e(e,n){var r=t.call(this,n)||this;return r.text=e,r}return x(e,t),e.prototype.matches=function(t){return t instanceof e},e.prototype.children=function(){return[this.child]},e.prototype.getExistingNode=function(t){var e,n=t.parent;if(t.node instanceof Text)e=t.node;else if(!V(n,t.vdom)&&t.vdom.isDOMNodeCaptured(n)){var r=t.sibling,o=r?r.nextSibling:n.firstChild;o&&!t.vdom.isDOMNodeCaptured(o)&&o instanceof Text&&(e=o)}return e},e.prototype.attach=function(t){var e,n=this.getExistingNode(t);n?(e=n).textContent=this.text:e=document.createTextNode(this.text),this.child=F(e,this)},e.prototype.update=function(t,e){var n=e.vdom.getVNodeContext(t).node;this.text!==t.text&&(n.textContent=this.text),this.child=F(n,this)},e}(A),W=function(t){function e(e,n){var r=t.call(this,n)||this;return r.fn=e,r}return x(e,t),e.prototype.matches=function(t){return t instanceof e},e.prototype.children=function(){return[this.child]},e.prototype.call=function(t){var e=(0,this.fn)({parent:t.parent,get node(){return t.node},get nodes(){return t.nodes}});this.child=F(e,this)},e.prototype.attach=function(t){this.call(t)},e.prototype.update=function(t,e){var n=e.vdom.getVNodeContext(t);this.call(n)},e}(A),U=function(t){function e(){return null!==t&&t.apply(this,arguments)||this}return x(e,t),e.prototype.matches=function(t){return t instanceof e},e}(A),j=function(t){function e(e,n,r,o){var i=t.call(this,r)||this;return i.node=e,i.childSpecs=n,i.isNative=o,i}return x(e,t),e.prototype.matches=function(t){return t instanceof e&&this.node===t.node},e.prototype.wrap=function(){var t=this;this.childVNodes=this.childSpecs.map((function(e){return F(e,t)}))},e.prototype.insertNode=function(t){var e=t.parent,n=t.sibling;if(!(e===this.node.parentElement&&n===this.node.previousSibling)){var r=n?n.nextSibling:e.firstChild;e.insertBefore(this.node,r)}},e.prototype.attach=function(t){this.wrap(),this.insertNode(t)},e.prototype.detach=function(t){t.parent.removeChild(this.node)},e.prototype.update=function(t,e){this.wrap(),this.insertNode(e)},e.prototype.cleanupDOMChildren=function(t){for(var e=this.node,n=e.lastChild;null!=n;)if(t.vdom.isDOMNodeCaptured(n))n=n.previousSibling;else{var r=n.previousSibling;e.removeChild(n),n=r}},e.prototype.refine=function(t){this.isNative||this.cleanupDOMChildren(t),D(this.node,t.vdom)},e.prototype.attached=function(t){var e=this.node;e instanceof Element&&!V(e,t.vdom)&&t.vdom.isDOMNodeCaptured(e)&&this.refine(t)},e.prototype.children=function(){return this.childVNodes},e}(A);function I(t){return t instanceof j}function _(t,e,n,r){return new j(t,e,n,r)}var B=function(t){function e(e,n,r){var o=t.call(this,r)||this;return o.items=e,o.id=n,o}return x(e,t),e.prototype.matches=function(t){return t instanceof e},e.prototype.key=function(){return this.id},e.prototype.children=function(){return this.childVNodes},e.prototype.wrap=function(){var t=this;this.childVNodes=this.items.map((function(e){return F(e,t)}))},e.prototype.attach=function(){this.wrap()},e.prototype.update=function(){this.wrap()},e}(A);function F(t,e){if(S(n=t)&&"string"==typeof n.type)return new M(t,e);var n;if(function(t){return S(t)&&"function"==typeof t.type}(t))return t.type===Array?new B(t.children,t.props.key,e):new R(t,e);if("string"==typeof t)return new P(t,e);if(null==t)return new U(e);if("function"==typeof t)return new W(t,e);if(t instanceof Node)return _(t,[],e,!0);if(Array.isArray(t))return new B(t,null,e);throw new Error("Unable to create virtual node for spec")}function G(t){var e=new WeakMap,n=new WeakMap,r=new WeakMap,o=new WeakMap,i=new WeakSet;function u(i){var u=r.get(i);e.set(i,{parent:u,get node(){var t=o.get(i).find((function(t){return null!=t.node}));return t?t.node:null},get nodes(){return o.get(i).map((function(t){return t.node})).filter((function(t){return t}))},get sibling(){if(u===t.parentElement)return o.get(i).first.node.previousSibling;for(var e=n.get(u),r=o.get(i).first;r=e.links.before(r);)if(r.node)return r.node;return null},vdom:c})}function s(e){null==e.parent()?function(e){var i=t.parentElement||document.createDocumentFragment(),u=new m({parentNode:i,node:t});o.set(e,u.copy()),r.set(e,i),n.set(i,{node:i,links:u})}(e):function(t){var e=t.parent(),u=i.has(e),s=I(e)?e.node:r.get(e);r.set(t,s);var a=new m;if(o.set(t,a),u){var c={parentNode:s,node:null},p=t;do{o.get(p).push(c),p=p.parent()}while(p&&!I(p));n.get(s).links.push(c)}else i.add(e),(I(e)?n.get(s).links:o.get(e)).forEach((function(t){return a.push(t)}))}(e),function(t){if(I(t)){var e=t.node;n.set(e,{node:e,links:new m({parentNode:e,node:null})}),o.get(t).forEach((function(t){return t.node=e}))}}(e),u(e)}function a(t){for(var e=r.get(t),i=n.get(e),u=[],s=t;(s=s.parent())&&!I(s);)u.push(o.get(s));return u.push(i.links),u}var c={execute:function(t,e){E(t,e,c)},addVNode:s,getVNodeContext:function(t){return e.get(t)},replaceVNode:function(t,n){if(null!=n.parent()){var i=e.get(t).parent;r.set(n,i);var c=o.get(t),p={parentNode:i,node:null};a(n).forEach((function(t){var e=t.after(c.last);c.forEach((function(e){return t.delete(e)})),e?t.insertBefore(p,e):t.push(p)}));var f=new m(p);o.set(n,f),u(n)}else s(n)},adoptVNode:function(t,e){var n=o.get(t),r=o.get(e).copy();t.parent(e),a(t).forEach((function(t){n.forEach((function(e){return t.insertBefore(e,r.first)})),r.forEach((function(e){return t.delete(e)}))}))},isDOMNodeCaptured:function(e){return n.has(e)&&e!==t.parentElement},LEAVE:Symbol()};return c}var q=new WeakMap,z=new WeakMap;function H(t,e){var n,r=q.get(t)||null;return q.set(t,e),z.has(t)?n=z.get(t):(n=G(t),z.set(t,n)),n.execute(e,r),n.getVNodeContext(e)}function J(t){return function(e){for(var n=[],r=1;r<arguments.length;r++)n[r-1]=arguments[r];var o=function(t){for(var e=[],n=1;n<arguments.length;n++)e[n-1]=arguments[n];var r=a(t)&&!S(t)?t:null;return{attrs:r,children:null==r?[t].concat(e):e}}(e,n),i=o.attrs,u=o.children;return b(t,i,u)}}var K=new Proxy({},{get:function(t,e){return J(e)}});function Q(t){if(t instanceof Text)return t.textContent.trim().replaceAll(/\r/g,"").replaceAll(/\s*?\n\s*/g,"\n");if(!(t instanceof Element))return null;for(var e=t.namespaceURI===o?t.tagName.toLocaleLowerCase():t.tagName,n={},r=0;r<t.attributes.length;r++){var i=t.attributes[r];n[i.name]=String(i.value)}var u=Array.from(t.childNodes).map(Q).filter((function(t){return null===t||"string"==typeof t&&""!==t||"object"==typeof t}));return b.apply(void 0,N([e,n],u,!1))}var X={createElement:r(i),setAttribute:r(d)};t.component=function(t){var e=function(e){for(var n=[],r=1;r<arguments.length;r++)n[r-1]=arguments[r];var o=L();return t.apply(void 0,N([o,e],n,!1))};return function(t){for(var n=[],r=1;r<arguments.length;r++)n[r-1]=arguments[r];return b.apply(void 0,N([e,t],n,!1))}},t.getContext=L,t.plugins=X,t.render=function(t,e){return H(t,_(t,Array.isArray(e)?e:[e],null,!1)),t},t.specFromNode=function(t){return Q(t)},t.sync=function(t,e){var n=H(t,F(e,null)).nodes;if(1!==n.length||n[0]!==t)throw new Error("Spec does not match the node");return n[0]},t.tag=J,t.tags=K,t.teardown=function(t){q.delete(t),z.delete(t)}}));