diff --git a/.gitignore b/.gitignore index 8fa8188..5990973 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,5 @@ dist/docs/ +dist/.* # Logs logs *.log diff --git a/bs/build.js b/bs/build.js index 332b7ba..4f54d23 100755 --- a/bs/build.js +++ b/bs/build.js @@ -1,71 +1,37 @@ #!/usr/bin/env -S npx nodejsscript -import { bundle as bundleDTS } from "dts-bundler"; +import { build } from "./dev/.build.js" const files= [ "index", "index-with-signals" ]; -const filesOut= (file, mark= "esm")=> "dist/"+file.replace("index", mark); -const css= echo.css` - .info{ color: gray; } -`; -$.api("", true) -.option("--minify", "Level of minification [ no, full, partial (default) ]") -.action(async function main({ minify= "partial" }){ - for(const file_root of files){ - const file= file_root+".js"; - echo("Processing: "+ file); - const out= filesOut(file); - const esbuild_output= s.$().run([ - "npx esbuild '::file::'", - "--platform=neutral", - "--bundle", - minifyOption(minify), - "--legal-comments=inline", - "--packages=external", - "--outfile='::out::'" - ].filter(Boolean).join(" "), { file, out }); - if(esbuild_output.code) - return $.exit(esbuild_output.code, echo(esbuild_output.stderr)); - echoVariant(esbuild_output.stderr.split("\n")[1].trim()+ " (esbuild)"); - pipe( - f=> f.replace(/^ +/gm, m=> "\t".repeat(m.length/2)), - f=> s.echo(f).to(out) - )(s.cat(out)); - - const file_dts= file_root+".d.ts"; - const file_dts_out= filesOut(file_dts); - echoVariant(file_dts_out); - s.echo(bundleDTS(file_dts)).to(file_dts_out); - - await toDDE(out, file_root); - } - $.exit(0); - - async function toDDE(file, file_root){ - const name= "dde"; - const out= filesOut(file_root+".js", name); - echoVariant(`${out} (${file} → globalThis.${name})`) - - let content= s.cat(file).toString().split(/export ?{/); - content.splice(1, 0, `\nglobalThis.${name}= {`); - content[2]= content[2] - .replace(/,(?!\n)/g, ",\n") - .replace(/(? {", - content.join(""), - "})();" - ].join("\n")).to(out); - } +$.api("") +.command("main", "Build main files", { default: true }) +.action(async function main(){ + const regular = await build({ + files, + filesOut, + minify: "no", + }); + const min = await build({ + files, + filesOut(file, mark= "esm"){ + const out= filesOut(file, mark); + const idx= out.lastIndexOf("."); + return out.slice(0, idx)+".min"+out.slice(idx); + }, + minify: "full", + }); + return $.exit(regular + min); +}) +.command("signals", "Build only signals (for example for analysis)") +.action(async function signals(){ + const regular = await build({ + files: [ "signals" ], + filesOut(file){ return "dist/."+file; }, + minify: "no", + dde: false, + }); + return $.exit(regular); }) .parse(); -/** @param {"no"|"full"|"partial"} level */ -function minifyOption(level= "partial"){ - if("no"===level) return undefined; - if("full"===level) return "--minify"; - return "--minify-syntax --minify-identifiers"; -} -function echoVariant(name){ - return echo("%c✓ "+name, css.info+css); -} + +function filesOut(file, mark= "esm"){ return "dist/"+file.replace("index", mark); } diff --git a/bs/dev/.build.js b/bs/dev/.build.js new file mode 100644 index 0000000..3510e6e --- /dev/null +++ b/bs/dev/.build.js @@ -0,0 +1,65 @@ +#!/usr/bin/env -S npx nodejsscript +import { bundle as bundleDTS } from "dts-bundler"; +const css= echo.css` + .info{ color: gray; } +`; + +export async function build({ files, filesOut, minify= "partiala", dde= true }){ + for(const file_root of files){ + const file= file_root+".js"; + echo(`Processing ${file} (minified: ${minify})`); + const out= filesOut(file); + const esbuild_output= s.$().run([ + "npx esbuild '::file::'", + "--platform=neutral", + "--bundle", + minifyOption(minify), + "--legal-comments=inline", + "--packages=external", + "--outfile='::out::'" + ].filter(Boolean).join(" "), { file, out }); + if(esbuild_output.code) + return $.exit(esbuild_output.code, echo(esbuild_output.stderr)); + echoVariant(esbuild_output.stderr.split("\n")[1].trim()+ " (esbuild)"); + pipe( + f=> f.replace(/^ +/gm, m=> "\t".repeat(m.length/2)), + f=> s.echo(f).to(out) + )(s.cat(out)); + + const file_dts= file_root+".d.ts"; + const file_dts_out= filesOut(file_dts); + echoVariant(file_dts_out); + s.echo(bundleDTS(file_dts)).to(file_dts_out); + + if(dde) await toDDE(out, file_root); + } + return 0; + + async function toDDE(file, file_root){ + const name= "dde"; + const out= filesOut(file_root+".js", name); + echoVariant(`${out} (${file} → globalThis.${name})`) + + let content= s.cat(file).toString().split(/export ?{/); + content.splice(1, 0, `\nglobalThis.${name}= {`); + content[2]= content[2] + .replace(/,(?!\n)/g, ",\n") + .replace(/(? {", + content.join(""), + "})();" + ].join("\n")).to(out); + } +} +/** @param {"no"|"full"|"partial"} level */ +function minifyOption(level= "partial"){ + if("no"===level) return undefined; + if("full"===level) return "--minify"; + return "--minify-syntax --minify-identifiers"; +} +function echoVariant(name){ + return echo("%c✓ "+name, css.info+css); +} diff --git a/dist/dde-with-signals.js b/dist/dde-with-signals.js index bf2dbba..ef6c46c 100644 --- a/dist/dde-with-signals.js +++ b/dist/dde-with-signals.js @@ -461,7 +461,6 @@ function connectionsChangesObserverConstructor() { offDisconnected(element, listener) { if (!store.has(element)) return; const ls = store.get(element); - if (!ls.disconnected.has(listener)) return; ls.disconnected.delete(listener); ls.length_d -= 1; cleanWhenOff(element, ls); diff --git a/dist/dde-with-signals.min.js b/dist/dde-with-signals.min.js new file mode 100644 index 0000000..3021b36 --- /dev/null +++ b/dist/dde-with-signals.min.js @@ -0,0 +1,31 @@ +//deka-dom-el library is available via global namespace `dde` +(()=> { +var V=(...t)=>Object.prototype.hasOwnProperty.call(...t);function O(t){return typeof t>"u"}function rt(t){let e=typeof t;return e!=="object"?e:t===null?"null":Object.prototype.toString.call(t)}function S(t,e){return t instanceof e}function F(t,e){return Object.prototype.isPrototypeOf.call(e,t)}function w(t=null,e={}){return Object.create(t,e)}function m(...t){return Object.assign(...t)}function I(t,e){if(!t||!S(t,AbortSignal))return!0;if(!t.aborted)return t.addEventListener("abort",e),function(){t.removeEventListener("abort",e)}}function $(t,e){let{observedAttributes:n=[]}=t.constructor;return n.reduce(function(r,o){return r[vt(o)]=e(t,o),r},{})}function vt(t){return t.replace(/-./g,e=>e[1].toUpperCase())}var P=class extends Error{constructor(){super();let[e,...n]=this.stack.split(` +`),r=e.slice(e.indexOf("@"),e.indexOf(".js:")+4),o=r.includes("src/helpers.js")?"src/":r;this.stack=n.find(c=>!c.includes(o))||e}get compact(){let{stack:e}=this;return e.slice(0,e.indexOf("@")+1)+"\u2026"+e.slice(e.lastIndexOf("/"))}};var j={isSignal(t){return!1},processReactiveAttribute(t,e,n,r){return n}};function K(t,e=!0){return e?m(j,t):(Object.setPrototypeOf(t,j),t)}function U(t){return F(t,j)&&t!==j?t:j}var d={setDeleteAttr:mt,ssr:"",D:globalThis.document,F:globalThis.DocumentFragment,H:globalThis.HTMLElement,S:globalThis.SVGElement,M:globalThis.MutationObserver,q:t=>t||Promise.resolve()};function mt(t,e,n){if(Reflect.set(t,e,n),!!O(n)){if(Reflect.deleteProperty(t,e),S(t,d.H)&&t.getAttribute(e)==="undefined")return t.removeAttribute(e);if(Reflect.get(t,e)==="undefined")return Reflect.set(t,e,"")}}var D="__dde_lifecyclesToEvents",y="dde:connected",R="dde:disconnected",q="dde:attributeChanged";function Bt(t){return d.q(t)}var C=[{get scope(){return d.D.body},host:t=>t?t(d.D.body):d.D.body,prevent:!0}],x={get current(){return C[C.length-1]},get host(){return this.current.host},preventDefault(){let{current:t}=this;return t.prevent=!0,t},get state(){return[...C]},push(t={}){return C.push(m({},this.current,{prevent:!1},t))},pushRoot(){return C.push(C[0])},pop(){if(C.length!==1)return C.pop()}};function ot(...t){return this.appendOriginal(...t),this}function xt(t){return t.append===ot||(t.appendOriginal=t.append,t.append=ot),t}var H;function W(t,e,...n){let r=U(this),o=0,c,s;switch((Object(e)!==e||r.isSignal(e))&&(e={textContent:e}),!0){case typeof t=="function":{o=1;let i=(...h)=>h.length?(o===1?n.unshift(...h):h.forEach(v=>v(s)),void 0):s;x.push({scope:t,host:i}),c=t(e||void 0);let p=S(c,d.F);if(c.nodeName==="#comment")break;let E=W.mark({type:"component",name:t.name,host:p?"this":"parentElement"});c.prepend(E),p&&(s=E);break}case t==="#text":c=z.call(this,d.D.createTextNode(""),e);break;case(t==="<>"||!t):c=z.call(this,d.D.createDocumentFragment(),e);break;case!!H:c=z.call(this,d.D.createElementNS(H,t),e);break;case!c:c=z.call(this,d.D.createElement(t),e)}return xt(c),s||(s=c),n.forEach(i=>i(s)),o&&x.pop(),o=2,c}W.mark=function(t,e=!1){t=Object.entries(t).map(([o,c])=>o+`="${c}"`).join(" ");let n=e?"":"/",r=d.D.createComment(``);return e&&(r.end=d.D.createComment("")),r};function Jt(t){let e=this;return function(...r){H=t;let o=W.call(e,...r);return H=void 0,o}}function Zt(t,e=t){let n="\xB9\u2070",r="\u2713",o=Object.fromEntries(Array.from(e.querySelectorAll("slot")).filter(c=>!c.name.endsWith(n)).map(c=>[c.name+=n,c]));if(t.append=new Proxy(t.append,{apply(c,s,i){if(i[0]===e)return c.apply(t,i);for(let p of i){let E=(p.slot||"")+n;try{_t(p,"remove","slot")}catch{}let h=o[E];if(!h)return;h.name.startsWith(r)||(h.childNodes.forEach(v=>v.remove()),h.name=r+E),h.append(p)}return t.append=c,t}}),t!==e){let c=Array.from(t.childNodes);t.append(...c)}return e}var B=new WeakMap,{setDeleteAttr:ct}=d;function z(t,...e){if(!e.length)return t;B.set(t,ut(t,this));for(let[n,r]of Object.entries(m({},...e)))it.call(this,t,n,r);return B.delete(t),t}function it(t,e,n){let{setRemoveAttr:r,s:o}=ut(t,this),c=this;n=o.processReactiveAttribute(t,e,n,(i,p)=>it.call(c,t,i,p));let[s]=e;if(s==="=")return r(e.slice(1),n);if(s===".")return st(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 ct(t,e,n);case"style":if(typeof n!="object")break;case"dataset":return Q(o,e,t,n,st.bind(null,t[e]));case"ariaset":return Q(o,e,t,n,(i,p)=>r("aria-"+i,p));case"classList":return Et.call(c,t,n)}return St(t,e)?ct(t,e,n):r(e,n)}function ut(t,e){if(B.has(t))return B.get(t);let r=(S(t,d.S)?At:wt).bind(null,t,"Attribute"),o=U(e);return{setRemoveAttr:r,s:o}}function Et(t,e){let n=U(this);return Q(n,"classList",t,e,(r,o)=>t.classList.toggle(r,o===-1?void 0:!!o)),t}function _t(t,e,n,r){return S(t,d.H)?t[e+"Attribute"](n,r):t[e+"AttributeNS"](null,n,r)}function St(t,e){if(!(e in t))return!1;let n=ft(t,e);return!O(n.set)}function ft(t,e){if(t=Object.getPrototypeOf(t),!t)return{};let n=Object.getOwnPropertyDescriptor(t,e);return n||ft(t,e)}function Q(t,e,n,r,o){let c=String;if(!(typeof r!="object"||r===null))return Object.entries(r).forEach(function([i,p]){i&&(i=new c(i),i.target=e,p=t.processReactiveAttribute(n,i,p,o),o(i,p))})}function wt(t,e,n,r){return t[(O(r)?"remove":"set")+e](n,r)}function At(t,e,n,r,o=null){return t[(O(r)?"remove":"set")+e+"NS"](o,n,r)}function st(t,e,n){if(Reflect.set(t,e,n),!!O(n))return Reflect.deleteProperty(t,e)}var L=d.M?yt():new Proxy({},{get(){return()=>{}}});function yt(){let t=new Map,e=!1,n=u=>function(a){for(let f of a)if(f.type==="childList"){if(h(f.addedNodes,!0)){u();continue}v(f.removedNodes,!0)&&u()}},r=new d.M(n(i));return{observe(u){let a=new d.M(n(()=>{}));return a.observe(u,{childList:!0,subtree:!0}),()=>a.disconnect()},onConnected(u,a){s();let f=c(u);f.connected.has(a)||(f.connected.add(a),f.length_c+=1)},offConnected(u,a){if(!t.has(u))return;let f=t.get(u);f.connected.has(a)&&(f.connected.delete(a),f.length_c-=1,o(u,f))},onDisconnected(u,a){s();let f=c(u);f.disconnected.has(a)||(f.disconnected.add(a),f.length_d+=1)},offDisconnected(u,a){if(!t.has(u))return;let f=t.get(u);f.disconnected.delete(a),f.length_d-=1,o(u,f)}};function o(u,a){a.length_c||a.length_d||(t.delete(u),i())}function c(u){if(t.has(u))return t.get(u);let a={connected:new WeakSet,length_c:0,disconnected:new WeakSet,length_d:0};return t.set(u,a),a}function s(){e||(e=!0,r.observe(d.D.body,{childList:!0,subtree:!0}))}function i(){!e||t.size||(e=!1,r.disconnect())}function p(){return new Promise(function(u){(requestIdleCallback||requestAnimationFrame)(u)})}async function E(u){t.size>30&&await p();let a=[];if(!S(u,Node))return a;for(let f of t.keys())f===u||!S(f,Node)||u.contains(f)&&a.push(f);return a}function h(u,a){let f=!1;for(let _ of u){if(a&&E(_).then(h),!t.has(_))continue;let T=t.get(_);T.length_c&&(_.dispatchEvent(new Event(y)),T.connected=new WeakSet,T.length_c=0,T.length_d||t.delete(_),f=!0)}return f}function v(u,a){let f=!1;for(let _ of u)a&&E(_).then(v),!(!t.has(_)||!t.get(_).length_d)&&((globalThis.queueMicrotask||setTimeout)(N(_)),f=!0);return f}function N(u){return()=>{u.isConnected||(u.dispatchEvent(new Event(R)),t.delete(u))}}}function ee(t,e,n=Ot){let r=t.host||t;x.push({scope:r,host:(...s)=>s.length?s.forEach(i=>i(r)):r}),typeof n=="function"&&(n=n.call(r,r));let o=r[D];o||Ct(r);let c=e.call(r,n);return o||r.dispatchEvent(new Event(y)),t.nodeType===11&&typeof t.mode=="string"&&r.addEventListener(R,L.observe(t),{once:!0}),x.pop(),t.append(c)}function Ct(t){return X(t.prototype,"connectedCallback",function(e,n,r){e.apply(n,r),n.dispatchEvent(new Event(y))}),X(t.prototype,"disconnectedCallback",function(e,n,r){e.apply(n,r),(globalThis.queueMicrotask||setTimeout)(()=>!n.isConnected&&n.dispatchEvent(new Event(R)))}),X(t.prototype,"attributeChangedCallback",function(e,n,r){let[o,,c]=r;n.dispatchEvent(new CustomEvent(q,{detail:[o,c]})),e.apply(n,r)}),t.prototype[D]=!0,t}function X(t,e,n){t[e]=new Proxy(t[e]||(()=>{}),{apply:n})}function Ot(t){return $(t,(e,n)=>e.getAttribute(n))}function se(t,e,n){return e||(e={}),function(o,...c){n&&(c.unshift(o),o=typeof n=="function"?n():n);let s=c.length?new CustomEvent(t,m({detail:c[0]},e)):new Event(t,e);return o.dispatchEvent(s)}}function A(t,e,n){return function(o){return o.addEventListener(t,e,n),o}}var at=t=>m({},typeof t=="object"?t:null,{once:!0});A.connected=function(t,e){return e=at(e),function(r){return r.addEventListener(y,t,e),r[D]?r:r.isConnected?(r.dispatchEvent(new Event(y)),r):(I(e.signal,()=>L.offConnected(r,t))&&L.onConnected(r,t),r)}};A.disconnected=function(t,e){return e=at(e),function(r){return r.addEventListener(R,t,e),r[D]||I(e.signal,()=>L.offDisconnected(r,t))&&L.onDisconnected(r,t),r}};var Y=new WeakMap;A.disconnectedAsAbort=function(t){if(Y.has(t))return Y.get(t);let e=new AbortController;return Y.set(t,e),t(A.disconnected(()=>e.abort())),e};var Dt=new WeakSet;A.attributeChanged=function(t,e){return typeof e!="object"&&(e={}),function(r){if(r.addEventListener(q,t,e),r[D]||Dt.has(r)||!d.M)return r;let o=new d.M(function(s){for(let{attributeName:i,target:p}of s)p.dispatchEvent(new CustomEvent(q,{detail:[i,p.getAttribute(i)]}))});return I(e.signal,()=>o.disconnect())&&o.observe(r,{attributes:!0}),r}};var l="__dde_signal",tt=(()=>{let t=new Set,e=!1;function n(){e=!1;let r=t;t=new Set;for(let o of r){let c=o[l];c&&c.listeners.forEach(s=>s(c.value))}}return function(r){t.add(r),!e&&(e=!0,queueMicrotask(n))}})();var G=w(null,{get:{value(){return pt(this)}},set:{value(...t){return bt(this,...t)}},toJSON:{value(){return pt(this)}},valueOf:{value(){return this[l]&&this[l].value}}}),Rt=w(G,{set:{value(){}}});function J(t){return F(t,G)}var Z=[],b=new WeakMap;function g(t,e){if(typeof t!="function")return dt(!1,t,e);if(J(t))return t;let n=dt(!0);function r(){let[o,...c]=b.get(r);if(b.set(r,new Set([o])),Z.push(r),bt(n,t()),Z.pop(),!c.length)return;let s=b.get(r);for(let i of c)s.has(i)||M(i,r)}return b.set(n[l],r),b.set(r,new Set([n])),r(),n}g.action=function(t,e,...n){let r=t[l];if(!r)return;let{actions:o}=r;if(!o||!V(o,e))throw new Error(`Action "${e}" not defined. See ${l}.actions.`);if(o[e].apply(r,n),r.skip)return delete r.skip;tt(t)};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));nt(e,n),o&&o.addEventListener("abort",()=>M(e,n))}};g.symbols={onclear:Symbol.for("Signal.onclear")};g.clear=function(...t){for(let n of t){let r=n[l];r&&(delete n.toJSON,r.onclear.forEach(o=>o.call(r)),e(n,r),delete n[l])}function e(n,r){r.listeners.forEach(o=>{if(r.listeners.delete(o),!b.has(o))return;let c=b.get(o);c.delete(n),!(c.size>1)&&(n.clear(...c),b.delete(o))})}};var k="__dde_reactive";function Lt(t=w()){return(e,n)=>V(t,e)?t[e]:t[e]=n()}g.el=function(t,e){let n=W.mark({type:"reactive",source:new P().compact},!0),r=n.end,o=d.D.createDocumentFragment();o.append(n,r);let{current:c}=x,s=w(),i=p=>{if(!n.parentNode||!r.parentNode)return M(t,i);let E=Lt(s);s=w(),x.push(c);let h=e(p,function(a,f){return s[a]=E(a,f)});x.pop(),Array.isArray(h)||(h=[h]);let v=document.createComment("");h.push(v),n.after(...h);let N;for(;(N=v.nextSibling)&&N!==r;)N.remove();v.remove(),n.isConnected&&kt(c.host())};return nt(t,i),ht(t,i,n,e),i(t.get()),c.host(A.disconnected(()=>s={})),o};function kt(t){!t||!t[k]||(requestIdleCallback||setTimeout)(function(){t[k]=t[k].filter(([e,n])=>n.isConnected?!0:(M(...e),!1))})}var Mt={_set(t){this.value=t}};function Nt(t){return function(e,n){let r=w(G,{set:{value(...c){return e.setAttribute(n,...c)}}}),o=gt(r,e.getAttribute(n),Mt);return t[n]=o,o}}var et="__dde_attributes";g.observedAttributes=function(t){let e=t[et]={},n=$(t,Nt(e));return A.attributeChanged(function({detail:o}){/*! This maps attributes to signals (`S.observedAttributes`). + Investigate `__dde_attributes` key of the element. */let[c,s]=o,i=this[et][c];if(i)return g.action(i,"_set",s)})(t),A.disconnected(function(){/*! This removes all signals mapped to attributes (`S.observedAttributes`). + Investigate `__dde_attributes` key of the element. */g.clear(...Object.values(this[et]))})(t),n};var lt={isSignal:J,processReactiveAttribute(t,e,n,r){if(!J(n))return n;let o=c=>{if(!t.isConnected)return M(n,o);r(e,c)};return nt(n,o),ht(n,o,t,e),n.get()}};function ht(t,e,...n){let{current:r}=x;r.host(function(o){if(o[k])return o[k].push([[t,e],...n]);o[k]=[],!r.prevent&&A.disconnected(()=>o[k].forEach(([[c,s]])=>M(c,s,c[l]&&c[l].host&&c[l].host()===o)))(o)})}var Tt=new FinalizationRegistry(function(t){g.clear({[l]:t})});function dt(t,e,n){let r=w(t?Rt:G),o=gt(r,e,n,t);return Tt.register(o,o[l]),o}var Pt=m(w(),{stopPropagation(){this.skip=!0}});function gt(t,e,n,r=!1){let o=[];rt(n)!=="[object Object]"&&(n={});let{onclear:c}=g.symbols;n[c]&&(o.push(n[c]),delete n[c]);let{host:s}=x;return Reflect.defineProperty(t,l,{value:m(w(Pt),{value:e,actions:n,onclear:o,host:s,listeners:new Set,defined:new P().stack,readonly:r}),enumerable:!1,writable:!1,configurable:!0}),t}function jt(){return Z[Z.length-1]}function pt(t){if(!t[l])return;let{value:e,listeners:n}=t[l],r=jt();return r&&n.add(r),b.has(r)&&b.get(r).add(t),e}function bt(t,e,n){let r=t[l];if(!(!r||!n&&r.value===e))return r.value=e,tt(t),e}function nt(t,e){if(t[l])return t[l].listeners.add(e)}function M(t,e,n){let r=t[l];if(!r)return;let{listeners:o}=r,c=o.delete(e);if(!c||!n||o.size)return c;g.clear(t);let s=b.get(r);if(!s)return c;let i=b.get(s);if(!i)return c;for(let p of i)M(p,s,!0);return c}K(lt); +globalThis.dde= {S: g, +assign: z, +assignAttribute: it, +chainableAppend: xt, +classListDeclarative: Et, +createElement: W, +createElementNS: Jt, +customElementRender: ee, +customElementWithDDE: Ct, +dispatchEvent: se, +el: W, +elNS: Jt, +elementAttribute: _t, +isSignal: J, +lifecyclesToEvents: Ct, +observedAttributes: Ot, +on: A, +queue: Bt, +registerReactivity: K, +scope: x, +signal: g, +simulateSlots: Zt +}; + +})(); \ No newline at end of file diff --git a/dist/dde.js b/dist/dde.js index b6d683a..0f1c0de 100644 --- a/dist/dde.js +++ b/dist/dde.js @@ -438,7 +438,6 @@ function connectionsChangesObserverConstructor() { offDisconnected(element, listener) { if (!store.has(element)) return; const ls = store.get(element); - if (!ls.disconnected.has(listener)) return; ls.disconnected.delete(listener); ls.length_d -= 1; cleanWhenOff(element, ls); diff --git a/dist/dde.min.js b/dist/dde.min.js new file mode 100644 index 0000000..e7678f1 --- /dev/null +++ b/dist/dde.min.js @@ -0,0 +1,25 @@ +//deka-dom-el library is available via global namespace `dde` +(()=> { +function w(t){return typeof t>"u"}function b(t,e){return t instanceof e}function F(t,e){return Object.prototype.isPrototypeOf.call(e,t)}function v(...t){return Object.assign(...t)}function R(t,e){if(!t||!b(t,AbortSignal))return!0;if(!t.aborted)return t.addEventListener("abort",e),function(){t.removeEventListener("abort",e)}}function I(t,e){let{observedAttributes:r=[]}=t.constructor;return r.reduce(function(n,o){return n[J(o)]=e(t,o),n},{})}function J(t){return t.replace(/-./g,e=>e[1].toUpperCase())}var y={isSignal(t){return!1},processReactiveAttribute(t,e,r,n){return r}};function K(t,e=!0){return e?v(y,t):(Object.setPrototypeOf(t,y),t)}function T(t){return F(t,y)&&t!==y?t:y}var a={setDeleteAttr:Q,ssr:"",D:globalThis.document,F:globalThis.DocumentFragment,H:globalThis.HTMLElement,S:globalThis.SVGElement,M:globalThis.MutationObserver,q:t=>t||Promise.resolve()};function Q(t,e,r){if(Reflect.set(t,e,r),!!w(r)){if(Reflect.deleteProperty(t,e),b(t,a.H)&&t.getAttribute(e)==="undefined")return t.removeAttribute(e);if(Reflect.get(t,e)==="undefined")return Reflect.set(t,e,"")}}var A="__dde_lifecyclesToEvents",m="dde:connected",_="dde:disconnected",D="dde:attributeChanged";function gt(t){return a.q(t)}var x=[{get scope(){return a.D.body},host:t=>t?t(a.D.body):a.D.body,prevent:!0}],S={get current(){return x[x.length-1]},get host(){return this.current.host},preventDefault(){let{current:t}=this;return t.prevent=!0,t},get state(){return[...x]},push(t={}){return x.push(v({},this.current,{prevent:!1},t))},pushRoot(){return x.push(x[0])},pop(){if(x.length!==1)return x.pop()}};function $(...t){return this.appendOriginal(...t),this}function X(t){return t.append===$||(t.appendOriginal=t.append,t.append=$),t}var P;function k(t,e,...r){let n=T(this),o=0,c,d;switch((Object(e)!==e||n.isSignal(e))&&(e={textContent:e}),!0){case typeof t=="function":{o=1;let f=(...l)=>l.length?(o===1?r.unshift(...l):l.forEach(E=>E(d)),void 0):d;S.push({scope:t,host:f}),c=t(e||void 0);let p=b(c,a.F);if(c.nodeName==="#comment")break;let g=k.mark({type:"component",name:t.name,host:p?"this":"parentElement"});c.prepend(g),p&&(d=g);break}case t==="#text":c=N.call(this,a.D.createTextNode(""),e);break;case(t==="<>"||!t):c=N.call(this,a.D.createDocumentFragment(),e);break;case!!P:c=N.call(this,a.D.createElementNS(P,t),e);break;case!c:c=N.call(this,a.D.createElement(t),e)}return X(c),d||(d=c),r.forEach(f=>f(d)),o&&S.pop(),o=2,c}k.mark=function(t,e=!1){t=Object.entries(t).map(([o,c])=>o+`="${c}"`).join(" ");let r=e?"":"/",n=a.D.createComment(``);return e&&(n.end=a.D.createComment("")),n};function vt(t){let e=this;return function(...n){P=t;let o=k.call(e,...n);return P=void 0,o}}function mt(t,e=t){let r="\xB9\u2070",n="\u2713",o=Object.fromEntries(Array.from(e.querySelectorAll("slot")).filter(c=>!c.name.endsWith(r)).map(c=>[c.name+=r,c]));if(t.append=new Proxy(t.append,{apply(c,d,f){if(f[0]===e)return c.apply(t,f);for(let p of f){let g=(p.slot||"")+r;try{tt(p,"remove","slot")}catch{}let l=o[g];if(!l)return;l.name.startsWith(n)||(l.childNodes.forEach(E=>E.remove()),l.name=n+g),l.append(p)}return t.append=c,t}}),t!==e){let c=Array.from(t.childNodes);t.append(...c)}return e}var M=new WeakMap,{setDeleteAttr:U}=a;function N(t,...e){if(!e.length)return t;M.set(t,B(t,this));for(let[r,n]of Object.entries(v({},...e)))z.call(this,t,r,n);return M.delete(t),t}function z(t,e,r){let{setRemoveAttr:n,s:o}=B(t,this),c=this;r=o.processReactiveAttribute(t,e,r,(f,p)=>z.call(c,t,f,p));let[d]=e;if(d==="=")return n(e.slice(1),r);if(d===".")return H(t,e.slice(1),r);if(/(aria|data)([A-Z])/.test(e))return e=e.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase(),n(e,r);switch(e==="className"&&(e="class"),e){case"xlink:href":return n(e,r,"http://www.w3.org/1999/xlink");case"textContent":return U(t,e,r);case"style":if(typeof r!="object")break;case"dataset":return j(o,e,t,r,H.bind(null,t[e]));case"ariaset":return j(o,e,t,r,(f,p)=>n("aria-"+f,p));case"classList":return Y.call(c,t,r)}return et(t,e)?U(t,e,r):n(e,r)}function B(t,e){if(M.has(t))return M.get(t);let n=(b(t,a.S)?rt:nt).bind(null,t,"Attribute"),o=T(e);return{setRemoveAttr:n,s:o}}function Y(t,e){let r=T(this);return j(r,"classList",t,e,(n,o)=>t.classList.toggle(n,o===-1?void 0:!!o)),t}function tt(t,e,r,n){return b(t,a.H)?t[e+"Attribute"](r,n):t[e+"AttributeNS"](null,r,n)}function et(t,e){if(!(e in t))return!1;let r=Z(t,e);return!w(r.set)}function Z(t,e){if(t=Object.getPrototypeOf(t),!t)return{};let r=Object.getOwnPropertyDescriptor(t,e);return r||Z(t,e)}function j(t,e,r,n,o){let c=String;if(!(typeof n!="object"||n===null))return Object.entries(n).forEach(function([f,p]){f&&(f=new c(f),f.target=e,p=t.processReactiveAttribute(r,f,p,o),o(f,p))})}function nt(t,e,r,n){return t[(w(n)?"remove":"set")+e](r,n)}function rt(t,e,r,n,o=null){return t[(w(n)?"remove":"set")+e+"NS"](o,r,n)}function H(t,e,r){if(Reflect.set(t,e,r),!!w(r))return Reflect.deleteProperty(t,e)}var C=a.M?ot():new Proxy({},{get(){return()=>{}}});function ot(){let t=new Map,e=!1,r=s=>function(u){for(let i of u)if(i.type==="childList"){if(l(i.addedNodes,!0)){s();continue}E(i.removedNodes,!0)&&s()}},n=new a.M(r(f));return{observe(s){let u=new a.M(r(()=>{}));return u.observe(s,{childList:!0,subtree:!0}),()=>u.disconnect()},onConnected(s,u){d();let i=c(s);i.connected.has(u)||(i.connected.add(u),i.length_c+=1)},offConnected(s,u){if(!t.has(s))return;let i=t.get(s);i.connected.has(u)&&(i.connected.delete(u),i.length_c-=1,o(s,i))},onDisconnected(s,u){d();let i=c(s);i.disconnected.has(u)||(i.disconnected.add(u),i.length_d+=1)},offDisconnected(s,u){if(!t.has(s))return;let i=t.get(s);i.disconnected.delete(u),i.length_d-=1,o(s,i)}};function o(s,u){u.length_c||u.length_d||(t.delete(s),f())}function c(s){if(t.has(s))return t.get(s);let u={connected:new WeakSet,length_c:0,disconnected:new WeakSet,length_d:0};return t.set(s,u),u}function d(){e||(e=!0,n.observe(a.D.body,{childList:!0,subtree:!0}))}function f(){!e||t.size||(e=!1,n.disconnect())}function p(){return new Promise(function(s){(requestIdleCallback||requestAnimationFrame)(s)})}async function g(s){t.size>30&&await p();let u=[];if(!b(s,Node))return u;for(let i of t.keys())i===s||!b(i,Node)||s.contains(i)&&u.push(i);return u}function l(s,u){let i=!1;for(let h of s){if(u&&g(h).then(l),!t.has(h))continue;let O=t.get(h);O.length_c&&(h.dispatchEvent(new Event(m)),O.connected=new WeakSet,O.length_c=0,O.length_d||t.delete(h),i=!0)}return i}function E(s,u){let i=!1;for(let h of s)u&&g(h).then(E),!(!t.has(h)||!t.get(h).length_d)&&((globalThis.queueMicrotask||setTimeout)(V(h)),i=!0);return i}function V(s){return()=>{s.isConnected||(s.dispatchEvent(new Event(_)),t.delete(s))}}}function yt(t,e,r=st){let n=t.host||t;S.push({scope:n,host:(...d)=>d.length?d.forEach(f=>f(n)):n}),typeof r=="function"&&(r=r.call(n,n));let o=n[A];o||ct(n);let c=e.call(n,r);return o||n.dispatchEvent(new Event(m)),t.nodeType===11&&typeof t.mode=="string"&&n.addEventListener(_,C.observe(t),{once:!0}),S.pop(),t.append(c)}function ct(t){return W(t.prototype,"connectedCallback",function(e,r,n){e.apply(r,n),r.dispatchEvent(new Event(m))}),W(t.prototype,"disconnectedCallback",function(e,r,n){e.apply(r,n),(globalThis.queueMicrotask||setTimeout)(()=>!r.isConnected&&r.dispatchEvent(new Event(_)))}),W(t.prototype,"attributeChangedCallback",function(e,r,n){let[o,,c]=n;r.dispatchEvent(new CustomEvent(D,{detail:[o,c]})),e.apply(r,n)}),t.prototype[A]=!0,t}function W(t,e,r){t[e]=new Proxy(t[e]||(()=>{}),{apply:r})}function st(t){return I(t,(e,r)=>e.getAttribute(r))}function Tt(t,e,r){return e||(e={}),function(o,...c){r&&(c.unshift(o),o=typeof r=="function"?r():r);let d=c.length?new CustomEvent(t,v({detail:c[0]},e)):new Event(t,e);return o.dispatchEvent(d)}}function L(t,e,r){return function(o){return o.addEventListener(t,e,r),o}}var G=t=>v({},typeof t=="object"?t:null,{once:!0});L.connected=function(t,e){return e=G(e),function(n){return n.addEventListener(m,t,e),n[A]?n:n.isConnected?(n.dispatchEvent(new Event(m)),n):(R(e.signal,()=>C.offConnected(n,t))&&C.onConnected(n,t),n)}};L.disconnected=function(t,e){return e=G(e),function(n){return n.addEventListener(_,t,e),n[A]||R(e.signal,()=>C.offDisconnected(n,t))&&C.onDisconnected(n,t),n}};var q=new WeakMap;L.disconnectedAsAbort=function(t){if(q.has(t))return q.get(t);let e=new AbortController;return q.set(t,e),t(L.disconnected(()=>e.abort())),e};var it=new WeakSet;L.attributeChanged=function(t,e){return typeof e!="object"&&(e={}),function(n){if(n.addEventListener(D,t,e),n[A]||it.has(n)||!a.M)return n;let o=new a.M(function(d){for(let{attributeName:f,target:p}of d)p.dispatchEvent(new CustomEvent(D,{detail:[f,p.getAttribute(f)]}))});return R(e.signal,()=>o.disconnect())&&o.observe(n,{attributes:!0}),n}}; +globalThis.dde= {assign: N, +assignAttribute: z, +chainableAppend: X, +classListDeclarative: Y, +createElement: k, +createElementNS: vt, +customElementRender: yt, +customElementWithDDE: ct, +dispatchEvent: Tt, +el: k, +elNS: vt, +elementAttribute: tt, +lifecyclesToEvents: ct, +observedAttributes: st, +on: L, +queue: gt, +registerReactivity: K, +scope: S, +simulateSlots: mt +}; + +})(); \ No newline at end of file diff --git a/dist/esm-with-signals.d.min.ts b/dist/esm-with-signals.d.min.ts new file mode 100644 index 0000000..3e0b79c --- /dev/null +++ b/dist/esm-with-signals.d.min.ts @@ -0,0 +1,593 @@ +declare global{ /* ddeSignal */ } +type CustomElementTagNameMap= { '#text': Text, '#comment': Comment } +type SupportedElement= + HTMLElementTagNameMap[keyof HTMLElementTagNameMap] + | SVGElementTagNameMap[keyof SVGElementTagNameMap] + | MathMLElementTagNameMap[keyof MathMLElementTagNameMap] + | CustomElementTagNameMap[keyof CustomElementTagNameMap] +declare global { + type ddeComponentAttributes= Record | undefined; + type ddeElementAddon= (element: El)=> any; + type ddeString= string | ddeSignal + type ddeStringable= ddeString | number | ddeSignal +} +type PascalCase= +`${Capitalize}${string}`; +type AttrsModified= { + /** + * Use string like in HTML (internally uses `*.setAttribute("style", *)`), or object representation (like DOM API). + */ + style: Partial | ddeString + | Partial<{ [K in keyof CSSStyleDeclaration]: ddeSignal }> + /** + * Provide option to add/remove/toggle CSS clasess (index of object) using 1/0/-1. + * In fact `el.classList.toggle(class_name)` for `-1` and `el.classList.toggle(class_name, Boolean(...))` + * for others. + */ + classList: Record>, + /** + * Used by the dataset HTML attribute to represent data for custom attributes added to elements. + * Values are converted to string (see {@link DOMStringMap}). + * + * [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMStringMap) + * */ + dataset: Record, + /** + * Sets `aria-*` simiraly to `dataset` + * */ + ariaset: Record, +} & Record<`=${string}` | `data${PascalCase}` | `aria${PascalCase}`, ddeString> + & Record<`.${string}`, any> +type _fromElsInterfaces= Omit; +type IsReadonly = + T extends { readonly [P in K]: T[K] } ? true : false; +/** + * Just element attributtes + * + * In most cases, you can use native propertie such as + * [MDN WEB/API/Element](https://developer.mozilla.org/en-US/docs/Web/API/Element) and so on + * (e.g. [`Text`](https://developer.mozilla.org/en-US/docs/Web/API/Text)). + * + * There is added support for `data[A-Z].*`/`aria[A-Z].*` to be converted to the kebab-case alternatives. + * @private + */ +type ElementAttributes= Partial<{ + [K in keyof _fromElsInterfaces]: + _fromElsInterfaces[K] extends ((...p: any[])=> any) + ? _fromElsInterfaces[K] | ((...p: Parameters<_fromElsInterfaces[K]>)=> ddeSignal[K]>>) + : (IsReadonly<_fromElsInterfaces, K> extends false + ? _fromElsInterfaces[K] | ddeSignal<_fromElsInterfaces[K]> + : ddeStringable) +} & AttrsModified> & Record; +export function classListDeclarative( + element: El, + classList: AttrsModified["classList"] +): El +export function assign(element: El, ...attrs_array: ElementAttributes[]): El +export function assignAttribute>( + element: El, + attr: ATT, + value: ElementAttributes[ATT] +): ElementAttributes[ATT] + +type ExtendedHTMLElementTagNameMap= HTMLElementTagNameMap & CustomElementTagNameMap; +export function el< + TAG extends keyof ExtendedHTMLElementTagNameMap, +>( + tag_name: TAG, + attrs?: ElementAttributes]> | ddeStringable, + ...addons: ddeElementAddon< + ExtendedHTMLElementTagNameMap[NoInfer] + >[], // TODO: for now addons must have the same element +): TAG extends keyof ddeHTMLElementTagNameMap ? ddeHTMLElementTagNameMap[TAG] : ddeHTMLElement +export function el( + tag_name?: "<>", +): ddeDocumentFragment +export function el( + tag_name: string, + attrs?: ElementAttributes | ddeStringable, + ...addons: ddeElementAddon[] +): ddeHTMLElement + +export function el< + C extends (attr: ddeComponentAttributes)=> SupportedElement | ddeDocumentFragment +>( + component: C, + attrs?: Parameters[0] | ddeStringable, + ...addons: ddeElementAddon>[] +): ReturnType extends ddeHTMLElementTagNameMap[keyof ddeHTMLElementTagNameMap] + ? ReturnType + : ( ReturnType extends ddeDocumentFragment ? ReturnType : ddeHTMLElement ) +export { el as createElement } + +export function elNS( + namespace: "http://www.w3.org/2000/svg" +): < + TAG extends keyof SVGElementTagNameMap & string, + EL extends ( TAG extends keyof SVGElementTagNameMap ? SVGElementTagNameMap[TAG] : SVGElement ), +>( + tag_name: TAG, + attrs?: ElementAttributes> | ddeStringable, + ...addons: ddeElementAddon>[] +)=> TAG extends keyof ddeSVGElementTagNameMap ? ddeSVGElementTagNameMap[TAG] : ddeSVGElement +export function elNS( + namespace: "http://www.w3.org/1998/Math/MathML" +): < + TAG extends keyof MathMLElementTagNameMap & string, + EL extends ( TAG extends keyof MathMLElementTagNameMap ? MathMLElementTagNameMap[TAG] : MathMLElement ), +>( + tag_name: TAG, + attrs?: ddeStringable | Partial<{ + [key in keyof EL]: EL[key] | ddeSignal | string | number | boolean + }>, + ...addons: ddeElementAddon>[] +)=> ddeMathMLElement +export function elNS( + namespace: string +): ( + tag_name: string, + attrs?: string | ddeStringable | Record, + ...addons: ddeElementAddon[] +)=> SupportedElement +export { elNS as createElementNS } + +export function chainableAppend(el: EL): EL; +/** Simulate slots for ddeComponents */ +export function simulateSlots( + root: EL, +): EL +/** + * Simulate slots in Custom Elements without using `shadowRoot`. + * @param el Custom Element root element + * @param body Body of the custom element + * */ +export function simulateSlots( + el: HTMLElement, + body: EL, +): EL + +export function dispatchEvent(name: keyof DocumentEventMap | string, options?: EventInit): + (element: SupportedElement, data?: any)=> void; +export function dispatchEvent( + name: keyof DocumentEventMap | string, + options: EventInit | null, + element: SupportedElement | (()=> SupportedElement) +): (data?: any)=> void; +interface On{ + /** Listens to the DOM event. See {@link Document.addEventListener} */ + < + Event extends keyof DocumentEventMap, + EE extends ddeElementAddon= ddeElementAddon, + >( + type: Event, + listener: (this: EE extends ddeElementAddon ? El : never, ev: DocumentEventMap[Event]) => any, + options?: AddEventListenerOptions + ) : EE; + < + EE extends ddeElementAddon= ddeElementAddon, + >( + type: string, + listener: (this: EE extends ddeElementAddon ? El : never, ev: Event | CustomEvent ) => any, + options?: AddEventListenerOptions + ) : EE; + /** Listens to the element is connected to the live DOM. In case of custom elements uses [`connectedCallback`](https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_custom_elements#custom_element_lifecycle_callbacks), or {@link MutationObserver} else where */// editorconfig-checker-disable-line + connected< + EE extends ddeElementAddon, + El extends ( EE extends ddeElementAddon ? El : never ) + >( + listener: (this: El, event: CustomEvent) => any, + options?: AddEventListenerOptions + ) : EE; + /** Listens to the element is disconnected from the live DOM. In case of custom elements uses [`disconnectedCallback`](https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_custom_elements#custom_element_lifecycle_callbacks), or {@link MutationObserver} else where */// editorconfig-checker-disable-line + disconnected< + EE extends ddeElementAddon, + El extends ( EE extends ddeElementAddon ? El : never ) + >( + listener: (this: El, event: CustomEvent) => any, + options?: AddEventListenerOptions + ) : EE; + /** Listens to the element attribute changes. In case of custom elements uses [`attributeChangedCallback`](https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_custom_elements#custom_element_lifecycle_callbacks), or {@link MutationObserver} else where */// editorconfig-checker-disable-line + attributeChanged< + EE extends ddeElementAddon, + El extends ( EE extends ddeElementAddon ? El : never ) + >( + listener: (this: El, event: CustomEvent<[ string, string ]>) => any, + options?: AddEventListenerOptions + ) : EE; +} +export const on: On; + +type Scope= { + scope: Node | Function | Object, + host: ddeElementAddon, + custom_element: false | HTMLElement, + prevent: boolean +}; +/** Current scope created last time the `el(Function)` was invoke. (Or {@link scope.push}) */ +export const scope: { + current: Scope, + /** Stops all automatizations. E. g. signals used as attributes in current scope + * registers removing these listeners (and clean signal if no other listeners are detected) + * on `disconnected` event. */ + preventDefault(prevent: T): T, + /** + * This represents reference to the current host element — `scope.host()`. + * It can be also used to register Addon(s) (functions to be called when component is initized) + * — `scope.host(on.connected(console.log))`. + * */ + host: (...addons: ddeElementAddon[])=> HTMLElement, + + state: Scope[], + /** Adds new child scope. All attributes are inherited by default. */ + push(scope: Partial): ReturnType["push"]>, + /** Adds root scope as a child of the current scope. */ + pushRoot(): ReturnType["push"]>, + /** Removes last/current child scope. */ + pop(): ReturnType["pop"]>, +}; + +export function customElementRender< + EL extends HTMLElement, + P extends any = Record> +>( + target: ShadowRoot | EL, + render: (props: P)=> SupportedElement | DocumentFragment, + props?: P | ((el: EL)=> P) +): EL +export function customElementWithDDE HTMLElement)>(custom_element: EL): EL +export function lifecyclesToEvents HTMLElement)>(custom_element: EL): EL +export function observedAttributes(custom_element: HTMLElement): Record + +/* TypeScript MEH */ +declare global{ + type ddeAppend= (...nodes: (Node | string)[])=> el; + + interface ddeDocumentFragment extends DocumentFragment{ append: ddeAppend; } + interface ddeHTMLElement extends HTMLElement{ append: ddeAppend; } + interface ddeSVGElement extends SVGElement{ append: ddeAppend; } + interface ddeMathMLElement extends MathMLElement{ append: ddeAppend; } + + interface ddeHTMLElementTagNameMap { + "a": ddeHTMLAnchorElement; + "area": ddeHTMLAreaElement; + "audio": ddeHTMLAudioElement; + "base": ddeHTMLBaseElement; + "blockquote": ddeHTMLQuoteElement; + "body": ddeHTMLBodyElement; + "br": ddeHTMLBRElement; + "button": ddeHTMLButtonElement; + "canvas": ddeHTMLCanvasElement; + "caption": ddeHTMLTableCaptionElement; + "col": ddeHTMLTableColElement; + "colgroup": ddeHTMLTableColElement; + "data": ddeHTMLDataElement; + "datalist": ddeHTMLDataListElement; + "del": ddeHTMLModElement; + "details": ddeHTMLDetailsElement; + "dialog": ddeHTMLDialogElement; + "div": ddeHTMLDivElement; + "dl": ddeHTMLDListElement; + "embed": ddeHTMLEmbedElement; + "fieldset": ddeHTMLFieldSetElement; + "form": ddeHTMLFormElement; + "h1": ddeHTMLHeadingElement; + "h2": ddeHTMLHeadingElement; + "h3": ddeHTMLHeadingElement; + "h4": ddeHTMLHeadingElement; + "h5": ddeHTMLHeadingElement; + "h6": ddeHTMLHeadingElement; + "head": ddeHTMLHeadElement; + "hr": ddeHTMLHRElement; + "html": ddeHTMLHtmlElement; + "iframe": ddeHTMLIFrameElement; + "img": ddeHTMLImageElement; + "input": ddeHTMLInputElement; + "ins": ddeHTMLModElement; + "label": ddeHTMLLabelElement; + "legend": ddeHTMLLegendElement; + "li": ddeHTMLLIElement; + "link": ddeHTMLLinkElement; + "map": ddeHTMLMapElement; + "menu": ddeHTMLMenuElement; + "meta": ddeHTMLMetaElement; + "meter": ddeHTMLMeterElement; + "object": ddeHTMLObjectElement; + "ol": ddeHTMLOListElement; + "optgroup": ddeHTMLOptGroupElement; + "option": ddeHTMLOptionElement; + "output": ddeHTMLOutputElement; + "p": ddeHTMLParagraphElement; + "picture": ddeHTMLPictureElement; + "pre": ddeHTMLPreElement; + "progress": ddeHTMLProgressElement; + "q": ddeHTMLQuoteElement; + "script": ddeHTMLScriptElement; + "select": ddeHTMLSelectElement; + "slot": ddeHTMLSlotElement; + "source": ddeHTMLSourceElement; + "span": ddeHTMLSpanElement; + "style": ddeHTMLStyleElement; + "table": ddeHTMLTableElement; + "tbody": ddeHTMLTableSectionElement; + "td": ddeHTMLTableCellElement; + "template": ddeHTMLTemplateElement; + "textarea": ddeHTMLTextAreaElement; + "tfoot": ddeHTMLTableSectionElement; + "th": ddeHTMLTableCellElement; + "thead": ddeHTMLTableSectionElement; + "time": ddeHTMLTimeElement; + "title": ddeHTMLTitleElement; + "tr": ddeHTMLTableRowElement; + "track": ddeHTMLTrackElement; + "ul": ddeHTMLUListElement; + "video": ddeHTMLVideoElement; + } + interface ddeSVGElementTagNameMap { + "a": ddeSVGAElement; + "animate": ddeSVGAnimateElement; + "animateMotion": ddeSVGAnimateMotionElement; + "animateTransform": ddeSVGAnimateTransformElement; + "circle": ddeSVGCircleElement; + "clipPath": ddeSVGClipPathElement; + "defs": ddeSVGDefsElement; + "desc": ddeSVGDescElement; + "ellipse": ddeSVGEllipseElement; + "feBlend": ddeSVGFEBlendElement; + "feColorMatrix": ddeSVGFEColorMatrixElement; + "feComponentTransfer": ddeSVGFEComponentTransferElement; + "feComposite": ddeSVGFECompositeElement; + "feConvolveMatrix": ddeSVGFEConvolveMatrixElement; + "feDiffuseLighting": ddeSVGFEDiffuseLightingElement; + "feDisplacementMap": ddeSVGFEDisplacementMapElement; + "feDistantLight": ddeSVGFEDistantLightElement; + "feDropShadow": ddeSVGFEDropShadowElement; + "feFlood": ddeSVGFEFloodElement; + "feFuncA": ddeSVGFEFuncAElement; + "feFuncB": ddeSVGFEFuncBElement; + "feFuncG": ddeSVGFEFuncGElement; + "feFuncR": ddeSVGFEFuncRElement; + "feGaussianBlur": ddeSVGFEGaussianBlurElement; + "feImage": ddeSVGFEImageElement; + "feMerge": ddeSVGFEMergeElement; + "feMergeNode": ddeSVGFEMergeNodeElement; + "feMorphology": ddeSVGFEMorphologyElement; + "feOffset": ddeSVGFEOffsetElement; + "fePointLight": ddeSVGFEPointLightElement; + "feSpecularLighting": ddeSVGFESpecularLightingElement; + "feSpotLight": ddeSVGFESpotLightElement; + "feTile": ddeSVGFETileElement; + "feTurbulence": ddeSVGFETurbulenceElement; + "filter": ddeSVGFilterElement; + "foreignObject": ddeSVGForeignObjectElement; + "g": ddeSVGGElement; + "image": ddeSVGImageElement; + "line": ddeSVGLineElement; + "linearGradient": ddeSVGLinearGradientElement; + "marker": ddeSVGMarkerElement; + "mask": ddeSVGMaskElement; + "metadata": ddeSVGMetadataElement; + "mpath": ddeSVGMPathElement; + "path": ddeSVGPathElement; + "pattern": ddeSVGPatternElement; + "polygon": ddeSVGPolygonElement; + "polyline": ddeSVGPolylineElement; + "radialGradient": ddeSVGRadialGradientElement; + "rect": ddeSVGRectElement; + "script": ddeSVGScriptElement; + "set": ddeSVGSetElement; + "stop": ddeSVGStopElement; + "style": ddeSVGStyleElement; + "svg": ddeSVGSVGElement; + "switch": ddeSVGSwitchElement; + "symbol": ddeSVGSymbolElement; + "text": ddeSVGTextElement; + "textPath": ddeSVGTextPathElement; + "title": ddeSVGTitleElement; + "tspan": ddeSVGTSpanElement; + "use": ddeSVGUseElement; + "view": ddeSVGViewElement; + } +} + +// editorconfig-checker-disable +interface ddeHTMLAnchorElement extends HTMLAnchorElement{ append: ddeAppend; } +interface ddeHTMLAreaElement extends HTMLAreaElement{ append: ddeAppend; } +interface ddeHTMLAudioElement extends HTMLAudioElement{ append: ddeAppend; } +interface ddeHTMLBaseElement extends HTMLBaseElement{ append: ddeAppend; } +interface ddeHTMLQuoteElement extends HTMLQuoteElement{ append: ddeAppend; } +interface ddeHTMLBodyElement extends HTMLBodyElement{ append: ddeAppend; } +interface ddeHTMLBRElement extends HTMLBRElement{ append: ddeAppend; } +interface ddeHTMLButtonElement extends HTMLButtonElement{ append: ddeAppend; } +interface ddeHTMLCanvasElement extends HTMLCanvasElement{ append: ddeAppend; } +interface ddeHTMLTableCaptionElement extends HTMLTableCaptionElement{ append: ddeAppend; } +interface ddeHTMLTableColElement extends HTMLTableColElement{ append: ddeAppend; } +interface ddeHTMLTableColElement extends HTMLTableColElement{ append: ddeAppend; } +interface ddeHTMLDataElement extends HTMLDataElement{ append: ddeAppend; } +interface ddeHTMLDataListElement extends HTMLDataListElement{ append: ddeAppend; } +interface ddeHTMLModElement extends HTMLModElement{ append: ddeAppend; } +interface ddeHTMLDetailsElement extends HTMLDetailsElement{ append: ddeAppend; } +interface ddeHTMLDialogElement extends HTMLDialogElement{ append: ddeAppend; } +interface ddeHTMLDivElement extends HTMLDivElement{ append: ddeAppend; } +interface ddeHTMLDListElement extends HTMLDListElement{ append: ddeAppend; } +interface ddeHTMLEmbedElement extends HTMLEmbedElement{ append: ddeAppend; } +interface ddeHTMLFieldSetElement extends HTMLFieldSetElement{ append: ddeAppend; } +interface ddeHTMLFormElement extends HTMLFormElement{ append: ddeAppend; } +interface ddeHTMLHeadingElement extends HTMLHeadingElement{ append: ddeAppend; } +interface ddeHTMLHeadElement extends HTMLHeadElement{ append: ddeAppend; } +interface ddeHTMLHRElement extends HTMLHRElement{ append: ddeAppend; } +interface ddeHTMLHtmlElement extends HTMLHtmlElement{ append: ddeAppend; } +interface ddeHTMLIFrameElement extends HTMLIFrameElement{ append: ddeAppend; } +interface ddeHTMLImageElement extends HTMLImageElement{ append: ddeAppend; } +interface ddeHTMLInputElement extends HTMLInputElement{ append: ddeAppend; } +interface ddeHTMLLabelElement extends HTMLLabelElement{ append: ddeAppend; } +interface ddeHTMLLegendElement extends HTMLLegendElement{ append: ddeAppend; } +interface ddeHTMLLIElement extends HTMLLIElement{ append: ddeAppend; } +interface ddeHTMLLinkElement extends HTMLLinkElement{ append: ddeAppend; } +interface ddeHTMLMapElement extends HTMLMapElement{ append: ddeAppend; } +interface ddeHTMLMenuElement extends HTMLMenuElement{ append: ddeAppend; } +interface ddeHTMLMetaElement extends HTMLMetaElement{ append: ddeAppend; } +interface ddeHTMLMeterElement extends HTMLMeterElement{ append: ddeAppend; } +interface ddeHTMLObjectElement extends HTMLObjectElement{ append: ddeAppend; } +interface ddeHTMLOListElement extends HTMLOListElement{ append: ddeAppend; } +interface ddeHTMLOptGroupElement extends HTMLOptGroupElement{ append: ddeAppend; } +interface ddeHTMLOptionElement extends HTMLOptionElement{ append: ddeAppend; } +interface ddeHTMLOutputElement extends HTMLOutputElement{ append: ddeAppend; } +interface ddeHTMLParagraphElement extends HTMLParagraphElement{ append: ddeAppend; } +interface ddeHTMLPictureElement extends HTMLPictureElement{ append: ddeAppend; } +interface ddeHTMLPreElement extends HTMLPreElement{ append: ddeAppend; } +interface ddeHTMLProgressElement extends HTMLProgressElement{ append: ddeAppend; } +interface ddeHTMLScriptElement extends HTMLScriptElement{ append: ddeAppend; } +interface ddeHTMLSelectElement extends HTMLSelectElement{ append: ddeAppend; } +interface ddeHTMLSlotElement extends HTMLSlotElement{ append: ddeAppend; } +interface ddeHTMLSourceElement extends HTMLSourceElement{ append: ddeAppend; } +interface ddeHTMLSpanElement extends HTMLSpanElement{ append: ddeAppend; } +interface ddeHTMLStyleElement extends HTMLStyleElement{ append: ddeAppend; } +interface ddeHTMLTableElement extends HTMLTableElement{ append: ddeAppend; } +interface ddeHTMLTableSectionElement extends HTMLTableSectionElement{ append: ddeAppend; } +interface ddeHTMLTableCellElement extends HTMLTableCellElement{ append: ddeAppend; } +interface ddeHTMLTemplateElement extends HTMLTemplateElement{ append: ddeAppend; } +interface ddeHTMLTextAreaElement extends HTMLTextAreaElement{ append: ddeAppend; } +interface ddeHTMLTableCellElement extends HTMLTableCellElement{ append: ddeAppend; } +interface ddeHTMLTimeElement extends HTMLTimeElement{ append: ddeAppend; } +interface ddeHTMLTitleElement extends HTMLTitleElement{ append: ddeAppend; } +interface ddeHTMLTableRowElement extends HTMLTableRowElement{ append: ddeAppend; } +interface ddeHTMLTrackElement extends HTMLTrackElement{ append: ddeAppend; } +interface ddeHTMLUListElement extends HTMLUListElement{ append: ddeAppend; } +interface ddeHTMLVideoElement extends HTMLVideoElement{ append: ddeAppend; } +interface ddeSVGAElement extends SVGAElement{ append: ddeAppend; } +interface ddeSVGAnimateElement extends SVGAnimateElement{ append: ddeAppend; } +interface ddeSVGAnimateMotionElement extends SVGAnimateMotionElement{ append: ddeAppend; } +interface ddeSVGAnimateTransformElement extends SVGAnimateTransformElement{ append: ddeAppend; } +interface ddeSVGCircleElement extends SVGCircleElement{ append: ddeAppend; } +interface ddeSVGClipPathElement extends SVGClipPathElement{ append: ddeAppend; } +interface ddeSVGDefsElement extends SVGDefsElement{ append: ddeAppend; } +interface ddeSVGDescElement extends SVGDescElement{ append: ddeAppend; } +interface ddeSVGEllipseElement extends SVGEllipseElement{ append: ddeAppend; } +interface ddeSVGFEBlendElement extends SVGFEBlendElement{ append: ddeAppend; } +interface ddeSVGFEColorMatrixElement extends SVGFEColorMatrixElement{ append: ddeAppend; } +interface ddeSVGFEComponentTransferElement extends SVGFEComponentTransferElement{ append: ddeAppend; } +interface ddeSVGFECompositeElement extends SVGFECompositeElement{ append: ddeAppend; } +interface ddeSVGFEConvolveMatrixElement extends SVGFEConvolveMatrixElement{ append: ddeAppend; } +interface ddeSVGFEDiffuseLightingElement extends SVGFEDiffuseLightingElement{ append: ddeAppend; } +interface ddeSVGFEDisplacementMapElement extends SVGFEDisplacementMapElement{ append: ddeAppend; } +interface ddeSVGFEDistantLightElement extends SVGFEDistantLightElement{ append: ddeAppend; } +interface ddeSVGFEDropShadowElement extends SVGFEDropShadowElement{ append: ddeAppend; } +interface ddeSVGFEFloodElement extends SVGFEFloodElement{ append: ddeAppend; } +interface ddeSVGFEFuncAElement extends SVGFEFuncAElement{ append: ddeAppend; } +interface ddeSVGFEFuncBElement extends SVGFEFuncBElement{ append: ddeAppend; } +interface ddeSVGFEFuncGElement extends SVGFEFuncGElement{ append: ddeAppend; } +interface ddeSVGFEFuncRElement extends SVGFEFuncRElement{ append: ddeAppend; } +interface ddeSVGFEGaussianBlurElement extends SVGFEGaussianBlurElement{ append: ddeAppend; } +interface ddeSVGFEImageElement extends SVGFEImageElement{ append: ddeAppend; } +interface ddeSVGFEMergeElement extends SVGFEMergeElement{ append: ddeAppend; } +interface ddeSVGFEMergeNodeElement extends SVGFEMergeNodeElement{ append: ddeAppend; } +interface ddeSVGFEMorphologyElement extends SVGFEMorphologyElement{ append: ddeAppend; } +interface ddeSVGFEOffsetElement extends SVGFEOffsetElement{ append: ddeAppend; } +interface ddeSVGFEPointLightElement extends SVGFEPointLightElement{ append: ddeAppend; } +interface ddeSVGFESpecularLightingElement extends SVGFESpecularLightingElement{ append: ddeAppend; } +interface ddeSVGFESpotLightElement extends SVGFESpotLightElement{ append: ddeAppend; } +interface ddeSVGFETileElement extends SVGFETileElement{ append: ddeAppend; } +interface ddeSVGFETurbulenceElement extends SVGFETurbulenceElement{ append: ddeAppend; } +interface ddeSVGFilterElement extends SVGFilterElement{ append: ddeAppend; } +interface ddeSVGForeignObjectElement extends SVGForeignObjectElement{ append: ddeAppend; } +interface ddeSVGGElement extends SVGGElement{ append: ddeAppend; } +interface ddeSVGImageElement extends SVGImageElement{ append: ddeAppend; } +interface ddeSVGLineElement extends SVGLineElement{ append: ddeAppend; } +interface ddeSVGLinearGradientElement extends SVGLinearGradientElement{ append: ddeAppend; } +interface ddeSVGMarkerElement extends SVGMarkerElement{ append: ddeAppend; } +interface ddeSVGMaskElement extends SVGMaskElement{ append: ddeAppend; } +interface ddeSVGMetadataElement extends SVGMetadataElement{ append: ddeAppend; } +interface ddeSVGMPathElement extends SVGMPathElement{ append: ddeAppend; } +interface ddeSVGPathElement extends SVGPathElement{ append: ddeAppend; } +interface ddeSVGPatternElement extends SVGPatternElement{ append: ddeAppend; } +interface ddeSVGPolygonElement extends SVGPolygonElement{ append: ddeAppend; } +interface ddeSVGPolylineElement extends SVGPolylineElement{ append: ddeAppend; } +interface ddeSVGRadialGradientElement extends SVGRadialGradientElement{ append: ddeAppend; } +interface ddeSVGRectElement extends SVGRectElement{ append: ddeAppend; } +interface ddeSVGScriptElement extends SVGScriptElement{ append: ddeAppend; } +interface ddeSVGSetElement extends SVGSetElement{ append: ddeAppend; } +interface ddeSVGStopElement extends SVGStopElement{ append: ddeAppend; } +interface ddeSVGStyleElement extends SVGStyleElement{ append: ddeAppend; } +interface ddeSVGSVGElement extends SVGSVGElement{ append: ddeAppend; } +interface ddeSVGSwitchElement extends SVGSwitchElement{ append: ddeAppend; } +interface ddeSVGSymbolElement extends SVGSymbolElement{ append: ddeAppend; } +interface ddeSVGTextElement extends SVGTextElement{ append: ddeAppend; } +interface ddeSVGTextPathElement extends SVGTextPathElement{ append: ddeAppend; } +interface ddeSVGTitleElement extends SVGTitleElement{ append: ddeAppend; } +interface ddeSVGTSpanElement extends SVGTSpanElement{ append: ddeAppend; } +interface ddeSVGUseElement extends SVGUseElement{ append: ddeAppend; } +interface ddeSVGViewElement extends SVGViewElement{ append: ddeAppend; } +// editorconfig-checker-enable +export interface Signal { + /** The current value of the signal */ + get(): V; + /** Set new value of the signal */ + set(value: V): V; + toJSON(): V; + valueOf(): V; +} +type Action= (this: { value: V, stopPropagation(): void }, ...a: any[])=> typeof signal._ | void; +//type SymbolSignal= Symbol; +type SymbolOnclear= symbol; +type Actions= Record>; +type OnListenerOptions= Pick & { first_time?: boolean }; +interface signal{ + _: Symbol + /** + * Computations signal. This creates a signal which is computed from other signals. + * */ + any>(computation: V): Signal, {}> + /** + * Simple example: + * ```js + * const hello= S("Hello Signal"); + * ``` + * …simple todo signal: + * ```js + * const todos= S([], { + * add(v){ this.value.push(S(v)); }, + * remove(i){ this.value.splice(i, 1); }, + * [S.symbols.onclear](){ S.clear(...this.value); }, + * }); + * ``` + * …computed signal: + * ```js + * const name= S("Jan"); + * const surname= S("Andrle"); + * const fullname= S(()=> name.get()+" "+surname.get()); + * ``` + * @param value Initial signal value. Or function computing value from other signals. + * @param actions Use to define actions on the signal. Such as add item to the array. + * There is also a reserved function `S.symbol.onclear` which is called when the signal is cleared + * by `S.clear`. + * */ + >(value: V, actions?: A): Signal; + action>, A extends (S extends Signal ? A : never), N extends keyof A>( + signal: S, + name: N, + ...params: A[N] extends (...args: infer P)=> any ? P : never + ): void; + clear(...signals: Signal[]): void; + on(signal: Signal, onchange: (a: T)=> void, options?: OnListenerOptions): void; + symbols: { + //signal: SymbolSignal; + onclear: SymbolOnclear; + } + /** + * Reactive element, which is rendered based on the given signal. + * ```js + * S.el(signal, value=> value ? el("b", "True") : el("i", "False")); + * S.el(listS, list=> list.map(li=> el("li", li))); + * ``` + * */ + el(signal: Signal, el: (v: S)=> Element | Element[] | DocumentFragment): DocumentFragment; + + observedAttributes(custom_element: HTMLElement): Record>; +} +export const signal: signal; +export const S: signal; +declare global { + type ddeSignal= Signal; + type ddeAction= Action + type ddeActions= Actions +} \ No newline at end of file diff --git a/dist/esm-with-signals.js b/dist/esm-with-signals.js index 510172c..be4f9b4 100644 --- a/dist/esm-with-signals.js +++ b/dist/esm-with-signals.js @@ -459,7 +459,6 @@ function connectionsChangesObserverConstructor() { offDisconnected(element, listener) { if (!store.has(element)) return; const ls = store.get(element); - if (!ls.disconnected.has(listener)) return; ls.disconnected.delete(listener); ls.length_d -= 1; cleanWhenOff(element, ls); diff --git a/dist/esm-with-signals.min.js b/dist/esm-with-signals.min.js new file mode 100644 index 0000000..5917dc5 --- /dev/null +++ b/dist/esm-with-signals.min.js @@ -0,0 +1,4 @@ +var V=(...t)=>Object.prototype.hasOwnProperty.call(...t);function O(t){return typeof t>"u"}function rt(t){let e=typeof t;return e!=="object"?e:t===null?"null":Object.prototype.toString.call(t)}function S(t,e){return t instanceof e}function F(t,e){return Object.prototype.isPrototypeOf.call(e,t)}function w(t=null,e={}){return Object.create(t,e)}function m(...t){return Object.assign(...t)}function I(t,e){if(!t||!S(t,AbortSignal))return!0;if(!t.aborted)return t.addEventListener("abort",e),function(){t.removeEventListener("abort",e)}}function $(t,e){let{observedAttributes:n=[]}=t.constructor;return n.reduce(function(r,o){return r[vt(o)]=e(t,o),r},{})}function vt(t){return t.replace(/-./g,e=>e[1].toUpperCase())}var P=class extends Error{constructor(){super();let[e,...n]=this.stack.split(` +`),r=e.slice(e.indexOf("@"),e.indexOf(".js:")+4),o=r.includes("src/helpers.js")?"src/":r;this.stack=n.find(c=>!c.includes(o))||e}get compact(){let{stack:e}=this;return e.slice(0,e.indexOf("@")+1)+"\u2026"+e.slice(e.lastIndexOf("/"))}};var j={isSignal(t){return!1},processReactiveAttribute(t,e,n,r){return n}};function K(t,e=!0){return e?m(j,t):(Object.setPrototypeOf(t,j),t)}function U(t){return F(t,j)&&t!==j?t:j}var d={setDeleteAttr:mt,ssr:"",D:globalThis.document,F:globalThis.DocumentFragment,H:globalThis.HTMLElement,S:globalThis.SVGElement,M:globalThis.MutationObserver,q:t=>t||Promise.resolve()};function mt(t,e,n){if(Reflect.set(t,e,n),!!O(n)){if(Reflect.deleteProperty(t,e),S(t,d.H)&&t.getAttribute(e)==="undefined")return t.removeAttribute(e);if(Reflect.get(t,e)==="undefined")return Reflect.set(t,e,"")}}var D="__dde_lifecyclesToEvents",y="dde:connected",R="dde:disconnected",q="dde:attributeChanged";function Bt(t){return d.q(t)}var C=[{get scope(){return d.D.body},host:t=>t?t(d.D.body):d.D.body,prevent:!0}],x={get current(){return C[C.length-1]},get host(){return this.current.host},preventDefault(){let{current:t}=this;return t.prevent=!0,t},get state(){return[...C]},push(t={}){return C.push(m({},this.current,{prevent:!1},t))},pushRoot(){return C.push(C[0])},pop(){if(C.length!==1)return C.pop()}};function ot(...t){return this.appendOriginal(...t),this}function xt(t){return t.append===ot||(t.appendOriginal=t.append,t.append=ot),t}var H;function W(t,e,...n){let r=U(this),o=0,c,s;switch((Object(e)!==e||r.isSignal(e))&&(e={textContent:e}),!0){case typeof t=="function":{o=1;let i=(...h)=>h.length?(o===1?n.unshift(...h):h.forEach(v=>v(s)),void 0):s;x.push({scope:t,host:i}),c=t(e||void 0);let p=S(c,d.F);if(c.nodeName==="#comment")break;let E=W.mark({type:"component",name:t.name,host:p?"this":"parentElement"});c.prepend(E),p&&(s=E);break}case t==="#text":c=z.call(this,d.D.createTextNode(""),e);break;case(t==="<>"||!t):c=z.call(this,d.D.createDocumentFragment(),e);break;case!!H:c=z.call(this,d.D.createElementNS(H,t),e);break;case!c:c=z.call(this,d.D.createElement(t),e)}return xt(c),s||(s=c),n.forEach(i=>i(s)),o&&x.pop(),o=2,c}W.mark=function(t,e=!1){t=Object.entries(t).map(([o,c])=>o+`="${c}"`).join(" ");let n=e?"":"/",r=d.D.createComment(``);return e&&(r.end=d.D.createComment("")),r};function Jt(t){let e=this;return function(...r){H=t;let o=W.call(e,...r);return H=void 0,o}}function Zt(t,e=t){let n="\xB9\u2070",r="\u2713",o=Object.fromEntries(Array.from(e.querySelectorAll("slot")).filter(c=>!c.name.endsWith(n)).map(c=>[c.name+=n,c]));if(t.append=new Proxy(t.append,{apply(c,s,i){if(i[0]===e)return c.apply(t,i);for(let p of i){let E=(p.slot||"")+n;try{_t(p,"remove","slot")}catch{}let h=o[E];if(!h)return;h.name.startsWith(r)||(h.childNodes.forEach(v=>v.remove()),h.name=r+E),h.append(p)}return t.append=c,t}}),t!==e){let c=Array.from(t.childNodes);t.append(...c)}return e}var B=new WeakMap,{setDeleteAttr:ct}=d;function z(t,...e){if(!e.length)return t;B.set(t,ut(t,this));for(let[n,r]of Object.entries(m({},...e)))it.call(this,t,n,r);return B.delete(t),t}function it(t,e,n){let{setRemoveAttr:r,s:o}=ut(t,this),c=this;n=o.processReactiveAttribute(t,e,n,(i,p)=>it.call(c,t,i,p));let[s]=e;if(s==="=")return r(e.slice(1),n);if(s===".")return st(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 ct(t,e,n);case"style":if(typeof n!="object")break;case"dataset":return Q(o,e,t,n,st.bind(null,t[e]));case"ariaset":return Q(o,e,t,n,(i,p)=>r("aria-"+i,p));case"classList":return Et.call(c,t,n)}return St(t,e)?ct(t,e,n):r(e,n)}function ut(t,e){if(B.has(t))return B.get(t);let r=(S(t,d.S)?At:wt).bind(null,t,"Attribute"),o=U(e);return{setRemoveAttr:r,s:o}}function Et(t,e){let n=U(this);return Q(n,"classList",t,e,(r,o)=>t.classList.toggle(r,o===-1?void 0:!!o)),t}function _t(t,e,n,r){return S(t,d.H)?t[e+"Attribute"](n,r):t[e+"AttributeNS"](null,n,r)}function St(t,e){if(!(e in t))return!1;let n=ft(t,e);return!O(n.set)}function ft(t,e){if(t=Object.getPrototypeOf(t),!t)return{};let n=Object.getOwnPropertyDescriptor(t,e);return n||ft(t,e)}function Q(t,e,n,r,o){let c=String;if(!(typeof r!="object"||r===null))return Object.entries(r).forEach(function([i,p]){i&&(i=new c(i),i.target=e,p=t.processReactiveAttribute(n,i,p,o),o(i,p))})}function wt(t,e,n,r){return t[(O(r)?"remove":"set")+e](n,r)}function At(t,e,n,r,o=null){return t[(O(r)?"remove":"set")+e+"NS"](o,n,r)}function st(t,e,n){if(Reflect.set(t,e,n),!!O(n))return Reflect.deleteProperty(t,e)}var L=d.M?yt():new Proxy({},{get(){return()=>{}}});function yt(){let t=new Map,e=!1,n=u=>function(a){for(let f of a)if(f.type==="childList"){if(h(f.addedNodes,!0)){u();continue}v(f.removedNodes,!0)&&u()}},r=new d.M(n(i));return{observe(u){let a=new d.M(n(()=>{}));return a.observe(u,{childList:!0,subtree:!0}),()=>a.disconnect()},onConnected(u,a){s();let f=c(u);f.connected.has(a)||(f.connected.add(a),f.length_c+=1)},offConnected(u,a){if(!t.has(u))return;let f=t.get(u);f.connected.has(a)&&(f.connected.delete(a),f.length_c-=1,o(u,f))},onDisconnected(u,a){s();let f=c(u);f.disconnected.has(a)||(f.disconnected.add(a),f.length_d+=1)},offDisconnected(u,a){if(!t.has(u))return;let f=t.get(u);f.disconnected.delete(a),f.length_d-=1,o(u,f)}};function o(u,a){a.length_c||a.length_d||(t.delete(u),i())}function c(u){if(t.has(u))return t.get(u);let a={connected:new WeakSet,length_c:0,disconnected:new WeakSet,length_d:0};return t.set(u,a),a}function s(){e||(e=!0,r.observe(d.D.body,{childList:!0,subtree:!0}))}function i(){!e||t.size||(e=!1,r.disconnect())}function p(){return new Promise(function(u){(requestIdleCallback||requestAnimationFrame)(u)})}async function E(u){t.size>30&&await p();let a=[];if(!S(u,Node))return a;for(let f of t.keys())f===u||!S(f,Node)||u.contains(f)&&a.push(f);return a}function h(u,a){let f=!1;for(let _ of u){if(a&&E(_).then(h),!t.has(_))continue;let T=t.get(_);T.length_c&&(_.dispatchEvent(new Event(y)),T.connected=new WeakSet,T.length_c=0,T.length_d||t.delete(_),f=!0)}return f}function v(u,a){let f=!1;for(let _ of u)a&&E(_).then(v),!(!t.has(_)||!t.get(_).length_d)&&((globalThis.queueMicrotask||setTimeout)(N(_)),f=!0);return f}function N(u){return()=>{u.isConnected||(u.dispatchEvent(new Event(R)),t.delete(u))}}}function ee(t,e,n=Ot){let r=t.host||t;x.push({scope:r,host:(...s)=>s.length?s.forEach(i=>i(r)):r}),typeof n=="function"&&(n=n.call(r,r));let o=r[D];o||Ct(r);let c=e.call(r,n);return o||r.dispatchEvent(new Event(y)),t.nodeType===11&&typeof t.mode=="string"&&r.addEventListener(R,L.observe(t),{once:!0}),x.pop(),t.append(c)}function Ct(t){return X(t.prototype,"connectedCallback",function(e,n,r){e.apply(n,r),n.dispatchEvent(new Event(y))}),X(t.prototype,"disconnectedCallback",function(e,n,r){e.apply(n,r),(globalThis.queueMicrotask||setTimeout)(()=>!n.isConnected&&n.dispatchEvent(new Event(R)))}),X(t.prototype,"attributeChangedCallback",function(e,n,r){let[o,,c]=r;n.dispatchEvent(new CustomEvent(q,{detail:[o,c]})),e.apply(n,r)}),t.prototype[D]=!0,t}function X(t,e,n){t[e]=new Proxy(t[e]||(()=>{}),{apply:n})}function Ot(t){return $(t,(e,n)=>e.getAttribute(n))}function se(t,e,n){return e||(e={}),function(o,...c){n&&(c.unshift(o),o=typeof n=="function"?n():n);let s=c.length?new CustomEvent(t,m({detail:c[0]},e)):new Event(t,e);return o.dispatchEvent(s)}}function A(t,e,n){return function(o){return o.addEventListener(t,e,n),o}}var at=t=>m({},typeof t=="object"?t:null,{once:!0});A.connected=function(t,e){return e=at(e),function(r){return r.addEventListener(y,t,e),r[D]?r:r.isConnected?(r.dispatchEvent(new Event(y)),r):(I(e.signal,()=>L.offConnected(r,t))&&L.onConnected(r,t),r)}};A.disconnected=function(t,e){return e=at(e),function(r){return r.addEventListener(R,t,e),r[D]||I(e.signal,()=>L.offDisconnected(r,t))&&L.onDisconnected(r,t),r}};var Y=new WeakMap;A.disconnectedAsAbort=function(t){if(Y.has(t))return Y.get(t);let e=new AbortController;return Y.set(t,e),t(A.disconnected(()=>e.abort())),e};var Dt=new WeakSet;A.attributeChanged=function(t,e){return typeof e!="object"&&(e={}),function(r){if(r.addEventListener(q,t,e),r[D]||Dt.has(r)||!d.M)return r;let o=new d.M(function(s){for(let{attributeName:i,target:p}of s)p.dispatchEvent(new CustomEvent(q,{detail:[i,p.getAttribute(i)]}))});return I(e.signal,()=>o.disconnect())&&o.observe(r,{attributes:!0}),r}};var l="__dde_signal",tt=(()=>{let t=new Set,e=!1;function n(){e=!1;let r=t;t=new Set;for(let o of r){let c=o[l];c&&c.listeners.forEach(s=>s(c.value))}}return function(r){t.add(r),!e&&(e=!0,queueMicrotask(n))}})();var G=w(null,{get:{value(){return pt(this)}},set:{value(...t){return bt(this,...t)}},toJSON:{value(){return pt(this)}},valueOf:{value(){return this[l]&&this[l].value}}}),Rt=w(G,{set:{value(){}}});function J(t){return F(t,G)}var Z=[],b=new WeakMap;function g(t,e){if(typeof t!="function")return dt(!1,t,e);if(J(t))return t;let n=dt(!0);function r(){let[o,...c]=b.get(r);if(b.set(r,new Set([o])),Z.push(r),bt(n,t()),Z.pop(),!c.length)return;let s=b.get(r);for(let i of c)s.has(i)||M(i,r)}return b.set(n[l],r),b.set(r,new Set([n])),r(),n}g.action=function(t,e,...n){let r=t[l];if(!r)return;let{actions:o}=r;if(!o||!V(o,e))throw new Error(`Action "${e}" not defined. See ${l}.actions.`);if(o[e].apply(r,n),r.skip)return delete r.skip;tt(t)};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));nt(e,n),o&&o.addEventListener("abort",()=>M(e,n))}};g.symbols={onclear:Symbol.for("Signal.onclear")};g.clear=function(...t){for(let n of t){let r=n[l];r&&(delete n.toJSON,r.onclear.forEach(o=>o.call(r)),e(n,r),delete n[l])}function e(n,r){r.listeners.forEach(o=>{if(r.listeners.delete(o),!b.has(o))return;let c=b.get(o);c.delete(n),!(c.size>1)&&(n.clear(...c),b.delete(o))})}};var k="__dde_reactive";function Lt(t=w()){return(e,n)=>V(t,e)?t[e]:t[e]=n()}g.el=function(t,e){let n=W.mark({type:"reactive",source:new P().compact},!0),r=n.end,o=d.D.createDocumentFragment();o.append(n,r);let{current:c}=x,s=w(),i=p=>{if(!n.parentNode||!r.parentNode)return M(t,i);let E=Lt(s);s=w(),x.push(c);let h=e(p,function(a,f){return s[a]=E(a,f)});x.pop(),Array.isArray(h)||(h=[h]);let v=document.createComment("");h.push(v),n.after(...h);let N;for(;(N=v.nextSibling)&&N!==r;)N.remove();v.remove(),n.isConnected&&kt(c.host())};return nt(t,i),ht(t,i,n,e),i(t.get()),c.host(A.disconnected(()=>s={})),o};function kt(t){!t||!t[k]||(requestIdleCallback||setTimeout)(function(){t[k]=t[k].filter(([e,n])=>n.isConnected?!0:(M(...e),!1))})}var Mt={_set(t){this.value=t}};function Nt(t){return function(e,n){let r=w(G,{set:{value(...c){return e.setAttribute(n,...c)}}}),o=gt(r,e.getAttribute(n),Mt);return t[n]=o,o}}var et="__dde_attributes";g.observedAttributes=function(t){let e=t[et]={},n=$(t,Nt(e));return A.attributeChanged(function({detail:o}){/*! This maps attributes to signals (`S.observedAttributes`). + Investigate `__dde_attributes` key of the element. */let[c,s]=o,i=this[et][c];if(i)return g.action(i,"_set",s)})(t),A.disconnected(function(){/*! This removes all signals mapped to attributes (`S.observedAttributes`). + Investigate `__dde_attributes` key of the element. */g.clear(...Object.values(this[et]))})(t),n};var lt={isSignal:J,processReactiveAttribute(t,e,n,r){if(!J(n))return n;let o=c=>{if(!t.isConnected)return M(n,o);r(e,c)};return nt(n,o),ht(n,o,t,e),n.get()}};function ht(t,e,...n){let{current:r}=x;r.host(function(o){if(o[k])return o[k].push([[t,e],...n]);o[k]=[],!r.prevent&&A.disconnected(()=>o[k].forEach(([[c,s]])=>M(c,s,c[l]&&c[l].host&&c[l].host()===o)))(o)})}var Tt=new FinalizationRegistry(function(t){g.clear({[l]:t})});function dt(t,e,n){let r=w(t?Rt:G),o=gt(r,e,n,t);return Tt.register(o,o[l]),o}var Pt=m(w(),{stopPropagation(){this.skip=!0}});function gt(t,e,n,r=!1){let o=[];rt(n)!=="[object Object]"&&(n={});let{onclear:c}=g.symbols;n[c]&&(o.push(n[c]),delete n[c]);let{host:s}=x;return Reflect.defineProperty(t,l,{value:m(w(Pt),{value:e,actions:n,onclear:o,host:s,listeners:new Set,defined:new P().stack,readonly:r}),enumerable:!1,writable:!1,configurable:!0}),t}function jt(){return Z[Z.length-1]}function pt(t){if(!t[l])return;let{value:e,listeners:n}=t[l],r=jt();return r&&n.add(r),b.has(r)&&b.get(r).add(t),e}function bt(t,e,n){let r=t[l];if(!(!r||!n&&r.value===e))return r.value=e,tt(t),e}function nt(t,e){if(t[l])return t[l].listeners.add(e)}function M(t,e,n){let r=t[l];if(!r)return;let{listeners:o}=r,c=o.delete(e);if(!c||!n||o.size)return c;g.clear(t);let s=b.get(r);if(!s)return c;let i=b.get(s);if(!i)return c;for(let p of i)M(p,s,!0);return c}K(lt);export{g as S,z as assign,it as assignAttribute,xt as chainableAppend,Et as classListDeclarative,W as createElement,Jt as createElementNS,ee as customElementRender,Ct as customElementWithDDE,se as dispatchEvent,W as el,Jt as elNS,_t as elementAttribute,J as isSignal,Ct as lifecyclesToEvents,Ot as observedAttributes,A as on,Bt as queue,K as registerReactivity,x as scope,g as signal,Zt as simulateSlots}; diff --git a/dist/esm.d.min.ts b/dist/esm.d.min.ts new file mode 100644 index 0000000..efa2424 --- /dev/null +++ b/dist/esm.d.min.ts @@ -0,0 +1,520 @@ +declare global{ /* ddeSignal */ } +type CustomElementTagNameMap= { '#text': Text, '#comment': Comment } +type SupportedElement= + HTMLElementTagNameMap[keyof HTMLElementTagNameMap] + | SVGElementTagNameMap[keyof SVGElementTagNameMap] + | MathMLElementTagNameMap[keyof MathMLElementTagNameMap] + | CustomElementTagNameMap[keyof CustomElementTagNameMap] +declare global { + type ddeComponentAttributes= Record | undefined; + type ddeElementAddon= (element: El)=> any; + type ddeString= string | ddeSignal + type ddeStringable= ddeString | number | ddeSignal +} +type PascalCase= +`${Capitalize}${string}`; +type AttrsModified= { + /** + * Use string like in HTML (internally uses `*.setAttribute("style", *)`), or object representation (like DOM API). + */ + style: Partial | ddeString + | Partial<{ [K in keyof CSSStyleDeclaration]: ddeSignal }> + /** + * Provide option to add/remove/toggle CSS clasess (index of object) using 1/0/-1. + * In fact `el.classList.toggle(class_name)` for `-1` and `el.classList.toggle(class_name, Boolean(...))` + * for others. + */ + classList: Record>, + /** + * Used by the dataset HTML attribute to represent data for custom attributes added to elements. + * Values are converted to string (see {@link DOMStringMap}). + * + * [MDN Reference](https://developer.mozilla.org/docs/Web/API/DOMStringMap) + * */ + dataset: Record, + /** + * Sets `aria-*` simiraly to `dataset` + * */ + ariaset: Record, +} & Record<`=${string}` | `data${PascalCase}` | `aria${PascalCase}`, ddeString> + & Record<`.${string}`, any> +type _fromElsInterfaces= Omit; +type IsReadonly = + T extends { readonly [P in K]: T[K] } ? true : false; +/** + * Just element attributtes + * + * In most cases, you can use native propertie such as + * [MDN WEB/API/Element](https://developer.mozilla.org/en-US/docs/Web/API/Element) and so on + * (e.g. [`Text`](https://developer.mozilla.org/en-US/docs/Web/API/Text)). + * + * There is added support for `data[A-Z].*`/`aria[A-Z].*` to be converted to the kebab-case alternatives. + * @private + */ +type ElementAttributes= Partial<{ + [K in keyof _fromElsInterfaces]: + _fromElsInterfaces[K] extends ((...p: any[])=> any) + ? _fromElsInterfaces[K] | ((...p: Parameters<_fromElsInterfaces[K]>)=> ddeSignal[K]>>) + : (IsReadonly<_fromElsInterfaces, K> extends false + ? _fromElsInterfaces[K] | ddeSignal<_fromElsInterfaces[K]> + : ddeStringable) +} & AttrsModified> & Record; +export function classListDeclarative( + element: El, + classList: AttrsModified["classList"] +): El +export function assign(element: El, ...attrs_array: ElementAttributes[]): El +export function assignAttribute>( + element: El, + attr: ATT, + value: ElementAttributes[ATT] +): ElementAttributes[ATT] + +type ExtendedHTMLElementTagNameMap= HTMLElementTagNameMap & CustomElementTagNameMap; +export function el< + TAG extends keyof ExtendedHTMLElementTagNameMap, +>( + tag_name: TAG, + attrs?: ElementAttributes]> | ddeStringable, + ...addons: ddeElementAddon< + ExtendedHTMLElementTagNameMap[NoInfer] + >[], // TODO: for now addons must have the same element +): TAG extends keyof ddeHTMLElementTagNameMap ? ddeHTMLElementTagNameMap[TAG] : ddeHTMLElement +export function el( + tag_name?: "<>", +): ddeDocumentFragment +export function el( + tag_name: string, + attrs?: ElementAttributes | ddeStringable, + ...addons: ddeElementAddon[] +): ddeHTMLElement + +export function el< + C extends (attr: ddeComponentAttributes)=> SupportedElement | ddeDocumentFragment +>( + component: C, + attrs?: Parameters[0] | ddeStringable, + ...addons: ddeElementAddon>[] +): ReturnType extends ddeHTMLElementTagNameMap[keyof ddeHTMLElementTagNameMap] + ? ReturnType + : ( ReturnType extends ddeDocumentFragment ? ReturnType : ddeHTMLElement ) +export { el as createElement } + +export function elNS( + namespace: "http://www.w3.org/2000/svg" +): < + TAG extends keyof SVGElementTagNameMap & string, + EL extends ( TAG extends keyof SVGElementTagNameMap ? SVGElementTagNameMap[TAG] : SVGElement ), +>( + tag_name: TAG, + attrs?: ElementAttributes> | ddeStringable, + ...addons: ddeElementAddon>[] +)=> TAG extends keyof ddeSVGElementTagNameMap ? ddeSVGElementTagNameMap[TAG] : ddeSVGElement +export function elNS( + namespace: "http://www.w3.org/1998/Math/MathML" +): < + TAG extends keyof MathMLElementTagNameMap & string, + EL extends ( TAG extends keyof MathMLElementTagNameMap ? MathMLElementTagNameMap[TAG] : MathMLElement ), +>( + tag_name: TAG, + attrs?: ddeStringable | Partial<{ + [key in keyof EL]: EL[key] | ddeSignal | string | number | boolean + }>, + ...addons: ddeElementAddon>[] +)=> ddeMathMLElement +export function elNS( + namespace: string +): ( + tag_name: string, + attrs?: string | ddeStringable | Record, + ...addons: ddeElementAddon[] +)=> SupportedElement +export { elNS as createElementNS } + +export function chainableAppend(el: EL): EL; +/** Simulate slots for ddeComponents */ +export function simulateSlots( + root: EL, +): EL +/** + * Simulate slots in Custom Elements without using `shadowRoot`. + * @param el Custom Element root element + * @param body Body of the custom element + * */ +export function simulateSlots( + el: HTMLElement, + body: EL, +): EL + +export function dispatchEvent(name: keyof DocumentEventMap | string, options?: EventInit): + (element: SupportedElement, data?: any)=> void; +export function dispatchEvent( + name: keyof DocumentEventMap | string, + options: EventInit | null, + element: SupportedElement | (()=> SupportedElement) +): (data?: any)=> void; +interface On{ + /** Listens to the DOM event. See {@link Document.addEventListener} */ + < + Event extends keyof DocumentEventMap, + EE extends ddeElementAddon= ddeElementAddon, + >( + type: Event, + listener: (this: EE extends ddeElementAddon ? El : never, ev: DocumentEventMap[Event]) => any, + options?: AddEventListenerOptions + ) : EE; + < + EE extends ddeElementAddon= ddeElementAddon, + >( + type: string, + listener: (this: EE extends ddeElementAddon ? El : never, ev: Event | CustomEvent ) => any, + options?: AddEventListenerOptions + ) : EE; + /** Listens to the element is connected to the live DOM. In case of custom elements uses [`connectedCallback`](https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_custom_elements#custom_element_lifecycle_callbacks), or {@link MutationObserver} else where */// editorconfig-checker-disable-line + connected< + EE extends ddeElementAddon, + El extends ( EE extends ddeElementAddon ? El : never ) + >( + listener: (this: El, event: CustomEvent) => any, + options?: AddEventListenerOptions + ) : EE; + /** Listens to the element is disconnected from the live DOM. In case of custom elements uses [`disconnectedCallback`](https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_custom_elements#custom_element_lifecycle_callbacks), or {@link MutationObserver} else where */// editorconfig-checker-disable-line + disconnected< + EE extends ddeElementAddon, + El extends ( EE extends ddeElementAddon ? El : never ) + >( + listener: (this: El, event: CustomEvent) => any, + options?: AddEventListenerOptions + ) : EE; + /** Listens to the element attribute changes. In case of custom elements uses [`attributeChangedCallback`](https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_custom_elements#custom_element_lifecycle_callbacks), or {@link MutationObserver} else where */// editorconfig-checker-disable-line + attributeChanged< + EE extends ddeElementAddon, + El extends ( EE extends ddeElementAddon ? El : never ) + >( + listener: (this: El, event: CustomEvent<[ string, string ]>) => any, + options?: AddEventListenerOptions + ) : EE; +} +export const on: On; + +type Scope= { + scope: Node | Function | Object, + host: ddeElementAddon, + custom_element: false | HTMLElement, + prevent: boolean +}; +/** Current scope created last time the `el(Function)` was invoke. (Or {@link scope.push}) */ +export const scope: { + current: Scope, + /** Stops all automatizations. E. g. signals used as attributes in current scope + * registers removing these listeners (and clean signal if no other listeners are detected) + * on `disconnected` event. */ + preventDefault(prevent: T): T, + /** + * This represents reference to the current host element — `scope.host()`. + * It can be also used to register Addon(s) (functions to be called when component is initized) + * — `scope.host(on.connected(console.log))`. + * */ + host: (...addons: ddeElementAddon[])=> HTMLElement, + + state: Scope[], + /** Adds new child scope. All attributes are inherited by default. */ + push(scope: Partial): ReturnType["push"]>, + /** Adds root scope as a child of the current scope. */ + pushRoot(): ReturnType["push"]>, + /** Removes last/current child scope. */ + pop(): ReturnType["pop"]>, +}; + +export function customElementRender< + EL extends HTMLElement, + P extends any = Record> +>( + target: ShadowRoot | EL, + render: (props: P)=> SupportedElement | DocumentFragment, + props?: P | ((el: EL)=> P) +): EL +export function customElementWithDDE HTMLElement)>(custom_element: EL): EL +export function lifecyclesToEvents HTMLElement)>(custom_element: EL): EL +export function observedAttributes(custom_element: HTMLElement): Record + +/* TypeScript MEH */ +declare global{ + type ddeAppend= (...nodes: (Node | string)[])=> el; + + interface ddeDocumentFragment extends DocumentFragment{ append: ddeAppend; } + interface ddeHTMLElement extends HTMLElement{ append: ddeAppend; } + interface ddeSVGElement extends SVGElement{ append: ddeAppend; } + interface ddeMathMLElement extends MathMLElement{ append: ddeAppend; } + + interface ddeHTMLElementTagNameMap { + "a": ddeHTMLAnchorElement; + "area": ddeHTMLAreaElement; + "audio": ddeHTMLAudioElement; + "base": ddeHTMLBaseElement; + "blockquote": ddeHTMLQuoteElement; + "body": ddeHTMLBodyElement; + "br": ddeHTMLBRElement; + "button": ddeHTMLButtonElement; + "canvas": ddeHTMLCanvasElement; + "caption": ddeHTMLTableCaptionElement; + "col": ddeHTMLTableColElement; + "colgroup": ddeHTMLTableColElement; + "data": ddeHTMLDataElement; + "datalist": ddeHTMLDataListElement; + "del": ddeHTMLModElement; + "details": ddeHTMLDetailsElement; + "dialog": ddeHTMLDialogElement; + "div": ddeHTMLDivElement; + "dl": ddeHTMLDListElement; + "embed": ddeHTMLEmbedElement; + "fieldset": ddeHTMLFieldSetElement; + "form": ddeHTMLFormElement; + "h1": ddeHTMLHeadingElement; + "h2": ddeHTMLHeadingElement; + "h3": ddeHTMLHeadingElement; + "h4": ddeHTMLHeadingElement; + "h5": ddeHTMLHeadingElement; + "h6": ddeHTMLHeadingElement; + "head": ddeHTMLHeadElement; + "hr": ddeHTMLHRElement; + "html": ddeHTMLHtmlElement; + "iframe": ddeHTMLIFrameElement; + "img": ddeHTMLImageElement; + "input": ddeHTMLInputElement; + "ins": ddeHTMLModElement; + "label": ddeHTMLLabelElement; + "legend": ddeHTMLLegendElement; + "li": ddeHTMLLIElement; + "link": ddeHTMLLinkElement; + "map": ddeHTMLMapElement; + "menu": ddeHTMLMenuElement; + "meta": ddeHTMLMetaElement; + "meter": ddeHTMLMeterElement; + "object": ddeHTMLObjectElement; + "ol": ddeHTMLOListElement; + "optgroup": ddeHTMLOptGroupElement; + "option": ddeHTMLOptionElement; + "output": ddeHTMLOutputElement; + "p": ddeHTMLParagraphElement; + "picture": ddeHTMLPictureElement; + "pre": ddeHTMLPreElement; + "progress": ddeHTMLProgressElement; + "q": ddeHTMLQuoteElement; + "script": ddeHTMLScriptElement; + "select": ddeHTMLSelectElement; + "slot": ddeHTMLSlotElement; + "source": ddeHTMLSourceElement; + "span": ddeHTMLSpanElement; + "style": ddeHTMLStyleElement; + "table": ddeHTMLTableElement; + "tbody": ddeHTMLTableSectionElement; + "td": ddeHTMLTableCellElement; + "template": ddeHTMLTemplateElement; + "textarea": ddeHTMLTextAreaElement; + "tfoot": ddeHTMLTableSectionElement; + "th": ddeHTMLTableCellElement; + "thead": ddeHTMLTableSectionElement; + "time": ddeHTMLTimeElement; + "title": ddeHTMLTitleElement; + "tr": ddeHTMLTableRowElement; + "track": ddeHTMLTrackElement; + "ul": ddeHTMLUListElement; + "video": ddeHTMLVideoElement; + } + interface ddeSVGElementTagNameMap { + "a": ddeSVGAElement; + "animate": ddeSVGAnimateElement; + "animateMotion": ddeSVGAnimateMotionElement; + "animateTransform": ddeSVGAnimateTransformElement; + "circle": ddeSVGCircleElement; + "clipPath": ddeSVGClipPathElement; + "defs": ddeSVGDefsElement; + "desc": ddeSVGDescElement; + "ellipse": ddeSVGEllipseElement; + "feBlend": ddeSVGFEBlendElement; + "feColorMatrix": ddeSVGFEColorMatrixElement; + "feComponentTransfer": ddeSVGFEComponentTransferElement; + "feComposite": ddeSVGFECompositeElement; + "feConvolveMatrix": ddeSVGFEConvolveMatrixElement; + "feDiffuseLighting": ddeSVGFEDiffuseLightingElement; + "feDisplacementMap": ddeSVGFEDisplacementMapElement; + "feDistantLight": ddeSVGFEDistantLightElement; + "feDropShadow": ddeSVGFEDropShadowElement; + "feFlood": ddeSVGFEFloodElement; + "feFuncA": ddeSVGFEFuncAElement; + "feFuncB": ddeSVGFEFuncBElement; + "feFuncG": ddeSVGFEFuncGElement; + "feFuncR": ddeSVGFEFuncRElement; + "feGaussianBlur": ddeSVGFEGaussianBlurElement; + "feImage": ddeSVGFEImageElement; + "feMerge": ddeSVGFEMergeElement; + "feMergeNode": ddeSVGFEMergeNodeElement; + "feMorphology": ddeSVGFEMorphologyElement; + "feOffset": ddeSVGFEOffsetElement; + "fePointLight": ddeSVGFEPointLightElement; + "feSpecularLighting": ddeSVGFESpecularLightingElement; + "feSpotLight": ddeSVGFESpotLightElement; + "feTile": ddeSVGFETileElement; + "feTurbulence": ddeSVGFETurbulenceElement; + "filter": ddeSVGFilterElement; + "foreignObject": ddeSVGForeignObjectElement; + "g": ddeSVGGElement; + "image": ddeSVGImageElement; + "line": ddeSVGLineElement; + "linearGradient": ddeSVGLinearGradientElement; + "marker": ddeSVGMarkerElement; + "mask": ddeSVGMaskElement; + "metadata": ddeSVGMetadataElement; + "mpath": ddeSVGMPathElement; + "path": ddeSVGPathElement; + "pattern": ddeSVGPatternElement; + "polygon": ddeSVGPolygonElement; + "polyline": ddeSVGPolylineElement; + "radialGradient": ddeSVGRadialGradientElement; + "rect": ddeSVGRectElement; + "script": ddeSVGScriptElement; + "set": ddeSVGSetElement; + "stop": ddeSVGStopElement; + "style": ddeSVGStyleElement; + "svg": ddeSVGSVGElement; + "switch": ddeSVGSwitchElement; + "symbol": ddeSVGSymbolElement; + "text": ddeSVGTextElement; + "textPath": ddeSVGTextPathElement; + "title": ddeSVGTitleElement; + "tspan": ddeSVGTSpanElement; + "use": ddeSVGUseElement; + "view": ddeSVGViewElement; + } +} + +// editorconfig-checker-disable +interface ddeHTMLAnchorElement extends HTMLAnchorElement{ append: ddeAppend; } +interface ddeHTMLAreaElement extends HTMLAreaElement{ append: ddeAppend; } +interface ddeHTMLAudioElement extends HTMLAudioElement{ append: ddeAppend; } +interface ddeHTMLBaseElement extends HTMLBaseElement{ append: ddeAppend; } +interface ddeHTMLQuoteElement extends HTMLQuoteElement{ append: ddeAppend; } +interface ddeHTMLBodyElement extends HTMLBodyElement{ append: ddeAppend; } +interface ddeHTMLBRElement extends HTMLBRElement{ append: ddeAppend; } +interface ddeHTMLButtonElement extends HTMLButtonElement{ append: ddeAppend; } +interface ddeHTMLCanvasElement extends HTMLCanvasElement{ append: ddeAppend; } +interface ddeHTMLTableCaptionElement extends HTMLTableCaptionElement{ append: ddeAppend; } +interface ddeHTMLTableColElement extends HTMLTableColElement{ append: ddeAppend; } +interface ddeHTMLTableColElement extends HTMLTableColElement{ append: ddeAppend; } +interface ddeHTMLDataElement extends HTMLDataElement{ append: ddeAppend; } +interface ddeHTMLDataListElement extends HTMLDataListElement{ append: ddeAppend; } +interface ddeHTMLModElement extends HTMLModElement{ append: ddeAppend; } +interface ddeHTMLDetailsElement extends HTMLDetailsElement{ append: ddeAppend; } +interface ddeHTMLDialogElement extends HTMLDialogElement{ append: ddeAppend; } +interface ddeHTMLDivElement extends HTMLDivElement{ append: ddeAppend; } +interface ddeHTMLDListElement extends HTMLDListElement{ append: ddeAppend; } +interface ddeHTMLEmbedElement extends HTMLEmbedElement{ append: ddeAppend; } +interface ddeHTMLFieldSetElement extends HTMLFieldSetElement{ append: ddeAppend; } +interface ddeHTMLFormElement extends HTMLFormElement{ append: ddeAppend; } +interface ddeHTMLHeadingElement extends HTMLHeadingElement{ append: ddeAppend; } +interface ddeHTMLHeadElement extends HTMLHeadElement{ append: ddeAppend; } +interface ddeHTMLHRElement extends HTMLHRElement{ append: ddeAppend; } +interface ddeHTMLHtmlElement extends HTMLHtmlElement{ append: ddeAppend; } +interface ddeHTMLIFrameElement extends HTMLIFrameElement{ append: ddeAppend; } +interface ddeHTMLImageElement extends HTMLImageElement{ append: ddeAppend; } +interface ddeHTMLInputElement extends HTMLInputElement{ append: ddeAppend; } +interface ddeHTMLLabelElement extends HTMLLabelElement{ append: ddeAppend; } +interface ddeHTMLLegendElement extends HTMLLegendElement{ append: ddeAppend; } +interface ddeHTMLLIElement extends HTMLLIElement{ append: ddeAppend; } +interface ddeHTMLLinkElement extends HTMLLinkElement{ append: ddeAppend; } +interface ddeHTMLMapElement extends HTMLMapElement{ append: ddeAppend; } +interface ddeHTMLMenuElement extends HTMLMenuElement{ append: ddeAppend; } +interface ddeHTMLMetaElement extends HTMLMetaElement{ append: ddeAppend; } +interface ddeHTMLMeterElement extends HTMLMeterElement{ append: ddeAppend; } +interface ddeHTMLObjectElement extends HTMLObjectElement{ append: ddeAppend; } +interface ddeHTMLOListElement extends HTMLOListElement{ append: ddeAppend; } +interface ddeHTMLOptGroupElement extends HTMLOptGroupElement{ append: ddeAppend; } +interface ddeHTMLOptionElement extends HTMLOptionElement{ append: ddeAppend; } +interface ddeHTMLOutputElement extends HTMLOutputElement{ append: ddeAppend; } +interface ddeHTMLParagraphElement extends HTMLParagraphElement{ append: ddeAppend; } +interface ddeHTMLPictureElement extends HTMLPictureElement{ append: ddeAppend; } +interface ddeHTMLPreElement extends HTMLPreElement{ append: ddeAppend; } +interface ddeHTMLProgressElement extends HTMLProgressElement{ append: ddeAppend; } +interface ddeHTMLScriptElement extends HTMLScriptElement{ append: ddeAppend; } +interface ddeHTMLSelectElement extends HTMLSelectElement{ append: ddeAppend; } +interface ddeHTMLSlotElement extends HTMLSlotElement{ append: ddeAppend; } +interface ddeHTMLSourceElement extends HTMLSourceElement{ append: ddeAppend; } +interface ddeHTMLSpanElement extends HTMLSpanElement{ append: ddeAppend; } +interface ddeHTMLStyleElement extends HTMLStyleElement{ append: ddeAppend; } +interface ddeHTMLTableElement extends HTMLTableElement{ append: ddeAppend; } +interface ddeHTMLTableSectionElement extends HTMLTableSectionElement{ append: ddeAppend; } +interface ddeHTMLTableCellElement extends HTMLTableCellElement{ append: ddeAppend; } +interface ddeHTMLTemplateElement extends HTMLTemplateElement{ append: ddeAppend; } +interface ddeHTMLTextAreaElement extends HTMLTextAreaElement{ append: ddeAppend; } +interface ddeHTMLTableCellElement extends HTMLTableCellElement{ append: ddeAppend; } +interface ddeHTMLTimeElement extends HTMLTimeElement{ append: ddeAppend; } +interface ddeHTMLTitleElement extends HTMLTitleElement{ append: ddeAppend; } +interface ddeHTMLTableRowElement extends HTMLTableRowElement{ append: ddeAppend; } +interface ddeHTMLTrackElement extends HTMLTrackElement{ append: ddeAppend; } +interface ddeHTMLUListElement extends HTMLUListElement{ append: ddeAppend; } +interface ddeHTMLVideoElement extends HTMLVideoElement{ append: ddeAppend; } +interface ddeSVGAElement extends SVGAElement{ append: ddeAppend; } +interface ddeSVGAnimateElement extends SVGAnimateElement{ append: ddeAppend; } +interface ddeSVGAnimateMotionElement extends SVGAnimateMotionElement{ append: ddeAppend; } +interface ddeSVGAnimateTransformElement extends SVGAnimateTransformElement{ append: ddeAppend; } +interface ddeSVGCircleElement extends SVGCircleElement{ append: ddeAppend; } +interface ddeSVGClipPathElement extends SVGClipPathElement{ append: ddeAppend; } +interface ddeSVGDefsElement extends SVGDefsElement{ append: ddeAppend; } +interface ddeSVGDescElement extends SVGDescElement{ append: ddeAppend; } +interface ddeSVGEllipseElement extends SVGEllipseElement{ append: ddeAppend; } +interface ddeSVGFEBlendElement extends SVGFEBlendElement{ append: ddeAppend; } +interface ddeSVGFEColorMatrixElement extends SVGFEColorMatrixElement{ append: ddeAppend; } +interface ddeSVGFEComponentTransferElement extends SVGFEComponentTransferElement{ append: ddeAppend; } +interface ddeSVGFECompositeElement extends SVGFECompositeElement{ append: ddeAppend; } +interface ddeSVGFEConvolveMatrixElement extends SVGFEConvolveMatrixElement{ append: ddeAppend; } +interface ddeSVGFEDiffuseLightingElement extends SVGFEDiffuseLightingElement{ append: ddeAppend; } +interface ddeSVGFEDisplacementMapElement extends SVGFEDisplacementMapElement{ append: ddeAppend; } +interface ddeSVGFEDistantLightElement extends SVGFEDistantLightElement{ append: ddeAppend; } +interface ddeSVGFEDropShadowElement extends SVGFEDropShadowElement{ append: ddeAppend; } +interface ddeSVGFEFloodElement extends SVGFEFloodElement{ append: ddeAppend; } +interface ddeSVGFEFuncAElement extends SVGFEFuncAElement{ append: ddeAppend; } +interface ddeSVGFEFuncBElement extends SVGFEFuncBElement{ append: ddeAppend; } +interface ddeSVGFEFuncGElement extends SVGFEFuncGElement{ append: ddeAppend; } +interface ddeSVGFEFuncRElement extends SVGFEFuncRElement{ append: ddeAppend; } +interface ddeSVGFEGaussianBlurElement extends SVGFEGaussianBlurElement{ append: ddeAppend; } +interface ddeSVGFEImageElement extends SVGFEImageElement{ append: ddeAppend; } +interface ddeSVGFEMergeElement extends SVGFEMergeElement{ append: ddeAppend; } +interface ddeSVGFEMergeNodeElement extends SVGFEMergeNodeElement{ append: ddeAppend; } +interface ddeSVGFEMorphologyElement extends SVGFEMorphologyElement{ append: ddeAppend; } +interface ddeSVGFEOffsetElement extends SVGFEOffsetElement{ append: ddeAppend; } +interface ddeSVGFEPointLightElement extends SVGFEPointLightElement{ append: ddeAppend; } +interface ddeSVGFESpecularLightingElement extends SVGFESpecularLightingElement{ append: ddeAppend; } +interface ddeSVGFESpotLightElement extends SVGFESpotLightElement{ append: ddeAppend; } +interface ddeSVGFETileElement extends SVGFETileElement{ append: ddeAppend; } +interface ddeSVGFETurbulenceElement extends SVGFETurbulenceElement{ append: ddeAppend; } +interface ddeSVGFilterElement extends SVGFilterElement{ append: ddeAppend; } +interface ddeSVGForeignObjectElement extends SVGForeignObjectElement{ append: ddeAppend; } +interface ddeSVGGElement extends SVGGElement{ append: ddeAppend; } +interface ddeSVGImageElement extends SVGImageElement{ append: ddeAppend; } +interface ddeSVGLineElement extends SVGLineElement{ append: ddeAppend; } +interface ddeSVGLinearGradientElement extends SVGLinearGradientElement{ append: ddeAppend; } +interface ddeSVGMarkerElement extends SVGMarkerElement{ append: ddeAppend; } +interface ddeSVGMaskElement extends SVGMaskElement{ append: ddeAppend; } +interface ddeSVGMetadataElement extends SVGMetadataElement{ append: ddeAppend; } +interface ddeSVGMPathElement extends SVGMPathElement{ append: ddeAppend; } +interface ddeSVGPathElement extends SVGPathElement{ append: ddeAppend; } +interface ddeSVGPatternElement extends SVGPatternElement{ append: ddeAppend; } +interface ddeSVGPolygonElement extends SVGPolygonElement{ append: ddeAppend; } +interface ddeSVGPolylineElement extends SVGPolylineElement{ append: ddeAppend; } +interface ddeSVGRadialGradientElement extends SVGRadialGradientElement{ append: ddeAppend; } +interface ddeSVGRectElement extends SVGRectElement{ append: ddeAppend; } +interface ddeSVGScriptElement extends SVGScriptElement{ append: ddeAppend; } +interface ddeSVGSetElement extends SVGSetElement{ append: ddeAppend; } +interface ddeSVGStopElement extends SVGStopElement{ append: ddeAppend; } +interface ddeSVGStyleElement extends SVGStyleElement{ append: ddeAppend; } +interface ddeSVGSVGElement extends SVGSVGElement{ append: ddeAppend; } +interface ddeSVGSwitchElement extends SVGSwitchElement{ append: ddeAppend; } +interface ddeSVGSymbolElement extends SVGSymbolElement{ append: ddeAppend; } +interface ddeSVGTextElement extends SVGTextElement{ append: ddeAppend; } +interface ddeSVGTextPathElement extends SVGTextPathElement{ append: ddeAppend; } +interface ddeSVGTitleElement extends SVGTitleElement{ append: ddeAppend; } +interface ddeSVGTSpanElement extends SVGTSpanElement{ append: ddeAppend; } +interface ddeSVGUseElement extends SVGUseElement{ append: ddeAppend; } +interface ddeSVGViewElement extends SVGViewElement{ append: ddeAppend; } +// editorconfig-checker-enable \ No newline at end of file diff --git a/dist/esm.js b/dist/esm.js index 6060f01..966ff3a 100644 --- a/dist/esm.js +++ b/dist/esm.js @@ -436,7 +436,6 @@ function connectionsChangesObserverConstructor() { offDisconnected(element, listener) { if (!store.has(element)) return; const ls = store.get(element); - if (!ls.disconnected.has(listener)) return; ls.disconnected.delete(listener); ls.length_d -= 1; cleanWhenOff(element, ls); diff --git a/dist/esm.min.js b/dist/esm.min.js new file mode 100644 index 0000000..c1a6fe0 --- /dev/null +++ b/dist/esm.min.js @@ -0,0 +1 @@ +function w(t){return typeof t>"u"}function b(t,e){return t instanceof e}function F(t,e){return Object.prototype.isPrototypeOf.call(e,t)}function v(...t){return Object.assign(...t)}function R(t,e){if(!t||!b(t,AbortSignal))return!0;if(!t.aborted)return t.addEventListener("abort",e),function(){t.removeEventListener("abort",e)}}function I(t,e){let{observedAttributes:r=[]}=t.constructor;return r.reduce(function(n,o){return n[J(o)]=e(t,o),n},{})}function J(t){return t.replace(/-./g,e=>e[1].toUpperCase())}var y={isSignal(t){return!1},processReactiveAttribute(t,e,r,n){return r}};function K(t,e=!0){return e?v(y,t):(Object.setPrototypeOf(t,y),t)}function T(t){return F(t,y)&&t!==y?t:y}var a={setDeleteAttr:Q,ssr:"",D:globalThis.document,F:globalThis.DocumentFragment,H:globalThis.HTMLElement,S:globalThis.SVGElement,M:globalThis.MutationObserver,q:t=>t||Promise.resolve()};function Q(t,e,r){if(Reflect.set(t,e,r),!!w(r)){if(Reflect.deleteProperty(t,e),b(t,a.H)&&t.getAttribute(e)==="undefined")return t.removeAttribute(e);if(Reflect.get(t,e)==="undefined")return Reflect.set(t,e,"")}}var A="__dde_lifecyclesToEvents",m="dde:connected",_="dde:disconnected",D="dde:attributeChanged";function gt(t){return a.q(t)}var x=[{get scope(){return a.D.body},host:t=>t?t(a.D.body):a.D.body,prevent:!0}],S={get current(){return x[x.length-1]},get host(){return this.current.host},preventDefault(){let{current:t}=this;return t.prevent=!0,t},get state(){return[...x]},push(t={}){return x.push(v({},this.current,{prevent:!1},t))},pushRoot(){return x.push(x[0])},pop(){if(x.length!==1)return x.pop()}};function $(...t){return this.appendOriginal(...t),this}function X(t){return t.append===$||(t.appendOriginal=t.append,t.append=$),t}var P;function k(t,e,...r){let n=T(this),o=0,c,d;switch((Object(e)!==e||n.isSignal(e))&&(e={textContent:e}),!0){case typeof t=="function":{o=1;let f=(...l)=>l.length?(o===1?r.unshift(...l):l.forEach(E=>E(d)),void 0):d;S.push({scope:t,host:f}),c=t(e||void 0);let p=b(c,a.F);if(c.nodeName==="#comment")break;let g=k.mark({type:"component",name:t.name,host:p?"this":"parentElement"});c.prepend(g),p&&(d=g);break}case t==="#text":c=N.call(this,a.D.createTextNode(""),e);break;case(t==="<>"||!t):c=N.call(this,a.D.createDocumentFragment(),e);break;case!!P:c=N.call(this,a.D.createElementNS(P,t),e);break;case!c:c=N.call(this,a.D.createElement(t),e)}return X(c),d||(d=c),r.forEach(f=>f(d)),o&&S.pop(),o=2,c}k.mark=function(t,e=!1){t=Object.entries(t).map(([o,c])=>o+`="${c}"`).join(" ");let r=e?"":"/",n=a.D.createComment(``);return e&&(n.end=a.D.createComment("")),n};function vt(t){let e=this;return function(...n){P=t;let o=k.call(e,...n);return P=void 0,o}}function mt(t,e=t){let r="\xB9\u2070",n="\u2713",o=Object.fromEntries(Array.from(e.querySelectorAll("slot")).filter(c=>!c.name.endsWith(r)).map(c=>[c.name+=r,c]));if(t.append=new Proxy(t.append,{apply(c,d,f){if(f[0]===e)return c.apply(t,f);for(let p of f){let g=(p.slot||"")+r;try{tt(p,"remove","slot")}catch{}let l=o[g];if(!l)return;l.name.startsWith(n)||(l.childNodes.forEach(E=>E.remove()),l.name=n+g),l.append(p)}return t.append=c,t}}),t!==e){let c=Array.from(t.childNodes);t.append(...c)}return e}var M=new WeakMap,{setDeleteAttr:U}=a;function N(t,...e){if(!e.length)return t;M.set(t,B(t,this));for(let[r,n]of Object.entries(v({},...e)))z.call(this,t,r,n);return M.delete(t),t}function z(t,e,r){let{setRemoveAttr:n,s:o}=B(t,this),c=this;r=o.processReactiveAttribute(t,e,r,(f,p)=>z.call(c,t,f,p));let[d]=e;if(d==="=")return n(e.slice(1),r);if(d===".")return H(t,e.slice(1),r);if(/(aria|data)([A-Z])/.test(e))return e=e.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase(),n(e,r);switch(e==="className"&&(e="class"),e){case"xlink:href":return n(e,r,"http://www.w3.org/1999/xlink");case"textContent":return U(t,e,r);case"style":if(typeof r!="object")break;case"dataset":return j(o,e,t,r,H.bind(null,t[e]));case"ariaset":return j(o,e,t,r,(f,p)=>n("aria-"+f,p));case"classList":return Y.call(c,t,r)}return et(t,e)?U(t,e,r):n(e,r)}function B(t,e){if(M.has(t))return M.get(t);let n=(b(t,a.S)?rt:nt).bind(null,t,"Attribute"),o=T(e);return{setRemoveAttr:n,s:o}}function Y(t,e){let r=T(this);return j(r,"classList",t,e,(n,o)=>t.classList.toggle(n,o===-1?void 0:!!o)),t}function tt(t,e,r,n){return b(t,a.H)?t[e+"Attribute"](r,n):t[e+"AttributeNS"](null,r,n)}function et(t,e){if(!(e in t))return!1;let r=Z(t,e);return!w(r.set)}function Z(t,e){if(t=Object.getPrototypeOf(t),!t)return{};let r=Object.getOwnPropertyDescriptor(t,e);return r||Z(t,e)}function j(t,e,r,n,o){let c=String;if(!(typeof n!="object"||n===null))return Object.entries(n).forEach(function([f,p]){f&&(f=new c(f),f.target=e,p=t.processReactiveAttribute(r,f,p,o),o(f,p))})}function nt(t,e,r,n){return t[(w(n)?"remove":"set")+e](r,n)}function rt(t,e,r,n,o=null){return t[(w(n)?"remove":"set")+e+"NS"](o,r,n)}function H(t,e,r){if(Reflect.set(t,e,r),!!w(r))return Reflect.deleteProperty(t,e)}var C=a.M?ot():new Proxy({},{get(){return()=>{}}});function ot(){let t=new Map,e=!1,r=s=>function(u){for(let i of u)if(i.type==="childList"){if(l(i.addedNodes,!0)){s();continue}E(i.removedNodes,!0)&&s()}},n=new a.M(r(f));return{observe(s){let u=new a.M(r(()=>{}));return u.observe(s,{childList:!0,subtree:!0}),()=>u.disconnect()},onConnected(s,u){d();let i=c(s);i.connected.has(u)||(i.connected.add(u),i.length_c+=1)},offConnected(s,u){if(!t.has(s))return;let i=t.get(s);i.connected.has(u)&&(i.connected.delete(u),i.length_c-=1,o(s,i))},onDisconnected(s,u){d();let i=c(s);i.disconnected.has(u)||(i.disconnected.add(u),i.length_d+=1)},offDisconnected(s,u){if(!t.has(s))return;let i=t.get(s);i.disconnected.delete(u),i.length_d-=1,o(s,i)}};function o(s,u){u.length_c||u.length_d||(t.delete(s),f())}function c(s){if(t.has(s))return t.get(s);let u={connected:new WeakSet,length_c:0,disconnected:new WeakSet,length_d:0};return t.set(s,u),u}function d(){e||(e=!0,n.observe(a.D.body,{childList:!0,subtree:!0}))}function f(){!e||t.size||(e=!1,n.disconnect())}function p(){return new Promise(function(s){(requestIdleCallback||requestAnimationFrame)(s)})}async function g(s){t.size>30&&await p();let u=[];if(!b(s,Node))return u;for(let i of t.keys())i===s||!b(i,Node)||s.contains(i)&&u.push(i);return u}function l(s,u){let i=!1;for(let h of s){if(u&&g(h).then(l),!t.has(h))continue;let O=t.get(h);O.length_c&&(h.dispatchEvent(new Event(m)),O.connected=new WeakSet,O.length_c=0,O.length_d||t.delete(h),i=!0)}return i}function E(s,u){let i=!1;for(let h of s)u&&g(h).then(E),!(!t.has(h)||!t.get(h).length_d)&&((globalThis.queueMicrotask||setTimeout)(V(h)),i=!0);return i}function V(s){return()=>{s.isConnected||(s.dispatchEvent(new Event(_)),t.delete(s))}}}function yt(t,e,r=st){let n=t.host||t;S.push({scope:n,host:(...d)=>d.length?d.forEach(f=>f(n)):n}),typeof r=="function"&&(r=r.call(n,n));let o=n[A];o||ct(n);let c=e.call(n,r);return o||n.dispatchEvent(new Event(m)),t.nodeType===11&&typeof t.mode=="string"&&n.addEventListener(_,C.observe(t),{once:!0}),S.pop(),t.append(c)}function ct(t){return W(t.prototype,"connectedCallback",function(e,r,n){e.apply(r,n),r.dispatchEvent(new Event(m))}),W(t.prototype,"disconnectedCallback",function(e,r,n){e.apply(r,n),(globalThis.queueMicrotask||setTimeout)(()=>!r.isConnected&&r.dispatchEvent(new Event(_)))}),W(t.prototype,"attributeChangedCallback",function(e,r,n){let[o,,c]=n;r.dispatchEvent(new CustomEvent(D,{detail:[o,c]})),e.apply(r,n)}),t.prototype[A]=!0,t}function W(t,e,r){t[e]=new Proxy(t[e]||(()=>{}),{apply:r})}function st(t){return I(t,(e,r)=>e.getAttribute(r))}function Tt(t,e,r){return e||(e={}),function(o,...c){r&&(c.unshift(o),o=typeof r=="function"?r():r);let d=c.length?new CustomEvent(t,v({detail:c[0]},e)):new Event(t,e);return o.dispatchEvent(d)}}function L(t,e,r){return function(o){return o.addEventListener(t,e,r),o}}var G=t=>v({},typeof t=="object"?t:null,{once:!0});L.connected=function(t,e){return e=G(e),function(n){return n.addEventListener(m,t,e),n[A]?n:n.isConnected?(n.dispatchEvent(new Event(m)),n):(R(e.signal,()=>C.offConnected(n,t))&&C.onConnected(n,t),n)}};L.disconnected=function(t,e){return e=G(e),function(n){return n.addEventListener(_,t,e),n[A]||R(e.signal,()=>C.offDisconnected(n,t))&&C.onDisconnected(n,t),n}};var q=new WeakMap;L.disconnectedAsAbort=function(t){if(q.has(t))return q.get(t);let e=new AbortController;return q.set(t,e),t(L.disconnected(()=>e.abort())),e};var it=new WeakSet;L.attributeChanged=function(t,e){return typeof e!="object"&&(e={}),function(n){if(n.addEventListener(D,t,e),n[A]||it.has(n)||!a.M)return n;let o=new a.M(function(d){for(let{attributeName:f,target:p}of d)p.dispatchEvent(new CustomEvent(D,{detail:[f,p.getAttribute(f)]}))});return R(e.signal,()=>o.disconnect())&&o.observe(n,{attributes:!0}),n}};export{N as assign,z as assignAttribute,X as chainableAppend,Y as classListDeclarative,k as createElement,vt as createElementNS,yt as customElementRender,ct as customElementWithDDE,Tt as dispatchEvent,k as el,vt as elNS,tt as elementAttribute,ct as lifecyclesToEvents,st as observedAttributes,L as on,gt as queue,K as registerReactivity,S as scope,mt as simulateSlots};