getRegistryItemFile() — ui Function Reference

Architecture documentation for the getRegistryItemFile() function in route.ts from the ui codebase.

Function typescript DesignEngine StateManagement calls 1 called by 1

Entity Profile

DesignEngine→ StateManagement→ getRegistryItemFile() — ui Function Reference

Dependency Diagram

graph TD
  883da9d7_d65a_9fb0_bb2c_8fa923c8fb02["getRegistryItemFile()"]
  2306a3f2_6413_2045_0888_633ffb84f9ee["route.ts"]
  883da9d7_d65a_9fb0_bb2c_8fa923c8fb02 -->|defined in| 2306a3f2_6413_2045_0888_633ffb84f9ee
  719cc2c8_7eb3_0bdf_dba1_ef9bc67fdd74["buildComponentFiles()"]
  719cc2c8_7eb3_0bdf_dba1_ef9bc67fdd74 -->|calls| 883da9d7_d65a_9fb0_bb2c_8fa923c8fb02
  3027f0e2_62a8_b39f_5810_4976d61dd799["transformFileContent()"]
  883da9d7_d65a_9fb0_bb2c_8fa923c8fb02 -->|calls| 3027f0e2_62a8_b39f_5810_4976d61dd799
  style 883da9d7_d65a_9fb0_bb2c_8fa923c8fb02 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/app/(create)/create/v0/route.ts lines 282–348

async function getRegistryItemFile(
  name: string,
  designSystemConfig: DesignSystemConfig
) {
  const response = await fetch(
    `${process.env.NEXT_PUBLIC_APP_URL}/r/styles/${designSystemConfig.base}-${designSystemConfig.style}/${name}.json`
  )

  if (!response.ok) {
    throw new Error(`Failed to fetch registry item: ${response.statusText}`)
  }

  const json = await response.json()
  const item = registryItemSchema.parse(json)

  // Build a v0 config i.e components.json
  const config = {
    $schema: "https://ui.shadcn.com/schema.json",
    style: `${designSystemConfig.base}-${designSystemConfig.style}`,
    rsc: true,
    tsx: true,
    tailwind: {
      config: "",
      css: "app/globals.css",
      baseColor: designSystemConfig.baseColor,
      cssVariables: true,
      prefix: "",
    },
    iconLibrary: designSystemConfig.iconLibrary,
    aliases: {
      components: "@/components",
      utils: "@/lib/utils",
      ui: "@/components/ui",
      lib: "@/lib",
      hooks: "@/hooks",
    },
    menuAccent: designSystemConfig.menuAccent,
    menuColor: designSystemConfig.menuColor,
    resolvedPaths: {
      cwd: "/",
      tailwindConfig: "./tailwind.config.js",
      tailwindCss: "./globals.css",
      utils: "./lib/utils",
      components: "./components",
      lib: "./lib",
      hooks: "./hooks",
      ui: "./components/ui",
    },
  } satisfies z.infer<typeof configSchema>

  const file = item.files?.[0]
  if (!file?.content) {
    return null
  }

  const content = await transformFileContent(file.content, config)

  return {
    ...file,
    target:
      name === "example"
        ? "components/example.tsx"
        : `components/ui/${name}.tsx`,
    type: name === "example" ? "registry:component" : "registry:ui",
    content,
  }
}