draft-cli 0.0.2 → 0.1.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @draft-ui/cli
 
+## 0.1.0
+
+### Minor Changes
+
+- 5cc175a: update command
+
 ## 0.0.2
 
 ### Patch Changes

package/README.md

@@ -14,29 +14,25 @@ You can install the CLI globally or use it with your favorite package manager:
 
 ```bash
 # Global installation
-npm install -g draft-ui
+npm install -g draft-cli
 # or
-pnpm add -g draft-ui
+pnpm add -g draft-cli
 
 # Or use it directly without installation
-pnpm dlx draft-ui init
-npx draft-ui init
+pnpm dlx draft-cli init
+npx draft-cli init
 ```
 
 ## Usage
 
-The CLI provides two main entry points depending on your framework: `draft-vue` and `draft-react`.
+The CLI provides a unified entry point `draft-cli` for all operations.
 
 ### Initialize
 
 Initialize your project and create a `components.json` file:
 
 ```bash
-# For Vue projects
-pnpm draft-vue init
-
-# For React projects
-pnpm draft-react init
+draft-cli init
 ```
 
 ### Add Components
@@ -45,10 +41,10 @@ Add a component to your project:
 
 ```bash
 # For Vue
-pnpm draft-vue add button
+draft-cli vue add button
 
 # For React
-pnpm draft-react add button
+draft-cli react add button
 ```
 
 ## Configuration

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "draft-cli",
-  "version": "0.0.2",
+  "version": "0.1.0",
   "private": false,
   "description": "A command-line tool for adding components to your Vue and React projects. Inspired by shadcn/ui.",
   "type": "module",
@@ -19,8 +19,7 @@
     "directory": "packages/cli"
   },
   "bin": {
-    "draft-vue": "./dist/vue.js",
-    "draft-react": "./dist/react.js"
+    "draft-cli": "./dist/index.js"
   },
   "publishConfig": {
     "access": "public",
@@ -44,7 +43,7 @@
   },
   "register": "https://raw.githubusercontent.com/preflower/draft-ui/main",
   "scripts": {
-    "build": "tsup src/bin/vue.ts src/bin/react.ts --format esm --clean --dts",
-    "dev": "tsup src/bin/vue.ts src/bin/react.ts --format esm --watch --clean"
+    "build": "tsup src/bin/index.ts --format esm --clean --dts",
+    "dev": "tsup src/bin/index.ts --format esm --watch --clean"
   }
 }

package/src/bin/index.ts

@@ -0,0 +1,60 @@
+import { createRequire } from 'module'
+
+import { Command } from 'commander'
+
+import { addComponent } from '../commands/add.js'
+import { initProject } from '../commands/init.js'
+
+const require = createRequire(import.meta.url)
+interface PackageJson {
+  version: string
+  [key: string]: unknown
+}
+
+let pkg: PackageJson = { version: '0.0.1' }
+
+try {
+  pkg = require('../../package.json')
+} catch {
+  try {
+    pkg = require('../package.json')
+  } catch {
+    pkg = { version: '0.0.1' }
+  }
+}
+
+const program = new Command()
+
+program
+  .name('draft-cli')
+  .description('CLI for adding components to your projects')
+  .version(pkg.version)
+
+program
+  .command('init')
+  .description('initialize your project and create a components.json file')
+  .action(async () => {
+    await initProject()
+  })
+
+const vue = program.command('vue').description('Vue components commands')
+
+vue
+  .command('add')
+  .description('add a Vue component to your project')
+  .argument('<component>', 'the component to add')
+  .action(async (component) => {
+    await addComponent(component, 'vue')
+  })
+
+const react = program.command('react').description('React components commands')
+
+react
+  .command('add')
+  .description('add a React component to your project')
+  .argument('<component>', 'the component to add')
+  .action(async (component) => {
+    await addComponent(component, 'react')
+  })
+
+program.parse()

package/dist/chunk-TY6E2FMX.js

@@ -1,191 +0,0 @@
-// src/commands/add.ts
-import { createRequire } from "module";
-import path2 from "path";
-import chalk from "chalk";
-import fs2 from "fs-extra";
-import ora from "ora";
-
-// src/utils/config.ts
-import path from "path";
-import fs from "fs-extra";
-import { z } from "zod";
-var configSchema = z.object({
-  style: z.string(),
-  rsc: z.boolean(),
-  tsx: z.boolean(),
-  tailwind: z.object({
-    config: z.string(),
-    css: z.string(),
-    baseColor: z.string(),
-    cssVariables: z.boolean()
-  }),
-  aliases: z.object({
-    components: z.string(),
-    utils: z.string(),
-    ui: z.string().optional(),
-    draft: z.string().optional()
-  })
-});
-async function getConfig(cwd) {
-  const configPath = path.resolve(cwd, "components.json");
-  if (!await fs.pathExists(configPath)) {
-    return null;
-  }
-  try {
-    const config = await fs.readJson(configPath);
-    return configSchema.parse(config);
-  } catch (error) {
-    throw new Error(`Invalid configuration: ${error}`);
-  }
-}
-
-// src/commands/add.ts
-var require2 = createRequire(import.meta.url);
-var pkg = {};
-try {
-  pkg = require2("../../package.json");
-} catch {
-  try {
-    pkg = require2("../package.json");
-  } catch {
-  }
-}
-async function addComponent(componentName, type) {
-  const cwd = process.cwd();
-  const config = await getConfig(cwd);
-  if (!config) {
-    console.log(chalk.red("\nNo components.json found. Please run init first (simulated).\n"));
-    return;
-  }
-  const spinner = ora(`Adding ${componentName}...`).start();
-  try {
-    const monorepoRoot = path2.resolve(import.meta.url.replace("file://", ""), "../../../../");
-    const sourceDir = path2.resolve(
-      monorepoRoot,
-      "packages",
-      type,
-      "src",
-      "components",
-      componentName
-    );
-    if (!await fs2.pathExists(sourceDir)) {
-      if (typeof pkg.register === "string") {
-        spinner.text = `Checking registry ${pkg.register}...`;
-        try {
-          const registryUrl = `${pkg.register}/packages/${type}/src/registry.json`;
-          const registryRes = await fetch(registryUrl);
-          if (!registryRes.ok) {
-            throw new Error(`Failed to fetch registry from ${registryUrl}: ${registryRes.statusText}`);
-          }
-          const registry = await registryRes.json();
-          const componentMeta = registry.components[componentName];
-          if (componentMeta == null) {
-            spinner.fail(chalk.red(`Component ${componentName} not found in registry.`));
-            return;
-          }
-          if (!componentMeta.files || !Array.isArray(componentMeta.files)) {
-            spinner.fail(chalk.red(`Component ${componentName} has no files listed in registry.`));
-            return;
-          }
-          spinner.text = `Fetching ${componentName} files...`;
-          const titleCaseComponentName = componentName.charAt(0).toUpperCase() + componentName.slice(1);
-          const targetBase2 = (config.aliases.draft ?? config.aliases.ui ?? config.aliases.components).replace("@/", "src/");
-          const targetDir2 = path2.resolve(cwd, targetBase2, titleCaseComponentName);
-          await fs2.ensureDir(targetDir2);
-          for (const file of componentMeta.files) {
-            const fileUrl = `${pkg.register}/packages/${type}/src/components/${componentName}/${file}`;
-            const fileRes = await fetch(fileUrl);
-            if (!fileRes.ok) {
-              throw new Error(`Failed to fetch file ${file}: ${fileRes.statusText}`);
-            }
-            const content = await fileRes.text();
-            await fs2.writeFile(path2.resolve(targetDir2, file), content);
-          }
-          if (componentMeta.dependencies != null && componentMeta.dependencies.length > 0) {
-            spinner.text = `Installing dependencies for ${componentName}: ${componentMeta.dependencies.join(", ")}...`;
-            const { execa } = await import("execa");
-            try {
-              await execa("pnpm", ["add", ...componentMeta.dependencies], { cwd });
-            } catch (err) {
-              spinner.warn(chalk.yellow(`Component added, but failed to install dependencies: ${err.message}`));
-            }
-          }
-          spinner.succeed(chalk.green(`Component ${componentName} added from registry.`));
-          return;
-        } catch (error) {
-          spinner.fail(chalk.red(`Failed to fetch from registry: ${error.message}`));
-          return;
-        }
-      }
-      spinner.fail(chalk.red(`Component ${componentName} not found for ${type}.`));
-      return;
-    }
-    const targetBase = (config.aliases.draft ?? config.aliases.ui ?? config.aliases.components).replace("@/", "src/");
-    const targetDir = path2.resolve(cwd, targetBase, componentName);
-    await fs2.ensureDir(targetDir);
-    await fs2.copy(sourceDir, targetDir);
-    const registryPath = path2.resolve(monorepoRoot, "packages", type, "src", "registry.json");
-    if (await fs2.pathExists(registryPath)) {
-      const registry = await fs2.readJson(registryPath);
-      const componentMeta = registry.components[componentName];
-      if (componentMeta?.dependencies?.length > 0) {
-        spinner.text = `Installing dependencies for ${componentName}: ${componentMeta.dependencies.join(", ")}...`;
-        const { execa } = await import("execa");
-        try {
-          await execa("pnpm", ["add", ...componentMeta.dependencies], { cwd });
-          spinner.succeed(chalk.green(`Component ${componentName} and its dependencies added successfully.`));
-          return;
-        } catch (err) {
-          spinner.warn(chalk.yellow(`Component copied, but failed to install dependencies: ${err.message}`));
-          return;
-        }
-      }
-    }
-    spinner.succeed(chalk.green(`Component ${componentName} added successfully to ${targetDir}`));
-  } catch (error) {
-    spinner.fail(chalk.red(`Failed to add component: ${error}`));
-  }
-}
-
-// src/commands/init.ts
-import path3 from "path";
-import chalk2 from "chalk";
-import fs3 from "fs-extra";
-import ora2 from "ora";
-var DEFAULT_CONFIG = {
-  style: "default",
-  rsc: false,
-  tsx: true,
-  tailwind: {
-    config: "tailwind.config.js",
-    css: "src/index.css",
-    baseColor: "slate",
-    cssVariables: true
-  },
-  aliases: {
-    components: "@/components",
-    utils: "@/lib/utils",
-    ui: "@/components/ui",
-    draft: "@/components/draft"
-  }
-};
-async function initProject() {
-  const cwd = process.cwd();
-  const configPath = path3.resolve(cwd, "components.json");
-  if (await fs3.pathExists(configPath)) {
-    console.log(chalk2.yellow("\ncomponents.json already exists.\n"));
-    return;
-  }
-  const spinner = ora2("Initializing project...").start();
-  try {
-    await fs3.writeJson(configPath, DEFAULT_CONFIG, { spaces: 2 });
-    spinner.succeed(chalk2.green("Initialized components.json successfully!"));
-  } catch (error) {
-    spinner.fail(chalk2.red(`Failed to initialize project: ${error}`));
-  }
-}
-
-export {
-  addComponent,
-  initProject
-};

package/dist/react.d.ts

@@ -1,2 +0,0 @@
-
-export {  }

package/dist/react.js

@@ -1,16 +0,0 @@
-import {
-  addComponent,
-  initProject
-} from "./chunk-TY6E2FMX.js";
-
-// src/bin/react.ts
-import { Command } from "commander";
-var program = new Command();
-program.name("draft-react").description("CLI for adding React components").version("0.0.1");
-program.command("add").description("add a component to your project").argument("<component>", "the component to add").action(async (component) => {
-  await addComponent(component, "react");
-});
-program.command("init").description("initialize your project and create a components.json file").action(async () => {
-  await initProject();
-});
-program.parse();

package/dist/vue.d.ts

@@ -1,2 +0,0 @@
-
-export {  }

package/dist/vue.js

@@ -1,16 +0,0 @@
-import {
-  addComponent,
-  initProject
-} from "./chunk-TY6E2FMX.js";
-
-// src/bin/vue.ts
-import { Command } from "commander";
-var program = new Command();
-program.name("draft-vue").description("CLI for adding Vue components").version("0.0.1");
-program.command("add").description("add a component to your project").argument("<component>", "the component to add").action(async (component) => {
-  await addComponent(component, "vue");
-});
-program.command("init").description("initialize your project and create a components.json file").action(async () => {
-  await initProject();
-});
-program.parse();

package/src/bin/react.ts

@@ -1,28 +0,0 @@
-import { Command } from 'commander'
-
-import { addComponent } from '../commands/add.js'
-import { initProject } from '../commands/init.js'
-
-const program = new Command()
-
-program
-  .name('draft-react')
-  .description('CLI for adding React components')
-  .version('0.0.1')
-
-program
-  .command('add')
-  .description('add a component to your project')
-  .argument('<component>', 'the component to add')
-  .action(async (component) => {
-    await addComponent(component, 'react')
-  })
-
-program
-  .command('init')
-  .description('initialize your project and create a components.json file')
-  .action(async () => {
-    await initProject()
-  })
-
-program.parse()

package/src/bin/vue.ts

@@ -1,28 +0,0 @@
-import { Command } from 'commander'
-
-import { addComponent } from '../commands/add.js'
-import { initProject } from '../commands/init.js'
-
-const program = new Command()
-
-program
-  .name('draft-vue')
-  .description('CLI for adding Vue components')
-  .version('0.0.1')
-
-program
-  .command('add')
-  .description('add a component to your project')
-  .argument('<component>', 'the component to add')
-  .action(async (component) => {
-    await addComponent(component, 'vue')
-  })
-
-program
-  .command('init')
-  .description('initialize your project and create a components.json file')
-  .action(async () => {
-    await initProject()
-  })
-
-program.parse()