literaljs 8.0.1 → 8.0.3
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/build/index.js +1 -1
- package/build/index.m.js +1 -1
- package/build/index.modern.mjs +1 -1
- package/build/index.umd.js +1 -1
- package/package.json +12 -3
package/build/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
class e{constructor(e,t,n){void 0===t&&(t={}),void 0===n&&(n=[]),this.e=e,this.a=t,this.c=n}withLifecycle(e){return e.mounted&&(this.m=e.mounted),e.updated&&(this.up=e.updated),e.unmounted&&(this.un=e.unmounted),e.deleteState&&(this.d=e.deleteState),this}withIdentity(e,t){return this.definitionId=e,this.instanceId=t,this.id=e+"_"+t,this}}function t(e,n){for(let s=0,i=n.length;s<i;s++)Array.isArray(n[s])?t(e,n[s]):e.push(n[s]);return e}function n(){return Math.random().toString(36).substring(2)+(new Date).getTime().toString(36)}class s{constructor(e,t,n,s,i,o){this.definitionId=e,this.instanceId=t,this.name=n,this.key=`${e}_${t}_${n}`,this.props=s,this._stateManager=o,this._config=i,o.createState(this.key,i.state),this.mounted=i.mounted.bind(this),this.updated=i.updated.bind(this),this.unmounted=i.unmounted.bind(this),this.deleteState=()=>{this._stateManager.deleteState(this.key)},this._renderedVNode=null,this._previousProps=null;const r=i.render.bind(this);this.render=()=>{if(!this.shouldUpdate())return this._renderedVNode;const e=r();return this._renderedVNode=e,this._previousProps=this.props,e}}getStore(){return this._stateManager.getStore()}setStore(e,t){this._stateManager.setStore(e,t)}getState(){return this._stateManager.getState(this.key)}setState(e,t){this._stateManager.setState(this.key,e,t)}createState(){this._stateManager.createState(this.key,this._config.state)}deleteState(){this._stateManager.deleteState(this.key)}shouldUpdate(){return!this._previousProps||!function(e,t){if(e===t)return!0;if(!e||!t||"object"!=typeof e||"object"!=typeof t)return!1;const n=Object.keys(e),s=Object.keys(t);if(n.length!==s.length)return!1;for(let s=0;s<n.length;s++)if(e[n[s]]!==t[n[s]])return!1;return!0}(this.props,this._previousProps)}bindMethods(e){"function"==typeof e&&(e=e.bind(this)());for(let t in e)this[t]=e[t].bind(this)}}function i(e,t){for(let n in t)e[n]=t[n];return e}class o{constructor(e){void 0===e&&(e={}),this.store={...e},this.componentStates={},this.listeners=[]}subscribe(e){this.listeners.push(e)}unsubscribe(e){const t=this.listeners.indexOf(e);t>-1&&this.listeners.splice(t,1)}_notify(){for(let e=0;e<this.listeners.length;e++)this.listeners[e]()}getStore(){return{...this.store}}setStore(e,t){"function"==typeof e&&(e=e(this.store)),this.store=i(i({},this.store),e),this._notify(),"function"==typeof t&&t()}createState(e,t){e in this.componentStates||(this.componentStates[e]={...t})}getState(e){return{...this.componentStates[e]}}setState(e,t,n){"function"==typeof t&&(t=t(this.componentStates[e])),this.componentStates[e]=i(i({},this.componentStates[e]),t),this._notify(),"function"==typeof n&&n()}deleteState(e){delete this.componentStates[e]}reset(){this.store={},this.componentStates={},this.listeners=[]}}class r{constructor(e,t,n){this.eventManager=e,this.lifecycleQueue=t,this.diffEngine=n}mount(e,t){const n=this.createElement(t);n&&e.appendChild(n)}createElement(e){const t=typeof e;return"string"===t||"number"===t?document.createTextNode(e):"boolean"===t||"undefined"===t?document.createTextNode(""):"object"===t&&e.e?this._createElementNode(e):null}_createElementNode(e){const t=document.createElement(e.e);if("object"==typeof e.a){const n=Object.keys(e.a);for(let s=n.length;s--;)if("events"===n[s])e.eid=this.eventManager.bindEvents(t,e.a[n[s]]);else if("style"===n[s])this._addStyles(e.a[n[s]],t);else{if("key"===n[s])continue;t.setAttribute(n[s],e.a[n[s]])}}if(this.lifecycleQueue.mounted(e),Array.isArray(e.c))for(let n=0,s=e.c.length;n<s;n++){const s=this.createElement(e.c[n]);s&&t.appendChild(s)}return t}_addStyles(e,t){if(void 0===e)return;const n=Object.keys(e);for(let s=n.length;s--;)t.style[n[s]]=e[n[s]]}patch(e,t,n,s){const i=typeof n;if(void 0===s)this._appendChild(e,n);else if("undefined"===i)this._unmountNodeAndChildren(s),t&&t.remove();else if(this.diffEngine.areNodesEqual(n,s)){if("object"===i&&n.e){if(n===s)return;if(this._updateNodes(t,n,s),n.c!==s.c)if(this.diffEngine._hasKeys(n.c)||this.diffEngine._hasKeys(s.c))this.diffEngine.reconcileChildren(t,n.c,s.c,this);else{let e;for(let i=s.c?s.c.length:0;i--&&void 0===n.c[i];)e=t.lastChild,e&&(this._unmountNodeAndChildren(s.c[i]),e.remove());if(Array.isArray(n.c))for(let e=0,i=n.c.length;e<i;e++)this.patch(t,t.childNodes[e]||null,n.c[e],s.c?s.c[e]:void 0)}}}else if(!t||3!==t.nodeType||"string"!==i&&"number"!==i)this._unmountNodeAndChildren(s),t&&e.replaceChild(this.createElement(n),t);else{const e=String(n);t.textContent!==e&&(t.textContent=e)}}_appendChild(e,t){const n=this.createElement(t);n&&e.appendChild(n)}_updateNodes(e,t,n){if(this.lifecycleQueue.updated(t),t.a===n.a)return;if(!t.a||!n.a)return;const s=Object.keys(t.a);let i,o;for(let r=s.length;r--;)if(o=t.a[s[r]],i=n.a[s[r]],"style"===s[r]){if(this._stylesAreEqual(o,i))continue;e.removeAttribute(s[r]),this._addStyles(o,e)}else if("events"===s[r])this.eventManager.unbindEvents(e,n.eid),t.eid=this.eventManager.bindEvents(e,o);else{if("key"===s[r])continue;"value"===s[r]&&o!==i?e.value=o:void 0!==i&&o===i||e.setAttribute(s[r],o)}}_stylesAreEqual(e,t){if(e===t)return!0;const n=typeof e,s=typeof t;if("undefined"===n&&"undefined"===s)return!0;if("object"!==n||"object"!==s)return!1;const i=Object.keys(e),o=Object.keys(t);if(i.length!==o.length)return!1;for(let n=i.length;n--;)if(e[i[n]]!==t[i[n]])return!1;return!0}_unmountNodeAndChildren(e){if(null!=e&&(this.lifecycleQueue.unmounted(e),this.lifecycleQueue.deleteState(e),this.eventManager.deleteCachedEvent(e.eid),Array.isArray(e.c)))for(let t=e.c.length;t--;)this._unmountNodeAndChildren(e.c[t])}unmount(e,t){this._unmountNodeAndChildren(t),e&&(e.innerHTML="")}}class h{constructor(e,t,n){this._getCache=e,this._resolveUUID=t,this._elementToUUID=n,this._attachedTypes=new Set,this._rootNode=null}attach(e,t){this._attachedTypes.has(t)||(this._attachedTypes.add(t),this._rootNode=e,e._literaljs_hasEvents=!0,e.addEventListener(t,e=>this._handle(e)))}_handle(e){if(!this._rootNode||!this._rootNode._literaljs_hasEvents)return;let t=e.target;for(;t&&t!==this._rootNode;){let n;if(this._elementToUUID&&(n=this._elementToUUID.get(t))){const t=this._getCache(n);if(t&&"function"==typeof t[e.type])return void t[e.type](e)}const s=this._resolveUUID(t);if("string"==typeof s){const t=this._getCache(s);if(t&&"function"==typeof t[e.type])return void t[e.type](e)}t=t.parentNode}}reset(){this._attachedTypes.clear()}}const d=["abort","blur","error","focus","load","mouseenter","mouseleave","resize","scroll","unload"],c="eid";class u{constructor(){this.cache={},this.rootNode=null,this._elementToUUID=new WeakMap,this.eventBus=new h(e=>this.cache[e],e=>this.getEventUUID(e),this._elementToUUID)}setRootNode(e){this.rootNode=e}getEventUUID(e){if(!e||!e.parentNode)return;if("#document"===e.parentNode.nodeName)return;const t=e.getAttribute("data-"+c);return"string"==typeof t?t:this.getEventUUID(e.parentNode)}bindEvents(e,t){const s=n();e.setAttribute("data-"+c,s),this.cache[s]=t,this._elementToUUID.set(e,s);const i=Object.keys(t);for(let t=i.length;t--;)d.includes(i[t])?e.addEventListener(i[t],this.cache[s][i[t]]):this.eventBus.attach(this.rootNode,i[t]);return s}unbindEvents(e,t){if(!this.cache[t])return;const n=Object.keys(this.cache[t]);for(let s=n.length;s--;)d.includes(n[s])&&e.removeEventListener(n[s],this.cache[t][n[s]]);this.deleteCachedEvent(t),this._elementToUUID.delete(e),e.removeAttribute("data-"+c)}addEvents(e,t,n){n.setAttribute("data-"+c,e),this.cache[e]=t,this._elementToUUID.set(n,e);const s=Object.keys(t);for(let t=s.length;t--;)d.includes(s[t])?n.addEventListener(s[t],this.cache[e][s[t]]):this.eventBus.attach(this.rootNode,s[t])}removeIndividualEvents(e,t){if(!this.cache[t])return;const n=Object.keys(this.cache[t]);for(let s=n.length;s--;)d.includes(n[s])&&e.removeEventListener(n[s],this.cache[t][n[s]])}deleteCachedEvent(e){"string"==typeof e&&delete this.cache[e]}destroy(){this.rootNode&&(this.rootNode._literaljs_hasEvents=!1),this.cache={},this.rootNode=null,this.eventBus.reset()}}class a{constructor(){this.queue=[]}mounted(e){"object"==typeof e&&"function"==typeof e.m&&this.queue.push(e.m)}updated(e){"object"==typeof e&&"function"==typeof e.up&&this.queue.push(e.up)}unmounted(e){"object"==typeof e&&"function"==typeof e.un&&this.queue.push(e.un)}deleteState(e){"object"==typeof e&&"function"==typeof e.d&&this.queue.push(e.d)}flush(){let e;for(;e=this.queue.shift();)e()}clear(){this.queue=[]}}function l(t,n){if(null==t)return t;if("function"==typeof t.e){const e={...t.a.props};delete(t={e:t.e,a:{...t.a},c:t.c}).a.props,t=t.e(e)}if(t&&"function"==typeof t.bind){const s=t.bind(n);let i;try{i=s.render()}catch(e){console.error("Component render error:",e),i={e:"div",a:{class:"error-boundary"},c:[`${e.name}: ${e.message}`]}}if("object"==typeof i&&null!==i&&i instanceof e)i.withIdentity(t.definitionId||s.definitionId,t.instanceId||s.instanceId),i.withLifecycle({mounted:s.mounted,updated:s.updated,unmounted:s.unmounted,deleteState:s.deleteState}),t=i;else if("object"==typeof i&&null!==i){const n=new e(i.e,i.a,i.c);n.withIdentity(t.definitionId||s.definitionId,t.instanceId||s.instanceId),n.withLifecycle({mounted:s.mounted,updated:s.updated,unmounted:s.unmounted,deleteState:s.deleteState}),t=n}else t=i}if(t&&Array.isArray(t.c))for(let e=0,s=t.c.length;e<s;e++)t.c[e]=l(t.c[e],n);return t}class f{areNodesEqual(e,t){const n=typeof e;return n===typeof t&&("object"===n&&e.e===t.e&&e.id===t.id||("string"===n||"number"===n)&&e===t)}reconcileChildren(e,t,n,s){return Array.isArray(t)?this._hasKeys(t)||this._hasKeys(n)?this._reconcileKeyed(e,t,n,s):this._reconcileNonKeyed(e,t,n,s):0}_reconcileNonKeyed(e,t,n,s){const i=t.length;if(0===i){if(n)for(let e=0;e<n.length;e++)s._unmountNodeAndChildren(n[e]);return e.innerHTML="",0}const o=e.childNodes;for(let r=0;r<i;r++)s.patch(e,o[r]||null,t[r],n?n[r]:void 0);return i}_hasKeys(e){if(!Array.isArray(e))return!1;for(let t=0,n=e.length;t<n;t++)if(e[t]&&e[t].a&&null!=e[t].a.key)return!0;return!1}_reconcileKeyed(e,t,n,s){const i=n?n.length:0,o=t.length;if(0===o){for(let e=0;e<i;e++)s._unmountNodeAndChildren(n[e]);return e.innerHTML="",0}const r=Object.create(null),h=Object.create(null);for(let t=0;t<i;t++){const s=n[t].a?n[t].a.key:null,i=e.childNodes[t];null!=s&&i&&(r[s]=i,h[s]=n[t])}const d=new Array(o),c=new Array(o);for(let e=0;e<o;e++){const n=t[e].a?t[e].a.key:null;null!=n&&r[n]?(d[e]=r[n],c[e]=h[n],delete r[n]):(d[e]=null,c[e]=null)}for(const t in r){const n=r[t];n&&(s.patch(e,n,void 0,h[t]),n.remove())}let u=e.firstChild;for(let n=0;n<o;n++){const i=d[n];if(i&&i===u)u=u.nextSibling;else if(i)e.insertBefore(i,u);else{const i=s.createElement(t[n]);i&&e.insertBefore(i,u)}}for(;u;){const e=u.nextSibling;u.remove(),u=e}for(let n=0;n<o;n++)c[n]&&s.patch(e,e.childNodes[n],t[n],c[n]);return o}removeExtraChildren(e,t,n,s){const i=t.c?t.c.length:0;if(!(i<=n))for(let o=i;o-- >n;){const n=e.lastChild;n&&(s._unmountNodeAndChildren(t.c[o]),n.remove())}}}class p{constructor(e,t,n){this.generateTree=e||l,this.renderer=t,this.lifecycleQueue=n}mount(e,t,n){const s=this.generateTree(t(),n);return this.renderer.mount(e,s),this.lifecycleQueue.flush(),s}update(e,t,n,s){const i=this.generateTree(t(),n);return this.renderer.patch(e,e.firstChild,i,s),this.lifecycleQueue.flush(),i}unmount(e,t){t&&(this.renderer.unmount(e,t),this.lifecycleQueue.flush())}}class y{constructor(e,t){void 0===t&&(t="microtask"),this._renderFn=e,this._scheduler=t,this._scheduled=!1}schedule(){this._scheduled||(this._scheduled=!0,"microtask"===this._scheduler?Promise.resolve().then(()=>this._execute()):"sync"===this._scheduler&&this._execute())}_execute(){this._scheduled=!1,this._renderFn()}}class m{constructor(e,t){void 0===t&&(t={}),this.rootComponent=e,this.savedTree=e,this.currentTree=null,this.rootNode=null,this.stateManager=new o(t),this.lifecycleQueue=new a,this.eventManager=new u,this.renderer=new r(this.eventManager,this.lifecycleQueue,new f),this.mountOrchestrator=new p(l,this.renderer,this.lifecycleQueue),this.updateLoop=new y(()=>this.update(),"microtask"),this._boundSchedule=()=>this.updateLoop.schedule(),this.stateManager.subscribe(this._boundSchedule)}mount(e){if(this.rootNode=document.getElementById(e),!this.rootNode)throw new Error(`Cannot mount app: element with id "${e}" not found`);return this.eventManager.setRootNode(this.rootNode),this.currentTree=this.mountOrchestrator.mount(this.rootNode,this.savedTree,this.stateManager),this}unmount(){this.mountOrchestrator.unmount(this.rootNode,this.currentTree),this.eventManager.destroy(),this.stateManager.unsubscribe(()=>this.updateLoop.schedule()),this.rootNode&&(this.rootNode.innerHTML=""),this.currentTree=null,this.rootNode=null}scheduleUpdate(){this.updateLoop.schedule()}update(){this.rootNode&&this.savedTree&&(this.currentTree=this.mountOrchestrator.update(this.rootNode,this.savedTree,this.stateManager,this.currentTree))}getStore(){return this.stateManager.getStore()}setStore(e,t){this.stateManager.setStore(e,t)}}exports.App=m,exports.EventManager=u,exports.LifecycleQueue=a,exports.Renderer=r,exports.StateManager=o,exports.component=function(e){let t=void 0===e?{}:e,i=t.name,o=void 0===i?"":i,r=t.state,h=void 0===r?{}:r,d=t.mounted,c=void 0===d?function(){}:d,u=t.updated,a=void 0===u?function(){}:u,l=t.unmounted,f=void 0===l?function(){}:l,p=t.methods,y=void 0===p?function(){}:p,m=t.render,_=void 0===m?function(){}:m;const g=n(),v=new Map;return function(e){void 0===e&&(e={});const t=e.key||"__default__";if(!v.has(t)){const i=n(),r=o+(e.key?"_"+e.key:"");v.set(t,{definitionId:g,instanceId:i,key:`${g}_${i}_${r}`,_props:null,_cachedRender:null,bind(e){const t=new s(g,i,r,this._props,{state:h,mounted:c,updated:a,unmounted:f,methods:y,render:_},e);return t.bindMethods(y),t}})}const i=v.get(t);return i._props=e,i}},exports.createApp=function(e,t,n){const s=new m(e,n);return s.mount(t),s},exports.flatten=t,exports.generateTree=l,exports.generateUUID=n,exports.h=function(n,s){const i={};for(let e in s)i[e]=s[e];return new e(n,i,t([],[].slice.call(arguments,2)))},exports.isVNode=function(t){return t instanceof e||null!==t&&"object"==typeof t&&"e"in t},exports.render=function(e,t,n){void 0===n&&(n={});const s=new m(e,n);return s.mount(t),s};
|
|
1
|
+
class e{constructor(e,t,n){void 0===t&&(t={}),void 0===n&&(n=[]),this.e=e,this.a=t,this.c=n}withLifecycle(e){return e.mounted&&(this.m=e.mounted),e.updated&&(this.up=e.updated),e.unmounted&&(this.un=e.unmounted),e.deleteState&&(this.d=e.deleteState),this}withIdentity(e,t){return this.definitionId=e,this.instanceId=t,this.id=e+"_"+t,this}}function t(e,n){for(let s=0,i=n.length;s<i;s++)Array.isArray(n[s])?t(e,n[s]):e.push(n[s]);return e}function n(){return Math.random().toString(36).substring(2)+(new Date).getTime().toString(36)}class s{constructor(e,t,n,s,i,o){this.definitionId=e,this.instanceId=t,this.name=n,this.key=`${e}_${t}_${n}`,this.props=s,this._stateManager=o,this._config=i,o.createState(this.key,i.state),this.mounted=i.mounted.bind(this),this.updated=i.updated.bind(this),this.unmounted=i.unmounted.bind(this),this.deleteState=()=>{this._stateManager.deleteState(this.key)},this._renderedVNode=null,this._previousProps=null;const r=i.render.bind(this);this.render=()=>{if(!this.shouldUpdate())return this._renderedVNode;const e=r();return this._renderedVNode=e,this._previousProps=this.props,e}}getStore(){return this._stateManager.getStore()}setStore(e,t){this._stateManager.setStore(e,t)}getState(){return this._stateManager.getState(this.key)}setState(e,t){this._stateManager.setState(this.key,e,t)}createState(){this._stateManager.createState(this.key,this._config.state)}deleteState(){this._stateManager.deleteState(this.key)}shouldUpdate(){return!this._previousProps||!function(e,t){if(e===t)return!0;if(!e||!t||"object"!=typeof e||"object"!=typeof t)return!1;const n=Object.keys(e),s=Object.keys(t);if(n.length!==s.length)return!1;for(let s=0;s<n.length;s++)if(e[n[s]]!==t[n[s]])return!1;return!0}(this.props,this._previousProps)}bindMethods(e){"function"==typeof e&&(e=e.bind(this)());for(let t in e)this[t]=e[t].bind(this)}}function i(e,t){for(let n in t)e[n]=t[n];return e}class o{constructor(e){void 0===e&&(e={}),this.store={...e},this.componentStates={},this.listeners=[]}subscribe(e){this.listeners.push(e)}unsubscribe(e){const t=this.listeners.indexOf(e);t>-1&&this.listeners.splice(t,1)}_notify(){for(let e=0;e<this.listeners.length;e++)this.listeners[e]()}getStore(){return{...this.store}}setStore(e,t){"function"==typeof e&&(e=e(this.store)),this.store=i(i({},this.store),e),this._notify(),"function"==typeof t&&t()}createState(e,t){e in this.componentStates||(this.componentStates[e]={...t})}getState(e){return{...this.componentStates[e]}}setState(e,t,n){"function"==typeof t&&(t=t(this.componentStates[e])),this.componentStates[e]=i(i({},this.componentStates[e]),t),this._notify(),"function"==typeof n&&n()}deleteState(e){delete this.componentStates[e]}reset(){this.store={},this.componentStates={},this.listeners=[]}}class r{constructor(e,t,n){this.eventManager=e,this.lifecycleQueue=t,this.diffEngine=n}mount(e,t){const n=this.createElement(t);n&&e.appendChild(n)}createElement(e){if(null==e)return document.createTextNode("");const t=typeof e;return"string"===t||"number"===t?document.createTextNode(e):"boolean"===t||"undefined"===t?document.createTextNode(""):"object"===t&&e.e?this._createElementNode(e):null}_createElementNode(e){const t=document.createElement(e.e);if("object"==typeof e.a){const n=Object.keys(e.a);for(let s=n.length;s--;)if("events"===n[s])e.eid=this.eventManager.bindEvents(t,e.a[n[s]]);else if("style"===n[s])this._addStyles(e.a[n[s]],t);else{if("key"===n[s])continue;t.setAttribute(n[s],e.a[n[s]])}}if(this.lifecycleQueue.mounted(e),Array.isArray(e.c))for(let n=0,s=e.c.length;n<s;n++){const s=this.createElement(e.c[n]);s&&t.appendChild(s)}return t}_addStyles(e,t){if(void 0===e)return;const n=Object.keys(e);for(let s=n.length;s--;)t.style[n[s]]=e[n[s]]}patch(e,t,n,s){const i=typeof n;if(void 0===s)this._appendChild(e,n);else if("undefined"===i)this._unmountNodeAndChildren(s),t&&t.remove();else if(this.diffEngine.areNodesEqual(n,s)){if("object"===i&&n.e){if(n===s)return;if(this._updateNodes(t,n,s),n.c!==s.c)if(this.diffEngine._hasKeys(n.c)||this.diffEngine._hasKeys(s.c))this.diffEngine.reconcileChildren(t,n.c,s.c,this);else{let e;for(let i=s.c?s.c.length:0;i--&&void 0===n.c[i];)e=t.lastChild,e&&(this._unmountNodeAndChildren(s.c[i]),e.remove());if(Array.isArray(n.c))for(let e=0,i=n.c.length;e<i;e++)this.patch(t,t.childNodes[e]||null,n.c[e],s.c?s.c[e]:void 0)}}}else if(!t||3!==t.nodeType||"string"!==i&&"number"!==i)this._unmountNodeAndChildren(s),t&&e.replaceChild(this.createElement(n),t);else{const e=String(n);t.textContent!==e&&(t.textContent=e)}}_appendChild(e,t){const n=this.createElement(t);n&&e.appendChild(n)}_updateNodes(e,t,n){if(this.lifecycleQueue.updated(t),t.a===n.a)return;if(!t.a||!n.a)return;const s=Object.keys(t.a);let i,o;for(let r=s.length;r--;)if(o=t.a[s[r]],i=n.a[s[r]],"style"===s[r]){if(this._stylesAreEqual(o,i))continue;e.removeAttribute(s[r]),this._addStyles(o,e)}else if("events"===s[r])this.eventManager.unbindEvents(e,n.eid),t.eid=this.eventManager.bindEvents(e,o);else{if("key"===s[r])continue;"value"===s[r]&&o!==i?e.value=o:void 0!==i&&o===i||e.setAttribute(s[r],o)}}_stylesAreEqual(e,t){if(e===t)return!0;const n=typeof e,s=typeof t;if("undefined"===n&&"undefined"===s)return!0;if("object"!==n||"object"!==s)return!1;const i=Object.keys(e),o=Object.keys(t);if(i.length!==o.length)return!1;for(let n=i.length;n--;)if(e[i[n]]!==t[i[n]])return!1;return!0}_unmountNodeAndChildren(e){if(null!=e&&(this.lifecycleQueue.unmounted(e),this.lifecycleQueue.deleteState(e),this.eventManager.deleteCachedEvent(e.eid),Array.isArray(e.c)))for(let t=e.c.length;t--;)this._unmountNodeAndChildren(e.c[t])}unmount(e,t){this._unmountNodeAndChildren(t),e&&(e.innerHTML="")}}class h{constructor(e,t,n){this._getCache=e,this._resolveUUID=t,this._elementToUUID=n,this._attachedTypes=new Set,this._rootNode=null}attach(e,t){this._attachedTypes.has(t)||(this._attachedTypes.add(t),this._rootNode=e,e._literaljs_hasEvents=!0,e.addEventListener(t,e=>this._handle(e)))}_handle(e){if(!this._rootNode||!this._rootNode._literaljs_hasEvents)return;let t=e.target;for(;t&&t!==this._rootNode;){let n;if(this._elementToUUID&&(n=this._elementToUUID.get(t))){const t=this._getCache(n);if(t&&"function"==typeof t[e.type])return void t[e.type](e)}const s=this._resolveUUID(t);if("string"==typeof s){const t=this._getCache(s);if(t&&"function"==typeof t[e.type])return void t[e.type](e)}t=t.parentNode}}reset(){this._attachedTypes.clear()}}const d=["abort","blur","error","focus","load","mouseenter","mouseleave","resize","scroll","unload"],c="eid";class u{constructor(){this.cache={},this.rootNode=null,this._elementToUUID=new WeakMap,this.eventBus=new h(e=>this.cache[e],e=>this.getEventUUID(e),this._elementToUUID)}setRootNode(e){this.rootNode=e}getEventUUID(e){if(!e||!e.parentNode)return;if("#document"===e.parentNode.nodeName)return;const t=e.getAttribute("data-"+c);return"string"==typeof t?t:this.getEventUUID(e.parentNode)}bindEvents(e,t){const s=n();e.setAttribute("data-"+c,s),this.cache[s]=t,this._elementToUUID.set(e,s);const i=Object.keys(t);for(let t=i.length;t--;)d.includes(i[t])?e.addEventListener(i[t],this.cache[s][i[t]]):this.eventBus.attach(this.rootNode,i[t]);return s}unbindEvents(e,t){if(!this.cache[t])return;const n=Object.keys(this.cache[t]);for(let s=n.length;s--;)d.includes(n[s])&&e.removeEventListener(n[s],this.cache[t][n[s]]);this.deleteCachedEvent(t),this._elementToUUID.delete(e),e.removeAttribute("data-"+c)}addEvents(e,t,n){n.setAttribute("data-"+c,e),this.cache[e]=t,this._elementToUUID.set(n,e);const s=Object.keys(t);for(let t=s.length;t--;)d.includes(s[t])?n.addEventListener(s[t],this.cache[e][s[t]]):this.eventBus.attach(this.rootNode,s[t])}removeIndividualEvents(e,t){if(!this.cache[t])return;const n=Object.keys(this.cache[t]);for(let s=n.length;s--;)d.includes(n[s])&&e.removeEventListener(n[s],this.cache[t][n[s]])}deleteCachedEvent(e){"string"==typeof e&&delete this.cache[e]}destroy(){this.rootNode&&(this.rootNode._literaljs_hasEvents=!1),this.cache={},this.rootNode=null,this.eventBus.reset()}}class a{constructor(){this.queue=[]}mounted(e){"object"==typeof e&&"function"==typeof e.m&&this.queue.push(e.m)}updated(e){"object"==typeof e&&"function"==typeof e.up&&this.queue.push(e.up)}unmounted(e){"object"==typeof e&&"function"==typeof e.un&&this.queue.push(e.un)}deleteState(e){"object"==typeof e&&"function"==typeof e.d&&this.queue.push(e.d)}flush(){let e;for(;e=this.queue.shift();)e()}clear(){this.queue=[]}}function l(t,n){if(null==t)return t;if("function"==typeof t.e){let e;e=t.a&&t.a.props?{...t.a.props}:t.a?{...t.a}:{},delete(t={e:t.e,a:{...t.a},c:t.c}).a.props,t=t.e(e)}if(t&&"function"==typeof t.bind){const s=t.bind(n);let i;try{i=s.render()}catch(e){console.error("Component render error:",e),i={e:"div",a:{class:"error-boundary"},c:[`${e.name}: ${e.message}`]}}if("object"==typeof i&&null!==i&&i instanceof e)i.withIdentity(t.definitionId||s.definitionId,t.instanceId||s.instanceId),i.withLifecycle({mounted:s.mounted,updated:s.updated,unmounted:s.unmounted,deleteState:s.deleteState}),t=i;else if("object"==typeof i&&null!==i){const n=new e(i.e,i.a,i.c);n.withIdentity(t.definitionId||s.definitionId,t.instanceId||s.instanceId),n.withLifecycle({mounted:s.mounted,updated:s.updated,unmounted:s.unmounted,deleteState:s.deleteState}),t=n}else t=i}if(t&&Array.isArray(t.c))for(let e=0,s=t.c.length;e<s;e++)t.c[e]=l(t.c[e],n);return t}class f{areNodesEqual(e,t){const n=typeof e;return n===typeof t&&("object"===n&&e.e===t.e&&e.id===t.id||("string"===n||"number"===n)&&e===t)}reconcileChildren(e,t,n,s){return Array.isArray(t)?this._hasKeys(t)||this._hasKeys(n)?this._reconcileKeyed(e,t,n,s):this._reconcileNonKeyed(e,t,n,s):0}_reconcileNonKeyed(e,t,n,s){const i=t.length;if(0===i){if(n)for(let e=0;e<n.length;e++)s._unmountNodeAndChildren(n[e]);return e.innerHTML="",0}const o=e.childNodes;for(let r=0;r<i;r++)s.patch(e,o[r]||null,t[r],n?n[r]:void 0);return i}_hasKeys(e){if(!Array.isArray(e))return!1;for(let t=0,n=e.length;t<n;t++)if(e[t]&&e[t].a&&null!=e[t].a.key)return!0;return!1}_reconcileKeyed(e,t,n,s){const i=n?n.length:0,o=t.length;if(0===o){for(let e=0;e<i;e++)s._unmountNodeAndChildren(n[e]);return e.innerHTML="",0}const r=Object.create(null),h=Object.create(null);for(let t=0;t<i;t++){const s=n[t].a?n[t].a.key:null,i=e.childNodes[t];null!=s&&i&&(r[s]=i,h[s]=n[t])}const d=new Array(o),c=new Array(o);for(let e=0;e<o;e++){const n=t[e].a?t[e].a.key:null;null!=n&&r[n]?(d[e]=r[n],c[e]=h[n],delete r[n]):(d[e]=null,c[e]=null)}for(const t in r){const n=r[t];n&&(s.patch(e,n,void 0,h[t]),n.remove())}let u=e.firstChild;for(let n=0;n<o;n++){const i=d[n];if(i&&i===u)u=u.nextSibling;else if(i)e.insertBefore(i,u);else{const i=s.createElement(t[n]);i&&e.insertBefore(i,u)}}for(;u;){const e=u.nextSibling;u.remove(),u=e}for(let n=0;n<o;n++)c[n]&&s.patch(e,e.childNodes[n],t[n],c[n]);return o}removeExtraChildren(e,t,n,s){const i=t.c?t.c.length:0;if(!(i<=n))for(let o=i;o-- >n;){const n=e.lastChild;n&&(s._unmountNodeAndChildren(t.c[o]),n.remove())}}}class p{constructor(e,t,n){this.generateTree=e||l,this.renderer=t,this.lifecycleQueue=n}mount(e,t,n){const s=this.generateTree(t(),n);return this.renderer.mount(e,s),this.lifecycleQueue.flush(),s}update(e,t,n,s){const i=this.generateTree(t(),n);return this.renderer.patch(e,e.firstChild,i,s),this.lifecycleQueue.flush(),i}unmount(e,t){t&&(this.renderer.unmount(e,t),this.lifecycleQueue.flush())}}class y{constructor(e,t){void 0===t&&(t="microtask"),this._renderFn=e,this._scheduler=t,this._scheduled=!1}schedule(){this._scheduled||(this._scheduled=!0,"microtask"===this._scheduler?Promise.resolve().then(()=>this._execute()):"sync"===this._scheduler&&this._execute())}_execute(){this._scheduled=!1,this._renderFn()}}class m{constructor(e,t){void 0===t&&(t={}),this.rootComponent=e,this.savedTree=e,this.currentTree=null,this.rootNode=null,this.stateManager=new o(t),this.lifecycleQueue=new a,this.eventManager=new u,this.renderer=new r(this.eventManager,this.lifecycleQueue,new f),this.mountOrchestrator=new p(l,this.renderer,this.lifecycleQueue),this.updateLoop=new y(()=>this.update(),"microtask"),this._boundSchedule=()=>this.updateLoop.schedule(),this.stateManager.subscribe(this._boundSchedule)}mount(e){if(this.rootNode=document.getElementById(e),!this.rootNode)throw new Error(`Cannot mount app: element with id "${e}" not found`);return this.eventManager.setRootNode(this.rootNode),this.currentTree=this.mountOrchestrator.mount(this.rootNode,this.savedTree,this.stateManager),this}unmount(){this.mountOrchestrator.unmount(this.rootNode,this.currentTree),this.eventManager.destroy(),this.stateManager.unsubscribe(()=>this.updateLoop.schedule()),this.rootNode&&(this.rootNode.innerHTML=""),this.currentTree=null,this.rootNode=null}scheduleUpdate(){this.updateLoop.schedule()}update(){this.rootNode&&this.savedTree&&(this.currentTree=this.mountOrchestrator.update(this.rootNode,this.savedTree,this.stateManager,this.currentTree))}getStore(){return this.stateManager.getStore()}setStore(e,t){this.stateManager.setStore(e,t)}}exports.App=m,exports.EventManager=u,exports.LifecycleQueue=a,exports.Renderer=r,exports.StateManager=o,exports.component=function(e){let t=void 0===e?{}:e,i=t.name,o=void 0===i?"":i,r=t.state,h=void 0===r?{}:r,d=t.mounted,c=void 0===d?function(){}:d,u=t.updated,a=void 0===u?function(){}:u,l=t.unmounted,f=void 0===l?function(){}:l,p=t.methods,y=void 0===p?function(){}:p,m=t.render,_=void 0===m?function(){}:m;const g=n(),v=new Map;return function(e){void 0===e&&(e={});const t=e.key||"__default__";if(!v.has(t)){const i=n(),r=o+(e.key?"_"+e.key:"");v.set(t,{definitionId:g,instanceId:i,key:`${g}_${i}_${r}`,_props:null,_cachedRender:null,bind(e){const t=new s(g,i,r,this._props,{state:h,mounted:c,updated:a,unmounted:f,methods:y,render:_},e);return t.bindMethods(y),t}})}const i=v.get(t);return i._props=e,i}},exports.createApp=function(e,t,n){const s=new m(e,n);return s.mount(t),s},exports.flatten=t,exports.generateTree=l,exports.generateUUID=n,exports.h=function(n,s){const i={};for(let e in s)i[e]=s[e];return new e(n,i,t([],[].slice.call(arguments,2)))},exports.isVNode=function(t){return t instanceof e||null!==t&&"object"==typeof t&&"e"in t},exports.render=function(e,t,n){void 0===n&&(n={});const s=new m(e,n);return s.mount(t),s};
|
package/build/index.m.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
class e{constructor(e,t,n){void 0===t&&(t={}),void 0===n&&(n=[]),this.e=e,this.a=t,this.c=n}withLifecycle(e){return e.mounted&&(this.m=e.mounted),e.updated&&(this.up=e.updated),e.unmounted&&(this.un=e.unmounted),e.deleteState&&(this.d=e.deleteState),this}withIdentity(e,t){return this.definitionId=e,this.instanceId=t,this.id=e+"_"+t,this}}function t(e,n){for(let s=0,i=n.length;s<i;s++)Array.isArray(n[s])?t(e,n[s]):e.push(n[s]);return e}function n(n,s){const i={};for(let e in s)i[e]=s[e];return new e(n,i,t([],[].slice.call(arguments,2)))}function s(t){return t instanceof e||null!==t&&"object"==typeof t&&"e"in t}function i(){return Math.random().toString(36).substring(2)+(new Date).getTime().toString(36)}class o{constructor(e,t,n,s,i,o){this.definitionId=e,this.instanceId=t,this.name=n,this.key=`${e}_${t}_${n}`,this.props=s,this._stateManager=o,this._config=i,o.createState(this.key,i.state),this.mounted=i.mounted.bind(this),this.updated=i.updated.bind(this),this.unmounted=i.unmounted.bind(this),this.deleteState=()=>{this._stateManager.deleteState(this.key)},this._renderedVNode=null,this._previousProps=null;const r=i.render.bind(this);this.render=()=>{if(!this.shouldUpdate())return this._renderedVNode;const e=r();return this._renderedVNode=e,this._previousProps=this.props,e}}getStore(){return this._stateManager.getStore()}setStore(e,t){this._stateManager.setStore(e,t)}getState(){return this._stateManager.getState(this.key)}setState(e,t){this._stateManager.setState(this.key,e,t)}createState(){this._stateManager.createState(this.key,this._config.state)}deleteState(){this._stateManager.deleteState(this.key)}shouldUpdate(){return!this._previousProps||!function(e,t){if(e===t)return!0;if(!e||!t||"object"!=typeof e||"object"!=typeof t)return!1;const n=Object.keys(e),s=Object.keys(t);if(n.length!==s.length)return!1;for(let s=0;s<n.length;s++)if(e[n[s]]!==t[n[s]])return!1;return!0}(this.props,this._previousProps)}bindMethods(e){"function"==typeof e&&(e=e.bind(this)());for(let t in e)this[t]=e[t].bind(this)}}function r(e){let t=void 0===e?{}:e,n=t.name,s=void 0===n?"":n,r=t.state,h=void 0===r?{}:r,d=t.mounted,c=void 0===d?function(){}:d,u=t.updated,a=void 0===u?function(){}:u,l=t.unmounted,f=void 0===l?function(){}:l,p=t.methods,y=void 0===p?function(){}:p,m=t.render,_=void 0===m?function(){}:m;const g=i(),v=new Map;return function(e){void 0===e&&(e={});const t=e.key||"__default__";if(!v.has(t)){const n=i(),r=s+(e.key?"_"+e.key:"");v.set(t,{definitionId:g,instanceId:n,key:`${g}_${n}_${r}`,_props:null,_cachedRender:null,bind(e){const t=new o(g,n,r,this._props,{state:h,mounted:c,updated:a,unmounted:f,methods:y,render:_},e);return t.bindMethods(y),t}})}const n=v.get(t);return n._props=e,n}}function h(e,t){for(let n in t)e[n]=t[n];return e}class d{constructor(e){void 0===e&&(e={}),this.store={...e},this.componentStates={},this.listeners=[]}subscribe(e){this.listeners.push(e)}unsubscribe(e){const t=this.listeners.indexOf(e);t>-1&&this.listeners.splice(t,1)}_notify(){for(let e=0;e<this.listeners.length;e++)this.listeners[e]()}getStore(){return{...this.store}}setStore(e,t){"function"==typeof e&&(e=e(this.store)),this.store=h(h({},this.store),e),this._notify(),"function"==typeof t&&t()}createState(e,t){e in this.componentStates||(this.componentStates[e]={...t})}getState(e){return{...this.componentStates[e]}}setState(e,t,n){"function"==typeof t&&(t=t(this.componentStates[e])),this.componentStates[e]=h(h({},this.componentStates[e]),t),this._notify(),"function"==typeof n&&n()}deleteState(e){delete this.componentStates[e]}reset(){this.store={},this.componentStates={},this.listeners=[]}}class c{constructor(e,t,n){this.eventManager=e,this.lifecycleQueue=t,this.diffEngine=n}mount(e,t){const n=this.createElement(t);n&&e.appendChild(n)}createElement(e){const t=typeof e;return"string"===t||"number"===t?document.createTextNode(e):"boolean"===t||"undefined"===t?document.createTextNode(""):"object"===t&&e.e?this._createElementNode(e):null}_createElementNode(e){const t=document.createElement(e.e);if("object"==typeof e.a){const n=Object.keys(e.a);for(let s=n.length;s--;)if("events"===n[s])e.eid=this.eventManager.bindEvents(t,e.a[n[s]]);else if("style"===n[s])this._addStyles(e.a[n[s]],t);else{if("key"===n[s])continue;t.setAttribute(n[s],e.a[n[s]])}}if(this.lifecycleQueue.mounted(e),Array.isArray(e.c))for(let n=0,s=e.c.length;n<s;n++){const s=this.createElement(e.c[n]);s&&t.appendChild(s)}return t}_addStyles(e,t){if(void 0===e)return;const n=Object.keys(e);for(let s=n.length;s--;)t.style[n[s]]=e[n[s]]}patch(e,t,n,s){const i=typeof n;if(void 0===s)this._appendChild(e,n);else if("undefined"===i)this._unmountNodeAndChildren(s),t&&t.remove();else if(this.diffEngine.areNodesEqual(n,s)){if("object"===i&&n.e){if(n===s)return;if(this._updateNodes(t,n,s),n.c!==s.c)if(this.diffEngine._hasKeys(n.c)||this.diffEngine._hasKeys(s.c))this.diffEngine.reconcileChildren(t,n.c,s.c,this);else{let e;for(let i=s.c?s.c.length:0;i--&&void 0===n.c[i];)e=t.lastChild,e&&(this._unmountNodeAndChildren(s.c[i]),e.remove());if(Array.isArray(n.c))for(let e=0,i=n.c.length;e<i;e++)this.patch(t,t.childNodes[e]||null,n.c[e],s.c?s.c[e]:void 0)}}}else if(!t||3!==t.nodeType||"string"!==i&&"number"!==i)this._unmountNodeAndChildren(s),t&&e.replaceChild(this.createElement(n),t);else{const e=String(n);t.textContent!==e&&(t.textContent=e)}}_appendChild(e,t){const n=this.createElement(t);n&&e.appendChild(n)}_updateNodes(e,t,n){if(this.lifecycleQueue.updated(t),t.a===n.a)return;if(!t.a||!n.a)return;const s=Object.keys(t.a);let i,o;for(let r=s.length;r--;)if(o=t.a[s[r]],i=n.a[s[r]],"style"===s[r]){if(this._stylesAreEqual(o,i))continue;e.removeAttribute(s[r]),this._addStyles(o,e)}else if("events"===s[r])this.eventManager.unbindEvents(e,n.eid),t.eid=this.eventManager.bindEvents(e,o);else{if("key"===s[r])continue;"value"===s[r]&&o!==i?e.value=o:void 0!==i&&o===i||e.setAttribute(s[r],o)}}_stylesAreEqual(e,t){if(e===t)return!0;const n=typeof e,s=typeof t;if("undefined"===n&&"undefined"===s)return!0;if("object"!==n||"object"!==s)return!1;const i=Object.keys(e),o=Object.keys(t);if(i.length!==o.length)return!1;for(let n=i.length;n--;)if(e[i[n]]!==t[i[n]])return!1;return!0}_unmountNodeAndChildren(e){if(null!=e&&(this.lifecycleQueue.unmounted(e),this.lifecycleQueue.deleteState(e),this.eventManager.deleteCachedEvent(e.eid),Array.isArray(e.c)))for(let t=e.c.length;t--;)this._unmountNodeAndChildren(e.c[t])}unmount(e,t){this._unmountNodeAndChildren(t),e&&(e.innerHTML="")}}class u{constructor(e,t,n){this._getCache=e,this._resolveUUID=t,this._elementToUUID=n,this._attachedTypes=new Set,this._rootNode=null}attach(e,t){this._attachedTypes.has(t)||(this._attachedTypes.add(t),this._rootNode=e,e._literaljs_hasEvents=!0,e.addEventListener(t,e=>this._handle(e)))}_handle(e){if(!this._rootNode||!this._rootNode._literaljs_hasEvents)return;let t=e.target;for(;t&&t!==this._rootNode;){let n;if(this._elementToUUID&&(n=this._elementToUUID.get(t))){const t=this._getCache(n);if(t&&"function"==typeof t[e.type])return void t[e.type](e)}const s=this._resolveUUID(t);if("string"==typeof s){const t=this._getCache(s);if(t&&"function"==typeof t[e.type])return void t[e.type](e)}t=t.parentNode}}reset(){this._attachedTypes.clear()}}const a=["abort","blur","error","focus","load","mouseenter","mouseleave","resize","scroll","unload"],l="eid";class f{constructor(){this.cache={},this.rootNode=null,this._elementToUUID=new WeakMap,this.eventBus=new u(e=>this.cache[e],e=>this.getEventUUID(e),this._elementToUUID)}setRootNode(e){this.rootNode=e}getEventUUID(e){if(!e||!e.parentNode)return;if("#document"===e.parentNode.nodeName)return;const t=e.getAttribute("data-"+l);return"string"==typeof t?t:this.getEventUUID(e.parentNode)}bindEvents(e,t){const n=i();e.setAttribute("data-"+l,n),this.cache[n]=t,this._elementToUUID.set(e,n);const s=Object.keys(t);for(let t=s.length;t--;)a.includes(s[t])?e.addEventListener(s[t],this.cache[n][s[t]]):this.eventBus.attach(this.rootNode,s[t]);return n}unbindEvents(e,t){if(!this.cache[t])return;const n=Object.keys(this.cache[t]);for(let s=n.length;s--;)a.includes(n[s])&&e.removeEventListener(n[s],this.cache[t][n[s]]);this.deleteCachedEvent(t),this._elementToUUID.delete(e),e.removeAttribute("data-"+l)}addEvents(e,t,n){n.setAttribute("data-"+l,e),this.cache[e]=t,this._elementToUUID.set(n,e);const s=Object.keys(t);for(let t=s.length;t--;)a.includes(s[t])?n.addEventListener(s[t],this.cache[e][s[t]]):this.eventBus.attach(this.rootNode,s[t])}removeIndividualEvents(e,t){if(!this.cache[t])return;const n=Object.keys(this.cache[t]);for(let s=n.length;s--;)a.includes(n[s])&&e.removeEventListener(n[s],this.cache[t][n[s]])}deleteCachedEvent(e){"string"==typeof e&&delete this.cache[e]}destroy(){this.rootNode&&(this.rootNode._literaljs_hasEvents=!1),this.cache={},this.rootNode=null,this.eventBus.reset()}}class p{constructor(){this.queue=[]}mounted(e){"object"==typeof e&&"function"==typeof e.m&&this.queue.push(e.m)}updated(e){"object"==typeof e&&"function"==typeof e.up&&this.queue.push(e.up)}unmounted(e){"object"==typeof e&&"function"==typeof e.un&&this.queue.push(e.un)}deleteState(e){"object"==typeof e&&"function"==typeof e.d&&this.queue.push(e.d)}flush(){let e;for(;e=this.queue.shift();)e()}clear(){this.queue=[]}}function y(t,n){if(null==t)return t;if("function"==typeof t.e){const e={...t.a.props};delete(t={e:t.e,a:{...t.a},c:t.c}).a.props,t=t.e(e)}if(t&&"function"==typeof t.bind){const s=t.bind(n);let i;try{i=s.render()}catch(e){console.error("Component render error:",e),i={e:"div",a:{class:"error-boundary"},c:[`${e.name}: ${e.message}`]}}if("object"==typeof i&&null!==i&&i instanceof e)i.withIdentity(t.definitionId||s.definitionId,t.instanceId||s.instanceId),i.withLifecycle({mounted:s.mounted,updated:s.updated,unmounted:s.unmounted,deleteState:s.deleteState}),t=i;else if("object"==typeof i&&null!==i){const n=new e(i.e,i.a,i.c);n.withIdentity(t.definitionId||s.definitionId,t.instanceId||s.instanceId),n.withLifecycle({mounted:s.mounted,updated:s.updated,unmounted:s.unmounted,deleteState:s.deleteState}),t=n}else t=i}if(t&&Array.isArray(t.c))for(let e=0,s=t.c.length;e<s;e++)t.c[e]=y(t.c[e],n);return t}class m{areNodesEqual(e,t){const n=typeof e;return n===typeof t&&("object"===n&&e.e===t.e&&e.id===t.id||("string"===n||"number"===n)&&e===t)}reconcileChildren(e,t,n,s){return Array.isArray(t)?this._hasKeys(t)||this._hasKeys(n)?this._reconcileKeyed(e,t,n,s):this._reconcileNonKeyed(e,t,n,s):0}_reconcileNonKeyed(e,t,n,s){const i=t.length;if(0===i){if(n)for(let e=0;e<n.length;e++)s._unmountNodeAndChildren(n[e]);return e.innerHTML="",0}const o=e.childNodes;for(let r=0;r<i;r++)s.patch(e,o[r]||null,t[r],n?n[r]:void 0);return i}_hasKeys(e){if(!Array.isArray(e))return!1;for(let t=0,n=e.length;t<n;t++)if(e[t]&&e[t].a&&null!=e[t].a.key)return!0;return!1}_reconcileKeyed(e,t,n,s){const i=n?n.length:0,o=t.length;if(0===o){for(let e=0;e<i;e++)s._unmountNodeAndChildren(n[e]);return e.innerHTML="",0}const r=Object.create(null),h=Object.create(null);for(let t=0;t<i;t++){const s=n[t].a?n[t].a.key:null,i=e.childNodes[t];null!=s&&i&&(r[s]=i,h[s]=n[t])}const d=new Array(o),c=new Array(o);for(let e=0;e<o;e++){const n=t[e].a?t[e].a.key:null;null!=n&&r[n]?(d[e]=r[n],c[e]=h[n],delete r[n]):(d[e]=null,c[e]=null)}for(const t in r){const n=r[t];n&&(s.patch(e,n,void 0,h[t]),n.remove())}let u=e.firstChild;for(let n=0;n<o;n++){const i=d[n];if(i&&i===u)u=u.nextSibling;else if(i)e.insertBefore(i,u);else{const i=s.createElement(t[n]);i&&e.insertBefore(i,u)}}for(;u;){const e=u.nextSibling;u.remove(),u=e}for(let n=0;n<o;n++)c[n]&&s.patch(e,e.childNodes[n],t[n],c[n]);return o}removeExtraChildren(e,t,n,s){const i=t.c?t.c.length:0;if(!(i<=n))for(let o=i;o-- >n;){const n=e.lastChild;n&&(s._unmountNodeAndChildren(t.c[o]),n.remove())}}}class _{constructor(e,t,n){this.generateTree=e||y,this.renderer=t,this.lifecycleQueue=n}mount(e,t,n){const s=this.generateTree(t(),n);return this.renderer.mount(e,s),this.lifecycleQueue.flush(),s}update(e,t,n,s){const i=this.generateTree(t(),n);return this.renderer.patch(e,e.firstChild,i,s),this.lifecycleQueue.flush(),i}unmount(e,t){t&&(this.renderer.unmount(e,t),this.lifecycleQueue.flush())}}class g{constructor(e,t){void 0===t&&(t="microtask"),this._renderFn=e,this._scheduler=t,this._scheduled=!1}schedule(){this._scheduled||(this._scheduled=!0,"microtask"===this._scheduler?Promise.resolve().then(()=>this._execute()):"sync"===this._scheduler&&this._execute())}_execute(){this._scheduled=!1,this._renderFn()}}class v{constructor(e,t){void 0===t&&(t={}),this.rootComponent=e,this.savedTree=e,this.currentTree=null,this.rootNode=null,this.stateManager=new d(t),this.lifecycleQueue=new p,this.eventManager=new f,this.renderer=new c(this.eventManager,this.lifecycleQueue,new m),this.mountOrchestrator=new _(y,this.renderer,this.lifecycleQueue),this.updateLoop=new g(()=>this.update(),"microtask"),this._boundSchedule=()=>this.updateLoop.schedule(),this.stateManager.subscribe(this._boundSchedule)}mount(e){if(this.rootNode=document.getElementById(e),!this.rootNode)throw new Error(`Cannot mount app: element with id "${e}" not found`);return this.eventManager.setRootNode(this.rootNode),this.currentTree=this.mountOrchestrator.mount(this.rootNode,this.savedTree,this.stateManager),this}unmount(){this.mountOrchestrator.unmount(this.rootNode,this.currentTree),this.eventManager.destroy(),this.stateManager.unsubscribe(()=>this.updateLoop.schedule()),this.rootNode&&(this.rootNode.innerHTML=""),this.currentTree=null,this.rootNode=null}scheduleUpdate(){this.updateLoop.schedule()}update(){this.rootNode&&this.savedTree&&(this.currentTree=this.mountOrchestrator.update(this.rootNode,this.savedTree,this.stateManager,this.currentTree))}getStore(){return this.stateManager.getStore()}setStore(e,t){this.stateManager.setStore(e,t)}}function b(e,t,n){const s=new v(e,n);return s.mount(t),s}function N(e,t,n){void 0===n&&(n={});const s=new v(e,n);return s.mount(t),s}export{v as App,f as EventManager,p as LifecycleQueue,c as Renderer,d as StateManager,r as component,b as createApp,t as flatten,y as generateTree,i as generateUUID,n as h,s as isVNode,N as render};
|
|
1
|
+
class e{constructor(e,t,n){void 0===t&&(t={}),void 0===n&&(n=[]),this.e=e,this.a=t,this.c=n}withLifecycle(e){return e.mounted&&(this.m=e.mounted),e.updated&&(this.up=e.updated),e.unmounted&&(this.un=e.unmounted),e.deleteState&&(this.d=e.deleteState),this}withIdentity(e,t){return this.definitionId=e,this.instanceId=t,this.id=e+"_"+t,this}}function t(e,n){for(let s=0,i=n.length;s<i;s++)Array.isArray(n[s])?t(e,n[s]):e.push(n[s]);return e}function n(n,s){const i={};for(let e in s)i[e]=s[e];return new e(n,i,t([],[].slice.call(arguments,2)))}function s(t){return t instanceof e||null!==t&&"object"==typeof t&&"e"in t}function i(){return Math.random().toString(36).substring(2)+(new Date).getTime().toString(36)}class o{constructor(e,t,n,s,i,o){this.definitionId=e,this.instanceId=t,this.name=n,this.key=`${e}_${t}_${n}`,this.props=s,this._stateManager=o,this._config=i,o.createState(this.key,i.state),this.mounted=i.mounted.bind(this),this.updated=i.updated.bind(this),this.unmounted=i.unmounted.bind(this),this.deleteState=()=>{this._stateManager.deleteState(this.key)},this._renderedVNode=null,this._previousProps=null;const r=i.render.bind(this);this.render=()=>{if(!this.shouldUpdate())return this._renderedVNode;const e=r();return this._renderedVNode=e,this._previousProps=this.props,e}}getStore(){return this._stateManager.getStore()}setStore(e,t){this._stateManager.setStore(e,t)}getState(){return this._stateManager.getState(this.key)}setState(e,t){this._stateManager.setState(this.key,e,t)}createState(){this._stateManager.createState(this.key,this._config.state)}deleteState(){this._stateManager.deleteState(this.key)}shouldUpdate(){return!this._previousProps||!function(e,t){if(e===t)return!0;if(!e||!t||"object"!=typeof e||"object"!=typeof t)return!1;const n=Object.keys(e),s=Object.keys(t);if(n.length!==s.length)return!1;for(let s=0;s<n.length;s++)if(e[n[s]]!==t[n[s]])return!1;return!0}(this.props,this._previousProps)}bindMethods(e){"function"==typeof e&&(e=e.bind(this)());for(let t in e)this[t]=e[t].bind(this)}}function r(e){let t=void 0===e?{}:e,n=t.name,s=void 0===n?"":n,r=t.state,h=void 0===r?{}:r,d=t.mounted,c=void 0===d?function(){}:d,u=t.updated,a=void 0===u?function(){}:u,l=t.unmounted,f=void 0===l?function(){}:l,p=t.methods,y=void 0===p?function(){}:p,m=t.render,_=void 0===m?function(){}:m;const g=i(),v=new Map;return function(e){void 0===e&&(e={});const t=e.key||"__default__";if(!v.has(t)){const n=i(),r=s+(e.key?"_"+e.key:"");v.set(t,{definitionId:g,instanceId:n,key:`${g}_${n}_${r}`,_props:null,_cachedRender:null,bind(e){const t=new o(g,n,r,this._props,{state:h,mounted:c,updated:a,unmounted:f,methods:y,render:_},e);return t.bindMethods(y),t}})}const n=v.get(t);return n._props=e,n}}function h(e,t){for(let n in t)e[n]=t[n];return e}class d{constructor(e){void 0===e&&(e={}),this.store={...e},this.componentStates={},this.listeners=[]}subscribe(e){this.listeners.push(e)}unsubscribe(e){const t=this.listeners.indexOf(e);t>-1&&this.listeners.splice(t,1)}_notify(){for(let e=0;e<this.listeners.length;e++)this.listeners[e]()}getStore(){return{...this.store}}setStore(e,t){"function"==typeof e&&(e=e(this.store)),this.store=h(h({},this.store),e),this._notify(),"function"==typeof t&&t()}createState(e,t){e in this.componentStates||(this.componentStates[e]={...t})}getState(e){return{...this.componentStates[e]}}setState(e,t,n){"function"==typeof t&&(t=t(this.componentStates[e])),this.componentStates[e]=h(h({},this.componentStates[e]),t),this._notify(),"function"==typeof n&&n()}deleteState(e){delete this.componentStates[e]}reset(){this.store={},this.componentStates={},this.listeners=[]}}class c{constructor(e,t,n){this.eventManager=e,this.lifecycleQueue=t,this.diffEngine=n}mount(e,t){const n=this.createElement(t);n&&e.appendChild(n)}createElement(e){if(null==e)return document.createTextNode("");const t=typeof e;return"string"===t||"number"===t?document.createTextNode(e):"boolean"===t||"undefined"===t?document.createTextNode(""):"object"===t&&e.e?this._createElementNode(e):null}_createElementNode(e){const t=document.createElement(e.e);if("object"==typeof e.a){const n=Object.keys(e.a);for(let s=n.length;s--;)if("events"===n[s])e.eid=this.eventManager.bindEvents(t,e.a[n[s]]);else if("style"===n[s])this._addStyles(e.a[n[s]],t);else{if("key"===n[s])continue;t.setAttribute(n[s],e.a[n[s]])}}if(this.lifecycleQueue.mounted(e),Array.isArray(e.c))for(let n=0,s=e.c.length;n<s;n++){const s=this.createElement(e.c[n]);s&&t.appendChild(s)}return t}_addStyles(e,t){if(void 0===e)return;const n=Object.keys(e);for(let s=n.length;s--;)t.style[n[s]]=e[n[s]]}patch(e,t,n,s){const i=typeof n;if(void 0===s)this._appendChild(e,n);else if("undefined"===i)this._unmountNodeAndChildren(s),t&&t.remove();else if(this.diffEngine.areNodesEqual(n,s)){if("object"===i&&n.e){if(n===s)return;if(this._updateNodes(t,n,s),n.c!==s.c)if(this.diffEngine._hasKeys(n.c)||this.diffEngine._hasKeys(s.c))this.diffEngine.reconcileChildren(t,n.c,s.c,this);else{let e;for(let i=s.c?s.c.length:0;i--&&void 0===n.c[i];)e=t.lastChild,e&&(this._unmountNodeAndChildren(s.c[i]),e.remove());if(Array.isArray(n.c))for(let e=0,i=n.c.length;e<i;e++)this.patch(t,t.childNodes[e]||null,n.c[e],s.c?s.c[e]:void 0)}}}else if(!t||3!==t.nodeType||"string"!==i&&"number"!==i)this._unmountNodeAndChildren(s),t&&e.replaceChild(this.createElement(n),t);else{const e=String(n);t.textContent!==e&&(t.textContent=e)}}_appendChild(e,t){const n=this.createElement(t);n&&e.appendChild(n)}_updateNodes(e,t,n){if(this.lifecycleQueue.updated(t),t.a===n.a)return;if(!t.a||!n.a)return;const s=Object.keys(t.a);let i,o;for(let r=s.length;r--;)if(o=t.a[s[r]],i=n.a[s[r]],"style"===s[r]){if(this._stylesAreEqual(o,i))continue;e.removeAttribute(s[r]),this._addStyles(o,e)}else if("events"===s[r])this.eventManager.unbindEvents(e,n.eid),t.eid=this.eventManager.bindEvents(e,o);else{if("key"===s[r])continue;"value"===s[r]&&o!==i?e.value=o:void 0!==i&&o===i||e.setAttribute(s[r],o)}}_stylesAreEqual(e,t){if(e===t)return!0;const n=typeof e,s=typeof t;if("undefined"===n&&"undefined"===s)return!0;if("object"!==n||"object"!==s)return!1;const i=Object.keys(e),o=Object.keys(t);if(i.length!==o.length)return!1;for(let n=i.length;n--;)if(e[i[n]]!==t[i[n]])return!1;return!0}_unmountNodeAndChildren(e){if(null!=e&&(this.lifecycleQueue.unmounted(e),this.lifecycleQueue.deleteState(e),this.eventManager.deleteCachedEvent(e.eid),Array.isArray(e.c)))for(let t=e.c.length;t--;)this._unmountNodeAndChildren(e.c[t])}unmount(e,t){this._unmountNodeAndChildren(t),e&&(e.innerHTML="")}}class u{constructor(e,t,n){this._getCache=e,this._resolveUUID=t,this._elementToUUID=n,this._attachedTypes=new Set,this._rootNode=null}attach(e,t){this._attachedTypes.has(t)||(this._attachedTypes.add(t),this._rootNode=e,e._literaljs_hasEvents=!0,e.addEventListener(t,e=>this._handle(e)))}_handle(e){if(!this._rootNode||!this._rootNode._literaljs_hasEvents)return;let t=e.target;for(;t&&t!==this._rootNode;){let n;if(this._elementToUUID&&(n=this._elementToUUID.get(t))){const t=this._getCache(n);if(t&&"function"==typeof t[e.type])return void t[e.type](e)}const s=this._resolveUUID(t);if("string"==typeof s){const t=this._getCache(s);if(t&&"function"==typeof t[e.type])return void t[e.type](e)}t=t.parentNode}}reset(){this._attachedTypes.clear()}}const a=["abort","blur","error","focus","load","mouseenter","mouseleave","resize","scroll","unload"],l="eid";class f{constructor(){this.cache={},this.rootNode=null,this._elementToUUID=new WeakMap,this.eventBus=new u(e=>this.cache[e],e=>this.getEventUUID(e),this._elementToUUID)}setRootNode(e){this.rootNode=e}getEventUUID(e){if(!e||!e.parentNode)return;if("#document"===e.parentNode.nodeName)return;const t=e.getAttribute("data-"+l);return"string"==typeof t?t:this.getEventUUID(e.parentNode)}bindEvents(e,t){const n=i();e.setAttribute("data-"+l,n),this.cache[n]=t,this._elementToUUID.set(e,n);const s=Object.keys(t);for(let t=s.length;t--;)a.includes(s[t])?e.addEventListener(s[t],this.cache[n][s[t]]):this.eventBus.attach(this.rootNode,s[t]);return n}unbindEvents(e,t){if(!this.cache[t])return;const n=Object.keys(this.cache[t]);for(let s=n.length;s--;)a.includes(n[s])&&e.removeEventListener(n[s],this.cache[t][n[s]]);this.deleteCachedEvent(t),this._elementToUUID.delete(e),e.removeAttribute("data-"+l)}addEvents(e,t,n){n.setAttribute("data-"+l,e),this.cache[e]=t,this._elementToUUID.set(n,e);const s=Object.keys(t);for(let t=s.length;t--;)a.includes(s[t])?n.addEventListener(s[t],this.cache[e][s[t]]):this.eventBus.attach(this.rootNode,s[t])}removeIndividualEvents(e,t){if(!this.cache[t])return;const n=Object.keys(this.cache[t]);for(let s=n.length;s--;)a.includes(n[s])&&e.removeEventListener(n[s],this.cache[t][n[s]])}deleteCachedEvent(e){"string"==typeof e&&delete this.cache[e]}destroy(){this.rootNode&&(this.rootNode._literaljs_hasEvents=!1),this.cache={},this.rootNode=null,this.eventBus.reset()}}class p{constructor(){this.queue=[]}mounted(e){"object"==typeof e&&"function"==typeof e.m&&this.queue.push(e.m)}updated(e){"object"==typeof e&&"function"==typeof e.up&&this.queue.push(e.up)}unmounted(e){"object"==typeof e&&"function"==typeof e.un&&this.queue.push(e.un)}deleteState(e){"object"==typeof e&&"function"==typeof e.d&&this.queue.push(e.d)}flush(){let e;for(;e=this.queue.shift();)e()}clear(){this.queue=[]}}function y(t,n){if(null==t)return t;if("function"==typeof t.e){let e;e=t.a&&t.a.props?{...t.a.props}:t.a?{...t.a}:{},delete(t={e:t.e,a:{...t.a},c:t.c}).a.props,t=t.e(e)}if(t&&"function"==typeof t.bind){const s=t.bind(n);let i;try{i=s.render()}catch(e){console.error("Component render error:",e),i={e:"div",a:{class:"error-boundary"},c:[`${e.name}: ${e.message}`]}}if("object"==typeof i&&null!==i&&i instanceof e)i.withIdentity(t.definitionId||s.definitionId,t.instanceId||s.instanceId),i.withLifecycle({mounted:s.mounted,updated:s.updated,unmounted:s.unmounted,deleteState:s.deleteState}),t=i;else if("object"==typeof i&&null!==i){const n=new e(i.e,i.a,i.c);n.withIdentity(t.definitionId||s.definitionId,t.instanceId||s.instanceId),n.withLifecycle({mounted:s.mounted,updated:s.updated,unmounted:s.unmounted,deleteState:s.deleteState}),t=n}else t=i}if(t&&Array.isArray(t.c))for(let e=0,s=t.c.length;e<s;e++)t.c[e]=y(t.c[e],n);return t}class m{areNodesEqual(e,t){const n=typeof e;return n===typeof t&&("object"===n&&e.e===t.e&&e.id===t.id||("string"===n||"number"===n)&&e===t)}reconcileChildren(e,t,n,s){return Array.isArray(t)?this._hasKeys(t)||this._hasKeys(n)?this._reconcileKeyed(e,t,n,s):this._reconcileNonKeyed(e,t,n,s):0}_reconcileNonKeyed(e,t,n,s){const i=t.length;if(0===i){if(n)for(let e=0;e<n.length;e++)s._unmountNodeAndChildren(n[e]);return e.innerHTML="",0}const o=e.childNodes;for(let r=0;r<i;r++)s.patch(e,o[r]||null,t[r],n?n[r]:void 0);return i}_hasKeys(e){if(!Array.isArray(e))return!1;for(let t=0,n=e.length;t<n;t++)if(e[t]&&e[t].a&&null!=e[t].a.key)return!0;return!1}_reconcileKeyed(e,t,n,s){const i=n?n.length:0,o=t.length;if(0===o){for(let e=0;e<i;e++)s._unmountNodeAndChildren(n[e]);return e.innerHTML="",0}const r=Object.create(null),h=Object.create(null);for(let t=0;t<i;t++){const s=n[t].a?n[t].a.key:null,i=e.childNodes[t];null!=s&&i&&(r[s]=i,h[s]=n[t])}const d=new Array(o),c=new Array(o);for(let e=0;e<o;e++){const n=t[e].a?t[e].a.key:null;null!=n&&r[n]?(d[e]=r[n],c[e]=h[n],delete r[n]):(d[e]=null,c[e]=null)}for(const t in r){const n=r[t];n&&(s.patch(e,n,void 0,h[t]),n.remove())}let u=e.firstChild;for(let n=0;n<o;n++){const i=d[n];if(i&&i===u)u=u.nextSibling;else if(i)e.insertBefore(i,u);else{const i=s.createElement(t[n]);i&&e.insertBefore(i,u)}}for(;u;){const e=u.nextSibling;u.remove(),u=e}for(let n=0;n<o;n++)c[n]&&s.patch(e,e.childNodes[n],t[n],c[n]);return o}removeExtraChildren(e,t,n,s){const i=t.c?t.c.length:0;if(!(i<=n))for(let o=i;o-- >n;){const n=e.lastChild;n&&(s._unmountNodeAndChildren(t.c[o]),n.remove())}}}class _{constructor(e,t,n){this.generateTree=e||y,this.renderer=t,this.lifecycleQueue=n}mount(e,t,n){const s=this.generateTree(t(),n);return this.renderer.mount(e,s),this.lifecycleQueue.flush(),s}update(e,t,n,s){const i=this.generateTree(t(),n);return this.renderer.patch(e,e.firstChild,i,s),this.lifecycleQueue.flush(),i}unmount(e,t){t&&(this.renderer.unmount(e,t),this.lifecycleQueue.flush())}}class g{constructor(e,t){void 0===t&&(t="microtask"),this._renderFn=e,this._scheduler=t,this._scheduled=!1}schedule(){this._scheduled||(this._scheduled=!0,"microtask"===this._scheduler?Promise.resolve().then(()=>this._execute()):"sync"===this._scheduler&&this._execute())}_execute(){this._scheduled=!1,this._renderFn()}}class v{constructor(e,t){void 0===t&&(t={}),this.rootComponent=e,this.savedTree=e,this.currentTree=null,this.rootNode=null,this.stateManager=new d(t),this.lifecycleQueue=new p,this.eventManager=new f,this.renderer=new c(this.eventManager,this.lifecycleQueue,new m),this.mountOrchestrator=new _(y,this.renderer,this.lifecycleQueue),this.updateLoop=new g(()=>this.update(),"microtask"),this._boundSchedule=()=>this.updateLoop.schedule(),this.stateManager.subscribe(this._boundSchedule)}mount(e){if(this.rootNode=document.getElementById(e),!this.rootNode)throw new Error(`Cannot mount app: element with id "${e}" not found`);return this.eventManager.setRootNode(this.rootNode),this.currentTree=this.mountOrchestrator.mount(this.rootNode,this.savedTree,this.stateManager),this}unmount(){this.mountOrchestrator.unmount(this.rootNode,this.currentTree),this.eventManager.destroy(),this.stateManager.unsubscribe(()=>this.updateLoop.schedule()),this.rootNode&&(this.rootNode.innerHTML=""),this.currentTree=null,this.rootNode=null}scheduleUpdate(){this.updateLoop.schedule()}update(){this.rootNode&&this.savedTree&&(this.currentTree=this.mountOrchestrator.update(this.rootNode,this.savedTree,this.stateManager,this.currentTree))}getStore(){return this.stateManager.getStore()}setStore(e,t){this.stateManager.setStore(e,t)}}function b(e,t,n){const s=new v(e,n);return s.mount(t),s}function N(e,t,n){void 0===n&&(n={});const s=new v(e,n);return s.mount(t),s}export{v as App,f as EventManager,p as LifecycleQueue,c as Renderer,d as StateManager,r as component,b as createApp,t as flatten,y as generateTree,i as generateUUID,n as h,s as isVNode,N as render};
|
package/build/index.modern.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
class e{constructor(e,t={},n=[]){this.e=e,this.a=t,this.c=n}withLifecycle(e){return e.mounted&&(this.m=e.mounted),e.updated&&(this.up=e.updated),e.unmounted&&(this.un=e.unmounted),e.deleteState&&(this.d=e.deleteState),this}withIdentity(e,t){return this.definitionId=e,this.instanceId=t,this.id=e+"_"+t,this}}function t(e,n){for(let s=0,i=n.length;s<i;s++)Array.isArray(n[s])?t(e,n[s]):e.push(n[s]);return e}function n(n,s,...i){const r={};for(let e in s)r[e]=s[e];return new e(n,r,t([],i))}function s(t){return t instanceof e||null!==t&&"object"==typeof t&&"e"in t}function i(){return Math.random().toString(36).substring(2)+(new Date).getTime().toString(36)}class r{constructor(e,t,n,s,i,r){this.definitionId=e,this.instanceId=t,this.name=n,this.key=`${e}_${t}_${n}`,this.props=s,this._stateManager=r,this._config=i,r.createState(this.key,i.state),this.mounted=i.mounted.bind(this),this.updated=i.updated.bind(this),this.unmounted=i.unmounted.bind(this),this.deleteState=()=>{this._stateManager.deleteState(this.key)},this._renderedVNode=null,this._previousProps=null;const o=i.render.bind(this);this.render=()=>{if(!this.shouldUpdate())return this._renderedVNode;const e=o();return this._renderedVNode=e,this._previousProps=this.props,e}}getStore(){return this._stateManager.getStore()}setStore(e,t){this._stateManager.setStore(e,t)}getState(){return this._stateManager.getState(this.key)}setState(e,t){this._stateManager.setState(this.key,e,t)}createState(){this._stateManager.createState(this.key,this._config.state)}deleteState(){this._stateManager.deleteState(this.key)}shouldUpdate(){return!this._previousProps||!function(e,t){if(e===t)return!0;if(!e||!t||"object"!=typeof e||"object"!=typeof t)return!1;const n=Object.keys(e),s=Object.keys(t);if(n.length!==s.length)return!1;for(let s=0;s<n.length;s++)if(e[n[s]]!==t[n[s]])return!1;return!0}(this.props,this._previousProps)}bindMethods(e){"function"==typeof e&&(e=e.bind(this)());for(let t in e)this[t]=e[t].bind(this)}}function o({name:e="",state:t={},mounted:n=function(){},updated:s=function(){},unmounted:o=function(){},methods:h=function(){},render:c=function(){}}={}){const u=i(),d=new Map;return function(a={}){const l=a.key||"__default__";if(!d.has(l)){const f=i(),p=e+(a.key?"_"+a.key:"");d.set(l,{definitionId:u,instanceId:f,key:`${u}_${f}_${p}`,_props:null,_cachedRender:null,bind(e){const i=new r(u,f,p,this._props,{state:t,mounted:n,updated:s,unmounted:o,methods:h,render:c},e);return i.bindMethods(h),i}})}const f=d.get(l);return f._props=a,f}}function h(){return h=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var s in n)({}).hasOwnProperty.call(n,s)&&(e[s]=n[s])}return e},h.apply(null,arguments)}function c(e,t){for(let n in t)e[n]=t[n];return e}class u{constructor(e={}){this.store=h({},e),this.componentStates={},this.listeners=[]}subscribe(e){this.listeners.push(e)}unsubscribe(e){const t=this.listeners.indexOf(e);t>-1&&this.listeners.splice(t,1)}_notify(){for(let e=0;e<this.listeners.length;e++)this.listeners[e]()}getStore(){return h({},this.store)}setStore(e,t){"function"==typeof e&&(e=e(this.store)),this.store=c(c({},this.store),e),this._notify(),"function"==typeof t&&t()}createState(e,t){e in this.componentStates||(this.componentStates[e]=h({},t))}getState(e){return h({},this.componentStates[e])}setState(e,t,n){"function"==typeof t&&(t=t(this.componentStates[e])),this.componentStates[e]=c(c({},this.componentStates[e]),t),this._notify(),"function"==typeof n&&n()}deleteState(e){delete this.componentStates[e]}reset(){this.store={},this.componentStates={},this.listeners=[]}}class d{constructor(e,t,n){this.eventManager=e,this.lifecycleQueue=t,this.diffEngine=n}mount(e,t){const n=this.createElement(t);n&&e.appendChild(n)}createElement(e){const t=typeof e;return"string"===t||"number"===t?document.createTextNode(e):"boolean"===t||"undefined"===t?document.createTextNode(""):"object"===t&&e.e?this._createElementNode(e):null}_createElementNode(e){const t=document.createElement(e.e);if("object"==typeof e.a){const n=Object.keys(e.a);for(let s=n.length;s--;)if("events"===n[s])e.eid=this.eventManager.bindEvents(t,e.a[n[s]]);else if("style"===n[s])this._addStyles(e.a[n[s]],t);else{if("key"===n[s])continue;t.setAttribute(n[s],e.a[n[s]])}}if(this.lifecycleQueue.mounted(e),Array.isArray(e.c))for(let n=0,s=e.c.length;n<s;n++){const s=this.createElement(e.c[n]);s&&t.appendChild(s)}return t}_addStyles(e,t){if(void 0===e)return;const n=Object.keys(e);for(let s=n.length;s--;)t.style[n[s]]=e[n[s]]}patch(e,t,n,s){const i=typeof n;if(void 0===s)this._appendChild(e,n);else if("undefined"===i)this._unmountNodeAndChildren(s),t&&t.remove();else if(this.diffEngine.areNodesEqual(n,s)){if("object"===i&&n.e){if(n===s)return;if(this._updateNodes(t,n,s),n.c!==s.c)if(this.diffEngine._hasKeys(n.c)||this.diffEngine._hasKeys(s.c))this.diffEngine.reconcileChildren(t,n.c,s.c,this);else{let e;for(let i=s.c?s.c.length:0;i--&&void 0===n.c[i];)e=t.lastChild,e&&(this._unmountNodeAndChildren(s.c[i]),e.remove());if(Array.isArray(n.c))for(let e=0,i=n.c.length;e<i;e++)this.patch(t,t.childNodes[e]||null,n.c[e],s.c?s.c[e]:void 0)}}}else if(!t||3!==t.nodeType||"string"!==i&&"number"!==i)this._unmountNodeAndChildren(s),t&&e.replaceChild(this.createElement(n),t);else{const e=String(n);t.textContent!==e&&(t.textContent=e)}}_appendChild(e,t){const n=this.createElement(t);n&&e.appendChild(n)}_updateNodes(e,t,n){if(this.lifecycleQueue.updated(t),t.a===n.a)return;if(!t.a||!n.a)return;const s=Object.keys(t.a);let i,r;for(let o=s.length;o--;)if(r=t.a[s[o]],i=n.a[s[o]],"style"===s[o]){if(this._stylesAreEqual(r,i))continue;e.removeAttribute(s[o]),this._addStyles(r,e)}else if("events"===s[o])this.eventManager.unbindEvents(e,n.eid),t.eid=this.eventManager.bindEvents(e,r);else{if("key"===s[o])continue;"value"===s[o]&&r!==i?e.value=r:void 0!==i&&r===i||e.setAttribute(s[o],r)}}_stylesAreEqual(e,t){if(e===t)return!0;const n=typeof e,s=typeof t;if("undefined"===n&&"undefined"===s)return!0;if("object"!==n||"object"!==s)return!1;const i=Object.keys(e),r=Object.keys(t);if(i.length!==r.length)return!1;for(let n=i.length;n--;)if(e[i[n]]!==t[i[n]])return!1;return!0}_unmountNodeAndChildren(e){if(null!=e&&(this.lifecycleQueue.unmounted(e),this.lifecycleQueue.deleteState(e),this.eventManager.deleteCachedEvent(e.eid),Array.isArray(e.c)))for(let t=e.c.length;t--;)this._unmountNodeAndChildren(e.c[t])}unmount(e,t){this._unmountNodeAndChildren(t),e&&(e.innerHTML="")}}class a{constructor(e,t,n){this._getCache=e,this._resolveUUID=t,this._elementToUUID=n,this._attachedTypes=new Set,this._rootNode=null}attach(e,t){this._attachedTypes.has(t)||(this._attachedTypes.add(t),this._rootNode=e,e._literaljs_hasEvents=!0,e.addEventListener(t,e=>this._handle(e)))}_handle(e){if(!this._rootNode||!this._rootNode._literaljs_hasEvents)return;let t=e.target;for(;t&&t!==this._rootNode;){let n;if(this._elementToUUID&&(n=this._elementToUUID.get(t))){const t=this._getCache(n);if(t&&"function"==typeof t[e.type])return void t[e.type](e)}const s=this._resolveUUID(t);if("string"==typeof s){const t=this._getCache(s);if(t&&"function"==typeof t[e.type])return void t[e.type](e)}t=t.parentNode}}reset(){this._attachedTypes.clear()}}const l=["abort","blur","error","focus","load","mouseenter","mouseleave","resize","scroll","unload"],f="eid";class p{constructor(){this.cache={},this.rootNode=null,this._elementToUUID=new WeakMap,this.eventBus=new a(e=>this.cache[e],e=>this.getEventUUID(e),this._elementToUUID)}setRootNode(e){this.rootNode=e}getEventUUID(e){if(!e||!e.parentNode)return;if("#document"===e.parentNode.nodeName)return;const t=e.getAttribute("data-"+f);return"string"==typeof t?t:this.getEventUUID(e.parentNode)}bindEvents(e,t){const n=i();e.setAttribute("data-"+f,n),this.cache[n]=t,this._elementToUUID.set(e,n);const s=Object.keys(t);for(let t=s.length;t--;)l.includes(s[t])?e.addEventListener(s[t],this.cache[n][s[t]]):this.eventBus.attach(this.rootNode,s[t]);return n}unbindEvents(e,t){if(!this.cache[t])return;const n=Object.keys(this.cache[t]);for(let s=n.length;s--;)l.includes(n[s])&&e.removeEventListener(n[s],this.cache[t][n[s]]);this.deleteCachedEvent(t),this._elementToUUID.delete(e),e.removeAttribute("data-"+f)}addEvents(e,t,n){n.setAttribute("data-"+f,e),this.cache[e]=t,this._elementToUUID.set(n,e);const s=Object.keys(t);for(let t=s.length;t--;)l.includes(s[t])?n.addEventListener(s[t],this.cache[e][s[t]]):this.eventBus.attach(this.rootNode,s[t])}removeIndividualEvents(e,t){if(!this.cache[t])return;const n=Object.keys(this.cache[t]);for(let s=n.length;s--;)l.includes(n[s])&&e.removeEventListener(n[s],this.cache[t][n[s]])}deleteCachedEvent(e){"string"==typeof e&&delete this.cache[e]}destroy(){this.rootNode&&(this.rootNode._literaljs_hasEvents=!1),this.cache={},this.rootNode=null,this.eventBus.reset()}}class y{constructor(){this.queue=[]}mounted(e){"object"==typeof e&&"function"==typeof e.m&&this.queue.push(e.m)}updated(e){"object"==typeof e&&"function"==typeof e.up&&this.queue.push(e.up)}unmounted(e){"object"==typeof e&&"function"==typeof e.un&&this.queue.push(e.un)}deleteState(e){"object"==typeof e&&"function"==typeof e.d&&this.queue.push(e.d)}flush(){let e;for(;e=this.queue.shift();)e()}clear(){this.queue=[]}}function m(t,n){if(null==t)return t;if("function"==typeof t.e){const e=h({},t.a.props);delete(t={e:t.e,a:h({},t.a),c:t.c}).a.props,t=t.e(e)}if(t&&"function"==typeof t.bind){const s=t.bind(n);let i;try{i=s.render()}catch(e){console.error("Component render error:",e),i={e:"div",a:{class:"error-boundary"},c:[`${e.name}: ${e.message}`]}}if("object"==typeof i&&null!==i&&i instanceof e)i.withIdentity(t.definitionId||s.definitionId,t.instanceId||s.instanceId),i.withLifecycle({mounted:s.mounted,updated:s.updated,unmounted:s.unmounted,deleteState:s.deleteState}),t=i;else if("object"==typeof i&&null!==i){const n=new e(i.e,i.a,i.c);n.withIdentity(t.definitionId||s.definitionId,t.instanceId||s.instanceId),n.withLifecycle({mounted:s.mounted,updated:s.updated,unmounted:s.unmounted,deleteState:s.deleteState}),t=n}else t=i}if(t&&Array.isArray(t.c))for(let e=0,s=t.c.length;e<s;e++)t.c[e]=m(t.c[e],n);return t}class _{areNodesEqual(e,t){const n=typeof e;return n===typeof t&&("object"===n&&e.e===t.e&&e.id===t.id||("string"===n||"number"===n)&&e===t)}reconcileChildren(e,t,n,s){return Array.isArray(t)?this._hasKeys(t)||this._hasKeys(n)?this._reconcileKeyed(e,t,n,s):this._reconcileNonKeyed(e,t,n,s):0}_reconcileNonKeyed(e,t,n,s){const i=t.length;if(0===i){if(n)for(let e=0;e<n.length;e++)s._unmountNodeAndChildren(n[e]);return e.innerHTML="",0}const r=e.childNodes;for(let o=0;o<i;o++)s.patch(e,r[o]||null,t[o],n?n[o]:void 0);return i}_hasKeys(e){if(!Array.isArray(e))return!1;for(let t=0,n=e.length;t<n;t++)if(e[t]&&e[t].a&&null!=e[t].a.key)return!0;return!1}_reconcileKeyed(e,t,n,s){const i=n?n.length:0,r=t.length;if(0===r){for(let e=0;e<i;e++)s._unmountNodeAndChildren(n[e]);return e.innerHTML="",0}const o=Object.create(null),h=Object.create(null);for(let t=0;t<i;t++){const s=n[t].a?n[t].a.key:null,i=e.childNodes[t];null!=s&&i&&(o[s]=i,h[s]=n[t])}const c=new Array(r),u=new Array(r);for(let e=0;e<r;e++){const n=t[e].a?t[e].a.key:null;null!=n&&o[n]?(c[e]=o[n],u[e]=h[n],delete o[n]):(c[e]=null,u[e]=null)}for(const t in o){const n=o[t];n&&(s.patch(e,n,void 0,h[t]),n.remove())}let d=e.firstChild;for(let n=0;n<r;n++){const i=c[n];if(i&&i===d)d=d.nextSibling;else if(i)e.insertBefore(i,d);else{const i=s.createElement(t[n]);i&&e.insertBefore(i,d)}}for(;d;){const e=d.nextSibling;d.remove(),d=e}for(let n=0;n<r;n++)u[n]&&s.patch(e,e.childNodes[n],t[n],u[n]);return r}removeExtraChildren(e,t,n,s){const i=t.c?t.c.length:0;if(!(i<=n))for(let r=i;r-- >n;){const n=e.lastChild;n&&(s._unmountNodeAndChildren(t.c[r]),n.remove())}}}class g{constructor(e,t,n){this.generateTree=e||m,this.renderer=t,this.lifecycleQueue=n}mount(e,t,n){const s=this.generateTree(t(),n);return this.renderer.mount(e,s),this.lifecycleQueue.flush(),s}update(e,t,n,s){const i=this.generateTree(t(),n);return this.renderer.patch(e,e.firstChild,i,s),this.lifecycleQueue.flush(),i}unmount(e,t){t&&(this.renderer.unmount(e,t),this.lifecycleQueue.flush())}}class v{constructor(e,t="microtask"){this._renderFn=e,this._scheduler=t,this._scheduled=!1}schedule(){this._scheduled||(this._scheduled=!0,"microtask"===this._scheduler?Promise.resolve().then(()=>this._execute()):"sync"===this._scheduler&&this._execute())}_execute(){this._scheduled=!1,this._renderFn()}}class b{constructor(e,t={}){this.rootComponent=e,this.savedTree=e,this.currentTree=null,this.rootNode=null,this.stateManager=new u(t),this.lifecycleQueue=new y,this.eventManager=new p,this.renderer=new d(this.eventManager,this.lifecycleQueue,new _),this.mountOrchestrator=new g(m,this.renderer,this.lifecycleQueue),this.updateLoop=new v(()=>this.update(),"microtask"),this._boundSchedule=()=>this.updateLoop.schedule(),this.stateManager.subscribe(this._boundSchedule)}mount(e){if(this.rootNode=document.getElementById(e),!this.rootNode)throw new Error(`Cannot mount app: element with id "${e}" not found`);return this.eventManager.setRootNode(this.rootNode),this.currentTree=this.mountOrchestrator.mount(this.rootNode,this.savedTree,this.stateManager),this}unmount(){this.mountOrchestrator.unmount(this.rootNode,this.currentTree),this.eventManager.destroy(),this.stateManager.unsubscribe(()=>this.updateLoop.schedule()),this.rootNode&&(this.rootNode.innerHTML=""),this.currentTree=null,this.rootNode=null}scheduleUpdate(){this.updateLoop.schedule()}update(){this.rootNode&&this.savedTree&&(this.currentTree=this.mountOrchestrator.update(this.rootNode,this.savedTree,this.stateManager,this.currentTree))}getStore(){return this.stateManager.getStore()}setStore(e,t){this.stateManager.setStore(e,t)}}function N(e,t,n){const s=new b(e,n);return s.mount(t),s}function S(e,t,n={}){const s=new b(e,n);return s.mount(t),s}export{b as App,p as EventManager,y as LifecycleQueue,d as Renderer,u as StateManager,o as component,N as createApp,t as flatten,m as generateTree,i as generateUUID,n as h,s as isVNode,S as render};
|
|
1
|
+
class e{constructor(e,t={},n=[]){this.e=e,this.a=t,this.c=n}withLifecycle(e){return e.mounted&&(this.m=e.mounted),e.updated&&(this.up=e.updated),e.unmounted&&(this.un=e.unmounted),e.deleteState&&(this.d=e.deleteState),this}withIdentity(e,t){return this.definitionId=e,this.instanceId=t,this.id=e+"_"+t,this}}function t(e,n){for(let s=0,i=n.length;s<i;s++)Array.isArray(n[s])?t(e,n[s]):e.push(n[s]);return e}function n(n,s,...i){const r={};for(let e in s)r[e]=s[e];return new e(n,r,t([],i))}function s(t){return t instanceof e||null!==t&&"object"==typeof t&&"e"in t}function i(){return Math.random().toString(36).substring(2)+(new Date).getTime().toString(36)}class r{constructor(e,t,n,s,i,r){this.definitionId=e,this.instanceId=t,this.name=n,this.key=`${e}_${t}_${n}`,this.props=s,this._stateManager=r,this._config=i,r.createState(this.key,i.state),this.mounted=i.mounted.bind(this),this.updated=i.updated.bind(this),this.unmounted=i.unmounted.bind(this),this.deleteState=()=>{this._stateManager.deleteState(this.key)},this._renderedVNode=null,this._previousProps=null;const o=i.render.bind(this);this.render=()=>{if(!this.shouldUpdate())return this._renderedVNode;const e=o();return this._renderedVNode=e,this._previousProps=this.props,e}}getStore(){return this._stateManager.getStore()}setStore(e,t){this._stateManager.setStore(e,t)}getState(){return this._stateManager.getState(this.key)}setState(e,t){this._stateManager.setState(this.key,e,t)}createState(){this._stateManager.createState(this.key,this._config.state)}deleteState(){this._stateManager.deleteState(this.key)}shouldUpdate(){return!this._previousProps||!function(e,t){if(e===t)return!0;if(!e||!t||"object"!=typeof e||"object"!=typeof t)return!1;const n=Object.keys(e),s=Object.keys(t);if(n.length!==s.length)return!1;for(let s=0;s<n.length;s++)if(e[n[s]]!==t[n[s]])return!1;return!0}(this.props,this._previousProps)}bindMethods(e){"function"==typeof e&&(e=e.bind(this)());for(let t in e)this[t]=e[t].bind(this)}}function o({name:e="",state:t={},mounted:n=function(){},updated:s=function(){},unmounted:o=function(){},methods:h=function(){},render:u=function(){}}={}){const c=i(),d=new Map;return function(a={}){const l=a.key||"__default__";if(!d.has(l)){const f=i(),p=e+(a.key?"_"+a.key:"");d.set(l,{definitionId:c,instanceId:f,key:`${c}_${f}_${p}`,_props:null,_cachedRender:null,bind(e){const i=new r(c,f,p,this._props,{state:t,mounted:n,updated:s,unmounted:o,methods:h,render:u},e);return i.bindMethods(h),i}})}const f=d.get(l);return f._props=a,f}}function h(){return h=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var s in n)({}).hasOwnProperty.call(n,s)&&(e[s]=n[s])}return e},h.apply(null,arguments)}function u(e,t){for(let n in t)e[n]=t[n];return e}class c{constructor(e={}){this.store=h({},e),this.componentStates={},this.listeners=[]}subscribe(e){this.listeners.push(e)}unsubscribe(e){const t=this.listeners.indexOf(e);t>-1&&this.listeners.splice(t,1)}_notify(){for(let e=0;e<this.listeners.length;e++)this.listeners[e]()}getStore(){return h({},this.store)}setStore(e,t){"function"==typeof e&&(e=e(this.store)),this.store=u(u({},this.store),e),this._notify(),"function"==typeof t&&t()}createState(e,t){e in this.componentStates||(this.componentStates[e]=h({},t))}getState(e){return h({},this.componentStates[e])}setState(e,t,n){"function"==typeof t&&(t=t(this.componentStates[e])),this.componentStates[e]=u(u({},this.componentStates[e]),t),this._notify(),"function"==typeof n&&n()}deleteState(e){delete this.componentStates[e]}reset(){this.store={},this.componentStates={},this.listeners=[]}}class d{constructor(e,t,n){this.eventManager=e,this.lifecycleQueue=t,this.diffEngine=n}mount(e,t){const n=this.createElement(t);n&&e.appendChild(n)}createElement(e){if(null==e)return document.createTextNode("");const t=typeof e;return"string"===t||"number"===t?document.createTextNode(e):"boolean"===t||"undefined"===t?document.createTextNode(""):"object"===t&&e.e?this._createElementNode(e):null}_createElementNode(e){const t=document.createElement(e.e);if("object"==typeof e.a){const n=Object.keys(e.a);for(let s=n.length;s--;)if("events"===n[s])e.eid=this.eventManager.bindEvents(t,e.a[n[s]]);else if("style"===n[s])this._addStyles(e.a[n[s]],t);else{if("key"===n[s])continue;t.setAttribute(n[s],e.a[n[s]])}}if(this.lifecycleQueue.mounted(e),Array.isArray(e.c))for(let n=0,s=e.c.length;n<s;n++){const s=this.createElement(e.c[n]);s&&t.appendChild(s)}return t}_addStyles(e,t){if(void 0===e)return;const n=Object.keys(e);for(let s=n.length;s--;)t.style[n[s]]=e[n[s]]}patch(e,t,n,s){const i=typeof n;if(void 0===s)this._appendChild(e,n);else if("undefined"===i)this._unmountNodeAndChildren(s),t&&t.remove();else if(this.diffEngine.areNodesEqual(n,s)){if("object"===i&&n.e){if(n===s)return;if(this._updateNodes(t,n,s),n.c!==s.c)if(this.diffEngine._hasKeys(n.c)||this.diffEngine._hasKeys(s.c))this.diffEngine.reconcileChildren(t,n.c,s.c,this);else{let e;for(let i=s.c?s.c.length:0;i--&&void 0===n.c[i];)e=t.lastChild,e&&(this._unmountNodeAndChildren(s.c[i]),e.remove());if(Array.isArray(n.c))for(let e=0,i=n.c.length;e<i;e++)this.patch(t,t.childNodes[e]||null,n.c[e],s.c?s.c[e]:void 0)}}}else if(!t||3!==t.nodeType||"string"!==i&&"number"!==i)this._unmountNodeAndChildren(s),t&&e.replaceChild(this.createElement(n),t);else{const e=String(n);t.textContent!==e&&(t.textContent=e)}}_appendChild(e,t){const n=this.createElement(t);n&&e.appendChild(n)}_updateNodes(e,t,n){if(this.lifecycleQueue.updated(t),t.a===n.a)return;if(!t.a||!n.a)return;const s=Object.keys(t.a);let i,r;for(let o=s.length;o--;)if(r=t.a[s[o]],i=n.a[s[o]],"style"===s[o]){if(this._stylesAreEqual(r,i))continue;e.removeAttribute(s[o]),this._addStyles(r,e)}else if("events"===s[o])this.eventManager.unbindEvents(e,n.eid),t.eid=this.eventManager.bindEvents(e,r);else{if("key"===s[o])continue;"value"===s[o]&&r!==i?e.value=r:void 0!==i&&r===i||e.setAttribute(s[o],r)}}_stylesAreEqual(e,t){if(e===t)return!0;const n=typeof e,s=typeof t;if("undefined"===n&&"undefined"===s)return!0;if("object"!==n||"object"!==s)return!1;const i=Object.keys(e),r=Object.keys(t);if(i.length!==r.length)return!1;for(let n=i.length;n--;)if(e[i[n]]!==t[i[n]])return!1;return!0}_unmountNodeAndChildren(e){if(null!=e&&(this.lifecycleQueue.unmounted(e),this.lifecycleQueue.deleteState(e),this.eventManager.deleteCachedEvent(e.eid),Array.isArray(e.c)))for(let t=e.c.length;t--;)this._unmountNodeAndChildren(e.c[t])}unmount(e,t){this._unmountNodeAndChildren(t),e&&(e.innerHTML="")}}class a{constructor(e,t,n){this._getCache=e,this._resolveUUID=t,this._elementToUUID=n,this._attachedTypes=new Set,this._rootNode=null}attach(e,t){this._attachedTypes.has(t)||(this._attachedTypes.add(t),this._rootNode=e,e._literaljs_hasEvents=!0,e.addEventListener(t,e=>this._handle(e)))}_handle(e){if(!this._rootNode||!this._rootNode._literaljs_hasEvents)return;let t=e.target;for(;t&&t!==this._rootNode;){let n;if(this._elementToUUID&&(n=this._elementToUUID.get(t))){const t=this._getCache(n);if(t&&"function"==typeof t[e.type])return void t[e.type](e)}const s=this._resolveUUID(t);if("string"==typeof s){const t=this._getCache(s);if(t&&"function"==typeof t[e.type])return void t[e.type](e)}t=t.parentNode}}reset(){this._attachedTypes.clear()}}const l=["abort","blur","error","focus","load","mouseenter","mouseleave","resize","scroll","unload"],f="eid";class p{constructor(){this.cache={},this.rootNode=null,this._elementToUUID=new WeakMap,this.eventBus=new a(e=>this.cache[e],e=>this.getEventUUID(e),this._elementToUUID)}setRootNode(e){this.rootNode=e}getEventUUID(e){if(!e||!e.parentNode)return;if("#document"===e.parentNode.nodeName)return;const t=e.getAttribute("data-"+f);return"string"==typeof t?t:this.getEventUUID(e.parentNode)}bindEvents(e,t){const n=i();e.setAttribute("data-"+f,n),this.cache[n]=t,this._elementToUUID.set(e,n);const s=Object.keys(t);for(let t=s.length;t--;)l.includes(s[t])?e.addEventListener(s[t],this.cache[n][s[t]]):this.eventBus.attach(this.rootNode,s[t]);return n}unbindEvents(e,t){if(!this.cache[t])return;const n=Object.keys(this.cache[t]);for(let s=n.length;s--;)l.includes(n[s])&&e.removeEventListener(n[s],this.cache[t][n[s]]);this.deleteCachedEvent(t),this._elementToUUID.delete(e),e.removeAttribute("data-"+f)}addEvents(e,t,n){n.setAttribute("data-"+f,e),this.cache[e]=t,this._elementToUUID.set(n,e);const s=Object.keys(t);for(let t=s.length;t--;)l.includes(s[t])?n.addEventListener(s[t],this.cache[e][s[t]]):this.eventBus.attach(this.rootNode,s[t])}removeIndividualEvents(e,t){if(!this.cache[t])return;const n=Object.keys(this.cache[t]);for(let s=n.length;s--;)l.includes(n[s])&&e.removeEventListener(n[s],this.cache[t][n[s]])}deleteCachedEvent(e){"string"==typeof e&&delete this.cache[e]}destroy(){this.rootNode&&(this.rootNode._literaljs_hasEvents=!1),this.cache={},this.rootNode=null,this.eventBus.reset()}}class y{constructor(){this.queue=[]}mounted(e){"object"==typeof e&&"function"==typeof e.m&&this.queue.push(e.m)}updated(e){"object"==typeof e&&"function"==typeof e.up&&this.queue.push(e.up)}unmounted(e){"object"==typeof e&&"function"==typeof e.un&&this.queue.push(e.un)}deleteState(e){"object"==typeof e&&"function"==typeof e.d&&this.queue.push(e.d)}flush(){let e;for(;e=this.queue.shift();)e()}clear(){this.queue=[]}}function m(t,n){if(null==t)return t;if("function"==typeof t.e){let e;e=t.a&&t.a.props?h({},t.a.props):t.a?h({},t.a):{},delete(t={e:t.e,a:h({},t.a),c:t.c}).a.props,t=t.e(e)}if(t&&"function"==typeof t.bind){const s=t.bind(n);let i;try{i=s.render()}catch(e){console.error("Component render error:",e),i={e:"div",a:{class:"error-boundary"},c:[`${e.name}: ${e.message}`]}}if("object"==typeof i&&null!==i&&i instanceof e)i.withIdentity(t.definitionId||s.definitionId,t.instanceId||s.instanceId),i.withLifecycle({mounted:s.mounted,updated:s.updated,unmounted:s.unmounted,deleteState:s.deleteState}),t=i;else if("object"==typeof i&&null!==i){const n=new e(i.e,i.a,i.c);n.withIdentity(t.definitionId||s.definitionId,t.instanceId||s.instanceId),n.withLifecycle({mounted:s.mounted,updated:s.updated,unmounted:s.unmounted,deleteState:s.deleteState}),t=n}else t=i}if(t&&Array.isArray(t.c))for(let e=0,s=t.c.length;e<s;e++)t.c[e]=m(t.c[e],n);return t}class _{areNodesEqual(e,t){const n=typeof e;return n===typeof t&&("object"===n&&e.e===t.e&&e.id===t.id||("string"===n||"number"===n)&&e===t)}reconcileChildren(e,t,n,s){return Array.isArray(t)?this._hasKeys(t)||this._hasKeys(n)?this._reconcileKeyed(e,t,n,s):this._reconcileNonKeyed(e,t,n,s):0}_reconcileNonKeyed(e,t,n,s){const i=t.length;if(0===i){if(n)for(let e=0;e<n.length;e++)s._unmountNodeAndChildren(n[e]);return e.innerHTML="",0}const r=e.childNodes;for(let o=0;o<i;o++)s.patch(e,r[o]||null,t[o],n?n[o]:void 0);return i}_hasKeys(e){if(!Array.isArray(e))return!1;for(let t=0,n=e.length;t<n;t++)if(e[t]&&e[t].a&&null!=e[t].a.key)return!0;return!1}_reconcileKeyed(e,t,n,s){const i=n?n.length:0,r=t.length;if(0===r){for(let e=0;e<i;e++)s._unmountNodeAndChildren(n[e]);return e.innerHTML="",0}const o=Object.create(null),h=Object.create(null);for(let t=0;t<i;t++){const s=n[t].a?n[t].a.key:null,i=e.childNodes[t];null!=s&&i&&(o[s]=i,h[s]=n[t])}const u=new Array(r),c=new Array(r);for(let e=0;e<r;e++){const n=t[e].a?t[e].a.key:null;null!=n&&o[n]?(u[e]=o[n],c[e]=h[n],delete o[n]):(u[e]=null,c[e]=null)}for(const t in o){const n=o[t];n&&(s.patch(e,n,void 0,h[t]),n.remove())}let d=e.firstChild;for(let n=0;n<r;n++){const i=u[n];if(i&&i===d)d=d.nextSibling;else if(i)e.insertBefore(i,d);else{const i=s.createElement(t[n]);i&&e.insertBefore(i,d)}}for(;d;){const e=d.nextSibling;d.remove(),d=e}for(let n=0;n<r;n++)c[n]&&s.patch(e,e.childNodes[n],t[n],c[n]);return r}removeExtraChildren(e,t,n,s){const i=t.c?t.c.length:0;if(!(i<=n))for(let r=i;r-- >n;){const n=e.lastChild;n&&(s._unmountNodeAndChildren(t.c[r]),n.remove())}}}class g{constructor(e,t,n){this.generateTree=e||m,this.renderer=t,this.lifecycleQueue=n}mount(e,t,n){const s=this.generateTree(t(),n);return this.renderer.mount(e,s),this.lifecycleQueue.flush(),s}update(e,t,n,s){const i=this.generateTree(t(),n);return this.renderer.patch(e,e.firstChild,i,s),this.lifecycleQueue.flush(),i}unmount(e,t){t&&(this.renderer.unmount(e,t),this.lifecycleQueue.flush())}}class v{constructor(e,t="microtask"){this._renderFn=e,this._scheduler=t,this._scheduled=!1}schedule(){this._scheduled||(this._scheduled=!0,"microtask"===this._scheduler?Promise.resolve().then(()=>this._execute()):"sync"===this._scheduler&&this._execute())}_execute(){this._scheduled=!1,this._renderFn()}}class b{constructor(e,t={}){this.rootComponent=e,this.savedTree=e,this.currentTree=null,this.rootNode=null,this.stateManager=new c(t),this.lifecycleQueue=new y,this.eventManager=new p,this.renderer=new d(this.eventManager,this.lifecycleQueue,new _),this.mountOrchestrator=new g(m,this.renderer,this.lifecycleQueue),this.updateLoop=new v(()=>this.update(),"microtask"),this._boundSchedule=()=>this.updateLoop.schedule(),this.stateManager.subscribe(this._boundSchedule)}mount(e){if(this.rootNode=document.getElementById(e),!this.rootNode)throw new Error(`Cannot mount app: element with id "${e}" not found`);return this.eventManager.setRootNode(this.rootNode),this.currentTree=this.mountOrchestrator.mount(this.rootNode,this.savedTree,this.stateManager),this}unmount(){this.mountOrchestrator.unmount(this.rootNode,this.currentTree),this.eventManager.destroy(),this.stateManager.unsubscribe(()=>this.updateLoop.schedule()),this.rootNode&&(this.rootNode.innerHTML=""),this.currentTree=null,this.rootNode=null}scheduleUpdate(){this.updateLoop.schedule()}update(){this.rootNode&&this.savedTree&&(this.currentTree=this.mountOrchestrator.update(this.rootNode,this.savedTree,this.stateManager,this.currentTree))}getStore(){return this.stateManager.getStore()}setStore(e,t){this.stateManager.setStore(e,t)}}function N(e,t,n){const s=new b(e,n);return s.mount(t),s}function S(e,t,n={}){const s=new b(e,n);return s.mount(t),s}export{b as App,p as EventManager,y as LifecycleQueue,d as Renderer,c as StateManager,o as component,N as createApp,t as flatten,m as generateTree,i as generateUUID,n as h,s as isVNode,S as render};
|
package/build/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e||self).literaljs={})}(this,function(e){class t{constructor(e,t,n){void 0===t&&(t={}),void 0===n&&(n=[]),this.e=e,this.a=t,this.c=n}withLifecycle(e){return e.mounted&&(this.m=e.mounted),e.updated&&(this.up=e.updated),e.unmounted&&(this.un=e.unmounted),e.deleteState&&(this.d=e.deleteState),this}withIdentity(e,t){return this.definitionId=e,this.instanceId=t,this.id=e+"_"+t,this}}function n(e,t){for(let s=0,i=t.length;s<i;s++)Array.isArray(t[s])?n(e,t[s]):e.push(t[s]);return e}function s(){return Math.random().toString(36).substring(2)+(new Date).getTime().toString(36)}class i{constructor(e,t,n,s,i,o){this.definitionId=e,this.instanceId=t,this.name=n,this.key=`${e}_${t}_${n}`,this.props=s,this._stateManager=o,this._config=i,o.createState(this.key,i.state),this.mounted=i.mounted.bind(this),this.updated=i.updated.bind(this),this.unmounted=i.unmounted.bind(this),this.deleteState=()=>{this._stateManager.deleteState(this.key)},this._renderedVNode=null,this._previousProps=null;const r=i.render.bind(this);this.render=()=>{if(!this.shouldUpdate())return this._renderedVNode;const e=r();return this._renderedVNode=e,this._previousProps=this.props,e}}getStore(){return this._stateManager.getStore()}setStore(e,t){this._stateManager.setStore(e,t)}getState(){return this._stateManager.getState(this.key)}setState(e,t){this._stateManager.setState(this.key,e,t)}createState(){this._stateManager.createState(this.key,this._config.state)}deleteState(){this._stateManager.deleteState(this.key)}shouldUpdate(){return!this._previousProps||!function(e,t){if(e===t)return!0;if(!e||!t||"object"!=typeof e||"object"!=typeof t)return!1;const n=Object.keys(e),s=Object.keys(t);if(n.length!==s.length)return!1;for(let s=0;s<n.length;s++)if(e[n[s]]!==t[n[s]])return!1;return!0}(this.props,this._previousProps)}bindMethods(e){"function"==typeof e&&(e=e.bind(this)());for(let t in e)this[t]=e[t].bind(this)}}function o(e,t){for(let n in t)e[n]=t[n];return e}class r{constructor(e){void 0===e&&(e={}),this.store={...e},this.componentStates={},this.listeners=[]}subscribe(e){this.listeners.push(e)}unsubscribe(e){const t=this.listeners.indexOf(e);t>-1&&this.listeners.splice(t,1)}_notify(){for(let e=0;e<this.listeners.length;e++)this.listeners[e]()}getStore(){return{...this.store}}setStore(e,t){"function"==typeof e&&(e=e(this.store)),this.store=o(o({},this.store),e),this._notify(),"function"==typeof t&&t()}createState(e,t){e in this.componentStates||(this.componentStates[e]={...t})}getState(e){return{...this.componentStates[e]}}setState(e,t,n){"function"==typeof t&&(t=t(this.componentStates[e])),this.componentStates[e]=o(o({},this.componentStates[e]),t),this._notify(),"function"==typeof n&&n()}deleteState(e){delete this.componentStates[e]}reset(){this.store={},this.componentStates={},this.listeners=[]}}class h{constructor(e,t,n){this.eventManager=e,this.lifecycleQueue=t,this.diffEngine=n}mount(e,t){const n=this.createElement(t);n&&e.appendChild(n)}createElement(e){const t=typeof e;return"string"===t||"number"===t?document.createTextNode(e):"boolean"===t||"undefined"===t?document.createTextNode(""):"object"===t&&e.e?this._createElementNode(e):null}_createElementNode(e){const t=document.createElement(e.e);if("object"==typeof e.a){const n=Object.keys(e.a);for(let s=n.length;s--;)if("events"===n[s])e.eid=this.eventManager.bindEvents(t,e.a[n[s]]);else if("style"===n[s])this._addStyles(e.a[n[s]],t);else{if("key"===n[s])continue;t.setAttribute(n[s],e.a[n[s]])}}if(this.lifecycleQueue.mounted(e),Array.isArray(e.c))for(let n=0,s=e.c.length;n<s;n++){const s=this.createElement(e.c[n]);s&&t.appendChild(s)}return t}_addStyles(e,t){if(void 0===e)return;const n=Object.keys(e);for(let s=n.length;s--;)t.style[n[s]]=e[n[s]]}patch(e,t,n,s){const i=typeof n;if(void 0===s)this._appendChild(e,n);else if("undefined"===i)this._unmountNodeAndChildren(s),t&&t.remove();else if(this.diffEngine.areNodesEqual(n,s)){if("object"===i&&n.e){if(n===s)return;if(this._updateNodes(t,n,s),n.c!==s.c)if(this.diffEngine._hasKeys(n.c)||this.diffEngine._hasKeys(s.c))this.diffEngine.reconcileChildren(t,n.c,s.c,this);else{let e;for(let i=s.c?s.c.length:0;i--&&void 0===n.c[i];)e=t.lastChild,e&&(this._unmountNodeAndChildren(s.c[i]),e.remove());if(Array.isArray(n.c))for(let e=0,i=n.c.length;e<i;e++)this.patch(t,t.childNodes[e]||null,n.c[e],s.c?s.c[e]:void 0)}}}else if(!t||3!==t.nodeType||"string"!==i&&"number"!==i)this._unmountNodeAndChildren(s),t&&e.replaceChild(this.createElement(n),t);else{const e=String(n);t.textContent!==e&&(t.textContent=e)}}_appendChild(e,t){const n=this.createElement(t);n&&e.appendChild(n)}_updateNodes(e,t,n){if(this.lifecycleQueue.updated(t),t.a===n.a)return;if(!t.a||!n.a)return;const s=Object.keys(t.a);let i,o;for(let r=s.length;r--;)if(o=t.a[s[r]],i=n.a[s[r]],"style"===s[r]){if(this._stylesAreEqual(o,i))continue;e.removeAttribute(s[r]),this._addStyles(o,e)}else if("events"===s[r])this.eventManager.unbindEvents(e,n.eid),t.eid=this.eventManager.bindEvents(e,o);else{if("key"===s[r])continue;"value"===s[r]&&o!==i?e.value=o:void 0!==i&&o===i||e.setAttribute(s[r],o)}}_stylesAreEqual(e,t){if(e===t)return!0;const n=typeof e,s=typeof t;if("undefined"===n&&"undefined"===s)return!0;if("object"!==n||"object"!==s)return!1;const i=Object.keys(e),o=Object.keys(t);if(i.length!==o.length)return!1;for(let n=i.length;n--;)if(e[i[n]]!==t[i[n]])return!1;return!0}_unmountNodeAndChildren(e){if(null!=e&&(this.lifecycleQueue.unmounted(e),this.lifecycleQueue.deleteState(e),this.eventManager.deleteCachedEvent(e.eid),Array.isArray(e.c)))for(let t=e.c.length;t--;)this._unmountNodeAndChildren(e.c[t])}unmount(e,t){this._unmountNodeAndChildren(t),e&&(e.innerHTML="")}}class d{constructor(e,t,n){this._getCache=e,this._resolveUUID=t,this._elementToUUID=n,this._attachedTypes=new Set,this._rootNode=null}attach(e,t){this._attachedTypes.has(t)||(this._attachedTypes.add(t),this._rootNode=e,e._literaljs_hasEvents=!0,e.addEventListener(t,e=>this._handle(e)))}_handle(e){if(!this._rootNode||!this._rootNode._literaljs_hasEvents)return;let t=e.target;for(;t&&t!==this._rootNode;){let n;if(this._elementToUUID&&(n=this._elementToUUID.get(t))){const t=this._getCache(n);if(t&&"function"==typeof t[e.type])return void t[e.type](e)}const s=this._resolveUUID(t);if("string"==typeof s){const t=this._getCache(s);if(t&&"function"==typeof t[e.type])return void t[e.type](e)}t=t.parentNode}}reset(){this._attachedTypes.clear()}}const c=["abort","blur","error","focus","load","mouseenter","mouseleave","resize","scroll","unload"],u="eid";class a{constructor(){this.cache={},this.rootNode=null,this._elementToUUID=new WeakMap,this.eventBus=new d(e=>this.cache[e],e=>this.getEventUUID(e),this._elementToUUID)}setRootNode(e){this.rootNode=e}getEventUUID(e){if(!e||!e.parentNode)return;if("#document"===e.parentNode.nodeName)return;const t=e.getAttribute("data-"+u);return"string"==typeof t?t:this.getEventUUID(e.parentNode)}bindEvents(e,t){const n=s();e.setAttribute("data-"+u,n),this.cache[n]=t,this._elementToUUID.set(e,n);const i=Object.keys(t);for(let t=i.length;t--;)c.includes(i[t])?e.addEventListener(i[t],this.cache[n][i[t]]):this.eventBus.attach(this.rootNode,i[t]);return n}unbindEvents(e,t){if(!this.cache[t])return;const n=Object.keys(this.cache[t]);for(let s=n.length;s--;)c.includes(n[s])&&e.removeEventListener(n[s],this.cache[t][n[s]]);this.deleteCachedEvent(t),this._elementToUUID.delete(e),e.removeAttribute("data-"+u)}addEvents(e,t,n){n.setAttribute("data-"+u,e),this.cache[e]=t,this._elementToUUID.set(n,e);const s=Object.keys(t);for(let t=s.length;t--;)c.includes(s[t])?n.addEventListener(s[t],this.cache[e][s[t]]):this.eventBus.attach(this.rootNode,s[t])}removeIndividualEvents(e,t){if(!this.cache[t])return;const n=Object.keys(this.cache[t]);for(let s=n.length;s--;)c.includes(n[s])&&e.removeEventListener(n[s],this.cache[t][n[s]])}deleteCachedEvent(e){"string"==typeof e&&delete this.cache[e]}destroy(){this.rootNode&&(this.rootNode._literaljs_hasEvents=!1),this.cache={},this.rootNode=null,this.eventBus.reset()}}class l{constructor(){this.queue=[]}mounted(e){"object"==typeof e&&"function"==typeof e.m&&this.queue.push(e.m)}updated(e){"object"==typeof e&&"function"==typeof e.up&&this.queue.push(e.up)}unmounted(e){"object"==typeof e&&"function"==typeof e.un&&this.queue.push(e.un)}deleteState(e){"object"==typeof e&&"function"==typeof e.d&&this.queue.push(e.d)}flush(){let e;for(;e=this.queue.shift();)e()}clear(){this.queue=[]}}function f(e,n){if(null==e)return e;if("function"==typeof e.e){const t={...e.a.props};delete(e={e:e.e,a:{...e.a},c:e.c}).a.props,e=e.e(t)}if(e&&"function"==typeof e.bind){const s=e.bind(n);let i;try{i=s.render()}catch(e){console.error("Component render error:",e),i={e:"div",a:{class:"error-boundary"},c:[`${e.name}: ${e.message}`]}}if("object"==typeof i&&null!==i&&i instanceof t)i.withIdentity(e.definitionId||s.definitionId,e.instanceId||s.instanceId),i.withLifecycle({mounted:s.mounted,updated:s.updated,unmounted:s.unmounted,deleteState:s.deleteState}),e=i;else if("object"==typeof i&&null!==i){const n=new t(i.e,i.a,i.c);n.withIdentity(e.definitionId||s.definitionId,e.instanceId||s.instanceId),n.withLifecycle({mounted:s.mounted,updated:s.updated,unmounted:s.unmounted,deleteState:s.deleteState}),e=n}else e=i}if(e&&Array.isArray(e.c))for(let t=0,s=e.c.length;t<s;t++)e.c[t]=f(e.c[t],n);return e}class p{areNodesEqual(e,t){const n=typeof e;return n===typeof t&&("object"===n&&e.e===t.e&&e.id===t.id||("string"===n||"number"===n)&&e===t)}reconcileChildren(e,t,n,s){return Array.isArray(t)?this._hasKeys(t)||this._hasKeys(n)?this._reconcileKeyed(e,t,n,s):this._reconcileNonKeyed(e,t,n,s):0}_reconcileNonKeyed(e,t,n,s){const i=t.length;if(0===i){if(n)for(let e=0;e<n.length;e++)s._unmountNodeAndChildren(n[e]);return e.innerHTML="",0}const o=e.childNodes;for(let r=0;r<i;r++)s.patch(e,o[r]||null,t[r],n?n[r]:void 0);return i}_hasKeys(e){if(!Array.isArray(e))return!1;for(let t=0,n=e.length;t<n;t++)if(e[t]&&e[t].a&&null!=e[t].a.key)return!0;return!1}_reconcileKeyed(e,t,n,s){const i=n?n.length:0,o=t.length;if(0===o){for(let e=0;e<i;e++)s._unmountNodeAndChildren(n[e]);return e.innerHTML="",0}const r=Object.create(null),h=Object.create(null);for(let t=0;t<i;t++){const s=n[t].a?n[t].a.key:null,i=e.childNodes[t];null!=s&&i&&(r[s]=i,h[s]=n[t])}const d=new Array(o),c=new Array(o);for(let e=0;e<o;e++){const n=t[e].a?t[e].a.key:null;null!=n&&r[n]?(d[e]=r[n],c[e]=h[n],delete r[n]):(d[e]=null,c[e]=null)}for(const t in r){const n=r[t];n&&(s.patch(e,n,void 0,h[t]),n.remove())}let u=e.firstChild;for(let n=0;n<o;n++){const i=d[n];if(i&&i===u)u=u.nextSibling;else if(i)e.insertBefore(i,u);else{const i=s.createElement(t[n]);i&&e.insertBefore(i,u)}}for(;u;){const e=u.nextSibling;u.remove(),u=e}for(let n=0;n<o;n++)c[n]&&s.patch(e,e.childNodes[n],t[n],c[n]);return o}removeExtraChildren(e,t,n,s){const i=t.c?t.c.length:0;if(!(i<=n))for(let o=i;o-- >n;){const n=e.lastChild;n&&(s._unmountNodeAndChildren(t.c[o]),n.remove())}}}class y{constructor(e,t,n){this.generateTree=e||f,this.renderer=t,this.lifecycleQueue=n}mount(e,t,n){const s=this.generateTree(t(),n);return this.renderer.mount(e,s),this.lifecycleQueue.flush(),s}update(e,t,n,s){const i=this.generateTree(t(),n);return this.renderer.patch(e,e.firstChild,i,s),this.lifecycleQueue.flush(),i}unmount(e,t){t&&(this.renderer.unmount(e,t),this.lifecycleQueue.flush())}}class m{constructor(e,t){void 0===t&&(t="microtask"),this._renderFn=e,this._scheduler=t,this._scheduled=!1}schedule(){this._scheduled||(this._scheduled=!0,"microtask"===this._scheduler?Promise.resolve().then(()=>this._execute()):"sync"===this._scheduler&&this._execute())}_execute(){this._scheduled=!1,this._renderFn()}}class _{constructor(e,t){void 0===t&&(t={}),this.rootComponent=e,this.savedTree=e,this.currentTree=null,this.rootNode=null,this.stateManager=new r(t),this.lifecycleQueue=new l,this.eventManager=new a,this.renderer=new h(this.eventManager,this.lifecycleQueue,new p),this.mountOrchestrator=new y(f,this.renderer,this.lifecycleQueue),this.updateLoop=new m(()=>this.update(),"microtask"),this._boundSchedule=()=>this.updateLoop.schedule(),this.stateManager.subscribe(this._boundSchedule)}mount(e){if(this.rootNode=document.getElementById(e),!this.rootNode)throw new Error(`Cannot mount app: element with id "${e}" not found`);return this.eventManager.setRootNode(this.rootNode),this.currentTree=this.mountOrchestrator.mount(this.rootNode,this.savedTree,this.stateManager),this}unmount(){this.mountOrchestrator.unmount(this.rootNode,this.currentTree),this.eventManager.destroy(),this.stateManager.unsubscribe(()=>this.updateLoop.schedule()),this.rootNode&&(this.rootNode.innerHTML=""),this.currentTree=null,this.rootNode=null}scheduleUpdate(){this.updateLoop.schedule()}update(){this.rootNode&&this.savedTree&&(this.currentTree=this.mountOrchestrator.update(this.rootNode,this.savedTree,this.stateManager,this.currentTree))}getStore(){return this.stateManager.getStore()}setStore(e,t){this.stateManager.setStore(e,t)}}e.App=_,e.EventManager=a,e.LifecycleQueue=l,e.Renderer=h,e.StateManager=r,e.component=function(e){let t=void 0===e?{}:e,n=t.name,o=void 0===n?"":n,r=t.state,h=void 0===r?{}:r,d=t.mounted,c=void 0===d?function(){}:d,u=t.updated,a=void 0===u?function(){}:u,l=t.unmounted,f=void 0===l?function(){}:l,p=t.methods,y=void 0===p?function(){}:p,m=t.render,_=void 0===m?function(){}:m;const g=s(),v=new Map;return function(e){void 0===e&&(e={});const t=e.key||"__default__";if(!v.has(t)){const n=s(),r=o+(e.key?"_"+e.key:"");v.set(t,{definitionId:g,instanceId:n,key:`${g}_${n}_${r}`,_props:null,_cachedRender:null,bind(e){const t=new i(g,n,r,this._props,{state:h,mounted:c,updated:a,unmounted:f,methods:y,render:_},e);return t.bindMethods(y),t}})}const n=v.get(t);return n._props=e,n}},e.createApp=function(e,t,n){const s=new _(e,n);return s.mount(t),s},e.flatten=n,e.generateTree=f,e.generateUUID=s,e.h=function(e,s){const i={};for(let e in s)i[e]=s[e];return new t(e,i,n([],[].slice.call(arguments,2)))},e.isVNode=function(e){return e instanceof t||null!==e&&"object"==typeof e&&"e"in e},e.render=function(e,t,n){void 0===n&&(n={});const s=new _(e,n);return s.mount(t),s}});
|
|
1
|
+
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e||self).literaljs={})}(this,function(e){class t{constructor(e,t,n){void 0===t&&(t={}),void 0===n&&(n=[]),this.e=e,this.a=t,this.c=n}withLifecycle(e){return e.mounted&&(this.m=e.mounted),e.updated&&(this.up=e.updated),e.unmounted&&(this.un=e.unmounted),e.deleteState&&(this.d=e.deleteState),this}withIdentity(e,t){return this.definitionId=e,this.instanceId=t,this.id=e+"_"+t,this}}function n(e,t){for(let s=0,i=t.length;s<i;s++)Array.isArray(t[s])?n(e,t[s]):e.push(t[s]);return e}function s(){return Math.random().toString(36).substring(2)+(new Date).getTime().toString(36)}class i{constructor(e,t,n,s,i,o){this.definitionId=e,this.instanceId=t,this.name=n,this.key=`${e}_${t}_${n}`,this.props=s,this._stateManager=o,this._config=i,o.createState(this.key,i.state),this.mounted=i.mounted.bind(this),this.updated=i.updated.bind(this),this.unmounted=i.unmounted.bind(this),this.deleteState=()=>{this._stateManager.deleteState(this.key)},this._renderedVNode=null,this._previousProps=null;const r=i.render.bind(this);this.render=()=>{if(!this.shouldUpdate())return this._renderedVNode;const e=r();return this._renderedVNode=e,this._previousProps=this.props,e}}getStore(){return this._stateManager.getStore()}setStore(e,t){this._stateManager.setStore(e,t)}getState(){return this._stateManager.getState(this.key)}setState(e,t){this._stateManager.setState(this.key,e,t)}createState(){this._stateManager.createState(this.key,this._config.state)}deleteState(){this._stateManager.deleteState(this.key)}shouldUpdate(){return!this._previousProps||!function(e,t){if(e===t)return!0;if(!e||!t||"object"!=typeof e||"object"!=typeof t)return!1;const n=Object.keys(e),s=Object.keys(t);if(n.length!==s.length)return!1;for(let s=0;s<n.length;s++)if(e[n[s]]!==t[n[s]])return!1;return!0}(this.props,this._previousProps)}bindMethods(e){"function"==typeof e&&(e=e.bind(this)());for(let t in e)this[t]=e[t].bind(this)}}function o(e,t){for(let n in t)e[n]=t[n];return e}class r{constructor(e){void 0===e&&(e={}),this.store={...e},this.componentStates={},this.listeners=[]}subscribe(e){this.listeners.push(e)}unsubscribe(e){const t=this.listeners.indexOf(e);t>-1&&this.listeners.splice(t,1)}_notify(){for(let e=0;e<this.listeners.length;e++)this.listeners[e]()}getStore(){return{...this.store}}setStore(e,t){"function"==typeof e&&(e=e(this.store)),this.store=o(o({},this.store),e),this._notify(),"function"==typeof t&&t()}createState(e,t){e in this.componentStates||(this.componentStates[e]={...t})}getState(e){return{...this.componentStates[e]}}setState(e,t,n){"function"==typeof t&&(t=t(this.componentStates[e])),this.componentStates[e]=o(o({},this.componentStates[e]),t),this._notify(),"function"==typeof n&&n()}deleteState(e){delete this.componentStates[e]}reset(){this.store={},this.componentStates={},this.listeners=[]}}class h{constructor(e,t,n){this.eventManager=e,this.lifecycleQueue=t,this.diffEngine=n}mount(e,t){const n=this.createElement(t);n&&e.appendChild(n)}createElement(e){if(null==e)return document.createTextNode("");const t=typeof e;return"string"===t||"number"===t?document.createTextNode(e):"boolean"===t||"undefined"===t?document.createTextNode(""):"object"===t&&e.e?this._createElementNode(e):null}_createElementNode(e){const t=document.createElement(e.e);if("object"==typeof e.a){const n=Object.keys(e.a);for(let s=n.length;s--;)if("events"===n[s])e.eid=this.eventManager.bindEvents(t,e.a[n[s]]);else if("style"===n[s])this._addStyles(e.a[n[s]],t);else{if("key"===n[s])continue;t.setAttribute(n[s],e.a[n[s]])}}if(this.lifecycleQueue.mounted(e),Array.isArray(e.c))for(let n=0,s=e.c.length;n<s;n++){const s=this.createElement(e.c[n]);s&&t.appendChild(s)}return t}_addStyles(e,t){if(void 0===e)return;const n=Object.keys(e);for(let s=n.length;s--;)t.style[n[s]]=e[n[s]]}patch(e,t,n,s){const i=typeof n;if(void 0===s)this._appendChild(e,n);else if("undefined"===i)this._unmountNodeAndChildren(s),t&&t.remove();else if(this.diffEngine.areNodesEqual(n,s)){if("object"===i&&n.e){if(n===s)return;if(this._updateNodes(t,n,s),n.c!==s.c)if(this.diffEngine._hasKeys(n.c)||this.diffEngine._hasKeys(s.c))this.diffEngine.reconcileChildren(t,n.c,s.c,this);else{let e;for(let i=s.c?s.c.length:0;i--&&void 0===n.c[i];)e=t.lastChild,e&&(this._unmountNodeAndChildren(s.c[i]),e.remove());if(Array.isArray(n.c))for(let e=0,i=n.c.length;e<i;e++)this.patch(t,t.childNodes[e]||null,n.c[e],s.c?s.c[e]:void 0)}}}else if(!t||3!==t.nodeType||"string"!==i&&"number"!==i)this._unmountNodeAndChildren(s),t&&e.replaceChild(this.createElement(n),t);else{const e=String(n);t.textContent!==e&&(t.textContent=e)}}_appendChild(e,t){const n=this.createElement(t);n&&e.appendChild(n)}_updateNodes(e,t,n){if(this.lifecycleQueue.updated(t),t.a===n.a)return;if(!t.a||!n.a)return;const s=Object.keys(t.a);let i,o;for(let r=s.length;r--;)if(o=t.a[s[r]],i=n.a[s[r]],"style"===s[r]){if(this._stylesAreEqual(o,i))continue;e.removeAttribute(s[r]),this._addStyles(o,e)}else if("events"===s[r])this.eventManager.unbindEvents(e,n.eid),t.eid=this.eventManager.bindEvents(e,o);else{if("key"===s[r])continue;"value"===s[r]&&o!==i?e.value=o:void 0!==i&&o===i||e.setAttribute(s[r],o)}}_stylesAreEqual(e,t){if(e===t)return!0;const n=typeof e,s=typeof t;if("undefined"===n&&"undefined"===s)return!0;if("object"!==n||"object"!==s)return!1;const i=Object.keys(e),o=Object.keys(t);if(i.length!==o.length)return!1;for(let n=i.length;n--;)if(e[i[n]]!==t[i[n]])return!1;return!0}_unmountNodeAndChildren(e){if(null!=e&&(this.lifecycleQueue.unmounted(e),this.lifecycleQueue.deleteState(e),this.eventManager.deleteCachedEvent(e.eid),Array.isArray(e.c)))for(let t=e.c.length;t--;)this._unmountNodeAndChildren(e.c[t])}unmount(e,t){this._unmountNodeAndChildren(t),e&&(e.innerHTML="")}}class d{constructor(e,t,n){this._getCache=e,this._resolveUUID=t,this._elementToUUID=n,this._attachedTypes=new Set,this._rootNode=null}attach(e,t){this._attachedTypes.has(t)||(this._attachedTypes.add(t),this._rootNode=e,e._literaljs_hasEvents=!0,e.addEventListener(t,e=>this._handle(e)))}_handle(e){if(!this._rootNode||!this._rootNode._literaljs_hasEvents)return;let t=e.target;for(;t&&t!==this._rootNode;){let n;if(this._elementToUUID&&(n=this._elementToUUID.get(t))){const t=this._getCache(n);if(t&&"function"==typeof t[e.type])return void t[e.type](e)}const s=this._resolveUUID(t);if("string"==typeof s){const t=this._getCache(s);if(t&&"function"==typeof t[e.type])return void t[e.type](e)}t=t.parentNode}}reset(){this._attachedTypes.clear()}}const c=["abort","blur","error","focus","load","mouseenter","mouseleave","resize","scroll","unload"],u="eid";class a{constructor(){this.cache={},this.rootNode=null,this._elementToUUID=new WeakMap,this.eventBus=new d(e=>this.cache[e],e=>this.getEventUUID(e),this._elementToUUID)}setRootNode(e){this.rootNode=e}getEventUUID(e){if(!e||!e.parentNode)return;if("#document"===e.parentNode.nodeName)return;const t=e.getAttribute("data-"+u);return"string"==typeof t?t:this.getEventUUID(e.parentNode)}bindEvents(e,t){const n=s();e.setAttribute("data-"+u,n),this.cache[n]=t,this._elementToUUID.set(e,n);const i=Object.keys(t);for(let t=i.length;t--;)c.includes(i[t])?e.addEventListener(i[t],this.cache[n][i[t]]):this.eventBus.attach(this.rootNode,i[t]);return n}unbindEvents(e,t){if(!this.cache[t])return;const n=Object.keys(this.cache[t]);for(let s=n.length;s--;)c.includes(n[s])&&e.removeEventListener(n[s],this.cache[t][n[s]]);this.deleteCachedEvent(t),this._elementToUUID.delete(e),e.removeAttribute("data-"+u)}addEvents(e,t,n){n.setAttribute("data-"+u,e),this.cache[e]=t,this._elementToUUID.set(n,e);const s=Object.keys(t);for(let t=s.length;t--;)c.includes(s[t])?n.addEventListener(s[t],this.cache[e][s[t]]):this.eventBus.attach(this.rootNode,s[t])}removeIndividualEvents(e,t){if(!this.cache[t])return;const n=Object.keys(this.cache[t]);for(let s=n.length;s--;)c.includes(n[s])&&e.removeEventListener(n[s],this.cache[t][n[s]])}deleteCachedEvent(e){"string"==typeof e&&delete this.cache[e]}destroy(){this.rootNode&&(this.rootNode._literaljs_hasEvents=!1),this.cache={},this.rootNode=null,this.eventBus.reset()}}class l{constructor(){this.queue=[]}mounted(e){"object"==typeof e&&"function"==typeof e.m&&this.queue.push(e.m)}updated(e){"object"==typeof e&&"function"==typeof e.up&&this.queue.push(e.up)}unmounted(e){"object"==typeof e&&"function"==typeof e.un&&this.queue.push(e.un)}deleteState(e){"object"==typeof e&&"function"==typeof e.d&&this.queue.push(e.d)}flush(){let e;for(;e=this.queue.shift();)e()}clear(){this.queue=[]}}function f(e,n){if(null==e)return e;if("function"==typeof e.e){let t;t=e.a&&e.a.props?{...e.a.props}:e.a?{...e.a}:{},delete(e={e:e.e,a:{...e.a},c:e.c}).a.props,e=e.e(t)}if(e&&"function"==typeof e.bind){const s=e.bind(n);let i;try{i=s.render()}catch(e){console.error("Component render error:",e),i={e:"div",a:{class:"error-boundary"},c:[`${e.name}: ${e.message}`]}}if("object"==typeof i&&null!==i&&i instanceof t)i.withIdentity(e.definitionId||s.definitionId,e.instanceId||s.instanceId),i.withLifecycle({mounted:s.mounted,updated:s.updated,unmounted:s.unmounted,deleteState:s.deleteState}),e=i;else if("object"==typeof i&&null!==i){const n=new t(i.e,i.a,i.c);n.withIdentity(e.definitionId||s.definitionId,e.instanceId||s.instanceId),n.withLifecycle({mounted:s.mounted,updated:s.updated,unmounted:s.unmounted,deleteState:s.deleteState}),e=n}else e=i}if(e&&Array.isArray(e.c))for(let t=0,s=e.c.length;t<s;t++)e.c[t]=f(e.c[t],n);return e}class p{areNodesEqual(e,t){const n=typeof e;return n===typeof t&&("object"===n&&e.e===t.e&&e.id===t.id||("string"===n||"number"===n)&&e===t)}reconcileChildren(e,t,n,s){return Array.isArray(t)?this._hasKeys(t)||this._hasKeys(n)?this._reconcileKeyed(e,t,n,s):this._reconcileNonKeyed(e,t,n,s):0}_reconcileNonKeyed(e,t,n,s){const i=t.length;if(0===i){if(n)for(let e=0;e<n.length;e++)s._unmountNodeAndChildren(n[e]);return e.innerHTML="",0}const o=e.childNodes;for(let r=0;r<i;r++)s.patch(e,o[r]||null,t[r],n?n[r]:void 0);return i}_hasKeys(e){if(!Array.isArray(e))return!1;for(let t=0,n=e.length;t<n;t++)if(e[t]&&e[t].a&&null!=e[t].a.key)return!0;return!1}_reconcileKeyed(e,t,n,s){const i=n?n.length:0,o=t.length;if(0===o){for(let e=0;e<i;e++)s._unmountNodeAndChildren(n[e]);return e.innerHTML="",0}const r=Object.create(null),h=Object.create(null);for(let t=0;t<i;t++){const s=n[t].a?n[t].a.key:null,i=e.childNodes[t];null!=s&&i&&(r[s]=i,h[s]=n[t])}const d=new Array(o),c=new Array(o);for(let e=0;e<o;e++){const n=t[e].a?t[e].a.key:null;null!=n&&r[n]?(d[e]=r[n],c[e]=h[n],delete r[n]):(d[e]=null,c[e]=null)}for(const t in r){const n=r[t];n&&(s.patch(e,n,void 0,h[t]),n.remove())}let u=e.firstChild;for(let n=0;n<o;n++){const i=d[n];if(i&&i===u)u=u.nextSibling;else if(i)e.insertBefore(i,u);else{const i=s.createElement(t[n]);i&&e.insertBefore(i,u)}}for(;u;){const e=u.nextSibling;u.remove(),u=e}for(let n=0;n<o;n++)c[n]&&s.patch(e,e.childNodes[n],t[n],c[n]);return o}removeExtraChildren(e,t,n,s){const i=t.c?t.c.length:0;if(!(i<=n))for(let o=i;o-- >n;){const n=e.lastChild;n&&(s._unmountNodeAndChildren(t.c[o]),n.remove())}}}class y{constructor(e,t,n){this.generateTree=e||f,this.renderer=t,this.lifecycleQueue=n}mount(e,t,n){const s=this.generateTree(t(),n);return this.renderer.mount(e,s),this.lifecycleQueue.flush(),s}update(e,t,n,s){const i=this.generateTree(t(),n);return this.renderer.patch(e,e.firstChild,i,s),this.lifecycleQueue.flush(),i}unmount(e,t){t&&(this.renderer.unmount(e,t),this.lifecycleQueue.flush())}}class m{constructor(e,t){void 0===t&&(t="microtask"),this._renderFn=e,this._scheduler=t,this._scheduled=!1}schedule(){this._scheduled||(this._scheduled=!0,"microtask"===this._scheduler?Promise.resolve().then(()=>this._execute()):"sync"===this._scheduler&&this._execute())}_execute(){this._scheduled=!1,this._renderFn()}}class _{constructor(e,t){void 0===t&&(t={}),this.rootComponent=e,this.savedTree=e,this.currentTree=null,this.rootNode=null,this.stateManager=new r(t),this.lifecycleQueue=new l,this.eventManager=new a,this.renderer=new h(this.eventManager,this.lifecycleQueue,new p),this.mountOrchestrator=new y(f,this.renderer,this.lifecycleQueue),this.updateLoop=new m(()=>this.update(),"microtask"),this._boundSchedule=()=>this.updateLoop.schedule(),this.stateManager.subscribe(this._boundSchedule)}mount(e){if(this.rootNode=document.getElementById(e),!this.rootNode)throw new Error(`Cannot mount app: element with id "${e}" not found`);return this.eventManager.setRootNode(this.rootNode),this.currentTree=this.mountOrchestrator.mount(this.rootNode,this.savedTree,this.stateManager),this}unmount(){this.mountOrchestrator.unmount(this.rootNode,this.currentTree),this.eventManager.destroy(),this.stateManager.unsubscribe(()=>this.updateLoop.schedule()),this.rootNode&&(this.rootNode.innerHTML=""),this.currentTree=null,this.rootNode=null}scheduleUpdate(){this.updateLoop.schedule()}update(){this.rootNode&&this.savedTree&&(this.currentTree=this.mountOrchestrator.update(this.rootNode,this.savedTree,this.stateManager,this.currentTree))}getStore(){return this.stateManager.getStore()}setStore(e,t){this.stateManager.setStore(e,t)}}e.App=_,e.EventManager=a,e.LifecycleQueue=l,e.Renderer=h,e.StateManager=r,e.component=function(e){let t=void 0===e?{}:e,n=t.name,o=void 0===n?"":n,r=t.state,h=void 0===r?{}:r,d=t.mounted,c=void 0===d?function(){}:d,u=t.updated,a=void 0===u?function(){}:u,l=t.unmounted,f=void 0===l?function(){}:l,p=t.methods,y=void 0===p?function(){}:p,m=t.render,_=void 0===m?function(){}:m;const g=s(),v=new Map;return function(e){void 0===e&&(e={});const t=e.key||"__default__";if(!v.has(t)){const n=s(),r=o+(e.key?"_"+e.key:"");v.set(t,{definitionId:g,instanceId:n,key:`${g}_${n}_${r}`,_props:null,_cachedRender:null,bind(e){const t=new i(g,n,r,this._props,{state:h,mounted:c,updated:a,unmounted:f,methods:y,render:_},e);return t.bindMethods(y),t}})}const n=v.get(t);return n._props=e,n}},e.createApp=function(e,t,n){const s=new _(e,n);return s.mount(t),s},e.flatten=n,e.generateTree=f,e.generateUUID=s,e.h=function(e,s){const i={};for(let e in s)i[e]=s[e];return new t(e,i,n([],[].slice.call(arguments,2)))},e.isVNode=function(e){return e instanceof t||null!==e&&"object"==typeof e&&"e"in e},e.render=function(e,t,n){void 0===n&&(n={});const s=new _(e,n);return s.mount(t),s}});
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "literaljs",
|
|
3
|
-
"version": "8.0.
|
|
3
|
+
"version": "8.0.3",
|
|
4
4
|
"description": "A small JavaScript library for building reactive user interfaces.",
|
|
5
5
|
"main": "build/index.js",
|
|
6
6
|
"module": "build/index.m.js",
|
|
@@ -24,7 +24,16 @@
|
|
|
24
24
|
},
|
|
25
25
|
"babel": {
|
|
26
26
|
"presets": [
|
|
27
|
-
[
|
|
27
|
+
[
|
|
28
|
+
"@babel/preset-env",
|
|
29
|
+
{
|
|
30
|
+
"targets": {
|
|
31
|
+
"chrome": "90",
|
|
32
|
+
"firefox": "90",
|
|
33
|
+
"safari": "14"
|
|
34
|
+
}
|
|
35
|
+
}
|
|
36
|
+
]
|
|
28
37
|
]
|
|
29
38
|
},
|
|
30
39
|
"devDependencies": {
|
|
@@ -36,4 +45,4 @@
|
|
|
36
45
|
"jsdom": "^29.1.1",
|
|
37
46
|
"microbundle": "^0.15.1"
|
|
38
47
|
}
|
|
39
|
-
}
|
|
48
|
+
}
|