onsystem 0.7.0 → 0.8.0

package/dist/{design-system-C4bhqLLw.js → design-system-Dmcv7eHR.js}

@@ -5,7 +5,7 @@ import * as z from "zod";
 import { escapePath, glob, globSync } from "tinyglobby";
 import ts from "typescript";
 import os from "node:os";
-import { clampChroma, colorsNamed, converter, differenceEuclidean, formatHex, parse } from "culori";
+import { clampChroma, colorsNamed, converter, differenceEuclidean, formatHex, parse, wcagContrast } from "culori";
 import { createHash } from "node:crypto";
 import fsp from "node:fs/promises";
 import postcss from "postcss";
@@ -137,6 +137,12 @@ function slashGlob(pattern) {
 	if (!pattern.includes("/")) return pattern.replaceAll("\\", "/");
 	return pattern.replace(/\\(?![()[\]{}*?!+@])/g, "/");
 }
+/**
+* The files `check` and `check_ui` read: `.tsx`, `.jsx`, `.ts`, `.js` and the `.mts`, `.cts`,
+* `.mjs` and `.cjs` forms, in any case. CSS, Markdown or JSON parsed as TSX gives hundreds of
+* syntax errors (209 for a shadcn/ui `app/globals.css`).
+*/
+const SCRIPT_FILE$1 = /\.(?:[jt]sx?|[cm][jt]s)$/i;
 /** Path relative to `root`, always with forward slashes. */
 function relativePath(root, file) {
 	return toPosix(path.relative(root, file));
@@ -191,6 +197,16 @@ function matchesGlob(file, pattern) {
 	return regex.test(file.replace(/^\.\//, ""));
 }
 const globRegExps = /* @__PURE__ */ new Map();
+/**
+* Whether a root-relative path is one a glob matches, or is in a folder it matches, as a
+* glob's `ignore` leaves a matching folder out: `app/legacy`, `app/legacy/`, `./app/legacy` and
+* `app/legacy/**` all cover `app/legacy/old.tsx`, and `**\/legacy` covers every legacy folder.
+* How `exclude` patterns are matched, wherever they apply.
+*/
+function coveredByGlob(file, pattern) {
+	const glob = pattern.replace(/^\.\//, "").replace(/\/+$/, "");
+	return matchesGlob(file, glob) || matchesGlob(file, `${glob}/**`);
+}
 function globSource(pattern) {
 	let out = "";
 	for (let i = 0; i < pattern.length; i++) {
@@ -582,7 +598,9 @@ const STYLESHEETS = [
 *    workspace sources, read the same way or through their own `components.json`,
 *    or, for a package without `exports` that apps import by path
 *    (`@acme/ui/primitives/button`), from the files the root's code imports. They
-*    are added to what `components.json` found, not skipped for it.
+*    are added to what `components.json` found, not skipped for it. One installed
+*    from a registry is read through its `exports` alone, when they point at the
+*    component sources it publishes, not from `dist/` back to `src/`.
 * 4. A flat folder of components that wrap a primitives library, the way React
 *    Aria's Tailwind starter ships them (`src/Button.tsx`, `src/Checkbox.tsx`).
 *
@@ -590,6 +608,10 @@ const STYLESHEETS = [
 * (`designSystems`). A candidate whose globs match no file is skipped. Returns undefined
 * when nothing applies, so the shadcn defaults stay in force.
 *
+* Next to the ui folder `components.json` names, the folders `npx shadcn add` copies other
+* registries' code into (its `registries`: `@signoff-ui` → `components/signoff-ui`) are
+* read-only design systems, after all the others ({@link fromRegistries}).
+*
 * `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.
@@ -602,8 +624,9 @@ function detectProject(root, tsconfig, trace, declared, packages = new PackageFi
 	});
 	const found = [];
 	const shadcn = readJson$1(path.join(root, "components.json"));
+	const project = shadcn ? readProjectConfig(root, tsconfig) : void 0;
 	let why = "no ui or components alias";
-	const fromShadcn = shadcn ? fromComponentsJson(root, root, shadcn, readProjectConfig(root, tsconfig), packages, (r) => {
+	const fromShadcn = shadcn && project ? fromComponentsJson(root, root, shadcn, project, packages, (r) => {
 		why = r;
 	}) : void 0;
 	if (!shadcn) step("components.json", false, fs.existsSync(path.join(root, "components.json")) ? "not valid JSON" : "not found");
@@ -639,21 +662,23 @@ function detectProject(root, tsconfig, trace, declared, packages = new PackageFi
 	let imported;
 	for (const name of names) {
 		const own = name === declared?.name ? declared : void 0;
-		const kind = own?.installed ? "installed" : "workspace";
+		const workspaceDir = own ? void 0 : packages.find(name);
+		const installedDir = own || workspaceDir ? void 0 : packages.installed(name);
+		const kind = own?.installed ?? installedDir !== void 0 ? "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 = own ? own.dir : packages.find(name);
+		const dir = own?.dir ?? workspaceDir ?? installedDir;
 		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");
+			step(candidate, false, "not a workspace package, and not installed");
 			continue;
 		}
 		const reasons = [];
 		const note = (r) => reasons.push(r);
-		const result = fromPackage(root, dir, pkg, note) ?? fromPackageComponentsJson(root, dir, pkg, packages, note) ?? fromImports(root, dir, name, (imported ??= importedSubpaths(root, names)).get(name), note);
+		const result = installedDir ? fromPackage(root, dir, pkg, note, true) : fromPackage(root, dir, pkg, note) ?? fromPackageComponentsJson(root, dir, pkg, packages, note) ?? fromImports(root, dir, name, (imported ??= importedSubpaths(root, names)).get(name), note);
 		if (result && matchesAny(root, result)) {
 			found.push({
 				...result,
@@ -664,11 +689,28 @@ function detectProject(root, tsconfig, trace, declared, packages = new PackageFi
 			step(candidate, true, `${relativePath(root, dir)}, ${countFiles(root, result)}`);
 		} else step(candidate, false, result ? "its components match no file" : unique(reasons).join("; ") || "nothing to read");
 	}
+	const registries = shadcn && project && fromShadcn && !withDefaults ? fromRegistries(root, shadcn, fromShadcn, found, project, step) : [];
 	if (found.length) {
 		step("a flat src/ of components", false, "not read: a design system was found");
+		const named = (source) => registries.length ? `${source}; from shadcn registries, read-only: ${registries.map((r) => r.source).join(", ")}` : source;
+		const read = registries.map((f) => ({
+			source: f.source,
+			components: f.components,
+			imports: 0,
+			registry: f.registry
+		}));
 		if (found.length === 1) {
 			const [only] = found;
-			return detection(root, found, withDefaults, only?.source ?? "");
+			const source = only?.source ?? "";
+			if (!only || !read.length) return detection(root, found, withDefaults, source);
+			return {
+				...detection(root, [...found, ...registries], withDefaults, named(source)),
+				designSystems: [{
+					source,
+					components: only.components,
+					imports: 0
+				}, ...read]
+			};
 		}
 		const counts = importCounts(root, found.map((f) => f.prefixes ?? []));
 		const ranked = found.map((f, i) => ({
@@ -679,12 +721,12 @@ function detectProject(root, tsconfig, trace, declared, packages = new PackageFi
 		const [primary, ...rest] = ranked;
 		const describe = (r) => `${r.f.source} (${r.imports.toLocaleString("en-US")} ${r.imports === 1 ? "import" : "imports"})`;
 		return {
-			...detection(root, ranked.map((r) => r.f), withDefaults, `primary: ${primary ? describe(primary) : ""}; also: ${rest.map(describe).join(", ")}`),
-			designSystems: ranked.map((r) => ({
+			...detection(root, [...ranked.map((r) => r.f), ...registries], withDefaults, named(`primary: ${primary ? describe(primary) : ""}; also: ${rest.map(describe).join(", ")}`)),
+			designSystems: [...ranked.map((r) => ({
 				source: r.f.source,
 				components: r.f.components,
 				imports: r.imports
-			}))
+			})), ...read]
 		};
 	}
 	let flatWhy = "no package.json";
@@ -847,6 +889,101 @@ function fromComponentsJson(root, dir, json, project, packages, note = ignore) {
 		...ownerPackage(root, uiDir, ui)
 	};
 }
+/** How a shadcn registry is named in components.json: `@` and a name, so none leads out of the folder. */
+const REGISTRY_NAMESPACE = /^@[a-z0-9][\w-]*$/i;
+/**
+* The registries `components.json` names (`"registries": { "@signoff-ui": … }`), sorted, and
+* where `npx shadcn add` copies their code: the components alias, through tsconfig `paths`, when
+* it names a folder in the project. `why` says why there is none.
+*/
+function registryBase(root, json, project) {
+	const namespaces = Object.keys(asRecord(json.registries)).filter((n) => REGISTRY_NAMESPACE.test(n)).sort();
+	const alias = asRecord(json.aliases).components;
+	if (typeof alias !== "string") return {
+		namespaces,
+		why: "no components alias"
+	};
+	const base = namespaces.length ? resolveThroughPaths(alias, project) : void 0;
+	if (!base || !isInside(root, base)) return {
+		namespaces,
+		why: `the components alias ${alias} names no folder in the project through tsconfig paths`
+	};
+	return {
+		namespaces,
+		base,
+		alias
+	};
+}
+/** The folder of a registry's code: the namespace without its `@`, under the components folder. */
+function registryFolder(root, base, namespace) {
+	const dir = relativePath(root, path.join(base, namespace.slice(1)));
+	return {
+		namespace,
+		dir,
+		glob: `${escapePath(dir)}/**/*.{tsx,jsx}`
+	};
+}
+/**
+* The folders `npx shadcn add` copies the code of the registries `components.json` names into,
+* whether they hold files yet or not, outside the ui folder ({@link fromRegistries}). A config
+* that lists them in `components` reads them as zero config does: read-only, after the rest.
+*/
+function registryFolders(root, tsconfig) {
+	const json = readJson$1(path.join(root, "components.json"));
+	if (!json || !Object.keys(asRecord(json.registries)).length) return [];
+	const project = readProjectConfig(root, tsconfig);
+	const { namespaces, base } = registryBase(root, json, project);
+	if (!base) return [];
+	const ui = asRecord(json.aliases).ui;
+	const uiDir = typeof ui === "string" ? resolveThroughPaths(ui, project) : void 0;
+	return namespaces.filter((namespace) => !uiDir || !isInside(uiDir, path.join(base, namespace.slice(1)))).map((namespace) => registryFolder(root, base, namespace));
+}
+/**
+* The folders `npx shadcn add` copies the code of the registries `components.json` names into
+* (`@/components` and `@signoff-ui` → `components/signoff-ui`). Each one that holds a .tsx or
+* .jsx file is a read-only design system: the app's code is checked against its components, and
+* its own files are skipped as the ui folder's are. Not when a design system found is imported
+* through a package's `exports` (`@workspace/ui`): a config that names that package would give
+* registry code its name too. A folder inside the ui folder is already part of it. Code a
+* registry copies loose into the components folder (React Bits) is not set apart.
+*/
+function fromRegistries(root, json, ui, others, project, step) {
+	const { namespaces, base, alias, why } = registryBase(root, json, project);
+	if (!namespaces.length) return [];
+	const no = (reason) => {
+		for (const namespace of namespaces) step(`registry ${namespace}`, false, reason);
+		return [];
+	};
+	const exported = others.find((f) => f.imports.length);
+	if (exported) return no(`not read: ${exported.package ?? "a package"} is imported through its exports, and the registry's code is not`);
+	if (!base || alias === void 0) return no(why ?? "no components alias");
+	const found = [];
+	for (const namespace of namespaces) {
+		const candidate = `registry ${namespace}`;
+		const { dir, glob } = registryFolder(root, base, namespace);
+		const absolute = path.join(root, dir);
+		if (ui.dirs.some((d) => isInside(d, absolute))) {
+			step(candidate, false, `${dir} is in the ui folder`);
+			continue;
+		}
+		const files = isDirectory$1(absolute) ? componentGlob(root, [glob]).length : 0;
+		if (!files) {
+			step(candidate, false, `${dir} ${isDirectory$1(absolute) ? "holds no .tsx or .jsx file yet" : "does not exist yet"}`);
+			continue;
+		}
+		step(candidate, true, `${dir}, ${plural(files, "component file")}, read-only`);
+		found.push({
+			components: [glob],
+			tokens: [],
+			imports: [],
+			dirs: [],
+			source: `${dir} (${namespace}, ${plural(files, "file")})`,
+			prefixes: [`${alias}/${namespace.slice(1)}`],
+			registry: namespace
+		});
+	}
+	return found;
+}
 /**
 * The workspace package a `components.json` folder belongs to, when it is not the root
 * itself (`@coss/ui/components`, through tsconfig `paths` or the package), and the
@@ -889,22 +1026,29 @@ function fromPackageComponentsJson(root, dir, pkg, packages, note = ignore) {
 * A package whose `exports` point at component source files is a design system. An export
 * that leads to a barrel (`./components/button` → `components/button/index.ts`, or `.` →
 * `src/index.tsx` behind `dist/`) stands for the files the barrel re-exports, each
-* suggested with the export's specifier.
-*/
-function fromPackage(root, dir, pkg, note = ignore) {
+* suggested with the export's specifier. An `installed` package's exports are read as an app
+* resolves them ({@link APP_CONDITIONS}), not from `dist/` back to `src/`: a widget kit
+* publishes `src/` beside `dist/` for its source maps, or points a `source` condition at it for
+* its own repository, and it is not the app's design system. Its compiled files ({@link isBuildOutput})
+* are not read at all: no barrel, component or stylesheet in them. Nor is an export that points
+* at JavaScript outside a build folder ({@link isCompiledExport}): its re-exports are not followed.
+*/
+function fromPackage(root, dir, pkg, note = ignore, installed = false) {
 	const imports = [];
 	const components = [];
 	const add = (mapping, component) => {
 		imports.push(mapping);
 		if (component && !components.some((m) => m.target === mapping.target)) components.push(mapping);
 	};
-	for (const mapping of exportMappings(root, dir, pkg)) {
+	const mappings = exportMappings(root, dir, pkg, installed);
+	for (const mapping of mappings) {
 		const file = path.resolve(root, mapping.target);
+		if (installed && isCompiledExport(dir, file)) continue;
 		if (mapping.target.includes("*") || !SCRIPT_FILE.test(file) || !isFile(file)) {
 			add(mapping, COMPONENT_FILE.test(mapping.target));
 			continue;
 		}
-		for (const reached of exportedFiles(file, dir)) if (COMPONENT_FILE.test(reached)) add({
+		for (const reached of exportedFiles(file, dir)) if (COMPONENT_FILE.test(reached) && !(installed && isBuildOutput(dir, reached))) add({
 			specifier: mapping.specifier,
 			target: relativePath(root, reached)
 		}, true);
@@ -912,8 +1056,9 @@ function fromPackage(root, dir, pkg, note = ignore) {
 	const files = components.filter((m) => !m.target.includes("*"));
 	const patterns = components.filter((m) => m.target.includes("*"));
 	if (files.length < 3 && !patterns.length) {
-		const built = exportMappings(root, dir, pkg).filter((m) => /(?:^|\/)(?:dist|build|lib|out|esm|cjs)\//.test(m.target));
-		note(pkg.exports === void 0 && typeof pkg.main !== "string" ? "no exports" : built.length ? `its exports point at build output with no source found (${built.slice(0, 2).map((m) => m.target).join(", ")})` : `its exports lead to ${plural(files.length, "component file")}; a design system exports at least 3`);
+		const built = mappings.filter((m) => /(?:^|\/)(?:dist|build|lib|out|esm|cjs)\//.test(m.target) || installed && isCompiledExport(dir, path.resolve(root, m.target)));
+		const output = built.slice(0, 2).map((m) => m.target).join(", ");
+		note(pkg.exports === void 0 && typeof pkg.main !== "string" ? "no exports" : built.length ? installed ? `its exports point at build output (${output}), not at component sources, and only sources are read` : `its exports point at build output with no source found (${output})` : `its exports lead to ${plural(files.length, "component file")}; a design system exports at least 3`);
 		return;
 	}
 	const stylesheets = imports.filter((m) => m.target.endsWith(".css") && !m.target.includes("*")).map((m) => path.resolve(root, m.target)).filter((f) => fs.existsSync(f));
@@ -1031,10 +1176,11 @@ function importedSubpaths(root, names) {
 }
 /**
 * `exports` subpaths with a source target, as specifiers relative to `root`. A target
-* built to `dist/` maps back to its source (`src/`, through the build config's entries);
-* without an `exports` map, `main` stands for `.`.
+* built to `dist/` maps back to its source (`src/`, through the build config's entries),
+* unless `asWritten`: then each target is the one an app that installs the package resolves
+* ({@link APP_CONDITIONS}), as it is. Without an `exports` map, `main` stands for `.`.
 */
-function exportMappings(root, dir, pkg) {
+function exportMappings(root, dir, pkg, asWritten = false) {
 	const name = typeof pkg.name === "string" ? pkg.name : void 0;
 	if (!name) return [];
 	const exports = pkg.exports ?? (typeof pkg.main === "string" && /^\.?\/?(?:dist|build|lib)\//.test(pkg.main) ? pkg.main : void 0);
@@ -1042,9 +1188,9 @@ function exportMappings(root, dir, pkg) {
 	let build;
 	const mappings = [];
 	for (const [key, value] of entries) {
-		const target = exportTarget(value);
+		const target = exportTarget(value, asWritten ? APP_CONDITIONS : void 0);
 		if (!target) continue;
-		const source = target.includes("*") ? sourcePattern(dir, target) : sourceTarget(dir, key, target, build ??= buildEntries(dir));
+		const source = asWritten ? void 0 : target.includes("*") ? sourcePattern(dir, target) : sourceTarget(dir, key, target, build ??= buildEntries(dir));
 		mappings.push({
 			specifier: key === "." ? name : `${name}/${key.replace(/^\.\//, "")}`,
 			target: relativePath(root, path.resolve(dir, source ?? target))
@@ -1052,6 +1198,23 @@ function exportMappings(root, dir, pkg) {
 	}
 	return mappings;
 }
+/**
+* A compiled file in package `dir`'s build folder: JavaScript, JSX or CSS (`dist/index.mjs`,
+* `lib/button.jsx`, `dist/index.css`), or a pattern of them (`dist/*.jsx`). TypeScript there
+* (`lib/utils.ts`) is source.
+*/
+function isBuildOutput(dir, file) {
+	return /^(?:dist|build|lib|out|esm|cjs)\/.*\.(?:[cm]?jsx?|css)$/.test(toPosix(path.relative(dir, file)));
+}
+/**
+* An `exports` target of installed package `dir` that is compiled: its build output, or
+* JavaScript in any folder (`./index.js`, `./es/index.mjs`, `./build-module/index.js`), which a
+* package published from TypeScript or JSX sources ships compiled. Its re-exports are not
+* followed, so a package that ships a `.js` barrel in front of `.jsx` sources is not read.
+*/
+function isCompiledExport(dir, file) {
+	return isBuildOutput(dir, file) || /\.[cm]?js$/.test(file);
+}
 /** `./dist/*.mjs` → `src/*.tsx` (or `.ts`) when files match it there; anything else as it is. */
 function sourcePattern(dir, target) {
 	const relative = target.replace(/^\.\//, "");
@@ -1067,19 +1230,40 @@ function sourcePattern(dir, target) {
 	}
 	return relative;
 }
-/** The source file an export condition map points at: the first string target that is not a declaration file. */
-function exportTarget(value) {
+/**
+* The `exports` conditions an app resolves an installed package through: Node.js's own
+* (`import`, `require`, `module-sync`, `node`, `default`), and the `module`, `browser` and
+* `style` that bundlers and Tailwind CSS add. Others, such as `source`, `expo-source` and
+* `development`, lead the package's own repository to its sources, and an app that installs it
+* builds the target after them: `@expo/ui`'s `"default": "./build/universal/index.js"`, not its
+* `"expo-source": "./src/universal/index.ts"` before it.
+*/
+const APP_CONDITIONS = /* @__PURE__ */ new Set([
+	"import",
+	"require",
+	"module-sync",
+	"node",
+	"module",
+	"browser",
+	"style",
+	"default"
+]);
+/**
+* The source file an export condition map points at: the first string target that is not a
+* declaration file, through any condition but `types`, or through `conditions` alone.
+*/
+function exportTarget(value, conditions) {
 	if (typeof value === "string") return value.endsWith(".d.ts") ? void 0 : value;
 	if (Array.isArray(value)) {
 		for (const item of value) {
-			const target = exportTarget(item);
+			const target = exportTarget(item, conditions);
 			if (target) return target;
 		}
 		return;
 	}
 	if (value && typeof value === "object") for (const [condition, nested] of Object.entries(value)) {
-		if (condition === "types") continue;
-		const target = exportTarget(nested);
+		if (condition === "types" || conditions && !conditions.has(condition)) continue;
+		const target = exportTarget(nested, conditions);
 		if (target) return target;
 	}
 }
@@ -1157,29 +1341,87 @@ function presetResolver(root) {
 * Resolves a stylesheet's `@import` to a project file: a path next to the stylesheet
 * (`./theme.css`, or `theme.css` as plain CSS reads it), or a stylesheet of a workspace
 * package (`@acme/theme/colors.css`, or `@acme/theme` through its `exports` or its `style`
-* field). Installed packages (`tailwindcss`) and URLs resolve to nothing.
+* field). An installed package resolves only when zero config reads it as a design system
+* ({@link installedDesignSystem}), and a stylesheet in it imports others of that package alone.
+* In an installed package, a stylesheet in a build folder (`dist/index.css`) is compiled, and
+* resolves to nothing. Other installed packages (`tailwindcss`) and URLs resolve to nothing.
 */
 function stylesheetResolver(root) {
 	const packages = new PackageFinder(root);
-	const stylesheet = (file) => [file, `${file}.css`].find((f) => f.endsWith(".css") && !/[\\/]node_modules[\\/]/.test(f) && isFile(f));
+	const designSystems = /* @__PURE__ */ new Map();
+	const designSystem = (name) => {
+		if (!designSystems.has(name)) designSystems.set(name, installedDesignSystem(root, name, packages));
+		return designSystems.get(name);
+	};
+	const stylesheet = (file, within) => [file, `${file}.css`].find((f) => f.endsWith(".css") && (within === void 0 || isInside(within, f) && !isBuildOutput(within, f)) && !/(?:^|[\\/])node_modules[\\/]/.test(within === void 0 ? f : path.relative(within, f)) && isFile(f));
 	return (specifier, fromFile) => {
 		if (/^(?:[a-z][\w+.-]*:|\/)/i.test(specifier)) return void 0;
-		const relative = stylesheet(path.resolve(path.dirname(fromFile), specifier));
+		const relative = stylesheet(path.resolve(path.dirname(fromFile), specifier), installedPackageOf(fromFile));
 		if (relative || specifier.startsWith(".")) return relative;
 		const name = packageName(specifier);
-		const dir = name ? packages.find(name) : void 0;
+		const workspace = name ? packages.find(name) : void 0;
+		const installed = name && !workspace ? designSystem(name) : void 0;
+		const dir = workspace ?? installed;
 		if (!name || !dir) return void 0;
 		const subpath = specifier.slice(name.length + 1);
+		const key = subpath ? `./${subpath}` : ".";
+		const exported = installed ? installedStylesheet(installed, key) : exportedFile(dir, key, (f) => f.endsWith(".css"));
+		if (exported !== void 0) return exported ?? void 0;
 		const style = readJson$1(path.join(dir, "package.json"))?.style;
-		return exportedFile(dir, subpath ? `./${subpath}` : ".", (f) => f.endsWith(".css")) ?? (subpath ? stylesheet(path.join(dir, subpath)) : stylesheet(path.resolve(dir, typeof style === "string" ? style : "index.css")));
+		return subpath ? stylesheet(path.join(dir, subpath), installed) : stylesheet(path.resolve(dir, typeof style === "string" ? style : "index.css"), installed);
 	};
 }
 /**
+* The stylesheet an app resolves `subpath` (`./globals.css`) of installed package `dir` to,
+* as the package's exported stylesheets are found ({@link exportTarget}): the most specific
+* `exports` entry that maps it decides, through its first stylesheet target under
+* {@link APP_CONDITIONS}, and a later condition is not tried. `null` when that entry leads to no
+* stylesheet, or to one in a build folder (`{ "style": "./dist/x.css", "default": "./src/x.css" }`
+* gives apps the compiled `dist/x.css`); undefined when no entry maps the subpath.
+*/
+function installedStylesheet(dir, subpath) {
+	const [match] = exportMatches(dir, subpath);
+	if (!match) return void 0;
+	const target = exportTargets(match.value, APP_CONDITIONS).map((t) => t.replaceAll("*", match.middle)).find((t) => t.endsWith(".css"));
+	const file = target === void 0 ? void 0 : path.resolve(dir, target);
+	return file && isInside(dir, file) && !isBuildOutput(dir, file) && isFile(file) ? file : null;
+}
+/**
+* The folder of `name` installed from a registry, when zero config reads it as a design system:
+* named like one, with `exports` that point at the component sources it publishes.
+*/
+function installedDesignSystem(root, name, packages) {
+	if (!isDesignSystemName(name)) return void 0;
+	const dir = packages.installed(name);
+	const pkg = dir ? readJson$1(path.join(dir, "package.json")) : void 0;
+	const found = dir && pkg ? fromPackage(root, dir, pkg, ignore, true) : void 0;
+	return found && matchesAny(root, found) ? dir : void 0;
+}
+/** The installed package a file is in: `…/node_modules/@acme/ui` for `…/node_modules/@acme/ui/src/a.css`. */
+function installedPackageOf(file) {
+	const parts = path.resolve(file).split(path.sep);
+	const at = parts.lastIndexOf("node_modules");
+	const first = parts[at + 1] ?? ".";
+	if (at === -1 || first.startsWith(".")) return void 0;
+	const end = at + (first.startsWith("@") ? 3 : 2);
+	return end < parts.length ? parts.slice(0, end).join(path.sep) : void 0;
+}
+/**
 * The file a package's `exports` map `subpath` (`.`, `./theme`) to, through any condition
 * (`style`, `import`, `default`) and `*` patterns: the first target on disk, inside the
 * package, that `accept` takes.
 */
 function exportedFile(dir, subpath, accept) {
+	for (const { middle, value } of exportMatches(dir, subpath)) for (const target of exportTargets(value)) {
+		const file = path.resolve(dir, target.replaceAll("*", middle));
+		if (isInside(dir, file) && accept(file) && isFile(file)) return file;
+	}
+}
+/**
+* The entries of package `dir`'s `exports` that map `subpath`, with what their `*` stands for:
+* an exact subpath first, then the most specific pattern, as Node.js picks them.
+*/
+function exportMatches(dir, subpath) {
 	const exports = readJson$1(path.join(dir, "package.json"))?.exports;
 	const entries = exports && typeof exports === "object" && !Array.isArray(exports) ? Object.keys(exports).every((k) => k.startsWith(".")) ? Object.entries(exports) : [[".", exports]] : exports === void 0 ? [] : [[".", exports]];
 	const matches = [];
@@ -1204,17 +1446,13 @@ function exportedFile(dir, subpath, accept) {
 			});
 		}
 	}
-	matches.sort((a, b) => b.rank - a.rank);
-	for (const { middle, value } of matches) for (const target of exportTargets(value)) {
-		const file = path.resolve(dir, target.replaceAll("*", middle));
-		if (isInside(dir, file) && accept(file) && isFile(file)) return file;
-	}
+	return matches.sort((a, b) => b.rank - a.rank);
 }
-/** Every target of an export condition map, in order, but its types. */
-function exportTargets(value) {
+/** Every target of an export condition map, in order, but its types, or those of `conditions` alone. */
+function exportTargets(value, conditions) {
 	if (typeof value === "string") return [value];
-	if (Array.isArray(value)) return value.flatMap(exportTargets);
-	if (value && typeof value === "object") return Object.entries(value).flatMap(([condition, nested]) => condition === "types" ? [] : exportTargets(nested));
+	if (Array.isArray(value)) return value.flatMap((item) => exportTargets(item, conditions));
+	if (value && typeof value === "object") return Object.entries(value).flatMap(([condition, nested]) => condition === "types" || conditions && !conditions.has(condition) ? [] : exportTargets(nested, conditions));
 	return [];
 }
 /**
@@ -1389,14 +1627,8 @@ var PackageFinder = class {
 	* 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
-			};
-		}
+		const found = this.inNodeModules(name);
+		if (found) return found;
 		this.linkable ??= scanWorkspace(this.root, false);
 		const dir = this.linkable.get(name);
 		const json = dir ? cachedManifest(path.join(dir, "package.json")) : void 0;
@@ -1421,6 +1653,30 @@ var PackageFinder = class {
 			boundary: installed ? dir : this.boundaryOf(dir)
 		};
 	}
+	/**
+	* Where `name` is installed from a registry, rather than linked to a workspace package: its
+	* real folder, where pnpm puts its own dependencies beside it, expressed from the root. When
+	* that is outside the root and its workspace (pnpm's store elsewhere on the machine), the
+	* folder in `node_modules` it was found by, the only way the loader reads it.
+	*/
+	installed(name) {
+		const located = this.inNodeModules(name);
+		if (!located) return void 0;
+		const placed = this.place(located.dir);
+		if (!placed.installed) return void 0;
+		return isInside(this.root, placed.dir) || this.boundaryOf(placed.dir) !== placed.dir ? placed.dir : path.resolve(located.dir);
+	}
+	/** `name` in the nearest `node_modules` at or above the root that has it, with its package.json. */
+	inNodeModules(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
+			};
+		}
+	}
 	/** The `node_modules` folders at and above the root, nearest first, looked up once. */
 	nodeModulesDirs() {
 		if (!this.nodeModules) {
@@ -2881,7 +3137,7 @@ const librariesSchema = z.union([z.literal(false), z.array(z.enum(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."),
+	exclude: z.array(z.string()).optional().describe("Globs for files to leave out, relative to the root: `check` in folders and globs, the ESLint plugin, the Claude Code hook and check_ui leave them out, and finding components skips them. A folder (`app/legacy`) covers everything in it. Adds to the defaults (node_modules, .d.ts files, tests and stories); a pattern that starts with `!` takes out the default it names, such as `!**/*.d.ts`."),
 	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."),
@@ -3001,6 +3257,7 @@ async function loadConfigWith(options, context = {}) {
 	const excludeFromBase = (e) => {
 		if (!inherited || e.startsWith("**/")) return e;
 		if (declared) return fromBase(e);
+		if (e === toProject) return "**";
 		return e.startsWith(`${toProject}/`) ? e.slice(toProject.length + 1) : void 0;
 	};
 	const outside = [];
@@ -3048,7 +3305,14 @@ async function loadConfigWith(options, context = {}) {
 		path: p,
 		fallback: true
 	}))];
-	const exclude = (config.exclude ?? DEFAULT_EXCLUDE).map(slashGlob).map(excludeFromBase).filter((e) => e !== void 0);
+	const tidy = (e) => slashGlob(e).replace(/^(?:\.\/)+/, "").replace(/(.)\/+$/, "$1");
+	const listed = config.exclude ?? [];
+	const dropped = new Set(listed.filter((e) => e.startsWith("!")).map((e) => tidy(e.slice(1))));
+	for (const pattern of dropped) {
+		if (DEFAULT_EXCLUDE.includes(pattern)) continue;
+		warnings.push(`"!${pattern}" in "exclude" takes out none of the defaults, which are ${DEFAULT_EXCLUDE.map((d) => `"${d}"`).join(", ")}: a pattern that starts with "!" names one of them.`);
+	}
+	const exclude = [.../* @__PURE__ */ new Set([...DEFAULT_EXCLUDE.filter((d) => !dropped.has(d)), ...listed.filter((e) => !e.startsWith("!")).map(tidy)])].map(excludeFromBase).filter((e) => e !== void 0);
 	return {
 		root,
 		configFile,
@@ -3130,6 +3394,20 @@ function resolveRule(setting) {
 		options: setting[1] ?? {}
 	};
 }
+/** The default test and story patterns, which `--include-tests` lifts. */
+function isTestPattern(pattern) {
+	return pattern === "**/*.{test,spec,stories}.{ts,tsx,js,jsx}" || pattern === "**/__{tests,stories,mocks}__/**";
+}
+/**
+* The `exclude` pattern that leaves `file` (relative to the root) out, or undefined when none
+* does. The one test `check` (in folders and globs, and for files named outright with
+* `--skip-excluded`), the ESLint plugin, the Claude Code hook and check_ui all apply, so they
+* leave out the same files. A pattern covers the files it matches and everything in a folder it
+* matches. With `includeTests`, the default test and story patterns do not count.
+*/
+function excludedBy(config, file, options = {}) {
+	return config.exclude.find((pattern) => !(options.includeTests && isTestPattern(pattern)) && coveredByGlob(file, pattern));
+}
 /**
 * The rules for one file: the config's `rules`, then every override whose
 * `files` match the path (relative to the root), in order.
@@ -4703,6 +4981,17 @@ function walk$1(root, enter) {
 	}
 }
 const VARIANT_FUNCTIONS = /^(cva|tv)$/;
+/** How many names deep a class value is followed: `className={tone}` with `const tone = base`. */
+const MAX_FOLLOW = 4;
+/** The node around `node`, or undefined at the file. */
+function parentScope(node) {
+	return ts.isSourceFile(node) ? void 0 : node.parent;
+}
+/** Whether a declared name (`tone`, or one in `{ tone, size }`) binds `name`. */
+function binds(declared, name) {
+	if (ts.isIdentifier(declared)) return declared.text === name;
+	return declared.elements.some((e) => !ts.isOmittedExpression(e) && binds(e.name, name));
+}
 function analyze(sourceFile) {
 	const analysis = {
 		imports: /* @__PURE__ */ new Map(),
@@ -4751,10 +5040,100 @@ function analyze(sourceFile) {
 			for (let i = children.length - 1; i >= 0; i--) stack.push(children[i]);
 		}
 	};
+	/**
+	* The `const` value or function a name refers to where it is used, declared in this file and
+	* in scope there: undefined for a parameter, an import, a `let` or anything else that can
+	* hold another value.
+	*/
+	const declarationOf = (use) => {
+		const name = use.text;
+		for (let node = use.parent; node; node = parentScope(node)) {
+			if (ts.isFunctionLike(node) && node.parameters.some((p) => binds(p.name, name))) return;
+			if (ts.isCatchClause(node) && node.variableDeclaration) {
+				if (binds(node.variableDeclaration.name, name)) return;
+			}
+			if ((ts.isForStatement(node) || ts.isForOfStatement(node) || ts.isForInStatement(node)) && node.initializer && ts.isVariableDeclarationList(node.initializer) && node.initializer.declarations.some((d) => binds(d.name, name))) return;
+			const statements = ts.isBlock(node) || ts.isSourceFile(node) || ts.isModuleBlock(node) || ts.isCaseClause(node) || ts.isDefaultClause(node) ? node.statements : void 0;
+			for (const statement of statements ?? []) {
+				if (ts.isFunctionDeclaration(statement) && statement.name?.text === name) return statement;
+				if ((ts.isClassDeclaration(statement) || ts.isEnumDeclaration(statement)) && statement.name?.text === name) return;
+				if (!ts.isVariableStatement(statement)) continue;
+				const list = statement.declarationList;
+				const declaration = list.declarations.find((d) => binds(d.name, name));
+				if (!declaration) continue;
+				return (list.flags & ts.NodeFlags.Const) !== 0 && ts.isIdentifier(declaration.name) ? declaration.initializer : void 0;
+			}
+		}
+	};
+	/** A same-file `const` value: `"bg-green-50"`, a condition, an object map. */
+	const constValue = (use) => {
+		const declaration = declarationOf(use);
+		return declaration && !ts.isFunctionDeclaration(declaration) ? declaration : void 0;
+	};
+	/** The object literals a value can be: a `const` map, or a map in one (`styles.badge`). */
+	const objectsOf = (expr, depth) => {
+		if (depth > MAX_FOLLOW) return [];
+		return valueBranches(expr).flatMap((leaf) => {
+			if (ts.isObjectLiteralExpression(leaf)) return [leaf];
+			if (ts.isIdentifier(leaf)) {
+				const value = constValue(leaf);
+				return value ? objectsOf(value, depth + 1) : [];
+			}
+			if (ts.isPropertyAccessExpression(leaf) || ts.isElementAccessExpression(leaf)) return entriesOf(leaf, depth).flatMap((value) => objectsOf(value, depth + 1));
+			return [];
+		});
+	};
+	/** What a key reads from a same-file map: `styles.badge`, or every value of `styles[status]`. */
+	const entriesOf = (access, depth) => {
+		const key = ts.isPropertyAccessExpression(access) ? access.name.text : ts.isStringLiteralLike(access.argumentExpression) || ts.isNumericLiteral(access.argumentExpression) ? access.argumentExpression.text : void 0;
+		return objectsOf(access.expression, depth + 1).flatMap((object) => object.properties.flatMap((prop) => ts.isPropertyAssignment(prop) && (key === void 0 || propertyName(prop.name) === key) ? [prop.initializer] : []));
+	};
+	/** What a call to a function of this file returns: `toneOf(status)`. */
+	const returnsOf = (call) => {
+		if (!ts.isIdentifier(call.expression)) return [];
+		const declaration = declarationOf(call.expression);
+		if (declaration && ts.isFunctionDeclaration(declaration)) return returnedExpressions(declaration);
+		const fn = declaration && asFunction(declaration);
+		return fn ? returnedExpressions(fn) : [];
+	};
+	const followed = /* @__PURE__ */ new Set();
+	const follow = (value, element, depth) => {
+		if (followed.has(value)) return;
+		followed.add(value);
+		classValue(value, element, depth + 1);
+	};
+	/**
+	* The classes a class value holds where it is not written out: a `const` (`className={tone}`,
+	* `cn("p-4", extra)`), a key of a `const` map (`statusStyles[status]`), what a function of
+	* this file returns (`toneOf(status)`), and the parts of a template or a concatenation,
+	* through conditions. Strings written out in it are collected as well, once.
+	*/
+	const classValue = (expr, element, depth) => {
+		if (depth > MAX_FOLLOW) return;
+		for (const leaf of valueBranches(expr)) if (ts.isStringLiteralLike(leaf) || ts.isObjectLiteralExpression(leaf)) collectStrings(leaf, element);
+		else if (ts.isTemplateExpression(leaf)) {
+			collectStrings(leaf, element);
+			for (const span of leaf.templateSpans) classValue(span.expression, element, depth);
+		} else if (ts.isBinaryExpression(leaf) && leaf.operatorToken.kind === ts.SyntaxKind.PlusToken) {
+			classValue(leaf.left, element, depth);
+			classValue(leaf.right, element, depth);
+		} else if (ts.isArrayLiteralExpression(leaf)) for (const item of leaf.elements) classValue(ts.isSpreadElement(item) ? item.expression : item, element, depth);
+		else if (ts.isIdentifier(leaf)) {
+			const value = constValue(leaf);
+			if (value) follow(value, element, depth);
+		} else if (ts.isPropertyAccessExpression(leaf) || ts.isElementAccessExpression(leaf)) for (const value of entriesOf(leaf, depth)) follow(value, element, depth);
+		else if (ts.isCallExpression(leaf)) {
+			const callee = leaf.expression.getText(sourceFile);
+			if (CLASS_FUNCTIONS.test(callee)) {
+				if (depth === 0 && !VARIANT_FUNCTIONS.test(callee)) for (const arg of leaf.arguments) classValue(arg, element, depth);
+			} else for (const value of returnsOf(leaf)) follow(value, element, depth);
+		}
+	};
 	/** A class value, or an object of them: tv slots, and variant options that style slots. */
 	const collectClassValues = (node) => {
 		if (!ts.isObjectLiteralExpression(node)) {
 			collectStrings(node);
+			classValue(node, void 0, 0);
 			return;
 		}
 		for (const prop of node.properties) if (ts.isPropertyAssignment(prop)) collectClassValues(prop.initializer);
@@ -4819,7 +5198,10 @@ function analyze(sourceFile) {
 				const name = attribute.name.getText(sourceFile);
 				const init = attribute.initializer;
 				if (!init) continue;
-				if (name === "className" || name === "class") collectStrings(init, element);
+				if (name === "className" || name === "class") {
+					collectStrings(init, element);
+					if (ts.isJsxExpression(init) && init.expression) classValue(init.expression, element, 0);
+				}
 				if (name === "style" && ts.isJsxExpression(init) && init.expression) for (const object of styleObjects(init.expression)) analysis.styles.push({
 					element,
 					object
@@ -4830,7 +5212,10 @@ function analyze(sourceFile) {
 			const variants = VARIANT_FUNCTIONS.test(node.expression.getText(sourceFile));
 			node.arguments.forEach((arg) => {
 				if (variants && ts.isObjectLiteralExpression(arg)) collectVariantConfig(arg);
-				else collectStrings(arg);
+				else {
+					collectStrings(arg);
+					classValue(arg, void 0, 0);
+				}
 			});
 		}
 		return true;
@@ -4901,6 +5286,7 @@ function valueBranches(expr) {
 * style functions (`style={({ isPressed }) => ({ ... })}`) are read through this.
 */
 function returnedExpressions(fn) {
+	if (!fn.body) return [];
 	if (!ts.isBlock(fn.body)) return [fn.body];
 	const out = [];
 	const stack = [fn.body];
@@ -5364,6 +5750,11 @@ const TAILWIND_PALETTE = {
 		950: "oklch(14.7% 0.004 49.3)"
 	}
 };
+/** Tailwind's colors without shades: `white` and `black`. */
+const TAILWIND_KEYWORD_COLORS = {
+	black: "#000",
+	white: "#fff"
+};
 //#endregion
 //#region src/tokens/css.ts
 /** Tailwind v4 theme namespaces → token category. Longest prefixes first. */
@@ -8215,6 +8606,7 @@ const preferDesignSystemComponent = {
 			}
 			const component = context.target.elements.get(key);
 			if (!component) continue;
+			if (fromRegistry(component, context) && context.target.config.elements[key] === void 0) continue;
 			if (hiddenFromUser(element)) continue;
 			if (styledByParent(element, context)) continue;
 			if (isBare(element)) continue;
@@ -8232,6 +8624,14 @@ const preferDesignSystemComponent = {
 		}
 	}
 };
+/**
+* Whether `component` is in the folder of a shadcn registry that components.json names
+* (`components/signoff-ui`): a read-only design system, ranked after the others.
+*/
+function fromRegistry(component, context) {
+	const file = component.source.file;
+	return (context.target.config.designSystems ?? []).some((source) => source.registry !== void 0 && source.components.some((g) => matchesGlob(file, g)));
+}
 const definitionsByFile = /* @__PURE__ */ new WeakMap();
 /** Whether the element's `className` calls a `cva(...)` or `tv(...)` definition declared in this file. */
 function styledByOwnVariants(element, context) {
@@ -9205,14 +9605,58 @@ function isHidden(element) {
 		return opening !== void 0 && hiddenBy(opening.attributes);
 	}) !== void 0;
 }
+/**
+* A link a design system renders through `asChild`: `<a>`, a component that renders one, or a
+* router's `Link` (`next/link`, `NavLink`) with its `href` or `to`, not an icon named `ExternalLink`.
+*/
+function isLink(context, element) {
+	const resolution = context.resolve(element);
+	if (resolution.kind === "intrinsic") return resolution.tag === "a";
+	if (resolution.kind === "component" && resolution.component.element === "a") return true;
+	return /Link$/.test(element.tag) && Boolean(findAttribute(element, "href") ?? findAttribute(element, "to"));
+}
+/**
+* `<Button asChild size="icon"><Link href="/users/1/edit"><Pencil /></Link></Button>`: Radix's
+* Slot renders the link with the button's props, so the link is the button, and an icon alone
+* in it names nothing. A label on either counts (`aria-label`, `title`, visually hidden text in
+* the link). A child that is a button itself is checked on its own; any other child (a `<span>`
+* under a tooltip's trigger) is not a control.
+*/
+function checkAsChildLink(context, button) {
+	const children = button.children.filter((c) => !ts.isJsxText(c) || c.text.trim());
+	const [child] = children;
+	if (children.length !== 1 || !child) return;
+	const link = context.analysis.elements.find((e) => e.node === child);
+	if (!link || link.hasSpread || !isLink(context, link)) return;
+	if (hasLabel(button.attributes) || hasLabel(link.attributes)) return;
+	if (labelledByParent(context, button)) return;
+	const icons = [];
+	const content = classify(link.children, context, icons);
+	const sizeIcon = attributeLiterals(button, "size").some((v) => v.text.includes("icon"));
+	if (content !== "icon" && !(content === "empty" && sizeIcon)) return;
+	const { label, fixed } = iconLabel(context, link, button, icons[0]);
+	const attribute = `aria-label="${label ?? "…"}"`;
+	context.report({
+		...tagRange(context, link),
+		message: content === "icon" ? `Icon-only <${link.tag}> in <${button.tag} asChild> has no accessible name. Add ${attribute} describing the action, or visually hidden text.` : `<${link.tag}> in <${button.tag} asChild> has no content and no accessible name. Add ${attribute}.`,
+		suggestion: attribute,
+		fix: fixed ? [{
+			range: [link.tagName.end, link.tagName.end],
+			text: ` ${attribute}`
+		}] : void 0
+	});
+}
 const iconButtonAccessibleName = {
 	id: "icon-button-accessible-name",
 	description: "Buttons whose only content is an icon need an aria-label (or visually hidden text).",
 	run(context) {
 		for (const element of context.analysis.elements) {
 			const resolution = context.resolve(element);
-			if (!isButton(context, element) || element.hasSpread) continue;
-			if (findAttribute(element, "asChild") || isHidden(element)) continue;
+			if (!isButton(context, element) || element.hasSpread || isHidden(element)) continue;
+			if (findAttribute(element, "asChild")) {
+				checkAsChildLink(context, element);
+				continue;
+			}
 			const host = renderHost(context, element);
 			if (host === "object") continue;
 			if (host && (isButton(context, host) || host.hasSpread)) continue;
@@ -9239,6 +9683,8 @@ const iconButtonAccessibleName = {
 };
 //#endregion
 //#region src/lint/rules/hardcoded.ts
+/** `var(--color-green-50)`: a shade of Tailwind's palette through its CSS variable. */
+const PALETTE_VARIABLE = /^var\(\s*--color-([a-z]+-(?:50|[1-9]00|950))\s*\)$/;
 /** Luminance values, not design colors: `white`/`black` (and hex twins). */
 const MASK_LUMINANCE = /* @__PURE__ */ new Set([
 	"white",
@@ -9304,25 +9750,51 @@ const noHardcodedColor = {
 			const key = classString.element ?? classString;
 			const list = lists.get(key) ?? [];
 			lists.set(key, list);
+			const element = classString.element;
 			for (const token of splitClasses(classString.text, classString.start)) {
 				const utility = parseUtility(token.value);
 				const listed = {
 					value: token.value,
-					prefix: tokenColorPrefix(utility, tokens.colorKeys)
+					prefix: tokenColorPrefix(utility, tokens.colorKeys),
+					element
 				};
 				list.push(listed);
-				if (allow.has(token.value.toLowerCase())) continue;
-				const element = classString.element;
+				const allowed = allow.has(token.value.toLowerCase());
 				if (utility.arbitrary !== void 0 && utility.prefix && COLOR_PREFIXES.includes(utility.prefix)) {
 					const value = utility.arbitrary.replace(/^color:/, "").trim();
+					const shade = PALETTE_VARIABLE.exec(value)?.[1];
+					const viaVariable = shade ? paletteColor(`${utility.prefix}-${shade}`) : void 0;
+					if (viaVariable) {
+						const color = tokens.colorKeys.has(viaVariable.key) ? void 0 : parseColor(viaVariable.value);
+						if (!color) continue;
+						listed.color = color;
+						listed.prefix = viaVariable.prefix;
+						listed.tinted = !viaVariable.gray;
+						if (allowed) continue;
+						listed.report = colorReport(context, {
+							start: token.start,
+							end: token.end,
+							what: `\`${token.value}\` is Tailwind's default palette (\`${viaVariable.key}\`), not a design-system color`,
+							color,
+							tinted: !viaVariable.gray,
+							palette: viaVariable.key,
+							prefix: viaVariable.prefix,
+							place: "class",
+							utility,
+							element,
+							classes: classString.text
+						});
+						continue;
+					}
 					const whole = parseColor(value);
 					const literal = whole ? {
 						text: value,
 						color: whole
 					} : findColorLiterals(value)[0];
-					if (!literal || allow.has(literal.text.toLowerCase())) continue;
+					if (!literal) continue;
 					listed.color = literal.color;
 					listed.prefix = whole ? utility.prefix : void 0;
+					if (allowed || allow.has(literal.text.toLowerCase())) continue;
 					listed.report = colorReport(context, {
 						start: token.start,
 						end: token.end,
@@ -9344,9 +9816,10 @@ const noHardcodedColor = {
 						text: value,
 						color: whole
 					} : findColorLiterals(value)[0];
-					if (!literal || allow.has(literal.text.toLowerCase())) continue;
+					if (!literal) continue;
 					listed.color = literal.color;
 					listed.prefix = whole ? property.prefix : void 0;
+					if (allowed || allow.has(literal.text.toLowerCase())) continue;
 					listed.report = colorReport(context, {
 						start: token.start,
 						end: token.end,
@@ -9366,6 +9839,8 @@ const noHardcodedColor = {
 					if (!color) continue;
 					listed.color = color;
 					listed.prefix = palette.prefix;
+					listed.tinted = !palette.gray;
+					if (allowed) continue;
 					listed.report = colorReport(context, {
 						start: token.start,
 						end: token.end,
@@ -9379,13 +9854,64 @@ const noHardcodedColor = {
 						element,
 						classes: classString.text
 					});
+					continue;
+				}
+				const keyword = keywordColor(utility, tokens.colorKeys);
+				const tint = keyword ? void 0 : keywordColor(utility, tokens.colorKeys, true);
+				if (tint && colorRole(tint.prefix) === "text" && !(element && isInsideMask(element))) {
+					listed.color = tint.color;
+					listed.prefix = tint.prefix;
+				}
+				if (keyword && !(element && isInsideMask(element))) {
+					listed.color = keyword.color;
+					listed.prefix = keyword.prefix;
+					if (allowed) continue;
+					listed.keyword = {
+						start: token.start,
+						end: token.end,
+						what: `\`${token.value}\` is a fixed color, not a design-system color`,
+						color: keyword.color,
+						tinted: false,
+						keyword: true,
+						prefix: keyword.prefix,
+						place: "class",
+						utility,
+						element,
+						classes: classString.text
+					};
 				}
 			}
 		}
-		for (const list of lists.values()) {
-			keepStatesApart(list);
-			for (const { report } of list) if (report) context.report(report);
+		const surfaces = new Surfaces(context, lists);
+		const texts = [];
+		const fixedTexts = [];
+		for (const list of lists.values()) for (const listed of list) {
+			const text = colorRole(listed.prefix) === "text" && listed.color !== void 0;
+			if (listed.keyword) {
+				if (text) {
+					const placed = surfaces.place(list, listed);
+					texts.push({
+						text: listed,
+						list
+					});
+					if (placed.contrasts) continue;
+				}
+				listed.report = colorReport(context, listed.keyword);
+			} else if (text) (listed.report?.fix ? fixedTexts : texts).push({
+				text: listed,
+				list
+			});
+		}
+		for (const { text, list } of texts) surfaces.holdUnderText(text, list);
+		for (const list of lists.values()) keepStatesApart(list);
+		const stays = new Set(texts.map(({ text }) => text));
+		for (const { text, list } of fixedTexts) {
+			if (text.report?.fix) continue;
+			stays.add(text);
+			surfaces.holdUnderText(text, list);
 		}
+		surfaces.holdUnderInherited(stays);
+		for (const list of lists.values()) for (const { report } of list) if (report) context.report(report);
 		for (const { object, element } of context.analysis.styles) for (const prop of object.properties) {
 			if (!ts.isPropertyAssignment(prop)) continue;
 			const name = propertyName(prop.name);
@@ -9474,6 +10000,8 @@ function colorReport(context, input) {
 	const opacityGap = formatOpacityGap(input.color, value, `${token.name}${inMode}`);
 	const tinted = input.tinted ?? isTinted(input.color);
 	const noHue = !close && reason === "hue" && tinted;
+	const keywordText = input.keyword === true && role === "text";
+	const keptBack = input.keyword && close && edit && !held && !status ? keywordText ? "White or black text depends on the surface under it, so this is not applied automatically: use the foreground token of that surface." : nearest.distance >= .02 ? "Only a token of exactly this color is applied automatically." : void 0 : void 0;
 	let message;
 	if (close) {
 		message = `${input.what}. ${nearest.distance < .02 ? "Matches token" : "Nearest token"} ${found}`;
@@ -9483,6 +10011,7 @@ function colorReport(context, input) {
 		if (opacityGap) message += ` ${opacityGap}`;
 		if (status) message += ` ${status}`;
 		else if (held) message += ` ${held}`;
+		else if (keptBack) message += ` ${keptBack}`;
 	} else if (noHue) message = `${input.what}. ${NO_TOKEN_HAS_HUE}`;
 	else message = `${input.what}. ${noMatch(reason, role, found, hueOff)}${meantForAnother(otherRole, input.color, mode)}${opacityGap ? ` ${opacityGap}` : ""} Pick the semantic token that fits.`;
 	const owner = !variant && input.prefix && input.element ? variantProp(context, input.element, input.prefix) : void 0;
@@ -9492,11 +10021,11 @@ function colorReport(context, input) {
 		end: input.end,
 		message,
 		suggestion: close ? variant ?? replacement : void 0,
-		fix: close && edit && !held && !status ? [{
+		fix: close && edit && !held && !status && !keptBack ? [{
 			range: [input.start, input.end],
 			text: edit
 		}] : void 0,
-		severity: noHue ? "warning" : void 0
+		severity: noHue || keywordText ? "warning" : void 0
 	};
 }
 /**
@@ -9555,6 +10084,390 @@ function tokenColorPrefix(utility, colorKeys) {
 	if (!key || !(colorKeys.has(key) || KEYWORD_COLORS.has(key))) return void 0;
 	return utility.base.slice(0, -key.length - 1);
 }
+/** `bg-white`, `border-black`: Tailwind's colors without a shade, as a color utility sets them. */
+const KEYWORD_CLASS = new RegExp(`^(${COLOR_PREFIXES.join("|")})-(${Object.keys(TAILWIND_KEYWORD_COLORS).join("|")})$`);
+/**
+* The white or black an opaque class sets (`bg-white`, `text-black`). With an opacity modifier
+* (`bg-black/50`, `border-white/10`) it is a tint of whatever is under it, a scrim or a hairline
+* that suits both modes, so it is left alone: with `tint`, only such a class is read. A theme
+* that defines `--color-white` (after `--color-*: initial`) makes `bg-white` one of its tokens.
+*/
+function keywordColor(utility, colorKeys, tint = false) {
+	if (Boolean(utility.modifier) !== tint || utility.arbitrary !== void 0) return void 0;
+	const [, prefix, name] = KEYWORD_CLASS.exec(utility.base) ?? [];
+	if (!prefix || !name || colorKeys.has(name)) return void 0;
+	const color = parseColor(TAILWIND_KEYWORD_COLORS[name] ?? "");
+	return color ? {
+		prefix,
+		color
+	} : void 0;
+}
+/** The node around `node`, or undefined at the file. */
+function parentOf(node) {
+	return ts.isSourceFile(node) ? void 0 : node.parent;
+}
+/** Background classes that set no background of their own: what is under them shows through. */
+const NO_BACKGROUND = /^bg-(?:transparent|current|inherit|none)$/;
+/** Style properties that set an element's background, and values that set none. */
+const STYLE_BACKGROUNDS = /* @__PURE__ */ new Set([
+	"background",
+	"backgroundColor",
+	"backgroundImage"
+]);
+const NO_STYLE_BACKGROUND = /^(?:transparent|none|inherit|initial|unset|revert|currentcolor)$/i;
+/** `var(--primary)`: a custom property, which can be a token's. */
+const CSS_VARIABLE = /^var\(\s*(--[\w-]+)\s*\)$/;
+/**
+* How far apart in lightness (OKLCH L) white or black text and its surface must be for the
+* surface to be the text's own: white on `bg-indigo-600` or `bg-orange-500` (0.705), not on
+* `bg-amber-400` or `bg-muted`; black on `bg-yellow-300`, not on `bg-indigo-600`. A token is
+* judged in each mode the text shows in: shadcn/ui's `primary` is near white in dark mode, so
+* white text on `bg-primary` is not its own there.
+*/
+const SURFACE_CONTRAST = .25;
+/** Whether text of this color stands out from a surface of this color. */
+function standsOut(surface, text) {
+	return Math.abs(surface.l - text.l) >= SURFACE_CONTRAST;
+}
+/**
+* WCAG's least contrast for large text and the parts of a control. Lightness alone says too
+* little near black: `text-neutral-600` is 0.44 lighter than black and has 2.7:1 on it, and
+* `text-neutral-800` 1.6:1.
+*/
+const TEXT_CONTRAST = 3;
+/** How hardcoded text reads on a surface: far enough apart in lightness, and in WCAG contrast. */
+function legibility(surface, text) {
+	return {
+		apart: standsOut(surface, text),
+		contrast: wcagContrast(surface, text) >= TEXT_CONTRAST
+	};
+}
+/** The color a text, fill or stroke class hardcodes, or undefined when it sets none. */
+function paintOf(text) {
+	if (colorRole(text.prefix) !== "text" || !text.color) return void 0;
+	return {
+		color: text.color,
+		variants: parseUtility(text.value).variants,
+		element: text.element
+	};
+}
+/**
+* Where white or black text sits, which says whether the text is the surface's contrast color
+* (shadcn/ui's `bg-destructive text-white`) or the theme's: the background its own element sets,
+* in `style` or in its class list, its component's variants set (`<Button>` with `bg-*`
+* variants), or the nearest element around it that sets one. Any other hardcoded text is placed
+* the same way, to hold the fix of a background it would not stand out from.
+*/
+var Surfaces = class {
+	context;
+	lists;
+	byNode = /* @__PURE__ */ new Map();
+	tokenColors = /* @__PURE__ */ new Map();
+	byVar = /* @__PURE__ */ new Map();
+	/** Backgrounds an element sets in `style`: each value's color, by mode. */
+	styled = /* @__PURE__ */ new Map();
+	held = /* @__PURE__ */ new Set();
+	placed = /* @__PURE__ */ new Map();
+	constructor(context, lists) {
+		this.context = context;
+		this.lists = lists;
+		for (const element of context.analysis.elements) this.byNode.set(element.node, element);
+		for (const candidate of context.target.tokens.colors) {
+			const { tailwind, cssVar } = candidate.token;
+			if (tailwind) this.tokenColors.set(tailwind, candidate);
+			if (cssVar) this.byVar.set(cssVar, candidate);
+		}
+		for (const { element, object } of context.analysis.styles) for (const prop of object.properties) {
+			if (!ts.isPropertyAssignment(prop) && !ts.isShorthandPropertyAssignment(prop)) continue;
+			const name = propertyName(prop.name);
+			if (name === void 0 || !STYLE_BACKGROUNDS.has(name)) continue;
+			const values = ts.isPropertyAssignment(prop) ? valueBranches(prop.initializer) : [prop.name];
+			const colors = this.styled.get(element.node) ?? [];
+			for (const value of values) {
+				const read = this.styleColor(value);
+				if (read) colors.push(read);
+			}
+			if (colors.length) this.styled.set(element.node, colors);
+		}
+	}
+	/**
+	* Where the text sits, in each mode it shows in: a `dark:` class in dark mode only, another
+	* one in its base mode and in dark mode, unless its class list sets its dark color itself
+	* (`text-black dark:text-white`). It is the surface's own only if it stands out in each.
+	*/
+	place(list, text) {
+		let placed = this.placed.get(text);
+		if (!placed) {
+			const paint = paintOf(text);
+			placed = paint ? this.placeInModes(list, text, paint) : { contrasts: true };
+			this.placed.set(text, placed);
+		}
+		return placed;
+	}
+	placeInModes(list, text, paint) {
+		const { variants } = paint;
+		const modes = variants.includes("dark") ? ["dark"] : hasDarkCounterpart(list, text) ? [void 0] : [void 0, "dark"];
+		let under;
+		for (const mode of modes) {
+			const state = mode === "dark" && !variants.includes("dark") ? [...variants, "dark"] : variants;
+			const placed = this.placeIn(list, paint, state, mode);
+			if (!placed.contrasts) return placed;
+			under ??= placed.under;
+		}
+		return {
+			contrasts: true,
+			under
+		};
+	}
+	/**
+	* Takes back the fix of a hardcoded background when hardcoded text on it stays as it is and may
+	* no longer stand out: `bg-black text-white` or `bg-zinc-900 text-white` would become
+	* `bg-primary text-white`, white on near white where `primary` is light (shadcn/ui's dark
+	* mode), and `bg-white text-neutral-800` would become `bg-background text-neutral-800`, dark
+	* gray on near black. The text is on the backgrounds of its own class list, in their states too
+	* (`hover:bg-black`), and on the surface `place` finds for it.
+	*/
+	holdUnderText(text, list) {
+		this.holdUnder(text, list, list);
+		const { under } = this.place(list, text);
+		if (under && under !== list) this.holdUnder(text, list, under);
+	}
+	/**
+	* Takes back the fixes of backgrounds whose text color comes from around them, as text color is
+	* inherited: in `<div className="text-neutral-800"><p className="bg-white">` the paragraph is
+	* dark gray on white. An element in between that sets a text color, or a component, which can
+	* set one of its own, ends it. An element with nothing in it (a skeleton's `<span />`) shows no
+	* text.
+	*/
+	holdUnderInherited(stays) {
+		for (const list of this.lists.values()) {
+			const element = list[0]?.element;
+			if (!element || !element.children.some((c) => !(ts.isJsxText(c) && c.containsOnlyTriviaWhiteSpaces)) || !list.some((listed) => listed.prefix === "bg" && listed.report?.fix)) continue;
+			for (let node = element.node; node; node = parentOf(node)) {
+				const around = this.byNode.get(node);
+				if (!around) continue;
+				if (this.context.resolve(around).kind !== "intrinsic") break;
+				const aroundList = this.lists.get(around) ?? [];
+				const texts = aroundList.filter((listed) => listed.prefix === "text" && !parseUtility(listed.value).variants.some(stylesAnother));
+				if (!texts.length) continue;
+				if (around !== element) {
+					for (const text of texts) if (stays.has(text)) this.holdUnder(text, aroundList, list);
+				}
+				break;
+			}
+		}
+	}
+	/**
+	* Takes back the fixes of the backgrounds in `under` that the text would not stand out from.
+	* The text loses a token in a mode where it has less than it had on the hardcoded background:
+	* 0.25 of lightness apart, or 3:1 contrast. A token without other modes may still have a dark
+	* one onsystem does not read (`.dark:not(.light)`), so it counts as changing there. The fix
+	* stays when the token keeps that in every mode the text shows in, or the class lists set the
+	* dark-mode background or text (`dark:bg-zinc-900`, `dark:text-white`).
+	*/
+	holdUnder(text, list, under) {
+		const paint = paintOf(text);
+		if (!paint) return;
+		const textIsDark = paint.variants.includes("dark");
+		const textInDark = textIsDark || !hasDarkCounterpart(list, text);
+		for (const surface of under) {
+			const { report, color: surfaceColor } = surface;
+			const fix = report?.fix?.[0];
+			if (!report || !fix || !surfaceColor || surface.prefix !== "bg" || this.held.has(surface)) continue;
+			const surfaceUtility = parseUtility(surface.value);
+			if (surfaceUtility.variants.includes("dark")) continue;
+			const before = legibility(surfaceColor, paint.color);
+			if (!before.apart && !before.contrast) continue;
+			const token = this.fixedTo(fix.text);
+			if (!token) continue;
+			const surfaceInDark = !hasDarkCounterpart(under, surface);
+			const modes = Object.entries(token.modes ?? {});
+			const known = modes.length > 0;
+			if (!known) modes.push(["dark", void 0]);
+			const lost = modes.filter(([mode, value]) => {
+				if (!(mode === "dark" ? textInDark && surfaceInDark : !textIsDark)) return false;
+				if (value === void 0) return true;
+				const after = legibility(value, paint.color);
+				return before.apart && !after.apart || before.contrast && !after.contrast;
+			}).map(([mode]) => mode);
+			if (!lost.length) continue;
+			this.held.add(surface);
+			const textUtility = parseUtility(text.value);
+			const shade = KEYWORD_CLASS.exec(textUtility.base)?.[2] ?? "as it is";
+			const name = token.token.name;
+			const why = !known ? `and ${name} may be another color in a dark mode` : `which would not stand out from ${name} in ${lost.includes("dark") ? "dark mode" : `the ${lost[0] ?? ""} mode`}`;
+			const variants = [...textUtility.variants];
+			if (under === list) {
+				for (const variant of surfaceUtility.variants) if (!variants.includes(variant)) variants.push(variant);
+			}
+			const pair = text.tinted ?? isTinted(paint.color) ? void 0 : this.foregroundOf(token, {
+				...textUtility,
+				variants
+			}, text.prefix);
+			report.message += ` \`${text.value}\` on it stays ${shade}, ${why}, so this is not applied automatically: change the text with it${pair ? `, to \`${pair}\`` : ""}.`;
+			report.fix = void 0;
+		}
+	}
+	/** The token a background's fix puts in: `bg-primary`, or `bg-[var(--chart-bg)]`. */
+	fixedTo(fixed) {
+		const utility = parseUtility(fixed);
+		const variable = utility.arbitrary === void 0 ? void 0 : CSS_VARIABLE.exec(utility.arbitrary.trim())?.[1];
+		if (variable) return this.byVar.get(variable);
+		return this.tokenColors.get(utility.base.slice(3));
+	}
+	/** The text class of the token made for text on `surface`: `text-foreground` on `background`. */
+	foregroundOf(surface, text, prefix) {
+		const key = surface.token.tailwind;
+		if (!key || !prefix) return void 0;
+		const pair = key === "background" ? "foreground" : `${key}-foreground`;
+		return this.tokenColors.has(pair) ? withBase(text, `${prefix}-${pair}`) : void 0;
+	}
+	/**
+	* Where the text sits in one mode, and the class list that says so. Under a tint it does not
+	* stand out from (`bg-white/10` under white text), what is under the tint decides; with nothing
+	* under it in the file, the page's `background` in that mode does.
+	*/
+	placeIn(list, text, state, mode) {
+		const { color, element } = text;
+		/** Whether the text is under a tint it does not stand out from, which shows what is under it. */
+		const seen = { through: false };
+		/** What an element's `style`, then its class list, says: undefined to look further out. */
+		const at = (node, classes, component) => {
+			const styled = node ? this.styleVerdict(node, color, mode) : void 0;
+			if (styled === "through") seen.through = true;
+			if (styled !== void 0) return styled === "through" ? void 0 : { contrasts: styled };
+			const says = this.verdict(classes, color, state, mode);
+			if (says === "through") seen.through = true;
+			else if (says !== void 0) return {
+				contrasts: says,
+				under: classes
+			};
+			if (component && variantProp(this.context, component, "bg")) return { contrasts: true };
+		};
+		const own = at(element?.node, list, element);
+		if (own) return own;
+		for (let node = element?.node.parent; node; node = parentOf(node)) {
+			const around = this.byNode.get(node);
+			if (!around) continue;
+			const placed = at(node, this.lists.get(around) ?? [], around);
+			if (placed) return placed;
+		}
+		if (!seen.through) return { contrasts: false };
+		const page = this.tokenColors.get("background");
+		return { contrasts: !page || standsOut(valueIn(page, mode), color) };
+	}
+	/**
+	* What a class list's background says for the text, or undefined when it sets none. Any
+	* background the text stands out from is its own: a list holds the classes of every branch
+	* of a `cn()` object, which never apply together. Then a tint it does not stand out from,
+	* whose surface is under it: in dark mode, `bg-neutral-50 dark:bg-white/10` is a tint over the
+	* page.
+	*/
+	verdict(list, text, state, mode) {
+		let verdict;
+		for (const { value } of list) {
+			const says = this.excuses(parseUtility(value), text, state, mode);
+			if (says === true) return true;
+			if (says === "through" || verdict === void 0) verdict = says ?? verdict;
+		}
+		return verdict;
+	}
+	/**
+	* What a background set in `style` says for the text: an inline style is over the classes.
+	* A color known only at run time (a swatch) or an image is a surface of its own.
+	*/
+	styleVerdict(node, text, mode) {
+		const colors = this.styled.get(node);
+		if (!colors) return void 0;
+		let verdict = "through";
+		for (const read of colors) {
+			const color = read(mode);
+			if (color === "unknown" || standsOut(color, text)) verdict = true;
+			else if ((color.alpha ?? 1) >= 1) return false;
+		}
+		return verdict;
+	}
+	/** How a style value colors the background: undefined when it sets none. */
+	styleColor(value) {
+		if (value.kind === ts.SyntaxKind.NullKeyword) return void 0;
+		if (ts.isIdentifier(value) && value.text === "undefined") return void 0;
+		if (!ts.isStringLiteralLike(value)) return () => "unknown";
+		const text = value.text.trim();
+		if (!text || NO_STYLE_BACKGROUND.test(text)) return void 0;
+		const variable = CSS_VARIABLE.exec(text)?.[1];
+		const token = variable ? this.byVar.get(variable) : void 0;
+		if (token) return (mode) => valueIn(token, mode);
+		const color = parseColor(text);
+		return () => color ?? "unknown";
+	}
+	/**
+	* Whether a class sets a surface the text contrasts with: a gradient, an image, or a color far
+	* enough from the text's in lightness. An opaque `bg-white` or `bg-black` is the page's own
+	* color, as hardcoded as the text. A tint (`bg-black/60`) is a surface where it stands out;
+	* `bg-white/10` under white text shows what is under it (`through`). Undefined for a class
+	* that sets no background, or sets one only in a state the text is not in: `hover:bg-red-600`
+	* is the surface of `hover:text-white`, not of `text-white`.
+	*/
+	excuses(utility, text, state, mode) {
+		const { base, modifier } = utility;
+		if (!utility.variants.every((variant) => state.includes(variant))) return void 0;
+		if (/^(?:from|via)-/.test(base)) return true;
+		if (!base.startsWith("bg-") || NO_BACKGROUND.test(base)) return void 0;
+		if (keywordColor(utility, this.context.target.tokens.colorKeys)) return false;
+		const color = this.backgroundColor(utility, mode);
+		if (color === "unknown") return true;
+		const contrasts = standsOut(color, text);
+		return modifier && !contrasts ? "through" : contrasts;
+	}
+	/** The color a `bg-*` class sets in a mode: a token's, the palette's, or written in it. */
+	backgroundColor(utility, mode) {
+		const key = utility.base.slice(3);
+		const token = this.tokenColors.get(key);
+		if (token) return valueIn(token, mode);
+		const palette = paletteColor(utility.base);
+		if (palette) return parseColor(palette.value) ?? "unknown";
+		const keyword = TAILWIND_KEYWORD_COLORS[key];
+		if (keyword) return parseColor(keyword) ?? "unknown";
+		if (utility.arbitrary === void 0) return "unknown";
+		const value = utility.arbitrary.replace(/^color:/, "").trim();
+		const shade = PALETTE_VARIABLE.exec(value)?.[1];
+		const variable = shade ? void 0 : CSS_VARIABLE.exec(value)?.[1];
+		const viaVariable = variable ? this.byVar.get(variable) : void 0;
+		if (viaVariable) return valueIn(viaVariable, mode);
+		const color = shade ? paletteColor(`bg-${shade}`)?.value : value;
+		return color && parseColor(color) || "unknown";
+	}
+};
+/**
+* Whether the class list sets the color of `listed` for dark mode too: `text-black dark:text-white`,
+* `bg-white dark:bg-zinc-900`. Only a class that adds `dark:` and nothing else to its variants,
+* whatever its color: `dark:bg-darkgray-50` names a color of a config onsystem may not read.
+*/
+function hasDarkCounterpart(list, listed) {
+	const { prefix } = listed;
+	if (prefix === void 0) return false;
+	const { variants } = parseUtility(listed.value);
+	if (variants.includes("dark")) return false;
+	return list.some((other) => {
+		if (other === listed) return false;
+		const theirs = parseUtility(other.value);
+		if (other.prefix !== prefix && !(other.prefix === void 0 && setsColor(theirs, prefix))) return false;
+		return theirs.variants.includes("dark") && theirs.variants.every((variant) => variant === "dark" || variants.includes(variant)) && variants.every((variant) => theirs.variants.includes(variant));
+	});
+}
+/** Utilities of a color prefix that set no color: `bg-cover`, `text-sm`, `stroke-2`. */
+const NOT_A_COLOR = {
+	bg: /^bg-(?:auto|cover|contain|fixed|local|scroll|repeat.*|no-repeat|center|(?:top|bottom|left|right)(?:-.*)?|clip-.*|origin-.*|blend-.*|gradient-.*|linear.*|radial.*|conic.*|none|size-.*|position-.*|\[url\(.*)$/,
+	text: /^text-(?:xs|sm|base|lg|\d?xl|left|center|right|justify|start|end|wrap|nowrap|balance|pretty|ellipsis|clip|\[\d.*)$/,
+	fill: /^fill-none$/,
+	stroke: /^stroke-(?:none|\d.*|\[\d.*)$/
+};
+/** Whether a class of no known color sets the color of `prefix`: `dark:bg-darkgray-50`. */
+function setsColor(utility, prefix) {
+	if (!utility.base.startsWith(`${prefix}-`) || COLOR_UTILITY.exec(utility.base) === null) return false;
+	if (utility.prefix !== void 0 && utility.prefix !== prefix) return false;
+	return !NOT_A_COLOR[prefix]?.test(utility.base);
+}
 /**
 * Takes back a fix that would make a class under a condition (`hover:`, `focus-visible:`, `md:`)
 * the same color as the class without it: `bg-[#2563eb] hover:bg-[#1d4ed8]` would become
@@ -9823,13 +10736,14 @@ function lengthRule(id, description, spec) {
 					...utility,
 					negative
 				}, replacement.cls);
-				const message = replacement.exact ? `\`${token.value}\` is ${formatPx(px)}, which is on the ${spec.category} scale: use \`${fixed}\`.` : replacement.pill ? `\`${token.value}\` (${formatPx(px)}) is far above the radius scale, so it reads as fully rounded: use \`${fixed}\`.` : `Hardcoded ${spec.category} \`${token.value}\` (${formatPx(px)}) is off the scale. Nearest: \`${fixed}\` (${formatPx(replacement.px)})` + (replacement.far ? ", too far off to replace automatically." : ".");
+				const relative = !replacement.pill && FONT_RELATIVE.test(utility.arbitrary.trim());
+				const message = relative ? `\`${token.value}\` is font-relative: ${utility.arbitrary.trim()} is ${formatPx(px)} only at a 16px font. Nearest step: \`${fixed}\` (${formatPx(replacement.px)}), which does not grow with the font, so it is not applied automatically.` : replacement.exact ? `\`${token.value}\` is ${formatPx(px)}, which is on the ${spec.category} scale: use \`${fixed}\`.` : replacement.pill ? `\`${token.value}\` (${formatPx(px)}) is far above the radius scale, so it reads as fully rounded: use \`${fixed}\`.` : `Hardcoded ${spec.category} \`${token.value}\` (${formatPx(px)}) is off the scale. Nearest: \`${fixed}\` (${formatPx(replacement.px)})` + (replacement.far ? ", too far off to replace automatically." : ".");
 				context.report({
 					start: token.start,
 					end: token.end,
 					message,
 					suggestion: fixed,
-					fix: replacement.far ? void 0 : [{
+					fix: replacement.far || relative ? void 0 : [{
 						range: [token.start, token.end],
 						text: fixed
 					}]
@@ -9858,12 +10772,13 @@ function lengthRule(id, description, spec) {
 					const shown = number !== void 0 ? `${name}: ${raw}` : `${name}: "${raw}"`;
 					const size = replacement?.pill ? "fully rounded" : formatPx(replacement?.px ?? 0);
 					const advice = replacement ? replacement.tailwind ? `Use \`${cls}\` (${size}) in className instead of an inline style.` : `Use \`${cssVar ?? cls}\` (${size}).` : `Use ${spec.category} tokens instead.`;
+					const relative = number === void 0 && !replacement?.pill && values.some((v) => FONT_RELATIVE.test(v));
 					context.report({
 						start: init.getStart(context.sourceFile),
 						end: init.end,
-						message: `Hardcoded ${spec.category} \`${shown}\` in style. ${advice}`,
+						message: relative ? `Hardcoded ${spec.category} \`${shown}\` in style, font-relative: ${formatPx(px)} only at a 16px font. ${advice} No step of the scale grows with the font, so it is not applied automatically.` : `Hardcoded ${spec.category} \`${shown}\` in style. ${advice}`,
 						suggestion: replacement ? replacement.tailwind ? cls : cssVar : void 0,
-						fix: replacement && !replacement.tailwind && cssVar && replacement.exact ? [{
+						fix: replacement && !replacement.tailwind && cssVar && replacement.exact && !relative ? [{
 							range: [init.getStart(context.sourceFile), init.end],
 							text: `"${cssVar}"`
 						}] : void 0
@@ -9880,6 +10795,8 @@ function lengthRule(id, description, spec) {
 function unnamed(replacement) {
 	return replacement.exact && !replacement.tailwind && !replacement.cssVar;
 }
+/** A length in `em`, relative to the element's font size (`0.5em`, not `0.5rem`). */
+const FONT_RELATIVE = /^-?(?:\d+\.?\d*|\.\d+)em$/i;
 /** 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;
@@ -10236,7 +11153,7 @@ function isObject(value) {
 var name = "onsystem";
 //#endregion
 //#region src/version.ts
-const VERSION = "0.7.0";
+const VERSION = "0.8.0";
 const NAME = name;
 //#endregion
 //#region src/lint/sarif.ts
@@ -10349,6 +11266,10 @@ function fingerprint$1(uri, identity, occurrence) {
 }
 //#endregion
 //#region src/lint/format.ts
+/** From this many findings, `pretty` ends with a summary: more than a screen to scroll back through. */
+const SUMMARY_FROM = 50;
+/** The palette classes the summary lists. */
+const TOP_CLASSES = 10;
 const color = (code) => (text, enabled) => enabled ? `\u001b[${code}m${text}\u001b[39m` : text;
 const red = color(31);
 const yellow = color(33);
@@ -10392,6 +11313,7 @@ function formatDiagnostics(results, format, options = {}) {
 		lines.push("");
 	}
 	const total = errors + warnings;
+	if (total >= SUMMARY_FROM) lines.push(...summarize(results), "");
 	const notes = [options.baselined === void 0 ? "" : `${options.baselined.toLocaleString("en-US")} in the baseline`, ...options.notes ?? []].filter(Boolean);
 	const aside = notes.length ? ` (${notes.join("; ")})` : "";
 	const flagged = results.filter((r) => r.diagnostics.length).length;
@@ -10400,6 +11322,41 @@ function formatDiagnostics(results, format, options = {}) {
 	if (fixedHint) lines.push(dim(fixedHint, useColor));
 	return lines.join("\n");
 }
+/**
+* What a long run's findings add up to: the count per rule, as `init`'s dry run gives it, and
+* the Tailwind palette classes found most, each with the token to use. On a palette-heavy app
+* (Dub's web app, over 14,000 lines of findings) that reads as a plan for moving to the tokens.
+*/
+function summarize(results) {
+	const byRule = /* @__PURE__ */ new Map();
+	const pairs = /* @__PURE__ */ new Map();
+	const paletteFiles = /* @__PURE__ */ new Set();
+	let palette = 0;
+	for (const result of results) for (const d of result.diagnostics) {
+		byRule.set(d.ruleId, (byRule.get(d.ruleId) ?? 0) + 1);
+		if (d.ruleId !== "no-hardcoded-color") continue;
+		const utility = parseUtility(d.source);
+		if (!paletteColor(utility.base)) continue;
+		palette++;
+		paletteFiles.add(result.file);
+		const to = (d.fix?.length === 1 ? d.fix[0]?.text : void 0) ?? (d.suggestion && /^[^\s"'=]+$/.test(d.suggestion) ? withBase(utility, d.suggestion) : d.suggestion);
+		const nearest = d.message.includes(". Nearest token ") ? " (nearest token)" : "";
+		const text = `${d.source} → ${to ? `${to}${nearest}` : "no close token"}`;
+		const pair = pairs.get(text) ?? {
+			text,
+			count: 0
+		};
+		pair.count++;
+		pairs.set(text, pair);
+	}
+	const lines = [`By rule: ${[...byRule].sort((a, b) => b[1] - a[1] || a[0].localeCompare(b[0])).map(([rule, n]) => `${rule} ${n.toLocaleString("en-US")}`).join(", ")}.`];
+	const top = [...pairs.values()].sort((a, b) => b.count - a.count || a.text.localeCompare(b.text)).slice(0, TOP_CLASSES);
+	if (top.length) {
+		const width = Math.max(...top.map((pair) => pair.count.toLocaleString("en-US").length));
+		lines.push(`Tailwind palette classes: ${palette.toLocaleString("en-US")} in ${plural$1(paletteFiles.size, "file")}. The most common, with the token to use:`, ...top.map((pair) => `  ${pair.count.toLocaleString("en-US").padStart(width)}× ${pair.text}`));
+	}
+	return lines;
+}
 /** Escapes a workflow command's message, so `%` and line breaks reach GitHub as written. */
 function escapeData(value) {
 	return value.replace(/%/g, "%25").replace(/\r/g, "%0D").replace(/\n/g, "%0A");
@@ -10974,18 +11931,46 @@ var DesignSystem = class {
 	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.
+	* has its own of that name, a wrapper the team means to be used, and the helpers in a
+	* registry folder's `lib/` (signoff-ui's `Img` and icons). The rules still check code that
+	* imports either directly against them.
 	*/
 	offered;
+	/** The design systems the rules rank, with the registry folders a config lists. */
+	sources;
 	constructor(model, config) {
 		this.model = model;
 		this.config = config;
-		this.lint = new LintTarget(model, config, new ModuleResolver(config));
+		this.sources = rankedSources(config);
+		this.lint = new LintTarget(model, this.sources === config.designSystems ? config : {
+			...config,
+			designSystems: this.sources
+		}, new ModuleResolver(config));
 		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.offered = model.components.filter((c) => (!c.library || !(own.has(c.name) || c.parent !== void 0 && own.has(c.parent))) && !this.registryHelper(c));
 		this.searchIndex = buildSearchIndex(this.offered);
 	}
+	/**
+	* The shadcn registry a component was copied from (`@signoff-ui`), when its folder is one
+	* components.json names: a read-only design system, whose code is the registry's.
+	*/
+	registryOf(component) {
+		if (component.library) return void 0;
+		const file = component.source.file;
+		for (const source of this.sources ?? []) {
+			if (!source.registry) continue;
+			const folder = source.components.find((g) => matchesGlob(file, g))?.replace(/\/\*\*\/\*\.\{tsx,jsx\}$/, "").replace(/\\(.)/g, "$1");
+			if (folder !== void 0) return {
+				registry: source.registry,
+				folder
+			};
+		}
+	}
+	/** A component in a registry folder's `lib/`: an internal of its items, not one of them. */
+	registryHelper(component) {
+		const from = this.registryOf(component);
+		return from !== void 0 && component.source.file.startsWith(`${from.folder}/lib/`);
+	}
 	get root() {
 		return this.model.root;
 	}
@@ -11071,6 +12056,31 @@ var DesignSystem = class {
 	}
 };
 const CONFIGURATION_DOCS = "https://onsystem.vercel.app/docs/configuration";
+/**
+* The design systems the rules rank, first to last: zero config's, or, for a config that lists
+* the folders `npx shadcn add` copies the registries of components.json into (as `init` writes
+* them), its other components first and each such folder after them, read-only, as zero config
+* reads them.
+*/
+function rankedSources(config) {
+	if (config.designSystems || !config.configured) return config.designSystems;
+	const listed = registryFolders(config.root, config.tsconfig).filter((f) => config.components.some((g) => matchesGlob(`${f.dir}/index.tsx`, g)));
+	if (!listed.length) return void 0;
+	const inRegistry = (glob) => {
+		const base = globBase(glob);
+		return listed.some((f) => base === f.dir || base.startsWith(`${f.dir}/`));
+	};
+	return [{
+		source: "components",
+		components: config.components.filter((g) => !inRegistry(g)),
+		imports: 0
+	}, ...listed.map((f) => ({
+		source: `${f.dir} (${f.namespace})`,
+		components: [f.glob],
+		imports: 0,
+		registry: f.namespace
+	}))];
+}
 /** `border-ring` → token `ring`, for color utilities a token's usage list does not spell out. */
 function matchUtility(base, tokens) {
 	const key = COLOR_UTILITY.exec(base)?.[1];
@@ -11585,4 +12595,4 @@ var DesignSystemHost = class {
 	}
 };
 //#endregion
-export { loadConfig as $, TokenIndex as A, parseDoc as B, pruneBaseline as C, relativePath as Ct, updateBaseline as D, unrecordedRules as E, TOKEN_CATEGORIES as F, DEFAULT_SEVERITY as G, CONFIG_FILES as H, parseDtcgTokens as I, LEGACY_CONFIG_FILES as J, DEFAULT_TEST_EXCLUDE as K, parseDesignMd as L, mergeTokens as M, toDesignMd as N, writeBaseline as O, toDtcg as P, hasOwnConfig as Q, parseCssTokens as R, countBaseline as S, matchesGlob as St, rulesRun as T, defaultProjectConfig as Tt, ConfigError as U, extractComponents as V, DEFAULT_DOCS as W, configJsonSchema as X, RULE_IDS as Y, defineConfig as Z, NAME as _, closest as _t, fingerprint as a, LIBRARY_IDS as at, LEGACY_BASELINE_FILE as b, unique as bt, silentLogger as c, PACKAGE_FIELD as ct, searchComponents as d, detectProject as dt, loadConfigWith as et, applyFixes as f, findDesignSystemPackage as ft, formatDiagnostics as g, workspacePatterns as gt, escapeData as h, workspacePackageDirs as ht, componentFiles as i, LIBRARIES as it, loadTokens as j, RULES as k, stderrLogger as l, PackageFinder as lt, uncheckedNotice as m, isWorkspaceRoot as mt, DesignSystemHost as n, formatPx as nt, loadDesignSystem as o, libraryTitle as ot, checkSource as p, isDesignSystemName as pt, DEFAULT_TEST_FOLDERS as q, buildModel as r, findVariantDefinitions as rt, tokenFiles as s, notReadYet as st, DesignSystem as t, rulesFor as tt, buildSearchIndex as u, declaredConfig as ut, VERSION as v, plural$1 as vt, readBaseline as w, toPosix as wt, applyBaseline as x, isInside as xt, BASELINE_FILE as y, truncate as yt, attachDocs as z };
+export { hasOwnConfig as $, TokenIndex as A, parseDoc as B, pruneBaseline as C, isInside as Ct, updateBaseline as D, defaultProjectConfig as Dt, unrecordedRules as E, toPosix as Et, TOKEN_CATEGORIES as F, DEFAULT_SEVERITY as G, CONFIG_FILES as H, parseDtcgTokens as I, LEGACY_CONFIG_FILES as J, DEFAULT_TEST_EXCLUDE as K, parseDesignMd as L, mergeTokens as M, toDesignMd as N, writeBaseline as O, readProjectConfig as Ot, toDtcg as P, excludedBy as Q, parseCssTokens as R, countBaseline as S, SCRIPT_FILE$1 as St, rulesRun as T, relativePath as Tt, ConfigError as U, extractComponents as V, DEFAULT_DOCS as W, configJsonSchema as X, RULE_IDS as Y, defineConfig as Z, NAME as _, workspacePatterns as _t, fingerprint as a, LIBRARIES as at, LEGACY_BASELINE_FILE as b, truncate as bt, silentLogger as c, notReadYet as ct, searchComponents as d, declaredConfig as dt, loadConfig as et, applyFixes as f, detectProject as ft, formatDiagnostics as g, workspacePackageDirs as gt, escapeData as h, isWorkspaceRoot as ht, componentFiles as i, findVariantDefinitions as it, loadTokens as j, RULES as k, stderrLogger as l, PACKAGE_FIELD as lt, uncheckedNotice as m, isDesignSystemName as mt, DesignSystemHost as n, rulesFor as nt, loadDesignSystem as o, LIBRARY_IDS as ot, checkSource as p, findDesignSystemPackage as pt, DEFAULT_TEST_FOLDERS as q, buildModel as r, formatPx as rt, tokenFiles as s, libraryTitle as st, DesignSystem as t, loadConfigWith as tt, buildSearchIndex as u, PackageFinder as ut, VERSION as v, closest as vt, readBaseline as w, matchesGlob as wt, applyBaseline as x, unique as xt, BASELINE_FILE as y, plural$1 as yt, attachDocs as z };