@vanijs/vani 0.2.0 → 0.4.0

package/dist/lib/index.mjs

@@ -1 +1 @@
-function e(e){let t=e;return t.__vaniKeyed||=new Map,t.__vaniKeyed}function t(e){return t=>{let n,r,i=!1,a=t;if(t&&typeof t==`object`){let e=t;if(n=e.key,r=e.ref,i=e.clientOnly,`key`in e||`ref`in e){let{key:t,ref:n,clientOnly:r,...i}=e;a=i}}return{$$vani:`component`,component:e,props:a,key:n,ref:r,clientOnly:i}}}let n=`dom`;function r(e,t){let r=n;n=e;let i=t();return i&&typeof i.finally==`function`?i.finally(()=>{n=r}):(n=r,i)}function i(){return n}function a(e){return typeof e==`object`&&!!e&&`type`in e}function o(e){return a(e)&&e.type===`element`}function s(e){return a(e)&&e.type===`fragment`}const c=new Set([`svg`,`g`,`path`,`circle`,`rect`,`line`,`polyline`,`polygon`,`ellipse`,`defs`,`clipPath`,`mask`,`pattern`,`linearGradient`,`radialGradient`,`stop`,`use`]);function l(e){return n===`dom`?c.has(e)?document.createElementNS(`http://www.w3.org/2000/svg`,e):document.createElement(e):{type:`element`,tag:e,props:{},children:[]}}function u(e){return n===`dom`?document.createTextNode(e):{type:`text`,text:e}}function d(e,t){if(n===`dom`){e.appendChild(t);return}(o(e)||s(e))&&e.children.push(t)}function f(e,t){let n=e.nextSibling;for(;n&&n!==t;){let e=n.nextSibling,t=n;t.__vaniDomRef&&(t.__vaniDomRef.current=null),n.remove(),n=e}}function p(e){if(e==null||e===!1)return document.createComment(`vani:empty`);if(g(e)){let t=document.createDocumentFragment(),n=m(e.component,v(e),t);return e.ref&&(e.ref.current=n),t}if(typeof e==`string`||typeof e==`number`)return document.createTextNode(String(e));if(e instanceof Node)return e;throw Error(`[vani] render returned an unsupported node type in DOM mode`)}function m(e,t,n){let r=[],i=!1,a,o,s=t?.clientOnly===!0;if(O){let e=A;A+=1,a=M(n,e),o=N(a,e)}else a=document.createComment(`vani:start`),o=document.createComment(`vani:end`),n.appendChild(a),n.appendChild(o);let c,l={update(){i||(C?T.has(l)||(E.add(l),D()):(E.delete(l),T.add(l),oe()))},updateSync(){if(i)return;let e=a.parentNode;if(!e)return;f(a,o);let t=p(c());e.insertBefore(t,o)},onCleanup(e){r.push(e)},dispose(){if(!i){i=!0,T.delete(l),E.delete(l);for(let e of r)e();r.length=0,f(a,o),a.remove(),o.remove(),c=(()=>document.createComment(`disposed`))}},effect(e){let t=e();typeof t==`function`&&r.push(t)}};if(O&&!s){let n=!1;return c=()=>{if(!n){n=!0;let r=e(t,l);c=r instanceof Promise?()=>document.createComment(`async`):r}return c()},l}let u=e(t,l);return u instanceof Promise?(c=t?.fallback||(()=>document.createComment(`vani:async`)),(!O||s)&&l.update(),u.then(e=>{i||(c=e,l.update())}),l):(c=u,(!O||s)&&l.update(),l)}function h(e,t){if(!t)throw Error(`[vani] root element not found`);let n=[];for(let r of e){if(typeof r==`function`){let e=m(r,{},t);n.push(e);continue}let e=m(r.component,v(r),t);n.push(e)}return n}function g(e){let t=typeof Node<`u`&&e instanceof Node;if(typeof e!=`object`||t)return!1;let n=e;return n.$$vani===`component`&&typeof n.component==`function`}function _(e){let t=typeof Node<`u`&&e instanceof Node;return typeof e==`object`&&!!e&&!t&&!g(e)}function v(e){return e.clientOnly?{...e.props??{},clientOnly:!0}:e.props}function y(t,r){if(n===`ssr`){for(let e of r)if(!(e==null||e===!1||e===void 0)){if(g(e)){d(t,{type:`component`,instance:e});continue}if(typeof e==`string`||typeof e==`number`){d(t,u(String(e)));continue}if(a(e)){d(t,e);continue}}return}let i=t;for(let t of r)if(!(t==null||t===!1||t===void 0)){if(g(t)){if(t.key!=null){let n=e(i),r=i.__vaniUsedKeys??=new Set,a=n.get(t.key);if(!a){let e=document.createDocumentFragment(),r=m(t.component,v(t),e);t.ref&&(t.ref.current=r),a={fragment:e,handle:r,ref:t.ref},n.set(t.key,a),t.ref&&(t.ref.current=r)}r.add(t.key),i.appendChild(a.fragment);continue}let n=document.createDocumentFragment(),r=m(t.component,v(t),n);t.ref&&(t.ref.current=r),i.appendChild(n);continue}if(typeof t==`string`||typeof t==`number`){i.appendChild(document.createTextNode(String(t)));continue}i.appendChild(t)}let o=i.__vaniKeyed,s=i.__vaniUsedKeys;if(o&&s){for(let[e,t]of o)s.has(e)||(t.handle.dispose(),t.ref&&(t.ref.current=null),o.delete(e));s.clear()}}function ee(e){return typeof SVGElement<`u`&&e instanceof SVGElement}function te(e,t){return e.startsWith(`aria`)?`aria-`+e.replace(`aria-`,``).replace(`aria`,``).toLowerCase():e.toLowerCase()===`htmlfor`?`for`:t?e:e.toLowerCase()}function ne(e,t){let n=o(e)?c.has(e.tag):ee(e);for(let r in t){let i=t[r];if(![`key`,`ref`].includes(r)){if(r===`className`){let t=b(i);o(e)?e.props.class=t:n?e.setAttribute(`class`,t):e.className=t;continue}if(r.startsWith(`on`)&&typeof i==`function`)o(e)||(e[r.toLowerCase()]=i);else if(i===!0)o(e)?e.props[r]=!0:e.setAttribute(r,``);else if(i===!1||i==null)continue;else{let t=te(r,n);o(e)?e.props[t]=String(i):e.setAttribute(t,String(i))}}}}function b(...e){return e.map(e=>{if(!(e==null||e===``))return typeof e==`string`?e.trim():Array.isArray(e)?b(...e):Object.entries(e).filter(([e,t])=>t).map(([e])=>e.trim()).join(` `).trim()}).filter(Boolean).join(` `)}function x(e,t,...n){let r=l(e);return _(t)?(t.ref&&(o(r)?t.ref.current=null:(t.ref.current=r,r.__vaniDomRef=t.ref)),ne(r,t),y(r,n),r):(y(r,[t,...n]),r)}const re=(...e)=>{if(n===`ssr`){let t={type:`fragment`,children:[]};return y(t,e),t}let t=document.createDocumentFragment();return y(t,e),t};function ie(e,t){if(n===`ssr`)return{type:`component`,instance:{$$vani:`component`,component:e,props:t}};let r=document.createDocumentFragment();return m(e,t,r),r}let S=!1,C=!1,w=!1;const T=new Set,E=new Set;function ae(e){let t=C;C=!0;try{e()}finally{C=t,D()}}function D(){w||(w=!0,setTimeout(()=>{w=!1,se()},0))}function oe(){S||(S=!0,queueMicrotask(()=>{S=!1;for(let e of T)e.updateSync();T.clear()}))}function se(){for(let e of E)e.updateSync();E.clear(),E.size>0&&D()}let O=!1,k=null,A=0;function j(e){F()&&console.warn(`[vani] hydration warning: ${e}`)}function M(e,t){let n=k;(!n||!e.contains(n))&&(n=e.firstChild);let r=!1;for(;n;){if(n.nodeType===Node.COMMENT_NODE&&n.nodeValue===`vani:start`)return r&&j(`Found <!--vani:end--> before <!--vani:start--> for component #${t}. This usually means the server HTML anchor order is incorrect.`),n;n.nodeType===Node.COMMENT_NODE&&n.nodeValue===`vani:end`&&(r=!0),n=n.nextSibling}throw j(`Expected <!--vani:start--> for component #${t}, but none was found. This usually means the server HTML does not match the client component tree.`),Error(`[vani] hydration failed: start anchor not found`)}function N(e,t){let n=e.nextSibling,r=0;for(;n;){if(n.nodeType===Node.COMMENT_NODE){if(n.nodeValue===`vani:start`)r+=1;else if(n.nodeValue===`vani:end`){if(r===0)return k=n.nextSibling,n;--r}}n=n.nextSibling}throw j(`Expected <!--vani:end--> for component #${t}, but none was found. This usually means the server HTML does not match the client component tree.`),Error(`[vani] hydration failed: end anchor not found`)}function P(e,t){let n=[];O=!0,k=t.firstChild,A=0;try{n=h(e,t)}catch(e){console.error(`[vani] hydration failed:`,e)}finally{if(F()&&k){let e=k,t=!1;for(;e;){if(e.nodeType===Node.COMMENT_NODE){let n=e.nodeValue;if(n===`vani:start`||n===`vani:end`){t=!0;break}}e=e.nextSibling}t&&j(`Unused SSR anchors detected after hydration. Some server-rendered DOM was not claimed by the client runtime.`)}O=!1,k=null,A=0}return n}function F(){return`__vaniDevMode`in globalThis?globalThis.__vaniDevMode===!0:import.meta.env?import.meta.env.DEV:typeof process<`u`&&process.env!==void 0?process.env.NODE_ENV===`development`:!1}function I(e){return(t,...n)=>x(e,t,...n)}const L=I(`div`),R=I(`span`),z=I(`ul`),B=I(`li`),V=I(`ol`),H=I(`dl`),U=I(`dt`),W=I(`dd`),G=I(`main`),K=I(`header`),ce=I(`footer`),le=I(`section`),ue=I(`article`),de=I(`aside`),fe=I(`nav`),pe=I(`details`),me=I(`summary`),he=I(`a`),ge=I(`button`),_e=I(`input`),ve=I(`output`),ye=I(`textarea`),be=I(`select`),xe=I(`option`),Se=I(`optgroup`),Ce=I(`label`),we=I(`form`),Te=I(`progress`),Ee=I(`meter`),De=I(`fieldset`),Oe=I(`legend`),ke=I(`datalist`),Ae=I(`figure`),je=I(`figcaption`),Me=I(`img`),Ne=I(`picture`),Pe=I(`source`),Fe=I(`video`),Ie=I(`audio`),Le=I(`iframe`),Re=I(`embed`),ze=I(`time`),Be=I(`mark`),Ve=I(`p`),He=I(`h1`),Ue=I(`h2`),We=I(`h3`),Ge=I(`h4`),Ke=I(`h5`),qe=I(`h6`),Je=I(`code`),Ye=I(`pre`),Xe=I(`blockquote`),Ze=I(`var`),Qe=I(`kbd`),$e=I(`samp`),et=I(`cite`),tt=I(`dfn`),nt=I(`abbr`),rt=I(`small`),it=I(`strong`),at=I(`em`),ot=I(`br`),st=I(`hr`),ct=I(`table`),lt=I(`caption`),ut=I(`colgroup`),dt=I(`col`),ft=I(`tbody`),pt=I(`thead`),mt=I(`tfoot`),ht=I(`tr`),gt=I(`td`),_t=I(`th`),vt=I(`style`),yt=I(`script`),bt=I(`noscript`),xt=I(`template`),St=I(`slot`),Ct=I(`svg`),wt=I(`g`),Tt=I(`path`),Et=I(`circle`),Dt=I(`rect`),Ot=I(`line`),kt=I(`polyline`),At=I(`polygon`),jt=I(`ellipse`),Mt=I(`defs`),Nt=I(`clipPath`),Pt=I(`mask`),Ft=I(`pattern`),It=I(`linearGradient`),Lt=I(`radialGradient`),Rt=I(`stop`),zt=I(`use`),q=new Set([`area`,`base`,`br`,`col`,`embed`,`hr`,`img`,`input`,`link`,`meta`,`param`,`source`,`track`,`wbr`]);function Bt(){return{update(){},updateSync(){},dispose(){},onCleanup(){},effect(){}}}function Vt(e){return typeof e==`function`?{$$vani:`component`,component:e,props:{}}:e}function J(e){return e.replace(/&/g,`&amp;`).replace(/</g,`&lt;`).replace(/>/g,`&gt;`).replace(/"/g,`&quot;`).replace(/'/g,`&#39;`)}function Ht(e){let t=[];for(let n of Object.keys(e)){let r=e[n];r==null||r===!1||n.startsWith(`on`)&&typeof r==`function`||(r===!0?t.push(n):t.push(`${n}="${J(String(r))}"`))}return t.length>0?` ${t.join(` `)}`:``}function Y(e){if(e==null||e===!1)return{type:`fragment`,children:[]};if(typeof e==`string`||typeof e==`number`)return{type:`text`,text:String(e)};if(g(e))return{type:`component`,instance:e};if(typeof e==`object`&&`type`in e)return e;throw Error(`[vani] SSR received a DOM node. This is not supported.`)}async function Ut(e){let t=`<!--vani:start-->`,n=`<!--vani:end-->`;if(e.clientOnly){let r=e.props?.fallback;return r?`${t}${await X(Y(r()))}${n}`:`${t}${n}`}let r=e.component(e.props,Bt());return`${t}${await X(Y((r instanceof Promise?await r:r)()))}${n}`}async function X(e){switch(e.type){case`text`:return J(e.text);case`comment`:return`<!--${e.text}-->`;case`fragment`:return(await Promise.all(e.children.map(X))).join(``);case`component`:return Ut(e.instance);case`element`:{let t=Ht(e.props);if(q.has(e.tag))return`<${e.tag}${t}>`;let n=(await Promise.all(e.children.map(X))).join(``);return`<${e.tag}${t}>${n}</${e.tag}>`}}}async function Wt(e){return r(`ssr`,async()=>{if(i()!==`ssr`)throw Error(`[vani] renderToString failed to set SSR render mode.`);let t=e.map(e=>({type:`component`,instance:Vt(e)}));return(await Promise.all(t.map(X))).join(``)})}const Z=new Map,Q=(e,t)=>{if(!t)return e;let n=`${e??``} ${t}`.trim();return n.length>0?n:void 0},Gt=(e,t)=>{if(!t)return;let n=t.size;if(n!=null&&(e.setAttribute(`width`,String(n)),e.setAttribute(`height`,String(n))),t.className){let n=Q(e.getAttribute(`class`)??void 0,t.className);n&&e.setAttribute(`class`,n)}if(t.attributes){for(let[n,r]of Object.entries(t.attributes))if(!(r==null||r===!1)){if(r===!0){e.setAttribute(n,``);continue}e.setAttribute(n,String(r))}}},Kt=e=>{let t={},n=/([^\s=]+)(?:=(?:"([^"]*)"|'([^']*)'|([^\s"'>]+)))?/g,r;for(;r=n.exec(e);){let e=r[1],n=r[2]??r[3]??r[4];t[e]=n===void 0?!0:n}return t},qt=e=>{let t=e.replace(/<!--[\s\S]*?-->/g,``).trim(),n=/<\/?[^>]+>/g,r=[],i=null,a=0,o,s=e=>{let t=r[r.length-1];t&&(t.type===`element`||t.type===`fragment`)&&t.children.push(e)};for(;o=n.exec(t);){let e=t.slice(a,o.index);e.trim().length>0&&s({type:`text`,text:e});let c=o[0];if(c.startsWith(`</`))r.pop();else{let e=c.endsWith(`/>`),t=c.slice(1,e?-2:-1).trim(),n=t.search(/\s/),a={type:`element`,tag:n===-1?t:t.slice(0,n),props:Kt(n===-1?``:t.slice(n+1)),children:[]};i?s(a):i=a,e||r.push(a)}a=n.lastIndex}return i??{type:`fragment`,children:[]}},$=e=>e.type===`text`?{type:`text`,text:e.text}:e.type===`comment`?{type:`comment`,text:e.text}:e.type===`fragment`?{type:`fragment`,children:e.children.map($)}:e.type===`component`?{type:`component`,instance:e.instance}:{type:`element`,tag:e.tag,props:{...e.props},children:e.children.map($)},Jt=(e,t)=>{if(!t||e.type!==`element`||e.tag!==`svg`)return;let n=e.props;if(t.size!=null&&(n.width=String(t.size),n.height=String(t.size)),t.className){let e=Q(n.class,t.className);e&&(n.class=e)}if(t.attributes){for(let[e,r]of Object.entries(t.attributes))if(!(r==null||r===!1)){if(r===!0){n[e]=!0;continue}n[e]=String(r)}}},Yt=(e,t)=>{if(i()===`ssr`){let n=$(qt(e));return Jt(n,t),n}let n=Z.get(e);n||(n=new DOMParser().parseFromString(e,`image/svg+xml`).documentElement,Z.set(e,n));let r=n.cloneNode(!0);return Gt(r,t),r};export{he as a,nt as abbr,ue as article,de as aside,Ie as audio,Xe as blockquote,ot as br,ge as button,lt as caption,Et as circle,et as cite,b as classNames,Nt as clipPath,Je as code,dt as col,ut as colgroup,t as component,ke as datalist,W as dd,Mt as defs,pe as details,tt as dfn,L as div,H as dl,U as dt,x as el,jt as ellipse,at as em,Re as embed,De as fieldset,je as figcaption,Ae as figure,ce as footer,we as form,re as fragment,wt as g,i as getRenderMode,He as h1,Ue as h2,We as h3,Ge as h4,Ke as h5,qe as h6,K as header,st as hr,P as hydrateToDOM,Le as iframe,Me as img,_e as input,g as isComponentInstance,F as isDevMode,Qe as kbd,Ce as label,Oe as legend,B as li,Ot as line,It as linearGradient,G as main,Be as mark,Pt as mask,Ee as meter,ie as mount,fe as nav,bt as noscript,V as ol,Se as optgroup,xe as option,ve as output,Ve as p,Tt as path,Ft as pattern,Ne as picture,At as polygon,kt as polyline,Ye as pre,Te as progress,Lt as radialGradient,Dt as rect,Yt as renderSvgString,h as renderToDOM,Wt as renderToString,$e as samp,yt as script,le as section,be as select,St as slot,rt as small,Pe as source,R as span,ae as startTransition,Rt as stop,it as strong,vt as style,me as summary,Ct as svg,ct as table,ft as tbody,gt as td,xt as template,ye as textarea,mt as tfoot,_t as th,pt as thead,ze as time,ht as tr,z as ul,zt as use,Ze as var_,Fe as video,r as withRenderMode};
+import{_ as e,a as t,c as n,d as r,f as i,g as a,h as o,i as s,l as c,m as ee,n as te,o as l,p as ne,r as re,s as ie,t as ae,u,v as oe,y as se}from"./runtime-X8xzmXJz.mjs";function d(e){return(t,...n)=>l(e,t,...n)}const f=d(`div`),p=d(`span`),m=d(`ul`),h=d(`li`),g=d(`ol`),_=d(`dl`),v=d(`dt`),y=d(`dd`),b=d(`main`),x=d(`header`),S=d(`footer`),C=d(`section`),w=d(`article`),T=d(`aside`),E=d(`nav`),D=d(`details`),O=d(`summary`),k=d(`a`),A=d(`button`),j=d(`input`),M=d(`output`),N=d(`textarea`),P=d(`select`),F=d(`option`),I=d(`optgroup`),L=d(`label`),R=d(`form`),z=d(`progress`),B=d(`meter`),V=d(`fieldset`),H=d(`legend`),U=d(`datalist`),W=d(`figure`),G=d(`figcaption`),K=d(`img`),ce=d(`picture`),le=d(`source`),ue=d(`video`),de=d(`audio`),fe=d(`iframe`),pe=d(`embed`),me=d(`time`),he=d(`mark`),ge=d(`p`),_e=d(`h1`),ve=d(`h2`),ye=d(`h3`),be=d(`h4`),xe=d(`h5`),Se=d(`h6`),Ce=d(`code`),we=d(`pre`),Te=d(`blockquote`),Ee=d(`var`),De=d(`kbd`),Oe=d(`samp`),ke=d(`cite`),q=d(`dfn`),Ae=d(`abbr`),je=d(`small`),Me=d(`strong`),Ne=d(`em`),Pe=d(`br`),Fe=d(`hr`),Ie=d(`table`),Le=d(`caption`),Re=d(`colgroup`),ze=d(`col`),Be=d(`tbody`),Ve=d(`thead`),He=d(`tfoot`),Ue=d(`tr`),We=d(`td`),Ge=d(`th`),Ke=d(`style`),qe=d(`script`),Je=d(`noscript`),Ye=d(`template`),Xe=d(`slot`),Ze=d(`svg`),Qe=d(`g`),$e=d(`path`),et=d(`circle`),tt=d(`rect`),nt=d(`line`),rt=d(`polyline`),it=d(`polygon`),at=d(`ellipse`),ot=d(`defs`),st=d(`clipPath`),ct=d(`mask`),lt=d(`pattern`),ut=d(`linearGradient`),dt=d(`radialGradient`),ft=d(`stop`),pt=d(`use`);function mt(e){return Array.isArray(e)?e:[e]}const ht=new Set([`area`,`base`,`br`,`col`,`embed`,`hr`,`img`,`input`,`link`,`meta`,`param`,`source`,`track`,`wbr`]);function gt(){return{update(){},updateSync(){},dispose(){},onCleanup(){},effect(){}}}function _t(e){return typeof e==`function`?{$$vani:`component`,component:e,props:{}}:e}function J(e){return e.replaceAll(`&`,`&amp;`).replaceAll(`<`,`&lt;`).replaceAll(`>`,`&gt;`).replaceAll(`"`,`&quot;`).replaceAll(`'`,`&#39;`)}function vt(e){let t=[];for(let n of Object.keys(e)){let r=e[n];r==null||r===!1||n.startsWith(`on`)&&typeof r==`function`||(r===!0?t.push(n):t.push(`${n}="${J(String(r))}"`))}return t.length>0?` ${t.join(` `)}`:``}function Y(e){if(e==null||e===!1)return{type:`fragment`,children:[]};if(typeof e==`string`||typeof e==`number`)return{type:`text`,text:String(e)};if(u(e))return{type:`component`,instance:e};if(typeof e==`object`&&`type`in e)return e;throw Error(`[vani] SSR received a DOM node. This is not supported.`)}async function yt(e){let t=`<!--vani:start-->`,n=`<!--vani:end-->`;if(e.clientOnly){let r=e.props?.fallback;return r?`${t}${await X(Y(r()))}${n}`:`${t}${n}`}let r=e.component(e.props,gt());return`${t}${await X(Y((r instanceof Promise?await r:r)()))}${n}`}async function X(e){switch(e.type){case`text`:return J(e.text);case`comment`:return`<!--${e.text}-->`;case`fragment`:return(await Promise.all(e.children.map(X))).join(``);case`component`:return yt(e.instance);case`element`:{let t=vt(e.props);if(ht.has(e.tag))return`<${e.tag}${t}>`;let n=(await Promise.all(e.children.map(X))).join(``);return`<${e.tag}${t}>${n}</${e.tag}>`}}}async function bt(t){return e(`ssr`,async()=>{if(n()!==`ssr`)throw Error(`[vani] renderToString failed to set SSR render mode.`);let e=mt(t).map(e=>({type:`component`,instance:_t(e)}));return(await Promise.all(e.map(X))).join(``)})}const Z=new Map,Q=(e,t)=>{if(!t)return e;let n=`${e??``} ${t}`.trim();return n.length>0?n:void 0},xt=(e,t)=>{if(!t)return;let n=t.size;if(n!=null&&(e.setAttribute(`width`,String(n)),e.setAttribute(`height`,String(n))),t.className){let n=Q(e.getAttribute(`class`)??void 0,t.className);n&&e.setAttribute(`class`,n)}if(t.attributes){for(let[n,r]of Object.entries(t.attributes))if(!(r==null||r===!1)){if(r===!0){e.setAttribute(n,``);continue}e.setAttribute(n,String(r))}}},St=e=>{let t={},n=/([^\s=]+)(?:=(?:"([^"]*)"|'([^']*)'|([^\s"'>]+)))?/g,r;for(;r=n.exec(e);){let e=r[1],n=r[2]??r[3]??r[4];t[e]=n===void 0?!0:n}return t},Ct=e=>{let t=e.replaceAll(/<!--[\s\S]*?-->/g,``).trim(),n=/<\/?[^>]+>/g,r=[],i=null,a=0,o,s=e=>{let t=r.at(-1);t&&(t.type===`element`||t.type===`fragment`)&&t.children.push(e)};for(;o=n.exec(t);){let e=t.slice(a,o.index);e.trim().length>0&&s({type:`text`,text:e});let c=o[0];if(c.startsWith(`</`))r.pop();else{let e=c.endsWith(`/>`),t=c.slice(1,e?-2:-1).trim(),n=t.search(/\s/),a={type:`element`,tag:n===-1?t:t.slice(0,n),props:St(n===-1?``:t.slice(n+1)),children:[]};i==null?i=a:s(a),e||r.push(a)}a=n.lastIndex}return i??{type:`fragment`,children:[]}},$=e=>e.type===`text`?{type:`text`,text:e.text}:e.type===`comment`?{type:`comment`,text:e.text}:e.type===`fragment`?{type:`fragment`,children:e.children.map($)}:e.type===`component`?{type:`component`,instance:e.instance}:{type:`element`,tag:e.tag,props:{...e.props},children:e.children.map($)},wt=(e,t)=>{if(!t||e.type!==`element`||e.tag!==`svg`)return;let n=e.props;if(t.size!=null&&(n.width=String(t.size),n.height=String(t.size)),t.className){let e=Q(n.class,t.className);e&&(n.class=e)}if(t.attributes){for(let[e,r]of Object.entries(t.attributes))if(!(r==null||r===!1)){if(r===!0){n[e]=!0;continue}n[e]=String(r)}}},Tt=(e,t)=>{if(n()===`ssr`){let n=$(Ct(e));return wt(n,t),n}let r=Z.get(e);r||(r=new DOMParser().parseFromString(e,`image/svg+xml`).documentElement,Z.set(e,r));let i=r.cloneNode(!0);return xt(i,t),i};export{k as a,Ae as abbr,w as article,T as aside,oe as attr,de as audio,ae as batch,Te as blockquote,Pe as br,A as button,Le as caption,et as circle,ke as cite,te as classNames,st as clipPath,Ce as code,ze as col,Re as colgroup,re as component,U as datalist,y as dd,ot as defs,s as derive,D as details,q as dfn,f as div,_ as dl,v as dt,t as effect,l as el,at as ellipse,Ne as em,pe as embed,V as fieldset,G as figcaption,W as figure,S as footer,R as form,ie as fragment,Qe as g,n as getRenderMode,_e as h1,ve as h2,ye as h3,be as h4,xe as h5,Se as h6,x as header,Fe as hr,c as hydrateToDOM,fe as iframe,K as img,j as input,u as isComponentInstance,r as isDevMode,De as kbd,L as label,H as legend,h as li,nt as line,ut as linearGradient,b as main,he as mark,ct as mask,B as meter,i as mount,E as nav,Je as noscript,g as ol,I as optgroup,F as option,M as output,ge as p,$e as path,lt as pattern,ce as picture,it as polygon,rt as polyline,we as pre,z as progress,dt as radialGradient,tt as rect,ne as renderKeyedChildren,Tt as renderSvgString,ee as renderToDOM,bt as renderToString,Oe as samp,qe as script,C as section,P as select,o as signal,Xe as slot,je as small,le as source,p as span,a as startTransition,ft as stop,Me as strong,Ke as style,O as summary,Ze as svg,Ie as table,Be as tbody,We as td,Ye as template,se as text,N as textarea,He as tfoot,Ge as th,Ve as thead,me as time,Ue as tr,m as ul,pt as use,Ee as var_,ue as video,e as withRenderMode};

package/dist/lib/jsx-dev-runtime.d.mts

@@ -0,0 +1,2 @@
+import { Fragment, jsx, jsxDEV, jsxs } from "./jsx-runtime.mjs";
+export { Fragment, jsx, jsxDEV, jsxs };

package/dist/lib/jsx-dev-runtime.mjs

@@ -0,0 +1 @@
+import"./runtime-X8xzmXJz.mjs";import{Fragment as e,jsx as t,jsxDEV as n,jsxs as r}from"./jsx-runtime.mjs";export{e as Fragment,t as jsx,n as jsxDEV,r as jsxs};

package/dist/lib/jsx-runtime.d.mts

@@ -0,0 +1,27 @@
+import { a as ComponentRef, c as ElementProps, g as VNode, h as VChild, i as ComponentInstance, n as Component, s as DomRef } from "./runtime-Cx9SKHrc.mjs";
+
+//#region src/vani/jsx-runtime.d.ts
+type ElementTagName = Extract<keyof HTMLElementTagNameMap | keyof SVGElementTagNameMap, string>;
+type IntrinsicElementProps<Tag extends ElementTagName> = ElementProps<Tag> & {
+  children?: VChild | VChild[];
+};
+type Key = string | number | null | undefined;
+declare const Fragment: unique symbol;
+type JsxElementType = string | Component<any> | typeof Fragment;
+declare function jsx(type: JsxElementType, props: Record<string, any> | null, key?: Key): VNode | ComponentInstance<void>;
+declare const jsxs: typeof jsx;
+declare function jsxDEV(type: JsxElementType, props: Record<string, any> | null, key?: Key, _isStaticChildren?: boolean, _source?: unknown, _self?: unknown): VNode | ComponentInstance<void>;
+declare namespace JSX {
+  type Element = VNode | ComponentInstance<any>;
+  type ElementType = JsxElementType;
+  interface ElementChildrenAttribute {
+    children: {};
+  }
+  interface IntrinsicAttributes {
+    key?: string | number;
+    ref?: DomRef<globalThis.Element> | ComponentRef;
+  }
+  type IntrinsicElements = { [K in ElementTagName]: IntrinsicElementProps<K> };
+}
+//#endregion
+export { Fragment, JSX, jsx, jsxDEV, jsxs };

package/dist/lib/jsx-runtime.mjs

@@ -0,0 +1 @@
+import{o as e,r as t,s as n}from"./runtime-X8xzmXJz.mjs";const r=Symbol.for(`vani.fragment`);function i(e){return e==null||e===!1?[]:Array.isArray(e)?e:[e]}function a(e,t){if(!e||typeof e!=`object`)return{props:null,children:[],key:t,ref:void 0,hasChildrenProp:!1};let n=Object.prototype.hasOwnProperty.call(e,`children`),r=n?i(e.children):[],a=t??e.key,o=e.ref,{key:s,ref:c,children:l,...u}=e;return{props:Object.keys(u).length>0?u:null,children:r,key:a,ref:o,hasChildrenProp:n}}function o(i,o,s){let{props:c,children:l,key:u,ref:d,hasChildrenProp:f}=a(o,s);if(i===r)return n(...l);if(typeof i==`string`)return c?e(i,c,...l):e(i,null,...l);if(typeof i==`function`){let e={...c??{}};return(l.length>0||f)&&(e.children=l.length<=1?l[0]:l),u!=null&&(e.key=u),d&&(e.ref=d),t(i)(e)}throw Error(`[vani] jsx runtime received an unsupported element type.`)}const s=o;function c(e,t,n,r,i,a){return o(e,t,n)}export{r as Fragment,o as jsx,c as jsxDEV,s as jsxs};

package/dist/lib/runtime-Cx9SKHrc.d.mts

@@ -0,0 +1,190 @@
+//#region src/vani/signals.d.ts
+type SignalGetter<T> = () => T;
+type SignalSetter<T> = (value: T | ((prev: T) => T)) => void;
+type Signal<T> = [SignalGetter<T>, SignalSetter<T>];
+type ClassName$1 = string | undefined | null | {
+  [key: string]: boolean | undefined | null;
+} | ClassName$1[];
+type AttrValue = ClassName$1 | string | number | boolean | null | undefined;
+type TextNode = Node | {
+  type: 'text';
+  text: string;
+};
+declare function text(value: SignalGetter<unknown> | (() => unknown) | unknown): TextNode;
+declare function attr(el: Element, name: string, value: SignalGetter<AttrValue> | (() => AttrValue) | AttrValue): () => void;
+//#endregion
+//#region src/vani/runtime.d.ts
+type SSRNode = {
+  type: 'element';
+  tag: string;
+  props: Record<string, any>;
+  children: SSRNode[];
+} | {
+  type: 'text';
+  text: string;
+} | {
+  type: 'comment';
+  text: string;
+} | {
+  type: 'fragment';
+  children: SSRNode[];
+} | {
+  type: 'component';
+  instance: ComponentInstance<any>;
+};
+type VNode = Node | SSRNode;
+interface Handle {
+  /**
+   * Schedules a render for the component.
+   * This triggers a re-render on the next microtask.
+   */
+  update(options?: UpdateOptions): void;
+  /**
+   * Flushes the component render.
+   * This triggers a re-render immediately.
+   */
+  updateSync(options?: UpdateOptions): void;
+  /**
+   * Disposes the component: removes the component from the DOM and runs all cleanup functions.
+   */
+  dispose(): void;
+  /**
+   * Adds a cleanup function that is called when the component is disposed.
+   */
+  onCleanup(fn: () => void): void;
+  /**
+   * This is purely syntatic sugar, as it is basically the same as running the function
+   * on the setup phase and calling onCleanup to add a cleanup function.
+   *
+   * Using effects is necessary in SSR mode, for side effects to not run on the server
+   * (e.g. timers, subscriptions, DOM usage, etc.)
+   *
+   * Runs a side effect function when the component is mounted.
+   * The returning function may be a cleanup function that is called when the component is disposed.
+   *
+   */
+  effect(fn: () => void | (() => void)): void;
+}
+type RenderFn = () => VChild;
+type Component<Props = any> = (props: Props, handle: Handle) => RenderFn | Promise<RenderFn>;
+type ComponentInstance<Props = any> = {
+  $$vani: 'component';
+  component: Component<Props>;
+  props: Props;
+  /**
+   * A key is used to identify the component when it is re-rendered.
+   * If a key is provided, the component will be re-rendered only if the key changes.
+   */
+  key?: string | number;
+  /**
+   * A ref is used to get a reference to the component instance.
+   * The ref is set to the component instance when the component is mounted.
+   * The ref is set to null when the component is disposed.
+   */
+  ref?: ComponentRef;
+  clientOnly?: boolean;
+};
+type ComponentInput<Props> = Props & {
+  key?: string | number;
+  ref?: ComponentRef;
+};
+type ComponentMetaProps = {
+  key?: string | number;
+  ref?: ComponentRef;
+  fallback?: RenderFn;
+  clientOnly?: boolean;
+};
+type VChild = VNode | ComponentInstance<any> | string | number | null | undefined | false;
+type DataAttribute = `data-${string}` | `data${Capitalize<string>}`;
+type HtmlTagName = keyof HTMLElementTagNameMap;
+type SvgTagName = keyof SVGElementTagNameMap;
+type ElementTagName = HtmlTagName | SvgTagName;
+type ElementByTag<T extends ElementTagName> = T extends HtmlTagName ? HTMLElementTagNameMap[T] : T extends SvgTagName ? SVGElementTagNameMap[T] : Element;
+type SvgProps<T extends SvgTagName = SvgTagName> = BaseProps<T> & {
+  [key: string]: string | number | boolean | undefined | null | ((...args: any[]) => any);
+};
+type BaseProps<T extends ElementTagName> = {
+  className?: ClassName;
+  style?: string;
+  ref?: DomRef<ElementByTag<T>>;
+} & {
+  [key: DataAttribute]: string | number | boolean | undefined | null;
+};
+type HtmlProps<T extends HtmlTagName = HtmlTagName> = BaseProps<T> & Partial<Omit<ElementByTag<T>, 'children' | 'className' | 'style'>>;
+type ElementProps<T extends ElementTagName> = T extends SvgTagName ? SvgProps<T> : HtmlProps<Extract<T, HtmlTagName>>;
+type ClassName = string | undefined | null | {
+  [key: string]: boolean | undefined | null;
+} | ClassName[];
+type ComponentRef = {
+  current: Handle | null;
+};
+type DomRef<T extends Element = Element> = {
+  current: T | null;
+};
+type UpdateOptions = {
+  onlyAttributes?: boolean;
+};
+type RenderMode = 'dom' | 'ssr';
+declare function component(fn: Component<void>): (props?: ComponentMetaProps) => ComponentInstance<void>;
+declare function component<Props>(fn: Component<Props>): (props: Props & ComponentMetaProps) => ComponentInstance<Props>;
+declare function withRenderMode<T>(mode: RenderMode, fn: () => T): T;
+declare function getRenderMode(): RenderMode;
+declare function signal<T>(value: T): Signal<T>;
+declare function derive<T>(fn: () => T): SignalGetter<T>;
+declare function effect(fn: () => void | (() => void)): () => void;
+type Renderable = Component<any> | ComponentInstance<any>;
+declare function renderToDOM(components: Renderable | Renderable[], root: HTMLElement): Handle[];
+declare function isComponentInstance(child: VChild): child is ComponentInstance<any>;
+declare function renderKeyedChildren(parent: Node, children: Array<ComponentInstance<any>>): void;
+declare function classNames(...classes: ClassName[]): string;
+declare function el<E extends ElementTagName>(tag: E, props?: ElementProps<E> | VChild | null, ...children: VChild[]): VNode;
+declare const fragment: (...children: VChild[]) => {
+  type: "fragment";
+  children: SSRNode[];
+} | DocumentFragment;
+declare function mount<Props>(component: Component<Props>, props: Props): VNode;
+/**
+ * Marks all updates triggered inside the callback as a "transition".
+ *
+ * A transition represents non-urgent UI work that can be deferred
+ * to keep the application responsive.
+ *
+ * Updates scheduled inside `startTransition`:
+ * - do NOT block user interactions
+ * - are batched separately from urgent updates
+ * - may be flushed later (e.g. after the current event or during idle time)
+ *
+ * Transitions are NOT animations.
+ * They do not control how updates look, only *when* they are applied.
+ *
+ * Typical use cases:
+ * - Filtering or sorting large lists
+ * - Rendering expensive subtrees
+ * - Applying async results that are not immediately visible
+ *
+ * Example:
+ * ```ts
+ * button({
+ *   onclick: () => {
+ *     // urgent update
+ *     setOpen(true)
+ *     handle.update()
+ *
+ *     // non-urgent update
+ *     startTransition(() => {
+ *       setItems(filter(items))
+ *       handle.update()
+ *     })
+ *   },
+ * })
+ * ```
+ *
+ * If multiple transitions are triggered, they are automatically batched.
+ * Transition updates never interrupt urgent updates.
+ */
+declare function startTransition(fn: () => void): void;
+declare function batch(fn: () => void): void;
+declare function hydrateToDOM(components: Renderable | Renderable[], root: HTMLElement): Handle[];
+declare function isDevMode(): boolean;
+//#endregion
+export { renderToDOM as A, fragment as C, isDevMode as D, isComponentInstance as E, SignalGetter as F, SignalSetter as I, attr as L, startTransition as M, withRenderMode as N, mount as O, Signal as P, text as R, el as S, hydrateToDOM as T, batch as _, ComponentRef as a, derive as b, ElementProps as c, RenderFn as d, SSRNode as f, VNode as g, VChild as h, ComponentInstance as i, signal as j, renderKeyedChildren as k, Handle as l, UpdateOptions as m, Component as n, DataAttribute as o, SvgProps as p, ComponentInput as r, DomRef as s, ClassName as t, HtmlProps as u, classNames as v, getRenderMode as w, effect as x, component as y };

package/dist/lib/runtime-X8xzmXJz.mjs

@@ -0,0 +1 @@
+let e=null;const t=new Set;let n=!1;function r(t){!e||e.disposed||e.deps.has(t)||(e.deps.add(t),t.observers.add(e))}function i(e){for(let t of e.deps)t.observers.delete(e);e.deps.clear(),e.cleanup&&=(e.cleanup(),void 0)}function a(t){if(t.disposed)return;i(t);let n=e;e=t;let r=t.fn();e=n,typeof r==`function`&&(t.cleanup=r)}function o(e){e.disposed||(t.add(e),!n&&(n=!0,queueMicrotask(()=>{n=!1;let e=Array.from(t);t.clear();for(let t of e)a(t)})))}function s(e){let t={value:e,observers:new Set};return[()=>(r(t),t.value),e=>{let n=typeof e==`function`?e(t.value):e;if(!Object.is(n,t.value)){t.value=n;for(let e of t.observers)o(e)}}]}function c(e){let t={fn:e,deps:new Set,disposed:!1};return a(t),()=>{t.disposed||(t.disposed=!0,i(t))}}function l(e){let[t,n]=s(e());return c(()=>{n(e())}),t}let u=null;function d(e){u=e}function f(e){let t=()=>typeof e==`function`?e():e,n=String(t()??``);if(!u)return typeof document<`u`?document.createTextNode(n):{type:`text`,text:n};let r=u.createTextNode(n);if(u.getRenderMode()===`ssr`)return r;if(typeof e==`function`){let e=r,n=c(()=>{e.textContent=String(t()??``)});u.addNodeCleanup(e,n)}return r}function ee(e,t,n){if(!u)return()=>{};let r=u;if(r.getRenderMode()===`ssr`||t.startsWith(`on`))return()=>{};let i=e instanceof SVGElement,a=t===`className`?`class`:r.normalizeAttrKey(t,i),o=t=>{if(a===`class`){let n=r.classNames(t);if(!n){e.removeAttribute(`class`);return}e.setAttribute(`class`,n);return}if(t===!0){e.setAttribute(a,``);return}if(t===!1||t==null){e.removeAttribute(a);return}e.setAttribute(a,String(t))};if(typeof n==`function`){let t=c(()=>{o(n())});return r.addNodeCleanup(e,t),t}return o(n),()=>{}}function p(e){let t=e;return t.__vaniKeyed||=new Map,t.__vaniKeyed}function m(e){return t=>{let n,r,i=!1,a=t;if(t&&typeof t==`object`){let e=t;if(n=e.key,r=e.ref,i=e.clientOnly,`key`in e||`ref`in e){let{key:t,ref:n,clientOnly:r,...i}=e;a=i}}return{$$vani:`component`,component:e,props:a,key:n,ref:r,clientOnly:i}}}let h=`dom`;function te(e,t){let n=h;h=e;let r=t();return r&&typeof r.finally==`function`?r.finally(()=>{h=n}):(h=n,r)}function g(){return h}function ne(e){return s(e)}function re(e){if(h===`ssr`){let t=e();return()=>t}return l(e)}function ie(e){return h===`ssr`?(e(),()=>{}):c(e)}function _(e){if(typeof e!=`object`||!e||!(`type`in e))return!1;let t=e;switch(t.type){case`element`:return typeof t.tag==`string`&&typeof t.props==`object`&&Array.isArray(t.children);case`text`:case`comment`:return typeof t.text==`string`;case`fragment`:return Array.isArray(t.children);case`component`:return typeof t.instance==`object`&&t.instance!=null;default:return!1}}function v(e){return _(e)&&e.type===`element`}function ae(e){return _(e)&&e.type===`fragment`}const y=new Set([`svg`,`g`,`path`,`circle`,`rect`,`line`,`polyline`,`polygon`,`ellipse`,`defs`,`clipPath`,`mask`,`pattern`,`linearGradient`,`radialGradient`,`stop`,`use`]);function oe(e){return h===`dom`?y.has(e)?document.createElementNS(`http://www.w3.org/2000/svg`,e):document.createElement(e):{type:`element`,tag:e,props:{},children:[]}}function b(e){return h===`dom`?document.createTextNode(e):{type:`text`,text:e}}function x(e,t){if(h===`dom`){e.appendChild(t);return}(v(e)||ae(e))&&e.children.push(t)}function se(e,t){let n=e;if(!n.__vaniCleanup){n.__vaniCleanup=[t];return}n.__vaniCleanup.push(t)}function ce(e){let t=e,n=t.__vaniCleanup;if(Array.isArray(n)){t.__vaniCleanup=null;for(let e of n)e()}}function S(e,t){let n=e.nextSibling;for(;n&&n!==t;){let e=n.nextSibling;if(n.nodeType===Node.COMMENT_NODE&&n.nodeValue===`vani:start`){let t=n.__vaniHandle;if(t){let r=t.__vaniEnd?.nextSibling??e;t.dispose(),n=r;continue}}ce(n);let t=n;t.__vaniDomRef&&(t.__vaniDomRef.current=null),n.remove(),n=e}}function le(e){if(e==null||e===!1)return document.createComment(`vani:empty`);if(T(e)){let t=document.createDocumentFragment(),n=C(e.component,E(e),t);return e.ref&&(e.ref.current=n),t}if(typeof e==`string`||typeof e==`number`)return document.createTextNode(String(e));if(e instanceof Node)return e;throw Error(`[vani] render returned an unsupported node type in DOM mode`)}function C(e,t,n,r){let i=[],a=!1,o,s,c=null,l=t?.clientOnly===!0;if(Y){let e=Z;Z+=1,o=ye(n,e),s=be(o,e)}else o=document.createComment(`vani:start`),s=document.createComment(`vani:end`),n.appendChild(o),n.appendChild(s);let u,d={update(e){if(a)return;let t=d.__vaniUpdateOptions,n=e?.onlyAttributes?{onlyAttributes:!0}:{onlyAttributes:!1};(!t||!t.onlyAttributes||!n.onlyAttributes)&&(d.__vaniUpdateOptions=n),B?G.has(d)||(K.add(d),H>0?W=!0:q()):(K.delete(d),G.add(d),H>0?U=!0:J())},updateSync(e){if(a||!o.parentNode)return;let t=e??d.__vaniUpdateOptions;if(d.__vaniUpdateOptions=void 0,t?.onlyAttributes&&c){let e=F;F=!0;let t;try{t=u()}finally{F=e}if(t instanceof Node){let e=k(t);if(e&&e.tagName===c.tagName){fe(c,e);return}}}S(o,s);let n=le(u()),r=k(n);s.before(n,s),c=r},onCleanup(e){i.push(e)},dispose(){if(!a){a=!0,o.__vaniHandle=null,d.__vaniStart=null,d.__vaniEnd=null,G.delete(d),K.delete(d);for(let e of i)e();i.length=0,S(o,s),o.remove(),s.remove(),u=(()=>document.createComment(`disposed`))}},effect(e){let t=e();typeof t==`function`&&i.push(t)}};if(d.__vaniStart=o,d.__vaniEnd=s,o.__vaniHandle=d,Y&&!l){let n=!1;return u=()=>{if(!n){n=!0;let r=e(t,d);u=r instanceof Promise?()=>document.createComment(`async`):r}return u()},d}let f=e(t,d);return f instanceof Promise?(u=t?.fallback||(()=>document.createComment(`vani:async`)),(!Y||l)&&(r?.initialRender===`sync`?d.updateSync():d.update()),f.then(e=>{a||(u=e,d.update())}),d):(u=f,(!Y||l)&&(r?.initialRender===`sync`?d.updateSync():d.update()),d)}function ue(e){return Array.isArray(e)?e:[e]}function w(e,t){if(!t)throw Error(`[vani] root element not found`);let n=[],r=ue(e);for(let e of r){if(typeof e==`function`){let r=C(e,{},t);n.push(r);continue}let r=C(e.component,E(e),t);n.push(r)}return n}function T(e){let t=typeof Node<`u`&&e instanceof Node;if(typeof e!=`object`||t)return!1;let n=e;return n.$$vani===`component`&&typeof n.component==`function`}function de(e){let t=typeof Node<`u`&&e instanceof Node;return typeof e==`object`&&!!e&&!t&&!T(e)&&!_(e)}function E(e){return e.clientOnly?{...e.props??{},clientOnly:!0}:e.props}function D(e){let t=e.__vaniStart,n=e.__vaniEnd;return!t||!n?null:{start:t,end:n}}function O(e,t,n,r=null){let i=document.createDocumentFragment(),a=t;for(;a;){let e=a.nextSibling;if(i.appendChild(a),a===n)break;a=e}e.insertBefore(i,r)}function k(e){if(e.nodeType===Node.ELEMENT_NODE)return e;if(e.nodeType===Node.DOCUMENT_FRAGMENT_NODE){let t=e.firstChild;if(t&&t.nodeType===Node.ELEMENT_NODE&&t.nextSibling===null)return t}return null}function fe(e,t){let n=new Set(t.getAttributeNames());for(let t of e.getAttributeNames())n.has(t)||e.removeAttribute(t);for(let r of n){let n=t.getAttribute(r);e.getAttribute(r)!==n&&(n===null?e.removeAttribute(r):e.setAttribute(r,n))}}function A(e,t){if(e.props===t)return!1;if(!e.props||typeof e.props!=`object`||!t||typeof t!=`object`)return e.props=t,!0;let n=!1,r=e.props,i=t;for(let e in r)e in i||(delete r[e],n=!0);for(let e in i)r[e]!==i[e]&&(r[e]=i[e],n=!0);return n}function j(e,t,n=null){let r=document.createDocumentFragment(),i=C(t.component,E(t),r,{initialRender:`sync`});t.ref&&(t.ref.current=i);let a=D(i)??void 0,o={component:t.component,handle:i,fragment:r,ref:t.ref,props:t.props,start:a?.start,end:a?.end};return e.insertBefore(r,n),o}function M(e,t){if(h===`ssr`){for(let n of t)if(!(n==null||n===!1||n===void 0)){if(T(n)){x(e,{type:`component`,instance:n});continue}if(typeof n==`string`||typeof n==`number`){x(e,b(String(n)));continue}if(_(n)){x(e,n);continue}}return}let n=e;for(let e of t)if(!(e==null||e===!1||e===void 0)){if(T(e)){if(e.key!=null){let t=p(n),r=n.__vaniUsedKeys??=new Set,i=t.get(e.key);i&&i.component!==e.component&&(i.handle.dispose(),i.ref&&(i.ref.current=null),t.delete(e.key),i=void 0),i?(i.ref!==e.ref&&(i.ref&&(i.ref.current=null),i.ref=e.ref),i.ref&&(i.ref.current=i.handle),A(i,e.props)&&i.handle.update(),i.start&&i.end&&O(n,i.start,i.end)):(i=j(n,e,null),t.set(e.key,i)),r.add(e.key);continue}let t=document.createDocumentFragment(),r=C(e.component,E(e),t);e.ref&&(e.ref.current=r),n.appendChild(t);continue}if(typeof e==`string`||typeof e==`number`){n.appendChild(document.createTextNode(String(e)));continue}n.appendChild(e)}let r=n.__vaniKeyed,i=n.__vaniUsedKeys;if(r&&i){for(let[e,t]of r)i.has(e)||(t.handle.dispose(),t.ref&&(t.ref.current=null),r.delete(e));i.clear()}}function pe(e,t){if(h===`ssr`)throw Error(`[vani] renderKeyedChildren is not supported in SSR mode`);let n=e,r=p(n),i=n.__vaniUsedKeys??=new Set,a=n.firstChild;for(let e of t){if(!T(e)||e.key==null)continue;let t=r.get(e.key);t&&t.component!==e.component&&(t.handle.dispose(),t.ref&&(t.ref.current=null),r.delete(e.key),t=void 0);let o=t==null;if(o)t=j(n,e,a),r.set(e.key,t);else{let n=t;n.ref!==e.ref&&(n.ref&&(n.ref.current=null),n.ref=e.ref),n.ref&&(n.ref.current=n.handle),A(n,e.props)&&n.handle.update(),t=n}let s=t;s.start&&s.end&&(!o&&a&&s.start!==a&&O(n,s.start,s.end,a),a=s.end.nextSibling),i.add(e.key)}for(let[e,t]of r)i.has(e)||(t.handle.dispose(),t.ref&&(t.ref.current=null),r.delete(e));i.clear()}function me(e){return typeof SVGElement<`u`&&e instanceof SVGElement}function N(e,t){return e.startsWith(`aria`)?`aria-`+e.replace(`aria-`,``).replace(`aria`,``).toLowerCase():e.startsWith(`data`)?`data-`+e.replace(`data-`,``).replace(`data`,``):e.toLowerCase()===`htmlfor`?`for`:t?e:e.toLowerCase()}d({getRenderMode:g,createTextNode:e=>b(e),addNodeCleanup:se,classNames:P,normalizeAttrKey:N});function he(e,t){let n=v(e)?y.has(e.tag):me(e);for(let r in t){let i=t[r];if(![`key`,`ref`].includes(r)){if(r===`className`){let t=P(i);v(e)?e.props.class=t:n?e.setAttribute(`class`,t):e.className=t;continue}if(r.startsWith(`on`)&&typeof i==`function`)v(e)||(e[r.toLowerCase()]=i);else if(i===!0)v(e)?e.props[r]=!0:e.setAttribute(r,``);else if(i===!1||i==null)continue;else{let t=N(r,n);v(e)?e.props[t]=String(i):e.setAttribute(t,String(i))}}}}function P(...e){return e.map(e=>{if(!(e==null||e===``))return typeof e==`string`?e.trim():Array.isArray(e)?P(...e):Object.entries(e).filter(([e,t])=>t).map(([e])=>e.trim()).join(` `).trim()}).filter(Boolean).join(` `)}let F=!1;function I(e,t,...n){let r=oe(e);return de(t)?(t.ref&&(!v(r)&&!F?(t.ref.current=r,r.__vaniDomRef=t.ref):t.ref.current=null),he(r,t),F||M(r,n),r):(M(r,[t,...n]),r)}const L=(...e)=>{if(h===`ssr`){let t={type:`fragment`,children:[]};return M(t,e),t}let t=document.createDocumentFragment();return M(t,e),t};function R(e,t){if(h===`ssr`)return{type:`component`,instance:{$$vani:`component`,component:e,props:t}};let n=document.createDocumentFragment();return C(e,t,n),n}let z=!1,B=!1,V=!1,H=0,U=!1,W=!1;const G=new Set,K=new Set;function ge(e){let t=B;B=!0;try{e()}finally{B=t,H>0?W=!0:q()}}function _e(e){H+=1;try{e()}finally{--H,H===0&&(U&&(U=!1,J()),W&&(W=!1,q()))}}function q(){V||(V=!0,setTimeout(()=>{V=!1,ve()},0))}function J(){z||(z=!0,queueMicrotask(()=>{z=!1;for(let e of G)e.updateSync(e.__vaniUpdateOptions);G.clear()}))}function ve(){for(let e of K)e.updateSync(e.__vaniUpdateOptions);K.clear(),K.size>0&&q()}let Y=!1,X=null,Z=0;function Q(e){$()&&console.warn(`[vani] hydration warning: ${e}`)}function ye(e,t){let n=X;(!n||!e.contains(n))&&(n=e.firstChild);let r=!1;for(;n;){if(n.nodeType===Node.COMMENT_NODE&&n.nodeValue===`vani:start`)return r&&Q(`Found <!--vani:end--> before <!--vani:start--> for component #${t}. This usually means the server HTML anchor order is incorrect.`),n;n.nodeType===Node.COMMENT_NODE&&n.nodeValue===`vani:end`&&(r=!0),n=n.nextSibling}throw Q(`Expected <!--vani:start--> for component #${t}, but none was found. This usually means the server HTML does not match the client component tree.`),Error(`[vani] hydration failed: start anchor not found`)}function be(e,t){let n=e.nextSibling,r=0;for(;n;){if(n.nodeType===Node.COMMENT_NODE){if(n.nodeValue===`vani:start`)r+=1;else if(n.nodeValue===`vani:end`){if(r===0)return X=n.nextSibling,n;--r}}n=n.nextSibling}throw Q(`Expected <!--vani:end--> for component #${t}, but none was found. This usually means the server HTML does not match the client component tree.`),Error(`[vani] hydration failed: end anchor not found`)}function xe(e,t){let n=[];Y=!0,X=t.firstChild,Z=0;try{n=w(e,t)}catch(e){console.error(`[vani] hydration failed:`,e)}finally{if($()&&X){let e=X,t=!1;for(;e;){if(e.nodeType===Node.COMMENT_NODE){let n=e.nodeValue;if(n===`vani:start`||n===`vani:end`){t=!0;break}}e=e.nextSibling}t&&Q(`Unused SSR anchors detected after hydration. Some server-rendered DOM was not claimed by the client runtime.`)}Y=!1,X=null,Z=0}return n}function $(){return`__vaniDevMode`in globalThis?globalThis.__vaniDevMode===!0:import.meta.env?import.meta.env.DEV:typeof process<`u`&&process.env!==void 0?process.env.NODE_ENV===`development`:!1}export{te as _,ie as a,g as c,$ as d,R as f,ge as g,ne as h,re as i,xe as l,w as m,P as n,I as o,pe as p,m as r,L as s,_e as t,T as u,ee as v,f as y};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@vanijs/vani",
-  "version": "0.2.0",
-  "description": "Web-standards-first UI runtime with explicit updates, fine-grained DOM ownership, and zero dependencies. No Virtual DOM, no JSX, no compiler. Built for SPA, SSR, and SSG.",
+  "version": "0.4.0",
+  "description": "Web-standards-first UI runtime with explicit updates, fine-grained DOM ownership, and zero dependencies. JS-first, transpiler-free, with an optional JSX adapter. Built for SPA, SSR, and SSG.",
   "keywords": [
     "ui",
     "frontend",
@@ -11,7 +11,8 @@
     "fine-grained",
     "explicit-rendering",
     "no-virtual-dom",
-    "no-jsx",
+    "js-first",
+    "jsx-runtime",
     "no-compiler",
     "ssr",
     "ssg",
@@ -22,7 +23,7 @@
     "typescript",
     "zero-dependencies"
   ],
-  "homepage": "https://itsjavi.com/vani",
+  "homepage": "https://vanijs.dev",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/itsjavi/vani.git"
@@ -36,6 +37,14 @@
     ".": {
       "types": "./dist/lib/index.d.mts",
       "default": "./dist/lib/index.mjs"
+    },
+    "./jsx-runtime": {
+      "types": "./dist/lib/jsx-runtime.d.mts",
+      "default": "./dist/lib/jsx-runtime.mjs"
+    },
+    "./jsx-dev-runtime": {
+      "types": "./dist/lib/jsx-dev-runtime.d.mts",
+      "default": "./dist/lib/jsx-dev-runtime.mjs"
     }
   },
   "module": "./dist/lib/index.mjs",
@@ -50,41 +59,58 @@
   ],
   "dependencies": {},
   "devDependencies": {
+    "@babel/runtime": "^7.28.6",
+    "@codemirror/commands": "^6.10.1",
+    "@codemirror/lang-javascript": "^6.2.4",
+    "@codemirror/state": "^6.5.4",
+    "@codemirror/view": "^6.39.11",
     "@eslint/js": "^9.39.2",
+    "@rollup/pluginutils": "^5.3.0",
     "@shikijs/langs": "^3.21.0",
     "@shikijs/themes": "^3.21.0",
     "@tailwindcss/vite": "^4.1.18",
     "@types/bun": "^1.3.6",
-    "@types/node": "^25.0.9",
+    "@types/node": "^25.0.10",
+    "@typescript/native-preview": "7.0.0-dev.20260122.3",
+    "@uiw/codemirror-theme-vscode": "^4.25.4",
     "eslint": "^9.39.2",
     "globals": "^17.0.0",
+    "knip": "^5.82.1",
     "lucide-static": "^0.562.0",
-    "prettier": "^3.8.0",
+    "madge": "^8.0.0",
+    "playwright": "^1.57.0",
+    "prettier": "^3.8.1",
     "prettier-plugin-tailwindcss": "^0.7.2",
-    "publint": "^0.3.16",
+    "publint": "^0.3.17",
     "shiki": "^3.21.0",
+    "sort-package-json": "^3.6.0",
     "tailwind-merge": "^3.4.0",
     "tailwindcss": "^4.1.18",
     "tsdown": "0.20.0-beta.4",
     "tw-animate-css": "^1.4.0",
-    "typescript": "~5.9.3",
+    "typescript": "^5.9.3",
     "typescript-eslint": "^8.53.1",
-    "vite": "npm:rolldown-vite@7.3.1"
+    "vite": "8.0.0-beta.8"
   },
   "publishConfig": {
     "access": "public"
   },
   "scripts": {
-    "build": "rm -rf dist && vite build && pnpm run build:lib",
-    "build:lib": "pnpm tsdown src/vani/index.ts --minify --out-dir dist/lib --dts",
+    "bench": "pnpm run --filter benchmarks bench",
+    "bench:build": "pnpm run --filter benchmarks build --base '/benchmarks/{dir}'",
+    "bench:dev": "pnpm run --filter benchmarks dev",
+    "build": "pnpm run cleanup && vite build && pnpm run build:lib",
+    "build:lib": "pnpm tsdown src/vani/index.ts src/vani/jsx-runtime.ts src/vani/jsx-dev-runtime.ts --minify --out-dir dist/lib --dts",
+    "build:pages": "pnpm run cleanup && vite build && pnpm run bench:build && cp -r bench/dist ./dist/client/benchmarks && cp -r bench/snapshot/results ./dist/client/benchmarks/data",
+    "cleanup": "rm -rf dist node_modules/.vite node_modules/.vite-temp bench/dist bench/frameworks/*/dist",
     "dev": "vite",
-    "dev:debug": "open http://localhost:4555 && PORT=4555 bun run --watch src/debug/*.html",
-    "format": "prettier --write . && pnpm dlx sort-package-json",
+    "format": "prettier --write . && pnpm run format:pkg",
+    "format:pkg": "pnpm sort-package-json package.json bench/package.json bench/frameworks/**/package.json",
     "lint": "pnpm run typecheck && pnpm run lint:eslint && pnpm run lint:circular",
-    "lint:circular": "pnpm dlx madge --circular --extensions ts src/",
+    "lint:circular": "pnpm madge --circular --extensions ts src/",
     "lint:eslint": "eslint .",
-    "lint:unused": "pnpm dlx knip --exclude exports",
-    "preview": "vite preview",
+    "lint:unused": "pnpm knip --exclude exports",
+    "preview": "pnpm run build:pages && vite preview",
     "typecheck": "tsc --noEmit"
   }
 }