ilha 0.10.2 → 0.11.0

package/dist/{index-Bi_I3qEL.d.ts → index-Cx35Xugv.d.ts}

@@ -242,6 +242,8 @@ type OnMountContext<TInput, TStateMap extends Record<string, unknown>, TDerivedM
   input: TInput;
   host: Element;
   hydrated: boolean;
+  /** AbortSignal that aborts when the island unmounts. */
+  signal: AbortSignal;
 };
 type HandlerContext<TInput, TStateMap extends Record<string, unknown>, TDerivedMap extends Record<string, unknown> = Record<never, never>, TActionMap extends ActionMap = Record<never, never>> = {
   state: IslandState<TStateMap>;
@@ -283,6 +285,20 @@ interface StateEntry<TInput> {
   key: string;
   init: StateInit<TInput, unknown>;
 }
+/** A state key fed by a generator (`.stream()`). The runtime iterates the
+ * generator and writes each yielded value into the state signal. During SSR
+ * only the first value is pulled so it can render inline; on the client the
+ * generator is consumed continuously. */
+interface StreamEntry<TInput> {
+  key: string;
+  fn: StreamFn<TInput>;
+}
+type StreamFnContext<TInput> = {
+  input: TInput;
+  /** Aborts when the island unmounts. Pass through to fetch/SSE layers. */
+  signal: AbortSignal;
+};
+type StreamFn<TInput, V = unknown> = (ctx: StreamFnContext<TInput>) => AsyncGenerator<V> | Generator<V>;
 interface ActionEntry<TInput, TStateMap extends Record<string, unknown>, TDerivedMap extends Record<string, unknown>> {
   key: string;
   fn: (props: unknown, ctx: ActionContext<TInput, TStateMap, TDerivedMap>) => unknown;
@@ -300,7 +316,7 @@ interface EffectEntry<TInput, TStateMap extends Record<string, unknown>, TDerive
 /** Where the error originated. `"on"` covers sync throws and async rejections
  *  from `.on()` handlers; `"effect"` covers sync throws from `.effect()` runs
  *  (async work spawned inside an effect is not awaited by the runtime). */
-type ErrorSource = "on" | "effect" | "mount" | "transition" | "action";
+type ErrorSource = "on" | "effect" | "mount" | "transition" | "action" | "stream";
 /**
  * Register a global error handler invoked when any island reports an error
  * (from .on, .effect, .onMount, or transitions) and has no local .onError()
@@ -339,6 +355,7 @@ interface BuilderConfig<TInput, TStateMap extends Record<string, unknown>, TDeri
   /** Shallow defaults merged before props (POJO `.input({ ... })` only). */
   defaultInput: Record<string, unknown> | null;
   states: StateEntry<TInput>[];
+  streams: StreamEntry<TInput>[];
   deriveds: DerivedEntry<TInput, TStateMap>[];
   actions: ActionEntry<TInput, TStateMap, TDerivedMap>[];
   ons: OnEntry<TInput, TStateMap, TDerivedMap, TActionMap>[];
@@ -358,6 +375,7 @@ declare class IlhaBuilder<TInput extends Record<string, unknown>, TStateMap exte
   input<T extends Record<string, unknown>>(defaults: T): IlhaBuilder<T, Record<never, never>, Record<never, never>, Record<never, never>>;
   as<Tag extends string>(tag: Tag): IlhaBuilder<TInput, TStateMap, TDerivedMap, TActionMap>;
   state<V = undefined, K extends string = string>(key: K, init?: StateInit<TInput, V> | undefined): IlhaBuilder<TInput, MergeState<TStateMap, K, V>, TDerivedMap, TActionMap>;
+  stream<K extends string, V>(key: K, fn: StreamFn<TInput, V>): IlhaBuilder<TInput, MergeState<TStateMap, K, V>, TDerivedMap, TActionMap>;
   derived<K extends string, V>(key: K, fn: DerivedFn<TInput, TStateMap, V>): IlhaBuilder<TInput, TStateMap, TDerivedMap & Record<K, V>, TActionMap>;
   action<K extends string, P = undefined, R = void>(key: K, fn: (props: P, ctx: ActionContext<TInput, TStateMap, TDerivedMap>) => R): IlhaBuilder<TInput, TStateMap, TDerivedMap, TActionMap & Record<K, typeof fn>>;
   on<S extends string>(selectorOrCombined: S, handler: (ctx: S extends `${string}@${infer E}:${string}` ? HandlerContextFor<TInput, TStateMap, E, TDerivedMap, TActionMap> : S extends `${string}@${infer E}` ? HandlerContextFor<TInput, TStateMap, E, TDerivedMap, TActionMap> : HandlerContext<TInput, TStateMap, TDerivedMap, TActionMap>) => void | Promise<void>): IlhaBuilder<TInput, TStateMap, TDerivedMap, TActionMap>;
@@ -406,6 +424,12 @@ declare function __ilhaJsxSlot({ island, props, key }: {
   props: Record<string, unknown> | undefined;
   key: string | undefined;
 }): RawHtml;
+/**
+ * Morph an element's children toward `html`, patching in place: surviving
+ * elements keep their identity, listeners, and focus (see the morph engine).
+ * Falls back to an innerHTML write when the root tags don't match.
+ */
+declare function morph(host: Element, html: string): void;
 declare const html: typeof ilhaHtml;
 declare const raw: typeof ilhaRaw;
 declare const css: typeof ilhaCss;
@@ -418,4 +442,4 @@ declare const context: typeof ilhaContextFn & {
   clear(): void;
 };
 //#endregion
-export { __ilhaJsxSlot as A, mount as B, NativeEventModifier as C, SignalSetter as D, SignalAccessor as E, html as F, raw as H, ilha as I, ilhaComputed as L, context as M, css as N, SignalWriter as O, from as P, ilhaEffect as R, NativeEventHandler as S, RawHtml as T, untrack as U, onUncaughtError as V, IslandState as _, EffectContext as a, MountResult as b, ExternalSignal as c, HydratableOptions as d, ISLAND_MOUNT_HANDLES as f, IslandDerived as g, IslandActions as h, DerivedValue as i, batch as j, __ilhaJsxEvent as k, HandlerContext as l, Island as m, ActionContext as n, ErrorContext as o, ISLAND_MOUNT_INTERNAL as p, DerivedAccessor as r, ErrorSource as s, ActionAccessor as t, HandlerContextFor as u, KeyedIsland as v, OnMountContext as w, NativeEventContext as x, MountOptions as y, ilhaSignal as z };
+export { StreamFnContext as A, ilhaEffect as B, NativeEventModifier as C, SignalSetter as D, SignalAccessor as E, css as F, raw as G, morph as H, from as I, untrack as K, html as L, __ilhaJsxSlot as M, batch as N, SignalWriter as O, context as P, ilha as R, NativeEventHandler as S, RawHtml as T, mount as U, ilhaSignal as V, onUncaughtError as W, IslandState as _, EffectContext as a, MountResult as b, ExternalSignal as c, HydratableOptions as d, ISLAND_MOUNT_HANDLES as f, IslandDerived as g, IslandActions as h, DerivedValue as i, __ilhaJsxEvent as j, StreamFn as k, HandlerContext as l, Island as m, ActionContext as n, ErrorContext as o, ISLAND_MOUNT_INTERNAL as p, DerivedAccessor as r, ErrorSource as s, ActionAccessor as t, HandlerContextFor as u, KeyedIsland as v, OnMountContext as w, NativeEventContext as x, MountOptions as y, ilhaComputed as z };

package/dist/index.d.ts

@@ -1,2 +1,2 @@
-import { A as __ilhaJsxSlot, B as mount, C as NativeEventModifier, D as SignalSetter, E as SignalAccessor, F as html, H as raw, I as ilha, L as ilhaComputed, M as context, N as css, O as SignalWriter, P as from, R as ilhaEffect, S as NativeEventHandler, T as RawHtml, U as untrack, V as onUncaughtError, _ as IslandState, a as EffectContext, b as MountResult, c as ExternalSignal, d as HydratableOptions, f as ISLAND_MOUNT_HANDLES, g as IslandDerived, h as IslandActions, i as DerivedValue, j as batch, k as __ilhaJsxEvent, l as HandlerContext, m as Island, n as ActionContext, o as ErrorContext, p as ISLAND_MOUNT_INTERNAL, r as DerivedAccessor, s as ErrorSource, t as ActionAccessor, u as HandlerContextFor, v as KeyedIsland, w as OnMountContext, x as NativeEventContext, y as MountOptions, z as ilhaSignal } from "./index-Bi_I3qEL.js";
-export { ActionAccessor, ActionContext, DerivedAccessor, DerivedValue, EffectContext, ErrorContext, ErrorSource, ExternalSignal, HandlerContext, HandlerContextFor, HydratableOptions, ISLAND_MOUNT_HANDLES, ISLAND_MOUNT_INTERNAL, Island, IslandActions, IslandDerived, IslandState, KeyedIsland, MountOptions, MountResult, NativeEventContext, NativeEventHandler, NativeEventModifier, OnMountContext, RawHtml, SignalAccessor, SignalSetter, SignalWriter, __ilhaJsxEvent, __ilhaJsxSlot, batch, ilhaComputed as computed, context, css, ilha as default, ilhaEffect as effect, from, html, ilhaSignal, ilhaSignal as signal, mount, onUncaughtError, raw, untrack };
+import { A as StreamFnContext, B as ilhaEffect, C as NativeEventModifier, D as SignalSetter, E as SignalAccessor, F as css, G as raw, H as morph, I as from, K as untrack, L as html, M as __ilhaJsxSlot, N as batch, O as SignalWriter, P as context, R as ilha, S as NativeEventHandler, T as RawHtml, U as mount, V as ilhaSignal, W as onUncaughtError, _ as IslandState, a as EffectContext, b as MountResult, c as ExternalSignal, d as HydratableOptions, f as ISLAND_MOUNT_HANDLES, g as IslandDerived, h as IslandActions, i as DerivedValue, j as __ilhaJsxEvent, k as StreamFn, l as HandlerContext, m as Island, n as ActionContext, o as ErrorContext, p as ISLAND_MOUNT_INTERNAL, r as DerivedAccessor, s as ErrorSource, t as ActionAccessor, u as HandlerContextFor, v as KeyedIsland, w as OnMountContext, x as NativeEventContext, y as MountOptions, z as ilhaComputed } from "./index-Cx35Xugv.js";
+export { ActionAccessor, ActionContext, DerivedAccessor, DerivedValue, EffectContext, ErrorContext, ErrorSource, ExternalSignal, HandlerContext, HandlerContextFor, HydratableOptions, ISLAND_MOUNT_HANDLES, ISLAND_MOUNT_INTERNAL, Island, IslandActions, IslandDerived, IslandState, KeyedIsland, MountOptions, MountResult, NativeEventContext, NativeEventHandler, NativeEventModifier, OnMountContext, RawHtml, SignalAccessor, SignalSetter, SignalWriter, StreamFn, StreamFnContext, __ilhaJsxEvent, __ilhaJsxSlot, batch, ilhaComputed as computed, context, css, ilha as default, ilhaEffect as effect, from, html, ilhaSignal, ilhaSignal as signal, morph, mount, onUncaughtError, raw, untrack };

package/dist/index.js

@@ -127,13 +127,21 @@ function isStableInlineSlotMount({ initialHtml, renderedHtml, slotIds }) {
 * map (client) and/or the inlined SSR subtree — never depend on the attr for them.
 * RawHtml is tagged so a rare attr-only mount can revive `Symbol.for("ilha.raw")`.
 */
-function slotPropsForAttr(props) {
+function slotPropsForAttr(props, captureActions = false) {
 	if (props === void 0) return void 0;
 	let out;
 	for (const key of Object.keys(props)) {
 		if (key === "children") continue;
 		const value = props[key];
-		if (typeof value === "function" || typeof value === "symbol") continue;
+		if (typeof value === "function") {
+			const action = captureActions ? captureHandlerActions(value) : void 0;
+			if (action) (out ??= {})[key] = {
+				__ilha: "action",
+				...action
+			};
+			continue;
+		}
+		if (typeof value === "symbol") continue;
 		const encoded = encodeSlotPropValue(value);
 		if (encoded === void 0 && value !== void 0 && value !== null) continue;
 		(out ??= {})[key] = encoded;
@@ -465,16 +473,31 @@ const RAW = Symbol.for("ilha.raw");
 const SIGNAL_ACCESSOR = Symbol.for("ilha.signalAccessor");
 const ISLAND = Symbol.for("ilha.island");
 const ISLAND_CALL = Symbol.for("ilha.islandCall");
+const ASTRO_RENDERER_GLOBAL = Symbol.for("ilha.astroRenderer");
 /** @internal Internal hook used by a parent's mountSlots to mount a child island and
 * retain a handle to push updated props into it on subsequent parent
 * re-renders. Not part of the public surface. */
 const ISLAND_MOUNT_INTERNAL = Symbol.for("ilha.islandMountInternal");
 const ISLAND_SLOT_TAG = Symbol.for("ilha.islandSlotTag");
+const ISLAND_CLIENT_REF = Symbol.for("ilha.clientRef");
 /** @internal Live mount handles keyed by host element. Lets @ilha/router adopt
 * islands hydrated by `ilha.mount()` (whose handles it never saw) and push new
 * loader props into them in place instead of remounting. Entries are removed
 * on unmount. Not part of the public surface. */
 const ISLAND_MOUNT_HANDLES = /* @__PURE__ */ new WeakMap();
+/** @internal Sync re-render of an island from a state snapshot. Attached by
+* render(); used by server-frame endpoints to produce HTML for streamed
+* updates without a live mount. Not part of the public surface. */
+const ISLAND_RENDER_STATE = Symbol.for("ilha.renderState");
+/** @internal Async SSR render that records the event→action manifest into the
+* provided map. Used by emitIslandSlot so nested server islands ship their
+* interactive surface alongside their inlined HTML. */
+const ISLAND_SSR_MANIFEST = Symbol.for("ilha.ssrManifest");
+function manifestTemplatePrefix(manifest) {
+	if (manifest.size === 0) return "";
+	const json = escapeHtml(JSON.stringify(Object.fromEntries(manifest)));
+	return `<template ${ACTIONS_ATTR}='${json}'></template>`;
+}
 const SLOT_ATTR = "data-ilha-slot";
 /** Marks a slot host whose child island is mid leave-transition: it has been
 * unmounted (and its slot id stripped) but stays connected so the leave
@@ -482,25 +505,63 @@ const SLOT_ATTR = "data-ilha-slot";
 * or mutating them. */
 const LEAVING_ATTR = "data-ilha-leaving";
 const PROPS_ATTR = "data-ilha-props";
+const CLIENT_REF_ATTR = "data-ilha-client-ref";
 const STATE_ATTR = "data-ilha-state";
 const CSS_ATTR = "data-ilha-css";
+/** Hydration manifest mapping `${type}:${index}` event-sentinel pairs to the
+* action keys that own them. Emitted by hydratable(); lets server-owned
+* islands (whose render fn never ships to the client) reconnect their
+* interactive surface. */
+const ACTIONS_ATTR = "data-ilha-actions";
 function buildScopedStyle(css) {
 	const safeCss = css.replace(/<\/style/gi, "<\\/style");
 	return `<style ${CSS_ATTR}>@scope (:scope) to ([data-ilha]){${safeCss}}</style>`;
 }
+/** Marks SSR action stubs so event registration never capture-invokes them
+* (invoking the real action body during render would run its side effects). */
+const SSR_ACTION_STUB = Symbol.for("ilha.ssrActionStub");
+const captureStack = [];
+/**
+* Invoke a forwarding closure once against sentinel arguments so any
+* `action.x(...)` call inside it is RECORDED, not executed. Returns the first
+* recorded call, or undefined when the closure throws or calls no action.
+*
+* ponytail: the closure body really executes once per manifest render (SSR
+* and every frame) — only the action call is intercepted. Handlers must be
+* pure "call one action" thunks; side effects before/around the action call
+* run server-side on every frame. Upgrade path: static-scan the closure
+* instead of invoking it.
+*/
+function captureHandlerActions(handler) {
+	const frame = [];
+	captureStack.push(frame);
+	try {
+		const result = handler({
+			preventDefault: () => {},
+			stopPropagation: () => {},
+			stopImmediatePropagation: () => {},
+			persist: () => {}
+		}, { signal: new AbortController().signal });
+		Promise.resolve(result).catch(() => {});
+	} catch {} finally {
+		captureStack.pop();
+	}
+	return frame[0];
+}
 const RENDER_CTX_STACK = Symbol.for("ilha.renderCtxStack");
 function renderCtxStack() {
 	const g = globalThis;
 	return g[RENDER_CTX_STACK] ??= [];
 }
-function pushRenderCtx(liveHost, asyncChildren) {
+function pushRenderCtx(liveHost, asyncChildren, manifest) {
 	const ctx = {
 		slots: /* @__PURE__ */ new Map(),
 		positional: 0,
 		liveHost,
 		pending: asyncChildren ? /* @__PURE__ */ new Map() : void 0,
 		binds: [],
-		events: []
+		events: [],
+		manifest
 	};
 	renderCtxStack().push(ctx);
 	return ctx;
@@ -523,15 +584,16 @@ function isIslandCall(v) {
 function emitIslandSlot({ island, props, key }) {
 	const ctx = currentRenderCtx();
 	let id;
-	if (key !== void 0) id = `k:${key}`;
-	else id = ctx ? `p:${ctx.positional++}` : "p:0";
+	if (key === void 0) id = ctx ? `p:${ctx.positional++}` : "p:0";
+	else id = `k:${key}`;
 	if (ctx) ctx.slots.set(id, {
 		island,
 		props
 	});
 	const slotTag = getIslandSlotTag(island);
-	const attrProps = slotPropsForAttr(props);
-	const propsAttr = attrProps ? ` ${PROPS_ATTR}='${escapeHtml(JSON.stringify(attrProps))}'` : "";
+	const clientRef = island[ISLAND_CLIENT_REF];
+	const attrProps = slotPropsForAttr(props, typeof clientRef === "string" && ctx?.manifest === true);
+	const propsAttr = (attrProps ? ` ${PROPS_ATTR}='${escapeHtml(JSON.stringify(attrProps))}'` : "") + (typeof clientRef === "string" ? ` ${CLIENT_REF_ATTR}="${escapeHtml(clientRef)}"` : "");
 	if (ctx?.liveHost) return wrapIslandSlotHtml({
 		tag: slotTag,
 		id,
@@ -541,9 +603,12 @@ function emitIslandSlot({ island, props, key }) {
 	if (ctx?.pending) {
 		popRenderCtx();
 		try {
-			const result = island(props);
+			const manifest = /* @__PURE__ */ new Map();
+			const ssrWithManifest = island[ISLAND_SSR_MANIFEST];
+			const result = ssrWithManifest ? ssrWithManifest(props, manifest) : island(props);
+			const prefix = () => manifestTemplatePrefix(manifest);
 			if (result instanceof Promise) {
-				ctx.pending.set(id, result.then(String));
+				ctx.pending.set(id, result.then(String).then((html) => prefix() + html));
 				return wrapIslandSlotHtml({
 					tag: slotTag,
 					id,
@@ -555,7 +620,7 @@ function emitIslandSlot({ island, props, key }) {
 				tag: slotTag,
 				id,
 				propsAttr,
-				inner: String(result)
+				inner: prefix() + String(result)
 			});
 		} finally {
 			renderCtxStack().push(ctx);
@@ -827,7 +892,8 @@ function ilhaHtml(strings, ...values) {
 		}
 		if (pendingBindSpecs !== "" || pendingEventSpecs !== "") {
 			const { index: gtIdx, quote } = findTagCloseIndex(chunk, pendingQuote);
-			if (gtIdx !== -1) {
+			if (gtIdx === -1) pendingQuote = quote;
+			else {
 				const head = chunk.slice(0, gtIdx).replace(/\s*\/\s*$/, "");
 				const bindAttr = pendingBindSpecs ? ` data-ilha-bind="${pendingBindSpecs}"` : "";
 				const eventAttr = pendingEventSpecs ? ` data-ilha-on="${pendingEventSpecs}"` : "";
@@ -835,7 +901,7 @@ function ilhaHtml(strings, ...values) {
 				pendingBindSpecs = "";
 				pendingEventSpecs = "";
 				pendingQuote = null;
-			} else pendingQuote = quote;
+			}
 		}
 		if (i >= values.length) {
 			result += chunk;
@@ -843,13 +909,16 @@ function ilhaHtml(strings, ...values) {
 		}
 		const value = values[i];
 		const eventMatch = chunk.match(EVENT_PREFIX_RE);
-		if (eventMatch && isEventAttributePosition(result + chunk, result.length + chunk.length - eventMatch[0].length)) {
+		const eventMatchStart = eventMatch ? chunk.length - eventMatch[0].length : -1;
+		const eventAttributeFragment = eventMatch !== null && chunk.slice(0, eventMatchStart).trim() === "";
+		if (eventMatch && (eventAttributeFragment || isEventAttributePosition(result + chunk, result.length + eventMatchStart))) {
 			const eventName = eventMatch[1];
 			const rawModifier = eventMatch[2];
 			const modifier = NATIVE_EVENT_MODIFIERS.has(rawModifier) ? rawModifier : void 0;
 			const openQuote = eventMatch[3] ?? null;
-			const matchStart = chunk.length - eventMatch[0].length;
-			const cleanPrefix = chunk.slice(0, matchStart).replace(/\s+$/, "");
+			const cleanPrefix = chunk.slice(0, eventMatchStart).replace(/\s+$/, "");
+			const isActionStub = typeof value === "function" && SSR_ACTION_STUB in value;
+			const capture = ctx?.manifest && typeof value === "function" && !isActionStub ? captureHandlerActions(value) : void 0;
 			result += cleanPrefix;
 			if (ctx && typeof value === "function") {
 				const index = ctx.events.length;
@@ -857,7 +926,8 @@ function ilhaHtml(strings, ...values) {
 					ctx.events.push({
 						type: eventName,
 						handler: value,
-						modifier
+						modifier,
+						capture
 					});
 					pendingEventSpecs += (pendingEventSpecs ? "," : "") + `${eventName}:${index}`;
 				}
@@ -1153,7 +1223,12 @@ function createDerivedProxy({ entries, state, input, derivedSnapshot }) {
 	for (const entry of entries) {
 		let initialEnvelope;
 		if (derivedSnapshot != null && entry.key in derivedSnapshot) initialEnvelope = { ...derivedSnapshot[entry.key] };
-		else if (!(entry.fn.constructor.name === "AsyncFunction" || entry.fn.constructor.name === "AsyncGeneratorFunction")) {
+		else if (entry.fn.constructor.name === "AsyncFunction" || entry.fn.constructor.name === "AsyncGeneratorFunction") initialEnvelope = {
+			loading: true,
+			value: void 0,
+			error: void 0
+		};
+		else {
 			const ac = new AbortController();
 			const captureSlot = {};
 			const stack = queryCaptureStack();
@@ -1170,19 +1245,18 @@ function createDerivedProxy({ entries, state, input, derivedSnapshot }) {
 					value: void 0,
 					error: void 0
 				};
-				else if (!(result instanceof Promise)) initialEnvelope = {
-					loading: false,
-					value: result,
-					error: void 0
-				};
-				else {
+				else if (result instanceof Promise) {
 					initialEnvelope = {
 						loading: true,
 						value: void 0,
 						error: void 0
 					};
 					result.catch(() => {});
-				}
+				} else initialEnvelope = {
+					loading: false,
+					value: result,
+					error: void 0
+				};
 			} catch (err) {
 				globalThis[ILHA_QUERY_PENDING] = void 0;
 				initialEnvelope = {
@@ -1194,11 +1268,7 @@ function createDerivedProxy({ entries, state, input, derivedSnapshot }) {
 				stack.pop();
 				ac.abort();
 			}
-		} else initialEnvelope = {
-			loading: true,
-			value: void 0,
-			error: void 0
-		};
+		}
 		const env = signal(initialEnvelope);
 		envelopes.set(entry.key, env);
 	}
@@ -1478,7 +1548,7 @@ function applyJsxEvents({ host, records, reportError, unmountSignal, onceFired }
 	}
 	return () => cleanups.forEach((cleanup) => cleanup());
 }
-function applyTemplateBindings(host, binds) {
+function applyTemplateBindings(host, binds, phase = "all") {
 	if (binds.length === 0) return () => {};
 	const cleanups = [];
 	const elements = [];
@@ -1493,14 +1563,16 @@ function applyTemplateBindings(host, binds) {
 			const { event, read, write } = resolveBindOps(el, spec.kind);
 			const accessor = record.accessor;
 			if (spec.kind === "this") {
-				accessor(el);
-				cleanups.push(() => accessor(null));
+				if (phase !== "listen") {
+					accessor(el);
+					cleanups.push(() => accessor(null));
+				}
 				continue;
 			}
-			try {
+			if (phase !== "listen") try {
 				write(el, accessor());
 			} catch (err) {}
-			if (event === null) continue;
+			if (phase === "reflect" || event === null) continue;
 			const listener = () => {
 				const raw = read(el);
 				if (spec.kind === "group") {
@@ -1624,6 +1696,7 @@ var IlhaBuilder = class IlhaBuilder {
 			schema,
 			defaultInput,
 			states: [],
+			streams: [],
 			deriveds: [],
 			actions: [],
 			ons: [],
@@ -1651,6 +1724,21 @@ var IlhaBuilder = class IlhaBuilder {
 			}]
 		});
 	}
+	stream(key, fn) {
+		const cfg = this._cfg;
+		const states = cfg.states.some((entry) => entry.key === key) ? cfg.states : [...cfg.states, {
+			key,
+			init: void 0
+		}];
+		return new IlhaBuilder({
+			...cfg,
+			states,
+			streams: [...cfg.streams.filter((entry) => entry.key !== key), {
+				key,
+				fn
+			}]
+		});
+	}
 	derived(key, fn) {
 		const cfg = this._cfg;
 		return new IlhaBuilder({
@@ -1724,8 +1812,8 @@ var IlhaBuilder = class IlhaBuilder {
 		});
 	}
 	render(fn) {
-		const { schema, defaultInput, states, deriveds, actions, ons, effects, onMounts, onErrors, transition, css: cssSource, as: slotAs } = this._cfg;
-		const stylePrefix = cssSource != null ? buildScopedStyle(cssSource) : "";
+		const { schema, defaultInput, states, streams, deriveds, actions, ons, effects, onMounts, onErrors, transition, css: cssSource, as: slotAs } = this._cfg;
+		const stylePrefix = cssSource == null ? "" : buildScopedStyle(cssSource);
 		const configuredSlotTag = slotAs ?? "div";
 		function resolveInput(props) {
 			const merged = {
@@ -1735,8 +1823,8 @@ var IlhaBuilder = class IlhaBuilder {
 			if (!schema) return merged;
 			return validateSchema(schema, merged);
 		}
-		function renderWithCtx({ render, liveHost, asyncChildren }) {
-			const ctx = pushRenderCtx(liveHost, asyncChildren);
+		function renderWithCtx({ render, liveHost, asyncChildren, manifest }) {
+			const ctx = pushRenderCtx(liveHost, asyncChildren, manifest);
 			try {
 				const html = unwrapHtml(render());
 				const slots = ctx.slots;
@@ -1789,8 +1877,19 @@ var IlhaBuilder = class IlhaBuilder {
 		}
 		function buildSsrActions() {
 			const out = {};
+			const lookup = /* @__PURE__ */ new Map();
 			for (const entry of actions) {
-				const invoke = () => {};
+				const invoke = (...callArgs) => {
+					const frame = captureStack[captureStack.length - 1];
+					if (frame) {
+						if (!frame.some((r) => r.k === entry.key)) frame.push({
+							k: entry.key,
+							a: callArgs
+						});
+						return;
+					}
+				};
+				invoke[SSR_ACTION_STUB] = true;
 				Object.defineProperties(invoke, {
 					pending: {
 						get: () => false,
@@ -1806,8 +1905,12 @@ var IlhaBuilder = class IlhaBuilder {
 					}
 				});
 				out[entry.key] = invoke;
+				lookup.set(invoke, entry.key);
 			}
-			return out;
+			return {
+				action: out,
+				lookup
+			};
 		}
 		/** Detached host for SSR setup hooks; must not be `{}` (Areia/components call host.matches). */
 		function createSsrOnMountHost() {
@@ -1828,6 +1931,7 @@ var IlhaBuilder = class IlhaBuilder {
 			if (onMounts.length === 0) return;
 			if (currentRenderCtx()) return;
 			const host = createSsrOnMountHost();
+			const controller = new AbortController();
 			const ssrCleanups = [];
 			for (const entry of onMounts) {
 				const prevSub = setActiveSub(void 0);
@@ -1839,7 +1943,8 @@ var IlhaBuilder = class IlhaBuilder {
 						action,
 						input,
 						host,
-						hydrated: false
+						hydrated: false,
+						signal: controller.signal
 					});
 				} catch (err) {
 					const error = err instanceof Error ? err : new Error(String(err));
@@ -1863,6 +1968,7 @@ var IlhaBuilder = class IlhaBuilder {
 				}
 				if (typeof userCleanup === "function") ssrCleanups.push(userCleanup);
 			}
+			controller.abort();
 			for (const teardown of ssrCleanups.reverse()) try {
 				teardown();
 			} catch (err) {
@@ -1872,11 +1978,45 @@ var IlhaBuilder = class IlhaBuilder {
 				}
 			}
 		}
-		function renderToString(props, sync = false) {
+		function renderToString(props, sync = false, streamOut, eventsOut, stateOverride, forceAsyncChildren = false) {
 			const input = resolveInput(props);
-			const state = buildSignalState(input);
-			const action = buildSsrActions();
-			const results = deriveds.map((entry) => {
+			const state = buildSignalState(input, stateOverride);
+			const { action, lookup: actionLookup } = buildSsrActions();
+			const recordEventsManifest = (events) => {
+				if (!eventsOut || events.length === 0) return;
+				events.forEach((record, index) => {
+					if (record.capture) {
+						eventsOut.set(`${record.type}:${index}`, record.capture);
+						return;
+					}
+					const key = actionLookup.get(record.handler);
+					if (key) eventsOut.set(`${record.type}:${index}`, key);
+				});
+			};
+			const pullStreamInitials = async (streamOut) => {
+				for (const entry of streams) {
+					const controller = new AbortController();
+					try {
+						const gen = await entry.fn({
+							input,
+							signal: controller.signal
+						});
+						const first = await gen.next();
+						controller.abort();
+						await gen.return?.(void 0);
+						if (first.done) continue;
+						if (streamOut) streamOut[entry.key] = first.value;
+						const prevSub = setActiveSub(void 0);
+						try {
+							const setter = state[entry.key];
+							setter?.(first.value);
+						} finally {
+							setActiveSub(prevSub);
+						}
+					} catch {}
+				}
+			};
+			const computeDerivedResults = () => deriveds.map((entry) => {
 				const prevSub = setActiveSub(void 0);
 				try {
 					return {
@@ -1896,84 +2036,95 @@ var IlhaBuilder = class IlhaBuilder {
 					setActiveSub(prevSub);
 				}
 			});
-			if (!results.some((r) => r.result instanceof Promise) || sync) {
-				const envelopes = {};
-				for (const r of results) if (r.result instanceof Promise) envelopes[r.key] = {
-					loading: true,
-					value: void 0,
-					error: void 0
-				};
-				else envelopes[r.key] = {
-					loading: false,
-					value: r.result,
-					error: void 0
-				};
-				const derived = buildDerivedAccessors(envelopes);
-				if (!currentRenderCtx()) runOnMountForRender({
-					input,
-					state,
-					derived,
-					action
-				});
-				const prevSub = setActiveSub(void 0);
-				try {
-					const { html } = renderWithCtx({ render: () => fn({
-						state,
-						derived,
-						action,
-						input
-					}) });
-					return stylePrefix + html;
-				} finally {
-					setActiveSub(prevSub);
-				}
-			}
-			return Promise.all(results.map(async (r) => {
-				try {
-					return {
-						key: r.key,
-						envelope: {
-							loading: false,
-							value: await Promise.resolve(r.result),
-							error: void 0
-						}
+			if (!sync && (streams.length > 0 || forceAsyncChildren)) return pullStreamInitials(streamOut).then(() => renderToStringTail());
+			return renderToStringTail();
+			function renderToStringTail() {
+				const results = computeDerivedResults();
+				if (!(forceAsyncChildren || results.some((r) => r.result instanceof Promise)) || sync) {
+					const envelopes = {};
+					for (const r of results) if (r.result instanceof Promise) envelopes[r.key] = {
+						loading: true,
+						value: void 0,
+						error: void 0
 					};
-				} catch (err) {
-					return {
-						key: r.key,
-						envelope: {
-							loading: false,
-							value: void 0,
-							error: err instanceof Error ? err : new Error(String(err))
-						}
+					else envelopes[r.key] = {
+						loading: false,
+						value: r.result,
+						error: void 0
 					};
-				}
-			})).then(async (resolved) => {
-				const envelopes = {};
-				for (const r of resolved) envelopes[r.key] = r.envelope;
-				const derived = buildDerivedAccessors(envelopes);
-				if (!currentRenderCtx()) runOnMountForRender({
-					input,
-					state,
-					derived,
-					action
-				});
-				const prevSub = setActiveSub(void 0);
-				try {
-					const { html } = await renderWithCtx({
-						render: () => fn({
-							state,
-							derived,
-							action,
-							input
-						}),
-						asyncChildren: true
+					const derived = buildDerivedAccessors(envelopes);
+					if (!currentRenderCtx()) runOnMountForRender({
+						input,
+						state,
+						derived,
+						action
 					});
-					return stylePrefix + html;
-				} finally {
-					setActiveSub(prevSub);
+					const prevSub = setActiveSub(void 0);
+					try {
+						const { html, events } = renderWithCtx({
+							render: () => fn({
+								state,
+								derived,
+								action,
+								input
+							}),
+							manifest: eventsOut !== void 0
+						});
+						recordEventsManifest(events);
+						return stylePrefix + html;
+					} finally {
+						setActiveSub(prevSub);
+					}
 				}
-			});
+				return Promise.all(results.map(async (r) => {
+					try {
+						return {
+							key: r.key,
+							envelope: {
+								loading: false,
+								value: await Promise.resolve(r.result),
+								error: void 0
+							}
+						};
+					} catch (err) {
+						return {
+							key: r.key,
+							envelope: {
+								loading: false,
+								value: void 0,
+								error: err instanceof Error ? err : new Error(String(err))
+							}
+						};
+					}
+				})).then(async (resolved) => {
+					const envelopes = {};
+					for (const r of resolved) envelopes[r.key] = r.envelope;
+					const derived = buildDerivedAccessors(envelopes);
+					if (!currentRenderCtx()) runOnMountForRender({
+						input,
+						state,
+						derived,
+						action
+					});
+					const prevSub = setActiveSub(void 0);
+					try {
+						const { html, events } = await renderWithCtx({
+							render: () => fn({
+								state,
+								derived,
+								action,
+								input
+							}),
+							asyncChildren: true,
+							manifest: eventsOut !== void 0
+						});
+						recordEventsManifest(events);
+						return stylePrefix + html;
+					} finally {
+						setActiveSub(prevSub);
+					}
+				});
+			}
 		}
 		function mountIsland(host, props) {
 			return mountIslandInternal(host, props).unmount;
@@ -2017,7 +2168,7 @@ var IlhaBuilder = class IlhaBuilder {
 				const parsed = safeParseSnapshot(rawState, STATE_ATTR);
 				if (parsed !== void 0) snapshotRaw = parsed;
 			}
-			const stateSnapshot = snapshotRaw ? Object.fromEntries(Object.entries(snapshotRaw).filter(([k]) => k !== "_derived" && k !== "_skipOnMount")) : void 0;
+			const stateSnapshot = snapshotRaw ? Object.fromEntries(Object.entries(snapshotRaw).filter(([k]) => k !== "_derived" && k !== "_skipOnMount" && k !== "_streams")) : void 0;
 			const derivedSnapshotRaw = snapshotRaw?._derived;
 			let derivedSnapshot;
 			if (derivedSnapshotRaw) {
@@ -2350,7 +2501,8 @@ var IlhaBuilder = class IlhaBuilder {
 							action,
 							input,
 							host,
-							hydrated
+							hydrated,
+							signal: unmountController.signal
 						});
 					} catch (err) {
 						reportError(err, "mount");
@@ -2382,7 +2534,8 @@ var IlhaBuilder = class IlhaBuilder {
 				liveHost: preserveSSRDom ? host : void 0
 			});
 			if (!preserveSSRDom) host.innerHTML = stylePrefix + initial.html;
-			let stopBindings = applyTemplateBindings(host, initial.binds);
+			const stopInitialBindingReflection = applyTemplateBindings(host, initial.binds, "reflect");
+			let stopBindings = stopInitialBindingReflection;
 			cleanups.push(() => stopBindings());
 			let stopJsxEvents = applyJsxEvents({
 				host,
@@ -2396,6 +2549,11 @@ var IlhaBuilder = class IlhaBuilder {
 			cleanups.push(() => mountedSlots.forEach((entry) => entry.unmount()));
 			attachListeners();
 			if (!hydrated && onMounts.length > 0) invokeOnMounts();
+			const stopInitialBindingListeners = applyTemplateBindings(host, initial.binds, "listen");
+			stopBindings = () => {
+				stopInitialBindingListeners();
+				stopInitialBindingReflection();
+			};
 			for (const entry of effects) {
 				let userCleanup;
 				let runController = null;
@@ -2439,6 +2597,36 @@ var IlhaBuilder = class IlhaBuilder {
 			}
 			stopDerived = setupDerived();
 			cleanups.push(stopDerived);
+			for (const entry of streams) {
+				let streamAborted = false;
+				const streamController = new AbortController();
+				const runStream = async () => {
+					try {
+						const gen = await entry.fn({
+							input,
+							signal: streamController.signal
+						});
+						while (!streamAborted && !streamController.signal.aborted) {
+							const { done, value } = await gen.next();
+							if (streamAborted || streamController.signal.aborted || done) break;
+							const prevSub = setActiveSub(void 0);
+							try {
+								const setter = state[entry.key];
+								setter?.(value);
+							} finally {
+								setActiveSub(prevSub);
+							}
+						}
+					} catch (err) {
+						if (!streamAborted && !streamController.signal.aborted && err?.name !== "AbortError") reportError(err, "stream");
+					}
+				};
+				runStream();
+				cleanups.push(() => {
+					streamAborted = true;
+					streamController.abort();
+				});
+			}
 			let initialized = false;
 			const initialRenderedHtml = initial.html;
 			let lastRendered = null;
@@ -2618,6 +2806,12 @@ var IlhaBuilder = class IlhaBuilder {
 		island.mount = (host, props) => mountIsland(host, props);
 		island[ISLAND_MOUNT_INTERNAL] = (host, props) => mountIslandInternal(host, props);
 		island[ISLAND_SLOT_TAG] = configuredSlotTag;
+		island[ISLAND_RENDER_STATE] = async (props) => {
+			const manifest = /* @__PURE__ */ new Map();
+			const html = await renderToString(props ?? void 0, false, void 0, manifest, void 0, true);
+			return manifestTemplatePrefix(manifest) + html;
+		};
+		island[ISLAND_SSR_MANIFEST] = (props, eventsOut) => renderToString(props, false, void 0, eventsOut, void 0, true);
 		island.key = (key) => {
 			if (typeof key !== "string" || key.trim().length === 0) throw new Error("island.key() requires a non-empty string.");
 			if (key.includes(":")) throw new Error(`island.key() key cannot contain the slot separator ":" (got "${key}").`);
@@ -2631,6 +2825,8 @@ var IlhaBuilder = class IlhaBuilder {
 			return keyed;
 		};
 		island[ISLAND] = true;
+		const astroRendererName = globalThis[ASTRO_RENDERER_GLOBAL];
+		if (typeof astroRendererName === "string") island[Symbol.for("astro:renderer")] = astroRendererName;
 		island.define = (tagName, options) => {
 			if (typeof customElements === "undefined" || typeof HTMLElement === "undefined") {
 				`${tagName}`;
@@ -2715,7 +2911,9 @@ var IlhaBuilder = class IlhaBuilder {
 			const { name, as: rawTag = "div", snapshot = false, skipOnMount: explicitSkipOnMount } = opts;
 			const tag = assertValidSlotTagName(rawTag);
 			const resolvedProps = props ?? {};
-			const inner = await renderToString(resolvedProps);
+			const streamValues = {};
+			const eventsManifest = /* @__PURE__ */ new Map();
+			const inner = await renderToString(resolvedProps, false, streamValues, eventsManifest, void 0, true);
 			const encodedProps = escapeHtml(JSON.stringify(resolvedProps));
 			let stateAttr = "";
 			if (snapshot !== false) {
@@ -2725,7 +2923,9 @@ var IlhaBuilder = class IlhaBuilder {
 				const snapshotData = {};
 				const input = resolveInput(resolvedProps);
 				const plainState = buildPlainState(input);
-				if (doState) for (const entry of states) snapshotData[entry.key] = plainState[entry.key]();
+				const stateForDerived = { ...plainState };
+				for (const [k, v] of Object.entries(streamValues)) stateForDerived[k] = () => v;
+				if (doState) for (const entry of states) snapshotData[entry.key] = entry.key in streamValues ? streamValues[entry.key] : plainState[entry.key]();
 				if (doDerived) {
 					const derivedResults = {};
 					for (const entry of deriveds) {
@@ -2735,7 +2935,7 @@ var IlhaBuilder = class IlhaBuilder {
 						let threw = false;
 						try {
 							resultPromise = entry.fn({
-								state: plainState,
+								state: stateForDerived,
 								input,
 								signal: new AbortController().signal
 							});
@@ -2771,9 +2971,12 @@ var IlhaBuilder = class IlhaBuilder {
 					snapshotData["_derived"] = derivedResults;
 				}
 				if (doSkipOnMount) snapshotData["_skipOnMount"] = true;
+				if (streams.length > 0) snapshotData["_streams"] = Object.fromEntries(streams.map((entry) => [entry.key, true]));
 				stateAttr = ` ${STATE_ATTR}='${escapeHtml(JSON.stringify(snapshotData))}'`;
 			}
-			return `<${tag} data-ilha="${escapeHtml(name)}" ${PROPS_ATTR}='${encodedProps}'${stateAttr}>${inner}</${tag}>`;
+			let actionsAttr = "";
+			if (eventsManifest.size > 0) actionsAttr = ` ${ACTIONS_ATTR}='${escapeHtml(JSON.stringify(Object.fromEntries(eventsManifest)))}'`;
+			return `<${tag} data-ilha="${escapeHtml(name)}" ${PROPS_ATTR}='${encodedProps}'${stateAttr}${actionsAttr}>${inner}</${tag}>`;
 		};
 		return island;
 	}
@@ -2835,6 +3038,7 @@ const rootBuilder = new IlhaBuilder({
 	schema: null,
 	defaultInput: null,
 	states: [],
+	streams: [],
 	deriveds: [],
 	actions: [],
 	ons: [],
@@ -2871,11 +3075,14 @@ const ilha = Object.assign(callableRoot, {
 function __ilhaJsxEvent({ type, handler, modifier }) {
 	const ctx = currentRenderCtx();
 	if (!ctx) return void 0;
+	const isActionStub = SSR_ACTION_STUB in handler;
+	const capture = ctx.manifest && !isActionStub ? captureHandlerActions(handler) : void 0;
 	const index = ctx.events.length;
 	ctx.events.push({
 		type,
 		handler,
-		modifier
+		modifier,
+		capture
 	});
 	return index;
 }
@@ -2887,6 +3094,27 @@ function __ilhaJsxSlot({ island, props, key }) {
 		key
 	}));
 }
+/**
+* Morph an element's children toward `html`, patching in place: surviving
+* elements keep their identity, listeners, and focus (see the morph engine).
+* Falls back to an innerHTML write when the root tags don't match.
+*/
+function morph(host, html) {
+	if (typeof document === "undefined") return;
+	const openTag = host.localName ?? "div";
+	const tpl = document.createElement("template");
+	tpl.innerHTML = `<${openTag}>${html}</${openTag}>`;
+	const next = tpl.content.firstElementChild;
+	if (!next || next.localName !== host.localName) {
+		host.innerHTML = html;
+		return;
+	}
+	try {
+		morphInner(host, next);
+	} catch {
+		host.innerHTML = html;
+	}
+}
 const html = ilhaHtml;
 const raw = ilhaRaw;
 const css = ilhaCss;
@@ -2895,4 +3123,4 @@ const from = ilhaFrom;
 const context = ilhaContext;
 
 //#endregion
-export { ISLAND_MOUNT_HANDLES, ISLAND_MOUNT_INTERNAL, __ilhaJsxEvent, __ilhaJsxSlot, batch, ilhaComputed as computed, context, css, ilha as default, ilhaEffect as effect, from, html, ilhaSignal, ilhaSignal as signal, mount, onUncaughtError, raw, untrack };
+export { ISLAND_MOUNT_HANDLES, ISLAND_MOUNT_INTERNAL, __ilhaJsxEvent, __ilhaJsxSlot, batch, ilhaComputed as computed, context, css, ilha as default, ilhaEffect as effect, from, html, ilhaSignal, ilhaSignal as signal, morph, mount, onUncaughtError, raw, untrack };

package/dist/jsx-dev-runtime.d.ts

@@ -1,2 +1,2 @@
-import { a as JSX, r as jsxDEV, t as Fragment } from "./jsx-runtime-DJ2B4fvA.js";
+import { a as JSX, r as jsxDEV, t as Fragment } from "./jsx-runtime-B-viVOB1.js";
 export { Fragment, type JSX, jsxDEV };

package/dist/{jsx-runtime-DJ2B4fvA.d.ts → jsx-runtime-B-viVOB1.d.ts}

@@ -1,4 +1,4 @@
-import { C as NativeEventModifier, E as SignalAccessor, O as SignalWriter, S as NativeEventHandler, T as RawHtml } from "./index-Bi_I3qEL.js";
+import { C as NativeEventModifier, E as SignalAccessor, O as SignalWriter, S as NativeEventHandler, T as RawHtml } from "./index-Cx35Xugv.js";
 //#region src/jsx-types.d.ts
 declare namespace JSX {
   export type Child = unknown;

package/dist/jsx-runtime.d.ts

@@ -1,2 +1,2 @@
-import { a as JSX, i as jsxs, n as jsx, r as jsxDEV, t as Fragment } from "./jsx-runtime-DJ2B4fvA.js";
+import { a as JSX, i as jsxs, n as jsx, r as jsxDEV, t as Fragment } from "./jsx-runtime-B-viVOB1.js";
 export { Fragment, type JSX, jsx, jsxDEV, jsxs };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ilha",
-  "version": "0.10.2",
+  "version": "0.11.0",
   "description": "A tiny, framework-free island architecture library",
   "keywords": [
     "framework-free",
@@ -53,6 +53,7 @@
   },
   "scripts": {
     "build": "tsc && tsdown",
+    "cleanup": "rimraf dist node_modules",
     "test": "bun test"
   },
   "dependencies": {