feat(cli): add support for custom ui dir (#2266)

* feat(cli): add support for custom ui dir

* docs(www): update docs for aliases.ui

* chore: add changeset

packages/cli/src/utils/get-config.ts

@@ -33,6 +33,7 @@ export const rawConfigSchema = z
     aliases: z.object({
       components: z.string(),
       utils: z.string(),
+      ui: z.string().optional(),
     }),
   })
   .strict()
@@ -45,6 +46,7 @@ export const configSchema = rawConfigSchema.extend({
     tailwindCss: z.string(),
     utils: z.string(),
     components: z.string(),
+    ui: z.string(),
   }),
 })
 
@@ -79,6 +81,9 @@ export async function resolveConfigPaths(cwd: string, config: RawConfig) {
       tailwindCss: path.resolve(cwd, config.tailwind.css),
       utils: await resolveImport(config.aliases["utils"], tsConfig),
       components: await resolveImport(config.aliases["components"], tsConfig),
+      ui: config.aliases["ui"]
+        ? await resolveImport(config.aliases["ui"], tsConfig)
+        : await resolveImport(config.aliases["components"], tsConfig),
     },
   })
 }

packages/cli/src/utils/registry/index.ts

@@ -117,11 +117,14 @@ export async function getItemTargetPath(
   item: Pick<z.infer<typeof registryItemWithContentSchema>, "type">,
   override?: string
 ) {
-  // Allow overrides for all items but ui.
-  if (override && item.type !== "components:ui") {
+  if (override) {
     return override
   }
 
+  if (item.type === "components:ui" && config.aliases.ui) {
+    return config.resolvedPaths.ui
+  }
+
   const [parent, type] = item.type.split(":")
   if (!(parent in config.resolvedPaths)) {
     return null

packages/cli/src/utils/transformers/transform-import.ts

@@ -8,12 +8,18 @@ export const transformImport: Transformer = async ({ sourceFile, config }) => {
 
     // Replace @/registry/[style] with the components alias.
     if (moduleSpecifier.startsWith("@/registry/")) {
-      importDeclaration.setModuleSpecifier(
-        moduleSpecifier.replace(
-          /^@\/registry\/[^/]+/,
-          config.aliases.components
+      if (config.aliases.ui) {
+        importDeclaration.setModuleSpecifier(
+          moduleSpecifier.replace(/^@\/registry\/[^/]+\/ui/, config.aliases.ui)
         )
-      )
+      } else {
+        importDeclaration.setModuleSpecifier(
+          moduleSpecifier.replace(
+            /^@\/registry\/[^/]+/,
+            config.aliases.components
+          )
+        )
+      }
     }
 
     // Replace `import { cn } from "@/lib/utils"`