tailwindcss Architecture Docs
Home / Function/ substituteAtVariant() — tailwindcss Function Reference

substituteAtVariant() — tailwindcss Function Reference

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

Function typescript Oxide Extractor calls 4 called by 3

Entity Profile

Dependency Diagram

graph TD
  3a0ec0d5_1240_2a2d_bde3_145d361401fa["substituteAtVariant()"]
  b638ddb2_c057_1f3c_8a1a_4993ad80cd58["variants.ts"]
  3a0ec0d5_1240_2a2d_bde3_145d361401fa -->|defined in| b638ddb2_c057_1f3c_8a1a_4993ad80cd58
  e557c8a4_bb27_ee44_c462_9e238157ad04["buildDesignSystem()"]
  e557c8a4_bb27_ee44_c462_9e238157ad04 -->|calls| 3a0ec0d5_1240_2a2d_bde3_145d361401fa
  f7f9b3da_5977_1aa6_3bcb_bfc607af4e8f["parseCss()"]
  f7f9b3da_5977_1aa6_3bcb_bfc607af4e8f -->|calls| 3a0ec0d5_1240_2a2d_bde3_145d361401fa
  63907b21_884d_e864_81c9_68f20a13c40b["fromAst()"]
  63907b21_884d_e864_81c9_68f20a13c40b -->|calls| 3a0ec0d5_1240_2a2d_bde3_145d361401fa
  4982d9ce_98d4_85d9_44af_7cc47b93c482["walk()"]
  3a0ec0d5_1240_2a2d_bde3_145d361401fa -->|calls| 4982d9ce_98d4_85d9_44af_7cc47b93c482
  2a22052d_f868_4f88_0a03_2033be58172d["styleRule()"]
  3a0ec0d5_1240_2a2d_bde3_145d361401fa -->|calls| 2a22052d_f868_4f88_0a03_2033be58172d
  5719096b_0f51_ab16_7fbd_4455f835804c["parseVariant()"]
  3a0ec0d5_1240_2a2d_bde3_145d361401fa -->|calls| 5719096b_0f51_ab16_7fbd_4455f835804c
  74e35fd7_c887_0191_82e9_5c47ae4932d3["applyVariant()"]
  3a0ec0d5_1240_2a2d_bde3_145d361401fa -->|calls| 74e35fd7_c887_0191_82e9_5c47ae4932d3
  style 3a0ec0d5_1240_2a2d_bde3_145d361401fa 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
}

Domain

Subdomains

Defined In

Calls

Called By

Source

Frequently Asked Questions

What does substituteAtVariant() do?
substituteAtVariant() is a function in the tailwindcss codebase, defined in packages/tailwindcss/src/variants.ts.
Where is substituteAtVariant() defined?
substituteAtVariant() is defined in packages/tailwindcss/src/variants.ts at line 1210.
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