kesp-ui 1.0.0 → 1.0.1

package/index.js

@@ -5,6 +5,7 @@ const axios = require("axios");
 const fs = require("fs-extra");
 const path = require("path");
 const chalk = require("chalk");
+const { execSync } = require("child_process");
 
 // ── Replace with your actual GitHub username ──────────────────────────────────
 const GITHUB_USER = "Sankalp-Pradhan";
@@ -12,13 +13,13 @@ const REPO_NAME = "kespUI";
 const BRANCH = "main";
 
 const REGISTRY_URL = `https://raw.githubusercontent.com/${GITHUB_USER}/${REPO_NAME}/${BRANCH}/registry.json`;
-const BASE_URL = `https://raw.githubusercontent.com/${GITHUB_USER}/${REPO_NAME}/${BRANCH}/registry`;
 
 program
   .name("kesp-ui")
   .description("Add kesp-ui components to your project")
   .version("1.0.0");
 
+
 // ── LIST command ──────────────────────────────────────────────────────────────
 program
   .command("list")
@@ -31,7 +32,7 @@ program
       registry.items.forEach((item) => {
         console.log(`  ${chalk.green("◆")} ${chalk.bold(item.name)}`);
         console.log(`    ${chalk.gray(item.description)}`);
-        if (item.dependencies.length > 0) {
+        if (item.dependencies?.length) {
           console.log(`    ${chalk.yellow("deps:")} ${item.dependencies.join(", ")}`);
         }
         console.log();
@@ -41,6 +42,7 @@ program
     }
   });
 
+
 // ── ADD command ───────────────────────────────────────────────────────────────
 program
   .command("add <component>")
@@ -58,40 +60,84 @@ program
         process.exit(1);
       }
 
-      // Download each file
+      // ── Download files ──────────────────────────────────────────────────────
       for (const file of found.files) {
         const fileName = path.basename(file.path);
-        const fileUrl = `${BASE_URL}/${fileName}`;
+        const fileUrl = `https://raw.githubusercontent.com/${GITHUB_USER}/${REPO_NAME}/${BRANCH}/${file.path}`;
+        const destPath = path.join(process.cwd(), options.path, fileName);
+
+        // Prevent overwriting existing files (smart installer behavior)
+        if (fs.existsSync(destPath)) {
+          console.log(chalk.yellow(`  ↷ ${fileName} already exists — skipping`));
+          continue;
+        }
+
         console.log(chalk.gray(`  Downloading ${fileName}...`));
 
         const { data: content } = await axios.get(fileUrl);
 
-        const destPath = path.join(process.cwd(), options.path, fileName);
         await fs.ensureDir(path.dirname(destPath));
         await fs.writeFile(destPath, content, "utf8");
 
         console.log(chalk.green(`  ✔ ${fileName}`) + chalk.gray(` → ${options.path}/${fileName}`));
       }
 
-      // Show dependency install hint
+      // ── Install registryDependencies (shadcn components) ──────────────────────
+if (found.registryDependencies && found.registryDependencies.length > 0) {
+  console.log(chalk.cyan("\nInstalling registry dependencies (shadcn components)...\n"));
+
+  for (const dep of found.registryDependencies) {
+    console.log(chalk.gray(`  Installing shadcn component: ${dep}...`));
+    try {
+      execSync(`npx shadcn@latest add ${dep} --yes`, {
+        stdio: "inherit",
+        cwd: process.cwd(),
+      });
+      console.log(chalk.green(`  ✔ ${dep} installed`));
+    } catch {
+      console.log(chalk.yellow(`  ⚠ Could not auto-install "${dep}". Run manually: npx shadcn@latest add ${dep}`));
+    }
+  }
+}
+
+      // ── Install dependencies (AUTO DETECT PM) ───────────────────────────────
       if (found.dependencies && found.dependencies.length > 0) {
-        console.log(
-          chalk.yellow(`\n  Install dependencies:\n`) +
-          chalk.white(`  npm install ${found.dependencies.join(" ")}\n`)
-        );
-      } else {
-        console.log();
+        console.log(chalk.cyan("\nInstalling dependencies...\n"));
+
+        let pkgManager = "npm";
+
+        if (fs.existsSync(path.join(process.cwd(), "pnpm-lock.yaml"))) pkgManager = "pnpm";
+        else if (fs.existsSync(path.join(process.cwd(), "yarn.lock"))) pkgManager = "yarn";
+        else if (fs.existsSync(path.join(process.cwd(), "bun.lockb"))) pkgManager = "bun";
+
+        const installCmd =
+          pkgManager === "npm"
+            ? `npm install ${found.dependencies.join(" ")}`
+            : `${pkgManager} add ${found.dependencies.join(" ")}`;
+
+        try {
+          execSync(installCmd, {
+            stdio: "inherit",
+            cwd: process.cwd(),
+          });
+
+          console.log(chalk.green("\n✔ Dependencies installed\n"));
+        } catch {
+          console.log(chalk.red("Failed to install dependencies"));
+        }
       }
 
       console.log(chalk.green(`✔ Done! `) + chalk.gray(`Import with:`));
       console.log(
         chalk.white(`  import ${toPascalCase(component)} from "@/components/ui/${component}";\n`)
       );
+
     } catch (err) {
       console.error(chalk.red("Error:"), err.message);
     }
   });
 
+
 // ── Helper ────────────────────────────────────────────────────────────────────
 function toPascalCase(str) {
   return str
@@ -100,4 +146,4 @@ function toPascalCase(str) {
     .join("");
 }
 
-program.parse();
+program.parse();

package/package.json

@@ -1,30 +1,37 @@
-{
-  "name": "kesp-ui",
-  "version": "1.0.0",
-  "description": "CLI to add kesp-ui components to your project",
-  "main": "index.js",
-  "bin": {
-    "kesp-ui": "./index.js"
-  },
-  "scripts": {
-    "start": "node index.js"
-  },
-  "keywords": [
-    "ui",
-    "components",
-    "react",
-    "nextjs",
-    "tailwindcss",
-    "india",
-    "aadhaar",
-    "pan"
-  ],
-  "author": "yourusername",
-  "license": "MIT",
-  "dependencies": {
-    "axios": "^1.6.0",
-    "chalk": "^4.1.2",
-    "commander": "^11.0.0",
-    "fs-extra": "^11.2.0"
-  }
-}
+{
+  "name": "kesp-ui",
+  "version": "1.0.1",
+  "description": "CLI to add kesp-ui components to your project",
+  "main": "index.js",
+  "bin": {
+    "kesp-ui": "./index.js"
+  },
+  "scripts": {
+    "start": "node index.js"
+  },
+  "keywords": [
+    "ui",
+    "components",
+    "react",
+    "nextjs",
+    "tailwindcss",
+    "india",
+    "aadhaar",
+    "pan"
+  ],
+  "author": "yourusername",
+  "license": "MIT",
+  "dependencies": {
+    "axios": "^1.6.0",
+    "chalk": "^4.1.2",
+    "commander": "^11.0.0",
+    "fs-extra": "^11.2.0"
+  },
+  "devDependencies": {
+    "@types/react": "^19.2.14",
+    "@types/react-dom": "^19.2.3",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
+    "typescript": "^5.9.3"
+  }
+}

package/{aadhaar-input.tsx → registry/aadhaar-input.tsx}

@@ -1,5 +1,7 @@
+"use client"
+
 import React, { useState, useRef, useCallback } from "react";
-import { cn } from "@/lib/utils";
+import { cn } from "./utils";
 import { Check, AlertCircle, CreditCard } from "lucide-react";
 
 // ─── Verhoeff Algorithm ───────────────────────────────────────────────────────

package/{maskedAadhar.tsx → registry/maskedAadhar.tsx}

@@ -1,5 +1,7 @@
+"use client"
+
 import React, { useState, useRef, useCallback } from "react";
-import { cn } from "@/lib/utils";
+import { cn } from "./utils";
 import { Upload, X, Eye, EyeOff, ShieldCheck, AlertCircle } from "lucide-react";
 
 interface MaskedAadhaarUploadProps {

package/{otp-input.tsx → registry/otp-input.tsx}

@@ -1,3 +1,5 @@
+"use client"
+
 import { useState, useRef, useCallback, useEffect, KeyboardEvent, ClipboardEvent } from "react";
 import { Timer, RotateCcw, CheckCircle2, ShieldCheck } from "lucide-react";
 import { Button } from "@/components/ui/button";

package/registry/utils.ts

@@ -0,0 +1,6 @@
+import { clsx, type ClassValue } from "clsx"
+import { twMerge } from "tailwind-merge"
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs))
+}

package/registry.json

@@ -10,9 +10,17 @@
         {
           "path": "registry/aadhaar-input.tsx",
           "type": "registry:ui"
+        },
+        {
+          "path": "registry/utils.ts",
+          "type": "registry:lib"
         }
       ],
-      "dependencies": ["lucide-react"],
+      "dependencies": [
+        "lucide-react",
+        "clsx",
+        "tailwind-merge"
+      ],
       "devDependencies": [],
       "tailwind": {},
       "cssVars": {}
@@ -25,9 +33,16 @@
         {
           "path": "registry/pan-input.tsx",
           "type": "registry:ui"
+        },
+        {
+          "path": "registry/utils.ts",
+          "type": "registry:lib"
         }
       ],
-      "dependencies": [],
+      "dependencies": [
+        "clsx",
+        "tailwind-merge"
+      ],
       "devDependencies": [],
       "tailwind": {},
       "cssVars": {}
@@ -40,12 +55,23 @@
         {
           "path": "registry/otp-input.tsx",
           "type": "registry:ui"
+        },
+        {
+          "path": "registry/utils.ts",
+          "type": "registry:lib"
         }
       ],
-      "dependencies": ["lucide-react"],
+      "dependencies": [
+        "lucide-react",
+        "clsx",
+        "tailwind-merge"
+      ],
+      "registryDependencies": [
+        "button"
+      ],
       "devDependencies": [],
       "tailwind": {},
       "cssVars": {}
     }
   ]
-}
+}

package/tsconfig.json

@@ -0,0 +1,10 @@
+{
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "moduleResolution": "node",
+    "target": "ES2020",
+    "skipLibCheck": true,
+    "esModuleInterop": true
+  },
+  "include": ["registry"]
+}