@srcroot/ui 0.0.63 → 0.0.65

package/dist/index.js

@@ -5,18 +5,43 @@ import { Command } from "commander";
 import chalk3 from "chalk";
 
 // src/cli/services/project-initializer.ts
-import fs4 from "fs-extra";
-import path4 from "path";
+import fs5 from "fs-extra";
+import path5 from "path";
 import ora from "ora";
 import prompts from "prompts";
-import { fileURLToPath as fileURLToPath3 } from "url";
+import { fileURLToPath as fileURLToPath4 } from "url";
 import { execa } from "execa";
 
 // src/cli/services/theme-service.ts
-import fs from "fs-extra";
+import fs2 from "fs-extra";
+import path2 from "path";
+import { fileURLToPath as fileURLToPath2 } from "url";
+
+// src/cli/utils/get-registry-path.ts
 import path from "path";
+import fs from "fs-extra";
 import { fileURLToPath } from "url";
-var __dirname = path.dirname(fileURLToPath(import.meta.url));
+function getRegistryPath() {
+  const __filename2 = fileURLToPath(import.meta.url);
+  const __dirname5 = path.dirname(__filename2);
+  const pathsToCheck = [
+    path.resolve(__dirname5, "..", "src", "registry"),
+    // Production case
+    path.resolve(__dirname5, "..", "..", "registry"),
+    // Development case
+    path.resolve(process.cwd(), "src", "registry")
+    // Fallback/CWD case
+  ];
+  for (const p of pathsToCheck) {
+    if (fs.existsSync(p)) {
+      return p;
+    }
+  }
+  return path.resolve(__dirname5, "..", "src", "registry");
+}
+
+// src/cli/services/theme-service.ts
+var __dirname2 = path2.dirname(fileURLToPath2(import.meta.url));
 var THEME_METADATA = {
   slate: { name: "Slate", description: "Cool gray with strong blue undertones (default)" },
   neutral: { name: "Neutral", description: "Pure gray, no undertones" },
@@ -33,18 +58,18 @@ var THEME_METADATA = {
 var ThemeService = class {
   registryThemesPath;
   constructor() {
-    this.registryThemesPath = path.resolve(__dirname, "..", "src", "registry", "themes");
+    this.registryThemesPath = path2.join(getRegistryPath(), "themes");
   }
   /**
    * Get list of available themes from registry/themes/v3/*.css (v3 as primary source)
    */
   getAvailableThemes() {
     const themes = [];
-    const v3Path = path.join(this.registryThemesPath, "v3");
-    if (!fs.existsSync(v3Path)) {
+    const v3Path = path2.join(this.registryThemesPath, "v3");
+    if (!fs2.existsSync(v3Path)) {
       return themes;
     }
-    const files = fs.readdirSync(v3Path);
+    const files = fs2.readdirSync(v3Path);
     for (const file of files) {
       if (file.endsWith(".css")) {
         const themeName = file.replace(".css", "");
@@ -66,11 +91,11 @@ var ThemeService = class {
    */
   async getThemeCss(themeName, isTailwind4) {
     const versionFolder = isTailwind4 ? "v4" : "v3";
-    const themeFilePath = path.join(this.registryThemesPath, versionFolder, `${themeName}.css`);
-    if (!fs.existsSync(themeFilePath)) {
+    const themeFilePath = path2.join(this.registryThemesPath, versionFolder, `${themeName}.css`);
+    if (!fs2.existsSync(themeFilePath)) {
       throw new Error(`Theme file not found: ${themeFilePath}`);
     }
-    const content = await fs.readFile(themeFilePath, "utf-8");
+    const content = await fs2.readFile(themeFilePath, "utf-8");
     return content;
   }
 };
@@ -150,14 +175,14 @@ export default config
 `;
 
 // src/cli/utils/get-package-manager.ts
-import fs2 from "fs";
-import path2 from "path";
+import fs3 from "fs";
+import path3 from "path";
 function getPackageManager(cwd) {
   const dir = cwd || process.cwd();
-  if (fs2.existsSync(path2.join(dir, "bun.lockb"))) return "bun";
-  if (fs2.existsSync(path2.join(dir, "pnpm-lock.yaml"))) return "pnpm";
-  if (fs2.existsSync(path2.join(dir, "yarn.lock"))) return "yarn";
-  if (fs2.existsSync(path2.join(dir, "package-lock.json"))) return "npm";
+  if (fs3.existsSync(path3.join(dir, "bun.lockb"))) return "bun";
+  if (fs3.existsSync(path3.join(dir, "pnpm-lock.yaml"))) return "pnpm";
+  if (fs3.existsSync(path3.join(dir, "yarn.lock"))) return "yarn";
+  if (fs3.existsSync(path3.join(dir, "package-lock.json"))) return "npm";
   const userAgent = process.env.npm_config_user_agent;
   if (userAgent) {
     if (userAgent.startsWith("yarn")) return "yarn";
@@ -168,19 +193,19 @@ function getPackageManager(cwd) {
 }
 
 // src/cli/utils/get-package-info.ts
-import path3 from "path";
-import fs3 from "fs-extra";
-import { fileURLToPath as fileURLToPath2 } from "url";
+import path4 from "path";
+import fs4 from "fs-extra";
+import { fileURLToPath as fileURLToPath3 } from "url";
 function getPackageInfo() {
-  const __filename2 = fileURLToPath2(import.meta.url);
-  const __dirname5 = path3.dirname(__filename2);
+  const __filename2 = fileURLToPath3(import.meta.url);
+  const __dirname5 = path4.dirname(__filename2);
   const pathsToCheck = [
-    path3.resolve(__dirname5, "..", "package.json"),
-    path3.resolve(__dirname5, "..", "..", "..", "package.json")
+    path4.resolve(__dirname5, "..", "package.json"),
+    path4.resolve(__dirname5, "..", "..", "..", "package.json")
   ];
   for (const pkgPath of pathsToCheck) {
-    if (fs3.existsSync(pkgPath)) {
-      return fs3.readJSONSync(pkgPath);
+    if (fs4.existsSync(pkgPath)) {
+      return fs4.readJSONSync(pkgPath);
     }
   }
   return { version: "0.0.0" };
@@ -204,7 +229,7 @@ var logger = {
 };
 
 // src/cli/services/project-initializer.ts
-var __dirname3 = path4.dirname(fileURLToPath3(import.meta.url));
+var __dirname3 = path5.dirname(fileURLToPath4(import.meta.url));
 var ProjectInitializer = class {
   options;
   config = {};
@@ -223,13 +248,13 @@ var ProjectInitializer = class {
     this.printSuccess();
   }
   async validateEnvironment() {
-    const cwd = path4.resolve(this.options.cwd);
-    const packageJsonPath = path4.join(cwd, "package.json");
-    if (!fs4.existsSync(packageJsonPath)) {
+    const cwd = path5.resolve(this.options.cwd);
+    const packageJsonPath = path5.join(cwd, "package.json");
+    if (!fs5.existsSync(packageJsonPath)) {
       logger.error("Error: No package.json found. Please run this in a project directory.");
       process.exit(1);
     }
-    const pkg = await fs4.readJson(packageJsonPath);
+    const pkg = await fs5.readJson(packageJsonPath);
     const allDeps = { ...pkg.dependencies, ...pkg.devDependencies };
     if (!allDeps["react"]) {
       logger.error("Error: React not found in dependencies. Please initialize this in a React project.");
@@ -237,33 +262,33 @@ var ProjectInitializer = class {
     }
   }
   async detectConfiguration() {
-    const cwd = path4.resolve(this.options.cwd);
+    const cwd = path5.resolve(this.options.cwd);
     const packageManager = getPackageManager(cwd);
     const installCmd = packageManager === "npm" ? "install" : "add";
-    const pkg = await fs4.readJson(path4.join(cwd, "package.json"));
+    const pkg = await fs5.readJson(path5.join(cwd, "package.json"));
     const allDeps = { ...pkg.dependencies, ...pkg.devDependencies };
     const tailwindVersion = allDeps["tailwindcss"] || "";
     const isTailwind4 = tailwindVersion.includes("^4") || tailwindVersion.startsWith("4") || allDeps["@tailwindcss/postcss"];
-    const hasSrc = fs4.existsSync(path4.join(cwd, "src"));
-    const srcPath = hasSrc ? path4.join(cwd, "src") : cwd;
-    const appPath = path4.join(srcPath, "app");
-    const pagesPath = path4.join(srcPath, "pages");
-    const hasAppDir = fs4.existsSync(appPath);
-    const hasPagesDir = fs4.existsSync(pagesPath);
-    const libDir = path4.join(srcPath, "lib");
-    const componentsDir = path4.join(srcPath, "components", "ui");
+    const hasSrc = fs5.existsSync(path5.join(cwd, "src"));
+    const srcPath = hasSrc ? path5.join(cwd, "src") : cwd;
+    const appPath = path5.join(srcPath, "app");
+    const pagesPath = path5.join(srcPath, "pages");
+    const hasAppDir = fs5.existsSync(appPath);
+    const hasPagesDir = fs5.existsSync(pagesPath);
+    const libDir = path5.join(srcPath, "lib");
+    const componentsDir = path5.join(srcPath, "components", "ui");
     let globalsPath = "";
     if (hasAppDir) {
-      if (fs4.existsSync(path4.join(appPath, "globals.css"))) globalsPath = path4.join(appPath, "globals.css");
-      else if (fs4.existsSync(path4.join(appPath, "global.css"))) globalsPath = path4.join(appPath, "global.css");
-      else globalsPath = path4.join(appPath, "globals.css");
+      if (fs5.existsSync(path5.join(appPath, "globals.css"))) globalsPath = path5.join(appPath, "globals.css");
+      else if (fs5.existsSync(path5.join(appPath, "global.css"))) globalsPath = path5.join(appPath, "global.css");
+      else globalsPath = path5.join(appPath, "globals.css");
     } else if (hasPagesDir) {
-      const stylesPath = path4.join(srcPath, "styles");
-      if (fs4.existsSync(path4.join(stylesPath, "globals.css"))) globalsPath = path4.join(stylesPath, "globals.css");
-      else if (fs4.existsSync(path4.join(stylesPath, "global.css"))) globalsPath = path4.join(stylesPath, "global.css");
-      else globalsPath = path4.join(stylesPath, "globals.css");
+      const stylesPath = path5.join(srcPath, "styles");
+      if (fs5.existsSync(path5.join(stylesPath, "globals.css"))) globalsPath = path5.join(stylesPath, "globals.css");
+      else if (fs5.existsSync(path5.join(stylesPath, "global.css"))) globalsPath = path5.join(stylesPath, "global.css");
+      else globalsPath = path5.join(stylesPath, "globals.css");
     } else {
-      globalsPath = path4.join(srcPath, "globals.css");
+      globalsPath = path5.join(srcPath, "globals.css");
     }
     this.config = {
       cwd,
@@ -311,13 +336,13 @@ var ProjectInitializer = class {
     const spinner = ora("Creating project structure...").start();
     const cfg = this.config;
     try {
-      await fs4.ensureDir(cfg.libDir);
-      await fs4.ensureDir(cfg.componentsDir);
-      const utilsPath = path4.join(cfg.libDir, "utils.ts");
-      const registryUtilsPath = path4.resolve(__dirname3, "..", "src", "registry", "lib", "utils.ts");
+      await fs5.ensureDir(cfg.libDir);
+      await fs5.ensureDir(cfg.componentsDir);
+      const utilsPath = path5.join(cfg.libDir, "utils.ts");
+      const registryUtilsPath = path5.join(getRegistryPath(), "lib", "utils.ts");
       let utilsContent = "";
-      if (fs4.existsSync(registryUtilsPath)) {
-        utilsContent = await fs4.readFile(registryUtilsPath, "utf-8");
+      if (fs5.existsSync(registryUtilsPath)) {
+        utilsContent = await fs5.readFile(registryUtilsPath, "utf-8");
       } else {
         utilsContent = `import { type ClassValue, clsx } from "clsx"
 import { twMerge } from "tailwind-merge"
@@ -328,15 +353,15 @@ export function cn(...inputs: ClassValue[]) {
 `;
         spinner.warn(`Could not find registry/utils.ts, using fallback content.`);
       }
-      await fs4.writeFile(utilsPath, utilsContent);
-      spinner.succeed(`Created ${path4.relative(cfg.cwd, utilsPath)}`);
+      await fs5.writeFile(utilsPath, utilsContent);
+      spinner.succeed(`Created ${path5.relative(cfg.cwd, utilsPath)}`);
       spinner.start(`Setting up ${cfg.selectedTheme} theme...`);
-      const stylesDir = path4.dirname(cfg.globalsPath);
-      await fs4.ensureDir(stylesDir);
+      const stylesDir = path5.dirname(cfg.globalsPath);
+      await fs5.ensureDir(stylesDir);
       try {
         const cssContent = await this.themeService.getThemeCss(cfg.selectedTheme, cfg.isTailwind4);
-        await fs4.writeFile(cfg.globalsPath, cssContent);
-        spinner.succeed(`Updated ${path4.relative(cfg.cwd, cfg.globalsPath)} with ${cfg.selectedTheme} theme (${cfg.isTailwind4 ? "Tailwind 4" : "Tailwind 3"})`);
+        await fs5.writeFile(cfg.globalsPath, cssContent);
+        spinner.succeed(`Updated ${path5.relative(cfg.cwd, cfg.globalsPath)} with ${cfg.selectedTheme} theme (${cfg.isTailwind4 ? "Tailwind 4" : "Tailwind 3"})`);
       } catch (error) {
         spinner.fail(`Failed to load theme: ${cfg.selectedTheme}`);
         console.error(error);
@@ -344,8 +369,8 @@ export function cn(...inputs: ClassValue[]) {
       }
       if (!cfg.isTailwind4) {
         spinner.start("Setting up Tailwind config...");
-        const tailwindConfigPath = path4.join(cfg.cwd, "tailwind.config.ts");
-        await fs4.writeFile(tailwindConfigPath, TAILWIND_CONFIG);
+        const tailwindConfigPath = path5.join(cfg.cwd, "tailwind.config.ts");
+        await fs5.writeFile(tailwindConfigPath, TAILWIND_CONFIG);
         spinner.succeed(`Created tailwind.config.ts`);
       }
       const packageInfo = getPackageInfo();
@@ -353,11 +378,11 @@ export function cn(...inputs: ClassValue[]) {
         version: packageInfo.version || "0.0.0",
         theme: cfg.selectedTheme,
         paths: {
-          components: path4.relative(cfg.cwd, cfg.componentsDir),
-          utils: path4.relative(cfg.cwd, utilsPath)
+          components: path5.relative(cfg.cwd, cfg.componentsDir),
+          utils: path5.relative(cfg.cwd, utilsPath)
         }
       };
-      await fs4.writeJSON(path4.join(cfg.cwd, "srcroot.config.json"), configObj, { spaces: 2 });
+      await fs5.writeJSON(path5.join(cfg.cwd, "srcroot.config.json"), configObj, { spaces: 2 });
       spinner.succeed("Created srcroot.config.json");
     } catch (error) {
       spinner.fail("Failed to initialize project");
@@ -378,8 +403,8 @@ export function cn(...inputs: ClassValue[]) {
       deps.push("tailwindcss-animate");
     }
     try {
-      const packageJsonPath = path4.join(cfg.cwd, "package.json");
-      const pkg = await fs4.readJson(packageJsonPath);
+      const packageJsonPath = path5.join(cfg.cwd, "package.json");
+      const pkg = await fs5.readJson(packageJsonPath);
       const allDeps = { ...pkg.dependencies, ...pkg.devDependencies };
       const missingDeps = deps.filter((dep) => !allDeps[dep]);
       if (missingDeps.length === 0) {
@@ -413,13 +438,16 @@ async function init(options) {
   await initializer.run();
 }
 
+// src/cli/commands/add.ts
+import path7 from "path";
+
 // src/cli/services/component-adder.ts
-import fs5 from "fs-extra";
-import path5 from "path";
+import fs6 from "fs-extra";
+import path6 from "path";
 import ora2 from "ora";
 import prompts2 from "prompts";
 import { execa as execa2 } from "execa";
-import { fileURLToPath as fileURLToPath4 } from "url";
+import { fileURLToPath as fileURLToPath5 } from "url";
 
 // src/cli/registry.ts
 var REGISTRY = {
@@ -895,7 +923,7 @@ var REGISTRY = {
 };
 
 // src/cli/services/component-adder.ts
-var __dirname4 = path5.dirname(fileURLToPath4(import.meta.url));
+var __dirname4 = path6.dirname(fileURLToPath5(import.meta.url));
 var ComponentAdder = class {
   cwd;
   options;
@@ -981,21 +1009,14 @@ var ComponentAdder = class {
   logPlan(componentDeps, packageDeps) {
     const componentsToAdd = Array.from(componentDeps);
     const packagesToInstall = Array.from(packageDeps);
-    if (componentsToAdd.length > 10) {
+    if (componentsToAdd.length > 0) {
       logger.info(`
-\u{1F4E6} Adding ${componentsToAdd.length} components...
-`);
-    } else {
-      logger.info("\n\u{1F4E6} Adding components:\n");
-      componentsToAdd.forEach((name) => {
-        console.log(`  - ${name}`);
-      });
+\u{1F4E6} Adding components:`);
+      console.log(`  ${componentsToAdd.join(", ")}`);
     }
     if (packagesToInstall.length > 0) {
-      logger.info("\n\u{1F4E6} Installing dependencies:\n");
-      packagesToInstall.forEach((pkg) => {
-        console.log(`  - ${pkg}`);
-      });
+      logger.info("\n\u{1F4E6} Installing dependencies:");
+      console.log(`  ${packagesToInstall.join(", ")}`);
     }
     console.log();
   }
@@ -1017,16 +1038,58 @@ Please manually install: ${packages.join(" ")}`);
   }
   async copyComponents(components) {
     const spinner = ora2("Adding components...").start();
-    const hasSrc = fs5.existsSync(path5.join(this.cwd, "src"));
-    const srcPath = hasSrc ? path5.join(this.cwd, "src") : this.cwd;
-    const componentsDir = path5.join(srcPath, "components", "ui");
+    const hasSrc = fs6.existsSync(path6.join(this.cwd, "src"));
+    const srcPath = hasSrc ? path6.join(this.cwd, "src") : this.cwd;
+    const componentsDir = path6.join(srcPath, "components", "ui");
     try {
-      await fs5.ensureDir(componentsDir);
+      await fs6.ensureDir(componentsDir);
+      let overwriteAll = false;
+      let skipAll = false;
+      if (!this.options.overwrite) {
+        const conflicts = [];
+        for (const name of components) {
+          const comp = REGISTRY[name];
+          const fileName = path6.basename(comp.file);
+          const targetPath = path6.join(componentsDir, fileName);
+          if (fs6.existsSync(targetPath)) {
+            conflicts.push(fileName);
+          }
+        }
+        if (conflicts.length > 0) {
+          spinner.stop();
+          logger.warn(`
+\u26A0\uFE0F  The following components already exist:`);
+          console.log(`  ${conflicts.join(", ")}`);
+          console.log();
+          const { action } = await prompts2({
+            type: "select",
+            name: "action",
+            message: "How would you like to proceed?",
+            choices: [
+              { title: "Overwrite all", value: "overwrite" },
+              { title: "Skip all", value: "skip" },
+              { title: "Decide for each", value: "ask" }
+            ]
+          });
+          if (!action) {
+            logger.warn("Action cancelled.");
+            process.exit(0);
+          }
+          if (action === "overwrite") overwriteAll = true;
+          if (action === "skip") skipAll = true;
+        }
+        spinner.start("Adding components...");
+      }
+      let addedCount = 0;
       for (const name of components) {
         const comp = REGISTRY[name];
-        const fileName = path5.basename(comp.file);
-        const targetPath = path5.join(componentsDir, fileName);
-        if (fs5.existsSync(targetPath) && !this.options.overwrite) {
+        const fileName = path6.basename(comp.file);
+        const targetPath = path6.join(componentsDir, fileName);
+        if (fs6.existsSync(targetPath) && !this.options.overwrite && !overwriteAll) {
+          if (skipAll) {
+            spinner.info(`Skipped ${fileName}`);
+            continue;
+          }
           spinner.stop();
           const { overwrite } = await prompts2({
             type: "confirm",
@@ -1041,13 +1104,14 @@ Please manually install: ${packages.join(" ")}`);
           }
           spinner.start("Adding components...");
         }
-        const registryPath = path5.resolve(__dirname4, "..", "src", "registry", comp.file);
-        if (!fs5.existsSync(registryPath)) {
+        const registryPath = path6.resolve(getRegistryPath(), comp.file);
+        if (!fs6.existsSync(registryPath)) {
           spinner.warn(`Registry file not found for ${name}: ${registryPath}`);
           continue;
         }
-        const content = await fs5.readFile(registryPath, "utf-8");
-        await fs5.writeFile(targetPath, content);
+        const content = await fs6.readFile(registryPath, "utf-8");
+        await fs6.writeFile(targetPath, content);
+        addedCount++;
         if (components.length > 10) {
           spinner.text = `Adding ${fileName}...`;
         } else {
@@ -1055,7 +1119,7 @@ Please manually install: ${packages.join(" ")}`);
         }
       }
       if (components.length > 10) {
-        spinner.succeed(`Added ${components.length} components`);
+        spinner.succeed(`Added ${addedCount} components`);
       }
     } catch (error) {
       spinner.fail("Failed to add components");
@@ -1067,7 +1131,7 @@ Please manually install: ${packages.join(" ")}`);
 
 // src/cli/commands/add.ts
 async function add(components, options) {
-  const cwd = process.cwd();
+  const cwd = path7.resolve(options.cwd);
   const adder = new ComponentAdder(cwd, options);
   await adder.add(components);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@srcroot/ui",
-  "version": "0.0.63",
+  "version": "0.0.65",
   "description": "A UI library with polymorphic, accessible React components",
   "author": "Shifaul Islam",
   "license": "MIT",
@@ -71,4 +71,4 @@
       "optional": true
     }
   }
-}
+}