compileAstNodes() — tailwindcss Function Reference

Architecture documentation for the compileAstNodes() function in compile.ts from the tailwindcss codebase.

Function typescript OxideCore PreProcessors calls 5 called by 2

Entity Profile

OxideCore→ PreProcessors→ compileAstNodes() — tailwindcss Function Reference

Dependency Diagram

graph TD
  70b7448d_fd76_0d4b_e635_18f49f8ba1d6["compileAstNodes()"]
  19c89ebd_512f_276a_754b_c043c41d7bd4["compileCandidates()"]
  19c89ebd_512f_276a_754b_c043c41d7bd4 -->|calls| 70b7448d_fd76_0d4b_e635_18f49f8ba1d6
  c58d3214_88d6_f4fc_257f_8e84def5b24f["buildDesignSystem()"]
  c58d3214_88d6_f4fc_257f_8e84def5b24f -->|calls| 70b7448d_fd76_0d4b_e635_18f49f8ba1d6
  d7c9a9e2_d3cf_5ace_a853_63ae8fff0a66["compileBaseUtility()"]
  70b7448d_fd76_0d4b_e635_18f49f8ba1d6 -->|calls| d7c9a9e2_d3cf_5ace_a853_63ae8fff0a66
  7cf1fe2b_69a4_05dc_ae13_d3eebe4e10fc["escape()"]
  70b7448d_fd76_0d4b_e635_18f49f8ba1d6 -->|calls| 7cf1fe2b_69a4_05dc_ae13_d3eebe4e10fc
  df11b455_a977_4fb7_977f_c494c709e369["getPropertySort()"]
  70b7448d_fd76_0d4b_e635_18f49f8ba1d6 -->|calls| df11b455_a977_4fb7_977f_c494c709e369
  8b06de1f_66e2_f789_0e56_49cfdbb91386["applyImportant()"]
  70b7448d_fd76_0d4b_e635_18f49f8ba1d6 -->|calls| 8b06de1f_66e2_f789_0e56_49cfdbb91386
  666b100e_8313_09d0_334c_b0fc7e6b9d54["applyVariant()"]
  70b7448d_fd76_0d4b_e635_18f49f8ba1d6 -->|calls| 666b100e_8313_09d0_334c_b0fc7e6b9d54
  style 70b7448d_fd76_0d4b_e635_18f49f8ba1d6 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/tailwindcss/src/compile.ts lines 123–175

export function compileAstNodes(
  candidate: Candidate,
  designSystem: DesignSystem,
  flags: CompileAstFlags,
) {
  let asts = compileBaseUtility(candidate, designSystem)
  if (asts.length === 0) return []

  let respectImportant = designSystem.important && Boolean(flags & CompileAstFlags.RespectImportant)

  let rules: {
    node: AstNode
    propertySort: {
      order: number[]
      count: number
    }
  }[] = []

  let selector = `.${escape(candidate.raw)}`

  for (let nodes of asts) {
    let propertySort = getPropertySort(nodes)

    // If the candidate itself is important then we want to always mark
    // the utility as important. However, at a design system level we want
    // to be able to opt-out when using things like `@apply`
    if (candidate.important || respectImportant) {
      applyImportant(nodes)
    }

    let node: StyleRule = {
      kind: 'rule',
      selector,
      nodes,
    }

    for (let variant of candidate.variants) {
      let result = applyVariant(node, variant, designSystem.variants)

      // When the variant results in `null`, it means that the variant cannot be
      // applied to the rule. Discard the candidate and continue to the next
      // one.
      if (result === null) return []
    }

    rules.push({
      node,
      propertySort,
    })
  }

  return rules
}