rumious 1.0.6 → 1.0.7

package/dist/index.cjs

@@ -1 +1 @@
-var t=require("mutative");class e{constructor(t,e){this.target=t,this.app=e,this.onRenderFinished=[]}findName(t){return this.target[t]}}function r(t,e,n){let s=e.generator.bind(t.target);t.renderHelper=r,s(n,t),setTimeout((async()=>{const e=[...t.onRenderFinished];t.onRenderFinished=[];for(const t of e)await t()}),0)}class n extends HTMLElement{constructor(){super(),this.props={}}setContext(t){this.context=t}setComponent(t){this.componentConstructor=t}setup(t,e){this.context=t,this.componentConstructor=e}connectedCallback(){this.componentConstructor?(this.componentInstance=new this.componentConstructor,this.componentInstance.element=this,this.componentConstructor.classNames&&(this.className=this.componentConstructor.classNames),this.componentInstance.prepare(this.context,this.props),this.componentInstance.onCreate(),this.componentInstance.requestRender()):console.warn("Rumious: Cannot find matching component constructor.")}disconnectedCallback(){this.componentInstance?.onDestroy()}}class s{constructor(t,r={}){this.root=t,this.options=r,this.modules=[],this.context=new e(this,this)}addModule(t,e){const r=t.init(this,e);return this.modules.push(r),r}render(t){r(this.context,t,this.root)}}class i{constructor(t){this.generator=t}}class o{constructor(t){if(this.contents=t,this.targets=new Map,!t||0===t.length)throw new Error("Injector must be initialized with non-empty content");const e=t[0];this.type="string"==typeof e?"string":"element"}commit(t){this.contents=t;const e=t[0];this.type="string"==typeof e?"string":"element"}addTarget(t){this.targets.set(t,1)}inject(t){if(this.targets.has(t)&&this.contents)if(t.innerHTML="","string"===this.type)for(const e of this.contents)t.insertAdjacentHTML("beforeend",e);else for(const e of this.contents)t.appendChild(e)}injectAll(){for(const t of this.targets.keys())this.inject(t)}removeTarget(t){this.targets.delete(t)}clear(){this.targets.clear()}}class a{constructor(t){this.target=t}getElement(){return this.target}remove(){this.target.remove()}addChild(t){this.target.appendChild(t)}listChild(){return this.target.childNodes}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}set text(t){this.target.textContent=t}get text(){return this.target.textContent}set value(t){(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.value=t)}get value(){if(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)return this.target.value}addClassName(t){this.target.classList.add(t)}removeClassName(t){this.target.classList.remove(t)}hasClassName(t){return this.target.classList.contains(t)}toggleClass(t,e){return this.target.classList.toggle(t,e)}setStyle(t){Object.assign(this.target.style,t)}getStyle(t){return getComputedStyle(this.target).getPropertyValue(t)}setAttribute(t,e){this.target.setAttribute(t,e)}getAttribute(t){return this.target.getAttribute(t)}removeAttribute(t){this.target.removeAttribute(t)}on(t,e,r){this.target.addEventListener(t,e,r)}off(t,e,r){this.target.removeEventListener(t,e,r)}set html(t){this.target.innerHTML=t}get html(){return this.target.innerHTML}getBoundingRect(){return this.target.getBoundingClientRect()}isInViewport(){const t=this.target.getBoundingClientRect();return t.top>=0&&t.left>=0&&t.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&t.right<=(window.innerWidth||document.documentElement.clientWidth)}prependChild(t){this.target.prepend(t)}setDisabled(t){(this.target instanceof HTMLButtonElement||this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.disabled=t)}addClasses(...t){this.target.classList.add(...t)}removeClasses(...t){this.target.classList.remove(...t)}replaceClass(t,e){this.target.classList.replace(t,e)}moveTo(t){t.appendChild(this.target)}getParent(){return this.target.parentElement}getNextSibling(){return this.target.nextElementSibling}getPreviousSibling(){return this.target.previousElementSibling}hide(){this.target.style.display="none"}show(){this.target.style.removeProperty("display")}isHidden(){return"none"===window.getComputedStyle(this.target).display}scrollIntoView(t={behavior:"smooth"}){this.target.scrollIntoView(t)}matches(t){return this.target.matches(t)}getChildren(){return Array.from(this.target.children)}insertAfter(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target.nextSibling)}insertBefore(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target)}clearChildren(){for(;this.target.firstChild;)this.target.removeChild(this.target.firstChild)}animate(t,e){return this.target.animate(t,e)}}function l(t){const e=t.indexOf("$");return-1!==e?t.slice(e+1):""}class c{constructor(t){this.target=t,this.bindings=[]}addBinding(t){this.bindings.push(t)}removeBinding(t){this.bindings=this.bindings.filter((e=>e!==t))}async emit(t){await Promise.allSettled(this.bindings.map((e=>{try{const r=e(t);return r instanceof Promise?r:Promise.resolve(r)}catch(t){return Promise.reject(t)}})))}}class h{constructor(t,e){this.value=t,this.reactor=e??new c(this)}set(t){this.value=t,this.reactor.emit({type:"SET",target:this,value:t})}get(){return this.value}increase(t=1){"number"==typeof this.value&&this.set(this.value+t)}produce(e){const[r,n]=t.create(this.value);e(r),this.set(n())}}const u={on:function(t,e,r,n){"string"==typeof n&&(n=t.findName(l(n))),e.addEventListener(r,n)},ref:function(t,e,r,n){if("string"==typeof n&&(n=t.findName(l(n))),!(n instanceof a))throw Error("Rumious: ref directive required RumiousElementRef !");n.target=e},inject:function(t,e,r,n){if("string"==typeof n&&(n=t.findName(l(n))),!(n instanceof o))throw Error("Rumious: inject directive required RumiousInjector !");n.addTarget(e),n.inject(e)},bind:function(t,e,r,n){if("string"==typeof n&&(n=t.findName(l(n))),!(n instanceof h))throw Error("Rumious: bind directive required RumiousState !");e.setAttribute(r,n.value),n.reactor.addBinding((({})=>{e.setAttribute(r,n.value)}))},model:function(t,e,r,n){if("string"==typeof n&&(n=t.findName(l(n))),!(n instanceof h&&(e instanceof HTMLInputElement||e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)))throw Error("Rumious: model directive requires RumiousState and a valid form element!");{const t=e.type;e.addEventListener("input",(()=>{if(e instanceof HTMLInputElement)switch(t){case"checkbox":n.set(e.checked);break;case"radio":e.checked&&n.set(e.value);break;default:n.set(e.value)}else(e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)&&n.set(e.value)}))}}};class d{constructor(t,e){this.state=t,this.callback=e}prepare(t,e){this.anchorElement=t,this.context=e}async render(){this.state.reactor.addBinding(this.onStateChange.bind(this)),requestAnimationFrame((()=>{this.renderAll()}))}renderAll(){this.anchorElement.textContent="";let t=document.createDocumentFragment();this.state.value.forEach(((e,r)=>{let n=document.createDocumentFragment(),s=this.callback(e,r);this.context.renderHelper(this.context,s,n),t.appendChild(n)})),this.anchorElement.replaceChildren(t)}updateElement(t,e){let r=this.anchorElement.children[t];if(!r)return;let n=this.callback(e,t),s=document.createDocumentFragment();this.context.renderHelper(this.context,n,s),this.anchorElement.replaceChild(s,r)}insertOrAppendElement(t,e){let r=document.createDocumentFragment(),n=this.callback(t,e);this.context.renderHelper(this.context,n,r);let s=this.anchorElement.children[e];s?this.anchorElement.insertBefore(r,s):this.anchorElement.appendChild(r)}removeElement(t){let e=this.anchorElement.children[t];e&&e.remove()}async onStateChange(t){switch(t.type){case"SET":default:requestAnimationFrame((()=>{this.renderAll()}));break;case"SET_BY_KEY":this.updateElement(t.key,t.value);break;case"REMOVE_BY_KEY":this.removeElement(t.key);break;case"INSERT_BY_KEY":this.insertOrAppendElement(t.value,t.key);break;case"APPEND":this.insertOrAppendElement(t.value,this.state.value.length);break;case"PREPEND":let e=document.createDocumentFragment(),r=t.value,n=this.callback(r,0);this.context.renderHelper(this.context,n,e),this.anchorElement.prepend(e)}}}async function m(t,e,r,s){if(e.parentNode)if(function(t){return t!==Object(t)}(r))e.textContent=String(r);else if(r&&r instanceof h&&r.value instanceof Node){let o=e;if(!o.parentNode)return;function a({}){document.contains(o)&&o.parentNode?(r.value instanceof n&&r.value.setContext(s),o.parentNode.replaceChild(r.value,o),o=r.value):r.reactor.removeBinding(a)}r.value instanceof n&&r.value.setContext(s),o.parentNode.replaceChild(r.value,o),o=r.value,r.reactor.addBinding(a)}else if(r&&r instanceof h){function l({}){document.contains(e)?e.textContent=r.value:r.reactor.removeBinding(l)}e.textContent=r.value,r.reactor.addBinding(l)}else if(Array.isArray(r))e.textContent=r.map(String).join("");else if(r instanceof d)r.prepare(e.parentElement,s),r.render();else if(r instanceof HTMLElement)e.replaceWith(r);else if(r instanceof i){let c=document.createDocumentFragment();s.renderHelper?.(s,r,c),e.replaceWith(c)}else if(r instanceof NodeList||r instanceof HTMLCollection){if(0===r.length)return void e.remove();const u=document.createDocumentFragment();for(const m of Array.from(r))u.appendChild(m.cloneNode(!0));e.replaceWith(u),e.remove()}else if(r&&"function"==typeof r.toString)try{e.textContent=r.toString()}catch{e.textContent=""}else e.textContent=""}function p(t){return new i(t)}window.RUMIOUS_JSX={template:p,createElement:function(...t){throw console.log(t),Error("Rumious doesn't use createElement !")},addDirective:function(t,e,r,n="",s){let i=u[r];if(!i)throw Error("Rumious: Cannot solve directive !");i(e,t,n,s)},dynamicValue:function(t,e,r,n){m(0,e,r,n)},createComponent:function(t){let e=t.tagName;return window.customElements.get(e)||window.customElements.define(e,class extends n{static tag=e}),document.createElement(e)}};class g extends h{constructor(t,e){super(t,e)}set(t,e){if("number"==typeof t&&void 0!==e){const r=t,n=e;this.value[r]=n,this.reactor.emit({type:"SET_BY_KEY",value:n,target:this,key:r,item:n})}else{if(!Array.isArray(t))throw new Error("Invalid arguments passed to set()");super.set(t)}}get(t){return"number"==typeof t?this.value[t]:this.value}insert(t,e){return this.value.splice(t,0,e),this.reactor.emit({type:"INSERT_BY_KEY",value:e,target:this,key:t,item:e}),this}remove(t){return this.value.splice(t,1),this.reactor.emit({type:"REMOVE_BY_KEY",value:null,target:this,key:t}),this}append(t){return this.value.push(t),this.reactor.emit({type:"APPEND",value:t,target:this,item:t}),this}prepend(t){return this.value.unshift(t),this.reactor.emit({type:"PREPEND",value:t,target:this,item:t}),this}clear(){return this.value.length=0,this.reactor.emit({type:"SET",value:null,target:this}),this}replace(t,e){if(t<0||t>=this.value.length)throw new Error("Index out of bounds");return this.value[t]=e,this.reactor.emit({type:"SET_BY_KEY",value:e,target:this,key:t,item:e}),this}filter(t){return this.value=this.value.filter(t),this.reactor.emit({type:"SET",value:null,target:this}),this}map(t){return this.value=this.value.map(t),this.reactor.emit({type:"SET",value:null,target:this}),this}sort(t){return this.value.sort(t),this.reactor.emit({type:"SET",value:null,target:this}),this}reverse(){return this.value.reverse(),this.reactor.emit({type:"SET",value:null,target:this}),this}get length(){return this.value.length}forEach(t){this.value.forEach(t)}}class f extends h{#t=!1;constructor(t,e){super(t,e)}set(t,e){if(this.#t)throw new Error("Object is locked");if("string"==typeof t){const r=t,n=e;return this.value[r]=n,this.reactor.emit({type:"SET_BY_KEY",value:{...this.value},target:this,key:r,item:n}),this}if("object"!=typeof t)throw new Error("Invalid arguments passed to set()");super.set(t)}remove(t){if(this.#t)throw new Error("Object is locked");return t in this.value&&(delete this.value[t],this.reactor.emit({type:"REMOVE_BY_KEY",value:{...this.value},target:this,key:t})),this}merge(t){if(this.#t)throw new Error("Object is locked");return Object.assign(this.value,t),this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}assign(t){if(this.#t)throw new Error("Object is locked");return this.value={...this.value,...t},this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}clear(){if(this.#t)throw new Error("Object is locked");for(const t in this.value)delete this.value[t];return this.reactor.emit({type:"SET",value:{},target:this}),this}get(t){return"string"==typeof t?this.value[t]:this.value}keys(){return Object.keys(this.value)}values(){return Object.values(this.value)}entries(){return Object.entries(this.value)}has(t){return t in this.value}get size(){return Object.keys(this.value).length}forEach(t){Object.entries(this.value).forEach((([e,r])=>{t(r,e,this.value)}))}map(t){const e={};return Object.entries(this.value).forEach((([r,n])=>{e[r]=t(n,r,this.value)})),e}clone(){return JSON.parse(JSON.stringify(this.value))}toJSON(){return JSON.parse(JSON.stringify(this.value))}toObject(){return this.get()}lock(){return this.#t=!0,this}unlock(){return this.#t=!1,this}get isLocked(){return this.#t}freeze(){return Object.freeze(this.value),this}unfreeze(){return this.value=JSON.parse(JSON.stringify(this.value)),this}get isFrozen(){return Object.isFrozen(this.value)}}window.RUMIOUS_CONTEXTS={};class v{constructor(t={}){this.events={},this.values=t}has(t){return t in this.values}set(t,e){this.values[t]=e}get(t){return this.values[t]}on(t,e){this.events[t]||(this.events[t]=[]),this.events[t].push(e)}off(t,e){this.events[t]&&(this.events[t]=this.events[t].filter((t=>t!==e)))}emit(t,e){this.events[t]&&this.events[t].forEach((t=>t(e)))}}exports.Fragment=function(...t){throw Error("Fragment element must be compiled by Rumious !")},exports.RumiousApp=s,exports.RumiousArrayState=g,exports.RumiousChildrenRef=class{constructor(t){this.target=t}list(){return Array.from(this.target.children)}getChild(t){return this.list()[t]}remove(t){this.list()[t]?.remove()}add(t){this.target.appendChild(t)}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}clear(){this.target.innerHTML=""}replaceChild(t,e){const r=this.getChild(t);r&&this.target.replaceChild(e,r)}insertBefore(t,e){const r=this.getChild(e);r?this.target.insertBefore(t,r):this.add(t)}prepend(t){this.target.prepend(t)}getFirstChild(){return this.list()[0]}getLastChild(){return this.list()[this.list().length-1]}hasChildren(){return this.target.hasChildNodes()}count(){return this.target.children.length}find(t){return this.list().find(t)}forEach(t){this.list().forEach(t)}removeAllMatching(t){this.querySelectorAll(t).forEach((t=>t.remove()))}toggleClass(t){this.list().forEach((e=>e.classList.toggle(t)))}setAttribute(t,e){this.list().forEach((r=>r.setAttribute(t,e)))}},exports.RumiousComponent=class{static classNames="";static tagName="rumious-component";constructor(){this.renderOptions={mode:"idle"}}onCreate(){}onRender(){}onDestroy(){}async onBeforeRender(){}prepare(t,r){this.props=r,this.context=new e(this,t.app)}async requestRender(){await this.onBeforeRender();let t=this.template();r(this.context,t,this.element),this.onRender()}requestCleanup(){}},exports.RumiousComponentElement=n,exports.RumiousContext=v,exports.RumiousDymanicInjector=o,exports.RumiousElementRef=a,exports.RumiousModule=class{},exports.RumiousObjectState=f,exports.RumiousRenderTemplate=i,exports.RumiousState=h,exports.createApp=function(t,e){return new s(t,e)},exports.createArrayState=function(t){return new g(t)},exports.createContext=function(t,e=function(t="_"){return`${t}${(Math.floor(9999*Math.random())*Date.now()).toString(32)}`}("rctx_")){if(window.RUMIOUS_CONTEXTS[e])return window.RUMIOUS_CONTEXTS[e];{let r=new v(t);return window.RUMIOUS_CONTEXTS[e]=r,r}},exports.createElementRef=function(){return new a(document.createElement("span"))},exports.createHTMLInjector=function(t){return new o([t])},exports.createObjectState=function(t){return new f(t)},exports.createState=function(t){return new h(t)},exports.denounce=function(t,e){let r;return function(...n){clearTimeout(r),r=setTimeout((()=>t.apply(this,n)),e)}},exports.leadingTrailingDebounce=function(t,e){let r,n=!0;return function(...s){n&&(t.apply(this,s),n=!1),clearTimeout(r),r=setTimeout((()=>{t.apply(this,s),n=!0}),e)}},exports.rafThrottle=function(t){let e=!1;return function(...r){e||(e=!0,requestAnimationFrame((()=>{t.apply(this,r),e=!1})))}},exports.renderComponent=function(t,e){let r=window.RUMIOUS_JSX.createComponent(t);return r.props=e,r.setComponent(t),r},exports.renderDynamicArray=function(t,e){return new d(t,e)},exports.template=p,exports.tholle=function(t,e){let r=0;return function(...n){const s=Date.now();s-r>=e&&(r=s,t.apply(this,n))}},exports.trailingThrottle=function(t,e){let r=0,n=null,s=null;function i(){r=Date.now(),t.apply(this,n),n=null}return function(...t){const o=Date.now();n=t,o-r>=e?i.call(this):s||(s=setTimeout((()=>{s=null,i.call(this)}),e-(o-r)))}},exports.unwatch=function(t,e){t.reactor.removeBinding(e)},exports.watch=function(t,e){t.reactor.addBinding(e)};
+var t=require("mutative");class e{constructor(t,e){this.target=t,this.app=e,this.onRenderFinished=[]}findName(t){return this.target[t]}}function r(t,e,s){let n=e.generator.bind(t.target);t.renderHelper=r,n(s,t),setTimeout((async()=>{const e=[...t.onRenderFinished];t.onRenderFinished=[];for(const t of e)await t()}),0)}class s extends HTMLElement{constructor(){super(),this.props={}}setContext(t){this.context=t}setComponent(t){this.componentConstructor=t}setup(t,e){this.context=t,this.componentConstructor=e}connectedCallback(){this.componentConstructor?(this.componentInstance=new this.componentConstructor,this.componentInstance.element=this,this.componentConstructor.classNames&&(this.className=this.componentConstructor.classNames),this.componentInstance.prepare(this.context,this.props),this.componentInstance.onCreate(),this.componentInstance.requestRender()):console.warn("Rumious: Cannot find matching component constructor.")}disconnectedCallback(){this.componentInstance?.onDestroy()}}class n{constructor(t,r={}){this.root=t,this.options=r,this.modules=[],this.context=new e(this,this)}addModule(t,e){const r=t.init(this,e);return this.modules.push(r),r}render(t){r(this.context,t,this.root)}}class i{constructor(t){this.generator=t}}class o{constructor(t){if(this.contents=t,this.targets=new Map,!t||0===t.length)throw new Error("Injector must be initialized with non-empty content");const e=t[0];this.type="string"==typeof e?"string":"element"}commit(t){this.contents=t;const e=t[0];this.type="string"==typeof e?"string":"element"}addTarget(t){this.targets.set(t,1)}inject(t){if(this.targets.has(t)&&this.contents)if(t.innerHTML="","string"===this.type)for(const e of this.contents)t.insertAdjacentHTML("beforeend",e);else for(const e of this.contents)t.appendChild(e)}injectAll(){for(const t of this.targets.keys())this.inject(t)}removeTarget(t){this.targets.delete(t)}clear(){this.targets.clear()}}class a{constructor(t){this.target=t}getElement(){return this.target}remove(){this.target.remove()}addChild(t){this.target.appendChild(t)}listChild(){return this.target.childNodes}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}set text(t){this.target.textContent=t}get text(){return this.target.textContent}set value(t){(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.value=t)}get value(){if(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)return this.target.value}addClassName(t){this.target.classList.add(t)}removeClassName(t){this.target.classList.remove(t)}hasClassName(t){return this.target.classList.contains(t)}toggleClass(t,e){return this.target.classList.toggle(t,e)}setStyle(t){Object.assign(this.target.style,t)}getStyle(t){return getComputedStyle(this.target).getPropertyValue(t)}setAttribute(t,e){this.target.setAttribute(t,e)}getAttribute(t){return this.target.getAttribute(t)}removeAttribute(t){this.target.removeAttribute(t)}on(t,e,r){this.target.addEventListener(t,e,r)}off(t,e,r){this.target.removeEventListener(t,e,r)}set html(t){this.target.innerHTML=t}get html(){return this.target.innerHTML}getBoundingRect(){return this.target.getBoundingClientRect()}isInViewport(){const t=this.target.getBoundingClientRect();return t.top>=0&&t.left>=0&&t.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&t.right<=(window.innerWidth||document.documentElement.clientWidth)}prependChild(t){this.target.prepend(t)}setDisabled(t){(this.target instanceof HTMLButtonElement||this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.disabled=t)}addClasses(...t){this.target.classList.add(...t)}removeClasses(...t){this.target.classList.remove(...t)}replaceClass(t,e){this.target.classList.replace(t,e)}moveTo(t){t.appendChild(this.target)}getParent(){return this.target.parentElement}getNextSibling(){return this.target.nextElementSibling}getPreviousSibling(){return this.target.previousElementSibling}hide(){this.target.style.display="none"}show(){this.target.style.removeProperty("display")}isHidden(){return"none"===window.getComputedStyle(this.target).display}scrollIntoView(t={behavior:"smooth"}){this.target.scrollIntoView(t)}matches(t){return this.target.matches(t)}getChildren(){return Array.from(this.target.children)}insertAfter(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target.nextSibling)}insertBefore(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target)}clearChildren(){for(;this.target.firstChild;)this.target.removeChild(this.target.firstChild)}animate(t,e){return this.target.animate(t,e)}}function h(t){const e=t.indexOf("$");return-1!==e?t.slice(e+1):""}class l{constructor(t){this.target=t,this.bindings=[]}addBinding(t){this.bindings.push(t)}removeBinding(t){this.bindings=this.bindings.filter((e=>e!==t))}async emit(t){await Promise.allSettled(this.bindings.map((e=>{try{const r=e(t);return r instanceof Promise?r:Promise.resolve(r)}catch(t){return Promise.reject(t)}})))}}class c{constructor(t,e){this.value=t,this.reactor=e??new l(this)}set(t){this.value=t,this.reactor.emit({type:"SET",target:this,value:t})}get(){return this.value}increase(t=1){"number"==typeof this.value&&this.set(this.value+t)}produce(e){const[r,s]=t.create(this.value);e(r),this.set(s())}}function u(t,e){t.reactor.addBinding(e)}function d(t,e){t.reactor.removeBinding(e)}const g={on:function(t,e,r,s){"string"==typeof s&&(s=t.findName(h(s))),e.addEventListener(r,s)},ref:function(t,e,r,s){if("string"==typeof s&&(s=t.findName(h(s))),!(s instanceof a))throw Error("Rumious: ref directive required RumiousElementRef !");s.target=e},inject:function(t,e,r,s){if("string"==typeof s&&(s=t.findName(h(s))),!(s instanceof o))throw Error("Rumious: inject directive required RumiousInjector !");s.addTarget(e),s.inject(e)},bind:function(t,e,r,s){if("string"==typeof s&&(s=t.findName(h(s))),!(s instanceof c))throw Error("Rumious: bind directive required RumiousState !");e.setAttribute(r,s.value),s.reactor.addBinding((({})=>{e.setAttribute(r,s.value)}))},model:function(t,e,r,s){if("string"==typeof s&&(s=t.findName(h(s))),!(s instanceof c&&(e instanceof HTMLInputElement||e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)))throw Error("Rumious: model directive requires RumiousState and a valid form element!");{const t=e.type;e.addEventListener("input",(()=>{if(e instanceof HTMLInputElement)switch(t){case"checkbox":s.set(e.checked);break;case"radio":e.checked&&s.set(e.value);break;default:s.set(e.value)}else(e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)&&s.set(e.value)}))}}};class m{constructor(t,e){this.state=t,this.callback=e}prepare(t,e){this.anchorElement=t,this.context=e}renderItem(t,e){const r=document.createDocumentFragment(),s=this.callback(t,e);return this.context.renderHelper(this.context,s,r),r}scheduleRenderAll(){requestAnimationFrame((()=>this.renderAll()))}async render(){this.state.reactor.addBinding(this.onStateChange.bind(this)),this.scheduleRenderAll()}renderAll(){const t=document.createDocumentFragment();this.state.value.forEach(((e,r)=>{t.appendChild(this.renderItem(e,r))})),this.anchorElement.replaceChildren(t)}updateElement(t,e){const r=this.anchorElement.children[t];r&&this.anchorElement.replaceChild(this.renderItem(e,t),r)}insertOrAppendElement(t,e){const r=this.renderItem(t,e),s=this.anchorElement.children[e];s?this.anchorElement.insertBefore(r,s):this.anchorElement.appendChild(r)}removeElement(t){this.anchorElement.children[t]?.remove()}appendElement(t,e){if(Array.isArray(t)){const r=document.createDocumentFragment();t.forEach(((t,s)=>{r.appendChild(this.renderItem(t,e+s))})),this.anchorElement.replaceChildren(r),this.anchorElement.appendChild(r)}}async onStateChange(t){if(document.contains(this.anchorElement))switch(t.type){case"SET":default:this.scheduleRenderAll();break;case"SET_BY_KEY":this.updateElement(t.key,t.value);break;case"REMOVE_BY_KEY":this.removeElement(t.key);break;case"INSERT_BY_KEY":this.insertOrAppendElement(t.value,t.key);break;case"APPEND":this.appendElement(t.value,this.state.value.length-t.value.length);break;case"PREPEND":this.anchorElement.prepend(this.renderItem(t.value,0))}else this.state.reactor.removeBinding(this.onStateChange.bind(this))}}class p extends m{isLoading=!1;constructor(t){super(t.data,t.template),this.options=t,this.limit=t.limit??50,this.offset=t.offset??0}setState(t){this.options.state?.set(t)}async fetchData(){const t=await(this.options.loader?.(this.limit,this.offset))??[];return this.offset+=t.length,t}getScrollInfo(){const t=this.options.scrollElement;return t===window?{scrollTop:window.scrollY,scrollHeight:document.documentElement.scrollHeight,clientHeight:window.innerHeight}:{scrollTop:t.scrollTop,scrollHeight:t.scrollHeight,clientHeight:t.clientHeight}}async render(){const t=this.options.scrollElement,e=async()=>{const{scrollTop:r,scrollHeight:s,clientHeight:n}=this.getScrollInfo();if(r+n>=s-this.options.threshold&&!this.isLoading){this.isLoading=!0,this.setState("START_FETCH");const r=await this.fetchData();this.setState("END_FETCH"),0===r.length?(this.setState("NO_DATA"),t.removeEventListener("scroll",e)):this.state.append(...Array.isArray(r)?r:[]),this.isLoading=!1}};t.addEventListener("scroll",e),this.state.reactor.addBinding(this.onStateChange.bind(this)),this.scheduleRenderAll()}}class f extends m{constructor(t){super(t.data,t.template),this.options=t,this.size=t.size,this.currentPage=t.page??0}getPageData(){const t=this.currentPage*this.size,e=t+this.size;return this.state.value.slice(t,e)}renderPage(){const t=document.createDocumentFragment(),e=this.currentPage*this.size,r=e+this.size;this.state.value.slice(e,r).forEach(((r,s)=>{t.appendChild(this.renderItem(r,e+s))})),this.anchorElement.replaceChildren(t),this.calculate()}goToPage(t){const e=Math.floor(this.state.value.length/this.size);console.log(e),this.currentPage=Math.max(0,Math.min(t,e)),this.renderPage()}nextPage(){this.goToPage(this.currentPage+1)}prevPage(){this.goToPage(this.currentPage-1)}onControl({value:t}){switch(t){case"NEXT":this.nextPage();break;case"PREV":this.prevPage()}}async calculate(){if(this.options.info&&this.options.info.set({current:this.currentPage,size:this.options.size}),this.options.pages){const e=Math.floor(this.state.value.length/this.size);let r=[];for(var t=0;t<e;t++)r.push({isRender:this.currentPage===t,index:t});this.options.pages.set(r)}}async render(){u(this.options.controller,this.onControl.bind(this)),this.options.controller,this.state.reactor.addBinding(this.onStateChange.bind(this)),this.renderPage()}async onStateChange(t){if(!document.contains(this.anchorElement))return d(this.options.controller,this.onControl.bind(this)),void this.state.reactor.removeBinding(this.onStateChange.bind(this));const e=this.currentPage*this.size,r=e+this.size;switch(t.type){case"SET":this.currentPage=0,this.renderPage();break;case"SET_BY_KEY":case"REMOVE_BY_KEY":case"INSERT_BY_KEY":(s=t.key)>=e&&s<r&&this.renderPage();break;case"APPEND":const n=this.state.value.length,i=Math.floor((n-1)/this.size);this.currentPage===i&&this.renderPage();break;default:this.renderPage()}var s}}async function v(t,e,r,n){if(e.parentNode)if(function(t){return t!==Object(t)}(r))e.textContent=String(r);else if(r&&r instanceof c&&r.value instanceof Node){let o=e;if(!o.parentNode)return;function a({}){document.contains(o)&&o.parentNode?(r.value instanceof s&&r.value.setContext(n),o.parentNode.replaceChild(r.value,o),o=r.value):r.reactor.removeBinding(a)}r.value instanceof s&&r.value.setContext(n),o.parentNode.replaceChild(r.value,o),o=r.value,r.reactor.addBinding(a)}else if(r&&r instanceof c){function h({}){document.contains(e)?e.textContent=r.value:r.reactor.removeBinding(h)}e.textContent=r.value,r.reactor.addBinding(h)}else if(Array.isArray(r))e.textContent=r.map(String).join("");else if(r instanceof m)r.prepare(e.parentElement,n),r.render();else if(r instanceof HTMLElement)e.replaceWith(r);else if(r instanceof i){let l=document.createDocumentFragment();n.renderHelper?.(n,r,l),e.replaceWith(l)}else if(r instanceof NodeList||r instanceof HTMLCollection){if(0===r.length)return void e.remove();const u=document.createDocumentFragment();for(const d of Array.from(r))u.appendChild(d.cloneNode(!0));e.replaceWith(u),e.remove()}else if(r&&"function"==typeof r.toString)try{e.textContent=r.toString()}catch{e.textContent=""}else e.textContent=""}function E(t){return new i(t)}window.RUMIOUS_JSX={template:E,createElement:function(...t){throw console.log(t),Error("Rumious doesn't use createElement !")},addDirective:function(t,e,r,s="",n){let i=g[r];if(!i)throw Error("Rumious: Cannot solve directive !");i(e,t,s,n)},dynamicValue:function(t,e,r,s){v(0,e,r,s)},createComponent:function(t){let e=t.tagName;return window.customElements.get(e)||window.customElements.define(e,class extends s{static tag=e}),document.createElement(e)}};class y extends c{constructor(t,e){super(t,e)}set(t,e){if("number"==typeof t&&void 0!==e){const r=t,s=e;this.value[r]=s,this.reactor.emit({type:"SET_BY_KEY",value:s,target:this,key:r})}else{if(!Array.isArray(t))throw new Error("Invalid arguments passed to set()");super.set(t)}}get(t){return"number"==typeof t?this.value[t]:this.value}insert(t,e){return this.value.splice(t,0,e),this.reactor.emit({type:"INSERT_BY_KEY",value:e,target:this,key:t}),this}remove(t){return this.value.splice(t,1),this.reactor.emit({type:"REMOVE_BY_KEY",value:null,target:this,key:t}),this}append(...t){return this.value.push(...t),this.reactor.emit({type:"APPEND",value:t,target:this}),this}prepend(t){return this.value.unshift(t),this.reactor.emit({type:"PREPEND",value:t,target:this}),this}clear(){return this.value.length=0,this.reactor.emit({type:"SET",value:null,target:this}),this}replace(t,e){if(t<0||t>=this.value.length)throw new Error("Index out of bounds");return this.value[t]=e,this.reactor.emit({type:"SET_BY_KEY",value:e,target:this,key:t}),this}filter(t){return this.value=this.value.filter(t),this.reactor.emit({type:"SET",value:null,target:this}),this}map(t){return this.value=this.value.map(t),this.reactor.emit({type:"SET",value:null,target:this}),this}sort(t){return this.value.sort(t),this.reactor.emit({type:"SET",value:null,target:this}),this}reverse(){return this.value.reverse(),this.reactor.emit({type:"SET",value:null,target:this}),this}get length(){return this.value.length}forEach(t){this.value.forEach(t)}}class C extends c{#t=!1;constructor(t,e){super(t,e)}set(t,e){if(this.#t)throw new Error("Object is locked");if("string"==typeof t){const r=t,s=e;return this.value[r]=s,this.reactor.emit({type:"SET_BY_KEY",value:s,target:this,key:r}),this}if("object"!=typeof t)throw new Error("Invalid arguments passed to set()");super.set(t)}remove(t){if(this.#t)throw new Error("Object is locked");return t in this.value&&(delete this.value[t],this.reactor.emit({type:"REMOVE_BY_KEY",value:{...this.value},target:this,key:t})),this}merge(t){if(this.#t)throw new Error("Object is locked");return Object.assign(this.value,t),this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}assign(t){if(this.#t)throw new Error("Object is locked");return this.value={...this.value,...t},this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}clear(){if(this.#t)throw new Error("Object is locked");for(const t in this.value)delete this.value[t];return this.reactor.emit({type:"SET",value:{},target:this}),this}get(t){return"string"==typeof t?this.value[t]:this.value}keys(){return Object.keys(this.value)}values(){return Object.values(this.value)}entries(){return Object.entries(this.value)}has(t){return t in this.value}get size(){return Object.keys(this.value).length}forEach(t){Object.entries(this.value).forEach((([e,r])=>{t(r,e,this.value)}))}map(t){const e={};return Object.entries(this.value).forEach((([r,s])=>{e[r]=t(s,r,this.value)})),e}clone(){return JSON.parse(JSON.stringify(this.value))}toJSON(){return JSON.parse(JSON.stringify(this.value))}toObject(){return this.get()}lock(){return this.#t=!0,this}unlock(){return this.#t=!1,this}get isLocked(){return this.#t}freeze(){return Object.freeze(this.value),this}unfreeze(){return this.value=JSON.parse(JSON.stringify(this.value)),this}get isFrozen(){return Object.isFrozen(this.value)}}window.RUMIOUS_CONTEXTS={};class w{constructor(t={}){this.events={},this.values=t}has(t){return t in this.values}set(t,e){this.values[t]=e}get(t){return this.values[t]}on(t,e){this.events[t]||(this.events[t]=[]),this.events[t].push(e)}off(t,e){this.events[t]&&(this.events[t]=this.events[t].filter((t=>t!==e)))}emit(t,e){this.events[t]&&this.events[t].forEach((t=>t(e)))}}exports.Fragment=function(...t){throw Error("Fragment element must be compiled by Rumious !")},exports.RumiousApp=n,exports.RumiousArrayState=y,exports.RumiousChildrenRef=class{constructor(t){this.target=t}list(){return Array.from(this.target.children)}getChild(t){return this.list()[t]}remove(t){this.list()[t]?.remove()}add(t){this.target.appendChild(t)}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}clear(){this.target.innerHTML=""}replaceChild(t,e){const r=this.getChild(t);r&&this.target.replaceChild(e,r)}insertBefore(t,e){const r=this.getChild(e);r?this.target.insertBefore(t,r):this.add(t)}prepend(t){this.target.prepend(t)}getFirstChild(){return this.list()[0]}getLastChild(){return this.list()[this.list().length-1]}hasChildren(){return this.target.hasChildNodes()}count(){return this.target.children.length}find(t){return this.list().find(t)}forEach(t){this.list().forEach(t)}removeAllMatching(t){this.querySelectorAll(t).forEach((t=>t.remove()))}toggleClass(t){this.list().forEach((e=>e.classList.toggle(t)))}setAttribute(t,e){this.list().forEach((r=>r.setAttribute(t,e)))}},exports.RumiousComponent=class{static classNames="";static tagName="rumious-component";constructor(){this.renderOptions={mode:"idle"}}onCreate(){}onRender(){}onDestroy(){}async onBeforeRender(){}prepare(t,r){this.props=r,this.context=new e(this,t.app)}async requestRender(){await this.onBeforeRender();let t=this.template();r(this.context,t,this.element),this.onRender()}requestCleanup(){}},exports.RumiousComponentElement=s,exports.RumiousContext=w,exports.RumiousDymanicInjector=o,exports.RumiousElementRef=a,exports.RumiousModule=class{},exports.RumiousObjectState=C,exports.RumiousRenderTemplate=i,exports.RumiousState=c,exports.createApp=function(t,e){return new n(t,e)},exports.createArrayState=function(t){return new y(t)},exports.createContext=function(t,e=function(t="_"){return`${t}${(Math.floor(9999*Math.random())*Date.now()).toString(32)}`}("rctx_")){if(window.RUMIOUS_CONTEXTS[e])return window.RUMIOUS_CONTEXTS[e];{let r=new w(t);return window.RUMIOUS_CONTEXTS[e]=r,r}},exports.createElementRef=function(){return new a(document.createElement("span"))},exports.createHTMLInjector=function(t){return new o([t])},exports.createInfinityScroll=function(t){return new p(t)},exports.createObjectState=function(t){return new C(t)},exports.createPagination=function(t){return new f(t)},exports.createState=function(t){return new c(t)},exports.denounce=function(t,e){let r;return function(...s){clearTimeout(r),r=setTimeout((()=>t.apply(this,s)),e)}},exports.leadingTrailingDebounce=function(t,e){let r,s=!0;return function(...n){s&&(t.apply(this,n),s=!1),clearTimeout(r),r=setTimeout((()=>{t.apply(this,n),s=!0}),e)}},exports.rafThrottle=function(t){let e=!1;return function(...r){e||(e=!0,requestAnimationFrame((()=>{t.apply(this,r),e=!1})))}},exports.renderComponent=function(t,e){let r=window.RUMIOUS_JSX.createComponent(t);return r.props=e,r.setComponent(t),r},exports.renderList=function(t,e){return new m(t,e)},exports.template=E,exports.tholle=function(t,e){let r=0;return function(...s){const n=Date.now();n-r>=e&&(r=n,t.apply(this,s))}},exports.trailingThrottle=function(t,e){let r=0,s=null,n=null;function i(){r=Date.now(),t.apply(this,s),s=null}return function(...t){const o=Date.now();s=t,o-r>=e?i.call(this):n||(n=setTimeout((()=>{n=null,i.call(this)}),e-(o-r)))}},exports.unwatch=d,exports.watch=u;

package/dist/index.esm.js

@@ -1 +1 @@
-import{create as t}from"mutative";class e{constructor(t,e){this.target=t,this.app=e,this.onRenderFinished=[]}findName(t){return this.target[t]}}function n(t,e,r){let i=e.generator.bind(t.target);t.renderHelper=n,i(r,t),setTimeout((async()=>{const e=[...t.onRenderFinished];t.onRenderFinished=[];for(const t of e)await t()}),0)}class r{static classNames="";static tagName="rumious-component";constructor(){this.renderOptions={mode:"idle"}}onCreate(){}onRender(){}onDestroy(){}async onBeforeRender(){}prepare(t,n){this.props=n,this.context=new e(this,t.app)}async requestRender(){await this.onBeforeRender();let t=this.template();n(this.context,t,this.element),this.onRender()}requestCleanup(){}}class i extends HTMLElement{constructor(){super(),this.props={}}setContext(t){this.context=t}setComponent(t){this.componentConstructor=t}setup(t,e){this.context=t,this.componentConstructor=e}connectedCallback(){this.componentConstructor?(this.componentInstance=new this.componentConstructor,this.componentInstance.element=this,this.componentConstructor.classNames&&(this.className=this.componentConstructor.classNames),this.componentInstance.prepare(this.context,this.props),this.componentInstance.onCreate(),this.componentInstance.requestRender()):console.warn("Rumious: Cannot find matching component constructor.")}disconnectedCallback(){this.componentInstance?.onDestroy()}}function s(t,e){let n=window.RUMIOUS_JSX.createComponent(t);return n.props=e,n.setComponent(t),n}class a{constructor(t,n={}){this.root=t,this.options=n,this.modules=[],this.context=new e(this,this)}addModule(t,e){const n=t.init(this,e);return this.modules.push(n),n}render(t){n(this.context,t,this.root)}}function o(t,e){return new a(t,e)}class l{}class c{constructor(t){this.generator=t}}class h{constructor(t){if(this.contents=t,this.targets=new Map,!t||0===t.length)throw new Error("Injector must be initialized with non-empty content");const e=t[0];this.type="string"==typeof e?"string":"element"}commit(t){this.contents=t;const e=t[0];this.type="string"==typeof e?"string":"element"}addTarget(t){this.targets.set(t,1)}inject(t){if(this.targets.has(t)&&this.contents)if(t.innerHTML="","string"===this.type)for(const e of this.contents)t.insertAdjacentHTML("beforeend",e);else for(const e of this.contents)t.appendChild(e)}injectAll(){for(const t of this.targets.keys())this.inject(t)}removeTarget(t){this.targets.delete(t)}clear(){this.targets.clear()}}function u(t){return new h([t])}class d{constructor(t){this.target=t}getElement(){return this.target}remove(){this.target.remove()}addChild(t){this.target.appendChild(t)}listChild(){return this.target.childNodes}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}set text(t){this.target.textContent=t}get text(){return this.target.textContent}set value(t){(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.value=t)}get value(){if(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)return this.target.value}addClassName(t){this.target.classList.add(t)}removeClassName(t){this.target.classList.remove(t)}hasClassName(t){return this.target.classList.contains(t)}toggleClass(t,e){return this.target.classList.toggle(t,e)}setStyle(t){Object.assign(this.target.style,t)}getStyle(t){return getComputedStyle(this.target).getPropertyValue(t)}setAttribute(t,e){this.target.setAttribute(t,e)}getAttribute(t){return this.target.getAttribute(t)}removeAttribute(t){this.target.removeAttribute(t)}on(t,e,n){this.target.addEventListener(t,e,n)}off(t,e,n){this.target.removeEventListener(t,e,n)}set html(t){this.target.innerHTML=t}get html(){return this.target.innerHTML}getBoundingRect(){return this.target.getBoundingClientRect()}isInViewport(){const t=this.target.getBoundingClientRect();return t.top>=0&&t.left>=0&&t.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&t.right<=(window.innerWidth||document.documentElement.clientWidth)}prependChild(t){this.target.prepend(t)}setDisabled(t){(this.target instanceof HTMLButtonElement||this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.disabled=t)}addClasses(...t){this.target.classList.add(...t)}removeClasses(...t){this.target.classList.remove(...t)}replaceClass(t,e){this.target.classList.replace(t,e)}moveTo(t){t.appendChild(this.target)}getParent(){return this.target.parentElement}getNextSibling(){return this.target.nextElementSibling}getPreviousSibling(){return this.target.previousElementSibling}hide(){this.target.style.display="none"}show(){this.target.style.removeProperty("display")}isHidden(){return"none"===window.getComputedStyle(this.target).display}scrollIntoView(t={behavior:"smooth"}){this.target.scrollIntoView(t)}matches(t){return this.target.matches(t)}getChildren(){return Array.from(this.target.children)}insertAfter(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target.nextSibling)}insertBefore(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target)}clearChildren(){for(;this.target.firstChild;)this.target.removeChild(this.target.firstChild)}animate(t,e){return this.target.animate(t,e)}}function m(){return new d(document.createElement("span"))}function g(t){const e=t.indexOf("$");return-1!==e?t.slice(e+1):""}class p{constructor(t){this.target=t,this.bindings=[]}addBinding(t){this.bindings.push(t)}removeBinding(t){this.bindings=this.bindings.filter((e=>e!==t))}async emit(t){await Promise.allSettled(this.bindings.map((e=>{try{const n=e(t);return n instanceof Promise?n:Promise.resolve(n)}catch(t){return Promise.reject(t)}})))}}class f{constructor(t,e){this.value=t,this.reactor=e??new p(this)}set(t){this.value=t,this.reactor.emit({type:"SET",target:this,value:t})}get(){return this.value}increase(t=1){"number"==typeof this.value&&this.set(this.value+t)}produce(e){const[n,r]=t(this.value);e(n),this.set(r())}}function v(t,e){t.reactor.addBinding(e)}function E(t,e){t.reactor.removeBinding(e)}function y(t){return new f(t)}const C={on:function(t,e,n,r){"string"==typeof r&&(r=t.findName(g(r))),e.addEventListener(n,r)},ref:function(t,e,n,r){if("string"==typeof r&&(r=t.findName(g(r))),!(r instanceof d))throw Error("Rumious: ref directive required RumiousElementRef !");r.target=e},inject:function(t,e,n,r){if("string"==typeof r&&(r=t.findName(g(r))),!(r instanceof h))throw Error("Rumious: inject directive required RumiousInjector !");r.addTarget(e),r.inject(e)},bind:function(t,e,n,r){if("string"==typeof r&&(r=t.findName(g(r))),!(r instanceof f))throw Error("Rumious: bind directive required RumiousState !");e.setAttribute(n,r.value),r.reactor.addBinding((({})=>{e.setAttribute(n,r.value)}))},model:function(t,e,n,r){if("string"==typeof r&&(r=t.findName(g(r))),!(r instanceof f&&(e instanceof HTMLInputElement||e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)))throw Error("Rumious: model directive requires RumiousState and a valid form element!");{const t=e.type;e.addEventListener("input",(()=>{if(e instanceof HTMLInputElement)switch(t){case"checkbox":r.set(e.checked);break;case"radio":e.checked&&r.set(e.value);break;default:r.set(e.value)}else(e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)&&r.set(e.value)}))}}};class w{constructor(t,e){this.state=t,this.callback=e}prepare(t,e){this.anchorElement=t,this.context=e}async render(){this.state.reactor.addBinding(this.onStateChange.bind(this)),requestAnimationFrame((()=>{this.renderAll()}))}renderAll(){this.anchorElement.textContent="";let t=document.createDocumentFragment();this.state.value.forEach(((e,n)=>{let r=document.createDocumentFragment(),i=this.callback(e,n);this.context.renderHelper(this.context,i,r),t.appendChild(r)})),this.anchorElement.replaceChildren(t)}updateElement(t,e){let n=this.anchorElement.children[t];if(!n)return;let r=this.callback(e,t),i=document.createDocumentFragment();this.context.renderHelper(this.context,r,i),this.anchorElement.replaceChild(i,n)}insertOrAppendElement(t,e){let n=document.createDocumentFragment(),r=this.callback(t,e);this.context.renderHelper(this.context,r,n);let i=this.anchorElement.children[e];i?this.anchorElement.insertBefore(n,i):this.anchorElement.appendChild(n)}removeElement(t){let e=this.anchorElement.children[t];e&&e.remove()}async onStateChange(t){switch(t.type){case"SET":default:requestAnimationFrame((()=>{this.renderAll()}));break;case"SET_BY_KEY":this.updateElement(t.key,t.value);break;case"REMOVE_BY_KEY":this.removeElement(t.key);break;case"INSERT_BY_KEY":this.insertOrAppendElement(t.value,t.key);break;case"APPEND":this.insertOrAppendElement(t.value,this.state.value.length);break;case"PREPEND":let e=document.createDocumentFragment(),n=t.value,r=this.callback(n,0);this.context.renderHelper(this.context,r,e),this.anchorElement.prepend(e)}}}function b(t,e){return new w(t,e)}async function S(t,e,n,r){if(e.parentNode)if(function(t){return t!==Object(t)}(n))e.textContent=String(n);else if(n&&n instanceof f&&n.value instanceof Node){let s=e;if(!s.parentNode)return;function a({}){document.contains(s)&&s.parentNode?(n.value instanceof i&&n.value.setContext(r),s.parentNode.replaceChild(n.value,s),s=n.value):n.reactor.removeBinding(a)}n.value instanceof i&&n.value.setContext(r),s.parentNode.replaceChild(n.value,s),s=n.value,n.reactor.addBinding(a)}else if(n&&n instanceof f){function o({}){document.contains(e)?e.textContent=n.value:n.reactor.removeBinding(o)}e.textContent=n.value,n.reactor.addBinding(o)}else if(Array.isArray(n))e.textContent=n.map(String).join("");else if(n instanceof w)n.prepare(e.parentElement,r),n.render();else if(n instanceof HTMLElement)e.replaceWith(n);else if(n instanceof c){let l=document.createDocumentFragment();r.renderHelper?.(r,n,l),e.replaceWith(l)}else if(n instanceof NodeList||n instanceof HTMLCollection){if(0===n.length)return void e.remove();const h=document.createDocumentFragment();for(const u of Array.from(n))h.appendChild(u.cloneNode(!0));e.replaceWith(h),e.remove()}else if(n&&"function"==typeof n.toString)try{e.textContent=n.toString()}catch{e.textContent=""}else e.textContent=""}function T(t){return new c(t)}const x=function(...t){throw Error("Fragment element must be compiled by Rumious !")};window.RUMIOUS_JSX={template:T,createElement:function(...t){throw console.log(t),Error("Rumious doesn't use createElement !")},addDirective:function(t,e,n,r="",i){let s=C[n];if(!s)throw Error("Rumious: Cannot solve directive !");s(e,t,r,i)},dynamicValue:function(t,e,n,r){S(0,e,n,r)},createComponent:function(t){let e=t.tagName;return window.customElements.get(e)||window.customElements.define(e,class extends i{static tag=e}),document.createElement(e)}};class k{constructor(t){this.target=t}list(){return Array.from(this.target.children)}getChild(t){return this.list()[t]}remove(t){this.list()[t]?.remove()}add(t){this.target.appendChild(t)}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}clear(){this.target.innerHTML=""}replaceChild(t,e){const n=this.getChild(t);n&&this.target.replaceChild(e,n)}insertBefore(t,e){const n=this.getChild(e);n?this.target.insertBefore(t,n):this.add(t)}prepend(t){this.target.prepend(t)}getFirstChild(){return this.list()[0]}getLastChild(){return this.list()[this.list().length-1]}hasChildren(){return this.target.hasChildNodes()}count(){return this.target.children.length}find(t){return this.list().find(t)}forEach(t){this.list().forEach(t)}removeAllMatching(t){this.querySelectorAll(t).forEach((t=>t.remove()))}toggleClass(t){this.list().forEach((e=>e.classList.toggle(t)))}setAttribute(t,e){this.list().forEach((n=>n.setAttribute(t,e)))}}class N extends f{constructor(t,e){super(t,e)}set(t,e){if("number"==typeof t&&void 0!==e){const n=t,r=e;this.value[n]=r,this.reactor.emit({type:"SET_BY_KEY",value:r,target:this,key:n,item:r})}else{if(!Array.isArray(t))throw new Error("Invalid arguments passed to set()");super.set(t)}}get(t){return"number"==typeof t?this.value[t]:this.value}insert(t,e){return this.value.splice(t,0,e),this.reactor.emit({type:"INSERT_BY_KEY",value:e,target:this,key:t,item:e}),this}remove(t){return this.value.splice(t,1),this.reactor.emit({type:"REMOVE_BY_KEY",value:null,target:this,key:t}),this}append(t){return this.value.push(t),this.reactor.emit({type:"APPEND",value:t,target:this,item:t}),this}prepend(t){return this.value.unshift(t),this.reactor.emit({type:"PREPEND",value:t,target:this,item:t}),this}clear(){return this.value.length=0,this.reactor.emit({type:"SET",value:null,target:this}),this}replace(t,e){if(t<0||t>=this.value.length)throw new Error("Index out of bounds");return this.value[t]=e,this.reactor.emit({type:"SET_BY_KEY",value:e,target:this,key:t,item:e}),this}filter(t){return this.value=this.value.filter(t),this.reactor.emit({type:"SET",value:null,target:this}),this}map(t){return this.value=this.value.map(t),this.reactor.emit({type:"SET",value:null,target:this}),this}sort(t){return this.value.sort(t),this.reactor.emit({type:"SET",value:null,target:this}),this}reverse(){return this.value.reverse(),this.reactor.emit({type:"SET",value:null,target:this}),this}get length(){return this.value.length}forEach(t){this.value.forEach(t)}}function A(t){return new N(t)}class O extends f{#t=!1;constructor(t,e){super(t,e)}set(t,e){if(this.#t)throw new Error("Object is locked");if("string"==typeof t){const n=t,r=e;return this.value[n]=r,this.reactor.emit({type:"SET_BY_KEY",value:{...this.value},target:this,key:n,item:r}),this}if("object"!=typeof t)throw new Error("Invalid arguments passed to set()");super.set(t)}remove(t){if(this.#t)throw new Error("Object is locked");return t in this.value&&(delete this.value[t],this.reactor.emit({type:"REMOVE_BY_KEY",value:{...this.value},target:this,key:t})),this}merge(t){if(this.#t)throw new Error("Object is locked");return Object.assign(this.value,t),this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}assign(t){if(this.#t)throw new Error("Object is locked");return this.value={...this.value,...t},this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}clear(){if(this.#t)throw new Error("Object is locked");for(const t in this.value)delete this.value[t];return this.reactor.emit({type:"SET",value:{},target:this}),this}get(t){return"string"==typeof t?this.value[t]:this.value}keys(){return Object.keys(this.value)}values(){return Object.values(this.value)}entries(){return Object.entries(this.value)}has(t){return t in this.value}get size(){return Object.keys(this.value).length}forEach(t){Object.entries(this.value).forEach((([e,n])=>{t(n,e,this.value)}))}map(t){const e={};return Object.entries(this.value).forEach((([n,r])=>{e[n]=t(r,n,this.value)})),e}clone(){return JSON.parse(JSON.stringify(this.value))}toJSON(){return JSON.parse(JSON.stringify(this.value))}toObject(){return this.get()}lock(){return this.#t=!0,this}unlock(){return this.#t=!1,this}get isLocked(){return this.#t}freeze(){return Object.freeze(this.value),this}unfreeze(){return this.value=JSON.parse(JSON.stringify(this.value)),this}get isFrozen(){return Object.isFrozen(this.value)}}function R(t){return new O(t)}window.RUMIOUS_CONTEXTS={};class L{constructor(t={}){this.events={},this.values=t}has(t){return t in this.values}set(t,e){this.values[t]=e}get(t){return this.values[t]}on(t,e){this.events[t]||(this.events[t]=[]),this.events[t].push(e)}off(t,e){this.events[t]&&(this.events[t]=this.events[t].filter((t=>t!==e)))}emit(t,e){this.events[t]&&this.events[t].forEach((t=>t(e)))}}function M(t,e=function(t="_"){return`${t}${(Math.floor(9999*Math.random())*Date.now()).toString(32)}`}("rctx_")){if(window.RUMIOUS_CONTEXTS[e])return window.RUMIOUS_CONTEXTS[e];{let n=new L(t);return window.RUMIOUS_CONTEXTS[e]=n,n}}function B(t,e){let n=0;return function(...r){const i=Date.now();i-n>=e&&(n=i,t.apply(this,r))}}function H(t,e){let n;return function(...r){clearTimeout(n),n=setTimeout((()=>t.apply(this,r)),e)}}function j(t,e){let n=0,r=null,i=null;function s(){n=Date.now(),t.apply(this,r),r=null}return function(...t){const a=Date.now();r=t,a-n>=e?s.call(this):i||(i=setTimeout((()=>{i=null,s.call(this)}),e-(a-n)))}}function I(t,e){let n,r=!0;return function(...i){r&&(t.apply(this,i),r=!1),clearTimeout(n),n=setTimeout((()=>{t.apply(this,i),r=!0}),e)}}function _(t){let e=!1;return function(...n){e||(e=!0,requestAnimationFrame((()=>{t.apply(this,n),e=!1})))}}export{x as Fragment,a as RumiousApp,N as RumiousArrayState,k as RumiousChildrenRef,r as RumiousComponent,i as RumiousComponentElement,L as RumiousContext,h as RumiousDymanicInjector,d as RumiousElementRef,l as RumiousModule,O as RumiousObjectState,c as RumiousRenderTemplate,f as RumiousState,o as createApp,A as createArrayState,M as createContext,m as createElementRef,u as createHTMLInjector,R as createObjectState,y as createState,H as denounce,I as leadingTrailingDebounce,_ as rafThrottle,s as renderComponent,b as renderDynamicArray,T as template,B as tholle,j as trailingThrottle,E as unwatch,v as watch};
+import{create as t}from"mutative";class e{constructor(t,e){this.target=t,this.app=e,this.onRenderFinished=[]}findName(t){return this.target[t]}}function n(t,e,s){let r=e.generator.bind(t.target);t.renderHelper=n,r(s,t),setTimeout((async()=>{const e=[...t.onRenderFinished];t.onRenderFinished=[];for(const t of e)await t()}),0)}class s{static classNames="";static tagName="rumious-component";constructor(){this.renderOptions={mode:"idle"}}onCreate(){}onRender(){}onDestroy(){}async onBeforeRender(){}prepare(t,n){this.props=n,this.context=new e(this,t.app)}async requestRender(){await this.onBeforeRender();let t=this.template();n(this.context,t,this.element),this.onRender()}requestCleanup(){}}class r extends HTMLElement{constructor(){super(),this.props={}}setContext(t){this.context=t}setComponent(t){this.componentConstructor=t}setup(t,e){this.context=t,this.componentConstructor=e}connectedCallback(){this.componentConstructor?(this.componentInstance=new this.componentConstructor,this.componentInstance.element=this,this.componentConstructor.classNames&&(this.className=this.componentConstructor.classNames),this.componentInstance.prepare(this.context,this.props),this.componentInstance.onCreate(),this.componentInstance.requestRender()):console.warn("Rumious: Cannot find matching component constructor.")}disconnectedCallback(){this.componentInstance?.onDestroy()}}function i(t,e){let n=window.RUMIOUS_JSX.createComponent(t);return n.props=e,n.setComponent(t),n}class a{constructor(t,n={}){this.root=t,this.options=n,this.modules=[],this.context=new e(this,this)}addModule(t,e){const n=t.init(this,e);return this.modules.push(n),n}render(t){n(this.context,t,this.root)}}function o(t,e){return new a(t,e)}class h{}class l{constructor(t){this.generator=t}}class c{constructor(t){if(this.contents=t,this.targets=new Map,!t||0===t.length)throw new Error("Injector must be initialized with non-empty content");const e=t[0];this.type="string"==typeof e?"string":"element"}commit(t){this.contents=t;const e=t[0];this.type="string"==typeof e?"string":"element"}addTarget(t){this.targets.set(t,1)}inject(t){if(this.targets.has(t)&&this.contents)if(t.innerHTML="","string"===this.type)for(const e of this.contents)t.insertAdjacentHTML("beforeend",e);else for(const e of this.contents)t.appendChild(e)}injectAll(){for(const t of this.targets.keys())this.inject(t)}removeTarget(t){this.targets.delete(t)}clear(){this.targets.clear()}}function u(t){return new c([t])}class d{constructor(t){this.target=t}getElement(){return this.target}remove(){this.target.remove()}addChild(t){this.target.appendChild(t)}listChild(){return this.target.childNodes}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}set text(t){this.target.textContent=t}get text(){return this.target.textContent}set value(t){(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.value=t)}get value(){if(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)return this.target.value}addClassName(t){this.target.classList.add(t)}removeClassName(t){this.target.classList.remove(t)}hasClassName(t){return this.target.classList.contains(t)}toggleClass(t,e){return this.target.classList.toggle(t,e)}setStyle(t){Object.assign(this.target.style,t)}getStyle(t){return getComputedStyle(this.target).getPropertyValue(t)}setAttribute(t,e){this.target.setAttribute(t,e)}getAttribute(t){return this.target.getAttribute(t)}removeAttribute(t){this.target.removeAttribute(t)}on(t,e,n){this.target.addEventListener(t,e,n)}off(t,e,n){this.target.removeEventListener(t,e,n)}set html(t){this.target.innerHTML=t}get html(){return this.target.innerHTML}getBoundingRect(){return this.target.getBoundingClientRect()}isInViewport(){const t=this.target.getBoundingClientRect();return t.top>=0&&t.left>=0&&t.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&t.right<=(window.innerWidth||document.documentElement.clientWidth)}prependChild(t){this.target.prepend(t)}setDisabled(t){(this.target instanceof HTMLButtonElement||this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.disabled=t)}addClasses(...t){this.target.classList.add(...t)}removeClasses(...t){this.target.classList.remove(...t)}replaceClass(t,e){this.target.classList.replace(t,e)}moveTo(t){t.appendChild(this.target)}getParent(){return this.target.parentElement}getNextSibling(){return this.target.nextElementSibling}getPreviousSibling(){return this.target.previousElementSibling}hide(){this.target.style.display="none"}show(){this.target.style.removeProperty("display")}isHidden(){return"none"===window.getComputedStyle(this.target).display}scrollIntoView(t={behavior:"smooth"}){this.target.scrollIntoView(t)}matches(t){return this.target.matches(t)}getChildren(){return Array.from(this.target.children)}insertAfter(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target.nextSibling)}insertBefore(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target)}clearChildren(){for(;this.target.firstChild;)this.target.removeChild(this.target.firstChild)}animate(t,e){return this.target.animate(t,e)}}function g(){return new d(document.createElement("span"))}function m(t){const e=t.indexOf("$");return-1!==e?t.slice(e+1):""}class p{constructor(t){this.target=t,this.bindings=[]}addBinding(t){this.bindings.push(t)}removeBinding(t){this.bindings=this.bindings.filter((e=>e!==t))}async emit(t){await Promise.allSettled(this.bindings.map((e=>{try{const n=e(t);return n instanceof Promise?n:Promise.resolve(n)}catch(t){return Promise.reject(t)}})))}}class f{constructor(t,e){this.value=t,this.reactor=e??new p(this)}set(t){this.value=t,this.reactor.emit({type:"SET",target:this,value:t})}get(){return this.value}increase(t=1){"number"==typeof this.value&&this.set(this.value+t)}produce(e){const[n,s]=t(this.value);e(n),this.set(s())}}function v(t,e){t.reactor.addBinding(e)}function E(t,e){t.reactor.removeBinding(e)}function y(t){return new f(t)}const C={on:function(t,e,n,s){"string"==typeof s&&(s=t.findName(m(s))),e.addEventListener(n,s)},ref:function(t,e,n,s){if("string"==typeof s&&(s=t.findName(m(s))),!(s instanceof d))throw Error("Rumious: ref directive required RumiousElementRef !");s.target=e},inject:function(t,e,n,s){if("string"==typeof s&&(s=t.findName(m(s))),!(s instanceof c))throw Error("Rumious: inject directive required RumiousInjector !");s.addTarget(e),s.inject(e)},bind:function(t,e,n,s){if("string"==typeof s&&(s=t.findName(m(s))),!(s instanceof f))throw Error("Rumious: bind directive required RumiousState !");e.setAttribute(n,s.value),s.reactor.addBinding((({})=>{e.setAttribute(n,s.value)}))},model:function(t,e,n,s){if("string"==typeof s&&(s=t.findName(m(s))),!(s instanceof f&&(e instanceof HTMLInputElement||e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)))throw Error("Rumious: model directive requires RumiousState and a valid form element!");{const t=e.type;e.addEventListener("input",(()=>{if(e instanceof HTMLInputElement)switch(t){case"checkbox":s.set(e.checked);break;case"radio":e.checked&&s.set(e.value);break;default:s.set(e.value)}else(e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)&&s.set(e.value)}))}}};class w{constructor(t,e){this.state=t,this.callback=e}prepare(t,e){this.anchorElement=t,this.context=e}renderItem(t,e){const n=document.createDocumentFragment(),s=this.callback(t,e);return this.context.renderHelper(this.context,s,n),n}scheduleRenderAll(){requestAnimationFrame((()=>this.renderAll()))}async render(){this.state.reactor.addBinding(this.onStateChange.bind(this)),this.scheduleRenderAll()}renderAll(){const t=document.createDocumentFragment();this.state.value.forEach(((e,n)=>{t.appendChild(this.renderItem(e,n))})),this.anchorElement.replaceChildren(t)}updateElement(t,e){const n=this.anchorElement.children[t];n&&this.anchorElement.replaceChild(this.renderItem(e,t),n)}insertOrAppendElement(t,e){const n=this.renderItem(t,e),s=this.anchorElement.children[e];s?this.anchorElement.insertBefore(n,s):this.anchorElement.appendChild(n)}removeElement(t){this.anchorElement.children[t]?.remove()}appendElement(t,e){if(Array.isArray(t)){const n=document.createDocumentFragment();t.forEach(((t,s)=>{n.appendChild(this.renderItem(t,e+s))})),this.anchorElement.replaceChildren(n),this.anchorElement.appendChild(n)}}async onStateChange(t){if(document.contains(this.anchorElement))switch(t.type){case"SET":default:this.scheduleRenderAll();break;case"SET_BY_KEY":this.updateElement(t.key,t.value);break;case"REMOVE_BY_KEY":this.removeElement(t.key);break;case"INSERT_BY_KEY":this.insertOrAppendElement(t.value,t.key);break;case"APPEND":this.appendElement(t.value,this.state.value.length-t.value.length);break;case"PREPEND":this.anchorElement.prepend(this.renderItem(t.value,0))}else this.state.reactor.removeBinding(this.onStateChange.bind(this))}}function S(t,e){return new w(t,e)}class b extends w{isLoading=!1;constructor(t){super(t.data,t.template),this.options=t,this.limit=t.limit??50,this.offset=t.offset??0}setState(t){this.options.state?.set(t)}async fetchData(){const t=await(this.options.loader?.(this.limit,this.offset))??[];return this.offset+=t.length,t}getScrollInfo(){const t=this.options.scrollElement;return t===window?{scrollTop:window.scrollY,scrollHeight:document.documentElement.scrollHeight,clientHeight:window.innerHeight}:{scrollTop:t.scrollTop,scrollHeight:t.scrollHeight,clientHeight:t.clientHeight}}async render(){const t=this.options.scrollElement,e=async()=>{const{scrollTop:n,scrollHeight:s,clientHeight:r}=this.getScrollInfo();if(n+r>=s-this.options.threshold&&!this.isLoading){this.isLoading=!0,this.setState("START_FETCH");const n=await this.fetchData();this.setState("END_FETCH"),0===n.length?(this.setState("NO_DATA"),t.removeEventListener("scroll",e)):this.state.append(...Array.isArray(n)?n:[]),this.isLoading=!1}};t.addEventListener("scroll",e),this.state.reactor.addBinding(this.onStateChange.bind(this)),this.scheduleRenderAll()}}function T(t){return new b(t)}class N extends w{constructor(t){super(t.data,t.template),this.options=t,this.size=t.size,this.currentPage=t.page??0}getPageData(){const t=this.currentPage*this.size,e=t+this.size;return this.state.value.slice(t,e)}renderPage(){const t=document.createDocumentFragment(),e=this.currentPage*this.size,n=e+this.size;this.state.value.slice(e,n).forEach(((n,s)=>{t.appendChild(this.renderItem(n,e+s))})),this.anchorElement.replaceChildren(t),this.calculate()}goToPage(t){const e=Math.floor(this.state.value.length/this.size);console.log(e),this.currentPage=Math.max(0,Math.min(t,e)),this.renderPage()}nextPage(){this.goToPage(this.currentPage+1)}prevPage(){this.goToPage(this.currentPage-1)}onControl({value:t}){switch(t){case"NEXT":this.nextPage();break;case"PREV":this.prevPage()}}async calculate(){if(this.options.info&&this.options.info.set({current:this.currentPage,size:this.options.size}),this.options.pages){const e=Math.floor(this.state.value.length/this.size);let n=[];for(var t=0;t<e;t++)n.push({isRender:this.currentPage===t,index:t});this.options.pages.set(n)}}async render(){v(this.options.controller,this.onControl.bind(this)),this.options.controller,this.state.reactor.addBinding(this.onStateChange.bind(this)),this.renderPage()}async onStateChange(t){if(!document.contains(this.anchorElement))return E(this.options.controller,this.onControl.bind(this)),void this.state.reactor.removeBinding(this.onStateChange.bind(this));const e=this.currentPage*this.size,n=e+this.size;switch(t.type){case"SET":this.currentPage=0,this.renderPage();break;case"SET_BY_KEY":case"REMOVE_BY_KEY":case"INSERT_BY_KEY":(s=t.key)>=e&&s<n&&this.renderPage();break;case"APPEND":const r=this.state.value.length,i=Math.floor((r-1)/this.size);this.currentPage===i&&this.renderPage();break;default:this.renderPage()}var s}}function A(t){return new N(t)}async function k(t,e,n,s){if(e.parentNode)if(function(t){return t!==Object(t)}(n))e.textContent=String(n);else if(n&&n instanceof f&&n.value instanceof Node){let i=e;if(!i.parentNode)return;function a({}){document.contains(i)&&i.parentNode?(n.value instanceof r&&n.value.setContext(s),i.parentNode.replaceChild(n.value,i),i=n.value):n.reactor.removeBinding(a)}n.value instanceof r&&n.value.setContext(s),i.parentNode.replaceChild(n.value,i),i=n.value,n.reactor.addBinding(a)}else if(n&&n instanceof f){function o({}){document.contains(e)?e.textContent=n.value:n.reactor.removeBinding(o)}e.textContent=n.value,n.reactor.addBinding(o)}else if(Array.isArray(n))e.textContent=n.map(String).join("");else if(n instanceof w)n.prepare(e.parentElement,s),n.render();else if(n instanceof HTMLElement)e.replaceWith(n);else if(n instanceof l){let h=document.createDocumentFragment();s.renderHelper?.(s,n,h),e.replaceWith(h)}else if(n instanceof NodeList||n instanceof HTMLCollection){if(0===n.length)return void e.remove();const c=document.createDocumentFragment();for(const u of Array.from(n))c.appendChild(u.cloneNode(!0));e.replaceWith(c),e.remove()}else if(n&&"function"==typeof n.toString)try{e.textContent=n.toString()}catch{e.textContent=""}else e.textContent=""}function x(t){return new l(t)}const R=function(...t){throw Error("Fragment element must be compiled by Rumious !")};window.RUMIOUS_JSX={template:x,createElement:function(...t){throw console.log(t),Error("Rumious doesn't use createElement !")},addDirective:function(t,e,n,s="",r){let i=C[n];if(!i)throw Error("Rumious: Cannot solve directive !");i(e,t,s,r)},dynamicValue:function(t,e,n,s){k(0,e,n,s)},createComponent:function(t){let e=t.tagName;return window.customElements.get(e)||window.customElements.define(e,class extends r{static tag=e}),document.createElement(e)}};class P{constructor(t){this.target=t}list(){return Array.from(this.target.children)}getChild(t){return this.list()[t]}remove(t){this.list()[t]?.remove()}add(t){this.target.appendChild(t)}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}clear(){this.target.innerHTML=""}replaceChild(t,e){const n=this.getChild(t);n&&this.target.replaceChild(e,n)}insertBefore(t,e){const n=this.getChild(e);n?this.target.insertBefore(t,n):this.add(t)}prepend(t){this.target.prepend(t)}getFirstChild(){return this.list()[0]}getLastChild(){return this.list()[this.list().length-1]}hasChildren(){return this.target.hasChildNodes()}count(){return this.target.children.length}find(t){return this.list().find(t)}forEach(t){this.list().forEach(t)}removeAllMatching(t){this.querySelectorAll(t).forEach((t=>t.remove()))}toggleClass(t){this.list().forEach((e=>e.classList.toggle(t)))}setAttribute(t,e){this.list().forEach((n=>n.setAttribute(t,e)))}}class O extends f{constructor(t,e){super(t,e)}set(t,e){if("number"==typeof t&&void 0!==e){const n=t,s=e;this.value[n]=s,this.reactor.emit({type:"SET_BY_KEY",value:s,target:this,key:n})}else{if(!Array.isArray(t))throw new Error("Invalid arguments passed to set()");super.set(t)}}get(t){return"number"==typeof t?this.value[t]:this.value}insert(t,e){return this.value.splice(t,0,e),this.reactor.emit({type:"INSERT_BY_KEY",value:e,target:this,key:t}),this}remove(t){return this.value.splice(t,1),this.reactor.emit({type:"REMOVE_BY_KEY",value:null,target:this,key:t}),this}append(...t){return this.value.push(...t),this.reactor.emit({type:"APPEND",value:t,target:this}),this}prepend(t){return this.value.unshift(t),this.reactor.emit({type:"PREPEND",value:t,target:this}),this}clear(){return this.value.length=0,this.reactor.emit({type:"SET",value:null,target:this}),this}replace(t,e){if(t<0||t>=this.value.length)throw new Error("Index out of bounds");return this.value[t]=e,this.reactor.emit({type:"SET_BY_KEY",value:e,target:this,key:t}),this}filter(t){return this.value=this.value.filter(t),this.reactor.emit({type:"SET",value:null,target:this}),this}map(t){return this.value=this.value.map(t),this.reactor.emit({type:"SET",value:null,target:this}),this}sort(t){return this.value.sort(t),this.reactor.emit({type:"SET",value:null,target:this}),this}reverse(){return this.value.reverse(),this.reactor.emit({type:"SET",value:null,target:this}),this}get length(){return this.value.length}forEach(t){this.value.forEach(t)}}function L(t){return new O(t)}class M extends f{#t=!1;constructor(t,e){super(t,e)}set(t,e){if(this.#t)throw new Error("Object is locked");if("string"==typeof t){const n=t,s=e;return this.value[n]=s,this.reactor.emit({type:"SET_BY_KEY",value:s,target:this,key:n}),this}if("object"!=typeof t)throw new Error("Invalid arguments passed to set()");super.set(t)}remove(t){if(this.#t)throw new Error("Object is locked");return t in this.value&&(delete this.value[t],this.reactor.emit({type:"REMOVE_BY_KEY",value:{...this.value},target:this,key:t})),this}merge(t){if(this.#t)throw new Error("Object is locked");return Object.assign(this.value,t),this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}assign(t){if(this.#t)throw new Error("Object is locked");return this.value={...this.value,...t},this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}clear(){if(this.#t)throw new Error("Object is locked");for(const t in this.value)delete this.value[t];return this.reactor.emit({type:"SET",value:{},target:this}),this}get(t){return"string"==typeof t?this.value[t]:this.value}keys(){return Object.keys(this.value)}values(){return Object.values(this.value)}entries(){return Object.entries(this.value)}has(t){return t in this.value}get size(){return Object.keys(this.value).length}forEach(t){Object.entries(this.value).forEach((([e,n])=>{t(n,e,this.value)}))}map(t){const e={};return Object.entries(this.value).forEach((([n,s])=>{e[n]=t(s,n,this.value)})),e}clone(){return JSON.parse(JSON.stringify(this.value))}toJSON(){return JSON.parse(JSON.stringify(this.value))}toObject(){return this.get()}lock(){return this.#t=!0,this}unlock(){return this.#t=!1,this}get isLocked(){return this.#t}freeze(){return Object.freeze(this.value),this}unfreeze(){return this.value=JSON.parse(JSON.stringify(this.value)),this}get isFrozen(){return Object.isFrozen(this.value)}}function H(t){return new M(t)}window.RUMIOUS_CONTEXTS={};class B{constructor(t={}){this.events={},this.values=t}has(t){return t in this.values}set(t,e){this.values[t]=e}get(t){return this.values[t]}on(t,e){this.events[t]||(this.events[t]=[]),this.events[t].push(e)}off(t,e){this.events[t]&&(this.events[t]=this.events[t].filter((t=>t!==e)))}emit(t,e){this.events[t]&&this.events[t].forEach((t=>t(e)))}}function I(t,e=function(t="_"){return`${t}${(Math.floor(9999*Math.random())*Date.now()).toString(32)}`}("rctx_")){if(window.RUMIOUS_CONTEXTS[e])return window.RUMIOUS_CONTEXTS[e];{let n=new B(t);return window.RUMIOUS_CONTEXTS[e]=n,n}}function _(t,e){let n=0;return function(...s){const r=Date.now();r-n>=e&&(n=r,t.apply(this,s))}}function j(t,e){let n;return function(...s){clearTimeout(n),n=setTimeout((()=>t.apply(this,s)),e)}}function Y(t,e){let n=0,s=null,r=null;function i(){n=Date.now(),t.apply(this,s),s=null}return function(...t){const a=Date.now();s=t,a-n>=e?i.call(this):r||(r=setTimeout((()=>{r=null,i.call(this)}),e-(a-n)))}}function D(t,e){let n,s=!0;return function(...r){s&&(t.apply(this,r),s=!1),clearTimeout(n),n=setTimeout((()=>{t.apply(this,r),s=!0}),e)}}function z(t){let e=!1;return function(...n){e||(e=!0,requestAnimationFrame((()=>{t.apply(this,n),e=!1})))}}export{R as Fragment,a as RumiousApp,O as RumiousArrayState,P as RumiousChildrenRef,s as RumiousComponent,r as RumiousComponentElement,B as RumiousContext,c as RumiousDymanicInjector,d as RumiousElementRef,h as RumiousModule,M as RumiousObjectState,l as RumiousRenderTemplate,f as RumiousState,o as createApp,L as createArrayState,I as createContext,g as createElementRef,u as createHTMLInjector,T as createInfinityScroll,H as createObjectState,A as createPagination,y as createState,j as denounce,D as leadingTrailingDebounce,z as rafThrottle,i as renderComponent,S as renderList,x as template,_ as tholle,Y as trailingThrottle,E as unwatch,v as watch};

package/dist/index.global.d.ts

@@ -28,7 +28,9 @@ declare const Rumious: {
     createElementRef(): Ref.RumiousElementRef;
     RumiousElementRef: typeof Ref.RumiousElementRef;
     RumiousChildrenRef: typeof Ref.RumiousChildrenRef;
-    renderDynamicArray: typeof Render.renderDynamicArray;
+    renderList: typeof Render.renderList;
+    createInfinityScroll: typeof Render.createInfinityScroll;
+    createPagination: typeof Render.createPagination;
     RumiousRenderTemplate: typeof Render.RumiousRenderTemplate;
     createHTMLInjector(html: string): Render.RumiousDymanicInjector<string>;
     RumiousDymanicInjector: typeof Render.RumiousDymanicInjector;

package/dist/index.min.js

@@ -1 +1 @@
-!function(){class e{constructor(e,t){this.target=e,this.app=t,this.onRenderFinished=[]}findName(e){return this.target[e]}}function t(e,n,r){let i=n.generator.bind(e.target);e.renderHelper=t,i(r,e),setTimeout((async()=>{const t=[...e.onRenderFinished];e.onRenderFinished=[];for(const e of t)await e()}),0)}class n extends HTMLElement{constructor(){super(),this.props={}}setContext(e){this.context=e}setComponent(e){this.componentConstructor=e}setup(e,t){this.context=e,this.componentConstructor=t}connectedCallback(){this.componentConstructor?(this.componentInstance=new this.componentConstructor,this.componentInstance.element=this,this.componentConstructor.classNames&&(this.className=this.componentConstructor.classNames),this.componentInstance.prepare(this.context,this.props),this.componentInstance.onCreate(),this.componentInstance.requestRender()):console.warn("Rumious: Cannot find matching component constructor.")}disconnectedCallback(){this.componentInstance?.onDestroy()}}var r=Object.freeze({__proto__:null,RumiousComponent:class{static classNames="";static tagName="rumious-component";constructor(){this.renderOptions={mode:"idle"}}onCreate(){}onRender(){}onDestroy(){}async onBeforeRender(){}prepare(t,n){this.props=n,this.context=new e(this,t.app)}async requestRender(){await this.onBeforeRender();let e=this.template();t(this.context,e,this.element),this.onRender()}requestCleanup(){}},RumiousComponentElement:n,renderComponent:function(e,t){let n=window.RUMIOUS_JSX.createComponent(e);return n.props=t,n.setComponent(e),n}});class i{constructor(t,n={}){this.root=t,this.options=n,this.modules=[],this.context=new e(this,this)}addModule(e,t){const n=e.init(this,t);return this.modules.push(n),n}render(e){t(this.context,e,this.root)}}var o=Object.freeze({__proto__:null,RumiousApp:i,RumiousModule:class{},createApp:function(e,t){return new i(e,t)}});class s{constructor(e){this.generator=e}}class a{constructor(e){if(this.contents=e,this.targets=new Map,!e||0===e.length)throw new Error("Injector must be initialized with non-empty content");const t=e[0];this.type="string"==typeof t?"string":"element"}commit(e){this.contents=e;const t=e[0];this.type="string"==typeof t?"string":"element"}addTarget(e){this.targets.set(e,1)}inject(e){if(this.targets.has(e)&&this.contents)if(e.innerHTML="","string"===this.type)for(const t of this.contents)e.insertAdjacentHTML("beforeend",t);else for(const t of this.contents)e.appendChild(t)}injectAll(){for(const e of this.targets.keys())this.inject(e)}removeTarget(e){this.targets.delete(e)}clear(){this.targets.clear()}}class l{constructor(e){this.target=e}getElement(){return this.target}remove(){this.target.remove()}addChild(e){this.target.appendChild(e)}listChild(){return this.target.childNodes}querySelector(e){return this.target.querySelector(e)}querySelectorAll(e){return this.target.querySelectorAll(e)}set text(e){this.target.textContent=e}get text(){return this.target.textContent}set value(e){(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.value=e)}get value(){if(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)return this.target.value}addClassName(e){this.target.classList.add(e)}removeClassName(e){this.target.classList.remove(e)}hasClassName(e){return this.target.classList.contains(e)}toggleClass(e,t){return this.target.classList.toggle(e,t)}setStyle(e){Object.assign(this.target.style,e)}getStyle(e){return getComputedStyle(this.target).getPropertyValue(e)}setAttribute(e,t){this.target.setAttribute(e,t)}getAttribute(e){return this.target.getAttribute(e)}removeAttribute(e){this.target.removeAttribute(e)}on(e,t,n){this.target.addEventListener(e,t,n)}off(e,t,n){this.target.removeEventListener(e,t,n)}set html(e){this.target.innerHTML=e}get html(){return this.target.innerHTML}getBoundingRect(){return this.target.getBoundingClientRect()}isInViewport(){const e=this.target.getBoundingClientRect();return e.top>=0&&e.left>=0&&e.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&e.right<=(window.innerWidth||document.documentElement.clientWidth)}prependChild(e){this.target.prepend(e)}setDisabled(e){(this.target instanceof HTMLButtonElement||this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.disabled=e)}addClasses(...e){this.target.classList.add(...e)}removeClasses(...e){this.target.classList.remove(...e)}replaceClass(e,t){this.target.classList.replace(e,t)}moveTo(e){e.appendChild(this.target)}getParent(){return this.target.parentElement}getNextSibling(){return this.target.nextElementSibling}getPreviousSibling(){return this.target.previousElementSibling}hide(){this.target.style.display="none"}show(){this.target.style.removeProperty("display")}isHidden(){return"none"===window.getComputedStyle(this.target).display}scrollIntoView(e={behavior:"smooth"}){this.target.scrollIntoView(e)}matches(e){return this.target.matches(e)}getChildren(){return Array.from(this.target.children)}insertAfter(e){this.target.parentNode&&this.target.parentNode.insertBefore(e,this.target.nextSibling)}insertBefore(e){this.target.parentNode&&this.target.parentNode.insertBefore(e,this.target)}clearChildren(){for(;this.target.firstChild;)this.target.removeChild(this.target.firstChild)}animate(e,t){return this.target.animate(e,t)}}function c(e){const t=e.indexOf("$");return-1!==t?e.slice(t+1):""}class u{constructor(e){this.target=e,this.bindings=[]}addBinding(e){this.bindings.push(e)}removeBinding(e){this.bindings=this.bindings.filter((t=>t!==e))}async emit(e){await Promise.allSettled(this.bindings.map((t=>{try{const n=t(e);return n instanceof Promise?n:Promise.resolve(n)}catch(e){return Promise.reject(e)}})))}}const h="remove",p="replace",f="add",d=Symbol.for("__MUTATIVE_PROXY_DRAFT__"),g=Symbol("__MUTATIVE_RAW_RETURN_SYMBOL__"),m=Symbol.iterator,y={mutable:"mutable",immutable:"immutable"},v={};function b(e,t){return e instanceof Map?e.has(t):Object.prototype.hasOwnProperty.call(e,t)}function w(e,t){if(t in e){let n=Reflect.getPrototypeOf(e);for(;n;){const e=Reflect.getOwnPropertyDescriptor(n,t);if(e)return e;n=Reflect.getPrototypeOf(n)}}}function E(e){return Object.getPrototypeOf(e)===Set.prototype}function S(e){return Object.getPrototypeOf(e)===Map.prototype}function O(e){var t;return null!==(t=e.copy)&&void 0!==t?t:e.original}function M(e){return!!k(e)}function k(e){return"object"!=typeof e?null:null==e?void 0:e[d]}function j(e){var t;const n=k(e);return n?null!==(t=n.copy)&&void 0!==t?t:n.original:e}function C(e,t){if(!e||"object"!=typeof e)return!1;let n;return Object.getPrototypeOf(e)===Object.prototype||Array.isArray(e)||e instanceof Map||e instanceof Set||!!(null==t?void 0:t.mark)&&((n=t.mark(e,y))===y.immutable||"function"==typeof n)}function R(e,t=[]){if(Object.hasOwnProperty.call(e,"key")){const n=e.parent.copy,r=k(x(n,e.key));if(null!==r&&(null==r?void 0:r.original)!==e.original)return null;const i=3===e.parent.type,o=i?Array.from(e.parent.setMap.keys()).indexOf(e.key):e.key;if(!(i&&n.size>o||b(n,o)))return null;t.push(o)}if(e.parent)return R(e.parent,t);t.reverse();try{!function(e,t){for(let n=0;n<t.length-1;n+=1){const r=t[n];if("object"!=typeof(e=x(3===A(e)?Array.from(e):e,r)))throw new Error(`Cannot resolve patch at '${t.join("/")}'.`)}}(e.copy,t)}catch(e){return null}return t}function A(e){return Array.isArray(e)?1:e instanceof Map?2:e instanceof Set?3:0}function x(e,t){return 2===A(e)?e.get(t):e[t]}function T(e,t,n){2===A(e)?e.set(t,n):e[t]=n}function _(e,t){const n=k(e);return(n?O(n):e)[t]}function P(e,t){return e===t?0!==e||1/e==1/t:e!=e&&t!=t}function z(e){if(e)for(;e.finalities.revoke.length>0;){e.finalities.revoke.pop()()}}function N(e,t){return t?e:[""].concat(e).map((e=>{const t=`${e}`;return-1===t.indexOf("/")&&-1===t.indexOf("~")?t:t.replace(/~/g,"~0").replace(/\//g,"~1")})).join("/")}const D=Object.prototype.propertyIsEnumerable;function I(e,t){let n;if(Array.isArray(e))return Array.prototype.concat.call(e);if(e instanceof Set){if(!E(e)){return new(0,Object.getPrototypeOf(e).constructor)(e.values())}return Set.prototype.difference?Set.prototype.difference.call(e,new Set):new Set(e.values())}if(e instanceof Map){if(!S(e)){return new(0,Object.getPrototypeOf(e).constructor)(e)}return new Map(e)}if((null==t?void 0:t.mark)&&(n=t.mark(e,y),void 0!==n)&&n!==y.mutable){if(n===y.immutable)return function(e){const t=Object.create(Object.getPrototypeOf(e));return Reflect.ownKeys(e).forEach((n=>{let r=Reflect.getOwnPropertyDescriptor(e,n);r.enumerable&&r.configurable&&r.writable?t[n]=e[n]:(r.writable||(r.writable=!0,r.configurable=!0),(r.get||r.set)&&(r={configurable:!0,writable:!0,enumerable:r.enumerable,value:e[n]}),Reflect.defineProperty(t,n,r))})),t}(e);if("function"==typeof n){if(t.enablePatches||t.enableAutoFreeze)throw new Error("You can't use mark and patches or auto freeze together.");return n()}throw new Error(`Unsupported mark result: ${n}`)}if("object"==typeof e&&Object.getPrototypeOf(e)===Object.prototype){const t={};return Object.keys(e).forEach((n=>{t[n]=e[n]})),Object.getOwnPropertySymbols(e).forEach((n=>{D.call(e,n)&&(t[n]=e[n])})),t}throw new Error("Please check mark() to ensure that it is a stable marker draftable function.")}function L(e){e.copy||(e.copy=I(e.original,e.options))}function F(e){if(!C(e))return j(e);if(Array.isArray(e))return e.map(F);if(e instanceof Map){const t=Array.from(e.entries()).map((([e,t])=>[e,F(t)]));if(!S(e)){return new(0,Object.getPrototypeOf(e).constructor)(t)}return new Map(t)}if(e instanceof Set){const t=Array.from(e).map(F);if(!E(e)){return new(0,Object.getPrototypeOf(e).constructor)(t)}return new Set(t)}const t=Object.create(Object.getPrototypeOf(e));for(const n in e)t[n]=F(e[n]);return t}function B(e){return M(e)?F(e):e}function H(e){var t;e.assignedMap=null!==(t=e.assignedMap)&&void 0!==t?t:new Map,e.operated||(e.operated=!0,e.parent&&H(e.parent))}function Y(){throw new Error("Cannot modify frozen object")}function V(e,t,n,r,i){{n=null!=n?n:new WeakMap,r=null!=r?r:[],i=null!=i?i:[];const o=n.has(e)?n.get(e):e;if(r.length>0){const e=r.indexOf(o);if(o&&"object"==typeof o&&-1!==e){if(r[0]===o)throw new Error("Forbids circular reference");throw new Error(`Forbids circular reference: ~/${i.slice(0,e).map(((e,t)=>{if("symbol"==typeof e)return`[${e.toString()}]`;const n=r[t];return"object"==typeof e&&(n instanceof Map||n instanceof Set)?Array.from(n.keys()).indexOf(e):e})).join("/")}`)}r.push(o),i.push(t)}else r.push(o)}if(Object.isFrozen(e)||M(e))return r.pop(),void i.pop();switch(A(e)){case 2:for(const[t,o]of e)V(t,t,n,r,i),V(o,t,n,r,i);e.set=e.clear=e.delete=Y;break;case 3:for(const t of e)V(t,t,n,r,i);e.add=e.clear=e.delete=Y;break;case 1:Object.freeze(e);let t=0;for(const o of e)V(o,t,n,r,i),t+=1;break;default:Object.freeze(e),Object.keys(e).forEach((t=>{V(e[t],t,n,r,i)}))}r.pop(),i.pop()}function q(e,t){const n=A(e);if(0===n)Reflect.ownKeys(e).forEach((n=>{t(n,e[n],e)}));else if(1===n){let n=0;for(const r of e)t(n,r,e),n+=1}else e.forEach(((n,r)=>t(r,n,e)))}function U(e,t,n){if(M(e)||!C(e,n)||t.has(e)||Object.isFrozen(e))return;const r=e instanceof Set,i=r?new Map:void 0;if(t.add(e),q(e,((o,s)=>{var a;if(M(s)){const t=k(s);L(t);const n=(null===(a=t.assignedMap)||void 0===a?void 0:a.size)||t.operated?t.copy:t.original;T(r?i:e,o,n)}else U(s,t,n)})),i){const t=e,n=Array.from(t);t.clear(),n.forEach((e=>{t.add(i.has(e)?i.get(e):e)}))}}function K(e,t){const n=3===e.type?e.setMap:e.copy;e.finalities.revoke.length>1&&e.assignedMap.get(t)&&n&&U(x(n,t),e.finalities.handledSet,e.options)}function W(e){3===e.type&&e.copy&&(e.copy.clear(),e.setMap.forEach((t=>{e.copy.add(j(t))})))}function $(e,t,n,r){if(e.operated&&e.assignedMap&&e.assignedMap.size>0&&!e.finalized){if(n&&r){const i=R(e);i&&t(e,i,n,r)}e.finalized=!0}}function J(e,t,n,r){const i=k(n);i&&(i.callbacks||(i.callbacks=[]),i.callbacks.push(((o,s)=>{var a;const l=3===e.type?e.setMap:e.copy;if(P(x(l,t),n)){let n=i.original;i.copy&&(n=i.copy),W(e),$(e,r,o,s),e.options.enableAutoFreeze&&(e.options.updatedValues=null!==(a=e.options.updatedValues)&&void 0!==a?a:new WeakMap,e.options.updatedValues.set(n,i.original)),T(l,t,n)}})),e.options.enableAutoFreeze&&i.finalities!==e.finalities&&(e.options.enableAutoFreeze=!1)),C(n,e.options)&&e.finalities.draft.push((()=>{P(x(3===e.type?e.setMap:e.copy,t),n)&&K(e,t)}))}function X(e,t,n,r){const{pathAsArray:i=!0}=e.options.enablePatches;switch(e.type){case 0:case 2:return function({original:e,copy:t,assignedMap:n},r,i,o,s){n.forEach(((n,a)=>{const l=x(e,a),c=B(x(t,a)),u=n?b(e,a)?p:f:h;if(P(l,c)&&u===p)return;const d=N(r.concat(a),s);i.push(u===h?{op:u,path:d}:{op:u,path:d,value:c}),o.push(u===f?{op:h,path:d}:u===h?{op:f,path:d,value:l}:{op:p,path:d,value:l})}))}(e,t,n,r,i);case 1:return function(e,t,n,r,i){let{original:o,assignedMap:s,options:a}=e,l=e.copy;l.length<o.length&&([o,l]=[l,o],[n,r]=[r,n]);for(let e=0;e<o.length;e+=1)if(s.get(e.toString())&&l[e]!==o[e]){const s=N(t.concat([e]),i);n.push({op:p,path:s,value:B(l[e])}),r.push({op:p,path:s,value:B(o[e])})}for(let e=o.length;e<l.length;e+=1){const r=N(t.concat([e]),i);n.push({op:f,path:r,value:B(l[e])})}if(o.length<l.length){const{arrayLengthAssignment:e=!0}=a.enablePatches;if(e){const e=N(t.concat(["length"]),i);r.push({op:p,path:e,value:o.length})}else for(let e=l.length;o.length<e;e-=1){const n=N(t.concat([e-1]),i);r.push({op:h,path:n})}}}(e,t,n,r,i);case 3:return function({original:e,copy:t},n,r,i,o){let s=0;e.forEach((e=>{if(!t.has(e)){const t=N(n.concat([s]),o);r.push({op:h,path:t,value:e}),i.unshift({op:f,path:t,value:e})}s+=1})),s=0,t.forEach((t=>{if(!e.has(t)){const e=N(n.concat([s]),o);r.push({op:f,path:e,value:t}),i.unshift({op:h,path:e,value:t})}s+=1}))}(e,t,n,r,i)}}const G=(e,t,n=!1)=>{if("object"==typeof e&&null!==e&&(!C(e,t)||n))throw new Error("Strict mode: Mutable data cannot be accessed directly, please use 'unsafe(callback)' wrap.")},Q={get size(){return O(k(this)).size},has(e){return O(k(this)).has(e)},set(e,t){const n=k(this),r=O(n);return r.has(e)&&P(r.get(e),t)||(L(n),H(n),n.assignedMap.set(e,!0),n.copy.set(e,t),J(n,e,t,X)),this},delete(e){if(!this.has(e))return!1;const t=k(this);return L(t),H(t),t.original.has(e)?t.assignedMap.set(e,!1):t.assignedMap.delete(e),t.copy.delete(e),!0},clear(){const e=k(this);if(this.size){L(e),H(e),e.assignedMap=new Map;for(const[t]of e.original)e.assignedMap.set(t,!1);e.copy.clear()}},forEach(e,t){O(k(this)).forEach(((n,r)=>{e.call(t,this.get(r),r,this)}))},get(e){var t,n;const r=k(this),i=O(r).get(e),o=(null===(n=(t=r.options).mark)||void 0===n?void 0:n.call(t,i,y))===y.mutable;if(r.options.strict&&G(i,r.options,o),o)return i;if(r.finalized||!C(i,r.options))return i;if(i!==r.original.get(e))return i;const s=v.createDraft({original:i,parentDraft:r,key:e,finalities:r.finalities,options:r.options});return L(r),r.copy.set(e,s),s},keys(){return O(k(this)).keys()},values(){const e=this.keys();return{[m]:()=>this.values(),next:()=>{const t=e.next();if(t.done)return t;return{done:!1,value:this.get(t.value)}}}},entries(){const e=this.keys();return{[m]:()=>this.entries(),next:()=>{const t=e.next();if(t.done)return t;const n=this.get(t.value);return{done:!1,value:[t.value,n]}}}},[m](){return this.entries()}},Z=Reflect.ownKeys(Q),ee=(e,t,{isValuesIterator:n})=>()=>{var r,i;const o=t.next();if(o.done)return o;const s=o.value;let a=e.setMap.get(s);const l=k(a),c=(null===(i=(r=e.options).mark)||void 0===i?void 0:i.call(r,a,y))===y.mutable;if(e.options.strict&&G(s,e.options,c),c||l||!C(s,e.options)||e.finalized||!e.original.has(s))l&&(a=l.proxy);else{const t=v.createDraft({original:s,parentDraft:e,key:s,finalities:e.finalities,options:e.options});e.setMap.set(s,t),a=t}return{done:!1,value:n?a:[a,a]}},te={get size(){return k(this).setMap.size},has(e){const t=k(this);if(t.setMap.has(e))return!0;L(t);const n=k(e);return!(!n||!t.setMap.has(n.original))},add(e){const t=k(this);return this.has(e)||(L(t),H(t),t.assignedMap.set(e,!0),t.setMap.set(e,e),J(t,e,e,X)),this},delete(e){if(!this.has(e))return!1;const t=k(this);L(t),H(t);const n=k(e);return n&&t.setMap.has(n.original)?(t.assignedMap.set(n.original,!1),t.setMap.delete(n.original)):(!n&&t.setMap.has(e)?t.assignedMap.set(e,!1):t.assignedMap.delete(e),t.setMap.delete(e))},clear(){if(!this.size)return;const e=k(this);L(e),H(e);for(const t of e.original)e.assignedMap.set(t,!1);e.setMap.clear()},values(){const e=k(this);L(e);const t=e.setMap.keys();return{[Symbol.iterator]:()=>this.values(),next:ee(e,t,{isValuesIterator:!0})}},entries(){const e=k(this);L(e);const t=e.setMap.keys();return{[Symbol.iterator]:()=>this.entries(),next:ee(e,t,{isValuesIterator:!1})}},keys(){return this.values()},[m](){return this.values()},forEach(e,t){const n=this.values();let r=n.next();for(;!r.done;)e.call(t,r.value,r.value,this),r=n.next()}};Set.prototype.difference&&Object.assign(te,{intersection(e){return Set.prototype.intersection.call(new Set(this.values()),e)},union(e){return Set.prototype.union.call(new Set(this.values()),e)},difference(e){return Set.prototype.difference.call(new Set(this.values()),e)},symmetricDifference(e){return Set.prototype.symmetricDifference.call(new Set(this.values()),e)},isSubsetOf(e){return Set.prototype.isSubsetOf.call(new Set(this.values()),e)},isSupersetOf(e){return Set.prototype.isSupersetOf.call(new Set(this.values()),e)},isDisjointFrom(e){return Set.prototype.isDisjointFrom.call(new Set(this.values()),e)}});const ne=Reflect.ownKeys(te),re=new WeakSet,ie={get(e,t,n){var r,i;const o=null===(r=e.copy)||void 0===r?void 0:r[t];if(o&&re.has(o))return o;if(t===d)return e;let s;if(e.options.mark){const r="size"===t&&(e.original instanceof Map||e.original instanceof Set)?Reflect.get(e.original,t):Reflect.get(e.original,t,n);if(s=e.options.mark(r,y),s===y.mutable)return e.options.strict&&G(r,e.options,!0),r}const a=O(e);if(a instanceof Map&&Z.includes(t)){if("size"===t)return Object.getOwnPropertyDescriptor(Q,"size").get.call(e.proxy);const n=Q[t];if(n)return n.bind(e.proxy)}if(a instanceof Set&&ne.includes(t)){if("size"===t)return Object.getOwnPropertyDescriptor(te,"size").get.call(e.proxy);const n=te[t];if(n)return n.bind(e.proxy)}if(!b(a,t)){const n=w(a,t);return n?"value"in n?n.value:null===(i=n.get)||void 0===i?void 0:i.call(e.proxy):void 0}const l=a[t];if(e.options.strict&&G(l,e.options),e.finalized||!C(l,e.options))return l;if(l===_(e.original,t)){if(L(e),e.copy[t]=oe({original:e.original[t],parentDraft:e,key:1===e.type?Number(t):t,finalities:e.finalities,options:e.options}),"function"==typeof s){const n=k(e.copy[t]);return L(n),H(n),n.copy}return e.copy[t]}return l},set(e,t,n){var r;if(3===e.type||2===e.type)throw new Error("Map/Set draft does not support any property assignment.");let i;if(1===e.type&&"length"!==t&&(!(Number.isInteger(i=Number(t))&&i>=0)||0!==t&&0!==i&&String(i)!==String(t)))throw new Error("Only supports setting array indices and the 'length' property.");const o=w(O(e),t);if(null==o?void 0:o.set)return o.set.call(e.proxy,n),!0;const s=_(O(e),t),a=k(s);return a&&P(a.original,n)?(e.copy[t]=n,e.assignedMap=null!==(r=e.assignedMap)&&void 0!==r?r:new Map,e.assignedMap.set(t,!1),!0):(P(n,s)&&(void 0!==n||b(e.original,t))||(L(e),H(e),b(e.original,t)&&P(n,e.original[t])?e.assignedMap.delete(t):e.assignedMap.set(t,!0),e.copy[t]=n,J(e,t,n,X)),!0)},has:(e,t)=>t in O(e),ownKeys:e=>Reflect.ownKeys(O(e)),getOwnPropertyDescriptor(e,t){const n=O(e),r=Reflect.getOwnPropertyDescriptor(n,t);return r?{writable:!0,configurable:1!==e.type||"length"!==t,enumerable:r.enumerable,value:n[t]}:r},getPrototypeOf:e=>Reflect.getPrototypeOf(e.original),setPrototypeOf(){throw new Error("Cannot call 'setPrototypeOf()' on drafts")},defineProperty(){throw new Error("Cannot call 'defineProperty()' on drafts")},deleteProperty(e,t){var n;return 1===e.type?ie.set.call(this,e,t,void 0,e.proxy):(void 0!==_(e.original,t)||t in e.original?(L(e),H(e),e.assignedMap.set(t,!1)):(e.assignedMap=null!==(n=e.assignedMap)&&void 0!==n?n:new Map,e.assignedMap.delete(t)),e.copy&&delete e.copy[t],!0)}};function oe(e){const{original:t,parentDraft:n,key:r,finalities:i,options:o}=e,s=A(t),a={type:s,finalized:!1,parent:n,original:t,copy:null,proxy:null,finalities:i,options:o,setMap:3===s?new Map(t.entries()):void 0};(r||"key"in e)&&(a.key=r);const{proxy:l,revoke:c}=Proxy.revocable(1===s?Object.assign([],a):a,ie);if(i.revoke.push(c),re.add(l),a.proxy=l,n){const e=n;e.finalities.draft.push(((t,n)=>{var i,o;const s=k(l);let a=3===e.type?e.setMap:e.copy;const c=x(a,r),u=k(c);if(u){let o=u.original;u.operated&&(o=j(c)),W(u),$(u,X,t,n),e.options.enableAutoFreeze&&(e.options.updatedValues=null!==(i=e.options.updatedValues)&&void 0!==i?i:new WeakMap,e.options.updatedValues.set(o,u.original)),T(a,r,o)}null===(o=s.callbacks)||void 0===o||o.forEach((e=>{e(t,n)}))}))}else{const e=k(l);e.finalities.draft.push(((t,n)=>{W(e),$(e,X,t,n)}))}return l}function se(e,t,n,r,i){var o;const s=k(e),a=null!==(o=null==s?void 0:s.original)&&void 0!==o?o:e,l=!!t.length;if(null==s?void 0:s.operated)for(;s.finalities.draft.length>0;){s.finalities.draft.pop()(n,r)}const c=l?t[0]:s?s.operated?s.copy:s.original:e;return s&&z(s),i&&V(c,c,null==s?void 0:s.options.updatedValues),[c,n&&l?[{op:p,path:[],value:t[0]}]:n,r&&l?[{op:p,path:[],value:a}]:r]}function ae(e){const{rootDraft:t,value:n,useRawReturn:r=!1,isRoot:i=!0}=e;q(n,((n,r,i)=>{const o=k(r);if(o&&t&&o.finalities===t.finalities){e.isContainDraft=!0;const t=o.original;if(i instanceof Set){const e=Array.from(i);i.clear(),e.forEach((e=>i.add(n===e?t:e)))}else T(i,n,t)}else"object"==typeof r&&null!==r&&(e.value=r,e.isRoot=!1,ae(e))})),i&&(e.isContainDraft||console.warn("The return value does not contain any draft, please use 'rawReturn()' to wrap the return value to improve performance."),r&&console.warn("The return value contains drafts, please don't use 'rawReturn()' to wrap the return value."))}function le(e){var t;const n=k(e);if(!C(e,null==n?void 0:n.options))return e;const r=A(e);if(n&&!n.operated)return n.original;let i;function o(){i=2===r?S(e)?new Map(e):new(Object.getPrototypeOf(e).constructor)(e):3===r?Array.from(n.setMap.values()):I(e,null==n?void 0:n.options)}if(n){n.finalized=!0;try{o()}finally{n.finalized=!1}}else i=e;if(q(i,((t,r)=>{if(n&&P(x(n.original,t),r))return;const s=le(r);s!==r&&(i===e&&o(),T(i,t,s))})),3===r){const e=null!==(t=null==n?void 0:n.original)&&void 0!==t?t:i;return E(e)?new Set(i):new(Object.getPrototypeOf(e).constructor)(i)}return i}function ce(e){if(!M(e))throw new Error(`current() is only used for Draft, parameter: ${e}`);return le(e)}v.createDraft=oe;const ue=function e(t,n,r){var i,o,s;if("function"==typeof t&&"function"!=typeof n)return function(r,...i){return e(r,(e=>t.call(this,e,...i)),n)};const a=t,l=n;let c=r;if("function"!=typeof n&&(c=n),void 0!==c&&"[object Object]"!==Object.prototype.toString.call(c))throw new Error(`Invalid options: ${c}, 'options' should be an object.`);c=Object.assign(Object.assign({},he),c);const u=M(a)?ce(a):a,h=Array.isArray(c.mark)?(e,t)=>{for(const n of c.mark){if("function"!=typeof n)throw new Error(`Invalid mark: ${n}, 'mark' should be a function.`);const r=n(e,t);if(r)return r}}:c.mark,p=null!==(i=c.enablePatches)&&void 0!==i&&i,f=null!==(o=c.strict)&&void 0!==o&&o,d={enableAutoFreeze:null!==(s=c.enableAutoFreeze)&&void 0!==s&&s,mark:h,strict:f,enablePatches:p};if(!C(u,d)&&"object"==typeof u&&null!==u)throw new Error("Invalid base state: create() only supports plain objects, arrays, Set, Map or using mark() to mark the state as immutable.");const[m,v]=function(e,t){var n;const r={draft:[],revoke:[],handledSet:new WeakSet};let i,o;t.enablePatches&&(i=[],o=[]);const s=(null===(n=t.mark)||void 0===n?void 0:n.call(t,e,y))!==y.mutable&&C(e,t)?oe({original:e,parentDraft:null,finalities:r,options:t}):e;return[s,(e=[])=>{const[n,r,a]=se(s,e,i,o,t.enableAutoFreeze);return t.enablePatches?[n,r,a]:n}]}(u,d);if("function"!=typeof n){if(!C(u,d))throw new Error("Invalid base state: create() only supports plain objects, arrays, Set, Map or using mark() to mark the state as immutable.");return[m,v]}let b;try{b=l(m)}catch(e){throw z(k(m)),e}const w=e=>{const t=k(m);if(!M(e)){if(void 0!==e&&!P(e,m)&&(null==t?void 0:t.operated))throw new Error("Either the value is returned as a new non-draft value, or only the draft is modified without returning any value.");const n=null==e?void 0:e[g];if(n){const r=n[0];return d.strict&&"object"==typeof e&&null!==e&&ae({rootDraft:t,value:e,useRawReturn:!0}),v([r])}if(void 0!==e)return"object"==typeof e&&null!==e&&ae({rootDraft:t,value:e}),v([e])}if(e===m||void 0===e)return v([]);const n=k(e);if(d===n.options){if(n.operated)throw new Error("Cannot return a modified child draft.");return v([ce(e)])}return v([e])};return b instanceof Promise?b.then(w,(e=>{throw z(k(m)),e})):w(b)};var he;Object.prototype.constructor.toString();class pe{constructor(e,t){this.value=e,this.reactor=t??new u(this)}set(e){this.value=e,this.reactor.emit({type:"SET",target:this,value:e})}get(){return this.value}increase(e=1){"number"==typeof this.value&&this.set(this.value+e)}produce(e){const[t,n]=ue(this.value);e(t),this.set(n())}}const fe={on:function(e,t,n,r){"string"==typeof r&&(r=e.findName(c(r))),t.addEventListener(n,r)},ref:function(e,t,n,r){if("string"==typeof r&&(r=e.findName(c(r))),!(r instanceof l))throw Error("Rumious: ref directive required RumiousElementRef !");r.target=t},inject:function(e,t,n,r){if("string"==typeof r&&(r=e.findName(c(r))),!(r instanceof a))throw Error("Rumious: inject directive required RumiousInjector !");r.addTarget(t),r.inject(t)},bind:function(e,t,n,r){if("string"==typeof r&&(r=e.findName(c(r))),!(r instanceof pe))throw Error("Rumious: bind directive required RumiousState !");t.setAttribute(n,r.value),r.reactor.addBinding((({})=>{t.setAttribute(n,r.value)}))},model:function(e,t,n,r){if("string"==typeof r&&(r=e.findName(c(r))),!(r instanceof pe&&(t instanceof HTMLInputElement||t instanceof HTMLSelectElement||t instanceof HTMLTextAreaElement)))throw Error("Rumious: model directive requires RumiousState and a valid form element!");{const e=t.type;t.addEventListener("input",(()=>{if(t instanceof HTMLInputElement)switch(e){case"checkbox":r.set(t.checked);break;case"radio":t.checked&&r.set(t.value);break;default:r.set(t.value)}else(t instanceof HTMLSelectElement||t instanceof HTMLTextAreaElement)&&r.set(t.value)}))}}};class de{constructor(e,t){this.state=e,this.callback=t}prepare(e,t){this.anchorElement=e,this.context=t}async render(){this.state.reactor.addBinding(this.onStateChange.bind(this)),requestAnimationFrame((()=>{this.renderAll()}))}renderAll(){this.anchorElement.textContent="";let e=document.createDocumentFragment();this.state.value.forEach(((t,n)=>{let r=document.createDocumentFragment(),i=this.callback(t,n);this.context.renderHelper(this.context,i,r),e.appendChild(r)})),this.anchorElement.replaceChildren(e)}updateElement(e,t){let n=this.anchorElement.children[e];if(!n)return;let r=this.callback(t,e),i=document.createDocumentFragment();this.context.renderHelper(this.context,r,i),this.anchorElement.replaceChild(i,n)}insertOrAppendElement(e,t){let n=document.createDocumentFragment(),r=this.callback(e,t);this.context.renderHelper(this.context,r,n);let i=this.anchorElement.children[t];i?this.anchorElement.insertBefore(n,i):this.anchorElement.appendChild(n)}removeElement(e){let t=this.anchorElement.children[e];t&&t.remove()}async onStateChange(e){switch(e.type){case"SET":default:requestAnimationFrame((()=>{this.renderAll()}));break;case"SET_BY_KEY":this.updateElement(e.key,e.value);break;case"REMOVE_BY_KEY":this.removeElement(e.key);break;case"INSERT_BY_KEY":this.insertOrAppendElement(e.value,e.key);break;case"APPEND":this.insertOrAppendElement(e.value,this.state.value.length);break;case"PREPEND":let t=document.createDocumentFragment(),n=e.value,r=this.callback(n,0);this.context.renderHelper(this.context,r,t),this.anchorElement.prepend(t)}}}async function ge(e,t,r,i){if(t.parentNode)if(function(e){return e!==Object(e)}(r))t.textContent=String(r);else if(r&&r instanceof pe&&r.value instanceof Node){let o=t;if(!o.parentNode)return;function a({}){document.contains(o)&&o.parentNode?(r.value instanceof n&&r.value.setContext(i),o.parentNode.replaceChild(r.value,o),o=r.value):r.reactor.removeBinding(a)}r.value instanceof n&&r.value.setContext(i),o.parentNode.replaceChild(r.value,o),o=r.value,r.reactor.addBinding(a)}else if(r&&r instanceof pe){function l({}){document.contains(t)?t.textContent=r.value:r.reactor.removeBinding(l)}t.textContent=r.value,r.reactor.addBinding(l)}else if(Array.isArray(r))t.textContent=r.map(String).join("");else if(r instanceof de)r.prepare(t.parentElement,i),r.render();else if(r instanceof HTMLElement)t.replaceWith(r);else if(r instanceof s){let c=document.createDocumentFragment();i.renderHelper?.(i,r,c),t.replaceWith(c)}else if(r instanceof NodeList||r instanceof HTMLCollection){if(0===r.length)return void t.remove();const u=document.createDocumentFragment();for(const h of Array.from(r))u.appendChild(h.cloneNode(!0));t.replaceWith(u),t.remove()}else if(r&&"function"==typeof r.toString)try{t.textContent=r.toString()}catch{t.textContent=""}else t.textContent=""}function me(e){return new s(e)}window.RUMIOUS_JSX={template:me,createElement:function(...e){throw console.log(e),Error("Rumious doesn't use createElement !")},addDirective:function(e,t,n,r="",i){let o=fe[n];if(!o)throw Error("Rumious: Cannot solve directive !");o(t,e,r,i)},dynamicValue:function(e,t,n,r){ge(0,t,n,r)},createComponent:function(e){let t=e.tagName;return window.customElements.get(t)||window.customElements.define(t,class extends n{static tag=t}),document.createElement(t)}};var ye=Object.freeze({__proto__:null,Fragment:function(...e){throw Error("Fragment element must be compiled by Rumious !")},template:me}),ve=Object.freeze({__proto__:null,RumiousDymanicInjector:a,RumiousRenderTemplate:s,createHTMLInjector:function(e){return new a([e])},renderDynamicArray:function(e,t){return new de(e,t)}});var be=Object.freeze({__proto__:null,RumiousChildrenRef:class{constructor(e){this.target=e}list(){return Array.from(this.target.children)}getChild(e){return this.list()[e]}remove(e){this.list()[e]?.remove()}add(e){this.target.appendChild(e)}querySelector(e){return this.target.querySelector(e)}querySelectorAll(e){return this.target.querySelectorAll(e)}clear(){this.target.innerHTML=""}replaceChild(e,t){const n=this.getChild(e);n&&this.target.replaceChild(t,n)}insertBefore(e,t){const n=this.getChild(t);n?this.target.insertBefore(e,n):this.add(e)}prepend(e){this.target.prepend(e)}getFirstChild(){return this.list()[0]}getLastChild(){return this.list()[this.list().length-1]}hasChildren(){return this.target.hasChildNodes()}count(){return this.target.children.length}find(e){return this.list().find(e)}forEach(e){this.list().forEach(e)}removeAllMatching(e){this.querySelectorAll(e).forEach((e=>e.remove()))}toggleClass(e){this.list().forEach((t=>t.classList.toggle(e)))}setAttribute(e,t){this.list().forEach((n=>n.setAttribute(e,t)))}},RumiousElementRef:l,createElementRef:function(){return new l(document.createElement("span"))}});class we extends pe{constructor(e,t){super(e,t)}set(e,t){if("number"==typeof e&&void 0!==t){const n=e,r=t;this.value[n]=r,this.reactor.emit({type:"SET_BY_KEY",value:r,target:this,key:n,item:r})}else{if(!Array.isArray(e))throw new Error("Invalid arguments passed to set()");super.set(e)}}get(e){return"number"==typeof e?this.value[e]:this.value}insert(e,t){return this.value.splice(e,0,t),this.reactor.emit({type:"INSERT_BY_KEY",value:t,target:this,key:e,item:t}),this}remove(e){return this.value.splice(e,1),this.reactor.emit({type:"REMOVE_BY_KEY",value:null,target:this,key:e}),this}append(e){return this.value.push(e),this.reactor.emit({type:"APPEND",value:e,target:this,item:e}),this}prepend(e){return this.value.unshift(e),this.reactor.emit({type:"PREPEND",value:e,target:this,item:e}),this}clear(){return this.value.length=0,this.reactor.emit({type:"SET",value:null,target:this}),this}replace(e,t){if(e<0||e>=this.value.length)throw new Error("Index out of bounds");return this.value[e]=t,this.reactor.emit({type:"SET_BY_KEY",value:t,target:this,key:e,item:t}),this}filter(e){return this.value=this.value.filter(e),this.reactor.emit({type:"SET",value:null,target:this}),this}map(e){return this.value=this.value.map(e),this.reactor.emit({type:"SET",value:null,target:this}),this}sort(e){return this.value.sort(e),this.reactor.emit({type:"SET",value:null,target:this}),this}reverse(){return this.value.reverse(),this.reactor.emit({type:"SET",value:null,target:this}),this}get length(){return this.value.length}forEach(e){this.value.forEach(e)}}class Ee extends pe{#e=!1;constructor(e,t){super(e,t)}set(e,t){if(this.#e)throw new Error("Object is locked");if("string"==typeof e){const n=e,r=t;return this.value[n]=r,this.reactor.emit({type:"SET_BY_KEY",value:{...this.value},target:this,key:n,item:r}),this}if("object"!=typeof e)throw new Error("Invalid arguments passed to set()");super.set(e)}remove(e){if(this.#e)throw new Error("Object is locked");return e in this.value&&(delete this.value[e],this.reactor.emit({type:"REMOVE_BY_KEY",value:{...this.value},target:this,key:e})),this}merge(e){if(this.#e)throw new Error("Object is locked");return Object.assign(this.value,e),this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}assign(e){if(this.#e)throw new Error("Object is locked");return this.value={...this.value,...e},this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}clear(){if(this.#e)throw new Error("Object is locked");for(const e in this.value)delete this.value[e];return this.reactor.emit({type:"SET",value:{},target:this}),this}get(e){return"string"==typeof e?this.value[e]:this.value}keys(){return Object.keys(this.value)}values(){return Object.values(this.value)}entries(){return Object.entries(this.value)}has(e){return e in this.value}get size(){return Object.keys(this.value).length}forEach(e){Object.entries(this.value).forEach((([t,n])=>{e(n,t,this.value)}))}map(e){const t={};return Object.entries(this.value).forEach((([n,r])=>{t[n]=e(r,n,this.value)})),t}clone(){return JSON.parse(JSON.stringify(this.value))}toJSON(){return JSON.parse(JSON.stringify(this.value))}toObject(){return this.get()}lock(){return this.#e=!0,this}unlock(){return this.#e=!1,this}get isLocked(){return this.#e}freeze(){return Object.freeze(this.value),this}unfreeze(){return this.value=JSON.parse(JSON.stringify(this.value)),this}get isFrozen(){return Object.isFrozen(this.value)}}var Se=Object.freeze({__proto__:null,RumiousArrayState:we,RumiousObjectState:Ee,RumiousState:pe,createArrayState:function(e){return new we(e)},createObjectState:function(e){return new Ee(e)},createState:function(e){return new pe(e)},unwatch:function(e,t){e.reactor.removeBinding(t)},watch:function(e,t){e.reactor.addBinding(t)}});window.RUMIOUS_CONTEXTS={};class Oe{constructor(e={}){this.events={},this.values=e}has(e){return e in this.values}set(e,t){this.values[e]=t}get(e){return this.values[e]}on(e,t){this.events[e]||(this.events[e]=[]),this.events[e].push(t)}off(e,t){this.events[e]&&(this.events[e]=this.events[e].filter((e=>e!==t)))}emit(e,t){this.events[e]&&this.events[e].forEach((e=>e(t)))}}const Me={...r,...o,...ye,...ve,...be,...Se,...Object.freeze({__proto__:null,RumiousContext:Oe,createContext:function(e,t=function(e="_"){return`${e}${(Math.floor(9999*Math.random())*Date.now()).toString(32)}`}("rctx_")){if(window.RUMIOUS_CONTEXTS[t])return window.RUMIOUS_CONTEXTS[t];{let n=new Oe(e);return window.RUMIOUS_CONTEXTS[t]=n,n}}}),...Object.freeze({__proto__:null,denounce:function(e,t){let n;return function(...r){clearTimeout(n),n=setTimeout((()=>e.apply(this,r)),t)}},leadingTrailingDebounce:function(e,t){let n,r=!0;return function(...i){r&&(e.apply(this,i),r=!1),clearTimeout(n),n=setTimeout((()=>{e.apply(this,i),r=!0}),t)}},rafThrottle:function(e){let t=!1;return function(...n){t||(t=!0,requestAnimationFrame((()=>{e.apply(this,n),t=!1})))}},tholle:function(e,t){let n=0;return function(...r){const i=Date.now();i-n>=t&&(n=i,e.apply(this,r))}},trailingThrottle:function(e,t){let n=0,r=null,i=null;function o(){n=Date.now(),e.apply(this,r),r=null}return function(...e){const s=Date.now();r=e,s-n>=t?o.call(this):i||(i=setTimeout((()=>{i=null,o.call(this)}),t-(s-n)))}}})};window.Rumious=Me}();
+!function(){class t{constructor(t,e){this.target=t,this.app=e,this.onRenderFinished=[]}findName(t){return this.target[t]}}function e(t,n,r){let i=n.generator.bind(t.target);t.renderHelper=e,i(r,t),setTimeout((async()=>{const e=[...t.onRenderFinished];t.onRenderFinished=[];for(const t of e)await t()}),0)}class n extends HTMLElement{constructor(){super(),this.props={}}setContext(t){this.context=t}setComponent(t){this.componentConstructor=t}setup(t,e){this.context=t,this.componentConstructor=e}connectedCallback(){this.componentConstructor?(this.componentInstance=new this.componentConstructor,this.componentInstance.element=this,this.componentConstructor.classNames&&(this.className=this.componentConstructor.classNames),this.componentInstance.prepare(this.context,this.props),this.componentInstance.onCreate(),this.componentInstance.requestRender()):console.warn("Rumious: Cannot find matching component constructor.")}disconnectedCallback(){this.componentInstance?.onDestroy()}}var r=Object.freeze({__proto__:null,RumiousComponent:class{static classNames="";static tagName="rumious-component";constructor(){this.renderOptions={mode:"idle"}}onCreate(){}onRender(){}onDestroy(){}async onBeforeRender(){}prepare(e,n){this.props=n,this.context=new t(this,e.app)}async requestRender(){await this.onBeforeRender();let t=this.template();e(this.context,t,this.element),this.onRender()}requestCleanup(){}},RumiousComponentElement:n,renderComponent:function(t,e){let n=window.RUMIOUS_JSX.createComponent(t);return n.props=e,n.setComponent(t),n}});class i{constructor(e,n={}){this.root=e,this.options=n,this.modules=[],this.context=new t(this,this)}addModule(t,e){const n=t.init(this,e);return this.modules.push(n),n}render(t){e(this.context,t,this.root)}}var s=Object.freeze({__proto__:null,RumiousApp:i,RumiousModule:class{},createApp:function(t,e){return new i(t,e)}});class o{constructor(t){this.generator=t}}class a{constructor(t){if(this.contents=t,this.targets=new Map,!t||0===t.length)throw new Error("Injector must be initialized with non-empty content");const e=t[0];this.type="string"==typeof e?"string":"element"}commit(t){this.contents=t;const e=t[0];this.type="string"==typeof e?"string":"element"}addTarget(t){this.targets.set(t,1)}inject(t){if(this.targets.has(t)&&this.contents)if(t.innerHTML="","string"===this.type)for(const e of this.contents)t.insertAdjacentHTML("beforeend",e);else for(const e of this.contents)t.appendChild(e)}injectAll(){for(const t of this.targets.keys())this.inject(t)}removeTarget(t){this.targets.delete(t)}clear(){this.targets.clear()}}class l{constructor(t){this.target=t}getElement(){return this.target}remove(){this.target.remove()}addChild(t){this.target.appendChild(t)}listChild(){return this.target.childNodes}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}set text(t){this.target.textContent=t}get text(){return this.target.textContent}set value(t){(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.value=t)}get value(){if(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)return this.target.value}addClassName(t){this.target.classList.add(t)}removeClassName(t){this.target.classList.remove(t)}hasClassName(t){return this.target.classList.contains(t)}toggleClass(t,e){return this.target.classList.toggle(t,e)}setStyle(t){Object.assign(this.target.style,t)}getStyle(t){return getComputedStyle(this.target).getPropertyValue(t)}setAttribute(t,e){this.target.setAttribute(t,e)}getAttribute(t){return this.target.getAttribute(t)}removeAttribute(t){this.target.removeAttribute(t)}on(t,e,n){this.target.addEventListener(t,e,n)}off(t,e,n){this.target.removeEventListener(t,e,n)}set html(t){this.target.innerHTML=t}get html(){return this.target.innerHTML}getBoundingRect(){return this.target.getBoundingClientRect()}isInViewport(){const t=this.target.getBoundingClientRect();return t.top>=0&&t.left>=0&&t.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&t.right<=(window.innerWidth||document.documentElement.clientWidth)}prependChild(t){this.target.prepend(t)}setDisabled(t){(this.target instanceof HTMLButtonElement||this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.disabled=t)}addClasses(...t){this.target.classList.add(...t)}removeClasses(...t){this.target.classList.remove(...t)}replaceClass(t,e){this.target.classList.replace(t,e)}moveTo(t){t.appendChild(this.target)}getParent(){return this.target.parentElement}getNextSibling(){return this.target.nextElementSibling}getPreviousSibling(){return this.target.previousElementSibling}hide(){this.target.style.display="none"}show(){this.target.style.removeProperty("display")}isHidden(){return"none"===window.getComputedStyle(this.target).display}scrollIntoView(t={behavior:"smooth"}){this.target.scrollIntoView(t)}matches(t){return this.target.matches(t)}getChildren(){return Array.from(this.target.children)}insertAfter(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target.nextSibling)}insertBefore(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target)}clearChildren(){for(;this.target.firstChild;)this.target.removeChild(this.target.firstChild)}animate(t,e){return this.target.animate(t,e)}}function c(t){const e=t.indexOf("$");return-1!==e?t.slice(e+1):""}class u{constructor(t){this.target=t,this.bindings=[]}addBinding(t){this.bindings.push(t)}removeBinding(t){this.bindings=this.bindings.filter((e=>e!==t))}async emit(t){await Promise.allSettled(this.bindings.map((e=>{try{const n=e(t);return n instanceof Promise?n:Promise.resolve(n)}catch(t){return Promise.reject(t)}})))}}const h="remove",p="replace",f="add",d=Symbol.for("__MUTATIVE_PROXY_DRAFT__"),g=Symbol("__MUTATIVE_RAW_RETURN_SYMBOL__"),m=Symbol.iterator,y={mutable:"mutable",immutable:"immutable"},v={};function b(t,e){return t instanceof Map?t.has(e):Object.prototype.hasOwnProperty.call(t,e)}function w(t,e){if(e in t){let n=Reflect.getPrototypeOf(t);for(;n;){const t=Reflect.getOwnPropertyDescriptor(n,e);if(t)return t;n=Reflect.getPrototypeOf(n)}}}function E(t){return Object.getPrototypeOf(t)===Set.prototype}function S(t){return Object.getPrototypeOf(t)===Map.prototype}function O(t){var e;return null!==(e=t.copy)&&void 0!==e?e:t.original}function M(t){return!!k(t)}function k(t){return"object"!=typeof t?null:null==t?void 0:t[d]}function C(t){var e;const n=k(t);return n?null!==(e=n.copy)&&void 0!==e?e:n.original:t}function j(t,e){if(!t||"object"!=typeof t)return!1;let n;return Object.getPrototypeOf(t)===Object.prototype||Array.isArray(t)||t instanceof Map||t instanceof Set||!!(null==e?void 0:e.mark)&&((n=e.mark(t,y))===y.immutable||"function"==typeof n)}function R(t,e=[]){if(Object.hasOwnProperty.call(t,"key")){const n=t.parent.copy,r=k(T(n,t.key));if(null!==r&&(null==r?void 0:r.original)!==t.original)return null;const i=3===t.parent.type,s=i?Array.from(t.parent.setMap.keys()).indexOf(t.key):t.key;if(!(i&&n.size>s||b(n,s)))return null;e.push(s)}if(t.parent)return R(t.parent,e);e.reverse();try{!function(t,e){for(let n=0;n<e.length-1;n+=1){const r=e[n];if("object"!=typeof(t=T(3===A(t)?Array.from(t):t,r)))throw new Error(`Cannot resolve patch at '${e.join("/")}'.`)}}(t.copy,e)}catch(t){return null}return e}function A(t){return Array.isArray(t)?1:t instanceof Map?2:t instanceof Set?3:0}function T(t,e){return 2===A(t)?t.get(e):t[e]}function P(t,e,n){2===A(t)?t.set(e,n):t[e]=n}function _(t,e){const n=k(t);return(n?O(n):t)[e]}function x(t,e){return t===e?0!==t||1/t==1/e:t!=t&&e!=e}function z(t){if(t)for(;t.finalities.revoke.length>0;){t.finalities.revoke.pop()()}}function N(t,e){return e?t:[""].concat(t).map((t=>{const e=`${t}`;return-1===e.indexOf("/")&&-1===e.indexOf("~")?e:e.replace(/~/g,"~0").replace(/\//g,"~1")})).join("/")}const D=Object.prototype.propertyIsEnumerable;function I(t,e){let n;if(Array.isArray(t))return Array.prototype.concat.call(t);if(t instanceof Set){if(!E(t)){return new(0,Object.getPrototypeOf(t).constructor)(t.values())}return Set.prototype.difference?Set.prototype.difference.call(t,new Set):new Set(t.values())}if(t instanceof Map){if(!S(t)){return new(0,Object.getPrototypeOf(t).constructor)(t)}return new Map(t)}if((null==e?void 0:e.mark)&&(n=e.mark(t,y),void 0!==n)&&n!==y.mutable){if(n===y.immutable)return function(t){const e=Object.create(Object.getPrototypeOf(t));return Reflect.ownKeys(t).forEach((n=>{let r=Reflect.getOwnPropertyDescriptor(t,n);r.enumerable&&r.configurable&&r.writable?e[n]=t[n]:(r.writable||(r.writable=!0,r.configurable=!0),(r.get||r.set)&&(r={configurable:!0,writable:!0,enumerable:r.enumerable,value:t[n]}),Reflect.defineProperty(e,n,r))})),e}(t);if("function"==typeof n){if(e.enablePatches||e.enableAutoFreeze)throw new Error("You can't use mark and patches or auto freeze together.");return n()}throw new Error(`Unsupported mark result: ${n}`)}if("object"==typeof t&&Object.getPrototypeOf(t)===Object.prototype){const e={};return Object.keys(t).forEach((n=>{e[n]=t[n]})),Object.getOwnPropertySymbols(t).forEach((n=>{D.call(t,n)&&(e[n]=t[n])})),e}throw new Error("Please check mark() to ensure that it is a stable marker draftable function.")}function L(t){t.copy||(t.copy=I(t.original,t.options))}function H(t){if(!j(t))return C(t);if(Array.isArray(t))return t.map(H);if(t instanceof Map){const e=Array.from(t.entries()).map((([t,e])=>[t,H(e)]));if(!S(t)){return new(0,Object.getPrototypeOf(t).constructor)(e)}return new Map(e)}if(t instanceof Set){const e=Array.from(t).map(H);if(!E(t)){return new(0,Object.getPrototypeOf(t).constructor)(e)}return new Set(e)}const e=Object.create(Object.getPrototypeOf(t));for(const n in t)e[n]=H(t[n]);return e}function B(t){return M(t)?H(t):t}function F(t){var e;t.assignedMap=null!==(e=t.assignedMap)&&void 0!==e?e:new Map,t.operated||(t.operated=!0,t.parent&&F(t.parent))}function Y(){throw new Error("Cannot modify frozen object")}function V(t,e,n,r,i){{n=null!=n?n:new WeakMap,r=null!=r?r:[],i=null!=i?i:[];const s=n.has(t)?n.get(t):t;if(r.length>0){const t=r.indexOf(s);if(s&&"object"==typeof s&&-1!==t){if(r[0]===s)throw new Error("Forbids circular reference");throw new Error(`Forbids circular reference: ~/${i.slice(0,t).map(((t,e)=>{if("symbol"==typeof t)return`[${t.toString()}]`;const n=r[e];return"object"==typeof t&&(n instanceof Map||n instanceof Set)?Array.from(n.keys()).indexOf(t):t})).join("/")}`)}r.push(s),i.push(e)}else r.push(s)}if(Object.isFrozen(t)||M(t))return r.pop(),void i.pop();switch(A(t)){case 2:for(const[e,s]of t)V(e,e,n,r,i),V(s,e,n,r,i);t.set=t.clear=t.delete=Y;break;case 3:for(const e of t)V(e,e,n,r,i);t.add=t.clear=t.delete=Y;break;case 1:Object.freeze(t);let e=0;for(const s of t)V(s,e,n,r,i),e+=1;break;default:Object.freeze(t),Object.keys(t).forEach((e=>{V(t[e],e,n,r,i)}))}r.pop(),i.pop()}function q(t,e){const n=A(t);if(0===n)Reflect.ownKeys(t).forEach((n=>{e(n,t[n],t)}));else if(1===n){let n=0;for(const r of t)e(n,r,t),n+=1}else t.forEach(((n,r)=>e(r,n,t)))}function K(t,e,n){if(M(t)||!j(t,n)||e.has(t)||Object.isFrozen(t))return;const r=t instanceof Set,i=r?new Map:void 0;if(e.add(t),q(t,((s,o)=>{var a;if(M(o)){const e=k(o);L(e);const n=(null===(a=e.assignedMap)||void 0===a?void 0:a.size)||e.operated?e.copy:e.original;P(r?i:t,s,n)}else K(o,e,n)})),i){const e=t,n=Array.from(e);e.clear(),n.forEach((t=>{e.add(i.has(t)?i.get(t):t)}))}}function U(t,e){const n=3===t.type?t.setMap:t.copy;t.finalities.revoke.length>1&&t.assignedMap.get(e)&&n&&K(T(n,e),t.finalities.handledSet,t.options)}function W(t){3===t.type&&t.copy&&(t.copy.clear(),t.setMap.forEach((e=>{t.copy.add(C(e))})))}function $(t,e,n,r){if(t.operated&&t.assignedMap&&t.assignedMap.size>0&&!t.finalized){if(n&&r){const i=R(t);i&&e(t,i,n,r)}t.finalized=!0}}function J(t,e,n,r){const i=k(n);i&&(i.callbacks||(i.callbacks=[]),i.callbacks.push(((s,o)=>{var a;const l=3===t.type?t.setMap:t.copy;if(x(T(l,e),n)){let n=i.original;i.copy&&(n=i.copy),W(t),$(t,r,s,o),t.options.enableAutoFreeze&&(t.options.updatedValues=null!==(a=t.options.updatedValues)&&void 0!==a?a:new WeakMap,t.options.updatedValues.set(n,i.original)),P(l,e,n)}})),t.options.enableAutoFreeze&&i.finalities!==t.finalities&&(t.options.enableAutoFreeze=!1)),j(n,t.options)&&t.finalities.draft.push((()=>{x(T(3===t.type?t.setMap:t.copy,e),n)&&U(t,e)}))}function X(t,e,n,r){const{pathAsArray:i=!0}=t.options.enablePatches;switch(t.type){case 0:case 2:return function({original:t,copy:e,assignedMap:n},r,i,s,o){n.forEach(((n,a)=>{const l=T(t,a),c=B(T(e,a)),u=n?b(t,a)?p:f:h;if(x(l,c)&&u===p)return;const d=N(r.concat(a),o);i.push(u===h?{op:u,path:d}:{op:u,path:d,value:c}),s.push(u===f?{op:h,path:d}:u===h?{op:f,path:d,value:l}:{op:p,path:d,value:l})}))}(t,e,n,r,i);case 1:return function(t,e,n,r,i){let{original:s,assignedMap:o,options:a}=t,l=t.copy;l.length<s.length&&([s,l]=[l,s],[n,r]=[r,n]);for(let t=0;t<s.length;t+=1)if(o.get(t.toString())&&l[t]!==s[t]){const o=N(e.concat([t]),i);n.push({op:p,path:o,value:B(l[t])}),r.push({op:p,path:o,value:B(s[t])})}for(let t=s.length;t<l.length;t+=1){const r=N(e.concat([t]),i);n.push({op:f,path:r,value:B(l[t])})}if(s.length<l.length){const{arrayLengthAssignment:t=!0}=a.enablePatches;if(t){const t=N(e.concat(["length"]),i);r.push({op:p,path:t,value:s.length})}else for(let t=l.length;s.length<t;t-=1){const n=N(e.concat([t-1]),i);r.push({op:h,path:n})}}}(t,e,n,r,i);case 3:return function({original:t,copy:e},n,r,i,s){let o=0;t.forEach((t=>{if(!e.has(t)){const e=N(n.concat([o]),s);r.push({op:h,path:e,value:t}),i.unshift({op:f,path:e,value:t})}o+=1})),o=0,e.forEach((e=>{if(!t.has(e)){const t=N(n.concat([o]),s);r.push({op:f,path:t,value:e}),i.unshift({op:h,path:t,value:e})}o+=1}))}(t,e,n,r,i)}}const G=(t,e,n=!1)=>{if("object"==typeof t&&null!==t&&(!j(t,e)||n))throw new Error("Strict mode: Mutable data cannot be accessed directly, please use 'unsafe(callback)' wrap.")},Q={get size(){return O(k(this)).size},has(t){return O(k(this)).has(t)},set(t,e){const n=k(this),r=O(n);return r.has(t)&&x(r.get(t),e)||(L(n),F(n),n.assignedMap.set(t,!0),n.copy.set(t,e),J(n,t,e,X)),this},delete(t){if(!this.has(t))return!1;const e=k(this);return L(e),F(e),e.original.has(t)?e.assignedMap.set(t,!1):e.assignedMap.delete(t),e.copy.delete(t),!0},clear(){const t=k(this);if(this.size){L(t),F(t),t.assignedMap=new Map;for(const[e]of t.original)t.assignedMap.set(e,!1);t.copy.clear()}},forEach(t,e){O(k(this)).forEach(((n,r)=>{t.call(e,this.get(r),r,this)}))},get(t){var e,n;const r=k(this),i=O(r).get(t),s=(null===(n=(e=r.options).mark)||void 0===n?void 0:n.call(e,i,y))===y.mutable;if(r.options.strict&&G(i,r.options,s),s)return i;if(r.finalized||!j(i,r.options))return i;if(i!==r.original.get(t))return i;const o=v.createDraft({original:i,parentDraft:r,key:t,finalities:r.finalities,options:r.options});return L(r),r.copy.set(t,o),o},keys(){return O(k(this)).keys()},values(){const t=this.keys();return{[m]:()=>this.values(),next:()=>{const e=t.next();if(e.done)return e;return{done:!1,value:this.get(e.value)}}}},entries(){const t=this.keys();return{[m]:()=>this.entries(),next:()=>{const e=t.next();if(e.done)return e;const n=this.get(e.value);return{done:!1,value:[e.value,n]}}}},[m](){return this.entries()}},Z=Reflect.ownKeys(Q),tt=(t,e,{isValuesIterator:n})=>()=>{var r,i;const s=e.next();if(s.done)return s;const o=s.value;let a=t.setMap.get(o);const l=k(a),c=(null===(i=(r=t.options).mark)||void 0===i?void 0:i.call(r,a,y))===y.mutable;if(t.options.strict&&G(o,t.options,c),c||l||!j(o,t.options)||t.finalized||!t.original.has(o))l&&(a=l.proxy);else{const e=v.createDraft({original:o,parentDraft:t,key:o,finalities:t.finalities,options:t.options});t.setMap.set(o,e),a=e}return{done:!1,value:n?a:[a,a]}},et={get size(){return k(this).setMap.size},has(t){const e=k(this);if(e.setMap.has(t))return!0;L(e);const n=k(t);return!(!n||!e.setMap.has(n.original))},add(t){const e=k(this);return this.has(t)||(L(e),F(e),e.assignedMap.set(t,!0),e.setMap.set(t,t),J(e,t,t,X)),this},delete(t){if(!this.has(t))return!1;const e=k(this);L(e),F(e);const n=k(t);return n&&e.setMap.has(n.original)?(e.assignedMap.set(n.original,!1),e.setMap.delete(n.original)):(!n&&e.setMap.has(t)?e.assignedMap.set(t,!1):e.assignedMap.delete(t),e.setMap.delete(t))},clear(){if(!this.size)return;const t=k(this);L(t),F(t);for(const e of t.original)t.assignedMap.set(e,!1);t.setMap.clear()},values(){const t=k(this);L(t);const e=t.setMap.keys();return{[Symbol.iterator]:()=>this.values(),next:tt(t,e,{isValuesIterator:!0})}},entries(){const t=k(this);L(t);const e=t.setMap.keys();return{[Symbol.iterator]:()=>this.entries(),next:tt(t,e,{isValuesIterator:!1})}},keys(){return this.values()},[m](){return this.values()},forEach(t,e){const n=this.values();let r=n.next();for(;!r.done;)t.call(e,r.value,r.value,this),r=n.next()}};Set.prototype.difference&&Object.assign(et,{intersection(t){return Set.prototype.intersection.call(new Set(this.values()),t)},union(t){return Set.prototype.union.call(new Set(this.values()),t)},difference(t){return Set.prototype.difference.call(new Set(this.values()),t)},symmetricDifference(t){return Set.prototype.symmetricDifference.call(new Set(this.values()),t)},isSubsetOf(t){return Set.prototype.isSubsetOf.call(new Set(this.values()),t)},isSupersetOf(t){return Set.prototype.isSupersetOf.call(new Set(this.values()),t)},isDisjointFrom(t){return Set.prototype.isDisjointFrom.call(new Set(this.values()),t)}});const nt=Reflect.ownKeys(et),rt=new WeakSet,it={get(t,e,n){var r,i;const s=null===(r=t.copy)||void 0===r?void 0:r[e];if(s&&rt.has(s))return s;if(e===d)return t;let o;if(t.options.mark){const r="size"===e&&(t.original instanceof Map||t.original instanceof Set)?Reflect.get(t.original,e):Reflect.get(t.original,e,n);if(o=t.options.mark(r,y),o===y.mutable)return t.options.strict&&G(r,t.options,!0),r}const a=O(t);if(a instanceof Map&&Z.includes(e)){if("size"===e)return Object.getOwnPropertyDescriptor(Q,"size").get.call(t.proxy);const n=Q[e];if(n)return n.bind(t.proxy)}if(a instanceof Set&&nt.includes(e)){if("size"===e)return Object.getOwnPropertyDescriptor(et,"size").get.call(t.proxy);const n=et[e];if(n)return n.bind(t.proxy)}if(!b(a,e)){const n=w(a,e);return n?"value"in n?n.value:null===(i=n.get)||void 0===i?void 0:i.call(t.proxy):void 0}const l=a[e];if(t.options.strict&&G(l,t.options),t.finalized||!j(l,t.options))return l;if(l===_(t.original,e)){if(L(t),t.copy[e]=st({original:t.original[e],parentDraft:t,key:1===t.type?Number(e):e,finalities:t.finalities,options:t.options}),"function"==typeof o){const n=k(t.copy[e]);return L(n),F(n),n.copy}return t.copy[e]}return l},set(t,e,n){var r;if(3===t.type||2===t.type)throw new Error("Map/Set draft does not support any property assignment.");let i;if(1===t.type&&"length"!==e&&(!(Number.isInteger(i=Number(e))&&i>=0)||0!==e&&0!==i&&String(i)!==String(e)))throw new Error("Only supports setting array indices and the 'length' property.");const s=w(O(t),e);if(null==s?void 0:s.set)return s.set.call(t.proxy,n),!0;const o=_(O(t),e),a=k(o);return a&&x(a.original,n)?(t.copy[e]=n,t.assignedMap=null!==(r=t.assignedMap)&&void 0!==r?r:new Map,t.assignedMap.set(e,!1),!0):(x(n,o)&&(void 0!==n||b(t.original,e))||(L(t),F(t),b(t.original,e)&&x(n,t.original[e])?t.assignedMap.delete(e):t.assignedMap.set(e,!0),t.copy[e]=n,J(t,e,n,X)),!0)},has:(t,e)=>e in O(t),ownKeys:t=>Reflect.ownKeys(O(t)),getOwnPropertyDescriptor(t,e){const n=O(t),r=Reflect.getOwnPropertyDescriptor(n,e);return r?{writable:!0,configurable:1!==t.type||"length"!==e,enumerable:r.enumerable,value:n[e]}:r},getPrototypeOf:t=>Reflect.getPrototypeOf(t.original),setPrototypeOf(){throw new Error("Cannot call 'setPrototypeOf()' on drafts")},defineProperty(){throw new Error("Cannot call 'defineProperty()' on drafts")},deleteProperty(t,e){var n;return 1===t.type?it.set.call(this,t,e,void 0,t.proxy):(void 0!==_(t.original,e)||e in t.original?(L(t),F(t),t.assignedMap.set(e,!1)):(t.assignedMap=null!==(n=t.assignedMap)&&void 0!==n?n:new Map,t.assignedMap.delete(e)),t.copy&&delete t.copy[e],!0)}};function st(t){const{original:e,parentDraft:n,key:r,finalities:i,options:s}=t,o=A(e),a={type:o,finalized:!1,parent:n,original:e,copy:null,proxy:null,finalities:i,options:s,setMap:3===o?new Map(e.entries()):void 0};(r||"key"in t)&&(a.key=r);const{proxy:l,revoke:c}=Proxy.revocable(1===o?Object.assign([],a):a,it);if(i.revoke.push(c),rt.add(l),a.proxy=l,n){const t=n;t.finalities.draft.push(((e,n)=>{var i,s;const o=k(l);let a=3===t.type?t.setMap:t.copy;const c=T(a,r),u=k(c);if(u){let s=u.original;u.operated&&(s=C(c)),W(u),$(u,X,e,n),t.options.enableAutoFreeze&&(t.options.updatedValues=null!==(i=t.options.updatedValues)&&void 0!==i?i:new WeakMap,t.options.updatedValues.set(s,u.original)),P(a,r,s)}null===(s=o.callbacks)||void 0===s||s.forEach((t=>{t(e,n)}))}))}else{const t=k(l);t.finalities.draft.push(((e,n)=>{W(t),$(t,X,e,n)}))}return l}function ot(t,e,n,r,i){var s;const o=k(t),a=null!==(s=null==o?void 0:o.original)&&void 0!==s?s:t,l=!!e.length;if(null==o?void 0:o.operated)for(;o.finalities.draft.length>0;){o.finalities.draft.pop()(n,r)}const c=l?e[0]:o?o.operated?o.copy:o.original:t;return o&&z(o),i&&V(c,c,null==o?void 0:o.options.updatedValues),[c,n&&l?[{op:p,path:[],value:e[0]}]:n,r&&l?[{op:p,path:[],value:a}]:r]}function at(t){const{rootDraft:e,value:n,useRawReturn:r=!1,isRoot:i=!0}=t;q(n,((n,r,i)=>{const s=k(r);if(s&&e&&s.finalities===e.finalities){t.isContainDraft=!0;const e=s.original;if(i instanceof Set){const t=Array.from(i);i.clear(),t.forEach((t=>i.add(n===t?e:t)))}else P(i,n,e)}else"object"==typeof r&&null!==r&&(t.value=r,t.isRoot=!1,at(t))})),i&&(t.isContainDraft||console.warn("The return value does not contain any draft, please use 'rawReturn()' to wrap the return value to improve performance."),r&&console.warn("The return value contains drafts, please don't use 'rawReturn()' to wrap the return value."))}function lt(t){var e;const n=k(t);if(!j(t,null==n?void 0:n.options))return t;const r=A(t);if(n&&!n.operated)return n.original;let i;function s(){i=2===r?S(t)?new Map(t):new(Object.getPrototypeOf(t).constructor)(t):3===r?Array.from(n.setMap.values()):I(t,null==n?void 0:n.options)}if(n){n.finalized=!0;try{s()}finally{n.finalized=!1}}else i=t;if(q(i,((e,r)=>{if(n&&x(T(n.original,e),r))return;const o=lt(r);o!==r&&(i===t&&s(),P(i,e,o))})),3===r){const t=null!==(e=null==n?void 0:n.original)&&void 0!==e?e:i;return E(t)?new Set(i):new(Object.getPrototypeOf(t).constructor)(i)}return i}function ct(t){if(!M(t))throw new Error(`current() is only used for Draft, parameter: ${t}`);return lt(t)}v.createDraft=st;const ut=function t(e,n,r){var i,s,o;if("function"==typeof e&&"function"!=typeof n)return function(r,...i){return t(r,(t=>e.call(this,t,...i)),n)};const a=e,l=n;let c=r;if("function"!=typeof n&&(c=n),void 0!==c&&"[object Object]"!==Object.prototype.toString.call(c))throw new Error(`Invalid options: ${c}, 'options' should be an object.`);c=Object.assign(Object.assign({},ht),c);const u=M(a)?ct(a):a,h=Array.isArray(c.mark)?(t,e)=>{for(const n of c.mark){if("function"!=typeof n)throw new Error(`Invalid mark: ${n}, 'mark' should be a function.`);const r=n(t,e);if(r)return r}}:c.mark,p=null!==(i=c.enablePatches)&&void 0!==i&&i,f=null!==(s=c.strict)&&void 0!==s&&s,d={enableAutoFreeze:null!==(o=c.enableAutoFreeze)&&void 0!==o&&o,mark:h,strict:f,enablePatches:p};if(!j(u,d)&&"object"==typeof u&&null!==u)throw new Error("Invalid base state: create() only supports plain objects, arrays, Set, Map or using mark() to mark the state as immutable.");const[m,v]=function(t,e){var n;const r={draft:[],revoke:[],handledSet:new WeakSet};let i,s;e.enablePatches&&(i=[],s=[]);const o=(null===(n=e.mark)||void 0===n?void 0:n.call(e,t,y))!==y.mutable&&j(t,e)?st({original:t,parentDraft:null,finalities:r,options:e}):t;return[o,(t=[])=>{const[n,r,a]=ot(o,t,i,s,e.enableAutoFreeze);return e.enablePatches?[n,r,a]:n}]}(u,d);if("function"!=typeof n){if(!j(u,d))throw new Error("Invalid base state: create() only supports plain objects, arrays, Set, Map or using mark() to mark the state as immutable.");return[m,v]}let b;try{b=l(m)}catch(t){throw z(k(m)),t}const w=t=>{const e=k(m);if(!M(t)){if(void 0!==t&&!x(t,m)&&(null==e?void 0:e.operated))throw new Error("Either the value is returned as a new non-draft value, or only the draft is modified without returning any value.");const n=null==t?void 0:t[g];if(n){const r=n[0];return d.strict&&"object"==typeof t&&null!==t&&at({rootDraft:e,value:t,useRawReturn:!0}),v([r])}if(void 0!==t)return"object"==typeof t&&null!==t&&at({rootDraft:e,value:t}),v([t])}if(t===m||void 0===t)return v([]);const n=k(t);if(d===n.options){if(n.operated)throw new Error("Cannot return a modified child draft.");return v([ct(t)])}return v([t])};return b instanceof Promise?b.then(w,(t=>{throw z(k(m)),t})):w(b)};var ht;Object.prototype.constructor.toString();class pt{constructor(t,e){this.value=t,this.reactor=e??new u(this)}set(t){this.value=t,this.reactor.emit({type:"SET",target:this,value:t})}get(){return this.value}increase(t=1){"number"==typeof this.value&&this.set(this.value+t)}produce(t){const[e,n]=ut(this.value);t(e),this.set(n())}}function ft(t,e){t.reactor.addBinding(e)}function dt(t,e){t.reactor.removeBinding(e)}const gt={on:function(t,e,n,r){"string"==typeof r&&(r=t.findName(c(r))),e.addEventListener(n,r)},ref:function(t,e,n,r){if("string"==typeof r&&(r=t.findName(c(r))),!(r instanceof l))throw Error("Rumious: ref directive required RumiousElementRef !");r.target=e},inject:function(t,e,n,r){if("string"==typeof r&&(r=t.findName(c(r))),!(r instanceof a))throw Error("Rumious: inject directive required RumiousInjector !");r.addTarget(e),r.inject(e)},bind:function(t,e,n,r){if("string"==typeof r&&(r=t.findName(c(r))),!(r instanceof pt))throw Error("Rumious: bind directive required RumiousState !");e.setAttribute(n,r.value),r.reactor.addBinding((({})=>{e.setAttribute(n,r.value)}))},model:function(t,e,n,r){if("string"==typeof r&&(r=t.findName(c(r))),!(r instanceof pt&&(e instanceof HTMLInputElement||e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)))throw Error("Rumious: model directive requires RumiousState and a valid form element!");{const t=e.type;e.addEventListener("input",(()=>{if(e instanceof HTMLInputElement)switch(t){case"checkbox":r.set(e.checked);break;case"radio":e.checked&&r.set(e.value);break;default:r.set(e.value)}else(e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)&&r.set(e.value)}))}}};class mt{constructor(t,e){this.state=t,this.callback=e}prepare(t,e){this.anchorElement=t,this.context=e}renderItem(t,e){const n=document.createDocumentFragment(),r=this.callback(t,e);return this.context.renderHelper(this.context,r,n),n}scheduleRenderAll(){requestAnimationFrame((()=>this.renderAll()))}async render(){this.state.reactor.addBinding(this.onStateChange.bind(this)),this.scheduleRenderAll()}renderAll(){const t=document.createDocumentFragment();this.state.value.forEach(((e,n)=>{t.appendChild(this.renderItem(e,n))})),this.anchorElement.replaceChildren(t)}updateElement(t,e){const n=this.anchorElement.children[t];n&&this.anchorElement.replaceChild(this.renderItem(e,t),n)}insertOrAppendElement(t,e){const n=this.renderItem(t,e),r=this.anchorElement.children[e];r?this.anchorElement.insertBefore(n,r):this.anchorElement.appendChild(n)}removeElement(t){this.anchorElement.children[t]?.remove()}appendElement(t,e){if(Array.isArray(t)){const n=document.createDocumentFragment();t.forEach(((t,r)=>{n.appendChild(this.renderItem(t,e+r))})),this.anchorElement.replaceChildren(n),this.anchorElement.appendChild(n)}}async onStateChange(t){if(document.contains(this.anchorElement))switch(t.type){case"SET":default:this.scheduleRenderAll();break;case"SET_BY_KEY":this.updateElement(t.key,t.value);break;case"REMOVE_BY_KEY":this.removeElement(t.key);break;case"INSERT_BY_KEY":this.insertOrAppendElement(t.value,t.key);break;case"APPEND":this.appendElement(t.value,this.state.value.length-t.value.length);break;case"PREPEND":this.anchorElement.prepend(this.renderItem(t.value,0))}else this.state.reactor.removeBinding(this.onStateChange.bind(this))}}class yt extends mt{isLoading=!1;constructor(t){super(t.data,t.template),this.options=t,this.limit=t.limit??50,this.offset=t.offset??0}setState(t){this.options.state?.set(t)}async fetchData(){const t=await(this.options.loader?.(this.limit,this.offset))??[];return this.offset+=t.length,t}getScrollInfo(){const t=this.options.scrollElement;return t===window?{scrollTop:window.scrollY,scrollHeight:document.documentElement.scrollHeight,clientHeight:window.innerHeight}:{scrollTop:t.scrollTop,scrollHeight:t.scrollHeight,clientHeight:t.clientHeight}}async render(){const t=this.options.scrollElement,e=async()=>{const{scrollTop:n,scrollHeight:r,clientHeight:i}=this.getScrollInfo();if(n+i>=r-this.options.threshold&&!this.isLoading){this.isLoading=!0,this.setState("START_FETCH");const n=await this.fetchData();this.setState("END_FETCH"),0===n.length?(this.setState("NO_DATA"),t.removeEventListener("scroll",e)):this.state.append(...Array.isArray(n)?n:[]),this.isLoading=!1}};t.addEventListener("scroll",e),this.state.reactor.addBinding(this.onStateChange.bind(this)),this.scheduleRenderAll()}}class vt extends mt{constructor(t){super(t.data,t.template),this.options=t,this.size=t.size,this.currentPage=t.page??0}getPageData(){const t=this.currentPage*this.size,e=t+this.size;return this.state.value.slice(t,e)}renderPage(){const t=document.createDocumentFragment(),e=this.currentPage*this.size,n=e+this.size;this.state.value.slice(e,n).forEach(((n,r)=>{t.appendChild(this.renderItem(n,e+r))})),this.anchorElement.replaceChildren(t),this.calculate()}goToPage(t){const e=Math.floor(this.state.value.length/this.size);console.log(e),this.currentPage=Math.max(0,Math.min(t,e)),this.renderPage()}nextPage(){this.goToPage(this.currentPage+1)}prevPage(){this.goToPage(this.currentPage-1)}onControl({value:t}){switch(t){case"NEXT":this.nextPage();break;case"PREV":this.prevPage()}}async calculate(){if(this.options.info&&this.options.info.set({current:this.currentPage,size:this.options.size}),this.options.pages){const e=Math.floor(this.state.value.length/this.size);let n=[];for(var t=0;t<e;t++)n.push({isRender:this.currentPage===t,index:t});this.options.pages.set(n)}}async render(){ft(this.options.controller,this.onControl.bind(this)),this.options.controller,this.state.reactor.addBinding(this.onStateChange.bind(this)),this.renderPage()}async onStateChange(t){if(!document.contains(this.anchorElement))return dt(this.options.controller,this.onControl.bind(this)),void this.state.reactor.removeBinding(this.onStateChange.bind(this));const e=this.currentPage*this.size,n=e+this.size;switch(t.type){case"SET":this.currentPage=0,this.renderPage();break;case"SET_BY_KEY":case"REMOVE_BY_KEY":case"INSERT_BY_KEY":(r=t.key)>=e&&r<n&&this.renderPage();break;case"APPEND":const i=this.state.value.length,s=Math.floor((i-1)/this.size);this.currentPage===s&&this.renderPage();break;default:this.renderPage()}var r}}async function bt(t,e,r,i){if(e.parentNode)if(function(t){return t!==Object(t)}(r))e.textContent=String(r);else if(r&&r instanceof pt&&r.value instanceof Node){let s=e;if(!s.parentNode)return;function a({}){document.contains(s)&&s.parentNode?(r.value instanceof n&&r.value.setContext(i),s.parentNode.replaceChild(r.value,s),s=r.value):r.reactor.removeBinding(a)}r.value instanceof n&&r.value.setContext(i),s.parentNode.replaceChild(r.value,s),s=r.value,r.reactor.addBinding(a)}else if(r&&r instanceof pt){function l({}){document.contains(e)?e.textContent=r.value:r.reactor.removeBinding(l)}e.textContent=r.value,r.reactor.addBinding(l)}else if(Array.isArray(r))e.textContent=r.map(String).join("");else if(r instanceof mt)r.prepare(e.parentElement,i),r.render();else if(r instanceof HTMLElement)e.replaceWith(r);else if(r instanceof o){let c=document.createDocumentFragment();i.renderHelper?.(i,r,c),e.replaceWith(c)}else if(r instanceof NodeList||r instanceof HTMLCollection){if(0===r.length)return void e.remove();const u=document.createDocumentFragment();for(const h of Array.from(r))u.appendChild(h.cloneNode(!0));e.replaceWith(u),e.remove()}else if(r&&"function"==typeof r.toString)try{e.textContent=r.toString()}catch{e.textContent=""}else e.textContent=""}function wt(t){return new o(t)}window.RUMIOUS_JSX={template:wt,createElement:function(...t){throw console.log(t),Error("Rumious doesn't use createElement !")},addDirective:function(t,e,n,r="",i){let s=gt[n];if(!s)throw Error("Rumious: Cannot solve directive !");s(e,t,r,i)},dynamicValue:function(t,e,n,r){bt(0,e,n,r)},createComponent:function(t){let e=t.tagName;return window.customElements.get(e)||window.customElements.define(e,class extends n{static tag=e}),document.createElement(e)}};var Et=Object.freeze({__proto__:null,Fragment:function(...t){throw Error("Fragment element must be compiled by Rumious !")},template:wt}),St=Object.freeze({__proto__:null,RumiousDymanicInjector:a,RumiousRenderTemplate:o,createHTMLInjector:function(t){return new a([t])},createInfinityScroll:function(t){return new yt(t)},createPagination:function(t){return new vt(t)},renderList:function(t,e){return new mt(t,e)}});var Ot=Object.freeze({__proto__:null,RumiousChildrenRef:class{constructor(t){this.target=t}list(){return Array.from(this.target.children)}getChild(t){return this.list()[t]}remove(t){this.list()[t]?.remove()}add(t){this.target.appendChild(t)}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}clear(){this.target.innerHTML=""}replaceChild(t,e){const n=this.getChild(t);n&&this.target.replaceChild(e,n)}insertBefore(t,e){const n=this.getChild(e);n?this.target.insertBefore(t,n):this.add(t)}prepend(t){this.target.prepend(t)}getFirstChild(){return this.list()[0]}getLastChild(){return this.list()[this.list().length-1]}hasChildren(){return this.target.hasChildNodes()}count(){return this.target.children.length}find(t){return this.list().find(t)}forEach(t){this.list().forEach(t)}removeAllMatching(t){this.querySelectorAll(t).forEach((t=>t.remove()))}toggleClass(t){this.list().forEach((e=>e.classList.toggle(t)))}setAttribute(t,e){this.list().forEach((n=>n.setAttribute(t,e)))}},RumiousElementRef:l,createElementRef:function(){return new l(document.createElement("span"))}});class Mt extends pt{constructor(t,e){super(t,e)}set(t,e){if("number"==typeof t&&void 0!==e){const n=t,r=e;this.value[n]=r,this.reactor.emit({type:"SET_BY_KEY",value:r,target:this,key:n})}else{if(!Array.isArray(t))throw new Error("Invalid arguments passed to set()");super.set(t)}}get(t){return"number"==typeof t?this.value[t]:this.value}insert(t,e){return this.value.splice(t,0,e),this.reactor.emit({type:"INSERT_BY_KEY",value:e,target:this,key:t}),this}remove(t){return this.value.splice(t,1),this.reactor.emit({type:"REMOVE_BY_KEY",value:null,target:this,key:t}),this}append(...t){return this.value.push(...t),this.reactor.emit({type:"APPEND",value:t,target:this}),this}prepend(t){return this.value.unshift(t),this.reactor.emit({type:"PREPEND",value:t,target:this}),this}clear(){return this.value.length=0,this.reactor.emit({type:"SET",value:null,target:this}),this}replace(t,e){if(t<0||t>=this.value.length)throw new Error("Index out of bounds");return this.value[t]=e,this.reactor.emit({type:"SET_BY_KEY",value:e,target:this,key:t}),this}filter(t){return this.value=this.value.filter(t),this.reactor.emit({type:"SET",value:null,target:this}),this}map(t){return this.value=this.value.map(t),this.reactor.emit({type:"SET",value:null,target:this}),this}sort(t){return this.value.sort(t),this.reactor.emit({type:"SET",value:null,target:this}),this}reverse(){return this.value.reverse(),this.reactor.emit({type:"SET",value:null,target:this}),this}get length(){return this.value.length}forEach(t){this.value.forEach(t)}}class kt extends pt{#t=!1;constructor(t,e){super(t,e)}set(t,e){if(this.#t)throw new Error("Object is locked");if("string"==typeof t){const n=t,r=e;return this.value[n]=r,this.reactor.emit({type:"SET_BY_KEY",value:r,target:this,key:n}),this}if("object"!=typeof t)throw new Error("Invalid arguments passed to set()");super.set(t)}remove(t){if(this.#t)throw new Error("Object is locked");return t in this.value&&(delete this.value[t],this.reactor.emit({type:"REMOVE_BY_KEY",value:{...this.value},target:this,key:t})),this}merge(t){if(this.#t)throw new Error("Object is locked");return Object.assign(this.value,t),this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}assign(t){if(this.#t)throw new Error("Object is locked");return this.value={...this.value,...t},this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}clear(){if(this.#t)throw new Error("Object is locked");for(const t in this.value)delete this.value[t];return this.reactor.emit({type:"SET",value:{},target:this}),this}get(t){return"string"==typeof t?this.value[t]:this.value}keys(){return Object.keys(this.value)}values(){return Object.values(this.value)}entries(){return Object.entries(this.value)}has(t){return t in this.value}get size(){return Object.keys(this.value).length}forEach(t){Object.entries(this.value).forEach((([e,n])=>{t(n,e,this.value)}))}map(t){const e={};return Object.entries(this.value).forEach((([n,r])=>{e[n]=t(r,n,this.value)})),e}clone(){return JSON.parse(JSON.stringify(this.value))}toJSON(){return JSON.parse(JSON.stringify(this.value))}toObject(){return this.get()}lock(){return this.#t=!0,this}unlock(){return this.#t=!1,this}get isLocked(){return this.#t}freeze(){return Object.freeze(this.value),this}unfreeze(){return this.value=JSON.parse(JSON.stringify(this.value)),this}get isFrozen(){return Object.isFrozen(this.value)}}var Ct=Object.freeze({__proto__:null,RumiousArrayState:Mt,RumiousObjectState:kt,RumiousState:pt,createArrayState:function(t){return new Mt(t)},createObjectState:function(t){return new kt(t)},createState:function(t){return new pt(t)},unwatch:dt,watch:ft});window.RUMIOUS_CONTEXTS={};class jt{constructor(t={}){this.events={},this.values=t}has(t){return t in this.values}set(t,e){this.values[t]=e}get(t){return this.values[t]}on(t,e){this.events[t]||(this.events[t]=[]),this.events[t].push(e)}off(t,e){this.events[t]&&(this.events[t]=this.events[t].filter((t=>t!==e)))}emit(t,e){this.events[t]&&this.events[t].forEach((t=>t(e)))}}const Rt={...r,...s,...Et,...St,...Ot,...Ct,...Object.freeze({__proto__:null,RumiousContext:jt,createContext:function(t,e=function(t="_"){return`${t}${(Math.floor(9999*Math.random())*Date.now()).toString(32)}`}("rctx_")){if(window.RUMIOUS_CONTEXTS[e])return window.RUMIOUS_CONTEXTS[e];{let n=new jt(t);return window.RUMIOUS_CONTEXTS[e]=n,n}}}),...Object.freeze({__proto__:null,denounce:function(t,e){let n;return function(...r){clearTimeout(n),n=setTimeout((()=>t.apply(this,r)),e)}},leadingTrailingDebounce:function(t,e){let n,r=!0;return function(...i){r&&(t.apply(this,i),r=!1),clearTimeout(n),n=setTimeout((()=>{t.apply(this,i),r=!0}),e)}},rafThrottle:function(t){let e=!1;return function(...n){e||(e=!0,requestAnimationFrame((()=>{t.apply(this,n),e=!1})))}},tholle:function(t,e){let n=0;return function(...r){const i=Date.now();i-n>=e&&(n=i,t.apply(this,r))}},trailingThrottle:function(t,e){let n=0,r=null,i=null;function s(){n=Date.now(),t.apply(this,r),r=null}return function(...t){const o=Date.now();r=t,o-n>=e?s.call(this):i||(i=setTimeout((()=>{i=null,s.call(this)}),e-(o-n)))}}})};window.Rumious=Rt}();

package/dist/render/array.d.ts

@@ -2,13 +2,13 @@ import { RumiousRenderTemplate } from './template.js';
 import { RumiousArrayState } from '../state/array.js';
 import { RumiousRenderContext } from './context.js';
 import { RumiousStateCommit } from '../state/reactor.js';
-type RumiousDynamicArrayRenderFn = (item: any, index: any) => RumiousRenderTemplate;
-export declare class RumiousDynamicArrayRenderer<T> {
+type RumiousListRenderFn = (item: any, index: any) => RumiousRenderTemplate;
+export declare class RumiousListRenderer<T> {
     state: RumiousArrayState<T>;
-    callback: RumiousDynamicArrayRenderFn;
+    callback: RumiousListRenderFn;
     anchorElement: HTMLElement;
     context: RumiousRenderContext;
-    constructor(state: RumiousArrayState<T>, callback: RumiousDynamicArrayRenderFn);
+    constructor(state: RumiousArrayState<T>, callback: RumiousListRenderFn);
     prepare(anchor: HTMLElement, context: RumiousRenderContext): void;
     render(): Promise<void>;
     renderAll(): void;
@@ -17,5 +17,5 @@ export declare class RumiousDynamicArrayRenderer<T> {
     removeElement(index: number): void;
     onStateChange(commit: RumiousStateCommit<typeof this.state.value>): Promise<void>;
 }
-export declare function renderDynamicArray<T>(state: RumiousArrayState<T>, callback: RumiousDynamicArrayRenderFn): RumiousDynamicArrayRenderer<T>;
+export declare function renderList<T>(state: RumiousArrayState<T>, callback: RumiousListRenderFn): RumiousListRenderer<T>;
 export {};

package/dist/render/index.d.ts

@@ -1,3 +1,3 @@
 export * from './template.js';
 export * from './injector.js';
-export { renderDynamicArray } from './array.js';
+export { renderList, createInfinityScroll, createPagination } from './struct.js';

package/dist/render/struct.d.ts

@@ -0,0 +1,77 @@
+import { RumiousRenderTemplate } from './template.js';
+import { RumiousArrayState } from '../state/array.js';
+import { RumiousRenderContext } from './context.js';
+import { RumiousStateCommit } from '../state/reactor.js';
+import { RumiousState } from '../state/state.js';
+type RumiousListRenderFn = (item: any, index: any) => RumiousRenderTemplate;
+export declare class RumiousListRenderer<T> {
+    state: RumiousArrayState<T>;
+    callback: RumiousListRenderFn;
+    anchorElement: HTMLElement;
+    context: RumiousRenderContext;
+    constructor(state: RumiousArrayState<T>, callback: RumiousListRenderFn);
+    prepare(anchor: HTMLElement, context: RumiousRenderContext): void;
+    protected renderItem(value: T, index: number): DocumentFragment;
+    protected scheduleRenderAll(): void;
+    render(): Promise<void>;
+    renderAll(): void;
+    updateElement(index: number, value: any): void;
+    insertOrAppendElement(value: any, index: number): void;
+    removeElement(index: number): void;
+    appendElement(values: any, startIndex: number): void;
+    onStateChange(commit: RumiousStateCommit<typeof this.state.value>): Promise<void>;
+}
+export declare function renderList<T>(state: RumiousArrayState<T>, callback: RumiousListRenderFn): RumiousListRenderer<T>;
+export interface RumiousInfinityScrollRenderOptions<T> {
+    data: RumiousArrayState<T>;
+    template: RumiousListRenderFn;
+    loader?: (limit: number, offset: number) => T[] | Promise<T[]>;
+    scrollElement: HTMLElement | Window;
+    state?: RumiousState<string>;
+    limit?: number;
+    offset?: number;
+    threshold: number;
+}
+export declare class RumiousInfinityScrollRenderer<T> extends RumiousListRenderer<T> {
+    options: RumiousInfinityScrollRenderOptions<T>;
+    private limit;
+    private offset;
+    private isLoading;
+    constructor(options: RumiousInfinityScrollRenderOptions<T>);
+    private setState;
+    private fetchData;
+    private getScrollInfo;
+    render(): Promise<void>;
+}
+export declare function createInfinityScroll<T>(options: RumiousInfinityScrollRenderOptions<T>): RumiousInfinityScrollRenderer<T>;
+export interface RumiousPagenationOptions<T> {
+    data: RumiousArrayState<T>;
+    template: RumiousListRenderFn;
+    info?: RumiousState<object>;
+    pages?: RumiousArrayState<{
+        isRender: boolean;
+        index: number;
+    }>;
+    controller: RumiousState<string>;
+    size: number;
+    page?: number;
+}
+export declare class RumiousPagenationRenderer<T> extends RumiousListRenderer<T> {
+    options: RumiousPagenationOptions<T>;
+    private size;
+    private currentPage;
+    constructor(options: RumiousPagenationOptions<T>);
+    private getPageData;
+    private renderPage;
+    goToPage(page: number): void;
+    nextPage(): void;
+    prevPage(): void;
+    onControl({ value }: {
+        value: unknown;
+    }): void;
+    calculate(): Promise<void>;
+    render(): Promise<void>;
+    onStateChange(commit: RumiousStateCommit<typeof this.state.value>): Promise<void>;
+}
+export declare function createPagination<T>(options: RumiousPagenationOptions<T>): RumiousPagenationRenderer<T>;
+export {};

package/dist/state/array.d.ts

@@ -8,7 +8,7 @@ export declare class RumiousArrayState<T> extends RumiousState<T[]> {
     get(): T[];
     insert(index: number, newItem: T): this;
     remove(index: number): this;
-    append(value: T): this;
+    append(...values: T[]): this;
     prepend(value: T): this;
     clear(): this;
     replace(index: number, newItem: T): this;

package/dist/state/reactor.d.ts

@@ -5,7 +5,6 @@ export interface RumiousStateCommit<T> {
     target: RumiousState<T>;
     value: unknown;
     key?: string | number;
-    item?: T extends Array<infer A> ? A : T extends object ? keyof T : unknown;
 }
 export type RumiousBinding<T> = (commit: RumiousStateCommit<T>) => void;
 export declare class RumiousReactor<T> {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "rumious",
-	"version": "1.0.6",
+	"version": "1.0.7",
 	"description": "Simple framework for building UI ",
 	"main": "./dist/index.cjs",
 	"module": "./dist/index.esm.js",