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. 39 imports, 54 dependents.

File typescript Oxide PreProcessors 39 imports 54 dependents 1 functions

Entity Profile

Dependency Diagram

graph LR
  bdedd2f6_da4b_69dc_e990_0814b59fbe6e["design-system.ts"]
  b9cbffa4_c352_cf3c_268f_cbb174fb3a47["ast.ts"]
  bdedd2f6_da4b_69dc_e990_0814b59fbe6e --> b9cbffa4_c352_cf3c_268f_cbb174fb3a47
  9f2a64dc_05ff_3425_1af8_f2dbd33c3b9a["optimizeAst"]
  bdedd2f6_da4b_69dc_e990_0814b59fbe6e --> 9f2a64dc_05ff_3425_1af8_f2dbd33c3b9a
  9b49f3c6_0c8d_5c62_965c_30a1db6499f8["toCss"]
  bdedd2f6_da4b_69dc_e990_0814b59fbe6e --> 9b49f3c6_0c8d_5c62_965c_30a1db6499f8
  ba6fca27_7720_5839_0f92_bc2abb8db636["candidate.ts"]
  bdedd2f6_da4b_69dc_e990_0814b59fbe6e --> ba6fca27_7720_5839_0f92_bc2abb8db636
  7d328a86_10c6_b5c1_6390_36f4fffe9c14["parseCandidate"]
  bdedd2f6_da4b_69dc_e990_0814b59fbe6e --> 7d328a86_10c6_b5c1_6390_36f4fffe9c14
  5719096b_0f51_ab16_7fbd_4455f835804c["parseVariant"]
  bdedd2f6_da4b_69dc_e990_0814b59fbe6e --> 5719096b_0f51_ab16_7fbd_4455f835804c
  2de86ba2_90a4_8c2d_db18_154bb1a1564f["printCandidate"]
  bdedd2f6_da4b_69dc_e990_0814b59fbe6e --> 2de86ba2_90a4_8c2d_db18_154bb1a1564f
  fe10eff5_7df3_1553_1351_7802a9ea48a5["printVariant"]
  bdedd2f6_da4b_69dc_e990_0814b59fbe6e --> fe10eff5_7df3_1553_1351_7802a9ea48a5
  eea0ec96_6369_abc2_64b3_490868392e31["compile.ts"]
  bdedd2f6_da4b_69dc_e990_0814b59fbe6e --> eea0ec96_6369_abc2_64b3_490868392e31
  8b088e47_7f37_81e9_fe8a_5da6d3f5e245["compileAstNodes"]
  bdedd2f6_da4b_69dc_e990_0814b59fbe6e --> 8b088e47_7f37_81e9_fe8a_5da6d3f5e245
  ad08c258_e5c2_4cd4_c935_0925a940458e["compileCandidates"]
  bdedd2f6_da4b_69dc_e990_0814b59fbe6e --> ad08c258_e5c2_4cd4_c935_0925a940458e
  1648a493_13b2_8170_f86b_607e088d9565["css-functions.ts"]
  bdedd2f6_da4b_69dc_e990_0814b59fbe6e --> 1648a493_13b2_8170_f86b_607e088d9565
  6bed2e43_7855_2758_8396_9f9e9a11be52["substituteFunctions"]
  bdedd2f6_da4b_69dc_e990_0814b59fbe6e --> 6bed2e43_7855_2758_8396_9f9e9a11be52
  aed99406_85bd_0230_7820_e5b6fa3efe70["intellisense.ts"]
  bdedd2f6_da4b_69dc_e990_0814b59fbe6e --> aed99406_85bd_0230_7820_e5b6fa3efe70
  style bdedd2f6_da4b_69dc_e990_0814b59fbe6e 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 Oxide domain, PreProcessors 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 39 module(s): ., DefaultMap, SourceLocation, Theme, ThemeOptions, Utilities, Variants, WalkAction, and 31 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: Oxide, 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