Repository: tailwindlabs/tailwindcss
File: packages/tailwindcss/src/compile.ts (TypeScript)

Code before:
  }

  // Sort the variants
  let variants = designSystem.getUsedVariants().sort((a, z) => {
    return designSystem.variants.compare(a, z)
  })

  // Create the AST
  for (let [rawCandidate, candidates] of matches) {
    let found = false

    for (let candidate of candidates) {
      let rules = designSystem.compileAstNodes(candidate)
      if (rules.length === 0) continue

      // Arbitrary values (`text-[theme(--color-red-500)]`) and arbitrary
      // properties (`[--my-var:theme(--color-red-500)]`) can contain function
      // calls so we need evaluate any functions we find there that weren't in
      // the source CSS.
      try {
        substituteFunctions(
          rules.map(({ node }) => node),
          designSystem.resolveThemeValue,
        )
      } catch (err) {
        // If substitution fails then the candidate liekly contains a call to
        // `theme()` that is invalid which may be because of incorrect usage,
        // invalid arguments, or a theme key that does not exist.
        continue
      }

      found = true

      for (let { node, propertySort } of rules) {
        // Track the variant order which is a number with each bit representing a
        // variant. This allows us to sort the rules based on the order of
        // variants used.
        let variantOrder = 0n
        for (let variant of candidate.variants) {
          variantOrder |= 1n << BigInt(variants.indexOf(variant))
        }

        nodeSorting.set(node, {
          properties: propertySort,
          variants: variantOrder,
          candidate: rawCandidate,
        })
        astNodes.push(node)
      }
    }


Review comment (bug):
```suggestion
        // If substitution fails then the candidate likely contains a call to
```

Code after:
  }

  let variantOrderMap = designSystem.getVariantOrder()

  // Create the AST
  for (let [rawCandidate, candidates] of matches) {
    let found = false

    for (let candidate of candidates) {
      let rules = designSystem.compileAstNodes(candidate)
      if (rules.length === 0) continue

      // Arbitrary values (`text-[theme(--color-red-500)]`) and arbitrary
      // properties (`[--my-var:theme(--color-red-500)]`) can contain function
      // calls so we need evaluate any functions we find there that weren't in
      // the source CSS.
      try {
        substituteFunctions(
          rules.map(({ node }) => node),
          designSystem.resolveThemeValue,
        )
      } catch (err) {
        // If substitution fails then the candidate likely contains a call to
        // `theme()` that is invalid which may be because of incorrect usage,
        // invalid arguments, or a theme key that does not exist.
        continue
      }

      found = true

      for (let { node, propertySort } of rules) {
        // Track the variant order which is a number with each bit representing a
        // variant. This allows us to sort the rules based on the order of
        // variants used.
        let variantOrder = 0n
        for (let variant of candidate.variants) {
          variantOrder |= 1n << BigInt(variantOrderMap.get(variant)!)
        }

        nodeSorting.set(node, {
          properties: propertySort,
          variants: variantOrder,
          candidate: rawCandidate,
        })
        astNodes.push(node)
      }
    }

    if (!found) {
      onInvalidCandidate?.(rawCandidate)
    }