vanjs-htm
Version:
HTM with VanJS for JSX-like syntax in vanilla JavaScript using VanJS reactivity.
2 lines • 1.52 kB
JavaScript
var _=T=>{let{htm:y,van:u,vanX:v}=T,f;f=T?.decode;let m=document,g,C=t=>typeof t=="function",d=t=>typeof t=="string",s=Object.hasOwn,a={f:{e:"for:each"},p:{m:"portal:mount"},s:{f:"show:fallback",w:"show:when"},svg:"vh:svg"},r=(t,e)=>{let o=t[e];return delete t[e],o},b=t=>s(t,a.s.w),h=(t,e,o,i=true)=>{let n=r(e,a.s.f)??"",l=r(e,a.s.w);return ()=>(l&&typeof l=="object"&&"val"in l?l.val:C(l)?l():l)?i?t(e,...o):t():C(n)?n():n},w=0,D=(t,e,o)=>{let i=r(e,a.f.e),n=()=>v.list(t(e),i,o);return b(e)?h(n,e,g,false):n()},E=(t,e,o)=>{let i=r(e,a.p.m),n=d(i)?m.querySelector(i):i,l=`p-${w++}`,c=()=>{let p=t(e,...o);return p?.setAttribute?.("p:id",l),p};return u.add(n,b(e)?h(c,e,g,false):c()),m.createComment(l)},P=new Set(["circle","clipPath","defs","desc","ellipse","filter","foreignObject","g","line","linearGradient","marker","mask","path","pattern","polygon","polyline","radialGradient","rect","stop","svg","symbol","text","textPath","tspan","use"]);function F(t,e,...o){this[0]=3;let i=d(t)?(e&&s(e,a.svg)?r(e,a.svg):P.has(t))?u.tags("http://www.w3.org/2000/svg")[t]:u.tags[t]:t,n=o?.map(l=>d(l)?f(l):l);if(e){if(s(e,a.f.e))return D(i,e,n[0]);if(s(e,a.p.m))return E(i,e,n);if(s(e,a.s.w))return h(i,e,n)}return i(e,...n)}return {html:y.bind(F),rmPortals:(t,e=m.body)=>{let o=d(e)?m.querySelector(e):e;if(!o)return;let i=[],n=t.firstChild;for(;n;)n.nodeType===Node.COMMENT_NODE&&n.data.startsWith("p-")&&i.push(n.data),n=n.nextSibling;for(let l of i)o.querySelector(`[p\\:id="${l}"]`)?.remove();}}},S=_;
export{S as default};