xote 4.5.0 → 4.7.0

package/dist/xote.umd.js

@@ -1 +1 @@
-(function(g,T){typeof exports=="object"&&typeof module<"u"?T(exports):typeof define=="function"&&define.amd?define(["exports"],T):(g=typeof globalThis<"u"?globalThis:g||self,T(g.xote={}))})(this,(function(g){"use strict";let T={contents:0};function X(){return T.contents=T.contents+1|0,T.contents}function Ce(e){return e===void 0?{BS_PRIVATE_NESTED_SOME_NONE:0}:e!==null&&e.BS_PRIVATE_NESTED_SOME_NONE!==void 0?{BS_PRIVATE_NESTED_SOME_NONE:e.BS_PRIVATE_NESTED_SOME_NONE+1|0}:e}function Ne(e){if(e!=null)return Ce(e)}function le(e){if(e===null||e.BS_PRIVATE_NESTED_SOME_NONE===void 0)return e;let t=e.BS_PRIVATE_NESTED_SOME_NONE;if(t!==0)return{BS_PRIVATE_NESTED_SOME_NONE:t-1|0}}function H(e,t){return e!==void 0?le(e):t}function Ie(e,t,n){return e.reduce(n,t)}function Me(e,t){let n=e.length,r=new Array(n),l=0;for(let u=0;u<n;++u){let s=e[u],c=t(s);c!==void 0&&(r[l]=le(c),l=l+1|0)}return r.length=l,r}function Re(e,t){let n=0;for(;;){let r=n;if(r===e.length)return;let l=t(e[r]);if(l!==void 0)return l;n=r+1|0}}let h=new Map,C=new Map,F=new Map,p={contents:void 0},N=new Set,k={contents:!1},b={contents:!1};function U(e){if(C.get(e)===void 0){C.set(e,new Set);return}}function je(e,t){let n=C.get(e);if(n!==void 0){n.forEach(t);return}}function Pe(e,t){let n=C.get(e);if(n!==void 0){n.add(t);return}}function xe(e,t){let n=C.get(e);if(n!==void 0){n.delete(t);return}}function De(e){return Array.from(H(C.get(e),new Set).values())}function ue(e,t){let n=p.contents;p.contents=e;try{let r=t();return p.contents=n,r}catch(r){throw p.contents=n,r}}function Fe(e){let t=p.contents;p.contents=void 0;try{let n=e();return p.contents=t,n}catch(n){throw p.contents=t,n}}function Ge(e){let t=p.contents;return t!==void 0?t===e:!1}function Le(e){if(!k.contents){k.contents=!0;try{e(),k.contents=!1;return}catch(t){throw k.contents=!1,t}}}function Be(e,t){U(t);let n=Ge(e),r=h.get(e);if(n&&r!==void 0&&!r.deps.has(t))return r.deps.add(t),Pe(t,e)}function I(e){e.deps.forEach(t=>xe(t,e.id)),e.deps.clear()}function Ve(e){let t=F.get(e);if(t===void 0)return;F.delete(e);let n=h.get(t);if(n!==void 0){I(n),h.delete(t);return}}function ie(e){return Ie(e,0,(t,n)=>n>t?n:t)}function ze(e){let t=[];return e.deps.forEach(n=>je(n,r=>{if(r===e.id)return;let l=h.get(r);if(l===void 0)return;if(typeof l.kind=="object"){t.push(l.level);return}})),ie(t)+1|0}function We(e){let t=[];return e.deps.forEach(n=>{let r=F.get(n);if(r===void 0||r===e.id)return;let l=h.get(r);if(l!==void 0){t.push(l.level);return}}),ie(t)+1|0}function z(e){return typeof e.kind=="object"?We(e):ze(e)}function qe(e,t){let n=h.get(e),r=h.get(t);if(n===void 0)return r!==void 0?1:0;if(r===void 0)return-1;let u=typeof n.kind=="object"?0:1,c=typeof r.kind=="object"?0:1,d=u-c|0;return d!==0?d:n.level-r.level|0}function Ke(e){b.contents=!0,I(e),ue(e.id,()=>{e.run(),b.contents=!1}),e.level=z(e)}function oe(){for(;N.size>0;){let e=Array.from(N.values());N.clear(),e.sort(qe),e.forEach(t=>{let n=h.get(t);if(n!==void 0)return Ke(n)})}}function ce(e){if(U(e),De(e).forEach(t=>{let n=h.get(t);if(n===void 0)return;let r=n.kind;if(typeof r=="object")return n.dirty?void 0:(n.dirty=!0,ce(r.VAL));N.add(t)}),N.size>0)return Le(oe)}function de(e){let t=F.get(e);if(t===void 0)return;let n=h.get(t);if(n!==void 0&&n.dirty){b.contents=!0,I(n),ue(t,()=>{n.run(),n.dirty=!1,b.contents=!1}),n.level=z(n);return}}function Xe(e){let t=k.contents;k.contents=!0;try{let n=e();return t||(k.contents=!1,N.size>0&&oe()),n}catch(n){throw t||(k.contents=!1),n}}let He=Fe,Ue=U;function ae(e,t,n){let r=X();return Ue(r),{id:r,value:{contents:e},version:{contents:0},equals:H(n,(l,u)=>l===u),name:t}}function Je(e){de(e.id);let t=p.contents;return t!==void 0&&Be(t,e.id),e.value.contents}function Qe(e){return de(e.id),e.value.contents}function se(e,t){let n;try{n=!e.equals(e.value.contents,t)}catch{n=!0}if(n)return e.value.contents=t,e.version.contents=e.version.contents+1|0,ce(e.id)}function Ye(e,t){se(e,t(e.value.contents))}const Ze=Object.freeze(Object.defineProperty({__proto__:null,Id:void 0,Scheduler:void 0,batch:Xe,get:Je,make:ae,peek:Qe,set:se,untrack:He,update:Ye},Symbol.toStringTag,{value:"Module"}));function fe(e,t,n,r){return{id:e,kind:t,run:n,deps:new Set,level:0,dirty:!0,name:r}}function et(e,t){let n=X(),r={contents:void 0},u=fe(n,"Effect",()=>{let d=r.contents;d!==void 0&&d(),r.contents=e()},t);h.set(n,u),b.contents=!0,I(u);let s=p.contents;p.contents=n;try{u.run(),b.contents=!1}catch(d){throw p.contents=s,b.contents=!1,d}return p.contents=s,u.level=z(u),{dispose:()=>{let d=h.get(n);if(d===void 0)return;let L=r.contents;L!==void 0&&L(),I(d),h.delete(n)}}}const tt=Object.freeze(Object.defineProperty({__proto__:null,Id:void 0,Observer:void 0,Scheduler:void 0,run:et},Symbol.toStringTag,{value:"Module"}));function nt(e,t){let n=ae(void 0,t,void 0),r=X(),l=()=>{let c=e();n.value.contents=c},u=fe(r,{NAME:"Computed",VAL:n.id},l,void 0);h.set(r,u),b.contents=!0,I(u);let s=p.contents;p.contents=r;try{u.run(),u.dirty=!1,b.contents=!1}catch(c){throw p.contents=s,b.contents=!1,c}return p.contents=s,u.level=z(u),F.set(n.id,r),n}function rt(e){Ve(e.id)}const lt=Object.freeze(Object.defineProperty({__proto__:null,Id:void 0,Observer:void 0,Scheduler:void 0,Signal:void 0,dispose:rt,make:nt},Symbol.toStringTag,{value:"Module"}));let i=Ze,S=lt,w=tt;function pe(e){return Me(e.split("/"),t=>{if(t!=="")return t.startsWith(":")?{TAG:"Param",_0:t.slice(1)}:{TAG:"Static",_0:t}})}function me(e,t){let n=t.split("/").filter(u=>u!=="");if(e.length!==n.length)return"NoMatch";let r={};return e.every((u,s)=>{let c=n[s];return u.TAG==="Static"?c===u._0:(r[u._0]=c,!0)})?{TAG:"Match",_0:r}:"NoMatch"}function J(e,t){return me(pe(e),t)}const ut=Object.freeze(Object.defineProperty({__proto__:null,match:J,matchPath:me,parsePattern:pe},Symbol.toStringTag,{value:"Module"}));function it(e,t){delete e[t]}function M(e,t,n){switch(t){case"checked":e.checked=n==="true";return;case"disabled":e.disabled=n==="true";return;case"aria-expanded":case"aria-hidden":case"aria-selected":case"multiple":case"readonly":case"required":break;case"value":e.value=n;return;default:e.setAttribute(t,n);return}n==="true"?e.setAttribute(t,""):e.removeAttribute(t)}let ot={setAttrOrProp:M},W={contents:void 0};function ct(){return{disposers:[],computeds:[]}}function R(e,t){let n=W.contents;W.contents=e;let r=t();return W.contents=n,r}function j(e,t){e.disposers.push(t)}function he(e){e.disposers.forEach(t=>t.dispose()),e.computeds.forEach(t=>S.dispose(t))}function P(e,t){e.__xote_owner__=t}function _e(e){return Ne(e.__xote_owner__)}let dt={currentOwner:W,createOwner:ct,runWithOwner:R,addDisposer:j,disposeOwner:he,setOwner:P,getOwner:_e};function ge(e,t){return[e,{TAG:"Static",_0:t}]}function Se(e,t){return[e,{TAG:"SignalValue",_0:t}]}function Ee(e,t){return[e,{TAG:"Compute",_0:t}]}let at={$$static:ge,signal:Se,computed:Ee};function G(e){let t=_e(e);t!==void 0&&he(t),Array.from(e.childNodes||[]).forEach(G)}function O(e){switch(e.TAG){case"Element":let t=e.children,n=e.events,r=e.attrs,l=document.createElement(e.tag),u={disposers:[],computeds:[]};return P(l,u),R(u,()=>{r.forEach(o=>{let m=o[1],E=o[0];switch(m.TAG){case"Static":return M(l,E,m._0);case"SignalValue":let v=m._0;M(l,E,i.peek(v));let y=w.run(()=>{M(l,E,i.get(v))},void 0);return j(u,y);case"Compute":let V=m._0;M(l,E,V());let D=w.run(()=>{M(l,E,V())},void 0);return j(u,D)}}),n.forEach(o=>{l.addEventListener(o[0],o[1])}),t.forEach(o=>{let m=O(o);l.appendChild(m)})}),l;case"Text":return document.createTextNode(e._0);case"SignalText":let s=e._0,c=document.createTextNode(i.peek(s)),d={disposers:[],computeds:[]};return P(c,d),R(d,()=>{let o=w.run(()=>{c.textContent=i.get(s)},void 0);j(d,o)}),c;case"Fragment":let L=document.createDocumentFragment();return e._0.forEach(o=>{let m=O(o);L.appendChild(m)}),L;case"SignalFragment":let dn=e._0,Z={disposers:[],computeds:[]},x=document.createElement("div");return x.setAttribute("style","display: contents"),P(x,Z),R(Z,()=>{let o=w.run(()=>{let m=i.get(dn);Array.from(x.childNodes||[]).forEach(G),x.innerHTML="",m.forEach(v=>{let y=O(v);x.appendChild(y)})},void 0);j(Z,o)}),x;case"LazyComponent":let Oe={disposers:[],computeds:[]},an=R(Oe,e._0),ke=O(an);return P(ke,Oe),ke;case"KeyedList":let ee=e.renderItem,te=e.keyFn,Te=e.signal,ne={disposers:[],computeds:[]},re=document.createComment(" keyed-list-start "),B=document.createComment(" keyed-list-end ");P(re,ne);let A={},sn=()=>{let o=B.parentNode;if(o==null)return;let m=i.get(Te),E={};m.forEach(a=>{E[te(a)]=a});let v=[];Object.keys(A).forEach(a=>{if(E[a]===void 0){v.push(a);return}}),v.forEach(a=>{let f=A[a];if(f!==void 0){G(f.element),f.element.remove(),it(A,a);return}});let y=[],V={};m.forEach(a=>{let f=te(a),K=A[f];if(K!==void 0){if(K.item!==a){V[f]=!0;let mn=ee(a),hn=O(mn),Ae={key:f,item:a,element:hn};y.push(Ae),A[f]=Ae;return}y.push(K);return}let fn=ee(a),pn=O(fn),$e={key:f,item:a,element:pn};y.push($e),A[f]=$e});let D={contents:re.nextSibling};y.forEach(a=>{let f=D.contents;if(f==null){o.insertBefore(a.element,B);return}if(f===B){o.insertBefore(a.element,B);return}if(f===a.element){D.contents=f.nextSibling;return}H(V[a.key],!1)?(G(f),o.replaceChild(a.element,f),D.contents=a.element.nextSibling):(o.insertBefore(a.element,f),D.contents=a.element.nextSibling)})},q=document.createDocumentFragment();return q.appendChild(re),i.peek(Te).forEach(o=>{let m=te(o),E=ee(o),v=O(E),y={key:m,item:o,element:v};A[m]=y,q.appendChild(v)}),q.appendChild(B),R(ne,()=>{let o=w.run(()=>{sn()},void 0);j(ne,o)}),q}}let st={disposeElement:G,render:O};function ft(e){return{TAG:"Text",_0:e}}function pt(e){return{TAG:"SignalText",_0:S.make(e,void 0)}}function mt(e){return{TAG:"Fragment",_0:e}}function Q(e){return{TAG:"SignalFragment",_0:e}}function ht(e,t){return{TAG:"SignalFragment",_0:S.make(()=>i.get(e).map(t),void 0)}}function _t(e,t,n){return{TAG:"KeyedList",signal:e,keyFn:t,renderItem:n}}function _(e,t,n,r,l){let u=t!==void 0?t:[].map(d=>d),s=n!==void 0?n:[].map(d=>d),c=r!==void 0?r:[].map(d=>d);return{TAG:"Element",tag:e,attrs:u,events:s,children:c}}function gt(e,t,n,r){return _("div",e,t,n)}function St(e,t,n,r){return _("span",e,t,n)}function Et(e,t,n,r){return _("button",e,t,n)}function bt(e,t,n){return _("input",e,t,void 0)}function vt(e,t,n,r){return _("h1",e,t,n)}function yt(e,t,n,r){return _("h2",e,t,n)}function wt(e,t,n,r){return _("h3",e,t,n)}function Ot(e,t,n,r){return _("p",e,t,n)}function kt(e,t,n,r){return _("ul",e,t,n)}function Tt(e,t,n,r){return _("li",e,t,n)}function be(e,t,n,r){return _("a",e,t,n)}function $t(e){return e.TAG==="Reactive"?i.get(e._0):e._0}let At={get:$t};function ve(e,t){let n=O(e);t.appendChild(n)}function Ct(e,t){let n=document.getElementById(t);if(n==null){console.error("Container element not found: "+t);return}else return ve(e,n)}let ye=ge;const Nt=Object.freeze(Object.defineProperty({__proto__:null,Attributes:at,DOM:ot,ReactiveProp:At,Reactivity:dt,Render:st,a:be,attr:ye,button:Et,computedAttr:Ee,div:gt,element:_,fragment:mt,h1:vt,h2:yt,h3:wt,input:bt,keyedList:_t,li:Tt,list:ht,mount:ve,mountById:Ct,p:Ot,signalAttr:Se,signalFragment:Q,span:St,text:ft,textSignal:pt,ul:kt},Symbol.toStringTag,{value:"Module"}));let $=i.make({pathname:"/",search:"",hash:""},void 0,void 0);function Y(){return{pathname:window.location.pathname,search:window.location.search,hash:window.location.hash}}function It(){i.set($,Y());let e=t=>i.set($,Y());window.addEventListener("popstate",e)}function we(e,t,n,r){let l=t!==void 0?t:"",u=n!==void 0?n:"",s={pathname:e,search:l,hash:u},c=e+l+u,d={};window.history.pushState(d,"",c),i.set($,s)}function Mt(e,t,n,r){let l=t!==void 0?t:"",u=n!==void 0?n:"",s={pathname:e,search:l,hash:u},c=e+l+u,d={};window.history.replaceState(d,"",c),i.set($,s)}function Rt(e,t){return Q(S.make(()=>{let n=i.get($),r=J(e,n.pathname);return typeof r!="object"?[]:[t(r._0)]},void 0))}function jt(e){return Q(S.make(()=>{let t=i.get($),n=Re(e,r=>{let l=J(r.pattern,t.pathname);if(typeof l=="object")return r.render(l._0)});return n!==void 0?[n]:[]},void 0))}function Pt(e,t,n,r){let l=t!==void 0?t:[],u=n!==void 0?n:[],s=c=>{c.preventDefault(),we(e,void 0,void 0)};return be(l.concat([ye("href",e)]),[["click",s]],u)}const xt=Object.freeze(Object.defineProperty({__proto__:null,Component:void 0,Route:void 0,getCurrentLocation:Y,init:It,link:Pt,location:$,push:we,replace:Mt,route:Rt,routes:jt},Symbol.toStringTag,{value:"Module"}));let Dt=i.Id,Ft=i.Scheduler,Gt=i.make,Lt=i.get,Bt=i.peek,Vt=i.set,zt=i.update,Wt=i.batch,qt=i.untrack,Kt={Id:Dt,Scheduler:Ft,make:Gt,get:Lt,peek:Bt,set:Vt,update:zt,batch:Wt,untrack:qt},Xt=S.Id,Ht=S.Signal,Ut=S.Observer,Jt=S.Scheduler,Qt=S.make,Yt=S.dispose,Zt={Id:Xt,Signal:Ht,Observer:Ut,Scheduler:Jt,make:Qt,dispose:Yt},en=w.Id,tn=w.Observer,nn=w.Scheduler,rn=w.run,ln={Id:en,Observer:tn,Scheduler:nn,run:rn},un=Nt,on=ut,cn=xt;g.Component=un,g.Computed=Zt,g.Effect=ln,g.Route=on,g.Router=cn,g.Signal=Kt,Object.defineProperty(g,Symbol.toStringTag,{value:"Module"})}));
+(function(_,$){typeof exports=="object"&&typeof module<"u"?$(exports):typeof define=="function"&&define.amd?define(["exports"],$):(_=typeof globalThis<"u"?globalThis:_||self,$(_.xote={}))})(this,(function(_){"use strict";let $={contents:0};function K(){return $.contents=$.contents+1|0,$.contents}function Ce(e){return e===void 0?{BS_PRIVATE_NESTED_SOME_NONE:0}:e!==null&&e.BS_PRIVATE_NESTED_SOME_NONE!==void 0?{BS_PRIVATE_NESTED_SOME_NONE:e.BS_PRIVATE_NESTED_SOME_NONE+1|0}:e}function Ne(e){if(e!=null)return Ce(e)}function le(e){if(e===null||e.BS_PRIVATE_NESTED_SOME_NONE===void 0)return e;let t=e.BS_PRIVATE_NESTED_SOME_NONE;if(t!==0)return{BS_PRIVATE_NESTED_SOME_NONE:t-1|0}}function H(e,t){return e!==void 0?le(e):t}function Ie(e,t,n){return e.reduce(n,t)}function Me(e,t){let n=e.length,r=new Array(n),l=0;for(let u=0;u<n;++u){let s=e[u],c=t(s);c!==void 0&&(r[l]=le(c),l=l+1|0)}return r.length=l,r}function Re(e,t){let n=0;for(;;){let r=n;if(r===e.length)return;let l=t(e[r]);if(l!==void 0)return l;n=r+1|0}}let h=new Map,C=new Map,D=new Map,p={contents:void 0},N=new Set,T={contents:!1},b={contents:!1};function U(e){if(C.get(e)===void 0){C.set(e,new Set);return}}function je(e,t){let n=C.get(e);if(n!==void 0){n.forEach(t);return}}function Pe(e,t){let n=C.get(e);if(n!==void 0){n.add(t);return}}function Ge(e,t){let n=C.get(e);if(n!==void 0){n.delete(t);return}}function xe(e){return Array.from(H(C.get(e),new Set).values())}function ue(e,t){let n=p.contents;p.contents=e;try{let r=t();return p.contents=n,r}catch(r){throw p.contents=n,r}}function De(e){let t=p.contents;p.contents=void 0;try{let n=e();return p.contents=t,n}catch(n){throw p.contents=t,n}}function Fe(e){let t=p.contents;return t!==void 0?t===e:!1}function Le(e){if(!T.contents){T.contents=!0;try{e(),T.contents=!1;return}catch(t){throw T.contents=!1,t}}}function Be(e,t){U(t);let n=Fe(e),r=h.get(e);if(n&&r!==void 0&&!r.deps.has(t))return r.deps.add(t),Pe(t,e)}function I(e){e.deps.forEach(t=>Ge(t,e.id)),e.deps.clear()}function ze(e){let t=D.get(e);if(t===void 0)return;D.delete(e);let n=h.get(t);if(n!==void 0){I(n),h.delete(t);return}}function ie(e){return Ie(e,0,(t,n)=>n>t?n:t)}function Ve(e){let t=[];return e.deps.forEach(n=>je(n,r=>{if(r===e.id)return;let l=h.get(r);if(l===void 0)return;if(typeof l.kind=="object"){t.push(l.level);return}})),ie(t)+1|0}function We(e){let t=[];return e.deps.forEach(n=>{let r=D.get(n);if(r===void 0||r===e.id)return;let l=h.get(r);if(l!==void 0){t.push(l.level);return}}),ie(t)+1|0}function V(e){return typeof e.kind=="object"?We(e):Ve(e)}function Xe(e,t){let n=h.get(e),r=h.get(t);if(n===void 0)return r!==void 0?1:0;if(r===void 0)return-1;let u=typeof n.kind=="object"?0:1,c=typeof r.kind=="object"?0:1,d=u-c|0;return d!==0?d:n.level-r.level|0}function qe(e){b.contents=!0,I(e),ue(e.id,()=>{e.run(),b.contents=!1}),e.level=V(e)}function oe(){for(;N.size>0;){let e=Array.from(N.values());N.clear(),e.sort(Xe),e.forEach(t=>{let n=h.get(t);if(n!==void 0)return qe(n)})}}function ce(e){if(U(e),xe(e).forEach(t=>{let n=h.get(t);if(n===void 0)return;let r=n.kind;if(typeof r=="object")return n.dirty?void 0:(n.dirty=!0,ce(r.VAL));N.add(t)}),N.size>0)return Le(oe)}function de(e){let t=D.get(e);if(t===void 0)return;let n=h.get(t);if(n!==void 0&&n.dirty){b.contents=!0,I(n),ue(t,()=>{n.run(),n.dirty=!1,b.contents=!1}),n.level=V(n);return}}function Ke(e){let t=T.contents;T.contents=!0;try{let n=e();return t||(T.contents=!1,N.size>0&&oe()),n}catch(n){throw t||(T.contents=!1),n}}let He=De,Ue=U;function ae(e,t,n){let r=K();return Ue(r),{id:r,value:{contents:e},version:{contents:0},equals:H(n,(l,u)=>l===u),name:t}}function Je(e){de(e.id);let t=p.contents;return t!==void 0&&Be(t,e.id),e.value.contents}function Qe(e){return de(e.id),e.value.contents}function se(e,t){let n;try{n=!e.equals(e.value.contents,t)}catch{n=!0}if(n)return e.value.contents=t,e.version.contents=e.version.contents+1|0,ce(e.id)}function Ye(e,t){se(e,t(e.value.contents))}const Ze=Object.freeze(Object.defineProperty({__proto__:null,Id:void 0,Scheduler:void 0,batch:Ke,get:Je,make:ae,peek:Qe,set:se,untrack:He,update:Ye},Symbol.toStringTag,{value:"Module"}));function fe(e,t,n,r){return{id:e,kind:t,run:n,deps:new Set,level:0,dirty:!0,name:r}}function et(e,t){let n=K(),r={contents:void 0},u=fe(n,"Effect",()=>{let d=r.contents;d!==void 0&&d(),r.contents=e()},t);h.set(n,u),b.contents=!0,I(u);let s=p.contents;p.contents=n;try{u.run(),b.contents=!1}catch(d){throw p.contents=s,b.contents=!1,d}return p.contents=s,u.level=V(u),{dispose:()=>{let d=h.get(n);if(d===void 0)return;let L=r.contents;L!==void 0&&L(),I(d),h.delete(n)}}}const tt=Object.freeze(Object.defineProperty({__proto__:null,Id:void 0,Observer:void 0,Scheduler:void 0,run:et},Symbol.toStringTag,{value:"Module"}));function nt(e,t){let n=ae(void 0,t,void 0),r=K(),l=()=>{let c=e();n.value.contents=c},u=fe(r,{NAME:"Computed",VAL:n.id},l,void 0);h.set(r,u),b.contents=!0,I(u);let s=p.contents;p.contents=r;try{u.run(),u.dirty=!1,b.contents=!1}catch(c){throw p.contents=s,b.contents=!1,c}return p.contents=s,u.level=V(u),D.set(n.id,r),n}function rt(e){ze(e.id)}const lt=Object.freeze(Object.defineProperty({__proto__:null,Id:void 0,Observer:void 0,Scheduler:void 0,Signal:void 0,dispose:rt,make:nt},Symbol.toStringTag,{value:"Module"}));let i=Ze,S=lt,w=tt;function pe(e){return Me(e.split("/"),t=>{if(t!=="")return t.startsWith(":")?{TAG:"Param",_0:t.slice(1)}:{TAG:"Static",_0:t}})}function me(e,t){let n=t.split("/").filter(u=>u!=="");if(e.length!==n.length)return"NoMatch";let r={};return e.every((u,s)=>{let c=n[s];return u.TAG==="Static"?c===u._0:(r[u._0]=c,!0)})?{TAG:"Match",_0:r}:"NoMatch"}function J(e,t){return me(pe(e),t)}const ut=Object.freeze(Object.defineProperty({__proto__:null,match:J,matchPath:me,parsePattern:pe},Symbol.toStringTag,{value:"Module"}));function it(e,t){delete e[t]}function M(e,t,n){switch(t){case"checked":e.checked=n==="true";return;case"disabled":e.disabled=n==="true";return;case"aria-expanded":case"aria-hidden":case"aria-selected":case"multiple":case"readonly":case"required":break;case"value":e.value=n;return;default:e.setAttribute(t,n);return}n==="true"?e.setAttribute(t,""):e.removeAttribute(t)}let ot={setAttrOrProp:M},W={contents:void 0};function ct(){return{disposers:[],computeds:[]}}function R(e,t){let n=W.contents;W.contents=e;let r=t();return W.contents=n,r}function j(e,t){e.disposers.push(t)}function he(e){e.disposers.forEach(t=>t.dispose()),e.computeds.forEach(t=>S.dispose(t))}function P(e,t){e.__xote_owner__=t}function _e(e){return Ne(e.__xote_owner__)}let dt={currentOwner:W,createOwner:ct,runWithOwner:R,addDisposer:j,disposeOwner:he,setOwner:P,getOwner:_e};function ge(e,t){return[e,{TAG:"Static",_0:t}]}function Se(e,t){return[e,{TAG:"SignalValue",_0:t}]}function Ee(e,t){return[e,{TAG:"Compute",_0:t}]}let at={$$static:ge,signal:Se,computed:Ee};function F(e){let t=_e(e);t!==void 0&&he(t),Array.from(e.childNodes||[]).forEach(F)}function O(e){switch(e.TAG){case"Element":let t=e.children,n=e.events,r=e.attrs,l=document.createElement(e.tag),u={disposers:[],computeds:[]};return P(l,u),R(u,()=>{r.forEach(o=>{let m=o[1],E=o[0];switch(m.TAG){case"Static":return M(l,E,m._0);case"SignalValue":let v=m._0;M(l,E,i.peek(v));let y=w.run(()=>{M(l,E,i.get(v))},void 0);return j(u,y);case"Compute":let z=m._0;M(l,E,z());let x=w.run(()=>{M(l,E,z())},void 0);return j(u,x)}}),n.forEach(o=>{l.addEventListener(o[0],o[1])}),t.forEach(o=>{let m=O(o);l.appendChild(m)})}),l;case"Text":return document.createTextNode(e._0);case"SignalText":let s=e._0,c=document.createTextNode(i.peek(s)),d={disposers:[],computeds:[]};return P(c,d),R(d,()=>{let o=w.run(()=>{c.textContent=i.get(s)},void 0);j(d,o)}),c;case"Fragment":let L=document.createDocumentFragment();return e._0.forEach(o=>{let m=O(o);L.appendChild(m)}),L;case"SignalFragment":let pn=e._0,Z={disposers:[],computeds:[]},G=document.createElement("div");return G.setAttribute("style","display: contents"),P(G,Z),R(Z,()=>{let o=w.run(()=>{let m=i.get(pn);Array.from(G.childNodes||[]).forEach(F),G.innerHTML="",m.forEach(v=>{let y=O(v);G.appendChild(y)})},void 0);j(Z,o)}),G;case"LazyComponent":let Oe={disposers:[],computeds:[]},mn=R(Oe,e._0),Te=O(mn);return P(Te,Oe),Te;case"KeyedList":let ee=e.renderItem,te=e.keyFn,$e=e.signal,ne={disposers:[],computeds:[]},re=document.createComment(" keyed-list-start "),B=document.createComment(" keyed-list-end ");P(re,ne);let A={},hn=()=>{let o=B.parentNode;if(o==null)return;let m=i.get($e),E={};m.forEach(a=>{E[te(a)]=a});let v=[];Object.keys(A).forEach(a=>{if(E[a]===void 0){v.push(a);return}}),v.forEach(a=>{let f=A[a];if(f!==void 0){F(f.element),f.element.remove(),it(A,a);return}});let y=[],z={};m.forEach(a=>{let f=te(a),q=A[f];if(q!==void 0){if(q.item!==a){z[f]=!0;let Sn=ee(a),En=O(Sn),Ae={key:f,item:a,element:En};y.push(Ae),A[f]=Ae;return}y.push(q);return}let _n=ee(a),gn=O(_n),ke={key:f,item:a,element:gn};y.push(ke),A[f]=ke});let x={contents:re.nextSibling};y.forEach(a=>{let f=x.contents;if(f==null){o.insertBefore(a.element,B);return}if(f===B){o.insertBefore(a.element,B);return}if(f===a.element){x.contents=f.nextSibling;return}H(z[a.key],!1)?(F(f),o.replaceChild(a.element,f),x.contents=a.element.nextSibling):(o.insertBefore(a.element,f),x.contents=a.element.nextSibling)})},X=document.createDocumentFragment();return X.appendChild(re),i.peek($e).forEach(o=>{let m=te(o),E=ee(o),v=O(E),y={key:m,item:o,element:v};A[m]=y,X.appendChild(v)}),X.appendChild(B),R(ne,()=>{let o=w.run(()=>{hn()},void 0);j(ne,o)}),X}}let st={disposeElement:F,render:O};function ft(e){return{TAG:"Text",_0:e}}function pt(e){return{TAG:"SignalText",_0:S.make(e,void 0)}}function mt(e){return{TAG:"Fragment",_0:e}}function Q(e){return{TAG:"SignalFragment",_0:e}}function ht(e,t){return{TAG:"SignalFragment",_0:S.make(()=>i.get(e).map(t),void 0)}}function _t(e,t,n){return{TAG:"KeyedList",signal:e,keyFn:t,renderItem:n}}function g(e,t,n,r,l){let u=t!==void 0?t:[].map(d=>d),s=n!==void 0?n:[].map(d=>d),c=r!==void 0?r:[].map(d=>d);return{TAG:"Element",tag:e,attrs:u,events:s,children:c}}function gt(e,t,n,r){return g("div",e,t,n)}function St(e,t,n,r){return g("span",e,t,n)}function Et(e,t,n,r){return g("button",e,t,n)}function bt(e,t,n){return g("input",e,t,void 0)}function vt(e,t,n,r){return g("h1",e,t,n)}function yt(e,t,n,r){return g("h2",e,t,n)}function wt(e,t,n,r){return g("h3",e,t,n)}function Ot(e,t,n,r){return g("p",e,t,n)}function Tt(e,t,n,r){return g("ul",e,t,n)}function $t(e,t,n,r){return g("li",e,t,n)}function be(e,t,n,r){return g("a",e,t,n)}function kt(){return{TAG:"Text",_0:""}}function ve(e,t){let n=O(e);t.appendChild(n)}function At(e,t){let n=document.getElementById(t);if(n==null){console.error("Container element not found: "+t);return}else return ve(e,n)}let ye=ge;const Ct=Object.freeze(Object.defineProperty({__proto__:null,$$null:kt,Attributes:at,DOM:ot,Reactivity:dt,Render:st,a:be,attr:ye,button:Et,computedAttr:Ee,div:gt,element:g,fragment:mt,h1:vt,h2:yt,h3:wt,input:bt,keyedList:_t,li:$t,list:ht,mount:ve,mountById:At,p:Ot,signalAttr:Se,signalFragment:Q,span:St,text:ft,textSignal:pt,ul:Tt},Symbol.toStringTag,{value:"Module"}));let k=i.make({pathname:"/",search:"",hash:""},void 0,void 0);function Y(){return{pathname:window.location.pathname,search:window.location.search,hash:window.location.hash}}function Nt(){i.set(k,Y());let e=t=>i.set(k,Y());window.addEventListener("popstate",e)}function we(e,t,n,r){let l=t!==void 0?t:"",u=n!==void 0?n:"",s={pathname:e,search:l,hash:u},c=e+l+u,d={};window.history.pushState(d,"",c),i.set(k,s)}function It(e,t,n,r){let l=t!==void 0?t:"",u=n!==void 0?n:"",s={pathname:e,search:l,hash:u},c=e+l+u,d={};window.history.replaceState(d,"",c),i.set(k,s)}function Mt(e,t){return Q(S.make(()=>{let n=i.get(k),r=J(e,n.pathname);return typeof r!="object"?[]:[t(r._0)]},void 0))}function Rt(e){return Q(S.make(()=>{let t=i.get(k),n=Re(e,r=>{let l=J(r.pattern,t.pathname);if(typeof l=="object")return r.render(l._0)});return n!==void 0?[n]:[]},void 0))}function jt(e,t,n,r){let l=t!==void 0?t:[],u=n!==void 0?n:[],s=c=>{c.preventDefault(),we(e,void 0,void 0)};return be(l.concat([ye("href",e)]),[["click",s]],u)}const Pt=Object.freeze(Object.defineProperty({__proto__:null,Component:void 0,Route:void 0,getCurrentLocation:Y,init:Nt,link:jt,location:k,push:we,replace:It,route:Mt,routes:Rt},Symbol.toStringTag,{value:"Module"}));function Gt(e){return e.TAG==="Reactive"?i.get(e._0):e._0}function xt(e){return{TAG:"Static",_0:e}}function Dt(e){return{TAG:"Reactive",_0:e}}const Ft=Object.freeze(Object.defineProperty({__proto__:null,$$static:xt,get:Gt,reactive:Dt},Symbol.toStringTag,{value:"Module"}));let Lt=i.Id,Bt=i.Scheduler,zt=i.make,Vt=i.get,Wt=i.peek,Xt=i.set,qt=i.update,Kt=i.batch,Ht=i.untrack,Ut={Id:Lt,Scheduler:Bt,make:zt,get:Vt,peek:Wt,set:Xt,update:qt,batch:Kt,untrack:Ht},Jt=S.Id,Qt=S.Signal,Yt=S.Observer,Zt=S.Scheduler,en=S.make,tn=S.dispose,nn={Id:Jt,Signal:Qt,Observer:Yt,Scheduler:Zt,make:en,dispose:tn},rn=w.Id,ln=w.Observer,un=w.Scheduler,on=w.run,cn={Id:rn,Observer:ln,Scheduler:un,run:on},dn=Ct,an=ut,sn=Pt,fn=Ft;_.Component=dn,_.Computed=nn,_.Effect=cn,_.ReactiveProp=fn,_.Route=an,_.Router=sn,_.Signal=Ut,Object.defineProperty(_,Symbol.toStringTag,{value:"Module"})}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xote",
-  "version": "4.5.0",
+  "version": "4.7.0",
   "repository": {
     "url": "https://github.com/brnrdog/xote"
   },

package/src/Xote.res

@@ -21,3 +21,7 @@ module Route = {
 module Router = {
   include Xote__Router
 }
+
+module ReactiveProp = {
+  include Xote__ReactiveProp
+}

package/src/Xote.res.mjs

@@ -4,6 +4,7 @@ import * as Signals from "rescript-signals/src/Signals.res.mjs";
 import * as Xote__Route from "./Xote__Route.res.mjs";
 import * as Xote__Router from "./Xote__Router.res.mjs";
 import * as Xote__Component from "./Xote__Component.res.mjs";
+import * as Xote__ReactiveProp from "./Xote__ReactiveProp.res.mjs";
 
 let Signal_Id = Signals.Signal.Id;
 
@@ -77,6 +78,8 @@ let Route = Xote__Route;
 
 let Router = Xote__Router;
 
+let ReactiveProp = Xote__ReactiveProp;
+
 export {
   Signal,
   Computed,
@@ -84,5 +87,6 @@ export {
   Component,
   Route,
   Router,
+  ReactiveProp,
 }
 /* Signals Not a pure module */

package/src/Xote__Component.res

@@ -501,17 +501,8 @@ let ul = (~attrs=?, ~events=?, ~children=?, ()) => element("ul", ~attrs?, ~event
 let li = (~attrs=?, ~events=?, ~children=?, ()) => element("li", ~attrs?, ~events?, ~children?, ())
 let a = (~attrs=?, ~events=?, ~children=?, ()) => element("a", ~attrs?, ~events?, ~children?, ())
 
-/* Defines a property that can either be a signal (Reactive) or a static value
- (Static) */
-module ReactiveProp = {
-  type t<'a> = Reactive(Signal.t<'a>) | Static('a)
-
-  let get = value =>
-    switch value {
-    | Reactive(signal) => Signal.get(signal)
-    | Static(value) => value
-    }
-}
+/* Null representation */
+let null = () => text("")
 
 /* Mounting */
 let mount = (node: node, container: Dom.element): unit => {

package/src/Xote__Component.res.mjs

@@ -464,18 +464,13 @@ function a(attrs, events, children, param) {
   return element("a", attrs, events, children, undefined);
 }
 
-function get(value) {
-  if (value.TAG === "Reactive") {
-    return Signals.Signal.get(value._0);
-  } else {
-    return value._0;
-  }
+function $$null() {
+  return {
+    TAG: "Text",
+    _0: ""
+  };
 }
 
-let ReactiveProp = {
-  get: get
-};
-
 function mount(node, container) {
   let el = render(node);
   container.appendChild(el);
@@ -523,7 +518,7 @@ export {
   ul,
   li,
   a,
-  ReactiveProp,
+  $$null,
   mount,
   mountById,
 }

package/src/Xote__JSX.res

@@ -1,5 +1,6 @@
 open Signals
 module Component = Xote__Component
+module ReactiveProp = Xote__ReactiveProp
 
 /* ReScript JSX transform type aliases */
 type element = Component.node
@@ -42,22 +43,8 @@ let null = (): element => Component.text("")
 
 /* Elements module for lowercase HTML tags */
 module Elements = {
-  /* Attribute value type that can be static, signal, or computed */
-  @unboxed
-  type rec attributeValue = Any('a): attributeValue
-
-  /* Automatic conversion from string to attributeValue */
-  external fromString: string => attributeValue = "%identity"
-
-  /* Helper to convert a signal to an attributeValue */
-  let signal = (s: Signals.Signal.t<string>): attributeValue => Any(s)
-
-  /* Helper to convert a computed function to an attributeValue */
-  let computed = (f: unit => string): attributeValue => Any(f)
-
-  /* Props type for HTML elements - supports common attributes and events
-   * String-like attributes use polymorphic types to accept strings, signals, or computed functions
-   * Boolean attributes also use polymorphic types to accept bools, signals, or computed functions
+  /* Props type for HTML elements - accepts both raw values and ReactiveProp.t for flexibility
+   * This allows ergonomic JSX like class="foo" while also supporting class={ReactiveProp.reactive(signal)}
    */
   type props<
     'id,
@@ -91,7 +78,7 @@ module Elements = {
     'ariaExpanded,
     'ariaSelected,
   > = {
-    /* Standard attributes - can be static strings, signals, or computed values */
+    /* Standard attributes - accept raw strings or ReactiveProp.t<string> */
     id?: 'id,
     class?: 'class,
     style?: 'style,
@@ -149,42 +136,58 @@ module Elements = {
     children?: element,
   }
 
-  /* Helper to detect if a value is a signal (has an id property) */
-  @get external hasId: 'a => option<int> = "id"
+  /* Helper to detect if a value is a ReactiveProp variant (checks for Static/Reactive tags) */
+  let isReactiveProp = (value: 'a): bool => {
+    %raw(`value && typeof value === 'object' && ('TAG' in value) && (value.TAG === 'Static' || value.TAG === 'Reactive')`)
+  }
 
-  /* Helper to convert any value to Component.attrValue */
+  /* Helper to convert string attribute value (supports raw string, ReactiveProp, Signal, or computed function) */
   let convertAttrValue = (key: string, value: 'a): (string, Component.attrValue) => {
-    // Check if it's a function (computed)
-    if typeof(value) == #function {
-      // It's a computed function
+    if isReactiveProp(value) {
+      // It's a ReactiveProp variant - pattern match on it
+      let rp: ReactiveProp.t<string> = Obj.magic(value)
+      switch rp {
+      | Static(s) => Component.attr(key, s)
+      | Reactive(signal) => Component.signalAttr(key, signal)
+      }
+    } else if typeof(value) == #function {
+      // It's a computed function (for backward compatibility)
       let f: unit => string = Obj.magic(value)
       Component.computedAttr(key, f)
-    } else if typeof(value) == #object && hasId(value)->Option.isSome {
-      // It's a signal (has an id property)
+    } else if typeof(value) == #object {
+      // It's a raw signal (for backward compatibility)
       let sig: Signal.t<string> = Obj.magic(value)
       Component.signalAttr(key, sig)
     } else {
-      // It's a static string
+      // It's a raw string
       let s: string = Obj.magic(value)
       Component.attr(key, s)
     }
   }
 
-  /* Helper to convert boolean attribute values (static bool, signal, or computed) to Component.attrValue */
+  /* Helper to convert boolean attribute value (supports raw bool, ReactiveProp, Signal, or computed function) */
   let convertBoolAttrValue = (key: string, value: 'a): (string, Component.attrValue) => {
-    // Check if it's a function (computed)
-    if typeof(value) == #function {
-      // It's a computed function that returns bool
+    if isReactiveProp(value) {
+      // It's a ReactiveProp variant - pattern match on it
+      let rp: ReactiveProp.t<bool> = Obj.magic(value)
+      switch rp {
+      | Static(b) => Component.attr(key, b ? "true" : "false")
+      | Reactive(signal) => {
+          let strSignal = Computed.make(() => Signal.get(signal) ? "true" : "false")
+          Component.signalAttr(key, strSignal)
+        }
+      }
+    } else if typeof(value) == #function {
+      // It's a computed function that returns bool (for backward compatibility)
       let f: unit => bool = Obj.magic(value)
       Component.computedAttr(key, () => f() ? "true" : "false")
-    } else if typeof(value) == #object && hasId(value)->Option.isSome {
-      // It's a signal of bool
+    } else if typeof(value) == #object {
+      // It's a raw signal (for backward compatibility)
       let sig: Signal.t<bool> = Obj.magic(value)
-      // Create a computed signal that converts bool to string
       let strSignal = Computed.make(() => Signal.get(sig) ? "true" : "false")
       Component.signalAttr(key, strSignal)
     } else {
-      // It's a static bool
+      // It's a raw bool
       let b: bool = Obj.magic(value)
       Component.attr(key, b ? "true" : "false")
     }
@@ -206,7 +209,7 @@ module Elements = {
     }
   }
 
-  /* Convert props to attrs array - uses wildcard types to accept any prop types */
+  /* Convert props to attrs array */
   let propsToAttrs = (props: props<_, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _>): array<(string, Component.attrValue)> => {
     let attrs = []
 
@@ -280,7 +283,7 @@ module Elements = {
     }
   }
 
-  /* Convert props to events array - uses wildcard types to accept any prop types */
+  /* Convert props to events array */
   let propsToEvents = (props: props<_, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _, _>): array<(string, Dom.event => unit)> => {
     let events = []
 

package/src/Xote__JSX.res.mjs

@@ -1,7 +1,6 @@
 // Generated by ReScript, PLEASE EDIT WITH CARE
 
 import * as Signals from "rescript-signals/src/Signals.res.mjs";
-import * as Core__Option from "@rescript/core/src/Core__Option.res.mjs";
 import * as Xote__Component from "./Xote__Component.res.mjs";
 import * as Primitive_option from "@rescript/runtime/lib/es6/Primitive_option.js";
 
@@ -28,18 +27,20 @@ function $$null() {
   return Xote__Component.text("");
 }
 
-function signal(s) {
-  return s;
-}
-
-function computed(f) {
-  return f;
+function isReactiveProp(value) {
+  return (value && typeof value === 'object' && ('TAG' in value) && (value.TAG === 'Static' || value.TAG === 'Reactive'));
 }
 
 function convertAttrValue(key, value) {
-  if (typeof value === "function") {
+  if (isReactiveProp(value)) {
+    if (value.TAG === "Reactive") {
+      return Xote__Component.signalAttr(key, value._0);
+    } else {
+      return Xote__Component.attr(key, value._0);
+    }
+  } else if (typeof value === "function") {
     return Xote__Component.computedAttr(key, value);
-  } else if (typeof value === "object" && Core__Option.isSome(value.id)) {
+  } else if (typeof value === "object") {
     return Xote__Component.signalAttr(key, value);
   } else {
     return Xote__Component.attr(key, value);
@@ -47,6 +48,20 @@ function convertAttrValue(key, value) {
 }
 
 function convertBoolAttrValue(key, value) {
+  if (isReactiveProp(value)) {
+    if (value.TAG !== "Reactive") {
+      return Xote__Component.attr(key, value._0 ? "true" : "false");
+    }
+    let signal = value._0;
+    let strSignal = Signals.Computed.make(() => {
+      if (Signals.Signal.get(signal)) {
+        return "true";
+      } else {
+        return "false";
+      }
+    }, undefined);
+    return Xote__Component.signalAttr(key, strSignal);
+  }
   if (typeof value === "function") {
     return Xote__Component.computedAttr(key, () => {
       if (value()) {
@@ -56,17 +71,17 @@ function convertBoolAttrValue(key, value) {
       }
     });
   }
-  if (!(typeof value === "object" && Core__Option.isSome(value.id))) {
+  if (typeof value !== "object") {
     return Xote__Component.attr(key, value ? "true" : "false");
   }
-  let strSignal = Signals.Computed.make(() => {
+  let strSignal$1 = Signals.Computed.make(() => {
     if (Signals.Signal.get(value)) {
       return "true";
     } else {
       return "false";
     }
   }, undefined);
-  return Xote__Component.signalAttr(key, strSignal);
+  return Xote__Component.signalAttr(key, strSignal$1);
 }
 
 function addAttr(attrs, opt, key, converter) {
@@ -184,8 +199,7 @@ function jsxKeyed$1(tag, props, key, param) {
 }
 
 let Elements = {
-  signal: signal,
-  computed: computed,
+  isReactiveProp: isReactiveProp,
   convertAttrValue: convertAttrValue,
   convertBoolAttrValue: convertBoolAttrValue,
   addAttr: addAttr,
@@ -203,12 +217,15 @@ let Elements = {
 
 let Component;
 
+let ReactiveProp;
+
 let jsxs = jsx;
 
 let jsxsKeyed = jsxKeyed;
 
 export {
   Component,
+  ReactiveProp,
   jsx,
   jsxs,
   jsxKeyed,

package/src/Xote__ReactiveProp.res

@@ -0,0 +1,16 @@
+open Signals
+
+/* Defines a property that can either be a signal (Reactive) or a static value
+ (Static) */
+type t<'a> = Reactive(Signal.t<'a>) | Static('a)
+
+let get = value =>
+  switch value {
+  | Reactive(signal) => Signal.get(signal)
+  | Static(value) => value
+  }
+
+/* Helper functions for creating reactive props */
+let static = value => Static(value)
+
+let reactive = signal => Reactive(signal)

package/src/Xote__ReactiveProp.res.mjs

@@ -0,0 +1,32 @@
+// Generated by ReScript, PLEASE EDIT WITH CARE
+
+import * as Signals from "rescript-signals/src/Signals.res.mjs";
+
+function get(value) {
+  if (value.TAG === "Reactive") {
+    return Signals.Signal.get(value._0);
+  } else {
+    return value._0;
+  }
+}
+
+function $$static(value) {
+  return {
+    TAG: "Static",
+    _0: value
+  };
+}
+
+function reactive(signal) {
+  return {
+    TAG: "Reactive",
+    _0: signal
+  };
+}
+
+export {
+  get,
+  $$static,
+  reactive,
+}
+/* Signals Not a pure module */