@yahoo/uds-create-config 3.0.6 → 3.0.7

package/dist/migrations/2.0.0/v1-artifact.js

@@ -1,14 +1,15 @@
 import { isRef, pathOf, splitRef } from "../../framework/utils/refs.js";
 import { alpha, darken, lighten, mix } from "../../entities/system/color.js";
+import { Font } from "../../entities/system/Font.js";
 import { isCssProperty, kebabCase } from "../../css/values.js";
 import { Composite } from "../../entities/system/Composite.js";
 import { Modifier } from "../../entities/system/Modifier.js";
 import { StyleProperty } from "../../entities/system/StyleProperty.js";
+import { cssVar } from "../../framework/projections.js";
 import { Component, canonicalWhen } from "../../entities/system/Component.js";
 import { Icon } from "../../entities/system/Icon.js";
 import { stableStringify } from "../../framework/utils/content-key.js";
 import { CanvasRole } from "../../entities/system/CanvasRole.js";
-import { Font } from "../../entities/system/Font.js";
 import { GlobalStyle, globalStyleName } from "../../entities/system/GlobalStyle.js";
 import { Guidance } from "../../entities/system/Guidance.js";
 import { Motion } from "../../entities/system/Motion.js";
@@ -115,6 +116,8 @@ const V1_DIAGNOSTIC_CODES = {
 	"style-layer-undeclared": { loss: true },
 	/** A component that took content without declaring `children`; the slot is declared for it. */
 	"children-slot-inferred": { loss: false },
+	/** A variant whose values were all numbers and styled nothing — a number wearing an enum. */
+	"variant-numeric-to-number": { loss: false },
 	/** CSS whose syntax or ordered entries cannot be represented by a global style. */
 	"raw-css-unparsed": { loss: true },
 	/** A selector modifier v1 also guarded with a media query; a v2 modifier activates one way. The
@@ -127,7 +130,11 @@ const V1_DIAGNOSTIC_CODES = {
 	"ref-unresolved": { loss: true },
 	/** A style bag key that is neither a style prop, a CSS property, nor a prop of the layer's
 	*  element. v1 wrote it as a declaration no browser parses, so it painted nothing. */
-	"style-key-unrecognized": { loss: false }
+	"style-key-unrecognized": { loss: false },
+	/** A `font-family` token reaching its face through a `--<prefix>-font-family-*` variable that no
+	*  declared font answers to. Kept as written, so it paints what it painted; it is just not an
+	*  edge to a font. */
+	"font-var-unbound": { loss: false }
 };
 /** Module-scoped for the same reason `assetKinds` is: one load is in flight at a time. */
 let diagnose = () => {};
@@ -318,8 +325,10 @@ function buildModifiers(studio) {
 		const value = typeof selector === "string" ? selector : String(selector);
 		const name = modifierName(key);
 		if (def.media) report("modifier-media-dropped", name, `v1 wrapped \`${value}\` in \`@media ${def.media}\`; a v2 modifier is a selector or a query, not both`);
-		if (addressesPart(value)) {
-			record[name] = Modifier.item({
+		const folder = partFolder(value);
+		if (folder) {
+			if (!(folder in record)) record[folder] = Modifier.group({ label: folder });
+			record[`${folder}/${name}`] = Modifier.item({
 				type: "selector",
 				value
 			});
@@ -328,7 +337,7 @@ function buildModifiers(studio) {
 		if (!stateGroup) {
 			record.state = Modifier.group({
 				type: "state",
-				label: "State"
+				label: "state"
 			});
 			stateGroup = true;
 		}
@@ -339,9 +348,12 @@ function buildModifiers(studio) {
 	}
 	return record;
 }
-/** A pseudo-element or a child/sibling combinator styles a part of the element rather than the
-*  element under a condition, so it is a plain modifier rather than a state. */
-const addressesPart = (value) => /^\s*(::|>|~|\+)/.test(value);
+/** The folder a part-addressing modifier is filed under: `pseudo` for a pseudo-element, `children`
+*  for a combinator that reaches a child or sibling; `undefined` for a state. */
+function partFolder(value) {
+	if (/^\s*::/.test(value)) return "pseudo";
+	if (/^\s*(>|~|\+)/.test(value)) return "children";
+}
 /** A modifier's config-v2 name. Old configs key modifiers by their style-bag form (`_dark`), but
 *  the underscore is bag SYNTAX, not identity — so the entity is `dark`, which is what a ref points
 *  at and what codegen already looks up after stripping a bag key's `_`. */
@@ -456,13 +468,22 @@ function convertProp(name, prop, ctx) {
 		}
 		case "variant": {
 			const values = prop.values;
-			if (Array.isArray(values)) return {
-				decl: {
-					type: "variant",
-					value: values.map(String)
-				},
-				rules: []
-			};
+			if (Array.isArray(values)) {
+				if (values.length > 0 && values.every((v) => typeof v === "number")) {
+					report("variant-numeric-to-number", `${ctx.name}/${name}`, `a variant of ${values.length} numbers with no styles is declared as a number`);
+					return {
+						decl: { type: "number" },
+						rules: []
+					};
+				}
+				return {
+					decl: {
+						type: "variant",
+						value: values.map(String)
+					},
+					rules: []
+				};
+			}
 			const map = values ?? {};
 			return {
 				decl: {
@@ -614,7 +635,10 @@ function convertComponent({ name, raw: given, parent, components }) {
 		}
 		if (parentName && propName in parentProps && stableStringify(prop) === stableStringify(parentProps[propName])) continue;
 		const { decl, rules } = convertProp(propName, prop, ctx);
-		if (decl) props[propName] = decl;
+		if (decl) props[propName] = prop.__required === true ? {
+			...decl,
+			required: true
+		} : decl;
 		drafts.push(...rules);
 	}
 	if (parentName) {
@@ -666,6 +690,8 @@ function convertComponent({ name, raw: given, parent, components }) {
 			...existing.layers[layerName],
 			...bag
 		};
+		delete styles[key];
+		styles[key] = existing;
 	}
 	if (Object.keys(styles).length > 0) out.styles = styles;
 	if (raw.defaultProps) out.defaultProps = convertValue(raw.defaultProps);
@@ -875,20 +901,43 @@ function convert(studio, options) {
 		});
 	}
 	const rawCss = Array.isArray(studio.rawCss) ? studio.rawCss : [studio.rawCss ?? ""];
+	const varPrefix = studio.prefix ?? "uds";
+	const tokenByVar = tokenVarIndex(tokenRecord, varPrefix);
 	for (const [index, css] of rawCss.entries()) {
 		const { rules, unparsed } = parseRawCss(css);
 		for (const statement of unparsed) report("raw-css-unparsed", `rawCss/${index}`, statement);
 		for (const { selector, declarations } of rules) {
+			if (selector === "@font-face" && adoptFontFace(fontRecord, declarations)) continue;
 			const name = globalStyleName(selector, globalStyleNames);
 			globalStyleNames.add(name);
 			globalStyleRecord[name] = GlobalStyle.item({
 				selector,
-				declarations
+				declarations: withTokenRefs(declarations, tokenByVar)
 			});
 		}
 	}
+	for (const [name, style] of Object.entries(globalStyleRecord)) {
+		const body = style;
+		if (!body.declarations) continue;
+		globalStyleRecord[name] = GlobalStyle.item({
+			selector: body.selector,
+			declarations: withTokenRefs(body.declarations, tokenByVar)
+		});
+	}
+	bindFontFamilyTokens({
+		tokenRecord,
+		fontRecord,
+		globalStyleRecord,
+		varPrefix,
+		elsewhere: [componentRecord, compositeRecord]
+	});
+	bindIconDomains(componentRecord, studio.assetGroups ?? {});
+	readBracketedTokens(componentRecord, tokenByVar);
+	readBracketedTokens(compositeRecord, tokenByVar);
 	declareRawCssKeys(componentRecord, stylePropRecord);
+	const guidanceRecord = designPrinciplesGuidance(studio.designPrinciples);
 	const records = {
+		...Object.keys(guidanceRecord).length > 0 ? { guidance: guidanceRecord } : {},
 		globalStyles: globalStyleRecord,
 		canvasRoles: canvasRoleRecord,
 		modifiers: modifierRecord,
@@ -928,6 +977,296 @@ function convert(studio, options) {
 	return config;
 }
 /** The registered config: every record, then parts moved under their owners, then default guidance. */
+/**
+* An icon library's host component draws its domain from the library, not from a copy of it.
+*
+* v1 spelled the same fact twice: the asset group listed every glyph, and the component that renders
+* one (`component: 'Icon'`) enumerated the same names as its `name` variant — 1,500 values copied
+* into a component body — and the set's variants again as its `variant` values. config-v2 lets a
+* variant DELEGATE (`value: Icon.ref('icons')`, `Icon.ref('icons#variants')`), which is how every
+* hand-authored system writes it, so a host prop whose enumerated values are exactly the library's
+* members (or its variants) is bound to the library here. Anything narrower or wider is the author's
+* own list and stays one.
+*/
+function bindIconDomains(componentRecord, assetGroups) {
+	const sameSet = (left, right) => left.length === right.length && new Set(left).size === left.length && right.every((name) => left.includes(name));
+	for (const [group, meta] of Object.entries(assetGroups)) {
+		if (meta.assetKind === "font" || !meta.component) continue;
+		const host = componentRecord[meta.component];
+		if (!host?.props) continue;
+		const members = Array.isArray(meta.members) ? meta.members : void 0;
+		for (const decl of Object.values(host.props)) {
+			if (decl?.type !== "variant" || !Array.isArray(decl.value)) continue;
+			const values = decl.value;
+			if (members && sameSet(values, members)) decl.value = Icon.ref(group);
+			else if (meta.variants && sameSet(values, meta.variants)) decl.value = { __ref: `icon:${group}#variants` };
+		}
+	}
+}
+/**
+* Every token's CSS custom property → the token, for reading a v1 global style back to refs.
+*
+* v1 resolved `tokens.background.primary` to `var(--yos-background-primary)` at config time and wrote
+* the string into the artifact. config-v2 names a token by REF in a rule, so the graph sees the edge
+* and a rename cascades; the string is what `cssVar` derives from the path, so deriving it for every
+* token and matching is exact. A name two tokens would share is left out rather than guessed.
+*/
+function tokenVarIndex(tokenRecord, varPrefix) {
+	const byVar = /* @__PURE__ */ new Map();
+	for (const [path, body] of Object.entries(tokenRecord)) {
+		if (!body || typeof body !== "object" || !("value" in body)) continue;
+		const name = cssVar(void 0, "token", path, varPrefix);
+		byVar.set(name, byVar.has(name) ? null : path);
+	}
+	const unique = /* @__PURE__ */ new Map();
+	for (const [name, path] of byVar) if (path !== null) unique.set(name, path);
+	return unique;
+}
+/**
+* Declarations as a v2 rule authors them: a value that IS one token's variable (`var(--yos-x)`)
+* read back to the ref, and a property spelled camelCase (`backgroundColor`) so it needs no quoting.
+* A value only containing a variable (`1px solid var(--yos-x)`) is CSS text and stays as written; a
+* custom property (`--x`) or a vendor-prefixed one (`-webkit-x`) keeps its spelling, since neither
+* has a camelCase form the stylesheet emitter reads back. A nested block (an `@supports` body) is
+* walked the same way.
+*/
+function withTokenRefs(declarations, tokenByVar) {
+	return Object.fromEntries(Object.entries(declarations).map(([property, value]) => {
+		const key = /^[a-z][a-z0-9]*(-[a-z0-9]+)+$/.test(property) ? property.replace(/-([a-z0-9])/g, (_, c) => c.toUpperCase()) : property;
+		if (value && typeof value === "object" && !Array.isArray(value)) return [key, withTokenRefs(value, tokenByVar)];
+		if (typeof value !== "string") return [key, value];
+		const match = /^var\((--[A-Za-z0-9_-]+)\)$/.exec(value.trim());
+		const path = match?.[1] ? tokenByVar.get(match[1]) : void 0;
+		return [key, path === void 0 ? value : Token.ref(path)];
+	}));
+}
+/**
+* A bracket literal that only wraps one token's variable — `'[var(--yos-font-size-075)]'` — is that
+* token, written the long way round: v1 had no way to say "this token" in a bag whose prop did not
+* list it, so authors reached for the variable. Read back to the ref wherever a bag holds one, so the
+* emitter can print the leaf and the graph sees the edge. Walks every bag under `styles` (rule layers,
+* their modifier blocks) and a composite's `styles`.
+*/
+function readBracketedTokens(record, tokenByVar) {
+	if (tokenByVar.size === 0) return;
+	const walk = (value) => {
+		if (typeof value === "string") {
+			const match = /^\[var\((--[A-Za-z0-9_-]+)\)\]$/.exec(value.trim());
+			const path = match?.[1] ? tokenByVar.get(match[1]) : void 0;
+			return path === void 0 ? value : Token.ref(path);
+		}
+		if (Array.isArray(value)) return value.map(walk);
+		if (value && typeof value === "object" && !isRef(value)) {
+			const out = value;
+			for (const [key, member] of Object.entries(out)) out[key] = walk(member);
+			return out;
+		}
+		return value;
+	};
+	for (const body of Object.values(record)) {
+		if (!body || typeof body !== "object") continue;
+		const styles = body.styles;
+		if (styles && typeof styles === "object") walk(styles);
+	}
+}
+/** A `var(--name, fallback…)` value: the variable and whatever follows the first comma. */
+const VAR_VALUE = /^var\(\s*(--[A-Za-z0-9_-]+)\s*(?:,\s*([\s\S]*?))?\s*\)$/;
+/** A `font-family` list as its members, quotes stripped: `"YA Sans VF", Helvetica Neue` → two. */
+function familiesOf(stack) {
+	return stack.split(",").map((entry) => entry.trim().replace(/^['"]|['"]$/g, "").trim()).filter((entry) => entry.length > 0);
+}
+/**
+* Every `font-family` token bound to the Font it names, and the variable it used to name it by
+* retired.
+*
+* v1 had no way for a token to SAY "this family": a font was a `@font-face` in verbatim CSS plus a
+* `:root` custom property carrying its stack (`--yos-font-family-yas: "YA Sans VF", Helvetica Neue,
+* …`), and the token read the property — `var(--yos-font-family-yas, ui-sans-serif, …)`. A system
+* that registered its fonts as assets got the property from the build instead, named by the member
+* (`--yos-font-family-yas` for `fonts/yas`). Either way the token's value is the NAME of a variable,
+* so the graph holds no edge from token to font, and in v2 nothing emits the variable — the token
+* would resolve to its `var()` fallback and the brand face would silently not apply.
+*
+* config-v2 spells the edge as the value: `Token.item({ value: Font.ref('fonts/yas') })`, which the
+* emitter renders as the family's stack. So a token whose value is such a variable is rewritten to the
+* ref of the font it reached, found two ways, in order:
+*
+*  1. a font whose leaf IS the variable's suffix — the asset-member spelling (`fonts/yas`);
+*  2. a `:root` property of that name whose first family names a font by `fontFamily` — the
+*     verbatim-CSS spelling, where `adoptFontFace` already made the font from the face and keyed
+*     it by the family's slug (`fonts/ya-sans-vf`).
+*
+* A literal stack whose first family is a declared font (`'"YA Sans VF", Arial'`) binds the same way.
+*
+* The stack's tail is the family's `fallbackStack` when the font has none yet: from the `:root`
+* property where there is one (that is what actually painted — the `var()` fallback only applied when
+* the property was missing), else from the `var()` fallback. And a `:root` property that only fed the
+* tokens now bound is dropped: its stack lives on the font, and a rule elsewhere still spelling
+* `var(--yos-font-family-yas)` keeps it declared, since dropping it would break that rule.
+*/
+function bindFontFamilyTokens({ tokenRecord, fontRecord, globalStyleRecord, varPrefix, elsewhere }) {
+	const fonts = /* @__PURE__ */ new Map();
+	for (const [path, body] of Object.entries(fontRecord)) if (body && typeof body === "object" && "fontFamily" in body) fonts.set(path, body);
+	if (fonts.size === 0) return;
+	const unique = (pairs) => {
+		const seen = /* @__PURE__ */ new Map();
+		for (const [key, path] of pairs) seen.set(key, seen.has(key) ? null : path);
+		const out = /* @__PURE__ */ new Map();
+		for (const [key, path] of seen) if (path !== null) out.set(key, path);
+		return out;
+	};
+	const byLeaf = unique([...fonts.keys()].map((path) => [path.slice(path.lastIndexOf("/") + 1), path]));
+	const byFamily = unique([...fonts].map(([path, body]) => [body.fontFamily.toLowerCase(), path]));
+	const propertyPrefix = `--${varPrefix}-font-family-`;
+	const rootVars = /* @__PURE__ */ new Map();
+	for (const [name, style] of Object.entries(globalStyleRecord)) {
+		const body = style;
+		if (body.selector?.trim() !== ":root" || !body.declarations) continue;
+		for (const [property, value] of Object.entries(body.declarations)) if (property.startsWith(propertyPrefix) && typeof value === "string") rootVars.set(property.slice(propertyPrefix.length), {
+			style: name,
+			property,
+			stack: value
+		});
+	}
+	/** The font a token value reaches, and the fallbacks that painted beneath it. */
+	const bind = (value) => {
+		const asVar = VAR_VALUE.exec(value.trim());
+		if (asVar?.[1]) {
+			if (!asVar[1].startsWith(propertyPrefix)) return void 0;
+			const name = asVar[1].slice(propertyPrefix.length);
+			const root = rootVars.get(name);
+			const byMember = byLeaf.get(name);
+			if (byMember !== void 0) return {
+				path: byMember,
+				fallbacks: root ? familiesOf(root.stack).slice(1) : fallbackList(asVar[2]),
+				via: name
+			};
+			if (root) {
+				const [family, ...rest] = familiesOf(root.stack);
+				const path = family ? byFamily.get(family.toLowerCase()) : void 0;
+				if (path !== void 0) return {
+					path,
+					fallbacks: rest,
+					via: name
+				};
+			}
+			return;
+		}
+		const [family, ...rest] = familiesOf(value);
+		const path = family ? byFamily.get(family.toLowerCase()) : void 0;
+		return path === void 0 ? void 0 : {
+			path,
+			fallbacks: rest
+		};
+	};
+	const consumed = /* @__PURE__ */ new Set();
+	for (const [tokenPath, body] of Object.entries(tokenRecord)) {
+		if (!body || typeof body !== "object" || !("value" in body)) continue;
+		const token = body;
+		const slots = [{
+			get: () => token.value,
+			set: (next) => token.value = next
+		}, ...Object.values(token.overrides ?? {}).map((override) => ({
+			get: () => override.value,
+			set: (next) => override.value = next
+		}))];
+		for (const slot of slots) {
+			const value = slot.get();
+			if (typeof value !== "string") continue;
+			const asVar = VAR_VALUE.exec(value.trim());
+			const isFontVar = asVar?.[1]?.startsWith(propertyPrefix) === true;
+			if (!isFontVar && !familiesOf(value).some((f) => byFamily.has(f.toLowerCase()))) continue;
+			const bound = bind(value);
+			if (!bound) {
+				if (isFontVar) report("font-var-unbound", `tokens/${tokenPath}`, `reads ${asVar?.[1]}, which no declared font answers to; kept as written`);
+				continue;
+			}
+			const font = fonts.get(bound.path);
+			if (!font.fallbackStack?.length && bound.fallbacks.length > 0) font.fallbackStack = bound.fallbacks;
+			slot.set(Font.ref(bound.path));
+			if (bound.via !== void 0) consumed.add(bound.via);
+		}
+	}
+	if (consumed.size === 0) return;
+	const remaining = JSON.stringify([
+		tokenRecord,
+		globalStyleRecord,
+		...elsewhere
+	]);
+	for (const name of consumed) {
+		const root = rootVars.get(name);
+		if (!root || remaining.includes(`var(${root.property}`)) continue;
+		const style = globalStyleRecord[root.style];
+		if (!style.declarations) continue;
+		delete style.declarations[root.property];
+		if (Object.keys(style.declarations).length === 0) delete globalStyleRecord[root.style];
+	}
+}
+/**
+* One `@font-face` rule folded into the `fonts` library as a file of the family it declares.
+*
+* The family's slug is its name in kebab case, files are keyed `<weight>-<style>` the way the Font
+* entity's `files` are authored, and a weight RANGE (`100 900`) marks the family variable. The first
+* `url(…) format(…)` pair is the file; a face with no parseable `src` or family is not adopted and
+* stays a global style. Returns whether the rule was taken.
+*/
+function adoptFontFace(fontRecord, declarations) {
+	const text = (property) => {
+		const value = declarations[property];
+		return typeof value === "string" ? value.trim() : void 0;
+	};
+	const family = text("font-family")?.replace(/^['"]|['"]$/g, "");
+	const src = text("src");
+	if (!family || !src) return false;
+	const file = /url\((['"]?)([^'")]+)\1\)(?:\s*format\((['"]?)([^'")]+)\3\))?/.exec(src);
+	if (!file?.[2]) return false;
+	const url = file[2];
+	const format = file[4]?.split(/\s+/)[0];
+	const weightText = text("font-weight") ?? "400";
+	const style = text("font-style") ?? "normal";
+	const isRange = /\s/.test(weightText);
+	const weight = !isRange && /^\d+$/.test(weightText) ? Number(weightText) : weightText;
+	const path = `fonts/${family.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-|-$/g, "")}`;
+	if (!("fonts" in fontRecord)) fontRecord.fonts = Font.group({ label: "Fonts" });
+	const existing = fontRecord[path] ?? {
+		fontFamily: family,
+		files: {}
+	};
+	existing.files[`${weightText}-${style}`] = {
+		src: url,
+		...format ? { format } : {},
+		weight,
+		style
+	};
+	if (isRange) existing.isVariableFont = true;
+	fontRecord[path] = existing;
+	return true;
+}
+/**
+* v1 `designPrinciples` as a `guidance` group.
+*
+* The list was prose for the model with no keys of its own, and a guidance item needs one. Each
+* principle is keyed by a slug of its leading words — `yahoo-purple-is-the-signature` — which reads
+* in Studio the way the reference system's hand-written keys do, and takes a numeric suffix only
+* where two principles open alike.
+*/
+function designPrinciplesGuidance(principles) {
+	const texts = (principles ?? []).filter((principle) => typeof principle === "string" && principle.trim().length > 0);
+	if (texts.length === 0) return {};
+	const record = { "design-principles": Guidance.group({
+		label: "Design principles",
+		description: "The system's brand and product principles, carried over from the v1 config's `designPrinciples`."
+	}) };
+	const used = /* @__PURE__ */ new Set();
+	for (const text of texts) {
+		const base = text.toLowerCase().replace(/`[^`]*`/g, " ").replace(/[^a-z0-9]+/g, " ").trim().split(/\s+/).slice(0, 5).join("-") || "principle";
+		let key = base;
+		for (let n = 2; used.has(key); n++) key = `${base}-${n}`;
+		used.add(key);
+		record[`design-principles/${key}`] = Guidance.item({ text: [text] });
+	}
+	return record;
+}
 function assemble({ settings, records, renames }) {
 	let config = new System().register({ settings }).register(records);
 	if (renames.length > 0) config = config.run(renames.map(({ from, to }) => ({
@@ -936,7 +1275,8 @@ function assemble({ settings, records, renames }) {
 		path: from,
 		to
 	})));
-	if (config.list("guidance").length === 0) config = config.register({ guidance: DEFAULT_GUIDANCE });
+	const seeded = Object.fromEntries(Object.entries(DEFAULT_GUIDANCE).filter(([group]) => !Guidance.groups(config).some((held) => held.path === group)));
+	if (Object.keys(seeded).length > 0) config = config.register({ guidance: seeded });
 	return config;
 }
 /** Kind → the record `register` takes it under. Read at call time: `System` is a cycle away. */

package/dist/migrations/20260912161840_preview_conditions.d.ts

@@ -0,0 +1,9 @@
+/**
+ * TODO: say what changed about the wire shape and why.
+ *
+ * See 20260908171448_settings_as_kind.ts for a complete worked example (frozen schemas, a slot
+ * transform), and .claude/rules/config-schema-migrations.md for the full mint checklist.
+ */
+import type { SchemaMigration } from '../framework/schema-version';
+export declare const PREVIEW_CONDITIONS_VERSION = 20260912161840;
+export declare const previewConditionsMigration: SchemaMigration;

package/dist/migrations/20260912161840_preview_conditions.js

@@ -0,0 +1,10 @@
+//#region src/migrations/20260912161840_preview_conditions.ts
+const PREVIEW_CONDITIONS_VERSION = 20260912161840;
+const previewConditionsMigration = {
+	version: PREVIEW_CONDITIONS_VERSION,
+	up(json) {
+		return json;
+	}
+};
+//#endregion
+export { PREVIEW_CONDITIONS_VERSION, previewConditionsMigration };

package/dist/migrations/20260912164927_font_variable.d.ts

@@ -0,0 +1,18 @@
+/**
+ * A font gains an optional `variable`: the CSS custom property a HOST publishes the loaded face's
+ * family under, the way `next/font`'s `variable` option does (`--uds-font-family-inter` holds
+ * `'__Inter_a1b2c3', '__Inter_Fallback_a1b2c3'`).
+ *
+ * Why a field and not a token spelling: a `font-family` token that read such a property spelled it
+ * as a literal — `var(--uds-font-family-inter, ui-sans-serif, …)` — so the graph held no edge from
+ * the token to any font, and the token could not be `Font.ref(…)` without dropping the variable and
+ * with it the face the host loads. With the property on the font, the token is a ref and the stack
+ * the font stands for is `var(--uds-font-family-inter, "Inter", ui-sans-serif, …)`: the host's face
+ * first, the family by name beneath it, the fallbacks last — the same CSS the literal produced.
+ *
+ * Additive. A font stored without the field is a font the stylesheet addresses by family name,
+ * which is what every font stored before this version was.
+ */
+import type { SchemaMigration } from '../framework/schema-version';
+export declare const FONT_VARIABLE_VERSION = 20260912164927;
+export declare const fontVariableMigration: SchemaMigration;

package/dist/migrations/20260912164927_font_variable.js

@@ -0,0 +1,10 @@
+//#region src/migrations/20260912164927_font_variable.ts
+const FONT_VARIABLE_VERSION = 20260912164927;
+const fontVariableMigration = {
+	version: FONT_VARIABLE_VERSION,
+	up(json) {
+		return json;
+	}
+};
+//#endregion
+export { FONT_VARIABLE_VERSION, fontVariableMigration };