Home / Function/ migrateAutomaticVarInjection() — tailwindcss Function Reference

migrateAutomaticVarInjection() — tailwindcss Function Reference

Architecture documentation for the migrateAutomaticVarInjection() function in migrate-automatic-var-injection.ts from the tailwindcss codebase.

Function typescript OxideCore Extractor calls 6

Entity Profile

Dependency Diagram

graph TD
  0d34c838_b3bc_b388_6b0d_17fe24312e5f["migrateAutomaticVarInjection()"]
  0bec5ca9_74c8_dcc7_ec12_6404fb6493bd["parseCandidate()"]
  0d34c838_b3bc_b388_6b0d_17fe24312e5f -->|calls| 0bec5ca9_74c8_dcc7_ec12_6404fb6493bd
  d36b0f78_79bb_ae15_f4f6_4a1b7f01d29f["cloneCandidate()"]
  0d34c838_b3bc_b388_6b0d_17fe24312e5f -->|calls| d36b0f78_79bb_ae15_f4f6_4a1b7f01d29f
  18d71693_71d1_81d2_e184_706f0fb3d889["isAutomaticVarInjectionException()"]
  0d34c838_b3bc_b388_6b0d_17fe24312e5f -->|calls| 18d71693_71d1_81d2_e184_706f0fb3d889
  529f2fd2_4c56_a018_3a52_f4d34e36e476["injectVar()"]
  0d34c838_b3bc_b388_6b0d_17fe24312e5f -->|calls| 529f2fd2_4c56_a018_3a52_f4d34e36e476
  8bcd32c5_cfda_22a4_547e_0b720e631669["injectVarIntoVariant()"]
  0d34c838_b3bc_b388_6b0d_17fe24312e5f -->|calls| 8bcd32c5_cfda_22a4_547e_0b720e631669
  4c29981d_a61a_00fb_b3b5_5a69228c4fff["printCandidate()"]
  0d34c838_b3bc_b388_6b0d_17fe24312e5f -->|calls| 4c29981d_a61a_00fb_b3b5_5a69228c4fff
  style 0d34c838_b3bc_b388_6b0d_17fe24312e5f fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/@tailwindcss-upgrade/src/codemods/template/migrate-automatic-var-injection.ts lines 8–74

export function migrateAutomaticVarInjection(
  designSystem: DesignSystem,
  _userConfig: Config | null,
  rawCandidate: string,
): string {
  for (let readonlyCandidate of designSystem.parseCandidate(rawCandidate)) {
    // The below logic makes extended use of mutation. Since candidates in the
    // DesignSystem are cached, we can't mutate them directly.
    let candidate = cloneCandidate(readonlyCandidate) as Writable<Candidate>

    let didChange = false

    // Add `var(…)` in modifier position, e.g.:
    //
    // `bg-red-500/[--my-opacity]` => `bg-red-500/[var(--my-opacity)]`
    if (
      'modifier' in candidate &&
      candidate.modifier?.kind === 'arbitrary' &&
      !isAutomaticVarInjectionException(designSystem, candidate, candidate.modifier.value)
    ) {
      let { value, didChange: modifierDidChange } = injectVar(candidate.modifier.value)
      candidate.modifier.value = value
      didChange ||= modifierDidChange
    }

    // Add `var(…)` to all variants, e.g.:
    //
    // `supports-[--test]:flex'` => `supports-[var(--test)]:flex`
    for (let variant of candidate.variants) {
      let didChangeVariant = injectVarIntoVariant(designSystem, variant)
      if (didChangeVariant) {
        didChange = true
      }
    }

    // Add `var(…)` to arbitrary candidates, e.g.:
    //
    // `[color:--my-color]` => `[color:var(--my-color)]`
    if (
      candidate.kind === 'arbitrary' &&
      !isAutomaticVarInjectionException(designSystem, candidate, candidate.value)
    ) {
      let { value, didChange: valueDidChange } = injectVar(candidate.value)
      candidate.value = value
      didChange ||= valueDidChange
    }

    // Add `var(…)` to arbitrary values for functional candidates, e.g.:
    //
    // `bg-[--my-color]` => `bg-[var(--my-color)]`
    if (
      candidate.kind === 'functional' &&
      candidate.value &&
      candidate.value.kind === 'arbitrary' &&
      !isAutomaticVarInjectionException(designSystem, candidate, candidate.value.value)
    ) {
      let { value, didChange: valueDidChange } = injectVar(candidate.value.value)
      candidate.value.value = value
      didChange ||= valueDidChange
    }

    if (didChange) {
      return designSystem.printCandidate(candidate)
    }
  }
  return rawCandidate
}

Domain

Subdomains

Calls

Source

Frequently Asked Questions

What does migrateAutomaticVarInjection() do?
migrateAutomaticVarInjection() is a function in the tailwindcss codebase.
What does migrateAutomaticVarInjection() call?
migrateAutomaticVarInjection() calls 6 function(s): cloneCandidate, injectVar, injectVarIntoVariant, isAutomaticVarInjectionException, parseCandidate, printCandidate.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free