fix(canonicalize): collapse arbitrary values into shorthand utilities

aptinio · aptinio · commit ef598fd2c10e · 2026-03-22T08:37:39.000+08:00
`dynamicUtilities` — which discovers collapse targets by swapping utility roots — only handled named values. Arbitrary values like `px-[1.2rem] py-[1.2rem]` were never collapsed into `p-[1.2rem]`, even though they are equivalent. Relax the guard to allow root-swapping for arbitrary values (e.g., `px` → `p`). Fixes #19835
diff --git a/packages/tailwindcss/src/canonicalize-candidates.test.ts b/packages/tailwindcss/src/canonicalize-candidates.test.ts
@@ -1310,3 +1310,19 @@ test(
     )
   },
 )
+
+test('collapse canonicalization works for arbitrary values', { timeout }, async () => {
+  let designSystem = await designSystems.get(__dirname).get(css`
+    @import 'tailwindcss';
+  `)
+
+  let options: CanonicalizeOptions = {
+    collapse: true,
+    logicalToPhysical: true,
+    rem: 16,
+  }
+
+  expect(
+    designSystem.canonicalizeCandidates(['px-[1.2rem]', 'py-[1.2rem]', 'text-left'], options),
+  ).toEqual(['text-left', 'p-[1.2rem]'])
+})
diff --git a/packages/tailwindcss/src/canonicalize-candidates.ts b/packages/tailwindcss/src/canonicalize-candidates.ts
@@ -321,10 +321,7 @@ function collapseCandidates(options: InternalCanonicalizeOptions, candidates: st
       if (relevantProperties.size === 0) return result
 
       for (let parsedCandidate of parseCandidate(designSystem, candidate)) {
-        if (
-          parsedCandidate.kind !== 'functional' ||
-          parsedCandidate.value?.kind !== 'named' // Necessary for bare values
-        ) {
+        if (parsedCandidate.kind !== 'functional' || parsedCandidate.value === null) {
           continue
         }
 
