UNPKG

fundom.js

Version:

JS library for creating reactive ui elements in declarative way

2 lines (1 loc) 7.32 kB
var FD=function(e){"use strict";const t=Symbol("fnType"),n=Symbol("format"),s=Symbol("compute"),r=Symbol("stateGetter"),o=Symbol("caseHandler"),l=(e,t,n,s,r)=>{if(0!==t.length)for(let o of t)o(e,n,s,r)},i=e=>({childrenLength:e.children.length,innerHTML:e.innerHTML,innerText:e.innerText,textContent:e.textContent||"",style:e.style,attributes:e.attributes,classList:e.classList}),a=(e,t,n)=>{h(e,t)||(n?e.insertBefore(t,n.nextSibling):e.appendChild(t))},c=e=>d(e)&&e[t]===r,f=e=>d(e)&&e[t]===n,u=e=>d(e)&&e[t]===s,m=(e,t,n)=>{if(u(e))e(t);else if(f(e))e(t);else if(c(e)){const s=e((e=>t(e)),{releaseEffect:()=>(e=>{e&&(e.snapshot=null)})(n)});t(s)}else t(e)},g=(e,t)=>{const n=((e="")=>Math.random().toString(36).replace("0.",e))("ctrlFlow_"),s=document.createComment("");let r=[],o=[];return(c,f,u,g)=>{if(!w(c))return console.warn(new y("ifElse/ifOnly/match").message),c;return n in f||(f[n]=((e,t)=>({snapshot:i(e),comment:t}))(c,s),a(c,s,f[u]?.comment)),m(e,(e=>{if(g)r!==o&&(l(c,r,f,n,!0),o=r);else{const s=t(e);r!==s&&(l(c,r,f,n,!0),l(c,s,f,n,!1),r=s,o=[])}}),f[n]),c}},h=(e,t)=>t.parentNode===e,p=(e,...t)=>{for(let n of t)h(e,n)&&e.removeChild(n)},d=e=>"function"==typeof e,w=e=>e&&e instanceof HTMLElement;class y extends Error{constructor(e){super(),this.message=`value passed to ${e} is not HTMLElement type`}}class b extends Error{constructor(e){super(),this.message=`snapshot for id ${e} does not exist`}}const S=(e,...t)=>(...n)=>{const s=document.createElement(e);return l(s,[...t,...n],{},"",!1),s};function L(...e){const t=[];return(n,s,r,o)=>{if(!w(n))return console.warn(new y("children").message),n;const l=e=>{if(d(e)){const n=e();w(n)?t.push(n):console.warn("[children] passed function does not return HTMLElement type",n)}else w(e)?t.push(e):console.warn("[children] passed argument is not HTMLElement type")};return m(1===e.length?e[0]:e,(e=>{if(Array.isArray(e)){if(0===t.length)for(let t of e)l(t)}else t.length>0&&(p(n,...t),t.length=0),l(e);if(o)p(n,...t);else{const e=s[r]?.comment;for(let s of t)h(n,s)||(e&&e instanceof Comment?n.insertBefore(s,e):n.appendChild(s))}})),n}}const v=e=>(...t)=>(...n)=>g(e,(e=>Boolean(e)?t:n));return e.attr=e=>(t,n,s,r)=>{if(!w(t))return console.warn(new y("attr").message),t;for(let[o,l]of Object.entries(e)){m(l,(e=>{if(r){const e=n[s]?.snapshot;e?e.attributes.getNamedItem(o)?t.setAttribute(o,e.attributes.getNamedItem(o)?.value||""):t.removeAttribute(o):console.warn(new b(s).message)}else t.setAttribute(o,String(e))}))}return t},e.child=(e,...t)=>{let n=null;return(s,r,o,i)=>w(s)?(w(n)||(n=S(e,...t)()),l(s,[L(n)],r,o,i),s):(console.warn(new y("child").message),s)},e.children=L,e.classList=(...e)=>(t,n,s,r)=>{if(!w(t))return console.warn(new y("classList").message),t;for(let o of e){let e;m(o,(o=>{const l=String(o);if(r){const e=n[s]?.snapshot;e?t.classList.remove(l):console.warn(new b(s).message)}else e&&t.classList.remove(e),t.classList.add(l),e=l}))}return t},e.cmp=(e,n)=>{function r(t){if(c(e)){const s=e((e=>{t(n(e))}));t(n(s))}else console.warn(`${e} is not of FunStateGetter type, passing it to cmp function`),t(n(e))}return r[t]=s,r},e.elem=S,e.fmt=(...e)=>{function s(t){const n=[];if(e.length<2)return console.warn("fmt util needs at least 2 arguments to make sense"),s(e[0]??""),t(n.join(""));if("string"==typeof e[0]){const t=e[0].split("{}");if(t.length===e.length){s(t.shift()??"");for(let n=1;n<e.length;n++){s(e[n]??""),t.length>0&&s(t.shift()||"")}}else console.warn("number of {} in fmt util is not equal to number of dynamic arguments, falling back to concatenating all"),r()}else console.warn("first argument of fmt is not a string type, falling back to concatenating all"),r();function s(e){let s=n.length;if(u(e)||f(e))e((e=>{n.length>s?(n[s]=e,t(n.join(""))):n.push(e)}));else if(c(e)){const r=e((e=>{n[s]=e,t(n.join(""))}));n.push(r)}else n.push(e)}function r(){for(let t of e)s(t)}t(n.join(""))}return s[t]=n,s},e.funState=e=>{const n=[],s=[];let o=e;const l=e=>n.findIndex((([t])=>t===e)),i=e=>{if(e){const t=l(e);if(t>-1){const e=n.splice(t,1);if(e[0]){const t=e[0][1];d(t.releaseEffect)&&t.releaseEffect()}}else console.warn("[funState] no such subscriber to release: ",e)}else n.forEach((e=>{d(e[1].releaseEffect)&&e[1].releaseEffect()})),n.length=0},a=(e,t)=>{switch(e){case"pause":(e=>{if(e){if(-1===l(e))return void console.warn("[funState] no such subscriber to pause: ",e);-1===s.indexOf(e)?s.push(e):console.warn(`[funState] ignore pause of ${e} as it is already paused`)}else for(const e of n)-1===s.indexOf(e[0])&&s.push(e[0])})(t);break;case"resume":(e=>{if(e){if(-1===l(e))return void console.warn("[funState] no such subscriber to pause: ",e);const t=s.indexOf(e);t>-1?s.splice(t,1):console.warn(`[funState] ignore resume of ${e} as it is not paused`)}else s.length=0})(t);break;case"release":i(t);break;default:console.warn(`[funState] unknown action ${e} provided`)}},c=(e,t)=>{if(e)if(d(e)){-1===l(e)&&n.push([e,t||{}])}else console.warn("[funState] provided value is not a function: ",e);return o};c[t]=r;return[c,(e,t)=>{if(d(e))e(a);else{const r=()=>{o=e,n.forEach((([e,{once:t}])=>{-1===s.indexOf(e)&&(e(o),t&&i(e))}))};t&&t.force?r():Object.is(e,o)||r()}}]},e.html=e=>(t,n,s,r)=>{if(!w(t))return console.warn(new y("html").message),t;return m(e,(e=>{if(r){const e=n[s]?.snapshot;e?t.innerHTML=e.innerHTML:console.warn(new b(s).message)}else t.innerHTML=String(e)})),t},e.ifElse=v,e.ifOnly=e=>(...t)=>v(e)(...t)(),e.list=(e,t)=>{const n=document.createComment("");let s=[],r=[];return(o,i,c,f)=>{if(!w(o))return console.warn(new y("list").message),o;a(o,n,i[c]?.comment);return m(e,(e=>{if(Array.isArray(e))if(d(t))if(f)r.length>0&&(l(o,[L(...s)],i,c,f),s=[],r=[]);else{const n=[];if(r.length>0){for(let[a,u]of e.entries())if(Object.is(u,r[a]))n.push(s[a]);else{const e=t(u,a)();n.push(e),a<r.length?o.replaceChild(e,s[a]):l(o,[L(e)],i,c,f)}if(r.length>e.length)for(let t=r.length-1;t>=e.length;t--)p(o,s[t])}else{for(let[s,r]of e.entries())n.push(t(r,s)());l(o,[L(...n)],i,c,f)}s=n,r=e}else console.warn("[list] second argument of list should be ReturnType<typeof elem>");else console.warn("[list] first argument of list should be Array")})),o}},e.match=e=>(...n)=>g(e,(e=>{for(let[r,l]of n.entries())if(d(s=l)&&s[t]===o){const t=l(e,r===n.length-1);if(t.length>0)return t}var s;return[]})),e.matchCase=e=>(...n)=>{function s(t,s){if(void 0===e&&s)return n;if(d(e)){if(e(t))return n}else if(e===t)return n;return[]}return s[t]=o,s},e.on=(e,t,n)=>s=>w(s)?(s.addEventListener(e,t,n),n&&n.offTrigger&&n.offTrigger((()=>{s.removeEventListener(e,t)})),s):(console.warn(new y("on").message),s),e.style=e=>(t,n,s,r)=>{if(!w(t))return console.warn(new y("style").message),t;for(let[l,i]of Object.entries(e)){const e="string"!=typeof(o=l)?"":o.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase();m(i,(o=>{if(r){const r=n[s]?.snapshot;r?""!==r.style.getPropertyValue(e)?t.style.setProperty(e,r.style.getPropertyValue(e)):t.style.removeProperty(e):console.warn(new b(s).message)}else t.style.setProperty(e,String(o))}))}var o;return t},e.txt=(e,t={useTextContent:!1})=>(n,s,r,o)=>{if(!w(n))return console.warn(new y("txt").message),n;const l=t.useTextContent?"textContent":"innerText";return m(e,(e=>{if(o){const e=s[r]?.snapshot;e?n[l]=e[l]:console.warn(new b(r).message)}else n[l]=String(e)})),n},e}({});