@master/css-binding 0.0.0-site.1793659883.g69c9aebcf628

package/dist/engine-js/src/generate.js

@@ -0,0 +1,288 @@
+import { trim } from "./text.js";
+import { collectCssVariableReferences, normalizeCssMathFunctions, substituteInlineTokens } from "./value.js";
+import { cssEscape } from "./program.js";
+import { analyzeAnimations, stylesheetDeclarations } from "./animation.js";
+import { decodeNativeValue, parseNativeDeclaration, splitTopLevel, validClassStructure } from "./class-syntax.js";
+import { atomicShape } from "./order.js";
+import { conditionPriority } from "./condition.js";
+import { replaceNestingSelector, selectorPriority } from "./selector.js";
+import { expandUtility } from "./mixin.js";
+import { resolveStateBranches } from "./state.js";
+import { matchingUtilities } from "./utility.js";
+import { applicationRules } from "./apply.js";
+// ../engine-js/src/generate.ts
+function formatDeclaration(property, value, important) {
+	return important && !value.endsWith("!important") ? `${property}:${value}!important` : `${property}:${value}`;
+}
+/**
+* Compatibility declarations are an engine output policy, not preset recipes: every
+* utility declaration, whether a native head, a token, a static or a function utility
+* emits it, gets the same companions.
+*/
+const WEBKIT_PROPERTIES = /* @__PURE__ */ new Set([
+	"text-decoration",
+	"backdrop-filter",
+	"box-decoration-break",
+	"mask-image",
+	"user-drag",
+	"user-select"
+]);
+function formatOutputDeclaration(property, value, important) {
+	const standard = formatDeclaration(property, value, important);
+	return WEBKIT_PROPERTIES.has(property) ? `${formatDeclaration(`-webkit-${property}`, value, important)};${standard}` : standard;
+}
+function emitDeclarations(utility, matched, important, program) {
+	const { emit } = utility;
+	if (emit.type === "property") return matched.value === void 0 ? [] : [[
+		formatOutputDeclaration(emit.property, matched.value, important),
+		void 0,
+		[]
+	]];
+	return expansion(utility, matched, program).map(({ selector, conditions, declarations }) => [
+		declarations.map(([property, value]) => formatOutputDeclaration(property, value, important)).join(";"),
+		selector === "&" ? void 0 : selector,
+		conditions
+	]);
+}
+/** The recipe expansion of a match, computed once and shared by its state branches. */
+function expansion(utility, matched, program) {
+	const { emit } = utility;
+	if (emit.type !== "recipe") return [];
+	if (matched.expansion === void 0) matched.expansion = expandUtility(program, program.utilityDefinitions[emit.definition], matched.arguments) ?? null;
+	return matched.expansion ?? [];
+}
+/**
+* The shape of a named utility match, read from its expanded structure before
+* compatibility declarations: duplicates still count, so `margin:0;margin:0` is a recipe.
+*/
+function utilityShape(utility, matched, program) {
+	if (utility.emit.type === "property") return matched.value === void 0 ? { category: 0 } : atomicShape(utility.emit.property, matched.value);
+	const [rule, other] = expansion(utility, matched, program);
+	return rule && !other && rule.selector === "&" && !rule.conditions.length && rule.declarations.length === 1 ? atomicShape(...rule.declarations[0]) : { category: 0 };
+}
+/** Declaration semantics for ordering; static and enum identities keep their manifest order. */
+function sortKey(utility, matched, program) {
+	if (utility.utilityType === -2 && matched.matcherType !== "token") return "";
+	return emitDeclarations(utility, matched, false, program).map(([declarations]) => declarations).join(";");
+}
+/** The declaration of a `(property:value)` head as a property utility, its match and whether its value ends with `!important`. */
+function nativeDeclaration(className) {
+	const head = parseNativeDeclaration(className);
+	if (!head) return;
+	const property = className.slice(...head.property);
+	const value = normalizeCssMathFunctions(decodeNativeValue(className.slice(...head.value)));
+	const id = `native:${property}`;
+	return [
+		{
+			id,
+			name: id,
+			utilityType: 0,
+			variableAliasRefs: [],
+			nativeFallback: true,
+			emit: {
+				type: "property",
+				property
+			},
+			matchers: []
+		},
+		{
+			value,
+			arguments: [],
+			stateToken: className.slice(head.suffixStart),
+			variableNames: [],
+			matcherType: "key"
+		},
+		head.important
+	];
+}
+/** The class selector in a branch's template, then in a nested rule's. */
+function createSelectorText(className, branch, ruleSelector) {
+	const body = `.${cssEscape(className)}`;
+	const template = branch.selectorTemplate;
+	const selector = template === void 0 ? body : replaceNestingSelector(template, body) ?? template;
+	return ruleSelector === void 0 ? selector : replaceNestingSelector(ruleSelector, selector) ?? ruleSelector;
+}
+function wrapRawConditions(text, conditions) {
+	for (let index = conditions.length - 1; index >= 0; index--) {
+		const condition = trim(conditions[index]);
+		if (condition) text = `${condition}{${text}}`;
+	}
+	return text;
+}
+const reportedFeatures = (features) => features.some(({ lower, upper }) => Object.is(lower?.value, -0) || Object.is(upper?.value, -0)) ? features.map((feature) => ({
+	...feature,
+	lower: feature.lower && {
+		...feature.lower,
+		value: feature.lower.value + 0
+	},
+	upper: feature.upper && {
+		...feature.upper,
+		value: feature.upper.value + 0
+	}
+})) : features;
+/** A rule priority as the Rust JSON reports it, omitting empty fields. */
+function rulePriority(features, selector, conditions, valuePriority, sortKey, shape) {
+	const priority = {
+		features: reportedFeatures(features),
+		selector
+	};
+	if (conditions.length) priority.conditions = conditions;
+	if (valuePriority) priority.valuePriority = valuePriority;
+	if (sortKey) priority.sortKey = sortKey;
+	priority.category = shape.category;
+	for (const key of [
+		"family",
+		"coverage",
+		"property"
+	]) if (shape[key]) priority[key] = shape[key];
+	return priority;
+}
+function declarationAnimationReferences(declarations, program) {
+	if (!declarations.includes("\\") && !/animation/i.test(declarations)) return {
+		names: [],
+		retainAll: false
+	};
+	return analyzeAnimations(stylesheetDeclarations(`a{${declarations}}`), program);
+}
+/** Keyframe references of a rule; absent when there are none. */
+function addAnimationReferences(ir, declarations, program) {
+	const { names, retainAll } = declarationAnimationReferences(declarations, program);
+	if (names.length) ir.keyframeNames = names;
+	if (retainAll) ir.retainAllKeyframes = true;
+}
+/**
+* Matches a class and visits each state branch that emits declarations. A
+* `(property:value)` head is a native declaration and never a utility.
+*/
+function generatedBranches(className, program, visit) {
+	const classImportant = className.endsWith("!");
+	const source = classImportant ? className.slice(0, -1) : className;
+	const candidates = matchingUtilities(source, program).map(([index, matched]) => [
+		program.utilities[index],
+		matched,
+		classImportant,
+		void 0
+	]);
+	const native = nativeDeclaration(source);
+	if (native) candidates.push([
+		native[0],
+		native[1],
+		classImportant || native[2],
+		{ category: 2 }
+	]);
+	const seen = /* @__PURE__ */ new Set();
+	for (const [utility, matched, important, nativeShape] of candidates) {
+		const shape = nativeShape ?? utilityShape(utility, matched, program);
+		let branchSortKey = shape.content;
+		for (const [index, branch] of resolveStateBranches(matched.stateToken, important, program).entries()) {
+			const rules = emitDeclarations(utility, matched, branch.important, program);
+			if (!rules.length) continue;
+			const key = index === 0 && !branch.key ? className : `${className}\0${branch.key}`;
+			const layer = branch.layer ?? "utilities";
+			if (seen.has(`${layer} ${key}`)) continue;
+			seen.add(`${layer} ${key}`);
+			const wrappers = branch.conditionWrappers;
+			const [features, conditions] = conditionPriority(wrappers);
+			branchSortKey ??= sortKey(utility, matched, program);
+			visit({
+				utility,
+				matched,
+				branch,
+				key,
+				layer,
+				emitted: rules,
+				sortTier: wrappers.length ? 3 : branch.selectorTemplate === void 0 ? 0 : 1,
+				features,
+				priority: rulePriority(features, selectorPriority(branch.selectorTemplate), conditions, matched.matcherType === "token" ? -1 : 0, branchSortKey, shape)
+			});
+		}
+	}
+}
+function generateClassRules(className, program) {
+	const application = applicationRules(className, program);
+	if (application) return application;
+	if (!validClassStructure(className)) return [];
+	const rules = [];
+	generatedBranches(className, program, ({ utility, matched, branch, key, layer, emitted, sortTier, features, priority }) => {
+		const selectorText = createSelectorText(className, branch);
+		const texts = [];
+		const declarationTexts = [];
+		for (const [raw, selector, conditions] of emitted) {
+			const declarations = substituteInlineTokens(raw, program);
+			const text = wrapRawConditions(`${selector === void 0 ? selectorText : createSelectorText(className, branch, selector)}{${declarations}}`, conditions);
+			texts.push(branch.conditionWrappers.reduceRight((rule, [, wrapper]) => `${wrapper}{${rule}}`, text));
+			declarationTexts.push(declarations);
+		}
+		const declarations = declarationTexts.join(";");
+		const variableNames = matched.variableNames.filter((name) => program.variables.get(name)?.inlineValue === void 0);
+		for (const name of collectCssVariableReferences(declarations)) if (program.variables.has(name) && !variableNames.includes(name)) variableNames.push(name);
+		const ir = {
+			className,
+			key,
+			layer,
+			type: utility.utilityType,
+			sortTier,
+			priority,
+			text: texts.join(""),
+			selectorText
+		};
+		if (texts.length > 1) ir.nodes = texts.map((text) => ({ text }));
+		if (variableNames.length) ir.variableNames = variableNames;
+		addAnimationReferences(ir, declarations, program);
+		rules.push({
+			ir,
+			features
+		});
+	});
+	return rules;
+}
+/** Serialized declarations split at top-level `;` and their first top-level `:`. */
+function parseSerializedDeclarations(source) {
+	const declarations = [];
+	for (const declaration of splitTopLevel(source, ";")) {
+		let quote = 0;
+		let escaped = false;
+		let depth = 0;
+		let separator = -1;
+		for (let index = 0; index < declaration.length; index++) {
+			const unit = declaration.charCodeAt(index);
+			if (escaped) escaped = false;
+			else if (unit === 92) escaped = true;
+			else if (quote) {
+				if (unit === quote) quote = 0;
+			} else if (unit === 34 || unit === 39) quote = unit;
+			else if (unit === 40 || unit === 91 || unit === 123) depth++;
+			else if (unit === 41 || unit === 93 || unit === 125) {
+				if (depth) depth--;
+			} else if (unit === 58 && !depth) {
+				separator = index;
+				break;
+			}
+		}
+		if (separator < 0) continue;
+		const property = trim(declaration.slice(0, separator));
+		if (property) declarations.push([property, trim(declaration.slice(separator + 1))]);
+	}
+	return declarations;
+}
+/** The rules of a class without `@apply` suffixes, before inline theme substitution. */
+function compositionRules(className, program) {
+	if (!validClassStructure(className)) return [];
+	const rules = [];
+	generatedBranches(className, program, ({ utility, branch, layer, emitted, priority }) => {
+		const template = branch.selectorTemplate;
+		const base = template === void 0 ? "&" : replaceNestingSelector(template, "&") ?? template;
+		const branchConditions = branch.conditionWrappers.filter(([kind]) => kind !== "layer" || branch.layer === void 0).map(([, wrapper]) => wrapper);
+		for (const [declarations, selector, conditions] of emitted) rules.push({
+			layer,
+			explicitLayer: branch.layer,
+			type: utility.utilityType,
+			valuePriority: priority.valuePriority ?? 0,
+			selector: selector === void 0 ? base : replaceNestingSelector(selector, base) ?? selector,
+			declarations: parseSerializedDeclarations(declarations),
+			conditions: [...branchConditions, ...conditions]
+		});
+	});
+	return rules;
+}
+export { addAnimationReferences, compositionRules, declarationAnimationReferences, formatDeclaration, generateClassRules, nativeDeclaration, rulePriority, wrapRawConditions };

package/dist/engine-js/src/mixin.js

@@ -0,0 +1,328 @@
+import { asciiLowercase, isWhitespace, trim } from "./text.js";
+import { tokenize } from "./css-syntax.js";
+import { decimalIsFinite, parseDecimal } from "./value.js";
+import { cssEscape } from "./program.js";
+import { splitTopLevel } from "./class-syntax.js";
+import { replaceNestingSelector } from "./selector.js";
+import { NATIVE_CSS_PROPERTY_SET } from "./native-properties.js";
+// ../engine-js/src/mixin.ts
+/** Unwinds an expansion that fails; never leaves this module. */
+const EXPANSION_ERROR = /* @__PURE__ */ new Error("Invalid mixin expansion");
+const fail = () => {
+	throw EXPANSION_ERROR;
+};
+const MAX_DEPTH = 64;
+const MAX_STEPS = 1e5;
+const EMPTY = /* @__PURE__ */ new Map();
+const WIDE_KEYWORDS = /* @__PURE__ */ new Set([
+	"initial",
+	"inherit",
+	"unset",
+	"revert",
+	"revert-layer",
+	"default"
+]);
+const isWide = (name) => WIDE_KEYWORDS.has(asciiLowercase(name));
+const DYNAMIC_FUNCTIONS = /* @__PURE__ */ new Set([
+	"attr",
+	"env",
+	"random",
+	"random-item"
+]);
+/** Rust `str::parse::<i64>`: an optional sign and digits within range. */
+function isInteger(text) {
+	if (!/^[+-]?\d+$/.test(text)) return false;
+	const value = BigInt(text);
+	return value >= -9223372036854775808n && value <= 9223372036854775807n;
+}
+function validArgument(parameter, value, allowVar) {
+	const tokens = tokenize(value);
+	if (!tokens.length) return false;
+	for (const token of tokens) if (token.kind === 3) {
+		const name = asciiLowercase(token.value);
+		if (name === "var" && !allowVar || DYNAMIC_FUNCTIONS.has(name) || token.value.startsWith("--")) return false;
+	}
+	for (const token of tokens) {
+		if (token.kind === 8 && ";{}!".includes(token.value)) return false;
+		if ((token.kind === 3 || token.kind === 8 && (token.value === "(" || token.value === "[")) && token.close < 0) return false;
+	}
+	const [only] = tokens;
+	const single = tokens.length === 1;
+	if (single && only.kind === 0 && isWide(only.value)) return false;
+	switch (parameter.syntax) {
+		case void 0: return true;
+		case "integer": return single && only.kind === 4 && isInteger(only.value);
+		case "number": {
+			const decimal = single && only.kind === 4 ? parseDecimal(only.value) : void 0;
+			return !!decimal && decimalIsFinite(decimal);
+		}
+		case "string": return single && only.kind === 1 && (value.endsWith("\"") || value.endsWith("'"));
+		case "custom-ident": return single && only.kind === 0 && !isWide(only.value);
+	}
+}
+function ident(value) {
+	let result = "";
+	for (const token of tokenize(value)) if (token.kind === 1 || token.kind === 0 || token.kind === 4 && isInteger(token.value)) result += token.value;
+	else return;
+	return result ? cssEscape(result) : void 0;
+}
+/** The parameter a `var()` argument names, when the environment binds it. */
+function parameterValue(inner, environment) {
+	const tokens = tokenize(trim(splitTopLevel(inner, ",")[0]));
+	return tokens.length === 1 && tokens[0].kind === 0 ? environment.get(tokens[0].value) : void 0;
+}
+/** A mixin value with bound parameters substituted; undefined when an `ident()` is invalid. */
+function evaluateValue(value, environment) {
+	let output = "";
+	for (const part of value) {
+		if (part.type === "text") {
+			output += part.value;
+			continue;
+		}
+		const inner = evaluateValue(part.value, environment);
+		if (inner === void 0) return;
+		const name = asciiLowercase(part.name);
+		const argument = name === "var" ? parameterValue(inner, environment) : void 0;
+		if (argument !== void 0) output += argument;
+		else if (name === "ident") {
+			const result = ident(inner);
+			if (result === void 0) return;
+			output += result;
+		} else output += `${part.name}(${inner})`;
+	}
+	return output;
+}
+function referencesParameters(value, environment) {
+	if (!environment.size) return false;
+	return value.some((part) => {
+		if (part.type === "text") return false;
+		if (asciiLowercase(part.name) === "var") {
+			const inner = evaluateValue(part.value, EMPTY);
+			if (inner !== void 0 && parameterValue(inner, environment) !== void 0) return true;
+		}
+		return referencesParameters(part.value, environment);
+	});
+}
+const restricted = (environment, names) => {
+	if (!names.size) return EMPTY;
+	const result = /* @__PURE__ */ new Map();
+	for (const [name, value] of environment) if (names.has(name)) result.set(name, value);
+	return result;
+};
+const PSEUDO_ELEMENTS = /* @__PURE__ */ new Set([
+	"before",
+	"after",
+	"first-letter",
+	"first-line"
+]);
+/**
+* A nested selector stays on the invoking element only when it is one compound rooted
+* at `&`, without a pseudo-element. Functional pseudo-classes may hold selector
+* arguments without changing the subject.
+*/
+function sameSubject(selector) {
+	return splitTopLevel(selector, ",").every((part) => {
+		const branch = trim(part);
+		const tokens = tokenize(branch);
+		let ampersands = 0;
+		let subject = false;
+		let previousEnd = 0;
+		for (let index = 0; index < tokens.length; index++) {
+			const token = tokens[index];
+			for (let unit = previousEnd; unit < token.start; unit++) if (isWhitespace(branch.charCodeAt(unit))) {
+				subject = false;
+				break;
+			}
+			if (token.kind === 8) {
+				if (token.value === "&") {
+					ampersands++;
+					subject = true;
+				} else if (">+~|".includes(token.value)) subject = false;
+				else if (token.value === ":") {
+					const next = tokens[index + 1];
+					if (next && (next.kind === 8 && next.value === ":" || next.kind === 0 && PSEUDO_ELEMENTS.has(next.value))) return false;
+				}
+			}
+			if (token.kind === 3 || token.kind === 8 && token.value === "[") {
+				if (token.close < 0) return false;
+				index = token.close;
+			}
+			previousEnd = tokens[index].end;
+		}
+		return ampersands === 1 && subject;
+	});
+}
+/** Whether a number token is a positive integer, decided on its digits; one beyond `f64` is not. */
+function isPositiveInteger(number) {
+	const decimal = parseDecimal(number);
+	return !decimal || !decimal.negative && !!decimal.digits && decimal.point >= decimal.digits.length && decimalIsFinite(decimal);
+}
+/** Substituted values keep the positive integers the grammar requires. */
+function validDeclaration(name, value) {
+	const tokens = tokenize(value);
+	const property = asciiLowercase(name);
+	for (const [index, token] of tokens.entries()) {
+		const positive = token.kind === 3 && asciiLowercase(token.value) === "repeat" || (property === "grid-column" || property === "grid-row") && token.kind === 0 && asciiLowercase(token.value) === "span";
+		const next = tokens[index + 1];
+		if (positive && next?.kind === 4 && !isPositiveInteger(next.value)) return false;
+	}
+	return property !== "-webkit-line-clamp" || tokens[0]?.kind !== 4 || isPositiveInteger(tokens[0].value);
+}
+const directValueMixins = /* @__PURE__ */ new WeakMap();
+/** Only this identity-shaped body, `property: var(--parameter)`, accepts delayed CSS values as arguments. */
+function isDirectValueMixin(definition) {
+	let direct = directValueMixins.get(definition);
+	if (direct === void 0) directValueMixins.set(definition, direct = directValue(definition));
+	return direct;
+}
+function directValue({ parameters, body }) {
+	const [parameter] = parameters;
+	const [declaration] = body;
+	if (parameters.length !== 1 || parameter.syntax !== void 0 || parameter.default !== void 0) return false;
+	if (body.length !== 1 || declaration.type !== "declaration") return false;
+	if (declaration.property.startsWith("--") || !NATIVE_CSS_PROPERTY_SET.has(declaration.property)) return false;
+	const parts = declaration.value.filter((part) => part.type !== "text" || trim(part.value));
+	const [call] = parts;
+	if (parts.length !== 1 || call.type !== "function" || asciiLowercase(call.name) !== "var") return false;
+	let argument = "";
+	for (const part of call.value) {
+		if (part.type !== "text") return false;
+		argument += part.value;
+	}
+	const tokens = tokenize(argument);
+	return tokens.length === 1 && tokens[0].kind === 0 && tokens[0].value === parameter.name;
+}
+const sameConditions = (left, right) => left.length === right.length && left.every((condition, index) => condition === right[index]);
+var Expansion = class {
+	lookup;
+	symbolicRoot;
+	stack = [];
+	output = [];
+	steps = 0;
+	depth = 0;
+	constructor(lookup, symbolicRoot) {
+		this.lookup = lookup;
+		this.symbolicRoot = symbolicRoot;
+	}
+	call(name, args, outer, selector, conditions, forbidden, contents) {
+		if (this.depth >= MAX_DEPTH || this.stack.includes(name)) fail();
+		const definition = this.lookup(name) ?? fail();
+		this.stack.push(name);
+		this.depth++;
+		if (args.length > definition.parameters.length) fail();
+		const environment = new Map(outer);
+		const allowVar = isDirectValueMixin(definition) || this.symbolicRoot === name;
+		const unbound = new Set(forbidden);
+		for (const [index, parameter] of definition.parameters.entries()) {
+			const value = index < args.length ? args[index] : parameter.default ?? fail();
+			if (!validArgument(parameter, value, allowVar)) fail();
+			environment.set(parameter.name, value);
+			unbound.delete(parameter.name);
+		}
+		this.nodes(definition.body, environment, selector, conditions, true, unbound, contents);
+		this.stack.pop();
+		this.depth--;
+	}
+	/** Whether a value uses a parameter it may not: any across elements, or a forbidden one. */
+	crossesElements(value, environment, safeSubject, forbidden) {
+		return !safeSubject && referencesParameters(value, environment) || referencesParameters(value, restricted(environment, forbidden));
+	}
+	nodes(nodes, environment, selector, conditions, safeSubject, forbidden, contents) {
+		for (const node of nodes) {
+			if (++this.steps > MAX_STEPS) fail();
+			switch (node.type) {
+				case "declaration": {
+					if (environment.has(node.property) || this.crossesElements(node.value, environment, safeSubject, forbidden)) fail();
+					const substituted = referencesParameters(node.value, environment);
+					const value = evaluateValue(node.value, environment) ?? fail();
+					if (substituted && !validDeclaration(node.property, value)) fail();
+					const previous = this.output[this.output.length - 1];
+					if (previous && previous.selector === selector && sameConditions(previous.conditions, conditions)) previous.declarations.push([node.property, value]);
+					else this.output.push({
+						selector,
+						conditions: [...conditions],
+						declarations: [[node.property, value]]
+					});
+					break;
+				}
+				case "rule": {
+					const next = replaceNestingSelector(node.selector, selector) ?? `${selector} ${node.selector}`;
+					this.nodes(node.body, environment, next, conditions, safeSubject && sameSubject(node.selector), forbidden, contents);
+					break;
+				}
+				case "condition":
+					this.nodes(node.body, environment, selector, [...conditions, node.condition], safeSubject, forbidden, contents);
+					break;
+				case "contents":
+					if (contents) {
+						const stack = this.stack;
+						this.stack = [...contents.stack];
+						this.nodes(contents.nodes, contents.environment, selector, conditions, safeSubject && contents.safeSubject, contents.forbidden, contents.outer);
+						this.stack = stack;
+					} else this.nodes(node.fallback, environment, selector, conditions, safeSubject, forbidden);
+					break;
+				case "apply": {
+					if (node.arguments.some((argument) => this.crossesElements(argument, environment, safeSubject, forbidden))) fail();
+					const args = node.arguments.map((argument) => evaluateValue(argument, environment) ?? fail());
+					const next = safeSubject ? forbidden : /* @__PURE__ */ new Set([...forbidden, ...environment.keys()]);
+					const passed = node.contents && {
+						nodes: node.contents,
+						environment,
+						outer: contents,
+						stack: [...this.stack],
+						safeSubject,
+						forbidden: next
+					};
+					this.call(node.name, args, environment, selector, conditions, next, passed);
+					break;
+				}
+			}
+		}
+	}
+};
+const registries = /* @__PURE__ */ new WeakMap();
+/** Mixins by name; a later definition replaces an earlier one. */
+function registry(mixins) {
+	let result = registries.get(mixins);
+	if (!result) registries.set(mixins, result = new Map(mixins.map((definition) => [definition.name, definition])));
+	return result;
+}
+function run(expansion, execute) {
+	try {
+		execute();
+	} catch (error) {
+		if (error === EXPANSION_ERROR) return;
+		throw error;
+	}
+	return expansion.output;
+}
+/** A mixin call, with the caller's `@contents` when given. */
+function expandMixin(program, name, args, contents) {
+	const mixins = registry(program.mixins);
+	const expansion = new Expansion((mixin) => mixins.get(mixin));
+	const context = contents && {
+		nodes: contents,
+		environment: EMPTY,
+		stack: [],
+		safeSubject: true,
+		forbidden: /* @__PURE__ */ new Set()
+	};
+	return run(expansion, () => expansion.call(name, args, EMPTY, "&", [], /* @__PURE__ */ new Set(), context));
+}
+/** An already compiled caller body, without a named definition. */
+function expandBody(program, body) {
+	const mixins = registry(program.mixins);
+	const expansion = new Expansion((mixin) => mixins.get(mixin));
+	return run(expansion, () => expansion.nodes(body, EMPTY, "&", [], true, /* @__PURE__ */ new Set()));
+}
+/**
+* A utility recipe, registered in its own namespace over the mixins. Only token
+* recipes with an untyped value bind symbolic arguments such as `var()`.
+*/
+function expandUtility(program, definition, args) {
+	const { recipe } = definition;
+	const mixins = registry(program.mixins);
+	const expansion = new Expansion((name) => name === recipe.name ? recipe : mixins.get(name), definition.kind === "token" && recipe.parameters[0]?.syntax === void 0 ? recipe.name : void 0);
+	return run(expansion, () => expansion.call(recipe.name, args, EMPTY, "&", [], /* @__PURE__ */ new Set()));
+}
+export { expandBody, expandMixin, expandUtility };

package/dist/engine-js/src/native-properties.js

@@ -0,0 +1,5 @@
+// ../engine-js/src/native-properties.ts
+/** The native CSS property registry in byte order, including the `--*` entry. */
+const NATIVE_CSS_PROPERTIES = "--* -moz-appearance -moz-binding -moz-border-bottom-colors -moz-border-left-colors -moz-border-right-colors -moz-border-top-colors -moz-context-properties -moz-float-edge -moz-force-broken-image-icon -moz-orient -moz-outline-radius -moz-outline-radius-bottomleft -moz-outline-radius-bottomright -moz-outline-radius-topleft -moz-outline-radius-topright -moz-stack-sizing -moz-text-blink -moz-user-focus -moz-user-input -moz-user-modify -moz-window-dragging -moz-window-shadow -ms-accelerator -ms-block-progression -ms-content-zoom-chaining -ms-content-zoom-limit -ms-content-zoom-limit-max -ms-content-zoom-limit-min -ms-content-zoom-snap -ms-content-zoom-snap-points -ms-content-zoom-snap-type -ms-content-zooming -ms-filter -ms-flow-from -ms-flow-into -ms-grid-columns -ms-grid-rows -ms-high-contrast-adjust -ms-hyphenate-limit-chars -ms-hyphenate-limit-lines -ms-hyphenate-limit-zone -ms-ime-align -ms-overflow-style -ms-scroll-chaining -ms-scroll-limit -ms-scroll-limit-x-max -ms-scroll-limit-x-min -ms-scroll-limit-y-max -ms-scroll-limit-y-min -ms-scroll-rails -ms-scroll-snap-points-x -ms-scroll-snap-points-y -ms-scroll-snap-type -ms-scroll-snap-x -ms-scroll-snap-y -ms-scroll-translation -ms-scrollbar-3dlight-color -ms-scrollbar-arrow-color -ms-scrollbar-base-color -ms-scrollbar-darkshadow-color -ms-scrollbar-face-color -ms-scrollbar-highlight-color -ms-scrollbar-shadow-color -ms-scrollbar-track-color -ms-text-autospace -ms-touch-select -ms-user-select -ms-wrap-flow -ms-wrap-margin -ms-wrap-through -webkit-appearance -webkit-border-after -webkit-border-after-color -webkit-border-after-style -webkit-border-after-width -webkit-border-before -webkit-border-before-color -webkit-border-before-style -webkit-border-before-width -webkit-border-end -webkit-border-end-color -webkit-border-end-style -webkit-border-end-width -webkit-border-start -webkit-border-start-color -webkit-border-start-style -webkit-border-start-width -webkit-box-reflect -webkit-line-clamp -webkit-mask -webkit-mask-attachment -webkit-mask-clip -webkit-mask-composite -webkit-mask-image -webkit-mask-origin -webkit-mask-position -webkit-mask-position-x -webkit-mask-position-y -webkit-mask-repeat -webkit-mask-repeat-x -webkit-mask-repeat-y -webkit-mask-size -webkit-overflow-scrolling -webkit-tap-highlight-color -webkit-text-fill-color -webkit-text-stroke -webkit-text-stroke-color -webkit-text-stroke-width -webkit-touch-callout -webkit-user-modify -webkit-user-select accent-color align-content align-items align-self align-tracks alignment-baseline all anchor-name anchor-scope animation animation-composition animation-delay animation-direction animation-duration animation-fill-mode animation-iteration-count animation-name animation-play-state animation-range animation-range-end animation-range-start animation-timeline animation-timing-function animation-trigger appearance aspect-ratio backdrop-filter backface-visibility background background-attachment background-blend-mode background-clip background-color background-image background-origin background-position background-position-x background-position-y background-repeat background-size baseline-shift baseline-source block-size border border-block border-block-color border-block-end border-block-end-color border-block-end-style border-block-end-width border-block-start border-block-start-color border-block-start-style border-block-start-width border-block-style border-block-width border-bottom border-bottom-color border-bottom-left-radius border-bottom-right-radius border-bottom-style border-bottom-width border-collapse border-color border-end-end-radius border-end-start-radius border-image border-image-outset border-image-repeat border-image-slice border-image-source border-image-width border-inline border-inline-color border-inline-end border-inline-end-color border-inline-end-style border-inline-end-width border-inline-start border-inline-start-color border-inline-start-style border-inline-start-width border-inline-style border-inline-width border-left border-left-color border-left-style border-left-width border-radius border-right border-right-color border-right-style border-right-width border-shape border-spacing border-start-end-radius border-start-start-radius border-style border-top border-top-color border-top-left-radius border-top-right-radius border-top-style border-top-width border-width bottom box-align box-decoration-break box-direction box-flex box-flex-group box-lines box-ordinal-group box-orient box-pack box-shadow box-sizing break-after break-before break-inside caption-side caret caret-animation caret-color caret-shape clear clip clip-path clip-rule color color-interpolation-filters color-scheme column-count column-fill column-gap column-height column-rule column-rule-color column-rule-style column-rule-width column-span column-width column-wrap columns contain contain-intrinsic-block-size contain-intrinsic-height contain-intrinsic-inline-size contain-intrinsic-size contain-intrinsic-width container container-name container-type content content-visibility corner-block-end-shape corner-block-start-shape corner-bottom-left-shape corner-bottom-right-shape corner-bottom-shape corner-end-end-shape corner-end-start-shape corner-inline-end-shape corner-inline-start-shape corner-left-shape corner-right-shape corner-shape corner-start-end-shape corner-start-start-shape corner-top-left-shape corner-top-right-shape corner-top-shape counter-increment counter-reset counter-set cursor cx cy d direction display dominant-baseline dynamic-range-limit empty-cells field-sizing fill fill-opacity fill-rule filter flex flex-basis flex-direction flex-flow flex-grow flex-line-count flex-shrink flex-wrap float flood-color flood-opacity font font-family font-feature-settings font-kerning font-language-override font-optical-sizing font-palette font-size font-size-adjust font-smooth font-stretch font-style font-synthesis font-synthesis-position font-synthesis-small-caps font-synthesis-style font-synthesis-weight font-variant font-variant-alternates font-variant-caps font-variant-east-asian font-variant-emoji font-variant-ligatures font-variant-numeric font-variant-position font-variation-settings font-weight font-width forced-color-adjust frame-sizing gap grid grid-area grid-auto-columns grid-auto-flow grid-auto-rows grid-column grid-column-end grid-column-gap grid-column-start grid-gap grid-row grid-row-end grid-row-gap grid-row-start grid-template grid-template-areas grid-template-columns grid-template-rows hanging-punctuation height hyphenate-character hyphenate-limit-chars hyphens image-orientation image-rendering image-resolution ime-mode initial-letter initial-letter-align inline-size inset inset-block inset-block-end inset-block-start inset-inline inset-inline-end inset-inline-start interactivity interest-delay interest-delay-end interest-delay-start interpolate-size isolation justify-content justify-items justify-self justify-tracks left letter-spacing lighting-color line-break line-clamp line-height line-height-step link-parameters list-style list-style-image list-style-position list-style-type margin margin-block margin-block-end margin-block-start margin-bottom margin-inline margin-inline-end margin-inline-start margin-left margin-right margin-top margin-trim marker marker-end marker-mid marker-start mask mask-border mask-border-mode mask-border-outset mask-border-repeat mask-border-slice mask-border-source mask-border-width mask-clip mask-composite mask-image mask-mode mask-origin mask-position mask-repeat mask-size mask-type masonry-auto-flow math-depth math-shift math-style max-block-size max-height max-inline-size max-lines max-width min-block-size min-height min-inline-size min-width mix-blend-mode object-fit object-position object-view-box offset offset-anchor offset-distance offset-path offset-position offset-rotate opacity order orphans outline outline-color outline-offset outline-style outline-width overflow overflow-anchor overflow-block overflow-clip-box overflow-clip-margin overflow-inline overflow-wrap overflow-x overflow-y overlay overscroll-behavior overscroll-behavior-block overscroll-behavior-inline overscroll-behavior-x overscroll-behavior-y padding padding-block padding-block-end padding-block-start padding-bottom padding-inline padding-inline-end padding-inline-start padding-left padding-right padding-top page page-break-after page-break-before page-break-inside paint-order path-length perspective perspective-origin place-content place-items place-self pointer-events position position-anchor position-area position-try position-try-fallbacks position-try-order position-visibility print-color-adjust quotes r reading-flow reading-order resize right rotate row-gap ruby-align ruby-merge ruby-overhang ruby-position rx ry scale scroll-axis-lock scroll-behavior scroll-initial-target scroll-margin scroll-margin-block scroll-margin-block-end scroll-margin-block-start scroll-margin-bottom scroll-margin-inline scroll-margin-inline-end scroll-margin-inline-start scroll-margin-left scroll-margin-right scroll-margin-top scroll-marker-group scroll-padding scroll-padding-block scroll-padding-block-end scroll-padding-block-start scroll-padding-bottom scroll-padding-inline scroll-padding-inline-end scroll-padding-inline-start scroll-padding-left scroll-padding-right scroll-padding-top scroll-snap-align scroll-snap-coordinate scroll-snap-destination scroll-snap-points-x scroll-snap-points-y scroll-snap-stop scroll-snap-type scroll-snap-type-x scroll-snap-type-y scroll-target-group scroll-timeline scroll-timeline-axis scroll-timeline-name scrollbar-color scrollbar-gutter scrollbar-width shape-image-threshold shape-margin shape-outside shape-rendering speak-as stop-color stop-opacity stroke stroke-color stroke-dasharray stroke-dashoffset stroke-linecap stroke-linejoin stroke-miterlimit stroke-opacity stroke-width tab-size table-layout text-align text-align-last text-anchor text-autospace text-box text-box-edge text-box-trim text-combine-upright text-decoration text-decoration-color text-decoration-inset text-decoration-line text-decoration-skip text-decoration-skip-ink text-decoration-style text-decoration-thickness text-emphasis text-emphasis-color text-emphasis-position text-emphasis-style text-fit text-indent text-justify text-orientation text-overflow text-rendering text-shadow text-size-adjust text-spacing-trim text-transform text-underline-offset text-underline-position text-wrap text-wrap-mode text-wrap-style timeline-scope timeline-trigger timeline-trigger-activation-range timeline-trigger-activation-range-end timeline-trigger-activation-range-start timeline-trigger-active-range timeline-trigger-active-range-end timeline-trigger-active-range-start timeline-trigger-name timeline-trigger-source top touch-action transform transform-box transform-origin transform-style transition transition-behavior transition-delay transition-duration transition-property transition-timing-function translate trigger-scope unicode-bidi user-select vector-effect vertical-align view-timeline view-timeline-axis view-timeline-inset view-timeline-name view-transition-class view-transition-name view-transition-scope visibility white-space white-space-collapse widows width will-change window-drag word-break word-spacing word-wrap writing-mode x y z-index zoom".split(" ");
+const NATIVE_CSS_PROPERTY_SET = new Set(NATIVE_CSS_PROPERTIES);
+export { NATIVE_CSS_PROPERTIES, NATIVE_CSS_PROPERTY_SET };