tokvista 1.11.0 → 1.11.2

package/dist/bin/tokvista.js

@@ -1097,6 +1097,45 @@ function isRecord7(value) {
 function isTokenLike5(obj) {
   return isRecord7(obj) && "value" in obj;
 }
+function validateTokenStructure(tokens) {
+  const issues = [];
+  function walk(node, path2 = [], level = 0) {
+    if (!isRecord7(node)) return;
+    if (path2.length === 0 && Object.keys(node).some((k) => k.includes("/"))) {
+      Object.values(node).forEach((val) => walk(val, [], level));
+      return;
+    }
+    if (isTokenLike5(node)) {
+      const tokenPath = path2.join(".");
+      const value = String(node.value || "");
+      const isSemanticToken = path2.some(
+        (p) => p.toLowerCase().includes("semantic") || p.toLowerCase().includes("component")
+      );
+      if (isSemanticToken && !value.startsWith("{")) {
+        if (/#[0-9A-Fa-f]{3,8}/.test(value) || /rgba?\(/.test(value)) {
+          issues.push({
+            path: tokenPath,
+            issue: "Semantic token uses hardcoded color",
+            value
+          });
+        }
+        if (/\d+px/.test(value) && (node.type === "spacing" || node.type === "sizing")) {
+          issues.push({
+            path: tokenPath,
+            issue: "Semantic token uses hardcoded spacing",
+            value
+          });
+        }
+      }
+      return;
+    }
+    Object.entries(node).forEach(([key, val]) => {
+      walk(val, [...path2, key], level + 1);
+    });
+  }
+  walk(tokens);
+  return issues;
+}
 function extractTokenNames(tokens) {
   const tokenMap = /* @__PURE__ */ new Map();
   function walk(node, path2 = []) {
@@ -1171,6 +1210,10 @@ async function scanDirectory(dir, tokenVars, extensions) {
         } else if (entry.isFile()) {
           const ext = extname(entry.name);
           if (extensions.has(ext)) {
+            const fileName = entry.name.toLowerCase();
+            if (fileName.includes("token") && (ext === ".css" || ext === ".scss" || ext === ".js")) {
+              continue;
+            }
             const result = await scanFile(fullPath, tokenVars);
             filesScanned++;
             result.usedVars.forEach((v) => usedVars.add(v));
@@ -1191,6 +1234,7 @@ async function scanTokenUsage(tokensPath, scanDir, tokens) {
   if (detection.format !== "token-studio" && detection.format !== "unknown") {
     normalizedTokens = normalizeTokenFormat(tokens, detection.format);
   }
+  const tokenFileIssues = validateTokenStructure(normalizedTokens);
   const tokenMap = extractTokenNames(normalizedTokens);
   const tokenVars = new Set(tokenMap.keys());
   const extensions = /* @__PURE__ */ new Set([".css", ".scss", ".sass", ".less", ".tsx", ".jsx", ".ts", ".js", ".vue", ".svelte"]);
@@ -1212,6 +1256,7 @@ async function scanTokenUsage(tokensPath, scanDir, tokens) {
     // Limit to 50
     hardcodedSpacing: scanResult.hardcodedSpacing.slice(0, 50),
     // Limit to 50
+    tokenFileIssues,
     filesScanned: scanResult.filesScanned
   };
 }
@@ -1251,7 +1296,7 @@ Usage:
   tokvista diff <old.json> <new.json>
   tokvista convert <tokens.json> --to <w3c|style-dictionary|supernova> [--output <file>]
   tokvista build <tokens.json> --output-dir <dir> [--skip-validation]
-  tokvista scan <directory> [--tokens tokens.json]
+  tokvista scan <directory|tokens.json> [--tokens tokens.json]
 
 Arguments:
   tokens.json       Path to your tokens file (overrides config.tokens)
@@ -1266,6 +1311,10 @@ Options:
   --no-watch        Disable live reload (serve only)
   --no-preview      Skip starting live preview after init
   -h, --help        Show this help message
+
+Scan command usage:
+  tokvista scan ./src --tokens tokens.json    # Scan directory with specific tokens
+  tokvista scan tokens.json                   # Scan current directory using tokens file
 `);
 }
 function parsePort(value) {
@@ -1550,11 +1599,11 @@ function parseScanArgs(args) {
       throw new Error(`Unknown option: ${arg}`);
     }
     if (scanDir) {
-      throw new Error(`Only one directory is supported. Unexpected value: "${arg}"`);
+      throw new Error(`Only one directory or token file is supported. Unexpected value: "${arg}"`);
     }
     scanDir = arg;
   }
-  if (!scanDir) throw new Error("Directory to scan is required");
+  if (!scanDir) throw new Error("Directory to scan or token file is required");
   return { command: "scan", scanDir, tokenFileArg };
 }
 function parseExportArgs(args) {
@@ -2373,7 +2422,70 @@ async function runBuildCommand(cwd, options) {
 `);
 }
 async function runScanCommand(cwd, options) {
-  const scanDir = path.resolve(cwd, options.scanDir);
+  const resolvedScanPath = path.resolve(cwd, options.scanDir);
+  if (existsSync(resolvedScanPath)) {
+    const fs = await import("fs");
+    if (!fs.statSync(resolvedScanPath).isDirectory()) {
+      const tokenPath2 = resolvedScanPath;
+      const scanDir2 = cwd;
+      const tokens2 = await readTokens(tokenPath2);
+      console.log(`
+Scanning ${scanDir2} for token usage...
+`);
+      const result2 = await scanTokenUsage(tokenPath2, scanDir2, tokens2);
+      const usagePercent2 = (result2.usedTokens.length / result2.totalTokens * 100).toFixed(1);
+      console.log(`\u{1F4CA} Token Usage Report
+`);
+      console.log(`Files scanned: ${result2.filesScanned}`);
+      console.log(`Total tokens: ${result2.totalTokens}`);
+      console.log(`Used tokens: ${result2.usedTokens.length} (${usagePercent2}%)`);
+      console.log(`Unused tokens: ${result2.unusedTokens.length}
+`);
+      if (result2.unusedTokens.length > 0) {
+        console.log(`\u26A0\uFE0F  Unused Tokens (safe to remove):`);
+        result2.unusedTokens.slice(0, 20).forEach((token) => {
+          console.log(`  - ${token}`);
+        });
+        if (result2.unusedTokens.length > 20) {
+          console.log(`  ... and ${result2.unusedTokens.length - 20} more`);
+        }
+        console.log("");
+      }
+      if (result2.tokenFileIssues.length > 0) {
+        console.log(`\u{1F6A8} Token File Issues:`);
+        result2.tokenFileIssues.forEach(({ path: path2, issue, value }) => {
+          console.log(`  ${path2}: ${issue} (${value})`);
+        });
+        console.log("");
+      }
+      if (result2.hardcodedColors.length > 0) {
+        console.log(`\u{1F3A8} Hardcoded Colors (should use tokens):`);
+        result2.hardcodedColors.slice(0, 10).forEach(({ file, line, value }) => {
+          const relPath = path.relative(cwd, file);
+          console.log(`  ${relPath}:${line} - ${value}`);
+        });
+        if (result2.hardcodedColors.length > 10) {
+          console.log(`  ... and ${result2.hardcodedColors.length - 10} more`);
+        }
+        console.log("");
+      }
+      if (result2.hardcodedSpacing.length > 0) {
+        console.log(`\u{1F4CF} Hardcoded Spacing (should use tokens):`);
+        result2.hardcodedSpacing.slice(0, 10).forEach(({ file, line, value }) => {
+          const relPath = path.relative(cwd, file);
+          console.log(`  ${relPath}:${line} - ${value}`);
+        });
+        if (result2.hardcodedSpacing.length > 10) {
+          console.log(`  ... and ${result2.hardcodedSpacing.length - 10} more`);
+        }
+        console.log("");
+      }
+      console.log(`\u2705 Scan complete
+`);
+      return;
+    }
+  }
+  const scanDir = resolvedScanPath;
   const tokenPath = options.tokenFileArg ? path.resolve(cwd, options.tokenFileArg) : path.resolve(cwd, "tokens.json");
   if (!existsSync(scanDir)) {
     throw new Error(`Directory not found: ${scanDir}`);
@@ -2404,6 +2516,13 @@ Scanning ${scanDir} for token usage...
     }
     console.log("");
   }
+  if (result.tokenFileIssues.length > 0) {
+    console.log(`\u{1F6A8} Token File Issues:`);
+    result.tokenFileIssues.forEach(({ path: path2, issue, value }) => {
+      console.log(`  ${path2}: ${issue} (${value})`);
+    });
+    console.log("");
+  }
   if (result.hardcodedColors.length > 0) {
     console.log(`\u{1F3A8} Hardcoded Colors (should use tokens):`);
     result.hardcodedColors.slice(0, 10).forEach(({ file, line, value }) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tokvista",
-  "version": "1.11.0",
+  "version": "1.11.2",
   "description": "Interactive visual documentation for design tokens.",
   "type": "module",
   "main": "./dist/index.cjs",