tailwindcss Architecture Docs
Home / File/ variants.ts — tailwindcss Source File

variants.ts — tailwindcss Source File

Architecture documentation for variants.ts, a typescript file in the tailwindcss codebase. 24 imports, 6 dependents.

File typescript OxideEngine PreProcessors 24 imports 6 dependents 7 functions 1 classes

Entity Profile

Dependency Diagram

graph LR
  db9eae47_695c_23c3_68bd_bae5bb363efe["variants.ts"]
  42640952_ea63_55f1_1ff1_00816e2980ae["ast.ts"]
  db9eae47_695c_23c3_68bd_bae5bb363efe --> 42640952_ea63_55f1_1ff1_00816e2980ae
  04953c5c_51e1_25ee_0e61_539631b1aaa9["atRoot"]
  db9eae47_695c_23c3_68bd_bae5bb363efe --> 04953c5c_51e1_25ee_0e61_539631b1aaa9
  f9b19679_c1f0_28d6_4d1a_31a10c52e42d["atRule"]
  db9eae47_695c_23c3_68bd_bae5bb363efe --> f9b19679_c1f0_28d6_4d1a_31a10c52e42d
  88bcab2f_f837_9e57_5b6a_fda72a4c3315["cloneAstNode"]
  db9eae47_695c_23c3_68bd_bae5bb363efe --> 88bcab2f_f837_9e57_5b6a_fda72a4c3315
  c203f636_607a_d332_b4c5_6a40c108f778["decl"]
  db9eae47_695c_23c3_68bd_bae5bb363efe --> c203f636_607a_d332_b4c5_6a40c108f778
  66319c06_7c38_f9ea_4bf0_2a0e18bac1a4["rule"]
  db9eae47_695c_23c3_68bd_bae5bb363efe --> 66319c06_7c38_f9ea_4bf0_2a0e18bac1a4
  36be1773_d660_31ac_0b0b_88dbd7f6f7a8["styleRule"]
  db9eae47_695c_23c3_68bd_bae5bb363efe --> 36be1773_d660_31ac_0b0b_88dbd7f6f7a8
  669e6a28_c71f_3c5e_9c53_915cede7da78["candidate.ts"]
  db9eae47_695c_23c3_68bd_bae5bb363efe --> 669e6a28_c71f_3c5e_9c53_915cede7da78
  214bac69_e516_bea4_67fa_4e9e092ced3b["compile.ts"]
  db9eae47_695c_23c3_68bd_bae5bb363efe --> 214bac69_e516_bea4_67fa_4e9e092ced3b
  adc16be1_fc13_4928_7caf_2acb3a5e9877["applyVariant"]
  db9eae47_695c_23c3_68bd_bae5bb363efe --> adc16be1_fc13_4928_7caf_2acb3a5e9877
  7fd72d4c_e95c_d849_1002_1e1c9d8aca1a["design-system.ts"]
  db9eae47_695c_23c3_68bd_bae5bb363efe --> 7fd72d4c_e95c_d849_1002_1e1c9d8aca1a
  80295787_127f_69e6_91b3_4bea3a484544["theme.ts"]
  db9eae47_695c_23c3_68bd_bae5bb363efe --> 80295787_127f_69e6_91b3_4bea3a484544
  51f244f2_138c_0d69_05db_b2df310d0f23["compare-breakpoints.ts"]
  db9eae47_695c_23c3_68bd_bae5bb363efe --> 51f244f2_138c_0d69_05db_b2df310d0f23
  0015fc82_ad3f_130f_e7fe_1e92f2f624a1["compareBreakpoints"]
  db9eae47_695c_23c3_68bd_bae5bb363efe --> 0015fc82_ad3f_130f_e7fe_1e92f2f624a1
  style db9eae47_695c_23c3_68bd_bae5bb363efe fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import { Features } from '.'
import {
  atRoot,
  atRule,
  cloneAstNode,
  decl,
  rule,
  styleRule,
  type AstNode,
  type AtRule,
  type Rule,
  type StyleRule,
} from './ast'
import { type Variant } from './candidate'
import { applyVariant } from './compile'
import type { DesignSystem } from './design-system'
import type { Theme } from './theme'
import { compareBreakpoints } from './utils/compare-breakpoints'
import { DefaultMap } from './utils/default-map'
import { isPositiveInteger } from './utils/infer-data-type'
import { segment } from './utils/segment'
import { walk, WalkAction } from './walk'

export const IS_VALID_VARIANT_NAME = /^@?[a-z0-9][a-zA-Z0-9_-]*(?<![_-])$/

type VariantFn<T extends Variant['kind']> = (
  rule: Rule,
  variant: Extract<Variant, { kind: T }>,
) => null | void

type CompareFn = (a: Variant, z: Variant) => number

export const enum Compounds {
  Never = 0,
  AtRules = 1 << 0,
  StyleRules = 1 << 1,
}

export class Variants {
  public compareFns = new Map<number, CompareFn>()
  public variants = new Map<
    string,
    {
      kind: Variant['kind']
      order: number
      applyFn: VariantFn<any>

      // The kind of rules that are allowed in this compound variant
      compoundsWith: Compounds

      // The kind of rules that are generated by this variant
      // Determines whether or not a compound variant can use this variant
      compounds: Compounds
    }
  >()

  private completions = new Map<string, () => string[]>()

  /**
   * Registering a group of variants should result in the same sort number for
// ... (1176 more lines)

Domain

Subdomains

Functions

Classes

Types

Dependencies

Imported By

Source

Frequently Asked Questions

What does variants.ts do?
variants.ts is a source file in the tailwindcss codebase, written in typescript. It belongs to the OxideEngine domain, PreProcessors subdomain.
What functions are defined in variants.ts?
variants.ts defines 7 function(s): a, compoundsForSelectors, createVariants, quoteAttributeValue, rule, substituteAtSlot, substituteAtVariant.
What does variants.ts depend on?
variants.ts imports 24 module(s): ., DefaultMap, WalkAction, applyVariant, ast.ts, atRoot, atRule, candidate.ts, and 16 more.
What files import variants.ts?
variants.ts is imported by 6 file(s): candidate.test.ts, compile.ts, design-system.ts, index.ts, plugin-api.ts, variants.test.ts.
Where is variants.ts in the architecture?
variants.ts is located at packages/tailwindcss/src/variants.ts (domain: OxideEngine, subdomain: PreProcessors, directory: packages/tailwindcss/src).

Analyze Your Own Codebase

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

Try Supermodel Free