Home / Function/ bareValueUtilities() — tailwindcss Function Reference

bareValueUtilities() — tailwindcss Function Reference

Architecture documentation for the bareValueUtilities() function in canonicalize-candidates.ts from the tailwindcss codebase.

Entity Profile

Dependency Diagram

graph TD
  4cc826cb_5fc2_520c_deeb_2b868c0401ed["bareValueUtilities()"]
  4c29981d_a61a_00fb_b3b5_5a69228c4fff["printCandidate()"]
  4cc826cb_5fc2_520c_deeb_2b868c0401ed -->|calls| 4c29981d_a61a_00fb_b3b5_5a69228c4fff
  c98bf5b0_e31e_f92d_3810_96d1e1308d34["parseCandidate()"]
  4cc826cb_5fc2_520c_deeb_2b868c0401ed -->|calls| c98bf5b0_e31e_f92d_3810_96d1e1308d34
  0aa64a1c_efd8_a69d_48ed_649b7a86c854["get()"]
  4cc826cb_5fc2_520c_deeb_2b868c0401ed -->|calls| 0aa64a1c_efd8_a69d_48ed_649b7a86c854
  style 4cc826cb_5fc2_520c_deeb_2b868c0401ed fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/tailwindcss/src/canonicalize-candidates.ts lines 1202–1273

function bareValueUtilities(candidate: Candidate, options: InternalCanonicalizeOptions): Candidate {
  // We are only interested in bare value utilities
  if (candidate.kind !== 'functional' || candidate.value?.kind !== 'named') {
    return candidate
  }

  let designSystem = options.designSystem
  let utilities = designSystem.storage[PRE_COMPUTED_UTILITIES_KEY].get(options.signatureOptions)
  let signatures = designSystem.storage[UTILITY_SIGNATURE_KEY].get(options.signatureOptions)

  let targetCandidateString = designSystem.printCandidate(candidate)

  // Compute the signature for the target candidate
  let targetSignature = signatures.get(targetCandidateString)
  if (typeof targetSignature !== 'string') return candidate

  // Try a few options to find a suitable replacement utility
  for (let replacementCandidate of tryReplacements(targetSignature, candidate)) {
    let replacementString = designSystem.printCandidate(replacementCandidate)
    let replacementSignature = signatures.get(replacementString)
    if (replacementSignature !== targetSignature) {
      continue
    }

    return replacementCandidate
  }

  return candidate

  function* tryReplacements(
    targetSignature: string,
    candidate: Extract<Candidate, { kind: 'functional' }>,
  ): Generator<Candidate> {
    // Find a corresponding utility for the same signature
    let replacements = utilities.get(targetSignature)

    // Multiple utilities can map to the same signature. Not sure how to migrate
    // this one so let's just skip it for now.
    //
    // TODO: Do we just migrate to the first one?
    if (replacements.length > 1) return

    // If we didn't find any replacement utilities, let's try to strip the
    // modifier and find a replacement then. If we do, we can try to re-add the
    // modifier later and verify if we have a valid migration.
    //
    // This is necessary because `text-red-500/50` will not be pre-computed,
    // only `text-red-500` will.
    if (replacements.length === 0 && candidate.modifier) {
      let candidateWithoutModifier = { ...candidate, modifier: null }
      let targetSignatureWithoutModifier = signatures.get(
        designSystem.printCandidate(candidateWithoutModifier),
      )
      if (typeof targetSignatureWithoutModifier === 'string') {
        for (let replacementCandidate of tryReplacements(
          targetSignatureWithoutModifier,
          candidateWithoutModifier,
        )) {
          yield Object.assign({}, replacementCandidate, { modifier: candidate.modifier })
        }
      }
    }

    // If only a single utility maps to the signature, we can use that as the
    // replacement.
    if (replacements.length === 1) {
      for (let replacementCandidate of parseCandidate(designSystem, replacements[0])) {
        yield replacementCandidate
      }
    }
  }
}

Domain

Subdomains

Frequently Asked Questions

What does bareValueUtilities() do?
bareValueUtilities() is a function in the tailwindcss codebase.
What does bareValueUtilities() call?
bareValueUtilities() calls 3 function(s): get, parseCandidate, printCandidate.

Analyze Your Own Codebase

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

Try Supermodel Free