migrateDarkMode() — tailwindcss Function Reference

Architecture documentation for the migrateDarkMode() function in migrate-js-config.ts from the tailwindcss codebase.

Function typescript CommandLineInterface Codemods calls 1 called by 1

Entity Profile

CommandLineInterface→ Codemods→ migrateDarkMode() — tailwindcss Function Reference

Dependency Diagram

graph TD
  f801b865_ef5a_08da_7238_161aad3ec371["migrateDarkMode()"]
  ffe9c87e_35ad_f431_9625_80fc875792a7["migrate-js-config.ts"]
  f801b865_ef5a_08da_7238_161aad3ec371 -->|defined in| ffe9c87e_35ad_f431_9625_80fc875792a7
  617e9831_5cd2_4ca6_2c65_f89e3720cfd8["migrateJsConfig()"]
  617e9831_5cd2_4ca6_2c65_f89e3720cfd8 -->|calls| f801b865_ef5a_08da_7238_161aad3ec371
  123b2f50_f029_34ef_b875_ea5cfbf14ec8["darkModePlugin()"]
  f801b865_ef5a_08da_7238_161aad3ec371 -->|calls| 123b2f50_f029_34ef_b875_ea5cfbf14ec8
  style f801b865_ef5a_08da_7238_161aad3ec371 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/@tailwindcss-upgrade/src/codemods/config/migrate-js-config.ts lines 292–325

function migrateDarkMode(unresolvedConfig: Config & { darkMode: any }): string {
  let variant: string | string[] = ''
  let addVariant = (_name: string, _variant: string) => (variant = _variant)
  let config = () => unresolvedConfig.darkMode
  darkModePlugin({ config, addVariant })

  if (variant === '') {
    return ''
  }

  if (!Array.isArray(variant)) {
    variant = [variant]
  }

  if (variant.length === 1 && !variant[0].includes('{')) {
    return `\n@tw-bucket custom-variant {\n@custom-variant dark (${variant[0]});\n}\n`
  }

  let customVariant = ''
  for (let variantName of variant) {
    // Convert to the block syntax if a block is used
    if (variantName.includes('{')) {
      customVariant += variantName.replace('}', '{ @slot }}') + '\n'
    } else {
      customVariant += variantName + '{ @slot }\n'
    }
  }

  if (customVariant !== '') {
    return `\n@tw-bucket custom-variant {\n@custom-variant dark {${customVariant}};\n}\n`
  }

  return ''
}