UNPKG

mettle

Version:

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

7 lines (6 loc) 6.71 kB
/*! * Mettle.js v1.1.2 * (c) 2021-2025 maomincoding * Released under the MIT License. */ function e(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 t=e("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"),n={svg:"http://www.w3.org/2000/svg",math:"http://www.w3.org/1998/Math/MathML"};const o=Object.prototype.hasOwnProperty,i=(e,t)=>o.call(e,t),l=e=>null!==e&&"object"==typeof e,r=e=>null==e,s=(e,t)=>e.tag===t.tag&&e.key===t.key,c=e=>null!=e&&"object"==typeof e&&"tag"in e,f=e=>!c(e)&&!Array.isArray(e);function a(e){console.warn(`[Mettle.js warn]: ${e}`)}function u(e,t){Object.assign(e.style,t)}function p(e,t,n){if("function"!=typeof n)return;const o=t.slice(2).toLowerCase();e.addEventListener(o,n)}function h(e,t,n){if("function"!=typeof n)return;const o=t.slice(2).toLowerCase();e.removeEventListener(o,n)}const m="http://www.w3.org/1999/xlink",d=new Set(["checked","disabled","readonly","selected","multiple","hidden"]);function g(e,t,n){d.has(t)?n?e.setAttribute(t,""):e.removeAttribute(t):t.startsWith("xlink:")?e.setAttributeNS(m,t,n):e.setAttribute(t,n)}function y(e,t){t.startsWith("xlink:")?e.removeAttributeNS(m,t):e.removeAttribute(t)}const b=document.createElement.bind(document),w=document.createDocumentFragment.bind(document),v=document.createComment.bind(document);function k(e){return"fragment"===e?w():"comment"===e||"null"===e?v(""):t(e)?(o=function(e){return t(e)?"svg":"math"===e?"math":void 0}(e),i=e,document.createElementNS(n[o],i)):b(e);var o,i}function A(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],i=n[e];c(t)&&(t.el=i.el,A(i,t))}else l(o)&&(o.el=n.el)}const M="1.1.2",S=e("$ref,$once,$memo");let j=new WeakMap;const C=new WeakMap;function L(e,t){t.textContent=e}function x(e,t,n){const{tag:o,props:i,children:s}=e;if(!r(o))if("string"==typeof o){const a=k(o);if(e.el=a,!r(i)){const e=Object.keys(i);for(let t=0;t<e.length;t++){const n=e[t],o=i[n],r=l(o);n.startsWith("on")&&p(a,n,o),"function"==typeof o||"key"===n||S(n)||g(a,n,o),"style"===n&&r&&u(a,o),"$ref"===n&&r&&C.set(o,a)}}if(!r(s))if(f(s))a&&L(s,a);else{const e=l(s);if(Array.isArray(s))for(let e=0;e<s.length;e++){const t=s[e];c(t)&&x(t,a)}else e&&x(s,a)}if(n)t.insertBefore(a,n);else{if(!t)return a;t.appendChild(a)}}else if("function"==typeof o){const e={content:o,setData:$.bind(o),props:i},n=o.call(o,e);o.template=n;const l=n();x(l,t),j.set(o,l)}}function O(e,t,n){const o=e.props;if((!o||!i(o,"$once"))&&((e,t)=>"function"!=typeof e.tag&&"function"!=typeof t.tag)(e,t))if(s(e,t)){const a=t.el=e.el,m=e.props||{},d=t.props||{},b={},w=Object.keys(d),v=Object.keys(m),k=new Set(w);for(let e=0;e<w.length;e++)b[w[e]]=!0;for(let e=0;e<v.length;e++)b[v[e]]=!0;const M=Object.keys(b);for(let e=0;e<M.length;e++){const t=M[e],n=d[t],o=m[t];if(n===o)continue;if(r(n)){y(a,t);continue}const i=l(n),s="function"==typeof n,c="style"===t;if(s){n.toString()!==o.toString()&&(h(a,t,o),p(a,t,n));continue}if(c&&i){u(a,n);continue}"key"!==t&&!S(t)&&!s&&g(a,t,n)}for(let e=0;e<v.length;e++){const t=v[e];k.has(t)||y(a,t)}if(null!=o&&i(o,"$memo")){const i=o.$memo;if(i[1]===n&&!i[0])return void(i[2]&&A(e,t))}const j=e.children,C=t.children;Array.isArray(j)&&Array.isArray(C)?function(e,t,n,o){const i=t.length;let l=0,r=e.length-1,c=i-1;for(;l<=r&&l<=c&&s(e[l],t[l]);)O(e[l],t[l],o),l++;for(;l<=r&&l<=c&&s(e[r],t[c]);)O(e[r],t[c],o),r--,c--;if(l>r){if(l<=c){const e=c+1,o=e<i?t[e].el:null;for(;l<=c;)n.insertBefore(x(t[l]),o),l++}}else if(l>c)for(;l<=r;)n.removeChild(e[l].el),l++;else{const f=l,a=l,u=new Map;for(l=a;l<=c;l++){const e=t[l];null!=e.key&&u.set(e.key,l)}let p,h=0;const m=c-a+1;let d=!1,g=0;const y=new Array(m);for(l=0;l<m;l++)y[l]=0;for(let i=f;i<=r;i++){if(h>=m){n.removeChild(e[i].el);continue}let l;if(null!==e[i].key)l=u.get(e[i].key);else for(p=a;p<=c;p++)if(0===y[p-a]&&s(e[i],t[p])){l=p;break}void 0===l?n.removeChild(e[i].el):(y[l-a]=i+1,l>g?g=l:d=!0,O(e[i],t[l],o),h++)}const b=d?function(e){const t=e.slice(),n=[0];let o,i,l,r,s;const c=e.length;for(o=0;o<c;o++){const c=e[o];if(0!==c){if(i=n[n.length-1],e[i]<c){t[o]=i,n.push(o);continue}for(l=0,r=n.length-1;l<r;)s=(l+r)/2|0,e[n[s]]<c?l=s+1:r=s;c<e[n[l]]&&(l>0&&(t[o]=n[l-1]),n[l]=o)}}for(l=n.length,r=n[l-1];l-- >0;)n[l]=r,r=t[r];return n}(y):[];p=b.length-1;for(let e=m-1;e>=0;e--){const o=e+a,l=o+1<i?t[o+1].el:null;0===y[e]?n.insertBefore(x(t[o]),l):d&&(p<0||e!==b[p]?n.insertBefore(t[o].el,l):p--)}}}(j,C,a,n):c(j)&&c(C)?O(j,C,n):f(j)&&f(C)&&j!==C&&L(C,a)}else{const n=e.el.parentNode,o=e.el.nextSibling;n.removeChild(e.el),x(t,n,o)}}async function $(e,t){try{await Promise.resolve();const n=e||this,o=j.get(n),i=n.template();O(o,i,t),j.set(n,i)}catch(e){a(e)}}function E(e,t){const n=e.tag,o={content:n,setData:$.bind(n),props:e.props},i=n.call(n,o);n.template=i;const l=i(),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))):a(`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?(a('mounting on a ShadowRoot with `{mode: "closed"}` may lead to unpredictable bugs.'),null):null}(t);x(l,r),j.set(n,l),P=r,N()}let T=[],W=0,D=0;function B(e=null){null!==e&&("function"==typeof e?T.push(e):a("The parameter of onMounted is not a function!"))}function N(){if(T.length>0)for(let e=0,t=T.length;e<t;e++)T[e]&&T[e]();D=W,W=0,T=[]}let F=[];function G(e=null){null!==e&&("function"==typeof e?(W+=1,F.push(e)):a("The parameter of onUnmounted is not a function!"))}let P=Object.create(null);function R(e){!function(){if(F.length>0){for(let e=0;e<D;e++)F[e]&&F[e]();F.splice(0,D)}D=W}(),P.innerHTML="",j=null,j=new WeakMap;const t={content:e,setData:$.bind(e)},n=e.call(e,t);e.template=n;const o=n();x(o,P),j.set(e,o),N()}export{E as createApp,C as domInfo,B as onMounted,G as onUnmounted,R as resetView,$ as setData,M as version};