compoundsWith() — tailwindcss Function Reference

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

Function typescript OxideEngine Scanner calls 2 called by 1

Entity Profile

OxideEngine→ Scanner→ compoundsWith() — tailwindcss Function Reference

Dependency Diagram

graph TD
  b1efac17_4504_4725_555d_d07e8cf1a9ea["compoundsWith()"]
  ff716ee9_bd1e_1568_4100_c1d5b3ab8daa["Variants"]
  b1efac17_4504_4725_555d_d07e8cf1a9ea -->|defined in| ff716ee9_bd1e_1568_4100_c1d5b3ab8daa
  c1a769fc_95ca_ceea_62f9_aedeeedf7c66["createVariants()"]
  c1a769fc_95ca_ceea_62f9_aedeeedf7c66 -->|calls| b1efac17_4504_4725_555d_d07e8cf1a9ea
  9b8bd17a_1b05_f86d_02dc_1f5d07860201["get()"]
  b1efac17_4504_4725_555d_d07e8cf1a9ea -->|calls| 9b8bd17a_1b05_f86d_02dc_1f5d07860201
  759ab8d0_0e80_5789_e945_a5f814874e59["compoundsForSelectors()"]
  b1efac17_4504_4725_555d_d07e8cf1a9ea -->|calls| 759ab8d0_0e80_5789_e945_a5f814874e59
  style b1efac17_4504_4725_555d_d07e8cf1a9ea 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
  }