@symbiotejs/symbiote 1.10.2 → 1.10.5

package/README.md

@@ -7,6 +7,8 @@ Simple, light and very powerful library to create embedded components for any pu
 ## ⚖️ What for?
 Symbiote.js - is for symbiosis. That means, you can create complex meta-applications, above another applications, built with any modern stack.
 
+The major purpose of Symbiote.js - is to move application inner interactions from the locked space of certain frameworks implementations to the common open space based on native platform features and standards, to be closer to the HTML, CSS and simple DOM APIs, without a lack of DX.
+
 Best for:
 * Complex widgets
 * Micro frontends

package/build/BaseComponent.min.js

@@ -1 +1 @@
-var O=Object.defineProperty;var N=(n,t,e)=>t in n?O(n,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):n[t]=e;var P=(n,t,e)=>(N(n,typeof t!="symbol"?t+"":t,e),e);function $(n){let t=e=>{var s;for(let i in e)((s=e[i])==null?void 0:s.constructor)===Object&&(e[i]=t(e[i]));return{...e}};return t(n)}var h=class{constructor(t){this.uid=Symbol(),this.name=t.name||null,t.schema.constructor===Object?this.store=$(t.schema):(this._storeIsProxy=!0,this.store=t.schema),this.callbackMap=Object.create(null)}static warn(t,e){console.warn(`Symbiote Data: cannot ${t}. Prop name: `+e)}read(t){return!this._storeIsProxy&&!this.store.hasOwnProperty(t)?(h.warn("read",t),null):this.store[t]}has(t){return this._storeIsProxy?this.store[t]!==void 0:this.store.hasOwnProperty(t)}add(t,e,s=!1){if(!s&&Object.keys(this.store).includes(t)){e!==this.store[t]&&this.notify(t);return}this.store[t]=e,this.notify(t)}pub(t,e){if(!this._storeIsProxy&&!this.store.hasOwnProperty(t)){h.warn("publish",t);return}this.store[t]=e,this.notify(t)}multiPub(t){for(let e in t)this.pub(e,t[e])}notify(t){this.callbackMap[t]&&this.callbackMap[t].forEach(e=>{e(this.store[t])})}sub(t,e,s=!0){return!this._storeIsProxy&&!this.store.hasOwnProperty(t)?(h.warn("subscribe",t),null):(this.callbackMap[t]||(this.callbackMap[t]=new Set),this.callbackMap[t].add(e),s&&e(this.store[t]),{remove:()=>{this.callbackMap[t].delete(e),this.callbackMap[t].size||delete this.callbackMap[t]},callback:e})}remove(){delete h.globalStore[this.uid]}static registerLocalCtx(t){let e=new h({schema:t});return h.globalStore[e.uid]=e,e}static registerNamedCtx(t,e){let s=h.globalStore[t];return s?console.warn('State: context name "'+t+'" already in use'):(s=new h({name:t,schema:e}),h.globalStore[t]=s),s}static clearNamedCtx(t){delete h.globalStore[t]}static getNamedCtx(t,e=!0){return h.globalStore[t]||(e&&console.warn('State: wrong context name - "'+t+'"'),null)}};h.globalStore=Object.create(null);var o=Object.freeze({BIND_ATTR:"set",ATTR_BIND_PRFX:"@",EXT_DATA_CTX_PRFX:"*",NAMED_DATA_CTX_SPLTR:"/",CTX_NAME_ATTR:"ctx-name",CSS_CTX_PROP:"--ctx-name",EL_REF_ATTR:"ref",AUTO_TAG_PRFX:"sym",REPEAT_ATTR:"repeat",REPEAT_ITEM_TAG_ATTR:"repeat-item-tag",SET_LATER_KEY:"__toSetLater__",USE_TPL:"use-template"});var g="1234567890QWERTYUIOPASDFGHJKLZXCVBNMqwertyuiopasdfghjklzxcvbnm",k=g.length-1,y=class{static generate(t="XXXXXXXXX-XXX"){let e="";for(let s=0;s<t.length;s++)e+=t[s]==="-"?t[s]:g.charAt(Math.random()*k);return e}};function E(n,t,e){let s=!0,i,r=t.split(".");return r.forEach((l,a)=>{a<r.length-1?n=n[l]:i=l}),n?n[i]=e:s=!1,s}function x(n){return n.split("-").map((t,e)=>t&&e?t[0].toUpperCase()+t.slice(1):t).join("").split("_").map((t,e)=>t&&e?t.toUpperCase():t).join("")}function R(n,t){[...n.querySelectorAll(`[${o.REPEAT_ATTR}]`)].forEach(e=>{let s=e.getAttribute(o.REPEAT_ITEM_TAG_ATTR),i;if(s&&(i=window.customElements.get(s)),!i){i=class extends t.BaseComponent{constructor(){super();s||(this.style.display="contents")}};let l=e.innerHTML;i.template=l,i.reg(s)}for(;e.firstChild;)e.firstChild.remove();let r=e.getAttribute(o.REPEAT_ATTR);t.sub(r,l=>{if(!l){for(;e.firstChild;)e.firstChild.remove();return}let a=[...e.children],f,b=u=>{u.forEach((c,A)=>{if(a[A])if(a[A].set$)a[A].set$(c);else for(let C in c)a[A][C]=c[C];else{f||(f=new DocumentFragment);let C=new i;Object.assign(C.init$,c),f.appendChild(C)}}),f&&e.appendChild(f);let d=a.slice(u.length,a.length);for(let c of d)c.remove()};if(l.constructor===Array)b(l);else if(l.constructor===Object){let u=[];for(let d in l){let c=l[d];Object.defineProperty(c,"_KEY_",{value:d,enumerable:!0}),u.push(c)}b(u)}else console.warn("Symbiote repeat data type error:"),console.log(l)}),e.removeAttribute(o.REPEAT_ATTR),e.removeAttribute(o.REPEAT_ITEM_TAG_ATTR)})}function I(n,t){if(t.shadowRoot)return;let e=[...n.querySelectorAll("slot")];if(t.initChildren.length&&e.length){let s={};e.forEach(i=>{let r=i.getAttribute("name");r?s[r]={slot:i,fr:document.createDocumentFragment()}:s.__default__={slot:i,fr:document.createDocumentFragment()}}),t.initChildren.forEach(i=>{var l;let r=(l=i.getAttribute)==null?void 0:l.call(i,"slot");r?(i.removeAttribute("slot"),s[r].fr.appendChild(i)):s.__default__&&s.__default__.fr.appendChild(i)}),Object.values(s).forEach(i=>{i.slot.parentNode.insertBefore(i.fr,i.slot),i.slot.remove()})}}function L(n,t){[...n.querySelectorAll(`[${o.EL_REF_ATTR}]`)].forEach(e=>{let s=e.getAttribute(o.EL_REF_ATTR);t.ref[s]=e,e.removeAttribute(o.EL_REF_ATTR)})}function M(n,t){[...n.querySelectorAll(`[${o.BIND_ATTR}]`)].forEach(e=>{let i=e.getAttribute(o.BIND_ATTR).split(";");[...e.attributes].forEach(r=>{if(r.name.startsWith("-")&&r.value){let l=x(r.name.replace("-",""));i.push(l+":"+r.value),e.removeAttribute(r.name)}}),i.forEach(r=>{if(!r)return;let l=r.split(":").map(u=>u.trim()),a=l[0],f;a.indexOf(o.ATTR_BIND_PRFX)===0&&(f=!0,a=a.replace(o.ATTR_BIND_PRFX,""));let b=l[1].split(",").map(u=>u.trim());for(let u of b){let d;u.startsWith("!!")?(d="double",u=u.replace("!!","")):u.startsWith("!")&&(d="single",u=u.replace("!","")),t.sub(u,c=>{d==="double"?c=!!c:d==="single"&&(c=!c),f?(c==null?void 0:c.constructor)===Boolean?c?e.setAttribute(a,""):e.removeAttribute(a):e.setAttribute(a,c):E(e,a,c)||(e[o.SET_LATER_KEY]||(e[o.SET_LATER_KEY]=Object.create(null)),e[o.SET_LATER_KEY][a]=c)})}}),e.removeAttribute(o.BIND_ATTR)})}var S="{{",p="}}",j="skip-text";function F(n){let t,e=[],s=document.createTreeWalker(n,NodeFilter.SHOW_TEXT,{acceptNode:i=>{var r;return!((r=i.parentElement)==null?void 0:r.hasAttribute(j))&&i.textContent.includes(S)&&i.textContent.includes(p)&&1}});for(;t=s.nextNode();)e.push(t);return e}var K=function(n,t){F(n).forEach(s=>{let i=[],r;for(;s.textContent.includes(p);)s.textContent.startsWith(S)?(r=s.textContent.indexOf(p)+p.length,s.splitText(r),i.push(s)):(r=s.textContent.indexOf(S),s.splitText(r)),s=s.nextSibling;i.forEach(l=>{let a=l.textContent.replace(S,"").replace(p,"");l.textContent="",t.sub(a,f=>{l.textContent=f})})})},w=[R,I,L,M,K];var D=0,m=null,_=null,T=class extends HTMLElement{constructor(){super();P(this,"updateCssData",()=>{var t;this.dropCssDataCache(),(t=this.__boundCssProps)==null||t.forEach(e=>{let s=this.getCssData(this.__extractCssName(e),!0);this.$[e]!==s&&(this.$[e]=s)})});this.init$=Object.create(null),this.cssInit$=Object.create(null),this.tplProcessors=new Set,this.ref=Object.create(null),this.allSubs=new Set,this.pauseRender=!1,this.renderShadow=!1,this.readyToDestroy=!0,this.processInnerHtml=!1,this.allowCustomTemplate=!1}get BaseComponent(){return T}initCallback(){}__initCallback(){var t;this.__initialized||(this.__initialized=!0,(t=this.initCallback)==null||t.call(this))}render(t,e=this.renderShadow){let s;if((e||this.constructor.__shadowStylesUrl)&&!this.shadowRoot&&this.attachShadow({mode:"open"}),this.allowCustomTemplate){let r=this.getAttribute(o.USE_TPL);if(r){let l=this.getRootNode(),a=(l==null?void 0:l.querySelector(r))||document.querySelector(r);a?t=a.content.cloneNode(!0):console.warn(`Symbiote template "${r}" is not found...`)}}if(this.processInnerHtml)for(let r of this.tplProcessors)r(this,this);if(t||this.constructor.template){if(this.constructor.template&&!this.constructor.__tpl&&(this.constructor.__tpl=document.createElement("template"),this.constructor.__tpl.innerHTML=this.constructor.template),(t==null?void 0:t.constructor)===DocumentFragment)s=t;else if((t==null?void 0:t.constructor)===String){let r=document.createElement("template");r.innerHTML=t,s=r.content.cloneNode(!0)}else this.constructor.__tpl&&(s=this.constructor.__tpl.content.cloneNode(!0));for(let r of this.tplProcessors)r(s,this)}let i=()=>{s&&(e&&this.shadowRoot.appendChild(s)||this.appendChild(s)),this.__initCallback()};if(this.constructor.__shadowStylesUrl){e=!0;let r=document.createElement("link");r.rel="stylesheet",r.href=this.constructor.__shadowStylesUrl,r.onload=i,this.shadowRoot.prepend(r)}else i()}addTemplateProcessor(t){this.tplProcessors.add(t)}get autoCtxName(){return this.__autoCtxName||(this.__autoCtxName=y.generate(),this.style.setProperty(o.CSS_CTX_PROP,`'${this.__autoCtxName}'`)),this.__autoCtxName}get cssCtxName(){return this.getCssData(o.CSS_CTX_PROP,!0)}get ctxName(){var t;return((t=this.getAttribute(o.CTX_NAME_ATTR))==null?void 0:t.trim())||this.cssCtxName||this.autoCtxName}get localCtx(){return this.__localCtx||(this.__localCtx=h.registerLocalCtx({})),this.__localCtx}get nodeCtx(){return h.getNamedCtx(this.ctxName,!1)||h.registerNamedCtx(this.ctxName,{})}static __parseProp(t,e){let s,i;if(t.startsWith(o.EXT_DATA_CTX_PRFX))s=e.nodeCtx,i=t.replace(o.EXT_DATA_CTX_PRFX,"");else if(t.includes(o.NAMED_DATA_CTX_SPLTR)){let r=t.split(o.NAMED_DATA_CTX_SPLTR);s=h.getNamedCtx(r[0]),i=r[1]}else s=e.localCtx,i=t;return{ctx:s,name:i}}sub(t,e,s=!0){let i=T.__parseProp(t,this);i.ctx.has(t)?this.allSubs.add(i.ctx.sub(i.name,e,s)):window.setTimeout(()=>{this.allSubs.add(i.ctx.sub(i.name,e,s))})}notify(t){let e=T.__parseProp(t,this);e.ctx.notify(e.name)}has(t){let e=T.__parseProp(t,this);return e.ctx.has(e.name)}add(t,e){let s=T.__parseProp(t,this);s.ctx.add(s.name,e,!1)}add$(t){for(let e in t)this.add(e,t[e])}get $(){if(!this.__stateProxy){let t=Object.create(null);this.__stateProxy=new Proxy(t,{set:(e,s,i)=>{let r=T.__parseProp(s,this);return r.ctx.pub(r.name,i),!0},get:(e,s)=>{let i=T.__parseProp(s,this);return i.ctx.read(i.name)}})}return this.__stateProxy}set$(t,e=!1){for(let s in t){let i=t[s];e||![String,Number,Boolean].includes(i==null?void 0:i.constructor)?this.$[s]=i:this.$[s]!==i&&(this.$[s]=i)}}__initDataCtx(){let t=this.constructor.__attrDesc;if(t)for(let e of Object.values(t))Object.keys(this.init$).includes(e)||(this.init$[e]="");for(let e in this.init$)if(e.startsWith(o.EXT_DATA_CTX_PRFX))this.nodeCtx.add(e.replace(o.EXT_DATA_CTX_PRFX,""),this.init$[e]);else if(e.includes(o.NAMED_DATA_CTX_SPLTR)){let s=e.split(o.NAMED_DATA_CTX_SPLTR),i=s[0].trim(),r=s[1].trim();if(i&&r){let l=h.getNamedCtx(i,!1);l||(l=h.registerNamedCtx(i,{})),l.add(r,this.init$[e])}}else this.localCtx.add(e,this.init$[e]);for(let e in this.cssInit$)this.bindCssData(e,this.cssInit$[e]);this.__dataCtxInitialized=!0}connectedCallback(){var t;if(!!this.isConnected){if(this.__disconnectTimeout&&window.clearTimeout(this.__disconnectTimeout),!this.connectedOnce){let e=(t=this.getAttribute(o.CTX_NAME_ATTR))==null?void 0:t.trim();if(e&&this.style.setProperty(o.CSS_CTX_PROP,`'${e}'`),this.__initDataCtx(),this[o.SET_LATER_KEY]){for(let s in this[o.SET_LATER_KEY])E(this,s,this[o.SET_LATER_KEY][s]);delete this[o.SET_LATER_KEY]}this.initChildren=[...this.childNodes];for(let s of w)this.addTemplateProcessor(s);this.pauseRender?this.__initCallback():this.render()}this.connectedOnce=!0}}destroyCallback(){}disconnectedCallback(){!this.connectedOnce||(this.dropCssDataCache(),!!this.readyToDestroy&&(this.__disconnectTimeout&&window.clearTimeout(this.__disconnectTimeout),this.__disconnectTimeout=window.setTimeout(()=>{this.destroyCallback();for(let t of this.allSubs)t.remove(),this.allSubs.delete(t);for(let t of this.tplProcessors)this.tplProcessors.delete(t);_==null||_.delete(this.updateCssData),(_==null?void 0:_.size)||(m==null||m.disconnect(),m=null,_=null)},100)))}static reg(t,e=!1){if(t||(D++,t=`${o.AUTO_TAG_PRFX}-${D}`),this.__tag=t,window.customElements.get(t)){console.warn(`${t} - is already in "customElements" registry`);return}window.customElements.define(t,e?class extends this{}:this)}static get is(){return this.__tag||this.reg(),this.__tag}static bindAttributes(t){this.observedAttributes=Object.keys(t),this.__attrDesc=t}attributeChangedCallback(t,e,s){var r;if(e===s)return;let i=(r=this.constructor.__attrDesc)==null?void 0:r[t];i?this.__dataCtxInitialized?this.$[i]=s:this.init$[i]=s:this[t]=s}getCssData(t,e=!1){if(this.__cssDataCache||(this.__cssDataCache=Object.create(null)),!Object.keys(this.__cssDataCache).includes(t)){this.__computedStyle||(this.__computedStyle=window.getComputedStyle(this));let s=this.__computedStyle.getPropertyValue(t).trim();s.startsWith("'")&&s.endsWith("'")&&(s=s.replace(/\'/g,'"'));try{this.__cssDataCache[t]=JSON.parse(s)}catch{!e&&console.warn(`CSS Data error: ${t}`),this.__cssDataCache[t]=null}}return this.__cssDataCache[t]}__extractCssName(t){return t.split("--").map((e,s)=>s===0?"":e).join("--")}__initStyleAttrObserver(){_||(_=new Set),_.add(this.updateCssData),m||(m=new MutationObserver(t=>{t[0].type==="attributes"&&_.forEach(e=>{e()})}),m.observe(document,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["style"]}))}bindCssData(t,e=""){this.__boundCssProps||(this.__boundCssProps=new Set),this.__boundCssProps.add(t);let s=this.getCssData(this.__extractCssName(t),!0);s===null&&(s=e),this.add(t,s),this.__initStyleAttrObserver()}dropCssDataCache(){this.__cssDataCache=null,this.__computedStyle=null}defineAccessor(t,e,s){let i="__"+t;this[i]=this[t],Object.defineProperty(this,t,{set:r=>{this[i]=r,s?window.setTimeout(()=>{e==null||e(r)}):e==null||e(r)},get:()=>this[i]}),this[t]=this[i]}static set shadowStyles(t){let e=new Blob([t],{type:"text/css"});this.__shadowStylesUrl=URL.createObjectURL(e)}},X=T;P(X,"template");export{X as BaseComponent};
+var O=Object.defineProperty;var N=(l,t,e)=>t in l?O(l,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):l[t]=e;var S=(l,t,e)=>(N(l,typeof t!="symbol"?t+"":t,e),e);function $(l){let t=e=>{var s;for(let i in e)((s=e[i])==null?void 0:s.constructor)===Object&&(e[i]=t(e[i]));return{...e}};return t(l)}var h=class{constructor(t){t.constructor===Object?this.store=$(t):(this._storeIsProxy=!0,this.store=t),this.callbackMap=Object.create(null)}static warn(t,e){console.warn(`Symbiote Data: cannot ${t}. Prop name: `+e)}read(t){return!this._storeIsProxy&&!this.store.hasOwnProperty(t)?(h.warn("read",t),null):this.store[t]}has(t){return this._storeIsProxy?this.store[t]!==void 0:this.store.hasOwnProperty(t)}add(t,e,s=!1){if(!s&&Object.keys(this.store).includes(t)){e!==this.store[t]&&this.notify(t);return}this.store[t]=e,this.notify(t)}pub(t,e){if(!this._storeIsProxy&&!this.store.hasOwnProperty(t)){h.warn("publish",t);return}this.store[t]=e,this.notify(t)}multiPub(t){for(let e in t)this.pub(e,t[e])}notify(t){this.callbackMap[t]&&this.callbackMap[t].forEach(e=>{e(this.store[t])})}sub(t,e,s=!0){return!this._storeIsProxy&&!this.store.hasOwnProperty(t)?(h.warn("subscribe",t),null):(this.callbackMap[t]||(this.callbackMap[t]=new Set),this.callbackMap[t].add(e),s&&e(this.store[t]),{remove:()=>{this.callbackMap[t].delete(e),this.callbackMap[t].size||delete this.callbackMap[t]},callback:e})}static registerCtx(t,e=Symbol()){let s=h.globalStore.get(e);return s?console.warn('State: context UID "'+e+'" already in use'):(s=new h(t),h.globalStore.set(e,s)),s}static deleteCtx(t){h.globalStore.delete(t)}static getCtx(t,e=!0){return h.globalStore.get(t)||(e&&console.warn('State: wrong context UID - "'+t+'"'),null)}};h.globalStore=new Map;var o=Object.freeze({BIND_ATTR:"set",ATTR_BIND_PRFX:"@",EXT_DATA_CTX_PRFX:"*",NAMED_DATA_CTX_SPLTR:"/",CTX_NAME_ATTR:"ctx-name",CTX_OWNER_ATTR:"ctx-owner",CSS_CTX_PROP:"--ctx-name",EL_REF_ATTR:"ref",AUTO_TAG_PRFX:"sym",REPEAT_ATTR:"repeat",REPEAT_ITEM_TAG_ATTR:"repeat-item-tag",SET_LATER_KEY:"__toSetLater__",USE_TPL:"use-template"});var R="1234567890QWERTYUIOPASDFGHJKLZXCVBNMqwertyuiopasdfghjklzxcvbnm",I=R.length-1,x=class{static generate(t="XXXXXXXXX-XXX"){let e="";for(let s=0;s<t.length;s++)e+=t[s]==="-"?t[s]:R.charAt(Math.random()*I);return e}};function E(l,t,e){let s=!0,i,r=t.split(".");return r.forEach((n,a)=>{a<r.length-1?l=l[n]:i=n}),l?l[i]=e:s=!1,s}function g(l){return l.split("-").map((t,e)=>t&&e?t[0].toUpperCase()+t.slice(1):t).join("").split("_").map((t,e)=>t&&e?t.toUpperCase():t).join("")}function y(l,t){[...l.querySelectorAll(`[${o.REPEAT_ATTR}]`)].forEach(e=>{let s=e.getAttribute(o.REPEAT_ITEM_TAG_ATTR),i;if(s&&(i=window.customElements.get(s)),!i){i=class extends t.BaseComponent{constructor(){super();s||(this.style.display="contents")}};let n=e.innerHTML;i.template=n,i.reg(s)}for(;e.firstChild;)e.firstChild.remove();let r=e.getAttribute(o.REPEAT_ATTR);t.sub(r,n=>{if(!n){for(;e.firstChild;)e.firstChild.remove();return}let a=[...e.children],f,p=u=>{u.forEach((c,b)=>{if(a[b])if(a[b].set$)a[b].set$(c);else for(let C in c)a[b][C]=c[C];else{f||(f=new DocumentFragment);let C=new i;Object.assign(C.init$,c),f.appendChild(C)}}),f&&e.appendChild(f);let d=a.slice(u.length,a.length);for(let c of d)c.remove()};if(n.constructor===Array)p(n);else if(n.constructor===Object){let u=[];for(let d in n){let c=n[d];Object.defineProperty(c,"_KEY_",{value:d,enumerable:!0}),u.push(c)}p(u)}else console.warn("Symbiote repeat data type error:"),console.log(n)}),e.removeAttribute(o.REPEAT_ATTR),e.removeAttribute(o.REPEAT_ITEM_TAG_ATTR)})}function k(l,t){if(t.shadowRoot)return;let e=[...l.querySelectorAll("slot")];if(t.initChildren.length&&e.length){let s={};e.forEach(i=>{let r=i.getAttribute("name");r?s[r]={slot:i,fr:document.createDocumentFragment()}:s.__default__={slot:i,fr:document.createDocumentFragment()}}),t.initChildren.forEach(i=>{var n;let r=(n=i.getAttribute)==null?void 0:n.call(i,"slot");r?(i.removeAttribute("slot"),s[r].fr.appendChild(i)):s.__default__&&s.__default__.fr.appendChild(i)}),Object.values(s).forEach(i=>{i.slot.parentNode.insertBefore(i.fr,i.slot),i.slot.remove()})}}function L(l,t){[...l.querySelectorAll(`[${o.EL_REF_ATTR}]`)].forEach(e=>{let s=e.getAttribute(o.EL_REF_ATTR);t.ref[s]=e,e.removeAttribute(o.EL_REF_ATTR)})}function M(l,t){[...l.querySelectorAll(`[${o.BIND_ATTR}]`)].forEach(e=>{let i=e.getAttribute(o.BIND_ATTR).split(";");[...e.attributes].forEach(r=>{if(r.name.startsWith("-")&&r.value){let n=g(r.name.replace("-",""));i.push(n+":"+r.value),e.removeAttribute(r.name)}}),i.forEach(r=>{if(!r)return;let n=r.split(":").map(u=>u.trim()),a=n[0],f;a.indexOf(o.ATTR_BIND_PRFX)===0&&(f=!0,a=a.replace(o.ATTR_BIND_PRFX,""));let p=n[1].split(",").map(u=>u.trim());for(let u of p){let d;u.startsWith("!!")?(d="double",u=u.replace("!!","")):u.startsWith("!")&&(d="single",u=u.replace("!","")),t.sub(u,c=>{d==="double"?c=!!c:d==="single"&&(c=!c),f?(c==null?void 0:c.constructor)===Boolean?c?e.setAttribute(a,""):e.removeAttribute(a):e.setAttribute(a,c):E(e,a,c)||(e[o.SET_LATER_KEY]||(e[o.SET_LATER_KEY]=Object.create(null)),e[o.SET_LATER_KEY][a]=c)})}}),e.removeAttribute(o.BIND_ATTR)})}var P="{{",A="}}",j="skip-text";function F(l){let t,e=[],s=document.createTreeWalker(l,NodeFilter.SHOW_TEXT,{acceptNode:i=>{var r;return!((r=i.parentElement)==null?void 0:r.hasAttribute(j))&&i.textContent.includes(P)&&i.textContent.includes(A)&&1}});for(;t=s.nextNode();)e.push(t);return e}var K=function(l,t){F(l).forEach(s=>{let i=[],r;for(;s.textContent.includes(A);)s.textContent.startsWith(P)?(r=s.textContent.indexOf(A)+A.length,s.splitText(r),i.push(s)):(r=s.textContent.indexOf(P),s.splitText(r)),s=s.nextSibling;i.forEach(n=>{let a=n.textContent.replace(P,"").replace(A,"");n.textContent="",t.sub(a,f=>{n.textContent=f})})})},w=[y,k,L,M,K];var D=0,m=null,_=null,T=class extends HTMLElement{constructor(){super();S(this,"updateCssData",()=>{var t;this.dropCssDataCache(),(t=this.__boundCssProps)==null||t.forEach(e=>{let s=this.getCssData(this.__extractCssName(e),!0);this.$[e]!==s&&(this.$[e]=s)})});this.init$=Object.create(null),this.cssInit$=Object.create(null),this.tplProcessors=new Set,this.ref=Object.create(null),this.allSubs=new Set,this.pauseRender=!1,this.renderShadow=!1,this.readyToDestroy=!0,this.processInnerHtml=!1,this.allowCustomTemplate=!1,this.ctxOwner=!1}get BaseComponent(){return T}initCallback(){}__initCallback(){var t;this.__initialized||(this.__initialized=!0,(t=this.initCallback)==null||t.call(this))}render(t,e=this.renderShadow){let s;if((e||this.constructor.__shadowStylesUrl)&&!this.shadowRoot&&this.attachShadow({mode:"open"}),this.allowCustomTemplate){let r=this.getAttribute(o.USE_TPL);if(r){let n=this.getRootNode(),a=(n==null?void 0:n.querySelector(r))||document.querySelector(r);a?t=a.content.cloneNode(!0):console.warn(`Symbiote template "${r}" is not found...`)}}if(this.processInnerHtml)for(let r of this.tplProcessors)r(this,this);if(t||this.constructor.template){if(this.constructor.template&&!this.constructor.__tpl&&(this.constructor.__tpl=document.createElement("template"),this.constructor.__tpl.innerHTML=this.constructor.template),(t==null?void 0:t.constructor)===DocumentFragment)s=t;else if((t==null?void 0:t.constructor)===String){let r=document.createElement("template");r.innerHTML=t,s=r.content.cloneNode(!0)}else this.constructor.__tpl&&(s=this.constructor.__tpl.content.cloneNode(!0));for(let r of this.tplProcessors)r(s,this)}let i=()=>{s&&(e&&this.shadowRoot.appendChild(s)||this.appendChild(s)),this.__initCallback()};if(this.constructor.__shadowStylesUrl){e=!0;let r=document.createElement("link");r.rel="stylesheet",r.href=this.constructor.__shadowStylesUrl,r.onload=i,this.shadowRoot.prepend(r)}else i()}addTemplateProcessor(t){this.tplProcessors.add(t)}get autoCtxName(){return this.__autoCtxName||(this.__autoCtxName=x.generate(),this.style.setProperty(o.CSS_CTX_PROP,`'${this.__autoCtxName}'`)),this.__autoCtxName}get cssCtxName(){return this.getCssData(o.CSS_CTX_PROP,!0)}get ctxName(){var t;return((t=this.getAttribute(o.CTX_NAME_ATTR))==null?void 0:t.trim())||this.cssCtxName||this.autoCtxName}get localCtx(){return this.__localCtx||(this.__localCtx=h.registerCtx({},this)),this.__localCtx}get nodeCtx(){return h.getCtx(this.ctxName,!1)||h.registerCtx({},this.ctxName)}static __parseProp(t,e){let s,i;if(t.startsWith(o.EXT_DATA_CTX_PRFX))s=e.nodeCtx,i=t.replace(o.EXT_DATA_CTX_PRFX,"");else if(t.includes(o.NAMED_DATA_CTX_SPLTR)){let r=t.split(o.NAMED_DATA_CTX_SPLTR);s=h.getCtx(r[0]),i=r[1]}else s=e.localCtx,i=t;return{ctx:s,name:i}}sub(t,e,s=!0){let i=n=>{!this.isConnected||e(n)},r=T.__parseProp(t,this);r.ctx.has(t)?this.allSubs.add(r.ctx.sub(r.name,i,s)):window.setTimeout(()=>{this.allSubs.add(r.ctx.sub(r.name,i,s))})}notify(t){let e=T.__parseProp(t,this);e.ctx.notify(e.name)}has(t){let e=T.__parseProp(t,this);return e.ctx.has(e.name)}add(t,e,s=!1){let i=T.__parseProp(t,this);i.ctx.add(i.name,e,s)}add$(t,e=!1){for(let s in t)this.add(s,t[s],e)}get $(){if(!this.__stateProxy){let t=Object.create(null);this.__stateProxy=new Proxy(t,{set:(e,s,i)=>{let r=T.__parseProp(s,this);return r.ctx.pub(r.name,i),!0},get:(e,s)=>{let i=T.__parseProp(s,this);return i.ctx.read(i.name)}})}return this.__stateProxy}set$(t,e=!1){for(let s in t){let i=t[s];e||![String,Number,Boolean].includes(i==null?void 0:i.constructor)?this.$[s]=i:this.$[s]!==i&&(this.$[s]=i)}}get __ctxOwner(){return this.ctxOwner||this.hasAttribute(o.CTX_OWNER_ATTR)&&this.getAttribute(o.CTX_OWNER_ATTR)!=="false"}__initDataCtx(){let t=this.constructor.__attrDesc;if(t)for(let e of Object.values(t))Object.keys(this.init$).includes(e)||(this.init$[e]="");for(let e in this.init$)if(e.startsWith(o.EXT_DATA_CTX_PRFX))this.nodeCtx.add(e.replace(o.EXT_DATA_CTX_PRFX,""),this.init$[e],this.__ctxOwner);else if(e.includes(o.NAMED_DATA_CTX_SPLTR)){let s=e.split(o.NAMED_DATA_CTX_SPLTR),i=s[0].trim(),r=s[1].trim();if(i&&r){let n=h.getCtx(i,!1);n||(n=h.registerCtx({},i)),n.add(r,this.init$[e])}}else this.localCtx.add(e,this.init$[e]);for(let e in this.cssInit$)this.bindCssData(e,this.cssInit$[e]);this.__dataCtxInitialized=!0}connectedCallback(){var t;if(!!this.isConnected){if(this.__disconnectTimeout&&window.clearTimeout(this.__disconnectTimeout),!this.connectedOnce){let e=(t=this.getAttribute(o.CTX_NAME_ATTR))==null?void 0:t.trim();if(e&&this.style.setProperty(o.CSS_CTX_PROP,`'${e}'`),this.__initDataCtx(),this[o.SET_LATER_KEY]){for(let s in this[o.SET_LATER_KEY])E(this,s,this[o.SET_LATER_KEY][s]);delete this[o.SET_LATER_KEY]}this.initChildren=[...this.childNodes];for(let s of w)this.addTemplateProcessor(s);this.pauseRender?this.__initCallback():this.render()}this.connectedOnce=!0}}destroyCallback(){}disconnectedCallback(){!this.connectedOnce||(this.dropCssDataCache(),!!this.readyToDestroy&&(this.__disconnectTimeout&&window.clearTimeout(this.__disconnectTimeout),this.__disconnectTimeout=window.setTimeout(()=>{this.destroyCallback();for(let t of this.allSubs)t.remove(),this.allSubs.delete(t);for(let t of this.tplProcessors)this.tplProcessors.delete(t);_==null||_.delete(this.updateCssData),(_==null?void 0:_.size)||(m==null||m.disconnect(),m=null,_=null)},100)))}static reg(t,e=!1){if(t||(D++,t=`${o.AUTO_TAG_PRFX}-${D}`),this.__tag=t,window.customElements.get(t)){console.warn(`${t} - is already in "customElements" registry`);return}window.customElements.define(t,e?class extends this{}:this)}static get is(){return this.__tag||this.reg(),this.__tag}static bindAttributes(t){this.observedAttributes=Object.keys(t),this.__attrDesc=t}attributeChangedCallback(t,e,s){var r;if(e===s)return;let i=(r=this.constructor.__attrDesc)==null?void 0:r[t];i?this.__dataCtxInitialized?this.$[i]=s:this.init$[i]=s:this[t]=s}getCssData(t,e=!1){if(this.__cssDataCache||(this.__cssDataCache=Object.create(null)),!Object.keys(this.__cssDataCache).includes(t)){this.__computedStyle||(this.__computedStyle=window.getComputedStyle(this));let s=this.__computedStyle.getPropertyValue(t).trim();s.startsWith("'")&&s.endsWith("'")&&(s=s.replace(/\'/g,'"'));try{this.__cssDataCache[t]=JSON.parse(s)}catch{!e&&console.warn(`CSS Data error: ${t}`),this.__cssDataCache[t]=null}}return this.__cssDataCache[t]}__extractCssName(t){return t.split("--").map((e,s)=>s===0?"":e).join("--")}__initStyleAttrObserver(){_||(_=new Set),_.add(this.updateCssData),m||(m=new MutationObserver(t=>{t[0].type==="attributes"&&_.forEach(e=>{e()})}),m.observe(document,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["style"]}))}bindCssData(t,e=""){this.__boundCssProps||(this.__boundCssProps=new Set),this.__boundCssProps.add(t);let s=this.getCssData(this.__extractCssName(t),!0);s===null&&(s=e),this.add(t,s),this.__initStyleAttrObserver()}dropCssDataCache(){this.__cssDataCache=null,this.__computedStyle=null}defineAccessor(t,e,s){let i="__"+t;this[i]=this[t],Object.defineProperty(this,t,{set:r=>{this[i]=r,s?window.setTimeout(()=>{e==null||e(r)}):e==null||e(r)},get:()=>this[i]}),this[t]=this[i]}static set shadowStyles(t){let e=new Blob([t],{type:"text/css"});this.__shadowStylesUrl=URL.createObjectURL(e)}},X=T;S(X,"template");export{X as BaseComponent};

package/build/symbiote.d.ts

@@ -1,21 +1,13 @@
 export class Data {
 	static warn(actionName: string, prop: string): void;
-	static registerLocalCtx(schema: {
+	static registerCtx(schema: {
 		[x: string]: any;
-	}): Data;
-	static registerNamedCtx(ctxName: string, schema: {
+	}, uid?: any): Data;
+	static deleteCtx(uid: any): void;
+	static getCtx(uid: any, notify?: boolean): Data;
+	constructor(schema: {
 		[x: string]: any;
-	}): Data;
-	static clearNamedCtx(ctxName: string): void;
-	static getNamedCtx(ctxName: string, notify?: boolean): Data;
-	constructor(src: {
-		name?: string;
-		schema: {
-			[x: string]: any;
-		};
 	});
-	uid: symbol;
-	name: string;
 	store: {
 		[x: string]: any;
 	};
@@ -33,10 +25,9 @@ export class Data {
 		remove: () => void;
 		callback: Function;
 	};
-	remove(): void;
 }
 export namespace Data {
-	const globalStore: any;
+	const globalStore: Map<any, any>;
 }
 export class BaseComponent<S> extends HTMLElement {
 	static template: string;
@@ -68,6 +59,7 @@ export class BaseComponent<S> extends HTMLElement {
 	readyToDestroy: boolean;
 	processInnerHtml: boolean;
 	allowCustomTemplate: boolean;
+	ctxOwner: boolean;
 	get autoCtxName(): string;
 	private __autoCtxName;
 	get cssCtxName(): string;
@@ -78,11 +70,12 @@ export class BaseComponent<S> extends HTMLElement {
 	sub<T_1 extends keyof S>(prop: T_1, handler: (value: S[T_1]) => void, init?: boolean): void;
 	notify(prop: string): void;
 	has(prop: string): boolean;
-	add<T_2 extends keyof S>(prop: string, val: S[T_2]): void;
-	add$(obj: Partial<S>): void;
+	add<T_2 extends keyof S>(prop: string, val: S[T_2], rewrite?: boolean): void;
+	add$(obj: Partial<S>, rewrite?: boolean): void;
 	get $(): S;
 	private __stateProxy;
 	set$(kvObj: Partial<S>, forcePrimitives?: boolean): void;
+	private get __ctxOwner();
 	private __initDataCtx;
 	private __dataCtxInitialized;
 	connectedCallback(): void;

package/build/symbiote.js

@@ -19,14 +19,12 @@ function cloneObj(obj) {
   return clone(obj);
 }
 var Data = class {
-  constructor(src) {
-    this.uid = Symbol();
-    this.name = src.name || null;
-    if (src.schema.constructor === Object) {
-      this.store = cloneObj(src.schema);
+  constructor(schema) {
+    if (schema.constructor === Object) {
+      this.store = cloneObj(schema);
     } else {
       this._storeIsProxy = true;
-      this.store = src.schema;
+      this.store = schema;
     }
     this.callbackMap = Object.create(null);
   }
@@ -95,37 +93,24 @@ var Data = class {
       callback
     };
   }
-  remove() {
-    delete Data.globalStore[this.uid];
-  }
-  static registerLocalCtx(schema) {
-    let state = new Data({
-      schema
-    });
-    Data.globalStore[state.uid] = state;
-    return state;
-  }
-  static registerNamedCtx(ctxName, schema) {
-    let state = Data.globalStore[ctxName];
-    if (state) {
-      console.warn('State: context name "' + ctxName + '" already in use');
+  static registerCtx(schema, uid = Symbol()) {
+    let data = Data.globalStore.get(uid);
+    if (data) {
+      console.warn('State: context UID "' + uid + '" already in use');
     } else {
-      state = new Data({
-        name: ctxName,
-        schema
-      });
-      Data.globalStore[ctxName] = state;
+      data = new Data(schema);
+      Data.globalStore.set(uid, data);
     }
-    return state;
+    return data;
   }
-  static clearNamedCtx(ctxName) {
-    delete Data.globalStore[ctxName];
+  static deleteCtx(uid) {
+    Data.globalStore.delete(uid);
   }
-  static getNamedCtx(ctxName, notify = true) {
-    return Data.globalStore[ctxName] || (notify && console.warn('State: wrong context name - "' + ctxName + '"'), null);
+  static getCtx(uid, notify = true) {
+    return Data.globalStore.get(uid) || (notify && console.warn('State: wrong context UID - "' + uid + '"'), null);
   }
 };
-Data.globalStore = Object.create(null);
+Data.globalStore = /* @__PURE__ */ new Map();
 
 // core/dictionary.js
 var DICT = Object.freeze({
@@ -134,6 +119,7 @@ var DICT = Object.freeze({
   EXT_DATA_CTX_PRFX: "*",
   NAMED_DATA_CTX_SPLTR: "/",
   CTX_NAME_ATTR: "ctx-name",
+  CTX_OWNER_ATTR: "ctx-owner",
   CSS_CTX_PROP: "--ctx-name",
   EL_REF_ATTR: "ref",
   AUTO_TAG_PRFX: "sym",
@@ -441,6 +427,7 @@ var _BaseComponent = class extends HTMLElement {
     this.readyToDestroy = true;
     this.processInnerHtml = false;
     this.allowCustomTemplate = false;
+    this.ctxOwner = false;
   }
   get BaseComponent() {
     return _BaseComponent;
@@ -531,12 +518,12 @@ var _BaseComponent = class extends HTMLElement {
   }
   get localCtx() {
     if (!this.__localCtx) {
-      this.__localCtx = Data.registerLocalCtx({});
+      this.__localCtx = Data.registerCtx({}, this);
     }
     return this.__localCtx;
   }
   get nodeCtx() {
-    return Data.getNamedCtx(this.ctxName, false) || Data.registerNamedCtx(this.ctxName, {});
+    return Data.getCtx(this.ctxName, false) || Data.registerCtx({}, this.ctxName);
   }
   static __parseProp(prop, fnCtx) {
     let ctx;
@@ -546,7 +533,7 @@ var _BaseComponent = class extends HTMLElement {
       name = prop.replace(DICT.EXT_DATA_CTX_PRFX, "");
     } else if (prop.includes(DICT.NAMED_DATA_CTX_SPLTR)) {
       let pArr = prop.split(DICT.NAMED_DATA_CTX_SPLTR);
-      ctx = Data.getNamedCtx(pArr[0]);
+      ctx = Data.getCtx(pArr[0]);
       name = pArr[1];
     } else {
       ctx = fnCtx.localCtx;
@@ -558,13 +545,19 @@ var _BaseComponent = class extends HTMLElement {
     };
   }
   sub(prop, handler, init = true) {
+    let subCb = (val) => {
+      if (!this.isConnected) {
+        return;
+      }
+      handler(val);
+    };
     let parsed = _BaseComponent.__parseProp(prop, this);
     if (!parsed.ctx.has(prop)) {
       window.setTimeout(() => {
-        this.allSubs.add(parsed.ctx.sub(parsed.name, handler, init));
+        this.allSubs.add(parsed.ctx.sub(parsed.name, subCb, init));
       });
     } else {
-      this.allSubs.add(parsed.ctx.sub(parsed.name, handler, init));
+      this.allSubs.add(parsed.ctx.sub(parsed.name, subCb, init));
     }
   }
   notify(prop) {
@@ -575,13 +568,13 @@ var _BaseComponent = class extends HTMLElement {
     let parsed = _BaseComponent.__parseProp(prop, this);
     return parsed.ctx.has(parsed.name);
   }
-  add(prop, val) {
+  add(prop, val, rewrite = false) {
     let parsed = _BaseComponent.__parseProp(prop, this);
-    parsed.ctx.add(parsed.name, val, false);
+    parsed.ctx.add(parsed.name, val, rewrite);
   }
-  add$(obj) {
+  add$(obj, rewrite = false) {
     for (let prop in obj) {
-      this.add(prop, obj[prop]);
+      this.add(prop, obj[prop], rewrite);
     }
   }
   get $() {
@@ -612,6 +605,9 @@ var _BaseComponent = class extends HTMLElement {
       }
     }
   }
+  get __ctxOwner() {
+    return this.ctxOwner || this.hasAttribute(DICT.CTX_OWNER_ATTR) && this.getAttribute(DICT.CTX_OWNER_ATTR) !== "false";
+  }
   __initDataCtx() {
     let attrDesc = this.constructor["__attrDesc"];
     if (attrDesc) {
@@ -623,15 +619,15 @@ var _BaseComponent = class extends HTMLElement {
     }
     for (let prop in this.init$) {
       if (prop.startsWith(DICT.EXT_DATA_CTX_PRFX)) {
-        this.nodeCtx.add(prop.replace(DICT.EXT_DATA_CTX_PRFX, ""), this.init$[prop]);
+        this.nodeCtx.add(prop.replace(DICT.EXT_DATA_CTX_PRFX, ""), this.init$[prop], this.__ctxOwner);
       } else if (prop.includes(DICT.NAMED_DATA_CTX_SPLTR)) {
         let propArr = prop.split(DICT.NAMED_DATA_CTX_SPLTR);
         let ctxName = propArr[0].trim();
         let propName = propArr[1].trim();
         if (ctxName && propName) {
-          let namedCtx = Data.getNamedCtx(ctxName, false);
+          let namedCtx = Data.getCtx(ctxName, false);
           if (!namedCtx) {
-            namedCtx = Data.registerNamedCtx(ctxName, {});
+            namedCtx = Data.registerCtx({}, ctxName);
           }
           namedCtx.add(propName, this.init$[prop]);
         }
@@ -933,11 +929,11 @@ var AppRouter = class {
   }
   static createRouterData(ctxName, routingMap) {
     this.setRoutingMap(routingMap);
-    let routeData = Data.registerNamedCtx(ctxName, {
+    let routeData = Data.registerCtx({
       route: null,
       options: null,
       title: null
-    });
+    }, ctxName);
     window.addEventListener(this.routingEventName, (e) => {
       var _a;
       routeData.multiPub({

package/build/symbiote.min.js

@@ -1 +1 @@
-var j=Object.defineProperty;var k=(o,t,e)=>t in o?j(o,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):o[t]=e;var E=(o,t,e)=>(k(o,typeof t!="symbol"?t+"":t,e),e);function F(o){let t=e=>{var s;for(let i in e)((s=e[i])==null?void 0:s.constructor)===Object&&(e[i]=t(e[i]));return{...e}};return t(o)}var c=class{constructor(t){this.uid=Symbol(),this.name=t.name||null,t.schema.constructor===Object?this.store=F(t.schema):(this._storeIsProxy=!0,this.store=t.schema),this.callbackMap=Object.create(null)}static warn(t,e){console.warn(`Symbiote Data: cannot ${t}. Prop name: `+e)}read(t){return!this._storeIsProxy&&!this.store.hasOwnProperty(t)?(c.warn("read",t),null):this.store[t]}has(t){return this._storeIsProxy?this.store[t]!==void 0:this.store.hasOwnProperty(t)}add(t,e,s=!1){if(!s&&Object.keys(this.store).includes(t)){e!==this.store[t]&&this.notify(t);return}this.store[t]=e,this.notify(t)}pub(t,e){if(!this._storeIsProxy&&!this.store.hasOwnProperty(t)){c.warn("publish",t);return}this.store[t]=e,this.notify(t)}multiPub(t){for(let e in t)this.pub(e,t[e])}notify(t){this.callbackMap[t]&&this.callbackMap[t].forEach(e=>{e(this.store[t])})}sub(t,e,s=!0){return!this._storeIsProxy&&!this.store.hasOwnProperty(t)?(c.warn("subscribe",t),null):(this.callbackMap[t]||(this.callbackMap[t]=new Set),this.callbackMap[t].add(e),s&&e(this.store[t]),{remove:()=>{this.callbackMap[t].delete(e),this.callbackMap[t].size||delete this.callbackMap[t]},callback:e})}remove(){delete c.globalStore[this.uid]}static registerLocalCtx(t){let e=new c({schema:t});return c.globalStore[e.uid]=e,e}static registerNamedCtx(t,e){let s=c.globalStore[t];return s?console.warn('State: context name "'+t+'" already in use'):(s=new c({name:t,schema:e}),c.globalStore[t]=s),s}static clearNamedCtx(t){delete c.globalStore[t]}static getNamedCtx(t,e=!0){return c.globalStore[t]||(e&&console.warn('State: wrong context name - "'+t+'"'),null)}};c.globalStore=Object.create(null);var a=Object.freeze({BIND_ATTR:"set",ATTR_BIND_PRFX:"@",EXT_DATA_CTX_PRFX:"*",NAMED_DATA_CTX_SPLTR:"/",CTX_NAME_ATTR:"ctx-name",CSS_CTX_PROP:"--ctx-name",EL_REF_ATTR:"ref",AUTO_TAG_PRFX:"sym",REPEAT_ATTR:"repeat",REPEAT_ITEM_TAG_ATTR:"repeat-item-tag",SET_LATER_KEY:"__toSetLater__",USE_TPL:"use-template"});var D="1234567890QWERTYUIOPASDFGHJKLZXCVBNMqwertyuiopasdfghjklzxcvbnm",B=D.length-1,y=class{static generate(t="XXXXXXXXX-XXX"){let e="";for(let s=0;s<t.length;s++)e+=t[s]==="-"?t[s]:D.charAt(Math.random()*B);return e}};function A(o,t,e){let s=!0,i,r=t.split(".");return r.forEach((n,l)=>{l<r.length-1?o=o[n]:i=n}),o?o[i]=e:s=!1,s}function x(o){return o.split("-").map((t,e)=>t&&e?t[0].toUpperCase()+t.slice(1):t).join("").split("_").map((t,e)=>t&&e?t.toUpperCase():t).join("")}function N(o,t){[...o.querySelectorAll(`[${a.REPEAT_ATTR}]`)].forEach(e=>{let s=e.getAttribute(a.REPEAT_ITEM_TAG_ATTR),i;if(s&&(i=window.customElements.get(s)),!i){i=class extends t.BaseComponent{constructor(){super();s||(this.style.display="contents")}};let n=e.innerHTML;i.template=n,i.reg(s)}for(;e.firstChild;)e.firstChild.remove();let r=e.getAttribute(a.REPEAT_ATTR);t.sub(r,n=>{if(!n){for(;e.firstChild;)e.firstChild.remove();return}let l=[...e.children],_,m=h=>{h.forEach((u,w)=>{if(l[w])if(l[w].set$)l[w].set$(u);else for(let C in u)l[w][C]=u[C];else{_||(_=new DocumentFragment);let C=new i;Object.assign(C.init$,u),_.appendChild(C)}}),_&&e.appendChild(_);let f=l.slice(h.length,l.length);for(let u of f)u.remove()};if(n.constructor===Array)m(n);else if(n.constructor===Object){let h=[];for(let f in n){let u=n[f];Object.defineProperty(u,"_KEY_",{value:f,enumerable:!0}),h.push(u)}m(h)}else console.warn("Symbiote repeat data type error:"),console.log(n)}),e.removeAttribute(a.REPEAT_ATTR),e.removeAttribute(a.REPEAT_ITEM_TAG_ATTR)})}function U(o,t){if(t.shadowRoot)return;let e=[...o.querySelectorAll("slot")];if(t.initChildren.length&&e.length){let s={};e.forEach(i=>{let r=i.getAttribute("name");r?s[r]={slot:i,fr:document.createDocumentFragment()}:s.__default__={slot:i,fr:document.createDocumentFragment()}}),t.initChildren.forEach(i=>{var n;let r=(n=i.getAttribute)==null?void 0:n.call(i,"slot");r?(i.removeAttribute("slot"),s[r].fr.appendChild(i)):s.__default__&&s.__default__.fr.appendChild(i)}),Object.values(s).forEach(i=>{i.slot.parentNode.insertBefore(i.fr,i.slot),i.slot.remove()})}}function H(o,t){[...o.querySelectorAll(`[${a.EL_REF_ATTR}]`)].forEach(e=>{let s=e.getAttribute(a.EL_REF_ATTR);t.ref[s]=e,e.removeAttribute(a.EL_REF_ATTR)})}function K(o,t){[...o.querySelectorAll(`[${a.BIND_ATTR}]`)].forEach(e=>{let i=e.getAttribute(a.BIND_ATTR).split(";");[...e.attributes].forEach(r=>{if(r.name.startsWith("-")&&r.value){let n=x(r.name.replace("-",""));i.push(n+":"+r.value),e.removeAttribute(r.name)}}),i.forEach(r=>{if(!r)return;let n=r.split(":").map(h=>h.trim()),l=n[0],_;l.indexOf(a.ATTR_BIND_PRFX)===0&&(_=!0,l=l.replace(a.ATTR_BIND_PRFX,""));let m=n[1].split(",").map(h=>h.trim());for(let h of m){let f;h.startsWith("!!")?(f="double",h=h.replace("!!","")):h.startsWith("!")&&(f="single",h=h.replace("!","")),t.sub(h,u=>{f==="double"?u=!!u:f==="single"&&(u=!u),_?(u==null?void 0:u.constructor)===Boolean?u?e.setAttribute(l,""):e.removeAttribute(l):e.setAttribute(l,u):A(e,l,u)||(e[a.SET_LATER_KEY]||(e[a.SET_LATER_KEY]=Object.create(null)),e[a.SET_LATER_KEY][l]=u)})}}),e.removeAttribute(a.BIND_ATTR)})}var S="{{",g="}}",W="skip-text";function q(o){let t,e=[],s=document.createTreeWalker(o,NodeFilter.SHOW_TEXT,{acceptNode:i=>{var r;return!((r=i.parentElement)==null?void 0:r.hasAttribute(W))&&i.textContent.includes(S)&&i.textContent.includes(g)&&1}});for(;t=s.nextNode();)e.push(t);return e}var Y=function(o,t){q(o).forEach(s=>{let i=[],r;for(;s.textContent.includes(g);)s.textContent.startsWith(S)?(r=s.textContent.indexOf(g)+g.length,s.splitText(r),i.push(s)):(r=s.textContent.indexOf(S),s.splitText(r)),s=s.nextSibling;i.forEach(n=>{let l=n.textContent.replace(S,"").replace(g,"");n.textContent="",t.sub(l,_=>{n.textContent=_})})})},v=[N,U,H,K,Y];var O=0,T=null,d=null,p=class extends HTMLElement{constructor(){super();E(this,"updateCssData",()=>{var t;this.dropCssDataCache(),(t=this.__boundCssProps)==null||t.forEach(e=>{let s=this.getCssData(this.__extractCssName(e),!0);this.$[e]!==s&&(this.$[e]=s)})});this.init$=Object.create(null),this.cssInit$=Object.create(null),this.tplProcessors=new Set,this.ref=Object.create(null),this.allSubs=new Set,this.pauseRender=!1,this.renderShadow=!1,this.readyToDestroy=!0,this.processInnerHtml=!1,this.allowCustomTemplate=!1}get BaseComponent(){return p}initCallback(){}__initCallback(){var t;this.__initialized||(this.__initialized=!0,(t=this.initCallback)==null||t.call(this))}render(t,e=this.renderShadow){let s;if((e||this.constructor.__shadowStylesUrl)&&!this.shadowRoot&&this.attachShadow({mode:"open"}),this.allowCustomTemplate){let r=this.getAttribute(a.USE_TPL);if(r){let n=this.getRootNode(),l=(n==null?void 0:n.querySelector(r))||document.querySelector(r);l?t=l.content.cloneNode(!0):console.warn(`Symbiote template "${r}" is not found...`)}}if(this.processInnerHtml)for(let r of this.tplProcessors)r(this,this);if(t||this.constructor.template){if(this.constructor.template&&!this.constructor.__tpl&&(this.constructor.__tpl=document.createElement("template"),this.constructor.__tpl.innerHTML=this.constructor.template),(t==null?void 0:t.constructor)===DocumentFragment)s=t;else if((t==null?void 0:t.constructor)===String){let r=document.createElement("template");r.innerHTML=t,s=r.content.cloneNode(!0)}else this.constructor.__tpl&&(s=this.constructor.__tpl.content.cloneNode(!0));for(let r of this.tplProcessors)r(s,this)}let i=()=>{s&&(e&&this.shadowRoot.appendChild(s)||this.appendChild(s)),this.__initCallback()};if(this.constructor.__shadowStylesUrl){e=!0;let r=document.createElement("link");r.rel="stylesheet",r.href=this.constructor.__shadowStylesUrl,r.onload=i,this.shadowRoot.prepend(r)}else i()}addTemplateProcessor(t){this.tplProcessors.add(t)}get autoCtxName(){return this.__autoCtxName||(this.__autoCtxName=y.generate(),this.style.setProperty(a.CSS_CTX_PROP,`'${this.__autoCtxName}'`)),this.__autoCtxName}get cssCtxName(){return this.getCssData(a.CSS_CTX_PROP,!0)}get ctxName(){var t;return((t=this.getAttribute(a.CTX_NAME_ATTR))==null?void 0:t.trim())||this.cssCtxName||this.autoCtxName}get localCtx(){return this.__localCtx||(this.__localCtx=c.registerLocalCtx({})),this.__localCtx}get nodeCtx(){return c.getNamedCtx(this.ctxName,!1)||c.registerNamedCtx(this.ctxName,{})}static __parseProp(t,e){let s,i;if(t.startsWith(a.EXT_DATA_CTX_PRFX))s=e.nodeCtx,i=t.replace(a.EXT_DATA_CTX_PRFX,"");else if(t.includes(a.NAMED_DATA_CTX_SPLTR)){let r=t.split(a.NAMED_DATA_CTX_SPLTR);s=c.getNamedCtx(r[0]),i=r[1]}else s=e.localCtx,i=t;return{ctx:s,name:i}}sub(t,e,s=!0){let i=p.__parseProp(t,this);i.ctx.has(t)?this.allSubs.add(i.ctx.sub(i.name,e,s)):window.setTimeout(()=>{this.allSubs.add(i.ctx.sub(i.name,e,s))})}notify(t){let e=p.__parseProp(t,this);e.ctx.notify(e.name)}has(t){let e=p.__parseProp(t,this);return e.ctx.has(e.name)}add(t,e){let s=p.__parseProp(t,this);s.ctx.add(s.name,e,!1)}add$(t){for(let e in t)this.add(e,t[e])}get $(){if(!this.__stateProxy){let t=Object.create(null);this.__stateProxy=new Proxy(t,{set:(e,s,i)=>{let r=p.__parseProp(s,this);return r.ctx.pub(r.name,i),!0},get:(e,s)=>{let i=p.__parseProp(s,this);return i.ctx.read(i.name)}})}return this.__stateProxy}set$(t,e=!1){for(let s in t){let i=t[s];e||![String,Number,Boolean].includes(i==null?void 0:i.constructor)?this.$[s]=i:this.$[s]!==i&&(this.$[s]=i)}}__initDataCtx(){let t=this.constructor.__attrDesc;if(t)for(let e of Object.values(t))Object.keys(this.init$).includes(e)||(this.init$[e]="");for(let e in this.init$)if(e.startsWith(a.EXT_DATA_CTX_PRFX))this.nodeCtx.add(e.replace(a.EXT_DATA_CTX_PRFX,""),this.init$[e]);else if(e.includes(a.NAMED_DATA_CTX_SPLTR)){let s=e.split(a.NAMED_DATA_CTX_SPLTR),i=s[0].trim(),r=s[1].trim();if(i&&r){let n=c.getNamedCtx(i,!1);n||(n=c.registerNamedCtx(i,{})),n.add(r,this.init$[e])}}else this.localCtx.add(e,this.init$[e]);for(let e in this.cssInit$)this.bindCssData(e,this.cssInit$[e]);this.__dataCtxInitialized=!0}connectedCallback(){var t;if(!!this.isConnected){if(this.__disconnectTimeout&&window.clearTimeout(this.__disconnectTimeout),!this.connectedOnce){let e=(t=this.getAttribute(a.CTX_NAME_ATTR))==null?void 0:t.trim();if(e&&this.style.setProperty(a.CSS_CTX_PROP,`'${e}'`),this.__initDataCtx(),this[a.SET_LATER_KEY]){for(let s in this[a.SET_LATER_KEY])A(this,s,this[a.SET_LATER_KEY][s]);delete this[a.SET_LATER_KEY]}this.initChildren=[...this.childNodes];for(let s of v)this.addTemplateProcessor(s);this.pauseRender?this.__initCallback():this.render()}this.connectedOnce=!0}}destroyCallback(){}disconnectedCallback(){!this.connectedOnce||(this.dropCssDataCache(),!!this.readyToDestroy&&(this.__disconnectTimeout&&window.clearTimeout(this.__disconnectTimeout),this.__disconnectTimeout=window.setTimeout(()=>{this.destroyCallback();for(let t of this.allSubs)t.remove(),this.allSubs.delete(t);for(let t of this.tplProcessors)this.tplProcessors.delete(t);d==null||d.delete(this.updateCssData),(d==null?void 0:d.size)||(T==null||T.disconnect(),T=null,d=null)},100)))}static reg(t,e=!1){if(t||(O++,t=`${a.AUTO_TAG_PRFX}-${O}`),this.__tag=t,window.customElements.get(t)){console.warn(`${t} - is already in "customElements" registry`);return}window.customElements.define(t,e?class extends this{}:this)}static get is(){return this.__tag||this.reg(),this.__tag}static bindAttributes(t){this.observedAttributes=Object.keys(t),this.__attrDesc=t}attributeChangedCallback(t,e,s){var r;if(e===s)return;let i=(r=this.constructor.__attrDesc)==null?void 0:r[t];i?this.__dataCtxInitialized?this.$[i]=s:this.init$[i]=s:this[t]=s}getCssData(t,e=!1){if(this.__cssDataCache||(this.__cssDataCache=Object.create(null)),!Object.keys(this.__cssDataCache).includes(t)){this.__computedStyle||(this.__computedStyle=window.getComputedStyle(this));let s=this.__computedStyle.getPropertyValue(t).trim();s.startsWith("'")&&s.endsWith("'")&&(s=s.replace(/\'/g,'"'));try{this.__cssDataCache[t]=JSON.parse(s)}catch{!e&&console.warn(`CSS Data error: ${t}`),this.__cssDataCache[t]=null}}return this.__cssDataCache[t]}__extractCssName(t){return t.split("--").map((e,s)=>s===0?"":e).join("--")}__initStyleAttrObserver(){d||(d=new Set),d.add(this.updateCssData),T||(T=new MutationObserver(t=>{t[0].type==="attributes"&&d.forEach(e=>{e()})}),T.observe(document,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["style"]}))}bindCssData(t,e=""){this.__boundCssProps||(this.__boundCssProps=new Set),this.__boundCssProps.add(t);let s=this.getCssData(this.__extractCssName(t),!0);s===null&&(s=e),this.add(t,s),this.__initStyleAttrObserver()}dropCssDataCache(){this.__cssDataCache=null,this.__computedStyle=null}defineAccessor(t,e,s){let i="__"+t;this[i]=this[t],Object.defineProperty(this,t,{set:r=>{this[i]=r,s?window.setTimeout(()=>{e==null||e(r)}):e==null||e(r)},get:()=>this[i]}),this[t]=this[i]}static set shadowStyles(t){let e=new Blob([t],{type:"text/css"});this.__shadowStylesUrl=URL.createObjectURL(e)}},R=p;E(R,"template");var b=class{static _print(t){console.warn(t)}static setDefaultTitle(t){this.defaultTitle=t}static setRoutingMap(t){Object.assign(this.appMap,t);for(let e in this.appMap)!this.defaultRoute&&this.appMap[e].default===!0?this.defaultRoute=e:!this.errorRoute&&this.appMap[e].error===!0&&(this.errorRoute=e)}static set routingEventName(t){this.__routingEventName=t}static get routingEventName(){return this.__routingEventName||"sym-on-route"}static readAddressBar(){let t={route:null,options:{}};return window.location.search.split(this.separator).forEach(s=>{if(s.includes("?"))t.route=s.replace("?","");else if(s.includes("=")){let i=s.split("=");t.options[i[0]]=decodeURI(i[1])}else t.options[s]=!0}),t}static notify(){let t=this.readAddressBar(),e=this.appMap[t.route];if(e&&e.title&&(document.title=e.title),t.route===null&&this.defaultRoute){this.applyRoute(this.defaultRoute);return}else if(!e&&this.errorRoute){this.applyRoute(this.errorRoute);return}else if(!e&&this.defaultRoute){this.applyRoute(this.defaultRoute);return}else if(!e){this._print(`Route "${t.route}" not found...`);return}let s=new CustomEvent(b.routingEventName,{detail:{route:t.route,options:Object.assign(e||{},t.options)}});window.dispatchEvent(s)}static reflect(t,e={}){let s=this.appMap[t];if(!s){this._print("Wrong route: "+t);return}let i="?"+t;for(let n in e)e[n]===!0?i+=this.separator+n:i+=this.separator+n+`=${e[n]}`;let r=s.title||this.defaultTitle||"";window.history.pushState(null,r,i),document.title=r}static applyRoute(t,e={}){this.reflect(t,e),this.notify()}static setSeparator(t){this._separator=t}static get separator(){return this._separator||"&"}static createRouterData(t,e){this.setRoutingMap(e);let s=c.registerNamedCtx(t,{route:null,options:null,title:null});return window.addEventListener(this.routingEventName,i=>{var r;s.multiPub({route:i.detail.route,options:i.detail.options,title:((r=i.detail.options)==null?void 0:r.title)||this.defaultTitle||""})}),b.notify(),this.initPopstateListener(),s}static initPopstateListener(){this.__onPopstate||(this.__onPopstate=()=>{this.notify()},window.addEventListener("popstate",this.__onPopstate))}static removePopstateListener(){window.removeEventListener("popstate",this.__onPopstate),this.__onPopstate=null}};b.appMap=Object.create(null);function X(o,t){for(let e in t)e.includes("-")?o.style.setProperty(e,t[e]):o.style[e]=t[e]}function L(o,t){for(let e in t)t[e].constructor===Boolean?t[e]?o.setAttribute(e,""):o.removeAttribute(e):o.setAttribute(e,t[e])}function I(o={tag:"div"}){let t=document.createElement(o.tag);if(o.attributes&&L(t,o.attributes),o.styles&&X(t,o.styles),o.properties)for(let e in o.properties)t[e]=o.properties[e];return o.processors&&o.processors.forEach(e=>{e(t)}),o.children&&o.children.forEach(e=>{let s=I(e);t.appendChild(s)}),t}var M="idb-store-ready",z="symbiote-db",G="symbiote-idb-update_",$=class{_notifyWhenReady(t=null){window.dispatchEvent(new CustomEvent(M,{detail:{dbName:this.name,storeName:this.storeName,event:t}}))}get _updEventName(){return G+this.name}_getUpdateEvent(t){return new CustomEvent(this._updEventName,{detail:{key:this.name,newValue:t}})}_notifySubscribers(t){window.localStorage.removeItem(this.name),window.localStorage.setItem(this.name,t),window.dispatchEvent(this._getUpdateEvent(t))}constructor(t,e){this.name=t,this.storeName=e,this.version=1,this.request=window.indexedDB.open(this.name,this.version),this.request.onupgradeneeded=s=>{this.db=s.target.result,this.objStore=this.db.createObjectStore(e,{keyPath:"_key"}),this.objStore.transaction.oncomplete=i=>{this._notifyWhenReady(i)}},this.request.onsuccess=s=>{this.db=s.target.result,this._notifyWhenReady(s)},this.request.onerror=s=>{console.error(s)},this._subscriptionsMap={},this._updateHandler=s=>{s.key===this.name&&this._subscriptionsMap[s.newValue]&&this._subscriptionsMap[s.newValue].forEach(async r=>{r(await this.read(s.newValue))})},this._localUpdateHandler=s=>{this._updateHandler(s.detail)},window.addEventListener("storage",this._updateHandler),window.addEventListener(this._updEventName,this._localUpdateHandler)}read(t){let s=this.db.transaction(this.storeName,"readwrite").objectStore(this.storeName).get(t);return new Promise((i,r)=>{s.onsuccess=n=>{var l;((l=n.target.result)==null?void 0:l._value)?i(n.target.result._value):(i(null),console.warn(`IDB: cannot read "${t}"`))},s.onerror=n=>{r(n)}})}write(t,e,s=!1){let i={_key:t,_value:e},n=this.db.transaction(this.storeName,"readwrite").objectStore(this.storeName).put(i);return new Promise((l,_)=>{n.onsuccess=m=>{s||this._notifySubscribers(t),l(m.target.result)},n.onerror=m=>{_(m)}})}delete(t,e=!1){let i=this.db.transaction(this.storeName,"readwrite").objectStore(this.storeName).delete(t);return new Promise((r,n)=>{i.onsuccess=l=>{e||this._notifySubscribers(t),r(l)},i.onerror=l=>{n(l)}})}getAll(){let e=this.db.transaction(this.storeName,"readwrite").objectStore(this.storeName).getAll();return new Promise((s,i)=>{e.onsuccess=r=>{let n=r.target.result;s(n.map(l=>l._value))},e.onerror=r=>{i(r)}})}subscribe(t,e){this._subscriptionsMap[t]||(this._subscriptionsMap[t]=new Set);let s=this._subscriptionsMap[t];return s.add(e),{remove:()=>{s.delete(e),s.size||delete this._subscriptionsMap[t]}}}stop(){window.removeEventListener("storage",this._updateHandler),this._subscriptionsMap=null,P.clear(this.name)}},P=class{static get readyEventName(){return M}static open(t=z,e="store"){let s=t+"/"+e;return this._reg[s]||(this._reg[s]=new $(t,e)),this._reg[s]}static clear(t){window.indexedDB.deleteDatabase(t);for(let e in this._reg)e.split("/")[0]===t&&delete this._reg[e]}};E(P,"_reg",Object.create(null));export{b as AppRouter,R as BaseComponent,c as Data,P as IDB,y as UID,L as applyAttributes,X as applyStyles,I as create,x as kebabToCamel,A as setNestedProp};
+var j=Object.defineProperty;var k=(n,t,e)=>t in n?j(n,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):n[t]=e;var E=(n,t,e)=>(k(n,typeof t!="symbol"?t+"":t,e),e);function F(n){let t=e=>{var s;for(let r in e)((s=e[r])==null?void 0:s.constructor)===Object&&(e[r]=t(e[r]));return{...e}};return t(n)}var u=class{constructor(t){t.constructor===Object?this.store=F(t):(this._storeIsProxy=!0,this.store=t),this.callbackMap=Object.create(null)}static warn(t,e){console.warn(`Symbiote Data: cannot ${t}. Prop name: `+e)}read(t){return!this._storeIsProxy&&!this.store.hasOwnProperty(t)?(u.warn("read",t),null):this.store[t]}has(t){return this._storeIsProxy?this.store[t]!==void 0:this.store.hasOwnProperty(t)}add(t,e,s=!1){if(!s&&Object.keys(this.store).includes(t)){e!==this.store[t]&&this.notify(t);return}this.store[t]=e,this.notify(t)}pub(t,e){if(!this._storeIsProxy&&!this.store.hasOwnProperty(t)){u.warn("publish",t);return}this.store[t]=e,this.notify(t)}multiPub(t){for(let e in t)this.pub(e,t[e])}notify(t){this.callbackMap[t]&&this.callbackMap[t].forEach(e=>{e(this.store[t])})}sub(t,e,s=!0){return!this._storeIsProxy&&!this.store.hasOwnProperty(t)?(u.warn("subscribe",t),null):(this.callbackMap[t]||(this.callbackMap[t]=new Set),this.callbackMap[t].add(e),s&&e(this.store[t]),{remove:()=>{this.callbackMap[t].delete(e),this.callbackMap[t].size||delete this.callbackMap[t]},callback:e})}static registerCtx(t,e=Symbol()){let s=u.globalStore.get(e);return s?console.warn('State: context UID "'+e+'" already in use'):(s=new u(t),u.globalStore.set(e,s)),s}static deleteCtx(t){u.globalStore.delete(t)}static getCtx(t,e=!0){return u.globalStore.get(t)||(e&&console.warn('State: wrong context UID - "'+t+'"'),null)}};u.globalStore=new Map;var a=Object.freeze({BIND_ATTR:"set",ATTR_BIND_PRFX:"@",EXT_DATA_CTX_PRFX:"*",NAMED_DATA_CTX_SPLTR:"/",CTX_NAME_ATTR:"ctx-name",CTX_OWNER_ATTR:"ctx-owner",CSS_CTX_PROP:"--ctx-name",EL_REF_ATTR:"ref",AUTO_TAG_PRFX:"sym",REPEAT_ATTR:"repeat",REPEAT_ITEM_TAG_ATTR:"repeat-item-tag",SET_LATER_KEY:"__toSetLater__",USE_TPL:"use-template"});var D="1234567890QWERTYUIOPASDFGHJKLZXCVBNMqwertyuiopasdfghjklzxcvbnm",U=D.length-1,y=class{static generate(t="XXXXXXXXX-XXX"){let e="";for(let s=0;s<t.length;s++)e+=t[s]==="-"?t[s]:D.charAt(Math.random()*U);return e}};function A(n,t,e){let s=!0,r,i=t.split(".");return i.forEach((o,l)=>{l<i.length-1?n=n[o]:r=o}),n?n[r]=e:s=!1,s}function P(n){return n.split("-").map((t,e)=>t&&e?t[0].toUpperCase()+t.slice(1):t).join("").split("_").map((t,e)=>t&&e?t.toUpperCase():t).join("")}function N(n,t){[...n.querySelectorAll(`[${a.REPEAT_ATTR}]`)].forEach(e=>{let s=e.getAttribute(a.REPEAT_ITEM_TAG_ATTR),r;if(s&&(r=window.customElements.get(s)),!r){r=class extends t.BaseComponent{constructor(){super();s||(this.style.display="contents")}};let o=e.innerHTML;r.template=o,r.reg(s)}for(;e.firstChild;)e.firstChild.remove();let i=e.getAttribute(a.REPEAT_ATTR);t.sub(i,o=>{if(!o){for(;e.firstChild;)e.firstChild.remove();return}let l=[...e.children],_,m=h=>{h.forEach((c,w)=>{if(l[w])if(l[w].set$)l[w].set$(c);else for(let C in c)l[w][C]=c[C];else{_||(_=new DocumentFragment);let C=new r;Object.assign(C.init$,c),_.appendChild(C)}}),_&&e.appendChild(_);let f=l.slice(h.length,l.length);for(let c of f)c.remove()};if(o.constructor===Array)m(o);else if(o.constructor===Object){let h=[];for(let f in o){let c=o[f];Object.defineProperty(c,"_KEY_",{value:f,enumerable:!0}),h.push(c)}m(h)}else console.warn("Symbiote repeat data type error:"),console.log(o)}),e.removeAttribute(a.REPEAT_ATTR),e.removeAttribute(a.REPEAT_ITEM_TAG_ATTR)})}function B(n,t){if(t.shadowRoot)return;let e=[...n.querySelectorAll("slot")];if(t.initChildren.length&&e.length){let s={};e.forEach(r=>{let i=r.getAttribute("name");i?s[i]={slot:r,fr:document.createDocumentFragment()}:s.__default__={slot:r,fr:document.createDocumentFragment()}}),t.initChildren.forEach(r=>{var o;let i=(o=r.getAttribute)==null?void 0:o.call(r,"slot");i?(r.removeAttribute("slot"),s[i].fr.appendChild(r)):s.__default__&&s.__default__.fr.appendChild(r)}),Object.values(s).forEach(r=>{r.slot.parentNode.insertBefore(r.fr,r.slot),r.slot.remove()})}}function W(n,t){[...n.querySelectorAll(`[${a.EL_REF_ATTR}]`)].forEach(e=>{let s=e.getAttribute(a.EL_REF_ATTR);t.ref[s]=e,e.removeAttribute(a.EL_REF_ATTR)})}function H(n,t){[...n.querySelectorAll(`[${a.BIND_ATTR}]`)].forEach(e=>{let r=e.getAttribute(a.BIND_ATTR).split(";");[...e.attributes].forEach(i=>{if(i.name.startsWith("-")&&i.value){let o=P(i.name.replace("-",""));r.push(o+":"+i.value),e.removeAttribute(i.name)}}),r.forEach(i=>{if(!i)return;let o=i.split(":").map(h=>h.trim()),l=o[0],_;l.indexOf(a.ATTR_BIND_PRFX)===0&&(_=!0,l=l.replace(a.ATTR_BIND_PRFX,""));let m=o[1].split(",").map(h=>h.trim());for(let h of m){let f;h.startsWith("!!")?(f="double",h=h.replace("!!","")):h.startsWith("!")&&(f="single",h=h.replace("!","")),t.sub(h,c=>{f==="double"?c=!!c:f==="single"&&(c=!c),_?(c==null?void 0:c.constructor)===Boolean?c?e.setAttribute(l,""):e.removeAttribute(l):e.setAttribute(l,c):A(e,l,c)||(e[a.SET_LATER_KEY]||(e[a.SET_LATER_KEY]=Object.create(null)),e[a.SET_LATER_KEY][l]=c)})}}),e.removeAttribute(a.BIND_ATTR)})}var x="{{",g="}}",K="skip-text";function q(n){let t,e=[],s=document.createTreeWalker(n,NodeFilter.SHOW_TEXT,{acceptNode:r=>{var i;return!((i=r.parentElement)==null?void 0:i.hasAttribute(K))&&r.textContent.includes(x)&&r.textContent.includes(g)&&1}});for(;t=s.nextNode();)e.push(t);return e}var Y=function(n,t){q(n).forEach(s=>{let r=[],i;for(;s.textContent.includes(g);)s.textContent.startsWith(x)?(i=s.textContent.indexOf(g)+g.length,s.splitText(i),r.push(s)):(i=s.textContent.indexOf(x),s.splitText(i)),s=s.nextSibling;r.forEach(o=>{let l=o.textContent.replace(x,"").replace(g,"");o.textContent="",t.sub(l,_=>{o.textContent=_})})})},O=[N,B,W,H,Y];var X=0,T=null,d=null,p=class extends HTMLElement{constructor(){super();E(this,"updateCssData",()=>{var t;this.dropCssDataCache(),(t=this.__boundCssProps)==null||t.forEach(e=>{let s=this.getCssData(this.__extractCssName(e),!0);this.$[e]!==s&&(this.$[e]=s)})});this.init$=Object.create(null),this.cssInit$=Object.create(null),this.tplProcessors=new Set,this.ref=Object.create(null),this.allSubs=new Set,this.pauseRender=!1,this.renderShadow=!1,this.readyToDestroy=!0,this.processInnerHtml=!1,this.allowCustomTemplate=!1,this.ctxOwner=!1}get BaseComponent(){return p}initCallback(){}__initCallback(){var t;this.__initialized||(this.__initialized=!0,(t=this.initCallback)==null||t.call(this))}render(t,e=this.renderShadow){let s;if((e||this.constructor.__shadowStylesUrl)&&!this.shadowRoot&&this.attachShadow({mode:"open"}),this.allowCustomTemplate){let i=this.getAttribute(a.USE_TPL);if(i){let o=this.getRootNode(),l=(o==null?void 0:o.querySelector(i))||document.querySelector(i);l?t=l.content.cloneNode(!0):console.warn(`Symbiote template "${i}" is not found...`)}}if(this.processInnerHtml)for(let i of this.tplProcessors)i(this,this);if(t||this.constructor.template){if(this.constructor.template&&!this.constructor.__tpl&&(this.constructor.__tpl=document.createElement("template"),this.constructor.__tpl.innerHTML=this.constructor.template),(t==null?void 0:t.constructor)===DocumentFragment)s=t;else if((t==null?void 0:t.constructor)===String){let i=document.createElement("template");i.innerHTML=t,s=i.content.cloneNode(!0)}else this.constructor.__tpl&&(s=this.constructor.__tpl.content.cloneNode(!0));for(let i of this.tplProcessors)i(s,this)}let r=()=>{s&&(e&&this.shadowRoot.appendChild(s)||this.appendChild(s)),this.__initCallback()};if(this.constructor.__shadowStylesUrl){e=!0;let i=document.createElement("link");i.rel="stylesheet",i.href=this.constructor.__shadowStylesUrl,i.onload=r,this.shadowRoot.prepend(i)}else r()}addTemplateProcessor(t){this.tplProcessors.add(t)}get autoCtxName(){return this.__autoCtxName||(this.__autoCtxName=y.generate(),this.style.setProperty(a.CSS_CTX_PROP,`'${this.__autoCtxName}'`)),this.__autoCtxName}get cssCtxName(){return this.getCssData(a.CSS_CTX_PROP,!0)}get ctxName(){var t;return((t=this.getAttribute(a.CTX_NAME_ATTR))==null?void 0:t.trim())||this.cssCtxName||this.autoCtxName}get localCtx(){return this.__localCtx||(this.__localCtx=u.registerCtx({},this)),this.__localCtx}get nodeCtx(){return u.getCtx(this.ctxName,!1)||u.registerCtx({},this.ctxName)}static __parseProp(t,e){let s,r;if(t.startsWith(a.EXT_DATA_CTX_PRFX))s=e.nodeCtx,r=t.replace(a.EXT_DATA_CTX_PRFX,"");else if(t.includes(a.NAMED_DATA_CTX_SPLTR)){let i=t.split(a.NAMED_DATA_CTX_SPLTR);s=u.getCtx(i[0]),r=i[1]}else s=e.localCtx,r=t;return{ctx:s,name:r}}sub(t,e,s=!0){let r=o=>{!this.isConnected||e(o)},i=p.__parseProp(t,this);i.ctx.has(t)?this.allSubs.add(i.ctx.sub(i.name,r,s)):window.setTimeout(()=>{this.allSubs.add(i.ctx.sub(i.name,r,s))})}notify(t){let e=p.__parseProp(t,this);e.ctx.notify(e.name)}has(t){let e=p.__parseProp(t,this);return e.ctx.has(e.name)}add(t,e,s=!1){let r=p.__parseProp(t,this);r.ctx.add(r.name,e,s)}add$(t,e=!1){for(let s in t)this.add(s,t[s],e)}get $(){if(!this.__stateProxy){let t=Object.create(null);this.__stateProxy=new Proxy(t,{set:(e,s,r)=>{let i=p.__parseProp(s,this);return i.ctx.pub(i.name,r),!0},get:(e,s)=>{let r=p.__parseProp(s,this);return r.ctx.read(r.name)}})}return this.__stateProxy}set$(t,e=!1){for(let s in t){let r=t[s];e||![String,Number,Boolean].includes(r==null?void 0:r.constructor)?this.$[s]=r:this.$[s]!==r&&(this.$[s]=r)}}get __ctxOwner(){return this.ctxOwner||this.hasAttribute(a.CTX_OWNER_ATTR)&&this.getAttribute(a.CTX_OWNER_ATTR)!=="false"}__initDataCtx(){let t=this.constructor.__attrDesc;if(t)for(let e of Object.values(t))Object.keys(this.init$).includes(e)||(this.init$[e]="");for(let e in this.init$)if(e.startsWith(a.EXT_DATA_CTX_PRFX))this.nodeCtx.add(e.replace(a.EXT_DATA_CTX_PRFX,""),this.init$[e],this.__ctxOwner);else if(e.includes(a.NAMED_DATA_CTX_SPLTR)){let s=e.split(a.NAMED_DATA_CTX_SPLTR),r=s[0].trim(),i=s[1].trim();if(r&&i){let o=u.getCtx(r,!1);o||(o=u.registerCtx({},r)),o.add(i,this.init$[e])}}else this.localCtx.add(e,this.init$[e]);for(let e in this.cssInit$)this.bindCssData(e,this.cssInit$[e]);this.__dataCtxInitialized=!0}connectedCallback(){var t;if(!!this.isConnected){if(this.__disconnectTimeout&&window.clearTimeout(this.__disconnectTimeout),!this.connectedOnce){let e=(t=this.getAttribute(a.CTX_NAME_ATTR))==null?void 0:t.trim();if(e&&this.style.setProperty(a.CSS_CTX_PROP,`'${e}'`),this.__initDataCtx(),this[a.SET_LATER_KEY]){for(let s in this[a.SET_LATER_KEY])A(this,s,this[a.SET_LATER_KEY][s]);delete this[a.SET_LATER_KEY]}this.initChildren=[...this.childNodes];for(let s of O)this.addTemplateProcessor(s);this.pauseRender?this.__initCallback():this.render()}this.connectedOnce=!0}}destroyCallback(){}disconnectedCallback(){!this.connectedOnce||(this.dropCssDataCache(),!!this.readyToDestroy&&(this.__disconnectTimeout&&window.clearTimeout(this.__disconnectTimeout),this.__disconnectTimeout=window.setTimeout(()=>{this.destroyCallback();for(let t of this.allSubs)t.remove(),this.allSubs.delete(t);for(let t of this.tplProcessors)this.tplProcessors.delete(t);d==null||d.delete(this.updateCssData),(d==null?void 0:d.size)||(T==null||T.disconnect(),T=null,d=null)},100)))}static reg(t,e=!1){if(t||(X++,t=`${a.AUTO_TAG_PRFX}-${X}`),this.__tag=t,window.customElements.get(t)){console.warn(`${t} - is already in "customElements" registry`);return}window.customElements.define(t,e?class extends this{}:this)}static get is(){return this.__tag||this.reg(),this.__tag}static bindAttributes(t){this.observedAttributes=Object.keys(t),this.__attrDesc=t}attributeChangedCallback(t,e,s){var i;if(e===s)return;let r=(i=this.constructor.__attrDesc)==null?void 0:i[t];r?this.__dataCtxInitialized?this.$[r]=s:this.init$[r]=s:this[t]=s}getCssData(t,e=!1){if(this.__cssDataCache||(this.__cssDataCache=Object.create(null)),!Object.keys(this.__cssDataCache).includes(t)){this.__computedStyle||(this.__computedStyle=window.getComputedStyle(this));let s=this.__computedStyle.getPropertyValue(t).trim();s.startsWith("'")&&s.endsWith("'")&&(s=s.replace(/\'/g,'"'));try{this.__cssDataCache[t]=JSON.parse(s)}catch{!e&&console.warn(`CSS Data error: ${t}`),this.__cssDataCache[t]=null}}return this.__cssDataCache[t]}__extractCssName(t){return t.split("--").map((e,s)=>s===0?"":e).join("--")}__initStyleAttrObserver(){d||(d=new Set),d.add(this.updateCssData),T||(T=new MutationObserver(t=>{t[0].type==="attributes"&&d.forEach(e=>{e()})}),T.observe(document,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["style"]}))}bindCssData(t,e=""){this.__boundCssProps||(this.__boundCssProps=new Set),this.__boundCssProps.add(t);let s=this.getCssData(this.__extractCssName(t),!0);s===null&&(s=e),this.add(t,s),this.__initStyleAttrObserver()}dropCssDataCache(){this.__cssDataCache=null,this.__computedStyle=null}defineAccessor(t,e,s){let r="__"+t;this[r]=this[t],Object.defineProperty(this,t,{set:i=>{this[r]=i,s?window.setTimeout(()=>{e==null||e(i)}):e==null||e(i)},get:()=>this[r]}),this[t]=this[r]}static set shadowStyles(t){let e=new Blob([t],{type:"text/css"});this.__shadowStylesUrl=URL.createObjectURL(e)}},R=p;E(R,"template");var b=class{static _print(t){console.warn(t)}static setDefaultTitle(t){this.defaultTitle=t}static setRoutingMap(t){Object.assign(this.appMap,t);for(let e in this.appMap)!this.defaultRoute&&this.appMap[e].default===!0?this.defaultRoute=e:!this.errorRoute&&this.appMap[e].error===!0&&(this.errorRoute=e)}static set routingEventName(t){this.__routingEventName=t}static get routingEventName(){return this.__routingEventName||"sym-on-route"}static readAddressBar(){let t={route:null,options:{}};return window.location.search.split(this.separator).forEach(s=>{if(s.includes("?"))t.route=s.replace("?","");else if(s.includes("=")){let r=s.split("=");t.options[r[0]]=decodeURI(r[1])}else t.options[s]=!0}),t}static notify(){let t=this.readAddressBar(),e=this.appMap[t.route];if(e&&e.title&&(document.title=e.title),t.route===null&&this.defaultRoute){this.applyRoute(this.defaultRoute);return}else if(!e&&this.errorRoute){this.applyRoute(this.errorRoute);return}else if(!e&&this.defaultRoute){this.applyRoute(this.defaultRoute);return}else if(!e){this._print(`Route "${t.route}" not found...`);return}let s=new CustomEvent(b.routingEventName,{detail:{route:t.route,options:Object.assign(e||{},t.options)}});window.dispatchEvent(s)}static reflect(t,e={}){let s=this.appMap[t];if(!s){this._print("Wrong route: "+t);return}let r="?"+t;for(let o in e)e[o]===!0?r+=this.separator+o:r+=this.separator+o+`=${e[o]}`;let i=s.title||this.defaultTitle||"";window.history.pushState(null,i,r),document.title=i}static applyRoute(t,e={}){this.reflect(t,e),this.notify()}static setSeparator(t){this._separator=t}static get separator(){return this._separator||"&"}static createRouterData(t,e){this.setRoutingMap(e);let s=u.registerCtx({route:null,options:null,title:null},t);return window.addEventListener(this.routingEventName,r=>{var i;s.multiPub({route:r.detail.route,options:r.detail.options,title:((i=r.detail.options)==null?void 0:i.title)||this.defaultTitle||""})}),b.notify(),this.initPopstateListener(),s}static initPopstateListener(){this.__onPopstate||(this.__onPopstate=()=>{this.notify()},window.addEventListener("popstate",this.__onPopstate))}static removePopstateListener(){window.removeEventListener("popstate",this.__onPopstate),this.__onPopstate=null}};b.appMap=Object.create(null);function v(n,t){for(let e in t)e.includes("-")?n.style.setProperty(e,t[e]):n.style[e]=t[e]}function I(n,t){for(let e in t)t[e].constructor===Boolean?t[e]?n.setAttribute(e,""):n.removeAttribute(e):n.setAttribute(e,t[e])}function L(n={tag:"div"}){let t=document.createElement(n.tag);if(n.attributes&&I(t,n.attributes),n.styles&&v(t,n.styles),n.properties)for(let e in n.properties)t[e]=n.properties[e];return n.processors&&n.processors.forEach(e=>{e(t)}),n.children&&n.children.forEach(e=>{let s=L(e);t.appendChild(s)}),t}var M="idb-store-ready",z="symbiote-db",G="symbiote-idb-update_",$=class{_notifyWhenReady(t=null){window.dispatchEvent(new CustomEvent(M,{detail:{dbName:this.name,storeName:this.storeName,event:t}}))}get _updEventName(){return G+this.name}_getUpdateEvent(t){return new CustomEvent(this._updEventName,{detail:{key:this.name,newValue:t}})}_notifySubscribers(t){window.localStorage.removeItem(this.name),window.localStorage.setItem(this.name,t),window.dispatchEvent(this._getUpdateEvent(t))}constructor(t,e){this.name=t,this.storeName=e,this.version=1,this.request=window.indexedDB.open(this.name,this.version),this.request.onupgradeneeded=s=>{this.db=s.target.result,this.objStore=this.db.createObjectStore(e,{keyPath:"_key"}),this.objStore.transaction.oncomplete=r=>{this._notifyWhenReady(r)}},this.request.onsuccess=s=>{this.db=s.target.result,this._notifyWhenReady(s)},this.request.onerror=s=>{console.error(s)},this._subscriptionsMap={},this._updateHandler=s=>{s.key===this.name&&this._subscriptionsMap[s.newValue]&&this._subscriptionsMap[s.newValue].forEach(async i=>{i(await this.read(s.newValue))})},this._localUpdateHandler=s=>{this._updateHandler(s.detail)},window.addEventListener("storage",this._updateHandler),window.addEventListener(this._updEventName,this._localUpdateHandler)}read(t){let s=this.db.transaction(this.storeName,"readwrite").objectStore(this.storeName).get(t);return new Promise((r,i)=>{s.onsuccess=o=>{var l;((l=o.target.result)==null?void 0:l._value)?r(o.target.result._value):(r(null),console.warn(`IDB: cannot read "${t}"`))},s.onerror=o=>{i(o)}})}write(t,e,s=!1){let r={_key:t,_value:e},o=this.db.transaction(this.storeName,"readwrite").objectStore(this.storeName).put(r);return new Promise((l,_)=>{o.onsuccess=m=>{s||this._notifySubscribers(t),l(m.target.result)},o.onerror=m=>{_(m)}})}delete(t,e=!1){let r=this.db.transaction(this.storeName,"readwrite").objectStore(this.storeName).delete(t);return new Promise((i,o)=>{r.onsuccess=l=>{e||this._notifySubscribers(t),i(l)},r.onerror=l=>{o(l)}})}getAll(){let e=this.db.transaction(this.storeName,"readwrite").objectStore(this.storeName).getAll();return new Promise((s,r)=>{e.onsuccess=i=>{let o=i.target.result;s(o.map(l=>l._value))},e.onerror=i=>{r(i)}})}subscribe(t,e){this._subscriptionsMap[t]||(this._subscriptionsMap[t]=new Set);let s=this._subscriptionsMap[t];return s.add(e),{remove:()=>{s.delete(e),s.size||delete this._subscriptionsMap[t]}}}stop(){window.removeEventListener("storage",this._updateHandler),this._subscriptionsMap=null,S.clear(this.name)}},S=class{static get readyEventName(){return M}static open(t=z,e="store"){let s=t+"/"+e;return this._reg[s]||(this._reg[s]=new $(t,e)),this._reg[s]}static clear(t){window.indexedDB.deleteDatabase(t);for(let e in this._reg)e.split("/")[0]===t&&delete this._reg[e]}};E(S,"_reg",Object.create(null));export{b as AppRouter,R as BaseComponent,u as Data,S as IDB,y as UID,I as applyAttributes,v as applyStyles,L as create,P as kebabToCamel,A as setNestedProp};

package/core/AppRouter.js

@@ -131,11 +131,14 @@ export class AppRouter {
    */
   static createRouterData(ctxName, routingMap) {
     this.setRoutingMap(routingMap);
-    let routeData = Data.registerNamedCtx(ctxName, {
-      route: null,
-      options: null,
-      title: null,
-    });
+    let routeData = Data.registerCtx(
+      {
+        route: null,
+        options: null,
+        title: null,
+      },
+      ctxName
+    );
     window.addEventListener(this.routingEventName, (/** @type {CustomEvent} */ e) => {
       routeData.multiPub({
         route: e.detail.route,

package/core/BaseComponent.js

@@ -133,6 +133,8 @@ export class BaseComponent extends HTMLElement {
     this.processInnerHtml = false;
     /** @type {Boolean} */
     this.allowCustomTemplate = false;
+    /** @type {Boolean} */
+    this.ctxOwner = false;
   }
 
   /** @returns {String} */
@@ -159,14 +161,14 @@ export class BaseComponent extends HTMLElement {
   get localCtx() {
     if (!this.__localCtx) {
       /** @private */
-      this.__localCtx = Data.registerLocalCtx({});
+      this.__localCtx = Data.registerCtx({}, this);
     }
     return this.__localCtx;
   }
 
   /** @returns {Data} */
   get nodeCtx() {
-    return Data.getNamedCtx(this.ctxName, false) || Data.registerNamedCtx(this.ctxName, {});
+    return Data.getCtx(this.ctxName, false) || Data.registerCtx({}, this.ctxName);
   }
 
   /**
@@ -185,7 +187,7 @@ export class BaseComponent extends HTMLElement {
       name = prop.replace(DICT.EXT_DATA_CTX_PRFX, '');
     } else if (prop.includes(DICT.NAMED_DATA_CTX_SPLTR)) {
       let pArr = prop.split(DICT.NAMED_DATA_CTX_SPLTR);
-      ctx = Data.getNamedCtx(pArr[0]);
+      ctx = Data.getCtx(pArr[0]);
       name = pArr[1];
     } else {
       ctx = fnCtx.localCtx;
@@ -204,15 +206,21 @@ export class BaseComponent extends HTMLElement {
    * @param {Boolean} [init]
    */
   sub(prop, handler, init = true) {
+    let subCb = (val) => {
+      if (!this.isConnected) {
+        return;
+      }
+      handler(val);
+    };
     let parsed = BaseComponent.__parseProp(/** @type {string} */ (prop), this);
     // @ts-ignore
     if (!parsed.ctx.has(prop)) {
       // Avoid *prop binding race:
       window.setTimeout(() => {
-        this.allSubs.add(parsed.ctx.sub(parsed.name, handler, init));
+        this.allSubs.add(parsed.ctx.sub(parsed.name, subCb, init));
       });
     } else {
-      this.allSubs.add(parsed.ctx.sub(parsed.name, handler, init));
+      this.allSubs.add(parsed.ctx.sub(parsed.name, subCb, init));
     }
   }
 
@@ -232,16 +240,20 @@ export class BaseComponent extends HTMLElement {
    * @template {keyof S} T
    * @param {String} prop
    * @param {S[T]} val
+   * @param {Boolean} [rewrite]
    */
-  add(prop, val) {
+  add(prop, val, rewrite = false) {
     let parsed = BaseComponent.__parseProp(/** @type {String} */ (prop), this);
-    parsed.ctx.add(parsed.name, val, false);
+    parsed.ctx.add(parsed.name, val, rewrite);
   }
 
-  /** @param {Partial<S>} obj */
-  add$(obj) {
+  /**
+   * @param {Partial<S>} obj
+   * @param {Boolean} [rewrite]
+   */
+  add$(obj, rewrite = false) {
     for (let prop in obj) {
-      this.add(prop, obj[/** @type {String} */ (prop)]);
+      this.add(prop, obj[/** @type {String} */ (prop)], rewrite);
     }
   }
 
@@ -282,6 +294,11 @@ export class BaseComponent extends HTMLElement {
     }
   }
 
+  /** @private */
+  get __ctxOwner() {
+    return this.ctxOwner || (this.hasAttribute(DICT.CTX_OWNER_ATTR) && this.getAttribute(DICT.CTX_OWNER_ATTR) !== 'false');
+  }
+
   /** @private */
   __initDataCtx() {
     /** @type {{ [key: string]: string }} */
@@ -295,15 +312,15 @@ export class BaseComponent extends HTMLElement {
     }
     for (let prop in this.init$) {
       if (prop.startsWith(DICT.EXT_DATA_CTX_PRFX)) {
-        this.nodeCtx.add(prop.replace(DICT.EXT_DATA_CTX_PRFX, ''), this.init$[prop]);
+        this.nodeCtx.add(prop.replace(DICT.EXT_DATA_CTX_PRFX, ''), this.init$[prop], this.__ctxOwner);
       } else if (prop.includes(DICT.NAMED_DATA_CTX_SPLTR)) {
         let propArr = prop.split(DICT.NAMED_DATA_CTX_SPLTR);
         let ctxName = propArr[0].trim();
         let propName = propArr[1].trim();
         if (ctxName && propName) {
-          let namedCtx = Data.getNamedCtx(ctxName, false);
+          let namedCtx = Data.getCtx(ctxName, false);
           if (!namedCtx) {
-            namedCtx = Data.registerNamedCtx(ctxName, {});
+            namedCtx = Data.registerCtx({}, ctxName);
           }
           namedCtx.add(propName, this.init$[prop]);
         }

package/core/Data.js

@@ -12,21 +12,15 @@ function cloneObj(obj) {
 }
 
 export class Data {
-  /**
-   * @param {Object} src
-   * @param {String} [src.name]
-   * @param {Object<string, any>} src.schema
-   */
-  constructor(src) {
-    this.uid = Symbol();
-    this.name = src.name || null;
-    if (src.schema.constructor === Object) {
-      this.store = cloneObj(src.schema);
+  /** @param {Object<string, any>} schema */
+  constructor(schema) {
+    if (schema.constructor === Object) {
+      this.store = cloneObj(schema);
     } else {
       // For Proxy support:
       /** @private */
       this._storeIsProxy = true;
-      this.store = src.schema;
+      this.store = schema;
     }
     /** @type {Object<String, Set<Function>>} */
     this.callbackMap = Object.create(null);
@@ -128,52 +122,36 @@ export class Data {
     };
   }
 
-  remove() {
-    delete Data.globalStore[this.uid];
-  }
-
-  /** @param {Object<string, any>} schema */
-  static registerLocalCtx(schema) {
-    let state = new Data({
-      schema,
-    });
-    Data.globalStore[state.uid] = state;
-    return state;
-  }
-
   /**
-   * @param {String} ctxName
    * @param {Object<string, any>} schema
+   * @param {any} [uid]
    * @returns {Data}
    */
-  static registerNamedCtx(ctxName, schema) {
+  static registerCtx(schema, uid = Symbol()) {
     /** @type {Data} */
-    let state = Data.globalStore[ctxName];
-    if (state) {
-      console.warn('State: context name "' + ctxName + '" already in use');
+    let data = Data.globalStore.get(uid);
+    if (data) {
+      console.warn('State: context UID "' + uid + '" already in use');
     } else {
-      state = new Data({
-        name: ctxName,
-        schema,
-      });
-      Data.globalStore[ctxName] = state;
+      data = new Data(schema);
+      Data.globalStore.set(uid, data);
     }
-    return state;
+    return data;
   }
 
-  /** @param {String} ctxName */
-  static clearNamedCtx(ctxName) {
-    delete Data.globalStore[ctxName];
+  /** @param {any} uid */
+  static deleteCtx(uid) {
+    Data.globalStore.delete(uid);
   }
 
   /**
-   * @param {String} ctxName
+   * @param {any} uid
    * @param {Boolean} [notify]
    * @returns {Data}
    */
-  static getNamedCtx(ctxName, notify = true) {
-    return Data.globalStore[ctxName] || (notify && console.warn('State: wrong context name - "' + ctxName + '"'), null);
+  static getCtx(uid, notify = true) {
+    return Data.globalStore.get(uid) || (notify && console.warn('State: wrong context UID - "' + uid + '"'), null);
   }
 }
 
-Data.globalStore = Object.create(null);
+Data.globalStore = new Map();

package/core/dictionary.js

@@ -10,6 +10,8 @@ export const DICT = Object.freeze({
   NAMED_DATA_CTX_SPLTR: '/',
   // Data context name attribute:
   CTX_NAME_ATTR: 'ctx-name',
+  // Data context owner attribute:
+  CTX_OWNER_ATTR: 'ctx-owner',
   // Data context name in CSS custom property:
   CSS_CTX_PROP: '--ctx-name',
   // Element reference attribute:

package/package.json

@@ -26,7 +26,7 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "1.10.2",
+  "version": "1.10.5",
   "description": "Symbiote.js",
   "author": "hello@symbiotejs.org",
   "license": "MIT",