buildLayoutFile() — ui Function Reference

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

Function typescript DesignEngine StateManagement called by 1

Entity Profile

DesignEngine→ StateManagement→ buildLayoutFile() — ui Function Reference

Dependency Diagram

graph TD
  478e88c6_041e_68dd_0add_701d1ecce8f5["buildLayoutFile()"]
  2306a3f2_6413_2045_0888_633ffb84f9ee["route.ts"]
  478e88c6_041e_68dd_0add_701d1ecce8f5 -->|defined in| 2306a3f2_6413_2045_0888_633ffb84f9ee
  99866bc1_a32a_eb11_ee85_68ceecc601f6["buildV0Payload()"]
  99866bc1_a32a_eb11_ee85_68ceecc601f6 -->|calls| 478e88c6_041e_68dd_0add_701d1ecce8f5
  style 478e88c6_041e_68dd_0add_701d1ecce8f5 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/app/(create)/create/v0/route.ts lines 167–210

function buildLayoutFile(designSystemConfig: DesignSystemConfig) {
  const font = fonts.find(
    (font) => font.name === `font-${designSystemConfig.font}`
  )
  if (!font) {
    throw new Error(`Font "${designSystemConfig.font}" not found`)
  }

  const content = dedent`
    import type { Metadata } from "next";
    import { ${font.font.import} } from "next/font/google";
    import "./globals.css";

    const fontSans = ${font.font.import}({subsets:['latin'],variable:'--font-sans'});

    export const metadata: Metadata = {
      title: "Create Next App",
      description: "Generated by create next app",
    };

    export default function RootLayout({
      children,
    }: Readonly<{
      children: React.ReactNode;
    }>) {
      return (
        <html lang="en" className={fontSans.variable}>
          <body
            className="antialiased"
          >
            {children}
          </body>
        </html>
      );
    }
  `

  return registryItemFileSchema.parse({
    path: "app/layout.tsx",
    type: "registry:page",
    target: "app/layout.tsx",
    content,
  })
}