fallow_extract/
tailwind.rs

1//! Tailwind CSS arbitrary-value detection.
2//!
3//! Tailwind "arbitrary value" utilities (`w-[13px]`, `bg-[#abc]`,
4//! `grid-cols-[1fr_2fr]`) hardcode a one-off value in markup instead of using a
5//! configured scale token. They are not wrong, but a high count is a design-
6//! token-bypass signal that no per-rule linter aggregates across a codebase, and
7//! AI-assisted edits over-produce them. This scanner finds them in markup so
8//! `fallow health --css` can surface them as candidates. The caller MUST gate on
9//! the project actually using Tailwind: the `prefix-[value]` shape is Tailwind-
10//! specific in practice but not formally exclusive.
11
12use std::sync::LazyLock;
13
14/// Matches a Tailwind arbitrary-value utility token: a lowercase kebab utility
15/// prefix followed immediately by a bracketed value, e.g. `w-[13px]`,
16/// `grid-cols-[1fr_2fr]`, `bg-[#abc]`. The bracketed value excludes single and
17/// double quotes, backticks, brackets, and whitespace, and is length-capped to
18/// avoid runaway matches.
19/// Variant prefixes (`hover:`, `md:`, `dark:`) are not captured: the utility +
20/// value token is the unit of interest, and the same `w-[13px]` under different
21/// variants is the same bypass.
22static ARBITRARY_VALUE_RE: LazyLock<regex::Regex> = LazyLock::new(|| {
23    crate::static_regex(r#"[a-z][a-z0-9]*(?:-[a-z0-9]+)*-\[[^\]\[\s"'`]{1,100}\]"#)
24});
25
26/// One use of a Tailwind arbitrary-value utility, with the 1-based line it
27/// appears on.
28#[derive(Debug, Clone, PartialEq, Eq)]
29pub struct TailwindArbitraryUse {
30    /// The matched `prefix-[value]` token.
31    pub value: String,
32    /// 1-based line in the source.
33    pub line: u32,
34}
35
36/// Scan markup source for Tailwind arbitrary-value utility tokens, one entry per
37/// occurrence. The caller must gate this on the project using Tailwind (the
38/// token shape is Tailwind-specific but not exclusive).
39#[must_use]
40pub fn scan_tailwind_arbitrary_values(source: &str) -> Vec<TailwindArbitraryUse> {
41    let mut out = Vec::new();
42    for m in ARBITRARY_VALUE_RE.find_iter(source) {
43        if is_arbitrary_variant_match(source.as_bytes(), m.end()) {
44            continue;
45        }
46        let line = 1 + source[..m.start()].bytes().filter(|&b| b == b'\n').count();
47        out.push(TailwindArbitraryUse {
48            value: m.as_str().to_owned(),
49            line: u32::try_from(line).unwrap_or(u32::MAX),
50        });
51    }
52    out
53}
54
55fn is_arbitrary_variant_match(source: &[u8], end: usize) -> bool {
56    if source.get(end) == Some(&b':') {
57        return true;
58    }
59    if source.get(end) != Some(&b'/') {
60        return false;
61    }
62    for &byte in &source[end + 1..] {
63        match byte {
64            b':' => return true,
65            b' ' | b'\n' | b'\r' | b'\t' | b'"' | b'\'' | b'`' => return false,
66            _ => {}
67        }
68    }
69    false
70}
71
72#[cfg(test)]
73mod tests {
74    use super::*;
75
76    fn values(source: &str) -> Vec<String> {
77        scan_tailwind_arbitrary_values(source)
78            .into_iter()
79            .map(|u| u.value)
80            .collect()
81    }
82
83    #[test]
84    fn matches_common_arbitrary_value_shapes() {
85        let v = values(r#"<div class="w-[13px] bg-[#abc] grid-cols-[1fr_2fr] top-[7px]">x</div>"#);
86        assert_eq!(
87            v,
88            vec!["w-[13px]", "bg-[#abc]", "grid-cols-[1fr_2fr]", "top-[7px]"]
89        );
90    }
91
92    #[test]
93    fn ignores_plain_scale_utilities() {
94        // No brackets -> not an arbitrary value.
95        let v = values(r#"<div class="w-4 bg-red-500 grid-cols-3">x</div>"#);
96        assert!(v.is_empty(), "got {v:?}");
97    }
98
99    #[test]
100    fn does_not_match_attribute_selectors() {
101        // `a[href]` / `[data-x]` are not `prefix-[value]` (no dash before bracket).
102        let v = values("a[href] { color: red; } [data-state] { color: blue; }");
103        assert!(v.is_empty(), "got {v:?}");
104    }
105
106    #[test]
107    fn reports_one_based_line() {
108        let uses = scan_tailwind_arbitrary_values("\n\n<i class=\"h-[3px]\"></i>");
109        assert_eq!(uses.len(), 1);
110        assert_eq!(uses[0].line, 3);
111    }
112
113    #[test]
114    fn captures_utility_prefix_not_variant() {
115        // The `hover:` variant is not part of the captured token; the utility +
116        // value is.
117        let v = values(r#"<a class="hover:w-[20px]">x</a>"#);
118        assert_eq!(v, vec!["w-[20px]"]);
119    }
120
121    #[test]
122    fn ignores_arbitrary_variants() {
123        let v = values(
124            r#"<div class="data-[side=left]:slide-in min-[320px]:text-sm group-data-[collapsible=icon]:hidden group-data-[size=sm]/dialog:grid peer-data-[size=lg]/button:top-2 hover:w-[20px]">x</div>"#,
125        );
126        assert_eq!(v, vec!["w-[20px]"]);
127    }
128
129    #[test]
130    fn keeps_arbitrary_value_modifiers() {
131        let v = values(r#"<div class="bg-[#fff]/50 ring-[3px]">x</div>"#);
132        assert_eq!(v, vec!["bg-[#fff]", "ring-[3px]"]);
133    }
134}
fallow_extract/tailwind.rs

fallow_extract/
tailwind.rs
