flattenColorPalette() — tailwindcss Function Reference

Architecture documentation for the flattenColorPalette() function in flatten-color-palette.ts from the tailwindcss codebase.

Function typescript OxideEngine Extractor calls 1

Entity Profile

OxideEngine→ Extractor→ flattenColorPalette() — tailwindcss Function Reference

Dependency Diagram

graph TD
  fb8751d6_f450_b27d_e61e_cbe05f028b79["flattenColorPalette()"]
  7ea5d6e8_c93c_0fe9_ee45_7db80046a7c5["flatten-color-palette.ts"]
  fb8751d6_f450_b27d_e61e_cbe05f028b79 -->|defined in| 7ea5d6e8_c93c_0fe9_ee45_7db80046a7c5
  8a1ac231_1225_a863_301e_a2e539358b72["entries()"]
  fb8751d6_f450_b27d_e61e_cbe05f028b79 -->|calls| 8a1ac231_1225_a863_301e_a2e539358b72
  style fb8751d6_f450_b27d_e61e_cbe05f028b79 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/tailwindcss/src/compat/flatten-color-palette.ts lines 7–30

export default function flattenColorPalette(colors: Colors) {
  let result: Record<string, string> = {}

  for (let [root, children] of Object.entries(colors ?? {})) {
    if (root === '__CSS_VALUES__') continue
    if (typeof children === 'object' && children !== null) {
      for (let [parent, value] of Object.entries(flattenColorPalette(children))) {
        result[`${root}${parent === 'DEFAULT' ? '' : `-${parent}`}`] = value
      }
    } else {
      result[root] = children
    }
  }

  if ('__CSS_VALUES__' in colors) {
    for (let [key, value] of Object.entries(colors.__CSS_VALUES__)) {
      if ((Number(value) & ThemeOptions.DEFAULT) === 0) {
        result[key] = colors[key] as string
      }
    }
  }

  return result
}