themeableValues() — tailwindcss Function Reference

Architecture documentation for the themeableValues() function in apply-config-to-theme.ts from the tailwindcss codebase.

Function typescript CompilerEngine ModuleResolution calls 3 called by 2

Entity Profile

CompilerEngine→ ModuleResolution→ themeableValues() — tailwindcss Function Reference

Dependency Diagram

graph TD
  303b7e7d_33cb_6a63_7591_f61feb3c4e3d["themeableValues()"]
  0e91912d_5423_6991_60b0_8afbca30e459["migrateTheme()"]
  0e91912d_5423_6991_60b0_8afbca30e459 -->|calls| 303b7e7d_33cb_6a63_7591_f61feb3c4e3d
  ffa1d3be_8116_7cd8_db2c_a42892f9c21a["applyConfigToTheme()"]
  ffa1d3be_8116_7cd8_db2c_a42892f9c21a -->|calls| 303b7e7d_33cb_6a63_7591_f61feb3c4e3d
  d2ce75c7_eb19_6cb1_229b_297218cbe158["walk()"]
  303b7e7d_33cb_6a63_7591_f61feb3c4e3d -->|calls| d2ce75c7_eb19_6cb1_229b_297218cbe158
  0fc0b50c_7bbc_aea5_40d1_7ce3ae8cf54d["isValidThemePrimitive()"]
  303b7e7d_33cb_6a63_7591_f61feb3c4e3d -->|calls| 0fc0b50c_7bbc_aea5_40d1_7ce3ae8cf54d
  d6d83ab5_c81e_09c3_c363_436dc65efd9b["isValidThemeTuple()"]
  303b7e7d_33cb_6a63_7591_f61feb3c4e3d -->|calls| d6d83ab5_c81e_09c3_c363_436dc65efd9b
  style 303b7e7d_33cb_6a63_7591_f61feb3c4e3d fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/tailwindcss/src/compat/apply-config-to-theme.ts lines 112–148

export function themeableValues(config: ResolvedConfig['theme']): [string[], unknown][] {
  let toAdd: [string[], unknown][] = []

  walk(config as any, [], (value, path) => {
    if (isValidThemePrimitive(value)) {
      toAdd.push([path, value])

      return WalkAction.Skip
    }

    if (isValidThemeTuple(value)) {
      toAdd.push([path, value[0]])

      for (let key of Reflect.ownKeys(value[1]) as string[]) {
        toAdd.push([[...path, `-${key}`], value[1][key]])
      }

      return WalkAction.Skip
    }

    if (Array.isArray(value) && value.every((v) => typeof v === 'string')) {
      if (path[0] === 'fontSize') {
        toAdd.push([path, value[0]])

        if (value.length >= 2) {
          toAdd.push([[...path, '-line-height'], value[1]])
        }
      } else {
        toAdd.push([path, value.join(', ')])
      }

      return WalkAction.Skip
    }
  })

  return toAdd
}