@fumadocs/cli 1.1.0 → 1.2.0

package/dist/index.js

@@ -1,241 +1,20 @@
 #!/usr/bin/env node
 
 // src/index.ts
-import fs5 from "fs/promises";
-import path4 from "path";
+import fs6 from "fs/promises";
+import path5 from "path";
 import { Command } from "commander";
 import picocolors3 from "picocolors";
 
-// src/utils/add/install-component.ts
-import path2 from "path";
-import fs from "fs/promises";
-import { confirm, isCancel, log, outro } from "@clack/prompts";
-
-// src/utils/typescript.ts
-import { Project } from "ts-morph";
-function createEmptyProject() {
-  return new Project({
-    compilerOptions: {}
-  });
-}
-
-// src/constants.ts
-var typescriptExtensions = [".ts", ".tsx", ".js", ".jsx"];
-
-// src/utils/transform-references.ts
-import path from "path";
-function transformReferences(file, transform) {
-  for (const specifier of file.getImportStringLiterals()) {
-    const result = transform(specifier.getLiteralValue());
-    if (!result) continue;
-    specifier.setLiteralValue(result);
-  }
-}
-function toImportSpecifier(sourceFile, referenceFile) {
-  const extname = path.extname(referenceFile);
-  const removeExt = typescriptExtensions.includes(extname);
-  const importPath = path.relative(
-    path.dirname(sourceFile),
-    removeExt ? referenceFile.substring(0, referenceFile.length - extname.length) : referenceFile
-  ).replaceAll(path.sep, "/");
-  return importPath.startsWith("../") ? importPath : `./${importPath}`;
-}
-
-// src/registry/schema.ts
-import { z } from "zod";
-var namespaces = [
-  "components",
-  "lib",
-  "css",
-  "route",
-  "ui",
-  "block"
-];
-var indexSchema = z.object({
-  name: z.string(),
-  title: z.string().optional(),
-  description: z.string().optional()
-});
-var fileSchema = z.object({
-  type: z.literal(namespaces),
-  path: z.string(),
-  target: z.string().optional(),
-  content: z.string()
-});
-var componentSchema = z.object({
-  name: z.string(),
-  title: z.string().optional(),
-  description: z.string().optional(),
-  files: z.array(fileSchema),
-  dependencies: z.record(z.string(), z.string().or(z.null())),
-  devDependencies: z.record(z.string(), z.string().or(z.null())),
-  subComponents: z.array(z.string()).default([])
-});
-var rootSchema = z.object({
-  name: z.string(),
-  index: z.array(indexSchema),
-  components: z.array(componentSchema)
-});
-
-// src/registry/client.ts
-import { z as z2 } from "zod";
-function validateRegistryIndex(indexes) {
-  return z2.array(indexSchema).parse(indexes);
-}
-function validateRegistryComponent(component) {
-  return componentSchema.parse(component);
-}
-
-// src/utils/add/install-component.ts
-function createComponentInstaller(options) {
-  const { config, resolver } = options;
-  const project = createEmptyProject();
-  const installedFiles = /* @__PURE__ */ new Set();
-  const downloadedComps = /* @__PURE__ */ new Map();
-  function buildFileList(downloaded) {
-    const map = /* @__PURE__ */ new Map();
-    for (const item of downloaded) {
-      for (const file of item.files) {
-        const filePath = file.target ?? file.path;
-        if (map.has(filePath)) {
-          console.warn(
-            `noticed duplicated output file for ${filePath}, ignoring for now.`
-          );
-          continue;
-        }
-        map.set(filePath, file);
-      }
-    }
-    return Array.from(map.values());
-  }
-  return {
-    async install(name) {
-      const downloaded = await this.download(name);
-      const dependencies = {};
-      const devDependencies = {};
-      for (const item of downloaded) {
-        Object.assign(dependencies, item.dependencies);
-        Object.assign(devDependencies, item.devDependencies);
-      }
-      const fileList = buildFileList(downloaded);
-      for (const file of fileList) {
-        const filePath = file.target ?? file.path;
-        if (installedFiles.has(filePath)) continue;
-        const outPath = this.resolveOutputPath(file);
-        const output = typescriptExtensions.includes(path2.extname(filePath)) ? this.transform(outPath, file, fileList) : file.content;
-        const status = await fs.readFile(outPath).then((res) => {
-          if (res.toString() === output) return "ignore";
-          return "need-update";
-        }).catch(() => "write");
-        installedFiles.add(filePath);
-        if (status === "ignore") continue;
-        if (status === "need-update") {
-          const override = await confirm({
-            message: `Do you want to override ${outPath}?`,
-            initialValue: false
-          });
-          if (isCancel(override)) {
-            outro("Ended");
-            process.exit(0);
-          }
-          if (!override) continue;
-        }
-        await fs.mkdir(path2.dirname(outPath), { recursive: true });
-        await fs.writeFile(outPath, output);
-        log.step(`downloaded ${outPath}`);
-      }
-      return {
-        dependencies,
-        devDependencies
-      };
-    },
-    /**
-     * return a list of components, merged with child components.
-     */
-    async download(name) {
-      const cached = downloadedComps.get(name);
-      if (cached) return cached;
-      const comp = validateRegistryComponent(
-        await resolver(`${name}.json`).catch((e) => {
-          log.error(`component ${name} not found:`);
-          log.error(String(e));
-          process.exit(1);
-        })
-      );
-      const result = [comp];
-      downloadedComps.set(name, result);
-      for (const sub of comp.subComponents) {
-        result.push(...await this.download(sub));
-      }
-      return result;
-    },
-    transform(filePath, file, fileList) {
-      const sourceFile = project.createSourceFile(filePath, file.content, {
-        overwrite: true
-      });
-      transformReferences(sourceFile, (specifier) => {
-        const prefix = "@/";
-        if (specifier.startsWith(prefix)) {
-          const lookup = specifier.substring(prefix.length);
-          const target = fileList.find((item) => {
-            const filePath2 = item.target ?? item.path;
-            return filePath2 === lookup;
-          });
-          if (!target) {
-            console.warn(`cannot find the referenced file of ${specifier}`);
-            return specifier;
-          }
-          return toImportSpecifier(filePath, this.resolveOutputPath(target));
-        }
-      });
-      return sourceFile.getFullText();
-    },
-    resolveOutputPath(ref) {
-      if (ref.target) {
-        return path2.join(config.baseDir, ref.target);
-      }
-      const base = path2.basename(ref.path);
-      const dir = {
-        components: config.aliases.componentsDir,
-        block: config.aliases.blockDir,
-        ui: config.aliases.uiDir,
-        css: config.aliases.cssDir,
-        lib: config.aliases.libDir,
-        route: "./"
-      }[ref.type];
-      return path2.join(config.baseDir, dir, base);
-    }
-  };
-}
-function remoteResolver(url) {
-  return async (file) => {
-    const res = await fetch(`${url}/${file}`);
-    if (!res.ok) {
-      throw new Error(`failed to fetch ${url}/${file}: ${res.statusText}`);
-    }
-    return await res.json();
-  };
-}
-function localResolver(dir) {
-  return async (file) => {
-    const filePath = path2.join(dir, file);
-    return await fs.readFile(filePath).then((res) => JSON.parse(res.toString())).catch((e) => {
-      throw new Error(`failed to resolve local file "${filePath}"`, {
-        cause: e
-      });
-    });
-  };
-}
-
 // src/config.ts
-import fs3 from "fs/promises";
+import fs2 from "fs/promises";
 
 // src/utils/fs.ts
-import fs2 from "fs/promises";
-import path3 from "path";
+import fs from "fs/promises";
+import path from "path";
 async function exists(pathLike) {
   try {
-    await fs2.access(pathLike);
+    await fs.access(pathLike);
     return true;
   } catch {
     return false;
@@ -248,7 +27,7 @@ async function isSrc() {
 }
 
 // src/config.ts
-import { z as z3 } from "zod";
+import { z } from "zod";
 function createConfigSchema(isSrc2) {
   const defaultAliases = {
     uiDir: "./components/ui",
@@ -257,38 +36,43 @@ function createConfigSchema(isSrc2) {
     cssDir: "./styles",
     libDir: "./lib"
   };
-  return z3.object({
-    aliases: z3.object({
-      uiDir: z3.string().default(defaultAliases.uiDir),
-      componentsDir: z3.string().default(defaultAliases.uiDir),
-      blockDir: z3.string().default(defaultAliases.blockDir),
-      cssDir: z3.string().default(defaultAliases.componentsDir),
-      libDir: z3.string().default(defaultAliases.libDir)
+  return z.object({
+    $schema: z.string().default(
+      isSrc2 ? "node_modules/@fumadocs/cli/dist/schema/src.json" : "node_modules/@fumadocs/cli/dist/schema/default.json"
+    ).optional(),
+    aliases: z.object({
+      uiDir: z.string().default(defaultAliases.uiDir),
+      componentsDir: z.string().default(defaultAliases.uiDir),
+      blockDir: z.string().default(defaultAliases.blockDir),
+      cssDir: z.string().default(defaultAliases.componentsDir),
+      libDir: z.string().default(defaultAliases.libDir)
     }).default(defaultAliases),
-    baseDir: z3.string().default(isSrc2 ? "src" : ""),
-    commands: z3.object({
+    baseDir: z.string().default(isSrc2 ? "src" : ""),
+    uiLibrary: z.enum(["radix-ui", "base-ui"]).default("radix-ui"),
+    commands: z.object({
       /**
        * command to format output code automatically
        */
-      format: z3.string().optional()
+      format: z.string().optional()
     }).default({})
   });
 }
 async function createOrLoadConfig(file = "./cli.json") {
   const inited = await initConfig(file);
   if (inited) return inited;
-  const content = (await fs3.readFile(file)).toString();
+  const content = (await fs2.readFile(file)).toString();
   const src = await isSrc();
   const configSchema = createConfigSchema(src);
   return configSchema.parse(JSON.parse(content));
 }
-async function initConfig(file = "./cli.json") {
-  if (await fs3.stat(file).then(() => true).catch(() => false)) {
+async function initConfig(file = "./cli.json", src) {
+  if (await fs2.stat(file).then(() => true).catch(() => false)) {
     return;
   }
-  const src = await isSrc();
-  const defaultConfig = createConfigSchema(src).parse({});
-  await fs3.writeFile(file, JSON.stringify(defaultConfig, null, 2));
+  const defaultConfig = createConfigSchema(src ?? await isSrc()).parse(
+    {}
+  );
+  await fs2.writeFile(file, JSON.stringify(defaultConfig, null, 2));
   return defaultConfig;
 }
 
@@ -343,7 +127,7 @@ async function runTree(args) {
 // package.json
 var package_default = {
   name: "@fumadocs/cli",
-  version: "1.1.0",
+  version: "1.2.0",
   description: "The CLI tool for Fumadocs",
   keywords: [
     "NextJs",
@@ -378,16 +162,16 @@ var package_default = {
   dependencies: {
     "@clack/prompts": "^0.11.0",
     commander: "^14.0.2",
-    "package-manager-detector": "^1.5.0",
+    "package-manager-detector": "^1.6.0",
     picocolors: "^1.1.1",
     tinyexec: "^1.0.2",
     "ts-morph": "^27.0.2",
-    zod: "^4.1.12"
+    zod: "^4.2.1"
   },
   devDependencies: {
-    "@types/node": "24.10.1",
+    "@types/node": "24.10.2",
     "eslint-config-custom": "workspace:*",
-    shadcn: "3.5.0",
+    shadcn: "3.6.2",
     tsconfig: "workspace:*"
   },
   publishConfig: {
@@ -396,20 +180,209 @@ var package_default = {
 };
 
 // src/commands/customise.ts
-import { cancel, group, intro as intro2, log as log3, outro as outro3, select } from "@clack/prompts";
+import { cancel, group, intro as intro2, log as log4, outro as outro3, select } from "@clack/prompts";
 import picocolors2 from "picocolors";
 
 // src/commands/add.ts
 import {
   intro,
   isCancel as isCancel3,
-  log as log2,
+  log as log3,
   multiselect,
   outro as outro2,
   spinner as spinner2
 } from "@clack/prompts";
 import picocolors from "picocolors";
 
+// src/registry/installer/index.ts
+import path4 from "path";
+import fs5 from "fs/promises";
+import { confirm as confirm2, isCancel as isCancel2, log as log2, outro } from "@clack/prompts";
+
+// src/utils/typescript.ts
+import { Project } from "ts-morph";
+function createEmptyProject() {
+  return new Project({
+    compilerOptions: {}
+  });
+}
+
+// src/constants.ts
+var typescriptExtensions = [".ts", ".tsx", ".js", ".jsx"];
+
+// src/utils/ast.ts
+import path2 from "path";
+function toImportSpecifier(sourceFile, referenceFile) {
+  const extname = path2.extname(referenceFile);
+  const removeExt = typescriptExtensions.includes(extname);
+  let importPath = path2.relative(
+    path2.dirname(sourceFile),
+    removeExt ? referenceFile.substring(0, referenceFile.length - extname.length) : referenceFile
+  ).replaceAll(path2.sep, "/");
+  if (removeExt && importPath.endsWith("/index")) {
+    importPath = importPath.slice(0, -"/index".length);
+  }
+  return importPath.startsWith("../") ? importPath : `./${importPath}`;
+}
+
+// src/registry/schema.ts
+import { z as z2 } from "zod";
+var namespaces = [
+  "components",
+  "lib",
+  "css",
+  "route",
+  "ui",
+  "block"
+];
+var indexSchema = z2.object({
+  name: z2.string(),
+  title: z2.string().optional(),
+  description: z2.string().optional()
+});
+var fileSchema = z2.object({
+  type: z2.literal(namespaces),
+  path: z2.string(),
+  target: z2.string().optional(),
+  content: z2.string()
+});
+var httpSubComponent = z2.object({
+  type: z2.literal("http"),
+  baseUrl: z2.string(),
+  component: z2.string()
+});
+var componentSchema = z2.object({
+  name: z2.string(),
+  title: z2.string().optional(),
+  description: z2.string().optional(),
+  files: z2.array(fileSchema),
+  dependencies: z2.record(z2.string(), z2.string().or(z2.null())),
+  devDependencies: z2.record(z2.string(), z2.string().or(z2.null())),
+  /**
+   * list of sub components, either local (component name) or remote (registry info & component name)
+   */
+  subComponents: z2.array(z2.string().or(httpSubComponent)).default([])
+});
+var registryInfoSchema = z2.object({
+  /**
+   * define used variables, variables can be referenced in the import specifiers of component files.
+   */
+  variables: z2.record(
+    z2.string(),
+    z2.object({
+      description: z2.string().optional(),
+      default: z2.unknown().optional()
+    })
+  ).optional(),
+  /**
+   * provide variables to sub components
+   */
+  env: z2.record(z2.string(), z2.unknown()).optional(),
+  indexes: z2.array(indexSchema).default([]),
+  registries: z2.array(z2.string()).optional()
+});
+
+// src/registry/client.ts
+import path3 from "path";
+import fs3 from "fs/promises";
+import { log } from "@clack/prompts";
+
+// src/utils/cache.ts
+var AsyncCache = class {
+  constructor() {
+    this.store = /* @__PURE__ */ new Map();
+  }
+  cached(key, fn) {
+    let cached = this.store.get(key);
+    if (cached !== void 0) return cached;
+    cached = fn();
+    this.store.set(key, cached);
+    return cached;
+  }
+};
+
+// src/registry/client.ts
+var fetchCache = new AsyncCache();
+var HttpRegistryClient = class _HttpRegistryClient {
+  constructor(baseUrl, config) {
+    this.baseUrl = baseUrl;
+    this.config = config;
+    this.registryId = baseUrl;
+  }
+  async fetchRegistryInfo(baseUrl = this.baseUrl) {
+    const url = new URL("_registry.json", `${baseUrl}/`);
+    return fetchCache.cached(url.href, async () => {
+      const res = await fetch(url);
+      if (!res.ok) {
+        throw new Error(`failed to fetch ${url.href}: ${res.statusText}`);
+      }
+      return registryInfoSchema.parse(await res.json());
+    });
+  }
+  async fetchComponent(name) {
+    const url = new URL(`${name}.json`, `${this.baseUrl}/`);
+    return fetchCache.cached(url.href, async () => {
+      const res = await fetch(`${this.baseUrl}/${name}.json`);
+      if (!res.ok) {
+        log.error(`component ${name} not found at ${url.href}`);
+        throw new Error(await res.text());
+      }
+      return componentSchema.parse(await res.json());
+    });
+  }
+  async hasComponent(name) {
+    const url = new URL(`${name}.json`, `${this.baseUrl}/`);
+    const res = await fetch(url, { method: "HEAD" });
+    return res.ok;
+  }
+  createLinkedRegistryClient(name) {
+    return new _HttpRegistryClient(`${this.baseUrl}/${name}`, this.config);
+  }
+};
+var LocalRegistryClient = class _LocalRegistryClient {
+  constructor(dir, config) {
+    this.dir = dir;
+    this.config = config;
+    this.registryId = dir;
+  }
+  async fetchRegistryInfo(dir = this.dir) {
+    if (this.registryInfo) return this.registryInfo;
+    const filePath = path3.join(dir, "_registry.json");
+    const out = await fs3.readFile(filePath).then((res) => JSON.parse(res.toString())).catch((e) => {
+      throw new Error(`failed to resolve local file "${filePath}"`, {
+        cause: e
+      });
+    });
+    return this.registryInfo = registryInfoSchema.parse(out);
+  }
+  async fetchComponent(name) {
+    const filePath = path3.join(this.dir, `${name}.json`);
+    const out = await fs3.readFile(filePath).then((res) => JSON.parse(res.toString())).catch((e) => {
+      log.error(`component ${name} not found at ${filePath}`);
+      throw e;
+    });
+    return componentSchema.parse(out);
+  }
+  async hasComponent(name) {
+    const filePath = path3.join(this.dir, `${name}.json`);
+    try {
+      await fs3.stat(filePath);
+      return true;
+    } catch {
+      return false;
+    }
+  }
+  createLinkedRegistryClient(name) {
+    return new _LocalRegistryClient(path3.join(this.dir, name), this.config);
+  }
+};
+
+// src/registry/installer/index.ts
+import { x as x3 } from "tinyexec";
+
+// src/registry/installer/dep-manager.ts
+import fs4 from "fs/promises";
+
 // src/utils/get-package-manager.ts
 import { detect } from "package-manager-detector";
 async function getPackageManager() {
@@ -417,95 +390,266 @@ async function getPackageManager() {
   return result?.name ?? "npm";
 }
 
-// src/utils/add/install-deps.ts
-import { confirm as confirm2, isCancel as isCancel2, spinner } from "@clack/prompts";
+// src/registry/installer/dep-manager.ts
+import { confirm, isCancel, spinner } from "@clack/prompts";
 import { x as x2 } from "tinyexec";
-
-// src/utils/add/get-deps.ts
-import fs4 from "fs/promises";
-async function getDeps() {
-  const dependencies = /* @__PURE__ */ new Map();
-  if (!await exists("package.json")) return dependencies;
-  const content = await fs4.readFile("package.json");
-  const parsed = JSON.parse(content.toString());
-  if ("dependencies" in parsed && typeof parsed.dependencies === "object") {
-    const records = parsed.dependencies;
-    Object.entries(records).forEach(([k, v]) => {
-      dependencies.set(k, v);
-    });
+var DependencyManager = class {
+  /**
+   * Get dependencies from `package.json`
+   */
+  async getDeps() {
+    if (this.cachedInstalledDeps) return this.cachedInstalledDeps;
+    const dependencies = /* @__PURE__ */ new Map();
+    if (!await exists("package.json")) return dependencies;
+    const content = await fs4.readFile("package.json");
+    const parsed = JSON.parse(content.toString());
+    if ("dependencies" in parsed && typeof parsed.dependencies === "object") {
+      const records = parsed.dependencies;
+      for (const [k, v] of Object.entries(records)) {
+        dependencies.set(k, v);
+      }
+    }
+    if ("devDependencies" in parsed && typeof parsed.devDependencies === "object") {
+      const records = parsed.devDependencies;
+      for (const [k, v] of Object.entries(records)) {
+        dependencies.set(k, v);
+      }
+    }
+    return this.cachedInstalledDeps = dependencies;
   }
-  if ("devDependencies" in parsed && typeof parsed.devDependencies === "object") {
-    const records = parsed.devDependencies;
-    Object.entries(records).forEach(([k, v]) => {
-      dependencies.set(k, v);
-    });
+  async resolveInstallDependencies(deps) {
+    const cachedInstalledDeps = await this.getDeps();
+    return Object.entries(deps).filter(([k]) => !cachedInstalledDeps.has(k)).map(([k, v]) => v === null || v.length === 0 ? k : `${k}@${v}`);
   }
-  return dependencies;
-}
-
-// src/utils/add/install-deps.ts
-async function installDeps(deps, devDeps) {
-  const installed = await getDeps();
-  function toList(deps2) {
-    return Object.entries(deps2).filter(([k]) => !installed.has(k)).map(([k, v]) => v === null || v.length === 0 ? k : `${k}@${v}`);
-  }
-  const items = toList(deps);
-  const devItems = toList(devDeps);
-  if (items.length > 0 || devItems.length > 0) {
+  async installDeps(deps, devDeps) {
+    const items = await this.resolveInstallDependencies(deps);
+    const devItems = await this.resolveInstallDependencies(devDeps);
+    if (items.length === 0 && devItems.length === 0) return;
     const manager = await getPackageManager();
-    const value = await confirm2({
+    const value = await confirm({
       message: `Do you want to install with ${manager}?
 ${[...items, ...devItems].map((v) => `- ${v}`).join("\n")}`
     });
-    if (isCancel2(value)) {
+    if (isCancel(value) || !value) {
       return;
     }
-    if (value) {
-      const spin = spinner();
-      spin.start("Installing dependencies...");
-      if (items.length > 0) await x2(manager, ["install", ...items]);
-      if (devItems.length > 0) await x2(manager, ["install", ...devItems, "-D"]);
-      spin.stop("Dependencies installed.");
+    const spin = spinner();
+    spin.start("Installing dependencies...");
+    if (items.length > 0) await x2(manager, ["install", ...items]);
+    if (devItems.length > 0) await x2(manager, ["install", ...devItems, "-D"]);
+    spin.stop("Dependencies installed.");
+  }
+};
+
+// src/registry/installer/index.ts
+var ComponentInstaller = class {
+  constructor(rootClient, plugins = []) {
+    this.rootClient = rootClient;
+    this.plugins = plugins;
+    this.project = createEmptyProject();
+    this.installedFiles = /* @__PURE__ */ new Set();
+    this.downloadCache = new AsyncCache();
+    this.dependencies = {};
+    this.devDependencies = {};
+    this.pathToFileCache = new AsyncCache();
+  }
+  async install(name) {
+    let downloaded;
+    const info = await this.rootClient.fetchRegistryInfo();
+    for (const registry of info.registries ?? []) {
+      if (name.startsWith(`${registry}/`)) {
+        downloaded = await this.download(
+          name.slice(registry.length + 1),
+          this.rootClient.createLinkedRegistryClient(registry)
+        );
+        break;
+      }
+    }
+    downloaded ??= await this.download(name, this.rootClient);
+    for (const item of downloaded) {
+      Object.assign(this.dependencies, item.dependencies);
+      Object.assign(this.devDependencies, item.devDependencies);
+    }
+    for (const comp of downloaded) {
+      for (const file of comp.files) {
+        const outPath = this.resolveOutputPath(file);
+        if (this.installedFiles.has(outPath)) continue;
+        this.installedFiles.add(outPath);
+        const output = typescriptExtensions.includes(path4.extname(outPath)) ? await this.transform(name, file, comp, downloaded) : file.content;
+        const status = await fs5.readFile(outPath).then((res) => {
+          if (res.toString() === output) return "ignore";
+          return "need-update";
+        }).catch(() => "write");
+        if (status === "ignore") continue;
+        if (status === "need-update") {
+          const override = await confirm2({
+            message: `Do you want to override ${outPath}?`,
+            initialValue: false
+          });
+          if (isCancel2(override)) {
+            outro("Ended");
+            process.exit(0);
+          }
+          if (!override) continue;
+        }
+        await fs5.mkdir(path4.dirname(outPath), { recursive: true });
+        await fs5.writeFile(outPath, output);
+        log2.step(`downloaded ${outPath}`);
+      }
+    }
+  }
+  async installDeps() {
+    await new DependencyManager().installDeps(
+      this.dependencies,
+      this.devDependencies
+    );
+  }
+  async onEnd() {
+    const config = this.rootClient.config;
+    if (config.commands.format) {
+      await x3(config.commands.format);
     }
   }
-}
+  /**
+   * return a list of components, merged with child components & variables.
+   */
+  async download(name, client, contextVariables) {
+    const hash = `${client.registryId} ${name}`;
+    const info = await client.fetchRegistryInfo();
+    const variables = { ...contextVariables, ...info.env };
+    for (const [k, v] of Object.entries(info.variables ?? {})) {
+      variables[k] ??= v.default;
+    }
+    const out = await this.downloadCache.cached(hash, async () => {
+      const comp = await client.fetchComponent(name);
+      const result = [comp];
+      this.downloadCache.store.set(hash, result);
+      const child = await Promise.all(
+        comp.subComponents.map((sub) => {
+          if (typeof sub === "string") return this.download(sub, client);
+          const baseUrl = this.rootClient instanceof HttpRegistryClient ? new URL(sub.baseUrl, `${this.rootClient.baseUrl}/`).href : sub.baseUrl;
+          return this.download(
+            sub.component,
+            new HttpRegistryClient(baseUrl, client.config),
+            variables
+          );
+        })
+      );
+      for (const sub of child) result.push(...sub);
+      return result;
+    });
+    return out.map((file) => ({ ...file, variables }));
+  }
+  async transform(taskId, file, component, allComponents) {
+    const filePath = this.resolveOutputPath(file);
+    const sourceFile = this.project.createSourceFile(filePath, file.content, {
+      overwrite: true
+    });
+    const prefix = "@/";
+    const variables = Object.entries(component.variables ?? {});
+    const pathToFile = await this.pathToFileCache.cached(taskId, () => {
+      const map = /* @__PURE__ */ new Map();
+      for (const comp of allComponents) {
+        for (const file2 of comp.files) map.set(file2.target ?? file2.path, file2);
+      }
+      return map;
+    });
+    for (const specifier of sourceFile.getImportStringLiterals()) {
+      for (const [k, v] of variables) {
+        specifier.setLiteralValue(
+          specifier.getLiteralValue().replaceAll(`<${k}>`, v)
+        );
+      }
+      if (specifier.getLiteralValue().startsWith(prefix)) {
+        const lookup = specifier.getLiteralValue().substring(prefix.length);
+        const target = pathToFile.get(lookup);
+        if (target) {
+          specifier.setLiteralValue(
+            toImportSpecifier(filePath, this.resolveOutputPath(target))
+          );
+        } else {
+          console.warn(`cannot find the referenced file of ${specifier}`);
+        }
+      }
+    }
+    for (const plugin of this.plugins) {
+      await plugin.transform?.({
+        file: sourceFile,
+        componentFile: file,
+        component
+      });
+    }
+    return sourceFile.getFullText();
+  }
+  resolveOutputPath(file) {
+    const config = this.rootClient.config;
+    const dir = {
+      components: config.aliases.componentsDir,
+      block: config.aliases.blockDir,
+      ui: config.aliases.uiDir,
+      css: config.aliases.cssDir,
+      lib: config.aliases.libDir,
+      route: "./"
+    }[file.type];
+    if (file.target) {
+      return path4.join(config.baseDir, file.target.replace("<dir>", dir));
+    }
+    return path4.join(config.baseDir, dir, path4.basename(file.path));
+  }
+};
+
+// src/commands/shared.ts
+var UIRegistries = {
+  "base-ui": "fumadocs/base-ui",
+  "radix-ui": "fumadocs/radix-ui"
+};
 
 // src/commands/add.ts
-async function add(input, resolver, config) {
-  const installer = createComponentInstaller({
-    resolver,
-    config
-  });
-  let target = input;
+async function add(input, client) {
+  const config = client.config;
+  let target;
+  const installer = new ComponentInstaller(client);
+  const registry = UIRegistries[config.uiLibrary];
   if (input.length === 0) {
     const spin = spinner2();
     spin.start("fetching registry");
-    const indexes = validateRegistryIndex(
-      await resolver("_registry.json").catch((e) => {
-        log2.error(String(e));
-        process.exit(1);
-      })
-    );
+    const info = await client.fetchRegistryInfo();
+    const options = [];
+    for (const item of info.indexes) {
+      options.push({
+        label: item.title ?? item.name,
+        value: item.name,
+        hint: item.description
+      });
+    }
+    const { indexes } = await client.createLinkedRegistryClient(registry).fetchRegistryInfo();
+    for (const item of indexes) {
+      options.push({
+        label: item.title ?? item.name,
+        value: `${registry}/${item.name}`,
+        hint: item.description
+      });
+    }
     spin.stop(picocolors.bold(picocolors.greenBright("registry fetched")));
     const value = await multiselect({
       message: "Select components to install",
-      options: indexes.map((item) => ({
-        label: item.title,
-        value: item.name,
-        hint: item.description
-      }))
+      options
     });
     if (isCancel3(value)) {
       outro2("Ended");
       return;
     }
     target = value;
+  } else {
+    target = await Promise.all(
+      input.map(
+        async (item) => await client.hasComponent(item) ? item : `${registry}/${item}`
+      )
+    );
   }
   await install(target, installer);
 }
 async function install(target, installer) {
-  const dependencies = {};
-  const devDependencies = {};
   for (const name of target) {
     intro(
       picocolors.bold(
@@ -513,27 +657,24 @@ async function install(target, installer) {
       )
     );
     try {
-      const output = await installer.install(name);
-      Object.assign(dependencies, output.dependencies);
-      Object.assign(devDependencies, output.devDependencies);
+      await installer.install(name);
       outro2(picocolors.bold(picocolors.greenBright(`${name} installed`)));
     } catch (e) {
-      log2.error(String(e));
+      log3.error(String(e));
       throw e;
     }
   }
   intro(picocolors.bold("New Dependencies"));
-  await installDeps(dependencies, devDependencies);
+  await installer.installDeps();
+  await installer.onEnd();
   outro2(picocolors.bold(picocolors.greenBright("Successful")));
 }
 
 // src/commands/customise.ts
-async function customise(resolver, config) {
+async function customise(client) {
   intro2(picocolors2.bgBlack(picocolors2.whiteBright("Customise Fumadocs UI")));
-  const installer = createComponentInstaller({
-    resolver,
-    config
-  });
+  const config = client.config;
+  const installer = new ComponentInstaller(client);
   const result = await group(
     {
       target: () => select({
@@ -582,13 +723,14 @@ async function customise(resolver, config) {
       }
     }
   );
+  const registry = UIRegistries[config.uiLibrary];
   if (result.target === "docs") {
     const targets = [];
     if (result.mode === "minimal") {
-      targets.push("layouts/docs-min");
+      targets.push("fumadocs/ui/layouts/docs-min");
     } else {
       targets.push(
-        result.mode === "full-default" ? "layouts/docs" : "layouts/notebook"
+        result.mode === "full-default" ? `${registry}/layouts/docs` : `${registry}/layouts/notebook`
       );
     }
     await install(targets, installer);
@@ -605,14 +747,14 @@ async function customise(resolver, config) {
     printNext(...maps);
   }
   if (result.target === "home") {
-    await install(["layouts/home"], installer);
+    await install([`${registry}/layouts/home`], installer);
     printNext(["fumadocs-ui/layouts/home", `@/components/layout/home`]);
   }
   outro3(picocolors2.bold("Have fun!"));
 }
 function printNext(...maps) {
   intro2(picocolors2.bold("What is Next?"));
-  log3.info(
+  log4.info(
     [
       "You can check the installed components in `components`.",
       picocolors2.dim("---"),
@@ -634,17 +776,24 @@ program.name("fumadocs").description("CLI to setup Fumadocs, init a config").ver
   }
 });
 program.command("customise").alias("customize").description("simple way to customise layouts with Fumadocs UI").option("--dir <string>", "the root url or directory to resolve registry").action(async (options) => {
-  const resolver = getResolverFromDir(options.dir);
-  await customise(resolver, await createOrLoadConfig(options.config));
+  await customise(
+    createClientFromDir(
+      options.dir,
+      await createOrLoadConfig(options.config)
+    )
+  );
 });
 var dirShortcuts = {
-  ":dev": "https://preview.fumadocs.dev/registry",
-  ":localhost": "http://localhost:3000/registry"
+  ":preview": "https://preview.fumadocs.dev/registry",
+  ":dev": "http://localhost:3000/registry"
 };
 program.command("add").description("add a new component to your docs").argument("[components...]", "components to download").option("--dir <string>", "the root url or directory to resolve registry").action(
   async (input, options) => {
-    const resolver = getResolverFromDir(options.dir);
-    await add(input, resolver, await createOrLoadConfig(options.config));
+    const client = createClientFromDir(
+      options.dir,
+      await createOrLoadConfig(options.config)
+    );
+    await add(input, client);
   }
 );
 program.command("tree").argument(
@@ -664,17 +813,17 @@ program.command("tree").argument(
     } catch {
       nodes = await runTree(str ?? "./");
     }
-    const out = js || output && jsExtensions.includes(path4.extname(output)) ? treeToJavaScript(nodes, noRoot, importName) : treeToMdx(nodes, noRoot);
+    const out = js || output && jsExtensions.includes(path5.extname(output)) ? treeToJavaScript(nodes, noRoot, importName) : treeToMdx(nodes, noRoot);
     if (output) {
-      await fs5.mkdir(path4.dirname(output), { recursive: true });
-      await fs5.writeFile(output, out);
+      await fs6.mkdir(path5.dirname(output), { recursive: true });
+      await fs6.writeFile(output, out);
     } else {
       console.log(out);
     }
   }
 );
-function getResolverFromDir(dir = "https://fumadocs.dev/registry") {
+function createClientFromDir(dir = "https://fumadocs.dev/registry", config) {
   if (dir in dirShortcuts) dir = dirShortcuts[dir];
-  return dir.startsWith("http://") || dir.startsWith("https://") ? remoteResolver(dir) : localResolver(dir);
+  return dir.startsWith("http://") || dir.startsWith("https://") ? new HttpRegistryClient(dir, config) : new LocalRegistryClient(dir, config);
 }
 program.parse();