UNPKG

11.1 kBJavaScriptView Raw
1const e=(e=[])=>e[e.length-1],t=e=>e.nodeType===e.TEXT_NODE&&""===e.nodeValue.trim(),r=(e,n,i=!0)=>{if(e){if(!t(e)){let t=n(e);if(!1===t)return;if(t?.nodeName)return r(t,n,i)}i&&r(e.firstChild,n,i),r(e.nextSibling,n,i)}},n=(t,r)=>{let[i,a]=((t,r)=>{let i=((e="")=>e.split(/(\[[^\]]+\])/).filter((e=>e)).reduce(((e,t)=>e+("["===t.charAt(0)?"."+t.replace(/\./g,":"):t)),""))(t).split(".").map((e=>{if("["===e.charAt(0)){let t=e.slice(1,-1).replace(/:/g,".");return n(t,r)}return e}));return[i.slice(0,-1).reduce(((e,t)=>e&&e[t]),r)||r,e(i)]})(t,r),l=i?.[a];return"function"==typeof l?l.bind(i):l},i=e=>{if("string"==typeof e){let t=document.createElement("template");return t.innerHTML=e.trim(),t.content}return"TEMPLATE"===e.nodeName?e.cloneNode(!0).content:"defs"===e.nodeName?e.firstElementChild.cloneNode(!0):void 0},a=e=>null===e||"object"!=typeof e,l=e=>e.replace(/[\w]([A-Z])/g,(function(e){return e[0]+"-"+e[1].toLowerCase()})),c=(e,t,r)=>{t=l(t),"boolean"==typeof r&&(t.startsWith("aria-")?r=""+r:r&&(r="")),"string"==typeof r||"number"==typeof r?e.setAttribute(t,r):e.removeAttribute(t)},s=(e,t)=>{let r=e.replace(/[\w]-([\w])/g,(function(e){return e[0]+e[2].toUpperCase()}));return""===t&&(t=!0),e.startsWith("aria-")&&("true"===t&&(t=!0),"false"===t&&(t=!1)),{name:r,value:t}};const o=e=>{let t=0;return r(e.content?.firstChild||e.firstChild,(()=>t++),!1),t},u=e=>t(e.nextSibling)?u(e.nextSibling):e.nextSibling;const d=(e,t,r,n)=>{let i=e.getAttribute("length")||0,a=((e,t)=>{let r=o(e),n=[];if(t)for(;t--;){let t=document.createDocumentFragment(),i=r;for(;i--;)t.appendChild(u(e));n.push(t)}return n})(e,i),l=e;t.forEach(((e,t)=>{let i=-1===e?n(r[t][1],r[t][0]):a[e],c=(s=i).nodeType===s.DOCUMENT_FRAGMENT_NODE&&s.lastChild||s;var s;l.after(i),l=c})),e.setAttribute("length",t.length)},p=e=>e.trim().split(/({{[^{}]+}})/).filter((e=>e)).map((e=>{let t=e.match(/{{([^{}]+)}}/);if(!t)return{type:1,value:e,negated:!1};let r="!"===(e=t[1].trim()).charAt(0);return r&&(e=e.slice(1)),{type:2,value:e,negated:r}})),h=(e,t)=>t.reduce(((t,r)=>{let i,{type:a,value:l,negated:c}=r;if(1===a&&(i=l),2===a&&(i=n(l,e)),3===a){let t=r.args.map((t=>n(t,e)));i=n(r.method,e)?.(...t)}return c&&(i=!i),t||0===t?t+i:i}),""),f=e=>e.replace(/[\w]([A-Z])/g,(function(e){return e[0]+"-"+e[1].toLowerCase()})),m=e=>{let t=typeof e;return"string"===t?e.split(";").reduce(((e,t)=>{const[r,n]=t.split(":").map((e=>e.trim()));return r&&(e[r]=n),e}),{}):"object"===t?e:{}},b=(e,t,r)=>{if("style"===t)r=(e=>Object.entries(e).map((([e,t])=>`${e}: ${t};`)).join(" "))((l={...m(e.getAttribute("style")),...m(r)},Object.keys(l).reduce(((e,t)=>(e[f(t)]=l[t],e)),{})));else if("class"===t)switch(i=r,Object.prototype.toString.call(i).match(/\s(.+[^\]])/)[1]){case"Array":r=r.join(" ");break;case"Object":r=Object.keys(r).reduce(((e,t)=>(r[t]&&e.push(t),e)),[]).join(" ")}else if(!a(r))return e[(n=t,n.replace(/[\w]-([\w])/g,(function(e){return e[0]+e[2].toUpperCase()})))]=r;var n,i,l;t=f(t),"boolean"==typeof r&&(t.startsWith("aria-")?r=""+r:r&&(r=""));let c=e.getAttribute(t);r!==c&&("string"==typeof r||"number"==typeof r?e.setAttribute(t,r):e.removeAttribute(t))},y=(e=[])=>{let t=e;return{get:()=>t,push:e=>t.push(e),wrap:e=>t.reduce(((e,t)=>new Proxy(e,(({path:e,identifier:t,key:r,index:i,i:l,k:c})=>({get(a,s){let o=n(e,a);if(s===t)for(let e in o){let t=o[e];if(r){if(t[r]===c)return t}else if(e==l)return t}if(s===i)for(let e in o){let t=o[e];if(r){if(t[r]===c)return e}else if(e==l)return e}let u=r?o.find((e=>e[r]===c)):o[l];return u?.hasOwnProperty?.(s)?u[s]:Reflect.get(...arguments)},set(t,i,s){let o=n(e,t),u=r?o.find((e=>e[r]===c)):o[l];return u&&!a(u)?(u[i]=s,!0):Reflect.set(...arguments)}}))(t))),e)}},g=(t,{getState:a,dispatch:l},c,s,f)=>{const m={1:({value:e,node:t,context:r},{getState:n})=>({handler:()=>{let i=r?r.wrap(n()):n(),a=t.textContent,l=h(i,p(e));a!==l&&(t.textContent=l)}}),2:({value:e,node:t,name:r,context:i},{getState:a})=>({handler:()=>{let l=i?i.wrap(a()):a(),c=h(l,p(e));if(b(t,r,c),"OPTION"===t.nodeName){let e=t.parentNode.getAttribute("name"),r=n(e,l);t.selected=r===c}}}),3:({node:e,path:t,context:r},{getState:i,dispatch:a})=>(e.addEventListener("input",(()=>{let n="checkbox"===e.getAttribute("type")?e.checked:e.value;if(n.trim?.().length&&!isNaN(n)&&(n=+n),r){let e=r.wrap(i());e[t]=n,a({type:"MERGE",payload:e})}else a({type:"SET",payload:{name:t,value:n,context:r}})})),{handler:()=>{let a=r?r.wrap(i()):i();((e,t)=>{if("SELECT"===e.nodeName)return void Array.from(e.querySelectorAll("option")).forEach((e=>{e.selected=t.includes(e.value)}));let r;switch(e.getAttribute("type")){case"checkbox":if(r=t,e.checked===r)break;r?e.setAttribute("checked",""):e.removeAttribute("checked");break;case"radio":if(r=t===e.getAttribute("value"),e.checked===r)break;e.checked=r,r?e.setAttribute("checked",""):e.removeAttribute("checked");break;default:if(e.value===t)break;e.setAttribute("value",e.value=t||"")}})(e,n(t,a))}}),4:({node:e,eventType:t,actionType:r,context:n},{dispatch:i,getState:a})=>(e.addEventListener(t,(t=>{let l=r.startsWith("$"),c={type:r,event:t};l||(c.context=n?n.wrap(a()):a()),i(c),l&&e.dispatchEvent(new CustomEvent(r,{detail:c,bubbles:!0}))})),{handler:()=>{}}),5:({node:t,context:a,map:l,path:c,identifier:s,index:p,key:h,blockIndex:f,hydrate:m,pickupNode:b},{getState:g})=>{let E;t.$t=f-1;const A=(e,t,n,i)=>{r(e,k((e=>{if(e===i)return!1}),T(l,m,y((a?.get()||[]).concat({path:c,identifier:s,key:h,index:p,i:t,k:n}))),(e=>e.$t=f)))};const v=(e,r)=>{let n=e[h],a=i(t);var l;return A((l=a).nodeType===l.DOCUMENT_FRAGMENT_NODE&&l.firstChild||l,r,n),a};if(m){let r=n(c,g()),i=(e=>{let t=e.getAttribute("length"),r=o(e),n=[],i=e;if(t)for(;t--;){let e=[],t=r;for(;t--;)i=u(i),e.push(i);n.push(e)}return n})(t);i.forEach(((t,n)=>{let i=r[n]?.[h];A(t[0],n,i,e(t).nextSibling)})),b=e(e(i)).nextSibling}return{handler:()=>{let e=a?a.wrap(g()):g();const r=Object.entries(n(c,e)||[]),i=((e,t=[],r=[])=>{let n=r.map((([r,n])=>e?t.findIndex((([t,r])=>r[e]===n[e])):r in t?r:-1));if(t.length!==r.length||!n.every(((e,t)=>e===t)))return n})(h,E,r);i&&d(t,i,r,v),E=r.slice(0)},pickupNode:b}}},{bind:g,update:E}=(()=>{const e=(()=>{let e=new Set;return{publish:t=>{for(let t of e)t();t?.()},subscribe(t){e.add(t)}}})();return{bind(t){let r=m[t.type](t,{getState:a,dispatch:l});return e.subscribe(r.handler),r},update:t=>e.publish(t)}})();let A=0;const v=e=>{let t=0,n={};return r(e,(e=>{let r,i=[];switch(e.nodeType){case e.TEXT_NODE:{let t=e.textContent;t.match(/({{[^{}]+}})/)&&i.push({type:1,value:t});break}case e.ELEMENT_NODE:{let t=function(e){let t=e.getAttribute("each"),r=t?.match(/(.+)\s+in\s+(.+)/);if(!r)return t?{path:t.trim(),key:e.getAttribute("key")}:r;let[n,i,a]=r,l=i.match(/\(([^\)]+)\)/),[c,s]=(l?l[1].split(","):[i]).map((e=>e.trim()));return{path:a.trim(),identifier:s||c,index:s?c:s,key:e.getAttribute("key")}}(e);if(t){let n,a=e.namespaceURI;if(a.endsWith("/svg")){e.removeAttribute("each");let t=document.createElementNS(a,"defs");t.innerHTML=e.outerHTML,e.parentNode.replaceChild(t,e),n=v((e=t).firstChild)}else{if("TEMPLATE"!==e.nodeName){e.removeAttribute("each");let t=document.createElement("template");t.innerHTML=e.outerHTML,e.parentNode.replaceChild(t,e),e=t}n=v(e.content.firstChild)}r=e.nextSibling,i.push({type:5,map:n,blockIndex:A++,...t,pickupNode:r});break}let n=e.attributes,a=n.length;for(;a--;){let{name:t,value:r}=n[a];if(":name"!==t||!r||"INPUT"!==e.nodeName&&"SELECT"!==e.nodeName&&"TEXTAREA"!==e.nodeName){if(t.startsWith(":on")){e.removeAttribute(t);let n=t.split(":on")[1];i.push({type:4,eventType:n,actionType:r})}else if(t.startsWith(":")){let n=t.slice(1),a=r||n;a.includes("{{")||(a=`{{${a}}}`),i.push({type:2,name:n,value:a}),e.removeAttribute(t)}}else i.push({type:3,path:r}),e.removeAttribute(t),e.setAttribute("name",r)}}}return i.length&&(n[t]=i),t++,r})),n},k=(...e)=>(...t)=>{for(let r of e){if(!1===r(...t))return!1}},T=(e,t=0,r)=>{let n=0;return i=>{let a;return n in e&&(e[n].forEach((e=>{let n=g({...e,node:i,context:r,hydrate:t});a=n.pickupNode})),i.$i=n),n++,a}};let N=i(c),S=v(N);return t.hasAttribute?.("mosaic-hydrate")?r(t,T(S,1)):(r(N,T(S)),f?.(N),t.prepend(N),E(),t.setAttribute?.("mosaic-hydrate",1)),(e=>{let t=!1,r=!1;return()=>{t?r=!0:(t=!0,e(),requestAnimationFrame((()=>{r&&e(),t=!1})))}})((()=>E(s)))},E=e=>{let t=document.createDocumentFragment();for(;e.firstChild;)t.appendChild(e.firstChild);return t};function A(e){return e.querySelector('script[type="application/mosaic"]')}function v(e,t){(A(e)||function(e){let t=document.createElement("script");return t.setAttribute("type","application/mosaic"),e.append(t),t}(e)).innerText=JSON.stringify(t)}const k=(e,t,r)=>customElements.define(e,class extends HTMLElement{async connectedCallback(){if(!this.initialised){let n=t(this);n instanceof Promise&&(n=await n);let{update:i,middleware:o,derivations:u,subscribe:d,shadow:p,initialState:h={}}=n;this.connectedCallback=n.connectedCallback,this.disconnectedCallback=n.disconnectedCallback;const{dispatch:f,getState:m,onUpdate:b,flush:y}=function({update:e={},middleware:t=[],derivations:r={},initialState:n={}},i){let a,l=[],c=()=>{};function s(e){a={...e};for(let t in r)a[t]=r[t](e)}function o(){return{...a}}function u(e){l.push(e)}function d(r){const{type:n}=r;if("SET"===n||"MERGE"===n)s(function(e,t){switch(t.type){case"SET":{const{name:r,value:n}=t.payload;return{...e,[r]:n}}case"MERGE":return{...e,...t.payload}}}(o(),r));else if(t.length){let i=t.slice(),a=t=>{if(i.length){let e=i.shift();t.type in e?e[t.type](t,a,{getState:o,dispatch:d,afterNextRender:u}):a(t)}else t.type in e&&s(e[t.type](o(),t))},l=i.shift();n in l?l[n](r,a,{getState:o,dispatch:d,afterNextRender:u}):a(r)}else n in e&&s(e[n](o(),r));c()}s(n);for(let t in e)t.startsWith("$")&&i.addEventListener(t,(({detail:e})=>d(e)));return{dispatch:d,getState:o,onUpdate:function(e){c=e},flush:function(){l.forEach((e=>e())),l=[]}}}(n,this);f({type:"MERGE",payload:(e=this,JSON.parse(A(e)?.innerText||"{}"))}),h=m();let k,T=Object.keys(h).filter((e=>"$"===e.charAt(0))),N=T.map((e=>e.slice(1))).map(l),S=this.setAttribute;this.setAttribute=(e,t)=>{if(N.includes(e)){let{name:r,value:n}=s(e,t);f({type:"SET",payload:{name:"$"+r,value:n}})}S.apply(this,[e,t])},N.forEach((e=>{let t,r=s(e).name;t=this.hasAttribute(e)?this.getAttribute(e):this[r]||h["$"+r],Object.defineProperty(this,r,{get:()=>m()["$"+r],set(e){f({type:"SET",payload:{name:"$"+r,value:e}}),a(e)&&c(this,r,e)}}),this[r]=t})),p?this.attachShadow({mode:p}):k=e=>((e,t)=>{t.querySelectorAll("slot[name]").forEach((t=>{let r=t.attributes.name.value,n=e.querySelector(`[slot="${r}"]`);n?(n.removeAttribute("slot"),t.parentNode.replaceChild(n,t)):t.parentNode.replaceChild(E(t),t)}));let r=t.querySelector("slot:not([name])");r&&r.parentNode.replaceChild(E(e.innerHTML.trim()?e:r),r)})(this,e),b(g(this.shadowRoot||this,{getState:m,dispatch:f},r,(()=>{v(this,m()),T.forEach((e=>{let t=m()[e];a(t)&&c(this,e.slice(1),t)})),d?.(m()),y()}),k)),this.initialised=!0}var e;this.connectedCallback?.()}disconnectedCallback(){this.disconnectedCallback?.()}});export{k as define};