@samva/markup 0.9.0 → 0.10.0

package/dist/components-BZCqegS8.js

@@ -0,0 +1,1864 @@
+import { n as isObject } from "./guards-eV1qLbf2.js";
+import { i as UNSUBSCRIBE_URL_PLACEHOLDER$1, n as RESERVED_FOOTER_ATTRIBUTES, r as UNSUBSCRIBE_LINK, t as BRAND_FOOTER_MARKER } from "./unsubscribe-link-CoesnQDU.js";
+import { callFormatter, createFmt } from "./fmt.js";
+import { a as jsx, c as rawMarkup, l as reportEmailDiagnostic, n as Fragment, s as normalizeChildren, t as EmailNode } from "./jsx-runtime-CBlexoeR.js";
+//#region src/email/elements.ts
+/** Attributes every supported element accepts. `class`/`className`/`style` are handled separately. */
+const EMAIL_GLOBAL_ATTRIBUTES = {
+	id: { type: "string" },
+	title: { type: "string" },
+	lang: { type: "string" },
+	dir: {
+		type: "string",
+		values: [
+			"ltr",
+			"rtl",
+			"auto"
+		]
+	},
+	role: { type: "string" }
+};
+const alignment = {
+	type: "string",
+	values: [
+		"left",
+		"center",
+		"right"
+	]
+};
+const verticalAlignment = {
+	type: "string",
+	values: [
+		"top",
+		"middle",
+		"bottom"
+	]
+};
+const flowAttributes = { align: alignment };
+const cellAttributes = {
+	align: alignment,
+	valign: verticalAlignment,
+	width: { type: "measure" },
+	height: { type: "measure" },
+	bgcolor: { type: "string" },
+	colspan: { type: "number" },
+	rowspan: { type: "number" }
+};
+const block = (attributes) => ({
+	content: "flow",
+	layout: "block",
+	attributes
+});
+const inline = () => ({
+	content: "flow",
+	layout: "inline",
+	attributes: {}
+});
+/** The complete supported vocabulary. Anything outside it is a compile error with a source location. */
+const EMAIL_ELEMENTS = {
+	html: {
+		content: "flow",
+		layout: "document",
+		attributes: {
+			xmlns: { type: "string" },
+			"xmlns:o": { type: "string" },
+			"xmlns:v": { type: "string" },
+			"xmlns:w": { type: "string" }
+		},
+		childElements: ["head", "body"]
+	},
+	head: {
+		content: "flow",
+		layout: "metadata",
+		attributes: {},
+		childElements: [
+			"title",
+			"meta",
+			"style"
+		]
+	},
+	title: {
+		content: "text",
+		layout: "metadata",
+		attributes: {}
+	},
+	style: {
+		content: "raw",
+		layout: "metadata",
+		attributes: { type: { type: "string" } }
+	},
+	meta: {
+		content: "void",
+		layout: "metadata",
+		attributes: {
+			name: { type: "string" },
+			content: { type: "string" },
+			charset: { type: "string" },
+			"http-equiv": { type: "string" }
+		}
+	},
+	body: {
+		content: "flow",
+		layout: "block",
+		attributes: { bgcolor: { type: "string" } }
+	},
+	div: block(flowAttributes),
+	section: block(flowAttributes),
+	article: block(flowAttributes),
+	header: block(flowAttributes),
+	footer: block(flowAttributes),
+	main: block(flowAttributes),
+	center: block({}),
+	p: block(flowAttributes),
+	blockquote: block(flowAttributes),
+	pre: {
+		content: "flow",
+		layout: "preformatted",
+		attributes: {}
+	},
+	h1: block(flowAttributes),
+	h2: block(flowAttributes),
+	h3: block(flowAttributes),
+	h4: block(flowAttributes),
+	h5: block(flowAttributes),
+	h6: block(flowAttributes),
+	span: inline(),
+	strong: inline(),
+	b: inline(),
+	em: inline(),
+	i: inline(),
+	u: inline(),
+	s: inline(),
+	small: inline(),
+	code: inline(),
+	a: {
+		content: "flow",
+		layout: "link",
+		attributes: {
+			href: {
+				type: "url",
+				required: true
+			},
+			target: { type: "string" },
+			rel: { type: "string" },
+			name: { type: "string" }
+		}
+	},
+	img: {
+		content: "void",
+		layout: "image",
+		attributes: {
+			src: {
+				type: "url",
+				required: true
+			},
+			alt: {
+				type: "string",
+				required: true
+			},
+			width: { type: "measure" },
+			height: { type: "measure" },
+			border: { type: "measure" },
+			align: alignment
+		}
+	},
+	table: {
+		content: "flow",
+		layout: "table",
+		attributes: {
+			width: { type: "measure" },
+			height: { type: "measure" },
+			border: { type: "measure" },
+			cellpadding: { type: "measure" },
+			cellspacing: { type: "measure" },
+			align: alignment,
+			bgcolor: { type: "string" }
+		},
+		childElements: [
+			"caption",
+			"colgroup",
+			"thead",
+			"tbody",
+			"tfoot",
+			"tr"
+		]
+	},
+	caption: {
+		content: "flow",
+		layout: "block",
+		attributes: flowAttributes
+	},
+	colgroup: {
+		content: "flow",
+		layout: "table-section",
+		attributes: {
+			span: { type: "number" },
+			width: { type: "measure" }
+		},
+		childElements: ["col"]
+	},
+	col: {
+		content: "void",
+		layout: "table-section",
+		attributes: {
+			span: { type: "number" },
+			width: { type: "measure" }
+		}
+	},
+	thead: {
+		content: "flow",
+		layout: "table-section",
+		attributes: {
+			align: alignment,
+			valign: verticalAlignment,
+			bgcolor: { type: "string" }
+		},
+		childElements: ["tr"]
+	},
+	tbody: {
+		content: "flow",
+		layout: "table-section",
+		attributes: {
+			align: alignment,
+			valign: verticalAlignment,
+			bgcolor: { type: "string" }
+		},
+		childElements: ["tr"]
+	},
+	tfoot: {
+		content: "flow",
+		layout: "table-section",
+		attributes: {
+			align: alignment,
+			valign: verticalAlignment,
+			bgcolor: { type: "string" }
+		},
+		childElements: ["tr"]
+	},
+	tr: {
+		content: "flow",
+		layout: "row",
+		attributes: {
+			align: alignment,
+			valign: verticalAlignment,
+			bgcolor: { type: "string" },
+			height: { type: "measure" }
+		},
+		childElements: ["td", "th"]
+	},
+	td: {
+		content: "flow",
+		layout: "cell",
+		attributes: cellAttributes
+	},
+	th: {
+		content: "flow",
+		layout: "cell",
+		attributes: cellAttributes
+	},
+	ul: {
+		content: "flow",
+		layout: "list",
+		attributes: {},
+		childElements: ["li"]
+	},
+	ol: {
+		content: "flow",
+		layout: "list",
+		attributes: {
+			start: { type: "number" },
+			type: { type: "string" }
+		},
+		childElements: ["li"]
+	},
+	li: {
+		content: "flow",
+		layout: "list-item",
+		attributes: {}
+	},
+	br: {
+		content: "void",
+		layout: "break",
+		attributes: {}
+	},
+	hr: {
+		content: "void",
+		layout: "rule",
+		attributes: {
+			width: { type: "measure" },
+			size: { type: "number" },
+			align: alignment
+		}
+	}
+};
+/** Attributes that must carry a URL; these are checked against the safe-scheme rule. */
+const isUrlAttribute = (tag, attribute) => {
+	return EMAIL_ELEMENTS[tag]?.attributes[attribute]?.type === "url";
+};
+/** Look up one supported element, or `undefined` when the tag is outside the vocabulary. */
+const emailElement = (tag) => Object.hasOwn(EMAIL_ELEMENTS, tag) ? EMAIL_ELEMENTS[tag] : void 0;
+//#endregion
+//#region src/render-ir.ts
+var IrRenderError = class extends Error {
+	diagnostics;
+	constructor(diagnostics) {
+		super(`Template render rejected: ${diagnostics.map((item) => `${item.code}: ${item.message}`).join("; ")}`);
+		this.name = "IrRenderError";
+		this.diagnostics = diagnostics;
+	}
+};
+const fail = (code, message) => {
+	throw new IrRenderError([{
+		code,
+		message
+	}]);
+};
+const MAX_ITERATIONS = 1e4;
+const MAX_DEPTH = 64;
+/** Classic Outlook lays a document out correctly only under a transitional doctype. */
+const EMAIL_DOCTYPE = "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">";
+/** The per-recipient unsubscribe URL the send path substitutes; SES must not rewrite it. */
+const UNSUBSCRIBE_URL_PLACEHOLDER = "%samva:unsubscribe-url%";
+const PREHEADER_TARGET_LENGTH$1 = 200;
+const PREHEADER_PADDING$1 = "\xA0‌​‍‎‏";
+const escapeText$1 = (value) => value.replace(/[&<>]/g, (character) => ({
+	"&": "&amp;",
+	"<": "&lt;",
+	">": "&gt;"
+})[character] ?? character);
+const escapeAttribute$1 = (value) => value.replace(/[&<>"']/g, (character) => ({
+	"&": "&amp;",
+	"<": "&lt;",
+	">": "&gt;",
+	"\"": "&quot;",
+	"'": "&#39;"
+})[character] ?? character);
+const CONTROL_CHARACTERS$1 = /[\u0000-\u001f\u007f]/;
+const SAFE_URL_SCHEME$1 = /^(https:\/\/|mailto:|tel:|cid:|#)/i;
+/** A delivered message can resolve only an absolute URL, so relative references are refused. */
+const isSafeUrl$1 = (value) => !/^[\u0000- ]/.test(value) && !CONTROL_CHARACTERS$1.test(value) && !value.includes("\\") && SAFE_URL_SCHEME$1.test(value);
+const CSS_PROPERTY$1 = /^(--[a-zA-Z0-9-]+|[a-zA-Z][a-zA-Z0-9-]*)$/;
+const CSS_UNSAFE$1 = /[;{}<>\\]|expression\s*\(|@import|\/\*/i;
+const CSS_URL$1 = /url\(\s*(['"]?)([^'")]*)\1\s*\)/gi;
+const kebab$1 = (property) => property.startsWith("--") ? property : property.replace(/[A-Z]/g, (l) => `-${l.toLowerCase()}`);
+const UNITLESS$1 = /* @__PURE__ */ new Set([
+	"opacity",
+	"zIndex",
+	"fontWeight",
+	"lineHeight",
+	"order",
+	"flexGrow",
+	"flexShrink",
+	"columnCount",
+	"orphans",
+	"widows",
+	"zoom",
+	"fillOpacity",
+	"strokeOpacity"
+]);
+const declarationValue$1 = (property, value) => typeof value === "number" && value !== 0 && !UNITLESS$1.has(property) && !property.startsWith("--") ? `${value}px` : String(value);
+const report$1 = (ctx, code, message) => {
+	ctx.diagnostics.push({
+		code,
+		message
+	});
+};
+const isRecord = (value) => typeof value === "object" && value !== null && !Array.isArray(value);
+const has = (value, key) => Object.hasOwn(value, key);
+const FORBIDDEN_SEGMENTS = /* @__PURE__ */ new Set([
+	"__proto__",
+	"constructor",
+	"prototype"
+]);
+const ARRAY_INDEX = /^(0|[1-9]\d*)$/;
+const step = (value, segment) => {
+	if (FORBIDDEN_SEGMENTS.has(segment)) return void 0;
+	if (Array.isArray(value)) return ARRAY_INDEX.test(segment) && Object.hasOwn(value, segment) ? value[Number(segment)] : void 0;
+	if (isRecord(value) && Object.hasOwn(value, segment)) return value[segment];
+};
+const resolvePath = (ctx, scope, path) => {
+	if (typeof path !== "string" || path === "") return void 0;
+	const [first = "", ...rest] = path.split(".");
+	if (FORBIDDEN_SEGMENTS.has(first)) return void 0;
+	let current = first.startsWith("$") ? scope.get(first) : step(ctx.input, first);
+	for (const segment of rest) {
+		if (current === void 0 || current === null) return void 0;
+		current = step(current, segment);
+	}
+	return current;
+};
+const invalid = (message) => fail("invalid-value", message);
+/** The text a value contributes: strings as is, finite numbers, nothing for null and booleans. */
+const textOf = (value) => {
+	if (typeof value === "string") return value;
+	if (typeof value === "number") return Number.isFinite(value) ? String(value) : invalid("A non-finite number cannot be text.");
+	if (value === null || value === void 0 || typeof value === "boolean") return "";
+	return invalid("An object or array cannot be rendered as text.");
+};
+const finiteNumber = (value, what) => typeof value === "number" && Number.isFinite(value) ? value : invalid(`${what} must be a finite number.`);
+const arithmetic = (op, left, right) => {
+	if ((op === "/" || op === "%") && right === 0) return invalid("Division by zero.");
+	let result;
+	switch (op) {
+		case "+":
+			result = left + right;
+			break;
+		case "-":
+			result = left - right;
+			break;
+		case "*":
+			result = left * right;
+			break;
+		case "/":
+			result = left / right;
+			break;
+		case "%":
+			result = left % right;
+			break;
+		default: return invalid(`Unknown arithmetic operator ${JSON.stringify(op)}.`);
+	}
+	return Number.isFinite(result) ? result : invalid("Arithmetic produced a non-finite number.");
+};
+const formatterContext = (ctx) => {
+	ctx.fmt ??= createFmt({
+		locale: ctx.locale,
+		timeZone: ctx.timeZone
+	});
+	return ctx.fmt;
+};
+const applyFormat = (ctx, name, args) => {
+	if (typeof name !== "string") return invalid("A format node needs a formatter name.");
+	try {
+		return callFormatter(formatterContext(ctx), name, args);
+	} catch (error) {
+		return fail("format-error", error instanceof Error ? error.message : String(error));
+	}
+};
+const nullish = (value) => value === void 0 ? null : value;
+const compare = (op, left, right) => {
+	switch (op) {
+		case "eq": return nullish(left) === nullish(right);
+		case "ne": return nullish(left) !== nullish(right);
+		case "lt":
+		case "gt":
+		case "le":
+		case "ge": {
+			if (!(typeof left === "number" && typeof right === "number" || typeof left === "string" && typeof right === "string")) return false;
+			const a = left;
+			const b = right;
+			if (op === "lt") return a < b;
+			if (op === "gt") return a > b;
+			return op === "le" ? a <= b : a >= b;
+		}
+		default: return invalid(`Unknown comparison ${JSON.stringify(op)}.`);
+	}
+};
+const checkDepth = (depth) => {
+	if (depth > MAX_DEPTH) fail("render-limit", `Templates nest at most ${MAX_DEPTH} levels deep.`);
+};
+const evalArgs = (ctx, scope, args, depth) => Array.isArray(args) ? args.map((arg) => evalValue(ctx, scope, arg, depth + 1)) : invalid("Arguments must be an array.");
+const evalValue = (ctx, scope, value, depth) => {
+	checkDepth(depth);
+	if (value === null || typeof value !== "object") return value;
+	if (Array.isArray(value)) return invalid("Unknown value node.");
+	const node = value;
+	if (has(node, "bind")) return resolvePath(ctx, scope, node.bind);
+	if (has(node, "lit")) return node.lit;
+	if (has(node, "concat")) return evalArgs(ctx, scope, node.concat, depth).map(textOf).join("");
+	if (has(node, "format")) return applyFormat(ctx, node.format, evalArgs(ctx, scope, node.args, depth));
+	if (has(node, "if")) return evalPredicate(ctx, scope, node.if, depth + 1) ? evalValue(ctx, scope, node.then, depth + 1) : evalValue(ctx, scope, node.else, depth + 1);
+	if (has(node, "op")) {
+		const [left, right] = evalArgs(ctx, scope, node.args, depth);
+		return arithmetic(node.op, finiteNumber(left, "An arithmetic operand"), finiteNumber(right, "An arithmetic operand"));
+	}
+	if (has(node, "count")) {
+		const items = evalValue(ctx, scope, node.count, depth + 1);
+		if (!Array.isArray(items)) return invalid("count applies to an array.");
+		return selectItems(ctx, scope, items, String(node.as), node.where, depth).length;
+	}
+	if (has(node, "length")) {
+		const measured = evalValue(ctx, scope, node.length, depth + 1);
+		return typeof measured === "string" || Array.isArray(measured) ? measured.length : invalid("length applies to a string or an array.");
+	}
+	return invalid("Unknown value node.");
+};
+const evalPredicate = (ctx, scope, predicate, depth) => {
+	checkDepth(depth);
+	if (typeof predicate !== "object" || predicate === null || Array.isArray(predicate)) return invalid("Unknown predicate.");
+	const node = predicate;
+	if (has(node, "present")) return Boolean(resolvePath(ctx, scope, node.present));
+	if (has(node, "truthy")) return Boolean(evalValue(ctx, scope, node.truthy, depth + 1));
+	if (has(node, "not")) return !evalPredicate(ctx, scope, node.not, depth + 1);
+	if (has(node, "and")) return asArray(node.and).every((item) => evalPredicate(ctx, scope, item, depth + 1));
+	if (has(node, "or")) return asArray(node.or).some((item) => evalPredicate(ctx, scope, item, depth + 1));
+	if (has(node, "cmp")) {
+		const [left, right] = evalArgs(ctx, scope, node.args, depth);
+		return compare(node.cmp, left, right);
+	}
+	return invalid("Unknown predicate.");
+};
+const asArray = (value) => Array.isArray(value) ? value : invalid("Expected an array.");
+const declarations$1 = (ctx, scope, entries, depth) => {
+	const parts = [];
+	for (const entry of entries) {
+		if (!Array.isArray(entry) || entry.length !== 2) {
+			report$1(ctx, "invalid-style", "A style declaration is a [property, value] pair.");
+			continue;
+		}
+		const [property, raw] = entry;
+		const value = evalValue(ctx, scope, raw, depth + 1);
+		if (value === void 0 || value === null) continue;
+		if (typeof property !== "string" || !CSS_PROPERTY$1.test(property)) {
+			report$1(ctx, "unsupported-style-property", `Style property ${JSON.stringify(property)} is not a CSS property name.`);
+			continue;
+		}
+		if (typeof value !== "string" && !(typeof value === "number" && Number.isFinite(value))) {
+			report$1(ctx, "invalid-style-value", `Style ${property} must be a string or finite number.`);
+			continue;
+		}
+		const text = declarationValue$1(property, value);
+		if (CSS_UNSAFE$1.test(text) || CONTROL_CHARACTERS$1.test(text)) {
+			report$1(ctx, "unsafe-style-value", `Style ${property} contains CSS that could break out of the declaration.`);
+			continue;
+		}
+		let unsafeUrl;
+		for (const match of text.matchAll(CSS_URL$1)) if (!isSafeUrl$1(match[2] ?? "")) unsafeUrl = match[2] ?? "";
+		if (unsafeUrl !== void 0) {
+			report$1(ctx, "unsafe-url", `Style ${property} points at ${JSON.stringify(unsafeUrl)}; email URLs must use https:, mailto:, tel:, cid: or a fragment.`);
+			continue;
+		}
+		parts.push(`${kebab$1(property)}:${text}`);
+	}
+	return parts.join(";");
+};
+const styleText = (ctx, scope, style, depth) => {
+	checkDepth(depth);
+	if (typeof style === "string") {
+		if (CONTROL_CHARACTERS$1.test(style)) {
+			report$1(ctx, "unsafe-style-value", "A style contains control characters.");
+			return "";
+		}
+		return style;
+	}
+	if (Array.isArray(style)) return declarations$1(ctx, scope, style, depth);
+	if (isRecord(style) && has(style, "if")) return evalPredicate(ctx, scope, style.if, depth + 1) ? styleText(ctx, scope, style.then, depth + 1) : styleText(ctx, scope, style.else, depth + 1);
+	report$1(ctx, "invalid-style", "An element style is a string, a declaration list or a conditional.");
+	return "";
+};
+const attributeText = (ctx, tag, name, spec, value) => {
+	if (value === void 0 || value === null || value === false) return void 0;
+	if (value === true) return "";
+	if (typeof value !== "string" && !(typeof value === "number" && Number.isFinite(value))) {
+		report$1(ctx, "invalid-attribute-value", `<${tag} ${name}> must be a string or finite number, not ${typeof value}.`);
+		return;
+	}
+	const text = String(value);
+	if (CONTROL_CHARACTERS$1.test(text)) {
+		report$1(ctx, "invalid-attribute-value", `<${tag} ${name}> contains control characters.`);
+		return;
+	}
+	if (spec.values !== void 0 && !spec.values.includes(text)) {
+		report$1(ctx, "invalid-attribute-value", `<${tag} ${name}> accepts ${spec.values.join(", ")}; received ${JSON.stringify(text)}.`);
+		return;
+	}
+	if (spec.type === "number" && !/^-?\d+$/.test(text)) {
+		report$1(ctx, "invalid-attribute-value", `<${tag} ${name}> must be an integer.`);
+		return;
+	}
+	if (spec.type === "measure" && !/^\d+(\.\d+)?%?$/.test(text)) {
+		report$1(ctx, "invalid-attribute-value", `<${tag} ${name}> must be a pixel count or a percentage.`);
+		return;
+	}
+	if (spec.type === "url" && !isSafeUrl$1(text)) {
+		report$1(ctx, "unsafe-url", `<${tag} ${name}> must use https:, mailto:, tel:, cid: or a fragment; received ${JSON.stringify(text)}. A relative path resolves only in an export, never in a delivered message.`);
+		return;
+	}
+	return text;
+};
+const buildAttributes = (ctx, scope, tag, spec, node, props, depth) => {
+	const emitted = [];
+	const present = /* @__PURE__ */ new Set();
+	let classes;
+	const source = node.attrs ?? {};
+	if (!isRecord(source)) {
+		report$1(ctx, "invalid-attribute-value", `<${tag}> attrs must be an object.`);
+		return "";
+	}
+	for (const [key, raw] of Object.entries(source)) {
+		if (key === "key") continue;
+		const name = key === "className" ? "class" : key;
+		const value = evalValue(ctx, scope, raw, depth + 1);
+		props.set(name, value);
+		if (tag === "a" && name === "href" && raw === UNSUBSCRIBE_URL_PLACEHOLDER) {
+			present.add(name);
+			emitted.push(` href="${UNSUBSCRIBE_URL_PLACEHOLDER}" ses:no-track`);
+			continue;
+		}
+		if (name === "class") {
+			if (value === void 0 || value === null) continue;
+			if (typeof value !== "string") {
+				report$1(ctx, "invalid-attribute-value", `<${tag} class> must be a string.`);
+				continue;
+			}
+			if (CONTROL_CHARACTERS$1.test(value)) {
+				report$1(ctx, "invalid-attribute-value", `<${tag} class> contains control characters.`);
+				continue;
+			}
+			if (classes !== void 0) {
+				report$1(ctx, "duplicate-attribute", `<${tag}> sets both class and className; keep one.`);
+				continue;
+			}
+			classes = value;
+			emitted.push(` class="${escapeAttribute$1(value)}"`);
+			continue;
+		}
+		if (name === "style") {
+			report$1(ctx, "invalid-style", `<${tag}> writes its style on the element, not as an attribute.`);
+			continue;
+		}
+		if (/^on/i.test(name)) {
+			report$1(ctx, "event-handler", `<${tag} ${name}> is an event handler; email clients strip scripting and Samva refuses it.`);
+			continue;
+		}
+		if ((name === "data-samva-footer" || name === "data-samva-unsubscribe") && node.reserved !== true) {
+			report$1(ctx, "reserved-attribute", `<${tag} ${name}> is reserved for the brand footer.`);
+			continue;
+		}
+		if (/^(data|aria)-[a-z0-9-]+$/.test(name)) {
+			const text = attributeText(ctx, tag, name, { type: "string" }, value);
+			if (text !== void 0) emitted.push(` ${name}="${escapeAttribute$1(text)}"`);
+			continue;
+		}
+		const globals = EMAIL_GLOBAL_ATTRIBUTES;
+		const attribute = Object.hasOwn(globals, name) ? globals[name] : Object.hasOwn(spec.attributes, name) ? spec.attributes[name] : void 0;
+		if (attribute === void 0) {
+			report$1(ctx, "unsupported-attribute", `<${tag}> does not support the ${name} attribute.`);
+			continue;
+		}
+		present.add(name);
+		const text = attributeText(ctx, tag, name, attribute, value);
+		if (text !== void 0) emitted.push(` ${name}="${escapeAttribute$1(text)}"`);
+	}
+	for (const [name, attribute] of Object.entries(spec.attributes)) if (attribute.required === true && !present.has(name)) report$1(ctx, "missing-attribute", `<${tag}> requires the ${name} attribute.`);
+	if (node.style !== void 0) {
+		const css = styleText(ctx, scope, node.style, depth + 1);
+		if (css !== "") emitted.push(` style="${escapeAttribute$1(css)}"`);
+	}
+	return emitted.join("");
+};
+const checkContentModel$1 = (ctx, tag, spec, children) => {
+	if (spec.content === "void") {
+		if (children.length > 0) report$1(ctx, "void-element-children", `<${tag}> cannot have children.`);
+		return;
+	}
+	if (spec.content === "text" || spec.content === "raw") {
+		for (const child of children) if (child.t !== "text") report$1(ctx, "invalid-content", `<${tag}> accepts text only.`);
+		return;
+	}
+	if (spec.childElements === void 0) return;
+	for (const child of children) {
+		if (child.t === "raw") continue;
+		if (child.t === "text") {
+			if (child.v.trim() !== "") report$1(ctx, "invalid-content", `<${tag}> cannot contain text directly; put it inside <${spec.childElements[0]}>.`);
+			continue;
+		}
+		if (!spec.childElements.includes(child.tag)) report$1(ctx, "invalid-content", `<${tag}> accepts only ${spec.childElements.map((name) => `<${name}>`).join(", ")}; found <${child.tag}>.`);
+	}
+};
+const pushText = (out, value) => {
+	if (value === null || value === void 0 || typeof value === "boolean") return;
+	out.push({
+		t: "text",
+		v: textOf(value)
+	});
+};
+const evalElement = (ctx, scope, node, depth, out) => {
+	const tag = node.el;
+	if (ctx.plain) {
+		report$1(ctx, "unsupported-element", "A plain-text body cannot contain elements.");
+		return;
+	}
+	const spec = typeof tag === "string" ? emailElement(tag) : void 0;
+	if (spec === void 0) {
+		report$1(ctx, "unsupported-element", `<${String(tag)}> is not part of the supported email vocabulary.`);
+		return;
+	}
+	const children = [];
+	for (const child of node.children ?? []) evalNode(ctx, scope, child, depth + 1, children);
+	checkContentModel$1(ctx, tag, spec, children);
+	if (spec.content === "raw") {
+		const css = children.map((child) => child.t === "text" ? child.v : "").join("");
+		if (/<\/|<!--/i.test(css)) {
+			report$1(ctx, "unsafe-raw-text", `<${tag}> content cannot contain markup.`);
+			return;
+		}
+	}
+	const props = /* @__PURE__ */ new Map();
+	const attrs = buildAttributes(ctx, scope, tag, spec, node, props, depth);
+	out.push({
+		t: "el",
+		tag,
+		content: spec.content,
+		layout: spec.layout,
+		attrs,
+		props,
+		children,
+		src: node.src
+	});
+};
+const evalRaw = (ctx, scope, node, depth, out) => {
+	if (ctx.plain) {
+		out.push({
+			t: "text",
+			v: node.text === void 0 ? "" : textOf(evalValue(ctx, scope, node.text, depth + 1))
+		});
+		return;
+	}
+	const html = asArray(node.raw).map((part) => rawPart(ctx, scope, part, depth + 1)).join("");
+	const text = node.text === void 0 ? "" : textOf(evalValue(ctx, scope, node.text, depth + 1));
+	out.push({
+		t: "raw",
+		html,
+		text
+	});
+};
+const rawPart = (ctx, scope, part, depth) => {
+	if (typeof part === "string") return part;
+	const record = part;
+	if (isRecord(record) && has(record, "attr")) return escapeAttribute$1(textOf(evalValue(ctx, scope, record.attr, depth + 1)));
+	if (isRecord(record) && has(record, "text")) return escapeText$1(textOf(evalValue(ctx, scope, record.text, depth + 1)));
+	return invalid("A raw part is a string, {attr} or {text}.");
+};
+const loopKey = (name) => name.startsWith("$") ? name : `$${name}`;
+/** The items that satisfy a `where` clause, each bound as the loop variable while it is tested. */
+const selectItems = (ctx, scope, items, as, where, depth) => {
+	if (where === void 0) return items;
+	const key = loopKey(as);
+	return items.filter((item) => {
+		if (++ctx.iterations > MAX_ITERATIONS) fail("render-limit", `A render iterates at most ${MAX_ITERATIONS} times.`);
+		const inner = new Map(scope);
+		inner.set(key, item);
+		return evalPredicate(ctx, inner, where, depth + 1);
+	});
+};
+const evalEach = (ctx, scope, node, depth, out) => {
+	const source = evalValue(ctx, scope, node.each, depth + 1);
+	if (!Array.isArray(source)) invalid("each needs an array.");
+	const selected = selectItems(ctx, scope, source, String(node.as), node.where, depth);
+	let items = selected;
+	if (node.chunk !== void 0) {
+		if (!Number.isInteger(node.chunk) || node.chunk < 1) invalid("chunk is a positive integer.");
+		const slices = [];
+		for (let at = 0; at < selected.length; at += node.chunk) slices.push(selected.slice(at, at + node.chunk));
+		items = slices;
+	}
+	const itemKey = loopKey(String(node.as));
+	const indexKey = node.index === void 0 ? void 0 : loopKey(String(node.index));
+	for (const [index, item] of items.entries()) {
+		if (++ctx.iterations > MAX_ITERATIONS) fail("render-limit", `A render iterates at most ${MAX_ITERATIONS} times.`);
+		const inner = new Map(scope);
+		inner.set(itemKey, item);
+		if (indexKey !== void 0) inner.set(indexKey, index);
+		for (const child of asArray(node.children)) evalNode(ctx, inner, child, depth + 1, out);
+	}
+};
+const evalNode = (ctx, scope, node, depth, out) => {
+	checkDepth(depth);
+	if (node === null || typeof node !== "object") {
+		pushText(out, node);
+		return;
+	}
+	if (!isRecord(node)) {
+		invalid("An array cannot be rendered as a node.");
+		return;
+	}
+	if (has(node, "el")) return evalElement(ctx, scope, node, depth, out);
+	if (has(node, "each")) return evalEach(ctx, scope, node, depth, out);
+	if (has(node, "raw")) return evalRaw(ctx, scope, node, depth, out);
+	if (has(node, "preheader")) {
+		if (!ctx.markerUsed && ctx.preheader !== void 0 && !ctx.plain) {
+			ctx.markerUsed = true;
+			out.push(preheaderBlock(ctx, ctx.preheader));
+		}
+		return;
+	}
+	if (has(node, "if") && Array.isArray(node.then)) {
+		const branch = evalPredicate(ctx, scope, node.if, depth + 1) ? node.then : node.else ?? [];
+		for (const child of branch) evalNode(ctx, scope, child, depth + 1, out);
+		return;
+	}
+	pushText(out, evalValue(ctx, scope, node, depth + 1));
+};
+const PREHEADER_STYLE = [
+	["display", "none"],
+	["overflow", "hidden"],
+	["lineHeight", "1px"],
+	["opacity", 0],
+	["maxHeight", 0],
+	["maxWidth", 0]
+];
+/** The hidden inbox-preview block: the text, then padding so the client cannot borrow body copy. */
+const preheaderBlock = (ctx, text) => {
+	const children = [text];
+	if (text.length < PREHEADER_TARGET_LENGTH$1) children.push({
+		el: "div",
+		attrs: { "data-samva-preheader-padding": true },
+		children: [PREHEADER_PADDING$1.repeat(Math.ceil((PREHEADER_TARGET_LENGTH$1 - text.length) / 7))]
+	});
+	const out = [];
+	evalElement(ctx, /* @__PURE__ */ new Map(), {
+		el: "div",
+		attrs: { "data-samva-preheader": text },
+		style: PREHEADER_STYLE,
+		children
+	}, 0, out);
+	return out[0] ?? {
+		t: "text",
+		v: ""
+	};
+};
+/** Put the block first inside `<body>`, or return undefined when there is no body. */
+const insertPreheader = (nodes, block) => {
+	for (const [index, node] of nodes.entries()) {
+		if (node.t !== "el") continue;
+		if (node.tag === "body") return nodes.with(index, {
+			...node,
+			children: [block, ...node.children]
+		});
+		const replaced = insertPreheader(node.children, block);
+		if (replaced !== void 0) return nodes.with(index, {
+			...node,
+			children: replaced
+		});
+	}
+};
+const serialize$1 = (node) => {
+	switch (node.t) {
+		case "text": return escapeText$1(node.v);
+		case "raw": return node.html;
+		case "el":
+			if (node.content === "raw") {
+				const css = node.children.map((child) => child.t === "text" ? child.v : "").join("");
+				return css === "" ? "" : `<${node.tag}${node.attrs}>${css}</${node.tag}>`;
+			}
+			if (node.content === "void") return `<${node.tag}${node.attrs} />`;
+			return `<${node.tag}${node.attrs}>${node.children.map(serialize$1).join("")}</${node.tag}>`;
+	}
+};
+/** Serialize while recording where each element lands, for the same document `serialize` writes. */
+const serializeWithPositions = (nodes, offset) => {
+	const positions = [];
+	let written = offset;
+	const write = (node) => {
+		switch (node.t) {
+			case "text": {
+				const out = escapeText$1(node.v);
+				written += out.length;
+				return out;
+			}
+			case "raw":
+				written += node.html.length;
+				return node.html;
+			case "el": {
+				const start = written;
+				let out;
+				if (node.content === "raw") {
+					const css = node.children.map((child) => child.t === "text" ? child.v : "").join("");
+					out = css === "" ? "" : `<${node.tag}${node.attrs}>${css}</${node.tag}>`;
+					written += out.length;
+				} else if (node.content === "void") {
+					out = `<${node.tag}${node.attrs} />`;
+					written += out.length;
+				} else {
+					const open = `<${node.tag}${node.attrs}>`;
+					written += open.length;
+					const inner = node.children.map(write).join("");
+					const close = `</${node.tag}>`;
+					written += close.length;
+					out = `${open}${inner}${close}`;
+				}
+				positions.push({
+					start,
+					end: written,
+					tag: node.tag,
+					...node.src === void 0 ? {} : { src: node.src }
+				});
+				return out;
+			}
+		}
+	};
+	return {
+		html: nodes.map(write).join(""),
+		positions
+	};
+};
+const PARAGRAPH = "\n\n";
+const LINE = "\n";
+const INVISIBLE = /​|‌|‍|‎|‏|⁠|/g;
+const TABLE_SECTIONS = /* @__PURE__ */ new Set([
+	"thead",
+	"tbody",
+	"tfoot"
+]);
+const isLayoutTable = (props) => props.get("role") === "presentation" || props.get("role") === "none";
+const wrap = (inner, separator) => {
+	const trimmed = inner.replace(/^\s+/, "").replace(/\s+$/, "");
+	return trimmed === "" ? "" : `${separator}${trimmed}${separator}`;
+};
+const collect = (nodes, keep, descend) => nodes.flatMap((child) => {
+	if (child.t !== "el") return [];
+	if (keep(child.tag)) return [child];
+	return descend(child.tag) ? collect(child.children, keep, descend) : [];
+});
+const childText = (node, context) => node.children.map((child) => derive(child, context)).join("");
+const isDecorativeCell = (cell, context) => {
+	const images = collect(cell.children, (tag) => tag === "img", () => true);
+	return images.length > 0 && images.every((image) => image.props.get("alt") === "") && childText(cell, context).trim() === "";
+};
+const deriveList = (node, context) => {
+	const indent = "  ".repeat(context.listDepth);
+	const start = Number(node.props.get("start") ?? 1);
+	const first = Number.isFinite(start) ? start : 1;
+	const nested = {
+		...context,
+		listDepth: context.listDepth + 1
+	};
+	const lines = collect(node.children, (tag) => tag === "li", () => false).map((item, index) => {
+		const marker = node.tag === "ol" ? `${first + index}.` : "-";
+		const continuation = `${indent}${" ".repeat(marker.length + 1)}`;
+		const [head = "", ...rest] = derive(item, nested).replace(/^\s+/, "").replace(/\s+$/, "").replace(/\n{2,}/g, LINE).split("\n");
+		return [`${indent}${marker} ${head}`, ...rest.map((line) => line.trim() === "" ? "" : /^\s/.test(line) ? line : `${continuation}${line}`)].join(LINE);
+	});
+	return wrap(lines.join(LINE), PARAGRAPH);
+};
+const deriveTable = (node, context) => {
+	if (isLayoutTable(node.props)) return childText(node, context);
+	const rows = collect(node.children, (tag) => tag === "tr", (tag) => TABLE_SECTIONS.has(tag)).map((row) => collect(row.children, (tag) => tag === "td" || tag === "th", () => false).filter((cell) => !isDecorativeCell(cell, context)).map((cell) => childText(cell, context).replace(/\s+/g, " ").trim()).join(" | "));
+	return wrap(rows.join(LINE), PARAGRAPH);
+};
+const deriveElement = (node, context) => {
+	switch (node.layout) {
+		case "metadata": return "";
+		case "document":
+		case "inline":
+		case "list-item": return childText(node, context);
+		case "break": return LINE;
+		case "rule": return `${PARAGRAPH}---${PARAGRAPH}`;
+		case "image": {
+			const alt = node.props.get("alt");
+			const trimmed = typeof alt === "string" ? alt.trim() : "";
+			return trimmed === "" ? "" : `[${trimmed}]`;
+		}
+		case "link": {
+			const label = childText(node, context).replace(/\s+/g, " ").trim();
+			const target = node.props.get("href");
+			const href = typeof target === "string" ? target : "";
+			if (href === "" || href === label) return label;
+			return label === "" ? href : `${label} (${href})`;
+		}
+		case "list": return deriveList(node, context);
+		case "table": return deriveTable(node, context);
+		case "row": return wrap(collect(node.children, (tag) => tag === "td" || tag === "th", () => false).map((cell) => childText(cell, context).replace(/^\s+|\s+$/g, "")).filter((cell) => cell !== "").join(LINE), LINE);
+		case "table-section":
+		case "cell": return wrap(childText(node, context), LINE);
+		case "preformatted": return wrap(childText(node, {
+			...context,
+			preformatted: true
+		}), PARAGRAPH);
+		case "block": return wrap(childText(node, context), PARAGRAPH);
+	}
+};
+const derive = (node, context) => {
+	switch (node.t) {
+		case "text": return context.preformatted ? node.v : node.v.replace(INVISIBLE, "").replace(/[^\S\n]+/g, " ");
+		case "raw": return node.text;
+		case "el": return deriveElement(node, context);
+	}
+};
+const normalize = (value) => value.replace(/\r\n?/g, "\n").split("\n").map((line) => line.replace(/[^\S\n]+$/, "")).join("\n").replace(/\n{3,}/g, PARAGRAPH).trim();
+const createContext = (ir, input, options, plain) => ({
+	input,
+	locale: options.locale ?? ir.locale,
+	timeZone: options.timeZone,
+	plain,
+	diagnostics: [],
+	iterations: 0,
+	fmt: void 0,
+	preheader: void 0,
+	markerUsed: false
+});
+const settle = (ctx) => {
+	if (ctx.diagnostics.length > 0) throw new IrRenderError(ctx.diagnostics);
+};
+/** Render the email channel of a compiled template against one validated input. */
+const renderIr = (ir, input, options = {}) => {
+	const email = ir.email;
+	if (email === void 0) return fail("missing-channel", "The template has no email channel.");
+	const ctx = createContext(ir, input, options, false);
+	const empty = /* @__PURE__ */ new Map();
+	const subject = textOf(evalValue(ctx, empty, email.subject, 0));
+	if (/[\r\n\u0000]/.test(subject)) fail("invalid-subject", "Invalid email subject: it must be one line of text.");
+	if (email.preheader !== void 0) {
+		const value = evalValue(ctx, empty, email.preheader, 0);
+		if (value !== void 0 && value !== null) ctx.preheader = textOf(value);
+	}
+	const preheader = ctx.preheader;
+	let tree = [];
+	const nodes = [];
+	evalNode(ctx, empty, email.body, 0, nodes);
+	tree = nodes;
+	if (preheader !== void 0 && !ctx.markerUsed) {
+		const block = preheaderBlock(ctx, preheader);
+		tree = insertPreheader(tree, block) ?? [block, ...tree];
+	}
+	settle(ctx);
+	const text = normalize(tree.map((node) => derive(node, {
+		preformatted: false,
+		listDepth: 0
+	})).join(""));
+	if (options.positions === true) {
+		const prefix = serializeWithPositions(tree, 0).html.startsWith("<html") ? EMAIL_DOCTYPE : "";
+		const shifted = serializeWithPositions(tree, prefix.length);
+		return {
+			subject,
+			preheader,
+			html: `${prefix}${shifted.html}`,
+			text,
+			positions: shifted.positions
+		};
+	}
+	const serialized = tree.map(serialize$1).join("");
+	return {
+		subject,
+		preheader,
+		html: serialized.startsWith("<html") ? `${EMAIL_DOCTYPE}${serialized}` : serialized,
+		text
+	};
+};
+const plainText = (ctx, nodes) => {
+	const out = [];
+	for (const node of asArray(nodes)) evalNode(ctx, /* @__PURE__ */ new Map(), node, 0, out);
+	return out.map((node) => node.t === "text" ? node.v : node.t === "raw" ? node.text : "").join("");
+};
+/** Render the SMS channel of a compiled template to plain text. */
+const renderIrSms = (ir, input, options = {}) => {
+	const sms = ir.sms;
+	if (sms === void 0) return fail("missing-channel", "The template has no SMS channel.");
+	const ctx = createContext(ir, input, options, true);
+	const text = plainText(ctx, sms.body);
+	settle(ctx);
+	return text;
+};
+const resolveButtons = (ctx, nodes, out, depth) => {
+	checkDepth(depth);
+	const scope = /* @__PURE__ */ new Map();
+	const value = (part) => textOf(evalValue(ctx, scope, part, 0));
+	for (const node of asArray(nodes)) {
+		if ("if" in node) {
+			const branch = evalPredicate(ctx, scope, node.if, depth + 1) ? node.then : node.else ?? [];
+			resolveButtons(ctx, branch, out, depth + 1);
+			continue;
+		}
+		switch (node.type) {
+			case "quick-reply":
+				out.push({
+					type: "quick-reply",
+					text: value(node.text)
+				});
+				break;
+			case "url": {
+				const url = value(node.url);
+				if (!isSafeUrl$1(url)) invalid("A button URL must be an absolute https URL.");
+				out.push({
+					type: "url",
+					text: value(node.text),
+					url
+				});
+				break;
+			}
+			case "phone":
+				out.push({
+					type: "phone",
+					text: value(node.text),
+					phone: value(node.phone)
+				});
+				break;
+			case "copy-code":
+				out.push({
+					type: "copy-code",
+					code: value(node.code)
+				});
+				break;
+			default: invalid("Unknown WhatsApp button.");
+		}
+	}
+};
+/** Render the WhatsApp channel of a compiled template: every text rendered, conditional buttons resolved. */
+const renderIrWhatsApp = (ir, input, options = {}) => {
+	const whatsapp = ir.whatsapp;
+	if (whatsapp === void 0) return fail("missing-channel", "The template has no WhatsApp channel.");
+	const ctx = createContext(ir, input, options, true);
+	const header = whatsapp.header === void 0 ? void 0 : {
+		type: whatsapp.header.type,
+		text: plainText(ctx, whatsapp.header.content)
+	};
+	if (header !== void 0 && header.type !== "text" && !isSafeUrl$1(header.text)) invalid("A media header URL must be an absolute https URL.");
+	const body = plainText(ctx, whatsapp.body);
+	const footer = whatsapp.footer === void 0 ? void 0 : plainText(ctx, whatsapp.footer);
+	const buttons = [];
+	resolveButtons(ctx, whatsapp.buttons ?? [], buttons, 0);
+	settle(ctx);
+	return {
+		...whatsapp.name === void 0 ? {} : { name: whatsapp.name },
+		language: whatsapp.language,
+		category: whatsapp.category,
+		...header === void 0 ? {} : { header },
+		body,
+		...footer === void 0 ? {} : { footer },
+		buttons
+	};
+};
+//#endregion
+//#region src/preview.ts
+/**
+* The attribute a preview stamps so a click in a rendered document resolves to exactly one
+* rendered element. A delivered message never carries it.
+*/
+const INSTANCE_PATH_ATTRIBUTE = "data-samva-instance";
+const locationKey = (origin) => `${origin.fileName}:${origin.lineNumber}:${origin.columnNumber}`;
+const originKey = (selection) => `${selection.tag}\u0000${selection.origins.map(locationKey).join("\0")}`;
+const parentOf = (instancePath) => {
+	const cut = instancePath.lastIndexOf(".");
+	return cut === -1 ? void 0 : instancePath.slice(0, cut);
+};
+/**
+* Turn one render's positions into selections, in document order. `occurrence` and `occurrences`
+* count the rendered elements that share an authored origin and tag.
+*/
+const emailSelections = (positions) => {
+	const counts = /* @__PURE__ */ new Map();
+	for (const position of positions) {
+		const key = originKey(position);
+		counts.set(key, (counts.get(key) ?? 0) + 1);
+	}
+	const seen = /* @__PURE__ */ new Map();
+	return [...positions].toSorted((left, right) => left.start === right.start ? right.end - left.end : left.start - right.start).map((position) => {
+		const key = originKey(position);
+		const occurrence = (seen.get(key) ?? 0) + 1;
+		seen.set(key, occurrence);
+		const parentPath = parentOf(position.instancePath);
+		return {
+			instancePath: position.instancePath,
+			tag: position.tag,
+			origins: position.origins,
+			authored: position.authored,
+			occurrence,
+			occurrences: counts.get(key) ?? 1,
+			...parentPath === void 0 ? {} : { parentPath },
+			start: position.start,
+			end: position.end
+		};
+	});
+};
+/**
+* Render one fixture with an instance path stamped on every element, and the selection each path
+* resolves to. The selections come from the spans the compiler recorded, so a click on the canvas
+* lands on the exact node of the source that produced it.
+*/
+const renderIrPreview = (ir, input, options = {}) => {
+	const rendered = renderIr(ir, input, {
+		...options,
+		positions: true
+	});
+	const sources = ir.sources ?? [];
+	const ordered = (rendered.positions ?? []).map((position) => {
+		const src = position.src;
+		const origins = src === void 0 ? [] : [{
+			fileName: sources[src[2] ?? 0] ?? "",
+			lineNumber: src[0],
+			columnNumber: src[1]
+		}];
+		return {
+			start: position.start,
+			end: position.end,
+			tag: position.tag,
+			src: src === void 0 ? void 0 : src.join(":"),
+			origins,
+			path: "",
+			parent: void 0
+		};
+	}).toSorted((left, right) => left.start === right.start ? right.end - left.end : left.start - right.start);
+	const open = [];
+	const childCount = /* @__PURE__ */ new Map();
+	for (const element of ordered) {
+		while (open.length > 0 && open[open.length - 1].end <= element.start) open.pop();
+		const parent = open[open.length - 1];
+		const index = childCount.get(parent) ?? 0;
+		childCount.set(parent, index + 1);
+		element.parent = parent;
+		element.path = parent === void 0 ? String(index) : `${parent.path}.${index}`;
+		open.push(element);
+	}
+	const inserts = ordered.map((element) => ({
+		at: element.start + 1 + element.tag.length,
+		text: ` ${INSTANCE_PATH_ATTRIBUTE}="${element.path}"`
+	}));
+	inserts.sort((left, right) => left.at - right.at);
+	let html = "";
+	let cursor = 0;
+	for (const insert of inserts) {
+		html += rendered.html.slice(cursor, insert.at) + insert.text;
+		cursor = insert.at;
+	}
+	html += rendered.html.slice(cursor);
+	const shift = (offset) => {
+		let moved = 0;
+		for (const insert of inserts) {
+			if (insert.at > offset) break;
+			moved += insert.text.length;
+		}
+		return offset + moved;
+	};
+	const positions = ordered.map((element) => ({
+		start: shift(element.start),
+		end: shift(element.end),
+		origins: element.origins,
+		instancePath: element.path,
+		tag: element.tag,
+		authored: element.src !== void 0 && (element.parent === void 0 || element.parent.src !== element.src)
+	}));
+	const selections = emailSelections(positions);
+	return {
+		subject: rendered.subject,
+		preheader: rendered.preheader,
+		html,
+		text: rendered.text,
+		selections
+	};
+};
+/** Look selections up by the instance path a rendered document carries. */
+const emailSelectionIndex = (selections) => new Map(selections.map((selection) => [selection.instancePath, selection]));
+/**
+* The authoring element a selection edits. For an authored element that is the element itself; for
+* a generated wrapper it is the primitive that asked for it. Undefined only where the compiler
+* generated markup with no authoring behind it, which nothing can edit in place.
+*/
+const emailAuthoringTarget = (selection) => selection.origins[0];
+/** Root-first ancestry of a selection, itself last. */
+const emailSelectionAncestry = (index, instancePath) => {
+	const chain = [];
+	let current = index.get(instancePath);
+	while (current !== void 0) {
+		chain.unshift(current);
+		current = current.parentPath === void 0 ? void 0 : index.get(current.parentPath);
+	}
+	return chain;
+};
+/**
+* Every rendered instance produced by the same authored element, in document order. One entry
+* means it rendered once; several mean it repeated.
+*/
+const emailSelectionSiblings = (selections, selection) => {
+	const key = originKey(selection);
+	return selections.filter((candidate) => originKey(candidate) === key);
+};
+/**
+* Every rendered instance of the same authored element. A partial edited at its definition changes
+* all of these, which is the scope a control has to name before it applies.
+*/
+const emailDefinitionInstances = (selections, selection) => {
+	const authoring = selection.origins[0];
+	const key = `${selection.tag}\u0000${authoring === void 0 ? "" : locationKey(authoring)}`;
+	return selections.filter((candidate) => {
+		const origin = candidate.origins[0];
+		return `${candidate.tag}\u0000${origin === void 0 ? "" : locationKey(origin)}` === key;
+	});
+};
+//#endregion
+//#region src/email/html.ts
+/** Escape a value for element content. */
+const escapeText = (value) => value.replace(/[&<>]/g, (character) => ({
+	"&": "&amp;",
+	"<": "&lt;",
+	">": "&gt;"
+})[character] ?? character);
+/** Escape a value for a double-quoted attribute. */
+const escapeAttribute = (value) => value.replace(/[&<>"']/g, (character) => ({
+	"&": "&amp;",
+	"<": "&lt;",
+	">": "&gt;",
+	"\"": "&quot;",
+	"'": "&#39;"
+})[character] ?? character);
+const CONTROL_CHARACTERS = /[\u0000-\u001f\u007f]/;
+const SAFE_URL_SCHEME = /^(https:\/\/|mailto:|tel:|cid:|#)/i;
+const RELATIVE_URL = /^(\.{1,2}\/|\/(?!\/))/;
+/**
+* Only references an email client will follow safely; no `javascript:`, no
+* `data:`. A relative reference is legal only for an export: a file on disk can
+* resolve one against its own directory, and a delivered message cannot resolve
+* anything but an absolute URL.
+*/
+const isSafeUrl = (value, relative) => !/^[\u0000-\u0020]/.test(value) && !CONTROL_CHARACTERS.test(value) && !value.includes("\\") && (SAFE_URL_SCHEME.test(value) || relative && RELATIVE_URL.test(value));
+const CSS_PROPERTY = /^(--[a-zA-Z0-9-]+|[a-zA-Z][a-zA-Z0-9-]*)$/;
+const CSS_UNSAFE = /[;{}<>\\]|expression\s*\(|@import|\/\*/i;
+const CSS_URL = /url\(\s*(['"]?)([^'")]*)\1\s*\)/gi;
+/** camelCase to kebab-case; already-kebab names pass through unchanged. */
+const kebab = (property) => property.startsWith("--") ? property : property.replace(/[A-Z]/g, (l) => `-${l.toLowerCase()}`);
+const UNITLESS = /* @__PURE__ */ new Set([
+	"opacity",
+	"zIndex",
+	"fontWeight",
+	"lineHeight",
+	"order",
+	"flexGrow",
+	"flexShrink",
+	"columnCount",
+	"orphans",
+	"widows",
+	"zoom",
+	"fillOpacity",
+	"strokeOpacity"
+]);
+/** A bare number is pixels for every property that takes a length. */
+const declarationValue = (property, value) => typeof value === "number" && value !== 0 && !UNITLESS.has(property) && !property.startsWith("--") ? `${value}px` : String(value);
+const report = (sink, code, message, origins, severity = "error") => {
+	sink.diagnostics.push({
+		code,
+		severity,
+		message,
+		origins
+	});
+};
+const declarations = (sink, style, origins) => {
+	const parts = [];
+	for (const [property, value] of Object.entries(style)) {
+		if (value === void 0 || value === null) continue;
+		if (!CSS_PROPERTY.test(property)) {
+			report(sink, "unsupported-style-property", `Style property ${JSON.stringify(property)} is not a CSS property name; write it in camelCase (backgroundColor) or as a custom property (--brand).`, origins);
+			continue;
+		}
+		if (typeof value !== "string" && typeof value !== "number") {
+			report(sink, "invalid-style-value", `Style ${property} must be a string or number, not ${typeof value}.`, origins);
+			continue;
+		}
+		const text = declarationValue(property, value);
+		if (CSS_UNSAFE.test(text) || CONTROL_CHARACTERS.test(text)) {
+			report(sink, "unsafe-style-value", `Style ${property} contains CSS that could break out of the declaration; remove ${JSON.stringify(text)}.`, origins);
+			continue;
+		}
+		let unsafeUrl;
+		for (const match of text.matchAll(CSS_URL)) if (!isSafeUrl(match[2] ?? "", sink.relativeUrls)) unsafeUrl = match[2] ?? "";
+		if (unsafeUrl !== void 0) {
+			report(sink, "unsafe-url", `Style ${property} points at ${JSON.stringify(unsafeUrl)}; email URLs must use https:, mailto:, tel:, cid: or a fragment${sink.relativeUrls ? ", or a relative path" : ""}.`, origins);
+			continue;
+		}
+		parts.push(`${kebab(property)}:${text}`);
+	}
+	return parts.join(";");
+};
+const attributeValue = (sink, tag, name, spec, value, origins) => {
+	if (value === void 0 || value === null || value === false) return void 0;
+	if (value === true) return "";
+	if (typeof value !== "string" && typeof value !== "number") {
+		report(sink, "invalid-attribute-value", `<${tag} ${name}> must be a string or number, not ${typeof value}.`, origins);
+		return;
+	}
+	const text = String(value);
+	if (CONTROL_CHARACTERS.test(text)) {
+		report(sink, "invalid-attribute-value", `<${tag} ${name}> contains control characters.`, origins);
+		return;
+	}
+	if (spec.values !== void 0 && !spec.values.includes(text)) {
+		report(sink, "invalid-attribute-value", `<${tag} ${name}> accepts ${spec.values.join(", ")}; received ${JSON.stringify(text)}.`, origins);
+		return;
+	}
+	if (spec.type === "number" && !/^-?\d+$/.test(text)) {
+		report(sink, "invalid-attribute-value", `<${tag} ${name}> must be an integer.`, origins);
+		return;
+	}
+	if (spec.type === "measure" && !/^\d+(\.\d+)?%?$/.test(text)) {
+		report(sink, "invalid-attribute-value", `<${tag} ${name}> must be a pixel count or a percentage.`, origins);
+		return;
+	}
+	if (spec.type === "url" && !isSafeUrl(text, sink.relativeUrls)) {
+		report(sink, "unsafe-url", sink.relativeUrls ? `<${tag} ${name}> must use https:, mailto:, tel:, cid:, a fragment, or a relative path; received ${JSON.stringify(text)}.` : `<${tag} ${name}> must use https:, mailto:, tel:, cid: or a fragment; received ${JSON.stringify(text)}. A relative path resolves only in an export, never in a delivered message.`, origins);
+		return;
+	}
+	return text;
+};
+const attributes = (sink, tag, spec, props, origins) => {
+	const emitted = [];
+	const present = /* @__PURE__ */ new Set();
+	let classes;
+	const unsubscribeLink = tag === "a" && props[UNSUBSCRIBE_LINK] === true;
+	for (const [key, value] of Object.entries(props)) {
+		if (key === "key") continue;
+		const name = key === "className" ? "class" : key;
+		if (unsubscribeLink && name === "href" && value === "%samva:unsubscribe-url%") {
+			present.add(name);
+			emitted.push(` href="${UNSUBSCRIBE_URL_PLACEHOLDER$1}" ses:no-track`);
+			continue;
+		}
+		if (name === "class") {
+			if (value === void 0 || value === null) continue;
+			if (typeof value !== "string") {
+				report(sink, "invalid-attribute-value", `<${tag} class> must be a string.`, origins);
+				continue;
+			}
+			if (classes !== void 0) {
+				report(sink, "duplicate-attribute", `<${tag}> sets both class and className; keep one.`, origins);
+				continue;
+			}
+			classes = value;
+			emitted.push(` class="${escapeAttribute(value)}"`);
+			continue;
+		}
+		if (name === "style") {
+			if (value === void 0 || value === null) continue;
+			if (!isObject(value) || Array.isArray(value)) {
+				report(sink, "invalid-style", `<${tag} style> must be a property object, for example style={{ backgroundColor: "#fff" }}.`, origins);
+				continue;
+			}
+			const css = declarations(sink, value, origins);
+			if (css !== "") emitted.push(` style="${escapeAttribute(css)}"`);
+			continue;
+		}
+		if (/^on/i.test(name)) {
+			report(sink, "event-handler", `<${tag} ${name}> is an event handler; email clients strip scripting and Samva refuses it.`, origins);
+			continue;
+		}
+		if (RESERVED_FOOTER_ATTRIBUTES.has(name) && props[BRAND_FOOTER_MARKER] !== true) {
+			report(sink, "reserved-attribute", `<${tag} ${name}> is written only by BrandFooter from samva:brand; render BrandFooter instead of marking an element as the footer.`, origins);
+			continue;
+		}
+		if (/^(data|aria)-[a-z0-9-]+$/.test(name)) {
+			const text = attributeValue(sink, tag, name, { type: "string" }, value, origins);
+			if (text !== void 0) emitted.push(` ${name}="${escapeAttribute(text)}"`);
+			continue;
+		}
+		const globalAttributes = EMAIL_GLOBAL_ATTRIBUTES;
+		const attribute = Object.hasOwn(globalAttributes, name) ? globalAttributes[name] : Object.hasOwn(spec.attributes, name) ? spec.attributes[name] : void 0;
+		if (attribute === void 0) {
+			const supported = [
+				...Object.keys(EMAIL_GLOBAL_ATTRIBUTES),
+				...Object.keys(spec.attributes),
+				"class",
+				"style"
+			].sort().join(", ");
+			report(sink, "unsupported-attribute", `<${tag}> does not support the ${name} attribute. Supported: ${supported}, plus data-* and aria-*.`, origins);
+			continue;
+		}
+		present.add(name);
+		const text = attributeValue(sink, tag, name, attribute, value, origins);
+		if (text !== void 0) emitted.push(` ${name}="${escapeAttribute(text)}"`);
+	}
+	for (const [name, attribute] of Object.entries(spec.attributes)) if (attribute.required === true && !present.has(name)) report(sink, "missing-attribute", `<${tag}> requires the ${name} attribute.`, origins);
+	return emitted.join("");
+};
+/** Fragments are transparent to a content model; raw compatibility markup is not content. */
+const contentChildren = (children) => children.flatMap((child) => child.type === "Fragment" ? contentChildren(child.children) : [child]);
+const checkContentModel = (sink, tag, spec, children, origins) => {
+	if (spec.content === "void") {
+		if (contentChildren(children).length > 0) report(sink, "void-element-children", `<${tag}> cannot have children.`, origins);
+		return;
+	}
+	if (spec.content === "text" || spec.content === "raw") {
+		for (const child of contentChildren(children)) if (child.type !== "Text") report(sink, "invalid-content", `<${tag}> accepts text only.`, child.type === "Element" ? child.origins : origins);
+		return;
+	}
+	if (spec.childElements === void 0) return;
+	for (const child of contentChildren(children)) {
+		if (child.type === "Raw") continue;
+		if (child.type === "Text") {
+			if (child.value.trim() !== "") report(sink, "invalid-content", `<${tag}> cannot contain text directly; put it inside <${spec.childElements[0]}>.`, origins);
+			continue;
+		}
+		if (child.type === "Element" && !spec.childElements.includes(child.tag)) report(sink, "invalid-content", `<${tag}> accepts only ${spec.childElements.map((name) => `<${name}>`).join(", ")}; found <${child.tag}>.`, child.origins);
+	}
+};
+/** Every write goes through here so `sink.written` stays the emitted offset. */
+const emit = (sink, text) => {
+	sink.written += text.length;
+	return text;
+};
+const serialize = (sink, node, parentPath, counter) => {
+	switch (node.type) {
+		case "Text": return emit(sink, escapeText(node.value));
+		case "Raw": return emit(sink, node.html);
+		case "Fragment": return node.children.map((child) => serialize(sink, child, parentPath, counter)).join("");
+		case "Element": {
+			const start = sink.written;
+			const index = counter.next++;
+			const path = parentPath === "" ? String(index) : `${parentPath}.${index}`;
+			const own = { next: 0 };
+			const stamp = sink.instancePaths ? ` ${INSTANCE_PATH_ATTRIBUTE}="${path}"` : "";
+			const spec = emailElement(node.tag);
+			if (spec === void 0) {
+				report(sink, "unsupported-element", `<${node.tag}> is not part of the supported email vocabulary. Supported elements: ${Object.keys(EMAIL_ELEMENTS).join(", ")}.`, node.origins);
+				return "";
+			}
+			checkContentModel(sink, node.tag, spec, node.children, node.origins);
+			if (spec.content === "raw") {
+				const css = node.children.map((child) => child.type === "Text" ? child.value : "").join("");
+				if (/<\/|<!--/i.test(css)) {
+					report(sink, "unsafe-raw-text", `<${node.tag}> content cannot contain markup.`, node.origins);
+					return "";
+				}
+				const rawAttrs = attributes(sink, node.tag, spec, node.props, node.origins);
+				const raw = css === "" ? "" : `<${node.tag}${rawAttrs}${stamp}>${css}</${node.tag}>`;
+				return record(sink, start, node, path, emit(sink, raw));
+			}
+			const attrs = attributes(sink, node.tag, spec, node.props, node.origins);
+			if (spec.content === "void") return record(sink, start, node, path, emit(sink, `<${node.tag}${attrs}${stamp} />`));
+			const open = emit(sink, `<${node.tag}${attrs}${stamp}>`);
+			const children = node.children.map((child) => serialize(sink, child, path, own)).join("");
+			const close = emit(sink, `</${node.tag}>`);
+			return record(sink, start, node, path, `${open}${children}${close}`);
+		}
+	}
+};
+/** Record an element's emitted range once its content is written. */
+const record = (sink, start, node, instancePath, text) => {
+	sink.positions.push({
+		start,
+		end: sink.written,
+		origins: node.origins,
+		instancePath,
+		tag: node.tag,
+		authored: node.authored
+	});
+	return text;
+};
+/** Lower the derived tree to email HTML, reporting every unsupported construct with its origin. */
+const serializeEmailHtml = (node, options = {}) => {
+	const sink = {
+		diagnostics: [],
+		positions: [],
+		written: 0,
+		relativeUrls: options.relativeUrls === true,
+		instancePaths: options.instancePaths === true
+	};
+	return {
+		html: serialize(sink, node, "", { next: 0 }),
+		diagnostics: sink.diagnostics,
+		positions: sink.positions
+	};
+};
+/** An authored style object as a declaration list, checked by the same rules as a serialized tree. */
+const serializeStyle = (style, origins) => {
+	const sink = {
+		diagnostics: [],
+		positions: [],
+		written: 0,
+		relativeUrls: false,
+		instancePaths: false
+	};
+	return {
+		css: declarations(sink, style, origins),
+		diagnostics: sink.diagnostics
+	};
+};
+/**
+* Check one static attribute value against its element's spec, as serialization does. Returns
+* the text that would be emitted, or `undefined` when the attribute is dropped or invalid.
+*/
+const checkAttribute = (tag, name, value, origins) => {
+	const sink = {
+		diagnostics: [],
+		positions: [],
+		written: 0,
+		relativeUrls: false,
+		instancePaths: false
+	};
+	const element = emailElement(tag);
+	const globals = EMAIL_GLOBAL_ATTRIBUTES;
+	const attributeSpec = () => {
+		if (/^(data|aria)-[a-z0-9-]+$/.test(name)) return { type: "string" };
+		if (Object.hasOwn(globals, name)) return globals[name];
+		if (element !== void 0 && Object.hasOwn(element.attributes, name)) return element.attributes[name];
+	};
+	const spec = attributeSpec();
+	if (spec === void 0) return {
+		text: void 0,
+		diagnostics: sink.diagnostics
+	};
+	return {
+		text: attributeValue(sink, tag, name, spec, value, origins),
+		diagnostics: sink.diagnostics
+	};
+};
+//#endregion
+//#region src/email/components.ts
+/** Marks the hidden preview block so the renderer can read it back and the text lane can keep it. */
+const PREHEADER_ATTRIBUTE = "data-samva-preheader";
+const PREHEADER_PADDING_ATTRIBUTE = "data-samva-preheader-padding";
+const PREHEADER_TARGET_LENGTH = 200;
+const PREHEADER_PADDING = "\xA0‌​‍‎‏";
+const presentation = (table, row, rowProps = {}) => jsx("table", {
+	role: "presentation",
+	border: 0,
+	cellpadding: 0,
+	cellspacing: 0,
+	...table,
+	children: jsx("tbody", { children: jsx("tr", {
+		...rowProps,
+		children: row
+	}) })
+});
+/** The hidden inbox preview block. Padding characters stop the client borrowing body copy. */
+const preheaderNode = (text) => jsx("div", {
+	[PREHEADER_ATTRIBUTE]: text,
+	style: {
+		display: "none",
+		overflow: "hidden",
+		lineHeight: "1px",
+		opacity: 0,
+		maxHeight: 0,
+		maxWidth: 0
+	},
+	children: [text, text.length >= PREHEADER_TARGET_LENGTH ? null : jsx("div", {
+		[PREHEADER_PADDING_ATTRIBUTE]: true,
+		children: PREHEADER_PADDING.repeat(Math.ceil((PREHEADER_TARGET_LENGTH - text.length) / 7))
+	})]
+});
+/** Document shell: the head every target client needs, plus the body content cell. */
+const Email = ({ className, lang = "en", dir = "ltr", title, backgroundColor, style, children }) => jsx("html", {
+	lang,
+	dir,
+	xmlns: "http://www.w3.org/1999/xhtml",
+	"xmlns:o": "urn:schemas-microsoft-com:office:office",
+	children: [jsx("head", { children: [
+		jsx("meta", { charset: "utf-8" }),
+		jsx("meta", {
+			"http-equiv": "Content-Type",
+			content: "text/html; charset=UTF-8"
+		}),
+		jsx("meta", {
+			name: "viewport",
+			content: "width=device-width, initial-scale=1"
+		}),
+		jsx("meta", { name: "x-apple-disable-message-reformatting" }),
+		jsx("meta", {
+			name: "color-scheme",
+			content: "light dark"
+		}),
+		jsx("meta", {
+			name: "supported-color-schemes",
+			content: "light dark"
+		}),
+		title === void 0 ? null : jsx("title", { children: title }),
+		rawMarkup("<!--[if mso]><xml><o:OfficeDocumentSettings><o:PixelsPerInch>96</o:PixelsPerInch></o:OfficeDocumentSettings></xml><![endif]-->")
+	] }), jsx("body", {
+		style: {
+			margin: 0,
+			padding: 0,
+			...backgroundColor === void 0 ? {} : { backgroundColor }
+		},
+		children: [presentation({
+			align: "center",
+			width: "100%",
+			...backgroundColor === void 0 ? {} : { bgcolor: backgroundColor }
+		}, jsx("td", {
+			className,
+			...style === void 0 ? {} : { style },
+			children
+		}))]
+	})]
+});
+/** A full-width band of content, as the single-cell table every client agrees on. */
+const Section = ({ className, align = "center", width = "100%", bgcolor, style, tableStyle, children }) => presentation({
+	align,
+	width,
+	...bgcolor === void 0 ? {} : { bgcolor },
+	...tableStyle === void 0 ? {} : { style: tableStyle }
+}, jsx("td", {
+	className,
+	...style === void 0 ? {} : { style },
+	children
+}));
+/** The equal share of a row that each of `count` cells takes, whole percent rounded down. */
+const equalColumnWidth = (count) => `${Math.floor(100 / count)}%`;
+/** Give a `Column` that states no width its equal share, keeping the primitive's attribute order. */
+const withColumnWidth = (node, width) => {
+	if (node.type === "Fragment") return EmailNode.Fragment({ children: node.children.map((child) => withColumnWidth(child, width)) });
+	if (node.type !== "Element" || node.tag !== "td" || node.props.width !== void 0) return node;
+	const props = {};
+	for (const [key, value] of Object.entries(node.props)) {
+		if (key === "style") props.width = width;
+		props[key] = value;
+	}
+	if (props.width === void 0) props.width = width;
+	return EmailNode.Element({
+		...node,
+		props
+	});
+};
+/**
+* A row of side-by-side `Column`s. No flex or grid conversion happens here. With `each` it repeats
+* its cells over a list, `per` to a row, and splits the row equally between cells that state no
+* width.
+*/
+const Columns = ({ className, align = "center", width = "100%", style, each, per, children }) => {
+	const table = {
+		className,
+		align,
+		width,
+		...style === void 0 ? {} : { style }
+	};
+	if (each === void 0 || typeof children !== "function") return presentation(table, children, { style: { width: "100%" } });
+	if (per !== void 0 && (!Number.isInteger(per) || per < 1)) reportEmailDiagnostic({
+		code: "invalid-columns-per",
+		severity: "error",
+		message: "<Columns per> must be a positive integer."
+	});
+	const size = per !== void 0 && Number.isInteger(per) && per >= 1 ? per : void 0;
+	const chunks = [];
+	if (size === void 0) chunks.push(each);
+	else for (let at = 0; at < each.length; at += size) chunks.push(each.slice(at, at + size));
+	const share = equalColumnWidth(size ?? Math.max(each.length, 1));
+	return jsx(Fragment, { children: chunks.map((chunk) => presentation(table, chunk.flatMap((item, index) => normalizeChildren(children(item, index)).map((cell) => withColumnWidth(cell, share))), { style: { width: "100%" } })) });
+};
+/** One cell of a `Columns` row. */
+const Column = ({ className, align, valign, width, style, children }) => jsx("td", {
+	className,
+	...align === void 0 ? {} : { align },
+	...valign === void 0 ? {} : { valign },
+	...width === void 0 ? {} : { width },
+	...style === void 0 ? {} : { style },
+	children
+});
+const DEFAULT_BUTTON_FONT = "Helvetica, Arial, sans-serif";
+/** Average advance of a bold sans-serif glyph, as a fraction of the font size. */
+const BOLD_GLYPH_ADVANCE = .6;
+const invalidButtonNumber = (name) => reportEmailDiagnostic({
+	code: "invalid-button-number",
+	severity: "error",
+	message: `<Button ${name}> must be a finite number.`
+});
+const buttonNumber = (name, value, fallback) => {
+	if (typeof value === "number" && Number.isFinite(value)) return value;
+	invalidButtonNumber(name);
+	return fallback;
+};
+const optionalButtonNumber = (name, value) => {
+	if (value === void 0) return void 0;
+	if (typeof value === "number" && Number.isFinite(value)) return value;
+	invalidButtonNumber(name);
+};
+const optionalPositiveButtonNumber = (name, value) => {
+	if (value === void 0) return void 0;
+	if (typeof value === "number" && Number.isFinite(value) && value > 0) return value;
+	reportEmailDiagnostic({
+		code: "invalid-button-number",
+		severity: "error",
+		message: `<Button ${name}> must be a positive finite number.`
+	});
+};
+/** A link styled as a button, with a VML fallback so classic Outlook draws the shape. */
+const Button = ({ className, href, width, height, paddingX = 16, backgroundColor = "#000000", color = "#ffffff", borderRadius = 0, borderColor, borderWidth = 0, fontSize = 16, fontFamily = DEFAULT_BUTTON_FONT, align = "left", style, children }) => {
+	const safeWidth = optionalButtonNumber("width", width);
+	const safeHeight = optionalPositiveButtonNumber("height", height);
+	const safePaddingX = buttonNumber("paddingX", paddingX, 16);
+	const safeBorderRadius = buttonNumber("borderRadius", borderRadius, 0);
+	const safeBorderWidth = buttonNumber("borderWidth", borderWidth, 0);
+	const safeFontSize = buttonNumber("fontSize", fontSize, 16);
+	const label = typeof children === "string" ? children : void 0;
+	const fallback = safeHeight !== void 0 && label !== void 0;
+	if (!fallback) reportEmailDiagnostic({
+		code: "button-outlook-fallback",
+		severity: "warning",
+		message: "<Button> draws its classic Outlook shape from VML, which needs a height and a plain string label. Without both, classic Windows Outlook shows an unstyled link.",
+		clients: ["outlook-windows"]
+	});
+	const arcsize = safeHeight === void 0 ? 0 : Math.round(safeBorderRadius / safeHeight * 100);
+	const fallbackWidth = safeWidth ?? Math.ceil((label?.length ?? 0) * safeFontSize * BOLD_GLYPH_ADVANCE) + 2 * safePaddingX;
+	return presentation({
+		width: "100%",
+		style: { borderCollapse: "collapse" }
+	}, jsx("td", {
+		align,
+		children: [fallback ? rawMarkup(`<!--[if mso]><v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="${escapeAttribute(href)}" style="height:${safeHeight}px;v-text-anchor:middle;width:${fallbackWidth}px;" arcsize="${arcsize}%" ${borderColor === void 0 ? "stroke=\"false\"" : `strokecolor="${escapeAttribute(borderColor)}" strokeweight="${safeBorderWidth}px"`} fillcolor="${escapeAttribute(backgroundColor)}"><w:anchorlock/><center style="color:${escapeAttribute(color)};font-family:${escapeAttribute(fontFamily)};font-size:${safeFontSize}px;font-weight:bold;">${escapeText(label)}</center></v:roundrect><![endif]-->`) : null, jsx("a", {
+			className,
+			href,
+			target: "_blank",
+			rel: "noopener noreferrer",
+			style: {
+				backgroundColor,
+				color,
+				borderRadius: `${safeBorderRadius}px`,
+				display: "inline-block",
+				fontFamily,
+				fontSize: `${safeFontSize}px`,
+				fontWeight: "bold",
+				lineHeight: safeHeight === void 0 ? "120%" : `${safeHeight - 2 * safeBorderWidth}px`,
+				textAlign: "center",
+				textDecoration: "none",
+				...safeWidth === void 0 ? { padding: `0 ${safePaddingX}px` } : {
+					width: `${safeWidth}px`,
+					maxWidth: "100%"
+				},
+				...borderColor === void 0 ? {} : { border: `${safeBorderWidth}px solid ${borderColor}` },
+				...fallback ? { msoHide: "all" } : {},
+				...style
+			},
+			children
+		})]
+	}));
+};
+/** Vertical space that survives clients which collapse margins. */
+const Spacer = ({ height }) => presentation({ width: "100%" }, jsx("td", {
+	height,
+	style: {
+		height: `${height}px`,
+		lineHeight: `${height}px`,
+		fontSize: "1px"
+	},
+	children: "​"
+}));
+/** A horizontal rule drawn as a cell border, which every target client renders. */
+const Divider = ({ className, color = "#e5e7eb", thickness = 1, style }) => presentation({ width: "100%" }, jsx("td", {
+	className,
+	style: {
+		borderTop: `${thickness}px solid ${color}`,
+		fontSize: "1px",
+		lineHeight: "1px",
+		...style
+	},
+	children: "​"
+}));
+/** An image with the width/height attributes Outlook sizes from before CSS applies. */
+const Image = ({ className, src, alt, width, height, align, style }) => jsx("img", {
+	className,
+	src,
+	alt,
+	border: 0,
+	...width === void 0 ? {} : { width },
+	...height === void 0 ? {} : { height },
+	...align === void 0 ? {} : { align },
+	style: {
+		display: "block",
+		outline: "none",
+		border: "none",
+		textDecoration: "none",
+		maxWidth: "100%",
+		...style
+	}
+});
+/** A text link that opens outside the client and cannot reach back at the opener. */
+const Link = ({ className, href, target = "_blank", rel = "noopener noreferrer", style, children }) => jsx("a", {
+	className,
+	href,
+	target,
+	rel,
+	style: {
+		color: "#067df7",
+		textDecoration: "none",
+		...style
+	},
+	children
+});
+//#endregion
+export { renderIrSms as A, emailSelectionAncestry as C, renderIrPreview as D, emailSelections as E, isUrlAttribute as F, EMAIL_ELEMENTS as M, EMAIL_GLOBAL_ATTRIBUTES as N, IrRenderError as O, emailElement as P, emailDefinitionInstances as S, emailSelectionSiblings as T, kebab as _, Email as a, INSTANCE_PATH_ATTRIBUTE as b, PREHEADER_ATTRIBUTE as c, equalColumnWidth as d, preheaderNode as f, escapeText as g, escapeAttribute as h, Divider as i, renderIrWhatsApp as j, renderIr as k, Section as l, declarationValue as m, Column as n, Image as o, checkAttribute as p, Columns as r, Link as s, Button as t, Spacer as u, serializeEmailHtml as v, emailSelectionIndex as w, emailAuthoringTarget as x, serializeStyle as y };
+
+//# sourceMappingURL=components-BZCqegS8.js.map