Home / Function/ themeableValues() — tailwindcss Function Reference

themeableValues() — tailwindcss Function Reference

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

Function typescript OxideCore Scanner calls 3 called by 2

Entity Profile

Dependency Diagram

graph TD
  3e33c90a_e618_0b36_8589_88cf333c1482["themeableValues()"]
  77d1d37f_6021_dc8c_6d04_0c3b07e3ad19["migrateTheme()"]
  77d1d37f_6021_dc8c_6d04_0c3b07e3ad19 -->|calls| 3e33c90a_e618_0b36_8589_88cf333c1482
  0a0af711_c5b8_1a31_60fe_678ff9771f13["applyConfigToTheme()"]
  0a0af711_c5b8_1a31_60fe_678ff9771f13 -->|calls| 3e33c90a_e618_0b36_8589_88cf333c1482
  fd9d5dae_4dbc_46b8_74f1_c7c51a381d0a["walk()"]
  3e33c90a_e618_0b36_8589_88cf333c1482 -->|calls| fd9d5dae_4dbc_46b8_74f1_c7c51a381d0a
  ad4acb79_6726_ed2b_53ee_1b0f68700924["isValidThemePrimitive()"]
  3e33c90a_e618_0b36_8589_88cf333c1482 -->|calls| ad4acb79_6726_ed2b_53ee_1b0f68700924
  fa96a286_4ca6_d0e0_aef1_360d90b3660a["isValidThemeTuple()"]
  3e33c90a_e618_0b36_8589_88cf333c1482 -->|calls| fa96a286_4ca6_d0e0_aef1_360d90b3660a
  style 3e33c90a_e618_0b36_8589_88cf333c1482 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
}

Domain

Subdomains

Frequently Asked Questions

What does themeableValues() do?
themeableValues() is a function in the tailwindcss codebase.
What does themeableValues() call?
themeableValues() calls 3 function(s): isValidThemePrimitive, isValidThemeTuple, walk.
What calls themeableValues()?
themeableValues() is called by 2 function(s): applyConfigToTheme, migrateTheme.

Analyze Your Own Codebase

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

Try Supermodel Free