@dependable/view/dist/dependable-view-index.esm.min.js

View layer for @dependable/state

import{observable as t,computed as s,track as i,flush as n}from"@dependable/state";function h(t,s){this.t=t,this.i=s}function e(t,s){this.t=t,this.h=s}function r(t,s,i){this.o=t,this.u=s,this.h=i}const o=t=>Array.isArray(t),c=t=>o(t)?c(t[0]):t,u=t=>o(t)?t.flatMap(u):t.l(),f=t=>o(t)?t.flatMap(f):t&&t.p&&t.p(),l=t=>{o(t)?t.map(l):t&&t._()},p=(t,s)=>{o(s)?s.forEach((s=>{p(t,s)})):t.appendChild(s)},d=(t,s)=>{o(t)?t.forEach((t=>{d(t,s)})):s.parentNode.insertBefore(t,s)},a=t=>o(t)?t.map((t=>t.m)):t.m;class _{constructor({type:i,props:n,children:h},e){const r=i;this.j=i,this.v=t(n),this.k=t(h),this.B=(r.defaultProps||(()=>({})))(),this.C=s((()=>({...this.B,...this.v(),children:this.k()})));const o=this.C(),c=new r(o,e.O);this.S=c,this.H=this.H.bind(this),this.$=!1,this.A=new Set,c.context=e.O,c.props=o,c.didCatch&&(c.didCatch=c.didCatch.bind(c)),this.D={...e,M:e.M+1,N:c.didCatch||e.N}}get m(){return a(this.P)}T(t){(function(t,s){const i=Object.keys(t),n=Object.keys(s);if(i.length!==n.length)return!1;for(let n=0;n<i.length;n++){const h=i[n];if(s[h]!==t[h])return!1}return!0})(this.v(),t.props)||this.v(t.props),this.k()!==t.children&&this.k(t.children)}V(){try{let t;const s=this.C();this.S.props=s;const n=i((()=>{t=this.S.render(s,this.D.O)}));for(const t of this.A)n.has(t)||t.unsubscribe(this.H);for(const t of n)t.subscribe(this.H,this.D.M);return this.A=n,t}catch(t){this.D.N(t)}}H(){if(this.$){const t=this.S;try{this.P=q(this.V(),this.P,this.D),t.didUpdate&&t.didUpdate(),t.didRender&&t.didRender()}catch(t){this.D.N(t)}}}l(){try{const t=this.S;t.willMount&&(t.willMount(),n()),this.C.subscribe(this.H,this.D.M),this.P=M(this.V(),this.D);return u(this.P)}catch(t){return this.D.N(t),this.P=new S,u(this.P)}}q(t){c(this.P).q(t)}_(){const t=this.S;this.C.unsubscribe(this.H);for(const t of this.A)t.unsubscribe(this.H);try{t.willUnmount&&t.willUnmount()}catch(t){this.D.N(t)}l(this.P),this.$=!1}p(){try{f(this.P),this.$=!0,this.S.didMount&&this.S.didMount(),this.S.didRender&&this.S.didRender()}catch(t){this.D.N(t)}}}const y=t=>t.slice(1),m=(t,s,i)=>{if("string"==typeof s)t.cssText=s;else{const n="string"==typeof i,h=!n&&i;n&&(t.cssText="");for(const n in s)h&&s[n]===i[n]||t.setProperty(n,s[n])}},w=/Capture$/,g=/^on/,x=t=>w.test(t),b=t=>g.test(t),j=t=>{const s=t.replace(g,"").replace(w,""),i=s.toLowerCase();return`on${i}`in document?i:s},v=t=>"className"===t?"class":t,k=(t,s,i)=>{i&&t.addEventListener(j(s),i,x(s))},B=(t,s,i)=>{t.removeEventListener(j(s),i,x(s))};class C{constructor({type:t,props:s,children:i},n){this.j=t,this.v=s,this.D="svg"===t?{...n,F:!0}:n,this.k=i&&M(i,this.D)}T(t){const s=t.props;for(const t in this.v)if("key"!==t&&"ref"!==t&&!(t in s)){const s=this.v[t];b(t)?B(this.m,t,s):"."!==t[0]&&("style"===t&&(this.m.style.cssText=""),this.m.removeAttribute(v(t)))}for(const t in s){const i=this.v[t],n=s[t];"key"!==t&&"ref"!==t&&i!==n&&(b(t)?(B(this.m,t,i),k(this.m,t,n)):"."===t[0]?this.m[y(t)]=n:"style"===t?m(this.m.style,n,i):!0===n?this.m.setAttribute(v(t),""):n?this.m.setAttribute(v(t),n):this.m.removeAttribute(v(t)))}s.ref&&this.v.ref!==s.ref&&s.ref(this.m),this.v=s;const i=t.children;this.k!==i&&(null===i?(l(this.k),this.k=i):null===this.k?(this.k=M(i,this.D),p(this.m,u(this.k)),f(this.k)):this.k=q(i,this.k,this.D))}l(){this.D.F?this.m=document.createElementNS("http://www.w3.org/2000/svg",this.j):this.m=document.createElement(this.j);for(const t in this.v)if("key"!==t&&"ref"!==t){const s=this.v[t];b(t)?k(this.m,t,s):"."===t[0]?this.m[y(t)]=s:"style"===t?m(this.m.style,s):!0===s?this.m.setAttribute(v(t),""):s&&this.m.setAttribute(v(t),s)}return this.k&&p(this.m,u(this.k)),this.v.ref&&this.v.ref(this.m),this.m}q(t){d(t,this.m)}_(){l(this.k),this.m.remove()}p(){f(this.k)}}class O{constructor(t){this.j="text",this.G=t}l(){return this.m=document.createTextNode(this.G),this.m}I(t){this.G!==t&&(this.m.textContent=t,this.G=t)}q(t){d(t,this.m)}_(){this.m.remove()}}class S{constructor(){this.j="hidden"}l(){return this.m=document.createComment("hidden"),this.m}q(t){d(t,this.m)}_(){this.m.remove()}}class H{render({children:t}){return t}}class $ extends _{constructor({type:t,props:s,children:i},n){super({type:H,props:s,children:i},{...n,O:Object.freeze({...n.O,...s})}),this.j=t}}class A extends S{constructor({type:t,props:{target:s=document.body}={},children:i},n){super(),this.j=t,this.D=n,this.k=i&&M(i,n),this.J=s}T(t){const s=t.props.target||document.body;this.J!==s&&(this.J=s,p(s,a(this.k))),this.k=q(t.children,this.k,this.D)}l(){return this.k&&(p(this.J,u(this.k)),f(this.k)),super.l()}_(){l(this.k),super._()}p(){f(this.k)}}const D=t=>null==t||!1===t||o(t)&&!t.length,M=(t,s)=>{if(D(t))return new S;if(o(t))return t.map((t=>M(t,s)));if("function"==typeof t.type)try{return new _(t,s)}catch(t){return s.N(t),new S}return"object"==typeof t?"Context"===t.type?new $(t,s):"Portal"===t.type?new A(t,s):new C(t,s):new O(String(t))},N=t=>t&&("function"==typeof t?t().key:t.key),P=t=>t&&void 0!==N(t.props||t.v),T=(t,s)=>t.j===s.type&&N(t.v)===N(s.props),V=(t,s,i)=>{const n=new Map;t.forEach((t=>{n.set(N(t.props),t)})),s.forEach(((t,s)=>{const h=N(t.v);if(n.has(h)){const s=n.get(h);q(s,t,i)}}));const o=function(t,s,i){const n=t.length,o=s.length,c=[],u={},f={};for(let h=0;h<n;h++){const e=t[h];for(let l=0;l<o;l++){if(f[l])continue;if(!i(e,s[l]))continue;const p=h,d=l;let a=0;do{u[h++]=f[l++]=!0,a++}while(h<n&&l<o&&i(t[h],s[l])&&!f[l]);c.push(new r(p,d,a)),h--;break}}const l=[];for(let t=0;t<n;){if(u[t]){t++;continue}const s=t;let i=0;for(;t<n&&!u[t++];)i++;l.push(new e(s,i))}const p=[];for(let t=0;t<o;){if(f[t]){t++;continue}const i=t;let n=0;for(;t<o&&!f[t++];)n++;const e=s.slice(i,i+n);p.push(new h(i,e))}const d=p.length,a=l.length,_=c.length;let y,m,w=0;for(y=0;y<a;y++){const t=l[y];for(t.t-=w,w+=t.h,m=0;m<_;m++){const s=c[m];s.o>=t.t&&(s.o-=t.h)}}for(y=d;y--;){const t=p[y],s=t.i.length;for(m=_;m--;){const i=c[m];i.u>=t.t&&(i.u-=s)}}for(y=_;y-- >1;){const t=c[y];if(t.u!==t.o)for(m=y;m--;){const s=c[m];s.u>=t.u&&(s.u-=t.h),s.u>=t.o&&(s.u+=t.h)}}const g=[];for(y=0;y<_;y++){const t=c[y];if(t.u!==t.o)for(g.push(t),m=y+1;m<_;m++){const s=c[m];s.o>=t.o&&(s.o-=t.h),s.o>=t.u&&(s.o+=t.h)}}return l.concat(g,p)}(s,t,T),d=c(s[0].m).parentNode,a=(t,s)=>{s?s.q(t):p(d,t)};return o.length?(o.forEach((t=>{if(t instanceof h){const n=s[t.t],h=t.i.map((t=>M(t,i))),e=u(h);a(e,n),s.splice(t.t,0,...h),f(h)}else if(t instanceof e){const i=s.splice(t.t,t.h);l(i)}else if(t instanceof r){const i=s[t.u],n=s.splice(t.o,t.h),h=n.map((t=>t.m));a(h,i),s.splice(t.u,0,...n)}})),s):s},q=(t,s,i)=>{if("hidden"===s.j&&D(t))return s;if("text"===s.j&&("string"==typeof t||"number"==typeof t))return s.I(t),s;if(t&&t.type&&t.type===s.j)return s.T(t),s;if(o(t)&&t.length&&o(s))return((t,s,i)=>{if(P(t[0])&&P(s[0]))return V(t,s,i);if(t.length&&t.length===s.length){for(let n=0;n<t.length;n++)s[n]=q(t[n],s[n],i);return s}const n=M(t,i);return c(s).q(u(n)),l(s),f(n),n})(t,s,i);const n=M(t,i);return c(s).q(u(n)),l(s),f(n),n},z=t=>{throw t},E=(t,s=document.body,i={})=>{s._?.(),(t=>{for(;t.firstChild;)t.removeChild(t.firstChild)})(s);const n=M(t,{O:Object.freeze(i),N:z,F:!1,M:0});p(s,u(n)),f(n),s._=()=>l(n)},F=(t,s)=>({type:t.type,props:{...t.props,...s?.props},children:s?.children||t.children}),G=(t,s,...i)=>({type:t,props:s||{},children:i.length?i.flat():null});export{F as clone,G as h,E as render};