@expressive/dom 0.2.0 → 0.4.0

package/dist/index.js

@@ -1,240 +1,11 @@
-import { a as untrack, c as release, d as transition, f as unschedule, i as track, l as schedule, n as latest, o as afterFlush, r as same, s as claim$1, u as settle$1 } from "./chunk-hot-gq8TyYJV.js";
-import { a as vnode, i as isVNode, n as childrenOf, r as createPortal, t as PORTAL } from "./chunk-vnode-CzmFSz5_.js";
+import { a as untrack, c as dispose, d as claim$1, f as release, h as transition, i as track, l as enter, m as settle$1, n as latest, o as call, p as schedule, r as same, s as commit, u as afterFlush } from "./chunk-hot-9LhRiwFx.js";
+import { a as createElement, i as childrenOf, n as PORTAL, o as isVNode, r as Portal, s as vnode, t as Fragment } from "./chunk-vnode-wpCWQ_Zg.js";
 import "./jsx-runtime.js";
-import { Component, Context, State, has, map, unbind } from "@expressive/mvc";
+import { Component, Context, Model, has, map, unbind } from "@expressive/mvc";
 import { watch } from "@expressive/mvc/observable";
-import { Fragment } from "@expressive/mvc/runtime";
+import { Fragment as Fragment$1 } from "@expressive/mvc/jsx-runtime";
 
-//#region src/adapter.ts
-let current;
-let collecting;
-function enter(scope, render) {
-	const parent = current;
-	const releases = collecting;
-	const next = [];
-	current = scope;
-	collecting = next;
-	scope.childContext = scope.context;
-	scope.useIndex = 0;
-	try {
-		const output = render();
-		if (scope.kind == "function" && scope.useIndex !== scope.uses.length) {
-			if (!scope.hot) throw new Error("State.use() calls must keep the same order on every function-component render.");
-			truncate(scope, scope.useIndex);
-		}
-		return output;
-	} finally {
-		scope.hot = void 0;
-		current = parent;
-		collecting = releases;
-		scope.subscriptions.forEach((release) => release());
-		scope.subscriptions = next;
-	}
-}
-function dispose(scope) {
-	scope.active = false;
-	unschedule(scope);
-	scope.subscriptions.forEach((release) => release());
-	scope.subscriptions = [];
-	truncate(scope, 0);
-}
-/** Destroy the `State.use()` slots of a scope from `index` on. */
-function truncate(scope, index) {
-	for (let i = scope.uses.length - 1; i >= index; i--) {
-		const slot = scope.uses[i];
-		slot.release();
-		if (typeof slot.cleanup == "function") slot.cleanup();
-		slot.context.pop();
-		slot.instance.set(null);
-	}
-	scope.uses.length = index;
-}
-function commit(scope) {
-	for (const slot of scope.uses) if (!slot.mounted) {
-		slot.mounted = true;
-		slot.cleanup = slot.instance.mount?.();
-	}
-}
-function requireScope() {
-	if (!current) throw new Error("State.get() and State.use() may only run while @expressive/dom is rendering.");
-	return current;
-}
-function tracked(target, required) {
-	const scope = requireScope();
-	let proxy = target;
-	let first = true;
-	const release = watch(target, (next) => {
-		proxy = next;
-		if (!first && scope.active) schedule(scope);
-		first = false;
-	}, required, transition);
-	collecting.push(release);
-	return proxy;
-}
-State.get = function get(argument) {
-	const scope = requireScope();
-	const instance = scope.childContext.get(this, argument === false ? false : true);
-	if (!instance) return void 0;
-	const proxy = tracked(instance, argument === true);
-	if (typeof argument != "function") return proxy;
-	const refresh = ((action) => {
-		if (typeof action == "function") action = action();
-		schedule(scope);
-		return action instanceof Promise ? action.finally(() => schedule(scope)) : void 0;
-	});
-	return argument.call(proxy, proxy, refresh) ?? null;
-};
-State.use = function use(...args) {
-	const scope = requireScope();
-	if (scope.kind != "function") throw new Error("State.use() is only available at the top level of a function component.");
-	const index = scope.useIndex++;
-	let slot = scope.uses[index];
-	if (slot && slot.Type !== this) {
-		if (!scope.hot) throw new Error("State.use() calls must keep the same order on every function-component render.");
-		truncate(scope, index);
-		slot = void 0;
-	}
-	if (!slot) {
-		let instance;
-		const assign = (value) => typeof value == "object" && value && instance.set(value);
-		let apply = (...values) => Promise.all(values.flat().map(assign));
-		instance = new this((self) => {
-			const own = self;
-			if (typeof own.use == "function") {
-				apply = own.use.bind(own);
-				apply(...args);
-				return;
-			}
-			return args;
-		});
-		const context = scope.childContext.push(instance);
-		slot = {
-			Type: this,
-			context,
-			instance,
-			proxy: instance,
-			release: void 0,
-			apply
-		};
-		let first = true;
-		slot.release = watch(instance, (proxy) => {
-			slot.proxy = proxy;
-			if (!first && scope.active) schedule(scope);
-			first = false;
-		}, void 0, transition);
-		slot.apply = apply;
-		scope.uses.push(slot);
-	} else slot.apply(...args);
-	scope.childContext = slot.context;
-	return slot.proxy;
-};
-Object.defineProperty(Component, "use", {
-	configurable: true,
-	value() {
-		throw new Error(`${this} is a Component - render it instead of calling use().`);
-	}
-});
-Component.on({
-	type(type) {
-		subcomponents(type.prototype);
-	},
-	before(self) {
-		subcomponents(self);
-	}
-});
-function subcomponents(target) {
-	for (const key of Object.getOwnPropertyNames(target)) {
-		if (!/^[A-Z]/.test(key)) continue;
-		const { value } = Object.getOwnPropertyDescriptor(target, key);
-		if (typeof value != "function") continue;
-		Object.defineProperty(target, key, {
-			configurable: true,
-			get() {
-				const owner = this.is;
-				let render = unbind(value);
-				const Subcomponent = (props) => render.call(tracked(owner), props);
-				Object.defineProperty(owner, key, {
-					configurable: true,
-					get: () => Subcomponent,
-					set(next) {
-						render = next;
-					}
-				});
-				return Subcomponent;
-			},
-			set(next) {
-				Object.defineProperty(this, key, {
-					value: next,
-					writable: true,
-					enumerable: true,
-					configurable: true
-				});
-				subcomponents(this);
-			}
-		});
-	}
-}
-
-//#endregion
-//#region src/context.ts
-function Consumer(props) {
-	return props.for.get((value) => props.children(value));
-}
-function Provider(_props) {
-	throw new Error("Provider must be rendered by @expressive/dom.");
-}
-function provide(context, props) {
-	const { for: input, is, children: _children, fallback: _fallback, name: _name, ...rest } = props;
-	const mount = [];
-	let single;
-	const solo = State.is(input) || input instanceof State;
-	context.set(input || {}, (state, owned) => {
-		if (solo) single = state;
-		is?.(state);
-		if (owned) {
-			let cleanup;
-			mount.push(() => {
-				cleanup = state.mount?.();
-			});
-			return () => cleanup?.();
-		}
-	});
-	if (solo && !single) {
-		const Type = input instanceof State ? input.constructor : input;
-		single = context.get(Type, false);
-	}
-	if (single && Object.keys(rest).length) single.set(rest);
-	return () => mount.forEach((commit) => commit());
-}
-
-//#endregion
-//#region src/lazy.ts
-function lazy(load) {
-	let pending;
-	let resolved;
-	let rejected;
-	let failed = false;
-	return function Lazy(props) {
-		if (failed) throw rejected;
-		if (resolved) return vnode(resolved, props);
-		if (!pending) pending = load().then((module) => {
-			const output = typeof module == "function" ? module : module?.default;
-			if (typeof output != "function") {
-				failed = true;
-				rejected = /* @__PURE__ */ new Error("lazy() loader resolved no component.");
-				return;
-			}
-			resolved = output;
-		}, (error) => {
-			failed = true;
-			rejected = error;
-		});
-		throw pending;
-	};
-}
-
-//#endregion
-//#region src/css.ts
+//#region src/style/css.ts
 const unitless = /* @__PURE__ */ new Map();
 let probe;
 /**
@@ -287,7 +58,7 @@ const css = {
 };
 
 //#endregion
-//#region src/appearance-protocol.ts
+//#region src/style/protocol.ts
 const registrations = /* @__PURE__ */ new WeakMap();
 const tokens = /* @__PURE__ */ new WeakMap();
 let root;
@@ -334,7 +105,7 @@ function appearanceToken(value) {
 }
 
 //#endregion
-//#region src/appearance.ts
+//#region src/style/appearance.ts
 const bases = /* @__PURE__ */ new WeakMap();
 const chains = /* @__PURE__ */ new WeakMap();
 const contexts = /* @__PURE__ */ new WeakMap();
@@ -561,7 +332,7 @@ function isObject(value) {
 }
 
 //#endregion
-//#region src/declarations.ts
+//#region src/style/declarations.ts
 function applyDeclarations(style, declarations, previous = {}) {
 	const target = style;
 	for (const key of Object.keys({
@@ -580,7 +351,7 @@ function applyDeclarations(style, declarations, previous = {}) {
 }
 
 //#endregion
-//#region src/stylesheet.ts
+//#region src/style/stylesheet.ts
 const sheets = /* @__PURE__ */ new WeakMap();
 function style(type, rules) {
 	style$1(type, rules);
@@ -632,63 +403,48 @@ function serialize(document, declarations) {
 }
 
 //#endregion
-//#region src/render.ts
-const roots = /* @__PURE__ */ new WeakMap();
-const SVG = "http://www.w3.org/2000/svg";
-const dirty = /* @__PURE__ */ new Set();
-const stashes = /* @__PURE__ */ new WeakMap();
-const CONTROLS = ["checked", "value"];
-const ENUMERATED = [
-	"contentEditable",
-	"contenteditable",
-	"draggable",
-	"spellcheck"
-];
-const ALIASES = {
-	autoFocus: "autofocus",
-	contentEditable: "contenteditable",
-	htmlFor: "for"
-};
-const focusing = [];
-const controlled = /* @__PURE__ */ new WeakMap();
-const restoring = /* @__PURE__ */ new WeakSet();
-let passiveRender = false;
-let inserting;
-let depth = 0;
-let settling = false;
-let rendering;
-let touched = false;
-const observed = /* @__PURE__ */ new WeakMap();
-const tickets = /* @__PURE__ */ new WeakMap();
-function render(node, container) {
-	roots.get(container)?.();
-	container.replaceChildren();
-	const context = new Context(Context.root);
-	const fiber = range("fragment", container, null, context);
+//#region src/render/commits.ts
+const DETACHED = /* @__PURE__ */ new WeakMap();
+let batch;
+/** Run `run` once `fiber` is on the page: now, after the current batch, or when its detached root attaches. */
+function inserted(fiber, run) {
+	enqueue([fiber, run]);
+}
+/** A fragment whose commits wait until it attaches. */
+function fragment() {
+	const root = document.createDocumentFragment();
+	DETACHED.set(root, []);
+	return root;
+}
+function attach(root) {
+	const held = DETACHED.get(root);
+	DETACHED.delete(root);
+	held?.forEach(enqueue);
+}
+/** Defer commits made during `work` until it returns or throws. */
+function batched(work) {
+	if (batch) return work();
+	const entries = batch = [];
 	try {
-		pass(() => {
-			const appearanceContext = appearanceRoot();
-			reconcile(fiber, node, context, void 0, appearanceContext ? {
-				context: appearanceContext,
-				entries: []
-			} : void 0);
-		});
-	} catch (error) {
-		unmountFiber(fiber);
-		context.pop();
-		throw error;
+		return work();
+	} finally {
+		batch = void 0;
+		entries.forEach(deliver);
 	}
-	let active = true;
-	const unmount = () => {
-		if (!active) return;
-		active = false;
-		unmountFiber(fiber);
-		context.pop();
-		roots.delete(container);
-	};
-	roots.set(container, unmount);
-	return unmount;
 }
+function enqueue(entry) {
+	if (batch) batch.push(entry);
+	else deliver(entry);
+}
+function deliver(entry) {
+	const [fiber, run] = entry;
+	const held = DETACHED.get(fiber.start.getRootNode());
+	if (held) held.push(entry);
+	else if (!fiber.dead) run();
+}
+
+//#endregion
+//#region src/render/fiber.ts
 function range(kind, parent, before, context) {
 	const start = document.createComment(kind);
 	const end = document.createComment(`/${kind}`);
@@ -714,149 +470,37 @@ function makeScope(kind, context, update) {
 		uses: []
 	};
 }
-function complete(fiber, work) {
-	try {
-		work();
-	} catch (error) {
-		unmountFiber(fiber);
-		throw error;
+function moveRange(start, end, target) {
+	let node = start;
+	while (node) {
+		const next = node.nextSibling;
+		target.appendChild(node);
+		if (node === end) break;
+		node = next;
 	}
-	return fiber;
-}
-function componentProps(type, props, appearance) {
-	const context = appearance?.context;
-	if (!context || typeof type != "function") return {
-		appearance,
-		props
-	};
-	const value = context.resolve(props);
-	const entries = appearance.entries;
-	if (!value) return {
-		appearance: { entries },
-		props
-	};
-	return {
-		appearance: {
-			context: value.context,
-			entries
-		},
-		props: {
-			...props,
-			style: [createAppearanceToken(value), props.style]
-		}
-	};
 }
-function mount(value, parent, before, context, boundary, appearance) {
-	if (typeof value == "string" || typeof value == "number" || typeof value == "bigint") {
-		const text = document.createTextNode(String(value));
-		parent.insertBefore(text, before);
-		return {
-			kind: "text",
-			value,
-			context,
-			start: text,
-			end: text,
-			children: []
-		};
+function move(fiber, parent, before) {
+	if (fiber.start.parentNode === parent && fiber.end.nextSibling === before) return;
+	let node = fiber.start;
+	while (node) {
+		const next = node.nextSibling;
+		parent.insertBefore(node, before);
+		if (node === fiber.end) break;
+		node = next;
 	}
-	if (value instanceof Component) return mountComponent(value, parent, before, context, boundary, appearance);
-	if (isCollection(value)) return mountCollection(value, parent, before, context, boundary, appearance);
-	if (!isVNode(value)) throw new TypeError(`Cannot render ${String(value)}.`);
-	if (value.type === Fragment) return mountFragment(value, parent, before, context, boundary, appearance);
-	if (value.type === PORTAL) return mountPortal(value, parent, before, context, boundary, appearance);
-	if (value.type === Provider) return mountProvider(value, parent, before, context, boundary, appearance);
-	if (typeof value.type == "string") return mountElement(value, parent, before, context, boundary, appearance);
-	if (typeof value.type != "function") throw new Error(`Cannot render ${String(value.type)}.`);
-	if (value.type.prototype instanceof Component) return mountOwnedComponent(value, parent, before, context, boundary, appearance);
-	return mountFunction(value, parent, before, context, boundary, appearance);
-}
-function mountFragment(value, parent, before, context, boundary, appearance) {
-	const fiber = range("fragment", parent, before, context);
-	fiber.key = value.key;
-	fiber.type = Fragment;
-	fiber.appearance = appearance;
-	return complete(fiber, () => {
-		reconcile(fiber, value.props.children, context, boundary, appearance);
-	});
-}
-function mountFunction(value, parent, before, context, boundary, appearance) {
-	const fiber = range("function", parent, before, context);
-	const resolved = componentProps(value.type, value.props, appearance);
-	fiber.key = value.key;
-	fiber.type = value.type;
-	fiber.props = observe(resolved.props);
-	fiber.boundary = boundary;
-	fiber.appearance = resolved.appearance;
-	fiber.scope = makeScope("function", context, (passive) => runFunction(fiber, passive));
-	fiber.render = () => enter(fiber.scope, () => latest(fiber.type)(fiber.props));
-	track(fiber.type, fiber.scope);
-	probing(fiber);
-	return complete(fiber, () => {
-		runFunction(fiber, passiveRender);
-	});
-}
-function mountOwnedComponent(value, parent, before, context, boundary, appearance) {
-	const resolved = componentProps(value.type, value.props, appearance);
-	return mountComponent(new value.type(observe(resolved.props)), parent, before, context, boundary, resolved.appearance, true, value.key);
-}
-function runFunction(fiber, passive) {
-	const result = attempt(fiber, passive, fiber.render);
-	if (result === true) inserted(fiber, () => commit(fiber.scope));
-	else return result;
-}
-function probing(fiber) {
-	const scope = fiber.scope;
-	scope.empty = () => !fiber.children.length;
-	scope.probe = () => {
-		try {
-			scope.probed = { output: consume(fiber, fiber.render) };
-		} catch (thrown) {
-			if (isThenable(thrown)) return thrown;
-		}
-	};
-}
-function mountComponent(instance, parent, before, context, inherited, appearance, owned = false, key) {
-	const fiber = range("component", parent, before, context);
-	const childContext = context.push(instance);
-	const ownBoundary = instance.fallback !== false || instance.catch ? {
-		catch: instance.catch?.bind(instance),
-		fallback: () => instance.fallback,
-		owner: fiber,
-		parent: inherited
-	} : inherited;
-	fiber.boundary = ownBoundary;
-	if (ownBoundary !== inherited) fiber.ownBoundary = ownBoundary;
-	fiber.childContext = childContext;
-	fiber.instance = instance;
-	fiber.key = owned ? key : instance.key;
-	fiber.type = instance.constructor;
-	fiber.props = instance.props;
-	fiber.owned = owned;
-	fiber.appearance = appearance;
-	fiber.scope = makeScope("component", childContext, (passive) => runComponent(fiber, passive));
-	fiber.render = () => enter(fiber.scope, () => instance.render.call(fiber.value, instance.props));
-	probing(fiber);
-	let first = true;
-	let proxy = instance;
-	fiber.release = watch(instance, (current, events) => {
-		const { applied, scope } = fiber;
-		proxy = current;
-		fiber.applied = void 0;
-		if (!first && scope.active) if (applied && events.includes("props")) transition(() => schedule(scope));
-		else schedule(scope);
-		first = false;
-	}, void 0, transition);
-	Object.defineProperty(fiber, "value", { get: () => proxy });
-	complete(fiber, () => {
-		runComponent(fiber, passiveRender);
-	});
-	if (owned) inserted(fiber, () => fiber.cleanup = instance.mount?.());
-	return fiber;
 }
-function runComponent(fiber, passive) {
-	const result = attempt(fiber, passive, fiber.render);
-	if (result !== true) return result;
+function removeRange(start, end) {
+	let node = start;
+	while (true) {
+		const next = node.nextSibling;
+		node.remove();
+		if (node === end) break;
+		node = next;
+	}
 }
+
+//#endregion
+//#region src/render/collection.ts
 function mountCollection(value, parent, before, context, boundary, appearance) {
 	const fiber = range("collection", parent, before, context);
 	fiber.source = value;
@@ -880,128 +524,159 @@ function runCollection(fiber, passive) {
 		return value instanceof map.Managed ? [...value.values()] : [...value];
 	});
 }
-function mountProvider(value, parent, before, context, inherited, appearance) {
-	const fiber = range("provider", parent, before, context);
-	const childContext = new Context(context);
-	fiber.key = value.key;
-	fiber.type = Provider;
-	fiber.props = value.props;
+function patchCollection(fiber, appearance) {
+	if (fiber.appearance === appearance) return;
 	fiber.appearance = appearance;
-	fiber.childContext = childContext;
-	const commit = provide(childContext, value.props);
-	const boundary = value.props.fallback !== void 0 ? {
-		fallback: () => fiber.props.fallback,
-		owner: fiber,
-		parent: inherited
-	} : inherited;
-	fiber.boundary = boundary;
-	if (boundary !== inherited) fiber.ownBoundary = boundary;
-	complete(fiber, () => {
-		reconcile(fiber, value.props.children, childContext, boundary, appearance);
+	runCollection(fiber, passiveRender);
+}
+function isCollection(value) {
+	return value instanceof has.List || value instanceof has.Pool || value instanceof map.Managed;
+}
+
+//#endregion
+//#region src/node/loader.ts
+const LOADS = /* @__PURE__ */ new WeakMap();
+function resolve(type, props, run) {
+	const load = LOADS.get(type);
+	if (load?.resolved) return vnode(load.resolved, props);
+	if (load?.failed) {
+		LOADS.delete(type);
+		throw load.failed.error;
+	}
+	if (load) throw load.pending;
+	const output = run();
+	if (!output || typeof output.then != "function") return output;
+	const next = {};
+	LOADS.set(type, next);
+	throw next.pending = output.then((module) => {
+		const component = typeof module == "function" ? module : module?.default;
+		if (typeof component == "function") next.resolved = component;
+		else next.failed = { error: /* @__PURE__ */ new Error("Loader resolved no component.") };
+	}, (error) => {
+		next.failed = { error };
 	});
-	commit();
-	return fiber;
 }
-function mountPortal(value, parent, before, context, boundary, appearance) {
-	const marker = document.createComment("portal");
-	const container = value.props.container;
-	const portalStart = document.createComment("portal-root");
-	const portalEnd = document.createComment("/portal-root");
-	parent.insertBefore(marker, before);
-	container.append(portalStart, portalEnd);
-	const output = {
-		kind: "portal",
-		key: value.key,
-		type: PORTAL,
-		props: value.props,
-		context,
-		boundary,
+
+//#endregion
+//#region src/style/claim.ts
+const tickets = /* @__PURE__ */ new WeakMap();
+function componentProps(type, props, appearance) {
+	const context = appearance?.context;
+	if (!context || typeof type != "function") return {
 		appearance,
-		start: marker,
-		end: marker,
-		children: [],
-		portalContainer: container,
-		portalStart,
-		portalEnd
+		props
+	};
+	const value = context.resolve(props);
+	const entries = appearance.entries;
+	if (!value) return {
+		appearance: { entries },
+		props
+	};
+	return {
+		appearance: {
+			context: value.context,
+			entries
+		},
+		props: {
+			...props,
+			style: [createAppearanceToken(value), props.style]
+		}
 	};
-	return complete(output, () => {
-		reconcilePortal(output, value.props.children, context, boundary, appearance);
-	});
 }
-function mountElement(value, parent, before, context, boundary, appearance) {
-	const tag = value.type;
-	let host = parent;
-	for (let owner = stashes.get(host); owner; owner = stashes.get(host)) host = owner.end.parentNode;
-	const element = (tag == "svg" || host instanceof SVGElement && host.localName != "foreignObject" ? SVG : void 0) ? document.createElementNS(SVG, tag) : document.createElement(tag);
-	const fiber = {
-		kind: "element",
-		key: value.key,
-		type: tag,
-		props: {},
-		context,
-		boundary,
-		start: element,
-		end: element,
-		children: [],
-		events: /* @__PURE__ */ new Map()
+function door(value) {
+	const collected = {
+		classes: [],
+		declarations: {},
+		tokens: []
 	};
-	parent.insertBefore(element, before);
-	complete(fiber, () => {
-		patchProps(fiber, value.props, appearance);
+	const { classes, declarations, tokens } = collected;
+	collect(value, collected, 1);
+	if (!classes.length && !tokens.length && !Object.keys(declarations).length) return void 0;
+	const key = Object.freeze({});
+	tickets.set(key, {
+		classes,
+		tokens
+	});
+	return Object.freeze({
+		...declarations,
+		[Symbol("style")]: key
 	});
-	if (value.props.autofocus || value.props.autoFocus) focusing.push(element);
-	return fiber;
 }
-function pass(work) {
-	depth++;
-	try {
-		return work();
-	} finally {
-		if (!--depth) {
-			settle();
-			focus();
+function claim(element, appearance, resolved, className, value) {
+	const collected = {
+		classes: [],
+		declarations: {},
+		tokens: []
+	};
+	const entries = appearance?.entries || [];
+	let context = appearance?.context;
+	let reach = -1;
+	if (resolved) collect(createAppearanceToken(resolved), collected, 0);
+	appendClasses(collected.classes, className);
+	collect(value, collected, 0);
+	for (let index = entries.length - 1; index >= 0; index--) collect(entries[index].style, collected, entries[index].hops);
+	for (const { appearance, doors } of collected.tokens) {
+		for (const block of appearance.blocks || []) collected.classes.push(emitClass(block, doors, element.ownerDocument));
+		if (appearance.classes) collected.classes.push(...appearance.classes);
+		if (appearance.context && doors >= reach) {
+			context = appearance.context;
+			reach = doors;
 		}
 	}
+	return {
+		className: [...new Set(collected.classes)].join(" "),
+		context,
+		declarations: collected.declarations
+	};
 }
-function focus() {
-	for (const element of focusing.splice(0)) if (element.isConnected) element.focus();
+function applyClaim(element, before, after) {
+	const previous = before || {
+		className: "",
+		declarations: {}
+	};
+	if (previous.className !== after.className) if (after.className) element.setAttribute("class", after.className);
+	else element.removeAttribute("class");
+	applyDeclarations(element.style, after.declarations, previous.declarations);
 }
-function attempt(fiber, passive, render) {
-	const previous = passiveRender;
-	const scope = fiber.scope;
-	const probed = scope.probed;
-	scope.probed = void 0;
-	passiveRender ||= passive;
-	if (passive && !depth && !fiber.children.length && !fiber.stash) fiber.staging ||= document.createDocumentFragment();
-	const outer = inserting;
-	if (fiber.staging) inserting = fiber.inserted ||= [];
-	try {
-		return pass(() => {
-			try {
-				reconcile(fiber, probed ? probed.output : consume(fiber, render), scope.childContext, fiber.boundary, renderedAppearance(fiber));
-				if (fiber.staging) {
-					const queued = fiber.inserted;
-					fiber.end.parentNode.insertBefore(fiber.staging, fiber.end);
-					fiber.staging = fiber.inserted = void 0;
-					inserting = outer;
-					queued.forEach((run) => run());
-				}
-				if (!fiber.recovering) unwait(fiber);
-				fiber.retried = void 0;
-				return true;
-			} catch (thrown) {
-				return suspend(fiber, thrown, passive);
-			}
+function collect(value, collected, doors) {
+	if (!value) return;
+	const token = appearanceToken(value);
+	if (token) {
+		collected.tokens.push({
+			appearance: token,
+			doors
 		});
-	} finally {
-		passiveRender = previous;
-		inserting = outer;
+		Object.assign(collected.declarations, token.declarations);
+		return;
+	}
+	if (typeof value == "string") {
+		appendClasses(collected.classes, value);
+		return;
 	}
+	if (Array.isArray(value)) {
+		value.forEach((entry) => collect(entry, collected, doors));
+		return;
+	}
+	for (const symbol of Object.getOwnPropertySymbols(value)) {
+		const ticket = tickets.get(value[symbol]);
+		if (!ticket) continue;
+		collected.classes.push(...ticket.classes);
+		for (const carried of ticket.tokens) collected.tokens.push({
+			appearance: carried.appearance,
+			doors: carried.doors + doors
+		});
+	}
+	for (const key of Object.keys(value)) collected.declarations[key] = value[key];
 }
-function inserted(fiber, run) {
-	if (inserting) inserting.push(() => fiber.dead || run());
-	else run();
+function appendClasses(classes, value) {
+	if (typeof value == "string") classes.push(...value.split(/\s+/).filter(Boolean));
 }
+
+//#endregion
+//#region src/render/style.ts
+let rendering;
+let touched = false;
+const observed = /* @__PURE__ */ new WeakMap();
 function observe(props) {
 	if (!("style" in props)) return props;
 	let output = observed.get(props);
@@ -1024,25 +699,6 @@ function observe(props) {
 	}
 	return output;
 }
-function door(value) {
-	const collected = {
-		classes: [],
-		declarations: {},
-		tokens: []
-	};
-	const { classes, declarations, tokens } = collected;
-	collect(value, collected, 1);
-	if (!classes.length && !tokens.length && !Object.keys(declarations).length) return void 0;
-	const key = Object.freeze({});
-	tickets.set(key, {
-		classes,
-		tokens
-	});
-	return Object.freeze({
-		...declarations,
-		[Symbol("style")]: key
-	});
-}
 function consume(fiber, render) {
 	const previous = rendering;
 	const read = touched;
@@ -1057,258 +713,68 @@ function consume(fiber, render) {
 		touched = read;
 	}
 }
-function wait(fiber, boundary) {
-	if (fiber.waitingOn !== boundary) unwait(fiber);
-	fiber.waitingOn = boundary;
-	(boundary.waiting ||= /* @__PURE__ */ new Set()).add(fiber);
-	dirty.add(boundary);
-}
-function unwait(fiber) {
-	const boundary = fiber.waitingOn;
-	if (!boundary) return;
-	fiber.waitingOn = void 0;
-	boundary.waiting.delete(fiber);
-	if (!boundary.owner.dead) dirty.add(boundary);
-}
-function settle() {
-	if (settling) return;
-	settling = true;
-	try {
-		for (const boundary of dirty) {
-			dirty.delete(boundary);
-			const owner = boundary.owner;
-			const waiting = boundary.waiting.size > 0;
-			if (!owner.dead && waiting != !!owner.stash) waiting ? hide(owner, boundary) : reveal(owner);
-		}
-	} finally {
-		settling = false;
-	}
-}
-function hide(owner, boundary) {
-	const stash = document.createDocumentFragment();
-	for (const child of owner.children) move(child, stash, null);
-	owner.portals = portals(owner, []).map((portal) => {
-		const content = document.createDocumentFragment();
-		moveRange(portal.portalStart, portal.portalEnd, content);
-		return [portal, content];
+function renderedAppearance(fiber) {
+	if (fiber.kind != "component" && fiber.kind != "function") return fiber.appearance;
+	const style = fiber.props?.style;
+	const entries = (fiber.appearance?.entries || []).map(({ hops, style }) => ({
+		hops: hops + 1,
+		style
+	}));
+	const inherited = fiber.appearance?.context || appearanceRoot();
+	const context = enterAppearance(inherited, latest(fiber.type));
+	if (context?.base && context !== inherited) entries.push({
+		hops: 0,
+		style: context.base
 	});
-	stashes.set(stash, owner);
-	const context = owner.childContext;
-	const placeholder = range("fragment", owner.end.parentNode, owner.end, context);
-	owner.stash = stash;
-	owner.placeholder = placeholder;
-	reconcile(placeholder, boundary.fallback(), context, boundary.parent);
-}
-function reveal(owner) {
-	unmountFiber(owner.placeholder);
-	owner.end.parentNode.insertBefore(owner.stash, owner.end);
-	for (const [portal, content] of owner.portals) if (!portal.dead) portal.portalContainer.append(content);
-	owner.portals = void 0;
-	owner.placeholder = void 0;
-	owner.stash = void 0;
-}
-function portals(fiber, found) {
-	for (const child of fiber.children) {
-		if (child.kind == "portal") found.push(child);
-		portals(child, found);
-	}
-	return found;
-}
-function moveRange(start, end, target) {
-	let node = start;
-	while (node) {
-		const next = node.nextSibling;
-		target.appendChild(node);
-		if (node === end) break;
-		node = next;
-	}
-}
-function suspend(fiber, thrown, passive) {
-	const boundary = fiber.boundary;
-	if (isThenable(thrown)) {
-		if (!boundary) throw thrown;
-		if (passive && !fiber.children.length && depth > 1) throw thrown;
-		if (!passive) wait(fiber, boundary);
-		const scope = fiber.scope;
-		let held = scope.holds;
-		scope.holds = void 0;
-		const clear = () => {
-			fiber.suspended.delete(clear);
-			release(held);
-			held = void 0;
-		};
-		(fiber.suspended ||= /* @__PURE__ */ new Set()).add(clear);
-		const resume = (retry) => {
-			fiber.suspended.delete(clear);
-			if (!scope.active) return clear();
-			if (held) (scope.holds ||= []).push(...held);
-			held = void 0;
-			retry();
-		};
-		thrown.then(() => resume(() => passive ? transition(() => schedule(scope)) : schedule(scope)), (error) => resume(() => pass(() => recover(fiber, error, fiber.boundary))));
-		return thrown;
-	}
-	recover(fiber, thrown, fiber.boundary);
-}
-function recover(fiber, thrown, boundary) {
-	const error = thrown instanceof Error ? thrown : new Error(String(thrown));
-	while (boundary && !boundary.catch) boundary = boundary.parent;
-	if (!boundary) throw error;
-	const handler = boundary;
-	const token = {};
-	wait(fiber, handler);
-	fiber.recovering = token;
-	Promise.resolve(handler.catch(error)).then(() => {
-		if (fiber.recovering !== token) return;
-		fiber.recovering = void 0;
-		if (!fiber.scope.active || fiber.retried) return;
-		fiber.retried = true;
-		schedule(fiber.scope);
-	}, (next) => {
-		if (fiber.recovering === token && fiber.scope.active) pass(() => recover(fiber, next, handler.parent));
+	if (style && !fiber.consumed && !(fiber.instance && "style" in fiber.instance)) entries.push({
+		hops: 0,
+		style
 	});
+	return entries.length || context ? {
+		context,
+		entries
+	} : void 0;
 }
-function isThenable(value) {
-	return !!value && typeof value.then == "function";
-}
-function reconcile(fiber, value, context, boundary, appearance) {
-	const detached = fiber.stash || fiber.staging;
-	if (detached) reconcileChildren(fiber, detached, null, value, context, boundary, appearance);
-	else reconcileChildren(fiber, fiber.end.parentNode, fiber.end, value, context, boundary, appearance);
-}
-function reconcilePortal(fiber, value, context, boundary, appearance) {
-	reconcileChildren(fiber, fiber.portalEnd.parentNode, fiber.portalEnd, value, context, boundary, appearance);
-}
-function reconcileChildren(owner, parent, before, value, context, boundary, appearance) {
-	const values = childrenOf(value);
-	const old = owner.children;
-	const keyed = /* @__PURE__ */ new Map();
-	const used = /* @__PURE__ */ new Set();
-	const next = [];
-	for (const child of old) if (child.key !== null && child.key !== void 0) keyed.set(child.key, child);
-	try {
-		for (let index = 0; index < values.length; index++) {
-			const value = source(values[index]);
-			const key = keyOf(value);
-			let child = key !== null && key !== void 0 ? keyed.get(key) : old[index]?.key == null ? old[index] : void 0;
-			if (child && used.has(child)) child = void 0;
-			if (child) used.add(child);
-			next.push(patch(child, value, parent, before, context, boundary, appearance));
-		}
-	} catch (error) {
-		owner.children = [...next, ...old.filter((child) => !child.dead && !next.includes(child))];
-		throw error;
-	}
-	for (const child of old) if (!used.has(child)) unmountFiber(child);
-	let anchor = before;
-	for (let index = next.length - 1; index >= 0; index--) {
-		move(next[index], parent, anchor);
-		anchor = next[index].start;
-	}
-	owner.children = next;
-}
-function patch(old, value, parent, before, context, boundary, appearance) {
-	if (!old || !compatible(old, value)) {
-		const next = mount(value, parent, old?.start || before, context, boundary, appearance);
-		if (old) unmountFiber(old);
-		return next;
-	}
-	if (old.ownBoundary) old.ownBoundary.parent = boundary;
-	old.boundary = old.ownBoundary || boundary;
-	if (old.kind == "collection") {
-		if (old.appearance !== appearance) {
-			old.appearance = appearance;
-			runCollection(old, passiveRender);
-		}
-		return old;
-	}
-	if (old.kind == "text") {
-		const next = String(value);
-		if (old.start.nodeValue !== next) old.start.nodeValue = next;
-		old.value = value;
-	} else if (old.kind == "element") patchProps(old, value.props, appearance);
-	else if (old.kind == "fragment") {
-		old.context = context;
-		old.appearance = appearance;
-		reconcile(old, value.props.children, context, old.boundary, appearance);
-	} else if (old.kind == "function") {
-		const vnode = value;
-		const resolved = componentProps(vnode.type, vnode.props, appearance);
-		if (old.type !== vnode.type) {
-			untrack(old.type, old.scope);
-			old.type = vnode.type;
-			old.scope.hot = true;
-			track(old.type, old.scope);
-		}
-		old.appearance = resolved.appearance;
-		old.props = observe(resolved.props);
-		rerun(old, () => runFunction(old, passiveRender));
-	} else if (old.kind == "component") {
-		const resolved = isVNode(value) ? componentProps(value.type, value.props, appearance) : {
-			appearance,
-			props: old.instance.props
-		};
-		old.appearance = resolved.appearance;
-		const props = isVNode(value) ? observe(resolved.props) : resolved.props;
-		if (isVNode(value) && props !== old.instance.props) {
-			if (passiveRender) old.applied = true;
-			old.instance.props = props;
-		}
-		old.props = props;
-		rerun(old, () => runComponent(old, passiveRender));
-	} else if (old.kind == "provider") {
-		old.appearance = appearance;
-		old.props = value.props;
-		const commit = provide(old.childContext, old.props);
-		reconcile(old, old.props.children, old.childContext, old.boundary, appearance);
-		commit();
-	} else {
-		old.appearance = appearance;
-		const vnode = value;
-		old.props = vnode.props;
-		reconcilePortal(old, vnode.props.children, context, old.boundary, appearance);
-	}
-	return old;
-}
-function rerun(fiber, run) {
-	claim$1(fiber.scope);
-	run();
-	settle$1(fiber.scope);
-}
-function compatible(fiber, value) {
-	if (fiber.kind == "text") return [
-		"string",
-		"number",
-		"bigint"
-	].includes(typeof value);
-	if (value instanceof Component) return fiber.kind == "component" && fiber.instance === value;
-	if (isCollection(value)) return fiber.kind == "collection" && fiber.source === value;
-	if (!isVNode(value)) return false;
-	if (fiber.key !== value.key || !same(fiber.type, value.type)) return false;
-	if (fiber.kind == "portal") return fiber.portalContainer === value.props.container;
-	return true;
-}
-function source(value) {
-	if (value instanceof Component) return value.is;
-	while (isCollection(value) && isCollection(Object.getPrototypeOf(value))) value = Object.getPrototypeOf(value);
-	return value;
-}
-function isCollection(value) {
-	return value instanceof has.List || value instanceof has.Pool || value instanceof map.Managed;
-}
-function keyOf(value) {
-	if (value instanceof Component) return value.key;
-	return isVNode(value) ? value.key : void 0;
-}
-function move(fiber, parent, before) {
-	if (fiber.start.parentNode === parent && fiber.end.nextSibling === before) return;
-	let node = fiber.start;
-	while (node) {
-		const next = node.nextSibling;
-		parent.insertBefore(node, before);
-		if (node === fiber.end) break;
-		node = next;
-	}
+
+//#endregion
+//#region src/render/element.ts
+const SVG = "http://www.w3.org/2000/svg";
+const CONTROLS = ["checked", "value"];
+const ENUMERATED = [
+	"contentEditable",
+	"contenteditable",
+	"draggable",
+	"spellcheck"
+];
+const ALIASES = {
+	autoFocus: "autofocus",
+	contentEditable: "contenteditable",
+	htmlFor: "for"
+};
+const controlled = /* @__PURE__ */ new WeakMap();
+const restoring = /* @__PURE__ */ new WeakSet();
+function mountElement(value, parent, before, context, boundary, appearance) {
+	const tag = value.type;
+	const host = hostOf(parent);
+	const element = (tag == "svg" || host instanceof SVGElement && host.localName != "foreignObject" ? SVG : void 0) ? document.createElementNS(SVG, tag) : document.createElement(tag);
+	const fiber = {
+		kind: "element",
+		key: value.key,
+		type: tag,
+		props: {},
+		context,
+		boundary,
+		start: element,
+		end: element,
+		children: [],
+		events: /* @__PURE__ */ new Map()
+	};
+	parent.insertBefore(element, before);
+	complete(fiber, () => {
+		patchProps(fiber, value.props, appearance);
+	});
+	if (value.props.autofocus || value.props.autoFocus) focusing.push(element);
+	return fiber;
 }
 function patchProps(fiber, next, appearance) {
 	const element = fiber.start;
@@ -1395,124 +861,505 @@ function patchProp(fiber, element, key, previous, next) {
 	} catch {}
 	element.setAttribute(name, next === true ? "" : String(next));
 }
-function applyClaim(element, before, after) {
-	const previous = before || {
-		className: "",
-		declarations: {}
-	};
-	if (previous.className !== after.className) if (after.className) element.setAttribute("class", after.className);
-	else element.removeAttribute("class");
-	applyDeclarations(element.style, after.declarations, previous.declarations);
+function restoreTarget(event) {
+	const element = event.target;
+	const fiber = controlled.get(element);
+	if (fiber && event.type == settles(fiber.props, element)) queueMicrotask(() => afterFlush(() => restore(fiber)));
 }
-function claim(element, appearance, resolved, className, value) {
-	const collected = {
-		classes: [],
-		declarations: {},
-		tokens: []
-	};
-	const entries = appearance?.entries || [];
-	let context = appearance?.context;
-	let reach = -1;
-	if (resolved) collect(createAppearanceToken(resolved), collected, 0);
-	appendClasses(collected.classes, className);
-	collect(value, collected, 0);
-	for (let index = entries.length - 1; index >= 0; index--) collect(entries[index].style, collected, entries[index].hops);
-	for (const { appearance, doors } of collected.tokens) {
-		for (const block of appearance.blocks || []) collected.classes.push(emitClass(block, doors, element.ownerDocument));
-		if (appearance.classes) collected.classes.push(...appearance.classes);
-		if (appearance.context && doors >= reach) {
-			context = appearance.context;
-			reach = doors;
-		}
+function settles(props, element) {
+	if (props.onInput) return "input";
+	if (props.onChange) return "change";
+	return element.type == "checkbox" || element.type == "radio" || element.localName == "select" ? "change" : "input";
+}
+function restore(fiber) {
+	const element = fiber.start;
+	for (const key of CONTROLS) {
+		const value = fiber.props[key];
+		if (value == null || fiber.dead) continue;
+		if (key == "value" ? String(element.value) !== String(value) : element[key] !== value) element[key] = value;
 	}
-	return {
-		className: [...new Set(collected.classes)].join(" "),
-		context,
-		declarations: collected.declarations
-	};
 }
-function renderedAppearance(fiber) {
-	if (fiber.kind != "component" && fiber.kind != "function") return fiber.appearance;
-	const style = fiber.props?.style;
-	const entries = (fiber.appearance?.entries || []).map(({ hops, style }) => ({
-		hops: hops + 1,
-		style
-	}));
-	const inherited = fiber.appearance?.context || appearanceRoot();
-	const context = enterAppearance(inherited, latest(fiber.type));
-	if (context?.base && context !== inherited) entries.push({
-		hops: 0,
-		style: context.base
-	});
-	if (style && !fiber.consumed && !(fiber.instance && "style" in fiber.instance)) entries.push({
-		hops: 0,
-		style
-	});
-	return entries.length || context ? {
+function settable(element, key) {
+	let target = element;
+	let descriptor;
+	while (!(descriptor = Object.getOwnPropertyDescriptor(target, key))) target = Object.getPrototypeOf(target);
+	return !!(descriptor.set || descriptor.writable);
+}
+function applyRef(ref, value) {
+	if (typeof ref == "function") ref(value);
+	else if (ref && typeof ref == "object" && "current" in ref) ref.current = value;
+}
+function unmountElement(fiber) {
+	applyRef(fiber.props?.ref, null);
+	for (const [id, listener] of fiber.events) {
+		const [name, capture] = id.split(":");
+		fiber.start.removeEventListener(name, listener, capture === "true");
+	}
+}
+
+//#endregion
+//#region src/render/portal.ts
+function mountPortal(value, parent, before, context, boundary, appearance) {
+	const marker = document.createComment("portal");
+	const container = target(value.props.into, parent);
+	const portalStart = document.createComment("portal-root");
+	const portalEnd = document.createComment("/portal-root");
+	parent.insertBefore(marker, before);
+	container.append(portalStart, portalEnd);
+	const output = {
+		kind: "portal",
+		key: value.key,
+		type: PORTAL,
+		props: value.props,
 		context,
-		entries
-	} : void 0;
+		boundary,
+		appearance,
+		start: marker,
+		end: marker,
+		children: [],
+		portalContainer: container,
+		portalStart,
+		portalEnd
+	};
+	return complete(output, () => {
+		reconcilePortal(output, value.props.children, context, boundary, appearance);
+	});
 }
-function collect(value, collected, doors) {
-	if (!value) return;
-	const token = appearanceToken(value);
-	if (token) {
-		collected.tokens.push({
-			appearance: token,
-			doors
-		});
-		Object.assign(collected.declarations, token.declarations);
-		return;
+function target(into, parent) {
+	if (typeof into != "string") return into;
+	const root = parent.getRootNode();
+	const found = [...document.querySelectorAll(into)];
+	if (root instanceof DocumentFragment) found.push(...root.querySelectorAll(into));
+	if (found.length != 1) throw new Error(`Portal target "${into}" ${found.length ? "is ambiguous" : "was not found"}.`);
+	return found[0];
+}
+function reconcilePortal(fiber, value, context, boundary, appearance) {
+	reconcileChildren(fiber, fiber.portalEnd.parentNode, fiber.portalEnd, value, context, boundary, appearance);
+}
+function patchPortal(fiber, value, context, appearance) {
+	fiber.appearance = appearance;
+	fiber.props = value.props;
+	reconcilePortal(fiber, value.props.children, context, fiber.boundary, appearance);
+}
+function unmountPortal(fiber) {
+	fiber.portalStart.remove();
+	fiber.portalEnd.remove();
+}
+
+//#endregion
+//#region src/render/reconcile.ts
+function reconcile(fiber, value, context, boundary, appearance) {
+	const detached = fiber.stash || fiber.staging;
+	if (detached) reconcileChildren(fiber, detached, null, value, context, boundary, appearance);
+	else reconcileChildren(fiber, fiber.end.parentNode, fiber.end, value, context, boundary, appearance);
+}
+function reconcileChildren(owner, parent, before, value, context, boundary, appearance) {
+	const values = childrenOf(value);
+	const old = owner.children;
+	const keyed = /* @__PURE__ */ new Map();
+	const used = /* @__PURE__ */ new Set();
+	const next = [];
+	for (const child of old) if (child.key !== null && child.key !== void 0) keyed.set(child.key, child);
+	try {
+		for (let index = 0; index < values.length; index++) {
+			const value = source(values[index]);
+			const key = keyOf(value);
+			let child = key !== null && key !== void 0 ? keyed.get(key) : old[index]?.key == null ? old[index] : void 0;
+			if (child && used.has(child)) child = void 0;
+			if (child) used.add(child);
+			const fiber = patch(child, value, parent, before, context, boundary, appearance);
+			if (fiber !== child) used.delete(child);
+			next.push(fiber);
+		}
+	} catch (error) {
+		gather(error, next, old);
+		owner.children = [...next, ...old.filter((child) => !child.dead && !next.includes(child))];
+		throw error;
 	}
-	if (typeof value == "string") {
-		appendClasses(collected.classes, value);
-		return;
+	for (const child of old) if (!used.has(child)) unmountFiber(child);
+	let anchor = before;
+	for (let index = next.length - 1; index >= 0; index--) {
+		const child = next[index];
+		const root = child.start.getRootNode();
+		move(child, parent, anchor);
+		anchor = child.start;
+		if (child.start.getRootNode() !== root) attach(root);
 	}
-	if (Array.isArray(value)) {
-		value.forEach((entry) => collect(entry, collected, doors));
-		return;
+	owner.children = next;
+}
+function patch(old, value, parent, before, context, boundary, appearance) {
+	if (!old || !compatible(old, value)) return mount(value, parent, old?.start || before, context, boundary, appearance);
+	if (old.ownBoundary) old.ownBoundary.parent = boundary;
+	old.boundary = old.ownBoundary || boundary;
+	if (old.kind == "collection") patchCollection(old, appearance);
+	else if (old.kind == "text") patchText(old, value);
+	else if (old.kind == "element") patchProps(old, value.props, appearance);
+	else if (old.kind == "fragment") patchFragment(old, value, context, appearance);
+	else if (old.kind == "function") patchFunction(old, value, appearance);
+	else if (old.kind == "component") patchComponent(old, value, appearance);
+	else patchPortal(old, value, context, appearance);
+	return old;
+}
+function compatible(fiber, value) {
+	if (fiber.kind == "text") return [
+		"string",
+		"number",
+		"bigint"
+	].includes(typeof value);
+	if (renderable(value)) return fiber.kind == "component" && fiber.instance === value;
+	if (isCollection(value)) return fiber.kind == "collection" && fiber.source === value;
+	if (!isVNode(value)) return false;
+	if (fiber.key !== value.key || !same(fiber.type, value.type)) return false;
+	if (fiber.kind == "portal") return fiber.props.into === value.props.into;
+	return true;
+}
+function source(value) {
+	if (value instanceof Model) return value.is;
+	while (isCollection(value) && isCollection(Object.getPrototypeOf(value))) value = Object.getPrototypeOf(value);
+	return value;
+}
+function keyOf(value) {
+	if (renderable(value)) return value.key;
+	return isVNode(value) ? value.key : void 0;
+}
+
+//#endregion
+//#region src/render/suspense.ts
+const dirty = /* @__PURE__ */ new Set();
+const stashes = /* @__PURE__ */ new WeakMap();
+let holding;
+let settling = false;
+function park(fiber) {
+	move(fiber, fragment(), null);
+}
+function hold(fiber, error) {
+	if (!holding || error !== holding.thrown) return false;
+	park(fiber);
+	holding.fiber = fiber;
+	return true;
+}
+function gather(error, next, old) {
+	if (!holding || error !== holding.thrown) return;
+	for (const fiber of next) if (!old.includes(fiber)) park(fiber);
+	if (holding.fiber) next.push(holding.fiber);
+	holding.fiber = void 0;
+}
+function hostOf(parent) {
+	let host = parent;
+	for (let owner = stashes.get(host); owner; owner = stashes.get(host)) host = owner.end.parentNode;
+	return host;
+}
+function wait(fiber, boundary) {
+	if (fiber.waitingOn !== boundary) unwait(fiber);
+	fiber.waitingOn = boundary;
+	(boundary.waiting ||= /* @__PURE__ */ new Set()).add(fiber);
+	dirty.add(boundary);
+}
+function unwait(fiber) {
+	const boundary = fiber.waitingOn;
+	if (!boundary) return;
+	fiber.waitingOn = void 0;
+	boundary.waiting.delete(fiber);
+	if (!boundary.owner.dead) dirty.add(boundary);
+}
+function settle() {
+	if (settling) return;
+	settling = true;
+	try {
+		for (const boundary of dirty) {
+			dirty.delete(boundary);
+			const owner = boundary.owner;
+			const waiting = boundary.waiting.size > 0;
+			if (!owner.dead && waiting != !!owner.stash) waiting ? hide(owner, boundary) : reveal(owner);
+		}
+	} finally {
+		settling = false;
 	}
-	for (const symbol of Object.getOwnPropertySymbols(value)) {
-		const ticket = tickets.get(value[symbol]);
-		if (!ticket) continue;
-		collected.classes.push(...ticket.classes);
-		for (const carried of ticket.tokens) collected.tokens.push({
-			appearance: carried.appearance,
-			doors: carried.doors + doors
+}
+function hide(owner, boundary) {
+	const stash = document.createDocumentFragment();
+	for (const child of owner.children) move(child, stash, null);
+	owner.portals = portals(owner, []).map((portal) => {
+		const content = document.createDocumentFragment();
+		moveRange(portal.portalStart, portal.portalEnd, content);
+		return [portal, content];
+	});
+	stashes.set(stash, owner);
+	const context = owner.childContext;
+	const placeholder = range("fragment", owner.end.parentNode, owner.end, context);
+	owner.stash = stash;
+	owner.placeholder = placeholder;
+	reconcile(placeholder, boundary.fallback(), context, boundary.parent);
+}
+function reveal(owner) {
+	unmountFiber(owner.placeholder);
+	owner.end.parentNode.insertBefore(owner.stash, owner.end);
+	for (const [portal, content] of owner.portals) if (!portal.dead) portal.portalContainer.append(content);
+	owner.portals = void 0;
+	owner.placeholder = void 0;
+	owner.stash = void 0;
+}
+function portals(fiber, found) {
+	for (const child of fiber.children) {
+		if (child.kind == "portal") found.push(child);
+		portals(child, found);
+	}
+	return found;
+}
+function suspend(fiber, thrown, passive, empty) {
+	const boundary = fiber.boundary;
+	if (isThenable(thrown)) {
+		if (!boundary) throw thrown;
+		if (passive && empty && depth > 1) {
+			if (holding?.thrown !== thrown) holding = { thrown };
+			throw thrown;
+		}
+		holding = void 0;
+		if (!passive) wait(fiber, boundary);
+		const scope = fiber.scope;
+		let held = scope.holds;
+		scope.holds = void 0;
+		const clear = () => {
+			fiber.suspended.delete(clear);
+			release(held);
+			held = void 0;
+		};
+		(fiber.suspended ||= /* @__PURE__ */ new Set()).add(clear);
+		const resume = (retry) => {
+			fiber.suspended.delete(clear);
+			if (!scope.active) return clear();
+			if (held) (scope.holds ||= []).push(...held);
+			held = void 0;
+			retry();
+		};
+		thrown.then(() => resume(() => passive ? transition(() => schedule(scope)) : schedule(scope)), (error) => resume(() => pass(() => recover(fiber, error, fiber.boundary))));
+		return thrown;
+	}
+	recover(fiber, thrown, fiber.boundary);
+}
+function recover(fiber, thrown, boundary) {
+	const error = thrown instanceof Error ? thrown : new Error(String(thrown));
+	while (boundary && !boundary.catch) boundary = boundary.parent;
+	if (!boundary) throw error;
+	const handler = boundary;
+	const token = {};
+	wait(fiber, handler);
+	fiber.recovering = token;
+	Promise.resolve(handler.catch(error)).then(() => {
+		if (fiber.recovering !== token) return;
+		fiber.recovering = void 0;
+		if (!fiber.scope.active || fiber.retried) return;
+		fiber.retried = true;
+		schedule(fiber.scope);
+	}, (next) => {
+		if (fiber.recovering === token && fiber.scope.active) pass(() => recover(fiber, next, handler.parent));
+	});
+}
+function isThenable(value) {
+	return !!value && typeof value.then == "function";
+}
+
+//#endregion
+//#region src/render/component.ts
+function mountFunction(value, parent, before, context, boundary, appearance) {
+	const fiber = range("function", parent, before, context);
+	const resolved = componentProps(value.type, value.props, appearance);
+	fiber.key = value.key;
+	fiber.type = value.type;
+	fiber.props = observe(resolved.props);
+	fiber.boundary = boundary;
+	fiber.appearance = resolved.appearance;
+	fiber.scope = makeScope("function", context, (passive) => runFunction(fiber, passive));
+	fiber.render = () => enter(fiber.scope, () => {
+		const type = latest(fiber.type);
+		return resolve(type, fiber.props, () => call(type, fiber.props));
+	});
+	track(fiber.type, fiber.scope);
+	probing(fiber);
+	return complete(fiber, () => {
+		runFunction(fiber, passiveRender);
+	});
+}
+function mountOwnedComponent(value, parent, before, context, boundary, appearance) {
+	const resolved = componentProps(value.type, value.props, appearance);
+	const Type = value.type;
+	const props = observe(resolved.props);
+	const instance = new Type(props, Type.prototype instanceof Component ? void 0 : () => props.is?.(instance));
+	return mountComponent(instance, parent, before, context, boundary, resolved.appearance, true, value.key, props);
+}
+function mountComponent(instance, parent, before, context, inherited, appearance, owned = false, key, props = instance.props) {
+	const fiber = range("component", parent, before, context);
+	const childContext = context.push(instance);
+	const element = owned ? props : {};
+	const fallback = element.fallback !== void 0 ? element.fallback : instance.fallback;
+	const ownBoundary = fallback !== void 0 && fallback !== false || element.catch || instance.catch ? {
+		catch: element.catch || instance.catch ? (error) => {
+			return (owned && fiber.props.catch || instance.catch).call(instance, error, instance);
+		} : void 0,
+		fallback: () => {
+			const placed = owned ? fiber.props.fallback : void 0;
+			return placed !== void 0 ? placed : instance.fallback;
+		},
+		owner: fiber,
+		parent: inherited
+	} : inherited;
+	fiber.boundary = ownBoundary;
+	if (ownBoundary !== inherited) fiber.ownBoundary = ownBoundary;
+	fiber.childContext = childContext;
+	fiber.instance = instance;
+	fiber.key = owned ? key : instance.key;
+	fiber.type = instance.constructor;
+	fiber.props = props;
+	fiber.owned = owned;
+	fiber.appearance = appearance;
+	fiber.scope = makeScope("component", childContext, (passive) => runComponent(fiber, passive));
+	fiber.render = () => enter(fiber.scope, () => {
+		const { render } = fiber.value;
+		return render ? unbind(render).call(fiber.value, fiber.props) : fiber.props.children ?? null;
+	});
+	probing(fiber);
+	let first = true;
+	let proxy = instance;
+	fiber.release = watch(instance, (current, events) => {
+		const { applied, scope } = fiber;
+		proxy = current;
+		fiber.applied = void 0;
+		if (!first && scope.active) if (applied && events.includes("props")) transition(() => schedule(scope));
+		else schedule(scope);
+		first = false;
+	}, void 0, transition);
+	Object.defineProperty(fiber, "value", { get: () => proxy });
+	try {
+		complete(fiber, () => {
+			runComponent(fiber, passiveRender);
 		});
+	} finally {
+		if (owned && !fiber.dead) inserted(fiber, () => fiber.cleanup = instance.mount?.());
 	}
-	for (const key of Object.keys(value)) collected.declarations[key] = value[key];
+	return fiber;
 }
-function appendClasses(classes, value) {
-	if (typeof value == "string") classes.push(...value.split(/\s+/).filter(Boolean));
+function runFunction(fiber, passive) {
+	const result = attempt(fiber, passive, fiber.render);
+	if (result === true) inserted(fiber, () => commit(fiber.scope));
+	else return result;
 }
-function restoreTarget(event) {
-	const element = event.target;
-	const fiber = controlled.get(element);
-	if (fiber && event.type == settles(fiber.props, element)) queueMicrotask(() => afterFlush(() => restore(fiber)));
+function runComponent(fiber, passive) {
+	const result = attempt(fiber, passive, fiber.render);
+	if (result !== true) return result;
 }
-function settles(props, element) {
-	if (props.onInput) return "input";
-	if (props.onChange) return "change";
-	return element.type == "checkbox" || element.type == "radio" || element.localName == "select" ? "change" : "input";
+function probing(fiber) {
+	const scope = fiber.scope;
+	scope.empty = () => !fiber.children.length;
+	scope.probe = () => {
+		try {
+			scope.probed = { output: consume(fiber, fiber.render) };
+		} catch (thrown) {
+			if (isThenable(thrown)) return thrown;
+		}
+	};
 }
-function restore(fiber) {
-	const element = fiber.start;
-	for (const key of CONTROLS) {
-		const value = fiber.props[key];
-		if (value == null || fiber.dead) continue;
-		if (key == "value" ? String(element.value) !== String(value) : element[key] !== value) element[key] = value;
+function patchFunction(fiber, value, appearance) {
+	const resolved = componentProps(value.type, value.props, appearance);
+	if (fiber.type !== value.type) {
+		untrack(fiber.type, fiber.scope);
+		fiber.type = value.type;
+		fiber.scope.hot = true;
+		track(fiber.type, fiber.scope);
 	}
+	fiber.appearance = resolved.appearance;
+	fiber.props = observe(resolved.props);
+	rerun(fiber, () => runFunction(fiber, passiveRender));
 }
-function settable(element, key) {
-	let target = element;
-	let descriptor;
-	while (!(descriptor = Object.getOwnPropertyDescriptor(target, key))) target = Object.getPrototypeOf(target);
-	return !!(descriptor.set || descriptor.writable);
+function patchComponent(fiber, value, appearance) {
+	const resolved = isVNode(value) ? componentProps(value.type, value.props, appearance) : {
+		appearance,
+		props: fiber.props
+	};
+	fiber.appearance = resolved.appearance;
+	const props = isVNode(value) ? observe(resolved.props) : resolved.props;
+	if (isVNode(value) && props !== fiber.props) {
+		const instance = fiber.instance;
+		if (passiveRender) fiber.applied = true;
+		if (instance instanceof Component) instance.props = props;
+		else instance.set(merge(fiber.props, props));
+	}
+	fiber.props = props;
+	rerun(fiber, () => runComponent(fiber, passiveRender));
 }
-function applyRef(ref, value) {
-	if (typeof ref == "function") ref(value);
-	else if (ref && typeof ref == "object" && "current" in ref) ref.current = value;
+function rerun(fiber, run) {
+	claim$1(fiber.scope);
+	run();
+	settle$1(fiber.scope);
+}
+function unmountComponent(fiber) {
+	if (typeof fiber.cleanup == "function") fiber.cleanup();
+	fiber.childContext?.pop();
+	if (fiber.owned && !fiber.instance.get(null)) fiber.instance.set(null);
+}
+function renderable(value) {
+	return value instanceof Model && typeof value.render == "function";
+}
+function merge(previous, next) {
+	const output = {};
+	for (const key in previous) output[key] = void 0;
+	return {
+		...output,
+		...next
+	};
+}
+
+//#endregion
+//#region src/render/mount.ts
+function complete(fiber, work) {
+	try {
+		work();
+	} catch (error) {
+		if (!hold(fiber, error)) unmountFiber(fiber);
+		throw error;
+	}
+	return fiber;
+}
+function mount(value, parent, before, context, boundary, appearance) {
+	if (typeof value == "string" || typeof value == "number" || typeof value == "bigint") {
+		const text = document.createTextNode(String(value));
+		parent.insertBefore(text, before);
+		return {
+			kind: "text",
+			value,
+			context,
+			start: text,
+			end: text,
+			children: []
+		};
+	}
+	if (renderable(value)) return mountComponent(value, parent, before, context, boundary, appearance);
+	if (isCollection(value)) return mountCollection(value, parent, before, context, boundary, appearance);
+	if (!isVNode(value)) throw new TypeError(`Cannot render ${String(value)}.`);
+	if (value.type === Fragment$1) return mountFragment(value, parent, before, context, boundary, appearance);
+	if (value.type === PORTAL) return mountPortal(value, parent, before, context, boundary, appearance);
+	if (typeof value.type == "string") return mountElement(value, parent, before, context, boundary, appearance);
+	if (typeof value.type != "function") throw new Error(`Cannot render ${String(value.type)}.`);
+	if (value.type.prototype instanceof Model) return mountOwnedComponent(value, parent, before, context, boundary, appearance);
+	return mountFunction(value, parent, before, context, boundary, appearance);
+}
+function mountFragment(value, parent, before, context, boundary, appearance) {
+	const fiber = range("fragment", parent, before, context);
+	fiber.key = value.key;
+	fiber.type = Fragment$1;
+	fiber.appearance = appearance;
+	return complete(fiber, () => {
+		reconcile(fiber, value.props.children, context, boundary, appearance);
+	});
+}
+function patchText(fiber, value) {
+	const next = String(value);
+	if (fiber.start.nodeValue !== next) fiber.start.nodeValue = next;
+	fiber.value = value;
+}
+function patchFragment(fiber, value, context, appearance) {
+	fiber.context = context;
+	fiber.appearance = appearance;
+	reconcile(fiber, value.props.children, context, fiber.boundary, appearance);
 }
 function unmountFiber(fiber) {
 	fiber.dead = true;
@@ -1523,34 +1370,91 @@ function unmountFiber(fiber) {
 	if (fiber.kind == "function") untrack(fiber.type, fiber.scope);
 	if (fiber.scope) dispose(fiber.scope);
 	fiber.release?.();
-	if (fiber.kind == "element") {
-		applyRef(fiber.props?.ref, null);
-		for (const [id, listener] of fiber.events) {
-			const [name, capture] = id.split(":");
-			fiber.start.removeEventListener(name, listener, capture === "true");
-		}
+	if (fiber.kind == "element") unmountElement(fiber);
+	else if (fiber.kind == "component") unmountComponent(fiber);
+	else if (fiber.kind == "portal") unmountPortal(fiber);
+	removeRange(fiber.start, fiber.end);
+}
+
+//#endregion
+//#region src/render/render.ts
+const roots = /* @__PURE__ */ new WeakMap();
+const focusing = [];
+let passiveRender = false;
+let depth = 0;
+function render(node, container) {
+	roots.get(container)?.();
+	container.replaceChildren();
+	const context = new Context(Context.root);
+	const fiber = range("fragment", container, null, context);
+	try {
+		pass(() => {
+			const appearanceContext = appearanceRoot();
+			reconcile(fiber, node, context, void 0, appearanceContext ? {
+				context: appearanceContext,
+				entries: []
+			} : void 0);
+		});
+	} catch (error) {
+		unmountFiber(fiber);
+		context.pop();
+		throw error;
 	}
-	if (fiber.kind == "component") {
-		if (typeof fiber.cleanup == "function") fiber.cleanup();
-		fiber.childContext?.pop();
-		if (fiber.owned && !fiber.instance.get(null)) fiber.instance.set(null);
-	} else if (fiber.kind == "provider") fiber.childContext?.pop();
-	else if (fiber.kind == "portal") {
-		fiber.portalStart.remove();
-		fiber.portalEnd.remove();
+	let active = true;
+	const unmount = () => {
+		if (!active) return;
+		active = false;
+		unmountFiber(fiber);
+		context.pop();
+		roots.delete(container);
+	};
+	roots.set(container, unmount);
+	return unmount;
+}
+function pass(work) {
+	depth++;
+	try {
+		return work();
+	} finally {
+		if (!--depth) {
+			settle();
+			focus();
+		}
 	}
-	removeRange(fiber.start, fiber.end);
 }
-function removeRange(start, end) {
-	let node = start;
-	while (true) {
-		const next = node.nextSibling;
-		node.remove();
-		if (node === end) break;
-		node = next;
+function focus() {
+	for (const element of focusing.splice(0)) if (element.isConnected) element.focus();
+}
+function attempt(fiber, passive, render) {
+	const previous = passiveRender;
+	const scope = fiber.scope;
+	const probed = scope.probed;
+	const empty = !fiber.children.length;
+	scope.probed = void 0;
+	passiveRender ||= passive;
+	if (passive && !depth && empty && !fiber.stash) fiber.staging ||= fragment();
+	const run = () => pass(() => {
+		try {
+			reconcile(fiber, probed ? probed.output : consume(fiber, render), scope.childContext, fiber.boundary, renderedAppearance(fiber));
+			if (fiber.staging) {
+				fiber.end.parentNode.insertBefore(fiber.staging, fiber.end);
+				attach(fiber.staging);
+				fiber.staging = void 0;
+			}
+			if (!fiber.recovering) unwait(fiber);
+			fiber.retried = void 0;
+			return true;
+		} catch (thrown) {
+			return suspend(fiber, thrown, passive, empty);
+		}
+	});
+	try {
+		return passive ? batched(run) : run();
+	} finally {
+		passiveRender = previous;
 	}
 }
 
 //#endregion
-export { Consumer, Provider, createPortal, css, lazy, macro, render, style };
+export { Fragment, Portal, createElement, css, macro, render, style };
 //# sourceMappingURL=index.js.map