basuicn 0.1.6 → 0.1.7

package/dist/ui-cli.cjs

@@ -0,0 +1,850 @@
+#!/usr/bin/env node
+#!/usr/bin/env node
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+
+// scripts/ui-cli.ts
+var import_fs = __toESM(require("fs"), 1);
+var import_path = __toESM(require("path"), 1);
+var import_child_process = require("child_process");
+var import_readline = __toESM(require("readline"), 1);
+var VERSION = "0.1.6";
+var REGISTRY_LOCAL = "./registry.json";
+var REGISTRY_REMOTE = "https://raw.githubusercontent.com/Basuicn/basuicn-core/main/registry.json";
+var c = {
+  reset: "\x1B[0m",
+  bold: "\x1B[1m",
+  dim: "\x1B[2m",
+  green: "\x1B[32m",
+  yellow: "\x1B[33m",
+  red: "\x1B[31m",
+  cyan: "\x1B[36m",
+  magenta: "\x1B[35m",
+  blue: "\x1B[34m",
+  gray: "\x1B[90m"
+};
+var log = (msg) => console.log(`${c.cyan}\u25B8${c.reset} ${msg}`);
+var ok = (msg) => console.log(`${c.green}\u2714${c.reset} ${msg}`);
+var warn = (msg) => console.warn(`${c.yellow}\u26A0${c.reset} ${msg}`);
+var error = (msg) => console.error(`${c.red}\u2716${c.reset} ${msg}`);
+var getTargetProjectDir = () => process.cwd();
+var ask = (question) => {
+  const rl = import_readline.default.createInterface({ input: process.stdin, output: process.stdout });
+  return new Promise((resolve) => {
+    rl.question(`${c.cyan}?${c.reset} ${question} `, (answer) => {
+      rl.close();
+      resolve(answer.trim());
+    });
+  });
+};
+var confirm = async (question, defaultYes = true) => {
+  const hint = defaultYes ? "Y/n" : "y/N";
+  const answer = await ask(`${question} ${c.dim}(${hint})${c.reset}`);
+  if (!answer) return defaultYes;
+  return answer.toLowerCase().startsWith("y");
+};
+var validateRegistry = (data) => {
+  if (!data || typeof data !== "object") return false;
+  const reg = data;
+  return "components" in reg && typeof reg.components === "object" && reg.components !== null;
+};
+var getRegistry = async (isLocal) => {
+  if (isLocal && import_fs.default.existsSync(REGISTRY_LOCAL)) {
+    log("Using local registry...");
+    try {
+      const data = JSON.parse(import_fs.default.readFileSync(REGISTRY_LOCAL, "utf-8"));
+      if (!validateRegistry(data)) {
+        error('Invalid local registry format \u2014 missing "components" field.');
+        process.exit(1);
+      }
+      return data;
+    } catch (err) {
+      error(`Failed to parse local registry: ${err instanceof Error ? err.message : err}`);
+      process.exit(1);
+    }
+  }
+  log("Fetching registry from remote...");
+  try {
+    const response = await fetch(REGISTRY_REMOTE);
+    if (!response.ok) throw new Error(`HTTP ${response.status}`);
+    const data = await response.json();
+    if (!validateRegistry(data)) {
+      error('Invalid remote registry format \u2014 missing "components" field.');
+      process.exit(1);
+    }
+    return data;
+  } catch (err) {
+    const message = err instanceof Error ? err.message : String(err);
+    error(`Cannot fetch registry: ${message}`);
+    process.exit(1);
+  }
+};
+var installNpmPackages = (packages, cwd, dev = false) => {
+  if (packages.length === 0) return;
+  const pkgJsonPath = import_path.default.join(cwd, "package.json");
+  let toInstall = packages;
+  if (import_fs.default.existsSync(pkgJsonPath)) {
+    const pkg = JSON.parse(import_fs.default.readFileSync(pkgJsonPath, "utf-8"));
+    const allDeps = { ...pkg.dependencies, ...pkg.devDependencies };
+    toInstall = packages.filter((p) => !allDeps[p]);
+  }
+  if (toInstall.length === 0) return;
+  log(`Installing: ${c.bold}${toInstall.join(", ")}${c.reset}...`);
+  const flag = dev ? "--save-dev" : "--save";
+  try {
+    (0, import_child_process.execSync)(`npm install ${toInstall.join(" ")} ${flag}`, { stdio: "inherit", cwd });
+  } catch (err) {
+    error(`Failed to install packages: ${toInstall.join(", ")}. ${err instanceof Error ? err.message : ""}`);
+  }
+};
+var VITE_DEV_PACKAGES = [
+  "tailwindcss",
+  "@tailwindcss/vite",
+  "@vitejs/plugin-react",
+  "@types/node"
+];
+var RUNTIME_PACKAGES = [
+  "@base-ui/react",
+  "tailwind-variants",
+  "clsx",
+  "tailwind-merge",
+  "tailwindcss-animate",
+  "lucide-react"
+];
+var VITE_CONFIG_TEMPLATE = `import { defineConfig } from 'vite';
+import tailwindcss from '@tailwindcss/vite';
+import react from '@vitejs/plugin-react';
+import path from 'path';
+
+export default defineConfig({
+  plugins: [tailwindcss(), react()],
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, './src'),
+      '@lib': path.resolve(__dirname, './src/lib'),
+      '@components': path.resolve(__dirname, './src/components'),
+      '@assets': path.resolve(__dirname, './src/assets'),
+      '@pages': path.resolve(__dirname, './src/pages'),
+      '@styles': path.resolve(__dirname, './src/styles'),
+    },
+  },
+});
+`;
+var TSCONFIG_PATHS = {
+  "@/*": ["./src/*"],
+  "@lib/*": ["./src/lib/*"],
+  "@components/*": ["./src/components/*"],
+  "@assets/*": ["./src/assets/*"],
+  "@pages/*": ["./src/pages/*"],
+  "@styles/*": ["./src/styles/*"]
+};
+var setupViteConfig = (cwd) => {
+  installNpmPackages(VITE_DEV_PACKAGES, cwd, true);
+  const configTs = import_path.default.join(cwd, "vite.config.ts");
+  const configJs = import_path.default.join(cwd, "vite.config.js");
+  if (!import_fs.default.existsSync(configTs) && !import_fs.default.existsSync(configJs)) {
+    import_fs.default.writeFileSync(configTs, VITE_CONFIG_TEMPLATE);
+    ok("Created vite.config.ts.");
+    return;
+  }
+  const existingPath = import_fs.default.existsSync(configTs) ? configTs : configJs;
+  let content = import_fs.default.readFileSync(existingPath, "utf-8");
+  const missingImports = [];
+  if (!content.includes("@tailwindcss/vite")) missingImports.push("import tailwindcss from '@tailwindcss/vite';");
+  if (!content.includes("@vitejs/plugin-react")) missingImports.push("import react from '@vitejs/plugin-react';");
+  if (!content.includes("from 'path'") && !content.includes('from "path"')) missingImports.push("import path from 'path';");
+  const missingPlugins = [];
+  if (!content.includes("tailwindcss()")) missingPlugins.push("tailwindcss()");
+  if (!content.includes("react()") && !content.includes("react({")) missingPlugins.push("react()");
+  const hasAlias = content.includes("alias:") || content.includes("'@'") || content.includes('"@"');
+  if (missingImports.length === 0 && missingPlugins.length === 0 && hasAlias) {
+    ok("vite.config already configured \u2014 skipping.");
+    return;
+  }
+  if (missingImports.length > 0) {
+    const importBlock = missingImports.join("\n");
+    const allImports = [...content.matchAll(/^import\s.+$/gm)];
+    if (allImports.length > 0) {
+      const last = allImports[allImports.length - 1];
+      const pos = last.index + last[0].length;
+      content = content.slice(0, pos) + "\n" + importBlock + content.slice(pos);
+    } else {
+      content = importBlock + "\n" + content;
+    }
+  }
+  if (missingPlugins.length > 0) {
+    const match = content.match(/plugins:\s*\[/);
+    if (match && match.index !== void 0) {
+      const pos = match.index + match[0].length;
+      const after = content.slice(pos);
+      const pluginLines = missingPlugins.map((p) => `
+      ${p},`).join("");
+      const needsNewline = after.length > 0 && after[0] !== "\n" && after[0] !== "\r";
+      content = content.slice(0, pos) + pluginLines + (needsNewline ? "\n      " : "") + after;
+    }
+  }
+  if (!hasAlias) {
+    const aliasBlock = [
+      "  resolve: {",
+      "    alias: {",
+      "      '@': path.resolve(__dirname, './src'),",
+      "      '@lib': path.resolve(__dirname, './src/lib'),",
+      "      '@components': path.resolve(__dirname, './src/components'),",
+      "      '@assets': path.resolve(__dirname, './src/assets'),",
+      "      '@pages': path.resolve(__dirname, './src/pages'),",
+      "      '@styles': path.resolve(__dirname, './src/styles'),",
+      "    },",
+      "  },"
+    ].join("\n");
+    const pluginsStart = content.search(/plugins:\s*\[/);
+    if (pluginsStart !== -1) {
+      let depth = 0;
+      let foundStart = false;
+      for (let i = pluginsStart; i < content.length; i++) {
+        if (content[i] === "[") {
+          depth++;
+          foundStart = true;
+        }
+        if (content[i] === "]") depth--;
+        if (foundStart && depth === 0) {
+          let lineEnd = content.indexOf("\n", i);
+          if (lineEnd === -1) lineEnd = content.length;
+          content = content.slice(0, lineEnd + 1) + aliasBlock + "\n" + content.slice(lineEnd + 1);
+          break;
+        }
+      }
+    }
+  }
+  import_fs.default.writeFileSync(existingPath, content);
+  ok(`Updated ${import_path.default.basename(existingPath)} with Tailwind + path aliases.`);
+};
+var setupTsConfig = (cwd) => {
+  const candidates = ["tsconfig.app.json", "tsconfig.json"];
+  for (const candidate of candidates) {
+    const configPath = import_path.default.join(cwd, candidate);
+    if (!import_fs.default.existsSync(configPath)) continue;
+    const raw = import_fs.default.readFileSync(configPath, "utf-8");
+    if (raw.includes('"@/*"') || raw.includes("'@/*'")) {
+      ok(`${candidate} already has path aliases \u2014 skipping.`);
+      return;
+    }
+    try {
+      const stripped = raw.replace(/\/\*[\s\S]*?\*\//g, "").replace(/(^|[\s,{[\]])\/\/[^\n]*/g, "$1");
+      const parsed = JSON.parse(stripped);
+      if (!parsed.compilerOptions) parsed.compilerOptions = {};
+      parsed.compilerOptions.baseUrl = ".";
+      parsed.compilerOptions.paths = TSCONFIG_PATHS;
+      import_fs.default.writeFileSync(configPath, JSON.stringify(parsed, null, 2));
+      ok(`Added path aliases to ${candidate}.`);
+    } catch (err) {
+      warn(`Could not auto-patch ${candidate}: ${err instanceof Error ? err.message : err}`);
+      warn("Add these to compilerOptions manually:");
+      console.log('\n  "baseUrl": ".",');
+      console.log('  "paths": {');
+      for (const [alias, targets] of Object.entries(TSCONFIG_PATHS)) {
+        console.log(`    "${alias}": ["${targets[0]}"],`);
+      }
+      console.log("  }");
+      console.log("");
+    }
+    return;
+  }
+  const newConfig = { compilerOptions: { baseUrl: ".", paths: TSCONFIG_PATHS } };
+  import_fs.default.writeFileSync(import_path.default.join(cwd, "tsconfig.json"), JSON.stringify(newConfig, null, 2));
+  ok("Created tsconfig.json with path aliases.");
+};
+var ensureCore = (registry, cwd, options = {}) => {
+  const core = registry.core;
+  if (!core) return;
+  installNpmPackages(core.dependencies, cwd);
+  for (const file of core.files) {
+    const targetPath = import_path.default.join(cwd, file.path);
+    const targetDir = import_path.default.dirname(targetPath);
+    if (!import_fs.default.existsSync(targetDir)) import_fs.default.mkdirSync(targetDir, { recursive: true });
+    if (import_fs.default.existsSync(targetPath) && !options.force) {
+      log(`Core file exists (skipping): ${c.dim}${file.path}${c.reset}`);
+      continue;
+    }
+    import_fs.default.writeFileSync(targetPath, file.content);
+    ok(`${import_fs.default.existsSync(targetPath) ? "Updated" : "Created"} core file: ${file.path}`);
+  }
+};
+var MAIN_PATCH_COMPONENTS = {
+  toast: {
+    import: "import { Toaster } from '@/components/ui/toast/Toaster';",
+    jsx: '<Toaster position="top-center" expand={true} richColors />'
+  }
+};
+var MAIN_CANDIDATES = ["src/main.tsx", "src/main.jsx", "src/index.tsx", "src/index.jsx"];
+var findMainFile = (cwd) => {
+  for (const c2 of MAIN_CANDIDATES) {
+    const p = import_path.default.join(cwd, c2);
+    if (import_fs.default.existsSync(p)) return p;
+  }
+  return null;
+};
+var insertImport = (content, importLine) => {
+  if (content.includes(importLine)) return content;
+  const allImports = [...content.matchAll(/^import\s.+$/gm)];
+  if (allImports.length > 0) {
+    const last = allImports[allImports.length - 1];
+    const pos = last.index + last[0].length;
+    return content.slice(0, pos) + "\n" + importLine + content.slice(pos);
+  }
+  return importLine + "\n" + content;
+};
+var patchMainTsx = (cwd) => {
+  const mainPath = findMainFile(cwd);
+  if (!mainPath) {
+    warn("Could not find entry file (src/main.tsx). Skipping main entry setup.");
+    return;
+  }
+  let content = import_fs.default.readFileSync(mainPath, "utf-8");
+  let changed = false;
+  const cssImportLine = "import './styles/index.css';";
+  const hasCssImport = content.includes("styles/index.css") || content.includes("index.css");
+  if (!hasCssImport) {
+    const firstImport = content.match(/^import\s/m);
+    if (firstImport?.index !== void 0) {
+      content = content.slice(0, firstImport.index) + cssImportLine + "\n" + content.slice(firstImport.index);
+    } else {
+      content = cssImportLine + "\n" + content;
+    }
+    changed = true;
+  } else if (!content.includes("styles/index.css")) {
+    content = insertImport(content, cssImportLine);
+    changed = true;
+  }
+  if (!content.includes("ThemeProvider")) {
+    content = insertImport(content, "import { ThemeProvider } from '@/lib/theme/ThemeProvider';");
+    const wrapped = content.replace(/(<App\s*\/>)/g, "<ThemeProvider>\n      $1\n    </ThemeProvider>");
+    if (wrapped === content) {
+      warn("Could not locate <App /> in entry file \u2014 add <ThemeProvider> wrapper manually.");
+    } else {
+      content = wrapped;
+    }
+    changed = true;
+  }
+  if (changed) {
+    import_fs.default.writeFileSync(mainPath, content);
+    ok(`Patched ${import_path.default.relative(cwd, mainPath)}.`);
+  } else {
+    ok(`${import_path.default.relative(cwd, mainPath)} already configured \u2014 skipping.`);
+  }
+};
+var patchMainTsxComponent = (cwd, componentName) => {
+  const patch = MAIN_PATCH_COMPONENTS[componentName];
+  if (!patch) return;
+  const mainPath = findMainFile(cwd);
+  if (!mainPath) return;
+  let content = import_fs.default.readFileSync(mainPath, "utf-8");
+  const tagName = patch.jsx.match(/<(\w+)/)?.[1];
+  if (tagName && content.includes(`<${tagName}`)) return;
+  content = insertImport(content, patch.import);
+  const withProvider = content.replace(
+    /(<App\s*\/>)(\s*\n\s*<\/ThemeProvider>)/,
+    `$1
+      ${patch.jsx}$2`
+  );
+  if (withProvider !== content) {
+    import_fs.default.writeFileSync(mainPath, withProvider);
+  } else {
+    const fallback = content.replace(/(<App\s*\/>)/, `$1
+      ${patch.jsx}`);
+    if (fallback !== content) import_fs.default.writeFileSync(mainPath, fallback);
+  }
+  ok(`Added <${tagName}> to ${import_path.default.relative(cwd, mainPath)}.`);
+};
+var addComponent = (name, registry, cwd, options, added = /* @__PURE__ */ new Set()) => {
+  if (added.has(name)) return;
+  added.add(name);
+  const component = registry.components[name];
+  if (!component) {
+    error(`Component "${name}" not found. Run '${c.cyan}basuicn list${c.reset}' to see available components.`);
+    return;
+  }
+  log(`Adding: ${c.bold}${name}${c.reset}...`);
+  ensureCore(registry, cwd);
+  installNpmPackages(component.dependencies, cwd);
+  if (component.internalDependencies) {
+    for (const dep of component.internalDependencies) {
+      if (registry.components[dep]) {
+        addComponent(dep, registry, cwd, options, added);
+      }
+    }
+  }
+  for (const file of component.files) {
+    const targetPath = import_path.default.join(cwd, file.path);
+    const targetDir = import_path.default.dirname(targetPath);
+    if (!import_fs.default.existsSync(targetDir)) import_fs.default.mkdirSync(targetDir, { recursive: true });
+    if (import_fs.default.existsSync(targetPath) && !options.force) {
+      warn(`Skipped (exists): ${file.path} \u2014 use ${c.cyan}--force${c.reset} to overwrite`);
+      continue;
+    }
+    import_fs.default.writeFileSync(targetPath, file.content);
+    ok(`Created: ${file.path}`);
+  }
+};
+var removeComponent = (name, registry, cwd) => {
+  const component = registry.components[name];
+  if (!component) {
+    error(`Component "${name}" not found.`);
+    return;
+  }
+  log(`Removing: ${c.bold}${name}${c.reset}...`);
+  for (const file of component.files) {
+    const targetPath = import_path.default.join(cwd, file.path);
+    if (import_fs.default.existsSync(targetPath)) {
+      import_fs.default.unlinkSync(targetPath);
+      ok(`Deleted: ${file.path}`);
+    }
+  }
+  for (const file of component.files) {
+    const targetDir = import_path.default.dirname(import_path.default.join(cwd, file.path));
+    try {
+      if (import_fs.default.existsSync(targetDir) && import_fs.default.readdirSync(targetDir).length === 0) {
+        import_fs.default.rmdirSync(targetDir);
+        ok(`Removed empty dir: ${import_path.default.relative(cwd, targetDir)}`);
+      }
+    } catch (err) {
+      warn(`Could not remove directory: ${err instanceof Error ? err.message : err}`);
+    }
+  }
+};
+var HELP_MAIN = `
+${c.bold}${c.cyan}basuicn${c.reset} ${c.dim}v${VERSION}${c.reset} \u2014 Modern React UI Component CLI
+
+${c.bold}USAGE${c.reset}
+  ${c.cyan}npx basuicn${c.reset} ${c.green}<command>${c.reset} ${c.dim}[options]${c.reset}
+
+${c.bold}COMMANDS${c.reset}
+  ${c.green}init${c.reset}                       Initialize project: install deps, copy core files, patch entry
+  ${c.green}add${c.reset} ${c.dim}<name...>${c.reset}             Add component(s) to your project
+  ${c.green}update${c.reset} ${c.dim}<name...>${c.reset}          Update component(s) to latest registry version
+  ${c.green}diff${c.reset} ${c.dim}<name...>${c.reset}            Show diff between local and registry version
+  ${c.green}remove${c.reset} ${c.dim}<name...>${c.reset}          Remove component(s) from your project
+  ${c.green}list${c.reset}                       List all available components
+  ${c.green}doctor${c.reset}                     Check project health and configuration
+
+${c.bold}OPTIONS${c.reset}
+  ${c.cyan}--force${c.reset}                    Overwrite existing files when adding/updating
+  ${c.cyan}--local${c.reset}                    Use local registry.json instead of remote
+  ${c.cyan}--help, -h${c.reset}                 Show help (use with a command for detailed help)
+  ${c.cyan}--version, -v${c.reset}              Show version
+
+${c.bold}QUICK START${c.reset}
+  ${c.dim}$${c.reset} npx basuicn init
+  ${c.dim}$${c.reset} npx basuicn add button input card
+  ${c.dim}$${c.reset} npx basuicn add toast
+
+${c.bold}EXAMPLES${c.reset}
+  ${c.dim}$${c.reset} npx basuicn add dialog --force   ${c.dim}# Overwrite existing dialog${c.reset}
+  ${c.dim}$${c.reset} npx basuicn diff button           ${c.dim}# See what changed since last update${c.reset}
+  ${c.dim}$${c.reset} npx basuicn doctor                ${c.dim}# Diagnose missing deps/config${c.reset}
+
+${c.dim}Documentation: https://github.com/Basuicn/basuicn-core${c.reset}
+`;
+var HELP_COMMANDS = {
+  init: `
+${c.bold}basuicn init${c.reset}
+
+  Initialize your project for basuicn components.
+
+  ${c.bold}What it does:${c.reset}
+    1. Installs runtime dependencies (@base-ui/react, tailwind-variants, etc.)
+    2. Sets up vite.config.ts with Tailwind CSS + path aliases
+    3. Patches tsconfig.json with path aliases (@/*, @lib/*, etc.)
+    4. Copies core files (cn.ts, themes.ts, ThemeProvider.tsx, index.css)
+    5. Wraps your <App /> with <ThemeProvider> in the main entry
+
+  ${c.bold}Usage:${c.reset}
+    ${c.dim}$${c.reset} npx basuicn init
+    ${c.dim}$${c.reset} npx basuicn init --local   ${c.dim}# Use local registry${c.reset}
+`,
+  add: `
+${c.bold}basuicn add${c.reset} ${c.dim}<name...>${c.reset}
+
+  Add one or more components to your project.
+
+  ${c.bold}Options:${c.reset}
+    ${c.cyan}--force${c.reset}    Overwrite existing component files
+
+  ${c.bold}Features:${c.reset}
+    \u2022 Auto-runs init if project hasn't been set up
+    \u2022 Resolves internal dependencies (e.g., dialog depends on button)
+    \u2022 Installs required npm packages automatically
+    \u2022 Patches main entry for components that need it (e.g., toast)
+
+  ${c.bold}Usage:${c.reset}
+    ${c.dim}$${c.reset} npx basuicn add button
+    ${c.dim}$${c.reset} npx basuicn add button input card dialog
+    ${c.dim}$${c.reset} npx basuicn add toast --force
+
+  ${c.bold}Interactive:${c.reset}
+    ${c.dim}$${c.reset} npx basuicn add           ${c.dim}# Prompts to select components${c.reset}
+`,
+  update: `
+${c.bold}basuicn update${c.reset} ${c.dim}<name...>${c.reset}
+
+  Update component(s) to the latest registry version.
+  Equivalent to ${c.cyan}add --force${c.reset}.
+
+  ${c.bold}Usage:${c.reset}
+    ${c.dim}$${c.reset} npx basuicn update button
+    ${c.dim}$${c.reset} npx basuicn update button card dialog
+`,
+  remove: `
+${c.bold}basuicn remove${c.reset} ${c.dim}<name...>${c.reset}
+
+  Remove component(s) from your project.
+  Deletes component files and cleans up empty directories.
+
+  ${c.bold}Usage:${c.reset}
+    ${c.dim}$${c.reset} npx basuicn remove button
+    ${c.dim}$${c.reset} npx basuicn remove dialog drawer sheet
+`,
+  diff: `
+${c.bold}basuicn diff${c.reset} ${c.dim}<name...>${c.reset}
+
+  Show differences between your local component files and the registry version.
+  Useful to see what has changed before running update.
+
+  ${c.bold}Usage:${c.reset}
+    ${c.dim}$${c.reset} npx basuicn diff button
+    ${c.dim}$${c.reset} npx basuicn diff button card
+`,
+  list: `
+${c.bold}basuicn list${c.reset}
+
+  Show all available components in the registry.
+  Displays internal dependencies for each component.
+
+  ${c.bold}Usage:${c.reset}
+    ${c.dim}$${c.reset} npx basuicn list
+`,
+  doctor: `
+${c.bold}basuicn doctor${c.reset}
+
+  Run a health check on your project configuration.
+
+  ${c.bold}Checks:${c.reset}
+    \u2022 Core files exist (cn.ts, themes.ts, ThemeProvider.tsx, index.css)
+    \u2022 ThemeProvider + CSS import in main entry
+    \u2022 Runtime packages installed
+    \u2022 Dev packages installed
+    \u2022 Tailwind CSS configured
+    \u2022 TypeScript path aliases
+    \u2022 Vite config present
+
+  ${c.bold}Usage:${c.reset}
+    ${c.dim}$${c.reset} npx basuicn doctor
+`
+};
+var main = async () => {
+  const args = process.argv.slice(2);
+  if (args.includes("--version") || args.includes("-v")) {
+    console.log(`basuicn v${VERSION}`);
+    return;
+  }
+  const isLocal = args.includes("--local");
+  const isForce = args.includes("--force");
+  const isHelp = args.includes("--help") || args.includes("-h");
+  const filteredArgs = args.filter((a) => !a.startsWith("--") && a !== "-h" && a !== "-v");
+  const command = filteredArgs[0];
+  const componentNames = filteredArgs.slice(1);
+  if (isHelp && command && HELP_COMMANDS[command]) {
+    console.log(HELP_COMMANDS[command]);
+    return;
+  }
+  if (isHelp || !command) {
+    console.log(HELP_MAIN);
+    return;
+  }
+  const cwd = getTargetProjectDir();
+  const registry = await getRegistry(isLocal);
+  switch (command) {
+    case "init": {
+      log("Initializing project...");
+      setupViteConfig(cwd);
+      setupTsConfig(cwd);
+      installNpmPackages(RUNTIME_PACKAGES, cwd);
+      ensureCore(registry, cwd, { force: true });
+      patchMainTsx(cwd);
+      console.log("");
+      ok(`${c.bold}Initialization complete!${c.reset} Run ${c.cyan}npx basuicn add <component>${c.reset} to get started.`);
+      break;
+    }
+    case "add": {
+      let names = componentNames;
+      if (names.length === 0) {
+        const all = Object.keys(registry.components).sort();
+        console.log(`
+${c.bold}Available components (${all.length}):${c.reset}`);
+        const categories = {};
+        for (const name of all) {
+          const prefix = name.includes("-") ? name.split("-")[0] : "general";
+          if (!categories[prefix]) categories[prefix] = [];
+          categories[prefix].push(name);
+        }
+        const cols = 4;
+        for (let i = 0; i < all.length; i += cols) {
+          const row = all.slice(i, i + cols).map((n) => n.padEnd(20)).join("");
+          console.log(`  ${c.dim}${row}${c.reset}`);
+        }
+        console.log("");
+        const answer = await ask(`Which components to add? ${c.dim}(space-separated, or "all")${c.reset}`);
+        if (!answer) {
+          log("No components selected.");
+          return;
+        }
+        names = answer === "all" ? all : answer.split(/[\s,]+/).filter(Boolean);
+      }
+      const cnPath = import_path.default.join(cwd, "src/lib/utils/cn.ts");
+      if (!import_fs.default.existsSync(cnPath)) {
+        log("Project not initialized \u2014 running init first...");
+        setupViteConfig(cwd);
+        setupTsConfig(cwd);
+        installNpmPackages(RUNTIME_PACKAGES, cwd);
+        ensureCore(registry, cwd, { force: true });
+        patchMainTsx(cwd);
+        console.log("");
+      }
+      for (const name of names) {
+        addComponent(name, registry, cwd, { force: isForce });
+        patchMainTsxComponent(cwd, name);
+      }
+      console.log("");
+      ok(`${c.bold}Done!${c.reset} Added ${names.length} component(s).`);
+      break;
+    }
+    case "update": {
+      if (componentNames.length === 0) {
+        error(`Usage: ${c.cyan}npx basuicn update <component-name> [...]${c.reset}`);
+        console.log(`  Run ${c.cyan}npx basuicn update --help${c.reset} for details.`);
+        return;
+      }
+      for (const name of componentNames) {
+        log(`Updating: ${c.bold}${name}${c.reset}...`);
+        addComponent(name, registry, cwd, { force: true });
+      }
+      console.log("");
+      ok(`${c.bold}Update complete.${c.reset}`);
+      break;
+    }
+    case "remove": {
+      if (componentNames.length === 0) {
+        error(`Usage: ${c.cyan}npx basuicn remove <component-name>${c.reset}`);
+        return;
+      }
+      if (!isForce) {
+        const yes = await confirm(`Remove ${componentNames.join(", ")}?`);
+        if (!yes) {
+          log("Cancelled.");
+          return;
+        }
+      }
+      for (const name of componentNames) {
+        removeComponent(name, registry, cwd);
+      }
+      console.log("");
+      ok(`${c.bold}Done!${c.reset}`);
+      break;
+    }
+    case "list": {
+      const components = Object.keys(registry.components).sort();
+      console.log(`
+${c.bold}Available components (${components.length}):${c.reset}
+`);
+      const installed = [];
+      const available = [];
+      for (const k of components) {
+        const comp = registry.components[k];
+        const firstFile = comp.files[0];
+        const isInstalled = firstFile && import_fs.default.existsSync(import_path.default.join(cwd, firstFile.path));
+        if (isInstalled) installed.push(k);
+        else available.push(k);
+      }
+      if (installed.length > 0) {
+        console.log(`  ${c.green}Installed (${installed.length}):${c.reset}`);
+        for (const k of installed) {
+          const deps = registry.components[k].internalDependencies?.filter(Boolean);
+          const depStr = deps?.length ? ` ${c.dim}\u2192 ${deps.join(", ")}${c.reset}` : "";
+          console.log(`    ${c.green}\u25CF${c.reset} ${k}${depStr}`);
+        }
+        console.log("");
+      }
+      if (available.length > 0) {
+        console.log(`  ${c.dim}Available (${available.length}):${c.reset}`);
+        for (const k of available) {
+          const deps = registry.components[k].internalDependencies?.filter(Boolean);
+          const depStr = deps?.length ? ` ${c.dim}\u2192 ${deps.join(", ")}${c.reset}` : "";
+          console.log(`    ${c.dim}\u25CB${c.reset} ${k}${depStr}`);
+        }
+      }
+      console.log("");
+      break;
+    }
+    case "diff": {
+      if (componentNames.length === 0) {
+        error(`Usage: ${c.cyan}npx basuicn diff <component-name>${c.reset}`);
+        return;
+      }
+      for (const name of componentNames) {
+        const component = registry.components[name];
+        if (!component) {
+          error(`Component "${name}" not found.`);
+          continue;
+        }
+        let hasDiff = false;
+        console.log(`
+${c.bold}[diff] ${name}${c.reset}`);
+        for (const file of component.files) {
+          const targetPath = import_path.default.join(cwd, file.path);
+          if (!import_fs.default.existsSync(targetPath)) {
+            console.log(`  ${c.green}+ [new file]${c.reset} ${file.path}`);
+            hasDiff = true;
+            continue;
+          }
+          const localContent = import_fs.default.readFileSync(targetPath, "utf-8");
+          if (localContent === file.content) continue;
+          hasDiff = true;
+          console.log(`
+  ${c.yellow}~${c.reset} ${file.path}`);
+          const localLines = localContent.split("\n");
+          const remoteLines = file.content.split("\n");
+          const maxLen = Math.max(localLines.length, remoteLines.length);
+          let shownLines = 0;
+          for (let i = 0; i < maxLen; i++) {
+            if (localLines[i] !== remoteLines[i]) {
+              if (localLines[i] !== void 0) console.log(`    ${c.red}- ${localLines[i]}${c.reset}`);
+              if (remoteLines[i] !== void 0) console.log(`    ${c.green}+ ${remoteLines[i]}${c.reset}`);
+              shownLines++;
+              if (shownLines >= 20) {
+                const remaining = maxLen - i - 1;
+                if (remaining > 0) console.log(`    ${c.dim}... and ${remaining} more lines${c.reset}`);
+                break;
+              }
+            }
+          }
+        }
+        if (!hasDiff) ok(`${name}: already up to date.`);
+      }
+      break;
+    }
+    case "doctor": {
+      console.log(`
+${c.bold}Project Health Check${c.reset}
+`);
+      let issues = 0;
+      const check = (passed, msg, fix) => {
+        console.log(`  ${passed ? `${c.green}\u2714${c.reset}` : `${c.red}\u2716${c.reset}`} ${msg}`);
+        if (!passed) {
+          if (fix) console.log(`    ${c.dim}\u2192 ${fix}${c.reset}`);
+          issues++;
+        }
+      };
+      check(
+        import_fs.default.existsSync(import_path.default.join(cwd, "src/lib/utils/cn.ts")),
+        "src/lib/utils/cn.ts",
+        "run: npx basuicn init"
+      );
+      check(
+        import_fs.default.existsSync(import_path.default.join(cwd, "src/lib/theme/themes.ts")),
+        "src/lib/theme/themes.ts",
+        "run: npx basuicn init"
+      );
+      check(
+        import_fs.default.existsSync(import_path.default.join(cwd, "src/lib/theme/ThemeProvider.tsx")),
+        "src/lib/theme/ThemeProvider.tsx",
+        "run: npx basuicn init"
+      );
+      check(
+        import_fs.default.existsSync(import_path.default.join(cwd, "src/styles/index.css")),
+        "src/styles/index.css (theme variables)",
+        "run: npx basuicn init"
+      );
+      const mainPath = findMainFile(cwd);
+      if (mainPath) {
+        const mainContent = import_fs.default.readFileSync(mainPath, "utf-8");
+        check(
+          mainContent.includes("ThemeProvider"),
+          "ThemeProvider in main entry",
+          "run: npx basuicn init"
+        );
+        check(
+          mainContent.includes("styles/index.css") || mainContent.includes("index.css"),
+          "CSS import in main entry",
+          "run: npx basuicn init"
+        );
+      } else {
+        check(false, "main entry file (src/main.tsx)", "create src/main.tsx");
+      }
+      const pkgPath = import_path.default.join(cwd, "package.json");
+      if (import_fs.default.existsSync(pkgPath)) {
+        const pkg = JSON.parse(import_fs.default.readFileSync(pkgPath, "utf-8"));
+        const allDeps = { ...pkg.dependencies, ...pkg.devDependencies };
+        for (const dep of RUNTIME_PACKAGES) {
+          check(!!allDeps[dep], `package: ${dep}`, `run: npm install ${dep}`);
+        }
+        for (const dep of VITE_DEV_PACKAGES) {
+          check(!!allDeps[dep], `package (dev): ${dep}`, `run: npm install -D ${dep}`);
+        }
+      } else {
+        check(false, "package.json found", "run: npm init -y");
+      }
+      const hasTailwindInCss = (() => {
+        const candidates = ["src/styles/index.css", "src/index.css", "src/App.css"];
+        return candidates.some((f) => {
+          const p = import_path.default.join(cwd, f);
+          if (!import_fs.default.existsSync(p)) return false;
+          const content = import_fs.default.readFileSync(p, "utf-8");
+          return content.includes('@import "tailwindcss"') || content.includes("@import 'tailwindcss'");
+        });
+      })();
+      check(hasTailwindInCss, '@import "tailwindcss" in CSS', "run: npx basuicn init");
+      const tsCandidates = ["tsconfig.app.json", "tsconfig.json"];
+      const hasAlias = tsCandidates.some((f) => {
+        const p = import_path.default.join(cwd, f);
+        if (!import_fs.default.existsSync(p)) return false;
+        const content = import_fs.default.readFileSync(p, "utf-8");
+        return content.includes('"@/*"') || content.includes("'@/*'");
+      });
+      check(hasAlias, "TypeScript path aliases (@/*)", "run: npx basuicn init");
+      const hasViteConfig = import_fs.default.existsSync(import_path.default.join(cwd, "vite.config.ts")) || import_fs.default.existsSync(import_path.default.join(cwd, "vite.config.js"));
+      check(hasViteConfig, "vite.config.ts / vite.config.js", "run: npx basuicn init");
+      console.log("");
+      if (issues === 0) {
+        ok(`${c.bold}All checks passed!${c.reset} Project is healthy.`);
+      } else {
+        warn(`${c.bold}${issues} issue(s) found.${c.reset} Run ${c.cyan}npx basuicn init${c.reset} to fix most issues.`);
+      }
+      break;
+    }
+    default: {
+      error(`Unknown command: "${command}"`);
+      console.log(`  Run ${c.cyan}npx basuicn --help${c.reset} to see available commands.
+`);
+    }
+  }
+};
+main();

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "basuicn",
   "private": false,
-  "version": "0.1.6",
+  "version": "0.1.7",
   "type": "module",
   "bin": {
     "basuicn": "./dist/ui-cli.cjs"
@@ -15,7 +15,7 @@
   "scripts": {
     "dev": "vite",
     "build": "tsc -b && vite build",
-    "build:cli": "npx -y esbuild scripts/ui-cli.ts --bundle --platform=node --outfile=dist/ui-cli.cjs --format=cjs --packages=external",
+    "build:cli": "node scripts/build-cli.mjs",
     "lint": "eslint .",
     "preview": "vite preview",
     "test": "vitest",

package/scripts/build-cli.mjs

@@ -0,0 +1,13 @@
+import { build } from 'esbuild';
+
+await build({
+  entryPoints: ['scripts/ui-cli.ts'],
+  bundle: true,
+  platform: 'node',
+  outfile: 'dist/ui-cli.cjs',
+  format: 'cjs',
+  packages: 'external',
+  banner: { js: '#!/usr/bin/env node' },
+});
+
+console.log('✔ CLI built → dist/ui-cli.cjs');

package/scripts/ui-cli.ts

@@ -6,7 +6,7 @@ import readline from 'readline';
 
 // ─── Constants ────────────────────────────────────────────────────────────────
 
-const VERSION = '0.1.6';
+const VERSION = '0.1.7';
 const REGISTRY_LOCAL = './registry.json';
 const REGISTRY_REMOTE = 'https://raw.githubusercontent.com/Basuicn/basuicn-core/main/registry.json';