Home / Function/ toKeyPath() — tailwindcss Function Reference

toKeyPath() — tailwindcss Function Reference

Architecture documentation for the toKeyPath() function in to-key-path.ts from the tailwindcss codebase.

Entity Profile

Dependency Diagram

graph TD
  1b250eae_0bea_d404_ca9e_42da26c56b45["toKeyPath()"]
  e3e0c6b9_7cc3_bd6c_ce01_14f8efdc5a0d["to-key-path.ts"]
  1b250eae_0bea_d404_ca9e_42da26c56b45 -->|defined in| e3e0c6b9_7cc3_bd6c_ce01_14f8efdc5a0d
  904b969f_df9e_eb9f_fedd_18eea0cfe028["migratePreflight()"]
  904b969f_df9e_eb9f_fedd_18eea0cfe028 -->|calls| 1b250eae_0bea_d404_ca9e_42da26c56b45
  dc9585e4_0c18_e5de_1302_9b707f3ab6ed["createConverter()"]
  dc9585e4_0c18_e5de_1302_9b707f3ab6ed -->|calls| 1b250eae_0bea_d404_ca9e_42da26c56b45
  77acef4a_feff_6e9f_7c6b_2b6942c9ad63["createConverterCache()"]
  77acef4a_feff_6e9f_7c6b_2b6942c9ad63 -->|calls| 1b250eae_0bea_d404_ca9e_42da26c56b45
  2efa0a66_c375_c031_24ad_1f7509bb9b14["buildPluginApi()"]
  2efa0a66_c375_c031_24ad_1f7509bb9b14 -->|calls| 1b250eae_0bea_d404_ca9e_42da26c56b45
  d30151e4_eee8_a868_f516_c653088f4a03["createThemeFn()"]
  d30151e4_eee8_a868_f516_c653088f4a03 -->|calls| 1b250eae_0bea_d404_ca9e_42da26c56b45
  f712ed47_45d4_4e5a_dd73_fdefa1da71da["segment()"]
  1b250eae_0bea_d404_ca9e_42da26c56b45 -->|calls| f712ed47_45d4_4e5a_dd73_fdefa1da71da
  style 1b250eae_0bea_d404_ca9e_42da26c56b45 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/tailwindcss/src/utils/to-key-path.ts lines 18–54

export function toKeyPath(path: string) {
  let keypath: string[] = []

  for (let part of segment(path, '.')) {
    if (!part.includes('[')) {
      keypath.push(part)
      continue
    }

    let currentIndex = 0

    while (true) {
      let bracketL = part.indexOf('[', currentIndex)
      let bracketR = part.indexOf(']', bracketL)

      if (bracketL === -1 || bracketR === -1) {
        break
      }

      // Add the part before the bracket as a key
      if (bracketL > currentIndex) {
        keypath.push(part.slice(currentIndex, bracketL))
      }

      // Add the part inside the bracket as a key
      keypath.push(part.slice(bracketL + 1, bracketR))
      currentIndex = bracketR + 1
    }

    // Add the part after the last bracket as a key
    if (currentIndex <= part.length - 1) {
      keypath.push(part.slice(currentIndex))
    }
  }

  return keypath
}

Domain

Subdomains

Calls

Frequently Asked Questions

What does toKeyPath() do?
toKeyPath() is a function in the tailwindcss codebase, defined in packages/tailwindcss/src/utils/to-key-path.ts.
Where is toKeyPath() defined?
toKeyPath() is defined in packages/tailwindcss/src/utils/to-key-path.ts at line 18.
What does toKeyPath() call?
toKeyPath() calls 1 function(s): segment.
What calls toKeyPath()?
toKeyPath() is called by 5 function(s): buildPluginApi, createConverter, createConverterCache, createThemeFn, migratePreflight.

Analyze Your Own Codebase

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

Try Supermodel Free