@zeix/ui-element
Version:
UIElement - a HTML-first library for reactive Web Components
4 lines (2 loc) • 14.1 kB
JavaScript
var G=($)=>typeof $==="function",v=($,B)=>Object.prototype.toString.call($)===`[object ${B}]`,p=($)=>$ instanceof Error?$:Error(String($));class S extends Error{constructor($){super(`Circular dependency in ${$} detected`);return this}}var R,c=new Set,l=0,r=new Map,u,X$=()=>{u=void 0;let $=Array.from(r.values());r.clear();for(let B of $)B()},P$=()=>{if(u)cancelAnimationFrame(u);u=requestAnimationFrame(X$)};queueMicrotask(X$);var h=($)=>{let B=new Set,Z=$;return Z.off=(J)=>{B.add(J)},Z.cleanup=()=>{for(let J of B)J();B.clear()},Z},_=($)=>{if(R&&!$.has(R)){let B=R;$.add(B),R.off(()=>{$.delete(B)})}},x=($)=>{for(let B of $)if(l)c.add(B);else B()},i=()=>{while(c.size){let $=Array.from(c);c.clear();for(let B of $)B()}},Y$=($)=>{l++;try{$()}finally{i(),l--}},m=($,B)=>{let Z=R;R=B;try{$()}finally{R=Z}},w=($,B)=>new Promise((Z,J)=>{r.set(B||Symbol(),()=>{try{Z($())}catch(K){J(K)}}),P$()});var a="State",o=($)=>{let B=new Set,Z=$,J={[Symbol.toStringTag]:a,get:()=>{return _(B),Z},set:(K)=>{if(Object.is(Z,K))return;if(Z=K,x(B),A===Z)B.clear()},update:(K)=>{J.set(K(Z))}};return J},M=($)=>v($,a);var k="Computed",b=($)=>{let B=new Set,Z=A,J,K,W=!0,H=!1,I=!1,Y=(j)=>{if(!Object.is(j,Z))Z=j,H=!0;J=void 0,W=!1},Q=()=>{H=A!==Z,Z=A,J=void 0},X=(j)=>{let V=p(j);H=!J||V.name!==J.name||V.message!==J.message,Z=A,J=V},q=(j)=>(V)=>{if(I=!1,K=void 0,j(V),H)x(B)},F=h(()=>{if(W=!0,K?.abort("Aborted because source signal changed"),B.size)x(B);else F.cleanup()}),C=()=>m(()=>{if(I)throw new S("computed");if(H=!1,G($)&&$.constructor.name==="AsyncFunction"){if(K)return Z;K=new AbortController,K.signal.addEventListener("abort",()=>{I=!1,K=void 0,C()},{once:!0})}let j;I=!0;try{j=K?$(K.signal):$()}catch(V){if(V instanceof DOMException&&V.name==="AbortError")Q();else X(V);I=!1;return}if(j instanceof Promise)j.then(q(Y),q(X));else if(j==null||A===j)Q();else Y(j);I=!1},F);return{[Symbol.toStringTag]:k,get:()=>{if(_(B),i(),W)C();if(J)throw J;return Z}}},E=($)=>v($,k),t=($)=>G($)&&$.length<2;var A=Symbol(),O=($)=>M($)||E($),T=($)=>O($)?$:t($)?b($):o($);function f($){let{signals:B,ok:Z,err:J=console.error,nil:K=()=>{}}=G($)?{signals:[],ok:$}:$,W=!1,H=h(()=>m(()=>{if(W)throw new S("effect");W=!0;let I=[],Y=!1,Q=B.map((q)=>{try{let F=q.get();if(F===A)Y=!0;return F}catch(F){return I.push(p(F)),A}}),X=void 0;try{X=Y?K():I.length?J(...I):Z(...Q)}catch(q){X=J(p(q))}finally{if(G(X))H.off(X)}W=!1},H));return H(),()=>H.cleanup()}var P=!1,G$="debug",y$="info",z$="warn",g="error",U$=($)=>$?`#${$}`:"",V$=($)=>$?.length?`.${Array.from($).join(".")}`:"",e=($)=>!!$&&typeof $==="object",D=($)=>typeof $==="string",$$=($,B)=>D(B)&&(B in $)&&G($[B]),j$=($)=>$.nodeType===Node.ELEMENT_NODE,B$=($)=>$.localName.includes("-"),A$=($)=>{if(!B$($))return!0;let B=customElements.get($.localName);return!!B&&$ instanceof B},z=($)=>$?`<${$.localName}${U$($.id)}${V$($.classList)}>`:"<unknown>",d=($)=>D($)?`"${$}"`:e($)?JSON.stringify($):String($),s=($)=>{if($===null)return"null";if(typeof $!=="object")return typeof $;if(Array.isArray($))return"Array";if(Symbol.toStringTag in Object($))return $[Symbol.toStringTag];return $.constructor?.name||"Object"},L=($,B,Z=G$)=>{if(P||[g,z$].includes(Z))console[Z](B,$);return $};class q$ extends Error{constructor($){super($);this.name="CircularMutationError"}}var x$=($)=>{let B=new Set;if($.includes("."))B.add("class");if($.includes("#"))B.add("id");if($.includes("[")){let Z=$.split("[");for(let J=1;J<Z.length;J++){let K=Z[J];if(!K.includes("]"))continue;let W=K.split("=")[0].trim().replace(/[^a-zA-Z0-9_-]/g,"");if(W)B.add(W)}}return[...B]},M$=($,B)=>{if($.length!==B.length)return!1;let Z=new Set($);for(let J of B)if(!Z.has(J))return!1;return!0},_$=($,B,Z)=>(J)=>{let K=new Set,W=G($)?$(J):$,H=new Map,I,Y=()=>{for(let[Q,X]of Object.entries(Z)){let q=(F)=>{let C=F.target;if(!C)return;let U=C.closest(B);if(!U||!J.contains(U))return;F.stopPropagation();try{let j=X({event:F,host:J,target:U,value:W});if(j==null)return;if(!Object.is(j,W)){if(W=j,K.size>0)x(K);else if(I)I()}}catch(j){throw F.stopImmediatePropagation(),j}};H.set(Q,q),J.addEventListener(Q,q)}I=()=>{if(H.size){for(let[Q,X]of H)J.removeEventListener(Q,X);H.clear()}I=void 0}};return{[Symbol.toStringTag]:k,get(){if(_(K),K.size&&!H.size)Y();return W}}},Z$=($,B,Z)=>{let J=new MutationObserver(Z),K={childList:!0,subtree:!0},W=x$(B);if(W.length)K.attributes=!0,K.attributeFilter=W;return J.observe($,K),J},F$=($)=>(B)=>{let Z=new Set,J=()=>Array.from(B.querySelectorAll($)),K=A,W,H=0,I=2,Y=()=>{K=J(),W=Z$(B,$,()=>{if(!Z.size){W?.disconnect(),W=void 0;return}if(H++,H>I)throw W?.disconnect(),W=void 0,H=0,new q$("Circular mutation in element selection detected");try{let Q=J();if(!M$(K,Q))K=Q,x(Z)}finally{H--}})};return{[Symbol.toStringTag]:k,get(){if(_(Z),!Z.size)K=J();else if(!W)Y();return K}}},O$=($,B,Z,J)=>b(()=>F$(B)($).get().reduce(Z,J)),T$=($,B,Z)=>{let J=$.querySelector(B);return Z(J,J?A$(J):!1)},D$=($,B)=>{let Z=$.querySelector(B);if(!Z)throw new Error(`Component ${z($)} does not contain required <${B}> element`);return Z};var N=Symbol(),R$=new Set(["constructor","prototype"]),w$=new Set(["id","class","className","title","role","style","dataset","lang","dir","hidden","children","innerHTML","outerHTML","textContent","innerText"]),J$=($)=>G($)&&$.length>=2,L$=($)=>{if(R$.has($))return`Property name "${$}" is a reserved word`;if(w$.has($))return`Property name "${$}" conflicts with inherited HTMLElement property`;return null},K$=($,B,Z=B)=>{let J=$.filter(G).map((K)=>K(B,Z));return()=>{J.filter(G).forEach((K)=>K()),J.length=0}},N$=()=>({first:($,...B)=>(Z)=>{let J=(Z.shadowRoot||Z).querySelector($);if(J)K$(B,Z,J)},all:($,...B)=>(Z)=>{let J=new Map,K=Z.shadowRoot||Z,W=(Q)=>{if(!J.has(Q))J.set(Q,K$(B,Z,Q))},H=(Q)=>{let X=J.get(Q);if(G(X))X();J.delete(Q)},I=(Q)=>(X)=>{if(j$(X)){if(X.matches($))Q(X);X.querySelectorAll($).forEach(Q)}},Y=Z$(K,$,(Q)=>{for(let X of Q)X.addedNodes.forEach(I(W)),X.removedNodes.forEach(I(H))});return K.querySelectorAll($).forEach(W),()=>{Y.disconnect(),J.forEach((Q)=>Q()),J.clear()}}}),S$=($,B={},Z)=>{for(let J of Object.keys(B)){let K=L$(J);if(K)throw new TypeError(`${K} in component "${$}".`)}customElements.define($,class extends HTMLElement{debug;#$={};#B;static observedAttributes=Object.entries(B)?.filter(([,J])=>J$(J)).map(([J])=>J)??[];constructor(){super();for(let[J,K]of Object.entries(B)){if(K==null)continue;let W=J$(K)?K(this,null):G(K)?K(this):K;if(W!=null)this.setSignal(J,T(W))}}connectedCallback(){if(P){if(this.debug=this.hasAttribute("debug"),this.debug)L(this,"Connected")}let J=Z(this,N$());if(!Array.isArray(J))throw new TypeError(`Expected array of functions as return value of setup function in ${z(this)}`);this.#B=K$(J,this)}disconnectedCallback(){if(G(this.#B))this.#B();if(P&&this.debug)L(this,"Disconnected")}attributeChangedCallback(J,K,W){if(W===K||E(this.#$[J]))return;let H=B[J];if(!J$(H))return;let I=H(this,W,K);if(P&&this.debug)L(W,`Attribute "${J}" of ${z(this)} changed from ${d(K)} to ${d(W)}, parsed as <${s(I)}> ${d(I)}`);this[J]=I}getSignal(J){let K=this.#$[J];if(P&&this.debug)L(K,`Get ${s(K)} "${String(J)}" in ${z(this)}`);return K}setSignal(J,K){let W=L$(String(J));if(W)throw new TypeError(`${W} on ${z(this)}.`);if(!O(K))throw new TypeError(`Expected signal as value for property "${String(J)}" on ${z(this)}.`);let H=this.#$[J],I=M(K);if(this.#$[J]=K,Object.defineProperty(this,J,{get:K.get,set:I?K.set:void 0,enumerable:!0,configurable:I}),H&&M(H))H.set(A);if(P&&this.debug)L(K,`Set ${s(K)} "${String(J)} in ${z(this)}`)}})};var W$="context-request";class C$ extends Event{$;B;Z;constructor($,B,Z=!1){super(W$,{bubbles:!0,composed:!0});this.context=$;this.callback=B;this.subscribe=Z}}var k$=($)=>(B)=>{let Z=(J)=>{let{context:K,callback:W}=J;if($.includes(K)&&G(W))J.stopImmediatePropagation(),W(B.getSignal(String(K)))};return B.addEventListener(W$,Z),()=>B.removeEventListener(W$,Z)},b$=($,B)=>(Z)=>{let J=T(B);return Z.dispatchEvent(new C$($,(K)=>{J=K})),J};var H$=($,B)=>{if(B==null)return;let Z=$(B);return Number.isFinite(Z)?Z:void 0},E$=()=>($,B)=>B!=null&&B!=="false",f$=($=0)=>(B,Z)=>{if(Z==null)return $;let J=Z.trim();if(J.toLowerCase().startsWith("0x"))return H$((W)=>parseInt(W,16),J)??$;let K=H$(parseFloat,Z);return K!=null?Math.trunc(K):$},g$=($=0)=>(B,Z)=>H$(parseFloat,Z)??$,d$=($="")=>(B,Z)=>Z??$,p$=($)=>(B,Z)=>{if(Z==null)return $[0];let J=Z.toLowerCase();return $.find((W)=>W.toLowerCase()===J)?Z:$[0]},h$=($)=>(B,Z)=>{if((Z??$)==null)throw new ReferenceError("Value and fallback are both null or undefined");if(Z==null)return $;if(Z==="")throw new SyntaxError("Empty string is not valid JSON");let J;try{J=JSON.parse(Z)}catch(K){throw new SyntaxError(`Failed to parse JSON: ${String(K)}`,{cause:K})}return J??$};var n=Symbol("RESOLVE_ERROR"),Q$=($,B,Z,J)=>{try{return D($)?B.getSignal($).get():O($)?$.get():G($)?$(Z):N}catch(K){if(J)L(K,`Failed to resolve value of ${d($)}${J?` for ${J}`:""} in ${z(Z)}${B!==Z?` in ${z(B)}`:""}`,g);return n}},m$=($,B="")=>{return{a:"attribute ",c:"class ",d:"dataset ",h:"inner HTML",m:"method call ",p:"property ",s:"style property ",t:"text content"}[$]+B},v$=($,B,Z,J,K)=>{return{ok:(I)=>()=>{if(P&&$.debug)L(B,`${I} ${Z} of ${z(B)} in ${z($)}`);J?.(B)},err:(I)=>(Y)=>{L(Y,`Failed to ${I} ${Z} of ${z(B)} in ${z($)}`,g),K?.(Y)}}},I$=($,B)=>{return Symbol(B?`${$}:${B}`:$)},c$=($,B,Z,J,K)=>{return f(()=>{let W=Q$($,B,Z,J);if(W===n)return;K(W)})},u$=($)=>{if(/^(mailto|tel):/i.test($))return!0;if($.includes("://"))try{let B=new URL($,window.location.origin);return["http:","https:","ftp:"].includes(B.protocol)}catch{return!1}return!0},i$=($,B,Z)=>{if(/^on/i.test(B))throw new Error(`Unsafe attribute: ${B}`);if(Z=String(Z).trim(),!u$(Z))throw new Error(`Unsafe URL for ${B}: ${Z}`);$.setAttribute(B,Z)},y=($,B)=>(Z,J)=>{let{op:K,name:W="",read:H,update:I}=B,Y=H(J),Q=m$(K,W);if(D($)&&D(Y)&&Z[$]===N)Z.attributeChangedCallback($,null,Y);let{ok:X,err:q}=v$(Z,J,Q,B.resolve,B.reject);return f(()=>{let F=I$(K,W),C=Q$($,Z,J,Q);if(C===n)return;let U=C===N?Y:C===A?B.delete?null:Y:C;if(B.delete&&U===null)w(()=>{return B.delete(J),!0},F).then(X("Deleted")).catch(q("delete"));else if(U!=null){let j=H(J);if(Object.is(U,j))return;w(()=>{return I(J,U),!0},F).then(X("Updated")).catch(q("update"))}})},o$=($,B)=>(Z,J)=>{let K=(H)=>()=>{if(P&&Z.debug)L(J,`${H} element in ${z(J)} in ${z(Z)}`);if(G(B?.resolve))B.resolve(J);else{let I=O($)?$:D($)?Z.getSignal($):void 0;if(M(I))I.set(0)}},W=(H)=>(I)=>{L(I,`Failed to ${H} element in ${z(J)} in ${z(Z)}`,g),B?.reject?.(I)};return f(()=>{let H=I$("i"),I=I$("r"),Y=Q$($,Z,J,"insertion or deletion");if(Y===n)return;let Q=Y===N?0:Y;if(Q>0){if(!B)throw new TypeError("No inserter provided");w(()=>{for(let X=0;X<Q;X++){let q=B.create(J);if(!q)continue;J.insertAdjacentElement(B.position??"beforeend",q)}return!0},H).then(K("Inserted")).catch(W("insert"))}else if(Q<0)w(()=>{if(B&&(B.position==="afterbegin"||B.position==="beforeend"))for(let X=0;X>Q;X--)if(B.position==="afterbegin")J.firstElementChild?.remove();else J.lastElementChild?.remove();else J.remove();return!0},I).then(K("Removed")).catch(W("remove"))})},s$=($)=>y($,{op:"t",read:(B)=>B.textContent,update:(B,Z)=>{Array.from(B.childNodes).filter((J)=>J.nodeType!==Node.COMMENT_NODE).forEach((J)=>J.remove()),B.append(document.createTextNode(Z))}}),n$=($,B=$)=>y(B,{op:"p",name:String($),read:(Z)=>($ in Z)?Z[$]:A,update:(Z,J)=>{Z[$]=J}}),l$=($)=>y($,{op:"p",name:"hidden",read:(B)=>!B.hidden,update:(B,Z)=>{B.hidden=!Z}});var r$=($)=>y($,{op:"m",name:"focus",read:(B)=>B===document.activeElement,update:(B,Z)=>{if(Z&&$$(B,"focus"))B.focus()}}),a$=($,B=$)=>y(B,{op:"a",name:$,read:(Z)=>Z.getAttribute($),update:(Z,J)=>{i$(Z,$,J)},delete:(Z)=>{Z.removeAttribute($)}}),t$=($,B=$)=>y(B,{op:"a",name:$,read:(Z)=>Z.hasAttribute($),update:(Z,J)=>{Z.toggleAttribute($,J)}}),e$=($,B=$)=>y(B,{op:"c",name:$,read:(Z)=>Z.classList.contains($),update:(Z,J)=>{Z.classList.toggle($,J)}}),$B=($,B=$)=>y(B,{op:"s",name:$,read:(Z)=>Z.style.getPropertyValue($),update:(Z,J)=>{Z.style.setProperty($,J)},delete:(Z)=>{Z.style.removeProperty($)}}),BB=($,B={})=>y($,{op:"h",read:(Z)=>(Z.shadowRoot||!B.shadowRootMode?Z:null)?.innerHTML??"",update:(Z,J)=>{let{shadowRootMode:K,allowScripts:W}=B;if(!J){if(Z.shadowRoot)Z.shadowRoot.innerHTML="<slot></slot>";return""}if(K&&!Z.shadowRoot)Z.attachShadow({mode:K});let H=Z.shadowRoot||Z;if(H.innerHTML=J,!W)return"";return H.querySelectorAll("script").forEach((I)=>{let Y=document.createElement("script");Y.appendChild(document.createTextNode(I.textContent??"")),H.appendChild(Y),I.remove()})," with scripts"}}),ZB=($,B,Z=!1)=>(J,K)=>{if(!G(B))throw new TypeError(`Invalid event listener provided for "${$} event on element ${z(K)}`);return K.addEventListener($,B,Z),()=>K.removeEventListener($,B)},JB=($,B)=>(Z,J)=>c$(B,Z,J,`custom event "${$}" detail`,(K)=>{if(K===N||K===A)return;J.dispatchEvent(new CustomEvent($,{detail:K,bubbles:!0}))}),KB=($)=>(B,Z)=>{if(!e($))throw new TypeError("Reactives must be an object of passed signals");if(!B$(Z))throw new TypeError(`Target ${z(Z)} is not a custom element`);customElements.whenDefined(Z.localName).then(()=>{if(!$$(Z,"setSignal"))throw new TypeError(`Target ${z(Z)} is not a UIElement component`);for(let[J,K]of Object.entries($))Z.setSignal(J,D(K)?B.getSignal(K):T(K))}).catch((J)=>{throw new Error(`Failed to pass signals to ${z(Z)}`,{cause:J})})};export{y as updateElement,e$ as toggleClass,t$ as toggleAttribute,T as toSignal,o as state,l$ as show,s$ as setText,$B as setStyle,n$ as setProperty,a$ as setAttribute,D$ as requireDescendant,O$ as reduced,T$ as read,k$ as provideContexts,KB as pass,ZB as on,L as log,M as isState,O as isSignal,E as isComputed,o$ as insertOrRemoveElement,F$ as fromSelector,_$ as fromEvents,b$ as fromContext,r$ as focus,w as enqueue,JB as emitEvent,f as effect,BB as dangerouslySetInnerHTML,b as computed,S$ as component,Y$ as batch,d$ as asString,g$ as asNumber,h$ as asJSON,f$ as asInteger,p$ as asEnum,E$ as asBoolean,A as UNSET,N as RESET,z$ as LOG_WARN,y$ as LOG_INFO,g as LOG_ERROR,G$ as LOG_DEBUG};
//# debugId=0874AF681F09C1D064756E2164756E21