types.ts — tailwindcss Source File
Architecture documentation for types.ts, a typescript file in the tailwindcss codebase. 2 imports, 17 dependents.
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>
}
Domain
Subdomains
Functions
Types
Dependencies
Imported By
- packages/tailwindcss/src/compat/apply-compat-hooks.ts
- packages/tailwindcss/src/compat/apply-config-to-theme.ts
- packages/tailwindcss/src/compat/apply-keyframes-to-theme.ts
- packages/tailwindcss/src/compat/container.ts
- packages/tailwindcss/src/compat/config/create-compat-config.ts
- packages/tailwindcss/src/compat/dark-mode.ts
- packages/tailwindcss/src/compat/default-theme.ts
- packages/tailwindcss/src/index.ts
- packages/@tailwindcss-upgrade/src/codemods/config/migrate-js-config.ts
- packages/@tailwindcss-upgrade/src/codemods/css/migrate-media-screen.test.ts
- packages/@tailwindcss-upgrade/src/codemods/template/migrate-modernize-arbitrary-values.test.ts
- packages/tailwindcss/src/compat/plugin-api.ts
- packages/tailwindcss/src/compat/plugin-functions.ts
- packages/tailwindcss/src/plugin.ts
- packages/tailwindcss/src/compat/config/resolve-config.ts
- packages/tailwindcss/src/compat/screens-config.ts
- packages/tailwindcss/src/compat/theme-variants.ts
Source
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