fluxel/dist/browser/fluxel-reactive.min.js

An ultra-lightweight, high-performance library for efficient DOM building and dynamic web UIs

/**
 * fluxel-reactive v0.6.3
 * 
 * Copyright (c) 2025 mtripg6666tdr
 * 
 * This source code is licensed under the MIT license found in the
 * LICENSE file in the root directory of this source tree.
 * 
 * @see https://github.com/mtripg6666tdr/fluxel
 * @license MIT
*/
"use strict";var __Fluxel_esm=(()=>{var N=Object.defineProperty;var G=Object.getOwnPropertyDescriptor;var K=Object.getOwnPropertyNames;var Q=Object.prototype.hasOwnProperty;var X=(e,t)=>{for(var i in t)N(e,i,{get:t[i],enumerable:!0})},Y=(e,t,i,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let l of K(t))!Q.call(e,l)&&l!==i&&N(e,l,{get:()=>t[l],enumerable:!(n=G(t,l))||n.enumerable});return e};var Z=e=>Y(N({},"__esModule",{value:!0}),e);var ce={};X(ce,{default:()=>le});Object.defineProperty(window,"Fluxel",{get:()=>__Fluxel_esm.default,configurable:!0});var C=new WeakMap;function T(e){var t;(t=C.get(e))===null||t===void 0||t.forEach(i=>i()),C.delete(e),e.childNodes.forEach(i=>T(i))}function V(e,t,i){return t in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}var g=class ${get value(){return this._accessor.get()}set value(t){this._accessor.set(t)}derive(t){let i={get:()=>t(this.value),set:n=>{throw new TypeError("Cannot set value of derived dependency")}};return new $(i,this.addDependency)}constructor(t,i){V(this,"_accessor",void 0),V(this,"addDependency",void 0),this._accessor=t,this.addDependency=i}};var k=["object","a","abbr","address","area","article","aside","audio","b","base","bdi","bdo","blockquote","body","br","button","canvas","caption","cite","code","col","colgroup","data","datalist","dd","del","details","dfn","dialog","div","dl","dt","em","embed","fieldset","figcaption","figure","footer","form","h1","h2","h3","h4","h5","h6","head","header","hgroup","hr","html","i","iframe","img","input","ins","kbd","label","legend","li","link","main","map","mark","menu","meta","meter","nav","noscript","ol","optgroup","option","output","p","picture","pre","progress","q","rp","rt","ruby","s","samp","script","search","section","select","slot","small","source","span","strong","style","sub","summary","sup","table","tbody","td","template","textarea","tfoot","th","thead","time","title","tr","track","u","ul","var","video","wbr"],z=k;function I(){return typeof window<"u"&&"fluxelH"in window?window.fluxelH:null}function b(e,t){if(typeof e!="string")throw new TypeError("Expected string for tagName, got ".concat(typeof e));let i=I(),n=i?i.getElementByEid("".concat(i.count++)):document.createElement(e);return W(n,t)}function W(e,t){let i=!!I(),n=null,l=null,o=null,p=!1,a=null;if(t)if(typeof t=="string"||Array.isArray(t)||t instanceof Node||t instanceof g){l=t;let r=O(t);o=r.children,p=r.variableChildrenLength,a=r.reactiveIndex}else{if(n=Object.assign(Object.create(null),t),"textContent"in n)throw new TypeError("textContent is not allowed");if("children"in n&&n.children!==null&&n.children!==void 0){l=n.children;let r=O(n.children);o=r.children,p=r.variableChildrenLength,a=r.reactiveIndex,delete n.children}}n=n||{},o=o||null;let h=new Map;for(let r in n)if(r.startsWith("on")&&n[r]){let s=r.slice(2).toLowerCase(),d=h.get(s)||[];h.set(s,d);let c=n[r];if(Array.isArray(c))c.forEach(f=>{if(typeof f=="function")d.push(f);else throw new TypeError("Expected function for event handler ".concat(r,", got ").concat(typeof f))});else if(typeof c=="function")d.push(c);else throw new TypeError("Expected function for event handler ".concat(r,", got ").concat(typeof c));delete n[r]}let u=Object.assign(Object.create(null),"style"in n?n.style:null);if(u&&typeof u=="object"&&!Array.isArray(u)){for(let r in u)if(u[r]instanceof g){let s=u[r];s.addDependency(e,()=>{r.startsWith("--")?e.style.setProperty(r,s.value):e.style[r]=s.value}),u[r]=s.value}}delete n.style;let m=new Set,x=r=>{if(!r)return;let s=r.trim();s&&m.add(s)};if(e.classList.forEach(r=>x(r)),n.classList){let r=c=>{if(typeof c=="string")x(c);else if("forEach"in c)c.forEach(f=>x(f));else if(c instanceof g){let f=c;f.addDependency(e,()=>{e.className="",m.clear(),r(f.value),m.forEach(v=>e.classList.add(v))}),r(f.value)}else throw new TypeError("Expected string or iterable for 'classList', got ".concat(typeof n.classList))},s=n.classList,d=Array.isArray(s)&&s.some(c=>c instanceof g)?new g({get:()=>s.map(c=>c instanceof g?c.value:c),set:()=>{throw new TypeError("Cannot set value of classList directly")}},(c,f)=>{s.forEach(v=>v instanceof g&&v.addDependency(c,f))}):n.classList;r(d),delete n.classList}"className"in n&&delete n.className;let w=n.dataset||null;if(w&&typeof w=="object"&&!Array.isArray(w)){for(let r in w)if(w[r]instanceof g){let s=w[r];s.addDependency(e,()=>{e.dataset[r]=s.value}),w[r]=s.value}}delete n.dataset;for(let r in n)if(n[r]instanceof g){let s=n[r];s.addDependency(e,()=>{e[r]=s.value}),i||(e[r]=s.value),delete n[r]}if(i||(Object.assign(e,n),e.style&&u&&(Object.assign(e.style,u),Object.keys(u).forEach(r=>{r.startsWith("--")&&e.style.setProperty(r,u[r])})),e.dataset&&w&&Object.assign(e.dataset,w),m.size>0&&m.forEach(r=>e.classList.add(r))),p&&l)l.addDependency(e,()=>{let r=ne(e.childNodes),s=O(l).children,d=H(r),c=H(s);if(r.length===s.length&&r.every((y,E)=>y.isSameNode(s[E])))return;let f=r.reduce((y,E,_)=>{var D;let F=(D=c.get(E))!==null&&D!==void 0?D:-1;if(F<0)return y;let M=new Set([_]),R=_;for(let j=F+1;j<s.length;j++){var S;let A=(S=d.get(s[j]))!==null&&S!==void 0?S:-1;A<R||(M.add(A),R=A)}return M.size>y.size?M:y},new Set),v=new Set;if(f.size!==r.length){for(let y=r.length-1;y>=0;y--)if(!f.has(y)){let E=r[y];e.removeChild(E),v.add(E)}}e.childNodes.length!==s.length&&(s.forEach((y,E)=>{v.delete(y),e.childNodes[E]?e.childNodes[E]!==y&&e.insertBefore(y,e.childNodes[E]):e.appendChild(y)}),v.forEach(y=>T(y)))});else if(a&&a.length>0&&l)for(let r of a){let s=l instanceof g?l:l[r];s instanceof g&&(s.addDependency(e,()=>{let d=O(s.value).children[0],c=e.childNodes[r];c!==d&&(e.replaceChild(d,c),T(c))}),o[r]=s.value)}return o&&(i?o.forEach((r,s)=>{r instanceof Text&&e.replaceChild(r,e.childNodes[s])}):e.append(...o)),h.forEach((r,s)=>{r.forEach(d=>{e.addEventListener(s,d)})}),e}function O(e){let t=!1,i=[],n=(l,o=0,p=-1)=>{if(o>1)throw new TypeError("Children cannot be nested more than one level deep");if(typeof l=="string")return[document.createTextNode(l)];if(Array.isArray(l)){l=l.flat(1/0);let a=l.length;return l.flatMap((u,m)=>n(u,o+(a===1?0:1),m))}else{if(l instanceof Node)return[l];if(l instanceof g){let a=l.value;if(Array.isArray(a))return o===0&&(t=!0),a.flat(1/0).flatMap((h,u)=>n(h,o+1,u));if(a instanceof Node)return o===0&&(t=!0),i.push(p),[a];{let h=document.createTextNode(a);return l.addDependency(h,()=>{h.textContent=String(l.value)}),[h]}}else return[]}};return{children:n(e),variableChildrenLength:t,reactiveIndex:i}}b.fragment=function(e,t){let i=O(e),n=i.children,l=i.variableChildrenLength,o=i.reactiveIndex,p=n;if(p.forEach(a=>{a instanceof HTMLElement&&W(a,t)}),l)return e.derive(()=>n);if(o.length>0)for(let a of o)p[a]=e[a].derive(()=>n[a]);return p};function ee(){let e=document.querySelector("style[data-fluxel]");if(e)return e;let t=document.createElement("style");return t.dataset.fluxel="true",document.head.appendChild(t),t}b.forwardStyle=function(e){I()||b.forwardStyleCache.includes(e)||(b.forwardStyleCache.push(e),typeof window<"u"&&(ee().textContent+=e))};b.forwardStyleCache=[];function te(){return"".concat(Date.now().toString(36)).concat(Math.random().toString(36).substring(2))}function ne(e){if(typeof Array.from=="function")return Array.from(e);let t=[];for(let i=0;i<e.length;i++)t.push(e[i]);return t}function H(e){let t=new Map;return e.forEach((i,n)=>{t.set(i,n)}),t}b.useUniqueString=function(e){let t=te();return e(t)};b.createComponent=function(e){return(t={})=>e(t)};b.createElement=b;var q=b;z.forEach(e=>{q[e]=t=>b(e,t)});var B=q;function re(e,t,i){return t in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function ie(e){for(var t=1;t<arguments.length;t++){var i=arguments[t]!=null?arguments[t]:{},n=Object.keys(i);typeof Object.getOwnPropertySymbols=="function"&&(n=n.concat(Object.getOwnPropertySymbols(i).filter(function(l){return Object.getOwnPropertyDescriptor(i,l).enumerable}))),n.forEach(function(l){re(e,l,i[l])})}return e}function se(e,t){var i=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(l){return Object.getOwnPropertyDescriptor(e,l).enumerable})),i.push.apply(i,n)}return i}function oe(e,t){return t=t!=null?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):se(Object(t)).forEach(function(i){Object.defineProperty(e,i,Object.getOwnPropertyDescriptor(t,i))}),e}var L=B,ae=["render","use","useWithMemo","listenTarget"];L.reactive=function(e,t){let i=Object.create(null),n=oe(ie({},e),{render:(o,p=!1)=>{if(!p&&o&&n.listenTarget.dispatchEvent(new CustomEvent(o,{detail:{newValue:n[o]}})),o){var a;(a=i[o])===null||a===void 0||a.listeners.forEach(h=>h.call(null))}else for(let h in i)i[h].listeners.forEach(u=>u.call(null))},use:(o,p)=>{let a=-1,h=-1,u=[],m=new Map,x=new Map,w=(s,d,c=!1)=>{if(c){let f=JSON.stringify(d);if(x.has(f)){let y=x.get(f);return m.set(f,y),y}let v=s();return m.set(f,v),v}if(u[a]){if(u[a].deps.every((v,y)=>v===d[y]))return u[a++].memoValue;u[a].deps=d;let f=u[a].memoValue=s();return a++,f}else return u.push({deps:d,memoValue:s()}),u[a++].memoValue},r=p?s=>{a===-1&&h!==-1&&(h=a),a=0,m=new Map;let d=p(s,w);if(h!==-1&&h!==a)throw new TypeError("Memoization count mismatch");return x=m,d}:void 0;if(Array.isArray(o)){let s=o.map(d=>[d,n.use(d)]);return new g({get:()=>Object.fromEntries(s.map(d=>[d[0],d[1].value])),set:d=>{throw new TypeError("Invalid")}},(d,c)=>{let f=U(c);s.forEach(v=>v[1].addDependency(d,f))}).derive(r)}else{let s;return i[o]?s=i[o].dep:n[o]instanceof g?s=n[o]:(s=new g({get:()=>n[o],set:d=>{n[o]=d}},function(c,f){if(!i[o].listeners.includes(f)){i[o].listeners.push(f);let v=()=>{i[o].listeners=i[o].listeners.filter(y=>y!==f)};C.has(c)?C.get(c).add(v):C.set(c,new Set([v]))}}),i[o]={dep:s,listeners:[]}),r?s.derive(r):s}},useWithMemo:o=>{let p=null,a=n.use(o,(h,u)=>(p=u,h));return a.value,[a,p]},listenTarget:new EventTarget}),l=new Proxy(n,{set(o,p,a){if(ae.includes(p))throw new TypeError("Cannot set the specified property: ".concat(String(p)));let h=o[p];return h===a||(o[p]=a,o.listenTarget.dispatchEvent(new CustomEvent(p,{detail:{oldValue:h,newValue:a}})),o.render(p)),!0}});return t(l)};L.schedule=function(e){typeof window<"u"&&setTimeout(e,0)};L.mergeDependencies=function(...e){return new g({get:()=>e.map(t=>t.value),set:t=>{throw new TypeError("Invalid operation")}},(t,i)=>{let n=U(i);e.forEach(l=>l.addDependency(t,n))})};function U(e){let t=!1;return()=>{t||(t=!0,window.setTimeout(()=>{t=!1,e()},0))}}var J=L;var P=J;P.createStatefulComponent=function(e,t){return(i={})=>P.reactive(typeof t=="function"?t(i):t||{},n=>e(i,n))};var le=P;return Z(ce);})();