diff --git a/bs/docs.js b/bs/docs.js
index 973ecfe..3f9610a 100755
--- a/bs/docs.js
+++ b/bs/docs.js
@@ -12,10 +12,12 @@ const { el }= await register(ssr.dom);
echo("Loading components…");
const pkg= s.cat("package.json").xargs(JSON.parse);
-import { head, body, css } from "../docs_src/index.html.js";
-document.head.append(head(pkg, path_target));
-document.body.append(body(pkg));
+const { head, body, css }= await import("../docs_src/index.html.js"); //→ TODO: important to mention in docs!!!
+document.head.append(
+ head(pkg, path_target)
+);
document.body.append(
+ el(body, pkg),
el("script", { src: "https://cdn.jsdelivr.net/npm/shiki" }),
el("script", { src: "index.js", type: "module" })
);
diff --git a/dist/dde-with-signals.js b/dist/dde-with-signals.js
index 9df4c31..6cc58a0 100644
--- a/dist/dde-with-signals.js
+++ b/dist/dde-with-signals.js
@@ -1,21 +1,21 @@
//deka-dom-el library is available via global namespace `dde`
(()=> {
-var w={isSignal(t){return!1},processReactiveAttribute(t,e,n,r){return n}};function T(t,e=!0){return e?Object.assign(w,t):(Object.setPrototypeOf(t,w),t)}function O(t){return w.isPrototypeOf(t)&&t!==w?t:w}function E(t){return typeof t>"u"}function F(t){let e=typeof t;return e!=="object"?e:t===null?"null":Object.prototype.toString.call(t)}function R(t,e){if(!t||!(t instanceof AbortSignal))return!0;if(!t.aborted)return t.addEventListener("abort",e),function(){t.removeEventListener("abort",e)}}var z={setDeleteAttr:X};function X(t,e,n){if(Reflect.set(t,e,n),!!E(n)){if(Reflect.deleteProperty(t,e),t instanceof HTMLElement&&t.getAttribute(e)==="undefined")return t.removeAttribute(e);if(Reflect.get(t,e)==="undefined")return Reflect.set(t,e,"")}}var y=[{scope:document.body,namespace:"html",host:t=>t?t(document.body):document.body,prevent:!0}],H=t=>t==="svg"?"http://www.w3.org/2000/svg":t,b={get current(){return y[y.length-1]},get host(){return this.current.host},get namespace(){return this.current.namespace},set namespace(t){return this.current.namespace=H(t)},preventDefault(){let{current:t}=this;return t.prevent=!0,t},elNamespace(t){let e=this.namespace;return this.namespace=t,{append(...n){return b.namespace=e,n.length===1?n[0]:document.createDocumentFragment().append(...n)}}},get state(){return[...y]},push(t={}){return t.namespace&&(t.namespace=H(t.namespace)),y.push(Object.assign({},this.current,{prevent:!1},t))},pop(){return y.pop()}};function lt(t,e,...n){let r=O(this),{namespace:o}=b,c=0,s;switch((Object(e)!==e||r.isSignal(e))&&(e={textContent:e}),!0){case typeof t=="function":{c=1,b.push({scope:t,host:a=>a?(c===1?n.unshift(a):a(s),void 0):s}),s=t(e||void 0),(s instanceof HTMLElement?J:V)(s,"Attribute","dde-fun",t.name);break}case t==="#text":s=C.call(this,document.createTextNode(""),e);break;case t==="<>":s=C.call(this,document.createDocumentFragment(),e);break;case o!=="html":s=C.call(this,document.createElementNS(o,t),e);break;case!s:s=C.call(this,document.createElement(t),e)}return n.forEach(a=>a(s)),c&&b.pop(),c=2,s}var{setDeleteAttr:U}=z,L=new WeakMap;function C(t,...e){if(!e.length)return t;L.set(t,B(t,this));for(let[n,r]of Object.entries(Object.assign({},...e)))q.call(this,t,n,r);return L.delete(t),t}function q(t,e,n){let{setRemoveAttr:r,s:o}=B(t,this),c=this;n=o.processReactiveAttribute(t,e,n,(a,d)=>q.call(c,t,a,d));let[s]=e;if(s==="=")return r(e.slice(1),n);if(s===".")return $(t,e.slice(1),n);if(/(aria|data)([A-Z])/.test(e))return e=e.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase(),r(e,n);switch(e==="className"&&(e="class"),e){case"xlink:href":return r(e,n,"http://www.w3.org/1999/xlink");case"textContent":return U(t,e,n);case"style":if(typeof n!="object")break;case"dataset":return M(o,n,$.bind(null,t[e]));case"ariaset":return M(o,n,(a,d)=>r("aria-"+a,d));case"classList":return Y.call(c,t,n)}return tt(t,e)?U(t,e,n):r(e,n)}function B(t,e){if(L.has(t))return L.get(t);let r=(t instanceof SVGElement?V:J).bind(null,t,"Attribute"),o=O(e);return{setRemoveAttr:r,s:o}}function Y(t,e){let n=O(this);return M(n,e,(r,o)=>t.classList.toggle(r,o===-1?void 0:!!o)),t}function gt(t){return Array.from(t.children).forEach(e=>e.remove()),t}function tt(t,e){if(!Reflect.has(t,e))return!1;let n=G(t,e);return!E(n.set)}function G(t,e){if(t=Object.getPrototypeOf(t),!t)return{};let n=Object.getOwnPropertyDescriptor(t,e);return n||G(t,e)}function M(t,e,n){if(!(typeof e!="object"||e===null))return Object.entries(e).forEach(function([o,c]){o&&(c=t.processReactiveAttribute(e,o,c,n),n(o,c))})}function I(t){return Array.isArray(t)?t.filter(Boolean).join(" "):t}function J(t,e,n,r){return t[(E(r)?"remove":"set")+e](n,I(r))}function V(t,e,n,r,o=null){return t[(E(r)?"remove":"set")+e+"NS"](o,n,I(r))}function $(t,e,n){if(Reflect.set(t,e,n),!!E(n))return Reflect.deleteProperty(t,e)}function Et(t,e,...n){let r=n.length?new CustomEvent(e,{detail:n[0]}):new Event(e);return t.dispatchEvent(r)}function v(t,e,n){return function(o){return o.addEventListener(t,e,n),o}}var N=nt(),et=new WeakSet;v.connected=function(t,e){let n="connected";return typeof e!="object"&&(e={}),e.once=!0,function(o){let c="dde:"+n;return o.addEventListener(c,t,e),o.__dde_lifecycleToEvents?o:o.isConnected?(o.dispatchEvent(new Event(c)),o):(R(e.signal,()=>N.offConnected(o,t))&&N.onConnected(o,t),o)}};v.disconnected=function(t,e){let n="disconnected";return typeof e!="object"&&(e={}),e.once=!0,function(o){let c="dde:"+n;return o.addEventListener(c,t,e),o.__dde_lifecycleToEvents||R(e.signal,()=>N.offDisconnected(o,t))&&N.onDisconnected(o,t),o}};v.attributeChanged=function(t,e){let n="attributeChanged";return typeof e!="object"&&(e={}),function(o){let c="dde:"+n;if(o.addEventListener(c,t,e),o.__dde_lifecycleToEvents||et.has(o))return o;let s=new MutationObserver(function(d){for(let{attributeName:m,target:_}of d)_.dispatchEvent(new CustomEvent(c,{detail:[m,_.getAttribute(m)]}))});return R(e.signal,()=>s.disconnect())&&s.observe(o,{attributes:!0}),o}};function nt(){let t=new Map,e=!1,n=new MutationObserver(function(i){for(let u of i)if(u.type==="childList"){if(m(u.addedNodes,!0)){s();continue}_(u.removedNodes,!0)&&s()}});return{onConnected(i,u){c();let f=o(i);f.connected.has(u)||(f.connected.add(u),f.length_c+=1)},offConnected(i,u){if(!t.has(i))return;let f=t.get(i);f.connected.has(u)&&(f.connected.delete(u),f.length_c-=1,r(i,f))},onDisconnected(i,u){c();let f=o(i);f.disconnected.has(u)||(f.disconnected.add(u),f.length_d+=1)},offDisconnected(i,u){if(!t.has(i))return;let f=t.get(i);f.disconnected.has(u)&&(f.disconnected.delete(u),f.length_d-=1,r(i,f))}};function r(i,u){u.length_c||u.length_d||(t.delete(i),s())}function o(i){if(t.has(i))return t.get(i);let u={connected:new WeakSet,length_c:0,disconnected:new WeakSet,length_d:0};return t.set(i,u),u}function c(){e||(e=!0,n.observe(document.body,{childList:!0,subtree:!0}))}function s(){!e||t.size||(e=!1,n.disconnect())}function a(){return new Promise(function(i){(requestIdleCallback||requestAnimationFrame)(i)})}async function d(i){t.size>30&&await a();let u=[];if(!(i instanceof Node))return u;for(let f of t.keys())f===i||!(f instanceof Node)||i.contains(f)&&u.push(f);return u}function m(i,u){let f=!1;for(let g of i){if(u&&d(g).then(m),!t.has(g))continue;let x=t.get(g);x.length_c&&(g.dispatchEvent(new Event("dde:connected")),x.connected=new WeakSet,x.length_c=0,x.length_d||t.delete(g),f=!0)}return f}function _(i,u){let f=!1;for(let g of i)u&&d(g).then(_),!(!t.has(g)||!t.get(g).length_d)&&(g.dispatchEvent(new Event("dde:disconnected")),t.delete(g),f=!0);return f}}[HTMLElement,SVGElement,DocumentFragment].forEach(t=>{let{append:e}=t.prototype;t.prototype.append=function(...n){return e.apply(this,n),this}});var p=Symbol.for("Signal");function j(t){try{return Reflect.has(t,p)}catch{return!1}}var D=[],l=new WeakMap;function h(t,e){if(typeof t!="function")return Z(t,e);if(j(t))return t;let n=Z(),r=function(){let[o,...c]=l.get(r);if(l.set(r,new Set([o])),D.push(r),n(t()),D.pop(),!c.length)return;let s=l.get(r);for(let a of c)s.has(a)||A(a,r)};return l.set(n[p],r),l.set(r,new Set([n])),r(),n}h.action=function(t,e,...n){let r=t[p],{actions:o}=r;if(!o||!Reflect.has(o,e))throw new Error(`'${t}' has no action with name '${e}'!`);if(o[e].apply(r,n),r.skip)return Reflect.deleteProperty(r,"skip");r.listeners.forEach(c=>c(r.value))};h.on=function t(e,n,r={}){let{signal:o}=r;if(!(o&&o.aborted)){if(Array.isArray(e))return e.forEach(c=>t(c,n,r));k(e,n),o&&o.addEventListener("abort",()=>A(e,n))}};h.symbols={signal:p,onclear:Symbol.for("Signal.onclear")};var S="__dde_attributes";h.attribute=function(t,e=void 0){let n=h(e);return b.host(r=>{if(r instanceof HTMLElement?r.hasAttribute(t)&&n(r.getAttribute(t)):r.hasAttributeNS(null,t)&&n(r.getAttributeNS(null,t)),r[S]){r[S][t]=n;return}return r[S]={[t]:n},v.attributeChanged(function({detail:c}){/*! This maps attributes to signals (`S.attribute`).
-* Investigate `__dde_attributes` key of the element.*/let[s,a]=c,d=r[S][s];d&&d(a)})(r),v.disconnected(function(){/*! This removes all signals mapped to attributes (`S.attribute`).
-* Investigate `__dde_attributes` key of the element.*/h.clear(...Object.values(r[S]))})(r),r}),n};h.clear=function(...t){for(let n of t){Reflect.deleteProperty(n,"toJSON");let r=n[p];r.onclear.forEach(o=>o.call(r)),e(n,r),Reflect.deleteProperty(n,p)}function e(n,r){r.listeners.forEach(o=>{if(r.listeners.delete(o),!l.has(o))return;let c=l.get(o);c.delete(n),!(c.size>1)&&(h.clear(...c),l.delete(o))})}};var P="__dde_reactive";h.el=function(t,e){let n=document.createComment(""),r=document.createComment(""),o=document.createDocumentFragment();o.append(n,r);let{current:c}=b,s=a=>{if(!n.parentNode||!r.parentNode)return A(t,s);b.push(c);let d=e(a);b.pop(),Array.isArray(d)||(d=[d]);let m=n;for(;(m=n.nextSibling)!==r;)m.remove();n.after(...d)};return k(t,s),Q(t,s,n,e),s(t()),o};var K={isSignal:j,processReactiveAttribute(t,e,n,r){if(!j(n))return n;let o=c=>r(e,c);return k(n,o),Q(n,o,t,e),n()}};function Q(t,e,...n){let{current:r}=b;r.prevent||r.host(function(o){o[P]||(o[P]=[],v.disconnected(()=>o[P].forEach(([[c,s]])=>A(c,s,c[p]?.host()===o)))(o)),o[P].push([[t,e],...n])})}function Z(t,e){let n=(...r)=>r.length?it(n,...r):st(n);return ot(n,t,e)}var rt=Object.assign(Object.create(null),{stopPropagation(){this.skip=!0}}),W=class extends Error{constructor(){super();let[e,...n]=this.stack.split(`
-`),r=e.slice(e.indexOf("@"),e.indexOf(".js:")+4);this.stack=n.find(o=>!o.includes(r))}};function ot(t,e,n){let r=[];F(n)!=="[object Object]"&&(n={});let{onclear:o}=h.symbols;n[o]&&(r.push(n[o]),Reflect.deleteProperty(n,o));let{host:c}=b;return Reflect.defineProperty(t,p,{value:{value:e,actions:n,onclear:r,host:c,listeners:new Set,defined:new W},enumerable:!1,writable:!1,configurable:!0}),t.toJSON=()=>t(),Object.setPrototypeOf(t[p],rt),t}function ct(){return D[D.length-1]}function st(t){if(!t[p])return;let{value:e,listeners:n}=t[p],r=ct();return r&&n.add(r),l.has(r)&&l.get(r).add(t),e}function it(t,e,n){if(!t[p])return;let r=t[p];if(!(!n&&r.value===e))return r.value=e,r.listeners.forEach(o=>o(e)),e}function k(t,e){if(t[p])return t[p].listeners.add(e)}function A(t,e,n){let r=t[p];if(!r)return;let o=r.listeners.delete(e);if(n&&!r.listeners.size){if(h.clear(t),!l.has(r))return o;let c=l.get(r);if(!l.has(c))return o;l.get(c).forEach(s=>A(s,c,!0))}return o}T(K);
-globalThis.dde= {S: h,
+var w={isSignal(t){return!1},processReactiveAttribute(t,e,n,r){return n}};function k(t,e=!0){return e?Object.assign(w,t):(Object.setPrototypeOf(t,w),t)}function O(t){return w.isPrototypeOf(t)&&t!==w?t:w}function E(t){return typeof t>"u"}function F(t){let e=typeof t;return e!=="object"?e:t===null?"null":Object.prototype.toString.call(t)}function R(t,e){if(!t||!(t instanceof AbortSignal))return!0;if(!t.aborted)return t.addEventListener("abort",e),function(){t.removeEventListener("abort",e)}}var z={setDeleteAttr:K};function K(t,e,n){if(Reflect.set(t,e,n),!!E(n)){if(Reflect.deleteProperty(t,e),t instanceof HTMLElement&&t.getAttribute(e)==="undefined")return t.removeAttribute(e);if(Reflect.get(t,e)==="undefined")return Reflect.set(t,e,"")}}var y=[{scope:document.body,namespace:"html",host:t=>t?t(document.body):document.body,prevent:!0}],$=t=>t==="svg"?"http://www.w3.org/2000/svg":t,m={get current(){return y[y.length-1]},get host(){return this.current.host},get namespace(){return this.current.namespace},set namespace(t){return this.current.namespace=$(t)},preventDefault(){let{current:t}=this;return t.prevent=!0,t},elNamespace(t){let e=this.namespace;return this.namespace=t,{append(...n){return m.namespace=e,n.length===1?n[0]:document.createDocumentFragment().append(...n)}}},get state(){return[...y]},push(t={}){return t.namespace&&(t.namespace=$(t.namespace)),y.push(Object.assign({},this.current,{prevent:!1},t))},pop(){return y.pop()}};function lt(t,e,...n){let r=O(this),{namespace:o}=m,c=0,s,d;switch((Object(e)!==e||r.isSignal(e))&&(e={textContent:e}),!0){case typeof t=="function":{c=1,m.push({scope:t,host:h=>h?(c===1?n.unshift(h):h(d),void 0):d}),s=t(e||void 0);let a=document.createComment(``);s.prepend(a),s instanceof DocumentFragment&&(d=a);break}case t==="#text":s=C.call(this,document.createTextNode(""),e);break;case t==="<>":s=C.call(this,document.createDocumentFragment(),e);break;case o!=="html":s=C.call(this,document.createElementNS(o,t),e);break;case!s:s=C.call(this,document.createElement(t),e)}return d||(d=s),n.forEach(a=>a(d)),c&&m.pop(),c=2,s}var{setDeleteAttr:H}=z,L=new WeakMap;function C(t,...e){if(!e.length)return t;L.set(t,B(t,this));for(let[n,r]of Object.entries(Object.assign({},...e)))q.call(this,t,n,r);return L.delete(t),t}function q(t,e,n){let{setRemoveAttr:r,s:o}=B(t,this),c=this;n=o.processReactiveAttribute(t,e,n,(d,a)=>q.call(c,t,d,a));let[s]=e;if(s==="=")return r(e.slice(1),n);if(s===".")return U(t,e.slice(1),n);if(/(aria|data)([A-Z])/.test(e))return e=e.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase(),r(e,n);switch(e==="className"&&(e="class"),e){case"xlink:href":return r(e,n,"http://www.w3.org/1999/xlink");case"textContent":return H(t,e,n);case"style":if(typeof n!="object")break;case"dataset":return T(o,n,U.bind(null,t[e]));case"ariaset":return T(o,n,(d,a)=>r("aria-"+d,a));case"classList":return Q.call(c,t,n)}return X(t,e)?H(t,e,n):r(e,n)}function B(t,e){if(L.has(t))return L.get(t);let r=(t instanceof SVGElement?tt:Y).bind(null,t,"Attribute"),o=O(e);return{setRemoveAttr:r,s:o}}function Q(t,e){let n=O(this);return T(n,e,(r,o)=>t.classList.toggle(r,o===-1?void 0:!!o)),t}function gt(t){return Array.from(t.children).forEach(e=>e.remove()),t}function X(t,e){if(!Reflect.has(t,e))return!1;let n=G(t,e);return!E(n.set)}function G(t,e){if(t=Object.getPrototypeOf(t),!t)return{};let n=Object.getOwnPropertyDescriptor(t,e);return n||G(t,e)}function T(t,e,n){if(!(typeof e!="object"||e===null))return Object.entries(e).forEach(function([o,c]){o&&(c=t.processReactiveAttribute(e,o,c,n),n(o,c))})}function I(t){return Array.isArray(t)?t.filter(Boolean).join(" "):t}function Y(t,e,n,r){return t[(E(r)?"remove":"set")+e](n,I(r))}function tt(t,e,n,r,o=null){return t[(E(r)?"remove":"set")+e+"NS"](o,n,I(r))}function U(t,e,n){if(Reflect.set(t,e,n),!!E(n))return Reflect.deleteProperty(t,e)}function Et(t,e,...n){let r=n.length?new CustomEvent(e,{detail:n[0]}):new Event(e);return t.dispatchEvent(r)}function _(t,e,n){return function(o){return o.addEventListener(t,e,n),o}}var N=nt(),et=new WeakSet;_.connected=function(t,e){let n="connected";return typeof e!="object"&&(e={}),e.once=!0,function(o){let c="dde:"+n;return o.addEventListener(c,t,e),o.__dde_lifecycleToEvents?o:o.isConnected?(o.dispatchEvent(new Event(c)),o):(R(e.signal,()=>N.offConnected(o,t))&&N.onConnected(o,t),o)}};_.disconnected=function(t,e){let n="disconnected";return typeof e!="object"&&(e={}),e.once=!0,function(o){let c="dde:"+n;return o.addEventListener(c,t,e),o.__dde_lifecycleToEvents||R(e.signal,()=>N.offDisconnected(o,t))&&N.onDisconnected(o,t),o}};_.attributeChanged=function(t,e){let n="attributeChanged";return typeof e!="object"&&(e={}),function(o){let c="dde:"+n;if(o.addEventListener(c,t,e),o.__dde_lifecycleToEvents||et.has(o))return o;let s=new MutationObserver(function(a){for(let{attributeName:h,target:v}of a)v.dispatchEvent(new CustomEvent(c,{detail:[h,v.getAttribute(h)]}))});return R(e.signal,()=>s.disconnect())&&s.observe(o,{attributes:!0}),o}};function nt(){let t=new Map,e=!1,n=new MutationObserver(function(i){for(let u of i)if(u.type==="childList"){if(h(u.addedNodes,!0)){s();continue}v(u.removedNodes,!0)&&s()}});return{onConnected(i,u){c();let f=o(i);f.connected.has(u)||(f.connected.add(u),f.length_c+=1)},offConnected(i,u){if(!t.has(i))return;let f=t.get(i);f.connected.has(u)&&(f.connected.delete(u),f.length_c-=1,r(i,f))},onDisconnected(i,u){c();let f=o(i);f.disconnected.has(u)||(f.disconnected.add(u),f.length_d+=1)},offDisconnected(i,u){if(!t.has(i))return;let f=t.get(i);f.disconnected.has(u)&&(f.disconnected.delete(u),f.length_d-=1,r(i,f))}};function r(i,u){u.length_c||u.length_d||(t.delete(i),s())}function o(i){if(t.has(i))return t.get(i);let u={connected:new WeakSet,length_c:0,disconnected:new WeakSet,length_d:0};return t.set(i,u),u}function c(){e||(e=!0,n.observe(document.body,{childList:!0,subtree:!0}))}function s(){!e||t.size||(e=!1,n.disconnect())}function d(){return new Promise(function(i){(requestIdleCallback||requestAnimationFrame)(i)})}async function a(i){t.size>30&&await d();let u=[];if(!(i instanceof Node))return u;for(let f of t.keys())f===i||!(f instanceof Node)||i.contains(f)&&u.push(f);return u}function h(i,u){let f=!1;for(let b of i){if(u&&a(b).then(h),!t.has(b))continue;let x=t.get(b);x.length_c&&(b.dispatchEvent(new Event("dde:connected")),x.connected=new WeakSet,x.length_c=0,x.length_d||t.delete(b),f=!0)}return f}function v(i,u){let f=!1;for(let b of i)u&&a(b).then(v),!(!t.has(b)||!t.get(b).length_d)&&(b.dispatchEvent(new Event("dde:disconnected")),t.delete(b),f=!0);return f}}[HTMLElement,SVGElement,DocumentFragment].forEach(t=>{let{append:e}=t.prototype;t.prototype.append=function(...n){return e.apply(this,n),this}});var p=Symbol.for("Signal");function P(t){try{return Reflect.has(t,p)}catch{return!1}}var j=[],l=new WeakMap;function g(t,e){if(typeof t!="function")return J(t,e);if(P(t))return t;let n=J(),r=function(){let[o,...c]=l.get(r);if(l.set(r,new Set([o])),j.push(r),n(t()),j.pop(),!c.length)return;let s=l.get(r);for(let d of c)s.has(d)||A(d,r)};return l.set(n[p],r),l.set(r,new Set([n])),r(),n}g.action=function(t,e,...n){let r=t[p],{actions:o}=r;if(!o||!Reflect.has(o,e))throw new Error(`'${t}' has no action with name '${e}'!`);if(o[e].apply(r,n),r.skip)return Reflect.deleteProperty(r,"skip");r.listeners.forEach(c=>c(r.value))};g.on=function t(e,n,r={}){let{signal:o}=r;if(!(o&&o.aborted)){if(Array.isArray(e))return e.forEach(c=>t(c,n,r));W(e,n),o&&o.addEventListener("abort",()=>A(e,n))}};g.symbols={signal:p,onclear:Symbol.for("Signal.onclear")};var S="__dde_attributes";g.attribute=function(t,e=void 0){let n=g(e);return m.host(r=>{if(r instanceof HTMLElement?r.hasAttribute(t)&&n(r.getAttribute(t)):r.hasAttributeNS(null,t)&&n(r.getAttributeNS(null,t)),r[S]){r[S][t]=n;return}return r[S]={[t]:n},_.attributeChanged(function({detail:c}){/*! This maps attributes to signals (`S.attribute`).
+* Investigate `__dde_attributes` key of the element.*/let[s,d]=c,a=r[S][s];a&&a(d)})(r),_.disconnected(function(){/*! This removes all signals mapped to attributes (`S.attribute`).
+* Investigate `__dde_attributes` key of the element.*/g.clear(...Object.values(r[S]))})(r),r}),n};g.clear=function(...t){for(let n of t){Reflect.deleteProperty(n,"toJSON");let r=n[p];r.onclear.forEach(o=>o.call(r)),e(n,r),Reflect.deleteProperty(n,p)}function e(n,r){r.listeners.forEach(o=>{if(r.listeners.delete(o),!l.has(o))return;let c=l.get(o);c.delete(n),!(c.size>1)&&(g.clear(...c),l.delete(o))})}};var D="__dde_reactive";g.el=function(t,e){let n=document.createComment(''),r=document.createComment(""),o=document.createDocumentFragment();o.append(n,r);let{current:c}=m,s=d=>{if(!n.parentNode||!r.parentNode)return A(t,s);m.push(c);let a=e(d);m.pop(),Array.isArray(a)||(a=[a]);let h=n;for(;(h=n.nextSibling)!==r;)h.remove();n.after(...a)};return W(t,s),Z(t,s,n,e),s(t()),o};var V={isSignal:P,processReactiveAttribute(t,e,n,r){if(!P(n))return n;let o=c=>r(e,c);return W(n,o),Z(n,o,t,e),n()}};function Z(t,e,...n){let{current:r}=m;r.prevent||r.host(function(o){o[D]||(o[D]=[],_.disconnected(()=>o[D].forEach(([[c,s]])=>A(c,s,c[p]?.host()===o)))(o)),o[D].push([[t,e],...n])})}function J(t,e){let n=(...r)=>r.length?it(n,...r):st(n);return ot(n,t,e)}var rt=Object.assign(Object.create(null),{stopPropagation(){this.skip=!0}}),M=class extends Error{constructor(){super();let[e,...n]=this.stack.split(`
+`),r=e.slice(e.indexOf("@"),e.indexOf(".js:")+4);this.stack=n.find(o=>!o.includes(r))}};function ot(t,e,n){let r=[];F(n)!=="[object Object]"&&(n={});let{onclear:o}=g.symbols;n[o]&&(r.push(n[o]),Reflect.deleteProperty(n,o));let{host:c}=m;return Reflect.defineProperty(t,p,{value:{value:e,actions:n,onclear:r,host:c,listeners:new Set,defined:new M},enumerable:!1,writable:!1,configurable:!0}),t.toJSON=()=>t(),Object.setPrototypeOf(t[p],rt),t}function ct(){return j[j.length-1]}function st(t){if(!t[p])return;let{value:e,listeners:n}=t[p],r=ct();return r&&n.add(r),l.has(r)&&l.get(r).add(t),e}function it(t,e,n){if(!t[p])return;let r=t[p];if(!(!n&&r.value===e))return r.value=e,r.listeners.forEach(o=>o(e)),e}function W(t,e){if(t[p])return t[p].listeners.add(e)}function A(t,e,n){let r=t[p];if(!r)return;let o=r.listeners.delete(e);if(n&&!r.listeners.size){if(g.clear(t),!l.has(r))return o;let c=l.get(r);if(!l.has(c))return o;l.get(c).forEach(s=>A(s,c,!0))}return o}k(V);
+globalThis.dde= {S: g,
assign: C,
assignAttribute: q,
-classListDeclarative: Y,
+classListDeclarative: Q,
createElement: lt,
dispatchEvent: Et,
el: lt,
empty: gt,
-isSignal: j,
-on: v,
-registerReactivity: T,
-scope: b
+isSignal: P,
+on: _,
+registerReactivity: k,
+scope: m
};
})();
\ No newline at end of file
diff --git a/dist/dde.js b/dist/dde.js
index 9d93eb1..77af8a9 100644
--- a/dist/dde.js
+++ b/dist/dde.js
@@ -1,15 +1,15 @@
//deka-dom-el library is available via global namespace `dde`
(()=> {
-var v={isSignal(t){return!1},processReactiveAttribute(t,e,n,c){return n}};function F(t,e=!0){return e?Object.assign(v,t):(Object.setPrototypeOf(t,v),t)}function m(t){return v.isPrototypeOf(t)&&t!==v?t:v}function h(t){return typeof t>"u"}function _(t,e){if(!t||!(t instanceof AbortSignal))return!0;if(!t.aborted)return t.addEventListener("abort",e),function(){t.removeEventListener("abort",e)}}var R={setDeleteAttr:H};function H(t,e,n){if(Reflect.set(t,e,n),!!h(n)){if(Reflect.deleteProperty(t,e),t instanceof HTMLElement&&t.getAttribute(e)==="undefined")return t.removeAttribute(e);if(Reflect.get(t,e)==="undefined")return Reflect.set(t,e,"")}}var E=[{scope:document.body,namespace:"html",host:t=>t?t(document.body):document.body,prevent:!0}],S=t=>t==="svg"?"http://www.w3.org/2000/svg":t,x={get current(){return E[E.length-1]},get host(){return this.current.host},get namespace(){return this.current.namespace},set namespace(t){return this.current.namespace=S(t)},preventDefault(){let{current:t}=this;return t.prevent=!0,t},elNamespace(t){let e=this.namespace;return this.namespace=t,{append(...n){return x.namespace=e,n.length===1?n[0]:document.createDocumentFragment().append(...n)}}},get state(){return[...E]},push(t={}){return t.namespace&&(t.namespace=S(t.namespace)),E.push(Object.assign({},this.current,{prevent:!1},t))},pop(){return E.pop()}};function J(t,e,...n){let c=m(this),{namespace:r}=x,f=0,u;switch((Object(e)!==e||c.isSignal(e))&&(e={textContent:e}),!0){case typeof t=="function":{f=1,x.push({scope:t,host:a=>a?(f===1?n.unshift(a):a(u),void 0):u}),u=t(e||void 0),(u instanceof HTMLElement?M:W)(u,"Attribute","dde-fun",t.name);break}case t==="#text":u=w.call(this,document.createTextNode(""),e);break;case t==="<>":u=w.call(this,document.createDocumentFragment(),e);break;case r!=="html":u=w.call(this,document.createElementNS(r,t),e);break;case!u:u=w.call(this,document.createElement(t),e)}return n.forEach(a=>a(u)),f&&x.pop(),f=2,u}var{setDeleteAttr:L}=R,A=new WeakMap;function w(t,...e){if(!e.length)return t;A.set(t,P(t,this));for(let[n,c]of Object.entries(Object.assign({},...e)))N.call(this,t,n,c);return A.delete(t),t}function N(t,e,n){let{setRemoveAttr:c,s:r}=P(t,this),f=this;n=r.processReactiveAttribute(t,e,n,(a,p)=>N.call(f,t,a,p));let[u]=e;if(u==="=")return c(e.slice(1),n);if(u===".")return D(t,e.slice(1),n);if(/(aria|data)([A-Z])/.test(e))return e=e.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase(),c(e,n);switch(e==="className"&&(e="class"),e){case"xlink:href":return c(e,n,"http://www.w3.org/1999/xlink");case"textContent":return L(t,e,n);case"style":if(typeof n!="object")break;case"dataset":return y(r,n,D.bind(null,t[e]));case"ariaset":return y(r,n,(a,p)=>c("aria-"+a,p));case"classList":return U.call(f,t,n)}return q(t,e)?L(t,e,n):c(e,n)}function P(t,e){if(A.has(t))return A.get(t);let c=(t instanceof SVGElement?W:M).bind(null,t,"Attribute"),r=m(e);return{setRemoveAttr:c,s:r}}function U(t,e){let n=m(this);return y(n,e,(c,r)=>t.classList.toggle(c,r===-1?void 0:!!r)),t}function Q(t){return Array.from(t.children).forEach(e=>e.remove()),t}function q(t,e){if(!Reflect.has(t,e))return!1;let n=j(t,e);return!h(n.set)}function j(t,e){if(t=Object.getPrototypeOf(t),!t)return{};let n=Object.getOwnPropertyDescriptor(t,e);return n||j(t,e)}function y(t,e,n){if(!(typeof e!="object"||e===null))return Object.entries(e).forEach(function([r,f]){r&&(f=t.processReactiveAttribute(e,r,f,n),n(r,f))})}function T(t){return Array.isArray(t)?t.filter(Boolean).join(" "):t}function M(t,e,n,c){return t[(h(c)?"remove":"set")+e](n,T(c))}function W(t,e,n,c,r=null){return t[(h(c)?"remove":"set")+e+"NS"](r,n,T(c))}function D(t,e,n){if(Reflect.set(t,e,n),!!h(n))return Reflect.deleteProperty(t,e)}function k(t,e,...n){let c=n.length?new CustomEvent(e,{detail:n[0]}):new Event(e);return t.dispatchEvent(c)}function C(t,e,n){return function(r){return r.addEventListener(t,e,n),r}}var O=B(),z=new WeakSet;C.connected=function(t,e){let n="connected";return typeof e!="object"&&(e={}),e.once=!0,function(r){let f="dde:"+n;return r.addEventListener(f,t,e),r.__dde_lifecycleToEvents?r:r.isConnected?(r.dispatchEvent(new Event(f)),r):(_(e.signal,()=>O.offConnected(r,t))&&O.onConnected(r,t),r)}};C.disconnected=function(t,e){let n="disconnected";return typeof e!="object"&&(e={}),e.once=!0,function(r){let f="dde:"+n;return r.addEventListener(f,t,e),r.__dde_lifecycleToEvents||_(e.signal,()=>O.offDisconnected(r,t))&&O.onDisconnected(r,t),r}};C.attributeChanged=function(t,e){let n="attributeChanged";return typeof e!="object"&&(e={}),function(r){let f="dde:"+n;if(r.addEventListener(f,t,e),r.__dde_lifecycleToEvents||z.has(r))return r;let u=new MutationObserver(function(p){for(let{attributeName:l,target:g}of p)g.dispatchEvent(new CustomEvent(f,{detail:[l,g.getAttribute(l)]}))});return _(e.signal,()=>u.disconnect())&&u.observe(r,{attributes:!0}),r}};function B(){let t=new Map,e=!1,n=new MutationObserver(function(o){for(let s of o)if(s.type==="childList"){if(l(s.addedNodes,!0)){u();continue}g(s.removedNodes,!0)&&u()}});return{onConnected(o,s){f();let i=r(o);i.connected.has(s)||(i.connected.add(s),i.length_c+=1)},offConnected(o,s){if(!t.has(o))return;let i=t.get(o);i.connected.has(s)&&(i.connected.delete(s),i.length_c-=1,c(o,i))},onDisconnected(o,s){f();let i=r(o);i.disconnected.has(s)||(i.disconnected.add(s),i.length_d+=1)},offDisconnected(o,s){if(!t.has(o))return;let i=t.get(o);i.disconnected.has(s)&&(i.disconnected.delete(s),i.length_d-=1,c(o,i))}};function c(o,s){s.length_c||s.length_d||(t.delete(o),u())}function r(o){if(t.has(o))return t.get(o);let s={connected:new WeakSet,length_c:0,disconnected:new WeakSet,length_d:0};return t.set(o,s),s}function f(){e||(e=!0,n.observe(document.body,{childList:!0,subtree:!0}))}function u(){!e||t.size||(e=!1,n.disconnect())}function a(){return new Promise(function(o){(requestIdleCallback||requestAnimationFrame)(o)})}async function p(o){t.size>30&&await a();let s=[];if(!(o instanceof Node))return s;for(let i of t.keys())i===o||!(i instanceof Node)||o.contains(i)&&s.push(i);return s}function l(o,s){let i=!1;for(let d of o){if(s&&p(d).then(l),!t.has(d))continue;let b=t.get(d);b.length_c&&(d.dispatchEvent(new Event("dde:connected")),b.connected=new WeakSet,b.length_c=0,b.length_d||t.delete(d),i=!0)}return i}function g(o,s){let i=!1;for(let d of o)s&&p(d).then(g),!(!t.has(d)||!t.get(d).length_d)&&(d.dispatchEvent(new Event("dde:disconnected")),t.delete(d),i=!0);return i}}[HTMLElement,SVGElement,DocumentFragment].forEach(t=>{let{append:e}=t.prototype;t.prototype.append=function(...n){return e.apply(this,n),this}});
+var b={isSignal(t){return!1},processReactiveAttribute(t,e,n,c){return n}};function M(t,e=!0){return e?Object.assign(b,t):(Object.setPrototypeOf(t,b),t)}function E(t){return b.isPrototypeOf(t)&&t!==b?t:b}function l(t){return typeof t>"u"}function _(t,e){if(!t||!(t instanceof AbortSignal))return!0;if(!t.aborted)return t.addEventListener("abort",e),function(){t.removeEventListener("abort",e)}}var R={setDeleteAttr:W};function W(t,e,n){if(Reflect.set(t,e,n),!!l(n)){if(Reflect.deleteProperty(t,e),t instanceof HTMLElement&&t.getAttribute(e)==="undefined")return t.removeAttribute(e);if(Reflect.get(t,e)==="undefined")return Reflect.set(t,e,"")}}var v=[{scope:document.body,namespace:"html",host:t=>t?t(document.body):document.body,prevent:!0}],S=t=>t==="svg"?"http://www.w3.org/2000/svg":t,x={get current(){return v[v.length-1]},get host(){return this.current.host},get namespace(){return this.current.namespace},set namespace(t){return this.current.namespace=S(t)},preventDefault(){let{current:t}=this;return t.prevent=!0,t},elNamespace(t){let e=this.namespace;return this.namespace=t,{append(...n){return x.namespace=e,n.length===1?n[0]:document.createDocumentFragment().append(...n)}}},get state(){return[...v]},push(t={}){return t.namespace&&(t.namespace=S(t.namespace)),v.push(Object.assign({},this.current,{prevent:!1},t))},pop(){return v.pop()}};function J(t,e,...n){let c=E(this),{namespace:r}=x,u=0,f,a;switch((Object(e)!==e||c.isSignal(e))&&(e={textContent:e}),!0){case typeof t=="function":{u=1,x.push({scope:t,host:h=>h?(u===1?n.unshift(h):h(a),void 0):a}),f=t(e||void 0);let d=document.createComment(``);f.prepend(d),f instanceof DocumentFragment&&(a=d);break}case t==="#text":f=w.call(this,document.createTextNode(""),e);break;case t==="<>":f=w.call(this,document.createDocumentFragment(),e);break;case r!=="html":f=w.call(this,document.createElementNS(r,t),e);break;case!f:f=w.call(this,document.createElement(t),e)}return a||(a=f),n.forEach(d=>d(a)),u&&x.pop(),u=2,f}var{setDeleteAttr:D}=R,A=new WeakMap;function w(t,...e){if(!e.length)return t;A.set(t,P(t,this));for(let[n,c]of Object.entries(Object.assign({},...e)))N.call(this,t,n,c);return A.delete(t),t}function N(t,e,n){let{setRemoveAttr:c,s:r}=P(t,this),u=this;n=r.processReactiveAttribute(t,e,n,(a,d)=>N.call(u,t,a,d));let[f]=e;if(f==="=")return c(e.slice(1),n);if(f===".")return L(t,e.slice(1),n);if(/(aria|data)([A-Z])/.test(e))return e=e.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase(),c(e,n);switch(e==="className"&&(e="class"),e){case"xlink:href":return c(e,n,"http://www.w3.org/1999/xlink");case"textContent":return D(t,e,n);case"style":if(typeof n!="object")break;case"dataset":return y(r,n,L.bind(null,t[e]));case"ariaset":return y(r,n,(a,d)=>c("aria-"+a,d));case"classList":return F.call(u,t,n)}return U(t,e)?D(t,e,n):c(e,n)}function P(t,e){if(A.has(t))return A.get(t);let c=(t instanceof SVGElement?z:q).bind(null,t,"Attribute"),r=E(e);return{setRemoveAttr:c,s:r}}function F(t,e){let n=E(this);return y(n,e,(c,r)=>t.classList.toggle(c,r===-1?void 0:!!r)),t}function Q(t){return Array.from(t.children).forEach(e=>e.remove()),t}function U(t,e){if(!Reflect.has(t,e))return!1;let n=j(t,e);return!l(n.set)}function j(t,e){if(t=Object.getPrototypeOf(t),!t)return{};let n=Object.getOwnPropertyDescriptor(t,e);return n||j(t,e)}function y(t,e,n){if(!(typeof e!="object"||e===null))return Object.entries(e).forEach(function([r,u]){r&&(u=t.processReactiveAttribute(e,r,u,n),n(r,u))})}function T(t){return Array.isArray(t)?t.filter(Boolean).join(" "):t}function q(t,e,n,c){return t[(l(c)?"remove":"set")+e](n,T(c))}function z(t,e,n,c,r=null){return t[(l(c)?"remove":"set")+e+"NS"](r,n,T(c))}function L(t,e,n){if(Reflect.set(t,e,n),!!l(n))return Reflect.deleteProperty(t,e)}function k(t,e,...n){let c=n.length?new CustomEvent(e,{detail:n[0]}):new Event(e);return t.dispatchEvent(c)}function C(t,e,n){return function(r){return r.addEventListener(t,e,n),r}}var O=$(),H=new WeakSet;C.connected=function(t,e){let n="connected";return typeof e!="object"&&(e={}),e.once=!0,function(r){let u="dde:"+n;return r.addEventListener(u,t,e),r.__dde_lifecycleToEvents?r:r.isConnected?(r.dispatchEvent(new Event(u)),r):(_(e.signal,()=>O.offConnected(r,t))&&O.onConnected(r,t),r)}};C.disconnected=function(t,e){let n="disconnected";return typeof e!="object"&&(e={}),e.once=!0,function(r){let u="dde:"+n;return r.addEventListener(u,t,e),r.__dde_lifecycleToEvents||_(e.signal,()=>O.offDisconnected(r,t))&&O.onDisconnected(r,t),r}};C.attributeChanged=function(t,e){let n="attributeChanged";return typeof e!="object"&&(e={}),function(r){let u="dde:"+n;if(r.addEventListener(u,t,e),r.__dde_lifecycleToEvents||H.has(r))return r;let f=new MutationObserver(function(d){for(let{attributeName:h,target:g}of d)g.dispatchEvent(new CustomEvent(u,{detail:[h,g.getAttribute(h)]}))});return _(e.signal,()=>f.disconnect())&&f.observe(r,{attributes:!0}),r}};function $(){let t=new Map,e=!1,n=new MutationObserver(function(o){for(let s of o)if(s.type==="childList"){if(h(s.addedNodes,!0)){f();continue}g(s.removedNodes,!0)&&f()}});return{onConnected(o,s){u();let i=r(o);i.connected.has(s)||(i.connected.add(s),i.length_c+=1)},offConnected(o,s){if(!t.has(o))return;let i=t.get(o);i.connected.has(s)&&(i.connected.delete(s),i.length_c-=1,c(o,i))},onDisconnected(o,s){u();let i=r(o);i.disconnected.has(s)||(i.disconnected.add(s),i.length_d+=1)},offDisconnected(o,s){if(!t.has(o))return;let i=t.get(o);i.disconnected.has(s)&&(i.disconnected.delete(s),i.length_d-=1,c(o,i))}};function c(o,s){s.length_c||s.length_d||(t.delete(o),f())}function r(o){if(t.has(o))return t.get(o);let s={connected:new WeakSet,length_c:0,disconnected:new WeakSet,length_d:0};return t.set(o,s),s}function u(){e||(e=!0,n.observe(document.body,{childList:!0,subtree:!0}))}function f(){!e||t.size||(e=!1,n.disconnect())}function a(){return new Promise(function(o){(requestIdleCallback||requestAnimationFrame)(o)})}async function d(o){t.size>30&&await a();let s=[];if(!(o instanceof Node))return s;for(let i of t.keys())i===o||!(i instanceof Node)||o.contains(i)&&s.push(i);return s}function h(o,s){let i=!1;for(let p of o){if(s&&d(p).then(h),!t.has(p))continue;let m=t.get(p);m.length_c&&(p.dispatchEvent(new Event("dde:connected")),m.connected=new WeakSet,m.length_c=0,m.length_d||t.delete(p),i=!0)}return i}function g(o,s){let i=!1;for(let p of o)s&&d(p).then(g),!(!t.has(p)||!t.get(p).length_d)&&(p.dispatchEvent(new Event("dde:disconnected")),t.delete(p),i=!0);return i}}[HTMLElement,SVGElement,DocumentFragment].forEach(t=>{let{append:e}=t.prototype;t.prototype.append=function(...n){return e.apply(this,n),this}});
globalThis.dde= {assign: w,
assignAttribute: N,
-classListDeclarative: U,
+classListDeclarative: F,
createElement: J,
dispatchEvent: k,
el: J,
empty: Q,
on: C,
-registerReactivity: F,
+registerReactivity: M,
scope: x
};
diff --git a/dist/esm-with-signals.js b/dist/esm-with-signals.js
index c489465..8504c17 100644
--- a/dist/esm-with-signals.js
+++ b/dist/esm-with-signals.js
@@ -1,4 +1,4 @@
-var w={isSignal(t){return!1},processReactiveAttribute(t,e,n,r){return n}};function T(t,e=!0){return e?Object.assign(w,t):(Object.setPrototypeOf(t,w),t)}function O(t){return w.isPrototypeOf(t)&&t!==w?t:w}function E(t){return typeof t>"u"}function F(t){let e=typeof t;return e!=="object"?e:t===null?"null":Object.prototype.toString.call(t)}function R(t,e){if(!t||!(t instanceof AbortSignal))return!0;if(!t.aborted)return t.addEventListener("abort",e),function(){t.removeEventListener("abort",e)}}var z={setDeleteAttr:X};function X(t,e,n){if(Reflect.set(t,e,n),!!E(n)){if(Reflect.deleteProperty(t,e),t instanceof HTMLElement&&t.getAttribute(e)==="undefined")return t.removeAttribute(e);if(Reflect.get(t,e)==="undefined")return Reflect.set(t,e,"")}}var y=[{scope:document.body,namespace:"html",host:t=>t?t(document.body):document.body,prevent:!0}],H=t=>t==="svg"?"http://www.w3.org/2000/svg":t,b={get current(){return y[y.length-1]},get host(){return this.current.host},get namespace(){return this.current.namespace},set namespace(t){return this.current.namespace=H(t)},preventDefault(){let{current:t}=this;return t.prevent=!0,t},elNamespace(t){let e=this.namespace;return this.namespace=t,{append(...n){return b.namespace=e,n.length===1?n[0]:document.createDocumentFragment().append(...n)}}},get state(){return[...y]},push(t={}){return t.namespace&&(t.namespace=H(t.namespace)),y.push(Object.assign({},this.current,{prevent:!1},t))},pop(){return y.pop()}};function lt(t,e,...n){let r=O(this),{namespace:o}=b,c=0,s;switch((Object(e)!==e||r.isSignal(e))&&(e={textContent:e}),!0){case typeof t=="function":{c=1,b.push({scope:t,host:a=>a?(c===1?n.unshift(a):a(s),void 0):s}),s=t(e||void 0),(s instanceof HTMLElement?J:V)(s,"Attribute","dde-fun",t.name);break}case t==="#text":s=C.call(this,document.createTextNode(""),e);break;case t==="<>":s=C.call(this,document.createDocumentFragment(),e);break;case o!=="html":s=C.call(this,document.createElementNS(o,t),e);break;case!s:s=C.call(this,document.createElement(t),e)}return n.forEach(a=>a(s)),c&&b.pop(),c=2,s}var{setDeleteAttr:U}=z,L=new WeakMap;function C(t,...e){if(!e.length)return t;L.set(t,B(t,this));for(let[n,r]of Object.entries(Object.assign({},...e)))q.call(this,t,n,r);return L.delete(t),t}function q(t,e,n){let{setRemoveAttr:r,s:o}=B(t,this),c=this;n=o.processReactiveAttribute(t,e,n,(a,d)=>q.call(c,t,a,d));let[s]=e;if(s==="=")return r(e.slice(1),n);if(s===".")return $(t,e.slice(1),n);if(/(aria|data)([A-Z])/.test(e))return e=e.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase(),r(e,n);switch(e==="className"&&(e="class"),e){case"xlink:href":return r(e,n,"http://www.w3.org/1999/xlink");case"textContent":return U(t,e,n);case"style":if(typeof n!="object")break;case"dataset":return M(o,n,$.bind(null,t[e]));case"ariaset":return M(o,n,(a,d)=>r("aria-"+a,d));case"classList":return Y.call(c,t,n)}return tt(t,e)?U(t,e,n):r(e,n)}function B(t,e){if(L.has(t))return L.get(t);let r=(t instanceof SVGElement?V:J).bind(null,t,"Attribute"),o=O(e);return{setRemoveAttr:r,s:o}}function Y(t,e){let n=O(this);return M(n,e,(r,o)=>t.classList.toggle(r,o===-1?void 0:!!o)),t}function gt(t){return Array.from(t.children).forEach(e=>e.remove()),t}function tt(t,e){if(!Reflect.has(t,e))return!1;let n=G(t,e);return!E(n.set)}function G(t,e){if(t=Object.getPrototypeOf(t),!t)return{};let n=Object.getOwnPropertyDescriptor(t,e);return n||G(t,e)}function M(t,e,n){if(!(typeof e!="object"||e===null))return Object.entries(e).forEach(function([o,c]){o&&(c=t.processReactiveAttribute(e,o,c,n),n(o,c))})}function I(t){return Array.isArray(t)?t.filter(Boolean).join(" "):t}function J(t,e,n,r){return t[(E(r)?"remove":"set")+e](n,I(r))}function V(t,e,n,r,o=null){return t[(E(r)?"remove":"set")+e+"NS"](o,n,I(r))}function $(t,e,n){if(Reflect.set(t,e,n),!!E(n))return Reflect.deleteProperty(t,e)}function Et(t,e,...n){let r=n.length?new CustomEvent(e,{detail:n[0]}):new Event(e);return t.dispatchEvent(r)}function v(t,e,n){return function(o){return o.addEventListener(t,e,n),o}}var N=nt(),et=new WeakSet;v.connected=function(t,e){let n="connected";return typeof e!="object"&&(e={}),e.once=!0,function(o){let c="dde:"+n;return o.addEventListener(c,t,e),o.__dde_lifecycleToEvents?o:o.isConnected?(o.dispatchEvent(new Event(c)),o):(R(e.signal,()=>N.offConnected(o,t))&&N.onConnected(o,t),o)}};v.disconnected=function(t,e){let n="disconnected";return typeof e!="object"&&(e={}),e.once=!0,function(o){let c="dde:"+n;return o.addEventListener(c,t,e),o.__dde_lifecycleToEvents||R(e.signal,()=>N.offDisconnected(o,t))&&N.onDisconnected(o,t),o}};v.attributeChanged=function(t,e){let n="attributeChanged";return typeof e!="object"&&(e={}),function(o){let c="dde:"+n;if(o.addEventListener(c,t,e),o.__dde_lifecycleToEvents||et.has(o))return o;let s=new MutationObserver(function(d){for(let{attributeName:m,target:_}of d)_.dispatchEvent(new CustomEvent(c,{detail:[m,_.getAttribute(m)]}))});return R(e.signal,()=>s.disconnect())&&s.observe(o,{attributes:!0}),o}};function nt(){let t=new Map,e=!1,n=new MutationObserver(function(i){for(let u of i)if(u.type==="childList"){if(m(u.addedNodes,!0)){s();continue}_(u.removedNodes,!0)&&s()}});return{onConnected(i,u){c();let f=o(i);f.connected.has(u)||(f.connected.add(u),f.length_c+=1)},offConnected(i,u){if(!t.has(i))return;let f=t.get(i);f.connected.has(u)&&(f.connected.delete(u),f.length_c-=1,r(i,f))},onDisconnected(i,u){c();let f=o(i);f.disconnected.has(u)||(f.disconnected.add(u),f.length_d+=1)},offDisconnected(i,u){if(!t.has(i))return;let f=t.get(i);f.disconnected.has(u)&&(f.disconnected.delete(u),f.length_d-=1,r(i,f))}};function r(i,u){u.length_c||u.length_d||(t.delete(i),s())}function o(i){if(t.has(i))return t.get(i);let u={connected:new WeakSet,length_c:0,disconnected:new WeakSet,length_d:0};return t.set(i,u),u}function c(){e||(e=!0,n.observe(document.body,{childList:!0,subtree:!0}))}function s(){!e||t.size||(e=!1,n.disconnect())}function a(){return new Promise(function(i){(requestIdleCallback||requestAnimationFrame)(i)})}async function d(i){t.size>30&&await a();let u=[];if(!(i instanceof Node))return u;for(let f of t.keys())f===i||!(f instanceof Node)||i.contains(f)&&u.push(f);return u}function m(i,u){let f=!1;for(let g of i){if(u&&d(g).then(m),!t.has(g))continue;let x=t.get(g);x.length_c&&(g.dispatchEvent(new Event("dde:connected")),x.connected=new WeakSet,x.length_c=0,x.length_d||t.delete(g),f=!0)}return f}function _(i,u){let f=!1;for(let g of i)u&&d(g).then(_),!(!t.has(g)||!t.get(g).length_d)&&(g.dispatchEvent(new Event("dde:disconnected")),t.delete(g),f=!0);return f}}[HTMLElement,SVGElement,DocumentFragment].forEach(t=>{let{append:e}=t.prototype;t.prototype.append=function(...n){return e.apply(this,n),this}});var p=Symbol.for("Signal");function j(t){try{return Reflect.has(t,p)}catch{return!1}}var D=[],l=new WeakMap;function h(t,e){if(typeof t!="function")return Z(t,e);if(j(t))return t;let n=Z(),r=function(){let[o,...c]=l.get(r);if(l.set(r,new Set([o])),D.push(r),n(t()),D.pop(),!c.length)return;let s=l.get(r);for(let a of c)s.has(a)||A(a,r)};return l.set(n[p],r),l.set(r,new Set([n])),r(),n}h.action=function(t,e,...n){let r=t[p],{actions:o}=r;if(!o||!Reflect.has(o,e))throw new Error(`'${t}' has no action with name '${e}'!`);if(o[e].apply(r,n),r.skip)return Reflect.deleteProperty(r,"skip");r.listeners.forEach(c=>c(r.value))};h.on=function t(e,n,r={}){let{signal:o}=r;if(!(o&&o.aborted)){if(Array.isArray(e))return e.forEach(c=>t(c,n,r));k(e,n),o&&o.addEventListener("abort",()=>A(e,n))}};h.symbols={signal:p,onclear:Symbol.for("Signal.onclear")};var S="__dde_attributes";h.attribute=function(t,e=void 0){let n=h(e);return b.host(r=>{if(r instanceof HTMLElement?r.hasAttribute(t)&&n(r.getAttribute(t)):r.hasAttributeNS(null,t)&&n(r.getAttributeNS(null,t)),r[S]){r[S][t]=n;return}return r[S]={[t]:n},v.attributeChanged(function({detail:c}){/*! This maps attributes to signals (`S.attribute`).
-* Investigate `__dde_attributes` key of the element.*/let[s,a]=c,d=r[S][s];d&&d(a)})(r),v.disconnected(function(){/*! This removes all signals mapped to attributes (`S.attribute`).
-* Investigate `__dde_attributes` key of the element.*/h.clear(...Object.values(r[S]))})(r),r}),n};h.clear=function(...t){for(let n of t){Reflect.deleteProperty(n,"toJSON");let r=n[p];r.onclear.forEach(o=>o.call(r)),e(n,r),Reflect.deleteProperty(n,p)}function e(n,r){r.listeners.forEach(o=>{if(r.listeners.delete(o),!l.has(o))return;let c=l.get(o);c.delete(n),!(c.size>1)&&(h.clear(...c),l.delete(o))})}};var P="__dde_reactive";h.el=function(t,e){let n=document.createComment(""),r=document.createComment(""),o=document.createDocumentFragment();o.append(n,r);let{current:c}=b,s=a=>{if(!n.parentNode||!r.parentNode)return A(t,s);b.push(c);let d=e(a);b.pop(),Array.isArray(d)||(d=[d]);let m=n;for(;(m=n.nextSibling)!==r;)m.remove();n.after(...d)};return k(t,s),Q(t,s,n,e),s(t()),o};var K={isSignal:j,processReactiveAttribute(t,e,n,r){if(!j(n))return n;let o=c=>r(e,c);return k(n,o),Q(n,o,t,e),n()}};function Q(t,e,...n){let{current:r}=b;r.prevent||r.host(function(o){o[P]||(o[P]=[],v.disconnected(()=>o[P].forEach(([[c,s]])=>A(c,s,c[p]?.host()===o)))(o)),o[P].push([[t,e],...n])})}function Z(t,e){let n=(...r)=>r.length?it(n,...r):st(n);return ot(n,t,e)}var rt=Object.assign(Object.create(null),{stopPropagation(){this.skip=!0}}),W=class extends Error{constructor(){super();let[e,...n]=this.stack.split(`
-`),r=e.slice(e.indexOf("@"),e.indexOf(".js:")+4);this.stack=n.find(o=>!o.includes(r))}};function ot(t,e,n){let r=[];F(n)!=="[object Object]"&&(n={});let{onclear:o}=h.symbols;n[o]&&(r.push(n[o]),Reflect.deleteProperty(n,o));let{host:c}=b;return Reflect.defineProperty(t,p,{value:{value:e,actions:n,onclear:r,host:c,listeners:new Set,defined:new W},enumerable:!1,writable:!1,configurable:!0}),t.toJSON=()=>t(),Object.setPrototypeOf(t[p],rt),t}function ct(){return D[D.length-1]}function st(t){if(!t[p])return;let{value:e,listeners:n}=t[p],r=ct();return r&&n.add(r),l.has(r)&&l.get(r).add(t),e}function it(t,e,n){if(!t[p])return;let r=t[p];if(!(!n&&r.value===e))return r.value=e,r.listeners.forEach(o=>o(e)),e}function k(t,e){if(t[p])return t[p].listeners.add(e)}function A(t,e,n){let r=t[p];if(!r)return;let o=r.listeners.delete(e);if(n&&!r.listeners.size){if(h.clear(t),!l.has(r))return o;let c=l.get(r);if(!l.has(c))return o;l.get(c).forEach(s=>A(s,c,!0))}return o}T(K);export{h as S,C as assign,q as assignAttribute,Y as classListDeclarative,lt as createElement,Et as dispatchEvent,lt as el,gt as empty,j as isSignal,v as on,T as registerReactivity,b as scope};
+var w={isSignal(t){return!1},processReactiveAttribute(t,e,n,r){return n}};function k(t,e=!0){return e?Object.assign(w,t):(Object.setPrototypeOf(t,w),t)}function O(t){return w.isPrototypeOf(t)&&t!==w?t:w}function E(t){return typeof t>"u"}function F(t){let e=typeof t;return e!=="object"?e:t===null?"null":Object.prototype.toString.call(t)}function R(t,e){if(!t||!(t instanceof AbortSignal))return!0;if(!t.aborted)return t.addEventListener("abort",e),function(){t.removeEventListener("abort",e)}}var z={setDeleteAttr:K};function K(t,e,n){if(Reflect.set(t,e,n),!!E(n)){if(Reflect.deleteProperty(t,e),t instanceof HTMLElement&&t.getAttribute(e)==="undefined")return t.removeAttribute(e);if(Reflect.get(t,e)==="undefined")return Reflect.set(t,e,"")}}var y=[{scope:document.body,namespace:"html",host:t=>t?t(document.body):document.body,prevent:!0}],$=t=>t==="svg"?"http://www.w3.org/2000/svg":t,m={get current(){return y[y.length-1]},get host(){return this.current.host},get namespace(){return this.current.namespace},set namespace(t){return this.current.namespace=$(t)},preventDefault(){let{current:t}=this;return t.prevent=!0,t},elNamespace(t){let e=this.namespace;return this.namespace=t,{append(...n){return m.namespace=e,n.length===1?n[0]:document.createDocumentFragment().append(...n)}}},get state(){return[...y]},push(t={}){return t.namespace&&(t.namespace=$(t.namespace)),y.push(Object.assign({},this.current,{prevent:!1},t))},pop(){return y.pop()}};function lt(t,e,...n){let r=O(this),{namespace:o}=m,c=0,s,d;switch((Object(e)!==e||r.isSignal(e))&&(e={textContent:e}),!0){case typeof t=="function":{c=1,m.push({scope:t,host:h=>h?(c===1?n.unshift(h):h(d),void 0):d}),s=t(e||void 0);let a=document.createComment(``);s.prepend(a),s instanceof DocumentFragment&&(d=a);break}case t==="#text":s=C.call(this,document.createTextNode(""),e);break;case t==="<>":s=C.call(this,document.createDocumentFragment(),e);break;case o!=="html":s=C.call(this,document.createElementNS(o,t),e);break;case!s:s=C.call(this,document.createElement(t),e)}return d||(d=s),n.forEach(a=>a(d)),c&&m.pop(),c=2,s}var{setDeleteAttr:H}=z,L=new WeakMap;function C(t,...e){if(!e.length)return t;L.set(t,B(t,this));for(let[n,r]of Object.entries(Object.assign({},...e)))q.call(this,t,n,r);return L.delete(t),t}function q(t,e,n){let{setRemoveAttr:r,s:o}=B(t,this),c=this;n=o.processReactiveAttribute(t,e,n,(d,a)=>q.call(c,t,d,a));let[s]=e;if(s==="=")return r(e.slice(1),n);if(s===".")return U(t,e.slice(1),n);if(/(aria|data)([A-Z])/.test(e))return e=e.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase(),r(e,n);switch(e==="className"&&(e="class"),e){case"xlink:href":return r(e,n,"http://www.w3.org/1999/xlink");case"textContent":return H(t,e,n);case"style":if(typeof n!="object")break;case"dataset":return T(o,n,U.bind(null,t[e]));case"ariaset":return T(o,n,(d,a)=>r("aria-"+d,a));case"classList":return Q.call(c,t,n)}return X(t,e)?H(t,e,n):r(e,n)}function B(t,e){if(L.has(t))return L.get(t);let r=(t instanceof SVGElement?tt:Y).bind(null,t,"Attribute"),o=O(e);return{setRemoveAttr:r,s:o}}function Q(t,e){let n=O(this);return T(n,e,(r,o)=>t.classList.toggle(r,o===-1?void 0:!!o)),t}function gt(t){return Array.from(t.children).forEach(e=>e.remove()),t}function X(t,e){if(!Reflect.has(t,e))return!1;let n=G(t,e);return!E(n.set)}function G(t,e){if(t=Object.getPrototypeOf(t),!t)return{};let n=Object.getOwnPropertyDescriptor(t,e);return n||G(t,e)}function T(t,e,n){if(!(typeof e!="object"||e===null))return Object.entries(e).forEach(function([o,c]){o&&(c=t.processReactiveAttribute(e,o,c,n),n(o,c))})}function I(t){return Array.isArray(t)?t.filter(Boolean).join(" "):t}function Y(t,e,n,r){return t[(E(r)?"remove":"set")+e](n,I(r))}function tt(t,e,n,r,o=null){return t[(E(r)?"remove":"set")+e+"NS"](o,n,I(r))}function U(t,e,n){if(Reflect.set(t,e,n),!!E(n))return Reflect.deleteProperty(t,e)}function Et(t,e,...n){let r=n.length?new CustomEvent(e,{detail:n[0]}):new Event(e);return t.dispatchEvent(r)}function _(t,e,n){return function(o){return o.addEventListener(t,e,n),o}}var N=nt(),et=new WeakSet;_.connected=function(t,e){let n="connected";return typeof e!="object"&&(e={}),e.once=!0,function(o){let c="dde:"+n;return o.addEventListener(c,t,e),o.__dde_lifecycleToEvents?o:o.isConnected?(o.dispatchEvent(new Event(c)),o):(R(e.signal,()=>N.offConnected(o,t))&&N.onConnected(o,t),o)}};_.disconnected=function(t,e){let n="disconnected";return typeof e!="object"&&(e={}),e.once=!0,function(o){let c="dde:"+n;return o.addEventListener(c,t,e),o.__dde_lifecycleToEvents||R(e.signal,()=>N.offDisconnected(o,t))&&N.onDisconnected(o,t),o}};_.attributeChanged=function(t,e){let n="attributeChanged";return typeof e!="object"&&(e={}),function(o){let c="dde:"+n;if(o.addEventListener(c,t,e),o.__dde_lifecycleToEvents||et.has(o))return o;let s=new MutationObserver(function(a){for(let{attributeName:h,target:v}of a)v.dispatchEvent(new CustomEvent(c,{detail:[h,v.getAttribute(h)]}))});return R(e.signal,()=>s.disconnect())&&s.observe(o,{attributes:!0}),o}};function nt(){let t=new Map,e=!1,n=new MutationObserver(function(i){for(let u of i)if(u.type==="childList"){if(h(u.addedNodes,!0)){s();continue}v(u.removedNodes,!0)&&s()}});return{onConnected(i,u){c();let f=o(i);f.connected.has(u)||(f.connected.add(u),f.length_c+=1)},offConnected(i,u){if(!t.has(i))return;let f=t.get(i);f.connected.has(u)&&(f.connected.delete(u),f.length_c-=1,r(i,f))},onDisconnected(i,u){c();let f=o(i);f.disconnected.has(u)||(f.disconnected.add(u),f.length_d+=1)},offDisconnected(i,u){if(!t.has(i))return;let f=t.get(i);f.disconnected.has(u)&&(f.disconnected.delete(u),f.length_d-=1,r(i,f))}};function r(i,u){u.length_c||u.length_d||(t.delete(i),s())}function o(i){if(t.has(i))return t.get(i);let u={connected:new WeakSet,length_c:0,disconnected:new WeakSet,length_d:0};return t.set(i,u),u}function c(){e||(e=!0,n.observe(document.body,{childList:!0,subtree:!0}))}function s(){!e||t.size||(e=!1,n.disconnect())}function d(){return new Promise(function(i){(requestIdleCallback||requestAnimationFrame)(i)})}async function a(i){t.size>30&&await d();let u=[];if(!(i instanceof Node))return u;for(let f of t.keys())f===i||!(f instanceof Node)||i.contains(f)&&u.push(f);return u}function h(i,u){let f=!1;for(let b of i){if(u&&a(b).then(h),!t.has(b))continue;let x=t.get(b);x.length_c&&(b.dispatchEvent(new Event("dde:connected")),x.connected=new WeakSet,x.length_c=0,x.length_d||t.delete(b),f=!0)}return f}function v(i,u){let f=!1;for(let b of i)u&&a(b).then(v),!(!t.has(b)||!t.get(b).length_d)&&(b.dispatchEvent(new Event("dde:disconnected")),t.delete(b),f=!0);return f}}[HTMLElement,SVGElement,DocumentFragment].forEach(t=>{let{append:e}=t.prototype;t.prototype.append=function(...n){return e.apply(this,n),this}});var p=Symbol.for("Signal");function P(t){try{return Reflect.has(t,p)}catch{return!1}}var j=[],l=new WeakMap;function g(t,e){if(typeof t!="function")return J(t,e);if(P(t))return t;let n=J(),r=function(){let[o,...c]=l.get(r);if(l.set(r,new Set([o])),j.push(r),n(t()),j.pop(),!c.length)return;let s=l.get(r);for(let d of c)s.has(d)||A(d,r)};return l.set(n[p],r),l.set(r,new Set([n])),r(),n}g.action=function(t,e,...n){let r=t[p],{actions:o}=r;if(!o||!Reflect.has(o,e))throw new Error(`'${t}' has no action with name '${e}'!`);if(o[e].apply(r,n),r.skip)return Reflect.deleteProperty(r,"skip");r.listeners.forEach(c=>c(r.value))};g.on=function t(e,n,r={}){let{signal:o}=r;if(!(o&&o.aborted)){if(Array.isArray(e))return e.forEach(c=>t(c,n,r));W(e,n),o&&o.addEventListener("abort",()=>A(e,n))}};g.symbols={signal:p,onclear:Symbol.for("Signal.onclear")};var S="__dde_attributes";g.attribute=function(t,e=void 0){let n=g(e);return m.host(r=>{if(r instanceof HTMLElement?r.hasAttribute(t)&&n(r.getAttribute(t)):r.hasAttributeNS(null,t)&&n(r.getAttributeNS(null,t)),r[S]){r[S][t]=n;return}return r[S]={[t]:n},_.attributeChanged(function({detail:c}){/*! This maps attributes to signals (`S.attribute`).
+* Investigate `__dde_attributes` key of the element.*/let[s,d]=c,a=r[S][s];a&&a(d)})(r),_.disconnected(function(){/*! This removes all signals mapped to attributes (`S.attribute`).
+* Investigate `__dde_attributes` key of the element.*/g.clear(...Object.values(r[S]))})(r),r}),n};g.clear=function(...t){for(let n of t){Reflect.deleteProperty(n,"toJSON");let r=n[p];r.onclear.forEach(o=>o.call(r)),e(n,r),Reflect.deleteProperty(n,p)}function e(n,r){r.listeners.forEach(o=>{if(r.listeners.delete(o),!l.has(o))return;let c=l.get(o);c.delete(n),!(c.size>1)&&(g.clear(...c),l.delete(o))})}};var D="__dde_reactive";g.el=function(t,e){let n=document.createComment(''),r=document.createComment(""),o=document.createDocumentFragment();o.append(n,r);let{current:c}=m,s=d=>{if(!n.parentNode||!r.parentNode)return A(t,s);m.push(c);let a=e(d);m.pop(),Array.isArray(a)||(a=[a]);let h=n;for(;(h=n.nextSibling)!==r;)h.remove();n.after(...a)};return W(t,s),Z(t,s,n,e),s(t()),o};var V={isSignal:P,processReactiveAttribute(t,e,n,r){if(!P(n))return n;let o=c=>r(e,c);return W(n,o),Z(n,o,t,e),n()}};function Z(t,e,...n){let{current:r}=m;r.prevent||r.host(function(o){o[D]||(o[D]=[],_.disconnected(()=>o[D].forEach(([[c,s]])=>A(c,s,c[p]?.host()===o)))(o)),o[D].push([[t,e],...n])})}function J(t,e){let n=(...r)=>r.length?it(n,...r):st(n);return ot(n,t,e)}var rt=Object.assign(Object.create(null),{stopPropagation(){this.skip=!0}}),M=class extends Error{constructor(){super();let[e,...n]=this.stack.split(`
+`),r=e.slice(e.indexOf("@"),e.indexOf(".js:")+4);this.stack=n.find(o=>!o.includes(r))}};function ot(t,e,n){let r=[];F(n)!=="[object Object]"&&(n={});let{onclear:o}=g.symbols;n[o]&&(r.push(n[o]),Reflect.deleteProperty(n,o));let{host:c}=m;return Reflect.defineProperty(t,p,{value:{value:e,actions:n,onclear:r,host:c,listeners:new Set,defined:new M},enumerable:!1,writable:!1,configurable:!0}),t.toJSON=()=>t(),Object.setPrototypeOf(t[p],rt),t}function ct(){return j[j.length-1]}function st(t){if(!t[p])return;let{value:e,listeners:n}=t[p],r=ct();return r&&n.add(r),l.has(r)&&l.get(r).add(t),e}function it(t,e,n){if(!t[p])return;let r=t[p];if(!(!n&&r.value===e))return r.value=e,r.listeners.forEach(o=>o(e)),e}function W(t,e){if(t[p])return t[p].listeners.add(e)}function A(t,e,n){let r=t[p];if(!r)return;let o=r.listeners.delete(e);if(n&&!r.listeners.size){if(g.clear(t),!l.has(r))return o;let c=l.get(r);if(!l.has(c))return o;l.get(c).forEach(s=>A(s,c,!0))}return o}k(V);export{g as S,C as assign,q as assignAttribute,Q as classListDeclarative,lt as createElement,Et as dispatchEvent,lt as el,gt as empty,P as isSignal,_ as on,k as registerReactivity,m as scope};
diff --git a/dist/esm.js b/dist/esm.js
index fb8a3d6..5286aa6 100644
--- a/dist/esm.js
+++ b/dist/esm.js
@@ -1 +1 @@
-var v={isSignal(t){return!1},processReactiveAttribute(t,e,n,c){return n}};function F(t,e=!0){return e?Object.assign(v,t):(Object.setPrototypeOf(t,v),t)}function m(t){return v.isPrototypeOf(t)&&t!==v?t:v}function h(t){return typeof t>"u"}function _(t,e){if(!t||!(t instanceof AbortSignal))return!0;if(!t.aborted)return t.addEventListener("abort",e),function(){t.removeEventListener("abort",e)}}var R={setDeleteAttr:H};function H(t,e,n){if(Reflect.set(t,e,n),!!h(n)){if(Reflect.deleteProperty(t,e),t instanceof HTMLElement&&t.getAttribute(e)==="undefined")return t.removeAttribute(e);if(Reflect.get(t,e)==="undefined")return Reflect.set(t,e,"")}}var E=[{scope:document.body,namespace:"html",host:t=>t?t(document.body):document.body,prevent:!0}],S=t=>t==="svg"?"http://www.w3.org/2000/svg":t,x={get current(){return E[E.length-1]},get host(){return this.current.host},get namespace(){return this.current.namespace},set namespace(t){return this.current.namespace=S(t)},preventDefault(){let{current:t}=this;return t.prevent=!0,t},elNamespace(t){let e=this.namespace;return this.namespace=t,{append(...n){return x.namespace=e,n.length===1?n[0]:document.createDocumentFragment().append(...n)}}},get state(){return[...E]},push(t={}){return t.namespace&&(t.namespace=S(t.namespace)),E.push(Object.assign({},this.current,{prevent:!1},t))},pop(){return E.pop()}};function J(t,e,...n){let c=m(this),{namespace:r}=x,f=0,u;switch((Object(e)!==e||c.isSignal(e))&&(e={textContent:e}),!0){case typeof t=="function":{f=1,x.push({scope:t,host:a=>a?(f===1?n.unshift(a):a(u),void 0):u}),u=t(e||void 0),(u instanceof HTMLElement?M:W)(u,"Attribute","dde-fun",t.name);break}case t==="#text":u=w.call(this,document.createTextNode(""),e);break;case t==="<>":u=w.call(this,document.createDocumentFragment(),e);break;case r!=="html":u=w.call(this,document.createElementNS(r,t),e);break;case!u:u=w.call(this,document.createElement(t),e)}return n.forEach(a=>a(u)),f&&x.pop(),f=2,u}var{setDeleteAttr:L}=R,A=new WeakMap;function w(t,...e){if(!e.length)return t;A.set(t,P(t,this));for(let[n,c]of Object.entries(Object.assign({},...e)))N.call(this,t,n,c);return A.delete(t),t}function N(t,e,n){let{setRemoveAttr:c,s:r}=P(t,this),f=this;n=r.processReactiveAttribute(t,e,n,(a,p)=>N.call(f,t,a,p));let[u]=e;if(u==="=")return c(e.slice(1),n);if(u===".")return D(t,e.slice(1),n);if(/(aria|data)([A-Z])/.test(e))return e=e.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase(),c(e,n);switch(e==="className"&&(e="class"),e){case"xlink:href":return c(e,n,"http://www.w3.org/1999/xlink");case"textContent":return L(t,e,n);case"style":if(typeof n!="object")break;case"dataset":return y(r,n,D.bind(null,t[e]));case"ariaset":return y(r,n,(a,p)=>c("aria-"+a,p));case"classList":return U.call(f,t,n)}return q(t,e)?L(t,e,n):c(e,n)}function P(t,e){if(A.has(t))return A.get(t);let c=(t instanceof SVGElement?W:M).bind(null,t,"Attribute"),r=m(e);return{setRemoveAttr:c,s:r}}function U(t,e){let n=m(this);return y(n,e,(c,r)=>t.classList.toggle(c,r===-1?void 0:!!r)),t}function Q(t){return Array.from(t.children).forEach(e=>e.remove()),t}function q(t,e){if(!Reflect.has(t,e))return!1;let n=j(t,e);return!h(n.set)}function j(t,e){if(t=Object.getPrototypeOf(t),!t)return{};let n=Object.getOwnPropertyDescriptor(t,e);return n||j(t,e)}function y(t,e,n){if(!(typeof e!="object"||e===null))return Object.entries(e).forEach(function([r,f]){r&&(f=t.processReactiveAttribute(e,r,f,n),n(r,f))})}function T(t){return Array.isArray(t)?t.filter(Boolean).join(" "):t}function M(t,e,n,c){return t[(h(c)?"remove":"set")+e](n,T(c))}function W(t,e,n,c,r=null){return t[(h(c)?"remove":"set")+e+"NS"](r,n,T(c))}function D(t,e,n){if(Reflect.set(t,e,n),!!h(n))return Reflect.deleteProperty(t,e)}function k(t,e,...n){let c=n.length?new CustomEvent(e,{detail:n[0]}):new Event(e);return t.dispatchEvent(c)}function C(t,e,n){return function(r){return r.addEventListener(t,e,n),r}}var O=B(),z=new WeakSet;C.connected=function(t,e){let n="connected";return typeof e!="object"&&(e={}),e.once=!0,function(r){let f="dde:"+n;return r.addEventListener(f,t,e),r.__dde_lifecycleToEvents?r:r.isConnected?(r.dispatchEvent(new Event(f)),r):(_(e.signal,()=>O.offConnected(r,t))&&O.onConnected(r,t),r)}};C.disconnected=function(t,e){let n="disconnected";return typeof e!="object"&&(e={}),e.once=!0,function(r){let f="dde:"+n;return r.addEventListener(f,t,e),r.__dde_lifecycleToEvents||_(e.signal,()=>O.offDisconnected(r,t))&&O.onDisconnected(r,t),r}};C.attributeChanged=function(t,e){let n="attributeChanged";return typeof e!="object"&&(e={}),function(r){let f="dde:"+n;if(r.addEventListener(f,t,e),r.__dde_lifecycleToEvents||z.has(r))return r;let u=new MutationObserver(function(p){for(let{attributeName:l,target:g}of p)g.dispatchEvent(new CustomEvent(f,{detail:[l,g.getAttribute(l)]}))});return _(e.signal,()=>u.disconnect())&&u.observe(r,{attributes:!0}),r}};function B(){let t=new Map,e=!1,n=new MutationObserver(function(o){for(let s of o)if(s.type==="childList"){if(l(s.addedNodes,!0)){u();continue}g(s.removedNodes,!0)&&u()}});return{onConnected(o,s){f();let i=r(o);i.connected.has(s)||(i.connected.add(s),i.length_c+=1)},offConnected(o,s){if(!t.has(o))return;let i=t.get(o);i.connected.has(s)&&(i.connected.delete(s),i.length_c-=1,c(o,i))},onDisconnected(o,s){f();let i=r(o);i.disconnected.has(s)||(i.disconnected.add(s),i.length_d+=1)},offDisconnected(o,s){if(!t.has(o))return;let i=t.get(o);i.disconnected.has(s)&&(i.disconnected.delete(s),i.length_d-=1,c(o,i))}};function c(o,s){s.length_c||s.length_d||(t.delete(o),u())}function r(o){if(t.has(o))return t.get(o);let s={connected:new WeakSet,length_c:0,disconnected:new WeakSet,length_d:0};return t.set(o,s),s}function f(){e||(e=!0,n.observe(document.body,{childList:!0,subtree:!0}))}function u(){!e||t.size||(e=!1,n.disconnect())}function a(){return new Promise(function(o){(requestIdleCallback||requestAnimationFrame)(o)})}async function p(o){t.size>30&&await a();let s=[];if(!(o instanceof Node))return s;for(let i of t.keys())i===o||!(i instanceof Node)||o.contains(i)&&s.push(i);return s}function l(o,s){let i=!1;for(let d of o){if(s&&p(d).then(l),!t.has(d))continue;let b=t.get(d);b.length_c&&(d.dispatchEvent(new Event("dde:connected")),b.connected=new WeakSet,b.length_c=0,b.length_d||t.delete(d),i=!0)}return i}function g(o,s){let i=!1;for(let d of o)s&&p(d).then(g),!(!t.has(d)||!t.get(d).length_d)&&(d.dispatchEvent(new Event("dde:disconnected")),t.delete(d),i=!0);return i}}[HTMLElement,SVGElement,DocumentFragment].forEach(t=>{let{append:e}=t.prototype;t.prototype.append=function(...n){return e.apply(this,n),this}});export{w as assign,N as assignAttribute,U as classListDeclarative,J as createElement,k as dispatchEvent,J as el,Q as empty,C as on,F as registerReactivity,x as scope};
+var b={isSignal(t){return!1},processReactiveAttribute(t,e,n,c){return n}};function M(t,e=!0){return e?Object.assign(b,t):(Object.setPrototypeOf(t,b),t)}function E(t){return b.isPrototypeOf(t)&&t!==b?t:b}function l(t){return typeof t>"u"}function _(t,e){if(!t||!(t instanceof AbortSignal))return!0;if(!t.aborted)return t.addEventListener("abort",e),function(){t.removeEventListener("abort",e)}}var R={setDeleteAttr:W};function W(t,e,n){if(Reflect.set(t,e,n),!!l(n)){if(Reflect.deleteProperty(t,e),t instanceof HTMLElement&&t.getAttribute(e)==="undefined")return t.removeAttribute(e);if(Reflect.get(t,e)==="undefined")return Reflect.set(t,e,"")}}var v=[{scope:document.body,namespace:"html",host:t=>t?t(document.body):document.body,prevent:!0}],S=t=>t==="svg"?"http://www.w3.org/2000/svg":t,x={get current(){return v[v.length-1]},get host(){return this.current.host},get namespace(){return this.current.namespace},set namespace(t){return this.current.namespace=S(t)},preventDefault(){let{current:t}=this;return t.prevent=!0,t},elNamespace(t){let e=this.namespace;return this.namespace=t,{append(...n){return x.namespace=e,n.length===1?n[0]:document.createDocumentFragment().append(...n)}}},get state(){return[...v]},push(t={}){return t.namespace&&(t.namespace=S(t.namespace)),v.push(Object.assign({},this.current,{prevent:!1},t))},pop(){return v.pop()}};function J(t,e,...n){let c=E(this),{namespace:r}=x,u=0,f,a;switch((Object(e)!==e||c.isSignal(e))&&(e={textContent:e}),!0){case typeof t=="function":{u=1,x.push({scope:t,host:h=>h?(u===1?n.unshift(h):h(a),void 0):a}),f=t(e||void 0);let d=document.createComment(``);f.prepend(d),f instanceof DocumentFragment&&(a=d);break}case t==="#text":f=w.call(this,document.createTextNode(""),e);break;case t==="<>":f=w.call(this,document.createDocumentFragment(),e);break;case r!=="html":f=w.call(this,document.createElementNS(r,t),e);break;case!f:f=w.call(this,document.createElement(t),e)}return a||(a=f),n.forEach(d=>d(a)),u&&x.pop(),u=2,f}var{setDeleteAttr:D}=R,A=new WeakMap;function w(t,...e){if(!e.length)return t;A.set(t,P(t,this));for(let[n,c]of Object.entries(Object.assign({},...e)))N.call(this,t,n,c);return A.delete(t),t}function N(t,e,n){let{setRemoveAttr:c,s:r}=P(t,this),u=this;n=r.processReactiveAttribute(t,e,n,(a,d)=>N.call(u,t,a,d));let[f]=e;if(f==="=")return c(e.slice(1),n);if(f===".")return L(t,e.slice(1),n);if(/(aria|data)([A-Z])/.test(e))return e=e.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase(),c(e,n);switch(e==="className"&&(e="class"),e){case"xlink:href":return c(e,n,"http://www.w3.org/1999/xlink");case"textContent":return D(t,e,n);case"style":if(typeof n!="object")break;case"dataset":return y(r,n,L.bind(null,t[e]));case"ariaset":return y(r,n,(a,d)=>c("aria-"+a,d));case"classList":return F.call(u,t,n)}return U(t,e)?D(t,e,n):c(e,n)}function P(t,e){if(A.has(t))return A.get(t);let c=(t instanceof SVGElement?z:q).bind(null,t,"Attribute"),r=E(e);return{setRemoveAttr:c,s:r}}function F(t,e){let n=E(this);return y(n,e,(c,r)=>t.classList.toggle(c,r===-1?void 0:!!r)),t}function Q(t){return Array.from(t.children).forEach(e=>e.remove()),t}function U(t,e){if(!Reflect.has(t,e))return!1;let n=j(t,e);return!l(n.set)}function j(t,e){if(t=Object.getPrototypeOf(t),!t)return{};let n=Object.getOwnPropertyDescriptor(t,e);return n||j(t,e)}function y(t,e,n){if(!(typeof e!="object"||e===null))return Object.entries(e).forEach(function([r,u]){r&&(u=t.processReactiveAttribute(e,r,u,n),n(r,u))})}function T(t){return Array.isArray(t)?t.filter(Boolean).join(" "):t}function q(t,e,n,c){return t[(l(c)?"remove":"set")+e](n,T(c))}function z(t,e,n,c,r=null){return t[(l(c)?"remove":"set")+e+"NS"](r,n,T(c))}function L(t,e,n){if(Reflect.set(t,e,n),!!l(n))return Reflect.deleteProperty(t,e)}function k(t,e,...n){let c=n.length?new CustomEvent(e,{detail:n[0]}):new Event(e);return t.dispatchEvent(c)}function C(t,e,n){return function(r){return r.addEventListener(t,e,n),r}}var O=$(),H=new WeakSet;C.connected=function(t,e){let n="connected";return typeof e!="object"&&(e={}),e.once=!0,function(r){let u="dde:"+n;return r.addEventListener(u,t,e),r.__dde_lifecycleToEvents?r:r.isConnected?(r.dispatchEvent(new Event(u)),r):(_(e.signal,()=>O.offConnected(r,t))&&O.onConnected(r,t),r)}};C.disconnected=function(t,e){let n="disconnected";return typeof e!="object"&&(e={}),e.once=!0,function(r){let u="dde:"+n;return r.addEventListener(u,t,e),r.__dde_lifecycleToEvents||_(e.signal,()=>O.offDisconnected(r,t))&&O.onDisconnected(r,t),r}};C.attributeChanged=function(t,e){let n="attributeChanged";return typeof e!="object"&&(e={}),function(r){let u="dde:"+n;if(r.addEventListener(u,t,e),r.__dde_lifecycleToEvents||H.has(r))return r;let f=new MutationObserver(function(d){for(let{attributeName:h,target:g}of d)g.dispatchEvent(new CustomEvent(u,{detail:[h,g.getAttribute(h)]}))});return _(e.signal,()=>f.disconnect())&&f.observe(r,{attributes:!0}),r}};function $(){let t=new Map,e=!1,n=new MutationObserver(function(o){for(let s of o)if(s.type==="childList"){if(h(s.addedNodes,!0)){f();continue}g(s.removedNodes,!0)&&f()}});return{onConnected(o,s){u();let i=r(o);i.connected.has(s)||(i.connected.add(s),i.length_c+=1)},offConnected(o,s){if(!t.has(o))return;let i=t.get(o);i.connected.has(s)&&(i.connected.delete(s),i.length_c-=1,c(o,i))},onDisconnected(o,s){u();let i=r(o);i.disconnected.has(s)||(i.disconnected.add(s),i.length_d+=1)},offDisconnected(o,s){if(!t.has(o))return;let i=t.get(o);i.disconnected.has(s)&&(i.disconnected.delete(s),i.length_d-=1,c(o,i))}};function c(o,s){s.length_c||s.length_d||(t.delete(o),f())}function r(o){if(t.has(o))return t.get(o);let s={connected:new WeakSet,length_c:0,disconnected:new WeakSet,length_d:0};return t.set(o,s),s}function u(){e||(e=!0,n.observe(document.body,{childList:!0,subtree:!0}))}function f(){!e||t.size||(e=!1,n.disconnect())}function a(){return new Promise(function(o){(requestIdleCallback||requestAnimationFrame)(o)})}async function d(o){t.size>30&&await a();let s=[];if(!(o instanceof Node))return s;for(let i of t.keys())i===o||!(i instanceof Node)||o.contains(i)&&s.push(i);return s}function h(o,s){let i=!1;for(let p of o){if(s&&d(p).then(h),!t.has(p))continue;let m=t.get(p);m.length_c&&(p.dispatchEvent(new Event("dde:connected")),m.connected=new WeakSet,m.length_c=0,m.length_d||t.delete(p),i=!0)}return i}function g(o,s){let i=!1;for(let p of o)s&&d(p).then(g),!(!t.has(p)||!t.get(p).length_d)&&(p.dispatchEvent(new Event("dde:disconnected")),t.delete(p),i=!0);return i}}[HTMLElement,SVGElement,DocumentFragment].forEach(t=>{let{append:e}=t.prototype;t.prototype.append=function(...n){return e.apply(this,n),this}});export{w as assign,N as assignAttribute,F as classListDeclarative,J as createElement,k as dispatchEvent,J as el,Q as empty,C as on,M as registerReactivity,x as scope};
diff --git a/docs/index.css b/docs/index.css
index a5786d7..e83d2e7 100644
--- a/docs/index.css
+++ b/docs/index.css
@@ -1,6 +1,6 @@
:root {
color-scheme: dark light;
- --body-max-width: 40rem;
+ --body-max-width: 45rem;
}
*, ::before, ::after { box-sizing: border-box; }
body > * {
@@ -17,5 +17,5 @@ h1{
}
.example{
--body-max-width: 80rem;
- height: 20rem;
+ height: 25rem;
}
\ No newline at end of file
diff --git a/docs/index.html b/docs/index.html
index d9ef61e..2c6d70b 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -1,4 +1,4 @@
-
`deka-dom-el` — Introduction/Guide`deka-dom-el` — Introduction/Guide
The library tries to provide pure JavaScript tool(s) to create reactive interfaces.The main goals are:
- provide a small wrapper around the native JavaScript DOM
- keep library size under 10kB
- zero dependencies (if possible)
- prefer a declarative/functional approach
- unopinionated (allow alternative methods)
It is, in fact, an reimplementation of jaandrle/dollar_dom_component.
import { el, S } from "https://cdn.jsdelivr.net/gh/jaandrle/deka-dom-el/dist/esm-with-signals.js";
+`deka-dom-el` — Introduction/Guide`deka-dom-el` — Introduction/Guide
The library tries to provide pure JavaScript tool(s) to create reactive interfaces.The main goals are:
- provide a small wrapper around the native JavaScript DOM
- keep library size under 10kB
- zero dependencies (if possible)
- prefer a declarative/functional approach
- unopinionated (allow alternative methods)
It is, in fact, an reimplementation of jaandrle/dollar_dom_component.
import { el, S } from "https://cdn.jsdelivr.net/gh/jaandrle/deka-dom-el/dist/esm-with-signals.js";
const clicks= S(0);
document.body.append(
el("<>").append(
@@ -12,12 +12,4 @@ document.body.append(
})
)
);
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/docs_src/components/example.html.js b/docs_src/components/example.html.js
index 8a10c67..c2feacb 100644
--- a/docs_src/components/example.html.js
+++ b/docs_src/components/example.html.js
@@ -1,12 +1,12 @@
-let loaded= false;
+let is_register= false;
import { styles } from "../index.css.js";
export const css= styles().scope(example).css`
:host{
--body-max-width: 80rem;
- height: 20rem;
+ height: 25rem;
}
`
-import { el } from "../../jsdom.js";
+import { el } from "deka-dom-el";
export function example({ src, language= "javascript" }){
register();
const cwd= "components";
@@ -32,12 +32,12 @@ function elCode({ id, content }){
files: [{ name: ".js", content }],
toolbar: false
});
- return el("script", `Flems(document.getElementById("${id}"), JSON.parse(${options}));`);
+ return el("script", `Flems(document.getElementById("${id}"), JSON.parse(${JSON.stringify(options)}));`);
}
function register(){
- if(loaded) return;
+ if(is_register) return;
document.head.append(
el("script", { src: "https://flems.io/flems.html", type: "text/javascript", charset: "utf-8" })
);
- loaded= true;
+ is_register= true;
}
diff --git a/docs_src/index.css.js b/docs_src/index.css.js
index 2a2f015..4688377 100644
--- a/docs_src/index.css.js
+++ b/docs_src/index.css.js
@@ -30,7 +30,7 @@ export function styles(){ return Object.assign(Object.create(s), { content: "" }
export const common= css`
:root {
color-scheme: dark light;
- --body-max-width: 40rem;
+ --body-max-width: 45rem;
}
*, ::before, ::after { box-sizing: border-box; }
body > * {
diff --git a/docs_src/index.html.js b/docs_src/index.html.js
index 049d9c0..183a6bf 100644
--- a/docs_src/index.html.js
+++ b/docs_src/index.html.js
@@ -1,4 +1,4 @@
-import { el } from "../jsdom.js";
+import { el } from "deka-dom-el";
import { head as headCommon } from "./layout/head.html.js";
export function head(pkg, path_target){
return headCommon({
@@ -43,7 +43,7 @@ export function body(pkg){
}),
".",
),
- example({ src: "./components/examples/helloWorld.js" })
+ el(example, { src: "./components/examples/helloWorld.js" })
);
}
function pageName(pkg){
diff --git a/docs_src/layout/head.html.js b/docs_src/layout/head.html.js
index 495e73c..99ffb50 100644
--- a/docs_src/layout/head.html.js
+++ b/docs_src/layout/head.html.js
@@ -1,4 +1,4 @@
-import { el } from "../../jsdom.js";
+import { el } from "deka-dom-el";
/**
* @param {object} def
* @param {string} def.id Page `id` is used as stylesheet name.
diff --git a/jsdom.js b/jsdom.js
index 5c8d45e..484c142 100644
--- a/jsdom.js
+++ b/jsdom.js
@@ -11,35 +11,16 @@ prop_process.setDeleteAttr= function(obj, prop, value){
const keys= [ "HTMLElement", "SVGElement", "DocumentFragment", "MutationObserver", "document" ];
let dom_last;
-export let namespace;
-export let createElement;
-export let el;
-export let assign;
-export let classListDeclarative;
-export let empty;
-export let on;
-export let dispatchEvent;
+export function register(dom, keys_aditional= []){
+ if(dom_last!==dom){
+ keys.push(...keys_aditional);
+ const w= dom.window;
+ keys.forEach(key=> globalThis[key]= w[key]);
+ globalThis.window= w;
+ w.console= globalThis.console;
+ }
-export async function register(dom, keys_aditional= []){
- if(dom_last===dom)
- return import("./index.js");
-
- keys.push(...keys_aditional);
- const w= dom.window;
- keys.forEach(key=> globalThis[key]= w[key]);
- globalThis.window= w;
- w.console= globalThis.console;
-
- const m= await import("./index.js");
- namespace= m.namespace;
- createElement= m.createElement;
- el= m.el;
- assign= m.assign;
- classListDeclarative= m.classListDeclarative;
- empty= m.empty;
- on= m.on;
- dispatchEvent= m.dispatchEvent;
- return m;
+ return import("./index.js");
}
export function unregister(){
if(!dom_last)
diff --git a/package-lock.json b/package-lock.json
index f3e9944..3ce8bd6 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2524,6 +2524,37 @@
"integrity": "sha512-Ga1jfYwRn7+cP9v8auvEXN1rX3sWqlayd4HP7OKk4mZWylEmu3KzXDUGrQUN6Ol7qo1gPvB2e5gX6udnyEPgdA==",
"dev": true
},
+ "node_modules/universalify": {
+ "version": "0.2.0",
+ "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.2.0.tgz",
+ "integrity": "sha512-CJ1QgKmNg3CwvAv/kOFmtnEN05f0D/cn9QntgNOQlQF9dgvVTHj3t+8JPdjqawCHk7V/KA+fbUqzZ9XWhcqPUg==",
+ "dev": true,
+ "engines": {
+ "node": ">= 4.0.0"
+ }
+ },
+ "node_modules/url-parse": {
+ "version": "1.5.10",
+ "resolved": "https://registry.npmjs.org/url-parse/-/url-parse-1.5.10.tgz",
+ "integrity": "sha512-WypcfiRhfeUP9vvF0j6rw0J3hrWrw6iZv3+22h6iRMJ/8z1Tj6XfLP4DsUix5MhMPnXpiHDoKyoZ/bdCkwBCiQ==",
+ "dev": true,
+ "dependencies": {
+ "querystringify": "^2.1.1",
+ "requires-port": "^1.0.0"
+ }
+ },
+ "node_modules/w3c-xmlserializer": {
+ "version": "4.0.0",
+ "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-4.0.0.tgz",
+ "integrity": "sha512-d+BFHzbiCx6zGfz0HyQ6Rg69w9k19nviJspaj4yNscGjrHu94sVP+aRm75yEbCh+r2/yR+7q6hux9LVtbuTGBw==",
+ "dev": true,
+ "dependencies": {
+ "xml-name-validator": "^4.0.0"
+ },
+ "engines": {
+ "node": ">=14"
+ }
+ },
"node_modules/web-streams-polyfill": {
"version": "3.2.1",
"resolved": "https://registry.npmjs.org/web-streams-polyfill/-/web-streams-polyfill-3.2.1.tgz",
diff --git a/package.json b/package.json
index 9394f0f..d16264f 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "deka-dom-el",
- "version": "0.6.0",
+ "version": "0.6.1",
"description": "A low-code library that simplifies the creation of native DOM elements/components using small wrappers and tweaks.",
"author": "Jan Andrle ",
"license": "MIT",
diff --git a/src/dom.js b/src/dom.js
index 5f873be..b134e90 100644
--- a/src/dom.js
+++ b/src/dom.js
@@ -43,16 +43,19 @@ export function createElement(tag, attributes, ...connect){
const s= signals(this);
const { namespace }= scope;
let scoped= 0;
- let el;
+ let el, el_host;
//TODO Array.isArray(tag) ⇒ set key (cache els)
if(Object(attributes)!==attributes || s.isSignal(attributes))
attributes= { textContent: attributes };
switch(true){
case typeof tag==="function": {
scoped= 1;
- scope.push({ scope: tag, host: c=> c ? (scoped===1 ? connect.unshift(c) : c(el), undefined) : el });
+ scope.push({ scope: tag, host: c=> c ? (scoped===1 ? connect.unshift(c) : c(el_host), undefined) : el_host });
el= tag(attributes || undefined);
- (el instanceof HTMLElement ? setRemove : setRemoveNS)(el, "Attribute", "dde-fun", tag.name);
+ const el_mark= document.createComment(``);
+ el.prepend(el_mark);
+ if(el instanceof DocumentFragment)
+ el_host= el_mark;
break;
}
case tag==="#text": el= assign.call(this, document.createTextNode(""), attributes); break;
@@ -60,7 +63,8 @@ export function createElement(tag, attributes, ...connect){
case namespace!=="html": el= assign.call(this, document.createElementNS(namespace, tag), attributes); break;
case !el: el= assign.call(this, document.createElement(tag), attributes);
}
- connect.forEach(c=> c(el));
+ if(!el_host) el_host= el;
+ connect.forEach(c=> c(el_host));
if(scoped) scope.pop();
scoped= 2;
return el;
diff --git a/src/signals-lib.js b/src/signals-lib.js
index dccc154..69f06f2 100644
--- a/src/signals-lib.js
+++ b/src/signals-lib.js
@@ -118,8 +118,8 @@ S.clear= function(...signals){
};
const key_reactive= "__dde_reactive";
S.el= function(signal, map){
- const mark_start= document.createComment(``);
- const mark_end= document.createComment("");
+ const mark_start= document.createComment(``);
+ const mark_end= document.createComment("");
const out= document.createDocumentFragment();
out.append(mark_start, mark_end);
const { current }= scope;