tailwindcss Architecture Docs
Home / File/ design-system.ts — tailwindcss Source File

design-system.ts — tailwindcss Source File

Architecture documentation for design-system.ts, a typescript file in the tailwindcss codebase. 38 imports, 54 dependents.

File typescript UpgradeToolkit Codemods 38 imports 54 dependents 1 functions

Entity Profile

Dependency Diagram

graph LR
  7fd72d4c_e95c_d849_1002_1e1c9d8aca1a["design-system.ts"]
  42640952_ea63_55f1_1ff1_00816e2980ae["ast.ts"]
  7fd72d4c_e95c_d849_1002_1e1c9d8aca1a --> 42640952_ea63_55f1_1ff1_00816e2980ae
  47b4c875_7e44_6ff9_fb06_16ecf9254223["optimizeAst"]
  7fd72d4c_e95c_d849_1002_1e1c9d8aca1a --> 47b4c875_7e44_6ff9_fb06_16ecf9254223
  2da63033_d079_7b37_5cfb_3877674a70b9["toCss"]
  7fd72d4c_e95c_d849_1002_1e1c9d8aca1a --> 2da63033_d079_7b37_5cfb_3877674a70b9
  669e6a28_c71f_3c5e_9c53_915cede7da78["candidate.ts"]
  7fd72d4c_e95c_d849_1002_1e1c9d8aca1a --> 669e6a28_c71f_3c5e_9c53_915cede7da78
  d4b90da0_01b5_b21d_ff05_b37798744576["parseCandidate"]
  7fd72d4c_e95c_d849_1002_1e1c9d8aca1a --> d4b90da0_01b5_b21d_ff05_b37798744576
  7ba77268_84c7_7083_8f22_251a4a791d25["parseVariant"]
  7fd72d4c_e95c_d849_1002_1e1c9d8aca1a --> 7ba77268_84c7_7083_8f22_251a4a791d25
  87ba7eab_3a52_d53e_dfd4_e507e9763b55["printCandidate"]
  7fd72d4c_e95c_d849_1002_1e1c9d8aca1a --> 87ba7eab_3a52_d53e_dfd4_e507e9763b55
  02a5a469_a54f_7532_8b33_d407c3c7f34a["printVariant"]
  7fd72d4c_e95c_d849_1002_1e1c9d8aca1a --> 02a5a469_a54f_7532_8b33_d407c3c7f34a
  214bac69_e516_bea4_67fa_4e9e092ced3b["compile.ts"]
  7fd72d4c_e95c_d849_1002_1e1c9d8aca1a --> 214bac69_e516_bea4_67fa_4e9e092ced3b
  e57db502_ed4e_4f14_1b2a_b25af3c0477d["compileAstNodes"]
  7fd72d4c_e95c_d849_1002_1e1c9d8aca1a --> e57db502_ed4e_4f14_1b2a_b25af3c0477d
  f611bd99_74d3_1161_f7f5_4c1d73c377e5["compileCandidates"]
  7fd72d4c_e95c_d849_1002_1e1c9d8aca1a --> f611bd99_74d3_1161_f7f5_4c1d73c377e5
  2189e39a_5595_cbd9_3bbe_eaf87ccf42a2["css-functions.ts"]
  7fd72d4c_e95c_d849_1002_1e1c9d8aca1a --> 2189e39a_5595_cbd9_3bbe_eaf87ccf42a2
  cbcebe85_5027_3db6_180a_0ceaa8acbbfb["substituteFunctions"]
  7fd72d4c_e95c_d849_1002_1e1c9d8aca1a --> cbcebe85_5027_3db6_180a_0ceaa8acbbfb
  65419ae8_33ea_931a_d1ac_1549de232b64["intellisense.ts"]
  7fd72d4c_e95c_d849_1002_1e1c9d8aca1a --> 65419ae8_33ea_931a_d1ac_1549de232b64
  style 7fd72d4c_e95c_d849_1002_1e1c9d8aca1a fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import { Polyfills } from '.'
import { optimizeAst, toCss, type AstNode } from './ast'
import {
  parseCandidate,
  parseVariant,
  printCandidate,
  printVariant,
  type Candidate,
  type Variant,
} from './candidate'
import { compileAstNodes, compileCandidates } from './compile'
import { substituteFunctions } from './css-functions'
import {
  canonicalizeCandidates,
  getClassList,
  getVariants,
  type CanonicalizeOptions,
  type ClassEntry,
  type VariantEntry,
} from './intellisense'
import { getClassOrder } from './sort'
import type { SourceLocation } from './source-maps/source'
import { Theme, ThemeOptions, type ThemeKey } from './theme'
import { Utilities, createUtilities, withAlpha } from './utilities'
import { DefaultMap } from './utils/default-map'
import { extractUsedVariables } from './utils/variables'
import { Variants, createVariants, substituteAtVariant } from './variants'
import { WalkAction, walk } from './walk'

export const enum CompileAstFlags {
  None = 0,
  RespectImportant = 1 << 0,
}

export type DesignSystem = {
  theme: Theme
  utilities: Utilities
  variants: Variants

  invalidCandidates: Set<string>

  // Whether to mark utility declarations as !important
  important: boolean

  getClassOrder(classes: string[]): [string, bigint | null][]
  getClassList(): ClassEntry[]
  getVariants(): VariantEntry[]

  parseCandidate(candidate: string): Readonly<Candidate>[]
  parseVariant(variant: string): Readonly<Variant> | null
  compileAstNodes(candidate: Candidate, flags?: CompileAstFlags): ReturnType<typeof compileAstNodes>

  printCandidate(candidate: Candidate): string
  printVariant(variant: Variant): string

  getVariantOrder(): Map<Variant, number>
  resolveThemeValue(path: string, forceInline?: boolean): string | undefined

  trackUsedVariables(raw: string): void
  canonicalizeCandidates(candidates: string[], options?: CanonicalizeOptions): string[]
// ... (196 more lines)

Domain

Subdomains

Functions

Types

Dependencies

Imported By

Source

Frequently Asked Questions

What does design-system.ts do?
design-system.ts is a source file in the tailwindcss codebase, written in typescript. It belongs to the UpgradeToolkit domain, Codemods subdomain.
What functions are defined in design-system.ts?
design-system.ts defines 1 function(s): buildDesignSystem.
What does design-system.ts depend on?
design-system.ts imports 38 module(s): ., DefaultMap, Theme, ThemeOptions, Utilities, Variants, WalkAction, ast.ts, and 30 more.
What files import design-system.ts?
design-system.ts is imported by 54 file(s): apply-compat-hooks.ts, apply-config-to-theme.test.ts, apply-config-to-theme.ts, apply-keyframes-to-theme.test.ts, apply-keyframes-to-theme.ts, apply.ts, ast.test.ts, ast.ts, and 46 more.
Where is design-system.ts in the architecture?
design-system.ts is located at packages/tailwindcss/src/design-system.ts (domain: UpgradeToolkit, subdomain: Codemods, directory: packages/tailwindcss/src).

Analyze Your Own Codebase

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

Try Supermodel Free