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
Defined In
Called By
Source
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