uhtml - npm Package Compare versions

Comparing version 4.2.2 to 4.3.0

cjs/index.js

 'use strict';
 /*! (c) Andrea Giammarchi - MIT */
-
 const { Hole } = require('./rabbit.js');
 const { attr } = require('./handler.js');
+
 const render = (require('./render/hole.js'));
@@ -7,0 +7,0 @@

cjs/init.js

@@ -882,3 +882,2 @@ 'use strict';
 
-
   /** @typedef {import("./literals.js").Value} Value */
@@ -898,8 +897,8 @@
   /**
-   * Render with smart updates within a generic container.
-   * @template T
-   * @param {T} where the DOM node where to render content
-   * @param {(() => Hole) | Hole} what the hole to render
-   * @returns
-   */
+    * Render with smart updates within a generic container.
+    * @template T
+    * @param {T} where the DOM node where to render content
+    * @param {(() => Hole) | Hole} what the hole to render
+    * @returns
+    */
   var keyed$1 = (where, what) => {
@@ -915,2 +914,4 @@ const info = known.get(where) || set(known, where, cache$1(empty));
 
+  /*! (c) Andrea Giammarchi - MIT */
+
   /** @typedef {import("./literals.js").Cache} Cache */
@@ -917,0 +918,0 @@ /** @typedef {import("./literals.js").Target} Target */

cjs/keyed.js

 'use strict';
+/*! (c) Andrea Giammarchi - MIT */
+const { Hole, unroll } = require('./rabbit.js');
+const { attr } = require('./handler.js');
 const { cache } = require('./literals.js');
-const { Hole, unroll } = require('./rabbit.js');
 const { empty, set } = require('./utils.js');
 const { html, svg } = require('./index.js');
-const { attr } = require('./handler.js');
+
 const render = (require('./render/keyed.js'));
@@ -8,0 +10,0 @@

cjs/node.js

 'use strict';
 /*! (c) Andrea Giammarchi - MIT */
+const { attr } = require('./handler.js');
 
@@ -7,3 +8,2 @@ const create = (require('./creator.js'));
 const render = (require('./render/node.js'));
-const { attr } = require('./handler.js');
 
@@ -10,0 +10,0 @@ /** @typedef {import("./literals.js").DOMValue} DOMValue */

cjs/render/hole.js

 'use strict';
+const { unroll } = require('../rabbit.js');
 const { cache } = require('../literals.js');
-const { unroll } = require('../rabbit.js');
 const { empty, set } = require('../utils.js');
@@ -5,0 +5,0 @@

cjs/render/keyed.js

 'use strict';
+const { Hole, unroll } = require('../rabbit.js');
 const { cache } = require('../literals.js');
-const { Hole, unroll } = require('../rabbit.js');
 const { empty, set } = require('../utils.js');
@@ -10,8 +10,8 @@
 /**
- * Render with smart updates within a generic container.
- * @template T
- * @param {T} where the DOM node where to render content
- * @param {(() => Hole) | Hole} what the hole to render
- * @returns
- */
+  * Render with smart updates within a generic container.
+  * @template T
+  * @param {T} where the DOM node where to render content
+  * @param {(() => Hole) | Hole} what the hole to render
+  * @returns
+  */
 module.exports = (where, what) => {
@@ -18,0 +18,0 @@ const info = known.get(where) || set(known, where, cache(empty));

esm/index.js

 /*! (c) Andrea Giammarchi - MIT */
-
 import { Hole } from './rabbit.js';
 import { attr } from './handler.js';
+
 import render from './render/hole.js';
@@ -6,0 +6,0 @@

esm/init.js

@@ -881,3 +881,2 @@
 
-
   /** @typedef {import("./literals.js").Value} Value */
@@ -897,8 +896,8 @@
   /**
-   * Render with smart updates within a generic container.
-   * @template T
-   * @param {T} where the DOM node where to render content
-   * @param {(() => Hole) | Hole} what the hole to render
-   * @returns
-   */
+    * Render with smart updates within a generic container.
+    * @template T
+    * @param {T} where the DOM node where to render content
+    * @param {(() => Hole) | Hole} what the hole to render
+    * @returns
+    */
   var keyed$1 = (where, what) => {
@@ -914,2 +913,4 @@ const info = known.get(where) || set(known, where, cache$1(empty));
 
+  /*! (c) Andrea Giammarchi - MIT */
+
   /** @typedef {import("./literals.js").Cache} Cache */
@@ -916,0 +917,0 @@ /** @typedef {import("./literals.js").Target} Target */

esm/keyed.js

@@ -0,6 +1,8 @@
+/*! (c) Andrea Giammarchi - MIT */
+import { Hole, unroll } from './rabbit.js';
+import { attr } from './handler.js';
 import { cache } from './literals.js';
-import { Hole, unroll } from './rabbit.js';
 import { empty, set } from './utils.js';
 import { html, svg } from './index.js';
-import { attr } from './handler.js';
+
 import render from './render/keyed.js';
@@ -7,0 +9,0 @@

esm/node.js

 /*! (c) Andrea Giammarchi - MIT */
+import { attr } from './handler.js';
 
@@ -6,3 +7,2 @@ import create from './creator.js';
 import render from './render/node.js';
-import { attr } from './handler.js';
 
@@ -9,0 +9,0 @@ /** @typedef {import("./literals.js").DOMValue} DOMValue */

esm/render/hole.js

@@ -0,3 +1,3 @@
+import { unroll } from '../rabbit.js';
 import { cache } from '../literals.js';
-import { unroll } from '../rabbit.js';
 import { empty, set } from '../utils.js';
@@ -4,0 +4,0 @@

esm/render/keyed.js

@@ -0,3 +1,3 @@
+import { Hole, unroll } from '../rabbit.js';
 import { cache } from '../literals.js';
-import { Hole, unroll } from '../rabbit.js';
 import { empty, set } from '../utils.js';
@@ -9,8 +9,8 @@
 /**
- * Render with smart updates within a generic container.
- * @template T
- * @param {T} where the DOM node where to render content
- * @param {(() => Hole) | Hole} what the hole to render
- * @returns
- */
+  * Render with smart updates within a generic container.
+  * @template T
+  * @param {T} where the DOM node where to render content
+  * @param {(() => Hole) | Hole} what the hole to render
+  * @returns
+  */
 export default (where, what) => {
@@ -17,0 +17,0 @@ const info = known.get(where) || set(known, where, cache(empty));

init.js

 var e=e=>function(t){const{constructor:n}=e.createDocumentFragment(),{isArray:r}=Array,{getPrototypeOf:s,getOwnPropertyDescriptor:l}=Object,o=[],i=()=>e.createRange(),c=(e,t,n)=>(e.set(t,n),n),a=(e,t,n,r="")=>({t:e,p:t,u:n,n:r}),u=e=>({s:e,t:null,n:null,d:o}),{setPrototypeOf:h}=Object;let d;const f=({firstChild:e,lastChild:t},n)=>((e,t,n)=>(d||(d=i()),n?d.setStartAfter(e):d.setStartBefore(e),d.setEndAfter(t),d.deleteContents(),e))(e,t,n);let p=!1;const g=(e,t)=>p&&11===e.nodeType?1/t<0?t?f(e,!0):e.lastChild:t?e.valueOf():e.firstChild:e;class m extends((e=>{function t(e){return h(e,new.target.prototype)}return t.prototype=e.prototype,t})(n)){#e;#t;constructor(e){const t=[...e.childNodes];super(e),this.#e=t,this.#t=t.length,p=!0}get firstChild(){return this.#e[0]}get lastChild(){return this.#e.at(-1)}get parentNode(){return this.#e[0].parentNode}remove(){f(this,!1)}replaceWith(e){f(this,!0).replaceWith(e)}valueOf(){return this.childNodes.length!==this.#t&&this.replaceChildren(...this.#e),this}}const v=(e,t)=>t.reduceRight(x,e),x=(e,t)=>e.childNodes[t];var w=e=>(t,n)=>{const{c:r,e:s,l:l}=e(t,n),i=r.cloneNode(!0);let c,a,u=s.length,h=u?s.slice(0):o;for(;u--;){const{t:e,p:t,u:r,n:l}=s[u],d=t===a?c:c=v(i,a=t),f=8===e?r():r;h[u]={v:f(d,n[u],l,o),u:f,t:d,n:l}}return((e,t)=>({n:e,d:t}))(1===l?i.firstChild||c:new m(i),h)};const b=/^(?:plaintext|script|style|textarea|title|xmp)$/i,$=/^(?:area|base|br|col|embed|hr|img|input|keygen|link|menuitem|meta|param|source|track|wbr)$/i,y=/<([a-zA-Z0-9]+[a-zA-Z0-9:._-]*)([^>]*?)(\/?)>/g,C=/([^\s\\>"'=]+)\s*=\s*(['"]?)\x01/g,N=/[\x01\x02]/g;const A=(e,t,n)=>e.setAttribute(t,n),W=(e,t)=>e.removeAttribute(t),k=()=>z;let O;const M=(e,t,n)=>{n=n.slice(1),O||(O=new WeakMap);const s=O.get(e)||c(O,e,{});let l=s[n];return l&&l[0]&&e.removeEventListener(n,...l),l=r(t)?t:[t,!1],s[n]=l,l[0]&&e.addEventListener(n,...l),t};function E(e,t){const n=this.n||(this.n=e);switch(typeof t){case"string":case"number":case"boolean":n!==e&&n.replaceWith(this.n=e),this.n.data=t;break;case"object":case"undefined":null==t?(this.n=e).data="":this.n=t.valueOf(),n.replaceWith(this.n)}return t}const S=()=>E.bind({n:null}),T=(e,t,n)=>e[n]=t,B=(e,t,n)=>T(e,t,n.slice(1)),j=(e,t,n)=>null==t?(W(e,n),t):T(e,t,n),F=(e,t)=>("function"==typeof t?t(e):t.current=e,t),L=(e,t,n)=>(null==t?W(e,n):A(e,n,t),t),P=(e,t,n)=>(e.toggleAttribute(n.slice(1),t),t),z=(e,t,n,r)=>((e,t,n,r,s)=>{const l=n.length;let o=t.length,i=l,c=0,a=0,u=null;for(;c<o||a<i;)if(o===c){const t=i<l?a?r(n[a-1],-0).nextSibling:r(n[i-a],0):s;for(;a<i;)e.insertBefore(r(n[a++],1),t)}else if(i===a)for(;c<o;)u&&u.has(t[c])||e.removeChild(r(t[c],-1)),c++;else if(t[c]===n[a])c++,a++;else if(t[o-1]===n[i-1])o--,i--;else if(t[c]===n[i-1]&&n[a]===t[o-1]){const s=r(t[--o],-1).nextSibling;e.insertBefore(r(n[a++],1),r(t[c++],-1).nextSibling),e.insertBefore(r(n[--i],1),s),t[o]=n[i]}else{if(!u){u=new Map;let e=a;for(;e<i;)u.set(n[e],e++)}if(u.has(t[c])){const s=u.get(t[c]);if(a<s&&s<i){let l=c,h=1;for(;++l<o&&l<i&&u.get(t[l])===s+h;)h++;if(h>s-a){const l=r(t[c],0);for(;a<s;)e.insertBefore(r(n[a++],1),l)}else e.replaceChild(r(n[a++],1),r(t[c++],-1))}else c++}else e.removeChild(r(t[c++],-1))}return n})(e.parentNode,r,t.length?t:o,g,e),D=new Map([["aria",(e,t)=>{for(const n in t){const r=t[n],s="role"===n?n:`aria-${n}`;null==r?W(e,s):A(e,s,r)}return t}],["class",(e,t)=>j(e,t,null==t?"class":"className")],["data",(e,t)=>{const{dataset:n}=e;for(const e in t)null==t[e]?delete n[e]:n[e]=t[e];return t}],["ref",F],["style",(e,t)=>null==t?j(e,t,"style"):T(e.style,t,"cssText")]]),H=(e,t,n)=>{switch(t[0]){case".":return B;case"?":return P;case"@":return M;default:return n||"ownerSVGElement"in e?"ref"===t?F:L:D.get(t)||(t in e?t.startsWith("on")?T:((e,t)=>{let n;do{n=l(e,t)}while(!n&&(e=s(e)));return n})(e,t)?.set?j:L:L)}},R=(e,t)=>(e.textContent=null==t?"":t,t);let Z,G,V=e.createElement("template");var _=(t,n)=>{if(n)return Z||(Z=e.createElementNS("http://www.w3.org/2000/svg","svg"),G=i(),G.selectNodeContents(Z)),G.createContextualFragment(t);V.innerHTML=t;const{content:r}=V;return V=V.cloneNode(!1),r};const q=e=>{const t=[];let n;for(;n=e.parentNode;)t.push(t.indexOf.call(n.childNodes,e)),e=n;return t},I=(t,n,s)=>{const l=_(((e,t,n)=>{let r=0;return e.join("
").trim().replace(y,((e,t,r,s)=>`<${t}${r.replace(C,"=$2$1").trimEnd()}${s?n||$.test(t)?" /":`></${t}`:""}>`)).replace(N,(e=>"
"===e?`\x3c!--${t+r++}--\x3e`:t+r++))})(t,K,s),s),{length:i}=t;let u=!1,h=o;if(i>1){const t=e.createTreeWalker(l,129),o=[];let c=0,d=`${K}${c++}`;for(h=[];c<i;){const e=t.nextNode();if(8===e.nodeType){if(e.data===d){let t=r(n[c-1])?k:S;t===S?o.push(e):u=!0,h.push(a(8,q(e),t)),d=`${K}${c++}`}}else{let t;for(;e.hasAttribute(d);){t||(t=q(e));const n=e.getAttribute(d);h.push(a(2,t,H(e,n,s),n)),W(e,d),d=`${K}${c++}`}b.test(e.localName)&&e.textContent.trim()===`\x3c!--${d}--\x3e`&&(h.push(a(3,t||q(e),R)),d=`${K}${c++}`)}}for(c=0;c<o.length;c++)o[c].replaceWith(e.createTextNode(""))}const d=l.childNodes.length;return c(J,t,((e,t,n)=>({c:e,e:t,l:n}))(l,h,1===d&&u?0:d))},J=new WeakMap,K="isµ";var Q=e=>(t,n)=>J.get(t)||I(t,n,e);const U=w(Q(!1)),X=w(Q(!0)),Y=(e,{s:t,t:n,v:r})=>{r.length&&e.s===o&&(e.s=[]);const s=ee(e,r);if(e.t!==n){const{n:s,d:l}=(t?X:U)(n,r);e.t=n,e.n=s,e.d=l}else{const{d:t}=e;for(let e=0;e<s;e++){const n=r[e],s=t[e],{v:l}=s;if(n!==l){const{u:e,t:t,n:r}=s;s.v=e(t,n,r,l)}}}return e.n},ee=({s:e},t)=>{const{length:n}=t;for(let s=0;s<n;s++){const n=t[s];n instanceof te?t[s]=Y(e[s]||(e[s]=u(o)),n):r(n)?ee(e[s]||(e[s]=u([])),n):e[s]=null}return n<e.length&&e.splice(n),n};class te{constructor(e,t,n){this.s=e,this.t=t,this.v=n}}
-/*! (c) Andrea Giammarchi - MIT */const ne=e=>(t,...n)=>new te(e,t,n),re=ne(!1),se=ne(!0),le=new WeakMap;const oe=new WeakMap,ie=e=>(t,n)=>{const r=oe.get(t)||c(oe,t,new Map);return r.get(n)||c(r,n,function(t,...n){return Y(this,new te(e,t,n))}.bind(u(o)))},ce=ie(!1),ae=ie(!0);return t.Hole=te,t.attr=D,t.html=re,t.htmlFor=ce,t.render=(e,t)=>{const n=le.get(e)||c(le,e,u(o)),r="function"==typeof t?t():t,{n:s}=n,l=r instanceof te?Y(n,r):r;return s!==l&&e.replaceChildren(n.n=l),e},t.svg=se,t.svgFor=ae,t}({});export{e as default};
+/*! (c) Andrea Giammarchi - MIT */const ne=e=>(t,...n)=>new te(e,t,n),re=ne(!1),se=ne(!0),le=new WeakMap;
+/*! (c) Andrea Giammarchi - MIT */
+const oe=new WeakMap,ie=e=>(t,n)=>{const r=oe.get(t)||c(oe,t,new Map);return r.get(n)||c(r,n,function(t,...n){return Y(this,new te(e,t,n))}.bind(u(o)))},ce=ie(!1),ae=ie(!0);return t.Hole=te,t.attr=D,t.html=re,t.htmlFor=ce,t.render=(e,t)=>{const n=le.get(e)||c(le,e,u(o)),r="function"==typeof t?t():t,{n:s}=n,l=r instanceof te?Y(n,r):r;return s!==l&&e.replaceChildren(n.n=l),e},t.svg=se,t.svgFor=ae,t}({});export{e as default};

keyed.js

 const{isArray:e}=Array,{getPrototypeOf:t,getOwnPropertyDescriptor:n}=Object,s=[],r=()=>document.createRange(),l=(e,t,n)=>(e.set(t,n),n),o=(e,t,n,s="")=>({t:e,p:t,u:n,n:s}),i=e=>({s:e,t:null,n:null,d:s}),{setPrototypeOf:c}=Object;let a;const u=({firstChild:e,lastChild:t},n)=>((e,t,n)=>(a||(a=r()),n?a.setStartAfter(e):a.setStartBefore(e),a.setEndAfter(t),a.deleteContents(),e))(e,t,n);let h=!1;const d=(e,t)=>h&&11===e.nodeType?1/t<0?t?u(e,!0):e.lastChild:t?e.valueOf():e.firstChild:e;class f extends((e=>{function t(e){return c(e,new.target.prototype)}return t.prototype=e.prototype,t})(DocumentFragment)){#e;#t;constructor(e){const t=[...e.childNodes];super(e),this.#e=t,this.#t=t.length,h=!0}get firstChild(){return this.#e[0]}get lastChild(){return this.#e.at(-1)}get parentNode(){return this.#e[0].parentNode}remove(){u(this,!1)}replaceWith(e){u(this,!0).replaceWith(e)}valueOf(){return this.childNodes.length!==this.#t&&this.replaceChildren(...this.#e),this}}const p=(e,t)=>t.reduceRight(g,e),g=(e,t)=>e.childNodes[t];var m=e=>(t,n)=>{const{c:r,e:l,l:o}=e(t,n),i=r.cloneNode(!0);let c,a,u=l.length,h=u?l.slice(0):s;for(;u--;){const{t:e,p:t,u:r,n:o}=l[u],d=t===a?c:c=p(i,a=t),f=8===e?r():r;h[u]={v:f(d,n[u],o,s),u:f,t:d,n:o}}return((e,t)=>({n:e,d:t}))(1===o?i.firstChild||c:new f(i),h)};const x=/^(?:plaintext|script|style|textarea|title|xmp)$/i,v=/^(?:area|base|br|col|embed|hr|img|input|keygen|link|menuitem|meta|param|source|track|wbr)$/i,w=/<([a-zA-Z0-9]+[a-zA-Z0-9:._-]*)([^>]*?)(\/?)>/g,b=/([^\s\\>"'=]+)\s*=\s*(['"]?)\x01/g,$=/[\x01\x02]/g;const y=(e,t,n)=>e.setAttribute(t,n),C=(e,t)=>e.removeAttribute(t),N=()=>L;let A;const W=(t,n,s)=>{s=s.slice(1),A||(A=new WeakMap);const r=A.get(t)||l(A,t,{});let o=r[s];return o&&o[0]&&t.removeEventListener(s,...o),o=e(n)?n:[n,!1],r[s]=o,o[0]&&t.addEventListener(s,...o),n};function k(e,t){const n=this.n||(this.n=e);switch(typeof t){case"string":case"number":case"boolean":n!==e&&n.replaceWith(this.n=e),this.n.data=t;break;case"object":case"undefined":null==t?(this.n=e).data="":this.n=t.valueOf(),n.replaceWith(this.n)}return t}const O=()=>k.bind({n:null}),M=(e,t,n)=>e[n]=t,E=(e,t,n)=>M(e,t,n.slice(1)),S=(e,t,n)=>null==t?(C(e,n),t):M(e,t,n),T=(e,t)=>("function"==typeof t?t(e):t.current=e,t),B=(e,t,n)=>(null==t?C(e,n):y(e,n,t),t),j=(e,t,n)=>(e.toggleAttribute(n.slice(1),t),t),L=(e,t,n,r)=>((e,t,n,s,r)=>{const l=n.length;let o=t.length,i=l,c=0,a=0,u=null;for(;c<o||a<i;)if(o===c){const t=i<l?a?s(n[a-1],-0).nextSibling:s(n[i-a],0):r;for(;a<i;)e.insertBefore(s(n[a++],1),t)}else if(i===a)for(;c<o;)u&&u.has(t[c])||e.removeChild(s(t[c],-1)),c++;else if(t[c]===n[a])c++,a++;else if(t[o-1]===n[i-1])o--,i--;else if(t[c]===n[i-1]&&n[a]===t[o-1]){const r=s(t[--o],-1).nextSibling;e.insertBefore(s(n[a++],1),s(t[c++],-1).nextSibling),e.insertBefore(s(n[--i],1),r),t[o]=n[i]}else{if(!u){u=new Map;let e=a;for(;e<i;)u.set(n[e],e++)}if(u.has(t[c])){const r=u.get(t[c]);if(a<r&&r<i){let l=c,h=1;for(;++l<o&&l<i&&u.get(t[l])===r+h;)h++;if(h>r-a){const l=s(t[c],0);for(;a<r;)e.insertBefore(s(n[a++],1),l)}else e.replaceChild(s(n[a++],1),s(t[c++],-1))}else c++}else e.removeChild(s(t[c++],-1))}return n})(e.parentNode,r,t.length?t:s,d,e),P=new Map([["aria",(e,t)=>{for(const n in t){const s=t[n],r="role"===n?n:`aria-${n}`;null==s?C(e,r):y(e,r,s)}return t}],["class",(e,t)=>S(e,t,null==t?"class":"className")],["data",(e,t)=>{const{dataset:n}=e;for(const e in t)null==t[e]?delete n[e]:n[e]=t[e];return t}],["ref",T],["style",(e,t)=>null==t?S(e,t,"style"):M(e.style,t,"cssText")]]),z=(e,s,r)=>{switch(s[0]){case".":return E;case"?":return j;case"@":return W;default:return r||"ownerSVGElement"in e?"ref"===s?T:B:P.get(s)||(s in e?s.startsWith("on")?M:((e,s)=>{let r;do{r=n(e,s)}while(!r&&(e=t(e)));return r})(e,s)?.set?S:B:B)}},D=(e,t)=>(e.textContent=null==t?"":t,t);let F,R,Z=document.createElement("template");var G=(e,t)=>{if(t)return F||(F=document.createElementNS("http://www.w3.org/2000/svg","svg"),R=r(),R.selectNodeContents(F)),R.createContextualFragment(e);Z.innerHTML=e;const{content:n}=Z;return Z=Z.cloneNode(!1),n};const H=e=>{const t=[];let n;for(;n=e.parentNode;)t.push(t.indexOf.call(n.childNodes,e)),e=n;return t},V=(t,n,r)=>{const i=G(((e,t,n)=>{let s=0;return e.join("
").trim().replace(w,((e,t,s,r)=>`<${t}${s.replace(b,"=$2$1").trimEnd()}${r?n||v.test(t)?" /":`></${t}`:""}>`)).replace($,(e=>"
"===e?`\x3c!--${t+s++}--\x3e`:t+s++))})(t,q,r),r),{length:c}=t;let a=!1,u=s;if(c>1){const t=document.createTreeWalker(i,129),s=[];let l=0,h=`${q}${l++}`;for(u=[];l<c;){const i=t.nextNode();if(8===i.nodeType){if(i.data===h){let t=e(n[l-1])?N:O;t===O?s.push(i):a=!0,u.push(o(8,H(i),t)),h=`${q}${l++}`}}else{let e;for(;i.hasAttribute(h);){e||(e=H(i));const t=i.getAttribute(h);u.push(o(2,e,z(i,t,r),t)),C(i,h),h=`${q}${l++}`}x.test(i.localName)&&i.textContent.trim()===`\x3c!--${h}--\x3e`&&(u.push(o(3,e||H(i),D)),h=`${q}${l++}`)}}for(l=0;l<s.length;l++)s[l].replaceWith(document.createTextNode(""))}const h=i.childNodes.length;return l(_,t,((e,t,n)=>({c:e,e:t,l:n}))(i,u,1===h&&a?0:h))},_=new WeakMap,q="isµ";var I=e=>(t,n)=>_.get(t)||V(t,n,e);const J=m(I(!1)),K=m(I(!0)),Q=(e,{s:t,t:n,v:r})=>{r.length&&e.s===s&&(e.s=[]);const l=U(e,r);if(e.t!==n){const{n:s,d:l}=(t?K:J)(n,r);e.t=n,e.n=s,e.d=l}else{const{d:t}=e;for(let e=0;e<l;e++){const n=r[e],s=t[e],{v:l}=s;if(n!==l){const{u:e,t:t,n:r}=s;s.v=e(t,n,r,l)}}}return e.n},U=({s:t},n)=>{const{length:r}=n;for(let l=0;l<r;l++){const r=n[l];r instanceof X?n[l]=Q(t[l]||(t[l]=i(s)),r):e(r)?U(t[l]||(t[l]=i([])),r):t[l]=null}return r<t.length&&t.splice(r),r};class X{constructor(e,t,n){this.s=e,this.t=t,this.v=n}}
-/*! (c) Andrea Giammarchi - MIT */const Y=e=>(t,...n)=>new X(e,t,n),ee=Y(!1),te=Y(!0),ne=new WeakMap;var se=(e,t)=>{const n=ne.get(e)||l(ne,e,i(s)),r="function"==typeof t?t():t,{n:o}=n,c=r instanceof X?Q(n,r):r;return o!==c&&e.replaceChildren(n.n=c),e};const re=new WeakMap,le=e=>(t,n)=>{const r=re.get(t)||l(re,t,new Map);return r.get(n)||l(r,n,function(t,...n){return Q(this,new X(e,t,n))}.bind(i(s)))},oe=le(!1),ie=le(!0);export{X as Hole,P as attr,ee as html,oe as htmlFor,se as render,te as svg,ie as svgFor};
+/*! (c) Andrea Giammarchi - MIT */const Y=e=>(t,...n)=>new X(e,t,n),ee=Y(!1),te=Y(!0),ne=new WeakMap;var se=(e,t)=>{const n=ne.get(e)||l(ne,e,i(s)),r="function"==typeof t?t():t,{n:o}=n,c=r instanceof X?Q(n,r):r;return o!==c&&e.replaceChildren(n.n=c),e};
+/*! (c) Andrea Giammarchi - MIT */const re=new WeakMap,le=e=>(t,n)=>{const r=re.get(t)||l(re,t,new Map);return r.get(n)||l(r,n,function(t,...n){return Q(this,new X(e,t,n))}.bind(i(s)))},oe=le(!1),ie=le(!0);export{X as Hole,P as attr,ee as html,oe as htmlFor,se as render,te as svg,ie as svgFor};

node.js

@@ -1,3 +0,3 @@
-const{setPrototypeOf:e}=Object;const{isArray:t}=Array,{getPrototypeOf:n,getOwnPropertyDescriptor:r}=Object,s=[],l=()=>document.createRange(),o=(e,t,n)=>(e.set(t,n),n);let i;const c=({firstChild:e,lastChild:t},n)=>((e,t,n)=>(i||(i=l()),n?i.setStartAfter(e):i.setStartBefore(e),i.setEndAfter(t),i.deleteContents(),e))(e,t,n);let a=!1;const u=(e,t)=>a&&11===e.nodeType?1/t<0?t?c(e,!0):e.lastChild:t?e.valueOf():e.firstChild:e;class h extends((t=>{function n(t){return e(t,new.target.prototype)}return n.prototype=t.prototype,n})(DocumentFragment)){#e;#t;constructor(e){const t=[...e.childNodes];super(e),this.#e=t,this.#t=t.length,a=!0}get firstChild(){return this.#e[0]}get lastChild(){return this.#e.at(-1)}get parentNode(){return this.#e[0].parentNode}remove(){c(this,!1)}replaceWith(e){c(this,!0).replaceWith(e)}valueOf(){return this.childNodes.length!==this.#t&&this.replaceChildren(...this.#e),this}}const d=(e,t,n,r="")=>({t:e,p:t,u:n,n:r}),f=(e,t)=>t.reduceRight(p,e),p=(e,t)=>e.childNodes[t];const g=/^(?:plaintext|script|style|textarea|title|xmp)$/i,m=/^(?:area|base|br|col|embed|hr|img|input|keygen|link|menuitem|meta|param|source|track|wbr)$/i,x=/<([a-zA-Z0-9]+[a-zA-Z0-9:._-]*)([^>]*?)(\/?)>/g,b=/([^\s\\>"'=]+)\s*=\s*(['"]?)\x01/g,$=/[\x01\x02]/g;const y=(e,t,n)=>e.setAttribute(t,n),C=(e,t)=>e.removeAttribute(t),N=()=>M;let v;const w=(e,n,r)=>{r=r.slice(1),v||(v=new WeakMap);const s=v.get(e)||o(v,e,{});let l=s[r];return l&&l[0]&&e.removeEventListener(r,...l),l=t(n)?n:[n,!1],s[r]=l,l[0]&&e.addEventListener(r,...l),n};function A(e,t){const n=this.n||(this.n=e);switch(typeof t){case"string":case"number":case"boolean":n!==e&&n.replaceWith(this.n=e),this.n.data=t;break;case"object":case"undefined":null==t?(this.n=e).data="":this.n=t.valueOf(),n.replaceWith(this.n)}return t}const O=()=>A.bind({n:null}),W=(e,t,n)=>e[n]=t,k=(e,t,n)=>W(e,t,n.slice(1)),E=(e,t,n)=>null==t?(C(e,n),t):W(e,t,n),S=(e,t)=>("function"==typeof t?t(e):t.current=e,t),T=(e,t,n)=>(null==t?C(e,n):y(e,n,t),t),B=(e,t,n)=>(e.toggleAttribute(n.slice(1),t),t),M=(e,t,n,r)=>((e,t,n,r,s)=>{const l=n.length;let o=t.length,i=l,c=0,a=0,u=null;for(;c<o||a<i;)if(o===c){const t=i<l?a?r(n[a-1],-0).nextSibling:r(n[i-a],0):s;for(;a<i;)e.insertBefore(r(n[a++],1),t)}else if(i===a)for(;c<o;)u&&u.has(t[c])||e.removeChild(r(t[c],-1)),c++;else if(t[c]===n[a])c++,a++;else if(t[o-1]===n[i-1])o--,i--;else if(t[c]===n[i-1]&&n[a]===t[o-1]){const s=r(t[--o],-1).nextSibling;e.insertBefore(r(n[a++],1),r(t[c++],-1).nextSibling),e.insertBefore(r(n[--i],1),s),t[o]=n[i]}else{if(!u){u=new Map;let e=a;for(;e<i;)u.set(n[e],e++)}if(u.has(t[c])){const s=u.get(t[c]);if(a<s&&s<i){let l=c,h=1;for(;++l<o&&l<i&&u.get(t[l])===s+h;)h++;if(h>s-a){const l=r(t[c],0);for(;a<s;)e.insertBefore(r(n[a++],1),l)}else e.replaceChild(r(n[a++],1),r(t[c++],-1))}else c++}else e.removeChild(r(t[c++],-1))}return n})(e.parentNode,r,t.length?t:s,u,e),j=new Map([["aria",(e,t)=>{for(const n in t){const r=t[n],s="role"===n?n:`aria-${n}`;null==r?C(e,s):y(e,s,r)}return t}],["class",(e,t)=>E(e,t,null==t?"class":"className")],["data",(e,t)=>{const{dataset:n}=e;for(const e in t)null==t[e]?delete n[e]:n[e]=t[e];return t}],["ref",S],["style",(e,t)=>null==t?E(e,t,"style"):W(e.style,t,"cssText")]]),L=(e,t,s)=>{switch(t[0]){case".":return k;case"?":return B;case"@":return w;default:return s||"ownerSVGElement"in e?"ref"===t?S:T:j.get(t)||(t in e?t.startsWith("on")?W:((e,t)=>{let s;do{s=r(e,t)}while(!s&&(e=n(e)));return s})(e,t)?.set?E:T:T)}},P=(e,t)=>(e.textContent=null==t?"":t,t);let z,D,F=document.createElement("template");var R=(e,t)=>{if(t)return z||(z=document.createElementNS("http://www.w3.org/2000/svg","svg"),D=l(),D.selectNodeContents(z)),D.createContextualFragment(e);F.innerHTML=e;const{content:n}=F;return F=F.cloneNode(!1),n};const Z=e=>{const t=[];let n;for(;n=e.parentNode;)t.push(t.indexOf.call(n.childNodes,e)),e=n;return t},G=(e,n,r)=>{const l=R(((e,t,n)=>{let r=0;return e.join("
").trim().replace(x,((e,t,r,s)=>`<${t}${r.replace(b,"=$2$1").trimEnd()}${s?n||m.test(t)?" /":`></${t}`:""}>`)).replace($,(e=>"
"===e?`\x3c!--${t+r++}--\x3e`:t+r++))})(e,V,r),r),{length:i}=e;let c=!1,a=s;if(i>1){const e=document.createTreeWalker(l,129),s=[];let o=0,u=`${V}${o++}`;for(a=[];o<i;){const l=e.nextNode();if(8===l.nodeType){if(l.data===u){let e=t(n[o-1])?N:O;e===O?s.push(l):c=!0,a.push(d(8,Z(l),e)),u=`${V}${o++}`}}else{let e;for(;l.hasAttribute(u);){e||(e=Z(l));const t=l.getAttribute(u);a.push(d(2,e,L(l,t,r),t)),C(l,u),u=`${V}${o++}`}g.test(l.localName)&&l.textContent.trim()===`\x3c!--${u}--\x3e`&&(a.push(d(3,e||Z(l),P)),u=`${V}${o++}`)}}for(o=0;o<s.length;o++)s[o].replaceWith(document.createTextNode(""))}const u=l.childNodes.length;return o(H,e,((e,t,n)=>({c:e,e:t,l:n}))(l,a,1===u&&c?0:u))},H=new WeakMap,V="isµ";var _=(e,t)=>(e.replaceChildren("function"==typeof t?t():t),e);
+const{isArray:e}=Array,{getPrototypeOf:t,getOwnPropertyDescriptor:n}=Object,r=[],s=()=>document.createRange(),l=(e,t,n)=>(e.set(t,n),n),{setPrototypeOf:o}=Object;let i;const c=({firstChild:e,lastChild:t},n)=>((e,t,n)=>(i||(i=s()),n?i.setStartAfter(e):i.setStartBefore(e),i.setEndAfter(t),i.deleteContents(),e))(e,t,n);let a=!1;const u=(e,t)=>a&&11===e.nodeType?1/t<0?t?c(e,!0):e.lastChild:t?e.valueOf():e.firstChild:e;class h extends((e=>{function t(e){return o(e,new.target.prototype)}return t.prototype=e.prototype,t})(DocumentFragment)){#e;#t;constructor(e){const t=[...e.childNodes];super(e),this.#e=t,this.#t=t.length,a=!0}get firstChild(){return this.#e[0]}get lastChild(){return this.#e.at(-1)}get parentNode(){return this.#e[0].parentNode}remove(){c(this,!1)}replaceWith(e){c(this,!0).replaceWith(e)}valueOf(){return this.childNodes.length!==this.#t&&this.replaceChildren(...this.#e),this}}const d=(e,t,n,r="")=>({t:e,p:t,u:n,n:r}),f=(e,t,n)=>e.setAttribute(t,n),p=(e,t)=>e.removeAttribute(t),g=()=>O;let m;const x=(t,n,r)=>{r=r.slice(1),m||(m=new WeakMap);const s=m.get(t)||l(m,t,{});let o=s[r];return o&&o[0]&&t.removeEventListener(r,...o),o=e(n)?n:[n,!1],s[r]=o,o[0]&&t.addEventListener(r,...o),n};function b(e,t){const n=this.n||(this.n=e);switch(typeof t){case"string":case"number":case"boolean":n!==e&&n.replaceWith(this.n=e),this.n.data=t;break;case"object":case"undefined":null==t?(this.n=e).data="":this.n=t.valueOf(),n.replaceWith(this.n)}return t}const $=()=>b.bind({n:null}),y=(e,t,n)=>e[n]=t,C=(e,t,n)=>y(e,t,n.slice(1)),N=(e,t,n)=>null==t?(p(e,n),t):y(e,t,n),v=(e,t)=>("function"==typeof t?t(e):t.current=e,t),w=(e,t,n)=>(null==t?p(e,n):f(e,n,t),t),A=(e,t,n)=>(e.toggleAttribute(n.slice(1),t),t),O=(e,t,n,s)=>((e,t,n,r,s)=>{const l=n.length;let o=t.length,i=l,c=0,a=0,u=null;for(;c<o||a<i;)if(o===c){const t=i<l?a?r(n[a-1],-0).nextSibling:r(n[i-a],0):s;for(;a<i;)e.insertBefore(r(n[a++],1),t)}else if(i===a)for(;c<o;)u&&u.has(t[c])||e.removeChild(r(t[c],-1)),c++;else if(t[c]===n[a])c++,a++;else if(t[o-1]===n[i-1])o--,i--;else if(t[c]===n[i-1]&&n[a]===t[o-1]){const s=r(t[--o],-1).nextSibling;e.insertBefore(r(n[a++],1),r(t[c++],-1).nextSibling),e.insertBefore(r(n[--i],1),s),t[o]=n[i]}else{if(!u){u=new Map;let e=a;for(;e<i;)u.set(n[e],e++)}if(u.has(t[c])){const s=u.get(t[c]);if(a<s&&s<i){let l=c,h=1;for(;++l<o&&l<i&&u.get(t[l])===s+h;)h++;if(h>s-a){const l=r(t[c],0);for(;a<s;)e.insertBefore(r(n[a++],1),l)}else e.replaceChild(r(n[a++],1),r(t[c++],-1))}else c++}else e.removeChild(r(t[c++],-1))}return n})(e.parentNode,s,t.length?t:r,u,e),W=new Map([["aria",(e,t)=>{for(const n in t){const r=t[n],s="role"===n?n:`aria-${n}`;null==r?p(e,s):f(e,s,r)}return t}],["class",(e,t)=>N(e,t,null==t?"class":"className")],["data",(e,t)=>{const{dataset:n}=e;for(const e in t)null==t[e]?delete n[e]:n[e]=t[e];return t}],["ref",v],["style",(e,t)=>null==t?N(e,t,"style"):y(e.style,t,"cssText")]]),k=(e,r,s)=>{switch(r[0]){case".":return C;case"?":return A;case"@":return x;default:return s||"ownerSVGElement"in e?"ref"===r?v:w:W.get(r)||(r in e?r.startsWith("on")?y:((e,r)=>{let s;do{s=n(e,r)}while(!s&&(e=t(e)));return s})(e,r)?.set?N:w:w)}},E=(e,t)=>(e.textContent=null==t?"":t,t),S=(e,t)=>t.reduceRight(T,e),T=(e,t)=>e.childNodes[t];const B=/^(?:plaintext|script|style|textarea|title|xmp)$/i,M=/^(?:area|base|br|col|embed|hr|img|input|keygen|link|menuitem|meta|param|source|track|wbr)$/i,j=/<([a-zA-Z0-9]+[a-zA-Z0-9:._-]*)([^>]*?)(\/?)>/g,L=/([^\s\\>"'=]+)\s*=\s*(['"]?)\x01/g,P=/[\x01\x02]/g;let z,D,F=document.createElement("template");var R=(e,t)=>{if(t)return z||(z=document.createElementNS("http://www.w3.org/2000/svg","svg"),D=s(),D.selectNodeContents(z)),D.createContextualFragment(e);F.innerHTML=e;const{content:n}=F;return F=F.cloneNode(!1),n};const Z=e=>{const t=[];let n;for(;n=e.parentNode;)t.push(t.indexOf.call(n.childNodes,e)),e=n;return t},G=(t,n,s)=>{const o=R(((e,t,n)=>{let r=0;return e.join("
").trim().replace(j,((e,t,r,s)=>`<${t}${r.replace(L,"=$2$1").trimEnd()}${s?n||M.test(t)?" /":`></${t}`:""}>`)).replace(P,(e=>"
"===e?`\x3c!--${t+r++}--\x3e`:t+r++))})(t,V,s),s),{length:i}=t;let c=!1,a=r;if(i>1){const t=document.createTreeWalker(o,129),r=[];let l=0,u=`${V}${l++}`;for(a=[];l<i;){const o=t.nextNode();if(8===o.nodeType){if(o.data===u){let t=e(n[l-1])?g:$;t===$?r.push(o):c=!0,a.push(d(8,Z(o),t)),u=`${V}${l++}`}}else{let e;for(;o.hasAttribute(u);){e||(e=Z(o));const t=o.getAttribute(u);a.push(d(2,e,k(o,t,s),t)),p(o,u),u=`${V}${l++}`}B.test(o.localName)&&o.textContent.trim()===`\x3c!--${u}--\x3e`&&(a.push(d(3,e||Z(o),E)),u=`${V}${l++}`)}}for(l=0;l<r.length;l++)r[l].replaceWith(document.createTextNode(""))}const u=o.childNodes.length;return l(H,t,((e,t,n)=>({c:e,e:t,l:n}))(o,a,1===u&&c?0:u))},H=new WeakMap,V="isµ";var _=(e,t)=>(e.replaceChildren("function"==typeof t?t():t),e);
 /*! (c) Andrea Giammarchi - MIT */
-const q=e=>{const t=(e=>(t,n)=>{const{c:r,e:l,l:o}=e(t,n),i=r.cloneNode(!0);let c,a,u=l.length,d=u?l.slice(0):s;for(;u--;){const{t:e,p:t,u:r,n:o}=l[u],h=t===a?c:c=f(i,a=t),p=8===e?r():r;d[u]={v:p(h,n[u],o,s),u:p,t:h,n:o}}return{n:1===o?i.firstChild||c:new h(i),d:d}})((n=e,(e,t)=>H.get(e)||G(e,t,n)));var n;return(e,...n)=>t(e,n).n},I=q(!1),J=q(!0);export{j as attr,I as html,_ as render,J as svg};
+const q=e=>{const t=(e=>(t,n)=>{const{c:s,e:l,l:o}=e(t,n),i=s.cloneNode(!0);let c,a,u=l.length,d=u?l.slice(0):r;for(;u--;){const{t:e,p:t,u:s,n:o}=l[u],h=t===a?c:c=S(i,a=t),f=8===e?s():s;d[u]={v:f(h,n[u],o,r),u:f,t:h,n:o}}return{n:1===o?i.firstChild||c:new h(i),d:d}})((n=e,(e,t)=>H.get(e)||G(e,t,n)));var n;return(e,...n)=>t(e,n).n},I=q(!1),J=q(!0);export{W as attr,I as html,_ as render,J as svg};

package.json

 {
   "name": "uhtml",
-  "version": "4.2.2",
+  "version": "4.3.0",
   "description": "A micro HTML/SVG render",
@@ -14,3 +14,3 @@ "main": "./cjs/index.js",
     "server": "npx static-handler .",
-    "size": "echo \"index $(cat index.js | brotli | wc -c)\";echo \"keyed $(cat keyed.js | brotli | wc -c)\";echo \"node  $(cat node.js | brotli | wc -c)\";",
+    "size": "echo \"index $(cat index.js | brotli | wc -c)\";echo \"keyed $(cat keyed.js | brotli | wc -c)\";echo \"reactive $(cat reactive.js | brotli | wc -c)\";echo \"preactive $(cat preactive.js | brotli | wc -c)\";echo \"node  $(cat node.js | brotli | wc -c)\";",
     "test": "c8 node test/coverage.js",
@@ -63,2 +63,12 @@ "coverage": "mkdir -p ./coverage; c8 report --reporter=text-lcov > ./coverage/lcov.info",
     },
+    "./reactive": {
+      "types": "./types/reactive.d.ts",
+      "import": "./esm/reactive.js",
+      "default": "./cjs/reactive.js"
+    },
+    "./preactive": {
+      "types": "./types/reactive/preact.d.ts",
+      "import": "./esm/reactive/preact.js",
+      "default": "./cjs/reactive/preact.js"
+    },
     "./package.json": "./package.json"
@@ -71,2 +81,3 @@ },
     "domconstants": "^1.1.6",
+    "gc-hook": "^0.3.0",
     "html-escaper": "^3.0.3",
@@ -83,3 +94,6 @@ "htmlparser2": "^9.0.0",
   },
-  "homepage": "https://github.com/WebReflection/uhtml#readme"
+  "homepage": "https://github.com/WebReflection/uhtml#readme",
+  "optionalDependencies": {
+    "@preact/signals-core": "^1.5.1"
+  }
 }

README.md

@@ -21,9 +21,11 @@ # <em>µ</em>html
 
-  * `uhtml` as default `{ Hole, render, html, svg, attr }` with smart auto-keyed nodes - read [keyed or not ?](https://webreflection.github.io/uhtml/#keyed-or-not-) paragraph to know more
-  * `uhtml/keyed` with extras `{ Hole, render, html, svg, htmlFor, svgFor, attr }`, providing keyed utilities - read [keyed or not ?](https://webreflection.github.io/uhtml/#keyed-or-not-) paragraph to know more
-  * `uhtml/node` with *same default* exports but it's for *one-off* nodes creation only so that no cache or updates are available and it's just an easy way to hook *uhtml* into your existing project for DOM creation (not manipulation!)
-  * `uhtml/init` which returns a `document => uhtml/keyed` utility that can be bootstrapped with `uhtml/dom`, [LinkeDOM](https://github.com/WebReflection/linkedom), [JSDOM](https://github.com/jsdom/jsdom) for either *SSR* or *Workers* support
-  * `uhtml/dom` which returns a specialized *uhtml* compliant DOM environment that can be passed to the `uhtml/init` export to have 100% same-thing running on both client or Web Worker / Server. This entry exports `{ Document, DOMParser }` where the former can be used to create a new *document* while the latter one can parse well formed HTML or SVG content and return the document out of the box.
+  * **uhtml** as default `{ Hole, render, html, svg, attr }` with smart auto-keyed nodes - read [keyed or not ?](https://webreflection.github.io/uhtml/#keyed-or-not-) paragraph to know more
+  * **uhtml/keyed** with extras `{ Hole, render, html, svg, htmlFor, svgFor, attr }`, providing keyed utilities - read [keyed or not ?](https://webreflection.github.io/uhtml/#keyed-or-not-) paragraph to know more
+  * **uhtml/node** with *same default* exports but it's for *one-off* nodes creation only so that no cache or updates are available and it's just an easy way to hook *uhtml* into your existing project for DOM creation (not manipulation!)
+  * **uhtml/init** which returns a `document => uhtml/keyed` utility that can be bootstrapped with `uhtml/dom`, [LinkeDOM](https://github.com/WebReflection/linkedom), [JSDOM](https://github.com/jsdom/jsdom) for either *SSR* or *Workers* support
+  * **uhtml/dom** which returns a specialized *uhtml* compliant DOM environment that can be passed to the `uhtml/init` export to have 100% same-thing running on both client or Web Worker / Server. This entry exports `{ Document, DOMParser }` where the former can be used to create a new *document* while the latter one can parse well formed HTML or SVG content and return the document out of the box.
+  * **uhtml/reactive** which allows usage of symbols within the optionally *keyed* render function. The only difference with other exports, beside exporting a `reactive` field instead of `render`, so that `const render = reactive(effect)` creates a reactive render per each library, is that the `render(where, () => what)`, with a function as second argument is mandatory when the rendered stuff has signals in it, otherwise these can't side-effect properly.
+  * **uhtml/preactive** is an already bundled `uhtml/reactive` with `@preact/signals-core` in it, so that its `render` exported function, among all other *preact* related exports, is already working.
 
-**uhtml/init example**
+### uhtml/init example
 
@@ -44,1 +46,15 @@ ```js
 ```
+
+### uhtml/preactive example
+
+```js
+import { render, html, signal } from 'uhtml/preactive';
+
+const count = signal(0);
+
+render(document.body, () => html`
+  <button onclick=${() => { count.value++ }}>
+    Clicks: ${count.value}
+  </button>
+`);
+```

types/dom/utils.d.ts

@@ -5,3 +5,3 @@ export function cloned(node: any): any;
 export function asElement({ [nodeType]: type }: {
-    "__@nodeType@25361": any;
+    "__@nodeType@25480": any;
 }): boolean;
@@ -8,0 +8,0 @@ export function changeParentNode(node: any, parent: any): any;

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

380699

increased by6.43%

Number of package files

137

increased by8.73%

Lines of code

7772

increased by2.51%

Number of lines in readme file

58

increased by34.88%

Worsened metrics

Dependency count

8

increased by33.33%

Dependency changes

• + Addedgc-hook@^0.3.0

• + Added@preact/signals-core@1.8.0(transitive)

• + Addedgc-hook@0.3.1(transitive)