feat(shadcn): update file handling for monorepo (#7955)

* feat(shadcn): update monorepo handling

* feat(shadcn): update file handling for monorepo

* chore: changeset

Author: shadcn

.changeset/hungry-melons-press.md

@@ -0,0 +1,5 @@
+---
+"shadcn": minor
+---
+
+update file handling for monorepo

packages/shadcn/src/utils/add-components.ts

@@ -1,12 +1,5 @@
 import path from "path"
-import {
-  fetchRegistry,
-  getRegistryItem,
-  getRegistryParentMap,
-  getRegistryTypeAliasMap,
-  registryResolveItemsTree,
-  resolveRegistryItems,
-} from "@/src/registry/api"
+import { getRegistryItem, registryResolveItemsTree } from "@/src/registry/api"
 import {
   configSchema,
   registryItemFileSchema,
@@ -158,132 +151,143 @@ async function addWorkspaceComponents(
   const registrySpinner = spinner(`Checking registry.`, {
     silent: options.silent,
   })?.start()
-  let registryItems = await resolveRegistryItems(components, config)
-  let result = await fetchRegistry(registryItems)
-  const payload = z.array(registryItemSchema).parse(result)
-  if (!payload) {
+  const tree = await registryResolveItemsTree(components, config)
+
+  if (!tree) {
     registrySpinner?.fail()
     return handleError(new Error("Failed to fetch components from registry."))
   }
-  registrySpinner?.succeed()
-
-  const registryParentMap = getRegistryParentMap(payload)
-  const registryTypeAliasMap = getRegistryTypeAliasMap()
-
-  const filesCreated: string[] = []
-  const filesUpdated: string[] = []
-  const filesSkipped: string[] = []
 
-  const files = payload.flatMap((item) => item.files ?? [])
   try {
-    validateFilesTarget(files, config.resolvedPaths.cwd)
+    validateFilesTarget(tree.files ?? [], config.resolvedPaths.cwd)
   } catch (error) {
+    registrySpinner?.fail()
     return handleError(error)
   }
 
-  const rootSpinner = spinner(`Installing components.`)?.start()
+  registrySpinner?.succeed()
 
-  for (const component of payload) {
-    const alias = registryTypeAliasMap.get(component.type)
-    const registryParent = registryParentMap.get(component.name)
+  const filesCreated: string[] = []
+  const filesUpdated: string[] = []
+  const filesSkipped: string[] = []
 
-    // We don't support this type of component.
-    if (!alias) {
-      continue
-    }
+  const rootSpinner = spinner(`Installing components.`)?.start()
 
-    // A good start is ui for now.
-    // TODO: Add support for other types.
-    let targetConfig =
-      component.type === "registry:ui" || registryParent?.type === "registry:ui"
-        ? workspaceConfig.ui
-        : config
+  // Process global updates (tailwind, css vars, dependencies) first for the main target.
+  // These should typically go to the UI package in a workspace.
+  const mainTargetConfig = workspaceConfig.ui
+  const tailwindVersion = await getProjectTailwindVersionFromConfig(
+    mainTargetConfig
+  )
+  const workspaceRoot = findCommonRoot(
+    config.resolvedPaths.cwd,
+    mainTargetConfig.resolvedPaths.ui
+  )
 
-    const tailwindVersion = await getProjectTailwindVersionFromConfig(
-      targetConfig
+  // 1. Update tailwind config.
+  if (tree.tailwind?.config) {
+    await updateTailwindConfig(tree.tailwind?.config, mainTargetConfig, {
+      silent: true,
+      tailwindVersion,
+    })
+    filesUpdated.push(
+      path.relative(
+        workspaceRoot,
+        mainTargetConfig.resolvedPaths.tailwindConfig
+      )
     )
+  }
 
-    const workspaceRoot = findCommonRoot(
-      config.resolvedPaths.cwd,
-      targetConfig.resolvedPaths.ui
+  // 2. Update css vars.
+  if (tree.cssVars) {
+    const overwriteCssVars = await shouldOverwriteCssVars(components, config)
+    await updateCssVars(tree.cssVars, mainTargetConfig, {
+      silent: true,
+      tailwindVersion,
+      tailwindConfig: tree.tailwind?.config,
+      overwriteCssVars,
+    })
+    filesUpdated.push(
+      path.relative(workspaceRoot, mainTargetConfig.resolvedPaths.tailwindCss)
     )
-    const packageRoot =
-      (await findPackageRoot(workspaceRoot, targetConfig.resolvedPaths.cwd)) ??
-      targetConfig.resolvedPaths.cwd
-
-    // 1. Update tailwind config.
-    if (component.tailwind?.config) {
-      await updateTailwindConfig(component.tailwind?.config, targetConfig, {
-        silent: true,
-        tailwindVersion,
-      })
-      filesUpdated.push(
-        path.relative(workspaceRoot, targetConfig.resolvedPaths.tailwindConfig)
-      )
-    }
+  }
 
-    // 2. Update css vars.
-    if (component.cssVars) {
-      const overwriteCssVars = await shouldOverwriteCssVars(components, config)
-      await updateCssVars(component.cssVars, targetConfig, {
-        silent: true,
-        tailwindVersion,
-        tailwindConfig: component.tailwind?.config,
-        overwriteCssVars,
-      })
-      filesUpdated.push(
-        path.relative(workspaceRoot, targetConfig.resolvedPaths.tailwindCss)
-      )
-    }
+  // 3. Update CSS
+  if (tree.css) {
+    await updateCss(tree.css, mainTargetConfig, {
+      silent: true,
+    })
+    filesUpdated.push(
+      path.relative(workspaceRoot, mainTargetConfig.resolvedPaths.tailwindCss)
+    )
+  }
 
-    // 3. Update CSS
-    if (component.css) {
-      await updateCss(component.css, targetConfig, {
-        silent: true,
-      })
-      filesUpdated.push(
-        path.relative(workspaceRoot, targetConfig.resolvedPaths.tailwindCss)
-      )
+  // 4. Update environment variables
+  if (tree.envVars) {
+    await updateEnvVars(tree.envVars, mainTargetConfig, {
+      silent: true,
+    })
+  }
+
+  // 5. Update dependencies.
+  await updateDependencies(
+    tree.dependencies,
+    tree.devDependencies,
+    mainTargetConfig,
+    {
+      silent: true,
     }
+  )
+
+  // 6. Group files by their type to determine target config and update files.
+  const filesByType = new Map<string, typeof tree.files>()
 
-    // 4. Update environment variables
-    if (component.envVars) {
-      await updateEnvVars(component.envVars, targetConfig, {
-        silent: true,
-      })
+  for (const file of tree.files ?? []) {
+    const type = file.type || "registry:ui"
+    if (!filesByType.has(type)) {
+      filesByType.set(type, [])
     }
+    filesByType.get(type)!.push(file)
+  }
 
-    // 5. Update dependencies.
-    await updateDependencies(
-      component.dependencies,
-      component.devDependencies,
-      targetConfig,
-      {
-        silent: true,
-      }
+  // Process each type of component with its appropriate target config.
+  for (const type of Array.from(filesByType.keys())) {
+    const typeFiles = filesByType.get(type)!
+
+    let targetConfig = type === "registry:ui" ? workspaceConfig.ui : config
+
+    const typeWorkspaceRoot = findCommonRoot(
+      config.resolvedPaths.cwd,
+      targetConfig.resolvedPaths.ui || targetConfig.resolvedPaths.cwd
     )
+    const packageRoot =
+      (await findPackageRoot(
+        typeWorkspaceRoot,
+        targetConfig.resolvedPaths.cwd
+      )) ?? targetConfig.resolvedPaths.cwd
 
-    // 6. Update files.
-    const files = await updateFiles(component.files, targetConfig, {
+    // Update files for this type.
+    const files = await updateFiles(typeFiles, targetConfig, {
       overwrite: options.overwrite,
       silent: true,
       rootSpinner,
       isRemote: options.isRemote,
+      isWorkspace: true,
     })
 
     filesCreated.push(
       ...files.filesCreated.map((file) =>
-        path.relative(workspaceRoot, path.join(packageRoot, file))
+        path.relative(typeWorkspaceRoot, path.join(packageRoot, file))
       )
     )
     filesUpdated.push(
       ...files.filesUpdated.map((file) =>
-        path.relative(workspaceRoot, path.join(packageRoot, file))
+        path.relative(typeWorkspaceRoot, path.join(packageRoot, file))
       )
     )
     filesSkipped.push(
       ...files.filesSkipped.map((file) =>
-        path.relative(workspaceRoot, path.join(packageRoot, file))
+        path.relative(typeWorkspaceRoot, path.join(packageRoot, file))
       )
     )
   }
@@ -343,6 +347,10 @@ async function addWorkspaceComponents(
       logger.log(`  - ${file}`)
     }
   }
+
+  if (tree.docs) {
+    logger.info(tree.docs)
+  }
 }
 
 async function shouldOverwriteCssVars(