@flowgram.ai/cli 0.4.10 → 0.4.12

package/dist/index.js

@@ -6,34 +6,108 @@ var getDirname = () => path.dirname(getFilename());
 var __dirname = /* @__PURE__ */ getDirname();
 
 // src/index.ts
+import path11 from "path";
 import { Command } from "commander";
 
-// src/materials/index.ts
-import inquirer from "inquirer";
-import chalk3 from "chalk";
+// src/update-version/index.ts
+import chalk from "chalk";
 
-// src/materials/materials.ts
-import path4 from "path";
-import fs3 from "fs";
+// src/utils/npm.ts
+import path2 from "path";
+import https from "https";
+import { existsSync, readFileSync } from "fs";
+import { execSync } from "child_process";
+import * as tar from "tar";
+import fs from "fs-extra";
+var LoadedNpmPkg = class {
+  constructor(name, version, path12) {
+    this.name = name;
+    this.version = version;
+    this.path = path12;
+  }
+  get srcPath() {
+    return path2.join(this.path, "src");
+  }
+  get distPath() {
+    return path2.join(this.path, "dist");
+  }
+  get packageJson() {
+    if (!this._packageJson) {
+      this._packageJson = JSON.parse(readFileSync(path2.join(this.path, "package.json"), "utf8"));
+    }
+    return this._packageJson;
+  }
+  get dependencies() {
+    return this.packageJson.dependencies;
+  }
+};
+function downloadFile(url, dest) {
+  return new Promise((resolve, reject) => {
+    const file = fs.createWriteStream(dest);
+    https.get(url, (response) => {
+      if (response.statusCode !== 200) {
+        reject(new Error(`Download failed: ${response.statusCode}`));
+        return;
+      }
+      response.pipe(file);
+      file.on("finish", () => {
+        file.close();
+        resolve();
+      });
+    }).on("error", (err) => {
+      fs.unlink(dest, () => reject(err));
+    });
+    file.on("error", (err) => {
+      fs.unlink(dest, () => reject(err));
+    });
+  });
+}
+async function getLatestVersion(packageName) {
+  return execSync(`npm view ${packageName} version --tag=latest`).toString().trim();
+}
+async function loadNpm(packageName) {
+  const packageLatestVersion = await getLatestVersion(packageName);
+  const packagePath = path2.join(__dirname, `./.download/${packageName}-${packageLatestVersion}`);
+  if (existsSync(packagePath)) {
+    return new LoadedNpmPkg(packageName, packageLatestVersion, packagePath);
+  }
+  try {
+    const tarballUrl = execSync(`npm view ${packageName}@${packageLatestVersion} dist.tarball`).toString().trim();
+    const tempTarballPath = path2.join(
+      __dirname,
+      `./.download/${packageName}-${packageLatestVersion}.tgz`
+    );
+    fs.ensureDirSync(path2.dirname(tempTarballPath));
+    await downloadFile(tarballUrl, tempTarballPath);
+    fs.ensureDirSync(packagePath);
+    await tar.x({
+      file: tempTarballPath,
+      cwd: packagePath,
+      strip: 1
+    });
+    fs.unlinkSync(tempTarballPath);
+    return new LoadedNpmPkg(packageName, packageLatestVersion, packagePath);
+  } catch (error) {
+    console.error(`Error downloading or extracting package: ${error}`);
+    throw error;
+  }
+}
 
-// src/utils/ts-file.ts
+// src/utils/file.ts
 import path3 from "path";
 import fs2 from "fs";
-
-// src/utils/file.ts
-import path2 from "path";
-import fs from "fs";
+import ignore from "ignore";
 var File = class {
   constructor(filePath, root = "/") {
     this.root = root;
     this.path = filePath;
-    this.relativePath = path2.relative(this.root, this.path);
-    this.suffix = path2.extname(this.path);
-    if (!fs.existsSync(this.path)) {
-      throw Error(`File ${path2} Not Exists`);
+    this.relativePath = path3.relative(this.root, this.path);
+    this.suffix = path3.extname(this.path);
+    if (!fs2.existsSync(this.path)) {
+      throw Error(`File ${path3} Not Exists`);
     }
     try {
-      this.content = fs.readFileSync(this.path, "utf-8");
+      this.content = fs2.readFileSync(this.path, "utf-8");
       this.isUtf8 = true;
     } catch (e) {
       this.isUtf8 = false;
@@ -46,19 +120,220 @@ var File = class {
       return;
     }
     this.content = updater(this.content);
-    fs.writeFileSync(this.path, this.content, "utf-8");
+    fs2.writeFileSync(this.path, this.content, "utf-8");
+  }
+  write(nextContent) {
+    this.content = nextContent;
+    fs2.writeFileSync(this.path, this.content, "utf-8");
   }
 };
+function* traverseRecursiveFilePaths(folder, ig = ignore().add(".git"), root = folder) {
+  const files = fs2.readdirSync(folder);
+  if (fs2.existsSync(path3.join(folder, ".gitignore"))) {
+    ig.add(fs2.readFileSync(path3.join(folder, ".gitignore"), "utf-8"));
+  }
+  for (const file of files) {
+    const filePath = path3.join(folder, file);
+    if (ig.ignores(path3.relative(root, filePath))) {
+      continue;
+    }
+    if (fs2.statSync(filePath).isDirectory()) {
+      yield* traverseRecursiveFilePaths(filePath, ig, root);
+    } else {
+      yield filePath;
+    }
+  }
+}
+function* traverseRecursiveFiles(folder) {
+  for (const filePath of traverseRecursiveFilePaths(folder)) {
+    yield new File(filePath, folder);
+  }
+}
+
+// src/update-version/index.ts
+async function updateFlowgramVersion(inputVersion) {
+  console.log(chalk.bold("\u{1F680} Welcome to @flowgram.ai update-version helper"));
+  const latestVersion = await getLatestVersion("@flowgram.ai/editor");
+  const currentPath = process.cwd();
+  console.log("- Latest flowgram version: ", latestVersion);
+  console.log("- Current Path: ", currentPath);
+  const flowgramVersion = inputVersion || latestVersion;
+  for (const file of traverseRecursiveFiles(currentPath)) {
+    if (file.path.endsWith("package.json")) {
+      console.log("\u{1F440} Find package.json: ", file.path);
+      let updated = false;
+      const json = JSON.parse(file.content);
+      if (json.dependencies) {
+        for (const key in json.dependencies) {
+          if (key.startsWith("@flowgram.ai/")) {
+            updated = true;
+            json.dependencies[key] = flowgramVersion;
+            console.log(`- Update ${key} to ${flowgramVersion}`);
+          }
+        }
+      }
+      if (json.devDependencies) {
+        for (const key in json.devDependencies) {
+          if (key.startsWith("@flowgram.ai/")) {
+            updated = true;
+            json.devDependencies[key] = flowgramVersion;
+            console.log(`- Update ${key} to ${flowgramVersion}`);
+          }
+        }
+      }
+      if (updated) {
+        file.write(JSON.stringify(json, null, 2));
+        console.log(`\u2705 ${file.path} Updated`);
+      }
+    }
+  }
+}
+
+// src/materials/index.ts
+import path9 from "path";
+import chalk5 from "chalk";
+
+// src/utils/project.ts
+import path4 from "path";
+import { existsSync as existsSync2, readFileSync as readFileSync2, writeFileSync } from "fs";
+import chalk2 from "chalk";
+var Project = class _Project {
+  constructor() {
+  }
+  async init() {
+    let projectPath = process.cwd();
+    while (projectPath !== "/" && !existsSync2(path4.join(projectPath, "package.json"))) {
+      projectPath = path4.join(projectPath, "..");
+    }
+    if (projectPath === "/") {
+      throw new Error("Please run this command in a valid project");
+    }
+    this.projectPath = projectPath;
+    this.srcPath = path4.join(projectPath, "src");
+    this.packageJsonPath = path4.join(projectPath, "package.json");
+    this.packageJson = JSON.parse(readFileSync2(this.packageJsonPath, "utf8"));
+    this.flowgramVersion = this.packageJson.dependencies["@flowgram.ai/fixed-layout-editor"] || this.packageJson.dependencies["@flowgram.ai/free-layout-editor"] || this.packageJson.dependencies["@flowgram.ai/editor"];
+  }
+  async addDependency(dependency) {
+    let name;
+    let version;
+    const lastAtIndex = dependency.lastIndexOf("@");
+    if (lastAtIndex <= 0) {
+      name = dependency;
+      version = await getLatestVersion(name);
+    } else {
+      name = dependency.substring(0, lastAtIndex);
+      version = dependency.substring(lastAtIndex + 1);
+      if (!version.trim()) {
+        version = await getLatestVersion(name);
+      }
+    }
+    this.packageJson.dependencies[name] = version;
+    writeFileSync(this.packageJsonPath, JSON.stringify(this.packageJson, null, 2));
+  }
+  async addDependencies(dependencies) {
+    for (const dependency of dependencies) {
+      await this.addDependency(dependency);
+    }
+  }
+  writeToPackageJsonFile() {
+    writeFileSync(this.packageJsonPath, JSON.stringify(this.packageJson, null, 2));
+  }
+  printInfo() {
+    console.log(chalk2.bold("Project Info:"));
+    console.log(chalk2.black(`  - Flowgram Version: ${this.flowgramVersion}`));
+    console.log(chalk2.black(`  - Project Path: ${this.projectPath}`));
+  }
+  static async getSingleton() {
+    const info = new _Project();
+    await info.init();
+    return info;
+  }
+};
+
+// src/materials/select.ts
+import inquirer from "inquirer";
+import chalk3 from "chalk";
+
+// src/materials/material.ts
+import path6 from "path";
+import { readdirSync } from "fs";
+
+// src/utils/ts-file.ts
+import path5 from "path";
+import fs3 from "fs";
+
+// src/utils/import.ts
+function assembleImport(declaration) {
+  const { namedImports, defaultImport, namespaceImport, source } = declaration;
+  const importClauses = [];
+  if (namedImports) {
+    importClauses.push(
+      `{ ${namedImports.map(
+        ({ local, imported, typeOnly }) => `${typeOnly ? "type " : ""}${imported}${local ? ` as ${local}` : ""}`
+      ).join(", ")} }`
+    );
+  }
+  if (defaultImport) {
+    importClauses.push(defaultImport);
+  }
+  if (namespaceImport) {
+    importClauses.push(`* as ${namespaceImport}`);
+  }
+  return `import ${importClauses.join(", ")} from '${source}';`;
+}
+function* traverseFileImports(fileContent) {
+  const importRegex = /import\s+([^{}*,]*?)?(?:\s*\*\s*as\s+([a-zA-Z_$][a-zA-Z0-9_$]*)\s*,?)?(?:\s*\{([^}]*)\}\s*,?)?(?:\s*([a-zA-Z_$][a-zA-Z0-9_$]*)\s*,?)?\s*from\s*['"`]([^'"`]+)['"`]\;?/g;
+  let match;
+  while ((match = importRegex.exec(fileContent)) !== null) {
+    const [fullMatch, defaultPart, namespacePart, namedPart, defaultPart2, source] = match;
+    const declaration = {
+      statement: fullMatch,
+      source
+    };
+    const defaultImport = defaultPart?.trim() || defaultPart2?.trim();
+    if (defaultImport && !namespacePart && !namedPart) {
+      declaration.defaultImport = defaultImport;
+    } else if (defaultImport && (namespacePart || namedPart)) {
+      declaration.defaultImport = defaultImport;
+    }
+    if (namespacePart) {
+      declaration.namespaceImport = namespacePart.trim();
+    }
+    if (namedPart) {
+      const namedImports = [];
+      const namedItems = namedPart.split(",").map((item) => item.trim()).filter(Boolean);
+      for (const item of namedItems) {
+        const typeOnly = item.startsWith("type ");
+        const cleanItem = typeOnly ? item.slice(5).trim() : item;
+        if (cleanItem.includes(" as ")) {
+          const [imported, local] = cleanItem.split(" as ").map((s) => s.trim());
+          namedImports.push({
+            imported,
+            local,
+            typeOnly
+          });
+        } else {
+          namedImports.push({
+            imported: cleanItem,
+            typeOnly
+          });
+        }
+      }
+      if (namedImports.length > 0) {
+        declaration.namedImports = namedImports;
+      }
+    }
+    yield declaration;
+  }
+}
 
 // src/utils/export.ts
 function extractNamedExports(content) {
   const valueExports = [];
   const typeExports = [];
   const typeDefinitions = /* @__PURE__ */ new Set();
-  const typePatterns = [
-    /\b(?:type|interface)\s+(\w+)/g,
-    /\bexport\s+(?:type|interface)\s+(\w+)/g
-  ];
+  const typePatterns = [/\b(?:type|interface)\s+(\w+)/g, /\bexport\s+(?:type|interface)\s+(\w+)/g];
   let match;
   for (const pattern of typePatterns) {
     while ((match = pattern.exec(content)) !== null) {
@@ -137,84 +412,17 @@ function extractNamedExports(content) {
   };
 }
 
-// src/utils/import.ts
-function assembleImport(declaration) {
-  const { namedImports, defaultImport, namespaceImport, source } = declaration;
-  const importClauses = [];
-  if (namedImports) {
-    importClauses.push(
-      `{ ${namedImports.map(
-        ({ local, imported, typeOnly }) => `${typeOnly ? "type " : ""}${imported}${local ? ` as ${local}` : ""}`
-      ).join(", ")} }`
-    );
-  }
-  if (defaultImport) {
-    importClauses.push(defaultImport);
-  }
-  if (namespaceImport) {
-    importClauses.push(`* as ${namespaceImport}`);
-  }
-  return `import ${importClauses.join(", ")} from '${source}';`;
-}
-function* traverseFileImports(fileContent) {
-  const importRegex = /import\s+([^{}*,]*?)?(?:\s*\*\s*as\s+([a-zA-Z_$][a-zA-Z0-9_$]*)\s*,?)?(?:\s*\{([^}]*)\}\s*,?)?(?:\s*([a-zA-Z_$][a-zA-Z0-9_$]*)\s*,?)?\s*from\s*['"`]([^'"`]+)['"`]\;?/g;
-  let match;
-  while ((match = importRegex.exec(fileContent)) !== null) {
-    const [fullMatch, defaultPart, namespacePart, namedPart, defaultPart2, source] = match;
-    const declaration = {
-      statement: fullMatch,
-      source
-    };
-    const defaultImport = defaultPart?.trim() || defaultPart2?.trim();
-    if (defaultImport && !namespacePart && !namedPart) {
-      declaration.defaultImport = defaultImport;
-    } else if (defaultImport && (namespacePart || namedPart)) {
-      declaration.defaultImport = defaultImport;
-    }
-    if (namespacePart) {
-      declaration.namespaceImport = namespacePart.trim();
-    }
-    if (namedPart) {
-      const namedImports = [];
-      const namedItems = namedPart.split(",").map((item) => item.trim()).filter(Boolean);
-      for (const item of namedItems) {
-        const typeOnly = item.startsWith("type ");
-        const cleanItem = typeOnly ? item.slice(5).trim() : item;
-        if (cleanItem.includes(" as ")) {
-          const [imported, local] = cleanItem.split(" as ").map((s) => s.trim());
-          namedImports.push({
-            imported,
-            local,
-            typeOnly
-          });
-        } else {
-          namedImports.push({
-            imported: cleanItem,
-            typeOnly
-          });
-        }
-      }
-      if (namedImports.length > 0) {
-        declaration.namedImports = namedImports;
-      }
-    }
-    yield declaration;
-  }
-}
-
 // src/utils/ts-file.ts
 var TsFile = class extends File {
-  constructor(filePath) {
-    super(filePath);
+  constructor(filePath, root) {
+    super(filePath, root);
     this.exports = {
       values: [],
       types: []
     };
     this.imports = [];
-    this.exports = extractNamedExports(fs2.readFileSync(filePath, "utf-8"));
-    this.imports = Array.from(
-      traverseFileImports(fs2.readFileSync(filePath, "utf-8"))
-    );
+    this.exports = extractNamedExports(fs3.readFileSync(filePath, "utf-8"));
+    this.imports = Array.from(traverseFileImports(fs3.readFileSync(filePath, "utf-8")));
   }
   get allExportNames() {
     return [...this.exports.values, ...this.exports.types];
@@ -228,9 +436,7 @@ var TsFile = class extends File {
       return content.replace(
         lastImportStatement.statement,
         `${lastImportStatement?.statement}
-${importDeclarations.map(
-          (item) => item.statement
-        )}
+${importDeclarations.map((item) => item.statement)}
 `
       );
     });
@@ -238,14 +444,9 @@ ${importDeclarations.map(
   }
   removeImport(importDeclarations) {
     this.replace(
-      (content) => importDeclarations.reduce(
-        (prev, cur) => prev.replace(cur.statement, ""),
-        content
-      )
-    );
-    this.imports = this.imports.filter(
-      (item) => !importDeclarations.includes(item)
+      (content) => importDeclarations.reduce((prev, cur) => prev.replace(cur.statement, ""), content)
     );
+    this.imports = this.imports.filter((item) => !importDeclarations.includes(item));
   }
   replaceImport(oldImports, newImports) {
     newImports.forEach((importDeclaration) => {
@@ -274,9 +475,7 @@ ${importDeclarations.map(
         content = content.replace(
           lastImportStatement,
           `${lastImportStatement}
-${restNewImports.map(
-            (item) => item.statement
-          )}
+${restNewImports.map((item) => item.statement).join("\n")}
 `
         );
       }
@@ -286,238 +485,160 @@ ${restNewImports.map(
   }
 };
 function* traverseRecursiveTsFiles(folder) {
-  const files = fs2.readdirSync(folder);
-  for (const file of files) {
-    const filePath = path3.join(folder, file);
-    if (fs2.statSync(filePath).isDirectory()) {
-      yield* traverseRecursiveTsFiles(filePath);
-    } else {
-      if (file.endsWith(".ts") || file.endsWith(".tsx")) {
-        yield new TsFile(filePath);
-      }
+  for (const filePath of traverseRecursiveFilePaths(folder)) {
+    if (filePath.endsWith(".ts") || filePath.endsWith(".tsx")) {
+      yield new TsFile(filePath, folder);
     }
   }
 }
 function getIndexTsFile(folder) {
-  const files = fs2.readdirSync(folder);
+  const files = fs3.readdirSync(folder);
   for (const file of files) {
     if (file === "index.ts" || file === "index.tsx") {
-      return new TsFile(path3.join(folder, file));
+      return new TsFile(path5.join(folder, file), folder);
     }
   }
   return void 0;
 }
 
-// src/materials/materials.ts
-var _types = [
+// src/materials/material.ts
+var _Material = class _Material {
+  constructor(type, name, formMaterialPkg) {
+    this.type = type;
+    this.name = name;
+    this.formMaterialPkg = formMaterialPkg;
+  }
+  get fullName() {
+    return `${this.type}/${this.name}`;
+  }
+  get sourceDir() {
+    return path6.join(this.formMaterialPkg.srcPath, this.type, this.name);
+  }
+  get indexFile() {
+    return getIndexTsFile(this.sourceDir);
+  }
+  get allExportNames() {
+    return this.indexFile?.allExportNames || [];
+  }
+  static listAll(formMaterialPkg) {
+    if (!this._all_materials_cache.length) {
+      this._all_materials_cache = _Material.ALL_TYPES.map((type) => {
+        const materialsPath = path6.join(formMaterialPkg.srcPath, type);
+        return readdirSync(materialsPath).map((_path) => {
+          if (_path === "index.ts") {
+            return null;
+          }
+          return new _Material(type, _path, formMaterialPkg);
+        }).filter((material) => material !== null);
+      }).flat();
+    }
+    return this._all_materials_cache;
+  }
+};
+_Material._all_materials_cache = [];
+_Material.ALL_TYPES = [
   "components",
   "effects",
   "plugins",
   "shared",
-  "typings",
   "validate",
   "form-plugins",
   "hooks"
 ];
-function listAllMaterials(formMaterialSrc) {
-  const _materials = [];
-  for (const _type of _types) {
-    const materialsPath = path4.join(formMaterialSrc, _type);
-    _materials.push(
-      ...fs3.readdirSync(materialsPath).map((_path) => {
-        if (_path === "index.ts") {
-          return null;
-        }
-        return {
-          name: _path,
-          // Assuming the folder name is the material name
-          type: _type,
-          path: path4.join(materialsPath, _path)
-        };
-      }).filter((material) => material !== null)
-    );
-  }
-  return _materials;
-}
-var getFormMaterialDependencies = (formMaterialPath) => {
-  const packageJsonPath = path4.join(formMaterialPath, "package.json");
-  const packageJson = JSON.parse(fs3.readFileSync(packageJsonPath, "utf8"));
-  return packageJson.dependencies;
-};
-var copyMaterial = (material, project, formMaterialPath) => {
-  const formMaterialDependencies = getFormMaterialDependencies(formMaterialPath);
-  const sourceDir = material.path;
-  const materialRoot = path4.join(
-    project.projectPath,
-    "src",
-    "form-materials",
-    `${material.type}`
-  );
-  const targetDir = path4.join(materialRoot, material.name);
-  const packagesToInstall = /* @__PURE__ */ new Set();
-  fs3.cpSync(sourceDir, targetDir, { recursive: true });
-  for (const file of traverseRecursiveTsFiles(targetDir)) {
-    for (const importDeclaration of file.imports) {
-      const { source } = importDeclaration;
-      if (source.startsWith("@/")) {
-        console.log(
-          `Replace Import from ${source} to @flowgram.ai/form-materials`
-        );
-        file.replaceImport(
-          [importDeclaration],
-          [{ ...importDeclaration, source: "@flowgram.ai/form-materials" }]
-        );
-        packagesToInstall.add(
-          `@flowgram.ai/form-materials@${project.flowgramVersion}`
-        );
-      } else if (!source.startsWith(".") && !source.startsWith("react")) {
-        const [dep, version] = Object.entries(formMaterialDependencies).find(
-          ([_key]) => source.startsWith(_key)
-        ) || [];
-        if (!dep) {
-          continue;
+var Material = _Material;
+
+// src/materials/select.ts
+var getSelectedMaterials = async (cliOpts, formMaterialPkg) => {
+  const { materialName, selectMultiple } = cliOpts;
+  const materials = Material.listAll(formMaterialPkg);
+  let selectedMaterials = [];
+  if (materialName) {
+    selectedMaterials = materialName.split(",").map((_name) => materials.find((_m) => _m.fullName === _name.trim())).filter(Boolean);
+  }
+  if (!selectedMaterials.length) {
+    console.log(chalk3.yellow(`Material "${materialName}" not found. Please select from the list:`));
+    const choices = materials.map((_material) => ({
+      name: _material.fullName,
+      value: _material
+    }));
+    if (selectMultiple) {
+      const result = await inquirer.prompt([
+        {
+          type: "checkbox",
+          name: "material",
+          message: "Select multiple materials to add:",
+          choices
         }
-        if (dep.startsWith("@flowgram.ai/")) {
-          packagesToInstall.add(`${dep}@${project.flowgramVersion}`);
-        } else {
-          packagesToInstall.add(`${dep}@${version}`);
+      ]);
+      selectedMaterials = result.material;
+    } else {
+      const result = await inquirer.prompt([
+        {
+          type: "list",
+          name: "material",
+          message: "Select one material to add:",
+          choices
         }
-      }
+      ]);
+      selectedMaterials = [result.material];
     }
   }
-  return {
-    packagesToInstall: [...packagesToInstall]
-  };
+  return selectedMaterials;
 };
 
-// src/utils/npm.ts
-import { execSync } from "child_process";
-import { existsSync } from "fs";
-import path5 from "path";
-import download from "download";
-async function getLatestVersion(packageName) {
-  return execSync(`npm view ${packageName} version --tag=latest`).toString().trim();
-}
-async function loadNpm(packageName) {
-  const packageLatestVersion = await getLatestVersion(packageName);
-  const packagePath = path5.join(
-    __dirname,
-    `./.download/${packageName}-${packageLatestVersion}`
-  );
-  if (existsSync(packagePath)) {
-    return packagePath;
-  }
-  try {
-    const tarballUrl = execSync(
-      `npm view ${packageName}@${packageLatestVersion} dist.tarball`
-    ).toString().trim();
-    await download(tarballUrl, packagePath, { extract: true, strip: 1 });
-    return packagePath;
-  } catch (error) {
-    console.error(`Error downloading or extracting package: ${error}`);
-    throw error;
-  }
-}
-
-// src/materials/index.ts
+// src/materials/refresh-project-import.ts
 import path7 from "path";
-
-// src/utils/project.ts
-import { existsSync as existsSync2, readFileSync, writeFileSync } from "fs";
-import path6 from "path";
-import chalk from "chalk";
-var Project = class _Project {
-  constructor() {
-  }
-  async init() {
-    let projectPath = process.cwd();
-    while (projectPath !== "/" && !existsSync2(path6.join(projectPath, "package.json"))) {
-      projectPath = path6.join(projectPath, "..");
-    }
-    if (projectPath === "/") {
-      throw new Error("Please run this command in a valid project");
-    }
-    this.projectPath = projectPath;
-    this.srcPath = path6.join(projectPath, "src");
-    this.packageJsonPath = path6.join(projectPath, "package.json");
-    this.packageJson = JSON.parse(readFileSync(this.packageJsonPath, "utf8"));
-    this.flowgramVersion = this.packageJson.dependencies["@flowgram.ai/fixed-layout-editor"] || this.packageJson.dependencies["@flowgram.ai/free-layout-editor"] || this.packageJson.dependencies["@flowgram.ai/editor"];
-  }
-  async addDependency(dependency) {
-    let name;
-    let version;
-    const lastAtIndex = dependency.lastIndexOf("@");
-    if (lastAtIndex <= 0) {
-      name = dependency;
-      version = await getLatestVersion(name);
-    } else {
-      name = dependency.substring(0, lastAtIndex);
-      version = dependency.substring(lastAtIndex + 1);
-      if (!version.trim()) {
-        version = await getLatestVersion(name);
-      }
-    }
-    this.packageJson.dependencies[name] = version;
-    writeFileSync(
-      this.packageJsonPath,
-      JSON.stringify(this.packageJson, null, 2)
-    );
-  }
-  async addDependencies(dependencies) {
-    for (const dependency of dependencies) {
-      await this.addDependency(dependency);
+import chalk4 from "chalk";
+function executeRefreshProjectImport(context) {
+  const { selectedMaterials, project, targetFormMaterialRoot } = context;
+  const exportName2Material = /* @__PURE__ */ new Map();
+  const targetModule = `@/${path7.relative(project.srcPath, targetFormMaterialRoot)}`;
+  for (const material of selectedMaterials) {
+    if (!material.indexFile) {
+      console.warn(`Material ${material.name} not found`);
+      return;
     }
+    console.log(`\u{1F440} The exports of ${material.name} is ${material.allExportNames.join(",")}`);
+    material.allExportNames.forEach((exportName) => {
+      exportName2Material.set(exportName, material);
+    });
   }
-  printInfo() {
-    console.log(chalk.bold("Project Info:"));
-    console.log(chalk.black(`  - Flowgram Version: ${this.flowgramVersion}`));
-    console.log(chalk.black(`  - Project Path: ${this.projectPath}`));
-  }
-  static async getSingleton() {
-    const info = new _Project();
-    await info.init();
-    return info;
-  }
-};
-
-// src/materials/refresh-project-import.ts
-import chalk2 from "chalk";
-function executeRefreshProjectImport(project, material) {
-  const materialFile = getIndexTsFile(material.path);
-  if (!materialFile) {
-    console.warn(`Material ${material.name} not found`);
-    return;
-  }
-  const targetDir = `@/form-materials/${material.type}/${material.name}`;
-  const exportNames = materialFile.allExportNames;
-  console.log(`\u{1F440} The exports of ${material.name} is ${exportNames.join(",")}`);
   for (const tsFile of traverseRecursiveTsFiles(project.srcPath)) {
     for (const importDeclaration of tsFile.imports) {
-      if (importDeclaration.source === "@flowgram.ai/form-materials") {
-        const currentMaterialImports = importDeclaration.namedImports?.filter(
-          (item) => exportNames.includes(item.imported)
-        );
-        if (!currentMaterialImports?.length) {
+      if (importDeclaration.source.startsWith("@flowgram.ai/form-materials")) {
+        const restImports = [];
+        const importMap = {};
+        if (!importDeclaration.namedImports) {
           continue;
         }
-        const nextImports = [
-          {
-            ...importDeclaration,
-            namedImports: currentMaterialImports,
-            source: targetDir
+        for (const nameImport of importDeclaration.namedImports) {
+          const material = exportName2Material.get(nameImport.imported);
+          if (material) {
+            const importModule = `${targetModule}/${material.fullName}`;
+            importMap[importModule] = importMap[importModule] || [];
+            importMap[importModule].push(nameImport);
+          } else {
+            restImports.push(nameImport);
           }
-        ];
-        const keepImportNames = importDeclaration.namedImports?.filter(
-          (item) => !exportNames.includes(item.imported)
+        }
+        if (Object.keys(importMap).length === 0) {
+          continue;
+        }
+        const nextImports = Object.entries(importMap).map(
+          ([importModule, namedImports]) => ({
+            ...importDeclaration,
+            namedImports,
+            source: importModule
+          })
         );
-        if (keepImportNames?.length) {
+        if (restImports?.length) {
           nextImports.unshift({
             ...importDeclaration,
-            namedImports: keepImportNames
+            namedImports: restImports
           });
         }
         tsFile.replaceImport([importDeclaration], nextImports);
-        console.log(chalk2.green(`\u{1F504} Refresh Imports In: ${tsFile.path}`));
+        console.log(chalk4.green(`\u{1F504} Refresh Imports In: ${tsFile.path}`));
         console.log(
           `From:
 ${importDeclaration.statement}
@@ -529,86 +650,147 @@ ${nextImports.map((item) => item.statement).join("\n")}`
   }
 }
 
+// src/materials/copy.ts
+import path8 from "path";
+import fs4 from "fs";
+var copyMaterials = (ctx) => {
+  const { selectedMaterials, project, formMaterialPkg, targetFormMaterialRoot } = ctx;
+  const formMaterialDependencies = formMaterialPkg.dependencies;
+  const packagesToInstall = /* @__PURE__ */ new Set();
+  for (const material of selectedMaterials) {
+    const sourceDir = material.sourceDir;
+    const targetDir = path8.join(targetFormMaterialRoot, material.type, material.name);
+    fs4.cpSync(sourceDir, targetDir, { recursive: true });
+    for (const file of traverseRecursiveTsFiles(targetDir)) {
+      for (const importDeclaration of file.imports) {
+        const { source } = importDeclaration;
+        if (source.startsWith("@/")) {
+          console.log(`Replace Import from ${source} to @flowgram.ai/form-materials`);
+          file.replaceImport(
+            [importDeclaration],
+            [{ ...importDeclaration, source: "@flowgram.ai/form-materials" }]
+          );
+          packagesToInstall.add(`@flowgram.ai/form-materials@${project.flowgramVersion}`);
+        } else if (!source.startsWith(".") && !source.startsWith("react")) {
+          const [dep, version] = Object.entries(formMaterialDependencies).find(([_key]) => source.startsWith(_key)) || [];
+          if (!dep) {
+            continue;
+          }
+          if (dep.startsWith("@flowgram.ai/")) {
+            packagesToInstall.add(`${dep}@${project.flowgramVersion}`);
+          } else {
+            packagesToInstall.add(`${dep}@${version}`);
+          }
+        }
+      }
+    }
+  }
+  return {
+    packagesToInstall: [...packagesToInstall]
+  };
+};
+
 // src/materials/index.ts
-async function syncMaterial(opts) {
-  const { materialName, refreshProjectImports } = opts;
-  console.log(chalk3.bold("\u{1F680} Welcome to @flowgram.ai form-materials!"));
+async function syncMaterial(cliOpts) {
+  const { refreshProjectImports, targetMaterialRootDir } = cliOpts;
+  console.log(chalk5.bold("\u{1F680} Welcome to @flowgram.ai form-materials CLI!"));
   const project = await Project.getSingleton();
   project.printInfo();
+  const targetFormMaterialRoot = targetMaterialRootDir || path9.join(project.projectPath, "src", "form-materials");
+  console.log(chalk5.black(`  - Target material root: ${targetFormMaterialRoot}`));
   if (!project.flowgramVersion) {
     throw new Error(
-      chalk3.red(
+      chalk5.red(
         "\u274C Please install @flowgram.ai/fixed-layout-editor or @flowgram.ai/free-layout-editor"
       )
     );
   }
-  const formMaterialPath = await loadNpm("@flowgram.ai/form-materials");
-  const formMaterialSrc = path7.join(formMaterialPath, "src");
-  const materials = listAllMaterials(formMaterialSrc);
-  let material;
-  if (materialName) {
-    const selectedMaterial = materials.find(
-      (m) => `${m.type}/${m.name}` === materialName
-    );
-    if (selectedMaterial) {
-      material = selectedMaterial;
-      console.log(chalk3.green(`Using material: ${materialName}`));
-    } else {
-      console.log(
-        chalk3.yellow(
-          `Material "${materialName}" not found. Please select from the list:`
-        )
-      );
-    }
-  }
-  if (!material) {
-    const result = await inquirer.prompt([
-      {
-        type: "list",
-        name: "material",
-        message: "Select one material to add:",
-        choices: [
-          ...materials.map((_material) => ({
-            name: `${_material.type}/${_material.name}`,
-            value: _material
-          }))
-        ]
-      }
-    ]);
-    material = result.material;
-  }
-  if (!material) {
-    console.error(chalk3.red("No material selected. Exiting."));
+  const formMaterialPkg = await loadNpm("@flowgram.ai/form-materials");
+  let selectedMaterials = await getSelectedMaterials(cliOpts, formMaterialPkg);
+  if (!selectedMaterials.length) {
+    console.error(chalk5.red("No material selected. Exiting."));
     process.exit(1);
   }
+  const context = {
+    selectedMaterials,
+    project,
+    formMaterialPkg,
+    cliOpts,
+    targetFormMaterialRoot
+  };
+  console.log(chalk5.bold("\u{1F680} The following materials will be added to your project"));
+  console.log(selectedMaterials.map((material) => `\u{1F4E6} ${material.fullName}`).join("\n"));
+  console.log("\n");
+  let { packagesToInstall } = copyMaterials(context);
   if (refreshProjectImports) {
-    console.log(chalk3.bold("\u{1F680} Refresh imports in your project"));
-    executeRefreshProjectImport(project, material);
-  }
-  console.log(
-    chalk3.bold("\u{1F680} The following materials will be added to your project")
-  );
-  console.log(material);
-  let { packagesToInstall } = copyMaterial(material, project, formMaterialPath);
+    console.log(chalk5.bold("\u{1F680} Refresh imports in your project"));
+    executeRefreshProjectImport(context);
+  }
   await project.addDependencies(packagesToInstall);
-  console.log(
-    chalk3.bold("\u2705 These npm dependencies is added to your package.json")
-  );
+  console.log(chalk5.bold("\n\u2705 These npm dependencies is added to your package.json"));
   packagesToInstall.forEach((_package) => {
     console.log(`- ${_package}`);
   });
-  console.log(chalk3.bold("\n\u27A1\uFE0F Please run npm install to install dependencies\n"));
+  console.log(chalk5.bold(chalk5.bold("\n\u27A1\uFE0F Please run npm install to install dependencies\n")));
+}
+
+// src/find-materials/index.ts
+import chalk6 from "chalk";
+async function findUsedMaterials() {
+  console.log(chalk6.bold("\u{1F680} Welcome to @flowgram.ai form-materials CLI!"));
+  const project = await Project.getSingleton();
+  project.printInfo();
+  const formMaterialPkg = await loadNpm("@flowgram.ai/form-materials");
+  const materials = Material.listAll(formMaterialPkg);
+  const allUsedMaterials = /* @__PURE__ */ new Set();
+  const exportName2Material = /* @__PURE__ */ new Map();
+  for (const material of materials) {
+    if (!material.indexFile) {
+      console.warn(`Material ${material.name} not found`);
+      return;
+    }
+    console.log(`\u{1F440} The exports of ${material.name} is ${material.allExportNames.join(",")}`);
+    material.allExportNames.forEach((exportName) => {
+      exportName2Material.set(exportName, material);
+    });
+  }
+  for (const tsFile of traverseRecursiveTsFiles(project.srcPath)) {
+    const fileMaterials = /* @__PURE__ */ new Set();
+    let fileImportPrinted = false;
+    for (const importDeclaration of tsFile.imports) {
+      if (!importDeclaration.source.startsWith("@flowgram.ai/form-materials") || !importDeclaration.namedImports?.length) {
+        continue;
+      }
+      if (!fileImportPrinted) {
+        fileImportPrinted = true;
+        console.log(chalk6.bold(`
+\u{1F440} Searching ${tsFile.path}`));
+      }
+      console.log(`\u{1F50D} ${importDeclaration.statement}`);
+      if (importDeclaration.namedImports) {
+        importDeclaration.namedImports.forEach((namedImport) => {
+          const material = exportName2Material.get(namedImport.imported);
+          if (material) {
+            fileMaterials.add(material);
+            allUsedMaterials.add(material);
+            console.log(`import ${chalk6.bold(material.fullName)} by ${namedImport.imported}`);
+          }
+        });
+      }
+    }
+  }
+  console.log(chalk6.bold("\n\u{1F4E6} All used materials:"));
+  console.log([...allUsedMaterials].map((_material) => _material.fullName).join(","));
 }
 
 // src/create-app/index.ts
-import path8 from "path";
+import path10 from "path";
+import https2 from "https";
 import { execSync as execSync2 } from "child_process";
+import * as tar2 from "tar";
 import inquirer2 from "inquirer";
-import fs4 from "fs-extra";
-import chalk4 from "chalk";
-import download2 from "download";
-import * as tar from "tar";
-var args = process.argv.slice(2);
+import fs5 from "fs-extra";
+import chalk7 from "chalk";
 var updateFlowGramVersions = (dependencies, latestVersion) => {
   for (const packageName in dependencies) {
     if (packageName.startsWith("@flowgram.ai")) {
@@ -616,8 +798,29 @@ var updateFlowGramVersions = (dependencies, latestVersion) => {
     }
   }
 };
+function downloadFile2(url, dest) {
+  return new Promise((resolve, reject) => {
+    const file = fs5.createWriteStream(dest);
+    https2.get(url, (response) => {
+      if (response.statusCode !== 200) {
+        reject(new Error(`Download failed: ${response.statusCode}`));
+        return;
+      }
+      response.pipe(file);
+      file.on("finish", () => {
+        file.close();
+        resolve();
+      });
+    }).on("error", (err) => {
+      fs5.unlink(dest, () => reject(err));
+    });
+    file.on("error", (err) => {
+      fs5.unlink(dest, () => reject(err));
+    });
+  });
+}
 var createApp = async (projectName) => {
-  console.log(chalk4.green("Welcome to @flowgram.ai/create-app CLI!"));
+  console.log(chalk7.green("Welcome to @flowgram.ai/create-app CLI!"));
   const latest = execSync2("npm view @flowgram.ai/demo-fixed-layout version --tag=latest latest").toString().trim();
   let folderName = "";
   if (!projectName) {
@@ -639,7 +842,14 @@ var createApp = async (projectName) => {
     ]);
     folderName = repo;
   } else {
-    if (["fixed-layout", "free-layout", "fixed-layout-simple", "free-layout-simple", "playground", "nextjs"].includes(projectName)) {
+    if ([
+      "fixed-layout",
+      "free-layout",
+      "fixed-layout-simple",
+      "free-layout-simple",
+      "playground",
+      "nextjs"
+    ].includes(projectName)) {
       folderName = `demo-${projectName}`;
     } else {
       console.error('Invalid projectName. Please run "npx create-app" to choose demo.');
@@ -647,19 +857,20 @@ var createApp = async (projectName) => {
     }
   }
   try {
-    const targetDir = path8.join(process.cwd());
+    const targetDir = path10.join(process.cwd());
     const downloadPackage = async () => {
       try {
-        const tarballBuffer = await download2(`https://registry.npmjs.org/@flowgram.ai/${folderName}/-/${folderName}-${latest}.tgz`);
-        fs4.ensureDirSync(targetDir);
-        const tempTarballPath = path8.join(process.cwd(), `${folderName}.tgz`);
-        fs4.writeFileSync(tempTarballPath, tarballBuffer);
-        await tar.x({
+        const url = `https://registry.npmjs.org/@flowgram.ai/${folderName}/-/${folderName}-${latest}.tgz`;
+        const tempTarballPath = path10.join(process.cwd(), `${folderName}.tgz`);
+        console.log(chalk7.blue(`Downloading ${url} ...`));
+        await downloadFile2(url, tempTarballPath);
+        fs5.ensureDirSync(targetDir);
+        await tar2.x({
           file: tempTarballPath,
           C: targetDir
         });
-        fs4.renameSync(path8.join(targetDir, "package"), path8.join(targetDir, folderName));
-        fs4.unlinkSync(tempTarballPath);
+        fs5.renameSync(path10.join(targetDir, "package"), path10.join(targetDir, folderName));
+        fs5.unlinkSync(tempTarballPath);
         return true;
       } catch (error) {
         console.error(`Error downloading or extracting package: ${error}`);
@@ -667,8 +878,8 @@ var createApp = async (projectName) => {
       }
     };
     const res = await downloadPackage();
-    const pkgJsonPath = path8.join(targetDir, folderName, "package.json");
-    const data = fs4.readFileSync(pkgJsonPath, "utf-8");
+    const pkgJsonPath = path10.join(targetDir, folderName, "package.json");
+    const data = fs5.readFileSync(pkgJsonPath, "utf-8");
     const packageLatestVersion = execSync2("npm view @flowgram.ai/core version --tag=latest latest").toString().trim();
     const jsonData = JSON.parse(data);
     if (jsonData.dependencies) {
@@ -677,15 +888,15 @@ var createApp = async (projectName) => {
     if (jsonData.devDependencies) {
       updateFlowGramVersions(jsonData.devDependencies, packageLatestVersion);
     }
-    fs4.writeFileSync(pkgJsonPath, JSON.stringify(jsonData, null, 2), "utf-8");
+    fs5.writeFileSync(pkgJsonPath, JSON.stringify(jsonData, null, 2), "utf-8");
     if (res) {
-      console.log(chalk4.green(`${folderName} Demo project created successfully!`));
-      console.log(chalk4.yellow("Run the following commands to start:"));
-      console.log(chalk4.cyan(`  cd ${folderName}`));
-      console.log(chalk4.cyan("  npm install"));
-      console.log(chalk4.cyan("  npm start"));
+      console.log(chalk7.green(`${folderName} Demo project created successfully!`));
+      console.log(chalk7.yellow("Run the following commands to start:"));
+      console.log(chalk7.cyan(`  cd ${folderName}`));
+      console.log(chalk7.cyan("  npm install"));
+      console.log(chalk7.cyan("  npm start"));
     } else {
-      console.log(chalk4.red("Download failed"));
+      console.log(chalk7.red("Download failed"));
     }
   } catch (error) {
     console.error("Error downloading repo:", error);
@@ -699,7 +910,21 @@ program.name("flowgram-cli").version("1.0.0").description("Flowgram CLI");
 program.command("create-app").description("Create a new flowgram project").argument("[string]", "Project name").action(async (projectName) => {
   await createApp(projectName);
 });
-program.command("materials").description("Sync materials to the project").argument("[string]", "Material name").option("--refresh-project-imports", "Refresh project imports to copied materials", false).action(async (materialName, options) => {
-  await syncMaterial({ materialName, refreshProjectImports: options.refreshProjectImports });
+program.command("materials").description("Sync materials to the project").argument(
+  "[string]",
+  "Material name or names\nExample 1: components/variable-selector \nExample2: components/variable-selector,effect/provideJsonSchemaOutputs"
+).option("--refresh-project-imports", "Refresh project imports to copied materials", false).option("--target-material-root-dir <string>", "Target directory to copy materials").option("--select-multiple", "Select multiple materials", false).action(async (materialName, options) => {
+  await syncMaterial({
+    materialName,
+    refreshProjectImports: options.refreshProjectImports,
+    targetMaterialRootDir: options.targetMaterialRootDir ? path11.join(process.cwd(), options.targetMaterialRootDir) : void 0,
+    selectMultiple: options.selectMultiple
+  });
+});
+program.command("find-used-materials").description("Find used materials in the project").action(async () => {
+  await findUsedMaterials();
+});
+program.command("update-version").description("Update flowgram version in the project").argument("[string]", "Flowgram version").action(async (version) => {
+  await updateFlowgramVersion(version);
 });
 program.parse(process.argv);