rumious 1.0.4 → 1.0.5

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 r(t,e,n){let s=e.generator.bind(t.target);t.renderHelper=r,s(n,t),setTimeout((async()=>{const e=[...t.onRenderFinished];t.onRenderFinished=[];for(const t of e)await t()}),0)}class n extends HTMLElement{constructor(){super(),this.props={}}setContext(t){this.context=t}setComponent(t){this.componentConstructor=t}setup(t,e){this.context=t,this.componentConstructor=e}connectedCallback(){this.componentConstructor?(this.componentInstance=new this.componentConstructor,this.componentInstance.element=this,this.componentConstructor.classNames&&(this.className=this.componentConstructor.classNames),this.componentInstance.prepare(this.context,this.props),this.componentInstance.onCreate(),this.componentInstance.requestRender()):console.warn("Rumious: Cannot find matching component constructor.")}disconnectedCallback(){this.componentInstance?.onDestroy()}}class s{constructor(t,r={}){this.root=t,this.options=r,this.modules=[],this.context=new e(this,this)}addModule(t,e){const r=t.init(this,e);return this.modules.push(r),r}render(t){r(this.context,t,this.root)}}class i{constructor(t){this.generator=t}}class o{constructor(t){if(this.contents=t,this.targets=new Map,!t||0===t.length)throw new Error("Injector must be initialized with non-empty content");const e=t[0];this.type="string"==typeof e?"string":"element"}commit(t){this.contents=t;const e=t[0];this.type="string"==typeof e?"string":"element"}addTarget(t){this.targets.set(t,1)}inject(t){if(this.targets.has(t)&&this.contents)if(t.innerHTML="","string"===this.type)for(const e of this.contents)t.insertAdjacentHTML("beforeend",e);else for(const e of this.contents)t.appendChild(e)}injectAll(){for(const t of this.targets.keys())this.inject(t)}removeTarget(t){this.targets.delete(t)}clear(){this.targets.clear()}}class a{constructor(t){this.target=t}getElement(){return this.target}remove(){this.target.remove()}addChild(t){this.target.appendChild(t)}listChild(){return this.target.childNodes}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}set text(t){this.target.textContent=t}get text(){return this.target.textContent}set value(t){(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.value=t)}get value(){if(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)return this.target.value}addClassName(t){this.target.classList.add(t)}removeClassName(t){this.target.classList.remove(t)}hasClassName(t){return this.target.classList.contains(t)}toggleClass(t,e){return this.target.classList.toggle(t,e)}setStyle(t){Object.assign(this.target.style,t)}getStyle(t){return getComputedStyle(this.target).getPropertyValue(t)}setAttribute(t,e){this.target.setAttribute(t,e)}getAttribute(t){return this.target.getAttribute(t)}removeAttribute(t){this.target.removeAttribute(t)}on(t,e,r){this.target.addEventListener(t,e,r)}off(t,e,r){this.target.removeEventListener(t,e,r)}set html(t){this.target.innerHTML=t}get html(){return this.target.innerHTML}getBoundingRect(){return this.target.getBoundingClientRect()}isInViewport(){const t=this.target.getBoundingClientRect();return t.top>=0&&t.left>=0&&t.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&t.right<=(window.innerWidth||document.documentElement.clientWidth)}prependChild(t){this.target.prepend(t)}setDisabled(t){(this.target instanceof HTMLButtonElement||this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.disabled=t)}addClasses(...t){this.target.classList.add(...t)}removeClasses(...t){this.target.classList.remove(...t)}replaceClass(t,e){this.target.classList.replace(t,e)}moveTo(t){t.appendChild(this.target)}getParent(){return this.target.parentElement}getNextSibling(){return this.target.nextElementSibling}getPreviousSibling(){return this.target.previousElementSibling}hide(){this.target.style.display="none"}show(){this.target.style.removeProperty("display")}isHidden(){return"none"===window.getComputedStyle(this.target).display}scrollIntoView(t={behavior:"smooth"}){this.target.scrollIntoView(t)}matches(t){return this.target.matches(t)}getChildren(){return Array.from(this.target.children)}insertAfter(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target.nextSibling)}insertBefore(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target)}clearChildren(){for(;this.target.firstChild;)this.target.removeChild(this.target.firstChild)}animate(t,e){return this.target.animate(t,e)}}function c(t){const e=t.indexOf("$");return-1!==e?t.slice(e+1):""}class h{constructor(t){this.target=t,this.bindings=[]}addBinding(t){this.bindings.push(t)}removeBinding(t){this.bindings=this.bindings.filter((e=>e!==t))}async emit(t){await Promise.allSettled(this.bindings.map((e=>{try{const r=e(t);return r instanceof Promise?r:Promise.resolve(r)}catch(t){return Promise.reject(t)}})))}}class l{constructor(t,e){this.value=t,this.reactor=e??new h(this)}set(t){this.value=t,this.reactor.emit({type:"SET",target:this,value:t})}get(){return this.value}increase(t=1){"number"==typeof this.value&&this.set(this.value+t)}produce(e){const[r,n]=t.create(this.value);e(r),this.set(n())}}const u={on:function(t,e,r,n){"string"==typeof n&&(n=t.findName(c(n))),e.addEventListener(r,n)},ref:function(t,e,r,n){if("string"==typeof n&&(n=t.findName(c(n))),!(n instanceof a))throw Error("Rumious: ref directive required RumiousElementRef !");n.target=e},inject:function(t,e,r,n){if("string"==typeof n&&(n=t.findName(c(n))),!(n instanceof o))throw Error("Rumious: inject directive required RumiousInjector !");n.addTarget(e),n.inject(e)},bind:function(t,e,r,n){if("string"==typeof n&&(n=t.findName(c(n))),!(n instanceof l))throw Error("Rumious: bind directive required RumiousState !");e.setAttribute(r,n.value),n.reactor.addBinding((({})=>{e.setAttribute(r,n.value)}))},model:function(t,e,r,n){if("string"==typeof n&&(n=t.findName(c(n))),!(n instanceof l&&(e instanceof HTMLInputElement||e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)))throw Error("Rumious: model directive requires RumiousState and a valid form element!");{const t=e.type;e.addEventListener("input",(()=>{if(e instanceof HTMLInputElement)switch(t){case"checkbox":n.set(e.checked);break;case"radio":e.checked&&n.set(e.value);break;default:n.set(e.value)}else(e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)&&n.set(e.value)}))}}};class d{domMap=new Map;constructor(t,e,r){this.state=t,this.callback=e,this.keyFn=r??((t,e)=>e)}prepare(t,e){this.anchorElement=t,this.context=e}async render(){await this.reconcile(this.state.value),this.state.reactor.addBinding(this.onStateChange.bind(this))}async onStateChange(t){if("APPEND"===t.type){const e=this.keyFn(t.item,t.key);if(!this.domMap.has(e)){const r=await this.callback(t.item,t.key),n=document.createDocumentFragment();this.context.renderHelper(this.context,r,n),this.anchorElement.appendChild(n),this.domMap.set(e,n)}}else if("SET_BY_KEY"===t.type){const e=this.keyFn(t.item,t.key),r=this.anchorElement.childNodes[t.key];if(r){const n=await this.callback(t.item,t.key),s=document.createDocumentFragment();this.context.renderHelper(this.context,n,s),this.anchorElement.replaceChild(s,r),this.domMap.set(e,s)}}else if("REMOVE_BY_KEY"===t.type){const e=this.anchorElement.childNodes[t.key];if(e){this.anchorElement.removeChild(e);const t=[...this.domMap.entries()].find((([,t])=>t===e));t&&this.domMap.delete(t[0])}}else if("INSERT_BY_KEY"===t.type){const e=this.keyFn(t.item,t.key);if(!this.domMap.has(e)){const r=await this.callback(t.item,t.key),n=document.createDocumentFragment();this.context.renderHelper(this.context,r,n);const s=this.anchorElement.childNodes[t.key]??null;this.anchorElement.insertBefore(n,s),this.domMap.set(e,n)}}else await this.reconcile(this.state.value)}async reconcile(t){const e=this.domMap,r=new Map,n=[];for(let s=0;s<t.length;s++){const i=t[s],o=this.keyFn(i,s);let a=e.get(o);if(!a){const t=await this.callback(i,s),e=document.createDocumentFragment();this.context.renderHelper(this.context,t,e),a=e}r.set(o,a),n.push(a)}this.anchorElement.textContent="";for(const t of n)this.anchorElement.appendChild(t);this.domMap=r}}async function m(t,e,r,s){if(e.parentNode)if(function(t){return t!==Object(t)}(r))e.textContent=String(r);else if(r&&r instanceof l&&r.value instanceof Node){let o=e;if(!o.parentNode)return;function a({}){document.contains(o)&&o.parentNode?(r.value instanceof n&&r.value.setContext(s),o.parentNode.replaceChild(r.value,o),o=r.value):r.reactor.removeBinding(a)}r.value instanceof n&&r.value.setContext(s),o.parentNode.replaceChild(r.value,o),o=r.value,r.reactor.addBinding(a)}else if(r&&r instanceof l){function c({}){document.contains(e)?e.textContent=r.value:r.reactor.removeBinding(c)}e.textContent=r.value,r.reactor.addBinding(c)}else if(Array.isArray(r))e.textContent=r.map(String).join("");else if(r instanceof d)r.prepare(e.parentElement,s),r.render();else if(r instanceof HTMLElement)e.replaceWith(r);else if(r instanceof i){let h=document.createDocumentFragment();s.renderHelper?.(s,r,h),e.replaceWith(h)}else if(r instanceof NodeList||r instanceof HTMLCollection){if(0===r.length)return void e.remove();const u=document.createDocumentFragment();for(const m of Array.from(r))u.appendChild(m.cloneNode(!0));e.replaceWith(u),e.remove()}else if(r&&"function"==typeof r.toString)try{e.textContent=r.toString()}catch{e.textContent=""}else e.textContent=""}function p(t){return new i(t)}window.RUMIOUS_JSX={template:p,createElement:function(...t){throw console.log(t),Error("Rumious doesn't use createElement !")},addDirective:function(t,e,r,n="",s){let i=u[r];if(!i)throw Error("Rumious: Cannot solve directive !");i(e,t,n,s)},dynamicValue:function(t,e,r,n){m(0,e,r,n)},createComponent:function(t){let e=t.tagName;return window.customElements.get(e)||window.customElements.define(e,class extends n{static tag=e}),document.createElement(e)}};class g extends l{constructor(t,e){super(t,e)}set(t,e){if("number"==typeof t&&void 0!==e){const r=t,n=e;this.value[r]=n,this.reactor.emit({type:"SET_BY_KEY",value:[...this.value],target:this,key:r,item:n})}else{if(!Array.isArray(t))throw new Error("Invalid arguments passed to set()");super.set(t)}}get(t){return"number"==typeof t?this.value[t]:this.value}insert(t,e){return this.value.splice(t,0,e),this.reactor.emit({type:"INSERT_BY_KEY",value:this.value,target:this,key:t,item:e}),this}remove(t){return this.value.splice(t,1),this.reactor.emit({type:"REMOVE_BY_KEY",value:this.value,target:this,key:t}),this}append(t){return this.value.push(t),this.reactor.emit({type:"APPEND",value:this.value,target:this,item:t}),this}clear(){return this.value.length=0,this.reactor.emit({type:"SET",value:[],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:[...this.value],target:this,key:t,item:e}),this}filter(t){return this.value=this.value.filter(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}map(t){return this.value=this.value.map(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}sort(t){return this.value.sort(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}reverse(){return this.value.reverse(),this.reactor.emit({type:"SET",value:this.value,target:this}),this}get length(){return this.value.length}forEach(t){this.value.forEach(t)}}class f extends l{#t=!1;constructor(t,e){super(t,e)}set(t,e){if(this.#t)throw new Error("Object is locked");if("string"==typeof t){const r=t,n=e;return this.value[r]=n,this.reactor.emit({type:"SET_BY_KEY",value:{...this.value},target:this,key:r,item:n}),this}if("object"!=typeof t)throw new Error("Invalid arguments passed to set()");super.set(t)}remove(t){if(this.#t)throw new Error("Object is locked");return t in this.value&&(delete this.value[t],this.reactor.emit({type:"REMOVE_BY_KEY",value:{...this.value},target:this,key:t})),this}merge(t){if(this.#t)throw new Error("Object is locked");return Object.assign(this.value,t),this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}assign(t){if(this.#t)throw new Error("Object is locked");return this.value={...this.value,...t},this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}clear(){if(this.#t)throw new Error("Object is locked");for(const t in this.value)delete this.value[t];return this.reactor.emit({type:"SET",value:{},target:this}),this}get(t){return"string"==typeof t?this.value[t]:this.value}keys(){return Object.keys(this.value)}values(){return Object.values(this.value)}entries(){return Object.entries(this.value)}has(t){return t in this.value}get size(){return Object.keys(this.value).length}forEach(t){Object.entries(this.value).forEach((([e,r])=>{t(r,e,this.value)}))}map(t){const e={};return Object.entries(this.value).forEach((([r,n])=>{e[r]=t(n,r,this.value)})),e}clone(){return JSON.parse(JSON.stringify(this.value))}toJSON(){return JSON.parse(JSON.stringify(this.value))}toObject(){return this.get()}lock(){return this.#t=!0,this}unlock(){return this.#t=!1,this}get isLocked(){return this.#t}freeze(){return Object.freeze(this.value),this}unfreeze(){return this.value=JSON.parse(JSON.stringify(this.value)),this}get isFrozen(){return Object.isFrozen(this.value)}}window.RUMIOUS_CONTEXTS={};class v{constructor(t={}){this.events={},this.values=t}has(t){return t in this.values}set(t,e){this.values[t]=e}get(t){return this.values[t]}on(t,e){this.events[t]||(this.events[t]=[]),this.events[t].push(e)}off(t,e){this.events[t]&&(this.events[t]=this.events[t].filter((t=>t!==e)))}emit(t,e){this.events[t]&&this.events[t].forEach((t=>t(e)))}}exports.Fragment=function(...t){throw Error("Fragment element must be compiled by Rumious !")},exports.RumiousApp=s,exports.RumiousArrayState=g,exports.RumiousChildrenRef=class{constructor(t){this.target=t}list(){return Array.from(this.target.children)}getChild(t){return this.list()[t]}remove(t){this.list()[t]?.remove()}add(t){this.target.appendChild(t)}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}clear(){this.target.innerHTML=""}replaceChild(t,e){const r=this.getChild(t);r&&this.target.replaceChild(e,r)}insertBefore(t,e){const r=this.getChild(e);r?this.target.insertBefore(t,r):this.add(t)}prepend(t){this.target.prepend(t)}getFirstChild(){return this.list()[0]}getLastChild(){return this.list()[this.list().length-1]}hasChildren(){return this.target.hasChildNodes()}count(){return this.target.children.length}find(t){return this.list().find(t)}forEach(t){this.list().forEach(t)}removeAllMatching(t){this.querySelectorAll(t).forEach((t=>t.remove()))}toggleClass(t){this.list().forEach((e=>e.classList.toggle(t)))}setAttribute(t,e){this.list().forEach((r=>r.setAttribute(t,e)))}},exports.RumiousComponent=class{static classNames="";static tagName="rumious-component";constructor(){this.renderOptions={mode:"idle"}}onCreate(){}onRender(){}onDestroy(){}async onBeforeRender(){}prepare(t,r){this.props=r,this.context=new e(this,t.app)}async requestRender(){await this.onBeforeRender();let t=this.template();r(this.context,t,this.element),this.onRender()}requestCleanup(){}},exports.RumiousComponentElement=n,exports.RumiousContext=v,exports.RumiousDymanicInjector=o,exports.RumiousElementRef=a,exports.RumiousModule=class{},exports.RumiousObjectState=f,exports.RumiousRenderTemplate=i,exports.RumiousState=l,exports.createApp=function(t,e){return new s(t,e)},exports.createArrayState=function(t){return new g(t)},exports.createContext=function(t,e=function(t="_"){return`${t}${(Math.floor(9999*Math.random())*Date.now()).toString(32)}`}("rctx_")){if(window.RUMIOUS_CONTEXTS[e])return window.RUMIOUS_CONTEXTS[e];{let r=new v(t);return window.RUMIOUS_CONTEXTS[e]=r,r}},exports.createElementRef=function(){return new a(document.createElement("span"))},exports.createHTMLInjector=function(t){return new o([t])},exports.createObjectState=function(t){return new f(t)},exports.createState=function(t){return new l(t)},exports.denounce=function(t,e){let r;return function(...n){clearTimeout(r),r=setTimeout((()=>t.apply(this,n)),e)}},exports.leadingTrailingDebounce=function(t,e){let r,n=!0;return function(...s){n&&(t.apply(this,s),n=!1),clearTimeout(r),r=setTimeout((()=>{t.apply(this,s),n=!0}),e)}},exports.rafThrottle=function(t){let e=!1;return function(...r){e||(e=!0,requestAnimationFrame((()=>{t.apply(this,r),e=!1})))}},exports.renderComponent=function(t,e){let r=window.RUMIOUS_JSX.createComponent(t);return r.props=e,r.setComponent(t),r},exports.renderDynamicArray=function(t,e){return new d(t,e)},exports.template=p,exports.tholle=function(t,e){let r=0;return function(...n){const s=Date.now();s-r>=e&&(r=s,t.apply(this,n))}},exports.trailingThrottle=function(t,e){let r=0,n=null,s=null;function i(){r=Date.now(),t.apply(this,n),n=null}return function(...t){const o=Date.now();n=t,o-r>=e?i.call(this):s||(s=setTimeout((()=>{s=null,i.call(this)}),e-(o-r)))}},exports.unwatch=function(t,e){t.reactor.removeBinding(e)},exports.watch=function(t,e){t.reactor.addBinding(e)};
1
+ var t=require("mutative");class e{constructor(t,e){this.target=t,this.app=e,this.onRenderFinished=[]}findName(t){return this.target[t]}}function r(t,e,n){let s=e.generator.bind(t.target);t.renderHelper=r,s(n,t),setTimeout((async()=>{const e=[...t.onRenderFinished];t.onRenderFinished=[];for(const t of e)await t()}),0)}class n extends HTMLElement{constructor(){super(),this.props={}}setContext(t){this.context=t}setComponent(t){this.componentConstructor=t}setup(t,e){this.context=t,this.componentConstructor=e}connectedCallback(){this.componentConstructor?(this.componentInstance=new this.componentConstructor,this.componentInstance.element=this,this.componentConstructor.classNames&&(this.className=this.componentConstructor.classNames),this.componentInstance.prepare(this.context,this.props),this.componentInstance.onCreate(),this.componentInstance.requestRender()):console.warn("Rumious: Cannot find matching component constructor.")}disconnectedCallback(){this.componentInstance?.onDestroy()}}class s{constructor(t,r={}){this.root=t,this.options=r,this.modules=[],this.context=new e(this,this)}addModule(t,e){const r=t.init(this,e);return this.modules.push(r),r}render(t){r(this.context,t,this.root)}}class i{constructor(t){this.generator=t}}class o{constructor(t){if(this.contents=t,this.targets=new Map,!t||0===t.length)throw new Error("Injector must be initialized with non-empty content");const e=t[0];this.type="string"==typeof e?"string":"element"}commit(t){this.contents=t;const e=t[0];this.type="string"==typeof e?"string":"element"}addTarget(t){this.targets.set(t,1)}inject(t){if(this.targets.has(t)&&this.contents)if(t.innerHTML="","string"===this.type)for(const e of this.contents)t.insertAdjacentHTML("beforeend",e);else for(const e of this.contents)t.appendChild(e)}injectAll(){for(const t of this.targets.keys())this.inject(t)}removeTarget(t){this.targets.delete(t)}clear(){this.targets.clear()}}class a{constructor(t){this.target=t}getElement(){return this.target}remove(){this.target.remove()}addChild(t){this.target.appendChild(t)}listChild(){return this.target.childNodes}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}set text(t){this.target.textContent=t}get text(){return this.target.textContent}set value(t){(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.value=t)}get value(){if(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)return this.target.value}addClassName(t){this.target.classList.add(t)}removeClassName(t){this.target.classList.remove(t)}hasClassName(t){return this.target.classList.contains(t)}toggleClass(t,e){return this.target.classList.toggle(t,e)}setStyle(t){Object.assign(this.target.style,t)}getStyle(t){return getComputedStyle(this.target).getPropertyValue(t)}setAttribute(t,e){this.target.setAttribute(t,e)}getAttribute(t){return this.target.getAttribute(t)}removeAttribute(t){this.target.removeAttribute(t)}on(t,e,r){this.target.addEventListener(t,e,r)}off(t,e,r){this.target.removeEventListener(t,e,r)}set html(t){this.target.innerHTML=t}get html(){return this.target.innerHTML}getBoundingRect(){return this.target.getBoundingClientRect()}isInViewport(){const t=this.target.getBoundingClientRect();return t.top>=0&&t.left>=0&&t.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&t.right<=(window.innerWidth||document.documentElement.clientWidth)}prependChild(t){this.target.prepend(t)}setDisabled(t){(this.target instanceof HTMLButtonElement||this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.disabled=t)}addClasses(...t){this.target.classList.add(...t)}removeClasses(...t){this.target.classList.remove(...t)}replaceClass(t,e){this.target.classList.replace(t,e)}moveTo(t){t.appendChild(this.target)}getParent(){return this.target.parentElement}getNextSibling(){return this.target.nextElementSibling}getPreviousSibling(){return this.target.previousElementSibling}hide(){this.target.style.display="none"}show(){this.target.style.removeProperty("display")}isHidden(){return"none"===window.getComputedStyle(this.target).display}scrollIntoView(t={behavior:"smooth"}){this.target.scrollIntoView(t)}matches(t){return this.target.matches(t)}getChildren(){return Array.from(this.target.children)}insertAfter(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target.nextSibling)}insertBefore(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target)}clearChildren(){for(;this.target.firstChild;)this.target.removeChild(this.target.firstChild)}animate(t,e){return this.target.animate(t,e)}}function c(t){const e=t.indexOf("$");return-1!==e?t.slice(e+1):""}class h{constructor(t){this.target=t,this.bindings=[]}addBinding(t){this.bindings.push(t)}removeBinding(t){this.bindings=this.bindings.filter((e=>e!==t))}async emit(t){await Promise.allSettled(this.bindings.map((e=>{try{const r=e(t);return r instanceof Promise?r:Promise.resolve(r)}catch(t){return Promise.reject(t)}})))}}class l{constructor(t,e){this.value=t,this.reactor=e??new h(this)}set(t){this.value=t,this.reactor.emit({type:"SET",target:this,value:t})}get(){return this.value}increase(t=1){"number"==typeof this.value&&this.set(this.value+t)}produce(e){const[r,n]=t.create(this.value);e(r),this.set(n())}}const u={on:function(t,e,r,n){"string"==typeof n&&(n=t.findName(c(n))),e.addEventListener(r,n)},ref:function(t,e,r,n){if("string"==typeof n&&(n=t.findName(c(n))),!(n instanceof a))throw Error("Rumious: ref directive required RumiousElementRef !");n.target=e},inject:function(t,e,r,n){if("string"==typeof n&&(n=t.findName(c(n))),!(n instanceof o))throw Error("Rumious: inject directive required RumiousInjector !");n.addTarget(e),n.inject(e)},bind:function(t,e,r,n){if("string"==typeof n&&(n=t.findName(c(n))),!(n instanceof l))throw Error("Rumious: bind directive required RumiousState !");e.setAttribute(r,n.value),n.reactor.addBinding((({})=>{e.setAttribute(r,n.value)}))},model:function(t,e,r,n){if("string"==typeof n&&(n=t.findName(c(n))),!(n instanceof l&&(e instanceof HTMLInputElement||e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)))throw Error("Rumious: model directive requires RumiousState and a valid form element!");{const t=e.type;e.addEventListener("input",(()=>{if(e instanceof HTMLInputElement)switch(t){case"checkbox":n.set(e.checked);break;case"radio":e.checked&&n.set(e.value);break;default:n.set(e.value)}else(e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)&&n.set(e.value)}))}}};class d{domMap=new Map;constructor(t,e,r){this.state=t,this.callback=e,this.keyFn=r??((t,e)=>e)}prepare(t,e){this.anchorElement=t,this.context=e}async render(){await this.reconcile(this.state.value),this.state.reactor.addBinding(this.onStateChange.bind(this))}async onStateChange(t){if("APPEND"===t.type){const e=this.keyFn(t.item,t.key);if(!this.domMap.has(e)){const r=await this.callback(t.item,t.key),n=document.createDocumentFragment();this.context.renderHelper(this.context,r,n),this.anchorElement.appendChild(n),this.domMap.set(e,n)}}else if("SET_BY_KEY"===t.type){const e=this.keyFn(t.item,t.key),r=this.anchorElement.childNodes[t.key];if(r){const n=await this.callback(t.item,t.key),s=document.createDocumentFragment();this.context.renderHelper(this.context,n,s),this.anchorElement.replaceChild(s,r),this.domMap.set(e,s)}}else if("REMOVE_BY_KEY"===t.type){const e=this.anchorElement.childNodes[t.key];if(e){this.anchorElement.removeChild(e);const t=[...this.domMap.entries()].find((([,t])=>t===e));t&&this.domMap.delete(t[0])}}else if("INSERT_BY_KEY"===t.type){const e=this.keyFn(t.item,t.key);if(!this.domMap.has(e)){const r=await this.callback(t.item,t.key),n=document.createDocumentFragment();this.context.renderHelper(this.context,r,n);const s=this.anchorElement.childNodes[t.key]??null;this.anchorElement.insertBefore(n,s),this.domMap.set(e,n)}}else await this.reconcile(this.state.value)}async reconcile(t){const e=this.domMap,r=new Map,n=[];for(let s=0;s<t.length;s++){const i=t[s],o=this.keyFn(i,s);let a=e.get(o);if(!a){const t=await this.callback(i,s),e=document.createDocumentFragment();this.context.renderHelper(this.context,t,e),a=e}r.set(o,a),n.push(a)}this.anchorElement.textContent="";for(const t of n)this.anchorElement.appendChild(t);this.domMap=r}}async function m(t,e,r,s){if(e.parentNode)if(function(t){return t!==Object(t)}(r))e.textContent=String(r);else if(r&&r instanceof l&&r.value instanceof Node){let o=e;if(!o.parentNode)return;function a({}){document.contains(o)&&o.parentNode?(r.value instanceof n&&r.value.setContext(s),o.parentNode.replaceChild(r.value,o),o=r.value):r.reactor.removeBinding(a)}r.value instanceof n&&r.value.setContext(s),o.parentNode.replaceChild(r.value,o),o=r.value,r.reactor.addBinding(a)}else if(r&&r instanceof l){function c({}){document.contains(e)?e.textContent=r.value:r.reactor.removeBinding(c)}e.textContent=r.value,r.reactor.addBinding(c)}else if(Array.isArray(r))e.textContent=r.map(String).join("");else if(r instanceof d)r.prepare(e.parentElement,s),r.render();else if(r instanceof HTMLElement)e.replaceWith(r);else if(r instanceof i){let h=document.createDocumentFragment();s.renderHelper?.(s,r,h),e.replaceWith(h)}else if(r instanceof NodeList||r instanceof HTMLCollection){if(0===r.length)return void e.remove();const u=document.createDocumentFragment();for(const m of Array.from(r))u.appendChild(m.cloneNode(!0));e.replaceWith(u),e.remove()}else if(r&&"function"==typeof r.toString)try{e.textContent=r.toString()}catch{e.textContent=""}else e.textContent=""}function p(t){return new i(t)}window.RUMIOUS_JSX={template:p,createElement:function(...t){throw console.log(t),Error("Rumious doesn't use createElement !")},addDirective:function(t,e,r,n="",s){let i=u[r];if(!i)throw Error("Rumious: Cannot solve directive !");i(e,t,n,s)},dynamicValue:function(t,e,r,n){m(0,e,r,n)},createComponent:function(t){let e=t.tagName;return window.customElements.get(e)||window.customElements.define(e,class extends n{static tag=e}),document.createElement(e)}};class g extends l{constructor(t,e){super(t,e)}set(t,e){if("number"==typeof t&&void 0!==e){const r=t,n=e;this.value[r]=n,this.reactor.emit({type:"SET_BY_KEY",value:[...this.value],target:this,key:r,item:n})}else{if(!Array.isArray(t))throw new Error("Invalid arguments passed to set()");super.set(t)}}get(t){return"number"==typeof t?this.value[t]:this.value}insert(t,e){return this.value.splice(t,0,e),this.reactor.emit({type:"INSERT_BY_KEY",value:this.value,target:this,key:t,item:e}),this}remove(t){return this.value.splice(t,1),this.reactor.emit({type:"REMOVE_BY_KEY",value:this.value,target:this,key:t}),this}append(t){return this.value.push(t),this.reactor.emit({type:"APPEND",value:this.value,target:this,item:t}),this}clear(){return this.value.length=0,this.reactor.emit({type:"SET",value:[],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:[...this.value],target:this,key:t,item:e}),this}filter(t){return this.value=this.value.filter(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}map(t){return this.value=this.value.map(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}sort(t){return this.value.sort(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}reverse(){return this.value.reverse(),this.reactor.emit({type:"SET",value:this.value,target:this}),this}get length(){return this.value.length}forEach(t){this.value.forEach(t)}}class f extends l{#t=!1;constructor(t,e){super(t,e)}set(t,e){if(this.#t)throw new Error("Object is locked");if("string"==typeof t){const r=t,n=e;return this.value[r]=n,this.reactor.emit({type:"SET_BY_KEY",value:{...this.value},target:this,key:r,item:n}),this}if("object"!=typeof t)throw new Error("Invalid arguments passed to set()");super.set(t)}remove(t){if(this.#t)throw new Error("Object is locked");return t in this.value&&(delete this.value[t],this.reactor.emit({type:"REMOVE_BY_KEY",value:{...this.value},target:this,key:t})),this}merge(t){if(this.#t)throw new Error("Object is locked");return Object.assign(this.value,t),this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}assign(t){if(this.#t)throw new Error("Object is locked");return this.value={...this.value,...t},this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}clear(){if(this.#t)throw new Error("Object is locked");for(const t in this.value)delete this.value[t];return this.reactor.emit({type:"SET",value:{},target:this}),this}get(t){return"string"==typeof t?this.value[t]:this.value}keys(){return Object.keys(this.value)}values(){return Object.values(this.value)}entries(){return Object.entries(this.value)}has(t){return t in this.value}get size(){return Object.keys(this.value).length}forEach(t){Object.entries(this.value).forEach((([e,r])=>{t(r,e,this.value)}))}map(t){const e={};return Object.entries(this.value).forEach((([r,n])=>{e[r]=t(n,r,this.value)})),e}clone(){return JSON.parse(JSON.stringify(this.value))}toJSON(){return JSON.parse(JSON.stringify(this.value))}toObject(){return this.get()}lock(){return this.#t=!0,this}unlock(){return this.#t=!1,this}get isLocked(){return this.#t}freeze(){return Object.freeze(this.value),this}unfreeze(){return this.value=JSON.parse(JSON.stringify(this.value)),this}get isFrozen(){return Object.isFrozen(this.value)}}window.RUMIOUS_CONTEXTS={};class v{constructor(t={}){this.events={},this.values=t}has(t){return t in this.values}set(t,e){this.values[t]=e}get(t){return this.values[t]}on(t,e){this.events[t]||(this.events[t]=[]),this.events[t].push(e)}off(t,e){this.events[t]&&(this.events[t]=this.events[t].filter((t=>t!==e)))}emit(t,e){this.events[t]&&this.events[t].forEach((t=>t(e)))}}exports.Fragment=function(...t){throw Error("Fragment element must be compiled by Rumious !")},exports.RumiousApp=s,exports.RumiousArrayState=g,exports.RumiousChildrenRef=class{constructor(t){this.target=t}list(){return Array.from(this.target.children)}getChild(t){return this.list()[t]}remove(t){this.list()[t]?.remove()}add(t){this.target.appendChild(t)}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}clear(){this.target.innerHTML=""}replaceChild(t,e){const r=this.getChild(t);r&&this.target.replaceChild(e,r)}insertBefore(t,e){const r=this.getChild(e);r?this.target.insertBefore(t,r):this.add(t)}prepend(t){this.target.prepend(t)}getFirstChild(){return this.list()[0]}getLastChild(){return this.list()[this.list().length-1]}hasChildren(){return this.target.hasChildNodes()}count(){return this.target.children.length}find(t){return this.list().find(t)}forEach(t){this.list().forEach(t)}removeAllMatching(t){this.querySelectorAll(t).forEach((t=>t.remove()))}toggleClass(t){this.list().forEach((e=>e.classList.toggle(t)))}setAttribute(t,e){this.list().forEach((r=>r.setAttribute(t,e)))}},exports.RumiousComponent=class{static classNames="";static tagName="rumious-component";constructor(){this.renderOptions={mode:"idle"}}onCreate(){}onRender(){}onDestroy(){}async onBeforeRender(){}prepare(t,r){this.props=r,this.context=new e(this,t.app)}async requestRender(){await this.onBeforeRender();let t=this.template();r(this.context,t,this.element),this.onRender()}requestCleanup(){}},exports.RumiousComponentElement=n,exports.RumiousContext=v,exports.RumiousDymanicInjector=o,exports.RumiousElementRef=a,exports.RumiousModule=class{},exports.RumiousObjectState=f,exports.RumiousRenderTemplate=i,exports.RumiousState=l,exports.createApp=function(t,e){return new s(t,e)},exports.createArrayState=function(t){return new g(t)},exports.createContext=function(t,e=function(t="_"){return`${t}${(Math.floor(9999*Math.random())*Date.now()).toString(32)}`}("rctx_")){if(window.RUMIOUS_CONTEXTS[e])return window.RUMIOUS_CONTEXTS[e];{let r=new v(t);return window.RUMIOUS_CONTEXTS[e]=r,r}},exports.createElementRef=function(){return new a(document.createElement("span"))},exports.createHTMLInjector=function(t){return new o([t])},exports.createObjectState=function(t){return new f(t)},exports.createState=function(t){return new l(t)},exports.denounce=function(t,e){let r;return function(...n){clearTimeout(r),r=setTimeout((()=>t.apply(this,n)),e)}},exports.leadingTrailingDebounce=function(t,e){let r,n=!0;return function(...s){n&&(t.apply(this,s),n=!1),clearTimeout(r),r=setTimeout((()=>{t.apply(this,s),n=!0}),e)}},exports.rafThrottle=function(t){let e=!1;return function(...r){e||(e=!0,requestAnimationFrame((()=>{t.apply(this,r),e=!1})))}},exports.renderComponent=function(t,e){let r=window.RUMIOUS_JSX.createComponent(t);return r.props=e,r.setComponent(t),r},exports.renderDynamicArray=function(t,e,r){return new d(t,e,r)},exports.template=p,exports.tholle=function(t,e){let r=0;return function(...n){const s=Date.now();s-r>=e&&(r=s,t.apply(this,n))}},exports.trailingThrottle=function(t,e){let r=0,n=null,s=null;function i(){r=Date.now(),t.apply(this,n),n=null}return function(...t){const o=Date.now();n=t,o-r>=e?i.call(this):s||(s=setTimeout((()=>{s=null,i.call(this)}),e-(o-r)))}},exports.unwatch=function(t,e){t.reactor.removeBinding(e)},exports.watch=function(t,e){t.reactor.addBinding(e)};
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,i){let s=e.generator.bind(t.target);t.renderHelper=n,s(i,t),setTimeout((async()=>{const e=[...t.onRenderFinished];t.onRenderFinished=[];for(const t of e)await t()}),0)}class i{static classNames="";static tagName="rumious-component";constructor(){this.renderOptions={mode:"idle"}}onCreate(){}onRender(){}onDestroy(){}async onBeforeRender(){}prepare(t,n){this.props=n,this.context=new e(this,t.app)}async requestRender(){await this.onBeforeRender();let t=this.template();n(this.context,t,this.element),this.onRender()}requestCleanup(){}}class 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()}}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 c{constructor(t){this.generator=t}}class l{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 l([t])}class d{constructor(t){this.target=t}getElement(){return this.target}remove(){this.target.remove()}addChild(t){this.target.appendChild(t)}listChild(){return this.target.childNodes}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}set text(t){this.target.textContent=t}get text(){return this.target.textContent}set value(t){(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.value=t)}get value(){if(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)return this.target.value}addClassName(t){this.target.classList.add(t)}removeClassName(t){this.target.classList.remove(t)}hasClassName(t){return this.target.classList.contains(t)}toggleClass(t,e){return this.target.classList.toggle(t,e)}setStyle(t){Object.assign(this.target.style,t)}getStyle(t){return getComputedStyle(this.target).getPropertyValue(t)}setAttribute(t,e){this.target.setAttribute(t,e)}getAttribute(t){return this.target.getAttribute(t)}removeAttribute(t){this.target.removeAttribute(t)}on(t,e,n){this.target.addEventListener(t,e,n)}off(t,e,n){this.target.removeEventListener(t,e,n)}set html(t){this.target.innerHTML=t}get html(){return this.target.innerHTML}getBoundingRect(){return this.target.getBoundingClientRect()}isInViewport(){const t=this.target.getBoundingClientRect();return t.top>=0&&t.left>=0&&t.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&t.right<=(window.innerWidth||document.documentElement.clientWidth)}prependChild(t){this.target.prepend(t)}setDisabled(t){(this.target instanceof HTMLButtonElement||this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.disabled=t)}addClasses(...t){this.target.classList.add(...t)}removeClasses(...t){this.target.classList.remove(...t)}replaceClass(t,e){this.target.classList.replace(t,e)}moveTo(t){t.appendChild(this.target)}getParent(){return this.target.parentElement}getNextSibling(){return this.target.nextElementSibling}getPreviousSibling(){return this.target.previousElementSibling}hide(){this.target.style.display="none"}show(){this.target.style.removeProperty("display")}isHidden(){return"none"===window.getComputedStyle(this.target).display}scrollIntoView(t={behavior:"smooth"}){this.target.scrollIntoView(t)}matches(t){return this.target.matches(t)}getChildren(){return Array.from(this.target.children)}insertAfter(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target.nextSibling)}insertBefore(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target)}clearChildren(){for(;this.target.firstChild;)this.target.removeChild(this.target.firstChild)}animate(t,e){return this.target.animate(t,e)}}function m(){return new d(document.createElement("span"))}function g(t){const e=t.indexOf("$");return-1!==e?t.slice(e+1):""}class p{constructor(t){this.target=t,this.bindings=[]}addBinding(t){this.bindings.push(t)}removeBinding(t){this.bindings=this.bindings.filter((e=>e!==t))}async emit(t){await Promise.allSettled(this.bindings.map((e=>{try{const n=e(t);return n instanceof Promise?n:Promise.resolve(n)}catch(t){return Promise.reject(t)}})))}}class f{constructor(t,e){this.value=t,this.reactor=e??new p(this)}set(t){this.value=t,this.reactor.emit({type:"SET",target:this,value:t})}get(){return this.value}increase(t=1){"number"==typeof this.value&&this.set(this.value+t)}produce(e){const[n,i]=t(this.value);e(n),this.set(i())}}function v(t,e){t.reactor.addBinding(e)}function y(t,e){t.reactor.removeBinding(e)}function E(t){return new f(t)}const w={on:function(t,e,n,i){"string"==typeof i&&(i=t.findName(g(i))),e.addEventListener(n,i)},ref:function(t,e,n,i){if("string"==typeof i&&(i=t.findName(g(i))),!(i instanceof d))throw Error("Rumious: ref directive required RumiousElementRef !");i.target=e},inject:function(t,e,n,i){if("string"==typeof i&&(i=t.findName(g(i))),!(i instanceof l))throw Error("Rumious: inject directive required RumiousInjector !");i.addTarget(e),i.inject(e)},bind:function(t,e,n,i){if("string"==typeof i&&(i=t.findName(g(i))),!(i instanceof f))throw Error("Rumious: bind directive required RumiousState !");e.setAttribute(n,i.value),i.reactor.addBinding((({})=>{e.setAttribute(n,i.value)}))},model:function(t,e,n,i){if("string"==typeof i&&(i=t.findName(g(i))),!(i 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":i.set(e.checked);break;case"radio":e.checked&&i.set(e.value);break;default:i.set(e.value)}else(e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)&&i.set(e.value)}))}}};class C{domMap=new Map;constructor(t,e,n){this.state=t,this.callback=e,this.keyFn=n??((t,e)=>e)}prepare(t,e){this.anchorElement=t,this.context=e}async render(){await this.reconcile(this.state.value),this.state.reactor.addBinding(this.onStateChange.bind(this))}async onStateChange(t){if("APPEND"===t.type){const e=this.keyFn(t.item,t.key);if(!this.domMap.has(e)){const n=await this.callback(t.item,t.key),i=document.createDocumentFragment();this.context.renderHelper(this.context,n,i),this.anchorElement.appendChild(i),this.domMap.set(e,i)}}else if("SET_BY_KEY"===t.type){const e=this.keyFn(t.item,t.key),n=this.anchorElement.childNodes[t.key];if(n){const i=await this.callback(t.item,t.key),s=document.createDocumentFragment();this.context.renderHelper(this.context,i,s),this.anchorElement.replaceChild(s,n),this.domMap.set(e,s)}}else if("REMOVE_BY_KEY"===t.type){const e=this.anchorElement.childNodes[t.key];if(e){this.anchorElement.removeChild(e);const t=[...this.domMap.entries()].find((([,t])=>t===e));t&&this.domMap.delete(t[0])}}else if("INSERT_BY_KEY"===t.type){const e=this.keyFn(t.item,t.key);if(!this.domMap.has(e)){const n=await this.callback(t.item,t.key),i=document.createDocumentFragment();this.context.renderHelper(this.context,n,i);const s=this.anchorElement.childNodes[t.key]??null;this.anchorElement.insertBefore(i,s),this.domMap.set(e,i)}}else await this.reconcile(this.state.value)}async reconcile(t){const e=this.domMap,n=new Map,i=[];for(let s=0;s<t.length;s++){const r=t[s],o=this.keyFn(r,s);let a=e.get(o);if(!a){const t=await this.callback(r,s),e=document.createDocumentFragment();this.context.renderHelper(this.context,t,e),a=e}n.set(o,a),i.push(a)}this.anchorElement.textContent="";for(const t of i)this.anchorElement.appendChild(t);this.domMap=n}}function b(t,e){return new C(t,e)}async function S(t,e,n,i){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 s&&n.value.setContext(i),r.parentNode.replaceChild(n.value,r),r=n.value):n.reactor.removeBinding(o)}n.value instanceof s&&n.value.setContext(i),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 C)n.prepare(e.parentElement,i),n.render();else if(n instanceof HTMLElement)e.replaceWith(n);else if(n instanceof c){let h=document.createDocumentFragment();i.renderHelper?.(i,n,h),e.replaceWith(h)}else if(n instanceof NodeList||n instanceof HTMLCollection){if(0===n.length)return void e.remove();const l=document.createDocumentFragment();for(const u of Array.from(n))l.appendChild(u.cloneNode(!0));e.replaceWith(l),e.remove()}else if(n&&"function"==typeof n.toString)try{e.textContent=n.toString()}catch{e.textContent=""}else e.textContent=""}function T(t){return new c(t)}const k=function(...t){throw Error("Fragment element must be compiled by Rumious !")};window.RUMIOUS_JSX={template:T,createElement:function(...t){throw console.log(t),Error("Rumious doesn't use createElement !")},addDirective:function(t,e,n,i="",s){let r=w[n];if(!r)throw Error("Rumious: Cannot solve directive !");r(e,t,i,s)},dynamicValue:function(t,e,n,i){S(0,e,n,i)},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 x{constructor(t){this.target=t}list(){return Array.from(this.target.children)}getChild(t){return this.list()[t]}remove(t){this.list()[t]?.remove()}add(t){this.target.appendChild(t)}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}clear(){this.target.innerHTML=""}replaceChild(t,e){const n=this.getChild(t);n&&this.target.replaceChild(e,n)}insertBefore(t,e){const n=this.getChild(e);n?this.target.insertBefore(t,n):this.add(t)}prepend(t){this.target.prepend(t)}getFirstChild(){return this.list()[0]}getLastChild(){return this.list()[this.list().length-1]}hasChildren(){return this.target.hasChildNodes()}count(){return this.target.children.length}find(t){return this.list().find(t)}forEach(t){this.list().forEach(t)}removeAllMatching(t){this.querySelectorAll(t).forEach((t=>t.remove()))}toggleClass(t){this.list().forEach((e=>e.classList.toggle(t)))}setAttribute(t,e){this.list().forEach((n=>n.setAttribute(t,e)))}}class N extends f{constructor(t,e){super(t,e)}set(t,e){if("number"==typeof t&&void 0!==e){const n=t,i=e;this.value[n]=i,this.reactor.emit({type:"SET_BY_KEY",value:[...this.value],target:this,key:n,item:i})}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:this.value,target:this,key:t,item:e}),this}remove(t){return this.value.splice(t,1),this.reactor.emit({type:"REMOVE_BY_KEY",value:this.value,target:this,key:t}),this}append(t){return this.value.push(t),this.reactor.emit({type:"APPEND",value:this.value,target:this,item:t}),this}clear(){return this.value.length=0,this.reactor.emit({type:"SET",value:[],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:[...this.value],target:this,key:t,item:e}),this}filter(t){return this.value=this.value.filter(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}map(t){return this.value=this.value.map(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}sort(t){return this.value.sort(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}reverse(){return this.value.reverse(),this.reactor.emit({type:"SET",value:this.value,target:this}),this}get length(){return this.value.length}forEach(t){this.value.forEach(t)}}function M(t){return new N(t)}class O extends f{#t=!1;constructor(t,e){super(t,e)}set(t,e){if(this.#t)throw new Error("Object is locked");if("string"==typeof t){const n=t,i=e;return this.value[n]=i,this.reactor.emit({type:"SET_BY_KEY",value:{...this.value},target:this,key:n,item:i}),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,i])=>{e[n]=t(i,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 L(t){return new O(t)}window.RUMIOUS_CONTEXTS={};class R{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 A(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 R(t);return window.RUMIOUS_CONTEXTS[e]=n,n}}function B(t,e){let n=0;return function(...i){const s=Date.now();s-n>=e&&(n=s,t.apply(this,i))}}function H(t,e){let n;return function(...i){clearTimeout(n),n=setTimeout((()=>t.apply(this,i)),e)}}function j(t,e){let n=0,i=null,s=null;function r(){n=Date.now(),t.apply(this,i),i=null}return function(...t){const o=Date.now();i=t,o-n>=e?r.call(this):s||(s=setTimeout((()=>{s=null,r.call(this)}),e-(o-n)))}}function I(t,e){let n,i=!0;return function(...s){i&&(t.apply(this,s),i=!1),clearTimeout(n),n=setTimeout((()=>{t.apply(this,s),i=!0}),e)}}function _(t){let e=!1;return function(...n){e||(e=!0,requestAnimationFrame((()=>{t.apply(this,n),e=!1})))}}export{k as Fragment,o as RumiousApp,N as RumiousArrayState,x as RumiousChildrenRef,i as RumiousComponent,s as RumiousComponentElement,R as RumiousContext,l as RumiousDymanicInjector,d as RumiousElementRef,h as RumiousModule,O as RumiousObjectState,c as RumiousRenderTemplate,f as RumiousState,a as createApp,M as createArrayState,A as createContext,m as createElementRef,u as createHTMLInjector,L as createObjectState,E as createState,H as denounce,I as leadingTrailingDebounce,_ as rafThrottle,r as renderComponent,b as renderDynamicArray,T as template,B as tholle,j as trailingThrottle,y 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,i){let s=e.generator.bind(t.target);t.renderHelper=n,s(i,t),setTimeout((async()=>{const e=[...t.onRenderFinished];t.onRenderFinished=[];for(const t of e)await t()}),0)}class i{static classNames="";static tagName="rumious-component";constructor(){this.renderOptions={mode:"idle"}}onCreate(){}onRender(){}onDestroy(){}async onBeforeRender(){}prepare(t,n){this.props=n,this.context=new e(this,t.app)}async requestRender(){await this.onBeforeRender();let t=this.template();n(this.context,t,this.element),this.onRender()}requestCleanup(){}}class 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()}}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 c{constructor(t){this.generator=t}}class l{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 l([t])}class d{constructor(t){this.target=t}getElement(){return this.target}remove(){this.target.remove()}addChild(t){this.target.appendChild(t)}listChild(){return this.target.childNodes}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}set text(t){this.target.textContent=t}get text(){return this.target.textContent}set value(t){(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.value=t)}get value(){if(this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)return this.target.value}addClassName(t){this.target.classList.add(t)}removeClassName(t){this.target.classList.remove(t)}hasClassName(t){return this.target.classList.contains(t)}toggleClass(t,e){return this.target.classList.toggle(t,e)}setStyle(t){Object.assign(this.target.style,t)}getStyle(t){return getComputedStyle(this.target).getPropertyValue(t)}setAttribute(t,e){this.target.setAttribute(t,e)}getAttribute(t){return this.target.getAttribute(t)}removeAttribute(t){this.target.removeAttribute(t)}on(t,e,n){this.target.addEventListener(t,e,n)}off(t,e,n){this.target.removeEventListener(t,e,n)}set html(t){this.target.innerHTML=t}get html(){return this.target.innerHTML}getBoundingRect(){return this.target.getBoundingClientRect()}isInViewport(){const t=this.target.getBoundingClientRect();return t.top>=0&&t.left>=0&&t.bottom<=(window.innerHeight||document.documentElement.clientHeight)&&t.right<=(window.innerWidth||document.documentElement.clientWidth)}prependChild(t){this.target.prepend(t)}setDisabled(t){(this.target instanceof HTMLButtonElement||this.target instanceof HTMLInputElement||this.target instanceof HTMLTextAreaElement)&&(this.target.disabled=t)}addClasses(...t){this.target.classList.add(...t)}removeClasses(...t){this.target.classList.remove(...t)}replaceClass(t,e){this.target.classList.replace(t,e)}moveTo(t){t.appendChild(this.target)}getParent(){return this.target.parentElement}getNextSibling(){return this.target.nextElementSibling}getPreviousSibling(){return this.target.previousElementSibling}hide(){this.target.style.display="none"}show(){this.target.style.removeProperty("display")}isHidden(){return"none"===window.getComputedStyle(this.target).display}scrollIntoView(t={behavior:"smooth"}){this.target.scrollIntoView(t)}matches(t){return this.target.matches(t)}getChildren(){return Array.from(this.target.children)}insertAfter(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target.nextSibling)}insertBefore(t){this.target.parentNode&&this.target.parentNode.insertBefore(t,this.target)}clearChildren(){for(;this.target.firstChild;)this.target.removeChild(this.target.firstChild)}animate(t,e){return this.target.animate(t,e)}}function m(){return new d(document.createElement("span"))}function g(t){const e=t.indexOf("$");return-1!==e?t.slice(e+1):""}class p{constructor(t){this.target=t,this.bindings=[]}addBinding(t){this.bindings.push(t)}removeBinding(t){this.bindings=this.bindings.filter((e=>e!==t))}async emit(t){await Promise.allSettled(this.bindings.map((e=>{try{const n=e(t);return n instanceof Promise?n:Promise.resolve(n)}catch(t){return Promise.reject(t)}})))}}class f{constructor(t,e){this.value=t,this.reactor=e??new p(this)}set(t){this.value=t,this.reactor.emit({type:"SET",target:this,value:t})}get(){return this.value}increase(t=1){"number"==typeof this.value&&this.set(this.value+t)}produce(e){const[n,i]=t(this.value);e(n),this.set(i())}}function v(t,e){t.reactor.addBinding(e)}function y(t,e){t.reactor.removeBinding(e)}function E(t){return new f(t)}const w={on:function(t,e,n,i){"string"==typeof i&&(i=t.findName(g(i))),e.addEventListener(n,i)},ref:function(t,e,n,i){if("string"==typeof i&&(i=t.findName(g(i))),!(i instanceof d))throw Error("Rumious: ref directive required RumiousElementRef !");i.target=e},inject:function(t,e,n,i){if("string"==typeof i&&(i=t.findName(g(i))),!(i instanceof l))throw Error("Rumious: inject directive required RumiousInjector !");i.addTarget(e),i.inject(e)},bind:function(t,e,n,i){if("string"==typeof i&&(i=t.findName(g(i))),!(i instanceof f))throw Error("Rumious: bind directive required RumiousState !");e.setAttribute(n,i.value),i.reactor.addBinding((({})=>{e.setAttribute(n,i.value)}))},model:function(t,e,n,i){if("string"==typeof i&&(i=t.findName(g(i))),!(i 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":i.set(e.checked);break;case"radio":e.checked&&i.set(e.value);break;default:i.set(e.value)}else(e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)&&i.set(e.value)}))}}};class C{domMap=new Map;constructor(t,e,n){this.state=t,this.callback=e,this.keyFn=n??((t,e)=>e)}prepare(t,e){this.anchorElement=t,this.context=e}async render(){await this.reconcile(this.state.value),this.state.reactor.addBinding(this.onStateChange.bind(this))}async onStateChange(t){if("APPEND"===t.type){const e=this.keyFn(t.item,t.key);if(!this.domMap.has(e)){const n=await this.callback(t.item,t.key),i=document.createDocumentFragment();this.context.renderHelper(this.context,n,i),this.anchorElement.appendChild(i),this.domMap.set(e,i)}}else if("SET_BY_KEY"===t.type){const e=this.keyFn(t.item,t.key),n=this.anchorElement.childNodes[t.key];if(n){const i=await this.callback(t.item,t.key),s=document.createDocumentFragment();this.context.renderHelper(this.context,i,s),this.anchorElement.replaceChild(s,n),this.domMap.set(e,s)}}else if("REMOVE_BY_KEY"===t.type){const e=this.anchorElement.childNodes[t.key];if(e){this.anchorElement.removeChild(e);const t=[...this.domMap.entries()].find((([,t])=>t===e));t&&this.domMap.delete(t[0])}}else if("INSERT_BY_KEY"===t.type){const e=this.keyFn(t.item,t.key);if(!this.domMap.has(e)){const n=await this.callback(t.item,t.key),i=document.createDocumentFragment();this.context.renderHelper(this.context,n,i);const s=this.anchorElement.childNodes[t.key]??null;this.anchorElement.insertBefore(i,s),this.domMap.set(e,i)}}else await this.reconcile(this.state.value)}async reconcile(t){const e=this.domMap,n=new Map,i=[];for(let s=0;s<t.length;s++){const r=t[s],o=this.keyFn(r,s);let a=e.get(o);if(!a){const t=await this.callback(r,s),e=document.createDocumentFragment();this.context.renderHelper(this.context,t,e),a=e}n.set(o,a),i.push(a)}this.anchorElement.textContent="";for(const t of i)this.anchorElement.appendChild(t);this.domMap=n}}function b(t,e,n){return new C(t,e,n)}async function S(t,e,n,i){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 s&&n.value.setContext(i),r.parentNode.replaceChild(n.value,r),r=n.value):n.reactor.removeBinding(o)}n.value instanceof s&&n.value.setContext(i),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 C)n.prepare(e.parentElement,i),n.render();else if(n instanceof HTMLElement)e.replaceWith(n);else if(n instanceof c){let h=document.createDocumentFragment();i.renderHelper?.(i,n,h),e.replaceWith(h)}else if(n instanceof NodeList||n instanceof HTMLCollection){if(0===n.length)return void e.remove();const l=document.createDocumentFragment();for(const u of Array.from(n))l.appendChild(u.cloneNode(!0));e.replaceWith(l),e.remove()}else if(n&&"function"==typeof n.toString)try{e.textContent=n.toString()}catch{e.textContent=""}else e.textContent=""}function T(t){return new c(t)}const k=function(...t){throw Error("Fragment element must be compiled by Rumious !")};window.RUMIOUS_JSX={template:T,createElement:function(...t){throw console.log(t),Error("Rumious doesn't use createElement !")},addDirective:function(t,e,n,i="",s){let r=w[n];if(!r)throw Error("Rumious: Cannot solve directive !");r(e,t,i,s)},dynamicValue:function(t,e,n,i){S(0,e,n,i)},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 x{constructor(t){this.target=t}list(){return Array.from(this.target.children)}getChild(t){return this.list()[t]}remove(t){this.list()[t]?.remove()}add(t){this.target.appendChild(t)}querySelector(t){return this.target.querySelector(t)}querySelectorAll(t){return this.target.querySelectorAll(t)}clear(){this.target.innerHTML=""}replaceChild(t,e){const n=this.getChild(t);n&&this.target.replaceChild(e,n)}insertBefore(t,e){const n=this.getChild(e);n?this.target.insertBefore(t,n):this.add(t)}prepend(t){this.target.prepend(t)}getFirstChild(){return this.list()[0]}getLastChild(){return this.list()[this.list().length-1]}hasChildren(){return this.target.hasChildNodes()}count(){return this.target.children.length}find(t){return this.list().find(t)}forEach(t){this.list().forEach(t)}removeAllMatching(t){this.querySelectorAll(t).forEach((t=>t.remove()))}toggleClass(t){this.list().forEach((e=>e.classList.toggle(t)))}setAttribute(t,e){this.list().forEach((n=>n.setAttribute(t,e)))}}class N extends f{constructor(t,e){super(t,e)}set(t,e){if("number"==typeof t&&void 0!==e){const n=t,i=e;this.value[n]=i,this.reactor.emit({type:"SET_BY_KEY",value:[...this.value],target:this,key:n,item:i})}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:this.value,target:this,key:t,item:e}),this}remove(t){return this.value.splice(t,1),this.reactor.emit({type:"REMOVE_BY_KEY",value:this.value,target:this,key:t}),this}append(t){return this.value.push(t),this.reactor.emit({type:"APPEND",value:this.value,target:this,item:t}),this}clear(){return this.value.length=0,this.reactor.emit({type:"SET",value:[],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:[...this.value],target:this,key:t,item:e}),this}filter(t){return this.value=this.value.filter(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}map(t){return this.value=this.value.map(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}sort(t){return this.value.sort(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}reverse(){return this.value.reverse(),this.reactor.emit({type:"SET",value:this.value,target:this}),this}get length(){return this.value.length}forEach(t){this.value.forEach(t)}}function M(t){return new N(t)}class O extends f{#t=!1;constructor(t,e){super(t,e)}set(t,e){if(this.#t)throw new Error("Object is locked");if("string"==typeof t){const n=t,i=e;return this.value[n]=i,this.reactor.emit({type:"SET_BY_KEY",value:{...this.value},target:this,key:n,item:i}),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,i])=>{e[n]=t(i,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 L(t){return new O(t)}window.RUMIOUS_CONTEXTS={};class R{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 A(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 R(t);return window.RUMIOUS_CONTEXTS[e]=n,n}}function B(t,e){let n=0;return function(...i){const s=Date.now();s-n>=e&&(n=s,t.apply(this,i))}}function H(t,e){let n;return function(...i){clearTimeout(n),n=setTimeout((()=>t.apply(this,i)),e)}}function j(t,e){let n=0,i=null,s=null;function r(){n=Date.now(),t.apply(this,i),i=null}return function(...t){const o=Date.now();i=t,o-n>=e?r.call(this):s||(s=setTimeout((()=>{s=null,r.call(this)}),e-(o-n)))}}function I(t,e){let n,i=!0;return function(...s){i&&(t.apply(this,s),i=!1),clearTimeout(n),n=setTimeout((()=>{t.apply(this,s),i=!0}),e)}}function _(t){let e=!1;return function(...n){e||(e=!0,requestAnimationFrame((()=>{t.apply(this,n),e=!1})))}}export{k as Fragment,o as RumiousApp,N as RumiousArrayState,x as RumiousChildrenRef,i as RumiousComponent,s as RumiousComponentElement,R as RumiousContext,l as RumiousDymanicInjector,d as RumiousElementRef,h as RumiousModule,O as RumiousObjectState,c as RumiousRenderTemplate,f as RumiousState,a as createApp,M as createArrayState,A as createContext,m as createElementRef,u as createHTMLInjector,L as createObjectState,E as createState,H as denounce,I as leadingTrailingDebounce,_ as rafThrottle,r as renderComponent,b as renderDynamicArray,T as template,B as tholle,j as trailingThrottle,y 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"}}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 o=Object.freeze({__proto__:null,RumiousApp:i,RumiousModule:class{},createApp:function(t,e){return new i(t,e)}});class s{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 M(t){var e;return null!==(e=t.copy)&&void 0!==e?e:t.original}function O(t){return!!k(t)}function k(t){return"object"!=typeof t?null:null==t?void 0:t[d]}function j(t){var e;const n=k(t);return n?null!==(e=n.copy)&&void 0!==e?e:n.original:t}function C(t,e){if(!t||"object"!=typeof t)return!1;let n;return Object.getPrototypeOf(t)===Object.prototype||Array.isArray(t)||t instanceof Map||t instanceof Set||!!(null==e?void 0:e.mark)&&((n=e.mark(t,y))===y.immutable||"function"==typeof n)}function R(t,e=[]){if(Object.hasOwnProperty.call(t,"key")){const n=t.parent.copy,r=k(A(n,t.key));if(null!==r&&(null==r?void 0:r.original)!==t.original)return null;const i=3===t.parent.type,o=i?Array.from(t.parent.setMap.keys()).indexOf(t.key):t.key;if(!(i&&n.size>o||b(n,o)))return null;e.push(o)}if(t.parent)return R(t.parent,e);e.reverse();try{!function(t,e){for(let n=0;n<e.length-1;n+=1){const r=e[n];if("object"!=typeof(t=A(3===x(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 x(t){return Array.isArray(t)?1:t instanceof Map?2:t instanceof Set?3:0}function A(t,e){return 2===x(t)?t.get(e):t[e]}function T(t,e,n){2===x(t)?t.set(e,n):t[e]=n}function _(t,e){const n=k(t);return(n?M(n):t)[e]}function P(t,e){return t===e?0!==t||1/t==1/e:t!=t&&e!=e}function N(t){if(t)for(;t.finalities.revoke.length>0;){t.finalities.revoke.pop()()}}function z(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 F(t){if(!C(t))return j(t);if(Array.isArray(t))return t.map(F);if(t instanceof Map){const e=Array.from(t.entries()).map((([t,e])=>[t,F(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(F);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]=F(t[n]);return e}function B(t){return O(t)?F(t):t}function H(t){var e;t.assignedMap=null!==(e=t.assignedMap)&&void 0!==e?e:new Map,t.operated||(t.operated=!0,t.parent&&H(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 o=n.has(t)?n.get(t):t;if(r.length>0){const t=r.indexOf(o);if(o&&"object"==typeof o&&-1!==t){if(r[0]===o)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(o),i.push(e)}else r.push(o)}if(Object.isFrozen(t)||O(t))return r.pop(),void i.pop();switch(x(t)){case 2:for(const[e,o]of t)V(e,e,n,r,i),V(o,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 o of t)V(o,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=x(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 U(t,e,n){if(O(t)||!C(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,((o,s)=>{var a;if(O(s)){const e=k(s);L(e);const n=(null===(a=e.assignedMap)||void 0===a?void 0:a.size)||e.operated?e.copy:e.original;T(r?i:t,o,n)}else U(s,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 K(t,e){const n=3===t.type?t.setMap:t.copy;t.finalities.revoke.length>1&&t.assignedMap.get(e)&&n&&U(A(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(j(e))})))}function $(t,e,n,r){if(t.operated&&t.assignedMap&&t.assignedMap.size>0&&!t.finalized){if(n&&r){const i=R(t);i&&e(t,i,n,r)}t.finalized=!0}}function J(t,e,n,r){const i=k(n);i&&(i.callbacks||(i.callbacks=[]),i.callbacks.push(((o,s)=>{var a;const l=3===t.type?t.setMap:t.copy;if(P(A(l,e),n)){let n=i.original;i.copy&&(n=i.copy),W(t),$(t,r,o,s),t.options.enableAutoFreeze&&(t.options.updatedValues=null!==(a=t.options.updatedValues)&&void 0!==a?a:new WeakMap,t.options.updatedValues.set(n,i.original)),T(l,e,n)}})),t.options.enableAutoFreeze&&i.finalities!==t.finalities&&(t.options.enableAutoFreeze=!1)),C(n,t.options)&&t.finalities.draft.push((()=>{P(A(3===t.type?t.setMap:t.copy,e),n)&&K(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,o,s){n.forEach(((n,a)=>{const l=A(t,a),c=B(A(e,a)),u=n?b(t,a)?p:f:h;if(P(l,c)&&u===p)return;const d=z(r.concat(a),s);i.push(u===h?{op:u,path:d}:{op:u,path:d,value:c}),o.push(u===f?{op:h,path:d}:u===h?{op:f,path:d,value:l}:{op:p,path:d,value:l})}))}(t,e,n,r,i);case 1:return function(t,e,n,r,i){let{original:o,assignedMap:s,options:a}=t,l=t.copy;l.length<o.length&&([o,l]=[l,o],[n,r]=[r,n]);for(let t=0;t<o.length;t+=1)if(s.get(t.toString())&&l[t]!==o[t]){const s=z(e.concat([t]),i);n.push({op:p,path:s,value:B(l[t])}),r.push({op:p,path:s,value:B(o[t])})}for(let t=o.length;t<l.length;t+=1){const r=z(e.concat([t]),i);n.push({op:f,path:r,value:B(l[t])})}if(o.length<l.length){const{arrayLengthAssignment:t=!0}=a.enablePatches;if(t){const t=z(e.concat(["length"]),i);r.push({op:p,path:t,value:o.length})}else for(let t=l.length;o.length<t;t-=1){const n=z(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,o){let s=0;t.forEach((t=>{if(!e.has(t)){const e=z(n.concat([s]),o);r.push({op:h,path:e,value:t}),i.unshift({op:f,path:e,value:t})}s+=1})),s=0,e.forEach((e=>{if(!t.has(e)){const t=z(n.concat([s]),o);r.push({op:f,path:t,value:e}),i.unshift({op:h,path:t,value:e})}s+=1}))}(t,e,n,r,i)}}const G=(t,e,n=!1)=>{if("object"==typeof t&&null!==t&&(!C(t,e)||n))throw new Error("Strict mode: Mutable data cannot be accessed directly, please use 'unsafe(callback)' wrap.")},Q={get size(){return M(k(this)).size},has(t){return M(k(this)).has(t)},set(t,e){const n=k(this),r=M(n);return r.has(t)&&P(r.get(t),e)||(L(n),H(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),H(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),H(t),t.assignedMap=new Map;for(const[e]of t.original)t.assignedMap.set(e,!1);t.copy.clear()}},forEach(t,e){M(k(this)).forEach(((n,r)=>{t.call(e,this.get(r),r,this)}))},get(t){var e,n;const r=k(this),i=M(r).get(t),o=(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,o),o)return i;if(r.finalized||!C(i,r.options))return i;if(i!==r.original.get(t))return i;const s=v.createDraft({original:i,parentDraft:r,key:t,finalities:r.finalities,options:r.options});return L(r),r.copy.set(t,s),s},keys(){return M(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 o=e.next();if(o.done)return o;const s=o.value;let a=t.setMap.get(s);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(s,t.options,c),c||l||!C(s,t.options)||t.finalized||!t.original.has(s))l&&(a=l.proxy);else{const e=v.createDraft({original:s,parentDraft:t,key:s,finalities:t.finalities,options:t.options});t.setMap.set(s,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),H(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),H(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),H(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 o=null===(r=t.copy)||void 0===r?void 0:r[e];if(o&&rt.has(o))return o;if(e===d)return t;let s;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(s=t.options.mark(r,y),s===y.mutable)return t.options.strict&&G(r,t.options,!0),r}const a=M(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||!C(l,t.options))return l;if(l===_(t.original,e)){if(L(t),t.copy[e]=ot({original:t.original[e],parentDraft:t,key:1===t.type?Number(e):e,finalities:t.finalities,options:t.options}),"function"==typeof s){const n=k(t.copy[e]);return L(n),H(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 o=w(M(t),e);if(null==o?void 0:o.set)return o.set.call(t.proxy,n),!0;const s=_(M(t),e),a=k(s);return a&&P(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):(P(n,s)&&(void 0!==n||b(t.original,e))||(L(t),H(t),b(t.original,e)&&P(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 M(t),ownKeys:t=>Reflect.ownKeys(M(t)),getOwnPropertyDescriptor(t,e){const n=M(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),H(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 ot(t){const{original:e,parentDraft:n,key:r,finalities:i,options:o}=t,s=x(e),a={type:s,finalized:!1,parent:n,original:e,copy:null,proxy:null,finalities:i,options:o,setMap:3===s?new Map(e.entries()):void 0};(r||"key"in t)&&(a.key=r);const{proxy:l,revoke:c}=Proxy.revocable(1===s?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,o;const s=k(l);let a=3===t.type?t.setMap:t.copy;const c=A(a,r),u=k(c);if(u){let o=u.original;u.operated&&(o=j(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(o,u.original)),T(a,r,o)}null===(o=s.callbacks)||void 0===o||o.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 st(t,e,n,r,i){var o;const s=k(t),a=null!==(o=null==s?void 0:s.original)&&void 0!==o?o:t,l=!!e.length;if(null==s?void 0:s.operated)for(;s.finalities.draft.length>0;){s.finalities.draft.pop()(n,r)}const c=l?e[0]:s?s.operated?s.copy:s.original:t;return s&&N(s),i&&V(c,c,null==s?void 0:s.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 o=k(r);if(o&&e&&o.finalities===e.finalities){t.isContainDraft=!0;const e=o.original;if(i instanceof Set){const t=Array.from(i);i.clear(),t.forEach((t=>i.add(n===t?e:t)))}else T(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(!C(t,null==n?void 0:n.options))return t;const r=x(t);if(n&&!n.operated)return n.original;let i;function o(){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{o()}finally{n.finalized=!1}}else i=t;if(q(i,((e,r)=>{if(n&&P(A(n.original,e),r))return;const s=lt(r);s!==r&&(i===t&&o(),T(i,e,s))})),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(!O(t))throw new Error(`current() is only used for Draft, parameter: ${t}`);return lt(t)}v.createDraft=ot;const ut=function t(e,n,r){var i,o,s;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=O(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!==(o=c.strict)&&void 0!==o&&o,d={enableAutoFreeze:null!==(s=c.enableAutoFreeze)&&void 0!==s&&s,mark:h,strict:f,enablePatches:p};if(!C(u,d)&&"object"==typeof u&&null!==u)throw new Error("Invalid base state: create() only supports plain objects, arrays, Set, Map or using mark() to mark the state as immutable.");const[m,v]=function(t,e){var n;const r={draft:[],revoke:[],handledSet:new WeakSet};let i,o;e.enablePatches&&(i=[],o=[]);const s=(null===(n=e.mark)||void 0===n?void 0:n.call(e,t,y))!==y.mutable&&C(t,e)?ot({original:t,parentDraft:null,finalities:r,options:e}):t;return[s,(t=[])=>{const[n,r,a]=st(s,t,i,o,e.enableAutoFreeze);return e.enablePatches?[n,r,a]:n}]}(u,d);if("function"!=typeof n){if(!C(u,d))throw new Error("Invalid base state: create() only supports plain objects, arrays, Set, Map or using mark() to mark the state as immutable.");return[m,v]}let b;try{b=l(m)}catch(t){throw N(k(m)),t}const w=t=>{const e=k(m);if(!O(t)){if(void 0!==t&&!P(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 N(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())}}const ft={on:function(t,e,n,r){"string"==typeof r&&(r=t.findName(c(r))),e.addEventListener(n,r)},ref:function(t,e,n,r){if("string"==typeof r&&(r=t.findName(c(r))),!(r instanceof l))throw Error("Rumious: ref directive required RumiousElementRef !");r.target=e},inject:function(t,e,n,r){if("string"==typeof r&&(r=t.findName(c(r))),!(r instanceof a))throw Error("Rumious: inject directive required RumiousInjector !");r.addTarget(e),r.inject(e)},bind:function(t,e,n,r){if("string"==typeof r&&(r=t.findName(c(r))),!(r instanceof pt))throw Error("Rumious: bind directive required RumiousState !");e.setAttribute(n,r.value),r.reactor.addBinding((({})=>{e.setAttribute(n,r.value)}))},model:function(t,e,n,r){if("string"==typeof r&&(r=t.findName(c(r))),!(r instanceof pt&&(e instanceof HTMLInputElement||e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)))throw Error("Rumious: model directive requires RumiousState and a valid form element!");{const t=e.type;e.addEventListener("input",(()=>{if(e instanceof HTMLInputElement)switch(t){case"checkbox":r.set(e.checked);break;case"radio":e.checked&&r.set(e.value);break;default:r.set(e.value)}else(e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)&&r.set(e.value)}))}}};class dt{domMap=new Map;constructor(t,e,n){this.state=t,this.callback=e,this.keyFn=n??((t,e)=>e)}prepare(t,e){this.anchorElement=t,this.context=e}async render(){await this.reconcile(this.state.value),this.state.reactor.addBinding(this.onStateChange.bind(this))}async onStateChange(t){if("APPEND"===t.type){const e=this.keyFn(t.item,t.key);if(!this.domMap.has(e)){const n=await this.callback(t.item,t.key),r=document.createDocumentFragment();this.context.renderHelper(this.context,n,r),this.anchorElement.appendChild(r),this.domMap.set(e,r)}}else if("SET_BY_KEY"===t.type){const e=this.keyFn(t.item,t.key),n=this.anchorElement.childNodes[t.key];if(n){const r=await this.callback(t.item,t.key),i=document.createDocumentFragment();this.context.renderHelper(this.context,r,i),this.anchorElement.replaceChild(i,n),this.domMap.set(e,i)}}else if("REMOVE_BY_KEY"===t.type){const e=this.anchorElement.childNodes[t.key];if(e){this.anchorElement.removeChild(e);const t=[...this.domMap.entries()].find((([,t])=>t===e));t&&this.domMap.delete(t[0])}}else if("INSERT_BY_KEY"===t.type){const e=this.keyFn(t.item,t.key);if(!this.domMap.has(e)){const n=await this.callback(t.item,t.key),r=document.createDocumentFragment();this.context.renderHelper(this.context,n,r);const i=this.anchorElement.childNodes[t.key]??null;this.anchorElement.insertBefore(r,i),this.domMap.set(e,r)}}else await this.reconcile(this.state.value)}async reconcile(t){const e=this.domMap,n=new Map,r=[];for(let i=0;i<t.length;i++){const o=t[i],s=this.keyFn(o,i);let a=e.get(s);if(!a){const t=await this.callback(o,i),e=document.createDocumentFragment();this.context.renderHelper(this.context,t,e),a=e}n.set(s,a),r.push(a)}this.anchorElement.textContent="";for(const t of r)this.anchorElement.appendChild(t);this.domMap=n}}async function gt(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 o=e;if(!o.parentNode)return;function a({}){document.contains(o)&&o.parentNode?(r.value instanceof n&&r.value.setContext(i),o.parentNode.replaceChild(r.value,o),o=r.value):r.reactor.removeBinding(a)}r.value instanceof n&&r.value.setContext(i),o.parentNode.replaceChild(r.value,o),o=r.value,r.reactor.addBinding(a)}else if(r&&r instanceof 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 dt)r.prepare(e.parentElement,i),r.render();else if(r instanceof HTMLElement)e.replaceWith(r);else if(r instanceof s){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 mt(t){return new s(t)}window.RUMIOUS_JSX={template:mt,createElement:function(...t){throw console.log(t),Error("Rumious doesn't use createElement !")},addDirective:function(t,e,n,r="",i){let o=ft[n];if(!o)throw Error("Rumious: Cannot solve directive !");o(e,t,r,i)},dynamicValue:function(t,e,n,r){gt(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 yt=Object.freeze({__proto__:null,Fragment:function(...t){throw Error("Fragment element must be compiled by Rumious !")},template:mt}),vt=Object.freeze({__proto__:null,RumiousDymanicInjector:a,RumiousRenderTemplate:s,createHTMLInjector:function(t){return new a([t])},renderDynamicArray:function(t,e){return new dt(t,e)}});var bt=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 wt 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:[...this.value],target:this,key:n,item:r})}else{if(!Array.isArray(t))throw new Error("Invalid arguments passed to set()");super.set(t)}}get(t){return"number"==typeof t?this.value[t]:this.value}insert(t,e){return this.value.splice(t,0,e),this.reactor.emit({type:"INSERT_BY_KEY",value:this.value,target:this,key:t,item:e}),this}remove(t){return this.value.splice(t,1),this.reactor.emit({type:"REMOVE_BY_KEY",value:this.value,target:this,key:t}),this}append(t){return this.value.push(t),this.reactor.emit({type:"APPEND",value:this.value,target:this,item:t}),this}clear(){return this.value.length=0,this.reactor.emit({type:"SET",value:[],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:[...this.value],target:this,key:t,item:e}),this}filter(t){return this.value=this.value.filter(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}map(t){return this.value=this.value.map(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}sort(t){return this.value.sort(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}reverse(){return this.value.reverse(),this.reactor.emit({type:"SET",value:this.value,target:this}),this}get length(){return this.value.length}forEach(t){this.value.forEach(t)}}class Et 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:{...this.value},target:this,key:n,item:r}),this}if("object"!=typeof t)throw new Error("Invalid arguments passed to set()");super.set(t)}remove(t){if(this.#t)throw new Error("Object is locked");return t in this.value&&(delete this.value[t],this.reactor.emit({type:"REMOVE_BY_KEY",value:{...this.value},target:this,key:t})),this}merge(t){if(this.#t)throw new Error("Object is locked");return Object.assign(this.value,t),this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}assign(t){if(this.#t)throw new Error("Object is locked");return this.value={...this.value,...t},this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}clear(){if(this.#t)throw new Error("Object is locked");for(const t in this.value)delete this.value[t];return this.reactor.emit({type:"SET",value:{},target:this}),this}get(t){return"string"==typeof t?this.value[t]:this.value}keys(){return Object.keys(this.value)}values(){return Object.values(this.value)}entries(){return Object.entries(this.value)}has(t){return t in this.value}get size(){return Object.keys(this.value).length}forEach(t){Object.entries(this.value).forEach((([e,n])=>{t(n,e,this.value)}))}map(t){const e={};return Object.entries(this.value).forEach((([n,r])=>{e[n]=t(r,n,this.value)})),e}clone(){return JSON.parse(JSON.stringify(this.value))}toJSON(){return JSON.parse(JSON.stringify(this.value))}toObject(){return this.get()}lock(){return this.#t=!0,this}unlock(){return this.#t=!1,this}get isLocked(){return this.#t}freeze(){return Object.freeze(this.value),this}unfreeze(){return this.value=JSON.parse(JSON.stringify(this.value)),this}get isFrozen(){return Object.isFrozen(this.value)}}var St=Object.freeze({__proto__:null,RumiousArrayState:wt,RumiousObjectState:Et,RumiousState:pt,createArrayState:function(t){return new wt(t)},createObjectState:function(t){return new Et(t)},createState:function(t){return new pt(t)},unwatch:function(t,e){t.reactor.removeBinding(e)},watch:function(t,e){t.reactor.addBinding(e)}});window.RUMIOUS_CONTEXTS={};class Mt{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 Ot={...r,...o,...yt,...vt,...bt,...St,...Object.freeze({__proto__:null,RumiousContext:Mt,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 Mt(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 o(){n=Date.now(),t.apply(this,r),r=null}return function(...t){const s=Date.now();r=t,s-n>=e?o.call(this):i||(i=setTimeout((()=>{i=null,o.call(this)}),e-(s-n)))}}})};window.Rumious=Ot}();
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"}}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 o=Object.freeze({__proto__:null,RumiousApp:i,RumiousModule:class{},createApp:function(t,e){return new i(t,e)}});class s{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 M(t){var e;return null!==(e=t.copy)&&void 0!==e?e:t.original}function O(t){return!!k(t)}function k(t){return"object"!=typeof t?null:null==t?void 0:t[d]}function j(t){var e;const n=k(t);return n?null!==(e=n.copy)&&void 0!==e?e:n.original:t}function C(t,e){if(!t||"object"!=typeof t)return!1;let n;return Object.getPrototypeOf(t)===Object.prototype||Array.isArray(t)||t instanceof Map||t instanceof Set||!!(null==e?void 0:e.mark)&&((n=e.mark(t,y))===y.immutable||"function"==typeof n)}function R(t,e=[]){if(Object.hasOwnProperty.call(t,"key")){const n=t.parent.copy,r=k(A(n,t.key));if(null!==r&&(null==r?void 0:r.original)!==t.original)return null;const i=3===t.parent.type,o=i?Array.from(t.parent.setMap.keys()).indexOf(t.key):t.key;if(!(i&&n.size>o||b(n,o)))return null;e.push(o)}if(t.parent)return R(t.parent,e);e.reverse();try{!function(t,e){for(let n=0;n<e.length-1;n+=1){const r=e[n];if("object"!=typeof(t=A(3===x(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 x(t){return Array.isArray(t)?1:t instanceof Map?2:t instanceof Set?3:0}function A(t,e){return 2===x(t)?t.get(e):t[e]}function T(t,e,n){2===x(t)?t.set(e,n):t[e]=n}function _(t,e){const n=k(t);return(n?M(n):t)[e]}function P(t,e){return t===e?0!==t||1/t==1/e:t!=t&&e!=e}function N(t){if(t)for(;t.finalities.revoke.length>0;){t.finalities.revoke.pop()()}}function z(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 F(t){if(!C(t))return j(t);if(Array.isArray(t))return t.map(F);if(t instanceof Map){const e=Array.from(t.entries()).map((([t,e])=>[t,F(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(F);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]=F(t[n]);return e}function B(t){return O(t)?F(t):t}function H(t){var e;t.assignedMap=null!==(e=t.assignedMap)&&void 0!==e?e:new Map,t.operated||(t.operated=!0,t.parent&&H(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 o=n.has(t)?n.get(t):t;if(r.length>0){const t=r.indexOf(o);if(o&&"object"==typeof o&&-1!==t){if(r[0]===o)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(o),i.push(e)}else r.push(o)}if(Object.isFrozen(t)||O(t))return r.pop(),void i.pop();switch(x(t)){case 2:for(const[e,o]of t)V(e,e,n,r,i),V(o,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 o of t)V(o,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=x(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 U(t,e,n){if(O(t)||!C(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,((o,s)=>{var a;if(O(s)){const e=k(s);L(e);const n=(null===(a=e.assignedMap)||void 0===a?void 0:a.size)||e.operated?e.copy:e.original;T(r?i:t,o,n)}else U(s,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 K(t,e){const n=3===t.type?t.setMap:t.copy;t.finalities.revoke.length>1&&t.assignedMap.get(e)&&n&&U(A(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(j(e))})))}function $(t,e,n,r){if(t.operated&&t.assignedMap&&t.assignedMap.size>0&&!t.finalized){if(n&&r){const i=R(t);i&&e(t,i,n,r)}t.finalized=!0}}function J(t,e,n,r){const i=k(n);i&&(i.callbacks||(i.callbacks=[]),i.callbacks.push(((o,s)=>{var a;const l=3===t.type?t.setMap:t.copy;if(P(A(l,e),n)){let n=i.original;i.copy&&(n=i.copy),W(t),$(t,r,o,s),t.options.enableAutoFreeze&&(t.options.updatedValues=null!==(a=t.options.updatedValues)&&void 0!==a?a:new WeakMap,t.options.updatedValues.set(n,i.original)),T(l,e,n)}})),t.options.enableAutoFreeze&&i.finalities!==t.finalities&&(t.options.enableAutoFreeze=!1)),C(n,t.options)&&t.finalities.draft.push((()=>{P(A(3===t.type?t.setMap:t.copy,e),n)&&K(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,o,s){n.forEach(((n,a)=>{const l=A(t,a),c=B(A(e,a)),u=n?b(t,a)?p:f:h;if(P(l,c)&&u===p)return;const d=z(r.concat(a),s);i.push(u===h?{op:u,path:d}:{op:u,path:d,value:c}),o.push(u===f?{op:h,path:d}:u===h?{op:f,path:d,value:l}:{op:p,path:d,value:l})}))}(t,e,n,r,i);case 1:return function(t,e,n,r,i){let{original:o,assignedMap:s,options:a}=t,l=t.copy;l.length<o.length&&([o,l]=[l,o],[n,r]=[r,n]);for(let t=0;t<o.length;t+=1)if(s.get(t.toString())&&l[t]!==o[t]){const s=z(e.concat([t]),i);n.push({op:p,path:s,value:B(l[t])}),r.push({op:p,path:s,value:B(o[t])})}for(let t=o.length;t<l.length;t+=1){const r=z(e.concat([t]),i);n.push({op:f,path:r,value:B(l[t])})}if(o.length<l.length){const{arrayLengthAssignment:t=!0}=a.enablePatches;if(t){const t=z(e.concat(["length"]),i);r.push({op:p,path:t,value:o.length})}else for(let t=l.length;o.length<t;t-=1){const n=z(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,o){let s=0;t.forEach((t=>{if(!e.has(t)){const e=z(n.concat([s]),o);r.push({op:h,path:e,value:t}),i.unshift({op:f,path:e,value:t})}s+=1})),s=0,e.forEach((e=>{if(!t.has(e)){const t=z(n.concat([s]),o);r.push({op:f,path:t,value:e}),i.unshift({op:h,path:t,value:e})}s+=1}))}(t,e,n,r,i)}}const G=(t,e,n=!1)=>{if("object"==typeof t&&null!==t&&(!C(t,e)||n))throw new Error("Strict mode: Mutable data cannot be accessed directly, please use 'unsafe(callback)' wrap.")},Q={get size(){return M(k(this)).size},has(t){return M(k(this)).has(t)},set(t,e){const n=k(this),r=M(n);return r.has(t)&&P(r.get(t),e)||(L(n),H(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),H(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),H(t),t.assignedMap=new Map;for(const[e]of t.original)t.assignedMap.set(e,!1);t.copy.clear()}},forEach(t,e){M(k(this)).forEach(((n,r)=>{t.call(e,this.get(r),r,this)}))},get(t){var e,n;const r=k(this),i=M(r).get(t),o=(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,o),o)return i;if(r.finalized||!C(i,r.options))return i;if(i!==r.original.get(t))return i;const s=v.createDraft({original:i,parentDraft:r,key:t,finalities:r.finalities,options:r.options});return L(r),r.copy.set(t,s),s},keys(){return M(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 o=e.next();if(o.done)return o;const s=o.value;let a=t.setMap.get(s);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(s,t.options,c),c||l||!C(s,t.options)||t.finalized||!t.original.has(s))l&&(a=l.proxy);else{const e=v.createDraft({original:s,parentDraft:t,key:s,finalities:t.finalities,options:t.options});t.setMap.set(s,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),H(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),H(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),H(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 o=null===(r=t.copy)||void 0===r?void 0:r[e];if(o&&rt.has(o))return o;if(e===d)return t;let s;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(s=t.options.mark(r,y),s===y.mutable)return t.options.strict&&G(r,t.options,!0),r}const a=M(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||!C(l,t.options))return l;if(l===_(t.original,e)){if(L(t),t.copy[e]=ot({original:t.original[e],parentDraft:t,key:1===t.type?Number(e):e,finalities:t.finalities,options:t.options}),"function"==typeof s){const n=k(t.copy[e]);return L(n),H(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 o=w(M(t),e);if(null==o?void 0:o.set)return o.set.call(t.proxy,n),!0;const s=_(M(t),e),a=k(s);return a&&P(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):(P(n,s)&&(void 0!==n||b(t.original,e))||(L(t),H(t),b(t.original,e)&&P(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 M(t),ownKeys:t=>Reflect.ownKeys(M(t)),getOwnPropertyDescriptor(t,e){const n=M(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),H(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 ot(t){const{original:e,parentDraft:n,key:r,finalities:i,options:o}=t,s=x(e),a={type:s,finalized:!1,parent:n,original:e,copy:null,proxy:null,finalities:i,options:o,setMap:3===s?new Map(e.entries()):void 0};(r||"key"in t)&&(a.key=r);const{proxy:l,revoke:c}=Proxy.revocable(1===s?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,o;const s=k(l);let a=3===t.type?t.setMap:t.copy;const c=A(a,r),u=k(c);if(u){let o=u.original;u.operated&&(o=j(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(o,u.original)),T(a,r,o)}null===(o=s.callbacks)||void 0===o||o.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 st(t,e,n,r,i){var o;const s=k(t),a=null!==(o=null==s?void 0:s.original)&&void 0!==o?o:t,l=!!e.length;if(null==s?void 0:s.operated)for(;s.finalities.draft.length>0;){s.finalities.draft.pop()(n,r)}const c=l?e[0]:s?s.operated?s.copy:s.original:t;return s&&N(s),i&&V(c,c,null==s?void 0:s.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 o=k(r);if(o&&e&&o.finalities===e.finalities){t.isContainDraft=!0;const e=o.original;if(i instanceof Set){const t=Array.from(i);i.clear(),t.forEach((t=>i.add(n===t?e:t)))}else T(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(!C(t,null==n?void 0:n.options))return t;const r=x(t);if(n&&!n.operated)return n.original;let i;function o(){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{o()}finally{n.finalized=!1}}else i=t;if(q(i,((e,r)=>{if(n&&P(A(n.original,e),r))return;const s=lt(r);s!==r&&(i===t&&o(),T(i,e,s))})),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(!O(t))throw new Error(`current() is only used for Draft, parameter: ${t}`);return lt(t)}v.createDraft=ot;const ut=function t(e,n,r){var i,o,s;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=O(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!==(o=c.strict)&&void 0!==o&&o,d={enableAutoFreeze:null!==(s=c.enableAutoFreeze)&&void 0!==s&&s,mark:h,strict:f,enablePatches:p};if(!C(u,d)&&"object"==typeof u&&null!==u)throw new Error("Invalid base state: create() only supports plain objects, arrays, Set, Map or using mark() to mark the state as immutable.");const[m,v]=function(t,e){var n;const r={draft:[],revoke:[],handledSet:new WeakSet};let i,o;e.enablePatches&&(i=[],o=[]);const s=(null===(n=e.mark)||void 0===n?void 0:n.call(e,t,y))!==y.mutable&&C(t,e)?ot({original:t,parentDraft:null,finalities:r,options:e}):t;return[s,(t=[])=>{const[n,r,a]=st(s,t,i,o,e.enableAutoFreeze);return e.enablePatches?[n,r,a]:n}]}(u,d);if("function"!=typeof n){if(!C(u,d))throw new Error("Invalid base state: create() only supports plain objects, arrays, Set, Map or using mark() to mark the state as immutable.");return[m,v]}let b;try{b=l(m)}catch(t){throw N(k(m)),t}const w=t=>{const e=k(m);if(!O(t)){if(void 0!==t&&!P(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 N(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())}}const ft={on:function(t,e,n,r){"string"==typeof r&&(r=t.findName(c(r))),e.addEventListener(n,r)},ref:function(t,e,n,r){if("string"==typeof r&&(r=t.findName(c(r))),!(r instanceof l))throw Error("Rumious: ref directive required RumiousElementRef !");r.target=e},inject:function(t,e,n,r){if("string"==typeof r&&(r=t.findName(c(r))),!(r instanceof a))throw Error("Rumious: inject directive required RumiousInjector !");r.addTarget(e),r.inject(e)},bind:function(t,e,n,r){if("string"==typeof r&&(r=t.findName(c(r))),!(r instanceof pt))throw Error("Rumious: bind directive required RumiousState !");e.setAttribute(n,r.value),r.reactor.addBinding((({})=>{e.setAttribute(n,r.value)}))},model:function(t,e,n,r){if("string"==typeof r&&(r=t.findName(c(r))),!(r instanceof pt&&(e instanceof HTMLInputElement||e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)))throw Error("Rumious: model directive requires RumiousState and a valid form element!");{const t=e.type;e.addEventListener("input",(()=>{if(e instanceof HTMLInputElement)switch(t){case"checkbox":r.set(e.checked);break;case"radio":e.checked&&r.set(e.value);break;default:r.set(e.value)}else(e instanceof HTMLSelectElement||e instanceof HTMLTextAreaElement)&&r.set(e.value)}))}}};class dt{domMap=new Map;constructor(t,e,n){this.state=t,this.callback=e,this.keyFn=n??((t,e)=>e)}prepare(t,e){this.anchorElement=t,this.context=e}async render(){await this.reconcile(this.state.value),this.state.reactor.addBinding(this.onStateChange.bind(this))}async onStateChange(t){if("APPEND"===t.type){const e=this.keyFn(t.item,t.key);if(!this.domMap.has(e)){const n=await this.callback(t.item,t.key),r=document.createDocumentFragment();this.context.renderHelper(this.context,n,r),this.anchorElement.appendChild(r),this.domMap.set(e,r)}}else if("SET_BY_KEY"===t.type){const e=this.keyFn(t.item,t.key),n=this.anchorElement.childNodes[t.key];if(n){const r=await this.callback(t.item,t.key),i=document.createDocumentFragment();this.context.renderHelper(this.context,r,i),this.anchorElement.replaceChild(i,n),this.domMap.set(e,i)}}else if("REMOVE_BY_KEY"===t.type){const e=this.anchorElement.childNodes[t.key];if(e){this.anchorElement.removeChild(e);const t=[...this.domMap.entries()].find((([,t])=>t===e));t&&this.domMap.delete(t[0])}}else if("INSERT_BY_KEY"===t.type){const e=this.keyFn(t.item,t.key);if(!this.domMap.has(e)){const n=await this.callback(t.item,t.key),r=document.createDocumentFragment();this.context.renderHelper(this.context,n,r);const i=this.anchorElement.childNodes[t.key]??null;this.anchorElement.insertBefore(r,i),this.domMap.set(e,r)}}else await this.reconcile(this.state.value)}async reconcile(t){const e=this.domMap,n=new Map,r=[];for(let i=0;i<t.length;i++){const o=t[i],s=this.keyFn(o,i);let a=e.get(s);if(!a){const t=await this.callback(o,i),e=document.createDocumentFragment();this.context.renderHelper(this.context,t,e),a=e}n.set(s,a),r.push(a)}this.anchorElement.textContent="";for(const t of r)this.anchorElement.appendChild(t);this.domMap=n}}async function gt(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 o=e;if(!o.parentNode)return;function a({}){document.contains(o)&&o.parentNode?(r.value instanceof n&&r.value.setContext(i),o.parentNode.replaceChild(r.value,o),o=r.value):r.reactor.removeBinding(a)}r.value instanceof n&&r.value.setContext(i),o.parentNode.replaceChild(r.value,o),o=r.value,r.reactor.addBinding(a)}else if(r&&r instanceof 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 dt)r.prepare(e.parentElement,i),r.render();else if(r instanceof HTMLElement)e.replaceWith(r);else if(r instanceof s){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 mt(t){return new s(t)}window.RUMIOUS_JSX={template:mt,createElement:function(...t){throw console.log(t),Error("Rumious doesn't use createElement !")},addDirective:function(t,e,n,r="",i){let o=ft[n];if(!o)throw Error("Rumious: Cannot solve directive !");o(e,t,r,i)},dynamicValue:function(t,e,n,r){gt(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 yt=Object.freeze({__proto__:null,Fragment:function(...t){throw Error("Fragment element must be compiled by Rumious !")},template:mt}),vt=Object.freeze({__proto__:null,RumiousDymanicInjector:a,RumiousRenderTemplate:s,createHTMLInjector:function(t){return new a([t])},renderDynamicArray:function(t,e,n){return new dt(t,e,n)}});var bt=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 wt 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:[...this.value],target:this,key:n,item:r})}else{if(!Array.isArray(t))throw new Error("Invalid arguments passed to set()");super.set(t)}}get(t){return"number"==typeof t?this.value[t]:this.value}insert(t,e){return this.value.splice(t,0,e),this.reactor.emit({type:"INSERT_BY_KEY",value:this.value,target:this,key:t,item:e}),this}remove(t){return this.value.splice(t,1),this.reactor.emit({type:"REMOVE_BY_KEY",value:this.value,target:this,key:t}),this}append(t){return this.value.push(t),this.reactor.emit({type:"APPEND",value:this.value,target:this,item:t}),this}clear(){return this.value.length=0,this.reactor.emit({type:"SET",value:[],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:[...this.value],target:this,key:t,item:e}),this}filter(t){return this.value=this.value.filter(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}map(t){return this.value=this.value.map(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}sort(t){return this.value.sort(t),this.reactor.emit({type:"SET",value:this.value,target:this}),this}reverse(){return this.value.reverse(),this.reactor.emit({type:"SET",value:this.value,target:this}),this}get length(){return this.value.length}forEach(t){this.value.forEach(t)}}class Et 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:{...this.value},target:this,key:n,item:r}),this}if("object"!=typeof t)throw new Error("Invalid arguments passed to set()");super.set(t)}remove(t){if(this.#t)throw new Error("Object is locked");return t in this.value&&(delete this.value[t],this.reactor.emit({type:"REMOVE_BY_KEY",value:{...this.value},target:this,key:t})),this}merge(t){if(this.#t)throw new Error("Object is locked");return Object.assign(this.value,t),this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}assign(t){if(this.#t)throw new Error("Object is locked");return this.value={...this.value,...t},this.reactor.emit({type:"SET",value:{...this.value},target:this}),this}clear(){if(this.#t)throw new Error("Object is locked");for(const t in this.value)delete this.value[t];return this.reactor.emit({type:"SET",value:{},target:this}),this}get(t){return"string"==typeof t?this.value[t]:this.value}keys(){return Object.keys(this.value)}values(){return Object.values(this.value)}entries(){return Object.entries(this.value)}has(t){return t in this.value}get size(){return Object.keys(this.value).length}forEach(t){Object.entries(this.value).forEach((([e,n])=>{t(n,e,this.value)}))}map(t){const e={};return Object.entries(this.value).forEach((([n,r])=>{e[n]=t(r,n,this.value)})),e}clone(){return JSON.parse(JSON.stringify(this.value))}toJSON(){return JSON.parse(JSON.stringify(this.value))}toObject(){return this.get()}lock(){return this.#t=!0,this}unlock(){return this.#t=!1,this}get isLocked(){return this.#t}freeze(){return Object.freeze(this.value),this}unfreeze(){return this.value=JSON.parse(JSON.stringify(this.value)),this}get isFrozen(){return Object.isFrozen(this.value)}}var St=Object.freeze({__proto__:null,RumiousArrayState:wt,RumiousObjectState:Et,RumiousState:pt,createArrayState:function(t){return new wt(t)},createObjectState:function(t){return new Et(t)},createState:function(t){return new pt(t)},unwatch:function(t,e){t.reactor.removeBinding(e)},watch:function(t,e){t.reactor.addBinding(e)}});window.RUMIOUS_CONTEXTS={};class Mt{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 Ot={...r,...o,...yt,...vt,...bt,...St,...Object.freeze({__proto__:null,RumiousContext:Mt,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 Mt(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 o(){n=Date.now(),t.apply(this,r),r=null}return function(...t){const s=Date.now();r=t,s-n>=e?o.call(this):i||(i=setTimeout((()=>{i=null,o.call(this)}),e-(s-n)))}}})};window.Rumious=Ot}();
@@ -16,5 +16,5 @@ export declare class RumiousDynamicArrayRenderer<T> {
16
16
  onStateChange(commit: RumiousStateCommit<typeof this.state.value>): Promise<void>;
17
17
  private reconcile;
18
18
  }
19
- export declare function renderDynamicArray<T>(state: RumiousArrayState<T>, callback: RumiousDynamicArrayRenderFn): RumiousDynamicArrayRenderer<T>;
19
+ export declare function renderDynamicArray<T>(state: RumiousArrayState<T>, callback: RumiousDynamicArrayRenderFn, keyFn?: (item: any, index: any) => any): RumiousDynamicArrayRenderer<T>;
20
20
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "rumious",
3
- "version": "1.0.4",
3
+ "version": "1.0.5",
4
4
  "description": "Simple framework for building UI ",
5
5
  "main": "./dist/index.cjs",
6
6
  "module": "./dist/index.esm.js",