@styleframe/cli 2.4.0 → 4.0.0

package/dist/index.js

@@ -1,6 +1,6 @@
 #!/usr/bin/env node
 import { defineCommand, runMain } from "citty";
-const version = "2.4.0";
+const version = "4.0.0";
 const description = "A command-line interface for styleframe.";
 const main = defineCommand({
   meta: {
@@ -9,15 +9,14 @@ const main = defineCommand({
     description
   },
   subCommands: {
-    init: () => import("./init-iaRyWohK.js").then((m) => m.default),
-    build: () => import("./build-ur0w63-6.js").then((m) => m.default),
-    figma: () => import("./index-D1u8JN2Q.js").then((m) => m.default)
+    init: () => import("./init-CKeTXHp5.js").then((m) => m.default),
+    build: () => import("./build-CANA04j1.js").then((m) => m.default),
+    dtcg: () => import("./index-BTHfb82h.js").then((m) => m.default)
   }
 });
 function run() {
   runMain(main);
 }
-run();
 export {
   run as default
 };

package/dist/{init-iaRyWohK.js → init-CKeTXHp5.js}

@@ -1,19 +1,61 @@
 import consola from "consola";
 import { defineCommand } from "citty";
 import { writeFile as writeFile$1, readFile } from "fs/promises";
-import sysPath from "path";
+import path from "path";
 import { access } from "node:fs/promises";
 import { constants } from "node:fs";
 import { loadFile, writeFile } from "magicast";
 import { addVitePlugin, addNuxtModule } from "magicast/helpers";
-async function fileExists(path) {
+async function fileExists(path2) {
   try {
-    await access(path, constants.F_OK);
+    await access(path2, constants.F_OK);
     return true;
   } catch {
     return false;
   }
 }
+function parseJsonc(text) {
+  let result = "";
+  let i = 0;
+  let inString = false;
+  while (i < text.length) {
+    const char = text[i];
+    const next = text[i + 1];
+    if (inString) {
+      if (char === "\\" && i + 1 < text.length) {
+        result += char + next;
+        i += 2;
+        continue;
+      }
+      if (char === '"') {
+        inString = false;
+      }
+      result += char;
+      i++;
+    } else {
+      if (char === '"') {
+        inString = true;
+        result += char;
+        i++;
+      } else if (char === "/" && next === "/") {
+        while (i < text.length && text[i] !== "\n") {
+          i++;
+        }
+      } else if (char === "/" && next === "*") {
+        i += 2;
+        while (i < text.length && !(text[i] === "*" && text[i + 1] === "/")) {
+          i++;
+        }
+        i += 2;
+      } else {
+        result += char;
+        i++;
+      }
+    }
+  }
+  result = result.replace(/,(\s*[}\]])/g, "$1");
+  return JSON.parse(result);
+}
 const HOMEPAGE_URL = "https://styleframe.dev";
 const DOCS_URL = `${HOMEPAGE_URL}/docs`;
 const DOCS_MANUAL_INSTALLATION_VITE_URL = `${DOCS_URL}/getting-started/installation/manual/vite`;
@@ -21,7 +63,7 @@ const DOCS_MANUAL_INSTALLATION_NUXT_URL = `${DOCS_URL}/getting-started/installat
 const DOCS_INSTALLATION_CUSTOM_URL = `${DOCS_URL}/getting-started/installation/custom`;
 async function initializeViteFrameworkFile(cwd) {
   consola.success("Vite environment detected.");
-  const configFilePath = sysPath.join(cwd, "vite.config.ts");
+  const configFilePath = path.join(cwd, "vite.config.ts");
   try {
     const mod = await loadFile(configFilePath);
     addVitePlugin(mod, {
@@ -43,7 +85,7 @@ async function initializeViteFrameworkFile(cwd) {
 }
 async function initializeNuxtFrameworkFile(cwd) {
   consola.success("Nuxt environment detected.");
-  const configFilePath = sysPath.join(cwd, "nuxt.config.ts");
+  const configFilePath = path.join(cwd, "nuxt.config.ts");
   try {
     const mod = await loadFile(configFilePath);
     addNuxtModule(mod, "styleframe/plugin/nuxt", "styleframe");
@@ -67,8 +109,25 @@ s.variable("color--primary", "blue");
 
 export default s;
 `;
+const styleframeIncludes = [
+  "styleframe.config.ts",
+  "*.styleframe.ts",
+  ".styleframe/**/*.d.ts"
+];
+const tsconfigTemplate = {
+  compilerOptions: {
+    target: "ES2022",
+    module: "ESNext",
+    moduleResolution: "bundler",
+    strict: true,
+    noEmit: true,
+    skipLibCheck: true,
+    esModuleInterop: true
+  },
+  include: styleframeIncludes
+};
 async function initializeConfigFile(cwd) {
-  const styleframeConfigPath = sysPath.join(cwd, "styleframe.config.ts");
+  const styleframeConfigPath = path.join(cwd, "styleframe.config.ts");
   if (await fileExists(styleframeConfigPath)) {
     consola.warn(
       `Skipped creating "styleframe.config.ts" because it already exists.`
@@ -78,8 +137,36 @@ async function initializeConfigFile(cwd) {
     consola.success(`Created "styleframe.config.ts".`);
   }
 }
+async function initializeTsConfig(cwd) {
+  const tsconfigPath = path.join(cwd, "tsconfig.json");
+  if (await fileExists(tsconfigPath)) {
+    const existingConfig = parseJsonc(
+      await readFile(tsconfigPath, "utf8")
+    );
+    if (!existingConfig.include) {
+      existingConfig.include = [];
+    }
+    const includes = existingConfig.include;
+    const added = [];
+    for (const pattern of styleframeIncludes) {
+      if (!includes.includes(pattern)) {
+        includes.push(pattern);
+        added.push(pattern);
+      }
+    }
+    if (added.length > 0) {
+      await writeFile$1(tsconfigPath, JSON.stringify(existingConfig, null, "	"));
+      consola.success(
+        `Added ${added.map((p) => `"${p}"`).join(", ")} to tsconfig.json includes.`
+      );
+    }
+  } else {
+    await writeFile$1(tsconfigPath, JSON.stringify(tsconfigTemplate, null, "	"));
+    consola.success(`Created "tsconfig.json".`);
+  }
+}
 async function addPackageJsonDependencies(cwd) {
-  const packageJsonPath = sysPath.join(cwd, "package.json");
+  const packageJsonPath = path.join(cwd, "package.json");
   if (await fileExists(packageJsonPath)) {
     const packageJson = JSON.parse(await readFile(packageJsonPath, "utf8"));
     if (!packageJson.devDependencies) packageJson.devDependencies = {};
@@ -103,9 +190,9 @@ async function addPackageJsonDependencies(cwd) {
   }
 }
 async function initializeFrameworkFile(cwd) {
-  if (await fileExists(sysPath.join(cwd, "vite.config.ts"))) {
+  if (await fileExists(path.join(cwd, "vite.config.ts"))) {
     await initializeViteFrameworkFile(cwd);
-  } else if (await fileExists(sysPath.join(cwd, "nuxt.config.ts"))) {
+  } else if (await fileExists(path.join(cwd, "nuxt.config.ts"))) {
     await initializeNuxtFrameworkFile(cwd);
   } else {
     consola.warn(
@@ -133,6 +220,7 @@ const init = defineCommand({
     const { cwd } = args;
     consola.info("Initializing...");
     await initializeConfigFile(cwd);
+    await initializeTsConfig(cwd);
     await addPackageJsonDependencies(cwd);
     await initializeFrameworkFile(cwd);
   }
@@ -141,5 +229,6 @@ export {
   addPackageJsonDependencies,
   init as default,
   initializeConfigFile,
-  initializeFrameworkFile
+  initializeFrameworkFile,
+  initializeTsConfig
 };

package/dist/init-CO7VnQKe.cjs

@@ -0,0 +1,234 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const consola = require("consola");
+const citty = require("citty");
+const promises$1 = require("fs/promises");
+const path = require("path");
+const promises = require("node:fs/promises");
+const node_fs = require("node:fs");
+const magicast = require("magicast");
+const helpers = require("magicast/helpers");
+async function fileExists(path2) {
+  try {
+    await promises.access(path2, node_fs.constants.F_OK);
+    return true;
+  } catch {
+    return false;
+  }
+}
+function parseJsonc(text) {
+  let result = "";
+  let i = 0;
+  let inString = false;
+  while (i < text.length) {
+    const char = text[i];
+    const next = text[i + 1];
+    if (inString) {
+      if (char === "\\" && i + 1 < text.length) {
+        result += char + next;
+        i += 2;
+        continue;
+      }
+      if (char === '"') {
+        inString = false;
+      }
+      result += char;
+      i++;
+    } else {
+      if (char === '"') {
+        inString = true;
+        result += char;
+        i++;
+      } else if (char === "/" && next === "/") {
+        while (i < text.length && text[i] !== "\n") {
+          i++;
+        }
+      } else if (char === "/" && next === "*") {
+        i += 2;
+        while (i < text.length && !(text[i] === "*" && text[i + 1] === "/")) {
+          i++;
+        }
+        i += 2;
+      } else {
+        result += char;
+        i++;
+      }
+    }
+  }
+  result = result.replace(/,(\s*[}\]])/g, "$1");
+  return JSON.parse(result);
+}
+const HOMEPAGE_URL = "https://styleframe.dev";
+const DOCS_URL = `${HOMEPAGE_URL}/docs`;
+const DOCS_MANUAL_INSTALLATION_VITE_URL = `${DOCS_URL}/getting-started/installation/manual/vite`;
+const DOCS_MANUAL_INSTALLATION_NUXT_URL = `${DOCS_URL}/getting-started/installation/manual/nuxt`;
+const DOCS_INSTALLATION_CUSTOM_URL = `${DOCS_URL}/getting-started/installation/custom`;
+async function initializeViteFrameworkFile(cwd) {
+  consola.success("Vite environment detected.");
+  const configFilePath = path.join(cwd, "vite.config.ts");
+  try {
+    const mod = await magicast.loadFile(configFilePath);
+    helpers.addVitePlugin(mod, {
+      from: "styleframe/plugin/vite",
+      constructor: "styleframe",
+      imported: "default"
+    });
+    await magicast.writeFile(mod, configFilePath);
+    consola.success(`Updated Vite config file.`);
+  } catch (error) {
+    consola.error(`Failed to update Vite config file.`);
+    consola.log(error);
+    console.log("");
+    console.log(
+      "Please read the documentation for manually installing styleframe for Vite."
+    );
+    console.log(DOCS_MANUAL_INSTALLATION_VITE_URL);
+  }
+}
+async function initializeNuxtFrameworkFile(cwd) {
+  consola.success("Nuxt environment detected.");
+  const configFilePath = path.join(cwd, "nuxt.config.ts");
+  try {
+    const mod = await magicast.loadFile(configFilePath);
+    helpers.addNuxtModule(mod, "styleframe/plugin/nuxt", "styleframe");
+    await magicast.writeFile(mod, configFilePath);
+    consola.success(`Updated Nuxt config file.`);
+  } catch (error) {
+    consola.error(`Failed to update Nuxt config file.`);
+    consola.log(error);
+    console.log("");
+    console.log(
+      "Please read the documentation for manually installing styleframe for Nuxt."
+    );
+    console.log(DOCS_MANUAL_INSTALLATION_NUXT_URL);
+  }
+}
+const styleframeConfigTemplate = `import { styleframe } from "styleframe";
+
+const s = styleframe();
+
+s.variable("color--primary", "blue");
+
+export default s;
+`;
+const styleframeIncludes = [
+  "styleframe.config.ts",
+  "*.styleframe.ts",
+  ".styleframe/**/*.d.ts"
+];
+const tsconfigTemplate = {
+  compilerOptions: {
+    target: "ES2022",
+    module: "ESNext",
+    moduleResolution: "bundler",
+    strict: true,
+    noEmit: true,
+    skipLibCheck: true,
+    esModuleInterop: true
+  },
+  include: styleframeIncludes
+};
+async function initializeConfigFile(cwd) {
+  const styleframeConfigPath = path.join(cwd, "styleframe.config.ts");
+  if (await fileExists(styleframeConfigPath)) {
+    consola.warn(
+      `Skipped creating "styleframe.config.ts" because it already exists.`
+    );
+  } else {
+    await promises$1.writeFile(styleframeConfigPath, styleframeConfigTemplate);
+    consola.success(`Created "styleframe.config.ts".`);
+  }
+}
+async function initializeTsConfig(cwd) {
+  const tsconfigPath = path.join(cwd, "tsconfig.json");
+  if (await fileExists(tsconfigPath)) {
+    const existingConfig = parseJsonc(
+      await promises$1.readFile(tsconfigPath, "utf8")
+    );
+    if (!existingConfig.include) {
+      existingConfig.include = [];
+    }
+    const includes = existingConfig.include;
+    const added = [];
+    for (const pattern of styleframeIncludes) {
+      if (!includes.includes(pattern)) {
+        includes.push(pattern);
+        added.push(pattern);
+      }
+    }
+    if (added.length > 0) {
+      await promises$1.writeFile(tsconfigPath, JSON.stringify(existingConfig, null, "	"));
+      consola.success(
+        `Added ${added.map((p) => `"${p}"`).join(", ")} to tsconfig.json includes.`
+      );
+    }
+  } else {
+    await promises$1.writeFile(tsconfigPath, JSON.stringify(tsconfigTemplate, null, "	"));
+    consola.success(`Created "tsconfig.json".`);
+  }
+}
+async function addPackageJsonDependencies(cwd) {
+  const packageJsonPath = path.join(cwd, "package.json");
+  if (await fileExists(packageJsonPath)) {
+    const packageJson = JSON.parse(await promises$1.readFile(packageJsonPath, "utf8"));
+    if (!packageJson.devDependencies) packageJson.devDependencies = {};
+    packageJson.devDependencies["styleframe"] = "^2.0.0";
+    packageJson.devDependencies["@styleframe/cli"] = "^2.0.0";
+    packageJson.devDependencies["@styleframe/core"] = "^2.0.0";
+    packageJson.devDependencies["@styleframe/license"] = "^2.0.0";
+    packageJson.devDependencies["@styleframe/loader"] = "^2.0.0";
+    packageJson.devDependencies["@styleframe/plugin"] = "^2.0.0";
+    packageJson.devDependencies["@styleframe/pro"] = "^2.0.0";
+    packageJson.devDependencies["@styleframe/theme"] = "^2.0.0";
+    packageJson.devDependencies["@styleframe/transpiler"] = "^2.0.0";
+    if (!packageJson.dependencies) packageJson.dependencies = {};
+    packageJson.dependencies["@styleframe/runtime"] = "^2.0.0";
+    await promises$1.writeFile(packageJsonPath, JSON.stringify(packageJson, null, 2));
+    consola.success(`Added dependencies to "package.json".`);
+  } else {
+    consola.warn(
+      `Skipped adding styleframe to dependencies because package.json could not be found.`
+    );
+  }
+}
+async function initializeFrameworkFile(cwd) {
+  if (await fileExists(path.join(cwd, "vite.config.ts"))) {
+    await initializeViteFrameworkFile(cwd);
+  } else if (await fileExists(path.join(cwd, "nuxt.config.ts"))) {
+    await initializeNuxtFrameworkFile(cwd);
+  } else {
+    consola.warn(
+      "No framework file detected. Read more about setting up styleframe manually.",
+      DOCS_INSTALLATION_CUSTOM_URL
+    );
+  }
+}
+const init = citty.defineCommand({
+  meta: {
+    name: "init",
+    description: "Initialize a new styleframe project."
+  },
+  args: {
+    cwd: {
+      type: "string",
+      required: false,
+      default: process.cwd(),
+      description: "The directory where the project will be initialized",
+      alias: ["d", "dir"],
+      valueHint: "path"
+    }
+  },
+  async run({ args }) {
+    const { cwd } = args;
+    consola.info("Initializing...");
+    await initializeConfigFile(cwd);
+    await initializeTsConfig(cwd);
+    await addPackageJsonDependencies(cwd);
+    await initializeFrameworkFile(cwd);
+  }
+});
+exports.addPackageJsonDependencies = addPackageJsonDependencies;
+exports.default = init;
+exports.initializeConfigFile = initializeConfigFile;
+exports.initializeFrameworkFile = initializeFrameworkFile;
+exports.initializeTsConfig = initializeTsConfig;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@styleframe/cli",
-  "version": "2.4.0",
+  "version": "4.0.0",
   "description": "A command-line interface for styleframe.",
   "type": "module",
   "types": "./dist/index.d.ts",
@@ -20,21 +20,22 @@
     "README.md"
   ],
   "dependencies": {
-    "@styleframe/figma": "^1.0.0",
+    "@styleframe/dtcg": "^1.1.0",
+    "@styleframe/figma": "^2.0.0",
     "citty": "^0.1.6",
     "consola": "^3.0.0-2",
     "magicast": "^0.5.0"
   },
   "peerDependencies": {
-    "@styleframe/loader": "^2.4.0"
+    "@styleframe/loader": "^3.0.0"
   },
   "devDependencies": {
-    "@styleframe/config-typescript": "^2",
-    "@styleframe/config-vite": "^2",
-    "@styleframe/core": "^2.6.0",
+    "@styleframe/config-typescript": "^3.0.0",
+    "@styleframe/config-vite": "^3.0.0",
+    "@styleframe/core": "^3.4.0",
     "@styleframe/license": "^2.0.2",
-    "@styleframe/theme": "^2.5.0",
-    "@styleframe/loader": "^2.4.0",
+    "@styleframe/theme": "^3.6.0",
+    "@styleframe/loader": "^3.0.0",
     "@vitest/coverage-v8": "^3.2.4",
     "tsx": "^4.20.6",
     "typescript": "^5.8.3",

package/dist/export-DbajI91o.js

@@ -1,139 +0,0 @@
-import path from "node:path";
-import { writeFile } from "node:fs/promises";
-import { l as loadConfiguration } from "./index-BX6dI2z2.js";
-import { defineCommand } from "citty";
-import consola from "consola";
-import { d as detectFigmaType, s as styleframeValueToFigma, a as styleframeToFigmaName, t as toDTCG } from "./index-C3Gqfamh.js";
-const _export = defineCommand({
-  meta: {
-    name: "export",
-    description: "Export Styleframe variables to DTCG format JSON"
-  },
-  args: {
-    config: {
-      type: "string",
-      description: "Path to the Styleframe config file",
-      default: "styleframe.config.ts",
-      alias: ["c"],
-      valueHint: "path"
-    },
-    output: {
-      type: "string",
-      description: "Output JSON file path",
-      default: "tokens.json",
-      alias: ["o"],
-      valueHint: "path"
-    },
-    collection: {
-      type: "string",
-      description: "Name for the Figma collection",
-      default: "Design Tokens",
-      alias: ["n", "name"]
-    },
-    baseFontSize: {
-      type: "string",
-      description: "Base font size for rem conversion (in pixels)",
-      default: "16"
-    }
-  },
-  async run({ args }) {
-    const configPath = path.resolve(args.config);
-    const outputPath = path.resolve(args.output);
-    const baseFontSize = Number.parseInt(args.baseFontSize, 10) || 16;
-    consola.info(
-      `Loading configuration from "${path.relative(process.cwd(), configPath)}"...`
-    );
-    const instance = await loadConfiguration({ entry: configPath });
-    const root = instance.root;
-    consola.info("Extracting variables...");
-    const modes = ["Default", ...root.themes.map((t) => capitalize(t.name))];
-    const variableMap = /* @__PURE__ */ new Map();
-    for (const variable of root.variables) {
-      if (!variableMap.has(variable.name)) {
-        variableMap.set(variable.name, /* @__PURE__ */ new Map());
-      }
-      const modeValues = variableMap.get(variable.name);
-      modeValues.set("Default", resolveValue(variable.value));
-    }
-    for (const theme of root.themes) {
-      const modeName = capitalize(theme.name);
-      for (const variable of theme.variables) {
-        if (!variableMap.has(variable.name)) {
-          variableMap.set(variable.name, /* @__PURE__ */ new Map());
-        }
-        const modeValues = variableMap.get(variable.name);
-        modeValues.set(modeName, resolveValue(variable.value));
-      }
-    }
-    const variables = [];
-    for (const [name, modeValues] of variableMap) {
-      const defaultValue = modeValues.get("Default");
-      if (defaultValue === void 0) continue;
-      const type = detectFigmaType(defaultValue);
-      const figmaValues = {};
-      for (const [modeName, value] of modeValues) {
-        const figmaValue = styleframeValueToFigma(value, type, baseFontSize);
-        if (figmaValue !== null) {
-          figmaValues[modeName] = figmaValue;
-        }
-      }
-      const rawDefaultValue = getRawValue(
-        root.variables.find((v) => v.name === name)?.value
-      );
-      const isReference = isReferenceValue(rawDefaultValue);
-      const aliasTo = isReference ? getReferenceName(rawDefaultValue) : void 0;
-      variables.push({
-        name: styleframeToFigmaName(name),
-        styleframeName: name,
-        type,
-        values: figmaValues,
-        aliasTo
-      });
-    }
-    const intermediateData = {
-      collection: args.collection,
-      modes,
-      variables
-    };
-    const themeNames = root.themes.map((t) => capitalize(t.name));
-    const dtcgData = toDTCG(intermediateData, { themeNames });
-    consola.info(
-      `Writing ${variables.length} variables to "${path.relative(process.cwd(), outputPath)}"...`
-    );
-    await writeFile(outputPath, JSON.stringify(dtcgData, null, 2));
-    consola.success(
-      `Exported ${variables.length} variables in DTCG format to "${path.relative(process.cwd(), outputPath)}"`
-    );
-  }
-});
-function capitalize(str) {
-  return str.charAt(0).toUpperCase() + str.slice(1);
-}
-function resolveValue(value) {
-  if (value === null || value === void 0) return value;
-  if (typeof value !== "object") return value;
-  if ("type" in value) {
-    if (value.type === "reference") {
-      return value.fallback ?? "";
-    }
-    if (value.type === "css") {
-      return value.value.map((v) => resolveValue(v)).join("");
-    }
-  }
-  if (Array.isArray(value)) {
-    return value.map((v) => resolveValue(v)).join("");
-  }
-  return String(value);
-}
-function getRawValue(value) {
-  return value ?? "";
-}
-function isReferenceValue(value) {
-  return typeof value === "object" && value !== null && "type" in value && value.type === "reference";
-}
-function getReferenceName(value) {
-  return value.name;
-}
-export {
-  _export as default
-};