marko 6.3.34 → 6.3.35

package/dist/debug/html.js

@@ -35,6 +35,7 @@ const LoopKey = "#LoopKey";
 const PlaceholderContent = "#PlaceholderContent";
 const Renderer = "#Renderer";
 const TagVariable = "#TagVariable";
+const Owner = "owner";
 const Embed = "embed";
 //#endregion
 //#region src/common/helpers.ts
@@ -224,10 +225,16 @@ function assertExclusiveAttrs(attrs, onError = throwErr) {
 			(exclusiveAttrs ||= []).push("checkedValueChange");
 			if ("checked" in attrs) exclusiveAttrs.push("checked");
 		}
-		if (attrs.valueChange) (exclusiveAttrs ||= []).push("valueChange");
+		if (attrs.valueChange) {
+			(exclusiveAttrs ||= []).push("valueChange");
+			if ("checked" in attrs && !exclusiveAttrs.includes("checked")) exclusiveAttrs.push("checked");
+		}
 		if (exclusiveAttrs && exclusiveAttrs.length > 1) onError(`The attributes ${joinWithAnd(exclusiveAttrs)} are mutually exclusive.`);
 	}
 }
+function assertNoValueBindingOnCheckable(type, valueChange) {
+	if (valueChange && /^(?:button|checkbox|hidden|image|radio|reset|submit)$/i.test(type)) console.error(`\`valueChange\` cannot be used on a \`type="${type}"\` \`<input>\` — user interaction can never change its \`value\`.` + (/^[cr]/i.test(type) ? " Bind `checked` or `checkedValue` instead." : ""));
+}
 function assertHandlerIsFunction(name, value) {
 	if (value && typeof value !== "function") throw new Error(`The \`${name}\` handler must be a function or a falsey value (\`null\`, \`undefined\`, \`false\`, \`0\`, …), but received type "${typeof value}".`);
 }
@@ -258,8 +265,8 @@ function _unescaped(val) {
 	assertValidTextValue(val);
 	return val ? val + "" : val === 0 ? "0" : "";
 }
-const unsafeXMLReg = /[<&]/g;
-const replaceUnsafeXML = (c) => c === "&" ? "&amp;" : "&lt;";
+const unsafeXMLReg = /[<&\r]/g;
+const replaceUnsafeXML = (c) => c === "&" ? "&amp;" : c === "<" ? "&lt;" : "&#13;";
 const escapeXMLStr = (str) => unsafeXMLReg.test(str) ? str.replace(unsafeXMLReg, replaceUnsafeXML) : str;
 function _escape(val) {
 	assertValidTextValue(val);
@@ -572,7 +579,18 @@ function setDebugInfo(obj, file, loc, vars) {
 	DEBUG.set(obj, {
 		file,
 		loc,
-		vars
+		vars,
+		slots: DEBUG.get(obj)?.slots
+	});
+}
+function setDebugSlotName(obj, accessor, name) {
+	const debug = DEBUG.get(obj);
+	if (debug) (debug.slots ??= {})[accessor] = name;
+	else DEBUG.set(obj, {
+		file: "",
+		loc: 0,
+		vars: void 0,
+		slots: { [accessor]: name }
 	});
 }
 var Serializer = class {
@@ -1471,21 +1489,27 @@ function throwUnserializable(state, cause, ref = null, accessor = "") {
 	if (cause !== void 0 && state.boundary?.abort) {
 		let message = "Unable to serialize";
 		let access = "";
-		while (ref?.accessor) {
+		while (ref) {
+			const { accessor } = ref;
 			const debug = ref.parent?.debug;
-			if (debug) {
-				const varLoc = debug.vars?.[ref.accessor];
-				let debugAccess = ref.accessor;
+			if (accessor && debug) {
+				const rawAccessor = fromObjectKey(accessor);
+				const varLoc = debug.vars?.[rawAccessor];
+				const slotName = debug.slots?.[rawAccessor];
+				let debugAccess = varLoc ? rawAccessor : void 0;
 				let debugLoc = debug.loc;
 				if (varLoc) if (Array.isArray(varLoc)) {
 					debugAccess = varLoc[0];
 					if (varLoc[1]) debugLoc = varLoc[1];
 				} else debugLoc = varLoc;
-				message += ` ${JSON.stringify(debugAccess)} in ${debug.file}`;
+				let display;
+				if (debugAccess !== void 0) display = slotName && debugAccess.startsWith("...") ? `\`${slotName}\` from \`${debugAccess}\`` : JSON.stringify(debugAccess);
+				else display = describeAccessor(rawAccessor, slotName) ?? JSON.stringify(rawAccessor);
+				message += ` ${display} in ${debug.file}`;
 				if (debugLoc) message += `:${debugLoc}`;
 				break;
 			}
-			access = toAccess(ref.accessor) + access;
+			if (accessor) access = toAccess(accessor) + access;
 			ref = ref.parent;
 		}
 		if (accessor) access = toAccess(accessor) + access;
@@ -1497,6 +1521,40 @@ function throwUnserializable(state, cause, ref = null, accessor = "") {
 		state.boundary.abort(err);
 	}
 }
+const accessorPrefixDescriptions = {
+	BranchScopes: "the branch scopes",
+	ClosureScopes: "the closure scopes",
+	ClosureSignalIndex: "the closure signal index",
+	ConditionalRenderer: "the conditional renderer",
+	ControlledObserver: "the controlled observer",
+	ControlledHandler: "the change handler",
+	ControlledType: "the controlled type",
+	ControlledValue: "the controlled value",
+	DynamicHTMLLastChild: "the dynamic html",
+	EventAttributes: "the event handlers",
+	IdFallback: "the generated id",
+	KeyedScopes: "the keyed scopes",
+	Lifecycle: "the lifecycle handlers",
+	Promise: "the pending promise",
+	TagVariableChange: "the tag variable change handler"
+};
+function describeAccessor(accessor, slotName) {
+	const sep = accessor.indexOf(":");
+	if (~sep) {
+		const description = slotName === void 0 ? accessorPrefixDescriptions[accessor.slice(0, sep)] : `the \`${slotName}\` handler`;
+		if (description) {
+			const node = /^#([a-z-]+)\//i.exec(accessor.slice(sep + 1));
+			return node ? `${description} of \`<${node[1]}>\`` : description;
+		}
+	}
+}
+function fromObjectKey(key) {
+	try {
+		if (key[0] === "\"") return JSON.parse(key.replace(/\\x/g, "\\u00"));
+		if (key[0] === "[") return JSON.parse(key.slice(1, -1));
+	} catch {}
+	return key;
+}
 function trackChannel(state, ref) {
 	const refReadyId = ref.channel?.readyId;
 	if (!refReadyId || refReadyId === state.channel?.readyId) return true;
@@ -1877,6 +1935,9 @@ function getContext(key) {
 function getState() {
 	return $chunk.boundary.state;
 }
+function rendererKey(renderer) {
+	return renderer?.["owner"] === void 0 ? renderer?.["id"] || renderer : renderer["id"] + " " + renderer[Owner];
+}
 function getScopeId(scope) {
 	return scope[K_SCOPE_ID];
 }
@@ -1972,7 +2033,7 @@ function _attr_content(nodeAccessor, scopeId, content, serializeReason) {
 	if (_peek_scope_id() !== branchId) {
 		if (shouldResume) writeScope(scopeId, {
 			[BranchScopes + nodeAccessor]: writeScope(branchId, {}),
-			[ConditionalRenderer + nodeAccessor]: render?.["id"]
+			[ConditionalRenderer + nodeAccessor]: rendererKey(render)
 		});
 	} else _scope_id();
 }
@@ -2806,7 +2867,7 @@ function _attr_textarea_value(scopeId, nodeAccessor, value, valueChange, seriali
 }
 function _textarea_value(value) {
 	const escaped = _escape(normalizeStrAttrValue(value));
-	return escaped[0] === "\n" || escaped[0] === "\r" ? "\n" + escaped : escaped;
+	return escaped[0] === "\n" ? "\n" + escaped : escaped;
 }
 function _attr_input_value(scopeId, nodeAccessor, value, valueChange, serializeType) {
 	if (valueChange) writeControlledScope(2, scopeId, nodeAccessor, void 0, valueChange, serializeType);
@@ -2870,6 +2931,7 @@ function _attrs(data, nodeAccessor, scopeId, tagName) {
 				result += _attr_input_checkedValue(scopeId, nodeAccessor, data.checkedValue, data.checkedValueChange, data.value, 1);
 				skip = /^(?:value|checked(?:Value)?)(?:Change)?$|[\s/>"'=]/;
 			} else if (data.valueChange) {
+				assertNoValueBindingOnCheckable(data.type, data.valueChange);
 				result += _attr_input_value(scopeId, nodeAccessor, data.value, data.valueChange, 1);
 				skip = /^value(?:Change)?$|[\s/>"'=]/;
 			}
@@ -2936,21 +2998,22 @@ function _attrs_partial_content(data, skip, nodeAccessor, scopeId, tagName, seri
 	_attr_content(nodeAccessor, scopeId, data?.content, serializeReason);
 }
 function writeControlledScope(type, scopeId, nodeAccessor, value, valueChange, serializeType) {
-	assertHandlerIsFunction([
+	var handlerName = [
 		"checkedChange",
 		"checkedValueChange",
 		"valueChange",
 		"valueChange",
 		"openChange"
-	][type], valueChange);
-	writeScope(scopeId, serializeType ? {
+	][type];
+	assertHandlerIsFunction(handlerName, valueChange);
+	setDebugSlotName(writeScope(scopeId, serializeType ? {
 		[ControlledType + nodeAccessor]: type,
 		[ControlledValue + nodeAccessor]: value,
 		[ControlledHandler + nodeAccessor]: valueChange
 	} : {
 		[ControlledValue + nodeAccessor]: value,
 		[ControlledHandler + nodeAccessor]: valueChange
-	});
+	}), ControlledHandler + nodeAccessor, handlerName);
 }
 function stringAttr(name, value) {
 	return value && " " + name + attrAssignment(value);
@@ -3053,16 +3116,17 @@ let _dynamic_tag = (scopeId, accessor, tag, inputOrArgs, content, inputIsArgs, s
 		}
 	}
 	if (rendered) {
-		if (shouldResume) writeScope(scopeId, { [ConditionalRenderer + accessor]: renderer?.["id"] || renderer });
+		if (shouldResume) writeScope(scopeId, { [ConditionalRenderer + accessor]: rendererKey(renderer) });
 	} else _scope_id();
 	return result;
 };
-function _content(id, fn) {
+function _content(id, fn, scopeId) {
 	fn["id"] = id;
+	fn[Owner] = scopeId;
 	return fn;
 }
 function _content_resume(id, fn, scopeId) {
-	return _resume(_content(id, fn), id, scopeId);
+	return _resume(_content(id, fn, scopeId), id, scopeId);
 }
 const patchDynamicTag = ((originalDynamicTag) => (patch) => {
 	_dynamic_tag = (scopeId, accessor, tag, input, content, inputIsArgs, resume) => {
@@ -3383,14 +3447,17 @@ function writeTriggerScript(html, triggers) {
 	const exprs = triggers.map((trigger) => {
 		const options = trigger.options && toObjectExpression(trigger.options);
 		switch (trigger.type) {
-			case "visible": return `(e=>e&&new IntersectionObserver((e,i)=>e.some(e=>e.isIntersecting)&&i.disconnect()+l()${options ? `,${options}` : ""}).observe(e))(document.querySelector(${JSON.stringify(trigger.selector)})||l())`;
+			case "visible": return `(e=>e&&new IntersectionObserver((e,i)=>e.some(e=>e.isIntersecting)&&i.disconnect()+l()${options ? `,${options}` : ""}).observe(e))(${querySelectorOrLoad(trigger.selector)})`;
 			case "idle": return `(self.requestIdleCallback||l)(l${options ? `,${options}` : ""})`;
 			case "media": return `(m=>m.matches?l():m.addEventListener("change",l,{once:1}))(matchMedia(${JSON.stringify(trigger.selector)}))`;
-			default: return `(e=>e?.addEventListener("${trigger.type.slice(3)}",l,{once:1}))(document.querySelector(${JSON.stringify(trigger.selector)})||l())`;
+			default: return `(e=>e?.addEventListener("${trigger.type.slice(3)}",l,{once:1}))(${querySelectorOrLoad(trigger.selector)})`;
 		}
 	});
 	writeScript(`((p,h,d,l=$=>{d||p.after(new Range().createContextualFragment(d=h))})=>${exprs.length > 1 ? `{${exprs.join(";")}}` : exprs[0]})(document.currentScript,${htmlStr})`);
 }
+function querySelectorOrLoad(selector) {
+	return `document.querySelector(${JSON.stringify(selector)})||${`(console.warn(${JSON.stringify(`A lazy load trigger could not find an element matching "${selector}". The module was loaded immediately.`)}),l())`}`;
+}
 function toObjectExpression(options) {
 	let result = "{";
 	let sep = "";

package/dist/debug/html.mjs

@@ -33,6 +33,7 @@ const LoopKey = "#LoopKey";
 const PlaceholderContent = "#PlaceholderContent";
 const Renderer = "#Renderer";
 const TagVariable = "#TagVariable";
+const Owner = "owner";
 const Embed = "embed";
 //#endregion
 //#region src/common/helpers.ts
@@ -222,10 +223,16 @@ function assertExclusiveAttrs(attrs, onError = throwErr) {
 			(exclusiveAttrs ||= []).push("checkedValueChange");
 			if ("checked" in attrs) exclusiveAttrs.push("checked");
 		}
-		if (attrs.valueChange) (exclusiveAttrs ||= []).push("valueChange");
+		if (attrs.valueChange) {
+			(exclusiveAttrs ||= []).push("valueChange");
+			if ("checked" in attrs && !exclusiveAttrs.includes("checked")) exclusiveAttrs.push("checked");
+		}
 		if (exclusiveAttrs && exclusiveAttrs.length > 1) onError(`The attributes ${joinWithAnd(exclusiveAttrs)} are mutually exclusive.`);
 	}
 }
+function assertNoValueBindingOnCheckable(type, valueChange) {
+	if (valueChange && /^(?:button|checkbox|hidden|image|radio|reset|submit)$/i.test(type)) console.error(`\`valueChange\` cannot be used on a \`type="${type}"\` \`<input>\` — user interaction can never change its \`value\`.` + (/^[cr]/i.test(type) ? " Bind `checked` or `checkedValue` instead." : ""));
+}
 function assertHandlerIsFunction(name, value) {
 	if (value && typeof value !== "function") throw new Error(`The \`${name}\` handler must be a function or a falsey value (\`null\`, \`undefined\`, \`false\`, \`0\`, …), but received type "${typeof value}".`);
 }
@@ -256,8 +263,8 @@ function _unescaped(val) {
 	assertValidTextValue(val);
 	return val ? val + "" : val === 0 ? "0" : "";
 }
-const unsafeXMLReg = /[<&]/g;
-const replaceUnsafeXML = (c) => c === "&" ? "&amp;" : "&lt;";
+const unsafeXMLReg = /[<&\r]/g;
+const replaceUnsafeXML = (c) => c === "&" ? "&amp;" : c === "<" ? "&lt;" : "&#13;";
 const escapeXMLStr = (str) => unsafeXMLReg.test(str) ? str.replace(unsafeXMLReg, replaceUnsafeXML) : str;
 function _escape(val) {
 	assertValidTextValue(val);
@@ -570,7 +577,18 @@ function setDebugInfo(obj, file, loc, vars) {
 	DEBUG.set(obj, {
 		file,
 		loc,
-		vars
+		vars,
+		slots: DEBUG.get(obj)?.slots
+	});
+}
+function setDebugSlotName(obj, accessor, name) {
+	const debug = DEBUG.get(obj);
+	if (debug) (debug.slots ??= {})[accessor] = name;
+	else DEBUG.set(obj, {
+		file: "",
+		loc: 0,
+		vars: void 0,
+		slots: { [accessor]: name }
 	});
 }
 var Serializer = class {
@@ -1469,21 +1487,27 @@ function throwUnserializable(state, cause, ref = null, accessor = "") {
 	if (cause !== void 0 && state.boundary?.abort) {
 		let message = "Unable to serialize";
 		let access = "";
-		while (ref?.accessor) {
+		while (ref) {
+			const { accessor } = ref;
 			const debug = ref.parent?.debug;
-			if (debug) {
-				const varLoc = debug.vars?.[ref.accessor];
-				let debugAccess = ref.accessor;
+			if (accessor && debug) {
+				const rawAccessor = fromObjectKey(accessor);
+				const varLoc = debug.vars?.[rawAccessor];
+				const slotName = debug.slots?.[rawAccessor];
+				let debugAccess = varLoc ? rawAccessor : void 0;
 				let debugLoc = debug.loc;
 				if (varLoc) if (Array.isArray(varLoc)) {
 					debugAccess = varLoc[0];
 					if (varLoc[1]) debugLoc = varLoc[1];
 				} else debugLoc = varLoc;
-				message += ` ${JSON.stringify(debugAccess)} in ${debug.file}`;
+				let display;
+				if (debugAccess !== void 0) display = slotName && debugAccess.startsWith("...") ? `\`${slotName}\` from \`${debugAccess}\`` : JSON.stringify(debugAccess);
+				else display = describeAccessor(rawAccessor, slotName) ?? JSON.stringify(rawAccessor);
+				message += ` ${display} in ${debug.file}`;
 				if (debugLoc) message += `:${debugLoc}`;
 				break;
 			}
-			access = toAccess(ref.accessor) + access;
+			if (accessor) access = toAccess(accessor) + access;
 			ref = ref.parent;
 		}
 		if (accessor) access = toAccess(accessor) + access;
@@ -1495,6 +1519,40 @@ function throwUnserializable(state, cause, ref = null, accessor = "") {
 		state.boundary.abort(err);
 	}
 }
+const accessorPrefixDescriptions = {
+	BranchScopes: "the branch scopes",
+	ClosureScopes: "the closure scopes",
+	ClosureSignalIndex: "the closure signal index",
+	ConditionalRenderer: "the conditional renderer",
+	ControlledObserver: "the controlled observer",
+	ControlledHandler: "the change handler",
+	ControlledType: "the controlled type",
+	ControlledValue: "the controlled value",
+	DynamicHTMLLastChild: "the dynamic html",
+	EventAttributes: "the event handlers",
+	IdFallback: "the generated id",
+	KeyedScopes: "the keyed scopes",
+	Lifecycle: "the lifecycle handlers",
+	Promise: "the pending promise",
+	TagVariableChange: "the tag variable change handler"
+};
+function describeAccessor(accessor, slotName) {
+	const sep = accessor.indexOf(":");
+	if (~sep) {
+		const description = slotName === void 0 ? accessorPrefixDescriptions[accessor.slice(0, sep)] : `the \`${slotName}\` handler`;
+		if (description) {
+			const node = /^#([a-z-]+)\//i.exec(accessor.slice(sep + 1));
+			return node ? `${description} of \`<${node[1]}>\`` : description;
+		}
+	}
+}
+function fromObjectKey(key) {
+	try {
+		if (key[0] === "\"") return JSON.parse(key.replace(/\\x/g, "\\u00"));
+		if (key[0] === "[") return JSON.parse(key.slice(1, -1));
+	} catch {}
+	return key;
+}
 function trackChannel(state, ref) {
 	const refReadyId = ref.channel?.readyId;
 	if (!refReadyId || refReadyId === state.channel?.readyId) return true;
@@ -1875,6 +1933,9 @@ function getContext(key) {
 function getState() {
 	return $chunk.boundary.state;
 }
+function rendererKey(renderer) {
+	return renderer?.["owner"] === void 0 ? renderer?.["id"] || renderer : renderer["id"] + " " + renderer[Owner];
+}
 function getScopeId(scope) {
 	return scope[K_SCOPE_ID];
 }
@@ -1970,7 +2031,7 @@ function _attr_content(nodeAccessor, scopeId, content, serializeReason) {
 	if (_peek_scope_id() !== branchId) {
 		if (shouldResume) writeScope(scopeId, {
 			[BranchScopes + nodeAccessor]: writeScope(branchId, {}),
-			[ConditionalRenderer + nodeAccessor]: render?.["id"]
+			[ConditionalRenderer + nodeAccessor]: rendererKey(render)
 		});
 	} else _scope_id();
 }
@@ -2804,7 +2865,7 @@ function _attr_textarea_value(scopeId, nodeAccessor, value, valueChange, seriali
 }
 function _textarea_value(value) {
 	const escaped = _escape(normalizeStrAttrValue(value));
-	return escaped[0] === "\n" || escaped[0] === "\r" ? "\n" + escaped : escaped;
+	return escaped[0] === "\n" ? "\n" + escaped : escaped;
 }
 function _attr_input_value(scopeId, nodeAccessor, value, valueChange, serializeType) {
 	if (valueChange) writeControlledScope(2, scopeId, nodeAccessor, void 0, valueChange, serializeType);
@@ -2868,6 +2929,7 @@ function _attrs(data, nodeAccessor, scopeId, tagName) {
 				result += _attr_input_checkedValue(scopeId, nodeAccessor, data.checkedValue, data.checkedValueChange, data.value, 1);
 				skip = /^(?:value|checked(?:Value)?)(?:Change)?$|[\s/>"'=]/;
 			} else if (data.valueChange) {
+				assertNoValueBindingOnCheckable(data.type, data.valueChange);
 				result += _attr_input_value(scopeId, nodeAccessor, data.value, data.valueChange, 1);
 				skip = /^value(?:Change)?$|[\s/>"'=]/;
 			}
@@ -2934,21 +2996,22 @@ function _attrs_partial_content(data, skip, nodeAccessor, scopeId, tagName, seri
 	_attr_content(nodeAccessor, scopeId, data?.content, serializeReason);
 }
 function writeControlledScope(type, scopeId, nodeAccessor, value, valueChange, serializeType) {
-	assertHandlerIsFunction([
+	var handlerName = [
 		"checkedChange",
 		"checkedValueChange",
 		"valueChange",
 		"valueChange",
 		"openChange"
-	][type], valueChange);
-	writeScope(scopeId, serializeType ? {
+	][type];
+	assertHandlerIsFunction(handlerName, valueChange);
+	setDebugSlotName(writeScope(scopeId, serializeType ? {
 		[ControlledType + nodeAccessor]: type,
 		[ControlledValue + nodeAccessor]: value,
 		[ControlledHandler + nodeAccessor]: valueChange
 	} : {
 		[ControlledValue + nodeAccessor]: value,
 		[ControlledHandler + nodeAccessor]: valueChange
-	});
+	}), ControlledHandler + nodeAccessor, handlerName);
 }
 function stringAttr(name, value) {
 	return value && " " + name + attrAssignment(value);
@@ -3051,16 +3114,17 @@ let _dynamic_tag = (scopeId, accessor, tag, inputOrArgs, content, inputIsArgs, s
 		}
 	}
 	if (rendered) {
-		if (shouldResume) writeScope(scopeId, { [ConditionalRenderer + accessor]: renderer?.["id"] || renderer });
+		if (shouldResume) writeScope(scopeId, { [ConditionalRenderer + accessor]: rendererKey(renderer) });
 	} else _scope_id();
 	return result;
 };
-function _content(id, fn) {
+function _content(id, fn, scopeId) {
 	fn["id"] = id;
+	fn[Owner] = scopeId;
 	return fn;
 }
 function _content_resume(id, fn, scopeId) {
-	return _resume(_content(id, fn), id, scopeId);
+	return _resume(_content(id, fn, scopeId), id, scopeId);
 }
 const patchDynamicTag = ((originalDynamicTag) => (patch) => {
 	_dynamic_tag = (scopeId, accessor, tag, input, content, inputIsArgs, resume) => {
@@ -3381,14 +3445,17 @@ function writeTriggerScript(html, triggers) {
 	const exprs = triggers.map((trigger) => {
 		const options = trigger.options && toObjectExpression(trigger.options);
 		switch (trigger.type) {
-			case "visible": return `(e=>e&&new IntersectionObserver((e,i)=>e.some(e=>e.isIntersecting)&&i.disconnect()+l()${options ? `,${options}` : ""}).observe(e))(document.querySelector(${JSON.stringify(trigger.selector)})||l())`;
+			case "visible": return `(e=>e&&new IntersectionObserver((e,i)=>e.some(e=>e.isIntersecting)&&i.disconnect()+l()${options ? `,${options}` : ""}).observe(e))(${querySelectorOrLoad(trigger.selector)})`;
 			case "idle": return `(self.requestIdleCallback||l)(l${options ? `,${options}` : ""})`;
 			case "media": return `(m=>m.matches?l():m.addEventListener("change",l,{once:1}))(matchMedia(${JSON.stringify(trigger.selector)}))`;
-			default: return `(e=>e?.addEventListener("${trigger.type.slice(3)}",l,{once:1}))(document.querySelector(${JSON.stringify(trigger.selector)})||l())`;
+			default: return `(e=>e?.addEventListener("${trigger.type.slice(3)}",l,{once:1}))(${querySelectorOrLoad(trigger.selector)})`;
 		}
 	});
 	writeScript(`((p,h,d,l=$=>{d||p.after(new Range().createContextualFragment(d=h))})=>${exprs.length > 1 ? `{${exprs.join(";")}}` : exprs[0]})(document.currentScript,${htmlStr})`);
 }
+function querySelectorOrLoad(selector) {
+	return `document.querySelector(${JSON.stringify(selector)})||${`(console.warn(${JSON.stringify(`A lazy load trigger could not find an element matching "${selector}". The module was loaded immediately.`)}),l())`}`;
+}
 function toObjectExpression(options) {
 	let result = "{";
 	let sep = "";

package/dist/dom/catch.feat.js

@@ -1,4 +1,4 @@
-let require_control_flow = require("../dom-B-XpL2_H.js"), handlePendingTry = (fn, scope, branch) => {
+let require_control_flow = require("../dom-BeF9xIzO.js"), handlePendingTry = (fn, scope, branch) => {
 	for (; branch;) {
 		if (branch.O?.i) return (branch.J ||= []).push(fn, scope);
 		branch = branch.N;

package/dist/dom/catch.feat.mjs

@@ -4,7 +4,7 @@ let handlePendingTry = (fn, scope, branch) => {
 		branch = branch.N;
 	}
 };
-import { Jt as caughtError, Xt as placeholderShown, Yt as installCatch, h as renderCatch } from "../dom-6hBvZW7X.mjs";
+import { Jt as caughtError, Xt as placeholderShown, Yt as installCatch, h as renderCatch } from "../dom-BP2XSglG.mjs";
 //#region src/dom/catch.feat.ts
 installCatch((runEffects) => (effects, checkPending = placeholderShown.has(effects)) => {
 	if (checkPending || caughtError.has(effects)) {

package/dist/dom/control-flow.d.ts

@@ -11,6 +11,7 @@ export declare function _try(nodeAccessor: EncodedAccessor, template?: string |
 export declare function renderCatch(scope: Scope, error: unknown): void;
 export declare const _if: (nodeAccessor: EncodedAccessor, ...branchesArgs: (string | SetupFn | 0)[]) => (scope: Scope, newBranch: number) => void;
 export declare const _show: (nodeAccessor: EncodedAccessor, startNodeAccessor?: EncodedAccessor, endNodeAccessor?: EncodedAccessor) => (scope: Scope, display: unknown) => void;
+export declare function rendererKey(renderer: Renderer | string | undefined): string | Renderer | undefined;
 export declare function patchDynamicTag(fn: <T extends typeof _dynamic_tag>(cond: T) => T): void;
 export declare let _dynamic_tag: (nodeAccessor: EncodedAccessor, getContent?: ((scope: Scope) => Renderer) | 0, getTagVar?: (() => Signal<unknown>) | 0, inputIsArgs?: 1) => Signal<Renderer | string | undefined>;
 export declare const _dynamic_tag_content: (nodeAccessor: EncodedAccessor) => Signal<Renderer | undefined>;

package/dist/dom/controllable-input.feat.js

@@ -1,3 +1,3 @@
-let require_control_flow = require("../dom-B-XpL2_H.js");
+let require_control_flow = require("../dom-BeF9xIzO.js");
 require_control_flow.R[0] = require_control_flow.w, require_control_flow.R[1] = require_control_flow.S, require_control_flow.R[2] = require_control_flow.k;
 //#endregion

package/dist/dom/controllable-input.feat.mjs

@@ -1,3 +1,3 @@
-import { R as controllableScripts, S as _attr_input_checkedValue_script, k as _attr_input_value_script, w as _attr_input_checked_script } from "../dom-6hBvZW7X.mjs";
+import { R as controllableScripts, S as _attr_input_checkedValue_script, k as _attr_input_value_script, w as _attr_input_checked_script } from "../dom-BP2XSglG.mjs";
 controllableScripts[0] = _attr_input_checked_script, controllableScripts[1] = _attr_input_checkedValue_script, controllableScripts[2] = _attr_input_value_script;
 //#endregion

package/dist/dom/controllable-open.feat.js

@@ -1,4 +1,4 @@
-let require_control_flow = require("../dom-B-XpL2_H.js");
+let require_control_flow = require("../dom-BeF9xIzO.js");
 //#region src/dom/controllable-open.feat.ts
 require_control_flow.R[4] = require_control_flow.v;
 //#endregion

package/dist/dom/controllable-open.feat.mjs

@@ -1,4 +1,4 @@
-import { R as controllableScripts, v as _attr_details_or_dialog_open_script } from "../dom-6hBvZW7X.mjs";
+import { R as controllableScripts, v as _attr_details_or_dialog_open_script } from "../dom-BP2XSglG.mjs";
 //#region src/dom/controllable-open.feat.ts
 controllableScripts[4] = _attr_details_or_dialog_open_script;
 //#endregion

package/dist/dom/controllable-select.feat.js

@@ -1,4 +1,4 @@
-let require_control_flow = require("../dom-B-XpL2_H.js");
+let require_control_flow = require("../dom-BeF9xIzO.js");
 //#region src/dom/controllable-select.feat.ts
 require_control_flow.R[3] = require_control_flow.M;
 //#endregion

package/dist/dom/controllable-select.feat.mjs

@@ -1,4 +1,4 @@
-import { M as _attr_select_value_script, R as controllableScripts } from "../dom-6hBvZW7X.mjs";
+import { M as _attr_select_value_script, R as controllableScripts } from "../dom-BP2XSglG.mjs";
 //#region src/dom/controllable-select.feat.ts
 controllableScripts[3] = _attr_select_value_script;
 //#endregion

package/dist/dom/controllable-textarea.feat.js

@@ -1,4 +1,4 @@
-let require_control_flow = require("../dom-B-XpL2_H.js");
+let require_control_flow = require("../dom-BeF9xIzO.js");
 //#region src/dom/controllable-textarea.feat.ts
 require_control_flow.R[2] = require_control_flow.k;
 //#endregion

package/dist/dom/controllable-textarea.feat.mjs

@@ -1,4 +1,4 @@
-import { R as controllableScripts, k as _attr_input_value_script } from "../dom-6hBvZW7X.mjs";
+import { R as controllableScripts, k as _attr_input_value_script } from "../dom-BP2XSglG.mjs";
 //#region src/dom/controllable-textarea.feat.ts
 controllableScripts[2] = _attr_input_value_script;
 //#endregion

package/dist/dom/controllable.feat.js

@@ -1,3 +1,3 @@
-let require_control_flow = require("../dom-B-XpL2_H.js");
+let require_control_flow = require("../dom-BeF9xIzO.js");
 require("./controllable-input.feat.js"), require("./controllable-open.feat.js"), require("./controllable-select.feat.js"), require_control_flow.L.INPUT = require_control_flow.N, require_control_flow.L.TEXTAREA = require_control_flow.I, require_control_flow.L.SELECT = require_control_flow.F, require_control_flow.L.DETAILS = require_control_flow.L.DIALOG = require_control_flow.P;
 //#endregion

package/dist/dom/controllable.feat.mjs

@@ -1,4 +1,4 @@
-import { F as _controllable_select, I as _controllable_textarea, L as controllableRenders, N as _controllable_input, P as _controllable_open } from "../dom-6hBvZW7X.mjs";
+import { F as _controllable_select, I as _controllable_textarea, L as controllableRenders, N as _controllable_input, P as _controllable_open } from "../dom-BP2XSglG.mjs";
 import "./controllable-input.feat.mjs";
 import "./controllable-open.feat.mjs";
 import "./controllable-select.feat.mjs";

package/dist/dom/signals.d.ts

@@ -1,4 +1,4 @@
-import { type Accessor, AccessorProp, type EncodedAccessor, type Scope } from "../common/types";
+import { type Accessor, type EncodedAccessor, type Scope } from "../common/types";
 export type SignalFn = (scope: Scope) => void;
 export type Signal<T = unknown, U extends Scope = Scope> = (scope: U, value: T) => void;
 export declare function _let<T>(id: EncodedAccessor, fn?: SignalFn): (scope: Scope, value: T) => T;
@@ -24,10 +24,10 @@ export declare function _var(scope: Scope, childAccessor: EncodedAccessor, signa
 export declare const _return: (scope: Scope, value: unknown) => any;
 export declare function _return_change(scope: Scope, changeHandler?: ((value: unknown) => void) | null | false): void;
 export declare const _var_change: (scope: Scope, value: unknown, name?: string) => void;
-export declare function _id({ [AccessorProp.Global]: $global }: Scope): string;
+export declare function _id(scope: Scope, accessor?: Accessor): string;
 export declare function _script(id: string, fn: (scope: Scope) => void): (scope: Scope) => void;
 export declare function _el_read<T>(value: T): T;
-type Hoistable<T> = () => T;
+type Hoistable<T> = (...args: unknown[]) => T;
 type Hoisted<T> = Hoistable<T> & Iterable<T>;
 export declare function _hoist<T>(...path: Accessor[]): (scope: Scope) => Hoisted<T>;
 export declare function _hoist_resume<T>(id: string, ...path: Accessor[]): (scope: Scope) => Hoisted<T>;