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

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

/**
 * fluxel-reactive-router v0.6.5
 * 
 * Copyright (c) 2026 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 B=Object.defineProperty;var oe=Object.getOwnPropertyDescriptor;var ae=Object.getOwnPropertyNames;var se=Object.prototype.hasOwnProperty;var ie=(e,t)=>{for(var r in t)B(e,r,{get:t[r],enumerable:!0})},le=(e,t,r,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of ae(t))!se.call(e,i)&&i!==r&&B(e,i,{get:()=>t[i],enumerable:!(o=oe(t,i))||o.enumerable});return e};var ce=e=>le(B({},"__esModule",{value:!0}),e);var we={};ie(we,{Link:()=>V,createRouter:()=>q,default:()=>ge,globalNavigate:()=>T,useRouter:()=>k});Object.defineProperty(window,"Fluxel",{get:()=>__Fluxel_esm.default,configurable:!0});var D=new WeakMap;function A(e){var t;(t=D.get(e))===null||t===void 0||t.forEach(r=>r()),D.delete(e),e.childNodes.forEach(r=>A(r))}function K(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}var w=class Q{get value(){return this._accessor.get()}set value(t){this._accessor.set(t)}derive(t){let r={get:()=>t(this.value),set:o=>{throw new TypeError("Cannot set value of derived dependency")}};return new Q(r,this.addDependency)}constructor(t,r){K(this,"_accessor",void 0),K(this,"addDependency",void 0),this._accessor=t,this.addDependency=r}};var ue=["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"],X=ue;function _(){return typeof window<"u"&&"fluxelH"in window?window.fluxelH:null}function C(e,t){if(typeof e!="string")throw new TypeError("Expected string for tagName, got ".concat(typeof e));let r=_(),o=r?r.getElementByEid("".concat(r.count++)):document.createElement(e);return I(o,t)}function I(e,t){let r=!!_(),o=null,i=null,l=null,v=!1,s=null;if(t)if(typeof t=="string"||Array.isArray(t)||t instanceof Node||t instanceof w){i=t;let n=j(t);l=n.children,v=n.variableChildrenLength,s=n.reactiveIndex}else{if(o=Object.assign(Object.create(null),t),"textContent"in o)throw new TypeError("textContent is not allowed");if("children"in o&&o.children!==null&&o.children!==void 0){i=o.children;let n=j(o.children);l=n.children,v=n.variableChildrenLength,s=n.reactiveIndex,delete o.children}}o=o||{},l=l||null;let c=new Map;for(let n in o)if(n.startsWith("on")&&o[n]){let a=n.slice(2).toLowerCase(),f=c.get(a)||[];c.set(a,f);let d=o[n];if(Array.isArray(d))d.forEach(p=>{if(typeof p=="function")f.push(p);else throw new TypeError("Expected function for event handler ".concat(n,", got ").concat(typeof p))});else if(typeof d=="function")f.push(d);else throw new TypeError("Expected function for event handler ".concat(n,", got ").concat(typeof d));delete o[n]}let u=Object.assign(Object.create(null),"style"in o?o.style:null);if(u&&typeof u=="object"&&!Array.isArray(u)){for(let n in u)if(u[n]instanceof w){let a=u[n];a.addDependency(e,()=>{n.startsWith("--")?e.style.setProperty(n,a.value):e.style[n]=a.value}),u[n]=a.value}}delete o.style;let y=new Set,b=n=>{if(!n)return;let a=n.trim();a&&y.add(a)};if(e.classList.forEach(n=>b(n)),o.classList){let n=d=>{if(typeof d=="string")b(d);else if("forEach"in d)d.forEach(p=>b(p));else if(d instanceof w){let p=d;p.addDependency(e,()=>{e.className="",y.clear(),n(p.value),y.forEach(m=>e.classList.add(m))}),n(p.value)}else throw new TypeError("Expected string or iterable for 'classList', got ".concat(typeof o.classList))},a=o.classList,f=Array.isArray(a)&&a.some(d=>d instanceof w)?new w({get:()=>a.map(d=>d instanceof w?d.value:d),set:()=>{throw new TypeError("Cannot set value of classList directly")}},(d,p)=>{a.forEach(m=>m instanceof w&&m.addDependency(d,p))}):o.classList;n(f),delete o.classList}"className"in o&&delete o.className;let x=o.dataset||null;if(x&&typeof x=="object"&&!Array.isArray(x)){for(let n in x)if(x[n]instanceof w){let a=x[n];a.addDependency(e,()=>{e.dataset[n]=a.value}),x[n]=a.value}}delete o.dataset;for(let n in o)if(o[n]instanceof w){let a=o[n];a.addDependency(e,()=>{e[n]=a.value}),r||(e[n]=a.value),delete o[n]}if(r||(Object.assign(e,o),e.style&&u&&(Object.assign(e.style,u),Object.keys(u).forEach(n=>{n.startsWith("--")&&e.style.setProperty(n,u[n])})),e.dataset&&x&&Object.assign(e.dataset,x),y.size>0&&y.forEach(n=>e.classList.add(n))),v&&i&&i instanceof w)i.addDependency(e,()=>{let n=pe(e.childNodes),a=j(i).children,f=Y(n),d=Y(a);if(n.length===a.length&&n.every((h,g)=>h.isSameNode(a[g])))return;let p=n.reduce((h,g,O)=>{var S;let N=(S=d.get(g))!==null&&S!==void 0?S:-1;if(N<0)return h;let E=new Set([O]),R=O;for(let H=N+1;H<a.length;H++){var z;let W=(z=f.get(a[H]))!==null&&z!==void 0?z:-1;W<R||(E.add(W),R=W)}return E.size>h.size?E:h},new Set),m=new Set;if(p.size!==n.length){for(let h=n.length-1;h>=0;h--)if(!p.has(h)){let g=n[h];e.removeChild(g),m.add(g)}}e.childNodes.length!==a.length&&(a.forEach((h,g)=>{m.delete(h),e.childNodes[g]?e.childNodes[g]!==h&&e.insertBefore(h,e.childNodes[g]):e.appendChild(h)}),m.forEach(h=>A(h)))});else if(s&&s.length>0&&i)for(let n of s){let a=i instanceof w?i:i[n];a instanceof w&&(a.addDependency(e,()=>{let f=j(a.value).children[0],d=e.childNodes[n];d!==f&&(e.replaceChild(f,d),A(d))}),l[n]=a.value)}return l&&(r?l.forEach((n,a)=>{n instanceof Text&&(e.childNodes[a]&&e.childNodes[a]instanceof Text?e.replaceChild(n,e.childNodes[a]):e.insertBefore(n,e.childNodes[a]))}):e.append(...l)),c.forEach((n,a)=>{n.forEach(f=>{e.addEventListener(a,f)})}),e}function j(e){let t=!1,r=[],o=(i,l=0,v=-1)=>{if(l>1)throw new TypeError("Children cannot be nested more than one level deep");if(typeof i=="string")return[document.createTextNode(i)];if(Array.isArray(i)){i=i.flat(1/0);let s=i.length;return i.flatMap((u,y)=>o(u,l+(s===1?0:1),y))}else{if(i instanceof Node)return[i];if(i instanceof w){let s=i.value;if(Array.isArray(s))return l===0&&(t=!0),s.flat(1/0).flatMap((c,u)=>o(c,l+1,u));if(s instanceof Node)return l===0&&(t=!0),r.push(v),[s];{let c=document.createTextNode(s);return i.addDependency(c,()=>{c.textContent=String(i.value)}),[c]}}else return[]}};return{children:o(e),variableChildrenLength:t,reactiveIndex:r}}C.fragment=function(e,t){let r=j(e),o=r.children,i=r.variableChildrenLength,l=r.reactiveIndex;if(i&&e instanceof w)return e.derive(v=>{let s=j(v).children;return s.forEach(c=>I(c,t)),s});{let v=o;if(v.forEach(s=>{s instanceof HTMLElement&&I(s,t)}),l.length>0)for(let s of l)v[s]=e[s].derive(c=>I(c,t));return v}};function de(){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}C.forwardStyle=function(e){_()||C.forwardStyleCache.includes(e)||(C.forwardStyleCache.push(e),typeof window<"u"&&(de().textContent+=e))};C.forwardStyleCache=[];function fe(){return"".concat(Date.now().toString(36)).concat(Math.random().toString(36).substring(2))}function pe(e){if(typeof Array.from=="function")return Array.from(e);let t=[];for(let r=0;r<e.length;r++)t.push(e[r]);return t}function Y(e){let t=new Map;return e.forEach((r,o)=>{t.set(r,o)}),t}C.useUniqueString=function(e){let t=fe();return e(t)};C.createComponent=function(e){return(t={})=>e(t)};C.createElement=C;var Z=C;X.forEach(e=>{Z[e]=t=>C(e,t)});var ee=Z;function he(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function ve(e){for(var t=1;t<arguments.length;t++){var r=arguments[t]!=null?arguments[t]:{},o=Object.keys(r);typeof Object.getOwnPropertySymbols=="function"&&(o=o.concat(Object.getOwnPropertySymbols(r).filter(function(i){return Object.getOwnPropertyDescriptor(r,i).enumerable}))),o.forEach(function(i){he(e,i,r[i])})}return e}function ye(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter(function(i){return Object.getOwnPropertyDescriptor(e,i).enumerable})),r.push.apply(r,o)}return r}function me(e,t){return t=t!=null?t:{},Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):ye(Object(t)).forEach(function(r){Object.defineProperty(e,r,Object.getOwnPropertyDescriptor(t,r))}),e}var $=ee,U=["render","use","useWithMemo","listenTarget"];$.reactive=function(e,t){let r=Object.create(null),o=me(ve({},e),{render:(l,v=!1)=>{if(!v&&l&&o.listenTarget.dispatchEvent(new CustomEvent(l,{detail:{newValue:o[l]}})),l){var s;(s=r[l])===null||s===void 0||s.listeners.forEach(c=>c.call(null))}else for(let c in r)r[c].listeners.forEach(u=>u.call(null))},use:(l,v)=>{let s=-1,c=-1,u=[],y=new Map,b=new Map,x=(a,f,d=!1)=>{if(d){let p=JSON.stringify(f);if(b.has(p)){let h=b.get(p);return y.set(p,h),h}let m=a();return y.set(p,m),m}if(u[s]){if(u[s].deps.every((m,h)=>m===f[h]))return u[s++].memoValue;u[s].deps=f;let p=u[s].memoValue=a();return s++,p}else return u.push({deps:f,memoValue:a()}),u[s++].memoValue},n=v?a=>{s===-1&&c!==-1&&(c=s),s=0,y=new Map;let f=v(a,x);if(c!==-1&&c!==s)throw new TypeError("Memoization count mismatch");return b=y,f}:void 0;if(Array.isArray(l)){let a=l.map(f=>[f,o.use(f)]);return new w({get:()=>Object.fromEntries(a.map(f=>[f[0],f[1].value])),set:f=>{throw new TypeError("Invalid")}},(f,d)=>{let p=te(d);a.forEach(m=>m[1].addDependency(f,p))}).derive(n)}else{let a;return r[l]?a=r[l].dep:o[l]instanceof w?a=o[l]:(a=new w({get:()=>o[l],set:f=>{o[l]=f}},function(d,p){if(!r[l].listeners.includes(p)){r[l].listeners.push(p);let m=()=>{r[l].listeners=r[l].listeners.filter(h=>h!==p)};D.has(d)?D.get(d).add(m):D.set(d,new Set([m]))}}),r[l]={dep:a,listeners:[]}),n?a.derive(n):a}},useWithMemo:l=>{let v=null,s=o.use(l,(c,u)=>(v=u,c));return s.value,[s,v]},listenTarget:new EventTarget}),i=new Proxy(o,{set(l,v,s){if(U.includes(v))throw new TypeError("Cannot set the specified property: ".concat(String(v)));let c=l[v];return c===s||(l[v]=s,l.listenTarget.dispatchEvent(new CustomEvent(v,{detail:{oldValue:c,newValue:s}})),l.render(v)),!0}});return t(i)};$.schedule=function(e){typeof window<"u"&&setTimeout(e,0)};$.mergeDependencies=function(...e){return new w({get:()=>e.map(t=>t.value),set:t=>{throw new TypeError("Invalid operation")}},(t,r)=>{let o=te(r);e.forEach(i=>i.addDependency(t,o))})};function te(e){let t=!1;return()=>{t||(t=!0,window.setTimeout(()=>{t=!1,e()},0))}}var L=$;var J=L;J.createStatefulComponent=function(e,t){return(r={})=>J.reactive(typeof t=="function"?t(r):t||{},o=>e(r,o))};var re=J;var F=new EventTarget;typeof window<"u"&&(window.addEventListener("popstate",e=>{F.dispatchEvent(new CustomEvent("popstate",{detail:e}))}),window.addEventListener("hashchange",e=>{F.dispatchEvent(new CustomEvent("popstate",{detail:e}))}));var G=()=>L.div({dataset:{fluxelRouterFallback:"1"}}),M=[],ne=()=>{};function q(e,t={}){let r=t.basePath||"",o=t.mode||"history",i=[];Object.keys(e).forEach(u=>{let y=new RegExp("^".concat(u.replace(/\/\*?$/,"").replace(RegExp("(?<cap>:[^\\s/]+)\\?\\/","g"),"($<cap>/)?").replace(RegExp(":(?<name>[^\\s\\?/]+)","g"),"(?<$<name>>[^/]+)")).concat(u.endsWith("/*")?"(/.*)?":"/?","$"));i.push([y,u])});let l=u=>{let y=null;return L.reactive(u,b=>{y=b}),y},v=!1,s=null,c={basePath:r,pathname:"/",route:null,params:{},query:null,get mode(){return o},Provider(u){return L.reactive({children:null},y=>{let b=(n,a)=>{if(v=!0,s){Promise.all(s).then(()=>{(!n||c.route===n)&&(y.children=a),s=null});return}else y.children=a},x=()=>{let n=new URL(location.href),a=o==="history"?n.pathname.replace(r,""):n.hash.replace(/^#/,"").replace(r,""),f=new URLSearchParams(n.search);c.pathname=a;let d=i.find(h=>h[0].test(a));if(d){let h=d[0],g=d[1],O=h.exec(a).groups||{};if(c.route===g&&JSON.stringify(c.params)===JSON.stringify(O)){Object.keys(c.query).filter(E=>!f.has(E)&&!U.includes(E)).forEach(E=>{c.query[E]=void 0}),f.forEach((E,R)=>{c.query[R]=E});return}c.route=g,c.params=O;let S={};f.forEach((E,R)=>{S[R]=E}),c.query=l(S),M.push(c);let N=e[g]();if(M.pop(),N instanceof Promise){var p;N.then(E=>{e[g]=E,c.route===g&&(M.push(c),b(g,E()),M.pop())}),b(g,((p=t.fallback)===null||p===void 0?void 0:p.call(t))||G())}else b(g,N)}else{var m;c.route=null,c.params={};let h={};f.forEach((g,O)=>{h[O]=g}),c.query=l(h),b(null,((m=t.fallback)===null||m===void 0?void 0:m.call(t))||G())}};return F.addEventListener("popstate",()=>x()),x(),L.div({dataset:{fluxelRouter:"1"},classList:(u==null?void 0:u.classList)||[],children:y.use("children",n=>{var a;return n||((a=t.fallback)===null||a===void 0?void 0:a.call(t))||G()})})})},navigate(u,y={}){c.mode==="hash"&&(u="#".concat(c.basePath).concat(u)),T(u,y)},deferUpdate(u){v?(s=s||[],s.push(u().catch(ne))):u().catch(ne)}};return c}var k=e=>{let t=(e==null?void 0:e.optional)||!1,r=M[M.length-1];if(!r&&!t)throw new Error("No router instance found. Make sure the component is rendered within a Router Provider.");return r||null};function T(e,t={}){t.replace||!1?window.history.replaceState({},"",e):window.history.pushState({},"",e),F.dispatchEvent(new CustomEvent("popstate"))}var V=e=>{if(!e||!e.href)throw new Error("Link component requires a 'href' property.");let t=e.replace||!1,r=Object.assign({},e);delete r.replace;let o=r.href||"#",i=r.onclick?Array.isArray(r.onclick)?r.onclick:[r.onclick]:[];return i.push(l=>{l.preventDefault(),T(o,{replace:t||!1})}),r.onclick=i,L.a(r)};var P=re;P.createRouter=q;P.useRouter=k;P.globalNavigate=T;P.Link=V;var ge=P;return ce(we);})();