@loom-js/devtools 0.0.0-stage → 0.1.0

package/dist/frontend.js

@@ -0,0 +1,215 @@
+var yt=globalThis.window!==void 0&&globalThis.window.document!==void 0,Ge=new WeakMap,Qe=new Map,_=(e,r)=>({kind:e,label:r}),or=e=>{if(e.label)return`\u27E8${e.label}\u27E9`;let r=Ge.get(e);if(!r){let t=(Qe.get(e.kind)??0)+1;Qe.set(e.kind,t),r=`${e.kind}#${t}`,Ge.set(e,r)}return r};var L=({detail:e,event:r,remedy:t,scope:o,subject:a},{styled:n=yt}={})=>{let c=a&&or(a),g=[r,e,t].filter(Boolean).join(" \u2014 ");if(!n)return[`[loom] ${o}${c?` ${c}`:""} ${g}`];let p=["background:#6d28d9;color:#fff;border-radius:3px;padding:1px 4px;font-weight:600","color:#6d28d9;font-weight:600"],k=`%c[loom]%c ${o}`;return c&&(p.push("color:#0e7490;font-weight:600"),k+=`%c ${c}`),p.push(""),k+=`%c ${g}`,[k,...p]},Se=typeof window<"u"?window:void 0,Ce=()=>Se!==void 0,W=()=>{if(!Se)throw new Error("[loom] No DOM is available. Outside a browser, render through `renderToString(app, { window })` from `@loom-js/core/server`.");return Se},H=()=>W().document;var er=new WeakMap,zt=e=>{let r=er.get(e);return r||(r={pending:0,pendingSubjects:new Map,zeroWaiters:[]},er.set(e,r)),r},Ae=(e,r)=>{if(e===null||typeof e!="object"&&typeof e!="function"||typeof e.then!="function"||!Ce())return;let t=zt(W()),o=()=>{if(t.pending--,r){let a=(t.pendingSubjects.get(r)??1)-1;a>0?t.pendingSubjects.set(r,a):t.pendingSubjects.delete(r)}t.pending===0&&t.zeroWaiters.splice(0).forEach(a=>a())};t.pending++,r&&t.pendingSubjects.set(r,(t.pendingSubjects.get(r)??0)+1),e.then(o,o)};var Et={activity:!0,creation:!0,mutations:!0,updates:!0},fe={activity:!1,creation:!1,mutations:!1,updates:!1},Te=["abort","animationcancel","animationend","animationiteration","auxclick","blur","cancel","canplay","canplaythrough","change","click","close","contextmenu","cuechange","dblclick","drag","dragend","dragenter","dragexit","dragleave","dragover","dragstart","durationchange","ended","error","focus","formdata","gotpointercapture","input","invalid","keydown","keypress","keyup","load","loadeddata","loadedmetadata","loadend","loadstart","lostpointercapture","mousedown","mouseenter","mouseleave","mousemove","mouseout","mouseover","mouseup","pause","play","playing","pointercancel","pointerdown","pointerenter","pointerleave","pointermove","pointerout","pointerover","pointerup","reset","resize","scroll","select","selectionchange","selectstart","submit","touchcancel","touchstart","transitioncancel","transitionend","transitionrun","transitionstart","wheel"],ar=()=>({events:Te,TOKEN:se,tokenRe:ir,tokenReGlobal:lr}),ke=e=>new RegExp(`${se}|${encodeURIComponent(se)}`,e),nr=()=>Object.assign(B,ar()),se="\u26A1",ir=ke(),lr=ke("g"),sr=e=>{Te=Te.concat(e),nr()},X=e=>cr()&&fe[e],B=ar(),cr=()=>globalThis.process?.env.NODE_ENV!=="production"&&Object.values(fe).some(Boolean),Pe=(e=!0,r)=>{let t=typeof e=="object";return fe=t||e?{activity:!1,creation:!1,mutations:!1,updates:!1,...(t?e:r)??Et}:{activity:!1,creation:!1,mutations:!1,updates:!1},{...fe}},dr=e=>(se=e,ir=ke(),lr=ke("g"),nr(),se),$t=()=>{},O=new Proxy(globalThis.console,{get(e,r){let t=Reflect.get(e,r);return t instanceof Function?r==="warn"||r==="error"||cr()?t.bind(e):$t:t}}),rr=new Set;var Re=e=>{if(e===null||rr.size===0)return!1;for(let r of rr)if(r===e||r.contains(e))return!0;return!1},tr=(e,r,t)=>{let o=e[r]??=new Map,a=o.get(t);return a||(a={},o.set(t,a)),a.parent=e,a},xe=(e={},r,t)=>Z(r)?(e.arrayChildren?.delete(t),tr(e,"children",t)):Array.isArray(r)?(e.children?.delete(t),tr(e,"arrayChildren",t)):void(!e.children&&!e.arrayChildren||r instanceof W().Node||(e.children?.delete(t),e.arrayChildren?.delete(t))),pr=(e,r)=>{e.children?.delete(r),e.arrayChildren?.delete(r)},mr=e=>typeof e=="function"?e.contextFunctionKind??(e.name==="contextFunction"?"component":e.name==="activityContextFunction"?"activity":void 0):void 0,Z=e=>!!mr(e),ur=e=>mr(e)==="activity",ce=e=>Array.isArray(e.root)?e.root[0]:e.root,je=e=>{let r=e.root?ce(e):void 0;return!!r&&(H().contains(r)||Re(r))},Q=e=>({children:e.children,chunks:e.chunks,ctxScopes:e.ctxScopes,fingerPrint:e.fingerPrint,fragment:e.fragment,key:e.key,lifeCycleState:e.lifeCycleState?.value,node:e.node,parent:e.parent,props:e.props,root:e.root,slots:e.slots});var Ne=(e,r)=>Object.entries(e).some(([t,o])=>q(o)&&q(r[t])?Ne(o,r[t]):o!==r[t]),q=e=>e!==null&&typeof e=="object"&&!Array.isArray(e),gr=(e,r)=>e.length!==r.length||e.some((t,o)=>t!==r[o]),vr=(e,r)=>Object.entries(e).some(([t,o])=>o!==r[t]),hr=e=>e.split("-").map((r,t)=>t===0?r:r.charAt(0).toUpperCase()+r.slice(1)).join(""),U=new Map,St=["beforeRender","created","mounted","rendered","unmounted"],oe={creation(e){if(e.lifeCycleState){let r=ce(e);r&&!U.has(r)&&(U.set(r,e),te(e,"created"))}},observe(e){let r=X("mutations"),t=new(W()).MutationObserver(Tt);r&&O.groupCollapsed(...L({event:"mounting",scope:"mutations"})),t.observe(e,{childList:!0,subtree:!0}),U.forEach((o,a)=>{let n=ce(o);n&&H().contains(n)&&o.lifeCycleState?(te(o,"mounted"),r&&O.info(...L({event:"mounted",scope:"mutations",subject:o.key?_("component",String(o.key)):void 0}),a,Q(o))):U.delete(a)}),r&&O.groupEnd()},release(e){U.forEach((r,t)=>{t.ownerDocument===e&&U.delete(t)})},preRender(e){e.lifeCycleState&&te(e,"beforeRender")},postRender(e){e.lifeCycleState&&te(e,"rendered")}},br=(e,r)=>{r(e);let t=e.nodeType===1?e.firstElementChild:null;for(;t;){let o=t.firstElementChild,a=t;for(;!o&&a&&a!==e;)o=a.nextElementSibling,a=a.parentElement;r(t),t=o}},Tt=e=>{if(!U.size)return;let r=X("mutations"),t=new Map;r&&O.groupCollapsed(...L({event:"mutating",scope:"mutations"})),e.forEach(({addedNodes:a,removedNodes:n,type:c})=>{if(c==="childList"){if(n.length){let g=p=>{let k=U.get(p);k?.lifeCycleState&&t.set(p,k)};n.forEach(p=>br(p,g))}if(a.length){let g=p=>{let k=U.get(p);k?.lifeCycleState&&(te(k,"mounted"),r&&O.info(...L({event:"mounted",scope:"mutations",subject:k.key?_("component",String(k.key)):void 0}),p,Q(k)))};a.forEach(p=>br(p,g))}}});let o=[];t.forEach((a,n)=>{H().contains(n)||(U.delete(n),a.lifeCycleState&&te(a,"unmounted"),o.push(a),r&&O.info(...L({event:"unmounted",scope:"mutations",subject:a.key?_("component",String(a.key)):void 0}),n,Q(a)))}),o.forEach(Oe),r&&O.groupEnd()},Oe=e=>{e.teardowns?.forEach(r=>r()),e.teardowns?.clear(),e.owned&&=void 0,fr(e),e.children?.forEach(Oe),e.arrayChildren?.forEach(Oe)},fr=e=>{St.forEach(r=>{e[r]&&(e[r]=void 0)})},kr=e=>{e.lifeCycleState={value:null},fr(e)},xr=e=>({onBeforeRender:r=>de(e,"beforeRender",r),onCreated:r=>de(e,"created",r),onMounted:r=>de(e,"mounted",r),onRendered:r=>de(e,"rendered",r),onUnmounted:r=>de(e,"unmounted",r)}),de=(e,r,t)=>{e[r]?.length&&!e.registering?.has(r)||((e[r]??=[]).push(t),(e.registering??=new Set).add(r))},te=(e,r)=>{let t=e.lifeCycleState;t&&t.value!==r&&(t.value=r,e[r]?.forEach(o=>o(e.root)),e.ref?.[r]?.(e.root))},Ie=(e=H().body,r,t="replace")=>{let o=a=>{let n=Array.isArray(a)?a:[a];switch(t){case"append":e.append(...n);break;case"prepend":e.prepend(...n);break;default:e.replaceChildren(...n)}};if(r.hasOwnProperty("root")){let a=r;a.root&&o(a.root)}else o(r)},Ct="loom-app",At="loom-state",Po=`<div id="${Ct}" style="height: 100%"></div>`,Ro=`<script id="${At}" type="application/json"><\/script>`;var Rt=new WeakMap,zr=(e,r)=>{Rt.set(e,r)};var jt=new WeakMap;var Ot=new WeakMap,Er=(e,r,t)=>{Ot.set(e,r),t&&jt.set(r,{explicit:!0,name:t})};var ee=null,$r=e=>{pe=[],ee=e},pe=[],Nt={activityCreated:e=>pe.length<1e4&&pe.push(["activityCreated",e]),rendered:(e,r)=>pe.length<1e4&&pe.push(["rendered",e,r])};var me=()=>globalThis.performance.now(),Me="loom:devtools",wr,ae,yr=!1,Sr=e=>{try{let r=globalThis.sessionStorage;return e!==void 0&&(e?r.setItem(Me,"1"):r.removeItem(Me)),r.getItem(Me)==="1"}catch{return!1}},Le=({persist:e}={})=>{if(!wr)return yr||O.warn(...L({event:"no devtools implementation is registered",remedy:"set `devtools` in loom.config or call `registerDevtools`",scope:"devtools"})),yr=!0,Promise.resolve(void 0);if(e!==void 0&&Sr(e),!ae){let r=wr;ee??=Nt,ae=r().then(t=>t.activate()).catch(t=>{throw ae=void 0,$r(null),t})}return ae},Tr=async()=>{let e=ae;Sr(!1),ae=void 0,$r(null),(await e)?.deactivate()},Cr=async(e="dock")=>(await Le())?.open(e);var We=Symbol("loom.attr-binding"),He=e=>typeof e=="object"&&e!==null&&e[We]===!0,It=Symbol("loom.unapplied"),Ve=(e,r,t)=>{let o=It,a=r.watch(({value:n})=>{let c=r.select(n);Object.is(c,o)||(o=c,e(c))});return t&&(t.teardowns=t.teardowns||new Set,t.teardowns.add(a)),a},Mt=new Set,Ar=e=>{Mt.add(e)};var Lt=({commit:e,concurrency:r,subject:t,timeout:o})=>{let a=null,n=[],c=[],g=!1,p=f=>{f.retired=!0,f.buffer&&(f.buffer.length=0),f.controller.abort()},k=f=>{if(!f.settled){if(f.settled=!0,f.resolveTracked?.(),r==="ordered")for(;n[0]?.settled;){n.shift();let z=n[0];z?.buffer?.splice(0).forEach(E=>!z.retired&&e(E))}else if(r==="serial"){let z=c.shift();z?z():g=!1}}},x=(f,z)=>{let E=z((h=>l=>{h.retired?X("activity")&&O.info(...L({detail:"the run was retired (superseded or timed out)",event:"dropped commit",scope:"activity",subject:t})):r!=="ordered"||n[0]===h?e(l):h.buffer?.push(l)})(f),f.controller.signal);if((i=E)===null||typeof i!="object"&&typeof i!="function"||typeof i.then!="function")return void k(f);var i;let d;f.resolveTracked||Ae(new Promise(h=>{f.resolveTracked=h}),t);let m=()=>{clearTimeout(d),k(f)};E.then(m,m),o!==void 0?d=setTimeout(()=>{f.settled||(p(f),O.warn(...L({detail:"its signal aborted and any later commits are dropped",event:`transform run exceeded its ${o}ms timeout and was retired`,remedy:"raise `timeout`, or make the transform abort-aware via its `signal`",scope:"activity",subject:t})),k(f))},o):X("activity")&&(d=setTimeout(()=>{!f.settled&&X("activity")&&O.info(...L({detail:"the activity sets no `timeout`, so it stays unbounded",event:"transform run pending for 5000ms",scope:"activity",subject:t}))},5e3))};return f=>{let z={buffer:r==="ordered"?[]:null,controller:new AbortController,resolveTracked:null,retired:!1,settled:!1};if(r==="serial"){Ae(new Promise(i=>{z.resolveTracked=i}),t);let E=()=>x(z,f);return void(g?c.push(E):(g=!0,E()))}r==="ordered"?n.push(z):(a&&!a.settled&&p(a),a=z),x(z,f)}},Jr=new WeakMap,Pr=new WeakMap,qe=(e,r)=>{let t=Jr.get(r),o=()=>{o.disposed||(t&&(t.active=o),e(r),t&&(t.active=null))};return o.memberships=new Set,o(),()=>{o.disposed||(o.disposed=!0,o.memberships?.forEach(a=>a.delete(o)),o.memberships?.clear())}},Wt=(e,r=(t,o)=>t!==o)=>{let t=Pr.get(e);t||(t=new Map,Pr.set(e,t));let o={active:null,deps:t},a=new Proxy(e,{get:function(n,c){return((g,p)=>{let k=g.active;if(!k||k.disposed)return;let x=g.deps.get(p);x||(x=new Set,g.deps.set(p,x)),x.has(k)||(x.add(k),k.memberships?.add(x))})(o,c),n[c]},set:function(n,c,g){let p=n[c];return r(p,g)&&(n[c]=g,((k,x)=>{k.deps.get(x)?.forEach(f=>f())})(o,c)),!0}});return Jr.set(a,o),a},Rr=(e,r)=>{X("updates")&&O.warn(...L({detail:r,event:"call-order mismatch",remedy:"call `own` unconditionally, in the same order, every render",scope:"own",subject:e.key?_("component",String(e.key)):void 0}))},Zr=new Set,Ht=e=>{let r;return()=>{r??=(e.refs??Zr).values();let t=r.next().value;return t||(t=Vt(),(e.refs??=new Set).add(t),t)}},Vt=()=>({onBeforeRender(e){this.beforeRender=e},onCreated(e){this.created=e},onMounted(e){this.mounted=e},onRendered(e){this.rendered=e},onUnmounted(e){this.unmounted=e}}),ne=(e,r={})=>{if(typeof e=="function"){let t;return Z(e)?t=e(r).root:t=e(),t instanceof W().NodeList?Array.from(t):(function(a){return a&&typeof a!="function"?a:""})(t)}return e instanceof W().NodeList?Array.from(e):e||e===0?e:""},Fe=e=>e instanceof W().Text?e:H().createTextNode(String(e)),jr=new WeakMap,qt={indexByKey:new Map,items:[]},we=e=>Array.isArray(e)?e[0]:e,De=e=>Array.isArray(e)?e:[e],Dt=(e,r,t)=>Array.isArray(e)?e.every((o,a)=>o.parentNode===t&&o.nextSibling===(e[a+1]??r)):e.parentNode===t&&e.nextSibling===r,Kt=([e,r],t)=>{let o=Array.isArray(e),a=o?jr.get(e)??(n=e,{indexByKey:new Map(n.map((u,y)=>[y,y])),items:n.map((u,y)=>({entry:u,key:y,ownsContext:!1}))}):qt;var n;let c=a.items,g=o?e[0]?.parentNode:e?.parentNode,p=c.length?De(c[c.length-1].entry).at(-1):void 0,k=o?p?.nextSibling??null:e??null,x;r.length||r.push(H().createTextNode(""));let f=[],z=new Uint8Array(c.length),E=0,i=!0,d=-1,m=new Map,h=[],l=r.map((u,y)=>{let S=((P,V)=>(Z(P)?P.key:void 0)??V)(u,y),$=xe(t,u,S),T=(P=>{let{Comment:V,Element:ge,HTMLElement:ve,SVGElement:wt}=W();return Array.isArray(P)?P.length?P.map(he=>he instanceof ge||he instanceof V?he:Fe(he)):[H().createTextNode("")]:P instanceof ve||P instanceof wt||P instanceof V?P:Fe(P)})(ne(u,$)),M=we(T),C=a.indexByKey.get(S),A=C!==void 0&&we(c[C].entry)===M?C:(K=M).parentNode?(x||(x=new Map,c.forEach(({entry:P},V)=>x.set(we(P),V))),x.get(K)??-1):-1;var K;let j=Z(F=u)||Array.isArray(F);var F;if(m.set(S,y),Array.isArray(T)?h.push(...T):h.push(T),A<0||z[A])return f.push(-1),{entry:T,key:S,ownsContext:j};let J=c[A];return z[A]=1,E+=1,f.push(A),i&&=A>d,d=A,J.entry===T&&J.key===S&&J.ownsContext===j?J:{entry:T,key:S,ownsContext:j}});if(jr.set(h,{indexByKey:m,items:l}),E<c.length&&c.forEach(({key:u,ownsContext:y},S)=>{!z[S]&&y&&!m.has(u)&&t&&pr(t,u)}),!E&&g&&Ft(g,o?e:e?[e]:[],h))return g.replaceChildren(Or(h)),h;E<c.length&&c.forEach(({entry:u},y)=>{!z[y]&&De(u).forEach(S=>S.remove())});let b=i?void 0:(u=>{let y=[],S=[],$=new Set;u.forEach((M,C)=>{if(M<0)return;let A=0,K=y.length;for(;A<K;){let j=A+K>>1;(u[y[j]??0]??0)<M?A=j+1:K=j}S[C]=A>0?y[A-1]??-1:-1,y[A]=C});let T=y[y.length-1]??-1;for(;T>=0;)$.add(T),T=S[T]??-1;return $})(f),w=k,s=[],v=()=>{if(!s.length||!g)return;let[u]=s;g.insertBefore(s.length===1&&u&&!Array.isArray(u)?u:Or(s.reverse().flatMap(De)),w),s.length=0};for(let u=l.length-1;u>=0;u--){let{entry:y}=l[u];(b?b.has(u):f[u]>-1)||!g||Dt(y,w,g)?(v(),w=we(y)??w):s.push(y)}return v(),!o&&e&&!h.includes(e)&&e.remove(),h},Or=e=>{let r=H().createDocumentFragment();for(let t=0;t<e.length;t+=1024)r.append(...e.slice(t,t+1024));return r},Ft=(e,r,t)=>r.length>0&&r.length===e.childNodes.length&&r.every(o=>o.parentNode===e)&&t.every(o=>o.parentNode!==e),_e=([e,r])=>{let t;return Array.isArray(e)?(t=e.splice(0,1)[0],e.forEach(o=>o.remove())):t=e,t&&!t.isSameNode(r)?(t.replaceWith(...Array.isArray(r)?r:[r]),r):t||r},Gr=(e,r,t)=>r instanceof W().Element?_e([e,r]):Array.isArray(r)?Kt([e,r],t):_e([e,Fe(r)]),D=(e,r,t={})=>{let o=new Map,a=typeof r=="function",n=a?r:q(r)?r?.transform:void 0,{concurrency:c="latest",deep:g=!1,force:p=!1,label:k,timeout:x}=a?t:r||{},{commit:f,dispatchWithForce:z,forceNow:E,value:i,valueProp:d}=((b,{deep:w,force:s})=>{let v=s,u=$=>Array.isArray($)?$.slice():q($)&&$.constructor.name==="Object"?Object.assign({},$):$,y=u(b),S=Wt({value:y},($,T)=>{let M=!1;return M=!!v||(w&&Array.isArray($)&&Array.isArray(T)?gr($,T):w&&q($)&&q(T)?vr($,T):$!==T),y=M?u(T):$,M});return{commit($){S.value=$},dispatchWithForce($,T){v=$,T(),v=s},forceNow:()=>v,value:()=>u(y),valueProp:S}})(e,{deep:g,force:p}),m=_("activity",k),h=Lt({commit:f,concurrency:c,subject:m,timeout:x});try{q(e)&&Object.freeze(e)}catch{}let l={bind:(b=w=>w)=>({[We]:!0,activity:l,select:b,watch:w=>qe(()=>w({value:d.value}),d)}),effect:b=>Object.assign(function(s={}){let v=()=>{let u=ee,y=u?me():0,S=o.get(s),$=S&&S({value:d.value});var T,M,C;s.root=(T=s.root,M=$,C=ur($)?xe(s,$,0):s,Gr(T,ne(M,C),C)),u&&u.rendered(s,me()-y)};if(s.ctxScopes=s.ctxScopes||new Map,s.activity=l,s.root&&o.has(s))o.set(s,b),v();else{o.set(s,b);let u=qe(v,d);s.teardowns=s.teardowns||new Set,s.teardowns.add(()=>{u(),o.delete(s)})}return s},{contextFunctionKind:"activity"}),initialValue:e,reset:()=>typeof n=="function"?h(b=>b(e)):f(e),update(b,w=E()){z(w,()=>typeof n=="function"?h((s,v)=>n({input:b,signal:v,update:s,value:i()})):f(b))},value:i,watch:b=>qe(()=>b({value:d.value}),d)};return zr(l,m),ee&&ee.activityCreated(l),l},_t=()=>{globalThis.loom={setDebug:Pe,devtools:{disable:Tr,enable:Le,open:Cr}}},Bt=({debug:e,debugScope:r,events:t,token:o})=>{e!==void 0&&Pe(e,r),t&&sr(t),o&&dr(o)},Ut=e=>{let{HTMLBodyElement:r,HTMLHeadElement:t}=W();if(e===null||e instanceof t||e instanceof r){let o=H().createElement("div");return o.id="loom-app",Ie(void 0,o,"prepend"),o}return e},Qr=({app:e,globalConfig:r={},onAppMounted:t,placement:o,root:a=H().body})=>{_t(),Bt(r);let n=e(),c=Ut(a);Ie(c,n,o),Ar(n),oe.observe(c),typeof t=="function"&&t(c)},Xt={attrs:"attrs",on:"on",props:"props"},Yt=e=>{let{Comment:r,HTMLElement:t,NodeFilter:o,SVGElement:a,Text:n}=W(),c=H().createTreeWalker(e,o.SHOW_ALL),g=[];for(;c.nextNode();){let f=c.currentNode;if(f instanceof t||f instanceof a){let z=Array.from(f.attributes).filter(E=>B.tokenRe.test(E.value));z.length&&g.push([f,z])}else(f instanceof n||f instanceof r)&&B.tokenRe.test(f.textContent||"")&&g.push([f,[]])}let p=[],k=[];g.forEach(([f,z])=>{if(z.length){let E=k.push(f)-1;z.forEach(i=>{let d=(m=>{if(m[0]!=="$")return{kind:"attr",name:m};let h=m.slice(1),l=Xt[h]??(B.events.includes(h)?"event":"custom");return l==="custom"?{kind:l,name:h,prop:hr(h)}:{kind:l,name:h}})(i.name);d.kind!=="attr"&&f.removeAttribute(i.name),p.push({...d,node:E})})}else(E=>{let i=H(),d=(E.textContent??"").split(B.TOKEN),m=[],h=[];return d.forEach((l,b)=>{if(l&&h.push(i.createTextNode(l)),b<d.length-1){let w=i.createTextNode(B.TOKEN);m.push(w),h.push(w)}}),E.replaceWith(...h),m})(f).forEach(E=>{p.push({kind:"text",name:"",node:k.push(E)-1})})});let x=k.map(f=>((z,E)=>{let i=[];for(;z!==E;){let d=0,m=z.previousSibling;for(;m;)d+=1,m=m.previousSibling;i.unshift(d),z=z.parentNode}return i})(f,e));return{entries:p,steps:x.map((f,z)=>((E,i)=>{let d=0;for(;d<E.length&&E[d]===i[d];)d+=1;return d===E.length?[0,0,...i.slice(d)]:[E.length-d-1,i[d]-E[d],...i.slice(d+1)]})(z?x[z-1]:[],f))}},Nr=(e,r,t)=>{let o=ne(t);if(o||o===0)switch(!0){case(r==="type"&&o==="number"&&isNaN(e.value)):e.value="",e.setAttribute(r,String(o));break;case r==="value":e.value=String(o);break;case(r==="style"&&Array.isArray(o)):Ee(e,()=>et(e,o));break;case(r==="style"&&q(o)):Ee(e,()=>Object.entries(o).forEach(([a,n])=>{(n||n===0)&&e.style.setProperty(a,String(n))}));break;default:e.setAttribute(r,String(o))}else e.removeAttribute(r)},Ee=(e,r)=>{e.style.cssText="",r(),e.getAttribute("style")||e.removeAttribute("style")},et=(e,r)=>{let t=o=>{typeof o=="string"?o.split(";").forEach(a=>{if(a){let[n,c]=a.split(":"),g=n?.trim(),p=c?.trim();p&&g&&e.style.setProperty(g,p)}}):typeof o!="function"||Z(o)?q(o)&&Object.entries(o).forEach(([a,n])=>{(n||n===0)&&e.style.setProperty(a,String(n))}):t(o())};r.flat().forEach(t)},Ir=(e,r,t,o,a)=>{if(typeof t=="function"&&e.removeEventListener(r,t,!1),typeof o=="function")return e.addEventListener(r,o,!1),o;o&&O.warn(...L({detail:`${JSON.stringify(o)} is neither falsy nor an event listener, so nothing was bound (non-breaking)`,event:"unexpected special-attribute value",remedy:"pass an event-listener function, or a falsy value to skip binding",scope:"templating",subject:_("attr",a)}))},Mr=({appendProps:e=!0,attrName:r,element:t,newProps:o})=>{let a=t;a.isWebComponent?o&&q(o)?e?Object.assign(a.props,o):Object.assign(o,a.props):o&&O.warn(...L({detail:"the value must be an object literal, so it was ignored",event:"ignored a non-object value",remedy:"pass an object literal",scope:"templating",subject:_("attr",r)})):o&&O.warn(...L({detail:`${r} was set, but the element is not a registered custom element`,event:"ignored props",remedy:"register it with `defineElement`, and import its module before this template renders",scope:"templating",subject:_("element",`<${t.tagName?.toLowerCase()}>`)}))},Lr=(e,r,t)=>{let o=ne(t);if(o||o===0)switch(!0){case(r==="className"&&typeof o=="string"):o&&e.setAttribute("class",o);break;case(r==="style"&&Array.isArray(o)):Ee(e,()=>et(e,o));break;case(r==="style"&&q(o)):Ee(e,()=>Object.entries(o).forEach(([a,n])=>{(n||n===0)&&e.style.setProperty(a,String(n))}));break;default:e.setAttribute(r,String(o))}else e.removeAttribute(r==="className"?"class":r)},Wr=e=>O.warn(...L({detail:"the value must be an object literal, so it was ignored",event:"ignored a non-object value",remedy:"pass an object literal",scope:"templating",subject:_("attr",e)})),Jt={attr:(e,{name:r},t,o)=>{let a=e.node,n=e.state;n&&(n(),o.teardowns?.delete(n),e.state=void 0),He(t)?e.state=Ve(c=>Nr(a,r,c),t,o):Nr(a,r,t)},attrs:(e,r,t,o)=>{if(!t||!q(t))return void(t&&Wr("$attrs"));let a=e.node;Object.entries(t).forEach(([n,c])=>{let g=e.state,p=g?.get(n);if(p&&(p(),o.teardowns?.delete(p),g?.delete(n)),He(c)){let k=Ve(x=>Lr(a,n,x),c,o);return void(e.state??=new Map).set(n,k)}Lr(a,n,c)})},custom:(e,{name:r,prop:t},o)=>{let a=e.node;if(a.isWebComponent)Mr({attrName:`$${r}`,element:a,newProps:{[t]:o}});else{let n=ne(o);n||n===0?a.setAttribute(r,String(n)):a.removeAttribute(r)}},event:(e,{name:r},t)=>{e.state=Ir(e.node,r,e.state,t,`$${r}`)},on:(e,r,t)=>{if(!t||!q(t))return void(t&&Wr("$on"));let o=e.node;Object.entries(t).forEach(([a,n])=>{if(!B.events.includes(a))return;let c=e.state??=new Map,g=c.get(a);if(g===n)return;let p=Ir(o,a,g,n,"$on");p?c.set(a,p):c.delete(a)})},props:(e,r,t)=>{Mr({appendProps:!1,attrName:"$props",element:e.node,newProps:t})},text:(e,r,t,o,a)=>{let n=xe(o,t,a),c=ne(t,n),{Element:g,Text:p}=W();if(c instanceof g||c instanceof p||Array.isArray(c))return e.node=Gr(e.node,c,n),void(e.state=void 0);let k=e.state;if(k&&e.node===k)return void(k.data=String(c));let x=H().createTextNode(String(c));e.node=_e([e.node,x]),e.state=x}},Hr=(e,r,t,o,a)=>Jt[r.kind](e,r,t,o,a),ue=/[A-Za-z_]/,Zt=/[A-Za-z0-9_-]/,Vr=/[\s/>]/,Be=/^(?:area|base|br|col|embed|hr|img|input|link|meta|param|source|track|wbr)$/,qr="unexpected interpolation in the attribute region \u2014 an interpolated value must immediately follow `name=`",Dr="a slot label must be a static, non-empty quoted string",N=(e,r)=>{throw new Error(`[loom] Component element syntax error: ${e}${r?` near: \`${r}\``:""}`)},I=(e,r)=>e.slice(Math.max(0,r-24),r+24),re=(e,r)=>{let t=r;for(;t<e.length&&Zt.test(e[t]);)t++;return t},Gt=/^(?:script|style|textarea|title)$/,Qt=/[ \t\f]*[\n\r][ \t\n\r\f]*/g,eo=/[\n\r]/,ro=(e,r,t)=>e.replace(Qt,(o,a)=>{let n=a===0&&r==="boundary",c=a+o.length===e.length&&t==="boundary";return n||c?"":" "}),to=(e,r)=>{let t=e.indexOf("<",r);for(;t>-1;){let o=e[t+1];if(o!==void 0&&(o==="/"||o==="!"||ue.test(o)))return t;t=e.indexOf("<",t+1)}return-1},oo=e=>{if(!e.some(x=>eo.test(x)))return e;let r=e.length-1,t="boundary",o=!1,a=!1,n=null,c=0,g=null,p=null,k=e.map((x,f)=>{let z=x.length,E="",i=0,d=m=>{E+=x.slice(i,m),i=m};for(;i<z;){if(o){let v=x.indexOf("-->",i);o=v===-1,d(o?z:v+3);continue}if(a){if(g){let u=x.indexOf(g,i);u===-1?d(z):(g=null,d(u+1));continue}let v=x[i];if(v==='"'||v==="'")g=v;else if(v===">"){let u=n&&x[i-1]!=="/"&&!Be.test(n)?n:null;u==="pre"&&c++,u&&Gt.test(u)&&(p=u),t=u?"boundary":"content",n=null,a=!1}d(i+1);continue}if(p){let v=x.toLowerCase().indexOf(`</${p}`,i);if(v===-1){d(z);continue}p=null,d(v)}let m=to(x,i),h=m===-1?z:m;if(h>i){let v=x.slice(i,h),u=m===-1?f===r:x[m+1]==="/",y=c?v:ro(v,t,u?"boundary":"content");y&&(t="content"),E+=y,i=h}if(m===-1)continue;if(x.startsWith("<!--",m)){t="content",o=!0,d(m+4);continue}let l=x[m+1]==="/",b=m+(l?2:1),w=re(x,b),s=x.slice(b,w).toLowerCase();l&&s==="pre"&&c&&c--,n=l||!s?null:s,a=!0,d(w)}return f<r&&!a&&!o&&!p&&(t="content"),E});return k.some((x,f)=>x!==e[f])?k:e},Kr=()=>({getters:[],statics:[""]}),rt=new WeakSet,ao=e=>rt.has(e),Y=(e,r)=>{e.statics[e.statics.length-1]+=r},ye=(e,r)=>{e.getters.push(r),e.statics.push("")},ze=(e,r)=>{let t=e.slotRegions||=new Map,o=t.get(r);return o||t.set(r,o={getters:[],statics:[""]}),o},Fr=(e,r)=>{(a=>{rt.add(a.statics)})(e);let t=e.statics,o=R((a,{values:n=[]})=>a(t,...n),{name:r});return{getters:e.getters,synth:o}},_r=e=>{let{props:r,region:t,slotRegions:o,tagIndex:a}=e,n=t&&(t.getters.length||t.statics.some(g=>g.trim()))?Fr(t,"children"):null,c=o?Array.from(o,([g,p])=>[g,Fr(p,`slot:${g}`)]):null;return g=>{let p=g[a];typeof p!="function"&&N(`the component tag value at interpolation #${a} is not callable`);let k=f=>f.synth({values:f.getters.map(z=>z(g))}),x={};if(r.forEach(([f,z])=>{f===null?Object.assign(x,z(g)):x[f]=z(g)}),n&&(x.children=k(n)),c){let f={};c.forEach(([z,E])=>{f[z]=k(E)}),x.slots=f}return p(x)}},no=(e,r)=>{let t={getters:[],statics:[""]},o=[],a=t,n=null,c=null,g=!1,p=!1,k=null,x=i=>{let d=k,m=o[o.length-1],h=!i&&!Be.test(d.name);if(k=null,d.buffer){let w=d.label?ze(m,d.label):m.region;l=w,b=d.buffer,Y(l,b.statics[0]),b.getters.forEach((s,v)=>{ye(l,s),Y(l,b.statics[v+1])}),a=m.region,h&&(m.tagStack.push(d.name),d.label&&(m.activeSlot=d.label,a=w))}else h&&m.tagStack.push(d.name);var l,b},f=(i,d,m,h)=>{let l=k,b=i.length,w=d,s=u=>(Y(a,i.slice(m,u)),u),v=()=>N(Dr,I(i,w));for(;w<b;){let u=i[w];if(l.quote){let y=i.indexOf(l.quote,w);if(y===-1)return s(b);l.quote=null,w=y+1;continue}if(l.inValue){if(!/[\s>]/.test(u)){w++;continue}l.inValue=!1}if(u===">")return w++,s(w),x(i[w-2]==="/"),w;if(u!=='"'&&u!=="'"){if(l.buffer&&ue.test(u)){let y=re(i,w+1),S=i.slice(w,y)==="slot",$=i[y];if($==="="){let T=i[y+1];if(T==='"'||T==="'"){if(S){let M=i.indexOf(T,y+2),C=M>-1?i.slice(y+2,M):"";C||v(),l.label=C,w=M+1}else l.quote=T,w=y+2;continue}if(T===void 0)return S&&h!==r&&v(),s(b);S&&v(),l.inValue=!0,w=y+1;continue}!S||$===void 0&&h===r||v(),w=y;continue}w++}else l.quote=u,w++}return s(b)},z=(i,d)=>{let m=n,h=i.length,l=0,b=()=>N(Dr,I(i,l));if(p){let w=i[l];w===void 0||Vr.test(w)||N("the component tag and interpolated prop values must be followed by whitespace, `/>`, or `>`",I(i,0)),p=!1}for(;l<h;){let w=i[l];if(/\s/.test(w))l++;else{if(w==="/"){if(i[l+1]===">")return n=null,ye(m.slotLabel?ze(o[o.length-1],m.slotLabel):a,_r(m)),l+2;N("unexpected `/` in the attribute region",I(i,l))}if(w===">")return m.region=Kr(),o.push(m),a=m.region,n=null,l+1;if(w==="$"){let s=re(i,l+1);N(`component props take no \`$\` sigil \u2014 write \`${i.slice(l+1,s)}\`, not \`${i.slice(l,s)}\``,I(i,l))}if(i.startsWith("...",l))return l+3!==h&&N("`...` must immediately precede an interpolated value \u2014 write `...${object}`",I(i,l)),d===r&&N("unterminated component element",I(i,l)),g=!0,h;if(ue.test(w)){let s=re(i,l+1),v=i.slice(l,s),u=i[s],y=v==="slot"&&o.length>0&&!o[o.length-1].tagStack.length;if(u==="="){let S=i[s+1];if(S==='"'||S==="'"){let $=i.indexOf(S,s+2);$===-1&&N("a quoted attribute value must open and close within the same chunk (no interpolations inside quotes)",I(i,s));let T=i.slice(s+2,$);y?(T||b(),m.slotLabel=T):m.props.push([v,()=>T]),l=$+1;continue}if(s+1===h)return d===r&&N("unterminated component element",I(i,l)),y&&b(),c=v,h;N(`unquoted attribute value for \`${v}\` \u2014 use quotes or an interpolation`,I(i,s))}if(u===void 0)return d===r&&N("unterminated component element",I(i,l)),N(qr,I(i,l));if(Vr.test(u)){y&&b(),m.props.push([v,()=>!0]),l=s;continue}N(`unexpected character \`${u}\` after attribute \`${v}\``,I(i,s))}N(`unexpected character \`${w}\` in the attribute region`,I(i,l))}}return d===r&&N("unterminated component element",I(i,h-1)),N(qr,I(i,h-1))},E=(i,d,m)=>{let h=i.length,l=d;if(k&&(l=f(i,l,l,m),k))return!1;for(;l<h;){let b=i.indexOf("<",l);if(b===-1)return Y(a,i.slice(l)),!1;Y(a,i.slice(l,b));let w=i[b+1];if(w===void 0)return m===r?(Y(a,"<"),!1):(n={props:[],region:null,tagIndex:m,tagStack:[]},p=!0,!0);if(w==="/"){let s=i[b+2];if(s===">"){let v=o.pop();v||N("unmatched `</>` \u2014 no component element is open",I(i,b));let u=v,y=o.length?o[o.length-1]:null;a=y?y.activeSlot?ze(y,y.activeSlot):y.region:t,ye(u.slotLabel&&y?ze(y,u.slotLabel):a,_r(u)),l=b+3;continue}if(s==="/"&&N("`<//>` is not an accepted closing form \u2014 close with `</>`",I(i,b)),s===void 0&&m!==r&&N("`</${\u2026}>` is not an accepted closing form \u2014 close with `</>`",I(i,b)),o.length){let v=o[o.length-1],u=i.indexOf(">",b+2);if(u>-1&&v.tagStack.length){let y=i.slice(b+2,u).trim().toLowerCase(),S=v.tagStack.lastIndexOf(y);S>-1&&(v.tagStack.length=S),Y(a,i.slice(b,u+1)),!v.tagStack.length&&v.activeSlot&&(v.activeSlot=null,a=v.region),l=u+1;continue}}Y(a,"</"),l=b+2;continue}if(o.length&&ue.test(w)){let s=re(i,b+2);if(k={buffer:!o[o.length-1].tagStack.length?Kr():null,name:i.slice(b+1,s).toLowerCase()},k.buffer&&(a=k.buffer),l=f(i,s,b,m),k)return!1;continue}Y(a,"<"),l=b+1}return!1};for(let i=0;i<e.length;i++){let d=e[i],m=0,h=!1;if(n){if(c){let l=i-1,b=c;n.props.push([b,w=>w[l]]),c=null,p=!0}else if(g){let l=i-1;n.props.push([null,b=>b[l]]),g=!1,p=!0}m=z(d,i)}if(n||(h=E(d,m,i)),i<r&&!h&&!n){let l=i;ye(a,b=>b[l])}}return o.length&&N("unclosed component element \u2014 expected `</>`"),t},io=e=>{let{Node:r}=W(),t=0;for(let o of Array.from(e.childNodes))switch(!0){case o.nodeType===r.ELEMENT_NODE:t++;break;case(o.nodeType===r.TEXT_NODE&&!o.textContent?.trim()):break;default:return!0}return t!==1},lo=/^(?:caption|col|colgroup|tbody|td|tfoot|th|thead|tr)$/,so=/^(?:caption|col|colgroup|table|tbody|td|tfoot|th|thead|tr)$/,co=/^(?:colgroup|table|tbody|tfoot|thead|tr)$/,po=/<\/?(?:caption|col|colgroup|table|tbody|td|tfoot|th|thead|tr)[\s/>]/i,Ke=/^(?:td|th)$/,mo=/^(?:td|th|tr)$/,Br=/^(?:tbody|tfoot|thead)$/,Ur=new Map,Xr=new WeakSet;function uo(e,...r){let t=this,o=Ur.get(e);if(!o){let i=(d=>{let m=d.length-1,h=!1;for(let b=0;b<m;b++){let w=d[b];if(w.endsWith("<")||w.endsWith("</")){h=!0;break}}if(!h)return null;let l=no(d,m);return{chunks:l.statics,getters:l.getters}})(e);o={documentCache:new WeakMap,plan:i,statics:oo(i?i.chunks:e)},Ur.set(e,o)}let{documentCache:a,plan:n,statics:c}=o,g=H(),p=a.get(g);if(!p){let i=(m=>{let h=new Set;if(!m.some(C=>po.test(C)))return{hasTableMarkup:!1,rootIsTablePart:!1,tableContentTokens:h};let l=[],b=m.length-1,w=!1,s=null,v=!1,u=!1,y=null,S=null,$=()=>l[l.length-1],T=C=>{for(;C.test($()??"");)l.pop()},M=C=>{Ke.test(C)?T(Ke):C==="tr"?(T(Ke),$()==="tr"&&l.pop()):(Br.test(C)||C==="caption")&&(T(mo),Br.test($()??"")&&l.pop())};for(let C=0;C<m.length;C++){let A=m[C],K=A.length,j=0;for(;j<K;){if(v){let P=A.indexOf("-->",j);P===-1?j=K:(v=!1,j=P+3);continue}if(u){if(y){let V=A.indexOf(y,j);V===-1?j=K:(y=null,j=V+1);continue}let P=A[j];P==='"'||P==="'"?y=P:P===">"&&(S&&A[j-1]!=="/"&&!Be.test(S)&&l.push(S),S=null,u=!1),j++;continue}let F=A.indexOf("<",j);if(F===-1){j=K;continue}if(A.startsWith("<!--",F)){v=!0,j=F+4;continue}let J=A[F+1];if(J==="/"){let P=re(A,F+2),V=A.slice(F+2,P).toLowerCase(),ge=l.lastIndexOf(V);ge>-1&&(l.length=ge);let ve=A.indexOf(">",P);ve===-1?(u=!0,j=K):j=ve+1;continue}if(J!==void 0&&ue.test(J)){let P=re(A,F+2),V=A.slice(F+1,P).toLowerCase();s===null&&(s=lo.test(V)),so.test(V)&&(w=!0),M(V),u=!0,S=V,j=P;continue}j=F+1}C<b&&!u&&!v&&co.test($()??"")&&h.add(C)}return{hasTableMarkup:w,rootIsTablePart:s??!1,tableContentTokens:h}})(c),d;if(i.hasTableMarkup){let m=g.createElement("template");m.innerHTML=c.map((h,l)=>l<c.length-1?h+(i.tableContentTokens.has(l)?`<!--${B.TOKEN}-->`:B.TOKEN):h).join(""),d=m.content}else d=g.createRange().createContextualFragment(c.join(B.TOKEN));p={fragment:d,isFragment:ao(e)||io(d),plan:Yt(d)},a.set(g,p)}let k=n?n.getters.map(i=>i(r)):r,{fragment:x,isFragment:f,plan:z}=p,E=(Array.isArray(t.root)?t.root[0]?.parentElement:t.root)??null;if(t.chunks===e&&Xr.has(t)&&(H().contains(E)||Re(E))){let i=X("updates");oe.preRender(t),i&&O.groupCollapsed(...L({event:"updating",scope:"updates",subject:t.key?_("component",String(t.key)):void 0}),Q(t)),t.slots.forEach((d,m)=>{let h=k[m];i&&O.info({newValue:h,oldValue:d.value}),((l,b)=>{switch(!0){case(l instanceof W().Node&&b instanceof W().Node):return!l.isSameNode(b);case(Z(l)&&Z(b)):return!0;case(q(l)&&q(b)):return Ne(l,b);default:return l!==b}})(d.value,h)&&(d.value=h,Hr(d,z.entries[m],h,t,m))}),i&&O.info("completed",Q(t)),i&&O.groupEnd()}else{let i=g.importNode(x,!0);t.chunks=e,f?(t.fragment=!0,t.root=Array.from(i.childNodes)):t.root=i.firstElementChild,oe.creation(t),oe.preRender(t),t.slots=((d,m)=>{let h=[];return d.steps.forEach((l,b)=>{h.push(((w,s)=>{let v=w;for(let u=0;u<s[0];u++)v=v.parentNode;for(let u=0;u<s[1];u++)v=v.nextSibling;for(let u=2;u<s.length;u++){v=v.firstChild;for(let y=0;y<s[u];y++)v=v.nextSibling}return v})(b?h[b-1]:m,l))}),d.entries.map(({kind:l,node:b})=>{let w=h[b];return{node:w,state:l==="text"?w:void 0,value:void 0}})})(z,i),t.slots.forEach((d,m)=>{d.value=k[m],Hr(d,z.entries[m],d.value,t,m)}),f&&(t.root=Array.from(i.childNodes)),Xr.add(t)}return oe.postRender(t),t}var Yr=new WeakMap,R=(e,{name:r}={})=>{let t=(o={})=>{function a(n={},c=!1){let g=n.ctxScopes?n.ctxScopes.get(e):null,p=g||(n.ctxScopes?{}:n),k=!n.root||g===void 0,x=Yr.get(p);if(!c&&!k&&!o.ref&&x&&p.fingerPrint===e&&je(p)&&((m,h)=>{let l=0;for(let b in h)if(b!=="ref"&&Object.hasOwn(h,b)){if(!(b in m)||!Object.is(m[b],h[b]))return!1;l+=1}for(let b in m)b!=="ref"&&Object.hasOwn(m,b)&&(l-=1);return l===0})(x,o))return p;if(k){let m=o.ref;p.arrayChildren&&=void 0,p.children&&=void 0,p.refs&&=void 0,p.fragment=!1,p.fingerPrint=e,kr(p),p.node=()=>p.root,p.render=uo.bind(p),p.owned&&=void 0,m&&(p.ref=m,p.ref.node=p.node,!c&&delete o.ref),n.ctxScopes&&(p.parent=n,n.ctxScopes.set(e,p))}p.key=o.key;let f={...o,children:Array.isArray(o.children)?o.children.flat():o.children};if(p.props=f,c)return p;let z=ee,E=z?me():0,i=(m=>{let h=0;return{own(l){let b=m.owned??(m.owned={sealed:!1,values:[]}),w=h++;if(w<b.values.length)return b.values[w];if(b.sealed)return Rr(m,`re-render call ${w+1} overran the ${b.values.length} cached on first render; its value cannot survive re-renders`),l();let s=l();return b.values.push(s),s},settle(){let l=m.owned;l&&(l.sealed&&h<l.values.length&&Rr(m,`re-render made ${h} of the ${l.values.length} calls cached on first render`),l.sealed=!0)}}})(p);p.registering&&=void 0;let d=e(p.render,{...f,...xr(p),createRef:Ht(p),ctxRefs:()=>(p.refs??Zr).values(),node:p.node,own:i.own});return i.settle(),p.registering&&=void 0,Yr.set(p,o),z&&z.rendered(p,me()-E),d}return a.contextFunctionKind="component",a.key=o.key,a};return Er(t,e,r),t};var Ue="loom-devtools";var bo=e=>typeof e=="object"&&e!==null&&e.source===Ue&&typeof e.type=="string",ot=e=>({...e,protocol:1,source:Ue}),at=e=>({listen(r,t){let o=({data:a,origin:n,source:c})=>{c&&n===e.origin&&bo(a)&&r(c)&&t(a,c)};return e.addEventListener("message",o),()=>e.removeEventListener("message",o)},post(r,t){r.postMessage(t,e.origin)}});var go=500,$e=class extends Error{constructor(t){super(t.message);this.error=t}error},nt=(e,r)=>{let t=at(e),o=new Map,a=new Map,n=new Set,c=new Set,g,p=0,k,x=(d,m,h)=>t.post(r,ot({id:h,kind:"request",payload:m,session:g??"",type:d})),f=d=>{let m=g!==void 0;g=void 0,o.forEach(({reject:h})=>h(new Error("disconnected"))),o.clear(),c.forEach(h=>h(d)),m&&d?.code!=="protocol-mismatch"&&i()},z=d=>{if(d.kind==="response"&&d.id!==void 0){let m=o.get(d.id);o.delete(d.id),d.error?m?.reject(new $e(d.error)):m?.resolve(d.payload);return}d.kind!=="event"||d.session!==g||(d.type==="goodbye"?f():a.get(d.type)?.forEach(m=>m(d.payload)))};t.listen(d=>d===r,d=>{g!==void 0&&d.session!==g&&d.type!=="hello"?f():z(d)});let E=(d,m)=>new Promise((h,l)=>{let b=++p;o.set(b,{reject:l,resolve:h}),x(d,m,b)}),i=()=>{let d;clearTimeout(k);let m=()=>{let h=++p;d!==void 0&&o.delete(d),d=h,o.set(h,{reject:l=>{l instanceof $e&&(clearTimeout(k),c.forEach(b=>b(l.error)))},resolve:l=>{let b=l;g===void 0&&(clearTimeout(k),g=b.session,n.forEach(w=>w(b)))}}),x("hello",{protocol:1},h),k=setTimeout(m,go)};m()};return{connect:i,on(d,m){let h=a.get(d)??new Set;h.add(m),a.set(d,h)},onConnected(d){n.add(d)},onDisconnected(d){c.add(d)},request:E}};var be=e=>e.map(String).join("."),it=e=>{let r=D({placement:"unknown",status:"connecting"}),t=D("components"),o=D({nodes:new Map,rootIds:[]}),a=D(new Set),n=D(void 0),c=D(void 0),g=D(new Map),p=D(new Set),k=D([]),x=D(new Map),f=D({flash:!1,perf:!1,picking:!1}),z=D(""),E=()=>{let{flash:s,perf:v}=f.value();return["activities","renders","tree",...s?["flash"]:[],...v?["perf"]:[]]},i=s=>z.update(s instanceof Error?s.message:String(s)),d=async()=>{let{nodes:s,rootIds:v}=await e.request("tree.get");o.update({nodes:new Map(s.map(y=>[y.id,y])),rootIds:v});let u=n.value();u!==void 0&&!s.some(({id:y})=>y===u)?l(void 0):u!==void 0&&m()},m=async()=>{let s=n.value();if(s===void 0){c.update(void 0);return}let v=await e.request("node.inspect",{id:s});"kind"in v&&n.value()===s&&c.update(v)},h=async()=>{k.update((await e.request("activity.list")).activities)},l=s=>{n.update(s),g.update(new Map),p.update(new Set),c.update(void 0),e.request("select",{id:s??null}).catch(i),s!==void 0&&m().catch(i)};e.onConnected(async s=>{r.update({placement:s.placement,status:"connected"}),z.update("");try{await e.request("subscribe",{topics:E()}),await Promise.all([d(),h()]),s.selectedId!==void 0&&l(s.selectedId)}catch(v){i(v)}}),e.onDisconnected(s=>r.update({message:s?.message,placement:r.value().placement,status:s?.code==="protocol-mismatch"?"refused":"connecting"}));let b;return e.on("tree.changed",()=>{b??=Promise.resolve().then(d).catch(i).finally(()=>b=void 0)}),e.on("renders",({entries:s})=>{let v=new Map(x.value());s.forEach(({id:u})=>v.set(u,(v.get(u)??0)+1)),x.update(v)}),e.on("activity.changed",({id:s,pending:v,value:u})=>{let y=k.value();y.some($=>$.id===s)?k.update(y.map($=>$.id===s?{...$,pending:v,value:u}:$)):h().catch(i);let S=c.value();S?.activities.some($=>$.id===s)&&c.update({...S,activities:S.activities.map($=>$.id===s?{...$,pending:v,value:u}:$)})}),e.on("selected",({id:s})=>{t.update("components"),l(s)}),e.on("pick.ended",()=>f.update({...f.value(),picking:!1})),{activities:k,collapsed:a,connection:r,details:c,expansions:g,notice:z,openPaths:p,renderCounts:x,selectedId:n,tab:t,toggles:f,tree:o,actions:{close:()=>e.request("close").catch(i),editActivity:async(s,v)=>{try{await e.request("activity.update",{id:s,input:JSON.parse(v)}),z.update("")}catch(u){i(u instanceof SyntaxError?`Not JSON: ${u.message}`:u)}},expand:async s=>{let[v,...u]=s,y=typeof v=="string"&&v.startsWith("a")?await e.request("activity.inspect",{id:Number(v.slice(1)),path:u}):await e.request("node.inspect",{id:n.value(),path:s});if("value"in y){let S=new Map(g.value());S.set(be(s),y.value),g.update(S)}},highlight:s=>e.request("highlight",{id:s}).catch(i),log:s=>e.request("log",{id:s}).catch(i),popOut:()=>e.request("open",{placement:"popup"}).catch(i),dock:()=>e.request("open",{placement:"dock"}).catch(i),resetActivity:s=>e.request("activity.reset",{id:s}).catch(i),reveal:s=>e.request("reveal",{id:s}).catch(i),select:l,setTab:s=>t.update(s),setToggle:async(s,v)=>{f.update({...f.value(),[s]:v});try{s==="picking"?await e.request("pick",{on:v}):await e.request("subscribe",{topics:E()})}catch(u){i(u)}},togglePath:s=>{let v=new Set(p.value()),u=be(s);v.has(u)?v.delete(u):v.add(u),p.update(v)},toggleCollapsed:s=>{let v=new Set(a.value());v.has(s)?v.delete(s):v.add(s),a.update(v)}}}};var ie=(e,r)=>{let t=()=>r(...e.map(a=>a.value())),o=D(t());return e.forEach(a=>a.watch(()=>o.update(t()))),o};var Xe=R((e,{isOn:r,label:t,name:o,state:a,title:n})=>e`
+        <button
+            aria-pressed=${r?"true":"false"}
+            class=${`hud-button ${r?"is-on":""}`}
+            $click=${()=>a.actions.setToggle(o,!r)}
+            title=${n}
+            type="button"
+        >
+            ${t}
+        </button>
+    `,{name:"ToggleButton"}),lt=R((e,{label:r,selected:t,state:o,tab:a})=>e`
+        <button
+            aria-selected=${t?"true":"false"}
+            class=${`hud-tab ${t?"is-selected":""}`}
+            $click=${()=>o.actions.setTab(a)}
+            role="tab"
+            type="button"
+        >
+            ${r}
+        </button>
+    `,{name:"TabButton"}),st={connected:"connected",connecting:"waiting for the page\u2026",refused:"version conflict"},ct=R((e,{own:r,state:t})=>{let o=r(()=>ie([t.connection,t.tab,t.toggles,t.notice],(a,n,c,g)=>({connection:a,notice:g,tab:n,toggles:c})));return e`
+            <header class="hud-header">
+                ${o.effect(({value:{connection:a,notice:n,tab:c,toggles:g}})=>[vo({connection:a,state:t,tab:c,toggles:g}),n?fo({key:"notice",text:n}):""])}
+            </header>
+        `},{name:"Header"}),vo=R((e,{connection:r,state:t,tab:o,toggles:a})=>e`
+        <div class="hud-bar">
+            <span class="hud-brand">loom</span>
+            <span
+                class=${`hud-status is-${r.status}`}
+                title=${r.message??st[r.status]}
+            >
+                ${st[r.status]}
+            </span>
+            <nav class="hud-tabs" role="tablist">
+                ${lt({label:"Components",selected:o==="components",state:t,tab:"components"})}
+                ${lt({label:"Activities",selected:o==="activities",state:t,tab:"activities"})}
+            </nav>
+            <span class="hud-spacer"></span>
+            ${Xe({label:"Pick",name:"picking",isOn:a.picking,state:t,title:"Pick a component in the page"})}
+            ${Xe({label:"Flash renders",name:"flash",isOn:a.flash,state:t,title:"Outline each component as it renders"})}
+            ${Xe({label:"Perf tracks",name:"perf",isOn:a.perf,state:t,title:"Record renders and commits on a loom track in the Performance panel"})}
+            ${ho({placement:r.placement,state:t})}
+            <button
+                aria-label="Close devtools"
+                class="hud-button"
+                $click=${()=>t.actions.close()}
+                type="button"
+            >
+                ✕
+            </button>
+        </div>
+    `,{name:"HeaderBar"}),ho=R((e,{placement:r,state:t})=>e`
+        <button
+            class="hud-button"
+            $click=${()=>r==="popup"?t.actions.dock():t.actions.popOut()}
+            type="button"
+        >
+            ${r==="popup"?"Dock":"Pop out"}
+        </button>
+    `,{name:"PlacementButton"}),fo=R((e,{text:r})=>e`
+        <p class="hud-notice" role="status">${r}</p>
+    `,{name:"Notice"});var dt=e=>JSON.stringify(e),mt=e=>{switch(e.t){case"str":return e.length?`${dt(e.v)}\u2026 (${e.length} chars)`:dt(e.v);case"num":case"bool":return String(e.v);case"bigint":return`${e.v}n`;case"symbol":return`Symbol(${e.v})`;case"date":return`Date ${e.v}`;case"fn":return`\u0192 ${e.name}()`;case"error":return`${e.name}: ${e.message}`;case"array":return`Array(${e.length})`;case"object":return`${e.ctor?`${e.ctor} `:""}{${e.size?"\u2026":""}}`;case"map":return`Map(${e.size})`;case"set":return`Set(${e.size})`;case"node":return`<${e.tag}>`;case"activity":return e.name;case"component":return`<${e.name} />`;default:return e.t}},ko=e=>e.t==="array"&&e.length>0||(e.t==="object"||e.t==="map"||e.t==="set")&&e.size>0,pt=e=>{switch(e.t){case"array":return e.items?.map((r,t)=>[String(t),t,r]);case"object":return e.entries?.map(([r,t])=>[r,r,t]);case"map":return e.entries?.map(([r,t],o)=>[mt(r),o,t]);case"set":return e.entries?.map(([,r],t)=>[String(t),t,r]);default:return}},le=R((e,{context:r,label:t,path:o,value:a})=>{let n=be(o),c=r.expansions.get(n)??a,g=ko(c),p=g&&r.openPaths.has(n),k=p?pt(c):void 0,x=()=>{r.onToggle(o),!p&&!pt(c)&&r.onExpand(o)},f=c.t==="node"?c.id:void 0;return e`
+            <li class="value-row">
+                <div class="value-line">
+                    <button
+                        class=${`value-toggle ${g?"":"is-hidden"}`}
+                        $click=${x}
+                        type="button"
+                    >
+                        ${p?"\u25BE":"\u25B8"}
+                    </button>
+                    <span class="value-key">${t}</span>
+                    <span
+                        class=${`value-preview is-${c.t} ${f?"is-link":""}`}
+                        $click=${f?()=>r.onSelectNode(f):void 0}
+                    >
+                        ${mt(c)}
+                    </span>
+                </div>
+                ${p?xo({context:r,items:k??[],path:o}):""}
+            </li>
+        `},{name:"ValueRow"}),xo=R((e,{context:r,items:t,path:o})=>e`
+            <ul class="value-list">
+                ${t.map(([a,n,c])=>le({context:r,key:be([...o,n]),label:a,path:[...o,n],value:c}))}
+            </ul>
+        `,{name:"ValueChildren"});var G=Symbol("incomplete"),Ye=e=>{switch(e.t){case"null":return null;case"bool":return e.v;case"num":return typeof e.v=="number"?e.v:G;case"str":return e.length?G:e.v;case"array":{let r=e.items?.map(Ye);return r&&r.length===e.length&&!r.includes(G)?r:G}case"object":{let r=e.entries?.map(([t,o])=>[t,Ye(o)]);return r&&r.length===e.size&&!r.some(([,t])=>t===G)?Object.fromEntries(r):G}default:return G}},wo=e=>{let r=Ye(e);return r===G?"":JSON.stringify(r)},Je=R((e,{actions:r,record:t,valueContext:o})=>{let{editable:a,id:n,name:c,pending:g,subscriberIds:p,value:k}=t,x=f=>{f.preventDefault();let z=f.target.elements.namedItem("value");r.editActivity(n,z.value)};return e`
+            <li class="activity-item">
+                <div class="activity-head">
+                    <span class="activity-name">${c}</span>
+                    ${g?"\u23F3 pending":""}
+                    <span class="hud-muted">
+                        ${p.length?`${p.length} user${p.length===1?"":"s"}`:"no rendered users"}
+                    </span>
+                    <span class="hud-spacer"></span>
+                    <button
+                        class="hud-button"
+                        $click=${()=>r.log(n)}
+                        type="button"
+                    >
+                        Log
+                    </button>
+                    <button
+                        class="hud-button"
+                        $click=${()=>r.resetActivity(n)}
+                        type="button"
+                    >
+                        Reset
+                    </button>
+                </div>
+                <ul class="value-list">
+                    ${le({context:o,label:"value",path:[`a${n}`],value:k})}
+                </ul>
+                ${a?yo({activityId:n,onSubmit:x,text:wo(k)}):""}
+            </li>
+        `},{name:"ActivityItem"}),yo=R((e,{activityId:r,onSubmit:t,text:o})=>e`
+        <form class="activity-editor" $submit=${t}>
+            <input
+                aria-label=${`New value for activity ${r}`}
+                class="hud-input"
+                name="value"
+                placeholder="JSON value"
+                value=${o}
+            />
+            <button class="hud-button is-primary" type="submit">Set</button>
+        </form>
+    `,{name:"ActivityEditor"});var zo=R((e,{actions:r,row:{collapsed:t,count:o,depth:a,node:n,selected:c}})=>e`
+        <li
+            class=${`tree-row ${c?"is-selected":""}`}
+            $click=${()=>r.select(n.id)}
+            $mouseenter=${()=>r.highlight(n.id)}
+            $mouseleave=${()=>r.highlight(null)}
+            style=${`padding-left: ${a*14+4}px`}
+        >
+            <button
+                class=${`tree-toggle ${n.childIds.length?"":"is-hidden"}`}
+                $click=${g=>{g.stopPropagation(),r.toggleCollapsed(n.id)}}
+                type="button"
+            >
+                ${t?"\u25B8":"\u25BE"}
+            </button>
+            <span class=${`tree-name is-${n.kind}`}>${n.name}</span>
+            ${n.key!==void 0?ut({text:`key=${String(n.key)}`}):""}
+            ${o?ut({text:`\xD7${o}`,title:"renders"}):""}
+        </li>
+    `,{name:"TreeRow"}),ut=R((e,{text:r,title:t})=>e`
+        <span class="tag hud-badge" title=${t}>${r}</span>
+    `,{name:"KeyBadge"}),bt=R((e,{own:r,state:t})=>{let o=r(()=>ie([t.tree,t.collapsed,t.selectedId,t.renderCounts],(a,n,c,g)=>{let p=[],k=(x,f)=>{let z=a.nodes.get(x);z&&(p.push({collapsed:n.has(x),count:g.get(x)??0,depth:f,node:z,selected:x===c}),n.has(x)||z.childIds.forEach(E=>k(E,f+1)))};return a.rootIds.forEach(x=>k(x,0)),p}));return e`
+            <section class="pane tree-pane" aria-label="Component tree">
+                <ul class="tree-list" role="tree">
+                    ${o.effect(({value:a})=>a.length?a.map(n=>zo({actions:t.actions,key:n.node.id,row:n})):gt({text:"No mounted app yet."}))}
+                </ul>
+            </section>
+        `},{name:"TreePane"}),gt=R((e,{text:r})=>e`
+        <li class="hud-muted empty-note">${r}</li>
+    `,{name:"EmptyNote"}),vt=(e,r,t)=>({expansions:r,onExpand:o=>e.actions.expand(o),onSelectNode:o=>e.actions.select(o),onToggle:o=>e.actions.togglePath(o),openPaths:t}),Eo=R((e,{details:r,nodeId:t,state:o,valueContext:a})=>{let{actions:n}=o,c=r.owned.t==="array"&&r.owned.length>0;return e`
+            <div class="details">
+                <div class="details-head">
+                    <span class=${`details-name is-${r.kind}`}>
+                        ${r.name}
+                    </span>
+                    <span class="hud-muted">${r.lifeCycle??""}</span>
+                    <span class="hud-spacer"></span>
+                    <button
+                        class="hud-button"
+                        $click=${()=>n.reveal(t)}
+                        type="button"
+                    >
+                        Scroll to
+                    </button>
+                    <button
+                        class="hud-button"
+                        $click=${()=>n.log(t)}
+                        type="button"
+                    >
+                        Log
+                    </button>
+                </div>
+                ${r.kind==="component"?Ze({children:le({context:a,label:"props",path:["props"],value:r.props}),title:"Props"}):""}
+                ${r.activities.length?Ze({children:r.activities.map(g=>Je({actions:n,key:g.id,record:g,valueContext:a})),title:"Activities"}):""}
+                ${c?Ze({children:le({context:a,label:"own()",path:["owned"],value:r.owned}),title:"Owned values"}):""}
+            </div>
+        `},{name:"Details"}),Ze=R((e,{children:r,title:t})=>e`
+        <section class="details-section">
+            <h3 class="details-title">${t}</h3>
+            <ul class="value-list">
+                ${r}
+            </ul>
+        </section>
+    `,{name:"Section"}),ht=R((e,{own:r,state:t})=>{let o=r(()=>ie([t.details,t.selectedId,t.expansions,t.openPaths],(a,n,c,g)=>({details:a,selectedId:n,valueContext:vt(t,c,g)})));return e`
+            <section
+                class="pane inspector-pane"
+                aria-label="Selected component"
+            >
+                ${o.effect(({value:{details:a,selectedId:n,valueContext:c}})=>a&&n!==void 0?Eo({details:a,nodeId:n,state:t,valueContext:c}):$o({text:n===void 0?"Select a component in the tree, or pick one in the page.":"Loading\u2026"}))}
+            </section>
+        `},{name:"InspectorPane"}),$o=R((e,{text:r})=>e`
+        <p class="hud-muted placeholder">${r}</p>
+    `,{name:"Placeholder"}),ft=R((e,{own:r,state:t})=>{let o=r(()=>ie([t.activities,t.expansions,t.openPaths],(a,n,c)=>({records:a,valueContext:vt(t,n,c)})));return e`
+            <section class="pane activities-pane" aria-label="Activities">
+                <ul class="activity-list">
+                    ${o.effect(({value:{records:a,valueContext:n}})=>a.length?a.map(c=>Je({actions:t.actions,key:c.id,record:c,valueContext:n})):gt({text:"No activities found."}))}
+                </ul>
+            </section>
+        `},{name:"ActivitiesPane"});var So=R((e,{state:r})=>e`
+        <div class="hud-split">
+            ${bt({state:r})} ${ht({state:r})}
+        </div>
+    `,{name:"ComponentsTab"}),kt=R((e,{state:r})=>e`
+        <div class="hud">
+            ${ct({state:r})}
+            <main class="hud-main">
+                ${r.tab.effect(({value:t})=>t==="components"?So({state:r}):ft({state:r}))}
+            </main>
+        </div>
+    `,{name:"Hud"});var xt=window.parent!==window?window.parent:window.opener;if(xt){let e=nt(window,xt),r=it(e);Qr({app:kt({state:r}),root:document.getElementById("loom-devtools-hud")}),e.connect()}

package/dist/index.d.ts

@@ -0,0 +1 @@
+export * from './types/index';