migrateRadixFile() — ui Function Reference

Architecture documentation for the migrateRadixFile() function in migrate-radix.ts from the ui codebase.

Function typescript FrameworkTooling CLICore calls 2 called by 1

Entity Profile

FrameworkTooling→ CLICore→ migrateRadixFile() — ui Function Reference

Dependency Diagram

graph TD
  e943b775_1b94_05b2_d4e6_b95d2e09ee63["migrateRadixFile()"]
  f076b937_a1ba_1850_79d6_842fd49f9d02["migrate-radix.ts"]
  e943b775_1b94_05b2_d4e6_b95d2e09ee63 -->|defined in| f076b937_a1ba_1850_79d6_842fd49f9d02
  bdc06216_90b8_106e_0b22_5a7237bbb661["migrateRadix()"]
  bdc06216_90b8_106e_0b22_5a7237bbb661 -->|calls| e943b775_1b94_05b2_d4e6_b95d2e09ee63
  d94c1ad1_e6de_9d0f_c21f_d28b1bc23ecd["toPascalCase()"]
  e943b775_1b94_05b2_d4e6_b95d2e09ee63 -->|calls| d94c1ad1_e6de_9d0f_c21f_d28b1bc23ecd
  6298a932_872d_8bef_9e0f_e76cde4157c6["processNamedImports()"]
  e943b775_1b94_05b2_d4e6_b95d2e09ee63 -->|calls| 6298a932_872d_8bef_9e0f_e76cde4157c6
  style e943b775_1b94_05b2_d4e6_b95d2e09ee63 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/shadcn/src/migrations/migrate-radix.ts lines 269–455

export async function migrateRadixFile(
  content: string
): Promise<{ content: string; replacedPackages: string[] }> {
  // Enhanced regex to handle type-only imports, but exclude react-icons
  // Also capture optional semicolon at the end
  const radixImportPattern =
    /import\s+(?:(type)\s+)?(?:\*\s+as\s+(\w+)|{([^}]+)})\s+from\s+(["'])@radix-ui\/react-([^"']+)\4(;?)/g

  const imports: Array<{ name: string; alias?: string; isType?: boolean }> = []
  const linesToRemove: string[] = []
  const replacedPackages: string[] = []
  let quoteStyle = '"' // Default to double quotes
  let hasSemicolon = false // Track if any import had a semicolon

  let result = content
  let match

  // Find all Radix imports
  while ((match = radixImportPattern.exec(content)) !== null) {
    const [
      fullMatch,
      typeKeyword,
      namespaceAlias,
      namedImports,
      quote,
      packageName,
      semicolon,
    ] = match

    // Skip react-icons package and any sub-paths (like react-icons/dist/types)
    if (packageName === "icons" || packageName.startsWith("icons/")) {
      continue
    }

    linesToRemove.push(fullMatch)

    // Use the quote style and semicolon style from the first import
    if (linesToRemove.length === 1) {
      quoteStyle = quote
      hasSemicolon = semicolon === ";"
    }

    // Track which package we're replacing
    replacedPackages.push(`@radix-ui/react-${packageName}`)

    const isTypeOnly = Boolean(typeKeyword)

    if (namespaceAlias) {
      // Handle namespace imports: import * as DialogPrimitive from "@radix-ui/react-dialog"
      const componentName = toPascalCase(packageName)
      imports.push({
        name: componentName,
        alias: namespaceAlias,
        isType: isTypeOnly,
      })
    } else if (namedImports) {
      // Handle named imports: import { Root, Trigger } from "@radix-ui/react-dialog"
      // or import type { DialogProps } from "@radix-ui/react-dialog"
      // or import { type DialogProps, Root } from "@radix-ui/react-dialog"

      processNamedImports(namedImports, isTypeOnly, imports, packageName)
    }
  }

  if (imports.length === 0) {
    return {
      content,
      replacedPackages: [],
    }
  }

  // Remove duplicates.
  // Considering name, alias, and type status.
  const uniqueImports = imports.filter(
    (importName, index, self) =>
      index ===
      self.findIndex(
        (i) =>
          i.name === importName.name &&
          i.alias === importName.alias &&
          i.isType === importName.isType