rumious 1.0.11 → 1.0.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs CHANGED
@@ -1 +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 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 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 r{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)}}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,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 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 n=e(t);return n instanceof Promise?n:Promise.resolve(n)}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[n,s]=t.create(this.value);e(n),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,n,s){"string"==typeof s&&(s=t.findName(h(s))),e.addEventListener(n,s)},ref:function(t,e,n,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,n,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,n,s){if("string"==typeof s&&(s=t.findName(h(s))),!(s instanceof c))throw Error("Rumious: bind directive requires RumiousState!");{const t={text:(t,e)=>e.textContent=t,html:(t,e)=>e.innerHTML=t,value:(t,e)=>e.value=t,class:(t,e)=>e.className=t,style:(t,e)=>e.style.cssText=t,checked:(t,e)=>e.checked=t,disabled:(t,e)=>{"disabled"in e&&(e.disabled=t)},readonly:(t,e)=>e.readOnly=t,required:(t,e)=>e.required=t,selected:(t,e)=>e.selected=t,src:(t,e)=>e.src=t,href:(t,e)=>e.href=t,placeholder:(t,e)=>e.placeholder=t,title:(t,e)=>e.title=t,show:(t,e)=>e.style.display=t?"":"none",hide:(t,e)=>e.style.display=t?"none":""}[n]??((t,e)=>e.setAttribute(n,t));t(s.value,e),s.reactor.addBinding((()=>t(s.value,e)))}},model:function(t,e,n,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 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))}}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,this.onScroll=this.handleScroll.bind(this),this.onControl=this.handleControl.bind(this),this.onChange=this.handleStateChange.bind(this)}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 addData(){const t=this.options.scrollElement;this.isLoading=!0,this.setState("START_FETCH");const e=await this.fetchData();this.setState("END_FETCH"),0===e.length?(this.setState("NO_DATA"),t.removeEventListener("scroll",this.onScroll)):this.state.append(...e),this.isLoading=!1}async handleScroll(){const{scrollTop:t,scrollHeight:e,clientHeight:n}=this.getScrollInfo();t+n>=e-this.options.threshold&&!this.isLoading&&await this.addData()}handleControl(){"FETCH"===this.options?.controller?.get()&&this.addData()}handleStateChange(t){if(!document.contains(this.anchorElement))return this.options.controller&&d(this.options.controller,this.onControl),void this.state.reactor.removeBinding(this.onChange);this.onStateChange(t)}async render(){this.options.scrollElement.addEventListener("scroll",this.onScroll),this.options.controller&&u(this.options.controller,this.onControl),this.state.reactor.addBinding(this.onChange),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,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(){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,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}}async function v(t,e,n,r){if(e.parentNode)if(function(t){return t!==Object(t)}(n))e.textContent=String(n);else if(n&&n instanceof c&&n.value instanceof Node){let o=e;if(!o.parentNode)return;function a({}){document.contains(o)&&o.parentNode?(n.value instanceof s&&n.value.setContext(r),o.parentNode.replaceChild(n.value,o),o=n.value):n.reactor.removeBinding(a)}n.value instanceof s&&n.value.setContext(r),o.parentNode.replaceChild(n.value,o),o=n.value,n.reactor.addBinding(a)}else if(n&&n instanceof c){function h({}){document.contains(e)?e.textContent=n.value:n.reactor.removeBinding(h)}e.textContent=n.value,n.reactor.addBinding(h)}else if(Array.isArray(n))e.textContent=n.map(String).join("");else if(n instanceof m)n.prepare(e.parentElement,r),n.render();else if(n instanceof HTMLElement)e.replaceWith(n);else if(n instanceof i){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 u=document.createDocumentFragment();for(const d of Array.from(n))u.appendChild(d.cloneNode(!0));e.replaceWith(u),e.remove()}else if(n&&"function"==typeof n.toString)try{e.textContent=n.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,n,s="",r){let i=g[n];if(!i)throw Error("Rumious: Cannot solve directive !");i(e,t,s,r)},dynamicValue:function(t,e,n,s){v(0,e,n,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 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)}}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 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)}}window.RUMIOUS_CONTEXTS={};class S{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=r,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 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)))}},exports.RumiousComponent=class{static classNames="";static tagName="rumious-component";constructor(){this.renderOptions={mode:"idle"}}render(t){let e=document.createDocumentFragment();return n(this.context,t,e),e}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(){}},exports.RumiousComponentElement=s,exports.RumiousContext=S,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 r(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 n=new S(t);return window.RUMIOUS_CONTEXTS[e]=n,n}},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 n;return function(...s){clearTimeout(n),n=setTimeout((()=>t.apply(this,s)),e)}},exports.leadingTrailingDebounce=function(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)}},exports.rafThrottle=function(t){let e=!1;return function(...n){e||(e=!0,requestAnimationFrame((()=>{t.apply(this,n),e=!1})))}},exports.renderComponent=function(t,e){let n=window.RUMIOUS_JSX.createComponent(t);return n.props=e,n.setComponent(t),n},exports.renderList=function(t,e){return new m(t,e)},exports.template=E,exports.tholle=function(t,e){let n=0;return function(...s){const r=Date.now();r-n>=e&&(n=r,t.apply(this,s))}},exports.trailingThrottle=function(t,e){let n=0,s=null,r=null;function i(){n=Date.now(),t.apply(this,s),s=null}return function(...t){const o=Date.now();s=t,o-n>=e?i.call(this):r||(r=setTimeout((()=>{r=null,i.call(this)}),e-(o-n)))}},exports.unwatch=d,exports.watch=u;
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 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 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 r{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)}}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,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 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 n=e(t);return n instanceof Promise?n:Promise.resolve(n)}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[n,s]=t.create(this.value);e(n),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,n,s){"string"==typeof s&&(s=t.findName(h(s))),e.addEventListener(n,s)},ref:function(t,e,n,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,n,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,n,s){if("string"==typeof s&&(s=t.findName(h(s))),!(s instanceof c))throw Error("Rumious: bind directive requires RumiousState!");{const t={text:(t,e)=>e.textContent=t,html:(t,e)=>e.innerHTML=t,value:(t,e)=>e.value=t,class:(t,e)=>e.className=t,style:(t,e)=>e.style.cssText=t,checked:(t,e)=>e.checked=t,disabled:(t,e)=>{"disabled"in e&&(e.disabled=t)},readonly:(t,e)=>e.readOnly=t,required:(t,e)=>e.required=t,selected:(t,e)=>e.selected=t,src:(t,e)=>e.src=t,href:(t,e)=>e.href=t,placeholder:(t,e)=>e.placeholder=t,title:(t,e)=>e.title=t,show:(t,e)=>e.style.display=t?"":"none",hide:(t,e)=>e.style.display=t?"none":""}[n]??((t,e)=>e.setAttribute(n,t));t(s.value,e),s.reactor.addBinding((()=>t(s.value,e)))}},model:function(t,e,n,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 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))}}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,this.onScroll=this.handleScroll.bind(this),this.onControl=this.handleControl.bind(this),this.onChange=this.handleStateChange.bind(this)}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 addData(){const t=this.options.scrollElement;this.isLoading=!0,this.setState("START_FETCH");const e=await this.fetchData();this.setState("END_FETCH"),0===e.length?(this.setState("NO_DATA"),t.removeEventListener("scroll",this.onScroll)):this.state.append(...e),this.isLoading=!1}async handleScroll(){const{scrollTop:t,scrollHeight:e,clientHeight:n}=this.getScrollInfo();t+n>=e-this.options.threshold&&!this.isLoading&&await this.addData()}handleControl(){"FETCH"===this.options?.controller?.get()&&this.addData()}handleStateChange(t){if(!document.contains(this.anchorElement))return this.options.controller&&d(this.options.controller,this.onControl),void this.state.reactor.removeBinding(this.onChange);this.onStateChange(t)}async render(){this.options.scrollElement.addEventListener("scroll",this.onScroll),this.options.controller&&u(this.options.controller,this.onControl),this.state.reactor.addBinding(this.onChange),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,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(){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,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 v(t){return t!==Object(t)}async function E(t,e,n,r){if(e.parentNode)if(v(n))!function(t,e){t.textContent=String(e)}(e,n);else if(n instanceof c&&n.value instanceof Node)!function(t,e,n){let r=t;const i=()=>{if(!document.contains(r))return void e.reactor.removeBinding(i);const t=e.value;t instanceof s&&t.setContext(n),r.parentNode?.replaceChild(t,r),r=t};i(),e.reactor.addBinding(i)}(e,n,r);else if(n instanceof c)!function(t,e){const n=()=>{document.contains(t)?t.textContent=String(e.value):e.reactor.removeBinding(n)};n(),e.reactor.addBinding(n)}(e,n);else if(Array.isArray(n))!function(t,e,n){const s=document.createDocumentFragment();for(const t of e)t instanceof i?n.renderHelper?.(n,t,s):v(t)?s.appendChild(document.createTextNode(String(t))):t instanceof Node&&s.appendChild(t.cloneNode(!0));t.replaceWith(s)}(e,n,r);else if(n instanceof m)n.prepare(e.parentElement,r),n.render(),e.remove();else if(n instanceof HTMLElement)e.replaceWith(n);else if(n instanceof i)!function(t,e,n){const s=document.createDocumentFragment();n.renderHelper?.(n,e,s),t.replaceWith(s)}(e,n,r);else if(n instanceof NodeList||n instanceof HTMLCollection)n.length>0?function(t,e){const n=document.createDocumentFragment();for(const t of Array.from(e))n.appendChild(t.cloneNode(!0));t.replaceWith(n)}(e,n):e.remove();else if(n&&"function"==typeof n.toString)try{e.textContent=n.toString()}catch{e.textContent=""}else e.textContent=""}function y(t){return new i(t)}window.RUMIOUS_JSX={template:y,createElement:function(...t){throw console.log(t),Error("Rumious doesn't use createElement !")},addDirective:function(t,e,n,s="",r){let i=g[n];if(!i)throw Error("Rumious: Cannot solve directive !");i(e,t,s,r)},dynamicValue:function(t,e,n,s){E(0,e,n,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 C extends c{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)}}class S 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 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)}}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=r,exports.RumiousArrayState=C,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 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)))}},exports.RumiousComponent=class{static classNames="";static tagName="rumious-component";constructor(){this.renderOptions={mode:"idle"}}render(t){let e=document.createDocumentFragment();return n(this.context,t,e),e}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(){}},exports.RumiousComponentElement=s,exports.RumiousContext=w,exports.RumiousDymanicInjector=o,exports.RumiousElementRef=a,exports.RumiousModule=class{},exports.RumiousObjectState=S,exports.RumiousRenderTemplate=i,exports.RumiousState=c,exports.createApp=function(t,e){return new r(t,e)},exports.createArrayState=function(t){return new C(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 n=new w(t);return window.RUMIOUS_CONTEXTS[e]=n,n}},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 S(t)},exports.createPagination=function(t){return new f(t)},exports.createState=function(t){return new c(t)},exports.denounce=function(t,e){let n;return function(...s){clearTimeout(n),n=setTimeout((()=>t.apply(this,s)),e)}},exports.leadingTrailingDebounce=function(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)}},exports.rafThrottle=function(t){let e=!1;return function(...n){e||(e=!0,requestAnimationFrame((()=>{t.apply(this,n),e=!1})))}},exports.renderComponent=function(t,e){let n=window.RUMIOUS_JSX.createComponent(t);return n.props=e,n.setComponent(t),n},exports.renderList=function(t,e){return new m(t,e)},exports.template=y,exports.tholle=function(t,e){let n=0;return function(...s){const r=Date.now();r-n>=e&&(n=r,t.apply(this,s))}},exports.trailingThrottle=function(t,e){let n=0,s=null,r=null;function i(){n=Date.now(),t.apply(this,s),s=null}return function(...t){const o=Date.now();s=t,o-n>=e?i.call(this):r||(r=setTimeout((()=>{r=null,i.call(this)}),e-(o-n)))}},exports.unwatch=d,exports.watch=u;
package/dist/index.esm.js CHANGED
@@ -1 +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,s){let i=e.generator.bind(t.target);t.renderHelper=n,i(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"}}render(t){let e=document.createDocumentFragment();return n(this.context,t,e),e}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 r(t,e){let n=window.RUMIOUS_JSX.createComponent(t);return n.props=e,n.setComponent(t),n}class o{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 a(t,e){return new o(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 requires RumiousState!");{const t={text:(t,e)=>e.textContent=t,html:(t,e)=>e.innerHTML=t,value:(t,e)=>e.value=t,class:(t,e)=>e.className=t,style:(t,e)=>e.style.cssText=t,checked:(t,e)=>e.checked=t,disabled:(t,e)=>{"disabled"in e&&(e.disabled=t)},readonly:(t,e)=>e.readOnly=t,required:(t,e)=>e.required=t,selected:(t,e)=>e.selected=t,src:(t,e)=>e.src=t,href:(t,e)=>e.href=t,placeholder:(t,e)=>e.placeholder=t,title:(t,e)=>e.title=t,show:(t,e)=>e.style.display=t?"":"none",hide:(t,e)=>e.style.display=t?"none":""}[n]??((t,e)=>e.setAttribute(n,t));t(s.value,e),s.reactor.addBinding((()=>t(s.value,e)))}},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,this.onScroll=this.handleScroll.bind(this),this.onControl=this.handleControl.bind(this),this.onChange=this.handleStateChange.bind(this)}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 addData(){const t=this.options.scrollElement;this.isLoading=!0,this.setState("START_FETCH");const e=await this.fetchData();this.setState("END_FETCH"),0===e.length?(this.setState("NO_DATA"),t.removeEventListener("scroll",this.onScroll)):this.state.append(...e),this.isLoading=!1}async handleScroll(){const{scrollTop:t,scrollHeight:e,clientHeight:n}=this.getScrollInfo();t+n>=e-this.options.threshold&&!this.isLoading&&await this.addData()}handleControl(){"FETCH"===this.options?.controller?.get()&&this.addData()}handleStateChange(t){if(!document.contains(this.anchorElement))return this.options.controller&&E(this.options.controller,this.onControl),void this.state.reactor.removeBinding(this.onChange);this.onStateChange(t)}async render(){this.options.scrollElement.addEventListener("scroll",this.onScroll),this.options.controller&&v(this.options.controller,this.onControl),this.state.reactor.addBinding(this.onChange),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 i=this.state.value.length,r=Math.floor((i-1)/this.size);this.currentPage===r&&this.renderPage();break;default:this.renderPage()}var s}}function k(t){return new N(t)}async function x(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 r=e;if(!r.parentNode)return;function o({}){document.contains(r)&&r.parentNode?(n.value instanceof i&&n.value.setContext(s),r.parentNode.replaceChild(n.value,r),r=n.value):n.reactor.removeBinding(o)}n.value instanceof i&&n.value.setContext(s),r.parentNode.replaceChild(n.value,r),r=n.value,n.reactor.addBinding(o)}else if(n&&n instanceof f){function a({}){document.contains(e)?e.textContent=n.value:n.reactor.removeBinding(a)}e.textContent=n.value,n.reactor.addBinding(a)}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 A(t){return new l(t)}const R=function(...t){throw Error("Fragment element must be compiled by Rumious !")};window.RUMIOUS_JSX={template:A,createElement:function(...t){throw console.log(t),Error("Rumious doesn't use createElement !")},addDirective:function(t,e,n,s="",i){let r=C[n];if(!r)throw Error("Rumious: Cannot solve directive !");r(e,t,s,i)},dynamicValue:function(t,e,n,s){x(0,e,n,s)},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 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 i=Date.now();i-n>=e&&(n=i,t.apply(this,s))}}function j(t,e){let n;return function(...s){clearTimeout(n),n=setTimeout((()=>t.apply(this,s)),e)}}function D(t,e){let n=0,s=null,i=null;function r(){n=Date.now(),t.apply(this,s),s=null}return function(...t){const o=Date.now();s=t,o-n>=e?r.call(this):i||(i=setTimeout((()=>{i=null,r.call(this)}),e-(o-n)))}}function Y(t,e){let n,s=!0;return function(...i){s&&(t.apply(this,i),s=!1),clearTimeout(n),n=setTimeout((()=>{t.apply(this,i),s=!0}),e)}}function q(t){let e=!1;return function(...n){e||(e=!0,requestAnimationFrame((()=>{t.apply(this,n),e=!1})))}}export{R as Fragment,o as RumiousApp,O as RumiousArrayState,P as RumiousChildrenRef,s as RumiousComponent,i as RumiousComponentElement,B as RumiousContext,c as RumiousDymanicInjector,d as RumiousElementRef,h as RumiousModule,M as RumiousObjectState,l as RumiousRenderTemplate,f as RumiousState,a as createApp,L as createArrayState,I as createContext,g as createElementRef,u as createHTMLInjector,T as createInfinityScroll,H as createObjectState,k as createPagination,y as createState,j as denounce,Y as leadingTrailingDebounce,q as rafThrottle,r as renderComponent,S as renderList,A as template,_ as tholle,D as trailingThrottle,E as unwatch,v as watch};
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,s){let i=e.generator.bind(t.target);t.renderHelper=n,i(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"}}render(t){let e=document.createDocumentFragment();return n(this.context,t,e),e}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 r(t,e){let n=window.RUMIOUS_JSX.createComponent(t);return n.props=e,n.setComponent(t),n}class o{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 a(t,e){return new o(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 requires RumiousState!");{const t={text:(t,e)=>e.textContent=t,html:(t,e)=>e.innerHTML=t,value:(t,e)=>e.value=t,class:(t,e)=>e.className=t,style:(t,e)=>e.style.cssText=t,checked:(t,e)=>e.checked=t,disabled:(t,e)=>{"disabled"in e&&(e.disabled=t)},readonly:(t,e)=>e.readOnly=t,required:(t,e)=>e.required=t,selected:(t,e)=>e.selected=t,src:(t,e)=>e.src=t,href:(t,e)=>e.href=t,placeholder:(t,e)=>e.placeholder=t,title:(t,e)=>e.title=t,show:(t,e)=>e.style.display=t?"":"none",hide:(t,e)=>e.style.display=t?"none":""}[n]??((t,e)=>e.setAttribute(n,t));t(s.value,e),s.reactor.addBinding((()=>t(s.value,e)))}},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,this.onScroll=this.handleScroll.bind(this),this.onControl=this.handleControl.bind(this),this.onChange=this.handleStateChange.bind(this)}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 addData(){const t=this.options.scrollElement;this.isLoading=!0,this.setState("START_FETCH");const e=await this.fetchData();this.setState("END_FETCH"),0===e.length?(this.setState("NO_DATA"),t.removeEventListener("scroll",this.onScroll)):this.state.append(...e),this.isLoading=!1}async handleScroll(){const{scrollTop:t,scrollHeight:e,clientHeight:n}=this.getScrollInfo();t+n>=e-this.options.threshold&&!this.isLoading&&await this.addData()}handleControl(){"FETCH"===this.options?.controller?.get()&&this.addData()}handleStateChange(t){if(!document.contains(this.anchorElement))return this.options.controller&&E(this.options.controller,this.onControl),void this.state.reactor.removeBinding(this.onChange);this.onStateChange(t)}async render(){this.options.scrollElement.addEventListener("scroll",this.onScroll),this.options.controller&&v(this.options.controller,this.onControl),this.state.reactor.addBinding(this.onChange),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 i=this.state.value.length,r=Math.floor((i-1)/this.size);this.currentPage===r&&this.renderPage();break;default:this.renderPage()}var s}}function k(t){return new N(t)}function x(t){return t!==Object(t)}async function A(t,e,n,s){if(e.parentNode)if(x(n))!function(t,e){t.textContent=String(e)}(e,n);else if(n instanceof f&&n.value instanceof Node)!function(t,e,n){let s=t;const r=()=>{if(!document.contains(s))return void e.reactor.removeBinding(r);const t=e.value;t instanceof i&&t.setContext(n),s.parentNode?.replaceChild(t,s),s=t};r(),e.reactor.addBinding(r)}(e,n,s);else if(n instanceof f)!function(t,e){const n=()=>{document.contains(t)?t.textContent=String(e.value):e.reactor.removeBinding(n)};n(),e.reactor.addBinding(n)}(e,n);else if(Array.isArray(n))!function(t,e,n){const s=document.createDocumentFragment();for(const t of e)t instanceof l?n.renderHelper?.(n,t,s):x(t)?s.appendChild(document.createTextNode(String(t))):t instanceof Node&&s.appendChild(t.cloneNode(!0));t.replaceWith(s)}(e,n,s);else if(n instanceof w)n.prepare(e.parentElement,s),n.render(),e.remove();else if(n instanceof HTMLElement)e.replaceWith(n);else if(n instanceof l)!function(t,e,n){const s=document.createDocumentFragment();n.renderHelper?.(n,e,s),t.replaceWith(s)}(e,n,s);else if(n instanceof NodeList||n instanceof HTMLCollection)n.length>0?function(t,e){const n=document.createDocumentFragment();for(const t of Array.from(e))n.appendChild(t.cloneNode(!0));t.replaceWith(n)}(e,n):e.remove();else if(n&&"function"==typeof n.toString)try{e.textContent=n.toString()}catch{e.textContent=""}else e.textContent=""}function R(t){return new l(t)}const P=function(...t){throw Error("Fragment element must be compiled by Rumious !")};window.RUMIOUS_JSX={template:R,createElement:function(...t){throw console.log(t),Error("Rumious doesn't use createElement !")},addDirective:function(t,e,n,s="",i){let r=C[n];if(!r)throw Error("Rumious: Cannot solve directive !");r(e,t,s,i)},dynamicValue:function(t,e,n,s){A(0,e,n,s)},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 O{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 L 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 H(t){return new L(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 B(t){return new M(t)}window.RUMIOUS_CONTEXTS={};class I{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 _(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 I(t);return window.RUMIOUS_CONTEXTS[e]=n,n}}function D(t,e){let n=0;return function(...s){const i=Date.now();i-n>=e&&(n=i,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,i=null;function r(){n=Date.now(),t.apply(this,s),s=null}return function(...t){const o=Date.now();s=t,o-n>=e?r.call(this):i||(i=setTimeout((()=>{i=null,r.call(this)}),e-(o-n)))}}function q(t,e){let n,s=!0;return function(...i){s&&(t.apply(this,i),s=!1),clearTimeout(n),n=setTimeout((()=>{t.apply(this,i),s=!0}),e)}}function z(t){let e=!1;return function(...n){e||(e=!0,requestAnimationFrame((()=>{t.apply(this,n),e=!1})))}}export{P as Fragment,o as RumiousApp,L as RumiousArrayState,O as RumiousChildrenRef,s as RumiousComponent,i as RumiousComponentElement,I as RumiousContext,c as RumiousDymanicInjector,d as RumiousElementRef,h as RumiousModule,M as RumiousObjectState,l as RumiousRenderTemplate,f as RumiousState,a as createApp,H as createArrayState,_ as createContext,g as createElementRef,u as createHTMLInjector,T as createInfinityScroll,B as createObjectState,k as createPagination,y as createState,j as denounce,q as leadingTrailingDebounce,z as rafThrottle,r as renderComponent,S as renderList,R as template,D as tholle,Y as trailingThrottle,E as unwatch,v as watch};
package/dist/index.min.js CHANGED
@@ -1 +1 @@
1
- !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"}}render(t){let n=document.createDocumentFragment();return e(this.context,t,n),n}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!!C(t)}function C(t){return"object"!=typeof t?null:null==t?void 0:t[d]}function k(t){var e;const n=C(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 T(t,e=[]){if(Object.hasOwnProperty.call(t,"key")){const n=t.parent.copy,r=C(P(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 T(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=P(3===R(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 R(t){return Array.isArray(t)?1:t instanceof Map?2:t instanceof Set?3:0}function P(t,e){return 2===R(t)?t.get(e):t[e]}function A(t,e,n){2===R(t)?t.set(e,n):t[e]=n}function _(t,e){const n=C(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 k(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(R(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=R(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=C(o);L(e);const n=(null===(a=e.assignedMap)||void 0===a?void 0:a.size)||e.operated?e.copy:e.original;A(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(P(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(k(e))})))}function $(t,e,n,r){if(t.operated&&t.assignedMap&&t.assignedMap.size>0&&!t.finalized){if(n&&r){const i=T(t);i&&e(t,i,n,r)}t.finalized=!0}}function J(t,e,n,r){const i=C(n);i&&(i.callbacks||(i.callbacks=[]),i.callbacks.push(((s,o)=>{var a;const l=3===t.type?t.setMap:t.copy;if(x(P(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)),A(l,e,n)}})),t.options.enableAutoFreeze&&i.finalities!==t.finalities&&(t.options.enableAutoFreeze=!1)),j(n,t.options)&&t.finalities.draft.push((()=>{x(P(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=P(t,a),c=B(P(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(C(this)).size},has(t){return O(C(this)).has(t)},set(t,e){const n=C(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=C(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=C(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(C(this)).forEach(((n,r)=>{t.call(e,this.get(r),r,this)}))},get(t){var e,n;const r=C(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(C(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=C(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 C(this).setMap.size},has(t){const e=C(this);if(e.setMap.has(t))return!0;L(e);const n=C(t);return!(!n||!e.setMap.has(n.original))},add(t){const e=C(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=C(this);L(e),F(e);const n=C(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=C(this);L(t),F(t);for(const e of t.original)t.assignedMap.set(e,!1);t.setMap.clear()},values(){const t=C(this);L(t);const e=t.setMap.keys();return{[Symbol.iterator]:()=>this.values(),next:tt(t,e,{isValuesIterator:!0})}},entries(){const t=C(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=C(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=C(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=R(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=C(l);let a=3===t.type?t.setMap:t.copy;const c=P(a,r),u=C(c);if(u){let s=u.original;u.operated&&(s=k(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)),A(a,r,s)}null===(s=o.callbacks)||void 0===s||s.forEach((t=>{t(e,n)}))}))}else{const t=C(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=C(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=C(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 A(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=C(t);if(!j(t,null==n?void 0:n.options))return t;const r=R(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(P(n.original,e),r))return;const o=lt(r);o!==r&&(i===t&&s(),A(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(C(m)),t}const w=t=>{const e=C(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=C(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(C(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 requires RumiousState!");{const t={text:(t,e)=>e.textContent=t,html:(t,e)=>e.innerHTML=t,value:(t,e)=>e.value=t,class:(t,e)=>e.className=t,style:(t,e)=>e.style.cssText=t,checked:(t,e)=>e.checked=t,disabled:(t,e)=>{"disabled"in e&&(e.disabled=t)},readonly:(t,e)=>e.readOnly=t,required:(t,e)=>e.required=t,selected:(t,e)=>e.selected=t,src:(t,e)=>e.src=t,href:(t,e)=>e.href=t,placeholder:(t,e)=>e.placeholder=t,title:(t,e)=>e.title=t,show:(t,e)=>e.style.display=t?"":"none",hide:(t,e)=>e.style.display=t?"none":""}[n]??((t,e)=>e.setAttribute(n,t));t(r.value,e),r.reactor.addBinding((()=>t(r.value,e)))}},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,this.onScroll=this.handleScroll.bind(this),this.onControl=this.handleControl.bind(this),this.onChange=this.handleStateChange.bind(this)}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 addData(){const t=this.options.scrollElement;this.isLoading=!0,this.setState("START_FETCH");const e=await this.fetchData();this.setState("END_FETCH"),0===e.length?(this.setState("NO_DATA"),t.removeEventListener("scroll",this.onScroll)):this.state.append(...e),this.isLoading=!1}async handleScroll(){const{scrollTop:t,scrollHeight:e,clientHeight:n}=this.getScrollInfo();t+n>=e-this.options.threshold&&!this.isLoading&&await this.addData()}handleControl(){"FETCH"===this.options?.controller?.get()&&this.addData()}handleStateChange(t){if(!document.contains(this.anchorElement))return this.options.controller&&dt(this.options.controller,this.onControl),void this.state.reactor.removeBinding(this.onChange);this.onStateChange(t)}async render(){this.options.scrollElement.addEventListener("scroll",this.onScroll),this.options.controller&&ft(this.options.controller,this.onControl),this.state.reactor.addBinding(this.onChange),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 Ct 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 kt=Object.freeze({__proto__:null,RumiousArrayState:Mt,RumiousObjectState:Ct,RumiousState:pt,createArrayState:function(t){return new Mt(t)},createObjectState:function(t){return new Ct(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 Tt={...r,...s,...Et,...St,...Ot,...kt,...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=Tt}();
1
+ !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"}}render(t){let n=document.createDocumentFragment();return e(this.context,t,n),n}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 T(t,e=[]){if(Object.hasOwnProperty.call(t,"key")){const n=t.parent.copy,r=k(P(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 T(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=P(3===R(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 R(t){return Array.isArray(t)?1:t instanceof Map?2:t instanceof Set?3:0}function P(t,e){return 2===R(t)?t.get(e):t[e]}function A(t,e,n){2===R(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(R(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=R(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;A(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(P(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=T(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(P(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)),A(l,e,n)}})),t.options.enableAutoFreeze&&i.finalities!==t.finalities&&(t.options.enableAutoFreeze=!1)),j(n,t.options)&&t.finalities.draft.push((()=>{x(P(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=P(t,a),c=B(P(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=R(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=P(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)),A(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 A(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=R(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(P(n.original,e),r))return;const o=lt(r);o!==r&&(i===t&&s(),A(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 requires RumiousState!");{const t={text:(t,e)=>e.textContent=t,html:(t,e)=>e.innerHTML=t,value:(t,e)=>e.value=t,class:(t,e)=>e.className=t,style:(t,e)=>e.style.cssText=t,checked:(t,e)=>e.checked=t,disabled:(t,e)=>{"disabled"in e&&(e.disabled=t)},readonly:(t,e)=>e.readOnly=t,required:(t,e)=>e.required=t,selected:(t,e)=>e.selected=t,src:(t,e)=>e.src=t,href:(t,e)=>e.href=t,placeholder:(t,e)=>e.placeholder=t,title:(t,e)=>e.title=t,show:(t,e)=>e.style.display=t?"":"none",hide:(t,e)=>e.style.display=t?"none":""}[n]??((t,e)=>e.setAttribute(n,t));t(r.value,e),r.reactor.addBinding((()=>t(r.value,e)))}},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,this.onScroll=this.handleScroll.bind(this),this.onControl=this.handleControl.bind(this),this.onChange=this.handleStateChange.bind(this)}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 addData(){const t=this.options.scrollElement;this.isLoading=!0,this.setState("START_FETCH");const e=await this.fetchData();this.setState("END_FETCH"),0===e.length?(this.setState("NO_DATA"),t.removeEventListener("scroll",this.onScroll)):this.state.append(...e),this.isLoading=!1}async handleScroll(){const{scrollTop:t,scrollHeight:e,clientHeight:n}=this.getScrollInfo();t+n>=e-this.options.threshold&&!this.isLoading&&await this.addData()}handleControl(){"FETCH"===this.options?.controller?.get()&&this.addData()}handleStateChange(t){if(!document.contains(this.anchorElement))return this.options.controller&&dt(this.options.controller,this.onControl),void this.state.reactor.removeBinding(this.onChange);this.onStateChange(t)}async render(){this.options.scrollElement.addEventListener("scroll",this.onScroll),this.options.controller&&ft(this.options.controller,this.onControl),this.state.reactor.addBinding(this.onChange),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}}function bt(t){return t!==Object(t)}async function wt(t,e,r,i){if(e.parentNode)if(bt(r))!function(t,e){t.textContent=String(e)}(e,r);else if(r instanceof pt&&r.value instanceof Node)!function(t,e,r){let i=t;const s=()=>{if(!document.contains(i))return void e.reactor.removeBinding(s);const t=e.value;t instanceof n&&t.setContext(r),i.parentNode?.replaceChild(t,i),i=t};s(),e.reactor.addBinding(s)}(e,r,i);else if(r instanceof pt)!function(t,e){const n=()=>{document.contains(t)?t.textContent=String(e.value):e.reactor.removeBinding(n)};n(),e.reactor.addBinding(n)}(e,r);else if(Array.isArray(r))!function(t,e,n){const r=document.createDocumentFragment();for(const t of e)t instanceof o?n.renderHelper?.(n,t,r):bt(t)?r.appendChild(document.createTextNode(String(t))):t instanceof Node&&r.appendChild(t.cloneNode(!0));t.replaceWith(r)}(e,r,i);else if(r instanceof mt)r.prepare(e.parentElement,i),r.render(),e.remove();else if(r instanceof HTMLElement)e.replaceWith(r);else if(r instanceof o)!function(t,e,n){const r=document.createDocumentFragment();n.renderHelper?.(n,e,r),t.replaceWith(r)}(e,r,i);else if(r instanceof NodeList||r instanceof HTMLCollection)r.length>0?function(t,e){const n=document.createDocumentFragment();for(const t of Array.from(e))n.appendChild(t.cloneNode(!0));t.replaceWith(n)}(e,r):e.remove();else if(r&&"function"==typeof r.toString)try{e.textContent=r.toString()}catch{e.textContent=""}else e.textContent=""}function Et(t){return new o(t)}window.RUMIOUS_JSX={template:Et,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){wt(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 St=Object.freeze({__proto__:null,Fragment:function(...t){throw Error("Fragment element must be compiled by Rumious !")},template:Et}),Ot=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 Mt=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 kt 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 Ct 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 jt=Object.freeze({__proto__:null,RumiousArrayState:kt,RumiousObjectState:Ct,RumiousState:pt,createArrayState:function(t){return new kt(t)},createObjectState:function(t){return new Ct(t)},createState:function(t){return new pt(t)},unwatch:dt,watch:ft});window.RUMIOUS_CONTEXTS={};class Tt{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,...St,...Ot,...Mt,...jt,...Object.freeze({__proto__:null,RumiousContext:Tt,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 Tt(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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "rumious",
3
- "version": "1.0.11",
3
+ "version": "1.0.12",
4
4
  "description": "Simple framework for building UI ",
5
5
  "main": "./dist/index.cjs",
6
6
  "module": "./dist/index.esm.js",