@firsthandjs/dom 0.7.1 → 0.9.0

package/dist/chunk-26MSEGYG.js

@@ -0,0 +1 @@
+import{p as d,q as i}from"./chunk-NNHZJMZS.js";import{createRoot as r,onCleanup as s,untrack as u}from"@firsthandjs/core";function y(o,e=document.body){return f(o,e,null)}function f(o,e,l){let t;return r(n=>{t=n;let p=()=>{c(e,u(o),l!==null)};l===null?p():l(p)}),t}function c(o,e,l){if(typeof e=="function"){d(o,e);return}let t=null;if(l){let n=[...o.childNodes];t=n.length===1?n[0]:n}t=i(o,null,t,e),s(()=>{i(o,null,t,null)})}export{y as a,f as b};

package/dist/chunk-NNHZJMZS.js

@@ -0,0 +1 @@
+function z(n,i,e){return n}var a={current:null};function J(n){let i=n.firstChild,e=a.current;return e===null?i:e.step(i)}function K(n){let i=n.nextSibling,e=a.current;return e===null?i:e.step(i)}import{bind as O,createOwner as q,signal as P,disposeOwner as B,getOwner as S,onCleanup as H,runWithOwner as R,setOwner as D}from"@firsthandjs/core";var w=0;function tn(n){w++;try{n()}finally{w--}}var M=3;function E(n){return typeof n.nodeType=="number"}var I=Symbol("firsthand.part"),L=Symbol("firsthand.flat");function on(n){return{[I]:!0,anchor:document.createTextNode(""),thunk:n,owner:S()}}function C(n){return I in n}function ln(n=""){return{slots:[],owner:S(),generation:0,name:n}}function b(n){n.busy=!0}function F(n,i){let e=n.slots[i];if(e!==void 0)return e.seen=n.generation,e;let o={seen:n.generation};return n.slots[i]=o,o}function rn(n,i){let e=q(n.owner);return i.owner=e,D(e)}function dn(n){D(n)}function sn(n,i){let e=n.generation,o=n.slots;for(let t=0;t<o.length;t++){let l=o[t];l===void 0||l.seen===e||(l.owner!==void 0&&B(l.owner),o[t]=void 0)}return n.generation=e+1,i}function un(n,i,e){let o=F(n,i),t=o.cell;if(t===void 0){let l=P(e);return o.cell=l,l}return t.peek()!==e&&(b(n),t.value=e),t}function fn(n,i,e,o,t){let l=F(n,i);if(l.node===void 0&&a.current!==null){let r=a.current.claim(e,o);if(r!==null){if(typeof t=="object"&&t!==null&&C(t)){l.last=t,a.current.keep(l,e,t.anchor,r),R(t.owner,()=>{p(e,t.thunk,t.anchor)});return}l.node=r.nodes,l.text=r.text}}let d=typeof t;if(d==="string"||d==="number"){let r=String(t);if(r===l.text)return;b(n),l.text=r,l.node=h(e,o,l.node??null,r);return}l.text=void 0,t!==l.last&&(b(n),l.last=t,l.node=h(e,o,l.node??null,t))}function p(n,i,e=null,o){if(typeof i!="function"){h(n,e,null,i);return}let t=null,l,d=o!==void 0?o:a.current===null?null:a.current.claim(n,e),r=d!==null;d!==null&&(t=d.nodes,l=d.text);let u=()=>{let f=i(),c=typeof f;if(c==="string"||c==="number"){let y=String(f);y!==l&&(l=y,t=h(n,e,t,y));return}if(l=void 0,c==="function"){if(r){t=null,p(n,f,e,d);return}t=N(t),p(n,f,e,null);return}t=h(n,e,t,f)};d===null?O(u):a.current.within(d.region,()=>{O(u)}),r=!1,H(()=>{t=w>0?null:N(t)})}function h(n,i,e,o){let t=typeof o;if(o==null||t==="boolean")return x(n,i,e);if(t==="string"||t==="number"){let l=String(o);return e!==null&&!Array.isArray(e)&&e.nodeType===M?(e.data=l,e):k(n,i,e,document.createTextNode(l))}if(t==="function")return h(n,i,e,o());if(Array.isArray(o)){if(L in o){let r=o;return r.length===0?x(n,i,e):(v(n,i,e===null?[]:Array.isArray(e)?e:[e],r),r)}let l=[],d=[];if(W(o,l,d),l.length===0)return x(n,i,e);v(n,i,e===null?[]:Array.isArray(e)?e:[e],l);for(let r=0;r<d.length;r++){let u=d[r];R(u.owner??S(),()=>{p(n,u.thunk,u.anchor)})}return l}return C(o)?h(n,i,e,[o]):E(o)?k(n,i,e,o):h(n,i,e,String(o))}function W(n,i,e){for(let o=0;o<n.length;o++){let t=n[o];if(typeof t=="object"&&t!==null&&C(t)){i.push(t.anchor),e.push(t);continue}for(;typeof t=="function";)t=t();t==null||typeof t=="boolean"||(Array.isArray(t)?W(t,i,e):typeof t=="object"&&E(t)?i.push(t):i.push(document.createTextNode(String(t))))}}function j(n){let i=n.parentNode;i!==null&&i.removeChild(n)}function x(n,i,e){return i===null&&Array.isArray(e)&&e.length>1&&n.childNodes.length===e.length?(n.textContent="",null):N(e)}function N(n){if(n!==null)if(Array.isArray(n))for(let i=0;i<n.length;i++)j(n[i]);else j(n);return null}function k(n,i,e,o){return e===o?o:e!==null&&!Array.isArray(e)?(n.replaceChild(o,e),o):(N(e),n.insertBefore(o,i),o)}function v(n,i,e,o){let t=0,l=0,d=e.length-1,r=o.length-1;for(;t<=d&&l<=r&&e[t]===o[l];)t++,l++;for(;t<=d&&l<=r&&e[d]===o[r];)d--,r--;let u=r+1<o.length?o[r+1]:i;if(t>d){for(let s=l;s<=r;s++)n.insertBefore(o[s],u);return}if(l>r){for(let s=t;s<=d;s++)n.removeChild(e[s]);return}let f=new Map;for(let s=t;s<=d;s++)f.set(e[s],s);let c=r-l+1,y=new Int32Array(c).fill(-1);for(let s=0;s<c;s++){let g=o[l+s],_=f.get(g);_!==void 0&&(y[s]=_,f.delete(g))}for(let s of f.keys())n.removeChild(s);let A=X(y),m=A.length-1,T=u;for(let s=c-1;s>=0;s--){let g=o[l+s];m>=0&&A[m]===s?m--:n.insertBefore(g,T),T=g}}function X(n){let i=n.length,e=new Int32Array(i).fill(-1),o=[];for(let d=0;d<i;d++){let r=n[d];if(r===-1)continue;let u=0,f=o.length;for(;u<f;){let c=u+f>>1;n[o[c]]<r?u=c+1:f=c}u>0&&(e[d]=o[u-1]),o[u]=d}let t=[],l=o.length>0?o[o.length-1]:-1;for(;l!==-1;)t.push(l),l=e[l];return t.reverse()}export{z as a,a as b,J as c,K as d,tn as e,L as f,on as g,ln as h,b as i,F as j,rn as k,dn as l,sn as m,un as n,fn as o,p,h as q,v as r};

package/dist/chunk-TZRPGQ3R.js

@@ -0,0 +1 @@
+import{e as v,f as $,g as O,q as A}from"./chunk-NNHZJMZS.js";var b=null,k=new WeakMap;function yn(n){b=n,k=new WeakMap}var h=class extends Error{constructor(e){super(`${e} is not a Firsthand component. If it is a React component, import '@firsthandjs/react/auto' once at startup to render React components directly, or wrap it with fromReact(). Otherwise, declare it with component().`),this.name="FirsthandComponentError"}};function S(n){let e=k.get(n);if(e!==void 0)return e;if(b===null){let o=typeof n=="function"&&n.name!==""?n.name:"The value";throw new h(o)}let t=b(n);return k.set(n,t),t}import{signal as Q,createOwner as T,devEnterSetup as j,devExitSetup as m,disposeOwner as U,getOwner as N,handleError as L,setOwner as f,untrack as H}from"@firsthandjs/core";var M=Symbol.for("firsthand.component"),V=Symbol.for("firsthand.view"),X=0,F="firsthand";function Pn(n){F=n}function vn(n,e,t,o){let s=Object.assign(i=>nn(s,i),{[M]:!0,setup:n,options:e,id:t??`c${String(++X)}`,tag:void 0});return Object.defineProperty(s,"name",{configurable:!0,value:o??(n.name===""?"Component":n.name)}),t===void 0&&(`${s.name}`,void 0),(e?.tag!==void 0||e?.shadow===!0)&&tn(s,typeof e.tag=="string"?e.tag:void 0),s}function $n(n){return typeof n=="function"&&M in n}function On(n){return n[V]=!0,n}function nn(n,e){if(Object.freeze(e),n.setup===void 0)return V in n?O(()=>n(e)):S(n)(e);if(n.tag!==void 0)return sn(n,e);let t=T(N());n.name;let o=f(t);try{j(n.id);let r=H(()=>n.setup(e));return m(),f(o),r}catch(r){return m(),f(o),L(r,t),null}}function en(n){let e=n.name.replace(/([a-z0-9])([A-Z])/g,"$1-$2").replace(/[^a-zA-Z0-9-]/g,"-").toLowerCase();return`${F}-${e}`}function tn(n,e){let t=n;if(t.tag!==void 0)return t.tag;let o=e??en(t);return customElements.get(o)!==void 0&&(o=`${o}-${t.id.replace(/[^a-zA-Z0-9]/g,"").toLowerCase()}`),t.tag=o,customElements.define(o,on(t)),o}function on(n){let e=n.options?.shadow===!0,t=n.options?.attributes,o=t!==void 0?Object.keys(t):[];return class extends HTMLElement{static observedAttributes=o;constructor(){super(),this.$owner=null,this.$props=null,this.$attrs=null,this.$standalone=!1}connectedCallback(){this.$owner===null&&(this.$standalone=!0,this.$attrs={},this.$props=rn(this,t,this.$attrs),W(this,n,e))}disconnectedCallback(){!this.$standalone||this.$owner===null||(U(this.$owner),this.$owner=null)}attributeChangedCallback(s,i,u){let c=this.$attrs?.[s];c!==void 0&&(c.value=t[s]?.(u))}}}function rn(n,e,t){let o={};if(e!==void 0)for(let r in e){let s=Q(e[r](n.getAttribute(r)));t[r]=s,Object.defineProperty(o,r,{enumerable:!0,get:()=>s.value})}return Object.freeze(o)}function W(n,e,t){let o=T(N());e.name,n.$owner=o;let r=f(o);try{j(e.id);let s=t?n.attachShadow({mode:"open"}):n,i=H(()=>e.setup(n.$props));m(),A(s,null,null,i)}catch(s){m(),L(s,o)}finally{f(r)}}function sn(n,e){let t=document.createElement(n.tag);return t.$props=e,W(t,n,n.options?.shadow===!0),t}import{batch as un,createOwner as z,disposeOwner as dn,getOwner as cn,setOwner as C,signal as I,untrack as D}from"@firsthandjs/core";function Hn(n,e,t){let o=z(cn()),r=new Map;return()=>{let s=n(),i=new Map,u=[];return u[$]=!0,D(()=>{un(()=>{c()})}),r=i,u;function c(){for(let d=0;d<s.length;d++){let a=s[d],p=e(a,d);if(i.has(p)){`${String(p)}`;continue}let l=r.get(p);l===void 0?l=ln(o,a,d,t):(r.delete(p),l.item.value=a,l.index.value=d),i.set(p,l);for(let y=0;y<l.nodes.length;y++)u.push(l.nodes[y])}v(()=>{for(let d of r.values())dn(d.owner)})}}}function ln(n,e,t,o){let r=z(n),s=I(e),i=I(t),u=C(r),c;try{c=D(()=>o(s,i)),C(u)}catch(a){throw C(u),a}let d=[];return K(c,d),{owner:r,item:s,index:i,nodes:d}}function K(n,e){if(!(n==null||typeof n=="boolean")){if(Array.isArray(n)){for(let t=0;t<n.length;t++)K(n[t],e);return}if(typeof n=="object"&&typeof n.nodeType=="number"){e.push(n);return}e.push(document.createTextNode(String(n)))}}var an=new Set(["click","dblclick","contextmenu","input","beforeinput","change","keydown","keyup","keypress","pointerdown","pointerup","pointermove","mousedown","mouseup","mouseover","mouseout","submit","focusin","focusout","touchstart","touchend"]),Z=new Set;function w(n){return`$firsthand$${n}`}function pn(n){let e=w(n.type),t=n.composedPath(),o=null;Object.defineProperty(n,"currentTarget",{configurable:!0,get:()=>o});for(let r=0;r<t.length;r++){let s=t[r],i=s[e];if(i!==void 0&&(o=s,i.call(s,n),n.cancelBubble)||s===document)break}o=null}function g(n,e,t,o){if(o!==void 0||!an.has(e)){let r=n,s=o===!0?void 0:o,i=`${w(e)}$${s===void 0?"":Object.keys(s).sort().join(",")}`,u=r[i];u!==void 0&&n.removeEventListener(e,u.handler,u.options),r[i]={handler:t,options:s},n.addEventListener(e,t,s);return}n[w(e)]=t,Z.has(e)||(Z.add(e),document.addEventListener(e,pn))}function Vn(n,e){n[w(e)]=void 0}var fn={class:"className",for:"htmlFor"};function R(n,e,t){t==null||t===!1?n.removeAttribute(e):n.setAttribute(e,t===!0?"":String(t))}function zn(n,e,t,o){o==null||o===!1?n.removeAttributeNS(e,t):n.setAttributeNS(e,t,o===!0?"":String(o))}function x(n,e,t){n[fn[e]??e]=t}function Dn(n,e,t){n[e]=!!t}function P(n,e){e==null?n.removeAttribute("class"):n.className=String(e)}function B(n,e,t){let o=n.classList;if(t!==void 0)for(let r in t)r in e||o.remove(r);for(let r in e){let s=!!e[r];(t===void 0||!!t[r]!==s)&&o.toggle(r,s)}}function _(n,e){e==null?n.style.cssText="":n.style.cssText=String(e)}function Y(n,e,t){let o=n.style;if(t!==void 0)for(let r in t)r in e||o.removeProperty(E(r));for(let r in e){let s=e[r];(t===void 0||t[r]!==s)&&(s==null?o.removeProperty(E(r)):o.setProperty(E(r),String(s)))}}var mn=/[A-Z]/g,q=new Map;function E(n){let e=q.get(n);return e===void 0&&(e=n.startsWith("--")?n:n.replace(mn,t=>`-${t.toLowerCase()}`),q.set(n,e)),e}function wn(n,e,t){if(e==="class"||e==="className"){Array.isArray(t)?P(n,t.filter(Boolean).join(" ")):t!==null&&typeof t=="object"?B(n,t,J(n,"class",t)):P(n,t);return}if(e==="style"){t!==null&&typeof t=="object"?Y(n,t,J(n,"style",t)):_(n,t);return}if(e==="ref"){t(n);return}if(e.startsWith("prop:")){x(n,e.slice(5),t);return}if(e.startsWith("attr:")){R(n,e.slice(5),t);return}if(e.startsWith("on")&&e.length>2&&/[A-Z:]/.test(e[2])){gn(n,e,t);return}if(e in n&&typeof t!="string"){x(n,e,t);return}R(n,e,t)}function gn(n,e,t){let o=e.slice(2).split(":"),r=o[0]==="",s=r?o[1]:o[0].toLowerCase(),i=o[r?2:1];i===void 0?g(n,s,t):i==="native"?g(n,s,t,!0):g(n,s,t,{[i]:!0})}function Bn(n,e){for(let t in e)t!=="children"&&wn(n,t,e[t])}function _n(...n){let e={};for(let t=0;t<n.length;t++){let o=n[t];for(let r of Object.keys(o))Object.defineProperty(e,r,{enumerable:!0,configurable:!0,get:()=>o[r]})}return e}function Yn(n,e){let t={};for(let o of Object.keys(n))e.includes(o)||Object.defineProperty(t,o,{enumerable:!0,get:()=>n[o]});return Object.freeze(t)}var G=new WeakMap;function J(n,e,t){let o=G.get(n);o===void 0&&(o={},G.set(n,o));let r=o[e];return o[e]=t,r}export{yn as a,h as b,M as c,V as d,Pn as e,vn as f,$n as g,On as h,nn as i,tn as j,Hn as k,g as l,Vn as m,R as n,zn as o,x as p,Dn as q,P as r,B as s,_ as t,Y as u,wn as v,Bn as w,_n as x,Yn as y};

package/dist/claim.d.ts

@@ -0,0 +1,76 @@
+/**
+ * The seam hydration is installed through.
+ *
+ * `template` and `insert` have to be able to adopt nodes a server sent, and
+ * an application that has no server must not pay for the machinery that does
+ * it. So they do not import it. They read one holder, which is empty until
+ * `@firsthandjs/dom/hydrate` fills it — and a bundle that never imports that
+ * module never contains the machinery at all, because nothing references it.
+ *
+ * What is left behind in the ordinary path is one property read and one
+ * comparison against `null`, in two places.
+ */
+/** What a region of server markup turned out to hold. */
+export type Claimed = {
+    /** The nodes the region holds, as a child slot. */
+    nodes: Node | Node[] | null;
+    /** The text already there, when the region is one text node. */
+    text: string | undefined;
+    /** The region itself, for the calls made while a child's first run happens. */
+    region: Region;
+};
+/** Where a claim has got to. */
+export type Region = {
+    /** The next unclaimed node, or null when the region is used up. */
+    node: Node | null;
+    /** The node the region stops before. */
+    end: Node | null;
+};
+/**
+ * The part of a site hydration fills in.
+ *
+ * Structural, so that the holder does not have to import `insert.ts` and
+ * `insert.ts` does not have to export its record type to reach through it.
+ */
+export type Filled = {
+    node?: Node | Node[] | null;
+};
+export type Claimer = {
+    /** The element name a template's markup makes. */
+    tag(html: string): string;
+    /** The next node of the current region, if it is a `tag`. */
+    adopt(tag: string): Node | null;
+    /**
+     * Gives a child a run keeps the nodes the run claimed for it.
+     *
+     * Puts `anchor` at the end of the region and offers the region to whoever
+     * claims against that anchor next, which is the child's own `insert`.
+     */
+    keep(slot: Filled, parent: Node, anchor: Node, claimed: Claimed): void;
+    /** The region belonging to the next dynamic child of `parent`. */
+    claim(parent: Node, marker: Node | null): Claimed | null;
+    /** Makes `region` the one nodes are adopted from while `body` runs. */
+    within<T>(region: Region, body: () => T): T;
+    /** A step through the template that goes over a whole region at a time. */
+    step(node: Node): Node;
+};
+/**
+ * The installed claimer, or nothing.
+ *
+ * A holder rather than an exported binding, so that every reader sees the
+ * same value however the module is bundled.
+ */
+export declare const hydration: {
+    current: Claimer | null;
+};
+/**
+ * The first child of `node`, stepping over a dynamic child's content.
+ *
+ * Emitted by the compiler in place of `.firstChild` for a build that can
+ * hydrate. `.firstChild` would walk into the content of a dynamic child,
+ * because the content has a length the template does not.
+ */
+export declare function first(node: Node): Node;
+/** The next sibling of `node`, stepping over a dynamic child's content. */
+export declare function next(node: Node): Node;
+//# sourceMappingURL=claim.d.ts.map

package/dist/claim.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"claim.d.ts","sourceRoot":"","sources":["../src/claim.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH,yDAAyD;AACzD,MAAM,MAAM,OAAO,GAAG;IACpB,mDAAmD;IACnD,KAAK,EAAE,IAAI,GAAG,IAAI,EAAE,GAAG,IAAI,CAAC;IAC5B,gEAAgE;IAChE,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IACzB,+EAA+E;IAC/E,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,gCAAgC;AAChC,MAAM,MAAM,MAAM,GAAG;IACnB,mEAAmE;IACnE,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;IAClB,wCAAwC;IACxC,GAAG,EAAE,IAAI,GAAG,IAAI,CAAC;CAClB,CAAC;AAEF;;;;;GAKG;AACH,MAAM,MAAM,MAAM,GAAG;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,EAAE,GAAG,IAAI,CAAC;CAC7B,CAAC;AAEF,MAAM,MAAM,OAAO,GAAG;IACpB,kDAAkD;IAClD,GAAG,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAAC;IAC1B,6DAA6D;IAC7D,KAAK,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,GAAG,IAAI,CAAC;IAChC;;;;;OAKG;IACH,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,GAAG,IAAI,CAAC;IACvE,kEAAkE;IAClE,KAAK,CAAC,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,GAAG,IAAI,GAAG,OAAO,GAAG,IAAI,CAAC;IACzD,uEAAuE;IACvE,MAAM,CAAC,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,CAAC,GAAG,CAAC,CAAC;IAC5C,2EAA2E;IAC3E,IAAI,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;CACxB,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,SAAS,EAAE;IAAE,OAAO,EAAE,OAAO,GAAG,IAAI,CAAA;CAAsB,CAAC;AAExE;;;;;;GAMG;AACH,wBAAgB,KAAK,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,CAItC;AAED,2EAA2E;AAC3E,wBAAgB,IAAI,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,CAIrC"}

package/dist/component.d.ts

@@ -2,6 +2,14 @@ import type { ReadonlyProps } from '@firsthandjs/core';
 import { type DynamicChild } from './insert.js';
 /** Marks a value as a Firsthand component; used by the JSX runtime and compiler. */
 export declare const COMPONENT: unique symbol;
+/**
+ * Marks a plain function that returns markup.
+ *
+ * `Symbol.for` rather than a local symbol: the mark has to survive a module
+ * boundary, so a view function compiled in one package is recognised in
+ * another that may hold its own copy of this module.
+ */
+export declare const VIEW: unique symbol;
 export type ComponentOptions = {
     /** Attach a shadow root to the element host. Implies `tag` (ADR-0007). */
     shadow?: boolean;
@@ -23,7 +31,20 @@ export type AttributeCodec = (raw: string | null) => unknown;
  * fragment, and what a component returns when it renders something that has to
  * be bound after it is placed — a route outlet, for instance.
  */
-export type View = Node | string | number | boolean | null | undefined | DynamicChild | readonly View[];
+export type View = Node | string | number | boolean | null | undefined | DynamicChild | readonly View[] | Render;
+/**
+ * A view that is evaluated as a whole, again, when something it read changes.
+ *
+ * This is what a setup returns when it has statements above its markup — an
+ * `if`, a value derived from several signals — and it is an ordinary function,
+ * which is the point: it is a reactive scope like `effect` and `computed`, one
+ * level up.
+ *
+ * ```tsx
+ * component(() => () => (signedIn.value ? <Page /> : <SignIn />));
+ * ```
+ */
+export type Render = () => View;
 /**
  * Props as a *caller* may write them.
  *
@@ -73,6 +94,20 @@ export declare function setElementPrefix(value: string): void;
  */
 export declare function component<P>(setup: (props: ReadonlyProps<P>) => View, options?: ComponentOptions, id?: string, name?: string): Component<P>;
 export declare function isComponent(value: unknown): value is Component<never>;
+/**
+ * Declares a plain function to be a view.
+ *
+ * A function that returns markup is a view, and a view is a reactive scope:
+ * `<Badge user={user} />` calls it where it stands, and calls it again when
+ * something it read changes. It has no setup, so it owns nothing that has to
+ * survive a run — `signal`, `effect` and their kind belong in a `component`.
+ *
+ * The compiler emits this for every module-level function it compiled markup
+ * into, so that a view imported from another module is still recognised as
+ * ours rather than handed to whatever adapter is installed. Inside one module
+ * the compiler resolves the call itself and this is never consulted.
+ */
+export declare function view<T extends (props: never) => unknown>(target: T): T;
 /**
  * Instantiates a component.
  *

package/dist/component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../src/component.ts"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAGvD,OAAO,EAAc,KAAK,YAAY,EAAE,MAAM,aAAa,CAAC;AAE5D,oFAAoF;AACpF,eAAO,MAAM,SAAS,EAAE,OAAO,MAA0C,CAAC;AAE1E,MAAM,MAAM,gBAAgB,GAAG;IAC7B,0EAA0E;IAC1E,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,+DAA+D;IAC/D,GAAG,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACpB,2EAA2E;IAC3E,UAAU,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC;CACvD,CAAC;AAEF,2EAA2E;AAC3E,MAAM,MAAM,cAAc,GAAG,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,KAAK,OAAO,CAAC;AAE7D;;;;;;;;;;GAUG;AACH,MAAM,MAAM,IAAI,GACd,IAAI,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,IAAI,GAAG,SAAS,GAAG,YAAY,GAAG,SAAS,IAAI,EAAE,CAAC;AAEvF;;;;;;;;GAQG;AACH,MAAM,MAAM,aAAa,CAAC,CAAC,IAAI;KAC5B,CAAC,IAAI,MAAM,CAAC,GAAG,SAAS,SAAS,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,SAAS,GAAG,CAAC,CAAC,CAAC,CAAC;CACjE,CAAC;AAEF,MAAM,MAAM,SAAS,CAAC,CAAC,IAAI;IACzB;;;;;;;OAOG;IACH,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;IAChC,QAAQ,CAAC,CAAC,SAAS,CAAC,EAAE,IAAI,CAAC;IAC3B,QAAQ,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAClD,QAAQ,CAAC,OAAO,EAAE,gBAAgB,GAAG,SAAS,CAAC;IAC/C,2EAA2E;IAC3E,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,4DAA4D;IAC5D,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,oEAAoE;IACpE,GAAG,EAAE,MAAM,GAAG,SAAS,CAAC;CACzB,CAAC;AAKF;;;;;;GAMG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAEpD;AAED;;;;;;GAMG;AACH,wBAAgB,SAAS,CAAC,CAAC,EACzB,KAAK,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,KAAK,IAAI,EACxC,OAAO,CAAC,EAAE,gBAAgB,EAC1B,EAAE,CAAC,EAAE,MAAM,EACX,IAAI,CAAC,EAAE,MAAM,GACZ,SAAS,CAAC,CAAC,CAAC,CAgCd;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,OAAO,GAAG,KAAK,IAAI,SAAS,CAAC,KAAK,CAAC,CAErE;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,eAAe,CAAC,CAAC,EAAE,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,GAAG,IAAI,CAgCvE;AAcD,iFAAiF;AACjF,wBAAgB,UAAU,CAAC,MAAM,EAAE,SAAS,CAAC,OAAO,CAAC,GAAG,MAAM,CAM7D;AAED;;;;;;GAMG;AACH,wBAAgB,aAAa,CAAC,MAAM,EAAE,SAAS,CAAC,KAAK,CAAC,EAAE,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAc5E"}
+{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../src/component.ts"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAGvD,OAAO,EAAoB,KAAK,YAAY,EAAE,MAAM,aAAa,CAAC;AAElE,oFAAoF;AACpF,eAAO,MAAM,SAAS,EAAE,OAAO,MAA0C,CAAC;AAE1E;;;;;;GAMG;AACH,eAAO,MAAM,IAAI,EAAE,OAAO,MAAqC,CAAC;AAEhE,MAAM,MAAM,gBAAgB,GAAG;IAC7B,0EAA0E;IAC1E,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,+DAA+D;IAC/D,GAAG,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IACpB,2EAA2E;IAC3E,UAAU,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,CAAC,CAAC;CACvD,CAAC;AAEF,2EAA2E;AAC3E,MAAM,MAAM,cAAc,GAAG,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI,KAAK,OAAO,CAAC;AAE7D;;;;;;;;;;GAUG;AACH,MAAM,MAAM,IAAI,GACd,IAAI,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,IAAI,GAAG,SAAS,GAAG,YAAY,GAAG,SAAS,IAAI,EAAE,GAAG,MAAM,CAAC;AAEhG;;;;;;;;;;;GAWG;AACH,MAAM,MAAM,MAAM,GAAG,MAAM,IAAI,CAAC;AAEhC;;;;;;;;GAQG;AACH,MAAM,MAAM,aAAa,CAAC,CAAC,IAAI;KAC5B,CAAC,IAAI,MAAM,CAAC,GAAG,SAAS,SAAS,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,SAAS,GAAG,CAAC,CAAC,CAAC,CAAC;CACjE,CAAC;AAEF,MAAM,MAAM,SAAS,CAAC,CAAC,IAAI;IACzB;;;;;;;OAOG;IACH,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC;IAChC,QAAQ,CAAC,CAAC,SAAS,CAAC,EAAE,IAAI,CAAC;IAC3B,QAAQ,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC;IAClD,QAAQ,CAAC,OAAO,EAAE,gBAAgB,GAAG,SAAS,CAAC;IAC/C,2EAA2E;IAC3E,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAC;IACpB,4DAA4D;IAC5D,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,oEAAoE;IACpE,GAAG,EAAE,MAAM,GAAG,SAAS,CAAC;CACzB,CAAC;AAKF;;;;;;GAMG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAEpD;AAED;;;;;;GAMG;AACH,wBAAgB,SAAS,CAAC,CAAC,EACzB,KAAK,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,KAAK,IAAI,EACxC,OAAO,CAAC,EAAE,gBAAgB,EAC1B,EAAE,CAAC,EAAE,MAAM,EACX,IAAI,CAAC,EAAE,MAAM,GACZ,SAAS,CAAC,CAAC,CAAC,CAgCd;AAED,wBAAgB,WAAW,CAAC,KAAK,EAAE,OAAO,GAAG,KAAK,IAAI,SAAS,CAAC,KAAK,CAAC,CAErE;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,IAAI,CAAC,CAAC,SAAS,CAAC,KAAK,EAAE,KAAK,KAAK,OAAO,EAAE,MAAM,EAAE,CAAC,GAAG,CAAC,CAGtE;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,eAAe,CAAC,CAAC,EAAE,MAAM,EAAE,SAAS,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,GAAG,IAAI,CAsCvE;AAcD,iFAAiF;AACjF,wBAAgB,UAAU,CAAC,MAAM,EAAE,SAAS,CAAC,OAAO,CAAC,GAAG,MAAM,CAM7D;AAED;;;;;;GAMG;AACH,wBAAgB,aAAa,CAAC,MAAM,EAAE,SAAS,CAAC,KAAK,CAAC,EAAE,GAAG,CAAC,EAAE,MAAM,GAAG,MAAM,CAc5E"}

package/dist/dev-chunk-5QV3XALZ.js

@@ -0,0 +1,45 @@
+import {
+  applyChild,
+  insert
+} from "./dev-chunk-HTXIHAW7.js";
+
+// packages/dom/src/render.ts
+import { createRoot, onCleanup, untrack } from "@firsthandjs/core";
+function render(view, container = document.body) {
+  return mount(view, container, null);
+}
+function mount(view, container, around) {
+  let dispose;
+  createRoot((stop) => {
+    dispose = stop;
+    const run = () => {
+      attach(container, untrack(view), around !== null);
+    };
+    if (around === null) {
+      run();
+    } else {
+      around(run);
+    }
+  });
+  return dispose;
+}
+function attach(container, result, adopting) {
+  if (typeof result === "function") {
+    insert(container, result);
+    return;
+  }
+  let slot = null;
+  if (adopting) {
+    const children = [...container.childNodes];
+    slot = children.length === 1 ? children[0] : children;
+  }
+  slot = applyChild(container, null, slot, result);
+  onCleanup(() => {
+    applyChild(container, null, slot, null);
+  });
+}
+
+export {
+  render,
+  mount
+};

package/dist/{dev-chunk-2INCAQ6G.js → dev-chunk-HCAUM4JK.js}

@@ -1,3 +1,14 @@
+import {
+  FLAT,
+  applyChild,
+  devComponent,
+  devPart,
+  devWarn,
+  devWarnOnce,
+  discard,
+  part
+} from "./dev-chunk-HTXIHAW7.js";
+
 // packages/dom/src/adapter.ts
 var adapter = null;
 var adapted = /* @__PURE__ */ new WeakMap();
@@ -27,263 +38,6 @@ function adapt(target) {
   return component_;
 }
 
-// packages/dom/src/dev.ts
-function devWarn(message) {
-  console.warn(`[firsthand] ${message}`);
-}
-var seen = /* @__PURE__ */ new Set();
-function devWarnOnce(key2, message) {
-  if (!seen.has(key2)) {
-    seen.add(key2);
-    devWarn(message);
-  }
-}
-function devWarnRenderedObject(value) {
-  const cellish = "peek" in value && typeof value.peek === "function" && "value" in value;
-  devWarnOnce(
-    cellish ? "rendered-cell" : "rendered-object",
-    cellish ? 'A signal or computed was rendered directly, so the page shows "[object Object]". Read it instead: {count.value} rather than {count}.' : `An object was rendered as text, so the page shows "${String(value)}". Render a string, a number or a node.`
-  );
-}
-function hook() {
-  const installed2 = globalThis.__FIRSTHAND_DEVTOOLS__;
-  return installed2 !== void 0 && installed2.attached ? installed2 : void 0;
-}
-function devPart(node, property) {
-  hook()?.part(node, property);
-}
-function devComponent(owner, name) {
-  hook()?.component(owner, name);
-}
-function label(value, kind, name) {
-  if (typeof value === "object" && value !== null) {
-    hook()?.label(value, kind, name);
-  }
-  return value;
-}
-
-// packages/dom/src/insert.ts
-import { bind, getOwner, onCleanup, runWithOwner } from "@firsthandjs/core";
-var TEXT_NODE = 3;
-function isNode(value) {
-  return typeof value.nodeType === "number";
-}
-var PART = /* @__PURE__ */ Symbol("firsthand.part");
-function part(thunk) {
-  return { [PART]: true, anchor: document.createTextNode(""), thunk, owner: getOwner() };
-}
-function isDynamicChild(value) {
-  return PART in value;
-}
-function insert(parent, value, marker = null) {
-  if (typeof value !== "function") {
-    applyChild(parent, marker, null, value);
-    return;
-  }
-  let current = null;
-  bind(() => {
-    const next = value();
-    if (typeof next === "function") {
-      current = clear(current);
-      insert(parent, next, marker);
-      return;
-    }
-    current = applyChild(parent, marker, current, next);
-  });
-  onCleanup(() => {
-    current = clear(current);
-  });
-}
-function applyChild(parent, marker, current, value) {
-  const type = typeof value;
-  if (value == null || type === "boolean") {
-    devPart(parent, "text");
-    return clear(current);
-  }
-  if (type === "string" || type === "number") {
-    devPart(parent, "text");
-    const text = String(value);
-    if (current !== null && !Array.isArray(current) && current.nodeType === TEXT_NODE) {
-      current.data = text;
-      return current;
-    }
-    return single(parent, marker, current, document.createTextNode(text));
-  }
-  if (type === "function") {
-    return applyChild(parent, marker, current, value());
-  }
-  if (Array.isArray(value)) {
-    const next = [];
-    const dynamic = [];
-    flatten(value, next, dynamic);
-    if (next.length === 0) {
-      return clear(current);
-    }
-    reconcile(
-      parent,
-      marker,
-      current === null ? [] : Array.isArray(current) ? current : [current],
-      next
-    );
-    for (let i = 0; i < dynamic.length; i++) {
-      const child = dynamic[i];
-      runWithOwner(child.owner ?? getOwner(), () => {
-        insert(parent, child.thunk, child.anchor);
-      });
-    }
-    return next;
-  }
-  if (isDynamicChild(value)) {
-    return applyChild(parent, marker, current, [value]);
-  }
-  if (isNode(value)) {
-    return single(parent, marker, current, value);
-  }
-  devWarnRenderedObject(value);
-  return applyChild(parent, marker, current, String(value));
-}
-function flatten(value, out, dynamic) {
-  for (let i = 0; i < value.length; i++) {
-    let item = value[i];
-    if (typeof item === "object" && item !== null && isDynamicChild(item)) {
-      out.push(item.anchor);
-      dynamic.push(item);
-      continue;
-    }
-    while (typeof item === "function") {
-      item = item();
-    }
-    if (item == null || typeof item === "boolean") {
-      continue;
-    }
-    if (Array.isArray(item)) {
-      flatten(item, out, dynamic);
-    } else if (typeof item === "object" && isNode(item)) {
-      out.push(item);
-    } else {
-      out.push(document.createTextNode(String(item)));
-    }
-  }
-}
-function detach(node) {
-  const owner = node.parentNode;
-  if (owner !== null) {
-    owner.removeChild(node);
-  }
-}
-function clear(current) {
-  if (current !== null) {
-    if (Array.isArray(current)) {
-      for (let i = 0; i < current.length; i++) {
-        detach(current[i]);
-      }
-    } else {
-      detach(current);
-    }
-  }
-  return null;
-}
-function single(parent, marker, current, node) {
-  if (current === node) {
-    return node;
-  }
-  if (current !== null && !Array.isArray(current)) {
-    parent.replaceChild(node, current);
-    return node;
-  }
-  clear(current);
-  parent.insertBefore(node, marker);
-  return node;
-}
-function reconcile(parent, marker, a, b) {
-  let aStart = 0;
-  let bStart = 0;
-  let aEnd = a.length - 1;
-  let bEnd = b.length - 1;
-  while (aStart <= aEnd && bStart <= bEnd && a[aStart] === b[bStart]) {
-    aStart++;
-    bStart++;
-  }
-  while (aStart <= aEnd && bStart <= bEnd && a[aEnd] === b[bEnd]) {
-    aEnd--;
-    bEnd--;
-  }
-  const after = bEnd + 1 < b.length ? b[bEnd + 1] : marker;
-  if (aStart > aEnd) {
-    for (let i = bStart; i <= bEnd; i++) {
-      parent.insertBefore(b[i], after);
-    }
-    return;
-  }
-  if (bStart > bEnd) {
-    for (let i = aStart; i <= aEnd; i++) {
-      parent.removeChild(a[i]);
-    }
-    return;
-  }
-  const oldIndex = /* @__PURE__ */ new Map();
-  for (let i = aStart; i <= aEnd; i++) {
-    oldIndex.set(a[i], i);
-  }
-  const middle = bEnd - bStart + 1;
-  const sources = new Int32Array(middle).fill(-1);
-  for (let j = 0; j < middle; j++) {
-    const node = b[bStart + j];
-    const found = oldIndex.get(node);
-    if (found !== void 0) {
-      sources[j] = found;
-      oldIndex.delete(node);
-    }
-  }
-  for (const node of oldIndex.keys()) {
-    parent.removeChild(node);
-  }
-  const keep = longestIncreasing(sources);
-  let k = keep.length - 1;
-  let anchor = after;
-  for (let j = middle - 1; j >= 0; j--) {
-    const node = b[bStart + j];
-    if (k >= 0 && keep[k] === j) {
-      k--;
-    } else {
-      parent.insertBefore(node, anchor);
-    }
-    anchor = node;
-  }
-}
-function longestIncreasing(sources) {
-  const length = sources.length;
-  const predecessor = new Int32Array(length).fill(-1);
-  const tails = [];
-  for (let i = 0; i < length; i++) {
-    const value = sources[i];
-    if (value === -1) {
-      continue;
-    }
-    let low = 0;
-    let high = tails.length;
-    while (low < high) {
-      const mid = low + high >> 1;
-      if (sources[tails[mid]] < value) {
-        low = mid + 1;
-      } else {
-        high = mid;
-      }
-    }
-    if (low > 0) {
-      predecessor[i] = tails[low - 1];
-    }
-    tails[low] = i;
-  }
-  const result = [];
-  let cursor = tails.length > 0 ? tails[tails.length - 1] : -1;
-  while (cursor !== -1) {
-    result.push(cursor);
-    cursor = predecessor[cursor];
-  }
-  return result.reverse();
-}
-
 // packages/dom/src/component.ts
 import {
   signal,
@@ -291,12 +45,13 @@ import {
   devEnterSetup,
   devExitSetup,
   disposeOwner,
-  getOwner as getOwner2,
+  getOwner,
   handleError,
   setOwner,
   untrack
 } from "@firsthandjs/core";
 var COMPONENT = /* @__PURE__ */ Symbol.for("firsthand.component");
+var VIEW = /* @__PURE__ */ Symbol.for("firsthand.view");
 var sequence = 0;
 var prefix = "firsthand";
 function setElementPrefix(value) {
@@ -333,15 +88,22 @@ function component(setup, options, id, name) {
 function isComponent(value) {
   return typeof value === "function" && COMPONENT in value;
 }
+function view(target) {
+  target[VIEW] = true;
+  return target;
+}
 function createComponent(target, props) {
   Object.freeze(props);
   if (target.setup === void 0) {
+    if (VIEW in target) {
+      return part(() => target(props));
+    }
     return adapt(target)(props);
   }
   if (target.tag !== void 0) {
     return createHost(target, props);
   }
-  const owner = createOwner(getOwner2());
+  const owner = createOwner(getOwner());
   devComponent(owner, target.name);
   const previous = setOwner(owner);
   try {
@@ -427,7 +189,7 @@ function attributeProps(element, codecs, cells) {
   return Object.freeze(props);
 }
 function mountHost(element, target, shadow) {
-  const owner = createOwner(getOwner2());
+  const owner = createOwner(getOwner());
   devComponent(owner, target.name);
   element.$owner = owner;
   const previous = setOwner(owner);
@@ -456,22 +218,30 @@ import {
   batch,
   createOwner as createOwner2,
   disposeOwner as disposeOwner2,
-  getOwner as getOwner3,
+  getOwner as getOwner2,
   setOwner as setOwner2,
   signal as signal2,
   untrack as untrack2
 } from "@firsthandjs/core";
 function list(each, keyOf, render) {
-  const host = createOwner2(getOwner3());
+  const host = createOwner2(getOwner2());
   let rows = /* @__PURE__ */ new Map();
   return () => {
     const items = each();
     const next = /* @__PURE__ */ new Map();
     const nodes = [];
-    batch(() => {
+    nodes[FLAT] = true;
+    untrack2(() => {
+      batch(() => {
+        buildRows();
+      });
+    });
+    rows = next;
+    return nodes;
+    function buildRows() {
       for (let i = 0; i < items.length; i++) {
         const item = items[i];
-        const key2 = untrack2(() => keyOf(item, i));
+        const key2 = keyOf(item, i);
         if (next.has(key2)) {
           devWarn(
             `Duplicate list key ${String(key2)}. Keys must be unique, or rows will be dropped.`
@@ -491,12 +261,12 @@ function list(each, keyOf, render) {
           nodes.push(row.nodes[n]);
         }
       }
-      for (const row of rows.values()) {
-        disposeOwner2(row.owner);
-      }
-    });
-    rows = next;
-    return nodes;
+      discard(() => {
+        for (const row of rows.values()) {
+          disposeOwner2(row.owner);
+        }
+      });
+    }
   };
 }
 function createRow(host, item, index, render) {
@@ -587,7 +357,15 @@ function dispatch(event) {
 }
 function on(node, type, handler, options) {
   if (options !== void 0 || !DELEGATED.has(type)) {
-    node.addEventListener(type, handler, options === true ? void 0 : options);
+    const host = node;
+    const resolved = options === true ? void 0 : options;
+    const slot = `${key(type)}$${resolved === void 0 ? "" : Object.keys(resolved).sort().join(",")}`;
+    const previous = host[slot];
+    if (previous !== void 0) {
+      node.removeEventListener(type, previous.handler, previous.options);
+    }
+    host[slot] = { handler, options: resolved };
+    node.addEventListener(type, handler, resolved);
     return;
   }
   node[key(type)] = handler;
@@ -694,7 +472,9 @@ function hyphenate(name) {
 // packages/dom/src/props.ts
 function applyProp(node, name, value) {
   if (name === "class" || name === "className") {
-    if (value !== null && typeof value === "object") {
+    if (Array.isArray(value)) {
+      setClass(node, value.filter(Boolean).join(" "));
+    } else if (value !== null && typeof value === "object") {
       setClassList(node, value, remember(node, "class", value));
     } else {
       setClass(node, value);
@@ -796,15 +576,12 @@ function remember(node, slot, value) {
 export {
   setComponentAdapter,
   FirsthandComponentError,
-  label,
-  part,
-  insert,
-  applyChild,
-  reconcile,
   COMPONENT,
+  VIEW,
   setElementPrefix,
   component,
   isComponent,
+  view,
   createComponent,
   defineElement,
   list,