compoundsWith() — tailwindcss Function Reference

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

Function typescript CompilerEngine ModuleResolution calls 2 called by 1

Entity Profile

CompilerEngine→ ModuleResolution→ compoundsWith() — tailwindcss Function Reference

Dependency Diagram

graph TD
  322c45ea_3835_3229_6b47_7ac91365ee73["compoundsWith()"]
  7c96535c_85cb_d6bf_efe4_875fba595c4f["createVariants()"]
  7c96535c_85cb_d6bf_efe4_875fba595c4f -->|calls| 322c45ea_3835_3229_6b47_7ac91365ee73
  395d4822_c2e4_54d6_7a44_627f1105fbeb["get()"]
  322c45ea_3835_3229_6b47_7ac91365ee73 -->|calls| 395d4822_c2e4_54d6_7a44_627f1105fbeb
  828655d7_fafb_f7a4_ba36_e6b356a78fbc["compoundsForSelectors()"]
  322c45ea_3835_3229_6b47_7ac91365ee73 -->|calls| 828655d7_fafb_f7a4_ba36_e6b356a78fbc
  style 322c45ea_3835_3229_6b47_7ac91365ee73 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/tailwindcss/src/variants.ts lines 160–193

  compoundsWith(parent: string, child: string | Variant) {
    let parentInfo = this.variants.get(parent)
    let childInfo =
      typeof child === 'string'
        ? this.variants.get(child)
        : child.kind === 'arbitrary'
          ? // This isn't strictly necessary but it'll allow us to bail quickly
            // when parsing candidates
            { compounds: compoundsForSelectors([child.selector]) }
          : this.variants.get(child.root)

    // One of the variants don't exist
    if (!parentInfo || !childInfo) return false

    // The parent variant is not a compound variant
    if (parentInfo.kind !== 'compound') return false

    // The variant `parent` may _compound with_ `child` if `parent` supports the
    // rules that `child` generates. We instead use static registration metadata
    // about what `parent` and `child` support instead of trying to apply the
    // variant at runtime to see if the rules are compatible.

    // The `child` variant cannot compound *ever*
    if (childInfo.compounds === Compounds.Never) return false

    // The `parent` variant cannot compound *ever*
    // This shouldn't ever happen because `kind` is `compound`
    if (parentInfo.compoundsWith === Compounds.Never) return false

    // Any rule that `child` may generate must be supported by `parent`
    if ((parentInfo.compoundsWith & childInfo.compounds) === 0) return false

    return true
  }