Home / Function/ findRoots() — tailwindcss Function Reference

findRoots() — tailwindcss Function Reference

Architecture documentation for the findRoots() function in candidate.ts from the tailwindcss codebase.

Entity Profile

Dependency Diagram

graph TD
  2cc1f17b_e38e_b87e_1ea3_47b971c81bf9["findRoots()"]
  669e6a28_c71f_3c5e_9c53_915cede7da78["candidate.ts"]
  2cc1f17b_e38e_b87e_1ea3_47b971c81bf9 -->|defined in| 669e6a28_c71f_3c5e_9c53_915cede7da78
  d4b90da0_01b5_b21d_ff05_b37798744576["parseCandidate()"]
  d4b90da0_01b5_b21d_ff05_b37798744576 -->|calls| 2cc1f17b_e38e_b87e_1ea3_47b971c81bf9
  7ba77268_84c7_7083_8f22_251a4a791d25["parseVariant()"]
  7ba77268_84c7_7083_8f22_251a4a791d25 -->|calls| 2cc1f17b_e38e_b87e_1ea3_47b971c81bf9
  style 2cc1f17b_e38e_b87e_1ea3_47b971c81bf9 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

packages/tailwindcss/src/candidate.ts lines 861–905

function* findRoots(input: string, exists: (input: string) => boolean): Iterable<Root> {
  // If there is an exact match, then that's the root.
  if (exists(input)) {
    yield [input, null]
  }

  // Otherwise test every permutation of the input by iteratively removing
  // everything after the last dash.
  let idx = input.lastIndexOf('-')

  // Determine the root and value by testing permutations of the incoming input.
  //
  // In case of a candidate like `bg-red-500`, this looks like:
  //
  // `bg-red-500` -> No match
  // `bg-red`     -> No match
  // `bg`         -> Match
  while (idx > 0) {
    let maybeRoot = input.slice(0, idx)

    if (exists(maybeRoot)) {
      let root: Root = [maybeRoot, input.slice(idx + 1)]

      // If the leftover value is an empty string, it means that the value is an
      // invalid named value, e.g.: `bg-`. This makes the candidate invalid and we
      // can skip any further parsing.
      if (root[1] === '') break

      // Edge case: `@-…` is not valid as a variant or a utility so we want to
      // skip if an `@` is followed by a `-`. Otherwise `@-2xl:flex` and
      // `@-2xl:flex` would be considered the same.
      if (root[0] === '@' && exists('@') && input[idx] === '-') break

      yield root
    }

    idx = input.lastIndexOf('-', idx - 1)
  }

  // Try '@' variant after permutations. This allows things like `@max` of `@max-foo-bar`
  // to match before looking for `@`.
  if (input[0] === '@' && exists('@')) {
    yield ['@', input.slice(1)]
  }
}

Domain

Subdomains

Frequently Asked Questions

What does findRoots() do?
findRoots() is a function in the tailwindcss codebase, defined in packages/tailwindcss/src/candidate.ts.
Where is findRoots() defined?
findRoots() is defined in packages/tailwindcss/src/candidate.ts at line 861.
What calls findRoots()?
findRoots() is called by 2 function(s): parseCandidate, parseVariant.

Analyze Your Own Codebase

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

Try Supermodel Free