taggedjs 2.1.2 → 2.3.25
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/index.js +1 -1
- package/js/Clones.type.d.ts +1 -0
- package/js/Clones.type.js +2 -0
- package/js/Clones.type.js.map +1 -0
- package/js/Props.d.ts +1 -0
- package/js/Props.js +2 -0
- package/js/Props.js.map +1 -0
- package/js/Subject.d.ts +7 -2
- package/js/Subject.js +15 -10
- package/js/Subject.js.map +1 -1
- package/js/Tag.class.d.ts +37 -13
- package/js/Tag.class.js +133 -99
- package/js/Tag.class.js.map +1 -1
- package/js/Tag.utils.d.ts +8 -20
- package/js/Tag.utils.js +17 -88
- package/js/Tag.utils.js.map +1 -1
- package/js/ValueSubject.d.ts +1 -1
- package/js/ValueSubject.js.map +1 -1
- package/js/bindSubjectCallback.function.d.ts +5 -0
- package/js/bindSubjectCallback.function.js +19 -0
- package/js/bindSubjectCallback.function.js.map +1 -0
- package/js/elementDestroyCheck.function.d.ts +3 -0
- package/js/elementDestroyCheck.function.js +17 -0
- package/js/elementDestroyCheck.function.js.map +1 -0
- package/js/elementInitCheck.js.map +1 -1
- package/js/gateway/gateway.web.component.d.ts +11 -0
- package/js/gateway/gateway.web.component.js +20 -0
- package/js/gateway/gateway.web.component.js.map +1 -0
- package/js/gateway/index.d.ts +3 -0
- package/js/gateway/index.js +3 -0
- package/js/gateway/index.js.map +1 -0
- package/js/gateway/loadTagGateway.function.d.ts +2 -0
- package/js/gateway/loadTagGateway.function.js +18 -0
- package/js/gateway/loadTagGateway.function.js.map +1 -0
- package/js/gateway/tagGateway.function.d.ts +31 -0
- package/js/gateway/tagGateway.function.js +187 -0
- package/js/gateway/tagGateway.function.js.map +1 -0
- package/js/getCallback.js +39 -42
- package/js/getCallback.js.map +1 -1
- package/js/getTagSupport.d.ts +18 -17
- package/js/getTagSupport.js +104 -15
- package/js/getTagSupport.js.map +1 -1
- package/js/html.d.ts +1 -1
- package/js/html.js.map +1 -1
- package/js/index.d.ts +16 -7
- package/js/index.js +20 -8
- package/js/index.js.map +1 -1
- package/js/inputAttribute.js +3 -3
- package/js/inputAttribute.js.map +1 -1
- package/js/interpolateAttributes.d.ts +2 -1
- package/js/interpolateAttributes.js +126 -60
- package/js/interpolateAttributes.js.map +1 -1
- package/js/interpolateContentTemplates.d.ts +4 -1
- package/js/interpolateContentTemplates.js +32 -25
- package/js/interpolateContentTemplates.js.map +1 -1
- package/js/interpolateElement.d.ts +8 -13
- package/js/interpolateElement.js +26 -22
- package/js/interpolateElement.js.map +1 -1
- package/js/interpolateTemplate.d.ts +15 -19
- package/js/interpolateTemplate.js +33 -231
- package/js/interpolateTemplate.js.map +1 -1
- package/js/interpolations.d.ts +3 -2
- package/js/interpolations.js +2 -1
- package/js/interpolations.js.map +1 -1
- package/js/isInstance.d.ts +6 -0
- package/js/isInstance.js +10 -0
- package/js/isInstance.js.map +1 -0
- package/js/js/Clones.type.d.ts +1 -0
- package/js/js/Clones.type.js +2 -0
- package/js/js/Clones.type.js.map +1 -0
- package/js/js/Props.d.ts +1 -0
- package/js/js/Props.js +2 -0
- package/js/js/Props.js.map +1 -0
- package/js/js/Subject.d.ts +7 -2
- package/js/js/Subject.js +15 -10
- package/js/js/Subject.js.map +1 -1
- package/js/js/Tag.class.d.ts +27 -5
- package/js/js/Tag.class.js +109 -81
- package/js/js/Tag.class.js.map +1 -1
- package/js/js/Tag.utils.d.ts +8 -20
- package/js/js/Tag.utils.js +17 -88
- package/js/js/Tag.utils.js.map +1 -1
- package/js/js/ValueSubject.d.ts +1 -1
- package/js/js/ValueSubject.js.map +1 -1
- package/js/js/bindSubjectCallback.function.d.ts +5 -0
- package/js/js/bindSubjectCallback.function.js +19 -0
- package/js/js/bindSubjectCallback.function.js.map +1 -0
- package/js/js/elementDestroyCheck.function.d.ts +3 -0
- package/js/js/elementDestroyCheck.function.js +17 -0
- package/js/js/elementDestroyCheck.function.js.map +1 -0
- package/js/js/elementInitCheck.js.map +1 -1
- package/js/js/getCallback.js +39 -42
- package/js/js/getCallback.js.map +1 -1
- package/js/js/getTagSupport.d.ts +19 -17
- package/js/js/getTagSupport.js +111 -15
- package/js/js/getTagSupport.js.map +1 -1
- package/js/js/html.d.ts +1 -1
- package/js/js/html.js.map +1 -1
- package/js/js/index.d.ts +16 -7
- package/js/js/index.js +20 -8
- package/js/js/index.js.map +1 -1
- package/js/js/interpolateAttributes.d.ts +2 -1
- package/js/js/interpolateAttributes.js +118 -60
- package/js/js/interpolateAttributes.js.map +1 -1
- package/js/js/interpolateContentTemplates.d.ts +3 -1
- package/js/js/interpolateContentTemplates.js +32 -22
- package/js/js/interpolateContentTemplates.js.map +1 -1
- package/js/js/interpolateElement.d.ts +7 -12
- package/js/js/interpolateElement.js +18 -21
- package/js/js/interpolateElement.js.map +1 -1
- package/js/js/interpolateTemplate.d.ts +15 -19
- package/js/js/interpolateTemplate.js +33 -231
- package/js/js/interpolateTemplate.js.map +1 -1
- package/js/js/interpolations.d.ts +3 -1
- package/js/js/interpolations.js +3 -3
- package/js/js/interpolations.js.map +1 -1
- package/js/js/isInstance.d.ts +6 -0
- package/js/js/isInstance.js +10 -0
- package/js/js/isInstance.js.map +1 -0
- package/js/js/onDestroy.d.ts +2 -0
- package/js/js/onDestroy.js +20 -0
- package/js/js/onDestroy.js.map +1 -0
- package/js/js/onInit.d.ts +0 -4
- package/js/js/onInit.js +12 -10
- package/js/js/onInit.js.map +1 -1
- package/js/js/processSubjectComponent.function.d.ts +8 -0
- package/js/js/processSubjectComponent.function.js +53 -0
- package/js/js/processSubjectComponent.function.js.map +1 -0
- package/js/js/processSubjectValue.function.d.ts +16 -0
- package/js/js/processSubjectValue.function.js +122 -0
- package/js/js/processSubjectValue.function.js.map +1 -0
- package/js/js/processTagArray.d.ts +5 -1
- package/js/js/processTagArray.js +21 -10
- package/js/js/processTagArray.js.map +1 -1
- package/js/js/processTagResult.function.d.ts +10 -0
- package/js/js/processTagResult.function.js +42 -0
- package/js/js/processTagResult.function.js.map +1 -0
- package/js/js/providers.d.ts +4 -12
- package/js/js/providers.js +28 -20
- package/js/js/providers.js.map +1 -1
- package/js/js/redrawTag.function.d.ts +7 -0
- package/js/js/redrawTag.function.js +9 -0
- package/js/js/redrawTag.function.js.map +1 -0
- package/js/js/render.d.ts +1 -6
- package/js/js/render.js +8 -15
- package/js/js/render.js.map +1 -1
- package/js/js/renderAppToElement.d.ts +8 -2
- package/js/js/renderAppToElement.js +40 -21
- package/js/js/renderAppToElement.js.map +1 -1
- package/js/js/setUse.function.d.ts +23 -0
- package/js/js/setUse.function.js +14 -0
- package/js/js/setUse.function.js.map +1 -0
- package/js/js/state.d.ts +14 -11
- package/js/js/state.js +68 -33
- package/js/js/state.js.map +1 -1
- package/js/js/tag.d.ts +7 -16
- package/js/js/tag.js +33 -44
- package/js/js/tag.js.map +1 -1
- package/js/js/tagElement.d.ts +14 -0
- package/js/js/tagElement.js +57 -0
- package/js/js/tagElement.js.map +1 -0
- package/js/js/tagGateway.function.d.ts +5 -0
- package/js/js/tagGateway.function.js +119 -0
- package/js/js/tagGateway.function.js.map +1 -0
- package/js/js/tagRunner.d.ts +2 -13
- package/js/js/tagRunner.js +12 -12
- package/js/js/tagRunner.js.map +1 -1
- package/js/js/templater.utils.d.ts +28 -0
- package/js/js/templater.utils.js +99 -0
- package/js/js/templater.utils.js.map +1 -0
- package/js/js/updateTag.utils.d.ts +6 -0
- package/js/js/updateTag.utils.js +84 -0
- package/js/js/updateTag.utils.js.map +1 -0
- package/js/onDestroy.d.ts +2 -0
- package/js/onDestroy.js +20 -0
- package/js/onDestroy.js.map +1 -0
- package/js/onInit.d.ts +0 -4
- package/js/onInit.js +12 -10
- package/js/onInit.js.map +1 -1
- package/js/processSubjectComponent.function.d.ts +8 -0
- package/js/processSubjectComponent.function.js +53 -0
- package/js/processSubjectComponent.function.js.map +1 -0
- package/js/processSubjectValue.function.d.ts +16 -0
- package/js/processSubjectValue.function.js +122 -0
- package/js/processSubjectValue.function.js.map +1 -0
- package/js/processTagArray.d.ts +5 -1
- package/js/processTagArray.js +21 -10
- package/js/processTagArray.js.map +1 -1
- package/js/processTagResult.function.d.ts +10 -0
- package/js/processTagResult.function.js +39 -0
- package/js/processTagResult.function.js.map +1 -0
- package/js/providers.d.ts +4 -12
- package/js/providers.js +28 -20
- package/js/providers.js.map +1 -1
- package/js/redrawTag.function.d.ts +7 -0
- package/js/redrawTag.function.js +8 -0
- package/js/redrawTag.function.js.map +1 -0
- package/js/render.d.ts +1 -6
- package/js/render.js +5 -19
- package/js/render.js.map +1 -1
- package/js/renderAppToElement.d.ts +8 -2
- package/js/renderAppToElement.js +40 -21
- package/js/renderAppToElement.js.map +1 -1
- package/js/setUse.function.d.ts +23 -0
- package/js/setUse.function.js +14 -0
- package/js/setUse.function.js.map +1 -0
- package/js/state.d.ts +14 -11
- package/js/state.js +68 -33
- package/js/state.js.map +1 -1
- package/js/tag.d.ts +6 -16
- package/js/tag.js +32 -43
- package/js/tag.js.map +1 -1
- package/js/tagElement.d.ts +14 -0
- package/js/tagElement.js +57 -0
- package/js/tagElement.js.map +1 -0
- package/js/tagGateway.function.d.ts +14 -0
- package/js/tagGateway.function.js +138 -0
- package/js/tagGateway.function.js.map +1 -0
- package/js/tagRunner.d.ts +2 -13
- package/js/tagRunner.js +12 -12
- package/js/tagRunner.js.map +1 -1
- package/js/templater.utils.d.ts +27 -0
- package/js/templater.utils.js +98 -0
- package/js/templater.utils.js.map +1 -0
- package/js/updateTag.utils.d.ts +6 -0
- package/js/updateTag.utils.js +102 -0
- package/js/updateTag.utils.js.map +1 -0
- package/package.json +1 -1
package/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
var t={d:(e,r)=>{for(var n in r)t.o(r,n)&&!t.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:r[n]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e)},e={};function r(t,e=new WeakMap){if(null===t||"object"!=typeof t)return t;if(e.has(t))return e.get(t);if(t instanceof Date)return new Date(t);if(t instanceof RegExp)return new RegExp(t);const n=Array.isArray(t)?[]:Object.create(Object.getPrototypeOf(t));if(e.set(t,n),Array.isArray(t))for(let o=0;o<t.length;o++)n[o]=r(t[o],e);else for(const o in t)t.hasOwnProperty(o)&&(n[o]=r(t[o],e));return n}function n(t,e){if(t===e)return!0;if("object"!=typeof t||"object"!=typeof e||null===t||null===e)return!1;const r=Object.keys(t),o=Object.keys(e);if(r.length!==o.length)return!1;for(const s of r)if(!o.includes(s)||!n(t[s],e[s])){if(t[s]instanceof Function&&e[s]instanceof Function&&t[s].toString()===e[s].toString())continue;return!1}if(Array.isArray(t)&&Array.isArray(e)){if(t.length!==e.length)return!1;for(let r=0;r<t.length;r++)if(!n(t[r],e[r]))return!1}else if(Array.isArray(t)||Array.isArray(e))return!1;return!0}function o(t){const e={templater:t,renderCount:0,mutatingRender:()=>{throw new Error('Tag function "render()" was called in sync but can only be called async')},render:()=>(++e.renderCount,e.mutatingRender()),hasPropChanges:(t,r,o)=>{const s=e.templater.cloneProps;return!(void 0===t&&t===o||n(r,s))}};return e}t.d(e,{xQ:()=>p,Vp:()=>B,RN:()=>z,dy:()=>$,ey:()=>H,nc:()=>q,a:()=>l,TF:()=>D,Je:()=>W,SB:()=>J,_q:()=>C,Dc:()=>_});const s=[];function a(t,e){s.forEach((r=>r.beforeRender(t,e)))}function i(t){const e={beforeRender:t.beforeRender||(()=>{}),beforeRedraw:t.beforeRedraw||(()=>{}),afterRender:t.afterRender||(()=>{})};s.push(e)}const u={providers:[],currentTag:void 0,ownerTag:void 0};function c(t){return u.providers.find((e=>e.constructMethod===t))}const l={create:t=>{const e=c(t);if(e)return e.clone=r(e.instance),e.instance;const n=t.constructor?new t:t();return u.providers.push({constructMethod:t,instance:n,clone:r(n)}),n},inject:t=>{const e=c(t);if(e)return e.instance;let n={ownerTag:u.ownerTag};for(;n.ownerTag;){const e=n.ownerTag.providers.find((e=>{if(e.constructMethod===t)return!0}));if(e)return e.clone=r(e.instance),u.providers.push(e),e.instance;n=n.ownerTag}const o=`Could not inject provider: ${t}`;throw console.warn(`${o}. Available providers`,u.providers),new Error(o)}};i({beforeRedraw:(t,e)=>{u.currentTag=e,u.ownerTag=e.ownerTag,e.providers.length&&(u.providers.length=0,u.providers.push(...e.providers))},afterRender:(t,e)=>{e.providers=[...u.providers],u.providers.length=0}});class p{subscribers=[];value;subscribe(t){this.subscribers.push(t),p.globalSubs.push(t),++p.globalSubCount;const e=()=>{d(this.subscribers,t),d(p.globalSubs,t),--p.globalSubCount};return e.unsubscribe=e,e}set(t){this.value=t,this.subscribers.forEach((e=>{e.value=t,e(t)}))}next=this.set}function d(t,e){const r=t.indexOf(e);-1!==r&&t.splice(r,1)}p.globalSubCount=0,p.globalSubs=[];class g extends p{value;constructor(t){super(),this.value=t}subscribe(t){const e=super.subscribe(t);return t(this.value),e}}function f(t,e){function r(r,n){const o=e.tagSupport.renderCount,s=t.bind(r)(...n);if(o===e.tagSupport.renderCount)return e.tagSupport.render(),s instanceof Promise&&s.then((()=>{e.tagSupport.render()})),s}return r.tagFunction=t,r}function h(t,e,r){t.redraw=()=>{const n=e.tag,s=n?.tagSupport||o(t);++s.renderCount,e.tagSupport=s;const i=t;s.mutatingRender=s.mutatingRender||e.tagSupport?.mutatingRender||i.tagSupport.mutatingRender;const c=n?.ownerTag||r;a(s,s.oldest),s.oldest?s.oldest.beforeRedraw():u.ownerTag=c;const l=t.wrapper();l.tagSupport=s,s.oldest?s.oldest.afterRender():l.afterRender(),t.newest=l,l.ownerTag=c;const p=s.oldest=s.oldest||l;s.newest=l;const d=p.tagSupport;if(p.tagSupport=d||s,p.tagSupport.templater=t,l.setSupport(s),!n||!n.isLikeTag(l))return e.set(t),l;p.updateByTag(l)}}function v(t,e,r){const n=t.split(".");if("style"===n[0]&&(r.style[n[1]]=e),"class"===n[0])return n.pop(),void(e?n.forEach((t=>r.classList.remove(t))):n.forEach((t=>r.classList.add(t))))}const w=/^\s*{/,y=/}\s*$/;function b(t,e,r){t.getAttributeNames().forEach((n=>{const o=t.getAttribute(n),s=function(t){return t.search(/^(class|style)(\.)/)>=0}(n);if(o&&o.search(w)>=0&&o.search(y)>=0){const a=o.replace("{","").split("").reverse().join("").replace("}","").split("").reverse().join(""),i=e[a];if(i instanceof Function)return void(t[n]=function(...e){i(t,e)});if(i instanceof p){t.removeAttribute(n);const e=e=>{if(e instanceof Function)return t[n]=function(...r){e(t,r)},void(t[n].tagFunction=e);s&&v(n,e,t),e&&t.setAttribute(n,e),void 0===e||!1===e||null===e?t.removeAttribute(n):t.setAttribute(n,e)},o=i.subscribe(e);return void r.cloneSubs.push(o)}t.setAttribute(n,i.value)}else if(s)return v(n,o,t)}))}const m=/(?:<[^>]*>)|({__tagVar[^}]+})/g;function S(t,e,s){if(!t.children||"TEMPLATE"===t.tagName)return;const i={added:0,removed:0},c=new Array(...t.children);function l(t,c,l){l.forEach(((t,e)=>{if(!(e<c)&&"TEMPLATE"===t.tagName&&void 0!==t.getAttribute("interpolate")&&void 0!==t.getAttribute("end"))return t})),function(t,e,s,i){if(!t.hasAttribute("end"))return;const c=t.getAttribute("id");if(c?.substring(0,L.length)!==L)return;const l=e[c];if(l instanceof p){const e=e=>{!function(t,e,s,i,c){if(t instanceof B)return t.tagSupport||(t.tagSupport=o(),t.tagSupport.mutatingRender=i.tagSupport.mutatingRender,t.tagSupport.oldest=t.tagSupport.oldest||t,i.children.push(t),t.ownerTag=i),void F(t,e,s,{counts:c});if(t instanceof Array&&t.every((t=>t instanceof B)))return function(t,e,r,n,o){t.lastArray=t.lastArray||[];let s=0;return t.lastArray=t.lastArray.filter(((r,n)=>{const a=e.length-1<n-s,i=e[n-s],u=i?.arrayValue;return!a&&u===r.tag.arrayValue||(t.lastArray[n].tag.destroy(o.removed,!1),++s,++o.removed,!1)})),void e.forEach(((e,s)=>{if(e.tagSupport=n.tagSupport,e.ownerTag=n,n.children.push(e),void 0===e.arrayValue&&!Object.keys(e).includes("arrayValue")){const t=new Error("Use html`...`.key(item) instead of html`...` to template an Array");throw t.code="add-array-key",t}const a=t.lastArray[s];if(a)return void(a.tag.arrayValue===e.arrayValue&&a.tag.updateValues(e.values));const i=r||r.clone;F(e,t,i,{index:s,counts:o})}))}(e,t,s,i,c);if(k(t))return function(t,e,s,i,c){if(!0!==t.tagged){let e=t.name||t.constructor?.name;throw"Function"===e&&(e=void 0),new Error(`Not a tag component. Wrap your function with tag(). Example tag(props => html\`\`) on component:\n\n${e||t.toString().substring(0,120)}\n\n`)}const l=e.tagSupport||o(t);l.mutatingRender=()=>{const o=l.renderCount;if(e.tag){if(function(t){t.providers.filter((t=>!n(t.instance,t.clone))).forEach((e=>{!function(t,e){V(t,e).forEach((({tag:t,renderCount:e,provider:n})=>{e===t.tagSupport.renderCount&&(n.clone=r(n.instance),t.tagSupport.render())}))}(t.getAppElement(),e),e.clone=r(e.instance)}))}(e.tag),o!==l.renderCount)return l.newest;if(!l.hasPropChanges(t.props,t.newProps,e.tag.tagSupport.templater.props))return l.newest=t.redraw(t.newProps),l.newest}return l.newest=i.tagSupport.render()};const p=t;let d=p.newest;u.ownerTag=i;const g=!d;return a(l,d),g&&(d=p.wrapper(),d.tagSupport=l,d.afterRender(),p.oldest=d,l.oldest=d,t.oldest=d),p.newest=d,d.ownerTag=i,d.ownerTag=i,i.children.push(d),d.setSupport(l),void F(d,e,s,{counts:c})}(t,e,s,i,c);if(e.tag){const r=s.clone||s;r.parentNode.insertBefore(s,r);const n=c.removed,o=e.tag.destroy(n);c.removed=n+o,delete e.tag;const a=P(t,r);return void(s.clone=a)}const l=s.clone||s,p=P(t,l);s.clone=p;const d=i.clones.indexOf(l);d>=0&&!i.clones.includes(p)&&!l.parentNode&&(i.clones.splice(d,1),i.clones.push(p))}(e,l,t,s,i),setTimeout((()=>{i.added=0,i.removed=0}),0)},c=l.subscribe(e);return void s.cloneSubs.push(c)}const d=P(l,t.clone||t);s.clones.push(d),t.clone=d}(t,e,s,i)}c.forEach(((t,r)=>{if(l(t,r,c),t.children){const r=new Array(...t.children);r.forEach(((t,n)=>{(function(t){return"TEMPLATE"===t.tagName&&void 0!==t.getAttribute("interpolate")&&void 0!==t.getAttribute("end")})(t)&&l(t,n,r),S(t,e,s)}))}}))}function T(t,e,r){(function(t){const e=function(t){const e=[];return{string:t.replace(m,((t,r)=>{if(t.startsWith("<"))return t;const n=r.substring(1,r.length-1);return e.push(n),`<template interpolate end id="${n}"></template>`})),keys:e}}(t.innerHTML);return e.string=e.string.replace(O,L),t.innerHTML=e.string,e})(t).keys.length&&S(t,e,r),b(t,e,r),function t(n){new Array(...n).forEach((n=>{b(n,e,r),n.children&&t(n.children)}))}(t.children)}function A(t,e,r){const n=document.createElement("div");n.id="tag-temp-holder",n.innerHTML="<div></div>"+e.string,T(n,t.update(),t);const o=function(t,e){const r=[],n=t.children[0];let o=n.nextSibling;for(t.removeChild(n);o;){const t=o.nextSibling;E(o,e),r.push(o),o=t}return r}(n,r);return t.clones.push(...o),o}function E(t,e){e.parentNode.insertBefore(t,e)}class R{props;newProps;cloneProps;tagged;wrapper;newest;oldest;redraw}function C(t){return(e,n)=>{const o=e instanceof B,s=function(t,e){if("object"!=typeof t)return t;const r={...t};return Object.entries(r).forEach((([t,e])=>{r[t]=e instanceof Function?(...t)=>((t,e)=>{const r=t(...e);return i.newest?.ownerTag?.tagSupport.render(),r})(e,t):e})),r}(o?0:e);let a=s;o&&(n=e,a=x);const i=new R;return i.tagged=!0,i.props=e,i.newProps=s,i.cloneProps=r(s),i.wrapper=()=>t(a,n),i}}const x=new class{};function P(t,e){const r=e.parentNode;void 0!==t&&!1!==t&&null!==t||(t="");const n=document.createTextNode(t);return r.insertBefore(n,e),r.removeChild(e),n}function F(t,e,r,{index:n,counts:o}){const s=t.getTemplate();if(void 0!==n){const a=e.lastArray[n];return a?.tag.isLikeTag(t)?void a.tag.updateByTag(t):(A(t,s,r).forEach((t=>j(t,o))),void e.lastArray.push({tag:t,index:n}))}if(e.tag&&e.tag.isLikeTag(t)){if(e instanceof Function){const t=e(e.tag.tagSupport);return void e.tag.updateByTag(t)}e.tag.updateByTag(t)}else A(t,s,r.clone||r).forEach((t=>j(t,o))),e.tag=t}function k(t){return t instanceof R}function j(t,e){t.getAttribute&&(function(t,e){const r=t.oninit;if(!r)return;const n=r.tagFunction;if(!n)return;const o=n.tagFunction;o&&(o({target:t,stagger:e.added}),++e.added)}(t,e),t.children&&new Array(...t.children).forEach((t=>j(t,e))))}function V(t,e,r=[]){const n=t.providers.find((t=>t.constructMethod===e.constructMethod));return n&&r.push({tag:t,renderCount:t.tagSupport.renderCount,provider:n}),t.children.forEach((t=>V(t,e,r))),r}const L="__tagVar",M="--"+L+"--",N=new RegExp(L,"g"),O=new RegExp(M,"g");class B{strings;values;context={};clones=[];cloneSubs=[];children=[];tagSupport;ownerTag;arrayValue;constructor(t,e){this.strings=t,this.values=e}providers=[];beforeRedraw(){!function(t,e){s.forEach((r=>r.beforeRedraw(t,e)))}(this.tagSupport,this)}afterRender(){!function(t,e){s.forEach((r=>r.afterRender(t,e)))}(this.tagSupport,this)}key(t){return this.arrayValue=t,this}destroy(t=0,e=!1){return this.children.forEach(((t,e)=>t.destroy(0,!0))),this.destroySubscriptions(),e||(t=this.destroyClones(t)),t}destroySubscriptions(){this.cloneSubs.forEach((t=>t.unsubscribe())),this.cloneSubs.length=0}destroyClones(t=0){return this.clones.reverse().forEach(((e,r)=>{let n=Promise.resolve();e.ondestroy&&(n=function(t,e){const r=t.ondestroy;if(!r)return;const n=r.tagFunction;if(!n)return;const o=n.tagFunction;return o?o({target:t,stagger:e}):void 0}(e,t)),n.then((()=>e.parentNode.removeChild(e)))})),this.clones.length=0,t}updateByTag(t){this.updateConfig(t.strings,t.values),this.tagSupport.templater=t.tagSupport.templater}lastTemplateString=void 0;setSupport(t){this.tagSupport=this.tagSupport||t,this.tagSupport.mutatingRender=this.tagSupport.mutatingRender||t.mutatingRender,this.children.forEach((e=>e.setSupport(t)))}updateConfig(t,e){this.strings=t,this.updateValues(e)}getTemplate(){return{string:this.lastTemplateString=this.strings.map(((t,e)=>t.replace(N,M)+(this.values.length>e?`{${L}${e}}`:""))).join(""),strings:this.strings,values:this.values,context:this.context}}isLikeTag(t){return t.lastTemplateString===this.lastTemplateString&&(t.values.length===this.values.length&&!!t.values.every(((t,e)=>{const r=this.values[e];return t instanceof Function&&r instanceof Function?!(t.toString()!==r.toString()):!(t instanceof B&&r instanceof B&&(t.ownerTag=this,this.children.push(t),t.lastTemplateString||t.getTemplate().string,!t.isLikeTag(r)))})))}update(){return this.updateContext(this.context)}updateValues(t){return this.values=t,this.updateContext(this.context)}updateContext(t){return this.strings.map(((e,r)=>{const s=L+r,i=this.values.length>r,u=this.values[r],c=t[s];if(c){const t=c.value?.tag;if(k(u)){const t=u.cloneProps,e=c.tag;if(!c.tag)return h(u,c,this),void u.redraw(t);const r=e.tagSupport,s=u.tagSupport||r||o(u),a=s.templater?.cloneProps,i=s.templater?.props;if(e&&(void 0===i&&i===t||n(a,t)))return;return h(u,c,this),r.templater=u,void(c.value.tag=r.newest=u.redraw(t))}if(t){const e=t.tagSupport,r=u;a(e,t),e.oldest.beforeRedraw();const n=r.wrapper();return n.tagSupport=e,r.newest=n,e.oldest.afterRender(),t.updateByTag(n),void c.set(u)}return u instanceof Function?void c.set(f(u,this)):void c.set(u)}k(u)?h(u,t[s]=new g(u),this):u instanceof Function?t[s]=function(t,e){return new g(f(t,e))}(u,this):i&&(u instanceof B&&(u.ownerTag=this,this.children.push(u)),t[s]=new g(u))})),t}getAppElement(){let t=this;for(;t.ownerTag;)t=t.ownerTag;return t}}function $(t,...e){return new B(t,e)}function _(t){return new Promise((e=>{setTimeout((()=>{e(0)}),t)}))}function D(t,e,r){const n=t(r),s=function(t){const e=o(t);a(e);const r=e.templater.wrapper();return r.tagSupport=e,r.afterRender(),{tag:r,tagSupport:e}}(n),{tag:i,tagSupport:u}=s;let c;u.mutatingRender=()=>{a(u,i),i.beforeRedraw();const t=c=n.wrapper();return t.setSupport(i.tagSupport),i.afterRender(),i.updateByTag(t),c&&c.destroy(0),c};const l=i.updateValues(i.values),p=i.getTemplate();e.innerHTML=p.string,T(e,l,i)}let H;function W(t){H=t}function q(t){H||t()}i({beforeRender:(t,e)=>{W(e)}});const I={array:[],rearray:[]};function J(t,e){const r=I.rearray[I.array.length];if(r){const t=Q(r);return I.array.push(e),t}return I.array.push(e),t}function Q(t){const[e]=t(U),[r]=t(e);if(r!==U)throw new Error('State property not used correctly.\n\nFor "let" state use `let name = state(default, x => [name, name = x])`\n\nFor "const" state use `const name = state(default)`\n\nProblem function:\n'+t+"\n");return e}i({beforeRender:t=>{t.state=t.state||{newest:[]}},beforeRedraw:t=>{const e=t.state;I.rearray.length=0,e?.newest.length&&I.rearray.push(...e.newest)},afterRender:t=>{if(I.rearray.length&&I.rearray.length!==I.array.length)throw new Error(`States lengths mismatched ${I.rearray.length} !== ${I.array.length}`);I.rearray.length=0;const e=t.state;e.newest.length=0,e.newest.push(...I.array),e.oldest=e.oldest||[...I.array],I.array.length=0}});class U{}let z=()=>t=>()=>{throw new Error("The real callback function was called and that should never occur")};function G(t,e){t.forEach(((t,r)=>{const n=Q(t),[o]=e[r](n)}))}i({beforeRender:t=>{t.callbacks=[],z=()=>{const e=r=>{const n=()=>{const n=t.state,o=e.state,s=n.newest;G(s,o);const a=r();G(o,s),t.render(),a instanceof Promise&&a.finally((()=>{G(o,s),t.render()}))},o=t.state;return n.state=o,n};return t.callbacks.push(e),e}},afterRender:t=>{t.callbacks.forEach((e=>{const r=t.state;e.state=[...r.newest]}))}});var K=e.xQ,X=e.Vp,Y=e.RN,Z=e.dy,tt=e.ey,et=e.nc,rt=e.a,nt=e.TF,ot=e.Je,st=e.SB,at=e._q,it=e.Dc;export{K as Subject,X as Tag,Y as getCallback,Z as html,tt as initCurrentTag,et as onInit,rt as providers,nt as renderAppToElement,ot as setCurrentInitTag,st as state,at as tag,it as wait};
|
|
1
|
+
var t={d:(e,r)=>{for(var n in r)t.o(r,n)&&!t.o(e,n)&&Object.defineProperty(e,n,{enumerable:!0,get:r[n]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e)},e={};t.d(e,{xQ:()=>r,Vp:()=>et,fx:()=>y,RN:()=>jt,er:()=>b,dy:()=>rt,jW:()=>lt,SO:()=>H,IT:()=>z,SW:()=>u,js:()=>dt,ev:()=>xt,nc:()=>Rt,a:()=>wt,_b:()=>S,hs:()=>g,lc:()=>l,SB:()=>vt,_q:()=>ht,bX:()=>ot,pJ:()=>ft});class r{isSubject=!0;subscribers=[];value;subscribe(t){this.subscribers.push(t),o.globalSubs.push(t),o.globalSubCount$.set(o.globalSubCount$.value+1);const e=()=>{e.unsubscribe()};return e.unsubscribe=()=>{n(this.subscribers,t),n(o.globalSubs,t),o.globalSubCount$.set(o.globalSubCount$.value-1),e.unsubscribe=()=>{}},e}set(t){this.value=t,this.subscribers.forEach((e=>{e.value=t,e(t)}))}next=this.set}function n(t,e){const r=t.indexOf(e);-1!==r&&t.splice(r,1)}const o=r;o.globalSubs=[],o.globalSubCount$=new r,o.globalSubCount$.set(0);class s extends r{value;constructor(t){super(),this.value=t}subscribe(t){const e=super.subscribe(t);return t(this.value),e}}function a(t,e=new WeakMap){if(null===t||"object"!=typeof t)return t;if(e.has(t))return e.get(t);if(t instanceof Date)return new Date(t);if(t instanceof RegExp)return new RegExp(t);const r=Array.isArray(t)?[]:Object.create(Object.getPrototypeOf(t));if(e.set(t,r),Array.isArray(t))for(let n=0;n<t.length;n++)r[n]=a(t[n],e);else for(const n in t)t.hasOwnProperty(n)&&(r[n]=a(t[n],e));return r}function i(t,e){if(t===e)return!0;if("object"!=typeof t||"object"!=typeof e||null===t||null===e)return!1;const r=Object.keys(t),n=Object.keys(e);if(r.length!==n.length)return!1;for(const o of r)if(!n.includes(o)||!i(t[o],e[o])){if(t[o]instanceof Function&&e[o]instanceof Function&&t[o].toString()===e[o].toString())continue;return!1}if(Array.isArray(t)&&Array.isArray(e)){if(t.length!==e.length)return!1;for(let r=0;r<t.length;r++)if(!i(t[r],e[r]))return!1}else if(Array.isArray(t)||Array.isArray(e))return!1;return!0}function u(t){return!0===t?.isTemplater}function c(t){return!0===t?.isTag}function p(t){return!(!0!==t?.isSubject&&!t?.subscribe)}function l(t){const e={beforeRender:t.beforeRender||(()=>{}),beforeRedraw:t.beforeRedraw||(()=>{}),afterRender:t.afterRender||(()=>{}),beforeDestroy:t.beforeDestroy||(()=>{})};l.tagUse.push(e)}function g(t,e){l.tagUse.forEach((r=>r.beforeRender(t,e)))}function d(t,e){l.tagUse.forEach((r=>r.afterRender(t,e)))}function f(t,e){l.tagUse.forEach((r=>r.beforeRedraw(t,e)))}l.tagUse=[],l.memory={};class m{tagged;wrapper;newest;oldest;tagSupport;constructor(t){this.tagSupport=b(this,t)}redraw;isTemplater=!0;forceRenderTemplate(t,e){const r=this.wrapper();return r.setSupport(t),r.afterRender(),this.oldest=r,t.oldest=r,this.oldest=r,this.newest=r,r.ownerTag=e,r}renderWithSupport(t,e,r){++t.memory.renderCount;const n=e?.ownerTag||r;t.oldest?(t.props=t.latestProps,t.clonedProps=t.latestClonedProps,f(t,t.oldest)):(g(t,n),l.memory.providerConfig.ownerTag=n);const o=this,s=o.wrapper();t.latestProps=s.tagSupport.props,t.latestClonedProps=s.tagSupport.clonedProps,s.setSupport(t),d(t,s),o.newest=s,s.ownerTag=n;const a=t.oldest=t.oldest||s;t.newest=s;const i=a.tagSupport;return a.tagSupport=i||t,a.tagSupport.templater=o,e&&e.isLikeTag(s)?(a.updateByTag(s),{remit:!1,retag:s}):{remit:!0,retag:s}}}function h(t,e){const r=function(t,r){if("object"!=typeof t)return t;const n={...t};return Object.entries(n).forEach((([t,r])=>{n[t]=r instanceof Function?(...t)=>function(t,r){const n=t(...r);return e.newest?.ownerTag?.tagSupport.render(),n}(r,t):r})),n}(c(t)?0:t);return r}class y{templater;props;clonedProps;latestProps;latestClonedProps;memory={context:{},state:{newest:[]},providers:[],renderCount:0};constructor(t,e){this.templater=t,this.props=e,this.latestProps=e;const r=h(e,t);this.latestClonedProps=a(r),this.clonedProps=this.latestClonedProps}oldest;newest;hasPropChanges(t,e,r){const n=this.props;return!(void 0===t&&t===r||i(e,n))}mutatingRender(){const t='Tag function "render()" was called in sync but can only be called async';throw console.error(t,{tagSupport:this}),new Error(t)}render(){return++this.memory.renderCount,this.mutatingRender()}renderExistingTag(t,e){const r=this.memory.renderCount;if(function(t){t.tagSupport.memory.providers.filter((t=>!i(t.instance,t.clone))).forEach((e=>{!function(t,e){w(t,e).forEach((({tag:t,renderCount:e,provider:r})=>{e===t.tagSupport.memory.renderCount&&(r.clone=a(r.instance),t.tagSupport.render())}))}(t.getAppElement(),e),e.clone=a(e.instance)}))}(t),r!==this.memory.renderCount)return!0;const n=t.tagSupport.templater,o=e.tagSupport.props,s=n?.tagSupport.props;return function(t,e,r,n,o){const s=t.hasPropChanges(e,n,r);return t.newest=o.redraw(),!s}(this,o,s,e.tagSupport.clonedProps,this.templater)}}function b(t,e){return new y(t,e)}function w(t,e,r=[]){const n=t.tagSupport.memory.providers.find((t=>t.constructMethod===e.constructMethod));return n&&r.push({tag:t,renderCount:t.tagSupport.memory.renderCount,provider:n}),t.children.forEach((t=>w(t,e,r))),r}function S(t,e,r){const n=t?.tagSupport||b(e);return e.renderWithSupport(n,t,r)}function v(t,e){function r(r,n){const o=e.tagSupport.memory.renderCount,s=t.bind(r)(...n);if(o===e.tagSupport.memory.renderCount)return e.tagSupport.render(),s instanceof Promise?s.then((()=>e.tagSupport.render()&&"no-data-ever")):Promise.resolve(s).then((()=>"no-data-ever"))}return r.tagFunction=t,r}function T(t,e,r){t.redraw=n=>{const o=e.tag,{remit:s,retag:a}=S(o,t,r);if(e.tagSupport=a.tagSupport,s){if(e.set(t),n){const t=o.tagSupport.memory.context;Object.values(t).forEach((t=>{t.value?.isTemplater&&t.value.redraw()}))}return a}}}function E(t,e){e.parentNode.insertBefore(t,e)}function C(t,e,r){const n=t.split(".");if("style"===n[0]&&(r.style[n[1]]=e),"class"===n[0])return n.shift(),void(e?n.forEach((t=>r.classList.add(t))):n.forEach((t=>r.classList.remove(t))))}function A(t,e,r){const n=t.getAttributeNames();"TEXTAREA"!==t.nodeName||n.includes("value")||P("textVarValue",t.getAttribute("textVarValue"),t,e,r,((e,r)=>t.value=r));const o=(e,r)=>{t.setAttribute(e,r)};n.forEach((n=>{P(n,t.getAttribute(n),t,e,r,o)}))}function R(t){return t.search(/^(class|style)(\.)/)>=0}function P(t,e,r,n,o,s){if(V(e))return function(t,e,r,n,o,s){return O(t,k(n,e),r,o,s)}(t,e,r,n,o,s);if(V(t)){let e;const a=k(n,t).subscribe((t=>{!function(t,e,r,n,o){if(e&&e!=t&&("string"==typeof e?r.removeAttribute(e):e instanceof Object&&Object.entries(e).forEach((([t])=>r.removeAttribute(t)))),"string"!=typeof t)t instanceof Object&&Object.entries(t).forEach((([t,e])=>O(t,e,r,n,o)));else{if(!t.length)return;O(t,"",r,n,o)}}(t,e,r,o,s),e=t}));return o.cloneSubs.push(a),void r.removeAttribute(t)}return R(t)?C(t,e,r):void 0}const x=/^\s*{__tagvar/,j=/}\s*$/;function V(t){return t&&t.search(x)>=0&&t.search(j)>=0}function k(t,e){return t[e.replace("{","").split("").reverse().join("").replace("}","").split("").reverse().join("")]}function O(t,e,r,n,o){const s=R(t);if(e instanceof Function){const n=function(...t){return e(r,t)};r[t].action=n}if(p(e)){r.removeAttribute(t);const a=e=>function(t,e,r,n,o){if(t instanceof Function)return e[r]=function(...r){return t(e,r)},void(e[r].tagFunction=t);if(n)return void C(r,t,e);if(t)return void o(r,t);void 0===t||!1===t||null===t?e.removeAttribute(r):o(r,t)}(e,r,t,s,o),i=e.subscribe(a);n.cloneSubs.push(i)}else o(t,e)}const B=/(?:<[^>]*?(?:(?:\s+\w+(?:\s*=\s*(?:"[^"]*"|'[^']*'|[^>\s]+)))*\s*)\/?>)|({__tagvar[^}]+})/g;function F(t,e,r,{index:n,counts:o,forceElement:s}){if(void 0!==n){const a=e.lastArray[n];if(a?.tag.isLikeTag(t))return a.tag.updateByTag(t),[];const i=r,u=t.buildBeforeElement(i,{counts:o,forceElement:s});return e.lastArray.push({tag:t,index:n}),u}if(e.tag&&!s&&e.tag.isLikeTag(t)){if(e instanceof Function){const t=e(e.tag.tagSupport);return e.tag.updateByTag(t),[]}return e.tag.updateByTag(t),[]}const a=t.buildBeforeElement(r,{counts:o,forceElement:s});return e.tag=t,a}function N(t,e,r,n,o){if(!0!==t.tagged){let e=t.wrapper.original.name||t.wrapper.original.constructor?.name;"Function"===e&&(e=void 0);const r=e||t.wrapper.original.toString().substring(0,120);throw new Error(`Not a tag component. Wrap your function with tag(). Example tag(props => html\`\`) on component:\n\n${r}\n\n`)}const s=t,a=t.tagSupport;a.mutatingRender=()=>e.tag&&a.renderExistingTag(e.tag,s)?e.tag:a.newest=n.tagSupport.render();let i=s.newest;return l.memory.providerConfig.ownerTag=n,(!i||o.forceElement)&&(i||g(a,n),i&&f(a,i),i=s.forceRenderTemplate(a,n)),n.children.push(i),a.latestProps=i.tagSupport.props,a.latestClonedProps=i.tagSupport.clonedProps,a.memory=i.tagSupport.memory,i.setSupport(a),F(i,e,r,o)}function _(t,e,r,n,o){const s=[];t.lastArray=t.lastArray||[];let a=0;t.lastArray=t.lastArray.filter(((r,n)=>{const s=e.length-1<n-a,i=e[n-a],u=i?.arrayValue;return!s&&u===r.tag.arrayValue||(t.lastArray[n].tag.destroy({stagger:o.counts.removed,byParent:!1}),++a,++o.counts.removed,!1)}));const i=r||r.clone;return e.forEach(((e,r)=>{if(e.tagSupport=b({}),e.tagSupport.mutatingRender=()=>(n.tagSupport.render(),e),e.ownerTag=n,n.children.push(e),void 0===e.arrayValue&&!Object.keys(e).includes("arrayValue")){const t=new Error("Use html`...`.key(item) instead of html`...` to template an Array");throw t.code="add-array-key",t}const a=t.lastArray[r];if(a)return a.tag.arrayValue===e.arrayValue&&a.tag.updateValues(e.values),[];const u=F(e,t,i,{index:r,...o});s.push(...u)})),s}var $;function L(t,e,r,n){const o=e.clone||r,s=D(t,o);e.clone=s;const a=[],i=n.clones.indexOf(o);return i>=0&&!n.clones.includes(s)&&!o.parentNode&&(n.clones.splice(i,1),n.clones.push(s),a.push(s)),a}function M(t,e,r,n,o){return t.tagSupport||(t.tagSupport=b({}),t.tagSupport.mutatingRender=n.tagSupport.mutatingRender,t.tagSupport.oldest=t.tagSupport.oldest||t,n.children.push(t),t.ownerTag=n),F(t,e,r,o)}function U(t,e,r,n){const o=e.tag,s=e.clone||r;s.parentNode.insertBefore(r,s),e.clone&&e.clone.parentNode.removeChild(e.clone),delete e.tag;const a=n.counts.removed,i=o.destroy({stagger:a}).then((t=>n.counts.removed=a+t));delete e.tag;const u=D(t,r);return e.clone=u,i}function W(t,e,r,n,o){const s=[];if(!t.hasAttribute("end"))return s;const a=t.getAttribute("id");if(a?.substring(0,Z.length)!==Z)return s;const i=e[a];let p=o.forceElement;const l=i.subscribe((e=>{const{clones:o}=function(t,e,r,n,o){const s=function(t){return u(t)?$.tagComponent:c(t)?$.tag:t instanceof Array&&t.every((t=>c(t)))?$.tagArray:$.value}(t);if(s!==$.value&&e.clone){const t=e.clone,n=t.parentNode;r.removeAttribute("removedAt"),n.insertBefore(r,t),n.removeChild(t),delete e.clone}switch(s){case $.tag:return{clones:M(t,e,r,n,o)};case $.tagArray:return{clones:_(e,t,r,n,o)};case $.tagComponent:return{clones:N(t,e,r,n,o)}}return e.tag?{clones:[],promise:U(t,e,r,o)}:{clones:L(t,e,r,n)}}(e,i,t,r,{counts:n,forceElement:p});p&&(p=!1),o.push(...o),setTimeout((()=>{n.added=0,n.removed=0}),0)}));return r.cloneSubs.push(l),s}function D(t,e){const r=e.parentNode;void 0!==t&&!1!==t&&null!==t||(t="");const n=document.createTextNode(t);return r.insertBefore(n,e),r.removeChild(e),"TEMPLATE"===e.nodeName&&e.setAttribute("removedAt",Date.now().toString()),n}function I(t,e){t.getAttribute&&(e.forceElement||function(t,e){const r=t.oninit;if(!r)return;const n=r.tagFunction;if(!n)return;const o=n.tagFunction;o&&(o({target:t,stagger:e.added}),++e.added)}(t,e.counts),t.children&&new Array(...t.children).forEach((t=>I(t,e))))}!function(t){t.tag="tag",t.tagArray="tag-array",t.tagComponent="tag-component",t.value="value"}($||($={}));const J=new RegExp('\\s*<template interpolate end id="__tagvar(\\d{1,4})"([^>]*)></template>(\\s*)');function X(t,e,r,n,o){if(!o||"TEMPLATE"===t.tagName)return[];const s={added:0,removed:0},a=[],i=new Array(...o);return"TEXTAREA"===t.tagName&&q(t),i.forEach((t=>{const o=W(t,e,r,s,n);"TEXTAREA"===t.tagName&&q(t),a.push(...o),t.children&&new Array(...t.children).forEach((t=>{(function(t){return"TEMPLATE"===t.tagName&&void 0!==t.getAttribute("interpolate")&&void 0!==t.getAttribute("end")})(t)&&W(t,e,r,s,n);const o=X(t,e,r,n,t.children);a.push(...o)}))})),a}function q(t){const e=t.value;if(e.search(J)>=0){const r=e.match(/__tagvar(\d{1,4})/),n="{"+(r?r[0]:"")+"}";t.value="",t.setAttribute("textVarValue",n)}}function H(t,e,r,n,o){const s=[],a=r.interpolation,i=t.children[0].content.children;if(a.keys.length){const r=X(t,e,n,o,i);s.push(...r)}return A(t,e,n),Q(i,e,n),s}function Q(t,e,r){new Array(...t).forEach((t=>{A(t,e,r),t.children&&Q(t.children,e,r)}))}function z(t){const e=function(t){const e=[];return{string:t.replace(B,((t,r)=>{if(t.startsWith("<"))return t;const n=r.substring(1,r.length-1);return e.push(n),`<template interpolate end id="${n}"></template>`})),keys:e}}(t);return e.string=e.string.replace(tt,Z),e}function G(t,e,r){delete e.tag,delete e.tagSupport,delete r.tagSupport,t.destroy()}const Z="__tagvar",K="--"+Z+"--",Y=new RegExp(Z,"g"),tt=new RegExp(K,"g");class et{strings;values;isTag=!0;clones=[];cloneSubs=[];children=[];tagSupport;ownerTag;insertBefore;appElement;arrayValue;constructor(t,e){this.strings=t,this.values=e}beforeRedraw(){f(this.tagSupport,this)}afterRender(){d(this.tagSupport,this)}key(t){return this.arrayValue=t,this}async destroy(t={stagger:0,byParent:!1}){!!this.tagSupport&&function(t,e){l.tagUse.forEach((r=>r.beforeDestroy(t,e)))}(this.tagSupport,this),this.destroySubscriptions();const e=this.children.map((e=>e.destroy({...t,byParent:!0})));return t.byParent||(t.stagger=await this.destroyClones(t)),this.ownerTag&&(this.ownerTag.children=this.ownerTag.children.filter((t=>t!==this))),await Promise.all(e),t.stagger}destroySubscriptions(){this.cloneSubs.forEach((t=>t.unsubscribe())),this.cloneSubs.length=0}async destroyClones({stagger:t}={stagger:0}){const e=this.clones.reverse().map(((e,r)=>{let n=Promise.resolve();return e.ondestroy&&(n=function(t,e){const r=t.ondestroy;if(!r)return;const n=r.tagFunction;if(!n)return;const o=n.tagFunction;return o?o({target:t,stagger:e}):void 0}(e,t)),n.then((()=>{e.parentNode?.removeChild(e);const t=this.ownerTag;t&&(t.clones=t.clones.filter((t=>t!==e)))})),n}));return await Promise.all(e),t}updateByTag(t){this.updateConfig(t.strings,t.values),this.tagSupport.templater=t.tagSupport.templater}lastTemplateString=void 0;setSupport(t){this.tagSupport=t,this.tagSupport.mutatingRender=t.mutatingRender}updateConfig(t,e){this.strings=t,this.updateValues(e)}getTemplate(){const t=z(this.strings.map(((t,e)=>(t.replace(Y,K)+(this.values.length>e?`{${Z}${e}}`:"")).replace(/>\s*/g,">").replace(/\s*</g,"<"))).join(""));return this.lastTemplateString=t.string,{interpolation:t,string:t.string,strings:this.strings,values:this.values,context:this.tagSupport?.memory.context||{}}}isLikeTag(t){const{string:e}=t.getTemplate();if(e!==this.lastTemplateString)return!1;if(t.values.length!==this.values.length)return!1;const r=t.values.every(((t,e)=>{const r=this.values[e];if(t instanceof Function&&r instanceof Function)return!(t.toString()!==r.toString());const n=t;return!c(n)||!c(r)||(n.ownerTag=this,this.children.push(n),n.lastTemplateString||n.getTemplate().string,!!n.isLikeTag(r))}));return!!r}update(){return this.updateContext(this.tagSupport.memory.context)}updateValues(t){return this.values=t,this.updateContext(this.tagSupport.memory.context)}updateContext(t){return this.strings.map(((e,r)=>{const n=Z+r,o=this.values.length>r,i=this.values[r],l=t[n];if(l)return function(t,e,r,n){const o=t.value,s=o?.tag,i=e,c=t;if(u(i))return function(t,e,r,n){const o=e.tagSupport.props;let s=r.tag;if(!s)return T(e,r,t),void e.redraw();const i=s.tagSupport.templater.wrapper,u=e.wrapper;let c=!1;i&&u&&(c=i.original===u.original);const p=s.tagSupport;if(p.latestProps=o,p.latestClonedProps=e.tagSupport.clonedProps,c){const t=n?.tagSupport,e=a(t.props),r=t?.props;if(s&&p.hasPropChanges(r,e,o))return}else G(s,r,n);T(e,r,t),p.templater=e;const l=e.redraw();r.value.tag=p.newest=l,c||(r.tag=l,n.tagSupport=e.tagSupport)}(r,i,c,o);if(c.tag)G(c.tag,c,o);else if(s)return function(t,e,r){const n=e.tagSupport,o=n.oldest;o.beforeRedraw();const s=t.wrapper();n.latestProps=s.tagSupport.props,n.latestClonedProps=s.tagSupport.clonedProps,n.memory=s.tagSupport.memory,s.setSupport(n),t.newest=s,n.newest=s,o.afterRender(),e.updateByTag(s),r.set(t)}(e,s,c);e instanceof Function?c.set(v(e,r)):p(e)?c.set(e.value):c.set(e)}(l,i,this);!function(t,e,r,n,o){u(e)?T(e,r[n]=new s(e),o):e instanceof Function?r[n]=function(t,e){return new s(v(t,e))}(e,o):t&&(c(e)&&(e.ownerTag=o,o.children.push(e)),p(e)?r[n]=e:r[n]=new s(e))}(o,i,t,n,this)})),t}getAppElement(){let t=this;for(;t.ownerTag;)t=t.ownerTag;return t}rebuild(){const t=this.insertBefore;if(!t){const t=new Error("Cannot rebuild. Previous insertBefore element is not defined on tag");throw t.tag=this,t}this.buildBeforeElement(t,{forceElement:!0,counts:{added:0,removed:0}})}buildBeforeElement(t,e={forceElement:!1,counts:{added:0,removed:0}}){this.insertBefore=t;const r=this.update(),n=this.getTemplate(),o=document.createElement("div");o.id="tag-temp-holder",o.innerHTML=`<template tag-wrap="22">${n.string}</template>`;const s=H(o,r,n,this,{forceElement:e.forceElement});this.clones.length=0;const a=function(t,e){const r=[];let n=t.children[0].content.firstChild;for(;n;){const t=n.nextSibling;E(n,e),r.push(n),n=t}return r}(o,t);return this.clones.push(...a),s.length&&(this.clones=this.clones.filter((t=>!s.find((e=>e===t))))),this.clones.forEach((t=>I(t,e))),this.clones}}function rt(t,...e){return new et(t,e)}const nt=[];function ot(t,e,r){const n=nt.findIndex((t=>t.element===e));n>=0&&(nt[n].tag.destroy(),nt.splice(n,1),console.warn("Found and destroyed app element already rendered to element",{element:e}));const o=function(t){const e=t.tagSupport;g(e,void 0);const r=t.wrapper();return r.tagSupport=e,r.afterRender(),{tag:r,tagSupport:e}}(t(r)),{tag:s,tagSupport:a}=o;s.appElement=e,function(t,e){let r;t.mutatingRender=()=>{e.beforeRedraw();const n=t.templater,o=r=n.wrapper();return t.latestProps=o.tagSupport.props,t.latestClonedProps=o.tagSupport.clonedProps,o.setSupport(t),e.afterRender(),e.updateByTag(o),r&&r.destroy({stagger:0}),t.newest=o,r}}(a,s);const i=document.createElement("template");return i.setAttribute("tag-detail","app-template-placeholder"),e.appendChild(i),s.buildBeforeElement(i),e.setUse=t.original.setUse,nt.push({element:e,tag:s}),{tag:s,tags:t.original.tags}}const st={},at={};function it(t){const{id:e,observer:r,tag:n}=t;r.disconnect(),n.destroy(),delete st[e]}function ut(t){const e=t.getAttribute("props");if(!e)return{element:t};try{const r=JSON.parse(e),n=t.getAttribute("events");n&&n.split(",").map((t=>t.trim())).map((t=>{r[t]=e=>o(t,{detail:{[t]:e}})}));const o=function(e,r){const n=new CustomEvent(e,r);t.dispatchEvent(n)};return r.dispatchEvent=o,r}catch(r){throw console.warn("Failed to parse props on element",{element:t,propsString:e}),r}}function ct(t,e,r){const n=e.gateway;if(n)return n.updateTag(),n;const o=ut(e);try{const{tag:n}=ot(r,e,o);return function(t,e,r,n){let o=r;const s=new MutationObserver((t=>{if(function(t){const{element:e}=t;if(!document.body.contains(e))return it(t),!1}(i))for(const e of t)"attributes"===e.type&&a()}));function a(){const t=r.tagSupport.templater,n=t.tagSupport.props,s=ut(e);if(t.tagSupport.props=s,JSON.stringify(n)===JSON.stringify(s))return;t.tagSupport.latestProps=s;const a=S(o,t);i.tag=o=a.retag}dt(n);const i={id:t,tag:r,observer:s,component:n,element:e,updateTag:a};return st[t]=st[t]||[],st[t].push(i),e.gateway=i,s.observe(e,{attributes:!0}),i}(t,e,n,r)}catch(t){throw console.warn("Failed to render component to element",{component:r,element:e,props:o}),t}}class pt extends HTMLElement{gateway;constructor(){super(),setTimeout((()=>this.gateway=function(t){const e=t.id||t.getAttribute("id");if(!e){const r="Cannot check a tag on element with no id attribute";throw console.warn(r,{id:e,element:t}),new Error(r)}const r=at[e];if(!r){const r=`Cannot find a tag registered by id of ${e}`;throw console.warn(r,{id:e,element:t}),new Error(r)}return ct(e,t,r)}(this)),0)}disconnectedCallback(){it(this.gateway)}}function lt(){customElements.define("tag-element",pt)}let gt=!1;function dt(t){if(!gt){try{lt()}catch(t){throw t}gt=!0}const e=function(t){return"__tagTemplate_"+function(t){let e=t.toString().replace(/\s+/g,"_").replace(/[^\w\d]/g,"_");return/^[a-zA-Z]/.test(e)||(e="fn_"+e),e}(t)}(t);return at[e]=t,e}const ft=[];let mt=0;function ht(t){const e=function(e,r){const n=c(e),o=new m(e);let s=h(e,o);function a(){const t=(0,a.original)(o.tagSupport.props,r);return t.setSupport(o.tagSupport),t}return n&&(r=e,s=yt),a.original=t,o.tagged=!0,o.wrapper=a,o};return function(t,e){t.isTag=!0,t.original=e}(e,t),function(t){t.tags=ft,t.setUse=l,t.tagIndex=++mt}(t),ft.push(t),e}const yt=new class{};function bt(t){return l.memory.providerConfig.providers.find((e=>e.constructMethod===t))}l.memory.providerConfig={providers:[],currentTagSupport:void 0,ownerTag:void 0};const wt={create:t=>{const e=bt(t);if(e)return e.clone=a(e.instance),e.instance;const r=t.constructor?new t:t();return l.memory.providerConfig.providers.push({constructMethod:t,instance:r,clone:a(r)}),r},inject:t=>{const e=bt(t);if(e)return e.instance;const r=l.memory.providerConfig;let n={ownerTag:r.ownerTag};for(;n.ownerTag;){const e=n.ownerTag.tagSupport.memory.providers.find((e=>{if(e.constructMethod===t)return!0}));if(e)return e.clone=a(e.instance),r.providers.push(e),e.instance;n=n.ownerTag}const o=`Could not inject provider: ${t.name} ${t}`;throw console.warn(`${o}. Available providers`,r.providers),new Error(o)}};function St(t,e){const r=l.memory.providerConfig;r.currentTagSuport=t,r.ownerTag=e,t.memory.providers.length&&(r.providers.length=0,r.providers.push(...t.memory.providers))}function vt(t,e){const r=l.memory.stateConfig,n=r.rearray[r.array.length];if(n){const t=Tt(n);return r.array.push({callback:e,lastValue:t,defaultValue:n.defaultValue}),t}const o=(t instanceof Function?t:()=>t)();return r.array.push({callback:e,lastValue:o,defaultValue:o}),o}function Tt(t){const e=t.callback;if(!e)return t.defaultValue;const r=e(Et),[n]=r,[o]=e(n);if(o!==Et)throw new Error('State property not used correctly.\n\nFor "let" state use `let name = state(default, x => [name, name = x])`\n\nFor "const" state use `const name = state(default)`\n\nProblem function:\n'+t+"\n");return n}l({beforeRender:(t,e)=>{St(t,e)},beforeRedraw:(t,e)=>{St(t,e.ownerTag)},afterRender:t=>{const e=l.memory.providerConfig;t.memory.providers=[...e.providers],e.providers.length=0}}),l.memory.stateConfig={array:[],rearray:[]},l({beforeRender:t=>Ct(t),beforeRedraw:t=>Ct(t),afterRender:(t,e)=>{const r=t.memory.state,n=l.memory.stateConfig;if(n.rearray.length&&n.rearray.length!==n.array.length){const e=`States lengths mismatched ${n.rearray.length} !== ${n.array.length}`;throw console.error(e,{oldStates:n.array,newStates:n.rearray,component:t.templater?.wrapper.original}),new Error(e)}n.rearray=[],r.newest=[...n.array],n.array=[]}});class Et{}function Ct(t){const e=t.memory.state,r=l.memory.stateConfig;if(r.rearray.length){const n="last array not cleared";throw console.error(n,{config:r,component:t.templater?.wrapper.original,state:e}),n}r.rearray=[],e?.newest.length&&r.rearray.push(...e.newest)}function At(t){l.memory.initCurrentSupport=t}function Rt(t){l.memory.initCurrentSupport?l.memory.initCurrentSupport.memory.init||(l.memory.initCurrentSupport.memory.init=t,t()):console.warn("possible init issue?")}let Pt;function xt(t){Pt.memory||console.error("xxx",Pt),Pt.memory.destroyCallback=t}l({beforeRender:t=>At(t),beforeRedraw:t=>At(t)}),l({beforeRender:t=>Pt=t,beforeRedraw:t=>Pt=t,beforeDestroy:(t,e)=>{const r=t.memory.destroyCallback;r&&r()}});let jt=()=>t=>()=>{throw new Error("The real callback function was called and that should never occur")};function Vt(t,e){t.forEach(((t,r)=>{const n=Tt(t),o=e[r].callback;o&&o(n),e[r].lastValue=n}))}function kt(t){jt=()=>{const e=l.memory.stateConfig.array;return r=>(...n)=>function(t,e,r,...n){const o=t.memory.state.newest;Vt(o,r);const s=e(...n);Vt(r,o),t.render(),s instanceof Promise&&s.finally((()=>{Vt(r,o),t.render()}))}(t,r,e,...n)}}l({beforeRender:t=>kt(t),beforeRedraw:t=>kt(t)});var Ot=e.xQ,Bt=e.Vp,Ft=e.fx,Nt=e.RN,_t=e.er,$t=e.dy,Lt=e.jW,Mt=e.SO,Ut=e.IT,Wt=e.SW,Dt=e.js,It=e.ev,Jt=e.nc,Xt=e.a,qt=e._b,Ht=e.hs,Qt=e.lc,zt=e.SB,Gt=e._q,Zt=e.bX,Kt=e.pJ;export{Ot as Subject,Bt as Tag,Ft as TagSupport,Nt as getCallback,_t as getTagSupport,$t as html,Lt as initWebComponents,Mt as interpolateElement,Ut as interpolateString,Wt as isTagComponent,Dt as loadTagGateway,It as onDestroy,Jt as onInit,Xt as providers,qt as redrawTag,Ht as runBeforeRender,Qt as setUse,zt as state,Gt as tag,Zt as tagElement,Kt as tags};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type Clones = (Element | Text | ChildNode)[];
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Clones.type.js","sourceRoot":"","sources":["../ts/Clones.type.ts"],"names":[],"mappings":""}
|
package/js/Props.d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export type Props = unknown;
|
package/js/Props.js
ADDED
package/js/Props.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Props.js","sourceRoot":"","sources":["../ts/Props.ts"],"names":[],"mappings":""}
|
package/js/Subject.d.ts
CHANGED
|
@@ -1,8 +1,13 @@
|
|
|
1
1
|
export type Subscription = (() => void) & {
|
|
2
2
|
unsubscribe: () => any;
|
|
3
3
|
};
|
|
4
|
-
type Subscriber = () => any;
|
|
5
|
-
export
|
|
4
|
+
type Subscriber = (value?: any) => any;
|
|
5
|
+
export interface SubjectLike {
|
|
6
|
+
subscribe: (callback: (value?: any) => any) => any;
|
|
7
|
+
isSubject?: boolean;
|
|
8
|
+
}
|
|
9
|
+
export declare class Subject<T> implements SubjectLike {
|
|
10
|
+
isSubject: boolean;
|
|
6
11
|
subscribers: Subscriber[];
|
|
7
12
|
value?: any;
|
|
8
13
|
subscribe(callback: Subscriber): Subscription;
|
package/js/Subject.js
CHANGED
|
@@ -1,18 +1,23 @@
|
|
|
1
1
|
export class Subject {
|
|
2
|
+
isSubject = true;
|
|
2
3
|
subscribers = [];
|
|
3
4
|
value;
|
|
4
5
|
// unsubcount = 0 // 🔬 testing
|
|
5
6
|
subscribe(callback) {
|
|
6
7
|
this.subscribers.push(callback);
|
|
7
|
-
|
|
8
|
-
|
|
8
|
+
SubjectClass.globalSubs.push(callback); // 🔬 testing
|
|
9
|
+
SubjectClass.globalSubCount$.set(SubjectClass.globalSubCount$.value + 1);
|
|
9
10
|
const unsubscribe = () => {
|
|
10
|
-
|
|
11
|
-
removeSubFromArray(Subject.globalSubs, callback); // 🔬 testing
|
|
12
|
-
--Subject.globalSubCount;
|
|
11
|
+
unsubscribe.unsubscribe();
|
|
13
12
|
};
|
|
14
13
|
// Return a function to unsubscribe from the BehaviorSubject
|
|
15
|
-
unsubscribe.unsubscribe =
|
|
14
|
+
unsubscribe.unsubscribe = () => {
|
|
15
|
+
removeSubFromArray(this.subscribers, callback);
|
|
16
|
+
removeSubFromArray(SubjectClass.globalSubs, callback); // 🔬 testing
|
|
17
|
+
SubjectClass.globalSubCount$.set(SubjectClass.globalSubCount$.value - 1);
|
|
18
|
+
// any double unsubscribes will be ignored
|
|
19
|
+
unsubscribe.unsubscribe = () => undefined;
|
|
20
|
+
};
|
|
16
21
|
return unsubscribe;
|
|
17
22
|
}
|
|
18
23
|
set(value) {
|
|
@@ -31,8 +36,8 @@ function removeSubFromArray(subscribers, callback) {
|
|
|
31
36
|
subscribers.splice(index, 1);
|
|
32
37
|
}
|
|
33
38
|
}
|
|
34
|
-
;
|
|
35
|
-
|
|
36
|
-
;
|
|
37
|
-
|
|
39
|
+
const SubjectClass = Subject;
|
|
40
|
+
SubjectClass.globalSubs = []; // 🔬 for testing
|
|
41
|
+
SubjectClass.globalSubCount$ = new Subject(); // for ease of debugging
|
|
42
|
+
SubjectClass.globalSubCount$.set(0);
|
|
38
43
|
//# sourceMappingURL=Subject.js.map
|
package/js/Subject.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Subject.js","sourceRoot":"","sources":["../ts/Subject.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Subject.js","sourceRoot":"","sources":["../ts/Subject.ts"],"names":[],"mappings":"AAWA,MAAM,OAAO,OAAO;IAClB,SAAS,GAAG,IAAI,CAAA;IAChB,WAAW,GAAiB,EAAE,CAAA;IAC9B,KAAK,CAAM;IACX,+BAA+B;IAE/B,SAAS,CAAC,QAAoB;QAC5B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;QAC/B,YAAY,CAAC,UAAU,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA,CAAC,aAAa;QACpD,YAAY,CAAC,eAAe,CAAC,GAAG,CAAE,YAAY,CAAC,eAAe,CAAC,KAAK,GAAG,CAAC,CAAE,CAAA;QAE1E,MAAM,WAAW,GAAiB,GAAG,EAAE;YACrC,WAAW,CAAC,WAAW,EAAE,CAAA;QAC3B,CAAC,CAAA;QAED,4DAA4D;QAC5D,WAAW,CAAC,WAAW,GAAG,GAAG,EAAE;YAC7B,kBAAkB,CAAC,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAA;YAC9C,kBAAkB,CAAC,YAAY,CAAC,UAAU,EAAE,QAAQ,CAAC,CAAA,CAAC,aAAa;YACnE,YAAY,CAAC,eAAe,CAAC,GAAG,CAAE,YAAY,CAAC,eAAe,CAAC,KAAK,GAAG,CAAC,CAAE,CAAA;YAE1E,0CAA0C;YAC1C,WAAW,CAAC,WAAW,GAAG,GAAG,EAAE,CAAC,SAAS,CAAA;QAC3C,CAAC,CAAA;QAED,OAAO,WAAW,CAAA;IACpB,CAAC;IAED,GAAG,CAAC,KAAU;QACZ,IAAI,CAAC,KAAK,GAAG,KAAK,CAAA;QAElB,4CAA4C;QAC5C,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,QAAa,EAAE,EAAE;YACzC,QAAQ,CAAC,KAAK,GAAG,KAAK,CAAA;YACtB,QAAQ,CAAC,KAAK,CAAC,CAAA;QACjB,CAAC,CAAC,CAAA;IACJ,CAAC;IACD,IAAI,GAAG,IAAI,CAAC,GAAG,CAAA;CAChB;AAED,SAAS,kBAAkB,CACzB,WAAyB,EACzB,QAAoB;IAEpB,MAAM,KAAK,GAAG,WAAW,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAA;IAC3C,IAAI,KAAK,KAAK,CAAC,CAAC,EAAE,CAAC;QACjB,WAAW,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAA;IAC9B,CAAC;AACH,CAAC;AAED,MAAM,YAAY,GAAG,OAGpB,CAAA;AACD,YAAY,CAAC,UAAU,GAAG,EAAE,CAAA,CAAC,iBAAiB;AAC9C,YAAY,CAAC,eAAe,GAAG,IAAI,OAAO,EAAE,CAAA,CAAC,wBAAwB;AACrE,YAAY,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC,CAAC,CAAA"}
|
package/js/Tag.class.d.ts
CHANGED
|
@@ -1,45 +1,69 @@
|
|
|
1
1
|
import { TagSupport } from "./getTagSupport.js";
|
|
2
2
|
import { Provider } from "./providers.js";
|
|
3
3
|
import { Subscription } from "./Subject.js";
|
|
4
|
-
|
|
4
|
+
import { Counts } from "./interpolateTemplate.js";
|
|
5
|
+
import { State } from "./state.js";
|
|
6
|
+
import { InterpolatedTemplates } from "./interpolations.js";
|
|
7
|
+
export declare const variablePrefix = "__tagvar";
|
|
5
8
|
export declare const escapeVariable: string;
|
|
6
9
|
export declare const escapeSearch: RegExp;
|
|
7
10
|
export type Context = {
|
|
8
11
|
[index: string]: any;
|
|
9
12
|
};
|
|
13
|
+
export type TagMemory = Record<string, any> & {
|
|
14
|
+
context: Context;
|
|
15
|
+
state: State;
|
|
16
|
+
providers: Provider[];
|
|
17
|
+
};
|
|
18
|
+
export interface TagTemplate {
|
|
19
|
+
interpolation: InterpolatedTemplates;
|
|
20
|
+
string: string;
|
|
21
|
+
strings: string[];
|
|
22
|
+
values: unknown[];
|
|
23
|
+
context: Context;
|
|
24
|
+
}
|
|
10
25
|
export declare class Tag {
|
|
11
26
|
strings: string[];
|
|
12
27
|
values: any[];
|
|
13
|
-
|
|
28
|
+
isTag: boolean;
|
|
14
29
|
clones: (Element | Text | ChildNode)[];
|
|
15
30
|
cloneSubs: Subscription[];
|
|
16
31
|
children: Tag[];
|
|
17
32
|
tagSupport: TagSupport;
|
|
18
33
|
ownerTag?: Tag;
|
|
19
|
-
|
|
34
|
+
insertBefore?: Element;
|
|
35
|
+
appElement?: Element;
|
|
36
|
+
arrayValue?: unknown;
|
|
20
37
|
constructor(strings: string[], values: any[]);
|
|
21
|
-
providers: Provider[];
|
|
22
38
|
beforeRedraw(): void;
|
|
23
39
|
afterRender(): void;
|
|
24
40
|
/** Used for array, such as array.map(), calls aka array.map(x => html``.key(x)) */
|
|
25
|
-
key(arrayValue:
|
|
26
|
-
destroy(
|
|
41
|
+
key(arrayValue: unknown): this;
|
|
42
|
+
destroy(options?: DestroyOptions): Promise<number>;
|
|
27
43
|
destroySubscriptions(): void;
|
|
28
|
-
destroyClones(stagger?:
|
|
44
|
+
destroyClones({ stagger }?: DestroyOptions): Promise<number>;
|
|
29
45
|
updateByTag(tag: Tag): void;
|
|
30
46
|
lastTemplateString: string | undefined;
|
|
31
47
|
/** A method of passing down the same render method */
|
|
32
48
|
setSupport(tagSupport: TagSupport): void;
|
|
33
49
|
updateConfig(strings: string[], values: any[]): void;
|
|
34
|
-
getTemplate():
|
|
35
|
-
string: string;
|
|
36
|
-
strings: string[];
|
|
37
|
-
values: any[];
|
|
38
|
-
context: Context;
|
|
39
|
-
};
|
|
50
|
+
getTemplate(): TagTemplate;
|
|
40
51
|
isLikeTag(tag: Tag): boolean;
|
|
41
52
|
update(): Context;
|
|
42
53
|
updateValues(values: any[]): Context;
|
|
43
54
|
updateContext(context: Context): Context;
|
|
44
55
|
getAppElement(): Tag;
|
|
56
|
+
/** Used during HMR only where static content itself could have been edited */
|
|
57
|
+
rebuild(): void;
|
|
58
|
+
buildBeforeElement(insertBefore: Element, options?: ElementBuildOptions): (ChildNode | Element)[];
|
|
45
59
|
}
|
|
60
|
+
type DestroyOptions = {
|
|
61
|
+
stagger: number;
|
|
62
|
+
byParent?: boolean;
|
|
63
|
+
};
|
|
64
|
+
export type ElementBuildOptions = {
|
|
65
|
+
counts: Counts;
|
|
66
|
+
forceElement?: boolean;
|
|
67
|
+
};
|
|
68
|
+
export declare function processNewValue(hasValue: boolean, value: any, context: Context, variableName: string, tag: Tag): void;
|
|
69
|
+
export {};
|
package/js/Tag.class.js
CHANGED
|
@@ -1,30 +1,34 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { getTagSupport } from "./getTagSupport.js";
|
|
3
|
-
import { isTagComponent } from "./interpolateTemplate.js";
|
|
1
|
+
import { getSubjectFunction, setValueRedraw } from "./Tag.utils.js";
|
|
4
2
|
import { ValueSubject } from "./ValueSubject.js";
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
|
|
3
|
+
import { runAfterRender, runBeforeDestroy, runBeforeRedraw } from "./tagRunner.js";
|
|
4
|
+
import { isSubjectInstance, isTagComponent, isTagInstance } from "./isInstance.js";
|
|
5
|
+
import { buildClones } from "./render.js";
|
|
6
|
+
import { interpolateElement, interpolateString } from "./interpolateElement.js";
|
|
7
|
+
import { afterElmBuild } from "./interpolateTemplate.js";
|
|
8
|
+
import { elementDestroyCheck } from "./elementDestroyCheck.function.js";
|
|
9
|
+
import { updateExistingValue } from "./updateTag.utils.js";
|
|
10
|
+
export const variablePrefix = '__tagvar';
|
|
8
11
|
export const escapeVariable = '--' + variablePrefix + '--';
|
|
9
12
|
const prefixSearch = new RegExp(variablePrefix, 'g');
|
|
10
13
|
export const escapeSearch = new RegExp(escapeVariable, 'g');
|
|
11
14
|
export class Tag {
|
|
12
15
|
strings;
|
|
13
16
|
values;
|
|
14
|
-
|
|
17
|
+
isTag = true;
|
|
15
18
|
clones = []; // elements on document
|
|
16
19
|
cloneSubs = []; // subscriptions created by clones
|
|
17
20
|
children = []; // tags on me
|
|
18
21
|
tagSupport;
|
|
19
22
|
// only present when a child of a tag
|
|
20
23
|
ownerTag;
|
|
24
|
+
insertBefore;
|
|
25
|
+
appElement; // only seen on this.getAppElement().appElement
|
|
21
26
|
// present only when an array. Populated by this.key()
|
|
22
27
|
arrayValue;
|
|
23
28
|
constructor(strings, values) {
|
|
24
29
|
this.strings = strings;
|
|
25
30
|
this.values = values;
|
|
26
31
|
}
|
|
27
|
-
providers = [];
|
|
28
32
|
beforeRedraw() {
|
|
29
33
|
runBeforeRedraw(this.tagSupport, this);
|
|
30
34
|
}
|
|
@@ -36,27 +40,50 @@ export class Tag {
|
|
|
36
40
|
this.arrayValue = arrayValue;
|
|
37
41
|
return this;
|
|
38
42
|
}
|
|
39
|
-
destroy(
|
|
40
|
-
|
|
43
|
+
async destroy(options = {
|
|
44
|
+
stagger: 0,
|
|
45
|
+
byParent: false, // Only destroy clones of direct children
|
|
46
|
+
}) {
|
|
47
|
+
// the isComponent check maybe able to be removed
|
|
48
|
+
const isComponent = this.tagSupport ? true : false;
|
|
49
|
+
if (isComponent) {
|
|
50
|
+
runBeforeDestroy(this.tagSupport, this);
|
|
51
|
+
}
|
|
41
52
|
this.destroySubscriptions();
|
|
42
|
-
|
|
43
|
-
|
|
53
|
+
const promises = this.children.map((kid) => kid.destroy({ ...options, byParent: true }));
|
|
54
|
+
if (!options.byParent) {
|
|
55
|
+
options.stagger = await this.destroyClones(options);
|
|
44
56
|
}
|
|
45
|
-
|
|
57
|
+
if (this.ownerTag) {
|
|
58
|
+
this.ownerTag.children = this.ownerTag.children.filter(child => child !== this);
|
|
59
|
+
}
|
|
60
|
+
await Promise.all(promises);
|
|
61
|
+
return options.stagger;
|
|
46
62
|
}
|
|
47
63
|
destroySubscriptions() {
|
|
48
64
|
this.cloneSubs.forEach(cloneSub => cloneSub.unsubscribe());
|
|
49
65
|
this.cloneSubs.length = 0;
|
|
50
66
|
}
|
|
51
|
-
destroyClones(stagger =
|
|
52
|
-
|
|
67
|
+
async destroyClones({ stagger } = {
|
|
68
|
+
stagger: 0,
|
|
69
|
+
}) {
|
|
70
|
+
const promises = this.clones.reverse().map((clone, index) => {
|
|
53
71
|
let promise = Promise.resolve();
|
|
54
72
|
if (clone.ondestroy) {
|
|
55
73
|
promise = elementDestroyCheck(clone, stagger);
|
|
56
74
|
}
|
|
57
|
-
promise.then(() =>
|
|
75
|
+
promise.then(() => {
|
|
76
|
+
clone.parentNode?.removeChild(clone);
|
|
77
|
+
const ownerTag = this.ownerTag;
|
|
78
|
+
if (ownerTag) {
|
|
79
|
+
// Sometimes my clones were first registered to my owner, remove them
|
|
80
|
+
ownerTag.clones = ownerTag.clones.filter(compareClone => compareClone !== clone);
|
|
81
|
+
}
|
|
82
|
+
});
|
|
83
|
+
return promise;
|
|
58
84
|
});
|
|
59
|
-
|
|
85
|
+
await Promise.all(promises);
|
|
86
|
+
// this.clones.length = 0
|
|
60
87
|
return stagger;
|
|
61
88
|
}
|
|
62
89
|
updateByTag(tag) {
|
|
@@ -66,25 +93,35 @@ export class Tag {
|
|
|
66
93
|
lastTemplateString = undefined; // used to compare templates for updates
|
|
67
94
|
/** A method of passing down the same render method */
|
|
68
95
|
setSupport(tagSupport) {
|
|
69
|
-
this.tagSupport =
|
|
70
|
-
this.tagSupport.mutatingRender =
|
|
71
|
-
this.children.forEach(kid => kid.setSupport(tagSupport));
|
|
96
|
+
this.tagSupport = tagSupport;
|
|
97
|
+
this.tagSupport.mutatingRender = tagSupport.mutatingRender;
|
|
72
98
|
}
|
|
73
99
|
updateConfig(strings, values) {
|
|
74
100
|
this.strings = strings;
|
|
75
101
|
this.updateValues(values);
|
|
76
102
|
}
|
|
77
103
|
getTemplate() {
|
|
78
|
-
|
|
79
|
-
const string = this.lastTemplateString = this.strings.map((string, index) => {
|
|
104
|
+
const string = this.strings.map((string, index) => {
|
|
80
105
|
const safeString = string.replace(prefixSearch, escapeVariable);
|
|
81
106
|
const endString = safeString + (this.values.length > index ? `{${variablePrefix}${index}}` : '');
|
|
82
|
-
|
|
107
|
+
// const trimString = index === 0 || index === this.strings.length-1 ? endString.trim() : endString
|
|
108
|
+
const trimString = endString.replace(/>\s*/g, '>').replace(/\s*</g, '<');
|
|
109
|
+
return trimString;
|
|
83
110
|
}).join('');
|
|
84
|
-
|
|
111
|
+
const interpolation = interpolateString(string);
|
|
112
|
+
this.lastTemplateString = interpolation.string;
|
|
113
|
+
return {
|
|
114
|
+
interpolation,
|
|
115
|
+
// string,
|
|
116
|
+
string: interpolation.string,
|
|
117
|
+
strings: this.strings,
|
|
118
|
+
values: this.values,
|
|
119
|
+
context: this.tagSupport?.memory.context || {},
|
|
120
|
+
};
|
|
85
121
|
}
|
|
86
122
|
isLikeTag(tag) {
|
|
87
|
-
|
|
123
|
+
const { string } = tag.getTemplate();
|
|
124
|
+
if (string !== this.lastTemplateString) {
|
|
88
125
|
return false;
|
|
89
126
|
}
|
|
90
127
|
if (tag.values.length !== this.values.length) {
|
|
@@ -100,11 +137,12 @@ export class Tag {
|
|
|
100
137
|
}
|
|
101
138
|
return false;
|
|
102
139
|
}
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
this
|
|
106
|
-
|
|
107
|
-
|
|
140
|
+
const tag = value;
|
|
141
|
+
if (isTagInstance(tag) && isTagInstance(compareTo)) {
|
|
142
|
+
tag.ownerTag = this; // let children know I own them
|
|
143
|
+
this.children.push(tag); // record children I created
|
|
144
|
+
tag.lastTemplateString || tag.getTemplate().string; // ensure last template string is generated
|
|
145
|
+
if (tag.isLikeTag(compareTo)) {
|
|
108
146
|
return true;
|
|
109
147
|
}
|
|
110
148
|
return false;
|
|
@@ -117,11 +155,11 @@ export class Tag {
|
|
|
117
155
|
return false;
|
|
118
156
|
}
|
|
119
157
|
update() {
|
|
120
|
-
return this.updateContext(this.context);
|
|
158
|
+
return this.updateContext(this.tagSupport.memory.context);
|
|
121
159
|
}
|
|
122
160
|
updateValues(values) {
|
|
123
161
|
this.values = values;
|
|
124
|
-
return this.updateContext(this.context);
|
|
162
|
+
return this.updateContext(this.tagSupport.memory.context);
|
|
125
163
|
}
|
|
126
164
|
updateContext(context) {
|
|
127
165
|
this.strings.map((_string, index) => {
|
|
@@ -131,74 +169,10 @@ export class Tag {
|
|
|
131
169
|
// is something already there?
|
|
132
170
|
const existing = context[variableName];
|
|
133
171
|
if (existing) {
|
|
134
|
-
|
|
135
|
-
const ogTag = existing.value?.tag;
|
|
136
|
-
// handle already seen tag components
|
|
137
|
-
if (isTagComponent(value)) {
|
|
138
|
-
const latestProps = value.cloneProps;
|
|
139
|
-
const existingTag = existing.tag;
|
|
140
|
-
// previously was something else, now a tag component
|
|
141
|
-
if (!existing.tag) {
|
|
142
|
-
setValueRedraw(value, existing, this);
|
|
143
|
-
value.redraw(latestProps);
|
|
144
|
-
return;
|
|
145
|
-
}
|
|
146
|
-
const oldTagSetup = existingTag.tagSupport;
|
|
147
|
-
const tagSupport = value.tagSupport || oldTagSetup || getTagSupport(value);
|
|
148
|
-
const oldCloneProps = tagSupport.templater?.cloneProps;
|
|
149
|
-
const oldProps = tagSupport.templater?.props;
|
|
150
|
-
if (existingTag) {
|
|
151
|
-
const isCommonEqual = oldProps === undefined && oldProps === latestProps;
|
|
152
|
-
const equal = isCommonEqual || deepEqual(oldCloneProps, latestProps);
|
|
153
|
-
if (equal) {
|
|
154
|
-
return;
|
|
155
|
-
}
|
|
156
|
-
}
|
|
157
|
-
setValueRedraw(value, existing, this);
|
|
158
|
-
oldTagSetup.templater = value;
|
|
159
|
-
existing.value.tag = oldTagSetup.newest = value.redraw(latestProps);
|
|
160
|
-
return;
|
|
161
|
-
}
|
|
162
|
-
// handle already seen tags
|
|
163
|
-
if (ogTag) {
|
|
164
|
-
const tagSupport = ogTag.tagSupport;
|
|
165
|
-
const templater = value;
|
|
166
|
-
runBeforeRender(tagSupport, ogTag);
|
|
167
|
-
tagSupport.oldest.beforeRedraw();
|
|
168
|
-
const retag = templater.wrapper();
|
|
169
|
-
retag.tagSupport = tagSupport;
|
|
170
|
-
templater.newest = retag;
|
|
171
|
-
tagSupport.oldest.afterRender();
|
|
172
|
-
ogTag.updateByTag(retag);
|
|
173
|
-
existing.set(value);
|
|
174
|
-
return;
|
|
175
|
-
}
|
|
176
|
-
// now its a function
|
|
177
|
-
if (value instanceof Function) {
|
|
178
|
-
existing.set(bindSubjectFunction(value, this));
|
|
179
|
-
return;
|
|
180
|
-
}
|
|
181
|
-
existing.set(value); // let ValueSubject now of newest value
|
|
182
|
-
return;
|
|
183
|
-
}
|
|
184
|
-
// First time values below
|
|
185
|
-
if (isTagComponent(value)) {
|
|
186
|
-
const existing = context[variableName] = new ValueSubject(value);
|
|
187
|
-
setValueRedraw(value, existing, this);
|
|
188
|
-
return;
|
|
189
|
-
}
|
|
190
|
-
if (value instanceof Function) {
|
|
191
|
-
context[variableName] = getSubjectFunction(value, this);
|
|
192
|
-
return;
|
|
193
|
-
}
|
|
194
|
-
if (!hasValue) {
|
|
195
|
-
return; // more strings than values, stop here
|
|
196
|
-
}
|
|
197
|
-
if (value instanceof Tag) {
|
|
198
|
-
value.ownerTag = this;
|
|
199
|
-
this.children.push(value);
|
|
172
|
+
return updateExistingValue(existing, value, this, variableName);
|
|
200
173
|
}
|
|
201
|
-
|
|
174
|
+
// 🆕 First time values below
|
|
175
|
+
processNewValue(hasValue, value, context, variableName, this);
|
|
202
176
|
});
|
|
203
177
|
return context;
|
|
204
178
|
}
|
|
@@ -209,5 +183,65 @@ export class Tag {
|
|
|
209
183
|
}
|
|
210
184
|
return tag;
|
|
211
185
|
}
|
|
186
|
+
/** Used during HMR only where static content itself could have been edited */
|
|
187
|
+
rebuild() {
|
|
188
|
+
const insertBefore = this.insertBefore;
|
|
189
|
+
if (!insertBefore) {
|
|
190
|
+
const err = new Error('Cannot rebuild. Previous insertBefore element is not defined on tag');
|
|
191
|
+
err.tag = this;
|
|
192
|
+
throw err;
|
|
193
|
+
}
|
|
194
|
+
this.buildBeforeElement(insertBefore, {
|
|
195
|
+
forceElement: true,
|
|
196
|
+
counts: { added: 0, removed: 0 },
|
|
197
|
+
});
|
|
198
|
+
}
|
|
199
|
+
buildBeforeElement(insertBefore, options = {
|
|
200
|
+
forceElement: false,
|
|
201
|
+
counts: { added: 0, removed: 0 },
|
|
202
|
+
}) {
|
|
203
|
+
this.insertBefore = insertBefore;
|
|
204
|
+
const context = this.update();
|
|
205
|
+
const template = this.getTemplate();
|
|
206
|
+
// const ownerTag = this.ownerTag
|
|
207
|
+
const temporary = document.createElement('div');
|
|
208
|
+
temporary.id = 'tag-temp-holder';
|
|
209
|
+
// render content with a first child that we can know is our first element
|
|
210
|
+
temporary.innerHTML = `<template tag-wrap="22">${template.string}</template>`;
|
|
211
|
+
// const clonesBefore = this.clones.map(clone => clone)
|
|
212
|
+
const intClones = interpolateElement(temporary, context, template, this, // this.ownerTag || this,
|
|
213
|
+
{ forceElement: options.forceElement });
|
|
214
|
+
this.clones.length = 0;
|
|
215
|
+
const clones = buildClones(temporary, insertBefore);
|
|
216
|
+
this.clones.push(...clones);
|
|
217
|
+
if (intClones.length) {
|
|
218
|
+
this.clones = this.clones.filter(cloneFilter => !intClones.find(clone => clone === cloneFilter));
|
|
219
|
+
}
|
|
220
|
+
this.clones.forEach(clone => afterElmBuild(clone, options));
|
|
221
|
+
return this.clones;
|
|
222
|
+
}
|
|
223
|
+
}
|
|
224
|
+
export function processNewValue(hasValue, value, context, variableName, tag) {
|
|
225
|
+
if (isTagComponent(value)) {
|
|
226
|
+
const existing = context[variableName] = new ValueSubject(value);
|
|
227
|
+
setValueRedraw(value, existing, tag);
|
|
228
|
+
return;
|
|
229
|
+
}
|
|
230
|
+
if (value instanceof Function) {
|
|
231
|
+
context[variableName] = getSubjectFunction(value, tag);
|
|
232
|
+
return;
|
|
233
|
+
}
|
|
234
|
+
if (!hasValue) {
|
|
235
|
+
return; // more strings than values, stop here
|
|
236
|
+
}
|
|
237
|
+
if (isTagInstance(value)) {
|
|
238
|
+
value.ownerTag = tag;
|
|
239
|
+
tag.children.push(value);
|
|
240
|
+
}
|
|
241
|
+
if (isSubjectInstance(value)) {
|
|
242
|
+
context[variableName] = value;
|
|
243
|
+
return;
|
|
244
|
+
}
|
|
245
|
+
context[variableName] = new ValueSubject(value);
|
|
212
246
|
}
|
|
213
247
|
//# sourceMappingURL=Tag.class.js.map
|