cssContext() — tailwindcss Function Reference

Architecture documentation for the cssContext() function in ast.ts from the tailwindcss codebase.

Function typescript PostCSSPlugin AstTransformation calls 1 called by 3

Entity Profile

PostCSSPlugin→ AstTransformation→ cssContext() — tailwindcss Function Reference

Dependency Diagram

graph TD
  4883e410_7ef0_3846_5ee9_bba194796fa1["cssContext()"]
  d0cd8e91_7dbc_4e3d_f621_705d53f7a49e["applyCompatibilityHooks()"]
  d0cd8e91_7dbc_4e3d_f621_705d53f7a49e -->|calls| 4883e410_7ef0_3846_5ee9_bba194796fa1
  9056089b_151f_3027_844b_242ce55294db["upgradeToFullPluginSupport()"]
  9056089b_151f_3027_844b_242ce55294db -->|calls| 4883e410_7ef0_3846_5ee9_bba194796fa1
  95cb326e_6b59_0903_0c96_d221fca5c2b1["parseCss()"]
  95cb326e_6b59_0903_0c96_d221fca5c2b1 -->|calls| 4883e410_7ef0_3846_5ee9_bba194796fa1
  a36324cc_cbd0_023c_1dc6_8ce6c9c41dda["context()"]
  4883e410_7ef0_3846_5ee9_bba194796fa1 -->|calls| a36324cc_cbd0_023c_1dc6_8ce6c9c41dda
  style 4883e410_7ef0_3846_5ee9_bba194796fa1 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/tailwindcss/src/ast.ts lines 188–216

export function cssContext(
  ctx: VisitContext<AstNode>,
): VisitContext<AstNode> & { context: Record<string, string | boolean> } {
  return {
    depth: ctx.depth,
    get context() {
      let context: Record<string, string | boolean> = {}
      for (let child of ctx.path()) {
        if (child.kind === 'context') {
          Object.assign(context, child.context)
        }
      }

      // Once computed, we never need to compute this again
      Object.defineProperty(this, 'context', { value: context })
      return context
    },
    get parent() {
      let parent = (this.path().pop() as Extract<AstNode, { nodes: AstNode[] }>) ?? null

      // Once computed, we never need to compute this again
      Object.defineProperty(this, 'parent', { value: parent })
      return parent
    },
    path() {
      return ctx.path().filter((n) => n.kind !== 'context')
    },
  }
}