marko 6.1.2 → 6.1.4

package/dist/debug/dom.js

@@ -263,8 +263,8 @@ function schedule() {
 	}
 }
 function flushAndWaitFrame() {
-	runTask();
 	requestAnimationFrame(triggerMacroTask);
+	runTask();
 }
 function triggerMacroTask() {
 	if (!channel) {
@@ -284,29 +284,41 @@ function triggerMacroTask() {
 //#region src/dom/signals.ts
 function _let(id, fn) {
 	const valueAccessor = id.slice(0, id.lastIndexOf("/"));
-	const valueChangeAccessor = "TagVariableChange:" + valueAccessor;
 	id = +id.slice(id.lastIndexOf("/") + 1);
-	return (scope, value, valueChange) => {
+	return (scope, value) => {
 		if (rendering) {
-			if ((scope[valueChangeAccessor] = valueChange) && scope[valueAccessor] !== value || scope["#Creating"]) {
+			if (scope["#Creating"]) {
 				scope[valueAccessor] = value;
 				fn?.(scope);
 			}
-		} else if (scope[valueChangeAccessor]) scope[valueChangeAccessor](value);
-		else if (scope[valueAccessor] !== (scope[valueAccessor] = value) && fn) {
+		} else if ((scope[valueAccessor] !== value || !(valueAccessor in scope)) && (scope[valueAccessor] = value, fn)) {
 			schedule();
 			queueRender(scope, fn, id);
 		}
 		return value;
 	};
 }
+function _let_change(id, fn) {
+	const valueAccessor = id.slice(0, id.lastIndexOf("/"));
+	const valueChangeAccessor = "TagVariableChange:" + valueAccessor;
+	const base = _let(id, fn);
+	return (scope, value, valueChange) => {
+		if (rendering) if ((scope[valueChangeAccessor] = valueChange) && (scope[valueAccessor] !== value || !(valueAccessor in scope))) {
+			scope[valueAccessor] = value;
+			fn?.(scope);
+		} else base(scope, value);
+		else if (scope[valueChangeAccessor]) scope[valueChangeAccessor](value);
+		else base(scope, value);
+		return value;
+	};
+}
 function _const(valueAccessor, fn) {
-	return (scope, value) => {
-		if (scope["#Creating"] || scope[valueAccessor] !== value) {
+	return ((scope, value) => {
+		if (scope[valueAccessor] !== value || !(valueAccessor in scope)) {
 			scope[valueAccessor] = value;
 			fn?.(scope);
 		}
-	};
+	});
 }
 function _or(id, fn, defaultPending = 1, scopeIdAccessor = "#Id") {
 	return (scope) => {
@@ -542,53 +554,73 @@ function createCloneableHTML(html, ns) {
 //#endregion
 //#region src/dom/resume.ts
 const registeredValues = {};
-let curRuntimeId;
-let readyLookup;
+let curRenders;
 let branchesEnabled;
-let embedEnabled;
+let embedRenders;
+let readyIds;
 function enableBranches() {
-	branchesEnabled = 1;
+	if (!branchesEnabled) {
+		branchesEnabled = 1;
+		skipDestroyedRenders();
+	}
 }
-const ready = /* @__PURE__ */ ((_) => (id) => {
-	const cb = readyLookup[id];
-	readyLookup[id] = 1;
-	cb?.();
-})(readyLookup = {});
-function initEmbedded(readyId, runtimeId) {
-	embedEnabled = 1;
-	ready(readyId);
+function ready(readyId, runtimeId) {
+	(readyIds ||= /* @__PURE__ */ new Set()).add(readyId);
 	init(runtimeId);
-	new MutationObserver(() => {
-		const renders = self[curRuntimeId];
-		for (const renderId in renders) {
-			const { s, n } = renders[renderId];
-			if (n && !n.isConnected) {
-				delete renders[renderId];
-				for (const id in s) destroyScope(s[id]);
+	for (const renderId in curRenders) runResumeEffects(curRenders[renderId]);
+}
+function initEmbedded(readyId, runtimeId) {
+	if (!embedRenders) {
+		embedRenders = /* @__PURE__ */ new Map();
+		new MutationObserver(() => {
+			for (const [anchor, [renderId, scopes]] of embedRenders) if (!anchor.isConnected) {
+				embedRenders.delete(anchor);
+				delete curRenders[renderId];
+				for (const id in scopes) destroyScope(scopes[id]);
 			}
-		}
-	}).observe(document.body, {
-		childList: true,
-		subtree: true
-	});
+		}).observe(document, {
+			childList: true,
+			subtree: true
+		});
+	}
+	ready(readyId, runtimeId);
 }
 function init(runtimeId = "M") {
-	if (curRuntimeId) {
-		if (curRuntimeId !== runtimeId) throw new Error(`Marko initialized multiple times with different $global.runtimeId's of ${JSON.stringify(runtimeId)} and ${JSON.stringify(curRuntimeId)}.`);
+	if (curRenders) {
+		if (curRenders !== self[runtimeId]) throw new Error(`Marko initialized multiple times with different $global.runtimeId's.`);
 		return;
 	}
-	curRuntimeId = runtimeId;
-	let resumeRender;
 	const renders = self[runtimeId];
 	const defineRuntime = (desc) => Object.defineProperty(self, runtimeId, desc);
 	const initRuntime = (renders) => {
-		defineRuntime({ value: resumeRender = ((renderId) => {
-			const render = resumeRender[renderId] = renders[renderId] || renders(renderId);
+		defineRuntime({ value: curRenders = ((renderId) => {
+			const render = curRenders[renderId] = renders[renderId] || renders(renderId);
 			const walk = render.w;
-			const scopeLookup = render.s = {};
-			const getScope = (id) => scopeLookup[id] ||= { ["#Id"]: +id };
-			const serializeContext = { _: registeredValues };
-			const visitBranches = branchesEnabled && ((branchScopesStack = [], branchStarts = [], orphanBranches = [], curBranchScopes) => {
+			const scopeLookup = {};
+			const getScope = (id) => scopeLookup[id] || initScope(scopeLookup[id] = { ["#Id"]: +id });
+			const initGlobal = () => $global ||= {
+				runtimeId,
+				renderId
+			};
+			const initScope = (scope) => {
+				scope["$global"] = initGlobal();
+				if (branchesEnabled && scope["#ClosestBranchId"]) scope["#ClosestBranch"] = getScope(scope["#ClosestBranchId"]);
+				return scope;
+			};
+			const applyScopes = (partials) => {
+				let scopeId = partials[0];
+				for (let i = 1; i < partials.length; i++) {
+					const partial = partials[i];
+					if (typeof partial === "number") scopeId += partial;
+					else {
+						if (scopeId) initScope(Object.assign(scopeLookup[scopeId] ||= (partial["#Id"] = scopeId, partial), partial));
+						else Object.assign(initGlobal(), partial);
+						scopeId++;
+					}
+				}
+			};
+			const serializeContext = ((data, registryId) => typeof data === "number" ? registryId ? registeredValues[registryId](getScope(data)) : getScope(data) : applyScopes(data));
+			const createVisitBranches = (branchScopesStack = [], branchStarts = [], orphanBranches = [], curBranchScopes) => {
 				return (branchId, branch, endedBranches, accessor, singleNode, parent = visit.parentNode, startVisit = visit, i = orphanBranches.length) => {
 					if (visitType !== "[") {
 						visitScope[nextToken()] = visitType === ")" || visitType === "}" ? parent : visit;
@@ -619,7 +651,7 @@ function init(runtimeId = "M") {
 						nextToken();
 					}
 					if (endedBranches) {
-						orphanBranches.push(...endedBranches);
+						for (const ended of endedBranches) orphanBranches.push(ended);
 						if (singleNode) visitScope[accessor] = endedBranches.length > 1 ? endedBranches.reverse() : endedBranches[0];
 					}
 					if (visitType === "[") {
@@ -630,46 +662,51 @@ function init(runtimeId = "M") {
 						branchStarts.push(visit);
 					}
 				};
-			})();
+			};
 			const nextToken = () => lastToken = visitText.slice(lastTokenIndex, (lastTokenIndex = visitText.indexOf(" ", lastTokenIndex) + 1 || visitText.length + 1) - 1);
+			const processResumes = (resumes = [], effects) => {
+				let i = 0;
+				for (; i < resumes.length; i++) {
+					const serialized = resumes[i];
+					if (typeof serialized === "string") {
+						lastTokenIndex = 0;
+						visitText = serialized;
+						while (nextToken()) if (/\D/.test(lastToken)) lastEffect = registeredValues[lastToken];
+						else effects.push(lastEffect, getScope(lastToken));
+					} else if (Array.isArray(serialized)) {
+						if (!(readyIds && serialized.every((dep) => readyIds.has(dep) && !render.b[dep].length))) break;
+					} else if (readyIds && typeof serialized === "number") break;
+					else {
+						const scopes = serialized(serializeContext);
+						if (Array.isArray(scopes)) applyScopes(scopes);
+					}
+				}
+				resumes.splice(0, i);
+				return i;
+			};
 			let $global;
 			let lastEffect;
 			let visits;
-			let resumes;
 			let visit;
 			let visitText;
 			let visitType;
 			let visitScope;
 			let lastToken;
 			let lastTokenIndex;
-			let lastScopeId = 0;
+			let visitBranches;
+			let embedAnchor;
+			serializeContext._ = registeredValues;
 			if (render.m) throw new Error(`Marko rendered multiple times with $global.runtimeId as ${JSON.stringify(runtimeId)} and $global.renderId as ${JSON.stringify(renderId)}. Ensure each render into a page has a unique $global.renderId.`);
-			render.m = (effects = []) => {
-				if (readyLookup) {
-					for (const readyId in render.b) if (readyLookup[readyId] !== 1) {
-						readyLookup[readyId] = ((prev) => () => {
-							runResumeEffects(render);
-							prev?.();
-						})(readyLookup[readyId]);
-						return effects;
+			render.m = (effects) => {
+				processResumes(render.r, effects);
+				if (readyIds && render.b) for (let progress = 1; progress;) {
+					progress = 0;
+					for (const readyId of readyIds) {
+						const resumes = render.b[readyId];
+						if (resumes && processResumes(resumes, effects)) progress = 1;
 					}
-					render.b = 0;
-				}
-				for (const serialized of resumes = render.r || []) if (typeof serialized === "string") {
-					lastTokenIndex = 0;
-					visitText = serialized;
-					while (nextToken()) if (/\D/.test(lastToken)) lastEffect = registeredValues[lastToken];
-					else effects.push(lastEffect, getScope(lastToken));
-				} else for (const scope of serialized(serializeContext)) if (!$global) {
-					$global = scope || {};
-					$global.runtimeId = runtimeId;
-					$global.renderId = renderId;
-				} else if (typeof scope === "number") lastScopeId += scope;
-				else {
-					scopeLookup[scope["#Id"] = ++lastScopeId] = scope;
-					scope["$global"] = $global;
-					if (branchesEnabled) scope["#ClosestBranch"] = getScope(scope["#ClosestBranchId"]);
 				}
+				let retained = 0;
 				for (visit of visits = render.v) {
 					lastTokenIndex = render.i.length;
 					visitText = visit.data;
@@ -678,10 +715,11 @@ function init(runtimeId = "M") {
 					if (visitType === "*") {
 						const prev = visit.previousSibling;
 						visitScope[nextToken()] = prev && (prev.nodeType < 8 || prev.data) ? prev : visit.parentNode.insertBefore(new Text(), visit);
-					} else if (branchesEnabled) visitBranches();
+					} else if (branchesEnabled) (visitBranches ||= createVisitBranches())();
+					else if (render.b) visits[retained++] = visit;
 				}
-				if (embedEnabled) render.n ||= visit?.parentNode.insertBefore(new Text(), visit.nextSibling);
-				visits.length = resumes.length = 0;
+				if (embedRenders && !embedAnchor && visit) embedRenders.set(embedAnchor = visit.parentNode.insertBefore(new Text(), visit.nextSibling), [renderId, scopeLookup]);
+				visits.length = retained;
 				return effects;
 			};
 			render.w = () => {
@@ -693,7 +731,7 @@ function init(runtimeId = "M") {
 	};
 	if (renders) {
 		initRuntime(renders);
-		for (const renderId in renders) runResumeEffects(resumeRender(renderId));
+		for (const renderId in renders) runResumeEffects(curRenders(renderId));
 	} else defineRuntime({
 		configurable: true,
 		set: initRuntime
@@ -703,7 +741,7 @@ let isResuming;
 function runResumeEffects(render) {
 	try {
 		isResuming = 1;
-		runEffects(render.m(), 1);
+		runEffects(render.m([]), 1);
 	} finally {
 		isResuming = 0;
 	}
@@ -1172,50 +1210,41 @@ function _await_promise(nodeAccessor, params) {
 	_enable_catch();
 	return (scope, promise) => {
 		let awaitBranch = scope[branchAccessor];
-		const tryBranch = findBranchWithKey(scope, "#PlaceholderContent") || awaitBranch;
+		const tryPlaceholder = findBranchWithKey(scope, "#PlaceholderContent");
+		const tryBranch = tryPlaceholder || awaitBranch;
 		let awaitCounter = tryBranch["#AwaitCounter"];
-		if (!awaitCounter?.i) awaitCounter = tryBranch["#AwaitCounter"] = {
-			i: 0,
-			c() {
-				if (--awaitCounter.i) return 1;
-				if (tryBranch === scope[branchAccessor]) {
-					if (scope[nodeAccessor].parentNode) scope[nodeAccessor].replaceWith(scope[branchAccessor]["#StartNode"].parentNode);
-				} else {
-					const placeholderBranch = tryBranch["#PlaceholderBranch"];
-					if (placeholderBranch) {
-						tryBranch["#PlaceholderBranch"] = 0;
-						placeholderBranch["#StartNode"].parentNode.insertBefore(tryBranch["#StartNode"].parentNode, placeholderBranch["#StartNode"]);
-						removeAndDestroyBranch(placeholderBranch);
-					}
+		placeholderShown.add(pendingEffects);
+		if (tryPlaceholder) {
+			if (!scope[promiseAccessor]) {
+				if (awaitBranch) awaitBranch["#PendingRenders"] ||= [];
+				awaitCounter = addAwaitCounter(scope, tryPlaceholder);
+			}
+		} else {
+			if (!awaitCounter?.i) awaitCounter = tryBranch["#AwaitCounter"] = {
+				i: 0,
+				c() {
+					if (--awaitCounter.i) return 1;
+					if (tryBranch === scope[branchAccessor]) {
+						if (scope[nodeAccessor].parentNode) scope[nodeAccessor].replaceWith(scope[branchAccessor]["#StartNode"].parentNode);
+					} else dismissPlaceholder(tryBranch);
+					queueEffect(tryBranch, runPendingEffects);
 				}
-				queueEffect(tryBranch, (scope) => {
-					const pendingEffects = scope["#PendingEffects"];
-					if (pendingEffects) {
-						scope["#PendingEffects"] = [];
-						runEffects(pendingEffects, 1);
+			};
+			if (!scope[promiseAccessor]) {
+				if (awaitBranch) awaitBranch["#PendingRenders"] ||= [];
+				if (!awaitCounter.i++) requestAnimationFrame(() => awaitCounter.i && runEffects(prepareEffects(() => queueRender(scope, () => {
+					if (!awaitBranch["#DetachedAwait"]) {
+						awaitBranch["#StartNode"].parentNode.insertBefore(scope[nodeAccessor], awaitBranch["#StartNode"]);
+						tempDetachBranch(tryBranch);
 					}
-				});
+				}, -1))));
 			}
-		};
-		placeholderShown.add(pendingEffects);
-		if (!scope[promiseAccessor]) {
-			if (awaitBranch) awaitBranch["#PendingRenders"] ||= [];
-			if (!awaitCounter.i++) requestAnimationFrame(() => awaitCounter.i && runEffects(prepareEffects(() => queueRender(tryBranch === awaitBranch ? scope : tryBranch, () => {
-				if (tryBranch["#PlaceholderContent"]) {
-					insertBranchBefore(tryBranch["#PlaceholderBranch"] = createAndSetupBranch(scope["$global"], tryBranch["#PlaceholderContent"], tryBranch["_"], tryBranch["#StartNode"].parentNode), tryBranch["#StartNode"].parentNode, tryBranch["#StartNode"]);
-					tempDetachBranch(tryBranch);
-				} else if (!awaitBranch["#DetachedAwait"]) {
-					awaitBranch["#StartNode"].parentNode.insertBefore(scope[nodeAccessor], awaitBranch["#StartNode"]);
-					tempDetachBranch(tryBranch);
-				}
-			}, -1))));
 		}
 		const thisPromise = scope[promiseAccessor] = promise.then((data) => {
 			if (thisPromise === scope[promiseAccessor]) {
 				const referenceNode = scope[nodeAccessor];
 				scope[promiseAccessor] = 0;
-				queueMicrotask(run);
-				queueRender(scope, () => {
+				queueAsyncRender(scope, () => {
 					if ((awaitBranch = scope[branchAccessor])["#DetachedAwait"]) {
 						pendingScopes.push(awaitBranch);
 						setupBranch(awaitBranch["#DetachedAwait"], awaitBranch);
@@ -1231,7 +1260,7 @@ function _await_promise(nodeAccessor, params) {
 					awaitCounter.c();
 					if (awaitCounter.m) {
 						const fnScopes = /* @__PURE__ */ new Map();
-						const effects = awaitCounter.m();
+						const effects = awaitCounter.m([]);
 						for (let i = 0; i < pendingEffects.length;) {
 							const fn = pendingEffects[i++];
 							let scopes = fnScopes.get(fn);
@@ -1244,13 +1273,12 @@ function _await_promise(nodeAccessor, params) {
 							if (!fnScopes.get(fn)?.has(scope)) queueEffect(scope, fn);
 						}
 					}
-				}, -1);
+				});
 			}
 		}, (error) => {
 			if (thisPromise === scope[promiseAccessor]) {
 				awaitCounter.i = scope[promiseAccessor] = 0;
-				schedule();
-				queueRender(scope, renderCatch, -1, error);
+				queueAsyncRender(scope, renderCatch, error);
 			}
 		});
 	};
@@ -1263,6 +1291,39 @@ function _await_content(nodeAccessor, template, walks, setup) {
 		pendingScopes.pop();
 	};
 }
+function addAwaitCounter(scope, tryBranch = findBranchWithKey(scope, "#PlaceholderContent")) {
+	if (!tryBranch) return;
+	let awaitCounter = tryBranch["#AwaitCounter"];
+	if (!awaitCounter?.i) awaitCounter = tryBranch["#AwaitCounter"] = {
+		i: 0,
+		c() {
+			if (--awaitCounter.i) return 1;
+			dismissPlaceholder(tryBranch);
+			queueEffect(tryBranch, runPendingEffects);
+		}
+	};
+	placeholderShown.add(pendingEffects);
+	if (!awaitCounter.i++) requestAnimationFrame(() => awaitCounter.i && runEffects(prepareEffects(() => queueRender(tryBranch, () => {
+		insertBranchBefore(tryBranch["#PlaceholderBranch"] = createAndSetupBranch(tryBranch["$global"], tryBranch["#PlaceholderContent"], tryBranch["_"], tryBranch["#StartNode"].parentNode), tryBranch["#StartNode"].parentNode, tryBranch["#StartNode"]);
+		tempDetachBranch(tryBranch);
+	}, -1))));
+	return awaitCounter;
+}
+function runPendingEffects(scope) {
+	const effects = scope["#PendingEffects"];
+	if (effects) {
+		scope["#PendingEffects"] = [];
+		runEffects(effects, 1);
+	}
+}
+function dismissPlaceholder(tryBranch) {
+	const placeholderBranch = tryBranch["#PlaceholderBranch"];
+	if (placeholderBranch) {
+		tryBranch["#PlaceholderBranch"] = 0;
+		placeholderBranch["#StartNode"].parentNode.insertBefore(tryBranch["#StartNode"].parentNode, placeholderBranch["#StartNode"]);
+		removeAndDestroyBranch(placeholderBranch);
+	}
+}
 function _try(nodeAccessor, template, walks, setup) {
 	const branchAccessor = "BranchScopes:" + nodeAccessor;
 	const renderer = _content("", template, walks, setup)();
@@ -1541,6 +1602,10 @@ function run() {
 	}
 	runEffects(effects);
 }
+function queueAsyncRender(scope, signal, value) {
+	queueRender(scope, signal, -1, value);
+	queueMicrotask(run);
+}
 function prepareEffects(fn) {
 	const prevRenders = pendingRenders;
 	const prevEffects = pendingEffects;
@@ -1585,12 +1650,17 @@ function runRenders() {
 			}
 			pendingRenders[i] = item;
 		}
-		if (!render["scope"]["#ClosestBranch"]?.["#Destroyed"]) runRender(render);
+		runRender(render);
 	}
 	for (const scope of pendingScopes) scope["#Creating"] = 0;
 	pendingScopes = [];
 }
 let runRender = (render) => render["signal"](render["scope"], render["value"]);
+function skipDestroyedRenders() {
+	runRender = ((runRender) => (render) => {
+		if (!render["scope"]["#ClosestBranch"]?.["#Destroyed"]) runRender(render);
+	})(runRender);
+}
 let catchEnabled;
 function _enable_catch() {
 	if (!catchEnabled) {
@@ -1651,23 +1721,33 @@ function abort(ctrl) {
 }
 //#endregion
 //#region src/common/compat-meta.ts
-const RENDERER_REGISTER_ID = "$compat_renderer";
 const SET_SCOPE_REGISTER_ID = "$compat_setScope";
 const RENDER_BODY_ID = "$compat_renderBody";
 //#endregion
 //#region src/dom/compat.ts
 const classIdToBranch = /* @__PURE__ */ new Map();
+const scopesByRender = /* @__PURE__ */ new WeakMap();
+const getRenderScopes = ($global) => {
+	const render = self[$global.runtimeId]?.[$global.renderId];
+	let scopes = render && scopesByRender.get(render);
+	if (render && !scopes) scopesByRender.set(render, scopes = {});
+	return scopes;
+};
 const compat = {
 	patchDynamicTag,
 	queueEffect,
 	init(warp10Noop) {
-		_resume(SET_SCOPE_REGISTER_ID, (branch) => {
-			classIdToBranch.set(branch.m5c, branch);
+		_resume(SET_SCOPE_REGISTER_ID, (scope) => {
+			getRenderScopes(scope["$global"])[scope["#Id"]] = scope;
+			if (scope.m5c) classIdToBranch.set(scope.m5c, scope);
 		});
 		_resume(RENDER_BODY_ID, warp10Noop);
 	},
-	registerRenderer(fn) {
-		_resume(RENDERER_REGISTER_ID, fn);
+	getScope($global, scopeId) {
+		return getRenderScopes($global)?.[scopeId];
+	},
+	setRendererId(renderer, id) {
+		renderer["id"] = id;
 	},
 	isRenderer(renderer) {
 		return renderer["clone"];
@@ -1686,7 +1766,7 @@ const compat = {
 		if (this.scope) destroyBranch(this.scope);
 	},
 	resolveRegistered(value, $global) {
-		if (Array.isArray(value) && typeof value[0] === "string") return getRegisteredWithScope(value[0], value.length === 2 && self[$global.runtimeId]?.[$global.renderId]?.s[value[1]]);
+		if (Array.isArray(value) && typeof value[0] === "string") return getRegisteredWithScope(value[0], getRenderScopes($global)?.[value[1]]);
 		return value;
 	},
 	createRenderer(params, clone) {
@@ -1792,6 +1872,109 @@ function mount(input = {}, reference, position) {
 	};
 }
 //#endregion
+//#region src/dom/load.ts
+function _load_template(id, load) {
+	_enable_catch();
+	let pending;
+	const lazyTemplate = _template(id, 0, 0, (branch) => {
+		const awaitCounter = addAwaitCounter(branch);
+		branch["#Load"] ||= /* @__PURE__ */ new Map();
+		(pending ||= load()).then((renderer) => {
+			Object.assign(lazyTemplate, renderer);
+			queueAsyncRender(branch, (branch) => insertLoaded(renderer, branch, branch["#StartNode"], awaitCounter));
+		}, loadFailed(branch, awaitCounter));
+	}, _load_signal(() => (pending ||= load()).then((r) => ({ _: r["params"] }))));
+	return lazyTemplate;
+}
+function _load_setup(nodeAccessor, childScopeAccessor, load) {
+	let pending;
+	let renderer;
+	_enable_catch();
+	return (owner) => {
+		const child = owner[childScopeAccessor];
+		if (renderer) insertLoaded(renderer, child, owner[nodeAccessor]);
+		else {
+			const awaitCounter = addAwaitCounter(owner);
+			child["#Load"] ||= /* @__PURE__ */ new Map();
+			(pending ||= load()).then((mod) => {
+				renderer = _content("", ...mod._)();
+				queueAsyncRender(child, (child) => insertLoaded(renderer, child, owner[nodeAccessor], awaitCounter));
+			}, loadFailed(child, awaitCounter));
+		}
+	};
+}
+function insertLoaded(renderer, branch, marker, awaitCounter) {
+	const parent = marker.parentNode;
+	branch["#Creating"] = 1;
+	renderer["clone"](branch, parent.namespaceURI);
+	setupBranch(renderer, branch);
+	applyLoad(branch, () => {
+		insertBranchBefore(branch, parent, marker);
+		marker.remove();
+		pendingScopes.push(branch);
+		awaitCounter?.c();
+	});
+}
+function loadFailed(scope, awaitCounter) {
+	return (error) => {
+		if (awaitCounter) awaitCounter.i = 0;
+		queueAsyncRender(scope, renderCatch, error);
+	};
+}
+function applyLoad(scope, insert) {
+	const values = scope["#Load"];
+	let remaining;
+	scope["#Load"] = 0;
+	if (remaining = values?.size) for (const [promise, entry] of values) promise.then((signal) => {
+		entry["signal"] = signal;
+		if (!--remaining) {
+			scope["#Creating"] = 1;
+			pendingScopes.push(scope);
+			queueAsyncRender(scope, (scope) => {
+				values.forEach((e) => e["signal"]._(scope, e["value"]));
+				insert();
+			});
+		}
+	}, () => 0);
+	else insert();
+}
+function _load_signal(load) {
+	let pending;
+	let signal;
+	return (scope, value) => {
+		pending ||= load();
+		if (scope["#Load"] || !("#Load" in scope) && scope["#Creating"]) (scope["#Load"] ||= /* @__PURE__ */ new Map()).set(pending, { ["value"]: value });
+		else if (signal) signal(scope, value);
+		else pending.then((mod) => queueAsyncRender(scope, signal = mod._, value), () => 0);
+	};
+}
+function _load_visible_trigger(selector, options) {
+	let pending;
+	let el;
+	return (load) => () => (pending ||= new Promise((resolve) => (el = getSelectorOrResolve(selector, resolve)) && new IntersectionObserver((entries, io) => entries.some((entry) => entry.isIntersecting) && resolve(io.disconnect()), options).observe(el))).then(load);
+}
+function _load_idle_trigger(options) {
+	let pending;
+	return (load) => () => (pending ||= new Promise((resolve) => (self.requestIdleCallback || resolve)(resolve, options))).then(load);
+}
+function _load_event_trigger(event, selector) {
+	let pending;
+	return (load) => () => (pending ||= new Promise((resolve) => getSelectorOrResolve(selector, resolve)?.addEventListener(event, resolve, { once: true }))).then(load);
+}
+function _load_media_trigger(query) {
+	let pending;
+	let mql;
+	return (load) => () => (pending ||= new Promise((resolve) => (mql = matchMedia(query)).matches ? resolve() : mql.addEventListener("change", resolve, { once: true }))).then(load);
+}
+function _load_race_trigger(...triggers) {
+	const noop = () => Promise.resolve();
+	let pending;
+	return (load) => () => (pending ||= Promise.race(triggers.map((t) => t(noop)()))).then(load);
+}
+function getSelectorOrResolve(selector, resolve) {
+	return document.querySelector(selector) || (console.warn(`A lazy load trigger could not find an element matching "${selector}". The module was loaded immediately.`), resolve());
+}
+//#endregion
 exports.$signal = $signal;
 exports.$signalReset = $signalReset;
 exports._assert_hoist = _assert_hoist;
@@ -1862,7 +2045,16 @@ exports._id = _id;
 exports._if = _if;
 exports._if_closure = _if_closure;
 exports._let = _let;
+exports._let_change = _let_change;
 exports._lifecycle = _lifecycle;
+exports._load_event_trigger = _load_event_trigger;
+exports._load_idle_trigger = _load_idle_trigger;
+exports._load_media_trigger = _load_media_trigger;
+exports._load_race_trigger = _load_race_trigger;
+exports._load_setup = _load_setup;
+exports._load_signal = _load_signal;
+exports._load_template = _load_template;
+exports._load_visible_trigger = _load_visible_trigger;
 exports._on = _on;
 exports._or = _or;
 exports._resume = _resume;
@@ -1887,4 +2079,5 @@ exports.forTo = forTo;
 exports.forUntil = forUntil;
 exports.init = init;
 exports.initEmbedded = initEmbedded;
+exports.ready = ready;
 exports.run = run;