@torpor/view 0.3.0 → 0.3.1

package/dist/compile.cjs

@@ -0,0 +1,3683 @@
+
+//#region src/compile/utils/endOfTemplateString.ts
+function endOfTemplateString(content, start) {
+	let level = 0;
+	for (let j = start + 1; j < content.length; j++) if (content[j] === "`" && content[j - 1] !== "\\" && level === 0) return j;
+	else if (content[j] === "{" && (level > 0 || content[j - 1] === "$")) level += 1;
+	else if (content[j] === "}" && level > 0) level -= 1;
+	return content.length;
+}
+
+//#endregion
+//#region src/compile/utils/Builder.ts
+var Builder = class {
+	#text = "";
+	#space = 0;
+	#mapped = false;
+	lineMap = [];
+	constructor(mapped) {
+		this.#mapped = mapped === true;
+	}
+	prepend(text) {
+		this.#text = text + "\n" + this.#text;
+	}
+	append(text) {
+		if (this.#mapped) {
+			this.lineMap.push(this.#text.length);
+			for (let i$1 = 0; i$1 < text.length; i$1++) if (text[i$1] === "\n") this.lineMap.push(this.#text.length + i$1);
+			this.#text += "\n" + text;
+			return;
+		}
+		const start = this.#text.length;
+		text = text.trim();
+		let i = 0;
+		while (i < text.length) {
+			while (text[i] === " " || text[i] === "	") i++;
+			if (text[i] === ";") i++;
+			else if (text[i] === "\n") {
+				this.lineMap.push(start + i);
+				this.#text += "\n";
+			} else {
+				if (text[i] === "}" || text[i] === ")" || text[i] === "]") this.#space -= 1;
+				this.#text += "	".repeat(Math.max(0, this.#space));
+				const start$1 = i;
+				while (i < text.length && text[i] !== "\n") {
+					if (text[i] === "`") i = endOfTemplateString(text, i);
+					i++;
+				}
+				const line = text.substring(start$1, i + 1);
+				if (line.startsWith("*")) this.#text += " ";
+				this.#text += line;
+				if (text[i - 1] === "{" || text[i - 1] === "(" || text[i - 1] === "[") this.#space += 1;
+			}
+			i++;
+		}
+		if (!this.#text.endsWith("\n\n")) this.#text += "\n";
+	}
+	toString() {
+		return this.#text;
+	}
+};
+
+//#endregion
+//#region src/compile/build/client/addMappedText.ts
+function addMappedText(preText, text, postText, range, status, b) {
+	if (status.options?.mapped) {
+		let start = b.toString().length + preText.length;
+		b.append(preText + text + postText);
+		let end = start + text.length - postText.length;
+		status.map.push({
+			script: text,
+			source: range,
+			compiled: {
+				start,
+				end
+			}
+		});
+	} else b.append(preText + text + postText);
+}
+
+//#endregion
+//#region src/compile/types/comments.ts
+const ANCHOR_COMMENT = "<!>";
+const HYDRATION_START_COMMENT = "<![>";
+const HYDRATION_END_COMMENT = "<!]>";
+const HYDRATION_BREAK_COMMENT = "<!^>";
+
+//#endregion
+//#region src/compile/utils/isReactive.ts
+/**
+* Checks whether the supplied string is fully or partially reactive (i.e. contains braces)
+*
+* @param text The string to check
+*
+* @returns True if the supplied string is fully or partially reactive
+*/
+function isReactive(text) {
+	return text.includes("{") && text.includes("}");
+}
+
+//#endregion
+//#region src/compile/utils/trimQuotes.ts
+/**
+* Trims matching quotes from the start and end of the supplied text
+*
+* @param text The text to trim
+*
+* @returns The text without the quotes at the start or the end
+*/
+function trimQuotes(text) {
+	let start = 0;
+	let end = text.length;
+	while (text[start] === "'" && text[end - 1] === "'" || text[start] === "\"" && text[end - 1] === "\"" || text[start] === "`" && text[end - 1] === "`") {
+		start += 1;
+		end -= 1;
+	}
+	return text.substring(start, end);
+}
+
+//#endregion
+//#region src/compile/build/client/buildFragmentText.ts
+/**
+* Builds the HTML template text for all of the fragments in a component
+*/
+function buildFragmentText(node, status, b) {
+	const fragments = [];
+	buildNodeFragmentText(node, status, fragments);
+	if (fragments.length) b.append(`const t_fragments: DocumentFragment[] = [];`);
+}
+function buildNodeFragmentText(node, status, fragments, currentFragment) {
+	switch (node.type) {
+		case "root":
+			buildRootFragmentText(node, status, fragments);
+			break;
+		case "control":
+			buildControlFragmentText(node, status, fragments, currentFragment);
+			break;
+		case "component":
+			buildComponentFragmentText(node, status, fragments, currentFragment);
+			break;
+		case "element": {
+			let ns = node.tagName === "svg";
+			if (ns) status.ns = true;
+			buildElementFragmentText(node, status, fragments, currentFragment);
+			if (ns) status.ns = false;
+			break;
+		}
+		case "text": {
+			const content = node.content;
+			if (currentFragment) currentFragment.text += isReactive(content) ? "#" : content;
+			break;
+		}
+		case "special":
+			buildSpecialFragmentText(node, status, fragments, currentFragment);
+			break;
+	}
+}
+function buildRootFragmentText(node, status, fragments) {
+	node.fragment = {
+		number: fragments.length,
+		text: "",
+		ns: status.ns,
+		effects: [],
+		events: [],
+		animations: []
+	};
+	fragments.push(node.fragment);
+	for (let child of node.children) buildNodeFragmentText(child, status, fragments, node.fragment);
+}
+function buildControlFragmentText(node, status, fragments, currentFragment) {
+	switch (node.operation) {
+		case "@if group":
+		case "@switch group":
+		case "@for group":
+		case "@await group":
+		case "@replace group":
+		case "@html group":
+			currentFragment.text += ANCHOR_COMMENT;
+			for (let child of node.children) buildNodeFragmentText(child, status, fragments, currentFragment);
+			break;
+		default:
+			node.fragment = {
+				number: fragments.length,
+				text: "",
+				ns: status.ns,
+				effects: [],
+				events: [],
+				animations: []
+			};
+			fragments.push(node.fragment);
+			for (let child of node.children) buildNodeFragmentText(child, status, fragments, node.fragment);
+			break;
+	}
+}
+function buildComponentFragmentText(node, status, fragments, currentFragment) {
+	currentFragment.text += ANCHOR_COMMENT;
+	if (node.children.length) {
+		node.fragment = {
+			number: fragments.length,
+			text: "",
+			ns: status.ns,
+			effects: [],
+			events: [],
+			animations: []
+		};
+		fragments.push(node.fragment);
+		for (let child of node.children) buildNodeFragmentText(child, status, fragments, node.fragment);
+	}
+}
+function buildElementFragmentText(node, status, fragments, currentFragment) {
+	let needsClass = node.scopeStyles;
+	currentFragment.text += `<${node.tagName}`;
+	let attributesText = node.attributes.filter((a) => !a.name.startsWith("on")).map((a) => {
+		if (a.value && a.reactive) {
+			if (a.name.startsWith("data-")) return `${a.name}=""`;
+		} else if (a.name === "class" && node.scopeStyles) {
+			needsClass = false;
+			let value = a.value ? `"${trimQuotes(a.value)} torp-${status.styleHash}"` : `"torp-${status.styleHash}"`;
+			return `${a.name}=${value}`;
+		} else return `${a.name}${a.value != null ? `=${a.value}` : ""}`;
+	}).filter(Boolean).join(" ");
+	if (attributesText) currentFragment.text += " " + attributesText;
+	if (needsClass) currentFragment.text += ` class="torp-${status.styleHash}"`;
+	currentFragment.text += ">";
+	for (let child of node.children) buildNodeFragmentText(child, status, fragments, currentFragment);
+	currentFragment.text += `</${node.tagName}>`;
+}
+function buildSpecialFragmentText(node, status, fragments, currentFragment) {
+	switch (node.tagName) {
+		case "slot":
+			currentFragment.text += ANCHOR_COMMENT;
+			for (let child of node.children) buildNodeFragmentText(child, status, fragments, node.fragment);
+			break;
+		case "fill":
+			node.fragment = {
+				number: fragments.length,
+				text: "",
+				ns: status.ns,
+				effects: [],
+				events: [],
+				animations: []
+			};
+			fragments.push(node.fragment);
+			for (let child of node.children) buildNodeFragmentText(child, status, fragments, node.fragment);
+			break;
+		case "@element":
+			buildComponentFragmentText(node, status, fragments, currentFragment);
+			break;
+		case "@component":
+			buildComponentFragmentText(node, status, fragments, currentFragment);
+			break;
+		default: throw new Error(`Invalid special node: ${node.tagName}`);
+	}
+}
+
+//#endregion
+//#region src/compile/utils/isSpecialNode.ts
+function isSpecialNode(node) {
+	return node.type === "special";
+}
+
+//#endregion
+//#region src/compile/build/utils/nextVarName.ts
+/**
+* Makes a supplied variable name (hopefully!) unique by prepending `t_` and
+* appending a sequence number
+*
+* @param name The variable name
+* @param status The build status
+*
+* @returns A unique variable name
+*/
+function nextVarName(name, status) {
+	if (!status.varNames[name]) status.varNames[name] = 1;
+	let varName = `t_${name}_${status.varNames[name]}`;
+	status.varNames[name] += 1;
+	return varName;
+}
+
+//#endregion
+//#region src/compile/build/client/buildAddFragment.ts
+function buildAddFragment(node, status, b, parentName, anchorName) {
+	if (node.fragment) {
+		const fragment = node.fragment;
+		const fragmentName = `t_fragment_${fragment.number}`;
+		status.imports.add("t_add_fragment");
+		if (fragment.effects.length > 0) {
+			status.imports.add("$run");
+			b.append(`$run(function setAttributes() {`);
+			if (status.options?.mapped) for (let effect of fragment.effects) for (let i = 0; i < effect.ranges.length; i++) {
+				let start = b.toString().length + effect.offsets[i];
+				b.append(effect.functionBody);
+				let end = start + effect.lengths[i];
+				status.map.push({
+					script: effect.functionBody,
+					source: effect.ranges[i],
+					compiled: {
+						start,
+						end
+					}
+				});
+			}
+			else b.append(fragment.effects.map((e) => e.functionBody).join("\n"));
+			b.append("});");
+		}
+		let params = [
+			fragmentName,
+			parentName,
+			anchorName
+		];
+		if (fragment.endVarName) params.push(fragment.endVarName);
+		b.append(`t_add_fragment(${params.join(", ")});`);
+		if (fragment.endVarName) {
+			status.imports.add("t_next");
+			b.append(`t_next(${fragment.endVarName});`);
+		}
+	}
+}
+
+//#endregion
+//#region src/compile/parse/utils/isSpaceChar.ts
+/**
+* Checks whether the supplied character is a space
+*
+* @param text The string to check
+* @param index The index of the character in the string
+*
+* @returns True if the supplied character is a space
+*/
+function isSpaceChar(text, index) {
+	let code = text.charCodeAt(index);
+	return code === 32 || code >= 9 && code <= 13;
+}
+
+//#endregion
+//#region src/compile/parse/utils/isSpace.ts
+/**
+* Checks whether the supplied string contains only space characters
+*
+* @param text The string to check
+*
+* @returns True if the supplied string contains only space characters
+*/
+function isSpace(text) {
+	for (let i = 0; i < text.length; i++) if (!isSpaceChar(text, i)) return false;
+	return true;
+}
+
+//#endregion
+//#region src/compile/utils/isControlNode.ts
+function isControlNode(node) {
+	return node.type === "control";
+}
+
+//#endregion
+//#region src/compile/utils/isElementNode.ts
+function isElementNode(node) {
+	return node.type === "element";
+}
+
+//#endregion
+//#region src/compile/utils/isTextNode.ts
+function isTextNode(node) {
+	return node.type === "text";
+}
+
+//#endregion
+//#region src/compile/build/client/buildFragment.ts
+/**
+* Builds the variables and code in a fragment
+*/
+function buildFragment(node, status, b, parentName, anchorName) {
+	if (node.fragment) {
+		const fragment = node.fragment;
+		const fragmentName = `t_fragment_${fragment.number}`;
+		if (status.options?.useCreateElement) {
+			let fragmentPath = {
+				parent: null,
+				type: "fragment",
+				children: []
+			};
+			let varPaths = /* @__PURE__ */ new Map();
+			declareFragmentVars(node.fragment, node, fragmentPath, status, b, parentName, anchorName, varPaths, false, true);
+			fragmentPath.children.length = 0;
+			varPaths.clear();
+			status.imports.add("t_frg");
+			b.append(`const ${fragmentName} = t_frg([`);
+			declareFragmentVars(node.fragment, node, fragmentPath, status, b, parentName, anchorName, varPaths, false, false);
+			b.append(`]);`);
+		} else {
+			status.imports.add("t_fragment");
+			const fragmentText = fragment.text.replaceAll("`", "\\`").replaceAll(/\s+/g, " ");
+			b.append(`const ${fragmentName} = t_fragment($parent.ownerDocument!, t_fragments, ${fragment.number}, \`${fragmentText}\`${fragment.ns ? ", true" : ""});`);
+			let fragmentPath = {
+				parent: null,
+				type: "fragment",
+				children: []
+			};
+			let varPaths = /* @__PURE__ */ new Map();
+			maybeAddRootNodeDeclaration(node, fragment, fragmentName, status, b, varPaths);
+			declareFragmentVars(node.fragment, node, fragmentPath, status, b, parentName, anchorName, varPaths, false, true);
+		}
+	}
+}
+function maybeAddRootNodeDeclaration(node, fragment, fragmentName, status, b, varPaths) {
+	if (!node.children.length) return;
+	let firstNode = node.children[0];
+	let firstNodeIsLastNode = node.children.length === 1;
+	if (isControlNode(firstNode) && firstNode.operation.endsWith(" group") || isElementNode(firstNode) && elementNodeNeedsDeclaration(firstNode, true, firstNodeIsLastNode) || isTextNode(firstNode) && textNodeNeedsDeclaration(firstNode, true, firstNodeIsLastNode)) {} else {
+		status.imports.add("t_root");
+		const rootName = `t_root_${fragment.number}`;
+		const params = [fragmentName];
+		if (firstNode.type === "text") params.push("true");
+		const rootPath = `t_root(${params.join(", ")})`;
+		b.append(`const ${rootName} = ${rootPath};`);
+		varPaths.set(`t_root(${fragmentName})`, rootName);
+		printDebug(rootName, status, b);
+	}
+}
+function declareFragmentVars(fragment, node, path, status, b, parentName, anchorName, varPaths, lastChild, declare) {
+	switch (node.type) {
+		case "root":
+			declareRootFragmentVars(fragment, node, path, status, b, parentName, anchorName, varPaths, declare);
+			break;
+		case "control":
+			declareControlFragmentVars(fragment, node, path, status, b, parentName, anchorName, varPaths, declare);
+			break;
+		case "component":
+			declareComponentFragmentVars(fragment, node, path, status, b, parentName, anchorName, varPaths, declare);
+			break;
+		case "element":
+			declareElementFragmentVars(fragment, node, path, status, b, parentName, anchorName, varPaths, lastChild, declare);
+			break;
+		case "text":
+			declareTextFragmentVars(fragment, node, path, status, b, varPaths, lastChild, declare);
+			break;
+		case "special":
+			declareSpecialFragmentVars(fragment, node, path, status, b, parentName, anchorName, varPaths, lastChild, declare);
+			break;
+		default: throw new Error(`Invalid node type: ${node.type}`);
+	}
+}
+function declareRootFragmentVars(fragment, node, path, status, b, parentName, anchorName, varPaths, declare) {
+	for (let [i, child] of node.children.entries()) declareFragmentVars(fragment, child, path, status, b, parentName, anchorName, varPaths, i === node.children.length - 1, declare);
+}
+function declareControlFragmentVars(fragment, node, path, status, b, parentName, anchorName, varPaths, declare) {
+	switch (node.operation) {
+		case "@if group":
+		case "@switch group":
+		case "@for group":
+		case "@await group":
+		case "@replace group":
+		case "@html group": {
+			const operation = node.operation.substring(1).replace(" group", "");
+			declareParentAndAnchorFragmentVars(fragment, node, path, status, b, parentName, anchorName, varPaths, operation, declare);
+			break;
+		}
+		default:
+			for (let [i, child] of node.children.entries()) declareFragmentVars(fragment, child, path, status, b, parentName, anchorName, varPaths, i === node.children.length - 1, declare);
+			break;
+	}
+}
+function declareComponentFragmentVars(fragment, node, path, status, b, parentName, anchorName, varPaths, declare) {
+	declareParentAndAnchorFragmentVars(fragment, node, path, status, b, parentName, anchorName, varPaths, "comp", declare);
+}
+function elementTypeName(node) {
+	switch (node.tagName.toLowerCase()) {
+		case "div":
+		case "input": return `HTML${node.tagName.substring(0, 1).toUpperCase() + node.tagName.substring(1)}Element`;
+		case "textarea": return "HTMLTextAreaElement";
+	}
+	return "HTMLElement";
+}
+function declareElementFragmentVars(fragment, node, path, status, b, parentName, anchorName, varPaths, lastChild, declare) {
+	const tagName = node.tagName === "@element" ? "element" : node.tagName;
+	let elementPath = {
+		parent: path,
+		type: tagName,
+		children: []
+	};
+	path.children.push(elementPath);
+	const topLevel = !path.parent;
+	const declareVariable = elementNodeNeedsDeclaration(node, topLevel, lastChild);
+	if (declare) {
+		if (declareVariable) {
+			node.varName = nextVarName(tagName, status);
+			if (topLevel) fragment.endVarName = node.varName;
+			const varPath = getFragmentVarPath(fragment, status, node.varName, elementPath, varPaths);
+			if (status.options?.useCreateElement) b.append(`let ${node.varName};`);
+			else if (node.tagName === "@element") b.append(`let ${node.varName} = ${varPath} as ${elementTypeName(node)};`);
+			else {
+				b.append(`const ${node.varName} = ${varPath} as ${elementTypeName(node)};`);
+				printDebug(node.varName, status, b);
+			}
+		}
+	}
+	let childParentName = node.children.find((c) => !!c.parentName)?.parentName;
+	if (!declare) {
+		let attributes = node.attributes.filter((a) => !a.name.startsWith("on")).map((a) => {
+			if (a.value && a.reactive) return `"${a.name}": "#"`;
+			else if (a.value) return `"${a.name}": "${trimQuotes(a.value) || a.name}"`;
+			else return `"${a.name}": true"`;
+		}).join(", ");
+		status.imports.add("t_elm");
+		if (declareVariable) b.append(`(${childParentName ? `${childParentName} = ` : ""}${node.varName} = t_elm("${node.tagName}", {${attributes}}, [`);
+		else if (childParentName) b.append(`(${childParentName} = t_elm("${node.tagName}", {${attributes}}, [`);
+		else b.append(`t_elm("${node.tagName}", {${attributes}}, [`);
+	}
+	for (let [i, child] of node.children.entries()) declareFragmentVars(fragment, child, elementPath, status, b, parentName, anchorName, varPaths, i === node.children.length - 1, declare);
+	if (!declare) if (declareVariable || childParentName) b.append("])),");
+	else b.append("]),");
+}
+function elementNodeNeedsDeclaration(node, topLevel, lastChild) {
+	const hasReactiveAttribute = node.attributes.some((a) => a.value && a.reactive);
+	const isDynamicElement = node.tagName === "@element" && node.attributes.find((a) => a.name === "self");
+	return hasReactiveAttribute || isDynamicElement || topLevel && lastChild;
+}
+function declareTextFragmentVars(fragment, node, path, status, b, varPaths, lastChild, declare) {
+	const lastType = path.children[path.children.length - 1]?.type;
+	if (lastType === "text" || lastType === "space") return;
+	let textPath = {
+		parent: path,
+		type: isSpace(node.content) ? "space" : "text",
+		children: []
+	};
+	path.children.push(textPath);
+	const topLevel = !path.parent;
+	const declareVariable = textNodeNeedsDeclaration(node, topLevel, lastChild);
+	if (declare) {
+		if (declareVariable) {
+			node.varName = nextVarName("text", status);
+			if (topLevel) fragment.endVarName = node.varName;
+			const varPath = getFragmentVarPath(fragment, status, node.varName, textPath, varPaths);
+			if (status.options?.useCreateElement) b.append(`let ${node.varName};`);
+			else {
+				b.append(`const ${node.varName} = ${varPath};`);
+				printDebug(node.varName, status, b);
+			}
+		}
+	} else {
+		status.imports.add("t_txt");
+		if (declareVariable) b.append(`(${node.varName} = t_txt(" ")),`);
+		else b.append(`t_txt("${node.content}"),`);
+	}
+}
+function textNodeNeedsDeclaration(node, topLevel, lastChild) {
+	return isReactive(node.content) || topLevel && lastChild;
+}
+function declareSpecialFragmentVars(fragment, node, path, status, b, parentName, anchorName, varPaths, lastChild, declare) {
+	if (node.tagName === "slot") declareParentAndAnchorFragmentVars(fragment, node, path, status, b, parentName, anchorName, varPaths, "slot", declare);
+	switch (node.tagName) {
+		case "slot":
+		case "fill":
+			for (let [i, child] of node.children.entries()) {
+				if (node.tagName === "slot" && isSpecialNode(child) && child.tagName === "fill") continue;
+				declareFragmentVars(fragment, child, path, status, b, parentName, anchorName, varPaths, i === node.children.length - 1, declare);
+			}
+			break;
+		case "@element":
+			declareElementFragmentVars(fragment, node, path, status, b, parentName, anchorName, varPaths, lastChild, declare);
+			break;
+		case "@component":
+			declareComponentFragmentVars(fragment, node, path, status, b, parentName, anchorName, varPaths, declare);
+			break;
+		default: throw new Error(`Invalid special node: ${node.tagName}`);
+	}
+}
+function declareParentAndAnchorFragmentVars(fragment, node, path, status, b, parentName, anchorName, varPaths, name, declare) {
+	if (!path.parent) node.parentName = `t_fragment_${fragment.number}`;
+	else {
+		const parentPath = path;
+		const oldChildren = parentPath.children;
+		parentPath.children = [];
+		const parentVarPath = getFragmentVarPath(fragment, status, "?", parentPath, varPaths);
+		parentPath.children = oldChildren;
+		if (varPaths.has(parentVarPath)) node.parentName = varPaths.get(parentVarPath);
+		else if (declare) {
+			node.parentName = nextVarName(`${name}_parent`, status);
+			if (status.options?.useCreateElement) b.append(`let ${node.parentName} as HTMLElement;`);
+			else {
+				b.append(`const ${node.parentName} = ${parentVarPath} as HTMLElement;`);
+				printDebug(node.parentName, status, b);
+			}
+			varPaths.set(parentVarPath, node.parentName);
+		}
+	}
+	if (declare) {
+		const anchorPath = {
+			parent: path,
+			type: "#",
+			children: []
+		};
+		path.children.push(anchorPath);
+		node.varName = nextVarName(`${name}_anchor`, status);
+		const anchorVarPath = getFragmentVarPath(fragment, status, node.varName, anchorPath, varPaths);
+		if (status.options?.useCreateElement) b.append(`let ${node.varName};`);
+		else {
+			status.imports.add("t_anchor");
+			b.append(`let ${node.varName} = t_anchor(${anchorVarPath}) as HTMLElement;`);
+			printDebug(node.varName, status, b);
+		}
+	} else {
+		status.imports.add("t_cmt");
+		b.append(`(${node.varName} = t_cmt()),`);
+	}
+	buildNode(node, status, b, parentName, anchorName);
+	node.handled = true;
+}
+function getFragmentVarPath(fragment, status, name, path, varPaths) {
+	let node = path;
+	while (node.parent) node = node.parent;
+	let varName = `t_fragment_${fragment.number}`;
+	let varPath = getFragmentVarPathPart(node, varName, status, true);
+	for (let [existingPath, existingName] of varPaths) if (varPath.includes(existingPath)) varPath = varPath.replace(existingPath, existingName);
+	if (name !== "?") {
+		varPaths.set(varPath, name);
+		varPaths.set(name, name);
+	}
+	while (varPath.includes("t_next(t_next(")) {
+		status.imports.add("t_skip");
+		const match = varPath.match(/(t_next\(){2,}/)[0];
+		const count = match.length / 7;
+		const pos = varPath.indexOf("t_next(t_next(");
+		const head = varPath.substring(0, pos);
+		let level = 0;
+		let end = 0;
+		for (let i = pos + match.length; i < varPath.length; i++) if (varPath[i] === "(") level++;
+		else if (varPath[i] === ")") if (level === 0) {
+			end = i;
+			break;
+		} else level--;
+		const tail = varPath.substring(end + count);
+		const param = varPath.substring(pos + match.length, end);
+		varPath = `${head}t_skip(${param}, ${count})${tail}`;
+	}
+	varPath = varPath.replaceAll("t_next_text", "t_next");
+	return varPath;
+}
+function getFragmentVarPathPart(path, varPath, status, root = false) {
+	if (root) {
+		status.imports.add("t_root");
+		varPath = `t_root(${varPath})`;
+	} else {
+		status.imports.add("t_child");
+		varPath = `t_child(${varPath})`;
+	}
+	for (let [i, child] of path.children.entries()) {
+		if (i > 0) if (child.type === "text" || child.type === "space") varPath = `t_next_text(${varPath}, true)`;
+		else {
+			status.imports.add("t_next");
+			varPath = `t_next(${varPath})`;
+		}
+		if (i === path.children.length - 1 && child.children.length) varPath = getFragmentVarPathPart(child, varPath, status);
+	}
+	return varPath;
+}
+function printDebug(varName, status, b) {}
+
+//#endregion
+//#region src/compile/build/client/replaceForVarNames.ts
+/**
+* Variables used within a for loop need to be retrieved from the loop data.
+*/
+function replaceForVarNames(value, status) {
+	for (let varName of status.forVarNames) value = value.replaceAll(new RegExp(`(^|\\s|\\(|\\[|\\{)${varName}($|\\s|\\.|\\(|\\)|\\[|\\]|\\}|;)`, "g"), `$1t_item.data.${varName}$2`);
+	return value;
+}
+
+//#endregion
+//#region src/compile/build/client/buildRun.ts
+function buildRun(functionName, functionBody, status, b) {
+	functionBody = replaceForVarNames(functionBody, status);
+	status.imports.add("$run");
+	b.append(`$run(function ${functionName}() {`);
+	b.append(functionBody);
+	b.append("});");
+}
+
+//#endregion
+//#region src/compile/build/client/buildComponentNode.ts
+function buildComponentNode(node, status, b, root = false) {
+	b.append("");
+	b.append("/* @component */");
+	const componentHasProps = node.attributes.length || root;
+	const propsName = componentHasProps ? nextVarName("props", status) : "undefined";
+	if (componentHasProps) {
+		status.imports.add("$watch");
+		b.append(`const ${propsName}: any = $watch({});`);
+		for (let { name, value, reactive, fullyReactive } of node.attributes) if (name === "self" && node.tagName === "@component") {} else if (name.startsWith("&") && value != null && fullyReactive) {
+			name = name.substring(1);
+			buildRun("setProp", `${propsName}["${name}"] = ${value};`, status, b);
+			buildRun("setBinding", `${value} = ${propsName}["${name}"];`, status, b);
+		} else if (name === "class" && value != null) {
+			status.imports.add("t_class");
+			const params = [value];
+			if (node.scopeStyles) params.push(`"torp-${status.styleHash}"`);
+			buildRun("setClasses", `${propsName}["class"] = t_class(${params.join(", ")});`, status, b);
+		} else if (name === "style" && value != null) {
+			status.imports.add("t_style");
+			buildRun("setStyles", `${propsName}["style"] = t_style(${value});`, status, b);
+		} else if (value != null) {
+			const setProp = `${propsName}["${name}"] = ${value};`;
+			if (reactive) buildRun("setProp", setProp, status, b);
+			else b.append(setProp);
+		} else b.append(`${propsName}["${name}"] = true;`);
+		if (root) {
+			status.imports.add("$run");
+			b.append(`
+			if ($props) {
+				const propNames = [${status.props.map((p) => `'${p}'`).join(", ")}];
+				for (let name of Object.keys($props)) {
+					if (!name.startsWith("$") && !propNames.includes(name)) {
+						$run(() => ${propsName}[name] = $props[name]);
+					}
+				}
+			}`);
+		}
+	}
+	const componentHasSlots = node.children.length;
+	const slotsName = componentHasSlots ? nextVarName("slots", status) : "undefined";
+	if (componentHasSlots) {
+		b.append(`const ${slotsName}: Record<string, SlotRender> = {};`);
+		for (let slot of node.children) if (isSpecialNode(slot) && slot.tagName === "fill") {
+			const nameAttribute = slot.attributes.find((a) => a.name === "name");
+			const slotName = nameAttribute?.value ? trimQuotes(nameAttribute.value) : "_";
+			const slotParams = [
+				"$sparent: ParentNode",
+				"$sanchor: Node | null",
+				`${slot.hasSlotProps ? "$sprops" : "_$sprops?"}: Record<PropertyKey, any>`,
+				"// @ts-ignore\n$context?: Record<PropertyKey, any>"
+			];
+			b.append(`${slotsName}["${slotName}"] = (\n${slotParams.join(",\n")}\n) => {`);
+			buildFragment(slot, status, b, "$sparent", "$sanchor");
+			status.fragmentStack.push({
+				fragment: slot.fragment,
+				path: ""
+			});
+			for (let child of slot.children) buildNode(child, status, b, "$sparent", "$sanchor");
+			status.fragmentStack.pop();
+			buildAddFragment(slot, status, b, "$sparent", "$sanchor");
+			b.append(`}`);
+		}
+	}
+	const compParentName = node.parentName;
+	const compAnchorName = node.varName;
+	let renderParams = `${compParentName}, ${compAnchorName}, ${propsName}, $context`;
+	if (slotsName !== "undefined") renderParams += `, ${slotsName}`;
+	let componentName = node.tagName;
+	if (componentName === "@component") {
+		let selfAttribute = node.attributes.find((a) => a.name === "self");
+		if (selfAttribute && selfAttribute.value && selfAttribute.fullyReactive) componentName = selfAttribute.value;
+	}
+	addMappedText("", `${componentName}(${renderParams})`, ";", node.range, status, b);
+	b.append("");
+}
+
+//#endregion
+//#region src/compile/utils/trimMatched.ts
+/**
+* Trims chars from the start and end of the supplied text when both the start and end match
+*
+* @param text The text to trim
+*
+* @returns The text without the chars at the start or the end
+*/
+function trimMatched(text, startChar, endChar) {
+	let start = 0;
+	let end = text.length;
+	while (text[start] === startChar && text[end - 1] === endChar) {
+		start += 1;
+		end -= 1;
+	}
+	return text.substring(start, end);
+}
+
+//#endregion
+//#region src/compile/build/client/buildAwaitNode.ts
+function buildAwaitNode(node, status, b) {
+	const anchorName = node.varName;
+	const parentName = node.parentName;
+	const rangeName = nextVarName("await_range", status);
+	const stateName = "$" + nextVarName("await_state", status);
+	const awaitVarsName = nextVarName("await_vars", status);
+	const branches = node.children.filter((n) => isControlNode(n));
+	let awaitBranch = branches.find((n) => n.operation === "@await");
+	if (!awaitBranch) {}
+	let thenBranch = branches.find((n) => n.operation === "@then");
+	if (!thenBranch) thenBranch = {
+		type: "control",
+		operation: "@then",
+		statement: "then",
+		children: [],
+		range: {
+			start: 0,
+			end: 0
+		}
+	};
+	let catchBranch = branches.find((n) => n.operation === "@catch");
+	if (!catchBranch) catchBranch = {
+		type: "control",
+		operation: "@catch",
+		statement: "catch",
+		children: [],
+		range: {
+			start: 0,
+			end: 0
+		}
+	};
+	const awaiterName = trimMatched(awaitBranch.statement.substring(5).trim(), "(", ")");
+	const thenVar = trimMatched(thenBranch.statement.substring(4).trim(), "(", ")");
+	const catchVar = trimMatched(catchBranch.statement.substring(5).trim(), "(", ")");
+	status.imports.add("$watch");
+	status.imports.add("$run");
+	status.imports.add("t_range");
+	status.imports.add("t_run_control");
+	status.imports.add("t_run_branch");
+	b.append("");
+	b.append(`
+		/* @await */
+		const ${rangeName} = t_range();
+		let ${stateName} = $watch({ creator: (_: Node | null) => {} });`);
+	b.append(`
+		let ${awaitVarsName} = { t_token: 0 };
+		$run(function runAwait() {`);
+	buildAwaitBranch(awaitBranch, status, b, parentName, stateName);
+	b.append(`${awaitVarsName}.t_token++;
+			((t_token) => {`);
+	awaitBranch.range.start += 7;
+	addMappedText("", replaceForVarNames(awaiterName, status), "", awaitBranch.range, status, b);
+	thenBranch.range.start -= 1;
+	addMappedText(".then((", replaceForVarNames(thenVar, status), ") => {", thenBranch.range, status, b);
+	b.append(`if (t_token === ${awaitVarsName}.t_token) {`);
+	buildAwaitBranch(thenBranch, status, b, parentName, stateName);
+	b.append(`}
+		})`);
+	catchBranch.range.start -= 1;
+	addMappedText(".catch((", replaceForVarNames(catchVar, status), ") => {", catchBranch.range, status, b);
+	b.append(`
+		if (t_token === ${awaitVarsName}.t_token) {`);
+	buildAwaitBranch(catchBranch, status, b, parentName, stateName);
+	b.append(`}
+				});
+			})(${awaitVarsName}.t_token);
+		});`);
+	b.append(`
+		t_run_control(${rangeName}, ${anchorName}, (t_before) => {
+			t_run_branch(${rangeName}, () => ${stateName}.creator(t_before));
+		});`);
+	b.append("");
+}
+function buildAwaitBranch(node, status, b, parentName, stateName) {
+	if (node.children.length > 0) {
+		b.append(`${stateName}.creator = (t_before) => {`);
+		buildFragment(node, status, b, parentName, "t_before");
+		status.fragmentStack.push({
+			fragment: node.fragment,
+			path: ""
+		});
+		for (let child of node.children) buildNode(child, status, b, parentName, "t_before");
+		status.fragmentStack.pop();
+		buildAddFragment(node, status, b, parentName, "t_before");
+		b.append("};");
+	} else b.append(`${stateName}.creator = (_) => {};`);
+}
+
+//#endregion
+//#region src/compile/utils/trimEnd.ts
+/**
+* Trims a char from the end of the supplied text
+*
+* @param text The text to trim
+* @param char The char to remove from the end of the text
+*
+* @returns The text without the char on the end
+*/
+function trimEnd(text, char) {
+	let end = text.length;
+	while (text[end - 1] === char) end -= 1;
+	return text.substring(0, end);
+}
+
+//#endregion
+//#region src/compile/build/client/buildForNode.ts
+const forLoopRegex = /for\s*\((.+?);.*?;.*?\)/;
+const forLoopVarsRegex = /(?:let\s+|var\s+){0,1}([^\s,;+=]+)(?:\s*=\s*[^,;]+){0,1}/g;
+const forOfRegex = /for\s*\(\s*(?:let\s*|var\s*){0,1}(.+?)\s+(?:of|in).*?\)/;
+function buildForNode(node, status, b) {
+	const forParentName = node.parentName;
+	const forAnchorName = node.varName;
+	node = node.children[0];
+	const forVarNames = [];
+	const forIndexMatch = node.statement.match(forLoopRegex);
+	if (forIndexMatch) {
+		const forVarMatches = forIndexMatch[1].matchAll(forLoopVarsRegex);
+		for (let match of forVarMatches) forVarNames.push(match[1]);
+	} else {
+		const forOfMatch = node.statement.match(forOfRegex);
+		if (forOfMatch) {
+			const match = forOfMatch[1];
+			if (match.startsWith("{") && match.endsWith("}") || match.startsWith("[") && match.endsWith("]")) forVarNames.push(...trimMatched(trimMatched(match, "{", "}"), "[", "]").split(",").map((m) => m.trim()));
+			else forVarNames.push(match);
+		}
+	}
+	const forRangeName = nextVarName("for_range", status);
+	const key = node.children.find((n) => n.type === "control" && n.operation === "@key");
+	let keyStatement = key ? key.statement : "";
+	if (keyStatement) keyStatement = trimEnd(keyStatement.substring(keyStatement.indexOf("=") + 1).trim(), ";");
+	status.imports.add("t_range");
+	status.imports.add("t_run_list");
+	status.imports.add("t_list_item");
+	status.imports.add("ListItem");
+	b.append("");
+	b.append(`
+	/* @for */
+	let ${forRangeName} = t_range();
+	t_run_list(
+	${forRangeName},
+	${forParentName},
+	${forAnchorName},
+	function createNewItems() {
+		let t_new_items: ListItem[] = [];
+		let t_previous_item = ${forRangeName};
+		let t_next_item = ${forRangeName}.nextRange;`);
+	addMappedText("", `${node.statement}`, " {", node.range, status, b);
+	b.append(`
+			let t_new_item = t_list_item({ ${forVarNames.join(",\n")} }${keyStatement ? `, ${keyStatement}` : ""});
+			t_new_item.previousRange = t_previous_item;
+			t_previous_item.nextRange = t_new_item;
+			t_previous_item = t_new_item;
+			t_new_items.push(t_new_item);
+		}
+		${forRangeName}.nextRange = t_next_item;
+		return t_new_items;
+	},
+	function createListItem(t_item, t_before) {`);
+	status.forVarNames = forVarNames;
+	buildForItem(node, status, b, forParentName);
+	status.forVarNames = [];
+	b.append(`},
+	function updateListItem(t_old_item, t_new_item) {`);
+	for (let varName of forVarNames) b.append(`t_old_item.data.${varName} = t_new_item.data.${varName};`);
+	b.append(`}
+		);`);
+	b.append("");
+}
+function buildForItem(node, status, b, parentName) {
+	const oldRangeName = nextVarName("old_range", status);
+	status.imports.add("t_push_range");
+	b.append(`let ${oldRangeName} = t_push_range(t_item);`);
+	buildFragment(node, status, b, parentName, "t_before");
+	status.fragmentStack.push({
+		fragment: node.fragment,
+		path: ""
+	});
+	for (let child of node.children) {
+		if (isControlNode(child) && child.operation === "@key") continue;
+		buildNode(child, status, b, parentName, "t_before");
+	}
+	status.fragmentStack.pop();
+	buildAddFragment(node, status, b, parentName, "t_before");
+	status.imports.add("t_pop_range");
+	b.append(`t_pop_range(${oldRangeName});`);
+}
+
+//#endregion
+//#region src/compile/build/client/buildHtmlNode.ts
+function buildHtmlNode(node, status, b) {
+	const htmlAnchorName = node.varName;
+	const htmlParentName = node.parentName || htmlAnchorName + ".parentNode";
+	const htmlRangeName = nextVarName("html_range", status);
+	node = node.children[0];
+	status.imports.add("t_range");
+	status.imports.add("t_run_control");
+	b.append("");
+	b.append(`
+	/* @html */
+	const ${htmlRangeName} = t_range();
+	t_run_control(${htmlRangeName}, ${htmlAnchorName}, (t_before) => {`);
+	buildHtmlBranch(node, status, b, htmlParentName, htmlRangeName);
+	b.append("});");
+	b.append("");
+}
+function buildHtmlBranch(node, status, b, parentName, rangeName) {
+	status.imports.add("t_run_branch");
+	b.append(`${node.statement};`);
+	b.append(`t_run_branch(${rangeName}, () => {`);
+	const templateName = nextVarName("template", status);
+	const fragmentName = `t_fragment_${node.fragment.number}`;
+	b.append(`const ${templateName} = document.createElement("template");`);
+	b.append(`${templateName}.innerHTML = ${node.statement};`);
+	b.append(`let ${fragmentName} = ${templateName}.content.cloneNode(true) as DocumentFragment;`);
+	buildAddFragment(node, status, b, parentName, "t_before");
+	b.append(`});`);
+}
+
+//#endregion
+//#region src/compile/build/client/buildIfNode.ts
+function buildIfNode(node, status, b) {
+	const anchorName = node.varName;
+	const parentName = node.parentName || anchorName + ".parentNode";
+	const rangeName = nextVarName("if_range", status);
+	const stateName = "$" + nextVarName("if_state", status);
+	const branches = node.children.filter((n) => isControlNode(n));
+	if (branches.findIndex((n) => n.operation === "@else") === -1) branches.push({
+		type: "control",
+		operation: "@else",
+		statement: "else",
+		children: [],
+		range: {
+			start: 0,
+			end: 0
+		}
+	});
+	status.imports.add("$watch");
+	status.imports.add("$run");
+	status.imports.add("t_range");
+	status.imports.add("t_run_control");
+	status.imports.add("t_run_branch");
+	b.append("");
+	b.append(`
+		/* @if */
+		const ${rangeName} = t_range();
+		let ${stateName} = $watch({ creator: (_: Node | null) => {} });`);
+	b.append(`$run(function runIf() {`);
+	for (let branch of branches) buildIfBranch(branch, status, b, parentName, stateName);
+	b.append(`});`);
+	b.append(`
+		t_run_control(${rangeName}, ${anchorName}, (t_before) => {
+			t_run_branch(${rangeName}, () => ${stateName}.creator(t_before));
+		});`);
+	b.append("");
+}
+function buildIfBranch(node, status, b, parentName, stateName) {
+	addMappedText("", `${replaceForVarNames(node.statement, status)}`, " {", node.range, status, b);
+	if (node.children.length > 0) {
+		b.append(`${stateName}.creator = (t_before) => {`);
+		buildFragment(node, status, b, parentName, "t_before");
+		status.fragmentStack.push({
+			fragment: node.fragment,
+			path: ""
+		});
+		for (let child of node.children) buildNode(child, status, b, parentName, "t_before");
+		status.fragmentStack.pop();
+		buildAddFragment(node, status, b, parentName, "t_before");
+		b.append("};");
+	} else b.append(`${stateName}.creator = (_) => {};`);
+	b.append("}");
+}
+
+//#endregion
+//#region src/compile/build/client/buildReplaceNode.ts
+function buildReplaceNode(node, status, b) {
+	const replaceAnchorName = node.varName;
+	const replaceParentName = node.parentName || replaceAnchorName + ".parentNode";
+	const replaceRangeName = nextVarName("replace_range", status);
+	node = node.children[0];
+	status.imports.add("t_range");
+	status.imports.add("t_run_control");
+	b.append("");
+	b.append(`
+	/* @replace */
+	const ${replaceRangeName} = t_range();
+	t_run_control(${replaceRangeName}, ${replaceAnchorName}, (t_before) => {`);
+	buildReplaceBranch(node, status, b, replaceParentName, replaceRangeName);
+	b.append("});");
+	b.append("");
+}
+function buildReplaceBranch(node, status, b, parentName, rangeName) {
+	status.imports.add("t_run_branch");
+	b.append(`${replaceForVarNames(node.statement, status)};`);
+	b.append(`t_run_branch(${rangeName}, () => {`);
+	buildFragment(node, status, b, parentName, "t_before");
+	status.fragmentStack.push({
+		fragment: node.fragment,
+		path: ""
+	});
+	for (let child of node.children) buildNode(child, status, b, parentName, "t_before");
+	status.fragmentStack.pop();
+	buildAddFragment(node, status, b, parentName, "t_before");
+	b.append(`});`);
+}
+
+//#endregion
+//#region src/compile/build/client/buildScriptNode.ts
+function buildScriptNode(node, status, b) {
+	b.append(`/* ${node.operation} */`);
+	addMappedText("", `${maybeAppend$1(node.statement, ";")}`, "", node.range, status, b);
+}
+function maybeAppend$1(text, end) {
+	if (!text.endsWith(end)) text += end;
+	return text;
+}
+
+//#endregion
+//#region src/compile/build/client/buildSwitchNode.ts
+function buildSwitchNode(node, status, b) {
+	const anchorName = node.varName;
+	const parentName = node.parentName;
+	const rangeName = nextVarName("switch_range", status);
+	const stateName = "$" + nextVarName("switch_state", status);
+	const branches = node.children.filter((n) => isControlNode(n));
+	if (branches.findIndex((n) => n.operation === "@default") === -1) branches.push({
+		type: "control",
+		operation: "@default",
+		statement: "default",
+		children: [],
+		range: {
+			start: 0,
+			end: 0
+		}
+	});
+	status.imports.add("$watch");
+	status.imports.add("$run");
+	status.imports.add("t_range");
+	status.imports.add("t_run_control");
+	status.imports.add("t_run_branch");
+	b.append("");
+	b.append(`
+		/* @switch */
+		const ${rangeName} = t_range();
+		let ${stateName} = $watch({ creator: (_: Node | null) => {} });`);
+	b.append(`
+		$run(function runSwitch() {`);
+	addMappedText("", `${replaceForVarNames(node.statement, status)}`, " {", node.range, status, b);
+	for (let branch of branches) buildSwitchBranch(branch, status, b, parentName, stateName);
+	b.append(`
+		}
+	});`);
+	b.append(`
+		t_run_control(${rangeName}, ${anchorName}, (t_before) => {
+			t_run_branch(${rangeName}, () => ${stateName}.creator(t_before));
+		});`);
+	b.append("");
+}
+function buildSwitchBranch(node, status, b, parentName, stateName) {
+	addMappedText("", `${replaceForVarNames(node.statement, status)}`, " {", node.range, status, b);
+	if (node.children.length > 0) {
+		b.append(`${stateName}.creator = (t_before) => {`);
+		buildFragment(node, status, b, parentName, "t_before");
+		status.fragmentStack.push({
+			fragment: node.fragment,
+			path: ""
+		});
+		for (let child of node.children) buildNode(child, status, b, parentName, "t_before");
+		status.fragmentStack.pop();
+		buildAddFragment(node, status, b, parentName, "t_before");
+		b.append("};");
+	} else b.append(`${stateName}.creator = (_) => {};`);
+	b.append(`
+			break;
+		}`);
+}
+
+//#endregion
+//#region src/compile/build/client/buildControlNode.ts
+function buildControlNode(node, status, b) {
+	switch (node.operation) {
+		case "@if group":
+			buildIfNode(node, status, b);
+			break;
+		case "@if":
+		case "@else if":
+		case "@else": break;
+		case "@switch group":
+			buildSwitchNode(node, status, b);
+			break;
+		case "@case":
+		case "@default": break;
+		case "@for group":
+			buildForNode(node, status, b);
+			break;
+		case "@for":
+		case "@key": break;
+		case "@await group":
+			buildAwaitNode(node, status, b);
+			break;
+		case "@await":
+		case "@then":
+		case "@catch": break;
+		case "@replace group":
+			buildReplaceNode(node, status, b);
+			break;
+		case "@replace": break;
+		case "@html group":
+			buildHtmlNode(node, status, b);
+			break;
+		case "@html": break;
+		case "@const":
+		case "@console":
+		case "@debugger":
+			buildScriptNode(node, status, b);
+			break;
+		case "@function":
+		case "@async function":
+			b.append("");
+			buildScriptNode(node, status, b);
+			b.append("");
+			break;
+		default: throw new Error(`Invalid operation: ${node.operation}`);
+	}
+}
+
+//#endregion
+//#region src/compile/build/client/buildMount.ts
+function buildMount(functionName, functionBody, status, b) {
+	functionBody = replaceForVarNames(functionBody, status);
+	status.imports.add("$mount");
+	b.append(`$mount(function ${functionName}() {`);
+	b.append(functionBody);
+	b.append("});");
+}
+
+//#endregion
+//#region src/compile/build/client/stashRun.ts
+function stashRun(fragment, functionStart, value, functionEnd, range, status) {
+	value = replaceForVarNames(value, status);
+	let functionBody = functionStart + value + functionEnd;
+	fragment.effects.push({
+		functionBody,
+		ranges: [range],
+		offsets: [functionStart.length],
+		lengths: [value.length]
+	});
+}
+
+//#endregion
+//#region src/compile/build/client/buildElementNode.ts
+function buildElementNode(node, status, b, parentName, root = false) {
+	if (status.inHead) {
+		if (node.tagName === "title") buildTitleNode(node, status, b);
+		else buildHeadNode(node, status, b);
+		return;
+	}
+	const svgElement = node.tagName === "svg";
+	const oldns = status.ns;
+	if (svgElement) status.ns = true;
+	const varName = node.varName;
+	if (varName) {
+		if (node.tagName === "@element") buildDynamicElementNode(node, status, b);
+		if (root) {}
+		buildElementAttributes$1(node, varName, status, b);
+	}
+	const oldPreserveWhitespace = status.preserveWhitespace;
+	status.preserveWhitespace = node.tagName === "code" || node.tagName === "pre";
+	for (let child of node.children) buildNode(child, status, b, parentName, "null");
+	status.preserveWhitespace = oldPreserveWhitespace;
+	if (svgElement) status.ns = oldns;
+}
+function buildDynamicElementNode(node, status, b) {
+	let selfAttribute = node.attributes.find((a) => a.name === "self");
+	if (selfAttribute && selfAttribute.value && selfAttribute.fullyReactive) {
+		status.imports.add("$run");
+		status.imports.add("t_dynamic");
+		let selfValue = selfAttribute.value;
+		b.append(`$run(function setDynamic() {`);
+		b.append(`${node.varName} = t_dynamic(${node.varName}, ${selfValue});`);
+		let parentName = node.varName;
+		buildFragment(node, status, b, parentName, "null");
+		status.fragmentStack.push({
+			fragment: node.fragment,
+			path: ""
+		});
+		for (let child of node.children) buildNode(child, status, b, parentName, "null");
+		status.fragmentStack.pop();
+		buildAddFragment(node, status, b, parentName, "null");
+		b.append(`});`);
+	}
+}
+function buildTitleNode(node, status, b) {
+	let content = node.children[0].content || "";
+	content = content.replace(/\s+/g, " ");
+	let reactiveStarted = false;
+	let reactiveCount = 0;
+	for (let i = 0; i < content.length; i++) if (content[i] === "{") reactiveStarted = true;
+	else if (content[i] === "}") {
+		if (reactiveStarted) {
+			reactiveCount += 1;
+			reactiveStarted = false;
+		}
+	}
+	if (reactiveCount) {
+		status.imports.add("t_fmt");
+		if (reactiveCount === 1 && content.startsWith("{") && content.endsWith("}")) content = `t_fmt(${content.substring(1, content.length - 1)})`;
+		else content = `\`${content.replaceAll("{", "${t_fmt(").replaceAll("}", ")}")}\``;
+	} else content = `"${content}"`;
+	status.imports.add("$run");
+	b.append(`
+		$run(function runTitle() {
+			const t_old_title = document.title;
+			document.title = ${content};
+			return () => document.title = t_old_title;
+		});`);
+}
+function buildHeadNode(node, status, b) {
+	status.imports.add("$run");
+	b.append(`
+		$run(function runHead() {
+			const t_headel = document.createElement("${node.tagName}");
+			document.getElementsByTagName("head")[0].appendChild(t_headel);`);
+	for (let { name, value } of node.attributes) if (value != null) {
+		status.imports.add("t_attribute");
+		b.append(`t_attribute(t_headel, "${name}", ${value});`);
+	}
+	b.append(`
+		});`);
+}
+function buildElementAttributes$1(node, varName, status, b) {
+	let fragment = status.fragmentStack.at(-1)?.fragment;
+	if (!fragment) throw new Error("No fragment on stack");
+	const refAttribute = node.attributes.find((a) => a.name === "&ref");
+	if (refAttribute) {
+		let { value, fullyReactive } = refAttribute;
+		if (value != null && fullyReactive) b.append(`${value} = ${varName};`);
+	}
+	for (let { name, value, reactive, range } of node.attributes) if (name === "self" && node.tagName === "@element") {} else if (name === "&ref") {} else if (value != null && reactive) if (name === "&group") buildBindGroupAttribute(node, varName, value, status, b);
+	else if (name === "&value" || name === "&checked") buildBindAttribute(node, varName, name, value, status, b);
+	else if (name === "onmount") buildMount("elMount", `return (${trimEnd(value.trim(), ";")})(${varName});`, status, b);
+	else if (name.startsWith("on")) buildEventAttribute(varName, name, value, range, status, b);
+	else if (name.startsWith("transition")) buildTransitionAttribute(node, varName, name, value, status, b);
+	else if (name === "class") {
+		status.imports.add("t_class");
+		const params = [value];
+		if (node.scopeStyles) params.push(`"torp-${status.styleHash}"`);
+		const propName = status.ns ? "className.baseVal" : "className";
+		stashRun(fragment, `${varName}.${propName} = t_class(`, params.join(", "), ");", range, status);
+	} else if (name === "style") {
+		status.imports.add("t_style");
+		stashRun(fragment, `${varName}.setAttribute("style", t_style(`, value, "));", range, status);
+	} else if (name.includes("-")) {
+		status.imports.add("t_attribute");
+		stashRun(fragment, `t_attribute(${varName}, "${name}", `, value, ");", range, status);
+	} else {
+		status.imports.add("t_attribute");
+		stashRun(fragment, `t_attribute(${varName}, "${name}", `, value, ");", range, status);
+	}
+}
+function buildBindGroupAttribute(node, varName, value, status, b) {
+	value = replaceForVarNames(value, status);
+	let eventName = "change";
+	let inputValue = node.attributes.find((a) => a.name === "value")?.value;
+	let set = `${value} == ${inputValue}`;
+	let propName = "checked";
+	const setAttribute = `${varName}.${propName} = ${set}`;
+	buildRun("setBinding", `${setAttribute};`, status, b);
+	status.imports.add("t_event");
+	b.append(`t_event(${varName}, "${eventName}", (e) => {
+			if (e.target.${propName}) ${value} = ${inputValue};
+		});`);
+}
+function buildBindAttribute(node, varName, name, value, status, b) {
+	value = replaceForVarNames(value, status);
+	let eventName = "input";
+	let defaultValue = "\"\"";
+	let inputValue = "e.target.value";
+	if (node.tagName === "input") {
+		let typeAttribute = node.attributes.find((a) => a.name === "type");
+		if (typeAttribute && typeAttribute.value) switch (trimQuotes(typeAttribute.value)) {
+			case "number":
+				defaultValue = "0";
+				inputValue = "Number(e.target.value)";
+				break;
+			case "checkbox":
+				defaultValue = "false";
+				inputValue = "e.target.checked";
+				break;
+			case "radio":
+				eventName = "change";
+				inputValue = "e.target.value";
+				break;
+		}
+	} else if (node.tagName === "select") eventName = "change";
+	let set = `${value} || ${defaultValue}`;
+	const propName = name.substring(1);
+	const setAttribute = `${varName}.${propName} = ${set}`;
+	buildRun("setBinding", `${setAttribute};`, status, b);
+	status.imports.add("t_event");
+	b.append(`t_event(${varName}, "${eventName}", (e) => ${value} = ${inputValue});`);
+}
+function buildEventAttribute(varName, name, value, range, status, b) {
+	value = replaceForVarNames(value, status);
+	const eventName = name.substring(2);
+	status.imports.add("t_event");
+	addMappedText(`t_event(${varName}, "${eventName}", `, value, `);`, range, status, b);
+}
+function buildTransitionAttribute(node, varName, name, value, status, b) {
+	value = replaceForVarNames(value, status);
+	status.imports.add("t_animate");
+	let entryVarName = nextVarName("trans_in", status);
+	let exitVarName = nextVarName("trans_out", status);
+	if (name === "transition") {
+		b.append(`const ${entryVarName} = ${getAnimationDetails(value)};`);
+		b.append(`const ${exitVarName} = ${entryVarName};`);
+		b.append(`t_animate(${varName}, ${entryVarName}, ${exitVarName});`);
+	} else if (name === "transition-in") {
+		let outAttribute = node.attributes.find((a) => a.name === "transition-out");
+		if (outAttribute && outAttribute.value && outAttribute.fullyReactive) {
+			let outValue = outAttribute.value;
+			b.append(`const ${entryVarName} = ${getAnimationDetails(value)};`);
+			b.append(`const ${exitVarName} = ${getAnimationDetails(outValue)};`);
+			b.append(`t_animate(${varName}, ${entryVarName}, ${exitVarName});`);
+		} else {
+			b.append(`const ${entryVarName} = ${getAnimationDetails(value)};`);
+			b.append(`t_animate(${varName}, ${entryVarName});`);
+		}
+	} else if (name === "transition-out") if (node.attributes.find((a) => a.name === "transition-in")) return;
+	else {
+		b.append(`const ${exitVarName} = ${getAnimationDetails(value)};`);
+		b.append(`t_animate(${varName}, null, ${entryVarName});`);
+	}
+}
+function getAnimationDetails(value) {
+	let parts = [];
+	let start = 0;
+	let squareCount = 0;
+	let curlyCount = 0;
+	for (let i = 0; i < value.length; i++) switch (value[i]) {
+		case ",":
+			if (squareCount === 0 && curlyCount === 0) {
+				parts.push(value.substring(start, i));
+				start = i + 1;
+			}
+			break;
+		case "[":
+			squareCount += 1;
+			break;
+		case "]":
+			squareCount -= 1;
+			break;
+		case "{":
+			curlyCount += 1;
+			break;
+		case "}":
+			curlyCount -= 1;
+			break;
+	}
+	parts.push(value.substring(start));
+	let keyframes = parts[0]?.trim();
+	let options = parts[1]?.trim();
+	return `{ ${[`keyframes: ${keyframes}`, options ? `options: ${options}` : null].filter(Boolean).join(", ")} }`;
+}
+
+//#endregion
+//#region src/compile/build/client/buildRootNode.ts
+function buildRootNode(node, status, b, parentName, anchorName) {
+	buildFragment(node, status, b, parentName, anchorName);
+	status.fragmentStack.push({
+		fragment: node.fragment,
+		path: "0:ch/"
+	});
+	for (let child of node.children) buildNode(child, status, b, parentName, anchorName, true);
+	status.fragmentStack.pop();
+	buildAddFragment(node, status, b, parentName, anchorName);
+}
+
+//#endregion
+//#region src/compile/build/client/buildSlotNode.ts
+function buildSlotNode(node, status, b) {
+	let slotName = node.attributes.find((a) => a.name === "name")?.value;
+	slotName = slotName ? trimQuotes(slotName) : "_";
+	const propsName = nextVarName("sprops", status);
+	const slotAttributes = node.attributes.filter((a) => a.name !== "name");
+	const slotHasProps = slotAttributes.length;
+	if (slotHasProps) {
+		status.imports.add("$watch");
+		b.append(`const ${propsName} = $watch({});`);
+		for (let { name, value, reactive } of slotAttributes) if (value != null) {
+			const setProp = `${propsName}["${name}"] = ${value}`;
+			if (reactive) buildRun("setProp", `${setProp};`, status, b);
+			else b.append(`${setProp};`);
+		} else b.append(`${propsName}["${name}"] = true;`);
+	}
+	const slotParentName = node.parentName;
+	const slotAnchorName = node.varName;
+	b.append(`if ($slots && $slots["${slotName}"]) {`);
+	let params = [
+		slotParentName,
+		slotAnchorName,
+		slotHasProps ? propsName : "undefined",
+		"$context"
+	];
+	b.append(`$slots["${slotName}"](${params.join(", ")})`);
+	const fill = node.children.find((c) => isSpecialNode(c) && c.tagName === "fill");
+	if (fill && isSpecialNode(fill) && fill.children.length) {
+		b.append(`} else {`);
+		buildFragment(fill, status, b, slotParentName, slotAnchorName);
+		status.fragmentStack.push({
+			fragment: fill.fragment,
+			path: "0:ch/"
+		});
+		for (let child of fill.children) buildNode(child, status, b, slotParentName, slotAnchorName);
+		status.fragmentStack.pop();
+		buildAddFragment(fill, status, b, slotParentName, slotAnchorName);
+	}
+	b.append(`}`);
+}
+
+//#endregion
+//#region src/compile/build/client/buildSpecialNode.ts
+function buildSpecialNode(node, status, b, parentName, root = false) {
+	switch (node.tagName) {
+		case "slot":
+			buildSlotNode(node, status, b);
+			break;
+		case "fill": break;
+		case "@element":
+			buildElementNode(node, status, b, parentName, root);
+			break;
+		case "@component":
+			buildComponentNode(node, status, b, root);
+			break;
+		default: throw new Error(`Invalid special node: ${node.tagName}`);
+	}
+	return "";
+}
+
+//#endregion
+//#region src/compile/utils/endOfString.ts
+function endOfString(char, content, start) {
+	for (let j = start + 1; j < content.length; j++) if (content[j] === char && content[j - 1] !== "\\") return j;
+	return content.length;
+}
+
+//#endregion
+//#region src/compile/build/client/stashRunWithOffsets.ts
+function stashRunWithOffsets(fragment, functionBody, ranges, offsets, lengths, status) {
+	for (let i = 0; i < offsets.length; i++) {
+		const oldLength = functionBody.length;
+		functionBody = functionBody.substring(0, offsets[i]) + replaceForVarNames(functionBody.substring(offsets[i], offsets[i] + lengths[i]), status) + functionBody.substring(offsets[i] + lengths[i]);
+		const changedLength = functionBody.length - oldLength;
+		lengths[i] += changedLength;
+		for (let j = i + 1; j < offsets.length; j++) offsets[j] += changedLength;
+	}
+	fragment.effects.push({
+		functionBody,
+		ranges,
+		offsets,
+		lengths
+	});
+}
+
+//#endregion
+//#region src/compile/build/client/buildTextNode.ts
+function buildTextNode(node, status) {
+	let fragment = status.fragmentStack.at(-1)?.fragment;
+	if (!fragment) return;
+	let content = node.content || "";
+	if (!status.preserveWhitespace) content = content.replaceAll(/\s+/g, " ");
+	let textContent = "";
+	let reactiveCount = 0;
+	let reactiveStart = 0;
+	let offsets = [];
+	let lengths = [];
+	let level = 0;
+	let maxLevel = 0;
+	for (let i = 0; i < content.length; i++) {
+		const char = content[i];
+		const nextChar = content[i + 1];
+		if (char === "{") {
+			level++;
+			maxLevel = Math.max(level, maxLevel);
+			if (level === 1) {
+				reactiveCount += 1;
+				textContent += "${t_fmt(";
+				reactiveStart = textContent.length;
+				offsets.push(reactiveStart);
+				continue;
+			}
+		} else if (char === "}") {
+			level--;
+			if (level === 0) {
+				lengths.push(textContent.length - reactiveStart);
+				textContent += ")";
+			}
+		} else if (char === "`" && level === 0) textContent += "\\";
+		else if (level > 0) {
+			if (char === "/" && nextChar === "/") {
+				let start = i;
+				i = content.indexOf("\n", i);
+				textContent += content.substring(start, i + 1);
+				continue;
+			} else if (char === "/" && nextChar === "*") {
+				let start = i;
+				i = content.indexOf("*/", i) + 1;
+				textContent += content.substring(start, i + 1);
+				continue;
+			} else if (char === "\"" || char === "'") {
+				let start = i;
+				i = endOfString(char, content, i);
+				textContent += content.substring(start, i + 1);
+				continue;
+			} else if (char === "`") {
+				let start = i;
+				i = endOfTemplateString(content, i);
+				textContent += content.substring(start, i + 1);
+				continue;
+			}
+		}
+		textContent += content[i];
+	}
+	if (maxLevel) {
+		let offsetChange = 0;
+		if (reactiveCount === 1 && content.startsWith("{") && content.endsWith("}")) {
+			textContent = textContent.substring(2, textContent.length - 1);
+			offsetChange = -2;
+		} else {
+			textContent = `\`${textContent}\``;
+			offsetChange = 1;
+		}
+		status.imports.add("t_fmt");
+		let functionBody = `${node.varName}.textContent = `;
+		offsetChange += functionBody.length;
+		offsets.map((_, i) => offsets[i] += offsetChange);
+		functionBody += `${textContent};`;
+		stashRunWithOffsets(fragment, functionBody, node.ranges, offsets, lengths, status);
+	}
+}
+
+//#endregion
+//#region src/compile/build/client/buildNode.ts
+function buildNode(node, status, b, parentName, anchorName, root = false) {
+	if (node.handled) {
+		node.handled = false;
+		return;
+	}
+	switch (node.type) {
+		case "root":
+			buildRootNode(node, status, b, parentName, anchorName);
+			break;
+		case "control":
+			buildControlNode(node, status, b);
+			break;
+		case "component":
+			buildComponentNode(node, status, b, root);
+			break;
+		case "element":
+			buildElementNode(node, status, b, parentName, root);
+			break;
+		case "text":
+			buildTextNode(node, status);
+			break;
+		case "special":
+			buildSpecialNode(node, status, b, parentName, root);
+			break;
+		default: throw new Error(`Invalid node type: ${node.type}`);
+	}
+}
+
+//#endregion
+//#region src/compile/build/client/buildCode.ts
+const importsMap$1 = {
+	$watch: "import { $watch } from \"${folder}\";",
+	$cache: "import { $cache } from \"${folder}\";",
+	$run: "import { $run } from \"${folder}\";",
+	$mount: "import { $mount } from \"${folder}\";",
+	$unwrap: "import { $unwrap } from \"${folder}\";",
+	$peek: "import { $peek } from \"${folder}\";",
+	$batch: "import { $batch } from \"${folder}\";",
+	t_range: "import { t_range } from \"${folder}\";",
+	t_push_range: "import { t_push_range } from \"${folder}\";",
+	t_pop_range: "import { t_pop_range } from \"${folder}\";",
+	t_run_control: "import { t_run_control } from \"${folder}\";",
+	t_run_branch: "import { t_run_branch } from \"${folder}\";",
+	t_list_item: "import { t_list_item } from \"${folder}\";",
+	t_run_list: "import { t_run_list } from \"${folder}\";",
+	t_add_fragment: "import { t_add_fragment } from \"${folder}\";",
+	t_apply_props: "import { t_apply_props } from \"${folder}\";",
+	t_class: "import { t_class } from \"${folder}\";",
+	t_style: "import { t_style } from \"${folder}\";",
+	t_attribute: "import { t_attribute } from \"${folder}\";",
+	t_dynamic: "import { t_dynamic } from \"${folder}\";",
+	t_fmt: "import { t_fmt } from \"${folder}\";",
+	t_fragment: "import { t_fragment } from \"${folder}\";",
+	t_event: "import { t_event } from \"${folder}\";",
+	t_animate: "import { t_animate } from \"${folder}\";",
+	t_root: "import { t_root } from \"${folder}\";",
+	t_anchor: "import { t_anchor } from \"${folder}\";",
+	t_child: "import { t_child } from \"${folder}\";",
+	t_next: "import { t_next } from \"${folder}\";",
+	t_skip: "import { t_skip } from \"${folder}\";",
+	t_frg: "import { t_frg } from \"${folder}\";",
+	t_elm: "import { t_elm } from \"${folder}\";",
+	t_txt: "import { t_txt } from \"${folder}\";",
+	t_cmt: "import { t_cmt } from \"${folder}\";",
+	t_print: "import { t_print } from \"${folder}\";",
+	ListItem: "import { type ListItem } from \"${folder}\";",
+	SlotRender: "import { type SlotRender } from \"${folder}\";"
+};
+function buildCode(template, map, options) {
+	let b = new Builder(options?.mapped);
+	let imports = /* @__PURE__ */ new Set();
+	imports.add("SlotRender");
+	buildTemplate(template, map, imports, b, options);
+	let startSize = b.toString().length;
+	if (imports.size) {
+		b.prepend("");
+		for (let imp of Array.from(imports).sort().reverse()) {
+			imp = importsMap$1[imp] || imp;
+			b.prepend(imp.replace("${folder}", options?.renderFolder || "@torpor/view"));
+		}
+	}
+	if (options?.mapped) {
+		let diff = b.toString().length - startSize + 1;
+		for (let m of map) {
+			m.compiled.start += diff;
+			m.compiled.end += diff;
+		}
+	}
+	return b.toString();
+}
+function buildTemplate(template, map, imports, b, options) {
+	let script = template.script.map((s) => s.script).join("\n");
+	if (/\$watch\b/.test(script)) imports.add("$watch");
+	if (/\$cache\b/.test(script)) imports.add("$cache");
+	if (/\$run\b/.test(script)) imports.add("$run");
+	if (/\$mount\b/.test(script)) imports.add("$mount");
+	if (/\$unwrap\b/.test(script)) imports.add("$unwrap");
+	if (/\$peek\b/.test(script)) imports.add("$peek");
+	if (/\$batch\b/.test(script)) imports.add("$batch");
+	let currentIndex = 0;
+	let current = template.components[0];
+	for (let chunk of template.script) if (chunk.script === "/* @params */") {
+		let params = [
+			`${current.markup ? "$parent" : "_$parent"}: ParentNode`,
+			`${current.markup ? "$anchor" : "_$anchor"}: Node | null`,
+			current.params ?? `${current.props?.length ? "$props:  Record<PropertyKey, any>" : "_$props:  Record<PropertyKey, any> | undefined"}`,
+			`${current.contextProps?.length || current.needsContext ? "$context" : "_$context"}: Record<PropertyKey, any>`,
+			`${current.slotProps?.length ? "$slots" : "_$slots"}?: Record<string, SlotRender>`
+		];
+		b.append(params.join(",\n"));
+	} else if (chunk.script === ") /* @return_type */ {") b.append("): void {");
+	else if (chunk.script === "/* @start */") {
+		if (current.contextProps?.length) b.append(`$context = Object.assign({}, $context);`);
+		b.append("");
+	} else if (chunk.script === "/* @render */") {
+		if (current.markup) {
+			let status = makeStatus(imports, map, current, options);
+			b.append("");
+			b.append("/* User interface */");
+			buildFragmentText(current.markup, status, b);
+			b.append("");
+			buildNode(current.markup, status, b, "$parent", "$anchor", true);
+		}
+	} else if (chunk.script === "/* @head */") {
+		if (current.head) {
+			let status = makeStatus(imports, map, current, options);
+			b.append("");
+			b.append("/* Head */");
+			status.inHead = true;
+			buildNode(current.head, status, b, "$parent", "$anchor", true);
+			status.inHead = false;
+		}
+	} else if (chunk.script === "/* @style */") {} else if (chunk.script === "/* @end */") {
+		currentIndex += 1;
+		current = template.components[currentIndex];
+	} else {
+		let status = makeStatus(imports, map, current, options);
+		addMappedText("", chunk.script, "", chunk.range, status, b);
+	}
+}
+function makeStatus(imports, map, current, options) {
+	return {
+		imports,
+		props: current?.props ?? [],
+		contextProps: current?.contextProps ?? [],
+		slotProps: current?.slotProps ?? [],
+		styleHash: current?.style?.hash ?? "",
+		map,
+		varNames: {},
+		fragmentStack: [],
+		forVarNames: [],
+		ns: false,
+		preserveWhitespace: false,
+		options
+	};
+}
+
+//#endregion
+//#region src/compile/build/client/buildStyles.ts
+function buildStyles(style, styleHash) {
+	const b = new Builder();
+	for (let block of style.blocks) buildStyleBlock(block, b, styleHash);
+	return b.toString();
+}
+function buildStyleBlock(block, b, styleHash) {
+	if (block.selector.startsWith("@")) b.append(`${block.selector} {`);
+	else {
+		block.selector = block.selector.replaceAll(/\s+/g, " ");
+		let selectors = [];
+		let global = false;
+		let start = 0;
+		for (let i = 0; i <= block.selector.length; i++) if (block.selector.substring(i).startsWith(":global(")) {
+			i += 7;
+			start = i + 1;
+			global = true;
+		} else if (global && block.selector[i] === ")") {
+			addSelector(selectors, block.selector, styleHash, start, i, global);
+			start = i + 1;
+			global = false;
+		} else if ("*,>+~".includes(block.selector[i])) {
+			addSelector(selectors, block.selector, styleHash, start, i, global);
+			selectors.push(block.selector[i]);
+			start = i + 1;
+		} else if (i === block.selector.length) addSelector(selectors, block.selector, styleHash, start, i, global);
+		else if (block.selector[i] === " ") {
+			addSelector(selectors, block.selector, styleHash, start, i, global);
+			start = i + 1;
+		}
+		b.append(`${selectors.join(" ").replaceAll(" ,", ",")} {`);
+	}
+	for (let attribute of block.attributes) buildStyleAttribute(attribute, b);
+	for (let child of block.children) buildStyleBlock(child, b, styleHash);
+	b.append(`}`);
+}
+function addSelector(selectors, selector, styleHash, start, end, global) {
+	if (end > start) {
+		let s = selector.substring(start, end);
+		if (!global) {
+			let pre = s;
+			let post = "";
+			let colonPosition = s.indexOf(":");
+			if (colonPosition !== -1) {
+				pre = s.substring(0, colonPosition);
+				post = s.substring(colonPosition);
+			}
+			s = `${pre}.torp-${styleHash}${post}`;
+		}
+		selectors.push(s);
+	}
+}
+function buildStyleAttribute(attribute, b) {
+	b.append(`${attribute.name}: ${attribute.value};`);
+}
+
+//#endregion
+//#region src/compile/build/server/buildServerComponentNode.ts
+function buildServerComponentNode(node, status, b) {
+	status.output += HYDRATION_START_COMMENT;
+	if (status.output) {
+		b.append(`t_body += \`${status.output}\`;`);
+		status.output = "";
+	}
+	const componentHasProps = node.attributes.length;
+	const propsName = componentHasProps ? nextVarName("props", status) : "undefined";
+	if (componentHasProps) {
+		b.append(`const ${propsName}: any = {};`);
+		for (let { name, value } of node.attributes) if (name === "class" && value != null) {
+			status.imports.add("t_class");
+			const params = [value];
+			if (node.scopeStyles) params.push(`"torp-${status.styleHash}"`);
+			b.append(`${propsName}["class"] = t_class(${params.join(", ")});`);
+		} else if (name === "style" && value != null) {
+			status.imports.add("t_style");
+			b.append(`${propsName}["style"] = t_style(${value});`);
+		} else if (value != null) b.append(`${propsName}["${name}"] = ${value};`);
+		else b.append(`${propsName}["${name}"] = true;`);
+	}
+	const componentHasSlots = node.children.length;
+	const slotsName = componentHasSlots ? nextVarName("slots", status) : "undefined";
+	if (componentHasSlots) {
+		b.append(`const ${slotsName}: Record<string, ServerSlotRender> = {};`);
+		for (let slot of node.children) if (isSpecialNode(slot) && slot.tagName === "fill") {
+			const nameAttribute = slot.attributes.find((a) => a.name === "name");
+			const slotName = nameAttribute?.value ? trimQuotes(nameAttribute.value) : "_";
+			const slotParams = [`${slot.hasSlotProps ? "$sprops" : "_$sprops?"}: Record<PropertyKey, any>`, "// @ts-ignore\n$context?: Record<PropertyKey, any>"];
+			b.append(`${slotsName}["${slotName}"] = (\n${slotParams.join(",\n")}\n) => {`);
+			b.append(`let t_body = "";`);
+			for (let child of slot.children) buildServerNode(child, status, b);
+			if (status.output) {
+				b.append(`t_body += \`${status.output}\`;`);
+				status.output = "";
+			}
+			b.append("return t_body;");
+			b.append(`}`);
+		}
+	}
+	let componentName = node.tagName;
+	if (componentName === "@component") {
+		let selfAttribute = node.attributes.find((a) => a.name === "self");
+		if (selfAttribute && selfAttribute.value && selfAttribute.fullyReactive) componentName = selfAttribute.value;
+	}
+	let renderParams = `${propsName}, $context`;
+	if (slotsName !== "undefined") renderParams += `, ${slotsName}`;
+	b.append("");
+	const componentResult = nextVarName("comp", status);
+	b.append(`const ${componentResult} = ${componentName}(${renderParams});`);
+	b.append(`t_body += ${componentResult}.body;`);
+	b.append(`t_head += ${componentResult}.head;`);
+	status.output += HYDRATION_END_COMMENT;
+	status.output += ANCHOR_COMMENT;
+}
+
+//#endregion
+//#region src/compile/build/server/buildServerAwaitNode.ts
+function buildServerAwaitNode(node, status, b) {
+	status.output += HYDRATION_START_COMMENT;
+	if (status.output) {
+		b.append(`t_body += \`${status.output}\`;`);
+		status.output = "";
+	}
+	for (let branch of node.children) if (isControlNode(branch) && branch.operation === "@await") buildServerAwaitBranch(branch, status, b);
+	status.output += HYDRATION_END_COMMENT;
+	status.output += ANCHOR_COMMENT;
+}
+function buildServerAwaitBranch(node, status, b) {
+	for (let child of node.children) buildServerNode(child, status, b);
+	if (status.output) {
+		b.append(`t_body += \`${status.output}\`;`);
+		status.output = "";
+	}
+}
+
+//#endregion
+//#region src/compile/build/server/buildServerForNode.ts
+function buildServerForNode(node, status, b) {
+	status.output += HYDRATION_START_COMMENT;
+	if (status.output) {
+		b.append(`t_body += \`${status.output}\`;`);
+		status.output = "";
+	}
+	for (let branch of node.children) if (isControlNode(branch)) buildServerForBranch(branch, status, b);
+	status.output += HYDRATION_END_COMMENT;
+	status.output += ANCHOR_COMMENT;
+}
+function buildServerForBranch(node, status, b) {
+	b.append(`${node.statement} {`);
+	status.output += HYDRATION_BREAK_COMMENT;
+	for (let child of node.children) buildServerNode(child, status, b);
+	if (status.output) {
+		b.append(`t_body += \`${status.output}\`;`);
+		status.output = "";
+	}
+	b.append("}");
+}
+
+//#endregion
+//#region src/compile/build/server/buildServerHtmlNode.ts
+function buildServerHtmlNode(node, status) {
+	status.output += HYDRATION_START_COMMENT;
+	for (let branch of node.children) if (isControlNode(branch)) status.output += `\${${branch.statement}}`;
+	status.output += HYDRATION_END_COMMENT;
+	status.output += ANCHOR_COMMENT;
+}
+
+//#endregion
+//#region src/compile/build/server/buildServerIfNode.ts
+function buildServerIfNode(node, status, b) {
+	status.output += HYDRATION_START_COMMENT;
+	if (status.output) {
+		b.append(`t_body += \`${status.output}\`;`);
+		status.output = "";
+	}
+	for (let branch of node.children) if (isControlNode(branch)) buildServerIfBranch(branch, status, b);
+	status.output += HYDRATION_END_COMMENT;
+	status.output += ANCHOR_COMMENT;
+}
+function buildServerIfBranch(node, status, b) {
+	b.append(`${node.statement} {`);
+	status.output += HYDRATION_BREAK_COMMENT;
+	for (let child of node.children) buildServerNode(child, status, b);
+	if (status.output) {
+		b.append(`t_body += \`${status.output}\`;`);
+		status.output = "";
+	}
+	b.append("}");
+}
+
+//#endregion
+//#region src/compile/build/server/buildServerReplaceNode.ts
+function buildServerReplaceNode(node, status, b) {
+	status.output += HYDRATION_START_COMMENT;
+	if (status.output) {
+		b.append(`t_body += \`${status.output}\`;`);
+		status.output = "";
+	}
+	for (let branch of node.children) if (isControlNode(branch)) buildServerReplaceBranch(branch, status, b);
+	status.output += HYDRATION_END_COMMENT;
+	status.output += ANCHOR_COMMENT;
+}
+function buildServerReplaceBranch(node, status, b) {
+	b.append(`${node.statement};`);
+	for (let child of node.children) buildServerNode(child, status, b);
+	if (status.output) {
+		b.append(`t_body += \`${status.output}\`;`);
+		status.output = "";
+	}
+}
+
+//#endregion
+//#region src/compile/build/server/buildServerScriptNode.ts
+function buildServerScriptNode(node, b) {
+	b.append(`${maybeAppend(node.statement, ";")}`);
+}
+function maybeAppend(text, end) {
+	if (!text.endsWith(end)) text += end;
+	return text;
+}
+
+//#endregion
+//#region src/compile/build/server/buildServerSwitchNode.ts
+function buildServerSwitchNode(node, status, b) {
+	status.output += HYDRATION_START_COMMENT;
+	if (status.output) {
+		b.append(`t_body += \`${status.output}\`;`);
+		status.output = "";
+	}
+	b.append(`${node.statement} {`);
+	for (let branch of node.children.filter((c) => isControlNode(c))) if (isControlNode(branch)) buildServerSwitchBranch(branch, status, b);
+	b.append("}");
+	status.output += HYDRATION_END_COMMENT;
+	status.output += ANCHOR_COMMENT;
+}
+function buildServerSwitchBranch(node, status, b) {
+	b.append(`${node.statement} {`);
+	status.output += HYDRATION_BREAK_COMMENT;
+	for (let child of node.children) buildServerNode(child, status, b);
+	if (status.output) {
+		b.append(`t_body += \`${status.output}\`;`);
+		status.output = "";
+	}
+	b.append("break;");
+	b.append("}");
+}
+
+//#endregion
+//#region src/compile/build/server/buildServerControlNode.ts
+function buildServerControlNode(node, status, b) {
+	switch (node.operation) {
+		case "@if group":
+			buildServerIfNode(node, status, b);
+			break;
+		case "@if":
+		case "@else if":
+		case "@else": break;
+		case "@switch group":
+			buildServerSwitchNode(node, status, b);
+			break;
+		case "@case":
+		case "@default": break;
+		case "@for group":
+			buildServerForNode(node, status, b);
+			break;
+		case "@for":
+		case "@key": break;
+		case "@await group":
+			buildServerAwaitNode(node, status, b);
+			break;
+		case "@await":
+		case "@then":
+		case "@catch": break;
+		case "@replace group":
+			buildServerReplaceNode(node, status, b);
+			break;
+		case "@replace": break;
+		case "@html group":
+			buildServerHtmlNode(node, status);
+			break;
+		case "@html": break;
+		case "@const":
+			if (status.output) {
+				b.append(`t_body += \`${status.output}\`;`);
+				status.output = "";
+			}
+			buildServerScriptNode(node, b);
+			break;
+		case "@function":
+		case "@async function":
+			if (status.output) {
+				b.append(`t_body += \`${status.output}\`;`);
+				status.output = "";
+			}
+			b.append("");
+			buildServerScriptNode(node, b);
+			b.append("");
+			break;
+		case "@console":
+		case "@debugger": break;
+		default: throw new Error(`Invalid operation: ${node.operation}`);
+	}
+}
+
+//#endregion
+//#region src/compile/utils/voidTags.ts
+const voidTags = [
+	"area",
+	"base",
+	"br",
+	"col",
+	"embed",
+	"hr",
+	"img",
+	"input",
+	"link",
+	"meta",
+	"param",
+	"source",
+	"track",
+	"wbr"
+];
+var voidTags_default = voidTags;
+
+//#endregion
+//#region src/compile/build/server/buildServerElementNode.ts
+function buildServerElementNode(node, status, b) {
+	let attributes = buildElementAttributes(node, status);
+	if (attributes.length) attributes = " " + attributes;
+	let tagName = node.tagName;
+	if (tagName === "@element") {
+		let selfAttribute = node.attributes.find((a) => a.name === "self");
+		if (selfAttribute) tagName = `$\{${selfAttribute.value}}`;
+	}
+	status.output += `<${tagName}${attributes}>`;
+	if (!voidTags_default.includes(tagName)) {
+		const oldPreserveWhitespace = status.preserveWhitespace;
+		status.preserveWhitespace = ["pre", "code"].includes(tagName);
+		for (let child of node.children) buildServerNode(child, status, b);
+		status.preserveWhitespace = oldPreserveWhitespace;
+		status.output += `</${tagName}>`;
+	}
+}
+function buildElementAttributes(node, status) {
+	let needsClass = node.scopeStyles;
+	let attributes = [];
+	for (let { name, value, reactive, fullyReactive } of node.attributes) if (name === "self" && node.tagName === "@element") {} else if (name === "&ref") {} else if (name.startsWith("on") || name.startsWith(":on")) {} else if (name.startsWith("transition") && value) {
+		value = value.split(",")[0].trim();
+		if (value.startsWith("[")) value = value.substring(1);
+		else value = value + "[0]";
+		attributes.push(`style="\${Object.entries(${value}).map(([k, v]) => \`$\{k}: $\{v}\`).join("; ")}"`);
+	} else if (value != null && fullyReactive) if (name === "&value" || name === "&checked" || name === "&group") {
+		let defaultValue = "";
+		let typeAttribute = node.attributes.find((a) => a.name === "type");
+		if (typeAttribute && typeAttribute.value) switch (trimQuotes(typeAttribute.value)) {
+			case "number":
+				defaultValue = "0";
+				break;
+			case "checkbox":
+				defaultValue = "false";
+				break;
+		}
+		if (!defaultValue) {
+			status.imports.add("t_attr");
+			value = `t_attr(${value})`;
+			defaultValue = "\"\"";
+		}
+		let valueOrDefault = `${value} || ${defaultValue}`;
+		const propName = name.substring(1);
+		attributes.push(`${propName}="\${${valueOrDefault}}"`);
+	} else if (name === "class") {
+		status.imports.add("t_class");
+		let params = [value];
+		if (node.scopeStyles) {
+			params.push(`"torp-${status.styleHash}"`);
+			needsClass = false;
+		}
+		attributes.push(`class="\${t_class(${params.join(", ")})}"`);
+	} else if (name === "style") {
+		status.imports.add("t_style");
+		attributes.push(`style="\${t_style(${value})}"`);
+	} else {
+		status.imports.add("t_attr");
+		attributes.push(`\${${value} ? \`${name}="\${t_attr(${value})}"\` : ''}`);
+	}
+	else if (value != null && reactive) {
+		status.imports.add("t_attr");
+		attributes.push(`${name}="${trimQuotes(value).replaceAll("${", "${t_attr(").replaceAll("}", ")}")}"`);
+	} else if (name === "class" && node.scopeStyles) {
+		value = value ? `"${trimQuotes(value)} torp-${status.styleHash}"` : `"torp-${status.styleHash}"`;
+		attributes.push(`${name}="${trimQuotes(value).replaceAll("\"", "&quot;")}"`);
+		needsClass = false;
+	} else if (value != null) attributes.push(`${name}="${trimQuotes(value).replaceAll("\"", "&quot;")}"`);
+	else attributes.push(`${name}`);
+	if (needsClass) attributes.push(`class="torp-${status.styleHash}"`);
+	return attributes.join(" ");
+}
+
+//#endregion
+//#region src/compile/build/server/buildServerRootNode.ts
+function buildServerRootNode(node, status, b) {
+	for (let child of node.children) buildServerNode(child, status, b);
+}
+
+//#endregion
+//#region src/compile/build/server/buildServerSlotNode.ts
+function buildServerSlotNode(node, status, b) {
+	status.output += HYDRATION_START_COMMENT;
+	if (status.output) {
+		b.append(`t_body += \`${status.output}\`;`);
+		status.output = "";
+	}
+	let slotName = node.attributes.find((a) => a.name === "name")?.value;
+	slotName = slotName ? trimQuotes(slotName) : "_";
+	const propsName = nextVarName("sprops", status);
+	const slotAttributes = node.attributes.filter((a) => a.name !== "name");
+	const slotHasProps = slotAttributes.length;
+	if (slotHasProps) {
+		b.append(`const ${propsName}: any = {};`);
+		for (let { name, value } of slotAttributes) if (value != null) b.append(`${propsName}["${name}"] = ${value};`);
+		else b.append(`${propsName}["${name}"] = true;`);
+	}
+	b.append(`if ($slots && $slots["${slotName}"]) {`);
+	b.append(`t_body += $slots["${slotName}"](${slotHasProps ? propsName : "undefined"}, $context);`);
+	const fill = node.children.find((c) => isSpecialNode(c) && c.tagName === "fill");
+	if (fill && isSpecialNode(fill) && fill.children.length) {
+		b.append(`} else {`);
+		for (let child of fill.children) buildServerNode(child, status, b);
+		if (status.output) {
+			b.append(`t_body += \`${status.output}\`;`);
+			status.output = "";
+		}
+	}
+	b.append(`}`);
+	status.output += HYDRATION_END_COMMENT;
+	status.output += ANCHOR_COMMENT;
+}
+
+//#endregion
+//#region src/compile/build/server/buildServerSpecialNode.ts
+function buildServerSpecialNode(node, status, b) {
+	switch (node.tagName) {
+		case "slot":
+			buildServerSlotNode(node, status, b);
+			break;
+		case "fill": break;
+		case "@element":
+			buildServerElementNode(node, status, b);
+			break;
+		case "@component":
+			buildServerComponentNode(node, status, b);
+			break;
+		default: throw new Error(`Invalid special node: ${node.tagName}`);
+	}
+}
+
+//#endregion
+//#region src/compile/build/server/buildServerTextNode.ts
+function buildServerTextNode(node, status) {
+	let content = node.content || "";
+	if (!status.preserveWhitespace) content = content.replaceAll(/\s+/g, " ");
+	let level = 0;
+	for (let i = 0; i < content.length; i++) {
+		const char = content[i];
+		const nextChar = content[i + 1];
+		if (char === "{") {
+			level++;
+			if (level === 1) {
+				status.imports.add("t_fmt");
+				status.output += "${t_fmt(";
+				continue;
+			}
+		} else if (char === "}") {
+			level--;
+			if (level === 0) status.output += ")";
+		} else if (char === "`" && level === 0) status.output += "\\";
+		else if (level > 0) {
+			if (char === "/" && nextChar === "/") {
+				let start = i;
+				i = content.indexOf("\n", i);
+				status.output += escapeHtml(content.substring(start, i + 1));
+				continue;
+			} else if (char === "/" && nextChar === "*") {
+				let start = i;
+				i = content.indexOf("*/", i) + 1;
+				status.output += escapeHtml(content.substring(start, i + 1));
+				continue;
+			} else if (char === "\"" || char === "'") {
+				let start = i;
+				i = endOfString(char, content, i);
+				status.output += escapeHtml(content.substring(start, i + 1));
+				continue;
+			} else if (char === "`") {
+				let start = i;
+				i = endOfTemplateString(content, i);
+				status.output += escapeHtml(content.substring(start, i + 1));
+				continue;
+			}
+		}
+		status.output += char;
+	}
+}
+function escapeHtml(text) {
+	return text.replaceAll("&", "&amp;").replaceAll("<", "&lt;").replaceAll(">", "&gt;");
+}
+
+//#endregion
+//#region src/compile/build/server/buildServerNode.ts
+function buildServerNode(node, status, b) {
+	switch (node.type) {
+		case "root":
+			buildServerRootNode(node, status, b);
+			break;
+		case "control":
+			buildServerControlNode(node, status, b);
+			break;
+		case "component":
+			buildServerComponentNode(node, status, b);
+			break;
+		case "element":
+			buildServerElementNode(node, status, b);
+			break;
+		case "text":
+			buildServerTextNode(node, status);
+			break;
+		case "special":
+			buildServerSpecialNode(node, status, b);
+			break;
+		default: throw new Error(`Invalid node type: ${node.type}`);
+	}
+}
+
+//#endregion
+//#region src/compile/build/server/buildServerCode.ts
+const importsMap = {
+	$watch: "import { $watch } from \"${folder}\";",
+	$cache: "import { $cache } from \"${folder}\";",
+	$run: "import { $run } from \"${folder}\";",
+	$mount: "import { $mount } from \"${folder}\";",
+	$unwrap: "import { $unwrap } from \"${folder}\";",
+	$peek: "import { $peek } from \"${folder}\";",
+	$batch: "import { $batch } from \"${folder}\";",
+	t_fmt: "import { t_fmt } from \"${folder}\";",
+	t_attr: "import { t_attr } from \"${folder}\";",
+	t_class: "import { t_class } from \"${folder}\";",
+	t_style: "import { t_style } from \"${folder}\";",
+	ServerSlotRender: "import { type ServerSlotRender } from \"${folder}\";"
+};
+function buildServerCode(template, options) {
+	let b = new Builder(options?.mapped);
+	let imports = /* @__PURE__ */ new Set();
+	imports.add("ServerSlotRender");
+	buildServerTemplate(template, imports, b, options);
+	if (imports.size) {
+		b.prepend("");
+		for (let imp of Array.from(imports).sort().reverse()) {
+			imp = importsMap[imp] || imp;
+			b.prepend(imp.replace("${folder}", options?.renderFolder || "@torpor/view/ssr"));
+		}
+	}
+	return b.toString();
+}
+function buildServerTemplate(template, imports, b, options) {
+	let script = template.script.map((s) => s.script).join("\n");
+	if (/\$watch\b/.test(script)) imports.add("$watch");
+	if (/\$cache\b/.test(script)) imports.add("$cache");
+	if (/\$run\b/.test(script)) imports.add("$run");
+	if (/\$mount\b/.test(script)) imports.add("$mount");
+	if (/\$unwrap\b/.test(script)) imports.add("$unwrap");
+	if (/\$peek\b/.test(script)) imports.add("$peek");
+	if (/\$batch\b/.test(script)) imports.add("$batch");
+	let currentIndex = 0;
+	let current = template.components[0];
+	for (let chunk of template.script) if (chunk.script === "/* @params */") {
+		let params = [
+			current.params ?? `${current.props?.length ? "$props:  Record<PropertyKey, any>" : "_$props:  Record<PropertyKey, any> | undefined"}`,
+			`${current.contextProps?.length || current.needsContext ? "$context" : "_$context"}: Record<PropertyKey, any>`,
+			`${current.slotProps?.length ? "$slots" : "_$slots"}?: Record<string, ServerSlotRender>`
+		];
+		b.append(params.join(",\n"));
+	} else if (chunk.script === ") /* @return_type */ {") b.append("): { body: string, head: string } {");
+	else if (chunk.script === "/* @start */") {
+		if (current.contextProps?.length) b.append(`$context = Object.assign({}, $context);`);
+		b.append(`let t_body = "";`);
+		b.append(`let t_head = "";`);
+	} else if (chunk.script === "/* @render */") {
+		if (current.markup) {
+			const status = {
+				imports,
+				output: "",
+				styleHash: current.style?.hash || "",
+				varNames: {},
+				preserveWhitespace: false,
+				options
+			};
+			b.append("");
+			b.append("/* User interface */");
+			buildServerNode(current.markup, status, b);
+			if (status.output) {
+				b.append(`t_body += \`${status.output}\`;`);
+				status.output = "";
+			}
+		}
+	} else if (chunk.script === "/* @head */") {} else if (chunk.script === "/* @style */") {
+		if (current.style) {
+			b.append("");
+			b.append("/* Style */");
+			const styles = buildStyles(current.style, current.style.hash).replaceAll("\"", "\\\"").replaceAll(/\s+/g, " ");
+			b.append(`t_head += "<style id='${current.style.hash}'>${styles}</style>";\n`);
+		}
+	} else if (chunk.script === "/* @end */") {
+		b.append(`return { body: t_body, head: t_head };`);
+		currentIndex += 1;
+		current = template.components[currentIndex];
+	} else b.append(chunk.script);
+}
+
+//#endregion
+//#region src/compile/build.ts
+/**
+* Builds a component template into code and styles for rendering
+*
+* @param template The component template, possibly including script, markup and styles
+*
+* @returns The component's code and styles
+*/
+function build(template, options) {
+	let map = [];
+	let code = options?.server ? buildServerCode(template, options) : buildCode(template, map, options);
+	let styles = template.components.map((c) => c.style ? {
+		style: buildStyles(c.style, c.style.hash),
+		hash: c.style.hash
+	} : void 0).filter((c) => c !== void 0);
+	return {
+		code,
+		styles,
+		map
+	};
+}
+
+//#endregion
+//#region src/compile/buildType.ts
+/**
+* Builds a component template into a d.ts file
+*
+* @param name The name of the component
+* @param template The component template, possibly including script, markup and styles
+*
+* @returns The d.ts file content
+*/
+function buildType(template, options) {
+	let b = new Builder();
+	b.append(`import { type SlotRender } from "${options?.renderFolder || "@torpor/view"}";`);
+	for (let component of template.components) {
+		b.append("");
+		b.append(`
+			/**
+			 * Mounts or hydrates the component into the supplied parent node.
+			 * @param $parent -- The parent node.
+			 * @param $anchor -- The node to mount the component before.
+			 * @param $props -- The values that have been passed into the component as properties.
+			 * @param $context -- Values that have been passed into the component from its ancestors.
+			 * @param $slots -- Functions for rendering children into slot nodes within the component.
+			 */
+			${component.default ? "declare" : "export declare"} function ${component.name}(
+				$parent: ParentNode,
+				$anchor: Node | null,
+				${component.params || "$props?: Record<PropertyKey, any>"},
+				$context?: Record<PropertyKey, any>,
+				$slots?: Record<string, SlotRender>,
+			): void;
+		`);
+		if (component.default) b.append(`export default ${component.name};`);
+	}
+	return b.toString();
+}
+
+//#endregion
+//#region src/compile/utils/isSpaceNode.ts
+function isSpaceNode(node) {
+	return isTextNode(node) && isSpace(node.content);
+}
+
+//#endregion
+//#region src/compile/utils/trimStart.ts
+/**
+* Trims a char from the start of the supplied text
+*
+* @param text The text to trim
+* @param char The char to remove from the start of the text
+*
+* @returns The text without the char on the start
+*/
+function trimStart(text, char) {
+	let start = 0;
+	while (text[start] === char) start += 1;
+	return text.substring(start);
+}
+
+//#endregion
+//#region src/compile/parse/utils/consumeSpace.ts
+/**
+* Consumes space characters and advances the current parse position to before
+* the next non-space character
+*
+* @param status The parse status
+*
+* @returns The string of space characters from the current parse position to
+* the next non-space character
+*/
+function consumeSpace(status) {
+	const start = status.i;
+	for (status.i; status.i < status.source.length; status.i++) if (!isSpaceChar(status.source, status.i)) return status.source.substring(start, status.i);
+	return "";
+}
+
+//#endregion
+//#region src/compile/parse/addSpaceElement.ts
+function addSpaceElement(parent, status) {
+	const content = consumeSpace(status);
+	if (content) {
+		const previousNode = parent.children[parent.children.length - 1];
+		if (previousNode && isTextNode(previousNode)) previousNode.content += content;
+		else {
+			const space = {
+				type: "text",
+				content,
+				ranges: []
+			};
+			parent.children.push(space);
+		}
+	}
+}
+
+//#endregion
+//#region src/compile/utils/isFullyReactive.ts
+/**
+* Checks whether the supplied string is fully reactive (i.e. starts and ends with braces)
+*
+* @param text The string to check
+*
+* @returns True if the supplied string is fully reactive
+*/
+function isFullyReactive(text) {
+	return text.trim().startsWith("{") && text.trim().endsWith("}");
+}
+
+//#endregion
+//#region src/compile/parse/utils/accept.ts
+/**
+* Checks whether the source at the current parse position matches the supplied
+* string
+*
+* @param value The string to check
+* @param status The parse status
+* @param advance (Optional) If true, advances the parse position past the
+* checked string (defaults to true)
+*
+* @returns True if the supplied string was found at the current parse position
+*/
+function accept(value, status, advance = true) {
+	if (status.source.substring(status.i, status.i + value.length) == value) {
+		status.i += advance ? value.length : 0;
+		return true;
+	}
+	return false;
+}
+
+//#endregion
+//#region src/compile/parse/parseInlineScript.ts
+function parseInlineScript(status) {
+	const start = status.i;
+	let braceCount = 0;
+	while (status.i < status.source.length) if (accept("{", status)) braceCount += 1;
+	else if (accept("}", status)) if (braceCount > 0) braceCount -= 1;
+	else return status.source.substring(start, status.i - 1);
+	else if (accept("//", status)) status.i = status.source.indexOf("\n", status.i) + 1;
+	else if (accept("/*", status)) status.i = status.source.indexOf("*/", status.i) + 2;
+	else if (accept("\"", status) || accept("'", status)) {
+		const char = status.source[status.i - 1];
+		status.i = endOfString(char, status.source, status.i - 1) + 1;
+	} else if (accept("`", status)) status.i = endOfTemplateString(status.source, status.i - 1) + 1;
+	else status.i += 1;
+	return "";
+}
+
+//#endregion
+//#region src/compile/parse/utils/isAlphaNumericChar.ts
+/**
+* Checks whether the supplied character is a alpha-numeric
+*
+* @param text The string to check
+* @param index The index of the character in the string
+*
+* @returns True if the supplied character is alpha-numeric
+*/
+function isAlphaNumericChar(text, index) {
+	let code = text.charCodeAt(index);
+	return code > 47 && code < 58 || code > 64 && code < 91 || code > 96 && code < 123;
+}
+
+//#endregion
+//#region src/compile/parse/utils/consumeAlphaNumeric.ts
+/**
+* Consumes alpha-numeric characters and advances the current parse position to
+* before the next non-alpha character
+*
+* @param status The parse status
+*
+* @returns The string of alpha-numeric characters from the current parse position
+* to the next non-alpha character
+*/
+function consumeAlphaNumeric(status) {
+	const start = status.i;
+	for (status.i; status.i < status.source.length; status.i++) if (!isAlphaNumericChar(status.source, status.i)) return status.source.substring(start, status.i);
+	return "";
+}
+
+//#endregion
+//#region src/compile/parse/utils/consumeUntil.ts
+/**
+* Consumes characters until one of the characters in the supplied string is
+* found. The parse position will be advanced to before the found character
+*
+* @param chars The characters to match
+* @param status The parse status
+*
+* @returns The string of characters from the current parse position to the
+* found character
+*/
+function consumeUntil(chars, status) {
+	const start = status.i;
+	for (status.i; status.i < status.source.length; status.i++) if (chars.includes(status.source[status.i])) return status.source.substring(start, status.i);
+	return "";
+}
+
+//#endregion
+//#region src/compile/parse/parseTag.ts
+function parseTag(status) {
+	accept("<", status);
+	let closeTag = accept("/", status);
+	consumeSpace(status);
+	let tagStart = status.i;
+	let snailed = accept("@", status);
+	let tagName = consumeAlphaNumeric(status);
+	let tagEnd = status.i;
+	if (snailed) tagName = "@" + tagName;
+	if (closeTag) tagName = "/" + tagName;
+	consumeSpace(status);
+	let attributes = parseTagAttributes(status);
+	let selfClosed = false;
+	if (accept("/>", status)) selfClosed = true;
+	else accept(">", status);
+	if (closeTag) selfClosed = true;
+	return {
+		type: [
+			"slot",
+			"fill",
+			"@component",
+			"@element"
+		].includes(tagName) ? "special" : "element",
+		tagName,
+		selfClosed: selfClosed || void 0,
+		closed: selfClosed || void 0,
+		attributes,
+		children: [],
+		range: {
+			start: tagStart,
+			end: tagEnd
+		}
+	};
+}
+function parseTagAttributes(status) {
+	let attributes = [];
+	while (status.i < status.source.length) {
+		consumeSpace(status);
+		if (accept("@//", status)) status.i = status.source.indexOf("\n", status.i) + 1;
+		else if (accept("@/*", status)) status.i = status.source.indexOf("*/", status.i) + 2;
+		else if (accept("/>", status, false) || accept(">", status, false)) break;
+		else {
+			const attribute = parseAttribute(status);
+			attributes.push(attribute);
+		}
+	}
+	return attributes;
+}
+function parseAttribute(status) {
+	let valueStart = status.i;
+	let valueEnd = status.i;
+	let name = consumeUntil("= 	\r\n/>", status);
+	let value = void 0;
+	let reactive = false;
+	let fullyReactive = false;
+	consumeSpace(status);
+	if (accept("=", status)) {
+		consumeSpace(status);
+		valueStart = status.i;
+		value = parseAttributeValue(status);
+		valueEnd = status.i;
+		reactive = isReactive(value);
+		fullyReactive = isFullyReactive(value);
+		if (fullyReactive) {
+			value = value.substring(1, value.length - 1);
+			valueStart++;
+			valueEnd--;
+		} else if (reactive) value = `\`${trimQuotes(value).replaceAll("{", "${")}\``;
+	} else if (name.startsWith("{") && name.endsWith("}")) {
+		value = name.substring(1, name.length - 1);
+		valueStart++;
+		valueEnd = valueStart + name.length;
+		name = value.split(".").at(-1);
+		reactive = fullyReactive = true;
+	}
+	return {
+		name,
+		value,
+		reactive,
+		fullyReactive,
+		range: {
+			start: valueStart,
+			end: valueEnd
+		}
+	};
+}
+function parseAttributeValue(status) {
+	if (accept("\"", status)) {
+		const value = consumeUntil("\"", status);
+		accept("\"", status);
+		return `"${value}"`;
+	} else if (accept("'", status)) {
+		const value = consumeUntil("'", status);
+		accept("'", status);
+		return `'${value}'`;
+	} else if (accept("{", status)) return `{${parseInlineScript(status)}}`;
+	else {
+		let value = consumeUntil(" 	\r\n>", status);
+		if (status.source.substring(status.i - 1, status.i + 1) === "/>") {
+			value = value.substring(0, value.length - 1);
+			status.i -= 1;
+		}
+		return value;
+	}
+}
+
+//#endregion
+//#region src/compile/parse/parseText.ts
+function parseText(status, element) {
+	let ranges = [];
+	const start = status.i;
+	let end = -1;
+	for (let j = status.i; j < status.source.length; j++) {
+		if (status.source[j] === "}") end = j;
+		else if (status.source[j] === "{") {
+			const reactiveStart = j + 1;
+			let level = 0;
+			for (let k = j; k < status.source.length; k++) {
+				const char = status.source[k];
+				const nextChar = status.source[k + 1];
+				if (char === "/" && nextChar === "/") k = status.source.indexOf("\n", k);
+				else if (char === "/" && nextChar === "*") k = status.source.indexOf("*/", k) + 1;
+				else if (char === "\"" || char === "'") k = endOfString(char, status.source, k);
+				else if (char === "`") k = endOfTemplateString(status.source, k);
+				else if (char === "{") level += 1;
+				else if (char === "}") {
+					level -= 1;
+					if (level === 0) {
+						j = k;
+						break;
+					}
+				}
+			}
+			ranges.push({
+				start: reactiveStart,
+				end: j
+			});
+		} else if (status.source[j] === "<") end = j;
+		else if (status.source[j] === "@") {
+			for (let k = j - 1; k > status.i; k--) if (status.source[k] === "\n") {
+				end = j;
+				break;
+			} else if (!isSpaceChar(status.source, k)) break;
+		}
+		if (end !== -1) break;
+	}
+	if (end !== -1) {
+		const content = status.source.substring(start, end).trimEnd();
+		const spaceContent = status.source.substring(start + content.length, end);
+		if (content || spaceContent) {
+			const previousNode = element.children[element.children.length - 1];
+			if (previousNode && isTextNode(previousNode)) {
+				previousNode.content += content + spaceContent;
+				previousNode.ranges.push(...ranges);
+			} else {
+				const text = {
+					type: "text",
+					content: content + spaceContent,
+					ranges
+				};
+				element.children.push(text);
+			}
+		}
+		status.i = end;
+	} else status.i += 1;
+}
+
+//#endregion
+//#region src/compile/parse/slottifyChildNodes.ts
+/**
+* Moves any child nodes that aren't already in a <fill> node into a default
+* <fill> node
+*/
+function slottifyChildNodes(node) {
+	const nonFillNodes = node.children.filter((c) => !isFillNode(c));
+	if (nonFillNodes.length) {
+		let defaultFillNode = node.children.find((n) => isFillNode(n) && !n.attributes.find((a) => a.name === "name"));
+		if (!defaultFillNode) {
+			defaultFillNode = {
+				type: "special",
+				tagName: "fill",
+				attributes: [],
+				children: nonFillNodes,
+				range: {
+					start: 0,
+					end: 0
+				}
+			};
+			node.children.unshift(defaultFillNode);
+		}
+	}
+	node.children = node.children.filter((c) => isFillNode(c));
+}
+function isFillNode(n) {
+	return isSpecialNode(n) && n.tagName === "fill";
+}
+
+//#endregion
+//#region src/compile/parse/utils/addError.ts
+/**
+* Adds an error to the parse status
+*
+* @param status The parse status
+* @param message The error message to add
+* @param start (Optional) The start position of the error (defaults to the
+* current parse position)
+*/
+function addError(status, message, start = status.i, end = status.i) {
+	let startLine = 0;
+	let lastLineStart = 0;
+	let i = 0;
+	for (; i < start; i++) if (status.source[i] === "\n") {
+		startLine += 1;
+		lastLineStart = i + 1;
+	}
+	let startChar = start - lastLineStart;
+	let endLine = startLine;
+	for (; i < end; i++) if (status.source[i] === "\n") {
+		endLine += 1;
+		lastLineStart = i + 1;
+	}
+	let endChar = end - lastLineStart;
+	status.errors.push({
+		message,
+		startIndex: start,
+		startLine,
+		startChar,
+		endIndex: end,
+		endLine,
+		endChar
+	});
+}
+
+//#endregion
+//#region src/compile/parse/parseElement.ts
+function parseElement(status) {
+	const current = status.components.at(-1);
+	if (!current) throw new Error("No component in stack");
+	const start = status.i;
+	const element = parseTag(status);
+	if (element.tagName.startsWith("/")) {
+		addError(status, `Non-matching close tag: ${element.tagName.substring(1)}`, start, start + element.tagName.length);
+		return element;
+	}
+	if (voidTags_default.includes(element.tagName)) checkVoidElement(status, element);
+	if (!element.selfClosed && !voidTags_default.includes(element.tagName)) {
+		current.stack ??= [];
+		current.stack.push(element);
+		while (status.i < status.source.length) {
+			addSpaceElement(element, status);
+			if (accept("}", status, false)) break;
+			else if (accept("<!--", status)) status.i = status.source.indexOf("-->", status.i) + 3;
+			else if (accept("@//", status)) status.i = status.source.indexOf("\n", status.i) + 1;
+			else if (accept("@/*", status)) status.i = status.source.indexOf("*/", status.i) + 2;
+			else if (accept("</", status, false)) {
+				if (checkCloseTag(status, element, current)) break;
+			} else if (accept("<", status, false)) {
+				const child = parseElement(status);
+				element.children.push(child);
+			} else if (accept("@", status, false)) parseControl(status, element);
+			else parseText(status, element);
+		}
+		current.stack.pop();
+	}
+	if (/[A-Z]/.test(element.tagName[0])) {
+		element.type = "component";
+		slottifyChildNodes(element);
+		current.needsContext = true;
+	}
+	if (isSpecialNode(element)) {
+		if (element.tagName === "slot") {
+			slottifyChildNodes(element);
+			current.needsContext = true;
+			current.slotProps ??= [];
+			current.slotProps.push(element.attributes.find((a) => a.name === "name")?.name ?? "default");
+		} else if (element.tagName === "fill") {
+			const fillSource = status.source.substring(start, status.i);
+			element.hasSlotProps = /\$sprops\b/.test(fillSource);
+		} else if (element.tagName === "@component") {
+			const selfAttribute = element.attributes.find((a) => a.name === "self");
+			if (selfAttribute && selfAttribute.value && selfAttribute.fullyReactive) {
+				element.type = "component";
+				slottifyChildNodes(element);
+				current.needsContext = true;
+				const selfValue = selfAttribute.value;
+				return {
+					type: "control",
+					operation: "@replace group",
+					statement: selfValue,
+					children: [{
+						type: "control",
+						operation: "@replace",
+						statement: selfValue,
+						children: [element],
+						range: {
+							start: 0,
+							end: 0
+						}
+					}],
+					range: {
+						start: 0,
+						end: 0
+					}
+				};
+			} else addError(status, "@component element must have a self attribute", start, start + element.tagName.length + 1);
+		}
+	}
+	if (!element.closed && !voidTags_default.includes(element.tagName)) addError(status, `Unclosed non-void element: ${element.tagName}`, start, start + element.tagName.length + 1);
+	return element;
+}
+function checkVoidElement(status, element) {
+	let i = status.i;
+	consumeSpace(status);
+	if (accept("</", status)) {
+		consumeSpace(status);
+		if (accept(element.tagName, status)) {
+			addError(status, `Closed void element: ${element.tagName}`, i, i + element.tagName.length + 1);
+			consumeSpace(status);
+			accept(">", status);
+			return;
+		}
+	}
+	status.i = i;
+}
+function checkCloseTag(status, element, current) {
+	const start = status.i;
+	accept("</", status);
+	consumeSpace(status);
+	let snailed = accept("@", status);
+	let closingTagName = consumeAlphaNumeric(status);
+	if (snailed) closingTagName = "@" + closingTagName;
+	consumeSpace(status);
+	accept(">", status);
+	let found = false;
+	if (current.stack) {
+		for (let i = current.stack.length - 1; i >= 0; i--) if (closingTagName === current.stack[i].tagName) {
+			current.stack[i].closed = true;
+			found = true;
+			break;
+		}
+	}
+	if (!found) addError(status, `Non-matching close tag: ${closingTagName} (expected ${element.tagName})`, start, start + element.tagName.length + 1);
+	return found;
+}
+
+//#endregion
+//#region src/compile/parse/parseControl.ts
+const controlOperations = [
+	"@if",
+	"@else",
+	"@for",
+	"@key",
+	"@switch",
+	"@case",
+	"@default",
+	"@await",
+	"@then",
+	"@catch",
+	"@replace",
+	"@html",
+	"@const",
+	"@console",
+	"@debugger",
+	"@function",
+	"@async function"
+];
+const standaloneOperations = [
+	"@key",
+	"@html",
+	"@const",
+	"@console",
+	"@debugger",
+	"@function",
+	"@async function"
+];
+function parseControl(status, parentNode) {
+	const node = parseControlOpen(status);
+	if (!node) return;
+	if (standaloneOperations.includes(node.operation)) {
+		wrangleControlNode(node, parentNode);
+		return;
+	}
+	while (status.i < status.source.length) {
+		addSpaceElement(node, status);
+		if (accept("}", status)) break;
+		else if (accept("<", status, false)) {
+			const child = parseElement(status);
+			node.children.push(child);
+		} else if (accept("@//", status)) status.i = status.source.indexOf("\n", status.i) + 1;
+		else if (accept("@/*", status)) status.i = status.source.indexOf("*/", status.i) + 2;
+		else if (accept("@", status, false)) parseControl(status, node);
+		else if (accept("case", status, false) || accept("key", status, false)) parseControl(status, node);
+		else {
+			const char = status.source[status.i];
+			addError(status, `Unexpected token in control block: ${char}`, status.i, status.i + 1);
+			break;
+		}
+	}
+	wrangleControlNode(node, parentNode);
+	parseControlBranches(status, parentNode);
+}
+function parseControlOpen(status) {
+	const start = status.i;
+	let statementStart = start;
+	let operation = "";
+	for (status.i; status.i < status.source.length; status.i++) {
+		const char = status.source[status.i];
+		if (isSpaceChar(status.source, status.i) && operation !== "@async" || accept(":", status) && operation === "default" || accept(".", status) && operation === "@console" || accept("(", status, false) && operation === "@html") break;
+		operation += char;
+	}
+	if (!operation.startsWith("@")) operation = "@" + operation;
+	else statementStart++;
+	let statement = "";
+	if (controlOperations.includes(operation)) {
+		statement = parseControlStatement(start, operation, status);
+		if (operation === "@function" || operation === "@async function") {
+			statement += ` {${parseInlineScript(status)}}`;
+			accept("}", status);
+		}
+		if (operation === "@replace" || operation === "@html") statement = trimMatched(statement.substring(statement.indexOf("(")).trim(), "(", ")");
+	} else {
+		addError(status, `Unknown operation: ${operation}`, status.i, status.i + operation.length);
+		return null;
+	}
+	return {
+		type: "control",
+		operation,
+		statement,
+		children: [],
+		range: {
+			start: statementStart,
+			end: status.i
+		}
+	};
+}
+function parseControlStatement(start, operation, status) {
+	let parenCount = 0;
+	while (status.i < status.source.length) if (accept("(", status)) parenCount += 1;
+	else if (accept(")", status)) parenCount -= 1;
+	else if (accept("{", status) || accept("\n", status) && standaloneOperations.includes(operation)) {
+		if (parenCount === 0) return trimStart(status.source.substring(start, status.i - 1).trim(), "@");
+	} else if (accept("//", status)) status.i = status.source.indexOf("\n", status.i) + 1;
+	else if (accept("/*", status)) status.i = status.source.indexOf("*/", status.i) + 2;
+	else if (accept("\"", status) || accept("'", status)) {
+		let char = status.source[status.i - 1];
+		status.i = endOfString(char, status.source, status.i - 1) + 1;
+	} else if (accept("`", status)) status.i = endOfTemplateString(status.source, status.i - 1) + 1;
+	else status.i += 1;
+	return "";
+}
+/**
+* Groups the control node into the correct parent e.g. if/else into an if group
+* @param node The control node
+* @param parentNode The parent node
+*/
+function wrangleControlNode(node, parentNode) {
+	if (node.operation === "@if") {
+		const ifGroup = {
+			type: "control",
+			operation: "@if group",
+			statement: "",
+			children: [node],
+			range: {
+				start: 0,
+				end: 0
+			}
+		};
+		parentNode.children.push(ifGroup);
+	} else if (node.operation === "@else") {
+		if (/^else\s+if/.test(node.statement)) node.operation = "@else if";
+		for (let i = parentNode.children.length - 1; i >= 0; i--) {
+			const lastChild = parentNode.children[i];
+			if (isControlNode(lastChild) && lastChild.operation === "@if group") {
+				lastChild.children.push(node);
+				break;
+			}
+		}
+	} else if (node.operation === "@for") {
+		const forGroup = {
+			type: "control",
+			operation: "@for group",
+			statement: "",
+			children: [node],
+			range: {
+				start: 0,
+				end: 0
+			}
+		};
+		parentNode.children.push(forGroup);
+	} else if (node.operation === "@switch") {
+		node.operation = "@switch group";
+		parentNode.children.push(node);
+	} else if (node.operation === "@await") {
+		const awaitGroup = {
+			type: "control",
+			operation: "@await group",
+			statement: "",
+			children: [node],
+			range: {
+				start: 0,
+				end: 0
+			}
+		};
+		parentNode.children.push(awaitGroup);
+	} else if (node.operation === "@then" || node.operation === "@catch") for (let i = parentNode.children.length - 1; i >= 0; i--) {
+		const lastChild = parentNode.children[i];
+		if (isControlNode(lastChild) && lastChild.operation === "@await group") {
+			lastChild.children.push(node);
+			break;
+		}
+	}
+	else if (node.operation === "@replace") {
+		const replaceGroup = {
+			type: "control",
+			operation: "@replace group",
+			statement: "",
+			children: [node],
+			range: {
+				start: 0,
+				end: 0
+			}
+		};
+		parentNode.children.push(replaceGroup);
+	} else if (node.operation === "@html") {
+		const htmlGroup = {
+			type: "control",
+			operation: "@html group",
+			statement: "",
+			children: [node],
+			range: {
+				start: 0,
+				end: 0
+			}
+		};
+		parentNode.children.push(htmlGroup);
+	} else parentNode.children.push(node);
+}
+/**
+* Parses control branches that don't start with an @ symbol e.g. else or case
+* @param status The parse status
+* @param parentNode The parent node
+*/
+function parseControlBranches(status, parentNode) {
+	let gotAnotherBranch = true;
+	while (gotAnotherBranch) {
+		let start = status.i;
+		status.i += 1;
+		consumeSpace(status);
+		if (accept("else", status, false) || accept("case", status, false) || accept("default", status, false) || accept("then", status, false) || accept("catch", status, false)) parseControl(status, parentNode);
+		else {
+			gotAnotherBranch = false;
+			status.i = start;
+		}
+	}
+}
+
+//#endregion
+//#region src/compile/parse/parseMarkup.ts
+function parseMarkup(status, source) {
+	const current = status.components.at(-1);
+	if (!current) return;
+	while (status.i < source.length) if (accept("}", status, false)) return;
+	else if (accept("<!--", status)) status.i = status.source.indexOf("-->", status.i) + 3;
+	else if (accept("@//", status)) status.i = status.source.indexOf("\n", status.i) + 1;
+	else if (accept("@/*", status)) status.i = status.source.indexOf("*/", status.i) + 2;
+	else if (isSpaceChar(status.source, status.i)) {
+		current.markup ??= {
+			type: "root",
+			children: []
+		};
+		const text = {
+			type: "text",
+			content: consumeSpace(status),
+			ranges: []
+		};
+		current.markup.children.push(text);
+	} else if (accept("<", status, false)) {
+		current.markup ??= {
+			type: "root",
+			children: []
+		};
+		const element = parseElement(status);
+		current.markup.children.push(element);
+	} else if (accept("@", status, false)) {
+		current.markup ??= {
+			type: "root",
+			children: []
+		};
+		parseControl(status, current.markup);
+	} else status.i += 1;
+}
+
+//#endregion
+//#region src/compile/utils/hash.ts
+const returnRegex = /\r/g;
+function hash(input) {
+	input = input.replace(returnRegex, "");
+	let hash$1 = 5381;
+	let i = input.length;
+	while (i--) hash$1 = (hash$1 << 5) - hash$1 ^ input.charCodeAt(i);
+	return (hash$1 >>> 0).toString(36);
+}
+
+//#endregion
+//#region src/compile/parse/utils/expect.ts
+/**
+* Checks whether the source at the current parse position matches the supplied
+* string and if not, adds an error to the parse status
+*
+* @param value The string to check
+* @param status The parse status
+* @param advance (Optional) If true, advances the parse position past the
+* checked string (defaults to true)
+*
+* @returns True if the supplied string was found at the current parse position
+*/
+function expect(value, status, advance = true) {
+	if (status.i < status.source.length) if (status.source.substring(status.i, status.i + value.length) == value) {
+		status.i += advance ? value.length : 0;
+		return true;
+	} else addError(status, `Expected ${value}`);
+	else addError(status, "Expected token");
+	return false;
+}
+
+//#endregion
+//#region src/compile/parse/parseStyles.ts
+function parseStyles(source, status) {
+	const current = status.components.at(-1);
+	if (!current) return;
+	current.style = {
+		global: false,
+		blocks: [],
+		hash: hash(source)
+	};
+	const styleStatus = {
+		source,
+		i: 0,
+		marker: 0,
+		level: 0,
+		imports: [],
+		script: [],
+		components: [],
+		errors: []
+	};
+	while (styleStatus.i < styleStatus.source.length) if (isSpaceChar(styleStatus.source, styleStatus.i)) consumeSpace(styleStatus);
+	else {
+		const block = parseStyleBlock(styleStatus);
+		if (block) current.style.blocks.push(block);
+		else break;
+	}
+	status.errors = status.errors.concat(styleStatus.errors);
+}
+function parseStyleBlock(status) {
+	const selector = consumeUntil("{", status).trim();
+	if (expect("{", status)) {
+		const block = {
+			selector,
+			attributes: [],
+			children: []
+		};
+		consumeSpace(status);
+		while (status.source[status.i] !== "}") {
+			let nextColon = status.source.indexOf(":", status.i);
+			if (nextColon === -1) nextColon = status.source.length;
+			let nextOpenBrace = status.source.indexOf("{", status.i);
+			if (nextOpenBrace === -1) nextOpenBrace = status.source.length;
+			if (nextColon < nextOpenBrace) {
+				const attribute = parseStyleAttribute(status);
+				block.attributes.push(attribute);
+			} else if (nextOpenBrace < nextColon) {
+				const child = parseStyleBlock(status);
+				if (child) block.children.push(child);
+				else break;
+			} else return block;
+			consumeSpace(status);
+		}
+		accept("}", status);
+		return block;
+	}
+}
+function parseStyleAttribute(status) {
+	const name = consumeUntil(":", status).trim();
+	accept(":", status);
+	const value = consumeUntil(";", status).trim();
+	accept(";", status);
+	return {
+		name,
+		value
+	};
+}
+
+//#endregion
+//#region src/compile/utils/isComponentNode.ts
+function isComponentNode(node) {
+	return node.type === "component";
+}
+
+//#endregion
+//#region src/compile/utils/isParentNode.ts
+function isParentNode(node) {
+	return "children" in node;
+}
+
+//#endregion
+//#region src/compile/parse/scopeStyles.ts
+function scopeStyles(status) {
+	let selectors = [];
+	for (let component of status.components) if (component.style && component.markup) {
+		for (let block of component.style.blocks) collectStyleSelectors(block, selectors);
+		scopeStylesOnNode(component.markup, selectors);
+	}
+}
+function scopeStylesOnNode(node, selectors) {
+	if (isElementNode(node) || isComponentNode(node)) {
+		let scopeStyles$1 = selectors.includes(node.tagName);
+		if (!scopeStyles$1) for (let a of node.attributes) {
+			if (a.name === "class" && a.reactive) scopeStyles$1 = true;
+			else if (a.name === "id" && a.value) scopeStyles$1 = selectors.includes(`#${trimQuotes(a.value)}`);
+			else if (a.name === "class" && a.value) scopeStyles$1 = selectors.includes(`.${trimQuotes(a.value)}`);
+			if (scopeStyles$1) break;
+		}
+		node.scopeStyles = scopeStyles$1;
+	}
+	if (isParentNode(node)) for (let child of node.children) scopeStylesOnNode(child, selectors);
+}
+function collectStyleSelectors(block, selectors) {
+	for (let s of block.selector.split(/[\s*,>+~]/)) selectors.push(s);
+}
+
+//#endregion
+//#region src/compile/parse/parseCode.ts
+function parseCode(source) {
+	const status = {
+		source,
+		i: 0,
+		marker: 0,
+		level: 0,
+		imports: [],
+		script: [],
+		components: [],
+		errors: []
+	};
+	for (status.i; status.i < source.length; status.i++) if (consumeScriptComments(status)) {} else if (status.source[status.i] === "{") status.level += 1;
+	else if (status.source[status.i] === "}") {
+		status.level -= 1;
+		if (status.level === 0) parseComponentEnd(status);
+	} else if (accept("function", status)) {
+		if (consumeSpace(status)) if (/[A-Z]/.test(source[status.i])) parseComponentStart(status);
+		else status.i--;
+	} else if (accept("const", status)) {
+		if (consumeSpace(status)) if (/[A-Z]/.test(source[status.i])) {
+			const start = status.i;
+			consumeAlphaNumeric(status);
+			consumeSpace(status);
+			if (accept("=", status)) {
+				consumeSpace(status);
+				if (accept("(", status, false)) {
+					status.i = start;
+					parseComponentStart(status);
+				}
+			}
+		} else status.i--;
+	} else if (accept("export", status)) {
+		const start = status.i;
+		if (consumeSpace(status) && accept("default", status) && consumeSpace(status) && accept("(", status, false)) parseComponentStart(status);
+		else status.i = start;
+	} else if (accept("@render", status, false)) parseComponentRender(status);
+	else if (accept("@head", status, false)) parseComponentHead(status);
+	else if (accept("@style", status, false)) parseComponentStyle(status);
+	status.script.push({
+		script: source.substring(status.marker, source.length),
+		range: {
+			start: status.marker,
+			end: source.length
+		}
+	});
+	scopeStyles(status);
+	const ok = !status.errors.length;
+	if (!ok) status.errors = status.errors.sort((a, b) => a.startIndex - b.startIndex);
+	return {
+		ok,
+		errors: status.errors,
+		template: ok ? {
+			imports: status.imports,
+			script: status.script,
+			components: status.components.map((c) => {
+				return {
+					start: c.start,
+					name: c.name,
+					default: c.default,
+					params: c.params,
+					markup: c.markup,
+					head: c.head,
+					style: c.style,
+					props: c.props,
+					contextProps: c.contextProps,
+					slotProps: c.slotProps,
+					needsContext: c.needsContext
+				};
+			})
+		} : void 0
+	};
+}
+function parseComponentStart(status) {
+	let source = status.source.substring(0, status.i);
+	let def = /export\s+default\s+(function\s+|const\s+)*$/.test(source);
+	let isConst = /const\s+$/.test(source);
+	let isAnon = /export default\s+$/.test(source);
+	status.components.push({
+		start: status.i,
+		name: consumeAlphaNumeric(status),
+		default: def
+	});
+	const current = status.components.at(-1);
+	if (!current) return;
+	let start = -1;
+	let end = -1;
+	let level = 0;
+	for (status.i; status.i < status.source.length; status.i++) {
+		const char = status.source[status.i];
+		if (consumeScriptComments(status)) {} else if (char === "(") {
+			level += 1;
+			if (start === -1) start = status.i + 1;
+		} else if (char === ")") {
+			level -= 1;
+			if (level === 0) {
+				end = status.i;
+				break;
+			}
+		}
+	}
+	status.script.push({
+		script: status.source.substring(status.marker, start),
+		range: {
+			start: status.marker,
+			end: start
+		}
+	});
+	status.script.push({
+		script: "/* @params */",
+		range: {
+			start: 0,
+			end: 0
+		}
+	});
+	current.params = status.source.substring(start, end).trim() || void 0;
+	status.marker = end;
+	status.i = status.marker;
+	accept(")", status);
+	consumeSpace(status);
+	if (isConst || isAnon) {
+		accept("=>", status);
+		consumeSpace(status);
+	}
+	accept("{", status);
+	status.level += 1;
+	const postFunctionChunk = {
+		script: status.source.substring(status.marker, status.i),
+		range: {
+			start: status.marker,
+			end: status.i
+		}
+	};
+	if (/\)\s+\{/.test(postFunctionChunk.script)) postFunctionChunk.script = ") /* @return_type */ {";
+	status.script.push(postFunctionChunk);
+	status.script.push({
+		script: "/* @start */",
+		range: {
+			start: 0,
+			end: 0
+		}
+	});
+	status.marker = status.i;
+	const space = consumeSpace(status);
+	status.script.push({
+		script: space,
+		range: {
+			start: status.marker,
+			end: status.i
+		}
+	});
+	status.marker = status.i;
+	status.i -= 1;
+}
+function parseComponentRender(status) {
+	const current = status.components.at(-1);
+	if (!current) return;
+	if (current.markup) addError(status, `Multiple @render sections`, status.i, status.i + 7);
+	status.script.push({
+		script: status.source.substring(status.marker, status.i),
+		range: {
+			start: status.marker,
+			end: status.i
+		}
+	});
+	status.script.push({
+		script: "/* @render */",
+		range: {
+			start: 0,
+			end: 0
+		}
+	});
+	accept("@render", status);
+	consumeSpace(status);
+	if (accept("{", status)) {
+		parseMarkup(status, status.source);
+		accept("}", status);
+	}
+	status.marker = status.i;
+}
+function parseComponentHead(status) {
+	const current = status.components.at(-1);
+	if (!current) return;
+	if (current.head) addError(status, `Multiple @head sections`, status.i, status.i + 5);
+	status.script.push({
+		script: status.source.substring(status.marker, status.i),
+		range: {
+			start: status.marker,
+			end: status.i
+		}
+	});
+	status.script.push({
+		script: "/* @head */",
+		range: {
+			start: 0,
+			end: 0
+		}
+	});
+	status.components.push({ start: status.i });
+	accept("@head", status);
+	consumeSpace(status);
+	if (accept("{", status)) {
+		parseMarkup(status, status.source);
+		accept("}", status);
+	}
+	current.head = status.components.pop()?.markup;
+	status.marker = status.i;
+}
+function parseComponentStyle(status) {
+	const current = status.components.at(-1);
+	if (!current) return;
+	if (current.style) addError(status, `Multiple @style sections`, status.i, status.i + 6);
+	status.script.push({
+		script: status.source.substring(status.marker, status.i),
+		range: {
+			start: status.marker,
+			end: status.i
+		}
+	});
+	status.script.push({
+		script: "/* @style */",
+		range: {
+			start: 0,
+			end: 0
+		}
+	});
+	let start = -1;
+	let end = status.source.length;
+	let level = 0;
+	let styleSource = "";
+	for (; status.i < status.source.length; status.i++) {
+		const char = status.source[status.i];
+		const nextChar = status.source[status.i + 1];
+		if (char === "/" && nextChar === "/") status.i = status.source.indexOf("\n", status.i);
+		else if (char === "/" && nextChar === "*") status.i = status.source.indexOf("*/", status.i) + 1;
+		else if (char === "\"" || char === "'") {
+			let start$1 = status.i;
+			status.i = endOfString(char, status.source, start$1);
+			styleSource += status.source.substring(start$1, status.i + 1);
+		} else if (char === "`") {
+			let start$1 = status.i;
+			status.i = endOfTemplateString(status.source, start$1);
+			styleSource += status.source.substring(start$1, status.i + 1);
+		} else if (char === "{") {
+			level += 1;
+			if (start === -1) start = status.i + 1;
+			else styleSource += char;
+		} else if (char === "}") {
+			level -= 1;
+			if (level === 0) {
+				end = status.i - 1;
+				break;
+			} else styleSource += char;
+		} else if (start !== -1) styleSource += char;
+	}
+	status.i = start;
+	parseStyles(styleSource.trim(), status);
+	status.i = end + 2;
+	status.marker = status.i;
+}
+function parseComponentEnd(status) {
+	const current = status.components.at(-1);
+	if (!current) return;
+	status.script.push({
+		script: status.source.substring(status.marker, status.i),
+		range: {
+			start: status.marker,
+			end: status.i
+		}
+	});
+	status.script.push({
+		script: "/* @end */",
+		range: {
+			start: 0,
+			end: 0
+		}
+	});
+	const componentSource = status.source.substring(current.start || 0, status.i);
+	current.props = getPropsUsage(componentSource);
+	current.contextProps = getContextUsage(componentSource);
+	if (current.markup && isElementNode(current.markup.children[0]) && current.markup.children[0].tagName === "html" && isSpaceNode(current.markup.children[0].children[0])) current.markup.children.splice(1, 1);
+	status.marker = status.i;
+}
+function getPropsUsage(source) {
+	const propsMatches = source.matchAll(/\$props\s*(?:\.([\d\w]+)|\[([^\]]+)\])/g);
+	const props = [];
+	for (let match of propsMatches) {
+		const name = trimQuotes(match[1] || match[2]);
+		if (!props.includes(name)) props.push(name);
+	}
+	return props.length ? props : void 0;
+}
+function getContextUsage(source) {
+	const contextsMatches = source.matchAll(/\$context\s*(?:\.([\d\w]+)|\[([^\]]+)\])/g);
+	const contexts = [];
+	for (let match of contextsMatches) {
+		const name = trimQuotes(match[1] || match[2]);
+		if (!contexts.includes(name)) contexts.push(name);
+	}
+	return contexts.length ? contexts : void 0;
+}
+function consumeScriptComments(status) {
+	const char = status.source[status.i];
+	const nextChar = status.source[status.i + 1];
+	if (char === "/" && nextChar === "/") {
+		status.i = status.source.indexOf("\n", status.i);
+		return true;
+	} else if (char === "/" && nextChar === "*") {
+		status.i = status.source.indexOf("*/", status.i) + 1;
+		return true;
+	} else if (char === "\"" || char === "'") {
+		status.i = endOfString(char, status.source, status.i);
+		return true;
+	} else if (char === "`") {
+		status.i = endOfTemplateString(status.source, status.i);
+		return true;
+	}
+	return false;
+}
+
+//#endregion
+//#region src/compile/parse.ts
+/**
+* Parses source code into a component template
+*
+* @param source The source code
+*
+* @returns A result indicating whether parsing was ok, and if so, containing
+* the component template's parts such as script, markup and styles
+*/
+function parse(source) {
+	return parseCode(source);
+}
+
+//#endregion
+exports.build = build;
+exports.buildType = buildType;
+exports.parse = parse;
+//# sourceMappingURL=compile.cjs.map