@flowgram.ai/form-materials 0.1.8

package/bin/index.js

@@ -0,0 +1,63 @@
+import chalk from 'chalk';
+import { Command } from 'commander';
+import inquirer from 'inquirer';
+
+import { bfsMaterials, copyMaterial, listAllMaterials } from './materials.js';
+import { getProjectInfo, installDependencies } from './project.js';
+
+const program = new Command();
+
+program
+  .version('1.0.0')
+  .description('Add official materials to your project')
+  .action(async () => {
+    console.log(chalk.bgGreenBright('Welcome to @flowgram.ai/form-materials CLI!'));
+
+    const projectInfo = getProjectInfo();
+
+    console.log(chalk.bold('Project Info:'));
+    console.log(chalk.black(`  - Flowgram Version: ${projectInfo.flowgramVersion}`));
+    console.log(chalk.black(`  - Project Path: ${projectInfo.projectPath}`));
+
+    const materials = listAllMaterials();
+
+    // 2. User select one component
+    const { material } = await inquirer.prompt([
+      {
+        type: 'list',
+        name: 'material',
+        message: 'Select one material to add:',
+        choices: [
+          ...materials.map((_material) => ({
+            name: `${_material.type}/${_material.name}`,
+            value: _material,
+          })),
+        ],
+      },
+    ]);
+
+    console.log(material);
+
+    // 3. Get the component dependencies by BFS (include depMaterials and depPackages)
+    const { allMaterials, allPackages } = bfsMaterials(material, materials);
+
+    // 4. Install the dependencies
+    let flowgramPackage = `@flowgram.ai/editor`;
+    if (projectInfo.flowgramVersion !== 'workspace:*') {
+      flowgramPackage = `@flowgram.ai/editor@${projectInfo.flowgramVersion}`;
+    }
+    const packagesToInstall = [flowgramPackage, ...allPackages];
+
+    console.log(chalk.bold('These npm dependencies will be added to your project'));
+    console.log(packagesToInstall);
+    installDependencies(packagesToInstall, projectInfo);
+
+    // 5. Copy the materials to the project
+    console.log(chalk.bold('These Materials will be added to your project'));
+    console.log(allMaterials);
+    allMaterials.forEach((material) => {
+      copyMaterial(material, projectInfo);
+    });
+  });
+
+program.parse(process.argv);

package/bin/materials.js

@@ -0,0 +1,72 @@
+import fs from 'fs';
+import path from 'path';
+
+const _types = ['components'];
+
+export function listAllMaterials() {
+  const _materials = [];
+
+  for (const _type of _types) {
+    const materialsPath = path.join(import.meta.dirname, '..', 'src', _type);
+    _materials.push(
+      ...fs
+        .readdirSync(materialsPath)
+        .map((_path) => {
+          if (_path === 'index.ts') {
+            return null;
+          }
+
+          const config = fs.readFileSync(path.join(materialsPath, _path, 'config.json'), 'utf8');
+          return {
+            ...JSON.parse(config),
+            type: _type,
+            path: path.join(materialsPath, _path),
+          };
+        })
+        .filter(Boolean)
+    );
+  }
+
+  return _materials;
+}
+
+export function bfsMaterials(material, _materials = []) {
+  function findConfigByName(name) {
+    return _materials.find((_config) => _config.name === name);
+  }
+
+  const queue = [material];
+  const allMaterials = new Set();
+  const allPackages = new Set();
+
+  while (queue.length > 0) {
+    const _material = queue.shift();
+    if (allMaterials.has(_material)) {
+      continue;
+    }
+    allMaterials.add(_material);
+
+    if (_material.depPackages) {
+      for (const _package of _material.depPackages) {
+        allPackages.add(_package);
+      }
+    }
+
+    if (_material.depMaterials) {
+      for (const _materialName of _material.depMaterials) {
+        queue.push(findConfigByName(_materialName));
+      }
+    }
+  }
+
+  return {
+    allMaterials: Array.from(allMaterials),
+    allPackages: Array.from(allPackages),
+  };
+}
+
+export const copyMaterial = (material, projectInfo) => {
+  const sourceDir = material.path;
+  const targetDir = path.join(projectInfo.projectPath, `form-${material.type}`, material.name);
+  fs.cpSync(sourceDir, targetDir, { recursive: true });
+};

package/bin/project.js

@@ -0,0 +1,72 @@
+import { execSync } from 'child_process';
+import fs from 'fs';
+import path from 'path';
+
+export function getProjectInfo() {
+  // get nearest package.json
+  let projectPath = process.cwd();
+
+  while (projectPath !== '/' && !fs.existsSync(path.join(projectPath, 'package.json'))) {
+    projectPath = path.join(projectPath, '..');
+  }
+
+  if (projectPath === '/') {
+    throw new Error('Please run this command in a valid project');
+  }
+
+  const packageJsonPath = path.join(projectPath, 'package.json');
+
+  const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, 'utf8'));
+
+  // fixed layout or free layout
+  const flowgramVersion =
+    packageJson.dependencies['@flowgram.ai/fixed-layout-editor'] ||
+    packageJson.dependencies['@flowgram.ai/free-layout-editor'] ||
+    packageJson.dependencies['@flowgram.ai/editor'];
+
+  if (!flowgramVersion) {
+    throw new Error(
+      'Please install @flowgram.ai/fixed-layout-editor or @flowgram.ai/free-layout-editor'
+    );
+  }
+
+  return {
+    projectPath,
+    packageJsonPath,
+    packageJson,
+    flowgramVersion,
+  };
+}
+
+export function findRushJson(startPath) {
+  let currentPath = startPath;
+  while (currentPath !== '/' && !fs.existsSync(path.join(currentPath, 'rush.json'))) {
+    currentPath = path.join(currentPath, '..');
+  }
+  if (fs.existsSync(path.join(currentPath, 'rush.json'))) {
+    return path.join(currentPath, 'rush.json');
+  }
+  return null;
+}
+
+export function installDependencies(packages, projectInfo) {
+  if (fs.existsSync(path.join(projectInfo.projectPath, 'yarn.lock'))) {
+    execSync(`yarn add ${packages.join(' ')}`, { stdio: 'inherit' });
+    return;
+  }
+
+  if (fs.existsSync(path.join(projectInfo.projectPath, 'pnpm-lock.yaml'))) {
+    execSync(`pnpm add ${packages.join(' ')}`, { stdio: 'inherit' });
+    return;
+  }
+
+  //  rush monorepo
+  if (findRushJson(projectInfo.projectPath)) {
+    execSync(`rush add ${packages.map((pkg) => `--package ${pkg}`).join(' ')}`, {
+      stdio: 'inherit',
+    });
+    return;
+  }
+
+  execSync(`npm install ${packages.join(' ')}`, { stdio: 'inherit' });
+}