Home / File/ types.ts — tailwindcss Source File

types.ts — tailwindcss Source File

Architecture documentation for types.ts, a typescript file in the tailwindcss codebase. 2 imports, 17 dependents.

File typescript UpgradeToolkit TemplateAnalysis 2 imports 17 dependents 1 functions

Entity Profile

Dependency Diagram

graph LR
  c1272aed_91bb_73df_0746_d55fa9b302fd["types.ts"]
  af1a6ece_0432_a556_fd63_8cb4a91f12ad["plugin-api.ts"]
  c1272aed_91bb_73df_0746_d55fa9b302fd --> af1a6ece_0432_a556_fd63_8cb4a91f12ad
  9b5d2e3d_392e_c654_c350_1352ed70f5e8["resolve-config.ts"]
  c1272aed_91bb_73df_0746_d55fa9b302fd --> 9b5d2e3d_392e_c654_c350_1352ed70f5e8
  b2ba3368_7330_fe20_4543_9cafa8cfedc0["migrate-js-config.ts"]
  b2ba3368_7330_fe20_4543_9cafa8cfedc0 --> c1272aed_91bb_73df_0746_d55fa9b302fd
  2a2fbf55_42db_0140_9db5_094f5369e747["migrate-media-screen.test.ts"]
  2a2fbf55_42db_0140_9db5_094f5369e747 --> c1272aed_91bb_73df_0746_d55fa9b302fd
  ee1d35bf_4335_a131_a900_1f9f4b90a0e1["migrate-modernize-arbitrary-values.test.ts"]
  ee1d35bf_4335_a131_a900_1f9f4b90a0e1 --> c1272aed_91bb_73df_0746_d55fa9b302fd
  daaadd53_16ee_21c6_12d9_8feaac80a91b["apply-compat-hooks.ts"]
  daaadd53_16ee_21c6_12d9_8feaac80a91b --> c1272aed_91bb_73df_0746_d55fa9b302fd
  245c850a_c551_a2cf_854e_bba95b5a1339["apply-config-to-theme.ts"]
  245c850a_c551_a2cf_854e_bba95b5a1339 --> c1272aed_91bb_73df_0746_d55fa9b302fd
  0620c0e4_5f2c_149b_94e3_e0fed99b95d8["apply-keyframes-to-theme.ts"]
  0620c0e4_5f2c_149b_94e3_e0fed99b95d8 --> c1272aed_91bb_73df_0746_d55fa9b302fd
  834afcdc_4770_404f_cd35_c37419fcda33["create-compat-config.ts"]
  834afcdc_4770_404f_cd35_c37419fcda33 --> c1272aed_91bb_73df_0746_d55fa9b302fd
  9b5d2e3d_392e_c654_c350_1352ed70f5e8["resolve-config.ts"]
  9b5d2e3d_392e_c654_c350_1352ed70f5e8 --> c1272aed_91bb_73df_0746_d55fa9b302fd
  340330a5_8048_84e2_77ad_8f6da2f8b8d0["container.ts"]
  340330a5_8048_84e2_77ad_8f6da2f8b8d0 --> c1272aed_91bb_73df_0746_d55fa9b302fd
  e89fb45a_8bfc_fa37_8fa2_d0dcfee110db["dark-mode.ts"]
  e89fb45a_8bfc_fa37_8fa2_d0dcfee110db --> c1272aed_91bb_73df_0746_d55fa9b302fd
  1b5321a5_0fcc_2351_1f22_0d4bed4c097e["default-theme.ts"]
  1b5321a5_0fcc_2351_1f22_0d4bed4c097e --> c1272aed_91bb_73df_0746_d55fa9b302fd
  af1a6ece_0432_a556_fd63_8cb4a91f12ad["plugin-api.ts"]
  af1a6ece_0432_a556_fd63_8cb4a91f12ad --> c1272aed_91bb_73df_0746_d55fa9b302fd
  20b59de8_11c6_2432_2a83_24f6f6e741a7["plugin-functions.ts"]
  20b59de8_11c6_2432_2a83_24f6f6e741a7 --> c1272aed_91bb_73df_0746_d55fa9b302fd
  09dea224_4143_d043_b336_121f3fdb8f12["screens-config.ts"]
  09dea224_4143_d043_b336_121f3fdb8f12 --> c1272aed_91bb_73df_0746_d55fa9b302fd
  style c1272aed_91bb_73df_0746_d55fa9b302fd fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import type { Plugin, PluginWithConfig } from '../plugin-api'
import type { PluginUtils } from './resolve-config'

export type ResolvableTo<T> = T | ((utils: PluginUtils) => T)

export interface UserConfig {
  presets?: UserConfig[]
  theme?: ThemeConfig
  plugins?: Plugin[]
}

export type ThemeValue = ResolvableTo<Record<string, unknown>> | null | undefined
export type ResolvedThemeValue = Record<string, unknown> | null

export type ThemeConfig = Record<string, ThemeValue> & {
  extend?: Record<string, ThemeValue>
}

export interface ResolvedConfig {
  theme: Record<string, Record<string, unknown>>
  plugins: PluginWithConfig[]
}

// Content support
type ContentFile = string | { raw: string; extension?: string }

export interface UserConfig {
  content?: ContentFile[] | { relative?: boolean; files: ContentFile[] }
}

type ResolvedContent = { base: string; pattern: string } | { raw: string; extension?: string }

export interface ResolvedContentConfig {
  files: ResolvedContent[]
}

export interface ResolvedConfig {
  content: ResolvedContentConfig
}

// Dark Mode support
type DarkModeStrategy =
  // No dark mode support
  | false

  // Use the `media` query strategy.
  | 'media'

  // Use the `class` strategy, which requires a `.dark` class on the `html`.
  | 'class'

  // Use the `class` strategy with a custom class instead of `.dark`.
  | ['class', string]

  // Use the `selector` strategy — same as `class` but uses `:where()` for more predictable behavior
  | 'selector'

  // Use the `selector` strategy with a custom selector instead of `.dark`.
  | ['selector', string]

  // Use the `variant` strategy, which allows you to completely customize the selector
  // It takes a string or an array of strings, which are passed directly to `addVariant()`
  | ['variant', string | string[]]

export interface UserConfig {
  darkMode?: DarkModeStrategy
}

export interface ResolvedConfig {
  darkMode: DarkModeStrategy | null
}

// `prefix` support
export interface UserConfig {
  prefix?: string
}

export interface ResolvedConfig {
  prefix: string
}

// `blocklist` support
export interface UserConfig {
  blocklist?: string[]
}

export interface ResolvedConfig {
  blocklist: string[]
}

// `important` support
export interface UserConfig {
  important?: boolean | string
}

export interface ResolvedConfig {
  important: boolean | string
}

// `future` key support
export interface UserConfig {
  future?: 'all' | Record<string, boolean>
}

export interface ResolvedConfig {
  future: Record<string, boolean>
}

// `experimental` key support
export interface UserConfig {
  experimental?: 'all' | Record<string, boolean>
}

export interface ResolvedConfig {
  experimental: Record<string, boolean>
}

Subdomains

Functions

Frequently Asked Questions

What does types.ts do?
types.ts is a source file in the tailwindcss codebase, written in typescript. It belongs to the UpgradeToolkit domain, TemplateAnalysis subdomain.
What functions are defined in types.ts?
types.ts defines 1 function(s): T.
What does types.ts depend on?
types.ts imports 2 module(s): plugin-api.ts, resolve-config.ts.
What files import types.ts?
types.ts is imported by 17 file(s): apply-compat-hooks.ts, apply-config-to-theme.ts, apply-keyframes-to-theme.ts, container.ts, create-compat-config.ts, dark-mode.ts, default-theme.ts, index.ts, and 9 more.
Where is types.ts in the architecture?
types.ts is located at packages/tailwindcss/src/compat/config/types.ts (domain: UpgradeToolkit, subdomain: TemplateAnalysis, directory: packages/tailwindcss/src/compat/config).

Analyze Your Own Codebase

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

Try Supermodel Free