onsystem 0.5.0 → 0.6.0

package/dist/{design-system-CnEv5sIL.js → design-system-A3pRX3Ka.js}

@@ -4,11 +4,12 @@ import { pathToFileURL } from "node:url";
 import * as z from "zod";
 import { escapePath, glob, globSync } from "tinyglobby";
 import ts from "typescript";
-import { clampChroma, colorsNamed, converter, differenceEuclidean, parse } from "culori";
+import { clampChroma, colorsNamed, converter, differenceEuclidean, formatHex, parse } from "culori";
 import { createHash } from "node:crypto";
-import fs$1 from "node:fs/promises";
+import fsp from "node:fs/promises";
 import os from "node:os";
 import postcss from "postcss";
+import { LineCounter, isMap, isScalar, parseDocument, stringify } from "yaml";
 import { stemmer } from "stemmer";
 //#region src/extract/program.ts
 const DEFAULT_OPTIONS = {
@@ -32,7 +33,8 @@ function readProjectConfig(root, tsconfig) {
 		options: { ...DEFAULT_OPTIONS },
 		pathsBase: root,
 		paths: {},
-		configFiles: []
+		configFiles: [],
+		fileNames: []
 	};
 	const configFiles = [configFile];
 	const read = ts.readConfigFile(configFile, (file) => ts.sys.readFile(file));
@@ -41,7 +43,8 @@ function readProjectConfig(root, tsconfig) {
 		pathsBase: root,
 		paths: {},
 		configFile,
-		configFiles
+		configFiles,
+		fileNames: []
 	};
 	const host = {
 		useCaseSensitiveFileNames: ts.sys.useCaseSensitiveFileNames,
@@ -69,7 +72,8 @@ function readProjectConfig(root, tsconfig) {
 		pathsBase: options.baseUrl ?? (typeof options.pathsBasePath === "string" ? options.pathsBasePath : path.dirname(configFile)),
 		paths: options.paths ?? {},
 		configFile,
-		configFiles
+		configFiles,
+		fileNames: parsed.fileNames
 	};
 }
 function createProgram(files, config, oldProgram) {
@@ -166,7 +170,7 @@ function globSource(pattern) {
 				out += "\\{";
 				continue;
 			}
-			const options = splitTopLevel$1(pattern.slice(i + 1, end));
+			const options = splitTopLevel$2(pattern.slice(i + 1, end));
 			out += `(?:${options.map(globSource).join("|")})`;
 			i = end;
 		} else out += escapeRegExp(c);
@@ -180,7 +184,7 @@ function closingBrace(pattern, open) {
 	else if (pattern[i] === "}" && --depth === 0) return i;
 	return -1;
 }
-function splitTopLevel$1(text) {
+function splitTopLevel$2(text) {
 	const parts = [];
 	let depth = 0;
 	let current = "";
@@ -235,13 +239,17 @@ const SOURCE_EXTENSIONS = [
 const BUILD_DIR = /^(?:dist|build|lib|out|esm|cjs|es|module|types)\//;
 /** `index.mjs`, `index.d.ts`, `button.cjs`: an output file, by its extension. */
 const OUTPUT_EXTENSION = /(?:\.d)?\.[cm]?[jt]sx?$/;
-/** `base` as a file, with an extension added, or as a directory's index. */
-function moduleFile(base, extensions = MODULE_EXTENSIONS) {
+/**
+* `base` as a file, with an extension added, or as a directory's index, never in an installed
+* package: in `node_modules`, or with `within` (a package's own folder, which may be installed
+* itself), in a `node_modules` below it.
+*/
+function moduleFile(base, extensions = MODULE_EXTENSIONS, within) {
 	return [
 		base,
 		...extensions.map((ext) => `${base}${ext}`),
 		...extensions.map((ext) => path.join(base, `index${ext}`))
-	].find((file) => isFile$1(file) && !/[\\/]node_modules[\\/]/.test(file));
+	].find((file) => isFile$1(file) && !/(?:^|[\\/])node_modules[\\/]/.test(within ? path.relative(within, file) : file));
 }
 const BUILD_CONFIGS = [
 	"tsup",
@@ -361,7 +369,7 @@ function sourceTarget(dir, key, target, entries) {
 	];
 	for (const candidate of candidates) {
 		if (candidate === void 0) continue;
-		const file = moduleFile(path.join(dir, candidate), SOURCE_EXTENSIONS);
+		const file = moduleFile(path.join(dir, candidate), SOURCE_EXTENSIONS, dir);
 		if (file && isInside(dir, file)) return toPosix(path.relative(dir, file));
 	}
 }
@@ -389,7 +397,7 @@ function exportedFiles(file, packageDir) {
 		if (!barrel) found.push(current);
 		for (const specifier of from) {
 			if (!specifier.startsWith(".")) continue;
-			const next = moduleFile(path.resolve(path.dirname(current), specifier));
+			const next = moduleFile(path.resolve(path.dirname(current), specifier), void 0, packageDir);
 			if (next && isInside(packageDir, next)) visit(next, depth + 1);
 		}
 	};
@@ -533,16 +541,19 @@ const STYLESHEETS = [
 * With more than one design system, the one the root's code imports most comes first
 * (`designSystems`). A candidate whose globs match no file is skipped. Returns undefined
 * when nothing applies, so the shadcn defaults stay in force.
+*
+* `declared` is the dependency whose config the root takes on ({@link findDesignSystemPackage}):
+* it is read first among the dependencies in step 3, whatever its name, and also when it is
+* installed from a registry rather than a workspace package.
 */
-function detectProject(root, tsconfig, trace) {
+function detectProject(root, tsconfig, trace, declared, packages = new PackageFinder(root)) {
 	const step = (candidate, accepted, reason) => trace?.push({
 		candidate,
 		accepted,
 		reason
 	});
-	const packages = new PackageFinder(root);
 	const found = [];
-	const shadcn = readJson(path.join(root, "components.json"));
+	const shadcn = readJson$1(path.join(root, "components.json"));
 	let why = "no ui or components alias";
 	const fromShadcn = shadcn ? fromComponentsJson(root, root, shadcn, readProjectConfig(root, tsconfig), packages, (r) => {
 		why = r;
@@ -558,7 +569,7 @@ function detectProject(root, tsconfig, trace) {
 		step("components.json", true, `ui: ${fromShadcn.source}, ${countFiles(root, fromShadcn)}`);
 	}
 	const withDefaults = !found.length;
-	const own = readJson(path.join(root, "package.json"));
+	const own = readJson$1(path.join(root, "package.json"));
 	const ownName = typeof own?.name === "string" ? own.name : "the root";
 	if (!found.length) {
 		let reason = "no package.json";
@@ -575,17 +586,19 @@ function detectProject(root, tsconfig, trace) {
 		...asRecord(own?.dependencies),
 		...asRecord(own?.devDependencies)
 	});
-	const names = dependencies.filter(isDesignSystemName);
+	const names = unique([...declared ? [declared.name] : [], ...dependencies.filter(isDesignSystemName)]);
 	if (!names.length) step("workspace design-system packages", false, `no dependency is named like one (@acme/ui, acme-ui, @acme/design-system) among ${plural(dependencies.length, "dependency", "dependencies")}`);
 	let imported;
 	for (const name of names) {
-		const candidate = `workspace package ${name}`;
+		const own = name === declared?.name ? declared : void 0;
+		const kind = own?.installed ? "installed" : "workspace";
+		const candidate = `${kind} package ${name}`;
 		if (found.some((f) => f.package === name)) {
 			step(candidate, false, "not added twice: components.json points into it");
 			continue;
 		}
-		const dir = packages.find(name);
-		const pkg = dir ? readJson(path.join(dir, "package.json")) : void 0;
+		const dir = own ? own.dir : packages.find(name);
+		const pkg = dir ? readJson$1(path.join(dir, "package.json")) : void 0;
 		if (!dir || !pkg) {
 			step(candidate, false, "not a workspace package: an installed package is compiled, and only sources are read");
 			continue;
@@ -596,7 +609,7 @@ function detectProject(root, tsconfig, trace) {
 		if (result && matchesAny(root, result)) {
 			found.push({
 				...result,
-				source: `workspace package ${result.source}`,
+				source: `${kind} package ${result.source}`,
 				package: name,
 				prefixes: [name]
 			});
@@ -638,12 +651,23 @@ function detectProject(root, tsconfig, trace) {
 }
 /** `12 component files`, for the trace. */
 function countFiles(root, found) {
-	const files = globSync(found.components, {
+	return plural(componentGlob(root, found.components).length, "component file");
+}
+/**
+* The files `patterns` match, outside `node_modules` unless a pattern points into it: the
+* sources of a design-system package installed there.
+*/
+function componentGlob(root, patterns) {
+	const named = patterns.filter((p) => p.includes("node_modules"));
+	const rest = patterns.filter((p) => !p.includes("node_modules"));
+	const options = {
 		cwd: root,
-		ignore: ["**/node_modules/**"],
 		expandDirectories: false
-	}).length;
-	return plural(files, "component file");
+	};
+	return [...rest.length ? globSync(rest, {
+		...options,
+		ignore: ["**/node_modules/**"]
+	}) : [], ...named.length ? globSync(named, options) : []];
 }
 function plural(n, one, many = `${one}s`) {
 	return `${n.toLocaleString("en-US")} ${n === 1 ? one : many}`;
@@ -737,11 +761,7 @@ function detection(root, found, withDefaults, source) {
 	};
 }
 function matchesAny(root, found) {
-	return globSync(found.components, {
-		cwd: root,
-		ignore: ["**/node_modules/**"],
-		expandDirectories: false
-	}).length > 0;
+	return componentGlob(root, found.components).length > 0;
 }
 /** `components.json` read from `dir` (the root, or a workspace package's directory). */
 function fromComponentsJson(root, dir, json, project, packages, note = ignore) {
@@ -756,7 +776,7 @@ function fromComponentsJson(root, dir, json, project, packages, note = ignore) {
 	if (!uiDir) {
 		const name = packageName(ui);
 		const pkgDir = name ? packages.find(name) : void 0;
-		const pkg = pkgDir ? readJson(path.join(pkgDir, "package.json")) : void 0;
+		const pkg = pkgDir ? readJson$1(path.join(pkgDir, "package.json")) : void 0;
 		if (!name || !pkgDir || !pkg) {
 			note(`the ui alias ${ui} resolves through neither tsconfig paths nor a workspace package`);
 			return;
@@ -786,7 +806,7 @@ function fromComponentsJson(root, dir, json, project, packages, note = ignore) {
 */
 function ownerPackage(root, dir, alias) {
 	for (let current = dir;; current = path.dirname(current)) {
-		const name = readJson(path.join(current, "package.json"))?.name;
+		const name = readJson$1(path.join(current, "package.json"))?.name;
 		if (typeof name === "string") return path.resolve(current) === path.resolve(root) ? { prefixes: [alias] } : {
 			package: name,
 			prefixes: [alias, name]
@@ -800,7 +820,7 @@ function ownerPackage(root, dir, alias) {
 * the package name, not through the package's internal `@/` alias.
 */
 function fromPackageComponentsJson(root, dir, pkg, packages, note = ignore) {
-	const json = readJson(path.join(dir, "components.json"));
+	const json = readJson$1(path.join(dir, "components.json"));
 	if (!json) return void 0;
 	const found = fromComponentsJson(root, dir, json, readProjectConfig(dir), packages, (r) => {
 		note(`its components.json: ${r}`);
@@ -876,7 +896,7 @@ function fromImports(root, dir, name, subpaths, note = ignore) {
 	const stylesheets = [];
 	const seen = /* @__PURE__ */ new Set();
 	for (const subpath of [...subpaths ?? []].sort()) {
-		const file = moduleFile(path.join(dir, subpath));
+		const file = moduleFile(path.join(dir, subpath), void 0, dir);
 		if (!file || seen.has(file)) continue;
 		seen.add(file);
 		const specifier = `${name}/${subpath}`;
@@ -1065,7 +1085,7 @@ function moduleResolver(root) {
 		if (!name || !dir) return void 0;
 		const subpath = specifier.slice(name.length + 1);
 		if (subpath) return moduleFile(path.join(dir, subpath));
-		const main = readJson(path.join(dir, "package.json"))?.main;
+		const main = readJson$1(path.join(dir, "package.json"))?.main;
 		return moduleFile(path.resolve(dir, typeof main === "string" ? main : "index"));
 	};
 }
@@ -1086,7 +1106,7 @@ function workspaceModule(root) {
 		if (!name || !dir) return void 0;
 		const source = moduleFile(path.join(dir, "src", specifier.slice(name.length + 1) || "index"));
 		if (source) return { file: source };
-		const exports = readJson(path.join(dir, "package.json"))?.exports;
+		const exports = readJson$1(path.join(dir, "package.json"))?.exports;
 		if (!exports || typeof exports !== "object" || Array.isArray(exports)) return void 0;
 		const subpath = `.${specifier.slice(name.length)}`;
 		return Object.keys(exports).some((key) => {
@@ -1096,18 +1116,130 @@ function workspaceModule(root) {
 		}) ? {} : void 0;
 	};
 }
+/** The package.json field a design-system package names its onsystem config with. */
+const PACKAGE_FIELD = "onsystem";
+/**
+* The config the package.json in `dir` declares: its `onsystem` field, a JSON file in the
+* package (`"./onsystem.config.json"`). Undefined without the field; a problem when the field
+* names something that cannot be read. Only JSON: a config in code would run a dependency's code.
+*/
+function declaredConfig(dir, pkg = readJson$1(path.join(dir, "package.json"))) {
+	const value = pkg?.[PACKAGE_FIELD];
+	if (value === void 0) return void 0;
+	const field = `"${PACKAGE_FIELD}" in ${path.join(dir, "package.json")}`;
+	if (typeof value !== "string" || !value.endsWith(".json")) return { problem: `${field} is ${JSON.stringify(value)}: it names a JSON config file in the package, such as "./onsystem.config.json".` };
+	const file = path.resolve(dir, value);
+	if (!isInside(dir, file) || file === path.resolve(dir)) return { problem: `${field} names ${value}, which is outside the package.` };
+	if (!isFile(file)) return { problem: `${field} names ${value}, which does not exist.` };
+	return { file };
+}
+/**
+* The dependency of `root` (in `dependencies` or `devDependencies`) whose package.json declares
+* its onsystem config, as a workspace package or installed from a registry: the design system
+* the root uses, set up in its own package. With several, the one the root's code imports
+* most, then the first listed; `others` names the rest. A declaration that cannot be read is a
+* problem in a workspace package, which its team owns, and is skipped in an installed one, so a
+* published package cannot stop the apps that use it. Undefined at a workspace root, whose
+* projects each find their own, and without a package.json.
+*
+* Only the root's own dependencies are looked at, each where Node.js resolves it
+* ({@link PackageFinder.locate}). `packages` is the load's finder, shared with detection.
+*/
+function findDesignSystemPackage(root, packages = new PackageFinder(root)) {
+	const own = readJson$1(path.join(root, "package.json"));
+	if (!own || isWorkspaceRoot(root)) return void 0;
+	const names = Object.keys({
+		...asRecord(own.dependencies),
+		...asRecord(own.devDependencies)
+	});
+	const declaring = [];
+	const problems = [];
+	const skipped = [];
+	for (const name of names) {
+		const located = packages.locate(name);
+		if (located?.json["onsystem"] === void 0) continue;
+		const resolved = packages.place(located.dir);
+		const declared = declaredConfig(resolved.dir, located.json);
+		if (!declared) continue;
+		if ("problem" in declared) (resolved.installed ? skipped : problems).push({
+			name,
+			problem: declared.problem
+		});
+		else declaring.push({
+			name,
+			dir: resolved.dir,
+			config: declared.file,
+			installed: resolved.installed,
+			boundary: resolved.boundary
+		});
+	}
+	let ranked = declaring;
+	if (declaring.length > 1) {
+		const counts = importCounts(root, declaring.map((p) => [p.name]));
+		ranked = declaring.map((p, i) => ({
+			p,
+			imports: counts[i] ?? 0,
+			i
+		})).sort((a, b) => b.imports - a.imports || a.i - b.i).map((r) => r.p);
+	}
+	const [found, ...others] = ranked;
+	return {
+		found,
+		others: others.map((p) => p.name),
+		problems,
+		skipped,
+		dependencies: names.length
+	};
+}
+/**
+* Import specifiers for the component files a package's `exports` lead to, through barrels and
+* from `dist/` back to the sources: what apps import its components by.
+*/
+function packageImports(root, dir) {
+	const pkg = readJson$1(path.join(dir, "package.json"));
+	return pkg ? fromPackage(root, dir, pkg)?.imports ?? [] : [];
+}
+/**
+* Dependencies' package.json files, parsed, by path: read again only when one's size or mtime
+* changes, so a config loaded again (the ESLint plugin's and the MCP server's reloads) does not
+* read every dependency again.
+*/
+const manifests = /* @__PURE__ */ new Map();
+function cachedManifest(file) {
+	const stamp = fileStamp(file);
+	const cached = manifests.get(file);
+	if (cached?.stamp === stamp) return cached.json;
+	const json = readJson$1(file);
+	manifests.set(file, {
+		stamp,
+		json
+	});
+	return json;
+}
+/** A file's or folder's size and mtime, or `-` when it is missing. */
+function fileStamp(file) {
+	const stats = fs.statSync(file, { throwIfNoEntry: false });
+	return stats ? `${String(stats.mtimeMs)}:${String(stats.size)}` : "-";
+}
 /** `@acme/ui`, `@acme/ui-kit`, `@acme/design-system`, `acme-ui`; not `@acme/email-components`. */
 function isDesignSystemName(name) {
 	const base = name.slice(name.lastIndexOf("/") + 1);
 	return /^(?:ui|ui-kit|uikit|ui-react|react-ui|design-system|ds|components|primitives)$/.test(base) || /-(?:ui|ui-kit|design-system)$/.test(base);
 }
 /**
-* Locates workspace packages by name: through `node_modules` links up to the
-* workspace root, then by scanning the workspace's package globs.
+* Locates packages by name for one load: a project's config, its design-system package and
+* its detection share one. Workspace packages are found through `node_modules` links up to the
+* workspace root, then by the workspace's package globs ({@link find}); any dependency as
+* Node.js resolves it ({@link locate}).
 */
 var PackageFinder = class {
 	root;
 	byName;
+	/** The packages the package manager links: those its workspace globs list, without Nx's. */
+	linkable;
+	nodeModules;
+	realRoot;
+	workspace;
 	constructor(root) {
 		this.root = root;
 	}
@@ -1123,6 +1255,61 @@ var PackageFinder = class {
 		this.byName ??= scanWorkspace(this.root);
 		return this.byName.get(name);
 	}
+	/**
+	* Where `name` resolves for code in the root, as Node.js finds it: in the nearest
+	* `node_modules` at or above it that has it; else the workspace package of that name, in a
+	* checkout that is not installed (only then is the workspace scanned). With its package.json.
+	*/
+	locate(name) {
+		for (const nodeModules of this.nodeModulesDirs()) {
+			const dir = path.join(nodeModules, ...name.split("/"));
+			const json = cachedManifest(path.join(dir, "package.json"));
+			if (json) return {
+				dir,
+				json
+			};
+		}
+		this.linkable ??= scanWorkspace(this.root, false);
+		const dir = this.linkable.get(name);
+		const json = dir ? cachedManifest(path.join(dir, "package.json")) : void 0;
+		return dir && json ? {
+			dir,
+			json
+		} : void 0;
+	}
+	/**
+	* A located package at its real folder, expressed from the root as given: `installed` when
+	* that is in a `node_modules`, rather than a workspace package linked there, and the
+	* `boundary` its config's paths must stay in.
+	*/
+	place(located) {
+		this.realRoot ??= fs.realpathSync(this.root);
+		const real = path.relative(this.realRoot, fs.realpathSync(located));
+		const dir = path.resolve(this.root, real);
+		const installed = /(?:^|[\\/])node_modules[\\/]/.test(real);
+		return {
+			dir,
+			installed,
+			boundary: installed ? dir : this.boundaryOf(dir)
+		};
+	}
+	/** The `node_modules` folders at and above the root, nearest first, looked up once. */
+	nodeModulesDirs() {
+		if (!this.nodeModules) {
+			this.nodeModules = [];
+			for (let dir = path.resolve(this.root);; dir = path.dirname(dir)) {
+				const candidate = path.join(dir, "node_modules");
+				if (isDirectory$1(candidate)) this.nodeModules.push(candidate);
+				if (dir === path.dirname(dir)) break;
+			}
+		}
+		return this.nodeModules;
+	}
+	/** The workspace root when `dir` is in it, else `dir` itself. */
+	boundaryOf(dir) {
+		if (this.workspace === void 0) this.workspace = workspaceRootOf(this.root) ?? null;
+		return this.workspace !== null && isInside(this.workspace, dir) ? this.workspace : dir;
+	}
 };
 /**
 * A monorepo root: a pnpm-workspace.yaml, `workspaces` in package.json (npm, Yarn, Bun),
@@ -1132,28 +1319,65 @@ var PackageFinder = class {
 function isWorkspaceRoot(dir) {
 	if (fs.existsSync(path.join(dir, "pnpm-workspace.yaml"))) return true;
 	if (fs.existsSync(path.join(dir, "nx.json"))) return true;
-	const pkg = readJson(path.join(dir, "package.json"));
+	const pkg = readJson$1(path.join(dir, "package.json"));
 	if (pkg !== void 0 && pkg.workspaces !== void 0) return true;
-	return Array.isArray(readJson(path.join(dir, "lerna.json"))?.packages);
+	return Array.isArray(readJson$1(path.join(dir, "lerna.json"))?.packages);
 }
-/** Package name → directory for every package the workspace declares. */
-function scanWorkspace(start) {
-	const packages = /* @__PURE__ */ new Map();
-	let workspaceRoot;
+/** The nearest workspace root at or above `start`. */
+function workspaceRootOf(start) {
 	for (let dir = start;; dir = path.dirname(dir)) {
-		if (isWorkspaceRoot(dir)) {
-			workspaceRoot = dir;
-			break;
-		}
-		if (dir === path.dirname(dir)) break;
+		if (isWorkspaceRoot(dir)) return dir;
+		if (dir === path.dirname(dir)) return void 0;
 	}
-	if (!workspaceRoot) return packages;
-	for (const dir of workspacePackageDirs(workspaceRoot)) {
-		const name = readJson(path.join(dir, "package.json"))?.name;
+}
+/** What a workspace root declares its packages in, and Nx's marker. */
+const WORKSPACE_MANIFESTS = [
+	"pnpm-workspace.yaml",
+	"package.json",
+	"lerna.json",
+	"nx.json"
+];
+/**
+* Workspace maps by workspace root (with Nx's projects or not), kept for the next load in the
+* same process (a monorepo root's projects, the ESLint plugin's and the MCP server's reloads)
+* while the files they were read from keep their size and mtime: the root's manifests, each
+* package's package.json, the folders the packages are in and the folders the package globs
+* start from. A package added to one of those folders, or a manifest edited, makes the next
+* load read the workspace again.
+*/
+const workspaceMaps = /* @__PURE__ */ new Map();
+/**
+* Package name → directory for every package the workspace declares, with Nx's projects
+* unless `nx` is false.
+*/
+function scanWorkspace(start, nx = true) {
+	const workspaceRoot = workspaceRootOf(start);
+	if (!workspaceRoot) return /* @__PURE__ */ new Map();
+	const key = `${workspaceRoot}\0${String(nx)}`;
+	const cached = workspaceMaps.get(key);
+	if (cached && stampOf(cached.watched) === cached.stamp) return cached.packages;
+	const before = [...WORKSPACE_MANIFESTS.map((name) => path.join(workspaceRoot, name)), ...workspacePatterns(workspaceRoot).include.map((p) => path.resolve(workspaceRoot, globBase(`${p}/package.json`)))];
+	const stamps = new Map(before.map((file) => [file, fileStamp(file)]));
+	const packages = /* @__PURE__ */ new Map();
+	const dirs = workspacePackageDirs(workspaceRoot, nx);
+	for (const dir of dirs) {
+		const manifest = path.join(dir, "package.json");
+		stamps.set(manifest, fileStamp(manifest));
+		if (!stamps.has(path.dirname(dir))) stamps.set(path.dirname(dir), fileStamp(path.dirname(dir)));
+		const name = readJson$1(manifest)?.name;
 		if (typeof name === "string" && !packages.has(name)) packages.set(name, dir);
 	}
+	const watched = [...stamps.keys()];
+	workspaceMaps.set(key, {
+		stamp: watched.map((file) => stamps.get(file)).join("|"),
+		watched,
+		packages
+	});
 	return packages;
 }
+function stampOf(files) {
+	return files.map(fileStamp).join("|");
+}
 /**
 * `packages` from pnpm-workspace.yaml, `workspaces` from package.json (npm, Yarn, Bun), or
 * `packages` from lerna.json, in that order of precedence.
@@ -1166,10 +1390,10 @@ function workspacePatterns(dir) {
 	});
 	const yaml = path.join(dir, "pnpm-workspace.yaml");
 	if (fs.existsSync(yaml)) return split(pnpmPackages(fs.readFileSync(yaml, "utf8")), "pnpm-workspace.yaml");
-	const workspaces = readJson(path.join(dir, "package.json"))?.workspaces;
+	const workspaces = readJson$1(path.join(dir, "package.json"))?.workspaces;
 	const list = Array.isArray(workspaces) ? workspaces : asRecord(workspaces).packages;
 	if (Array.isArray(list)) return split(list.filter((p) => typeof p === "string"), "package.json workspaces");
-	const lerna = readJson(path.join(dir, "lerna.json"))?.packages;
+	const lerna = readJson$1(path.join(dir, "lerna.json"))?.packages;
 	if (Array.isArray(lerna)) return split(lerna.filter((p) => typeof p === "string"), "lerna.json");
 	return {
 		include: [],
@@ -1184,7 +1408,7 @@ const NOT_PACKAGES = ["**/node_modules/**", "**/.git/**"];
 * package globs match that hold a package.json, and with an nx.json, every folder with an
 * Nx project.json.
 */
-function workspacePackageDirs(root) {
+function workspacePackageDirs(root, nx = true) {
 	const { include, exclude } = workspacePatterns(root);
 	const ignore = [...NOT_PACKAGES, ...exclude];
 	const dirs = include.length ? globSync(include.map((p) => `${p}/package.json`), {
@@ -1192,7 +1416,7 @@ function workspacePackageDirs(root) {
 		absolute: true,
 		ignore
 	}).map((manifest) => path.dirname(manifest)) : [];
-	if (fs.existsSync(path.join(root, "nx.json"))) {
+	if (nx && fs.existsSync(path.join(root, "nx.json"))) {
 		const projects = globSync("**/project.json", {
 			cwd: root,
 			absolute: true,
@@ -1229,7 +1453,7 @@ function pnpmPackages(text) {
 	}
 	return items.filter(Boolean);
 }
-function readJson(file) {
+function readJson$1(file) {
 	try {
 		const value = JSON.parse(fs.readFileSync(file, "utf8"));
 		return value && typeof value === "object" && !Array.isArray(value) ? value : void 0;
@@ -1255,6 +1479,532 @@ function isDirectory$1(dir) {
 	}
 }
 //#endregion
+//#region src/tokens/color.ts
+const toOklch$1 = converter("oklch");
+/**
+* Euclidean distance in OKLCH with hue handled as an angle, which is ΔE in
+* OKLab: perceptually uniform, so "nearest token" means nearest to the eye.
+*/
+const okDistance = differenceEuclidean("oklch");
+const KEYWORDS = /* @__PURE__ */ new Set([
+	"transparent",
+	"currentcolor",
+	"inherit",
+	"initial",
+	"unset",
+	"revert",
+	"revert-layer",
+	"none"
+]);
+/**
+* HSL channels without the function, `214.3 31.8% 91.4%` (commas, `deg` and
+* `/ alpha` allowed): how Tailwind v3 projects, and shadcn/ui before v4, store
+* colors, to be used as `hsl(var(--border))`.
+*/
+const BARE_HSL = /^(-?\d*\.?\d+)(deg)?(?:\s*,\s*|\s+)(\d*\.?\d+)%(?:\s*,\s*|\s+)(\d*\.?\d+)%(?:\s*\/\s*(\d*\.?\d+%?))?$/;
+function isBareHsl(value) {
+	return BARE_HSL.test(value.trim());
+}
+/**
+* Parses any CSS color (hex, rgb(), hsl(), oklch(), named, ...) into OKLCH.
+* With `bareHsl`, for token values, HSL channels count too: in a stylesheet
+* they can only be a color, while in a class or style they are not one.
+*/
+function parseColor(value, options = {}) {
+	const text = value.trim();
+	if (!text || KEYWORDS.has(text.toLowerCase()) || text.includes("var(")) return void 0;
+	let parsed = parse(text);
+	const hsl = !parsed && options.bareHsl ? BARE_HSL.exec(text) : null;
+	if (hsl) {
+		const [, h, deg = "", s, l, alpha] = hsl;
+		parsed = parse(`hsl(${h}${deg} ${s}% ${l}%${alpha ? ` / ${alpha}` : ""})`);
+	}
+	return parsed ? toOklch$1(parsed) : void 0;
+}
+function colorDistance(a, b) {
+	return okDistance(a, b);
+}
+function isNamedColor(value) {
+	return Object.hasOwn(colorsNamed, value.toLowerCase());
+}
+/** Color literals inside arbitrary CSS text: hex (not `url(#id)` references) and color functions. */
+const COLOR_LITERAL = /(?<!url\(\s*["']?)#(?:[0-9a-fA-F]{8}|[0-9a-fA-F]{6}|[0-9a-fA-F]{3,4})(?![0-9a-zA-Z_-])|\b(?:rgba?|hsla?|hwb|lab|lch|oklab|oklch|color)\([^()]*(?:\([^()]*\)[^()]*)*\)/g;
+/** Finds hex and functional color literals in `text` (named colors are not matched). */
+function findColorLiterals(text) {
+	const matches = [];
+	for (const match of text.matchAll(COLOR_LITERAL)) {
+		const color = parseColor(match[0]);
+		if (color) matches.push({
+			text: match[0],
+			index: match.index,
+			color
+		});
+	}
+	return matches;
+}
+/**
+* Chroma from which a color reads as a hue at any lightness. Tailwind's grays,
+* slate to taupe, stay below 0.046; its colors pass 0.05 by shade 200.
+*/
+const TINT_CHROMA = .05;
+/**
+* Pale colors have little chroma to give, so below TINT_CHROMA a light color's
+* hue is told by its chroma relative to the most sRGB allows at that lightness
+* and hue. `#fef2f2` (red-50) has 0.013 of a possible 0.014; Tailwind's light
+* grays reach at most 0.44 of theirs (slate-100), its palest hues start at
+* 0.64 (teal-50). Near black the measure says little (slate-950 and shadcn's
+* v3 dark background would read as blue), so it applies from TINT_LIGHTNESS up.
+*/
+const TINT_RELATIVE = .55;
+const TINT_LIGHTNESS = .7;
+/** Below this chroma the hue angle is rounding noise. */
+const MIN_CHROMA = .005;
+const maxChromas = /* @__PURE__ */ new Map();
+/** The highest chroma sRGB can show at this lightness and hue. */
+function maxChroma(l, h) {
+	const key = `${l.toFixed(3)}:${h.toFixed(1)}`;
+	let max = maxChromas.get(key);
+	if (max === void 0) {
+		max = clampChroma({
+			mode: "oklch",
+			l: Math.min(1, Math.max(0, l)),
+			c: .4,
+			h
+		}, "oklch").c;
+		maxChromas.set(key, max);
+	}
+	return max;
+}
+/** Whether a color reads as a hue rather than a gray, however pale or dark it is. */
+function isTinted(color) {
+	if (color.c >= TINT_CHROMA) return true;
+	if (color.c < MIN_CHROMA || color.h === void 0 || color.l < TINT_LIGHTNESS) return false;
+	const max = maxChroma(color.l, color.h);
+	return max > 0 && color.c / max >= TINT_RELATIVE;
+}
+/** The angle between two hues, 0–180°; 0 when either is a gray. */
+function hueDistance(a, b) {
+	if (a.h === void 0 || b.h === void 0) return 0;
+	const diff = Math.abs(a.h - b.h) % 360;
+	return Math.min(diff, 360 - diff);
+}
+/**
+* Whether `token` can stand in for `color` without changing what it is: both
+* grays, or both hues within `tolerance`. ΔE alone does not say it: a pale
+* yellow is 0.07 from a light gray. `tinted` overrides the test for the source,
+* so a pale `bg-sky-50` counts as blue whatever its chroma.
+*/
+function sameHue(color, token, tinted = isTinted(color), tolerance = 15) {
+	if (tinted !== isTinted(token)) return false;
+	return !tinted || hueDistance(color, token) <= tolerance;
+}
+/** Formats a ΔE value the way it reads best in a diagnostic. */
+function formatDeltaE(deltaE) {
+	return deltaE < 5e-4 ? "exact match" : `ΔE ${deltaE.toFixed(3)}`;
+}
+//#endregion
+//#region src/libraries/mui.ts
+/** The palette groups MUI's components take as a `color` value (`<Button color="primary">`). */
+const ROLES = /* @__PURE__ */ new Set([
+	"primary",
+	"secondary",
+	"error",
+	"warning",
+	"info",
+	"success"
+]);
+/** Palette keys that are settings, not colors. */
+const SETTINGS = /* @__PURE__ */ new Set([
+	"mode",
+	"contrastThreshold",
+	"tonalOffset",
+	"augmentColor",
+	"getContrastText"
+]);
+/** Functions that build an MUI theme from an options object. */
+const THEME_CALLS = /^(?:createTheme|extendTheme|experimental_extendTheme|createMuiTheme)$/;
+/**
+* MUI (`@mui/material`): components from its type declarations, and tokens from the theme the
+* app creates with `createTheme`, where its values are written out.
+*/
+const mui = {
+	id: "mui",
+	package: "@mui/material",
+	title: "MUI",
+	augments: /declare\s+module\s+['"]@mui\/(?:material|system|types)(?:\/[\w./-]*)?['"]/,
+	describe: describeMui,
+	annotate(component) {
+		if (component.name === "Tooltip") component.labelsChild = {
+			prop: "title",
+			unless: "describeChild"
+		};
+	},
+	theme: {
+		matches: /\b(?:createTheme|extendTheme|experimental_extendTheme|createMuiTheme)\s*\(|\bmain\s*:|\bvariants\s*:/,
+		read: readThemes
+	}
+};
+/** The keys of a palette color group: `teal: { light, main, dark, contrastText }`. */
+const SHADES = /^(?:light|main|dark|contrastText|lighter|darker|A?\d{2,3})$/;
+/**
+* MUI's JSDoc lists demos and API pages rather than describing the component: keep any prose,
+* then the demo titles and the API page, which also feed search.
+*/
+function describeMui(jsdoc) {
+	const [prose = "", rest = ""] = jsdoc.split(/^Demos:\s*$/m);
+	const demos = [...(rest.split(/^API:\s*$/m)[0] ?? "").matchAll(/^- \[([^\]]+)\]\(/gm)].map((m) => m[1]);
+	const api = /\[[^\]]+ API\]\((https:[^)\s]+)\)/.exec(rest)?.[1];
+	const parts = [
+		prose.trim(),
+		demos.length ? `Demos: ${demos.join(", ")}.` : "",
+		api ? `API: ${api}` : ""
+	].filter(Boolean);
+	return parts.length ? parts.join("\n\n") : void 0;
+}
+/** Tests, stories, mocks and fixtures: themes there are not the app's. */
+const NOT_THE_APP = /(?:^|\/)[^/]*(?:test|spec|stor(?:y|ies)|mock|fixture)[^/]*(?:\/|$)/i;
+/**
+* Tokens from the options objects passed to `createTheme` (or `extendTheme`) in `files`:
+* palette colors (`primary.main`, `background.paper`, `divider`) with their dark values from
+* `colorSchemes.dark`, and the spacing unit, border radius and font family. Values written as
+* literals are read, through constants of the same file or imported from another of the app's
+* files by a relative path; anything computed is left out. Nothing runs. Tests, stories and
+* their helpers are skipped: a theme there is not the app's.
+*/
+function readThemes(files, root) {
+	const tokens = /* @__PURE__ */ new Map();
+	const values = [];
+	const scopes = new Scopes(root);
+	for (const { file, text } of files) {
+		const rel = relativePath(root, file);
+		if (NOT_THE_APP.test(rel)) continue;
+		const scope = scopes.of(file, text);
+		if (!scope) continue;
+		const visit = (node) => {
+			if (ts.isCallExpression(node) && THEME_CALLS.test(calleeName(node.expression) ?? "")) {
+				const [first] = node.arguments;
+				const literal = object(first ? scopes.evaluate(first, scope, 0) : void 0);
+				if (literal) {
+					const line = scope.source.getLineAndCharacterOfPosition(node.getStart(scope.source)).line + 1;
+					for (const token of themeTokens(literal, {
+						file: rel,
+						line
+					})) if (!tokens.has(token.name)) tokens.set(token.name, token);
+				}
+			}
+			if (ts.isPropertyAssignment(node) && ts.isObjectLiteralExpression(node.initializer)) values.push(...addedValues(node.name, node.initializer));
+			ts.forEachChild(node, visit);
+		};
+		visit(scope.source);
+	}
+	return {
+		tokens: [...tokens.values()],
+		warnings: [],
+		values,
+		files: scopes.read()
+	};
+}
+/**
+* Values a theme adds, whether or not its options can be read: a palette group
+* (`teal: { main: …, dark: … }`) makes `teal` a color of every component's `color`, and a
+* component's `variants: [{ props: { variant: "dashed" } }]` (under `MuiButton`) a value of
+* that prop. Over-reading only allows more; it never reports anything.
+*/
+function addedValues(name, value) {
+	const key = keyOf(name);
+	if (key === void 0) return [];
+	const keys = value.properties.map((p) => p.name ? keyOf(p.name) : void 0);
+	if (keys.includes("main") && keys.every((k) => k !== void 0 && SHADES.test(k))) return [{
+		prop: "color",
+		value: key,
+		alongside: "primary"
+	}];
+	const component = /^Mui([A-Z]\w*)$/.exec(key)?.[1];
+	if (!component) return [];
+	const found = [];
+	const visit = (node) => {
+		if (ts.isPropertyAssignment(node) && keyOf(node.name) === "props" && ts.isObjectLiteralExpression(node.initializer)) {
+			for (const prop of node.initializer.properties) {
+				if (!ts.isPropertyAssignment(prop) || !ts.isStringLiteralLike(prop.initializer)) continue;
+				const propName = keyOf(prop.name);
+				if (propName) found.push({
+					component,
+					prop: propName,
+					value: prop.initializer.text
+				});
+			}
+			return;
+		}
+		ts.forEachChild(node, visit);
+	};
+	visit(value);
+	return found;
+}
+function calleeName(expression) {
+	if (ts.isIdentifier(expression)) return expression.text;
+	if (ts.isPropertyAccessExpression(expression)) return expression.name.text;
+}
+const SCRIPT_EXTENSIONS = [
+	".ts",
+	".tsx",
+	".js",
+	".jsx",
+	".mjs",
+	".cjs",
+	".mts",
+	".cts"
+];
+/** The app's files a theme reads from, each parsed once. */
+var Scopes = class {
+	root;
+	scopes = /* @__PURE__ */ new Map();
+	constructor(root) {
+		this.root = root;
+	}
+	/** The files read beyond those passed in: the modules a theme imports. */
+	read() {
+		return [...this.scopes.keys()];
+	}
+	of(file, text) {
+		const known = this.scopes.get(file);
+		if (known !== void 0) return known ?? void 0;
+		let scope;
+		try {
+			scope = scopeOf(file, ts.createSourceFile(file, text ?? fs.readFileSync(file, "utf8"), ts.ScriptTarget.Latest, true, scriptKind$1(file)));
+		} catch {
+			scope = null;
+		}
+		this.scopes.set(file, scope);
+		return scope ?? void 0;
+	}
+	/** A literal value, following constants and relative imports; undefined for anything computed. */
+	evaluate(node, scope, depth) {
+		if (depth > 24) return void 0;
+		const next = (n, s = scope) => this.evaluate(n, s, depth + 1);
+		if (ts.isParenthesizedExpression(node) || ts.isAsExpression(node) || ts.isSatisfiesExpression(node) || ts.isNonNullExpression(node)) return next(node.expression);
+		if (ts.isStringLiteral(node) || ts.isNoSubstitutionTemplateLiteral(node)) return node.text;
+		if (ts.isNumericLiteral(node)) return Number(node.text);
+		if (node.kind === ts.SyntaxKind.TrueKeyword) return true;
+		if (node.kind === ts.SyntaxKind.FalseKeyword) return false;
+		if (ts.isIdentifier(node)) return this.binding(node.text, scope, depth);
+		if (ts.isPropertyAccessExpression(node)) return member(next(node.expression), node.name.text);
+		if (ts.isElementAccessExpression(node)) {
+			const key = next(node.argumentExpression);
+			return typeof key === "string" || typeof key === "number" ? member(next(node.expression), String(key)) : void 0;
+		}
+		if (ts.isArrayLiteralExpression(node)) return node.elements.map((element) => next(element));
+		if (ts.isObjectLiteralExpression(node)) {
+			const result = {};
+			for (const property of node.properties) if (ts.isPropertyAssignment(property)) {
+				const key = keyOf(property.name);
+				if (key !== void 0) result[key] = next(property.initializer);
+			} else if (ts.isShorthandPropertyAssignment(property)) result[property.name.text] = next(property.name);
+			else if (ts.isSpreadAssignment(property)) {
+				const spread = object(next(property.expression));
+				if (spread) Object.assign(result, spread);
+			}
+			return result;
+		}
+	}
+	/** The value of a name in a scope: one of its constants, or what it imports by that name. */
+	binding(name, scope, depth) {
+		const constant = scope.constants.get(name);
+		if (constant) return this.evaluate(constant, scope, depth + 1);
+		const imported = scope.imports.get(name);
+		if (!imported) return void 0;
+		const target = this.resolve(imported.specifier, scope.file);
+		const module = target ? this.of(target) : void 0;
+		const local = module?.exports.get(imported.name);
+		return module && local ? this.binding(local, module, depth + 1) : void 0;
+	}
+	/** A relative import's file, among the app's own files. */
+	resolve(specifier, from) {
+		if (!specifier.startsWith(".")) return void 0;
+		const base = path.resolve(path.dirname(from), specifier);
+		if (!isInside(this.root, base) || /[\\/]node_modules[\\/]/.test(base)) return void 0;
+		const stem = base.replace(/\.[cm]?js$/, "");
+		for (const candidate of [
+			base,
+			...SCRIPT_EXTENSIONS.map((ext) => `${stem}${ext}`),
+			...SCRIPT_EXTENSIONS.map((ext) => path.join(base, `index${ext}`))
+		]) if (fs.existsSync(candidate) && fs.statSync(candidate).isFile()) return candidate;
+	}
+};
+function scriptKind$1(file) {
+	if (/\.tsx$/.test(file)) return ts.ScriptKind.TSX;
+	if (/\.jsx$/.test(file)) return ts.ScriptKind.JSX;
+	if (/\.[cm]?js$/.test(file)) return ts.ScriptKind.JS;
+	return ts.ScriptKind.TS;
+}
+function scopeOf(file, source) {
+	const scope = {
+		file,
+		source,
+		constants: /* @__PURE__ */ new Map(),
+		imports: /* @__PURE__ */ new Map(),
+		exports: /* @__PURE__ */ new Map()
+	};
+	for (const statement of source.statements) if (ts.isImportDeclaration(statement) && ts.isStringLiteral(statement.moduleSpecifier)) {
+		const specifier = statement.moduleSpecifier.text;
+		const clause = statement.importClause;
+		if (clause?.name) scope.imports.set(clause.name.text, {
+			specifier,
+			name: "default"
+		});
+		const bindings = clause?.namedBindings;
+		if (bindings && ts.isNamedImports(bindings)) for (const element of bindings.elements) scope.imports.set(element.name.text, {
+			specifier,
+			name: (element.propertyName ?? element.name).text
+		});
+	} else if (ts.isVariableStatement(statement)) {
+		const list = statement.declarationList;
+		if (!(list.flags & ts.NodeFlags.Const)) continue;
+		const exported = statement.modifiers?.some((m) => m.kind === ts.SyntaxKind.ExportKeyword);
+		for (const declaration of list.declarations) {
+			if (!ts.isIdentifier(declaration.name) || !declaration.initializer) continue;
+			scope.constants.set(declaration.name.text, declaration.initializer);
+			if (exported) scope.exports.set(declaration.name.text, declaration.name.text);
+		}
+	} else if (ts.isExportDeclaration(statement) && !statement.moduleSpecifier) {
+		const clause = statement.exportClause;
+		if (clause && ts.isNamedExports(clause)) for (const element of clause.elements) scope.exports.set(element.name.text, (element.propertyName ?? element.name).text);
+	} else if (ts.isExportAssignment(statement) && !statement.isExportEquals) {
+		if (ts.isIdentifier(statement.expression)) scope.exports.set("default", statement.expression.text);
+		else {
+			scope.constants.set("default", statement.expression);
+			scope.exports.set("default", "default");
+		}
+	}
+	return scope;
+}
+/** A property of an object read so far (`neonBlue[400]`, `palette.primary`). */
+function member(value, key) {
+	if (Array.isArray(value)) return /^\d+$/.test(key) ? value[Number(key)] : void 0;
+	return object(value)?.[key];
+}
+function keyOf(name) {
+	if (ts.isIdentifier(name) || ts.isStringLiteral(name) || ts.isNumericLiteral(name)) return name.text;
+}
+function object(value) {
+	return value && typeof value === "object" && !Array.isArray(value) ? value : void 0;
+}
+/** The colors of a palette, by path: `primary.main`, `background.paper`, `divider`. */
+function paletteColors(palette) {
+	const colors = /* @__PURE__ */ new Map();
+	for (const [key, value] of Object.entries(palette ?? {})) {
+		if (SETTINGS.has(key)) continue;
+		if (typeof value === "string") {
+			if (parseColor(value)) colors.set(key, value);
+			continue;
+		}
+		for (const [shade, color] of Object.entries(object(value) ?? {})) if (typeof color === "string" && parseColor(color)) colors.set(`${key}.${shade}`, color);
+	}
+	return colors;
+}
+function themeTokens(options, source) {
+	const tokens = [];
+	const schemes = object(options.colorSchemes);
+	const light = paletteColors(object(object(schemes?.light)?.palette) ?? object(options.palette));
+	const dark = paletteColors(object(object(schemes?.dark)?.palette));
+	const variables = options.cssVariables !== void 0 && options.cssVariables !== false;
+	const add = (name, category, value, usage) => tokens.push({
+		name,
+		category,
+		value,
+		usage,
+		source,
+		description: "From the MUI theme."
+	});
+	for (const name of /* @__PURE__ */ new Set([...light.keys(), ...dark.keys()])) {
+		const value = light.get(name) ?? dark.get(name) ?? "";
+		const [group = name, shade] = name.split(".");
+		const key = group === "background" ? "bgcolor" : group === "divider" ? "borderColor" : "color";
+		add(name, "color", value, [
+			...ROLES.has(group) && shade === "main" ? [`color="${group}"`] : [],
+			`sx={{ ${key}: '${name}' }}`,
+			`theme.palette.${name}`
+		]);
+		const token = tokens.at(-1);
+		if (!token) continue;
+		if (variables) token.cssVar = `--mui-palette-${name.replace(/\./g, "-")}`;
+		const darkValue = dark.get(name);
+		if (darkValue !== void 0 && light.has(name) && darkValue !== value) token.modes = { dark: darkValue };
+	}
+	const spacing = options.spacing;
+	if (typeof spacing === "number" || typeof spacing === "string") add("spacing", "spacing", typeof spacing === "number" ? `${spacing}px` : spacing, ["theme.spacing(1)", "sx={{ p: 1 }}"]);
+	const radius = object(options.shape)?.borderRadius;
+	if (typeof radius === "number" || typeof radius === "string") add("shape.borderRadius", "radius", typeof radius === "number" ? `${radius}px` : radius, ["theme.shape.borderRadius", "sx={{ borderRadius: 1 }}"]);
+	const family = object(options.typography)?.fontFamily;
+	if (typeof family === "string") add("typography.fontFamily", "typography", family, ["theme.typography.fontFamily"]);
+	for (const token of tokens) token.origin = "library";
+	return tokens;
+}
+//#endregion
+//#region src/libraries/index.ts
+/** The ids of the libraries onsystem can read, for the config's `libraries` list. */
+const LIBRARY_IDS = ["mui"];
+/** The libraries onsystem can read, by package. */
+const LIBRARIES = [mui];
+function libraryAdapter(name) {
+	return LIBRARIES.find((library) => library.package === name);
+}
+/**
+* The libraries `root`'s package.json depends on (dependencies, devDependencies or
+* peerDependencies), each found where Node.js would find it: in `node_modules` at the root or a
+* folder above it, as a monorepo hoists it. Nothing in the package is run. `ids` is the config's
+* `libraries`: undefined reads every library onsystem supports, false none, a list those named;
+* the dependencies it leaves out are `off`.
+*/
+function detectLibraries(root, ids) {
+	const pkg = readJson(path.join(root, "package.json"));
+	if (!pkg) return {
+		read: [],
+		off: []
+	};
+	const dependencies = new Set([
+		"dependencies",
+		"devDependencies",
+		"peerDependencies"
+	].flatMap((field) => {
+		const value = pkg[field];
+		return value && typeof value === "object" ? Object.keys(value) : [];
+	}));
+	const found = LIBRARIES.filter((library) => dependencies.has(library.package)).map((library) => {
+		const dir = installedPackage(root, library.package);
+		const version = dir ? readJson(path.join(dir, "package.json"))?.version : void 0;
+		const source = {
+			package: library.package,
+			dir,
+			version: typeof version === "string" ? version : void 0
+		};
+		return {
+			id: library.id,
+			source
+		};
+	});
+	const wanted = (id) => ids === void 0 || ids !== false && ids.includes(id);
+	return {
+		read: found.filter((f) => wanted(f.id)).map((f) => f.source),
+		off: found.filter((f) => !wanted(f.id)).map((f) => f.source)
+	};
+}
+/** The folder `name` is installed in for code in `root`, looking up through `node_modules` folders. */
+function installedPackage(root, name) {
+	for (let dir = path.resolve(root);; dir = path.dirname(dir)) {
+		const candidate = path.join(dir, "node_modules", ...name.split("/"));
+		if (fs.existsSync(path.join(candidate, "package.json"))) return candidate;
+		if (dir === path.dirname(dir)) return void 0;
+	}
+}
+function readJson(file) {
+	try {
+		const value = JSON.parse(fs.readFileSync(file, "utf8"));
+		return value && typeof value === "object" ? value : void 0;
+	} catch {
+		return;
+	}
+}
+//#endregion
 //#region src/extract/cva.ts
 const FACTORIES = /* @__PURE__ */ new Set(["cva", "tv"]);
 /** Finds every `const x = cva(base, { variants, defaultVariants })` in a file. */
@@ -1386,129 +2136,102 @@ function classText(node) {
 	visit(node);
 	return parts.join(" ").replace(/\s+/g, " ").trim();
 }
-//#endregion
-//#region src/tokens/color.ts
-const toOklch = converter("oklch");
-/**
-* Euclidean distance in OKLCH with hue handled as an angle, which is ΔE in
-* OKLab: perceptually uniform, so "nearest token" means nearest to the eye.
-*/
-const okDistance = differenceEuclidean("oklch");
-const KEYWORDS = /* @__PURE__ */ new Set([
-	"transparent",
-	"currentcolor",
-	"inherit",
-	"initial",
-	"unset",
-	"revert",
-	"revert-layer",
-	"none"
-]);
-/**
-* HSL channels without the function, `214.3 31.8% 91.4%` (commas, `deg` and
-* `/ alpha` allowed): how Tailwind v3 projects, and shadcn/ui before v4, store
-* colors, to be used as `hsl(var(--border))`.
-*/
-const BARE_HSL = /^(-?\d*\.?\d+)(deg)?(?:\s*,\s*|\s+)(\d*\.?\d+)%(?:\s*,\s*|\s+)(\d*\.?\d+)%(?:\s*\/\s*(\d*\.?\d+%?))?$/;
-function isBareHsl(value) {
-	return BARE_HSL.test(value.trim());
-}
-/**
-* Parses any CSS color (hex, rgb(), hsl(), oklch(), named, ...) into OKLCH.
-* With `bareHsl`, for token values, HSL channels count too: in a stylesheet
-* they can only be a color, while in a class or style they are not one.
-*/
-function parseColor(value, options = {}) {
-	const text = value.trim();
-	if (!text || KEYWORDS.has(text.toLowerCase()) || text.includes("var(")) return void 0;
-	let parsed = parse(text);
-	const hsl = !parsed && options.bareHsl ? BARE_HSL.exec(text) : null;
-	if (hsl) {
-		const [, h, deg = "", s, l, alpha] = hsl;
-		parsed = parse(`hsl(${h}${deg} ${s}% ${l}%${alpha ? ` / ${alpha}` : ""})`);
-	}
-	return parsed ? toOklch(parsed) : void 0;
-}
-function colorDistance(a, b) {
-	return okDistance(a, b);
-}
-function isNamedColor(value) {
-	return Object.hasOwn(colorsNamed, value.toLowerCase());
+const LENGTH = /^(-?(?:\d+\.?\d*|\.\d+))(px|rem|em)?$/i;
+/** `"0.5rem"` → 8, `"12px"` → 12, `"4"` → 4. Returns undefined for anything else. */
+function lengthToPx(value) {
+	if (typeof value === "number") return Number.isFinite(value) ? value : void 0;
+	const match = LENGTH.exec(value.trim());
+	if (!match) return void 0;
+	const n = Number(match[1]);
+	return (match[2] ?? "px").toLowerCase() === "px" ? n : n * 16;
 }
-/** Color literals inside arbitrary CSS text: hex (not `url(#id)` references) and color functions. */
-const COLOR_LITERAL = /(?<!url\(\s*["']?)#(?:[0-9a-fA-F]{8}|[0-9a-fA-F]{6}|[0-9a-fA-F]{3,4})(?![0-9a-zA-Z_-])|\b(?:rgba?|hsla?|hwb|lab|lch|oklab|oklch|color)\([^()]*(?:\([^()]*\)[^()]*)*\)/g;
-/** Finds hex and functional color literals in `text` (named colors are not matched). */
-function findColorLiterals(text) {
-	const matches = [];
-	for (const match of text.matchAll(COLOR_LITERAL)) {
-		const color = parseColor(match[0]);
-		if (color) matches.push({
-			text: match[0],
-			index: match.index,
-			color
-		});
-	}
-	return matches;
+function formatPx(px) {
+	return `${Number(px.toFixed(2))}px`;
 }
 /**
-* Chroma from which a color reads as a hue at any lightness. Tailwind's grays,
-* slate to taupe, stay below 0.046; its colors pass 0.05 by shade 200.
-*/
-const TINT_CHROMA = .05;
-/**
-* Pale colors have little chroma to give, so below TINT_CHROMA a light color's
-* hue is told by its chroma relative to the most sRGB allows at that lightness
-* and hue. `#fef2f2` (red-50) has 0.013 of a possible 0.014; Tailwind's light
-* grays reach at most 0.44 of theirs (slate-100), its palest hues start at
-* 0.64 (teal-50). Near black the measure says little (slate-950 and shadcn's
-* v3 dark background would read as blue), so it applies from TINT_LIGHTNESS up.
+* Evaluates a length that may use `var()` and `calc()` to px:
+* `calc(var(--radius) - 4px)` with `--radius: 0.625rem` → 6.
 */
-const TINT_RELATIVE = .55;
-const TINT_LIGHTNESS = .7;
-/** Below this chroma the hue angle is rounding noise. */
-const MIN_CHROMA = .005;
-const maxChromas = /* @__PURE__ */ new Map();
-/** The highest chroma sRGB can show at this lightness and hue. */
-function maxChroma(l, h) {
-	const key = `${l.toFixed(3)}:${h.toFixed(1)}`;
-	let max = maxChromas.get(key);
-	if (max === void 0) {
-		max = clampChroma({
-			mode: "oklch",
-			l: Math.min(1, Math.max(0, l)),
-			c: .4,
-			h
-		}, "oklch").c;
-		maxChromas.set(key, max);
-	}
-	return max;
-}
-/** Whether a color reads as a hue rather than a gray, however pale or dark it is. */
-function isTinted(color) {
-	if (color.c >= TINT_CHROMA) return true;
-	if (color.c < MIN_CHROMA || color.h === void 0 || color.l < TINT_LIGHTNESS) return false;
-	const max = maxChroma(color.l, color.h);
-	return max > 0 && color.c / max >= TINT_RELATIVE;
+function evaluateLength(value, resolve, depth = 0) {
+	if (depth > 16) return void 0;
+	const expanded = expandVars(value.trim(), resolve, depth);
+	if (expanded === void 0) return void 0;
+	const direct = lengthToPx(expanded);
+	if (direct !== void 0) return direct;
+	const calc = /^calc\((.*)\)$/is.exec(expanded);
+	return calc?.[1] !== void 0 ? evaluateCalc(calc[1]) : void 0;
 }
-/** The angle between two hues, 0–180°; 0 when either is a gray. */
-function hueDistance(a, b) {
-	if (a.h === void 0 || b.h === void 0) return 0;
-	const diff = Math.abs(a.h - b.h) % 360;
-	return Math.min(diff, 360 - diff);
+function expandVars(value, resolve, depth) {
+	let out = "";
+	let last = 0;
+	for (const match of value.matchAll(/var\(\s*(--[\w-]+)\s*(?:,\s*([^)]+))?\)/g)) {
+		const [whole, name = "", fallback] = match;
+		const resolved = resolve(name) ?? fallback;
+		const px = resolved === void 0 ? void 0 : evaluateLength(resolved, resolve, depth + 1);
+		if (px === void 0) return void 0;
+		out += `${value.slice(last, match.index)}${px}px`;
+		last = match.index + whole.length;
+	}
+	return out + value.slice(last);
 }
+const CALC_TOKEN = /-?(?:\d+\.?\d*|\.\d+)(?:px|rem|em)?|[()+\-*/]|calc/gi;
 /**
-* Whether `token` can stand in for `color` without changing what it is: both
-* grays, or both hues within `tolerance`. ΔE alone does not say it: a pale
-* yellow is 0.07 from a light gray. `tinted` overrides the test for the source,
-* so a pale `bg-sky-50` counts as blue whatever its chroma.
-*/
-function sameHue(color, token, tinted = isTinted(color), tolerance = 15) {
-	if (tinted !== isTinted(token)) return false;
-	return !tinted || hueDistance(color, token) <= tolerance;
-}
-/** Formats a ΔE value the way it reads best in a diagnostic. */
-function formatDeltaE(deltaE) {
-	return deltaE < 5e-4 ? "exact match" : `ΔE ${deltaE.toFixed(3)}`;
+* Tiny recursive-descent evaluator for `+ - * /` over px/rem/em/unitless
+* numbers. Anything else (`%`, `vw`, `ch`, functions) has no fixed px value,
+* so the whole expression is undefined.
+*/
+function evaluateCalc(expression) {
+	if (expression.replace(CALC_TOKEN, "").trim()) return void 0;
+	const tokens = expression.match(CALC_TOKEN);
+	if (!tokens) return void 0;
+	let i = 0;
+	const primary = () => {
+		const token = tokens[i++];
+		if (token === void 0) return void 0;
+		if (token.toLowerCase() === "calc") return primary();
+		if (token === "(") {
+			const v = sum();
+			i++;
+			return v;
+		}
+		const px = lengthToPx(token);
+		if (px === void 0) return void 0;
+		return {
+			n: px,
+			length: /[a-z]$/i.test(token)
+		};
+	};
+	const product = () => {
+		let left = primary();
+		while (left && (tokens[i] === "*" || tokens[i] === "/")) {
+			const op = tokens[i++];
+			const right = primary();
+			if (!right) return void 0;
+			left = op === "*" ? {
+				n: left.n * right.n,
+				length: left.length || right.length
+			} : {
+				n: left.n / right.n,
+				length: left.length
+			};
+		}
+		return left;
+	};
+	const sum = () => {
+		let left = product();
+		while (left && (tokens[i] === "+" || tokens[i] === "-")) {
+			const op = tokens[i++];
+			const right = product();
+			if (!right) return void 0;
+			left = {
+				n: op === "+" ? left.n + right.n : left.n - right.n,
+				length: true
+			};
+		}
+		return left;
+	};
+	const result = sum();
+	return result && Number.isFinite(result.n) ? result.n : void 0;
 }
 //#endregion
 //#region src/tokens/usage.ts
@@ -1553,7 +2276,7 @@ function utilities(namespace, key) {
 			"gap-2",
 			"m-1"
 		];
-		case "--radius": return [`rounded-${key}`];
+		case "--radius": return [key === "DEFAULT" ? "rounded" : `rounded-${key}`];
 		case "--font": return [`font-${key}`];
 		case "--font-weight": return [`font-${key}`];
 		case "--text": return [`text-${key}`];
@@ -1626,6 +2349,106 @@ function collect(object, keys, colors) {
 		if (variable && name && !colors.has(variable)) colors.set(variable, name);
 	}
 }
+/**
+* Reads `borderRadius` entries from a Tailwind v3 config without running it:
+* every `borderRadius` object in the file, then in the project modules it
+* imports, such as a shared preset. The config's own entries win.
+*/
+function readTailwindRadii(file, resolve) {
+	const radii = /* @__PURE__ */ new Map();
+	const files = [];
+	const queue = [file];
+	while (queue.length && files.length < MAX_FILES) {
+		const current = queue.shift() ?? "";
+		if (files.includes(current)) continue;
+		let text;
+		try {
+			text = fs.readFileSync(current, "utf8");
+		} catch {
+			continue;
+		}
+		files.push(current);
+		const source = ts.createSourceFile(current, text, ts.ScriptTarget.Latest, true, scriptKind(current));
+		const visit = (node) => {
+			if (ts.isPropertyAssignment(node) && propertyName(node.name) === "borderRadius" && ts.isObjectLiteralExpression(node.initializer)) {
+				collectRadius(node.initializer, radii);
+				return;
+			}
+			const specifier = importedSpecifier(node);
+			const target = specifier === void 0 ? void 0 : resolve(specifier, current);
+			if (target && /\.[cm]?[jt]s$/.test(target)) queue.push(target);
+			ts.forEachChild(node, visit);
+		};
+		visit(source);
+	}
+	return {
+		radii,
+		files
+	};
+}
+/** `sm: "calc(var(--radius) - 4px)"` → `sm` → raw string; first seen wins. */
+function collectRadius(object, radii) {
+	for (const property of object.properties) {
+		if (!ts.isPropertyAssignment(property)) continue;
+		const key = propertyName(property.name);
+		if (key === void 0) continue;
+		const value = property.initializer;
+		let raw;
+		if (ts.isStringLiteralLike(value)) raw = value.text;
+		else if (ts.isNumericLiteral(value) || ts.isNoSubstitutionTemplateLiteral(value)) raw = value.text;
+		if (raw === void 0 || radii.has(key)) continue;
+		radii.set(key, raw);
+	}
+}
+/**
+* Gives radius tokens their Tailwind v3 class names: each config entry is
+* evaluated (its `var()` against radius token values, so
+* `calc(var(--radius) - 4px)` resolves with the theme), then radius tokens
+* whose px matches exactly take the entry key. Entries with no matching
+* token add a synthetic one, so the scale step exists as a candidate
+* (mirrors the spacing-steps synthesis); without it the literal would keep
+* matching the nearest unrelated token. Config entries win over presets.
+*/
+function applyTailwindRadii(tokens, radii, configFile = "tailwind.config") {
+	const byVar = /* @__PURE__ */ new Map();
+	for (const token of tokens) if (token.category === "radius" && token.cssVar) byVar.set(token.cssVar, token.value);
+	const resolve = (name) => byVar.get(name);
+	const byPx = /* @__PURE__ */ new Map();
+	for (const [key, raw] of radii) {
+		const px = evaluateLength(raw, resolve);
+		if (px !== void 0 && !byPx.has(px)) byPx.set(px, key);
+	}
+	const havePx = /* @__PURE__ */ new Set();
+	for (const token of tokens) {
+		if (token.category !== "radius") continue;
+		const px = evaluateLength(token.value, resolve);
+		if (px === void 0) continue;
+		havePx.add(px);
+		const key = byPx.get(px);
+		if (key === void 0) continue;
+		token.tailwind = key;
+		token.usage = usageFor(token, "--radius");
+	}
+	for (const [px, key] of byPx) {
+		if (havePx.has(px)) continue;
+		const token = {
+			name: `radius-${key}`,
+			category: "radius",
+			value: `${px}px`,
+			tailwind: key,
+			usage: usageFor({
+				category: "radius",
+				tailwind: key
+			}, "--radius"),
+			source: {
+				file: configFile,
+				line: 1
+			}
+		};
+		tokens.push(token);
+		havePx.add(px);
+	}
+}
 /** The specifier of `require("x")`, `import x from "x"` or `import("x")`. */
 function importedSpecifier(node) {
 	if (ts.isImportDeclaration(node) && ts.isStringLiteral(node.moduleSpecifier)) return node.moduleSpecifier.text;
@@ -1754,15 +2577,25 @@ const tokenSourceSchema = z.union([z.string(), z.object({
 	path: z.string().describe("File or glob."),
 	prefix: z.string().optional().describe("DTCG only: custom property prefix, e.g. \"acme\" for --acme-color-primary.")
 }).strict()]);
+/** `false`, or a list of library ids; an unknown id is named with the closest known one. */
+const librariesSchema = z.union([z.literal(false), z.array(z.enum(LIBRARY_IDS))], { error: (issue) => {
+	const unknown = Array.isArray(issue.input) ? issue.input.find((id) => !LIBRARY_IDS.includes(id)) : void 0;
+	if (typeof unknown === "string") {
+		const guess = closest(unknown, LIBRARY_IDS, .5);
+		return `Unknown library "${unknown}". ${guess ? `Did you mean "${guess}"?` : `Expected one of: ${LIBRARY_IDS.join(", ")}.`}`;
+	}
+	return `"libraries" is false, to read no library, or a list of the ones to read: ${JSON.stringify(LIBRARY_IDS)}.`;
+} });
 const configShape = {
 	$schema: z.string().optional(),
 	components: globsSchema.optional().describe("Globs for component source files, relative to the root."),
 	exclude: z.array(z.string()).optional().describe("Globs to ignore when finding components and when `check` expands folders and globs (stories, tests). Replaces the defaults; node_modules is skipped either way unless a pattern names it."),
-	tokens: z.union([tokenSourceSchema, z.array(tokenSourceSchema)]).optional().describe("Token files: W3C DTCG JSON (*.json) or CSS custom properties (*.css)."),
+	tokens: z.union([tokenSourceSchema, z.array(tokenSourceSchema)]).optional().describe("Token files: W3C DTCG JSON (*.json), CSS custom properties (*.css) or a DESIGN.md's front matter (*.md)."),
 	docs: globsSchema.optional().describe("Globs for per-component Markdown/MDX docs."),
 	tsconfig: z.string().optional().describe("tsconfig used to resolve types and path aliases."),
 	importPath: z.string().optional().describe("Package name components are imported from, e.g. \"@acme/ui\", or a pattern for packages imported by path: \"@acme/ui/{path}\" is @acme/ui/primitives/button for primitives/button.tsx in the package. Default: inferred from package exports and tsconfig paths."),
 	elements: z.record(z.string(), z.string()).optional().describe("Extra native element → component mappings, e.g. { \"a\": \"Link\" }."),
+	libraries: librariesSchema.optional().describe(`Published component libraries to read from their type declarations when the project depends on them. Omitted: every one onsystem reads (${LIBRARY_IDS.join(", ")}). false: none. A list: only those, e.g. ["mui"].`),
 	includeDesignSystem: z.boolean().optional().describe("check: lint the design system's own component files too. Off by default: they implement the scale and primitives the rules enforce."),
 	rules: rulesSchema.optional().describe("Rule severities and options: \"off\" | \"warn\" | \"error\" | [severity, { allow }]."),
 	overrides: z.array(overrideSchema).optional().describe("Rules for some files: [{ \"files\": [\"app/legacy/**\"], \"rules\": { \"no-hardcoded-color\": \"warn\" } }]. Later entries win.")
@@ -1805,6 +2638,11 @@ const DEFAULT_TOKENS = [
 	"app/app.css",
 	"**/*.tokens.json"
 ];
+/**
+* Zero config reads these only when none of the token files above exist: the tokens in a
+* DESIGN.md's front matter, which describes a design system to agents.
+*/
+const FALLBACK_TOKENS = ["DESIGN.md"];
 const DEFAULT_DOCS = [
 	"docs/components/**/*.{md,mdx}",
 	"components/ui/**/*.{md,mdx}",
@@ -1824,18 +2662,35 @@ var ConfigError = class extends Error {
 	name = "ConfigError";
 };
 async function loadConfig(options = {}) {
+	return loadConfigWith(options);
+}
+/** {@link loadConfig}, with what the caller has already found in the folder searched. */
+async function loadConfigWith(options, context = {}) {
 	const cwd = path.resolve(options.cwd ?? process.cwd());
 	const searchDir = options.root ? path.resolve(cwd, options.root) : cwd;
 	const deprecations = [];
+	const warnings = [];
+	let packages = context.packages?.root === searchDir ? context.packages : void 0;
+	const finder = (dir) => packages?.root === dir ? packages : packages = new PackageFinder(dir);
+	let lookup = context.lookup;
 	let configFile;
+	/** The design-system package whose config this project takes on, having none of its own. */
+	let declared;
 	if (options.config) configFile = path.resolve(cwd, options.config);
 	else {
 		const find = (names) => names.map((name) => path.join(searchDir, name)).find((file) => fs.existsSync(file));
 		configFile = find(CONFIG_FILES);
 		const legacy = find(LEGACY_CONFIG_FILES);
 		if (legacy) deprecations.push(legacyConfigNotice(legacy, configFile));
-		configFile ??= legacy;
+		configFile ??= legacy ?? ownDeclaredConfig(searchDir);
+		if (!configFile) {
+			lookup ??= findDesignSystemPackage(searchDir, finder(searchDir));
+			if (lookup?.problems.length) throw declarationError(lookup, searchDir);
+			declared = lookup?.found;
+			configFile = declared?.config;
+		}
 	}
+	for (const { name, problem } of lookup?.skipped ?? []) warnings.push(`${name}'s onsystem config was skipped: ${problem} ${name} is installed in node_modules, so this project is read as if it declared none.`);
 	let raw = {};
 	if (configFile) {
 		if (!fs.existsSync(configFile)) throw new ConfigError(`Config file not found: ${configFile}`);
@@ -1845,16 +2700,27 @@ async function loadConfig(options = {}) {
 	const parsed = configSchema.safeParse(raw);
 	if (!parsed.success) throw new ConfigError(`Invalid config in ${configFile ?? "(defaults)"}:\n${z.prettifyError(parsed.error)}`);
 	const config = parsed.data;
-	const root = options.root ? path.resolve(cwd, options.root) : configFile ? path.dirname(configFile) : cwd;
+	const root = options.root ? path.resolve(cwd, options.root) : options.config && configFile ? path.dirname(configFile) : searchDir;
 	if (!isDirectory(root)) throw new ConfigError(`Project root not found: ${root}`);
-	const base = options.base ? path.resolve(cwd, options.base) : root;
+	const base = declared ? declared.dir : options.base ? path.resolve(cwd, options.base) : root;
 	const inherited = base !== root;
 	const fromBase = (p) => inherited ? toPosix(path.relative(root, path.resolve(base, slashGlob(p)))) || "." : p;
 	const toProject = toPosix(path.relative(base, root));
 	const excludeFromBase = (e) => {
 		if (!inherited || e.startsWith("**/")) return e;
+		if (declared) return fromBase(e);
 		return e.startsWith(`${toProject}/`) ? e.slice(toProject.length + 1) : void 0;
 	};
+	const outside = [];
+	const within = (field) => (p) => {
+		if (!declared || staysIn(declared.dir, declared.boundary, slashGlob(p))) return true;
+		outside.push(`${field} ${p}`);
+		return false;
+	};
+	const configComponents = config.components === void 0 ? void 0 : toArray(config.components).filter(within("components"));
+	const configTokens = config.tokens === void 0 ? void 0 : toArray(config.tokens).filter((t) => within("tokens")(typeof t === "string" ? t : t.path));
+	const configDocs = config.docs === void 0 ? void 0 : toArray(config.docs).filter(within("docs"));
+	if (declared && outside.length) warnings.push(`${declared.name}'s onsystem config names paths outside ${declared.installed ? "the package" : "the workspace"}, which were ignored: ${outside.join(", ")}.`);
 	const rules = {};
 	for (const id of RULE_IDS) {
 		const setting = config.rules?.[id];
@@ -1863,18 +2729,18 @@ async function loadConfig(options = {}) {
 			options: {}
 		} : resolveRule(setting);
 	}
-	const overrides = (config.overrides ?? []).map((override) => ({
+	const overrides = (declared ? [] : config.overrides ?? []).map((override) => ({
 		files: toArray(override.files).map(slashGlob),
 		rules: Object.fromEntries(Object.entries(override.rules).map(([id, setting]) => [id, resolveRule(setting)]))
 	}));
-	const tsconfig = config.tsconfig === void 0 ? void 0 : fromBase(config.tsconfig.replaceAll("\\", "/"));
+	const tsconfig = config.tsconfig === void 0 || declared ? void 0 : fromBase(config.tsconfig.replaceAll("\\", "/"));
 	if (tsconfig !== void 0 && !fs.existsSync(path.resolve(root, tsconfig))) throw new ConfigError(`tsconfig not found: ${path.resolve(root, tsconfig)} (from "tsconfig" in ${configFile ?? "the config"})`);
 	const componentsSet = Boolean(options.components?.length) || config.components !== void 0;
-	const detection = componentsSet ? void 0 : detectProject(root, tsconfig);
+	const detection = componentsSet ? void 0 : detectProject(root, tsconfig, void 0, declared, finder(root));
 	const explicitTokens = options.tokens?.length ? {
 		paths: options.tokens,
 		from: "--tokens"
-	} : config.tokens !== void 0 ? {
+	} : config.tokens !== void 0 && !declared ? {
 		paths: toArray(config.tokens).map((t) => fromBase(typeof t === "string" ? t : t.path)),
 		from: `"tokens" in ${configFile ?? "the config"}`
 	} : void 0;
@@ -1882,35 +2748,77 @@ async function loadConfig(options = {}) {
 		const absolute = path.resolve(root, slashGlob(file));
 		if (!/[*?[\]{}()!]/.test(file) && !fs.existsSync(absolute)) throw new ConfigError(`Token file not found: ${absolute} (from ${explicitTokens?.from})`);
 	}
-	const tokenSources = options.tokens?.length ? options.tokens.map((p) => ({ path: p })) : config.tokens !== void 0 ? toArray(config.tokens).map((t) => typeof t === "string" ? { path: fromBase(t) } : {
+	const libraries = detectLibraries(root, config.libraries);
+	const tokenSources = options.tokens?.length ? options.tokens.map((p) => ({ path: p })) : configTokens !== void 0 ? configTokens.map((t) => typeof t === "string" ? { path: fromBase(t) } : {
 		...t,
 		path: fromBase(t.path)
-	}) : (detection?.tokens.length ? [...detection.tokens, ...DEFAULT_TOKENS.filter((t) => t.endsWith(".json"))] : DEFAULT_TOKENS).map((p) => ({ path: p }));
+	}) : [...(detection?.tokens.length ? [...detection.tokens, ...DEFAULT_TOKENS.filter((t) => t.endsWith(".json"))] : DEFAULT_TOKENS).map((p) => ({ path: p })), ...FALLBACK_TOKENS.map((p) => ({
+		path: p,
+		fallback: true
+	}))];
+	const exclude = (config.exclude ?? DEFAULT_EXCLUDE).map(slashGlob).map(excludeFromBase).filter((e) => e !== void 0);
 	return {
 		root,
 		configFile,
-		components: (options.components?.length ? options.components : config.components !== void 0 ? toArray(config.components) : detection ? [...detection.withDefaults ? DEFAULT_COMPONENTS : [], ...detection.components] : DEFAULT_COMPONENTS).map(slashGlob),
-		exclude: (config.exclude ?? DEFAULT_EXCLUDE).map(slashGlob).map(excludeFromBase).filter((e) => e !== void 0),
+		components: (options.components?.length ? options.components : configComponents !== void 0 ? configComponents.map(fromBase) : detection ? [...detection.withDefaults ? DEFAULT_COMPONENTS : [], ...detection.components] : DEFAULT_COMPONENTS).map(slashGlob),
+		exclude: declared && config.exclude ? [.../* @__PURE__ */ new Set([...DEFAULT_EXCLUDE, ...exclude])] : exclude,
+		...declared && config.exclude ? { designSystemExclude: exclude } : {},
 		tokens: tokenSources.map((t) => ({
 			...t,
 			path: slashGlob(t.path)
 		})),
-		docs: (options.docs?.length ? options.docs : config.docs === void 0 ? [...DEFAULT_DOCS, ...detection?.docs ?? []] : toArray(config.docs).map(fromBase)).map(slashGlob),
+		docs: (options.docs?.length ? options.docs : configDocs === void 0 ? [.../* @__PURE__ */ new Set([...DEFAULT_DOCS, ...detection?.docs ?? []])] : configDocs.map(fromBase)).map(slashGlob),
 		tsconfig,
 		importPath: config.importPath,
-		imports: detection?.imports ?? [],
+		imports: detection?.imports ?? (declared && componentsSet ? packageImports(root, declared.dir) : []),
 		detected: detection?.source,
 		...detection?.designSystems ? { designSystems: detection.designSystems } : {},
 		tailwindConfig: findTailwindConfig(root),
+		libraries: libraries.read,
+		libraryIds: config.libraries,
+		librariesOff: libraries.off,
 		elements: config.elements ?? {},
-		includeDesignSystem: options.includeDesignSystem ?? config.includeDesignSystem ?? false,
+		includeDesignSystem: options.includeDesignSystem ?? (declared ? void 0 : config.includeDesignSystem) ?? false,
 		rules,
 		overrides,
-		...inherited ? { base } : {},
+		...inherited && !declared ? { base } : {},
+		...declared ? { designSystemPackage: declared } : {},
 		configured: componentsSet,
-		...deprecations.length ? { deprecations } : {}
+		...deprecations.length ? { deprecations } : {},
+		...warnings.length ? { warnings } : {}
 	};
 }
+/**
+* Whether `dir` has a config of its own: a config file under its current or old name, or one its
+* package.json names in its `onsystem` field. Without one, a project takes on its design-system
+* package's config, else the workspace root's.
+*/
+function hasOwnConfig(dir) {
+	if ([...CONFIG_FILES, ...LEGACY_CONFIG_FILES].some((name) => fs.existsSync(path.join(dir, name)))) return true;
+	return declaredConfig(dir) !== void 0;
+}
+/** The config `dir`'s own package.json names in its `onsystem` field, as a design-system package does. */
+function ownDeclaredConfig(dir) {
+	const declared = declaredConfig(dir);
+	if (declared && "problem" in declared) throw new ConfigError(declared.problem);
+	return declared?.file;
+}
+/** The error for workspace packages whose declaration cannot be read: their team can fix them. */
+function declarationError(lookup, dir) {
+	return new ConfigError(`${lookup.problems.map((p) => `${p.name}: ${p.problem}`).join("\n")}\nFix the "${PACKAGE_FIELD}" field in that package, or give ${dir} a config of its own (onsystem.config.json), which is read instead.`);
+}
+/**
+* Whether a path or glob in a dependency's config, relative to its folder `dir`, stays in
+* `boundary`: its static part resolves inside it, and no `..` hides among its wildcards and
+* braces (`{src,../..}/**`), which could reach anywhere.
+*/
+function staysIn(dir, boundary, pattern) {
+	const base = globBase(pattern);
+	const parts = pattern.split("/");
+	const fixed = base === "." ? parts[0] === "." ? 1 : 0 : base.split("/").length;
+	if (parts.slice(fixed).some((part) => part.includes(".."))) return false;
+	return isInside(boundary, path.resolve(dir, base));
+}
 /** What to say about a config file under its old name, with or without a new one next to it. */
 function legacyConfigNotice(legacy, current) {
 	const name = path.basename(legacy);
@@ -2016,7 +2924,7 @@ function extractComponents(options) {
 			if (seen.has(c.declaration)) return false;
 			seen.add(c.declaration);
 			return true;
-		}).map((candidate) => buildComponent(context, candidate));
+		}).map((candidate) => buildComponent$1(context, candidate));
 		linkComposition(fileComponents);
 		components.push(...fileComponents);
 	}
@@ -2202,7 +3110,7 @@ function declarationName(declaration) {
 	if ((ts.isFunctionDeclaration(declaration) || ts.isClassDeclaration(declaration)) && declaration.name) return declaration.name.text;
 	if (ts.isVariableDeclaration(declaration) && ts.isIdentifier(declaration.name)) return declaration.name.text;
 }
-function buildComponent(context, candidate) {
+function buildComponent$1(context, candidate) {
 	const { checker, sourceFile } = context;
 	const param = candidate.fn?.parameters[0];
 	const typeNode = candidate.propsTypeNode ?? param?.type;
@@ -2382,11 +3290,11 @@ function extractProps(context, candidate, typeNode, param) {
 	}
 	const byOrigin = /* @__PURE__ */ new Map();
 	for (const [name, { origin }] of own) byOrigin.set(origin, [...byOrigin.get(origin) ?? [], name]);
-	const summarised = new Set([...byOrigin].filter(([origin, names]) => origin === "react" || origin !== "own" && names.length > MAX_LISTED_INHERITED).map(([origin]) => origin));
+	const summarised = new Set([...byOrigin].filter(([origin, names]) => origin === "react" || origin !== "own" && names.length > MAX_LISTED_INHERITED$1).map(([origin]) => origin));
 	const props = [];
 	for (const [name, { symbol, requiredIn, origin }] of own) {
 		if (summarised.has(origin)) continue;
-		props.push(describeProp(context, name, symbol, location, requiredIn === types.length, origin));
+		props.push(describeProp$1(context, name, symbol, location, requiredIn === types.length, origin));
 	}
 	const inherits = [];
 	for (const origin of summarised) {
@@ -2410,7 +3318,7 @@ function extractProps(context, candidate, typeNode, param) {
 	};
 }
 /** Packages contributing more props than this are summarised instead of listed. */
-const MAX_LISTED_INHERITED = 40;
+const MAX_LISTED_INHERITED$1 = 40;
 /** Flattens intersections and local aliases into the types they are built from. */
 function constituents(context, typeNode, depth = 0) {
 	const { checker } = context;
@@ -2466,7 +3374,7 @@ function originOf(symbol) {
 	if (pkg === "@types/react" || pkg === "typescript") return "react";
 	return pkg;
 }
-function describeProp(context, name, symbol, location, required, origin) {
+function describeProp$1(context, name, symbol, location, required, origin) {
 	const { checker } = context;
 	const declared = checker.getTypeOfSymbolAtLocation(symbol, location);
 	const type = checker.getNonNullableType(declared);
@@ -2476,7 +3384,7 @@ function describeProp(context, name, symbol, location, required, origin) {
 		required,
 		kind: "prop"
 	};
-	const values = literalValues$1(type);
+	const values = literalValues$2(type);
 	if (values) prop.values = values;
 	const description = ts.displayPartsToString(symbol.getDocumentationComment(checker)).trim();
 	if (description) prop.description = description;
@@ -2499,7 +3407,7 @@ function unwrapParens(text) {
 	}
 	return text.slice(1, -1);
 }
-function literalValues$1(type) {
+function literalValues$2(type) {
 	const members = type.isUnion() ? type.types : [type];
 	if (!members.every((t) => t.isStringLiteral())) return void 0;
 	return members.map((t) => t.value);
@@ -2639,10 +3547,10 @@ function inferElement(context, candidate, typeNode) {
 	const ref = candidate.refTypeNode?.getText();
 	const refElement = ref ? /^HTML(\w+)Element$/.exec(ref)?.[1] : void 0;
 	if (refElement) return ELEMENT_INTERFACES[refElement];
-	return candidate.fn ? renderedElement(candidate.fn) : void 0;
+	return candidate.fn ? renderedElement$1(candidate.fn) : void 0;
 }
 /** The intrinsic element returned by the render function, following `const Comp = asChild ? Slot : "button"`. */
-function renderedElement(fn) {
+function renderedElement$1(fn) {
 	let found;
 	const stringAssignments = /* @__PURE__ */ new Map();
 	const visit = (node) => {
@@ -2927,10 +3835,491 @@ function unquote(value) {
 function stringValue(value) {
 	return typeof value === "string" && value ? value : void 0;
 }
-function dedent(code) {
-	const lines = code.replace(/^\n+|\s+$/g, "").split("\n");
-	const indent = Math.min(...lines.filter((l) => l.trim()).map((l) => /^\s*/.exec(l)?.[0].length ?? 0));
-	return lines.map((l) => l.slice(Number.isFinite(indent) ? indent : 0)).join("\n");
+function dedent(code) {
+	const lines = code.replace(/^\n+|\s+$/g, "").split("\n");
+	const indent = Math.min(...lines.filter((l) => l.trim()).map((l) => /^\s*/.exec(l)?.[0].length ?? 0));
+	return lines.map((l) => l.slice(Number.isFinite(indent) ? indent : 0)).join("\n");
+}
+//#endregion
+//#region src/libraries/declarations.ts
+/** Packages contributing more props than this are summarised, as in source extraction. */
+const MAX_LISTED_INHERITED = 40;
+/**
+* Reads a published library's components from its type declarations with the TypeScript
+* checker: every value its entry exports under a capitalised name whose type takes props
+* (function and class components, `forwardRef` and MUI's `OverridableComponent`), with the
+* props of each call signature, their string-literal values (custom ones the app declares by
+* module augmentation included), JSDoc, the element it renders, and the module that
+* default-exports it. A signature generic over the element to render (MUI's `component`) marks
+* that prop as polymorphic instead of adding its props.
+*/
+function extractLibrary(options) {
+	const { root, adapter, dir } = options;
+	const warnings = [];
+	const empty = (warning) => ({
+		components: [],
+		propSets: {},
+		exports: [],
+		warnings: [warning],
+		dependencies: []
+	});
+	let real;
+	try {
+		real = fs.realpathSync.native(dir);
+	} catch {
+		return empty(`${adapter.package}: ${dir} could not be read`);
+	}
+	const resolve = (specifier) => ts.resolveModuleName(specifier, path.join(root, "__onsystem__.tsx"), options.project.options, ts.sys).resolvedModule?.resolvedFileName;
+	const entry = resolve(adapter.package) ?? path.join(real, typesEntry(real));
+	if (!fs.existsSync(entry) || !/\.d\.[cm]?ts$/.test(entry)) return empty(`${adapter.package}: no type declarations at ${relativePath(root, entry)}`);
+	const program = ts.createProgram({
+		rootNames: [entry, ...options.augmentations],
+		options: options.project.options
+	});
+	const checker = program.getTypeChecker();
+	const entryFile = program.getSourceFile(entry);
+	const moduleSymbol = entryFile ? checker.getSymbolAtLocation(entryFile) : void 0;
+	if (!moduleSymbol) return empty(`${adapter.package}: ${entry} has no exports`);
+	const shown = (file) => {
+		const absolute = path.resolve(file);
+		return relativePath(root, isInside(real, absolute) ? path.join(dir, path.relative(real, absolute)) : absolute);
+	};
+	const context = {
+		checker,
+		adapter,
+		propSets: /* @__PURE__ */ new Map(),
+		scope: adapter.package.startsWith("@") ? `${adapter.package.split("/")[0] ?? ""}/` : adapter.package
+	};
+	const exportNames = /* @__PURE__ */ new Set();
+	const bySymbol = /* @__PURE__ */ new Map();
+	const components = [];
+	for (const exported of checker.getExportsOfModule(moduleSymbol)) {
+		const name = exported.getName();
+		const symbol = exported.flags & ts.SymbolFlags.Alias ? checker.getAliasedSymbol(exported) : exported;
+		if (!(symbol.flags & ts.SymbolFlags.Value)) continue;
+		exportNames.add(name);
+		if (!/^[A-Z]/.test(name)) continue;
+		const known = bySymbol.get(symbol);
+		if (known) {
+			known.aliases.push(name);
+			continue;
+		}
+		const declaration = symbol.valueDeclaration ?? symbol.declarations?.[0];
+		if (!declaration) continue;
+		const component = buildComponent(context, name, symbol);
+		if (!component) continue;
+		const file = declaration.getSourceFile();
+		const line = file.getLineAndCharacterOfPosition(declaration.getStart(file)).line + 1;
+		component.source = {
+			file: shown(file.fileName),
+			line
+		};
+		const defaultImport = defaultModule(program, checker, resolve, adapter.package, file, symbol);
+		if (defaultImport) component.defaultImport = defaultImport;
+		bySymbol.set(symbol, component);
+		components.push(component);
+	}
+	linkSlots(components);
+	return {
+		components,
+		propSets: Object.fromEntries(context.propSets),
+		exports: [...exportNames].sort(),
+		warnings,
+		dependencies: unique(projectFiles(program))
+	};
+}
+/** The declaration entry of an installed package: its `types`, else `index.d.ts`. */
+function typesEntry(dir) {
+	try {
+		const pkg = JSON.parse(fs.readFileSync(path.join(dir, "package.json"), "utf8"));
+		const types = typeof pkg.types === "string" ? pkg.types : pkg.typings;
+		if (typeof types === "string" && types.endsWith(".d.ts")) return types;
+	} catch {}
+	return "index.d.ts";
+}
+/** Call and construct signatures that take props, across a union (`React.ComponentType`). */
+function propSignatures(type) {
+	return (type.isUnion() ? type.types : [type]).flatMap((member) => [...member.getCallSignatures(), ...member.getConstructSignatures()]).filter((signature) => signature.getParameters().length >= 1);
+}
+/** A React context (`ButtonGroupContext`): callable in React 19's types, but not a component to offer. */
+function isContext(checker, type) {
+	return checker.getPropertyOfType(type, "Provider") !== void 0 && checker.getPropertyOfType(type, "Consumer") !== void 0;
+}
+/**
+* The prop a generic signature renders in the component's place (`component: RootComponent`
+* where `RootComponent extends React.ElementType`), which then takes that element's props.
+*/
+function polymorphicProp(checker, signature) {
+	const parameters = signature.getTypeParameters();
+	if (!parameters?.length) return void 0;
+	const props = signature.getParameters()[0];
+	if (!props) return void 0;
+	for (const prop of checker.getPropertiesOfType(checker.getTypeOfSymbol(props))) {
+		const type = checker.getNonNullableType(checker.getTypeOfSymbol(prop));
+		if (!(type.flags & ts.TypeFlags.TypeParameter)) continue;
+		const declaration = type.symbol.declarations?.find(ts.isTypeParameterDeclaration);
+		if (parameters.includes(type) && declaration?.constraint && /\bElementType\b/.test(declaration.constraint.getText())) return {
+			name: prop.getName(),
+			symbol: prop
+		};
+	}
+}
+function buildComponent(context, name, symbol) {
+	const { checker, adapter } = context;
+	const type = checker.getTypeOfSymbol(symbol);
+	if (isContext(checker, type)) return void 0;
+	const signatures = propSignatures(type);
+	if (!signatures.length) return void 0;
+	let polymorphic;
+	const plain = [];
+	for (const signature of signatures) {
+		const prop = polymorphicProp(checker, signature);
+		if (prop) polymorphic ??= prop;
+		else plain.push(signature);
+	}
+	const used = plain.length ? plain : signatures;
+	const entries = /* @__PURE__ */ new Map();
+	let members = 0;
+	let openProps = false;
+	for (const signature of used) {
+		const param = signature.getParameters()[0];
+		if (!param) continue;
+		const propsType = checker.getTypeOfSymbol(param);
+		if (propsType.flags & ts.TypeFlags.Any) {
+			openProps = true;
+			continue;
+		}
+		for (const part of propsType.isUnion() ? propsType.types : [propsType]) {
+			members++;
+			if (checker.getIndexInfosOfType(part).length) openProps = true;
+			for (const prop of checker.getPropertiesOfType(part)) {
+				const propName = prop.getName();
+				const entry = entries.get(propName) ?? {
+					symbols: [],
+					required: 0,
+					origin: originOf(prop)
+				};
+				entry.symbols.push(prop);
+				if (!(prop.flags & ts.SymbolFlags.Optional)) entry.required++;
+				entries.set(propName, entry);
+			}
+		}
+	}
+	if (!members && !openProps) return void 0;
+	if (polymorphic && !entries.has(polymorphic.name)) entries.set(polymorphic.name, {
+		symbols: [polymorphic.symbol],
+		required: 0,
+		origin: originOf(polymorphic.symbol)
+	});
+	const own = (origin) => origin === adapter.package || origin.startsWith(context.scope) || origin === "own";
+	const byOrigin = /* @__PURE__ */ new Map();
+	for (const [propName, { origin }] of entries) byOrigin.set(origin, [...byOrigin.get(origin) ?? [], propName]);
+	const summarised = new Set([...byOrigin].filter(([origin, names]) => !own(origin) && (origin === "react" || names.length > MAX_LISTED_INHERITED)).map(([origin]) => origin));
+	const element = renderedElement(checker, used.at(-1));
+	const props = [];
+	const variants = [];
+	for (const [propName, entry] of entries) {
+		if (summarised.has(entry.origin)) continue;
+		const prop = describeProp(checker, propName, entry, entry.required === members);
+		if (propName === polymorphic?.name) prop.type = "React.ElementType";
+		if (!own(entry.origin)) prop.description = [prop.description, `From ${entry.origin}.`].filter(Boolean).join(" ");
+		if (prop.values && prop.values.length > 1) {
+			prop.kind = "variant";
+			const fallback = prop.default?.replace(/^(['"])(.*)\1$/, "$2");
+			variants.push({
+				name: propName,
+				values: [...prop.values],
+				...fallback !== void 0 && prop.values.includes(fallback) ? { default: fallback } : {},
+				classes: {}
+			});
+		}
+		props.push(prop);
+	}
+	props.sort((a, b) => Number(b.kind === "variant") - Number(a.kind === "variant"));
+	const inherits = [];
+	for (const origin of summarised) {
+		const names = (byOrigin.get(origin) ?? []).sort();
+		const deprecated = names.filter((propName) => entries.get(propName)?.symbols[0]?.getJsDocTags(checker).some((tag) => tag.name === "deprecated"));
+		inherits.push({
+			from: origin === "react" ? element ? `React.ComponentPropsWithRef<"${element}">` : "React DOM attributes" : origin,
+			count: names.length,
+			set: registerPropSet(context.propSets, names),
+			...deprecated.length ? { deprecated } : {}
+		});
+	}
+	const info = {
+		name,
+		aliases: [],
+		importPath: adapter.package,
+		exportName: name,
+		source: {
+			file: "",
+			line: 0
+		},
+		subcomponents: [],
+		props,
+		inherits,
+		openProps,
+		variants,
+		compoundVariants: [],
+		examples: [],
+		classNames: [],
+		cssVars: [],
+		library: adapter.package
+	};
+	if (polymorphic) info.polymorphic = polymorphic.name;
+	if (element) info.element = element;
+	const jsdoc = ts.displayPartsToString(symbol.getDocumentationComment(checker)).trim();
+	const description = jsdoc ? adapter.describe?.(jsdoc, name) ?? jsdoc : void 0;
+	if (description) info.description = description;
+	for (const tag of symbol.getJsDocTags(checker)) {
+		if (tag.name !== "deprecated") continue;
+		info.deprecated = ts.displayPartsToString(tag.text).trim() || true;
+	}
+	adapter.annotate?.(info);
+	return info;
+}
+function describeProp(checker, name, entry, required) {
+	const [first] = entry.symbols;
+	const declared = first ? checker.getTypeOfSymbol(first) : void 0;
+	const printed = declared ? checker.typeToString(declared, void 0, ts.TypeFormatFlags.NoTruncation | ts.TypeFormatFlags.UseAliasDefinedOutsideCurrentScope).replace(/^(?:(?:undefined|null) \| )+|(?: \| (?:undefined|null))+$/g, "") : "unknown";
+	let values = [];
+	for (const symbol of entry.symbols) {
+		const found = literalValues$1(checker, checker.getTypeOfSymbol(symbol));
+		if (!found) {
+			values = void 0;
+			break;
+		}
+		values.push(...found);
+	}
+	const ordered = values?.length ? declarationOrder(unique(values), entry.symbols, checker) : void 0;
+	const prop = {
+		name,
+		type: ordered ? ordered.map((v) => JSON.stringify(v)).join(" | ") : truncate(unwrapParens(printed) || "unknown", 200),
+		required,
+		kind: "prop"
+	};
+	if (ordered) prop.values = ordered;
+	const documented = entry.symbols.find((s) => s.getDocumentationComment(checker).length);
+	const description = documented ? ts.displayPartsToString(documented.getDocumentationComment(checker)).trim() : "";
+	if (description) prop.description = description;
+	for (const tag of (documented ?? first)?.getJsDocTags(checker) ?? []) {
+		const text = ts.displayPartsToString(tag.text).trim();
+		if ((tag.name === "default" || tag.name === "defaultValue") && text) prop.default = text;
+		if (tag.name === "deprecated") prop.deprecated = text || true;
+	}
+	return prop;
+}
+/**
+* Values in the order the declaration writes them (`'small' | 'medium' | 'large'`), which the
+* checker does not keep; values it does not write (an app's augmentation adds them) go last.
+*/
+function declarationOrder(values, symbols, checker) {
+	const text = symbols.map((s) => {
+		const declaration = s.valueDeclaration ?? s.declarations?.[0];
+		return declaration && (ts.isPropertySignature(declaration) || ts.isPropertyDeclaration(declaration)) && declaration.type ? typeText(checker, declaration.type, 0) : "";
+	}).join("\n");
+	const at = (value) => {
+		const index = Math.max(text.indexOf(`'${value}'`), text.indexOf(`"${value}"`));
+		return index === -1 ? Number.MAX_SAFE_INTEGER : index;
+	};
+	return values.map((value, i) => ({
+		value,
+		at: at(value),
+		i
+	})).sort((a, b) => a.at - b.at || a.i - b.i).map((entry) => entry.value);
+}
+/**
+* A type as written, with the type parameters and aliases it names written out too
+* (`Variant` → `Variant extends TextFieldVariants` → `'outlined' | 'standard' | 'filled'`).
+*/
+function typeText(checker, node, depth) {
+	let text = node.getText();
+	if (depth > 2) return text;
+	const visit = (child) => {
+		if (ts.isTypeReferenceNode(child)) {
+			const symbol = checker.getSymbolAtLocation(child.typeName);
+			for (const declaration of symbol?.declarations ?? []) {
+				const referenced = ts.isTypeParameterDeclaration(declaration) ? declaration.constraint : ts.isTypeAliasDeclaration(declaration) ? declaration.type : void 0;
+				if (referenced) text += `\n${typeText(checker, referenced, depth + 1)}`;
+			}
+		}
+		ts.forEachChild(child, visit);
+	};
+	visit(node);
+	return text;
+}
+/**
+* The string literals a type allows, without `undefined` and `null`: a type parameter's
+* constraint (`variant?: Variant` where `Variant extends "outlined" | "filled"`). Undefined
+* when any member is not a string literal (`string & {}` leaves the set open).
+*/
+function literalValues$1(checker, type, depth = 0) {
+	if (depth > 4) return void 0;
+	const values = [];
+	for (const member of type.isUnion() ? type.types : [type]) {
+		if (member.flags & (ts.TypeFlags.Undefined | ts.TypeFlags.Null)) continue;
+		if (member.isStringLiteral()) {
+			values.push(member.value);
+			continue;
+		}
+		const constraint = member.flags & ts.TypeFlags.TypeParameter ? checker.getBaseConstraintOfType(member) : void 0;
+		const inner = constraint && constraint !== member ? literalValues$1(checker, constraint, depth + 1) : void 0;
+		if (!inner) return void 0;
+		values.push(...inner);
+	}
+	return values.length ? unique(values) : void 0;
+}
+/** The native element behind a signature, from the type of the `ref` its props take. */
+function renderedElement(checker, signature) {
+	const param = signature?.getParameters()[0];
+	if (!param) return void 0;
+	const ref = checker.getPropertyOfType(checker.getTypeOfSymbol(param), "ref");
+	if (!ref) return void 0;
+	const text = checker.typeToString(checker.getTypeOfSymbol(ref));
+	const element = /\bHTML(\w+?)Element\b/.exec(text)?.[1];
+	return element ? ELEMENT_INTERFACES[element] : void 0;
+}
+/**
+* The folder module that default-exports a component (`@mui/material/Button` for
+* `Button/Button.d.ts`), when the package has one for it.
+*/
+function defaultModule(program, checker, resolve, name, file, symbol) {
+	const folder = path.basename(path.dirname(file.fileName));
+	if (!/^[A-Za-z_][\w-]*$/.test(folder)) return void 0;
+	const resolved = resolve(`${name}/${folder}`);
+	const index = resolved ? program.getSourceFile(resolved) : void 0;
+	const module = index ? checker.getSymbolAtLocation(index) : void 0;
+	const exported = module ? checker.getExportsOfModule(module).find((e) => e.getName() === "default") : void 0;
+	if (!exported) return void 0;
+	return (exported.flags & ts.SymbolFlags.Alias ? checker.getAliasedSymbol(exported) : exported) === symbol ? `${name}/${folder}` : void 0;
+}
+/**
+* Styled slots a library exports next to the component they belong to (`SliderThumb` in
+* `Slider.d.ts`) become its parts, so lists show the component and its parts under it.
+*/
+function linkSlots(components) {
+	const byFile = /* @__PURE__ */ new Map();
+	for (const component of components) byFile.set(component.source.file, [...byFile.get(component.source.file) ?? [], component]);
+	for (const group of byFile.values()) for (const component of group) {
+		const owner = group.filter((other) => other !== component && component.name.length > other.name.length && component.name.startsWith(other.name)).sort((a, b) => b.name.length - a.name.length)[0];
+		if (!owner) continue;
+		component.parent = owner.name;
+		owner.subcomponents.push(component.name);
+	}
+}
+//#endregion
+//#region src/libraries/load.ts
+/** App sources read for module augmentations and themes, at most. */
+const MAX_SOURCES = 5e3;
+const SOURCE_FILE = /\.(?:[cm]?[jt]sx?)$/;
+/** Without a tsconfig, where an app's sources are not. */
+const NOT_SOURCES = [
+	"**/node_modules/**",
+	"**/dist/**",
+	"**/build/**",
+	"**/out/**",
+	"**/.next/**",
+	"**/coverage/**",
+	"**/public/**"
+];
+/**
+* The components and tokens of the libraries `config` found (`config.libraries`): each one's
+* components from its type declarations, read together with the app's files that augment them,
+* and the tokens of the theme the app creates for it.
+*/
+async function loadLibraries(config) {
+	const loaded = {
+		components: [],
+		propSets: {},
+		exports: [],
+		tokens: [],
+		warnings: [],
+		dependencies: []
+	};
+	const libraries = (config.libraries ?? []).flatMap((source) => {
+		const adapter = libraryAdapter(source.package);
+		return adapter ? [{
+			source,
+			adapter
+		}] : [];
+	});
+	if (!libraries.length) return loaded;
+	const project = readProjectConfig(config.root, config.tsconfig);
+	const patterns = libraries.flatMap(({ adapter }) => [adapter.augments, ...adapter.theme ? [adapter.theme.matches] : []]);
+	const sources = await appSources(config.root, project, patterns);
+	for (const { source, adapter } of libraries) {
+		if (!source.dir) {
+			loaded.warnings.push(`${adapter.title} (${source.package}) is a dependency but is not installed, so its components are not known: install the dependencies.`);
+			continue;
+		}
+		const augmentations = sources.filter((s) => adapter.augments.test(s.text)).map((s) => s.file);
+		const extracted = extractLibrary({
+			root: config.root,
+			adapter,
+			dir: source.dir,
+			project,
+			augmentations
+		});
+		if (adapter.theme) {
+			const { matches } = adapter.theme;
+			const themes = sources.filter((s) => matches.test(s.text));
+			const read = adapter.theme.read(themes, config.root);
+			addValues(extracted.components, read.values);
+			loaded.tokens.push(...read.tokens);
+			loaded.warnings.push(...read.warnings);
+			loaded.dependencies.push(...themes.map((s) => s.file), ...read.files ?? []);
+		}
+		loaded.components.push(...extracted.components);
+		Object.assign(loaded.propSets, extracted.propSets);
+		loaded.exports.push(...extracted.exports);
+		loaded.warnings.push(...extracted.warnings);
+		loaded.dependencies.push(...extracted.dependencies, ...augmentations);
+	}
+	loaded.exports = unique(loaded.exports).sort();
+	loaded.dependencies = unique(loaded.dependencies);
+	return loaded;
+}
+/** Adds the values the app's theme gives props (`teal`, `dashed`) to the props that take values. */
+function addValues(components, values) {
+	for (const added of values) for (const component of components) {
+		if (added.component !== void 0 && component.name !== added.component) continue;
+		const prop = component.props.find((p) => p.name === added.prop);
+		if (!prop?.values || prop.values.includes(added.value)) continue;
+		if (added.alongside !== void 0 && !prop.values.includes(added.alongside)) continue;
+		prop.values.push(added.value);
+		prop.type = prop.values.map((v) => JSON.stringify(v)).join(" | ");
+		const variant = component.variants.find((v) => v.name === added.prop);
+		if (variant && !variant.values.includes(added.value)) variant.values.push(added.value);
+	}
+}
+/**
+* The app's source files whose text one of `patterns` matches, with that text: the files its
+* tsconfig includes, or without one the scripts under the root, at most `MAX_SOURCES`.
+*/
+async function appSources(root, project, patterns) {
+	const included = project.fileNames.filter((file) => SOURCE_FILE.test(file) && !/[\\/]node_modules[\\/]/.test(file));
+	const files = (included.length ? included : await glob("**/*.{ts,tsx,mts,cts,js,jsx,mjs,cjs}", {
+		cwd: root,
+		absolute: true,
+		ignore: NOT_SOURCES
+	})).sort().slice(0, MAX_SOURCES);
+	const found = [];
+	for (let i = 0; i < files.length; i += 64) {
+		const batch = await Promise.all(files.slice(i, i + 64).map(async (file) => {
+			try {
+				const text = await fsp.readFile(file, "utf8");
+				return patterns.some((pattern) => pattern.test(text)) ? {
+					file,
+					text
+				} : void 0;
+			} catch {
+				return;
+			}
+		}));
+		for (const entry of batch) if (entry) found.push(entry);
+	}
+	return found;
 }
 //#endregion
 //#region src/lint/analyze.ts
@@ -3196,6 +4585,8 @@ function resolveElement(element, analysis, target, file) {
 	if (binding?.imported === "*" && rest.length) {
 		if (!target.isDesignSystemImport(binding.source, file)) return { kind: "external" };
 		const name = rest.join(".");
+		const library = target.libraryOf(binding.source);
+		if (library) return fromLibrary(target, library, name, binding.source, rest.length > 1);
 		const component = target.components.get(name);
 		if (component) return {
 			kind: "component",
@@ -3211,7 +4602,14 @@ function resolveElement(element, analysis, target, file) {
 	}
 	let owner;
 	if (binding && analysis.declared.has(head)) return { kind: "external" };
-	if (binding) {
+	const library = binding ? target.libraryOf(binding.source) : void 0;
+	if (binding && library) {
+		const imported = binding.imported === "default" ? target.defaultExport(binding.source, file)?.name : binding.imported;
+		if (imported === void 0) return { kind: "external" };
+		const resolved = fromLibrary(target, library, imported, binding.source, rest.length > 0);
+		if (resolved.kind !== "component") return resolved;
+		owner = resolved.component;
+	} else if (binding) {
 		if (!target.isDesignSystemImport(binding.source, file)) return { kind: "external" };
 		const imported = binding.imported === "default" ? target.defaultExport(binding.source, file)?.name ?? head : binding.imported;
 		owner = target.componentFor(imported, binding.source, file);
@@ -3246,6 +4644,26 @@ function resolveElement(element, analysis, target, file) {
 		member: rest.join(".")
 	};
 }
+/**
+* `name` from a library (`@mui/material`, or a module of it such as `@mui/material/Button`): its
+* own component of that name, never a wrapper the project has. A name the package exports that
+* is no component (a context, a styled slot it does not offer), or one imported from one of its
+* modules rather than the package itself, is not judged; one the package does not export at all
+* is invented.
+*/
+function fromLibrary(target, library, name, source, member) {
+	const component = target.libraryComponent(name, library);
+	if (component) return {
+		kind: "component",
+		component
+	};
+	if (source !== library || target.exports.has(name) || member) return { kind: "external" };
+	return {
+		kind: "missing-export",
+		name,
+		source
+	};
+}
 //#endregion
 //#region src/lint/tailwind-palette.ts
 /** Tailwind's default color palette: name → shade → OKLCH value. */
@@ -3606,6 +5024,23 @@ const NAMESPACES = [
 	["--font-", "typography"],
 	["--text-", "typography"]
 ];
+/**
+* A Tailwind v4 theme variable split into its namespace and key: `--color-primary` →
+* `--color` and `primary`, `--spacing` → `--spacing` and `''` (the spacing unit).
+*/
+function themeVariable(name) {
+	if (name === "--spacing") return {
+		namespace: "--spacing",
+		key: "",
+		category: "spacing"
+	};
+	const found = NAMESPACES.find(([prefix]) => name.startsWith(prefix) && name.length > prefix.length);
+	return found && {
+		namespace: found[0].slice(0, -1),
+		key: name.slice(found[0].length),
+		category: found[1]
+	};
+}
 const TAILWIND_DEFAULT_SPACING = "0.25rem";
 /** Tailwind v4's default `--radius-*` scale; a theme overrides keys one by one. */
 const TAILWIND_DEFAULT_RADIUS = {
@@ -3695,6 +5130,12 @@ function cssSheetTokens(sheets) {
 	const lookup = (name) => base.get(name)?.value ?? theme.get(name)?.value ?? tailwindColor(name);
 	const tokens = [];
 	const consumed = /* @__PURE__ */ new Set();
+	const aliases = /* @__PURE__ */ new Map();
+	const add = (token, raw) => {
+		tokens.push(token);
+		const alias = varAlias(raw);
+		if (alias) aliases.set(token, alias);
+	};
 	for (const variable of theme.values()) {
 		const namespace = NAMESPACES.find(([prefix]) => variable.name.startsWith(prefix));
 		const isSpacingBase = variable.name === "--spacing";
@@ -3707,7 +5148,7 @@ function cssSheetTokens(sheets) {
 		const target = alias ? base.get(alias) : void 0;
 		if (alias && target) {
 			consumed.add(alias);
-			tokens.push(finalize({
+			add(finalize({
 				name: alias.slice(2),
 				category,
 				value: resolveValue(target.value, lookup),
@@ -3718,10 +5159,10 @@ function cssSheetTokens(sheets) {
 				description: target.comment ?? variable.comment,
 				line: target.line,
 				file: target.file
-			}));
+			}), target.value);
 			continue;
 		}
-		tokens.push(finalize({
+		add(finalize({
 			name: variable.name.slice(2),
 			category,
 			value: variable.value,
@@ -3732,11 +5173,11 @@ function cssSheetTokens(sheets) {
 			description: variable.comment,
 			line: variable.line,
 			file: variable.file
-		}));
+		}), variable.value);
 	}
 	for (const variable of base.values()) {
 		if (consumed.has(variable.name)) continue;
-		tokens.push(finalize({
+		add(finalize({
 			name: variable.name.slice(2),
 			category: categorize$1(variable.name, resolveValue(variable.value, lookup)),
 			value: resolveValue(variable.value, lookup),
@@ -3745,7 +5186,12 @@ function cssSheetTokens(sheets) {
 			description: variable.comment,
 			line: variable.line,
 			file: variable.file
-		}));
+		}), variable.value);
+	}
+	const byVar = new Map(tokens.map((t) => [t.cssVar ?? `--${t.name}`, t]));
+	for (const [token, name] of aliases) {
+		const target = byVar.get(name);
+		if (target && target !== token) token.aliasOf = target.name;
 	}
 	const cleared = (namespace) => resets.has("*") || resets.has(namespace);
 	if (tailwind && !cleared("spacing") && !theme.has("--spacing") && !base.has("--spacing")) tokens.push({
@@ -3846,6 +5292,10 @@ function categorize$1(name, value) {
 	if (parseColor(value, { bareHsl: true })) return "color";
 	return "other";
 }
+/** `--x` for a value that is exactly `var(--x)`. */
+function varAlias(value) {
+	return /^var\(\s*(--[\w-]+)\s*\)$/.exec(value.trim())?.[1];
+}
 /** Follows plain `var(--x)` aliases so the token shows its concrete value. */
 function resolveValue(value, lookup, depth = 0) {
 	const alias = /^var\(\s*(--[\w-]+)\s*\)$/.exec(value)?.[1];
@@ -3924,7 +5374,150 @@ function trails(comment, before) {
 	return line !== void 0 && comment.source?.start?.line === line;
 }
 //#endregion
+//#region src/tokens/design-md.ts
+/**
+* Reads the tokens in a DESIGN.md's YAML front matter (https://github.com/google-labs-code/design.md):
+* `colors`, `typography`, `rounded` and `spacing`. Tokens are named by their path
+* (`colors.primary`), which is how `{colors.primary}` references them. `components` holds
+* per-component styling rather than tokens to choose from, and the Markdown body is prose, so
+* neither is read. A DESIGN.md says nothing about how code reads its tokens, so they have no
+* custom property or Tailwind class: a finding names the nearest token without a fix.
+*/
+/** Front matter section → category, in the spec's order. */
+const SECTIONS$1 = [
+	["colors", "color"],
+	["typography", "typography"],
+	["rounded", "radius"],
+	["spacing", "spacing"]
+];
+/** A DESIGN.md dimension: a number with px, em or rem, or a bare 0. */
+const DIMENSION = /^-?(?:\d+\.?\d*|\.\d+)(?:px|rem|em)$|^0$/;
+function parseDesignMd(text, file) {
+	const front = frontMatter(text);
+	if (front === void 0) return {
+		tokens: [],
+		warnings: [`${file}: no YAML front matter (between --- lines at the top)`]
+	};
+	const lineCounter = new LineCounter();
+	const doc = parseDocument(front.yaml, { lineCounter });
+	const [error] = doc.errors;
+	if (error) return {
+		tokens: [],
+		warnings: [`${file}: invalid YAML front matter (${error.message.split("\n")[0] ?? ""})`]
+	};
+	if (!isMap(doc.contents)) return {
+		tokens: [],
+		warnings: []
+	};
+	const warnings = [];
+	const raw = [];
+	const lineAt = (offset) => offset === void 0 ? 1 : lineCounter.linePos(offset).line + front.line;
+	const collect = (map, path, category) => {
+		for (const pair of map.items) {
+			const key = isScalar(pair.key) ? scalar(pair.key.value) : void 0;
+			if (key === void 0) continue;
+			const at = [...path, key];
+			const line = lineAt(isScalar(pair.key) ? pair.key.range?.[0] : void 0);
+			const node = pair.value;
+			if (isMap(node)) {
+				if (category === "typography") {
+					const value = Object.fromEntries(node.items.flatMap((p) => {
+						const property = isScalar(p.key) ? scalar(p.key.value) : void 0;
+						const value = isScalar(p.value) ? scalar(p.value.value) : void 0;
+						return property === void 0 || value === void 0 ? [] : [[property, value]];
+					}));
+					raw.push({
+						path: at,
+						category,
+						value,
+						line
+					});
+				} else collect(node, at, category);
+				continue;
+			}
+			const value = isScalar(node) ? scalar(node.value) : void 0;
+			if (value === void 0) {
+				warnings.push(`${file}: ${at.join(".")} has no value${category === "color" ? " (a # starts a YAML comment: quote hex colors)" : ""}`);
+				continue;
+			}
+			const length = category === "spacing" || category === "radius";
+			raw.push({
+				path: at,
+				category: length && !DIMENSION.test(value) && !isReference(value) ? "other" : category,
+				value,
+				line
+			});
+		}
+	};
+	for (const [section, category] of SECTIONS$1) {
+		const node = doc.contents.get(section, true);
+		if (isMap(node)) collect(node, [section], category);
+	}
+	const byPath = new Map(raw.map((t) => [t.path.join("."), t]));
+	const resolve = (value, seen) => {
+		const alias = reference(value);
+		if (alias === void 0) return value;
+		const target = byPath.get(alias);
+		if (!target || typeof target.value !== "string") {
+			warnings.push(`${file}: unresolved reference {${alias}}`);
+			return value;
+		}
+		if (seen.has(alias)) {
+			warnings.push(`${file}: circular reference {${alias}}`);
+			return value;
+		}
+		return resolve(target.value, /* @__PURE__ */ new Set([...seen, alias]));
+	};
+	return {
+		tokens: raw.map((t) => {
+			const name = t.path.join(".");
+			const value = typeof t.value === "string" ? resolve(t.value, /* @__PURE__ */ new Set([name])) : Object.entries(t.value).map(([k, v]) => `${k}: ${resolve(v, /* @__PURE__ */ new Set([name]))}`).join("; ");
+			const token = {
+				name,
+				category: t.category,
+				value,
+				usage: [],
+				source: {
+					file,
+					line: t.line
+				}
+			};
+			const alias = typeof t.value === "string" ? reference(t.value) : void 0;
+			if (alias && byPath.has(alias)) token.aliasOf = alias;
+			return token;
+		}),
+		warnings
+	};
+}
+/** The YAML between a first line of exactly `---` and the next such line, and the line it starts on. */
+function frontMatter(text) {
+	const lines = text.replace(/^\uFEFF/, "").split(/\r?\n/);
+	if (lines[0]?.trimEnd() !== "---") return void 0;
+	const end = lines.findIndex((line, i) => i > 0 && line.trimEnd() === "---");
+	if (end === -1) return void 0;
+	return {
+		yaml: lines.slice(1, end).join("\n"),
+		line: 1
+	};
+}
+/** A YAML scalar as text: strings, numbers and booleans; null (an empty value) is none. */
+function scalar(value) {
+	return typeof value === "string" || typeof value === "number" || typeof value === "boolean" ? String(value) : void 0;
+}
+function reference(value) {
+	return /^\{([^{}]+)\}$/.exec(value.trim())?.[1];
+}
+function isReference(value) {
+	return reference(value) !== void 0;
+}
+//#endregion
 //#region src/tokens/dtcg.ts
+/**
+* The `$extensions` key under which onsystem keeps what DTCG has no field for: the token's
+* own name, the custom property code uses, the Tailwind theme variable and the values in
+* other modes.
+*/
+const ONSYSTEM_EXTENSION = "com.github.dgesteves.onsystem";
 function parseDtcgTokens(text, file, options = {}) {
 	const warnings = [];
 	let json;
@@ -3936,13 +5529,16 @@ function parseDtcgTokens(text, file, options = {}) {
 			warnings: [`${file}: invalid JSON (${error.message})`]
 		};
 	}
-	if (!isObject$1(json)) return {
+	if (!isObject$2(json)) return {
 		tokens: [],
 		warnings: [`${file}: expected a JSON object`]
 	};
 	const lines = lineIndex(text);
+	const origins = /* @__PURE__ */ new WeakMap();
+	recordPaths(json, [], origins);
+	const tree = extendGroups(json, (message) => warnings.push(`${file}: ${message}`));
 	const raw = [];
-	walk(json, [], void 0, raw, lines);
+	walk(tree, [], void 0, raw, (node, path) => lines(origins.get(node) ?? path));
 	const byPath = new Map(raw.map((t) => [t.path.join("."), t]));
 	const resolve = (value, seen) => {
 		if (typeof value === "string") {
@@ -3962,7 +5558,7 @@ function parseDtcgTokens(text, file, options = {}) {
 			return value;
 		}
 		if (Array.isArray(value)) return value.map((v) => resolve(v, seen));
-		if (isObject$1(value)) {
+		if (isObject$2(value)) {
 			const ref = value.$ref;
 			if (typeof ref === "string" && Object.keys(value).length === 1) {
 				const pointer = ref.replace(/^#\//, "").split("/").filter((p) => p !== "$value");
@@ -3982,61 +5578,189 @@ function parseDtcgTokens(text, file, options = {}) {
 		const target = byPath.get(alias);
 		return target ? typeOf(target, seen) : void 0;
 	};
+	const nameOf = /* @__PURE__ */ new Map();
+	const taken = new Set(raw.filter((t) => !t.own?.name).map((t) => t.path.join(".")));
+	for (const t of raw) {
+		const path = t.path.join(".");
+		const own = t.own?.name;
+		const name = own !== void 0 && !taken.has(own) ? own : path;
+		taken.add(name);
+		nameOf.set(path, name);
+	}
 	return {
 		tokens: raw.map((t) => {
-			const name = t.path.join(".");
-			const aliasOf = aliasTarget(t.value);
+			const path = t.path.join(".");
+			const name = nameOf.get(path) ?? path;
+			const alias = aliasTarget(t.value);
+			const aliasOf = alias === void 0 ? void 0 : nameOf.get(alias) ?? alias;
 			const type = typeOf(t);
-			const value = formatValue(resolve(t.value, /* @__PURE__ */ new Set([name])), type);
+			const format = (value) => {
+				const resolved = resolve(value, /* @__PURE__ */ new Set([path]));
+				return t.own?.channels === "hsl" && hslChannels(resolved) || formatValue(resolved, type);
+			};
+			const segments = [options.prefix, ...t.path.filter((p) => p !== "$root")].filter(Boolean);
+			const generated = segments.length ? `--${segments.join("-").replace(/[^\w-]+/g, "-")}` : void 0;
+			const theme = t.own?.tailwind ? themeVariable(t.own.tailwind) : void 0;
 			const token = {
 				name,
 				category: categorize(type, t.path),
-				value,
-				cssVar: `--${[options.prefix, ...t.path].filter(Boolean).join("-").replace(/[^\w-]+/g, "-")}`,
+				value: format(t.value),
 				usage: [],
 				source: {
 					file,
 					line: t.line
 				}
 			};
+			const cssVar = t.own ? t.own.cssVar : generated;
+			if (cssVar) token.cssVar = cssVar;
+			if (theme) token.tailwind = theme.key;
 			if (aliasOf) token.aliasOf = aliasOf;
 			if (t.description) token.description = t.description;
 			if (t.deprecated) token.deprecated = t.deprecated;
-			if (t.modes) token.modes = Object.fromEntries(Object.entries(t.modes).map(([mode, v]) => [mode, formatValue(resolve(v, /* @__PURE__ */ new Set([name])), type)]));
-			token.usage = usageFor(token);
+			if (t.modes) token.modes = Object.fromEntries(Object.entries(t.modes).map(([mode, v]) => [mode, format(v)]));
+			token.usage = usageFor(token, theme?.namespace);
 			return token;
 		}),
 		warnings
 	};
 }
-function walk(node, path, inheritedType, out, lines) {
+function walk(node, path, inheritedType, out, lineOf) {
 	const type = typeof node.$type === "string" ? node.$type : inheritedType;
 	if ("$value" in node) {
 		const token = {
 			path,
 			value: node.$value ?? null,
-			line: lines(path)
+			line: lineOf(node, path)
 		};
 		if (type) token.type = type;
 		if (typeof node.$description === "string") token.description = node.$description;
 		if (node.$deprecated === true) token.deprecated = true;
 		else if (typeof node.$deprecated === "string") token.deprecated = node.$deprecated;
-		const modes = modesOf(node.$extensions);
+		const extension = onsystemExtension(node.$extensions);
+		const modes = extension?.modes ?? modesOf(node.$extensions);
 		if (modes) token.modes = modes;
+		if (extension) {
+			const { modes: _modes, ...own } = extension;
+			token.own = own;
+		}
 		out.push(token);
 		return;
 	}
 	for (const [key, child] of Object.entries(node)) {
-		if (key.startsWith("$") || !isObject$1(child)) continue;
-		walk(child, [...path, key], type, out, lines);
+		if (key.startsWith("$") && key !== "$root" || !isObject$2(child)) continue;
+		walk(child, [...path, key], type, out, lineOf);
+	}
+}
+/** Where each object of the file is, by path. */
+function recordPaths(node, path, into) {
+	into.set(node, path);
+	if ("$value" in node) return;
+	for (const [key, child] of Object.entries(node)) {
+		if (key.startsWith("$") && key !== "$root" || !isObject$2(child)) continue;
+		recordPaths(child, [...path, key], into);
+	}
+}
+/**
+* Resolves group extension: a group with `$extends` (or JSON Schema's `$ref`, its equivalent)
+* takes on every token and property of the group it names, and its own win where both define
+* one, group by group (a token is replaced whole). A `$ref` on an object without `$value`
+* that points at a token makes it an alias of that token. Unresolvable and circular
+* references, and `$extends` that names a token, are reported and left out.
+*/
+function extendGroups(root, warn) {
+	const done = /* @__PURE__ */ new Map();
+	const active = /* @__PURE__ */ new Set();
+	const expand = (node, path) => {
+		if ("$value" in node) return node;
+		const key = JSON.stringify(path);
+		const cached = done.get(key);
+		if (cached) return cached;
+		active.add(key);
+		const extendsRef = typeof node.$extends === "string" ? node.$extends : void 0;
+		const ref = extendsRef ?? (typeof node.$ref === "string" ? node.$ref : void 0);
+		const label = extendsRef === void 0 ? "$ref" : "$extends";
+		let out = {};
+		let result;
+		if (ref !== void 0) {
+			const target = referencePath(ref);
+			const found = target && lookup(root, target);
+			if (!target || !found) warn(`unresolved ${label} ${ref}`);
+			else if ("$value" in found) {
+				if (extendsRef !== void 0) warn(`$extends ${ref} names a token, not a group`);
+				else {
+					const { $ref: _ref, ...rest } = node;
+					result = {
+						...rest,
+						$value: `{${target.join(".")}}`
+					};
+				}
+			} else if (active.has(JSON.stringify(target))) warn(`circular ${label} ${ref}`);
+			else out = { ...expand(found, target) };
+		}
+		if (!result) {
+			for (const [k, v] of Object.entries(node)) {
+				if (k === "$extends" || k === "$ref" && extendsRef === void 0) continue;
+				if (isObject$2(v) && (!k.startsWith("$") || k === "$root")) {
+					const child = expand(v, [...path, k]);
+					const inherited = out[k];
+					out[k] = isGroup(inherited) && isGroup(child) ? mergeGroups(inherited, child) : child;
+				} else out[k] = v;
+			}
+			result = out;
+		}
+		active.delete(key);
+		done.set(key, result);
+		return result;
+	};
+	return expand(root, []);
+}
+/** `base` with `own` over it: tokens and properties replaced whole, groups merged. */
+function mergeGroups(base, own) {
+	const out = { ...base };
+	for (const [key, value] of Object.entries(own)) {
+		const inherited = out[key];
+		out[key] = (!key.startsWith("$") || key === "$root") && isGroup(inherited) && isGroup(value) ? mergeGroups(inherited, value) : value;
 	}
+	return out;
+}
+/** `{button}` or `#/button` → `["button"]`; a pointer's trailing `$value` is the token itself. */
+function referencePath(ref) {
+	const curly = /^\{([^{}]+)\}$/.exec(ref.trim())?.[1];
+	if (curly) return curly.split(".");
+	if (!ref.startsWith("#/")) return void 0;
+	const parts = ref.slice(2).split("/").map((p) => p.replaceAll("~1", "/").replaceAll("~0", "~"));
+	if (parts.at(-1) === "$value") parts.pop();
+	return parts.length ? parts : void 0;
+}
+function lookup(root, path) {
+	let node = root;
+	for (const key of path) {
+		if (!isObject$2(node)) return void 0;
+		node = node[key];
+	}
+	return isObject$2(node) ? node : void 0;
+}
+function isGroup(value) {
+	return isObject$2(value) && !("$value" in value);
+}
+/** The fields onsystem reads from its own `$extensions` entry, when they are well formed. */
+function onsystemExtension(extensions) {
+	const own = isObject$2(extensions) ? extensions[ONSYSTEM_EXTENSION] : void 0;
+	if (!isObject$2(own)) return void 0;
+	const out = {};
+	if (typeof own.name === "string" && /^[^\s{}]+$/.test(own.name)) out.name = own.name;
+	if (typeof own.cssVar === "string" && /^--[\w-]+$/.test(own.cssVar)) out.cssVar = own.cssVar;
+	if (typeof own.tailwind === "string" && themeVariable(own.tailwind)) out.tailwind = own.tailwind;
+	if (own.channels === "hsl") out.channels = "hsl";
+	if (isObject$2(own.modes)) out.modes = own.modes;
+	return out;
 }
 /** Modes are not standardised yet; accept the common `$extensions.mode(s)` shape. */
 function modesOf(extensions) {
-	if (!isObject$1(extensions)) return void 0;
+	if (!isObject$2(extensions)) return void 0;
 	for (const key of ["modes", "mode"]) {
 		const value = extensions[key];
-		if (isObject$1(value)) return value;
+		if (isObject$2(value)) return value;
 	}
 }
 function categorize(type, path) {
@@ -4060,6 +5784,13 @@ function categorize(type, path) {
 			return "other";
 	}
 }
+/** `214.3 31.8% 91.4%`: an HSL color as the bare channels a Tailwind v3 custom property holds. */
+function hslChannels(value) {
+	if (!isObject$2(value) || value.colorSpace !== "hsl" || !Array.isArray(value.components)) return;
+	const [h, s, l] = value.components.map((c) => formatValue(c, void 0));
+	if (h === void 0 || s === void 0 || l === void 0) return void 0;
+	return `${h} ${s}% ${l}%${typeof value.alpha === "number" && value.alpha < 1 ? ` / ${value.alpha}` : ""}`;
+}
 function formatValue(value, type) {
 	if (typeof value === "string") return value;
 	if (typeof value === "number" || typeof value === "boolean") return String(value);
@@ -4074,6 +5805,7 @@ function formatValue(value, type) {
 	if (type === "shadow") {
 		const s = value;
 		return [
+			s.inset === true ? "inset" : void 0,
 			s.offsetX,
 			s.offsetY,
 			s.blur,
@@ -4083,7 +5815,7 @@ function formatValue(value, type) {
 	}
 	return Object.entries(value).map(([k, v]) => `${k}: ${formatValue(v, void 0)}`).join("; ");
 }
-const COLOR_SPACES = {
+const COLOR_SPACES$1 = {
 	srgb: ([r, g, b]) => `rgb(${pct255(r)} ${pct255(g)} ${pct255(b)}`,
 	hsl: ([h, s, l]) => `hsl(${h} ${s}% ${l}%`,
 	hwb: ([h, w, b]) => `hwb(${h} ${w}% ${b}%`,
@@ -4097,14 +5829,14 @@ function formatColor(value) {
 	if (typeof value.hex === "string" && alpha === void 0) return value.hex;
 	const space = typeof value.colorSpace === "string" ? value.colorSpace : "srgb";
 	const components = Array.isArray(value.components) ? value.components.map((c) => formatValue(c, void 0)) : [];
-	const make = COLOR_SPACES[space];
+	const make = COLOR_SPACES$1[space];
 	return `${make ? make(components) : `color(${space} ${components.join(" ")}`}${alpha === void 0 ? "" : ` / ${alpha}`})`;
 }
 function pct255(component) {
 	if (component === void 0 || component === "none") return "none";
 	return String(Math.round(Number(component) * 255));
 }
-function isObject$1(value) {
+function isObject$2(value) {
 	return typeof value === "object" && value !== null && !Array.isArray(value);
 }
 /**
@@ -4212,7 +5944,7 @@ function scopedFamilies(tokens, filesUsing) {
 		const family = tokenFamily(token);
 		if (!family || scoped.has(family)) continue;
 		if (NAMED_SCOPES.has(family)) scoped.add(family);
-		else if (filesUsing && !CORE_FAMILIES.has(family) && !STATUS_WORDS.has(family) && (filesUsing.get(family)?.size ?? 0) <= 1) scoped.add(family);
+		else if (filesUsing && token.usage.length > 0 && !CORE_FAMILIES.has(family) && !STATUS_WORDS.has(family) && (filesUsing.get(family)?.size ?? 0) <= 1) scoped.add(family);
 	}
 	return scoped;
 }
@@ -4270,165 +6002,774 @@ const KIND_WORDS = [
 	]]
 ];
 /**
-* The name that says what a token is for: a sidebar's own palette mirrors the
-* core one, so `sidebar-accent` is an `accent` and `sidebar-foreground` a
-* `foreground`. shadcn/ui's sidebar surface is `--sidebar` (v4) or
-* `--sidebar-background` (v3).
+* The name that says what a token is for: a sidebar's own palette mirrors the
+* core one, so `sidebar-accent` is an `accent` and `sidebar-foreground` a
+* `foreground`. shadcn/ui's sidebar surface is `--sidebar` (v4) or
+* `--sidebar-background` (v3).
+*/
+function roleKey(token) {
+	const key = tokenKey(token);
+	return key === "sidebar" ? "background" : key.replace(/^sidebar-/, "");
+}
+/** What a token is for, from its name: shadcn/ui's conventions and common DTCG names. */
+function kindOf(key) {
+	const segments = key.split("-");
+	for (const [kind, words] of KIND_WORDS) if (segments.some((s) => words.includes(s))) return kind;
+	return "other";
+}
+/** Tokens made for each role, in the order to prefer them when their values tie. */
+const PREFERRED = {
+	text: ["foreground", "muted-foreground"],
+	surface: [
+		"background",
+		"muted",
+		"secondary",
+		"accent",
+		"card",
+		"popover"
+	],
+	line: [
+		"border",
+		"input",
+		"ring"
+	]
+};
+/** Plain text colors, as opposed to the text that goes on one surface (`card-foreground`). */
+const GENERIC_TEXT = /^(?:muted-foreground|(?:foreground|text|fg)(?:-(?:default|base|primary|secondary|muted|subtle))?)$/;
+function roleFit(token, role) {
+	if (!role) return {
+		tier: 1,
+		rank: 0
+	};
+	const key = roleKey(token);
+	const index = PREFERRED[role].indexOf(key);
+	const rank = index === -1 ? PREFERRED[role].length : index;
+	const kind = kindOf(key);
+	switch (role) {
+		case "text":
+			if (kind === "foreground") return {
+				tier: GENERIC_TEXT.test(key) ? 0 : 1,
+				rank
+			};
+			return {
+				tier: kind === "other" ? 1 : 2,
+				rank
+			};
+		case "surface": return {
+			tier: kind === "surface" ? 0 : kind === "foreground" ? 2 : 1,
+			rank
+		};
+		case "line": return {
+			tier: kind === "line" ? 0 : kind === "other" ? 1 : 2,
+			rank
+		};
+	}
+}
+//#endregion
+//#region src/types.ts
+/**
+* The design-system model the server exposes. Everything here is plain JSON so
+* it can be cached on disk and returned as MCP structured content.
+*/
+const TOKEN_CATEGORIES = [
+	"color",
+	"spacing",
+	"radius",
+	"typography",
+	"shadow",
+	"other"
+];
+//#endregion
+//#region src/tokens/export.ts
+/** Group names a DTCG or DESIGN.md token path may already start with, per category. */
+const GROUP_NAMES = {
+	color: [
+		"color",
+		"colors",
+		"colour",
+		"colours"
+	],
+	spacing: ["spacing", "space"],
+	radius: [
+		"radius",
+		"radii",
+		"rounded"
+	],
+	typography: [
+		"typography",
+		"font",
+		"fonts"
+	],
+	shadow: [
+		"shadow",
+		"shadows",
+		"elevation"
+	],
+	other: []
+};
+/**
+* The tokens as a DTCG 2025.10 file: a group per category, colors as color objects in their
+* own color space, lengths as `{ value, unit }`, aliases as references, and what DTCG has no
+* field for (the token's name, the custom property, the Tailwind theme variable, dark and
+* other modes) under `$extensions["com.github.dgesteves.onsystem"]`.
+*/
+function toDtcg(tokens) {
+	const warnings = [];
+	const paths = assignPaths(tokens, warnings);
+	const lookup = varLookup(tokens);
+	const byName = new Map(tokens.map((t) => [t.name, t]));
+	const tree = {};
+	let count = 0;
+	for (const category of TOKEN_CATEGORIES) for (const token of tokens) {
+		const path = token.category === category ? paths.get(token) : void 0;
+		if (!path) continue;
+		const own = typed(token.value, token, lookup);
+		const target = token.aliasOf ? byName.get(token.aliasOf) : void 0;
+		const targetPath = target ? paths.get(target) : void 0;
+		const node = {};
+		const type = target && targetPath ? typed(target.value, target, lookup).type : own.type;
+		if (type) node.$type = type;
+		node.$value = targetPath ? `{${targetPath.join(".")}}` : own.value;
+		if (token.description) node.$description = token.description;
+		if (token.deprecated) node.$deprecated = token.deprecated;
+		const extension = {};
+		if (token.name !== path.join(".")) extension.name = token.name;
+		if (token.cssVar) extension.cssVar = token.cssVar;
+		const tailwind = tailwindVariable(token);
+		if (tailwind) extension.tailwind = tailwind;
+		if (own.channels) extension.channels = "hsl";
+		if (token.modes && Object.keys(token.modes).length) extension.modes = Object.fromEntries(Object.entries(token.modes).map(([mode, value]) => [mode, typed(value, token, lookup).value]));
+		if (Object.keys(extension).length) node.$extensions = { [ONSYSTEM_EXTENSION]: extension };
+		insert(tree, path, node);
+		count++;
+	}
+	return {
+		text: `${JSON.stringify(tree, null, 2).replace(/\[\n\s*([^[\]{}]*?)\n\s*\]/g, (_, items) => `[${items.split(/,\n\s*/).join(", ")}]`)}\n`,
+		count,
+		warnings
+	};
+}
+/**
+* Each token's path: its category, then its name without that category (`primary` →
+* `color.primary`, `radius-md` → `radius.md`, `color.brand.500` as it is). The spacing unit,
+* named like its group, is the group's `$root`; so is a token whose path is also a group.
+*/
+function assignPaths(tokens, warnings) {
+	const out = /* @__PURE__ */ new Map();
+	const taken = /* @__PURE__ */ new Set();
+	const key = (path) => JSON.stringify(path);
+	for (const token of tokens) {
+		const path = [[token.category, ...leaf(token)], [token.category, ...token.name.split(".")]].find((p) => !taken.has(key(p)));
+		if (!path) {
+			warnings.push(`${token.name} is left out: another token has the same path`);
+			continue;
+		}
+		taken.add(key(path));
+		out.set(token, path);
+	}
+	const groups = /* @__PURE__ */ new Set();
+	for (const path of out.values()) for (let i = 1; i < path.length; i++) groups.add(key(path.slice(0, i)));
+	for (const [token, path] of out) {
+		if (!groups.has(key(path))) continue;
+		const root = [...path, "$root"];
+		if (taken.has(key(root))) {
+			warnings.push(`${token.name} is left out: another token has the same path`);
+			out.delete(token);
+			continue;
+		}
+		taken.add(key(root));
+		out.set(token, root);
+	}
+	return out;
+}
+/** A token's path within its category group. */
+function leaf(token) {
+	const group = token.category;
+	if (token.name.includes(".")) {
+		const parts = token.name.split(".");
+		const [first = ""] = parts;
+		return parts.length > 1 && GROUP_NAMES[group].includes(first.toLowerCase()) ? parts.slice(1) : parts;
+	}
+	if (token.name.startsWith(`${group}-`)) return [token.name.slice(group.length + 1)];
+	if (token.name !== group) return [token.name];
+	return [token.tailwind || "$root"];
+}
+function insert(tree, path, node) {
+	let group = tree;
+	for (const key of path.slice(0, -1)) {
+		const next = group[key];
+		if (isObject$1(next)) group = next;
+		else {
+			const created = {};
+			group[key] = created;
+			group = created;
+		}
+	}
+	group[path.at(-1) ?? ""] = node;
+}
+/**
+* The Tailwind theme variable a token is exposed through: `--color-primary` for `bg-primary`,
+* `--spacing` for the spacing unit. Tailwind v3 colors come from its config, and read the same.
+*/
+function tailwindVariable(token) {
+	const key = token.tailwind;
+	if (key === void 0) return void 0;
+	const utility = token.usage.find((u) => !u.includes("(")) ?? "";
+	switch (token.category) {
+		case "color": return `--color-${key}`;
+		case "spacing": return key ? `--spacing-${key}` : "--spacing";
+		case "radius": return `--radius-${key}`;
+		case "shadow": return `--${/^(inset-shadow|drop-shadow|text-shadow|shadow)-/.exec(utility)?.[1] ?? "shadow"}-${key}`;
+		case "typography": {
+			const kind = typographyKind(token);
+			if (kind === "fontWeight") return `--font-weight-${key}`;
+			if (kind === "fontFamily") return `--font-${key}`;
+			if (kind === "lineHeight") return `--leading-${key}`;
+			if (kind === "letterSpacing") return `--tracking-${key}`;
+			if (kind === "fontSize") return `--text-${key}`;
+			return;
+		}
+		default: return;
+	}
+}
+/** Custom property → value, for lengths that read another token (`calc(var(--radius) - 4px)`). */
+function varLookup(tokens) {
+	const values = /* @__PURE__ */ new Map();
+	for (const token of tokens) values.set(token.cssVar ?? `--${token.name}`, token.value);
+	return (name) => values.get(name);
+}
+/**
+* A CSS value in DTCG form. Values DTCG has no type for (`color-mix()`, `var()` without a
+* token, lengths in `em` or `%`) stay strings without `$type`, which onsystem reads back as is.
+*/
+function typed(value, token, lookup) {
+	switch (token.category) {
+		case "color": return colorValue(value);
+		case "spacing":
+		case "radius": return dimensionValue(value, lookup) ?? { value };
+		case "typography": return typographyValue(value, token) ?? { value };
+		case "shadow": {
+			const shadow = shadowValue(value);
+			return shadow ? {
+				type: "shadow",
+				value: shadow
+			} : { value };
+		}
+		default: return { value };
+	}
+}
+function colorValue(value) {
+	if (!parseColor(value, { bareHsl: true })) return { value };
+	const bare = isBareHsl(value);
+	const color = colorObject(bare ? `hsl(${value.replace(/,/g, " ")})` : value);
+	if (!color) return { value };
+	return bare ? {
+		type: "color",
+		value: color,
+		channels: true
+	} : {
+		type: "color",
+		value: color
+	};
+}
+/** culori mode → DTCG color space, its channels, and the factor from culori's range to DTCG's. */
+const COLOR_SPACES = {
+	rgb: {
+		space: "srgb",
+		channels: [
+			"r",
+			"g",
+			"b"
+		]
+	},
+	lrgb: {
+		space: "srgb-linear",
+		channels: [
+			"r",
+			"g",
+			"b"
+		]
+	},
+	hsl: {
+		space: "hsl",
+		channels: [
+			"h",
+			"s",
+			"l"
+		],
+		scale: [
+			1,
+			100,
+			100
+		]
+	},
+	hwb: {
+		space: "hwb",
+		channels: [
+			"h",
+			"w",
+			"b"
+		],
+		scale: [
+			1,
+			100,
+			100
+		]
+	},
+	lab: {
+		space: "lab",
+		channels: [
+			"l",
+			"a",
+			"b"
+		]
+	},
+	lch: {
+		space: "lch",
+		channels: [
+			"l",
+			"c",
+			"h"
+		]
+	},
+	oklab: {
+		space: "oklab",
+		channels: [
+			"l",
+			"a",
+			"b"
+		]
+	},
+	oklch: {
+		space: "oklch",
+		channels: [
+			"l",
+			"c",
+			"h"
+		]
+	},
+	p3: {
+		space: "display-p3",
+		channels: [
+			"r",
+			"g",
+			"b"
+		]
+	},
+	a98: {
+		space: "a98-rgb",
+		channels: [
+			"r",
+			"g",
+			"b"
+		]
+	},
+	prophoto: {
+		space: "prophoto-rgb",
+		channels: [
+			"r",
+			"g",
+			"b"
+		]
+	},
+	rec2020: {
+		space: "rec2020",
+		channels: [
+			"r",
+			"g",
+			"b"
+		]
+	},
+	xyz65: {
+		space: "xyz-d65",
+		channels: [
+			"x",
+			"y",
+			"z"
+		]
+	},
+	xyz50: {
+		space: "xyz-d50",
+		channels: [
+			"x",
+			"y",
+			"z"
+		]
+	}
+};
+const toOklch = converter("oklch");
+/**
+* A CSS color as a DTCG color object, in the color space it is written in (others in OKLCH).
+* An 8-bit sRGB color also gets its `hex`.
 */
-function roleKey(token) {
-	const key = tokenKey(token);
-	return key === "sidebar" ? "background" : key.replace(/^sidebar-/, "");
+function colorObject(css) {
+	const parsed = parse(css);
+	if (!parsed) return void 0;
+	const known = COLOR_SPACES[parsed.mode];
+	const color = known ? parsed : toOklch(parsed);
+	const spec = known ?? {
+		space: "oklch",
+		channels: [
+			"l",
+			"c",
+			"h"
+		]
+	};
+	const channels = color;
+	const components = spec.channels.map((channel, i) => {
+		const v = channels[channel];
+		return v === void 0 || Number.isNaN(v) ? "none" : round(v * (spec.scale?.[i] ?? 1));
+	});
+	const out = {
+		colorSpace: spec.space,
+		components
+	};
+	const alpha = color.alpha;
+	if (alpha !== void 0 && alpha < 1) out.alpha = round(alpha);
+	else if (spec.space === "srgb" && components.every((c) => typeof c === "number" && Math.abs(c * 255 - Math.round(c * 255)) < .001)) out.hex = formatHex(color);
+	return out;
 }
-/** What a token is for, from its name: shadcn/ui's conventions and common DTCG names. */
-function kindOf(key) {
-	const segments = key.split("-");
-	for (const [kind, words] of KIND_WORDS) if (segments.some((s) => words.includes(s))) return kind;
-	return "other";
+const PLAIN_LENGTH = /^(-?(?:\d+\.?\d*|\.\d+))(px|rem)$/;
+/** `0.5rem` → `{ value: 0.5, unit: "rem" }`; a `calc()` of tokens → its px value. */
+function dimensionValue(value, lookup) {
+	const plain = plainDimension(value);
+	if (plain) return {
+		type: "dimension",
+		value: plain
+	};
+	const px = evaluateLength(value, lookup);
+	if (px === void 0 || !Number.isFinite(px)) return void 0;
+	return {
+		type: "dimension",
+		value: {
+			value: round(px),
+			unit: "px"
+		}
+	};
 }
-/** Tokens made for each role, in the order to prefer them when their values tie. */
-const PREFERRED = {
-	text: ["foreground", "muted-foreground"],
-	surface: [
-		"background",
-		"muted",
-		"secondary",
-		"accent",
-		"card",
-		"popover"
-	],
-	line: [
-		"border",
-		"input",
-		"ring"
-	]
-};
-/** Plain text colors, as opposed to the text that goes on one surface (`card-foreground`). */
-const GENERIC_TEXT = /^(?:muted-foreground|(?:foreground|text|fg)(?:-(?:default|base|primary|secondary|muted|subtle))?)$/;
-function roleFit(token, role) {
-	if (!role) return {
-		tier: 1,
-		rank: 0
+function plainDimension(value) {
+	const text = value.trim();
+	if (text === "0") return {
+		value: 0,
+		unit: "px"
 	};
-	const key = roleKey(token);
-	const index = PREFERRED[role].indexOf(key);
-	const rank = index === -1 ? PREFERRED[role].length : index;
-	const kind = kindOf(key);
-	switch (role) {
-		case "text":
-			if (kind === "foreground") return {
-				tier: GENERIC_TEXT.test(key) ? 0 : 1,
-				rank
+	const match = PLAIN_LENGTH.exec(text);
+	return match ? {
+		value: Number(match[1]),
+		unit: match[2] ?? "px"
+	} : void 0;
+}
+const COMPOSITE = /^[\w-]+\s*:\s*[^;]+(?:;\s*[\w-]+\s*:\s*[^;]+)*;?$/;
+const NUMBER = /^-?(?:\d+\.?\d*|\.\d+)$/;
+/** What a typography token sets, from its name and Tailwind class (`font-sans`, `text-sm`). */
+function typographyKind(token) {
+	const value = token.value.trim();
+	if (COMPOSITE.test(value)) return "composite";
+	const utility = token.usage.find((u) => !u.includes("(")) ?? "";
+	const name = `${token.name} ${utility}`.toLowerCase();
+	if (/weight/.test(name) || utility.startsWith("font-") && /^\d+$/.test(value)) return "fontWeight";
+	if (/leading|line-?height/.test(name)) return "lineHeight";
+	if (/tracking|letter-?spacing/.test(name)) return "letterSpacing";
+	if (/(?:^|[\s.-])text-|size/.test(name)) return "fontSize";
+	if (/font|family/.test(name)) return "fontFamily";
+}
+function typographyValue(value, token) {
+	const text = value.trim();
+	switch (typographyKind(token)) {
+		case "fontFamily": return {
+			type: "fontFamily",
+			value: fontFamilies(text)
+		};
+		case "fontWeight": {
+			const n = weight(text);
+			return n === void 0 ? void 0 : {
+				type: "fontWeight",
+				value: n
 			};
-			return {
-				tier: kind === "other" ? 1 : 2,
-				rank
+		}
+		case "lineHeight": {
+			if (NUMBER.test(text)) return {
+				type: "number",
+				value: Number(text)
 			};
-		case "surface": return {
-			tier: kind === "surface" ? 0 : kind === "foreground" ? 2 : 1,
-			rank
-		};
-		case "line": return {
-			tier: kind === "line" ? 0 : kind === "other" ? 1 : 2,
-			rank
+			const length = plainDimension(text);
+			return length && {
+				type: "dimension",
+				value: length
+			};
+		}
+		case "fontSize":
+		case "letterSpacing": {
+			const length = plainDimension(text);
+			return length && {
+				type: "dimension",
+				value: length
+			};
+		}
+		case "composite": return {
+			type: "typography",
+			value: composite(text)
 		};
+		default: return;
 	}
 }
-const LENGTH = /^(-?(?:\d+\.?\d*|\.\d+))(px|rem|em)?$/i;
-/** `"0.5rem"` → 8, `"12px"` → 12, `"4"` → 4. Returns undefined for anything else. */
-function lengthToPx(value) {
-	if (typeof value === "number") return Number.isFinite(value) ? value : void 0;
-	const match = LENGTH.exec(value.trim());
-	if (!match) return void 0;
-	const n = Number(match[1]);
-	return (match[2] ?? "px").toLowerCase() === "px" ? n : n * 16;
+/** `fontFamily: Inter; fontSize: 16px` → `{ fontFamily: "Inter", fontSize: { value: 16, unit: "px" } }`. */
+function composite(text) {
+	const out = {};
+	for (const [key, value] of pairs(text)) if (key === "fontFamily") out[key] = fontFamilies(value);
+	else if (key === "fontWeight") out[key] = weight(value) ?? value;
+	else if (key === "lineHeight" && NUMBER.test(value)) out[key] = Number(value);
+	else out[key] = plainDimension(value) ?? value;
+	return out;
 }
-function formatPx(px) {
-	return `${Number(px.toFixed(2))}px`;
+/** `fontFamily: Inter; fontSize: 16px` → `[["fontFamily", "Inter"], ["fontSize", "16px"]]`. */
+function pairs(text) {
+	return text.split(";").flatMap((part) => {
+		const colon = part.indexOf(":");
+		const key = part.slice(0, colon).trim();
+		const value = part.slice(colon + 1).trim();
+		return colon > 0 && key && value ? [[key, value]] : [];
+	});
 }
-/**
-* Evaluates a length that may use `var()` and `calc()` to px:
-* `calc(var(--radius) - 4px)` with `--radius: 0.625rem` → 6.
-*/
-function evaluateLength(value, resolve, depth = 0) {
-	if (depth > 16) return void 0;
-	const expanded = expandVars(value.trim(), resolve, depth);
-	if (expanded === void 0) return void 0;
-	const direct = lengthToPx(expanded);
-	if (direct !== void 0) return direct;
-	const calc = /^calc\((.*)\)$/is.exec(expanded);
-	return calc?.[1] !== void 0 ? evaluateCalc(calc[1]) : void 0;
+function weight(value) {
+	const n = Number(value);
+	return /^\d+$/.test(value) && n >= 1 && n <= 1e3 ? n : void 0;
+}
+/** `"Geist", ui-sans-serif` → `["Geist", "ui-sans-serif"]`; one family, or a `var()`, stays a string. */
+function fontFamilies(value) {
+	if (value.includes("var(")) return value;
+	const families = splitTopLevel$1(value, ",").map((f) => f.trim().replace(/^(["'])(.*)\1$/, "$2")).filter(Boolean);
+	return families.length === 1 ? families[0] ?? value : families;
+}
+/** `0 1px 2px 0 rgb(0 0 0 / 0.05)` → a DTCG shadow object; several layers → an array of them. */
+function shadowValue(value) {
+	const layers = [];
+	for (const layer of splitTopLevel$1(value, ",")) {
+		let inset = false;
+		let color;
+		const lengths = [];
+		for (const part of splitTopLevel$1(layer.trim(), " ")) {
+			if (!part) continue;
+			const length = plainDimension(part);
+			if (part === "inset") inset = true;
+			else if (length) lengths.push(length);
+			else if (!color && parseColor(part)) color = colorObject(part);
+			else return void 0;
+		}
+		const [offsetX, offsetY, blur = zero(), spread = zero()] = lengths;
+		if (!color || !offsetX || !offsetY || lengths.length > 4) return void 0;
+		layers.push({
+			color,
+			offsetX,
+			offsetY,
+			blur,
+			spread,
+			...inset ? { inset: true } : {}
+		});
+	}
+	if (!layers.length) return void 0;
+	return layers.length === 1 ? layers[0] ?? null : layers;
 }
-function expandVars(value, resolve, depth) {
-	let out = "";
-	let last = 0;
-	for (const match of value.matchAll(/var\(\s*(--[\w-]+)\s*(?:,\s*([^)]+))?\)/g)) {
-		const [whole, name = "", fallback] = match;
-		const resolved = resolve(name) ?? fallback;
-		const px = resolved === void 0 ? void 0 : evaluateLength(resolved, resolve, depth + 1);
-		if (px === void 0) return void 0;
-		out += `${value.slice(last, match.index)}${px}px`;
-		last = match.index + whole.length;
+function zero() {
+	return {
+		value: 0,
+		unit: "px"
+	};
+}
+/** Splits on `separator` outside parentheses and quotes. */
+function splitTopLevel$1(text, separator) {
+	const parts = [];
+	let depth = 0;
+	let quote;
+	let start = 0;
+	for (let i = 0; i < text.length; i++) {
+		const ch = text[i];
+		if (quote) {
+			if (ch === quote) quote = void 0;
+		} else if (ch === "\"" || ch === "'") quote = ch;
+		else if (ch === "(") depth++;
+		else if (ch === ")") depth--;
+		else if (depth === 0 && (separator === " " ? /\s/.test(ch ?? "") : ch === separator)) {
+			parts.push(text.slice(start, i));
+			start = i + 1;
+		}
 	}
-	return out + value.slice(last);
+	parts.push(text.slice(start));
+	return parts;
 }
-const CALC_TOKEN = /-?(?:\d+\.?\d*|\.\d+)(?:px|rem|em)?|[()+\-*/]|calc/gi;
+function round(n) {
+	return Number(n.toFixed(6));
+}
+function isObject$1(value) {
+	return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+/** DESIGN.md sections in the spec's order, each with the front matter key it fills. */
+const SECTIONS = [
+	{
+		category: "color",
+		heading: "Colors",
+		key: "colors",
+		intro: "Use these colors instead of hex, rgb() or Tailwind palette values."
+	},
+	{
+		category: "typography",
+		heading: "Typography",
+		key: "typography",
+		intro: "The font families, sizes and weights of the design system."
+	},
+	{
+		category: "spacing",
+		heading: "Layout",
+		key: "spacing",
+		intro: "Use these spacing steps instead of arbitrary lengths."
+	},
+	{
+		category: "shadow",
+		heading: "Elevation & Depth",
+		intro: "The shadows of the design system."
+	},
+	{
+		category: "radius",
+		heading: "Shapes",
+		key: "rounded",
+		intro: "Use these corner radii instead of arbitrary values."
+	},
+	{
+		category: "other",
+		heading: "Other tokens",
+		intro: "Tokens that are not colors, typography, spacing, shadows or radii."
+	}
+];
+/** The front matter keys, in the order of the spec's schema. */
+const FRONT_MATTER_ORDER = [
+	"colors",
+	"typography",
+	"rounded",
+	"spacing"
+];
 /**
-* Tiny recursive-descent evaluator for `+ - * /` over px/rem/em/unitless
-* numbers. Anything else (`%`, `vw`, `ch`, functions) has no fixed px value,
-* so the whole expression is undefined.
+* The tokens as a DESIGN.md: front matter with the colors, typography, rounded corners and
+* spacing in the spec's schema, then a heading per category with a table of its tokens, their
+* values in each mode and how code uses them.
 */
-function evaluateCalc(expression) {
-	if (expression.replace(CALC_TOKEN, "").trim()) return void 0;
-	const tokens = expression.match(CALC_TOKEN);
-	if (!tokens) return void 0;
-	let i = 0;
-	const primary = () => {
-		const token = tokens[i++];
-		if (token === void 0) return void 0;
-		if (token.toLowerCase() === "calc") return primary();
-		if (token === "(") {
-			const v = sum();
-			i++;
-			return v;
-		}
-		const px = lengthToPx(token);
-		if (px === void 0) return void 0;
-		return {
-			n: px,
-			length: /[a-z]$/i.test(token)
-		};
+function toDesignMd(tokens, options) {
+	const warnings = [];
+	const lookup = varLookup(tokens);
+	const keys = designKeys(tokens);
+	const front = {
+		version: "alpha",
+		name: options.name
 	};
-	const product = () => {
-		let left = primary();
-		while (left && (tokens[i] === "*" || tokens[i] === "/")) {
-			const op = tokens[i++];
-			const right = primary();
-			if (!right) return void 0;
-			left = op === "*" ? {
-				n: left.n * right.n,
-				length: left.length || right.length
-			} : {
-				n: left.n / right.n,
-				length: left.length
-			};
+	const sections = {};
+	const body = [`# ${options.name}`];
+	const byName = new Map(tokens.map((t) => [t.name, t]));
+	for (const section of SECTIONS) {
+		const list = tokens.filter((t) => t.category === section.category);
+		if (!list.length) continue;
+		if (section.key) {
+			const values = {};
+			for (const token of list) {
+				const key = keys.get(token);
+				if (key === void 0) continue;
+				const target = token.aliasOf ? byName.get(token.aliasOf) : void 0;
+				const targetKey = target?.category === token.category && frontMatterValue(target, section.key, lookup) !== void 0 ? keys.get(target) : void 0;
+				const value = targetKey === void 0 ? frontMatterValue(token, section.key, lookup) : `{${section.key}.${targetKey}}`;
+				if (value === void 0) continue;
+				if (key in values) {
+					warnings.push(`${token.name} is left out of the front matter: another token has its key`);
+					continue;
+				}
+				values[key] = value;
+			}
+			if (Object.keys(values).length) sections[section.key] = values;
 		}
-		return left;
+		body.push("", `## ${section.heading}`, "", section.intro, "", ...table(list, keys));
+	}
+	for (const key of FRONT_MATTER_ORDER) if (sections[key]) front[key] = sections[key];
+	return {
+		text: `---\n${stringify(front, { lineWidth: 0 })}---\n\n${body.join("\n")}\n`,
+		count: tokens.length,
+		warnings
 	};
-	const sum = () => {
-		let left = product();
-		while (left && (tokens[i] === "+" || tokens[i] === "-")) {
-			const op = tokens[i++];
-			const right = product();
-			if (!right) return void 0;
-			left = {
-				n: op === "+" ? left.n + right.n : left.n - right.n,
-				length: true
-			};
+}
+/** Each token's key in its section: its DTCG path without the group, joined with `-`. */
+function designKeys(tokens) {
+	const out = /* @__PURE__ */ new Map();
+	for (const token of tokens) {
+		const parts = leaf(token).filter((p) => p !== "$root");
+		out.set(token, parts.join("-") || "base");
+	}
+	return out;
+}
+function frontMatterValue(token, key, lookup) {
+	const value = token.value.trim();
+	switch (key) {
+		case "colors":
+			if (!parseColor(value, { bareHsl: true })) return void 0;
+			return isBareHsl(value) ? `hsl(${value})` : value;
+		case "rounded":
+		case "spacing": {
+			if (DESIGN_DIMENSION.test(value) || value === "0") return value;
+			const px = evaluateLength(value, lookup);
+			return px === void 0 || !Number.isFinite(px) ? void 0 : `${round(px)}px`;
 		}
-		return left;
-	};
-	const result = sum();
-	return result && Number.isFinite(result.n) ? result.n : void 0;
+		case "typography": return designTypography(token);
+	}
+}
+/** A DESIGN.md dimension: px, em or rem. */
+const DESIGN_DIMENSION = /^-?(?:\d+\.?\d*|\.\d+)(?:px|rem|em)$/;
+/**
+* A typography token as a DESIGN.md typography level: `{ fontFamily: "Inter" }` for
+* `--font-sans`, every property of a composite. A `var()` is no font name (`next/font` sets
+* it at runtime), and a value the schema has no form for is left out.
+*/
+function designTypography(token) {
+	const value = token.value.trim();
+	const kind = typographyKind(token);
+	const entries = kind === "composite" ? pairs(value) : kind ? [[kind, value]] : [];
+	const out = {};
+	for (const [property, v] of entries) if (property === "fontFamily") {
+		if (!v.includes("var(")) out[property] = v;
+	} else if (property === "fontWeight") {
+		const n = weight(v);
+		if (n !== void 0) out[property] = n;
+	} else if (property === "lineHeight") {
+		if (NUMBER.test(v)) out[property] = Number(v);
+		else if (DESIGN_DIMENSION.test(v)) out[property] = v;
+	} else if (property === "fontSize" || property === "letterSpacing") {
+		if (DESIGN_DIMENSION.test(v)) out[property] = v;
+	} else out[property] = v;
+	return Object.keys(out).length ? out : void 0;
+}
+/** A Markdown table of tokens: key, value, a column per mode, how code uses it, and the description. */
+function table(tokens, keys) {
+	const modes = [...new Set(tokens.flatMap((t) => Object.keys(t.modes ?? {})))];
+	const described = tokens.some((t) => t.description);
+	const header = [
+		"Token",
+		"Value",
+		...modes.map((m) => m.charAt(0).toUpperCase() + m.slice(1)),
+		"Use",
+		...described ? ["Description"] : []
+	];
+	const code = (text) => text ? `\`${text}\`` : "";
+	const rows = tokens.map((token) => [
+		code(keys.get(token) ?? token.name),
+		code(token.value),
+		...modes.map((m) => code(token.modes?.[m])),
+		use(token),
+		...described ? [token.description ?? ""] : []
+	]);
+	const line = (cells) => `| ${cells.map((c) => c.replace(/\|/g, "\\|")).join(" | ")} |`;
+	return [
+		line(header),
+		line(header.map(() => "---")),
+		...rows.map(line)
+	];
+}
+/** `bg-primary`, `var(--primary)`: the first utility class and the CSS reference. */
+function use(token) {
+	return [token.usage.find((u) => !u.includes("(")), cssReference(token)].filter((u) => Boolean(u)).map((u) => `\`${u}\``).join(", ");
 }
 //#endregion
 //#region src/tokens/index.ts
@@ -4441,7 +6782,7 @@ async function loadTokens(root, sources) {
 		const rel = relativePath(root, source.file);
 		let text;
 		try {
-			text = await fs$1.readFile(source.file, "utf8");
+			text = await fsp.readFile(source.file, "utf8");
 		} catch {
 			warnings.push(`${rel}: token file not found`);
 			continue;
@@ -4453,6 +6794,10 @@ async function loadTokens(root, sources) {
 				const result = parseDtcgTokens(text, rel, options);
 				all.push(...result.tokens);
 				warnings.push(...result.warnings);
+			} else if (ext === ".md" || ext === ".markdown") {
+				const result = parseDesignMd(text, rel);
+				all.push(...result.tokens);
+				warnings.push(...result.warnings);
 			} else {
 				sheets.push(readCssSheet(text, rel));
 				sheetsAt ??= all.length;
@@ -4561,7 +6906,7 @@ var TokenIndex = class {
 				...colorModes(token)
 			});
 			if (token.tailwind) this.colorKeys.add(token.tailwind);
-		} else if (token.category === "spacing" || token.category === "radius") {
+		} else if ((token.category === "spacing" || token.category === "radius") && token.origin !== "library") {
 			const px = evaluateLength(token.value, resolve);
 			if (px === void 0) continue;
 			if (token.category === "spacing" && token.tailwind === "") {
@@ -5142,6 +7487,8 @@ var LintTarget = class {
 	moduleDirs = /* @__PURE__ */ new Set();
 	/** The files extraction read, when the model says. */
 	sources;
+	/** Published libraries the model read from type declarations: `@mui/material`. */
+	libraries;
 	/**
 	* `resolver` finds the module an import points at and what it exports
 	* (`@calcom/ui/components/icon` → `components/icon/index.ts`), so a name from
@@ -5153,13 +7500,14 @@ var LintTarget = class {
 		this.config = config;
 		this.resolver = resolver;
 		const rank = designSystemRank(config.designSystems);
+		this.libraries = new Set(model.components.flatMap((c) => c.library ? [c.library] : []));
 		const byRank = [...model.components].sort((a, b) => rank(b) - rank(a));
 		for (const component of byRank) for (const name of [component.name, ...component.aliases]) {
 			this.components.set(name, component);
 			this.named.set(name, [...this.named.get(name) ?? [], component]);
 		}
 		this.tokens = new TokenIndex(model.tokens, { filesUsing: model.components.length ? familyUsage(model) : void 0 });
-		this.componentFiles = new Set(model.components.map((c) => c.source.file));
+		this.componentFiles = new Set(model.components.filter((c) => !c.library).map((c) => c.source.file));
 		this.exports = new Set(model.exports);
 		for (const component of model.components) {
 			if (component.parent) continue;
@@ -5181,7 +7529,7 @@ var LintTarget = class {
 		}
 		this.importPaths = new Set(model.components.map((c) => c.importPath));
 		const pattern = config.importPath?.indexOf("{path}") ?? -1;
-		this.importPrefixes = config.importPath ? [pattern === -1 ? `${config.importPath}/` : config.importPath.slice(0, pattern)] : unique([...this.importPaths].filter((p) => !p.startsWith(".")).map((p) => isPackageName(p) ? `${p}/` : p.slice(0, p.lastIndexOf("/") + 1)).filter(Boolean));
+		this.importPrefixes = unique([...config.importPath ? [pattern === -1 ? `${config.importPath}/` : config.importPath.slice(0, pattern)] : [...this.importPaths].filter((p) => !p.startsWith(".")).map((p) => isPackageName(p) ? `${p}/` : p.slice(0, p.lastIndexOf("/") + 1)).filter(Boolean), ...[...this.libraries].map((library) => `${library}/`)]);
 		for (const file of this.componentFiles) {
 			for (const module of modulePaths(file)) this.componentModules.add(module);
 			this.moduleDirs.add(path.posix.dirname(file));
@@ -5306,6 +7654,8 @@ var LintTarget = class {
 	/** The component a module exports as `default`, for `import Anything from "..."`. */
 	defaultExport(specifier, fromFile = "snippet.tsx") {
 		const resolved = specifier.startsWith(".") ? this.resolveRelative(specifier, fromFile) : void 0;
+		const fromLibrary = this.model.components.filter((c) => c.defaultImport === specifier);
+		if (fromLibrary.length === 1) return fromLibrary[0];
 		const matches = this.model.components.filter((c) => c.exportName === "default" && (resolved === void 0 ? (!this.config.importPath || this.config.importPath.includes("{path}")) && c.importPath === specifier : modulePaths(c.source.file).includes(resolved)));
 		return matches.length === 1 ? matches[0] : void 0;
 	}
@@ -5313,6 +7663,14 @@ var LintTarget = class {
 		const from = path.isAbsolute(fromFile) ? path.relative(this.model.root, fromFile) : fromFile;
 		return path.posix.join(path.posix.dirname(toPosix(from)), stripExtension(specifier));
 	}
+	/** The library an import specifier points into (`@mui/material/Button`), if any. */
+	libraryOf(specifier) {
+		for (const library of this.libraries) if (specifier === library || specifier.startsWith(`${library}/`)) return library;
+	}
+	/** The library's own component of that name: `Button` from `@mui/material`, not a wrapper. */
+	libraryComponent(name, library) {
+		return (this.named.get(name) ?? []).find((c) => c.library === library);
+	}
 	/** Component names for "did you mean" suggestions. */
 	names() {
 		return [...this.components.keys()];
@@ -5350,12 +7708,14 @@ function familyUsage(model) {
 }
 /**
 * A component's place among the design systems an app uses: 0 for the most imported, and
-* so on; with one design system, 0 for all.
+* so on; with one design system, 0 for all. A library's components (MUI) come after them all.
 */
 function designSystemRank(sources) {
-	if (!sources || sources.length < 2) return () => 0;
+	const last = (sources?.length ?? 1) + 1;
+	if (!sources || sources.length < 2) return (component) => component.library ? last : 0;
 	const ranks = /* @__PURE__ */ new Map();
 	return (component) => {
+		if (component.library) return last;
 		const file = component.source.file;
 		let rank = ranks.get(file);
 		if (rank === void 0) {
@@ -5694,6 +8054,7 @@ const noUnknownProp = {
 			const resolution = context.resolve(element);
 			if (resolution.kind !== "component" || resolution.component.openProps) continue;
 			const component = resolution.component;
+			if (component.polymorphic && findAttribute(element, component.polymorphic)) continue;
 			const own = component.props.map((p) => p.name);
 			const known = new Set(own);
 			for (const inherited of component.inherits) for (const name of propSets[inherited.set] ?? []) known.add(name);
@@ -6015,6 +8376,38 @@ function hasLabel(attributes) {
 	});
 }
 /**
+* Whether the element's parent is a component that gives its child an accessible name, as MUI's
+* `<Tooltip title="Delete">` does with a string title (not a JSX one, and not with
+* `describeChild`, which makes it a description).
+*/
+function labelledByParent(context, element) {
+	let node = element.node.parent;
+	while (ts.isParenthesizedExpression(node) || ts.isJsxExpression(node) || ts.isConditionalExpression(node) && node.condition !== element.node || ts.isBinaryExpression(node) && [
+		ts.SyntaxKind.AmpersandAmpersandToken,
+		ts.SyntaxKind.BarBarToken,
+		ts.SyntaxKind.QuestionQuestionToken
+	].includes(node.operatorToken.kind)) node = node.parent;
+	if (!ts.isJsxElement(node)) return false;
+	const parent = context.analysis.elements.find((e) => e.node === node);
+	if (!parent) return false;
+	const resolution = context.resolve(parent);
+	const labels = resolution.kind === "component" ? resolution.component.labelsChild : void 0;
+	if (!labels) return false;
+	const unless = labels.unless ? findAttribute(parent, labels.unless) : void 0;
+	if (unless) {
+		const init = unless.initializer;
+		if ((init && ts.isJsxExpression(init) ? init.expression : init)?.kind !== ts.SyntaxKind.FalseKeyword) return false;
+	}
+	const label = findAttribute(parent, labels.prop);
+	if (!label?.initializer) return false;
+	if (ts.isStringLiteral(label.initializer)) return label.initializer.text.trim() !== "";
+	const value = ts.isJsxExpression(label.initializer) ? label.initializer.expression : void 0;
+	if (!value) return false;
+	const literals = literalValues(label);
+	if (literals.length) return literals.some((l) => l.text.trim() !== "");
+	return !ts.isJsxElement(value) && !ts.isJsxSelfClosingElement(value) && !ts.isJsxFragment(value);
+}
+/**
 * The element whose `render` prop this one is, as in Base UI's
 * `<Dialog.Close render={<Button size="icon" />}><XIcon /></Dialog.Close>`:
 * the rendered button takes the host's children and attributes. Also through
@@ -6075,6 +8468,7 @@ const iconButtonAccessibleName = {
 			if (host === "object") continue;
 			if (host && (isButton(context, host) || host.hasSpread)) continue;
 			if (hasLabel(element.attributes) || host && hasLabel(host.attributes)) continue;
+			if (labelledByParent(context, element)) continue;
 			const icons = [];
 			const children = host ? [...host.children, ...element.children] : element.children;
 			const content = host && !children.length ? "unknown" : classify(children, context, icons);
@@ -6259,6 +8653,7 @@ function reportColor(context, input) {
 		replacement = cls ? `className="${cls}"` : cssVar;
 		advice = cls ? `\`${cls}\` in className` : void 0;
 	}
+	if (!cls && !cssVar && token.usage.length) advice = token.usage.map((usage) => `\`${usage}\``).join(" or ");
 	const same = sameValue.length ? `, same value as ${sameValue.map((t) => t.name).join(", ")}` : "";
 	const inMode = mode && token.modes?.[mode] !== void 0 ? ` in ${mode} mode` : "";
 	const found = `${token.name}${inMode} (${formatDeltaE(nearest.distance)}${same})`;
@@ -6362,7 +8757,7 @@ function lengthRule(id, description, spec) {
 				const negative = utility.negative !== px < 0;
 				if (negative && !NEGATIVE_PREFIXES.has(utility.prefix)) continue;
 				const replacement = lengthReplacement(context, spec.category, px, utility.prefix);
-				if (!replacement) continue;
+				if (!replacement || unnamed(replacement)) continue;
 				const fixed = withBase({
 					...utility,
 					negative
@@ -6395,6 +8790,7 @@ function lengthRule(id, description, spec) {
 					const negative = px < 0;
 					if (negative && !NEGATIVE_PREFIXES.has(prefix)) continue;
 					const replacement = values.length === 1 ? lengthReplacement(context, spec.category, px, prefix) : void 0;
+					if (replacement && unnamed(replacement)) continue;
 					const cls = replacement && `${negative ? "-" : ""}${replacement.cls}`;
 					const cssVar = replacement?.cssVar && (negative ? `calc(${replacement.cssVar} * -1)` : replacement.cssVar);
 					const shown = number !== void 0 ? `${name}: ${raw}` : `${name}: "${raw}"`;
@@ -6415,6 +8811,13 @@ function lengthRule(id, description, spec) {
 		}
 	};
 }
+/**
+* A value on the scale whose token code cannot name, with neither a Tailwind class nor a
+* custom property (a DESIGN.md's `spacing.md`): there is nothing better to write.
+*/
+function unnamed(replacement) {
+	return replacement.exact && !replacement.tailwind && !replacement.cssVar;
+}
 /** The nearest step is "far" when it is off by more than half the value and more than 4px. */
 const FAR_RATIO = .5;
 const FAR_PX = 4;
@@ -6693,7 +9096,7 @@ function isObject(value) {
 var name = "onsystem";
 //#endregion
 //#region src/version.ts
-const VERSION = "0.5.0";
+const VERSION = "0.6.0";
 const NAME = name;
 //#endregion
 //#region src/lint/sarif.ts
@@ -7379,17 +9782,25 @@ var DesignSystem = class {
 	config;
 	lint;
 	searchIndex;
+	/**
+	* The components the tools offer: all of them, except a library's (MUI's) where the project
+	* has its own of that name, a wrapper the team means to be used. The rules still check code
+	* that imports the library's directly against the library's.
+	*/
+	offered;
 	constructor(model, config) {
 		this.model = model;
 		this.config = config;
 		this.lint = new LintTarget(model, config, new ModuleResolver(config));
-		this.searchIndex = buildSearchIndex(model.components);
+		const own = new Set(model.components.filter((c) => !c.library).flatMap((c) => [c.name, ...c.aliases]));
+		this.offered = model.components.filter((c) => !c.library || !(own.has(c.name) || c.parent !== void 0 && own.has(c.parent)));
+		this.searchIndex = buildSearchIndex(this.offered);
 	}
 	get root() {
 		return this.model.root;
 	}
 	get components() {
-		return this.model.components;
+		return this.offered;
 	}
 	get tokens() {
 		return this.model.tokens;
@@ -7399,7 +9810,7 @@ var DesignSystem = class {
 	}
 	/** Top-level components, i.e. not parts of another component. */
 	roots() {
-		return this.model.components.filter((c) => !c.parent);
+		return this.offered.filter((c) => !c.parent);
 	}
 	/** Looks a component up by name, alias, `Card.Header`/`CardHeader` or case-insensitively. */
 	getComponent(name) {
@@ -7407,7 +9818,7 @@ var DesignSystem = class {
 		if (exact) return exact;
 		const key = (n) => n.replace(/\./g, "").toLowerCase();
 		const wanted = key(name);
-		return this.model.components.find((c) => key(c.name) === wanted || c.aliases.some((a) => key(a) === wanted));
+		return this.offered.find((c) => key(c.name) === wanted || c.aliases.some((a) => key(a) === wanted));
 	}
 	suggestComponent(name) {
 		return closest(name, this.lint.names(), .5);
@@ -7438,6 +9849,16 @@ var DesignSystem = class {
 		return [...found.values()];
 	}
 	/**
+	* Whether `check --require-design-system` (and the GitHub Action, where it is on by default)
+	* finds a design system to check against: components and color tokens, or components from a
+	* published library (MUI). A library is the design system whatever its theme: when the theme's
+	* colors cannot be read (a palette from Sass variables), the check still runs and `notice()`
+	* says that no-hardcoded-color did not.
+	*/
+	hasDesignSystem() {
+		return !this.notice() || this.model.components.some((c) => c.library !== void 0);
+	}
+	/**
 	* What the rules could not check, when it matters: without components the
 	* component rules find nothing, and without color tokens neither does
 	* no-hardcoded-color, so a clean result says little. Undefined when both exist.
@@ -7476,17 +9897,18 @@ async function find(config, patterns) {
 		absolute: true,
 		dot: false
 	};
+	const exclude = config.designSystemExclude ?? config.exclude;
 	const named = patterns.filter((p) => p.includes("node_modules"));
 	const outside = patterns.filter((p) => !p.includes("node_modules") && p.startsWith("../"));
 	const rest = patterns.filter((p) => !p.includes("node_modules") && !p.startsWith("../"));
 	return unique((await Promise.all([
 		rest.length ? glob(rest, {
 			...options,
-			ignore: unique(["**/node_modules/**", ...config.exclude])
+			ignore: unique(["**/node_modules/**", ...exclude])
 		}) : [],
 		named.length ? glob(named, {
 			...options,
-			ignore: config.exclude.filter((e) => !e.includes("node_modules"))
+			ignore: exclude.filter((e) => !/^(?:\*\*\/)?node_modules(?:\/\*\*)?\/?$/.test(e))
 		}) : [],
 		...outside.map((pattern) => {
 			const base = globBase(pattern);
@@ -7496,8 +9918,8 @@ async function find(config, patterns) {
 				cwd: path.resolve(config.root, base),
 				ignore: unique([
 					"**/node_modules/**",
-					...config.exclude.filter((e) => e.startsWith("**/")),
-					...config.exclude.filter((e) => e.startsWith(prefix)).map((e) => e.slice(prefix.length))
+					...exclude.filter((e) => e.startsWith("**/")),
+					...exclude.filter((e) => e.startsWith(prefix)).map((e) => e.slice(prefix.length))
 				])
 			});
 		})
@@ -7516,14 +9938,18 @@ async function resolveFiles(config) {
 	const docs = await find(config, config.docs);
 	const tokens = [];
 	const seen = /* @__PURE__ */ new Set();
-	for (const source of config.tokens) for (const file of await find(config, [source.path])) {
-		if (seen.has(file)) continue;
-		seen.add(file);
-		tokens.push({
-			file,
-			prefix: source.prefix
-		});
-	}
+	const add = async (sources) => {
+		for (const source of sources) for (const file of await find(config, [source.path])) {
+			if (seen.has(file)) continue;
+			seen.add(file);
+			tokens.push({
+				file,
+				prefix: source.prefix
+			});
+		}
+	};
+	await add(config.tokens.filter((t) => !t.fallback));
+	if (!tokens.length) await add(config.tokens.filter((t) => t.fallback));
 	return {
 		components,
 		tokens,
@@ -7541,7 +9967,7 @@ var FileStats = class {
 		return Promise.all(files.map((file) => {
 			let stat = this.stats.get(file);
 			if (!stat) {
-				stat = fs$1.stat(file).then((s) => `${relativePath(this.root, file)}:${s.size}:${Math.round(s.mtimeMs)}`, () => `${file}:missing`);
+				stat = fsp.stat(file).then((s) => `${relativePath(this.root, file)}:${s.size}:${Math.round(s.mtimeMs)}`, () => `${file}:missing`);
 				this.stats.set(file, stat);
 			}
 			return stat;
@@ -7597,7 +10023,7 @@ async function buildModel(config, options = {}) {
 	const cachePath = cacheFile(config.root);
 	let cached;
 	if (useCache && !options.oldProgram) try {
-		cached = JSON.parse(await fs$1.readFile(cachePath, "utf8"));
+		cached = JSON.parse(await fsp.readFile(cachePath, "utf8"));
 	} catch {}
 	const known = Array.isArray(cached?.dependencies) ? cached.dependencies : options.oldProgram ? projectFiles(options.oldProgram) : [];
 	const stats = new FileStats(config.root);
@@ -7622,24 +10048,36 @@ async function buildModel(config, options = {}) {
 	const docs = [];
 	const warnings = [...extracted.warnings];
 	for (const file of files.docs) try {
-		docs.push(parseDoc(await fs$1.readFile(file, "utf8"), relativePath(config.root, file)));
+		docs.push(parseDoc(await fsp.readFile(file, "utf8"), relativePath(config.root, file)));
 	} catch (error) {
 		warnings.push(`${relativePath(config.root, file)}: ${error.message}`);
 	}
 	warnings.push(...attachDocs(extracted.components, docs));
 	const tokens = await loadTokens(config.root, files.tokens);
 	warnings.push(...tokens.warnings);
+	const libraries = await loadLibraries(config);
+	warnings.push(...libraries.warnings);
+	tokens.tokens.push(...libraries.tokens);
 	const tailwind = config.tailwindConfig ? readTailwindColors(config.tailwindConfig, moduleResolver(config.root)) : void 0;
 	if (tailwind) applyTailwindColors(tokens.tokens, tailwind.colors);
-	if (!files.components.length) warnings.push(`No component files matched ${config.components.join(", ")} under ${config.root}`);
-	if (!files.tokens.length) warnings.push("No token files found; token rules are disabled.");
+	let radiiFiles = [];
+	if (config.tailwindConfig) {
+		const radii = readTailwindRadii(config.tailwindConfig, moduleResolver(config.root));
+		applyTailwindRadii(tokens.tokens, radii.radii, config.tailwindConfig);
+		radiiFiles = radii.files;
+	}
+	if (!files.components.length && !libraries.components.length) warnings.push(`No component files matched ${config.components.join(", ")} under ${config.root}`);
+	if (!files.tokens.length && !libraries.tokens.length) warnings.push("No token files found; token rules are disabled.");
 	const model = {
 		version: 1,
 		root: config.root,
-		components: extracted.components,
+		components: [...extracted.components, ...libraries.components],
 		tokens: tokens.tokens,
-		propSets: extracted.propSets,
-		exports: extracted.exports,
+		propSets: {
+			...extracted.propSets,
+			...libraries.propSets
+		},
+		exports: unique([...extracted.exports, ...libraries.exports]).sort(),
 		warnings,
 		sources: files.components.map((file) => relativePath(config.root, file)),
 		stats: {
@@ -7652,11 +10090,16 @@ async function buildModel(config, options = {}) {
 			fromCache: false
 		}
 	};
-	const dependencies = unique([...extracted.dependencies, ...tailwind?.files ?? []]);
+	const dependencies = unique([
+		...extracted.dependencies,
+		...tailwind?.files ?? [],
+		...radiiFiles,
+		...libraries.dependencies
+	]);
 	const key = await cacheKey(config, files, dependencies, stats);
 	if (useCache) try {
-		await fs$1.mkdir(path.dirname(cachePath), { recursive: true });
-		await fs$1.writeFile(cachePath, JSON.stringify({
+		await fsp.mkdir(path.dirname(cachePath), { recursive: true });
+		await fsp.writeFile(cachePath, JSON.stringify({
 			key,
 			dependencies,
 			model
@@ -7743,9 +10186,10 @@ var DesignSystemHost = class {
 	* `extends` target is picked up.
 	*/
 	watchConfigFiles() {
-		const { root, configFile, tsconfig } = this.config;
+		const { root, configFile, tsconfig, designSystemPackage } = this.config;
 		const files = [
 			configFile,
+			designSystemPackage && path.join(designSystemPackage.dir, "package.json"),
 			...DETECTION_FILES.map((f) => path.join(root, f)),
 			path.resolve(root, tsconfig ?? "tsconfig.json"),
 			...readProjectConfig(root, tsconfig).configFiles.filter(isProjectFile)
@@ -7762,8 +10206,8 @@ var DesignSystemHost = class {
 		}
 	}
 	changed(file) {
-		const { root, configFile, detected } = this.config;
-		if (file === void 0 || file === configFile || path.dirname(file) === root && DETECTION_FILES.includes(path.basename(file)) || detected !== void 0 && this.watchedFiles.has(file)) this.configChanged = true;
+		const { root, configFile, detected, designSystemPackage } = this.config;
+		if (file === void 0 || file === configFile || designSystemPackage !== void 0 && this.watchedFiles.has(file) || path.dirname(file) === root && DETECTION_FILES.includes(path.basename(file)) || detected !== void 0 && this.watchedFiles.has(file)) this.configChanged = true;
 		this.schedule();
 	}
 	close() {
@@ -7799,10 +10243,10 @@ var DesignSystemHost = class {
 	}
 	/** Re-reads the config, re-watches what it points at and rebuilds. */
 	async reloadConfig() {
-		const { root, configFile } = this.config;
+		const { root, configFile, designSystemPackage, warnings } = this.config;
 		const load = this.options.loadConfig ?? (() => loadConfig({
 			root,
-			config: configFile
+			config: designSystemPackage ? void 0 : configFile
 		}));
 		try {
 			this.config = await load();
@@ -7810,6 +10254,7 @@ var DesignSystemHost = class {
 			(this.options.logger ?? silentLogger).error(`config reload failed: ${error.message}`);
 			return;
 		}
+		for (const text of this.config.warnings ?? []) if (!warnings?.includes(text)) (this.options.logger ?? silentLogger).warn(text);
 		if (this.watchers.length) {
 			this.close();
 			this.watch();
@@ -7831,11 +10276,13 @@ var DesignSystemHost = class {
 		this.dependencies = dependencies ?? [];
 		if (this.watchers.length) this.watchConfigFiles();
 		const { stats } = model;
-		logger.info(`${incremental ? "reloaded" : "loaded"} ${model.components.length} components, ${model.tokens.length} tokens from ${relativePath(process.cwd(), config.root) || "."} in ${stats.durationMs}ms${stats.fromCache ? " (cache)" : ""}`);
+		const roots = ds.roots().length;
+		const parts = ds.components.length - roots;
+		logger.info(`${incremental ? "reloaded" : "loaded"} ${plural$1(roots, "component")}${parts ? ` (+${plural$1(parts, "part")})` : ""}, ${plural$1(model.tokens.length, "token")} from ${relativePath(process.cwd(), config.root) || "."} in ${stats.durationMs}ms${stats.fromCache ? " (cache)" : ""}`);
 		for (const warning of model.warnings) logger.warn(warning);
 		if (incremental) for (const listener of this.listeners) listener(ds);
 		return ds;
 	}
 };
 //#endregion
-export { plural$1 as $, parseDtcgTokens as A, DEFAULT_TEST_FOLDERS as B, updateBaseline as C, loadTokens as D, TokenIndex as E, CONFIG_FILES as F, loadConfig as G, RULE_IDS as H, ConfigError as I, detectProject as J, rulesFor as K, DEFAULT_DOCS as L, attachDocs as M, parseDoc as N, mergeTokens as O, extractComponents as P, closest as Q, DEFAULT_SEVERITY as R, readBaseline as S, RULES as T, configJsonSchema as U, LEGACY_CONFIG_FILES as V, defineConfig as W, workspacePackageDirs as X, isWorkspaceRoot as Y, workspacePatterns as Z, VERSION as _, fingerprint as a, toPosix as at, applyBaseline as b, silentLogger as c, searchComponents as d, truncate as et, applyFixes as f, NAME as g, formatDiagnostics as h, componentFiles as i, relativePath as it, parseCssTokens as j, formatPx as k, stderrLogger as l, uncheckedNotice as m, DesignSystemHost as n, isInside as nt, loadDesignSystem as o, checkSource as p, findVariantDefinitions as q, buildModel as r, matchesGlob as rt, tokenFiles as s, DesignSystem as t, unique as tt, buildSearchIndex as u, BASELINE_FILE as v, writeBaseline as w, countBaseline as x, LEGACY_BASELINE_FILE as y, DEFAULT_TEST_EXCLUDE as z };
+export { findVariantDefinitions as $, toDtcg as A, DEFAULT_DOCS as B, updateBaseline as C, loadTokens as D, TokenIndex as E, attachDocs as F, RULE_IDS as G, DEFAULT_TEST_EXCLUDE as H, parseDoc as I, hasOwnConfig as J, configJsonSchema as K, extractComponents as L, parseDtcgTokens as M, parseDesignMd as N, mergeTokens as O, parseCssTokens as P, formatPx as Q, CONFIG_FILES as R, readBaseline as S, RULES as T, DEFAULT_TEST_FOLDERS as U, DEFAULT_SEVERITY as V, LEGACY_CONFIG_FILES as W, loadConfigWith as X, loadConfig as Y, rulesFor as Z, VERSION as _, relativePath as _t, fingerprint as a, detectProject as at, applyBaseline as b, silentLogger as c, isWorkspaceRoot as ct, searchComponents as d, closest as dt, LIBRARY_IDS as et, applyFixes as f, plural$1 as ft, NAME as g, matchesGlob as gt, formatDiagnostics as h, isInside as ht, componentFiles as i, declaredConfig as it, TOKEN_CATEGORIES as j, toDesignMd as k, stderrLogger as l, workspacePackageDirs as lt, uncheckedNotice as m, unique as mt, DesignSystemHost as n, PACKAGE_FIELD as nt, loadDesignSystem as o, findDesignSystemPackage as ot, checkSource as p, truncate as pt, defineConfig as q, buildModel as r, PackageFinder as rt, tokenFiles as s, isDesignSystemName as st, DesignSystem as t, libraryAdapter as tt, buildSearchIndex as u, workspacePatterns as ut, BASELINE_FILE as v, toPosix as vt, writeBaseline as w, countBaseline as x, LEGACY_BASELINE_FILE as y, ConfigError as z };