functional() — tailwindcss Function Reference

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

Function typescript CompilerEngine ModuleResolution calls 1 called by 1

Entity Profile

CompilerEngine→ ModuleResolution→ functional() — tailwindcss Function Reference

Dependency Diagram

graph TD
  d657fe4b_1aa1_3869_f6e6_3b0086c85983["functional()"]
  7c96535c_85cb_d6bf_efe4_875fba595c4f["createVariants()"]
  7c96535c_85cb_d6bf_efe4_875fba595c4f -->|calls| d657fe4b_1aa1_3869_f6e6_3b0086c85983
  13f9b85f_58c4_5390_3b22_04d00b93361b["set()"]
  d657fe4b_1aa1_3869_f6e6_3b0086c85983 -->|calls| 13f9b85f_58c4_5390_3b22_04d00b93361b
  style d657fe4b_1aa1_3869_f6e6_3b0086c85983 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/tailwindcss/src/variants.ts lines 112–124

  functional(
    name: string,
    applyFn: VariantFn<'functional'>,
    { compounds, order }: { compounds?: Compounds; order?: number } = {},
  ) {
    this.set(name, {
      kind: 'functional',
      applyFn,
      compoundsWith: Compounds.Never,
      compounds: compounds ?? Compounds.StyleRules,
      order,
    })
  }