resolveWith() — tailwindcss Function Reference

Architecture documentation for the resolveWith() function in theme.ts from the tailwindcss codebase.

Function typescript CompilerEngine ModuleResolution calls 1 called by 1

Entity Profile

CompilerEngine→ ModuleResolution→ resolveWith() — tailwindcss Function Reference

Dependency Diagram

graph TD
  50b26c27_6fae_3a51_c382_756098b9ce8a["resolveWith()"]
  84f8ccf2_2af5_fa7c_53f2_954b21183738["resolveValueFunction()"]
  84f8ccf2_2af5_fa7c_53f2_954b21183738 -->|calls| 50b26c27_6fae_3a51_c382_756098b9ce8a
  060c1795_30ba_0381_42f1_be224df086e8["get()"]
  50b26c27_6fae_3a51_c382_756098b9ce8a -->|calls| 060c1795_30ba_0381_42f1_be224df086e8
  style 50b26c27_6fae_3a51_c382_756098b9ce8a fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/tailwindcss/src/theme.ts lines 245–274

  resolveWith(
    candidateValue: string,
    themeKeys: ThemeKey[],
    nestedKeys: `--${string}`[] = [],
  ): [string, Record<string, string>] | null {
    let themeKey = this.#resolveKey(candidateValue, themeKeys)

    if (!themeKey) return null

    let extra = {} as Record<string, string>
    for (let name of nestedKeys) {
      let nestedKey = `${themeKey}${name}`
      let nestedValue = this.values.get(nestedKey)!
      if (!nestedValue) continue

      if (nestedValue.options & ThemeOptions.INLINE) {
        extra[name] = nestedValue.value
      } else {
        extra[name] = this.#var(nestedKey)!
      }
    }

    let value = this.values.get(themeKey)!

    if (value.options & ThemeOptions.INLINE) {
      return [value.value, extra]
    }

    return [this.#var(themeKey)!, extra]
  }