@motion-proto/live-tokens 0.78.0 → 0.80.0

package/dist-plugin/index.js

@@ -5,7 +5,7 @@ import {
   nextAvailableName,
   normalizeTheme,
   versionedFileResourceServer
-} from "./chunk-PDNL4NC5.js";
+} from "./chunk-D4WRIKEZ.js";
 import {
   formatGradientValue,
   palettesToVars,
@@ -16,7 +16,7 @@ import {
 } from "./chunk-O6GQ6GBH.js";
 import {
   CURRENT_COMPONENT_SCHEMA_VERSION
-} from "./chunk-SWXRVZKT.js";
+} from "./chunk-REBHE3ZM.js";
 import {
   TOKENS_CSS_MIGRATIONS,
   extractGlobalRootBody,
@@ -37,7 +37,7 @@ import {
 
 // vite-plugin/themeFileApi.ts
 import fs2 from "fs";
-import path2 from "path";
+import path3 from "path";
 
 // src/editor/core/themes/migrations/2026-07-21-palette-oklch-basis.ts
 var round = (v, dp) => {
@@ -229,18 +229,40 @@ function dataTreeWatch(opts) {
   return { noteOwnWrite, subscribe };
 }
 
+// vite-plugin/buildChecks.ts
+import path2 from "path";
+import { fileURLToPath, pathToFileURL } from "url";
+var runPackageChecks = async (root) => {
+  const runner = path2.resolve(path2.dirname(fileURLToPath(import.meta.url)), "..", "bin", "lib", "buildChecks.mjs");
+  const { runBuildChecks } = await import(pathToFileURL(runner).href);
+  return runBuildChecks({ root });
+};
+async function checkBeforeBuild({
+  root,
+  logger,
+  run = runPackageChecks
+}) {
+  const result = await run(root);
+  if (result.errors > 0) {
+    logger.error(result.report);
+    return `live-tokens: the design checks found ${result.errors} error(s). Run the live-tokens-check-compliance skill, or \`npx live-tokens check-page\` and \`npx live-tokens check-component\`, to repair them.`;
+  }
+  (result.warnings > 0 ? logger.warn : logger.info).call(logger, result.report);
+  return null;
+}
+
 // vite-plugin/themeFileApi.ts
-import { fileURLToPath } from "url";
+import { fileURLToPath as fileURLToPath2 } from "url";
 var PKG_VERSION = (() => {
   try {
-    let dir = path2.dirname(fileURLToPath(import.meta.url));
+    let dir = path3.dirname(fileURLToPath2(import.meta.url));
     for (let i = 0; i < 4; i++) {
-      const p = path2.join(dir, "package.json");
+      const p = path3.join(dir, "package.json");
       if (fs2.existsSync(p)) {
         const json = JSON.parse(fs2.readFileSync(p, "utf-8"));
         if (json?.name === "@motion-proto/live-tokens") return json.version ?? "";
       }
-      const up = path2.dirname(dir);
+      const up = path3.dirname(dir);
       if (up === dir) break;
       dir = up;
     }
@@ -284,37 +306,37 @@ function themeFileApi(opts) {
   const COMPONENT_CONFIGS_DIR = dataDirs.componentConfigsDir;
   const THEMES_DIR = dataDirs.themesDir;
   const SKETCH_STYLES_DIR = dataDirs.sketchStylesDir;
-  const CSS_PATH = path2.resolve(opts.tokensCssPath);
+  const CSS_PATH = path3.resolve(opts.tokensCssPath);
   const ISOLATED_DATA_DIR = testDataDir();
-  const GENERATED_CSS_PATH = ISOLATED_DATA_DIR ? path2.join(ISOLATED_DATA_DIR, "tokens.generated.css") : opts.tokensGeneratedCssPath ? path2.resolve(opts.tokensGeneratedCssPath) : path2.join(dataDirs.dataDir, "tokens.generated.css");
-  const FONTS_CSS_PATH = ISOLATED_DATA_DIR ? path2.join(ISOLATED_DATA_DIR, "fonts.css") : opts.fontsCssPath ? path2.resolve(opts.fontsCssPath) : path2.join(path2.dirname(CSS_PATH), "fonts.css");
+  const GENERATED_CSS_PATH = ISOLATED_DATA_DIR ? path3.join(ISOLATED_DATA_DIR, "tokens.generated.css") : opts.tokensGeneratedCssPath ? path3.resolve(opts.tokensGeneratedCssPath) : path3.join(dataDirs.dataDir, "tokens.generated.css");
+  const FONTS_CSS_PATH = ISOLATED_DATA_DIR ? path3.join(ISOLATED_DATA_DIR, "fonts.css") : opts.fontsCssPath ? path3.resolve(opts.fontsCssPath) : path3.join(path3.dirname(CSS_PATH), "fonts.css");
   const API_BASE = opts.apiBase ?? "/api/live-tokens";
-  const consumerComponentDirs = opts.componentsSrcDir ? [path2.resolve(opts.componentsSrcDir)] : [path2.resolve("src/components"), path2.resolve("src/system/components")];
-  const packageComponentsDir = path2.resolve(
-    path2.dirname(fileURLToPath(import.meta.url)),
+  const consumerComponentDirs = opts.componentsSrcDir ? [path3.resolve(opts.componentsSrcDir)] : [path3.resolve("src/components"), path3.resolve("src/system/components")];
+  const packageComponentsDir = path3.resolve(
+    path3.dirname(fileURLToPath2(import.meta.url)),
     "..",
     "src",
     "system",
     "components"
   );
-  const packageDataDir = testPackageDataDir() ?? path2.resolve(
-    path2.dirname(fileURLToPath(import.meta.url)),
+  const packageDataDir = testPackageDataDir() ?? path3.resolve(
+    path3.dirname(fileURLToPath2(import.meta.url)),
     "..",
     "src",
     "live-tokens",
     "data"
   );
-  const packageColorsAndTypeDir = path2.join(packageDataDir, "colors-and-type");
-  const packageThemesDir = path2.join(packageDataDir, "themes");
-  const packageComponentConfigsDir = path2.join(packageDataDir, "component-configs");
-  const packageSketchStylesDir = path2.join(packageDataDir, "sketch-styles");
+  const packageColorsAndTypeDir = path3.join(packageDataDir, "colors-and-type");
+  const packageThemesDir = path3.join(packageDataDir, "themes");
+  const packageComponentConfigsDir = path3.join(packageDataDir, "component-configs");
+  const packageSketchStylesDir = path3.join(packageDataDir, "sketch-styles");
   function shippedNames(dataDir, subdir) {
     try {
-      const pkgRoot = path2.resolve(dataDir, "..", "..", "..");
-      const pkg = JSON.parse(fs2.readFileSync(path2.join(pkgRoot, "package.json"), "utf-8"));
+      const pkgRoot = path3.resolve(dataDir, "..", "..", "..");
+      const pkg = JSON.parse(fs2.readFileSync(path3.join(pkgRoot, "package.json"), "utf-8"));
       const files = Array.isArray(pkg.files) ? pkg.files : [];
       const owned = new RegExp(`^src/live-tokens/data/${subdir}/[^/]+\\.json$`);
-      return files.filter((f) => owned.test(f)).map((f) => path2.basename(f, ".json"));
+      return files.filter((f) => owned.test(f)).map((f) => path3.basename(f, ".json"));
     } catch {
       return [];
     }
@@ -323,7 +345,7 @@ function themeFileApi(opts) {
   if (!COMPONENTS_SCAN_DIRS.includes(packageComponentsDir) && fs2.existsSync(packageComponentsDir)) {
     COMPONENTS_SCAN_DIRS.push(packageComponentsDir);
   }
-  const isLiveStateFile = (file) => file === path2.join(THEMES_DIR, "_active.json") || path2.basename(file) === "_working.json" && (file.startsWith(COLORS_AND_TYPE_DIR + path2.sep) || file.startsWith(COMPONENT_CONFIGS_DIR + path2.sep));
+  const isLiveStateFile = (file) => file === path3.join(THEMES_DIR, "_active.json") || path3.basename(file) === "_working.json" && (file.startsWith(COLORS_AND_TYPE_DIR + path3.sep) || file.startsWith(COMPONENT_CONFIGS_DIR + path3.sep));
   const liveWatch = dataTreeWatch({
     dirs: [COLORS_AND_TYPE_DIR, COMPONENT_CONFIGS_DIR, THEMES_DIR],
     isLive: isLiveStateFile
@@ -339,8 +361,8 @@ function themeFileApi(opts) {
     let r = componentResourceCache.get(comp);
     if (!r) {
       r = versionedFileResourceServer({
-        dir: path2.join(COMPONENT_CONFIGS_DIR, comp),
-        packageDir: path2.join(packageComponentConfigsDir, comp),
+        dir: path3.join(COMPONENT_CONFIGS_DIR, comp),
+        packageDir: path3.join(packageComponentConfigsDir, comp),
         onWrite: liveWatch.noteOwnWrite
       });
       componentResourceCache.set(comp, r);
@@ -431,7 +453,7 @@ function themeFileApi(opts) {
     const productionThemeName = themesResource.getProductionName();
     const productionTheme = readTheme(productionThemeName)?.theme ?? null;
     if (themesResource.existingPath(productionThemeName) !== null && !productionTheme?.colorsAndType) {
-      const tail = `${path2.basename(GENERATED_CSS_PATH)} was left as it was.`;
+      const tail = `${path3.basename(GENERATED_CSS_PATH)} was left as it was.`;
       throw new Error(
         unreadableThemeReason(productionThemeName) === "colors-and-type" ? `[live-tokens] ${notAThemeError(productionThemeName)} ${tail}` : `[live-tokens] Production theme "${productionThemeName}" is unreadable, so ${tail} Repair the theme file or adopt another theme.`
       );
@@ -502,12 +524,12 @@ function themeFileApi(opts) {
         lines.push("");
       }
     }
-    if (!fs2.existsSync(path2.dirname(GENERATED_CSS_PATH))) {
-      fs2.mkdirSync(path2.dirname(GENERATED_CSS_PATH), { recursive: true });
+    if (!fs2.existsSync(path3.dirname(GENERATED_CSS_PATH))) {
+      fs2.mkdirSync(path3.dirname(GENERATED_CSS_PATH), { recursive: true });
     }
     fs2.writeFileSync(GENERATED_CSS_PATH, lines.join("\n"));
     console.log(
-      `[regenerateTokensCss] Wrote ${path2.basename(GENERATED_CSS_PATH)} (${colorsAndTypeVarCount} theme vars, ${componentOverrideCount} component overrides)`
+      `[regenerateTokensCss] Wrote ${path3.basename(GENERATED_CSS_PATH)} (${colorsAndTypeVarCount} theme vars, ${componentOverrideCount} component overrides)`
     );
   }
   function syncFontsToCss(colorsAndTypeData) {
@@ -535,14 +557,14 @@ function themeFileApi(opts) {
       lines.push("");
     }
     const content = lines.join("\n");
-    if (!fs2.existsSync(path2.dirname(FONTS_CSS_PATH))) {
-      fs2.mkdirSync(path2.dirname(FONTS_CSS_PATH), { recursive: true });
+    if (!fs2.existsSync(path3.dirname(FONTS_CSS_PATH))) {
+      fs2.mkdirSync(path3.dirname(FONTS_CSS_PATH), { recursive: true });
     }
     fs2.writeFileSync(FONTS_CSS_PATH, content);
-    console.log(`[syncFontsToCss] Wrote ${sources.length} source(s) into ${path2.basename(FONTS_CSS_PATH)}`);
+    console.log(`[syncFontsToCss] Wrote ${sources.length} source(s) into ${path3.basename(FONTS_CSS_PATH)}`);
   }
   function componentNameFromFile(filePath) {
-    return path2.basename(filePath, ".svelte").toLowerCase();
+    return path3.basename(filePath, ".svelte").toLowerCase();
   }
   function isThemeAwareComponent(filePath) {
     try {
@@ -558,7 +580,7 @@ function themeFileApi(opts) {
       if (!fs2.existsSync(dir)) continue;
       for (const f of fs2.readdirSync(dir)) {
         if (!f.endsWith(".svelte")) continue;
-        const full = path2.join(dir, f);
+        const full = path3.join(dir, f);
         if (!isThemeAwareComponent(full)) continue;
         const name = componentNameFromFile(f);
         if (!byName.has(name)) byName.set(name, full);
@@ -591,7 +613,7 @@ function themeFileApi(opts) {
       (m) => `  ${m.token}  (referenced by ${m.referencedBy.join(", ")})`
     );
     log(
-      `[live-tokens] ${missing.length} token(s) referenced by components are not defined in ${path2.relative(process.cwd(), CSS_PATH)}:
+      `[live-tokens] ${missing.length} token(s) referenced by components are not defined in ${path3.relative(process.cwd(), CSS_PATH)}:
 ${lines.join("\n")}
   These render as blank/empty editor slots. Run \`npx live-tokens migrate\` to reconcile.`
     );
@@ -607,7 +629,7 @@ ${lines.join("\n")}
     if (!changed) return;
     fs2.writeFileSync(CSS_PATH, css);
     log(
-      `[live-tokens] autoMigrate applied ${applied.length} additive migration(s) to ${path2.relative(process.cwd(), CSS_PATH)}: ${applied.join(", ")}. Review the diff in git.`
+      `[live-tokens] autoMigrate applied ${applied.length} additive migration(s) to ${path3.relative(process.cwd(), CSS_PATH)}: ${applied.join(", ")}. Review the diff in git.`
     );
   }
   function generateDefaultConfig(comp, sourcePath) {
@@ -672,14 +694,14 @@ ${lines.join("\n")}
     const legacy = [];
     const check = (dir) => {
       for (const name of ["_active.json", "_production.json"]) {
-        const p = path2.join(dir, name);
-        if (fs2.existsSync(p)) legacy.push(path2.relative(process.cwd(), p));
+        const p = path3.join(dir, name);
+        if (fs2.existsSync(p)) legacy.push(path3.relative(process.cwd(), p));
       }
     };
     check(COLORS_AND_TYPE_DIR);
     if (fs2.existsSync(COMPONENT_CONFIGS_DIR)) {
       for (const entry of fs2.readdirSync(COMPONENT_CONFIGS_DIR, { withFileTypes: true })) {
-        if (entry.isDirectory()) check(path2.join(COMPONENT_CONFIGS_DIR, entry.name));
+        if (entry.isDirectory()) check(path3.join(COMPONENT_CONFIGS_DIR, entry.name));
       }
     }
     return legacy;
@@ -687,19 +709,19 @@ ${lines.join("\n")}
   function warnOnLegacyPointers(legacy, bakeHeld, warn) {
     if (legacy.length === 0) return;
     warn(
-      `[live-tokens] ${legacy.length} legacy pointer file(s) left from the pre-working-set data model, starting with ${legacy[0]}. They are no longer read. Run \`npx live-tokens migrate\` to heal the tree.` + (bakeHeld ? ` Until then this tree has named no production theme, so ${path2.basename(GENERATED_CSS_PATH)} is left exactly as it is rather than rebuilt from the default.` : "")
+      `[live-tokens] ${legacy.length} legacy pointer file(s) left from the pre-working-set data model, starting with ${legacy[0]}. They are no longer read. Run \`npx live-tokens migrate\` to heal the tree.` + (bakeHeld ? ` Until then this tree has named no production theme, so ${path3.basename(GENERATED_CSS_PATH)} is left exactly as it is rather than rebuilt from the default.` : "")
     );
   }
   function warnOnLegacyLayout(evidence, warn) {
     warn(
-      `[live-tokens] This project still uses the data layout from 0.47 and earlier: ${evidence}. Since 0.48 the whole-theme theme files live in \`themes/\` and the colors and type live in \`colors-and-type/\`. Nothing in the data directory was written, the editor cannot save, and ${path2.basename(GENERATED_CSS_PATH)} is left exactly as it is. Run \`npx live-tokens migrate\` to move the directories and heal the tree, then restart the dev server.`
+      `[live-tokens] This project still uses the data layout from 0.47 and earlier: ${evidence}. Since 0.48 the whole-theme theme files live in \`themes/\` and the colors and type live in \`colors-and-type/\`. Nothing in the data directory was written, the editor cannot save, and ${path3.basename(GENERATED_CSS_PATH)} is left exactly as it is. Run \`npx live-tokens migrate\` to move the directories and heal the tree, then restart the dev server.`
     );
   }
   function warnOnUnmigratedSketchStyles(warn) {
-    const legacyDir = path2.join(dataDirs.dataDir, "sketch-presets");
+    const legacyDir = path3.join(dataDirs.dataDir, "sketch-presets");
     if (!fs2.existsSync(legacyDir)) return;
     warn(
-      `[live-tokens] Saved sketchstyles still live under the retired ${path2.basename(legacyDir)}/ directory name. Run \`npx live-tokens migrate\` to rename it to ${path2.basename(SKETCH_STYLES_DIR)}/; until then they will not show up in the Sketchstyle view.`
+      `[live-tokens] Saved sketchstyles still live under the retired ${path3.basename(legacyDir)}/ directory name. Run \`npx live-tokens migrate\` to rename it to ${path3.basename(SKETCH_STYLES_DIR)}/; until then they will not show up in the Sketchstyle view.`
     );
   }
   const diskThemeResolvers = {
@@ -731,7 +753,7 @@ ${lines.join("\n")}
     return "corrupt";
   }
   function notAThemeError(fileName) {
-    return `"${fileName}" is a colors-and-type file, not a theme. Before 0.48 those lived in themes/; move it to ${path2.basename(COLORS_AND_TYPE_DIR)}/ or delete it. To build a theme, use the theme skill "create-theme".`;
+    return `"${fileName}" is a colors-and-type file, not a theme. Before 0.48 those lived in themes/; move it to ${path3.basename(COLORS_AND_TYPE_DIR)}/ or delete it. To build a theme, use the theme skill "create-theme".`;
   }
   function respondUnreadableTheme(res, fileName, missingError) {
     switch (unreadableThemeReason(fileName)) {
@@ -753,7 +775,7 @@ ${lines.join("\n")}
     fs2.writeFileSync(themesResource.filePath(fileName), JSON.stringify(theme, null, 2));
   }
   function migrateLocalThemes(warn) {
-    if (path2.resolve(THEMES_DIR) === path2.resolve(packageThemesDir)) return;
+    if (path3.resolve(THEMES_DIR) === path3.resolve(packageThemesDir)) return;
     if (!fs2.existsSync(THEMES_DIR)) return;
     for (const file of fs2.readdirSync(THEMES_DIR)) {
       if (!file.endsWith(".json") || file.startsWith("_")) continue;
@@ -761,7 +783,7 @@ ${lines.join("\n")}
       if (fileName === "default") continue;
       let raw;
       try {
-        raw = JSON.parse(fs2.readFileSync(path2.join(THEMES_DIR, file), "utf-8"));
+        raw = JSON.parse(fs2.readFileSync(path3.join(THEMES_DIR, file), "utf-8"));
       } catch {
         continue;
       }
@@ -1432,15 +1454,14 @@ data: ${JSON.stringify(state)}
       // spelled "no override" that way (normalizeTheme.ts's pointer-
       // resolution loop treats it identically), so it always meant *this
       // install's* default, not something the bundle carries. The
-      // completeness fill (Wave 2 of docs/plans/theme-completeness.md) relies
-      // on that fall-through: without it, `readComponentConfig(comp,
-      // 'default')` answers undefined for every component (no bundle ever
-      // carries a `<comp>/default` entry), the fill loop no-ops 25 times, and
-      // an incomplete bundle stays incomplete forever — exactly the drift RJC
-      // 10 exists to prevent.
+      // completeness fill relies on that fall-through: without it,
+      // `readComponentConfig(comp, 'default')` answers undefined for every
+      // component (no bundle ever carries a `<comp>/default` entry), the
+      // fill loop no-ops 25 times, and an incomplete bundle stays incomplete
+      // forever.
       readComponentConfig: (comp, name) => bundle.componentConfigs?.[`${comp}/${name}`] ?? (name === "default" ? readComponentConfig(comp, "default") : void 0),
       // Installed components are a property of this install, not of the
-      // bundle being imported, so the completeness fill (Wave 2) uses the
+      // bundle being imported, so the completeness fill uses the
       // same list the disk resolver does.
       listComponentNames,
       normalizeColorsAndType: (colorsAndType) => normalizeColorsAndType(colorsAndType)
@@ -1650,7 +1671,9 @@ data: ${JSON.stringify(state)}
     { method: "POST", pattern: PRODUCTION_ROUTE, handler: methodNotAllowed },
     { method: "DELETE", pattern: PRODUCTION_ROUTE, handler: methodNotAllowed }
   ];
-  const isEditorOwnedJson = (file) => file.endsWith(".json") && path2.resolve(file).startsWith(dataDirs.dataDir + path2.sep);
+  const isEditorOwnedJson = (file) => file.endsWith(".json") && path3.resolve(file).startsWith(dataDirs.dataDir + path3.sep);
+  let buildLogger = null;
+  let buildChecked = false;
   return {
     name: "theme-file-api",
     config() {
@@ -1663,6 +1686,15 @@ data: ${JSON.stringify(state)}
         server: { watch: { ignored: [isEditorOwnedJson] } }
       };
     },
+    configResolved(config) {
+      buildLogger = config.command === "build" && opts.checks !== false ? config.logger : null;
+    },
+    async buildStart() {
+      if (!buildLogger || buildChecked) return;
+      buildChecked = true;
+      const failure = await checkBeforeBuild({ root: process.cwd(), logger: buildLogger });
+      if (failure) this.error(failure);
+    },
     configureServer(server) {
       legacyLayout = detectLegacyLayout({
         dataDir: dataDirs.dataDir,
@@ -1704,7 +1736,7 @@ data: ${JSON.stringify(state)}
     },
     handleHotUpdate(ctx) {
       if (legacyLayout) return;
-      const normalized = path2.resolve(ctx.file);
+      const normalized = path3.resolve(ctx.file);
       if (!COMPONENTS_SCAN_DIRS.some((d) => normalized.startsWith(d))) return;
       if (!normalized.endsWith(".svelte")) return;
       if (!isThemeAwareComponent(normalized)) return;