@samva/markup 0.16.0 → 0.17.1

package/dist/cascade-DoLWZ66g.js

@@ -1,701 +0,0 @@
-import { n as isObject } from "./guards-eV1qLbf2.js";
-import { a as kebab, n as declarationValue, r as escapeAttribute } from "./html-BvRFepeO.js";
-import { t as EmailNode } from "./jsx-runtime-CBlexoeR.js";
-import { i as withinDarkScheme, t as DARK_SCHEME_MEDIA } from "./dark-scheme-CbCwGDWH.js";
-//#region src/email/font-stacks.ts
-/** Generic families every email client understands as the last resort in a stack. */
-const GENERIC_FAMILIES = /* @__PURE__ */ new Set([
-	"serif",
-	"sans-serif",
-	"monospace",
-	"cursive",
-	"fantasy"
-]);
-/** One family name as written, without its quotes and with runs of spaces collapsed. */
-const unquote = (value) => {
-	const trimmed = value.trim();
-	const quote = trimmed[0];
-	return (quote === "\"" || quote === "'") && trimmed.endsWith(quote) && trimmed.length >= 2 ? trimmed.slice(1, -1) : trimmed.replace(/\s+/g, " ");
-};
-/** The families of a `font-family` value, unquoted, in stack order. */
-const fontStackFamilies = (value) => {
-	const families = [];
-	let start = 0;
-	let quote;
-	for (let index = 0; index < value.length; index++) {
-		const character = value[index];
-		if (quote !== void 0) {
-			if (character === quote) quote = void 0;
-		} else if (character === "'" || character === "\"") quote = character;
-		else if (character === ",") {
-			families.push(unquote(value.slice(start, index)));
-			start = index + 1;
-		}
-	}
-	families.push(unquote(value.slice(start)));
-	return families.filter((family) => family !== "");
-};
-const FONT_SIZE = /^(?:xx-small|x-small|small|medium|large|x-large|xx-large|xxx-large|larger|smaller|[+-]?(?:\d+\.?\d*|\.\d+)(?:[a-z]+|%)|(?:calc|clamp|min|max|var)\(.*\))$/i;
-/** Whitespace-separated tokens at the top level, keeping parentheses and quotes whole. */
-const shorthandTokens = (value) => {
-	const tokens = [];
-	let current = "";
-	let depth = 0;
-	let quote;
-	for (const character of value.trim()) {
-		if (quote !== void 0) {
-			if (character === quote) quote = void 0;
-		} else if (character === "'" || character === "\"") quote = character;
-		else if (character === "(") depth++;
-		else if (character === ")") depth--;
-		else if (/\s/.test(character) && depth === 0) {
-			if (current !== "") tokens.push(current);
-			current = "";
-			continue;
-		}
-		current += character;
-	}
-	if (current !== "") tokens.push(current);
-	return tokens;
-};
-/**
-* The family list of a `font` shorthand: everything after the size (and its
-* optional line height), or `undefined` for a system-font keyword that names
-* no family.
-*/
-const fontShorthandFamilies = (value) => {
-	const tokens = shorthandTokens(value);
-	const size = tokens.findIndex((token) => FONT_SIZE.test(token.replace(/\/.*$/, "")));
-	if (size < 0) return void 0;
-	let next = size + 1;
-	const sizeToken = tokens[size];
-	if (sizeToken.endsWith("/")) next += 1;
-	else if (!sizeToken.includes("/") && tokens[next]?.startsWith("/")) next += tokens[next] === "/" ? 2 : 1;
-	const family = tokens.slice(next).join(" ");
-	return family === "" ? void 0 : family;
-};
-/**
-* True when a stack names a declared project family without ending in a
-* generic. `declared` holds lowercased family names. A quoted `"sans-serif"`
-* names a font called sans-serif, not the generic, so it does not count.
-*/
-const lacksGenericFallback = (value, declared) => {
-	const stack = value.replace(/\s*!important\s*$/i, "");
-	if (!fontStackFamilies(stack).some((family) => declared.has(family.toLowerCase()))) return false;
-	const last = stack.slice(stack.lastIndexOf(",") + 1).trim();
-	return !GENERIC_FAMILIES.has(last.toLowerCase());
-};
-const fontFallbackDiagnostic = (value) => ({
-	code: "email-font-fallback",
-	severity: "error",
-	message: `font-family ${JSON.stringify(value)} uses a project font without a generic fallback. Clients that drop webfonts (Gmail, classic Outlook) render this stack as written, so end it with sans-serif, serif or monospace.`
-});
-//#endregion
-//#region src/email/selectors.ts
-const classListOf = (element) => {
-	const value = element.props.class ?? element.props.className;
-	return typeof value === "string" ? value.split(/\s+/).filter((name) => name !== "") : [];
-};
-const attributeOf = (element, name) => {
-	const value = element.props[name];
-	if (value === void 0 || value === null || value === false) return void 0;
-	if (value === true) return "";
-	return typeof value === "string" || typeof value === "number" ? String(value) : void 0;
-};
-const matchesAttribute = (element, test) => {
-	const actual = test.name === "class" ? classListOf(element).join(" ") : attributeOf(element, test.name);
-	if (actual === void 0) return false;
-	if (test.operator === void 0 || test.value === void 0) return true;
-	switch (test.operator) {
-		case "=": return actual === test.value;
-		case "~=": return actual.split(/\s+/).includes(test.value);
-		case "^=": return actual.startsWith(test.value);
-		case "$=": return actual.endsWith(test.value);
-		case "*=": return actual.includes(test.value);
-		case "|=": return actual === test.value || actual.startsWith(`${test.value}-`);
-		default: return false;
-	}
-};
-const matchesCompound = (element, compound) => {
-	if (compound.opaque) return false;
-	if (compound.tag !== void 0 && compound.tag !== element.tag) return false;
-	if (compound.id !== void 0 && attributeOf(element, "id") !== compound.id) return false;
-	if (compound.classes.length > 0) {
-		const classes = classListOf(element);
-		if (!compound.classes.every((name) => classes.includes(name))) return false;
-	}
-	return compound.attributes.every((test) => matchesAttribute(element, test));
-};
-const matchesFrom = (selector, index, ancestry) => {
-	if (ancestry === void 0) return false;
-	const part = selector.parts[index];
-	if (part === void 0) return false;
-	if (!matchesCompound(ancestry.element, part.compound)) return false;
-	const left = selector.parts[index - 1];
-	if (left === void 0) return true;
-	switch (left.after ?? "descendant") {
-		case "child": return matchesFrom(selector, index - 1, ancestry.parent);
-		case "descendant":
-			for (let parent = ancestry.parent; parent !== void 0; parent = parent.parent) if (matchesFrom(selector, index - 1, parent)) return true;
-			return false;
-		case "adjacent": {
-			const sibling = ancestry.previous.at(-1);
-			return sibling === void 0 ? false : matchesFrom(selector, index - 1, {
-				element: sibling,
-				parent: ancestry.parent,
-				previous: ancestry.previous.slice(0, -1)
-			});
-		}
-		case "sibling":
-			for (let position = ancestry.previous.length - 1; position >= 0; position--) if (matchesFrom(selector, index - 1, {
-				element: ancestry.previous[position],
-				parent: ancestry.parent,
-				previous: ancestry.previous.slice(0, position)
-			})) return true;
-			return false;
-	}
-};
-/** Match a compiled selector against one element in its tree position. */
-const matchesSelector = (selector, ancestry) => selector === void 0 || selector.parts.length === 0 ? false : matchesFrom(selector, selector.parts.length - 1, ancestry);
-//#endregion
-//#region src/email/css-values.ts
-const MAX_RESOLVED_VALUE_LENGTH = 65536;
-const MAX_RESOLUTION_WORK = 262144;
-const resolveVariablesWithin = (value, variables, depth, budget, work) => {
-	if (value.length > work.remaining) return void 0;
-	work.remaining -= value.length;
-	if (value.length > budget) return void 0;
-	if (depth > 8 || !value.includes("var(")) return value;
-	const chunks = [];
-	let length = 0;
-	const append = (chunk) => {
-		length += chunk.length;
-		if (length > budget) return false;
-		chunks.push(chunk);
-		return true;
-	};
-	let cursor = 0;
-	while (cursor < value.length) {
-		const start = value.indexOf("var(", cursor);
-		if (start < 0) {
-			if (!append(value.slice(cursor))) return void 0;
-			break;
-		}
-		if (!append(value.slice(cursor, start))) return void 0;
-		let level = 0;
-		let end = -1;
-		for (let index = start + 3; index < value.length; index++) if (value[index] === "(") level += 1;
-		else if (value[index] === ")") {
-			level -= 1;
-			if (level === 0) {
-				end = index;
-				break;
-			}
-		}
-		if (end < 0) {
-			if (!append(value.slice(start))) return void 0;
-			break;
-		}
-		const body = value.slice(start + 4, end);
-		const comma = body.indexOf(",");
-		const name = (comma < 0 ? body : body.slice(0, comma)).trim();
-		const fallback = comma < 0 ? void 0 : body.slice(comma + 1).trim();
-		const replacement = variables[name] ?? fallback;
-		const resolved = replacement === void 0 ? value.slice(start, end + 1) : resolveVariablesWithin(replacement, variables, depth + 1, budget - length, work);
-		if (resolved === void 0 || !append(resolved)) return void 0;
-		cursor = end + 1;
-	}
-	return chunks.join("");
-};
-/**
-* Expand `var(--x, fallback)` against the collected custom properties.
-* Values whose expansion exceeds the render-time budget are left as authored.
-*/
-const resolveVariables = (value, variables, depth = 0) => resolveVariablesWithin(value, variables, depth, MAX_RESOLVED_VALUE_LENGTH, { remaining: MAX_RESOLUTION_WORK }) ?? value;
-/**
-* Fold a constant `calc()` to a plain value. Tailwind writes every spacing
-* utility as `calc(var(--spacing) * n)`, and classic Outlook does not implement
-* `calc()` at all, so an unfolded value is a silently missing style. An
-* expression that cannot be reduced to one term is left exactly as authored.
-*/
-const foldCalc = (value) => {
-	if (!value.includes("calc(")) return value;
-	let result = "";
-	let rest = value;
-	while (rest.length > 0) {
-		const start = rest.indexOf("calc(");
-		if (start < 0) {
-			result += rest;
-			break;
-		}
-		result += rest.slice(0, start);
-		let level = 0;
-		let end = -1;
-		for (let index = start + 4; index < rest.length; index++) if (rest[index] === "(") level += 1;
-		else if (rest[index] === ")") {
-			level -= 1;
-			if (level === 0) {
-				end = index;
-				break;
-			}
-		}
-		if (end < 0) {
-			result += rest.slice(start);
-			break;
-		}
-		const folded = evaluate(rest.slice(start + 5, end));
-		result += folded === void 0 ? rest.slice(start, end + 1) : format(folded);
-		rest = rest.slice(end + 1);
-	}
-	return result;
-};
-const format = (value) => `${Math.round(value.n * 1e6) / 1e6}${value.n === 0 && value.unit !== "%" ? "" : value.unit}`;
-const evaluate = (expression) => {
-	const tokens = expression.match(/\(|\)|[+-]\s|[*/]|[^\s()*/]+/g);
-	if (tokens === null) return void 0;
-	let position = 0;
-	const peek = () => tokens[position]?.trim();
-	const sum = () => {
-		let left = product();
-		while (left !== void 0 && (peek() === "+" || peek() === "-")) {
-			const operator = peek();
-			position += 1;
-			const right = product();
-			if (right === void 0 || left.unit !== right.unit) return void 0;
-			left = {
-				n: operator === "+" ? left.n + right.n : left.n - right.n,
-				unit: left.unit
-			};
-		}
-		return left;
-	};
-	const product = () => {
-		let left = term();
-		while (left !== void 0 && (peek() === "*" || peek() === "/")) {
-			const operator = peek();
-			position += 1;
-			const right = term();
-			if (right === void 0) return void 0;
-			if (operator === "*") {
-				if (left.unit !== "" && right.unit !== "") return void 0;
-				left = {
-					n: left.n * right.n,
-					unit: left.unit === "" ? right.unit : left.unit
-				};
-			} else {
-				if (right.unit !== "" || right.n === 0) return void 0;
-				left = {
-					n: left.n / right.n,
-					unit: left.unit
-				};
-			}
-		}
-		return left;
-	};
-	const term = () => {
-		const token = tokens[position];
-		if (token === void 0) return void 0;
-		if (token === "(") {
-			position += 1;
-			const inner = sum();
-			if (peek() !== ")") return void 0;
-			position += 1;
-			return inner;
-		}
-		const match = /^(-?(?:\d+\.?\d*|\.\d+))([a-z%]*)$/i.exec(token.trim());
-		if (match === null) return void 0;
-		position += 1;
-		return {
-			n: Number.parseFloat(match[1]),
-			unit: (match[2] ?? "").toLowerCase()
-		};
-	};
-	const value = sum();
-	return position === tokens.length ? value : void 0;
-};
-/** Resolve custom properties, then fold what the arithmetic allows. */
-const finalizeValue = (value, variables) => foldCalc(resolveVariables(value, variables));
-const RANGE_FEATURE = /\(\s*([a-z-]+)\s*(<=|>=|<|>)\s*([^)]+?)\s*\)/gi;
-/** Media Queries Level 4 range syntax down to the `min-`/`max-` prefixes clients support. */
-const downlevelMediaQuery = (condition) => condition.replace(RANGE_FEATURE, (whole, feature, comparison, bound) => {
-	return `(${comparison.startsWith(">") ? "min-" : "max-"}${feature}:${bound})`;
-});
-/** Render the rules that could not be inlined as one `<style>` body. */
-const renderHeadCss = (rules, headAtRules, variables, darkVariables = {}) => {
-	const blocks = [...headAtRules];
-	const darkScope = {
-		...variables,
-		...darkVariables
-	};
-	const grouped = /* @__PURE__ */ new Map();
-	for (const rule of rules) {
-		const conditions = rule.conditions.map(downlevelMediaQuery);
-		const key = conditions.join("\0");
-		const bucket = grouped.get(key);
-		if (bucket === void 0) grouped.set(key, {
-			conditions,
-			rules: [rule]
-		});
-		else bucket.rules.push(rule);
-	}
-	for (const { conditions, rules: bucket } of grouped.values()) {
-		const scope = withinDarkScheme(conditions) ? darkScope : variables;
-		const body = bucket.map((rule) => {
-			const declarations = rule.declarations.filter((declaration) => !declaration.property.startsWith("--")).map((declaration) => `${declaration.property}:${finalizeValue(declaration.value, scope)}!important`).join(";");
-			return declarations === "" ? "" : `${rule.selector}{${declarations}}`;
-		}).filter((block) => block !== "").join("");
-		if (body === "") continue;
-		blocks.push(conditions.reduceRight((inner, condition) => `${condition}{${inner}}`, body));
-	}
-	return blocks.join("");
-};
-//#endregion
-//#region src/email/cascade.ts
-const VARIABLE_REFERENCE = /var\(\s*--[\w-]+\s*(?:,[^()]*)?\)/g;
-/**
-* Compatibility markup a primitive emits (a Button's VML) and a presentational
-* `bgcolor` attribute are not CSS, so no client resolves `var()` in them. Their
-* theme variables resolve here, in the scope of the element they sit in, as a
-* declaration on that element would.
-*/
-const resolveMarkupVariables = (markup, variables) => markup.replace(VARIABLE_REFERENCE, (reference) => {
-	const value = finalizeValue(reference, variables);
-	return value === reference ? reference : escapeAttribute(value);
-});
-/**
-* Cascade rank as the tuple CSS actually sorts by: importance first, then
-* whether the declaration is attached to the element itself, then layer, then
-* specificity, then order of appearance down to the declaration. Normal
-* declarations sort by layer ascending (unlayered last, so it wins); important
-* declarations reverse the layer order, which is why the layer term is negated
-* for them. Element-attached declarations are compared before layers and
-* specificity, so an author's important inline value beats an important
-* stylesheet declaration exactly as it does in a browser. Two declarations never
-* tie: rule order is unique across every registered sheet, and the position
-* inside a rule separates the declarations that share it.
-*/
-const rank = (important, attached, layer, specificity, order, position) => [
-	important ? 1 : 0,
-	attached ? 1 : 0,
-	important ? -layer : layer,
-	specificity[0],
-	specificity[1],
-	specificity[2],
-	order,
-	position
-];
-const compareRank = (left, right) => {
-	for (let index = 0; index < Math.max(left.length, right.length); index++) {
-		const a = left[index] ?? 0;
-		const b = right[index] ?? 0;
-		if (a !== b) return a - b;
-	}
-	return 0;
-};
-const outranks = (left, right) => compareRank(left, right) >= 0;
-/** An authored `style` object becomes declarations with the same normalization the serializer uses. */
-const inlineDeclarations = (style) => {
-	if (!isObject(style) || Array.isArray(style)) return [];
-	const output = [];
-	for (const [property, value] of Object.entries(style)) {
-		if (value === void 0 || value === null) continue;
-		if (typeof value !== "string" && typeof value !== "number") continue;
-		const text = declarationValue(property, value);
-		const important = /!important\s*$/i.test(text);
-		output.push({
-			property: kebab(property),
-			value: important ? text.replace(/\s*!important\s*$/i, "") : text,
-			important
-		});
-	}
-	return output;
-};
-const horizontalWriting = {
-	direction: "ltr",
-	writingMode: "horizontal-tb"
-};
-const paddingValues = (value) => {
-	const values = [];
-	let depth = 0;
-	let start = 0;
-	for (let index = 0; index < value.length; index++) {
-		const character = value[index];
-		if (character === "(") depth++;
-		else if (character === ")") depth--;
-		else if (/\s/.test(character) && depth === 0) {
-			if (index > start) values.push(value.slice(start, index));
-			start = index + 1;
-		}
-	}
-	if (start < value.length) values.push(value.slice(start));
-	return values;
-};
-const physicalPadding = (property, value, context) => {
-	const original = [[property, value]];
-	const match = /^padding-(inline|block)(?:-(start|end))?$/.exec(property);
-	if (match === null || context.writingMode !== "horizontal-tb" || !["ltr", "rtl"].includes(context.direction) || /^(inherit|revert|revert-layer)$/.test(value) || value.includes("var(")) return original;
-	const values = paddingValues(value.trim());
-	if (values.length < 1 || values.length > (match[2] === void 0 ? 2 : 1)) return original;
-	const sides = match[1] === "block" ? ["top", "bottom"] : context.direction === "rtl" ? ["right", "left"] : ["left", "right"];
-	if (match[2] !== void 0) return [[`padding-${sides[match[2] === "start" ? 0 : 1]}`, values[0]]];
-	return [[`padding-${sides[0]}`, values[0]], [`padding-${sides[1]}`, values[1] ?? values[0]]];
-};
-/** Generated dark-mode classes share this prefix; it is reserved for the compiler. */
-const DARK_CLASS_PREFIX = "sml-dark-";
-/** A class named for its declarations, so equal sets share one rule and builds are stable. */
-const darkClassName = (body) => {
-	let hash = 2166136261;
-	for (let index = 0; index < body.length; index++) {
-		hash ^= body.charCodeAt(index);
-		hash = Math.imul(hash, 16777619) >>> 0;
-	}
-	return `${DARK_CLASS_PREFIX}${hash.toString(36)}`;
-};
-const SIDES = [
-	"top",
-	"right",
-	"bottom",
-	"left"
-];
-const BORDER_PARTS = [
-	"width",
-	"style",
-	"color"
-];
-const CORNERS = [
-	"top-left",
-	"top-right",
-	"bottom-right",
-	"bottom-left"
-];
-const BORDER_IMAGE = [
-	"source",
-	"slice",
-	"width",
-	"outset",
-	"repeat"
-].map((part) => `border-image-${part}`);
-/**
-* The longhands a border property writes: `border` writes the twelve per-side longhands and
-* resets the border image, `border-top` the top three, `border-color` the four colors,
-* `border-radius` the four corners.
-* `undefined` for a property outside the border box.
-*/
-const borderLonghands = (property) => {
-	if (property === "border") return [...SIDES.flatMap((side) => BORDER_PARTS.map((part) => `border-${side}-${part}`)), ...BORDER_IMAGE];
-	if (property === "border-image") return BORDER_IMAGE;
-	if (property === "border-radius") return CORNERS.map((corner) => `border-${corner}-radius`);
-	const side = /^border-(top|right|bottom|left)$/.exec(property)?.[1];
-	if (side !== void 0) return BORDER_PARTS.map((part) => `border-${side}-${part}`);
-	const part = /^border-(width|style|color)$/.exec(property)?.[1];
-	if (part !== void 0) return SIDES.map((each) => `border-${each}-${part}`);
-	return property.startsWith("border-") ? [property] : void 0;
-};
-/**
-* Whether two declarations can override one another because they write a property in common:
-* `background` and `background-color`, `border-color` and `border-top`, `font` and `line-height`.
-* `border-radius` shares nothing with `border-color`.
-*/
-const overlaps = (left, right) => {
-	if (left === right) return true;
-	const leftBorder = borderLonghands(left);
-	const rightBorder = borderLonghands(right);
-	if (leftBorder !== void 0 || rightBorder !== void 0) return leftBorder !== void 0 && rightBorder !== void 0 && leftBorder.some((longhand) => rightBorder.includes(longhand));
-	const sets = (shorthand, longhand) => longhand.startsWith(`${shorthand}-`) || shorthand === "font" && longhand === "line-height";
-	return sets(left, right) || sets(right, left);
-};
-/** Add a class to an element's props, whichever of `class` and `className` it uses. */
-const withClass = (props, name) => {
-	const key = typeof props.class === "string" || props.className === void 0 ? "class" : "className";
-	const current = props[key];
-	return {
-		...props,
-		[key]: typeof current === "string" && current.trim() !== "" ? `${current} ${name}` : name
-	};
-};
-/** The generated dark-mode classes as one `@media (prefers-color-scheme:dark)` block, written as the head CSS writes its media queries. */
-const renderDarkRules = (rules) => rules.size === 0 ? "" : `${DARK_SCHEME_MEDIA.replace(": ", ":")}{${[...rules].sort(([left], [right]) => left.localeCompare(right)).map(([name, body]) => `.${name}{${body}}`).join("")}}`;
-/**
-* Resolve every stylesheet against the tree: inline what a client will honor on
-* the element, and keep the rest for `<head>`. Where the sheet has a dark-mode
-* theme, an element whose inlined styles read a color it redefines also gets a
-* generated class whose dark-mode rule restates those styles at their dark
-* values.
-*/
-const applyStylesheet = (root, sheet, options = {}) => {
-	const diagnostics = [...sheet.diagnostics];
-	const hasDarkTheme = Object.keys(sheet.darkVariables).length > 0;
-	const darkRules = /* @__PURE__ */ new Map();
-	const darkClassFor = (declarations) => {
-		const body = declarations.map(([property, value]) => `${property}:${value}!important`).join(";");
-		const name = darkClassName(body);
-		darkRules.set(name, body);
-		return name;
-	};
-	const inlinable = [];
-	const retained = [];
-	const styledClasses = /* @__PURE__ */ new Set();
-	for (const rule of sheet.rules) {
-		(rule.inlinable ? inlinable : retained).push(rule);
-		for (const name of rule.classes) styledClasses.add(name);
-	}
-	const conditionalWritingRules = retained.filter((rule) => rule.declarations.some((declaration) => declaration.property === "direction" || declaration.property === "writing-mode" || declaration.property === "all"));
-	const unmatched = /* @__PURE__ */ new Map();
-	const declaredFamilies = new Set(sheet.fontFaces.map((face) => face.family.toLowerCase()));
-	const fallbackFindings = /* @__PURE__ */ new Map();
-	const checkFallback = (property, value, origins) => {
-		if (declaredFamilies.size === 0) return;
-		const stack = property === "font-family" ? value : property === "font" ? fontShorthandFamilies(value) : void 0;
-		if (stack === void 0 || fallbackFindings.has(stack)) return;
-		if (lacksGenericFallback(stack, declaredFamilies)) fallbackFindings.set(stack, origins);
-	};
-	/**
-	* Children are visited with their own preceding-sibling list so `+`/`~` work.
-	* A fragment is not an element in the serialized document, so its children
-	* join that same list rather than starting a new one.
-	*/
-	const visitChildren = (children, ancestry, variables, darkScope, writing) => {
-		const previous = [];
-		const visit = (nodes) => nodes.map((child) => {
-			if (child.type === "Element") {
-				const result = applyTo(child, {
-					element: child,
-					parent: ancestry,
-					previous: [...previous]
-				}, variables, darkScope, writing);
-				previous.push(child);
-				return result;
-			}
-			if (child.type === "Fragment") return EmailNode.Fragment({ children: visit(child.children) });
-			if (child.type === "Raw" && child.html.includes("var(")) return EmailNode.Raw({
-				...child,
-				html: resolveMarkupVariables(child.html, variables)
-			});
-			return child;
-		});
-		return visit(children);
-	};
-	/**
-	* `inherited` is the custom-property scope this element sees from its
-	* ancestors, rooted in the sheet's unconditional properties. Custom properties
-	* cascade like any other declaration and then inherit, so a `--brand` declared
-	* on `.card` has to reach `var(--brand)` on `.card` and everything under it.
-	*/
-	const applyTo = (element, ancestry, inherited, inheritedDark, inheritedWriting) => {
-		const conditionalWriting = conditionalWritingRules.some((rule) => {
-			if (rule.matcher === void 0 || rule.matcher.parts.length === 0 || rule.matcher.parts.some((part) => part.compound.opaque)) return true;
-			for (let context = ancestry; context !== void 0; context = context.parent) if (matchesSelector(rule.matcher, context)) return true;
-			return false;
-		});
-		const winners = /* @__PURE__ */ new Map();
-		const claim = (declaration, key) => {
-			const current = winners.get(declaration.property);
-			if (current === void 0 || outranks(key, current.key)) winners.set(declaration.property, {
-				value: declaration.value,
-				key
-			});
-		};
-		for (const rule of inlinable) {
-			if (!matchesSelector(rule.matcher, ancestry)) continue;
-			for (const [position, declaration] of rule.declarations.entries()) claim(declaration, rank(declaration.important, false, rule.layer, rule.specificity, rule.order, position));
-		}
-		for (const [position, declaration] of inlineDeclarations(element.props.style).entries()) claim(declaration, rank(declaration.important, true, 0, [
-			0,
-			0,
-			0
-		], 0, position));
-		for (const name of classListOf(element)) if (!styledClasses.has(name) && options.knownClasses?.has(name) !== true) unmatched.set(name, [...unmatched.get(name) ?? [], ...element.origins]);
-		const declared = {};
-		for (const [property, entry] of winners) if (property.startsWith("--")) declared[property] = entry.value;
-		const variables = Object.keys(declared).length === 0 ? inherited : {
-			...inherited,
-			...declared
-		};
-		const darkScope = Object.keys(declared).length === 0 ? inheritedDark : {
-			...inheritedDark,
-			...declared
-		};
-		const inheritedValue = (property, parent, initial, fallback = parent) => {
-			const value = winners.get(property)?.value;
-			if (value === void 0) return fallback;
-			const resolved = finalizeValue(value, variables);
-			return resolved === "inherit" || resolved === "unset" ? parent : resolved === "initial" ? initial : resolved;
-		};
-		const writing = {
-			direction: inheritedValue("direction", inheritedWriting.direction, "ltr", typeof element.props.dir === "string" ? element.props.dir : element.tag === "bdi" ? "auto" : inheritedWriting.direction),
-			writingMode: winners.has("all") ? "unknown" : inheritedValue("writing-mode", inheritedWriting.writingMode, "horizontal-tb")
-		};
-		const emitted = [...winners].filter(([property]) => !property.startsWith("--")).sort(([, left], [, right]) => compareRank(left.key, right.key)).map(([property, entry]) => [property, finalizeValue(entry.value, variables)]);
-		for (const [property, value] of emitted) checkFallback(property, value, element.origins.slice(0, 1));
-		const physical = /* @__PURE__ */ new Map();
-		for (const [property, value] of emitted) for (const [name, lowered] of conditionalWriting ? [[property, value]] : physicalPadding(property, value, writing)) {
-			physical.delete(name);
-			physical.set(name, lowered);
-		}
-		const bgcolor = element.props.bgcolor;
-		const lightProps = typeof bgcolor === "string" && bgcolor.includes("var(") ? {
-			...element.props,
-			bgcolor: finalizeValue(bgcolor, variables)
-		} : element.props;
-		const dark = [];
-		if (hasDarkTheme) {
-			const changed = [];
-			for (const [property, entry] of winners) {
-				if (property.startsWith("--") || !entry.value.includes("var(")) continue;
-				if (finalizeValue(entry.value, darkScope) !== finalizeValue(entry.value, variables)) changed.push(property);
-			}
-			const restated = new Set(changed);
-			for (let grew = changed.length > 0; grew;) {
-				grew = false;
-				for (const property of winners.keys()) if (!property.startsWith("--") && !restated.has(property) && [...restated].some((candidate) => overlaps(candidate, property))) {
-					restated.add(property);
-					grew = true;
-				}
-			}
-			for (const [property, entry] of [...winners].sort(([, left], [, right]) => compareRank(left.key, right.key))) if (restated.has(property)) dark.push([property, finalizeValue(entry.value, darkScope)]);
-			if (typeof bgcolor === "string" && bgcolor.includes("var(") && !winners.has("background-color") && !winners.has("background")) {
-				const value = finalizeValue(bgcolor, darkScope);
-				if (value !== finalizeValue(bgcolor, variables)) dark.push(["background-color", value]);
-			}
-		}
-		const darkClass = dark.length === 0 ? void 0 : darkClassFor(dark);
-		const props = darkClass === void 0 ? lightProps : withClass(lightProps, darkClass);
-		return EmailNode.Element({
-			...element,
-			props: emitted.length === 0 ? props : {
-				...props,
-				style: Object.fromEntries(physical)
-			},
-			children: visitChildren(element.children, ancestry, variables, darkScope, writing)
-		});
-	};
-	const rootDark = {
-		...sheet.variables,
-		...sheet.darkVariables
-	};
-	const tree = root.type === "Element" ? applyTo(root, {
-		element: root,
-		parent: void 0,
-		previous: []
-	}, sheet.variables, rootDark, horizontalWriting) : root.type === "Fragment" ? EmailNode.Fragment({ children: visitChildren(root.children, void 0, sheet.variables, rootDark, horizontalWriting) }) : root;
-	for (const rule of retained) for (const declaration of rule.declarations) checkFallback(declaration.property, finalizeValue(declaration.value, sheet.variables), []);
-	for (const [value, origins] of fallbackFindings) diagnostics.push({
-		...fontFallbackDiagnostic(value),
-		origins
-	});
-	for (const [name, origins] of unmatched) diagnostics.push({
-		code: "unmatched-class",
-		severity: "warning",
-		message: `Class ${JSON.stringify(name)} produced no styles. If it is composed at run time, the compiler cannot discover it; list it in the template's declared classes or write the style inline.`,
-		origins: origins.slice(0, 1)
-	});
-	return {
-		tree,
-		headCss: renderHeadCss(retained, sheet.headAtRules, sheet.variables, sheet.darkVariables),
-		darkRules,
-		fontFaceCss: sheet.fontFaces.map((face) => face.css).join(""),
-		diagnostics
-	};
-};
-//#endregion
-export { finalizeValue as a, resolveVariables as c, unquote as d, downlevelMediaQuery as i, classListOf as l, applyStylesheet as n, foldCalc as o, renderDarkRules as r, renderHeadCss as s, DARK_CLASS_PREFIX as t, matchesSelector as u };