@nice2dev/design-tokens 1.0.28

package/dist/cli/index.d.cts

@@ -0,0 +1 @@
+#!/usr/bin/env node

package/dist/cli/index.d.ts

@@ -0,0 +1 @@
+#!/usr/bin/env node

package/dist/cli/index.js

@@ -0,0 +1,363 @@
+#!/usr/bin/env node
+import {
+  createGenerator
+} from "../chunk-GJ4A7ZWW.js";
+import {
+  __commonJS,
+  __require
+} from "../chunk-MCKGQKYU.js";
+
+// package.json
+var require_package = __commonJS({
+  "package.json"(exports, module) {
+    module.exports = {
+      name: "@nice2dev/design-tokens",
+      version: "1.0.28",
+      description: "W3C Design Tokens for Nice2Dev UI with CLI generator",
+      type: "module",
+      main: "./dist/index.cjs",
+      module: "./dist/index.js",
+      types: "./dist/index.d.ts",
+      sideEffects: false,
+      exports: {
+        ".": {
+          import: "./dist/index.js",
+          require: "./dist/index.cjs",
+          types: "./dist/index.d.ts"
+        },
+        "./tokens/*": "./tokens/*",
+        "./cli": "./dist/cli/index.js"
+      },
+      bin: {
+        "nice-tokens": "./dist/cli/index.js"
+      },
+      files: [
+        "dist",
+        "tokens"
+      ],
+      scripts: {
+        build: "tsup src/index.ts src/cli/index.ts --format esm,cjs --dts --clean",
+        dev: "tsup src/index.ts src/cli/index.ts --format esm,cjs --dts --watch",
+        generate: "node dist/cli/index.js generate",
+        test: "vitest run --passWithNoTests",
+        typecheck: "tsc --noEmit"
+      },
+      dependencies: {
+        "chroma-js": "^2.4.2",
+        commander: "^12.1.0",
+        "fast-glob": "^3.3.2"
+      },
+      devDependencies: {
+        "@types/chroma-js": "^2.4.4",
+        "@types/node": "^20.14.10",
+        tsup: "^8.3.5",
+        typescript: "^5.7.2",
+        vitest: "^2.1.8"
+      },
+      keywords: [
+        "design-tokens",
+        "w3c",
+        "css-variables",
+        "nice2dev",
+        "design-system"
+      ],
+      author: "Nice2Dev",
+      license: "MIT",
+      repository: {
+        type: "git",
+        url: "https://github.com/nicetogit/nice2dev-ui.git",
+        directory: "packages/design-tokens"
+      }
+    };
+  }
+});
+
+// src/cli/index.ts
+import * as fs from "fs";
+import * as path from "path";
+import { Command } from "commander";
+var pkg = require_package();
+var program = new Command();
+program.name("nice-tokens").description("Generate design tokens in various formats").version(pkg.version);
+program.command("build").description("Build design tokens from JSON source files").option("-i, --input <dir>", "Input directory containing token JSON files", "./tokens").option("-o, --output <dir>", "Output directory for generated files", "./dist").option(
+  "-f, --formats <formats>",
+  "Output formats (comma-separated: css,scss,js,ts,json,tailwind)",
+  "css"
+).option("-p, --prefix <prefix>", "CSS variable prefix", "nice").option("--separate", "Generate separate files by category").option("--no-dark", "Exclude dark mode tokens").option("--no-components", "Exclude component tokens").option("--watch", "Watch for changes and rebuild").action(async (options) => {
+  const formats = options.formats.split(",").map((f) => f.trim());
+  console.log("\u{1F3A8} Nice2Dev Design Tokens Generator\n");
+  console.log(`\u{1F4C1} Input:  ${path.resolve(options.input)}`);
+  console.log(`\u{1F4C1} Output: ${path.resolve(options.output)}`);
+  console.log(`\u{1F4C4} Formats: ${formats.join(", ")}`);
+  console.log("");
+  try {
+    const generator = createGenerator({
+      outputDir: options.output,
+      formats,
+      prefix: options.prefix,
+      separateFiles: options.separate,
+      includeDarkMode: options.dark !== false,
+      includeComponents: options.components !== false
+    });
+    generator.loadDirectory(options.input);
+    await generator.generate();
+    console.log("\n\u2705 Build complete!");
+    if (options.watch) {
+      console.log("\n\u{1F440} Watching for changes...");
+      const chokidar = await import("../esm-YLJOW3XL.js");
+      const watcher = chokidar.watch(path.join(options.input, "**/*.json"), {
+        ignoreInitial: true
+      });
+      watcher.on("change", async (file) => {
+        console.log(`
+\u{1F504} File changed: ${path.basename(file)}`);
+        try {
+          const gen = createGenerator({
+            outputDir: options.output,
+            formats,
+            prefix: options.prefix,
+            separateFiles: options.separate,
+            includeDarkMode: options.dark !== false,
+            includeComponents: options.components !== false
+          });
+          gen.loadDirectory(options.input);
+          await gen.generate();
+          console.log("\u2705 Rebuild complete!");
+        } catch (err) {
+          console.error("\u274C Rebuild failed:", err.message);
+        }
+      });
+    }
+  } catch (err) {
+    console.error("\u274C Build failed:", err.message);
+    process.exit(1);
+  }
+});
+program.command("init").description("Initialize a new design tokens project").option("-d, --dir <dir>", "Directory to initialize", ".").action(async (options) => {
+  const dir = path.resolve(options.dir);
+  const tokensDir = path.join(dir, "tokens");
+  console.log("\u{1F3A8} Initializing Nice2Dev Design Tokens\n");
+  fs.mkdirSync(tokensDir, { recursive: true });
+  fs.mkdirSync(path.join(dir, "dist"), { recursive: true });
+  const colorsJson = {
+    color: {
+      $type: "color",
+      primary: {
+        "50": { $value: "#eff6ff" },
+        "100": { $value: "#dbeafe" },
+        "500": { $value: "#3b82f6" },
+        "600": { $value: "#2563eb" },
+        "700": { $value: "#1d4ed8" },
+        "900": { $value: "#1e3a8a" }
+      },
+      gray: {
+        "50": { $value: "#f9fafb" },
+        "100": { $value: "#f3f4f6" },
+        "500": { $value: "#6b7280" },
+        "700": { $value: "#374151" },
+        "900": { $value: "#111827" }
+      }
+    }
+  };
+  fs.writeFileSync(path.join(tokensDir, "colors.json"), JSON.stringify(colorsJson, null, 2));
+  const typographyJson = {
+    typography: {
+      fontFamily: {
+        $type: "fontFamily",
+        sans: { $value: ["Inter", "system-ui", "sans-serif"] },
+        mono: { $value: ["JetBrains Mono", "monospace"] }
+      },
+      fontSize: {
+        $type: "dimension",
+        xs: { $value: "0.75rem" },
+        sm: { $value: "0.875rem" },
+        base: { $value: "1rem" },
+        lg: { $value: "1.125rem" },
+        xl: { $value: "1.25rem" }
+      }
+    }
+  };
+  fs.writeFileSync(
+    path.join(tokensDir, "typography.json"),
+    JSON.stringify(typographyJson, null, 2)
+  );
+  const spacingJson = {
+    spacing: {
+      $type: "dimension",
+      "0": { $value: "0" },
+      "1": { $value: "0.25rem" },
+      "2": { $value: "0.5rem" },
+      "4": { $value: "1rem" },
+      "6": { $value: "1.5rem" },
+      "8": { $value: "2rem" }
+    }
+  };
+  fs.writeFileSync(path.join(tokensDir, "spacing.json"), JSON.stringify(spacingJson, null, 2));
+  console.log("\u2705 Created token files in ./tokens/");
+  console.log("");
+  console.log("Next steps:");
+  console.log("  1. Edit tokens in ./tokens/*.json");
+  console.log("  2. Run: nice-tokens build");
+  console.log("  3. Import generated CSS/JS from ./dist/");
+});
+program.command("validate").description("Validate design token files").argument("[files...]", "Token files to validate").option("-d, --dir <dir>", "Directory containing token files").action(async (files, options) => {
+  const glob = __require("fast-glob");
+  let tokenFiles = files;
+  if (options.dir) {
+    tokenFiles = await glob(path.join(options.dir, "**/*.json"));
+  }
+  if (tokenFiles.length === 0) {
+    console.log("No token files specified");
+    process.exit(1);
+  }
+  console.log("\u{1F50D} Validating design tokens\n");
+  let hasErrors = false;
+  for (const file of tokenFiles) {
+    try {
+      const content = fs.readFileSync(file, "utf-8");
+      JSON.parse(content);
+      console.log(`\u2705 ${path.basename(file)}`);
+    } catch (err) {
+      console.log(`\u274C ${path.basename(file)}: ${err.message}`);
+      hasErrors = true;
+    }
+  }
+  if (hasErrors) {
+    console.log("\n\u274C Validation failed");
+    process.exit(1);
+  } else {
+    console.log("\n\u2705 All files valid");
+  }
+});
+program.command("convert").description("Convert between token formats").argument("<input>", "Input file or directory").argument("<output>", "Output file").option("-f, --format <format>", "Output format", "css").action(async (input, output, options) => {
+  const format = options.format;
+  console.log(`\u{1F504} Converting to ${format}...
+`);
+  try {
+    const generator = createGenerator({
+      formats: [format],
+      outputDir: path.dirname(output)
+    });
+    const inputStat = fs.statSync(input);
+    if (inputStat.isDirectory()) {
+      generator.loadDirectory(input);
+    } else {
+      generator.load([input]);
+    }
+    await generator.generate();
+    console.log(`\u2705 Converted to ${output}`);
+  } catch (err) {
+    console.error("\u274C Conversion failed:", err.message);
+    process.exit(1);
+  }
+});
+program.command("info").description("Show information about token files").argument("<dir>", "Directory containing token files").action(async (dir) => {
+  const glob = __require("fast-glob");
+  const files = await glob(path.join(dir, "**/*.json"));
+  console.log("\u{1F4CA} Token Information\n");
+  console.log(`Directory: ${path.resolve(dir)}`);
+  console.log(`Files: ${files.length}`);
+  console.log("");
+  const generator = createGenerator();
+  generator.loadDirectory(dir);
+  const collection = generator.getCollection();
+  if (collection) {
+    console.log(`Total tokens: ${collection.tokens.length}`);
+    console.log("");
+    const byType = /* @__PURE__ */ new Map();
+    const byCategory = /* @__PURE__ */ new Map();
+    for (const token of collection.tokens) {
+      const type = token.type || "unknown";
+      byType.set(type, (byType.get(type) || 0) + 1);
+      const category = token.path[0] || "root";
+      byCategory.set(category, (byCategory.get(category) || 0) + 1);
+    }
+    console.log("By type:");
+    for (const [type, count] of byType.entries()) {
+      console.log(`  ${type}: ${count}`);
+    }
+    console.log("\nBy category:");
+    for (const [category, count] of byCategory.entries()) {
+      console.log(`  ${category}: ${count}`);
+    }
+  }
+});
+program.command("diff").description("Compare two token files or directories").argument("<source>", "Source file or directory").argument("<target>", "Target file or directory").action(async (source, target) => {
+  console.log("\u{1F50D} Comparing tokens\n");
+  const generatorA = createGenerator();
+  const generatorB = createGenerator();
+  const statA = fs.statSync(source);
+  const statB = fs.statSync(target);
+  if (statA.isDirectory()) {
+    generatorA.loadDirectory(source);
+  } else {
+    generatorA.load([source]);
+  }
+  if (statB.isDirectory()) {
+    generatorB.loadDirectory(target);
+  } else {
+    generatorB.load([target]);
+  }
+  const collectionA = generatorA.getCollection();
+  const collectionB = generatorB.getCollection();
+  if (!collectionA || !collectionB) {
+    console.error("Failed to load tokens");
+    process.exit(1);
+  }
+  const pathsA = new Set(collectionA.tokens.map((t) => t.path.join(".")));
+  const pathsB = new Set(collectionB.tokens.map((t) => t.path.join(".")));
+  const added = [];
+  const removed = [];
+  const changed = [];
+  for (const path2 of pathsB) {
+    if (!pathsA.has(path2)) {
+      added.push(path2);
+    }
+  }
+  for (const path2 of pathsA) {
+    if (!pathsB.has(path2)) {
+      removed.push(path2);
+    }
+  }
+  for (const tokenA of collectionA.tokens) {
+    const path2 = tokenA.path.join(".");
+    const tokenB = collectionB.byPath.get(path2);
+    if (tokenB && tokenA.resolvedValue !== tokenB.resolvedValue) {
+      changed.push(`${path2}: ${tokenA.resolvedValue} \u2192 ${tokenB.resolvedValue}`);
+    }
+  }
+  if (added.length === 0 && removed.length === 0 && changed.length === 0) {
+    console.log("No differences found");
+    return;
+  }
+  if (added.length > 0) {
+    console.log(`\u2795 Added (${added.length}):`);
+    for (const p of added.slice(0, 10)) {
+      console.log(`  ${p}`);
+    }
+    if (added.length > 10) {
+      console.log(`  ... and ${added.length - 10} more`);
+    }
+    console.log("");
+  }
+  if (removed.length > 0) {
+    console.log(`\u2796 Removed (${removed.length}):`);
+    for (const p of removed.slice(0, 10)) {
+      console.log(`  ${p}`);
+    }
+    if (removed.length > 10) {
+      console.log(`  ... and ${removed.length - 10} more`);
+    }
+    console.log("");
+  }
+  if (changed.length > 0) {
+    console.log(`\u{1F4DD} Changed (${changed.length}):`);
+    for (const p of changed.slice(0, 10)) {
+      console.log(`  ${p}`);
+    }
+    if (changed.length > 10) {
+      console.log(`  ... and ${changed.length - 10} more`);
+    }
+  }
+});
+program.parse();