Home / Function/ substituteAtVariant() — tailwindcss Function Reference

substituteAtVariant() — tailwindcss Function Reference

Architecture documentation for the substituteAtVariant() function in variants.ts from the tailwindcss codebase.

Entity Profile

Dependency Diagram

graph TD
  716eb081_2da3_764c_1bd4_89abf211e018["substituteAtVariant()"]
  cebe77e1_f0f2_aeee_417e_2192f5790344["buildDesignSystem()"]
  cebe77e1_f0f2_aeee_417e_2192f5790344 -->|calls| 716eb081_2da3_764c_1bd4_89abf211e018
  26086ff1_0d4f_fdb2_3fc4_d0c999f90a8c["parseCss()"]
  26086ff1_0d4f_fdb2_3fc4_d0c999f90a8c -->|calls| 716eb081_2da3_764c_1bd4_89abf211e018
  43c6ae59_76f1_6f53_dfa2_f3151fd259d1["fromAst()"]
  43c6ae59_76f1_6f53_dfa2_f3151fd259d1 -->|calls| 716eb081_2da3_764c_1bd4_89abf211e018
  e9d556bc_f22d_356c_1bd2_27442c34b5c7["walk()"]
  716eb081_2da3_764c_1bd4_89abf211e018 -->|calls| e9d556bc_f22d_356c_1bd2_27442c34b5c7
  c3b56f1d_0d90_0f17_2f55_85f3419d74bd["styleRule()"]
  716eb081_2da3_764c_1bd4_89abf211e018 -->|calls| c3b56f1d_0d90_0f17_2f55_85f3419d74bd
  ca76ae68_c9c0_d977_a6d8_8ba86685bf25["parseVariant()"]
  716eb081_2da3_764c_1bd4_89abf211e018 -->|calls| ca76ae68_c9c0_d977_a6d8_8ba86685bf25
  8bb120ad_8027_cede_007f_1d5351f7ca96["applyVariant()"]
  716eb081_2da3_764c_1bd4_89abf211e018 -->|calls| 8bb120ad_8027_cede_007f_1d5351f7ca96
  style 716eb081_2da3_764c_1bd4_89abf211e018 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/tailwindcss/src/variants.ts lines 1210–1235

export function substituteAtVariant(ast: AstNode[], designSystem: DesignSystem): Features {
  let features = Features.None
  walk(ast, (variantNode) => {
    if (variantNode.kind !== 'at-rule' || variantNode.name !== '@variant') return

    // Starting with the `&` rule node
    let node = styleRule('&', variantNode.nodes)

    let variant = variantNode.params

    let variantAst = designSystem.parseVariant(variant)
    if (variantAst === null) {
      throw new Error(`Cannot use \`@variant\` with unknown variant: ${variant}`)
    }

    let result = applyVariant(node, variantAst, designSystem.variants)
    if (result === null) {
      throw new Error(`Cannot use \`@variant\` with variant: ${variant}`)
    }

    // Update the variant at-rule node, to be the `&` rule node
    features |= Features.Variants
    return WalkAction.Replace(node)
  })
  return features
}

Subdomains

Frequently Asked Questions

What does substituteAtVariant() do?
substituteAtVariant() is a function in the tailwindcss codebase.
What does substituteAtVariant() call?
substituteAtVariant() calls 4 function(s): applyVariant, parseVariant, styleRule, walk.
What calls substituteAtVariant()?
substituteAtVariant() is called by 3 function(s): buildDesignSystem, fromAst, parseCss.

Analyze Your Own Codebase

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

Try Supermodel Free