@syndicate-lang/html2 - npm Package Compare versions

Comparing version 0.36.0 to 0.36.1

dist/syndicate-html2.es6.js

@@ -297,3 +297,3 @@ import * as __SYNDICATE__ from '@syndicate-lang/core';
 function template() {
-    let instance = null;
+    const instanceCache = new WeakMap();
     return (constantParts, ...variableParts) => {
@@ -305,7 +305,9 @@ let b = templateCache.get(constantParts);
         }
-        if (instance === null) {
-            instance = b.clone();
+        let i = instanceCache.get(constantParts);
+        if (i === void 0) {
+            i = b.clone();
+            instanceCache.set(constantParts, i);
         }
-        b.update(instance, variableParts);
-        return instance.container;
+        b.update(i, variableParts);
+        return i.container;
     };
@@ -312,0 +314,0 @@ }

dist/syndicate-html2.es6.min.js

@@ -1,2 +0,2 @@
-import*as e from"@syndicate-lang/core";import{randomId as t,Dataspace as n,Turn as r}from"@syndicate-lang/core";const a=t(8,!0),s=new RegExp(`x-${a}-(\\d+)-${a}-x`),o=new RegExp(`x-${a}-(\\d+)-${a}-x`,"g");function i(e){let t=null,n=0;const r=[],a=[];for(;null!==(t=o.exec(e));)r.push(e.substring(n,t.index)),a.push(parseInt(t[1],10)),n=o.lastIndex;return r.push(e.substring(n)),{constantParts:r,placeholders:a}}function l(e,t){const n=[];return function e(r){if(Array.isArray(r))r.forEach(e);else switch(typeof r){case"string":n.push(t?r.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;"):r);break;case"number":n.push(""+r);break;default:throw new Error("Cannot render Node in attribute context")}}(e),n}function c(e,t){let n=e[t[0]];for(let e=1;e<t.length;e++)n=n.childNodes[t[e]];return n}class u{constructor(e){this.variablePartIndex=e}reset(e,t){var n,r;if("nodeCount"in e){const a=e.nodeCount;null===(n=t.parentNode)||void 0===n||n.insertBefore(f(),t);for(let e=0;e<a;e++){const e=t.nextSibling;if(null===(r=t.parentNode)||void 0===r||r.removeChild(t),null===e)break;t=e}}e.nodeCount=0}act(e,t,n){var r;!function t(r){var a;if(Array.isArray(r))r.forEach(t);else{let t;switch(typeof r){case"string":t=document.createTextNode(r);break;case"number":t=document.createTextNode(""+r);break;case"object":if(null!==r&&"nodeType"in r){t=r;break}default:{let e;try{e=""+r}catch(t){e=r.toString()}t=document.createTextNode(`<ERROR: invalid HtmlFragment: ${e}>`);break}}null===(a=n.parentNode)||void 0===a||a.insertBefore(t,n),e.nodeCount++}}(t[this.variablePartIndex]),null===(r=n.parentNode)||void 0===r||r.removeChild(n)}}class h{constructor(e){this.variablePartIndex=e}reset(e,t){var n;(null!==(n=e.attrNames)&&void 0!==n?n:[]).forEach((e=>t.removeAttribute(e))),e.attrNames=[]}act(e,t,n){const r=document.createElement("template"),a=this.variablePartIndex;r.innerHTML=`<x-dummy ${l(t[a],!1).join("")}></x-dummy>`,Array.from(r.content.firstElementChild.attributes).forEach((t=>{e.attrNames.push(t.name),n.setAttribute(t.name,t.value)}))}}class d{constructor(e,t,n){this.attrName=e,this.constantParts=t,this.placeholders=n}reset(e,t){}act(e,t,n){const r=[this.constantParts[0]];this.placeholders.forEach(((e,n)=>{r.push(...l(t[e],!1)),r.push(this.constantParts[n+1])})),n.setAttribute(this.attrName,r.join(""))}}class v{constructor(e){this.actions=e}reset(e,t){this.actions.forEach(((n,r)=>{var a;const s=null!==(a=e[r])&&void 0!==a?a:e[r]={};n.reset(s,t)}))}act(e,t,n){this.actions.forEach(((r,a)=>{var s;const o=null!==(s=e[a])&&void 0!==s?s:e[a]={};r.act(o,t,n)}))}}class p{constructor(e){this.container=e,this.state={}}}function f(){return document.createElement("x-placeholder")}class m{constructor(e){this.template=document.createElement("template"),this.placeholderActions=[];const t=[];e.raw.forEach(((e,n)=>{n>0&&t.push(`x-${a}-${n-1}-${a}-x`),t.push(e)})),this.template.innerHTML=t.join(""),this.indexPlaceholders()}indexTextNode(e,t){var n,r;const{constantParts:a,placeholders:s}=i(null!==(n=e.textContent)&&void 0!==n?n:"");a.forEach(((t,n)=>{var r,a;n>0&&(null===(r=e.parentNode)||void 0===r||r.insertBefore(f(),e)),null===(a=e.parentNode)||void 0===a||a.insertBefore(document.createTextNode(t),e)}));const o=e.nextSibling;return null===(r=e.parentNode)||void 0===r||r.removeChild(e),s.forEach(((e,n)=>{const r=t.slice();r[r.length-1]+=2*n+1,this.placeholderActions.push({path:r,action:new u(e)})})),t[t.length-1]+=a.length+s.length,o}indexElement(e,t){const n=[];for(let t=0;t<e.attributes.length;t++){const r=e.attributes[t],a=r.name,o=a.match(s);if(null!==o){e.removeAttributeNode(r),t--;const a=parseInt(o[1],10);n.push(new h(a))}else{const{constantParts:e,placeholders:t}=i(r.value);1!==e.length&&n.push(new d(a,e,t))}}n.length&&this.placeholderActions.push({path:t.slice(),action:1===n.length?n[0]:new v(n)})}indexPlaceholders(){const e=[],t=n=>{e.push(0);let r=n.firstChild;for(;null!==r;){const n=r;switch(n.nodeType){case Node.TEXT_NODE:r=this.indexTextNode(n,e);break;case Node.ELEMENT_NODE:{const a=n;this.indexElement(a,e),t(a),r=a.nextSibling,e[e.length-1]++;break}default:r=n.nextSibling,e[e.length-1]++}}e.pop()};t(this.template.content)}clone(){return new p(Array.from(this.template.cloneNode(!0).content.childNodes))}update(e,t){this.placeholderActions.forEach((({path:t,action:n})=>{var r,a,s;const o=null!==(r=(a=e.state)[s=t.map((e=>""+e)).join(".")])&&void 0!==r?r:a[s]={};n.reset(o,c(e.container,t))})),this.placeholderActions.forEach((({path:n,action:r})=>{var a,s,o;const i=null!==(a=(s=e.state)[o=n.map((e=>""+e)).join(".")])&&void 0!==a?a:s[o]={};r.act(i,t,c(e.container,n))}))}}const g=new WeakMap;function b(){let e=null;return(t,...n)=>{let r=g.get(t);return void 0===r&&(r=new m(t),g.set(t,r)),null===e&&(e=r.clone()),r.update(e,n),e.container}}const N=e.Record.makeConstructor()(Symbol.for("LocationHash"),["hash"]);function E(t=n.local){!function(t){e.Dataspace._spawn((()=>{e.Turn.activeFacet.actor.name="LocationHashTracker",(t=>{const n=e.Turn.active.field("/","hashValue"),a=()=>{var e=decodeURIComponent(window.location.hash);e.length&&"#"===e[0]&&(e=e.slice(1)),n.value=e||"/"},s=r.activeFacet,o=()=>s.turn(a);window.addEventListener("hashchange",o),e.Turn.activeFacet.onStop((()=>{window.removeEventListener("hashchange",o)})),a(),e.Turn.active.assertDataflow((()=>({target:t(),assertion:N(n.value)}))),e.Turn.active.assertDataflow((()=>({target:t(),assertion:e.Observe({pattern:e.QuasiValue.finish(e.QuasiValue.ctor(N,e.QuasiValue.bind(e.QuasiValue._))),observer:e.Turn.ref({message:e=>{if(Array.isArray(e)){if("string"!=typeof e[0])return;const t=e[0];window.location.hash=t}}})})})))})((()=>t))}))}(t)}class w{get node(){return this._node}constructor(t,n){let a;this._node=null,this.callbacks=new Map,a="object"==typeof n?y(t,n):"function"==typeof t?t:()=>[t],this.facet=r.activeFacet;const s=this.facet.actor.atExit((()=>this.node.remove()));e.Turn.activeFacet.onStop((()=>{this.node.remove(),s()}));const o=b();e.Turn.active._dataflow((()=>{const e=a(o);if(1!==e.length)throw new Error("@syndicate-lang/html2: Expected exactly one node from template");if(null===this._node)this._node=e[0];else if(this._node!==e[0])throw new Error("@syndicate-lang/html2: Node generator is not stable")}))}get _nodeAsParent(){return this._node&&"querySelector"in this._node?this._node:null}get parent(){return this.node.parentNode}set parent(e){this.setParent(e)}setParent(e,t=document){return"string"==typeof e&&(e=t.querySelector(e)),this.node.parentNode!==e&&(null===e?this.node.remove():e.appendChild(this.node)),this}querySelector(e,t){var n;const r=null===(n=this._nodeAsParent)||void 0===n?void 0:n.querySelector(e);return r?new(null!=t?t:w)(r):null}querySelectorAll(e,t){var n;const r=null===(n=this._nodeAsParent)||void 0===n?void 0:n.querySelectorAll(e),a=[];return r&&r.forEach((e=>a.push(new(null!=t?t:w)(e)))),a}on(e,t){return this.addEventListener(e,t),this}once(e,t){return this.addEventListener(e,t,{once:!0}),this}off(e,t){return this.removeEventListener(e,t),this}addEventListener(e,t,n){if(null===t)return;let r=this.callbacks.get(e);if(void 0===r)r=new Map,this.callbacks.set(e,r);else if(r.has(t))return;const a={wrapped:"function"==typeof t?e=>this.facet.turn((()=>t(e))):e=>this.facet.turn((()=>t.handleEvent(e))),options:n};r.set(t,a),this.node.addEventListener(e,a.wrapped,n)}dispatchEvent(e){return this.node.dispatchEvent(e)}removeEventListener(e,t,n){if(null===t)return;const r=this.callbacks.get(e);if(void 0===r)return;const a=r.get(t);void 0!==a&&(this.node.removeEventListener(e,a.wrapped,n),r.delete(t),0===r.size&&this.callbacks.delete(e))}}class x extends w{constructor(t,n,r){super(t,n);const a="string"==typeof n?n:"string"==typeof r?r:"change",s=e.Turn.active.field("","value");this._value=s;const o=e.Turn.active.field(NaN,"valueAsNumber");this._valueAsNumber=o,"value"in this.node&&(this.on(a,(()=>this.readValues())),this.readValues(),e.Turn.active._dataflow((()=>{this.valueAsNumber=this._valueAsNumber.value})),e.Turn.active._dataflow((()=>{this.value=this._value.value})))}readValues(){var e,t;const n=this.node;this.suppressCycleWarning(),this._value.value=null!==(e=n.value)&&void 0!==e?e:"",this._valueAsNumber.value=null!==(t=n.valueAsNumber)&&void 0!==t?t:NaN}get value(){return this._value.value}set value(e){this.node.value=e,this._value.value=e}get valueAsNumber(){return this._valueAsNumber.value}set valueAsNumber(e){this.node.value=Number.isNaN(e)?"":""+e,this._valueAsNumber.value=e}suppressCycleWarning(){this._value.suppressCycleWarning(),this._valueAsNumber.suppressCycleWarning()}}function y(e,t){const n="string"==typeof e?document.querySelector(e):e;if(null===n)throw new Error("Cannot find template: "+e);const r=`return t => t\`${n.innerHTML.trim().split("`").join("\\`")}\``,a=Object.entries(t),s=a.map((e=>e[0])),o=a.map((e=>e[1]));return new Function(...s,r)(...o)}export{N as LocationHash,x as ValueWidget,w as Widget,E as boot,b as template,y as templateGenerator};
+import*as e from"@syndicate-lang/core";import{randomId as t,Dataspace as n,Turn as r}from"@syndicate-lang/core";const a=t(8,!0),s=new RegExp(`x-${a}-(\\d+)-${a}-x`),o=new RegExp(`x-${a}-(\\d+)-${a}-x`,"g");function i(e){let t=null,n=0;const r=[],a=[];for(;null!==(t=o.exec(e));)r.push(e.substring(n,t.index)),a.push(parseInt(t[1],10)),n=o.lastIndex;return r.push(e.substring(n)),{constantParts:r,placeholders:a}}function l(e,t){const n=[];return function e(r){if(Array.isArray(r))r.forEach(e);else switch(typeof r){case"string":n.push(t?r.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;"):r);break;case"number":n.push(""+r);break;default:throw new Error("Cannot render Node in attribute context")}}(e),n}function c(e,t){let n=e[t[0]];for(let e=1;e<t.length;e++)n=n.childNodes[t[e]];return n}class u{constructor(e){this.variablePartIndex=e}reset(e,t){var n,r;if("nodeCount"in e){const a=e.nodeCount;null===(n=t.parentNode)||void 0===n||n.insertBefore(f(),t);for(let e=0;e<a;e++){const e=t.nextSibling;if(null===(r=t.parentNode)||void 0===r||r.removeChild(t),null===e)break;t=e}}e.nodeCount=0}act(e,t,n){var r;!function t(r){var a;if(Array.isArray(r))r.forEach(t);else{let t;switch(typeof r){case"string":t=document.createTextNode(r);break;case"number":t=document.createTextNode(""+r);break;case"object":if(null!==r&&"nodeType"in r){t=r;break}default:{let e;try{e=""+r}catch(t){e=r.toString()}t=document.createTextNode(`<ERROR: invalid HtmlFragment: ${e}>`);break}}null===(a=n.parentNode)||void 0===a||a.insertBefore(t,n),e.nodeCount++}}(t[this.variablePartIndex]),null===(r=n.parentNode)||void 0===r||r.removeChild(n)}}class h{constructor(e){this.variablePartIndex=e}reset(e,t){var n;(null!==(n=e.attrNames)&&void 0!==n?n:[]).forEach((e=>t.removeAttribute(e))),e.attrNames=[]}act(e,t,n){const r=document.createElement("template"),a=this.variablePartIndex;r.innerHTML=`<x-dummy ${l(t[a],!1).join("")}></x-dummy>`,Array.from(r.content.firstElementChild.attributes).forEach((t=>{e.attrNames.push(t.name),n.setAttribute(t.name,t.value)}))}}class d{constructor(e,t,n){this.attrName=e,this.constantParts=t,this.placeholders=n}reset(e,t){}act(e,t,n){const r=[this.constantParts[0]];this.placeholders.forEach(((e,n)=>{r.push(...l(t[e],!1)),r.push(this.constantParts[n+1])})),n.setAttribute(this.attrName,r.join(""))}}class v{constructor(e){this.actions=e}reset(e,t){this.actions.forEach(((n,r)=>{var a;const s=null!==(a=e[r])&&void 0!==a?a:e[r]={};n.reset(s,t)}))}act(e,t,n){this.actions.forEach(((r,a)=>{var s;const o=null!==(s=e[a])&&void 0!==s?s:e[a]={};r.act(o,t,n)}))}}class p{constructor(e){this.container=e,this.state={}}}function f(){return document.createElement("x-placeholder")}class m{constructor(e){this.template=document.createElement("template"),this.placeholderActions=[];const t=[];e.raw.forEach(((e,n)=>{n>0&&t.push(`x-${a}-${n-1}-${a}-x`),t.push(e)})),this.template.innerHTML=t.join(""),this.indexPlaceholders()}indexTextNode(e,t){var n,r;const{constantParts:a,placeholders:s}=i(null!==(n=e.textContent)&&void 0!==n?n:"");a.forEach(((t,n)=>{var r,a;n>0&&(null===(r=e.parentNode)||void 0===r||r.insertBefore(f(),e)),null===(a=e.parentNode)||void 0===a||a.insertBefore(document.createTextNode(t),e)}));const o=e.nextSibling;return null===(r=e.parentNode)||void 0===r||r.removeChild(e),s.forEach(((e,n)=>{const r=t.slice();r[r.length-1]+=2*n+1,this.placeholderActions.push({path:r,action:new u(e)})})),t[t.length-1]+=a.length+s.length,o}indexElement(e,t){const n=[];for(let t=0;t<e.attributes.length;t++){const r=e.attributes[t],a=r.name,o=a.match(s);if(null!==o){e.removeAttributeNode(r),t--;const a=parseInt(o[1],10);n.push(new h(a))}else{const{constantParts:e,placeholders:t}=i(r.value);1!==e.length&&n.push(new d(a,e,t))}}n.length&&this.placeholderActions.push({path:t.slice(),action:1===n.length?n[0]:new v(n)})}indexPlaceholders(){const e=[],t=n=>{e.push(0);let r=n.firstChild;for(;null!==r;){const n=r;switch(n.nodeType){case Node.TEXT_NODE:r=this.indexTextNode(n,e);break;case Node.ELEMENT_NODE:{const a=n;this.indexElement(a,e),t(a),r=a.nextSibling,e[e.length-1]++;break}default:r=n.nextSibling,e[e.length-1]++}}e.pop()};t(this.template.content)}clone(){return new p(Array.from(this.template.cloneNode(!0).content.childNodes))}update(e,t){this.placeholderActions.forEach((({path:t,action:n})=>{var r,a,s;const o=null!==(r=(a=e.state)[s=t.map((e=>""+e)).join(".")])&&void 0!==r?r:a[s]={};n.reset(o,c(e.container,t))})),this.placeholderActions.forEach((({path:n,action:r})=>{var a,s,o;const i=null!==(a=(s=e.state)[o=n.map((e=>""+e)).join(".")])&&void 0!==a?a:s[o]={};r.act(i,t,c(e.container,n))}))}}const g=new WeakMap;function b(){const e=new WeakMap;return(t,...n)=>{let r=g.get(t);void 0===r&&(r=new m(t),g.set(t,r));let a=e.get(t);return void 0===a&&(a=r.clone(),e.set(t,a)),r.update(a,n),a.container}}const N=e.Record.makeConstructor()(Symbol.for("LocationHash"),["hash"]);function E(t=n.local){!function(t){e.Dataspace._spawn((()=>{e.Turn.activeFacet.actor.name="LocationHashTracker",(t=>{const n=e.Turn.active.field("/","hashValue"),a=()=>{var e=decodeURIComponent(window.location.hash);e.length&&"#"===e[0]&&(e=e.slice(1)),n.value=e||"/"},s=r.activeFacet,o=()=>s.turn(a);window.addEventListener("hashchange",o),e.Turn.activeFacet.onStop((()=>{window.removeEventListener("hashchange",o)})),a(),e.Turn.active.assertDataflow((()=>({target:t(),assertion:N(n.value)}))),e.Turn.active.assertDataflow((()=>({target:t(),assertion:e.Observe({pattern:e.QuasiValue.finish(e.QuasiValue.ctor(N,e.QuasiValue.bind(e.QuasiValue._))),observer:e.Turn.ref({message:e=>{if(Array.isArray(e)){if("string"!=typeof e[0])return;const t=e[0];window.location.hash=t}}})})})))})((()=>t))}))}(t)}class w{get node(){return this._node}constructor(t,n){let a;this._node=null,this.callbacks=new Map,a="object"==typeof n?y(t,n):"function"==typeof t?t:()=>[t],this.facet=r.activeFacet;const s=this.facet.actor.atExit((()=>this.node.remove()));e.Turn.activeFacet.onStop((()=>{this.node.remove(),s()}));const o=b();e.Turn.active._dataflow((()=>{const e=a(o);if(1!==e.length)throw new Error("@syndicate-lang/html2: Expected exactly one node from template");if(null===this._node)this._node=e[0];else if(this._node!==e[0])throw new Error("@syndicate-lang/html2: Node generator is not stable")}))}get _nodeAsParent(){return this._node&&"querySelector"in this._node?this._node:null}get parent(){return this.node.parentNode}set parent(e){this.setParent(e)}setParent(e,t=document){return"string"==typeof e&&(e=t.querySelector(e)),this.node.parentNode!==e&&(null===e?this.node.remove():e.appendChild(this.node)),this}querySelector(e,t){var n;const r=null===(n=this._nodeAsParent)||void 0===n?void 0:n.querySelector(e);return r?new(null!=t?t:w)(r):null}querySelectorAll(e,t){var n;const r=null===(n=this._nodeAsParent)||void 0===n?void 0:n.querySelectorAll(e),a=[];return r&&r.forEach((e=>a.push(new(null!=t?t:w)(e)))),a}on(e,t){return this.addEventListener(e,t),this}once(e,t){return this.addEventListener(e,t,{once:!0}),this}off(e,t){return this.removeEventListener(e,t),this}addEventListener(e,t,n){if(null===t)return;let r=this.callbacks.get(e);if(void 0===r)r=new Map,this.callbacks.set(e,r);else if(r.has(t))return;const a={wrapped:"function"==typeof t?e=>this.facet.turn((()=>t(e))):e=>this.facet.turn((()=>t.handleEvent(e))),options:n};r.set(t,a),this.node.addEventListener(e,a.wrapped,n)}dispatchEvent(e){return this.node.dispatchEvent(e)}removeEventListener(e,t,n){if(null===t)return;const r=this.callbacks.get(e);if(void 0===r)return;const a=r.get(t);void 0!==a&&(this.node.removeEventListener(e,a.wrapped,n),r.delete(t),0===r.size&&this.callbacks.delete(e))}}class x extends w{constructor(t,n,r){super(t,n);const a="string"==typeof n?n:"string"==typeof r?r:"change",s=e.Turn.active.field("","value");this._value=s;const o=e.Turn.active.field(NaN,"valueAsNumber");this._valueAsNumber=o,"value"in this.node&&(this.on(a,(()=>this.readValues())),this.readValues(),e.Turn.active._dataflow((()=>{this.valueAsNumber=this._valueAsNumber.value})),e.Turn.active._dataflow((()=>{this.value=this._value.value})))}readValues(){var e,t;const n=this.node;this.suppressCycleWarning(),this._value.value=null!==(e=n.value)&&void 0!==e?e:"",this._valueAsNumber.value=null!==(t=n.valueAsNumber)&&void 0!==t?t:NaN}get value(){return this._value.value}set value(e){this.node.value=e,this._value.value=e}get valueAsNumber(){return this._valueAsNumber.value}set valueAsNumber(e){this.node.value=Number.isNaN(e)?"":""+e,this._valueAsNumber.value=e}suppressCycleWarning(){this._value.suppressCycleWarning(),this._valueAsNumber.suppressCycleWarning()}}function y(e,t){const n="string"==typeof e?document.querySelector(e):e;if(null===n)throw new Error("Cannot find template: "+e);const r=`return t => t\`${n.innerHTML.trim().split("`").join("\\`")}\``,a=Object.entries(t),s=a.map((e=>e[0])),o=a.map((e=>e[1]));return new Function(...s,r)(...o)}export{N as LocationHash,x as ValueWidget,w as Widget,E as boot,b as template,y as templateGenerator};
 //# sourceMappingURL=syndicate-html2.es6.min.js.map

dist/syndicate-html2.js

@@ -320,3 +320,3 @@ (function (global, factory) {
     function template() {
-        let instance = null;
+        const instanceCache = new WeakMap();
         return (constantParts, ...variableParts) => {
@@ -328,7 +328,9 @@ let b = templateCache.get(constantParts);
             }
-            if (instance === null) {
-                instance = b.clone();
+            let i = instanceCache.get(constantParts);
+            if (i === void 0) {
+                i = b.clone();
+                instanceCache.set(constantParts, i);
             }
-            b.update(instance, variableParts);
-            return instance.container;
+            b.update(i, variableParts);
+            return i.container;
         };
@@ -335,0 +337,0 @@ }

dist/syndicate-html2.min.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@syndicate-lang/core")):"function"==typeof define&&define.amd?define(["exports","@syndicate-lang/core"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).SyndicateHtml2={},e.Syndicate)}(this,(function(e,t){"use strict";function n(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var r=n(t);const a=t.randomId(8,!0),s=new RegExp(`x-${a}-(\\d+)-${a}-x`),o=new RegExp(`x-${a}-(\\d+)-${a}-x`,"g");function i(e){let t=null,n=0;const r=[],a=[];for(;null!==(t=o.exec(e));)r.push(e.substring(n,t.index)),a.push(parseInt(t[1],10)),n=o.lastIndex;return r.push(e.substring(n)),{constantParts:r,placeholders:a}}function l(e,t){const n=[];return function e(r){if(Array.isArray(r))r.forEach(e);else switch(typeof r){case"string":n.push(t?r.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;"):r);break;case"number":n.push(""+r);break;default:throw new Error("Cannot render Node in attribute context")}}(e),n}function c(e,t){let n=e[t[0]];for(let e=1;e<t.length;e++)n=n.childNodes[t[e]];return n}class u{constructor(e){this.variablePartIndex=e}reset(e,t){var n,r;if("nodeCount"in e){const a=e.nodeCount;null===(n=t.parentNode)||void 0===n||n.insertBefore(f(),t);for(let e=0;e<a;e++){const e=t.nextSibling;if(null===(r=t.parentNode)||void 0===r||r.removeChild(t),null===e)break;t=e}}e.nodeCount=0}act(e,t,n){var r;!function t(r){var a;if(Array.isArray(r))r.forEach(t);else{let t;switch(typeof r){case"string":t=document.createTextNode(r);break;case"number":t=document.createTextNode(""+r);break;case"object":if(null!==r&&"nodeType"in r){t=r;break}default:{let e;try{e=""+r}catch(t){e=r.toString()}t=document.createTextNode(`<ERROR: invalid HtmlFragment: ${e}>`);break}}null===(a=n.parentNode)||void 0===a||a.insertBefore(t,n),e.nodeCount++}}(t[this.variablePartIndex]),null===(r=n.parentNode)||void 0===r||r.removeChild(n)}}class d{constructor(e){this.variablePartIndex=e}reset(e,t){var n;(null!==(n=e.attrNames)&&void 0!==n?n:[]).forEach((e=>t.removeAttribute(e))),e.attrNames=[]}act(e,t,n){const r=document.createElement("template"),a=this.variablePartIndex;r.innerHTML=`<x-dummy ${l(t[a],!1).join("")}></x-dummy>`,Array.from(r.content.firstElementChild.attributes).forEach((t=>{e.attrNames.push(t.name),n.setAttribute(t.name,t.value)}))}}class h{constructor(e,t,n){this.attrName=e,this.constantParts=t,this.placeholders=n}reset(e,t){}act(e,t,n){const r=[this.constantParts[0]];this.placeholders.forEach(((e,n)=>{r.push(...l(t[e],!1)),r.push(this.constantParts[n+1])})),n.setAttribute(this.attrName,r.join(""))}}class p{constructor(e){this.actions=e}reset(e,t){this.actions.forEach(((n,r)=>{var a;const s=null!==(a=e[r])&&void 0!==a?a:e[r]={};n.reset(s,t)}))}act(e,t,n){this.actions.forEach(((r,a)=>{var s;const o=null!==(s=e[a])&&void 0!==s?s:e[a]={};r.act(o,t,n)}))}}class v{constructor(e){this.container=e,this.state={}}}function f(){return document.createElement("x-placeholder")}class m{constructor(e){this.template=document.createElement("template"),this.placeholderActions=[];const t=[];e.raw.forEach(((e,n)=>{n>0&&t.push(`x-${a}-${n-1}-${a}-x`),t.push(e)})),this.template.innerHTML=t.join(""),this.indexPlaceholders()}indexTextNode(e,t){var n,r;const{constantParts:a,placeholders:s}=i(null!==(n=e.textContent)&&void 0!==n?n:"");a.forEach(((t,n)=>{var r,a;n>0&&(null===(r=e.parentNode)||void 0===r||r.insertBefore(f(),e)),null===(a=e.parentNode)||void 0===a||a.insertBefore(document.createTextNode(t),e)}));const o=e.nextSibling;return null===(r=e.parentNode)||void 0===r||r.removeChild(e),s.forEach(((e,n)=>{const r=t.slice();r[r.length-1]+=2*n+1,this.placeholderActions.push({path:r,action:new u(e)})})),t[t.length-1]+=a.length+s.length,o}indexElement(e,t){const n=[];for(let t=0;t<e.attributes.length;t++){const r=e.attributes[t],a=r.name,o=a.match(s);if(null!==o){e.removeAttributeNode(r),t--;const a=parseInt(o[1],10);n.push(new d(a))}else{const{constantParts:e,placeholders:t}=i(r.value);1!==e.length&&n.push(new h(a,e,t))}}n.length&&this.placeholderActions.push({path:t.slice(),action:1===n.length?n[0]:new p(n)})}indexPlaceholders(){const e=[],t=n=>{e.push(0);let r=n.firstChild;for(;null!==r;){const n=r;switch(n.nodeType){case Node.TEXT_NODE:r=this.indexTextNode(n,e);break;case Node.ELEMENT_NODE:{const a=n;this.indexElement(a,e),t(a),r=a.nextSibling,e[e.length-1]++;break}default:r=n.nextSibling,e[e.length-1]++}}e.pop()};t(this.template.content)}clone(){return new v(Array.from(this.template.cloneNode(!0).content.childNodes))}update(e,t){this.placeholderActions.forEach((({path:t,action:n})=>{var r,a,s;const o=null!==(r=(a=e.state)[s=t.map((e=>""+e)).join(".")])&&void 0!==r?r:a[s]={};n.reset(o,c(e.container,t))})),this.placeholderActions.forEach((({path:n,action:r})=>{var a,s,o;const i=null!==(a=(s=e.state)[o=n.map((e=>""+e)).join(".")])&&void 0!==a?a:s[o]={};r.act(i,t,c(e.container,n))}))}}const g=new WeakMap;function b(){let e=null;return(t,...n)=>{let r=g.get(t);return void 0===r&&(r=new m(t),g.set(t,r)),null===e&&(e=r.clone()),r.update(e,n),e.container}}const y=r.Record.makeConstructor()(Symbol.for("LocationHash"),["hash"]);class N{get node(){return this._node}constructor(e,n){let a;this._node=null,this.callbacks=new Map,a="object"==typeof n?E(e,n):"function"==typeof e?e:()=>[e],this.facet=t.Turn.activeFacet;const s=this.facet.actor.atExit((()=>this.node.remove()));r.Turn.activeFacet.onStop((()=>{this.node.remove(),s()}));const o=b();r.Turn.active._dataflow((()=>{const e=a(o);if(1!==e.length)throw new Error("@syndicate-lang/html2: Expected exactly one node from template");if(null===this._node)this._node=e[0];else if(this._node!==e[0])throw new Error("@syndicate-lang/html2: Node generator is not stable")}))}get _nodeAsParent(){return this._node&&"querySelector"in this._node?this._node:null}get parent(){return this.node.parentNode}set parent(e){this.setParent(e)}setParent(e,t=document){return"string"==typeof e&&(e=t.querySelector(e)),this.node.parentNode!==e&&(null===e?this.node.remove():e.appendChild(this.node)),this}querySelector(e,t){var n;const r=null===(n=this._nodeAsParent)||void 0===n?void 0:n.querySelector(e);return r?new(null!=t?t:N)(r):null}querySelectorAll(e,t){var n;const r=null===(n=this._nodeAsParent)||void 0===n?void 0:n.querySelectorAll(e),a=[];return r&&r.forEach((e=>a.push(new(null!=t?t:N)(e)))),a}on(e,t){return this.addEventListener(e,t),this}once(e,t){return this.addEventListener(e,t,{once:!0}),this}off(e,t){return this.removeEventListener(e,t),this}addEventListener(e,t,n){if(null===t)return;let r=this.callbacks.get(e);if(void 0===r)r=new Map,this.callbacks.set(e,r);else if(r.has(t))return;const a={wrapped:"function"==typeof t?e=>this.facet.turn((()=>t(e))):e=>this.facet.turn((()=>t.handleEvent(e))),options:n};r.set(t,a),this.node.addEventListener(e,a.wrapped,n)}dispatchEvent(e){return this.node.dispatchEvent(e)}removeEventListener(e,t,n){if(null===t)return;const r=this.callbacks.get(e);if(void 0===r)return;const a=r.get(t);void 0!==a&&(this.node.removeEventListener(e,a.wrapped,n),r.delete(t),0===r.size&&this.callbacks.delete(e))}}function E(e,t){const n="string"==typeof e?document.querySelector(e):e;if(null===n)throw new Error("Cannot find template: "+e);const r=`return t => t\`${n.innerHTML.trim().split("`").join("\\`")}\``,a=Object.entries(t),s=a.map((e=>e[0])),o=a.map((e=>e[1]));return new Function(...s,r)(...o)}e.LocationHash=y,e.ValueWidget=class extends N{constructor(e,t,n){super(e,t);const a="string"==typeof t?t:"string"==typeof n?n:"change",s=r.Turn.active.field("","value");this._value=s;const o=r.Turn.active.field(NaN,"valueAsNumber");this._valueAsNumber=o,"value"in this.node&&(this.on(a,(()=>this.readValues())),this.readValues(),r.Turn.active._dataflow((()=>{this.valueAsNumber=this._valueAsNumber.value})),r.Turn.active._dataflow((()=>{this.value=this._value.value})))}readValues(){var e,t;const n=this.node;this.suppressCycleWarning(),this._value.value=null!==(e=n.value)&&void 0!==e?e:"",this._valueAsNumber.value=null!==(t=n.valueAsNumber)&&void 0!==t?t:NaN}get value(){return this._value.value}set value(e){this.node.value=e,this._value.value=e}get valueAsNumber(){return this._valueAsNumber.value}set valueAsNumber(e){this.node.value=Number.isNaN(e)?"":""+e,this._valueAsNumber.value=e}suppressCycleWarning(){this._value.suppressCycleWarning(),this._valueAsNumber.suppressCycleWarning()}},e.Widget=N,e.boot=function(e=t.Dataspace.local){!function(e){r.Dataspace._spawn((()=>{r.Turn.activeFacet.actor.name="LocationHashTracker",(e=>{const n=r.Turn.active.field("/","hashValue"),a=()=>{var e=decodeURIComponent(window.location.hash);e.length&&"#"===e[0]&&(e=e.slice(1)),n.value=e||"/"},s=t.Turn.activeFacet,o=()=>s.turn(a);window.addEventListener("hashchange",o),r.Turn.activeFacet.onStop((()=>{window.removeEventListener("hashchange",o)})),a(),r.Turn.active.assertDataflow((()=>({target:e(),assertion:y(n.value)}))),r.Turn.active.assertDataflow((()=>({target:e(),assertion:r.Observe({pattern:r.QuasiValue.finish(r.QuasiValue.ctor(y,r.QuasiValue.bind(r.QuasiValue._))),observer:r.Turn.ref({message:e=>{if(Array.isArray(e)){if("string"!=typeof e[0])return;const t=e[0];window.location.hash=t}}})})})))})((()=>e))}))}(e)},e.template=b,e.templateGenerator=E,Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("@syndicate-lang/core")):"function"==typeof define&&define.amd?define(["exports","@syndicate-lang/core"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).SyndicateHtml2={},e.Syndicate)}(this,(function(e,t){"use strict";function n(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var r=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,r.get?r:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var r=n(t);const a=t.randomId(8,!0),s=new RegExp(`x-${a}-(\\d+)-${a}-x`),o=new RegExp(`x-${a}-(\\d+)-${a}-x`,"g");function i(e){let t=null,n=0;const r=[],a=[];for(;null!==(t=o.exec(e));)r.push(e.substring(n,t.index)),a.push(parseInt(t[1],10)),n=o.lastIndex;return r.push(e.substring(n)),{constantParts:r,placeholders:a}}function l(e,t){const n=[];return function e(r){if(Array.isArray(r))r.forEach(e);else switch(typeof r){case"string":n.push(t?r.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;"):r);break;case"number":n.push(""+r);break;default:throw new Error("Cannot render Node in attribute context")}}(e),n}function c(e,t){let n=e[t[0]];for(let e=1;e<t.length;e++)n=n.childNodes[t[e]];return n}class u{constructor(e){this.variablePartIndex=e}reset(e,t){var n,r;if("nodeCount"in e){const a=e.nodeCount;null===(n=t.parentNode)||void 0===n||n.insertBefore(f(),t);for(let e=0;e<a;e++){const e=t.nextSibling;if(null===(r=t.parentNode)||void 0===r||r.removeChild(t),null===e)break;t=e}}e.nodeCount=0}act(e,t,n){var r;!function t(r){var a;if(Array.isArray(r))r.forEach(t);else{let t;switch(typeof r){case"string":t=document.createTextNode(r);break;case"number":t=document.createTextNode(""+r);break;case"object":if(null!==r&&"nodeType"in r){t=r;break}default:{let e;try{e=""+r}catch(t){e=r.toString()}t=document.createTextNode(`<ERROR: invalid HtmlFragment: ${e}>`);break}}null===(a=n.parentNode)||void 0===a||a.insertBefore(t,n),e.nodeCount++}}(t[this.variablePartIndex]),null===(r=n.parentNode)||void 0===r||r.removeChild(n)}}class d{constructor(e){this.variablePartIndex=e}reset(e,t){var n;(null!==(n=e.attrNames)&&void 0!==n?n:[]).forEach((e=>t.removeAttribute(e))),e.attrNames=[]}act(e,t,n){const r=document.createElement("template"),a=this.variablePartIndex;r.innerHTML=`<x-dummy ${l(t[a],!1).join("")}></x-dummy>`,Array.from(r.content.firstElementChild.attributes).forEach((t=>{e.attrNames.push(t.name),n.setAttribute(t.name,t.value)}))}}class h{constructor(e,t,n){this.attrName=e,this.constantParts=t,this.placeholders=n}reset(e,t){}act(e,t,n){const r=[this.constantParts[0]];this.placeholders.forEach(((e,n)=>{r.push(...l(t[e],!1)),r.push(this.constantParts[n+1])})),n.setAttribute(this.attrName,r.join(""))}}class p{constructor(e){this.actions=e}reset(e,t){this.actions.forEach(((n,r)=>{var a;const s=null!==(a=e[r])&&void 0!==a?a:e[r]={};n.reset(s,t)}))}act(e,t,n){this.actions.forEach(((r,a)=>{var s;const o=null!==(s=e[a])&&void 0!==s?s:e[a]={};r.act(o,t,n)}))}}class v{constructor(e){this.container=e,this.state={}}}function f(){return document.createElement("x-placeholder")}class m{constructor(e){this.template=document.createElement("template"),this.placeholderActions=[];const t=[];e.raw.forEach(((e,n)=>{n>0&&t.push(`x-${a}-${n-1}-${a}-x`),t.push(e)})),this.template.innerHTML=t.join(""),this.indexPlaceholders()}indexTextNode(e,t){var n,r;const{constantParts:a,placeholders:s}=i(null!==(n=e.textContent)&&void 0!==n?n:"");a.forEach(((t,n)=>{var r,a;n>0&&(null===(r=e.parentNode)||void 0===r||r.insertBefore(f(),e)),null===(a=e.parentNode)||void 0===a||a.insertBefore(document.createTextNode(t),e)}));const o=e.nextSibling;return null===(r=e.parentNode)||void 0===r||r.removeChild(e),s.forEach(((e,n)=>{const r=t.slice();r[r.length-1]+=2*n+1,this.placeholderActions.push({path:r,action:new u(e)})})),t[t.length-1]+=a.length+s.length,o}indexElement(e,t){const n=[];for(let t=0;t<e.attributes.length;t++){const r=e.attributes[t],a=r.name,o=a.match(s);if(null!==o){e.removeAttributeNode(r),t--;const a=parseInt(o[1],10);n.push(new d(a))}else{const{constantParts:e,placeholders:t}=i(r.value);1!==e.length&&n.push(new h(a,e,t))}}n.length&&this.placeholderActions.push({path:t.slice(),action:1===n.length?n[0]:new p(n)})}indexPlaceholders(){const e=[],t=n=>{e.push(0);let r=n.firstChild;for(;null!==r;){const n=r;switch(n.nodeType){case Node.TEXT_NODE:r=this.indexTextNode(n,e);break;case Node.ELEMENT_NODE:{const a=n;this.indexElement(a,e),t(a),r=a.nextSibling,e[e.length-1]++;break}default:r=n.nextSibling,e[e.length-1]++}}e.pop()};t(this.template.content)}clone(){return new v(Array.from(this.template.cloneNode(!0).content.childNodes))}update(e,t){this.placeholderActions.forEach((({path:t,action:n})=>{var r,a,s;const o=null!==(r=(a=e.state)[s=t.map((e=>""+e)).join(".")])&&void 0!==r?r:a[s]={};n.reset(o,c(e.container,t))})),this.placeholderActions.forEach((({path:n,action:r})=>{var a,s,o;const i=null!==(a=(s=e.state)[o=n.map((e=>""+e)).join(".")])&&void 0!==a?a:s[o]={};r.act(i,t,c(e.container,n))}))}}const g=new WeakMap;function b(){const e=new WeakMap;return(t,...n)=>{let r=g.get(t);void 0===r&&(r=new m(t),g.set(t,r));let a=e.get(t);return void 0===a&&(a=r.clone(),e.set(t,a)),r.update(a,n),a.container}}const y=r.Record.makeConstructor()(Symbol.for("LocationHash"),["hash"]);class N{get node(){return this._node}constructor(e,n){let a;this._node=null,this.callbacks=new Map,a="object"==typeof n?E(e,n):"function"==typeof e?e:()=>[e],this.facet=t.Turn.activeFacet;const s=this.facet.actor.atExit((()=>this.node.remove()));r.Turn.activeFacet.onStop((()=>{this.node.remove(),s()}));const o=b();r.Turn.active._dataflow((()=>{const e=a(o);if(1!==e.length)throw new Error("@syndicate-lang/html2: Expected exactly one node from template");if(null===this._node)this._node=e[0];else if(this._node!==e[0])throw new Error("@syndicate-lang/html2: Node generator is not stable")}))}get _nodeAsParent(){return this._node&&"querySelector"in this._node?this._node:null}get parent(){return this.node.parentNode}set parent(e){this.setParent(e)}setParent(e,t=document){return"string"==typeof e&&(e=t.querySelector(e)),this.node.parentNode!==e&&(null===e?this.node.remove():e.appendChild(this.node)),this}querySelector(e,t){var n;const r=null===(n=this._nodeAsParent)||void 0===n?void 0:n.querySelector(e);return r?new(null!=t?t:N)(r):null}querySelectorAll(e,t){var n;const r=null===(n=this._nodeAsParent)||void 0===n?void 0:n.querySelectorAll(e),a=[];return r&&r.forEach((e=>a.push(new(null!=t?t:N)(e)))),a}on(e,t){return this.addEventListener(e,t),this}once(e,t){return this.addEventListener(e,t,{once:!0}),this}off(e,t){return this.removeEventListener(e,t),this}addEventListener(e,t,n){if(null===t)return;let r=this.callbacks.get(e);if(void 0===r)r=new Map,this.callbacks.set(e,r);else if(r.has(t))return;const a={wrapped:"function"==typeof t?e=>this.facet.turn((()=>t(e))):e=>this.facet.turn((()=>t.handleEvent(e))),options:n};r.set(t,a),this.node.addEventListener(e,a.wrapped,n)}dispatchEvent(e){return this.node.dispatchEvent(e)}removeEventListener(e,t,n){if(null===t)return;const r=this.callbacks.get(e);if(void 0===r)return;const a=r.get(t);void 0!==a&&(this.node.removeEventListener(e,a.wrapped,n),r.delete(t),0===r.size&&this.callbacks.delete(e))}}function E(e,t){const n="string"==typeof e?document.querySelector(e):e;if(null===n)throw new Error("Cannot find template: "+e);const r=`return t => t\`${n.innerHTML.trim().split("`").join("\\`")}\``,a=Object.entries(t),s=a.map((e=>e[0])),o=a.map((e=>e[1]));return new Function(...s,r)(...o)}e.LocationHash=y,e.ValueWidget=class extends N{constructor(e,t,n){super(e,t);const a="string"==typeof t?t:"string"==typeof n?n:"change",s=r.Turn.active.field("","value");this._value=s;const o=r.Turn.active.field(NaN,"valueAsNumber");this._valueAsNumber=o,"value"in this.node&&(this.on(a,(()=>this.readValues())),this.readValues(),r.Turn.active._dataflow((()=>{this.valueAsNumber=this._valueAsNumber.value})),r.Turn.active._dataflow((()=>{this.value=this._value.value})))}readValues(){var e,t;const n=this.node;this.suppressCycleWarning(),this._value.value=null!==(e=n.value)&&void 0!==e?e:"",this._valueAsNumber.value=null!==(t=n.valueAsNumber)&&void 0!==t?t:NaN}get value(){return this._value.value}set value(e){this.node.value=e,this._value.value=e}get valueAsNumber(){return this._valueAsNumber.value}set valueAsNumber(e){this.node.value=Number.isNaN(e)?"":""+e,this._valueAsNumber.value=e}suppressCycleWarning(){this._value.suppressCycleWarning(),this._valueAsNumber.suppressCycleWarning()}},e.Widget=N,e.boot=function(e=t.Dataspace.local){!function(e){r.Dataspace._spawn((()=>{r.Turn.activeFacet.actor.name="LocationHashTracker",(e=>{const n=r.Turn.active.field("/","hashValue"),a=()=>{var e=decodeURIComponent(window.location.hash);e.length&&"#"===e[0]&&(e=e.slice(1)),n.value=e||"/"},s=t.Turn.activeFacet,o=()=>s.turn(a);window.addEventListener("hashchange",o),r.Turn.activeFacet.onStop((()=>{window.removeEventListener("hashchange",o)})),a(),r.Turn.active.assertDataflow((()=>({target:e(),assertion:y(n.value)}))),r.Turn.active.assertDataflow((()=>({target:e(),assertion:r.Observe({pattern:r.QuasiValue.finish(r.QuasiValue.ctor(y,r.QuasiValue.bind(r.QuasiValue._))),observer:r.Turn.ref({message:e=>{if(Array.isArray(e)){if("string"!=typeof e[0])return;const t=e[0];window.location.hash=t}}})})})))})((()=>e))}))}(e)},e.template=b,e.templateGenerator=E,Object.defineProperty(e,"__esModule",{value:!0})}));
 //# sourceMappingURL=syndicate-html2.min.js.map

lib/html.js

@@ -296,3 +296,3 @@ /// SPDX-License-Identifier: GPL-3.0-or-later
 export function template() {
-    let instance = null;
+    const instanceCache = new WeakMap();
     return (constantParts, ...variableParts) => {
@@ -304,9 +304,11 @@ let b = templateCache.get(constantParts);
         }
-        if (instance === null) {
-            instance = b.clone();
+        let i = instanceCache.get(constantParts);
+        if (i === void 0) {
+            i = b.clone();
+            instanceCache.set(constantParts, i);
         }
-        b.update(instance, variableParts);
-        return instance.container;
+        b.update(i, variableParts);
+        return i.container;
     };
 }
 //# sourceMappingURL=html.js.map

package.json

 {
   "name": "@syndicate-lang/html2",
-  "version": "0.36.0",
+  "version": "0.36.1",
   "description": "DOM/HTML UI for Syndicate/JS",
@@ -36,3 +36,3 @@ "homepage": "https://github.com/syndicate-lang/syndicate-js/tree/main/packages/html2",
   },
-  "gitHead": "86538dad31e7a9b849d6108fc432654ddb1f7033"
+  "gitHead": "2d5bc9ba1e8d14fc3d382c8dfe4fb810321508e5"
 }

src/html.ts

@@ -311,3 +311,3 @@ /// SPDX-License-Identifier: GPL-3.0-or-later
 export function template(): HtmlTemplater {
-    let instance: HtmlFragmentInstance | null = null;
+    const instanceCache = new WeakMap<TemplateStringsArray, HtmlFragmentInstance>();
     return (constantParts, ... variableParts) => {
@@ -319,8 +319,10 @@ let b = templateCache.get(constantParts);
         }
-        if (instance === null) {
-            instance = b.clone();
+        let i = instanceCache.get(constantParts);
+        if (i === void 0) {
+            i = b.clone();
+            instanceCache.set(constantParts, i);
         }
-        b.update(instance, variableParts);
-        return instance.container;
+        b.update(i, variableParts);
+        return i.container;
     };
 }

test/html.test.ts

 /// SPDX-License-Identifier: GPL-3.0-or-later
 /// SPDX-FileCopyrightText: Copyright © 2024 Tony Garnock-Jones <[e-mail]>
 
-import { template } from '../src/html';
+import { HtmlTemplater, template } from '../src/html';
 import './test-utils';
@@ -92,2 +92,14 @@
 
+    it('should be callable multiple times with the same syntactic location', () => {
+        // Because the fixed portion of a template string, the TemplateStringsArray, is hashconsed
+        const v = () => 'aaa';
+        const ps = [() => '123', () => '234', () => '345'];
+        const expected = '<q><x t="aaa">123234345</x></q>';
+        const t = template();
+        const f = () => compareHTML(t`<q><x t="${v()}">${ps.map(p => p())}</x></q>`, expected);
+        f();
+        f();
+        f();
+    });
+
     it('should be callable multiple times with extra items', () => {
@@ -103,2 +115,39 @@ const v = () => 'aaa';
     });
+
+    it('should be reusable for supplying arguments to itself', () => {
+        const inner = (t: HtmlTemplater) => t`<i>middle</i>`;
+        const t = template();
+        compareHTML(t`<p>n${inner(t)}n</p>`, '<p>n<i>middle</i>n</p>');
+    });
+
+    it('should accept strings', () => {
+        const inner = (_t: HtmlTemplater) => `<i>middle</i>`;
+        const t = template();
+        compareHTML(t`<p>n${inner(t)}n</p>`, '<p>n&lt;i&gt;middle&lt;/i&gt;n</p>');
+    });
 });
+
+describe('template output node stability', () => {
+    it('should work for simple use of a template', () => {
+        const t = template();
+        let i = 0;
+        const p = () => t`<i>${i++}</i>`;
+        const n1 = p();
+        compareHTML(n1, '<i>0</i>');
+        const n2 = p();
+        compareHTML(n2, '<i>1</i>');
+        expect(n1).toBe(n2);
+    });
+
+    it('should work for reuse of a template', () => {
+        const t = template();
+        let i = 0;
+        const q = () => t`<b>${i++}</b>`;
+        const p = () => t`<i>${q()}</i>`;
+        const n1 = p();
+        compareHTML(n1, '<i><b>0</b></i>');
+        const n2 = p();
+        compareHTML(n2, '<i><b>1</b></i>');
+        expect(n1).toBe(n2);
+    });
+});

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

328785

increased by0.96%

Lines of code

2537

increased by2.09%

No dependency changes