extractV3Base() — tailwindcss Function Reference

Architecture documentation for the extractV3Base() function in migrate-prefix.ts from the tailwindcss codebase.

Function typescript CommandLineInterface Codemods calls 1 called by 1

Entity Profile

CommandLineInterface→ Codemods→ extractV3Base() — tailwindcss Function Reference

Dependency Diagram

graph TD
  a5786cf3_5b2e_711a_6639_a1d182cf427d["extractV3Base()"]
  e4e5ac2c_0d58_689d_0ad6_7086823787f1["migrate-prefix.ts"]
  a5786cf3_5b2e_711a_6639_a1d182cf427d -->|defined in| e4e5ac2c_0d58_689d_0ad6_7086823787f1
  7a457be5_eaef_02ce_7bc4_4e0317ecd8ce["migratePrefix()"]
  7a457be5_eaef_02ce_7bc4_4e0317ecd8ce -->|calls| a5786cf3_5b2e_711a_6639_a1d182cf427d
  c58cbb33_f3cc_0b4f_844a_15bf66a1dc61["segment()"]
  a5786cf3_5b2e_711a_6639_a1d182cf427d -->|calls| c58cbb33_f3cc_0b4f_844a_15bf66a1dc61
  style a5786cf3_5b2e_711a_6639_a1d182cf427d fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/@tailwindcss-upgrade/src/codemods/template/migrate-prefix.ts lines 67–128

function extractV3Base(
  designSystem: DesignSystem,
  userConfig: Config,
  rawCandidate: string,
): { base: string; start: number; end: number } | null {
  if (!designSystem.theme.prefix) return null
  if (!userConfig.prefix)
    throw new Error(
      'Could not find the Tailwind CSS v3 `prefix` configuration inside the JavaScript config.',
    )

  // hover:focus:underline
  // ^^^^^ ^^^^^^           -> Variants
  //             ^^^^^^^^^  -> Base
  let rawVariants = segment(rawCandidate, ':')

  // SAFETY: At this point it is safe to use TypeScript's non-null assertion
  // operator because even if the `input` was an empty string, splitting an
  // empty string by `:` will always result in an array with at least one
  // element.
  let base = rawVariants.pop()!
  let start = rawCandidate.length - base.length
  let end = start + base.length

  let important = false
  let negative = false

  // Candidates that end with an exclamation mark are the important version with
  // higher specificity of the non-important candidate, e.g. `mx-4!`.
  if (base[base.length - 1] === '!') {
    important = true
    base = base.slice(0, -1)
  }

  // Legacy syntax with leading `!`, e.g. `!mx-4`.
  else if (base[0] === '!') {
    important = true
    base = base.slice(1)
  }

  // Candidates that start with a dash are the negative versions of another
  // candidate, e.g. `-mx-4`.
  if (base[0] === '-') {
    negative = true
    base = base.slice(1)
  }

  if (!base.startsWith(userConfig.prefix) && base[0] !== '[') {
    return null
  } else {
    if (base[0] !== '[') base = base.slice(userConfig.prefix.length)

    if (negative) base = '-' + base
    if (important) base += '!'

    return {
      base,
      start,
      end,
    }
  }
}