UNPKG

mettle

Version:

A approachable, fast, flexible and lightweight JavaScript library for building user interfaces.

7 lines (6 loc) 8.39 kB
/*! * Mettle.js v1.1.2 * (c) 2021-2025 maomincoding * Released under the MIT License. */ !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).Mettle={})}(this,(function(e){"use strict";const t=(e,n,o,l)=>{let i;n[0]=0;for(let r=1;r<n.length;r++){const s=n[r++],c=n[r]?(n[0]|=s?1:2,o[n[r++]]):n[++r];3===s?l[0]=c:4===s?l[1]=Object.assign(l[1]||{},c):5===s?(l[1]=l[1]||{})[n[++r]]=c:6===s?l[1][n[++r]]+=c+"":s?(i=e.apply(c,t(e,c,o,["",null])),l.push(i),c[0]?n[0]|=2:(n[r-2]=0,n[r]=i)):l.push(c)}return l},n=new Map,o=function(e){let o=n.get(this);return o||(o=new Map,n.set(this,o)),o=t(this,o.get(e)||(o.set(e,o=function(e){let t,n,o=1,l="",i="",r=[0];const s=e=>{1===o&&(e||(l=l.replace(/^\s*\n\s*|\s*\n\s*$/g,"")))?r.push(0,e,l):3===o&&(e||l)?(r.push(3,e,l),o=2):2===o&&"..."===l&&e?r.push(4,e,0):2===o&&l&&!e?r.push(5,0,!0,l):o>=5&&((l||!e&&5===o)&&(r.push(o,0,l,n),o=6),e&&(r.push(o,e,0,n),o=6)),l=""};for(let c=0;c<e.length;c++){c&&(1===o&&s(),s(c));for(let f=0;f<e[c].length;f++)t=e[c][f],1===o?"<"===t?(s(),r=[r],o=3):l+=t:4===o?"--"===l&&">"===t?(o=1,l=""):l=t+l[0]:i?t===i?i="":l+=t:'"'===t||"'"===t?i=t:">"===t?(s(),o=1):o&&("="===t?(o=5,n=l,l=""):"/"===t&&(o<5||">"===e[c][f+1])?(s(),3===o&&(r=r[0]),o=r,(r=r[0]).push(2,0,o),o=0):" "===t||"\t"===t||"\n"===t||"\r"===t?(s(),o=2):l+=t),3===o&&"!--"===l&&(o=4,r=r[0])}return s(),r}(e)),o),arguments,[]),o.length>1?o:o[0]}.bind((function(e,t,n){let o=null,l=null,i=null;for(l in t)"key"===l&&(o=t[l]);return arguments.length>2&&(i=arguments.length>3?Array.prototype.slice.call(arguments,2):n),{tag:e,props:t,children:i,key:o,el:null}}));function l(e){const t=Object.create(null),n=e.split(",");for(let e=0;e<n.length;e++)t[n[e]]=!0;return function(e){return t[e]}}const i=l("svg,animate,circle,clippath,cursor,image,defs,desc,ellipse,filter,font-face,foreignobject,g,glyph,line,marker,mask,missing-glyph,path,pattern,polygon,polyline,rect,switch,symbol,text,textpath,tspan,use,view,feBlend,feColorMatrix,feComponentTransfer,feComposite,feConvolveMatrix,feDiffuseLighting,feDisplacementMap,feFlood,feGaussianBlur,feImage,feMerge,feMorphology,feOffset,feSpecularLighting,feTile,feTurbulence,feDistantLight,fePointLight,feSpotLight,linearGradient,stop,radialGradient,animateTransform,animateMotion"),r={svg:"http://www.w3.org/2000/svg",math:"http://www.w3.org/1998/Math/MathML"};const s=Object.prototype.hasOwnProperty,c=(e,t)=>s.call(e,t),f=e=>null!==e&&"object"==typeof e,u=e=>null==e,a=(e,t)=>e.tag===t.tag&&e.key===t.key,p=e=>null!=e&&"object"==typeof e&&"tag"in e,h=e=>!p(e)&&!Array.isArray(e);function d(e){console.warn(`[Mettle.js warn]: ${e}`)}function g(e,t){Object.assign(e.style,t)}function m(e,t,n){if("function"!=typeof n)return;const o=t.slice(2).toLowerCase();e.addEventListener(o,n)}function y(e,t,n){if("function"!=typeof n)return;const o=t.slice(2).toLowerCase();e.removeEventListener(o,n)}const b="http://www.w3.org/1999/xlink",w=new Set(["checked","disabled","readonly","selected","multiple","hidden"]);function v(e,t,n){w.has(t)?n?e.setAttribute(t,""):e.removeAttribute(t):t.startsWith("xlink:")?e.setAttributeNS(b,t,n):e.setAttribute(t,n)}function k(e,t){t.startsWith("xlink:")?e.removeAttributeNS(b,t):e.removeAttribute(t)}const A=document.createElement.bind(document),M=document.createDocumentFragment.bind(document),j=document.createComment.bind(document);function S(e){return"fragment"===e?M():"comment"===e||"null"===e?j(""):i(e)?(t=function(e){return i(e)?"svg":"math"===e?"math":void 0}(e),n=e,document.createElementNS(r[t],n)):A(e);var t,n}function C(e,t){const n=e.children,o=t.children;if(Array.isArray(o))for(let e=0;e<o.length;e++){const t=o[e],l=n[e];p(t)&&(t.el=l.el,C(l,t))}else f(o)&&(o.el=n.el)}const x=l("$ref,$once,$memo");let L=new WeakMap;const O=new WeakMap;function T(e,t){t.textContent=e}function $(e,t,n){const{tag:o,props:l,children:i}=e;if(!u(o))if("string"==typeof o){const r=S(o);if(e.el=r,!u(l)){const e=Object.keys(l);for(let t=0;t<e.length;t++){const n=e[t],o=l[n],i=f(o);n.startsWith("on")&&m(r,n,o),"function"==typeof o||"key"===n||x(n)||v(r,n,o),"style"===n&&i&&g(r,o),"$ref"===n&&i&&O.set(o,r)}}if(!u(i))if(h(i))r&&T(i,r);else{const e=f(i);if(Array.isArray(i))for(let e=0;e<i.length;e++){const t=i[e];p(t)&&$(t,r)}else e&&$(i,r)}if(n)t.insertBefore(r,n);else{if(!t)return r;t.appendChild(r)}}else if("function"==typeof o){const e={content:o,setData:E.bind(o),props:l},n=o.call(o,e);o.template=n;const i=n();$(i,t),L.set(o,i)}}function D(e,t,n){const o=e.props;if((!o||!c(o,"$once"))&&((e,t)=>"function"!=typeof e.tag&&"function"!=typeof t.tag)(e,t))if(a(e,t)){const l=t.el=e.el,i=e.props||{},r=t.props||{},s={},d=Object.keys(r),b=Object.keys(i),w=new Set(d);for(let e=0;e<d.length;e++)s[d[e]]=!0;for(let e=0;e<b.length;e++)s[b[e]]=!0;const A=Object.keys(s);for(let e=0;e<A.length;e++){const t=A[e],n=r[t],o=i[t];if(n===o)continue;if(u(n)){k(l,t);continue}const s=f(n),c="function"==typeof n,a="style"===t;if(c){n.toString()!==o.toString()&&(y(l,t,o),m(l,t,n));continue}if(a&&s){g(l,n);continue}"key"!==t&&!x(t)&&!c&&v(l,t,n)}for(let e=0;e<b.length;e++){const t=b[e];w.has(t)||k(l,t)}if(null!=o&&c(o,"$memo")){const l=o.$memo;if(l[1]===n&&!l[0])return void(l[2]&&C(e,t))}const M=e.children,j=t.children;Array.isArray(M)&&Array.isArray(j)?function(e,t,n,o){const l=t.length;let i=0,r=e.length-1,s=l-1;for(;i<=r&&i<=s&&a(e[i],t[i]);)D(e[i],t[i],o),i++;for(;i<=r&&i<=s&&a(e[r],t[s]);)D(e[r],t[s],o),r--,s--;if(i>r){if(i<=s){const e=s+1,o=e<l?t[e].el:null;for(;i<=s;)n.insertBefore($(t[i]),o),i++}}else if(i>s)for(;i<=r;)n.removeChild(e[i].el),i++;else{const c=i,f=i,u=new Map;for(i=f;i<=s;i++){const e=t[i];null!=e.key&&u.set(e.key,i)}let p,h=0;const d=s-f+1;let g=!1,m=0;const y=new Array(d);for(i=0;i<d;i++)y[i]=0;for(let l=c;l<=r;l++){if(h>=d){n.removeChild(e[l].el);continue}let i;if(null!==e[l].key)i=u.get(e[l].key);else for(p=f;p<=s;p++)if(0===y[p-f]&&a(e[l],t[p])){i=p;break}void 0===i?n.removeChild(e[l].el):(y[i-f]=l+1,i>m?m=i:g=!0,D(e[l],t[i],o),h++)}const b=g?function(e){const t=e.slice(),n=[0];let o,l,i,r,s;const c=e.length;for(o=0;o<c;o++){const c=e[o];if(0!==c){if(l=n[n.length-1],e[l]<c){t[o]=l,n.push(o);continue}for(i=0,r=n.length-1;i<r;)s=(i+r)/2|0,e[n[s]]<c?i=s+1:r=s;c<e[n[i]]&&(i>0&&(t[o]=n[i-1]),n[i]=o)}}for(i=n.length,r=n[i-1];i-- >0;)n[i]=r,r=t[r];return n}(y):[];p=b.length-1;for(let e=d-1;e>=0;e--){const o=e+f,i=o+1<l?t[o+1].el:null;0===y[e]?n.insertBefore($(t[o]),i):g&&(p<0||e!==b[p]?n.insertBefore(t[o].el,i):p--)}}}(M,j,l,n):p(M)&&p(j)?D(M,j,n):h(M)&&h(j)&&M!==j&&T(j,l)}else{const n=e.el.parentNode,o=e.el.nextSibling;n.removeChild(e.el),$(t,n,o)}}async function E(e,t){try{await Promise.resolve();const n=e||this,o=L.get(n),l=n.template();D(o,l,t),L.set(n,l)}catch(e){d(e)}}let W=[],B=0,N=0;function P(){if(W.length>0)for(let e=0,t=W.length;e<t;e++)W[e]&&W[e]();N=B,B=0,W=[]}let F=[];let G=Object.create(null);e.createApp=function(e,t){const n=e.tag,o={content:n,setData:E.bind(n),props:e.props},l=n.call(n,o);n.template=l;const i=l(),r=function(e){if("string"==typeof e){const t=document.querySelector(e);if(!t){let t=null;return e.startsWith("#")?(t=document.createElement("div"),t.setAttribute("id",e.substring(1,e.length))):e.startsWith(".")?(t=document.createElement("div"),t.setAttribute("class",e.substring(1,e.length))):d(`Failed to mount app: mount target selector "${e}" returned null.`),document.body.insertAdjacentElement("afterbegin",t),t}return t}return e instanceof HTMLElement?e:window.ShadowRoot&&e instanceof window.ShadowRoot&&"closed"===e.mode?(d('mounting on a ShadowRoot with `{mode: "closed"}` may lead to unpredictable bugs.'),null):null}(t);$(i,r),L.set(n,i),G=r,P()},e.domInfo=O,e.html=o,e.onMounted=function(e=null){null!==e&&("function"==typeof e?W.push(e):d("The parameter of onMounted is not a function!"))},e.onUnmounted=function(e=null){null!==e&&("function"==typeof e?(B+=1,F.push(e)):d("The parameter of onUnmounted is not a function!"))},e.resetView=function(e){!function(){if(F.length>0){for(let e=0;e<N;e++)F[e]&&F[e]();F.splice(0,N)}N=B}(),G.innerHTML="",L=null,L=new WeakMap;const t={content:e,setData:E.bind(e)},n=e.call(e,t);e.template=n;const o=n();$(o,G),L.set(e,o),P()},e.setData=E,e.version="1.1.2",Object.defineProperty(e,"__esModule",{value:!0})}));