ilha 0.15.0 → 0.15.2

package/dist/define.js

@@ -1,4 +1,4 @@
-import { t as mount } from "./mount-qJHX_CfF.js";
+import { t as mount } from "./mount-DKY_jSsG.js";
 
 //#region src/define.ts
 const define = (name, component) => {

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import { C as WatchOnceCleanup, S as WatchContext, _ as ResourceOptions, b as View, c as EventSourceStatus, d as Instruction, g as ResourceFetcher, h as Resource, i as Component, l as Fragment, n as AtomHandle, o as EventSourceFeed, r as AtomOptions, s as EventSourceOptions, t as AtomEquality, v as UnsafeHtml, w as Yielded, x as WatchCallback } from "./types-DsdtZMhG.js";
 import { t as h } from "./vnode-CpSQZnLM.js";
-import { r as watch } from "./runtime-B-sEGtAa.js";
+import { r as watch } from "./runtime-Baq7MtkE.js";
 import * as Atom from "effect/reactivity/Atom";
 import { Equal } from "effect";
 import * as Effect$1 from "effect/Effect";

package/dist/index.js

@@ -1,6 +1,6 @@
 import { _ as isString, f as errorView, i as Fragment, m as isFunction, t as h } from "./vnode-BHUY61Rm.js";
-import { C as makeFiber, S as getFiber, _ as structuralEqual, b as clearFiberView, d as interpret, f as atom, g as isAtomHandle, h as instr, m as handleOwner, n as unsafe, p as batch, u as runSetup, v as untrack, x as closeFiber, y as wrapHandle } from "./paint-core-Cw1HbMp6.js";
-import { n as renderToString, t as mount } from "./mount-qJHX_CfF.js";
+import { C as getFiber, S as closeFiber, _ as isAtomHandle, b as wrapHandle, d as runSetup, f as interpret, g as instr, h as handleOwner, m as batch, n as unsafe, p as atom, v as structuralEqual, w as makeFiber, x as clearFiberView, y as untrack } from "./paint-core-B7jENZwS.js";
+import { n as renderToString, t as mount } from "./mount-DKY_jSsG.js";
 import * as Atom from "effect/reactivity/Atom";
 import * as Effect from "effect/Effect";
 import * as Stream from "effect/Stream";

package/dist/{mount-qJHX_CfF.js → mount-DKY_jSsG.js}

@@ -1,5 +1,5 @@
 import { _ as isString, c as KEEP, d as defer, g as isObject, m as isFunction, r as isVNode, u as SLOT_ATTR, y as unwrap } from "./vnode-BHUY61Rm.js";
-import { T as makeRuntime, a as morphInner, c as bindEvents, i as insertRendered, l as eventTypeFromProp, o as placeChildren, r as committedElement, s as standInFor, t as createPainter, u as runSetup, w as makeRootFiber, x as closeFiber } from "./paint-core-Cw1HbMp6.js";
+import { E as makeRuntime, S as closeFiber, T as makeRootFiber, a as markControlled, c as standInFor, d as runSetup, i as insertRendered, l as bindEvents, o as morphInner, r as committedElement, s as placeChildren, t as createPainter, u as eventTypeFromProp } from "./paint-core-B7jENZwS.js";
 
 //#region src/paint.ts
 const noopDisconnect = () => {};
@@ -30,13 +30,19 @@ const core$1 = createPainter({
 	reuseNode: (host) => host instanceof Element && host.isConnected ? standInFor(host) : host,
 	setFormControl: (el, key, v) => {
 		const node = el;
+		if (v !== null && v !== void 0) markControlled(el, key);
 		if (key === "value") {
-			if (v === null || v === void 0) {
+			const text = v === null || v === void 0 ? "" : String(v);
+			if (el.localName === "textarea") {
+				node.defaultValue = text;
+				node.value = text;
+			} else if (el.localName === "select") node.value = text;
+			else if (v === null || v === void 0) {
 				el.removeAttribute("value");
 				node.value = "";
 			} else {
-				el.setAttribute("value", String(v));
-				node.value = String(v);
+				el.setAttribute("value", text);
+				node.value = text;
 			}
 		} else if (key === "checked") {
 			node.checked = Boolean(v);
@@ -344,6 +350,26 @@ const bindSsrEvents = (el, props, fiber) => {
 		el.dataset.ilhaOn = existing ? `${existing},${id}` : id;
 	}
 };
+const WHITESPACE_RUN = /\s+/gu;
+/**
+* Mark the first option whose value is `value` selected and clear the rest,
+* as setting a live select's `.value` does. Returns whether one matched.
+*/
+const selectOption = (parent, value, found) => {
+	let matched = found;
+	for (const child of parent.children) {
+		if (child.kind !== "element") continue;
+		if (child.localName === "optgroup") matched = selectOption(child, value, matched);
+		else if (child.localName === "option") {
+			const optionValue = child.getAttribute("value") ?? child.textContent.trim().replaceAll(WHITESPACE_RUN, " ");
+			if (!matched && optionValue === value) {
+				child.setAttribute("selected", "");
+				matched = true;
+			} else child.removeAttribute("selected");
+		}
+	}
+	return matched;
+};
 const core = createPainter({
 	appendRoot: (root, node) => ssrAs(root).append(node),
 	asElement: (el) => ssrAs(el),
@@ -370,8 +396,13 @@ const core = createPainter({
 	},
 	reuseNode: (host) => ssrAs(host),
 	setFormControl: (el, key, v) => {
-		if (key === "value") el.setAttribute("value", String(v ?? ""));
-		else if (v) el.setAttribute(key, "");
+		if (key === "value") {
+			const text = String(v ?? "");
+			if (el.localName === "textarea") el.textContent = text;
+			else if (el.localName === "select") {
+				if (v !== null && v !== void 0) selectOption(el, text, false);
+			} else el.setAttribute("value", text);
+		} else if (v) el.setAttribute(key, "");
 		else el.removeAttribute(key);
 	},
 	setStyle: (el, css) => el.setAttribute("style", css)

package/dist/{paint-core-Cw1HbMp6.js → paint-core-B7jENZwS.js}

@@ -362,8 +362,10 @@ const subscribeRenderDeps = (fiber, deps, run) => {
 	const schedule = () => {
 		if (scheduled) return;
 		scheduled = true;
+		const seen = fiber.renderGen;
 		fiber.runtime.later(() => {
 			scheduled = false;
+			if (fiber.renderGen !== seen) return;
 			run();
 		});
 	};
@@ -507,6 +509,7 @@ const runSetup = (fiber, fn) => {
 		},
 		render: () => {
 			if (fiber.closed) return;
+			fiber.renderGen = (fiber.renderGen ?? 0) + 1;
 			fiber.runtime.begin();
 			beginPrimitiveFrame(fiber);
 			withTrackGetRun(fiber, () => fn(), ({ value: out, deps }) => {
@@ -833,6 +836,20 @@ const collectKeys = (parent) => {
 	}
 	return keys;
 };
+/** Rendered elements that carried a non-null form-control prop, per key.
+* `checked={false}`, `selected={false}` and `<select value>` leave no
+* attribute, so presence alone can't tell a controlled render from an
+* uncontrolled one. */
+const controlledBy = {
+	checked: /* @__PURE__ */ new WeakSet(),
+	selected: /* @__PURE__ */ new WeakSet(),
+	value: /* @__PURE__ */ new WeakSet()
+};
+/** Mark a rendered element controlled for `key`: the morph syncs it either way. */
+const markControlled = (el, key) => {
+	controlledBy[key].add(el);
+};
+const isControlled = (el, key) => controlledBy[key].has(el);
 const morphInput = (fromEl, toEl) => {
 	syncAttributes(fromEl, toEl);
 	const from = fromEl;
@@ -842,7 +859,7 @@ const morphInput = (fromEl, toEl) => {
 		if (toChecked) fromEl.setAttribute("checked", "");
 		else fromEl.removeAttribute("checked");
 	}
-	if (toChecked && from.checked !== to.checked) from.checked = to.checked;
+	if ((toChecked || isControlled(toEl, "checked")) && from.checked !== to.checked) from.checked = to.checked;
 	const toValue = toEl.getAttribute("value");
 	if (toValue !== fromEl.getAttribute("value")) {
 		if (toValue === null) fromEl.removeAttribute("value");
@@ -854,14 +871,32 @@ const morphTextarea = (fromEl, toEl) => {
 	syncAttributes(fromEl, toEl);
 	const from = fromEl;
 	const to = toEl;
-	if (to.textContent !== "" || from.textContent !== to.textContent) {
+	if (isControlled(toEl, "value") || to.textContent !== "" || from.textContent !== to.textContent) {
 		if (from.value !== to.value) from.value = to.value;
 		if (from.textContent !== to.textContent) from.textContent = to.textContent;
 	}
 };
+const isControlledSelect = (select) => {
+	if (isControlled(select, "value")) return true;
+	for (const o of select.options) if (isControlled(o, "selected")) return true;
+	return false;
+};
 const morphSelect = (fromEl, toEl, api) => {
-	const before = /* @__PURE__ */ new Map();
 	const fromSelect = fromEl;
+	const toSelect = toEl;
+	if (isControlledSelect(toSelect)) {
+		syncAttributes(fromEl, toEl);
+		api.morphChildren(fromEl, toEl);
+		const want = toSelect.options;
+		let i = 0;
+		for (const o of fromSelect.options) {
+			const selected = want[i]?.selected ?? false;
+			if (o.selected !== selected) o.selected = selected;
+			i += 1;
+		}
+		return;
+	}
+	const before = /* @__PURE__ */ new Map();
 	for (const o of fromSelect.options) before.set(o, {
 		attr: o.hasAttribute("selected"),
 		live: o.selected
@@ -1133,36 +1168,26 @@ const elementNs = (lower, parentNs) => {
 	if (parentNs === "http://www.w3.org/2000/svg" || parentNs === "http://www.w3.org/1998/Math/MathML") return parentNs;
 };
 const canMorphRoot = (root) => typeof Element !== "undefined" && typeof document !== "undefined" && root instanceof Element && root.childNodes.length > 0;
+/** Close a child hole through the parent's hole list, so it disposes once. */
+const releaseHole = (fiber, hole) => {
+	const idx = fiber.holes.findIndex((h) => h.holeFiber === hole);
+	if (idx === -1) closeFiber(hole);
+	else {
+		const [removed] = fiber.holes.splice(idx, 1);
+		removed?.dispose();
+	}
+};
 const sweepComponentSlots = (fiber) => {
 	const cframe = fiber.componentFrame;
 	if (!cframe) return;
 	const { slots } = cframe;
 	for (let j = cframe.i; j < slots.length; j += 1) {
 		const s = slots[j];
-		if (s) {
-			const { hole } = s;
-			if (!hole.closed) {
-				const idx = fiber.holes.findIndex((h) => h.holeFiber === hole);
-				if (idx === -1) closeFiber(hole);
-				else {
-					const [removed] = fiber.holes.splice(idx, 1);
-					removed?.dispose();
-				}
-			}
-		}
+		if (s && !s.hole.closed) releaseHole(fiber, s.hole);
 		slots[j] = void 0;
 	}
 	slots.length = cframe.i;
 };
-/** Close a child hole through the parent's hole list, so it disposes once. */
-const releaseHole = (fiber, hole) => {
-	const idx = fiber.holes.findIndex((h) => h.holeFiber === hole);
-	if (idx === -1) closeFiber(hole);
-	else {
-		const [removed] = fiber.holes.splice(idx, 1);
-		removed?.dispose();
-	}
-};
 /** Close the keyed components the paint that just ran did not reach. */
 const sweepKeyedHoles = (fiber) => {
 	const { keyedHoles, keyedGen } = fiber;
@@ -1183,6 +1208,61 @@ const pass = (fiber, fn) => {
 	fn();
 	sweepKeyedHoles(fiber);
 };
+/**
+* Dispose a hole fiber's child holes before it repaints, except the component
+* and island holes the repaint can reuse: positional children, keyed
+* children, and islands. Reuse pushes new props instead of remounting, and the
+* sweeps that end the paint close whatever it did not reach.
+*/
+const keepReusableHoles = (fiber, cframe, frame) => {
+	const kept = /* @__PURE__ */ new Set();
+	for (const s of cframe.slots) if (s && !s.hole.closed) kept.add(s.hole);
+	for (const hole of fiber.keyedHoles?.values() ?? []) if (!hole.closed) kept.add(hole);
+	const keptIslands = new Set(frame.slots);
+	const keep = [];
+	for (const h of fiber.holes) {
+		if (h.holeFiber && kept.has(h.holeFiber) || h.islandSlot && keptIslands.has(h.islandSlot)) {
+			keep.push(h);
+			continue;
+		}
+		h.dispose();
+	}
+	fiber.holes = keep;
+};
+/** Shallow equality of two prop bags, children compared item by item. */
+const sameProps = (prev, next) => {
+	if (!prev) return false;
+	const keys = Object.keys(next);
+	if (keys.length !== Object.keys(prev).length) return false;
+	return keys.every((k) => {
+		const a = prev[k];
+		const b = next[k];
+		if (k === "children" && Array.isArray(a) && Array.isArray(b)) return a.length === b.length && a.every((x, i) => Object.is(x, b[i]));
+		return Object.is(a, b);
+	});
+};
+/**
+* Rerun a reused component hole with new props, in its own fiber. The props
+* box is updated in place, so every render closure of the hole reads the
+* latest props, including a self-render queued while an async render ran.
+*/
+const rerunHole = (hole, run, props) => {
+	const box = hole.propsBox ?? { current: props };
+	box.current = props;
+	hole.propsBox = box;
+	runSetup(hole, () => run(box.current));
+};
+/**
+* Run a new component hole's first render after the paint that opened it. A
+* repaint that reached the hole first already rendered it with newer props.
+*/
+const mountHoleLater = (fiber, hole, run) => {
+	fiber.runtime.later(() => {
+		const box = hole.propsBox;
+		if (hole.closed || hole.renderGen !== void 0 || !box) return;
+		runSetup(hole, () => run(box.current));
+	});
+};
 const warnedKeys = /* @__PURE__ */ new Set();
 const warnDuplicateKey = (key) => {
 	if (warnedKeys.has(key)) return;
@@ -1221,10 +1301,6 @@ const styleCss = (v) => {
 	if (isString(v) || isObject(v)) return serializeStyleAttr(v);
 	return "";
 };
-const isThenable = (value) => {
-	if (!isObject(value) && !isFunction(value)) return false;
-	return isFunction(value.then);
-};
 const writeAttr = (el, k, v) => {
 	if (v === false || v === null || v === void 0) {
 		el.removeAttribute(k);
@@ -1369,18 +1445,7 @@ const createPainter = (ops) => {
 						sweepIslandSlots(fiber);
 						return;
 					}
-					const kept = /* @__PURE__ */ new Set();
-					for (const s of cframe.slots) if (s && !s.hole.closed) kept.add(s.hole);
-					const keptIslands = new Set(frame.slots);
-					const keep = [];
-					for (const h of fiber.holes) {
-						if (h.holeFiber && kept.has(h.holeFiber) || h.islandSlot && keptIslands.has(h.islandSlot)) {
-							keep.push(h);
-							continue;
-						}
-						h.dispose();
-					}
-					fiber.holes = keep;
+					keepReusableHoles(fiber, cframe, frame);
 					const fresh = api.materialize(view, fiber);
 					if (canMorphRoot(fiber.root)) {
 						const tmp = document.createElement("div");
@@ -1494,18 +1559,10 @@ const createPainter = (ops) => {
 		if (existing) {
 			const { hole } = existing;
 			if (existing.type === type && !hole.closed) {
-				hole.propsBox = { current: props };
-				runSetup(hole, () => run(props));
+				rerunHole(hole, run, props);
 				return [ops.reuseNode(hole.root)];
 			}
-			if (!hole.closed) {
-				const idx = fiber.holes.findIndex((h) => h.holeFiber === hole);
-				if (idx === -1) closeFiber(hole);
-				else {
-					const [removed] = fiber.holes.splice(idx, 1);
-					removed?.dispose();
-				}
-			}
+			if (!hole.closed) releaseHole(fiber, hole);
 		}
 		const { fiber: hole, nodes } = api.openHole(fiber);
 		hole.propsBox = { current: props };
@@ -1514,58 +1571,61 @@ const createPainter = (ops) => {
 			hole,
 			type
 		};
-		fiber.runtime.later(() => {
-			if (hole.closed) return;
-			const box = hole.propsBox;
-			if (!box) return;
-			runSetup(hole, () => run(box.current));
-		});
+		mountHoleLater(fiber, hole, run);
 		trackHole(fiber, hole, void 0, { keyed: true });
 		return nodes;
 	};
-	const materializeComponent = (view, type, fiber) => {
-		const props = {
-			...view.props,
-			children: view.children
-		};
-		const branded = type;
-		if (branded[ISLAND] === true) return materializeIsland(branded, props, fiber);
-		const k = view.key === null || view.key === void 0 ? void 0 : String(view.key);
-		const reuse = k ? fiber.keyedHoles?.get(k) : void 0;
-		const run = type;
+	const materializeKeyedComponent = ({ run, type, props, key, fiber }) => {
+		let reuse = fiber.keyedHoles?.get(key);
 		const gen = fiber.keyedGen;
-		if (k && reuse && !reuse.closed && reuse.keyedSeen === gen) {
-			warnDuplicateKey(k);
+		if (reuse && !reuse.closed && reuse.keyedSeen === gen) {
+			warnDuplicateKey(key);
 			return materializeUnkeyedComponent(run, type, props, fiber);
 		}
+		if (reuse && !reuse.closed && reuse.componentType !== type) {
+			fiber.keyedHoles?.delete(key);
+			releaseHole(fiber, reuse);
+			reuse = void 0;
+		}
 		if (reuse && !reuse.closed) {
 			reuse.keyedSeen = gen;
-			if (reuse.propsBox) reuse.propsBox.current = props;
-			const next = withFiber(fiber, () => run(reuse.propsBox?.current ?? props));
-			if (next && !isThenable(next) && !isSetupFn(next)) reuse.paint(next);
+			if (!sameProps(reuse.propsBox?.current, props)) rerunHole(reuse, run, props);
 			return [ops.reuseNode(reuse.root)];
 		}
-		if (!k) return materializeUnkeyedComponent(run, type, props, fiber);
 		const { fiber: khole, nodes: knodes } = api.openHole(fiber);
 		khole.propsBox = { current: props };
+		khole.componentType = type;
 		khole.keyedSeen = gen;
-		fiber.keyedHoles?.set(k, khole);
-		fiber.runtime.later(() => {
-			if (khole.closed) return;
-			const box = khole.propsBox;
-			if (!box) return;
-			runSetup(khole, () => run(box.current));
-		});
+		fiber.keyedHoles?.set(key, khole);
+		mountHoleLater(fiber, khole, run);
 		trackHole(fiber, khole, void 0, { keyed: true });
 		return knodes;
 	};
+	const materializeComponent = (view, type, fiber) => {
+		const props = {
+			...view.props,
+			children: view.children
+		};
+		const branded = type;
+		if (branded[ISLAND] === true) return materializeIsland(branded, props, fiber);
+		const run = type;
+		if (view.key === null || view.key === void 0) return materializeUnkeyedComponent(run, type, props, fiber);
+		return materializeKeyedComponent({
+			fiber,
+			key: String(view.key),
+			props,
+			run,
+			type
+		});
+	};
 	const materializeElement = (view, fiber) => {
 		const tag = view.type;
 		const lower = tag.toLowerCase();
 		const ns = elementNs(lower, parentNsOf(fiber.root));
 		const el = ops.createElement(tag, ns);
 		if (view.key !== null && view.key !== void 0) el.setAttribute(KEY_ATTR, String(view.key));
-		api.applyProps(el, view.props, fiber);
+		const propsAfterChildren = lower === "select";
+		if (!propsAfterChildren) api.applyProps(el, view.props, fiber);
 		const childFiber = {
 			...fiber,
 			holes: fiber.holes,
@@ -1573,6 +1633,7 @@ const createPainter = (ops) => {
 			root: ops.asRoot(el)
 		};
 		for (const c of view.children) for (const n of api.materialize(c, childFiber)) el.append(n);
+		if (propsAfterChildren) api.applyProps(el, view.props, fiber);
 		return [el];
 	};
 	const materializeVNode = (view, fiber) => {
@@ -1602,8 +1663,14 @@ const createPainter = (ops) => {
 		const nodes = [];
 		for (const v of views) {
 			const reuse = fiber.keyedHoles?.get(String(v.key));
-			if (reuse && !reuse.closed) {
+			const reusable = reuse && !reuse.closed && reuse.keyedSeen !== fiber.keyedGen && reuse.componentType === v.type;
+			if (reuse && reusable) {
 				reuse.keyedSeen = fiber.keyedGen;
+				const props = {
+					...v.props,
+					children: v.children
+				};
+				if (!sameProps(reuse.propsBox?.current, props)) rerunHole(reuse, v.type, props);
 				nodes.push(ops.asNode(reuse.root));
 				continue;
 			}
@@ -1623,4 +1690,4 @@ const createPainter = (ops) => {
 };
 
 //#endregion
-export { makeFiber as C, getFiber as S, makeRuntime as T, structuralEqual as _, morphInner as a, clearFiberView as b, bindEvents as c, interpret as d, atom as f, isAtomHandle as g, instr as h, insertRendered as i, eventTypeFromProp as l, handleOwner as m, unsafe as n, placeChildren as o, batch as p, committedElement as r, standInFor as s, createPainter as t, runSetup as u, untrack as v, makeRootFiber as w, closeFiber as x, wrapHandle as y };
+export { getFiber as C, makeRuntime as E, closeFiber as S, makeRootFiber as T, isAtomHandle as _, markControlled as a, wrapHandle as b, standInFor as c, runSetup as d, interpret as f, instr as g, handleOwner as h, insertRendered as i, bindEvents as l, batch as m, unsafe as n, morphInner as o, atom as p, committedElement as r, placeChildren as s, createPainter as t, eventTypeFromProp as u, structuralEqual as v, makeFiber as w, clearFiberView as x, untrack as y };

package/dist/renderer.d.ts

@@ -1,5 +1,5 @@
 import { b as View, i as Component, m as PropValue, p as PropBag, u as IlhaRuntime } from "./types-DsdtZMhG.js";
-import { n as getFiber, t as FiberLocal } from "./runtime-B-sEGtAa.js";
+import { n as getFiber, t as FiberLocal } from "./runtime-Baq7MtkE.js";
 //#region src/shared.d.ts
 declare const KEEP: unique symbol;
 //#endregion

package/dist/renderer.js

@@ -1,5 +1,5 @@
 import { d as defer } from "./vnode-BHUY61Rm.js";
-import { S as getFiber, T as makeRuntime, c as bindEvents, t as createPainter, u as runSetup, w as makeRootFiber, x as closeFiber } from "./paint-core-Cw1HbMp6.js";
+import { C as getFiber, E as makeRuntime, S as closeFiber, T as makeRootFiber, d as runSetup, l as bindEvents, t as createPainter } from "./paint-core-B7jENZwS.js";
 
 //#region src/renderer.ts
 /**

package/dist/{runtime-B-sEGtAa.d.ts → runtime-Baq7MtkE.d.ts}

@@ -78,6 +78,8 @@ interface FiberLocal {
   componentFrame?: ComponentFrame;
   componentType?: unknown;
   renderSub?: () => void;
+  /** Counts the renders this fiber started; see `subscribeRenderDeps`. */
+  renderGen?: number;
   trackRestore?: () => void;
   propsBox?: {
     current: PropBag;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ilha",
-  "version": "0.15.0",
+  "version": "0.15.2",
   "description": "Generator-first island UI on Effect",
   "keywords": [
     "effect",