@metacells/mcellui-cli 0.1.3 → 0.1.5

package/dist/index.js

@@ -116,8 +116,8 @@ function validateConfig(config) {
     return { success: true, data: result.data };
   }
   const errors = result.error.issues.map((issue) => {
-    const path10 = issue.path.join(".");
-    return path10 ? `${path10}: ${issue.message}` : issue.message;
+    const path12 = issue.path.join(".");
+    return path12 ? `${path12}: ${issue.message}` : issue.message;
   });
   return { success: false, errors };
 }
@@ -212,27 +212,38 @@ async function detectProjectType(projectRoot) {
     return "unknown";
   }
 }
+var CONFIG_FILES = [
+  "mcellui.config.ts",
+  "mcellui.config.js",
+  "mcellui.config.json",
+  "nativeui.config.ts",
+  // Legacy
+  "nativeui.config.js",
+  // Legacy
+  "nativeui.config.json"
+  // Legacy
+];
 async function getConfig(projectRoot) {
-  const tsConfigPath = path.join(projectRoot, "nativeui.config.ts");
-  if (await fs.pathExists(tsConfigPath)) {
-    return loadTsConfig(tsConfigPath);
-  }
-  const jsConfigPath = path.join(projectRoot, "nativeui.config.js");
-  if (await fs.pathExists(jsConfigPath)) {
-    return loadJsConfig(jsConfigPath);
-  }
-  const jsonConfigPath = path.join(projectRoot, "nativeui.config.json");
-  if (await fs.pathExists(jsonConfigPath)) {
-    try {
-      const rawConfig = await fs.readJson(jsonConfigPath);
-      const validatedConfig = validateConfigOrThrow(rawConfig, jsonConfigPath);
-      return resolveConfig(validatedConfig);
-    } catch (error) {
-      if (error instanceof Error && error.message.includes("Invalid configuration")) {
-        console.error(chalk.red(error.message));
-        throw error;
+  for (const fileName of CONFIG_FILES) {
+    const configPath = path.join(projectRoot, fileName);
+    if (await fs.pathExists(configPath)) {
+      if (fileName.endsWith(".ts")) {
+        return loadTsConfig(configPath);
+      } else if (fileName.endsWith(".js")) {
+        return loadJsConfig(configPath);
+      } else if (fileName.endsWith(".json")) {
+        try {
+          const rawConfig = await fs.readJson(configPath);
+          const validatedConfig = validateConfigOrThrow(rawConfig, configPath);
+          return resolveConfig(validatedConfig);
+        } catch (error) {
+          if (error instanceof Error && error.message.includes("Invalid configuration")) {
+            console.error(chalk.red(error.message));
+            throw error;
+          }
+          throw error;
+        }
       }
-      throw error;
     }
   }
   return null;
@@ -294,7 +305,7 @@ async function detectPackageManager(projectRoot) {
 }
 
 // src/commands/init.ts
-var initCommand = new Command().name("init").description("Initialize nativeui in your project").option("-y, --yes", "Skip prompts and use defaults").option("--cwd <path>", "Working directory", process.cwd()).action(async (options) => {
+var initCommand = new Command().name("init").description("Initialize mcellui in your project").option("-y, --yes", "Skip prompts and use defaults").option("--cwd <path>", "Working directory", process.cwd()).action(async (options) => {
   const spinner = ora();
   try {
     const cwd = path2.resolve(options.cwd);
@@ -305,17 +316,24 @@ var initCommand = new Command().name("init").description("Initialize nativeui in
       process.exit(1);
     }
     console.log();
-    console.log(chalk2.bold("Welcome to nativeui!"));
+    console.log(chalk2.bold("Welcome to mcellui!"));
     console.log(chalk2.dim("The copy-paste component library for Expo/React Native"));
     console.log();
     const projectType = await detectProjectType(projectRoot);
     console.log(chalk2.dim(`Detected: ${projectType}`));
-    const configPath = path2.join(projectRoot, "nativeui.config.ts");
+    const configPath = path2.join(projectRoot, "mcellui.config.ts");
+    const legacyConfigPath = path2.join(projectRoot, "nativeui.config.ts");
     if (await fs2.pathExists(configPath)) {
       console.log(chalk2.yellow("Project already initialized."));
       console.log(chalk2.dim(`Config found at: ${configPath}`));
       return;
     }
+    if (await fs2.pathExists(legacyConfigPath)) {
+      console.log(chalk2.yellow("Project already initialized with legacy config."));
+      console.log(chalk2.dim(`Config found at: ${legacyConfigPath}`));
+      console.log(chalk2.dim("Consider renaming to mcellui.config.ts"));
+      return;
+    }
     let config = {
       componentsPath: "./components/ui",
       utilsPath: "./lib/utils",
@@ -454,14 +472,14 @@ export function cn(...inputs: StyleInput[]): Style {
     );
     spinner.succeed("Utilities installed");
     console.log();
-    console.log(chalk2.green("Success!") + " nativeui initialized.");
+    console.log(chalk2.green("Success!") + " mcellui initialized.");
     console.log();
     console.log("Next steps:");
     console.log(chalk2.dim("  1."), "Add your first component:");
-    console.log(chalk2.cyan("     npx nativeui add button"));
+    console.log(chalk2.cyan("     npx mcellui add button"));
     console.log();
     console.log(chalk2.dim("  2."), "Browse available components:");
-    console.log(chalk2.cyan("     npx nativeui list"));
+    console.log(chalk2.cyan("     npx mcellui list"));
     console.log();
   } catch (error) {
     spinner.fail("Failed to initialize");
@@ -475,8 +493,8 @@ import { Command as Command2 } from "commander";
 import chalk3 from "chalk";
 import ora2 from "ora";
 import prompts2 from "prompts";
-import fs4 from "fs-extra";
-import path4 from "path";
+import fs5 from "fs-extra";
+import path5 from "path";
 
 // src/utils/registry.ts
 import fs3 from "fs-extra";
@@ -485,7 +503,8 @@ import { fileURLToPath as fileURLToPath2 } from "url";
 var __filename3 = fileURLToPath2(import.meta.url);
 var __dirname2 = path3.dirname(__filename3);
 var DEFAULT_REGISTRY_URL = "https://raw.githubusercontent.com/metacells-development/mcellui/main/packages/registry";
-var REGISTRY_URL = process.env.MCELLUI_REGISTRY_URL || process.env.NATIVEUI_REGISTRY_URL || DEFAULT_REGISTRY_URL;
+var hasEnvOverride = "MCELLUI_REGISTRY_URL" in process.env || "NATIVEUI_REGISTRY_URL" in process.env;
+var REGISTRY_URL = hasEnvOverride ? process.env.MCELLUI_REGISTRY_URL || process.env.NATIVEUI_REGISTRY_URL || "" : DEFAULT_REGISTRY_URL;
 function getLocalRegistryPath() {
   return path3.resolve(__dirname2, "..", "..", "registry");
 }
@@ -567,11 +586,172 @@ async function fetchRemoteComponent(item) {
   };
 }
 
+// src/utils/dependencies.ts
+function resolveDependencies(components, registry) {
+  const registryMap = /* @__PURE__ */ new Map();
+  for (const item of registry) {
+    registryMap.set(item.name, item);
+  }
+  const resolved = /* @__PURE__ */ new Set();
+  const resolving = /* @__PURE__ */ new Set();
+  const resolvedOrder = [];
+  function resolve(name, path12) {
+    if (resolved.has(name)) {
+      return null;
+    }
+    if (resolving.has(name)) {
+      return [...path12, name];
+    }
+    const item = registryMap.get(name);
+    if (!item) {
+      return null;
+    }
+    resolving.add(name);
+    const deps = item.registryDependencies || [];
+    for (const dep of deps) {
+      const circular = resolve(dep, [...path12, name]);
+      if (circular) {
+        return circular;
+      }
+    }
+    resolving.delete(name);
+    resolved.add(name);
+    resolvedOrder.push(name);
+    return null;
+  }
+  for (const name of components) {
+    const circular = resolve(name, []);
+    if (circular) {
+      return {
+        resolved: [],
+        circular
+      };
+    }
+  }
+  return {
+    resolved: resolvedOrder,
+    circular: null
+  };
+}
+function formatCircularError(chain) {
+  return chain.join(" \u2192 ");
+}
+
+// src/utils/installed.ts
+import fs4 from "fs-extra";
+import path4 from "path";
+
+// src/utils/imports.ts
+function transformToInstalled(code, config) {
+  if (!config) return code;
+  let result = code;
+  const utilsAlias = config.aliases?.utils || "@/lib/utils";
+  if (utilsAlias !== "@/lib/utils") {
+    result = result.replace(
+      /from ['"]@\/lib\/utils['"]/g,
+      `from '${utilsAlias}'`
+    );
+  }
+  return result;
+}
+function normalizeForComparison(content) {
+  return content.replace(/\r\n/g, "\n").replace(/\s+$/gm, "").trim();
+}
+
+// src/utils/installed.ts
+async function getInstalledFiles(componentsDir) {
+  if (!await fs4.pathExists(componentsDir)) {
+    return [];
+  }
+  const files = await fs4.readdir(componentsDir);
+  const componentFiles = [];
+  for (const file of files) {
+    if (file.endsWith(".tsx") || file.endsWith(".ts")) {
+      if (file === "index.ts" || file === "index.tsx") {
+        continue;
+      }
+      componentFiles.push(path4.join(componentsDir, file));
+    }
+  }
+  return componentFiles.sort();
+}
+async function getInstallStatus(installedFiles, registry, config) {
+  const results = [];
+  const registryMap = /* @__PURE__ */ new Map();
+  for (const item of registry) {
+    for (const file of item.files) {
+      const fileName = path4.basename(file);
+      registryMap.set(fileName, item);
+    }
+  }
+  for (const localFile of installedFiles) {
+    const fileName = path4.basename(localFile);
+    const componentName = fileName.replace(/\.tsx?$/, "");
+    const registryItem = registryMap.get(fileName);
+    if (!registryItem) {
+      results.push({
+        name: componentName,
+        fileName,
+        status: "local-only",
+        localPath: localFile
+      });
+      continue;
+    }
+    try {
+      const component = await fetchComponent(registryItem.name);
+      if (!component) {
+        results.push({
+          name: registryItem.name,
+          fileName,
+          status: "modified",
+          // Assume modified if we can't verify
+          localPath: localFile
+        });
+        continue;
+      }
+      const registryFile = component.files.find((f) => f.name === fileName);
+      if (!registryFile) {
+        results.push({
+          name: registryItem.name,
+          fileName,
+          status: "modified",
+          localPath: localFile
+        });
+        continue;
+      }
+      const localContent = await fs4.readFile(localFile, "utf-8");
+      const normalizedLocal = normalizeForComparison(localContent);
+      const normalizedRegistry = normalizeForComparison(registryFile.content);
+      results.push({
+        name: registryItem.name,
+        fileName,
+        status: normalizedLocal === normalizedRegistry ? "identical" : "modified",
+        localPath: localFile
+      });
+    } catch {
+      results.push({
+        name: registryItem.name,
+        fileName,
+        status: "modified",
+        // Assume modified on error
+        localPath: localFile
+      });
+    }
+  }
+  return results;
+}
+function getInstalledNames(installedFiles) {
+  return installedFiles.map((file) => {
+    const fileName = path4.basename(file);
+    return fileName.replace(/\.tsx?$/, "");
+  });
+}
+
 // src/commands/add.ts
 var addCommand = new Command2().name("add").description("Add a component to your project").argument("[components...]", "Components to add").option("-y, --yes", "Skip confirmation").option("-o, --overwrite", "Overwrite existing files").option("--cwd <path>", "Working directory", process.cwd()).action(async (components, options) => {
   const spinner = ora2();
   try {
-    const cwd = path4.resolve(options.cwd);
+    const cwd = path5.resolve(options.cwd);
     const projectRoot = await getProjectRoot(cwd);
     if (!projectRoot) {
       console.log(chalk3.red("Could not find a valid project."));
@@ -585,8 +765,8 @@ var addCommand = new Command2().name("add").description("Add a component to your
       process.exit(1);
     }
     if (!components.length) {
-      const registry = await getRegistry();
-      if (!registry.length) {
+      const registry2 = await getRegistry();
+      if (!registry2.length) {
         console.log(chalk3.red("No components found in registry."));
         process.exit(1);
       }
@@ -594,7 +774,7 @@ var addCommand = new Command2().name("add").description("Add a component to your
         type: "multiselect",
         name: "selected",
         message: "Which components would you like to add?",
-        choices: registry.map((item) => ({
+        choices: registry2.map((item) => ({
           title: `${item.name} ${chalk3.dim(`(${item.status})`)}`,
           value: item.name,
           description: item.description
@@ -607,13 +787,51 @@ var addCommand = new Command2().name("add").description("Add a component to your
       }
       components = selected;
     }
+    spinner.start("Resolving dependencies...");
+    const registry = await getRegistry();
+    const { resolved, circular } = resolveDependencies(components, registry);
+    if (circular) {
+      spinner.fail("Circular dependency detected");
+      console.log(chalk3.red(`  ${formatCircularError(circular)}`));
+      process.exit(1);
+    }
+    spinner.stop();
+    const componentsDir = path5.join(projectRoot, config.componentsPath);
+    const installedFiles = await getInstalledFiles(componentsDir);
+    const installedNames = new Set(getInstalledNames(installedFiles));
+    const toInstall = options.overwrite ? resolved : resolved.filter((name) => !installedNames.has(name));
+    if (toInstall.length === 0) {
+      console.log(chalk3.yellow("All components are already installed."));
+      console.log(chalk3.dim("Use --overwrite to reinstall."));
+      return;
+    }
+    const requested = new Set(components);
+    const dependencies = toInstall.filter((name) => !requested.has(name));
     console.log();
     console.log(chalk3.bold("Adding components:"));
-    components.forEach((c) => console.log(chalk3.dim(`  - ${c}`)));
+    for (const name of toInstall) {
+      if (requested.has(name)) {
+        console.log(chalk3.dim(`  - ${name}`));
+      } else {
+        console.log(chalk3.dim(`  - ${name} ${chalk3.cyan("(dependency)")}`));
+      }
+    }
     console.log();
+    if (dependencies.length > 0 && !options.yes) {
+      const { confirm } = await prompts2({
+        type: "confirm",
+        name: "confirm",
+        message: `Add ${dependencies.length} additional dependencies?`,
+        initial: true
+      });
+      if (!confirm) {
+        console.log(chalk3.dim("Cancelled."));
+        return;
+      }
+    }
     const allDependencies = [];
     const allDevDependencies = [];
-    for (const componentName of components) {
+    for (const componentName of toInstall) {
       spinner.start(`Fetching ${componentName}...`);
       try {
         const component = await fetchComponent(componentName);
@@ -621,16 +839,16 @@ var addCommand = new Command2().name("add").description("Add a component to your
           spinner.fail(`Component "${componentName}" not found`);
           continue;
         }
-        const targetDir = path4.join(projectRoot, config.componentsPath);
+        const targetDir = path5.join(projectRoot, config.componentsPath);
         for (const file of component.files) {
-          const targetPath = path4.join(targetDir, file.name);
-          if (await fs4.pathExists(targetPath) && !options.overwrite) {
+          const targetPath = path5.join(targetDir, file.name);
+          if (await fs5.pathExists(targetPath) && !options.overwrite) {
             spinner.warn(`${file.name} already exists (use --overwrite)`);
             continue;
           }
-          await fs4.ensureDir(targetDir);
-          const transformedContent = transformImports(file.content, config);
-          await fs4.writeFile(targetPath, transformedContent);
+          await fs5.ensureDir(targetDir);
+          const transformedContent = transformToInstalled(file.content, config);
+          await fs5.writeFile(targetPath, transformedContent);
         }
         spinner.succeed(`Added ${componentName}`);
         if (component.dependencies?.length) {
@@ -639,11 +857,6 @@ var addCommand = new Command2().name("add").description("Add a component to your
         if (component.devDependencies?.length) {
           allDevDependencies.push(...component.devDependencies);
         }
-        if (component.registryDependencies?.length) {
-          console.log(
-            chalk3.dim(`     Requires: ${component.registryDependencies.join(", ")}`)
-          );
-        }
       } catch (error) {
         spinner.fail(`Failed to add ${componentName}`);
         console.error(chalk3.dim(String(error)));
@@ -669,24 +882,20 @@ var addCommand = new Command2().name("add").description("Add a component to your
     process.exit(1);
   }
 });
-function transformImports(code, config) {
-  let transformed = code;
-  const utilsAlias = config.aliases?.utils || "@/lib/utils";
-  if (utilsAlias === "@/lib/utils") {
-    return transformed;
-  }
-  transformed = transformed.replace(
-    /from ['"]@\/lib\/utils['"]/g,
-    `from '${utilsAlias}'`
-  );
-  return transformed;
-}
 
 // src/commands/list.ts
 import { Command as Command3 } from "commander";
 import chalk4 from "chalk";
 import ora3 from "ora";
-var listCommand = new Command3().name("list").description("List available components").option("-c, --category <category>", "Filter by category").action(async (options) => {
+import path6 from "path";
+var listCommand = new Command3().name("list").description("List available or installed components").option("-c, --category <category>", "Filter by category").option("-i, --installed", "Show installed components and their sync status").option("--cwd <path>", "Working directory", process.cwd()).action(async (options) => {
+  if (options.installed) {
+    await listInstalledComponents(options);
+  } else {
+    await listAvailableComponents(options);
+  }
+});
+async function listAvailableComponents(options) {
   const spinner = ora3("Fetching components...").start();
   try {
     const registry = await getRegistry();
@@ -714,27 +923,120 @@ var listCommand = new Command3().name("list").description("List available compon
       }
       console.log();
     }
-    console.log(chalk4.dim("Add a component: npx nativeui add <component>"));
+    console.log(chalk4.dim("Add a component: npx mcellui add <component>"));
     console.log();
   } catch (error) {
     spinner.fail("Failed to fetch components");
     console.error(error);
     process.exit(1);
   }
-});
+}
+async function listInstalledComponents(options) {
+  const spinner = ora3();
+  try {
+    const cwd = path6.resolve(options.cwd || process.cwd());
+    const projectRoot = await getProjectRoot(cwd);
+    if (!projectRoot) {
+      console.log(chalk4.red("Could not find a valid project."));
+      console.log(chalk4.dim("Run `npx mcellui init` first."));
+      process.exit(1);
+    }
+    const config = await getConfig(projectRoot);
+    if (!config) {
+      console.log(chalk4.red("Project not initialized."));
+      console.log(chalk4.dim("Run `npx mcellui init` first."));
+      process.exit(1);
+    }
+    spinner.start("Scanning installed components...");
+    const componentsDir = path6.join(projectRoot, config.componentsPath);
+    const installedFiles = await getInstalledFiles(componentsDir);
+    if (installedFiles.length === 0) {
+      spinner.info("No components installed yet.");
+      console.log(chalk4.dim("\nAdd components with: npx mcellui add <component>"));
+      return;
+    }
+    spinner.text = "Fetching registry...";
+    const registry = await getRegistry();
+    spinner.text = "Comparing components...";
+    const installed = await getInstallStatus(installedFiles, registry, config);
+    spinner.stop();
+    const identical = installed.filter((c) => c.status === "identical");
+    const modified = installed.filter((c) => c.status === "modified");
+    const localOnly = installed.filter((c) => c.status === "local-only");
+    const installedNames = new Set(installed.map((c) => c.name));
+    const notInstalled = registry.filter((item) => !installedNames.has(item.name));
+    console.log();
+    console.log(chalk4.bold(`Installed Components (${installed.length})`));
+    console.log();
+    const categories = /* @__PURE__ */ new Map();
+    for (const comp of installed) {
+      const registryItem = registry.find((r) => r.name === comp.name);
+      const category = registryItem?.category || "Custom";
+      if (!categories.has(category)) {
+        categories.set(category, []);
+      }
+      categories.get(category).push(comp);
+    }
+    for (const [category, components] of categories) {
+      console.log(chalk4.cyan.bold(category));
+      for (const comp of components) {
+        let statusIcon;
+        let statusText;
+        switch (comp.status) {
+          case "identical":
+            statusIcon = chalk4.green("\u2713");
+            statusText = chalk4.dim("(up to date)");
+            break;
+          case "modified":
+            statusIcon = chalk4.yellow("\u26A0");
+            statusText = chalk4.yellow("(modified locally)");
+            break;
+          case "local-only":
+            statusIcon = chalk4.blue("?");
+            statusText = chalk4.dim("(custom component)");
+            break;
+        }
+        console.log(`  ${statusIcon} ${chalk4.white(comp.name)}  ${statusText}`);
+      }
+      console.log();
+    }
+    if (notInstalled.length > 0) {
+      console.log(chalk4.dim("Not Installed"));
+      const notInstalledNames = notInstalled.map((c) => c.name).slice(0, 10);
+      const remaining = notInstalled.length - 10;
+      console.log(chalk4.dim(`  ${notInstalledNames.join(", ")}${remaining > 0 ? `, ... +${remaining} more` : ""}`));
+      console.log();
+    }
+    console.log(chalk4.dim("\u2500".repeat(50)));
+    const parts = [];
+    if (identical.length > 0) parts.push(chalk4.green(`${identical.length} up to date`));
+    if (modified.length > 0) parts.push(chalk4.yellow(`${modified.length} modified`));
+    if (localOnly.length > 0) parts.push(chalk4.blue(`${localOnly.length} custom`));
+    console.log(parts.join("  \u2022  "));
+    if (modified.length > 0) {
+      console.log();
+      console.log(chalk4.dim("Sync modified components:"));
+      console.log(chalk4.cyan(`  npx mcellui diff`));
+    }
+  } catch (error) {
+    spinner.fail("Failed to list installed components");
+    console.error(error);
+    process.exit(1);
+  }
+}
 
 // src/commands/doctor.ts
 import { Command as Command4 } from "commander";
 import chalk5 from "chalk";
-import fs5 from "fs-extra";
-import path5 from "path";
+import fs6 from "fs-extra";
+import path7 from "path";
 var REQUIRED_PEER_DEPS = [
   { name: "react-native-reanimated", minVersion: "3.0.0" },
   { name: "react-native-gesture-handler", minVersion: "2.0.0" },
   { name: "react-native-safe-area-context", minVersion: "4.0.0" }
 ];
 var RECOMMENDED_DEPS = [
-  { name: "@nativeui/core", reason: "Theme system and utilities" }
+  { name: "@metacells/mcellui-core", reason: "Theme system and utilities" }
 ];
 function parseVersion(version) {
   const cleaned = version.replace(/^[\^~>=<]+/, "").replace(/^workspace:\*?/, "");
@@ -779,7 +1081,7 @@ async function checkProjectType(projectRoot) {
       name: "Project Type",
       status: "fail",
       message: "Not an Expo or React Native project",
-      fix: "nativeui requires Expo or React Native"
+      fix: "mcellui requires Expo or React Native"
     };
   }
   return {
@@ -790,34 +1092,50 @@ async function checkProjectType(projectRoot) {
 }
 async function checkInitialized(projectRoot) {
   const configFiles = [
+    "mcellui.config.ts",
+    "mcellui.config.js",
+    "mcellui.config.json",
     "nativeui.config.ts",
+    // Legacy
     "nativeui.config.js",
+    // Legacy
     "nativeui.config.json"
+    // Legacy
   ];
   let foundConfig = null;
+  let isLegacy = false;
   for (const file of configFiles) {
-    if (await fs5.pathExists(path5.join(projectRoot, file))) {
+    if (await fs6.pathExists(path7.join(projectRoot, file))) {
       foundConfig = file;
+      isLegacy = file.startsWith("nativeui.");
       break;
     }
   }
   if (!foundConfig) {
     return {
-      name: "NativeUI Config",
+      name: "mcellui Config",
       status: "fail",
-      message: "nativeui.config.ts not found",
-      fix: "Run: npx nativeui init"
+      message: "mcellui.config.ts not found",
+      fix: "Run: npx mcellui init"
+    };
+  }
+  if (isLegacy) {
+    return {
+      name: "mcellui Config",
+      status: "warn",
+      message: `Found legacy config: ${foundConfig}`,
+      fix: "Consider renaming to mcellui.config.ts"
     };
   }
   try {
-    const configPath = path5.join(projectRoot, foundConfig);
-    const content = await fs5.readFile(configPath, "utf-8");
+    const configPath = path7.join(projectRoot, foundConfig);
+    const content = await fs6.readFile(configPath, "utf-8");
     if (foundConfig.endsWith(".ts") || foundConfig.endsWith(".js")) {
       const hasDefineConfig = content.includes("defineConfig");
       const hasExport = content.includes("export default");
       if (!hasExport) {
         return {
-          name: "NativeUI Config",
+          name: "mcellui Config",
           status: "warn",
           message: "Config file missing default export",
           fix: "Add: export default defineConfig({ ... })"
@@ -825,7 +1143,7 @@ async function checkInitialized(projectRoot) {
       }
       if (!hasDefineConfig) {
         return {
-          name: "NativeUI Config",
+          name: "mcellui Config",
           status: "warn",
           message: "Config not using defineConfig helper",
           fix: "Wrap config with: defineConfig({ ... })"
@@ -837,21 +1155,21 @@ async function checkInitialized(projectRoot) {
         JSON.parse(content);
       } catch {
         return {
-          name: "NativeUI Config",
+          name: "mcellui Config",
           status: "fail",
           message: "Invalid JSON in config file",
-          fix: "Check JSON syntax in nativeui.config.json"
+          fix: "Check JSON syntax in mcellui.config.json"
         };
       }
     }
     return {
-      name: "NativeUI Config",
+      name: "mcellui Config",
       status: "pass",
       message: `Found ${foundConfig}`
     };
   } catch (error) {
     return {
-      name: "NativeUI Config",
+      name: "mcellui Config",
       status: "fail",
       message: "Could not read config file",
       fix: error instanceof Error ? error.message : "Check file permissions"
@@ -863,12 +1181,19 @@ async function checkPaths(projectRoot) {
   const defaultUtilsPath = "./lib/utils";
   let componentsPathValue = defaultComponentsPath;
   let utilsPathValue = defaultUtilsPath;
-  const configFiles = ["nativeui.config.ts", "nativeui.config.js", "nativeui.config.json"];
+  const configFiles = [
+    "mcellui.config.ts",
+    "mcellui.config.js",
+    "mcellui.config.json",
+    "nativeui.config.ts",
+    "nativeui.config.js",
+    "nativeui.config.json"
+  ];
   for (const file of configFiles) {
-    const configPath = path5.join(projectRoot, file);
-    if (await fs5.pathExists(configPath)) {
+    const configPath = path7.join(projectRoot, file);
+    if (await fs6.pathExists(configPath)) {
       try {
-        const content = await fs5.readFile(configPath, "utf-8");
+        const content = await fs6.readFile(configPath, "utf-8");
         const componentsMatch = content.match(/componentsPath:\s*['"]([^'"]+)['"]/);
         const utilsMatch = content.match(/utilsPath:\s*['"]([^'"]+)['"]/);
         if (componentsMatch) componentsPathValue = componentsMatch[1];
@@ -878,16 +1203,16 @@ async function checkPaths(projectRoot) {
       break;
     }
   }
-  const componentsPath = path5.join(projectRoot, componentsPathValue);
-  const utilsPath = path5.join(projectRoot, utilsPathValue);
-  const componentsExist = await fs5.pathExists(componentsPath);
-  const utilsExist = await fs5.pathExists(utilsPath);
+  const componentsPath = path7.join(projectRoot, componentsPathValue);
+  const utilsPath = path7.join(projectRoot, utilsPathValue);
+  const componentsExist = await fs6.pathExists(componentsPath);
+  const utilsExist = await fs6.pathExists(utilsPath);
   if (!componentsExist && !utilsExist) {
     return {
       name: "Component Paths",
       status: "warn",
       message: "Component and utils directories not created yet",
-      fix: `Add a component: npx nativeui add button`
+      fix: `Add a component: npx mcellui add button`
     };
   }
   if (!componentsExist) {
@@ -895,7 +1220,7 @@ async function checkPaths(projectRoot) {
       name: "Component Paths",
       status: "warn",
       message: `Components directory not found: ${componentsPathValue}`,
-      fix: "Add a component to create it: npx nativeui add button"
+      fix: "Add a component to create it: npx mcellui add button"
     };
   }
   return {
@@ -978,10 +1303,10 @@ async function checkBabelConfig(projectRoot) {
   let babelConfigPath = null;
   let babelContent = null;
   for (const configFile of babelConfigPaths) {
-    const fullPath = path5.join(projectRoot, configFile);
-    if (await fs5.pathExists(fullPath)) {
+    const fullPath = path7.join(projectRoot, configFile);
+    if (await fs6.pathExists(fullPath)) {
       babelConfigPath = configFile;
-      babelContent = await fs5.readFile(fullPath, "utf-8");
+      babelContent = await fs6.readFile(fullPath, "utf-8");
       break;
     }
   }
@@ -1009,8 +1334,8 @@ async function checkBabelConfig(projectRoot) {
   };
 }
 async function checkTypeScript(projectRoot) {
-  const tsconfigPath = path5.join(projectRoot, "tsconfig.json");
-  if (!await fs5.pathExists(tsconfigPath)) {
+  const tsconfigPath = path7.join(projectRoot, "tsconfig.json");
+  if (!await fs6.pathExists(tsconfigPath)) {
     return {
       name: "TypeScript",
       status: "warn",
@@ -1019,7 +1344,7 @@ async function checkTypeScript(projectRoot) {
     };
   }
   try {
-    const tsconfig = await fs5.readJson(tsconfigPath);
+    const tsconfig = await fs6.readJson(tsconfigPath);
     const hasPathAliases = tsconfig.compilerOptions?.paths;
     if (!hasPathAliases) {
       return {
@@ -1083,7 +1408,7 @@ async function checkExpoGo(projectRoot) {
 }
 function printReport(report) {
   console.log();
-  console.log(chalk5.bold("NativeUI Doctor"));
+  console.log(chalk5.bold("mcellui Doctor"));
   console.log(chalk5.dim("Checking your project setup..."));
   console.log();
   console.log(chalk5.dim("Project:"), report.projectRoot);
@@ -1125,7 +1450,7 @@ function printReport(report) {
 }
 var doctorCommand = new Command4().name("doctor").description("Check project setup and diagnose common issues").option("--cwd <path>", "Working directory", process.cwd()).option("--json", "Output results as JSON").action(async (options) => {
   try {
-    const cwd = path5.resolve(options.cwd);
+    const cwd = path7.resolve(options.cwd);
     const projectRoot = await getProjectRoot(cwd);
     if (!projectRoot) {
       console.log(chalk5.red("Could not find a valid project."));
@@ -1177,31 +1502,31 @@ var doctorCommand = new Command4().name("doctor").description("Check project set
 import { Command as Command5 } from "commander";
 import chalk6 from "chalk";
 import ora4 from "ora";
-import fs6 from "fs-extra";
-import path6 from "path";
-import crypto from "crypto";
-var diffCommand = new Command5().name("diff").description("Check for component updates against the registry").option("--cwd <path>", "Working directory", process.cwd()).option("--json", "Output as JSON").option("-v, --verbose", "Show detailed diff information").action(async (options) => {
+import fs7 from "fs-extra";
+import path8 from "path";
+import * as Diff from "diff";
+var diffCommand = new Command5().name("diff").description("Compare locally installed components against the registry source").argument("[components...]", "Component names to diff (optional, diffs all if omitted)").option("--cwd <path>", "Working directory", process.cwd()).option("--list", "Only list components with differences").option("--json", "Output as JSON").action(async (components, options) => {
   const spinner = ora4();
   try {
-    const cwd = path6.resolve(options.cwd);
+    const cwd = path8.resolve(options.cwd);
     const projectRoot = await getProjectRoot(cwd);
     if (!projectRoot) {
       console.log(chalk6.red("Could not find a valid project."));
-      console.log(chalk6.dim("Run `npx nativeui init` first."));
+      console.log(chalk6.dim("Run `npx mcellui init` first."));
       process.exit(1);
     }
     const config = await getConfig(projectRoot);
     if (!config) {
       console.log(chalk6.red("Project not initialized."));
-      console.log(chalk6.dim("Run `npx nativeui init` first."));
+      console.log(chalk6.dim("Run `npx mcellui init` first."));
       process.exit(1);
     }
     spinner.start("Scanning installed components...");
-    const componentsDir = path6.join(projectRoot, config.componentsPath);
-    const installedFiles = await getInstalledComponents(componentsDir);
+    const componentsDir = path8.join(projectRoot, config.componentsPath);
+    const installedFiles = await getInstalledFiles(componentsDir);
     if (installedFiles.length === 0) {
       spinner.info("No components installed yet.");
-      console.log(chalk6.dim("\nAdd components with: npx nativeui add <component>"));
+      console.log(chalk6.dim("\nAdd components with: npx mcellui add <component>"));
       return;
     }
     spinner.text = "Fetching registry...";
@@ -1209,18 +1534,34 @@ var diffCommand = new Command5().name("diff").description("Check for component u
     const registryMap = /* @__PURE__ */ new Map();
     for (const item of registry) {
       for (const file of item.files) {
-        const fileName = path6.basename(file);
+        const fileName = path8.basename(file);
         registryMap.set(fileName, item);
       }
     }
+    let filesToCompare = installedFiles;
+    if (components.length > 0) {
+      const componentFileNames = components.map((c) => {
+        return c.endsWith(".tsx") ? c : `${c}.tsx`;
+      });
+      filesToCompare = installedFiles.filter((file) => {
+        const fileName = path8.basename(file);
+        return componentFileNames.includes(fileName);
+      });
+      if (filesToCompare.length === 0) {
+        spinner.fail(`None of the specified components found: ${components.join(", ")}`);
+        process.exit(1);
+      }
+    }
     spinner.text = "Comparing components...";
     const results = [];
-    for (const localFile of installedFiles) {
-      const fileName = path6.basename(localFile);
+    for (const localFile of filesToCompare) {
+      const fileName = path8.basename(localFile);
+      const componentName = fileName.replace(/\.tsx?$/, "");
       const registryItem = registryMap.get(fileName);
       if (!registryItem) {
         results.push({
-          name: fileName.replace(/\.tsx?$/, ""),
+          name: componentName,
+          fileName,
           status: "local-only",
           localFile
         });
@@ -1231,6 +1572,7 @@ var diffCommand = new Command5().name("diff").description("Check for component u
         if (!component) {
           results.push({
             name: registryItem.name,
+            fileName,
             status: "error",
             error: "Failed to fetch from registry"
           });
@@ -1240,31 +1582,42 @@ var diffCommand = new Command5().name("diff").description("Check for component u
         if (!registryFile) {
           results.push({
             name: registryItem.name,
+            fileName,
             status: "error",
             error: "File not found in registry"
           });
           continue;
         }
-        const localContent = await fs6.readFile(localFile, "utf-8");
-        const transformedRegistryContent = transformImports2(registryFile.content, config);
-        const localHash = hashContent(localContent);
-        const registryHash = hashContent(transformedRegistryContent);
-        if (localHash === registryHash) {
+        const localContent = await fs7.readFile(localFile, "utf-8");
+        const normalizedLocal = normalizeForComparison(localContent);
+        const normalizedRegistry = normalizeForComparison(registryFile.content);
+        if (normalizedLocal === normalizedRegistry) {
           results.push({
             name: registryItem.name,
-            status: "up-to-date",
+            fileName,
+            status: "identical",
             localFile
           });
         } else {
+          const diffOutput = Diff.createPatch(
+            fileName,
+            normalizedRegistry,
+            normalizedLocal,
+            "registry",
+            "local"
+          );
           results.push({
             name: registryItem.name,
-            status: "changed",
-            localFile
+            fileName,
+            status: "modified",
+            localFile,
+            diff: diffOutput
           });
         }
       } catch (error) {
         results.push({
           name: registryItem.name,
+          fileName,
           status: "error",
           error: String(error)
         });
@@ -1273,100 +1626,71 @@ var diffCommand = new Command5().name("diff").description("Check for component u
     spinner.stop();
     if (options.json) {
       console.log(JSON.stringify(results, null, 2));
-      return;
+      const hasChanges2 = results.some((r) => r.status === "modified");
+      process.exit(hasChanges2 ? 1 : 0);
     }
-    printResults(results, options.verbose);
+    printResults(results, options.list);
+    const hasChanges = results.some((r) => r.status === "modified");
+    process.exit(hasChanges ? 1 : 0);
   } catch (error) {
-    spinner.fail("Failed to check for updates");
+    spinner.fail("Failed to diff components");
     console.error(error);
     process.exit(1);
   }
 });
-async function getInstalledComponents(componentsDir) {
-  if (!await fs6.pathExists(componentsDir)) {
-    return [];
-  }
-  const files = await fs6.readdir(componentsDir);
-  const componentFiles = [];
-  for (const file of files) {
-    if (file.endsWith(".tsx") || file.endsWith(".ts")) {
-      if (file === "index.ts" || file === "index.tsx") {
-        continue;
-      }
-      componentFiles.push(path6.join(componentsDir, file));
-    }
-  }
-  return componentFiles;
-}
-function hashContent(content) {
-  const normalized = content.replace(/\r\n/g, "\n").replace(/\s+$/gm, "").trim();
-  return crypto.createHash("md5").update(normalized).digest("hex");
-}
-function transformImports2(code, config) {
-  let transformed = code;
-  const utilsAlias = config.aliases?.utils || "@/lib/utils";
-  if (utilsAlias === "@/lib/utils") {
-    return transformed;
-  }
-  transformed = transformed.replace(
-    /from ['"]@\/lib\/utils['"]/g,
-    `from '${utilsAlias}'`
-  );
-  return transformed;
-}
-function printResults(results, verbose) {
-  const upToDate = results.filter((r) => r.status === "up-to-date");
-  const changed = results.filter((r) => r.status === "changed");
+function printResults(results, listOnly) {
+  const identical = results.filter((r) => r.status === "identical");
+  const modified = results.filter((r) => r.status === "modified");
   const localOnly = results.filter((r) => r.status === "local-only");
   const errors = results.filter((r) => r.status === "error");
   console.log();
-  console.log(chalk6.bold("Component Diff Report"));
-  console.log(chalk6.dim("\u2500".repeat(40)));
-  console.log();
-  const total = results.length;
-  console.log(`Found ${chalk6.bold(total)} installed component${total !== 1 ? "s" : ""}`);
+  console.log(chalk6.bold("Comparing components..."));
   console.log();
-  if (changed.length > 0) {
-    console.log(chalk6.yellow(`\u26A1 ${changed.length} update${changed.length !== 1 ? "s" : ""} available:`));
-    for (const item of changed) {
-      console.log(`   ${chalk6.yellow("\u25CF")} ${item.name}`);
-    }
-    console.log();
-    console.log(chalk6.dim("   Update with: npx nativeui add <component> --overwrite"));
-    console.log();
-  }
-  if (upToDate.length > 0) {
-    console.log(chalk6.green(`\u2713 ${upToDate.length} up to date:`));
-    if (verbose) {
-      for (const item of upToDate) {
-        console.log(`   ${chalk6.green("\u25CF")} ${item.name}`);
-      }
-    } else {
-      const names = upToDate.map((r) => r.name).join(", ");
-      console.log(chalk6.dim(`   ${names}`));
+  for (const result of results) {
+    switch (result.status) {
+      case "identical":
+        console.log(`${chalk6.green("\u2713")} ${result.fileName}    ${chalk6.dim("(identical)")}`);
+        break;
+      case "modified":
+        console.log(`${chalk6.red("\u2717")} ${result.fileName}      ${chalk6.yellow("(modified)")}`);
+        if (!listOnly && result.diff) {
+          printColoredDiff(result.diff);
+        }
+        break;
+      case "local-only":
+        console.log(`${chalk6.yellow("\u26A0")} ${result.fileName}    ${chalk6.dim("(not in registry)")}`);
+        break;
+      case "error":
+        console.log(`${chalk6.red("!")} ${result.fileName}    ${chalk6.red(`(error: ${result.error})`)}`);
+        break;
     }
-    console.log();
   }
-  if (localOnly.length > 0) {
-    console.log(chalk6.blue(`\u25D0 ${localOnly.length} local-only (not in registry):`));
-    for (const item of localOnly) {
-      console.log(`   ${chalk6.blue("\u25CF")} ${item.name}`);
-    }
+  console.log();
+  const parts = [];
+  if (identical.length > 0) parts.push(`${identical.length} identical`);
+  if (modified.length > 0) parts.push(`${modified.length} modified`);
+  if (localOnly.length > 0) parts.push(`${localOnly.length} custom`);
+  if (errors.length > 0) parts.push(`${errors.length} errors`);
+  console.log(chalk6.dim(`Summary: ${parts.join(", ")}`));
+  if (modified.length > 0) {
     console.log();
+    console.log(chalk6.dim("Update modified components with:"));
+    console.log(chalk6.cyan(`  npx mcellui add ${modified.map((m) => m.name).join(" ")} --overwrite`));
   }
-  if (errors.length > 0) {
-    console.log(chalk6.red(`\u2717 ${errors.length} error${errors.length !== 1 ? "s" : ""}:`));
-    for (const item of errors) {
-      console.log(`   ${chalk6.red("\u25CF")} ${item.name}: ${chalk6.dim(item.error)}`);
+}
+function printColoredDiff(diffOutput) {
+  const lines = diffOutput.split("\n");
+  const contentLines = lines.slice(4);
+  for (const line of contentLines) {
+    if (line.startsWith("+") && !line.startsWith("+++")) {
+      console.log(chalk6.green(`    ${line}`));
+    } else if (line.startsWith("-") && !line.startsWith("---")) {
+      console.log(chalk6.red(`    ${line}`));
+    } else if (line.startsWith("@@")) {
+      console.log(chalk6.cyan(`    ${line}`));
+    } else if (line.trim()) {
+      console.log(chalk6.dim(`    ${line}`));
     }
-    console.log();
-  }
-  if (changed.length === 0 && errors.length === 0) {
-    console.log(chalk6.green("All registry components are up to date!"));
-  } else if (changed.length > 0) {
-    console.log(
-      chalk6.yellow(`Run ${chalk6.cyan("npx nativeui add " + changed.map((c) => c.name).join(" ") + " --overwrite")} to update`)
-    );
   }
 }
 
@@ -1375,13 +1699,12 @@ import { Command as Command6 } from "commander";
 import chalk7 from "chalk";
 import ora5 from "ora";
 import prompts3 from "prompts";
-import fs7 from "fs-extra";
-import path7 from "path";
-import crypto2 from "crypto";
+import fs8 from "fs-extra";
+import path9 from "path";
 var updateCommand = new Command6().name("update").description("Update installed components to latest registry versions").argument("[components...]", "Specific components to update (default: all outdated)").option("-y, --yes", "Skip confirmation prompt").option("--all", "Update all components (including up-to-date)").option("--dry-run", "Show what would be updated without making changes").option("--cwd <path>", "Working directory", process.cwd()).action(async (components, options) => {
   const spinner = ora5();
   try {
-    const cwd = path7.resolve(options.cwd);
+    const cwd = path9.resolve(options.cwd);
     const projectRoot = await getProjectRoot(cwd);
     if (!projectRoot) {
       console.log(chalk7.red("Could not find a valid project."));
@@ -1395,7 +1718,7 @@ var updateCommand = new Command6().name("update").description("Update installed
       process.exit(1);
     }
     spinner.start("Checking for updates...");
-    const componentsDir = path7.join(projectRoot, config.componentsPath);
+    const componentsDir = path9.join(projectRoot, config.componentsPath);
     const diffs = await getComponentDiffs(componentsDir, config);
     if (diffs.length === 0) {
       spinner.info("No components installed yet.");
@@ -1457,12 +1780,12 @@ var updateCommand = new Command6().name("update").description("Update installed
           failCount++;
           continue;
         }
-        const targetDir = path7.join(projectRoot, config.componentsPath);
+        const targetDir = path9.join(projectRoot, config.componentsPath);
         for (const file of component.files) {
-          const targetPath = path7.join(targetDir, file.name);
-          await fs7.ensureDir(targetDir);
-          const transformedContent = transformImports3(file.content, config);
-          await fs7.writeFile(targetPath, transformedContent);
+          const targetPath = path9.join(targetDir, file.name);
+          await fs8.ensureDir(targetDir);
+          const transformedContent = transformToInstalled(file.content, config);
+          await fs8.writeFile(targetPath, transformedContent);
         }
         spinner.succeed(`Updated ${comp.name}`);
         successCount++;
@@ -1503,18 +1826,18 @@ var updateCommand = new Command6().name("update").description("Update installed
   }
 });
 async function getComponentDiffs(componentsDir, config) {
-  if (!await fs7.pathExists(componentsDir)) {
+  if (!await fs8.pathExists(componentsDir)) {
     return [];
   }
   const registry = await getRegistry();
   const registryMap = /* @__PURE__ */ new Map();
   for (const item of registry) {
     for (const file of item.files) {
-      const fileName = path7.basename(file);
+      const fileName = path9.basename(file);
       registryMap.set(fileName, item);
     }
   }
-  const files = await fs7.readdir(componentsDir);
+  const files = await fs8.readdir(componentsDir);
   const results = [];
   for (const file of files) {
     if (!file.endsWith(".tsx") && !file.endsWith(".ts")) {
@@ -1527,7 +1850,7 @@ async function getComponentDiffs(componentsDir, config) {
     if (!registryItem) {
       continue;
     }
-    const localFile = path7.join(componentsDir, file);
+    const localFile = path9.join(componentsDir, file);
     const hasUpdate = await checkForUpdate(localFile, registryItem, config);
     results.push({
       name: registryItem.name,
@@ -1541,46 +1864,29 @@ async function checkForUpdate(localFile, registryItem, config) {
   try {
     const component = await fetchComponent(registryItem.name);
     if (!component) return false;
-    const fileName = path7.basename(localFile);
+    const fileName = path9.basename(localFile);
     const registryFile = component.files.find((f) => f.name === fileName);
     if (!registryFile) return false;
-    const localContent = await fs7.readFile(localFile, "utf-8");
-    const transformedRegistryContent = transformImports3(registryFile.content, config);
-    const localHash = hashContent2(localContent);
-    const registryHash = hashContent2(transformedRegistryContent);
-    return localHash !== registryHash;
+    const localContent = await fs8.readFile(localFile, "utf-8");
+    const normalizedLocal = normalizeForComparison(localContent);
+    const normalizedRegistry = normalizeForComparison(registryFile.content);
+    return normalizedLocal !== normalizedRegistry;
   } catch {
     return false;
   }
 }
-function hashContent2(content) {
-  const normalized = content.replace(/\r\n/g, "\n").replace(/\s+$/gm, "").trim();
-  return crypto2.createHash("md5").update(normalized).digest("hex");
-}
-function transformImports3(code, config) {
-  let transformed = code;
-  const utilsAlias = config.aliases?.utils || "@/lib/utils";
-  if (utilsAlias === "@/lib/utils") {
-    return transformed;
-  }
-  transformed = transformed.replace(
-    /from ['"]@\/lib\/utils['"]/g,
-    `from '${utilsAlias}'`
-  );
-  return transformed;
-}
 
 // src/commands/create.ts
 import { Command as Command7 } from "commander";
 import chalk8 from "chalk";
 import ora6 from "ora";
 import prompts4 from "prompts";
-import fs8 from "fs-extra";
-import path8 from "path";
+import fs9 from "fs-extra";
+import path10 from "path";
 var createCommand = new Command7().name("create").description("Scaffold a new custom component").argument("<name>", "Component name (e.g., my-button, ProfileCard)").option("-t, --template <type>", "Component template: basic, animated, pressable, input", "basic").option("--forward-ref", "Include forwardRef pattern").option("-y, --yes", "Skip confirmation").option("--cwd <path>", "Working directory", process.cwd()).action(async (name, options) => {
   const spinner = ora6();
   try {
-    const cwd = path8.resolve(options.cwd);
+    const cwd = path10.resolve(options.cwd);
     const projectRoot = await getProjectRoot(cwd);
     if (!projectRoot) {
       console.log(chalk8.red("Could not find a valid project."));
@@ -1595,9 +1901,9 @@ var createCommand = new Command7().name("create").description("Scaffold a new cu
     }
     const componentName = toPascalCase(name);
     const fileName = toKebabCase(name) + ".tsx";
-    const targetDir = path8.join(projectRoot, config.componentsPath);
-    const targetPath = path8.join(targetDir, fileName);
-    if (await fs8.pathExists(targetPath)) {
+    const targetDir = path10.join(projectRoot, config.componentsPath);
+    const targetPath = path10.join(targetDir, fileName);
+    if (await fs9.pathExists(targetPath)) {
       console.log(chalk8.red(`Component already exists: ${fileName}`));
       console.log(chalk8.dim(`Path: ${targetPath}`));
       process.exit(1);
@@ -1624,8 +1930,8 @@ var createCommand = new Command7().name("create").description("Scaffold a new cu
     }
     spinner.start("Creating component...");
     const code = generateComponent(componentName, options.template, options.forwardRef);
-    await fs8.ensureDir(targetDir);
-    await fs8.writeFile(targetPath, code);
+    await fs9.ensureDir(targetDir);
+    await fs9.writeFile(targetPath, code);
     spinner.succeed(`Created ${fileName}`);
     console.log();
     console.log(chalk8.bold("Next steps:"));
@@ -1658,7 +1964,7 @@ function generateBasicComponent(name, forwardRef) {
   if (forwardRef) {
     return `import React, { forwardRef } from 'react';
 import { View, Text, StyleSheet, ViewProps } from 'react-native';
-import { useTheme } from '@nativeui/core';
+import { useTheme } from '@metacells/mcellui-core';
 
 export interface ${name}Props extends ViewProps {
   /**
@@ -1718,7 +2024,7 @@ const styles = StyleSheet.create({
   }
   return `import React from 'react';
 import { View, Text, StyleSheet, ViewProps } from 'react-native';
-import { useTheme } from '@nativeui/core';
+import { useTheme } from '@metacells/mcellui-core';
 
 export interface ${name}Props extends ViewProps {
   /**
@@ -1785,7 +2091,7 @@ import Animated, {
   useSharedValue,
   withSpring,
 } from 'react-native-reanimated';
-import { useTheme } from '@nativeui/core';
+import { useTheme } from '@metacells/mcellui-core';
 
 export interface ${name}Props extends ViewProps {
   /**
@@ -1854,7 +2160,7 @@ import Animated, {
   useSharedValue,
   withTiming,
 } from 'react-native-reanimated';
-import { useTheme } from '@nativeui/core';
+import { useTheme } from '@metacells/mcellui-core';
 
 const AnimatedPressable = Animated.createAnimatedComponent(Pressable);
 
@@ -1947,7 +2253,7 @@ import Animated, {
   useSharedValue,
   withTiming,
 } from 'react-native-reanimated';
-import { useTheme } from '@nativeui/core';
+import { useTheme } from '@metacells/mcellui-core';
 
 const AnimatedPressable = Animated.createAnimatedComponent(Pressable);
 
@@ -2037,7 +2343,7 @@ import Animated, {
   useSharedValue,
   withTiming,
 } from 'react-native-reanimated';
-import { useTheme } from '@nativeui/core';
+import { useTheme } from '@metacells/mcellui-core';
 
 export interface ${name}Props extends TextInputProps {
   /**
@@ -2162,7 +2468,7 @@ import Animated, {
   useSharedValue,
   withTiming,
 } from 'react-native-reanimated';
-import { useTheme } from '@nativeui/core';
+import { useTheme } from '@metacells/mcellui-core';
 
 export interface ${name}Props extends TextInputProps {
   /**
@@ -2281,8 +2587,8 @@ import { Command as Command8 } from "commander";
 import chalk9 from "chalk";
 import prompts5 from "prompts";
 import ora7 from "ora";
-import fs9 from "fs-extra";
-import path9 from "path";
+import fs10 from "fs-extra";
+import path11 from "path";
 function groupByCategory(items) {
   const groups = {};
   for (const item of items) {
@@ -2339,21 +2645,9 @@ function formatComponentChoice(item, installed) {
     disabled: isInstalled
   };
 }
-function transformImports4(code, config) {
-  let transformed = code;
-  const utilsAlias = config.aliases?.utils || "@/lib/utils";
-  if (utilsAlias === "@/lib/utils") {
-    return transformed;
-  }
-  transformed = transformed.replace(
-    /from ['"]@\/lib\/utils['"]/g,
-    `from '${utilsAlias}'`
-  );
-  return transformed;
-}
 var pickCommand = new Command8().name("pick").description("Interactively browse and select components to add").option("--all", "Show all components without category selection").option("-o, --overwrite", "Overwrite existing files").option("--cwd <path>", "Working directory", process.cwd()).action(async (options) => {
   console.log(chalk9.bold("\n\u{1F3A8} nativeui Component Picker\n"));
-  const cwd = path9.resolve(options.cwd);
+  const cwd = path11.resolve(options.cwd);
   const projectRoot = await getProjectRoot(cwd);
   if (!projectRoot) {
     console.log(chalk9.red("Could not find a valid project."));
@@ -2372,10 +2666,10 @@ var pickCommand = new Command8().name("pick").description("Interactively browse
     return;
   }
   spinner.succeed(`Loaded ${registry.length} components`);
-  const componentsDir = path9.join(projectRoot, config.componentsPath);
+  const componentsDir = path11.join(projectRoot, config.componentsPath);
   const installed = /* @__PURE__ */ new Set();
-  if (fs9.existsSync(componentsDir)) {
-    const files = fs9.readdirSync(componentsDir);
+  if (fs10.existsSync(componentsDir)) {
+    const files = fs10.readdirSync(componentsDir);
     for (const file of files) {
       if (file.endsWith(".tsx")) {
         installed.add(file.replace(".tsx", ""));
@@ -2458,16 +2752,16 @@ ${installed.size} already installed, ${availableCount} available
         installSpinner.fail(`Component "${name}" not found`);
         continue;
       }
-      const targetDir = path9.join(projectRoot, config.componentsPath);
+      const targetDir = path11.join(projectRoot, config.componentsPath);
       for (const file of component.files) {
-        const targetPath = path9.join(targetDir, file.name);
-        if (await fs9.pathExists(targetPath) && !options.overwrite) {
+        const targetPath = path11.join(targetDir, file.name);
+        if (await fs10.pathExists(targetPath) && !options.overwrite) {
           installSpinner.warn(`${name}: ${file.name} already exists (use --overwrite)`);
           continue;
         }
-        await fs9.ensureDir(targetDir);
-        const transformedContent = transformImports4(file.content, config);
-        await fs9.writeFile(targetPath, transformedContent);
+        await fs10.ensureDir(targetDir);
+        const transformedContent = transformToInstalled(file.content, config);
+        await fs10.writeFile(targetPath, transformedContent);
       }
       installSpinner.succeed(`Installed ${chalk9.green(name)}`);
       successCount++;
@@ -2513,7 +2807,7 @@ ${installed.size} already installed, ${availableCount} available
 
 // src/index.ts
 var program = new Command9();
-program.name("nativeui").description("Add beautiful UI components to your Expo/React Native project").version("0.0.1");
+program.name("mcellui").description("Add beautiful UI components to your Expo/React Native project").version("0.1.4");
 program.addCommand(initCommand);
 program.addCommand(addCommand);
 program.addCommand(listCommand);